Преглед на файлове

框架搭建,第一次提交

yunxing преди 4 години
родител
ревизия
74701ee6b4
променени са 76 файла, в които са добавени 5671 реда и са изтрити 368 реда
  1. 3 1
      .gitignore
  2. 77 10
      README.md
  3. 13 3
      babel.config.js
  4. 15 2
      package.json
  5. 16 0
      postcss.config.js
  6. BIN
      public/favicon.ico
  7. 18 14
      public/index.html
  8. 1 0
      src/.env.development
  9. 1 0
      src/.env.production
  10. 1 0
      src/.env.test
  11. 43 27
      src/App.vue
  12. 40 0
      src/api/coreDeviceReport.js
  13. 63 0
      src/api/equipmentList.js
  14. 19 0
      src/api/ganttChart.js
  15. 32 0
      src/api/homePage.js
  16. 186 0
      src/api/httputils.js
  17. 89 0
      src/api/legendLibrary.js
  18. 13 0
      src/api/login.js
  19. 23 0
      src/api/other.js
  20. 5 0
      src/api/overview.js
  21. 63 0
      src/api/public.js
  22. 52 0
      src/api/room.js
  23. 20 0
      src/api/specificationUpdateRecord.js
  24. BIN
      src/assets/logo.png
  25. 0 62
      src/components/HelloWorld.vue
  26. 230 0
      src/directives/dom.js
  27. 24 0
      src/directives/repeat-click.js
  28. 30 0
      src/lib/FloorScene.js
  29. 63 0
      src/lib/FloorView.js
  30. 91 0
      src/lib/GraphView.js
  31. 100 0
      src/lib/GraphView.ts
  32. 16 0
      src/lib/enums/SGraphElementType.js
  33. 15 0
      src/lib/enums/SGraphElementType.ts
  34. 14 0
      src/lib/enums/SMarkerType.js
  35. 13 0
      src/lib/enums/SMarkerType.ts
  36. 93 0
      src/lib/items/HighlightItem.ts
  37. 275 0
      src/lib/items/SCustomLegendItem.ts
  38. 270 0
      src/lib/items/SFHFQZoneLegendItem.ts
  39. 187 0
      src/lib/items/SImageLegendItem.ts
  40. 70 0
      src/lib/items/SImageMarkerItem.ts
  41. 60 0
      src/lib/items/SLineLegendItem.ts
  42. 143 0
      src/lib/items/SLineMarkerItem.ts
  43. 29 0
      src/lib/items/SNoneLegendItem.ts
  44. 278 0
      src/lib/items/SSCPZZoneLegendItem.ts
  45. 70 0
      src/lib/items/STextMarkerItem.ts
  46. 271 0
      src/lib/items/SZoneLegendItem.ts
  47. 221 0
      src/lib/items/TipelineItem.ts
  48. 122 0
      src/lib/parsers/STopologyParser.js
  49. 134 0
      src/lib/parsers/STopologyParser.ts
  50. 19 0
      src/lib/types/Anchor.js
  51. 35 0
      src/lib/types/Anchor.ts
  52. 19 0
      src/lib/types/ElementData.js
  53. 36 0
      src/lib/types/ElementData.ts
  54. 19 0
      src/lib/types/Legend.js
  55. 64 0
      src/lib/types/Legend.ts
  56. 19 0
      src/lib/types/Marker.js
  57. 49 0
      src/lib/types/Marker.ts
  58. 19 0
      src/lib/types/Relation.js
  59. 55 0
      src/lib/types/Relation.ts
  60. 16 3
      src/main.ts
  61. 62 18
      src/router/index.ts
  62. 14 8
      src/store/index.ts
  63. 148 0
      src/style/common.less
  64. 3 0
      src/utils/bus.js
  65. 826 0
      src/utils/components.js
  66. 0 0
      src/utils/util.js
  67. 0 5
      src/views/About.vue
  68. 25 0
      src/views/EquipmentFacilities.vue
  69. 25 0
      src/views/FloorFunc.vue
  70. 0 18
      src/views/Home.vue
  71. 25 0
      src/views/OtherMatter.vue
  72. 38 0
      src/views/Overview.vue
  73. 51 0
      version.js
  74. 6 0
      version.txt
  75. 88 0
      vue.config.js
  76. 398 197
      yarn.lock

+ 3 - 1
.gitignore

@@ -1,14 +1,16 @@
 .DS_Store
 node_modules
+/wandaBmGuideH5
 /dist
 
-
 # local env files
 .env.local
 .env.*.local
 
 # Log files
+package-lock.json
 npm-debug.log*
+yarn.lock
 yarn-debug.log*
 yarn-error.log*
 pnpm-debug.log*

+ 77 - 10
README.md

@@ -1,19 +1,86 @@
-# wanda-bm-guide-h5
+# 管理说明书H5项目 wanda-bm-guide-h5
 
-## Project setup
-```
-yarn install
+## 启动项目
+
+``` 
+yarn install 或  npm i 
 ```
 
-### Compiles and hot-reloads for development
+### 启动开发环境
+
+``` 
+yarn serve 或 npm run serve 
 ```
-yarn serve
+
+### 打包
+
+``` 
+yarn build 或 npm run build 
 ```
 
-### Compiles and minifies for production
+### 分析打包
+
+``` shell
+yarn build --report 或 npm run build --report 
 ```
-yarn build
+
+### 目录结构
+
+``` shell
+├── README.md           说明文件
+├── babel.config.js     babel配置文件
+├── package.json        包描述文件
+├── postcss.config.js   postcss配置文件
+├── public              项目入口
+│   ├── favicon.ico
+│   └── index.html
+├── node_modules        npm依赖包
+├── src                 
+│   ├── App.vue         
+│   ├── api             接口
+│   ├── assets          静态资源
+│   │   ├── fonts       字体
+│   │   └── images      图片
+│   ├── components      组件
+│   ├── directives      自定义指令
+│   ├── lib             lib包, 平面图文件
+│   ├── main.ts        
+│   ├── router          路由
+│   ├── shims-tsx.d.ts
+│   ├── shims-vue.d.ts
+│   ├── store           store存储
+│   ├── style           样式文件
+│   ├── utils           实用文件
+│   └── views           页面
+├── .env.development    环境变量--开发环境
+├── .env.production     环境变量--生成环境
+├── .env.test           环境变量--测试环境
+├── tsconfig.json       ts配置文件
+├── vue.config.js       vue脚手架配置文件
+└── wandaBmGuideH5      打包后目录
 ```
 
-### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).
+> 本项目使用 vue-cli4+ 生成
+
+### UI组件
+
+1. UI组件使用Vant, 按需加载
+
+### 数据存储
+
+1. 主要使用vuex,
+2. 涉及到平面图, lib目录下文件,使用eventBus
+
+### 路由
+
+1. 使用history模式
+2. 路由配置元信息:
+
+``` js
+ meta: {
+
+     keepAlive: true, //是否保持alive
+     showTabbar: true, //是否显示底部tabbar
+
+ }
+```

+ 13 - 3
babel.config.js

@@ -1,5 +1,15 @@
 module.exports = {
-  presets: [
-    '@vue/cli-plugin-babel/preset'
-  ]
+    presets: ['@vue/cli-plugin-babel/preset'],
+    // 自动按需引入vant组件
+    plugins: [
+        [
+            'import',
+            {
+                libraryName: 'vant',
+                libraryDirectory: 'es',
+                style: true,
+            },
+            'vant',
+        ],
+    ],
 }

+ 15 - 2
package.json

@@ -4,10 +4,19 @@
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build"
+    "build": "vue-cli-service build --mode production & node version",
+    "test":"vue-cli-service build --mode test"
   },
   "dependencies": {
+    "axios": "^0.20.0",
+    "compression-webpack-plugin": "^5.0.2",
     "core-js": "^3.6.5",
+    "fastclick": "^1.0.6",
+    "lib-flexible": "^0.3.2",
+    "lodash": "^4.17.20",
+    "moment": "^2.27.0",
+    "vant": "^2.10.6",
+    "vconsole": "^3.3.4",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0",
     "vuex": "^3.4.0"
@@ -18,9 +27,13 @@
     "@vue/cli-plugin-typescript": "~4.5.0",
     "@vue/cli-plugin-vuex": "~4.5.0",
     "@vue/cli-service": "~4.5.0",
+    "babel-plugin-import": "^1.13.0",
     "less": "^3.0.4",
     "less-loader": "^5.0.0",
+    "postcss-pxtorem": "^5.1.1",
+    "terser-webpack-plugin": "^4.1.0",
     "typescript": "~3.9.3",
-    "vue-template-compiler": "^2.6.11"
+    "vue-template-compiler": "^2.6.11",
+    "webpack-bundle-analyzer": "^3.8.0"
   }
 }

+ 16 - 0
postcss.config.js

@@ -0,0 +1,16 @@
+module.exports = {
+    plugins: {
+        // autoprefixer: {}, // 用来自动处理浏览器前缀的一个插件。 // VueCLI 内部已经配置了 autoprefixer 插件
+        'postcss-pxtorem': {
+            rootValue({ file }) {
+                // TODO: rootValue
+                return file.indexOf('vant') !== -1 ? 37.5 : 41.4 // vant 使用375, 其他使用设计图  414?
+            },
+            unitPrecision: 5, //小数位
+            minPixelValue: 1, //转换的最小单位
+            selectorBlackList: [], //忽略的样式, 正则 // vant样式忽略
+            propList: ['*'], // 需要做转化处理的属性,如`hight`、`width`、`margin`等,`*`表示全部,正则
+            // exclude 这个属性可以配置不需要转换的资源 直接写文件名就行,不需要后缀
+        },
+    },
+}

BIN
public/favicon.ico


+ 18 - 14
public/index.html

@@ -1,17 +1,21 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title><%= htmlWebpackPlugin.options.title %></title>
-  </head>
-  <body>
-    <noscript>
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
-    </noscript>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
+    <head>
+        <meta charset="utf-8" />
+        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+        <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,viewport-fit=cover" />
+        <!-- <meta name="viewport" content="target-densitydpi=device-dpi,width=750,user-scalable=0" /> -->
+        <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
+        <title><%= htmlWebpackPlugin.options.title %></title>
+    </head>
+    <body>
+        <noscript>
+            <strong
+                >We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to
+                continue.</strong
+            >
+        </noscript>
+        <div id="app"></div>
+        <!-- built files will be auto injected -->
+    </body>
 </html>

+ 1 - 0
src/.env.development

@@ -0,0 +1 @@
+VUE_APP_BmGuideH5=dev

+ 1 - 0
src/.env.production

@@ -0,0 +1 @@
+VUE_APP_BmGuideH5=prod

+ 1 - 0
src/.env.test

@@ -0,0 +1 @@
+VUE_APP_BmGuideH5=test

+ 43 - 27
src/App.vue

@@ -1,32 +1,48 @@
 <template>
-  <div id="app">
-    <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
+    <div id='app'>
+        <keep-alive>
+            <router-view v-if='$route.meta.keepAlive' />
+        </keep-alive>
+        <router-view v-if='!$route.meta.keepAlive' />
+        <!-- 底部tabbar -->
+        <van-tabbar v-show='$route.meta.showTabbar' v-model='active' @change='changeTabbar'>
+            <van-tabbar-item icon='home-o'>项目概况</van-tabbar-item>
+            <van-tabbar-item icon='search'>楼层功能</van-tabbar-item>
+            <van-tabbar-item icon='friends-o'>设备设施</van-tabbar-item>
+            <van-tabbar-item icon='setting-o'>其他事项</van-tabbar-item>
+        </van-tabbar>
     </div>
-    <router-view/>
-  </div>
 </template>
-
-<style lang="less">
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-}
-
-#nav {
-  padding: 30px;
-
-  a {
-    font-weight: bold;
-    color: #2c3e50;
-
-    &.router-link-exact-active {
-      color: #42b983;
-    }
-  }
+<script>
+import Vue from 'vue'
+import { Tabbar, TabbarItem } from 'vant'
+Vue.use(Tabbar).use(TabbarItem)
+export default {
+    name: 'App',
+    props: {},
+    data() {
+        return {
+            active: 0,
+            // 路由字典
+            routeDict: {
+                0: 'Overview',
+                1: 'FloorFunc',
+                2: 'EquipmentFacilities',
+                3: 'OtherMatter',
+            },
+        }
+    },
+    components: {},
+    beforeMount() {},
+    mounted() {},
+    methods: {
+        changeTabbar(active) {
+            console.log(active)
+            this.$router.push({ name: this.routeDict[active] })
+        },
+    },
 }
+</script>
+<style lang="less">
+@import './style/common.less';
 </style>

+ 40 - 0
src/api/coreDeviceReport.js

@@ -0,0 +1,40 @@
+// 核心设备报表 接口
+import httputils from '@/api/httputils'
+/**
+ * 系统列表
+ */
+export function querySystemList() {
+    return httputils.getJson(`/data/sms_systemcfg/querySmsxt`)
+}
+/**
+ * 系统下的设备
+ * @param { 接口地址 } url
+ * @param { 接口参数 } getParams
+ */
+export function queryEquipmentList(url, getParams) {
+    return httputils.getJson(url, getParams)
+}
+/**
+ * 表数据
+ */
+export function queryTableData(url, postParams) {
+    return httputils.postJson(url, postParams)
+}
+
+/**
+ * 设备台账下所有历史事项信息
+ * @param { 接口地址 } url
+ * @param { 接口参数 } getParams
+ */
+export function queryHistoryTableData(url, getParams) {
+    return httputils.getJson(url, getParams)
+}
+
+/**
+ * 获取图片/报告详情
+ * @param { 接口地址 } url
+ * @param { 接口参数 } getParams
+ */
+export function queryDetailData(url, getParams) {
+    return httputils.getJson(url, getParams)
+}

+ 63 - 0
src/api/equipmentList.js

@@ -0,0 +1,63 @@
+import httputils from '@/api/httputils'
+
+// 设备设施-主要设备清单
+export function queryEquipmentList({ data, postParams }) {
+    return httputils.fetchJson(`/data/sms_asset/queryStatistics`, data, postParams)
+}
+
+// 设备设施-主要设备清单详情
+export function queryAsset({ data, postParams }) {
+    return httputils.fetchJson(`/data/sms_asset/query`, data, postParams)
+}
+
+// 设备设施-主要设备清单详情(不过滤设备类型)
+export function queryAssetAll({ data, postParams }) {
+    return httputils.fetchJson(`/data/sms_asset/queryByClassStructure`, data, postParams)
+}
+
+// 设备设施-主要材料清单
+export function queryMaterialList({ getParams }) {
+    return httputils.getJson(`/data/sms_material/query`, getParams)
+}
+
+// 设备设施-维保事项
+export function queryWbsms({ data, getParams }) {
+    return httputils.getJson(`/data/sms_wbsms/query`, data, getParams)
+}
+
+// 设备设施-维修事项
+export function queryWx({ data, getParams }) {
+    return httputils.getJson(`/data/sms_wx/query`, data, getParams)
+}
+// 设备设施-维修专业事项
+export function queryWxzy({ data, getParams }) {
+    return httputils.fetchJson(`/data/sms_wxzy/query`, data, getParams)
+}
+//设备设施-维修-查图片
+export function queryWxzyImg({ data, getParams }) {
+    return httputils.getJson(`/data/sms_wxzy/queryImg`, data, getParams)
+}
+// 设备设施-专维
+export function queryZw({ data, getParams }) {
+    return httputils.getJson(`/data/sms_zw/query`, data, getParams)
+}
+
+// 设备设施-其他事项
+export function queryQtsx({ data, getParams }) {
+    return httputils.getJson(`/data/sms_qtsx/query`, data, getParams)
+}
+
+// 设备设施-记录事项
+export function queryRecord({ getParams }) {
+    return httputils.getJson(` /data/sms_wxwbsxline/query`, getParams)
+}
+
+// 设备设施=查看图纸
+export function queryxxx({ getParams }) {
+    return httputils.getJson(`/data/xxX`, getParams)
+}
+
+// 设备设施-楼层电井口(间)控制商铺范围清单
+export function queryShops({ getParams }) {
+    return httputils.getJson(`/data/sms_shops/query`, getParams)
+}

+ 19 - 0
src/api/ganttChart.js

@@ -0,0 +1,19 @@
+import httputils from "@/api/httputils";
+
+/**
+ * 获取甘特图数据
+ * @param {*} url 
+ * @param {*} getParams 
+ */
+export function queryGanttChart(url, getParams) {
+  return httputils.getJson(url, getParams);
+}
+
+/**
+ * 获取甘特图任务数据
+ * @param {*} url 
+ * @param {*} getParams 
+ */
+export function queryGanttDetail(url, getParams) {
+  return httputils.getJson(url, getParams);
+}

+ 32 - 0
src/api/homePage.js

@@ -0,0 +1,32 @@
+import httputils from '@/api/httputils'
+
+// 查询首页系统卡片
+export function getCardList({ getParams }) {
+    return httputils.getJson(`/data/home/querySystemCard`, getParams)
+}
+
+// 综合事项记录
+export function getQueryList({ getParams }) {
+    return httputils.getJson(`/data/sms_zhsxjl/query`, getParams)
+}
+
+// 说明书变更记录
+export function getChangeList({ getParams }) {
+    return httputils.getJson(`/data/rpt_change_record/query`, getParams)
+}
+
+// ==================== 集团首页接口 =======================
+// 查询项目信息统计数量
+export function getPlazaInfoCount({ getParams }) {
+    return httputils.getJson(`/data/home/queryPlazaInfoCount`, getParams)
+}
+
+// 查询首页系统卡片
+export function querySystemCard({ getParams }) {
+    return httputils.getJson(`/data/home/querySystemCard`, getParams)
+}
+
+// 查询集团首页事项状态统计
+export function queryEventStatus({ getParams }) {
+    return httputils.getJson(`/data/home/queryEventStatus`, getParams)
+}

+ 186 - 0
src/api/httputils.js

@@ -0,0 +1,186 @@
+import axios from 'axios'
+import store from '@/store'
+import router from '@/router'
+// import { MessageBox } from 'element-ui'
+
+var CancelToken = axios.CancelToken
+var cancel
+
+// 创建axios实例
+const axiosservice = axios.create({
+    timeout: 60 * 1000, // 请求超时时间
+    retry: 4, //重新请求次数
+    retryDelay: 1000, //重新请求的间隔
+    credentials: true, // 接口每次请求会跨域携带cookie
+    cancelToken: new CancelToken(function executor(c) {
+        // executor 函数接收一个 cancel 函数作为参数
+        cancel = c
+    }),
+})
+
+axiosservice.interceptors.request.use(
+    (config) => {
+        config.withCredentials = true // 允许携带token ,这个是解决跨域产生的相关问题
+        let isPreview = null
+        let token = store.getters['ssoToken']
+        if (config.url.indexOf('/data') > -1) {
+            config.headers = {
+                'sso-token': token,
+                // isPreview, //默认false,当预览开启的时候是true
+            }
+        }
+        return config
+    },
+    (error) => {
+        return Promise.reject(error)
+    }
+)
+
+axiosservice.interceptors.response.use(
+    function(res) {
+        //在这里对返回的数据进行处理
+        let resp = res.data
+        // if (resp.result === 'unauthc') {
+        //     store.commit('logined', false)
+        //     MessageBox.confirm('未登陆或登陆信息已失效, 是否重新登陆?', '提示', {
+        //         confirmButtonText: '确定',
+        //         cancelButtonText: '取消',
+        //         type: 'error',
+        //     })
+        //         .then((resp) => {
+        //             window.location.reload()
+        //         })
+        //         .catch((error) => {
+        //             console.log('asdfasdfsad')
+        //         })
+        // } else if (resp.error == 'Unauthorized') {
+        //     MessageBox.alert('无权操作', {
+        //         title: '警告',
+        //         type: 'error',
+        //     })
+        // }
+        return res
+    },
+    function(err) {
+        if (err.response.status == 401) {
+            // store.commit('SETISREQUESTtAUTH', 'err')
+            // router.push({
+            //     path: '404',
+            // })
+        }
+        return Promise.reject(err)
+    }
+)
+
+/* 下载方法 */
+function downFile(blob, fileName) {
+    // 非IE下载
+    if ('download' in document.createElement('a')) {
+        let link = document.createElement('a')
+        link.href = window.URL.createObjectURL(blob) // 创建下载的链接
+        link.download = fileName // 下载后文件名
+        link.style.display = 'none'
+        document.body.appendChild(link)
+        link.click() // 点击下载
+        window.URL.revokeObjectURL(link.href) // 释放掉blob对象
+        document.body.removeChild(link) // 下载完成移除元素
+    } else {
+        // IE10+下载
+        window.navigator.msSaveBlob(blob, fileName)
+    }
+}
+
+export default {
+    //获取cookie
+    getCookie(name) {
+        var arr,
+            reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)')
+        if ((arr = document.cookie.match(reg))) {
+            return unescape(arr[2])
+        } else {
+            /* 如果没有参数,那么就获取本域下的所有cookie */
+            return document.cookie
+        }
+    },
+
+    async getJson(url, params) {
+        try {
+            let response = await axiosservice({
+                url,
+                params,
+                method: 'get',
+            })
+            return response.data
+        } catch (err) {
+            throw err
+        }
+    },
+    async postJson(url, data) {
+        try {
+            let response = await axiosservice({
+                url,
+                data,
+                method: 'post',
+            })
+            return response.data
+        } catch (err) {
+            throw err
+        }
+    },
+    async fetchJson(url, params, data) {
+        try {
+            let response = await axiosservice({
+                url,
+                params,
+                data,
+                method: 'post',
+            })
+            return response
+        } catch (err) {
+            throw err
+        }
+    },
+    async postupload(url, data) {
+        try {
+            let response = await axiosservice({
+                url,
+                data,
+                method: 'post',
+                headers: {
+                    'Content-Type': 'multipart/form-data',
+                },
+            })
+            return response.data
+        } catch (err) {
+            throw err
+        }
+    },
+    download(url, requestData) {
+        // 响应类型:arraybuffer, blob
+        axiosservice
+            .post(url, requestData, {
+                responseType: 'blob',
+            })
+            .then((resp) => {
+                let headers = resp.headers
+                let contentType = headers['content-type']
+                if (!resp.data) {
+                    console.error('响应异常:', resp)
+                    return false
+                } else {
+                    //console.log("下载文件:", resp)
+                    const blob = new Blob([resp.data], {
+                        type: contentType,
+                    })
+                    const contentDisposition = resp.headers['content-disposition']
+                    let fileName = 'unknown'
+                    if (contentDisposition) {
+                        fileName = window.decodeURI(resp.headers['content-disposition'].split('=')[1])
+                    }
+                    downFile(blob, fileName)
+                }
+            })
+            .catch(function(error) {})
+    },
+    axios: axiosservice,
+}

+ 89 - 0
src/api/legendLibrary.js

@@ -0,0 +1,89 @@
+import httputils from '@/api/httputils'
+// 图例库-查询
+export function queryLegend({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphElement/query`, postParams)
+}
+// 图例库-新增
+export function createLegend({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphElement/create`, postParams)
+}
+// 图例库-新增
+// export function createLegend({
+//     postParams
+// }) {
+//     return httputils.postJson(`/serve/topology-wanda/graphElement/create`, postParams)
+// }
+//图例库-更新
+export function updateLegend({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphElement/update`, postParams)
+}
+//图例库-作废
+export function deleteLegend({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphElement/deleteByFlag`, postParams)
+}
+//图例库-系统tree查询
+export function getLegendTree({ getParams }) {
+    return httputils.getJson(`/serve/topology-wanda/graphCategory/queryByGroup`, getParams)
+}
+
+//图例库-系统tree相关表格查询
+export function queryRelation({ data, postParams }) {
+    return httputils.fetchJson(`/serve/topology-wanda/graphRelation/query`, data, postParams)
+}
+//图例库-更新关系图
+export function updateRelation({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphRelation/update`, postParams)
+}
+//图例库-系统tree相关表格删除
+export function deleteRelation({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphRelation/delete`, postParams)
+}
+//图例库-上传图片
+export function uploadImg({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/Picture/create`, postParams)
+}
+//图例库-穿梭框的搜索
+export function getTransfer({ getParams }) {
+    return httputils.getJson(`/serve/topology-wanda/graphElement/search`, getParams)
+}
+//图例库typeId
+export function queryTypeId({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphElement/type/query`, postParams)
+}
+// 搜索图铺位可视化类型信息
+export function getVisualization({ getParams }) {
+    return httputils.getJson(`/serve/topology-wanda/graphElement/type/search`, getParams)
+}
+// 图例分层展示
+export function groupByCategory({ getParams }) {
+    // return httputils.getJson(`/serve/topology-wanda/graphRelation/groupByCategory`, getParams)
+    return httputils.getJson(`/serve/topology-wanda/graphElement/groupByInfoSystem`, getParams)
+}
+// 图例搜索
+export function graphElementSearch({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphElement/search`, postParams)
+}
+// 更新图例关系信息
+// export function graphElementUpdate({
+//     postParams
+// }) {
+//     return httputils.postJson(`/serve/topology-wanda/graphRelation/update`, postParams)
+
+// }
+
+// 业下设备分类和位置分类树形结构
+ 
+ 
+ 
+
+export function queryDeviceAndPOsition({
+    postParams
+}) {
+ 
+    return httputils.postJson(`/data/t_system_wzfl/query`, postParams)
+}
+
+//图形查询
+export function queryPics({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graph/query`, postParams)
+}

+ 13 - 0
src/api/login.js

@@ -0,0 +1,13 @@
+// 登录校验接口
+import httputils from '@/api/httputils'
+
+export function login(params) {
+    return httputils.getJson(`/data/auth/check`, params)
+}
+// 查询楼层清单
+export function queryFloor(params) {
+    return httputils.getJson(`/data/plaza/floor`, params)
+}
+export function queryfmapID(params) {
+    return httputils.getJson(`http://mapapp.wanda.cn/sgmap/mapversion`, params)
+}

+ 23 - 0
src/api/other.js

@@ -0,0 +1,23 @@
+import httputils from '@/api/httputils'
+// 综合事项记录
+export function queryGlams({ getParams }) {
+    return httputils.getJson(`/data/sms_zhsxjl/query`, getParams)
+}
+// 第三方检测事项
+export function queryDsfrw({ getParams }) {
+    return httputils.getJson(`/data/sms_dsfrw/query`, getParams)
+}
+//综合事项管理-综合记录事项弹框
+export function queryZhsxjl({ getParams }) {
+    return httputils.getJson(`/data/sms_zhsxjl/queryWindown`, getParams)
+}
+
+// 辅助用房管理-广场辅助用房汇总统计报
+export function querygcfzyfhz({ getParams }) {
+    return httputils.getJson(`/data/sms_gcfzyfhz/query`, getParams)
+}
+
+// 辅助用房管理-广场辅助用房调改变更记录
+export function queryfzyfchange({ getParams }) {
+    return httputils.getJson(`/data/sms_fzyfchange/query`, getParams)
+}

+ 5 - 0
src/api/overview.js

@@ -0,0 +1,5 @@
+import httputils from '@/api/httputils'
+// 查询广场概况
+export function queryFact({ getParams }) {
+    return httputils.getJson(`/data/plaza/fact`, getParams)
+}

+ 63 - 0
src/api/public.js

@@ -0,0 +1,63 @@
+import httputils from "@/api/httputils"
+// 查询图片
+export function queryPic({ getParams }) {
+    return httputils.getJson(`/data/sms_proimgup/query`, getParams)
+}
+
+// 查询下拉框
+export function querySelect({ data, postParams }) {
+    return httputils.fetchJson(`/data/base/queryOptions`, data, postParams)
+}
+
+// 查询Tab数据统计数量
+export function queryTab({ data, postParams }) {
+    return httputils.fetchJson(`/data/base/queryTabStatistics`, data, postParams)
+}
+
+// 查询图例统计信息
+export function queryStatis({ data, postParams }) {
+    return httputils.fetchJson(`/serve/topology-wanda/graphElement/statistic/query`, data, postParams)
+}
+
+// 图例-查询图片
+//  /serve/topology-wanda/Picture/eqruy/{id}
+
+// 更新图例系统信息
+export function updateStatis({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graphElement/statistic/update`, postParams)
+}
+
+// 查询系统图备注-(后期可能不需要)
+export function queryRead({ data, postParams }) {
+    return httputils.fetchJson(`/serve/topology-wanda/graph/read`, data, postParams)
+}
+
+// 修改系统图备注
+export function updateRead({ postParams }) {
+    return httputils.postJson(`/serve/topology-wanda/graph/updateNote`, postParams)
+}
+
+//查询系统图展示所需数据 --平面图业务数据
+export function readGroup(postParams) {
+    return httputils.postJson(`/serve/topology-wanda/graph/read`, postParams)
+}
+// 查询草稿箱数量
+export function queryDraftNum(data) {
+    return httputils.postJson(`/serve/topology-wanda/graph/query`, data)
+}
+// 查询铺位名称
+export function queryBrand({ data, postParams }) {
+    return httputils.fetchJson(`/data/tb_brand_intentiondetail/query`, data, postParams)
+}
+//记录PV/UV
+export function getPvUv(data, postParams) {
+    return httputils.fetchJson(`/data/pvuv/save`, data, postParams)
+}
+// 保存楼层缓存
+export function setFloor(data, postParams) {
+    return httputils.fetchJson(`/data/plaza/floor/set`, data, postParams)
+}
+// 查询图
+export function graphQuery(params){
+    return httputils.postJson(`/serve/topology-wanda/graph/query`, params)
+}

+ 52 - 0
src/api/room.js

@@ -0,0 +1,52 @@
+/*
+ * @Author: your name
+ * @Date: 2020-06-28 13:41:05
+ * @LastEditTime: 2020-07-06 11:43:33
+ * @LastEditors: your name
+ * @Description: In User Settings Edit
+ * @FilePath: \wanda-bm-guide\src\api\room.js
+ */
+
+import httputils from '@/api/httputils'
+
+// 机房-机房布置图
+export function xx({ getParams }) {
+    return httputils.getJson(`/data/sms_zhsxjl/query`, getParams)
+}
+
+// 机房-配电室低压柜及出线明细表
+export function queryDygjcxline({ getParams }) {
+    return httputils.getJson(
+        `/data/sms_dygjcxline
+/query`,
+        getParams
+    )
+}
+
+// 机房-机房内核心设备
+export function queryHxsb({ data, postParams }) {
+    return httputils.fetchJson(`/data/sms_asset/queryStatistics`, data, postParams)
+}
+
+// 机房-机房内核心设备钻取表
+export function queryHxsbDetail({ data, postParams }) {
+    return httputils.fetchJson(`/data/sms_asset/query`, data, postParams)
+}
+
+// 机房-维修记录
+export function queryWxjf({ getParams }) {
+    return httputils.getJson(`/data/sms_wx/query`, getParams)
+}
+
+//机房-维保记录
+// export function queryWb2({ data, postParams }) {
+//     return httputils.fetchJson(`/data/sms_wbzy/query`, data, postParams)
+// }
+//设备设施-日常维保
+export function queryWb({ getParams }) {
+    return httputils.getJson(`/data/sms_wbzy/query`, getParams)
+}
+// 查询位置属于哪个系统
+export function querySystem({ getParams }) {
+    return httputils.getJson(`/data/t_system_wzfl/querySystem`, getParams)
+}

+ 20 - 0
src/api/specificationUpdateRecord.js

@@ -0,0 +1,20 @@
+// 说明说更新记录 接口
+import httputils from "@/api/httputils";
+
+/**
+ * 获取事件类型
+ * @param {*} url 
+ * @param {*} param 
+ */
+export function queryEventypes(url, param) {
+  return httputils.postJson(url, param);
+}
+
+/**
+ * 获取表数据
+ * @param {*} url 
+ * @param {*} param 
+ */
+export function getSpecificaltionData(url, param) {
+  return httputils.getJson(url, param);
+}

BIN
src/assets/logo.png


+ 0 - 62
src/components/HelloWorld.vue

@@ -1,62 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
-  </div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-  name: 'HelloWorld',
-  props: {
-    msg: String,
-  },
-});
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped lang="less">
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

+ 230 - 0
src/directives/dom.js

@@ -0,0 +1,230 @@
+/* istanbul ignore next */
+
+import Vue from 'vue'
+
+const isServer = Vue.prototype.$isServer
+const SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g
+const MOZ_HACK_REGEXP = /^moz([A-Z])/
+const ieVersion = isServer ? 0 : Number(document.documentMode)
+
+/* istanbul ignore next */
+const trim = function(string) {
+    return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '')
+}
+/* istanbul ignore next */
+const camelCase = function(name) {
+    return name
+        .replace(SPECIAL_CHARS_REGEXP, function(_, separator, letter, offset) {
+            return offset ? letter.toUpperCase() : letter
+        })
+        .replace(MOZ_HACK_REGEXP, 'Moz$1')
+}
+
+/* istanbul ignore next */
+export const on = (function() {
+    if (!isServer && document.addEventListener) {
+        return function(element, event, handler) {
+            if (element && event && handler) {
+                element.addEventListener(event, handler, false)
+            }
+        }
+    } else {
+        return function(element, event, handler) {
+            if (element && event && handler) {
+                element.attachEvent('on' + event, handler)
+            }
+        }
+    }
+})()
+
+/* istanbul ignore next */
+export const off = (function() {
+    if (!isServer && document.removeEventListener) {
+        return function(element, event, handler) {
+            if (element && event) {
+                element.removeEventListener(event, handler, false)
+            }
+        }
+    } else {
+        return function(element, event, handler) {
+            if (element && event) {
+                element.detachEvent('on' + event, handler)
+            }
+        }
+    }
+})()
+
+/* istanbul ignore next */
+export const once = function(el, event, fn) {
+    var listener = function() {
+        if (fn) {
+            fn.apply(this, arguments)
+        }
+        off(el, event, listener)
+    }
+    on(el, event, listener)
+}
+
+/* istanbul ignore next */
+export function hasClass(el, cls) {
+    if (!el || !cls) return false
+    if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.')
+    if (el.classList) {
+        return el.classList.contains(cls)
+    } else {
+        return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1
+    }
+}
+
+/* istanbul ignore next */
+export function addClass(el, cls) {
+    if (!el) return
+    var curClass = el.className
+    var classes = (cls || '').split(' ')
+
+    for (var i = 0, j = classes.length; i < j; i++) {
+        var clsName = classes[i]
+        if (!clsName) continue
+
+        if (el.classList) {
+            el.classList.add(clsName)
+        } else if (!hasClass(el, clsName)) {
+            curClass += ' ' + clsName
+        }
+    }
+    if (!el.classList) {
+        el.className = curClass
+    }
+}
+
+/* istanbul ignore next */
+export function removeClass(el, cls) {
+    if (!el || !cls) return
+    var classes = cls.split(' ')
+    var curClass = ' ' + el.className + ' '
+
+    for (var i = 0, j = classes.length; i < j; i++) {
+        var clsName = classes[i]
+        if (!clsName) continue
+
+        if (el.classList) {
+            el.classList.remove(clsName)
+        } else if (hasClass(el, clsName)) {
+            curClass = curClass.replace(' ' + clsName + ' ', ' ')
+        }
+    }
+    if (!el.classList) {
+        el.className = trim(curClass)
+    }
+}
+
+/* istanbul ignore next */
+export const getStyle =
+    ieVersion < 9
+        ? function(element, styleName) {
+              if (isServer) return
+              if (!element || !styleName) return null
+              styleName = camelCase(styleName)
+              if (styleName === 'float') {
+                  styleName = 'styleFloat'
+              }
+              try {
+                  switch (styleName) {
+                      case 'opacity':
+                          try {
+                              return element.filters.item('alpha').opacity / 100
+                          } catch (e) {
+                              return 1.0
+                          }
+                      default:
+                          return element.style[styleName] || element.currentStyle ? element.currentStyle[styleName] : null
+                  }
+              } catch (e) {
+                  return element.style[styleName]
+              }
+          }
+        : function(element, styleName) {
+              if (isServer) return
+              if (!element || !styleName) return null
+              styleName = camelCase(styleName)
+              if (styleName === 'float') {
+                  styleName = 'cssFloat'
+              }
+              try {
+                  var computed = document.defaultView.getComputedStyle(element, '')
+                  return element.style[styleName] || computed ? computed[styleName] : null
+              } catch (e) {
+                  return element.style[styleName]
+              }
+          }
+
+/* istanbul ignore next */
+export function setStyle(element, styleName, value) {
+    if (!element || !styleName) return
+
+    if (typeof styleName === 'object') {
+        for (var prop in styleName) {
+            if (styleName.hasOwnProperty(prop)) {
+                setStyle(element, prop, styleName[prop])
+            }
+        }
+    } else {
+        styleName = camelCase(styleName)
+        if (styleName === 'opacity' && ieVersion < 9) {
+            element.style.filter = isNaN(value) ? '' : 'alpha(opacity=' + value * 100 + ')'
+        } else {
+            element.style[styleName] = value
+        }
+    }
+}
+
+export const isScroll = (el, vertical) => {
+    if (isServer) return
+
+    const determinedDirection = vertical !== null || vertical !== undefined
+    const overflow = determinedDirection ? (vertical ? getStyle(el, 'overflow-y') : getStyle(el, 'overflow-x')) : getStyle(el, 'overflow')
+
+    return overflow.match(/(scroll|auto)/)
+}
+
+export const getScrollContainer = (el, vertical) => {
+    if (isServer) return
+
+    let parent = el
+    while (parent) {
+        if ([window, document, document.documentElement].includes(parent)) {
+            return window
+        }
+        if (isScroll(parent, vertical)) {
+            return parent
+        }
+        parent = parent.parentNode
+    }
+
+    return parent
+}
+
+export const isInContainer = (el, container) => {
+    if (isServer || !el || !container) return false
+
+    const elRect = el.getBoundingClientRect()
+    let containerRect
+
+    if ([window, document, document.documentElement, null, undefined].includes(container)) {
+        containerRect = {
+            top: 0,
+            right: window.innerWidth,
+            bottom: window.innerHeight,
+            left: 0,
+        }
+    } else {
+        containerRect = container.getBoundingClientRect()
+    }
+
+    return (
+        elRect.top < containerRect.bottom &&
+        elRect.bottom > containerRect.top &&
+        elRect.right > containerRect.left &&
+        elRect.left < containerRect.right
+    )
+}

+ 24 - 0
src/directives/repeat-click.js

@@ -0,0 +1,24 @@
+import { once, on } from './dom'
+
+export default {
+    bind(el, binding, vnode) {
+        let interval = null
+        let startTime
+        const handler = () => vnode.context[binding.expression].apply()
+        const clear = () => {
+            if (Date.now() - startTime < 100) {
+                handler()
+            }
+            clearInterval(interval)
+            interval = null
+        }
+
+        on(el, 'mousedown', (e) => {
+            if (e.button !== 0) return
+            startTime = Date.now()
+            once(document, 'mouseup', clear)
+            clearInterval(interval)
+            interval = setInterval(handler, 100)
+        })
+    },
+}

+ 30 - 0
src/lib/FloorScene.js

@@ -0,0 +1,30 @@
+import { SMouseEvent } from "@saga-web/base";
+import {
+  SGraphScene
+} from "@saga-web/graph/lib"
+import {
+  ItemColor
+} from "@saga-web/big";
+import {
+  SColor
+} from '@saga-web/draw/lib';
+export class FloorScene extends SGraphScene {
+  constructor() {
+    super()
+    ItemColor.spaceColor = new SColor("#f0f0f0")
+    ItemColor.wallColor = new SColor("#d4d4d4")
+    ItemColor.columnColor = new SColor("#d4d4d4")
+    ItemColor.virtualWallColor = new SColor("#d4d4d4")
+    ItemColor.selectColor = new SColor("#f0f0f0")
+    ItemColor.spaceBorderColor = new SColor("#d4d4d4")
+  }
+
+  onDoubleClick() {
+    return true
+  } // Function onDoubleClick()
+
+  onKeyDown() {
+    return true
+  }
+
+}

+ 63 - 0
src/lib/FloorView.js

@@ -0,0 +1,63 @@
+import { SGraphView } from "@saga-web/graph/lib";
+import { SMouseButton, SMouseEvent, SNetUtil } from "@saga-web/base/lib";
+import { SPoint } from "@saga-web/draw/lib";
+export class FloorView extends SGraphView {
+    constructor() {
+        super(...arguments);
+        this._leftKeyPos = new SPoint();
+        this.spaceKey = false;
+    }
+    saveFloorJson(name) {
+        if (!this.scene || !this.scene.json)
+            return;
+        let url = URL.createObjectURL(new Blob([this.scene.json]));
+        SNetUtil.downLoad(name, url);
+    }
+    onKeyDown(event) {
+        let keyCode = event.keyCode;
+        this.spaceKey = false;
+        switch (keyCode) {
+            case 32:
+                this.spaceKey = true;
+                break;
+            case 87:
+                this.origin.y -= 10;
+                break;
+            case 83:
+                this.origin.y += 10;
+                break;
+            case 68:
+                this.origin.x += 10;
+                break;
+            case 65:
+                this.origin.x -= 10;
+                break;
+            default:
+                super.onKeyDown(event);
+                break;
+        }
+    }
+    onKeyUp(event) {
+        this.spaceKey = false;
+        super.onKeyUp(event);
+    }
+    onMouseDown(event) {
+        let se = new SMouseEvent(event);
+        if (se.buttons & SMouseButton.LeftButton) {
+            this._leftKeyPos.x = se.x;
+            this._leftKeyPos.y = se.y;
+        }
+        super.onMouseDown(event);
+    }
+    onMouseMove(event) {
+        let se = new SMouseEvent(event);
+        if (se.buttons & SMouseButton.LeftButton) {
+            this.origin.x += se.x - this._leftKeyPos.x;
+            this.origin.y += se.y - this._leftKeyPos.y;
+            this._leftKeyPos.x = se.x;
+            this._leftKeyPos.y = se.y;
+            this.update();
+        }
+        super.onMouseMove(event);
+    }
+}

+ 91 - 0
src/lib/GraphView.js

@@ -0,0 +1,91 @@
+import { SCanvasView, SColor } from "@saga-web/draw/lib";
+export class GraphView extends SCanvasView {
+    constructor(id) {
+        super(id);
+        // 0 :line 1:area 2:img
+        this._type = 0;
+        // 线条颜色
+        this._strokecolor = "";
+        // 背景颜色
+        this._bgcolor = "";
+        //线条类型
+        this._lineType = "";
+        //线条粗细
+        this._lineWidth = 1;
+        /** 图片地址 */
+        this._url = "";
+    }
+    get type() {
+        return this._type;
+    }
+    set type(v) {
+        this._type = v;
+        this.update();
+    }
+    get strokecolor() {
+        return this._strokecolor;
+    }
+    set strokecolor(v) {
+        this._strokecolor = v;
+        this.update();
+    }
+    get bgcolor() {
+        return this._bgcolor;
+    }
+    set bgcolor(v) {
+        this._bgcolor = v;
+        this.update();
+    }
+    get lineType() {
+        return this._lineType;
+    }
+    set lineType(v) {
+        this._lineType = v;
+        this.update();
+    }
+    get lineWidth() {
+        return this._lineWidth;
+    }
+    set lineWidth(v) {
+        this._lineWidth = v;
+        this.update();
+    }
+    get url() {
+        return this._url;
+    }
+    set url(v) {
+        this._url = v;
+        this.img = new Image();
+        this.img.src = v;
+        this.img.onload = () => {
+            this.update();
+        };
+        this.img.onerror = (e) => {
+            this.update();
+        };
+    }
+    onDraw(canvas) {
+        canvas.clearRect(0, 0, this.width, this.height);
+        canvas.pen.lineWidth = this.lineWidth;
+        if (this.lineType == 'dashed') {
+            canvas.pen.lineDash = [10, 2];
+        }
+        if (this.lineType == 'dotted') {
+            canvas.pen.lineDash = [this.lineWidth, this.lineWidth];
+        }
+        canvas.pen.color = new SColor(this.strokecolor);
+        canvas.brush.color = new SColor(this.bgcolor);
+        if (this.type == 0) {
+            canvas.drawLine(0, 14, 28, 14);
+        }
+        else if (this.type == 1) {
+            canvas.drawRect(0, 0, 28, 28);
+        }
+        else if (this.type == 2) {
+            if (this.img) {
+                console.log(this.img);
+                canvas.drawImage(this.img, 0, 0, 28, 28);
+            }
+        }
+    }
+}

+ 100 - 0
src/lib/GraphView.ts

@@ -0,0 +1,100 @@
+// @ts-nocheck
+import { SCanvasView, SColor, SPainter } from "@saga-web/draw/lib"
+
+export class GraphView extends SCanvasView {
+    // 0 :line 1:area 2:img
+    _type: number = 0;
+    get type(): number {
+        return this._type
+    }
+    set type(v: number) {
+        this._type = v;
+        this.update()
+    }
+
+    // 线条颜色
+    private _strokecolor: string = "";
+    get strokecolor(): string {
+        return this._strokecolor
+    }
+    set strokecolor(v: string) {
+        this._strokecolor = v;
+        this.update()
+    }
+
+    // 背景颜色
+    private _bgcolor: string = "";
+    get bgcolor(): string {
+        return this._bgcolor
+    }
+    set bgcolor(v: string) {
+        this._bgcolor = v;
+        this.update()
+    }
+    //线条类型
+    private _lineType: string = "";
+    get lineType(): string {
+        return this._lineType
+    }
+    set lineType(v: string) {
+        this._lineType = v;
+        this.update()
+    }
+
+    //线条粗细
+    private _lineWidth: number = 1;
+    get lineWidth(): number {
+        return this._lineWidth
+    }
+    set lineWidth(v: number) {
+        this._lineWidth = v;
+        this.update()
+    }
+
+    /** 图片dom */
+    img: CanvasImageSource | undefined;
+
+    /** 图片地址 */
+    private _url: string = "";
+    get url(): string {
+        return this._url;
+    }
+    set url(v: string) {
+        this._url = v;
+        this.img = new Image();
+        this.img.src = v;
+        this.img.onload = (): void => {
+            this.update();
+        };
+        this.img.onerror = (e): void => {
+            this.update();
+        };
+    }
+
+    constructor(id: string) {
+        super(id)
+    }
+
+    onDraw(canvas: SPainter): void {
+        canvas.clearRect(0, 0, this.width, this.height)
+        canvas.pen.lineWidth = this.lineWidth;
+        if (this.lineType == 'dashed') {
+            canvas.pen.lineDash = [10, 2]
+        }
+        if (this.lineType == 'dotted') {
+            canvas.pen.lineDash = [this.lineWidth, this.lineWidth]
+        }
+        canvas.pen.color = new SColor(this.strokecolor);
+        canvas.brush.color = new SColor(this.bgcolor);
+        if (this.type == 0) {
+            canvas.drawLine(0, 14, 28, 14);
+        } else if (this.type == 1) {
+            canvas.drawRect(0, 0, 28, 28);
+        } else if (this.type == 2) {
+            if (this.img) {
+                console.log(this.img)
+                canvas.drawImage(this.img, 0, 0, 28, 28)
+            }
+        }
+    }
+}

+ 16 - 0
src/lib/enums/SGraphElementType.js

@@ -0,0 +1,16 @@
+/**
+ * 图标,区域类型
+ *
+ * @author  张宇
+ */
+export var SGraphElementType;
+(function (SGraphElementType) {
+    /** 非图例    */
+    SGraphElementType[SGraphElementType["None"] = 0] = "None";
+    /** 线类型    */
+    SGraphElementType[SGraphElementType["Line"] = 1] = "Line";
+    /** 区域类型    */
+    SGraphElementType[SGraphElementType["Zone"] = 2] = "Zone";
+    /** 图类型    */
+    SGraphElementType[SGraphElementType["Image"] = 3] = "Image";
+})(SGraphElementType || (SGraphElementType = {})); // Enum SGraphElementType

+ 15 - 0
src/lib/enums/SGraphElementType.ts

@@ -0,0 +1,15 @@
+/**
+ * 图标,区域类型
+ *
+ * @author  张宇
+ */
+export enum SGraphElementType {
+    /** 非图例    */
+    None,
+    /** 线类型    */
+    Line,
+    /** 区域类型    */
+    Zone,
+    /** 图类型    */
+    Image
+} // Enum SGraphElementType

+ 14 - 0
src/lib/enums/SMarkerType.js

@@ -0,0 +1,14 @@
+/**
+ * 标识对象类型
+ *
+ * @author  张宇
+ */
+export var SMarkerType;
+(function (SMarkerType) {
+    /** 图标    */
+    SMarkerType[SMarkerType["Image"] = 0] = "Image";
+    /** 线类型    */
+    SMarkerType[SMarkerType["Line"] = 1] = "Line";
+    /** 文本类型    */
+    SMarkerType[SMarkerType["Text"] = 2] = "Text";
+})(SMarkerType || (SMarkerType = {})); // Enum SMarkerType

+ 13 - 0
src/lib/enums/SMarkerType.ts

@@ -0,0 +1,13 @@
+/**
+ * 标识对象类型
+ *
+ * @author  张宇
+ */
+export enum SMarkerType {
+    /** 图标    */
+    Image,
+    /** 线类型    */
+    Line,
+    /** 文本类型    */
+    Text
+} // Enum SMarkerType

+ 93 - 0
src/lib/items/HighlightItem.ts

@@ -0,0 +1,93 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */
+// @ts-nocheck
+import { SGraphItem } from "@saga-web/graph/lib";
+import { SColor, SLine, SPainter, SPoint, SRect } from "@saga-web/draw/lib";
+import { ItemOrder, ItemColor } from '@saga-web/big/lib';
+
+/**
+ * 吸附时高亮对象
+ *
+ * @author  郝建龙
+ */
+export class HighlightItem extends SGraphItem {
+    /** 对象与鼠标位置距离   */
+    distance: number = 0;
+    /** 对象类型   */
+    private type: number = 1;
+
+    /** 点对象数据-当吸附的为线时,此点为垂线与线段的交点   */
+    _point: SPoint = new SPoint();
+    get point(): SPoint {
+        return this._point;
+    } // Get point
+    set point(v: SPoint) {
+        this._point = v;
+        this.type = 1;
+        this.update();
+    } // Set point
+
+    /** 点对象数据   */
+    _line: SLine = new SLine();
+    get line(): SLine {
+        return this._line;
+    } // Get line
+    set line(v: SLine) {
+        this._line = v;
+        this.type = 2;
+        this.update();
+    } // Set line
+
+    /**
+     * 构造函数
+     *
+     * @param   parent  指向父对象
+     */
+    constructor(parent: SGraphItem | null) {
+        super(parent);
+        this.visible = false;
+        this.zOrder = ItemOrder.highLightOrder;
+    } // Constructor
+
+    /**
+     * Item对象边界区域
+     *
+     * @return	SRect
+     */
+    boundingRect(): SRect {
+        return new SRect(this.point.x, this.point.y, 10, 10);
+    } // Function boundingRect()
+
+    /**
+     * Item绘制操作
+     *
+     * @param   painter painter对象
+     */
+    onDraw(painter: SPainter): void {
+        if (this.type == 2) {
+            painter.pen.color = ItemColor.highLightLineColor;
+            painter.pen.lineWidth = painter.toPx(6);
+            painter.drawLine(this.line);
+        }
+        painter.pen.color = SColor.Transparent;
+        painter.brush.color = ItemColor.highLightPointColor;
+        painter.drawCircle(this.point.x, this.point.y, painter.toPx(5));
+    } // Function onDraw()
+} // Class HighlightItem

+ 275 - 0
src/lib/items/SCustomLegendItem.ts

@@ -0,0 +1,275 @@
+
+// @ts-nocheck
+import { SGraphItem, SLineStyle, STextOrigin } from "@saga-web/graph/lib";
+import { Legend } from '../types/Legend';
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from "@saga-web/draw";
+import { STextItem } from '@saga-web/graph/lib';
+import { hexify, uuid } from "@/components/mapClass/until"
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { SMouseEvent } from "@saga-web/base/lib";
+/**
+ * 图例节点Item(区域类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SCustomLegendItem extends SPolygonItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /** text item   */
+    textItem: STextItem = new STextItem(this);
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.textItem.text = v;
+        this.update();
+    }
+    get color(): SColor {
+        return this.textItem.color;
+    }
+    set color(v: SColor) {
+        this.textItem.color = v;
+    }
+    get font(): SFont {
+        return this.textItem.font;
+    }
+    set font(v: SFont) {
+        this.textItem.font = v;
+    }
+
+    get status(): SItemStatus {
+        return this._status;
+    }
+    // 编辑当前状态
+    set status(value: SItemStatus) {
+        this._status = value;
+        // 如果状态为show则需清栈
+        if (value == SItemStatus.Normal) {
+            // 切换显示状态显示文本
+            this.showText = true;
+            // 切换显示状态不可移动文本
+            this.textItem.moveable = false;
+
+            if (this.undoStack) {
+                this.undoStack.clear();
+            }
+        } else if (value == SItemStatus.Edit) {
+            // 切换编辑状态显示文本
+            this.showText = true;
+            // 切换编辑状态可移动文本
+            this.textItem.moveable = true;
+        } else if (value == SItemStatus.Create) {
+            // 切换创建状态不显示文本
+            this.showText = false;
+            // 切换创建状态不可移动文本
+            this.textItem.moveable = false;
+        }
+        this.update();
+    };
+
+    /** 是否激活  */
+    _isActive: boolean = false;
+    get isActive(): boolean {
+        return this._isActive;
+    } // Get isActive
+    set isActive(v: boolean) {
+        this._isActive = v;
+        if (v) {
+            this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
+        } else {
+            this.cursor = "auto";
+            this.textItem.cursor = "auto";
+        }
+        this.update();
+    } // Set isActive
+
+    /** 是否显示文字  */
+    _showText: boolean = true;
+    get showText(): boolean {
+        return this._showText;
+    }
+    set showText(v: boolean) {
+        if (v === this._showText) {
+            return
+        }
+        this._showText = v;
+        if (v) {
+            this.textItem.show();
+        } else {
+            this.textItem.hide();
+        }
+    }
+
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.textItem.originPosition = STextOrigin.Centrum;
+        this.textItem.isTransform = false;
+        this.zOrder = ItemOrder.polygonOrder;
+        this.data = data;
+        if (!data.ID) {
+            data.ID = uuid()
+        }
+        this.id = data.ID;
+        this.name = data.Name;
+        this.text = data.Name;
+        if (data) {
+            this.setPointList = [];
+            let setPointList: SPoint[];
+            if (data.OutLine) {
+                if (data.OutLine[0] instanceof SPoint) {
+                    // @ts-ignore
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
+            }
+            if (data.Properties.Zorder) {
+                this.zOrder = data.Properties.Zorder;
+            }
+            // 设置线宽
+            if (data.Properties.LineWidth) {
+                this.lineWidth = data.Properties.LineWidth;
+            }
+            if (data.Properties.StrokeColor) {
+                this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
+            }
+            if (data.Properties.FillColor) {
+                this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor))
+            }
+            if (data.Properties.TextPos) {
+                this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+            }
+            if (data.Properties.color) {
+                this.color = new SColor(data.Properties.color);
+            }
+            if (data.Properties.font) {
+                this.font = new SFont("sans-serif", data.Properties.font);
+            }
+            if (data.Properties && data.Properties.IsActive) {
+                this.isActive = data.Properties.IsActive;
+            }
+            if (data.AttachObjectIds && data.AttachObjectIds.length) {
+                this.isActive = true;
+            }
+            switch (data.Properties.LineDash) {
+                case "solid":
+                    this.lineStyle = SLineStyle.Solid;
+                    break;
+                case "dotted":
+                    this.lineStyle = SLineStyle.Dotted;
+                    break;
+                case "dashed":
+                    this.lineStyle = SLineStyle.Dashed;
+                    break;
+                default:
+                    this.lineStyle = SLineStyle.Solid;
+            }
+        }
+        // 监听多边形创建完成事件,并动态计算文本位置
+        this.connect("finishCreated", this, () => {
+            // 计算文本位置
+            let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                return pre + (cur.x / arr.length)
+            }, 0),
+                y: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                    return pre + (cur.y / arr.length)
+                }, 0);
+            this.textItem.moveTo(x, y);
+        })
+    }
+
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        super.onMouseDown(event);
+        return true;
+    } // Function onMouseDown()
+
+    toData(): any {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Name = this.name;
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.FillColor = this.fillColor.value;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineWidth = this.lineWidth;
+        switch (this.lineStyle) {
+            case SLineStyle.Solid:
+                this.data.Properties.LineDash = "solid";
+                break;
+            case SLineStyle.Dotted:
+                this.data.Properties.LineDash = "dotted";
+                break;
+            case SLineStyle.Dashed:
+                this.data.Properties.LineDash = "dashed";
+                break;
+            default:
+                this.data.Properties.LineDash = "solid";
+        }
+        this.data.OutLine = this.getPointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
+        this.data.Properties.font =  this.font.size;
+        this.data.Properties.color =  this.color.value;
+        this.data.Properties.IsActive = this.isActive;
+        return this.data;
+    }
+
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = color.alpha / 5
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = brushcolor.alpha / 5
+            painter.pen.color = color
+            painter.pen.lineCapStyle = SLineCapStyle.Square
+            painter.pen.lineWidth = painter.toPx(this.lineWidth)
+            painter.brush.color = brushcolor
+            if (this.selected) {
+                painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
+                painter.shadow.shadowBlur = 10;
+                painter.shadow.shadowColor = new SColor(`#00000033`);
+                painter.shadow.shadowOffsetX = 5;
+                painter.shadow.shadowOffsetY = 5;
+            }
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
+} // Class SZoneLegendItem

+ 270 - 0
src/lib/items/SFHFQZoneLegendItem.ts

@@ -0,0 +1,270 @@
+// @ts-nocheck
+import { SGraphItem, SLineStyle, STextOrigin } from '@saga-web/graph/lib';
+import { Legend } from '../types/Legend';
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from '@saga-web/draw';
+import { STextItem } from '@saga-web/graph/lib';
+import { hexify } from '@/components/mapClass/until';
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { SMouseEvent } from '@saga-web/base/lib';
+/**
+ * 图例节点Item(区域类型 --防火分区)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SFHFQZoneLegendItem extends SPolygonItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /** text item   */
+    textItem: STextItem = new STextItem(this);
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.textItem.text = v;
+        this.update();
+    }
+    get color(): SColor {
+        return this.textItem.color;
+    }
+    set color(v: SColor) {
+        this.textItem.color = v;
+    }
+    get font(): SFont {
+        return this.textItem.font
+    }
+    set font(v: SFont) {
+        this.textItem.font = v
+    }
+
+    get status(): SItemStatus {
+        return this._status;
+    }
+    // 编辑当前状态
+    set status(value: SItemStatus) {
+        this._status = value;
+        // 如果状态为show则需清栈
+        if (value == SItemStatus.Normal) {
+            // 切换显示状态显示文本
+            this.showText = true;
+            // 切换显示状态不可移动文本
+            this.textItem.moveable = false;
+
+            if (this.undoStack) {
+                this.undoStack.clear();
+            }
+        } else if (value == SItemStatus.Edit) {
+            // 切换编辑状态显示文本
+            this.showText = true;
+            // 切换编辑状态可移动文本
+            this.textItem.moveable = true;
+        } else if (value == SItemStatus.Create) {
+            // 切换创建状态不显示文本
+            this.showText = false;
+            // 切换创建状态不可移动文本
+            this.textItem.moveable = false;
+        }
+        this.update();
+    };
+
+    /** 是否激活  */
+    _isActive: boolean = false;
+    get isActive(): boolean {
+        return this._isActive;
+    } // Get isActive
+    set isActive(v: boolean) {
+        this._isActive = v;
+        if (v) {
+            this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
+        } else {
+            this.cursor = "auto";
+            this.textItem.cursor = "auto";
+        }
+        this.update();
+    } // Set isActive
+
+    /** 是否显示文字  */
+    _showText: boolean = true;
+    get showText(): boolean {
+        return this._showText;
+    }
+    set showText(v: boolean) {
+        if (v === this._showText) {
+            return
+        }
+        this._showText = v;
+        if (v) {
+            this.textItem.show();
+        } else {
+            this.textItem.hide();
+        }
+    }
+
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.textItem.originPosition = STextOrigin.Centrum;
+        this.textItem.isTransform = false;
+        this.zOrder = ItemOrder.polygonOrder - 0.00005;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.text = data.Name;
+        if (data) {
+            this.setPointList = [];
+            let setPointList: SPoint[];
+            if (data.OutLine) {
+                if (data.OutLine[0] instanceof SPoint) {
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
+            }
+            if (data.Properties.Zorder) {
+                this.zOrder = data.Properties.Zorder;
+            }
+            // 设置线宽
+            if (data.Properties.LineWidth) {
+                this.lineWidth = data.Properties.LineWidth;
+            }
+            if (data.Properties.StrokeColor) {
+                this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
+            }
+            if (data.Properties.FillColor) {
+                this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor));
+            }
+            if (data.Properties.TextPos) {
+                this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+            }
+            if (data.Properties.color) {
+                this.color = new SColor(data.Properties.color);
+            }
+            if (data.Properties.font) {
+                this.font = new SFont("sans-serif", data.Properties.font);
+            }
+            if (data.Properties && data.Properties.IsActive) {
+                this.isActive = data.Properties.IsActive;
+            }
+            if (data.AttachObjectIds && data.AttachObjectIds.length) {
+                this.isActive = true;
+            }
+            switch (data.Properties.LineDash) {
+                case "solid":
+                    this.lineStyle = SLineStyle.Solid;
+                    break;
+                case "dotted":
+                    this.lineStyle = SLineStyle.Dotted;
+                    break;
+                case "dashed":
+                    this.lineStyle = SLineStyle.Dashed;
+                    break;
+                default:
+                    this.lineStyle = SLineStyle.Solid;
+            }
+        }
+        // 监听多边形创建完成事件,并动态计算文本位置
+        this.connect("finishCreated", this, () => {
+            // 计算文本位置
+            let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                return pre + (cur.x / arr.length)
+            }, 0),
+                y: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                    return pre + (cur.y / arr.length)
+                }, 0);
+            this.textItem.moveTo(x, y);
+        })
+    }
+
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        super.onMouseDown(event);
+        return true;
+    } // Function onMouseDown()
+
+    toData(): any {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Name = this.name;
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.FillColor = this.fillColor.value;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineWidth = this.lineWidth;
+        switch (this.lineStyle) {
+            case SLineStyle.Solid:
+                this.data.Properties.LineDash = "solid";
+                break;
+            case SLineStyle.Dotted:
+                this.data.Properties.LineDash = "dotted";
+                break;
+            case SLineStyle.Dashed:
+                this.data.Properties.LineDash = "dashed";
+                break;
+            default:
+                this.data.Properties.LineDash = "solid";
+        }
+        this.data.OutLine = this.getPointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
+        this.data.Properties.font =  this.font.size;
+        this.data.Properties.color =  this.color.value;
+        this.data.Properties.IsActive = this.isActive;
+        return this.data;
+    }
+
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = color.alpha / 5
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = brushcolor.alpha / 5
+            painter.pen.color = color
+            painter.pen.lineCapStyle = SLineCapStyle.Square
+            painter.pen.lineWidth = painter.toPx(this.lineWidth)
+            painter.brush.color = brushcolor
+            if (this.selected) {
+                painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
+                painter.shadow.shadowBlur = 10;
+                painter.shadow.shadowColor = new SColor(`#00000033`);
+                painter.shadow.shadowOffsetX = 5;
+                painter.shadow.shadowOffsetY = 5;
+            }
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
+} // Class SFHFQZoneLegendItem

+ 187 - 0
src/lib/items/SImageLegendItem.ts

@@ -0,0 +1,187 @@
+// @ts-nocheck
+import { SGraphItem } from "@saga-web/graph/lib";
+import { SIconTextItem } from '@saga-web/big/lib/items/SIconTextItem';
+import { Legend } from '../types/Legend';
+import { ItemOrder, SItemStatus } from '@saga-web/big/lib';
+import { SFont, SColor, SPainter, SRect } from '@saga-web/draw/lib';
+import { SMouseEvent } from "@saga-web/base/lib";
+/**
+ * 图例节点Item(图标类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SImageLegendItem extends SIconTextItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+    /** 图例数量 */
+    _num: number = 1;
+    get num(): number {
+        return this._num;
+    }
+    set num(v: number) {
+        if (v) {
+            this._num = v;
+            this.data.Num = v;
+        } else {
+            this._num = 1;
+            this.data.Num = 1;
+        }
+        this.data.Properties.Num = this._num;
+        this.textItem.text = `${this.name}${this.num > 1 ? `×${this.num}` : ''}`;
+        this.update();
+    }
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.name = v;
+        this.data.Name = v;
+        this.textItem.text = `${this.name}${this.num > 1 ? `×${this.num}` : ''}`;
+        this.update();
+    }
+
+     /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+        return
+        }
+        this._maskFlag = v;
+        if (v) {
+            this.textItem.visible = false;
+        } else {
+            this.textItem.visible = true;
+        }
+        this.update()
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent, data.AnchorList);
+        this.isTransform = false;
+        this.zOrder = ItemOrder.markOrder;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.text = data.Name;
+        this.moveTo(data.Pos.X, data.Pos.Y);
+        if (data.Num) {
+            this.num = data.Num;
+        }
+        if (data.Size) {
+            this.width = data.Size.Width;
+            this.height = data.Size.Height;
+        }
+        if (data.Properties.Zorder) {
+            this.zOrder = data.Properties.Zorder;
+        }
+        if (data.Properties && data.Properties.Url) {
+            this.img.url = data.Properties.Url;
+        }
+        if (data.Properties && data.Properties.Size && data.Properties.Size.Width) {
+            this.sWidth = data.Properties.Size.Width;
+        }
+        if (data.Properties && data.Properties.Size && data.Properties.Size.Height) {
+            this.sHeight = data.Properties.Size.Height;
+        }
+        if (data.Properties.ImgPos) {
+            this.img.moveTo(data.Properties.ImgPos.X, data.Properties.ImgPos.Y);
+        }
+        if (data.Properties && data.Properties.ImgRotate) {
+            this.img.rotate = data.Properties.ImgRotate;
+        }
+        if (data.Properties && data.Properties.font) {
+            this.font = new SFont("sans-serif", data.Properties.font);
+        }
+        if (data.Properties.TextPos) {
+            this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+        } else {
+            // 偏移二分之一文本高度
+            this.textItem.moveTo((this.img.width * 0.5), -(this.font.size * 1.25 * 0.5));
+        }
+        if (data.Properties && data.Properties.color) {
+            this.color = new SColor(data.Properties.color);
+        }
+        if (data.Properties && data.Properties.IsActive) {
+            this.isActive = data.Properties.IsActive;
+        }
+        if (data.AttachObjectIds && data.AttachObjectIds.length) {
+            this.isActive = true;
+        }
+        if (data.Properties && data.Properties.FrameColor) {
+            this.activeColor = new SColor(data.Properties.FrameColor);
+        }
+    }
+
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        return super.onMouseDown(event);
+    } // Function onMouseDown()
+
+    toData(): Legend {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Size = { Width: this.width, Height: this.height };
+        this.data.Name = this.name;
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.Url = this.img.url;
+        this.data.Properties.TextPos = { X: this.textItem.x, Y: this.textItem.y };
+        this.data.Properties.ImgPos = { X: this.img.x, Y: this.img.y };
+        this.data.Properties.ImgRotate = this.img.rotate;
+        this.data.Properties.Size = {
+            Width: this.sWidth,
+            Height: this.sHeight
+        };
+        this.data.Properties.font = this.font.size;
+        this.data.Properties.color = this.color.value;
+        this.data.Properties.Font = this.font.size;
+        this.data.Properties.Coler = this.color.value;
+        this.data.Properties.FrameColor = this.activeColor.value;
+        this.data.Properties.IsActive = this.isActive;
+        this.data.AnchorList = this.anchorList.map(t => {
+            return {
+                ID: t.id,
+                Pos: {
+                    X: t.x,
+                    Y: t.y
+                }
+            }
+        })
+        return this.data;
+    }
+
+    /**
+     * Item绘制框架
+     *
+     * @param   painter       painter对象
+     * @param   rect          绘制区域
+     */
+    onPaint(painter: SPainter, rect: SRect): void {
+        super.onPaint(painter, rect);
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            painter.pen.color = SColor.Transparent;
+            painter.brush.color = new SColor("#ffffffa1");
+            if (this.selected) {
+                painter.drawCircle(this.img.x, this.img.y, (this.sWidth / 2.0) * 1.25);
+            } else {
+                painter.drawCircle(this.img.x, this.img.y, this.sWidth / 2.0);
+            }
+        }
+    } // Function onPaint()
+    
+} // Class SImageLegendItem

Файловите разлики са ограничени, защото са твърде много
+ 70 - 0
src/lib/items/SImageMarkerItem.ts


+ 60 - 0
src/lib/items/SLineLegendItem.ts

@@ -0,0 +1,60 @@
+
+// @ts-nocheck
+import { SGraphItem } from "@saga-web/graph/lib";
+import { SPoint } from "@saga-web/draw/lib";
+import { SPolylineItem } from '@saga-web/big/lib';
+import { Legend } from '../types/Legend';
+
+/**
+ * 图例节点Item(线类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SLineLegendItem extends SPolylineItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent,[]);
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.moveTo(data.Pos.X, data.Pos.Y);
+        if (data.Properties.Zorder) {
+            this.zOrder = data.Properties.Zorder;
+        }
+        if (data.Properties && data.Properties.Line) {
+            let setPointList: SPoint[];
+            setPointList = data.Properties.Line.map(i => {
+                return new SPoint(i.x, i.y)
+            })
+            this.pointList = setPointList;
+        }
+        if (data.Properties && data.Properties.LineWidth) {
+            this.lineWidth = data.Properties.LineWidth;
+        }
+        if (data.Properties && data.Properties.StrokeColor) {
+            this.strokeColor = data.Properties.StrokeColor;
+        }
+    }
+
+    toData(): Legend {
+        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Properties.Line = this.pointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.LineWidth = this.lineWidth;
+        this.data.Properties.StrokeColor = this.strokeColor;
+        return this.data;
+    }
+} // Class SLineLegendItem

+ 143 - 0
src/lib/items/SLineMarkerItem.ts

@@ -0,0 +1,143 @@
+// @ts-nocheck
+import { SGraphItem, SLineStyle } from "@saga-web/graph/lib";
+import { SPoint, SPainter, SColor, SLineCapStyle } from "@saga-web/draw/lib";
+import { ItemOrder, SLineItem, SItemStatus } from '@saga-web/big/lib';
+import { Marker } from '../types/Marker';
+
+/**
+ * 标识对象Item(线类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SLineMarkerItem extends SLineItem {
+    /** 起始锚点  */
+    startItem: SGraphItem | null = null;
+    /** 结束锚点  */
+    endItem: SGraphItem | null = null;
+
+    /** 标识对象数据 */
+    data: Marker;
+
+    /** 是否完成绘制  */
+    get status(): SItemStatus {
+        return this._status;
+    }
+    set status(v: SItemStatus) {
+        this._status = v;
+        if (v == SItemStatus.Edit) {
+            this.zOrder = ItemOrder.markOrder;
+        } else {
+            this.zOrder = ItemOrder.lineOrder;
+        }
+        this.update();
+    }
+
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      标识对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Marker) {
+        super(parent);
+        this.zOrder = ItemOrder.lineOrder;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.moveTo(data.Pos.X, data.Pos.Y);
+        if (data.Properties.Zorder) {
+            this.zOrder = data.Properties.Zorder;
+        }
+        if (data.Properties && data.Properties.Line) {
+            let setPointList: SPoint[];
+            setPointList = data.Properties.Line.map(i => {
+                return new SPoint(i.X, i.Y)
+            })
+            this.line = setPointList;
+        }
+        if (data.Properties && data.Properties.LineWidth) {
+            this.lineWidth = data.Properties.LineWidth;
+        }
+        if (data.Properties && data.Properties.LineStyle) {
+            this.lineStyle = data.Properties.LineStyle;
+        }
+        if (data.Properties && data.Properties.StrokeColor) {
+            this.strokeColor = new SColor(data.Properties.StrokeColor);
+        }
+    } // Constructor
+
+    /** 接收事件作出修改  */
+    changePos() {
+        if (this.startItem) {
+            // 判断删除equip后,不移动
+            if (this.startItem.parent) {
+                let scenePoint: SPoint = this.startItem.boundingRect().center();
+                this.line[0] = this.startItem.mapToScene(scenePoint.x, scenePoint.y);
+            }
+        }
+        if (this.endItem) {
+            // 删除equip后
+            if (this.endItem.parent) {
+                let scenePoint: SPoint = this.endItem.boundingRect().center();
+                this.line[1] = this.endItem.mapToScene(scenePoint.x, scenePoint.y);
+            }
+        }
+    }
+
+    toData(): Marker {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Properties.Line = this.line.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.LineWidth = this.lineWidth;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineStyle = this.lineStyle;
+        if (this.startItem && this.startItem.parent) {
+            this.data.Properties.StartItemId = this.startItem.id;
+        }
+        if (this.endItem && this.endItem.parent) {
+            this.data.Properties.EndItemId = this.endItem.id;
+        }
+        return this.data;
+    }
+
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor);
+            color.alpha = 100;
+            painter.pen.color = new SColor(this.strokeColor);
+            if (this.lineStyle == SLineStyle.Dashed) {
+                painter.pen.lineDash = [
+                    painter.toPx(this.lineWidth * 3),
+                    painter.toPx(this.lineWidth * 7)
+                ];
+            }
+            else if (this.lineStyle == SLineStyle.Dotted) {
+                painter.pen.lineDash = [
+                    painter.toPx(this.lineWidth),
+                    painter.toPx(this.lineWidth)
+                ];
+            }
+            painter.drawLine(this.line[0], this.line[1]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
+} // Class SLineMarkerItem

+ 29 - 0
src/lib/items/SNoneLegendItem.ts

@@ -0,0 +1,29 @@
+// @ts-nocheck
+import { SGraphItem } from "@saga-web/graph/lib";
+import { Legend } from '../types/Legend';
+
+/**
+ * 图例节点Item(非图例类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SNoneLegendItem extends SGraphItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.data = data;
+        this.id = data.ID;
+    }
+
+    toData(): Legend {
+        return this.data;
+    }
+} // Class SNoneLegendItem

+ 278 - 0
src/lib/items/SSCPZZoneLegendItem.ts

@@ -0,0 +1,278 @@
+// @ts-nocheck
+import { SGraphItem, SLineStyle, STextOrigin } from '@saga-web/graph/lib';
+import { Legend } from '../types/Legend';
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from '@saga-web/draw';
+import { STextItem } from '@saga-web/graph/lib';
+import { hexify } from '@/components/mapClass/until';
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { SMouseEvent } from '@saga-web/base/lib';
+/**
+ * 图例节点Item(区域类型 --石材铺装)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SSCPZZoneLegendItem extends SPolygonItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /** text item   */
+    textItem: STextItem = new STextItem(this);
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.textItem.text = v;
+        this.update();
+    }
+    get color(): SColor {
+        return this.textItem.color;
+    }
+    set color(v: SColor) {
+        this.textItem.color = v;
+    }
+    get font(): SFont {
+        return this.textItem.font
+    }
+    set font(v: SFont) {
+        this.textItem.font = v
+    }
+
+    get status(): SItemStatus {
+        return this._status;
+    }
+    // 编辑当前状态
+    set status(value: SItemStatus) {
+        this._status = value;
+        // 如果状态为show则需清栈
+        if (value == SItemStatus.Normal) {
+            // 切换显示状态显示文本
+            this.showText = true;
+            // 切换显示状态不可移动文本
+            this.textItem.moveable = false;
+
+            if (this.undoStack) {
+                this.undoStack.clear();
+            }
+        } else if (value == SItemStatus.Edit) {
+            // 切换编辑状态显示文本
+            this.showText = true;
+            // 切换编辑状态可移动文本
+            this.textItem.moveable = true;
+        } else if (value == SItemStatus.Create) {
+            // 切换创建状态不显示文本
+            this.showText = false;
+            // 切换创建状态不可移动文本
+            this.textItem.moveable = false;
+        }
+        this.update();
+    };
+
+    /** 是否激活  */
+    _isActive: boolean = false;
+    get isActive(): boolean {
+        return this._isActive;
+    } // Get isActive
+    set isActive(v: boolean) {
+        this._isActive = v;
+        if (v) {
+            this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
+        } else {
+            this.cursor = "auto";
+            this.textItem.cursor = "auto";
+        }
+        this.update();
+    } // Set isActive
+
+    /** 是否显示文字  */
+    _showText: boolean = true;
+    get showText(): boolean {
+        return this._showText;
+    }
+    set showText(v: boolean) {
+        if (v === this._showText) {
+            return
+        }
+        this._showText = v;
+        if (v) {
+            this.textItem.show();
+        } else {
+            this.textItem.hide();
+        }
+    }
+
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
+
+    /** 图例说明  */
+    set itemExplain(v: string) {
+        this.data.Properties.ItemExplain = v
+    }
+    get itemExplain(): string {
+        return this.data.Properties.ItemExplain
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.textItem.originPosition = STextOrigin.Centrum;
+        this.textItem.isTransform = false;
+        this.zOrder = ItemOrder.polygonOrder - 0.0005;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        // this.text = data.Name;
+        if (data) {
+            this.setPointList = [];
+            let setPointList: SPoint[];
+            if (data.OutLine) {
+                if (data.OutLine[0] instanceof SPoint) {
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
+            }
+            if (data.Properties.Zorder) {
+                this.zOrder = data.Properties.Zorder;
+            }
+            // 设置线宽
+            if (data.Properties.LineWidth) {
+                this.lineWidth = data.Properties.LineWidth;
+            }
+            if (data.Properties.StrokeColor) {
+                this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
+            }
+            if (data.Properties.FillColor) {
+                this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor))
+            }
+            if (data.Properties.TextPos) {
+                this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+            }
+            if (data.Properties.color) {
+                this.color = new SColor(data.Properties.color);
+            }
+            if (data.Properties.font) {
+                this.font = new SFont("sans-serif", data.Properties.font);
+            }
+            if (data.Properties && data.Properties.IsActive) {
+                this.isActive = data.Properties.IsActive;
+            }
+            if (data.AttachObjectIds && data.AttachObjectIds.length) {
+                this.isActive = true;
+            }
+            switch (data.Properties.LineDash) {
+                case "solid":
+                    this.lineStyle = SLineStyle.Solid;
+                    break;
+                case "dotted":
+                    this.lineStyle = SLineStyle.Dotted;
+                    break;
+                case "dashed":
+                    this.lineStyle = SLineStyle.Dashed;
+                    break;
+                default:
+                    this.lineStyle = SLineStyle.Solid;
+            }
+        }
+        // 监听多边形创建完成事件,并动态计算文本位置
+        this.connect("finishCreated", this, () => {
+            // 计算文本位置
+            let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                return pre + (cur.x / arr.length)
+            }, 0),
+                y: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                    return pre + (cur.y / arr.length)
+                }, 0);
+            this.textItem.moveTo(x, y);
+        })
+    }
+
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        super.onMouseDown(event);
+        return true;
+    } // Function onMouseDown()
+
+    toData(): any {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Name = this.name;
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.FillColor = this.fillColor.value;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineWidth = this.lineWidth;
+        switch (this.lineStyle) {
+            case SLineStyle.Solid:
+                this.data.Properties.LineDash = "solid";
+                break;
+            case SLineStyle.Dotted:
+                this.data.Properties.LineDash = "dotted";
+                break;
+            case SLineStyle.Dashed:
+                this.data.Properties.LineDash = "dashed";
+                break;
+            default:
+                this.data.Properties.LineDash = "solid";
+        }
+        this.data.OutLine = this.getPointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
+        this.data.Properties.font =  this.font.size;
+        this.data.Properties.color =  this.color.value;
+        this.data.Properties.IsActive = this.isActive;
+        return this.data;
+    }
+
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = color.alpha / 5
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = brushcolor.alpha / 5
+            painter.pen.color = color
+            painter.pen.lineCapStyle = SLineCapStyle.Square
+            painter.pen.lineWidth = painter.toPx(this.lineWidth)
+            painter.brush.color = brushcolor
+            if (this.selected) {
+                painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
+                painter.shadow.shadowBlur = 10;
+                painter.shadow.shadowColor = new SColor(`#00000033`);
+                painter.shadow.shadowOffsetX = 5;
+                painter.shadow.shadowOffsetY = 5;
+            }
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
+} // Class SSCPZZoneLegendItem

+ 70 - 0
src/lib/items/STextMarkerItem.ts

@@ -0,0 +1,70 @@
+// @ts-nocheck
+import { SGraphItem, STextItem, SLineStyle } from "@saga-web/graph/lib";
+import { SPainter, SColor,SFont, SPoint } from "@saga-web/draw";
+import { Marker } from '../types/Marker';
+import { ItemOrder } from '@saga-web/big/lib';
+
+/**
+ * 标识对象Item(文本类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class STextMarkerItem extends STextItem {
+    /** 标识对象数据 */
+    data: Marker;
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      标识对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Marker) {
+        super(parent);
+        this.zOrder = ItemOrder.textOrder;
+        this.isTransform = false;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.moveTo(data.Pos.X, data.Pos.Y);
+        if (data.Size) {
+            this.width = data.Size.Width;
+            this.height = data.Size.Height;
+        }
+        if (data.Properties.Zorder) {
+            this.zOrder = data.Properties.Zorder;
+        }
+        if (data.Properties && data.Properties.Text) {
+            this.text = data.Properties.Text;
+        }
+        if (data.Properties && data.Properties.Color) {
+            this.color = new SColor(data.Properties.Color);
+        }
+        if (data.Properties && data.Properties.Font) {
+            this.font = new SFont("sans-serif", data.Properties.Font);;
+        }
+        if (data.Properties && data.Properties.BackgroundColor) {
+            this.backgroundColor = new SColor(data.Properties.BackgroundColor);
+        }
+    } // Constructor
+
+    /**
+     * 根据换行切割文本,绘制多行并计算外轮廓宽高
+     *
+     */
+    protected drawFormatText(): void {
+        super.drawFormatText();
+        this.origin = new SPoint(this.width / 2, this.height / 2);
+    } // Function drawFormatText()
+
+    toData(): Marker {
+        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Size = {Width: this.width, Height: this.height};
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.Text = this.text;
+        this.data.Properties.Color = this.color.value;
+        this.data.Properties.Font = this.font.size;
+        this.data.Properties.BackgroundColor = this.backgroundColor.value;
+        return this.data;
+    }
+} // Class STextMarkerItem

+ 271 - 0
src/lib/items/SZoneLegendItem.ts

@@ -0,0 +1,271 @@
+// @ts-nocheck
+import { SGraphItem, SLineStyle, STextOrigin } from '@saga-web/graph/lib';
+import { Legend } from '../types/Legend';
+import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from '@saga-web/draw';
+import { STextItem } from '@saga-web/graph/lib';
+import { hexify } from '@/components/mapClass/until';
+import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib';
+import { SMouseEvent } from '@saga-web/base/lib';
+/**
+ * 图例节点Item(区域类型)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SZoneLegendItem extends SPolygonItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /** text item   */
+    textItem: STextItem = new STextItem(this);
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.textItem.text = v;
+        this.update();
+    }
+    get color(): SColor {
+        return this.textItem.color;
+    }
+    set color(v: SColor) {
+        this.textItem.color = v;
+    }
+    get font(): SFont {
+        return this.textItem.font;
+    }
+    set font(v: SFont) {
+        this.textItem.font = v;
+    }
+
+    get status(): SItemStatus {
+        return this._status;
+    }
+    // 编辑当前状态
+    set status(value: SItemStatus) {
+        this._status = value;
+        // 如果状态为show则需清栈
+        if (value == SItemStatus.Normal) {
+            // 切换显示状态显示文本
+            this.showText = true;
+            // 切换显示状态不可移动文本
+            this.textItem.moveable = false;
+
+            if (this.undoStack) {
+                this.undoStack.clear();
+            }
+        } else if (value == SItemStatus.Edit) {
+            // 切换编辑状态显示文本
+            this.showText = true;
+            // 切换编辑状态可移动文本
+            this.textItem.moveable = true;
+        } else if (value == SItemStatus.Create) {
+            // 切换创建状态不显示文本
+            this.showText = false;
+            // 切换创建状态不可移动文本
+            this.textItem.moveable = false;
+        }
+        this.update();
+    };
+
+    /** 是否激活  */
+    _isActive: boolean = false;
+    get isActive(): boolean {
+        return this._isActive;
+    } // Get isActive
+    set isActive(v: boolean) {
+        this._isActive = v;
+        if (v) {
+            this.cursor = "pointer";
+            this.textItem.cursor = "pointer";
+        } else {
+            this.cursor = "auto";
+            this.textItem.cursor = "auto";
+        }
+        this.update();
+    } // Set isActive
+
+    /** 是否显示文字  */
+    _showText: boolean = true;
+    get showText(): boolean {
+        return this._showText;
+    }
+    set showText(v: boolean) {
+        if (v === this._showText) {
+            return
+        }
+        this._showText = v;
+        if (v) {
+            this.textItem.show();
+        } else {
+            this.textItem.hide();
+        }
+    }
+
+    /** 是否蒙版遮罩  */
+    _maskFlag: boolean = false;
+    get maskFlag(): boolean {
+        return this._maskFlag;
+    }
+    set maskFlag(v: boolean) {
+        if (v === this._maskFlag) {
+            return
+        }
+        this._maskFlag = v;
+        this.update()
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.textItem.originPosition = STextOrigin.Centrum;
+        this.textItem.isTransform = false;
+        this.zOrder = ItemOrder.polygonOrder;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.text = data.Name;
+        if (data) {
+            this.setPointList = [];
+            let setPointList: SPoint[];
+            if (data.OutLine) {
+                if (data.OutLine[0] instanceof SPoint) {
+                    // @ts-ignore
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
+            }
+            if (data.Properties.Zorder) {
+                this.zOrder = data.Properties.Zorder;
+            }
+            // 设置线宽
+            if (data.Properties.LineWidth) {
+                this.lineWidth = data.Properties.LineWidth;
+            }
+            if (data.Properties.StrokeColor) {
+                this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
+            }
+            if (data.Properties.FillColor) {
+                this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor))
+            }
+            if (data.Properties.TextPos) {
+                this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+            }
+            if (data.Properties.color) {
+                this.color = new SColor(data.Properties.color);
+            }
+            if (data.Properties.font) {
+                this.font = new SFont("sans-serif", data.Properties.font);
+            }
+            if (data.Properties && data.Properties.IsActive) {
+                this.isActive = data.Properties.IsActive;
+            }
+            if (data.AttachObjectIds && data.AttachObjectIds.length) {
+                this.isActive = true;
+            }
+            switch (data.Properties.LineDash) {
+                case "solid":
+                    this.lineStyle = SLineStyle.Solid;
+                    break;
+                case "dotted":
+                    this.lineStyle = SLineStyle.Dotted;
+                    break;
+                case "dashed":
+                    this.lineStyle = SLineStyle.Dashed;
+                    break;
+                default:
+                    this.lineStyle = SLineStyle.Solid;
+            }
+        }
+        // 监听多边形创建完成事件,并动态计算文本位置
+        this.connect("finishCreated", this, () => {
+            // 计算文本位置
+            let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                return pre + (cur.x / arr.length)
+            }, 0),
+                y: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                    return pre + (cur.y / arr.length)
+                }, 0);
+            this.textItem.moveTo(x, y);
+        })
+    }
+
+    /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        if (event.buttons == 1)
+        this.$emit("legendItemClick", event);
+        super.onMouseDown(event);
+        return true;
+    } // Function onMouseDown()
+
+    toData(): any {
+        this.data.Pos = { X: this.x, Y: this.y };
+        this.data.Name = this.name;
+        this.data.Properties.Zorder = this.zOrder;
+        this.data.Properties.FillColor = this.fillColor.value;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineWidth = this.lineWidth;
+        switch (this.lineStyle) {
+            case SLineStyle.Solid:
+                this.data.Properties.LineDash = "solid";
+                break;
+            case SLineStyle.Dotted:
+                this.data.Properties.LineDash = "dotted";
+                break;
+            case SLineStyle.Dashed:
+                this.data.Properties.LineDash = "dashed";
+                break;
+            default:
+                this.data.Properties.LineDash = "solid";
+        }
+        this.data.OutLine = this.getPointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
+        this.data.Properties.font =  this.font.size;
+        this.data.Properties.color =  this.color.value;
+        this.data.Properties.IsActive = this.isActive;
+        return this.data;
+    }
+
+    onDraw(painter: SPainter) {
+        if (this.maskFlag && this.status == SItemStatus.Normal) {
+            let color = new SColor(this.strokeColor)
+            color.alpha = color.alpha / 5
+            let brushcolor = new SColor(this.fillColor)
+            brushcolor.alpha = brushcolor.alpha / 5
+            painter.pen.color = color
+            painter.pen.lineCapStyle = SLineCapStyle.Square
+            painter.pen.lineWidth = painter.toPx(this.lineWidth)
+            painter.brush.color = brushcolor
+            if (this.selected) {
+                painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
+                painter.shadow.shadowBlur = 10;
+                painter.shadow.shadowColor = new SColor(`#00000033`);
+                painter.shadow.shadowOffsetX = 5;
+                painter.shadow.shadowOffsetY = 5;
+            }
+            // @ts-ignore
+            painter.drawPolygon([...this.pointList]);
+        } else {
+            super.onDraw(painter);
+        }
+    }
+} // Class SZoneLegendItem

+ 221 - 0
src/lib/items/TipelineItem.ts

@@ -0,0 +1,221 @@
+// @ts-nocheck
+import { SPolylineItem, ItemOrder, SItemStatus } from '@saga-web/big/lib';
+import { SPainter, SColor, SRect } from '@saga-web/draw';
+import { SAnchorItem, SGraphItem } from '@saga-web/graph/lib';
+import { Relation } from '../types/Relation';
+import { SPoint } from "@saga-web/draw/lib";
+import { Point } from "@saga-web/big/lib/types/Point";
+import { SMouseEvent } from '@saga-web/base/lib';
+
+/**
+ * 管道item
+ *
+ * */
+export class TipelineItem extends SPolylineItem {
+  /** 起始锚点  */
+  startAnchor: SAnchorItem | null = null;
+  /** 结束锚点  */
+  endAnchor: SAnchorItem | null = null;
+  /** 对应的图例ID  */
+  _graphElementId: string = "";
+  get graphElementId(): string {
+    return this._graphElementId;
+  }
+  set graphElementId(v: string) {
+    this._graphElementId = v;
+    if (this.data) {
+      this.data.GraphElementId = this._graphElementId;
+    }
+  }
+  /** 关联节点1ID  */
+  _node1Id: string = "";
+  get node1Id(): string {
+    return this._node1Id;
+  }
+  set node1Id(v: string) {
+    this._node1Id = v;
+    if (this.data) {
+      this.data.Node1ID = this._node1Id;
+    }
+  }
+  /** 关联节点2ID  */
+  _node2Id: string = "";
+  get node2Id(): string {
+    return this._node2Id;
+  }
+  set node2Id(v: string) {
+    this._node2Id = v;
+    if (this.data) {
+      this.data.Node2ID = this._node2Id;
+    }
+  }
+  /** 关联锚点1ID  */
+  _anchor1ID: string = "";
+  get anchor1ID(): string {
+    return this._anchor1ID;
+  }
+  set anchor1ID(v: string) {
+    this._anchor1ID = v;
+    if (this.data) {
+      this.data.Anchor1ID = this._anchor1ID;
+    }
+  }
+  /** 关联锚点2ID  */
+  _anchor2ID: string = "";
+  get anchor2ID(): string {
+    return this._anchor2ID;
+  }
+  set anchor2ID(v: string) {
+    this._anchor2ID = v;
+    if (this.data) {
+      this.data.Anchor2ID = this._anchor2ID;
+    }
+  }
+
+  /** 是否蒙版遮罩  */
+  _maskFlag: boolean = false;
+  get maskFlag(): boolean {
+    return this._maskFlag;
+  }
+  set maskFlag(v: boolean) {
+    if (v === this._maskFlag) {
+      return
+    }
+    this._maskFlag = v;
+    this.update()
+  }
+
+  /** 数据存储  */
+  data: Relation | null = null;
+  /** 接收事件作出修改  */
+  changePos() {
+    if (this.startAnchor) {
+      // 判断删除equip后,不移动
+      if (this.startAnchor.parent && this.startAnchor.parent.parent) {
+        this.pointList[0] = this.startAnchor.mapToScene(0, 0);
+      }
+    }
+    if (this.endAnchor) {
+      // 删除equip后
+      if (this.endAnchor.parent && this.endAnchor.parent.parent) {
+        this.pointList[
+          this.pointList.length - 1
+        ] = this.endAnchor.mapToScene(0, 0);
+      }
+    }
+  }
+
+  constructor(parent: SGraphItem | null, data: Relation) {
+    super(parent, []);
+    this.zOrder = ItemOrder.polylineOrder;
+    this.pointList = data.PointList.map(item => {
+      return new SPoint(item.X, item.Y);
+    });
+    this.data = data;
+    this.name = data.Name;
+    this.id = data.ID;
+    if (data.GraphElementId) {
+      this._graphElementId = data.GraphElementId
+    }
+    if (data.Node1ID) {
+      this._node1Id = data.Node1ID
+    }
+    if (data.Node2ID) {
+      this._node2Id = data.Node2ID
+    }
+    if (data.Anchor1ID) {
+      this._anchor1ID = data.Anchor1ID
+    }
+    if (data.Anchor2ID) {
+      this._anchor2ID = data.Anchor2ID
+    }
+    if (data.Properties.Zorder) {
+      this.zOrder = data.Properties.Zorder;
+    }
+    if (data.Properties && data.Properties.Color) {
+      this.strokeColor = new SColor(data.Properties.Color);
+    }
+    // if(data.Properties && data.Properties.LineDash){
+    //   this.LineDash = data.Properties.LineDash
+    // }
+    if (data.Properties && data.Properties.LineWidth) {
+      this.lineWidth = data.Properties.LineWidth;
+    }
+  }
+
+  /**
+     * 鼠标按下事件
+     *
+     * @param   event   保存事件参数
+     * @return  boolean
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+      if (event.buttons == 1)
+      this.$emit("legendItemClick", event);
+      return super.onMouseDown(event);
+  } // Function onMouseDown()
+
+  /** 获取data数据  */
+  toData(): Relation | null {
+    let pointList: Point[] = this.pointList.map(item => {
+      return {
+        X: item.x,
+        Y: item.y
+      }
+    });
+
+    if (this.data) {
+      this.data.Name = this.name;
+      this.data.PointList = pointList;
+      this.data.Properties.Zorder = this.zOrder;
+      this.data.Properties.LineWidth = this.lineWidth;
+      // this.data.Properties.LineDash = this.LineDash;
+      this.data.Properties.Color = this.strokeColor.value;
+    }
+
+    return this.data
+  }
+
+    // onDraw(painter: SPainter) {
+    //     if (this.maskFlag && this.status == SItemStatus.Normal) {
+    //         let color = new SColor(this.strokeColor)
+    //         color.alpha = color.alpha / 8
+    //         painter.pen.color = color
+
+    //         if (this.selected) {
+    //             painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
+    //             painter.shadow.shadowBlur = 10;
+    //             painter.shadow.shadowColor = new SColor(`#00000033`);
+    //             painter.shadow.shadowOffsetX = 5;
+    //             painter.shadow.shadowOffsetY = 5;
+    //         } else {
+    //             painter.pen.lineWidth = painter.toPx(this.lineWidth);
+    //             painter.shadow.shadowColor = SColor.Transparent
+    //         }
+    //         painter.drawPolyline(this.pointList)
+
+    //         painter.pen.color = new SColor('#ffffff80')
+    //         painter.drawPolyline(this.pointList)
+    //     } else {
+    //         super.onDraw(painter)
+    //     }
+    // }
+    /**
+     * Item绘制框架
+     *
+     * @param   painter       painter对象
+     * @param   rect          绘制区域
+     */
+    onPaint(painter: SPainter, rect: SRect): void {
+      super.onPaint(painter, rect);
+      if (this.maskFlag && this.status == SItemStatus.Normal) {
+          if (this.selected) {
+              painter.pen.lineWidth = painter.toPx(this.lineWidth * 2);
+          } else {
+              painter.pen.lineWidth = painter.toPx(this.lineWidth);
+          }
+          painter.pen.color = new SColor('#ffffff80')
+          painter.drawPolyline(this.pointList)
+      }
+  } // Function onPaint()
+}

+ 122 - 0
src/lib/parsers/STopologyParser.js

@@ -0,0 +1,122 @@
+import { SParser } from '@saga-web/big/lib';
+import { SNoneLegendItem } from '../items/SNoneLegendItem';
+import { SZoneLegendItem } from '../items/SZoneLegendItem';
+import { SImageLegendItem } from '../items/SImageLegendItem';
+import { SImageMarkerItem } from '../items/SImageMarkerItem';
+import { SLineMarkerItem } from '../items/SLineMarkerItem';
+import { STextMarkerItem } from '../items/STextMarkerItem';
+import { TipelineItem } from '../items/TipelineItem';
+import { SSCPZZoneLegendItem } from '../items/SSCPZZoneLegendItem';
+import { SFHFQZoneLegendItem } from '../items/SFHFQZoneLegendItem';
+/**
+ * 拓扑图信息解析器
+ *
+ */
+export class STopologyParser extends SParser {
+    constructor() {
+        super(...arguments);
+        /** 图例list(非图例类型)   */
+        this.noneLegendList = [];
+        /** 图例list(线类型)   */
+        this.lineLegendList = [];
+        /** 图例list(区域类型)   */
+        this.zoneLegendList = [];
+        /** 图例list(图标类型)   */
+        this.imageLegendList = [];
+        /** 标识list(图类型)   */
+        this.imageMarkerList = [];
+        /** 标识list(线类型)   */
+        this.lineMarkerList = [];
+        /** 标识list(文本类型)   */
+        this.textMarkerList = [];
+        /** 管线关系对象关系list   */
+        this.relationList = [];
+    }
+    /**
+     * 解析数据
+     *
+     * @param   data    系统图数据
+     * */
+    parseData(data) {
+        if (data.Nodes) {
+            data.Nodes.forEach((t) => {
+                this.addLegend(t);
+            });
+        }
+        if (data.Markers) {
+            data.Markers.forEach((t) => {
+                this.addMarker(t);
+            });
+        }
+        if (data.Relations) {
+            data.Relations.forEach((t) => {
+                this.addRelation(t);
+            });
+        }
+    } // Function parseData()
+    /**
+     * 添加图例节点至场景中
+     *
+     * @param   t       图例节点数据
+     * */
+    addLegend(t) {
+        if (t.GraphElementType == 'None') {
+            let item = new SNoneLegendItem(null, t);
+            this.noneLegendList.push(item);
+        }
+        else if (t.GraphElementType == "Zone") {
+            if (t.SubType == "SCPZ") {
+                let item = new SSCPZZoneLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
+            }
+            else if (t.SubType == "FHFQ") {
+                let item = new SFHFQZoneLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
+            }
+            else {
+                let item = new SZoneLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
+            }
+        }
+        else if (t.GraphElementType == 'Image') {
+            let item = new SImageLegendItem(null, t);
+            item.selectable = true;
+            this.imageLegendList.push(item);
+        }
+    } // Function addNode()
+    /**
+     * 添加标识对象至场景中
+     *
+     * @param   t       标识对象数据
+     * */
+    addMarker(t) {
+        if (t.Type == "Image") {
+            let item = new SImageMarkerItem(null, t);
+            this.imageMarkerList.push(item);
+            item.selectable = true;
+        }
+        else if (t.Type == "Line") {
+            let item = new SLineMarkerItem(null, t);
+            item.selectable = true;
+            this.lineMarkerList.push(item);
+        }
+        else if (t.Type == "Text") {
+            let item = new STextMarkerItem(null, t);
+            item.selectable = true;
+            this.textMarkerList.push(item);
+        }
+    } // Function addMarker()
+    /**
+     * 添加管线关系至场景中
+     *
+     * @param   t       管线关系对象数据
+     * */
+    addRelation(t) {
+        let item = new TipelineItem(null, t);
+        item.selectable = true;
+        this.relationList.push(item);
+    } // Function addRelation()
+} // class STopologyParser

+ 134 - 0
src/lib/parsers/STopologyParser.ts

@@ -0,0 +1,134 @@
+// @ts-nocheck
+import { ElementData } from "../types/ElementData";
+import { Legend } from "../types/Legend";
+import { Marker } from "../types/Marker";
+import { Relation } from "../types/Relation";
+import { SGraphElementType } from "../enums/SGraphElementType";
+import { SMarkerType } from "../enums/SMarkerType";
+import { SParser, SRelation } from '@saga-web/big/lib';
+import { SNoneLegendItem } from '../items/SNoneLegendItem';
+import { SLineLegendItem } from '../items/SLineLegendItem';
+import { SZoneLegendItem } from '../items/SZoneLegendItem';
+import { SImageLegendItem } from '../items/SImageLegendItem';
+import { SImageMarkerItem } from '../items/SImageMarkerItem';
+import { SLineMarkerItem } from '../items/SLineMarkerItem';
+import { STextMarkerItem } from '../items/STextMarkerItem';
+import { TipelineItem } from '../items/TipelineItem';
+import { ItemOrder } from "@saga-web/big";
+import { SItemStatus } from "@saga-web/big";
+import { SSCPZZoneLegendItem } from '../items/SSCPZZoneLegendItem';
+import { SFHFQZoneLegendItem } from '../items/SFHFQZoneLegendItem';
+import { SCustomLegendItem } from "../items/SCustomLegendItem";
+/**
+ * 拓扑图信息解析器
+ *
+ */
+export class STopologyParser extends SParser {
+    /** 图例list(非图例类型)   */
+    noneLegendList: SNoneLegendItem[] = [];
+    /** 图例list(线类型)   */
+    lineLegendList: SLineLegendItem[] = [];
+    /** 图例list(区域类型)   */
+    zoneLegendList: SZoneLegendItem[] = [];
+    /** 图例list(图标类型)   */
+    imageLegendList: SImageLegendItem[] = [];
+
+    /** 标识list(图类型)   */
+    imageMarkerList: SImageMarkerItem[] = [];
+    /** 标识list(线类型)   */
+    lineMarkerList: SLineMarkerItem[] = [];
+    /** 标识list(文本类型)   */
+    textMarkerList: STextMarkerItem[] = [];
+
+    /** 管线关系对象关系list   */
+    relationList: SRelation[] = [];
+
+    /**
+     * 解析数据
+     *
+     * @param   data    系统图数据
+     * */
+    parseData(data: ElementData): void {
+        if (data.Nodes) {
+            data.Nodes.forEach((t: Legend): void => {
+                this.addLegend(t);
+            });
+        }
+        if (data.Markers) {
+            data.Markers.forEach((t: Marker): void => {
+                this.addMarker(t);
+            });
+        }
+        if (data.Relations) {
+            data.Relations.forEach((t: Relation): void => {
+                this.addRelation(t);
+            });
+        }
+    } // Function parseData()
+
+    /**
+     * 添加图例节点至场景中
+     *
+     * @param   t       图例节点数据
+     * */
+    private addLegend(t: Legend): void {
+        if (t.GraphElementType == 'None') {
+            let item = new SNoneLegendItem(null, t);
+            this.noneLegendList.push(item);
+        } else if (t.GraphElementType == "Zone") {
+            if (t.SubType == "SCPZ") {
+                let item = new SSCPZZoneLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
+            } else if (t.SubType == "FHFQ") {
+                let item = new SFHFQZoneLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
+            }  else if (t.SubType == "CUSTOM") {
+                let item = new SCustomLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
+            } else {
+                let item = new SZoneLegendItem(null, t);
+                item.selectable = true;
+                this.zoneLegendList.push(item);
+            }
+        } else if (t.GraphElementType == 'Image') {
+            let item = new SImageLegendItem(null, t);
+            item.selectable = true;
+            this.imageLegendList.push(item);
+        }
+    } // Function addNode()
+
+    /**
+     * 添加标识对象至场景中
+     *
+     * @param   t       标识对象数据
+     * */
+    private addMarker(t: Marker): void {
+        if (t.Type == "Image") {
+            let item = new SImageMarkerItem(null, t);
+            this.imageMarkerList.push(item);
+            item.selectable = true;
+        } else if (t.Type == "Line") {
+            let item = new SLineMarkerItem(null, t);
+            item.selectable = true;
+            this.lineMarkerList.push(item);
+        } else if (t.Type == "Text") {
+            let item = new STextMarkerItem(null, t);
+            item.selectable = true;
+            this.textMarkerList.push(item);
+        }
+    } // Function addMarker()
+
+    /**
+     * 添加管线关系至场景中
+     *
+     * @param   t       管线关系对象数据
+     * */
+    private addRelation(t: Relation): void {
+        let item = new TipelineItem(null, t);
+        item.selectable = true;
+        this.relationList.push(item);
+    } // Function addRelation()
+} // class STopologyParser

+ 19 - 0
src/lib/types/Anchor.js

@@ -0,0 +1,19 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */

+ 35 - 0
src/lib/types/Anchor.ts

@@ -0,0 +1,35 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */
+
+
+// @ts-nocheck
+import { Point } from "@saga-web/big/lib/types/Point";
+
+/**
+ * 锚点item接口
+ *
+ * @author  张宇
+ */
+export interface Anchor {
+    /** 锚点ID */
+    ID: string;
+    /** 锚点的坐标  */
+    Pos: Point;
+} // Interface Anchor

+ 19 - 0
src/lib/types/ElementData.js

@@ -0,0 +1,19 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */

+ 36 - 0
src/lib/types/ElementData.ts

@@ -0,0 +1,36 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */
+
+
+// @ts-nocheck
+import { Legend } from "./Legend";
+import { Marker } from "./Marker";
+import { Relation } from "./Relation";
+
+/**
+ * 系统图数据接口
+ *
+ * @author  张宇
+ */
+export interface ElementData {
+    Nodes: Legend[];
+    Markers: Marker[];
+    Relations: Relation[];
+} // Interface ElementData

+ 19 - 0
src/lib/types/Legend.js

@@ -0,0 +1,19 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */

+ 64 - 0
src/lib/types/Legend.ts

@@ -0,0 +1,64 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */
+
+// @ts-nocheck
+import { Anchor } from "./Anchor";
+import { SGraphElementType } from "./../enums/SGraphElementType";
+import { Point } from "@saga-web/big/lib/types/Point";
+import { Size } from "@saga-web/big/lib/types/Size";
+import { SPoint } from '@saga-web/draw/lib';
+
+/**
+ * 图例节点接口
+ *
+ * @author  张宇
+ */
+export interface Legend {
+    /** ID */
+    ID: string;
+    /** 名称  */
+    Name: string;
+    /** 返回工程信息化对象 ID 列表 */
+    AttachObjectIds?: string[];
+    /** 图标,区域类型  */
+    GraphElementType: string;
+    /** 对应的图例ID  */
+    GraphElementId: string;
+    /** 图例数量  */
+    Num?: number;
+    /** 位置  */
+    Pos: Point;
+    /** item类型 */
+    Type: string
+    /** 缩放  */
+    Scale?: Point;
+    /** 旋转  */
+    Rolate?: Point;
+    /** 大小  */
+    Size?: Size;
+    /** 锚点List  */
+    AnchorList?: Anchor[];
+    /** 轮廓线  */
+    OutLine?: Point[] | SPoint[];
+    /** 由应用自己定义  */
+    Properties?: any;
+     /** zone 区分防火分区和石材铺装  */
+    SubType?:string
+} // Interface Legend

+ 19 - 0
src/lib/types/Marker.js

@@ -0,0 +1,19 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */

+ 49 - 0
src/lib/types/Marker.ts

@@ -0,0 +1,49 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */
+
+// @ts-nocheck
+
+import { SMarkerType } from "@saga-web/big/lib/enums/SMarkerType";
+import { Point } from "@saga-web/big/lib/types/Point";
+import { Size } from "@saga-web/big/lib/types/Size";
+
+/**
+ * 标识对象接口
+ *
+ * @author  张宇
+ */
+export interface Marker {
+    /** ID */
+    ID: string;
+    /** 名称  */
+    Name: string;
+    /** 图标(Image),线类型(Line) */
+    Type: string;
+    /** 位置  */
+    Pos: Point;
+    /** 缩放  */
+    Scale?: Point;
+    /** 旋转  */
+    Rolate?: Point;
+    /** 大小  */
+    Size?: Size;
+    /** 由应用自己定义  */
+    Properties?: any;
+} // Interface Marker

+ 19 - 0
src/lib/types/Relation.js

@@ -0,0 +1,19 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */

+ 55 - 0
src/lib/types/Relation.ts

@@ -0,0 +1,55 @@
+/*
+ * ********************************************************************************************************************
+ *
+ *                      :*$@@%$*:                         ;:                ;;    ;;
+ *                    :@@%!  :!@@%:                       %!             ;%%@@%$ =@@@@@@@%;     @%@@@%%%%@@@@@
+ *                   :@%;       :$=                       %%$$$%$$         ;$$  ;$@=   !@$
+ *                   =@!                                  %!              @ $=;%   !@@@%:      !$$$$$$$$$$$$$$=
+ *                   =@*                                  %!              @ $= % %@=   =%@!      %=
+ *              *$%%! @@=        ;=$%%%$*:                %!              @ $= % =%%%%%%@$      *%:         =%
+ *            %@@!:    !@@@%=$@@@@%!  :*@@$:              %!              @ $= % $*     ;@      @*          :%*
+ *          ;@@!          ;!!!;:         ;@%:      =======@%========*     @ $$ % $%*****$@     :@$=*********=@$
+ *          $@*   ;@@@%=!:                *@*
+ *          =@$    ;;;!=%@@@@=!           =@!
+ *           %@$:      =@%: :*@@@*       %@=                    Copyright (c) 2016-2019.  北京上格云技术有限公司
+ *            ;%@@$=$@@%*       *@@@$=%@@%;
+ *               ::;::             ::;::                                              All rights reserved.
+ *
+ * ********************************************************************************************************************
+ */
+// @ts-nocheck
+
+
+import { SRelationDir } from "@saga-web/big/lib/enums/SRelationDir";
+import { SLineType } from "@saga-web/big/lib/enums/SLineType";
+import { Point } from "@saga-web/big/lib/types/Point";
+
+/**
+ * 管线对象关系接口
+ *
+ * @author  张宇
+ */
+export interface Relation {
+    /** ID */
+    ID: string;
+    /** 名称 */
+    Name: string;
+    /** 对应的图例ID */
+    GraphElementId: string;
+    /** 关联节点1_id */
+    Node1ID?: string;
+    /** 关联节点2_id */
+    Node2ID?: string;
+    /** 关联锚点1_id  */
+    Anchor1ID?: string;
+    /** 关联锚点2_id */
+    Anchor2ID?: string;
+    /** 方向(0:无向,1:节点1到节点2,2:节点2到节点1) */
+    Dir?: SRelationDir;
+    /** 线类型(0:直线,1:水平/垂直线,2:曲线) */
+    LineType: string;
+    /** 线的顶点坐标 */
+    PointList: Point[];
+    /** 线的绘图样式 */
+    Properties?: any;
+} // Interface Relation

+ 16 - 3
src/main.ts

@@ -2,11 +2,24 @@ import Vue from 'vue'
 import App from './App.vue'
 import router from './router'
 import store from './store'
+// 引入lib-flexible
+import 'lib-flexible'
 
 Vue.config.productionTip = false
+// 引入使用fastclick
+// 移动端点击有300ms延迟,主要是为了解决双击缩放,浏览器等待300ms以判断是否是双击操作。
+// 可以采用引入fastclick.js的方式解决移动端300ms延迟的问题
+// @ts-ignore
+// import FastClick from 'fastclick'
+// FastClick.attach(document.body)
 
+import VConsole from 'vconsole'
+// 开发环境引入 vConsole调试工具
+if (process.env.NODE_ENV === 'production') {
+    new VConsole()
+}
 new Vue({
-  router,
-  store,
-  render: h => h(App)
+    router,
+    store,
+    render: (h) => h(App),
 }).$mount('#app')

+ 62 - 18
src/router/index.ts

@@ -1,29 +1,73 @@
 import Vue from 'vue'
 import VueRouter, { RouteConfig } from 'vue-router'
-import Home from '../views/Home.vue'
+// 解决Vue-Router升级导致的Uncaught(in promise) navigation guard问题
+const originalPush = VueRouter.prototype.push
+// @ts-ignore
+VueRouter.prototype.push = function push(location, onResolve, onReject) {
+    if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
+    // @ts-ignore
+    return originalPush.call(this, location).catch((err) => err)
+}
 
 Vue.use(VueRouter)
 
-  const routes: Array<RouteConfig> = [
-  {
-    path: '/',
-    name: 'Home',
-    component: Home
-  },
-  {
-    path: '/about',
-    name: 'About',
-    // route level code-splitting
-    // this generates a separate chunk (about.[hash].js) for this route
-    // which is lazy-loaded when the route is visited.
-    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
-  }
+const routes: Array<RouteConfig> = [
+    // 项目概况
+    {
+        path: '/',
+        name: 'Overview',
+        component: () => import(/* webpackChunkName: "overview" */ '../views/Overview.vue'),
+        meta: {
+            keepAlive: true,
+            showTabbar: true,
+        },
+    },
+    // 项目概况
+    {
+        path: '/overview',
+        name: 'overview',
+        component: () => import(/* webpackChunkName: "overview" */ '../views/Overview.vue'),
+        meta: {
+            keepAlive: true,
+            showTabbar: true,
+        },
+    },
+    // 楼层功能
+    {
+        path: '/floorFunc',
+        name: 'FloorFunc',
+        component: () => import(/* webpackChunkName: "floorFunc" */ '../views/FloorFunc.vue'),
+        meta: {
+            keepAlive: true,
+            showTabbar: true,
+        },
+    },
+    // 设备设施
+    {
+        path: '/equipmentFacilities',
+        name: 'EquipmentFacilities',
+        component: () => import(/* webpackChunkName: "equipmentFacilities" */ '../views/EquipmentFacilities.vue'),
+        meta: {
+            keepAlive: true,
+            showTabbar: true,
+        },
+    },
+    // 其他事项
+    {
+        path: '/otherMatter',
+        name: 'OtherMatter',
+        component: () => import(/* webpackChunkName: "otherMatter" */ '../views/OtherMatter.vue'),
+        meta: {
+            keepAlive: true,
+            showTabbar: true,
+        },
+    },
 ]
 
 const router = new VueRouter({
-  mode: 'history',
-  base: process.env.BASE_URL,
-  routes
+    mode: 'history',
+    base: process.env.BASE_URL,
+    routes,
 })
 
 export default router

+ 14 - 8
src/store/index.ts

@@ -4,12 +4,18 @@ import Vuex from 'vuex'
 Vue.use(Vuex)
 
 export default new Vuex.Store({
-  state: {
-  },
-  mutations: {
-  },
-  actions: {
-  },
-  modules: {
-  }
+    state: {
+        ssoToken: 'admin:liujiandong',
+        // ssoToken: null,
+    },
+    getters: {
+        ssoToken: (state) => state.ssoToken,
+    },
+    mutations: {
+        SETSSOTOKEN(state, data) {
+            state.ssoToken = data
+        },
+    },
+    actions: {},
+    modules: {},
 })

+ 148 - 0
src/style/common.less

@@ -0,0 +1,148 @@
+body,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+p,
+blockquote,
+dl,
+dt,
+dd,
+ul,
+ol,
+li,
+pre,
+form,
+fieldset,
+legend,
+button,
+input,
+textarea,
+th,
+td {
+    margin: 0;
+    padding: 0;
+}
+
+body,
+button,
+input,
+select,
+textarea {
+    font: 12px/1.5 Arial, 'Microsoft YaHei', '\65b0\5b8b\4f53';
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: 100%;
+}
+
+address,
+cite,
+dfn,
+var,
+em,
+i,
+u {
+    font-style: normal;
+}
+
+ol,
+ul {
+    list-style: none;
+}
+
+a {
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+img {
+    border: none;
+    vertical-align: middle;
+}
+
+:focus {
+    outline: 0;
+}
+
+button,
+input,
+select,
+textarea {
+    font-size: 100%;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+/* 滚动条样式 */
+
+body ::-webkit-scrollbar {
+    width: 5px;
+    height: 8px;
+}
+
+body ::-webkit-scrollbar-track {
+    background-color: rgba(0, 0, 0, 0);
+    border-radius: 3px;
+}
+
+body ::-webkit-scrollbar-thumb {
+    border-radius: 3px;
+    background: #e6e6e6;
+    border: 1px solid #e6e6e6;
+}
+
+body ::-webkit-scrollbar-thumb:vertical:hover {
+    background: #e6e6e6;
+    border: 1px solid #e6e6e6;
+}
+
+.clearfix::after {
+    content: '.';
+    display: block;
+    height: 0;
+    clear: both;
+    visibility: hidden;
+}
+.clearfix {
+    zoom: 1;
+}
+
+.left {
+    float: left;
+}
+
+.right {
+    float: right;
+}
+html,
+body {
+    width: 100%;
+    height: 100%;
+}
+#app {
+    height: 100%;
+    width: 100%;
+    // position: relative;
+    .fengMap {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        z-index: -1;
+        opacity: 0;
+    }
+}

+ 3 - 0
src/utils/bus.js

@@ -0,0 +1,3 @@
+import Vue from 'vue'
+const bus = new Vue()
+export default bus

+ 826 - 0
src/utils/components.js

@@ -0,0 +1,826 @@
+/**
+ * 修改说明
+ * @author yunxing
+ * @date 2020年09月01日
+ * @description 八大系统下,主要设备维保事项,主要设备维修事项,专维及其他事项 param属性下,新增 wznw,apply字段,
+ *              供 src/views/equipment/eqDialog.vue 页面 title右侧icon跳转使用
+ * @param { string } wznw   区分各系统内外(如: 慧云机房内,慧云机房外) wznw为0,-1时,不上传改字段
+ * @param { string } apply  事项类型, 含: 维修维保,专维及其他
+ * @param { string } difference 区分给排水 取值范围:给水;排水 给排水专用字段
+ *
+ */
+const system = [
+    {
+        name: '供电系统',
+        id: 1,
+        categoryId: 'GDXT',
+        smsxt: '1001',
+        icon: require('@/assets/imgs/cdgd.png'),
+        icon1: require('@/assets/imgs/cdgd2.png'),
+        children: [
+            {
+                label: '系统原理图',
+                children: [],
+                id: 'GDYL',
+                param: { tab_code: '1592', type_code: '2010' },
+            },
+            {
+                label: '主要设备清单',
+                children: [],
+                id: 'GDQD',
+                param: { tab_code: 'gd01' },
+            },
+            {
+                label: '楼层电井(间)控制商铺范围清单',
+                id: 'GJSP',
+                children: [],
+                param: { tab_code: '1592' },
+            },
+            {
+                label: '主要设备维保事项',
+                id: 'GDWB',
+                children: [
+                    {
+                        label: '配电室内重要维保',
+                        id: 'GDWB1',
+                        param: { tab_code: '1592', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '配电室外重要维保',
+                        id: 'GDWB2',
+                        param: { tab_code: '1593', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', diff: 'ourct2', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备维修事项',
+                id: 'GDWX',
+                children: [
+                    {
+                        label: '配电室内重要维修',
+                        id: 'GDWX1',
+                        param: { tab_code: '1592', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '配电室外重要维修',
+                        id: 'GDWX2',
+                        param: { tab_code: '1593', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', diff: 'rc', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '专维及其他事项',
+                id: 'GDZW',
+                children: [
+                    {
+                        label: '专项维修',
+                        id: 'GDZW',
+                        param: { tab_code: '1592', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'GDQT',
+                        param: { tab_code: '1593', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+            },
+            {
+                label: '查看图纸',
+                children: [],
+                id: 'GDTZ',
+                param: { tab_code: 'rd01' },
+            },
+        ],
+    },
+    {
+        name: '暖通系统',
+        smsxt: '1002',
+        id: 2,
+        categoryId: 'NTXT',
+        icon: require('@/assets/imgs/cdnt.png'),
+        icon1: require('@/assets/imgs/cdnt2.png'),
+        children: [
+            {
+                label: '系统原理图',
+                id: 'NTYL',
+                children: [
+                    {
+                        label: '空调系统原理图',
+                        id: 'NTYL1',
+                        param: { tab_code: '1572', type_code: '2011' },
+                    },
+                    {
+                        label: '采暖系统原理图',
+                        id: 'NTYL2',
+                        param: { tab_code: '1512', type_code: '2012' },
+                    },
+                    {
+                        label: '分水器支路分布明细',
+                        id: 'NTYL3',
+                        param: { tab_code: '1502', type_code: '2013' },
+                    },
+                    {
+                        label: '分水器支路分布图',
+                        id: 'NTYL4',
+                        param: { tab_code: '1542', type_code: 'FBT1' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备清单',
+                children: [
+                    {
+                        label: '冷热源机房内',
+                        id: 'NTQD1',
+                        param: { tab_code: 'nt01' },
+                    },
+                    {
+                        label: '楼层末端',
+                        id: 'NTQD2',
+                        param: { tab_code: 'nt02' },
+                    },
+                ],
+                id: 'NTQD',
+            },
+            {
+                label: '主要设备维保事项',
+                children: [
+                    {
+                        label: '冷源机房内重要维保',
+                        id: 'NTWB1',
+                        param: { tab_code: '1592', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '冷源机房外重要维保',
+                        id: 'NTWB2',
+                        param: { tab_code: '1593', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', diff: 'rb', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+                id: 'NTWB',
+            },
+            {
+                label: '主要设备维修事项',
+                children: [
+                    {
+                        label: '冷源机房内重要维修',
+                        id: 'NTWX1',
+                        param: { tab_code: '1592', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '冷源机房外重要维修',
+                        id: 'NTWX2',
+                        param: { tab_code: '1593', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', diff: 'rx', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+                id: 'NTWX',
+            },
+            {
+                label: '专维及其他事项',
+                children: [
+                    {
+                        label: '专项维修',
+                        id: 'NTZW',
+                        param: { tab_code: '1592', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'NTQT',
+                        param: { tab_code: '1593', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+                id: 'NTZW',
+            },
+            {
+                label: '查看图纸',
+                children: [],
+                param: { tab_code: 'rd01' },
+                id: 'NTTZ',
+            },
+        ],
+    },
+    {
+        name: '消防系统',
+        smsxt: '1003',
+        categoryId: 'XFXT',
+        icon: require('@/assets/imgs/cdxf.png'),
+        icon1: require('@/assets/imgs/cdxf2.png'),
+        id: 3,
+        children: [
+            {
+                label: '系统原理图',
+                children: [
+                    {
+                        label: '消防电系统原理示意图',
+                        id: 'XFYL1',
+                        param: { tab_code: '1572', type_code: '2014' },
+                    },
+                    {
+                        label: '消防喷淋系统示意图',
+                        id: 'XFYL2',
+                        param: { tab_code: '1552', type_code: '2015' },
+                    },
+                    {
+                        label: '消防窗喷系统示意图',
+                        id: 'XFYL3',
+                        param: { tab_code: '1542', type_code: '2016' },
+                    },
+                    {
+                        label: '消防栓系统示意图',
+                        id: 'XFYL4',
+                        param: { tab_code: '1545', type_code: '2017' },
+                    },
+                    {
+                        label: '消防泵房引出管路分布图',
+                        id: 'XFYL5',
+                        param: { type_code: 'FBT2' },
+                    },
+                ],
+                id: 'XFYL',
+            },
+            {
+                label: '主要设备清单',
+                children: [],
+                id: 'XFQD',
+                param: { tab_code: 'xf01' },
+            },
+            {
+                label: '主要设备维保事项',
+                id: 'XFWB',
+                children: [
+                    {
+                        label: '中控室/消防泵房内重要维保',
+                        id: 'XFWB1',
+                        param: { tab_code: '1573', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '中控室/消防泵房外重要维保',
+                        id: 'XFWB2',
+                        param: { tab_code: '1572', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', diff: 'rb', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备维修事项',
+                id: 'XFWX',
+                children: [
+                    {
+                        label: '中控室/消防泵房内重要维修',
+                        id: 'XFWX1',
+                        param: { tab_code: '1573', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '中控室/消防泵房外重要维修',
+                        id: 'XFWX2',
+                        param: { tab_code: '1572', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', diff: 'rx', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '专维及其他事项',
+                id: 'XFZW',
+                children: [
+                    {
+                        label: '专项维修',
+                        id: 'XFZW',
+                        param: { tab_code: '1576', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'XFQT',
+                        param: { tab_code: '1572', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+            },
+            {
+                label: '查看图纸',
+                children: [],
+                param: { tab_code: 'rd01' },
+                id: 'XFTZ',
+            },
+        ],
+    },
+    {
+        name: '弱电系统',
+        smsxt: '1004',
+        id: '1004',
+        categoryId: 'RDXT',
+        icon: require('@/assets/imgs/cdrd.png'),
+        icon1: require('@/assets/imgs/cdrd2.png'),
+        children: [
+            {
+                label: '系统原理图',
+                children: [
+                    {
+                        label: '门禁管理系统原理图',
+                        id: 'RDYL2',
+                        param: { tab_code: 'rd01', type_code: '2019' },
+                    },
+                    {
+                        label: '视频监控系统原理图',
+                        id: 'RDYL1',
+                        param: { tab_code: '1572', type_code: '2018' },
+                    },
+                    {
+                        label: 'BA楼宇智能化系统原理图',
+                        id: 'RDYL3',
+                        param: { tab_code: '1574', type_code: '2020' },
+                    },
+                ],
+                id: 'RDYL',
+            },
+            {
+                label: '主要设备清单',
+                id: 'RDQD',
+                children: [
+                    {
+                        label: '门禁管理',
+                        id: 'RDQD2',
+                        param: { tab_code: 'rd01' },
+                    },
+                    {
+                        label: '视频监控',
+                        id: 'RDQD3',
+                        param: { tab_code: 'rd02' },
+                    },
+                    {
+                        label: 'BA楼宇智能化',
+                        id: 'RDQD1',
+                        param: { tab_code: 'rd03' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备维保事项',
+                id: 'RDWB',
+                children: [
+                    {
+                        label: '慧云机房内重要维保',
+                        id: 'RDWB1',
+                        param: { tab_code: '1592', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '慧云机房外重要维保',
+                        id: 'RDWB2',
+                        param: { tab_code: '1593', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', diff: 'rb', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备维修事项',
+                id: 'RDWX',
+                children: [
+                    {
+                        label: '慧云机房内重要维修',
+                        id: 'RDWX1',
+                        param: { tab_code: '1592', diff: 'in', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '慧云机房外重要维修',
+                        id: 'RDWX2',
+                        param: { tab_code: '1593', diff: 'out', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', diff: 'rx', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '专维及其他事项',
+                id: 'RDZW',
+                children: [
+                    {
+                        label: '专项维修',
+                        id: 'RDZW',
+                        param: { tab_code: '1592', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'RDQT',
+                        param: { tab_code: '1593', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+            },
+            {
+                label: '查看图纸',
+                id: 'RDTZ',
+                param: { tab_code: 'rd01' },
+                children: [],
+            },
+        ],
+    },
+    {
+        name: '给排水',
+        smsxt: '1005',
+        categoryId: 'JPSXT',
+        id: 5,
+        icon: require('@/assets/imgs/cdgps.png'),
+        icon1: require('@/assets/imgs/cdgps2.png'),
+        children: [
+            {
+                label: '系统原理图',
+                id: 'GSYL',
+                children: [
+                    {
+                        label: '给水系统原理示意图',
+                        id: 'GSYL1',
+                        param: { tab_code: '1572', type_code: '2021', diff: '给水' },
+                    },
+                    {
+                        label: '排水系统原理示意图',
+                        id: 'GSYL2',
+                        param: { tab_code: '1542', type_code: '2022', diff: '排水' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备清单',
+                id: 'GSQD',
+                children: [],
+                param: { tab_code: 'gps01' },
+            },
+            {
+                label: '主要设备维保事项',
+                id: 'GSWB',
+                children: [
+                    {
+                        label: '给水系统重要维保',
+                        id: 'GSWB1',
+                        param: { tab_code: 'gps01', diff: 'gs', difference: '给水', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '排水系统重要维保',
+                        id: 'GSWB2',
+                        param: { tab_code: 'gps02', diff: 'ps', difference: '排水', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', diff: 'rb', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备维修事项',
+                id: 'GSWX',
+                children: [
+                    {
+                        label: '给水系统重要维修',
+                        id: 'GSWX1',
+                        param: { tab_code: '1592', diff: 'gs', difference: '给水', wznw: '内', apply: '维修维保' },
+                    },
+                    {
+                        label: '排水系统重要维修',
+                        id: 'GSWX2',
+                        param: { tab_code: '1593', diff: 'ps', difference: '排水', wznw: '外', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', diff: 'rx', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '专维及其他事项',
+                id: 'GSZW',
+                children: [
+                    {
+                        label: '给水系统专项维修',
+                        id: 'GSZW1',
+                        param: { tab_code: '1592', difference: '给水', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '排水系统专项维修',
+                        id: 'GSZW2',
+                        param: { tab_code: '1593', difference: '排水', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'GSQT',
+                        param: { tab_code: '1594', difference: '', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+            },
+            {
+                label: '查看图纸',
+                id: 'GSTZ',
+                param: { tab_code: 'rd01' },
+                children: [],
+            },
+        ],
+    },
+    {
+        name: '电梯系统',
+        smsxt: '1006',
+        id: 6,
+        categoryId: 'DTXT',
+        icon: require('@/assets/imgs/cddt.png'),
+        icon1: require('@/assets/imgs/cddt2.png'),
+        children: [
+            {
+                label: '系统原理图',
+                children: [
+                    {
+                        label: '扶梯原理图',
+                        id: 'DTYL1',
+                        param: { tab_code: '1572', type_code: '2023' },
+                    },
+                    {
+                        label: '直梯原理图',
+                        id: 'DTYL2',
+                        param: { tab_code: '1072', type_code: '2024' },
+                    },
+                ],
+                id: 'DTYL',
+            },
+            {
+                label: '主要设备清单',
+                id: 'DTQD',
+                children: [],
+                param: { tab_code: 'dt01' },
+            },
+            {
+                label: '主要设备维保事项',
+                id: 'DTWB',
+                children: [
+                    {
+                        label: '重要维保事项',
+                        id: 'DTWB1',
+                        param: { tab_code: 'dt01', wznw: '0', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备维修事项',
+                id: 'DTWX',
+                children: [
+                    {
+                        label: '重要维修事项',
+                        id: 'DTWX1',
+                        param: { tab_code: 'dt01', wznw: '0', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '专维及其他事项',
+                id: 'DTZW',
+                children: [
+                    {
+                        label: '专项维修',
+                        id: 'DTZW',
+                        param: { tab_code: 'dt01', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'DTQT',
+                        param: { tab_code: 'dt02', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+            },
+            {
+                label: '查看图纸',
+                id: 'DTTZ',
+                param: { tab_code: 'rd01' },
+                children: [],
+            },
+        ],
+    },
+    {
+        name: '燃气系统',
+        smsxt: '1007',
+        categoryId: 'RQXT',
+        id: 7,
+        icon: require('@/assets/imgs/cdrq.png'),
+        icon1: require('@/assets/imgs/cdrq2.png'),
+        children: [
+            {
+                label: '系统原理图',
+                children: [],
+                id: 'RQYL',
+                param: { tab_code: '234', type_code: '2025' },
+            },
+            {
+                label: '主要设备清单',
+                children: [],
+                id: 'RQQD',
+                param: { tab_code: 'rq01' },
+            },
+            {
+                label: '主要设备维保事项',
+                id: 'RQWB',
+                children: [
+                    {
+                        label: '重要维保事项',
+                        id: 'RQWB1',
+                        param: { tab_code: '1592', wznw: '0', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '主要设备维修事项',
+                id: 'RQWX',
+                children: [
+                    {
+                        label: '重要维修事项',
+                        id: 'RQWX1',
+                        param: { tab_code: '1592', wznw: '0', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '专维及其他事项',
+                id: 'RQZW',
+                children: [
+                    {
+                        label: '专项维修',
+                        id: 'RQZW',
+                        param: { tab_code: '1592', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'RQQT',
+                        param: { tab_code: '1593', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+            },
+            {
+                label: '查看图纸',
+                id: 'RQTZ',
+                param: { tab_code: 'rd01' },
+                children: [],
+            },
+        ],
+    },
+    {
+        name: '土建装饰',
+        smsxt: '1008',
+        categoryId: 'SCPZ',
+        icon: require('@/assets/imgs/cdtj.png'),
+        icon1: require('@/assets/imgs/cdtj2.png'),
+        id: 8,
+        children: [
+            {
+                label: '建筑立面图',
+                id: 'TJYL',
+                children: [
+                    {
+                        label: '北面外立面',
+                        id: 'RQYL',
+                        param: { tab_code: '2343', type_code: '2029' },
+                    },
+                    {
+                        label: '西面外立面',
+                        id: 'RQYL',
+                        param: { tab_code: '2340', type_code: '2027' },
+                    },
+                    {
+                        label: '南面外立面',
+                        id: 'RQYL',
+                        param: { tab_code: '2341', type_code: '2028' },
+                    },
+                    {
+                        label: '东面外立面',
+                        id: 'RQYL',
+                        param: { tab_code: '2342', type_code: '2026' },
+                    },
+                ],
+            },
+            {
+                label: '维保事项',
+                id: 'TJWB',
+                children: [
+                    {
+                        label: '重要维保事项',
+                        id: 'TJWB1',
+                        param: { tab_code: '1592', wznw: '0', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维保事项',
+                        id: 'RB',
+                        param: { tab_code: 'rb', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '维修事项',
+                id: 'TJWX',
+                children: [
+                    {
+                        label: '重要维修事项',
+                        id: 'TJWX1',
+                        param: { tab_code: '1592', wznw: '0', apply: '维修维保' },
+                    },
+                    {
+                        label: '日常维修事项',
+                        id: 'RX',
+                        param: { tab_code: 'rx', wznw: '-1', apply: '维修维保' },
+                    },
+                ],
+            },
+            {
+                label: '专维及其他事项',
+                id: 'TJZW',
+                children: [
+                    {
+                        label: '专项维修',
+                        id: 'TJZW',
+                        param: { tab_code: '1592', wznw: '0', apply: '专维及其它' },
+                    },
+                    {
+                        label: '其他事项',
+                        id: 'TJQT',
+                        param: { tab_code: '1593', wznw: '0', apply: '专维及其它' },
+                    },
+                ],
+            },
+            {
+                label: '查看图纸',
+                id: 'TJTZ',
+                param: { tab_code: 'rd01' },
+                children: [],
+            },
+        ],
+    },
+]
+// 事项
+const matter = [
+    {
+        icon: require('@/assets/imgs/zhsx.png'),
+        icon1: require('@/assets/imgs/zhsx2.png'),
+        name: '综合事项管理',
+        id: '1',
+        children: [
+            { label: '综合记录事项', type: 1 },
+            { label: '第三方检测事项', type: 2 },
+        ],
+    },
+    {
+        icon: require('@/assets/imgs/fuyfgl2.png'),
+        icon1: require('@/assets/imgs/fuyfgl.png'),
+        name: '辅助用房管理',
+        id: '2',
+        children: [
+            { label: '广场辅助用房汇总统计表', type: 1 },
+            { label: '广场辅助用房调改变更记录', type: 2 },
+        ],
+    },
+]
+
+export { system, matter }

+ 0 - 0
src/utils/util.js


+ 0 - 5
src/views/About.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
-</template>

+ 25 - 0
src/views/EquipmentFacilities.vue

@@ -0,0 +1,25 @@
+<template>
+    <div class='equipment-facilities'>
+        <p>EquipmentFacilities</p>
+    </div>
+</template>
+<script>
+export default {
+    name: 'EquipmentFacilities',
+    props: {},
+    data() {
+        return {}
+    },
+    components: {},
+    beforeMount() {},
+    mounted() {},
+    methods: {},
+}
+</script>
+<style lang='less' scoped>
+.equipment-facilities {
+    width: 100%;
+    height: 100%;
+    background-color: #f08080;
+}
+</style>

+ 25 - 0
src/views/FloorFunc.vue

@@ -0,0 +1,25 @@
+<template>
+    <div class='floor-function'>
+        <p>FloorFunc</p>
+    </div>
+</template>
+<script>
+export default {
+    name: 'FloorFunc',
+    props: {},
+    data() {
+        return {}
+    },
+    components: {},
+    beforeMount() {},
+    mounted() {},
+    methods: {},
+}
+</script>
+<style lang='less' scoped>
+.floor-function {
+    width: 100%;
+    height: 100%;
+    background-color: #add8e6;
+}
+</style>

+ 0 - 18
src/views/Home.vue

@@ -1,18 +0,0 @@
-<template>
-  <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
-  </div>
-</template>
-
-<script>
-// @ is an alias to /src
-import HelloWorld from '@/components/HelloWorld.vue'
-
-export default {
-  name: 'Home',
-  components: {
-    HelloWorld
-  }
-}
-</script>

+ 25 - 0
src/views/OtherMatter.vue

@@ -0,0 +1,25 @@
+<template>
+    <div class='other-matter'>
+        <p>OtherMatter</p>
+    </div>
+</template>
+<script>
+export default {
+    name: 'OtherMatter',
+    props: {},
+    data() {
+        return {}
+    },
+    components: {},
+    beforeMount() {},
+    mounted() {},
+    methods: {},
+}
+</script>
+<style lang='less' scoped>
+.other-matter {
+    width: 100%;
+    height: 100%;
+    background-color: #d3d3d3;
+}
+</style>

+ 38 - 0
src/views/Overview.vue

@@ -0,0 +1,38 @@
+<template>
+    <div class='overview'>
+        <p>Overview</p>
+        <van-button @click='handleClick' type='primary'>测试</van-button>
+    </div>
+</template>
+<script>
+import Vue from 'vue'
+import { Button } from 'vant'
+Vue.use(Button)
+export default {
+    name: 'Overview',
+    props: {},
+    data() {
+        return {}
+    },
+    components: {},
+    beforeMount() {},
+    mounted() {
+        console.log('项目概况页面mounted')
+        console.table('sssss');
+        console.error('sdfasdfasdf');
+        debugger
+    },
+    methods: {
+        handleClick(e) {
+            console.log(e)
+        },
+    },
+}
+</script>
+<style lang='less' scoped>
+.overview {
+    width: 100%;
+    height: 100%;
+    background-color: #87cefa;
+}
+</style>

+ 51 - 0
version.js

@@ -0,0 +1,51 @@
+/**定义模块和变量**/
+const exec = require('child_process').exec; //异步子进程
+const execSync = require('child_process').execSync; //同步子进程
+const fs = require('fs'); //文件读取模块
+const versionPath = 'version.txt'; //version路径
+const buildPath = 'fms'; //打包的路径
+const autoPush = true; //写入版本信息之后是否自动提交git上
+const autoText = "node自动提交的版本信息"; //自动提交时的说明
+const commit = execSync('git show -s --format=%H').toString().trim(); //当前提交的版本号
+
+/**程序开始**/
+var versionStr = ""; //版本信息字符串
+
+// 如果versionPath存在,将先读取里边的版本信息
+if (fs.existsSync(versionPath)) {
+    versionStr = fs.readFileSync(versionPath).toString() + '\n';
+}
+
+// 根据版本信息是已存在commit,进行不同处理
+if (!autoPush && versionStr.indexOf(commit) != -1) {
+    console.warn('\x1B[33m%s\x1b[0m', 'warming: 当前的git版本数据已经存在了!\n')
+} else if (execSync('git show -s --format=%s').toString().trim() == autoText) {
+    console.warn('\x1B[33m%s\x1b[0m', `warming: 读取最新的git说明为(${autoText})!\n`);
+} else {
+    let name = execSync('git show -s --format=%cn').toString().trim(); //姓名
+    let email = execSync('git show -s --format=%ce').toString().trim(); //邮箱
+    let date = new Date(execSync('git show -s --format=%cd').toString()); //日期
+    let message = execSync('git show -s --format=%s').toString().trim(); //说明
+    versionStr = `git:${commit}\n作者:${name}<${email}>\n日期:${date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes()}\n说明:${message}\n${new Array(80).join('*')}\n${versionStr}`;
+    fs.writeFileSync(versionPath, versionStr);
+    // 写入版本信息之后,自动将版本信息提交到当前分支的git上
+    if (autoPush) {
+        execSync(`git commit ${versionPath} -m "${autoText}"`);
+        execSync(`git push origin ${execSync('git rev-parse --abbrev-ref HEAD').toString().trim()}`);
+    }
+}
+
+// 将version文件移植到打包文件中
+if (fs.existsSync(buildPath)) {
+    fs.writeFileSync(`${buildPath}/${versionPath}`, fs.readFileSync(versionPath));
+}
+
+// 程序执行结束
+console.info('\x1B[32m%s\x1b[0m', [
+    "██████╗ ███████╗██████╗ ███████╗ █████╗  ██████╗██╗   ██╗",
+    "██╔══██╗██╔════╝██╔══██╗██╔════╝██╔══██╗██╔════╝╚██╗ ██╔╝",
+    "██████╔╝█████╗  ██████╔╝███████╗███████║██║  ███╗╚████╔╝ ",
+    "██╔═══╝ ██╔══╝  ██╔══██╗╚════██║██╔══██║██║   ██║ ╚██╔╝  ",
+    "██║     ███████╗██║  ██║███████║██║  ██║╚██████╔╝  ██║   ",
+    "╚═╝     ╚══════╝╚═╝  ╚═╝╚══════╝╚═╝  ╚═╝ ╚═════╝   ╚═╝   ",
+].join('\n'));

+ 6 - 0
version.txt

@@ -0,0 +1,6 @@
+git:128bffa840a577522a86efb00c16d155884dc794
+作者:yunxing<yunxing0102@163.com>
+日期:2020-9-8 16:1
+说明:init
+*******************************************************************************
+

+ 88 - 0
vue.config.js

@@ -0,0 +1,88 @@
+// gzip 压缩代码
+const CompressionPlugin = require('compression-webpack-plugin')
+// 打包分析
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
+// terser-webpack-plugin 可不引入, @vue/cli-service 中已经引入了terser-webpack-plugin
+// const TerserPlugin = require('terser-webpack-plugin')
+module.exports = {
+    devServer: {
+        port: 8092,
+        proxy: {
+            '/data': {
+                // target: 'http://10.199.143.126', //生产环境
+                target: 'http://60.205.177.43', //阿里云
+                changeOrigin: true,
+                secure: false,
+                pathRewrite: {
+                    '^/data': '/data',
+                },
+            },
+            // 绘图服务
+            '/serve': {
+                //    target: 'http://10.199.143.129:8080', //生产环境
+                target: 'http://60.205.177.43:8080', //阿里云
+                changeOrigin: true,
+                pathRewrite: {
+                    '^/serve': '',
+                },
+            },
+        },
+        hot: true,
+        // 关闭esline
+        overlay: {
+            warnings: false,
+            errors: false,
+        },
+    },
+    chainWebpack: (config) => {
+        const svgRule = config.module.rule('svg')
+        svgRule.uses.clear()
+        svgRule
+            .use('babel-loader')
+            .loader('babel-loader')
+            .end()
+            .use('vue-svg-loader')
+            .loader('vue-svg-loader')
+        config.output.filename('static/js/[name].[hash].js').end()
+        config.output.chunkFilename('static/js/[name].[hash].js').end()
+    },
+    lintOnSave: false,
+    publicPath: '/wandaBmGuideH5',
+    // 打包名称
+    outputDir: 'wandaBmGuideH5',
+    // 放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录
+    assetsDir: 'static',
+    transpileDependencies: [
+        '@saga-web', // 指定对第三方依赖包进行babel-polyfill处理
+    ],
+    productionSourceMap: false,
+    // CSS 相关选项
+    css: {
+        // 将组件内的 CSS 提取到一个单独的 CSS 文件 (只用在生产环境中)
+        extract: true,
+    },
+    // 配置webpack
+    configureWebpack: (config) => {
+        // 生成环境,删除console.log和debugger
+        if (process.env.NODE_ENV === 'production') {
+            config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true //删除console
+            config.optimization.minimizer[0].options.terserOptions.compress.drop_debugger = true //删除 debugger
+            config.optimization.minimizer[0].options.terserOptions.compress.pure_funcs = ['console.log'] //删除
+        }
+        let plugins = [
+            // 压缩代码
+            new CompressionPlugin({
+                test: /\.js$|\.html$|\.css$/, // 匹配文件名
+                threshold: 10240, // 对超过10k的数据压缩
+                deleteOriginalAssets: false, // false 不删除源文件 true 删除源文件
+            }),
+        ]
+        // 生产环境打包分析体积 命令 npm run  build --report 或者 yarn build --report
+        if (process.env.NODE_ENV === 'production' && (process.env.npm_config_report || process.env.npm_config_argv.indexOf('--report') !== -1)) {
+            plugins.push(new BundleAnalyzerPlugin())
+        }
+        return {
+            plugins,
+        }
+    },
+}

Файловите разлики са ограничени, защото са твърде много
+ 398 - 197
yarn.lock