Compare commits
2 Commits
| Author | SHA1 | Date |
|---|---|---|
 yanchouchou
|
8e1f9fb11e | |
|
yanchouchou
|
e950b3aab9 |
|
|
@ -36,6 +36,7 @@
|
|||
"url": "https://gitee.com/y_project/MuYu-Cloud.git"
|
||||
},
|
||||
"dependencies": {
|
||||
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||
"@riophae/vue-treeselect": "0.4.0",
|
||||
"axios": "0.24.0",
|
||||
"clipboard": "2.0.8",
|
||||
|
|
|
|||
|
|
@ -42,3 +42,14 @@ export function delCar(id) {
|
|||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
//查询所有的车辆类型
|
||||
export function listType() {
|
||||
return request({
|
||||
url: '/car/sysType/list',
|
||||
method: 'get'
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
import request from "@/utils/request";
|
||||
|
||||
//查询所有的车辆类型
|
||||
export function listType(){
|
||||
return request({
|
||||
url: '/saas/sysType/list',
|
||||
method: 'get'
|
||||
})
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,128 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// liebiao
|
||||
export function selectCarFenceList(data) {
|
||||
return request({
|
||||
url: '/saas/carFence/selectConnect',
|
||||
method: 'post',
|
||||
data:data
|
||||
})
|
||||
}
|
||||
//添加围栏
|
||||
export function addCarFence(data) {
|
||||
return request({
|
||||
url: '/saas/carFence/addCarFence',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 添加多对多
|
||||
export function addFenceGroupMidddle(fenceGroupId,carFence) {
|
||||
return request({
|
||||
url: '/saas/middle/addCarFence',
|
||||
method: 'post',
|
||||
params:{fenceGroupId},
|
||||
data:carFence,
|
||||
})
|
||||
}
|
||||
// 添加中间
|
||||
export function addMiddle(data) {
|
||||
return request({
|
||||
url: '/saas/middle/addMiddle',
|
||||
method: 'post',
|
||||
data:data
|
||||
})
|
||||
}
|
||||
|
||||
// 刷新方法
|
||||
export function clazzList() {
|
||||
return request({
|
||||
url: '/saas/carFenceClazz/selectClazz',
|
||||
method: 'post',
|
||||
})
|
||||
}
|
||||
|
||||
// 刷新方法
|
||||
export function typeList(data) {
|
||||
return request({
|
||||
url: '/saas/carFenceType/selectType',
|
||||
method: 'post',
|
||||
})
|
||||
}
|
||||
// 刷新方法
|
||||
export function carAddList(data) {
|
||||
return request({
|
||||
url: '/saas/carFence/carAddList',
|
||||
method: 'post',
|
||||
})
|
||||
}
|
||||
|
||||
// 查询所有车名称
|
||||
export function selectCarInformationIdAndLicensePlate() {
|
||||
return request({
|
||||
url: '/saas/carFence/selectCarInformationIdAndLicensePlate',
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
// 围栏组列表
|
||||
export function group(data) {
|
||||
return request({
|
||||
url: '/saas/fenceGroup/fenceGroupList',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 围栏组添加
|
||||
export function addFenceGroup(data) {
|
||||
return request({
|
||||
url: '/saas/fenceGroup/addFenceGroup',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
//修改围栏组状态
|
||||
export function updateFenceGroupById(groupId){
|
||||
return request({
|
||||
url:'/saas/middle/updateFenceGroupById?groupId='+groupId,
|
||||
method:'get',
|
||||
data:groupId
|
||||
})
|
||||
}
|
||||
//启动修改围栏状态
|
||||
export function activate(groupId){
|
||||
return request({
|
||||
url:'/saas/middle/activate?groupId='+groupId,
|
||||
method:'get',
|
||||
data:groupId
|
||||
})
|
||||
}
|
||||
|
||||
//根据围栏组的id查询绑定的围栏的中间表
|
||||
export function BoundFenceGroup(groupId){
|
||||
return request({
|
||||
url:'/saas/middle/BoundFenceGroup',
|
||||
method:'get',
|
||||
params:{groupId}
|
||||
})
|
||||
}
|
||||
|
||||
//根据围栏组的id 添加车辆的中间表
|
||||
export function AddFenceGroupAddCar(carId,fenceGroup){
|
||||
return request({
|
||||
url:'/saas/middle/addFenceGroupAddCarMiddle',
|
||||
method:'post',
|
||||
params:{carId},
|
||||
data:fenceGroup
|
||||
})
|
||||
}
|
||||
/* 查询绑定的围栏组 */
|
||||
export function selectBoundGFenceGroup(carId){
|
||||
return request({
|
||||
url:'/saas/middle/selectBoundGFenceGroup',
|
||||
method:'get',
|
||||
params:{carId},
|
||||
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -2,7 +2,7 @@ import request from '@/utils/request'
|
|||
|
||||
|
||||
// 登录方法
|
||||
export function login(username, password,firmId, code, uuid) {
|
||||
export function login(username, password, code, uuid) {
|
||||
return request({
|
||||
url: '/auth/login',
|
||||
headers: {
|
||||
|
|
@ -10,7 +10,7 @@ export function login(username, password,firmId, code, uuid) {
|
|||
repeatSubmit: false
|
||||
},
|
||||
method: 'post',
|
||||
data: {username, password,firmId, code, uuid}
|
||||
data: {username, password, code, uuid}
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,5 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
export function geofenceList(){
|
||||
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@ import request from '@/utils/request'
|
|||
// 查询预警日志列表
|
||||
export function listLogs(query) {
|
||||
return request({
|
||||
url: '/saas/logs/list',
|
||||
url: '/warn/logs/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
|
|
@ -12,7 +12,7 @@ export function listLogs(query) {
|
|||
// 查询预警日志详细
|
||||
export function getLogs(id) {
|
||||
return request({
|
||||
url: '/saas/logs/' + id,
|
||||
url: '/warn/logs/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
|
@ -20,7 +20,7 @@ export function getLogs(id) {
|
|||
// 新增预警日志
|
||||
export function addLogs(data) {
|
||||
return request({
|
||||
url: '/saas/logs',
|
||||
url: '/warn/logs',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
|
|
@ -29,7 +29,7 @@ export function addLogs(data) {
|
|||
// 修改预警日志
|
||||
export function updateLogs(data) {
|
||||
return request({
|
||||
url: '/saas/logs',
|
||||
url: '/warn/logs',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
|
|
@ -38,7 +38,7 @@ export function updateLogs(data) {
|
|||
// 删除预警日志
|
||||
export function delLogs(id) {
|
||||
return request({
|
||||
url: '/saas/logs/' + id,
|
||||
url: '/warn/logs/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import request from '@/utils/request'
|
|||
// 查询预警规则列表
|
||||
export function listRule(query) {
|
||||
return request({
|
||||
url: '/saas/rule/list',
|
||||
url: '/warn/rule/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
|
|
@ -12,7 +12,7 @@ export function listRule(query) {
|
|||
// 查询预警规则详细
|
||||
export function getRule(id) {
|
||||
return request({
|
||||
url: '/saas/rule/' + id,
|
||||
url: '/warn/rule/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
|
@ -20,7 +20,7 @@ export function getRule(id) {
|
|||
// 新增预警规则
|
||||
export function addRule(data) {
|
||||
return request({
|
||||
url: '/saas/rule',
|
||||
url: '/warn/rule',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
|
|
@ -29,7 +29,7 @@ export function addRule(data) {
|
|||
// 修改预警规则
|
||||
export function updateRule(data) {
|
||||
return request({
|
||||
url: '/saas/rule',
|
||||
url: '/warn/rule',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
|
|
@ -38,7 +38,7 @@ export function updateRule(data) {
|
|||
// 删除预警规则
|
||||
export function delRule(id) {
|
||||
return request({
|
||||
url: '/saas/rule/' + id,
|
||||
url: '/warn/rule/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,17 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// //根据车辆类型
|
||||
// export function findBySysTypeId(id) {
|
||||
// return request({
|
||||
// url: 'car/sysType/findBySysTypeId/' + id,
|
||||
// method: "POST"
|
||||
// })
|
||||
// }
|
||||
|
||||
// 查询预警策略列表
|
||||
export function listStrategy(query) {
|
||||
return request({
|
||||
url: '/saas/strategy/list',
|
||||
url: '/warn/strategy/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
|
|
@ -13,7 +20,7 @@ export function listStrategy(query) {
|
|||
// 查询预警策略详细
|
||||
export function getStrategy(id) {
|
||||
return request({
|
||||
url: '/saas/strategy/' + id,
|
||||
url: '/warn/strategy/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
|
@ -21,7 +28,7 @@ export function getStrategy(id) {
|
|||
// 新增预警策略
|
||||
export function addStrategy(data) {
|
||||
return request({
|
||||
url: '/saas/strategy',
|
||||
url: '/warn/strategy',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
|
|
@ -30,7 +37,7 @@ export function addStrategy(data) {
|
|||
// 修改预警策略
|
||||
export function updateStrategy(data) {
|
||||
return request({
|
||||
url: '/saas/strategy',
|
||||
url: '/warn/strategy',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
|
|
@ -39,7 +46,15 @@ export function updateStrategy(data) {
|
|||
// 删除预警策略
|
||||
export function delStrategy(id) {
|
||||
return request({
|
||||
url: '/saas/strategy/' + id,
|
||||
url: '/warn/strategy/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
|
||||
// 查询用户列表
|
||||
export function firmList() {
|
||||
return request({
|
||||
url: '/system/sysFirm/firmList',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
|
@ -119,6 +119,21 @@ export const dynamicRoutes = [
|
|||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/carFence',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
permissions: ['carFence:fence:index'],
|
||||
children: [
|
||||
{
|
||||
path: 'fence-MapContainer/:Id(\\d+)',
|
||||
// path: 'fence-MapContainer',
|
||||
component: () => import('@/views/carFence/fence/MapContainer'),
|
||||
name: 'MapContainer',
|
||||
meta: {title: '地图', activeMenu: '/carFence/fence'}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/system/dict-data',
|
||||
component: Layout,
|
||||
|
|
|
|||
|
|
@ -40,11 +40,10 @@ const user = {
|
|||
Login({commit}, userInfo) {
|
||||
const username = userInfo.username.trim()
|
||||
const password = userInfo.password
|
||||
const firmId = userInfo.firmId;
|
||||
const code = userInfo.code
|
||||
const uuid = userInfo.uuid
|
||||
return new Promise((resolve, reject) => {
|
||||
login(username, password,firmId, code, uuid).then(res => {
|
||||
login(username, password, code, uuid).then(res => {
|
||||
let data = res.data
|
||||
setToken(data.access_token)
|
||||
commit('SET_TOKEN', data.access_token)
|
||||
|
|
|
|||
|
|
@ -52,12 +52,6 @@ export function resetForm(refName) {
|
|||
this.$refs[refName].resetFields();
|
||||
}
|
||||
}
|
||||
// // 表单重置
|
||||
// export function resetFormList(refName) {
|
||||
// if (this.$refs[refName]) {
|
||||
// this.$refs[refName].resetFields();
|
||||
// }
|
||||
// }
|
||||
|
||||
// 添加日期范围
|
||||
export function addDateRange(params, dateRange, propName) {
|
||||
|
|
|
|||
|
|
@ -40,8 +40,7 @@
|
|||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['car:car:add']"
|
||||
>新增
|
||||
</el-button>
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
|
|
@ -52,8 +51,7 @@
|
|||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
v-hasPermi="['car:car:edit']"
|
||||
>修改
|
||||
</el-button>
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
|
|
@ -64,8 +62,7 @@
|
|||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['car:car:remove']"
|
||||
>删除
|
||||
</el-button>
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
|
|
@ -75,22 +72,23 @@
|
|||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['car:car:export']"
|
||||
>导出
|
||||
</el-button>
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="carList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center"/>
|
||||
<el-table-column label="自增主键" align="center" prop="id"/>
|
||||
<el-table-column label="车辆VIN码" align="center" prop="carVin"/>
|
||||
<el-table-column label="车辆车牌号" align="center" prop="carPlate"/>
|
||||
<el-table-column label="车辆品牌" align="center" prop="carBrand"/>
|
||||
<el-table-column label="车辆型号" align="center" prop="carModel"/>
|
||||
<el-table-column label="车辆车型" align="center" prop="carType"/>
|
||||
<el-table-column label="围栏组编码" align="center" prop="groupCode"/>
|
||||
<el-table-column label="启用状态" align="center" prop="state"/>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="自增主键" align="center" prop="id" />
|
||||
<el-table-column label="车辆VIN码" align="center" prop="carVin" />
|
||||
<el-table-column label="车辆车牌号" align="center" prop="carPlate" />
|
||||
<el-table-column label="车辆品牌" align="center" prop="carBrand" />
|
||||
<el-table-column label="车辆型号" align="center" prop="carModel" />
|
||||
<el-table-column label="车辆车型" align="center" prop="carType" />
|
||||
<el-table-column label="围栏组编码" align="center" prop="groupCode" >
|
||||
|
||||
</el-table-column>
|
||||
<el-table-column label="启用状态" align="center" prop="state" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
|
|
@ -99,22 +97,29 @@
|
|||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['car:car:edit']"
|
||||
>修改
|
||||
</el-button>
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['car:car:remove']"
|
||||
>删除
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-s-order"
|
||||
@click="handleAddStrategy(scope.row)"
|
||||
>详细信息</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-plus"
|
||||
@click="addFenceGroupAddCarMiddle(scope.row.id)"
|
||||
>添加围栏组</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-plus" @click="selectBoundGFenceGroup(scope.row.id)">
|
||||
查询绑定的围栏组
|
||||
</el-button>
|
||||
<!-- <el-button-->
|
||||
<!-- size="mini"-->
|
||||
<!-- type="text"-->
|
||||
<!-- icon="el-icon-s-order"-->
|
||||
<!-- @click="handleAddStrategy(scope.row)"-->
|
||||
<!-- >详细信息</el-button>-->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -128,20 +133,24 @@
|
|||
/>
|
||||
|
||||
<!-- 添加或修改车辆基础信息对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-dialog :title="title" :visible.sync="open" width="650px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="82px">
|
||||
<el-form-item label="车辆VIN码" prop="carVin">
|
||||
<el-input v-model="form.carVin" placeholder="请输入车辆VIN码"/>
|
||||
<el-input v-model="form.carVin" placeholder="请输入车辆VIN码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="车辆车牌号" prop="carPlate">
|
||||
<el-input v-model="form.carPlate" placeholder="请输入车辆车牌号"/>
|
||||
<el-input v-model="form.carPlate" placeholder="请输入车辆车牌号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="车辆品牌" prop="carBrand">
|
||||
<el-input v-model="form.carBrand" placeholder="请输入车辆品牌"/>
|
||||
<el-input v-model="form.carBrand" placeholder="请输入车辆品牌" />
|
||||
</el-form-item>
|
||||
<el-form-item label="车辆型号" prop="carModel">
|
||||
<el-input v-model="form.carModel" placeholder="请输入车辆型号"/>
|
||||
<el-input v-model="form.carModel" placeholder="请输入车辆型号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="车辆车型" prop="carType">
|
||||
<el-input v-model="form.carType" placeholder="请输入车辆车型" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="车辆车型" prop="carType">
|
||||
<el-select v-model="form.carType" placeholder="请选择报文模版id" :change="getCarTypeList">
|
||||
<el-option
|
||||
|
|
@ -152,39 +161,151 @@
|
|||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="围栏组编码" prop="groupCode">
|
||||
<el-input v-model="form.groupCode" placeholder="请输入围栏组编码"/>
|
||||
<el-input v-model="form.groupCode" placeholder="请输入围栏组编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="启用状态" prop="state">
|
||||
<el-input v-model="form.state" placeholder="请输入启用状态"/>
|
||||
<el-input v-model="form.state" placeholder="请输入启用状态" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"/>
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="策略信息" prop="strategyId">
|
||||
<el-select v-model="form.msgId" placeholder="请选择报文模版id">
|
||||
<el-option
|
||||
v-for="item in strategyList"
|
||||
:key="item.id"
|
||||
:label="item.strategyName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</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>
|
||||
|
||||
<!-- 添加预警策略对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="beginOpen" width="500px" append-to-body>
|
||||
<el-form ref="formList" :model="formList" :rules="rules" label-width="80px">
|
||||
<el-form-item label="车辆类型id" prop="carTypeId">
|
||||
<el-input v-model="formList.carTypeId" placeholder="请输入车辆类型id" />
|
||||
</el-form-item>
|
||||
<el-form-item label="策略名称" prop="strategyName">
|
||||
<el-input v-model="formList.strategyName" placeholder="请输入策略名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="报文模版id" prop="msgId">
|
||||
<!-- <el-input v-model="formList.msgId" placeholder="请输入报文模版id" />-->
|
||||
<el-select v-model="formList.msgId" placeholder="请选择报文模版id">
|
||||
<el-option
|
||||
v-for="item in templateList"
|
||||
:key="item.messageTemplateId"
|
||||
:label="item.messageTemplateName"
|
||||
:value="item.messageTemplateId">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitAddForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 围栏组的添加 -->
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="dialogVisible"
|
||||
width="50%"
|
||||
:before-close="handleClose">
|
||||
<template>
|
||||
<el-table ref="multipleTable"
|
||||
:data="fenceGroup"
|
||||
tooltip-effect="dark"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChanges">
|
||||
|
||||
<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.groupId }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="名称" width="180">
|
||||
<template slot-scope="scope" >
|
||||
<span style="margin-left: 10px">{{ scope.row.groupName }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="状态" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
v-if="scope.row.groupStates ==0"
|
||||
v-model="groupStates"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
<el-switch
|
||||
v-if="scope.row.groupStates ==1"
|
||||
v-model="groupStatestwo"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
</el-table>
|
||||
</template>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="AddFenceGroupAddCar">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 查询绑定的围栏组 -->
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="dialogVisibleBound"
|
||||
width="30%"
|
||||
:before-close="handleClose">
|
||||
<el-table :data="boundGFenceGroup" style="width: 100%">
|
||||
<el-table-column label="id" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span style="margin-left: 10px">{{ scope.row.groupId }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="名称" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span style="margin-left: 10px">{{ scope.row.groupName }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisibleBound = false">取 消</el-button>
|
||||
<el-button type="primary" @click="dialogVisibleBound = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {listCar, getCar, delCar, addCar, updateCar} from "/src/api/car/car";
|
||||
import {addStrategy, listStrategy} from "@/api/platform/strategy";
|
||||
import {listType} from "@/api/car/type";
|
||||
import {templateList} from "@/api/car/message/template";
|
||||
import {addStrategy} from "@/api/platform/strategy";
|
||||
import {
|
||||
addFenceGroup,
|
||||
AddFenceGroupAddCar,
|
||||
addFenceGroupAddCarMiddle,
|
||||
group,
|
||||
selectBoundGFenceGroup
|
||||
} from '@/api/electronic'
|
||||
import { listType } from '@/api/system/dict/type'
|
||||
|
||||
export default {
|
||||
name: "Car",
|
||||
|
|
@ -194,6 +315,8 @@ export default {
|
|||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
//车辆类型
|
||||
sysCarType: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
|
|
@ -204,14 +327,12 @@ export default {
|
|||
total: 0,
|
||||
// 车辆基础信息表格数据
|
||||
carList: [],
|
||||
templateList: [],
|
||||
//车辆类型
|
||||
sysCarType: [],
|
||||
templateList:[],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
beginOpen: false,
|
||||
beginOpen:false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
|
|
@ -224,41 +345,50 @@ export default {
|
|||
state: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
carVin: null,
|
||||
carPlate: null,
|
||||
carBrand: null,
|
||||
carModel: null,
|
||||
carType: null,
|
||||
groupCode: null,
|
||||
state: null,
|
||||
remark: null,
|
||||
msgId: null
|
||||
},
|
||||
formList: {},
|
||||
form: {},
|
||||
formList:{},
|
||||
// 表单校验
|
||||
rules: {}
|
||||
rules: {
|
||||
},
|
||||
/* 多选围栏组 */
|
||||
multipleSelections: [],
|
||||
//围栏组
|
||||
fenceGroup:[],
|
||||
//开关
|
||||
groupStatestwo:false,
|
||||
groupStates:true,
|
||||
//围栏组列表
|
||||
dialogVisible:false,
|
||||
//车辆id
|
||||
carid:'',
|
||||
//绑定的围栏组
|
||||
boundGFenceGroup:[],
|
||||
//绑定的围栏组对话框
|
||||
dialogVisibleBound:false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.getListType();
|
||||
this.group()
|
||||
this.getListType()
|
||||
},
|
||||
methods: {
|
||||
/** 查询车辆基础信息列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listCar(this.queryParams).then(response => {
|
||||
this.carList = response.data.rows;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/* 车辆类型表 */
|
||||
getListType() {
|
||||
listType().then(res => {
|
||||
this.sysCarType = res.data.rows;
|
||||
})
|
||||
},
|
||||
/** 查询车辆基础信息列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listCar(this.queryParams).then(response => {
|
||||
console.log(response)
|
||||
this.carList = response.data.rows
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
|
|
@ -285,7 +415,7 @@ export default {
|
|||
},
|
||||
//初始化
|
||||
init() {
|
||||
this.formList = {
|
||||
this.formList= {
|
||||
carTypeId: null,
|
||||
strategyName: null,
|
||||
msgId: null
|
||||
|
|
@ -305,7 +435,7 @@ export default {
|
|||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length !== 1
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
|
|
@ -314,11 +444,19 @@ export default {
|
|||
this.open = true;
|
||||
this.title = "添加车辆基础信息";
|
||||
},
|
||||
/** 离焦获取策略信息 **/
|
||||
getCarTypeList(carType) {
|
||||
listStrategy({sysTypeId: carType}).then(res => {
|
||||
this.strategyList = res.data;
|
||||
})
|
||||
/** 添加策略信息按钮 **/
|
||||
handleAddStrategy(row) {
|
||||
this.init();
|
||||
const id = row.id || this.ids
|
||||
getCar(id).then(response => {
|
||||
this.formList.carTypeId = response.data.id;
|
||||
this.beginOpen = true;
|
||||
this.title ="添加策略信息";
|
||||
});
|
||||
templateList().then(response => {
|
||||
this.templateList = response.data;
|
||||
console.log(this.templateList);
|
||||
});
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
|
|
@ -328,14 +466,8 @@ export default {
|
|||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改车辆基础信息";
|
||||
this.listStrategy(response.data.carType)
|
||||
});
|
||||
},
|
||||
listStrategy(sysTypeId) {
|
||||
listStrategy({sysTypeId: sysTypeId}).then(res => {
|
||||
this.strategyList = res.data.rows;
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
|
|
@ -356,24 +488,73 @@ export default {
|
|||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** 添加策略信息**/
|
||||
submitAddForm(){
|
||||
addStrategy(this.formList).then(response => {
|
||||
this.$modal.msgSuccess("添加策略信息成功");
|
||||
this.beginOpen = false;
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$modal.confirm('是否确认删除车辆基础信息编号为"' + ids + '"的数据项？').then(function () {
|
||||
this.$modal.confirm('是否确认删除车辆基础信息编号为"' + ids + '"的数据项？').then(function() {
|
||||
return delCar(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
});
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('car/car/export', {
|
||||
...this.queryParams
|
||||
}, `car_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
},
|
||||
/* 多选框 选择围栏组数据 */
|
||||
handleSelectionChanges(val) {
|
||||
this.multipleSelections = val;
|
||||
},
|
||||
//围栏组列表
|
||||
group(){
|
||||
group().then(res=>{
|
||||
console.log(res)
|
||||
this.fenceGroup = res.data
|
||||
})
|
||||
},
|
||||
/* 打开围栏组和车辆中间表对话框 */
|
||||
addFenceGroupAddCarMiddle(id){
|
||||
this.dialogVisible = true
|
||||
this.carid = id
|
||||
|
||||
},
|
||||
/* 添加围栏组和车辆中间表 */
|
||||
AddFenceGroupAddCar(){
|
||||
AddFenceGroupAddCar(this.carid,this.multipleSelections).then(res=>{
|
||||
if (200 == res.code){
|
||||
this.$message.success("成功")
|
||||
this.dialogVisible = false
|
||||
}
|
||||
})
|
||||
},
|
||||
/* 查询绑定的围栏组 */
|
||||
selectBoundGFenceGroup(ids){
|
||||
this.dialogVisibleBound = true
|
||||
selectBoundGFenceGroup(ids).then(res=>{
|
||||
console.log(res)
|
||||
this.boundGFenceGroup = res.data
|
||||
})
|
||||
},
|
||||
handleClose(done) {
|
||||
this.$confirm('确认关闭？')
|
||||
.then(_ => {
|
||||
done();
|
||||
})
|
||||
.catch(_ => {});
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,397 @@
|
|||
<template>
|
||||
<!-- 控制按钮组 -->
|
||||
<div class="main">
|
||||
|
||||
<section class="section">
|
||||
{{this.paths}}
|
||||
<!-- 地图 -->
|
||||
<div id="map_container" style="width: 100%; height: 100vh;"></div>
|
||||
|
||||
<!-- 控制按钮组 -->
|
||||
<div class="ebox">
|
||||
<el-button-group>
|
||||
<el-button v-if="this.testId==0" type="info" icon="el-icon-circle-plus-outline" @click="drawRectangle">绘制围栏</el-button>
|
||||
<el-button v-if="this.testId!=0" 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>
|
||||
<!-- Form -->
|
||||
|
||||
<el-dialog title="新增围栏" :visible.sync="dialogFormVisible">
|
||||
<el-form :model="carFence">
|
||||
<el-form-item label="围栏名称" :label-width="formLabelWidth">
|
||||
<el-input v-model="carFence.name" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="围栏类型" :label-width="formLabelWidth">
|
||||
<el-select v-model="carFence.clazzId" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in type"
|
||||
:key="item.clazzId"
|
||||
:label="item.clazzName"
|
||||
:value="item.clazzId">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="围栏类型" :label-width="formLabelWidth">
|
||||
<el-select v-model="carFence.typeId" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in clazz"
|
||||
:key="item.typeId"
|
||||
:label="item.typeName"
|
||||
:value="item.typeId">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="围栏经纬度" :label-width="formLabelWidth">
|
||||
<el-input v-model="carFence.fenceText" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="围栏开始时间" :label-width="formLabelWidth">
|
||||
|
||||
<div class="block">
|
||||
<el-date-picker
|
||||
v-model="carFence.fenceStart"
|
||||
type="datetime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="围栏结束时间" :label-width="formLabelWidth">
|
||||
|
||||
<div class="block">
|
||||
<el-date-picker
|
||||
v-model="carFence.fenceEnd"
|
||||
type="datetime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="选择日期时间">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" :label-width="formLabelWidth">
|
||||
|
||||
<div class="block">
|
||||
<el-date-picker
|
||||
v-model="carFence.fenceCreate"
|
||||
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="addCarFence">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AMapLoader from '@amap/amap-jsapi-loader'
|
||||
import { geofenceList } from '@/api/manage/fenceAPI.js'
|
||||
import { addCarFence, clazzList, typeList, group, addMiddle } from '@/api/electronic' //获取围栏数据
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: "4f3846d5cf6d8f35fbddff03827111c5",
|
||||
};
|
||||
|
||||
export default {
|
||||
name: "MapContainer",
|
||||
data() {
|
||||
return {
|
||||
multipleSelection: [],
|
||||
form:{},
|
||||
fenceGroup:[],
|
||||
type:[],
|
||||
clazz:[],
|
||||
carFence:{
|
||||
fenceText:'',
|
||||
},
|
||||
carFences:[],
|
||||
formData: {
|
||||
testId:0,
|
||||
carId: '',
|
||||
pageNum: 1,//当前页
|
||||
pageSize: 10,//页长
|
||||
pageTotal: 0,//总数
|
||||
},
|
||||
|
||||
map: null,
|
||||
centerArr: [113.760234, 23.048884],//地图中心位置，不能为空数组【为空数组会报错】
|
||||
path: [],//以前绘制的数据
|
||||
paths: [], // 当前绘制的多边形经纬度数组
|
||||
test: [], // 当前绘制的多边形经纬度数组
|
||||
polygonItem: [], // 地图上绘制的所有多边形对象
|
||||
polyEditors: [],// 新增数据=>所有编辑对象数组
|
||||
polyEditorsBefore: [],// 以前历史数据=>进入编辑对象数组
|
||||
dialogFormVisible: false,
|
||||
formLabelWidth:'120px',
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.initAMap();
|
||||
this.init();
|
||||
|
||||
},
|
||||
created(){
|
||||
|
||||
this.testId = this.$route.params.Id;
|
||||
this.clazzList()
|
||||
this.typeList()
|
||||
this.group();
|
||||
// console.log(this.testId)
|
||||
},
|
||||
methods: {
|
||||
//禁用
|
||||
forbidden(){
|
||||
|
||||
},
|
||||
//围栏组列表
|
||||
group(){
|
||||
group().then(res=>{
|
||||
// console.log(res)
|
||||
this.fenceGroup = res.data
|
||||
})
|
||||
},
|
||||
clazzList(){
|
||||
clazzList().then(res=>{
|
||||
this.type = res.data
|
||||
})
|
||||
},
|
||||
typeList(){
|
||||
typeList().then(res=>{
|
||||
this.clazz = res.data
|
||||
})
|
||||
},
|
||||
initAMap() {
|
||||
AMapLoader.load({
|
||||
key: "d617205580ad1f43884deefb6ea53eb2",
|
||||
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
|
||||
// this.paths = path.toString() //将新增数据放入paths数组里
|
||||
// This.editRectangle();//绘制完成,默认进入编辑状态
|
||||
This.polygonItem.push(event.obj);
|
||||
// console.log(9999,this.paths)
|
||||
// sessionStorage.setItem("paths","")
|
||||
// sessionStorage.setItem("paths",path.toString());
|
||||
|
||||
// This.map.remove(event.obj); // 删除多边形
|
||||
// console.log(polygon, '------polygon-----');
|
||||
console.log(paths);//控制台打印坐标
|
||||
});
|
||||
},
|
||||
// 编辑围栏
|
||||
editRectangle() {
|
||||
console.log(2,this.paths)
|
||||
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);
|
||||
console.log(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(); });//历史
|
||||
},
|
||||
//添加围栏
|
||||
addCarFence(){
|
||||
addCarFence(this.carFence).then(res=>{
|
||||
// console.log(this.carFence)
|
||||
this.$modal.msgSuccess("成功");
|
||||
this.dialogFormVisible = false
|
||||
})
|
||||
|
||||
},
|
||||
//保存围栏
|
||||
saveRectangle() {
|
||||
|
||||
// let item1 = sessionStorage.getItem("paths")
|
||||
// console.log(9,paths)
|
||||
this.carFence.fenceCreate = new Date().toLocaleString()
|
||||
var s = JSON.stringify(this.paths)
|
||||
this.carFence.fenceText=s
|
||||
console.log(this.carFence.fenceText)
|
||||
// 取消编辑状态
|
||||
this.polyEditors.forEach(item => { item.close(); });
|
||||
this.polyEditorsBefore.forEach(item => { item.close(); });
|
||||
this.dialogFormVisible = true
|
||||
// 保存 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>
|
||||
|
|
@ -0,0 +1,366 @@
|
|||
<template>
|
||||
<div>
|
||||
<template>
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<!-- <el-form-item label="活动名称">-->
|
||||
<!-- <el-input v-model="form.name"></el-input>-->
|
||||
<!-- </el-form-item>-->
|
||||
</el-form>
|
||||
|
||||
<el-button type="primary" @click="toAddFenceGroup">添加围栏组</el-button>
|
||||
|
||||
<!--围栏组列表-->
|
||||
<el-table :data="fenceGroup" tooltip-effect="dark" style="width: 100%">
|
||||
|
||||
|
||||
<el-table-column label="id" width="180" >
|
||||
<template slot-scope="scope">
|
||||
<span style="margin-left: 10px">{{ scope.row.groupId }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="名称" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span style="margin-left: 10px">{{ scope.row.groupName }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="状态" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
v-if="scope.row.groupStates ==0"
|
||||
v-model="groupStates"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
<el-switch
|
||||
v-if="scope.row.groupStates ==1"
|
||||
v-model="groupStatestwo"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" @click="updateFenceGroupById(scope.row.groupId)" v-if="scope.row.groupStates ==0">禁用</el-button>
|
||||
<el-button size="mini" @click="activate(scope.row.groupId)" v-if="scope.row.groupStates ==1">启动</el-button>
|
||||
<el-button size="mini" @click="addGroup(scope.row.groupId)" v-if="scope.row.groupStates ==0">添加围栏</el-button>
|
||||
<el-button size="mini" @click="BoundFence(scope.row.groupId)" v-if="scope.row.groupStates ==0">查看绑定的围栏</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</template>
|
||||
<!--多对多的添加-->
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="dialogVisible"
|
||||
width="85%"
|
||||
:before-close="handleClose">
|
||||
|
||||
<template>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="carFence"
|
||||
tooltip-effect="dark"
|
||||
:style="{width: tableWidth}" @selection-change="handleSelectionChange">
|
||||
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="围栏主键">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="业务类型">
|
||||
<template slot-scope="scope">{{ scope.row.clazzName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏类型">
|
||||
<template slot-scope="scope">{{ scope.row.typeName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏开始时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceCreate }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏结束时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceEnd }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="创建时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceStart }}</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="addMiddls">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!--//围栏组添加-->
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="dialogVisibles"
|
||||
width="85%"
|
||||
:before-close="handleClose">
|
||||
|
||||
<el-form ref="form" :model="fenceGroupAdd" label-width="100px">
|
||||
<el-form-item label="围栏组名称">
|
||||
<el-input v-model="fenceGroupAdd.groupName"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="围栏组状态">
|
||||
<el-switch
|
||||
v-model="fenceGroupAdd.groupStates"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
|
||||
|
||||
</el-form>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisibles = false">取 消</el-button>
|
||||
<el-button type="primary" @click="doAddFenceGroup">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!--已经绑定的围栏-->
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="dialogVisibless"
|
||||
width="85%"
|
||||
:before-close="handleClose">
|
||||
<template>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="carFences"
|
||||
tooltip-effect="dark"
|
||||
:style="{width: tableWidth}">
|
||||
|
||||
<el-table-column
|
||||
label="围栏主键">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="围栏名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="业务类型">
|
||||
<template slot-scope="scope">{{ scope.row.clazzName }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="围栏类型">
|
||||
<template slot-scope="scope">{{ scope.row.typeName }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="围栏开始时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceCreate }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="围栏结束时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceEnd }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceStart }}</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisibless = false">取 消</el-button>
|
||||
<el-button type="primary" @click="dialogVisibless = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
|
||||
//例如：import 《组件名称》 from '《组件路径》,
|
||||
import {
|
||||
activate,
|
||||
addFenceGroup,
|
||||
addFenceGroupMidddle, BoundFenceGroup,
|
||||
group,
|
||||
selectCarFenceList,
|
||||
updateFenceGroupById
|
||||
} from '@/api/electronic'
|
||||
import log from '@/views/monitor/job/log.vue'
|
||||
|
||||
export default {
|
||||
//import引入的组件需要注入到对象中才能使用"
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
//这里存放数据"
|
||||
|
||||
return {
|
||||
//绑定的围栏列表
|
||||
carFences:[],
|
||||
|
||||
groupStates:true,
|
||||
groupStatestwo:false,
|
||||
fenceGroupAdd:{
|
||||
groupStates:true
|
||||
},
|
||||
fenceGroup:[],
|
||||
dialogVisible: false,
|
||||
dialogVisibles: false,
|
||||
dialogVisibless: false,
|
||||
carFence:[],
|
||||
form:{},
|
||||
multipleSelection: [],
|
||||
fenceGroupId:'',
|
||||
};
|
||||
},
|
||||
//计算属性 类似于data概念",
|
||||
computed: {},
|
||||
//监控data中的数据变化",
|
||||
watch: {},
|
||||
//方法集合",
|
||||
methods: {
|
||||
//根据围栏组的id查询绑定的围栏的中间表 并 获取围栏组绑定的围栏列表
|
||||
BoundFence(groupId){
|
||||
this.dialogVisibless = true
|
||||
BoundFenceGroup(groupId).then(res=>{
|
||||
|
||||
this.carFences=res.data
|
||||
})
|
||||
},
|
||||
//启动围栏状态
|
||||
activate(groupId){
|
||||
activate(groupId).then(res=>{
|
||||
if (200 == res.code){
|
||||
this.$message.success("成功")
|
||||
this.group()
|
||||
}
|
||||
})
|
||||
},
|
||||
//修改围栏状态
|
||||
updateFenceGroupById(groupId){
|
||||
updateFenceGroupById(groupId).then(res=>{
|
||||
if (200 == res.code){
|
||||
this.$message.success("成功")
|
||||
this.group()
|
||||
}
|
||||
})
|
||||
},
|
||||
//多对多添加
|
||||
addMiddls(){
|
||||
addFenceGroupMidddle(this.fenceGroupId,this.multipleSelection).then(res=>{
|
||||
this.$modal.msgSuccess("成功");
|
||||
this.dialogVisible = false
|
||||
this.selectCarFenceList();
|
||||
})
|
||||
},
|
||||
//添加围栏组
|
||||
doAddFenceGroup(){
|
||||
if (this.fenceGroupAdd.groupStates = true){
|
||||
this.fenceGroupAdd.groupStates = 0
|
||||
}else {
|
||||
this.fenceGroupAdd.groupStates = 1
|
||||
}
|
||||
// console.log(this.fenceGroupAdd.groupStates)
|
||||
addFenceGroup(this.fenceGroupAdd).then(res=>{
|
||||
if (200 == res.code ){
|
||||
this.$message.success("成功");
|
||||
this.dialogVisibles=false
|
||||
this.group()
|
||||
}
|
||||
})
|
||||
},
|
||||
//开启围栏组添加对话框
|
||||
toAddFenceGroup(){
|
||||
this.dialogVisibles=true
|
||||
|
||||
},
|
||||
//获取围栏组的id
|
||||
addGroup(id){
|
||||
this.multipleSelection = []
|
||||
this.fenceGroupId = id
|
||||
this.dialogVisible = true
|
||||
},
|
||||
//获取围栏的Id值 多对多
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
|
||||
},
|
||||
//围栏组列表
|
||||
group(){
|
||||
group().then(res=>{
|
||||
// console.log(res)
|
||||
this.fenceGroup = res.data
|
||||
})
|
||||
},
|
||||
handleClose(done) {
|
||||
this.$confirm('确认关闭？')
|
||||
.then(_ => {
|
||||
done();
|
||||
})
|
||||
.catch(_ => {});
|
||||
},
|
||||
//围栏列表
|
||||
selectCarFenceList(){
|
||||
selectCarFenceList(this.form).then(res=>{
|
||||
this.carFence=res.data.records
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
//生命周期 - 创建完成（可以访问当前this实例）",
|
||||
created() {
|
||||
this.group()
|
||||
this.selectCarFenceList();
|
||||
},
|
||||
//生命周期 - 挂载完成（可以访问DOM元素）",
|
||||
mounted() {
|
||||
},
|
||||
beforeCreate() {
|
||||
}, //生命周期 - 创建之前",
|
||||
beforeMount() {
|
||||
}, //生命周期 - 挂载之前",
|
||||
beforeUpdate() {
|
||||
}, //生命周期 - 更新之前",
|
||||
updated() {
|
||||
}, //生命周期 - 更新之后",
|
||||
beforeDestroy() {
|
||||
}, //生命周期 - 销毁之前",
|
||||
destroyed() {
|
||||
}, //生命周期 - 销毁完成",
|
||||
activated() {
|
||||
} //如果页面有keep-alive缓存功能，这个函数会触发",
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,202 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form-item label="活动名称">
|
||||
<el-input v-model="form.name"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<router-link :to="'/carFence/fence-MapContainer/'+0" class="link-type">
|
||||
<span>添加围栏</span>
|
||||
</router-link>
|
||||
|
||||
<template>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="carFence"
|
||||
tooltip-effect="dark"
|
||||
:style="{width: tableWidth}">
|
||||
<el-table-column>
|
||||
<!-- <el-button @click="show = !show">Click Me</el-button>-->
|
||||
<!-- <div style="display: flex; margin-top: 20px; height: 100px;">-->
|
||||
<!-- <transition name="el-fade-in-linear">-->
|
||||
<!-- <div v-show="show" class="transition-box">.el-fade-in-linear</div>-->
|
||||
<!-- </transition>-->
|
||||
<!-- </div>-->
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏主键">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="业务类型">
|
||||
<template slot-scope="scope">{{ scope.row.clazzName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏类型">
|
||||
<template slot-scope="scope">{{ scope.row.typeName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏开始时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceCreate }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="围栏结束时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceEnd }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="创建时间">
|
||||
<template slot-scope="scope">{{ scope.row.fenceStart }}</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column-->
|
||||
<!-- label="中间ID"-->
|
||||
<!-- width="120">-->
|
||||
<!-- <template slot-scope="scope">{{ scope.row.date }}</template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column
|
||||
label="操作">
|
||||
<template slot-scope="scope">
|
||||
<!-- <el-button v-hasPermi="['carFence:fence-MapContainer:MapContainer']"-->
|
||||
<!-- icon="el-icon-s-platform"-->
|
||||
<!-- size="mini"-->
|
||||
<!-- type="text">-->
|
||||
<router-link :to="'/carFence/fence-MapContainer/'+scope.row.id" class="link-type">
|
||||
<span>查看地图</span>
|
||||
</router-link>
|
||||
<el-button type="text" @click="addCarList(scope.row)">绑定车辆</el-button>
|
||||
<!-- </el-button>-->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
<!-- Form -->
|
||||
|
||||
|
||||
<el-dialog title="收货地址" :visible.sync="dialogFormVisible">
|
||||
<el-form :model="carMiddle">
|
||||
|
||||
<el-form-item label="车辆名称" :label-width="formLabelWidth">
|
||||
<!-- <el-input v-model="form.name" autocomplete="off"></el-input>-->
|
||||
<div v-for="car in carInformationIdAndLicensePlate" :key="car.id">
|
||||
<input
|
||||
type="checkbox"
|
||||
:id="`checkbox-${car.id}`"
|
||||
:value="car.id"
|
||||
v-model="selectedCarIds"
|
||||
@change="handleSelectionChange"
|
||||
>
|
||||
<label :for="`checkbox-${car.id}`">{{ car.name }}</label>
|
||||
</div>
|
||||
<!-- 显示选中的用户 -->
|
||||
<div>{{ selectedCarIds }}</div>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="carAddList">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
|
||||
//例如：import 《组件名称》 from '《组件路径》,
|
||||
import { carAddList, selectCarFenceList, selectCarInformationIdAndLicensePlate } from '@/api/electronic'
|
||||
|
||||
export default {
|
||||
//import引入的组件需要注入到对象中才能使用"
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
//这里存放数据"
|
||||
|
||||
return {
|
||||
carMiddle:{},
|
||||
carInformationIdAndLicensePlate:[],
|
||||
// 用于存储选中的用户ID
|
||||
selectedCarIds: [],
|
||||
dialogFormVisible: false,
|
||||
formLabelWidth: '120px',
|
||||
show: true,
|
||||
form:{},
|
||||
carFence:[],
|
||||
tableWidth: '100%',
|
||||
}
|
||||
},
|
||||
//计算属性 类似于data概念",
|
||||
computed: {},
|
||||
//监控data中的数据变化",
|
||||
watch: {},
|
||||
//方法集合",
|
||||
methods: {
|
||||
carAddList,
|
||||
handleSelectionChange(val) {
|
||||
this.selectedCarIds = val;
|
||||
},
|
||||
selectCarFenceList(){
|
||||
selectCarFenceList(this.form).then(res=>{
|
||||
this.carFence=res.data.records
|
||||
})
|
||||
},
|
||||
addCarList(row){
|
||||
this.carMiddle.carFenceId = row.id
|
||||
this.dialogFormVisible=true
|
||||
},
|
||||
carList(){
|
||||
carAddList(this.carMiddle).then(res=>{
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.dialogFormVisible=false
|
||||
})
|
||||
},
|
||||
/* 调用车辆信息 */
|
||||
selectCarInformationIdAndLicensePlate(){
|
||||
selectCarInformationIdAndLicensePlate().then(res=>{
|
||||
this.carInformationIdAndLicensePlate=res.data
|
||||
})
|
||||
}
|
||||
},
|
||||
//生命周期 - 创建完成（可以访问当前this实例）",
|
||||
created() {
|
||||
this.selectCarFenceList();
|
||||
// this.selectCarInformationIdAndLicensePlate();
|
||||
},
|
||||
//生命周期 - 挂载完成（可以访问DOM元素）",
|
||||
mounted() {
|
||||
},
|
||||
beforeCreate() {
|
||||
}, //生命周期 - 创建之前",
|
||||
beforeMount() {
|
||||
}, //生命周期 - 挂载之前",
|
||||
beforeUpdate() {
|
||||
}, //生命周期 - 更新之前",
|
||||
updated() {
|
||||
}, //生命周期 - 更新之后",
|
||||
beforeDestroy() {
|
||||
}, //生命周期 - 销毁之前",
|
||||
destroyed() {
|
||||
}, //生命周期 - 销毁完成",
|
||||
activated() {
|
||||
} //如果页面有keep-alive缓存功能，这个函数会触发",
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.transition-box {
|
||||
margin-bottom: 10px;
|
||||
width: 200px;
|
||||
height: 100px;
|
||||
border-radius: 4px;
|
||||
background-color: #409EFF;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
padding: 40px 20px;
|
||||
box-sizing: border-box;
|
||||
margin-right: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -2,17 +2,6 @@
|
|||
<div class="login">
|
||||
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
|
||||
<h3 class="title">若依后台管理系统</h3>
|
||||
<el-form-item prop="firmId">
|
||||
<el-select v-model="loginForm.firmId" placeholder="请选择公司" style="width: 350px">
|
||||
<el-option
|
||||
v-for="item in firmList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="user"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="username">
|
||||
<el-input
|
||||
v-model="loginForm.username"
|
||||
|
|
@ -61,7 +50,7 @@
|
|||
<span v-else>登 录 中...</span>
|
||||
</el-button>
|
||||
<div v-if="register" style="float: right;">
|
||||
<router-link :to="'/register'" class="link-type">立即注册</router-link>
|
||||
<router-link :to="'/register'" class="link-type">企业注册</router-link>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
|
@ -76,13 +65,11 @@
|
|||
import {getCodeImg} from "@/api/login";
|
||||
import Cookies from "js-cookie";
|
||||
import {decrypt, encrypt} from '@/utils/jsencrypt'
|
||||
import { firmList } from '@/api/system/firm'
|
||||
|
||||
export default {
|
||||
name: "Login",
|
||||
data() {
|
||||
return {
|
||||
firmList: [],
|
||||
codeUrl: "",
|
||||
loginForm: {
|
||||
username: "admin",
|
||||
|
|
@ -119,15 +106,8 @@ export default {
|
|||
created() {
|
||||
this.getCode();
|
||||
this.getCookie();
|
||||
this.getFirmList();
|
||||
},
|
||||
methods: {
|
||||
getFirmList(){
|
||||
firmList().then(response => {
|
||||
this.firmList = response.data;
|
||||
console.log(this.firmList)
|
||||
})
|
||||
},
|
||||
getCode() {
|
||||
getCodeImg().then(res => {
|
||||
this.captchaEnabled = res.data.captchaEnabled === undefined ? true : res.data.captchaEnabled;
|
||||
|
|
|
|||
|
|
@ -1,364 +0,0 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="车辆vin码" prop="vin">
|
||||
<el-input
|
||||
v-model="queryParams.vin"
|
||||
placeholder="请输入车辆vin码"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="规则id" prop="warnRuleId">
|
||||
<el-input
|
||||
v-model="queryParams.warnRuleId"
|
||||
placeholder="请输入规则id"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="开始时间" prop="startTime">
|
||||
<el-date-picker clearable
|
||||
v-model="queryParams.startTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择开始时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="结束时间" prop="endTime">
|
||||
<el-date-picker clearable
|
||||
v-model="queryParams.endTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择结束时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="最大值" prop="maxValue">
|
||||
<el-input
|
||||
v-model="queryParams.maxValue"
|
||||
placeholder="请输入最大值"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="最小值" prop="minValue">
|
||||
<el-input
|
||||
v-model="queryParams.minValue"
|
||||
placeholder="请输入最小值"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="平均值" prop="avgValue">
|
||||
<el-input
|
||||
v-model="queryParams.avgValue"
|
||||
placeholder="请输入平均值"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="中位数" prop="medianValue">
|
||||
<el-input
|
||||
v-model="queryParams.medianValue"
|
||||
placeholder="请输入中位数"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @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
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['platform:logs:add']"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
v-hasPermi="['platform:logs:edit']"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['platform:logs:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['platform:logs:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="logsList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="预警日志id" align="center" prop="id" />
|
||||
<el-table-column label="车辆vin码" align="center" prop="vin" />
|
||||
<el-table-column label="规则id" align="center" prop="warnRuleId" />
|
||||
<el-table-column label="开始时间" align="center" prop="startTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="结束时间" align="center" prop="endTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="最大值" align="center" prop="maxValue" />
|
||||
<el-table-column label="最小值" align="center" prop="minValue" />
|
||||
<el-table-column label="平均值" align="center" prop="avgValue" />
|
||||
<el-table-column label="中位数" align="center" prop="medianValue" />
|
||||
<el-table-column label="是否发送预警" align="center" prop="status" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['platform:logs:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['platform:logs:remove']"
|
||||
>删除</el-button>
|
||||
</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="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="车辆vin码" prop="vin">
|
||||
<el-input v-model="form.vin" placeholder="请输入车辆vin码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规则id" prop="warnRuleId">
|
||||
<el-input v-model="form.warnRuleId" placeholder="请输入规则id" />
|
||||
</el-form-item>
|
||||
<el-form-item label="开始时间" prop="startTime">
|
||||
<el-date-picker clearable
|
||||
v-model="form.startTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择开始时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="结束时间" prop="endTime">
|
||||
<el-date-picker clearable
|
||||
v-model="form.endTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择结束时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="最大值" prop="maxValue">
|
||||
<el-input v-model="form.maxValue" placeholder="请输入最大值" />
|
||||
</el-form-item>
|
||||
<el-form-item label="最小值" prop="minValue">
|
||||
<el-input v-model="form.minValue" placeholder="请输入最小值" />
|
||||
</el-form-item>
|
||||
<el-form-item label="平均值" prop="avgValue">
|
||||
<el-input v-model="form.avgValue" placeholder="请输入平均值" />
|
||||
</el-form-item>
|
||||
<el-form-item label="中位数" prop="medianValue">
|
||||
<el-input v-model="form.medianValue" 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 { listLogs, getLogs, delLogs, addLogs, updateLogs } from "/src/api/platform/logs";
|
||||
|
||||
export default {
|
||||
name: "Logs",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 预警日志表格数据
|
||||
logsList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
vin: null,
|
||||
warnRuleId: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
maxValue: null,
|
||||
minValue: null,
|
||||
avgValue: null,
|
||||
medianValue: null,
|
||||
status: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询预警日志列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listLogs(this.queryParams).then(response => {
|
||||
this.logsList = response.data.rows;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
vin: null,
|
||||
warnRuleId: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
maxValue: null,
|
||||
minValue: null,
|
||||
avgValue: null,
|
||||
medianValue: null,
|
||||
status: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加预警日志";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id || this.ids
|
||||
getLogs(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改预警日志";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id != null) {
|
||||
updateLogs(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addLogs(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$modal.confirm('是否确认删除预警日志编号为"' + ids + '"的数据项？').then(function() {
|
||||
return delLogs(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('platform/logs/export', {
|
||||
...this.queryParams
|
||||
}, `logs_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -1,395 +0,0 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="规则名称" prop="ruleName">
|
||||
<el-input
|
||||
v-model="queryParams.ruleName"
|
||||
placeholder="请输入规则名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="策略名称" prop="strategyId">
|
||||
<el-input
|
||||
v-model="queryParams.strategyId"
|
||||
placeholder="请输入策略id"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="滑窗时间" prop="slideTime">
|
||||
<el-input
|
||||
v-model="queryParams.slideTime"
|
||||
placeholder="请输入滑窗时间"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="滑窗频率" prop="slideFrequency">
|
||||
<el-input
|
||||
v-model="queryParams.slideFrequency"
|
||||
placeholder="请输入滑窗频率"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @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
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['platform:rule:add']"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
v-hasPermi="['platform:rule:edit']"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['platform:rule:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['platform:rule:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="ruleList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="规则id" align="center" prop="id" />
|
||||
<el-table-column label="规则名称" align="center" prop="ruleName" />
|
||||
<el-table-column label="策略id" align="center" prop="strategyId" />
|
||||
<el-table-column label="报文数据类型id" align="center" prop="msgTypeId" />
|
||||
<el-table-column label="滑窗时间" align="center" prop="slideTime" />
|
||||
<el-table-column label="滑窗频率" align="center" prop="slideFrequency" />
|
||||
<el-table-column label="数据频率名称" align="center" prop="slideData" />
|
||||
<el-table-column label="数据频率最大值" align="center" prop="slideMaxNum" />
|
||||
<el-table-column label="数据频率最小值" align="center" prop="slideMinNum" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['platform:rule:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['platform:rule:remove']"
|
||||
>删除</el-button>
|
||||
</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="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="策略名称" prop="strategyId">
|
||||
<el-select v-model="form.strategyId" placeholder="请选择策略模版id" @change="getFindByTemplateValue">
|
||||
<el-option
|
||||
v-for="item in strategyList"
|
||||
:key="item.id"
|
||||
:label="item.strategyName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="规则名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入规则名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="报文数据类型id" prop="msgTypeId">
|
||||
<el-select ref="select" v-model="form.msgTypeId" multiple placeholder="请选择报文数据名称">
|
||||
<el-option
|
||||
v-for="item in templateValueList"
|
||||
:key="item.messageId"
|
||||
:label="item.messageCode"
|
||||
:value="item.messageId">
|
||||
<el-checkbox @change="clickBox(item.messageId)" :value ="value.includes(item.messageId)" :label="item.messageCode"></el-checkbox>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="滑窗时间" prop="slideTime">
|
||||
<el-slider v-model="form.slideTime" :min="1" :max="1000"></el-slider>
|
||||
<el-input-number v-model="form.slideTime" :min="1" :max="1000"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="滑窗频率" prop="slideFrequency">
|
||||
<el-select v-model="form.slideFrequency" placeholder="请选择滑窗频率">
|
||||
<el-option value="1:2">1:2</el-option>
|
||||
<el-option value="1:5">1:5</el-option>
|
||||
<el-option value="1:10">1:10</el-option>
|
||||
<el-option value="1:20">1:20</el-option>
|
||||
<el-option value="1:30">1:30</el-option>
|
||||
<el-option value="1:60">1:60</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据频率名称" prop="slideData">
|
||||
<el-input v-model="form.slideData" placeholder="请输入数据频率名称" />
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item label="数据频率最大值" prop="slideMaxNum">
|
||||
<el-input v-model="form.slideMaxNum" placeholder="请输入数据频率最大值" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数据频率最小值" prop="slideMinNum">
|
||||
<el-input v-model="form.slideMinNum" 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 { listRule, getRule, delRule, addRule, updateRule } from "/src/api/platform/rule";
|
||||
import { listStrategy} from "@/api/platform/strategy";
|
||||
import {valueList} from "@/api/car/message/template";
|
||||
import item from "@/layout/components/Sidebar/Item.vue";
|
||||
|
||||
export default {
|
||||
name: "Rule",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
props: { multiple: true },
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 预警规则表格数据
|
||||
ruleList: [],
|
||||
//车辆类型
|
||||
sysTypeList :[],
|
||||
//报文字段
|
||||
templateValueList:[],
|
||||
value:[],
|
||||
//报文模版类型
|
||||
templateList :[],
|
||||
|
||||
//报文类型Id
|
||||
templateId : null,
|
||||
//车辆类型Id
|
||||
sysTypeId: null,
|
||||
//策略信息组
|
||||
strategyList : [],
|
||||
//策略信息
|
||||
strategy: {},
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
//弹出抽屉
|
||||
drawer:false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
ruleName: null,
|
||||
strategyId: null,
|
||||
msgTypeId: null,
|
||||
slideTime: null,
|
||||
slideFrequency: null,
|
||||
slideData:null,
|
||||
slideMaxNum: null,
|
||||
slideMinNum: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
|
||||
clickBox(val) {
|
||||
console.log('val::', val);
|
||||
let values = this.value
|
||||
if(values.includes(val)) {
|
||||
this.value = values.filter(n => n !== val)
|
||||
} else {
|
||||
values.push(val)
|
||||
this.value = values
|
||||
}
|
||||
console.log('this.value::', this.value)
|
||||
this.value.forEach((item,index)=>{
|
||||
// console.log("item:"+item);
|
||||
// console.log("index"+index);
|
||||
this.form.msgTypeId += ","+item;
|
||||
})
|
||||
console.log(this.form.msgTypeId.substring(1));
|
||||
|
||||
|
||||
|
||||
},
|
||||
/** 查询预警规则列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listRule(this.queryParams).then(response => {
|
||||
this.ruleList = response.data.rows;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
ruleName: null,
|
||||
strategyId: null,
|
||||
msgTypeId: null,
|
||||
slideTime: null,
|
||||
slideFrequency: null,
|
||||
slideData:null,
|
||||
slideMaxNum: null,
|
||||
slideMinNum: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加预警规则";
|
||||
this.findInformation();
|
||||
},
|
||||
findInformation(){
|
||||
/** 策略信息 **/
|
||||
listStrategy().then(res=>{
|
||||
this.strategyList = res.data.rows;
|
||||
})
|
||||
},
|
||||
|
||||
getFindByTemplateValue(val){
|
||||
const { msgId } = this.strategyList.find(strategy => strategy.id === val)
|
||||
valueList({messageTemplateId:msgId}).then(res=>{
|
||||
this.templateValueList = res.data
|
||||
})
|
||||
},
|
||||
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id || this.ids
|
||||
getRule(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改预警规则";
|
||||
});
|
||||
this.findInformation();
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id != null) {
|
||||
updateRule(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addRule(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$modal.confirm('是否确认删除预警规则编号为"' + ids + '"的数据项？').then(function() {
|
||||
return delRule(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('platform/rule/export', {
|
||||
...this.queryParams
|
||||
}, `rule_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -1,309 +0,0 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="车辆类型id" prop="carTypeId">
|
||||
<el-input
|
||||
v-model="queryParams.carTypeId"
|
||||
placeholder="请输入车辆类型id"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="策略名称" prop="strategyName">
|
||||
<el-input
|
||||
v-model="queryParams.strategyName"
|
||||
placeholder="请输入策略名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="报文模版id" prop="msgId">
|
||||
<el-input
|
||||
v-model="queryParams.msgId"
|
||||
placeholder="请输入报文模版id"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @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
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['platform:strategy:add']"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
v-hasPermi="['platform:strategy:edit']"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['platform:strategy:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['platform:strategy:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="strategyList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="策略id" align="center" prop="id" />
|
||||
<el-table-column label="车辆类型id" align="center" prop="sysTypeId" />
|
||||
<el-table-column label="策略名称" align="center" prop="strategyName" />
|
||||
<el-table-column label="报文模版id" align="center" prop="msgId" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['platform:strategy:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['platform:strategy:remove']"
|
||||
>删除</el-button>
|
||||
</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="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="车辆类型id" prop="sysTypeId">
|
||||
<el-select v-model="form.sysTypeId" placeholder="请选择报文模版id" @change="leaveSysType(form.sysTypeId)">
|
||||
<el-option
|
||||
v-for="item in sysTypeList"
|
||||
:key="item.sysTypeId"
|
||||
:label="item.sysTypeName"
|
||||
:value="item.sysTypeId">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="报文模版id" prop="msgId">
|
||||
<el-select v-model="form.msgId" placeholder="请选择报文模版id">
|
||||
<el-option
|
||||
v-for="item in templateList"
|
||||
:key="item.messageTemplateId"
|
||||
:label="item.messageTemplateName"
|
||||
:value="item.messageTemplateId">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="策略名称" prop="strategyName">
|
||||
<el-input v-model="form.strategyName" 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 { listStrategy, getStrategy, delStrategy, addStrategy, updateStrategy } from "/src/api/platform/strategy";
|
||||
import {getSysType} from "@/api/car/car";
|
||||
import {templateList} from "@/api/car/message/template";
|
||||
|
||||
export default {
|
||||
name: "Strategy",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 预警策略表格数据
|
||||
strategyList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
sysTypeId: null,
|
||||
strategyName: null,
|
||||
msgId: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {},
|
||||
//报文类型
|
||||
templateList :[],
|
||||
//车辆类型
|
||||
sysTypeList : []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 根据选中的车辆类型选择报文信息 **/
|
||||
leaveSysType(sysTypeId){
|
||||
this.templateList.messageTemplateId =sysTypeId;
|
||||
},
|
||||
/** 查询预警策略列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listStrategy(this.queryParams).then(response => {
|
||||
this.strategyList = response.data.rows;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
sysTypeId: null,
|
||||
strategyName: null,
|
||||
msgId: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加预警策略";
|
||||
this.findInformation();
|
||||
|
||||
},
|
||||
findInformation(){
|
||||
/** 获取车辆类型 **/
|
||||
getSysType().then(res=>{
|
||||
this.sysTypeList = res.data.rows;
|
||||
});
|
||||
/** 获取报文类型模版 **/
|
||||
templateList().then(res=>{
|
||||
this.templateList = res.data;
|
||||
})
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id || this.ids
|
||||
getStrategy(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改预警策略";
|
||||
});
|
||||
this.findInformation();
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.id != null) {
|
||||
updateStrategy(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addStrategy(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$modal.confirm('是否确认删除预警策略编号为"' + ids + '"的数据项？').then(function() {
|
||||
return delStrategy(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('platform/strategy/export', {
|
||||
...this.queryParams
|
||||
}, `strategy_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -1,47 +1,24 @@
|
|||
<template>
|
||||
<div class="register">
|
||||
<el-form ref="registerForm" :model="registerForm" :rules="registerRules" class="register-form">
|
||||
<h3 class="title">若依后台管理系统</h3>
|
||||
<el-form-item prop="username">
|
||||
<el-input v-model="registerForm.username" auto-complete="off" placeholder="账号" type="text">
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="user"/>
|
||||
</el-input>
|
||||
<h3 class="title">企业注册页面</h3>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.firmName" autocomplete="off" placeholder="企业名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input
|
||||
v-model="registerForm.password"
|
||||
auto-complete="off"
|
||||
placeholder="密码"
|
||||
type="password"
|
||||
@keyup.enter.native="handleRegister"
|
||||
>
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="password"/>
|
||||
</el-input>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.username" autocomplete="off" placeholder="企业登录账号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="confirmPassword">
|
||||
<el-input
|
||||
v-model="registerForm.confirmPassword"
|
||||
auto-complete="off"
|
||||
placeholder="确认密码"
|
||||
type="password"
|
||||
@keyup.enter.native="handleRegister"
|
||||
>
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="password"/>
|
||||
</el-input>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.password" autocomplete="off" placeholder="企业登录密码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="captchaEnabled" prop="code">
|
||||
<el-input
|
||||
v-model="registerForm.code"
|
||||
auto-complete="off"
|
||||
placeholder="验证码"
|
||||
style="width: 63%"
|
||||
@keyup.enter.native="handleRegister"
|
||||
>
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="validCode"/>
|
||||
</el-input>
|
||||
<div class="register-code">
|
||||
<img :src="codeUrl" class="register-code-img" @click="getCode"/>
|
||||
</div>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.nickName" autocomplete="off" placeholder="公司注册人"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.email" autocomplete="off" placeholder="企业邮箱"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.phonenumber" autocomplete="off" placeholder="企业电话"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item style="width:100%;">
|
||||
<el-button
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ module.exports = {
|
|||
proxy: {
|
||||
// detail: https://cli.vuejs.org/config/#devserver-proxy
|
||||
[process.env.VUE_APP_BASE_API]: {
|
||||
target: `http://localhost:18080`,
|
||||
target: `http://127.0.0.1:8080`,
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
['^' + process.env.VUE_APP_BASE_API]: ''
|
||||
|
|
|
|||
Loading…
Reference in New Issue