first-dev
/
smart-cloud-ui
5
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'server_2024_4_2_suzejing' (#5) from server_2024_4_2_suzejing into master 

Reviewed-on: #5
master
xiaoSu 2024-04-08 16:59:38 +08:00
parent 03207ec87d 5c3f971274
commit ff793e68b1
7 changed files with 813 additions and 178 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/api/system/fence.js
View File

@ -8,7 +8,7 @@ import fence from "@/views/system/fence/index.vue";
*/
export function fenceList(data){
return request({
url:'/fence/fence/list',
url:'/business/fence/list',
method:"post",
data:data
})
@ -22,9 +22,9 @@ export function fenceList(data){
*/
export function fenceAdd(data) {
return request({
url: '/fence/fence/fenceAdd',
url: '/business/fence/fenceAdd',
method: 'post',
data
data:data
})
}
@ -35,7 +35,7 @@ export function fenceAdd(data) {
*/
export function fenceDelete(fenceId) {
return request({
url: '/fence/fence/fenceDelete/'+fenceId,
url: '/business/fence/fenceDelete/'+fenceId,
method: 'post'
})
}
@ -48,16 +48,17 @@ export function fenceDelete(fenceId) {
*/
export function fenceUpdate(data) {
return request({
url: '/fence/fence/fenceUpdate',
url: '/business/fence/fenceUpdate',
method: 'post',
data
})
}
export function saveFence(data) {
export function fenceUpdateMap(data) {
return request({
url: '/fence/fence/saveFence',
url: '/business/fence/fenceUpdateMap',
method: 'post',
data:JSON.stringify(data),
data
})
}

83
src/api/system/markers.js 100644
View File

@ -0,0 +1,83 @@
import request from "@/utils/request";
import fence from "@/views/system/fence/index.vue";
/**
* 标识列表
* @param data
* @returns {*}
*/
export function markersList(data){
return request({
url:'/business/markers/list',
method:"post",
data:data
})
}
/**
* 新增标识
* @param data
* @returns {*}
*/
export function markersInsert(data) {
return request({
url: '/business/markers/insert',
method: 'post',
data:data
})
}
/**
* 绑定围栏
* @param data
* @returns {AxiosPromise}
*/
export function insertMarkersFence(data) {
return request({
url: '/business/markers/insertMarkersFence',
method: 'post',
data:data
})
}
/**
* 删除标识
* @param markersId
* @returns {*}
*/
export function markersDelete(markersId) {
return request({
url: '/business/markers/delete/'+markersId,
method: 'post'
})
}
/**
* 删除标识
* @param markersId
* @returns {*}
*/
export function markersFenceList(markersId) {
return request({
url: '/business/markers/markersFenceList/'+markersId,
method: 'post'
})
}
/**
* 修改标识
* @param data
* @returns {*}
*/
export function markersUpdate(data) {
return request({
url: '/business/markers/update',
method: 'post',
data
})
}

69
src/api/system/vehicle.js 100644
View File

@ -0,0 +1,69 @@
import request from "@/utils/request";
import fence from "@/views/system/fence/index.vue";
/**
* 标识列表
* @param data
* @returns {*}
*/
export function vehicleList(data){
return request({
url:'/business/vehicle/list',
method:"post",
data:data
})
}
/**
* 新增标识
* @param data
* @returns {*}
*/
export function vehicleInsert(data) {
return request({
url: '/business/vehicle/vehicleInsert',
method: 'post',
data:data
})
}
/**
* 绑定围栏
* @param data
* @returns {AxiosPromise}
*/
export function insertMarkersFence(data) {
return request({
url: '/business/vehicle/insertMarkersFence',
method: 'post',
data:data
})
}
/**
* 删除标识
* @param fenceId
* @returns {*}
*/
export function vehicleDelete(fenceId) {
return request({
url: '/business/vehicle/vehicleDelete/'+fenceId,
method: 'post'
})
}
/**
* 修改标识
* @param data
* @returns {*}
*/
export function vehicleUpdate(data) {
return request({
url: '/business/vehicle/vehicleUpdate',
method: 'post',
data
})
}

28
src/router/index.js
View File

@ -87,6 +87,34 @@ export const constantRoutes = [
]
},
{
path: '',
component: Layout,
redirect: 'index',
children: [
{
path: '/markers',
component: () => import('@/views/system/markers/index'),
name: 'Index',
meta: {title: '车辆标识', icon: 'markers'}
}
]
},
{
path: '',
component: Layout,
redirect: 'index',
children: [
{
path: '/vehicle',
component: () => import('@/views/system/vehicle/index'),
name: 'Index',
meta: {title: '车辆管理', icon: 'vehicle'}
}
]
},
{
path: '/user',
component: Layout,

266
src/views/system/fence/index.vue
View File

@ -1,25 +1,22 @@
<template>
<div>
<div v-if="showMapp">
<el-form :inline="true" :model="fence" class="demo-form-inline">
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
<el-form-item label="围栏名称">
<el-input v-model="fence.fenceName" placeholder="模糊查询围栏名称"></el-input>
<el-input v-model="queryParams.fenceName" placeholder="模糊查询围栏名称"></el-input>
</el-form-item>
<el-form-item label="围栏类型">
<el-select v-model="fence.fenceTypeId" placeholder="请选择围栏类型">
<el-select v-model="queryParams.fenceTypeId" placeholder="请选择围栏类型">
<el-option label="驶出" value="1">驶出</el-option>
<el-option label="驶入" value="2">驶入</el-option>
</el-select>
</el-form-item>
<el-form-item label="围栏状态">
<el-select v-model="fence.fenceState" placeholder="请选择围栏状态">
<el-select v-model="queryParams.fenceState" placeholder="请选择围栏状态">
<el-option label="正常" value="1">正常</el-option>
<el-option label="停用" value="2">停用</el-option>
</el-select>
@ -30,38 +27,13 @@
</el-form-item>
</el-form>
<el-button type="primary" plain icon="el-icon-plus" @click="fencadd">新增</el-button>
<el-table :data="fenceList" style="width: 100%" ref="multipleTable">
<el-table-column label="围栏名称" align="center" prop="fenceName" />
<el-table :data="tableData" style="width: 100%" ref="multipleTable" @selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
label="围栏ID"
width="180">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.fenceId }}</span>
</template>
</el-table-column>
<el-table-column
label="围栏名称"
width="180">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.fenceName }}</span>
</template>
</el-table-column>
<el-table-column
label="围栏类型"
<el-table-column label="围栏类型"
width="180">
<template slot-scope="scope">
<span style="margin-left: 10px" v-if="scope.row.fenceTypeId==1">驶出</span>
@ -69,8 +41,7 @@
</template>
</el-table-column>
<el-table-column
label="围栏状态"
<el-table-column label="围栏状态"
width="180">
<template slot-scope="scope">
<span style="margin-left: 10px" v-if="scope.row.fenceState==1"><el-tag>正常</el-tag></span>
@ -78,9 +49,7 @@
</template>
</el-table-column>
<el-table-column
label="经纬度信息"
width="180">
<el-table-column label="经纬度信息" width="280">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.fenceMessage }}</span>
</template>
@ -98,19 +67,13 @@
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="fence.pageNum"
:page-sizes="[1, 3, 5, 10]"
:page-size="fence.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 围栏添加-->
@ -130,16 +93,8 @@
</el-select>
</el-form-item>
<el-form-item label="围栏状态" :label-width="formLabelWidth">
<template>
<el-radio v-model="fences.fenceState" label="1">正常</el-radio>
<el-radio v-model="fences.fenceState" label="2">停用</el-radio>
</template>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="addAll">新增</el-button>
@ -151,16 +106,10 @@
<el-dialog :title="title" :visible.sync="dialogFormVisible1">
<el-form :model="fences">
<el-form-item label="围栏ID" :label-width="formLabelWidth1">
<el-input v-model="fences.fenceId" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth1">
<el-input v-model="fences.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏类型" :label-width="formLabelWidth1">
<el-select v-model="fences.fenceTypeId" placeholder="请选择活动区域">
<el-option label="驶出" value="1">驶出</el-option>
@ -168,7 +117,6 @@
</el-select>
</el-form-item>
<el-form-item label="围栏状态">
<el-radio-group v-model="fences.fenceState" :label-width="formLabelWidth1">
<el-radio :label="1">正常</el-radio>
@ -177,7 +125,6 @@
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="updateAll">修 改</el-button>
@ -185,13 +132,8 @@
</el-dialog>
</div>
<el-button @click="drawPolygon">绘制围栏</el-button>
<el-button @click="saveFenceData">保存围栏</el-button>
<!-- <el-button @click="saveFenceData">保存围栏</el-button>-->
<el-button @click="cleanFence">清除围栏</el-button>
<div id="container" v-if="showMap"></div>
@ -206,7 +148,7 @@
import AMapLoader from '@amap/amap-jsapi-loader';
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
//例如：import 《组件名称》 from '《组件路径》,
import {fenceAdd, fenceDelete, fenceList, fenceUpdate, saveFence} from "@/api/system/fence";
import {fenceAdd, fenceDelete, fenceList, fenceUpdate, fenceUpdateMap} from "@/api/system/fence";
import mouseTool from "quill";
export default {
name: "map-view",
@ -221,20 +163,18 @@ export default {
//这里存放数据"
return {
tableData:[],
fence:{
pageNum:1,
pageSize:3,
fenceName:'',
queryParams: {
pageNum: 1,
pageSize: 10,
fenceName: null,
fenceTypeId: null,
fenceState: null,
},
total:0,
dialogFormVisible:false,
formLabelWidth:'120px',
fences:{
fenceId:0,
fenceName:'',
fenceTypeId:0,
fenceState:0
},
title:'',
dialogFormVisible1:false,
@ -248,6 +188,7 @@ export default {
showMap:false,
showMapp:true,
fenceList: [],
//保存围栏
mapRequest:{
@ -263,73 +204,18 @@ export default {
watch: {},
//方法集合",
methods: {
//围栏列表
list() {
fenceList(this.fence).then(
res => {
this.tableData = res.data.list
this.total = res.data.total
console.log(this.tableData);
console.log(res)
}
)
//获取围栏列表
getList() {
this.loading = true;
fenceList(this.queryParams).then(res => {
this.fenceList = res.data.rows;
this.total = res.data.total;
this.loading = false;
});
},
// //复选框
handleSelectionChange(val) {
this.multipleSelection = val;
},
// 搜索框
onSubmit() {
this.list()
},
//分页查询
handleSizeChange(val) {
this.fence.pageSize = val
this.list()
},
//分页查询
handleCurrentChange(val) {
this.fence.pageNum = val
this.list()
},
//新增
fencadd() {
this.fences = {}
this.dialogFormVisible = true
this.title = '新增页面'
},
addAll() {
fenceAdd(this.fences.data).then(
res => {
this.$message.success(res.msg)
this.list()
}
)
this.dialogFormVisible = false
},
//删除电子围栏
handleDelete(fenceId){
fenceDelete(fenceId,'deleted').then(
res=>{
this.$message.success(res.msg)
this.list()
}
).catch(error=>{
console.error("逻辑删除失败",error);
this.$message.success("逻辑删除失败，请重试")
})
this.getList()
},
//修改电子围栏
@ -345,36 +231,63 @@ export default {
fenceUpdate(this.fences).then(
res => {
this.$message.success(res.msg)
this.list()
this.getList()
}
)
this.dialogFormVisible1=false;
},
//新增
fencadd() {
this.fences = {}
this.dialogFormVisible = true
this.title = '新增页面'
},
addAll() {
fenceAdd(this.fences).then(
res => {
this.$message.success(res.msg)
this.getList()
}
)
this.dialogFormVisible = false
},
//删除电子围栏
handleDelete(fenceId){
fenceDelete(fenceId,'deleted').then(
res=>{
this.$message.success(res.msg)
this.getList()
}
)
},
//编辑围栏
handleWdit() {
handleWdit(obj) {
this.showMap=true
this.showMapp=false
this.fences = obj
this.initAMap()
},
//初始化地图
initAMap(){
AMapLoader.load({
key:"fcd296bbfa904e3bf49d7316882a11bf",
key:"1666544c7b614ba063b4c58d5c148248",
version:"2.0",
plugins:["AMap.Scale","AMap.MouseTool"],
})
.then((AMap)=>{
this._Amap=AMap;
this.Amap=AMap;
this.map=new AMap.Map("container",{
//设置地图容器ID
viewMode:"3D",
viewMode:"2D",
zoom:11,
center: [116.397428, 39.90923],
});
@ -406,15 +319,27 @@ export default {
drawReady(event){
console.log(event)
console.log(event.obj.getPath())
const coordinates = event.obj.getPath()
const coordinatesString = coordinates.map(coord => `${coord.lng},${coord.lat}`).join(';');
console.log(coordinatesString);
this.fences.fenceMessage = coordinatesString;
console.info('覆盖物对象绘制完成')
// 获取绘制的围栏经纬度信息
const path =event.obj.getPath()
// 将经纬度信息保存到 scope.row.fenceMessage 中
this.tableData.forEach(item=>{
if(item.fenceId === event.obj.fenceId){ // 假设 fenceId 是围栏的唯一标识符
item.fenceMessage = path.toString(); // 这里使用 toString() 方法将路径转换为字符串形式
}
// // 获取绘制的围栏经纬度信息
// const path =event.obj.getPath()
// // 将经纬度信息保存到 scope.row.fenceMessage 中
// this.tableData.forEach(item=>{
// if(item.fenceId === event.obj.fenceId){ // 假设 fenceId 是围栏的唯一标识符
// item.fenceMessage = path.toString(); // 这里使用 toString() 方法将路径转换为字符串形式
// }
// })
fenceUpdateMap(this.fences).then(res=>{
// this.$modal.msgSuccess("保存成功")
this.getList()
})
},
@ -424,13 +349,13 @@ export default {
this.mouseTool.close(true)
},
//保存围栏
saveFenceData(){
console.log(this.mapRequest.jwd)
saveFence(this.mapRequest).then(response=>{
// this.$modal.msgSuccess("保存成功")
})
},
// //保存围栏
// saveFenceData(){
// console.log(this.mapRequest.jwd)
// saveFence(this.mapRequest).then(response=>{
// // this.$modal.msgSuccess("保存成功")
// })
// },
@ -438,7 +363,8 @@ export default {
//生命周期 - 创建完成（可以访问当前this实例）",
created() {
this.list()
// this.list();
this.getList();
// this.mapRequest.fenceId=this.$router.query.fenceId
},
beforeCreate() {

211
src/views/system/markers/index.vue 100644
View File

@ -0,0 +1,211 @@
<template>
<div>
<div>
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
<el-form-item label="标识名称">
<el-input v-model="queryParams.markersName" placeholder="模糊查询标识名称"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit" icon="el-icon-search">搜索</el-button>
</el-form-item>
</el-form>
<el-button type="primary" plain icon="el-icon-plus" @click="markersAdd">新增</el-button>
<el-table :data="markersList" style="width: 100%" ref="multipleTable">
<el-table-column label="标识编号" align="center" prop="markersId" />
<el-table-column label="标识名称" align="center" prop="markersName" />
<el-table-column label="操作">
<template slot-scope="scope">
<el-link type="primary" icon="el-icon-map-location" @click="handleWdit(scope.row)">绑定电子围栏</el-link>
<el-link type="primary" icon="el-icon-edit" @click="handleEdit(scope.row)">编辑</el-link>
<el-link type="primary" icon="el-icon-delete" @click="handleDelete(scope.row.markersId)">删除</el-link>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 围栏添加-->
<el-dialog :title="title" :visible.sync="dialogFormVisible">
<el-form :model="markers">
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="markers.markersName" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="addAll">新增</el-button>
</div>
</el-dialog>
<!-- 修改电子围栏-->
<el-dialog :title="title" :visible.sync="dialogFormVisible1">
<el-form :model="markers">
<el-form-item label="围栏名称" :label-width="formLabelWidth1">
<el-input v-model="markers.markersName" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="updateAll">修 改</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import { markersList, markersInsert, markersDelete, insertMarkersFence, markersUpdate, markersFenceList} from "@/api/system/markers";
export default {
//生命周期 - 挂载完成（可以访问DOM元素）",
mounted() {
},
//import引入的组件需要注入到对象中才能使用"
components: {},
props: {},
data() {
//这里存放数据"
return {
queryParams: {
pageNum: 1,
pageSize: 10,
markersName: null
},
markersFences:[],
total: 0,
dialogFormVisible: false,
formLabelWidth: '120px',
markers: {},
title: '',
dialogFormVisible1: false,
formLabelWidth1: '120px',
markersList: [],
};
},
//计算属性 类似于data概念",
computed: {},
//监控data中的数据变化",
watch: {},
//方法集合",
methods: {
//获取围栏列表
getList() {
this.loading = true;
markersList(this.queryParams).then(res => {
this.markersList = res.data.rows;
this.total = res.data.total;
this.loading = false;
});
},
markersFenceShow(){
markersFenceList().then(res => {
this.markersFences = res.data
})
},
// 搜索框
onSubmit() {
this.getList()
},
handleWdit(obj) {
this.markers = obj
this.markersFenceShow(obj.markersId)
console.log(this.markersFenceShow)
},
//修改标识
handleEdit(obj) {
this.dialogFormVisible1 = true
this.markers = obj
this.title = '修改标识'
},
updateAll() {
markersUpdate(this.markers).then(
res => {
this.$message.success(res.msg)
this.getList()
}
)
this.dialogFormVisible1 = false;
},
//新增
markersAdd() {
this.markers = {}
this.dialogFormVisible = true
this.title = '新增页面'
},
addAll() {
markersInsert(this.markers).then(
res => {
this.$message.success(res.msg)
this.getList()
}
)
this.dialogFormVisible = false
},
//删除电子围栏
handleDelete(markersId) {
markersDelete(markersId, 'deleted').then(
res => {
this.$message.success(res.msg)
this.getList()
}
)
},
},
//生命周期 - 创建完成（可以访问当前this实例）",
created() {
this.getList();
},
beforeCreate() {
}, //生命周期 - 创建之前",
beforeMount() {
}, //生命周期 - 挂载之前",
beforeUpdate() {
}, //生命周期 - 更新之前",
updated() {
}, //生命周期 - 更新之后",
beforeDestroy() {
}, //生命周期 - 销毁之前",
destroyed() {
}, //生命周期 - 销毁完成",
activated() {
} //如果页面有keep-alive缓存功能，这个函数会触发",
};
</script>

317
src/views/system/vehicle/index.vue 100644
View File

@ -0,0 +1,317 @@
<template>
<div>
<div>
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
<el-form-item label="车辆VIN">
<el-input v-model="queryParams.vehicleVIN" placeholder="车辆VIN"></el-input>
</el-form-item>
<el-form-item label="车辆类型">
<el-input v-model="queryParams.vehicleTypeId" placeholder="车辆类型"></el-input>
</el-form-item>
<el-form-item label="电机厂商">
<el-input v-model="queryParams.motorBusiness" placeholder="电机厂商"></el-input>
</el-form-item>
<el-form-item label="电池厂商">
<el-input v-model="queryParams.batteryBusiness" placeholder="电池厂商"></el-input>
</el-form-item>
<el-form-item label="电机ID">
<el-input v-model="queryParams.MotorID" placeholder="电机ID"></el-input>
</el-form-item>
<el-form-item label="电池名称">
<el-input v-model="queryParams.BatteryID" placeholder="电池ID"></el-input>
</el-form-item>
<el-form-item label="车辆状态">
<el-select v-model="queryParams.vehicleState" placeholder="请选择围栏状态">
<el-option label="正常" value="1">正常</el-option>
<el-option label="停用" value="2">停用</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit" icon="el-icon-search">搜索</el-button>
</el-form-item>
</el-form>
<el-button type="primary" plain icon="el-icon-plus" @click="vehicleAdd">新增</el-button>
<el-table :data="vehicleList" style="width: 100%" ref="multipleTable">
<el-table-column label="车辆VIN" align="center" prop="vehicleVIN" />
<el-table-column label="车辆VIN" align="center" prop="vehicleTypeId" />
<el-table-column label="车辆VIN" align="center" prop="motorBusiness" />
<el-table-column label="车辆VIN" align="center" prop="batteryBusiness" />
<el-table-column label="车辆VIN" align="center" prop="motorID" />
<el-table-column label="车辆VIN" align="center" prop="batteryID" />
<el-table-column label="车辆VIN" align="center" prop="" />
<el-table-column label="车辆VIN" align="center" prop="vehicleVIN" />
<el-table-column label="车辆VIN" align="center" prop="vehicleVIN" />
<el-table-column
label="围栏状态"
width="180">
<template slot-scope="scope">
<span style="margin-left: 10px" v-if="scope.row.vehicleState==1"><el-tag>正常</el-tag></span>
<span style="margin-left: 10px" v-if="scope.row.vehicleState==2"><el-tag>停用</el-tag></span>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-link type="primary" icon="el-icon-map-location" @click="handleWdit(scope.row)">编辑围栏</el-link>
<el-link type="primary" icon="el-icon-edit" @click="handleEdit(scope.row)">编辑</el-link>
<el-link type="primary" icon="el-icon-delete" @click="handleDelete(scope.row.fenceId)">删除</el-link>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 围栏添加-->
<el-dialog :title="title" :visible.sync="dialogFormVisible">
<el-form :model="vehicle">
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏类型" :label-width="formLabelWidth">
<el-select v-model="vehicle.fenceTypeId" placeholder="请选择活动区域">
<el-option label="驶出" value="1">驶出</el-option>
<el-option label="驶入" value="2">驶入</el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="addAll">新增</el-button>
</div>
</el-dialog>
<!-- 修改电子围栏-->
<el-dialog :title="title" :visible.sync="dialogFormVisible1">
<el-form :model="vehicle">
<el-form-item label="围栏名称" :label-width="formLabelWidth1">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏名称" :label-width="formLabelWidth">
<el-input v-model="vehicle.fenceName" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="围栏类型" :label-width="formLabelWidth1">
<el-select v-model="vehicle.fenceTypeId" placeholder="请选择活动区域">
<el-option label="驶出" value="1">驶出</el-option>
<el-option label="驶入" value="2">驶入</el-option>
</el-select>
</el-form-item>
<el-form-item label="围栏状态">
<el-radio-group v-model="vehicle.fenceState" :label-width="formLabelWidth1">
<el-radio :label="1">正常</el-radio>
<el-radio :label="2">停用</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="updateAll">修 改</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import {vehicleInsert, insertMarkersFence, vehicleList, vehicleDelete, vehicleUpdate} from "@/api/system/vehicle";
export default {
//生命周期 - 挂载完成（可以访问DOM元素）",
mounted() {
},
//import引入的组件需要注入到对象中才能使用"
components: {},
props: {},
data() {
//这里存放数据"
return {
queryParams: {
pageNum: 1,
pageSize: 10,
vehicleVIN: null,
vehicleTypeId: null,
motorBusiness: null,
batteryBusiness: null,
MotorID: null,
BatteryID: null,
vehicleState:null
},
total:0,
dialogFormVisible:false,
formLabelWidth:'120px',
vehicle:{},
title:'',
dialogFormVisible1:false,
formLabelWidth1:'120px',
vehicleList: [],
};
},
//计算属性 类似于data概念",
computed: {},
//监控data中的数据变化",
watch: {},
//方法集合",
methods: {
//获取围栏列表
getList() {
this.loading = true;
vehicleList(this.queryParams).then(res => {
this.vehicleList = res.data.rows;
this.total = res.data.total;
this.loading = false;
});
},
// 搜索框
onSubmit() {
this.getList()
},
//修改电子围栏
handleEdit(obj) {
this.dialogFormVisible1 = true
this.vehicle = obj
this.title = '修改车辆信息'
},
updateAll() {
vehicleUpdate(this.vehicle).then(
res => {
this.$message.success(res.msg)
this.getList()
}
)
this.dialogFormVisible1=false;
},
//新增
vehicleAdd() {
this.vehicle = {}
this.dialogFormVisible = true
this.title = '新增页面'
},
addAll() {
vehicleInsert(this.vehicle).then(
res => {
this.$message.success(res.msg)
this.getList()
}
)
this.dialogFormVisible = false
},
//删除车辆信息
handleDelete(vehicleId){
vehicleDelete(vehicleId,'deleted').then(
res=>{
this.$message.success(res.msg)
this.getList()
}
)
},
//编辑车辆标识
handleWdit(obj) {
this.vehicle = obj
},
},
//生命周期 - 创建完成（可以访问当前this实例）",
created() {
this.getList();
},
beforeCreate() {
}, //生命周期 - 创建之前",
beforeMount() {
}, //生命周期 - 挂载之前",
beforeUpdate() {
}, //生命周期 - 更新之前",
updated() {
}, //生命周期 - 更新之后",
beforeDestroy() {
}, //生命周期 - 销毁之前",
destroyed() {
}, //生命周期 - 销毁完成",
activated() {
} //如果页面有keep-alive缓存功能，这个函数会触发",
};
</script>