| | |
| | | domTilesets: { |
| | | url: pwythHost + "/qingxie/tileset.json" |
| | | }, |
| | | baseModel:{ |
| | | serveType: 'Tileset', |
| | | url: pwythHost + "/modles/TY/tileset.json", |
| | | cnName:"baseModel", |
| | | id:"baseModel", |
| | | }, |
| | | }; |
| | |
| | | import mapServer from '@/utils/mapServer/mapServer'; |
| | | import kgServer from '@/utils/mapServer/kgServer'; |
| | | |
| | | import pyServer from '@/utils/mapServer/pyServer'; |
| | | //é
ç½æ¥å£ => æ¥è¯¢ææ |
| | | export function zhangzitou_selectAllLine(params) { |
| | | return mapServer.get('/zhangzitou/selectAllLine', { params: params }); |
| | |
| | | export function zhangzitou_updateZhangzitouEntity(params) { |
| | | return mapServer.post('/zhangzitou/updateZhangzitouEntity', params); |
| | | } |
| | | |
| | | //æºå¨å¦ä¹ => æ°å线æ |
| | | export function py_arima(params) { |
| | | return pyServer.get('/arima', { params: params }); |
| | | } |
| | |
| | | //请æ±å°å |
| | | return peiWangServer.post('/peiwang/tokeninfo/update', params); |
| | | } |
| | | export function faultreport_list(params) { |
| | | //请æ±å°å |
| | | return peiWangServer.get('/peiwang/faultreport/list', { params: params }); |
| | | } |
| | | export function faultreport_save(params) { |
| | | //请æ±å°å |
| | | return peiWangServer.post('/peiwang/faultreport/save', params); |
| | | } |
| | | export function faultreport_update(params) { |
| | | //请æ±å°å |
| | | return peiWangServer.post('/peiwang/faultreport/update', params); |
| | | } |
| | |
| | | import mapConfig from './mapConfig'; |
| | | import mapData from './mapData'; |
| | | import mapServer from './mapServe'; |
| | | |
| | | import * as turf from '@turf/turf'; |
| | | const mapInit = { |
| | | async Init() { |
| | | console.log(location) |
| | | window.earthCtrl = new SmartEarth.EarthCtrl('sdkContainer', { |
| | | // éèé»è®¤åºå¾ |
| | | defaultImagery: false, |
| | |
| | | serveType: 'tdMap', |
| | | url: baseLayer.sUrl + baseLayer.vecLayer + baseLayer.lUrl, |
| | | }); |
| | | |
| | | // mapServer.addLayer({ |
| | | // serveType: 'WMS', |
| | | // url: 'sxpw:shanxitif', |
| | | // }); |
| | | // æ·»å 天å°å¾æ 注 |
| | | mapServer.addLayer({ |
| | | serveType: 'tdMap', |
| | |
| | | name: '淹没åæ', |
| | | pid: 's3', |
| | | }, |
| | | { |
| | | id: 'a4', |
| | | name: 'é·é¨', |
| | | pid: 's3', |
| | | }, |
| | | { |
| | | id: 'a5', |
| | | name: 'è¦éª', |
| | | pid: 's3', |
| | | }, |
| | | { |
| | | id: 'a6', |
| | | name: 'æ¸
é¤', |
| | | pid: 's3', |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | |
| | | cvaLayer: 'cva_w', |
| | | imgLayer: 'img_w', |
| | | }, |
| | | |
| | | // é»è®¤è§è§ |
| | | defaultPerspective: { |
| | | x: -1935239.1689147458, |
| | | y: 4653957.816261454, |
| | | z: 3900586.9686804516, |
| | | x: -1936842.4744685106, |
| | | y: 4665314.067108395, |
| | | z: 3898603.230008434, |
| | | }, |
| | | // å¾å±ç®¡ç |
| | | layerData: { |
| | |
| | | import mapConfig from './mapConfig'; |
| | | import { zhangzitou_selectAll } from '@/api/mapView/map.js'; |
| | | import WKT from 'terraformer-wkt-parser'; |
| | | import store from '@/store'; |
| | | // æå¡å è½½ |
| | | const mapServer = { |
| | | serveType: null, |
| | |
| | | var geom = WKT.parse(item.geom).coordinates; |
| | | const terrain = config.terrain; |
| | | if (terrain.isShow && terrain.isUrl) { |
| | | this.addTerrainGLB(geom); |
| | | this.addTerrainGLB(item, geom, modelLayer); |
| | | } else { |
| | | this.addGLB(item, geom, modelLayer); |
| | | } |
| | |
| | | }); |
| | | }); |
| | | }, |
| | | addTerrainGLB(geom) { |
| | | addTerrainGLB(item, geom, modelLayer) { |
| | | var positions = [Cesium.Cartographic.fromDegrees(geom[0], geom[1])]; |
| | | var promise = Cesium.sampleTerrainMostDetailed(Viewer.terrainProvider, positions); |
| | | promise.then(updatedPositions => { |
| | | console.log(updatedPositions); |
| | | }) |
| | | // SmartEarth.Cesium.when(promise, (updatedPositions) => { |
| | | // var terrainHeight = updatedPositions[0].height; |
| | | // console.log(terrainHeight); |
| | | // }); |
| | | promise.then((updatedPositions) => { |
| | | var terrainHeight = updatedPositions[0].height; |
| | | var style = { |
| | | longitude: geom[0], |
| | | latitude: geom[1], |
| | | altitude: terrainHeight, |
| | | heading: 0, |
| | | pitch: 0, |
| | | roll: 0, |
| | | }; |
| | | const modelMatrix = mapConfig.getModelMatrix(style); |
| | | const url = '/glb/' + item.type + '.glb'; |
| | | modelLayer.add( |
| | | Cesium.Model.fromGltf({ |
| | | id: item.id, |
| | | url: url, |
| | | scale: 1, |
| | | minimumPixelSize: 20, |
| | | maximumScale: 20, |
| | | modelMatrix: modelMatrix, |
| | | primitive: item, |
| | | }) |
| | | ); |
| | | }); |
| | | }, |
| | | addGLB(item, geom, modelLayer) { |
| | | var style = { |
| | |
| | | }); |
| | | const cnName = res.cnName + '_' + res.id; |
| | | model.item.readyPromise.then((item) => { |
| | | mapConfig.userSceneFlyTo(item); |
| | | if (res.id != 'baseModel') { |
| | | mapConfig.userSceneFlyTo(item); |
| | | } |
| | | this.layerList.push({ |
| | | id: res.id, |
| | | name: cnName, |
| | |
| | | }); |
| | | }); |
| | | }, |
| | | setTilesetArgs() {}, |
| | | removeLayer(res) { |
| | | const cnName = res.cnName + '_' + res.id; |
| | | this.layerList.map((item, index) => { |
| | |
| | | } |
| | | }); |
| | | }, |
| | | async getFeatureInfo(res) { |
| | | console.log(res); |
| | | async getFeatureInfo(html) { |
| | | var start = html.indexOf('<caption class="featureInfo">') + '<caption class="featureInfo">'.length; |
| | | var end = html.indexOf('</caption>'); |
| | | var tab = html.substr(start, end - start); |
| | | var std = html |
| | | .substr(html.indexOf('<th>'), html.lastIndexOf('</th>') - html.indexOf('<th>') + 5) |
| | | .replaceAll(' ', '') |
| | | .replaceAll('\n', '') |
| | | .split('</th>'); |
| | | var str = html |
| | | .substr(html.indexOf('<td>'), html.lastIndexOf('</td>') - html.indexOf('<td>') + 5) |
| | | .replaceAll(' ', '') |
| | | .replaceAll('\n', '') |
| | | .split('</td>'); |
| | | var arr = []; |
| | | for (var i in std) { |
| | | var name, val; |
| | | name = std[i]; |
| | | val = str[i]; |
| | | if (name == '') { |
| | | continue; |
| | | } |
| | | if (name.indexOf('<th>') > -1) { |
| | | name = name.replaceAll('<th>', ''); |
| | | } |
| | | if (val.indexOf('<td>') > -1) { |
| | | val = val.replaceAll('<td>', ''); |
| | | } |
| | | if (name != '>') { |
| | | arr.push({ |
| | | name: name, |
| | | val: val, |
| | | }); |
| | | } |
| | | } |
| | | store.dispatch('mapLayers/changeMapInfo', []); |
| | | if (arr.length > 0) { |
| | | // this.$store.geet.mapInfo = arr; |
| | | store.dispatch('mapLayers/changeMapInfo', arr); |
| | | } |
| | | }, |
| | | }; |
| | | export default mapServer; |
| | |
| | | import { time } from 'echarts'; |
| | | import mapServer from './mapServe'; |
| | | |
| | | const menuManager = { |
| | | pid: null, |
| | | pointFly: null, |
| | | particle: null, |
| | | AnalysisFlood: null, |
| | | modelLayer: null, |
| | | regionWeather: null, |
| | | regionWeather: null, |
| | | colorAll: { |
| | | point: SmartEarth.Cesium.Color.fromCssColorString('#ff0000'), |
| | | polyline: SmartEarth.Cesium.Color.fromCssColorString('#ffff0050'), |
| | |
| | | break; |
| | | } |
| | | }, |
| | | handlerClick(res) { |
| | | var that = this; |
| | | var handler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas); |
| | | handler.setInputAction((event) => { |
| | | let cartesian = Viewer.camera.pickEllipsoid(event.position); |
| | | let cartographic = Cesium.Cartographic.fromCartesian(cartesian); |
| | | |
| | | if (cartesian) { |
| | | let lng = parseFloat(Cesium.Math.toDegrees(cartographic.longitude)).toFixed(6); // ç»åº¦ |
| | | let lat = parseFloat(Cesium.Math.toDegrees(cartographic.latitude)).toFixed(6); // 纬度 |
| | | var alt = Viewer.camera.positionCartographic.height.toFixed(0); |
| | | if (res == 'a2') { |
| | | that.setCreateFireAnalysis(lng, lat, alt); |
| | | } else if (res == 'a4') { |
| | | that.setCreateRainAnalysis(lng, lat, alt); |
| | | } else if (res == 'a5') { |
| | | that.setCreateSnowAnalysis(lng, lat, alt); |
| | | } |
| | | } |
| | | handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); |
| | | }, Cesium.ScreenSpaceEventType.LEFT_CLICK); |
| | | }, |
| | | getModelLayer() { |
| | | const obj = mapServer.layerList.filter((item) => { |
| | | if (item.id == 'baseModel') { |
| | | return time; |
| | | } |
| | | }); |
| | | if (obj.length <= 0) return; |
| | | this.modelLayer = obj[0].layer; |
| | | }, |
| | | setCreateRainAnalysis(lng, lat, alt) { |
| | | this.regionWeather = earthCtrl.factory.createRegionWeather({ |
| | | primitive: this.modelLayer.item, |
| | | position: new SmartEarth.Cesium.Cartesian3.fromDegrees(lng, lat, 1000), |
| | | radius: 1000, |
| | | }); |
| | | this.regionWeather.enableWeatherType = SmartEarth.Cesium.RegionWeather.TYPE_RAIN; |
| | | this.regionWeather.regionAlpha = 0.6; |
| | | this.regionWeather.regionGradientDistance = 300; |
| | | }, |
| | | setCreateSnowAnalysis(lng, lat, alt) { |
| | | this.regionWeather = earthCtrl.factory.createRegionWeather({ |
| | | primitive: this.modelLayer.item, |
| | | position: new SmartEarth.Cesium.Cartesian3.fromDegrees(lng, lat, 1000), |
| | | radius: 1000, |
| | | }); |
| | | this.regionWeather.enableWeatherType = SmartEarth.Cesium.RegionWeather.TYPE_SNOW; |
| | | this.regionWeather.regionAlpha = 0.8; |
| | | this.regionWeather.regionGradientDistance = 300; |
| | | }, |
| | | setClearMenuS3() { |
| | | if (this.particle) { |
| | | this.particle.remove(); |
| | | this.particle = null; |
| | | } |
| | | if (this.AnalysisFlood) { |
| | | this.AnalysisFlood.endWater(); |
| | | this.AnalysisFlood = undefined; |
| | | } |
| | | if (this.regionWeather) { |
| | | this.regionWeather.enableWeatherType = SmartEarth.Cesium.RegionWeather.TYPE_NONE; |
| | | } |
| | | }, |
| | | // ç¾å®³ç®¡ç |
| | | setMenuS3(res) { |
| | | switch (res.id) { |
| | |
| | | this.particle = null; |
| | | return; |
| | | } |
| | | this.handlerClick(res.id); |
| | | |
| | | var that = this; |
| | | var handler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas); |
| | | handler.setInputAction((event) => { |
| | | let cartesian = Viewer.camera.pickEllipsoid(event.position); |
| | | let cartographic = Cesium.Cartographic.fromCartesian(cartesian); |
| | | |
| | | if (cartesian) { |
| | | let lng = parseFloat(Cesium.Math.toDegrees(cartographic.longitude)).toFixed(6); // ç»åº¦ |
| | | let lat = parseFloat(Cesium.Math.toDegrees(cartographic.latitude)).toFixed(6); // 纬度 |
| | | var alt = Viewer.camera.positionCartographic.height.toFixed(0); |
| | | that.setCreateFireAnalysis(lng, lat, alt); |
| | | } |
| | | handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); |
| | | }, Cesium.ScreenSpaceEventType.LEFT_CLICK); |
| | | break; |
| | | case 'a3': |
| | | if (this.AnalysisFlood) { |
| | | this.AnalysisFlood.endWater(); |
| | | this.AnalysisFlood = undefined; |
| | | return |
| | | return; |
| | | } |
| | | var url = SmartEarthRootUrl + 'Workers/image/33.gif'; |
| | | const method = { |
| | |
| | | url: url, |
| | | }; |
| | | this.AnalysisFlood = earthCtrl.analysis.createSubmergence(method, (value) => {}); |
| | | break; |
| | | case 'a4': |
| | | if (!this.modelLayer) { |
| | | this.getModelLayer(); |
| | | } |
| | | this.handlerClick(res.id); |
| | | break; |
| | | |
| | | case 'a5': |
| | | if (!this.modelLayer) { |
| | | this.getModelLayer(); |
| | | } |
| | | this.handlerClick(res.id); |
| | | break; |
| | | case 'a6': |
| | | this.setClearMenuS3(); |
| | | break; |
| | | default: |
| | | return null; |
| | |
| | | earthCtrl.factory.createSimpleGraphic('label', {}, (entity) => {}); |
| | | break; |
| | | case 'a3': |
| | | earthCtrl.factory.createSimpleGraphic('polyline', { showSize: false }, (entity) => {}); |
| | | earthCtrl.factory.createSimpleGraphic('polyline', { showSize: false }, (entity) => { |
| | | |
| | | // console.log(entity); |
| | | |
| | | // const obj = entity.polyline.positions.getValue(); |
| | | // var std = []; |
| | | // for (var i in obj) { |
| | | // var ellipsoid =Viewer.scene.globe.ellipsoid; |
| | | |
| | | // // å°ä¸çåæ è½¬æ¢ä¸ºå°çåæ ï¼Cartographicï¼ |
| | | // var cartographic = ellipsoid.cartesianToCartographic(obj[i]); |
| | | |
| | | // // è·åç»çº¬åº¦ |
| | | // var longitude = Cesium.Math.toDegrees(cartographic.longitude); |
| | | // var latitude = Cesium.Math.toDegrees(cartographic.latitude); |
| | | // var height = 0; |
| | | // std.push([longitude, latitude, height]); |
| | | // } |
| | | // console.log(std); |
| | | }); |
| | | break; |
| | | case 'a4': |
| | | earthCtrl.factory.createSimpleGraphic('rectangle', { showSize: false }, (entity) => {}); |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="msgBox" @click="setShowMenuClick"> |
| | | |
| | | <i style="font-size: 20px;" class="el-icon-chat-line-round"></i> |
| | | <el-badge v-show="msgCount > 0" :value="msgCount" class="item"> |
| | | </el-badge> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'RouYiMsg', |
| | | data() { |
| | | return { |
| | | msgCount: 0, |
| | | dialogVisible: false |
| | | } |
| | | }, |
| | | methods: { |
| | | setShowMenuClick() { |
| | | this.dialogVisible = true |
| | | }, |
| | | handleClose() { |
| | | this.dialogVisible = false |
| | | } |
| | | }, |
| | | mounted() { |
| | | console.log(123); |
| | | |
| | | }, |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .msgBox { |
| | | display: flex; |
| | | |
| | | |
| | | } |
| | | </style> |
| | |
| | | <template> |
| | | <div class="navbar"> |
| | | <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> |
| | | <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" |
| | | @toggleClick="toggleSideBar" /> |
| | | |
| | | <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/> |
| | | <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/> |
| | | <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" /> |
| | | <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav" /> |
| | | |
| | | <div class="right-menu"> |
| | | <template v-if="device!=='mobile'"> |
| | | <template v-if="device !== 'mobile'"> |
| | | <!-- <search id="header-search" class="right-menu-item" /> --> |
| | | |
| | | <!-- <el-tooltip content="æºç å°å" effect="dark" placement="bottom"> |
| | | <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" /> |
| | | </el-tooltip> --> |
| | | |
| | | <el-tooltip content="ææ¡£å°å" effect="dark" placement="bottom"> |
| | | <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" /> |
| | | <el-tooltip content="åºæ¥ä¿¡æ¯" effect="dark" placement="bottom"> |
| | | <!-- <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" /> --> |
| | | <ruo-yi-msg id="ruoyi-msg" class="right-menu-item hover-effect" ></ruo-yi-msg> |
| | | </el-tooltip> |
| | | |
| | | <!-- <el-tooltip content="ææ¡£å°å" effect="dark" placement="bottom"> |
| | | <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" /> |
| | | </el-tooltip> --> |
| | | |
| | | <screenfull id="screenfull" class="right-menu-item hover-effect" /> |
| | | |
| | | <el-tooltip content="å¸å±å¤§å°" effect="dark" placement="bottom"> |
| | | <!-- <el-tooltip content="å¸å±å¤§å°" effect="dark" placement="bottom"> |
| | | <size-select id="size-select" class="right-menu-item hover-effect" /> |
| | | </el-tooltip> |
| | | </el-tooltip> --> |
| | | |
| | | </template> |
| | | |
| | |
| | | import Search from '@/components/HeaderSearch' |
| | | import RuoYiGit from '@/components/RuoYi/Git' |
| | | import RuoYiDoc from '@/components/RuoYi/Doc' |
| | | import RuoYiMsg from '@/components/RuoYi/Msgger' |
| | | |
| | | export default { |
| | | components: { |
| | |
| | | SizeSelect, |
| | | Search, |
| | | RuoYiGit, |
| | | RuoYiDoc |
| | | RuoYiDoc, |
| | | RuoYiMsg |
| | | }, |
| | | computed: { |
| | | ...mapGetters([ |
| | |
| | | this.$store.dispatch('LogOut').then(() => { |
| | | location.href = '/index'; |
| | | }) |
| | | }).catch(() => {}); |
| | | }).catch(() => { }); |
| | | } |
| | | } |
| | | } |
| | |
| | | overflow: hidden; |
| | | position: relative; |
| | | background: #fff; |
| | | box-shadow: 0 1px 4px rgba(0,21,41,.08); |
| | | box-shadow: 0 1px 4px rgba(0, 21, 41, .08); |
| | | |
| | | .hamburger-container { |
| | | line-height: 46px; |
| | |
| | | float: left; |
| | | cursor: pointer; |
| | | transition: background .3s; |
| | | -webkit-tap-highlight-color:transparent; |
| | | -webkit-tap-highlight-color: transparent; |
| | | |
| | | &:hover { |
| | | background: rgba(0, 0, 0, .025) |
| | |
| | | |
| | | NProgress.configure({ showSpinner: false }) |
| | | |
| | | const whiteList = ['/login', '/auth-redirect', '/bind', '/register'] |
| | | const whiteList = ['/login', '/auth-redirect','/visualization', '/bind', '/register'] |
| | | |
| | | router.beforeEach((to, from, next) => { |
| | | NProgress.start() |
| | |
| | | import Vue from 'vue' |
| | | import Router from 'vue-router' |
| | | import Vue from 'vue'; |
| | | import Router from 'vue-router'; |
| | | |
| | | Vue.use(Router) |
| | | Vue.use(Router); |
| | | |
| | | /* Layout */ |
| | | import Layout from '@/layout' |
| | | import Layout from '@/layout'; |
| | | |
| | | /** |
| | | * Note: è·¯ç±é
置项 |
| | |
| | | |
| | | // å
Œ
±è·¯ç± |
| | | export const constantRoutes = [ |
| | | { |
| | | path: '/redirect', |
| | | component: Layout, |
| | | hidden: true, |
| | | children: [ |
| | | { |
| | | path: '/redirect/:path(.*)', |
| | | component: () => import('@/views/redirect') |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/bigScreen', |
| | | component: () => import('@/views/bigScreen/home'), |
| | | hidden: true, |
| | | meta: { bigScreen: true } |
| | | }, |
| | | { |
| | | path: '/login', |
| | | component: () => import('@/views/login'), |
| | | hidden: true |
| | | }, |
| | | { |
| | | path: '/register', |
| | | component: () => import('@/views/register'), |
| | | hidden: true |
| | | }, |
| | | { |
| | | path: '/404', |
| | | component: () => import('@/views/error/404'), |
| | | hidden: true |
| | | }, |
| | | { |
| | | path: '/401', |
| | | component: () => import('@/views/error/401'), |
| | | hidden: true |
| | | }, |
| | | { |
| | | path: '', |
| | | component: Layout, |
| | | redirect: 'index', |
| | | children: [ |
| | | { |
| | | path: 'index', |
| | | component: () => import('@/views/index'), |
| | | name: 'Index', |
| | | meta: { title: 'é¦é¡µ', icon: 'dashboard', affix: true } |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/user', |
| | | component: Layout, |
| | | hidden: true, |
| | | redirect: 'noredirect', |
| | | children: [ |
| | | { |
| | | path: 'profile', |
| | | component: () => import('@/views/system/user/profile/index'), |
| | | name: 'Profile', |
| | | meta: { title: '个人ä¸å¿', icon: 'user' } |
| | | } |
| | | ] |
| | | } |
| | | ] |
| | | path: '/redirect', |
| | | component: Layout, |
| | | hidden: true, |
| | | children: [ |
| | | { |
| | | path: '/redirect/:path(.*)', |
| | | component: () => import('@/views/redirect'), |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/bigScreen', |
| | | component: () => import('@/views/bigScreen/home'), |
| | | hidden: true, |
| | | meta: { bigScreen: true }, |
| | | }, |
| | | { |
| | | path: '/login', |
| | | component: () => import('@/views/login'), |
| | | hidden: true, |
| | | }, |
| | | { |
| | | path: '/register', |
| | | component: () => import('@/views/register'), |
| | | hidden: true, |
| | | }, |
| | | { |
| | | path: '/404', |
| | | component: () => import('@/views/error/404'), |
| | | hidden: true, |
| | | }, |
| | | { |
| | | path: '/visualization', |
| | | component: () => import('@/views/visualization/index.vue'), |
| | | hidden: true, |
| | | }, |
| | | { |
| | | path: '/401', |
| | | component: () => import('@/views/error/401'), |
| | | hidden: true, |
| | | }, |
| | | { |
| | | path: '', |
| | | component: Layout, |
| | | redirect: 'index', |
| | | children: [ |
| | | { |
| | | path: 'index', |
| | | component: () => import('@/views/index'), |
| | | name: 'Index', |
| | | meta: { title: 'é¦é¡µ', icon: 'dashboard', affix: true }, |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/user', |
| | | component: Layout, |
| | | hidden: true, |
| | | redirect: 'noredirect', |
| | | children: [ |
| | | { |
| | | path: 'profile', |
| | | component: () => import('@/views/system/user/profile/index'), |
| | | name: 'Profile', |
| | | meta: { title: '个人ä¸å¿', icon: 'user' }, |
| | | }, |
| | | ], |
| | | }, |
| | | ]; |
| | | |
| | | // å¨æè·¯ç±ï¼åºäºç¨æ·æé卿å»å è½½ |
| | | export const dynamicRoutes = [ |
| | | { |
| | | path: '/system/user-auth', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['system:user:edit'], |
| | | children: [ |
| | | { |
| | | path: 'role/:userId(\\d+)', |
| | | component: () => import('@/views/system/user/authRole'), |
| | | name: 'AuthRole', |
| | | meta: { title: 'åé
è§è²', activeMenu: '/system/user' } |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/system/role-auth', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['system:role:edit'], |
| | | children: [ |
| | | { |
| | | path: 'user/:roleId(\\d+)', |
| | | component: () => import('@/views/system/role/authUser'), |
| | | name: 'AuthUser', |
| | | meta: { title: 'åé
ç¨æ·', activeMenu: '/system/role' } |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/system/dict-data', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['system:dict:list'], |
| | | children: [ |
| | | { |
| | | path: 'index/:dictId(\\d+)', |
| | | component: () => import('@/views/system/dict/data'), |
| | | name: 'Data', |
| | | meta: { title: 'åå
¸æ°æ®', activeMenu: '/system/dict' } |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/monitor/job-log', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['monitor:job:list'], |
| | | children: [ |
| | | { |
| | | path: 'index/:jobId(\\d+)', |
| | | component: () => import('@/views/monitor/job/log'), |
| | | name: 'JobLog', |
| | | meta: { title: 'è°åº¦æ¥å¿', activeMenu: '/monitor/job' } |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/tool/gen-edit', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['tool:gen:edit'], |
| | | children: [ |
| | | { |
| | | path: 'index/:tableId(\\d+)', |
| | | component: () => import('@/views/tool/gen/editTable'), |
| | | name: 'GenEdit', |
| | | meta: { title: 'ä¿®æ¹çæé
ç½®', activeMenu: '/tool/gen' } |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/iot', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['iot:device:add'], |
| | | children: [ |
| | | { |
| | | path: 'product-edit', |
| | | component: () => import('@/views/iot/product/product-edit'), |
| | | name: 'ProductEdit', |
| | | meta: { title: 'ç¼è¾äº§å', activeMenu: '/iot/product',nocache: true} |
| | | }, |
| | | { |
| | | path: 'device-edit', |
| | | component: () => import('@/views/iot/device/device-edit'), |
| | | name: 'DeviceEdit', |
| | | meta: { title: 'ç¼è¾è®¾å¤', activeMenu: '/iot/device', noCache: true} |
| | | } |
| | | ] |
| | | }, |
| | | ] |
| | | { |
| | | path: '/system/user-auth', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['system:user:edit'], |
| | | children: [ |
| | | { |
| | | path: 'role/:userId(\\d+)', |
| | | component: () => import('@/views/system/user/authRole'), |
| | | name: 'AuthRole', |
| | | meta: { title: 'åé
è§è²', activeMenu: '/system/user' }, |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/system/role-auth', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['system:role:edit'], |
| | | children: [ |
| | | { |
| | | path: 'user/:roleId(\\d+)', |
| | | component: () => import('@/views/system/role/authUser'), |
| | | name: 'AuthUser', |
| | | meta: { title: 'åé
ç¨æ·', activeMenu: '/system/role' }, |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/system/dict-data', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['system:dict:list'], |
| | | children: [ |
| | | { |
| | | path: 'index/:dictId(\\d+)', |
| | | component: () => import('@/views/system/dict/data'), |
| | | name: 'Data', |
| | | meta: { title: 'åå
¸æ°æ®', activeMenu: '/system/dict' }, |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/monitor/job-log', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['monitor:job:list'], |
| | | children: [ |
| | | { |
| | | path: 'index/:jobId(\\d+)', |
| | | component: () => import('@/views/monitor/job/log'), |
| | | name: 'JobLog', |
| | | meta: { title: 'è°åº¦æ¥å¿', activeMenu: '/monitor/job' }, |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/tool/gen-edit', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['tool:gen:edit'], |
| | | children: [ |
| | | { |
| | | path: 'index/:tableId(\\d+)', |
| | | component: () => import('@/views/tool/gen/editTable'), |
| | | name: 'GenEdit', |
| | | meta: { title: 'ä¿®æ¹çæé
ç½®', activeMenu: '/tool/gen' }, |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/iot', |
| | | component: Layout, |
| | | hidden: true, |
| | | permissions: ['iot:device:add'], |
| | | children: [ |
| | | { |
| | | path: 'product-edit', |
| | | component: () => import('@/views/iot/product/product-edit'), |
| | | name: 'ProductEdit', |
| | | meta: { title: 'ç¼è¾äº§å', activeMenu: '/iot/product', nocache: true }, |
| | | }, |
| | | { |
| | | path: 'device-edit', |
| | | component: () => import('@/views/iot/device/device-edit'), |
| | | name: 'DeviceEdit', |
| | | meta: { title: 'ç¼è¾è®¾å¤', activeMenu: '/iot/device', noCache: true }, |
| | | }, |
| | | ], |
| | | }, |
| | | ]; |
| | | |
| | | // 鲿¢è¿ç»ç¹å»å¤æ¬¡è·¯ç±æ¥é |
| | | let routerPush = Router.prototype.push; |
| | | Router.prototype.push = function push(location) { |
| | | return routerPush.call(this, location).catch(err => err) |
| | | } |
| | | return routerPush.call(this, location).catch((err) => err); |
| | | }; |
| | | |
| | | export default new Router({ |
| | | mode: 'history', // 廿urlä¸ç# |
| | | scrollBehavior: () => ({ y: 0 }), |
| | | routes: constantRoutes |
| | | }) |
| | | mode: 'history', // 廿urlä¸ç# |
| | | scrollBehavior: () => ({ y: 0 }), |
| | | routes: constantRoutes, |
| | | }); |
| | |
| | | import Cookies from 'js-cookie'; |
| | | |
| | | import busEvent from '@/utils/busEvent'; |
| | | const state = { |
| | | layerTree: [], |
| | | defaultLayer: [], |
| | | mapInfo: [], |
| | | }; |
| | | |
| | | const mutations = { |
| | | CHANGE_LAYERTREE: (state, res) => { |
| | | state.layerTree = res; |
| | | }, |
| | | CHANGE_DEFAULTLAYER: (state,res) => { |
| | | CHANGE_DEFAULTLAYER: (state, res) => { |
| | | state.defaultLayer = res; |
| | | }, |
| | | CHANGE_MAPINFO: (state, res) => { |
| | | state.mapInfo = res; |
| | | busEvent.$emit('CHANGE_MAPINFO', state.mapInfo); |
| | | |
| | | }, |
| | | }; |
| | | |
| | |
| | | changeDefaultLayer({ commit }, obj) { |
| | | commit('CHANGE_DEFAULTLAYER', obj); |
| | | }, |
| | | changeMapInfo({ commit }, obj) { |
| | | commit('CHANGE_MAPINFO', obj); |
| | | }, |
| | | }; |
| | | |
| | | export default { |
¶Ô±ÈÐÂÎļþ |
| | |
| | | import axios from 'axios'; |
| | | const pyServer = axios.create({ |
| | | // axiosä¸è¯·æ±é
ç½®æbaseURLé项ï¼è¡¨ç¤ºè¯·æ±URLå
Œ
±é¨å |
| | | baseURL: config.pyServices, |
| | | // è¶
æ¶ |
| | | timeout: -1, |
| | | }); |
| | | export default pyServer; |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <el-dialog :title="!dataForm.id ? 'æ°å¢' : 'ä¿®æ¹'" :close-on-click-modal="false" :visible.sync="visible"> |
| | | <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" |
| | | label-width="120px"> |
| | | <el-form-item label="客æ·åç§°" prop="cName"> |
| | | <el-input v-model="dataForm.cName" placeholder="客æ·åç§°"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="æ
éå°ç¹åç§°" prop="fName"> |
| | | <el-input v-model="dataForm.fName" placeholder="æ
éå°ç¹åç§°"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="æ
éå°ç¹ç»çº¬åº¦" prop="fLocation"> |
| | | <el-input v-model="dataForm.fLocation" placeholder="æ
éå°ç¹ç»çº¬åº¦"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="èç³»çµè¯" prop="fPhone"> |
| | | <el-input v-model="dataForm.fPhone" placeholder="èç³»çµè¯"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="æ
éæ¶é´" prop="fDate"> |
| | | <el-input v-model="dataForm.fDate" placeholder="æ
éæ¶é´"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="æ¥ä¿®æ¹å¼" prop="fType"> |
| | | <el-input v-model="dataForm.fType" placeholder="æ¥ä¿®æ¹å¼"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="è®°å½äºº" prop="fMan"> |
| | | <el-input v-model="dataForm.fMan" placeholder="è®°å½äºº"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="æ¥ä¿®å
容" prop="fContent"> |
| | | <el-input v-model="dataForm.fContent" placeholder="æ¥ä¿®å
容"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="å°è¾¾ç°åºæ¶é´" prop="rDate"> |
| | | <el-input v-model="dataForm.rDate" placeholder="å°è¾¾ç°åºæ¶é´"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="ç»´ä¿®ç»ææ¶é´" prop="reDate"> |
| | | <el-input v-model="dataForm.reDate" placeholder="ç»´ä¿®ç»ææ¶é´"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="维修轨迹" prop="rePosition"> |
| | | <el-input v-model="dataForm.rePosition" placeholder="维修轨迹"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="ç»´ä¿®è§é¢" prop="reVideo"> |
| | | <el-input v-model="dataForm.reVideo" placeholder="ç»´ä¿®è§é¢"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="客æ·è¯ä»·" prop="reEvaluation"> |
| | | <el-input v-model="dataForm.reEvaluation" placeholder="客æ·è¯ä»·"></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="visible = false">åæ¶</el-button> |
| | | <el-button type="primary" @click="dataFormSubmit()">ç¡®å®</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | | <script> |
| | | import { faultreport_save, faultreport_update } from '@/api/mapView/peiwang.js'; |
| | | export default { |
| | | data() { |
| | | return { |
| | | visible: false, |
| | | dataForm: { |
| | | id: undefined, |
| | | cName: '', |
| | | fName: '', |
| | | fLocation: '', |
| | | fPhone: '', |
| | | fDate: '', |
| | | fType: '', |
| | | fMan: '', |
| | | fContent: '', |
| | | rDate: '', |
| | | reDate: '', |
| | | rePosition: '', |
| | | reVideo: '', |
| | | reEvaluation: '' |
| | | }, |
| | | dataRule: { |
| | | cName: [ |
| | | { required: true, message: '客æ·åç§°ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | fName: [ |
| | | { required: true, message: 'æ
éå°ç¹åç§°ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | fLocation: [ |
| | | { required: true, message: 'æ
éå°ç¹ç»çº¬åº¦ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | fPhone: [ |
| | | { required: true, message: 'èç³»çµè¯ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | fDate: [ |
| | | { required: true, message: 'æ
éæ¶é´ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | fType: [ |
| | | { required: true, message: 'æ¥ä¿®æ¹å¼ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | fMan: [ |
| | | { required: true, message: 'è®°å½äººä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | fContent: [ |
| | | { required: true, message: 'æ¥ä¿®å
容ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | rDate: [ |
| | | { required: true, message: 'å°è¾¾ç°åºæ¶é´ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | reDate: [ |
| | | { required: true, message: 'ç»´ä¿®ç»ææ¶é´ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | rePosition: [ |
| | | { required: true, message: '维修轨迹ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | reVideo: [ |
| | | { required: true, message: 'ç»´ä¿®è§é¢ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ], |
| | | reEvaluation: [ |
| | | { required: true, message: '客æ·è¯ä»·ä¸è½ä¸ºç©º', trigger: 'blur' } |
| | | ] |
| | | } |
| | | } |
| | | }, |
| | | methods: { |
| | | init(response) { |
| | | this.visible = true |
| | | if (response) { |
| | | this.dataForm = { ...response } |
| | | } |
| | | |
| | | }, |
| | | // 表åæäº¤ |
| | | dataFormSubmit() { |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | if (this.dataForm.id) { |
| | | this.setEditReport(); |
| | | } else { |
| | | this.setSaveReport(); |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | setSaveReport() { |
| | | faultreport_save(this.dataForm).then(response => { |
| | | console.log(response); |
| | | // this.$message({ |
| | | // message: 'æä½æå', |
| | | // type: 'success', |
| | | // duration: 1500, |
| | | // onClose: () => { |
| | | // this.visible = false |
| | | // this.$emit('refreshDataList') |
| | | // } |
| | | // }) |
| | | }) |
| | | }, |
| | | setEditReport() { |
| | | faultreport_update(this.dataForm).then(response => { |
| | | console.log(response); |
| | | |
| | | }) |
| | | }, |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | } |
| | | } |
| | | </script> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <!-- 设å¤ç»´ä¿® --> |
| | | <template> |
| | | <div class="equipManteBox"> |
| | | <el-card> |
| | | <div class="infoSearch"> |
| | | <el-form :inline="true" :model="dataForm"> |
| | | <el-form-item> |
| | | <el-input size="small" v-model="dataForm.key" placeholder="åæ°å" clearable></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div> |
| | | <el-button plain size="small" @click="getDataList()">æ¥è¯¢</el-button> |
| | | <el-button plain size="small" type="primary" @click="addOrUpdateHandle()">æ°å¢</el-button> |
| | | <el-button plain size="small" type="danger" |
| | | :disabled="dataListSelections.length <= 0">æ¹éå é¤</el-button> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | <el-card class="infoConTent"> |
| | | <div class="infoTable"> |
| | | <el-table :data="dataList" border height="calc(100% - 65px)" v-loading="dataListLoading" |
| | | @selection-change="selectionChangeHandle" style="width: 100%;"> |
| | | <el-table-column type="selection" header-align="center" align="center" width="50"> |
| | | </el-table-column> |
| | | <el-table-column align="center" type="index" label="åºå·" width="70px" /> |
| | | <!-- <el-table-column prop="id" header-align="center" align="center" label="${column.comments}"> |
| | | </el-table-column> --> |
| | | <el-table-column prop="c_name" header-align="center" align="center" label="客æ·åç§°"> |
| | | </el-table-column> |
| | | <el-table-column prop="f_name" header-align="center" align="center" label="æ
éå°ç¹åç§°"> |
| | | </el-table-column> |
| | | <el-table-column prop="f_location" header-align="center" align="center" label="æ
éå°ç¹ç»çº¬åº¦"> |
| | | </el-table-column> |
| | | <el-table-column prop="f_phone" header-align="center" align="center" label="èç³»çµè¯"> |
| | | </el-table-column> |
| | | <el-table-column prop="f_date" header-align="center" align="center" label="æ
éæ¶é´"> |
| | | </el-table-column> |
| | | <el-table-column prop="f_type" header-align="center" align="center" label="æ¥ä¿®æ¹å¼"> |
| | | </el-table-column> |
| | | <el-table-column prop="f_man" header-align="center" align="center" label="è®°å½äºº"> |
| | | </el-table-column> |
| | | <el-table-column prop="f_content" header-align="center" align="center" label="æ¥ä¿®å
容"> |
| | | </el-table-column> |
| | | <el-table-column prop="r_date" header-align="center" align="center" label="å°è¾¾ç°åºæ¶é´"> |
| | | </el-table-column> |
| | | <el-table-column prop="re_date" header-align="center" align="center" label="ç»´ä¿®ç»ææ¶é´"> |
| | | </el-table-column> |
| | | <el-table-column prop="re_position" header-align="center" align="center" label="维修轨迹"> |
| | | </el-table-column> |
| | | <el-table-column prop="re_video" header-align="center" align="center" label="ç»´ä¿®è§é¢"> |
| | | </el-table-column> |
| | | <el-table-column prop="re_evaluation" header-align="center" align="center" label="客æ·è¯ä»·"> |
| | | </el-table-column> |
| | | <el-table-column fixed="right" header-align="center" align="center" width="150" label="æä½"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" size="small">ä¿®æ¹</el-button> |
| | | <el-button type="text" size="small">å é¤</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageIndex" |
| | | :limit.sync="queryParams.pageSize" @pagination="getDataList" /> |
| | | </div> |
| | | </el-card> |
| | | <!-- å¼¹çª, æ°å¢ / ä¿®æ¹ --> |
| | | <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { faultreport_list } from '@/api/mapView/peiwang.js'; |
| | | import AddOrUpdate from './AddOrUpdate.vue'; |
| | | export default { |
| | | name: "equipMante", |
| | | components: { |
| | | AddOrUpdate |
| | | }, |
| | | data() { |
| | | return { |
| | | dataForm: { |
| | | key: "" |
| | | }, |
| | | dataListSelections: [], |
| | | queryParams: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | name: '', |
| | | srid: 4326, |
| | | }, |
| | | dataListLoading: false, |
| | | dataList: [], |
| | | total: 0, |
| | | addOrUpdateVisible: false, |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.getDataList(); |
| | | }, |
| | | methods: { |
| | | addOrUpdateHandle(res) { |
| | | this.addOrUpdateVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs.addOrUpdate.init(res) |
| | | }) |
| | | }, |
| | | selectionChangeHandle(res) { |
| | | this.dataListSelections = res; |
| | | }, |
| | | getDataList() { |
| | | this.dataListLoading = true; |
| | | faultreport_list({ |
| | | page: this.queryParams.pageIndex, |
| | | limit: this.queryParams.pageSize, |
| | | key: this.queryParams.name, |
| | | }).then(response => { |
| | | this.dataListLoading = false; |
| | | if (response.status != 200) return |
| | | const obj = response.data.page; |
| | | this.total = obj.totalCount; |
| | | this.dataList = obj.list; |
| | | }) |
| | | } |
| | | } |
| | | |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .equipManteBox { |
| | | width: calc(100% - 20px); |
| | | height: calc(100% - 20px); |
| | | position: absolute; |
| | | margin: 10px; |
| | | border-radius: 5px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | |
| | | .infoSearch { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | |
| | | ::v-deep.el-form-item { |
| | | margin: 0px; |
| | | } |
| | | } |
| | | |
| | | .infoConTent { |
| | | margin-top: 10px; |
| | | flex: 1; |
| | | position: relative; |
| | | |
| | | .infoTable { |
| | | width: calc(100% - 30px); |
| | | height: calc(100% - 36px); |
| | | position: absolute; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | } |
| | | |
| | | ::v-deep.el-card__body { |
| | | padding: 15px; |
| | | } |
| | | |
| | | |
| | | } |
| | | </style> |
| | |
| | | <template> |
| | | <div :id="msgId" class="textBox"> |
| | | |
| | | <div v-loading="loading" element-loading-text="æ°æ®ä¸ä¼ ä¸..." element-loading-spinner="el-icon-loading" |
| | | element-loading-background="rgba(0, 0, 0, 0.6)" class="fileBox" v-for="(item, index) in filieOption" |
| | | :key="index"> |
| | | <span>{{ item.name }}</span><span class="upMsg"> |
| | | {{ upMsg }} |
| | | </span> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { rag_chat, rag_search, rag_upload } from "@/api/mapView/rag.js"; |
| | | export default { |
| | | data() { |
| | | return { |
| | | msgId: null, |
| | | msgText: '', |
| | | filieOption: [], |
| | | loading: false, |
| | | upMsg: "", |
| | | } |
| | | }, |
| | | props: { |
| | | childObject: { |
| | | type: Array, |
| | | type: Object, |
| | | required: true |
| | | } |
| | | }, |
| | | watch: { |
| | | childObject: { |
| | | handler(newVal, oldVal) { |
| | | if (newVal) { |
| | | console.log(newVal); |
| | | this.setTextMsg(newVal) |
| | | } |
| | | }, |
| | |
| | | }, |
| | | methods: { |
| | | setTextMsg(res) { |
| | | if (!res.msg) return |
| | | this.id = res.id |
| | | console.log("insertFile", msg); |
| | | this.filieOption = res.msg; |
| | | this.$nextTick(() => { |
| | | this.loading = true; |
| | | this.setInsertFile() |
| | | }) |
| | | }, |
| | | setInsertFile() { |
| | | const fs = document.getElementById("insertFile") |
| | | if (fs.files.length <= 0) return; |
| | | const formData = new FormData(); |
| | | for (var i = 0, c = fs.files.length; i < c; i++) { |
| | | formData.append("file", fs.files[i]); // fs.files[i].name,file |
| | | } |
| | | rag_upload(formData).then(response => { |
| | | this.loading = false |
| | | document.getElementById('insertFile').value = "" |
| | | if (response.data == 'success') { |
| | | this.upMsg = "ä¸ä¼ æå" |
| | | } else { |
| | | this.upMsg = "ä¸ä¼ 失败" |
| | | } |
| | | |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style></style> |
| | | <style lang="scss" scoped> |
| | | .textBox { |
| | | padding-top: 10px; |
| | | } |
| | | |
| | | .fileBox { |
| | | background: white; |
| | | padding: 10px; |
| | | margin-bottom: 10px; |
| | | min-width: 300px; |
| | | min-height: 70px; |
| | | display: flex; |
| | | align-items: center; |
| | | border-radius: 5px; |
| | | justify-content: space-between; |
| | | .upMsg { |
| | | font-size: 12px; |
| | | color: #1890ff; |
| | | } |
| | | |
| | | |
| | | |
| | | } |
| | | </style> |
| | |
| | | <agent-text :id="item.id + key" :child-object="res"></agent-text> |
| | | </div> |
| | | <!-- loading --> |
| | | <div v-if="res.type == 'loading'"> |
| | | <div v-else-if="res.type == 'loading'"> |
| | | <agent-load></agent-load> |
| | | </div> |
| | | <!-- rag --> |
| | | <div v-if="res.type == 'rag'"> |
| | | <div v-else-if="res.type == 'rag'"> |
| | | <agent-rag :id="item.id + key" :child-object="res"></agent-rag> |
| | | </div> |
| | | <!-- insrtFile --> |
| | | <div v-if="res.type == 'insrtFile'"> |
| | | {{ res }} |
| | | <div v-else-if="res.type == 'insertFile'"> |
| | | <agent-insert-file :id="item.id + key" :child-object="res"></agent-insert-file> |
| | | </div> |
| | | |
| | |
| | | msg: res.msg, |
| | | mine: true, |
| | | }) |
| | | console.log(obj); |
| | | this.msgList.push() |
| | | this.msgList.push(obj) |
| | | }, |
| | | setUserMsg(res) { |
| | | this.msgList.push(msgconfig.initMsg({ |
| | |
| | | <template> |
| | | <div class="enterBox"> |
| | | |
| | | <input type="file" @change="setInputFileChange" accept=".docx,.txt" id="insertFile" style="display:none"> |
| | | <input type="file" @change="setInputFileChange" multiple accept=".docx,.txt" id="insertFile" style="display:none"> |
| | | <div class="enterContent"> |
| | | <el-input type="textarea" :rows="rows" maxRows="4" placeholder="请è¾å
¥æ¨çé®é¢..." v-model="msgContent" |
| | | maxlength="4000" @keyup="onKeyup"> |
| | |
| | | created() { |
| | | const { params, query } = this.$route |
| | | const { path } = params |
| | | console.log(path); |
| | | |
| | | this.$router.replace({ path: '/' + path, query }) |
| | | }, |
| | | render: function(h) { |
| | |
| | | <div class="graphicBox" v-show="showEcharts"> |
| | | <div class="konwReturn fl"> |
| | | <el-link @click="showEcharts = false"> |
| | | <i class="el-icon-d-arrow-left"></i> |
| | | <i style="color: #409EFF;" class="el-icon-d-arrow-left"></i> |
| | | </el-link> |
| | | å½åé¢å:{{ targetName }} |
| | | </div> |
| | |
| | | getGraphicNodes(res, lines, obj) { |
| | | const std = []; |
| | | const ids = []; |
| | | |
| | | |
| | | lines.filter(item => { |
| | | |
| | | |
| | | if (ids.indexOf(item.sourceId) < 0) { |
| | | ids.push(item.sourceId) |
| | | } |
| | |
| | | if (item.poi && item.poi == 1) { |
| | | poi = true; |
| | | } |
| | | |
| | | |
| | | const expand = ids.indexOf(item.uuid) > -1 ? false : true |
| | | if (!expand) { |
| | | |
| | |
| | | graphInstance.doLayout(); |
| | | }); |
| | | |
| | | }, 1000); |
| | | }, 200); |
| | | |
| | | |
| | | setTimeout(() => { |
| | |
| | | .graphicBox { |
| | | width: 100%; |
| | | height: 100%; |
| | | position: relative; |
| | | display: flex; |
| | | flex-direction: column; |
| | | color: #409EFF; |
| | | |
| | | .graphicContent { |
| | | padding: 10px; |
| | | flex: 1; |
| | | |
| | | |
| | | } |
| | | } |
| | | } |
| | |
| | | <Popup ref="pop" top="20px" :title="title" @close="close(true)" width="1000px" :maxHeight="'700px'" |
| | | @cancel="close(false)"> |
| | | <div class="menuBox"> |
| | | <div class="serachContent"> |
| | | <el-select v-model="linesName" @change="setEchartChange" placeholder="è¯·éæ©"> |
| | | <el-option v-for="(item, key) in linesOption" :key="key" :label="item.line" :value="item.line"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="echartContent"> |
| | | <div id="myEchart" class="myChart"> </div> |
| | | </div> |
| | | <statistics></statistics> |
| | | </div> |
| | | |
| | | </Popup> |
| | | </template> |
| | | |
| | | <script> |
| | | import Popup from '@/components/Tool/Popup.vue'; |
| | | import { zhangzitou_selectInfos } from "@/api/mapView/map.js" |
| | | import mapData from '@/assets/js/mapSdk/mapData'; |
| | | import * as echarts from 'echarts'; |
| | | |
| | | import statistics from '@/views/visual/statistics/index.vue' |
| | | export default { |
| | | name: 'dataAnalysis', |
| | | components: { Popup }, |
| | | components: { Popup ,statistics}, |
| | | data() { |
| | | return { |
| | | title: 'æ°æ®ç»è®¡', |
| | |
| | | open() { |
| | | this.close(true); |
| | | this.$refs.pop.open(); |
| | | this.getAllLines(); |
| | | }, |
| | | getAllLines() { |
| | | zhangzitou_selectInfos().then(response => { |
| | | if (response.data.code != 200) { |
| | | return this.close(); |
| | | } |
| | | this.setAllLinses(response.data.result) |
| | | }) |
| | | }, |
| | | setAllLinses(res) { |
| | | this.allLines = res; |
| | | this.linesOption = this.allLines.filter((item, index, self) => |
| | | index === self.findIndex((t) => t.line === item.line) |
| | | ); |
| | | this.linesName = this.linesOption[0].line; |
| | | this.setEchartChange(); |
| | | }, |
| | | setEchartChange() { |
| | | zhangzitou_selectInfos({ |
| | | line: this.linesName |
| | | }).then(response => { |
| | | if (response.data.code != 200) return |
| | | const result = response.data.result; |
| | | |
| | | const objData = [] |
| | | result.filter(item => { |
| | | const type = mapData.dataStatistics[item.type]; |
| | | if (type) { |
| | | item.type = type |
| | | } |
| | | objData.push({ |
| | | value: item.count, name: item.type |
| | | }) |
| | | }) |
| | | this.setEchartShow(objData) |
| | | }) |
| | | |
| | | }, |
| | | |
| | | setEchartShow(res) { |
| | | |
| | | let option = { |
| | | title: { |
| | | |
| | | left: 'center' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item' |
| | | }, |
| | | legend: { |
| | | orient: 'vertical', |
| | | left: 'left' |
| | | }, |
| | | series: [ |
| | | { |
| | | name: this.linesName, |
| | | type: 'pie', |
| | | radius: '50%', |
| | | data: res, |
| | | emphasis: { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowOffsetX: 0, |
| | | shadowColor: 'rgba(0, 0, 0, 0.5)' |
| | | } |
| | | } |
| | | } |
| | | ] |
| | | }; |
| | | if (!this.myChart) { |
| | | |
| | | this.myChart = echarts.init(document.getElementById("myEchart")); |
| | | } |
| | | |
| | | |
| | | this.myChart.setOption(option); |
| | | window.addEventListener("resize", () => { |
| | | this.myChart.resize(); |
| | | }); |
| | | |
| | | }, |
| | | }, |
| | | }; |
| | |
| | | .menuBox { |
| | | position: relative; |
| | | height: 660px; |
| | | width: calc(100% - 0px); |
| | | padding: 10px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | width: calc(100% - 0px) |
| | | |
| | | |
| | | .serachContent { |
| | | display: flex; |
| | | } |
| | | |
| | | .echartContent { |
| | | flex: 1; |
| | | |
| | | |
| | | .myChart { |
| | | margin-top: 10px; |
| | | width: 100%; |
| | | height: calc(100% - 10px); |
| | | } |
| | | } |
| | | |
| | | |
| | | } |
| | | </style> |
| | |
| | | <dataStatistics ref="dataStatistics"></dataStatistics> |
| | | <!-- 屿§ä¿¡æ¯ --> |
| | | <attributeInfo ref="attributeInfo"></attributeInfo> |
| | | <map-info :childObj="childObj" ref="mapInfo"></map-info> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | import dataAnalysis from './dataAnalysis.vue'; |
| | | import dataStatistics from './dataStatistics.vue' |
| | | import attributeInfo from './attributeInfo.vue'; |
| | | import mapInfo from './mapInfo.vue'; |
| | | export default { |
| | | name: 'mapView', |
| | | components: { layerManager, location, knowledge, lineRoaming, undergroundMode, dataAnalysis, dataStatistics, attributeInfo }, |
| | | components: { layerManager, location, knowledge, lineRoaming, undergroundMode, dataAnalysis, dataStatistics, attributeInfo, mapInfo }, |
| | | data() { |
| | | return { |
| | | menuIsShow: false, |
| | | menuOption: [], |
| | | childMenuIsShow: true, |
| | | childMenuOption: [], |
| | | childObj: [], |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.mapViewStart(); |
| | | this.$busEvent.$on('CHANGE_MAPINFO', res => { |
| | | |
| | | this.setMapInfo(res) |
| | | |
| | | }); |
| | | |
| | | }, |
| | | beforeDestroy() { |
| | | this.$store.dispatch('mapLayers/changeLayerTree', []) |
| | | this.$store.dispatch('mapLayers/changeDefaultLayer', []) |
| | | }, |
| | | |
| | | |
| | | methods: { |
| | | setMapInfo(res) { |
| | | // console.log(res); |
| | | if (res.length > 0) { |
| | | this.childObj = res; |
| | | setTimeout(() => { |
| | | this.$refs && this.$refs.mapInfo && this.$refs.mapInfo.open(); |
| | | }, 200); |
| | | |
| | | |
| | | } |
| | | |
| | | }, |
| | | mapViewStart() { |
| | | this.menuOption = mapData.menuData; |
| | | this.$nextTick(() => { |
| | | mapInit.Init(); |
| | | this.getSelectLayers(); |
| | | setTimeout(() => { |
| | | if(config.baseModel.url){ |
| | | mapServer.addLayer(config.baseModel); |
| | | } |
| | | this.getSelectLayers(); |
| | | }, 500); |
| | | |
| | | }); |
| | | }, |
| | | getSelectLayers() { |
| | |
| | | .rightMenu { |
| | | width: 30px; |
| | | height: 40px; |
| | | background: rgba(245, 245, 245, 1); |
| | | background: rgba(255, 255, 255, 1); |
| | | border: 1px solid rgb(245, 245, 245); |
| | | color: #4ab1fc; |
| | | display: flex; |
| | |
| | | }, |
| | | setLineOption1Chagne() { |
| | | this.roamLine = this.value1; |
| | | console.log(this.lineOption1); |
| | | }, |
| | | setRoamStart() { |
| | | if (!this.roamLine) return; |
| | |
| | | "coordinates": degreesArr |
| | | } |
| | | } |
| | | const fly = sgworld.factory.createDynamicObject(routeData, url, shuj); |
| | | // const fly = sgworld.factory.createDynamicObject(routeData, url, shuj); |
| | | earthCtrl.factory.getFlyData(degreesArr, data => { |
| | | data.showPoint = false; |
| | | data.showLine = true; |
| | | data.mode = 1; |
| | | data.mode = 0; |
| | | // å¼¹çªæ°æ® |
| | | window.PathAnimationData = { |
| | | flyData: data, |
| | |
| | | }) |
| | | }, |
| | | setRoamStop() { |
| | | |
| | | window.PathAnimationData.fly && window.PathAnimationData.fly.exit(); |
| | | }, |
| | | |
| | | |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <Popup ref="pop" top="20px" left="calc(100% - 600px)" :title="title" @close="close(true)" width="300px" |
| | | @cancel="close(false)"> |
| | | <div class="infoBox"> |
| | | <table> |
| | | <tr cla="infoTr" v-for="item in childObj"> |
| | | <td class="infotd">{{ item.name }}</td> |
| | | <td class="infotd">:</td> |
| | | <td class="infotd">{{ item.val }}</td> |
| | | </tr> |
| | | </table> |
| | | |
| | | </div> |
| | | |
| | | </Popup> |
| | | </template> |
| | | |
| | | <script> |
| | | import Popup from '@/components/Tool/Popup.vue'; |
| | | import store from '@/store'; |
| | | import { type } from 'jquery'; |
| | | export default { |
| | | name: 'location', |
| | | components: { Popup }, |
| | | data() { |
| | | return { |
| | | title: '详ç»ä¿¡æ¯', |
| | | mapInfoOption: [], |
| | | }; |
| | | }, |
| | | props: { |
| | | childObj: { |
| | | type: Array, |
| | | default: null |
| | | } |
| | | }, |
| | | methods: { |
| | | // å
³éå¼¹çª |
| | | close(isCloseBtn, removeLayer = true) { |
| | | // removeLayer && this.removeImageLayer(); |
| | | // éç½®dataå¼ |
| | | |
| | | Object.assign(this.$data, this.$options.data()); |
| | | !isCloseBtn && this.$refs.pop.close(); |
| | | |
| | | }, |
| | | // æå¼å¼¹çª |
| | | open() { |
| | | this.close(true); |
| | | this.$refs.pop.open(); |
| | | |
| | | |
| | | |
| | | setTimeout(() => { |
| | | console.log(store.getters.mapInfo); |
| | | }, 500); |
| | | }, |
| | | |
| | | |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | |
| | | .infoBox{ |
| | | margin: 10px; |
| | | |
| | | } |
| | | .infotd{ |
| | | min-width: 30px; |
| | | text-align: center; |
| | | } |
| | | </style> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | |
| | | <div class="menuBox1"> |
| | | <div class="serachContent"> |
| | | <el-select v-model="linesName" @change="setEchartChange" placeholder="è¯·éæ©"> |
| | | <el-option v-for="(item, key) in linesOption" :key="key" :label="item.line" :value="item.line"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="echartContent"> |
| | | <div id="myEchart" class="myChart"> </div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import Popup from '@/components/Tool/Popup.vue'; |
| | | import { zhangzitou_selectInfos } from "@/api/mapView/map.js" |
| | | import mapData from '@/assets/js/mapSdk/mapData'; |
| | | import * as echarts from 'echarts'; |
| | | export default { |
| | | name: 'dataAnalysis', |
| | | components: { Popup }, |
| | | data() { |
| | | return { |
| | | title: 'æ°æ®ç»è®¡', |
| | | allLines: [], |
| | | linesOption: [], |
| | | linesName: '', |
| | | myChart: null, |
| | | }; |
| | | }, |
| | | mounted(){ |
| | | this.getAllLines(); |
| | | }, |
| | | methods: { |
| | | |
| | | getAllLines() { |
| | | zhangzitou_selectInfos().then(response => { |
| | | if (response.data.code != 200) { |
| | | return this.close(); |
| | | } |
| | | this.setAllLinses(response.data.result) |
| | | }) |
| | | }, |
| | | setAllLinses(res) { |
| | | this.allLines = res; |
| | | this.linesOption = this.allLines.filter((item, index, self) => |
| | | index === self.findIndex((t) => t.line === item.line) |
| | | ); |
| | | this.linesName = this.linesOption[0].line; |
| | | this.setEchartChange(); |
| | | }, |
| | | setEchartChange() { |
| | | zhangzitou_selectInfos({ |
| | | line: this.linesName |
| | | }).then(response => { |
| | | if (response.data.code != 200) return |
| | | const result = response.data.result; |
| | | |
| | | const objData = [] |
| | | result.filter(item => { |
| | | const type = mapData.dataStatistics[item.type]; |
| | | if (type) { |
| | | item.type = type |
| | | } |
| | | objData.push({ |
| | | value: item.count, name: item.type |
| | | }) |
| | | }) |
| | | this.setEchartShow(objData) |
| | | }) |
| | | |
| | | }, |
| | | |
| | | setEchartShow(res) { |
| | | |
| | | let option = { |
| | | title: { |
| | | |
| | | left: 'center' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item' |
| | | }, |
| | | legend: { |
| | | orient: 'vertical', |
| | | left: 'left' |
| | | }, |
| | | series: [ |
| | | { |
| | | name: this.linesName, |
| | | type: 'pie', |
| | | radius: '50%', |
| | | data: res, |
| | | emphasis: { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowOffsetX: 0, |
| | | shadowColor: 'rgba(0, 0, 0, 0.5)' |
| | | } |
| | | } |
| | | } |
| | | ] |
| | | }; |
| | | if (!this.myChart) { |
| | | |
| | | this.myChart = echarts.init(document.getElementById("myEchart")); |
| | | } |
| | | |
| | | |
| | | this.myChart.setOption(option); |
| | | window.addEventListener("resize", () => { |
| | | this.myChart.resize(); |
| | | }); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .menuBox1 { |
| | | position: relative; |
| | | height: 100%; |
| | | width: calc(100% - 0px); |
| | | padding: 10px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | |
| | | .serachContent { |
| | | display: flex; |
| | | } |
| | | |
| | | .echartContent { |
| | | flex: 1; |
| | | |
| | | |
| | | .myChart { |
| | | margin-top: 10px; |
| | | width: 100%; |
| | | height: calc(100% - 10px); |
| | | } |
| | | } |
| | | |
| | | } |
| | | </style> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="bottomMnu"> |
| | | <div class="bottomBox"> |
| | | <div class="menuButton" v-for="(i, k) in menuOption"> |
| | | <el-popover popper-class="popover" placement="top" v-show="i.children && i.children.length > 0" |
| | | width="100" trigger="click"> |
| | | <span slot="reference">{{ i.name }}</span> |
| | | <div @click="setChildData(c)" class="popover__item" v-show="i.children && i.children.length > 0" |
| | | v-for="(c, f) in i.children" c :title="c.name"> {{ |
| | | c.name.slice(0, 8) }} |
| | | </div> |
| | | </el-popover> |
| | | <span @click="setChildData(i)" slot="reference" v-show="!i.children || i.children.length <= 0">{{ i.name }}</span> |
| | | </div> |
| | | |
| | | </div> |
| | | <div class="bottomImage"> |
| | | <img src="@/assets/images/Screen/bottombg.png" /> |
| | | </div> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | menuOption: [ |
| | | { |
| | | name: 'é
ç½å·¡æ£', |
| | | children: [ |
| | | { |
| | | id: 'a1', |
| | | name: 'ç¥è¯å¾è°±', |
| | | pid: 's1', |
| | | } |
| | | ] |
| | | }, { |
| | | name: 'é
ç½è¿æ£', |
| | | children: [{ |
| | | id: 'a1', |
| | | name: 'æ°æ®ç»è®¡', |
| | | pid: 's2', |
| | | }] |
| | | }, { |
| | | name: 'ç¾å®³ç®¡ç', |
| | | children: [{ |
| | | id: 'a1', |
| | | name: 'æ°æ®åæ', |
| | | pid: 's3', |
| | | }] |
| | | }, { |
| | | name: 'æ°å线æ', |
| | | |
| | | } |
| | | ], |
| | | visible: false |
| | | |
| | | } |
| | | }, |
| | | methods: { |
| | | setChildData(res) { |
| | | this.visible = false; |
| | | this.$emit('childData', res); |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .bottomMnu { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | |
| | | .bottomBox { |
| | | flex: 1; |
| | | width: 100%; |
| | | |
| | | display: flex; |
| | | justify-content: center; |
| | | |
| | | .menuButton { |
| | | height: 36px; |
| | | width: 147px; |
| | | background: url(~@/assets/images/Screen/centerbtn.png); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | font-size: 16px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | color: #fff; |
| | | font-weight: 600; |
| | | cursor: pointer; |
| | | |
| | | &:hover { |
| | | background: url(~@/assets/images/Screen/centerbtnc.png); |
| | | background-size: 100% 100%; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .bottomImage { |
| | | width: 100%; |
| | | display: flex; |
| | | justify-content: center; |
| | | |
| | | img { |
| | | width: 80%; |
| | | height: 50px; |
| | | } |
| | | |
| | | } |
| | | |
| | | } |
| | | </style> |
| | | <style lang="scss"> |
| | | .popover { |
| | | display: flex; |
| | | justify-content: center; |
| | | width: 163px; |
| | | background: url(~@/assets/images/Screen/centerTooltipBg.png); |
| | | background-size: 100% 100%; |
| | | border: none; |
| | | padding-bottom: 0px; |
| | | |
| | | &_list { |
| | | display: flex; |
| | | flex-direction: column; |
| | | width: 145px; |
| | | overflow-x: hidden; |
| | | align-items: center; |
| | | |
| | | } |
| | | |
| | | .popper__arrow { |
| | | display: none; |
| | | } |
| | | |
| | | .popover-content { |
| | | height: auto !important; |
| | | } |
| | | |
| | | .popover__item { |
| | | margin-bottom: 12px; |
| | | color: #fff; |
| | | width: 130px; |
| | | height: 30px; |
| | | line-height: 30px; |
| | | text-align: center; |
| | | background: url(~@/assets/images/Screen/btnbg.png); |
| | | background-size: 100% 100%; |
| | | |
| | | |
| | | } |
| | | |
| | | .popover__item:hover { |
| | | background: url(~@/assets/images/Screen/btnc.png); |
| | | background-size: 100% 100%; |
| | | } |
| | | } |
| | | |
| | | .elpopover { |
| | | .popover { |
| | | display: none !important; |
| | | } |
| | | } |
| | | </style> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="visualization"> |
| | | <div class="title"></div> |
| | | <mapView></mapView> |
| | | <div class="leftMenu"> |
| | | <left-menu></left-menu> |
| | | </div> |
| | | <div class="rightMenu"> |
| | | <right-menu></right-menu> |
| | | </div> |
| | | <div class="bottomMenu"> |
| | | <bottomMenu @childData="childData"></bottomMenu> |
| | | </div> |
| | | <div class="visualInfo" v-show="showInfo"> |
| | | <div class="infotitle"> |
| | | <div class="titleInfo"> |
| | | {{ isShow }} |
| | | </div> |
| | | <div @click="setInfoClose" class="titleInfo"> |
| | | X |
| | | </div> |
| | | </div> |
| | | <div class="infobox"> |
| | | <div class="infoContent"> |
| | | <atlas v-if="isShow == 'ç¥è¯å¾è°±'"></atlas> |
| | | <analysis v-if="isShow == 'æ°æ®åæ'"></analysis> |
| | | <statistics v-if="isShow == 'æ°æ®ç»è®¡'"></statistics> |
| | | <line-loss v-if="isShow == 'æ°å线æ'"></line-loss> |
| | | </div> |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import mapView from './mapView.vue'; |
| | | import leftMenu from './leftMenu.vue'; |
| | | import rightMenu from './rightMenu.vue'; |
| | | import bottomMenu from './bottomMenu.vue'; |
| | | import atlas from '@/views/visual/atlas/index.vue' |
| | | import analysis from '@/views/visual/analysis/index.vue' |
| | | import lineLoss from './lineLoss.vue'; |
| | | import statistics from '@/views/visual/statistics/index.vue' |
| | | export default { |
| | | components: { |
| | | mapView, leftMenu, |
| | | rightMenu, bottomMenu, atlas, analysis, statistics, lineLoss |
| | | }, |
| | | data() { |
| | | return { |
| | | isShow: null, |
| | | showInfo: false |
| | | } |
| | | }, |
| | | mounted() { |
| | | }, |
| | | methods: { |
| | | childData(res) { |
| | | if (!res) return |
| | | this.showInfo = true; |
| | | this.$nextTick(() => { |
| | | this.isShow = res.name |
| | | }) |
| | | |
| | | }, |
| | | setInfoClose() { |
| | | this.showInfo = false; |
| | | this.isShow = null; |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .visualization { |
| | | width: 100%; |
| | | height: 100%; |
| | | |
| | | .title { |
| | | height: 86px; |
| | | width: 100%; |
| | | z-index: 40; |
| | | background: url(~@/assets/images/Screen/logobg.png); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | position: absolute; |
| | | } |
| | | |
| | | .leftMenu { |
| | | width: 15%; |
| | | top: 90px; |
| | | left: 10px; |
| | | height: calc(100% - 180px); |
| | | z-index: 40; |
| | | position: absolute; |
| | | } |
| | | |
| | | .rightMenu { |
| | | width: 15%; |
| | | top: 90px; |
| | | right: 10px; |
| | | height: calc(100% - 180px); |
| | | z-index: 40; |
| | | position: absolute; |
| | | } |
| | | |
| | | .bottomMenu { |
| | | width: 100%; |
| | | height: 90px; |
| | | z-index: 40; |
| | | position: absolute; |
| | | bottom: 0px; |
| | | } |
| | | |
| | | .visualInfo { |
| | | width: 60%; |
| | | height: 60%; |
| | | z-index: 50; |
| | | position: absolute; |
| | | left: 50%; |
| | | top: 50%; |
| | | transform: translate(-50%, -50%); |
| | | background: url(~@/assets/images/Screen/chartbg.png)no-repeat; |
| | | background-size: 100% 100%; |
| | | display: flex; |
| | | |
| | | flex-direction: column; |
| | | |
| | | .infotitle { |
| | | height: 12%; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | |
| | | .titleInfo { |
| | | color: white; |
| | | font-size: 24px; |
| | | font-weight: bolder; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | margin-left: 8%; |
| | | margin-right: 3%; |
| | | } |
| | | |
| | | } |
| | | |
| | | .infobox { |
| | | flex: 1; |
| | | |
| | | .infoContent { |
| | | width: 100%; |
| | | height: 100%; |
| | | position: relative; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | | <style> |
| | | ::v-deep.map-info-bar { |
| | | display: none; |
| | | } |
| | | </style> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="leftMnu"> |
| | | <div class="menuBox"> |
| | | <div class="aside-title">{{ title.t1 }}</div> |
| | | </div> |
| | | <div class="menuBox"> |
| | | <div class="aside-title">{{ title.t2 }}</div> |
| | | </div> |
| | | <div class="menuBox"> |
| | | <div class="aside-title">{{ title.t3 }}</div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | title: { |
| | | t1: 'xxx', |
| | | t2: 'XXXX', |
| | | t3: 'xxxxx' |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .leftMnu { |
| | | height: 100%; |
| | | width: 100%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | |
| | | .menuBox { |
| | | width: 100%; |
| | | height: 33%; |
| | | background: url(~@/assets/images/Screen/chartbg.png); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | |
| | | .aside-title { |
| | | box-sizing: border-box; |
| | | padding-left: 30px; |
| | | |
| | | font-size: 15px; |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei-Regular; |
| | | color: #fff; |
| | | width: 100%; |
| | | height: 45px; |
| | | line-height: 45px; |
| | | // background: url(~@/assets/images/Screen/asideTitleBg.png); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | } |
| | | } |
| | | } |
| | | </style> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="lineLossBox"> |
| | | <el-image style="width: 100%; height:100%" :src="imgUrl" :preview-src-list="[imgUrl]"> |
| | | </el-image> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { py_arima } from '@/api/mapView/map.js'; |
| | | export default { |
| | | data() { |
| | | return { |
| | | imgUrl: null, |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.initPyArima(); |
| | | }, |
| | | methods: { |
| | | initPyArima() { |
| | | py_arima().then(response => { |
| | | if (response.status != 200) return |
| | | this.imgUrl = config.pyServices + '/image?file_name=' + response.data.image1 |
| | | |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .lineLossBox { |
| | | width: 100%; |
| | | height: 100%; |
| | | padding:10px; |
| | | } |
| | | </style> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div id="mapContainer" class="mapContainer"> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import mapServer from '@/assets/js/mapSdk/mapServe'; |
| | | import mapConfig from '@/assets/js/mapSdk/mapConfig'; |
| | | import mapData from '@/assets/js/mapSdk/mapData'; |
| | | import { layer_selectAll } from "@/api/mapView/map.js"; |
| | | export default { |
| | | name: 'mapView', |
| | | mounted() { |
| | | this.initMap(); |
| | | }, |
| | | methods: { |
| | | async initMap() { |
| | | window.earthCtrl = new SmartEarth.EarthCtrl('mapContainer', { |
| | | // éèé»è®¤åºå¾ |
| | | defaultImagery: false, |
| | | // éèlogo |
| | | printLog: false, |
| | | // sceneMode: SmartEarth.Cesium.SceneMode.SCENE2D |
| | | StaticFileBaseUrl: '/CimSDK/', |
| | | navigationOption: { |
| | | enableCompass: false, |
| | | enableZoomControls: false, |
| | | enableDistanceLegend: false, |
| | | enableCompassOuterRing: false, |
| | | }, |
| | | |
| | | }); |
| | | |
| | | // åå§åCesium |
| | | window.Cesium = SmartEarth.Cesium; |
| | | // åå§åViewer |
| | | window.Viewer = earthCtrl.viewer; |
| | | //设置å°çé¢è² |
| | | Viewer.scene.globe.baseColor = Cesium.Color.fromCssColorString('#A9A9A9'); |
| | | // å°å½¢å è½½ |
| | | const terrain = config.terrain; |
| | | if (terrain.isShow && terrain.isUrl) { |
| | | const terrainProvider = await Cesium.CesiumTerrainProvider.fromUrl(terrain.isUrl, { |
| | | requestWaterMask: true, |
| | | requestVertexNormals: true, |
| | | }); |
| | | |
| | | Viewer.terrainProvider = terrainProvider; |
| | | } |
| | | // é»è®¤è®¾ç½®åºå¾ |
| | | this.addImageLayer(); |
| | | }, |
| | | addImageLayer() { |
| | | const baseLayer = mapData.baseLayer; |
| | | // æ·»å 天å°å¾åºå¾ |
| | | mapServer.addLayer({ |
| | | serveType: 'tdMap', |
| | | url: baseLayer.sUrl + baseLayer.vecLayer + baseLayer.lUrl, |
| | | }); |
| | | // æ·»å 天å°å¾æ 注 |
| | | mapServer.addLayer({ |
| | | serveType: 'tdMap', |
| | | url: baseLayer.sUrl + baseLayer.cvaLayer + baseLayer.lUrl, |
| | | }); |
| | | // åå§åè§è§ |
| | | this.setdefaultPerspective(); |
| | | }, |
| | | setdefaultPerspective() { |
| | | mapConfig.sertCameraTo(mapData.defaultPerspective); |
| | | if (config.baseModel.url) { |
| | | mapServer.addLayer(config.baseModel); |
| | | } |
| | | this.getSelectLayers(); |
| | | |
| | | |
| | | }, |
| | | getSelectLayers() { |
| | | layer_selectAll().then(response => { |
| | | if (response.data.code != 200) return |
| | | |
| | | const val = response.data.result.filter(item => { |
| | | |
| | | if (item.type == 2 && item.isShow == 1) { |
| | | |
| | | mapServer.addLayer(item) |
| | | |
| | | } |
| | | return item; |
| | | }) |
| | | |
| | | }) |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .mapContainer { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | </style> |
| | | <style> |
| | | .map-info-bar { |
| | | display: none !important; |
| | | } |
| | | |
| | | .el-form-item__label { |
| | | color: white |
| | | } |
| | | </style> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="rightMnu"> |
| | | <div class="menuBox"> |
| | | <div class="aside-title">{{ title.t1 }}</div> |
| | | <div class="echartBox"> |
| | | <div id="rightEchart1" class="chartBox"></div> |
| | | </div> |
| | | </div> |
| | | <div class="menuBox"> |
| | | <div class="aside-title">{{ title.t2 }}</div> |
| | | <div class="echartBox"> |
| | | <div id="rightEchart2" class="chartBox"></div> |
| | | </div> |
| | | </div> |
| | | <div class="menuBox"> |
| | | <div class="aside-title">{{ title.t3 }}</div> |
| | | <div class="echartBox"> |
| | | <div id="rightEchart3" class="chartBox"></div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import * as echarts from 'echarts'; |
| | | |
| | | export default { |
| | | data() { |
| | | return { |
| | | title: { |
| | | t1: 'xxx', |
| | | t2: 'XXXX', |
| | | t3: 'xxxxx' |
| | | } |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.initEchart(); |
| | | }, |
| | | methods: { |
| | | initEchart() { |
| | | this.initEchart1(); |
| | | this.initEchart2(); |
| | | this.initEchart3(); |
| | | }, |
| | | initEchart1() { |
| | | var myChart = echarts.init(document.getElementById('rightEchart1')); |
| | | var option = { |
| | | xAxis: { |
| | | type: 'category', |
| | | data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: 'white' // è®¾ç½®ä¸ºçº¢è² |
| | | } |
| | | } |
| | | }, |
| | | yAxis: { |
| | | type: 'value', |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: 'white' // è®¾ç½®ä¸ºçº¢è² |
| | | } |
| | | } |
| | | }, |
| | | series: [ |
| | | { |
| | | data: [820, 932, 901, 934, 1290, 1330, 1320], |
| | | type: 'line', |
| | | smooth: true, |
| | | lineStyle: { |
| | | color: '#409EFF', // æçº¿é¢è² |
| | | |
| | | } |
| | | } |
| | | ] |
| | | }; |
| | | |
| | | option && myChart.setOption(option); |
| | | |
| | | }, |
| | | |
| | | initEchart2() { |
| | | var myChart1 = echarts.init(document.getElementById('rightEchart2')); |
| | | var option1 = { |
| | | title: { |
| | | |
| | | subtext: 'Fake Data', |
| | | left: 'center' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item' |
| | | }, |
| | | legend: { |
| | | orient: 'vertical', |
| | | left: 'left', |
| | | show: false |
| | | }, |
| | | series: [ |
| | | { |
| | | name: 'Access From', |
| | | type: 'pie', |
| | | radius: '50%', |
| | | data: [ |
| | | { value: 1048, name: 'Search Engine' }, |
| | | { value: 735, name: 'Direct' }, |
| | | { value: 580, name: 'Email' }, |
| | | { value: 484, name: 'Union Ads' }, |
| | | { value: 300, name: 'Video Ads' } |
| | | ], |
| | | emphasis: { |
| | | itemStyle: { |
| | | shadowBlur: 10, |
| | | shadowOffsetX: 0, |
| | | shadowColor: 'rgba(0, 0, 0, 0.5)' |
| | | } |
| | | } |
| | | } |
| | | ] |
| | | }; |
| | | option1 && myChart1.setOption(option1); |
| | | }, |
| | | initEchart3() { |
| | | var myChart2 = echarts.init(document.getElementById('rightEchart3')); |
| | | // prettier-ignore |
| | | let dataAxis = ['ç¹', 'å»', 'æ±', 'å',]; |
| | | // prettier-ignore |
| | | let data = [220, 182, 191, 234, 290]; |
| | | let yMax = 500; |
| | | let dataShadow = []; |
| | | for (let i = 0; i < data.length; i++) { |
| | | dataShadow.push(yMax); |
| | | } |
| | | var option2 = { |
| | | title: { |
| | | |
| | | }, |
| | | xAxis: { |
| | | data: dataAxis, |
| | | axisTick: { |
| | | show: false |
| | | }, |
| | | axisLine: { |
| | | show: false, |
| | | lineStyle: { |
| | | color: 'white' // è®¾ç½®ä¸ºçº¢è² |
| | | } |
| | | }, |
| | | z: 10 |
| | | }, |
| | | yAxis: { |
| | | axisLine: { |
| | | show: false, |
| | | lineStyle: { |
| | | color: 'white' // è®¾ç½®ä¸ºçº¢è² |
| | | } |
| | | }, |
| | | axisTick: { |
| | | show: false |
| | | }, |
| | | axisLabel: { |
| | | color: '#fff' |
| | | }, |
| | | |
| | | }, |
| | | dataZoom: [ |
| | | { |
| | | type: 'inside' |
| | | } |
| | | ], |
| | | series: [ |
| | | { |
| | | type: 'bar', |
| | | showBackground: true, |
| | | itemStyle: { |
| | | color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ |
| | | { offset: 0, color: '#83bff6' }, |
| | | { offset: 0.5, color: '#188df0' }, |
| | | { offset: 1, color: '#188df0' } |
| | | ]) |
| | | }, |
| | | emphasis: { |
| | | itemStyle: { |
| | | color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ |
| | | { offset: 0, color: '#2378f7' }, |
| | | { offset: 0.7, color: '#2378f7' }, |
| | | { offset: 1, color: '#83bff6' } |
| | | ]) |
| | | } |
| | | }, |
| | | data: data |
| | | } |
| | | ] |
| | | }; |
| | | option2 && myChart2.setOption(option2); |
| | | } |
| | | |
| | | |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .rightMnu { |
| | | height: 100%; |
| | | width: 100%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | |
| | | .menuBox { |
| | | width: 100%; |
| | | height: 33%; |
| | | background: url(~@/assets/images/Screen/chartbg.png); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | |
| | | .aside-title { |
| | | box-sizing: border-box; |
| | | padding-left: 30px; |
| | | font-size: 15px; |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei-Regular; |
| | | color: #fff; |
| | | width: 100%; |
| | | height: 45px; |
| | | line-height: 45px; |
| | | // background: url(~@/assets/images/Screen/asideTitleBg.png); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | } |
| | | |
| | | .echartBox { |
| | | flex: 1; |
| | | padding: 5px; |
| | | position: relative; |
| | | |
| | | .chartBox { |
| | | width: calc(100% - 10px); |
| | | height: calc(100% - 10px); |
| | | |
| | | position: absolute; |
| | | } |
| | | } |
| | | } |
| | | </style> |