1
shuishen
2022-12-12 f73abcfdb804dea0b43e8570a60de801b0ef08ce
1
5 files modified
17904 ■■■■■ changed files
package-lock.json 17837 ●●●●● patch | view | raw | blame | history
package.json 4 ●●●● patch | view | raw | blame | history
src/styles/base/index.scss 1 ●●●● patch | view | raw | blame | history
src/views/home/components/leftContainer.vue 1 ●●●● patch | view | raw | blame | history
src/views/home/components/rightContainer.vue 61 ●●●●● patch | view | raw | blame | history
package-lock.json
Diff too large
package.json
@@ -12,7 +12,7 @@
        "@turf/turf": "^6.5.0",
        "axios": "^0.22.0",
        "core-js": "^3.6.5",
        "echarts": "^4.9.0",
        "echarts": "^5.3.0",
        "element-resize-detector": "^1.2.4",
        "element-ui": "^2.15.6",
        "flv.js": "^1.6.2",
@@ -50,4 +50,4 @@
        "sass-loader": "^8.0.2",
        "vue-template-compiler": "^2.6.11"
    }
}
}
src/styles/base/index.scss
@@ -522,4 +522,5 @@
.select-on-tab {
    box-shadow: 0 2px 2px $menu-tab-shadow;
    color: #fff;
}
src/views/home/components/leftContainer.vue
@@ -952,6 +952,7 @@
        .sub-tab {
            padding: 10px;
            display: flex;
            color: #99cccc;
            .tab,
            .tab3 {
src/views/home/components/rightContainer.vue
@@ -5,15 +5,10 @@
                <div>值班信息(当日)</div>
            </div>
            <div class="table-box">
                <el-table
                    size="small"
                    :height="tableHeight"
                    :data="schedulingList"
                    style="width: 100%"
                <el-table size="small" :height="tableHeight" :data="schedulingList" style="width: 100%"
                    :header-cell-style="{ 'text-align': 'center' }"
                    :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                    :row-class-name="tableRowClassName"
                >
                    :row-class-name="tableRowClassName">
                    <el-table-column prop="station" label="岗位"></el-table-column>
                    <el-table-column prop="name" label="姓名"></el-table-column>
                    <el-table-column prop="contact" label="联系方式"></el-table-column>
@@ -24,16 +19,9 @@
            <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>
@@ -297,6 +285,11 @@
                                }
                            }
                        },
                        emphasis: {
                            label: {
                                color: 'red'
                            }
                        },
                        label: {
                            color: function (params) {
                                let colorList = []
@@ -338,6 +331,7 @@
            if (timer) {
                clearInterval(timer)
            }
            timer = setInterval(() => {
                equipmentmyChart.dispatchAction({ type: 'downplay', seriesIndex: 0, dataIndex: curIndex })
                curIndex = (curIndex + 1) % dataLen
@@ -345,6 +339,7 @@
                    type: 'highlight', seriesIndex: 0, dataIndex: curIndex
                })
            }, 1000)
            equipmentmyChart.on('mouseover', function (param) {
                clearInterval(timer)
                equipmentmyChart.dispatchAction({
@@ -359,6 +354,7 @@
                })
                curIndex = param.dataIndex
            })
            equipmentmyChart.on('mouseout', function (param) {
                curIndex = param.dataIndex
                if (timer) {
@@ -540,6 +536,11 @@
        },
        getEquimentChartData (policeStationName) {
            const oneColor = ['#4caf50', '#2979ff', '#ffd600', '#0d47a1', '#b71c1c']
            const twoColor = ['#5470FE', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
            let dataArr = []
            let phoneCount = 0
            let carCount = 0
@@ -592,10 +593,10 @@
            recorderState = this.getEquimentChartStateData(this.recorderNewArr)
            if (this.linetype == 0) {
                dataArr = [
                    { value: carCount, name: '车辆', working: carState.working, fault: carState.fault, maintain: carState.maintain, disable: carState.disable, sealing: carState.sealing },
                    { value: monitorCount, name: '摄像头', working: monitorState.working, fault: monitorState.fault, maintain: monitorState.maintain, disable: monitorState.disable, sealing: monitorState.sealing },
                    { value: recorderCount, name: '执法记录仪', working: recorderState.working, fault: recorderState.fault, maintain: recorderState.maintain, disable: recorderState.disable, sealing: recorderState.sealing },
                    { value: phoneCount, name: '手台', working: phoneState.working, fault: phoneState.fault, maintain: phoneState.maintain, disable: phoneState.disable, sealing: phoneState.sealing },
                    { value: carCount, name: '车辆', working: carState.working, fault: carState.fault, maintain: carState.maintain, disable: carState.disable, sealing: carState.sealing, label: { color: twoColor[0] } },
                    { value: monitorCount, name: '摄像头', working: monitorState.working, fault: monitorState.fault, maintain: monitorState.maintain, disable: monitorState.disable, sealing: monitorState.sealing, label: { color: twoColor[1] } },
                    { value: recorderCount, name: '执法记录仪', working: recorderState.working, fault: recorderState.fault, maintain: recorderState.maintain, disable: recorderState.disable, sealing: recorderState.sealing, label: { color: twoColor[2] } },
                    { value: phoneCount, name: '手台', working: phoneState.working, fault: phoneState.fault, maintain: phoneState.maintain, disable: phoneState.disable, sealing: phoneState.sealing, label: { color: twoColor[3] } },
                ]
                this.regionTotal = phoneCount + monitorCount + carCount + recorderCount
            } else {
@@ -605,11 +606,11 @@
                let disableObj = this.getEquimentChartTypeData(phoneState, carState, recorderState, monitorState).disableObj
                let sealingObj = this.getEquimentChartTypeData(phoneState, carState, recorderState, monitorState).sealingObj
                dataArr = [
                    { value: workingObj.total, name: '正常', carCount: workingObj.carCount, monitorCount: workingObj.monitorCount, recorderCount: workingObj.recorderCount, phoneCount: workingObj.phoneCount, color: '#4caf50' },
                    { value: maintainObj.total, name: '保养', carCount: maintainObj.carCount, monitorCount: maintainObj.monitorCount, recorderCount: maintainObj.recorderCount, phoneCount: maintainObj.phoneCount, color: '#2979ff' },
                    { value: faultObj.total, name: '故障', carCount: faultObj.carCount, monitorCount: faultObj.monitorCount, recorderCount: faultObj.recorderCount, phoneCount: faultObj.phoneCount, color: '#ffd600' },
                    { value: disableObj.total, name: '停用', carCount: disableObj.carCount, monitorCount: disableObj.monitorCount, recorderCount: disableObj.recorderCount, phoneCount: disableObj.phoneCount, color: '#0d47a1' },
                    { value: sealingObj.total, name: '封存', carCount: sealingObj.carCount, monitorCount: sealingObj.monitorCount, recorderCount: sealingObj.recorderCount, phoneCount: sealingObj.phoneCount, color: '#b71c1c' },
                    { value: workingObj.total, name: '正常', carCount: workingObj.carCount, monitorCount: workingObj.monitorCount, recorderCount: workingObj.recorderCount, phoneCount: workingObj.phoneCount, color: '#4caf50', label: { color: oneColor[0] } },
                    { value: maintainObj.total, name: '保养', carCount: maintainObj.carCount, monitorCount: maintainObj.monitorCount, recorderCount: maintainObj.recorderCount, phoneCount: maintainObj.phoneCount, color: '#2979ff', label: { color: oneColor[1] } },
                    { value: faultObj.total, name: '故障', carCount: faultObj.carCount, monitorCount: faultObj.monitorCount, recorderCount: faultObj.recorderCount, phoneCount: faultObj.phoneCount, color: '#ffd600', label: { color: oneColor[2] } },
                    { value: disableObj.total, name: '停用', carCount: disableObj.carCount, monitorCount: disableObj.monitorCount, recorderCount: disableObj.recorderCount, phoneCount: disableObj.phoneCount, color: '#0d47a1', label: { color: oneColor[3] } },
                    { value: sealingObj.total, name: '封存', carCount: sealingObj.carCount, monitorCount: sealingObj.monitorCount, recorderCount: sealingObj.recorderCount, phoneCount: sealingObj.phoneCount, color: '#b71c1c', label: { color: oneColor[4] } },
                ]
                this.regionTotal = workingObj.total + faultObj.total + maintainObj.total + disableObj.total + sealingObj.total
            }
@@ -800,6 +801,7 @@
                margin-left: 50%;
                letter-spacing: 1px;
            }
            .legend {
                position: absolute;
                width: calc(100% - 36px);
@@ -807,17 +809,21 @@
                top: 120%;
                font-style: normal;
                font-weight: normal;
                ul {
                    display: flex;
                    height: 100%;
                    li {
                        height: 100%;
                        display: flex;
                        line-height: 160%;
                        margin-right: 10px;
                        img {
                            height: 60%;
                        }
                        div {
                            width: 20px;
                            height: 42%;
@@ -847,7 +853,7 @@
                background: $sub-tab-bg-color;
                cursor: pointer;
                & > div {
                &>div {
                    height: 26px;
                    line-height: 26px;
                }
@@ -858,6 +864,7 @@
            padding: 12px;
            flex: 1;
        }
        .table-box {
            padding: 0 12px;
            flex: 1;