From d87d4f1aacc30ce4552ceee287c3e712ece7be0a Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 02 Mar 2023 10:20:04 +0800
Subject: [PATCH] Merge branch 'ybranch'
---
/dev/null | 434 ---------------------------------------
src/store/modules/popupParams.js | 8
src/components/map/index.vue | 16 +
src/store/getters.js | 3
src/components/map/components/activityPolicePopup.vue | 81 +++++++
src/views/activity/index.vue | 61 +++-
6 files changed, 143 insertions(+), 460 deletions(-)
diff --git a/src/components/map/components/activityPolicePopup.vue b/src/components/map/components/activityPolicePopup.vue
new file mode 100644
index 0000000..e2c4f7f
--- /dev/null
+++ b/src/components/map/components/activityPolicePopup.vue
@@ -0,0 +1,81 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2023-03-02 09:39:32
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2023-03-02 10:16:14
+ * @FilePath: \srs-police-affairs\src\components\map\components\activityPolicePopup.vue
+ * @Description:
+ *
+ * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
+-->
+<template>
+ <div>
+ <div v-if="activityPolicePopup" class="popup-dom" id="ActivityPoliceDomBox">
+ <div style="transform: translate(-50%, 0);">
+ <!-- 样式自己修改 -->
+ <div class="content" :class="{ 'scale-dom': scaleDomFlag }">
+ 5464564556555
+ <br>
+ 5566556565656
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+
+export default {
+ name: 'activityPolicePopup',
+
+ inject: ["getWidth", 'userInfo'],
+
+ data () {
+ return {
+ scaleDomFlag: false
+ }
+ },
+
+ computed: {
+ ...mapGetters([
+ 'activityPolicePopup'
+ ])
+ },
+
+ mounted () {
+
+ if (this.getWidth() > 7000) {
+ this.scaleDomFlag = true
+ } else {
+ this.scaleDomFlag = false
+ }
+
+ },
+
+ methods: {
+
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.popup-dom {
+ position: fixed;
+ top: -16px;
+ left: 0;
+ z-index: 1 !important;
+
+ .scale-dom {
+ transform: scale(3);
+ transform-origin: left;
+ }
+
+ .content {
+ width: 320px;
+ height: 480px;
+ background: $bg-color;
+ border-radius: 10px;
+ }
+}
+</style>
\ No newline at end of file
diff --git a/src/components/map/components/policePopup.vue b/src/components/map/components/policePopup.vue
deleted file mode 100644
index 881da15..0000000
--- a/src/components/map/components/policePopup.vue
+++ /dev/null
@@ -1,434 +0,0 @@
-<template>
- <div>
- <div v-if="detailsPopup.showBox" class="divForms-dom" id="divFormsDomBox">
- <div style="width: 100%; height: 100%; transform: translate(0, 50%);">
- <div class="divForms divForms-theme" :class="{ 'scale-dom': scaleDomFlag }">
- <div class="divForms-wrap">
- <div class="area">
- <div class="arrow-lt"></div>
- <div class="b-t"></div>
- <div class="b-r"></div>
- <div class="b-b"></div>
- <div class="b-l"></div>
- <div class="arrow-rb"></div>
- <div class="label-wrap">
- <div class="title">
- 警情信息
- <div class="details-btn" @click="popupDetailShow">
- 详情
- <span>>>></span>
- </div>
- <div class="close" @click="closePopup" title="关闭"></div>
- </div>
- <div class="change-btn" v-show="detailsPopup.showBtn">
- <div @click="currentBtn = '接警信息'" :class="{ on: currentBtn == '接警信息' }">接警信息</div>
- <div @click="currentBtnChange('出警信息')" :class="{ on: currentBtn == '出警信息' }">出警信息</div>
- </div>
-
- <div v-show="currentBtn == '接警信息'" class="label-content">
- <div class="item">
- <div>接警单位:</div>
- <div>{{ dataPopup.JJDWMC }}</div>
- </div>
- <div class="item">
- <div>接警员:</div>
- <div>{{ dataPopup.JJYXM }}</div>
- </div>
- <div class="item">
- <div>报警时间:</div>
- <div>{{ dataPopup.BJSJ }}</div>
- </div>
- <div class="item">
- <div>报警人:</div>
- <div>{{ dataPopup.BJRXM }}</div>
- </div>
- <div class="item">
- <div>联系电话:</div>
- <div>{{ dataPopup.LXDH }}</div>
- </div>
- <div class="item">
- <div>报警内容:</div>
- <div :title="dataPopup.BJNR">{{ dataPopup.BJNR }}</div>
- </div>
- <div class="item">
- <div>事发地址:</div>
- <div :title="dataPopup.SFDZ">{{ dataPopup.SFDZ }}</div>
- </div>
- <div class="item">
- <div>报警类型:</div>
- <div>{{ dataPopup.BJLX }}</div>
- </div>
- <div class="item">
- <div>备注:</div>
- <div>{{ dataPopup.MEMO }}</div>
- </div>
- </div>
-
- <div v-show="currentBtn == '出警信息' && JSON.stringify(CJdata) != '{}'" class="label-content">
- <div class="item">
- <div>处警单位:</div>
- <div>{{ CJdata.CJDWMC }}</div>
- </div>
- <div class="item">
- <div>处警员:</div>
- <div>{{ CJdata.CJYXM }}</div>
- </div>
- <div class="item">
- <div>接警时间:</div>
- <div>{{ CJdata.JJSJ }}</div>
- </div>
- <div class="item">
- <div>出动人员:</div>
- <div>{{ CJdata.CDRY }}</div>
- </div>
- <div class="item">
- <div>出动车辆:</div>
- <div>{{ CJdata.CDCL }}</div>
- </div>
- <div class="item">
- <div>到达现场时间:</div>
- <div>{{ CJdata.DDXCSJ }}</div>
- </div>
- <div class="item">
- <div>处理完毕时间:</div>
- <div>{{ CJdata.CLWBSJ }}</div>
- </div>
- <div class="item">
- <div>处警类型:</div>
- <div>{{ CJdata.CJLX }}</div>
- </div>
- <div class="item">
- <div>备注:</div>
- <div>{{ CJdata.MEMO }}</div>
- </div>
- </div>
-
- <div v-show="currentBtn == '出警信息' && JSON.stringify(CJdata) == '{}'"
- class="label-content no-data">暂无数据</div>
- </div>
- </div>
- <div class="b-t-l"></div>
- <div class="b-b-r"></div>
- </div>
- <div class="arrow"></div>
- </div>
- </div>
- </div>
- </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex'
-
-import { getActAsPoliceList } from "@/api/home/index.js"
-
-export default {
- name: 'mapPopup',
-
- inject: ["getWidth", 'userInfo'],
-
- data () {
- return {
- currentBtn: '接警信息',
- CJdata: {},
- scaleDomFlag: false
- }
- },
-
- computed: {
- ...mapGetters([
- 'detailsPopup',
- 'dataPopup'
- ])
- },
-
- watch: {
- detailsPopup: {
- handler (newData, oldData) {
- if (newData.showBox == false) {
- this.currentBtn = '接警信息'
- }
- }
- }
- },
-
- mounted () {
-
- if (this.getWidth() > 7000) {
- this.scaleDomFlag = true
- } else {
- this.scaleDomFlag = false
- }
-
- },
-
- methods: {
- closePopup () {
- this.currentBtn = '接警信息'
- this.$store.commit('SET_DETAILSPOPUP', {
- showBox: false,
- showBtn: false
- })
- },
-
- currentBtnChange (type) {
- this.currentBtn = type
-
- this.CJdata = {}
-
- getActAsPoliceList(this.dataPopup.JJDBH, this.userInfo.dept_id).then(res => {
- if (res.data.data.records.length > 0) {
- this.CJdata = res.data.data.records[0]
- }
- })
- },
-
- popupDetailShow () {
- if (this.detailsPopup.openMenu != '' && this.detailsPopup.openMenu == 'policeInfor') {
- this.$EventBus.$emit('PoliceInforSiteClick', this.dataPopup)
- } else {
- this.detailsPopup.showBtn == true ?
- this.$EventBus.$emit('policeSituationSiteClick', this.dataPopup) :
- this.$EventBus.$emit('housingPoliceSiteClick', this.dataPopup)
- }
- }
- }
-}
-</script>
-
-<style lang="scss" scoped>
-.divForms-dom {
- position: fixed;
- left: 0;
- z-index: 1 !important;
-
- .scale-dom {
- transform: scale(3);
- transform-origin: left;
- }
-}
-
-.divForms .arrow {
- position: absolute;
- bottom: 50%;
- left: 0;
- width: 45px;
- height: 2px;
- transform: rotate(-45deg) translate(5px, -15px);
- background-color: #28bbf0;
-}
-
-.divForms-theme .area {
- background-image: linear-gradient(135deg,
- transparent 30px,
- #1831a79a 30px,
- #3f487ba6 50%,
- transparent 50%),
- linear-gradient(-45deg,
- transparent 30px,
- #1831a79a 30px,
- #3f487ba6 50.1%,
- transparent 50%);
-}
-
-.divForms .area {
- position: relative;
- min-width: 360px;
-}
-
-.divForms-wrap {
- position: relative;
- overflow: hidden;
- padding: 30px;
-}
-
-.divForms-theme .b-b,
-.divForms-theme .b-b-r,
-.divForms-theme .b-l,
-.divForms-theme .b-r,
-.divForms-theme .b-t,
-.divForms-theme .b-t-l {
- background-color: #1831a7;
- box-shadow: 0 0 10px 2px #1831a7;
-}
-
-.divForms .b-t {
- position: absolute;
- top: 0;
- left: 44px;
- right: 0;
- height: 1px;
- z-index: 10;
-}
-
-.divForms .b-r {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 44px;
- width: 1px;
- z-index: 10;
-}
-
-.divForms .b-l {
- position: absolute;
- top: 44px;
- left: 0;
- bottom: 0;
- width: 1px;
- z-index: 10;
-}
-
-.divForms .b-b {
- position: absolute;
- left: 0;
- right: 44px;
- bottom: 0;
- height: 1px;
- z-index: 10;
-}
-
-.divForms .b-b-r {
- position: absolute;
- bottom: 0;
- right: 0;
- width: 1px;
- height: 62px;
- transform: rotate(45deg) translate(-52px, 22px);
- z-index: 10;
-}
-
-.divForms .b-t-l {
- position: absolute;
- top: 0;
- left: 0;
- width: 1px;
- height: 62px;
- transform: rotate(45deg) translate(52px, -22px);
- z-index: 10;
-}
-
-.divForms .label-wrap {
- padding: 0 12px;
- color: #fff;
- font-size: 16px;
- white-space: nowrap;
- overflow: hidden;
-
- .change-btn {
- margin-top: 6px;
- display: flex;
- align-items: center;
- justify-content: space-around;
-
- &>div {
- width: 36%;
- height: 36px;
- line-height: 36px;
- cursor: pointer;
- }
-
- &>div.on {
- color: #3d95f3;
- border-bottom: 2px solid #3d95f3;
- }
- }
-
- .label-content {
- padding: 10px 0;
-
- .item {
- display: flex;
- flex-direction: row;
- width: calc(100% - 20px);
- height: 30px;
- line-height: 30px;
- margin: 0 10px;
- text-align: left;
-
- &>div:first-child {
- width: 112px;
- text-align: justify;
- display: inline-block;
- text-align-last: justify;
- margin-right: 20px;
- }
-
- &>div:nth-of-type(2) {
- width: calc(100% - 120px);
- max-width: 190px;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
- }
- }
-
- .label-content.no-data {
- display: flex;
- align-items: center;
- justify-content: center;
- min-height: 240px;
- }
-}
-
-.divForms .title {
- position: relative;
- margin-top: 20px;
- padding: 0 12px 0 30px;
- height: 36px;
- line-height: 36px;
-
- .details-btn {
- position: absolute;
- top: 0;
- right: 28px;
- height: 100%;
- cursor: pointer;
-
- span {
- font-size: 14px;
- }
- }
-
- .details-btn:hover {
- color: #3d95f3;
- }
-
- .close {
- position: absolute;
- right: 5px;
- top: 0;
- }
-
- .close::before {
- font-family: element-icons;
- content: '\e6db';
- cursor: pointer;
- font-size: 16px;
- }
-
- .close:hover::before {
- color: #3d95f3;
- }
-}
-
-.divForms-theme .title {
- background-image: linear-gradient(135deg, transparent 25px, #1c309e9a 25px);
-}
-
-.divForms-theme .arrow,
-.divForms-theme .title::before {
- background-color: #1c309e;
-}
-
-.divForms .title::before {
- content: '';
- position: absolute;
- bottom: -4px;
- left: 0;
- right: 0;
- z-index: 10;
- height: 2px;
-}
-</style>
\ No newline at end of file
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index c91f7f1..355a499 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -2,7 +2,7 @@
* @Author: shuishen 1109946754@qq.com
* @Date: 2022-08-18 17:00:30
* @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2023-02-28 14:16:16
+ * @LastEditTime: 2023-03-02 10:05:29
* @FilePath: \srs-police-affairs\src\components\map\index.vue
* @Description: 公用地图组件
*
@@ -59,6 +59,8 @@
</div>
<map-popup></map-popup>
+
+ <activity-police-popup></activity-police-popup>
<assemble-box></assemble-box>
</div>
@@ -162,11 +164,14 @@
]
import mapPopup from './components/mapPopup.vue'
+import activityPolicePopup from './components/activityPolicePopup.vue'
+
+
export default {
name: 'mapBox',
- components: { mapPopup },
+ components: { mapPopup, activityPolicePopup },
data () {
return {
@@ -435,7 +440,7 @@
this.$EventBus.$on('layerPointAdd', (params) => {
// eslint-disable-next-line no-unused-vars
- that.layerPointAdd(params.layerName, params.type, params.layerType, params.params, params.distanceDisplayCondition, params.incident,params.mouseOverIcident)
+ that.layerPointAdd(params.layerName, params.type, params.layerType, params.params, params.distanceDisplayCondition, params.incident, params.mouseOverIncident, params.mouseOutIncident)
})
this.$EventBus.$on('layerPolygonAdd', (params) => {
@@ -715,7 +720,7 @@
layerPointAdd (layerName, type, layerType = 'VectorLayer', params, distanceDisplayCondition = {
near: 0, //最近距离
far: Number.MAX_VALUE //最远距离
- }, incident = (e) => { },mouseOverIcident = (e) => { }) {
+ }, incident = (e) => { }, mouseOverIncident = (e) => { }, mouseOutIncident = (e) => { }) {
if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
this.mapAddLayer(layerName, layerType)
}
@@ -729,7 +734,8 @@
pointElement.attrParams = params
layersObjcect[layerName].addOverlay(pointElement)
pointElement.on(global.DC.MouseEventType.CLICK, incident)
- pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIcident)
+ pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident)
+ pointElement.on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident)
} else if (type == "label") {
labelElement = new global.DC.Label(new global.DC.Position(Number(params.lng), Number(params.lat), Number(params.alt)), params.text)
labelElement.setStyle({
diff --git a/src/store/getters.js b/src/store/getters.js
index 3182418..78893b3 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -1,5 +1,6 @@
const getters = {
detailsPopup: (state) => state.popupParams.detailsPopup,
- dataPopup: (state) => state.popupParams.dataPopup
+ dataPopup: (state) => state.popupParams.dataPopup,
+ activityPolicePopup: (state) => state.popupParams.activityPolicePopup,
}
export default getters
diff --git a/src/store/modules/popupParams.js b/src/store/modules/popupParams.js
index 3d6d0f6..751eec5 100644
--- a/src/store/modules/popupParams.js
+++ b/src/store/modules/popupParams.js
@@ -5,7 +5,9 @@
showBtn: true,
openMenu: ''
},
- dataPopup: {}
+ dataPopup: {},
+
+ activityPolicePopup: false
},
mutations: {
SET_DETAILSPOPUP (state, detailsPopup) {
@@ -13,6 +15,10 @@
},
SET_DATAPOPUP (state, dataPopup) {
state.dataPopup = dataPopup
+ },
+
+ SET_ACTIVITYPOLICEPOPUP (state, activityPolicePopup) {
+ state.activityPolicePopup = activityPolicePopup
}
},
actions: {
diff --git a/src/views/activity/index.vue b/src/views/activity/index.vue
index 53acd07..366d2eb 100644
--- a/src/views/activity/index.vue
+++ b/src/views/activity/index.vue
@@ -2,7 +2,7 @@
* @Author: shuishen 1109946754@qq.com
* @Date: 2022-08-18 16:18:17
* @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2023-03-01 15:31:43
+ * @LastEditTime: 2023-03-02 10:06:06
* @FilePath: \srs-police-affairs\src\views\activity\index.vue
* @Description: 安保活动
*
@@ -22,11 +22,11 @@
v-model="activityType"
placeholder="请选择"
@change="activityTypeChange"
- >
- <el-option
- v-for="item in activityOptions"
- :key="item.dictKey"
- :label="item.dictValue"
+ >
+ <el-option
+ v-for="item in activityOptions"
+ :key="item.dictKey"
+ :label="item.dictValue"
:value="item.dictKey"
class="activity-option"
></el-option>
@@ -38,12 +38,12 @@
<div class="category">选择时间：</div>
<div class="category-value">
<!-- <el-date-picker
- size="small"
- v-model="selectTime"
- type="date"
- placeholder="选择日期"
- style="width:268px"
- ></el-date-picker>-->
+ size="small"
+ v-model="selectTime"
+ type="date"
+ placeholder="选择日期"
+ style="width:268px"
+ ></el-date-picker>-->
<el-date-picker v-model="selectTime" type="daterange" align="right" unlink-panels
format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" range-separator="至"
start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"
@@ -141,10 +141,10 @@
<ul>
<li>
<!-- <el-button
- title="路线绘制"
- @click="draw('billboard', 'policeman')"
- icon="el-icon-my-route"
- ></el-button>-->
+ title="路线绘制"
+ @click="draw('billboard', 'policeman')"
+ icon="el-icon-my-route"
+ ></el-button>-->
<button @click="draw('polyline', 'policecar')" title="巡逻路线">
<img src="../../../public/img/icon/route1.png" style="height:100%" />
</button>
@@ -1113,7 +1113,8 @@
type: 'billboard',
params: positionObj,
incident: this.overlayTypeClick,
- mouseOverIcident: this.pointMouseOver
+ mouseOverIncident: this.pointMouseOver,
+ mouseOutIncident: this.pointMouseOut
})
}
@@ -2483,10 +2484,32 @@
// 鼠标移入图标事件
pointMouseOver (e) {
- console.log(12345)
- console.log(e)
+ this.$store.commit('SET_ACTIVITYPOLICEPOPUP', true)
+
+ var popup = new global.DC.DivForms(global.viewer, {
+ domId: 'ActivityPoliceDomBox',
+ position: [
+ global.DC.Transform.transformWGS84ToCartesian(
+ new global.DC.Position(
+ Number(e.overlay.attrParams.lng),
+ Number(e.overlay.attrParams.lat),
+ 0
+ )
+ )
+ ]
+ })
},
+ /**
+ * @description: 鼠标移出事件
+ * @param {*} e
+ * @return {*}
+ */
+ pointMouseOut (e) {
+ console.log(6666333)
+ this.$store.commit('SET_ACTIVITYPOLICEPOPUP', false)
+ }
+
},
computed: {
--
Gitblit v1.9.3