车辆数据模拟

src/api/vehicle/instance.js

@@ -7,15 +7,65 @@ export function instanceList(params) {
     data: params
   })
 }
+
+/**
+ * 客户端连接
+ * @param vin
+ * @returns {*}
+ */
 export function instanceClientInit(vin) {
   return request({
     url: `/vehicle/instance/client/init/${vin}`,
     method: 'post'
   })
 }
+
+/**
+ * 客户端关闭
+ * @param vin
+ * @returns {*}
+ */
 export function instanceClientClose(vin) {
   return request({
     url: `/vehicle/instance/client/close/${vin}`,
     method: 'post'
   })
 }
+
+/**
+ * 客户端关闭
+ * @param vin
+ * @returns {*}
+ */
+export function instanceCheckPosition(vin, positionCode) {
+  return request({
+    url: `/vehicle/instance/position/check`,
+    method: 'post',
+    data: { 'vin': vin, 'positionCode': positionCode }
+  })
+}
+
+/**
+ * 车辆报文控制
+ * @param vin
+ * @returns {*}
+ */
+export function instanceMsg(vin, msgCode) {
+  return request({
+    url: `/vehicle/instance/msg`,
+    method: 'post',
+    data: { 'vin': vin, 'msgCode': msgCode}
+  })
+}
+/**
+ * 车辆档位
+ * @param vin
+ * @returns {*}
+ */
+export function instanceGear(vin, gear) {
+  return request({
+    url: `/vehicle/instance/gear`,
+    method: 'post',
+    data: { 'vin': vin, 'gear': gear}
+  })
+}

src/api/vehicle/position.js

@@ -0,0 +1,8 @@
+import request from '@/utils/request'
+
+export function positionList() {
+  return request({
+    url: '/vehicle/position/list',
+    method: 'get'
+  })
+}

src/views/vehicle/index.vue

@@ -15,29 +15,33 @@
                 </div>
                 <el-descriptions class="margin-top" :column="1" size="mini" border>
                   <el-descriptions-item>
-                    <template slot="label"> <i class="el-icon-user"></i> 用户名 </template>
+                    <template slot="label"> <i class="el-icon-discover"></i> 路线 </template>
-                    kooriookami
+                    <el-radio-group v-model="vehicle.positionCode" size="mini" @input="checkPositionCode(vehicle)">
+                      <el-radio-button v-for="positionCode in positionCodeList" :label="positionCode"></el-radio-button>
+                    </el-radio-group>
+
+                    <el-tag style="margin-left: 15px;" type="success">{{vehicle.positionLength}}</el-tag>
                   </el-descriptions-item>
                   <el-descriptions-item>
-                    <template slot="label">
+                    <template slot="label"> <i class="el-icon-location-outline"></i> 档位 </template>
-                      <i class="el-icon-mobile-phone"></i>
+                    <el-radio-group size="mini" v-model="vehicle.gear" @input="checkGear(vehicle)">
-                      手机号
+                      <el-radio-button label="P"></el-radio-button>
-                    </template>
+                      <el-radio-button label="D"></el-radio-button>
-                    18100000000
+                    </el-radio-group>
+
+                    <el-tag style="margin-left: 15px;" type="info">P档只上报，不模拟</el-tag>
                   </el-descriptions-item>
                   <el-descriptions-item>
-                    <template slot="label">
+                    <template slot="label"> <i class="el-icon-mobile-phone"></i> 报文上报 </template>
-                      <i class="el-icon-location-outline"></i>
+                    <el-radio-group size="mini" v-model="vehicle.msgCode" @input="checkMsg(vehicle)">
-                      居住地
+                      <el-radio-button label="上报"></el-radio-button>
-                    </template>
+                      <el-radio-button label="暂停"></el-radio-button>
-                    苏州市
+                      <el-radio-button label="停止"></el-radio-button>
+                    </el-radio-group>
                   </el-descriptions-item>
                   <el-descriptions-item>
-                    <template slot="label">
+                    <template slot="label"> <i class="el-icon-tickets"></i> 总里程 </template>
-                      <i class="el-icon-tickets"></i>
+                    <el-tag size="small">{{vehicle.mileage}}</el-tag>
-                      备注
-                    </template>
-                    <el-tag size="small">学校</el-tag>
                   </el-descriptions-item>
                   <el-descriptions-item>
                     <template slot="label">
@@ -63,29 +67,107 @@
 </template>
 
 <script>
-import {instanceClientClose, instanceClientInit, instanceList} from "@/api/vehicle/instance";
+import {
+  instanceCheckPosition,
+  instanceClientClose,
+  instanceClientInit, instanceGear,
+  instanceList,
+  instanceMsg
+} from "@/api/vehicle/instance";
+import {positionList} from "@/api/vehicle/position";
 
 export default {
   data() {
     return {
       contentHeight: 1024,
       checkVin: null,
+      positionCodeList: [],
       vehicleList: [],
       queryParams: {
         vin: null,
-      }
+      },
+      intervalInstanceList: null
     }
   },
   created() {
     this.contentHeight = window.innerHeight - 60
-    this.getInstanceList()
+    this.initInstanceList();
+    this.initPositionList();
   },
   methods: {
+
+    /**
+     * 选中报文上报状态
+     * @param vehicle 车辆
+     */
+    checkGear(vehicle) {
+      instanceGear(vehicle.vin, vehicle.gear).then(response => {
+        this.getInstanceList();
+        this.$notify({
+          title: '操作提示',
+          message: response.msg,
+          type: response.code === 200 ? 'success' : 'error'
+        })
+      })
+    },
+    /**
+     * 选中报文上报状态
+     * @param vehicle 车辆
+     */
+    checkMsg(vehicle) {
+      instanceMsg(vehicle.vin, vehicle.msgCode).then(response => {
+        this.getInstanceList();
+        this.$notify({
+          title: '操作提示',
+          message: response.msg,
+          type: response.code === 200 ? 'success' : 'error'
+        })
+      })
+    },
+    /**
+     * 选择车辆路径
+     * @param vehicle
+     */
+    checkPositionCode(vehicle) {
+      instanceCheckPosition(vehicle.vin, vehicle.positionCode).then(response => {
+        this.getInstanceList();
+        this.$notify({
+          title: '操作提示',
+          message: response.msg,
+          type: response.code === 200 ? 'success' : 'error'
+        })
+      })
+    },
+    /**
+     * 初始化路径
+     */
+    initPositionList(){
+      positionList().then(response => {
+        this.positionCodeList = response.data;
+      })
+    },
+    /**
+     * 初始化车辆列表
+     */
+    initInstanceList(){
+      // 优先执行一次数据获取
+      this.getInstanceList()
+      // 再次执行为定时器执行
+      this.intervalInstanceList = setInterval(this.getInstanceList, 3000);
+    },
+    /**
+     * 获取车辆列表
+     */
     getInstanceList() {
       instanceList(this.queryParams).then(response => {
         this.vehicleList = response.data;
       })
     },
+
+    /**
+     * 初始化车机
+     * @param vin
+     */
     clientInit(vin){
       instanceClientInit(vin).then(response => {
         this.getInstanceList();
@@ -96,6 +178,10 @@ export default {
         })
       })
     },
+    /**
+     * 关闭车机
+     * @param vin
+     */
     clientClose(vin){
       instanceClientClose(vin).then(response => {
         this.getInstanceList();