首页echarts图在线切换

guanqb

2022-11-10 50b8ab230302a90dcefbbd18bb42cef8ce2b0c26

首页echarts图在线切换

 src/assets/data/equimentsDate/car.js

New file
@@ -0,0 +1,22 @@
export default [
    { 'carID': '#11111', 'carType': '大众', 'policeStation': '车站派出所', 'area': '责任区1', 'state': '在线' },
    { 'carID': '#22222', 'carType': '宝马', 'policeStation': '车站派出所', 'area': '责任区1', 'state': '离线' },
    { 'carID': '#33333', 'carType': '奔驰', 'policeStation': '车站派出所', 'area': '责任区2', 'state': '在线' },
    { 'carID': '#44444', 'carType': '红旗', 'policeStation': '车站派出所', 'area': '责任区2', 'state': '离线' },
    { 'carID': '#55555', 'carType': '大众', 'policeStation': '沙溪派出所', 'area': '责任区1', 'state': '在线' },
    { 'carID': '#66666', 'carType': '宝马', 'policeStation': '沙溪派出所', 'area': '责任区1', 'state': '离线' },
    { 'carID': '#77777', 'carType': '奔驰', 'policeStation': '沙溪派出所', 'area': '责任区2', 'state': '离线' },
    { 'carID': '#88888', 'carType': '红旗', 'policeStation': '沙溪派出所', 'area': '责任区2', 'state': '离线' },
    { 'carID': '*99911', 'carType': '大众', 'policeStation': '北门派出所', 'area': '责任区1', 'state': '在线' },
    { 'carID': '*99922', 'carType': '宝马', 'policeStation': '北门派出所', 'area': '责任区1', 'state': '离线' },
    { 'carID': '*99933', 'carType': '奔驰', 'policeStation': '北门派出所', 'area': '责任区2', 'state': '在线' },
    { 'carID': '*99944', 'carType': '红旗', 'policeStation': '北门派出所', 'area': '责任区2', 'state': '离线' },
    { 'carID': '*99955', 'carType': '大众', 'policeStation': '灵溪派出所', 'area': '责任区1', 'state': '离线' },
    { 'carID': '*99966', 'carType': '宝马', 'policeStation': '灵溪派出所', 'area': '责任区1', 'state': '离线' },
    { 'carID': '*99977', 'carType': '奔驰', 'policeStation': '灵溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'carID': '*99988', 'carType': '红旗', 'policeStation': '灵溪派出所', 'area': '责任区2', 'state': '离线' },
    { 'carID': '#11***', 'carType': '大众', 'policeStation': '江光派出所', 'area': '责任区1', 'state': '在线' },
    { 'carID': '#22***', 'carType': '宝马', 'policeStation': '江光派出所', 'area': '责任区1', 'state': '离线' },
    { 'carID': '#33***', 'carType': '奔驰', 'policeStation': '江光派出所', 'area': '责任区2', 'state': '在线' },
    { 'carID': '#44***', 'carType': '红旗', 'policeStation': '江光派出所', 'area': '责任区2', 'state': '离线' }
]

 src/assets/data/equimentsDate/phone.js

New file
@@ -0,0 +1,22 @@
export default [
    { 'phoneID': '188XXX11111', 'phoneType': '魅族', 'policeStation': '车站派出所', 'area': '责任区1', 'state': '在线' },
    { 'phoneID': '188XXX22222', 'phoneType': '华为', 'policeStation': '车站派出所', 'area': '责任区1', 'state': '离线' },
    { 'phoneID': '188XXX33333', 'phoneType': '一加', 'policeStation': '车站派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '188XXX44444', 'phoneType': '华为', 'policeStation': '车站派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '188XXX55555', 'phoneType': '三星', 'policeStation': '沙溪派出所', 'area': '责任区1', 'state': '在线' },
    { 'phoneID': '188XXX66666', 'phoneType': '华为', 'policeStation': '沙溪派出所', 'area': '责任区1', 'state': '离线' },
    { 'phoneID': '188XXX77777', 'phoneType': '小米', 'policeStation': '沙溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '188XXX88888', 'phoneType': '华为', 'policeStation': '沙溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '133XXX11111', 'phoneType': '魅族', 'policeStation': '北门派出所', 'area': '责任区1', 'state': '在线' },
    { 'phoneID': '133XXX22222', 'phoneType': '华为', 'policeStation': '北门派出所', 'area': '责任区1', 'state': '离线' },
    { 'phoneID': '133XXX33333', 'phoneType': '一加', 'policeStation': '北门派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '133XXX44444', 'phoneType': '华为', 'policeStation': '北门派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '133XXX55555', 'phoneType': '三星', 'policeStation': '灵溪派出所', 'area': '责任区1', 'state': '在线' },
    { 'phoneID': '133XXX66666', 'phoneType': '华为', 'policeStation': '灵溪派出所', 'area': '责任区1', 'state': '离线' },
    { 'phoneID': '133XXX77777', 'phoneType': '小米', 'policeStation': '灵溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '133XXX88888', 'phoneType': '华为', 'policeStation': '灵溪派出所', 'area': '责任区2', 'state': '离线' },
    { 'phoneID': '175XXX11111', 'phoneType': '魅族', 'policeStation': '江光派出所', 'area': '责任区1', 'state': '在线' },
    { 'phoneID': '175XXX22222', 'phoneType': '华为', 'policeStation': '江光派出所', 'area': '责任区1', 'state': '在线' },
    { 'phoneID': '175XXX33333', 'phoneType': '一加', 'policeStation': '江光派出所', 'area': '责任区2', 'state': '在线' },
    { 'phoneID': '175XXX44444', 'phoneType': '华为', 'policeStation': '江光派出所', 'area': '责任区2', 'state': '离线' }
]

 src/assets/data/equimentsDate/recorder.js

New file
@@ -0,0 +1,22 @@
export default [
    { 'recorderID': 'ABC111', 'recorderType': '爱国', 'policeStation': '车站派出所', 'area': '责任区1', 'state': '在线' },
    { 'recorderID': 'ABC222', 'recorderType': '百步', 'policeStation': '车站派出所', 'area': '责任区1', 'state': '在线' },
    { 'recorderID': 'ABC333', 'recorderType': '飞利', 'policeStation': '车站派出所', 'area': '责任区2', 'state': '在线' },
    { 'recorderID': 'ABC444', 'recorderType': '途强', 'policeStation': '车站派出所', 'area': '责任区2', 'state': '离线' },
    { 'recorderID': 'ABC555', 'recorderType': '鹰眼', 'policeStation': '沙溪派出所', 'area': '责任区1', 'state': '在线' },
    { 'recorderID': 'ABC666', 'recorderType': '致业', 'policeStation': '沙溪派出所', 'area': '责任区1', 'state': '离线' },
    { 'recorderID': 'ABC777', 'recorderType': '联想', 'policeStation': '沙溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'recorderID': 'ABC888', 'recorderType': '高新', 'policeStation': '沙溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'recorderID': 'FFF111', 'recorderType': '爱国', 'policeStation': '北门派出所', 'area': '责任区1', 'state': '在线' },
    { 'recorderID': 'FFF222', 'recorderType': '百步', 'policeStation': '北门派出所', 'area': '责任区1', 'state': '离线' },
    { 'recorderID': 'FFF333', 'recorderType': '飞利', 'policeStation': '北门派出所', 'area': '责任区2', 'state': '在线' },
    { 'recorderID': 'FFF444', 'recorderType': '途强', 'policeStation': '北门派出所', 'area': '责任区2', 'state': '离线' },
    { 'recorderID': 'FFF555', 'recorderType': '鹰眼', 'policeStation': '灵溪派出所', 'area': '责任区1', 'state': '在线' },
    { 'recorderID': 'FFF666', 'recorderType': '致业', 'policeStation': '灵溪派出所', 'area': '责任区1', 'state': '离线' },
    { 'recorderID': 'FFF777', 'recorderType': '联想', 'policeStation': '灵溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'recorderID': 'FFF888', 'recorderType': '高新', 'policeStation': '灵溪派出所', 'area': '责任区2', 'state': '在线' },
    { 'recorderID': 'GGG111', 'recorderType': '爱国', 'policeStation': '江光派出所', 'area': '责任区1', 'state': '在线' },
    { 'recorderID': 'GGG222', 'recorderType': '百步', 'policeStation': '江光派出所', 'area': '责任区1', 'state': '离线' },
    { 'recorderID': 'GGG333', 'recorderType': '飞利', 'policeStation': '江光派出所', 'area': '责任区2', 'state': '在线' },
    { 'recorderID': 'GGG444', 'recorderType': '途强', 'policeStation': '江光派出所', 'area': '责任区2', 'state': '离线' },
]

 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="活动名称" width="100"></el-table-column>
                    <el-table-column prop="startTime" label="开始时间" width="100"></el-table-column>
                    <el-table-column prop="endTime" label="结束时间" width="100"></el-table-column>
@@ -32,8 +52,18 @@
        </div>
        <div class="crowd-box">
            <div class="title">
                现有设备
                <span class="regionTotal">{{ regionTotal }}个</span>
                <span style="margin-right:130px">现有设备</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>
            </div>
            <div id="EquipmentEcharts" class="echarts-box"></div>
        </div>
@@ -46,6 +76,9 @@

import historyArr from '@/assets/data/activitysData/history.js'
import underwayArr from '@/assets/data/activitysData/underway.js'
import carArr from '@/assets/data/equimentsDate/car.js'
import phoneArr from '@/assets/data/equimentsDate/phone.js'
import recorderArr from '@/assets/data/equimentsDate/recorder.js'

export default {
    data () {
@@ -80,77 +113,17 @@
            },
            regionTotal: 0,
            acttype: 0,
            linetype: 0,
            timetype: 0,
            underwayArr: [],
            historyArr: [],
            carArr: [
                { 'carID': '#11111', 'carType': '大众', 'policeStation': '车站派出所', 'area': '责任区1' },
                { 'carID': '#22222', 'carType': '宝马', 'policeStation': '车站派出所', 'area': '责任区1' },
                { 'carID': '#33333', 'carType': '奔驰', 'policeStation': '车站派出所', 'area': '责任区2' },
                { 'carID': '#44444', 'carType': '红旗', 'policeStation': '车站派出所', 'area': '责任区2' },
                { 'carID': '#55555', 'carType': '大众', 'policeStation': '沙溪派出所', 'area': '责任区1' },
                { 'carID': '#66666', 'carType': '宝马', 'policeStation': '沙溪派出所', 'area': '责任区1' },
                { 'carID': '#77777', 'carType': '奔驰', 'policeStation': '沙溪派出所', 'area': '责任区2' },
                { 'carID': '#88888', 'carType': '红旗', 'policeStation': '沙溪派出所', 'area': '责任区2' },
                { 'carID': '*99911', 'carType': '大众', 'policeStation': '北门派出所', 'area': '责任区1' },
                { 'carID': '*99922', 'carType': '宝马', 'policeStation': '北门派出所', 'area': '责任区1' },
                { 'carID': '*99933', 'carType': '奔驰', 'policeStation': '北门派出所', 'area': '责任区2' },
                { 'carID': '*99944', 'carType': '红旗', 'policeStation': '北门派出所', 'area': '责任区2' },
                { 'carID': '*99955', 'carType': '大众', 'policeStation': '灵溪派出所', 'area': '责任区1' },
                { 'carID': '*99966', 'carType': '宝马', 'policeStation': '灵溪派出所', 'area': '责任区1' },
                { 'carID': '*99977', 'carType': '奔驰', 'policeStation': '灵溪派出所', 'area': '责任区2' },
                { 'carID': '*99988', 'carType': '红旗', 'policeStation': '灵溪派出所', 'area': '责任区2' },
                { 'carID': '#11***', 'carType': '大众', 'policeStation': '江光派出所', 'area': '责任区1' },
                { 'carID': '#22***', 'carType': '宝马', 'policeStation': '江光派出所', 'area': '责任区1' },
                { 'carID': '#33***', 'carType': '奔驰', 'policeStation': '江光派出所', 'area': '责任区2' },
                { 'carID': '#44***', 'carType': '红旗', 'policeStation': '江光派出所', 'area': '责任区2' }
            ],
            phoneArr: [
                { 'phoneID': '188XXX11111', 'phoneType': '魅族', 'policeStation': '车站派出所', 'area': '责任区1' },
                { 'phoneID': '188XXX22222', 'phoneType': '华为', 'policeStation': '车站派出所', 'area': '责任区1' },
                { 'phoneID': '188XXX33333', 'phoneType': '一加', 'policeStation': '车站派出所', 'area': '责任区2' },
                { 'phoneID': '188XXX44444', 'phoneType': '华为', 'policeStation': '车站派出所', 'area': '责任区2' },
                { 'phoneID': '188XXX55555', 'phoneType': '三星', 'policeStation': '沙溪派出所', 'area': '责任区1' },
                { 'phoneID': '188XXX66666', 'phoneType': '华为', 'policeStation': '沙溪派出所', 'area': '责任区1' },
                { 'phoneID': '188XXX77777', 'phoneType': '小米', 'policeStation': '沙溪派出所', 'area': '责任区2' },
                { 'phoneID': '188XXX88888', 'phoneType': '华为', 'policeStation': '沙溪派出所', 'area': '责任区2' },
                { 'phoneID': '133XXX11111', 'phoneType': '魅族', 'policeStation': '北门派出所', 'area': '责任区1' },
                { 'phoneID': '133XXX22222', 'phoneType': '华为', 'policeStation': '北门派出所', 'area': '责任区1' },
                { 'phoneID': '133XXX33333', 'phoneType': '一加', 'policeStation': '北门派出所', 'area': '责任区2' },
                { 'phoneID': '133XXX44444', 'phoneType': '华为', 'policeStation': '北门派出所', 'area': '责任区2' },
                { 'phoneID': '133XXX55555', 'phoneType': '三星', 'policeStation': '灵溪派出所', 'area': '责任区1' },
                { 'phoneID': '133XXX66666', 'phoneType': '华为', 'policeStation': '灵溪派出所', 'area': '责任区1' },
                { 'phoneID': '133XXX77777', 'phoneType': '小米', 'policeStation': '灵溪派出所', 'area': '责任区2' },
                { 'phoneID': '133XXX88888', 'phoneType': '华为', 'policeStation': '灵溪派出所', 'area': '责任区2' },
                { 'phoneID': '175XXX11111', 'phoneType': '魅族', 'policeStation': '江光派出所', 'area': '责任区1' },
                { 'phoneID': '175XXX22222', 'phoneType': '华为', 'policeStation': '江光派出所', 'area': '责任区1' },
                { 'phoneID': '175XXX33333', 'phoneType': '一加', 'policeStation': '江光派出所', 'area': '责任区2' },
                { 'phoneID': '175XXX44444', 'phoneType': '华为', 'policeStation': '江光派出所', 'area': '责任区2' }
            ],
            recorderArr: [
                { 'recorderID': 'ABC111', 'recorderType': '爱国者', 'policeStation': '车站派出所', 'area': '责任区1' },
                { 'recorderID': 'ABC222', 'recorderType': '百步通', 'policeStation': '车站派出所', 'area': '责任区1' },
                { 'recorderID': 'ABC333', 'recorderType': '飞利浦', 'policeStation': '车站派出所', 'area': '责任区2' },
                { 'recorderID': 'ABC444', 'recorderType': '途强', 'policeStation': '车站派出所', 'area': '责任区2' },
                { 'recorderID': 'ABC555', 'recorderType': '执法鹰眼', 'policeStation': '沙溪派出所', 'area': '责任区1' },
                { 'recorderID': 'ABC666', 'recorderType': '致业', 'policeStation': '沙溪派出所', 'area': '责任区1' },
                { 'recorderID': 'ABC777', 'recorderType': '联想', 'policeStation': '沙溪派出所', 'area': '责任区2' },
                { 'recorderID': 'ABC888', 'recorderType': '高新兴', 'policeStation': '沙溪派出所', 'area': '责任区2' },
                { 'recorderID': 'FFF111', 'recorderType': '爱国者', 'policeStation': '北门派出所', 'area': '责任区1' },
                { 'recorderID': 'FFF222', 'recorderType': '百步通', 'policeStation': '北门派出所', 'area': '责任区1' },
                { 'recorderID': 'FFF333', 'recorderType': '飞利浦', 'policeStation': '北门派出所', 'area': '责任区2' },
                { 'recorderID': 'FFF444', 'recorderType': '途强', 'policeStation': '北门派出所', 'area': '责任区2' },
                { 'recorderID': 'FFF555', 'recorderType': '执法鹰眼', 'policeStation': '灵溪派出所', 'area': '责任区1' },
                { 'recorderID': 'FFF666', 'recorderType': '致业', 'policeStation': '灵溪派出所', 'area': '责任区1' },
                { 'recorderID': 'FFF777', 'recorderType': '联想', 'policeStation': '灵溪派出所', 'area': '责任区2' },
                { 'recorderID': 'FFF888', 'recorderType': '高新兴', 'policeStation': '灵溪派出所', 'area': '责任区2' },
                { 'recorderID': 'GGG111', 'recorderType': '爱国者', 'policeStation': '江光派出所', 'area': '责任区1' },
                { 'recorderID': 'GGG222', 'recorderType': '百步通', 'policeStation': '江光派出所', 'area': '责任区1' },
                { 'recorderID': 'GGG333', 'recorderType': '飞利浦', 'policeStation': '江光派出所', 'area': '责任区2' },
                { 'recorderID': 'GGG444', 'recorderType': '途强', 'policeStation': '江光派出所', 'area': '责任区2' },
            ],
            policeName: '全部',
            phoneNewArr: [],
            carNewArr: [],
            recorderNewArr: [],
        }
    },

    mounted () {
        this.initEquipmentEcharts()
        this.initEventChangeEcharts()
@@ -167,6 +140,11 @@
            this.$refs.activityTable.bodyWrapper.scrollTop = 0
            this.$emit('changeActivityType', type)
            this.$emit('activityChange')
        },

        lineTabClick (type) {
            this.linetype = type
            equipmentmyChart.setOption(this.initEquipmentOptions(this.getEquimentChartData(this.policeName)), true)
        },

        echartsResize () {
@@ -202,6 +180,29 @@
                        let v = tarValue
                        return `${name}     ${v} 个    `
                    },
                },
                graphic: {
                    type: "text",
                    left: "16.5%",
                    top: "45%",
                    style: {
                        text: "设备总数",
                        textAlign: "center",
                        fill: "#fff",
                        fontSize: 20,
                        fontWeight: 700
                    }
                },
                title: {
                    text: `${this.regionTotal}`,
                    left: "22%",
                    top: "56%",
                    textStyle: {
                        color: "#27D9C8",
                        fontSize: 22,
                        fontWeight: 700,
                        align: "center"
                    }
                },
                series: [
                    {
@@ -287,11 +288,11 @@
                if (params.name == '摄像头') {
                    this.$emit('showequimentdetail', params.name, true, false, [false, false, false], [])
                } else if (params.name == '手台') {
                    this.$emit('showequimentdetail', params.name, false, true, [false, false, true], this.phoneArr)
                    this.$emit('showequimentdetail', params.name, false, true, [false, false, true], this.phoneNewArr)
                } else if (params.name == '车辆') {
                    this.$emit('showequimentdetail', params.name, false, true, [false, true, false], this.carArr)
                    this.$emit('showequimentdetail', params.name, false, true, [false, true, false], this.carNewArr)
                } else if (params.name == '执法记录仪') {
                    this.$emit('showequimentdetail', params.name, false, true, [true, false, false], this.recorderArr)
                    this.$emit('showequimentdetail', params.name, false, true, [true, false, false], this.recorderNewArr)
                }
            })
        },
@@ -317,6 +318,7 @@
                this.historyArr = historyArr
            }
            equipmentmyChart.setOption(this.initEquipmentOptions(this.getEquimentChartData(police)), true)
            this.policeName = police
        },

        selectPoliceChangeEventData (police) {
@@ -351,15 +353,51 @@
            let carCount = 0
            let recorderCount = 0
            let monitor = 0
            this.phoneNewArr = []
            this.carNewArr = []
            this.recorderNewArr = []
            if (this.linetype == 0) {
                phoneArr.forEach(item => {
                    if (item.state == '在线') {
                        this.phoneNewArr.push(item)
                    }
                })
                carArr.forEach(item => {
                    if (item.state == '在线') {
                        this.carNewArr.push(item)
                    }
                })
                recorderArr.forEach(item => {
                    if (item.state == '在线') {
                        this.recorderNewArr.push(item)
                    }
                })
            } else {
                phoneArr.forEach(item => {
                    if (item.state == '离线') {
                        this.phoneNewArr.push(item)
                    }
                })
                carArr.forEach(item => {
                    if (item.state == '离线') {
                        this.carNewArr.push(item)
                    }
                })
                recorderArr.forEach(item => {
                    if (item.state == '离线') {
                        this.recorderNewArr.push(item)
                    }
                })
            }
            if (policeStationName == '全部') {
                phoneCount = this.phoneArr.length
                carCount = this.carArr.length
                recorderCount = this.recorderArr.length
                phoneCount = this.phoneNewArr.length
                carCount = this.carNewArr.length
                recorderCount = this.recorderNewArr.length
                monitor = 10
            } else {
                phoneCount = this.getEquimentDataCount(this.phoneArr, policeStationName)
                carCount = this.getEquimentDataCount(this.carArr, policeStationName)
                recorderCount = this.getEquimentDataCount(this.recorderArr, policeStationName)
                phoneCount = this.getEquimentDataCount(this.phoneNewArr, policeStationName)
                carCount = this.getEquimentDataCount(this.carNewArr, policeStationName)
                recorderCount = this.getEquimentDataCount(this.recorderNewArr, policeStationName)
                monitor = 10
            }
            dataArr = [
@@ -459,7 +497,8 @@
                letter-spacing: 1px;
            }

            .activity {
            .activity,
            .equiment {
                font-size: 16px;
                color: rgb(98, 95, 95);
                cursor: pointer;
@@ -486,7 +525,7 @@
                border: 1px solid rgba(20, 50, 123, 1);
                cursor: pointer;

                &>div {
                & > div {
                    height: 26px;
                    line-height: 26px;
                }
@@ -501,7 +540,7 @@
            flex: 1;
        }

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