1

shuishen

2022-11-04 1b5c85b0b9fe2c7740d6d4fc3acc479eeadedb86

 src/views/home/components/leftContainer.vue

@@ -3,26 +3,15 @@
        <div class="person-box">
            <div class="title">
                <div>
                    <span
                        class="peopleTap"
                        :class="{ choosed: peopletype == 0 }"
                        @click="peopleTabClick(0)"
                    >现有人员</span>
                    <span class="peopleTap" :class="{ choosed: peopletype == 0 }" @click="peopleTabClick(0)">现有人员</span>
                    /
                    <span
                        class="peopleTap"
                        :class="{ choosed: peopletype == 1 }"
                        @click="peopleTabClick(1)"
                    >重点人员</span>
                    <span class="peopleTap" :class="{ choosed: peopletype == 1 }" @click="peopleTabClick(1)">重点人员</span>
                </div>
                <div>
                    共
                    <span class="peopleNum" :class="{ choosed: peopletype == 0 }">100</span>
                    /
                    <span
                        class="peopleNum"
                        :class="{ choosed: peopletype == 1 }"
                    >1</span>人
                    <span class="peopleNum" :class="{ choosed: peopletype == 1 }">1</span>人
                </div>
            </div>

@@ -41,16 +30,11 @@
                </div>
            </div>

            <div id="PersonEcharts" :class="[peopletype == 0 ? 'echarts-box':'people-table']"></div>
            <div id="PersonEcharts" class="echarts-box"></div>
            <!-- :class="{'people-table' : peopletype == 1 }" -->
            <!-- <div id="keyPersonEcharts" class="people-table" v-show="peopletype == 1"></div> -->

            <div
                class="back"
                title="返回上一级"
                v-show="dataDeep == 2 && peopletype == 0"
                @click="backBegin"
            >
            <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin">
                <i class="el-icon-back"></i>
            </div>
        </div>
@@ -479,23 +463,18 @@

        peopleTabClick (type) {
            this.peopletype = type
            homePersonmyChart.off('click')
            homePersonmyChart.dispose()
            this.$nextTick(() => {
                if (type == 0) {
                    homePersonmyChart.dispose()
                    this.initPersonEcharts()
                    homePersonmyChart.off('click')
                    this.$nextTick(() => {
                        this.clickPeopleChart()
                    })

                    this.clickPeopleChart()
                } else {
                    homePersonmyChart.dispose()
                    this.initkeyPersonEcharts()
                    homePersonmyChart.off('click')
                    this.$nextTick(() => {
                        this.clickkeyPersonChart()
                    })
                    this.clickkeyPersonChart()
                }

                homePersonmyChart.resize()
            })
        },

@@ -828,13 +807,6 @@
            margin-left: 108px;
        }

        .people-table {
            height: calc(100% - 40px);
            height: 250px;
            width: 400px;
            overflow: hidden;
        }

        .back {
            color: #fff;
            position: absolute;
@@ -891,7 +863,8 @@
            .choosed {
                color: #fff;
            }
            & > div:nth-of-type(2) {

            &>div:nth-of-type(2) {
                font-size: 14px;
            }
        }
@@ -912,7 +885,7 @@
                border: 1px solid rgba(20, 50, 123, 1);
                cursor: pointer;

                & > div {
                &>div {
                    height: 26px;
                    line-height: 26px;
                }
@@ -926,10 +899,9 @@
        .echarts-box {
            flex: 1;
            width: 100%;
            height: calc(100% - 104px);
        }

        .sub-tab + .echarts-box {
        .sub-tab+.echarts-box {
            margin-top: 10px;
        }
    }