update

src/components/home/HomePage.vue

@@ -1,5 +1,8 @@
 <template>
-  <div class="wrapper">
+  <div class="wrapper" v-loading="loading"
+       element-loading-text="拼命加载中"
+       element-loading-spinner="el-icon-loading"
+       element-loading-background="var(--theme-bg-color)">
     <LeftSide :category="category"></LeftSide>
     <div class="main-container">
       <div class="content-wrapper">
@@ -42,6 +45,7 @@ export default {
     return {
       navList: [],
       category: [],
+      loading:true,
     }
   },
   // 监听,当路由发生变化的时候执行
@@ -70,10 +74,10 @@ export default {
         method: 'post',
         url: '/api/UrlAndCate/disposeBookmarkExhibitedToJson',
       }).then(function (res) {
+
         if (res.data.data) {
           _this.category = res.data.data;
         } else {
-          return false;
         }
 
       }).catch((error) => {
@@ -98,6 +102,9 @@ export default {
       }).then(function (res) {
         if (res.data) {
           _this.navList = res.data;
+          _this.loading=false;
+        }else {
+          _this.loading=true;
         }
       }).catch((error) => {
         Vue.prototype.$notify.error({

src/components/home/LeftSide.vue

@@ -64,7 +64,7 @@ export default {
       }else if(this.$route.path==='/news') {
         if (node.name) {
           this.$router.push({
-            path: '/home',
+            path: '/news',
             query: {
               name: `#${node.name}`,
             }

src/components/home/NavList.vue

@@ -27,7 +27,7 @@
                   effect="dark" close-delay="2000">
         <div class="MyPopover" slot="content">
           <span style="font-size:12px !important;">【{{ nav.name }}】手机二维码</span><br/><br/>
-          <div style="width:100% ;text-align: center"><img v-if="nav.userId && nav.icon" style="width:150px"
+          <div style="width:100% ;text-align: center"><img v-if="nav.urlId && nav.icon" style="width:150px"
                                                            :src="getQR(nav.urlId,nav.icon)"/>
           </div>
         </div>

src/components/hotNews/HotNews.vue

@@ -2,12 +2,12 @@
   <div class="wrapper">
     <LeftSide :category="category"></LeftSide>
     <div class="main">
-      <NewsCard :loading="loading" :news="baidu"></NewsCard>
+      <NewsCard id="百度热搜榜" :loading="loading" :news="baidu"></NewsCard>
-      <NewsCard :loading="loading" :news="douying"></NewsCard>
+      <NewsCard id="抖音热搜榜" :loading="loading" :news="douying"></NewsCard>
-      <NewsCard :loading="loading" :news="weibo"></NewsCard>
+      <NewsCard id="微博热搜榜" :loading="loading" :news="weibo"></NewsCard>
-      <NewsCard :loading="loading" :news="zhihu"></NewsCard>
+      <NewsCard id="知乎热搜榜" :loading="loading" :news="zhihu"></NewsCard>
-      <NewsCard :loading="loading" :news="bili"></NewsCard>
+      <NewsCard id="哔哩哔哩热搜榜" :loading="loading" :news="bili"></NewsCard>
-      <NewsCard :loading="loading" :news="toutiao"></NewsCard>
+      <NewsCard id="今日头条热搜榜" :loading="loading" :news="toutiao"></NewsCard>
     </div>
   </div>
 
@@ -23,8 +23,34 @@ export default {
   components: {LeftSide, NewsCard},
   data() {
     return {
+
+      category: [
+        {
+          name:'百度热搜榜',
+          childUC:[],
+        },
+        {
+          name:'抖音热搜榜',
+          childUC:[],
+        },
+        {
+          name:'微博热搜榜',
+          childUC:[],
+        },
+        {
+          name:'知乎热搜榜',
+          childUC:[],
+        },
+        {
+          name:'哔哩哔哩热搜榜',
+          childUC:[],
+        },
+        {
+          name:'今日头条热搜榜',
+          childUC:[],
+        },
+          ],
       loading: true,
-      category:[],
       baidu: {
         title: "百度热搜榜",
         hot: [],
@@ -57,6 +83,10 @@ export default {
       }
     }
   },
+  // 监听,当路由发生变化的时候执行
+  watch: {
+    '$route': 'getPath'
+  },
   mounted() {
     this.getBaiDuHot();
     this.getDouyingHot();
@@ -64,34 +94,14 @@ export default {
     this.getZhiHuHot();
     this.getBiliHot();
     this.getTouTiaoHot();
-    this.getCategories();
   },
   created() {
 
   },
   computed: {},
   methods: {
-
+    getPath() {
-    getCategories() {
+      document.querySelector(this.$route.query.name).scrollIntoView(true)
-      let _this = this;
-      axios({
-        method: 'post',
-        url: '/api/UrlAndCate/disposeBookmarkExhibitedToJson',
-      }).then(function (res) {
-        // console.log(res);
-        if (res.data.data) {
-          _this.category = res.data.data;
-        } else {
-          return false;
-        }
-
-      }).catch((error) => {
-        Vue.prototype.$notify.error({
-          title: '错误',
-          message: error,
-          offset: 0
-        });
-      })
     },
     getBaiDuHot() {
       let _this = this;

src/components/hotNews/NewsCard.vue

@@ -21,7 +21,7 @@
         </div>
       </div>
       <div style="text-align: end;margin-right: 10px">
-        <i class="refresh el-icon-refresh"></i>
+        <i class="refresh el-icon-refresh" @click="refresh"></i>
       </div>
     </div>
   </div>
@@ -47,8 +47,10 @@ export default {
 
   },
   methods: {
+    refresh(){
 
     }
+  }
 
 }
 </script>

src/components/myNav/MyNav.vue

@@ -1,5 +1,8 @@
 <template>
-  <div class="wrapper">
+  <div class="wrapper" v-loading="loading"
+       element-loading-text="拼命加载中"
+       element-loading-spinner="el-icon-loading"
+       element-loading-background="var(--theme-bg-color)">
     <LeftSide :category="category"></LeftSide>
     <div class="main-container">
       <div class="content-wrapper">
@@ -32,6 +35,7 @@ export default {
     return {
       userNavList: [],
       category: [],
+      loading:true,
     }
   },
   // 监听,当路由发生变化的时候执行
@@ -99,8 +103,12 @@ export default {
             userId: localStorage.getItem("userId"),
           }
         }).then(function (res) {
+          // console.log(res);
           if (res.data) {
             _this.userNavList = res.data;
+            _this.loading=false;
+          }else {
+            _this.loading=true;
           }
 
         }).catch((error) => {

src/components/setting/home/HomeEChart.vue

@@ -12,245 +12,18 @@ export default {
   name: "HomeEChart",
   data() {
     return {
-      dataList :
+
-          [{
-        name: "南海诸岛",
-        value: 0
-      },
-        {
-          name: '北京',
-          value: 54
-        },
-        {
-          name: '天津',
-          value: 13
-        },
-        {
-          name: '上海',
-          value: 40
-        },
-        {
-          name: '重庆',
-          value: 75
-        },
-        {
-          name: '河北',
-          value: 13
-        },
-        {
-          name: '河南',
-          value: 83
-        },
-        {
-          name: '云南',
-          value: 11
-        },
-        {
-          name: '辽宁',
-          value: 19
-        },
-        {
-          name: '黑龙江',
-          value: 15
-        },
-        {
-          name: '湖南',
-          value: 69
-        },
-        {
-          name: '安徽',
-          value: 60
-        },
-        {
-          name: '山东',
-          value: 39
-        },
-        {
-          name: '新疆',
-          value: 4
-        },
-        {
-          name: '江苏',
-          value: 31
-        },
-        {
-          name: '浙江',
-          value: 104
-        },
-        {
-          name: '江西',
-          value: 36
-        },
-        {
-          name: '湖北',
-          value: 1052
-        },
-        {
-          name: '广西',
-          value: 33
-        },
-        {
-          name: '甘肃',
-          value: 7
-        },
-        {
-          name: '山西',
-          value: 9
-        },
-        {
-          name: '内蒙古',
-          value: 7
-        },
-        {
-          name: '陕西',
-          value: 22
-        },
-        {
-          name: '吉林',
-          value: 4
-        },
-        {
-          name: '福建',
-          value: 18
-        },
-        {
-          name: '贵州',
-          value: 5
-        },
-        {
-          name: '广东',
-          value: 98
-        },
-        {
-          name: '青海',
-          value: 1
-        },
-        {
-          name: '西藏',
-          value: 0
-        },
-        {
-          name: '四川',
-          value: 44
-        },
-        {
-          name: '宁夏',
-          value: 4
-        },
-        {
-          name: '海南',
-          value: 22
-        },
-        {
-          name: '台湾',
-          value: 3
-        },
-        {
-          name: '香港',
-          value: 5
-        },
-        {
-          name: '澳门',
-          value: 5
-        }
-      ],
     }
   },
   mounted() {
-      this.eChartChina();
+
   },
   created() {
 
   },
   computed: {},
   methods: {
-    eChartChina(){
-      var myChart = echarts.init(document.getElementById('main'));
 
-       var option = {
-        tooltip: {
-          triggerOn: "click",
-          formatter: function(e, t, n) {
-            return .5 == e.value ? e.name + "：登录次数" : e.seriesName + "<br />" + e.name + "：" + e.value
-          }
-        },
-        visualMap: {
-          min: 0,
-          max: 1000,
-          top: 10,
-          // left: 26,
-          // bottom: 40,
-          showLabel: !0,
-          text: ["高", "低"],
-          pieces: [{
-            gt: 100,
-            label: "> 100 次",
-            color: "#7f1100"
-          }, {
-            gte: 10,
-            lte: 100,
-            label: "10 - 100 次",
-            color: "#ff5428"
-          }, {
-            gte: 1,
-            lt: 10,
-            label: "1 - 9 次",
-            color: "#ff8c71"
-          },  {
-            value: 0,
-            color: "#ffffff"
-          }],
-          show: !0
-        },
-        geo: {
-          map: "china",
-          roam: !1,
-          scaleLimit: {
-            min: 1,
-            max: 2
-          },
-          zoom: 1,
-          top: 50,
-          label: {
-            normal: {
-              show: !0,
-              fontSize: "14",
-              color: "rgba(0,0,0,0.7)"
-            }
-          },
-          itemStyle: {
-            normal: {
-              //shadowBlur: 50,
-              //shadowColor: 'rgba(0, 0, 0, 0.2)',
-              borderColor: "rgba(0, 0, 0, 0.2)"
-            },
-            emphasis: {
-              areaColor: "#f2d5ad",
-              shadowOffsetX: 0,
-              shadowOffsetY: 0,
-              borderWidth: 0
-            }
-          }
-        },
-        series: [{
-          name: "登录次数",
-          type: "map",
-          geoIndex: 0,
-          data: this.dataList
-        }]
-      };
-
-      myChart.clear();
-      myChart.setOption(option, true);
-      //图表大小变动从新渲染，动态自适应
-      window.addEventListener("resize", function () {
-        myChart.resize();
-      });
-      myChart.resize({
-        width: 600,
-        height: 500
-      });
-    }
   }
 
 }

src/components/setting/home/InfoCard.vue

@@ -1,17 +1,22 @@
 <template>
   <div class="info-card">
     <div class="icon">
-      <img style="width: 70px;height: 70px;margin-left: 10px" src="@/assets/img/bookmark.png">
+      <img style="width: 70px;height: 70px;margin-left: 10px" :src="icon">
     </div>
     <div class="content">
-      <span class="content-info">4655 /个</span>
+      <span class="content-info">{{info}} /个</span>
-      <span class="content-tag">书签个数</span>
+      <span class="content-tag">{{name}}</span>
     </div>
   </div>
 </template>
 <script>
 export default {
   name: "InfoCard",
+  props:{
+    info:String,
+    icon:String,
+    name:String,
+  },
   data() {
     return {}
   },

src/components/setting/home/PersonalHomePage.vue

@@ -6,36 +6,77 @@
       </div>
       <div style="flex-direction: column;display: flex">
         <div style="display: flex;flex-direction: row;margin-left: 40px;margin-top: 10px">
-          <InfoCard></InfoCard>
+          <InfoCard v-if="this.infoData.urlListNum && this.infoData.name1 && this.infoData.icon1" :info="this.infoData.urlListNum" :name="this.infoData.name1" :icon="this.infoData.icon1"></InfoCard>
-          <InfoCard style="margin-left: 10px"></InfoCard>
+          <InfoCard v-if="this.infoData.cateNum && this.infoData.name2 && this.infoData.icon2" :info="this.infoData.cateNum" :name="this.infoData.name2" :icon="this.infoData.icon2" style="margin-left: 10px"></InfoCard>
         </div>
-        <HomeEChart style="margin-left: 40px"></HomeEChart>
+        <!--        <HomeEChart style="margin-left: 40px"></HomeEChart>-->
       </div>
-
-
     </div>
-
   </div>
 </template>
 <script>
 import PersonalInfoCard from "@/components/setting/home/PersonalInfoCard.vue";
 import InfoCard from "@/components/setting/home/InfoCard.vue";
 import HomeEChart from "@/components/setting/home/HomeEChart.vue";
+import axios from "axios";
+import Vue from "vue";
 
 export default {
   name: "PersonalHomePage",
   components: {HomeEChart, InfoCard, PersonalInfoCard},
   data() {
-    return {}
+    return {
+      infoData:{
+        name1:'书签',
+        name2:'分类',
+        urlListNum:null,
+        cateNum:null,
+        icon1:'https://imgbed.landaiqing.space/img/1/2023/12/25/1_65893ab12d3f2_1703492272311_20231225.webp',
+        icon2:'https://imgbed.landaiqing.space/img/1/2023/12/25/1_65893af89eecf_1703492343951_20231225.webp',
+      },
+
+    }
   },
   mounted() {
-
+    this.getUserInfo();
   },
   created() {
 
   },
   computed: {},
-  methods: {}
+  methods: {
+    getUserInfo() {
+      let _this = this;
+      if(localStorage.getItem("Authorization") && localStorage.getItem("userId")){
+        axios({
+          method: 'get',
+          url: '/api/getCateAndListNum',
+          params:{
+            userId:localStorage.getItem("userId")
+          }
+        }).then(function (res) {
+          if(res.data){
+            _this.infoData.cateNum=res.data.cateNum;
+            _this.infoData.urlListNum=res.data.urlListNum;
+
+          }
+        }).catch((error) => {
+          Vue.prototype.$notify.error({
+            title: '错误',
+            message: error,
+            offset: 0
+          });
+        })
+      }else {
+        Vue.prototype.$notify.error({
+          title: '错误',
+          message: "登录状态失效，请重新登录！",
+          offset: 0
+        });
+      }
+
+    },
+  }
 
 }
 </script>

src/components/setting/importExport/Export.vue

@@ -2,7 +2,7 @@
   <div>
     <div class="dl">
       <div class="dl-box">
-        <div class="dl-button">
+        <div  class="dl-button" @click="downloadByUserId">
           <div class="arrow"></div>
           <div class="basket">
             <div class="basket-top"></div>
@@ -29,6 +29,9 @@
   </div>
 </template>
 <script>
+import axios from "axios";
+import Vue from "vue";
+
 export default {
   name: "Export",
   data() {
@@ -50,7 +53,68 @@ export default {
   },
   computed: {},
   methods: {
+    getCurrentDate() {
+      let now = new Date();
+      let year = now.getFullYear();
+      let month = now.getMonth() + 1;
+      let day = now.getDate();
+      return year + "-" + month + "-" + day;
+    },
+    downloadByUserId(){
+        let _this = this;
+        if (localStorage.getItem('userId')&&localStorage.getItem('Authorization')) {
+          axios({
+            method: 'post',
+            url: '/api/UrlAndCate/dataDownload/excel',
+            responseType: 'blob',
+            params: {
+              userId:localStorage.getItem('userId'),
+            },
+          }).then(function (res) {
+            if(res.status!==200){
+              Vue.prototype.$notify.error({
+                    title: '错误',
+                    message: "导出失败！",
+                    offset: 0
+                  });
+            }
+            else {
+              setTimeout(()=>{
+                Vue.prototype.$notify({
+                  title: '成功',
+                  message: ('i', {style: 'color: teal'} , "导出成功！"),
+                  type: 'success',
+                  offset: 0
+                });
+                const link = document.createElement('a')
+                const blob = new Blob([res.data], { type: 'application/vnd.ms-excel' })
+                link.style.display = 'none'
+                link.href = URL.createObjectURL(blob)
+                link.setAttribute('download', `data.xls`)
+                document.body.appendChild(link)
+                link.click()
+                document.body.removeChild(link)
+              },4000)
 
+
+            }
+          }).catch((error) => {
+            Vue.prototype.$notify.error({
+              title: '错误',
+              message: error,
+              offset: 0
+            });
+          })
+
+        } else {
+          Vue.prototype.$notify.error({
+            title: '错误',
+            message: '登录状态失效，请重新登录！',
+            offset: 0
+          });
+        }
+
+    }
   }
 
 }

src/components/setting/importExport/Import.vue

@@ -4,13 +4,14 @@
       class="upload-demo"
       drag
       action=""
+      accept=".html"
       :on-change="handleChange"
       :auto-upload="false"
       :limit="1"
       multiple>
     <i class="el-icon-upload"></i>
     <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-    <div class="el-upload__tip" slot="tip">只能上传html文件</div>
+    <div class="el-upload__tip" slot="tip">【说明】:只能上传html文件,相同文件只能上传一次</div>
   </el-upload>
 </template>
 <script>
@@ -57,7 +58,7 @@ export default {
     },
     disposeJson(json) {
       let _this = this;
-      if (localStorage.getItem('userId')) {
+      if (localStorage.getItem('userId')&&localStorage.getItem('Authorization')) {
         axios({
           method: 'post',
           url: '/api/UrlAndCate/disposeJson',

src/components/setting/importExport/ImportExport.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="main">
+  <div class="main-container">
     <div style="margin-top: 20px;display: flex;align-items: center;flex-direction: column">
       <span class="title">导入数据</span>
       <div>
@@ -17,8 +17,8 @@
   </div>
 </template>
 <script>
-import Import from "@/components/setting/onsite/Import.vue";
+import Import from "@/components/setting/importExport/Import.vue";
-import Export from "@/components/setting/onsite/Export.vue";
+import Export from "@/components/setting/importExport/Export.vue";
 
 export default {
   name: "ImportExport",

src/components/setting/onsite/BaseSettings.vue

@@ -8,60 +8,56 @@
       <div>
         <el-card style="width:550px;background-color: var(--theme-bg-color);border-width: 5px;margin-top:10px;border-color:var(--border-color)">
           <el-form v-model="from" style="font-family: SimHei;font-weight:600;margin-top:20px">
-            <el-form-item prop="username">
+            <el-form-item prop="email_sendEmail">
+              <span class="min-title">发件邮箱<br></span>
+              <el-input
+                  prefix-icon="el-icon-s-promotion"
+                  v-model="from.email_sendEmail"
+                  placeholder="邮箱"
+                  style="width: 500px"
+                  @change="submitNewConfig('email_sendEmail',from.email_sendEmail)"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item prop="email_sendEmail">
               <span class="min-title">邮箱用户名<br></span>
               <el-input
-                  v-model="from.username"
+                  v-model="from.email_sendEmail"
                   prefix-icon="el-icon-user"
                   placeholder="邮箱用户名"
                   auto-complete="off"
                   style="width: 500px"
+                  disabled
+
               ></el-input>
             </el-form-item>
-            <el-form-item prop="password">
+            <el-form-item prop="email_password">
               <span class="min-title">邮箱密码/授权码<br></span>
               <el-input
                   prefix-icon="el-icon-unlock"
                   :type="passwordVisible"
-                  v-model="from.password"
+                  v-model="from.email_password"
                   placeholder="密码"
                   auto-complete="new-password"
                   style="width: 500px"
+                  @change="submitNewConfig('email_password',from.email_password)"
               >
                 <i slot="suffix" :class="icon" @click="showPass"></i>
               </el-input>
             </el-form-item>
-            <el-form-item prop="email">
+
-              <span class="min-title">发件邮箱<br></span>
-              <el-input
-                  prefix-icon="el-icon-s-promotion"
-                  v-model="from.email"
-                  placeholder="邮箱"
-                  style="width: 500px"
-              >
-              </el-input>
-            </el-form-item>
             <el-form-item prop="smtp">
               <span class="min-title">SMTP地址<br></span>
               <el-input
                   prefix-icon="el-icon-connection"
-                  v-model="from.smtp"
+                  v-model="from.email_host"
                   placeholder="smtp"
                   style="width: 500px"
+                  @change="submitNewConfig('email_host',from.email_host)"
               >
               </el-input>
 
             </el-form-item>
-            <el-form-item prop="port">
-              <span class="min-title">端口<br></span>
-              <el-input
-                  prefix-icon="el-icon-place"
-                  v-model="from.port"
-                  placeholder="port"
-                  style="width: 500px"
-              >
-              </el-input>
-            </el-form-item>
           </el-form>
         </el-card>
 
@@ -97,20 +93,14 @@
         </span>
         <div style="height:15px;width:100%"></div>
       </el-card>
-        <!--          <div style="display: flex;flex-direction: row;align-items: flex-start">-->
+
-        <!--          <span class="min-title">常用邮箱的STMP地址:<br>-->
-        <!--          QQ邮箱：smtp.qq.com<br>-->
-        <!--          网易163：smtp.163.com<br>-->
-        <!--          Gmail：smtp.gmail.com<br>-->
-        <!--        </span>-->
-        <!--            <span style="margin-left: 20px" class="min-title">常用邮箱的端口:<br>-->
-        <!--          SMTP：25<br>-->
-        <!--          SMTP SSL：465<br></span>-->
-        <!--          </div>-->
     </div>
   </div>
 </template>
 <script>
+import axios from "axios";
+import Vue from "vue";
+
 export default {
   name: "BaseSettings",
   components: {},
@@ -119,22 +109,102 @@ export default {
       passwordVisible: "password",
       icon: "el-icon-view",
       from: {
-        username: null,
+        email_sendEmail: null,
-        password: null,
+        email_password: null,
-        email: null,
+        email_host: null,
-        smtp: null,
-        port: null,
       }
     }
   },
   mounted() {
-
+    this.getAllEmailConfig();
   },
   created() {
 
   },
   computed: {},
   methods: {
+
+    submitNewConfig(name,value){
+      if(localStorage.getItem('userRole') === '0' && localStorage.getItem('Authorization')){
+        if(value!==""){
+          axios({
+            method: 'get',
+            url: '/api/updateConfig',
+            params:{
+              name:name,
+              value:value,
+              type:'String'
+            }
+          }).then(function (res) {
+            console.log(res.data);
+            if(res.data==="更新成功!"){
+              Vue.prototype.$notify.success({
+                title: 'OK',
+                message: "修改成功",
+                offset: 0
+              });
+            }else{
+              Vue.prototype.$notify.error({
+                title: '错误',
+                message: "修改失败！",
+                offset: 0
+              });
+            }
+
+          }).catch((error) => {
+            Vue.prototype.$notify.error({
+              title: '错误',
+              message: error,
+              offset: 0
+            });
+          })
+        }else{
+          Vue.prototype.$notify.error({
+            title: '错误',
+            message: "不能为空",
+            offset: 0
+          });
+        }
+      }else{
+        Vue.prototype.$notify.error({
+          title: '错误',
+          message: "权限不够！",
+          offset: 0
+        });
+      }
+
+    },
+
+    getAllEmailConfig(){
+      let _this=this;
+      if(localStorage.getItem('userRole') === '0' && localStorage.getItem('Authorization')){
+        axios({
+          method: 'get',
+          url: '/api/getAllEmailConfig',
+        }).then(function (res) {
+          if(res.data){
+            _this.from.email_host=res.data.email_host;
+            _this.from.email_password=res.data.email_password;
+            _this.from.email_sendEmail=res.data.email_sendEmail;
+          }
+        }).catch((error) => {
+          Vue.prototype.$notify.error({
+            title: '错误',
+            message: error,
+            offset: 0
+          });
+        })
+      }else{
+        Vue.prototype.$notify.error({
+          title: '错误',
+          message: "权限不够！",
+          offset: 0
+        });
+      }
+
+    },
+
+
     // 显示密码
     showPass() {
       if (this.passwordVisible === "text") {

src/components/setting/onsite/OnSiteSetting.vue

@@ -14,7 +14,7 @@ export default {
     return {
       tabList:[
         {path:'/baseSettings',libel:'基础设置'},
-        {path:'/importExport',libel:'导入导出'},
+
       ]
     }
   },

src/components/setting/system/Upload.vue

@@ -1,32 +1,29 @@
 <template>
   <el-upload
-      class="upload-demo"
+      class="avatar-uploader"
-      ref="upload"
+      action
-      :limit="limitNum"
+      :show-file-list="false"
-      :class="{hide:hideUploadEdit}"
+      :http-request="selectPicUpload"
-      :on-remove="handleRemove"
-      :on-change="handleEditChange"
-      :http-request="ImgUploadSectionFile"
-      :before-upload="beforeAvatarUpload"
-      :with-credentials="true"
       :auto-upload="true"
-      accept=".png, .jpg"
+      :before-upload="beforeAvatarUpload"
-      action=""
+      :on-remove="handleRemove"
-      list-type="picture-card"
+      :limit="1"
-      :file-list="fileList"
+  >
-      style="z-index:-999"
+    <img v-if="imageUrl" width="200px" height="200px" :src="imageUrl" class="avatar" />
-  ></el-upload>
+    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+  </el-upload>
 
 </template>
 <script>
+import axios from "axios";
+import Vue from "vue";
+
 export default {
   name: "UploadComponent",
   components: {},
   data() {
     return {
-      hideUploadEdit: false, // 隐藏'上传按钮'
+      imageUrl: '',
-      limitNum: 1, // 图片数量
-      fileList: [] // 图片列表
     }
   },
   mounted() {
@@ -37,95 +34,132 @@ export default {
   },
   computed: {},
   methods: {
-    // on-change添加文件、上传成功和上传失败时都会被调用
+    //上传图标事件
-    handleEditChange(file, fileList) {
+    selectPicUpload(obj) {
-      this.hideUploadEdit = fileList.length >= this.limitNum;
+      // let _this = this;
-      console.log("this.fileList:", this.fileList);
+      let fd = new FormData(); //参数的格式是formData格式的
-      console.log("this.hideUploadEdit:", this.hideUploadEdit);
+      fd.append("file", obj.file); //参数
-    },
+      console.log(fd.get('file'));
-    // on-remove文件列表移除文件时的钩子
+      if (localStorage.getItem('userRole') === '0'&&localStorage.getItem('Authorization')) {
-    handleRemove(file, fileList) {
-      if (fileList.length === 0) {
-        this.fileList = [];
-      } else {
-        let dl = this.fileList.indexOf(file);
-        this.fileList.splice(dl, 1);
-      }
-      this.hideUploadEdit = fileList.length >= this.limitNum;
-    },
-    // 上传到服务器
-    submitUpload() {
-      console.log(this.param);
-      if (!this.param) {
-        this.$message("请选择图片");
-      } else {
-        let formData = new FormData(); //formdata格式
-        formData.append("fileName", this.param.file);
         axios({
-          method: "post",
+          method: 'post',
-          url: '', //这里填写上传图片的接口,
+          url: '/api/uploadfile',
-          data: {} //这里可以填写上传时携带的数据,不需要可以不写
+          headers: {'Content-Type': 'multipart/form-data;charset=utf-8'},
+          params:{
+              cate:'img',
+              name:'dark_logo',
+          },
+          data:fd,
+        }).then(function (res) {
+          console.log(res);
+          // if(res.data.msg!=="添加成功！"){
+          //   Vue.prototype.$notify.error({
+          //     title: '错误',
+          //     message: "上传失败！",
+          //     offset: 0
+          //   });
+          //
+          // }else {
+          //   Vue.prototype.$notify({
+          //     title: '成功',
+          //     message: ('i', {style: 'color: teal'}, "上传成功！"),
+          //     type: 'success',
+          //     offset: 0
+          //   });
+          //   // _this.imageUrl=_this.getImage('dark_logo');
+          // }
+
+        }).catch((error) => {
+          console.log(error)
+          Vue.prototype.$notify.error({
+            title: '错误',
+            message: error,
+            offset: 0
+          });
         })
-            .then(result => {
+
-              console.log("上传成功:", result);
+      } else {
-            })
+        Vue.prototype.$notify.error({
-            .catch(err => {
+          title: '错误',
-              console.log(err);
+          message: '登录状态失效，请重新登录！',
+          offset: 0
         });
       }
     },
-    // before-upload上传文件之前的钩子 -- 限制文件大小
+    getImage(name){
-    beforeAvatarUpload(file) {
+      if (localStorage.getItem('userRole') ==='0' && localStorage.getItem('Authorization')) {
-      const isJPG = file.type === "image/jpeg" || file.type === "image/png";
+        if(name){
-      const isLt2M = file.size / 1024 / 1024 < 2;
+          axios({
-
+            method: 'get',
-      if (!isJPG) {
+            url: '/api/getAttachment',
-        this.$message.error("上传图片只能是 JPG 或 PNG 格式!");
+            params: {
-      }
+              name:name
-      if (!isLt2M) {
-        this.$message.error("上传图片大小不能超过 2MB!");
-      }
-      return isJPG && isLt2M;
             },
-    // http-request自定义上传
+          }).then(function (res) {
-    ImgUploadSectionFile(param) {
+            if(res){
-      this.param = param;
+              return res;
-
+            }else{
-      //   //下面代码放在这里的作用是:选中图片后立即上传,但我需要选中图片后再点击按钮上传,所以移到按钮的点击事件里
+              return false;
-      //   let formData = new FormData(); //formdata格式
+            }
-
+          }).catch((error) => {
-      //   console.log('param.file:  ',param.file)
+            Vue.prototype.$notify.error({
-      //   console.log('param:  ',param.file)
+              title: '错误',
-      //   formData.append("fileName", param.file);
+              message: error,
-      //   formData.append("userid", '15832919197225');
+              offset: 0
-      //   formData.append("uuid", '7658798679');
+            });
-      //   axios({
+          })
-      //       method:'post',
+        }else{
-      //       url:'http://139.155.91.117:8082/base/gps/fileUpload',
+          Vue.prototype.$notify.error({
-      //       data:formData
+            title: '错误',
-      //   }).then(result=>{
+            message: "不存在！",
-      //       console.log('上传成功:',result)
+            offset: 0
-      //   }).catch(err=>{
+          });
-      //       console.log(err)
-      //   })
         }
 
 
+      } else {
+        Vue.prototype.$notify.error({
+          title: '错误',
+          message: '登录状态失效，请重新登录！',
+          offset: 0
+        });
       }
+    },
+    beforeAvatarUpload(file) {
+      const isJPG = file.type === "image/jpeg";
+      const isJPG2 = file.type === "image/jpg";
+      const isPNG = file.type === "image/png";
+      const isGif = file.type === "image/gif";
+      const isLt5M = file.size / 1024 / 1024 < 5;
+      if (!isJPG && !isJPG2 && !isPNG && !isGif) {
+        this.$message.warning("只支持jpg,png,jpeg,gif格式图片");
+      }
+      if (!isLt5M) {
+        this.$message.warning("请上传5MB以内的图片!");
+      }
+      return (isJPG || isJPG2 || isPNG) && isLt5M;
+    },
+    handleRemove(file) {
+      this.imageUrl = "";
+    },
+
+
+  }
+
+
 }
 </script>
 <style scoped>
-/* element-ui */
+.avatar-uploader .el-upload {
-.avatar-uploader.el-upload {
+  border: 1px dashed var(--theme-color);
-  border: 2px solid var(--theme-color);
   border-radius: 6px;
   cursor: pointer;
   position: relative;
   overflow: hidden;
 }
 
-. .el-upload:hover {
+.avatar-uploader .el-upload:hover {
-  border-color: var(--theme-color);
+  border-color: var(--border-color);
 }
 
 .avatar-uploader-icon {
@@ -143,13 +177,5 @@ export default {
   display: block;
 }
 
-.hide .el-upload--picture-card {
-  display: none;
-}
 
-.el-upload-list__item {
-  transition: none !important;
-}
-
-/*end*/
 </style>

src/main.js

@@ -7,34 +7,34 @@ import ElementUI from 'element-ui';
 import 'element-ui/lib/theme-chalk/index.css';
 Vue.prototype.axios = axios;
 // 请求拦截器, 每次请求都会在请求头中携带token
-axios.interceptors.request.use((config) => {
+// axios.interceptors.request.use((config) => {
-  if(localStorage.getItem('Authorization')) {
+//   if(localStorage.getItem('Authorization')) {
-    config.headers.Authorization = localStorage.getItem('Authorization')
+//     config.headers.Authorization = localStorage.getItem('Authorization')
-  }
+//   }
-  return config;
+//   return config;
-}, (error) => {
+// }, (error) => {
-  return Promise.reject(error);
+//   return Promise.reject(error);
-})
+// })
-
+//
-//http reponse响应拦截器
+// //http reponse响应拦截器
-axios.interceptors.response.use(
+// axios.interceptors.response.use(
-    response =>{
+//     response =>{
-      return response;
+//       return response;
-    },
+//     },
-    error=>{
+//     error=>{
-      if(error.response){
+//       if(error.response){
-        switch(error.response.status){
+//         switch(error.response.status){
-          case 401:
+//           case 401:
-            localStorage.removeItem('Authorization');
+//             localStorage.removeItem('Authorization');
-            router.replace({
+//             router.replace({
-                path: '/home',
+//                 path: '/home',
-                query: {redirect: router.currentRoute.fullPath}//登录成功后跳入浏览的当前页面
+//                 query: {redirect: router.currentRoute.fullPath}//登录成功后跳入浏览的当前页面
-            }).then( r =>{
+//             }).then( r =>{
-
+//
-            })
+//             })
-        }
+//         }
-      }
+//       }
-    })
+//     })
 
 // home-style
 import './assets/css/home-style.css'

src/router/index.js

@@ -15,7 +15,7 @@ import myNav from "@/components/myNav/MyNav.vue";
 import personalHomePage from "@/components/setting/home/PersonalHomePage.vue";
 import onSiteSetting from "@/components/setting/onsite/OnSiteSetting.vue";
 import baseSettings from "@/components/setting/onsite/BaseSettings.vue";
-import importExport from "@/components/setting/onsite/ImportExport.vue";
+import importExport from "@/components/setting/importExport/ImportExport.vue";
 import categoryManage from "@/components/setting/category/CategoryManage.vue";
 import bannerManage from "@/components/setting/banner/BannerManage.vue";
 import userManage from "@/components/setting/user/UserManage.vue";
@@ -118,13 +118,7 @@ const routes = [
 
 
                     },
-                    {
-                        path: '/importExport',
-                        name: '/importExport',
-                        component: importExport,
 
-
-                    },
                 ]
             },
             {
@@ -152,6 +146,11 @@ const routes = [
                 name: '/attachment',
                 component: attachmentManage,
             },
+            {
+                path: '/importExport',
+                name: '/importExport',
+                component: importExport,
+            },
 
         ],
     },
@@ -178,7 +177,7 @@ const router = new VueRouter({
 })
 // // 导航守卫：使用 router.beforeEach 注册一个全局前置守卫，判断用户是否登陆
 router.beforeEach((to, from, next) => {
-    if (to.path === '/home') {
+    if (to.path === '/home' || to.path === '/news') {
         next();
     } else {
         let token = localStorage.getItem('Authorization');

src/utils/getIp.js

@@ -1,27 +0,0 @@
-export function getUserIP(onNewIP) {
-    let MyPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
-    let pc = new MyPeerConnection({
-        iceServers: []
-    });
-    let noop = () => {
-    };
-    let localIPs = {};
-    let ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/g;
-    let iterateIP = (ip) => {
-        if (!localIPs[ip]) onNewIP(ip);
-        localIPs[ip] = true;
-    };
-    pc.createDataChannel('');
-    pc.createOffer().then((sdp) => {
-        sdp.sdp.split('\n').forEach(function (line) {
-            if (line.indexOf('candidate') < 0) return;
-            line.match(ipRegex).forEach(iterateIP);
-        });
-        pc.setLocalDescription(sdp, noop, noop);
-    }).catch((reason) => {
-    });
-    pc.onicecandidate = (ice) => {
-        if (!ice || !ice.candidate || !ice.candidate.candidate || !ice.candidate.candidate.match(ipRegex)) return;
-        ice.candidate.candidate.match(ipRegex).forEach(iterateIP);
-    };
-}