页面优化

guanqb

2022-11-04 be71e9e1889baa004fb7a34bb659a5820ad33606

页面优化

 src/styles/base/index.css

@@ -97,6 +97,17 @@
  flex: 1;
}

.panorama-details-box .el-dialog {
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  width: 960px;
  height: 600px;
  top: 50%;
  left: 50% !important;
  transform: translate(-50%, -50%);
}

.phone-details-box .el-dialog {
  margin: 0 !important;
  display: flex;
@@ -115,14 +126,8 @@

.phone-details-box .el-dialog .el-dialog__body {
  flex: 1;
}

.phone-details-box .el-dialog .dialog-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.phone-details-box .el-dialog .dialog-side {
@@ -188,14 +193,8 @@

.area-details-box .el-dialog .el-dialog__body {
  flex: 1;
}

.area-details-box .el-dialog .el-dialog__body .dialog-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.area-details-box .el-dialog .el-dialog__body .dialog-side {
@@ -306,14 +305,8 @@

.policeSituation-details-box .el-dialog .el-dialog__body {
  flex: 1;
}

.policeSituation-details-box .el-dialog .el-dialog__body .dialog-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side {
@@ -399,14 +392,8 @@

.activity-details-box .el-dialog .el-dialog__body {
  flex: 1;
}

.activity-details-box .el-dialog .el-dialog__body .dialog-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.activity-details-box .el-dialog .el-dialog__body .dialog-side {

 src/styles/base/index.min.css

@@ -1 +1 @@
*{margin:0;padding:0;box-sizing:border-box;scrollbar-color:rgba(7,22,37,0.8) rgba(216,216,216,0.2);scrollbar-width:thin}html,body{width:100%;height:100%}ul li{list-style:none}.deblurring{image-rendering:-moz-crisp-edges;image-rendering:-o-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;-ms-interpolation-mode:nearest-neighbor}::-webkit-scrollbar{width:6px;height:6px;background-color:none}::-webkit-scrollbar-thumb{border-radius:6px;background-color:rgba(7,22,37,0.8);padding-left:2px;padding-right:2px}::-webkit-scrollbar-track{background-color:rgba(216,216,216,0.2)}::-webkit-scrollbar-thumb:window-inactive{background-color:rgba(7,22,37,0.8)}:not(select)::-webkit-scrollbar{background-color:rgba(216,216,216,0.2)}::-webkit-scrollbar-thumb:hover{background-color:rgba(7,22,37,0.8)}.car-video-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:720px;height:480px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.car-video-box .el-dialog .el-dialog__body{flex:1}.police-affairs-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:540px;height:420px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.police-affairs-details-box .el-dialog .el-dialog__body{flex:1}.resident-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:320px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.resident-details-box .el-dialog .el-dialog__body{flex:1}.phone-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:720px;height:400px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.phone-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.phone-details-box .el-dialog .el-dialog__body{flex:1}.phone-details-box .el-dialog .dialog-container{flex:1;display:flex;flex-direction:column;width:100%;height:100%}.phone-details-box .el-dialog .dialog-side{display:flex;height:36px;line-height:36px}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}.area-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:700px;height:400px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.area-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.area-details-box .el-dialog .el-dialog__body{flex:1}.area-details-box .el-dialog .el-dialog__body .dialog-container{flex:1;display:flex;flex-direction:column;width:100%;height:100%}.area-details-box .el-dialog .el-dialog__body .dialog-side{display:flex;height:36px;line-height:36px}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}.equiment-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:1000px;height:600px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.equiment-details-box .el-dialog .el-dialog__body{flex:1}.land-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:630px;height:300px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.land-details-box .el-dialog .el-dialog__body{flex:1}.keyPerson-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:1000px;height:700px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.keyPerson-details-box .el-dialog .el-dialog__body{flex:1}.policeSituation-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:800px;height:500px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.policeSituation-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.policeSituation-details-box .el-dialog .el-dialog__body{flex:1}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-container{flex:1;display:flex;flex-direction:column;width:100%;height:100%}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side{display:flex;height:36px;line-height:36px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-content{display:flex;height:36px;line-height:36px;flex-direction:row;text-align:left}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-content>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-content>div:nth-of-type(2){width:calc(100% - 120px)}.activity-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:600px;height:400px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.activity-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.activity-details-box .el-dialog .el-dialog__body{flex:1}.activity-details-box .el-dialog .el-dialog__body .dialog-container{flex:1;display:flex;flex-direction:column;width:100%;height:100%}.activity-details-box .el-dialog .el-dialog__body .dialog-side{display:flex;height:36px;line-height:36px}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}
*{margin:0;padding:0;box-sizing:border-box;scrollbar-color:rgba(7,22,37,0.8) rgba(216,216,216,0.2);scrollbar-width:thin}html,body{width:100%;height:100%}ul li{list-style:none}.deblurring{image-rendering:-moz-crisp-edges;image-rendering:-o-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;-ms-interpolation-mode:nearest-neighbor}::-webkit-scrollbar{width:6px;height:6px;background-color:none}::-webkit-scrollbar-thumb{border-radius:6px;background-color:rgba(7,22,37,0.8);padding-left:2px;padding-right:2px}::-webkit-scrollbar-track{background-color:rgba(216,216,216,0.2)}::-webkit-scrollbar-thumb:window-inactive{background-color:rgba(7,22,37,0.8)}:not(select)::-webkit-scrollbar{background-color:rgba(216,216,216,0.2)}::-webkit-scrollbar-thumb:hover{background-color:rgba(7,22,37,0.8)}.car-video-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:720px;height:480px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.car-video-box .el-dialog .el-dialog__body{flex:1}.police-affairs-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:540px;height:420px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.police-affairs-details-box .el-dialog .el-dialog__body{flex:1}.resident-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:320px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.resident-details-box .el-dialog .el-dialog__body{flex:1}.panorama-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:960px;height:600px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.phone-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:720px;height:400px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.phone-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.phone-details-box .el-dialog .el-dialog__body{flex:1;display:flex;flex-direction:column}.phone-details-box .el-dialog .dialog-side{display:flex;height:36px;line-height:36px}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.phone-details-box .el-dialog .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}.area-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:700px;height:400px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.area-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.area-details-box .el-dialog .el-dialog__body{flex:1;display:flex;flex-direction:column}.area-details-box .el-dialog .el-dialog__body .dialog-side{display:flex;height:36px;line-height:36px}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.area-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}.equiment-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:1000px;height:600px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.equiment-details-box .el-dialog .el-dialog__body{flex:1}.land-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:630px;height:300px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.land-details-box .el-dialog .el-dialog__body{flex:1}.keyPerson-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:1000px;height:700px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.keyPerson-details-box .el-dialog .el-dialog__body{flex:1}.policeSituation-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:800px;height:500px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.policeSituation-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.policeSituation-details-box .el-dialog .el-dialog__body{flex:1;display:flex;flex-direction:column}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side{display:flex;height:36px;line-height:36px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-content{display:flex;height:36px;line-height:36px;flex-direction:row;text-align:left}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-content>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.policeSituation-details-box .el-dialog .el-dialog__body .dialog-content>div:nth-of-type(2){width:calc(100% - 120px)}.activity-details-box .el-dialog{margin:0 !important;display:flex;flex-direction:column;width:600px;height:400px;top:50%;left:50% !important;transform:translate(-50%, -50%)}.activity-details-box .el-dialog .el-dialog__header{height:56px;line-height:56px}.activity-details-box .el-dialog .el-dialog__body{flex:1;display:flex;flex-direction:column}.activity-details-box .el-dialog .el-dialog__body .dialog-side{display:flex;height:36px;line-height:36px}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1){flex:1;display:flex;justify-content:space-between;margin-right:10px;text-align:left}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(1)>div:nth-of-type(2){width:calc(100% - 120px)}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2){flex:1;display:flex;justify-content:space-between;text-align:left}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.activity-details-box .el-dialog .el-dialog__body .dialog-side>div:nth-of-type(2)>div:nth-of-type(2){width:calc(100% - 120px)}

 src/styles/base/index.scss

@@ -105,6 +105,19 @@
        }
    }
}
.panorama-details-box {
    .el-dialog {
        margin: 0 !important;
        display: flex;
        flex-direction: column;
        width: 960px;
        height: 600px;
        top: 50%;
        left: 50% !important;
        transform: translate(-50%, -50%);

    }
}

.phone-details-box {
    .el-dialog {

 src/views/home/components/leftContainer.vue

@@ -484,17 +484,12 @@
                    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()
                }
            })
        },
@@ -598,7 +593,9 @@
            keyPersonmyChart = this.$echarts.init(chartDom)
            let dataArr = this.getKeyPersonCount(this.keyPersonSelectArr)
            keyPersonmyChart.setOption(this.initkeyPersonOption(dataArr))

            window.addEventListener("resize", function () {
                homePersonmyChart.resize()
            })
        },

        initkeyPersonOption (dataArr) {

 src/views/home/index.vue

@@ -109,6 +109,7 @@
            :visible.sync="panoramaVisible"
            :before-close="panoramaBeforeClose"
            :close-on-click-modal="true"
            class="panorama-details-box"
        >
            <iframe
                src="http://vr.jxpskj.com/JXSFKZQJ/QJ/"
@@ -1278,6 +1279,7 @@
        },

        jurisdictionNodeClick (nodeObj) {
            this.currentPage = 1
            if (nodeObj.id == 1) {
                this.showArr = this.saveArr
            } else if (nodeObj.id == 2) {