six-vehicle
/
cloud-ui
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat():重构所有连接路径结构

dev
LQS 2024-10-12 11:42:49 +08:00
parent b21ef68a82
commit 0cc8dab8a2
13 changed files with 1206 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/api/car/car.js 100644
View File

@ -0,0 +1,44 @@
import request from '@/utils/request'
// 列表
export function showList(data) {
return request({
url: 'enterprise/elect/list',
method: 'POST',
data:data
})
}
//新增信息接口
export function save(data){
return request({
url: '/enterprise/elect/add',
method: 'POST',
data:data
})
}
//修改信息
export function update(data){
return request({
url: `/enterprise/elect/${data.id}`,
method: 'PUT',
data:data
})
}
//根据ID删除信息
export function deleted(id){
return request({
url:`/enterprise/elect/${id}`,
method: 'DELETE'
})
}
//下拉框
export function showTypeList() {
return request({
url: 'enterprise/elect/showLanTypeList',
method: 'POST'
})
}

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

@ -0,0 +1,69 @@
import request from '@/utils/request'
// 列表
export function showList(data) {
return request({
url: 'enterprise/vehicleManage/list',
method: 'POST',
data: data
})
}
//新增信息接口
export function save(data) {
return request({
url: '/enterprise/vehicleManage/',
method: 'POST',
data: data
})
}
//修改信息
export function update(data) {
return request({
url: `/enterprise/vehicleManage/${data.vehicleId}`,
method: 'PUT',
data: data
})
}
//根据ID删除信息
export function deleted(id) {
return request({
url: `/enterprise/vehicleManage/${id}`,
method: 'DELETE'
})
}
//根据ID查看信息
export function findById(id) {
return request({
url: `/enterprise/vehicleManage/${id}`,
method: 'GET'
})
}
//获取车辆类型数据
export function getVehicleType() {
return request({
url: `/enterprise/vehicleType/`,
method: 'POST'
})
}
//获取车辆类型数据
export function batchDelete(data) {
return request({
url: `/enterprise/vehicleManage/batchDelete`,
method: 'DELETE',
data: data
})
}
//模拟报文数据
export function analysis(data) {
return request({
url: `/enterprise/messageValue/analysis/+${data}`,
method: 'POST',
})
}

26
src/api/fence/fence.js
View File

@ -2,7 +2,7 @@ import request from '@/utils/request'
// 查询电子围栏列表
export function listFence(data) {
return request({
url: '/vehicles/fence/fenceselectList',
url: '/enterprise/fence/fenceselectList',
method: 'post',
data
})
@ -11,7 +11,7 @@ export function listFence(data) {
// 查询电子围栏选择列表
export function fenceArray(data) {
return request({
url: '/vehicles/fence/fenceArray',
url: '/enterprise/fence/fenceArray',
method: 'post',
data
})
@ -20,7 +20,7 @@ export function fenceArray(data) {
//添加
export function addfence(data) {
return request({
url: '/vehicles/fence/add',
url: '/enterprise/fence/add',
method: 'post',
data
})
@ -28,7 +28,7 @@ export function addfence(data) {
//修改
export function updfence(data) {
return request({
url: `/vehicles/fence/upd/${data.id}`,
url: `/enterprise/fence/upd/${data.id}`,
method: 'post',
data
})
@ -36,17 +36,21 @@ export function updfence(data) {
//删除
export function delElectronById(id) {
// return request({
// url: '/vehicles/fence/delElectronById/'+id,
// method: 'post',
// data
// })
return request({
url: '/vehicles/fence/delElectronById/'+id,
method: 'post',
data
url: '/enterprise/fence/' + id,
method: 'DELETE'
})
}
//根据id设置围栏
export function setFenceWay(data) {
return request({
url: '/vehicles/fence/setFenceWay',
url: '/enterprise/fence/setFenceWay',
method: 'post',
data
})
@ -56,7 +60,7 @@ export function setFenceWay(data) {
//开启围栏
export function openFence(id) {
return request({
url: '/vehicles/fence/open/'+id,
url: '/enterprise/fence/open/'+id,
method: 'post',
data
})
@ -64,7 +68,7 @@ export function openFence(id) {
//回显
export function findElectronicByid(id) {
return request({
url: '/vehicles/fence/findElectronicByid/'+id,
url: '/enterprise/fence/findElectronicByid/'+id,
method: 'post',
})
}
@ -72,7 +76,7 @@ export function findElectronicByid(id) {
//关闭围栏
export function closeFence(id) {
return request({
url: '/vehicles/fence/close/'+id,
url: '/enterprise/fence/close/'+id,
method: 'post',
data
})

33
src/api/fence/group.js
View File

@ -3,7 +3,7 @@ import request from '@/utils/request'
// 查询围栏组列表
export function selectGroupList(data) {
return request({
url: '/vehicles/group/selectGroupList',
url: '/enterprise/group/selectGroupList',
method: 'post',
data
})
@ -12,7 +12,7 @@ export function selectGroupList(data) {
//添加
export function addGroup(data) {
return request({
url: '/vehicles/group/addGroup',
url: '/enterprise/group/addGroup',
method: 'post',
data
})
@ -20,7 +20,7 @@ export function addGroup(data) {
//修改
export function updGroup(data) {
return request({
url: `/vehicles/group/updGroup/${data.id}`,
url: `/enterprise/group/updGroup/${data.id}`,
method: 'post',
data
})
@ -28,7 +28,32 @@ export function updGroup(data) {
//添加
export function findGroupByid(id) {
return request({
url: '/vehicles/group/findGroupByid/'+id,
url: '/enterprise/group/findGroupByid/'+id,
method: 'post',
})
}
//围栏组删除
export function delFindGroupId(id) {
// return request({
// url: '/vehicles/fence/delElectronById/'+id,
// method: 'post',
// data
// })
return request({
url: '/enterprise/group/' + id,
method: 'DELETE'
})
}
//围栏链表删除
export function delFindGroupMixId(id) {
// return request({
// url: '/vehicles/fence/delElectronById/'+id,
// method: 'post',
// data
// })
return request({
url: '/enterprise/group/findId' + id,
method: 'DELETE'
})
}

1
src/api/manage/fenceAPI.js
View File

@ -1 +0,0 @@

323
src/views/car/map/map.vue 100644
View File

@ -0,0 +1,323 @@
<!--<template>-->
<!-- &lt;!&ndash; 控制按钮组 &ndash;&gt;-->
<!-- <div class="main">-->
<!-- <section class="section">-->
<!-- &lt;!&ndash; 地图 &ndash;&gt;-->
<!-- <div id="map_container" style="width: 100%; height: 100vh;"></div>-->
<!-- &lt;!&ndash; 控制按钮组 &ndash;&gt;-->
<!-- <div class="ebox">-->
<!-- <el-button-group>-->
<!-- <el-button type="info" icon="el-icon-circle-plus-outline" @click="drawRectangle">绘制围栏</el-button>-->
<!-- <el-button type="primary" icon="el-icon-edit" @click="editRectangle">编辑围栏</el-button>-->
<!-- <el-button type="warning" icon="el-icon-delete" @click="cancelRectangle">取消编辑</el-button>-->
<!-- <el-button type="success" icon="el-icon-success" @click="saveRectangle">保存围栏</el-button>-->
<!-- <el-button type="danger" icon="el-icon-delete" @click="deleRectangle">删除围栏</el-button>-->
<!-- </el-button-group>-->
<!-- </div>-->
<!-- </section>-->
<!-- &lt;!&ndash;添加电子围栏&ndash;&gt;-->
<!-- <el-dialog title="添加电子围栏" :visible.sync="dialogFormVisible">-->
<!-- <el-form :model="fence">-->
<!-- <el-form-item label="围栏名称" :label-width="formLabelWidth">-->
<!-- <el-input v-model="fence.fenceName" autocomplete="off"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="业务类型" :label-width="formLabelWidth">-->
<!--&lt;!&ndash; <el-input v-model="fence.fenceType" autocomplete="off"></el-input>&ndash;&gt;-->
<!-- <el-radio v-model="fence.fenceType" label="1">平台围栏</el-radio>-->
<!-- <el-radio v-model="fence.fenceType" label="2">终端围栏</el-radio>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="围栏类型" :label-width="formLabelWidth">-->
<!-- <el-select v-model="fence.typeId" placeholder="请选择">-->
<!-- <el-option-->
<!-- v-for="item in options"-->
<!-- :key="item.typeId"-->
<!-- :label="item.typeName"-->
<!-- :value="item.typeId">-->
<!-- </el-option>-->
<!-- </el-select>-->
<!--&lt;!&ndash; <el-input v-model="fence.typeId" autocomplete="off"></el-input>&ndash;&gt;-->
<!-- </el-form-item>-->
<!-- <el-form-item label="坐标" :label-width="formLabelWidth">-->
<!-- <el-input v-model="fence.coordinates" autocomplete="off"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="描述" :label-width="formLabelWidth">-->
<!-- <el-input v-model="fence.description" autocomplete="off"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="结束时间" :label-width="formLabelWidth">-->
<!--&lt;!&ndash; <el-input v-model="fence.endTime" autocomplete="off"></el-input>&ndash;&gt;-->
<!-- <div class="block">-->
<!-- <el-date-picker-->
<!-- v-model="fence.endTime"-->
<!-- type="datetime"-->
<!-- value-format="yyyy-MM-dd HH:mm:ss"-->
<!-- placeholder="选择日期时间">-->
<!-- </el-date-picker>-->
<!-- </div>-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- <div slot="footer" class="dialog-footer">-->
<!-- <el-button @click="dialogFormVisible = false">取 消</el-button>-->
<!-- <el-button type="primary" @click="sure">确 定</el-button>-->
<!-- </div>-->
<!-- </el-dialog>-->
<!-- </div>-->
<!--</template>-->
<!--<script>-->
<!--import AMapLoader from "@amap/amap-jsapi-loader";-->
<!--import { geofenceList } from '@/api/manage/fenceAPI.js'-->
<!--import { save, showTypeList } from '../../../api/car/car' //获取围栏数据-->
<!--window._AMapSecurityConfig = {-->
<!-- securityJsCode: "4f3846d5cf6d8f35fbddff03827111c5",-->
<!--};-->
<!--export default {-->
<!-- name: "MapContainer",-->
<!-- data() {-->
<!-- return {-->
<!-- formData: {-->
<!-- carId: '',-->
<!-- pageNum: 1,//当前页-->
<!-- pageSize: 10,//页长-->
<!-- pageTotal: 0,//总数-->
<!-- },-->
<!-- map: null,-->
<!-- centerArr: [113.760234, 23.048884],//地图中心位置，不能为空数组【为空数组会报错】-->
<!-- path: [],//以前绘制的数据-->
<!-- paths: [], // 当前绘制的多边形经纬度数组-->
<!-- polygonItem: [], // 地图上绘制的所有多边形对象-->
<!-- polyEditors: [],// 新增数据=>所有编辑对象数组-->
<!-- polyEditorsBefore: [],// 以前历史数据=>进入编辑对象数组-->
<!-- //电子围栏-->
<!-- fence:{-->
<!-- coordinates:'',-->
<!-- },-->
<!-- dialogFormVisible:false,-->
<!-- formLabelWidth:'120px',-->
<!-- options:[],-->
<!-- };-->
<!-- },-->
<!-- created() {-->
<!-- this.selectType();-->
<!-- },-->
<!-- mounted() {-->
<!-- this.initAMap();-->
<!-- this.init();-->
<!-- },-->
<!-- methods: {-->
<!-- initAMap() {-->
<!-- AMapLoader.load({-->
<!-- key: "9408bcaab05dce2e69d6540f44c56628",-->
<!-- version: "2.0",-->
<!-- plugins: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.ToolBar',-->
<!-- 'AMap.MapType', 'AMap.MouseTool', 'AMap.Polygon', 'AMap.PolyEditor', 'AMap.CircleEditor'],-->
<!-- }).then((AMap) => {-->
<!-- this.map = new AMap.Map("map_container", {-->
<!-- resizeEnable: true,-->
<!-- viewMode: '3D', // 注意这里的引号-->
<!-- zoom: 17,-->
<!-- // 移除 pitch 属性，如果不需要特殊倾斜角度-->
<!-- // pitch: 55,-->
<!-- showBuildingBlock: true, // 注意这个属性可能在某些版本中不起作用-->
<!-- });-->
<!-- // 添加工具栏-->
<!-- this.map.plugin(['AMap.ToolBar', 'AMap.Scale'], () => {-->
<!-- const toolbar = new AMap.ToolBar()// 工具条-->
<!-- const scale = new AMap.Scale()// 比例尺-->
<!-- this.map.addControl(toolbar)-->
<!-- this.map.addControl(scale)-->
<!-- })-->
<!-- }).catch((e) => {-->
<!-- console.error('地图加载失败:', e);-->
<!-- });-->
<!-- },-->
<!-- // 绘制多边形-->
<!-- drawRectangle() {-->
<!-- const This = this;-->
<!-- let mouseTool = new AMap.MouseTool(this.map);-->
<!-- const polygon = mouseTool.polygon({-->
<!-- //polygon：绘制多边形【线段：polyline;矩形：rectangle;圆：circle】-->
<!-- strokeColor: 'red',-->
<!-- strokeOpacity: 0.4,-->
<!-- strokeWeight: 6,-->
<!-- fillColor: '#1791fc',-->
<!-- fillOpacity: 0.2,-->
<!-- // strokeStyle还支持 solid-->
<!-- strokeStyle: 'solid',-->
<!-- // strokeDasharray: [30,10],-->
<!-- });-->
<!-- mouseTool.on('draw', function (event) {-->
<!-- // event.obj 为绘制出来的覆盖物对象-->
<!-- let polygonItem = event.obj;-->
<!-- let paths = polygonItem.getPath();//取得绘制的多边形的每一个点坐标-->
<!-- // console.log('覆盖物对象绘制完成各个点的坐标', paths, event);-->
<!-- let path = []; // 编辑的路径-->
<!-- paths.forEach(v => {-->
<!-- path.push([v.lng, v.lat])-->
<!-- });-->
<!-- This.paths = path //将新增数据放入paths数组里-->
<!-- // This.editRectangle();//绘制完成,默认进入编辑状态-->
<!-- This.polygonItem.push(event.obj);-->
<!-- // This.map.remove(event.obj); // 删除多边形-->
<!-- // console.log(polygon, '&#45;&#45;&#45;&#45;&#45;&#45;polygon-&#45;&#45;&#45;&#45;');-->
<!-- console.log(paths);//控制台打印坐标-->
<!-- });-->
<!-- },-->
<!-- //确定添加围栏-->
<!-- sure(){-->
<!-- save(this.fence).then(res=>{-->
<!-- alert("添加电子围栏成功");-->
<!-- })-->
<!-- },-->
<!-- //下拉框-->
<!-- selectType(){-->
<!-- showTypeList().then(res=>{-->
<!-- this.options=res.data;-->
<!-- })-->
<!-- },-->
<!-- // 编辑围栏-->
<!-- editRectangle() {-->
<!-- const path = this.paths;-->
<!-- //新增的进入编辑状态-->
<!-- let polygon = new AMap.Polygon({-->
<!-- path: path,-->
<!-- strokeColor: "#FF33FF",-->
<!-- strokeWeight: 6,-->
<!-- strokeOpacity: 0.2,-->
<!-- fillOpacity: 0.2,-->
<!-- fillColor: '#1791fc',-->
<!-- zIndex: 50,-->
<!-- });-->
<!-- this.map.add(polygon);-->
<!-- this.polygonItem.push(polygon);-->
<!-- // 缩放地图到合适的视野级别-->
<!-- this.map.setFitView([polygon]);-->
<!-- this.polyEditor = new AMap.PolyEditor(this.map, polygon);-->
<!-- this.polyEditor.open();-->
<!-- this.polyEditors.push(this.polyEditor);-->
<!-- //历史围栏的进入编辑状态-->
<!-- let polygonBefore = new AMap.Polygon({-->
<!-- path: this.path,-->
<!-- strokeColor: "#FF33FF",-->
<!-- strokeWeight: 6,-->
<!-- strokeOpacity: 0.2,-->
<!-- fillOpacity: 0.2,-->
<!-- fillColor: '#1791fc',-->
<!-- zIndex: 50,-->
<!-- });-->
<!-- this.map.add(polygonBefore);-->
<!-- this.polygonItem.push(polygonBefore);-->
<!-- // 缩放地图到合适的视野级别-->
<!-- this.map.setFitView([polygonBefore]);-->
<!-- this.polyEditorBefore = new AMap.PolyEditor(this.map, polygonBefore);-->
<!-- this.polyEditorBefore.open();-->
<!-- this.polyEditorsBefore.push(this.polyEditorBefore);-->
<!-- // this.polyEditor.on('addnode', function (event) {-->
<!-- // console.info('触发事件：addnode', event)-->
<!-- // console.info('修改后的经纬度：', polygon.getPath())-->
<!-- // });-->
<!-- // this.polyEditor.on('adjust', function (event) {-->
<!-- // console.info('触发事件：adjust', event)-->
<!-- // console.info('修改后的经纬度：', polygon.getPath())-->
<!-- // });-->
<!-- // this.polyEditor.on('removenode', function (event) {-->
<!-- // console.info('触发事件：removenode', event)-->
<!-- // console.info('修改后的经纬度：', polygon.getPath())-->
<!-- // });-->
<!-- // this.polyEditor.on('end', function (event) {-->
<!-- // console.info('触发事件： end', event)-->
<!-- // console.info('end修改后的经纬度：', polygon.getPath())-->
<!-- // // event.target 即为编辑后的多边形对象-->
<!-- // });-->
<!-- },-->
<!-- // 取消编辑状态-->
<!-- cancelRectangle() {-->
<!-- this.polyEditors.forEach(item => { item.close(); });//新增-->
<!-- this.polyEditorsBefore.forEach(item => { item.close(); });//历史-->
<!-- },-->
<!-- //保存围栏-->
<!-- saveRectangle() {-->
<!-- //对话框-->
<!-- this.dialogFormVisible=true;-->
<!-- this.fence.coordinates=JSON.stringify(this.paths);-->
<!-- // 取消编辑状态-->
<!-- this.polyEditors.forEach(item => { item.close(); });-->
<!-- this.polyEditorsBefore.forEach(item => { item.close(); });-->
<!-- // 保存 console.log(this.paths,this.path)=>成功（重新刷新页面）-->
<!-- // ...-->
<!-- },-->
<!-- // 删除围栏-->
<!-- deleRectangle() {-->
<!-- this.polyEditors.forEach(item => { item.close(); });// 取消编辑状态-->
<!-- this.polyEditorsBefore.forEach(item => { item.close(); });// 取消编辑状态-->
<!-- this.map.clearMap(); // 删除地图所有覆盖物-->
<!-- //删除=>成功（重新刷新页面）-->
<!-- // ...-->
<!-- },-->
<!-- //获取后台数据-->
<!-- init() {-->
<!-- const that = this-->
<!-- let param = {-->
<!-- carId: this.formData.carId,//string true carID-->
<!-- pageNum: this.formData.pageNum,//string false 当前页数-->
<!-- pageSize: this.formData.pageSize,//string false 每页条数-->
<!-- }-->
<!-- geofenceList({ param }).then(res => {-->
<!-- if (res.data.code == 0) {-->
<!-- if (res.data.data.list.length==0) {-->
<!-- this.$message.error('没有围栏数据')-->
<!-- return-->
<!-- }-->
<!-- that.path=[]-->
<!-- that.map.clearMap(); // 删除地图所有覆盖物-->
<!-- res.data.data.list.forEach((item, index) => { //同时展示多个围栏-->
<!-- that.path.push(item.points)//编辑时，可以一起编辑-->
<!-- // this.centerArr = that.path[0]-->
<!-- // this.initMap()-->
<!-- that.map.add(new AMap.Polygon({-->
<!-- path: item.points,-->
<!-- strokeColor: "#FF33FF",-->
<!-- strokeWeight: 6,-->
<!-- strokeOpacity: 0.2,-->
<!-- fillOpacity: 0.4,-->
<!-- fillColor: "#1791fc",-->
<!-- zIndex: 50,-->
<!-- }));-->
<!-- that.map.setFitView();-->
<!-- })-->
<!-- } else {-->
<!-- this.$message.error(res.data.msg)-->
<!-- }-->
<!-- })-->
<!-- },-->
<!-- }-->
<!--};-->
<!--</script>-->
<!--<style scoped>-->
<!--#map_container {-->
<!-- width: 100%;-->
<!-- height: 100vh;-->
<!--}-->
<!--.ebox {-->
<!-- position: absolute;-->
<!-- top: 10px;-->
<!-- right: 10px;-->
<!-- z-index: 1000; /* 确保按钮在地图之上 */-->
<!--}-->
<!--</style>-->

199
src/views/car/selectCar/index.vue 100644
View File

@ -0,0 +1,199 @@
<!--<template>-->
<!-- <div>-->
<!-- &lt;!&ndash;查询&ndash;&gt;-->
<!-- <el-form :inline="true" :model="fence" class="demo-form-inline">-->
<!-- <el-form-item label="围栏名称">-->
<!-- <el-input v-model="fence.fenceName" placeholder="围栏名称"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="业务类型">-->
<!-- <el-select v-model="fence.fenceType" placeholder="业务类型">-->
<!-- <el-option label="平台围栏" value="0"></el-option>-->
<!-- <el-option label="终端围栏" value="1"></el-option>-->
<!-- </el-select>-->
<!--&lt;!&ndash; <el-input v-model="fence.fenceType" placeholder="业务类型"></el-input>&ndash;&gt;-->
<!-- </el-form-item>-->
<!-- <el-form-item label="围栏类型">-->
<!-- <el-select v-model="fence.typeName" placeholder="请选择">-->
<!-- <el-option-->
<!-- v-for="item in options"-->
<!-- :key="item.typeId"-->
<!-- :label="item.typeName"-->
<!-- :value="item.typeId">-->
<!-- </el-option>-->
<!-- </el-select>-->
<!--&lt;!&ndash; <el-input v-model="fence.typeName" placeholder="围栏类型"></el-input>&ndash;&gt;-->
<!-- </el-form-item>-->
<!-- <el-form-item>-->
<!-- <el-button type="primary" @click="onSubmit">查询</el-button>-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- &lt;!&ndash;列表&ndash;&gt;-->
<!-- <el-table-->
<!-- :data="tableData"-->
<!-- style="width: 100%">-->
<!-- <el-table-column-->
<!-- label="序号"-->
<!-- 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="业务类型"-->
<!-- width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span style="margin-left: 10px">-->
<!-- <p v-if="scope.row.fenceType==0">平台围栏</p>-->
<!-- <p v-if="scope.row.fenceType==1">终端围栏</p>-->
<!-- </span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="围栏类型"-->
<!-- width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span style="margin-left: 10px">{{ scope.row.typeName }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="坐标"-->
<!-- width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span style="margin-left: 10px">{{ scope.row.coordinates }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="描述"-->
<!-- width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span style="margin-left: 10px">{{ scope.row.description }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="状态"-->
<!-- width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span style="margin-left: 10px">-->
<!-- <p v-if="scope.row.status==0">运行</p>-->
<!-- <p v-if="scope.row.status==1">停止</p>-->
<!-- </span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="开始时间"-->
<!-- width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span style="margin-left: 10px">{{ scope.row.startTime }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="结束时间"-->
<!-- width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span style="margin-left: 10px">{{ scope.row.endTime }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="操作">-->
<!-- <template slot-scope="scope">-->
<!-- <el-button-->
<!-- size="mini"-->
<!-- @click="handleEdit(scope.$index, scope.row)">编辑</el-button>-->
<!-- <el-button-->
<!-- size="mini"-->
<!-- type="danger"-->
<!-- @click="handleDelete(scope.$index, scope.row)">删除</el-button>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- </div>-->
<!--</template>-->
<!--<script>-->
<!--//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,-->
<!--//例如：import 《组件名称》 from '《组件路径》,-->
<!--import Treeselect from '@riophae/vue-treeselect'-->
<!--import IconSelect from '@/components/IconSelect/index.vue'-->
<!--import { showList } from '@/api/car/car'-->
<!--import { showTypeList } from '../../../api/car/car'-->
<!--// import {cc} from 'public/map.html'-->
<!--export default {-->
<!-- name: "Market",-->
<!-- //import引入的组件需要注入到对象中才能使用"-->
<!-- components: { IconSelect, Treeselect },-->
<!-- props: {},-->
<!-- data() {-->
<!-- //这里存放数据"-->
<!-- return {-->
<!-- tableData:[],-->
<!-- fence:{},-->
<!-- options:[],-->
<!-- };-->
<!-- },-->
<!-- //计算属性 类似于data概念",-->
<!-- computed: {},-->
<!-- //监控data中的数据变化",-->
<!-- watch: {},-->
<!-- //方法集合",-->
<!-- methods: {-->
<!-- //列表-->
<!-- getList(){-->
<!-- showList(this.fence).then(res=>{-->
<!-- this.tableData=res.data;-->
<!-- })-->
<!-- },-->
<!-- //查询-->
<!-- onSubmit(){-->
<!-- this.getList();-->
<!-- },-->
<!-- //获取下拉框-->
<!-- selectType(){-->
<!-- showTypeList().then(res=>{-->
<!-- this.options=res.data;-->
<!-- })-->
<!-- }-->
<!-- },-->
<!-- //生命周期 - 创建完成（可以访问当前this实例）",-->
<!-- created() {-->
<!-- this.getList();-->
<!-- this.selectType();-->
<!-- },-->
<!-- //生命周期 - 挂载完成（可以访问DOM元素）",-->
<!-- mounted() {-->
<!-- },-->
<!-- beforeCreate() {-->
<!-- }, //生命周期 - 创建之前",-->
<!-- beforeMount() {-->
<!-- }, //生命周期 - 挂载之前",-->
<!-- beforeUpdate() {-->
<!-- }, //生命周期 - 更新之前",-->
<!-- updated() {-->
<!-- }, //生命周期 - 更新之后",-->
<!-- beforeDestroy() {-->
<!-- }, //生命周期 - 销毁之前",-->
<!-- destroyed() {-->
<!-- }, //生命周期 - 销毁完成",-->
<!-- activated() {-->
<!-- } //如果页面有keep-alive缓存功能，这个函数会触发",-->
<!--};-->
<!--</script>-->
<!--<style scoped>-->
<!--</style>-->

383
src/views/car/vehicleManage/index.vue 100644
View File

@ -0,0 +1,383 @@
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" size="small">
<el-form-item label="车牌号" prop="licenceNumber">
<el-input
v-model="queryParams.licenceNumber"
clearable
placeholder="请输入车牌号"
style="width: 240px"
/>
</el-form-item>
<el-form-item label="车辆VIN" prop="vehicleVin">
<el-input
v-model="queryParams.vehicleVin"
clearable
placeholder="请输入车辆VIN"
style="width: 240px"
/>
</el-form-item>
<el-form-item label="车辆状态" prop="vehicleStatus">
<el-select
v-model="queryParams.vehicleStatus"
clearable
placeholder="车辆状态"
style="width: 240px"
>
<el-option
v-for="dict in dict.type.car_vehicle_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</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-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
icon="el-icon-plus"
plain
size="mini"
type="primary"
@click="handleAdd"
>新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
icon="el-icon-delete"
plain
size="mini"
type="danger"
@click="handleBatchDelete"
>删除
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
icon="el-icon-download"
plain
size="mini"
type="warning"
@click="handleExport"
>导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="vehicleList"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column label="车牌号" prop="licenceNumber" align="center"/>
<el-table-column label="车辆颜色" prop="vehicleColor" align="center">
<template slot-scope="scope">
<dict-tag :options="dict.type.car_vehicle_color" :value="scope.row.vehicleColor"/>
</template>
</el-table-column>
<el-table-column label="车辆VIN" prop="vehicleVin" align="center"/>
<el-table-column label="车辆类型" prop="vehicleTypeName" align="center"/>
<el-table-column label="车辆品牌" prop="vehicleBrand" align="center"/>
<el-table-column label="车辆型号" prop="vehicleModel" align="center"/>
<el-table-column label="车辆状态" prop="vehicleStatus" align="center">
<template slot-scope="scope">
<dict-tag :options="dict.type.car_vehicle_status" :value="scope.row.vehicleStatus"/>
</template>
</el-table-column>
<el-table-column align="center" class-name="small-padding fixed-width" label="操作">
<template v-if="scope.row.roleId !== 1" slot-scope="scope">
<el-button
icon="el-icon-edit"
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>修改
</el-button>
<el-button
icon="el-icon-delete"
size="mini"
type="text"
@click="handleDelete(scope.row)"
>删除
</el-button>
<el-button
icon="el-icon-odometer"
size="mini"
type="text"
@click="handleInfo(scope.row)"
>详情
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:limit.sync="queryParams.pageSize"
:page.sync="queryParams.pageNum"
:total="total"
@pagination="getList"
/>
<!-- 添加或修改角色配置对话框 -->
<el-dialog :title="title" :visible.sync="open" append-to-body width="500px">
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="车牌号" prop="licenceNumber">
<el-input v-model="form.licenceNumber" placeholder="请输入车牌号"/>
</el-form-item>
<el-form-item label="车辆颜色" prop="vehicleColor">
<el-select
v-model="form.vehicleColor"
clearable
placeholder="车辆颜色"
>
<el-option
v-for="dict in dict.type.car_vehicle_color"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="车辆VIN" prop="vehicleVin">
<el-input v-model="form.vehicleVin" placeholder="请输入车辆VIN"/>
</el-form-item>
<el-form-item label="车辆类型" prop="vehicleTypeId">
<el-select v-model="form.vehicleTypeId" placeholder="请选择车辆类型">
<el-option v-for="type in vehicleTypeList" :label="type.vehicleTypeName" :value="type.vehicleTypeId"
:key="type.vehicleTypeId"></el-option>
</el-select>
</el-form-item>
<el-form-item label="车辆品牌" prop="vehicleBrand">
<el-input v-model="form.vehicleBrand" placeholder="请输入车辆品牌"/>
</el-form-item>
<el-form-item label="车辆型号" prop="vehicleModel">
<el-input v-model="form.vehicleModel" placeholder="请输入车辆型号"/>
</el-form-item>
<el-form-item label="车辆行驶证" prop="vehicleLicense">
<el-input v-model="form.vehicleLicense" placeholder="请输入车辆行驶证"/>
</el-form-item>
<el-form-item label="行驶证到期日期" prop="vehicleLicenseDueDate">
<el-date-picker
v-model="form.vehicleLicenseDueDate"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请输入行驶证到期日期">
</el-date-picker>
</el-form-item>
<el-form-item label="车辆状态" prop="vehicleStatus">
<el-select
v-model="form.vehicleStatus"
clearable
placeholder="车辆状态"
>
<el-option
v-for="dict in dict.type.car_vehicle_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="电子围栏组" prop="fenceGroupId">
<el-input v-model="form.fenceGroupId" placeholder="请输入电子围栏组"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
showList,
save,
findById,
deleted,
update,
getVehicleType,
batchDelete,
} from "../../../api/car/vehicle";
export default {
name: "Vehicle",
dicts: ['car_vehicle_status', 'car_vehicle_color'],
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 车辆表格数据
vehicleList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
licenceNumber: undefined,
vehicleVin: undefined,
vehicleStatus: undefined
},
// 表单参数
form: {},
defaultProps: {
children: "children",
label: "label"
},
// 车辆类型列表
vehicleTypeList: [],
// 多选框选中数据
vehicleIds: [],
};
},
created() {
this.getList();
this.getVehicleTypeList();
},
methods: {
/** 查询角色列表 */
getList() {
this.loading = true;
showList(this.queryParams).then(response => {
this.vehicleList = response.data.rows;
this.total = response.data.total;
this.loading = false;
}
);
},
/** 查询角色列表 */
getVehicleTypeList() {
getVehicleType().then(response => {
this.vehicleTypeList = response.data;
}
);
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
vehicleId: undefined,
licenceNumber: undefined,
vehicleColor: undefined,
vehicleVin: undefined,
vehicleTypeId: undefined,
vehicleBrand: undefined,
vehicleModel: undefined,
vehicleLicense: undefined,
vehicleLicenseDueDate: undefined,
vehicleStatus: undefined,
fenceGroupId: undefined
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "录入车辆";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const vehicleId = row.vehicleId
findById(vehicleId).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改车辆信息";
});
},
/** 提交按钮 */
submitForm: function () {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.vehicleId != undefined) {
update(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
save(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const vehicleId = row.vehicleId;
this.$modal.confirm('是否确认删除编号为"' + vehicleId + '"的数据项？').then(function () {
return deleted(vehicleId);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
/** 多选框选中数据 */
handleSelectionChange(val) {
this.vehicleIds = [];
for (let key in val) {
this.vehicleIds.push(val[key].vehicleId);
}
},
/** 批量删除汽车 */
handleBatchDelete() {
console.log(this.vehicleIds);
batchDelete(this.vehicleIds).then(response => {
this.$modal.msgSuccess("批量删除成功");
this.getList();
})
},
/** 导出按钮操作 */
handleExport() {
this.download('car/vehicleManage/export', {
...this.queryParams
}, `role_${new Date().getTime()}.xlsx`)
},
/** 跳转到详情页面 */
handleInfo(row){
this.$router.push({
path:'vehicleInfo', query:{vehicleId: row.vehicleId}
})
},
}
};
</script>

71
src/views/car/vehicleManage/info.vue 100644
View File

@ -0,0 +1,71 @@
<template>
<div class="app-container">
<el-tabs v-model="activeName">
<el-tab-pane label="实时信息" name="first">
<el-descriptions v-model="realTimeData">
<el-descriptions-item v-for="(value, key) in realTimeData" :key="key" :label="key">
{{ value }}
</el-descriptions-item>
</el-descriptions>
</el-tab-pane>
<el-tab-pane label="基本信息" name="second">
<el-descriptions v-model="vehicleInfo">
<el-descriptions-item label="车牌号">{{ vehicleInfo.licenceNumber }}</el-descriptions-item>
<el-descriptions-item label="车牌颜色">{{ vehicleInfo.vehicleColor }}</el-descriptions-item>
<el-descriptions-item label="车辆VIN">{{ vehicleInfo.vehicleVin }}</el-descriptions-item>
<el-descriptions-item label="车辆类型">{{ vehicleInfo.vehicleTypeId }}</el-descriptions-item>
<el-descriptions-item label="车辆品牌">{{ vehicleInfo.vehicleBrand }}</el-descriptions-item>
<el-descriptions-item label="车辆型号">{{ vehicleInfo.vehicleModel }}</el-descriptions-item>
<el-descriptions-item label="车辆行驶证">{{ vehicleInfo.vehicleLicense }}</el-descriptions-item>
<el-descriptions-item label="行驶证到期日期">{{ vehicleInfo.vehicleLicenseDueDate }}</el-descriptions-item>
<el-descriptions-item label="车辆状态">
<dict-tag :options="dict.type.car_vehicle_status" :value="vehicleInfo.vehicleStatus"/>
</el-descriptions-item>
</el-descriptions>
</el-tab-pane>
<el-tab-pane label="电子围栏" name="third">电子围栏</el-tab-pane>
<el-tab-pane label="预警信息" name="fourth">预警信息</el-tab-pane>
<el-tab-pane label="故障信息" name="five">故障信息</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import {
findById,analysis
} from "../../../api/car/vehicle";
export default {
name: "VehicleInfo",
dicts: ['car_vehicle_status'],
data() {
return {
// 标签页
activeName: 'second',
// 基本信息
vehicleInfo:{},
// 实时数据
realTimeData: "",
};
},
created() {
this.getVehicleInfo()
this.getRealData()
},
methods: {
/** 车辆基本信息回显 **/
getVehicleInfo(){
findById(this.$route.query.vehicleId).then(response => {
this.vehicleInfo = response.data
})
},
getRealData(){
var testStr = "7E 56 49 4e 31 32 33 34 35 36 37 38 39 31 32 33 34 35 32 33 35 36 37 38 39 31 32 33 34 35 31 31 36 2e 36 36 34 30 35 33 30 33 39 2e 35 33 31 37 39 31 30 32 30 30 2e 30 30 35 38 36 37 38 33 37 2e 33 32 34 36 33 35 2e 31 32 33 39 2e 34 39 31 36 38 37 39 38 2e 35 36 50 30 39 30 38 31 39 2e 39 39 39 39 2e 38 36 30 39 39 39 39 39 31 30 30 30 31 33 39 2e 34 36 31 34 2e 36 38 31 31 33 36 39 2e 38 39 31 30 30 2e 30 30 31 30 30 2e 30 30 31 30 30 2e 30 30 31 33 31 34 2e 36 35 33 36 30 2e 35 38 34 2e 35 36 33 2e 32 35 31 30 30 2e 30 30 39 38 2e 32 33 30 33 36 2e 32 36 30 30 30 30 30 30 30 30 30 30 30 30 30 30 30 30 30 30 76 7E";
analysis(testStr).then(response => {
this.realTimeData = response.data
console.log(this.realTimeData)
})
}
}
};
</script>

2
src/views/fence/fences/index.vue
View File

@ -13,7 +13,7 @@
<!-- fenceBusiness-->
<!-- <el-form-item label="业务类型" prop="fenceBusiness">-->
<!-- <el-select v-model="queryParams.fenceBusiness" placeholder="请选择业务类型" clearable size="small">-->
<!-- <el-option-->
<!-- <el-option-->*
<!-- v-for="dict in fenceAlarmTypeOptions"-->
<!-- :key="dict.dictValue"-->
<!-- :label="dict.dictLabel"-->

51
src/views/fence/group.vue
View File

@ -327,8 +327,15 @@
<script>
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {addGroup, findGroupByid, selectGroupList, updGroup} from "@/api/fence/group";
import {fenceArray, findElectronicByid, listFence} from "@/api/fence/fence";
import {
addGroup,
delFindGroupId,
delFindGroupMixId,
findGroupByid,
selectGroupList,
updGroup
} from '@/api/fence/group'
import { delElectronById, fenceArray, findElectronicByid, listFence } from '@/api/fence/fence'
import { delDept } from '@/api/system/dept'
export default {
name: "group",
@ -425,23 +432,45 @@ export default {
},
handleDelete(row){
this.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项？').then(function () {
return delDept(row.deptId);
// this.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项？').then(function () {
// return delDept(row.deptId);
// }).then(() => {
// this.getList();
// this.$modal.msgSuccess("删除成功");
// }).catch(() => {
// });
const ids = row.id || this.ids;
this.$confirm('是否确认删除围栏组名称为"' + row.groupName + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delFindGroupId(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
}).catch(() => {});
},
handleDelete1(row){
this.$modal.confirm('是否确认解除名称为"' + row.deptName + '"的数据项？').then(function () {
return delDept(row.deptId);
// this.$modal.confirm('是否确认解除名称为"' + row.deptName + '"的数据项？').then(function () {
// return delDept(row.deptId);
// }).then(() => {
// this.getList();
// this.$modal.msgSuccess("解除绑定成功");
// }).catch(() => {
// });
const ids = row.id || this.ids;
this.$confirm('是否确认解除电子围栏绑定的"' + row.fenceName + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delFindGroupMixId(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("解除绑定成功");
}).catch(() => {
});
this.$modal.msgSuccess("解绑围栏成功");
}).catch(() => {});
},
// 取消按钮

30
src/views/fence/list.vue
View File

@ -68,7 +68,7 @@
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['vehicles:sysCorpuscleFence:remove']"
v-hasPermi="['vehicles:fence:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
@ -78,7 +78,7 @@
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['vehicles:sysCorpuscleFence:export']"
v-hasPermi="['vehicles:fence:export']"
>导出</el-button>
</el-col>
@ -92,6 +92,7 @@
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column
label="id"
width="180">
@ -204,8 +205,9 @@
<script>
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {addfence, findElectronicByid, listFence, updfence} from "@/api/fence/fence";
import { addfence, delElectronById, findElectronicByid, listFence, updfence } from '@/api/fence/fence'
import {addDept, delDept, getDept, listDept, listDeptExcludeChild, updateDept} from "@/api/system/dept";
import { delFence } from '@/api/vehicle/fence'
export default {
name: "list",
@ -214,6 +216,8 @@ export default {
return {
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
showSearch: true,
fenceList:[],
queryParams:{},
@ -262,14 +266,26 @@ export default {
})
alert("位置："+row.longitudeLatitude)
},
//删除电子围栏
handleDelete(row){
this.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项？').then(function () {
return delDept(row.deptId);
// this.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项？').then(function () {
// return delDept(row.deptId);
// }).then(() => {
// this.getList();
// this.$modal.msgSuccess("删除成功");
// }).catch(() => {
// });
const ids = row.id || this.ids;
this.$confirm('是否确认删除电子围栏编号为"' + ids + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delElectronById(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
}).catch(() => {});
},
// 取消按钮

8
src/views/fence/map.vue
View File

@ -3,6 +3,7 @@
<div id="container"></div>
<div class="input-card" style="width: 120px">
<button class="btn" @click="returnlist" style="margin-bottom: 5px">返回电子围栏</button>
<button class="btn" @click="mixList" style="margin-bottom: 7px">返回围栏组</button>
<div v-show="open==1">
<button class="btn" @click="startEditing" style="margin-bottom: 5px">开始绘制围栏</button>
<button class="btn" @click="endEditing" style="margin-bottom: 5px">保存围栏</button>
@ -140,6 +141,13 @@ export default {
path: 'list'
})
},
//返回围栏列表
mixList() {
this.$router.push({
path: 'group'
})
},
createPolygon() {
this.polyEditor.close();