10 files modified
2 files added
| | |
|---|
| | | .DS_Store |
|---|
| | | node_modules |
|---|
| | | /dist |
|---|
| | | /dist.zip |
|---|
| | | /public/sd |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | return request({ |
|---|
| | | url: '/sf3d/area/list', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl: 'fengt', |
|---|
| | | params: { |
|---|
| | | adcode |
|---|
| | | } |
|---|
| | |
|---|
| | | return request({ |
|---|
| | | url: '/sf3d/area/info', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl: 'fengt', |
|---|
| | | params: { |
|---|
| | | area_id, |
|---|
| | | adcode |
|---|
| | |
|---|
| | | return request({ |
|---|
| | | url: '/sf3d/area/getAoiByPt', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl: 'fengt', |
|---|
| | | params: { |
|---|
| | | lng, |
|---|
| | | lat, |
|---|
| | |
|---|
| | | return request({ |
|---|
| | | url: '/sf3d/area/unitbuild', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl: 'fengt', |
|---|
| | | params: { |
|---|
| | | area_id, |
|---|
| | | adcode |
|---|
| | |
|---|
| | | return request({ |
|---|
| | | url: '/sf3d/build/houses', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl: 'fengt', |
|---|
| | | params: { |
|---|
| | | build_id, |
|---|
| | | adcode |
|---|
| | |
|---|
| | | return request({ |
|---|
| | | url: '/zhs/bs/search', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl: 'fengt', |
|---|
| | | params: { |
|---|
| | | ak, |
|---|
| | | region, |
|---|
| | |
|---|
| | | * @Author: shuishen 1109946754@qq.com |
|---|
| | | * @Date: 2022-11-15 15:10:41 |
|---|
| | | * @LastEditors: shuishen 1109946754@qq.com |
|---|
| | | * @LastEditTime: 2022-11-15 17:27:41 |
|---|
| | | * @LastEditTime: 2022-12-19 17:38:55 |
|---|
| | | * @FilePath: \srs-police-affairs\src\api\video\index.js |
|---|
| | | * @Description: |
|---|
| | | * |
|---|
| | |
|---|
| | | * @param {*} params 暂时不用传 |
|---|
| | | * @returns |
|---|
| | | */ |
|---|
| | | export const getVideoList = (page, count, name, params = {}, requestBaseUrl = 'outside') => { |
|---|
| | | export const getVideoList = (page, count, query, params = {}) => { |
|---|
| | | return request({ |
|---|
| | | url: '/device/query/devices', |
|---|
| | | url: '/device/query/devices/36110000002009999000/channels', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl, |
|---|
| | | requestBaseUrl: 'outside', |
|---|
| | | params: { |
|---|
| | | page, |
|---|
| | | count, |
|---|
| | | name, |
|---|
| | | query, |
|---|
| | | ...params |
|---|
| | | } |
|---|
| | | }) |
|---|
| | |
|---|
| | | * @param {*} equipmentNumber 设备编号 |
|---|
| | | * @returns |
|---|
| | | */ |
|---|
| | | export const getDevices = (equipmentNumber, requestBaseUrl = 'outside') => { |
|---|
| | | export const getDevices = (equipmentNumber, channelId) => { |
|---|
| | | return request({ |
|---|
| | | url: `/play/start/${equipmentNumber}/${equipmentNumber}`, |
|---|
| | | url: `/play/start/${equipmentNumber}/${channelId}`, |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl |
|---|
| | | requestBaseUrl: 'outside' |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | |
|---|
| | | * @param {*} params 包含参数 range 参数值参考 116.292735,40.0717; 116.476708, 40.083625; 116.476708, 40.083625; 116.292735, 40.0717 |
|---|
| | | * @returns |
|---|
| | | */ |
|---|
| | | export const getRegionList = (page = 1, count = 15, range, requestBaseUrl = 'outside') => { |
|---|
| | | export const getRegionList = (page = 1, count = 15, range) => { |
|---|
| | | return request({ |
|---|
| | | url: '/device/query/SpatialQueryList', |
|---|
| | | method: 'get', |
|---|
| | | requestBaseUrl, |
|---|
| | | requestBaseUrl: 'outside', |
|---|
| | | params: { |
|---|
| | | page, |
|---|
| | | count, |
|---|
| | |
|---|
| | | * @Author: shuishen 1109946754@qq.com |
|---|
| | | * @Date: 2022-08-18 17:00:30 |
|---|
| | | * @LastEditors: shuishen 1109946754@qq.com |
|---|
| | | * @LastEditTime: 2022-12-15 14:46:35 |
|---|
| | | * @LastEditTime: 2022-12-19 16:50:46 |
|---|
| | | * @FilePath: \srs-police-affairs\src\components\map\index.vue |
|---|
| | | * @Description: 公用地图组件 |
|---|
| | | * |
|---|
| | |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | let terrain = global.DC.TerrainFactory.createUrlTerrain({ |
|---|
| | | url: 'http://data.marsgis.cn/terrain' |
|---|
| | | }) |
|---|
| | | global.viewer.addTerrain(terrain) |
|---|
| | | // let terrain = global.DC.TerrainFactory.createUrlTerrain({ |
|---|
| | | // url: 'http://data.marsgis.cn/terrain' |
|---|
| | | // }) |
|---|
| | | // global.viewer.addTerrain(terrain) |
|---|
| | | |
|---|
| | | // 天地图 影像 |
|---|
| | | global.viewer.imageryLayers.addImageryProvider( |
|---|
| | | new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
|---|
| | | url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e45274b0235bb913eceb393aabbf9c9c', |
|---|
| | | subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'], |
|---|
| | | format: 'image/jpeg', |
|---|
| | | show: true, |
|---|
| | | maximumLevel: 18 |
|---|
| | | }) |
|---|
| | | ) |
|---|
| | | // global.viewer.imageryLayers.addImageryProvider( |
|---|
| | | // new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
|---|
| | | // url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e45274b0235bb913eceb393aabbf9c9c', |
|---|
| | | // subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'], |
|---|
| | | // format: 'image/jpeg', |
|---|
| | | // show: true, |
|---|
| | | // maximumLevel: 18 |
|---|
| | | // }) |
|---|
| | | // ) |
|---|
| | | |
|---|
| | | |
|---|
| | | // 上饶部署，内网使用的 |
|---|
| | | // global.viewer.imageryLayers.addImageryProvider( |
|---|
| | | // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ |
|---|
| | | // url: "http://10.141.11.11:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326", |
|---|
| | | // layer: "wmts_4326_361100", |
|---|
| | | // style: "default", |
|---|
| | | // format: "image/png", |
|---|
| | | // tileMatrixSetID: "c", |
|---|
| | | // tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1), |
|---|
| | | // tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
|---|
| | | // }) |
|---|
| | | // ) |
|---|
| | | |
|---|
| | | |
|---|
| | | // global.viewer.imageryLayers.addImageryProvider( |
|---|
| | | // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ |
|---|
| | | // url: "http://192.168.0.112:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326", |
|---|
| | | // layer: "wmts_4326_361100", |
|---|
| | | // style: "default", |
|---|
| | | // format: "image/png", |
|---|
| | | // tileMatrixSetID: "c", |
|---|
| | | // tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1), |
|---|
| | | // tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
|---|
| | | // }) |
|---|
| | | // ) |
|---|
| | | global.viewer.imageryLayers.addImageryProvider( |
|---|
| | | new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ |
|---|
| | | url: "http://10.141.11.11:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326", |
|---|
| | | layer: "wmts_4326_361100", |
|---|
| | | style: "default", |
|---|
| | | format: "image/png", |
|---|
| | | tileMatrixSetID: "c", |
|---|
| | | tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1), |
|---|
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
|---|
| | | }) |
|---|
| | | ) |
|---|
| | | |
|---|
| | | // 加载顺丰底图 |
|---|
| | | // global.viewer.imageryLayers.addImageryProvider( |
|---|
| | |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // let sqTitleLayer = new global.DC.TilesetLayer('sqTitleLayer') |
|---|
| | | // global.viewer.addLayer(sqTitleLayer) |
|---|
| | | // let sqTileset = new global.DC.Tileset( |
|---|
| | | // 'http://192.168.0.112:18080/sf3d/361102/model/wanda/tileset.json' |
|---|
| | | // ) |
|---|
| | | // sqTileset.setHeight(12) |
|---|
| | | // sqTitleLayer.addOverlay(sqTileset) |
|---|
| | | let sqTitleLayer = new global.DC.TilesetLayer('sqTitleLayer') |
|---|
| | | global.viewer.addLayer(sqTitleLayer) |
|---|
| | | let sqTileset = new global.DC.Tileset( |
|---|
| | | 'http://10.141.11.11:18080/sf3d/361102/model/wanda/tileset.json' |
|---|
| | | ) |
|---|
| | | sqTileset.setHeight(12) |
|---|
| | | sqTitleLayer.addOverlay(sqTileset) |
|---|
| | | |
|---|
| | | // sqTileset.on(global.DC.MouseEventType.CLICK, (e) => { |
|---|
| | | // console.log(e) |
|---|
| | | // }) |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | let positions = [[117.951478782, 28.447896798, 0], [117.951469798, 28.447894686, 0], [117.951397357, 28.447698099, 0], [117.951505114, 28.447674695, 0], [117.951485465, 28.447619271, 0], [117.951706955, 28.447558541, 0], [117.951722755, 28.447611995, 0], [117.951834021, 28.447588427, 0], [117.951896863, 28.447789523, 0], [117.951478782, 28.447896798, 0]] |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | global.viewer.use(new global.DC.Measure()) |
|---|
| | | |
|---|
| | | // global.viewer.locationBar.enable = true |
|---|
| | | global.viewer.locationBar.enable = true |
|---|
| | | // 缩放 |
|---|
| | | global.viewer.zoomController.enable = true |
|---|
| | | // 比例尺 |
|---|
| | |
|---|
| | | // global.viewer.scene.morphTo2D(1) |
|---|
| | | |
|---|
| | | // 清除控制台 |
|---|
| | | // console.clear() |
|---|
| | | console.clear() |
|---|
| | | |
|---|
| | | function isEleFullScreen () { |
|---|
| | | const fullScreenEle = |
|---|
| | |
|---|
| | | * @Author: shuishen 1109946754@qq.com |
|---|
| | | * @Date: 2022-07-29 15:19:13 |
|---|
| | | * @LastEditors: shuishen 1109946754@qq.com |
|---|
| | | * @LastEditTime: 2022-12-13 11:11:00 |
|---|
| | | * @LastEditTime: 2022-12-16 16:48:28 |
|---|
| | | * @FilePath: \srs-police-affairs\src\router\axios.js |
|---|
| | | * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |
|---|
| | | */ |
|---|
| | |
|---|
| | | // config.baseURL = 'http://192.168.0.105:80/api' |
|---|
| | | // config.baseURL = 'http://192.168.0.115:18080/api' |
|---|
| | | // 内网部署地址 |
|---|
| | | config.baseURL = 'http://10.141.11.11:18080/api' |
|---|
| | | config.baseURL = 'http://10.141.11.11:18185/api' |
|---|
| | | // config.baseURL = 'http://192.168.0.106:1888/api' |
|---|
| | | } else if (config.requestBaseUrl == 'fengt') { |
|---|
| | | config.baseURL = 'http://10.141.11.11:18080' |
|---|
| | | } |
|---|
| | | |
|---|
| | | // const token = auth.getToken() |
|---|
| | |
|---|
| | | button { |
|---|
| | | width: countSizeVw(80, 1920); |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: 0 countSizeVh(20) countSizeVh(20) 0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | .build-info { |
|---|
| | | height: countSizeVh(100); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .nextBtn { |
|---|
| | | left: countSizeVw(1, 1920); |
|---|
| | | width: countSizeVw(20, 1920); |
|---|
| | | height: countSizeVh(60); |
|---|
| | | padding-top: countSizeVh(12); |
|---|
| | | |
|---|
| | | i { |
|---|
| | | font-size: countSizeVh(30); |
|---|
| | | margin-left: countSizeVw(-5, 1920); |
|---|
| | | .nextBtn { |
|---|
| | | left: countSizeVw(1, 1920); |
|---|
| | | width: countSizeVw(20, 1920); |
|---|
| | | height: countSizeVh(60); |
|---|
| | | padding-top: countSizeVh(12); |
|---|
| | | |
|---|
| | | i { |
|---|
| | | font-size: countSizeVh(30); |
|---|
| | | margin-left: countSizeVw(-5, 1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .rightBtn { |
|---|
| | | left: countSizeVw(369, 1920); |
|---|
| | | } |
|---|
| | | .rightBtn { |
|---|
| | | left: countSizeVw(369, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .build-outBox { |
|---|
| | | left: countSizeVw(18, 1920); |
|---|
| | | width: countSizeVw(356, 1920); |
|---|
| | | height: countSizeVh(100); |
|---|
| | | .build-outBox { |
|---|
| | | left: countSizeVw(18, 1920); |
|---|
| | | width: countSizeVw(356, 1920); |
|---|
| | | height: countSizeVh(100); |
|---|
| | | |
|---|
| | | .build-box { |
|---|
| | | .build-box { |
|---|
| | | |
|---|
| | | .ridgepole-list { |
|---|
| | | width: countSizeVw(356, 1920); |
|---|
| | | .ridgepole-list { |
|---|
| | | width: countSizeVw(356, 1920); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | margin: countSizeVh(6) countSizeVw(8, 1920); |
|---|
| | | width: countSizeVw(54, 1920); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | border: countSizeVh(1) solid #ccc; |
|---|
| | | &>div { |
|---|
| | | margin: countSizeVh(6) countSizeVw(8, 1920); |
|---|
| | | width: countSizeVw(54, 1920); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | border: countSizeVh(1) solid #ccc; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ridgepole-info { |
|---|
| | | .content { |
|---|
| | | & > div { |
|---|
| | | height: countSizeVh(26); |
|---|
| | | line-height: countSizeVh(26); |
|---|
| | | border-right: countSizeVh(1) solid #50555f; |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | margin-left: countSizeVw(14,1920); |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .people-info { |
|---|
| | | .content { |
|---|
| | | .two { |
|---|
| | | margin-top: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .one, |
|---|
| | | .two { |
|---|
| | | & > div { |
|---|
| | | & > div:first-child { |
|---|
| | | height: countSizeVh(30); |
|---|
| | | line-height: countSizeVh(30); |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | height: countSizeVh(26); |
|---|
| | | line-height: countSizeVh(26); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .house-info { |
|---|
| | | .content { |
|---|
| | | & > div { |
|---|
| | | & > div:first-child { |
|---|
| | | height: countSizeVh(30); |
|---|
| | | line-height: countSizeVh(30); |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | border-bottom: countSizeVh(1) dashed #ccc; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ridgepole-info, |
|---|
| | | .people-info, |
|---|
| | | .house-info { |
|---|
| | | .title { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .content { |
|---|
| | | padding: countSizeVh(10) 0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .house-element-info { |
|---|
| | | .condo, |
|---|
| | | .legend { |
|---|
| | | height: countSizeVh(36); |
|---|
| | | |
|---|
| | | .type { |
|---|
| | | width: countSizeVw(80,1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .type-select { |
|---|
| | | margin-left: countSizeVw(20,1920); |
|---|
| | | |
|---|
| | | :deep(.el-input--suffix .el-input__inner) { |
|---|
| | | padding-right: countSizeVw(54,1920); |
|---|
| | | } |
|---|
| | | .el-input--small{ |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | } |
|---|
| | | .el-select:hover .el-input__inner{ |
|---|
| | | height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | .el-input--small .el-input__inner { |
|---|
| | | height: countSizeVh(36); |
|---|
| | | |
|---|
| | | } |
|---|
| | | .el-input__suffix{ |
|---|
| | | height: countSizeVh(36); |
|---|
| | | margin-right: countSizeVw(6,1920); |
|---|
| | | .el-icon-arrow-up:before{ |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .type-val { |
|---|
| | | & > div { |
|---|
| | | & > span { |
|---|
| | | margin: 0 countSizeVw(10,1920); |
|---|
| | | width: countSizeVw(14,1920); |
|---|
| | | height: countSizeVh(8); |
|---|
| | | } |
|---|
| | | .chuzu { |
|---|
| | | border: countSizeVh(1) solid #348b3a; |
|---|
| | | } |
|---|
| | | .zizhu { |
|---|
| | | border: countSizeVh(1) solid #2c77bb; |
|---|
| | | } |
|---|
| | | .kongzhi { |
|---|
| | | border: countSizeVh(1) solid #5c6169; |
|---|
| | | } |
|---|
| | | .shangye { |
|---|
| | | border: countSizeVh(1) solid #cc9456; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .floor-outBox { |
|---|
| | | height: countSizeVh(26); |
|---|
| | | margin-top: countSizeVh(9); |
|---|
| | | |
|---|
| | | .floorBtn { |
|---|
| | | left: countSizeVw(30,1920); |
|---|
| | | top: -countSizeVh(2); |
|---|
| | | width: countSizeVw(20,1920); |
|---|
| | | height: countSizeVh(26); |
|---|
| | | |
|---|
| | | i { |
|---|
| | | font-size: countSizeVh(30); |
|---|
| | | margin-left: -countSizeVw(5,1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .rightFloorBtn { |
|---|
| | | left: countSizeVw(350,1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .floor-box { |
|---|
| | | width: countSizeVw(252,1920); |
|---|
| | | height: countSizeVh(26); |
|---|
| | | left: countSizeVw(67,1920); |
|---|
| | | |
|---|
| | | .floor-num { |
|---|
| | | width: countSizeVw(504,1920); |
|---|
| | | left: 0; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | margin: 0 countSizeVw(4,1920); |
|---|
| | | width: countSizeVw(84,1920); |
|---|
| | | height: countSizeVh(26); |
|---|
| | | border-radius: countSizeVh(13); |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .on { |
|---|
| | | border: countSizeVh(1) solid orange; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .floor-detail { |
|---|
| | | margin-top: countSizeVh(14); |
|---|
| | | height: countSizeVh(220); |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | margin: countSizeVh(8); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | width: countSizeVw(50,1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .detail { |
|---|
| | | & > div { |
|---|
| | | margin: 0 countSizeVw(4,1920); |
|---|
| | | width: countSizeVw(68,1920); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | border: countSizeVh(1) solid #ccc; |
|---|
| | | |
|---|
| | | .flow, |
|---|
| | | .focus, |
|---|
| | | .warning { |
|---|
| | | right: countSizeVw(4,1920); |
|---|
| | | width: countSizeVw(6,1920); |
|---|
| | | height: countSizeVh(6); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .flow { |
|---|
| | | top: calc((100% - countSizeVh(18)) / 4); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .focus { |
|---|
| | | top: calc( |
|---|
| | | (100% - countSizeVh(18)) / 4 * 2 + countSizeVh(6) |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .warning { |
|---|
| | | top: calc( |
|---|
| | | (100% - countSizeVh(18)) / 4 * 3 + countSizeVh(12) |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .chuzu { |
|---|
| | | border: countSizeVh(1) solid #3a8b3a; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .zizhu { |
|---|
| | | border: countSizeVh(1) solid #2c77bb; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .kongzhi { |
|---|
| | | border: countSizeVh(1) solid #5c6169; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .shangye { |
|---|
| | | border: countSizeVh(1) solid #cc9456; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .police-info { |
|---|
| | | .tableClass { |
|---|
| | | width: countSizeVw(600,1920); |
|---|
| | | height: countSizeVh(400); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .tableClass th, |
|---|
| | | .tableClass td { |
|---|
| | | width: countSizeVw(200,1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .search-content { |
|---|
| | | left: countSizeVw(760, 1920); |
|---|
| | | top: countSizeVh(40); |
|---|
| | | width: countSizeVh(460); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | |
|---|
| | | input { |
|---|
| | | width: calc(100% - countSizeVw(80, 1920)); |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: countSizeVh(20) 0 0 countSizeVh(20); |
|---|
| | | // vertical-align: top; |
|---|
| | | } |
|---|
| | | |
|---|
| | | button { |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | width: countSizeVw(80, 1920); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: 0 countSizeVh(20) countSizeVh(20) 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | button:active { |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .searchExtensively-val-box { |
|---|
| | | top: countSizeVh(80); |
|---|
| | | left: countSizeVw(760,1920); |
|---|
| | | width: countSizeVw(314,1920); |
|---|
| | | max-height: countSizeVh(200); |
|---|
| | | border-radius: countSizeVh(10); |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | div { |
|---|
| | | padding: 0 countSizeVw(10,1920); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .el-table .el-table__cell { |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell { |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table .el-table__cell { |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table .el-table__cell { |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .option-css,.activity-option { |
|---|
| | | .option-css,.activity-option,.unit-option{ |
|---|
| | | height: countSizeVh(40); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | |
|---|
| | | } |
|---|
| | | .el-picker-panel .el-date-range-picker__header button { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| New file |
| | |
|---|
| | | @media screen and (min-width: 1920px) { |
|---|
| | | |
|---|
| | | html, |
|---|
| | | body { |
|---|
| | | font-size: countSizeVh(16) !important; |
|---|
| | | |
|---|
| | | #app { |
|---|
| | | width: 100vw; |
|---|
| | | height: 100vh; |
|---|
| | | |
|---|
| | | .wrapper { |
|---|
| | | width: 100vw; |
|---|
| | | height: 100vh; |
|---|
| | | |
|---|
| | | .main-header { |
|---|
| | | width: 100vw; |
|---|
| | | height: countSizeVh(60); |
|---|
| | | line-height: countSizeVh(60); |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .menu-list.left { |
|---|
| | | margin-left: countSizeVh(72); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .menu-list.right { |
|---|
| | | margin-right: countSizeVh(72); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .menu-list { |
|---|
| | | |
|---|
| | | .nav-list { |
|---|
| | | width: countSizeVw(132, 1920); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | |
|---|
| | | .sub-nav-list { |
|---|
| | | border-top: countSizeVh(14) solid transparent; |
|---|
| | | top: countSizeVh(28); |
|---|
| | | left: countSizeVw(72, 1920); |
|---|
| | | |
|---|
| | | div { |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | div:first-child { |
|---|
| | | padding-top: countSizeVh(10); |
|---|
| | | } |
|---|
| | | |
|---|
| | | div:last-child { |
|---|
| | | padding-bottom: countSizeVh(10); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .main-content { |
|---|
| | | top: countSizeVh(60); |
|---|
| | | height: calc(100% - countSizeVh(60)); |
|---|
| | | |
|---|
| | | .home-page { |
|---|
| | | |
|---|
| | | .left-container, |
|---|
| | | .right-container { |
|---|
| | | top: countSizeVh(60); |
|---|
| | | width: countSizeVw(400, 1920); |
|---|
| | | height: calc(100% - countSizeVh(60)); |
|---|
| | | |
|---|
| | | .person-box, |
|---|
| | | .land-box, |
|---|
| | | .case-box, |
|---|
| | | .crowd-box { |
|---|
| | | height: countSizeVh(320); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .person-box, |
|---|
| | | .house-box, |
|---|
| | | .land-box, |
|---|
| | | .case-box, |
|---|
| | | .alert-box, |
|---|
| | | .crowd-box { |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | padding: 0 countSizeVw(18, 1920) 0 countSizeVw(18, 1920); |
|---|
| | | height: countSizeVh(58); |
|---|
| | | line-height: countSizeVh(58); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .sub-title { |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .sub-tab { |
|---|
| | | padding: countSizeVh(10); |
|---|
| | | |
|---|
| | | .tab { |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | height: countSizeVh(22); |
|---|
| | | line-height: countSizeVh(22); |
|---|
| | | } |
|---|
| | | |
|---|
| | | &>div.tab-title-small { |
|---|
| | | height: maxCountSizeVh(32); |
|---|
| | | line-height: maxCountSizeVh(32); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .house-box, |
|---|
| | | .alert-box { |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | height: countSizeVh(62); |
|---|
| | | line-height: countSizeVh(62); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bottom-container { |
|---|
| | | left: countSizeVw(400, 1920); |
|---|
| | | width: calc(100% - countSizeVw(400, 1920) * 2); |
|---|
| | | height: countSizeVh(320); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .region-select { |
|---|
| | | top: countSizeVh(20); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .center-container { |
|---|
| | | bottom: countSizeVh(340); |
|---|
| | | |
|---|
| | | .layers-control-btn { |
|---|
| | | width: countSizeVw(96, 1920); |
|---|
| | | height: countSizeVh(40); |
|---|
| | | border-radius: countSizeVh(20) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-checkbox__inner { |
|---|
| | | width: countSizeVh(20); |
|---|
| | | height: countSizeVh(20); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-checkbox__label { |
|---|
| | | font-size: countSizeVh(16) !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .house-page { |
|---|
| | | .container-content { |
|---|
| | | |
|---|
| | | .search-box { |
|---|
| | | height: countSizeVh(48); |
|---|
| | | |
|---|
| | | input { |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | } |
|---|
| | | |
|---|
| | | button { |
|---|
| | | width: countSizeVw(80, 1920); |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search-val-box { |
|---|
| | | top: countSizeVh(48); |
|---|
| | | left: countSizeVw(6, 1920); |
|---|
| | | width: calc(100% - 2 * countSizeVw(6, 1920)); |
|---|
| | | max-height: countSizeVh(160); |
|---|
| | | border-radius: countSizeVh(10); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | div { |
|---|
| | | padding: 0 countSizeVw(10, 1920); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .result-content { |
|---|
| | | height: calc(100% - countSizeVh(48)); |
|---|
| | | |
|---|
| | | .housing-estate-info { |
|---|
| | | |
|---|
| | | .housing-title { |
|---|
| | | padding: 0 countSizeVw(10, 1920); |
|---|
| | | height: countSizeVh(40); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | font-size: countSizeVh(28); |
|---|
| | | |
|---|
| | | &::after { |
|---|
| | | top: countSizeVh(18); |
|---|
| | | left: countSizeVw(10, 1920); |
|---|
| | | right: countSizeVw(10, 1920); |
|---|
| | | top: countSizeVh(4); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .housing-bg { |
|---|
| | | margin-top: countSizeVh(6); |
|---|
| | | height: countSizeVh(200); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .housing-introduce { |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | padding: 0 countSizeVw(10, 1920); |
|---|
| | | |
|---|
| | | .l { |
|---|
| | | width: countSizeVw(80, 1920); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .r { |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .nav-tab { |
|---|
| | | |
|---|
| | | .nav { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | border-bottom: countSizeVh(1) solid #33566c; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .base-info { |
|---|
| | | |
|---|
| | | .sub-nav-list { |
|---|
| | | padding: countSizeVw(14, 1920) 0; |
|---|
| | | |
|---|
| | | .sub-nav { |
|---|
| | | width: countSizeVw(76, 1920); |
|---|
| | | height: countSizeVh(26); |
|---|
| | | line-height: countSizeVh(26); |
|---|
| | | border-radius: countSizeVh(13); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | border: countSizeVh(1) solid #fff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &>.floor-content { |
|---|
| | | |
|---|
| | | .build-info { |
|---|
| | | height: countSizeVh(100); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .nextBtn { |
|---|
| | | left: countSizeVw(1, 1920); |
|---|
| | | width: countSizeVw(20, 1920); |
|---|
| | | height: countSizeVh(60); |
|---|
| | | padding-top: countSizeVh(12); |
|---|
| | | |
|---|
| | | i { |
|---|
| | | font-size: countSizeVh(30); |
|---|
| | | margin-left: countSizeVw(-5, 1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .rightBtn { |
|---|
| | | left: countSizeVw(369, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .build-outBox { |
|---|
| | | left: countSizeVw(18, 1920); |
|---|
| | | width: countSizeVw(356, 1920); |
|---|
| | | height: countSizeVh(100); |
|---|
| | | |
|---|
| | | .build-box { |
|---|
| | | |
|---|
| | | .ridgepole-list { |
|---|
| | | width: countSizeVw(356, 1920); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | margin: countSizeVh(6) countSizeVw(8, 1920); |
|---|
| | | width: countSizeVw(54, 1920); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | border: countSizeVh(1) solid #ccc; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .police-page { |
|---|
| | | .switch-box { |
|---|
| | | padding: countSizeVh(6); |
|---|
| | | |
|---|
| | | .el-input__inner { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-icon-arrow-up:before { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-input__suffix { |
|---|
| | | right: countSizeVw(5, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-select-dropdown__wrap { |
|---|
| | | height: countSizeVh(274); |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .list-show { |
|---|
| | | height: calc(100% - countSizeVh(50)); |
|---|
| | | |
|---|
| | | .search-box { |
|---|
| | | padding: countSizeVh(6) countSizeVw(6, 1920); |
|---|
| | | height: countSizeVh(46); |
|---|
| | | |
|---|
| | | input { |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | border-radius: countSizeVh(20) 0 0 countSizeVw(20, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | button { |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | width: countSizeVw(80, 1920); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: 0 countSizeVw(20, 1920) countSizeVh(20) 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | button:active { |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search-val-box { |
|---|
| | | top: countSizeVh(48); |
|---|
| | | left: countSizeVw(6, 1920); |
|---|
| | | width: calc(100% - countSizeVw(12, 1920)); |
|---|
| | | max-height: countSizeVh(160); |
|---|
| | | border-radius: countSizeVh(10) countSizeVw(10, 1920); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | padding: 0 countSizeVw(10, 1920); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .list { |
|---|
| | | height: calc(100% - countSizeVh(48)); |
|---|
| | | |
|---|
| | | .el-button--text { |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .pages { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | &>button { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | |
|---|
| | | &>i { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &>ul { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | li { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .state-box { |
|---|
| | | width: countSizeVw(20, 1920); |
|---|
| | | height: countSizeVh(20); |
|---|
| | | line-height: countSizeVh(20); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__header-wrapper { |
|---|
| | | height: countSizeVh(48); |
|---|
| | | |
|---|
| | | .el-table__header { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table .cell { |
|---|
| | | line-height: countSizeVh(48); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell>.cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__empty-text { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .track-box { |
|---|
| | | height: calc(100% - countSizeVh(50)); |
|---|
| | | |
|---|
| | | .back-btn { |
|---|
| | | height: countSizeVh(42); |
|---|
| | | line-height: countSizeVh(42); |
|---|
| | | border-bottom: countSizeVh(1) solid #fff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .back-btn::before { |
|---|
| | | height: countSizeVh(28); |
|---|
| | | line-height: countSizeVh(28); |
|---|
| | | top: countSizeVh(4); |
|---|
| | | left: countSizeVw(8, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | li { |
|---|
| | | padding: 0 countSizeVw(4, 1920); |
|---|
| | | height: countSizeVh(42); |
|---|
| | | line-height: countSizeVh(42); |
|---|
| | | border-bottom: countSizeVh(1) solid #fff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | li:last-child { |
|---|
| | | .el-button { |
|---|
| | | width: countSizeVw(68, 1920); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .video-page { |
|---|
| | | .list { |
|---|
| | | .search-box { |
|---|
| | | padding: countSizeVw(6, 1920) countSizeVh(6); |
|---|
| | | height: countSizeVh(52); |
|---|
| | | |
|---|
| | | input { |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: countSizeVh(20) 0 0 countSizeVw(20, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | button { |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | width: countSizeVw(80, 1920); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: 0 countSizeVw(20, 1920) countSizeVh(20) 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | button:active { |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search-val-box { |
|---|
| | | top: countSizeVh(48); |
|---|
| | | left: countSizeVw(6, 1920); |
|---|
| | | width: calc(100% - countSizeVw(12, 1920)); |
|---|
| | | max-height: countSizeVh(160); |
|---|
| | | border-radius: countSizeVh(10) countSizeVw(10, 1920); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | padding: 0 countSizeVw(10, 1920); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .draw-btn { |
|---|
| | | margin: countSizeVh(8) countSizeVw(8, 1920); |
|---|
| | | height: countSizeVh(26); |
|---|
| | | .el-button--mini{ |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | padding: countSizeVh(8) 0; |
|---|
| | | border-radius: countSizeVh(4); |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .range-input { |
|---|
| | | right: countSizeVw(-190, 1920); |
|---|
| | | top: countSizeVh(20); |
|---|
| | | width: countSizeVw(180, 1920); |
|---|
| | | height: countSizeVh(100); |
|---|
| | | |
|---|
| | | input { |
|---|
| | | border: countSizeVh(1) solid #005ca9; |
|---|
| | | width: countSizeVw(160, 1920); |
|---|
| | | height: countSizeVh(30); |
|---|
| | | margin-top: countSizeVh(10); |
|---|
| | | padding-left: countSizeVw(6, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn { |
|---|
| | | width: countSizeVw(60, 1920); |
|---|
| | | height: countSizeVh(30); |
|---|
| | | border-radius: countSizeVh(4); |
|---|
| | | margin-top: countSizeVh(10); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .close { |
|---|
| | | width: countSizeVw(20, 1920); |
|---|
| | | height: countSizeVh(10); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .close::before { |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .list-show { |
|---|
| | | .pages { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | &>button { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | |
|---|
| | | &>i { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &>ul { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | li { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__header-wrapper { |
|---|
| | | height: countSizeVh(48); |
|---|
| | | |
|---|
| | | .el-table__header { |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table .cell { |
|---|
| | | line-height: countSizeVh(48); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell>.cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__empty-text { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .region { |
|---|
| | | .left-container { |
|---|
| | | .search-box { |
|---|
| | | padding: countSizeVw(6, 1920) countSizeVh(6); |
|---|
| | | height: countSizeVh(52); |
|---|
| | | |
|---|
| | | input { |
|---|
| | | font-size: countSizeVh(18); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: countSizeVh(20) 0 0 countSizeVw(20, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | button { |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | width: countSizeVw(80, 1920); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: 0 countSizeVw(20, 1920) countSizeVh(20) 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | button:active { |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search-val-box { |
|---|
| | | top: countSizeVh(48); |
|---|
| | | left: countSizeVw(6, 1920); |
|---|
| | | width: calc(100% - countSizeVw(12, 1920)); |
|---|
| | | max-height: countSizeVh(160); |
|---|
| | | border-radius: countSizeVh(10) countSizeVw(10, 1920); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | padding: 0 countSizeVw(10, 1920); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .list-show { |
|---|
| | | &>div { |
|---|
| | | .list-box { |
|---|
| | | .btn { |
|---|
| | | width: 60px; |
|---|
| | | height: countSizeVh(30); |
|---|
| | | border-radius: countSizeVh(4) countSizeVw(4, 1920); |
|---|
| | | margin-top: countSizeVh(10); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn:active { |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__header-wrapper { |
|---|
| | | height: countSizeVh(48); |
|---|
| | | |
|---|
| | | .el-table__header { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table .cell { |
|---|
| | | line-height: countSizeVh(48); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th.el-table__cell>.cell { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__empty-text { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .pages { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | &>button { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | |
|---|
| | | &>i { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &>ul { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | li { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .activity-page { |
|---|
| | | .container-content { |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | letter-spacing: countSizeVw(20, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .search-box { |
|---|
| | | padding: 0 countSizeVw(10, 1920); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | margin-top: countSizeVh(10); |
|---|
| | | |
|---|
| | | .category { |
|---|
| | | width: countSizeVw(88, 1920); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | .category-value{ |
|---|
| | | .category-input { |
|---|
| | | width: 80%; |
|---|
| | | height: countSizeVh(32); |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: countSizeVh(5) 0 0 countSizeVw(5, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .category-button { |
|---|
| | | font-size: countSizeVh(20); |
|---|
| | | // width: countSizeVw(60, 1920); |
|---|
| | | width: 20%; |
|---|
| | | height: countSizeVh(32); |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | border-radius: 0 countSizeVw(5, 1920) countSizeVh(5) 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .category-button:active { |
|---|
| | | border: countSizeVh(1) solid rgb(0, 92, 169); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-range-editor.el-input__inner{ |
|---|
| | | width: 100%!important; |
|---|
| | | height: countSizeVh(32); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-range-editor .el-range-input{ |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-icon-date:before{ |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-date-editor .el-range__icon{ |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | margin-left: countSizeVw(4, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-date-editor .el-range-separator{ |
|---|
| | | height: countSizeVh(32); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-select { |
|---|
| | | width: 100%; |
|---|
| | | height: countSizeVh(32); |
|---|
| | | } |
|---|
| | | .el-input--suffix .el-input__inner{ |
|---|
| | | height: countSizeVh(32); |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | padding-left: countSizeVw(10, 1920); |
|---|
| | | } |
|---|
| | | .el-select .el-input .el-select__caret{ |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .result-content { |
|---|
| | | margin-top: countSizeVh(8); |
|---|
| | | |
|---|
| | | .table-box { |
|---|
| | | |
|---|
| | | .row-box { |
|---|
| | | margin: countSizeVh(10) countSizeVw(10, 1920); |
|---|
| | | padding: countSizeVh(10) countSizeVw(10, 1920); |
|---|
| | | font-size: countSizeVh(14); |
|---|
| | | |
|---|
| | | .row-content { |
|---|
| | | &>div { |
|---|
| | | line-height: countSizeVh(28); |
|---|
| | | |
|---|
| | | .category { |
|---|
| | | width: countSizeVw(88, 1920); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .tableClass { |
|---|
| | | width: countSizeVw(400, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .tableClass td { |
|---|
| | | width: countSizeVw(300, 1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .pages { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | &>button { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | |
|---|
| | | &>i { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | &>ul { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | li { |
|---|
| | | width: countSizeVh(32); |
|---|
| | | height: countSizeVh(32); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .draw-btn-box { |
|---|
| | | bottom: countSizeVh(40); |
|---|
| | | |
|---|
| | | ul { |
|---|
| | | li { |
|---|
| | | button { |
|---|
| | | width: countSizeVw(60, 1920); |
|---|
| | | height: countSizeVh(30); |
|---|
| | | margin: 0 countSizeVw(5, 1920); |
|---|
| | | border: countSizeVh(1) solid #cecece; |
|---|
| | | border-radius: countSizeVh(4) countSizeVw(4, 1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .second-container { |
|---|
| | | top: countSizeVh(10); |
|---|
| | | width: countSizeVw(240, 1920); |
|---|
| | | |
|---|
| | | .el-tree-node__content{ |
|---|
| | | height: countSizeVh(30); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | .el-tree-node__label{ |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | .el-checkbox .el-checkbox__inner{ |
|---|
| | | height: countSizeVh(20); |
|---|
| | | width: countSizeVh(20); |
|---|
| | | border-radius: countSizeVh(2); |
|---|
| | | } |
|---|
| | | .el-tree-node__expand-icon{ |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | |
|---|
| | | } |
|---|
| | | .el-checkbox .el-checkbox__inner::after{ |
|---|
| | | height: countSizeVh(16); |
|---|
| | | left:countSizeVw(7, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .second-container.spread { |
|---|
| | | left: countSizeVw(410, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .second-container.take-back { |
|---|
| | | left: countSizeVw(10, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .activity-details-box { |
|---|
| | | top: countSizeVh(90); |
|---|
| | | right: countSizeVw(10, 1920); |
|---|
| | | width: countSizeVw(400, 1920); |
|---|
| | | padding: countSizeVh(10) countSizeVw(10, 1920); |
|---|
| | | border-radius: countSizeVh(10) countSizeVw(10, 1920); |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .row-box { |
|---|
| | | line-height: countSizeVh(28); |
|---|
| | | |
|---|
| | | .category { |
|---|
| | | width: countSizeVw(96, 1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn-box { |
|---|
| | | top: countSizeVh(78); |
|---|
| | | min-height: countSizeVh(40); |
|---|
| | | padding: countSizeVh(10) countSizeVw(10, 1920) 0 countSizeVw(10, 1920); |
|---|
| | | border-radius: countSizeVw(10, 1920); |
|---|
| | | |
|---|
| | | ul { |
|---|
| | | li { |
|---|
| | | button { |
|---|
| | | width: countSizeVw(60, 1920); |
|---|
| | | height: countSizeVh(30); |
|---|
| | | margin: 0 countSizeVw(5, 1920); |
|---|
| | | border: countSizeVh(1) solid #cecece; |
|---|
| | | border-radius: countSizeVw(4, 1920); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .flexible-btn{ |
|---|
| | | font-size: countSizeVh(24); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .main-content.spread { |
|---|
| | | width: countSizeVw(400, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .flexible-btn { |
|---|
| | | padding: 0 countSizeVw(2, 1920); |
|---|
| | | width: countSizeVw(32, 1920); |
|---|
| | | height: countSizeVh(64); |
|---|
| | | line-height: countSizeVh(32); |
|---|
| | | border-radius: 0 countSizeVh(5) countSizeVh(5) 0; |
|---|
| | | box-shadow: countSizeVh(1) 0px countSizeVh(4) countSizeVh(1) $bg-color; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .flexible-btn.spread { |
|---|
| | | left: countSizeVw(400, 1920); |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 地图，控制按钮 |
|---|
| | | .screen-full-btn { |
|---|
| | | left: countSizeVh(10); |
|---|
| | | bottom: countSizeVh(10); |
|---|
| | | width: countSizeVh(36); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | font-size: countSizeVh(20); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .screen-full-btn.homebottom { |
|---|
| | | left: countSizeVw(402, 1920) !important; |
|---|
| | | bottom: countSizeVh(340); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .screen-full-btn.shrink-btn { |
|---|
| | | left: countSizeVw(410, 1920) !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .dc-zoom-controller { |
|---|
| | | left: countSizeVh(10) !important; |
|---|
| | | bottom: countSizeVh(56) !important; |
|---|
| | | width: countSizeVh(36) !important; |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | width: countSizeVh(36) !important; |
|---|
| | | height: countSizeVh(36) !important; |
|---|
| | | |
|---|
| | | svg { |
|---|
| | | width: countSizeVh(20) !important; |
|---|
| | | height: countSizeVh(20) !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .dc-zoom-controller.homebottom { |
|---|
| | | left: countSizeVw(402, 1920) !important; |
|---|
| | | bottom: countSizeVh(386) !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .dc-zoom-controller.shrink-btn { |
|---|
| | | left: countSizeVw(410, 1920) !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .image-switch-icon-btn { |
|---|
| | | left: countSizeVh(10); |
|---|
| | | bottom: countSizeVh(178); |
|---|
| | | width: countSizeVh(36); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | font-size: countSizeVh(20); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .image-switch-icon-btn.iconbottom { |
|---|
| | | left: countSizeVw(402, 1920) !important; |
|---|
| | | bottom: countSizeVh(506) !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .image-switch-icon-btn.shrink-btn { |
|---|
| | | left: countSizeVw(410, 1920) !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .dc-location-bar.homebottom { |
|---|
| | | bottom: countSizeVh(390) !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .image-switch-img-btn { |
|---|
| | | left: countSizeVw(46, 1920); |
|---|
| | | bottom: countSizeVh(190); |
|---|
| | | font-size: countSizeVh(20); |
|---|
| | | border-radius: countSizeVh(5); |
|---|
| | | |
|---|
| | | .img, |
|---|
| | | .elec { |
|---|
| | | width: countSizeVh(80); |
|---|
| | | height: countSizeVh(60); |
|---|
| | | border: countSizeVh(2) solid $table-header-bg-color; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | right: countSizeVh(2); |
|---|
| | | bottom: countSizeVh(2); |
|---|
| | | padding: 0 countSizeVh(2); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .image-switch-img-btn.imgbottom { |
|---|
| | | left: countSizeVw(446, 1920); |
|---|
| | | bottom: countSizeVh(480); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .image-switch-img-btn.shrink-btn { |
|---|
| | | left: countSizeVw(454, 1920); |
|---|
| | | bottom: countSizeVh(154); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .option-css,.activity-option { |
|---|
| | | height: countSizeVh(40); |
|---|
| | | line-height: countSizeVh(40); |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | .option-css:hover,.option-css.selected { |
|---|
| | | color: #409EFF; |
|---|
| | | } |
|---|
| | | .option-css:hover { |
|---|
| | | background-color:rgba(0, 92, 169, 0.3) !important; |
|---|
| | | } |
|---|
| | | .el-select-dropdown__wrap { |
|---|
| | | max-height: countSizeVh(200); |
|---|
| | | } |
|---|
| | | .el-picker-panel{ |
|---|
| | | width: countSizeVw(536, 1920)!important; |
|---|
| | | } |
|---|
| | | .el-date-range-picker__header div{ |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | |
|---|
| | | } |
|---|
| | | .el-picker-panel .el-date-range-picker__header button { |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | height: countSizeVh(36); |
|---|
| | | line-height: countSizeVh(36); |
|---|
| | | } |
|---|
| | | .el-date-table td span,.el-date-table th{ |
|---|
| | | font-size: countSizeVh(16); |
|---|
| | | } |
|---|
| | | .el-date-table tr{ |
|---|
| | | height: countSizeVh(22); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | @media screen and (max-height: 975px) { |
|---|
| | | .left-container { |
|---|
| | | .mypath { |
|---|
| | | transform-origin: top; |
|---|
| | | transform: scale(1.1, 1); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | @media screen and (min-width: 7296px) { |
|---|
| | | |
|---|
| | | html, |
|---|
| | | body { |
|---|
| | | font-size: countSizeVh(16) !important; |
|---|
| | | |
|---|
| | | #app { |
|---|
| | | width: 100vw; |
|---|
| | | height: 100vh; |
|---|
| | | |
|---|
| | | .wrapper { |
|---|
| | | width: 100vw; |
|---|
| | | height: 100vh; |
|---|
| | | |
|---|
| | | .main-header { |
|---|
| | | width: 100vw; |
|---|
| | | height: maxCountSizeVh(60); |
|---|
| | | |
|---|
| | | .user-infor { |
|---|
| | | width: maxCountSizeVh(60); |
|---|
| | | height: maxCountSizeVh(60); |
|---|
| | | line-height: maxCountSizeVh(60); |
|---|
| | | font-size: 2.16vh; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .main-content { |
|---|
| | | top: maxCountSizeVh(60); |
|---|
| | | height: calc(100% - maxCountSizeVh(60)); |
|---|
| | | |
|---|
| | | .left-container, |
|---|
| | | .right-container { |
|---|
| | | top: maxCountSizeVh(60); |
|---|
| | | width: countSizeVw(1520, 7296); |
|---|
| | | height: calc(100% - maxCountSizeVh(60)); |
|---|
| | | |
|---|
| | | .person-box, |
|---|
| | | .land-box, |
|---|
| | | .case-box, |
|---|
| | | .crowd-box { |
|---|
| | | height: maxCountSizeVh(320); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | .person-box, |
|---|
| | | .house-box, |
|---|
| | | .land-box, |
|---|
| | | .case-box, |
|---|
| | | .alert-box, |
|---|
| | | .crowd-box { |
|---|
| | | |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | height: maxCountSizeVh(54); |
|---|
| | | line-height: maxCountSizeVh(54); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .sub-title { |
|---|
| | | line-height: maxCountSizeVh(36); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .sub-tab { |
|---|
| | | padding: maxCountSizeVh(10); |
|---|
| | | |
|---|
| | | .tab { |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | height: maxCountSizeVh(22); |
|---|
| | | line-height: maxCountSizeVh(22); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .house-box { |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | height: countSizeVh(54); |
|---|
| | | line-height: countSizeVh(54); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bottom-container { |
|---|
| | | left: countSizeVw(1520, 7296); |
|---|
| | | width: calc(100% - countSizeVw(1520, 7296) * 2); |
|---|
| | | height: maxCountSizeVh(320); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .region-select { |
|---|
| | | top: maxCountSizeVh(20); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| New file |
| | |
|---|
| | | /* |
|---|
| | | * @Author: shuishen 1109946754@qq.com |
|---|
| | | * @Date: 2022-10-21 16:42:56 |
|---|
| | | * @LastEditors: shuishen 1109946754@qq.com |
|---|
| | | * @LastEditTime: 2022-10-21 16:43:01 |
|---|
| | | * @FilePath: \sd-jg-school-web\src\utils\devicePixelRatio.js |
|---|
| | | * @Description: |
|---|
| | | * |
|---|
| | | * Copyright (c) 2022 by shuishen 1109946754@qq.com, All Rights Reserved. |
|---|
| | | */ |
|---|
| | | class DevicePixelRatio { |
|---|
| | | constructor() { |
|---|
| | | // this.flag = false |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 获取系统类型 |
|---|
| | | _getSystem () { |
|---|
| | | const flag = false |
|---|
| | | var agent = navigator.userAgent.toLowerCase() |
|---|
| | | // var isMac = /macintosh|mac os x/i.test(navigator.userAgent); |
|---|
| | | // if(isMac) { |
|---|
| | | // return false; |
|---|
| | | // } |
|---|
| | | // 现只针对windows处理，其它系统暂无该情况，如有，继续在此添加 |
|---|
| | | if (agent.indexOf('windows') >= 0) { |
|---|
| | | return true |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 获取页面缩放比例 |
|---|
| | | // _getDevicePixelRatio() { |
|---|
| | | // let t = this; |
|---|
| | | // } |
|---|
| | | // 监听方法兼容写法 |
|---|
| | | _addHandler (element, type, handler) { |
|---|
| | | if (element.addEventListener) { |
|---|
| | | element.addEventListener(type, handler, false) |
|---|
| | | } else if (element.attachEvent) { |
|---|
| | | element.attachEvent('on' + type, handler) |
|---|
| | | } else { |
|---|
| | | element['on' + type] = handler |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 校正浏览器缩放比例 |
|---|
| | | _correct () { |
|---|
| | | const t = this |
|---|
| | | // 页面devicePixelRatio（设备像素比例）变化后，计算页面body标签zoom修改其大小，来抵消devicePixelRatio带来的变化。 |
|---|
| | | document.getElementsByTagName('body')[0].style.zoom = 1 / window.devicePixelRatio |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 监听页面缩放 |
|---|
| | | _watch () { |
|---|
| | | const t = this |
|---|
| | | t._addHandler(window, 'resize', function () { // 注意这个方法是解决全局有两个window.resize |
|---|
| | | // 重新校正 |
|---|
| | | t._correct() |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 初始化页面比例 |
|---|
| | | init () { |
|---|
| | | const t = this |
|---|
| | | if (t._getSystem()) { // 判断设备，目前只在windows系统下校正浏览器缩放比例 |
|---|
| | | // 初始化页面校正浏览器缩放比例 |
|---|
| | | t._correct() |
|---|
| | | // 开启监听页面缩放 |
|---|
| | | t._watch() |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | export default DevicePixelRatio |
|---|
| | |
|---|
| | | <div id="PersonEcharts" class="echarts-box"></div> |
|---|
| | | <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin"></div> |
|---|
| | | |
|---|
| | | <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;"> |
|---|
| | | <!-- <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;"> |
|---|
| | | <defs> |
|---|
| | | <linearGradient id="linear" x1="0%" y1="0%" x2="100%" y2="0%"> |
|---|
| | | <stop offset="0%" stop-color="#fff" /> |
|---|
| | |
|---|
| | | c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0 |
|---|
| | | c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0 |
|---|
| | | c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z" /> |
|---|
| | | </svg> |
|---|
| | | </svg> --> |
|---|
| | | </div> |
|---|
| | | <div class="house-box" style="position: relative;"> |
|---|
| | | <div class="title">现有房屋</div> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="houseEcharts" class="echarts-box"></div> |
|---|
| | | <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;"> |
|---|
| | | <!-- <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;"> |
|---|
| | | <path stroke-linecap="round" class="mypath" |
|---|
| | | d="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5 |
|---|
| | | c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0 |
|---|
| | | c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0 |
|---|
| | | c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0 |
|---|
| | | c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z" /> |
|---|
| | | </svg> |
|---|
| | | </svg> --> |
|---|
| | | </div> |
|---|
| | | <div class="land-box" style="position: relative;"> |
|---|
| | | <div class="title">现有地</div> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="landEcharts" class="echarts-box"></div> |
|---|
| | | <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;"> |
|---|
| | | <!-- <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;"> |
|---|
| | | <path stroke-linecap="round" class="mypath" |
|---|
| | | d="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5 |
|---|
| | | c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0 |
|---|
| | | c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0 |
|---|
| | | c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0 |
|---|
| | | c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z" /> |
|---|
| | | </svg> |
|---|
| | | </svg> --> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | |
|---|
| | | * @Author: shuishen 1109946754@qq.com |
|---|
| | | * @Date: 2022-08-18 16:18:17 |
|---|
| | | * @LastEditors: shuishen 1109946754@qq.com |
|---|
| | | * @LastEditTime: 2022-12-08 15:28:47 |
|---|
| | | * @LastEditTime: 2022-12-19 16:51:19 |
|---|
| | | * @FilePath: \srs-police-affairs\src\views\house\index.vue |
|---|
| | | * @Description: 小区-栋-层-房屋 |
|---|
| | | * |
|---|
| | |
|---|
| | | <!-- <input v-model="searchValue" @input="searchChange" type="text" placeholder="请输入搜索条件" /> |
|---|
| | | <button @click="searchClick" class="el-icon-search"></button>--> |
|---|
| | | |
|---|
| | | <el-popover |
|---|
| | | ref="popover" |
|---|
| | | placement="bottom" |
|---|
| | | trigger="click" |
|---|
| | | :visible-arrow="false" |
|---|
| | | popper-class="tree-search-popup" |
|---|
| | | > |
|---|
| | | <el-popover ref="popover" placement="bottom" trigger="click" :visible-arrow="false" |
|---|
| | | popper-class="tree-search-popup"> |
|---|
| | | <el-input placeholder="请输入搜索条件" v-model="filterText"></el-input> |
|---|
| | | |
|---|
| | | <el-tree |
|---|
| | | style="width: 360px; height: 400px; overflow: auto;" |
|---|
| | | class="select-tree-box" |
|---|
| | | :data="testData" |
|---|
| | | :props="defaultProps" |
|---|
| | | ref="popupTree" |
|---|
| | | @current-change="currentChangeHandle" |
|---|
| | | :default-expand-all="defaultExpandAll" |
|---|
| | | :accordion="accordion" |
|---|
| | | :highlight-current="highlightCurrent" |
|---|
| | | :expand-on-click-node="true" |
|---|
| | | check-strictly |
|---|
| | | :filter-node-method="filterNode" |
|---|
| | | ></el-tree> |
|---|
| | | <el-tree style="width: 360px; height: 400px; overflow: auto;" class="select-tree-box" |
|---|
| | | :data="testData" :props="defaultProps" ref="popupTree" @current-change="currentChangeHandle" |
|---|
| | | :default-expand-all="defaultExpandAll" :accordion="accordion" |
|---|
| | | :highlight-current="highlightCurrent" :expand-on-click-node="true" check-strictly |
|---|
| | | :filter-node-method="filterNode"></el-tree> |
|---|
| | | </el-popover> |
|---|
| | | |
|---|
| | | <el-input |
|---|
| | | slot="reference" |
|---|
| | | v-model="prop" |
|---|
| | | v-popover:popover |
|---|
| | | :readonly="true" |
|---|
| | | placeholder="请输入搜索条件" |
|---|
| | | style="cursor: pointer;" |
|---|
| | | ></el-input> |
|---|
| | | <el-input slot="reference" v-model="prop" v-popover:popover :readonly="true" placeholder="请输入搜索条件" |
|---|
| | | style="cursor: pointer;"></el-input> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div v-show="searchValBoxShow" class="search-val-box"> |
|---|
| | | <div> |
|---|
| | | <div |
|---|
| | | @click="searchVlaClick(item)" |
|---|
| | | v-for="(item, index) in searchArray" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div @click="searchVlaClick(item)" v-for="(item, index) in searchArray" :key="index"> |
|---|
| | | {{ |
|---|
| | | item.name |
|---|
| | | item.name |
|---|
| | | }} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="nav-tab"> |
|---|
| | | <div |
|---|
| | | class="nav" |
|---|
| | | :class="navType == 0 ? 'choosed' : ''" |
|---|
| | | @click="navClick" |
|---|
| | | data-type="0" |
|---|
| | | >基本信息</div> |
|---|
| | | <div |
|---|
| | | class="nav" |
|---|
| | | :class="navType == 1 ? 'choosed' : ''" |
|---|
| | | @click="navClick" |
|---|
| | | data-type="1" |
|---|
| | | >警务信息</div> |
|---|
| | | <div |
|---|
| | | class="nav" |
|---|
| | | :class="navType == 2 ? 'choosed' : ''" |
|---|
| | | @click="navClick" |
|---|
| | | data-type="2" |
|---|
| | | >预警信息</div> |
|---|
| | | <div class="nav" :class="navType == 0 ? 'choosed' : ''" @click="navClick" data-type="0">基本信息</div> |
|---|
| | | <div class="nav" :class="navType == 1 ? 'choosed' : ''" @click="navClick" data-type="1">警务信息</div> |
|---|
| | | <div class="nav" :class="navType == 2 ? 'choosed' : ''" @click="navClick" data-type="2">预警信息</div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="base-info" v-show="navType == 0"> |
|---|
| | | <div class="sub-nav-list"> |
|---|
| | | <div |
|---|
| | | class="sub-nav" |
|---|
| | | :class="{ on: subNavType == 1 }" |
|---|
| | | @click="subNavType = 1" |
|---|
| | | >楼栋</div> |
|---|
| | | <div |
|---|
| | | class="sub-nav" |
|---|
| | | :class="{ on: subNavType == 2 }" |
|---|
| | | @click="subNavType = 2" |
|---|
| | | >出入口</div> |
|---|
| | | <div |
|---|
| | | class="sub-nav" |
|---|
| | | :class="{ on: subNavType == 3 }" |
|---|
| | | @click="subNavType = 3" |
|---|
| | | >停车场</div> |
|---|
| | | <div |
|---|
| | | class="sub-nav" |
|---|
| | | :class="{ on: subNavType == 4 }" |
|---|
| | | @click="subNavType = 4" |
|---|
| | | >商业</div> |
|---|
| | | <div class="sub-nav" :class="{ on: subNavType == 1 }" @click="subNavType = 1">楼栋</div> |
|---|
| | | <div class="sub-nav" :class="{ on: subNavType == 2 }" @click="subNavType = 2">出入口</div> |
|---|
| | | <div class="sub-nav" :class="{ on: subNavType == 3 }" @click="subNavType = 3">停车场</div> |
|---|
| | | <div class="sub-nav" :class="{ on: subNavType == 4 }" @click="subNavType = 4">商业</div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="floor-content" v-show="subNavType == 1"> |
|---|
| | |
|---|
| | | <i class="el-icon-caret-left"></i> |
|---|
| | | </div> |
|---|
| | | <div class="build-outBox" ref="BuildOutBox"> |
|---|
| | | <div |
|---|
| | | class="build-box" |
|---|
| | | style="left: 0px;" |
|---|
| | | :style="{ width: `calc(${Math.ceil(buildingList.length / 10)} * (356 / 1920) * 100vw` }" |
|---|
| | | > |
|---|
| | | <div |
|---|
| | | class="ridgepole-list" |
|---|
| | | v-for="index of Math.ceil(buildingList.length / 10)" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div |
|---|
| | | v-for="(item, index) in buildingList.slice((index - 1) * 10, index * 10)" |
|---|
| | | :key="index" |
|---|
| | | @click="buildingClick(item)" |
|---|
| | | :class="{ on: buildingChoosed.name == item.name }" |
|---|
| | | :title="item.name" |
|---|
| | | >{{ item.name }}</div> |
|---|
| | | <div class="build-box" style="left: 0px;" |
|---|
| | | :style="{ width: `calc(${Math.ceil(buildingList.length / 10)} * (356 / 1920) * 100vw` }"> |
|---|
| | | <div class="ridgepole-list" v-for="index of Math.ceil(buildingList.length / 10)" |
|---|
| | | :key="index"> |
|---|
| | | <div v-for="(item, index) in buildingList.slice((index - 1) * 10, index * 10)" |
|---|
| | | :key="index" @click="buildingClick(item)" |
|---|
| | | :class="{ on: buildingChoosed.name == item.name }" :title="item.name">{{ |
|---|
| | | item.name |
|---|
| | | }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="nextBtn rightBtn" @click="nextBtn"> |
|---|
| | | <i |
|---|
| | | v-show="buildingList.length > 10&&nextBtnShow" |
|---|
| | | class="el-icon-caret-right" |
|---|
| | | ></i> |
|---|
| | | <i v-show="buildingList.length > 10 && nextBtnShow" class="el-icon-caret-right"></i> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | |
|---|
| | | <div class="condo"> |
|---|
| | | <div class="type">选择单元</div> |
|---|
| | | <div class="type-select"> |
|---|
| | | <el-select |
|---|
| | | size="small" |
|---|
| | | v-model="unitValue" |
|---|
| | | placeholder="请选择" |
|---|
| | | @change="chooseUnit" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="item in unitOptions" |
|---|
| | | :key="item.value" |
|---|
| | | :label="item.label" |
|---|
| | | :value="item.value" |
|---|
| | | ></el-option> |
|---|
| | | <el-select size="small" v-model="unitValue" placeholder="请选择" @change="chooseUnit"> |
|---|
| | | <el-option v-for="item in unitOptions" :key="item.value" :label="item.label" |
|---|
| | | :value="item.value"></el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div class="type-val"> |
|---|
| | | <div> |
|---|
| | | <span |
|---|
| | | style="width: 10px; height: 10px; background: #0E88FF; border-radius: 50%;" |
|---|
| | | ></span> |
|---|
| | | style="width: 10px; height: 10px; background: #0E88FF; border-radius: 50%;"></span> |
|---|
| | | 流动人口 |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <span |
|---|
| | | style="width: 10px; height: 10px; background: #FF796C; border-radius: 50%;" |
|---|
| | | ></span> |
|---|
| | | style="width: 10px; height: 10px; background: #FF796C; border-radius: 50%;"></span> |
|---|
| | | 重点人员 |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <span |
|---|
| | | style="width: 10px; height: 10px; background: #FEAC04; border-radius: 50%;" |
|---|
| | | ></span> |
|---|
| | | style="width: 10px; height: 10px; background: #FEAC04; border-radius: 50%;"></span> |
|---|
| | | 境外人口 |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div class="type">房屋图例</div> |
|---|
| | | <div class="type-val"> |
|---|
| | | <div> |
|---|
| | | <span |
|---|
| | | style="width: 14px; height: 8px; border: 1px solid #3A8B3A;" |
|---|
| | | ></span> |
|---|
| | | <span style="width: 14px; height: 8px; border: 1px solid #3A8B3A;"></span> |
|---|
| | | 出租 |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <span |
|---|
| | | style="width: 14px; height: 8px; border: 1px solid #2C77BB;" |
|---|
| | | ></span> |
|---|
| | | <span style="width: 14px; height: 8px; border: 1px solid #2C77BB;"></span> |
|---|
| | | 自住 |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <span |
|---|
| | | style="width: 14px; height: 8px; border: 1px solid #5C6169;" |
|---|
| | | ></span> |
|---|
| | | <span style="width: 14px; height: 8px; border: 1px solid #5C6169;"></span> |
|---|
| | | 空置 |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <span |
|---|
| | | style="width: 14px; height: 8px; border: 1px solid #CC9456;" |
|---|
| | | ></span> |
|---|
| | | <span style="width: 14px; height: 8px; border: 1px solid #CC9456;"></span> |
|---|
| | | 商业 |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | <div class="floor-box"> |
|---|
| | | <div class="floor-num" style="left: 0"> |
|---|
| | | <div |
|---|
| | | :class="{ on: floorsType == index }" |
|---|
| | | @click="floorsType = index" |
|---|
| | | v-for="index in Math.ceil(unitHouseChoosed.length/5)" |
|---|
| | | :key="index" |
|---|
| | | >{{unitHouseChoosed[index*5-5].floor_num}}-{{unitHouseChoosed[index*5 -1]?unitHouseChoosed[index*5 -1].floor_num:unitHouseChoosed[unitHouseChoosed.length-1].floor_num}}层</div> |
|---|
| | | <div :class="{ on: floorsType == index }" @click="floorsType = index" |
|---|
| | | v-for="index in Math.ceil(unitHouseChoosed.length / 5)" :key="index"> |
|---|
| | | {{ unitHouseChoosed[index * 5 - 5].floor_num }}-{{ unitHouseChoosed[index * |
|---|
| | | 5 |
|---|
| | | - 1] ? unitHouseChoosed[index * 5 |
|---|
| | | - 1].floor_num : unitHouseChoosed[unitHouseChoosed.length - 1].floor_num |
|---|
| | | }}层</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | @click="nextFloorBtn" |
|---|
| | | class="floorBtn rightFloorBtn" |
|---|
| | | v-show="nextFloorShow" |
|---|
| | | > |
|---|
| | | <div @click="nextFloorBtn" class="floorBtn rightFloorBtn" v-show="nextFloorShow"> |
|---|
| | | <i class="el-icon-caret-right"></i> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="floor-detail"> |
|---|
| | | <div |
|---|
| | | v-for="(item, index) in unitHouseChoosed.slice((floorsType - 1) * 5, floorsType * 5)" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div class="title">{{item.floor_num}}层：</div> |
|---|
| | | <div v-for="(item, index) in unitHouseChoosed.slice((floorsType - 1) * 5, floorsType * 5)" |
|---|
| | | :key="index"> |
|---|
| | | <div class="title">{{ item.floor_num }}层：</div> |
|---|
| | | <div class="detail"> |
|---|
| | | <div |
|---|
| | | v-for="(value, index) in item.floor_house" |
|---|
| | | :key="index" |
|---|
| | | <div v-for="(value, index) in item.floor_house" :key="index" |
|---|
| | | @click="residentDetailsClick(value)" |
|---|
| | | :class="[{ 'chuzu': value.houseType == '出租' }, { 'zizhu': value.houseType == '自住' }, { 'kongzhi': value.houseType == '空置' }, { 'shangye': value.houseType == '商业' }]" |
|---|
| | | > |
|---|
| | | :class="[{ 'chuzu': value.houseType == '出租' }, { 'zizhu': value.houseType == '自住' }, { 'kongzhi': value.houseType == '空置' }, { 'shangye': value.houseType == '商业' }]"> |
|---|
| | | {{ value.house_num }} |
|---|
| | | <div class="flow"></div> |
|---|
| | | <div class="focus"></div> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="come-out-content" v-show="subNavType == 2"> |
|---|
| | | <el-table |
|---|
| | | :data="comeoutArr" |
|---|
| | | style="width: 100%" |
|---|
| | | <el-table :data="comeoutArr" 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="name" label="名称" width="130"></el-table-column> |
|---|
| | | <el-table-column prop="position" label="位置" width="150"></el-table-column> |
|---|
| | | <el-table-column prop="type" label="类别" width="120"></el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <div class="park-content" v-show="subNavType == 3"> |
|---|
| | | <el-table |
|---|
| | | :data="parkArr" |
|---|
| | | style="width: 100%" |
|---|
| | | <el-table :data="parkArr" 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="name" label="名称" width="130"></el-table-column> |
|---|
| | | <el-table-column prop="position" label="位置" width="150"></el-table-column> |
|---|
| | | <el-table-column prop="type" label="类别" width="120"></el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <div class="business-content" v-show="subNavType == 4"> |
|---|
| | | <el-table |
|---|
| | | :data="businessArr" |
|---|
| | | style="width: 100%" |
|---|
| | | <el-table :data="businessArr" 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="name" label="名称" width="130"></el-table-column> |
|---|
| | | <el-table-column prop="position" label="位置" width="150"></el-table-column> |
|---|
| | | <el-table-column prop="type" label="类别" width="120"></el-table-column> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="police-info" v-show="navType == 1"> |
|---|
| | | <el-table |
|---|
| | | :data="arr" |
|---|
| | | style="width: 100%" |
|---|
| | | <el-table :data="arr" 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-click="clickData" |
|---|
| | | > |
|---|
| | | :row-class-name="tableRowClassName" @row-click="clickData"> |
|---|
| | | <el-table-column prop="name" label="名称" width="130"></el-table-column> |
|---|
| | | <el-table-column prop="time" label="时间" width="150"></el-table-column> |
|---|
| | | <el-table-column prop="type" label="类别" width="120"></el-table-column> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="warning-info" v-show="navType == 2"> |
|---|
| | | <el-table |
|---|
| | | :data="warningArray" |
|---|
| | | style="width: 100%" |
|---|
| | | <el-table :data="warningArray" 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-click="clickData" |
|---|
| | | > |
|---|
| | | :row-class-name="tableRowClassName" @row-click="clickData"> |
|---|
| | | <el-table-column prop="name" label="名称" width="130"></el-table-column> |
|---|
| | | <el-table-column prop="time" label="时间" width="150"></el-table-column> |
|---|
| | | <el-table-column prop="type" label="类别" width="120"></el-table-column> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | <!-- <transition name="special-animal"></transition>--> |
|---|
| | | |
|---|
| | | <el-dialog |
|---|
| | | title="信息详情" |
|---|
| | | :modal="true" |
|---|
| | | :visible.sync="dialogVisible" |
|---|
| | | :before-close="handleClose" |
|---|
| | | :close-on-click-modal="true" |
|---|
| | | class="police-affairs-details-box" |
|---|
| | | > |
|---|
| | | <el-dialog title="信息详情" :modal="true" :visible.sync="dialogVisible" :before-close="handleClose" |
|---|
| | | :close-on-click-modal="true" class="police-affairs-details-box"> |
|---|
| | | <div class="item"> |
|---|
| | | <div>名称：</div> |
|---|
| | | <div>{{ JWdetails.name }}</div> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </el-dialog> |
|---|
| | | |
|---|
| | | <el-dialog |
|---|
| | | :title="residentDetailsTitle" |
|---|
| | | :modal="true" |
|---|
| | | :visible.sync="residentDetailsShow" |
|---|
| | | :before-close="residentDetailsClose" |
|---|
| | | :close-on-click-modal="true" |
|---|
| | | class="resident-details-box" |
|---|
| | | width="30%" |
|---|
| | | > |
|---|
| | | <el-dialog :title="residentDetailsTitle" :modal="true" :visible.sync="residentDetailsShow" |
|---|
| | | :before-close="residentDetailsClose" :close-on-click-modal="true" class="resident-details-box" width="30%"> |
|---|
| | | <h3 style="text-align:left;margin:10px 0 10px 0">户主信息</h3> |
|---|
| | | <el-table |
|---|
| | | :data="houseDate.householdsDate" |
|---|
| | | <el-table :data="houseDate.householdsDate" |
|---|
| | | :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" |
|---|
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" |
|---|
| | | > |
|---|
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"> |
|---|
| | | <el-table-column prop="name" label="姓名"></el-table-column> |
|---|
| | | <el-table-column prop="peopleType" label="重点人员"></el-table-column> |
|---|
| | | <el-table-column prop="nation" label="民族"></el-table-column> |
|---|
| | |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.searchHouse = this.$route.query.searchName |
|---|
| | | |
|---|
| | | this.$EventBus.$emit('addMxTileset', { |
|---|
| | | titlesetName: 'sdTilesetLayer', |
|---|
| | | titlesetUrl: '/sd/tileset.json' |
|---|
| | | }) |
|---|
| | | // this.$EventBus.$emit('addMxTileset', { |
|---|
| | | // titlesetName: 'sdTilesetLayer', |
|---|
| | | // titlesetUrl: '/sd/tileset.json' |
|---|
| | | // }) |
|---|
| | | |
|---|
| | | this.$EventBus.$emit('toPosition', { |
|---|
| | | siteJd: 116.027212, |
|---|
| | |
|---|
| | | }, |
|---|
| | | |
|---|
| | | destroyed () { |
|---|
| | | this.$EventBus.$emit('removeMxTileset', { |
|---|
| | | titlesetName: 'sdTilesetLayer' |
|---|
| | | }) |
|---|
| | | // this.$EventBus.$emit('removeMxTileset', { |
|---|
| | | // titlesetName: 'sdTilesetLayer' |
|---|
| | | // }) |
|---|
| | | |
|---|
| | | this.$parent.resize('0px') |
|---|
| | | } |
|---|
| | |
|---|
| | | border-radius: 10px; |
|---|
| | | overflow: hidden; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | height: 100%; |
|---|
| | | overflow-y: auto; |
|---|
| | | |
|---|
| | |
|---|
| | | left: 10px; |
|---|
| | | right: 10px; |
|---|
| | | bottom: 4px; |
|---|
| | | background: linear-gradient( |
|---|
| | | 135deg, |
|---|
| | | rgb(33 150 243 / 74%), |
|---|
| | | rgb(254 254 254 / 0%) |
|---|
| | | ); |
|---|
| | | background: linear-gradient(135deg, |
|---|
| | | rgb(33 150 243 / 74%), |
|---|
| | | rgb(254 254 254 / 0%)); |
|---|
| | | z-index: -1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .housing-introduce { |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | padding: 0 10px; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .floor-content { |
|---|
| | | &>.floor-content { |
|---|
| | | .build-info { |
|---|
| | | display: flex; |
|---|
| | | position: relative; |
|---|
| | |
|---|
| | | flex-wrap: wrap; |
|---|
| | | width: 356px; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | |
|---|
| | | .content { |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | height: 26px; |
|---|
| | | line-height: 26px; |
|---|
| | | flex: 1; |
|---|
| | |
|---|
| | | justify-content: center; |
|---|
| | | border-right: 1px solid #50555f; |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | &>div:last-child { |
|---|
| | | margin-left: 14px; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | &>div:first-child { |
|---|
| | | width: 30%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | &>div:last-child { |
|---|
| | | border: none; |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-around; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | flex: 1; |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | &>div:first-child { |
|---|
| | | height: 30px; |
|---|
| | | line-height: 30px; |
|---|
| | | font-size: 18px; |
|---|
| | |
|---|
| | | color: #499d99; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | &>div:last-child { |
|---|
| | | height: 26px; |
|---|
| | | line-height: 26px; |
|---|
| | | } |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-around; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | & > div:first-child { |
|---|
| | | &>div { |
|---|
| | | &>div:first-child { |
|---|
| | | height: 30px; |
|---|
| | | line-height: 30px; |
|---|
| | | font-size: 18px; |
|---|
| | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .house-element-info { |
|---|
| | | |
|---|
| | | .condo, |
|---|
| | | .legend { |
|---|
| | | display: flex; |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | flex: 1; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | & > span { |
|---|
| | | &>span { |
|---|
| | | margin: 0 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | left: 0; |
|---|
| | | transition: all 1s; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | margin: 0 4px; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | |
|---|
| | | cursor: default; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .on { |
|---|
| | | &>.on { |
|---|
| | | border: 1px solid orange; |
|---|
| | | color: orange; |
|---|
| | | } |
|---|
| | |
|---|
| | | margin-top: 14px; |
|---|
| | | height: 220px; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | margin: 8px; |
|---|
| | | height: 36px; |
|---|
| | | line-height: 36px; |
|---|
| | |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | margin: 0 4px; |
|---|
| | | position: relative; |
|---|
| | | width: 68px; |
|---|
| | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .focus { |
|---|
| | | top: calc( |
|---|
| | | (100% - 18px) / 4 * 2 + 6px |
|---|
| | | ); |
|---|
| | | top: calc((100% - 18px) / 4 * 2 + 6px); |
|---|
| | | background: rgb(255, 121, 108); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .warning { |
|---|
| | | top: calc( |
|---|
| | | (100% - 18px) / 4 * 3 + 12px |
|---|
| | | ); |
|---|
| | | top: calc((100% - 18px) / 4 * 3 + 12px); |
|---|
| | | background: rgb(254, 172, 4); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .chuzu { |
|---|
| | | &>.chuzu { |
|---|
| | | border: 1px solid #3a8b3a; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .zizhu { |
|---|
| | | &>.zizhu { |
|---|
| | | border: 1px solid #2c77bb; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .kongzhi { |
|---|
| | | &>.kongzhi { |
|---|
| | | border: 1px solid #5c6169; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .shangye { |
|---|
| | | &>.shangye { |
|---|
| | | border: 1px solid #cc9456; |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | height: 100%; |
|---|
| | | overflow: hidden; |
|---|
| | | border-radius: 2px; |
|---|
| | | background: linear-gradient( |
|---|
| | | 135deg, |
|---|
| | | rgba(252, 252, 252, 0.108), |
|---|
| | | rgb(254, 254, 254) |
|---|
| | | ); |
|---|
| | | background: linear-gradient(135deg, |
|---|
| | | rgba(252, 252, 252, 0.108), |
|---|
| | | rgb(254, 254, 254)); |
|---|
| | | animation: prog 3s ease infinite; |
|---|
| | | } |
|---|
| | | |
|---|
| | |
|---|
| | | * @Author: shuishen 1109946754@qq.com |
|---|
| | | * @Date: 2022-08-18 16:18:24 |
|---|
| | | * @LastEditors: shuishen 1109946754@qq.com |
|---|
| | | * @LastEditTime: 2022-12-07 08:49:30 |
|---|
| | | * @LastEditTime: 2022-12-19 11:24:14 |
|---|
| | | * @FilePath: \srs-police-affairs\src\views\lyout\index.vue |
|---|
| | | * @Description: |
|---|
| | | * |
|---|
| | |
|---|
| | | <div class="main-header"> |
|---|
| | | <!-- <div class="title"></div> --> |
|---|
| | | <div class="menu-list left"> |
|---|
| | | <div |
|---|
| | | @mouseenter="item.childrenFlag = true" |
|---|
| | | @mouseleave="item.childrenFlag = false" |
|---|
| | | class="nav-list" |
|---|
| | | @click="goToPath(item)" |
|---|
| | | v-for="(item, index) in menuLeftList" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list" |
|---|
| | | @click="goToPath(item)" v-for="(item, index) in menuLeftList" :key="index"> |
|---|
| | | <span :class="{ on: currentUrl.indexOf(item.path) != -1 }">{{ item.menuName }}</span> |
|---|
| | | <div class="sub-nav-list" v-show="item.children && item.childrenFlag"> |
|---|
| | | <div |
|---|
| | | v-for="(subItem, subIndex) in item.children" |
|---|
| | | :key="subIndex" |
|---|
| | | @click="goToPath(subItem)" |
|---|
| | | > |
|---|
| | | <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)"> |
|---|
| | | {{ |
|---|
| | | subItem.menuName |
|---|
| | | subItem.menuName |
|---|
| | | }} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | |
|---|
| | | <!-- 菜单导航 --> |
|---|
| | | <div class="menu-list right"> |
|---|
| | | <div |
|---|
| | | @mouseenter="item.childrenFlag = true" |
|---|
| | | @mouseleave="item.childrenFlag = false" |
|---|
| | | class="nav-list" |
|---|
| | | @click="goToPath(item)" |
|---|
| | | v-for="(item, index) in menuRightList" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list" |
|---|
| | | @click="goToPath(item)" v-for="(item, index) in menuRightList" :key="index"> |
|---|
| | | <span :class="{ on: currentUrl.indexOf(item.path) != -1 }">{{ item.menuName }}</span> |
|---|
| | | <div class="sub-nav-list" v-show="item.children && item.childrenFlag"> |
|---|
| | | <div |
|---|
| | | v-for="(subItem, subIndex) in item.children" |
|---|
| | | :key="subIndex" |
|---|
| | | @click="goToPath(subItem)" |
|---|
| | | > |
|---|
| | | <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)"> |
|---|
| | | {{ |
|---|
| | | subItem.menuName |
|---|
| | | subItem.menuName |
|---|
| | | }} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <mapBox ref="modalForm" /> |
|---|
| | | |
|---|
| | | <!-- 主体内容区域 --> |
|---|
| | | <div |
|---|
| | | class="main-content" |
|---|
| | | id="MainContent" |
|---|
| | | :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }" |
|---|
| | | > |
|---|
| | | <div class="main-content" id="MainContent" |
|---|
| | | :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }"> |
|---|
| | | <router-view ref="target-name"></router-view> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <el-button |
|---|
| | | v-show="leftShow" |
|---|
| | | class="flexible-btn" |
|---|
| | | <el-button v-show="leftShow" class="flexible-btn" |
|---|
| | | :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }" |
|---|
| | | :icon="show ? 'el-icon-arrow-left' : 'el-icon-arrow-right'" |
|---|
| | | id="FlexibleBtn" |
|---|
| | | type="primary" |
|---|
| | | @click="flexibelClick" |
|---|
| | | ></el-button> |
|---|
| | | :icon="show ? 'el-icon-arrow-left' : 'el-icon-arrow-right'" id="FlexibleBtn" type="primary" |
|---|
| | | @click="flexibelClick"></el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | |
|---|
| | | { |
|---|
| | | menuName: '运维管理', |
|---|
| | | openExternal: true, |
|---|
| | | path: 'http://192.168.0.105:8081/#/login' |
|---|
| | | path: 'http://10.141.11.11:8081/#/login' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | |
|---|
| | |
|---|
| | | overflow: hidden; |
|---|
| | | letter-spacing: 6px; |
|---|
| | | |
|---|
| | | & > img { |
|---|
| | | &>img { |
|---|
| | | // width: 100%; |
|---|
| | | height: 80%; |
|---|
| | | margin: 0 10px 0 10px; |
|---|
| | |
|---|
| | | // border-radius: 10px 16px 10px 16px; |
|---|
| | | transform: skew(58deg); |
|---|
| | | |
|---|
| | | & > span { |
|---|
| | | &>span { |
|---|
| | | transform: skew(-58deg); |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | // border-radius: 16px 10px 16px 10px; |
|---|
| | | transform: skew(-58deg); |
|---|
| | | |
|---|
| | | & > span { |
|---|
| | | &>span { |
|---|
| | | transform: skew(58deg); |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | & > .nav-list { |
|---|
| | | &>.nav-list { |
|---|
| | | |
|---|
| | | // color: rgba(32, 106, 181, 1); |
|---|
| | | // border-bottom: 2px solid #409eff; |
|---|
| | | & > span.on { |
|---|
| | | &>span.on { |
|---|
| | | color: rgba(252, 189, 86, 1); |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | * @Author: shuishen 1109946754@qq.com |
|---|
| | | * @Date: 2022-08-18 16:18:17 |
|---|
| | | * @LastEditors: shuishen 1109946754@qq.com |
|---|
| | | * @LastEditTime: 2022-12-01 15:43:51 |
|---|
| | | * @LastEditTime: 2022-12-19 17:32:25 |
|---|
| | | * @FilePath: \srs-police-affairs\src\views\video\list.vue |
|---|
| | | * @Description: 辖区管理 |
|---|
| | | * |
|---|
| | |
|---|
| | | <div class="list container"> |
|---|
| | | <div v-show="boxShow" class="container-content"> |
|---|
| | | <div class="search-box"> |
|---|
| | | <input |
|---|
| | | v-model="searchValue" |
|---|
| | | @input="searchChange" |
|---|
| | | type="text" |
|---|
| | | placeholder="请输入搜索条件" |
|---|
| | | /> |
|---|
| | | <input v-model="searchValue" @input="searchChange" type="text" placeholder="请输入搜索条件" /> |
|---|
| | | <button @click="searchClick" class="el-icon-search"></button> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | |
|---|
| | | <button @click="changeRange" class="btn">确定</button> |
|---|
| | | </div> |
|---|
| | | <div v-show="searchValBoxShow" class="search-val-box"> |
|---|
| | | <div |
|---|
| | | @click="searchVlaClick(item)" |
|---|
| | | v-for="(item, index) in searchArray" |
|---|
| | | :key="index" |
|---|
| | | >{{ item.name }}</div> |
|---|
| | | <div @click="searchVlaClick(item)" v-for="(item, index) in searchArray" :key="index">{{ item.name }} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="list-show"> |
|---|
| | | <div class="car-list"> |
|---|
| | | <div class="list-box"> |
|---|
| | | <el-table |
|---|
| | | :data="monitoringList" |
|---|
| | | style="width: 100%" |
|---|
| | | <el-table :data="monitoringList" style="width: 100%" |
|---|
| | | :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" |
|---|
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" |
|---|
| | | @cell-click="rowClick" |
|---|
| | | > |
|---|
| | | <el-table-column prop="name" label="设备名称" min-width="50%"></el-table-column> |
|---|
| | | <el-table-column prop="manufacture" label="设备类型" min-width="50%"></el-table-column> |
|---|
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" @cell-click="rowClick"> |
|---|
| | | <el-table-column prop="name" label="设备名称" min-width="35%"></el-table-column> |
|---|
| | | <el-table-column prop="pTZTypeText" label="设备类型" min-width="35%"></el-table-column> |
|---|
| | | <el-table-column prop="status" label="状态" min-width="30%"> |
|---|
| | | <template slot-scope="scope"> |
|---|
| | | <div class="state-box" :class="{ online: scope.row.status == '1' }"></div> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <div class="pages"> |
|---|
| | | <el-pagination |
|---|
| | | background |
|---|
| | | layout="prev, pager, next" |
|---|
| | | :page-size="pagesize" |
|---|
| | | :page-count="pagesCount" |
|---|
| | | :current-page="currentPage" |
|---|
| | | @current-change="handleCurrentChange" |
|---|
| | | ></el-pagination> |
|---|
| | | <el-pagination background layout="prev, pager, next" :page-size="pagesize" |
|---|
| | | :page-count="pagesCount" :current-page="currentPage" |
|---|
| | | @current-change="handleCurrentChange"></el-pagination> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <el-dialog |
|---|
| | | :title="dialogTitle" |
|---|
| | | :modal="true" |
|---|
| | | :visible.sync="dialogVisible" |
|---|
| | | :before-close="dialogBeforeClose" |
|---|
| | | :close-on-click-modal="true" |
|---|
| | | class="car-video-box" |
|---|
| | | > |
|---|
| | | <video |
|---|
| | | id="videoElement" |
|---|
| | | autoplay |
|---|
| | | controls |
|---|
| | | width="100%" |
|---|
| | | height="100%" |
|---|
| | | style="object-fit: fill" |
|---|
| | | ></video> |
|---|
| | | <el-dialog :title="dialogTitle" :modal="true" :visible.sync="dialogVisible" :before-close="dialogBeforeClose" |
|---|
| | | :close-on-click-modal="true" class="car-video-box"> |
|---|
| | | <video id="videoElement" autoplay controls width="100%" height="100%" style="object-fit: fill"></video> |
|---|
| | | </el-dialog> |
|---|
| | | <el-dialog |
|---|
| | | :title="drawDialogTitle" |
|---|
| | | :modal="true" |
|---|
| | | :visible.sync="drawDialogVisible" |
|---|
| | | :before-close="drawDialogBeforeClose" |
|---|
| | | :close-on-click-modal="true" |
|---|
| | | class="video-draw-box" |
|---|
| | | > |
|---|
| | | <el-dialog :title="drawDialogTitle" :modal="true" :visible.sync="drawDialogVisible" |
|---|
| | | :before-close="drawDialogBeforeClose" :close-on-click-modal="true" class="video-draw-box"> |
|---|
| | | <input type="text" v-model="drawName" placeholder="请输入绘制线或面的名称" /> |
|---|
| | | <button @click="saveDrawInfo">保存</button> |
|---|
| | | </el-dialog> |
|---|
| | |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | currentPage: 1, |
|---|
| | | pagesize: 13, |
|---|
| | | pagesize: 15, |
|---|
| | | pagesCount: 1, |
|---|
| | | monitoringList: [], |
|---|
| | | monitoringSaveList: [], |
|---|
| | |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | async getDevices (id) { |
|---|
| | | async getDevices (id, channelId) { |
|---|
| | | let flvAddress = '' |
|---|
| | | await getDevices(id).then(res => { |
|---|
| | | await getDevices(id, channelId).then(res => { |
|---|
| | | if ('data' in res.data) { |
|---|
| | | flvAddress = res.data.data.flv |
|---|
| | | } else { |
|---|
| | |
|---|
| | | lat: item.latitude, |
|---|
| | | alt: 100, |
|---|
| | | url: '/img/icon/video.png', |
|---|
| | | deviceId: item.deviceId |
|---|
| | | deviceId: item.deviceId, |
|---|
| | | channelId: item.channelId |
|---|
| | | }, |
|---|
| | | incident: this.siteClick |
|---|
| | | }) |
|---|
| | |
|---|
| | | this.dialogTitle = e.overlay.attrParams.name |
|---|
| | | this.dialogVisible = true |
|---|
| | | let flvUrl = '' |
|---|
| | | await this.getDevices(e.overlay.attrParams.deviceId).then(res => { |
|---|
| | | await this.getDevices(e.overlay.attrParams.deviceId, e.overlay.attrParams.channelId).then(res => { |
|---|
| | | flvUrl = res |
|---|
| | | }) |
|---|
| | | if (flvjs.isSupported() && flvUrl != 'nodata') { |
|---|
| | |
|---|
| | | border-radius: 10px; |
|---|
| | | overflow-y: auto; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | height: 100%; |
|---|
| | | padding: 0 10px; |
|---|
| | | line-height: 36px; |
|---|
| | |
|---|
| | | .list-show { |
|---|
| | | flex: 1; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | &>div { |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | |
|---|
| | | // background-color: #fff; |
|---|
| | | .list-box { |
|---|
| | | flex: 1; |
|---|
| | | |
|---|
| | | .state-box { |
|---|
| | | width: 20px; |
|---|
| | | height: 20px; |
|---|
| | | line-height: 20px; |
|---|
| | | text-align: center; |
|---|
| | | margin: 0 auto; |
|---|
| | | border-radius: 50%; |
|---|
| | | background-color: #adadad; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .online { |
|---|
| | | background-color: #4ccc7d; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
