diff --git a/src/assets/404_images/404.png b/src/assets/404_images/404.png
new file mode 100644
index 0000000..3d8e230
Binary files /dev/null and b/src/assets/404_images/404.png differ
diff --git a/src/assets/404_images/404_cloud.png b/src/assets/404_images/404_cloud.png
new file mode 100644
index 0000000..c6281d0
Binary files /dev/null and b/src/assets/404_images/404_cloud.png differ
diff --git a/src/router/index.js b/src/router/index.js
index da97b62..98586a2 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -32,6 +32,18 @@ const routes = [
       title: '登录界面'
     }
   },
+  {
+    path:'/404',
+    name:'404',
+    component:() =>import('@/views/error/404'),
+    meta: {
+      title: '404'
+    }
+  },
+  {
+    path: '*',
+    redirect: '/404'
+  },
 
 ]
 
diff --git a/src/views/Brand.vue b/src/views/Brand.vue
index 40f42e3..c4f23c6 100644
--- a/src/views/Brand.vue
+++ b/src/views/Brand.vue
@@ -29,7 +29,7 @@
                 <td class="td">收费金额</td>
               </thead>
               <tbody class="tbody">
-                <tr class="tr" v-for="item, index in rankData" :key="index">
+                <tr class="tr" v-for="(item, index) in rankData" :key="index">
                   <td class="td" v-if="index == 0"><img src="/img/img3.png" alt=""></td>
                   <td class="td" v-if="index == 1"><img src="/img/img4.png" alt=""></td>
                   <td class="td" v-if="index == 2"><img src="/img/img5.png" alt=""></td>
@@ -139,8 +139,13 @@ import { BiApi } from "@/api/form";
 import "@/assets/js/flexible";
 import "@/assets/js/china";
 import countTo from "vue-count-to";
-// console.log(window.location.href);
-const authCode = "712110694685872129";
+
+const paramsArr = window.location.href.split('?')
+let authCode = ''
+if (paramsArr.length > 1) {
+  authCode = paramsArr[1].split('=')[1];   //获取授权号
+}
+
 
 export default {
   name: "Brand",
@@ -161,7 +166,6 @@ export default {
       todayCarUse: [],
       // 开放统计-车辆使用统计
       useCarCon: {},
-      authCode: '',
       nowTime: '',
       week: '',
       date: '',
@@ -196,13 +200,19 @@ export default {
   },
   computed: {},
   created() {
-    this.authCode = '712110694681677824'
-    this.getData();
-
   },
   mounted() {
-    this.heart();
-    this.getEchart();
+    if (authCode && typeof +authCode === 'number') {
+      this.heart();
+      this.getEchart();
+    } else {
+      console.log('授权码为空', authCode);
+      alert('授权码为空,请从系统调用页面!')
+      this.$router.push({
+        path: '/404'
+      })
+      return
+    }
   },
   methods: {
     /**
@@ -222,32 +232,49 @@ export default {
       this.heartTimes += 1;
       this.formatNowTimes(); //放外面就每一秒执行一次
       if (this.heartTimes === 1 || this.heartTimes % 10 === 0) { // 首次加载和每10秒执行一次
-        this.getTodayTrade();
-        this.getRealTimeInOutRecord();
+        this.getData();
       }
     },
+
     getData() {
+      // 今日交易金额-笔数数据
+      BiApi.getTodayTrade({ authCode }).then((res) => {
+        // console.log(res);
+        if (res.code === 200) {
+          const { totalAmount, totalNum } = res.data
+          this.startNumber = this.endNumber;
+          this.startAmount = this.endAmount;
+          this.endNumber = +totalNum;
+          this.endAmount = +totalAmount;
+        }
+      });
+      // 实时进出信息
+      BiApi.getRealTimeInOutRecord({ authCode, pageNum: 1, pageSize: 10 }).then((res) => {
+        if (res.code === 200) {
+          this.realTimeInOutRecord = res.rows
+        }
+      });
       // 开放统计-车场排行
-      BiApi.getParkingRanking({ authCode: this.authCode }).then((res) => {
+      BiApi.getParkingRanking({ authCode }).then((res) => {
         this.rankData = res.data
       })
       // 开放统计-支付统计
-      BiApi.paymentStatistics({ authCode: this.authCode }).then((res) => {
+      BiApi.paymentStatistics({ authCode }).then((res) => {
         this.payData = res.data
       })
       // 开放统计-收费车辆统计
-      BiApi.amountCartStatistics({ authCode: this.authCode }).then((res) => {
+      BiApi.amountCartStatistics({ authCode }).then((res) => {
         this.payDataCar = res.data
       })
       // 开放统计-24小时车流统计
-      BiApi.todayTrafficStatistics({ authCode: this.authCode }).then((res) => {
+      BiApi.todayTrafficStatistics({ authCode }).then((res) => {
         this.todayTraffic = res.data
       })
       //  开放统计-24小时车辆使用统计
-      BiApi.todayCarUseStatistics({ authCode: this.authCode }).then((res) => {
+      BiApi.todayCarUseStatistics({ authCode }).then((res) => {
         this.todayCarUse = res.data
       })
-      BiApi.useCarStatistics({ authCode: this.authCode }).then((res) => {
+      BiApi.useCarStatistics({ authCode }).then((res) => {
         this.useCarCon = res.data
       })
 
@@ -265,38 +292,6 @@ export default {
       this.timer = null;
       this.heartTimes = 0;
     },
-    /**
-     * 今日交易金额-笔数数据
-     *  */
-    getTodayTrade() {
-      BiApi.getTodayTrade({ authCode }).then((res) => {
-        // console.log(res);
-        if (res.code === 200) {
-          const { totalAmount, totalNum } = res.data
-          this.startNumber = this.endNumber;
-          this.startAmount = this.endAmount;
-          this.endNumber = +totalNum;
-          this.endAmount = +totalAmount;
-        }
-
-      });
-
-    },
-    /**
-     * 实时进出信息
-     *  */
-    getRealTimeInOutRecord() {
-      const query = {
-        authCode,
-        pageNum: 1,
-        pageSize: 10,
-      }
-      BiApi.getRealTimeInOutRecord(query).then((res) => {
-        if (res.code === 200) {
-          this.realTimeInOutRecord = res.rows
-        }
-      });
-    },
 
     convertData(data) {
       // 地图数据转换
@@ -438,8 +433,8 @@ export default {
         韶关: [113.7964, 24.7028],
       };
 
-      let planePath =
-        "path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z";
+      // let planePath =
+      //   "path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z";
 
       let color = ["#fff", "#fff", "#fff"]; //航线的颜色
       let series = [];
@@ -577,6 +572,7 @@ export default {
       };
 
       myChart.setOption(option, true);
+      // eslint-disable-next-line no-undef
       var dataList = echarts.getMap("china").geoJson.features;
       // console.log("dataList:", dataList);
       // 鼠标事件
diff --git a/src/views/error/404.vue b/src/views/error/404.vue
new file mode 100644
index 0000000..a04f393
--- /dev/null
+++ b/src/views/error/404.vue
@@ -0,0 +1,245 @@
+<template>
+  <div class="wscn-http404-container">
+    <div class="wscn-http404">
+      <div class="pic-404">
+        <img class="pic-404__parent" src="@/assets/404_images/404.png" alt="404">
+        <img class="pic-404__child left" src="@/assets/404_images/404_cloud.png" alt="404">
+        <img class="pic-404__child mid" src="@/assets/404_images/404_cloud.png" alt="404">
+        <img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404">
+      </div>
+      <div class="bullshit">
+        <div class="bullshit__oops">
+          404错误!
+        </div>
+        <div class="bullshit__headline">
+          {{ message }}
+        </div>
+        <div class="bullshit__info">
+          对不起，您正在寻找的页面不存在。尝试检查URL的错误，然后按浏览器上的刷新按钮或尝试在我们的应用程序中找到其他内容。
+        </div>
+        <router-link :to="indexUrl" class="bullshit__return-home">
+          返回首页
+        </router-link>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: 'Page404',
+  data() {
+    return {
+      indexUrl: "/",
+    };
+  },
+  computed: {
+    message() {
+      return '找不到网页！'
+    }
+  },
+  created() {
+    if(!this.$store.getters.notVisitIndex) {
+      this.indexUrl = '/'
+    } else {
+      this.indexUrl = '/user/profile'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.wscn-http404-container{
+  transform: translate(-50%,-50%);
+  position: absolute;
+  top: 40%;
+  left: 50%;
+}
+.wscn-http404 {
+  position: relative;
+  width: 1200px;
+  padding: 0 50px;
+  overflow: hidden;
+  .pic-404 {
+    position: relative;
+    float: left;
+    width: 600px;
+    overflow: hidden;
+    &__parent {
+      width: 100%;
+    }
+    &__child {
+      position: absolute;
+      &.left {
+        width: 80px;
+        top: 17px;
+        left: 220px;
+        opacity: 0;
+        animation-name: cloudLeft;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      &.mid {
+        width: 46px;
+        top: 10px;
+        left: 420px;
+        opacity: 0;
+        animation-name: cloudMid;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1.2s;
+      }
+      &.right {
+        width: 62px;
+        top: 100px;
+        left: 500px;
+        opacity: 0;
+        animation-name: cloudRight;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      @keyframes cloudLeft {
+        0% {
+          top: 17px;
+          left: 220px;
+          opacity: 0;
+        }
+        20% {
+          top: 33px;
+          left: 188px;
+          opacity: 1;
+        }
+        80% {
+          top: 81px;
+          left: 92px;
+          opacity: 1;
+        }
+        100% {
+          top: 97px;
+          left: 60px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudMid {
+        0% {
+          top: 10px;
+          left: 420px;
+          opacity: 0;
+        }
+        20% {
+          top: 40px;
+          left: 360px;
+          opacity: 1;
+        }
+        70% {
+          top: 130px;
+          left: 180px;
+          opacity: 1;
+        }
+        100% {
+          top: 160px;
+          left: 120px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudRight {
+        0% {
+          top: 100px;
+          left: 500px;
+          opacity: 0;
+        }
+        20% {
+          top: 120px;
+          left: 460px;
+          opacity: 1;
+        }
+        80% {
+          top: 180px;
+          left: 340px;
+          opacity: 1;
+        }
+        100% {
+          top: 200px;
+          left: 300px;
+          opacity: 0;
+        }
+      }
+    }
+  }
+  .bullshit {
+    position: relative;
+    float: left;
+    width: 300px;
+    padding: 30px 0;
+    overflow: hidden;
+    &__oops {
+      font-size: 32px;
+      font-weight: bold;
+      line-height: 40px;
+      color: #1482f0;
+      opacity: 0;
+      margin-bottom: 20px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-fill-mode: forwards;
+    }
+    &__headline {
+      font-size: 20px;
+      line-height: 24px;
+      color: #222;
+      font-weight: bold;
+      opacity: 0;
+      margin-bottom: 10px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.1s;
+      animation-fill-mode: forwards;
+    }
+    &__info {
+      font-size: 13px;
+      line-height: 21px;
+      color: grey;
+      opacity: 0;
+      margin-bottom: 30px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.2s;
+      animation-fill-mode: forwards;
+    }
+    &__return-home {
+      display: block;
+      float: left;
+      width: 110px;
+      height: 36px;
+      background: #1482f0;
+      border-radius: 100px;
+      text-align: center;
+      color: #ffffff;
+      opacity: 0;
+      font-size: 14px;
+      line-height: 36px;
+      cursor: pointer;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.3s;
+      animation-fill-mode: forwards;
+    }
+    @keyframes slideUp {
+      0% {
+        transform: translateY(60px);
+        opacity: 0;
+      }
+      100% {
+        transform: translateY(0);
+        opacity: 1;
+      }
+    }
+  }
+}
+</style>