zxd-更新项目

package.json

@@ -49,6 +49,7 @@
     "js-beautify": "1.13.0",
     "js-cookie": "3.0.1",
     "jsencrypt": "3.0.0-rc.1",
+    "moment": "^2.29.4",
     "nprogress": "0.2.0",
     "quill": "1.3.7",
     "screenfull": "5.0.2",

public/html/ie.html

@@ -149,7 +149,8 @@
         谷歌浏览器<span>Google Chrome</span></a></li>
     <li class="browser-firefox"><a href="https://www.mozilla.org/zh-CN/firefox/new/">
         火狐浏览器<span>Mozilla Firefox</span></a></li>
-  <li class="browser-ie"><a href="https://windows.microsoft.com/zh-cn/internet-explorer/download-ie"> IE 11 浏览器<span>Internet Explorer</span></a>
+    <li class="browser-ie"><a href="https://windows.microsoft.com/zh-cn/internet-explorer/download-ie"> IE 11
+        浏览器<span>Internet Explorer</span></a>
     </li>
     <li class="browser-360"><a href="http://se.360.cn/"> 360安全浏览器<span>360 Chrome</span></a></li>
     <div class="clean"></div>

src/api/trajectory/vehicleType.js

@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+// 车辆类型
+export function getVehicleTypeList() {
+  return request({
+    url: '/trajectory/vehicle/vehicleTypeList',
+    method: 'get'
+  })
+}

src/assets/images/dark.svg

@@ -32,8 +32,10 @@
                         <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
                         <use fill="#F0F2F5" fill-rule="evenodd" xlink:href="#path-2"></use>
                     </g>
-          <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48" height="10"></rect>
+                    <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48"
-          <rect id="Rectangle-18" fill="#303648" mask="url(#mask-3)" x="0" y="0" width="16" height="40"></rect>
+                          height="10"></rect>
+                    <rect id="Rectangle-18" fill="#303648" mask="url(#mask-3)" x="0" y="0" width="16"
+                          height="40"></rect>
                 </g>
             </g>
         </g>

src/assets/images/light.svg

@@ -32,8 +32,10 @@
                         <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
                         <use fill="#F0F2F5" fill-rule="evenodd" xlink:href="#path-2"></use>
                     </g>
-          <rect id="Rectangle-18" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="16" height="40"></rect>
+                    <rect id="Rectangle-18" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="16"
-          <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48" height="10"></rect>
+                          height="40"></rect>
+                    <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48"
+                          height="10"></rect>
                 </g>
             </g>
         </g>

src/layout/components/Sidebar/Logo.vue

@@ -1,10 +1,12 @@
 <template>
-  <div :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"
+  <div :class="{'collapse':collapse}"
+       :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"
        class="sidebar-logo-container">
     <transition name="sidebarLogoFade">
       <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
         <img v-if="logo" :src="logo" class="sidebar-logo"/>
-        <h1 v-else :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }"
+        <h1 v-else
+            :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }"
             class="sidebar-title">
           {{ title }} </h1>
       </router-link>

src/router/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 import Router from 'vue-router'
 /* Layout */
 import Layout from '@/layout'
+import TrackMap from '@/views/trajectory/trackMap/trackMap.vue'
 
 Vue.use(Router)
 
@@ -29,6 +30,11 @@ Vue.use(Router)
 
 // 公共路由
 export const constantRoutes = [
+  {
+    path: '/trackMap/:vehicleId',
+    name: 'trackMap',
+    component: () => import('@/views/trajectory/trackMap/trackMap.vue')
+  },
     {
         path: '/redirect',
         component: Layout,
@@ -86,7 +92,7 @@ export const constantRoutes = [
                 meta: {title: '个人中心', icon: 'user'}
             }
         ]
-  }
+    },
 ]
 
 // 动态路由，基于用户权限动态去加载
@@ -161,17 +167,6 @@ export const dynamicRoutes = [
             }
         ]
     },
-  {
-    path: '/system/map',
-    children: [
-      {
-        path: 'index',
-        name: '实时轨迹',
-        component: () => import('@/views/system/map/map.vue'),
-        meta: { title: '实时轨迹', icon: 'form' }
-      }
-    ]
-  },
 ]
 
 // 防止连续点击多次路由报错

src/utils/generator/render.js

@@ -52,7 +52,8 @@ const componentChild = {
         options(h, conf, key) {
             const list = []
             conf.options.forEach(item => {
-        if (conf.optionType === 'button') list.push(<el-radio-button label={item.value}>{item.label}</el-radio-button>)
+                if (conf.optionType === 'button') list.push(<el-radio-button
+                    label={item.value}>{item.label}</el-radio-button>)
                 else list.push(<el-radio label={item.value} border={conf.border}>{item.label}</el-radio>)
             })
             return list

src/views/login.vue

@@ -129,6 +129,7 @@ export default {
     },
     handleLogin() {
       this.$refs.loginForm.validate(valid => {
+        console.log(valid)
         if (valid) {
           this.loading = true;
           if (this.loginForm.rememberMe) {

src/views/system/logininfor/index.vue

@@ -106,7 +106,8 @@
               @selection-change="handleSelectionChange" @sort-change="handleSortChange">
       <el-table-column align="center" type="selection" width="55"/>
       <el-table-column align="center" label="访问编号" prop="infoId"/>
-      <el-table-column :show-overflow-tooltip="true" :sort-orders="['descending', 'ascending']" align="center" label="用户名称" prop="userName"
+      <el-table-column :show-overflow-tooltip="true" :sort-orders="['descending', 'ascending']" align="center"
+                       label="用户名称" prop="userName"
                        sortable="custom"/>
       <el-table-column :show-overflow-tooltip="true" align="center" label="地址" prop="ipaddr" width="130"/>
       <el-table-column align="center" label="登录状态" prop="status">

src/views/system/map/map.vue

@@ -1,195 +0,0 @@
-<template>
-  <div>
-    <el-row>
-      <div id="container"></div>
-      <div class="input-card" v-show="true">
-        <div class="input-item">
-          <el-button type="primary" size="small" style="width: 90px" @click="startAnimation">开始动画</el-button>
-          <el-button type="primary" size="small" style="width: 90px" @click="pauseAnimation">暂停动画</el-button>
-          <el-button type="primary" size="small" style="width: 90px" @click="resumeAnimation">继续动画</el-button>
-          <el-button type="primary" size="small" style="width: 90px" @click="stopAnimation">停止动画</el-button>
-        </div>
-      </div>
-    </el-row>
-  </div>
-</template>
-
-
-<script>
-//这里可以导入其他文件（比如： 组件， 工具 js， 第三方插件 js， json文件， 图片文件等等）
-//例如： import 《组件名称》 from '《组件路径》 ';
-//安全密钥：6911d4b3d9f7745cfed4ab0c87ad9b3f
-//Key:965af9776cc04fc39f19b9ced7423ca0
-import AMapLoader from "@amap/amap-jsapi-loader";
-// 设置安全密钥
-window._AMapSecurityConfig = {
-  securityJsCode: '6911d4b3d9f7745cfed4ab0c87ad9b3f',
-}
-export default {
-  name: 'TrackContainer',
-  //import 引入的组件需要注入到对象中才能使用
-  components: {},
-  props: {
-    visible: Boolean,
-  },
-  data() {
-    //这里存放数据
-    return {
-      AMap: null,
-      //此处不声明 map 对象，可以直接使用 this.map赋值或者采用非响应式的普通对象来存储。
-      map: null,
-      mouseTool: null,
-      marker: null,
-      lineArr: [],
-    };
-  },
-  //计算属性 类似于 data 概念
-  computed: {},
-  //监控 data 中的数据变化
-  watch: {
-  },
-  //方法集合
-  methods: {
-    pauseAnimation () {
-      this.marker.pauseMove();
-    },
-    resumeAnimation () {
-      this.marker.resumeMove();
-    },
-    stopAnimation () {
-      this.marker.stopMove();
-    },
-    startAnimation () {
-      this.marker.moveAlong(this.lineArr, {
-        // 每一段的时长
-        duration: 500,//可根据实际采集时间间隔设置
-        // JSAPI2.0 是否延道路自动设置角度在 moveAlong 里设置
-        autoRotation: true,
-      });
-    },
-    initMap() {
-      AMapLoader.load({
-        key: "965af9776cc04fc39f19b9ced7423ca0",             // 申请好的Web端开发者Key，首次调用 load 时必填
-        version: "2.0",      // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
-        "plugins": [
-          "AMap.Scale",
-          "AMap.HawkEye",
-          "AMap.ToolBar",
-          "AMap.AutoComplete",
-          "AMap.PlaceSearch",
-          "AMap.ControlBar",
-          "AMap.MouseTool",
-          "AMap.DragRoute",
-          "AMap.MoveAnimation"],         // 需要使用的的插件列表，如比例尺'AMap.Scale'等
-      }).then((AMap) => {
-        this.AMap=AMap
-        this.marker=null;
-        this.lineArr = [[116.478935,39.997761],[116.478939,39.997825],[116.478912,39.998549],[116.478912,39.998549],[116.478998,39.998555],[116.478998,39.998555],[116.479282,39.99856],[116.479658,39.998528],[116.480151,39.998453],[116.480784,39.998302],[116.480784,39.998302],[116.481149,39.998184],[116.481573,39.997997],[116.481863,39.997846],[116.482072,39.997718],[116.482362,39.997718],[116.483633,39.998935],[116.48367,39.998968],[116.484648,39.999861]];
-        this.map = new AMap.Map("container", {  //设置地图容器id
-          viewMode: "2D",  //  是否为3D地图模式
-          zoom: 13,   // 初始化地图级别
-          center: [116.478935,39.997761], //中心点坐标  成都 104.065735, 30.659462
-          resizeEnable: true
-        });
-
-        this.marker = new AMap.Marker({
-          map: this.map,
-          position: [116.478935,39.997761],
-          icon: "https://a.amap.com/jsapi_demos/static/demo-center-v2/car.png",
-          offset: new AMap.Pixel(-13, -26),
-        });
-
-        // 绘制轨迹
-        var polyline = new AMap.Polyline({
-          map: this.map,
-          path: this.lineArr,
-          showDir:true,
-          strokeColor: "#28F",  //线颜色
-          // strokeOpacity: 1,     //线透明度
-          strokeWeight: 6,      //线宽
-          // strokeStyle: "solid"  //线样式
-        });
-
-        var passedPolyline = new AMap.Polyline({
-          map: this.map,
-          strokeColor: "#AF5",  //线颜色
-          strokeWeight: 6,      //线宽
-        });
-
-        this.marker.on('moving', function (e) {
-          passedPolyline.setPath(e.passedPath);
-          this.map.setCenter(e.target.getPosition(),true)
-        }.bind(this));
-
-        this.map.setFitView();
-
-
-
-
-      }).catch(e => {
-        console.log(e);
-      })
-    },
-  },
-  //生命周期 - 创建完成（可以访问当前 this 实例）
-  created() {
-  },
-  //生命周期 - 挂载完成（可以访问 DOM 元素）
-  mounted() {
-    this.initMap();
-  },
-  //生命周期 - 创建之前
-  beforeCreate() {
-  },
-  //生命周期 - 挂载之前
-  beforeMount() {
-  },
-  //生命周期 - 更新之前
-  beforeUpdate() {
-  },
-  //生命周期 - 更新之后
-  updated() {
-  },
-  //生命周期 - 销毁之前
-  beforeDestroy() {
-  },
-  //生命周期 - 销毁完成
-  destroyed() {
-  },
-  //如果页面有 keep-alive 缓存功能， 这个函数会触发
-  activated() {
-  },
-}
-</script>
-
-<style scoped>
-#container {
-  padding: 0px;
-  margin: 0px;
-  width: 100%;
-  height: 800px;
-}
-.input-item {
-  height: 2.2rem;
-}
-
-.input-card {
-  display: flex;
-  flex-direction: column;
-  min-width: 0;
-  word-wrap: break-word;
-  background-color: #fff;
-  background-clip: border-box;
-  border-radius: .25rem;
-  width: 10rem;
-  border-width: 0;
-  border-radius: 0.4rem;
-  box-shadow: 0 2px 6px 0 rgba(114, 124, 245, .5);
-  position: fixed;
-  bottom: 12rem;
-  right: 2rem;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  padding: 0.75rem 1.25rem;
-}
-</style>

src/views/system/operlog/index.vue

@@ -125,7 +125,8 @@
         </template>
       </el-table-column>
       <el-table-column align="center" label="请求方式" prop="requestMethod"/>
-      <el-table-column :show-overflow-tooltip="true" :sort-orders="['descending', 'ascending']" align="center" label="操作人员" prop="operName"
+      <el-table-column :show-overflow-tooltip="true" :sort-orders="['descending', 'ascending']" align="center"
+                       label="操作人员" prop="operName"
                        sortable="custom" width="110"/>
       <el-table-column :show-overflow-tooltip="true" align="center" label="操作地址" prop="operIp" width="130"/>
       <el-table-column align="center" label="操作状态" prop="status">
@@ -133,13 +134,15 @@
           <dict-tag :options="dict.type.sys_common_status" :value="scope.row.status"/>
         </template>
       </el-table-column>
-      <el-table-column :sort-orders="['descending', 'ascending']" align="center" label="操作日期" prop="operTime" sortable="custom"
+      <el-table-column :sort-orders="['descending', 'ascending']" align="center" label="操作日期" prop="operTime"
+                       sortable="custom"
                        width="180">
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.operTime) }}</span>
         </template>
       </el-table-column>
-      <el-table-column :show-overflow-tooltip="true" :sort-orders="['descending', 'ascending']" align="center" label="消耗时间" prop="costTime"
+      <el-table-column :show-overflow-tooltip="true" :sort-orders="['descending', 'ascending']" align="center"
+                       label="消耗时间" prop="costTime"
                        sortable="custom" width="110">
         <template slot-scope="scope">
           <span>{{ scope.row.costTime }}毫秒</span>

src/views/system/user/authRole.vue

@@ -17,7 +17,8 @@
     </el-form>
 
     <h4 class="form-header h4">角色信息</h4>
-    <el-table ref="table" v-loading="loading" :data="roles.slice((pageNum-1)*pageSize,pageNum*pageSize)" :row-key="getRowKey"
+    <el-table ref="table" v-loading="loading" :data="roles.slice((pageNum-1)*pageSize,pageNum*pageSize)"
+              :row-key="getRowKey"
               @row-click="clickRow" @selection-change="handleSelectionChange">
       <el-table-column align="center" label="序号" type="index">
         <template slot-scope="scope">

src/views/system/user/index.vue

@@ -145,11 +145,14 @@
         <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
           <el-table-column align="center" type="selection" width="50"/>
           <el-table-column v-if="columns[0].visible" key="userId" align="center" label="用户编号" prop="userId"/>
-          <el-table-column v-if="columns[1].visible" key="userName" :show-overflow-tooltip="true" align="center" label="用户名称"
+          <el-table-column v-if="columns[1].visible" key="userName" :show-overflow-tooltip="true" align="center"
+                           label="用户名称"
                            prop="userName"/>
-          <el-table-column v-if="columns[2].visible" key="nickName" :show-overflow-tooltip="true" align="center" label="用户昵称"
+          <el-table-column v-if="columns[2].visible" key="nickName" :show-overflow-tooltip="true" align="center"
+                           label="用户昵称"
                            prop="nickName"/>
-          <el-table-column v-if="columns[3].visible" key="deptName" :show-overflow-tooltip="true" align="center" label="部门"
+          <el-table-column v-if="columns[3].visible" key="deptName" :show-overflow-tooltip="true" align="center"
+                           label="部门"
                            prop="dept.deptName"/>
           <el-table-column v-if="columns[4].visible" key="phonenumber" align="center" label="手机号码"
                            prop="phonenumber" width="120"/>

src/views/trajectory/vehicle/list.vue

@@ -0,0 +1,304 @@
+<template>
+  <div class="dashboard-container">
+    <el-button type="primary" @click="handleAdd">新增车辆</el-button>
+
+    <el-dialog :visible.sync="dialogVisible2" title="新增车辆">
+        <span slot="footer" class="dialog-footer">
+          <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="车辆VIN">
+              <el-input v-model="form.vehicleVin"></el-input>
+            </el-form-item>
+            <el-form-item label="车辆拍照">
+              <el-input v-model="form.vehiclePlateNumber"></el-input>
+            </el-form-item>
+            <el-form-item label="车辆品牌">
+              <el-input v-model="form.vehicleBrand"></el-input>
+            </el-form-item>
+            <el-form-item label="车辆类型">
+              <el-select v-model="form.vehicleTypeName" placeholder="请选择类型">
+                <el-option v-for="item in vehicleType" :key="item.vehicleTypeId" :label="item.vehicleTypeName" :value="item.vehicleTypeId"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="电机厂商">
+              <el-select v-model="form.motorMerchantName" placeholder="请选择电机厂商">
+                <el-option v-for="item in motorMerchant" :key="item.motorMerchantId" :label="item.motorMerchantName" :value="item.motorMerchantId"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="电机">
+              <el-select v-model="form.motorName" placeholder="请选择电机">
+                <el-option v-for="item in motor" :key="item.motorId" :label="item.motorName" :value="item.motorId"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="电池厂商">
+              <el-select v-model="form.batteryMerchantName" placeholder="请选择电池厂商">
+                <el-option v-for="item in batteryMerchant" :key="item.batteryMerchantId" :label="item.batteryMerchantName" :value="item.batteryMerchantId"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="电池">
+              <el-select v-model="form.batteryName" placeholder="请选择电池">
+                <el-option v-for="item in battery" :key="item.batteryId" :label="item.batteryName" :value="item.batteryId"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-form>
+          <el-button @click="dialogVisible2 = false">取 消</el-button>
+          <el-button type="primary" @click="InsertVehicle">确 定</el-button>
+          </span>
+    </el-dialog>
+
+
+    <el-table :data="tableData" style="width: 100%" border>
+
+      <el-table-column label="车辆Id" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehicleId }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="车辆VIN号" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehicleVin }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="车辆车牌号" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehiclePlateNumber }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="品牌名称" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehicleBrand }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="车辆类型名称" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehicleTypeName }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="电机制造商名称" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.motorMerchantName }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="电机名称" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.motorName }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="电池制造商名称" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.batteryMerchantName }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="电池名称" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.batteryName }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="车辆状态" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehicleStatus }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="操作" width="300">
+        <template slot-scope="scope">
+          <el-button size="small" type="danger" @click="handleTrack(scope.row.vehicleId)">实时轨迹</el-button>
+
+          <el-button size="small" type="danger" @click="handleEdit(scope.row.vehicleId)">编辑</el-button>
+
+          <el-dialog :visible.sync="dialogVisible" title="车辆信息">
+            <span slot="footer" class="dialog-footer">
+
+              <el-form ref="form" :model="vehicle" label-width="80px">
+
+                <el-form-item label="车辆Id">
+                  <el-input v-model="vehicle.vehicleId"></el-input>
+                </el-form-item>
+                <el-form-item label="车辆VIN">
+                  <el-input v-model="vehicle.vehicleVin"></el-input>
+                </el-form-item>
+                <el-form-item label="车辆车牌号">
+                  <el-input v-model="vehicle.vehiclePlateNumber"></el-input>
+                </el-form-item>
+                <el-form-item label="车辆品牌">
+                  <el-input v-model="vehicle.vehicleBrand"></el-input>
+                </el-form-item>
+                <el-form-item label="车辆类型">
+                  <el-select v-model="vehicle.vehicleTypeName" placeholder="请选择类型">
+                    <el-option v-for="item in vehicleType" :key="item.vehicleTypeId" :label="item.vehicleTypeName" :value="item.vehicleTypeId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="电机厂商">
+                  <el-select v-model="vehicle.motorMerchantName" placeholder="请选择电机厂家">
+                    <el-option v-for="item in motorMerchant" :key="item.motorMerchantId" :label="item.motorMerchantName" :value="item.motorMerchantId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="电机">
+                  <el-select v-model="vehicle.motorName" placeholder="请选择电机">
+                    <el-option v-for="item in motor" :key="item.motorId" :label="item.motorName" :value="item.motorId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="电池厂商">
+                  <el-select v-model="vehicle.batteryMerchantName" placeholder="请选择电池厂商">
+                    <el-option v-for="item in batteryMerchant" :key="item.batteryMerchantId" :label="item.batteryMerchantName" :value="item.batteryMerchantId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="电池">
+                  <el-select v-model="vehicle.batteryName" placeholder="请选择电池">
+                    <el-option v-for="item in battery" :key="item.batteryId" :label="item.batteryName" :value="item.batteryId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="状态">
+                  <el-input v-model="vehicle.vehicleStatus"></el-input>
+                </el-form-item>
+              </el-form>
+              <el-button @click="dialogVisible = false">取消</el-button>
+              <el-button type="primary" @click="updateVehicle">确定</el-button>
+            </span>
+          </el-dialog>
+
+          <el-button size="small" type="danger" @click="handleDelete(scope.row.vehicleId)">删除</el-button>
+
+        </template>
+      </el-table-column>
+
+    </el-table>
+  </div>
+</template>
+<script>
+
+import {
+  getVehicleList, deleteVehicle, getVehicleByVehicleId, insertVehicle, updateVehicle } from '@/api/trajectory/vehicle'
+import { getVehicleTypeList } from '@/api/trajectory/vehicleType'
+import { getMotorMerchantList } from '@/api/trajectory/motorMerchant'
+import { getMotorList } from '@/api/trajectory/motor'
+import { getBatterMerchantList } from '@/api/trajectory/batteryMerchant'
+import { getBatteryList } from '@/api/trajectory/battery'
+
+export default {
+  data() {
+    return {
+      tableData: [],// 车辆数据
+      vehicleType: [], //车辆类型
+      motorMerchant: [], //电机制造商
+      motor: [], //电机
+      batteryMerchant: [], //电池制造商
+      battery: [], //电池
+      dialogVisible: false, //开关 关
+      dialogVisible2: false, //开关 关
+      vehicle: { //车辆信息
+        vehicleId: null,
+        vehicleVin: null,
+        vehiclePlateNumber: null,
+        vehicleBrand: null,
+        vehicleTypeName: null,
+        batteryMerchantName: null,
+        batteryName: null,
+        motorMerchantName: null,
+        motorName: null,
+        vehicleStatus: null
+      },// 单车辆信息
+      form:{} // 添加
+    }
+  },
+  created() {
+    this.getVehicleList()
+    this.getVehicleTypeList()
+    this.getMotorMerchantList()
+    this.getMotorList()
+    this.getBatteryMerchantList()
+    this.getBatteryList()
+  },
+  mounted() {
+  },
+  methods: {
+    // 车辆列表
+    getVehicleList() {
+      getVehicleList().then(res => {
+        console.log(res)
+        this.tableData = res.data
+      })
+    },
+    // 车辆删除
+    handleDelete(vehicleId) {
+      deleteVehicle(vehicleId).then(res => {
+        this.$message.success(res.data)
+        this.getVehicleList()
+      })
+    },
+    // 编辑
+    handleEdit(vehicleId) {
+      getVehicleByVehicleId(vehicleId).then(res => {
+        this.vehicle = res.data
+        this.dialogVisible = true
+      })
+    },
+    // 车辆类型
+    getVehicleTypeList() {
+      getVehicleTypeList().then(res => {
+        this.vehicleType = res.data
+      })
+    },
+    // 电机厂商
+    getMotorMerchantList() {
+      getMotorMerchantList().then(res => {
+        this.motorMerchant = res.data
+      })
+    },
+    // 电机
+    getMotorList() {
+      getMotorList().then(res => {
+        this.motor = res.data
+      })
+    },
+    // 电池厂商
+    getBatteryMerchantList() {
+      getBatterMerchantList().then(res => {
+        this.batteryMerchant = res.data
+      })
+    },
+    // 电池
+    getBatteryList() {
+      getBatteryList().then(res => {
+        this.battery = res.data
+      })
+    },
+    // 修改
+    updateVehicle() {
+      updateVehicle(this.vehicle).then(res => {
+        this.$message.success(res.data)
+      })
+    },
+    handleAdd() {
+      this.dialogVisible2 = true
+    },
+    InsertVehicle() {
+      insertVehicle(this.form).then(res => {
+        this.$message.success(res.data)
+        // 插入成功后关闭对话框
+        this.dialogVisible = false;
+        // 重新刷新列表数据的方法调用
+        this.getVehicleList();
+      })
+    },
+    handleTrack(vehicleId) {
+      //传参
+      this.$router.push({
+        name: 'trackMap', // 这里使用路由的名称，而不是实际路径
+        params: { vehicleId: vehicleId } // 携带的参数应该是一个对象
+      });
+    }
+  }
+}
+</script>
+<style scoped>
+
+</style>