From a0eb4d85be346a88f24183c7973ce05d95511f77 Mon Sep 17 00:00:00 2001 From: jiayu Date: Fri, 13 Sep 2024 09:12:54 +0800 Subject: [PATCH] =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=9B=B4=E6=94=B9=EF=BC=8C?= =?UTF-8?q?=E4=BA=BA=E5=91=98=E5=AE=9A=E4=BD=8D=E6=9B=B4=E6=8D=A2=E6=A0=91?= =?UTF-8?q?=E5=BD=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/modules/smartSafeHat.ts | 5 + src/assets/images/carPosition/person.png | Bin 0 -> 1135 bytes src/assets/images/carPosition/person2.png | Bin 0 -> 1197 bytes src/config/staticMenu.ts | 16 +- .../smartSafeHat/index.vue | 300 +++++++++++++----- 5 files changed, 228 insertions(+), 93 deletions(-) create mode 100644 src/assets/images/carPosition/person.png create mode 100644 src/assets/images/carPosition/person2.png diff --git a/src/api/modules/smartSafeHat.ts b/src/api/modules/smartSafeHat.ts index 031fab9..470feed 100644 --- a/src/api/modules/smartSafeHat.ts +++ b/src/api/modules/smartSafeHat.ts @@ -51,6 +51,11 @@ export const getVehiclePositionDayRecord = (params: {}) => { export const getHatDevOptionApi = (params: {}) => { return http.get(BASEURL + `/xmgl/safetyHatDev/list`, params); }; +// 智能安全帽--分类查询设备树 +export const getEnterpriseTreeApi = (params: {}) => { + return http.get(BASEURL + `/xmgl/safetyHatDev/enterprise/tree/list`, params); +}; + // 智能安全帽--查询设备状态总数 export const getSafeHatTypeTotalApi = (params: {}) => { return http.post(BASEURL + `/xmgl/safetyHatDev/countSafetyHatDev`, params); diff --git a/src/assets/images/carPosition/person.png b/src/assets/images/carPosition/person.png new file mode 100644 index 0000000000000000000000000000000000000000..eeba329d11ce14d9b9406ce061e4b59247a3a7c9 GIT binary patch literal 1135 zcmV-#1d#iQP)=Z@00001b5ch_0Itp) z=>Px#1ZP1_K>z@;j|==^1poj98A(JzR9Hu~mw#whRT#&==Wb$Cm*ljOQcaXlsDDa= z!eR^&^bZw`@&~>;{bLMc(agX4qaymFf-)GvK=-~A%^&3-)+QqA6p4a_K}2gzXy_l) z5^7kh)V)vN=bY!=eO>H*@9S~Kd+PKDU%+ft1N3{h$bh6!$978c`W_m}C@CbAlM9Id=gcBs^2 z40}vYh1jV>vq{4cY-P(vFDnk~eVq~^yj}7rom{2#HytiVvkT6$qBC!#O>hUFp~cp!s5{pu}(K3`W(A2-)0ob6NGBOQL9wxoNXmZ zU>H4gl9hHoT$g4lmf-=M#z#`4;jN*Q->d;l?D`&FH?2Go+Bla5?DMW!rbe?}9X4w2 zoxzTixB5-1%Q4P7&vMu+DbEU~GUTy3;s|xNlf!w->T+C1yFc=pf|>w_N5Ux+pEZ>d zGFrrgq5{<2U6vVME8r4_O3&I) zX&icWO~=?l6GVVpnpgimB|`8%hb@#g1w%# zKS}rX$hcpaS-z$<`3X}@L171&p!OrQ@vU3Lf0q$&E2dNCGkrY6GM|Hs7{+Tj#qIyO8@D^|gZLBlziZMh ztJuDS?ePwuCL!xq;R{~%le(1-;_sXwf5j+d8OE8xIDJBRm7ILX>k1bAt=PjBUBh=+ zma+8nJ*zZnOi6sc2#%Z7K!+z-A7fF6I@Hah6|hH1qNGqi_HPKDU1{(lNy zHLaM}3h65?;x#Rhl?}9JH~>BNvivkXX)P%M{0mRUBy`wbA5{PV002ovPDHLkV1gl2 B8pHqq literal 0 HcmV?d00001 diff --git a/src/assets/images/carPosition/person2.png b/src/assets/images/carPosition/person2.png new file mode 100644 index 0000000000000000000000000000000000000000..a3ab80830dc6a795a397ffaf145da1a9d0fe1ee9 GIT binary patch literal 1197 zcmV;e1XBBnP)Px#L}ge>W=%~1DgXcg2mk?xX#fNO00031000^Q000001E2u_0{{R30RRC20H6W@ z1ONa40RR91B%lKT1ONa40RR919RL6T0ERy~3jhEF7fD1xR9FeEms@CEMHGhrNz%re zmTIfjf~`j)Vud0WAG|bB^QaJSP@_;|DpHC;u}@+J6`w@NgID4uCygLl>!s3yVlkDX zg0&VwdwEJ8q%<^8YrK@Ur^|2lKKo>!oV|DU+3keInpyL&wf@YWSu@9}XnWHZYLT8+ zMH}RFT{XXxG;nWV~k= ztM+zQh_t!p36*UF!EQ_o7_;}PY+bQ&u5R;$q>Z^Edyv!pxv^DX5klAGPGVY}8(Wx= z)A`&prVC z{zh$(({^fDecx$ed7E-k=U|N z*&;UL#UtYhEY{tzeU(5dn~-UFg3pDSTD2l8KsKRP&ChZ!IG1_#Boi94c|kJMUj>t< zyPe})j##IL?WQEq4596|0O0f5X8Scyj|AWfM_LMxbdqHw#`F=qL zD6*GDp+Z6<_Hb||h{|iam5m&pzQ^4(3D<_|LXLV64GI{kwX>+$hh zSdr(@A0km9o1niJiP~t?xd{6GAV#0t!z0GO$B$HFme4yPwb`*;$6*+e@f07_qwcdR zFjQsx9?Ttewq^%ThbfBn`)0(}6XxSuDAQCMgZj!^;rGPsR#6|QgOFNSn=*ET3o7&! zw&}p`xXDb*=&!8d!p=XeNMp74d#b)PR~*aKkI!%{zyv}4oih=$iBG$hpf6w>L+_@7 zAJ%$zrVbMg200*0w1znTGQAVo+Hi;Y=ZqtkR6?RQ5b_%~e_Q+STdK~S20TdOcN>UB zu0{0+ww$=nAe+e%uDEeMnFh4c?Fb3^;4fO6t_?u_jQs8ooAIuZzJT!0{7OBF(}`#* zmmalce3(@{)z;vD4sm6QItYUymU+Hz zCP^pB{Qb5B0#~3rkai?G7=BOr`r = [ menuName: "安全管理", companyPath: "/securityManagement" }, + { + menuName: "安全教育", + companyPath: "/safeEducation" + }, { companyPath: "/foundationPitMonitor", menuName: "基坑监测" @@ -1922,10 +1926,6 @@ export const ZMMLMenu: Array = [ menuName: "高支模监测", companyPath: "/highFormwork" }, - { - menuName: "安全教育", - companyPath: "/safeEducation" - }, { menuName: "外墙脚手架监测", companyPath: "/wallScaffold2" @@ -1940,14 +1940,14 @@ export const ZMMLMenu: Array = [ menuName: "质量管理", companyPath: "/qualityManagement" }, - { - menuName: "混凝土测温", - companyPath: "/concreteMonitor" - }, { menuName: "进度计划", companyPath: "/schedulePlan" } + // { + // menuName: "混凝土测温", + // companyPath: "/concreteMonitor" + // } ] }, { diff --git a/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue b/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue index b428dd4..d3cfd63 100644 --- a/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue +++ b/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue @@ -50,21 +50,40 @@ style="margin-left: 55px; color: #fff" >全选 - +
- + + + + {{ item.workerName }} - - + -->
暂无设备
@@ -113,11 +132,14 @@
-
-
{{ item.fenceName }}
-
{{ item.workerNum }}
-
-
+
+
{{ item.fenceName }}
+
{{ item.workerNum }}
+
+

暂无数据

@@ -129,40 +151,38 @@
-
-
-
-
- 围栏中的人员 -
-
-
- - - -
-
-
-
-
-
序号
-
人员名称
-
身份证号
-
- -
-
{{ index + 1 }}
-
{{ item.workerName }}
-
{{ item.idCard }}
-
-
- -

暂无数据

-
- -
-
-
+
+
+
+
围栏中的人员
+
+
+ + + +
+
+
+
+
+
序号
+
人员名称
+
身份证号
+
+ +
+
{{ index + 1 }}
+
{{ item.workerName }}
+
{{ item.idCard }}
+
+
+ +

暂无数据

+
+ +
+
+
@@ -181,7 +201,7 @@
-
+
@@ -274,8 +294,15 @@
- - + + @@ -323,12 +350,24 @@
-
开始轨迹动画
-
+
+ 开始轨迹动画 +
+
-
+
@@ -391,6 +430,7 @@ import { getAlarmRecordInfoApi, getHatDevOptionApi, + getEnterpriseTreeApi, addstandardDevApi, getRealtimeRecordInfo, getRealtimeRecordList, @@ -413,8 +453,8 @@ import { // import carIcon from "@/assets/images/carPosition/carIcon.png"; import carOn from "@/assets/images/carPosition/carOn2.png"; import carOff from "@/assets/images/carPosition/carOff2.png"; -import smartSafeHat from "@/assets/images/carPosition/smartSafeHat.png"; -import smartSafeHat2 from "@/assets/images//carPosition/smartSafeHat2.png"; +import smartSafeHat from "@/assets/images/carPosition/person.png"; +import smartSafeHat2 from "@/assets/images//carPosition/person2.png"; import personOff from "@/assets/images/carPosition/personOff.png"; import startIcon from "@/assets/images/carPosition/startIcon.png"; import endIcon from "@/assets/images/carPosition/endIcon.png"; @@ -449,7 +489,8 @@ let checkAll = ref(false); let checkAllFence = ref(false); let checkedCities = ref([]); let checkedFence = ref([]); -let devList = ref(["鲁U6675", "刘江", "蒋东", "鲁U9675"]); +let devList = ref([]); +let treeList = ref([]); let isIndeterminate = ref(true); let isIndeterminateFence = ref(true); let checked = ref(1); @@ -459,6 +500,7 @@ interface RuleForm { // fenceName: string // areaRadius: number } +let tree = ref(null); let addFormRef = ref(); // const addForm = reactive({ let addForm = ref({ @@ -518,7 +560,7 @@ let formFenceRules = ref({ message: "必填", trigger: "blur" } - ], + ], fenceName: [ { required: true, @@ -604,11 +646,11 @@ watch(choiceMonth, newVal => { getDayRunData(); } }); -function enlargeMap(){ - enlarge.value = true +function enlargeMap() { + enlarge.value = true; } -function notEnlargeMap(){ - enlarge.value = false +function notEnlargeMap() { + enlarge.value = false; } let isOpenDetail = ref(false); let workerListInFence = ref([]); @@ -622,17 +664,17 @@ function openDetail(item) { // workerListInFence.value = res.result.workerListInFence // } // }); - let welanBox = document.getElementById('welanMaskContainer') - if(welanBox){ - welanBox.style.zIndex= '999' + let welanBox = document.getElementById("welanMaskContainer"); + if (welanBox) { + welanBox.style.zIndex = "999"; } workerListInFence.value = item.workerListInFence; isOpenDetail.value = true; } function closeDetail() { - let welanBox = document.getElementById('welanMaskContainer') - if(welanBox){ - welanBox.style.zIndex= '-1' + let welanBox = document.getElementById("welanMaskContainer"); + if (welanBox) { + welanBox.style.zIndex = "-1"; } isOpenDetail.value = false; } @@ -676,7 +718,7 @@ const resolveAddStr = computed(() => async (longitude: any, latitude: any) => { return "未知位置2"; }); -let regionList = ref([] as any); +let regionList = ref([] as any); function getRegionList() { let data = { projectSn: store.sn @@ -684,8 +726,8 @@ function getRegionList() { getRegionListApi(data).then(res => { if (res.success) { checkedFence.value = []; - regionList.value = res.result - console.log(regionList.value,777777777777777777777) + regionList.value = res.result; + console.log(regionList.value, 777777777777777777777); } }); } @@ -1197,7 +1239,8 @@ function getCrewListData() { }; console.log("👇智能安全帽--分类查询设备列表--查询参数"); console.log(data); - getHatDevOptionApi(data).then(res => { + // getHatDevOptionApi(data).then(res => { + getEnterpriseTreeApi(data).then(res => { console.log("👇智能安全帽--分类查询设备列表"); console.log(res); if (res.code == 200) { @@ -1224,13 +1267,25 @@ function getCrewListData() { // }); // nameOptions.value = nameOption.concat(carOption); nameOptions.value = nameOption.concat([]); - - devList.value = res.result; + treeList.value = res.result; + devList.value = flattenTree(res.result).filter(item => item.devSn); } else { ElMessage.error(res.message); } }); } +// 扁平化树形数据 +function flattenTree(tree) { + let result = []; + tree.forEach(item => { + result.push(item); + if (item.safetyHatDevs && item.safetyHatDevs.length > 0) { + result = result.concat(flattenTree(item.safetyHatDevs)); + } + }); + return result; +} + // 智能安全帽--查询报警信息 function getProgressListData() { let data = { @@ -1262,6 +1317,7 @@ function handleCheckAllChange(val) { clearFn(); let nameArr = devList.value.map(item => item.devSn); checkedCities.value = val ? nameArr : []; + tree.value.setCheckedKeys(checkedCities.value); isIndeterminate.value = false; if (val) { listData; @@ -1273,6 +1329,11 @@ function handleCheckAllChange(val) { getProgressListData(); drawFencePoint(); } +const handleCheck = () => { + checkedCities.value = tree?.value.getCheckedKeys().filter(item => item); + console.info(checkedCities.value, "checkedCities"); + handleCheckedCitiesChange(checkedCities.value); +}; function handleCheckedCitiesChange(value) { console.log("设备选中", value); clearFn(); @@ -1476,7 +1537,6 @@ function trackMapInit(path: any, item: any) { function createMarkerAndInfoWindow() { AMap.plugin("AMap.MoveAnimation", function () { - marker = new AMap.Marker({ map: map, position: path[0], @@ -1525,7 +1585,13 @@ function trackMapInit(path: any, item: any) { info.push('
人员名称: ' + item.workerName + "
"); // info.push('
最后更新时间: ' + item.updateTime + "
"); info.push('
最后更新时间: ' + item.uploadTime + "
"); - info.push('
经纬度: ' + item.longitude.toFixed(6) + "|" + item.latitude.toFixed(6) + "
"); + info.push( + '
经纬度: ' + + item.longitude.toFixed(6) + + "|" + + item.latitude.toFixed(6) + + "
" + ); info.push('
位置: ' + address + "
"); var infoWindow = new AMap.InfoWindow({ offset: new AMap.Pixel(30, -30), @@ -1864,7 +1930,13 @@ function echoCarMarker(item) { info.push('
人员名称: ' + item.workerName + "
"); // info.push('
最后更新时间: ' + item.updateTime + "
"); info.push('
最后更新时间: ' + item.uploadTime + "
"); - info.push('
经纬度: ' + item.longitude.toFixed(6) + "|" + item.latitude.toFixed(6) + "
"); + info.push( + '
经纬度: ' + + item.longitude.toFixed(6) + + "|" + + item.latitude.toFixed(6) + + "
" + ); info.push('
位置: ' + address + "
"); let infoWindow = new AMap.InfoWindow({ @@ -1923,7 +1995,13 @@ function echoPersonMarker(item) { info.push('
人员名称: ' + item.workerName + "
"); // info.push('
最后更新时间: ' + item.updateTime + "
"); info.push('
最后更新时间: ' + item.uploadTime + "
"); - info.push('
经纬度: ' + item.longitude.toFixed(6) + "|" + item.latitude.toFixed(6) + "
"); + info.push( + '
经纬度: ' + + item.longitude.toFixed(6) + + "|" + + item.latitude.toFixed(6) + + "
" + ); info.push('
位置: ' + address + "
"); var infoWindow = new AMap.InfoWindow({ @@ -1961,12 +2039,12 @@ function echoPersonMarker(item) { // } .welanMask { position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: rgba(0, 0, 0, 0.5); /* 半透明黑色背景 */ - z-index: -1; /* 确保遮罩层位于其他内容上方 */ + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); /* 半透明黑色背景 */ + z-index: -1; /* 确保遮罩层位于其他内容上方 */ // position: absolute; // width: 99%; @@ -1996,7 +2074,7 @@ function echoPersonMarker(item) { height: 100%; // background-color: #fff; display: flex; - justify-content: start; + justify-content: flex-start; align-items: center; color: #fff; font-size: 26px; @@ -2493,10 +2571,10 @@ function echoPersonMarker(item) { margin-top: 1%; height: 38%; :deep(.h-card) { - .content { - margin-top: 4% !important; - } + .content { + margin-top: 4% !important; } + } .left-content { height: 100%; width: 100%; @@ -2689,7 +2767,7 @@ function echoPersonMarker(item) { box-shadow: 0px 0px 10px 0px rgba(39, 45, 69, 0.2); bottom: 8%; right: 1%; - img{ + img { width: 20px; height: 22px; margin: 6px auto; @@ -3021,4 +3099,56 @@ function echoPersonMarker(item) { } } } + +:deep() { + .el-tree { + background-color: transparent; + .el-tree-node { + white-space: normal; + &:focus > .el-tree-node__content { + background-color: transparent; + } + &.is-current > .el-tree-node__content { + background-color: rgba(81, 129, 246, 0.14); + color: #5181f6; + } + } + .el-tree-node__label { + color: #fff; + } + .el-tree-node__content { + position: relative; + &:hover { + background-color: rgba(81, 129, 246, 0.14); + color: #5181f6; + } + } + .el-tree-node__expand-icon { + font-size: 16px; + padding: 0 6px; + &.is-leaf { + color: transparent !important; + } + } + .treeTitle { + background-color: #f7f7f7; + margin-bottom: 10px; + } + } +} +.custom-tree-node { + width: 100%; + img { + width: 16px; + height: 16px; + margin-right: 4px; + } +} +.nodeName { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + display: inline-block; + color: #fff; +}