1

guanqb

2022-11-12 e438e52d71f081c8bc8d8914174d635bfc2cec88

1

 src/views/home/components/leftContainer.vue

@@ -3,9 +3,16 @@
        <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 == 1 }" @click="peopleTabClick(1)">重点人员</span>
                    <span
                        class="peopleTap"
                        :class="{ choosed: peopletype == 0 }"
                        @click="peopleTabClick(0)"
                    >现有人员</span>/
                    <span
                        class="peopleTap"
                        :class="{ choosed: peopletype == 1 }"
                        @click="peopleTabClick(1)"
                    >重点人员</span>
                </div>
                <div>
                    共
@@ -28,7 +35,12 @@
                </div>
            </div>
            <div id="PersonEcharts" class="echarts-box"></div>
            <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin"></div>
            <div
                class="back"
                title="返回上一级"
                v-show="dataDeep == 2 && peopletype == 0"
                @click="backBegin"
            ></div>
        </div>
        <div class="house-box">
            <div class="title">现有房屋</div>
@@ -247,6 +259,32 @@
                    {
                        data: yDate,
                        type: 'bar',
                        barWidth: '40%',
                        itemStyle: {
                            normal: {
                                color: function (params) {

                                    return new global.echarts.graphic.LinearGradient(
                                        0, 0, 0, 1,
                                        [
                                            { offset: 0, color: '#06B5D7' },
                                            { offset: 0.5, color: '#44C0C1' },
                                            { offset: 1, color: '#71C8B1' },
                                        ]
                                    )
                                }
                            },
                            emphasis: {
                                color: new global.echarts.graphic.LinearGradient(
                                    0, 0, 0, 1,
                                    [
                                        { offset: 0, color: '#71C8B1' },
                                        { offset: 0.7, color: '#44C0C1' },
                                        { offset: 1, color: '#06B5D7' }
                                    ]
                                )
                            }
                        },
                    }
                ],
                grid: {
@@ -857,7 +895,7 @@
                color: #fff;
            }

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

                &>div {
                & > div {
                    height: 26px;
                    line-height: 26px;
                }

 src/views/home/components/rightContainer.vue

@@ -4,9 +4,16 @@
            <div class="title">
                案件统计
                <div class="timer">
                    <el-date-picker v-model="eventTime" type="daterange" align="right" unlink-panels range-separator="至"
                        start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
                    </el-date-picker>
                    <el-date-picker
                        v-model="eventTime"
                        type="daterange"
                        align="right"
                        unlink-panels
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </div>
            </div>
            <div id="EventChangeEcharts" class="echarts-box"></div>
@@ -14,15 +21,28 @@
        <div class="alert-box">
            <div class="title">
                <span style="margin-right:130px">安保活动</span>
                <span class="activity" :class="{ choosed: acttype == 0 }" @click="actTabClick(0)">正在进行</span>
                <span
                    class="activity"
                    :class="{ choosed: acttype == 0 }"
                    @click="actTabClick(0)"
                >正在进行</span>
                <span>/</span>
                <span class="activity" :class="{ choosed: acttype == 1 }" @click="actTabClick(1)">历史活动</span>
                <span
                    class="activity"
                    :class="{ choosed: acttype == 1 }"
                    @click="actTabClick(1)"
                >历史活动</span>
            </div>
            <div id="peopleList" class="echarts-box">
                <el-table :data="acttype == 0 ? underwayArr : historyArr" style="width: 100%"
                <el-table
                    :data="acttype == 0 ? underwayArr : historyArr"
                    style="width: 100%"
                    :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                    :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                    :row-class-name="tableRowClassName" ref="activityTable" @row-click="activityRowClick">
                    :row-class-name="tableRowClassName"
                    ref="activityTable"
                    @row-click="activityRowClick"
                >
                    <el-table-column prop="activityName" label="活动名称"></el-table-column>
                    <el-table-column prop="startTime" label="开始时间"></el-table-column>
                    <el-table-column prop="endTime" label="结束时间"></el-table-column>
@@ -33,9 +53,17 @@
        <div class="crowd-box">
            <div class="title">
                <span style="margin-right:130px">现有设备</span>
                <span class="equiment" :class="{ choosed: linetype == 0 }" @click="lineTabClick(0)">在线设备</span>
                <span
                    class="equiment"
                    :class="{ choosed: linetype == 0 }"
                    @click="lineTabClick(0)"
                >在线设备</span>
                <span>/</span>
                <span class="activity" :class="{ choosed: linetype == 1 }" @click="lineTabClick(1)">离线设备</span>
                <span
                    class="activity"
                    :class="{ choosed: linetype == 1 }"
                    @click="lineTabClick(1)"
                >离线设备</span>
            </div>
            <div style="overflow: hidden;" id="EquipmentEcharts" class="echarts-box"></div>
        </div>
@@ -137,7 +165,7 @@
                tooltip: {
                    trigger: 'item',
                    confine: true,
                    formatter: ' <span style="display: inline-block; margin-right: 4px; border-radius: 10px; width: 10px; height: 10px;background-color: #91cc75;"></span> {b0}<strong style="margin-left:10px">{c0}人</strong>'
                    formatter: ' <span style="display: inline-block; margin-right: 4px; border-radius: 10px; width: 10px; height: 10px;background-color: #91cc75;"></span> {b0}<strong style="margin-left:10px">{c0}台</strong><strong style="margin-left:10px;color:#5c7bd9">{d}%</strong>'
                },
                legend: {
                    left: '60%',
@@ -154,7 +182,7 @@
                            }
                        }
                        let v = tarValue
                        return `${name}     ${v} 个    `
                        return `${name}     ${v} 台    `
                    },
                },
                graphic: {
@@ -269,7 +297,8 @@
        initEventChangeOption (seriesData) {
            return {
                tooltip: {
                    trigger: 'item'
                    trigger: 'item',
                    formatter: ' <span style="display: inline-block; margin-right: 4px; border-radius: 10px; width: 10px; height: 10px;background-color: #91cc75;"></span> {b0}<strong style="margin-left:10px;color:#5c7bd9">{c0}起</strong>'
                },
                xAxis: {
                    type: 'category',
@@ -558,7 +587,7 @@
                border: 1px solid rgba(20, 50, 123, 1);
                cursor: pointer;

                &>div {
                & > div {
                    height: 26px;
                    line-height: 26px;
                }