接口&&上传资料

package-lock.json

@@ -2377,6 +2377,14 @@
       "integrity": "sha1-1h9G2DslGSUOJ4Ta9bCUeai0HFk=",
       "dev": true
     },
+    "axios": {
+      "version": "0.21.1",
+      "resolved": "https://registry.npm.taobao.org/axios/download/axios-0.21.1.tgz",
+      "integrity": "sha1-IlY0gZYvTWvemnbVFu8OXTwJsrg=",
+      "requires": {
+        "follow-redirects": "^1.10.0"
+      }
+    },
     "babel-eslint": {
       "version": "10.1.0",
       "resolved": "https://registry.npm.taobao.org/babel-eslint/download/babel-eslint-10.1.0.tgz",
@@ -5443,8 +5451,7 @@
     "follow-redirects": {
       "version": "1.13.3",
       "resolved": "https://registry.npm.taobao.org/follow-redirects/download/follow-redirects-1.13.3.tgz?cache=0&sync_timestamp=1614437038110&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffollow-redirects%2Fdownload%2Ffollow-redirects-1.13.3.tgz",
-      "integrity": "sha1-5VmK1QF0wbxOhyMB6CrCzZf5Amc=",
-      "dev": true
+      "integrity": "sha1-5VmK1QF0wbxOhyMB6CrCzZf5Amc="
     },
     "for-in": {
       "version": "1.0.2",

package.json

@@ -8,6 +8,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "axios": "^0.21.1",
     "core-js": "^3.6.5",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0"

src/App.vue

@@ -11,7 +11,7 @@
         />
       </div>
       <div class="router_view">
-        <router-view></router-view>
+        <router-view :isManufacturer="isManufacturer"></router-view>
       </div>
     </div>
   </div>
@@ -46,6 +46,19 @@ export default {
         this.navTitle2 = '';
       }
     }
+  },
+  mounted() {
+    this.$axios({
+      method: 'post',
+      url: '/api/auth/checkSign',
+      data: {
+        token: 'dXNlcklkPXh4eHh4JmFjY291bnQ9eHh4eHgmZnJvbT1zaXdlaSZ0aW1lc3RhbXA9MTYxNjY1NDMxOSZzaWduPTllMDQxMDgzMTNlZmI5M2Y2OGQ3YWI4ZTUzZTQwYTIx'
+      }
+    }).then(function (response) {
+      console.log(response);
+    }).catch(function (error) {
+      console.log(error);
+    });
   }
 };
 </script>
@@ -70,12 +83,8 @@ export default {
       width: 150px;
     }
     .router_view{
-      border: 1px solid #000;
       width: 1030px;
     }
-    // .router_view{
-    //   border: 1px solid #000;
-    // }
   }
 }
 </style>

src/components/LoginInfo.vue

@@ -1,74 +1,74 @@
-<template>
-  <div class="login_info">
-      <div class="user_info">
-          <div class="user_icon">
-              <img src="" alt="icon">
-          </div>
-          <div class="user_name">
-              <p>欢迎您，</p>
-              <p>dlrmkt</p>
-          </div>
-      </div>
-      <div class="time_info">
-          <div class="clock_icon">
-              <img src="" alt="icon">
-          </div>
-          <div class="login_time">
-              <p>登录时间</p>
-              <p>2021年-3-(星期四)</p>
-          </div>
-      </div>
-  </div>
-</template>
-
-<script>
-export default {};
-</script>
-
-<style scoped lang="less">
-.login_info {
-    background: rgb(212, 212, 212);
-    width: 100%;
-    .user_info{
-        height: 48px;
-        border-bottom: 1px solid #eee;
-        display: flex;
-        .user_icon{
-            margin: 8px 0 0 10px;
-            width: 30px;
-            height: 30px;
-            img{
-                width: 30px;
-                height: 30px;
-            }
-        }
-        .user_name{
-            margin: 4px 0 0 5px;
-            p{
-                line-height: 20px;
-                height: 20px;
-            }
-        }
-    }
-    .time_info{
-        height: 50px;
-        display: flex;
-        .clock_icon{
-            margin: 8px 0 0 10px;
-            width: 30px;
-            height: 30px;
-            img{
-                width: 30px;
-                height: 30px;
-            }
-        }
-        .login_time{
-            margin: 4px 0 0 5px;
-            p{
-                line-height: 20px;
-                height: 20px;
-            }
-        }
-    }
-}
-</style>
+<template>
+  <div class="login_info">
+      <div class="user_info">
+          <div class="user_icon">
+              <img src="" alt="icon">
+          </div>
+          <div class="user_name">
+              <p>欢迎您，</p>
+              <p>dlrmkt</p>
+          </div>
+      </div>
+      <div class="time_info">
+          <div class="clock_icon">
+              <img src="" alt="icon">
+          </div>
+          <div class="login_time">
+              <p>登录时间</p>
+              <p>2021年-3-(星期四)</p>
+          </div>
+      </div>
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style scoped lang="less">
+.login_info {
+    background: rgb(212, 212, 212);
+    width: 100%;
+    .user_info{
+        height: 48px;
+        border-bottom: 1px solid #eee;
+        display: flex;
+        .user_icon{
+            margin: 8px 0 0 10px;
+            width: 30px;
+            height: 30px;
+            img{
+                width: 30px;
+                height: 30px;
+            }
+        }
+        .user_name{
+            margin: 4px 0 0 5px;
+            p{
+                line-height: 20px;
+                height: 20px;
+            }
+        }
+    }
+    .time_info{
+        height: 50px;
+        display: flex;
+        .clock_icon{
+            margin: 8px 0 0 10px;
+            width: 30px;
+            height: 30px;
+            img{
+                width: 30px;
+                height: 30px;
+            }
+        }
+        .login_time{
+            margin: 4px 0 0 5px;
+            p{
+                line-height: 20px;
+                height: 20px;
+            }
+        }
+    }
+}
+</style>

src/components/Navigation.vue

@@ -1,34 +1,34 @@
-<template>
-  <div class="navigation">
-    <p>经销商社交媒体工作平台{{navTitle1}}{{navTitle2}}</p>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    navTitle1: {
-      type: String,
-      default: ''
-    },
-    navTitle2: {
-      type: String,
-      default: ''
-    }
-  },
-  mounted() {
-    
-  }
-};
-</script>
-
-<style scoped lang="less">
-.navigation {
-  width: 1190px;
-  height: 20px;
-  margin: 4px auto;
-  p {
-    font-size: 12px;
-  }
-}
-</style>
+<template>
+  <div class="navigation">
+    <p>经销商社交媒体工作平台{{navTitle1}}{{navTitle2}}</p>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    navTitle1: {
+      type: String,
+      default: ''
+    },
+    navTitle2: {
+      type: String,
+      default: ''
+    }
+  },
+  mounted() {
+    
+  }
+};
+</script>
+
+<style scoped lang="less">
+.navigation {
+  width: 1190px;
+  height: 20px;
+  margin: 4px auto;
+  p {
+    font-size: 12px;
+  }
+}
+</style>

src/components/RouterBanner.vue

@@ -1,169 +1,169 @@
-<template>
-  <div class="router_banner">
-    <div
-      class="router_management"
-      v-for="(routerObj, index) in routerList"
-      :key="index"
-    >
-      <div class="first_level" v-if="routerObj.isShow === 'all' || routerObj.isShow === isManufacturer">
-        <div class="icon">
-          <img src="" alt="icon" />
-        </div>
-        <div class="title" v-if="!routerObj.path">
-          {{ routerObj.title }}
-        </div>
-        <div v-else>
-          <router-link :to="routerObj.path" tag="li" class="title">
-            <p  @click="getNavTitle(routerObj.title, '')">{{routerObj.title}}</p>
-          </router-link>
-        </div>
-        <div class="switch">
-          <img src="" alt="" />
-        </div>
-      </div>
-      <div v-if="routerObj.list.length" class="second_level">
-        <div
-          v-for="(list, index) in routerObj.list"
-          :key="index">
-        <router-link
-          v-if="list.isShow === 'all' || list.isShow === isManufacturer"
-          :to="list.path"
-          tag="li"
-        >
-          <p
-            @click="getNavTitle(routerObj.title, list.title)"
-          >- {{ list.title }}</p>
-          
-        </router-link>          
-        </div>
-
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    isManufacturer: {
-      type: String,
-      default: 'distributor'
-    }
-  },
-  data() {
-    return {
-      routerList: [
-        {
-          title: "数据管理",
-          path: "",
-          img: "",
-          isShow: "all", // 厂商和经销商都有权限
-          list: [
-            {
-              title: "上传记录",
-              path: "/uploadRecord",
-              isShow: "manufacturer" // 只有厂商有权限
-            },
-            {
-              title: "链接上传", 
-              path: "/uploadLink",
-              isShow: "all" // 厂商和经销商都有权限
-            },
-            {
-              title: "上传资料",
-              path: "/uploadInfor",
-              isShow: "manufacturer" // 只有厂商有权限
-            },
-            {
-              title: "资料列表",
-              path: "/inforList",
-              isShow: "distributor" // 只有经销商有权限
-            },
-          ],
-        },
-        {
-          title: "账号管理",
-          path: "/accountIndex",
-          img: "",
-          list: [],
-          isShow: "all"  // 厂商和经销商都有权限
-        },
-        {
-          title: "参数设置",
-          path: "/parameterIndex",
-          img: "",
-          list: [],
-          isShow: "manufacturer" // 只有厂商有权限
-        },
-      ],
-    };
-  },
-  methods: {
-    getNavTitle: function(navTitle1, navTitle2){
-      // 点击路由的时候，修改导航栏
-      // this.$parent().changeNav(navTitle1, navTitle2);
-      this.$emit('change_nav', navTitle1, navTitle2);
-    }
-  },
-  mounted() {
-    console.log(this.isManufacturer);
-  }
-};
-</script>
-
-<style scoped lang="less">
-.router_banner {
-  width: 100%;
-  margin-top: 10px;
-  background: rgb(212, 212, 212);
-  .router_management {
-    width: 100%;
-    .first_level {
-      display: flex;
-      height: 35px;
-      align-items: center;
-      &:hover {
-        cursor: pointer;
-        background-color: rgb(0, 86, 160);
-        color: #fff;
-        .title{
-          color: #fff;
-        }
-      }
-      .title {
-        font-size: 14px;
-        margin-left: 4px;
-      }
-      .icon {
-        width: 35px;
-        height: 35px;
-        margin-left: 10px;
-        background: #fff;
-        img {
-          width: 35px;
-          height: 35px;
-        }
-      }
-      .switch {
-        width: 11px;
-        height: 11px;
-        background: #fff;
-        margin-left: 20px;
-      }
-    }
-    .second_level {
-      li {
-        width: 100%;
-        height: 38px;
-        background-color: rgb(212, 212, 212);
-        line-height: 38px;
-        text-align: center;
-        &:hover {
-          cursor: pointer;
-          color: rgb(0, 86, 160);
-        }
-      }
-    }
-  }
-}
-</style>
+<template>
+  <div class="router_banner">
+    <div
+      class="router_management"
+      v-for="(routerObj, index) in routerList"
+      :key="index"
+    >
+      <div class="first_level" v-if="routerObj.isShow === 'all' || routerObj.isShow === isManufacturer">
+        <div class="icon">
+          <img src="" alt="icon" />
+        </div>
+        <div class="title" v-if="!routerObj.path">
+          {{ routerObj.title }}
+        </div>
+        <div v-else>
+          <router-link :to="routerObj.path" tag="li" class="title">
+            <p  @click="getNavTitle(routerObj.title, '')">{{routerObj.title}}</p>
+          </router-link>
+        </div>
+        <div class="switch">
+          <img src="" alt="" />
+        </div>
+      </div>
+      <div v-if="routerObj.list.length" class="second_level">
+        <div
+          v-for="(list, index) in routerObj.list"
+          :key="index">
+        <router-link
+          v-if="list.isShow === 'all' || list.isShow === isManufacturer"
+          :to="list.path"
+          tag="li"
+        >
+          <p
+            @click="getNavTitle(routerObj.title, list.title)"
+          >- {{ list.title }}</p>
+          
+        </router-link>          
+        </div>
+
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    isManufacturer: {
+      type: String,
+      default: 'distributor'
+    }
+  },
+  data() {
+    return {
+      routerList: [
+        {
+          title: "数据管理",
+          path: "",
+          img: "",
+          isShow: "all", // 厂商和经销商都有权限
+          list: [
+            {
+              title: "上传记录",
+              path: "/uploadRecord",
+              isShow: "manufacturer" // 只有厂商有权限
+            },
+            {
+              title: "链接上传", 
+              path: "/uploadLink",
+              isShow: "all" // 厂商和经销商都有权限
+            },
+            {
+              title: "上传资料",
+              path: "/uploadInfor",
+              isShow: "manufacturer" // 只有厂商有权限
+            },
+            {
+              title: "资料列表",
+              path: "/inforList",
+              isShow: "distributor" // 只有经销商有权限
+            },
+          ],
+        },
+        {
+          title: "账号管理",
+          path: "/accountIndex",
+          img: "",
+          list: [],
+          isShow: "all"  // 厂商和经销商都有权限
+        },
+        {
+          title: "参数设置",
+          path: "/parameterIndex",
+          img: "",
+          list: [],
+          isShow: "manufacturer" // 只有厂商有权限
+        },
+      ],
+    };
+  },
+  methods: {
+    getNavTitle: function(navTitle1, navTitle2){
+      // 点击路由的时候，修改导航栏
+      this.$emit('change_nav', navTitle1, navTitle2);
+    }
+  },
+  mounted() {
+    console.log(this.isManufacturer);
+  }
+};
+</script>
+
+<style scoped lang="less">
+.router_banner {
+  width: 100%;
+  margin-top: 10px;
+  background: rgb(212, 212, 212);
+  min-height: 412px;
+  .router_management {
+    width: 100%;
+    .first_level {
+      display: flex;
+      height: 35px;
+      align-items: center;
+      &:hover {
+        cursor: pointer;
+        background-color: rgb(0, 86, 160);
+        color: #fff;
+        .title{
+          color: #fff;
+        }
+      }
+      .title {
+        font-size: 14px;
+        margin-left: 4px;
+      }
+      .icon {
+        width: 35px;
+        height: 35px;
+        margin-left: 10px;
+        background: #fff;
+        img {
+          width: 35px;
+          height: 35px;
+        }
+      }
+      .switch {
+        width: 11px;
+        height: 11px;
+        background: #fff;
+        margin-left: 20px;
+      }
+    }
+    .second_level {
+      li {
+        width: 100%;
+        height: 38px;
+        background-color: rgb(212, 212, 212);
+        line-height: 38px;
+        text-align: center;
+        &:hover {
+          cursor: pointer;
+          color: rgb(0, 86, 160);
+        }
+      }
+    }
+  }
+}
+</style>

src/main.js

@@ -1,10 +1,12 @@
-import Vue from 'vue'
-import App from './App.vue'
-import router from './router'
-
-Vue.config.productionTip = false
-
-new Vue({
-  router,
-  render: h => h(App)
-}).$mount('#app')
+import Vue from 'vue'
+import App from './App.vue'
+import router from './router'
+import axios from 'axios'
+
+Vue.config.productionTip = false
+Vue.prototype.$axios = axios
+
+new Vue({
+  router,
+  render: h => h(App)
+}).$mount('#app')

src/views/data/UploadInfor.vue

@@ -1,14 +1,100 @@
-<template>
-  <div class="upload_record">
-    <h1>上传资料</h1>
-  </div>
-</template>
-
-<script>
-export default {
-}
-</script>
-
-<style scoped lang="less">
-
-</style>
+<template>
+  <div class="upload_record">
+    <form action="" method="" name="">
+      <div>
+        <span>资料名称</span><input type="text">
+      </div>
+      <div class="form_margin">
+        <span class="inforDes">资料描述</span><textarea name="" id="" cols="30" rows="6"></textarea>
+      </div>
+      <div class="form_margin">
+        <p>选择类型</p>
+        <div class="form_margin left_margin">
+          <span>素材时间</span><select name="" id="">
+            <option value="">请选择</option>
+          </select>
+          <span>经销商范围</span>
+          <select name="" id="">
+            <option value="">请选择</option>
+          </select>          
+        </div>
+        <div class="form_margin">
+            <p>权限设置</p>
+          <div class="form_margin left_margin">
+            <span>按区域添加</span>
+            <input type="checkbox">全区
+            <input type="checkbox">北区
+            <input type="checkbox">南区
+            <input type="checkbox">东区
+            <input type="checkbox">自定义分组
+            <button class="addBtn">添加</button>            
+          </div>
+          <div class="form_margin left_margin">
+            <span>自定义添加</span>
+            <input type="text">
+            <button class="addBtn">添加</button>
+          </div>
+          <div class="form_margin left_margin">
+            <span>按小组添加</span>
+            <select name="" id="">
+              <option value="">请选择</option>
+            </select>
+            <button class="addBtn">添加</button>
+          </div>
+        </div>
+      </div>
+    </form>
+    <!-- <div class=""></div> -->
+  </div>
+</template>
+
+<script>
+export default {
+  props:{
+    isManufacturer: {
+      type: String,
+      default: 'distributor'
+    },
+  },
+  mounted() {
+    console.log(this.isManufacturer);
+  }
+}
+</script>
+
+<style scoped lang="less">
+.upload_record{
+  padding: 15px 30px;
+  .inforDes{
+    vertical-align: top;
+    margin-right: 10px;
+  }
+}
+input{
+  margin-left: 10px;
+  height: 18px;
+  padding: 4px 6px;
+  outline-color: #ccc;
+  line-height: 20px;
+  color: #555555;
+}
+input:focus{
+  animation: shadowAni 500ms linear forwards;
+}
+@keyframes shadowAni{
+  0%{
+    outline-color: #cccccc;
+    box-shadow: inset 0px 0px 0 #ccc;
+  };
+  100%{
+    outline-color: #75b9F0;
+    box-shadow: 0px 0px 10px #75b9F0;
+  }
+}
+.left_margin{
+  margin-left: 58px;
+}
+.form_margin{
+  margin-top: 20px;
+}
+</style>

vue.config.js

@@ -0,0 +1,16 @@
+module.exports = {
+    devServer: {
+        host: 'localhost',
+        port: 8080,
+        proxy: {
+            '/api': {
+                target: 'http://8.136.230.133:8080',
+                changeOrigin: true,
+                wx: true,
+                pathRewrite: {  
+                    '^/api':''
+                  }  
+            },
+        }
+    }
+}