Compare commits
138 Commits
589a1eafed
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| 9ddb412b7a | |||
| 1c9c5ab639 | |||
| d6675050e6 | |||
| ee50e38292 | |||
| 29752a70af | |||
| 1307e1bddf | |||
| 0ff3e4b1bc | |||
| 3231df14d9 | |||
| 4880ffc37c | |||
| 26e4ab7539 | |||
| 5fb12d90ba | |||
| c424fbd04b | |||
| 15719b4a27 | |||
| a1b3d03a0c | |||
| 33d2123778 | |||
| 5139a112c5 | |||
| e7d2cc94f8 | |||
| eb8e4e1c69 | |||
| ead17e67bb | |||
| 7eb35c9a4e | |||
| 5597a4c2ca | |||
| 010028da0d | |||
| 30079ec854 | |||
| 3c504cb65c | |||
| aa7229e21b | |||
| 84af6f5cfe | |||
| c7a05f2118 | |||
| 7445e789a4 | |||
| fabab0a577 | |||
| 8b53fbe0ca | |||
| 65af3b6956 | |||
| 47d8f14ad4 | |||
| 1c664cc2f6 | |||
| b89bc455f6 | |||
| ee4eec1e2e | |||
| b6c64df004 | |||
| 93166e0f71 | |||
| dc28fb65ba | |||
| 03df0388b4 | |||
| 6d6d395bff | |||
| 75a7da4a19 | |||
| 8e552df724 | |||
| 72699abdec | |||
| 2dca6e3ff8 | |||
| 63804635de | |||
| eb598255f3 | |||
| 492d43c709 | |||
| 8f28eb920f | |||
| 4a4902ab72 | |||
| 462656880c | |||
| 80d1570e68 | |||
| fc3a8e58d9 | |||
| 9906c2653b | |||
| 52d18cf408 | |||
| 7081f28ee0 | |||
| cb9ea99008 | |||
| 4aac36cd4c | |||
| e7e58d28cc | |||
| af45e3fda3 | |||
| e0b9daa40e | |||
| 08c0d8ebd3 | |||
| 7eb64f2d70 | |||
| 13f72a49ae | |||
| 28aa794e3f | |||
| 6454933d59 | |||
| 848f471ef1 | |||
| a3be91c6ac | |||
| 25aa857758 | |||
| 52d90d490b | |||
| 428d5c90c8 | |||
| 4288867acf | |||
| 070a398f7e | |||
| 277bf123ea | |||
| dd01ed36bd | |||
| 47f5b7a0a6 | |||
| e8b19513b4 | |||
| b202de76ec | |||
| c4d00bfdc3 | |||
| e865ea34b9 | |||
| 997c88ae57 | |||
| 81df83be26 | |||
| 76c3a7c8bf | |||
| cc53ee4d29 | |||
| 066e6da017 | |||
| fb13f40ac1 | |||
| cf05f857bd | |||
| dda3b11326 | |||
| f811445451 | |||
| d5f7c218bd | |||
| ee795f3676 | |||
| 4527780cf8 | |||
| 5d1e2d0b1c | |||
| 5d073b47fb | |||
| 7b0460c4e0 | |||
| ae84b7cde4 | |||
| 2fc3d4ae67 | |||
| 872d7d1c14 | |||
| 1701b6e4d3 | |||
| c7cfa4c1de | |||
| d632ba514c | |||
| ed9b519b77 | |||
| 2d005a5456 | |||
| dbf39c5538 | |||
| b1f5cfdd7a | |||
| eb4bb8c208 | |||
| 517998a0db | |||
| e8ece06a44 | |||
| bf1eb3ecbb | |||
| f853349d1e | |||
| 1ee6efa80f | |||
| 2bee644444 | |||
| f249ff496f | |||
| 34c828bef3 | |||
| 2c6bf02773 | |||
| 5fa21849a4 | |||
| a407fb7f7a | |||
| 1c61f32cc8 | |||
| a14409cd7c | |||
| 2e11de3293 | |||
| df244a687a | |||
| fe01f1f0b0 | |||
| b7192b761e | |||
| 128e4f4074 | |||
| d78b7fd15e | |||
| d8665eda33 | |||
| 30f3167573 | |||
| 0653974969 | |||
| 8ba3128cb9 | |||
| cea834508e | |||
| a2ee519a22 | |||
| 030d305702 | |||
| d976443fb9 | |||
| 24cb308980 | |||
| 39dfdeacf3 | |||
| 8cc266d9b0 | |||
| e5d62c84a5 | |||
| 72d7e76bf9 | |||
| 2e54b6e85b |
@ -5,10 +5,13 @@ VITE_APP_TITLE = 云平台管理系统
|
||||
VITE_APP_ENV = 'development'
|
||||
|
||||
# 开发环境
|
||||
# VITE_APP_BASE_API = 'http://47.120.79.150/backend'
|
||||
VITE_APP_BASE_API = 'http://192.168.2.23:8000'
|
||||
# VITE_APP_BASE_API = 'http://localhost:8000'
|
||||
# VITE_APP_BASE_API = 'http://139.224.253.23:8000'
|
||||
VITE_APP_BASE_API = 'https://www.cnxhyc.com/jq'
|
||||
# VITE_APP_BASE_API = 'http://192.168.110.57:8000'
|
||||
#代永飞接口
|
||||
# VITE_APP_BASE_API = 'http://457102h2d6.qicp.vip:24689'
|
||||
|
||||
VITE_AMAP_KEY='84a12a692ae378effdf741e16d584cd3'
|
||||
|
||||
# 应用访问路径 例如使用前缀 /admin/
|
||||
VITE_APP_CONTEXT_PATH = '/'
|
||||
|
||||
@ -2,13 +2,16 @@
|
||||
VITE_APP_TITLE = 云平台管理系统
|
||||
|
||||
# 生产环境配置 晶全1
|
||||
VITE_APP_ENV = 'https://fuyuanshen.com/backend'
|
||||
VITE_APP_ENV = 'production'
|
||||
|
||||
# 生产环境配置 富源晟2
|
||||
# VITE_APP_ENV = 'https://fuyuanshen.com/backend-fys'
|
||||
|
||||
# 应用访问路径 晶全1
|
||||
VITE_APP_CONTEXT_PATH = '/jingquan/'
|
||||
VITE_APP_CONTEXT_PATH = '/PC/'
|
||||
|
||||
# 高德地图Key
|
||||
VITE_AMAP_KEY='84a12a692ae378effdf741e16d584cd3'
|
||||
|
||||
# 应用访问路径 富源晟2
|
||||
#VITE_APP_CONTEXT_PATH = '/sys/'
|
||||
@ -19,8 +22,10 @@ VITE_APP_MONITOR_ADMIN = '/admin/applications'
|
||||
# SnailJob 控制台地址
|
||||
VITE_APP_SNAILJOB_ADMIN = '/snail-job'
|
||||
|
||||
# 生产环境 晶全3
|
||||
VITE_APP_BASE_API = '/backend'
|
||||
# 生产环境 晶全3 代理访问
|
||||
VITE_APP_BASE_API = 'https://www.cnxhyc.com/jq'
|
||||
|
||||
# VITE_APP_BASE_API = 'http://139.224.253.23:8000'
|
||||
|
||||
# 生产环境 富源晟3
|
||||
#VITE_APP_BASE_API = '/backend-fys'
|
||||
|
||||
@ -6,7 +6,12 @@
|
||||
<meta name="renderer" content="webkit" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<script src="https://webapi.amap.com/maps?v=2.0&key=90bc158992feb8ccd0145e168cab1307"></script>
|
||||
<script type="text/javascript">
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: "4239900f4fb7b2569df651ac814a28de",
|
||||
};
|
||||
</script>
|
||||
<script src="https://webapi.amap.com/maps?v=2.0&key=78c36a1e251a95f1a21a9e5ea7a1331c&plugin=AMap.CircleEditor"></script>
|
||||
<title>物联网管理平台</title>
|
||||
<!--[if lt IE 11
|
||||
]><script>
|
||||
|
||||
10
package.json
@ -56,9 +56,9 @@
|
||||
"@types/js-cookie": "3.0.6",
|
||||
"@types/node": "^22.13.4",
|
||||
"@types/nprogress": "0.2.3",
|
||||
"@unocss/preset-attributify": "66.0.0",
|
||||
"@unocss/preset-icons": "66.0.0",
|
||||
"@unocss/preset-uno": "66.0.0",
|
||||
"@unocss/preset-attributify": "^66.0.0",
|
||||
"@unocss/preset-icons": "^66.0.0",
|
||||
"@unocss/preset-uno": "^66.0.0",
|
||||
"@vitejs/plugin-vue": "5.2.3",
|
||||
"@vue/compiler-sfc": "3.5.13",
|
||||
"@vue/eslint-config-prettier": "10.2.0",
|
||||
@ -72,12 +72,12 @@
|
||||
"sass": "1.87.0",
|
||||
"terser": "^5.43.1",
|
||||
"typescript": "~5.8.3",
|
||||
"unocss": "66.0.0",
|
||||
"unocss": "^66.0.0",
|
||||
"unplugin-auto-import": "19.1.2",
|
||||
"unplugin-icons": "22.1.0",
|
||||
"unplugin-vue-components": "28.5.0",
|
||||
"unplugin-vue-setup-extend-plus": "1.0.1",
|
||||
"vite": "^7.1.3",
|
||||
"vite": "^6.3.6",
|
||||
"vite-plugin-compression": "0.5.1",
|
||||
"vite-plugin-svg-icons-ng": "^1.4.0",
|
||||
"vite-plugin-vue-devtools": "7.7.5",
|
||||
|
||||
108
src/api/FenceManager/fence.ts
Normal file
@ -0,0 +1,108 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
//修改电子围栏
|
||||
function updateFence(data) {
|
||||
return request({
|
||||
url: '/api/equipment/geoFence',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
//新增电子围栏
|
||||
function AddFence(data) {
|
||||
return request({
|
||||
url: '/api/equipment/geoFence',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
//导出电子围栏列表
|
||||
function exportFence (data){
|
||||
return request({
|
||||
url: '/api/equipment/geoFence/export',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
//位置检查
|
||||
function check(data) {
|
||||
return request({
|
||||
url: '/api/equipment/geoFence/check',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
//获取电子围栏详细信息
|
||||
function geoFenceById(id) {
|
||||
return request({
|
||||
url: '/api/equipment/geoFence/'+id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
//查询电子围栏列表
|
||||
function getList(data) {
|
||||
if(!data){
|
||||
data={pageNum:1,pageSize:9999};
|
||||
}
|
||||
return request({
|
||||
url: '/api/equipment/geoFence/list',
|
||||
method: 'get',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
|
||||
//删除电子围栏
|
||||
function DelFence(ids) {
|
||||
return request({
|
||||
url: '/api/equipment/geoFence/' + ids,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
//添加终端
|
||||
function addTerminal(data){
|
||||
return request({
|
||||
url: '/api/equipment/geoFence/addTerminal',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
//删除终端
|
||||
function delTerminal(data){
|
||||
return request({
|
||||
url: '/api/equipment/geoFence/delTerminal',
|
||||
method: 'post',
|
||||
data:data
|
||||
})
|
||||
}
|
||||
|
||||
//查询终端
|
||||
function pageTerminal(data){
|
||||
return request({
|
||||
url:'api/device/pageTerminal',
|
||||
method:'get',
|
||||
params:data
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
export default{
|
||||
updateFence:updateFence,
|
||||
AddFence:AddFence,
|
||||
exportFence:exportFence,
|
||||
check:check,
|
||||
geoFenceById:geoFenceById,
|
||||
getList:getList,
|
||||
DelFence:DelFence,
|
||||
addTerminal:addTerminal,
|
||||
delTerminal:delTerminal,
|
||||
pageTerminal:pageTerminal
|
||||
}
|
||||
|
||||
|
||||
245
src/api/FenceManager/mapOpt.ts
Normal file
@ -0,0 +1,245 @@
|
||||
var map = null;
|
||||
var circle = null;
|
||||
var polygon = null;
|
||||
import mapLocation from '@/assets/images/mapLocation.png';
|
||||
|
||||
function initMap() {
|
||||
// let key = '90bc158992feb8ccd0145e168cab1307';
|
||||
let init = function () {
|
||||
map = new AMap.Map("map", {
|
||||
viewMode: '2D', //默认使用 2D 模式
|
||||
zoom: 11, //地图级别
|
||||
dragEnable: true, // 强制开启拖拽
|
||||
zoomEnable: true, // 开启滚轮缩放(辅助验证)
|
||||
center: [114.420739, 30.487514], //地图中心点
|
||||
});
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
map.resize();
|
||||
}, 1000);
|
||||
// map.on('click',function(evt){
|
||||
// alert('您点击的位置:'+evt.lnglat.lng+' , '+ evt.lnglat.lat);
|
||||
// });
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
if(map){
|
||||
resolve(200);
|
||||
return;
|
||||
}
|
||||
if (window.AMap) {
|
||||
init();
|
||||
resolve(200);
|
||||
return;
|
||||
}
|
||||
reject({code:500,msg:'高德地图未能初始化成功'});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
//添加一个点
|
||||
function AddPoint(point, index, dragEnd, click) {
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
let center = point ? new AMap.LngLat(point.lng, point.lat) : map.getCenter();
|
||||
|
||||
let marker = new AMap.Text({
|
||||
icon: mapLocation,
|
||||
position: center,
|
||||
offset: new AMap.Pixel(-15, -24),
|
||||
draggable: true,
|
||||
cursor: 'point',
|
||||
title: '点击删除',
|
||||
text: index,
|
||||
class: 'point',
|
||||
extData: { type: 'point', txt: index }
|
||||
});
|
||||
marker.setMap(map);
|
||||
|
||||
let lays = map.getAllOverlays('text');
|
||||
for (let i = 0; i < lays.length; i++) {
|
||||
const element = lays[i];
|
||||
let cls = element.getOptions();
|
||||
if (cls.class) {
|
||||
element.dom.classList.add(cls.class);
|
||||
}
|
||||
}
|
||||
|
||||
marker.on('dragend', dragEnd);
|
||||
marker.on('mouseover', function (evt) {
|
||||
marker.setText('X');
|
||||
|
||||
});
|
||||
marker.on('mouseout', function (evt) {
|
||||
marker.setText(marker.getExtData().txt);
|
||||
|
||||
});
|
||||
marker.on('click', function (evt) {
|
||||
|
||||
click(evt, marker);
|
||||
});
|
||||
resolve(center);
|
||||
} catch (ex) {
|
||||
reject(ex)
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
function getCenter() {
|
||||
var center = map.getCenter().toJSON();
|
||||
return center;
|
||||
}
|
||||
|
||||
function setCenter(lon, lat) {
|
||||
var position = new AMap.LngLat(lon, lat); //传入经纬度
|
||||
map.setCenter(position); //简写 设置地图中心点
|
||||
|
||||
}
|
||||
//画多边形
|
||||
function DrawPoy(points) {
|
||||
if(!map){
|
||||
return;
|
||||
}
|
||||
if (!points) {
|
||||
return;
|
||||
}
|
||||
let path = [];
|
||||
if (polygon) {
|
||||
map.remove(polygon);
|
||||
polygon = null;
|
||||
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
points.filter(v => {
|
||||
path.push(new AMap.LngLat(v.lng, v.lat));
|
||||
return true;
|
||||
});
|
||||
|
||||
polygon = new AMap.Polygon({
|
||||
path: path,
|
||||
fillColor: '#ccebc5',
|
||||
strokeOpacity: 1,
|
||||
fillOpacity: 0.5,
|
||||
strokeColor: '#FF0000',
|
||||
strokeWeight: 5,
|
||||
strokeStyle: 'solid',
|
||||
strokeDasharray: [5, 5],
|
||||
});
|
||||
|
||||
map.add(polygon);
|
||||
|
||||
// map.setFitView();
|
||||
}, 0);
|
||||
|
||||
}
|
||||
//画圆形
|
||||
function DrawCicle(points, raduis, dragEnd) {
|
||||
if(!map){
|
||||
return;
|
||||
}
|
||||
if (circle) {
|
||||
map.remove(circle);
|
||||
}
|
||||
|
||||
circle = new AMap.Circle({
|
||||
center: [points[0].lng, points[0].lat],
|
||||
radius: raduis ? raduis : 1000, //半径
|
||||
borderWeight: 3,
|
||||
strokeColor: "#FF33FF",
|
||||
strokeWeight: 6,
|
||||
strokeOpacity: 0.2,
|
||||
fillOpacity: 0.4,
|
||||
strokeStyle: 'solid',
|
||||
strokeDasharray: [10, 10],
|
||||
// 线样式还支持 'dashed'
|
||||
fillColor: '#1791fc',
|
||||
zIndex: 50,
|
||||
})
|
||||
|
||||
// var circleEditor = new AMap.CircleEditor(map, circle,{
|
||||
// editOptions: {
|
||||
// moveable: false, // 禁止拖拽圆心
|
||||
// // 可以同时配置其他编辑选项
|
||||
// // scalable: true // 允许缩放(默认开启)
|
||||
// }
|
||||
// });
|
||||
|
||||
// circleEditor.open();
|
||||
|
||||
// circleEditor.on('move', function (event) {
|
||||
|
||||
// console.log('触发事件:move')
|
||||
// })
|
||||
|
||||
// circleEditor.on('adjust', function (event) {
|
||||
// console.log('触发事件:adjust');
|
||||
|
||||
// dragEnd(event.radius);
|
||||
// })
|
||||
|
||||
// circleEditor.on('end', function (event) {
|
||||
|
||||
// console.log('触发事件: end')
|
||||
// // event.target 即为编辑后的圆形对象
|
||||
// })
|
||||
|
||||
map.add(circle);
|
||||
// 缩放地图到合适的视野级别
|
||||
map.setFitView([circle])
|
||||
}
|
||||
|
||||
//清除所有
|
||||
function clearOverLays() {
|
||||
map && map.clearMap();
|
||||
}
|
||||
|
||||
|
||||
|
||||
function removeOverLay(lay) {
|
||||
map && map.remove(lay);
|
||||
}
|
||||
|
||||
function removePoy() {
|
||||
if(!map){
|
||||
return;
|
||||
}
|
||||
if (polygon) {
|
||||
map.remove(polygon);
|
||||
polygon = null;
|
||||
}
|
||||
|
||||
}
|
||||
function removeCircle() {
|
||||
if(!map){
|
||||
return;
|
||||
}
|
||||
if (circle) {
|
||||
map.remove(circle);
|
||||
circle = null;
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function setFitView() {
|
||||
if(map){map.setFitView();}
|
||||
}
|
||||
export default {
|
||||
gdMap: map,
|
||||
initMap: initMap,
|
||||
AddPoint: AddPoint,
|
||||
getCenter: getCenter,
|
||||
DrawPoy: DrawPoy,
|
||||
DrawCicle: DrawCicle,
|
||||
clearOverLays: clearOverLays,
|
||||
removeOverLay: removeOverLay,
|
||||
removePoy: removePoy,
|
||||
removeCircle: removeCircle,
|
||||
setFitView: setFitView
|
||||
}
|
||||
62
src/api/FenceManager/record.ts
Normal file
@ -0,0 +1,62 @@
|
||||
import request from '@/utils/request';
|
||||
import common from '@/utils/common';
|
||||
|
||||
//修改围栏进出记录
|
||||
function updateRecord(data) {
|
||||
return request({
|
||||
url: '/api/equipment/fenceAccessRecord',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
//新增围栏进出记录
|
||||
function addRecord(data) {
|
||||
return request({
|
||||
url: '/api/equipment/fenceAccessRecord',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
//获取围栏进出记录详细信息
|
||||
function getRecordById(id) {
|
||||
return request({
|
||||
url: '/api/equipment/fenceAccessRecord/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
//查询围栏进出记录列表
|
||||
function RecordList(data) {
|
||||
let queryParams = Object.assign({}, data);
|
||||
if (queryParams.Date && queryParams.Date.length) {
|
||||
queryParams.beginTime = common.DateFormat(queryParams.Date[0], 'yyyy-MM-dd');
|
||||
queryParams.endTime = common.DateFormat(queryParams.Date.length > 1 ? queryParams.Date[1] : '', 'yyyy-MM-dd');
|
||||
}
|
||||
delete queryParams['Date'];
|
||||
return request({
|
||||
url: '/api/equipment/fenceAccessRecord/list',
|
||||
method: 'get',
|
||||
params: queryParams
|
||||
})
|
||||
}
|
||||
|
||||
//删除围栏进出记录
|
||||
function DropRecord(ids) {
|
||||
return request({
|
||||
url: '/api/equipment/fenceAccessRecord/' + ids,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export default {
|
||||
updateRecord: updateRecord,
|
||||
addRecord: addRecord,
|
||||
getRecordById: getRecordById,
|
||||
RecordList: RecordList,
|
||||
DropRecord: DropRecord
|
||||
}
|
||||
51
src/api/controlCenter/controlPanel/100J.ts
Normal file
@ -0,0 +1,51 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
// 详情信息
|
||||
export const deviceDeatil = (id: string) => {
|
||||
return request({
|
||||
url: `/api/hby100j/device/${id}`,
|
||||
method: 'get',
|
||||
});
|
||||
};
|
||||
// 灯光模式
|
||||
function lightModeSettings (data: any) {
|
||||
return request({
|
||||
url: `/app/hby100j/device/lightAdjustment`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
//频率调节
|
||||
function staticPowerSetting (data: any) {
|
||||
return request({
|
||||
url: `/app/hby100j/device/strobeFrequency`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
// 修改音量
|
||||
function settingUpdateVolume (data: any) {
|
||||
return request({
|
||||
url: `/app/hby100j/device/updateVolume`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
// 强制报警
|
||||
function SosSetting (data: any) {
|
||||
return request({
|
||||
url: `/app/hby100j/device/forceAlarmActivation`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
export default {
|
||||
deviceDeatil,
|
||||
lightModeSettings:lightModeSettings,
|
||||
SosSetting:SosSetting,
|
||||
staticPowerSetting:staticPowerSetting,
|
||||
settingUpdateVolume:settingUpdateVolume
|
||||
};
|
||||
75
src/api/controlCenter/controlPanel/670.ts
Normal file
@ -0,0 +1,75 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
// 人员信息发送
|
||||
function SendUser (data: any) {
|
||||
return request({
|
||||
url: `/api/xinghan/device/registerPersonInfo`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
// 灯光模式
|
||||
function lightModeSettings (data: any) {
|
||||
return request({
|
||||
url: `/api/xinghan/device/LightGradeSettings`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
// 强制报警
|
||||
function SosSetting (data: any) {
|
||||
return request({
|
||||
url: `/api/xinghan/device/SOSGradeSettings`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
//批量强制报警
|
||||
function SosSettingBatch(data:any){
|
||||
return request({
|
||||
url: `/api/xinghan/device/SOSGradeSettingsBatch`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
}
|
||||
|
||||
//静电探测档位控制
|
||||
function staticPowerSetting (data: any) {
|
||||
return request({
|
||||
url: `/api/xinghan/device/DetectGradeSettings`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
// 获取设备实时状态
|
||||
function deviceRealTimeStatus (id: any) {
|
||||
return request({
|
||||
url: `/api/xinghan/device/`+id,
|
||||
method: 'get'
|
||||
});
|
||||
};
|
||||
|
||||
// 发送信息
|
||||
function SendMessage (data: any) {
|
||||
return request({
|
||||
url: `/api/xinghan/device/sendAlarmMessage`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
export default {
|
||||
SendUser:SendUser,
|
||||
lightModeSettings:lightModeSettings,
|
||||
SosSetting:SosSetting,
|
||||
staticPowerSetting:staticPowerSetting,
|
||||
deviceRealTimeStatus:deviceRealTimeStatus,
|
||||
SendMessage:SendMessage,
|
||||
SosSettingBatch:SosSettingBatch
|
||||
};
|
||||
114
src/api/controlCenter/controlPanel/eqControl.ts
Normal file
@ -0,0 +1,114 @@
|
||||
import xhyc from '@/api/controlCenter/controlPanel/670'
|
||||
import fys from '@/api/controlCenter/controlPanel/index'
|
||||
|
||||
|
||||
var dic = [{
|
||||
typeNames: ['670'],//星汉的配置
|
||||
sendMsg: {
|
||||
cfg: ['sendMsg', 'deviceIds', 'deviceImeiList', 'instructValue', 'batchId'],
|
||||
method: xhyc.SendMessage
|
||||
},
|
||||
SOS: {
|
||||
|
||||
cfg: ["deviceIds", "typeName", "batchId", "deviceImeiList", "instructValue"],
|
||||
method: xhyc.SosSettingBatch
|
||||
},
|
||||
sendImg: {
|
||||
cfg: [],
|
||||
method: null
|
||||
}
|
||||
},
|
||||
{
|
||||
typeNames: ['6170', '210'],//富源晟的配置
|
||||
sendMsg: {
|
||||
cfg: ["deviceIds", "typeName", "batchId", "deviceImeiList", "sendMsg"],
|
||||
method: fys.deviceSendMessage
|
||||
},
|
||||
SOS: {
|
||||
cfg: ["deviceIds", "typeName", "batchId", "deviceImeiList", "instructValue"],
|
||||
method: fys.sendAlarmMessage
|
||||
},
|
||||
sendImg: {
|
||||
cfg: [],
|
||||
method: null
|
||||
}
|
||||
},
|
||||
{
|
||||
typeNames: null,//如果找不到,以富源晟的配置为准
|
||||
sendMsg: {
|
||||
cfg: ["deviceIds", "typeName", "batchId", "deviceImeiList", "sendMsg"],
|
||||
method: fys.deviceSendMessage
|
||||
},
|
||||
SOS: {
|
||||
cfg: ["deviceIds", "typeName", "batchId", "deviceImeiList", "instructValue"],
|
||||
method: fys.sendAlarmMessage
|
||||
},
|
||||
sendImg: {
|
||||
cfg: [],
|
||||
method: null
|
||||
}
|
||||
|
||||
}
|
||||
];
|
||||
|
||||
function getCfg(json, type) {
|
||||
let f = dic.find(v => {
|
||||
|
||||
let flag = false;
|
||||
for (let index = 0; index < v.typeNames.length; index++) {
|
||||
let i = v.typeNames[index];
|
||||
if (i.toLowerCase().indexOf(json.typeName.toLowerCase()) > -1 || json.typeName.toLowerCase().indexOf(i.toLowerCase()) > -1) {
|
||||
flag = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
return flag;
|
||||
});
|
||||
|
||||
if (!f) {
|
||||
f = dic.find(v => {
|
||||
return !v.typeNames;
|
||||
});
|
||||
}
|
||||
if (f) {
|
||||
let keys = f[type].cfg;
|
||||
let method = f[type].method;
|
||||
|
||||
let formData = {};
|
||||
keys.forEach(key => {
|
||||
formData[key] = json[key];
|
||||
});
|
||||
|
||||
return {
|
||||
formData: formData,
|
||||
method: method
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
//发送信息
|
||||
function deviceSendMessage(json) {
|
||||
let cfg = getCfg(json, 'sendMsg');
|
||||
if (cfg.method) {
|
||||
return cfg.method(cfg.formData);
|
||||
}
|
||||
return Promise.reject({ code: 500, msg: '配置中找不到该类型的设备' });
|
||||
|
||||
}
|
||||
|
||||
//强制报警
|
||||
function sendAlarmMessage(json) {
|
||||
|
||||
let cfg = getCfg(json, 'SOS');
|
||||
if (cfg.method) {
|
||||
return cfg.method(cfg.formData);
|
||||
}
|
||||
return Promise.reject({ code: 500, msg: '配置中找不到该类型的设备' });
|
||||
}
|
||||
export default {
|
||||
deviceSendMessage: deviceSendMessage,
|
||||
sendAlarmMessage: sendAlarmMessage
|
||||
}
|
||||
@ -36,13 +36,10 @@ export interface DeviceDetail {
|
||||
currentLightMode?: string;// 当前选中的灯光模式(如"strong",对应强光)
|
||||
sendMsg: string;
|
||||
lightBrightness: string;
|
||||
personnelInfo: { // 人员信息(嵌套对象,根据接口调整)
|
||||
unitName: string; // 单位
|
||||
position: string; // 职位
|
||||
name: string; // 姓名
|
||||
code: string; // ID(身份证/工号)
|
||||
};
|
||||
chargeState: string
|
||||
strobeFrequency: string;
|
||||
volume: string;
|
||||
chargeState: string;
|
||||
alarmStatus: number
|
||||
}
|
||||
// 定义灯光模式的类型接口
|
||||
export interface LightMode {
|
||||
|
||||
89
src/api/debugCenter/debugCenter.ts
Normal file
@ -0,0 +1,89 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
//获取列表数据
|
||||
function getDevice(queryParams){
|
||||
return request({
|
||||
url: '/api/device/debug/list',
|
||||
method: 'get',
|
||||
params: queryParams
|
||||
})
|
||||
}
|
||||
|
||||
//上传文件
|
||||
function uploadFile(formData){
|
||||
return request({
|
||||
url: '/api/device/debug/addFile',
|
||||
method: 'post',
|
||||
data: formData
|
||||
})
|
||||
}
|
||||
|
||||
//修改操作视频
|
||||
function addVideo(formData){
|
||||
return request({
|
||||
url: '/api/device/debug/addVideo',
|
||||
method: 'post',
|
||||
data: formData
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
//修改单个数据的多个文件
|
||||
function updateItem(formData){
|
||||
|
||||
return request({
|
||||
url: '/api/device/debug/editDebug',
|
||||
method: 'post',
|
||||
data: formData
|
||||
})
|
||||
//开发时假装成功
|
||||
// return new Promise((resolve,reject)=>{
|
||||
// resolve({
|
||||
// code:200,
|
||||
// msg:"操作成功"
|
||||
// });
|
||||
// });
|
||||
}
|
||||
//批量上传开机画面
|
||||
function uploadBoot(formData){
|
||||
return request({
|
||||
url: '/api/device/debug/addLogo',
|
||||
method: 'post',
|
||||
data: formData
|
||||
})
|
||||
//开发时假装成功
|
||||
// return new Promise((resolve, reject) => {
|
||||
// //开机画面
|
||||
// resolve({ code: 200, msg: '操作成功' });
|
||||
// });
|
||||
}
|
||||
|
||||
// 6170上传logo开机画面
|
||||
function deviceUploadLogo(formData){
|
||||
return request({
|
||||
url: '/api/bjq/device/batchUploadLogo',
|
||||
method: 'post',
|
||||
data: formData
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function getDeviceInfoById(id){
|
||||
return request({
|
||||
url: '/api/device/debug/detail/'+id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export default{
|
||||
getDevice:getDevice,
|
||||
uploadFile:uploadFile,
|
||||
addVideo:addVideo,
|
||||
updateItem:updateItem,
|
||||
uploadBoot:uploadBoot,
|
||||
getDeviceInfoById:getDeviceInfoById,
|
||||
deviceUploadLogo:deviceUploadLogo
|
||||
}
|
||||
29
src/api/debugCenter/deviceApi.ts
Normal file
@ -0,0 +1,29 @@
|
||||
|
||||
import debugCenter from '@/api/debugCenter/debugCenter';
|
||||
const uploadConfig = {
|
||||
670: {
|
||||
api: debugCenter.uploadBoot, // 670对应接口
|
||||
requiredParams: ['deviceIds', 'file']
|
||||
},
|
||||
6170: {
|
||||
api: debugCenter.deviceUploadLogo,
|
||||
requiredParams: ['deviceIds', 'file',]
|
||||
},
|
||||
default: {
|
||||
api: debugCenter.uploadBoot,
|
||||
requiredParams: ['deviceIds', 'file']
|
||||
}
|
||||
};
|
||||
function handleParams(deviceType, deviceIds, file) {
|
||||
const formattedIds = Array.isArray(deviceIds) ? deviceIds : [deviceIds];
|
||||
const formData = new FormData();
|
||||
formattedIds.forEach(id => formData.append('deviceIds', id));
|
||||
formData.append('file', file);
|
||||
return formData;
|
||||
}
|
||||
export function uploadLogo(deviceType, deviceIds, file) {
|
||||
const currentConfig = uploadConfig[deviceType] || uploadConfig.default;
|
||||
const formData = handleParams(deviceType, deviceIds, file);
|
||||
return currentConfig.api(formData);
|
||||
}
|
||||
export default { uploadLogo };
|
||||
@ -16,6 +16,7 @@ export interface AlarmVO {
|
||||
deviceMac: string;
|
||||
devicePic:string;
|
||||
finishTime: string;
|
||||
timeDiff:string
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -5,6 +5,8 @@ export interface deviceQuery extends PageQuery {
|
||||
deviceType: string;
|
||||
deviceStatus: string;
|
||||
bluetoothName?: string; // 蓝牙名称查询字段
|
||||
onlineStatus?: string;
|
||||
bindingStatus?:string
|
||||
}
|
||||
|
||||
export interface deviceForm {
|
||||
@ -37,6 +39,7 @@ export interface deviceVO {
|
||||
customerId?: string | number;
|
||||
typeName?: string;
|
||||
bluetoothName?: string; // 蓝牙名称字段
|
||||
|
||||
}
|
||||
|
||||
export interface deviceTypeOption {
|
||||
|
||||
@ -17,7 +17,10 @@ export const addDeviceType = (data: any): AxiosPromise<deviceTypeVO[]> => {
|
||||
return request({
|
||||
url: '/api/deviceType/add',
|
||||
method: 'post',
|
||||
data: data
|
||||
data: data,
|
||||
headers:{
|
||||
'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
@ -26,6 +29,9 @@ export const updateDeviceType = (data: any): AxiosPromise<deviceTypeVO[]> => {
|
||||
return request({
|
||||
url: '/api/deviceType/update',
|
||||
method: 'put',
|
||||
headers:{
|
||||
'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'
|
||||
},
|
||||
data
|
||||
})
|
||||
}
|
||||
@ -34,6 +40,7 @@ export const deleteDeviceType = (ids: any): AxiosPromise<deviceTypeVO[]> => {
|
||||
return request({
|
||||
url: '/api/deviceType/delete',
|
||||
method: 'delete',
|
||||
|
||||
data: ids
|
||||
})
|
||||
}
|
||||
|
||||
@ -89,8 +89,9 @@ function getRepairList(data) {
|
||||
"repairPart": data.repairPart,
|
||||
"repairReason": data.repairReason,
|
||||
"repairPerson": data.repairPerson,
|
||||
"repairBeginTime": data.repairBeginTime,
|
||||
"repairEndTime": data.repairBeginTime,
|
||||
"repairBeginTime":data.Date?data.Date[0]:'',
|
||||
"repairEndTime": data.Date?data.Date[1]:'',
|
||||
"searchValue":data.searchValue,
|
||||
"pageNum": data.pageNum,
|
||||
"pageSize": data.pageSize
|
||||
}
|
||||
@ -126,6 +127,13 @@ function getDeviceTypeAll() {
|
||||
});
|
||||
}
|
||||
|
||||
function getDeviceAll(){
|
||||
return request({
|
||||
url:'api/device?pageNum=1&pageSize=99999',
|
||||
method:'get'}
|
||||
);
|
||||
}
|
||||
|
||||
export default {
|
||||
updateRepair: updateRepair,
|
||||
addRepir: addRepir,
|
||||
@ -133,5 +141,6 @@ export default {
|
||||
getRepirDetail: getRepirDetail,
|
||||
getRepairList: getRepairList,
|
||||
dropRepir: dropRepir,
|
||||
getDeviceTypeAll: getDeviceTypeAll
|
||||
getDeviceTypeAll: getDeviceTypeAll,
|
||||
getDeviceAll:getDeviceAll
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
export interface DataOverviewType {
|
||||
devicesNumber: number | string;
|
||||
equipmentOnline: number | string;
|
||||
bindingNew: number | string;
|
||||
binding: number | string;
|
||||
equipmentAbnormal: number | string;
|
||||
}
|
||||
59
src/api/homeIndex/index.ts
Normal file
@ -0,0 +1,59 @@
|
||||
import request from '@/utils/request';
|
||||
// 获取设备总览 DataOverview
|
||||
export const getDeviceOverview = (params) => {
|
||||
return request({
|
||||
url: '/api/largeScreen/getDeviceOverview',
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
// 报警事件,报警总数统计
|
||||
export const getAlarmStatistics = (params) => {
|
||||
return request({
|
||||
url: '/api/largeScreen/getAlarmStatistics',
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// 报警次数
|
||||
export const getMonthlyAlarmStatistics = (params) => {
|
||||
return request({
|
||||
url: '/api/largeScreen/getMonthlyAlarmStatistics',
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
|
||||
// 设备类别
|
||||
export const getDeviceCommunicationModeStatistics = (params = {}) => {
|
||||
return request({
|
||||
url: '/api/largeScreen/getDeviceCommunicationModeStatistics',
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
|
||||
// 设备使用频次
|
||||
export const getDeviceUsageFrequency = (params = {}) => {
|
||||
return request({
|
||||
url: '/api/largeScreen/getDeviceUsageFrequency',
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
|
||||
// 实时报警
|
||||
export const getRealtimeAlarm = (params = {}) => {
|
||||
return request({
|
||||
url: '/api/largeScreen/getRealtimeAlarm',
|
||||
method: 'get',
|
||||
params: params
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
0
src/api/homeIndex/types.ts
Normal file
241
src/api/largeScreen/mapOpt.ts
Normal file
@ -0,0 +1,241 @@
|
||||
var map = null;
|
||||
var layPoints = [];
|
||||
|
||||
function initMap(click) {
|
||||
// let key = '90bc158992feb8ccd0145e168cab1307';
|
||||
let init = function () {
|
||||
map = new AMap.Map("map", {
|
||||
viewMode: '2D', //默认使用 2D 模式
|
||||
zoom: 11, //地图级别
|
||||
center: [116.396477, 39.909278], //地图中心点
|
||||
mapStyle: "amap://styles/darkblue"
|
||||
});
|
||||
|
||||
map.on('click', function (evt) {
|
||||
// alert('您点击的位置:'+evt.lnglat.lng+' , '+ evt.lnglat.lat);
|
||||
if (click) {
|
||||
click(evt.lnglat);
|
||||
}
|
||||
});
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
if (map) {
|
||||
resolve(200);
|
||||
return;
|
||||
}
|
||||
if (window.AMap) {
|
||||
init();
|
||||
resolve(200);
|
||||
return;
|
||||
}
|
||||
reject({ code: 500, msg: '高德地图未能初始化成功' });
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
//添加一个点
|
||||
function AddPoint(point, index, dragEnd, click, iconImg) {
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
if (!point) {
|
||||
reject("point不可用")
|
||||
return;
|
||||
}
|
||||
if (!point.longitude || !point.latitude) {
|
||||
reject("point的经纬度不可用")
|
||||
return;
|
||||
}
|
||||
layPoints.push({ lng: point.longitude, lat: point.latitude });
|
||||
|
||||
let center = new AMap.LngLat(point.longitude, point.latitude);
|
||||
|
||||
let icon = new AMap.Icon({
|
||||
size: new AMap.Size(45, 45), //图标尺寸
|
||||
image: iconImg, //Icon 的图像
|
||||
|
||||
imageSize: new AMap.Size(45, 45), //根据所设置的大小拉伸或压缩图片
|
||||
});
|
||||
let marker = new AMap.Marker({
|
||||
icon: icon,
|
||||
position: center,
|
||||
offset: new AMap.Pixel(-15, -24),
|
||||
draggable: dragEnd ? true : false,
|
||||
cursor: 'point',
|
||||
title: point.isAlarming ? '正在报警:' + point.deviceName : point.deviceName,
|
||||
text: index,
|
||||
class: 'point',
|
||||
extData: point,
|
||||
anchor:'bottom-center'
|
||||
});
|
||||
marker.setMap(map);
|
||||
|
||||
let lays = map.getAllOverlays('text');
|
||||
for (let i = 0; i < lays.length; i++) {
|
||||
const element = lays[i];
|
||||
let cls = element.getOptions();
|
||||
if (cls.class) {
|
||||
element.dom.classList.add(cls.class);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
resolve(center);
|
||||
} catch (ex) {
|
||||
reject(ex)
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
function getCenter() {
|
||||
var center = map.getCenter().toJSON();
|
||||
return center;
|
||||
}
|
||||
|
||||
function setCenter(lon, latitude) {
|
||||
var position = new AMap.LngLat(lon, latitude); //传入经纬度
|
||||
map.setCenter(position); //简写 设置地图中心点
|
||||
|
||||
}
|
||||
|
||||
function calcCenter() {
|
||||
|
||||
|
||||
}
|
||||
//画多边形
|
||||
function DrawPoy(points) {
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!map) {
|
||||
reject("map未初始化");
|
||||
return;
|
||||
}
|
||||
if (!points) {
|
||||
reject("points未初始化");
|
||||
return;
|
||||
}
|
||||
if (!points.coordinates) {
|
||||
reject("coordinates未初始化");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!Array.isArray(points.coordinates)) {
|
||||
points.coordinates = JSON.parse(points.coordinates);
|
||||
}
|
||||
|
||||
let path = [];
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
points.coordinates.filter(v => {
|
||||
if (v.lng && v.lat) {
|
||||
path.push(new AMap.LngLat(v.lng, v.lat));
|
||||
layPoints.push({ lng: v.lng, lat: v.lat });
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
if (!path.length) {
|
||||
reject("path为空");
|
||||
}
|
||||
let polygon = new AMap.Polygon({
|
||||
path: path,
|
||||
fillColor: '#F00C0C',
|
||||
fillOpacity: 0.03,
|
||||
strokeOpacity: 0.1,
|
||||
strokeColor: '#F00C0C',
|
||||
|
||||
strokeWeight: 3,
|
||||
strokeStyle: 'dashed',
|
||||
// strokeDasharray: [50,50,50],
|
||||
extData: points
|
||||
});
|
||||
map.add(polygon);
|
||||
resolve("添加多边形成功");
|
||||
}, 0);
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
//画圆形
|
||||
function DrawCicle(points, raduis, dragEnd) {
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!map) {
|
||||
reject("map未初始化");
|
||||
return;
|
||||
}
|
||||
if (!points) {
|
||||
reject("points未初始化");
|
||||
return;
|
||||
}
|
||||
if (!points.coordinates) {
|
||||
reject("coordinates未初始化");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!Array.isArray(points.coordinates)) {
|
||||
points.coordinates = JSON.parse(points.coordinates);
|
||||
}
|
||||
|
||||
if (!(points.coordinates[0].lng && points.coordinates[0].lat)) {
|
||||
reject("圆的中心点不正确")
|
||||
return;
|
||||
}
|
||||
|
||||
let circle = new AMap.Circle({
|
||||
center: [points.coordinates[0].lng, points.coordinates[0].lat],
|
||||
radius: raduis ? raduis : 1000, //半径
|
||||
borderWeight: 3,
|
||||
strokeColor: "#F00C0C",
|
||||
strokeWeight: 1,
|
||||
strokeOpacity: 0.2,
|
||||
fillOpacity: 0.4,
|
||||
strokeStyle: 'dashed',
|
||||
strokeDasharray: [10, 10],
|
||||
// 线样式还支持 'dashed'
|
||||
fillColor: '#1791fc',
|
||||
zIndex: 50,
|
||||
})
|
||||
map.add(circle);
|
||||
layPoints.push({ lng: points.coordinates[0].lng, lat: points.coordinates[0].lat });
|
||||
resolve("添加圆成功");
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
//清除所有
|
||||
function clearOverLays() {
|
||||
map && map.clearMap();
|
||||
layPoints = [];
|
||||
}
|
||||
|
||||
|
||||
|
||||
function removeOverLay(lay) {
|
||||
map && map.remove(lay);
|
||||
}
|
||||
|
||||
|
||||
|
||||
function setFitView() {
|
||||
if (map) { map.setFitView(); }
|
||||
}
|
||||
export default {
|
||||
gdMap: map,
|
||||
initMap: initMap,
|
||||
AddPoint: AddPoint,
|
||||
getCenter: getCenter,
|
||||
DrawPoy: DrawPoy,
|
||||
DrawCicle: DrawCicle,
|
||||
clearOverLays: clearOverLays,
|
||||
removeOverLay: removeOverLay,
|
||||
setCenter: setCenter,
|
||||
calcCenter: calcCenter,
|
||||
setFitView: setFitView
|
||||
}
|
||||
118
src/api/system/service/api.ts
Normal file
@ -0,0 +1,118 @@
|
||||
import request from '@/utils/request';
|
||||
import { AxiosPromise } from 'axios';
|
||||
import { ServiceVO, ServiceForm, ServiceQuery } from '@/api/system/service/types';
|
||||
|
||||
/**
|
||||
* 查询轨迹服务列表
|
||||
* @param query
|
||||
* @returns {*}
|
||||
*/
|
||||
|
||||
export const listService = (query?: ServiceQuery): AxiosPromise<ServiceVO[]> => {
|
||||
return request({
|
||||
url: '/api/trackService/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 查询轨迹服务详细
|
||||
* @param id
|
||||
*/
|
||||
export const getService = (id: string | number): AxiosPromise<ServiceVO> => {
|
||||
return request({
|
||||
url: '/api/trackService/' + id,
|
||||
method: 'get'
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 新增轨迹服务
|
||||
* @param data
|
||||
*/
|
||||
export const addService = (data: ServiceForm) => {
|
||||
return request({
|
||||
url: '/api/trackService/add',
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 修改轨迹服务
|
||||
* @param data
|
||||
*/
|
||||
export const updateService = (data: ServiceForm) => {
|
||||
return Promise.reject({code:500,msg:'不允许此操作'});
|
||||
// return request({
|
||||
// url: '/api/trackService/update',
|
||||
// method: 'put',
|
||||
// data: data
|
||||
// });
|
||||
};
|
||||
|
||||
/**
|
||||
* 删除轨迹服务
|
||||
* @param id
|
||||
*/
|
||||
export const delService = (id: string | number | Array<string | number>) => {
|
||||
// return request({
|
||||
// url: '/api/trackService/' + id,
|
||||
// method: 'delete'
|
||||
// });
|
||||
|
||||
return Promise.reject({code:500,msg:'不允许此操作'});
|
||||
};
|
||||
|
||||
|
||||
//获取设备
|
||||
export const getDevice = (data) => {
|
||||
return request({
|
||||
url: '/api/device',
|
||||
method: 'get',
|
||||
params:data
|
||||
});
|
||||
};
|
||||
|
||||
//获取设备
|
||||
export const getDeviceList = (data) => {
|
||||
return request({
|
||||
url: '/api/device/list',
|
||||
method: 'get',
|
||||
params:data
|
||||
});
|
||||
};
|
||||
//保存
|
||||
export const terminalDevice=(data)=>{
|
||||
return request({
|
||||
url: '/api/trackService/terminal',
|
||||
method: 'post',
|
||||
data:data
|
||||
});
|
||||
}
|
||||
//删除
|
||||
export const delTerminalDevice=(id)=>{
|
||||
return request({
|
||||
url: '/api/trackService/delTerminal/'+id,
|
||||
method: 'delete'
|
||||
});
|
||||
}
|
||||
|
||||
//获取地图的终端,列表查询
|
||||
export const getMapDevice = (data) => {
|
||||
return request({
|
||||
url: '/api/trackService/listTerminal',
|
||||
method: 'get',
|
||||
params:data
|
||||
});
|
||||
};
|
||||
|
||||
//获取地图的终端,模糊查询
|
||||
export const getMapDeviceByFilter = (data) => {
|
||||
return request({
|
||||
url: '/api/trackService/searchTerminal',
|
||||
method: 'get',
|
||||
params:data
|
||||
});
|
||||
};
|
||||
56
src/api/system/service/types.ts
Normal file
@ -0,0 +1,56 @@
|
||||
export interface ServiceVO {
|
||||
/**
|
||||
*
|
||||
*/
|
||||
id: string | number;
|
||||
|
||||
/**
|
||||
* 猎鹰服务ID
|
||||
*/
|
||||
sid: string | number;
|
||||
|
||||
/**
|
||||
* 服务名称
|
||||
*/
|
||||
sname: string;
|
||||
|
||||
}
|
||||
|
||||
export interface ServiceForm extends BaseEntity {
|
||||
/**
|
||||
*
|
||||
*/
|
||||
id?: string | number;
|
||||
|
||||
/**
|
||||
* 猎鹰服务ID
|
||||
*/
|
||||
sid?: string | number;
|
||||
|
||||
/**
|
||||
* 服务名称
|
||||
*/
|
||||
sname?: string;
|
||||
|
||||
}
|
||||
|
||||
export interface ServiceQuery extends PageQuery {
|
||||
|
||||
/**
|
||||
* 猎鹰服务ID
|
||||
*/
|
||||
sid?: string | number;
|
||||
|
||||
/**
|
||||
* 服务名称
|
||||
*/
|
||||
sname?: string;
|
||||
|
||||
/**
|
||||
* 日期范围参数
|
||||
*/
|
||||
params?: any;
|
||||
}
|
||||
|
||||
|
||||
|
||||
BIN
src/assets/homeIndex/alarmIMG.png
Normal file
|
After Width: | Height: | Size: 21 KiB |
BIN
src/assets/homeIndex/bottom.png
Normal file
|
After Width: | Height: | Size: 384 KiB |
BIN
src/assets/homeIndex/btn.png
Normal file
|
After Width: | Height: | Size: 5.1 KiB |
BIN
src/assets/homeIndex/btn_cur.png
Normal file
|
After Width: | Height: | Size: 6.7 KiB |
BIN
src/assets/homeIndex/card.png
Normal file
|
After Width: | Height: | Size: 21 KiB |
BIN
src/assets/homeIndex/card1.png
Normal file
|
After Width: | Height: | Size: 29 KiB |
BIN
src/assets/homeIndex/card2.png
Normal file
|
After Width: | Height: | Size: 29 KiB |
BIN
src/assets/homeIndex/card3.png
Normal file
|
After Width: | Height: | Size: 33 KiB |
BIN
src/assets/homeIndex/card4.png
Normal file
|
After Width: | Height: | Size: 30 KiB |
BIN
src/assets/homeIndex/card5.png
Normal file
|
After Width: | Height: | Size: 30 KiB |
BIN
src/assets/homeIndex/card6.png
Normal file
|
After Width: | Height: | Size: 30 KiB |
BIN
src/assets/homeIndex/card7.png
Normal file
|
After Width: | Height: | Size: 36 KiB |
BIN
src/assets/homeIndex/deviceIMG.png
Normal file
|
After Width: | Height: | Size: 23 KiB |
BIN
src/assets/homeIndex/left.png
Normal file
|
After Width: | Height: | Size: 332 KiB |
BIN
src/assets/homeIndex/nav.png
Normal file
|
After Width: | Height: | Size: 129 KiB |
BIN
src/assets/homeIndex/right.png
Normal file
|
After Width: | Height: | Size: 333 KiB |
BIN
src/assets/homeIndex/select.png
Normal file
|
After Width: | Height: | Size: 15 KiB |
BIN
src/assets/homeIndex/top.png
Normal file
|
After Width: | Height: | Size: 189 KiB |
4
src/assets/icons/svg/home.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="_图层_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17.99 18">
|
||||
<path id="_矢量_42" d="M17.82,5.81L9.5.08c-.16-.11-.38-.11-.54,0L.2,5.81c-.13.08-.2.21-.2.35v11.41c0,.24.21.43.46.43h5.54c.25,0,.46-.19.46-.43v-2.48c0-1.42,1.17-2.65,2.68-2.69,1.57-.04,2.85,1.13,2.85,2.58v2.59c0,.24.21.43.46.43h5.08c.25,0,.46-.19.46-.43V6.15c0-.14-.06-.26-.18-.35h.01Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 417 B |
6
src/assets/icons/svg/报警信息1.1.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 16 18">
|
||||
|
||||
<path d="M8.1,3.9c.6,0,1-.5,1-1v-1.9C9.1.5,8.6,0,8.1,0s-1,.4-1,1v1.9c0,.6.4,1,1,1h0ZM3.3,5.7c-.4.4-1,.4-1.4,0l-1.6-1.5c-.4-.4-.4-.9,0-1.3.4-.4,1-.4,1.4,0l1.6,1.5c.4.4.4.9,0,1.3ZM12.6,5.7c.4.4,1,.4,1.4,0l1.6-1.5c.4-.4.4-.9,0-1.3-.4-.4-1-.4-1.4,0l-1.6,1.5c-.4.4-.4.9,0,1.3ZM3,15.4v-5.4c0-2.8,2.3-5.1,5-5.1s5.1,2.3,5.1,5.1v5.4h1.6c.7,0,1.3.6,1.3,1.3s-.6,1.3-1.3,1.3H1.5c-.7,0-1.3-.6-1.3-1.3s.6-1.3,1.3-1.3c0,0,1.6,0,1.6,0ZM10.1,11.3h-1.1c-.1,0-.2,0-.2-.2l.4-2.1c0-.1-.2-.2-.3-.1l-2.9,2.6c0,0,0,.2.1.2h1.2c0,0,.2,0,.2.2l-.4,2.1c0,.1.2.2.3.1l2.9-2.6c.1,0,0-.2-.1-.2Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 699 B |
4
src/assets/icons/svg/控制中心1.1.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 16">
|
||||
<path id="_矢量_54" class="cls-1" d="M13.5,12.6v-1.1h2.2v1.1h2.2v2.3h-2.2v1.1h-2.2v-1.1H0v-2.3h13.5ZM7.9,6.9v-1.1h2.2v1.1h7.9v2.3h-7.9v1.1h-2.2v-1.1H0v-2.3s7.9,0,7.9,0ZM2.2,1.1V0h2.2v1.1h13.5v2.3H4.5v1.1h-2.2v-1.1H0V1.1h2.2Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 356 B |
6
src/assets/icons/svg/数据可视化1.1.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 15">
|
||||
|
||||
<path d="M.8,0h16.4s.1,0,.2,0c0,0,.1,0,.1,0,0,0,.1,0,.1,0,0,0,0,0,.1,0,0,0,0,0,.1.1s0,0,0,.1c0,0,0,.1,0,.2,0,0,0,.1,0,.2v10.8c0,0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,.1,0,.1,0,0,0,0-.1.1s0,0-.1.1c0,0,0,0-.1,0,0,0-.1,0-.1,0s-.1,0-.2,0H.8c0,0-.1,0-.2,0,0,0-.1,0-.1,0,0,0,0,0-.1,0s0,0-.1-.1c0,0,0,0,0-.1s0,0,0-.1c0,0,0-.1,0-.2C0,11.8,0,11.7,0,11.7V.8S0,.7,0,.7c0,0,0-.1,0-.2s0,0,0-.1c0,0,0,0,0-.1s0,0,.1,0c0,0,0,0,.1,0,0,0,.1,0,.1,0C.7,0,.8,0,.8,0h0ZM2.5,6.7h0s0,0,0,0c0,0,0,0,0,0s0,0,0,0,0,0,0,0,0,0,0,0c0,0,0,0,0,0v2.7s0,0,0,0,0,0,0,0c0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0h1s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0,0,0,0,0c0,0,0,0,0,0v-2.7s0,0,0,0,0,0,0,0c0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0h-.9ZM6.5,5h0s0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0c0,0,0,0,0,0v4.3s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0h1s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0,0,0,0,0c0,0,0,0,0,0v-4.3s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0c0,0-.9,0-.9,0ZM10.6,2.5h0s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0,0,0,0,0c0,0,0,0,0,0v6.8s0,0,0,0,0,0,0,0c0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0h1s0,0,0,0c0,0,0,0,0,0s0,0,0,0,0,0,0,0,0,0,0,0c0,0,0,0,0,0V2.8s0,0,0,0,0,0,0,0c0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0h0s-.8,0-.8,0ZM14.7,5.8h0s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0v3.5s0,0,0,0,0,0,0,0c0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0h1s0,0,0,0c0,0,0,0,0,0s0,0,0,0,0,0,0,0,0,0,0,0c0,0,0,0,0,0v-3.5s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0h0s-.8,0-.8,0ZM6.6,14.2v-.5s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0h4.3s0,0,0,0c0,0,0,0,0,0s0,0,0,0,0,0,0,0,0,0,0,0c0,0,0,0,0,0v.5h3.8s0,0,0,0c0,0,0,0,0,0s0,0,0,0,0,0,0,0,0,0,0,0c0,0,0,0,0,0v.2s0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0H2.8s0,0,0,0c0,0,0,0,0,0s0,0,0,0,0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0v-.2s0,0,0,0,0,0,0,0c0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0s0,0,0,0h3.8Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
7
src/assets/icons/svg/日志报表1.1.svg
Normal file
@ -0,0 +1,7 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 16 18">
|
||||
|
||||
<path d="M5.8,2.4h4.4c.4,0,.7-.3.7-.7V.7c0-.4-.3-.7-.7-.7h-4.4c-.4,0-.7.3-.7.7v1.1c0,.4.3.7.7.7Z"/>
|
||||
<path d="M13.8,1.3h-2.3v.7c0,.5-.4.8-.9.8h-5.2c-.5,0-.9-.4-.9-.8v-.7h-2.3C1,1.3,0,2.2,0,3.4v12.5c0,1.1,1,2.1,2.2,2.1h11.5c1.2,0,2.2-.9,2.2-2.1V3.4c0-1.2-1-2.1-2.2-2.1ZM13.2,13.4H3.3c-.3,0-.6-.2-.6-.5s.2-.5.6-.5h9.9c.3,0,.6.2.6.5s-.3.5-.6.5h0ZM13.2,10H3.3c-.3,0-.6-.2-.6-.5s.2-.5.6-.5h9.9c.3,0,.6.2.6.5s-.3.5-.6.5h0ZM13.2,6.5H3.3c-.3,0-.6-.2-.6-.5s.2-.5.6-.5h9.9c.3,0,.6.2.6.5s-.3.5-.6.5h0Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 633 B |
6
src/assets/icons/svg/用户管理1.1.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 18">
|
||||
|
||||
<path d="M16.9,12.8c-.1-.4-.3-.8-.5-1.2l.6-1-.5-.6-1,.6c-.3-.2-.7-.4-1.1-.4l-.3-1.2h-.8l-.3,1.2c-.4,0-.7.2-1.1.4l-1-.6-.5.6.6,1c-.2.4-.4.8-.5,1.2l-1.1.3v.8l1,.3c0,.5.2,1,.5,1.4l-.5.9.5.5.8-.5c.4.3.9.6,1.4.7l.2.9h.8l.2-.9c.3,0,.5-.1.8-.2s.5-.2.7-.4l.8.5.5-.5-.5-.9c.3-.4.4-.9.5-1.4l1-.3v-.8l-1.1-.3s0,0,0,0ZM13.7,15.6h-.2c0,0-.1,0-.2,0,0,0-.1,0-.2,0s-.1,0-.2,0c0,0-.1,0-.2,0,0,0-.1,0-.2-.1s-.1,0-.1-.1c0,0,0,0-.1-.1,0,0,0,0-.1-.1s0-.1-.1-.1c0,0,0-.1,0-.2,0,0,0-.1,0-.2s0-.1,0-.2,0-.1,0-.2c0,0,0-.1,0-.2v-.4c0,0,0-.1,0-.2,0,0,0-.1,0-.2,0,0,0-.1,0-.2s0-.1,0-.2c0,0,0-.1,0-.2s0-.1.1-.1c0,0,0-.1.1-.1,0,0,0,0,.1-.1s.1,0,.1-.1c0,0,.1,0,.2-.1s.1,0,.2,0c0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,.1,0,.2,0h.4c0,0,.1,0,.2,0,0,0,.1,0,.2,0s.1,0,.2,0c0,0,.1,0,.2,0,0,0,.1,0,.2.1s.1,0,.1.1c0,0,0,0,.1.1,0,0,0,0,.1.1s0,.1.1.1c0,0,0,.1,0,.2,0,0,0,.1,0,.2s0,.1,0,.2,0,.1,0,.2c0,0,0,.1,0,.2v.4c0,0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,.1,0,.2s0,.1,0,.2c0,0,0,.1,0,.2s0,.1-.1.1c0,0,0,.1-.1.1,0,0,0,0-.1.1s-.1,0-.1.1c0,0-.1,0-.2.1,0,0-.1,0-.2,0,0,0-.1,0-.2,0,0,0-.1,0-.2,0,0,0-.1,0-.2,0,0,0-.2,0-.2,0ZM10.4,9.6c-.6-.5-1.3-.8-2-1,1.4-.7,2.5-2.3,2.5-4S8.9,0,6.5,0,2.2,2,2.2,4.5s1,3.3,2.4,4C1.9,9.4,0,11.9,0,14.8,0,14.8,3.3,15.8,6.6,15.8s1.7,0,2.5-.2c-.1-.3-.2-.7-.3-1,0-.4-.1-.7-.1-1.1,0-1.6.7-3,1.7-3.9h0Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
8
src/assets/icons/svg/租户管理1.1.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 18">
|
||||
|
||||
<path d="M7.4,12.7c.3-2,1.8-3.2,2.4-3.7h0c0,0,.2,0,.3-.2,1.9-.7,3.2-2.3,3.2-4.3,0-2.5-2.3-4.6-5.1-4.6S3.1,2.1,3.1,4.6s1.4,3.6,3.3,4.3c-.9.2-1.8.6-2.5,1C.6,11.7,0,14.2,0,17.7s.3.3.6.3h9.9l-.9-.4c-.9-.4-2.7-2.3-2.3-4.9h0Z"/>
|
||||
<path d="M13.2,11.6l-1.7,1.4v2.4h.7v-1.2h2v1.2h.7v-2.4l-1.7-1.4h0ZM14.9,11.9h-.3l.3.3v-.3Z"/>
|
||||
<path d="M13.2,9.1c-2.7,0-4.8,2-4.8,4.4s2.2,4.4,4.8,4.4,4.8-2,4.8-4.4-2.1-4.4-4.8-4.4ZM15.9,13.6c0,0-.1,0-.3,0s-.1,0-.2,0v2c0,.2-.2.4-.5.4h-1.6v-1.2h-.6v1.2h-1.6c-.3,0-.5-.2-.5-.4v-2s0,0-.2,0-.2,0-.3,0,0-.2,0-.2,0-.2,0-.2l2.4-2c.3-.2.6-.2.9,0l.4.4c0,0,.2-.2.3-.2h.9c.2,0,.3.2.3.3v.8c0,.1,0,.2-.1.2l.5.5c0,0,0,.1,0,.2,0,0,0,.1,0,.2h0Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 804 B |
6
src/assets/icons/svg/维修记录1.1.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 18">
|
||||
|
||||
<path d="M17.2,2.8s0,0,0,0c-.1-.1-.3-.1-.4,0l-3.2,3.2c-.4.4-1,.4-1.4,0h-.1c-.4-.5-.4-1.1,0-1.5l3.2-3.2s0,0,0,0c0-.1,0-.3-.1-.4-2.2-1.3-5.1-1-7,.9-1.4,1.4-1.9,3.2-1.6,5,0,.3,0,.7-.3,1L0,13.9c0,0,0,.2,0,.2l3.8,3.8c0,0,.2,0,.2,0l6.2-6.2c.2-.2.6-.3,1-.3,1.8.3,3.7-.2,5-1.6,1.9-1.9,2.2-4.8.9-7h0Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 428 B |
4
src/assets/icons/svg/联调中心1.1.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 18">
|
||||
<path id="_联调中心图标" class="cls-1" d="M9.8,12.3c-1.1,0-2.1-.4-2.9-1.2-.2-.2-.3-.5-.3-.8s.1-.6.3-.8c.4-.4,1.2-.4,1.6,0,.8.8,2.1.7,3-.2l3.5-3.5c.5-.5.7-1.1.7-1.7s0-.9-.6-1.3c-.5-.5-1-.6-1.4-.5-.6,0-1.1.3-1.6.7l-2,2c-.5-.5-2.4-.8-2.9-.3l3.3-3.3c.9-.9,2-1.4,3.1-1.4,1.2,0,2.3.4,3.1,1.2.8.8,1.2,1.8,1.2,2.9s-.5,2.4-1.4,3.3l-3.5,3.5c-.9.9-2.1,1.4-3.3,1.4M4.9,7.1l-3.5,3.5C.5,11.5,0,12.7,0,13.9s.4,2.1,1.2,2.9c.8.8,1.9,1.3,3.1,1.2,1.1,0,2.2-.5,3.1-1.4l3.3-3.3c-.5.5-2.5.2-2.9-.3l-2,2c-.4.4-1,.7-1.6.7-.4,0-.9,0-1.4-.6-.5-.4-.5-1-.5-1.3,0-.6.3-1.2.7-1.7l3.5-3.5c.9-.9,2.2-1,3-.2s.5.3.8.3.6-.1.8-.3.3-.5.3-.8-.1-.6-.3-.8c-.8-.8-1.9-1.2-2.9-1.2s-2.4.5-3.3,1.4h0Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 793 B |
6
src/assets/icons/svg/设备管理1.1.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 18">
|
||||
|
||||
<path d="M17.6,14.4l-6.4,3.5s-.1,0-.1,0c0,0-.1,0-.2,0h-.2c0,0-.1,0-.2,0,0,0-.1,0-.2,0,0,0-.1,0-.1,0s0,0-.1-.1,0,0-.1-.1c0-.1-.1-.3-.1-.4v-5.9c0,0,0-.1,0-.2,0,0,0-.1,0-.2,0,0,0-.1.1-.2,0,0,.1,0,.2-.1l6.4-3.5s.1,0,.1,0,.1,0,.2,0h.2c0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,.1,0,.1,0,0,0,0,0,.1.1s0,0,.1.1c0,.1.1.3.1.4v5.9c0,0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,.1-.1.2,0,0-.1,0-.2.1h0ZM.4,14.4c0,0-.1,0-.2-.1,0,0,0-.1-.1-.2,0,0,0-.1,0-.2C0,13.8,0,13.7,0,13.6v-5.9C0,7.3.4,7,.9,7s.3,0,.4.1l6.4,3.5c0,0,.1,0,.2.1,0,0,0,.1.1.2s0,.1,0,.2,0,.1,0,.2v5.9c0,.5-.4.8-.9.8s-.3,0-.4-.1L.4,14.4H.4ZM8.6.1c.3-.1.6-.1.9,0l7.3,3.9s0,0,0,0,0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0v.2s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0l-7.3,3.9c0,0-.1,0-.2,0,0,0-.1,0-.2,0s-.1,0-.2,0-.1,0-.2,0L1.3,5.5s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0v-.2s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0L8.6.1h0Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
6
src/assets/icons/svg/首页1.1.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 18 18">
|
||||
|
||||
<path d="M17.8,5.8L9.5,0c-.2-.1-.4-.1-.5,0L.2,5.8c-.1,0-.2.2-.2.3v11.4c0,.2.2.4.5.4h5.5c.2,0,.5-.2.5-.4v-2.5c0-1.4,1.2-2.6,2.7-2.7,1.6,0,2.8,1.1,2.8,2.6v2.6c0,.2.2.4.5.4h5.1c.2,0,.5-.2.5-.4V6.2c0-.1,0-.3-.2-.3h0Z"/>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 345 B |
BIN
src/assets/images/di.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
src/assets/images/diAc.png
Normal file
|
After Width: | Height: | Size: 2.5 KiB |
BIN
src/assets/images/high.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
src/assets/images/highAc.png
Normal file
|
After Width: | Height: | Size: 2.5 KiB |
BIN
src/assets/images/mapLocation.png
Normal file
|
After Width: | Height: | Size: 2.7 KiB |
BIN
src/assets/images/mapPoint.png
Normal file
|
After Width: | Height: | Size: 5.5 KiB |
BIN
src/assets/images/mapWarn.png
Normal file
|
After Width: | Height: | Size: 7.6 KiB |
BIN
src/assets/images/rb.png
Normal file
|
After Width: | Height: | Size: 3.1 KiB |
BIN
src/assets/images/rbAc.png
Normal file
|
After Width: | Height: | Size: 3.0 KiB |
BIN
src/assets/images/sg.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
src/assets/images/sgAc.png
Normal file
|
After Width: | Height: | Size: 3.1 KiB |
BIN
src/assets/images/zhong.png
Normal file
|
After Width: | Height: | Size: 2.5 KiB |
BIN
src/assets/images/zhongAc.png
Normal file
|
After Width: | Height: | Size: 2.6 KiB |
BIN
src/assets/index/IMG.png
Normal file
|
After Width: | Height: | Size: 1.2 KiB |
@ -88,12 +88,7 @@ div:focus {
|
||||
.pl-5 {
|
||||
padding-left: 5px;
|
||||
}
|
||||
.p-2{
|
||||
background: rgba(247, 248, 252, 1);
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
|
||||
@ -57,9 +57,9 @@ const props = defineProps({
|
||||
// 数量限制
|
||||
limit: propTypes.number.def(5),
|
||||
// 大小限制(MB)
|
||||
fileSize: propTypes.number.def(5),
|
||||
fileSize: propTypes.number.def(200),
|
||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||
fileType: propTypes.array.def(['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf']),
|
||||
fileType: propTypes.array.def(['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf','apk','wgt','html','mp3','mp4']),
|
||||
// 是否显示提示
|
||||
isShowTip: propTypes.bool.def(true),
|
||||
// 禁用组件(仅查看文件)
|
||||
|
||||
@ -28,7 +28,6 @@ function copyTextToClipboard(input: string, { target = document.body } = {}) {
|
||||
element.value = input;
|
||||
// Prevent keyboard from showing on mobile
|
||||
element.setAttribute('readonly', '');
|
||||
|
||||
element.style.contain = 'strict';
|
||||
element.style.position = 'absolute';
|
||||
element.style.left = '-9999px';
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="avatar-wrapper">
|
||||
<!-- <img :src="userStore.avatar" class="user-avatar" /> -->
|
||||
<img src="@/assets/images/avatar.png" class="user-avatar" />
|
||||
<div style="margin-left: 10px;">{{ useUserStore().nickname }}</div>
|
||||
<div style="margin-left: 10px; white-space: nowrap; font-size: 14px;">{{ useUserStore().nickname }}</div>
|
||||
<el-icon><caret-bottom /></el-icon>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
|
||||
@ -1,13 +1,16 @@
|
||||
<template>
|
||||
<div v-if="!item.hidden">
|
||||
<template v-if="hasOneShowingChild(item, item.children) && (!onlyOneChild.children || onlyOneChild.noShowingChildren) && !item.alwaysShow">
|
||||
<template
|
||||
v-if="hasOneShowingChild(item, item.children) && (!onlyOneChild.children || onlyOneChild.noShowingChildren) && !item.alwaysShow">
|
||||
<app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path, onlyOneChild.query)">
|
||||
<span @click="handleMenuClick(onlyOneChild, $event)">
|
||||
<el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{ 'submenu-title-noDropdown': !isNest }">
|
||||
<svg-icon :icon-class="onlyOneChild.meta.icon || (item.meta && item.meta.icon)" />
|
||||
<template #title>
|
||||
<span class="menu-title" :title="hasTitle(onlyOneChild.meta.title)">{{ onlyOneChild.meta.title }}</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
</span>
|
||||
</app-link>
|
||||
</template>
|
||||
|
||||
@ -17,14 +20,8 @@
|
||||
<span class="menu-title" :title="hasTitle(item.meta?.title)">{{ item.meta?.title }}</span>
|
||||
</template>
|
||||
|
||||
<sidebar-item
|
||||
v-for="(child, index) in item.children"
|
||||
:key="child.path + index"
|
||||
:is-nest="true"
|
||||
:item="child"
|
||||
:base-path="resolvePath(child.path)"
|
||||
class="nest-menu"
|
||||
/>
|
||||
<sidebar-item v-for="(child, index) in item.children" :key="child.path + index" :is-nest="true" :item="child"
|
||||
:base-path="resolvePath(child.path)" class="nest-menu" />
|
||||
</el-sub-menu>
|
||||
</div>
|
||||
</template>
|
||||
@ -77,8 +74,25 @@ const hasOneShowingChild = (parent: RouteRecordRaw, children?: RouteRecordRaw[])
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
// 处理菜单点击,完全控制跳转行为
|
||||
const handleMenuClick = (route, event) => {
|
||||
console.log(route, 'route');
|
||||
if (route.meta.openInNewTab) {
|
||||
// 完全阻止默认行为和事件冒泡
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
console.log('Opening in new tab:', route);
|
||||
const resolvedRoute = router.resolve({
|
||||
name: route.name || route.path
|
||||
});
|
||||
const fullUrl = new URL(resolvedRoute.href, window.location.origin).href;
|
||||
window.open(fullUrl, '_blank');
|
||||
} else {
|
||||
}
|
||||
};
|
||||
const resolvePath = (routePath: string, routeQuery?: string): any => {
|
||||
|
||||
if (isExternal(routePath)) {
|
||||
return routePath;
|
||||
}
|
||||
|
||||
@ -39,6 +39,12 @@ export const constantRoutes: RouteRecordRaw[] = [
|
||||
component: () => import('@/views/error/401.vue'),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: "/homeIndex",
|
||||
name: "HomeIndex",
|
||||
component: () => import("@/views/homeIndex/index.vue"),
|
||||
meta: { title: '数据大屏', icon: '首页1.1', preload: true, keepAlive: true, openInNewTab: true },
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
component: Layout,
|
||||
@ -48,10 +54,11 @@ export const constantRoutes: RouteRecordRaw[] = [
|
||||
path: '/index',
|
||||
component: () => import('@/views/index.vue'),
|
||||
name: 'Index',
|
||||
meta: { title: '首页', icon: 'dashboard', affix: true }
|
||||
meta: { title: '首页', icon: '首页1.1', affix: true, keepAlive: false }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/user',
|
||||
component: Layout,
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
//日期格式化
|
||||
function DateFormat(date, format) {
|
||||
if (!date) {
|
||||
return '';
|
||||
@ -39,7 +40,7 @@ function DateFormat(date, format) {
|
||||
return formatMap[match];
|
||||
});
|
||||
}
|
||||
|
||||
//日期加减
|
||||
function DateAdd(datePart, number, date) {
|
||||
// 创建日期的副本,避免修改原日期对象
|
||||
const newDate = new Date(date.getTime());
|
||||
@ -71,7 +72,47 @@ function DateAdd(datePart, number, date) {
|
||||
return newDate;
|
||||
}
|
||||
|
||||
//将字节转换成0.53kb 10.13MB 1GB这样的友好单位
|
||||
function formatBytes(bytes, decimals = 2) {
|
||||
// 处理0字节的情况
|
||||
if (bytes === 0) return '0 B';
|
||||
|
||||
// 定义单位和换算比例
|
||||
const k = 1024;
|
||||
const dm = decimals < 0 ? 0 : decimals;
|
||||
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
|
||||
|
||||
// 计算最合适的单位
|
||||
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||
|
||||
// 格式化并返回结果
|
||||
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
|
||||
}
|
||||
|
||||
//数组某个字段取唯一值
|
||||
function getUniqueValues(dataSource, field) {
|
||||
if(!field){
|
||||
return [];
|
||||
}
|
||||
// 使用Set来存储唯一值,因为Set会自动去重
|
||||
const uniqueValues = new Set();
|
||||
|
||||
// 遍历数据源
|
||||
for (const item of dataSource) {
|
||||
// 检查对象是否包含指定字段
|
||||
if (item.hasOwnProperty(field)) {
|
||||
uniqueValues.add(item[field]);
|
||||
}
|
||||
}
|
||||
|
||||
// 将Set转换为数组并返回
|
||||
return Array.from(uniqueValues);
|
||||
}
|
||||
|
||||
|
||||
export default{
|
||||
DateFormat:DateFormat,
|
||||
DateAdd:DateAdd
|
||||
DateAdd:DateAdd,
|
||||
formatBytes:formatBytes,
|
||||
getUniqueValues:getUniqueValues
|
||||
}
|
||||
211
src/utils/coordinate-transform.ts
Normal file
@ -0,0 +1,211 @@
|
||||
/**
|
||||
* 坐标系转换工具
|
||||
* WGS84(地球坐标系)与 GCJ02(火星坐标系)相互转换
|
||||
*/
|
||||
|
||||
// 地标转国测常量
|
||||
const X_PI = (3.14159265358979324 * 3000.0) / 180.0;
|
||||
const PI = 3.1415926535897932384626;
|
||||
const A = 6378245.0; // 卫星椭球坐标投影到平面地图坐标系的投影因子
|
||||
const EE = 0.00669342162296594323; // 椭球的偏心率
|
||||
|
||||
/**
|
||||
* 坐标点类型定义
|
||||
*/
|
||||
export interface CoordinatePoint {
|
||||
lng: number; // 经度
|
||||
lat: number; // 纬度
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断是否在国内,在中国国内的经纬度才需要做偏移
|
||||
* @param lng 经度
|
||||
* @param lat 纬度
|
||||
* @returns 是否在国外
|
||||
*/
|
||||
function outOfChina(lng: number, lat: number): boolean {
|
||||
return (
|
||||
lng < 72.004 ||
|
||||
lng > 137.8347 ||
|
||||
lat < 0.8293 ||
|
||||
lat > 55.8271
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 转化经度
|
||||
* @param lng 经度
|
||||
* @param lat 纬度
|
||||
* @returns 转换后的经度偏移量
|
||||
*/
|
||||
function transformLng(lng: number, lat: number): number {
|
||||
let ret =
|
||||
300.0 +
|
||||
lng +
|
||||
2.0 * lat +
|
||||
0.1 * lng * lng +
|
||||
0.1 * lng * lat +
|
||||
0.1 * Math.sqrt(Math.abs(lng));
|
||||
|
||||
ret +=
|
||||
((20.0 * Math.sin(6.0 * lng * PI) +
|
||||
20.0 * Math.sin(2.0 * lng * PI)) *
|
||||
2.0) /
|
||||
3.0;
|
||||
|
||||
ret +=
|
||||
((20.0 * Math.sin(lng * PI) +
|
||||
40.0 * Math.sin((lng / 3.0) * PI)) *
|
||||
2.0) /
|
||||
3.0;
|
||||
|
||||
ret +=
|
||||
((150.0 * Math.sin((lng / 12.0) * PI) +
|
||||
300.0 * Math.sin((lng / 30.0) * PI)) *
|
||||
2.0) /
|
||||
3.0;
|
||||
|
||||
return ret;
|
||||
}
|
||||
|
||||
/**
|
||||
* 转化纬度
|
||||
* @param lng 经度
|
||||
* @param lat 纬度
|
||||
* @returns 转换后的纬度偏移量
|
||||
*/
|
||||
function transformLat(lng: number, lat: number): number {
|
||||
let ret =
|
||||
-100.0 +
|
||||
2.0 * lng +
|
||||
3.0 * lat +
|
||||
0.2 * lat * lat +
|
||||
0.1 * lng * lat +
|
||||
0.2 * Math.sqrt(Math.abs(lng));
|
||||
|
||||
ret +=
|
||||
((20.0 * Math.sin(6.0 * lng * PI) +
|
||||
20.0 * Math.sin(2.0 * lng * PI)) *
|
||||
2.0) /
|
||||
3.0;
|
||||
|
||||
ret +=
|
||||
((20.0 * Math.sin(lat * PI) +
|
||||
40.0 * Math.sin((lat / 3.0) * PI)) *
|
||||
2.0) /
|
||||
3.0;
|
||||
|
||||
ret +=
|
||||
((160.0 * Math.sin((lat / 12.0) * PI) +
|
||||
320 * Math.sin((lat * PI) / 30.0)) *
|
||||
2.0) /
|
||||
3.0;
|
||||
|
||||
return ret;
|
||||
}
|
||||
|
||||
/**
|
||||
* WGS84坐标系转GCJ02坐标系(地球坐标系转火星坐标系)
|
||||
* @param lng 经度
|
||||
* @param lat 纬度
|
||||
* @returns 转换后的坐标 [经度, 纬度]
|
||||
*/
|
||||
export function wgs84ToGcj02(lng: number, lat: number): [number, number] {
|
||||
if (outOfChina(lng, lat)) {
|
||||
return [lng, lat];
|
||||
}
|
||||
|
||||
const dlat = transformLat(lng - 105.0, lat - 35.0);
|
||||
const dlng = transformLng(lng - 105.0, lat - 35.0);
|
||||
const radlat = (lat / 180.0) * PI;
|
||||
let magic = Math.sin(radlat);
|
||||
magic = 1 - EE * magic * magic;
|
||||
const sqrtmagic = Math.sqrt(magic);
|
||||
|
||||
const transformedLat =
|
||||
(dlat * 180.0) /
|
||||
(((A * (1 - EE)) / (magic * sqrtmagic)) * PI);
|
||||
const transformedLng =
|
||||
(dlng * 180.0) / ((A / sqrtmagic) * Math.cos(radlat) * PI);
|
||||
|
||||
const mglat = lat + transformedLat;
|
||||
const mglng = lng + transformedLng;
|
||||
|
||||
return [mglng, mglat];
|
||||
}
|
||||
|
||||
/**
|
||||
* GCJ02坐标系转WGS84坐标系(火星坐标系转地球坐标系)
|
||||
* @param lng 经度
|
||||
* @param lat 纬度
|
||||
* @returns 转换后的坐标 [经度, 纬度]
|
||||
*/
|
||||
export function gcj02ToWgs84(lng: number, lat: number): [number, number] {
|
||||
if (outOfChina(lng, lat)) {
|
||||
return [lng, lat];
|
||||
}
|
||||
|
||||
const dlat = transformLat(lng - 105.0, lat - 35.0);
|
||||
const dlng = transformLng(lng - 105.0, lat - 35.0);
|
||||
const radlat = (lat / 180.0) * PI;
|
||||
let magic = Math.sin(radlat);
|
||||
magic = 1 - EE * magic * magic;
|
||||
const sqrtmagic = Math.sqrt(magic);
|
||||
|
||||
const transformedLat = (dlat * 180.0) / ((A * (1 - EE)) / (magic * sqrtmagic) * PI);
|
||||
const transformedLng = (dlng * 180.0) / (A / sqrtmagic * Math.cos(radlat) * PI);
|
||||
|
||||
const mglat = lat + transformedLat;
|
||||
const mglng = lng + transformedLng;
|
||||
|
||||
return [lng * 2 - mglng, lat * 2 - mglat];
|
||||
}
|
||||
|
||||
/**
|
||||
* 对象形式的坐标转换 - WGS84转GCJ02
|
||||
* @param point 坐标点对象 {lng: 经度, lat: 纬度}
|
||||
* @returns 转换后的坐标点对象
|
||||
*/
|
||||
export function wgs84ToGcj02Point(point: CoordinatePoint): CoordinatePoint {
|
||||
const [lng, lat] = wgs84ToGcj02(point.lng, point.lat);
|
||||
return { lng, lat };
|
||||
}
|
||||
|
||||
/**
|
||||
* 对象形式的坐标转换 - GCJ02转WGS84
|
||||
* @param point 坐标点对象 {lng: 经度, lat: 纬度}
|
||||
* @returns 转换后的坐标点对象
|
||||
*/
|
||||
export function gcj02ToWgs84Point(point: CoordinatePoint): CoordinatePoint {
|
||||
const [lng, lat] = gcj02ToWgs84(point.lng, point.lat);
|
||||
return { lng, lat };
|
||||
}
|
||||
|
||||
/**
|
||||
* 批量转换坐标点 - WGS84转GCJ02
|
||||
* @param points 坐标点数组
|
||||
* @returns 转换后的坐标点数组
|
||||
*/
|
||||
export function batchWgs84ToGcj02(points: CoordinatePoint[]): CoordinatePoint[] {
|
||||
return points.map(point => wgs84ToGcj02Point(point));
|
||||
}
|
||||
|
||||
/**
|
||||
* 批量转换坐标点 - GCJ02转WGS84
|
||||
* @param points 坐标点数组
|
||||
* @returns 转换后的坐标点数组
|
||||
*/
|
||||
export function batchGcj02ToWgs84(points: CoordinatePoint[]): CoordinatePoint[] {
|
||||
return points.map(point => gcj02ToWgs84Point(point));
|
||||
}
|
||||
|
||||
// 默认导出
|
||||
export default {
|
||||
wgs84ToGcj02,
|
||||
gcj02ToWgs84,
|
||||
wgs84ToGcj02Point,
|
||||
gcj02ToWgs84Point,
|
||||
batchWgs84ToGcj02,
|
||||
batchGcj02ToWgs84,
|
||||
outOfChina
|
||||
};
|
||||
@ -316,3 +316,15 @@ export const removeClass = (ele: HTMLElement, cls: string) => {
|
||||
export const isExternal = (path: string) => {
|
||||
return /^(https?:|http?:|mailto:|tel:)/.test(path);
|
||||
};
|
||||
|
||||
// 导出坐标系转换工具
|
||||
export { default as coordinateTransform } from './coordinate-transform';
|
||||
export type { CoordinatePoint } from './coordinate-transform';
|
||||
export {
|
||||
wgs84ToGcj02,
|
||||
gcj02ToWgs84,
|
||||
wgs84ToGcj02Point,
|
||||
gcj02ToWgs84Point,
|
||||
batchWgs84ToGcj02,
|
||||
batchGcj02ToWgs84
|
||||
} from './coordinate-transform';
|
||||
@ -1,4 +1,4 @@
|
||||
import { ref, onUnmounted } from 'vue'; // 修复:导入必要的Vue API
|
||||
|
||||
import * as Paho from 'paho-mqtt';
|
||||
|
||||
// MQTT消息类型定义
|
||||
@ -9,47 +9,51 @@ export interface MqttMessage {
|
||||
retained: boolean;
|
||||
time: Date;
|
||||
}
|
||||
|
||||
// 订阅选项
|
||||
export interface SubscribeOptions {
|
||||
qos: 0 | 1 | 2;
|
||||
}
|
||||
|
||||
// MQTT配置信息
|
||||
const MQTT_CONFIG = {
|
||||
// 连接地址(添加协议类型)
|
||||
protocol: 'ws', // 关键:明确协议(ws或wss)
|
||||
host: '47.120.79.150',
|
||||
port: 9083,
|
||||
// 根据当前页面协议自动选择MQTT配置
|
||||
const getMqttConfig = () => {
|
||||
// 检测当前页面协议(http: 或 https:)
|
||||
//const isHttps = window.location.protocol === 'https:';
|
||||
|
||||
const isHttps = import.meta.env.VITE_APP_ENV === 'production' || window.location.protocol === 'https:';
|
||||
console.log(isHttps,'检测环境');
|
||||
|
||||
return {
|
||||
// 自动切换协议:https页面用wss,http页面用ws
|
||||
protocol: isHttps ? 'wss' : 'ws',
|
||||
host: 'www.cnxhyc.com',
|
||||
// 自动切换端口:https对应9084,http对应9083
|
||||
port: isHttps ? 9084 : 9083,
|
||||
// 认证信息
|
||||
username: 'admin',
|
||||
password: '#YtvpSfCNG',
|
||||
// 客户端ID(添加时间戳确保唯一性)
|
||||
clientId: `vue3-mqtt-client-${Date.now()}-${Math.random().toString(36).substring(2, 10)}`,
|
||||
// 连接选项
|
||||
cleanSession: true,
|
||||
keepAliveInterval: 60,
|
||||
reconnect: true,
|
||||
};
|
||||
};
|
||||
const MQTT_CONFIG = getMqttConfig();
|
||||
|
||||
// MQTT客户端组合式API
|
||||
export function useMqtt() {
|
||||
// 客户端实例
|
||||
let client: Paho.Client | null = null;
|
||||
|
||||
// 状态管理(修复:已导入ref)
|
||||
const connected = ref(false);
|
||||
const connecting = ref(false);
|
||||
const error = ref<Error | null>(null);
|
||||
const messages = ref<MqttMessage[]>([]);
|
||||
const subscribedTopics = ref<string[]>([]);
|
||||
|
||||
// 事件回调
|
||||
const connectCallbacks: (() => void)[] = [];
|
||||
const messageCallbacks: ((message: MqttMessage) => void)[] = [];
|
||||
const errorCallbacks: ((err: Error) => void)[] = [];
|
||||
const disconnectCallbacks: (() => void)[] = [];
|
||||
|
||||
// 修复:移除无用的p0参数,connect方法不接受回调(通过onConnect注册)
|
||||
const connect = () => {
|
||||
if (connected.value || connecting.value) return;
|
||||
@ -57,7 +61,13 @@ export function useMqtt() {
|
||||
error.value = null;
|
||||
|
||||
try {
|
||||
// 创建客户端实例(添加协议参数)
|
||||
// 打印当前使用的配置(方便调试)
|
||||
console.log('当前MQTT连接配置:', {
|
||||
protocol: MQTT_CONFIG.protocol,
|
||||
host: MQTT_CONFIG.host,
|
||||
port: MQTT_CONFIG.port,
|
||||
clientId: MQTT_CONFIG.clientId
|
||||
});
|
||||
client = new Paho.Client(
|
||||
MQTT_CONFIG.host,
|
||||
MQTT_CONFIG.port,
|
||||
@ -71,6 +81,7 @@ export function useMqtt() {
|
||||
cleanSession: MQTT_CONFIG.cleanSession,
|
||||
keepAliveInterval: MQTT_CONFIG.keepAliveInterval,
|
||||
reconnect: MQTT_CONFIG.reconnect,
|
||||
useSSL: MQTT_CONFIG.protocol === 'wss', // 关键:根据协议自动启用 SSL
|
||||
|
||||
// 连接成功回调
|
||||
onSuccess: () => {
|
||||
|
||||
113
src/utils/timeConverter.ts
Normal file
@ -0,0 +1,113 @@
|
||||
/**
|
||||
* 时间转换工具类
|
||||
* 提供时间格式化、时间差计算等功能
|
||||
*/
|
||||
export class TimeConverter {
|
||||
/**
|
||||
* 检查时间字符串是否有效
|
||||
* @param timeStr 时间字符串
|
||||
* @returns 是否有效的时间
|
||||
*/
|
||||
static isValidTime(timeStr: string): boolean {
|
||||
if (!timeStr) return false;
|
||||
return !isNaN(new Date(timeStr).getTime());
|
||||
}
|
||||
|
||||
/**
|
||||
* 格式化时间
|
||||
* @param timeStr 时间字符串
|
||||
* @param format 格式,可选值: 'YYYY-MM-DD', 'HH:mm:ss', 'YYYY-MM-DD HH:mm:ss'
|
||||
* @returns 格式化后的时间字符串
|
||||
*/
|
||||
static formatTime(timeStr: string, format: 'YYYY-MM-DD' | 'HH:mm:ss' | 'YYYY-MM-DD HH:mm:ss' = 'YYYY-MM-DD HH:mm:ss'): string {
|
||||
if (!this.isValidTime(timeStr)) return '无效时间';
|
||||
|
||||
const date = new Date(timeStr);
|
||||
const year = date.getFullYear();
|
||||
const month = this.padZero(date.getMonth() + 1);
|
||||
const day = this.padZero(date.getDate());
|
||||
const hours = this.padZero(date.getHours());
|
||||
const minutes = this.padZero(date.getMinutes());
|
||||
const seconds = this.padZero(date.getSeconds());
|
||||
|
||||
switch (format) {
|
||||
case 'YYYY-MM-DD':
|
||||
return `${year}-${month}-${day}`;
|
||||
case 'HH:mm:ss':
|
||||
return `${hours}:${minutes}:${seconds}`;
|
||||
case 'YYYY-MM-DD HH:mm:ss':
|
||||
default:
|
||||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 计算与当前时间的差值(格式为 HH:mm:ss)
|
||||
* @param startTimeStr 起始时间字符串
|
||||
* @returns 格式化的时间差字符串
|
||||
*/
|
||||
static calculateTimeDiff(startTimeStr: string): string {
|
||||
if (!this.isValidTime(startTimeStr)) return '';
|
||||
|
||||
const startTime = new Date(startTimeStr).getTime();
|
||||
const nowTime = new Date().getTime();
|
||||
const diffMs = nowTime - startTime;
|
||||
|
||||
// 处理未来时间
|
||||
if (diffMs < 0) {
|
||||
return '00:00:00';
|
||||
}
|
||||
|
||||
// 计算总秒数
|
||||
const totalSeconds = Math.floor(diffMs / 1000);
|
||||
|
||||
// 计算时、分、秒
|
||||
const hours = this.padZero(Math.floor(totalSeconds / 3600));
|
||||
const minutes = this.padZero(Math.floor((totalSeconds % 3600) / 60));
|
||||
const seconds = this.padZero(totalSeconds % 60);
|
||||
|
||||
return `${hours}:${minutes}:${seconds}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 数字补零
|
||||
* @param num 数字
|
||||
* @returns 补零后的字符串
|
||||
*/
|
||||
private static padZero(num: number): string {
|
||||
return num < 10 ? `0${num}` : num.toString();
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建一个时间差更新定时器
|
||||
* @param startTimeStr 起始时间字符串
|
||||
* @param callback 回调函数,接收计算后的时间差
|
||||
* @param interval 刷新间隔(毫秒)
|
||||
* @returns 定时器ID,用于清除定时器
|
||||
*/
|
||||
static createTimeDiffTimer(
|
||||
startTimeStr: string,
|
||||
callback: (diffText: string) => void,
|
||||
interval: number = 1000
|
||||
): number {
|
||||
// 立即执行一次
|
||||
callback(this.calculateTimeDiff(startTimeStr));
|
||||
|
||||
// 设置定时器
|
||||
const timerId = window.setInterval(() => {
|
||||
callback(this.calculateTimeDiff(startTimeStr));
|
||||
}, interval);
|
||||
|
||||
return timerId;
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除时间差更新定时器
|
||||
* @param timerId 定时器ID
|
||||
*/
|
||||
static clearTimeDiffTimer(timerId: number | null): void {
|
||||
if (timerId) {
|
||||
clearInterval(timerId);
|
||||
}
|
||||
}
|
||||
}
|
||||
1090
src/views/controlCenter/018A/index.vue
Normal file
886
src/views/controlCenter/100J/index.vue
Normal file
@ -0,0 +1,886 @@
|
||||
<template>
|
||||
<div class="device-page p-2">
|
||||
<!-- 头部信息栏 -->
|
||||
<div class="header-bar">
|
||||
<div>设备名称:{{ deviceDetail.deviceName }}</div>
|
||||
<div>设备型号:{{ deviceDetail.deviceImei }}</div>
|
||||
<div class="device-status">设备状态:
|
||||
<span :class="{ online: deviceDetail.onlineStatus === 1, offline: deviceDetail?.onlineStatus === 0 }">
|
||||
{{ deviceDetail.onlineStatus === 1 ? '在线' : '离线' }}
|
||||
</span>
|
||||
</div>
|
||||
<div>电量:{{ deviceDetail.batteryPercentage || 0 }}%</div>
|
||||
<div>续航:{{ deviceDetail.batteryRemainingTime || "0" }} 分钟</div>
|
||||
</div>
|
||||
|
||||
<!-- 主体内容区域 -->
|
||||
<div class="content-wrapper">
|
||||
<el-row :gutter="20" class="content-row" :class="deviceDetail.alarmStatus == 1 ? '' : 'displayNone'">
|
||||
<el-col :lg="24" :xs="24">
|
||||
<div class="staticRwo" :class="deviceDetail.alarmStatus == 1 ? '' : 'displayNone'"
|
||||
@click="showClose()">
|
||||
设备强制报警中!
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 第一行:灯光模式 + 灯光亮度、强制报警、位置信息 -->
|
||||
<el-row :gutter="20" class="content-row">
|
||||
<el-col :lg="16" :xs="24">
|
||||
<div class="content-card">
|
||||
<h4 class="section-title">报警模式</h4>
|
||||
<div class="light-mode">
|
||||
<!-- 使用v-for循环渲染灯光模式卡片 -->
|
||||
<div class="mode-card" :class="{ 'active': mode.active }"
|
||||
@click.stop="handleVoiceType(mode.id)" v-for="mode in sta_VoiceType" :key="mode.id">
|
||||
<img :src="mode.active ? mode.activeIcon : mode.icon" :alt="mode.name"
|
||||
class="mode-icon" />
|
||||
<div class="mode-name">{{ mode.name }}</div>
|
||||
<el-switch v-model="mode.switchStatusVioice" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :lg="8" :xs="24">
|
||||
<div class="brightness-alarm">
|
||||
<el-button type="danger" class="alarm-btn" @click="forceAlarm" :loading="forceAlarmLoading"
|
||||
v-if="deviceDetail.alarmStatus === 0 || deviceDetail.alarmStatus === null"
|
||||
:loading-text="forceAlarmLoading ? '报警中...' : '强制报警'"> {{
|
||||
forceAlarmLoading ? '报警中' : '强制报警' }}</el-button>
|
||||
</div>
|
||||
<div class="content-card_gps">
|
||||
<h4 class="section-title">位置信息</h4>
|
||||
<div class="location-info">
|
||||
<div class="location-item">
|
||||
<span class="location-icon"></span>
|
||||
<span>经纬度 {{ deviceDetail && deviceDetail.longitude ?
|
||||
Number(deviceDetail.longitude).toFixed(4) : '无' }}
|
||||
{{ deviceDetail && deviceDetail.latitude ? Number(deviceDetail.latitude).toFixed(4)
|
||||
: '无' }} </span>
|
||||
</div>
|
||||
<div class="location-item">
|
||||
|
||||
<div>地址 <span class="lacatin_gps">{{ deviceDetail.address || "未获取到地址" }}</span></div>
|
||||
<el-button link type="primary" class="view-btn"
|
||||
@click="lookMap(deviceDetail)">查看</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 第二行:人员信息登记 + 发送信息 -->
|
||||
<el-row :gutter="20" class="content-row">
|
||||
<el-col :lg="16" :xs="24">
|
||||
<div class="content-card">
|
||||
<h4 class="section-title">警示灯模式</h4>
|
||||
<div class="light-mode">
|
||||
<!-- 使用v-for循环渲染灯光模式卡片 -->
|
||||
<div class="mode-card" :class="{ 'active': mode.active }"
|
||||
@click.stop="handleModeClick(mode.id)" v-for="mode in lightModes" :key="mode.id">
|
||||
<img :src="mode.active ? mode.activeIcon : mode.icon" :alt="mode.name"
|
||||
class="mode-icon" />
|
||||
<div class="mode-name">{{ mode.name }}</div>
|
||||
<el-switch v-model="mode.switchStatus" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :lg="8" :xs="24">
|
||||
<div class="content-card ">
|
||||
<div class="brightness-alarm">
|
||||
<div class="brightness-control">
|
||||
<span class="brightness-label">亮度</span>
|
||||
<el-input class="inputTFT" v-model="deviceDetail.lightBrightness" :min="10" :max="100"
|
||||
:step="1" size="small" />
|
||||
<span class="brightness-value">%</span>
|
||||
<el-button type="primary" class="save-btn" v-loading="lightModesLoading"
|
||||
@click="saveBtnlight">保存 </el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="brightness-alarm">
|
||||
<div class="brightness-control">
|
||||
<span class="brightness-label">频率</span>
|
||||
<el-input class="inputTFT" v-model="deviceDetail.strobeFrequency" :min="0.5" :max="10"
|
||||
:step="1" size="small" />
|
||||
<span class="brightness-value">HZ</span>
|
||||
<el-button type="primary" class="save-btn" @click="saveBtnstrobe">保存 </el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="brightness-alarm">
|
||||
<div class="brightness-control">
|
||||
<span class="brightness-label">音量</span>
|
||||
<el-input class="inputTFT" v-model="deviceDetail.volume" :min="10" :max="100" :step="1"
|
||||
size="small" />
|
||||
<span class="brightness-value">%</span>
|
||||
<el-button type="primary" class="save-btn" @click="saveBtnVolume">保存 </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<!-- ===========充电提示框====== -->
|
||||
<el-dialog title="充电提示" v-model="centerDialogVisible" width="15%">
|
||||
<div style="display: flex; align-items: center;">
|
||||
<h3 style="color: rgba(224, 52, 52, 1)">设备电量低于20%</h3>
|
||||
</div>
|
||||
<div>请及时充电</div>
|
||||
<span slot="footer" class="dialog-footer" style="text-align: right;display: block;">
|
||||
<el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup name="DeviceControl" lang="ts">
|
||||
const route = useRoute();
|
||||
import { useMqtt } from '@/utils/mqtt';
|
||||
import api from '@/api/controlCenter/controlPanel/100J'
|
||||
import { DeviceDetail, LightMode } from '@/api/controlCenter/controlPanel/types';
|
||||
import {getDeviceStatus } from '@/utils/function';
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const router = useRouter();
|
||||
// 导入图片资源(确保路径正确)
|
||||
import closeDefault from '@/assets/images/close.png';
|
||||
import closeActive from '@/assets/images/close_HL.png';
|
||||
import rb from '@/assets/images/rb.png';
|
||||
import rbAc from '@/assets/images/rbAc.png';
|
||||
import sg from '@/assets/images/sg.png';
|
||||
import sgAc from '@/assets/images/sgAc.png';
|
||||
const forceAlarmLoading = ref(false) //强制报警
|
||||
const lightModesLoading = ref(false)
|
||||
const centerDialogVisible = ref(false)
|
||||
const {
|
||||
connected,
|
||||
connect,
|
||||
subscribe,
|
||||
onConnect,
|
||||
onError,
|
||||
onMessage,
|
||||
disconnect
|
||||
} = useMqtt();
|
||||
// 报警模式
|
||||
const sta_VoiceType = ref([
|
||||
{
|
||||
id: 'fire',
|
||||
name: '消防',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
switchStatusVioice: true,
|
||||
active: true
|
||||
},
|
||||
{
|
||||
id: '0',
|
||||
name: '公安',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
active: false,
|
||||
switchStatusVioice: false,
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '交警',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
switchStatusVioice: false,
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: '4',
|
||||
name: '市政',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
switchStatusVioice: false,
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '应急',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
switchStatusVioice: false,
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: '6',
|
||||
name: '医疗',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
switchStatusVioice: false,
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: '5',
|
||||
name: '铁道',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
switchStatusVioice: false,
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: '7',
|
||||
name: 'app语音',
|
||||
icon: sg, // 直接使用导入的变量
|
||||
activeIcon: sgAc,
|
||||
switchStatusVioice: false,
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: '-1',
|
||||
name: '关闭',
|
||||
icon: closeDefault, // 直接使用导入的变量
|
||||
activeIcon: closeActive,
|
||||
switchStatusVioice: false,
|
||||
active: false
|
||||
},
|
||||
])
|
||||
// 警示灯灯光模式数据(引用导入的图片)
|
||||
const lightModes = ref<LightMode[]>([
|
||||
{
|
||||
id: 'redBlueAlternate', // 红蓝交替
|
||||
name: '红蓝交替',
|
||||
icon: rb,
|
||||
activeIcon: rbAc,
|
||||
switchStatus: true,
|
||||
instructValue: '6',
|
||||
active: true,
|
||||
},
|
||||
{
|
||||
id: 'redFlash', // 红闪
|
||||
name: '红闪',
|
||||
icon: rb,
|
||||
activeIcon: rbAc,
|
||||
switchStatus: false,
|
||||
instructValue: '0',
|
||||
active: false,
|
||||
},
|
||||
{
|
||||
id: 'yellowFlash', // 黄闪
|
||||
name: '黄闪',
|
||||
icon: rb,
|
||||
activeIcon: rbAc,
|
||||
switchStatus: false,
|
||||
instructValue: '2',
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: 'blueFlash', // 蓝闪
|
||||
name: '蓝闪',
|
||||
icon: rb,
|
||||
activeIcon: rbAc,
|
||||
switchStatus: false,
|
||||
instructValue: '1',
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: 'redClockwise', // 红色顺时针
|
||||
name: '红色顺时针',
|
||||
icon: rb,
|
||||
activeIcon: rbAc,
|
||||
switchStatus: false,
|
||||
instructValue: '3',
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: 'yellowClockwise', // 黄色顺时针
|
||||
name: '黄色顺时针',
|
||||
icon: rb,
|
||||
activeIcon: rbAc,
|
||||
switchStatus: false,
|
||||
instructValue: '4',
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: 'redBlueClockwise', // 红蓝顺时针
|
||||
name: '红蓝顺时针',
|
||||
icon: rb,
|
||||
activeIcon: rbAc,
|
||||
switchStatus: false,
|
||||
instructValue: '5',
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: 'close', // 关闭
|
||||
name: '关闭',
|
||||
icon: closeDefault,
|
||||
activeIcon: closeActive,
|
||||
switchStatus: false,
|
||||
instructValue: '-1',
|
||||
active: false
|
||||
},
|
||||
]);
|
||||
const deviceDetail = ref<DeviceDetail & { typeName: string }>({
|
||||
lightBrightness: '',
|
||||
deviceName: '',
|
||||
deviceImei: '',
|
||||
onlineStatus: 0,
|
||||
batteryPercentage: 0,
|
||||
batteryRemainingTime: '',
|
||||
longitude: '',
|
||||
latitude: '',
|
||||
address: '',
|
||||
sendMsg: '',
|
||||
chargeState: '0',
|
||||
typeName: '',
|
||||
alarmStatus: 0,
|
||||
strobeFrequency: '0.5',
|
||||
volume: '10'
|
||||
});
|
||||
const isUpdatingStatus = ref(false);
|
||||
// 报警模式// 2. 点击卡片事件
|
||||
const handleVoiceType = async (targetId: string) => {
|
||||
const deviceId = route.params.deviceId as string;
|
||||
if (!deviceId) return;
|
||||
const targetMode = sta_VoiceType.value.find(mode => mode.id === targetId);
|
||||
if (!targetMode) return;
|
||||
if (targetMode.active) return;
|
||||
sta_VoiceType.value.forEach(mode => {
|
||||
mode.active = mode.id === targetId;
|
||||
if (mode.active) {
|
||||
mode.switchStatusVioice = true;
|
||||
} else {
|
||||
mode.switchStatusVioice = false;
|
||||
}
|
||||
});
|
||||
// 2. 调用强制报警接口
|
||||
const params = {
|
||||
deviceIds: [deviceId],
|
||||
voiceStrobeAlarm: targetId === '-1' ? 0 : 1,
|
||||
mode: targetId == '-1' ? 0 : targetId
|
||||
};
|
||||
try {
|
||||
const res = await api.SosSetting(params);
|
||||
if (res.code == 200) {
|
||||
proxy?.$modal.msgSuccess(res.msg);
|
||||
}
|
||||
} catch (error) {
|
||||
await getList()
|
||||
}
|
||||
};
|
||||
// 警示灯模式
|
||||
const handleModeClick = async (modeId: string) => {
|
||||
if (isUpdatingStatus.value || isSyncingStatus.value) return;
|
||||
try {
|
||||
const deviceId = route.params.deviceId as string;
|
||||
if (!deviceId) return;
|
||||
const targetMode = lightModes.value.find(m => m.id === modeId);
|
||||
if (!targetMode || !targetMode.instructValue) return;
|
||||
isUpdatingStatus.value = true;
|
||||
const res = await api.lightModeSettings({
|
||||
deviceId,
|
||||
instructValue: targetMode.instructValue,
|
||||
deviceImei: deviceDetail.value.deviceImei,
|
||||
typeName: deviceDetail.value.typeName,
|
||||
});
|
||||
if (res.code === 200) {
|
||||
ElMessage.closeAll();
|
||||
proxy?.$modal.msgSuccess(res.msg);
|
||||
setActiveLightMode(modeId);
|
||||
} else {
|
||||
proxy?.$modal.msgError(res.msg);
|
||||
const prevActiveMode = lightModes.value.find(m => m.active);
|
||||
if (prevActiveMode) {
|
||||
setActiveLightMode(prevActiveMode.id);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
// 异常时恢复状态
|
||||
const prevActiveMode = lightModes.value.find(m => m.active);
|
||||
if (prevActiveMode) {
|
||||
setActiveLightMode(prevActiveMode.id);
|
||||
}
|
||||
} finally {
|
||||
isUpdatingStatus.value = false;
|
||||
}
|
||||
};
|
||||
const isSyncingStatus = ref(false);
|
||||
// 警示灯接口
|
||||
const setActiveLightMode = (targetModeId: string) => {
|
||||
isSyncingStatus.value = true;
|
||||
lightModes.value.forEach(mode => {
|
||||
const isActive = mode.id === targetModeId;
|
||||
mode.active = isActive;
|
||||
mode.switchStatus = isActive;
|
||||
});
|
||||
isSyncingStatus.value = false;
|
||||
};
|
||||
const getList = async () => {
|
||||
try {
|
||||
const deviceId = route.params.deviceId;
|
||||
if (!deviceId) return;
|
||||
const res = await api.deviceDeatil(deviceId as string);
|
||||
deviceDetail.value = res.data;
|
||||
|
||||
// ==========灯光模式逻辑==========
|
||||
let targetModeId = "redBlueAlternate";
|
||||
const mainLightMode = String(res.data.strobeMode);
|
||||
const matchedMode = lightModes.value.find(
|
||||
mode => mode.instructValue === mainLightMode
|
||||
);
|
||||
if (matchedMode) {
|
||||
targetModeId = matchedMode.id;
|
||||
}
|
||||
setActiveLightMode(targetModeId);
|
||||
// 报警模式
|
||||
const alarmMode = String(res.data.alarmMode); // 报警模式ID
|
||||
const voiceStrobeAlarm = String(res.data.voiceStrobeAlarm); // 报警开关状态:1开启,0关闭
|
||||
// 先重置所有报警模式的状态
|
||||
sta_VoiceType.value.forEach(mode => {
|
||||
mode.active = false;
|
||||
mode.switchStatusVioice = false;
|
||||
});
|
||||
if (voiceStrobeAlarm === '1') {
|
||||
const matchedVoiceMode = sta_VoiceType.value.find(
|
||||
mode => mode.id === alarmMode
|
||||
);
|
||||
if (matchedVoiceMode) {
|
||||
matchedVoiceMode.active = true;
|
||||
matchedVoiceMode.switchStatusVioice = true;
|
||||
} else {
|
||||
console.warn('未找到对应的报警模式:', alarmMode);
|
||||
}
|
||||
} else {
|
||||
const closeMode = sta_VoiceType.value.find(mode => mode.id === '-1');
|
||||
if (closeMode) {
|
||||
closeMode.active = true;
|
||||
closeMode.switchStatusVioice = true;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取设备详情失败:', error);
|
||||
}
|
||||
};
|
||||
|
||||
// 灯光亮度
|
||||
const saveBtnlight = () => {
|
||||
lightModesLoading.value = true
|
||||
let data = {
|
||||
deviceId: route.params.deviceId,
|
||||
brightness: deviceDetail.value.lightBrightness,
|
||||
}
|
||||
api.lightModeSettings(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
lightModesLoading.value = false
|
||||
proxy?.$modal.msgSuccess(res.msg);
|
||||
|
||||
} else {
|
||||
lightModesLoading.value = false
|
||||
proxy?.$modal.msgError(res.msg);
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
lightModesLoading.value = false
|
||||
});
|
||||
}
|
||||
// 爆闪频率
|
||||
const saveBtnstrobe = () => {
|
||||
let data = {
|
||||
deviceId: route.params.deviceId,
|
||||
frequency: deviceDetail.value.strobeFrequency,
|
||||
}
|
||||
api.staticPowerSetting(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
proxy?.$modal.msgSuccess(res.msg);
|
||||
}
|
||||
})
|
||||
}
|
||||
// 修改音量
|
||||
const saveBtnVolume = () => {
|
||||
let data = {
|
||||
deviceId: route.params.deviceId,
|
||||
volume: deviceDetail.value.volume,
|
||||
}
|
||||
api.settingUpdateVolume(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
proxy?.$modal.msgSuccess(res.msg);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 解除报警
|
||||
const showClose = async () => {
|
||||
try {
|
||||
await proxy?.$modal.confirm('确定要对该设备解除报警?', '提示');
|
||||
// 2. 准备请求数据
|
||||
let data = {
|
||||
deviceIds: [route.params.deviceId],
|
||||
typeName: deviceDetail.value.typeName,
|
||||
deviceImeiList: [deviceDetail.value.deviceImei],
|
||||
instructValue: '0', //强制报警1,解除报警0
|
||||
}
|
||||
} catch (error: any) {
|
||||
}
|
||||
}
|
||||
|
||||
// 强制报警
|
||||
const forceAlarm = async () => {
|
||||
try {
|
||||
await proxy?.$modal.confirm('确定要对该设备开启强制报警?', '提示');
|
||||
forceAlarmLoading.value = true
|
||||
// 2. 准备请求数据
|
||||
let data = {
|
||||
deviceIds: [route.params.deviceId],
|
||||
typeName: deviceDetail.value.typeName,
|
||||
deviceImeiList: [deviceDetail.value.deviceImei],
|
||||
instructValue: '1', //强制报警1,解除报警0
|
||||
}
|
||||
|
||||
} catch (error: any) {
|
||||
// proxy?.$modal.msgWarning(error.msg)
|
||||
forceAlarmLoading.value = false;
|
||||
|
||||
} finally {
|
||||
forceAlarmLoading.value = false;
|
||||
}
|
||||
}
|
||||
const lookMap = (row: any) => {
|
||||
console.log(row, 'rowrowrowrowrworowrowrowrowrowrow');
|
||||
router.push({
|
||||
path: '/controlCenter/controlPanel',
|
||||
query: {
|
||||
view: 'map',
|
||||
deviceId: row.deviceId
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
onMounted(async () => {
|
||||
await getList();
|
||||
});
|
||||
onUnmounted(() => {
|
||||
});
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.p-2 {
|
||||
background: rgba(247, 248, 252, 1);
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.device-page {
|
||||
.header-bar {
|
||||
border-radius: 8px;
|
||||
background: linear-gradient(135deg, #3400e7, #009bff);
|
||||
color: white;
|
||||
padding: 20px;
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-weight: 600;
|
||||
|
||||
.device-status {
|
||||
.online {
|
||||
color: #00ff00;
|
||||
}
|
||||
|
||||
.offline {
|
||||
color: rgb(224, 52, 52);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
.content-row {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.content-card {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px rgba(0, 34, 96, 0.1);
|
||||
background: white;
|
||||
padding: 0px 20px 50px;
|
||||
border: 1px solid #ebeef5;
|
||||
height: 289px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.content-card_gps {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px rgba(0, 34, 96, 0.1);
|
||||
background: white;
|
||||
padding: 0px 20px 50px;
|
||||
border: 1px solid #ebeef5;
|
||||
height: 78%;
|
||||
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
.light-mode {
|
||||
display: flex;
|
||||
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.lacatin_gps {
|
||||
height: 70px;
|
||||
border-radius: 4px;
|
||||
background: rgba(247, 248, 252, 1);
|
||||
display: inline-block;
|
||||
width: 400px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.mode-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 15px;
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 8px;
|
||||
width: 107px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&.active {
|
||||
border-color: #409eff;
|
||||
background-color: rgba(64, 158, 255, 0.05);
|
||||
}
|
||||
|
||||
.mode-icon {
|
||||
width: 48px;
|
||||
margin-bottom: 10px;
|
||||
transition: all 0.3s ease;
|
||||
object-fit: scale-down;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.mode-name {
|
||||
font-size: 14px;
|
||||
margin-bottom: 12px;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
.el-switch {
|
||||
--el-switch-on-color: #409eff;
|
||||
--el-switch-off-color: #dcdfe6;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.brightness-alarm {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.brightness-control {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
border-radius: 39px;
|
||||
// box-shadow: 0px 0px 6px 0px rgba(0, 34, 96, 0.1);
|
||||
background: rgba(255, 255, 255, 1);
|
||||
width: 100%;
|
||||
// height: 54px;
|
||||
padding: 10px 20px;
|
||||
margin-top: 20px;
|
||||
|
||||
.brightness-label {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
min-width: 70px;
|
||||
}
|
||||
|
||||
.brightness-value {
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.save-btn {
|
||||
padding: 6px 20px;
|
||||
border-radius: 29px;
|
||||
background: rgba(2, 124, 251, 1);
|
||||
border: none
|
||||
}
|
||||
|
||||
.inputTFT {
|
||||
width: 130px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.alarm-btn {
|
||||
background-color: rgba(224, 52, 52, 1);
|
||||
border-color: rgba(224, 52, 52, 1);
|
||||
padding: 8px 20px;
|
||||
border-radius: 27px;
|
||||
}
|
||||
}
|
||||
|
||||
.location-info {
|
||||
.location-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 15px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
|
||||
.location-icon {
|
||||
margin-right: 8px;
|
||||
font-weight: bold;
|
||||
color: #409eff;
|
||||
}
|
||||
|
||||
.view-btn {
|
||||
margin: 0 8px;
|
||||
padding: 0;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 15px;
|
||||
margin-bottom: 15px;
|
||||
text-align: right;
|
||||
|
||||
.form-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.form-label {
|
||||
min-width: 35px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.el-input {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.register-btn {
|
||||
grid-column: 1 / 3;
|
||||
justify-self: start;
|
||||
padding: 6px 20px;
|
||||
position: absolute;
|
||||
right: 19px;
|
||||
bottom: 30px;
|
||||
border-radius: 29px;
|
||||
background: rgba(2, 124, 251, 1);
|
||||
border: none
|
||||
}
|
||||
}
|
||||
|
||||
.message-content {
|
||||
// display: flex;
|
||||
// flex-direction: column;
|
||||
// gap: 10px;
|
||||
|
||||
.el-textarea {
|
||||
border: 1px solid rgba(29, 111, 255, 1);
|
||||
border-radius: 4px;
|
||||
background: rgba(247, 248, 252, 1);
|
||||
border-radius: 6px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.el-textarea__inner {
|
||||
background: rgba(247, 248, 252, 1);
|
||||
}
|
||||
|
||||
.send-btn {
|
||||
align-self: flex-end;
|
||||
padding: 10px 20px;
|
||||
border-radius: 29px;
|
||||
background: rgba(2, 124, 251, 1);
|
||||
border: none;
|
||||
margin: 20px 0px 30px 0;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.upload-area {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100px;
|
||||
border: 1px dashed #dcdfe6;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.video-input {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
|
||||
.el-input {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.save-video-btn {
|
||||
padding: 6px 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 响应式调整
|
||||
@media (max-width: 768px) {
|
||||
.header-bar {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.form-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.form-grid .register-btn {
|
||||
grid-column: 1;
|
||||
}
|
||||
|
||||
.light-mode .mode-group {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.light-mode .mode-item {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.light-mode .mode-icon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.path-img {
|
||||
width: 52px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.staticRwo {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px rgba(0, 34, 96, 0.1);
|
||||
background: white;
|
||||
border: 1px solid #ebeef5;
|
||||
height: auto;
|
||||
line-height: 36px;
|
||||
box-sizing: border-box;
|
||||
text-indent: 15px;
|
||||
color: #ff0000;
|
||||
font-weight: bold;
|
||||
font-size: 17px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.displayNone {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
@ -4,4 +4,11 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style lang="scss" scoped></style>
|
||||
<style lang="scss" scoped>
|
||||
.p-2{
|
||||
background: rgba(247, 248, 252, 1);
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
</style>
|
||||
@ -6,7 +6,7 @@
|
||||
<div>设备型号:{{ deviceDetail.deviceImei }}</div>
|
||||
<div class="device-status">设备状态:
|
||||
<span :class="{ online: deviceDetail.onlineStatus === 1, offline: deviceDetail?.onlineStatus === 0 }">
|
||||
{{ deviceDetail.onlineStatus === 1 ? "在线" : "离线" }}
|
||||
{{ deviceDetail.onlineStatus === 1 ? '在线' : (deviceDetail.onlineStatus === 2 ? '故障' : '离线') }}
|
||||
</span>
|
||||
</div>
|
||||
<div>电量:{{ deviceDetail.batteryPercentage || 0 }}%</div>
|
||||
@ -15,6 +15,14 @@
|
||||
|
||||
<!-- 主体内容区域 -->
|
||||
<div class="content-wrapper">
|
||||
<el-row :gutter="20" class="content-row" :class="deviceDetail.alarmStatus == 1 ? '' : 'displayNone'" >
|
||||
<el-col :lg="24" :xs="24">
|
||||
<div class="staticRwo" :class="deviceDetail.alarmStatus == 1 ? '' : 'displayNone'"
|
||||
@click="showClose()">
|
||||
设备强制报警中!
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 第一行:灯光模式 + 灯光亮度、强制报警、位置信息 -->
|
||||
<el-row :gutter="20" class="content-row">
|
||||
<el-col :lg="16" :xs="24">
|
||||
@ -50,7 +58,7 @@
|
||||
:loading-text="lightModesLoading ? '保存中...' : '保存'"> {{
|
||||
lightModesLoading ? '保存中' : '保存' }}</el-button>
|
||||
</div>
|
||||
<el-button type="danger" class="alarm-btn" @click="forceAlarm" :loading="forceAlarmLoading"
|
||||
<el-button type="danger" class="alarm-btn" @click="forceAlarm" :loading="forceAlarmLoading" v-if="deviceDetail.alarmStatus === 0 || deviceDetail.alarmStatus === null"
|
||||
:loading-text="forceAlarmLoading ? '报警中...' : '强制报警'" > {{
|
||||
forceAlarmLoading ? '报警中' : '强制报警' }}</el-button>
|
||||
</div>
|
||||
@ -248,7 +256,8 @@ const deviceDetail = ref<DeviceDetail & { typeName: string }>({
|
||||
address: '',
|
||||
sendMsg: '',
|
||||
chargeState: '0',
|
||||
typeName: ''
|
||||
typeName: '',
|
||||
alarmStatus: 0
|
||||
});
|
||||
// 保留原有的操作中标志位
|
||||
const isUpdatingStatus = ref(false);
|
||||
@ -280,7 +289,7 @@ const handleModeClick = async (modeId: string) => {
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
proxy?.$modal.msgError("操作失败,请稍后重试");
|
||||
// proxy?.$modal.msgError("操作失败,请稍后重试");
|
||||
// 异常时恢复状态
|
||||
const prevActiveMode = lightModes.value.find(m => m.active);
|
||||
if (prevActiveMode) {
|
||||
@ -329,9 +338,6 @@ const getList = async () => {
|
||||
const laserStatus = Number(res.data.laserLightMode);
|
||||
laserMode.value.active = laserStatus === 1;
|
||||
laserMode.value.switchStatus = laserStatus === 1;
|
||||
setTimeout(() => {
|
||||
console.log('延迟检查激光状态:', laserMode.value.active, laserMode.value.switchStatus);
|
||||
}, 1000);
|
||||
} catch (error) {
|
||||
console.error("获取设备详情失败:", error);
|
||||
setActiveLightMode("strong"); // 异常时默认强光
|
||||
@ -360,7 +366,7 @@ const handleLaserClick = async () => {
|
||||
laserMode.value.switchStatus = !targetStatus;
|
||||
}
|
||||
} catch (error: any) {
|
||||
proxy?.$modal.msgError(error.msg);
|
||||
// proxy?.$modal.msgError(error.msg);
|
||||
// 恢复之前的状态
|
||||
laserMode.value.switchStatus = !laserMode.value.switchStatus;
|
||||
} finally { }
|
||||
@ -423,11 +429,56 @@ const saveBtn = () => {
|
||||
|
||||
} else {
|
||||
lightModesLoading.value = false
|
||||
proxy?.$modal.msgError(res.msg);
|
||||
//proxy?.$modal.msgError(res.msg);
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
// 解除报警
|
||||
const showClose = async () => {
|
||||
try {
|
||||
await proxy?.$modal.confirm('确定要对该设备解除报警?', '提示');
|
||||
// 2. 准备请求数据
|
||||
const batchId = generateShortId();
|
||||
let data = {
|
||||
deviceIds: [route.params.deviceId],
|
||||
typeName: deviceDetail.value.typeName,
|
||||
deviceImeiList: [deviceDetail.value.deviceImei],
|
||||
batchId: batchId,
|
||||
instructValue: '0', //强制报警1,解除报警0
|
||||
}
|
||||
const registerRes = await api.sendAlarmMessage(data);
|
||||
if (registerRes.code !== 200) {
|
||||
proxy?.$modal.msgWarning(registerRes.msg)
|
||||
return
|
||||
}
|
||||
// 4. 获取设备状态
|
||||
let deviceImei = deviceDetail.value.deviceImei
|
||||
const statusRes = await getDeviceStatus({
|
||||
functionMode: 2,
|
||||
batchId,
|
||||
typeName: 'FunctionAccessBatchStatusRule',
|
||||
deviceImei,
|
||||
interval: 500
|
||||
},
|
||||
api.deviceRealTimeStatus
|
||||
);
|
||||
// 只有当状态为'OK'时才显示成功弹窗
|
||||
if (statusRes.data.functionAccess === 'OK') {
|
||||
proxy?.$modal.msgSuccess(statusRes.msg);
|
||||
await getList();
|
||||
}
|
||||
|
||||
} catch (error: any) {
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// 强制报警
|
||||
const forceAlarm = async () => {
|
||||
try {
|
||||
@ -461,10 +512,12 @@ const forceAlarm = async () => {
|
||||
// 只有当状态为'OK'时才显示成功弹窗
|
||||
if (statusRes.data.functionAccess === 'OK') {
|
||||
proxy?.$modal.msgSuccess(statusRes.msg);
|
||||
await getList();
|
||||
}
|
||||
|
||||
} catch (error: any) {
|
||||
proxy?.$modal.msgWarning(error.msg)
|
||||
// proxy?.$modal.msgWarning(error.msg)
|
||||
forceAlarmLoading.value = false;
|
||||
|
||||
} finally {
|
||||
forceAlarmLoading.value = false;
|
||||
@ -539,17 +592,15 @@ const getMainLightModeLabel = (mode: any) => {
|
||||
// 处理设备消息
|
||||
const handleDeviceMessage = (msg: any) => {
|
||||
try {
|
||||
// 解析设备消息(假设格式为 { state: [类型, 模式值, 亮度, 续航...] })
|
||||
const payloadObj = JSON.parse(msg.payload.toString());
|
||||
const deviceState = payloadObj.state; // 设备状态数组
|
||||
if (!Array.isArray(deviceState)) {
|
||||
return;
|
||||
}
|
||||
// 用switch处理不同的消息类型(deviceState[0])
|
||||
switch (deviceState[0]) {
|
||||
case 1:
|
||||
// 类型1灯光主键
|
||||
const lightModeId = getMainLightModeLabel(deviceState[1]); // 获取模式ID(如'strong')
|
||||
const lightModeId = getMainLightModeLabel(deviceState[1]);
|
||||
const brightness = deviceState[2]; // 亮度值
|
||||
const batteryTime = deviceState[3]; // 续航时间
|
||||
console.log('灯光模式消息:', { 模式ID: lightModeId, 亮度: brightness, 续航: batteryTime });
|
||||
@ -572,7 +623,7 @@ const handleDeviceMessage = (msg: any) => {
|
||||
break;
|
||||
case 12:
|
||||
// 灯光主键
|
||||
const lightModeIdA = getMainLightModeLabel(deviceState[1]); // 获取模式ID(如'strong')
|
||||
const lightModeIdA = getMainLightModeLabel(deviceState[1]);
|
||||
if (lightModeIdA !== 'unknown') {
|
||||
lightModes.value.forEach(mode => {
|
||||
const isActive = mode.id === lightModeIdA;
|
||||
@ -591,9 +642,12 @@ const handleDeviceMessage = (msg: any) => {
|
||||
if (deviceDetail.value.batteryPercentage < 20 && Number(deviceDetail.value.chargeState) == 0) {
|
||||
centerDialogVisible.value = true
|
||||
}
|
||||
break;
|
||||
case 7:
|
||||
deviceDetail.value.alarmStatus = deviceState[1];
|
||||
|
||||
break;
|
||||
default:
|
||||
// 其他类型消息(不处理,仅打印)
|
||||
console.log('未处理的消息类型:', deviceState[0]);
|
||||
break;
|
||||
}
|
||||
@ -601,7 +655,7 @@ const handleDeviceMessage = (msg: any) => {
|
||||
}
|
||||
};
|
||||
onMounted(async () => {
|
||||
await getList(); // 先获取设备信息
|
||||
await getList();
|
||||
// 连接mqtt
|
||||
onConnect(async () => {
|
||||
const deviceImei = deviceDetail.value.deviceImei;
|
||||
@ -627,7 +681,7 @@ onMounted(async () => {
|
||||
handleDeviceMessage(msg);
|
||||
});
|
||||
onError((err) => {
|
||||
console.error('MQTT连接失败原因:', err.message); // 关键:打印连接失败的具体原因
|
||||
console.error('MQTT连接失败原因:', err.message);
|
||||
});
|
||||
connect();
|
||||
});
|
||||
@ -641,6 +695,13 @@ onUnmounted(() => {
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.p-2 {
|
||||
background: rgba(247, 248, 252, 1);
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.device-page {
|
||||
.header-bar {
|
||||
border-radius: 8px;
|
||||
@ -945,4 +1006,23 @@ onUnmounted(() => {
|
||||
width: 52px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.staticRwo {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px rgba(0, 34, 96, 0.1);
|
||||
background: white;
|
||||
border: 1px solid #ebeef5;
|
||||
height: auto;
|
||||
line-height: 36px;
|
||||
box-sizing: border-box;
|
||||
text-indent: 15px;
|
||||
color: #ff0000;
|
||||
font-weight: bold;
|
||||
font-size: 17px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.displayNone {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
1097
src/views/controlCenter/670/index.vue
Normal file
@ -222,7 +222,7 @@ onUnmounted(() => {
|
||||
}
|
||||
|
||||
.amap-container {
|
||||
height: 640px;
|
||||
height: calc(100vh - 25vh);
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
@ -234,11 +234,12 @@ onUnmounted(() => {
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 0px 6px 0px rgba(0, 34, 96, 0.1);
|
||||
background: rgba(255, 255, 255, 1);
|
||||
height: 620px;
|
||||
height: calc(100vh - 25vh);
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 10px;
|
||||
left: 10px
|
||||
left: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* 其他样式保持不变... */
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
<el-collapse-item name="1">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" class="queryFormRef">
|
||||
<el-form-item label="设备类型" prop="deviceType">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型" clearable filterable>
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
|
||||
:value="item.deviceTypeId" />
|
||||
</el-select>
|
||||
@ -49,6 +49,7 @@
|
||||
<el-select v-model="queryParams.onlineStatus" placeholder="设备状态" clearable>
|
||||
<el-option label="在线" value="1"></el-option>
|
||||
<el-option label="离线" value="0"></el-option>
|
||||
<el-option label="故障" value="2"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="设备MAC" prop="deviceMac">
|
||||
@ -66,6 +67,7 @@
|
||||
<el-select v-model="queryParams.communicationMode" placeholder="请选择通信方式" clearable>
|
||||
<el-option label="4G" value="0"></el-option>
|
||||
<el-option label="蓝牙" value="1"></el-option>
|
||||
<el-option label="4G&蓝牙" value="2"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
@ -80,7 +82,7 @@
|
||||
</transition>
|
||||
<el-card class="Maplist">
|
||||
<div v-if="isListView" key="list">
|
||||
<el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange">
|
||||
<el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange" height="calc(100vh - 310px)">
|
||||
<el-table-column type="selection" width="50" align="center" :selectable="isSelectable" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column label="设备图片" align="center" prop="devicePic">
|
||||
@ -108,6 +110,7 @@
|
||||
<template #default="scope">
|
||||
<div class="normal green" v-if="scope.row.onlineStatus == 1">在线</div>
|
||||
<div class="normal red" v-if="scope.row.onlineStatus == 0">离线</div>
|
||||
<div class="normal red" v-if="scope.row.onlineStatus == 2">故障</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="电量" align="center" prop="battery">
|
||||
@ -117,10 +120,22 @@
|
||||
'battery-yellow': Number(scope.row.battery) >= 20 && Number(scope.row.battery) < 80,
|
||||
'battery-green': Number(scope.row.battery) >= 80 && Number(scope.row.battery) <= 100
|
||||
}">
|
||||
{{ scope.row.battery }}%
|
||||
{{ scope.row.battery || '0' }}%
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="绑定状态" align="center" prop="bindingStatus">
|
||||
<template #default="scope">
|
||||
<div class="normal green" v-if="scope.row.bindingStatus == 1">已绑定</div>
|
||||
<div class="normal red" v-if="scope.row.bindingStatus == 0">未绑定</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="报警状态" align="center" prop="alarmStatus">
|
||||
<template #default="scope">
|
||||
<div class="normal red" v-if="scope.row.alarmStatus == 1">报警中</div>
|
||||
<div class="normal green" v-if="scope.row.alarmStatus == 0">未报警</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="操作" fixed="right" width="180" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
@ -162,6 +177,8 @@ import apiTypeAll from '@/api/equipmentManagement/device/index';
|
||||
import { deviceQuery, deviceVO } from '@/api/controlCenter/controlPanel/types';
|
||||
import Amap from "./components/map.vue";
|
||||
import { generateShortId, getDeviceStatus } from '@/utils/function';
|
||||
import eqControl from '@/api/controlCenter/controlPanel/eqControl';
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute(); // 新增:用于获取URL中的query参数
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
@ -335,6 +352,7 @@ onMounted(() => {
|
||||
const getList = async () => {
|
||||
loading.value = false;
|
||||
const res = await api.deviceControlCenterList(queryParams.value);
|
||||
|
||||
loading.value = false;
|
||||
deviceList.value = res.rows;
|
||||
total.value = res.total;
|
||||
@ -376,6 +394,7 @@ const submitForm = async () => {
|
||||
return
|
||||
}
|
||||
try {
|
||||
|
||||
sendTextLoading.value = true;
|
||||
// 2. 准备请求数据
|
||||
const deviceIds = ids.value.map(item => item.id);
|
||||
@ -388,10 +407,11 @@ const submitForm = async () => {
|
||||
typeName: typeName,
|
||||
batchId: batchId,
|
||||
deviceImeiList: deviceImeiList,
|
||||
sendMsg: form.value.messageToSend
|
||||
sendMsg: form.value.messageToSend,
|
||||
instructValue:""
|
||||
};
|
||||
// 3.人员信息
|
||||
const registerRes = await api.deviceSendMessage(data);
|
||||
const registerRes = await eqControl.deviceSendMessage(data);
|
||||
if (registerRes.code !== 200) {
|
||||
proxy?.$modal.msgWarning(registerRes.msg)
|
||||
return
|
||||
@ -450,9 +470,10 @@ const forceAlarm = async () => {
|
||||
typeName: typeName,
|
||||
batchId: batchId,
|
||||
deviceImeiList: deviceImeiList,
|
||||
instructValue: '1', //强制报警1,解除报警0
|
||||
instructValue: '1' //强制报警1,解除报警0
|
||||
|
||||
}
|
||||
const registerRes = await api.sendAlarmMessage(data);
|
||||
const registerRes = await eqControl.sendAlarmMessage(data);
|
||||
if (registerRes.code !== 200) {
|
||||
proxy?.$modal.msgWarning(registerRes.msg)
|
||||
return
|
||||
@ -483,6 +504,17 @@ const forceAlarm = async () => {
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.p-2 {
|
||||
background: rgba(247, 248, 252, 1);
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
:deep .el-collapse {
|
||||
border-top: none
|
||||
}
|
||||
|
||||
:deep .el-collapse-item__header {
|
||||
display: none;
|
||||
}
|
||||
@ -543,7 +575,7 @@ const forceAlarm = async () => {
|
||||
}
|
||||
|
||||
.Maplist {
|
||||
height: 680px;
|
||||
overflow: auto;
|
||||
//height: calc(100vh - 24vh);
|
||||
//overflow: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,7 +26,7 @@
|
||||
<el-collapse-item name="1">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" class="queryFormRef">
|
||||
<el-form-item label="设备类型" prop="deviceType">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型" clearable>
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
|
||||
:value="item.deviceTypeId" />
|
||||
</el-select>
|
||||
@ -58,12 +58,17 @@
|
||||
</transition>
|
||||
<el-card class="Maplist">
|
||||
<div>
|
||||
<el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange">
|
||||
<el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange" height="calc(100vh - 400px)">
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column label="设备型号" align="center" prop="deviceType" />
|
||||
<el-table-column label="操作模块" align="center" prop="deviceAction" />
|
||||
<el-table-column label="操作内容" align="center" prop="content" show-overflow-tooltip />
|
||||
<el-table-column label="操作内容" align="center" prop="content" show-overflow-tooltip >
|
||||
<template #default="scope">
|
||||
<div>{{scope.row.content || '/'}}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="操作时间" align="center" prop="createTime" />
|
||||
</el-table>
|
||||
<pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
|
||||
@ -244,6 +249,15 @@ const handleExport = () => {
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.p-2{
|
||||
background: rgba(247, 248, 252, 1);
|
||||
height: calc(100vh - 8vh);
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
:deep .el-collapse{
|
||||
border-top:none
|
||||
}
|
||||
:deep .el-collapse-item__header {
|
||||
display: none;
|
||||
}
|
||||
@ -285,7 +299,7 @@ const handleExport = () => {
|
||||
}
|
||||
|
||||
.Maplist {
|
||||
height: 680px;
|
||||
overflow: auto;
|
||||
height: calc(100vh - 24vh);
|
||||
// overflow: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,7 +26,7 @@
|
||||
<el-collapse-item name="1">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" class="queryFormRef">
|
||||
<el-form-item label="设备类型" prop="deviceType">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型" clearable>
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
|
||||
:value="item.deviceTypeId" />
|
||||
</el-select>
|
||||
@ -58,7 +58,7 @@
|
||||
</transition>
|
||||
<el-card class="Maplist">
|
||||
<div>
|
||||
<el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange">
|
||||
<el-table v-loading="loading" border :data="deviceList" @selection-change="handleSelectionChange" height="calc(100vh - 400px)">
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column label="设备型号" align="center" prop="deviceType" />
|
||||
@ -257,6 +257,15 @@ const historyjectory = (row: any) => {
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.p-2{
|
||||
background: rgba(247, 248, 252, 1);
|
||||
height: calc(100vh - 8vh);
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
:deep .el-collapse{
|
||||
border-top:none
|
||||
}
|
||||
:deep .el-collapse-item__header {
|
||||
display: none;
|
||||
}
|
||||
@ -298,7 +307,7 @@ const historyjectory = (row: any) => {
|
||||
}
|
||||
|
||||
.Maplist {
|
||||
height: 680px;
|
||||
overflow: auto;
|
||||
height: calc(100vh - 24vh);
|
||||
// overflow: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
1110
src/views/debugCenter/debugPanel/index.vue
Normal file
@ -34,9 +34,8 @@
|
||||
<el-select v-model="queryParams.deviceAction">
|
||||
<el-option value="0" label="强制报警"></el-option>
|
||||
<el-option value="1" label="撞击闯入"></el-option>
|
||||
<el-option value="2" label="手动报警"></el-option>
|
||||
<el-option value="2" label="自动报警"></el-option>
|
||||
<el-option value="3" label="电子围栏告警"></el-option>
|
||||
<el-option value="4" label="强制告警"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="报警时间" style="width: 308px">
|
||||
@ -63,7 +62,7 @@
|
||||
|
||||
<el-card shadow="never">
|
||||
<div v-if="isListView" key="card">
|
||||
<el-row :gutter="20">
|
||||
<el-row :gutter="20" v-if="alarmList.length > 0">
|
||||
<el-col :span="6" v-for="(item, index) in alarmList" :key="index">
|
||||
<el-card class="custom-alarm-card">
|
||||
<div class="card-header">
|
||||
@ -90,33 +89,38 @@
|
||||
<div class="label">报警事项</div>
|
||||
<div class="alearm">
|
||||
<template v-if="item.deviceAction === 0">强制报警
|
||||
<span v-if="item.treatmentState === 1">({{ item.startTime.split(' ')[1] || '' }})</span>
|
||||
<span v-if="item.treatmentState === 1">({{ item.timeDiff }})</span>
|
||||
</template>
|
||||
<template v-else-if="item.deviceAction === 1">撞击闯入
|
||||
<span v-if="item.treatmentState === 1">({{ item.startTime.split(' ')[1] || '' }})</span>
|
||||
<span v-if="item.treatmentState === 1">({{ item.timeDiff }})</span>
|
||||
</template>
|
||||
<template v-else-if="item.deviceAction === 2">手动报警
|
||||
<span v-if="item.treatmentState === 1">({{ item.startTime.split(' ')[1] || '' }})</span>
|
||||
<template v-else-if="item.deviceAction === 2">自动报警
|
||||
<span v-if="item.treatmentState === 1">({{ item.timeDiff }})</span>
|
||||
</template>
|
||||
<template v-else-if="item.deviceAction === 3">电子围栏告警
|
||||
<span v-if="item.treatmentState === 1">({{ item.startTime.split(' ')[1] || '' }})</span>
|
||||
</template>
|
||||
<template v-else-if="item.deviceAction === 4">强制告警
|
||||
<span v-if="item.treatmentState === 1">({{ item.startTime.split(' ')[1] || '' }})</span>
|
||||
<span v-if="item.treatmentState === 1">({{ item.timeDiff }})</span>
|
||||
</template>
|
||||
</div>
|
||||
<div class="label">报警地点:</div>
|
||||
<div class="label">报警地点</div>
|
||||
<div class="alearmADD">
|
||||
{{ item.location }}
|
||||
{{ item.location && item.location !== '[]' ? item.location : '无' }}
|
||||
</div>
|
||||
<div v-if="item.treatmentState === 0" class="dl_bot d_fl">
|
||||
<div>时长:{{ item.durationTime }}</div>
|
||||
<div>解除: {{ item.finishTime.split(' ')[1] || '' }}</div>
|
||||
<div v-if="item.durationTime">时长:{{ item.durationTime }}</div>
|
||||
<div v-if="item.finishTime">解除: {{ item.finishTime.split(' ')[1] || '' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20" v-else>
|
||||
<!-- 使用flex容器实现垂直居中布局 -->
|
||||
<div
|
||||
style="display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; width: 100%;">
|
||||
<img src="@/assets/images/noData.png" alt="暂无数据" style="max-width: 150px; margin-bottom: 16px;">
|
||||
<div style="color: #999; font-size: 14px;">暂无数据</div>
|
||||
</div>
|
||||
</el-row>
|
||||
</div>
|
||||
<div v-else key="list">
|
||||
<el-table v-loading="loading" border :data="alarmList">
|
||||
@ -127,25 +131,29 @@
|
||||
<div>{{ scope.row.deviceImei }} {{ scope.row.deviceMac }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="报警地点" align="center" prop="location" />
|
||||
<el-table-column label="报警地点" align="center" prop="location" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<div>{{ scope.row.location && scope.row.location !== '[]' ? scope.row.location : '无' }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="报警事项" align="center" prop="deviceAction">
|
||||
<template #default="scope">
|
||||
<el-tag type="danger" v-if="scope.row.deviceAction == 0">强制报警</el-tag>
|
||||
<el-tag type="danger" v-if="scope.row.deviceAction == 1">撞击闯入</el-tag>
|
||||
<el-tag type="danger" v-if="scope.row.deviceAction == 2">手动报警</el-tag>
|
||||
<el-tag type="danger" v-if="scope.row.deviceAction == 2">自动报警</el-tag>
|
||||
<el-tag type="danger" v-if="scope.row.deviceAction == 3">电子围栏告警</el-tag>
|
||||
<el-tag type="danger" v-if="scope.row.deviceAction == 4">强制告警</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="报警持续时间" align="center" prop="durationTime" width="180">
|
||||
<template #default="scope">
|
||||
<el-tag type="danger">{{ scope.row.durationTime }}</el-tag>
|
||||
<el-tag type="danger">{{ scope.row.durationTime || '/' }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="处理状态" align="center" prop="treatmentState">
|
||||
<template #default="scope">
|
||||
<div class="ysStatus" v-if="scope.row.treatmentState == 0">已处理</div>
|
||||
<el-tag type="danger" v-if="scope.row.treatmentState == 1">未处理</el-tag>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="报警时间" align="center" prop="startTime" />
|
||||
@ -161,8 +169,10 @@
|
||||
import { listAlarm } from '@/api/equipmentAlarmRecord/index';
|
||||
import { AlarmVO, AlarmQuery, AlarmForm } from '@/api/equipmentAlarmRecord/types';
|
||||
import apiTypeAll from '@/api/equipmentManagement/device/index';
|
||||
import { TimeConverter } from '@/utils/timeConverter';
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const alarmList = ref<AlarmVO[]>([]);
|
||||
const timers = ref<Record<string, number>>({});
|
||||
const isListView = ref(true);
|
||||
const dateRange = ref(['', '']);
|
||||
const loading = ref(true);
|
||||
@ -224,10 +234,48 @@ const getList = async () => {
|
||||
queryTime2: endTime
|
||||
};
|
||||
const res = await listAlarm(queryParams.value);
|
||||
alarmList.value = res.rows;
|
||||
if (res.rows) {
|
||||
// 先清除已有定时器
|
||||
clearAllTimers();
|
||||
//alarmList.value = res.rows;
|
||||
// 为每个项添加timeDiff属性并初始化
|
||||
alarmList.value = res.rows.map(item => ({
|
||||
...item,
|
||||
timeDiff: '' // 用于存储计算出的时间差
|
||||
}));
|
||||
total.value = res.total;
|
||||
// 为每个需要计时的项创建定时器
|
||||
initTimers();
|
||||
}
|
||||
|
||||
loading.value = false;
|
||||
}
|
||||
// 初始化所有定时器
|
||||
const initTimers = () => {
|
||||
alarmList.value.forEach(item => {
|
||||
// 只对需要计时的项创建定时器(根据你的业务逻辑判断)
|
||||
if (item.treatmentState === 1 && item.startTime) {
|
||||
// 使用项的唯一标识作为定时器键名(假设id是唯一标识)
|
||||
timers.value[item.id] = TimeConverter.createTimeDiffTimer(
|
||||
item.startTime,
|
||||
(diff) => {
|
||||
// 找到对应的项并更新时间差
|
||||
const index = alarmList.value.findIndex(i => i.id === item.id);
|
||||
if (index !== -1) {
|
||||
alarmList.value[index].timeDiff = diff;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
};
|
||||
// 清除所有定时器
|
||||
const clearAllTimers = () => {
|
||||
Object.values(timers.value).forEach(timerId => {
|
||||
TimeConverter.clearTimeDiffTimer(timerId);
|
||||
});
|
||||
timers.value = {};
|
||||
};
|
||||
// 设备类型
|
||||
const getDeviceType = () => {
|
||||
apiTypeAll.deviceTypeAll().then(res => {
|
||||
@ -263,6 +311,7 @@ const handleQuery = () => {
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
dateRange.value = ['', ''];
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
}
|
||||
@ -270,8 +319,16 @@ onMounted(() => {
|
||||
getList();
|
||||
getDeviceType()
|
||||
});
|
||||
// 组件卸载时清除所有定时器
|
||||
onUnmounted(() => {
|
||||
clearAllTimers();
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
:deep .el-collapse {
|
||||
border-top: none
|
||||
}
|
||||
|
||||
:deep .el-collapse-item__header {
|
||||
display: none;
|
||||
}
|
||||
@ -290,7 +347,7 @@ onMounted(() => {
|
||||
}
|
||||
|
||||
.custom-alarm-card {
|
||||
height: 270px;
|
||||
min-height: 270px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-shadow: 0px 0px 6px 0px rgba(0, 27, 74, 0.1);
|
||||
@ -334,7 +391,7 @@ onMounted(() => {
|
||||
.deviceName {
|
||||
color: rgba(56, 64, 79, 1);
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
|
||||
@ -125,7 +125,7 @@ watch(
|
||||
|
||||
if (newVal === 3) {
|
||||
// 确保参数有效
|
||||
debugger;
|
||||
|
||||
console.log('newVal=', newVal);
|
||||
getRecordList(); // 调用回调
|
||||
}
|
||||
|
||||
@ -126,7 +126,7 @@ watch(
|
||||
|
||||
if (newVal === 3) {
|
||||
// 确保参数有效
|
||||
debugger;
|
||||
|
||||
console.log('newVal=', newVal);
|
||||
getRecordList(); // 调用回调
|
||||
}
|
||||
|
||||
@ -108,6 +108,13 @@ function initData(item) {
|
||||
return;
|
||||
}
|
||||
deviceid = item.data.deviceId;
|
||||
detailData.value=[];
|
||||
lastData.value.code="";
|
||||
lastData.value.name="";
|
||||
lastData.value.unitName="";
|
||||
lastData.value.position="";
|
||||
|
||||
|
||||
request({
|
||||
url: '/api/device/getDeviceUser/' + item.data.deviceId,
|
||||
method: 'get'
|
||||
@ -211,9 +218,9 @@ text-align: left;
|
||||
height: 21px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
margin-left: -7px;
|
||||
}
|
||||
|
||||
|
||||
.list .itemRow {
|
||||
color: rgba(56, 64, 79, 1);
|
||||
|
||||
@ -225,13 +232,17 @@ letter-spacing: 0px;
|
||||
text-align: left;
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
.list .itemRow:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.itemChild.marginBottom {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.list .childContent {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-left: 1px solid rgba(0, 198, 250, 0.2);
|
||||
border-left: 2px solid rgba(0, 198, 250, 0.2);
|
||||
box-sizing: border-box;
|
||||
padding: 6px 20px;
|
||||
}
|
||||
@ -241,6 +252,8 @@ margin-bottom: 13px;
|
||||
background: rgba(247, 248, 252, 1);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.fleft {
|
||||
|
||||
@ -125,7 +125,7 @@ function initData(item, Refresh) {
|
||||
params: params
|
||||
})
|
||||
.then((res) => {
|
||||
debugger;
|
||||
|
||||
if (res.code == 200) {
|
||||
if (res.rows) {
|
||||
if (res.rows.length) {
|
||||
|
||||
@ -24,7 +24,7 @@
|
||||
|
||||
<div class="item">
|
||||
<div class="lable">通讯方式<span>:</span></div>
|
||||
<div class="val">{{ detailData?.communicationMode===1 ?'蓝牙':'4G' }}</div>
|
||||
<div class="val">{{ detailData?.communicationMode===1 ?'4G':'蓝牙' }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">蓝牙名称<span>:</span></div>
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<div :class="Status.Mode == PageMode.device ? '' : 'displayNone'">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter"
|
||||
:leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
@ -11,30 +12,38 @@
|
||||
<el-form-item label="设备MAC" prop="deviceMac">
|
||||
<el-input v-model="queryParams.deviceMac" placeholder="请输入设备MAC" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="请输入设备IMEI" prop="deviceImei">
|
||||
<el-form-item label="设备IMEI" prop="deviceImei">
|
||||
<el-input v-model="queryParams.deviceImei" placeholder="请输入设备IMEI" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="设备类型" prop="deviceType" >
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型">
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName" :value="item.id" />
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型" clearable filterable>
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
|
||||
:value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="设备状态" prop="deviceStatus">
|
||||
<el-select v-model="queryParams.deviceStatus" placeholder="设备状态" style="margin-left: 10px">
|
||||
<el-form-item label="设备状态" prop="deviceStatus" v-hasPermi="['equipment:devices:allocate']">
|
||||
<el-select v-model="queryParams.deviceStatus" placeholder="设备状态" clearable>
|
||||
<el-option label="正常" value="1" />
|
||||
<el-option label="失效" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="在线状态" prop="onlineStatus">
|
||||
<el-select v-model="queryParams.onlineStatus" placeholder="在线状态" clearable>
|
||||
<el-option label="在线" value="1" />
|
||||
<el-option label="离线" value="0" />
|
||||
<el-option label="故障" value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="绑定状态" prop="bindingStatus">
|
||||
<el-select v-model="queryParams.bindingStatus" placeholder="绑定状态" clearable>
|
||||
<el-option label="已绑定" value="1" />
|
||||
<el-option label="未绑定" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
:default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
|
||||
></el-date-picker>
|
||||
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD HH:mm:ss" type="daterange"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
|
||||
:default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
@ -49,29 +58,33 @@
|
||||
<template #header>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="1.5">
|
||||
<el-button v-hasPermi="['equipment:devices:add']" type="primary" plain icon="Plus" @click="handleAdd()">新增</el-button>
|
||||
<el-button v-hasPermi="['equipment:devices:add']" type="primary" plain icon="Plus"
|
||||
@click="handleAdd()">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button v-hasPermi="['equipment:devices:edit']" type="success" plain :disabled="single" icon="Edit" @click="handleUpdate()">
|
||||
<el-button v-hasPermi="['equipment:devices:edit']" type="success" plain :disabled="single" icon="Edit"
|
||||
@click="handleUpdate()">
|
||||
修改
|
||||
</el-button>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="1.5">
|
||||
<el-button v-hasPermi="['equipment:devices:export']" type="warning" :disabled="multiple" plain icon="Download" @click="handleExport"
|
||||
>导出</el-button
|
||||
>
|
||||
<el-button v-hasPermi="['equipment:devices:export']" type="warning" plain icon="Download"
|
||||
@click="handleExport">导出</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button v-hasPermi="['equipment:devices:remove']" type="danger" plain :disabled="multiple" @click="handleDelete()">
|
||||
<el-button v-hasPermi="['equipment:devices:remove']" type="danger" plain :disabled="multiple"
|
||||
@click="handleDelete()">
|
||||
批量删除
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button v-hasPermi="['equipment:devices:import']" type="warning" plain @click="handleBatchImport"> 批量导入 </el-button>
|
||||
<el-button v-hasPermi="['equipment:devices:import']" type="warning" plain @click="handleBatchImport"> 批量导入
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button v-hasPermi="['equipment:devices:allocate']" type="warning" plain :disabled="multiple" @click="handleBatchAssign">
|
||||
<el-button v-hasPermi="['equipment:devices:allocate']" type="warning" plain :disabled="multiple"
|
||||
@click="handleBatchAssign">
|
||||
批量分配客户
|
||||
</el-button>
|
||||
</el-col>
|
||||
@ -82,16 +95,15 @@
|
||||
<el-table v-loading="loading" border :data="deviceDist" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column prop="customerName" label="所属客户" />
|
||||
<el-table-column prop="customerName" label="所属客户" v-hasPermi="['equipment:devices:allocate']" />
|
||||
<el-table-column prop="devicePic" label="设备图片">
|
||||
<template #default="scope">
|
||||
<el-popover placement="right" trigger="click">
|
||||
<template #reference>
|
||||
<img
|
||||
:src="scope.row.devicePic"
|
||||
style="width: 40px; height: 40px; cursor: pointer; object-fit: contain"
|
||||
class="hover:opacity-80 transition-opacity"
|
||||
/>
|
||||
<img v-if="scope.row.devicePic" :src="scope.row.devicePic"
|
||||
style="width: 50px; height: 50px; cursor: pointer; object-fit: contain"
|
||||
class="hover:opacity-80 transition-opacity" />
|
||||
<img v-else src="@/assets/index/IMG.png" alt="" style="width: 40px; height: 40px;">
|
||||
</template>
|
||||
<img :src="scope.row.devicePic" style="max-width: 600px; max-height: 600px; object-fit: contain" />
|
||||
</el-popover>
|
||||
@ -108,7 +120,14 @@
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deviceStatus" label="设备状态">
|
||||
<el-table-column prop="onlineStatus" label="设备状态">
|
||||
<template #default="scope">
|
||||
<el-tag :type="scope.row.onlineStatus === 1 ? 'success' : 'info'">
|
||||
{{ scope.row.onlineStatus === 1 ? '在线' : (scope.row.onlineStatus === 2 ? '故障' : '离线') }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deviceStatus" label="设备状态" v-hasPermi="['equipment:devices:allocate']">
|
||||
<template #default="scope">
|
||||
<el-tag :type="scope.row.deviceStatus == 1 ? 'success' : 'danger'">
|
||||
{{ scope.row.deviceStatus == 1 ? '正常' : '失效' }}
|
||||
@ -122,25 +141,25 @@
|
||||
<el-table-column label="操作" fixed="right" width="280" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip v-if="scope.row.id !== 1 && scope.row.deviceStatus == 1" content="修改" placement="top">
|
||||
<el-button v-hasPermi="['equipment:devices:edit']" link type="primary" icon="Edit" @click="handleUpdate(scope.row)"></el-button>
|
||||
<el-button v-hasPermi="['equipment:devices:edit']" link type="primary" icon="Edit"
|
||||
@click="handleUpdate(scope.row)"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="!scope.row.customerName" content="删除" placement="top">
|
||||
<el-button v-hasPermi="['equipment:devices:remove']" link type="primary" icon="Delete" @click="handleDelete(scope.row)"></el-button>
|
||||
<el-button v-hasPermi="['equipment:devices:remove']" link type="primary" icon="Delete"
|
||||
@click="handleDelete(scope.row)"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="scope.row.deviceStatus == 1 && !scope.row.customerName" content="分配" placement="top">
|
||||
<el-button v-hasPermi="['equipment:devices:allocate']" link type="primary" icon="User" @click="handleAssign(scope.row)"></el-button>
|
||||
<el-button v-hasPermi="['equipment:devices:allocate']" link type="primary" icon="User"
|
||||
@click="handleAssign(scope.row)"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="scope.row.customerName && scope.row.deviceStatus == 1" content="撤回" placement="top">
|
||||
<el-button
|
||||
v-hasPermi="['equipment:devices:revoke']"
|
||||
link
|
||||
type="primary"
|
||||
icon="UploadFilled"
|
||||
@click="handleWithdraw(scope.row)"
|
||||
></el-button>
|
||||
<el-button v-hasPermi="['equipment:devices:revoke']" link type="primary" icon="UploadFilled"
|
||||
@click="handleWithdraw(scope.row)"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="scope.row.bindingStatus == 1" :disabled="scope.row.deviceStatus === 0" content="解绑" placement="top">
|
||||
<el-button v-hasPermi="['equipment:devices:unbind']" link type="primary" icon="Refresh" @click="handleUnbind(scope.row)"></el-button>
|
||||
<el-tooltip v-if="scope.row.bindingStatus == 1" :disabled="scope.row.deviceStatus === 0" content="解绑"
|
||||
placement="top">
|
||||
<el-button v-hasPermi="['equipment:devices:unbind']" link type="primary" icon="Refresh"
|
||||
@click="handleUnbind(scope.row)"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="scope.row.deviceImei" content="查看二维码" placement="top">
|
||||
<el-button link type="primary" icon="Postcard" @click="showQrCode(scope.row)"></el-button>
|
||||
@ -151,7 +170,8 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" />
|
||||
<pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
|
||||
:total="total" @pagination="getList" />
|
||||
</el-card>
|
||||
</div>
|
||||
<div :class="Status.Mode == PageMode.detail ? '' : 'displayNone'" class="detailMain">
|
||||
@ -193,7 +213,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<!-- 添加或修改用户配置对话框 -->
|
||||
<el-dialog ref="formDialogRef" v-model="dialog.visible" :title="dialog.title" width="30%" append-to-body @close="closeDialog">
|
||||
<el-dialog ref="formDialogRef" v-model="dialog.visible" :title="dialog.title" width="30%" append-to-body
|
||||
@close="closeDialog">
|
||||
<el-form ref="userFormRef" :model="form" :rules="rules" label-width="120px">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
@ -205,8 +226,10 @@
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="设备类型" prop="deviceType">
|
||||
<el-select v-model="form.deviceType" placeholder="设备类型" @change="(id) => handleDeviceTypeChange(id)" :disabled="form.id != ''">
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName" :value="item.id" />
|
||||
<el-select v-model="form.deviceType" placeholder="设备类型" @change="(id) => handleDeviceTypeChange(id)"
|
||||
clearable filterable>
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName"
|
||||
:value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -235,15 +258,8 @@
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="设备图片" prop="image">
|
||||
<el-upload
|
||||
action="#"
|
||||
list-type="picture-card"
|
||||
:before-upload="beforeUpload"
|
||||
:on-change="fileUploadChange"
|
||||
:http-request="httpRequestImg"
|
||||
:file-list="fileList"
|
||||
:limit="1"
|
||||
>
|
||||
<el-upload action="#" list-type="picture-card" :before-upload="beforeUpload" :on-change="fileUploadChange"
|
||||
:http-request="httpRequestImg" :file-list="fileList" :limit="1">
|
||||
<i class="el-icon-plus"></i>
|
||||
<template v-if="form.image && typeof form.image === 'string'">
|
||||
<img :src="form.image" class="avatar" style="width: 100px; height: 100px; object-fit: contain" />
|
||||
@ -272,7 +288,8 @@
|
||||
<el-form>
|
||||
<el-form-item label="选择客户">
|
||||
<el-select v-model="assignCustomerId" placeholder="请选择客户" style="width: 100%">
|
||||
<el-option v-for="item in customerList" :key="item.customerId" :label="item.nickName" :value="item.customerId" />
|
||||
<el-option v-for="item in customerList" :key="item.customerId" :label="item.nickName"
|
||||
:value="item.customerId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -290,32 +307,22 @@
|
||||
<p>模板文件中的表头请勿修改,数据请从第二行开始填写。</p>
|
||||
<el-button type="primary" icon="el-icon-download" @click="downloadTemplate">下载模板文件</el-button>
|
||||
</div>
|
||||
<el-upload
|
||||
ref="importUpload"
|
||||
:action="api.devicDeimport()"
|
||||
:headers="head_upload()"
|
||||
:show-file-list="false"
|
||||
:before-upload="beforeImportUpload"
|
||||
:on-success="handleImportSuccess"
|
||||
:on-error="handleImportError"
|
||||
:limit="1"
|
||||
accept=".xlsx,.xls"
|
||||
>
|
||||
<el-upload ref="importUpload" :action="api.devicDeimport()" :headers="head_upload()" :show-file-list="false"
|
||||
:before-upload="beforeImportUpload" :on-success="handleImportSuccess" :on-error="handleImportError" :limit="1"
|
||||
accept=".xlsx,.xls">
|
||||
<el-button type="success">选择文件开始导入</el-button>
|
||||
<div v-if="!importResult.isShow" slot="tip" class="el-upload__tip">
|
||||
<div style="color: #409eff">只能上传模板excel文件</div>
|
||||
</div>
|
||||
<div v-if="importResult.isShow" slot="tip" class="el-upload__tip">
|
||||
<span style="color: #409eff"
|
||||
>批量导入完成,共检测到 <span style="color: #e6a23c">{{ importResult.total }}</span> 条数据,导入成功
|
||||
<span style="color: #409eff">批量导入完成,共检测到 <span style="color: #e6a23c">{{ importResult.total }}</span> 条数据,导入成功
|
||||
<span style="color: #67c23a">{{ importResult.succeed }}</span> 条,失败
|
||||
<span style="color: red">{{ importResult.errorSun }}</span> 条。</span
|
||||
>
|
||||
<span style="color: red">{{ importResult.errorSun }}</span> 条。</span>
|
||||
</div>
|
||||
</el-upload>
|
||||
<p v-if="importResult.errorSun > 0" style="padding: 10px">
|
||||
<a :href="importResult.link">>>> 上传失败明细下载 <i class="el-icon-download" /></a>
|
||||
</p>
|
||||
</div>
|
||||
</el-upload>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="importDialogVisible = false">取 消</el-button>
|
||||
@ -327,7 +334,8 @@
|
||||
<el-form>
|
||||
<el-form-item label="选择客户">
|
||||
<el-select v-model="batchAssignCustomerId" placeholder="请选择客户" style="width: 100%">
|
||||
<el-option v-for="item in customerList" :key="item.customerId" :label="item.nickName" :value="item.customerId" />
|
||||
<el-option v-for="item in customerList" :key="item.customerId" :label="item.nickName"
|
||||
:value="item.customerId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -456,7 +464,9 @@ const initData: PageData<deviceForm, deviceQuery> = {
|
||||
deviceMac: '',
|
||||
deviceImei: '',
|
||||
deviceType: '',
|
||||
deviceStatus: ''
|
||||
deviceStatus: '',
|
||||
onlineStatus: '',
|
||||
bindingStatus:''
|
||||
},
|
||||
rules: {
|
||||
deviceName: [{ required: true, message: '请输入设备名称', trigger: 'blur' }],
|
||||
@ -529,7 +539,7 @@ const handleExport = () => {
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`${new Date().getTime()}.xlsx`,
|
||||
`设备列表${new Date().getTime()}.xlsx`,
|
||||
'get'
|
||||
);
|
||||
};
|
||||
@ -612,6 +622,7 @@ const handleAdd = async () => {
|
||||
};
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: deviceForm) => {
|
||||
debugger;
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改设备';
|
||||
@ -653,29 +664,29 @@ const handleDeviceTypeChange = async (deviceTypeId: string | number) => {
|
||||
showImeiField.value = false;
|
||||
communicationModeInfo.value = null;
|
||||
// 编辑时如果有值,根据已有值确定显示哪个字段
|
||||
if (form.value.id) {
|
||||
console.log('zheshi me1 ');
|
||||
// 1. 先判断:Mac 和 Imei 都有值(新增的关键分支)
|
||||
const hasMac = typeof form.value.deviceMac === 'string' && form.value.deviceMac.trim() !== '';
|
||||
const hasImei = typeof form.value.deviceImei === 'string' && form.value.deviceImei.trim() !== '';
|
||||
if (hasMac && hasImei) {
|
||||
//两个都有值:显示两个字段 + 都加校验
|
||||
showMacField.value = true;
|
||||
showImeiField.value = true;
|
||||
console.log('两个字段都有值');
|
||||
} else if (hasMac) {
|
||||
showMacField.value = true;
|
||||
showImeiField.value = false;
|
||||
rules.value.deviceImei = [];
|
||||
console.log('只有 Mac 有值');
|
||||
} else if (hasImei) {
|
||||
showImeiField.value = true;
|
||||
showMacField.value = false;
|
||||
rules.value.deviceMac = [];
|
||||
console.log('只有 Imei 有值');
|
||||
}
|
||||
return;
|
||||
}
|
||||
// if (form.value.id) {
|
||||
// console.log('zheshi me1 ');
|
||||
// // 1. 先判断:Mac 和 Imei 都有值(新增的关键分支)
|
||||
// const hasMac = typeof form.value.deviceMac === 'string' && form.value.deviceMac.trim() !== '';
|
||||
// const hasImei = typeof form.value.deviceImei === 'string' && form.value.deviceImei.trim() !== '';
|
||||
// if (hasMac && hasImei) {
|
||||
// //两个都有值:显示两个字段 + 都加校验
|
||||
// showMacField.value = true;
|
||||
// showImeiField.value = true;
|
||||
// console.log('两个字段都有值');
|
||||
// } else if (hasMac) {
|
||||
// showMacField.value = true;
|
||||
// showImeiField.value = false;
|
||||
// rules.value.deviceImei = [];
|
||||
// console.log('只有 Mac 有值');
|
||||
// } else if (hasImei) {
|
||||
// showImeiField.value = true;
|
||||
// showMacField.value = false;
|
||||
// rules.value.deviceMac = [];
|
||||
// console.log('只有 Imei 有值');
|
||||
// }
|
||||
// return;
|
||||
// }
|
||||
if (isProcessing) return;
|
||||
isProcessing = true;
|
||||
// 新增或编辑时没有值,根据设备类型获取通讯方式
|
||||
@ -716,17 +727,17 @@ const httpRequestImg = (parm): Promise<any> => {
|
||||
return Promise.resolve();
|
||||
};
|
||||
const beforeUpload = (file) => {
|
||||
const isLt2M = file.size / 1024 / 1024 < 2;
|
||||
//const isLt2M = file.size / 1024 / 1024 < 2;
|
||||
const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
|
||||
if (!isJPG) {
|
||||
ElMessage.warning('请上传jpg、png格式,大小不超过2M的照片');
|
||||
ElMessage.warning('请上传jpg、png格式');
|
||||
return false;
|
||||
}
|
||||
if (!isLt2M) {
|
||||
ElMessage.warning('大小不超过2M的照片片');
|
||||
return false;
|
||||
}
|
||||
return isJPG && isLt2M;
|
||||
// if (!isLt2M) {
|
||||
// ElMessage.warning('大小不超过2M的照片片');
|
||||
// return false;
|
||||
// }
|
||||
return isJPG;
|
||||
};
|
||||
// 文件上传状态改变时触发
|
||||
const fileUploadChange = (files, fileList) => {
|
||||
@ -750,11 +761,12 @@ const submitForm = async () => {
|
||||
// 处理图片字段
|
||||
if (form.value.image instanceof File) {
|
||||
formData.append('file', form.value.image);
|
||||
} else if (form.value.image && typeof form.value.image === 'string') {
|
||||
// 如果是URL且需要转换为二进制
|
||||
const blob = await urlToBlob(form.value.image);
|
||||
formData.append('file', blob, 'image.jpg'); // 添加文件名
|
||||
}
|
||||
// else if (form.value.image && typeof form.value.image === 'string') {
|
||||
// // 如果是URL且需要转换为二进制
|
||||
// const blob = await urlToBlob(form.value.image);
|
||||
// formData.append('file', blob, 'image.jpg'); // 添加文件名
|
||||
// }
|
||||
// 添加其他必要字段
|
||||
const fields = ['id', 'deviceName', 'deviceType', 'remark'];
|
||||
fields.forEach((key) => {
|
||||
@ -799,11 +811,11 @@ const submitForm = async () => {
|
||||
};
|
||||
|
||||
// URL转Blob的方法函数
|
||||
const urlToBlob = async (url: string): Promise<Blob> => {
|
||||
const response = await fetch(url);
|
||||
if (!response.ok) throw new Error('图片加载失败');
|
||||
return await response.blob();
|
||||
};
|
||||
// const urlToBlob = async (url: string): Promise<Blob> => {
|
||||
// const response = await fetch(url);
|
||||
// if (!response.ok) throw new Error('图片加载失败');
|
||||
// return await response.blob();
|
||||
// };
|
||||
|
||||
/**
|
||||
* 关闭用户弹窗
|
||||
@ -905,7 +917,7 @@ const handleBatchImport = () => {
|
||||
const downloadTemplate = () => {
|
||||
// 这里可用 window.open 或 a 标签下载模板
|
||||
const link = document.createElement('a');
|
||||
link.href = 'https://fuyuanshen.com/fys/Equipmentimporttemplate/EquipmentImportTemplate.xlsx';
|
||||
link.href = 'https://www.cnxhyc.com/jquan/Equipmentimporttemplate/EquipmentImportTemplate.xlsx';
|
||||
link.download = '设备数据导入模板.xlsx'; // 可选:指定下载文件名
|
||||
link.style.display = 'none'; // 隐藏标签
|
||||
document.body.appendChild(link);
|
||||
@ -913,27 +925,35 @@ const downloadTemplate = () => {
|
||||
document.body.removeChild(link); // 移除标签
|
||||
};
|
||||
const beforeImportUpload = (file: any) => {
|
||||
const isLt5M = file.size / 1024 / 1024 < 5;
|
||||
if (!isLt5M) {
|
||||
proxy?.$modal.msgError('上传文件大小不能超过 5MB!');
|
||||
}
|
||||
return isLt5M;
|
||||
// const isLt5M = file.size / 1024 / 1024 < 5;
|
||||
// if (!isLt5M) {
|
||||
// proxy?.$modal.msgError('上传文件大小不能超过 5MB!');
|
||||
// }
|
||||
// return isLt5M;
|
||||
};
|
||||
|
||||
//添加tokenf方法head_upload 直接返回 getBearerToken()
|
||||
const head_upload = () => getBearerToken();
|
||||
const handleImportSuccess = (response: any) => {
|
||||
if (response.code == 200) {
|
||||
console.log('导入成功了么');
|
||||
importResult.value.isShow = true;
|
||||
if (response.data) {
|
||||
importResult.value.succeed = response.data.successCount || 0;
|
||||
importResult.value.errorSun = response.data.failureCount || 0;
|
||||
console.log(response.data, 'response.data');
|
||||
importResult.value.succeed = response.data.successCount;
|
||||
importResult.value.errorSun = response.data.failureCount;
|
||||
importResult.value.total = importResult.value.succeed + importResult.value.errorSun;
|
||||
importResult.value.link = response.data.errorExcelUrl || '';
|
||||
importResult.value.link = response.data.errorExcelUrl;
|
||||
}
|
||||
if (importUpload.value) {
|
||||
importUpload.value.clearFiles();
|
||||
}
|
||||
getList(); // 初始化列表数据
|
||||
} else {
|
||||
proxy?.$modal.msgError(response.msg || '导入失败');
|
||||
if (importUpload.value) {
|
||||
importUpload.value.clearFiles();
|
||||
}
|
||||
proxy?.$modal.msgError(response.msg);
|
||||
}
|
||||
};
|
||||
const handleImportError = () => {
|
||||
@ -956,9 +976,7 @@ const handleBatchAssignConfirm = () => {
|
||||
customerId: batchAssignCustomerId.value, // 目标客户ID
|
||||
deviceIds: selectedIds // 选中的设备ID数组
|
||||
};
|
||||
api
|
||||
.deviceAssignCustomer(data)
|
||||
.then((res) => {
|
||||
api.deviceAssignCustomer(data).then((res) => {
|
||||
if (res.code == 200) {
|
||||
batchAssignDialogVisible.value = false;
|
||||
getList();
|
||||
|
||||
@ -1,20 +1,24 @@
|
||||
<template>
|
||||
<div class="content" v-loading="Status.fullLoading">
|
||||
<div class="topFilter">
|
||||
<div>
|
||||
<div class="topTool">
|
||||
<el-button type="primary" @click="ShowEdit"
|
||||
><el-icon> <Plus /> </el-icon>添加分享</el-button
|
||||
>
|
||||
<el-button type="danger" @click="DelShare(null, true)" :disabled="selectRows.length === 0">批量删除</el-button>
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
<el-form :inline="true" :model="filter" class="demo-form-inline">
|
||||
<el-form-item label="">
|
||||
<el-input v-model="filter.phonenumber" placeholder="查找分享用户" @input="Search">
|
||||
<template #append>
|
||||
<el-button :icon="'Search'" />
|
||||
</template>
|
||||
</el-input>
|
||||
|
||||
|
||||
<el-input
|
||||
v-model="filter.phonenumber"
|
||||
placeholder="查找分享用户"
|
||||
:suffix-icon="'Search'"
|
||||
@input="Search"
|
||||
/>
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item label="分享时间">
|
||||
<el-date-picker
|
||||
@ -72,13 +76,13 @@
|
||||
<el-checkbox :label="item.label" v-for="item in power" :value="item.value" />
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码" label-position="right">
|
||||
<!-- <el-form-item label="验证码" label-position="right">
|
||||
<el-input v-model="cEdit.smsCode" placeholder="验证码">
|
||||
<template #append
|
||||
><div class="btnSendSms" @click.stop="sendSms">{{ time > 0 ? time + '秒后重发' : '发送验证码' }}</div></template
|
||||
>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="center" style="margin-top: 10px">
|
||||
@ -92,7 +96,7 @@
|
||||
<div class="form">
|
||||
<el-form :model="cEdit" ref="ruleFormRef" style="max-width: 750px" :label-width="'75px'">
|
||||
<el-form-item label="分享用户" label-position="right">
|
||||
<el-select v-model="cEdit.phonenumber" filterable placeholder="输入以搜索">
|
||||
<el-select v-model="cEdit.phonenumber" filterable allow-create default-first-option placeholder="输入以搜索">
|
||||
<el-option v-for="item in Usrs" :key="item.phonenumber" :label="item.userName" :value="item.phonenumber" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@ -137,6 +141,7 @@
|
||||
import request from '@/utils/request';
|
||||
import common from '@/utils/common';
|
||||
import api from '@/api/equipmentManagement/device/shareManage';
|
||||
import { dataURLtoImage } from 'image-conversion';
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
@ -201,32 +206,206 @@ var dic = reactive({
|
||||
'3': '开机画面',
|
||||
'4': '人员信息登记',
|
||||
'5': '发送信息',
|
||||
'6': '产品信息'
|
||||
'6': '产品信息',
|
||||
'41':'静电探测',
|
||||
'42':'SOS'
|
||||
});
|
||||
|
||||
var power = computed(() => {
|
||||
let arr = [];
|
||||
let keys = Object.keys(dic);
|
||||
keys.forEach((key) => {
|
||||
arr.push({ label: dic[key], value: key });
|
||||
});
|
||||
return arr;
|
||||
});
|
||||
|
||||
var power =ref([]);
|
||||
|
||||
function calcPower() {
|
||||
|
||||
|
||||
let array = [{
|
||||
value: "1",
|
||||
label: "灯光模式",
|
||||
checked: false,
|
||||
type: ['BJQ6170', 'HBY670','HBY102','BJQ6155','HBY650','BJQ7305','61XH55']
|
||||
},
|
||||
{
|
||||
value: "2",
|
||||
label: "激光模式",
|
||||
checked: false,
|
||||
type: ['BJQ6170']
|
||||
},
|
||||
{
|
||||
value: "3",
|
||||
label: "开机画面",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670','BJQ6155','HBY650','BJQ7305','61XH55']
|
||||
},
|
||||
{
|
||||
value: "4",
|
||||
label: "人员信息登记",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670','BJQ6155','HBY650','BJQ7305','61XH55']
|
||||
},
|
||||
{
|
||||
value: "5",
|
||||
label: "发送信息",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670']
|
||||
},
|
||||
{
|
||||
value: "6",
|
||||
label: "产品信息",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670']
|
||||
}, {
|
||||
value: "41",
|
||||
label: "静电探测",
|
||||
checked: false,
|
||||
type: ['HBY670','HBY650']
|
||||
}, {
|
||||
value: "42",
|
||||
label: "SOS",
|
||||
checked: false,
|
||||
type: ['HBY670','BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "43",
|
||||
label: "联机设备",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "44",
|
||||
label: "报警声音",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "45",
|
||||
label: "自动报警",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "46",
|
||||
label: "手动报警",
|
||||
checked: false,
|
||||
type: ['HBY210','HBY102']
|
||||
},
|
||||
{
|
||||
value: "47",
|
||||
label: "报警时长",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "48",
|
||||
label: "物体感应",
|
||||
checked: false,
|
||||
type: ['HBY102']
|
||||
},
|
||||
{
|
||||
value: "49",
|
||||
label: "联机模式",
|
||||
checked: false,
|
||||
type: ['HBY102']
|
||||
},
|
||||
|
||||
{
|
||||
value: "50",
|
||||
label: "报警模式",
|
||||
checked: false,
|
||||
type: ['HBY100','HBY100-J']
|
||||
},
|
||||
|
||||
{
|
||||
value: "51",
|
||||
label: "警示灯",
|
||||
checked: false,
|
||||
type: ['HBY100','HBY100-J']
|
||||
},
|
||||
|
||||
{
|
||||
value: "52",
|
||||
label: "语音管理",
|
||||
checked: false,
|
||||
type: ['HBY100','HBY100-J']
|
||||
},
|
||||
|
||||
{
|
||||
value: "53",
|
||||
label: "箭头模式",
|
||||
checked: false,
|
||||
type: ['BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "54",
|
||||
label: "配组设置",
|
||||
checked: false,
|
||||
type: ['BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "55",
|
||||
label: "修改信道",
|
||||
checked: false,
|
||||
type: ['BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "56",
|
||||
label: "灯光类型设置",
|
||||
checked: false,
|
||||
type: ['HBY100-J']
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
let f=array.filter(v=>{
|
||||
if(v.type.indexOf(data.value.typeName)>-1){
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
})
|
||||
|
||||
power.value=f;
|
||||
|
||||
// let arr = [];
|
||||
// let keys = Object.keys(dic);
|
||||
|
||||
// keys.forEach((key) => {
|
||||
// arr.push({ label: dic[key], value: key });
|
||||
// });
|
||||
// return arr;
|
||||
};
|
||||
|
||||
|
||||
//打开编辑
|
||||
function ShowEdit() {
|
||||
Status.ShowEditPop = true;
|
||||
getUsrs();
|
||||
calcPower();
|
||||
}
|
||||
//关闭编辑
|
||||
function CloseEdit() {
|
||||
Status.ShowEditPop = false;
|
||||
Status.ShowPowerSet = false;
|
||||
cEdit.phonenumber="";
|
||||
cEdit.permission= [];
|
||||
cEdit.remark= '';
|
||||
cEdit.smsCode= '';
|
||||
}
|
||||
|
||||
//添加分享
|
||||
|
||||
//保存分享数据
|
||||
function SaveFormData(type) {
|
||||
|
||||
if(!cEdit.phonenumber){
|
||||
|
||||
alert("请输入或选择手机号");
|
||||
return ;
|
||||
}
|
||||
|
||||
let reg=/^1\d{10}$/
|
||||
if(reg.test(cEdit.phonenumber)){
|
||||
alert("手机号格式不正确");
|
||||
return;
|
||||
}
|
||||
|
||||
let data = {
|
||||
'deviceId': deviceid,
|
||||
'phonenumber': cEdit.phonenumber,
|
||||
@ -235,7 +414,6 @@ function SaveFormData(type) {
|
||||
'remark': cEdit.remark,
|
||||
'smsCode': cEdit.smsCode
|
||||
};
|
||||
|
||||
Status.fullLoading = true;
|
||||
api
|
||||
.SaveShare(data, type)
|
||||
@ -243,22 +421,17 @@ function SaveFormData(type) {
|
||||
if (res.code == 200) {
|
||||
getRecordList();
|
||||
CloseEdit();
|
||||
Status.fullLoading = false;
|
||||
}
|
||||
alert(res.msg);
|
||||
})
|
||||
.catch((ex) => {
|
||||
console.log('出现异常', ex);
|
||||
})
|
||||
.finally(() => {
|
||||
Status.fullLoading = false;
|
||||
cEdit.phonenumber = '';
|
||||
cEdit.permission = [];
|
||||
cEdit.remark = '';
|
||||
cEdit.smsCode = '';
|
||||
});
|
||||
}
|
||||
|
||||
function getPower(item) {
|
||||
|
||||
let str = [];
|
||||
if (item && item.permission) {
|
||||
let arr = item.permission.split(',');
|
||||
@ -288,7 +461,7 @@ function DelShare(item, isBatch) {
|
||||
alert('请选择需要删除的数据');
|
||||
return;
|
||||
}
|
||||
debugger;
|
||||
|
||||
let OkDel = () => {
|
||||
hideConfirm();
|
||||
Status.fullLoading = true;
|
||||
@ -353,12 +526,12 @@ function sendSms() {
|
||||
}
|
||||
//权限设置
|
||||
function powerSet(item) {
|
||||
debugger;
|
||||
|
||||
Status.ShowPowerSet = true;
|
||||
cEdit.permission = item.permission.split(',');
|
||||
cEdit.phonenumber = item.phonenumber;
|
||||
cEdit.remark = item.remark;
|
||||
cEdit.smsCode = '123456';
|
||||
cEdit.smsCode = '';
|
||||
}
|
||||
|
||||
function getUsrs() {
|
||||
@ -403,7 +576,7 @@ function initData(item, Refresh) {
|
||||
Status.loading = false;
|
||||
return;
|
||||
}
|
||||
debugger;
|
||||
|
||||
List.value = [];
|
||||
|
||||
deviceid = item.data.deviceId;
|
||||
@ -515,7 +688,7 @@ watch(
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 12px 12px 12px;
|
||||
padding: 12px 12px 12px 12px;
|
||||
}
|
||||
.center {
|
||||
display: flex;
|
||||
@ -537,6 +710,8 @@ watch(
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
|
||||
}
|
||||
:deep .pickerContent .el-date-editor {
|
||||
border: none !important;
|
||||
@ -563,4 +738,13 @@ watch(
|
||||
:deep .topFilter .el-input-group__append {
|
||||
padding: 0px 10px !important;
|
||||
}
|
||||
.topTool{
|
||||
display: flex
|
||||
;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -23,44 +23,14 @@
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['equipment:log:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['equipment:log:edit']">修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['equipment:log:remove']">删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['equipment:log:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="logList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="设备行为" align="center" prop="deviceAction" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column label="数据来源" align="center" prop="dataSource" />
|
||||
<el-table-column label="操作时间" align="center" prop="createTime" />
|
||||
<el-table-column label="内容" align="center" prop="content" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['equipment:log:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['equipment:log:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</el-card>
|
||||
<!-- 添加或修改设备日志对话框 -->
|
||||
|
||||
596
src/views/fys-equipment/fenceAccessRecord/index.vue
Normal file
@ -0,0 +1,596 @@
|
||||
<template>
|
||||
<div class="content" v-loading="Status.fullLoading">
|
||||
<div class="percent100">
|
||||
<div class="topTool">
|
||||
<div class="button-row">
|
||||
<!-- <el-button type="primary" @click.stop="ShowEdit(null)"
|
||||
><el-icon><Plus /></el-icon>新增</el-button -->
|
||||
|
||||
<el-button type="primary" @click.stop="Export()" plain
|
||||
><el-icon><Download /></el-icon>导出</el-button
|
||||
>
|
||||
<el-button type="danger" plain @click.stop="DropFence(null)"
|
||||
><el-icon><Delete /></el-icon>删除</el-button
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<el-form :inline="true" :model="queryParams" class="demo-form-inline" @submit.native.prevent>
|
||||
<el-form-item label="" style="margin-right: 15px">
|
||||
<el-input :suffix-icon="'Search'" v-model="queryParams.fenceName" placeholder="名称" clearable @input="handleQuery" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item style="margin-right: 0px">
|
||||
<el-button type="primary" @click.stop="showSearch">高级筛选</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="demo-collapse" v-show="Status.showSearch.length > 0">
|
||||
<el-collapse accordion v-model="Status.showSearch">
|
||||
<el-collapse-item name="1">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" class="queryFormRef">
|
||||
<el-form-item label="事件类型" prop="eventType">
|
||||
<el-select v-model="queryParams.eventType" placeholder="请选择" clearable>
|
||||
<el-option :key="1" :label="'闯入'" :value="1" />
|
||||
<el-option :key="2" :label="'离开'" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="事件时间" prop="Date">
|
||||
<el-date-picker
|
||||
style="width: 240px"
|
||||
v-model="queryParams.Date"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="围栏名称" prop="fenceId">
|
||||
<el-select v-model="queryParams.fenceId" placeholder="请选择" clearable filterable>
|
||||
<el-option v-for="item in dic.fence" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="设备名称" prop="deviceId">
|
||||
<el-select v-model="queryParams.deviceId" placeholder="请选择" clearable filterable>
|
||||
<el-option v-for="item in dic.device" :key="item.deviceId" :label="item.deviceName" :value="item.deviceId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||
<el-button @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
ref="grid"
|
||||
v-loading="Status.loading"
|
||||
border
|
||||
:data="List"
|
||||
:height="Status.showSearch.length > 0 ? 'calc(100vh - 355px)' : 'calc(100vh - 255px)'"
|
||||
>
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
|
||||
<el-table-column label="围栏名称" align="center" prop="fenceName"> </el-table-column>
|
||||
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName"> </el-table-column>
|
||||
<el-table-column label="事件时间" align="center" prop="eventTime"> </el-table-column>
|
||||
<el-table-column label="事件类型" align="center" prop="eventType">
|
||||
<template #default="scope">
|
||||
<div>{{ scope.row.eventType == '1' ? '闯入' : '离开' }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- <el-table-column label="经纬度" align="center" prop="id">
|
||||
<template #default="scope">
|
||||
<span style="margin-right: 15px">{{ scope.row.longitude }}</span
|
||||
><span>{{ scope.row.latitude }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="精度" align="userName" prop="accuracy"> </el-table-column> -->
|
||||
<el-table-column label="事件地址" align="left" prop="eventAddress"> </el-table-column>
|
||||
|
||||
<el-table-column label="操作" fixed="right" width="180" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<!-- <el-button link type="primary" @click="ShowEdit(scope.row)">编辑</el-button> -->
|
||||
<el-button link type="danger" @click="DropFence(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="pagin.total > 0"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
:total="pagin.total"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 编辑弹出层 -->
|
||||
<el-dialog width="760px" v-model="Status.showEdit" :title="'编辑记录'" :draggable="true">
|
||||
<div>
|
||||
<el-form :inline="true" :model="cEdit" label-width="auto">
|
||||
<el-form-item label="围栏名称">
|
||||
<el-select v-model="cEdit.fenceId" placeholder="请选择" clearable filterable>
|
||||
<el-option v-for="item in dic.fence" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="设备名称">
|
||||
<el-select v-model="cEdit.deviceId" placeholder="请选择" clearable filterable>
|
||||
<el-option v-for="item in dic.device" :key="item.deviceId" :label="item.deviceName" :value="item.deviceId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="人员名称">
|
||||
<el-select v-model="cEdit.userId" placeholder="请选择">
|
||||
<el-option :key="0" :label="'多边形'" :value="0" />
|
||||
<el-option :key="1" :label="'圆形'" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="事件时间">
|
||||
<el-date-picker v-model="cEdit.eventTime" type="datetime" placeholder="选择时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="事件类型">
|
||||
<el-select v-model="cEdit.eventType" placeholder="请选择" clearable>
|
||||
<el-option :key="1" :label="'闯入'" :value="1" />
|
||||
<el-option :key="2" :label="'离开'" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="经度">
|
||||
<el-input v-model="cEdit.longitude" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度">
|
||||
<el-input v-model="cEdit.latitude" />
|
||||
</el-form-item>
|
||||
<el-form-item label="精度">
|
||||
<el-input v-model="cEdit.accuracy" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div class="center" style="margin-top: 20px">
|
||||
<el-button type="primary" @click="SaveFormData"> 确定 </el-button>
|
||||
<el-button type="primary" plain @click="CloseEdit"> 取消 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 提示框 -->
|
||||
<el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" center>
|
||||
<span :class="Status.confirm.isWarn">
|
||||
{{ Status.confirm.text }}
|
||||
</span>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="Status.confirm.OkCallback"> 确定 </el-button>
|
||||
<el-button v-show="Status.confirm.showCancel" @click="Status.confirm.cancelCallback">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import api from '@/api/FenceManager/record';
|
||||
import fenceApi from '@/api/FenceManager/fence';
|
||||
import common from '@/utils/common';
|
||||
import deviceapi from '@/api/equipmentManagement/device/index';
|
||||
import request from '@/utils/request';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
var grid = ref(null);
|
||||
|
||||
//全局状态控制
|
||||
var Status = reactive({
|
||||
fullLoading: false, //是否显示全屏loading
|
||||
loading: false, //是否显示表格区域loading
|
||||
confirm: {
|
||||
//弹出框的配置
|
||||
Visible: false,
|
||||
title: '',
|
||||
text: '',
|
||||
cancelCallback: null,
|
||||
OkCallback: null,
|
||||
showCancel: true,
|
||||
isWarn: false //是否警告色
|
||||
},
|
||||
showSearch: [], //是否显示高级查询
|
||||
showEdit: false //是否显示编辑弹窗
|
||||
});
|
||||
//查询的条件
|
||||
var queryParams = reactive({
|
||||
fenceName: '',
|
||||
fenceId: '',
|
||||
deviceId: '',
|
||||
eventType: '',
|
||||
latitude: '',
|
||||
longitude: '',
|
||||
accuracy: '',
|
||||
Date: [],
|
||||
startEventTime: '',
|
||||
endEventTime: '',
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
});
|
||||
|
||||
var dic = reactive({
|
||||
fence: [],
|
||||
device: [],
|
||||
users: []
|
||||
});
|
||||
var cEdit = reactive({
|
||||
'id': null,
|
||||
'fenceId': null,
|
||||
'deviceId': null,
|
||||
'userId': null,
|
||||
'eventType': null,
|
||||
'latitude': null,
|
||||
'longitude': null,
|
||||
'accuracy': null,
|
||||
'eventTime': null
|
||||
});
|
||||
|
||||
//页码控件数据
|
||||
var pagin = reactive({
|
||||
total: 0
|
||||
});
|
||||
|
||||
//列表数据
|
||||
var List = ref<any[]>(null);
|
||||
|
||||
//显示隐藏高级查询
|
||||
function showSearch() {
|
||||
if (Status.showSearch.length > 0) {
|
||||
Status.showSearch = [];
|
||||
} else {
|
||||
Status.showSearch = ['1'];
|
||||
}
|
||||
}
|
||||
function ShowEdit(item) {
|
||||
Status.showEdit = true;
|
||||
if (item) {
|
||||
let keys = Object.keys(item);
|
||||
keys.forEach((key) => {
|
||||
cEdit[key] = item[key];
|
||||
});
|
||||
}
|
||||
}
|
||||
function CloseEdit() {
|
||||
Status.showEdit = false;
|
||||
let defCfg = {
|
||||
'id': null,
|
||||
'fenceId': null,
|
||||
'deviceId': null,
|
||||
'userId': null,
|
||||
'eventType': null,
|
||||
'latitude': null,
|
||||
'longitude': null,
|
||||
'accuracy': null,
|
||||
'eventTime': null
|
||||
};
|
||||
let keys = Object.keys(defCfg);
|
||||
keys.forEach((key) => {
|
||||
cEdit[key] = defCfg[key];
|
||||
});
|
||||
}
|
||||
//响应查询
|
||||
var queryTime = null;
|
||||
function handleQuery() {
|
||||
debugger;
|
||||
clearTimeout(queryTime);
|
||||
queryTime = setTimeout(getList, 200);
|
||||
}
|
||||
|
||||
//重置查询条件
|
||||
function resetQuery() {
|
||||
let cfg = {
|
||||
fenceName: '',
|
||||
fenceId: '',
|
||||
deviceId: '',
|
||||
eventType: '',
|
||||
latitude: '',
|
||||
longitude: '',
|
||||
accuracy: '',
|
||||
Date: [],
|
||||
startEventTime: '',
|
||||
endEventTime: ''
|
||||
};
|
||||
let keys = Object.keys(cfg);
|
||||
keys.forEach((k) => {
|
||||
queryParams[k] = cfg[k];
|
||||
});
|
||||
handleQuery();
|
||||
}
|
||||
|
||||
//--------------------------------------
|
||||
|
||||
//保存数据
|
||||
function SaveFormData() {
|
||||
let promise = Promise.resolve({ code: 200, msg: '操作成功' });
|
||||
Status.fullLoading = true;
|
||||
|
||||
if (cEdit.id !== null) {
|
||||
//编辑
|
||||
promise = api.updateRecord(cEdit);
|
||||
} else {
|
||||
//新增
|
||||
promise = api.addRecord(cEdit);
|
||||
}
|
||||
|
||||
promise
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
CloseEdit();
|
||||
getList();
|
||||
}
|
||||
alert(res.msg);
|
||||
})
|
||||
.finally(() => {
|
||||
Status.fullLoading = false;
|
||||
});
|
||||
}
|
||||
//删除围栏
|
||||
function DropFence(item) {
|
||||
let arr = [];
|
||||
if (item) {
|
||||
arr = [item];
|
||||
} else {
|
||||
arr = getSelectionRows(grid);
|
||||
}
|
||||
if (arr.length == 0) {
|
||||
alert('请选择要删除的数据');
|
||||
return;
|
||||
}
|
||||
|
||||
confirm(
|
||||
'删除后不可恢复,您确认?',
|
||||
() => {
|
||||
arr = arr.map((v) => {
|
||||
return v.id;
|
||||
});
|
||||
api.DropRecord(arr).then((res) => {
|
||||
if (res.code == 200) {
|
||||
handleQuery();
|
||||
}
|
||||
alert(res.msg);
|
||||
});
|
||||
},
|
||||
null,
|
||||
'提示'
|
||||
);
|
||||
}
|
||||
|
||||
function getList() {
|
||||
Status.loading = true;
|
||||
api
|
||||
.RecordList(queryParams)
|
||||
.then((res) => {
|
||||
List.value = res.rows;
|
||||
pagin.total = res.total;
|
||||
})
|
||||
.finally(() => {
|
||||
Status.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
function Export() {
|
||||
|
||||
let json = {};
|
||||
proxy?.download('/api/equipment/fenceAccessRecord/export', json, `围栏进出记录_${new Date().getTime()}.xlsx`, 'post').finally(() => {
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
//获取已选中的行
|
||||
var getSelectionRows = (gridInstance) => {
|
||||
if (gridInstance.value) {
|
||||
// 检查ref是否已正确引用组件实例
|
||||
var selectedRows = gridInstance.value.getSelectionRows(); // 获取选中行数据数组
|
||||
return selectedRows;
|
||||
}
|
||||
return [];
|
||||
};
|
||||
|
||||
//字典初始化
|
||||
function initDic() {
|
||||
let getFence = () => {
|
||||
fenceApi.getList(null).then((res) => {
|
||||
if (res.code == 200) {
|
||||
dic.fence = res.rows;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
let getDevice = () => {
|
||||
request({
|
||||
url: '/api/device',
|
||||
method: 'get',
|
||||
params: { pageNum: 1, pageSize: 9999 }
|
||||
}).then((res) => {
|
||||
if (res.code == 200) {
|
||||
dic.device = res.rows;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
let getUsers = () => {
|
||||
// request({
|
||||
// url: '/system/user/list',
|
||||
// method: 'get',
|
||||
// params: { pageNum: 1, pageSize: 9999 }
|
||||
// }).then((res) => {
|
||||
// if (res.code == 200) {
|
||||
// dic.users = res.rows;
|
||||
// }
|
||||
// });
|
||||
};
|
||||
getFence();
|
||||
getDevice();
|
||||
getUsers();
|
||||
}
|
||||
|
||||
window.confirm = function (text, OK, cancel, title, isWarn = false) {
|
||||
let Cfg = {
|
||||
Visible: true,
|
||||
title: title ? title : '提示',
|
||||
text: text ? text : '此操作不可逆,您确定这样做吗?',
|
||||
OkCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (OK) {
|
||||
OK();
|
||||
}
|
||||
},
|
||||
showCancel: true,
|
||||
cancelCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (cancel) {
|
||||
cancel();
|
||||
}
|
||||
},
|
||||
isWarn: isWarn
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
|
||||
window.alert = function (text, OK, title) {
|
||||
let Cfg = {
|
||||
Visible: true,
|
||||
title: title ? title : '提示',
|
||||
text: text ? text : '不符合规则',
|
||||
OkCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (OK) {
|
||||
OK();
|
||||
}
|
||||
},
|
||||
showCancel: false,
|
||||
cancelCallback: null,
|
||||
isWarn: false
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
|
||||
var hideConfirm = function () {
|
||||
let Cfg = {
|
||||
Visible: false,
|
||||
title: '提示',
|
||||
text: '',
|
||||
cancelCallback: null,
|
||||
OkCallback: null,
|
||||
showCancel: false,
|
||||
isWarn: false
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
initDic();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.fleft {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fright {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.displayNone {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
min-height: calc(100vh - 84px);
|
||||
height: calc(100vh - 84px);
|
||||
background: rgba(247, 248, 252, 1);
|
||||
font-size: 16px;
|
||||
box-sizing: border-box;
|
||||
padding: 8px 20px;
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
|
||||
.topTool {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e1e2e5f2;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.percent100 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 0px 6px 0px rgba(0, 34, 96, 0.1);
|
||||
background: rgba(255, 255, 255, 1);
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
:deep .el-collapse-item__header {
|
||||
display: none !important;
|
||||
}
|
||||
:deep .el-collapse,
|
||||
:deep .el-collapse-item__wrap {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.map {
|
||||
width: 100%;
|
||||
height: 58vh;
|
||||
box-sizing: border-box;
|
||||
border: 1px dashed red;
|
||||
}
|
||||
|
||||
.point,
|
||||
:deep .point {
|
||||
background-image: url(@/assets/images/mapLocation.png);
|
||||
width: 30px;
|
||||
height: 48px;
|
||||
background-repeat: no-repeat;
|
||||
background-color: #00000000;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.point amap-overlay-text-container,
|
||||
:deep .point .amap-overlay-text-container {
|
||||
color: #ffffff;
|
||||
font-size: 17px;
|
||||
border: none;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
background: #00000000;
|
||||
}
|
||||
.el-date-editor,
|
||||
:deep .el-date-editor {
|
||||
width: 240px !important;
|
||||
}
|
||||
</style>
|
||||