重点人员饼图tooltip轮播

guanqb

2023-04-04 bb572714dc0aef40891c542ec28dcbc2219b2e70

 src/views/home/components/bottomContainer.vue

@@ -57,7 +57,7 @@
                </ul>

                <!-- <vue-seamless-scroll v-if="policeSituationRealtimeArr.length > 0" :data="policeSituationRealtimeArr"
                            class="warp" :class-option="classOption"> -->
                                class="warp" :class-option="classOption"> -->
                <div v-if="policeSituationRealtimeArr.length > 0" :data="policeSituationRealtimeArr" class="warp"
                    :class-option="classOption">
                    <el-carousel indicator-position="none" direction="vertical" @change="changeAlarm">
@@ -85,7 +85,7 @@

                <!-- </vue-seamless-scroll> -->

                <div class="warp no-data" v-else>暂无数据</div>
                <div class="warp no-data" v-else>暂无警情数据</div>
            </div>

            <div class="current-table-body" ref="ElTableBox" v-if="historytype == 1">
@@ -160,7 +160,7 @@
export default {
    inject: ["getWidth", 'userInfo'],

    data() {
    data () {
        return {
            alarmPageCount: 1,
            alarmPageSize: 6,
@@ -182,7 +182,7 @@
            pickerOptions: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                    onClick (picker) {
                        const end = new Date()
                        const start = new Date()
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
@@ -190,7 +190,7 @@
                    }
                }, {
                    text: '最近一个月',
                    onClick(picker) {
                    onClick (picker) {
                        const end = new Date()
                        const start = new Date()
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
@@ -198,7 +198,7 @@
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                    onClick (picker) {
                        const end = new Date()
                        const start = new Date()
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
@@ -223,7 +223,7 @@
    //     vueSeamlessScroll
    // },

    created() {
    created () {
        this.getHomeAllData()

        this.defaultDate()
@@ -231,7 +231,7 @@
        // disabledDate 为true表示不可选,false表示可选
        this.pickerOptions = {
            ...this.pickerOptions,
            disabledDate(time) {
            disabledDate (time) {
                // 设置可选择的日期为今天之后的一个月内
                let curDate = (new Date()).getTime()
                return time.getTime() > curDate
@@ -241,7 +241,7 @@
        window.addEventListener('resize', this.setTableHeight)
    },

    mounted() {
    mounted () {
        if (this.getWidth() > 7000) {
            this.classOption.step = 8
        }
@@ -252,14 +252,14 @@
         * @description: 获取当前组件内所有数据
         * @return {*}
         */
        getHomeAllData(id = '') {
        getHomeAllData (id = '') {
            this.policeStaionID = id

            this.historyTabClick(0)
        },

        // 获取table高度
        setTableHeight() {
        setTableHeight () {
            this.$nextTick(() => {
                if (this.$refs.ElTableBox && this.$refs.ElPagination) {
                    this.currentTableHeight = this.$refs.ElTableBox.offsetHeight - this.$refs.ElPagination.offsetHeight
@@ -268,7 +268,7 @@
        },

        // table行点击事件
        rowClick(row) {
        rowClick (row) {
            this.policeSituationClick(row)
        },

@@ -295,10 +295,10 @@
            }

        },
        


        // 设置默认时间
        defaultDate() {
        defaultDate () {
            var current = new Date()

            var seven = new Date(current.getTime() - 7 * 24 * 60 * 60 * 1000)
@@ -307,7 +307,7 @@
        },

        // 时间改变事件
        datePickerChange(e) {
        datePickerChange (e) {
            // this.timetype
            this.currentPage = 1

@@ -331,7 +331,7 @@
        },

        // 获取当前日期
        dateFormat(dateData) {
        dateFormat (dateData) {
            var date = new Date(dateData)
            var y = date.getFullYear()
            var m = date.getMonth() + 1
@@ -343,31 +343,31 @@
        },

        //  走马灯改变事件
        changeAlarm(index){
            index = index+1 ;
        changeAlarm (index) {
            index = index + 1
            // 改变数据
            this.alarmDataHanlder(index);
            this.alarmDataHanlder(index)
        },

        // 获取实时接警记录
        getAnswerPolices() {
        getAnswerPolices () {

            getAnswerPolices({ deptId: this.policeStaionID != '' ? this.policeStaionID : this.userInfo.dept_id }).then(res => {
                this.policeSituationRealtimeArr = []

                if (res.data && res.data.length) {
                     // 计算页数
                    this.alarmPageCount = Math.ceil(res.data.length/this.alarmPageSize)
                    // 计算页数
                    this.alarmPageCount = Math.ceil(res.data.length / this.alarmPageSize)
                    this.policeSituationRealtimeAllArr = res.data.map((item, index) => {
                        return { ...item, index: index + 1, lng: item.ZDDWXZB, lat: item.ZDDWYZB, position: item.ZDDWYZB && item.ZDDWYZB != 0 ? '有' : '无' }
                    })
                    // 数据处理
                    this.alarmDataHanlder(1);
                    this.alarmDataHanlder(1)
                } else {
                    this.alarmPageCount = 1;
                    this.alarmPageCount = 1
                    this.policeSituationRealtimeArr = []
                }
                

                this.$emit('policeSituationChange')
            })

@@ -458,7 +458,7 @@
            // this.policeSituationRealtimeAllArr = arr.map((item, index) => {
            //     return { ...item, index: index + 1, lng: item.ZDDWXZB, lat: item.ZDDWYZB, position: item.ZDDWYZB ? '有' : '无' }
            // })
            

            // // 数据处理
            // this.alarmDataHanlder(1);
            // this.$emit('policeSituationChange')
@@ -468,21 +468,21 @@
         * 实时警情数据处理（滚动）
         * @param {*} index 
         */
        alarmDataHanlder(index){
        alarmDataHanlder (index) {
            this.policeSituationRealtimeArr = []
            //计算序号
            var start =  (index-1)*this.alarmPageSize
            var end =  index*this.alarmPageSize
            var start = (index - 1) * this.alarmPageSize
            var end = index * this.alarmPageSize
            // 获取第 index 页数据
            this.policeSituationRealtimeAllArr.forEach((item, index) => {
                if(index<Number(end) && index>=Number(start)){
                if (index < Number(end) && index >= Number(start)) {
                    this.policeSituationRealtimeArr.push(item)
                }
            })
        },

        // 获取历史接警记录
        getAlarmList(params) {
        getAlarmList (params) {
            getAlarmList({ ...params, size: this.pagesize, jjdwbh: this.policeStaionID != '' ? this.policeStaionID : this.userInfo.dept_id }).then(res => {
                this.pagesCount = res.data.data.pages

@@ -589,7 +589,7 @@
        },

        // 周月选择
        timeTabClick(type) {
        timeTabClick (type) {
            this.timetype = type

            this.currentPage = 1
@@ -616,7 +616,7 @@
        },

        // 实时历史选择
        async historyTabClick(type) {
        async historyTabClick (type) {
            console.log('historyTabClick')
            this.historytype = type

@@ -651,16 +651,16 @@

        },

        chooseRealData() {
        chooseRealData () {
            return this.policeSituationRealtimeArr
        },

        chooseTimeDate() {
        chooseTimeDate () {
            return this.policeSituationHistoryArr
        },

        // 列表行选择
        handleSelectClick(e) {
        handleSelectClick (e) {
            let element
            for (let i = 0; i < e.path.length; i++) {
                if (e.path[i].className == "row") {
@@ -675,7 +675,7 @@
        },

        // 点击定位或者显示弹窗
        policeSituationClick(item) {
        policeSituationClick (item) {
            if (item.ZDDWXZB && item.ZDDWXZB != 0 && item.ZDDWYZB && item.ZDDWYZB != 0) {
                this.$EventBus.$emit('toPosition', {
                    layerName: 'policeSituationyLayers',
@@ -708,7 +708,7 @@
        }
    },

    destroyed() {
    destroyed () {
        window.removeEventListener('resize', this.setTableHeight)

        if (alarmTiming != null) {