初始化提交

3 years ago · 5289cf52bb
parent a9ea0e053b
commit 5289cf52bb
86 changed files with 11391 additions and 43 deletions
--- a/dist.zip
+++ b/dist.zip
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -8,7 +8,10 @@
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
+    "@amap/amap-jsapi-loader": "^1.0.1",
+    "axios": "^1.3.4",
    "core-js": "^3.8.3",
+    "element-ui": "^2.15.13",
    "vue": "^2.6.14",
    "vue-router": "^3.5.1",
    "vuex": "^3.6.2"
--- a/public/index.html
+++ b/public/index.html
@ -6,8 +6,13 @@
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
+    <script type="text/javascript">
+      window._AMapSecurityConfig = {
+          securityJsCode: "e51946ed1718ac5b4e7cbe6b7e3c57b8",
+      }
+  </script>
  </head>
-  <body>
+  <body style="margin: 0px;">
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
--- a/src/App.vue
+++ b/src/App.vue
@ -1,9 +1,5 @@
 <template>
  <div id="app">
-    <nav>
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
-    </nav>
    <router-view/>
  </div>
 </template>
@ -16,17 +12,4 @@
  text-align: center;
  color: #2c3e50;
 }
-
-nav {
-  padding: 30px;
-
-  a {
-    font-weight: bold;
-    color: #2c3e50;
-
-    &.router-link-exact-active {
-      color: #42b983;
-    }
-  }
-}
 </style>
--- a/src/api/base.js
+++ b/src/api/base.js
@ -0,0 +1,38 @@
+import request from "@/util/axios";
+
+// 获取天气
+export const queryWeath = () =>
+  request({
+    url: "/weather/v1/?district_id=370600&data_type=all&ak=YtoEHZgdNk1iyWzsU8Hj11YChF2fbaDD",
+    method: "get",
+  });
+
+// 获取车牌号
+export const getCarNum = () =>
+  request({
+    url: "/api/blade-business/common-api/get-car-no",
+    method: "get",
+  });
+
+// 获取车速
+export const getCarSpeed = (query) =>
+  request({
+    url: "/api/blade-business/common-api/get-car-speed",
+    method: "get",
+    params: query,
+  });
+
+// 获取早晚高峰
+export const getPeak = () =>
+  request({
+    url: "/api/blade-business/common-api/get-rush-hour",
+    method: "get",
+  });
+
+// 获取车站及相关信息
+export const getSiteInfo = (query) =>
+  request({
+    url: "/api/blade-business/common-api/get-site",
+    method: "get",
+    params: query,
+  });
--- a/src/assets/image/beijixing_down.png
+++ b/src/assets/image/beijixing_down.png
--- a/src/assets/image/bolanzhongxin_down.png
+++ b/src/assets/image/bolanzhongxin_down.png
--- a/src/assets/image/bowuguan_down.png
+++ b/src/assets/image/bowuguan_down.png
--- a/src/assets/image/chijia_up.png
+++ b/src/assets/image/chijia_up.png
--- a/src/assets/image/diyihaishuiyucang_updown.png
+++ b/src/assets/image/diyihaishuiyucang_updown.png
--- a/src/assets/image/dongpozhi_down.png
+++ b/src/assets/image/dongpozhi_down.png
--- a/src/assets/image/down_1.jpg
+++ b/src/assets/image/down_1.jpg
--- a/src/assets/image/down_10.jpg
+++ b/src/assets/image/down_10.jpg
--- a/src/assets/image/down_11.jpg
+++ b/src/assets/image/down_11.jpg
--- a/src/assets/image/down_12.jpg
+++ b/src/assets/image/down_12.jpg
--- a/src/assets/image/down_13.jpg
+++ b/src/assets/image/down_13.jpg
--- a/src/assets/image/down_14.jpg
+++ b/src/assets/image/down_14.jpg
--- a/src/assets/image/down_2.jpg
+++ b/src/assets/image/down_2.jpg
--- a/src/assets/image/down_3.jpg
+++ b/src/assets/image/down_3.jpg
--- a/src/assets/image/down_4.jpg
+++ b/src/assets/image/down_4.jpg
--- a/src/assets/image/down_5.jpg
+++ b/src/assets/image/down_5.jpg
--- a/src/assets/image/down_6.jpg
+++ b/src/assets/image/down_6.jpg
--- a/src/assets/image/down_7.jpg
+++ b/src/assets/image/down_7.jpg
--- a/src/assets/image/down_8.jpg
+++ b/src/assets/image/down_8.jpg
--- a/src/assets/image/down_9.jpg
+++ b/src/assets/image/down_9.jpg
--- a/src/assets/image/huochezhan_down.png
+++ b/src/assets/image/huochezhan_down.png
--- a/src/assets/image/jinlongqiao_down.png
+++ b/src/assets/image/jinlongqiao_down.png
--- a/src/assets/image/nansanlu_down.png
+++ b/src/assets/image/nansanlu_down.png
--- a/src/assets/image/peixunzhongxin_up.png
+++ b/src/assets/image/peixunzhongxin_up.png
--- a/src/assets/image/shigoutun_down.png
+++ b/src/assets/image/shigoutun_down.png
--- a/src/assets/image/up_1.jpg
+++ b/src/assets/image/up_1.jpg
--- a/src/assets/image/up_10.jpg
+++ b/src/assets/image/up_10.jpg
--- a/src/assets/image/up_11.jpg
+++ b/src/assets/image/up_11.jpg
--- a/src/assets/image/up_12.jpg
+++ b/src/assets/image/up_12.jpg
--- a/src/assets/image/up_13.jpg
+++ b/src/assets/image/up_13.jpg
--- a/src/assets/image/up_14.jpg
+++ b/src/assets/image/up_14.jpg
--- a/src/assets/image/up_2.jpg
+++ b/src/assets/image/up_2.jpg
--- a/src/assets/image/up_3.jpg
+++ b/src/assets/image/up_3.jpg
--- a/src/assets/image/up_4.jpg
+++ b/src/assets/image/up_4.jpg
--- a/src/assets/image/up_5.jpg
+++ b/src/assets/image/up_5.jpg
--- a/src/assets/image/up_6.jpg
+++ b/src/assets/image/up_6.jpg
--- a/src/assets/image/up_7.jpg
+++ b/src/assets/image/up_7.jpg
--- a/src/assets/image/up_8.jpg
+++ b/src/assets/image/up_8.jpg
--- a/src/assets/image/up_9.jpg
+++ b/src/assets/image/up_9.jpg
--- a/src/assets/image/yueliangwan_down.png
+++ b/src/assets/image/yueliangwan_down.png
--- a/src/assets/image/yueliangwan_up.png
+++ b/src/assets/image/yueliangwan_up.png
--- a/src/assets/image/组-1.gif
+++ b/src/assets/image/组-1.gif
--- a/src/assets/img/act_bag.png
+++ b/src/assets/img/act_bag.png
--- a/src/assets/img/back.png
+++ b/src/assets/img/back.png
--- a/src/assets/img/bag.png
+++ b/src/assets/img/bag.png
--- a/src/assets/img/bagg.jpg
+++ b/src/assets/img/bagg.jpg
--- a/src/assets/img/bagg.png
+++ b/src/assets/img/bagg.png
--- a/src/assets/img/blue.png
+++ b/src/assets/img/blue.png
--- a/src/assets/img/car.png
+++ b/src/assets/img/car.png
--- a/src/assets/img/car_bag.png
+++ b/src/assets/img/car_bag.png
--- a/src/assets/img/car_cen.gif
+++ b/src/assets/img/car_cen.gif
--- a/src/assets/img/center_bag.png
+++ b/src/assets/img/center_bag.png
--- a/src/assets/img/fire.png
+++ b/src/assets/img/fire.png
--- a/src/assets/img/gray.png
+++ b/src/assets/img/gray.png
--- a/src/assets/img/gray_blue.png
+++ b/src/assets/img/gray_blue.png
--- a/src/assets/img/green.png
+++ b/src/assets/img/green.png
--- a/src/assets/img/notice.png
+++ b/src/assets/img/notice.png
--- a/src/assets/img/pink_bag.png
+++ b/src/assets/img/pink_bag.png
--- a/src/assets/img/scenery.png
+++ b/src/assets/img/scenery.png
--- a/src/assets/img/speed.png
+++ b/src/assets/img/speed.png
--- a/src/assets/img/stop_bag.png
+++ b/src/assets/img/stop_bag.png
--- a/src/assets/img/tips.png
+++ b/src/assets/img/tips.png
--- a/src/assets/img/tipss.png
+++ b/src/assets/img/tipss.png
--- a/src/assets/img/wait_bag.png
+++ b/src/assets/img/wait_bag.png
--- a/src/assets/img/wea.png
+++ b/src/assets/img/wea.png
--- a/src/assets/img/weather.png
+++ b/src/assets/img/weather.png
--- a/src/assets/img/ye_car.png
+++ b/src/assets/img/ye_car.png
--- a/src/assets/img/yell_car.png
+++ b/src/assets/img/yell_car.png
--- a/src/assets/img/yellow.png
+++ b/src/assets/img/yellow.png
--- a/src/assets/img/yibiao.png
+++ b/src/assets/img/yibiao.png
--- a/src/main.js
+++ b/src/main.js
@ -1,7 +1,11 @@
-import Vue from 'vue';
-import App from './App.vue';
-import router from './router';
-import store from './store';
+import Vue from "vue";
+import App from "./App.vue";
+import router from "./router";
+import store from "./store";
+import ElementUI from "element-ui";
+import "element-ui/lib/theme-chalk/index.css";
+
+Vue.use(ElementUI);

 Vue.config.productionTip = false;

@ -9,4 +13,4 @@ new Vue({
  router,
  store,
  render: (h) => h(App),
-}).$mount('#app');
+}).$mount("#app");
--- a/src/router/index.js
+++ b/src/router/index.js
@ -1,27 +1,41 @@
-import Vue from 'vue';
-import VueRouter from 'vue-router';
-import HomeView from '../views/HomeView.vue';
+import Vue from "vue";
+import VueRouter from "vue-router";
+import HomeView from "../views/HomeView.vue";
+import AboutView from "../views/AboutView.vue";
+import stopView from "../views/stopView.vue";
+import trafficView from "../views/trafficView.vue";

 Vue.use(VueRouter);

 const routes = [
  {
-    path: '/',
-    name: 'home',
+    path: "/home",
+    name: "home",
    component: HomeView,
  },
  {
-    path: '/about',
-    name: 'about',
+    path: "/",
+    name: "about",
+    component: AboutView,
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
-    component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue'),
+    // component: () => import(/* webpackChunkName: "about" */ "../views/AboutView.vue"),
+  },
+  {
+    path: "/stop",
+    name: "stop",
+    component: stopView,
+  },
+  {
+    path: "/traffic",
+    name: "traffic",
+    component: trafficView,
  },
 ];

 const router = new VueRouter({
-  mode: 'history',
+  mode: "history",
  base: process.env.BASE_URL,
  routes,
 });
--- a/src/util/axios.js
+++ b/src/util/axios.js
@ -0,0 +1,52 @@
+import axios from "axios";
+
+//默认超时时间
+// axios.defaults.timeout = 1000 * 60 *;
+//跨域请求，允许保存cookie
+axios.defaults.withCredentials = true;
+
+//返回其他状态码
+axios.defaults.validateStatus = function (status) {
+  return status >= 200 && status <= 500;
+};
+
+//HTTP Request拦截
+axios.interceptors.request.use(
+  (config) => {
+    if (config.headers["Content-Type"] != undefined) {
+      config.headers["Content-Type"] = "application/x-www-form-urlencoded";
+    } else {
+      config.headers["Content-Type"] = "application/json";
+    }
+    return config;
+  },
+  (error) => {
+    console.error("Request interceptors:", error);
+    return Promise.reject(error);
+  }
+);
+
+//HTTP Response拦截
+axios.interceptors.response.use(
+  (res) => {
+    const ok = res.data.Success || res.data.status == "200" || false,
+      status = res.status || 200,
+      message =
+        res.data.AllMessages ||
+        res.data.errorMessage ||
+        res.data.message ||
+        "Internal Server Error!";
+
+    if (!ok && !status) {
+      return Promise.reject(new Error(message));
+    }
+
+    return res.data;
+  },
+  (error) => {
+    console.error("Response interceptors:", error);
+    return Promise.reject(error);
+  }
+);
+
+export default axios;
--- a/src/views/AboutView.vue
+++ b/src/views/AboutView.vue
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@ -1,18 +1,242 @@
 <template>
-  <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
+  <div class="container">
+    <div class="top_box">
+        <div class="left_top">
+          <img style="margin-left:10px" src="@/assets/img/car.png" alt="">
+          <div class="time_txt">{{date}} {{time}}</div>
+          <div class="traffic_txt">拥堵</div>
+          <div class="speed_txt">{{speed}}KM/H</div>
+        </div>
+        <div class="right_top">
+          <img  src="@/assets/img/weather.png" alt="">
+          <div style="margin: 0 20px">5~20℃</div>
+        </div>
+    </div>
+    <!-- <div class="bag">
+      <img src="@/assets/img/scenery.png" alt="">
+    </div> -->
+    <div class="bottom_box">
+      <div class="top_bottom">
+        <div class="box_left">下一站：山东商务职业技术学院</div>
+        <div class="box_right">施工中，路不拥堵，心情随意逛</div>
+      </div>
+      <div class="bot">
+        <div class="top_bot">
+          <div class="left_bot">
+            <img class="img" src="@/assets/img/fire.png" alt="">
+            <div>{{tips}}</div>
+          </div>
+          <div class="left_bot">
+            <img class="img" src="@/assets/img/notice.png" alt="">
+            <div class="txt">{{tip}}</div>
+          </div>
+        </div>
+        <div class="bot_box">
+          <div class="point_box">景点</div>
+          <div>烟台世界设计公园就在附近，艺展公园、烽火公园、逐浪公园等主题公园应有尽有</div>
+        </div>
+      </div>
+    </div>
  </div>
 </template>

 <script>
-// @ is an alias to /src
-import HelloWorld from '@/components/HelloWorld.vue';
-
 export default {
-  name: 'HomeView',
-  components: {
-    HelloWorld,
+  data() {
+    return {
+      time:'',
+      timer:null,
+      timer1:null,
+      date:'',
+      speed:'32',
+      tips:'向前跑，带着赤子的骄傲，生命的闪耀不坚持怎能看到',
+      tip:'4.13-17烟台春季车站在国际博览中心！',
+    }
+  },
+  created() {
+    this.getTime();
+    this.getText()
+  },
+  methods: {
+    getTime() {
+      //获取当前时间
+      this.timer = setInterval(() => {
+        var date = new Date();
+        var year = date.getFullYear(); //当前年份
+        var month = date.getMonth(); //当前月份
+        var data = date.getDate(); //天
+        var hours = date.getHours(); //小时
+        var minute = date.getMinutes(); //分
+        var second = date.getSeconds(); //秒
+        this.day = date.getDay(); //获取当前星期几
+        this.time = this.fn(hours) + ":" + this.fn(minute) + ":" + this.fn(second);
+        this.date = year + "/" + (month + 1) + "/" + data;
+        this.speed = Math.floor(Math.random() * 90) + 10;
+      }, 1000);
+    },
+     fn(str) {
+      let num = null;
+      str >= 10 ? (num = str) : (num = "0" + str);
+      return num;
+    },
+
+    getText(){
+      this.timer1 = setInterval(() => {
+        
+        if(this.tips == "向前跑，带着赤子的骄傲，生命的闪耀不坚持怎能看到"){
+          this.tips = "探索自然奥秘，感受地质瑰丽"
+        }else{
+          this.tips = '向前跑，带着赤子的骄傲，生命的闪耀不坚持怎能看到'
+        }
+
+        if(this.tip == "4.13-17烟台春季车站在国际博览中心！"){
+          this.tip = '4.13-17烟台地质博物馆所有展览全年免费向公众开放'
+        }else{
+          this.tip = "4.13-17烟台春季车站在国际博览中心！"
+        }
+      }, 5000);
+    },
  },
 };
 </script>
+<style lang="scss" scoped>
+.container{
+  width: 100%;
+  height: 100%;
+  position: absolute;
+
+  .top_box{
+    width: 100%;
+    height: 6%;
+    background: #333;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    color: #fff;
+    font-size: 18px;
+
+    .left_top{
+      height: 100%;
+      display: flex;
+      align-items: center;
+
+      .time_txt{
+        margin: 0 20px;
+      }
+      .traffic_txt{
+        width: 60px;
+        height: 65%;
+        background: #c00000;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-right: 20px;
+      }
+
+      .speed_txt{
+        width: 100px;
+        height: 65%;
+        background: #548235;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+
+    .right_top{
+      display: flex;
+
+    }
+  }
+
+  .bag{
+    position: absolute;
+    bottom: 16%;
+  }
+
+  .bottom_box{
+    width: 100%;
+    height: 15%;
+    position: absolute;
+    bottom: 0;
+
+    .top_bottom{
+      width: 100%;
+      height: 30%;
+      display: flex;
+      color: #fff;
+      font-size: 18px;
+
+      .box_left{
+        width: 25%;
+        height: 100%;
+        background: #2baaf7;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+
+      .box_right{
+        width: 75%;
+        height: 100%;
+        background: #f04840;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+
+    .bot{
+      width: 100%;
+      height: 70%;
+      background: #333;
+      font-size: 18px;
+      color: #fff;
+
+      .top_bot{
+        width: 100%;
+        height: 50%;
+        display: flex;
+
+        .left_bot{
+          width: 50%;
+          height: 100%;
+          display: flex;
+          align-items: center;
+          letter-spacing: 2px;
+          font-size: 22px;
+
+          .txt{
+            color: #f3b700;
+          }
+
+          .img{
+            margin: 0 10px;
+          }
+        }
+      }
+
+      .bot_box{
+        display: flex;
+        align-items: center;
+        height: 50%;
+        width: 100%;
+        font-size: 22px;
+        letter-spacing: 2px;
+        color: rgb(126,126,119);
+
+        .point_box{
+          width: 100px;
+          height: 75%;
+          background: #ffc000;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          margin: 0 10px;
+          color: #fff;
+        }
+      }
+    }
+  }
+}
+</style>
--- a/src/views/index.html
+++ b/src/views/index.html
@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <style>
+    .container {
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      margin: -8px;
+      background-color: rgba(0, 0, 0, 0);
+    }
+    .top_box {
+      width: 100%;
+      height: 6%;
+      background: #333;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      color: #fff;
+      font-size: 18px;
+    }
+    .left_top {
+      height: 100%;
+      display: flex;
+      align-items: center;
+    }
+
+    .time_txt {
+      margin: 0 20px;
+    }
+    .traffic_txt {
+      width: 60px;
+      height: 65%;
+      background: #c00000;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-right: 20px;
+    }
+
+    .speed_txt {
+      width: 100px;
+      height: 65%;
+      background: #548235;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .right_top {
+      display: flex;
+    }
+  </style>
+  <body>
+    <div class="container">
+      <div class="top_box">
+        <div class="left_top">
+          <img style="margin-left: 10px" src="@/assets/img/car.png" alt="" />
+          <div class="time_txt">2023-03-28 14:05:40</div>
+          <div class="traffic_txt">拥堵</div>
+          <div class="speed_txt">37KM/H</div>
+        </div>
+        <div class="right_top">
+          <img src="@/assets/img/weather.png" alt="" />
+          <div style="margin: 0 20px">5~20℃</div>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>
--- a/src/views/stopView.vue
+++ b/src/views/stopView.vue
@ -0,0 +1,104 @@
+<template>
+    <div class="container">
+        <div class="center_box">
+            <div class="top_box">
+                <div class="top_txt">车辆正在休息</div>
+                <div class="bot_txt">请稍等片刻</div>
+            </div>
+            <div class="bot_box"><span class="txt">{{date}} {{time}}</span></div>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            date:'',
+            time:''
+        }
+    },
+    created() {
+       this.getTime() 
+    },
+    methods: {
+        getTime() {
+      //获取当前时间
+      this.timer = setInterval(() => {
+        var date = new Date();
+        var year = date.getFullYear(); //当前年份
+        var month = date.getMonth(); //当前月份
+        var data = date.getDate(); //天
+        var hours = date.getHours(); //小时
+        var minute = date.getMinutes(); //分
+        var second = date.getSeconds(); //秒
+        this.day = date.getDay(); //获取当前星期几
+        this.time = this.fn(hours) + ":" + this.fn(minute) + ":" + this.fn(second);
+        this.date = year + "/" + (month + 1) + "/" + data;
+        // this.speedValue = Math.floor(Math.random() * 90) + 10;
+      }, 1000);
+    },
+    fn(str) {
+      let num = null;
+      str >= 10 ? (num = str) : (num = "0" + str);
+      return num;
+    },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.container{
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    background: url("@/assets/img/stop_bag.png");
+    background-size: 100% 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-repeat: no-repeat;
+
+    .center_box{
+        width: 529px;
+        height: 642px;
+        background: url("@/assets/img/center_bag.png");
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: space-between;
+
+        .top_box{
+            margin-top: 25%;
+        }   
+
+        .top_txt{
+            font-size: 48px;
+            color: #0a8b56;
+            font-weight: bold;
+        }
+
+        .bot_txt{
+            font-size: 28px;
+            color: #0a8b56;
+            margin-top: 10px;
+        }
+
+        .bot_box{
+            width: 100%;
+            height: 17%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 32px;
+            color: #fff7cc;
+            font-weight: 300;
+            .txt{
+                text-shadow: 2px 2px 4px #390910;
+            }
+        }
+    }
+}
+</style>
--- a/src/views/trafficView.vue
+++ b/src/views/trafficView.vue
@ -0,0 +1,144 @@
+<template>
+  <div class="container">
+    <div class="map_box" id="map"></div>
+  </div>
+</template>
+
+<script>
+import AMapLoader from '@amap/amap-jsapi-loader';
+export default {
+    data() {
+        return {
+            
+        }
+    },
+    created() {
+        
+    },
+    mounted() {
+       this.initMap() 
+    },
+    methods: {
+        initMap(){
+            AMapLoader.load({
+                key:"af4c1cf82cc9aacefbadb4fc91d76ef9",             // 申请好的Web端开发者Key，首次调用 load 时必填
+                version:"2.0",      // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+                plugins:['AMap.LineSearch'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
+                
+            }).then((AMap)=>{
+                this.map = new AMap.Map("map",{  //设置地图容器id
+                    viewMode:"2D",    //是否为3D地图模式
+                    zoom:15,           //初始化地图级别
+                   center: [121.39975,37.542694],    //初始化地图中心点位置
+                //    mapStyle: "amap://styles/blue",
+                });
+                   
+                this.map.panBy(300,120,0)
+                var marker = new AMap.Marker({
+                    position: new AMap.LngLat(121.39975, 37.542694),   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
+                    title: ''
+                });
+
+                // 将创建的点标记添加到已有的地图实例：
+
+                
+                // console.log(traffic)
+                // this.getLine();
+
+                //实例化公交线路查询类
+            this.map.plugin(["AMap.LineSearch"], () => {
+
+           
+                var linesearch = new AMap.LineSearch({
+                    pageIndex: 1, //页码，默认值为1
+                    pageSize: 1, //单页显示结果条数，默认值为20，最大值为50
+                    city: "烟台", //限定查询城市，可以是城市名（中文/中文全拼）、城市编码，默认值为『全国』
+                    extensions: "all" //是否返回公交线路详细信息，默认值为『base』
+                });
+                console.log(linesearch)
+
+                //执行公交路线关键字查询
+                linesearch.search('17', (status, result)=> {
+                    //打印状态信息status和结果信息result
+                    console.log(status, result);
+                if (status === 'complete' && result.info === 'OK') {
+                        console.log('result', result)
+                        this.lineSearchData(result);
+                } else {
+                    alert(result);
+                }
+                });
+                 })
+
+                this.map.add(marker);
+                
+            }).catch(e=>{
+                console.log(e);
+            })
+        },
+        lineSearchData(data) {
+            var lineArr = data.lineInfo;
+            var lineNum = data.lineInfo.length;
+            if (lineNum == 0) {
+            } else {
+                for (var i = 0; i < lineNum; i++) {
+                    var pathArr = lineArr[i].path;
+                    var stops = lineArr[i].via_stops;
+                    var startPot = stops[0].location;
+                    var endPot = stops[stops.length - 1].location;
+                    if (i == 0) //作为示例，只绘制一条线路
+                    this.drawbusLine(startPot, endPot, pathArr);
+                }
+            }
+        },
+        drawbusLine(startPot, endPot, BusArr) {
+            //绘制起点，终点 
+            // new AMap.Marker({
+            //     map: this.map,
+            //     position: startPot, //基点位置
+            //     icon: "https://webapi.amap.com/theme/v1.3/markers/n/start.png",
+            //     zIndex: 10
+            // });
+            // new AMap.Marker({
+            //     map: this.map,
+            //     position: endPot, //基点位置
+            //     icon: "https://webapi.amap.com/theme/v1.3/markers/n/end.png",
+            //     zIndex: 10
+            // });
+            //绘制乘车的路线
+            var busPolyline = null;
+            busPolyline = new AMap.Polyline({
+                map: this.map,
+                path: BusArr,
+ 
+                strokeColor: "#ff3c00",//线颜色
+                strokeOpacity: 0.4,//线透明度
+                isOutline:true,
+                outlineColor:'white',
+                strokeWeight: 8//线宽
+            });
+            // this.map.setFitView();
+            var traffic = new AMap.TileLayer.Traffic({
+                    'autoRefresh': true,     //是否自动刷新,默认为false
+                    'interval': 180,         //刷新间隔,默认180s
+                });
+            this.map.add(traffic)
+        },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.container{
+    width: 100%;
+    height: 100%;
+    position: absolute;
+
+    .map_box{
+        margin: 10px 0 0 10px;
+        width: 680px;
+        height: 310px;
+        // background: red;
+    }
+}
+</style>
--- a/src/views/waitView.vue
+++ b/src/views/waitView.vue
@ -0,0 +1,114 @@
+<template>
+    <div class="container">
+        <div class="center_box" v-loading="loading" element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(255, 255, 255, 0)">
+            <div class="top_box">
+                <div class="top_txt">加载中...</div>
+                <div class="bot_txt">请耐心等待</div>
+            </div>
+            <div class="bot_box"><span class="txt">{{date}} {{time}}</span></div>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            date:'',
+            time:'',
+            loading:true
+        }
+    },
+    created() {
+       this.getTime() 
+    },
+    methods: {
+        getTime() {
+      //获取当前时间
+      this.timer = setInterval(() => {
+        var date = new Date();
+        var year = date.getFullYear(); //当前年份
+        var month = date.getMonth(); //当前月份
+        var data = date.getDate(); //天
+        var hours = date.getHours(); //小时
+        var minute = date.getMinutes(); //分
+        var second = date.getSeconds(); //秒
+        this.day = date.getDay(); //获取当前星期几
+        this.time = this.fn(hours) + ":" + this.fn(minute) + ":" + this.fn(second);
+        this.date = year + "/" + (month + 1) + "/" + data;
+        // this.speedValue = Math.floor(Math.random() * 90) + 10;
+      }, 1000);
+    },
+    fn(str) {
+      let num = null;
+      str >= 10 ? (num = str) : (num = "0" + str);
+      return num;
+    },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.container{
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    background: url("@/assets/img/stop_bag.png");
+    background-size: 100% 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-repeat: no-repeat;
+
+    .center_box{
+        width: 529px;
+        height: 642px;
+        background: url("@/assets/img/wait_bag.png");
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: space-between;
+
+        .top_box{
+            margin-top: 25%;
+        }   
+
+        .top_txt{
+            font-size: 48px;
+            color: #c47516;
+            font-weight: bold;
+        }
+
+        .bot_txt{
+            font-size: 28px;
+            color: #c47516;
+            margin-top: 10px;
+        }
+
+        .bot_box{
+            width: 100%;
+            height: 17%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 32px;
+            color: #fff7cc;
+            font-weight: 300;
+            .txt{
+                text-shadow: 2px 2px 4px #390910;
+            }
+        }
+
+        ::v-deep .el-loading-spinner{
+            top: 5% !important;
+            i{
+                color: #fff;
+                font-size: 85px;
+            }
+        }
+    }
+}
+</style>
--- a/vue.config.js
+++ b/vue.config.js
@ -1,5 +1,55 @@
-const { defineConfig } = require('@vue/cli-service');
+const { defineConfig } = require("@vue/cli-service");

 module.exports = defineConfig({
  transpileDependencies: true,
+  lintOnSave: false,
+  publicPath: "/",
+  productionSourceMap: false,
+  devServer: {
+    port: 8080,
+    proxy: {
+      "/api": {
+        // target: "http://192.168.3.81:8002",
+        target: "http://42.192.165.208:8002",
+        changeOrigin: true,
+        ws: true,
+        pathRewrite: {
+          "/api": "",
+        },
+      },
+      // '/gatewayapi': {
+      //   target: 'https://gatewayapi.lunz.cn/api',
+      //   changeOrigin: true,
+      //   ws: true,
+      //   pathRewrite: {
+      //     '/gatewayapi': ''
+      //   }
+      // },
+      "/weather": {
+        target: "https://api.map.baidu.com",
+        changeOrigin: true,
+        ws: true,
+        // pathRewrite: {
+        //   "/weather": "",
+        // },
+      },
+      // '/sjapi': {
+      //   target: 'http://192.168.1.38:8210',
+      //   // target: 'http://127.0.0.1:8210',
+      //   changeOrigin: true,
+      //   ws: true,
+      //   pathRewrite: {
+      //     '/sjapi': ''
+      //   }
+      // },
+      // '/pollapi': {
+      //   target: 'https://poll.kuaidi100.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      //   pathRewrite: {
+      //     '/pollapi': ''
+      //   }
+      // },
+    },
+  },
 });