forked from srs-police-affairs
| src/components/map/index.vue | ●●●●● patch | view | raw | blame | history | |
| src/styles/base/index.css | ●●●●● patch | view | raw | blame | history | |
| src/styles/base/index.min.css | ●●●●● patch | view | raw | blame | history | |
| src/styles/base/index.scss | ●●●●● patch | view | raw | blame | history | |
| src/views/activity/index.vue | ●●●●● patch | view | raw | blame | history | |
| src/views/home/index.vue | ●●●●● patch | view | raw | blame | history |
src/components/map/index.vue
@@ -13,10 +13,18 @@ <!-- 全屏控制按钮 --> <div class="screen-full-btn"> <el-tooltip v-if="isFullscreen" content="缩放" placement="bottom" effect="dark"> <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange" ></i> </el-tooltip> <el-tooltip v-if="!isFullscreen" content="全屏" placement="bottom" effect="dark"> <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange" ></i> </el-tooltip> </div> </div> src/styles/base/index.css
@@ -127,24 +127,23 @@ .phone-details-box .el-dialog .el-dialog__body { flex: 1; display: flex; flex-direction: column; flex-direction: row; flex-wrap: wrap; justify-self: flex-start; align-content: flex-start; } .phone-details-box .el-dialog .dialog-side { .phone-details-box .el-dialog .el-dialog__body .item { display: flex; flex-direction: row; width: calc(50% - 20px); 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; margin: 0 10px; text-align: left; } .phone-details-box .el-dialog .dialog-side > div:nth-of-type(1) > div:first-child { .phone-details-box .el-dialog .el-dialog__body .item > div:first-child { width: 100px; text-align: justify; display: inline-block; @@ -152,26 +151,7 @@ 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) { .phone-details-box .el-dialog .el-dialog__body .item > div:nth-of-type(2) { width: calc(100% - 120px); } @@ -194,24 +174,23 @@ .area-details-box .el-dialog .el-dialog__body { flex: 1; display: flex; flex-direction: column; flex-direction: row; flex-wrap: wrap; justify-self: flex-start; align-content: flex-start; } .area-details-box .el-dialog .el-dialog__body .dialog-side { .area-details-box .el-dialog .el-dialog__body .item { display: flex; flex-direction: row; width: calc(50% - 20px); 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; margin: 0 10px; text-align: left; } .area-details-box .el-dialog .el-dialog__body .dialog-side > div:nth-of-type(1) > div:first-child { .area-details-box .el-dialog .el-dialog__body .item > div:first-child { width: 100px; text-align: justify; display: inline-block; @@ -219,26 +198,7 @@ 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) { .area-details-box .el-dialog .el-dialog__body .item > div:nth-of-type(2) { width: calc(100% - 120px); } @@ -306,24 +266,23 @@ .policeSituation-details-box .el-dialog .el-dialog__body { flex: 1; display: flex; flex-direction: column; flex-direction: row; flex-wrap: wrap; justify-self: flex-start; align-content: flex-start; } .policeSituation-details-box .el-dialog .el-dialog__body .dialog-side { .policeSituation-details-box .el-dialog .el-dialog__body .item { display: flex; flex-direction: row; width: calc(50% - 20px); 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; margin: 0 10px; text-align: left; } .policeSituation-details-box .el-dialog .el-dialog__body .dialog-side > div:nth-of-type(1) > div:first-child { .policeSituation-details-box .el-dialog .el-dialog__body .item > div:first-child { width: 100px; text-align: justify; display: inline-block; @@ -331,26 +290,7 @@ 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) { .policeSituation-details-box .el-dialog .el-dialog__body .item > div:nth-of-type(2) { width: calc(100% - 120px); } @@ -360,6 +300,7 @@ line-height: 36px; flex-direction: row; text-align: left; margin-left: 10px; } .policeSituation-details-box .el-dialog .el-dialog__body .dialog-content > div:first-child { @@ -378,7 +319,7 @@ margin: 0 !important; display: flex; flex-direction: column; width: 600px; width: 640px; height: 400px; top: 50%; left: 50% !important; @@ -393,24 +334,23 @@ .activity-details-box .el-dialog .el-dialog__body { flex: 1; display: flex; flex-direction: column; flex-direction: row; flex-wrap: wrap; justify-self: flex-start; align-content: flex-start; } .activity-details-box .el-dialog .el-dialog__body .dialog-side { .activity-details-box .el-dialog .el-dialog__body .item { display: flex; flex-direction: row; width: calc(50% - 20px); 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; margin: 0 10px; text-align: left; } .activity-details-box .el-dialog .el-dialog__body .dialog-side > div:nth-of-type(1) > div:first-child { .activity-details-box .el-dialog .el-dialog__body .item > div:first-child { width: 100px; text-align: justify; display: inline-block; @@ -418,25 +358,6 @@ 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) { .activity-details-box .el-dialog .el-dialog__body .item > div:nth-of-type(2) { width: calc(100% - 120px); } 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}.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)} *{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:row;flex-wrap:wrap;justify-self:flex-start;align-content:flex-start}.phone-details-box .el-dialog .el-dialog__body .item{display:flex;flex-direction:row;width:calc(50% - 20px);height:36px;line-height:36px;margin:0 10px;text-align:left}.phone-details-box .el-dialog .el-dialog__body .item>div:first-child{width:100px;text-align:justify;display:inline-block;text-align-last:justify;margin-right:20px}.phone-details-box .el-dialog .el-dialog__body .item>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:row;flex-wrap:wrap;justify-self:flex-start;align-content:flex-start}.area-details-box .el-dialog .el-dialog__body .item{display:flex;flex-direction:row;width:calc(50% - 20px);height:36px;line-height:36px;margin:0 10px;text-align:left}.area-details-box .el-dialog .el-dialog__body .item>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 .item>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:row;flex-wrap:wrap;justify-self:flex-start;align-content:flex-start}.policeSituation-details-box .el-dialog .el-dialog__body .item{display:flex;flex-direction:row;width:calc(50% - 20px);height:36px;line-height:36px;margin:0 10px;text-align:left}.policeSituation-details-box .el-dialog .el-dialog__body .item>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 .item>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;margin-left:10px}.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:640px;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:row;flex-wrap:wrap;justify-self:flex-start;align-content:flex-start}.activity-details-box .el-dialog .el-dialog__body .item{display:flex;flex-direction:row;width:calc(50% - 20px);height:36px;line-height:36px;margin:0 10px;text-align:left}.activity-details-box .el-dialog .el-dialog__body .item>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 .item>div:nth-of-type(2){width:calc(100% - 120px)} src/styles/base/index.scss
@@ -139,21 +139,18 @@ .el-dialog__body { flex: 1; display: flex; flex-direction: column; } .dialog-side { display: flex; height: 36px; line-height: 36px; &>div:nth-of-type(1) { flex: 1; flex-direction: row; flex-wrap:wrap; justify-self: flex-start; align-content: flex-start; .item { display: flex; justify-content: space-between; margin-right: 10px; flex-direction:row; width: calc(50% - 20px); height: 36px; line-height: 36px; margin: 0 10px; text-align: left; &>div:first-child { width: 100px; text-align: justify; @@ -161,34 +158,15 @@ text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } } &>div:nth-of-type(2) { flex: 1; display: flex; justify-content: space-between; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } } } } } } .area-details-box { @@ -210,51 +188,29 @@ .el-dialog__body { flex: 1; display: flex; flex-direction: column; flex-direction: row; flex-wrap:wrap; justify-self: flex-start; align-content: flex-start; .dialog-side { .item { display: flex; flex-direction:row; width: calc(50% - 20px); height: 36px; line-height: 36px; &>div:nth-of-type(1) { flex: 1; display: flex; justify-content: space-between; margin-right: 10px; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } margin: 0 10px; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { flex: 1; display: flex; justify-content: space-between; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } width: calc(100% - 120px); } } } @@ -331,52 +287,29 @@ .el-dialog__body { flex: 1; display: flex; flex-direction: column; flex-direction: row; flex-wrap:wrap; justify-self: flex-start; align-content: flex-start; .dialog-side { .item { display: flex; flex-direction:row; width: calc(50% - 20px); height: 36px; line-height: 36px; &>div:nth-of-type(1) { flex: 1; display: flex; justify-content: space-between; margin-right: 10px; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } margin: 0 10px; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { flex: 1; display: flex; justify-content: space-between; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } width: calc(100% - 120px); } } @@ -386,6 +319,7 @@ line-height: 36px; flex-direction: row; text-align: left; margin-left: 10px; &>div:first-child { width: 100px; @@ -409,7 +343,7 @@ margin: 0 !important; display: flex; flex-direction: column; width: 600px; width: 640px; height: 400px; top: 50%; left: 50% !important; @@ -423,52 +357,28 @@ .el-dialog__body { flex: 1; display: flex; flex-direction: column; .dialog-side { flex-direction: row; flex-wrap:wrap; justify-self: flex-start; align-content: flex-start; .item { display: flex; flex-direction:row; width: calc(50% - 20px); height: 36px; line-height: 36px; &>div:nth-of-type(1) { flex: 1; display: flex; justify-content: space-between; margin-right: 10px; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } margin: 0 10px; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { flex: 1; display: flex; justify-content: space-between; text-align: left; &>div:first-child { width: 100px; text-align: justify; display: inline-block; text-align-last: justify; margin-right: 20px; } &>div:nth-of-type(2) { width: calc(100% - 120px); } width: calc(100% - 120px); } } } src/views/activity/index.vue
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-08-18 16:18:17 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-11-07 17:20:06 * @LastEditTime: 2022-11-08 14:26:29 * @FilePath: \srs-police-affairs\src\views\activity\index.vue * @Description: 安保活动 * @@ -110,16 +110,13 @@ </div> <div class="second-container"> <el-tree :data="treeData" show-checkbox node-key="id" @check="treeCheckClick" @node-click="treeNodeClick"> </el-tree> <el-tree :data="treeData" show-checkbox node-key="id" @check="treeCheckClick"></el-tree> </div> <div v-show="dialogVisible" class="activity-details-box"> <div class="title"> 活动详情 <div class="close" @click="closeActivityDetails"> <i class="el-icon-close"></i> </div> <div class="close" @click="closeActivityDetails"></div> </div> <div class="row-box"> @@ -172,7 +169,7 @@ placeholder="请输入范围" ></el-input> </div> </div> --> </div>--> </div> <div class="btn-box"> @@ -507,19 +504,6 @@ } }) } }, treeNodeClick () { let color = global.DC.Namespace.Cesium.Color.fromBytes( 102, 176, 255, 100 ) this.$EventBus.$emit('layerPolylineAdd', { layerName: 'polylineLayer1', positions: '116.025000, 28.686000, 116.025000, 28.678000,116.020000, 28.678000', material: color, width: 2 }) }, goAbDetail (item, index) { @@ -908,6 +892,11 @@ transform: translate(0, -50%); cursor: pointer; } .close::before { content: '\e6db'; font-family: element-icons; } } .row-box { src/views/home/index.vue
@@ -11,16 +11,29 @@ <template> <div class="container"> <left-container class="left-container" @showpeopledetail="showpeopledetail" @showlanddetail="showlanddetail" @showkeypersondetail="showkeypersondetail" ref="leftContainer"></left-container> <left-container class="left-container" @showpeopledetail="showpeopledetail" @showlanddetail="showlanddetail" @showkeypersondetail="showkeypersondetail" ref="leftContainer" ></left-container> <right-container class="right-container" @showequimentdetail="showequimentdetail" @selectPoliceChangeEventData="selectPoliceChangeEventData" @changeActivityType="changeActivityType" @activityChange="activityChange" ref="rightContainer"></right-container> <right-container class="right-container" @showequimentdetail="showequimentdetail" @selectPoliceChangeEventData="selectPoliceChangeEventData" @changeActivityType="changeActivityType" @activityChange="activityChange" ref="rightContainer" ></right-container> <bottom-container class="bottom-container" ref="bottomContainer" @changePoliceSituationType="changePoliceSituationType" @policeSituationChange="policeSituationChange"> </bottom-container> <bottom-container class="bottom-container" ref="bottomContainer" @changePoliceSituationType="changePoliceSituationType" @policeSituationChange="policeSituationChange" ></bottom-container> <div class="center-container"> <div class="layers-control-btn house"> @@ -41,167 +54,249 @@ <div class="layers-control-btn activity"> <el-checkbox v-model="activityLayerShow" @change="activityChange">活动</el-checkbox> </div> <div class="layers-control-btn policeSituation"> <div class="layers-control-btn police-situation"> <el-checkbox v-model="policeSituationLayerShow" @change="policeSituationChange">警情</el-checkbox> </div> </div> <div ref="RegionSelect" style="left: 0;" class="region-select"> <map-select class="map-select" @selectCheck="policeStationSelect" :checkValue="policeStationCheckValue" :options="policeStationOptions" :optionsName="'policeStationName'"></map-select> <map-select class="map-select" @selectCheck="policeStationSelect" :checkValue="policeStationCheckValue" :options="policeStationOptions" :optionsName="'policeStationName'" ></map-select> <map-select class="map-select" @selectCheck="areaSelect" :checkValue="areaCheckValue" :options="areaOptions" :optionsName="'areaCheckName'"></map-select> <map-select class="map-select" @selectCheck="areaSelect" :checkValue="areaCheckValue" :options="areaOptions" :optionsName="'areaCheckName'" ></map-select> <map-select class="map-select" @selectCheck="housingSelect" :checkValue="housingCheckValue" :options="housingOptions" :optionsName="'housingsName'"></map-select> <map-select class="map-select" @selectCheck="housingSelect" :checkValue="housingCheckValue" :options="housingOptions" :optionsName="'housingsName'" ></map-select> </div> <el-dialog :title="dialogTitle" :modal="true" :visible.sync="dialogVisible" :before-close="dialogBeforeClose" :close-on-click-modal="true"> <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill"></video> <el-dialog :title="dialogTitle" :modal="true" :visible.sync="dialogVisible" :before-close="dialogBeforeClose" :close-on-click-modal="true" > <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill" ></video> </el-dialog> <el-dialog :title="panoramaTitle" :modal="true" :visible.sync="panoramaVisible" :before-close="panoramaBeforeClose" :close-on-click-modal="true" class="panorama-details-box"> <iframe src="http://vr.jxpskj.com/JXSFKZQJ/QJ/" style="width: 100%; height: 100%;" frameborder="0"></iframe> <el-dialog :title="panoramaTitle" :modal="true" :visible.sync="panoramaVisible" :before-close="panoramaBeforeClose" :close-on-click-modal="true" class="panorama-details-box" > <iframe src="http://vr.jxpskj.com/JXSFKZQJ/QJ/" style="width: 100%; height: 100%;" frameborder="0" ></iframe> </el-dialog> <el-dialog :title="activityTitle" :modal="true" :visible.sync="activityVisible" :before-close="activityBeforeClose" :close-on-click-modal="true" class="activity-details-box"> <div class="dialog-side"> <div> <div>活动名称:</div> <div>{{ activityDetailArr.activityName }}</div> </div> <div> <div>开始时间:</div> <div>{{ activityDetailArr.startTime }}</div> </div> <el-dialog :title="activityTitle" :modal="true" :visible.sync="activityVisible" :before-close="activityBeforeClose" :close-on-click-modal="true" class="activity-details-box" > <div class="item"> <div>活动名称:</div> <div>{{ activityDetailArr.activityName }}</div> </div> <div class="dialog-side"> <div> <div>结束时间:</div> <div>{{ activityDetailArr.endTime }}</div> </div> <div> <div>规模:</div> <div>{{ activityDetailArr.scale }}</div> </div> <div class="item"> <div>开始时间:</div> <div>{{ activityDetailArr.startTime }}</div> </div> <div class="dialog-side"> <div> <div>所属派出所:</div> <div>{{ activityDetailArr.policeStationName }}</div> </div> <div> <div>坐标:</div> <div>{{ activityDetailArr.position }}</div> </div> <div class="item"> <div>结束时间:</div> <div>{{ activityDetailArr.endTime }}</div> </div> <div class="dialog-side"> <div> <div>经度:</div> <div>{{ activityDetailArr.lng }}</div> </div> <div> <div>纬度:</div> <div>{{ activityDetailArr.lat }}</div> </div> <div class="item"> <div>规模:</div> <div>{{ activityDetailArr.scale }}</div> </div> <div class="item"> <div>所属派出所:</div> <div>{{ activityDetailArr.policeStationName }}</div> </div> <div class="item"> <div>坐标:</div> <div>{{ activityDetailArr.position }}</div> </div> <div class="item"> <div>经度:</div> <div>{{ activityDetailArr.lng }}</div> </div> <div class="item"> <div>纬度:</div> <div>{{ activityDetailArr.lat }}</div> </div> </el-dialog> <el-dialog :title="phoneTitle" :modal="true" :visible.sync="phoneVisible" :before-close="phoneBeforeClose" :close-on-click-modal="true" class="phone-details-box"> <div class="dialog-side"> <div> <div>责任人：</div> <div>{{ phoneDetails.person }}</div> </div> <div> <div>联系方式：</div> <div>{{ phoneDetails.phoneID }}</div> </div> <el-dialog :title="phoneTitle" :modal="true" :visible.sync="phoneVisible" :before-close="phoneBeforeClose" :close-on-click-modal="true" class="phone-details-box" > <div class="item"> <div>责任人：</div> <div>{{ phoneDetails.person }}</div> </div> <div class="dialog-side"> <div> <div>手台类型：</div> <div>{{ phoneDetails.phoneType }}</div> </div> <div> <div>所在地址：</div> <div>{{ phoneDetails.location }}</div> </div> <div class="item"> <div>联系方式：</div> <div>{{ phoneDetails.phoneID }}</div> </div> <div class="item"> <div>手台类型：</div> <div>{{ phoneDetails.phoneType }}</div> </div> <div class="item"> <div>所在地址：</div> <div>{{ phoneDetails.location }}</div> </div> </el-dialog> <el-dialog :title="peopleTitle" :modal="true" :visible.sync="peopleVisible" :before-close="peopleBeforeClose" :close-on-click-modal="true" class="area-details-box"> <div class="dialog-side"> <div> <div>责任区负责人：</div> <div>王某某</div> </div> <div> <div>责任区人口：</div> <div>10000</div> </div> <el-dialog :title="peopleTitle" :modal="true" :visible.sync="peopleVisible" :before-close="peopleBeforeClose" :close-on-click-modal="true" class="area-details-box" > <div class="item"> <div>责任区负责人：</div> <div>王某某</div> </div> <div class="dialog-side"> <div> <div>男女比例：</div> <div>0.92:1</div> </div> <div> <div>所在地址：</div> <div>XXXXXXX</div> </div> <div class="item"> <div>责任区人口：</div> <div>10000</div> </div> <div class="item"> <div>男女比例：</div> <div>0.92:1</div> </div> <div class="item"> <div>所在地址：</div> <div>XXXXXXX</div> </div> </el-dialog> <el-dialog :title="equimentTitle" :modal="true" :visible.sync="equimentVisible" :before-close="equimentBeforeClose" :close-on-click-modal="true" class="equiment-details-box"> <div class="equimentDetail"> <el-dialog :title="equimentTitle" :modal="true" :visible.sync="equimentVisible" :before-close="equimentBeforeClose" :close-on-click-modal="true" class="equiment-details-box" > <div class="equiment-detail"> <div class="left"> <el-tree :data="jurisdictionData" :props="defaultProps" @node-click="jurisdictionNodeClick" ref="tree" node-key="id"></el-tree> <el-tree :data="jurisdictionData" :props="defaultProps" @node-click="jurisdictionNodeClick" ref="tree" node-key="id" ></el-tree> </div> <div class="right"> <div class="monitor" v-if="monitorContent"> <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill"></video> <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill" ></video> </div> <div class="others" v-if="othersContent"> <el-table :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)" <el-table :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)" 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"> :row-class-name="tableRowClassName" > <el-table-column prop="carID" label="车牌号" v-if="carArrShow"></el-table-column> <el-table-column prop="carType" label="车型" v-if="carArrShow"></el-table-column> <el-table-column prop="phoneID" label="手台号" v-if="phoneArrShow"></el-table-column> <el-table-column prop="phoneType" label="手台机型" v-if="phoneArrShow"></el-table-column> <el-table-column prop="recorderID" label="执法记录仪号" v-if="recorderArrShow"></el-table-column> <el-table-column prop="recorderType" label="记录仪机型" v-if="recorderArrShow"></el-table-column> <el-table-column prop="recorderID" label="执法记录仪号" v-if="recorderArrShow" ></el-table-column> <el-table-column prop="recorderType" label="记录仪机型" v-if="recorderArrShow" ></el-table-column> <el-table-column prop="policeStation" label="所属派出所"></el-table-column> <el-table-column prop="area" label="所属责任区"></el-table-column> </el-table> <div class="pages"> <el-pagination background layout="prev, pager, next" :total="showArr.length" :page-size="pagesize" pager-count="3" :current-page="currentPage" @current-change="handleCurrentChange"></el-pagination> <el-pagination background layout="prev, pager, next" :total="showArr.length" :page-size="pagesize" pager-count="3" :current-page="currentPage" @current-change="handleCurrentChange" ></el-pagination> </div> </div> </div> </div> </el-dialog> <el-dialog :title="landTitle" :modal="true" :visible.sync="landVisible" :before-close="landBeforeClose" :close-on-click-modal="true" class="land-details-box"> <el-table :data="landDetailArr" style="width: 100%" <el-dialog :title="landTitle" :modal="true" :visible.sync="landVisible" :before-close="landBeforeClose" :close-on-click-modal="true" class="land-details-box" > <el-table :data="landDetailArr" style="width: 100%" :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"> :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }" > <el-table-column prop="housingEastate" label="小区名称" width="100"></el-table-column> <el-table-column prop="location" label="位置" width="140"></el-table-column> <el-table-column prop="area" label="面积" width="120"></el-table-column> @@ -210,11 +305,20 @@ </el-table> </el-dialog> <el-dialog :title="keyPersonTitle" :modal="true" :visible.sync="keyPersonVisible" :before-close="keyPersonBeforeClose" :close-on-click-modal="true" class="keyPerson-details-box"> <el-table :data="keyPersonDetailArr" style="width: 100%" <el-dialog :title="keyPersonTitle" :modal="true" :visible.sync="keyPersonVisible" :before-close="keyPersonBeforeClose" :close-on-click-modal="true" class="keyPerson-details-box" > <el-table :data="keyPersonDetailArr" style="width: 100%" :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"> :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }" > <el-table-column prop="type" label="重点人员类型"></el-table-column> <el-table-column prop="name" label="姓名"></el-table-column> <el-table-column prop="sex" label="性别"></el-table-column> @@ -225,57 +329,53 @@ </el-table> </el-dialog> <el-dialog :title="policeSituationTitle" :modal="true" :visible.sync="policeSituationVisible" :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box"> <div class="dialog-side"> <div> <div>所属派出所:</div> <div>{{ policeSituationDetailArr.policeName }}</div> </div> <div> <div>警情类别:</div> <div>{{ policeSituationDetailArr.type }}</div> </div> <el-dialog :title="policeSituationTitle" :modal="true" :visible.sync="policeSituationVisible" :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box" > <div class="item"> <div>所属派出所:</div> <div>{{ policeSituationDetailArr.policeName }}</div> </div> <div class="dialog-side"> <div> <div>警情状态:</div> <div>{{ policeSituationDetailArr.state }}</div> </div> <div> <div>报警电话:</div> <div>{{ policeSituationDetailArr.comingPhone }}</div> </div> <div class="item"> <div>警情类别:</div> <div>{{ policeSituationDetailArr.type }}</div> </div> <div class="dialog-side"> <div> <div>接警时间:</div> <div>{{ policeSituationDetailArr.dealTime }}</div> </div> <div> <div>经办民警:</div> <div>{{ policeSituationDetailArr.dealPolice }}</div> </div> <div class="item"> <div>警情状态:</div> <div>{{ policeSituationDetailArr.state }}</div> </div> <div class="dialog-side"> <div> <div>报警人:</div> <div>{{ policeSituationDetailArr.callPeople }}</div> </div> <div> <div>报警人联系人:</div> <div>{{ policeSituationDetailArr.callPhone }}</div> </div> <div class="item"> <div>报警电话:</div> <div>{{ policeSituationDetailArr.comingPhone }}</div> </div> <div class="dialog-side"> <div> <div>经度:</div> <div>{{ policeSituationDetailArr.lng }}</div> </div> <div> <div>纬度:</div> <div>{{ policeSituationDetailArr.lat }}</div> </div> <div class="item"> <div>接警时间:</div> <div>{{ policeSituationDetailArr.dealTime }}</div> </div> <div class="item"> <div>经办民警:</div> <div>{{ policeSituationDetailArr.dealPolice }}</div> </div> <div class="item"> <div>报警人:</div> <div>{{ policeSituationDetailArr.callPeople }}</div> </div> <div class="item"> <div>报警人联系人:</div> <div>{{ policeSituationDetailArr.callPhone }}</div> </div> <div class="item"> <div>经度:</div> <div>{{ policeSituationDetailArr.lng }}</div> </div> <div class="item"> <div>纬度:</div> <div>{{ policeSituationDetailArr.lat }}</div> </div> <div class="dialog-content"> <div>报警内容:</div> @@ -564,9 +664,6 @@ // }} window.addEventListener('resize', this.setDomStyle) }, updated () { }, methods: { @@ -1028,8 +1125,9 @@ lng: center[0], lat: center[1], alt: 0, text: item.policeStationName text: item.policeStationName, }, distanceDisplayCondition: { "near": 0, "far": 200000 } }) let cylinder = new global.DC.LightCylinderPrimitive(new global.DC.Position(center[0], center[1]), 1200, 1, 600) cylinder.setStyle({ @@ -1318,7 +1416,6 @@ } else { this.jurisdictionData = treeData } }, showkeypersondetail (name, arr) { @@ -1336,8 +1433,6 @@ }, }, watch: {}, destroyed () { this.$EventBus.$emit('mapRemoveLayer', { @@ -1375,7 +1470,6 @@ type: 'ClusterLayer' }) cylinderLayer.clear() cylinderLayer.remove() cylinderLayer = null @@ -1385,7 +1479,6 @@ for (let i = 0; i < timer.length; i++) { clearInterval(timer[i]) } document.querySelector('.dc-container .dc-zoom-controller').classList.remove('homebottom') document.querySelector('.dc-container .dc-location-bar').classList.remove('homebottom') @@ -1524,7 +1617,7 @@ } } .policeSituation { .police-situation { :deep(.el-checkbox__inner) { background: rgb(228, 63, 63); border-color: rgb(228, 63, 63); @@ -1563,7 +1656,7 @@ } } .equimentDetail { .equiment-detail { height: 540px; width: 100%; @@ -1583,7 +1676,9 @@ background-color: #66b1ff87; } :deep(.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content) { :deep(.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content) { background: #454545; }
