shuishen
2023-04-12 195665843d5c19f6ff28c33c07c71ffd889fbd70
首页饼图滚动
1 files modified
75 ■■■■■ changed files
src/views/home/components/leftContainer.vue 75 ●●●●● patch | view | raw | blame | history
src/views/home/components/leftContainer.vue
@@ -8,7 +8,8 @@
                    </div>
                </div>
                <el-main v-loading="personEchartsLoading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)"
                    style="height: calc(100% - 17.6%);">
                    <div class="sub-tab" v-show="peopletype == 0">
                        <div class="tab" :class="{ 'select-on-tab': tabType == 0 }" @click="personTabClick(0)">
                            <div class="tab-title-small">户籍人口:</div>
@@ -28,10 +29,14 @@
                        </div>
                    </div>
                    <div id="PersonEcharts" class="echarts-box">
                    <div class="echarts-box" style="overflow-y: auto;" ref="REFPERSONECHARTS">
                        <div id="PersonEcharts" :style="{ height: personEchartsHeight }">
                        </div>
                    </div>
                </el-main>
                <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0 && showBack" @click="backBegin">
                </div>
@@ -41,10 +46,10 @@
                <defs>
                    <path id="border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                        d="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z"
                                                                                                                                                                                                        c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
                                                                                                                                                                                                        c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
                                                                                                                                                                                                        c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
                                                                                                                                                                                                        c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z"
                        fill="transparent" />
                    <radialGradient id="border-box-8-gradient-974b4d7cfafa444396861ca1d1173c8c" cx="50%" cy="50%" r="50%">
                        <stop offset="0%" stop-color="#fff" stop-opacity="1" />
@@ -54,10 +59,10 @@
                        <circle cx="0" cy="0" r="150" fill="url(#border-box-8-gradient-974b4d7cfafa444396861ca1d1173c8c)">
                            <animateMotion dur="8s"
                                path="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z"
                                                                                                                                                                                                                c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
                                                                                                                                                                                                                c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
                                                                                                                                                                                                                c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
                                                                                                                                                                                                                c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z"
                                rotate="auto" repeatCount="indefinite" />
                        </circle>
                    </mask>
@@ -182,6 +187,7 @@
            // 记录当前选中派出所的ID
            policeStaionID: '',
            peopleLoading: false,
            personEchartsHeight: '100%'
        }
    },
@@ -326,6 +332,8 @@
            this.disposeEchart()
            if (type == 0) {
                this.personEchartsHeight = '100%'
                if (this.userInfo.dept_id == '1123598813738675201' && this.policeStaionID == '') {
                    this.getPoliceStationInfo()
@@ -336,8 +344,6 @@
                }
            } else if (type == 1) {
                this.initkeyPersonEcharts()
            }
        },
@@ -898,10 +904,8 @@
        async initkeyPersonEcharts () {
            this.disposeEchart()
            var chartDom = document.getElementById('PersonEcharts')
            keyPersonmyChart = this.$echarts.init(chartDom)
            let personInfo = await this.getPersonInfo()
            keyPeopleDataLength = personInfo.length
            if (this.userInfo.dept_id == '1596020515064381442') {
                personInfo = [
@@ -912,16 +916,30 @@
                    { count: 1, name: '欠薪讨债群体', value: 1 }]
            }
            keyPersonmyChart.setOption(this.initkeyPersonOption(personInfo))
            const high = this.$refs.REFPERSONECHARTS.offsetHeight
            this.clickkeyPersonChart()
            if (personInfo.length > 1) {
                this.keyPeopleEchartsCarousel()
            if (personInfo.length * (high / 7) > high) {
                this.personEchartsHeight = personInfo.length * (high / 7) + 'px'
            } else {
                clearInterval(timer)
                keyPersonmyChart.off("mouseover")
                keyPersonmyChart.off("mouseout")
                this.personEchartsHeight = '100%'
            }
            this.$nextTick(() => {
                var chartDom = document.getElementById('PersonEcharts')
                keyPersonmyChart = this.$echarts.init(chartDom)
                keyPersonmyChart.setOption(this.initkeyPersonOption(personInfo))
                this.clickkeyPersonChart()
                if (personInfo.length > 1) {
                    this.keyPeopleEchartsCarousel()
                } else {
                    clearInterval(timer)
                    keyPersonmyChart.off("mouseover")
                    keyPersonmyChart.off("mouseout")
                }
            })
            setTimeout(() => {
                this.personEchartsLoading = false
            }, 500)
@@ -992,15 +1010,15 @@
                        confine: true
                    },
                    legend: {
                        type: 'scroll',
                        orient: 'vertical',
                        top: 'middle',
                        left: '45%',
                        right: '5%',
                        y: '1%',
                        itemGap: 15,
                        textStyle: {
                            color: '#fff'
                        },
                        align: 'left',
                        formatter: function (name) {
                            let data = dataArr
                            let tarValue
@@ -1015,10 +1033,11 @@
                    },
                    series: [
                        {
                            name: '',
                            top: 140,
                            left: 90,
                            type: 'pie',
                            radius: ['30%', '60%'],
                            center: ['22%', '55%'],
                            radius: [30, 60],
                            center: [0, 0],
                            avoidLabelOverlap: false,
                            label: {
                                show: false,