|
@@ -0,0 +1,375 @@
|
|
|
+<template>
|
|
|
+ <div id="init-window" style="position:relative">
|
|
|
+ <router-view />
|
|
|
+ <div style="position: absolute;width: 100%;">
|
|
|
+ <div class="set-background">
|
|
|
+ <div class="block">
|
|
|
+ <el-form :model="queryCode">
|
|
|
+ <div class="set-between">
|
|
|
+ <div class="special-input">
|
|
|
+ <el-input v-model="queryCode.vehicleId" placeholder="车辆ID" clearable />
|
|
|
+ <el-input v-model="queryCode.ecuId" placeholder="ECUID" clearable />
|
|
|
+ <el-input v-model="queryCode.vehicleVersion" placeholder="车辆类型" clearable />
|
|
|
+ </div>
|
|
|
+ <div class="special-input-chose">
|
|
|
+ <el-select v-model="queryCode.lockStatus" placeholder="锁状态" clearable>
|
|
|
+ <el-option v-for="item in lockOptions" :key="item.lockStatus" :label="item.name" :value="item.lockStatus" />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="queryCode.isActive" placeholder="链接状态" clearable>
|
|
|
+ <el-option v-for="item in linkOptions" :key="item.isActive" :label="item.name" :value="item.isActive" />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="queryCode.cityName" filterable placeholder="城市" clearable>
|
|
|
+ <el-option
|
|
|
+ v-for="item in city"
|
|
|
+ :key="item.CityID"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.name"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="set-between">
|
|
|
+ <el-button type="primary" plain @click="dataQuery(queryCode)">搜索</el-button>
|
|
|
+ <el-button type="primary" plain @click="createdCode()">新增</el-button>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ <div class="set-locate">
|
|
|
+ <el-table
|
|
|
+ v-loading="loading"
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ size="mini"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ prop="id"
|
|
|
+ label="ID"
|
|
|
+ align="center"
|
|
|
+ width="50"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="vehicleId"
|
|
|
+ label="车辆ID"
|
|
|
+ align="center"
|
|
|
+ width="95"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="vehicleVersion"
|
|
|
+ label="车辆类型"
|
|
|
+ align="center"
|
|
|
+ width="70"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="ecuId"
|
|
|
+ label="ECUID"
|
|
|
+ align="center"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ label="锁状态"
|
|
|
+ align="center"
|
|
|
+ width="80"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag
|
|
|
+ :type="scope.row.lockStatus === 1 ? 'success' : 'danger'"
|
|
|
+ disable-transitions
|
|
|
+ >{{ scope.row.lockStatus | toLockStatus }}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="链接状态"
|
|
|
+ align="center"
|
|
|
+ width="80"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag
|
|
|
+ :type="scope.row.isActive === 1 ? 'success' : 'danger'"
|
|
|
+ disable-transitions
|
|
|
+ >{{ scope.row.isActive | toActiveStatus }}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="激活时间"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">{{ scope.row.gmtActive | toData }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="操作"
|
|
|
+ align="center"
|
|
|
+ width="300"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="specail-lock">
|
|
|
+ <div :class="{ 'el-icon-lock': scope.row.lockStatus === 0 ,'el-icon-unlock': scope.row.lockStatus === 1}" @click="updateLock(scope.row.ecuId, scope.row.lockStatus)" />
|
|
|
+ <div>
|
|
|
+ <el-button size="mini" type="success" plain @click="activate(scope.row.ecuId, scope.row.vehicleId, scope.row.batteryId, scope.row.imsi, scope.row.imei, scope.row.vehicleVersion, scope.row.cityName)">激活</el-button>
|
|
|
+ <el-button size="mini" type="info" plain @click="offHmvirtual(scope.row.ecuId)">下线</el-button>
|
|
|
+ <el-button size="mini" type="danger" @click="dialogBug(scope.row.ecuId)">删除</el-button>
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ width="30%"
|
|
|
+ >
|
|
|
+ <span>确定要删除这条车辆信息吗</span>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" size="mini" @click="delHmVirtual()">确 定</el-button>
|
|
|
+ <el-button type="danger" size="mini" @click="dialogVisible = false">取 消</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <el-button size="mini" type="primary">...</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination background style="margin-top:30px;" align="center" :current-page="curIndex" :page-size="pageSize" layout="prev, pager, next" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { cityJson } from '@/views/virtualDevices/city'
|
|
|
+import { createHmVirtualDevice, queryDeviceInfo, delHmVirtualDevice, offHmvirtualDevice, updateLockStatus } from '@/api/HMvehicle'
|
|
|
+
|
|
|
+export default {
|
|
|
+ filters: {
|
|
|
+ toLockStatus(e) {
|
|
|
+ return e === 0 ? '未开启' : '已开启'
|
|
|
+ },
|
|
|
+ toActiveStatus(e) {
|
|
|
+ return e === 0 ? '未激活' : '已激活'
|
|
|
+ },
|
|
|
+ toData(time) {
|
|
|
+ const standard = new Date(time)
|
|
|
+ const result = standard.getFullYear() + '-' + (standard.getMonth() + 1) + '-' + standard.getDate() + ' ' + standard.getHours() + ':' + standard.getMinutes() + ':' + standard.getSeconds()
|
|
|
+ return result
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tableData: [],
|
|
|
+ loading: true,
|
|
|
+ form: {},
|
|
|
+ queryCode: {},
|
|
|
+ curIndex: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ total: 0,
|
|
|
+ pauseId: '',
|
|
|
+ city: cityJson,
|
|
|
+ value: '',
|
|
|
+ dialogVisible: false,
|
|
|
+ hmVehicleBaseInfo: {
|
|
|
+ 'batteryVoltage': 36511,
|
|
|
+ 'controllerTemperature': 25,
|
|
|
+ 'holzerVelocity': 2,
|
|
|
+ 'rechargeNum': 1,
|
|
|
+ 'ridingCurrent': 10,
|
|
|
+ 'rscap': 26511,
|
|
|
+ 'rsoc': 27,
|
|
|
+ 'singleMileage': 10,
|
|
|
+ 'soh': 0,
|
|
|
+ 'totalMileage': 66,
|
|
|
+ 'vehicleStatus': {
|
|
|
+ 'vAccStatus': 1,
|
|
|
+ 'vBatteryLockStatus': 1,
|
|
|
+ 'vBluetoothConnectionStatus': 1,
|
|
|
+ 'vBorrowOrReturnStatus': 1,
|
|
|
+ 'vExternalBatteryExistStatus': 0,
|
|
|
+ 'vHandlerStatus': 1,
|
|
|
+ 'vMotorLockStatus': 0,
|
|
|
+ 'vMovingStatus': 0,
|
|
|
+ 'vRearWheelLockStatus': 0,
|
|
|
+ 'vRidingStatus': 0,
|
|
|
+ 'vSleepStatus': 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ hmVehicleBaseStationInfo: {
|
|
|
+ 'cellId': 37299,
|
|
|
+ 'lac': 8448,
|
|
|
+ 'mcc': 1120,
|
|
|
+ 'mnc': 0
|
|
|
+ },
|
|
|
+ hmVehicleGpsInfo: {
|
|
|
+ 'azimuth': 4,
|
|
|
+ 'gpsSignalInfo': {
|
|
|
+ 'backupBattery': 9,
|
|
|
+ 'gpsLocationStatus': 1,
|
|
|
+ 'gpsSatelliteNum': 9,
|
|
|
+ 'gpsSignalStrength': 9
|
|
|
+ },
|
|
|
+ 'gpsSpeed': 0,
|
|
|
+ 'high': 1.2,
|
|
|
+ 'lat': 31.85659153128749,
|
|
|
+ 'lng': 117.26081489617174
|
|
|
+ },
|
|
|
+ lockOptions: [
|
|
|
+ {
|
|
|
+ name: '未开启',
|
|
|
+ lockStatus: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已开启',
|
|
|
+ lockStatus: 1
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ linkOptions: [
|
|
|
+ {
|
|
|
+ name: '未激活',
|
|
|
+ isActive: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已激活',
|
|
|
+ isActive: 1
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this._queryDeviceInfo()
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.initWindow()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ _queryDeviceInfo() {
|
|
|
+ const params = { page: this.curIndex, pageSize: this.pageSize }
|
|
|
+ queryDeviceInfo(params).then(res => {
|
|
|
+ res.success === 1 ? this.tableData = res.data : this.errorFun('initialization')
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ initWindow() {
|
|
|
+ if (!document.getElementById('window-judge')) {
|
|
|
+ document.getElementById('init-window').parentNode.style.overflow = 'visible'
|
|
|
+ } else {
|
|
|
+ document.getElementById('init-window').parentNode.style.overflow = 'hidden'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ dataQuery(queryCode) {
|
|
|
+ queryCode.page = this.curIndex
|
|
|
+ queryCode.pageSize = this.pageSize
|
|
|
+ for (const key in queryCode) { // 接口不接受空值的处理
|
|
|
+ if (!queryCode[key]) {
|
|
|
+ delete queryCode[key]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ queryDeviceInfo(queryCode).then(res => {
|
|
|
+ res.success === 1 ? this.tableData = res.data : this.errorFun()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ createdCode() {
|
|
|
+ this.$router.push({ name: '新增电单车', params: { formData: this.form }, query: { id: this.form.id }})
|
|
|
+ },
|
|
|
+ handleSizeChange(size) {
|
|
|
+ this.pageSize = size
|
|
|
+ },
|
|
|
+ handleCurrentChange(curIndex) {
|
|
|
+ this.curIndex = curIndex
|
|
|
+ },
|
|
|
+ updateLock(ecuId, lockStatus) {
|
|
|
+ const params = { ecuId: ecuId, lockStatus: (lockStatus + 1) % 2 }
|
|
|
+ updateLockStatus(params).then(res => {
|
|
|
+ this._queryDeviceInfo()
|
|
|
+ if (res.success === 1) {
|
|
|
+ this.successFun('update')
|
|
|
+ // this._queryDeviceInfo()
|
|
|
+ } else {
|
|
|
+ this.errorFun('update')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ activate(ecuId, vehicleId, batteryId, imsi, imei, vehicleVersion, cityName) {
|
|
|
+ const params = { ecuId: ecuId, vehicleId: vehicleId, batteryId: batteryId, imsi: imsi, imei: imei, vehicleVersion: vehicleVersion, cityName: cityName, hmVehicleBaseInfo: this.hmVehicleBaseInfo, hmVehicleBaseStationInfo: this.hmVehicleBaseStationInfo, hmVehicleGpsInfo: this.hmVehicleGpsInfo }
|
|
|
+ createHmVirtualDevice(params).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.successFun('activate')
|
|
|
+ this._queryDeviceInfo()
|
|
|
+ } else {
|
|
|
+ this.errorFun('activate')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ offHmvirtual(ecuId) {
|
|
|
+ const params = { ecuId: ecuId }
|
|
|
+ offHmvirtualDevice(params).then(res => {
|
|
|
+ if (res.success === 1) {
|
|
|
+ this.successFun('offLine')
|
|
|
+ this._queryDeviceInfo()
|
|
|
+ } else {
|
|
|
+ this.errorFun('offLine')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // id Bug
|
|
|
+ dialogBug(e) {
|
|
|
+ this.dialogVisible = true
|
|
|
+ this.pauseId = e
|
|
|
+ },
|
|
|
+ delHmVirtual() {
|
|
|
+ const params = { ecuId: this.pauseId }
|
|
|
+ delHmVirtualDevice(params).then(res => {
|
|
|
+ if (res.success === 1) {
|
|
|
+ this.successFun('delete')
|
|
|
+ this._queryDeviceInfo()
|
|
|
+ } else {
|
|
|
+ this.errorFun('delete')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.dialogVisible = false
|
|
|
+ },
|
|
|
+ successFun(successText) {
|
|
|
+ this.$notify({ title: 'Success', message: `${successText} Successfully`, type: 'success', duration: 2000 })
|
|
|
+ },
|
|
|
+ errorFun(errorText) {
|
|
|
+ this.$notify({ title: 'Failed', message: `${errorText} Failed`, type: 'error', duration: 2000 })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="stylus" scoped>
|
|
|
+ .set-background
|
|
|
+ background-color #F2F3F6
|
|
|
+ display flex
|
|
|
+ justify-content center
|
|
|
+ min-width 1000px
|
|
|
+ .block
|
|
|
+ background-color rgba(255,255,255,1)
|
|
|
+ box-shadow 0px 0px 11px 0px rgba(238,240,245,1)
|
|
|
+ border-radius 7px
|
|
|
+ width 93%
|
|
|
+ margin 25px 0
|
|
|
+ padding 20px
|
|
|
+ min-height calc(100vh - 100px)
|
|
|
+ .block >>> .el-form
|
|
|
+ display flex
|
|
|
+ justify-content space-between
|
|
|
+ .block >>> .special-input .el-input
|
|
|
+ width 29.5%
|
|
|
+ margin-right 10px
|
|
|
+ .block >>> .special-input-chose .el-select
|
|
|
+ width 27%
|
|
|
+ margin-right 10px
|
|
|
+ .block >>> .el-form-item__content
|
|
|
+ margin-left 0 !important
|
|
|
+ .block >>> th
|
|
|
+ background-color #F0F2F4 !important
|
|
|
+ .set-between
|
|
|
+ display flex
|
|
|
+ .set-between >>> .el-button
|
|
|
+ height 40px
|
|
|
+ .set-locate
|
|
|
+ margin-top 40px
|
|
|
+ .specail-lock
|
|
|
+ display flex
|
|
|
+ justify-content center
|
|
|
+ .el-icon-lock , .el-icon-unlock
|
|
|
+ font-size 20px
|
|
|
+ margin 4px 7px 0 0
|
|
|
+ .specail-lock >>> .el-dialog__footer
|
|
|
+ display flex
|
|
|
+ justify-content center
|
|
|
+</style>
|