shuishen
2023-01-06 05eae3efbb38ef2c71791a5619a0115c9eb5f4ed
src/components/map/components/mapPopup.vue
@@ -13,53 +13,91 @@
                            <div class="arrow-rb"></div>
                            <div class="label-wrap">
                                <div class="title">
                                    详细信息
                                    警情信息
                                    <div class="details-btn" @click="popupDetailShow">详情>>></div>
                                    <div class="close" @click="closePopup" title="关闭"></div>
                                </div>
                                <div class="change-btn">
                                    <div class="on">接警信息</div>
                                    <div>出警信息</div>
                                    <div @click="currentBtn = '接警信息'" :class="{ on: currentBtn == '接警信息' }">接警信息</div>
                                    <div @click="currentBtnChange('出警信息')" :class="{ on: currentBtn == '出警信息' }">出警信息
                                    </div>
                                </div>
                                <div class="label-content">
                                <div v-show="currentBtn == '接警信息'" class="label-content">
                                    <div class="item">
                                        <div>警情类别:</div>
                                        <div>{{ dataPopup.type }}</div>
                                        <div>接警单位:</div>
                                        <div>{{ dataPopup.JJDWMC }}</div>
                                    </div>
                                    <div class="item">
                                        <div>接警员:</div>
                                        <div>{{ dataPopup.JJYXM }}</div>
                                    </div>
                                    <div class="item">
                                        <div>接警时间:</div>
                                        <div>{{ dataPopup.dealTime }}</div>
                                    </div>
                                    <div class="item">
                                        <div>警情状态:</div>
                                        <div>{{ dataPopup.state }}</div>
                                    </div>
                                    <div class="item">
                                        <div>经办民警:</div>
                                        <div>{{ dataPopup.dealPolice }}</div>
                                        <div>{{ dataPopup.JJSJ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>报警人:</div>
                                        <div>{{ dataPopup.callPeople }}</div>
                                        <div>{{ dataPopup.BJRXM }}</div>
                                    </div>
                                    <div class="item">
                                        <div>报警电话:</div>
                                        <div>{{ dataPopup.comingPhone }}</div>
                                        <div>联系电话:</div>
                                        <div>{{ dataPopup.LXDH }}</div>
                                    </div>
                                    <div class="item">
                                        <div>报警人联系人:</div>
                                        <div>{{ dataPopup.callPhone }}</div>
                                        <div>联系电话:</div>
                                        <div>{{ dataPopup.BJNR }}</div>
                                    </div>
                                    <div class="item">
                                        <div>所属派出所:</div>
                                        <div>{{ dataPopup.policeName }}</div>
                                        <div>事发地址:</div>
                                        <div>{{ dataPopup.SFDZ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>经度:</div>
                                        <div>{{ dataPopup.position[0] }}</div>
                                        <div>报警类型:</div>
                                        <div>{{ dataPopup.BJLX }}</div>
                                    </div>
                                    <div class="item">
                                        <div>纬度:</div>
                                        <div>{{ dataPopup.position[1] }}</div>
                                        <div>备注:</div>
                                        <div>{{ dataPopup.MEMO }}</div>
                                    </div>
                                </div>
                                <div v-show="currentBtn == '出警信息'" 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>
@@ -76,8 +114,17 @@
<script>
import { mapGetters } from 'vuex'
import { getActAsPoliceList } from "@/api/home/index.js"
export default {
    name: 'mapPopup',
    data () {
        return {
            currentBtn: '接警信息',
            CJdata: {}
        }
    },
    computed: {
        ...mapGetters([
            'detailsPopup',
@@ -86,7 +133,20 @@
    },
    methods: {
        closePopup () {
            this.currentBtn = '接警信息'
            this.$store.commit('SET_DETAILSPOPUP', false)
        },
        currentBtnChange (type) {
            this.currentBtn = type
            getActAsPoliceList(this.dataPopup.JJDBH, '').then(res => {
                console.log(res, 999999)
                // this.CJdata = res.data.result
            })
        },
        popupDetailShow () {
            this.$EventBus.$emit('policeSituationSiteClick', this.dataPopup)
        }
    }
}
@@ -124,7 +184,7 @@
.divForms .area {
    position: relative;
    min-width: 420px;
    min-width: 360px;
}
.divForms-wrap {
@@ -220,12 +280,13 @@
        }
        &>div.on {
            border-bottom: 2px solid #1831a7;
            color: #3d95f3;
            border-bottom: 2px solid #3d95f3;
        }
    }
    .label-content {
        padding: 4px 0;
        padding: 10px 0;
        .item {
            display: flex;
@@ -237,7 +298,7 @@
            text-align: left;
            &>div:first-child {
                width: 96px;
                width: 112px;
                text-align: justify;
                display: inline-block;
                text-align-last: justify;
@@ -260,10 +321,22 @@
    height: 36px;
    line-height: 36px;
    .details-btn {
        position: absolute;
        top: 0;
        right: 28px;
        height: 100%;
        cursor: pointer;
    }
    .details-btn:hover {
        color: #3d95f3;
    }
    .close {
        position: absolute;
        right: 5px;
        top: -2px;
        top: 0;
    }
    .close::before {