上线车辆

.env.development

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 车联管理系统
+VUE_APP_TITLE = 智能车联管理系统
 
 # 开发环境配置
 ENV = 'development'

package.json

@@ -1,8 +1,8 @@
 {
   "name": "muyu",
   "version": "3.6.3",
-  "description": "车联网管理系统",
-  "author": "车联",
+  "description": "智能车联管理系统",
+  "author": "智能车联",
   "license": "MIT",
   "scripts": {
     "dev": "vue-cli-service serve",

src/api/couplet/VehicleDetection.js

@@ -0,0 +1,8 @@
+import request from "@/utils/request";
+
+export function detectionList() {
+  return request({
+    url: '/business/detection/detectionList',
+    method: 'post',
+  })
+}

src/api/couplet/employes.js

@@ -2,7 +2,7 @@ import request from "@/utils/request";
 
 export function listEmployes(query) {
   return request({
-    url: '/coupletEnterprisemanagement/employee/employeeList',
+    url: '/business/employee/employeeList',
     method: 'post',
     data: query
   })

src/api/couplet/fence.js

@@ -3,7 +3,7 @@ import request from '@/utils/request'
 // 查询电子围栏列表
 export function fenceList(data) {
   return request({
-    url: '/couplet/fence/fenceList',
+    url: '/business/fence/fenceList',
     method: 'post',
     data
   })
@@ -14,7 +14,7 @@ export function fenceList(data) {
  */
 export function fenceAdd(data) {
   return request({
-    url: '/couplet/fence/fenceAdd',
+    url: '/business/fence/fenceAdd',
     method: 'post',
     data
   })
@@ -24,7 +24,7 @@ export function fenceAdd(data) {
  */
 export function fenceUpdate(data) {
   return request({
-    url: '/couplet/fence/fenceUpdate',
+    url: '/business/fence/fenceUpdate',
     method: 'post',
     data
   })
@@ -37,7 +37,7 @@ export function fenceUpdate(data) {
  */
 export function fenceDelete(data) {
   return request({
-    url: '/couplet/fence/'+data,
+    url: '/business/fence/'+data,
     method: 'delete'
   })
 }
@@ -48,7 +48,7 @@ export function fenceDelete(data) {
  */
 export function changeFenceStatus(data) {
   return request({
-    url: '/couplet/fence/fenceState/',
+    url: '/business/fence/fenceState',
     method: 'post',
     data
   })
@@ -60,7 +60,7 @@ export function changeFenceStatus(data) {
  */
 export function queryByLogo() {
   return request({
-    url: '/couplet/logo/queryByLogo',
+    url: '/business/logo/queryByLogo',
     method: 'post'
   })
 }

src/api/couplet/manage.js

@@ -3,7 +3,7 @@ import request from '@/utils/request'
 // 查询部门列表
 export function listManage(query) {
   return request({
-    url: '/coupletEnterprisemanagement/manage/manageList',
+    url: '/business/manage/manageList',
     method: 'POST',
     params: query
   })
@@ -12,7 +12,7 @@ export function listManage(query) {
 // 查询部门列表（排除节点）
 export function listManageExcludeChild(deptId) {
   return request({
-    url: '/coupletEnterprisemanagement/manage/list/exclude/' + deptId,
+    url: '/business/manage/list/exclude/' + deptId,
     method: 'get'
   })
 }
@@ -20,7 +20,7 @@ export function listManageExcludeChild(deptId) {
 // 查询部门详细
 export function getManage(deptId) {
   return request({
-    url: '/coupletEnterprisemanagement/manage/' + deptId,
+    url: '/business/manage/' + deptId,
     method: 'get'
   })
 }
@@ -28,7 +28,7 @@ export function getManage(deptId) {
 // 新增部门
 export function addManage(data) {
   return request({
-    url: '/coupletEnterprisemanagement/manage',
+    url: '/business/manage',
     method: 'post',
     data: data
   })
@@ -36,7 +36,7 @@ export function addManage(data) {
 // 修改部门
 export function updateManage(data) {
   return request({
-    url: '/coupletEnterprisemanagement/manage ',
+    url: '/business/manage ',
     method: 'put',
     data: data
   })
@@ -45,7 +45,7 @@ export function updateManage(data) {
 // 删除部门
 export function delManage(deptId) {
   return request({
-    url: '/coupletEnterprisemanagement/manage/' + deptId,
+    url: '/business/manage/' + deptId,
     method: 'delete'
   })
 }

src/api/couplet/trouble.js

@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+// 查询故障码数据列表
+export function listTrouble(data) {
+  return request({
+    url: '/business/trouble/troubleList',
+    method: 'post',
+    data: data
+  })
+}
+
+// 查询故障类型
+export function getTroubleType() {
+  return request({
+    url: '/business/trouble/troubleTypeList',
+    method: 'get'
+  })
+}
+
+// 查询故障等级
+export function getTroubleGrade() {
+  return request({
+    url: '/business/trouble/troubleGradeList',
+    method: 'get'
+  })
+}
+
+// 添加故障码数据
+export function getAddTrouble(data) {
+  return request({
+    url: '/business/trouble/insertTrouble',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改故障码数据信息
+export function getUpdateTrouble(data) {
+  return request({
+    url: '/business/trouble/updateTrouble',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除故障码数据信息
+export function getDelTrouble(troubleId) {
+  return request({
+    url: '/business/trouble/remove/' + troubleId,
+    method: 'get'
+  })
+}

src/api/couplet/vehicle.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询车辆列表
+export function list(vehicleListParams) {
+  return request({
+    url: '/business/vehicle/list',
+    method: 'post',
+    data: vehicleListParams
+  })
+}
+
+//根据车辆id进行删除
+export function deleteById(vehicleId) {
+  return request({
+    url: '/business/vehicle/deleteById/' + vehicleId,
+    method: 'get'
+  })
+}
+
+//获取车辆类型
+export function getVehicleTypes() {
+  return request({
+    url: '/business/vehicleType/list',
+    method: 'get'
+  })
+}
+
+//编辑车辆
+export function editById(vehicle) {
+  return request({
+    url: '/business/vehicle/editById',
+    method: 'post',
+    data:vehicle
+  })
+}
+
+//新增车辆
+export function insert(vehicle) {
+  return request({
+    url: '/business/vehicle/insert',
+    method: 'post',
+    data:vehicle
+  })
+}
+
+//获取绑定当前车辆的标识
+export function getBindLogoByVehicleId(vehicleId) {
+  return request({
+    url: '/business/vehicle/getBindLogoById/'+vehicleId,
+    method: 'get'
+  })
+}
+

src/api/system/vehicle.js

@@ -1,19 +0,0 @@
-import request from '@/utils/request'
-
-// 查询车辆列表
-export function list(vehicleListParams) {
-  return request({
-    url: '/vehicle/vehicle/list',
-    method: 'post',
-    data: vehicleListParams
-  })
-}
-
-//根据车辆id进行删除
-export function deleteById(vehicleId) {
-  return request({
-    url: '/vehicle/vehicle/deleteById/' + vehicleId,
-    method: 'get'
-  })
-}
-

src/router/index.js

@@ -73,6 +73,20 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/business/fence',
+    component: Layout,
+    redirect: 'container',
+    children: [
+      {
+        path: '/business/fence/container',
+        component: () => import('@/views/couplet/fence/container.vue'),
+        name: 'fenMap',
+        meta: {title: '地图', icon: 'rate'}
+      }
+    ]
+  },
+
 
   {
     path: '/user',

src/views/couplet/VehicleDetection/index.vue

@@ -0,0 +1,165 @@
+<template>
+  <div>
+    <h1>车辆监控页面</h1>
+
+    <!--    列表-->
+    <el-table :data="vehicleList" style="width: 100%" border>
+      <el-table-column label="车辆id" width="90" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehicleId }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="车辆类型" width="90" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vehicleTypeName }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="电机厂商" width="150" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.motorManufacturer }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="电池厂商" width="150" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.batteryManufacturer }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="电机编号" width="180" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.motorNumber }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="电池编号" width="180" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.batteryNumber }}</span>
+        </template>
+      </el-table-column>
+
+       <el-table-column label="vin码" width="180" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.vin }}</span>
+        </template>
+      </el-table-column>
+
+
+      <!--      <el-table-column label="vin码" width="180" align="center">-->
+      <!--        <template slot-scope="scope">-->
+      <!--          <span style="margin-left: 10px">{{ scope.row.vin }}</span>-->
+      <!--        </template>-->
+      <!--      </el-table-column>-->
+      <el-table-column label="车辆状态" width="120" align="center">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px" v-if="1==scope.row.vehicleState">
+            <el-tag type="success">在线</el-tag>
+          </span>
+          <span style="margin-left: 10px" v-if="0==scope.row.vehicleState">
+            <el-tag type="danger">离线</el-tag>
+          </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="180" align="center">
+        <template slot-scope="scope">
+          <el-button size="mini" type="danger" @click="findByVehicle(scope.row.vin)">查看实时数据</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
+//例如：import 《组件名称》 from '《组件路径》,
+import {getVehicleTypes} from "@/api/couplet/vehicle";
+import {detectionList} from "@/api/couplet/VehicleDetection";
+
+export default {
+  //import引入的组件需要注入到对象中才能使用"
+  components: {},
+  props: {},
+  data() {
+    //这里存放数据"
+    return {
+      //车辆列表
+      vehicleList: [],
+
+      //总页数
+      total: 0,
+
+      //车辆类型
+      vehicleTypes: [],
+      //对话框的参数
+      formLabelWidth: '120px',
+      dialogEdit: false,
+      dialogInsert: false,
+      // 弹出层标题
+      title: ""
+
+    };
+  },
+  //计算属性 类似于data概念",
+  computed: {},
+  //监控data中的数据变化",
+  watch: {},
+  //方法集合",
+  methods: {
+    //获取车辆列表
+    getVehicleList() {
+      detectionList().then(
+        res => {
+          this.vehicleList = res.data;
+        }
+      )
+    },
+
+    //分页
+    handleSizeChange(val) {
+      this.vehicleListParams.pageSize = val;
+      this.getVehicleList();
+    },
+    handleCurrentChange(val) {
+      this.vehicleListParams.pageNum = val;
+      this.getVehicleList();
+    },
+
+    //获取车辆类型
+    getVehicleTypes() {
+      getVehicleTypes().then(
+        res => {
+          this.vehicleTypes = res.data;
+        }
+      )
+    },
+    findByVehicle(vin){
+
+    }
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）",
+  created() {
+    //获取车辆列表
+    this.getVehicleList ()
+
+    //获取车辆类型
+    this.getVehicleTypes()
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）",
+  mounted() {
+  },
+  beforeCreate() {
+  }, //生命周期 - 创建之前",
+  beforeMount() {
+  }, //生命周期 - 挂载之前",
+  beforeUpdate() {
+  }, //生命周期 - 更新之前",
+  updated() {
+  }, //生命周期 - 更新之后",
+  beforeDestroy() {
+  }, //生命周期 - 销毁之前",
+  destroyed() {
+  }, //生命周期 - 销毁完成",
+  activated() {
+  } //如果页面有keep-alive缓存功能，这个函数会触发",
+};
+</script>
+<style scoped>
+
+</style>

src/views/couplet/fence/container.vue

@@ -0,0 +1,155 @@
+<template>
+  <div>
+    <el-button class="btn" @click="drawGraph()" style="margin-bottom: 6px">绘制多边形</el-button>
+    <div id="container">
+
+
+    </div>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
+//例如：import 《组件名称》 from '《组件路径》,
+
+import AMapLoader from "@amap/amap-jsapi-loader";
+import {fenceUpdate} from "@/api/couplet/fence";
+
+export default {
+    //import引入的组件需要注入到对象中才能使用"
+    name:"map-view",
+    components: {AMap},
+    props: {},
+    data() {
+      //这里存放数据"
+      return {
+        map:null,
+        mouseTool: null, // 添加mouseTool作为组件数据属性
+        _AMap: null,
+        // drawGraph:{}
+        drawnPoints:{},
+        points:{}
+      };
+    },
+    //计算属性 类似于data概念",
+    computed: {
+
+    },
+    //监控data中的数据变化",
+    watch: {},
+    //方法集合",
+    methods: {
+      initAMap(){
+        AMapLoader.load({
+          key: "b5f283177b02e0bdd7f4981f4f219432", // 申请好的Web端开发者Key，首次调用 load 时必填
+          version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+          plugins: ["AMap.Scale","AMap.MouseTool"], //需要使用的的插件列表，如比例尺'AMap.Scale'，支持添加多个如：['...','...']
+        }).then((AMap) => {
+            this.map=new AMap.Map("container",{
+              viewMode:"3D",
+              zoom:11,
+              center:[116.39, 39.9],
+            })
+          // 解析传入的经纬度字符串
+
+          this.mouseTool = new AMap.MouseTool(this.map);
+          setTimeout(()=>{
+            if (this.drawnPoints.fenceLongitudeLatitude && typeof this.drawnPoints.fenceLongitudeLatitude === 'string') {
+              this.draw1()
+            }
+          },100)
+          this.mouseTool.on("draw", this.drawReady);
+
+        }).catch((e)=>{
+            console.log(e)
+        })
+      },
+
+
+      draw1(){
+         const pathArray = this.drawnPoints.fenceLongitudeLatitude.split(';').map(coordStr => {
+            const [lng, lat] = coordStr.split(',');
+            return { lng: parseFloat(lng), lat: parseFloat(lat) };
+          });
+          // 如果经纬度数据有效，则绘制多边形
+          //pathArray.every(coord => coord.lng && coord.lat)判断经纬度数据是否都有效
+          if (pathArray.length > 2 && pathArray.every(coord => coord.lng && coord.lat)) {
+            const polygon = this.mouseTool.Polygon({
+              path: pathArray,
+              strokeColor: "#FF33FF",
+              strokeOpacity: 1,
+              strokeWeight: 6,
+              fillColor: '#1791fc',
+              fillOpacity: 0.4,
+              strokeStyle: "solid",
+            });
+            polygon.setMap(this.map);
+          }
+        // } else {
+        //   // 如果没有传入经纬度，则保持原逻辑，等待用户点击按钮绘制
+        //   this.drawGraph()
+        // }
+      },
+      drawGraph(){
+          this.mouseTool.polygon({
+            strokeColor: "#FF33FF",
+            strokeOpacity: 1,
+            strokeWeight: 6,
+            fillColor: '#1791fc',
+            fillOpacity: 0.4,
+            // 线样式还支持 'dashed'
+            strokeStyle: "solid",
+            // strokeStyle是dashed时有效
+            // strokeDasharray: [30,10],
+          })
+      },
+      drawReady(event){
+        //获取绘制的点
+        let path = event.obj.getPath();
+        //遍历绘制的点，将经纬度转换成字符串拼接
+        const coordinatesString = path.map(point => `${point.lng},${point.lat}`).join('; ');
+        this.drawnPoints.fenceLongitudeLatitude=coordinatesString
+        this.$message("覆盖物对象绘制完成");
+        fenceUpdate(this.drawnPoints).then(res=>{
+          this.$message.success("编辑成功")
+          this.$router.push({path: '/business/fence/fence'})
+        })
+      }
+    },
+
+    //生命周期 - 创建完成（可以访问当前this实例）",
+    created() {
+    },
+    //生命周期 - 挂载完成（可以访问DOM元素）",
+    mounted() {
+      this.initAMap()
+      this.drawnPoints=this.$route.query.drawGraph
+
+    },
+    unmounted(){
+    },
+    beforeCreate() {
+    }, //生命周期 - 创建之前",
+    beforeMount() {
+    }, //生命周期 - 挂载之前",
+    beforeUpdate() {
+    }, //生命周期 - 更新之前",
+    updated() {
+    }, //生命周期 - 更新之后",
+    beforeDestroy() {
+    }, //生命周期 - 销毁之前",
+    destroyed() {
+    }, //生命周期 - 销毁完成",
+    activated() {
+    } //如果页面有keep-alive缓存功能，这个函数会触发",
+  };
+</script>
+<style scoped>
+    #container{
+      padding:0px;
+      margin: 0px;
+      width: 100%;
+      height: 800px;
+    }
+
+</style>

src/views/couplet/fence/index.html

@@ -1,16 +1,23 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
 <head>
-  <meta charset="UTF-8">
-  <title>Title</title>
+  <meta charset="utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta
+    name="viewport"
+    content="initial-scale=1.0, user-scalable=no, width=device-width"
+  />
+  <title>HELLO, AMAP!</title>
+  <style>
+    html,
+    body,
+    #container {
+      width: 100%;
+      height: 100%;
+    }
+  </style>
 </head>
 <body>
-
-<!-- 设置高德地图安全密钥 -->
-<script type="text/javascript">
-  window._AMapSecurityConfig = {
-    securityJsCode: 'd4afcbb16c37bab037fe756ffb063e51', // 你的密钥
-  }
-</script>
+<div id="container"></div>
 </body>
 </html>

src/views/couplet/fence/index.vue

@@ -33,14 +33,11 @@
       <el-table-column label="围栏名称" prop="fenceName" width="120"/>
       <el-table-column label="围栏经纬度" prop="fenceLongitudeLatitude" width="150"/>
       <el-table-column label="围栏描述" prop="fenceDescription" width="150"/>
-      <el-table-column align="center" label="状态" width="100">
+      <el-table-column
+        label="围栏状态">
         <template slot-scope="scope">
-          <el-switch
-            v-model="scope.row.fenceState"
-            active-value="0"
-            inactive-value="1"
-            @change="handleFenceStateChange(scope.row)"
-          ></el-switch>
+          <span style="margin-left: 10px" v-if="scope.row.fenceState == 0">已启用</span>
+          <span style="margin-left: 10px" v-if="scope.row.fenceState == 1">已停用</span>
         </template>
       </el-table-column>
       <el-table-column align="center" label="创建时间" prop="createTime" width="180">
@@ -59,15 +56,41 @@
       <el-table-column align="center" class-name="small-padding fixed-width" label="操作">
         <template slot-scope="scope">
           <el-button
-            v-hasPermi="['system:role:edit']"
+            v-hasPermi="['business:fence:fenceUpdate']"
             icon="el-icon-edit"
             size="mini"
             type="text"
-            @click="handleUpdate(scope.row)"
-          >修改
+            @click="handleQueryFence(scope.row)"
+          >查询围栏
           </el-button>
           <el-button
-            v-hasPermi="['system:role:remove']"
+            v-hasPermi="['business:fence:fenceUpdate']"
+            icon="el-icon-edit"
+            size="mini"
+            type="text"
+            @click="handleFenceUpdate(scope.row)"
+          >编辑电子围栏
+          </el-button>
+          <el-button
+            v-hasPermi="['business:fence:fenceState']"
+            v-if="scope.row.fenceState==1"
+            icon="el-icon-check"
+            size="mini"
+            type="text"
+            @click="handleStateChange(scope.row)"
+          >启用
+          </el-button>
+          <el-button
+            v-hasPermi="['business:fence:fenceState']"
+            v-if="scope.row.fenceState==0"
+            icon="el-icon-close"
+            size="mini"
+            type="text"
+            @click="handleFenceStateChange(scope.row)"
+          >停用
+          </el-button>
+          <el-button
+            v-hasPermi="['business:fence:fenceDelete']"
             icon="el-icon-delete"
             size="mini"
             type="text"
@@ -89,7 +112,6 @@
       </el-pagination>
     </div>
     <!-- Form -->
-
     <el-dialog title="新增电子围栏" :visible.sync="dialogFormVisible">
       <el-form :model="fenceInsertRequest">
         <el-form-item label="围栏名称" :label-width="formLabelWidth">
@@ -105,8 +127,35 @@
         <template>
           <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
           <div style="margin: 15px 0;"></div>
-          <el-checkbox-group v-model="logoIds" @change="handleCheckedCitiesChange">
-            <el-checkbox v-for="logo in logo" :label="logo.logoName" :key="logo.logoId">{{logo.logoName}}</el-checkbox>
+
+          <el-checkbox-group v-model="fenceInsertRequest.logoIds" @change="handleChange">
+            <el-checkbox v-for="item in logo" :key="item.logoId"  :label="item.logoId"  >{{item.logoName}}</el-checkbox>
+          </el-checkbox-group>
+        </template>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取 消</el-button>
+        <el-button type="primary" @click="addFence">确 定</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="修改电子围栏" :visible.sync="dialogFormVisible">
+      <el-form :model="fenceInsertRequest">
+        <el-form-item label="围栏名称" :label-width="formLabelWidth">
+          <el-input v-model="fenceInsertRequest.fenceName" autocomplete="off"></el-input>
+        </el-form-item>
+
+        <el-form-item label="电子围栏描述信息" :label-width="formLabelWidth">
+          <el-input v-model="fenceInsertRequest.fenceDescription" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="维护负责人" :label-width="formLabelWidth">
+          <el-input v-model="fenceInsertRequest.maintainerName" autocomplete="off"></el-input>
+        </el-form-item>
+        <template>
+          <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
+          <div style="margin: 15px 0;"></div>
+
+          <el-checkbox-group v-model="fenceInsertRequest.logoIds" @change="handleChange">
+            <el-checkbox v-for="item in logo" :key="item.logoId"  :label="item.logoId"  >{{item.logoName}}</el-checkbox>
           </el-checkbox-group>
         </template>
       </el-form>
@@ -116,71 +165,36 @@
       </div>
     </el-dialog>
 
-    <div class="mapBox">
-      <!--    使用高德地图的组件-->
-      <el-amap vid="amapDemo" :zoom="zoom" :center="center" style="height: 600px">
-        <!--      el-amap-marker>: 通过v-for指令循环遍历markers数组，-->
-        <!--      并为每个标记创建一个el-amap-marker组件，将标记的位置(position)绑定到数组中的相应数据。-->
-        <el-amap-marker
-          v-for="marker in markers"
-          :position="marker.position"
-          :events="marker.events"
-          :key="marker.index"
-        ></el-amap-marker>
-        <el-amap-info-window
-          v-for="window in windows"
-          :offset="window.offset"
-          :position="window.position"
-          :content="window.content"
-          :open="window.open"
-          :key="window.index"
-        ></el-amap-info-window>
-      </el-amap>
   </div>
 
-  </div>
-
-
 </template>
 
 <script>
 import {fenceList, changeFenceStatus, queryByLogo, fenceDelete, fenceAdd} from "@/api/couplet/fence";
-import {changeRoleStatus} from "@/api/system/role";
-import log from "@/views/monitor/job/log.vue";
-
+import path from "path";
 export default {
   components: {},
   data() {
     return {
-      // 遮罩层
-      loading: true,
-      // 单位信息
-      unit: "xxxxx政府司法局",
-      address: "xx省xx市xxxxx大道东433号",
-      // markers和windows数组用于存储地图标记和信息窗口的数据结构。
-      markers: [],
-      windows: [],
-      center: [116.39, 39.9],
-      zoom: 16,
-      // currentPosition: null, // 新增一个用于存储当前经纬度的变量
-      label: {
-        content: "自定义标题",
-        offset: [10, 12],
-      },
       // 查询参数
       queryParams: {},
       fence: [{}],
       fenceUpdateRequest:{},
-      fenceInsertRequest:{},
+      fenceInsertRequest:{
+        logoIds:[]
+      },
       dialogFormVisible: false,
       formLabelWidth: '120px',
       checkAll: false,
-      logo: [],
-      logoIds:{},
-      // cities: cityOptions,
+      logo: [
+        {
+          logoId:'',
+          logoName:'',
+        }
+      ],
+      checkedLogo: [],
       isIndeterminate: true,
       fenceChangeState:{}
-
     };
   },
   methods: {
@@ -222,10 +236,10 @@ export default {
       this.checkedCities = val ? this.logo : [];
       this.isIndeterminate = false;
     },
-    handleCheckedCitiesChange(value) {
-      let checkedCount = value.length;
-      this.checkAll = checkedCount === this.logo.length;
-      this.isIndeterminate = checkedCount > 0 && checkedCount < this.logo.length;
+    handleChange(value) {
+      // let checkedCount = value.length;
+      // this.checkAll = checkedCount === this.logo.length;
+      // this.isIndeterminate = checkedCount > 0 && checkedCount < this.logo.length;
     },
     /**
      * 分页
@@ -242,12 +256,12 @@ export default {
      * 新增数据
      */
     addFence(){
-      this.dialogFormVisible = false;
       fenceAdd(this.fenceInsertRequest).then(
         res=>{
           this.$message.success("新增成功")
         }
       )
+      this.dialogFormVisible = false;
     },
     /**
      * 查询多选框
@@ -257,30 +271,40 @@ export default {
       queryByLogo().then(
         res=>{
           this.logo=res.data
-          console.log(res)
         }
       )
-
     },
     // 围栏状态修改
     handleFenceStateChange(row) {
-      // let text = row.status === "0" ? "启用" : "停用";
-      // this.$modal.confirm('确认要"' + text + '"状态吗？').then(function () {
-      this.$modal.confirm('确认要修改状态吗？').then(function () {
+      debugger
+      if (row.fenceState === 0){
+        row.fenceState = 1
+        this.$modal.confirm('确认要停用状态吗？').then(function () {
           return changeFenceStatus(row);
         }).then(() => {
-        this.$modal.msgSuccess( "成功");
-        // this.$modal.msgSuccess(text + "成功");
-      }).catch(function () {
-        row.status = row.status === "0" ? "1" : "0";
-      });
+          this.$modal.msgSuccess( "停用成功");
+        })
+      }
+    },
+    handleStateChange(row) {
+      /**
+       * 启用
+       */
+      if (row.fenceState === 1) {
+        row.fenceState = 0
+        this.$modal.confirm('确认要启用状态吗？').then(function () {
+          return changeFenceStatus(row);
+        }).then(() => {
+          this.$modal.msgSuccess("启用成功");
+        })
+
+      }
     },
     /**
      * 电子围栏删除
      * @param map
      */
     handleFenceDelete(row){
-      console.log(row)
       var fenceId = row.fenceId;
       this.$modal.confirm('确认要修改编号为'+fenceId+'的信息吗？').then(function () {
         return fenceDelete(fenceId)
@@ -291,39 +315,15 @@ export default {
         this.$modal.msgError("删除失败");
       })
     },
-
-    // parseTime,
-    // 初始化地图
-    initMap(map) {
-      this.markers.push({
-        position: [116.39, 39.9],
-      });
-      this.windows.push({
-        position: [116.39, 39.9],
-        // position: this.currentPosition,
-        content:
-          "<h2 style='font-weight: bold;width: 400px;margin: 10px'>" +
-          this.unit +
-          "</h2>" +
-          "<div style='margin: 10px'>" +
-          "地址：" +
-          this.address +
-          "</div>",
-        offset: [0, -20],
-        open: true,
-      });
-
-      // var map = new AMap.Map("container", {
-      //   zoomEnable: true, //是否禁止缩放
-      //   zoom: 12, //缩放比例
-      //   dragEnable: false, //禁止拖动
-      //   cursor: "hand", // 鼠标在地图上的表现形式，小手
-      // });
-      // // 初始化工具条
-      // map.plugin(["AMap.ToolBar"], function () {
-      //   map.addControl(new AMap.ToolBar());
-      // });
+    /**
+     * 编辑电子围栏图形
+     */
+    handleFenceUpdate(row){
+      this.$router.push({path: '/business/fence/container', query: {drawGraph: row}})
     },
+    handleQueryFence(){
+
+    }
   },
   created() {
     this.queryByFenceList()
@@ -331,7 +331,7 @@ export default {
   },
   //生命周期 - 挂载完成（可以访问DOM元素）",
   mounted() {
-    this.initMap();
+
   },
 };
 </script>

src/views/couplet/trouble/index.vue

@@ -18,7 +18,7 @@
       </el-form-item>
       <el-form-item>
         <el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetTroubleQuery">重置</el-button>
       </el-form-item>
     </el-form>
 
@@ -71,11 +71,29 @@
     <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
       <el-table-column align="center" type="selection" width="55"/>
       <el-table-column align="center" label="故障码" prop="troubleCode"/>
-      <el-table-column align="center" label="故障类型" prop="typeName"/>
+<!--      <el-table-column align="center" label="故障类型" prop="typeName"/>-->
+      <el-table-column align="center" label="故障类型">
+        <template slot-scope="scope">
+            <div slot="reference" class="name-wrapper">
+              <el-tag size="medium" v-if="scope.row.typeId===1">电池故障</el-tag>
+              <el-tag size="medium" v-if="scope.row.typeId===2">车体故障</el-tag>
+              <el-tag size="medium" v-if="scope.row.typeId===3">车尾故障</el-tag>
+              <el-tag size="medium" v-if="scope.row.typeId===4">轴轮故障</el-tag>
+            </div>
+        </template>
+      </el-table-column>
       <el-table-column align="center" label="故障位" prop="troublePosition"/>
       <el-table-column align="center" label="故障值" prop="troubleValue"/>
       <el-table-column align="center" label="故障标签" prop="troubleTag"/>
-      <el-table-column align="center" label="故障等级" prop="gradeName"/>
+      <el-table-column align="center" label="故障等级">
+        <template slot-scope="scope">
+          <div slot="reference" class="name-wrapper">
+            <el-tag size="medium" v-if="scope.row.gradeId===1">高级</el-tag>
+            <el-tag size="medium" v-if="scope.row.gradeId===2">中级</el-tag>
+            <el-tag size="medium" v-if="scope.row.gradeId===3">低级</el-tag>
+          </div>
+        </template>
+      </el-table-column>
       <el-table-column align="center" class-name="small-padding fixed-width" label="操作">
         <template slot-scope="scope">
           <el-button
@@ -89,18 +107,100 @@
             icon="el-icon-delete"
             size="mini"
             type="text"
-            @click="handleDelete(scope.row)"
+            @click="handleDelet(scope.row.troubleId)"
           >删除
           </el-button>
         </template>
       </el-table-column>
     </el-table>
+
+    <!-- 添加对话框 -->
+    <el-dialog  :visible.sync="opens" append-to-body width="500px">
+      <el-form ref="form" :model="form" label-width="80px">
+        <el-form-item label="故障码">
+          <el-input v-model="form.troubleCode"/>
+        </el-form-item>
+        <el-form-item label="故障码位" prop="troublePosition">
+          <el-input v-model="form.troublePosition"/>
+        </el-form-item>
+        <el-form-item label="故障码值" prop="troubleValue">
+          <el-input v-model="form.troubleValue"/>
+        </el-form-item>
+        <el-form-item label="故障码标签" prop="troubleTag">
+          <el-input v-model="form.troubleTag"/>
+        </el-form-item>
+        <el-form-item label="故障码类型" prop="typeId">
+          <el-select v-model="form.typeId" placeholder="请选择故障类型">
+            <el-option v-for="item in type" :key="item.typeId" :label="item.typeName" :value="item.typeId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="故障码等级" prop="gradeId">
+          <el-select v-model="form.gradeId">
+            <el-option v-for="item in grade" :key="item.gradeId" :label="item.gradeName" :value="item.gradeId"></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitAdd">添 加</el-button>
+        <el-button @click="cance">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <!--修改对话框-->
+    <el-dialog  :visible.sync="open" append-to-body width="500px">
+      <el-form ref="fore" :model="fore" label-width="80px">
+        <el-form-item label="故障码">
+          <el-input v-model="fore.troubleCode"/>
+        </el-form-item>
+        <el-form-item label="故障码位" prop="troublePosition">
+          <el-input v-model="fore.troublePosition"/>
+        </el-form-item>
+        <el-form-item label="故障码值" prop="troubleValue">
+          <el-input v-model="fore.troubleValue"/>
+        </el-form-item>
+        <el-form-item label="故障码标签" prop="troubleTag">
+          <el-input v-model="fore.troubleTag"/>
+        </el-form-item>
+        <el-form-item label="故障码类型" prop="typeId">
+          <el-select v-model="form.typeId" placeholder="请选择故障类型">
+            <el-option v-for="item in type" :key="item.typeId" :label="item.typeName" :value="item.typeId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="故障码等级" prop="gradeId">
+          <el-select v-model="form.gradeId">
+            <el-option v-for="item in grade" :key="item.gradeId" :label="item.gradeName" :value="item.gradeId"></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitUpd">修 改</el-button>
+        <el-button @click="cance">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <el-pagination
+      @size-change="handleSize"
+      @current-change="handleCurrent"
+      :current-page="queryParams.pageNum"
+      :page-sizes = "[2, 3 , 5, 10]"
+      :page-size="queryParams.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="100"></el-pagination>
   </div>
 </template>
 
 <script>
 //这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
 //例如：import 《组件名称》 from '《组件路径》,
+import {
+  getAddTrouble,
+  getDelTrouble,
+  getTroubleGrade,
+  getTroubleType,
+  getUpdateTrouble,
+  listTrouble
+} from '@/api/couplet/trouble'
+
 export default {
     //import引入的组件需要注入到对象中才能使用"
     components: {},
@@ -109,13 +209,34 @@
       //这里存放数据"
 
       return {
-        queryParams:{troubleCode:'',troublePosition:''},
+        queryParams:{
+          pageNum : 1,
+          pageSize : 10,
+          troubleCode:'',
+          troublePosition:''
+        },
+        typeList1:[],
+        loading: true,
         //显示搜索条件
         showSearch:true,
         //非单个禁用
         single:true,
         //非多个禁用
-        multiple:true
+        multiple:true,
+        //列表数据
+        dataList:[],
+        // 总条数
+        total: 0,
+        //选中
+        ids:[],
+        // 是否显示弹出层
+        open: false,
+        opens: false,
+        // 表单参数
+        form: {},
+        fore:{},
+        type:[],
+        grade:[]
       };
     },
     //计算属性 类似于data概念",
@@ -124,27 +245,94 @@
     watch: {},
     //方法集合",
     methods: {
+      getList() {
+        this.loading =true;
+        listTrouble(this.addDateRange(this.queryParams)).then(res =>{
+          this.dataList = res.data.list;
+          this.total = res.data.total;
+          this.loading = false;
+        })
+      },
+      handleSelectionChange(selection) {
+        this.ids = selection.map(item => item.troubleId)
+        this.single = selection.length !=1
+        this.multiple = !selection.length
+      },
       handleQuery() {
         this.queryParams.pageNum = 1;
+        this.getList()
       },
-      resetQuery() {
+      resetTroubleQuery() {
+        this.resetForm("queryForm")
         this.handleQuery()
       },
+      /** 新增按钮操作 */
       handleAdd() {
-
+        this.opens = true;
       },
       handleUpd() {
-
+        this.open = true;
+      },
+      cance() {
+        this.open = false;
+        this.reset();
+      },
+      handleUpdate(data) {
+        this.fore = data
+        this.open = true
+      },
+      submitAdd() {
+        getAddTrouble(this.form).then(response => {
+          this.$modal.msgSuccess("新增成功");
+          this.opens = false;
+          this.getList();
+        });
+        this.opens = true;
+      },
+      submitUpd() {
+        getUpdateTrouble(this.fore).then(response => {
+          this.$modal.msgSuccess("修改成功");
+          this.open = false;
+          this.getList();
+        });
+        this.open = true;
       },
       handleDel() {
 
+      },
+      handleDelet(troubleId) {
+        getDelTrouble(troubleId).then(res =>{
+          this.$modal.msgSuccess("删除成功");
+          this.getList();
+        })
       },
       handleExe(){
 
+      },
+      changTypeId() {
+        getTroubleType().then(res => {
+          this.type = res
+        })
+      },
+      changGradeId() {
+        getTroubleGrade().then(res => {
+          this.grade = res
+        })
+      },
+      handleSize(val) {
+        this.queryParams.pageSize = val
+        this.getList()
+      },
+      handleCurrent(val) {
+        this.queryParams.pageNum = val
+        this.getList()
       }
     },
     //生命周期 - 创建完成（可以访问当前this实例）",
     created() {
+      this.getList()
+      this.changTypeId()
+      this.changGradeId()
     },
     //生命周期 - 挂载完成（可以访问DOM元素）",
     mounted() {

src/views/couplet/vehicle/index.vue

@@ -3,14 +3,33 @@
     <h1>车辆管理页面</h1>
     <!--    {{ vehicleList }}-->
 
+    <!--    列表表单-->
+    <el-form ref="form" :model="vehicleListParams" label-width="80px">
+      <el-form-item label="类型">
+        <el-select v-model="vehicleListParams.vehicleType" clearable placeholder="车辆类型" @change="getVehicleList">
+          <el-option v-for="item in vehicleTypes" :key="item.vehicleTypeId" :label="item.vehicleTypeName"
+                     :value="item.vehicleTypeId"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态">
+        <el-select v-model="vehicleListParams.vehicleState" clearable placeholder="车辆状态" @change="getVehicleList">
+          <el-option key="1" label="在线" value="1"></el-option>
+          <el-option key="0" label="离线" value="0"></el-option>
+        </el-select>
+      </el-form-item>
+    </el-form>
+
+
+    <el-button type="primary" icon="el-icon-edit" @click="toInsert">新增车辆</el-button>
+
+
+    <!--    列表-->
     <el-table :data="vehicleList" style="width: 100%" border>
       <el-table-column label="车辆id" width="90" align="center">
         <template slot-scope="scope">
           <span style="margin-left: 10px">{{ scope.row.vehicleId }}</span>
         </template>
       </el-table-column>
-
-      <!--   TODO   暂时显示车辆类型id，待处理-->
       <el-table-column label="车辆类型" width="90" align="center">
         <template slot-scope="scope">
           <span style="margin-left: 10px">{{ scope.row.vehicleTypeName }}</span>
@@ -36,11 +55,11 @@
           <span style="margin-left: 10px">{{ scope.row.batteryNumber }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="vin码" width="180" align="center">
-        <template slot-scope="scope">
-          <span style="margin-left: 10px">{{ scope.row.vin }}</span>
-        </template>
-      </el-table-column>
+      <!--      <el-table-column label="vin码" width="180" align="center">-->
+      <!--        <template slot-scope="scope">-->
+      <!--          <span style="margin-left: 10px">{{ scope.row.vin }}</span>-->0
+      <!--        </template>-->
+      <!--      </el-table-column>-->
       <el-table-column label="车辆状态" width="120" align="center">
         <template slot-scope="scope">
           <span style="margin-left: 10px" v-if="1==scope.row.vehicleState">
@@ -53,11 +72,93 @@
       </el-table-column>
       <el-table-column label="操作" width="180" align="center">
         <template slot-scope="scope">
-          <el-button size="mini" @click="">编辑</el-button>
+          <el-button size="mini" @click="toEdit(scope.row)">编辑</el-button>
           <el-button size="mini" type="danger" @click="deleteById(scope.row.vehicleId)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
+    <!--    分页-->
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="vehicleListParams.pageNum"
+      :page-sizes="[5,7,10,20]"
+      :page-size="vehicleListParams.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="total">
+    </el-pagination>
+
+    <!--    编辑对话框-->
+    <el-dialog :title=title :visible.sync="dialogEdit">
+      <el-form :model="vehicle">
+        <el-form-item label="车辆类型" :label-width="formLabelWidth">
+          <el-select v-model="vehicle.vehicleType" placeholder="车辆类型">
+            <el-option v-for="item in vehicleTypes" :key="item.vehicleTypeId" :label="item.vehicleTypeName"
+                       :value="item.vehicleTypeId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="电机厂商" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.motorManufacturer" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="电池厂商" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.batteryManufacturer" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="电机编号" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.motorNumber" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="电池编号" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.batteryNumber" autocomplete="off"></el-input>
+        </el-form-item>
+        <!--        标签复选框 需要在点击编辑框的时候查询当前车说绑定的标识-->
+        <el-checkbox-group v-model="vehicle.logoIds">
+          <el-checkbox :label=1>标识1</el-checkbox>
+          <el-checkbox :label=2>标识2</el-checkbox>
+          <el-checkbox :label=3>标识3</el-checkbox>
+        </el-checkbox-group>
+
+      </el-form>
+      <!--      {{ vehicle }}-->
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="reset()">取 消</el-button>
+        <el-button type="primary" @click="editById">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!--    新增对话框-->
+    <el-dialog :title=title :visible.sync="dialogInsert">
+      <el-form :model="vehicle">
+        <el-form-item label="车辆类型" :label-width="formLabelWidth">
+          <el-select v-model="vehicle.vehicleType" placeholder="车辆类型">
+            <el-option v-for="item in vehicleTypes" :key="item.vehicleTypeId" :label="item.vehicleTypeName"
+                       :value="item.vehicleTypeId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="电机厂商" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.motorManufacturer" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="电池厂商" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.batteryManufacturer" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="电机编号" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.motorNumber" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item label="电池编号" :label-width="formLabelWidth">
+          <el-input v-model="vehicle.batteryNumber" autocomplete="off"></el-input>
+        </el-form-item>
+
+        <!--        标签复选框-->
+        <el-checkbox-group v-model="vehicle.logoIds">
+          <el-checkbox :label=1>标识1</el-checkbox>
+          <el-checkbox :label=2>标识2</el-checkbox>
+          <el-checkbox :label=3>标识3</el-checkbox>
+        </el-checkbox-group>
+      </el-form>
+      <!--      {{ vehicle }}-->
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="reset()">取 消</el-button>
+        <el-button type="primary" @click="insert">确 定</el-button>
+      </div>
+    </el-dialog>
 
 
   </div>
@@ -66,7 +167,7 @@
 <script>
 //这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
 //例如：import 《组件名称》 from '《组件路径》,
-import {deleteById, list} from "@/api/system/vehicle";
+import {deleteById, editById, getBindLogoByVehicleId, getVehicleTypes, insert, list} from "@/api/couplet/vehicle";
 
 export default {
   //import引入的组件需要注入到对象中才能使用"
@@ -78,6 +179,12 @@ export default {
       //车辆列表
       vehicleList: [],
 
+      //总页数
+      total: 0,
+
+      //车辆类型
+      vehicleTypes: [],
+
       //查询列表的入参
       vehicleListParams: {
         //车辆类型
@@ -85,6 +192,10 @@ export default {
         //车辆状态 0离线 1在线
         vehicleState: '',
 
+        pageNum: 1,
+        pageSize: 5,
+
+
       },
 
       //编辑、新增车辆的入参
@@ -107,9 +218,18 @@ export default {
         //电池编号
         batteryNumber: '',
 
+        //车辆绑定标识
+        logoIds: [],
+
 
       },
 
+      //对话框的参数
+      formLabelWidth: '120px',
+      dialogEdit: false,
+      dialogInsert: false,
+      // 弹出层标题
+      title: ""
 
     };
   },
@@ -123,7 +243,27 @@ export default {
     getVehicleList() {
       list(this.vehicleListParams).then(
         res => {
-          this.vehicleList = res.data;
+          this.vehicleList = res.data.list;
+          this.total = res.data.total;
+        }
+      )
+    },
+
+    //分页
+    handleSizeChange(val) {
+      this.vehicleListParams.pageSize = val;
+      this.getVehicleList();
+    },
+    handleCurrentChange(val) {
+      this.vehicleListParams.pageNum = val;
+      this.getVehicleList();
+    },
+
+    //获取车辆类型
+    getVehicleTypes() {
+      getVehicleTypes().then(
+        res => {
+          this.vehicleTypes = res.data;
         }
       )
     },
@@ -159,11 +299,97 @@ export default {
         })
       })
     },
+
+    //编辑按钮
+    toEdit(row) {
+      this.reset()
+
+      //将各个属性进行赋值
+      this.vehicle.vehicleId = row.vehicleId;
+      this.vehicle.vehicleType = row.vehicleType;
+      this.vehicle.motorManufacturer = row.motorManufacturer;
+      this.vehicle.batteryManufacturer = row.batteryManufacturer;
+      this.vehicle.motorNumber = row.motorNumber;
+      this.vehicle.batteryNumber = row.batteryNumber;
+      //查询与当前车辆绑定 的标识
+      getBindLogoByVehicleId(row.vehicleId).then(
+        res => {
+          //再赋值
+          this.vehicle.logoIds = res.data;
+        }
+      )
+
+      this.title = "编辑车辆"
+      this.dialogEdit = true;
+    },
+    //重置对话框表单
+    reset() {
+      this.dialogEdit = false
+      this.dialogInsert = false
+      this.vehicle = {
+        //车辆id
+        vehicleId: '',
+        //车辆类型
+        vehicleType: '',
+        //电机厂商
+        motorManufacturer: '',
+        //电池厂商
+        batteryManufacturer: '',
+        //电机编号
+        motorNumber: '',
+        //电池编号
+        batteryNumber: '',
+        //车辆绑定标识
+        logoIds: [],
+      }
+      // this.$message.info("已取消")
+    },
+    //确认编辑
+    editById() {
+      editById(this.vehicle).then(
+        res => {
+          if (res.code == 200) {
+            this.dialogEdit = false;
+            this.getVehicleList();
+            this.$message.success("编辑成功");
+          } else {
+            this.$message.error("编辑失败");
+          }
+        }
+      );
+    },
+
+
+    //新增按钮
+    toInsert() {
+      this.reset()
+      this.title = "新增车辆"
+      this.dialogInsert = true;
+    },
+    //确认插入
+    insert() {
+      insert(this.vehicle).then(
+        res => {
+          if (res.code == 200) {
+            this.dialogInsert = false;
+            this.getVehicleList();
+            this.$message.success("新增成功");
+          } else {
+            this.$message.error("新增失败");
+          }
+        }
+      )
+    },
+
+
   },
   //生命周期 - 创建完成（可以访问当前this实例）",
   created() {
     //获取车辆列表
     this.getVehicleList()
+
+    //获取车辆类型
+    this.getVehicleTypes()
   },
   //生命周期 - 挂载完成（可以访问DOM元素）",
   mounted() {

src/views/index.vue

@@ -44,7 +44,7 @@
     </el-row>
     <el-row :gutter="20">
       <el-col :lg="12" :sm="24" style="padding-left: 20px">
-        <h2>车联后台管理框架</h2>
+        <h2>智能车联后台管理框架</h2>
         <p>
           一直想做一款后台管理系统，看了很多优秀的开源项目但是发现没有合适自己的。于是利用空闲休息时间开始自己写一套后台系统。如此有了若依管理系统，她可以用于所有的Web应用程序，如网站管理后台，网站会员中心，CMS，CRM，OA等等，当然，您也可以对她进行深度定制，以做出更强系统。所有前端后台代码封装过后十分精简易上手，出错概率低。同时支持移动客户端访问。系统会陆续更新一些实用功能。
         </p>

src/views/login.vue

@@ -91,7 +91,7 @@ export default {
       // 验证码开关
       captchaEnabled: true,
       // 注册开关
-      register: false,
+      register: true,
       redirect: undefined
     };
   },

vue.config.js

@@ -7,7 +7,7 @@ function resolve(dir) {
 
 const CompressionPlugin = require('compression-webpack-plugin')
 
-const name = process.env.VUE_APP_TITLE || '车联管理系统' // 网页标题
+const name = process.env.VUE_APP_TITLE || '智能车联管理系统' // 网页标题
 
 const port = process.env.port || process.env.npm_config_port || 80 // 端口