kun 19/10/1/20:45

.env.development

@@ -0,0 +1,15 @@
+
+# just a flag
+ENV = 'development'
+
+# base api
+VUE_APP_BASE_API = '/url/'
+
+# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
+# to control whether the babel-plugin-dynamic-import-node plugin is enabled.
+# It only does one thing by converting all import() to require().
+# This configuration can significantly increase the speed of hot updates,
+# when you have a large number of pages.
+# Detail:  https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
+
+VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.production

@@ -0,0 +1,5 @@
+# just a flag
+ENV = 'production'
+
+# base api
+VUE_APP_BASE_API = 'http://chaoyang.yulongcode.com/api/'

src/http.js

@@ -0,0 +1,58 @@
+import axios from 'axios'
+import router from './router'
+
+var root = process.env.VUE_APP_BASE_API
+
+axios.interceptors.request.use(config => {
+  // --请求之前重新拼装url--
+  config.url = root + config.url
+  if (
+    config.url === '/url/v1/login/reg' ||
+    config.url === '/url/v1/login/login'
+  ) {
+    // 如果是登录和注册操作，则不需要携带header里面的token
+  } else {
+    if (localStorage.token) {
+      config.headers = {
+        Authorization: localStorage.token
+      }
+    }
+  }
+  return config
+})
+
+axios.interceptors.response.use(
+  response => {
+    if (response.data.errno === 999) {
+      router.replace('/')
+      console.log('token过期')
+    }
+    return response
+  },
+  error => {
+    return error
+  }
+)
+
+router.beforeEach((to, from, next) => {
+  if (to.meta.requireAuth) {
+    // 判断该路由是否需要登录权限
+    if (localStorage.token) {
+      // 获取当前的token是否存在
+      console.log('token存在')
+      next()
+    } else {
+      alert('请先登录！')
+      console.log('token不存在')
+      next({
+        path: '/login', // 将跳转的路由path作为参数，登录成功后跳转到该路由
+        query: { redirect: to.fullPath }
+      })
+    }
+  } else {
+    // 如果不需要权限校验，直接进入路由界面
+    next()
+  }
+})
+
+export default axios

src/main.js

@@ -2,7 +2,7 @@ import Vue from 'vue'
 import App from './App.vue'
 import router from './router'
 import store from './store'
-import http from '../static/js/http'
+import http from './http'
 import tool from '../static/js/tool'
 import ElementUI from 'element-ui'
 import md5 from 'js-md5'
@@ -12,26 +12,6 @@ import '../static/css/swiper.css'
 import '../static/fonts/iconfont.css'
 import 'element-ui/lib/theme-chalk/index.css'
 
-router.beforeEach((to, from, next) => {
-  if (to.meta.requireAuth) {
-    // 判断该路由是否需要登录权限
-    if (localStorage.token) {
-      // 获取当前的token是否存在
-      console.log('token存在')
-      next()
-    } else {
-      console.log('token不存在')
-      next({
-        path: '/login', // 将跳转的路由path作为参数，登录成功后跳转到该路由
-        query: { redirect: to.fullPath }
-      })
-    }
-  } else {
-    // 如果不需要权限校验，直接进入路由界面
-    next()
-  }
-})
-
 Vue.prototype.$md5 = md5
 Vue.prototype.$tool = tool
 Vue.prototype.$http = http

src/views/InformationQuery.vue

@@ -15,31 +15,35 @@
       <!-- 分类搜索 -->
       <div class="select-box">
         <select name="type" v-model="screeOut.type" @change="scree()">
+          <option value="类型" disabled style="display:none;">类型</option>
           <option value="社会">社会</option>
           <option value="团体">团体</option>
         </select>
         <select name="time" v-model="screeOut.date_time" @change="scree()">
+          <option value="登记时间" disabled style="display:none;">登记时间</option>
           <option value="09-18">09-18</option>
           <option value="09-19">09-19</option>
         </select>
         <select name="year" v-model="screeOut.date_year" @change="scree()">
+          <option value="年检年份" disabled style="display:none;">年检年份</option>
           <option value="2017">2017</option>
           <option value="2019">2019</option>
         </select>
         <select name="condition" v-model="screeOut.zt" @change="scree()">
-          <option value="0">good</option>
+          <option value="年检情况" disabled style="display:none;">年检情况</option>
-          <option value="1">bad</option>
+          <option value="正常">正常</option>
+          <option value="异常">异常</option>
         </select>
       </div>
       <!-- 搜索记录 -->
-      <template>
+      <div class="record">
-        <div class="record">
+        <template v-for="(item,index) in record">
-          <div class="list">
+          <div class="list" :key="index" @click="searchRecord(item.nameOf)">
-            <span>类型：社会团体</span>
+            <span>{{item.category + '：' + item.nameOf}}</span>
-            <span class="iconfont icon-cuowu"></span>
+            <span class="iconfont icon-cuowu" @click="del(index)"></span>
           </div>
-        </div>
+        </template>
-      </template>
+      </div>
       <!-- 表格 -->
       <div class="box-table">
         <div class="caption">
@@ -65,31 +69,31 @@
               v-for="(item,index) in sData"
               :key="index"
               :class="index % 2 == 0 ? 'bgcbz' : 'bgcz'"
+              class="tr"
             >
-              <td>{{item.id}}</td>
               <td>{{item.organization}}</td>
               <td>{{item.credit}}</td>
               <td>{{item.type}}</td>
               <td>{{item.representative}}</td>
               <td>{{item.date_year + '-' + item.date_time}}</td>
-              <td v-if="item.zt == 0" style="color:#2fd63f">正常</td>
+              <td v-if="item.zt == '正常'" style="color:#2fd63f">{{item.zt}}</td>
-              <td v-if="item.zt == 1" style="color:#e13232">异常</td>
+              <td v-if="item.zt == '异常'" style="color:#e13232">{{item.zt}}</td>
             </tr>
           </template>
           <template v-if="searchValue.length > 0">
             <tr
+              class="tr"
               v-for="(item,index) in searchValue"
               :key="index"
               :class="index % 2 == 0 ? 'bgcbz' : 'bgcz'"
             >
-              <td>{{item.id}}</td>
               <td>{{item.organization}}</td>
               <td>{{item.credit}}</td>
               <td>{{item.type}}</td>
               <td>{{item.representative}}</td>
               <td>{{item.date_year + '-' + item.date_time}}</td>
-              <td v-if="item.zt == 0" style="color:#2fd63f">正常</td>
+              <td v-if="item.zt == '正常'" style="color:#2fd63f">{{item.zt}}</td>
-              <td v-if="item.zt == 1" style="color:#e13232">异常</td>
+              <td v-if="item.zt == '异常'" style="color:#e13232">{{item.zt}}</td>
             </tr>
           </template>
         </table>
@@ -120,11 +124,12 @@ export default {
       },
       searchVal: "",
       searchValue: [],
+      record: [],
       screeOut: {
-        type: '',
+        type: '类型',
-        date_time: '',
+        date_time: '登记时间',
-        date_year: '',
+        date_year: '年检年份',
-        zt: '',
+        zt: '年检情况'
       },
       sData: [
         {
@@ -135,7 +140,7 @@ export default {
           representative: "王五",
           date_time: "09-18",
           date_year: '2019',
-          zt: 0
+          zt: '正常'
         },
         {
           id: 2,
@@ -145,7 +150,7 @@ export default {
           representative: "李四",
           date_time: "09-19",
           date_year: '2017',
-          zt: 1
+          zt: '正常'
         },
         {
           id: 4,
@@ -155,7 +160,7 @@ export default {
           representative: "李四",
           date_time: "09-19",
           date_year: '2019',
-          zt: 1
+          zt: '异常'
         },
         {
           id: 5,
@@ -165,7 +170,7 @@ export default {
           representative: "李四",
           date_time: "09-18",
           date_year: '2017',
-          zt: 1
+          zt: '异常'
         },
         {
           id: 6,
@@ -175,7 +180,7 @@ export default {
           representative: "李四",
           date_time: "09-19",
           date_year: '2019',
-          zt: 1
+          zt: '正常'
         },
         {
           id: 3,
@@ -185,32 +190,94 @@ export default {
           representative: "张三",
           date_time: "09-18",
           date_year: "2017",
-          zt: 0
+          zt: '异常'
         }
       ]
     };
   },
   computed: {},
-  watch: {},
+  watch: {
+    record(newVal, oldVal) { }
+  },
   methods: {
+    /** 删除单条数据 */
+    del(index) {
+      let delArr = this.record.splice(index, 1)
+    },
+    /** 调用搜索函数 */
+    searchRecord(str) {
+      this.getSearch(str)
+    },
     /** 筛选函数 */
     scree() {
+      if (this.screeOut.type == "类型") {
+        this.screeOut.type = ''
+      } else {
+        this.record.push({ category: '类型', nameOf: this.screeOut.type })
+      }
+
+      if (this.screeOut.date_time == "登记时间") {
+        this.screeOut.date_time = ''
+      } else {
+        this.record.push({ category: '登记时间', nameOf: this.screeOut.date_time })
+      }
+
+      if (this.screeOut.date_year == "年检年份") {
+        this.screeOut.date_year = ''
+      } else {
+        this.record.push({ category: '年检年份', nameOf: this.screeOut.date_year })
+      }
+
+      if (this.screeOut.zt == "年检情况") {
+        this.screeOut.zt = ''
+      } else {
+        this.record.push({ category: '年检情况', nameOf: this.screeOut.zt })
+      }
+
+      /**
+        let hash = {};
+        this.record = this.record.reduce((preVal, curVal) => {
+          hash[curVal.nameOf] ? '' : hash[curVal.nameOf] = true && preVal.push(curVal);
+          return preVal
+        }, [])
+      */
+
+      this.record = this.$tool.arrayHeavy(this.record, 'nameOf')
+
       let gData = this.$tool.multiFilter(this.sData, this.screeOut)
       if (gData != undefined && gData != '') {
         this.searchValue = gData
       } else {
         this.$message('您搜索的内容暂无~')
       }
+
+      if (this.screeOut.type == "") {
+        this.screeOut.type = '类型'
+      }
+      if (this.screeOut.date_time == "") {
+        this.screeOut.date_time = '登记时间'
+      }
+      if (this.screeOut.date_year == "") {
+        this.screeOut.date_year = '年检年份'
+      }
+      if (this.screeOut.zt == "") {
+        this.screeOut.zt = '年检情况'
+      }
     },
     /** 搜索函数 */
-    getSearch() {
+    getSearch(str) {
       this.searchValue = [];
-      if (this.searchVal === "") {
+
+      if (this.searchVal === "" && str !== "" && str !== undefined && str !== null && str !== 'null') {
+        this.searchVal = str
+      } else if (this.searchVal === "") {
         this.$message.warning("请输入搜索内容");
         return;
       }
 
       let searchData = this.$tool.setSearch(this.sData, this.searchVal)
+      // console.log(searchData);
+
 
       if (searchData != undefined && searchData != '') {
         this.searchValue = searchData
@@ -218,18 +285,19 @@ export default {
       } else {
         this.$message('您搜索的内容暂无~')
       }
-
+      /*
-      // this.sData.forEach((item, index) => {
+        this.sData.forEach((item, index) => {
-      //   if (
+          if (
-      //     item.organization.indexOf(this.searchVal) > -1 ||
+            item.organization.indexOf(this.searchVal) > -1 ||
-      //     item.credit.indexOf(this.searchVal) > -1 ||
+            item.credit.indexOf(this.searchVal) > -1 ||
-      //     item.type.indexOf(this.searchVal) > -1 ||
+            item.type.indexOf(this.searchVal) > -1 ||
-      //     item.representative.indexOf(this.searchVal) > -1 ||
+            item.representative.indexOf(this.searchVal) > -1 ||
-      //     item.date.indexOf(this.searchVal) > -1
+            item.date.indexOf(this.searchVal) > -1
-      //   ) {
+          ) {
-      //     this.searchValue.push(item);
+            this.searchValue.push(item);
-      //   }
+          }
-      // });
+        });
+      */
     },
     /** 名单切换 */
     btn(index) {
@@ -264,9 +332,32 @@ export default {
 
     .box-table {
       width: 100%;
+      margin-top: -25px;
 
       table {
-        width: 100%;
+        width: 1130px;
+        counter-reset: items 0; /* 0 可以省略 */
+        counter-increment: counter-name integer;
+        box-sizing: border-box;
+
+        .tr {
+          counter-increment: items 1; /* 1 同样可以省略 */
+          &:before {
+            content: counter(items);
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #595959;
+            width: 86px;
+            height: 40px;
+            display: inline-block;
+            text-align: center;
+            line-height: 40px;
+            box-sizing: border-box;
+          }
+        }
 
         th {
           line-height: 40px;
@@ -279,6 +370,7 @@ export default {
           letter-spacing: 0px;
           color: #666666;
           background-color: #f6fafd;
+          box-sizing: border-box;
 
           &:nth-of-type(1) {
             width: 86px;
@@ -286,26 +378,29 @@ export default {
           &:nth-of-type(2) {
             width: 160px;
             border-left: 1px solid #dcebf6;
-            border-right: 1px solid #dcebf6;
           }
           &:nth-of-type(3) {
             width: 240px;
+            border-left: 1px solid #dcebf6;
+
           }
           &:nth-of-type(4) {
             width: 160px;
             border-left: 1px solid #dcebf6;
-            border-right: 1px solid #dcebf6;
           }
           &:nth-of-type(5) {
             width: 160px;
+            border-left: 1px solid #dcebf6;
+
           }
           &:nth-of-type(6) {
-            width: 180px;
+            width: 160px;
             border-left: 1px solid #dcebf6;
-            border-right: 1px solid #dcebf6;
           }
           &:nth-of-type(7) {
-            width: 144px;
+            width: 140px;
+            border-left: 1px solid #dcebf6;
+
           }
         }
 
@@ -325,35 +420,38 @@ export default {
           font-weight: normal;
           font-stretch: normal;
           letter-spacing: 0px;
+          box-sizing: border-box;
           color: #595959;
 
           &:nth-of-type(1) {
-            width: 86px;
-          }
-          &:nth-of-type(2) {
             width: 160px;
             border-left: 1px solid #dcebf6;
-            border-right: 1px solid #dcebf6;
+          }
+          &:nth-of-type(2) {
+            width: 240px;
+            border-left: 1px solid #dcebf6;
           }
           &:nth-of-type(3) {
-            width: 240px;
+            width: 160px;
+            border-left: 1px solid #dcebf6;
           }
           &:nth-of-type(4) {
             width: 160px;
             border-left: 1px solid #dcebf6;
-            border-right: 1px solid #dcebf6;
           }
           &:nth-of-type(5) {
             width: 160px;
+            border-left: 1px solid #dcebf6;
           }
           &:nth-of-type(6) {
-            width: 180px;
+            width: 140px;
             border-left: 1px solid #dcebf6;
-            border-right: 1px solid #dcebf6;
           }
+          /*
           &:nth-of-type(7) {
             width: 144px;
           }
+          */
         }
       }
 
@@ -424,6 +522,7 @@ export default {
         font-stretch: normal;
         letter-spacing: 0px;
         color: #666666;
+        margin-bottom: 25px;
 
         .iconfont {
           margin-left: 10px;

src/views/Registered.vue

@@ -1,26 +1,24 @@
 <template>
-  <div class="wrapper"
+  <div class="wrapper" :style="{'background-image':'url('+imgUrl.registered+')'}">
-       :style="{'background-image':'url('+imgUrl.registered+')'}">
     <div class="box">
       <div class="boxx">
         <h3>立 即 注 冊</h3>
-        <form action
+        <form enctype="multipart/form-data" onsubmit="return false">
-              method
+          <!-- 请输入组织名称 pattern
-              onsubmit="return false"
+              oninvalid="setCustomValidity('不能为空')"
-              enctype="multipart/form-data">
+              oninput="setCustomValidity('')"
-          <!-- 请输入组织名称 -->
+          -->
           <label>
             <span class="one">
               <span class="iconfont icon-ren"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="text"
+              class="input"
-                   placeholder="请输入组织名称"
+              type="text"
-                   required
+              placeholder="请输入组织名称"
-                   pattern
+              v-model="fieldsName.organization_name"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
             <span class="span1">注：组织名称将用于用户登录</span>
           </label>
           <!-- 请输入密码 -->
@@ -29,13 +27,7 @@
               <span class="iconfont icon-suo"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input class="input" type="password" placeholder="请输入密码" v-model="fieldsName.password" />
-                   type="password"
-                   placeholder="请输入密码"
-                   required
-                   pattern
-                   oninvalid="setCustomValidity('不能为空')"
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请再次输入密码 -->
           <label>
@@ -43,29 +35,25 @@
               <span class="iconfont icon-suo"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="password"
+              class="input"
-                   placeholder="请再次输入密码"
+              type="password"
-                   required
+              placeholder="请再次输入密码"
-                   pattern
+              v-model="fieldsName.confirm_password"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请输入统一社会信用代码 -->
           <label>
             <span class="two">
-              <img :src="imgUrl.yy"
+              <img :src="imgUrl.yy" alt style="width:20px;height:20px;margin-top:0px;" />
-                   alt
-                   style="width:20px;height:20px;margin-top:0px;" />
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="password"
+              class="input"
-                   placeholder="请输入统一社会信用代码"
+              type="password"
-                   required
+              placeholder="请输入统一社会信用代码"
-                   pattern
+              v-model="fieldsName.credit_code"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请输入法人代表 -->
           <label>
@@ -73,13 +61,12 @@
               <span class="iconfont icon-fuzeren"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="text"
+              class="input"
-                   placeholder="请输入法人代表"
+              type="text"
-                   required
+              placeholder="请输入法人代表"
-                   pattern
+              v-model="fieldsName.legal_representative"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请输入单位属性 -->
           <label>
@@ -87,13 +74,12 @@
               <span class="iconfont icon-icon-test"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="text"
+              class="input"
-                   placeholder="请输入单位属性"
+              type="text"
-                   required
+              placeholder="请输入单位属性"
-                   pattern
+              v-model="fieldsName.unit_attribute"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请输入业务主管单位名称 -->
           <label>
@@ -101,13 +87,12 @@
               <span class="iconfont icon-zhuzhuangtu"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="text"
+              class="input"
-                   placeholder="请输入业务主管单位名称"
+              type="text"
-                   required
+              placeholder="请输入业务主管单位名称"
-                   pattern
+              v-model="fieldsName.entity_name"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请输入负责人姓名 -->
           <label>
@@ -115,13 +100,12 @@
               <span class="iconfont icon-renxiang-"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="text"
+              class="input"
-                   placeholder="请输入负责人姓名"
+              type="text"
-                   required
+              placeholder="请输入负责人姓名"
-                   pattern
+              v-model="fieldsName.charge_name"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请输入负责人职务 -->
           <label>
@@ -129,13 +113,12 @@
               <span class="iconfont icon-lingdai"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="text"
+              class="input"
-                   placeholder="请输入负责人职务"
+              type="text"
-                   required
+              placeholder="请输入负责人职务"
-                   pattern
+              v-model="fieldsName.charge_position"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 请输入负责人电话 -->
           <label>
@@ -143,30 +126,23 @@
               <span class="iconfont icon-dianhua"></span>
               <span class="iconfont icon-vertical_line"></span>
             </span>
-            <input class="input"
+            <input
-                   type="tel"
+              class="input"
-                   placeholder="请输入负责人电话"
+              type="tel"
-                   required
+              placeholder="请输入负责人电话"
-                   pattern
+              v-model="fieldsName.charge_phone"
-                   oninvalid="setCustomValidity('不能为空')"
+            />
-                   oninput="setCustomValidity('')" />
           </label>
           <!-- 管理平台协 -->
           <label class="label">
-            <input class="checkout"
+            <input class="checkout" type="checkbox" v-model="fieldsName.agre" />
-                   type="checkbox"
-                   required
-                   oninvalid="setCustomValidity('不能为空')"
-                   oninput="setCustomValidity('')" />
             <span class="span2">
               我已阅读并接受
               <span class="span3">《管理平台协议》</span>
             </span>
           </label>
-          <label class="s">
+          <label class="s" @click="registered()">
-            <input type="submit"
+            <input type="submit" class="sub" value="立即注册" />
-                   class="sub"
-                   value="立即注册" />
           </label>
         </form>
       </div>
@@ -188,9 +164,42 @@ export default {
   },
   computed: {},
   watch: {},
-  methods: {},
+  methods: {
-  created () {},
+
-  mounted () {}
+    registered () {
+      let _this = this
+      if (this.fieldsName.organization_name === undefined) {
+        alert('组织名称不可为空')
+      } else if (this.fieldsName.password === undefined) {
+        alert('密码不可为空')
+      } else if (this.fieldsName.confirm_password === undefined) {
+        alert('请输入确认密码')
+      } else {
+        console.log(_this.fieldsName, 111)
+
+        this.$http({
+          method: 'post',
+          url: 'v1/login/reg',
+          data: {
+            FieldsName: _this.fieldsName
+          }
+        })
+          .then(res => {
+            if (res.data.code === 200) {
+              _this.$Message.success('注册成功！')
+            } else {
+              _this.$Message.error('注册失败！')
+            }
+          })
+          // eslint-disable-next-line handle-callback-err
+          .catch(err => {
+            console.log(err, 555)
+          })
+      }
+    }
+  },
+  created () { },
+  mounted () { }
 }
 </script>
 

src/views/home/HomePage.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="wrapper">
+  <div class="wrapper" v-if="bgData">
     <header-nav :index_num="index_num"></header-nav>
     <div id="box">
       <!-- 内容ONE -->
@@ -8,18 +8,12 @@
         <div class="swiperone">
           <div class="swiper-container swiper-one">
             <div class="swiper-wrapper">
-              <div class="swiper-slide">
+              <template v-for="(banner,index) in bgData.banner">
-                <img :src="imgUrl.lb" alt />
+                <div class="swiper-slide" :key="index">
-                <div class="box">加强基础设施建设，完善城市功能，扩大城市容量</div>
+                  <img :src="banner.cover" alt />
-              </div>
+                  <div class="box">{{banner.title}}</div>
-              <div class="swiper-slide">
+                </div>
-                <img :src="imgUrl.lb" alt />
+              </template>
-                <div class="box">加强基础设施建设，完善城市功能，扩大城市容量</div>
-              </div>
-              <div class="swiper-slide">
-                <img :src="imgUrl.lb" alt />
-                <div class="box">加强基础设施建设，完善城市功能，扩大城市容量</div>
-              </div>
             </div>
           </div>
           <!-- 如果需要导航按钮 -->
@@ -37,11 +31,11 @@
           </div>
           <!-- 列表显示 -->
           <ul>
-            <template v-for="(item,index) in mData">
+            <template v-for="(notice,index) in bgData.notice">
               <li :key="index" v-if="index < 8">
                 <a href="javascript:void(0);">
-                  <span>{{item.text}}</span>
+                  <span>{{notice.title}}</span>
-                  <time>[{{item.time}}]</time>
+                  <time>[{{notice.created_at}}]</time>
                 </a>
               </li>
             </template>
@@ -73,7 +67,7 @@
                 <img class="o" :src="imgUrl.gq" alt />
                 <span>党组织信息</span>
               </div>
-              <span  @click="$jump('informationQuery')">更多>></span>
+              <span @click="$jump('informationQuery')">更多>></span>
             </div>
             <div class="p">
               <div class="text">
@@ -103,9 +97,9 @@
               <span @click="$jump('newsList')">更多>></span>
             </div>
             <ul class="ulo">
-              <template v-for="(item,index) in mmData">
+              <template v-for="(battle,index) in bgData.battle">
                 <li :key="index" v-if="index<9" @click="$jump('newsDetails')">
-                  <a href="javascript:void(0);">{{item.text}}</a>
+                  <a href="javascript:void(0);">{{battle.title}}</a>
                 </li>
               </template>
             </ul>
@@ -120,9 +114,9 @@
               <span @click="$jump('newsList')">更多>></span>
             </div>
             <ul class="ult">
-              <template v-for="(item,index) in mmmData">
+              <template v-for="(organization,index) in bgData.organization">
                 <li :key="index" v-if="index < 9" @click="$jump('newsDetails')">
-                  <a href="javascript:void(0);">{{item.text}}</a>
+                  <a href="javascript:void(0);">{{organization.title}}</a>
                 </li>
               </template>
             </ul>
@@ -149,10 +143,10 @@
         <p class="title">党建矩阵</p>
         <div class="swiper-box-list">
           <div id="img-box" class="f-row">
-            <template v-for="(list,index) in lists">
+            <template v-for="(links,index) in bgData.links">
-              <div class="img-box" :key="index">
+              <div class="img-box" :key="index" v-if="index < 8">
-                <img :src="imgUrl.img3" alt />
+                <img :src="links.url" alt />
-                <p>中国政府网站</p>
+                <p>{{links.name}}</p>
               </div>
             </template>
             <img
@@ -211,7 +205,7 @@ export default {
         right: require("../../../static/img/right.png"),
         left: require("../../../static/img/left.png")
       },
-      mData: [
+      mmData: [
         { text: "贵安新区拟对部分社会组织进行注销登记", time: "2019-3-14" },
         { text: "四平市民政局以服务平台促社会组织发展", time: "2019-3-14" },
         {
@@ -245,30 +239,6 @@ export default {
           time: "2019-3-14"
         }
       ],
-      mmData: [
-        { text: "中国宋庆龄基金会“留守儿童关爱行动”" },
-        { text: "全国港澳研究会举办“重温邓小”" },
-        { text: "市品牌质量创新促进会与香港品质保证局" },
-        { text: "无锡市召开骨干社会组织信息员工作会议" },
-        { text: "中国扶贫基金会向尼泊尔聋哑学生捐赠爰" },
-        { text: "中国围棋协会贺电:三星杯包揽四强围棋" },
-        { text: "非公环保企业和环保社会组织召开纪念" },
-        { text: "青春诗会”新闻发布会在京举行" },
-        { text: "市社会组织联合会召开“垃圾分类,社会组织在行动" },
-        { text: "关于对全院参加业务培训人员的友情提示" }
-      ],
-      mmmData: [
-        { text: "铁岭市非公有制经济组织和社会组织觉组" },
-        { text: "市社科联举办社科学会党建工作推进会暨" },
-        { text: "以党建“三个覆盖”为重点推进社会组织" },
-        { text: "门头沟区委社会工委区民政局开展社会组" },
-        { text: "2019年市团干部岗位实践能力大比武非" },
-        { text: "萍多市非公有制经济组织和社会组织党建" },
-        { text: "门头沟区委社会工委区民政局开展社会组" },
-        { text: "举办两新组织党组织书记重点培训班" },
-        { text: "市社会组织综合党委组织观看“两弹一星”" },
-        { text: "关于对全院参加业务培训人员的友情提示" }
-      ],
       sData: [
         {
           img: require("../../../static/img/img0.png"),
@@ -295,7 +265,7 @@ export default {
             "活动策划是提高市场占有率的有效行为，一份可执行、可操作、创意突出的活动策划案，可有效提升企业的知名度及品牌美誉度。活动策划案是相对于市场策划案而言，严格说它们同属市场策划的兄弟分支，活动策划、..."
         }
       ],
-      lists: [1, 2, 3, 4, 5, 6, 7, 8]
+      bgData: []
     };
   },
   computed: {},
@@ -305,7 +275,7 @@ export default {
       var mySwiper = new Swiper(".swiper-one", {
         loop: true,
         autoplay: {
-          delay: 3000
+          delay: 1500
         },
 
         /** 如果需要前进后退按钮 */
@@ -339,6 +309,24 @@ export default {
           }
         }, 25);
       }
+    },
+    getData() {
+      let _this = this
+      this.$http({
+        method: 'get',
+        url: 'v1/index',
+        data: {}
+      }).then(res => {
+        if (res.data.code === 200) {
+          _this.bgData = res.data.data
+        } else {
+          _this.$Message.error('请求数据有问题！')
+        }
+      })
+        // eslint-disable-next-line handle-callback-err
+        .catch(err => {
+          console.log(err)
+        })
     }
     /*
     initialSwiper() {
@@ -358,7 +346,9 @@ export default {
     }
     */
   },
-  created() { },
+  created() {
+    this.getData()
+  },
   mounted() {
     this.initSwiper();
     /*this.initialSwiper();*/

static/js/http.js

@@ -1,38 +0,0 @@
-import axios from 'axios'
-import router from '../../src/router'
-
-// axios 配置
-axios.defaults.timeout = 7200
-axios.defaults.baseURL = ''
-
-// test使用的
-window.localStorage['token'] = JSON.stringify('shenxuekundetoken')
-
-// http request 拦截器
-axios.interceptors.request.use(
-  config => {
-    if (localStorage.token) {
-      // 判断token是否存在
-      config.headers.Authorization = localStorage.token // 将token设置成请求头
-    }
-    return config
-  },
-  err => {
-    return Promise.reject(err)
-  }
-)
-
-// http response 拦截器
-axios.interceptors.response.use(
-  response => {
-    if (response.data.errno === 999) {
-      router.replace('/')
-      console.log('token过期')
-    }
-    return response
-  },
-  error => {
-    return Promise.reject(error)
-  }
-)
-export default axios

static/js/tool.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-unused-expressions */
 // 使用递归遍历所有属性判断是否 在对象里面匹配到值 借鉴js对象深拷贝的方式
 function loopObj (searkey, obj) {
   let bool = false
@@ -52,6 +53,21 @@ let tool = {
         return !!~filters[key].indexOf(item[key])
       })
     })
+  },
+
+  /**
+   * 数组对象去重
+   * @param {*} arr 目标数组
+   * @param {*} reference 去重参数
+   */
+  arrayHeavy: function unique (arr, reference) {
+    let map = new Map()
+    arr.forEach((item, index) => {
+      if (!map.has(item[reference])) {
+        map.set(item[reference], item)
+      }
+    })
+    return [...map.values()]
   }
 }
 

vue.config.js

@@ -5,14 +5,14 @@ module.exports = {
   indexPath: 'index.html',
 
   devServer: {
-    open: false,
+    open: true,
     host: 'localhost',
     port: '8080',
     https: false,
     hotOnly: false,
     proxy: {
       '/url/': {
-        target: '',
+        target: 'http://chaoyang.yulongcode.com/api/',
         ws: false,
         changeOrigin: true,
         pathRewrite: {
@@ -28,7 +28,7 @@ module.exports = {
       hints: 'warning',
       maxEntrypointSize: 500000000,
       maxAssetSize: 300000000,
-      assetFilter: function(assetFilename) {
+      assetFilter: function (assetFilename) {
         return assetFilename.endsWith('.js')
       }
     }