Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Contribute to GitLab
Sign in / Register
Toggle navigation
Z
zh-baseversion-project
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
王浩
zh-baseversion-project
Commits
024e64bd
Commit
024e64bd
authored
Sep 07, 2024
by
纪泽龙
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
餐饮 工商 居民 弹框内容更改,map优化
parent
3a377098
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
385 additions
and
223 deletions
+385
-223
detectorInfo.js
zh-baseversion-web/src/api/detector/detectorInfo.js
+13
-2
User.vue
zh-baseversion-web/src/components/bigWindow/User.vue
+76
-81
UserCenter.vue
zh-baseversion-web/src/components/bigWindow/UserCenter.vue
+126
-31
yhqUser.vue
zh-baseversion-web/src/components/bigWindow/yhqUser.vue
+89
-56
yhqUserCenter.vue
...aseversion-web/src/components/bigWindow/yhqUserCenter.vue
+41
-30
map.js
zh-baseversion-web/src/utils/mapClass/map.js
+13
-8
Top.vue
zh-baseversion-web/src/views/bigWindow/components/Top.vue
+2
-2
index.vue
zh-baseversion-web/src/views/bigWindow/index.vue
+22
-12
vue.config.js
zh-baseversion-web/vue.config.js
+3
-1
No files found.
zh-baseversion-web/src/api/detector/detectorInfo.js
View file @
024e64bd
/*
* @Author: your name
* @Date: 2022-02-26 16:01:37
* @LastEditTime: 202
2-02-26 21:11:12
* @LastEditors:
Please set LastEditors
* @LastEditTime: 202
4-09-07 15:08:36
* @LastEditors:
纪泽龙 jizelong@qq.com
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/api/detector/detectorInfo.js
*/
...
...
@@ -31,6 +31,17 @@ export function yhqlistDetectorInfo(query) {
},
});
}
export
function
getUserList
(
query
)
{
return
request
({
url
:
"/supervise/user/pageQueryLabelsLayerMarksDUser"
,
method
:
"get"
,
params
:
{
pageNum
:
1
,
pageSize
:
5
,
...
query
,
},
});
}
// 探测器列表
export
function
detectorInfoList
(
query
)
{
return
request
({
...
...
zh-baseversion-web/src/components/bigWindow/User.vue
View file @
024e64bd
<!--
* @Author: your name
* @Date: 2022-01-26 20:07:52
* @LastEditTime: 2024-0
8-01 09:48:1
8
* @LastEditTime: 2024-0
9-07 15:47:0
8
* @LastEditors: 纪泽龙 jizelong@qq.com
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
...
...
@@ -10,56 +10,56 @@
<
template
>
<div
class=
"devicea-wrapper"
>
<div
class=
"title"
>
{{
deviceData
.
nick
Name
}}
{{
deviceData
.
village
Name
}}
</div>
<div
class=
"close"
@
click=
"close"
>
<!--
<img
src=
"@/assets/mapImages/closeBtn.png"
alt=
""
/>
-->
<i
class=
"el-icon-close"
style=
"font-size: 20px; color: #49d8ff"
></i>
</div>
<div
class=
"line"
></div>
<div
class=
"line"
></div>
<div
class=
"top"
>
<div
class=
"info-item"
:show-overflow-tooltip=
"true"
>
<div
class=
"label"
>
联系人:
</div>
<div
class=
"username-value"
:title=
"deviceData.linkman"
>
{{
deviceData
.
linkman
}}
</div>
</div>
<div
class=
"info-item"
:show-overflow-tooltip=
"true"
>
<div
class=
"label"
>
联系电话:
</div>
<div
class=
"phone-value"
:title=
"deviceData.phone"
>
{{
deviceData
.
phone
}}
</div>
<div
class=
"info-item"
:show-overflow-tooltip=
"true"
>
<div
class=
"label"
>
名称
</div>
<div
class=
"username-value"
:title=
"deviceData.villageName"
>
{{
deviceData
.
villageName
}}
</div>
</div>
</div>
<div
class=
"addresstop"
>
<div
class=
"info-item"
:show-overflow-tooltip=
"true"
>
<div
class=
"label"
>
联系地址
</div>
<div
class=
"phone-value"
:title=
"deviceData.address"
>
{{
deviceData
.
address
||
"-"
}}
</div>
</div>
</div>
<!--
<div
class=
"addresstop"
>
<div
class=
"group"
>
<div
class=
"left"
>
联系地址:
</div>
<div
:title=
"deviceData.address"
class=
"right last zzz"
>
{{
deviceData
.
address
||
"-"
}}
</div>
</div>
</div>
</div>
</div>
-->
<template
v-if=
"deviceData.detectorCountList.length>0"
>
<template>
<div
class=
"foot"
>
<div
class=
"thead flex"
>
<div
class=
"first"
>
设备类型
</div>
<div
class=
"first"
>
用户数量
</div>
<div>
设备数量
</div>
<div>
在线设备
</div>
<div>
离线设备
</div>
<div>
气瓶数量
</div>
<!--
<div>
历史报警
</div>
<div>
已处理报警
</div>
-->
<
div
class=
"last"
>
报警中
</div
>
<
!--
<div
class=
"last"
>
报警中
</div>
--
>
</div>
<div
v-for=
"data in deviceData.detectorCountList"
:key=
"data.userId"
class=
"tbody flex"
>
<div
v-unValue
class=
"first zzz"
>
{{
data
.
detectorType
}}
</div>
<div
class=
""
>
{{
data
.
detectorCount
}}
</div>
<div
class=
"tbody flex"
>
<div
v-unValue
class=
"first zzz"
>
{{
deviceData
.
userNum
}}
</div>
<div
class=
""
>
{{
deviceData
.
deviceNum
}}
</div>
<div
v-unValue
class=
""
>
{{
d
ata
.
onLineNum
}}
{{
d
eviceData
.
onLineNum
||
"-"
}}
</div>
<div
v-unValue
class=
""
>
{{
d
ata
.
offLineNum
}}
{{
d
eviceData
.
offLineNum
||
"-"
}}
</div>
<!--
<div
v-unValue
class=
""
>
{{
data
.
historyAlarmNum
}}
...
...
@@ -67,20 +67,20 @@
<div
v-unValue
class=
""
>
{{
data
.
cancelAlarmNum
}}
</div>
-->
<div
v-unValue
class=
"last zzz"
>
{{
data
.
processingAlarmNum
}}
</div>
<
!--
<
div
v-unValue
class=
"last zzz"
>
{{
d
eviceD
ata
.
processingAlarmNum
}}
</div>
-->
</div>
</div>
</
template
>
</
template
>
<div
style=
"width: 100%; display: flex"
v-if=
"detcetorList
>
0"
>
<div
style=
"width: 100%; display: flex"
v-if=
"detcetorList
.length >
0"
>
<div
class=
"btn"
>
<div>
感知设备
</div>
</div>
<p
style=
"
width: 8
5
%;
width: 8
6
%;
height: 10px;
background-color: #022346;
margin-top: 22px;
...
...
@@ -102,7 +102,7 @@
:show=
"userCenterShow"
ref=
"userCenter"
:detcetorList=
"detcetorList"
:
userId=
"centerUser
Id"
:
villageId=
"village
Id"
:total=
"centerTotal"
:pageSize=
"5"
v-show=
"!isShow"
...
...
@@ -113,8 +113,8 @@
<
script
>
import
{
getUser
}
from
"@/api/bigWindow/getDevice"
;
import
{
companyType
,
deviceType
}
from
"@/utils/mapClass/config.js"
;
import
{
listDetectorInfo
}
from
"@/api/detector/detectorInfo"
;
import
{
detectorUserList
}
from
"@/api/detector/detectorUser"
;
import
{
listDetectorInfo
,
getUserList
}
from
"@/api/detector/detectorInfo"
;
//
import { detectorUserList } from "@/api/detector/detectorUser";
import
UserCenter
from
"@/components/bigWindow/UserCenter.vue"
;
export
default
{
...
...
@@ -129,7 +129,7 @@ export default {
deviceType
,
centerTitle
:
""
,
detcetorList
:
[],
centerUser
Id
:
null
,
village
Id
:
null
,
centerTotal
:
null
,
userCenterShow
:
false
,
};
...
...
@@ -150,23 +150,23 @@ export default {
this
.
companyType
[
item
.
conpanyId
]
=
item
.
companyName
;
});
}
this
.
myHttp
();
// console.log(this.deviceData);
},
methods
:
{
//用户的设备center
getDetectorInfoList
(
httpFunc
,
queryParams
,
title
)
{
console
.
log
(
queryParams
);
return
httpFunc
(
queryParams
).
then
((
res
)
=>
{
// console.log("queryParamssssssssssss", res);
if
(
res
.
code
==
200
)
{
this
.
detcetorList
=
res
.
rows
;
this
.
centerUserId
=
queryParams
.
user
Id
;
this
.
villageId
=
queryParams
.
village
Id
;
// 总数据
this
.
centerTotal
=
res
.
total
;
// this.$refs.userCenter.fade = "fade";
this
.
otherCenterShow
=
false
;
this
.
userCenterShow
=
true
;
//
this.otherCenterShow = false;
//
this.userCenterShow = true;
this
.
centerTitle
=
title
;
// 传递回去
return
res
.
code
;
...
...
@@ -179,22 +179,19 @@ export default {
btnClick
()
{
this
.
isShow
=
!
this
.
isShow
;
// this.vueRoot.centerDataFunc(this.deviceData.pressureFlows);
// this.getDetectorInfoList(
// listDetectorInfo,
// { userId: this.deviceData.userId, pageNum: 1, pageSize: 5 },
// this.deviceData.nickName
// );
},
myHttp
()
{
this
.
getDetectorInfoList
(
listDetectorInfo
,
{
userId
:
this
.
deviceData
.
user
Id
,
pageNum
:
1
,
pageSize
:
5
},
getUserList
,
{
villageId
:
this
.
deviceData
.
village
Id
,
pageNum
:
1
,
pageSize
:
5
},
this
.
deviceData
.
nickName
);
},
myHttp
()
{
detectorUserList
({
userId
:
this
.
deviceData
.
userId
}).
then
((
res
)
=>
{
if
(
res
.
code
==
200
)
{
const
data
=
res
.
data
.
filter
(
(
item
)
=>
item
.
userId
==
this
.
deviceData
.
userId
)[
0
].
detectorCountList
;
this
.
deviceData
.
detectorCountList
=
data
;
}
});
},
},
};
</
script
>
...
...
@@ -212,12 +209,12 @@ export default {
transform
:
rotateZ
(
0deg
);
}
.devicea-wrapper
{
background
:
rgba
(
2
,
26
,
51
,
0
.9
);
background
:
rgba
(
2
,
26
,
51
,
0
.9
);
border
:
1px
solid
#127bd1
;
box-shadow
:
inset
0px
0px
10px
0px
#164db2
;
padding
:
10px
;
position
:
relative
;
width
:
74
0px
;
width
:
80
0px
;
.title
{
// padding-top: 10px;
// padding-left: 10px;
...
...
@@ -247,18 +244,17 @@ export default {
cursor
:
pointer
;
}
.addresstop
{
margin-top
:
10px
;
margin-bottom
:
10px
;
display
:
flex
;
// gap: 10px; /* 列与列之间的间隔 */
display
:
flex
;
// gap: 10px; /* 列与列之间的间隔 */
.group
{
height
:
30px
;
display
:
flex
;
justify-content
:
flex-start
;
/* 左对齐 */
align-items
:
center
;
/* 垂直居中,如果需要的话 */
div
{
justify-content
:
flex-start
;
/* 左对齐 */
align-items
:
center
;
/* 垂直居中,如果需要的话 */
div
{
box-sizing
:
border-box
;
text-align
:
left
;
font-size
:
14px
;
...
...
@@ -278,29 +274,28 @@ export default {
.top
{
margin-top
:
10px
;
margin-bottom
:
10px
;
width
:
100%
;
width
:
100%
;
display
:
flex
;
/* 使用 Flexbox 布局 */
align-items
:
center
;
/* 垂直居中 */
justify-content
:
space-between
;
/* 平均分布 */
box-sizing
:
border-box
;
/* 边框盒模型 */
.info-item
{
flex
:
1
;
/* 每个组合占据一半的空间 */
justify-content
:
space-between
;
/* 平均分布 */
box-sizing
:
border-box
;
/* 边框盒模型 */
.info-item
{
flex
:
1
;
/* 每个组合占据一半的空间 */
display
:
flex
;
align-items
:
center
;
/* 垂直居中 */
justify-content
:
flex-start
;
/* 左对齐 */
overflow
:
hidden
;
/* 防止内容溢出容器 */
}
align-items
:
center
;
/* 垂直居中 */
justify-content
:
flex-start
;
/* 左对齐 */
overflow
:
hidden
;
/* 防止内容溢出容器 */
}
.label
{
min-width
:
80px
;
text-align
:
left
;
/* 标签右对齐 */
padding-left
:
5px
;
/* 添加一些右侧内边距 */
color
:
#ffffff
;
font-size
:
14px
;
}
min-width
:
80px
;
text-align
:
left
;
/* 标签右对齐 */
padding-left
:
5px
;
/* 添加一些右侧内边距 */
color
:
#ffffff
;
font-size
:
14px
;
}
.username-value
,
.phone-value
{
flex
:
1
;
/* 弹性布局,占据剩余空间 */
flex
:
1
;
/* 弹性布局,占据剩余空间 */
overflow
:
hidden
;
/* 如果值过长,隐藏超出的部分 */
text-overflow
:
ellipsis
;
/* 显示省略号 */
white-space
:
nowrap
;
/* 不允许文本换行 */
...
...
@@ -309,7 +304,6 @@ export default {
padding-left
:
5px
;
/* 添加一些左侧内边距 */
color
:
#ffffff
;
font-size
:
14px
;
}
// .info-item {
// width: 50%;
...
...
@@ -354,7 +348,7 @@ export default {
// flex: 1;
// }
// }
// }
// }
.foot
{
font-size
:
14px
;
color
:
#ffffff
;
...
...
@@ -365,6 +359,7 @@ export default {
.thead
,
.tbody
{
div
{
padding
:
5px
0
;
flex
:
1
;
text-align
:
left
;
box-sizing
:
border-box
;
...
...
zh-baseversion-web/src/components/bigWindow/UserCenter.vue
View file @
024e64bd
...
...
@@ -12,48 +12,65 @@
<el-table
size=
"mini"
:data=
"tableData"
style=
"width: 7
20px
"
style=
"width: 7
80px !important
"
class=
"el-bottom"
:key=
"Math.random()"
>
<!-- :height="tableHeight" -->
<!--
<el-table-column
prop=
"detectorCode"
label=
"设备编号"
width=
"180"
>
<template
slot-scope=
"scope"
>
<div
:title=
"scope.row.detectorCode"
class=
"ddd"
v-unValue
>
{{
scope
.
row
.
detectorCode
}}
</div>
</
template
>
</el-table-column>
-->
<el-table-column
prop=
"detectorName"
label=
"设备名称"
width=
"100"
>
<el-table-column
prop=
"detectonickNamerName"
label=
"用户姓名"
width=
"100"
>
<template
slot-scope=
"scope"
>
<div
:title=
"scope.row.
detector
Name"
class=
"ddd"
v-unValue
>
<div
:title=
"scope.row.
nick
Name"
class=
"ddd"
v-unValue
>
{{
scope
.
row
.
detectorName
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"
medium"
label=
"监测介质"
width=
"10
0"
>
<el-table-column
prop=
"
phone"
label=
"联系电话"
width=
"12
0"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
>
{{
scope
.
row
.
medium
}}
</div>
<div
v-unValue
>
{{
scope
.
row
.
phone
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"detectorAddr"
label=
"
设备地址"
width=
"10
0"
>
<el-table-column
prop=
"detectorAddr"
label=
"
地址"
width=
"14
0"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
style=
"overflow: hidden;text-overflow: ellipsis;white-space: nowrap;"
>
{{
scope
.
row
.
detectorAddr
}}
</div>
<div
v-unValue
class=
"zzz"
>
{{
scope
.
row
.
address
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"linkman"
label=
"联系人"
width=
"80"
>
<el-table-column
prop=
"linkman"
label=
"设备详情"
width=
"120"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
>
{{
scope
.
row
.
linkman
}}
</div>
<div
class=
"detail"
>
<el-button
:disabled=
"scope.row.safetyDeviceList.length == 0"
type=
"text"
@
click
.
stop=
"deviceShow(scope.row.safetyDeviceList)"
>
设备
</el-button
>
<el-button
disabled
type=
"text"
>
气瓶
</el-button>
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"phone"
label=
"联系电话"
width=
"100"
>
<el-table-column
prop=
"detectorStatus"
label=
"末次安检时间"
width=
"120"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
>
{{
scope
.
row
.
time
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"detectorStatus"
label=
"设备状态"
width=
"100"
>
<el-table-column
prop=
"alarmTime"
label=
"安检人员"
width=
"80"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
:style=
"
{color:scope.row.detectorStatus==1?'red':''}">
{{
scope
.
row
.
detectorStatus
}}
</div>
<div
v-unValue
>
{{
scope
.
row
.
alarmTime
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"alarmTime"
label=
"预警时间"
width=
"140"
>
<el-table-column
prop=
"alarmTime"
label=
"安检情况"
width=
"100"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
>
{{
scope
.
row
.
alarmTime
}}
</div>
</
template
>
...
...
@@ -72,6 +89,31 @@
</div>
</div>
</div>
<div
class=
"toBody"
ref=
"toBody"
@
click
.
stop=
"toBodyClick"
v-show=
"yhquserCenterShow"
>
<div
class=
"list-top"
>
<div
class=
"title"
>
设备列表
</div>
<div
class=
"close"
@
click=
"close"
>
<i
class=
"el-icon-close"
style=
"font-size: 20px; color: #5dfefe"
></i>
</div>
</div>
<yhqUserCenter
ref=
"yhquserCenter"
:show=
"true"
:detcetorList=
"safetyDeviceList"
v-if=
"safetyDeviceList.length > 0"
/>
</div>
</div>
</transition>
</template>
...
...
@@ -79,7 +121,8 @@
<
script
>
// import Velocity from "velocity-animate";
// import { listDeviceAlarm } from "@/api/dataMonitoring/deviceAlarm";
import
{
listDetectorInfo
}
from
"@/api/detector/detectorInfo"
;
import
{
listDetectorInfo
,
getUserList
}
from
"@/api/detector/detectorInfo"
;
import
yhqUserCenter
from
"@/components/bigWindow/yhqUserCenter.vue"
;
export
default
{
props
:
{
...
...
@@ -93,7 +136,7 @@ export default {
title
:
{
type
:
String
,
},
user
Id
:
{
village
Id
:
{
type
:
[
Number
,
String
],
},
total
:
{
...
...
@@ -103,6 +146,9 @@ export default {
type
:
Number
,
},
},
components
:
{
yhqUserCenter
,
},
data
()
{
return
{
// 动画效果的切换
...
...
@@ -116,6 +162,8 @@ export default {
// address: "上海市普陀区金沙江路",
// },
],
safetyDeviceList
:
[],
yhquserCenterShow
:
false
,
};
},
created
()
{
...
...
@@ -127,22 +175,43 @@ export default {
detcetorList
(
newData
)
{
// console.log(bol);
// if (bol) {
console
.
log
(
"55555555"
,
newData
);
console
.
log
(
"55555555"
,
newData
);
this
.
tableData
=
[...
newData
];
// }
},
},
mounted
()
{
// document.querySelector(".bigwindow").removeChild(this.$refs.toBody);
let
domArr
=
document
.
querySelectorAll
(
".bigwindow .toBody"
);
console
.
log
(
"domArr"
,
domArr
.
length
);
domArr
.
forEach
((
item
)
=>
{
document
.
querySelector
(
".bigwindow"
).
removeChild
(
item
);
});
console
.
log
(
"domArr"
,
domArr
);
// document.querySelector("body").addEventListener("click", () => {
// console.log(123);
// this.yhquserCenterShow = false;
// console.log(this.yhquserCenterShow);
// });
document
.
querySelector
(
".bigwindow"
).
appendChild
(
this
.
$refs
.
toBody
);
},
methods
:
{
toBodyClick
()
{},
deviceShow
(
list
)
{
this
.
yhquserCenterShow
=
true
;
this
.
safetyDeviceList
=
list
;
},
handleSizeChange
(
val
)
{
console
.
log
(
val
);
},
handleCurrentChangvale
(
val
)
{
this
.
$parent
.
getDetectorInfoList
(
listDetectorInfo
,
getUserList
,
{
userId
:
this
.
user
Id
,
villageId
:
this
.
village
Id
,
pageNum
:
val
,
pageSize
:
this
.
pageSize
,
},
...
...
@@ -151,13 +220,14 @@ export default {
},
close
()
{
// this.fade = "fade";
this
.
$parent
.
userCenterShow
=
false
;
this
.
safetyDeviceList
=
[];
this
.
yhquserCenterShow
=
false
;
},
},
};
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.wrapper
{
// width: 978px;
// max-height: 600px;
...
...
@@ -169,7 +239,7 @@ export default {
// // background-color: #fff;
// display: flex;
// justify-content: space-between;
margin-top
:
10
px
;
margin-top
:
2
px
;
z-index
:
9999
;
&
>
div
{
...
...
@@ -254,7 +324,7 @@ export default {
}
}
.right
{
width
:
74
0px
;
width
:
80
0px
;
display
:
flex
;
flex-wrap
:
wrap
;
// justify-content: space-between;
...
...
@@ -304,4 +374,29 @@ export default {
font-size
:
50px
!
important
;
}
}
</
style
>
\ No newline at end of file
.toBody
{
position
:
fixed
;
left
:
50%
;
top
:
20%
;
height
:
500px
;
width
:
760px
;
margin-left
:
-380px
;
background
:
rgba
(
0
,
0
,
0
,
0
.3
);
box-sizing
:
border-box
;
padding
:
10px
20px
;
// padding-top:-10px;
.list-top
{
display
:
flex
;
justify-content
:
space-between
;
.title
{
color
:
rgb
(
73
,
216
,
255
);
flex
:
1
;
text-align
:
center
;
}
.close
{
cursor
:
pointer
;
}
}
}
</
style
>
zh-baseversion-web/src/components/bigWindow/yhqUser.vue
View file @
024e64bd
<!--
* @Author: your name
* @Date: 2022-01-26 20:07:52
* @LastEditTime: 2024-0
7-25 17:11:56
* @LastEditTime: 2024-0
9-07 15:55:19
* @LastEditors: 纪泽龙 jizelong@qq.com
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
...
...
@@ -10,52 +10,52 @@
<
template
>
<div
class=
"devicea-wrapper"
>
<div
class=
"title"
>
{{
deviceData
.
township
}}
{{
deviceData
.
nickName
}}
</div>
<div
class=
"close"
@
click=
"close"
>
<!--
<img
src=
"@/assets/mapImages/closeBtn.png"
alt=
""
/>
-->
<i
class=
"el-icon-close"
style=
"font-size: 20px; color: #5dfefe"
></i>
</div>
<div
class=
"line"
></div>
<div>
<
!--
<div
class=
"top flex top-top"
>
--
>
<!--
<div
class=
"group"
style=
"width:20%"
>
--
>
<!--
<div
class=
"left"
>
联系人:
</div>
--
>
<!--
<div
class=
"right zzz"
>
{{
deviceData
.
linkman
}}
</div>
--
>
<!--
</div>
--
>
<!--
<div
class=
"group"
style=
"width:30%"
>
--
>
<!--
<div
class=
"left"
>
联系电话:
</div>
--
>
<!--
<div
v-unValue
class=
"right zzz"
>
--
>
<!--
{{
deviceData
.
phone
}}
-->
<!--
</div>
--
>
<!--
</div>
--
>
<!--
<div
class=
"group"
style=
"width:30%"
>
--
>
<!--
<div
class=
"left"
>
联系地址:
</div>
--
>
<!--
<div
:title=
"deviceData.address"
class=
"right last zzz"
>
--
>
<!--
{{
deviceData
.
address
||
"-"
}}
-->
<!--
</div>
--
>
<!--
</div>
--
>
<
!--
</div>
--
>
<
div
class=
"top flex top-top"
>
<div
class=
"group"
style=
"width: 20%"
>
<div
class=
"left"
>
用户姓名
</div
>
<div
:title=
"deviceData.nickName"
class=
"right zzz"
>
{{
deviceData
.
nickName
}}
</div
>
</div
>
<div
class=
"group"
style=
"width: 30%"
>
<div
class=
"left"
>
联系电话:
</div
>
<div
v-unValue
class=
"right zzz"
>
{{
deviceData
.
phone
}}
</div
>
</div
>
<div
class=
"group"
style=
"width: 30%"
>
<div
class=
"left"
>
联系地址:
</div
>
<div
:title=
"deviceData.address"
class=
"right last zzz"
>
{{
deviceData
.
address
||
"-"
}}
</div
>
</div
>
<
/div
>
<!--
<div
class=
"top flex top-bottom"
>
<div
class=
"group"
>
<div
class=
"left"
>
联系地址:
</div>
<div
:title=
"deviceData.address"
class=
"right last zzz"
>
{{
deviceData
.
address
||
"-"
}}
<div
class=
"group"
>
<div
class=
"left"
>
联系地址:
</div>
<div
:title=
"deviceData.address"
class=
"right last zzz"
>
{{
deviceData
.
address
||
"-"
}}
</div>
</div>
</div>
</div>
-->
</div>
-->
<template
v-if=
"deviceData.detectorCountList"
>
<
!--
<
template
v-if=
"deviceData.detectorCountList"
>
<div
class=
"foot"
>
<div
class=
"thead flex"
>
<div
class=
"first"
>
设备类型
</div>
<div>
设备数量
</div>
<div>
在线设备
</div>
<div>
离线设备
</div>
<
!--
<
div>
历史报警
</div>
<div>
已处理报警
</div>
-->
<div>
历史报警
</div>
<div>
已处理报警
</div>
<div
class=
"last"
>
报警中
</div>
</div>
<div
...
...
@@ -71,21 +71,21 @@
<div
v-unValue
class=
""
>
{{
data
.
offLineNum
}}
</div>
<
!--
<
div
v-unValue
class=
""
>
<div
v-unValue
class=
""
>
{{
data
.
historyAlarmNum
}}
</div>
<div
v-unValue
class=
""
>
{{
data
.
cancelAlarmNum
}}
</div>
-->
</div>
<div
v-unValue
class=
"last zzz"
>
{{
data
.
processingAlarmNum
}}
</div>
</div>
</div>
</
template
>
</
template
>
-->
</div>
<div
style=
"width: 100%; display: flex"
>
<div
style=
"width: 100%; display: flex"
v-if=
"deviceData.safetyDeviceList.length>0"
>
<div
class=
"btn"
>
<div>
感知设备
</div>
</div>
...
...
@@ -108,16 +108,30 @@
/>
</div>
</div>
<yhqUserCenter
:title=
"centerTitle"
:show=
"yhquserCenterShow"
ref=
"yhquserCenter"
:detcetorList=
"de
tcetor
List"
:detcetorList=
"de
viceData.safetyDevice
List"
:userId=
"centerUserId"
:total=
"centerTotal"
:pageSize=
"5"
v-show=
"!isShow"
/>
<div
class=
"body-wrapper"
ref=
"toBody"
>
<!-- <yhqUserCenter
:title="centerTitle"
:show="false"
ref="yhquserCenter"
:detcetorList="detcetorList"
:userId="centerUserId"
:total="centerTotal"
:pageSize="5"
v-show="!isShow"
/> -->
</div>
</div>
</template>
...
...
@@ -129,8 +143,8 @@ import {
deviceUserList
,
}
from
"@/api/bigWindow/getDevice"
;
import
{
companyType
,
deviceType
}
from
"@/utils/mapClass/config.js"
;
import
{
yhqlistDetectorInfo
}
from
"@/api/detector/detectorInfo"
;
import
{
yhqdetectorUserList
}
from
"@/api/detector/detectorUser"
;
//
import { yhqlistDetectorInfo } from "@/api/detector/detectorInfo";
import
{
yhqdetectorUserList
,
labelsLayerMarksDUserVillageSafDevInfoMap
}
from
"@/api/detector/detectorUser"
;
import
yhqUserCenter
from
"@/components/bigWindow/yhqUserCenter.vue"
;
export
default
{
...
...
@@ -139,6 +153,7 @@ export default {
},
data
()
{
return
{
dialogVisible
:
true
,
flag
:
true
,
isShow
:
true
,
companyType
,
...
...
@@ -166,9 +181,13 @@ export default {
this
.
companyType
[
item
.
conpanyId
]
=
item
.
companyName
;
});
}
//this.myHttp();
// console.log(this.deviceData);
this
.
btnClick
();
// console.log("this.deviceData",this.deviceData);
// this.btnClick();
// console.log(this.$refs.toBody);
// document.querySelector(".bigwindow").appendChild(this.$refs.toBody);
},
methods
:
{
//用户的设备center
...
...
@@ -190,33 +209,44 @@ export default {
}
});
},
getDeviceList
(){
// return labelsLayerMarksDUserVillageSafDevInfoMap().then(res=>{
// console.log("设备",res)
// })
},
close
()
{
this
.
mapClass
.
infowindowClose
();
},
btnClick
()
{
this
.
isShow
=
!
this
.
isShow
;
// this.vueRoot.centerDataFunc(this.deviceData.pressureFlows);
this
.
getDetectorInfoList
(
deviceUserList
,
{
township
:
this
.
deviceData
.
township
,
pageNum
:
1
,
pageSize
:
5
},
this
.
deviceData
.
nickName
);
//
this.getDetectorInfoList(
//
deviceUserList,
//
{ township: this.deviceData.township, pageNum: 1, pageSize: 5 },
//
this.deviceData.nickName
//
);
},
myHttp
()
{
yhqdetectorUserList
({
userId
:
this
.
deviceData
.
userId
}).
then
((
res
)
=>
{
if
(
res
.
code
==
200
)
{
const
data
=
res
.
data
.
filter
(
(
item
)
=>
item
.
userId
==
this
.
deviceData
.
userId
)[
0
].
detectorCountList
;
this
.
deviceData
.
detectorCountList
=
data
;
}
});
// yhqdetectorUserList({ userId: this.deviceData.userId }).then((res) => {
// if (res.code == 200) {
// const data = res.data.filter(
// (item) => item.userId == this.deviceData.userId
// )[0].detectorCountList;
// this.deviceData.detectorCountList = data;
// }
// });
},
},
};
</
script
>
<
style
lang=
"scss"
scoped
>
.body-wrapper
{
position
:
fixed
;
top
:
100px
;
}
.arrowTransform
{
transition
:
0s
;
transform-origin
:
center
;
...
...
@@ -241,9 +271,9 @@ export default {
font-size
:
14px
;
line-height
:
14px
;
color
:
#ffffff
;
padding-left
:
5px
;
padding-left
:
5px
;
}
.line
{
.line
{
width
:
50%
;
height
:
2px
;
margin-top
:
10px
;
...
...
@@ -275,10 +305,10 @@ export default {
.group
{
height
:
30px
;
display
:
flex
;
justify-content
:
space-between
;
//
justify-content: space-between;
box-sizing
:
border-box
;
div
{
flex
:
1
;
//
flex: 1;
box-sizing
:
border-box
;
text-align
:
left
;
font-size
:
14px
;
...
...
@@ -293,6 +323,9 @@ export default {
.left
{
text-align
:
left
;
}
.right
{
flex
:
1
;
}
}
&
.top-bottom
{
.left
{
...
...
zh-baseversion-web/src/components/bigWindow/yhqUserCenter.vue
View file @
024e64bd
...
...
@@ -11,63 +11,67 @@
<div
class=
"bottom right-bottom-data-left"
>
<el-table
size=
"mini"
:data=
"
tableData
"
:data=
"
detcetorList
"
style=
"width: 720px"
class=
"el-bottom"
:key=
"Math.random()"
>
<!-- :height="tableHeight" -->
<
!--
<el-table-column
prop=
"detectorCode"
label=
"设备
编号"
width=
"180"
>
<
el-table-column
prop=
"detectorCode"
label=
"报警器
编号"
width=
"180"
>
<template
slot-scope=
"scope"
>
<div
:title=
"scope.row.detectorCode"
class=
"
ddd
"
v-unValue
>
{{
scope
.
row
.
detectorCode
}}
<div
:title=
"scope.row.detectorCode"
class=
"
zzz
"
v-unValue
>
{{
scope
.
row
.
iotNo
}}
</div>
</
template
>
</el-table-column>
-->
<el-table-column
prop=
"detectorName"
label=
"
设备
名称"
width=
"100"
>
</el-table-column>
<el-table-column
prop=
"detectorName"
label=
"
报警器
名称"
width=
"100"
>
<
template
slot-scope=
"scope"
>
<div
:title=
"scope.row.detectorName"
class=
"
ddd
"
v-unValue
>
家用报警器
<div
:title=
"scope.row.detectorName"
class=
"
zzz
"
v-unValue
>
{{
scope
.
row
.
deviceName
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"medium"
label=
"监测介质"
width=
"100"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
>
{{
scope
.
row
.
m
edium
}}
</div>
<div
v-unValue
>
{{
scope
.
row
.
detctionM
edium
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"detectorAddr"
label=
"设备地址"
width=
"100"
>
<
!-- <
el-table-column prop="detectorAddr" label="设备地址" width="100">
<template slot-scope="scope">
<div v-unValue style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" :title="scope.row.address">
{{ scope.row.address }}
</div>
</template>
</el-table-column>
<el-table-column
prop=
"linkman"
label=
"联系人"
width=
"80"
>
</el-table-column>
-->
<
!-- <
el-table-column prop="linkman" label="联系人" width="80">
<template slot-scope="scope">
<div v-unValue style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{ scope.row.linkman }}</div>
</template>
</el-table-column>
<el-table-column prop="phone" label="联系电话" width="100">
</el-table-column>
<el-table-column
prop=
"detectorStatus"
label=
"
设备
状态"
width=
"100"
>
</el-table-column>
-->
<el-table-column
prop=
"detectorStatus"
label=
"状态"
width=
"100"
>
<
template
slot-scope=
"scope"
>
<div
v-if=
"scope.row.status == 0"
>
在线
</div>
<div
v-else-if=
"scope.row.status == 1"
>
离线
</div>
<div
v-else
>
-
</div>
<div
class=
"detail"
v-if=
"scope.row.status == 0"
>
在线
</div>
<div
class=
"detail"
v-else-if=
"scope.row.status == 1"
>
离线
</div>
<div
class=
"detail"
v-else
>
-
</div>
<!--
<div
v-unValue
:style=
"
{color:scope.row.detectorStatus==1?'red':''}">
{{
scope
.
row
.
detectorStatus
}}
</div>
-->
</
template
>
</el-table-column>
<el-table-column
prop=
"alarmTime"
label=
"
预警时间
"
width=
"140"
>
<el-table-column
prop=
"alarmTime"
label=
"
报警记录
"
width=
"140"
>
<
template
slot-scope=
"scope"
>
<div
v-unValue
>
{{
scope
.
row
.
alarmTime
}}
</div>
<div
class=
"zzz"
v-unValue
>
{{
scope
.
row
.
alarmTime
}}
</div>
</
template
>
</el-table-column>
<el-table-column
prop=
"alarmTime"
label=
"安装时间"
width=
"140"
>
<
template
slot-scope=
"scope"
>
<div
class=
"zzz"
v-unValue
>
{{
scope
.
row
.
deviceInstallTime
}}
</div>
</
template
>
</el-table-column>
</el-table>
<div>
<el-pagination
<
!-- <
el-pagination
@current-change="handleCurrentChangvale"
:page-size="pageSize"
layout="prev, pager, next, jumper"
...
...
@@ -75,7 +79,7 @@
:hide-on-single-page="total <= pageSize"
:key="total + '' + pageSize"
>
</el-pagination>
</el-pagination>
-->
</div>
</div>
</div>
...
...
@@ -123,10 +127,10 @@ export default {
// address: "上海市普陀区金沙江路",
// },
],
detectorStatusList
:{
"0"
:
"在线"
,
"1"
:
"离线"
,
}
detectorStatusList
:
{
0
:
"在线"
,
1
:
"离线"
,
}
,
};
},
created
()
{
...
...
@@ -138,11 +142,15 @@ export default {
detcetorList
(
newData
)
{
// console.log(bol);
// if (bol) {
console
.
log
(
"222222222222222222222222222222222222222222"
,
newData
);
console
.
log
(
"222222222222222222222222222222222222222222"
,
newData
);
this
.
tableData
=
[...
newData
];
console
.
log
(
this
.
tableData
)
// }
},
},
mounted
(){
},
methods
:
{
handleSizeChange
(
val
)
{
...
...
@@ -167,7 +175,7 @@ export default {
};
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.wrapper
{
// width: 978px;
// max-height: 600px;
...
...
@@ -179,7 +187,7 @@ export default {
// // background-color: #fff;
// display: flex;
// justify-content: space-between;
margin-top
:
10px
;
//
margin-top: 10px;
z-index
:
9999
;
&
>
div
{
...
...
@@ -314,4 +322,7 @@ export default {
font-size
:
50px
!
important
;
}
}
.detail
{
text-align
:
left
;
}
</
style
>
zh-baseversion-web/src/utils/mapClass/map.js
View file @
024e64bd
/*
* @Author: your name
* @Date: 2022-01-11 13:45:12
* @LastEditTime: 2024-0
8-01 10:21:14
* @LastEditTime: 2024-0
9-07 14:57:27
* @LastEditors: 纪泽龙 jizelong@qq.com
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /test/hello-world/src/utils/mapClass.js
...
...
@@ -979,7 +979,12 @@ export class EditorMap {
* @param {*} component
* @param {*} showBool
*/
labelsLayerMarksDetectorUserList
(
mapData
,
compontent
,
showBool
=
true
)
{
labelsLayerMarksDetectorUserList
(
mapData
,
compontent1
,
compontent2
,
showBool
=
true
)
{
if
(
mapData
!==
null
&&
mapData
!==
undefined
)
{
const
hashMap
=
new
Map
();
for
(
var
key
in
mapData
)
{
...
...
@@ -998,7 +1003,7 @@ export class EditorMap {
const
icon
=
{
type
:
"image"
,
//图标类型,现阶段只支持 image 类型
image
:
svgUrl
[
6
],
//可访问的图片 URL
size
:
[
44
,
49
],
//图片尺寸
size
:
[
44
,
49
],
//图片尺寸
anchor
:
"center"
,
//图片相对 position 的锚点,默认为 bottom-center
};
var
markers
=
[];
...
...
@@ -1007,7 +1012,7 @@ export class EditorMap {
jsonValueArr
.
forEach
((
item
)
=>
{
let
longitude
=
item
.
longitude
;
let
latitude
=
item
.
latitude
;
var
userId
=
item
.
user
Id
;
var
userId
=
item
.
village
Id
;
icon
.
userId
=
userId
;
var
curData
=
{
position
:
[
longitude
,
latitude
],
...
...
@@ -1027,7 +1032,7 @@ export class EditorMap {
var
userId
=
JSON
.
stringify
(
optsObj
.
icon
.
userId
);
var
extData
=
hashMap
.
get
(
userId
);
// 如果control==0就是默认值,没有使用123功能,就显示infowindow
this
.
massMarksMarkerClick
(
extData
,
compontent
);
this
.
massMarksMarkerClick
(
extData
,
compontent
1
);
});
if
(
item
.
companyType
)
{
labelMarker
.
filterData
=
{
...
...
@@ -1089,7 +1094,7 @@ export class EditorMap {
var
userId
=
JSON
.
stringify
(
optsObj
.
icon
.
userId
);
var
extData
=
hashMap
.
get
(
userId
);
// 如果control==0就是默认值,没有使用123功能,就显示infowindow
this
.
massMarksMarkerClick
(
extData
,
compontent
);
this
.
massMarksMarkerClick
(
extData
,
compontent
2
);
});
if
(
item
.
companyType
)
{
...
...
@@ -1774,9 +1779,9 @@ export class EditorMap {
this
.
pipeArr
[
item
].
forEach
((
pipe
)
=>
{
const
options
=
pipe
.
getOptions
();
pipe
.
setOptions
({
...
options
,
strokeOpacity
:
num
});
});
});
}
console
.
log
(
123
)
console
.
log
(
123
)
;
}
// searchPipeClear() {
// const { pipePressure } = this.searchDevice.getExtData();
...
...
zh-baseversion-web/src/views/bigWindow/components/Top.vue
View file @
024e64bd
...
...
@@ -124,7 +124,7 @@ export default {
val
:
61
,
ischeck
:
false
,
imgurl
:
require
(
"@/assets/firstimage/syUser1.png"
),
name
:
"商业用户"
,
name
:
"
工
商业用户"
,
},
{
val
:
18
,
...
...
@@ -293,7 +293,7 @@ export default {
height
:
20px
;
}
.device-btn-wrapper
{
width
:
7
8
0px
;
width
:
7
9
0px
;
margin-right
:
5px
;
flex-wrap
:
wrap
;
}
...
...
zh-baseversion-web/src/views/bigWindow/index.vue
View file @
024e64bd
<!--
* @Author: your name
* @Date: 2022-01-11 13:44:17
* @LastEditTime: 2024-0
8-02 14:09:08
* @LastEditTime: 2024-0
9-06 16:40:07
* @LastEditors: 纪泽龙 jizelong@qq.com
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /test/hello-world/src/views/Home.vue
...
...
@@ -10,7 +10,7 @@
<div
class=
"home bigwindow"
@
click=
"windowClick"
>
<div
id=
"map"
></div>
<!--
<Center
:show=
"show"
:centerData=
"centerData"
/>
-->
<UserCenter
<
!--
<
UserCenter
:title=
"centerTitle"
:show=
"userCenterShow"
ref=
"userCenter"
...
...
@@ -27,7 +27,7 @@
:userId=
"centerUserId"
:total=
"centerTotal"
:pageSize=
"20"
/>
/>
-->
<!--
<PipeSelect
@
transmit=
"getPipeSelectMessage"
@
closeMediumPressureLine=
"clearBigWindowsSelectPipe"
...
...
@@ -309,8 +309,7 @@ export default {
},
async
mounted
()
{
labelsLayerMarksDUserVillageSafDevInfoMap
();
// labelsLayerMarksDUserVillageSafDevInfoMap();
// console.log(99999999999999)
// getPipe().then(res=>{
// console.log("成功成功成功成功成功成功成功成功成功成功成功成功成功成功成功成功成功成功成功成功",res)
...
...
@@ -384,13 +383,19 @@ export default {
this
.
labelsLayerMarksVideoGoMap
(
getVideo
,
VideoView
,
false
);
//this.goMap(getYhq, this.addDevice2, yhqUser, false); //液化气用户上图
if
(
this
.
enterpriseId
==
-
2
)
{
this
.
labelsLayerMarksDeviceUserGoMap
(
deviceUser
,
yhqUser
,
false
);
//用户上图
// this.labelsLayerMarksDeviceUserGoMap(deviceUser, yhqUser, false); //用户上图
this
.
labelsLayerMarksDeviceUserGoMap
(
labelsLayerMarksDUserVillageSafDevInfoMap
,
yhqUser
,
false
);
//用户上图
}
// 用户要等一下 因为有报警数据
this
.
labelsLayerMarksDetectorUserGoMap
(
labelsLayerMarksD
etectorUserList
,
labelsLayerMarksD
UserVillageSafDevInfoMap
,
User
,
yhqUser
,
false
).
then
((
res
)
=>
{
// 先查一下,然后开启定时器
...
...
@@ -633,9 +638,8 @@ export default {
labelsLayerMarksDeviceUserGoMap
(
httpFunc
,
component
,
show
)
{
return
httpFunc
().
then
((
res
)
=>
{
const
mapData
=
res
.
data
;
const
mapData
=
res
.
data
[
18
]
;
console
.
log
(
"液化气用户用户"
,
mapData
);
this
.
map
.
labelsLayerMarksDeviceUserGoMap
(
mapData
,
component
,
show
);
});
},
...
...
@@ -671,11 +675,17 @@ export default {
this
.
map
.
labelsLayerMarksTysGoMap
(
mapData
,
component
,
show
);
});
},
labelsLayerMarksDetectorUserGoMap
(
httpFunc
,
component
,
show
)
{
labelsLayerMarksDetectorUserGoMap
(
httpFunc
,
component
1
,
component2
,
show
)
{
return
httpFunc
().
then
((
res
)
=>
{
const
mapData
=
res
.
data
;
const
mapData
=
{
6
:
res
.
data
[
6
],
61
:
res
.
data
[
61
]
};
// const mapData =res.data
console
.
log
(
"用户用户用户用户用户"
,
mapData
);
this
.
map
.
labelsLayerMarksDetectorUserList
(
mapData
,
component
,
show
);
this
.
map
.
labelsLayerMarksDetectorUserList
(
mapData
,
component1
,
component2
,
show
);
});
},
goMap
(
httpFunc
,
addFunc
,
component
,
show
)
{
...
...
zh-baseversion-web/vue.config.js
View file @
024e64bd
...
...
@@ -34,9 +34,11 @@ module.exports = {
proxy
:
{
// detail: https://cli.vuejs.org/config/#devserver-proxy
[
process
.
env
.
VUE_APP_BASE_API
]:
{
target
:
`http://localhost:8905/gassafety`
,
//
target: `http://localhost:8905/gassafety`,
// target: `http://27.128.233.145:8905/gassafety`,
// target: `http://36.138.180.82:8905/gassafety`,
// 服务器
target
:
`http://36.138.180.82:8079//gassafety`
,
changeOrigin
:
true
,
pathRewrite
:
{
[
"^"
+
process
.
env
.
VUE_APP_BASE_API
]:
""
,
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment