监视页面及监视页面显示完成

package.json

@@ -22,7 +22,7 @@
     "escape-string-regexp": "^2.0.0",
     "execa": "^3.2.0",
     "isexe": "^2.0.0",
-    "json-bigint": "D:\\Gyee_Work_Project\\MyGit\\wisdom_water_ui_zs\\ZhangShan_VueProject>\"C:\\Program Files\\nodejs\\\\node.exe\"  \"C:\\Program Files\\nodejs\\\\node_modules\\npm\\bin\\npm-cli.js\" config get save-prefix \r\n^1.0.0",
+    "json-bigint": "^1.0.0",
     "less": "^3.10.3",
     "less-loader": "^5.0.0",
     "mimic-fn": "^3.0.0",
@@ -38,8 +38,8 @@
     "vue-runtime-helpers": "^1.1.2",
     "vuex": "^3.0.1",
     "wrappy": "^1.0.2",
-    "yallist": "^4.0.0",
-    "xlsx": "^0.15.4"
+    "xlsx": "^0.15.4",
+    "yallist": "^4.0.0"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^4.5.3",

src/api/api.js

@@ -1,53 +0,0 @@
-/**
- * 所有模块接口列表
- */
-import axios from '../request/http' // 导入http中创建的axios实例
-
-//设置接口地址
-axios.defaults.baseURL = process.env.VUE_APP_BASEURL
-
-//系统模快
-const systemModule = {
-    //登录
-    login (params) {
-        return axios.post("login", params)
-    },
-    //商品管理
-    goodsManage: {
-        //列表新增
-        add (params) {
-            return axios.post("add", params)
-        },
-        edit (params) {
-            return axios.post("edit", params)
-        },
-        //列表、查询
-        getList (params) {
-            return axios.post("goodList", params)
-        },
-        //通过id获取数据
-        getDataById (params) {
-            return axios.post("getDataById", params)
-        },
-        //批量删除
-        getDataById (params) {
-            return axios.post("batchEdit", params)
-        }
-    },
-	//上传图片、文件pdf、word、excel（如果一个接口能支持）
-    uploadFile(params, config) {
-        return axios.post('uploadFile', params, config)
-    },
-    //上传（excel）
-    batchImport(params, config) {
-        return axios.post('batchImport', params, config)
-    },
-	//获取下拉仓库
-	getStorehouseName(params) {
-		return axios.post("getStorehouseName", params)
-	}
-}
-//导出接口
-export default {
-    systemModule
-}

src/api/requestAPI.js

@@ -1,117 +0,0 @@
-import request from './request';
-import Axios from 'axios';
-import JSONbig from 'json-bigint';
-
-//const URL = '/api/';
-const URL =process.env.VUE_APP_BASE_URL || '/wisdom-water/';
-//******************************用户接口************************************//
-export const loginRequest = objData => {
-    return Axios.post(URL + "sys/login", objData);
-};
-export const registerUserRequest = objData => {
-    return Axios.post(URL + "user/register", objData);
-};
-export const editUserRequest = objData => {
-    return Axios.post(URL + "user/edit", objData);
-};
-
-export const getAllUserRequest = objData => {
-    return Axios.post(URL + "user/get", objData, {
-        headers: {
-            'content-type': 'application/json',
-            'token': objData.token
-        }
-    });
-
-};
-export const resetUserRequest = objData => {
-
-    return Axios.post(URL + "/user/reset", objData, {
-        headers: {
-            'content-type': 'application/json',
-            'token': objData.token
-        }
-    });
-};
-
-
-//******************************end****************************************//
-
-
-//******************************公用接口************************************//
-
-//根据场站编号，风机型号获取AI测点
-export const fetchAIPointList = (stationId, modelId) => {
-    return request({
-        url: URL + 'info/testing_point_ai',
-        method: 'get',
-        params: {
-            stationId: stationId,
-            modelId: modelId
-        }
-    });
-};
-//根据场站编号，风机型号获取DI测点
-export const fetchDIPointList = (stationId, modelId) => {
-    return request({
-        url: URL + 'info/testing_point_di',
-        method: 'get',
-        params: {
-            stationId: stationId,
-            modelId: modelId
-        }
-    });
-};
-//根据场站编号，获取电气DI测点
-export const fetchElectricDIPointList = (stationId) => {
-    return request({
-        url: URL + 'info/electrical_point_di',
-        method: 'get',
-        params: {
-            stationId: stationId
-        }
-    });
-};
-//根据电气测点，获取测点信息
-export const fetchElectricDIPointByPointId = (pointId) => {
-    return request({
-        url: URL + 'info/electrical_point_di/byId',
-        method: 'get',
-        params: {
-            pointId: pointId
-        }
-    });
-};
-
-
-//******************************end****************************************//
-
-
-//******************************自定义报警API************************************//
-export const alert_rule_fetchTableData = query => {
-    let data =
-        request({
-            url: URL + 'rule/list',
-            method: 'get',
-            params: query,
-            headers: {
-                'content-type': 'application/json',
-                'token': localStorage.getItem('token')
-            },
-            timeout: 3000,
-        });
-    return data;
-};
-
-
-export const alert_rule_postSave = form => {
-    return Axios.post(URL + "alertrule2/save", form, {
-        headers: {
-            'content-type': 'application/json',
-            'token': sessionStorage.getItem('token')
-        }
-    })
-};
-
-
-//******************************end*******************************************//

src/components/AdminHeader copy.vue

@@ -0,0 +1,108 @@
+<template>
+  <section class="header">
+    <div>
+      <el-menu
+        text-color="#ffffff"
+        :default-active="activeIndex"
+        mode="horizontal"
+      >
+        <el-submenu index="1">
+          <template slot="title">
+            <div class="logo">
+              <img src="@/assets/images/logo.png" alt />
+              <span>漳山智慧水务系统</span>
+            </div>
+          </template>
+
+          <el-submenu>
+            <template slot="title">监视页面</template>
+            <el-submenu
+              :index="'1_'+pathIndex"
+              v-for="(pathObj, pathIndex) in pathsummury"
+              :key="pathObj.name+pathIndex"
+            >
+              <template slot="title">{{pathObj.name}}</template>
+              <label v-for="(pageitem, pageindex) in pathObj.page" :key="pageindex">
+                <el-menu-item
+                  :index="'1_'+pathIndex+'_'+pageindex"
+                  @click="toViewer(pathObj.path+pageitem.path)"
+                >{{pageitem.name}}</el-menu-item>
+              </label>
+            </el-submenu>
+          </el-submenu>
+        </el-submenu>
+      </el-menu>
+
+
+    </div>
+
+    <div class="nav-button">
+      <i>Admin</i>
+      <span @click="logout" class="pad-10">
+        <i class="el-icon-switch-button"></i> 退出
+      </span>
+    </div>
+  </section>
+</template>
+
+<script>
+
+import pathsummery from '../static/json/pathsunmmery.json'
+
+export default {
+  name: 'adminHeader',
+  data()
+  {
+    return {
+      levelList: null,//路由列表,
+      pathsummury: pathsummery
+    }
+  },
+
+  methods: {
+    //退出登录
+    logout()
+    {
+      //定义token退出值
+      localStorage.removeItem("token") //清除token
+      this.$router.push("/")
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.header {
+  position: fixed;
+  left: 0;
+  top: 0;
+  z-index: 100;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  height: 60px;
+  padding: 0 20px;
+  box-sizing: border-box;
+  background-color: #202c3a;
+  color: #fff;
+
+  .el-menu-panel {
+    overflow: hidden;
+  }
+
+  .logo {
+    display: inline-block;
+    vertical-align: middle;
+    img {
+      width: 30px;
+      vertical-align: inherit;
+    }
+  }
+  .nav-button {
+    float: right;
+    span {
+      cursor: pointer;
+    }
+  }
+}
+</style>

src/components/AdminHeader.vue

@@ -1,64 +1,147 @@
 <template>
-  <section class="header">
-    <div class="logo">
-      <img src="@/assets/images/logo.png"
-           alt="">
-      <span>智慧水务系统</span>
-    </div>
-    <div class="nav-button">
-	  <!-- <a href="https://github.com/parchments/vue-admin-template" target="_blank" style="color: #fff;" class="pad-10">
-		  <i class="el-icon-star-off"></i> gitHub
-	  </a> -->
-      <i >Admin</i>
-      <span @click="logout"
-            class="pad-10">
-        <i class="el-icon-switch-button"></i> 退出
-      </span>
+  <div>
+    <el-menu
+      :default-active="$route.fullPath"
+      class="el-menu-demo"
+      mode="horizontal"
+      @select="0"
+      router
+      background-color="#545c64"
+      text-color="#fff"
+      active-text-color="#ffd04b"
+      menu-trigger="click"
+    >
+      <el-submenu index="1">
+        <template slot="title">智慧水务系统</template>
+        <el-submenu index="1_1">
+          <template slot="title">监视页面</template>
+          <el-submenu v-for="(v,kindex) in $store.state.pathSummary" :index="'1_1'+kindex" :key="v.name">
+            <template slot="title">{{v.name}}</template>
+            <label v-for="(vp,vpindex) in v.page" :key="v.name+'_'+vp.name">
+              <el-menu-item
+                :index="'1_1'+kindex+'_'+vpindex"
+                @click="RouteJump(v.path+vp.path)"
+              >{{vp.name}}</el-menu-item>
+            </label>
+          </el-submenu>
+        </el-submenu>
+        <template v-for="(item, index) in $router.options.routes">
+          <template>
+            <el-submenu v-if="item.children && !item.hidden" :key="index" :index="index + ''">
+              <template slot="title">{{ item.meta.title }}</template>
+              <div v-for="(child, index) in item.children" :index="child.path" :key="child.path">
+                <template v-if="child.children">
+                  <el-submenu :index="index + ''">
+                    <template slot="title">{{ child.meta.title }}</template>
+                    <el-menu-item
+                      v-for="grandson in child.children"
+                      :index="`${grandson.path}`"
+                      :key="grandson.path"
+                    >{{ grandson.meta.title }}</el-menu-item>
+                  </el-submenu>
+                </template>
+                <el-menu-item
+                  :index="`${child.path}`"
+                  :key="child.path"
+                  v-if="!child.children && !child.hidden"
+                >{{ child.meta.title }}</el-menu-item>
+              </div>
+            </el-submenu>
+
+            <el-menu-item
+              v-if="!item.children && !item.hidden"
+              :key="index"
+              :index="item.path"
+            >{{ item.meta.title }}</el-menu-item>
+          </template>
+        </template>
+      </el-submenu>
+    </el-menu>
+    <div class="headRight">
+      <div class="pad-10">
+        <i
+          :class="!isLock ? 'el-icon-unlock':'el-icon-lock'"
+          @click="viewLock(isLock ? 1 : 2);isLock=!isLock"
+        >锁定监视页面</i>
+      </div>
+      <el-divider direction="vertical"></el-divider>
+      <div>
+        <i>{{userName}}</i>
+        <span @click="logout" class="pad-10">
+          <i class="el-icon-switch-button">退出</i>
+        </span>
+      </div>
     </div>
-  </section>
+  </div>
 </template>
 
 <script>
+
+import { monitor } from '../network/network'
+import { Store } from "le5le-store";
+import p from "../static/json/pathsunmmary.json"
+
 export default {
   name: 'adminHeader',
+  data()
+  {
+    return {
+      userName: localStorage.getItem("ms_username"),
+      isLock: true, // 监视页面的控件是否锁定
+    }
+  },
+  created()
+  {
+    monitor.getJsonFile();
+    window.sum = p;
+  },
   methods: {
+    handleSelect() { },
+    viewLock(tag)
+    {
+      Store.set('viewLock', tag)
+    },
+    RouteJump(path)
+    {
+      this.$emit("toViewer", path);
+    },
     //退出登录
-    logout () {
+    logout()
+    {
       //定义token退出值
       localStorage.removeItem("token") //清除token
       this.$router.push("/")
     }
-  }
+  },
 }
 </script>
 <style lang="less" scoped>
+i:hover {
+  color: rgb(255, 208, 75);
+}
 .header {
   position: fixed;
   left: 0;
   top: 0;
-  z-index: 100;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
   width: 100%;
-  height: 60px;
   padding: 0 20px;
-  box-sizing: border-box;
-  background-color: #202c3a;
-  color: #fff;
-  .logo {
-    display: inline-block;
-    vertical-align: middle;
-    img {
-      width: 30px;
-      vertical-align: inherit;
-    }
-  }
-  .nav-button {
-    float: right;
-    span {
-      cursor: pointer;
-    }
-  }
+}
+.headRight {
+  color: #ffffff;
+  padding-right: 10px;
+  //width: 63px;
+  height: 63px;
+  position: fixed;
+  top: 0;
+  right: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>
+<style lang="css">
+.el-menu {
+  position: initial !important;
+  overflow: hidden !important;
 }
 </style>

src/components/filepropertys.vue

@@ -1,15 +1,25 @@
 <template>
-  <div  class="filemain">
+  <div class="filemain">
     <el-tabs @tab-click="tabClick" type="card">
       <div class="filemainbar">
         <div class="row-item">
+          <span>所属环节</span>
+          <el-select v-model="page.belong" @focus="OnFocusPageBelong" placeholder="所属环节">
+            <el-option
+              v-for="(v,k) in $store.state.pathSummary"
+              :key="k"
+              :label="k"
+              :value="v.name"
+            ></el-option>
+          </el-select>
+        </div>
+        <div class="row-item">
           <span>页面路径</span>
-          <el-input size="mini" value placeholder="/" v-model="page.path" ></el-input>
-          <!-- @focus="centerDialogVisible = true" -->
+          <el-input size="mini" value placeholder="/name.json" v-model="page.path"></el-input>
         </div>
         <div class="row-item">
           <span>页面名称</span>
-          <el-input size="mini" value placeholder="页面名称" v-model="page.name" ></el-input>
+          <el-input size="mini" value placeholder="页面名称" v-model="page.name"></el-input>
         </div>
         <div class="row-item">
           <span style="width: 23%;">元素默认颜色</span>
@@ -55,40 +65,12 @@
           <li>Ctrl + 鼠标滚轮：缩放</li>
         </ul>
       </div>
-
-      <!--
-          <el-tab-pane label=" 外观" name="A">
-    </el-tab-pane>
-
-    <el-tab-pane label="动效" name="B">
-      <div class="disflex"></div>
-    </el-tab-pane>
-    <el-tab-pane label="数据" name="C">
-      <div class="disflex"></div>
-    </el-tab-pane>
-
-
-
-        <el-dialog
-      title="提示"
-      :visible.sync="centerDialogVisible"
-      append-to-body="true"
-      width="80%"
-      center
-    >
-      <treepath />
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="centerDialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
-      </span>
-    </el-dialog>
-      -->
     </el-tabs>
   </div>
 </template>
 
 <style lang="css" scoped>
-.filemain{
+.filemain {
   width: 100%;
   display: flex;
   box-sizing: border-box;
@@ -127,6 +109,8 @@
 
 <script>
 import treepath from './treepath'
+import { monitor } from '@/network/network'
+
 export default {
   props: ["canvas", "page"],
   data()  
@@ -141,11 +125,25 @@ export default {
   components: {
     treepath
   },
+  created()
+  {
+    if (Object.keys(this.$store.state.pathSummary) == 0) {
+      monitor.getJsonFile();
+      console.log('loading');
+    }
+  },
   methods: {
     tabClick()
     {
       console.log("tabclick");
     },
+    OnFocusPageBelong()
+    {
+      if (Object.keys(this.$store.state.pathSummary) == 0) {
+        monitor.getJsonFile();
+      }
+    },
+
     setPaintColor(paintColor)
     {
       this.$store.dispatch('setPaintColor', paintColor);
@@ -160,7 +158,7 @@ export default {
     },
     showGrid(value)
     {
-      console.log( this.page)
+      console.log(this.page)
       console.log(this.isShowGrid)
       //this.$emit("onMessage", 'showGrid', value);
     },

src/components/head.vue

@@ -134,19 +134,21 @@
     </el-menu>
   </div>
 </template>
-<style lang="css">
-.el-color-picker__trigger {
+<style lang="css" scoped>
+.el-menu-item {
+  background: #545c64 !important;
+}
+>>>.el-color-picker__trigger {
   padding: 0 !important;
   border: 0px !important;
 }
-.el-color-picker__icon {
+>>>.el-color-picker__icon {
   display: none !important;
 }
-.el-color-picker__empty {
+>>>.el-color-picker__empty {
   display: none !important;
 }
-</style>
-<style scope>
+
 .menuright {
   display: flex;
   flex: 1;

src/components/nodepropertys.vue

@@ -865,7 +865,7 @@ export default {
 </script>
 
 
-<style lang="css">
+<style lang="css" scoped>
 .flex_nowarp .el-color-picker__trigger {
   height: 24px !important;
   width: 24px !important;

src/components/pens.vue

@@ -17,7 +17,7 @@
   </div>
 </template>
 
-<style>
+<style scoped>
 .el-collapse-item__content {
   display: flex;
   flex-wrap: wrap;
@@ -36,7 +36,7 @@
 </style>
 <script>
 import { CanvasTools, canvasRegister } from '../assets/js/canvas'
-import hackjson from '../assets/css/hack.json'
+//import hackjson from '../assets/css/hack.json'
 
 export default {
   data()
@@ -45,7 +45,7 @@ export default {
       tools: CanvasTools,
       isToolCollapse: true,
       isCollapse: true,
-      hacktools: hackjson,
+      //hacktools: hackjson,
     };
   },
   methods: {
@@ -78,7 +78,7 @@ export default {
   },
   mounted()
   {
-    console.log(hackjson);
+    //console.log(hackjson);
 
   }
 };

src/network/network.js

@@ -1,45 +1,251 @@
+import netapi from './netapi';
+import Axios from 'axios';
+import JSONbig from 'json-bigint';
 import { projectconfig } from "../static/projectconfig"
-import { Store } from 'le5le-store'
-
-
-
-export const network = {
-
-	/*** 加载Json文件 */
-	async getJsonFile(axios, filepath)
-	{
-		console.log(filepath)
-		axios.get(filepath)
-			.then(res =>
-			{
-				return res.data;
-			})
-			.catch(error =>
-			{
-				//console.log("searchWarningList 异常:" + error);
-			});
-	},
+import store from '../store/index'
+import { Store } from 'le5le-store';
+
+//const URL = '/api/';
+const URL = process.env.VUE_APP_BASE_URL || '/wisdom-water/';
+//******************************用户接口************************************//
+export const loginRequest = objData =>
+{
+    return Axios.post(URL + "sys/login", objData);
+};
+export const registerUserRequest = objData =>
+{
+    return Axios.post(URL + "user/register", objData);
+};
+export const editUserRequest = objData =>
+{
+    return Axios.post(URL + "user/edit", objData);
+};
+
+export const getAllUserRequest = objData =>
+{
+    return Axios.post(URL + "user/get", objData, {
+        headers: {
+            'content-type': 'application/json',
+            'token': objData.token
+        }
+    });
+
+};
+export const resetUserRequest = objData =>
+{
+
+    return Axios.post(URL + "/user/reset", objData, {
+        headers: {
+            'content-type': 'application/json',
+            'token': objData.token
+        }
+    });
+};
+
+
+//******************************end****************************************//
+
+
+//******************************公用接口************************************//
+
+//根据场站编号，风机型号获取AI测点
+export const fetchAIPointList = (stationId, modelId) =>
+{
+    return netapi({
+        url: URL + 'info/testing_point_ai',
+        method: 'get',
+        params: {
+            stationId: stationId,
+            modelId: modelId
+        },
+        headers: {
+            'content-type': 'application/json',
+            'token': localStorage.getItem('token')
+        },
+    });
+};
+//根据场站编号，风机型号获取DI测点
+export const fetchDIPointList = (stationId, modelId) =>
+{
+    return netapi({
+        url: URL + 'info/testing_point_di',
+        method: 'get',
+        params: {
+            stationId: stationId,
+            modelId: modelId
+        },
+        headers: {
+            'content-type': 'application/json',
+            'token': localStorage.getItem('token')
+        },
+    });
+};
+//根据场站编号，获取电气DI测点
+export const fetchElectricDIPointList = (stationId) =>
+{
+    return netapi({
+        url: URL + 'info/electrical_point_di',
+        method: 'get',
+        params: {
+            stationId: stationId
+        }
+    });
+};
+//根据电气测点，获取测点信息
+export const fetchElectricDIPointByPointId = (pointId) =>
+{
+    return netapi({
+        url: URL + 'info/electrical_point_di/byId',
+        method: 'get',
+        params: {
+            pointId: pointId
+        }
+    });
+};
+
+
+//******************************end****************************************//
+
+
+//******************************自定义报警API************************************//
+export const alert_rule_fetchTableData = query =>
+{
+    let data =
+        netapi({
+            url: URL + 'rule/list',
+            method: 'get',
+            params: query,
+            headers: {
+                'content-type': 'application/json',
+                'token': localStorage.getItem('token')
+            },
+            timeout: 3000,
+        });
+    return data;
+};
+
+
+export const alert_rule_postSave = form =>
+{
+    return Axios.post(URL + "alertrule2/save", form, {
+        headers: {
+            'content-type': 'application/json',
+            'token': sessionStorage.getItem('token')
+        }
+    })
+};
+
+
+//******************************end*******************************************//
+
+
+//#region  监视页面相关
+export const monitor = {
+
+    /*** 加载头文件导航中的监视页面的结构Json文件 */
+    async getJsonFile()
+    {
+        await Axios.get
+            (
+                projectconfig.restful.host + projectconfig.restful.watcher,
+                {
+                    params:
+                    {
+                        keys: '/'
+                    },
+                    headers: {
+                        'content-type': 'application/json',
+                        'token': localStorage.getItem('token')
+                    }
+                }
+            )
+            .then(res =>
+            {
+                if (res.data && res.data.success && res.data.success == true && res.data.data && res.data.data.pagejson) {
+
+                    var x = JSON.parse(res.data.data.pagejson);
+                    store.dispatch('setPathSummary', x)
+                }
+            })
+            .catch(error =>
+            {
+                console.log("getJsonFile 异常:" + error);
+            });
+
+    },
+    async getJsonFileBy(path, callBack)
+    {
+        await Axios.get
+            (
+                projectconfig.restful.host + projectconfig.restful.watcher,
+                {
+                    params:
+                    {
+                        keys: path
+                    },
+                    headers: {
+                        'content-type': 'application/json',
+                        'token': localStorage.getItem('token')
+                    }
+                }
+            )
+            .then(res => callBack(res))
+            .catch(error =>
+            {
+                console.log("getJsonFileBy 异常:" + error);
+            });
+
+    },
+    async setJsonFile(monitorJson, backCall)
+    {
+        await Axios.post
+            (
+                projectconfig.restful.host + projectconfig.restful.postjson,
+                monitorJson,
+                {
+                    headers: {
+                        'content-type': 'application/json',
+                        'token': localStorage.getItem('token')
+                    }
+                }
+            ).then(res =>
+            {
+                if (backCall) {
+                    backCall(res);
+                }
+                else {
+                    //console.log(res.data)
+                }
+            }).catch(error =>
+            {
+                console.log("setJsonFile 异常:" + error);
+                databack = error;
+            });
+    },
 	/**
 	 * 根据标签点名查询对应的数据
-	 * @param {*} axios this.$axios
 	 * @param {*} tagNameArray []
 	 */
-	getTagValues(axios, tagNameArray)
-	{
-		axios.get(projectconfig.restful.host + projectconfig.restful.searchTagValues,
-			{
-				params:
-				{
-					keys: tagNameArray.join(',')
-				}
-			}
-		).then(res =>
-		{
-			Store.set('wxwData', res.data);
-		}).catch(error =>
-		{
-			//console.log("getTagValues 异常:" + error);
-		});
-	}
-
-}
+    getTagValues(tagNameArray)
+    {
+        Axios.get
+            (
+                projectconfig.restful.host + projectconfig.restful.searchTagValues,
+                {
+                    params:
+                    {
+                        keys: tagNameArray.join(',')
+                    }
+                }
+            ).then(res =>
+            {
+                Store.set('wxwData', res.data);
+            }).catch(error =>
+            {
+                //console.log("getTagValues 异常:" + error);
+            });
+    }
+
+}
+
+//#endregion

src/router/index.js

@@ -3,7 +3,8 @@ import VueRouter from "vue-router";
 import Home from "../views/Home.vue";
 Vue.use(VueRouter);
 
-const routes = [{
+const routes = [
+    {
         path: "/", //默认路由
         redirect: "/login",
         hidden: true,
@@ -24,7 +25,8 @@ const routes = [{
             keepAlive: false,
             level: 0
         }
-    }, {
+    },
+    {
         path: "*", //输错路由回首页
         redirect: "/404",
         hidden: true,
@@ -51,96 +53,90 @@ const routes = [{
         name: "alarmList",
         component: Home,
         redirect: '/alarmList',
-        hidden: false,
+        hidden: true,
         meta: {
             title: "报警信息",
             keepAlive: false,
             level: 0
         },
-        children: [{
-            path: "/goods/goodsList",
-            component: () => import("../views/goods/goodsList.vue"),
-            name: "goodsList",
-            hidden: false,
-            meta: {
-                title: "报警列表",
-                keepAlive: false,
-                level: 0
-            }
-        }, ]
+        children: []
     },
     {
-        path: "/config",
-        name: "config",
+        path: "/home/viewer",
+        name: "homeviewer",
         component: Home,
-     
-        hidden: false,
+        hidden: true,
         meta: {
-            title: "配置功能",
-            keepAlive: false,
+            title: "监视页面",
+            keepAlive: true,
             level: 0
         },
-        children: [{
-                path: "/config/rule/list",
-                component: () => import("../views/rule/list.vue"),
-                name: "ruleList",
-                hidden: false,
-                meta: {
-                    title: "报警配置",
-                    keepAlive: false,
-                    level: 0
-                }
-            },
+        children: [
             {
-                path: "/config/pointList",
-                component: () => import("../views/goods/goodsList.vue"),
-                name: "testPointList",
+                path: "/home/viewer",
+                component: () => import("../views/xDesigner/viewer.vue"),
+                name: "watchView",
                 hidden: false,
                 meta: {
-                    title: "测点配置",
+                    title: "监视页面",
                     keepAlive: false,
                     level: 0
                 }
-            },
-            {
-                path: "/config/userList",
-                component: () => import("../views/goods/goodsList.vue"),
-                name: "testPointList",
-                hidden: false,
-                meta: {
-                    title: "用户管理",
-                    keepAlive: false,
-                    level: 0
-                }
-            },
+            }
         ]
-    },
-
-
-    //监视容器路由
-    {
-        path: '/Viewer',
-        component: () => import('../views/xDesigner/viewer.vue'),
-        hidden: true,
-    },
-
+    }
+    ,
     {
-        hidden: true,
-        path: '/XDesigner',
-        name: '组态设计器',
+        path: "/config",
+        name: "config",
+        component: Home,
+        hidden: false,
         meta: {
-            title: "XDesigner",
+            title: "报警页面",
             keepAlive: false,
-            level: 0 //判断是否缓存 0为不缓存 1为缓存 2为详情页
+            level: 0
         },
-        component: () => import("../views/xDesigner/xdesigner.vue")
+        children: [{
+            path: "/config/rule/list",
+            component: () => import("../views/rule/list.vue"),
+            name: "ruleList",
+            hidden: false,
+            meta: {
+                title: "报警配置",
+                keepAlive: false,
+                level: 0
+            }
+        },
+        ]
     },
 
     {
-        path: '/AppDesign',
-        component: () => import('../views/xDesigner/AppDesign.vue'),
-        hidden: true,
+        path: "/AppDesign",
+        name: "组态设计",        
+        hidden: false,
+        meta: {
+            title: "组态设计器",
+            keepAlive: false,
+            level: 0
+        },
+        component: () => import("../views/xDesigner/AppDesign.vue"),
     },
+    // {
+    //     hidden: true,
+    //     path: '/XDesigner',
+    //     name: '组态设计器',
+    //     meta: {
+    //         title: "XDesigner",
+    //         keepAlive: false,
+    //         level: 0 //判断是否缓存 0为不缓存 1为缓存 2为详情页
+    //     },
+    //     component: () => import("../views/xDesigner/xdesigner.vue")
+    // },
+    // {
+    //     path: '/AppDesign',
+    //     component: () => import('../views/xDesigner/AppDesign.vue'),
+    //     hidden: true,
+    // },
 ]
 
 const router = new VueRouter({
@@ -150,13 +146,13 @@ const router = new VueRouter({
 });
 
 // 全局路由守卫、路由拦截
-// router.beforeEach((to, from, next) => {
-//     const isLogin = localStorage.token ? true : false;
-//     if (to.path === "/login" || to.path === "/forgotPassword") {
-//         next();
-//     } else {
-//         isLogin ? next() : next("/");
-//     }
-// });
+router.beforeEach((to, from, next) => {
+    const isLogin = localStorage.token ? true : false;
+    if (to.path === "/login" || to.path === "/forgotPassword") {
+        next();
+    } else {
+        isLogin ? next() : next("/");
+    }
+});
 
 export default router;

src/static/json/pathsunmmery.json

@@ -1,30 +1,35 @@
-[
-    {
+{
+    "预处理系统": {
         "name": "预处理系统",
         "path": "/yuchuli",
-        "page": [
-            {
+        "page": {
+            "沉淀系统": {
                 "name": "沉淀系统",
                 "path": "/chengdian.json"
             },
-            {
+            "污泥处理系统": {
                 "name": "污泥处理系统",
                 "path": "/wunichulixitong.json"
             }
-        ]
+        }
     },
-    {
+    "苏伊士浓缩减量": {
+        "name": "苏伊士浓缩减量",
+        "path": "/nongsuoliang",
+        "page": {}
+    },
+    "GE干燥系统": {
         "name": "GE干燥系统",
         "path": "/geganzao",
-        "page": [
-            {
+        "page": {
+            "末端干燥-废水系统": {
                 "name": "末端干燥-废水系统",
                 "path": "/moduanganzao.json"
             },
-            {
+            "末端干燥-双流体雾化系统": {
                 "name": "末端干燥-双流体雾化系统",
                 "path": "/moduanshuangliutiwuhua.json"
             }
-        ]
+        }
     }
-]
+}

src/static/projectconfig.js

@@ -3,7 +3,9 @@ export const projectconfig =
     
     // 跨域问题使用vue.config.js
     restful: {
-        host:'http://192.168.0.238:8033',// /restfull
+        host: '/wisdom-water',//'http://127.0.0.1:8033',// /restfull
         searchTagValues: '/ts/latest',
+        watcher:'/monitor/list',
+        postjson:'/monitor/jsonfile'
     }
 }

src/store/index.js

@@ -5,8 +5,8 @@ Vue.use(Vuex)
 
 export default new Vuex.Store({
     state: {
-        token: ''//token
-        ,
+        token: '',//token
+        pathSummary:{},//
         event:
         {
             name: '',
@@ -316,6 +316,10 @@ export default new Vuex.Store({
         {
             state.event = event
         },
+        setPathSummary(state,pathSummary)
+        {
+            state.pathSummary=pathSummary;
+        },
 
         //#region  设计器默认的配置
         setLineStyleName(state, lineStyleName)
@@ -354,6 +358,10 @@ export default new Vuex.Store({
         {
             commit('setToken', token)
         },
+        setPathSummary(context,pathSummary)
+        {
+            context.commit("setPathSummary", pathSummary);
+        },
         //#region 设计器默认的配置
         setLineStyleName(context, lineStyleName)
         {

src/views/Home.vue

@@ -1,95 +1,10 @@
 <template>
   <section class="layout-container">
-    <admin-header></admin-header>
+    <admin-header @toViewer="toViewer"></admin-header>
     <section class="layout-container">
-      <el-aside class="aside">
-        <el-menu
-          :default-active="$route.fullPath"
-          :unique-opened="true"
-          router
-          element-loading-text="拼命加载中"
-          element-loading-spinner="el-icon-loading"
-          element-loading-background="#304156"
-        >
-          <el-submenu index="1">
-            <template slot="title">监视</template>
-            <el-submenu
-              :index="'1_'+pathIndex"
-              v-for="(pathObj, pathIndex) in pathsummury"
-              :key="pathObj.name+pathIndex"
-            >
-              <template slot="title">{{pathObj.name}}</template>
-              <label v-for="(pageitem, pageindex) in pathObj.page" :key="pageindex">
-                <el-menu-item
-                  :index="'1_'+pathIndex+'_'+pageindex"
-                  @click="toViewer(pathObj.path+pageitem.path)"
-                >{{pageitem.name}}</el-menu-item>
-              </label>
-            </el-submenu>
-          </el-submenu>
-          
-          <!-- $router.options.routes到时候可以从后台动态获取菜单 -->
-          <template v-for="(item, index) in $router.options.routes">
-            <template>
-              <el-submenu v-if="item.children && !item.hidden" :key="index" :index="index + ''">
-                <template slot="title">{{ item.meta.title }}</template>
-                <div v-for="(child, index) in item.children" :index="child.path" :key="child.path">
-                  <template v-if="child.children">
-                    <el-submenu :index="index + ''">
-                      <template slot="title">{{ child.meta.title }}</template>
-                      <el-menu-item
-                        v-for="grandson in child.children"
-                        :index="`${grandson.path}`"
-                        :key="grandson.path"
-                      >{{ grandson.meta.title }}</el-menu-item>
-                    </el-submenu>
-                  </template>
-                  <el-menu-item
-                    :index="`${child.path}`"
-                    :key="child.path"
-                    v-if="!child.children && !child.hidden"
-                  >{{ child.meta.title }}</el-menu-item>
-                </div>
-              </el-submenu>
-              <el-menu-item
-                v-if="!item.children && !item.hidden"
-                :key="index"
-                :index="item.path"
-              >{{ item.meta.title }}</el-menu-item>
-            </template>
-          </template>
-        
-        </el-menu>
-      </el-aside>
-      <el-main class="main-container">
-        <div class="pad-t-10 pad-b-30 pad-l-10">
-          <!-- 面包屑可抽成一个组件 -->
-          <el-breadcrumb separator-class="el-icon-arrow-right">
-            <el-breadcrumb-item to="/home">首页</el-breadcrumb-item>
-            <el-breadcrumb-item
-              v-for="item in levelList"
-              :key="item.path"
-              class="el-breadcrumb__inner"
-            >
-              <router-link
-                v-if="item.meta.parentPath"
-                :to="item.meta.parentPath"
-                class="set-hover-color"
-              >
-                {{item.meta.parentTitle}}
-                <i
-                  class="el-icon-arrow-right"
-                  style="margin: 0 6px;color: #C0C4CC;"
-                ></i>
-              </router-link>
-              <span else :to="item.path">{{item.meta.title}}</span>
-            </el-breadcrumb-item>
-          </el-breadcrumb>
-        </div>
-        <transition name="slide-fade">
-          <router-view></router-view>
-        </transition>
-      </el-main>
+      <transition name="slide-fade">
+        <router-view></router-view>
+      </transition>
     </section>
   </section>
 </template>
@@ -97,49 +12,47 @@
 <script>
 import AdminHeader from '@/components/AdminHeader'
 import NavMenu from '@/components/NavMenu'
-import pathsummery from '../static/json/pathsunmmery.json'
 export default {
   name: 'home',
   data()
   {
     return {
-      levelList: null,//路由列表,
-      pathsummury: pathsummery
-    }
-  },
-  created()
-  {
-    // console.log('路由', this.$router.options.routes)
-  },
-  watch: {
-    $route(to, from)
-    {
-      this.getBreadcrumb()
+      //levelList: null,//路由列表,
     }
   },
+  // created()
+  // {
+  //   // console.log('路由', this.$router.options.routes)
+  // },
+  // watch: {
+  //   $route(to, from)
+  //   {
+  //     this.getBreadcrumb()
+  //   }
+  // },
   mounted()
   {
-    this.getBreadcrumb()
+    //this.getBreadcrumb()
   },
   methods: {
     toViewer(path)
     {
-      console.log(path)
       this.$router.push({
-        path: '/Viewer/?path=' + path,
+        path: '/home/viewer?path=' + path,
       })
     },
-    /**
-     * 生成面包屑的方法
-     */
-    getBreadcrumb()
-    {
-      let matched = this.$route.matched.filter(item =>
-      {
-        return item.path !== '/home'
-      })
-      this.levelList = matched
-    }
+
+    // /**
+    //  * 生成面包屑的方法
+    //  */
+    // getBreadcrumb()
+    // {
+    //   let matched = this.$route.matched.filter(item =>
+    //   {
+    //     return item.path !== '/home'
+    //   })
+    //   this.levelList = matched
+    // }
   },
   components: {
     'admin-header': AdminHeader,
@@ -161,9 +74,9 @@ export default {
   z-index: 99;
 }
 .main-container {
-  padding-top: 80px;
-  margin-left: 200px;
-  min-width: 1300px;
+  //padding-top: 80px;
+  // margin-left: 200px;
+  width: 100%;
   height: 100%;
 }
 .set-hover-color {

src/views/HomeX.vue

@@ -0,0 +1,131 @@
+<template>
+  <section class="layout-container">
+    <admin-header></admin-header>
+    <section class="layout-container">
+     
+      <el-main class="main-container">
+      <!--
+        <div class="pad-t-10 pad-b-30 pad-l-10">
+          <!   - - 面包屑可抽成一个组件 - -     >
+          <el-breadcrumb separator-class="el-icon-arrow-right">
+            <el-breadcrumb-item to="/home">首页</el-breadcrumb-item>
+            <el-breadcrumb-item
+              v-for="item in levelList"
+              :key="item.path"
+              class="el-breadcrumb__inner"
+            >
+              <router-link
+                v-if="item.meta.parentPath"
+                :to="item.meta.parentPath"
+                class="set-hover-color"
+              >
+                {{item.meta.parentTitle}}
+                <i
+                  class="el-icon-arrow-right"
+                  style="margin: 0 6px;color: #C0C4CC;"
+                ></i>
+              </router-link>
+              <span else :to="item.path">{{item.meta.title}}</span>
+            </el-breadcrumb-item>
+          </el-breadcrumb>
+        </div>
+        -->
+        <transition name="slide-fade">
+          <router-view></router-view>
+        </transition>
+      </el-main>
+    </section>
+  </section>
+</template>
+
+<script>
+import AdminHeader from '@/components/AdminHeader'
+import NavMenu from '@/components/NavMenu'
+import pathsummery from '../static/json/pathsunmmery.json'
+export default {
+  name: 'home',
+  data()
+  {
+    return {
+      levelList: null,//路由列表,
+      pathsummury: pathsummery
+    }
+  },
+  created()
+  {
+    // console.log('路由', this.$router.options.routes)
+  },
+  watch: {
+    $route(to, from)
+    {
+      this.getBreadcrumb()
+    }
+  },
+  mounted()
+  {
+    this.getBreadcrumb()
+  },
+  methods: {
+    toViewer(path)
+    {
+      console.log(path)
+      this.$router.push({
+        path: '/home/viewer?path=' + path,
+      })
+    },
+    /**
+     * 生成面包屑的方法
+     */
+    getBreadcrumb()
+    {
+      let matched = this.$route.matched.filter(item =>
+      {
+        return item.path !== '/home'
+      })
+      this.levelList = matched
+    }
+  },
+  components: {
+    'admin-header': AdminHeader,
+    'nav-menu': NavMenu
+  }
+}
+
+</script>
+<style lang="less" scoped>
+.layout-container {
+  position: relative;
+  height: 100%;
+}
+.aside {
+  width: 200px !important;
+  position: fixed;
+  top: 60px;
+  height: 100%;
+  z-index: 99;
+}
+.main-container {
+  padding-top: 80px;
+  margin-left: 200px;
+  min-width: 1300px;
+  height: 100%;
+}
+.set-hover-color {
+  font-weight: 700 !important;
+  cursor: pointer !important;
+  &:hover {
+    color: #409eff !important;
+  }
+}
+.slide-fade-enter-active {
+  transition: all 0.2s cubic-bezier(1, 0.5, 0.8, 1);
+}
+.slide-fade-leave-active {
+  transition: all 0s ease;
+}
+.slide-fade-enter, .slide-fade-leave-to
+/* .slide-fade-leave-active for below version 2.1.8 */ {
+  transform: translateX(10px);
+  opacity: 0;
+}
+</style>

src/views/formValidation/index.vue

@@ -1,131 +0,0 @@
-<template>
-  <div style="margin-top: 30px">
-	<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
-	  <el-form-item label="动态仓库" prop="name">
-	    <el-select v-model.trim="ruleForm.name"
-				 @change="changeHandle"
-				 @focus="focusHandle"
-				 filterable
-				 placeholder="请选择仓库">
-			<el-option v-for="item in targetList"
-					   :key="item.warehouseId"
-					   :label="item.storehouseName"
-					   :value="item.storehouseName">
-			</el-option>
-		</el-select>
-	  </el-form-item>
-	  <el-form-item label="活动区域" prop="region">
-	    <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
-	      <el-option label="区域一" value="shanghai"></el-option>
-	      <el-option label="区域二" value="beijing"></el-option>
-	    </el-select>
-	  </el-form-item>
-	  <el-form-item label="即时配送" prop="delivery">
-	    <el-switch v-model="ruleForm.delivery"></el-switch>
-	  </el-form-item>
-	  <el-form-item label="活动性质" prop="type">
-	    <el-checkbox-group v-model="ruleForm.type">
-	      <el-checkbox label="美食/餐厅线上活动" name="type"></el-checkbox>
-	      <el-checkbox label="地推活动" name="type"></el-checkbox>
-	      <el-checkbox label="线下主题活动" name="type"></el-checkbox>
-	      <el-checkbox label="单纯品牌曝光" name="type"></el-checkbox>
-	    </el-checkbox-group>
-	  </el-form-item>
-	  <el-form-item label="特殊资源" prop="resource">
-	    <el-radio-group v-model="ruleForm.resource">
-	      <el-radio label="线上品牌商赞助"></el-radio>
-	      <el-radio label="线下场地免费"></el-radio>
-	    </el-radio-group>
-	  </el-form-item>
-	  <el-form-item label="活动形式" prop="desc">
-	    <el-input type="textarea" v-model="ruleForm.desc"></el-input>
-	  </el-form-item>
-	  <el-form-item>
-	    <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
-	    <el-button @click="resetForm('ruleForm')">重置</el-button>
-	  </el-form-item>
-	</el-form>
-  </div>
-</template>
-<script>
-  export default {
-	  name: 'formValidation',
-    data() {
-      return {
-		targetList: [],//获取的下拉
-        ruleForm: {
-          name: '',
-          region: '',
-          delivery: false,
-          type: [],
-          resource: '',
-          desc: ''
-        },
-        rules: {
-          name: [
-            { required: true, message: '请输入活动名称', trigger: 'blur' },
-            { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
-          ],
-          region: [
-            { required: true, message: '请选择活动区域', trigger: 'change' }
-          ],
-          type: [
-            { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
-          ],
-          resource: [
-            { required: true, message: '请选择活动资源', trigger: 'change' }
-          ],
-          desc: [
-            { required: true, message: '请填写活动形式', trigger: 'blur' }
-          ]
-        }
-      };
-    },
-    methods: {
-		//校验提交
-      submitForm(formName) {
-			this.$refs[formName].validate((valid) => {
-			  if (valid) {
-				alert('submit!');
-			  } else {
-				console.log('error submit!!');
-				return false;
-			  }
-			});
-		},
-		//重置表单
-		resetForm(formName) {
-			this.$refs[formName].resetFields();
-		},
-		//获取焦点时获取列表
-		focusHandle () {
-			return this.$message.error("请配置接口!");
-			//列表参数
-			this.$api.systemModule.getStorehouseName()
-			  .then(res => {
-				let data = res.data.data
-				if (res.data.retcode === this.SUCCESS_CODE) {
-				  this.targetList = data
-				} else {
-				  this.$message({
-					type: 'error',
-					message: res.data.retmsg
-				  })
-				}
-			  }).catch(err => {
-				console.log(err)
-			})
-		},
-		//选中下拉获取id
-		changeHandle(){
-			let obj = {}
-			//这里的targetList就是遍历的数据源
-			obj = this.targetList.find((item)=>{
-				return item.storehouseName === this.ruleForm.name//筛选出匹配数据
-			})
-			console.log("获取点击的对象",obj)
-			this.ruleForm.storehouseId = obj.storehouseId
-		}
-    }
-  }
-</script>

src/views/goods/Form.vue

@@ -1,61 +0,0 @@
-<template>
-  <section class="search-form-wrapper">
-    <el-form :inline="true">
-      <el-row :gutter="20">
-        <el-col :span="20">
-          <div class="fl">
-            <el-form-item label="拍品"
-                          class="pad-r-20">
-              <el-input placeholder="请输入拍品"
-                        v-model.trim="searchForm.name"></el-input>
-            </el-form-item>
-            <el-form-item>
-              <el-button @click="searchBtn()"
-                         type="primary"
-                         size="mini">查询</el-button>
-              <el-button @click="resetSearchBtn()"
-                         size="mini">重置</el-button>
-            </el-form-item>
-          </div>
-        </el-col>
-        <el-col :span="4"
-                class="text-right">
-          <el-button type="primary"
-                     round
-                     @click="addHandle()">添加拍品</el-button>
-        </el-col>
-      </el-row>
-    </el-form>
-  </section>
-</template>
-
-<script>
-export default {
-  props: {
-    //搜索
-    searchForm: {
-      type: Object,
-      default: Object,
-      required: true
-    }
-  },
-  methods: {
-    //查询
-    searchBtn () {
-      return this.$message({
-        type: 'error',
-        message: '请先配置接口哦'
-      })
-      this.$emit("searchBtn", this.searchForm);
-    },
-    //重置
-    resetSearchBtn () {
-      this.$emit("resetSearchBtn");
-    },
-    //添加
-    addHandle () {
-      this.$emit("addHandle");
-    }
-  }
-};
-</script>

src/views/goods/Table.vue

@@ -1,61 +0,0 @@
-<template>
-  <el-table :data="tableData"
-            @selection-change="selectionChangeHandle">
-    <el-table-column type="selection"
-                     width="100"></el-table-column>
-    <el-table-column prop="name"
-                     label="商品"></el-table-column>
-    <el-table-column prop="code"
-                     label="商品代码"></el-table-column>
-    <el-table-column prop="time"
-                     label="时间">
-		<template slot-scope="scope">
-			{{ scope.row.time | formatDate('YYYY-MM-DD HH:mm:ss')}}
-		</template>
-	 </el-table-column>
-    <el-table-column label="操作"
-                     width="200">
-      <template slot-scope="scope">
-        <el-button type="text"
-                   size="small"
-                   class="mar-r-20"
-                   @click="editHandle(scope.$index, scope.row)">编辑</el-button>
-        <el-button type="text"
-                   size="small"
-                   class="mar-r-20">
-          <router-link :to="{path: '/goods/goodsList/goodsDetail',query: {code: scope.row.code}}">详情</router-link>
-        </el-button>
-        <el-button type="text"
-                   size="small"
-                   @click="singleDeleteHandle(scope.$index, scope.row)">删除</el-button>
-      </template>
-    </el-table-column>
-  </el-table>
-</template>
-
-<script>
-export default {
-  props: {
-    //表格数据
-    tableData: {
-      type: Array,
-      default: Object,
-      required: true
-    }
-  },
-  methods: {
-    //表格全选
-    selectionChangeHandle (data) {
-      this.$emit('selectionChangeHandle', data)
-    },
-    //编辑
-    editHandle (index, row) {
-      this.$emit('editHandle', index, row)
-    },
-    //删除
-    singleDeleteHandle (index, row) {
-      this.$emit('singleDeleteHandle', index, row)
-    }
-  }
-}
-</script>

src/views/goods/components/AddedEditorDialog.vue

@@ -1,96 +0,0 @@
-<template>
-  <!--新增、编辑-->
-  <el-dialog title=""
-             :visible.sync="dialogVisible"
-             :before-close="handleCancel"
-             width="500px">
-    <el-form :model="dialogForm"
-             ref="dialogForm"
-             label-width="100px"
-             :rules="formRules">
-      <el-form-item prop="name"
-                    label="拍品">
-        <el-input v-model.trim="dialogForm.name"
-                  maxlength="30"
-                  placeholder="拍品名称"
-                  style="width: 90%;"></el-input>
-      </el-form-item>
-      <el-form-item prop="code"
-                    label="拍品代码">
-        <el-input @keyup.enter.native="submitHandle('dialogForm')"
-                  v-model.trim="dialogForm.code"
-                  placeholder="拍品代码"
-                  style="width: 90%;"></el-input>
-      </el-form-item>
-    </el-form>
-    <div slot="footer"
-         class="dialog-footer">
-      <el-button @click="handleCancel">取 消</el-button>
-      <el-button type="primary"
-                 @click="submitHandle('dialogForm')"
-                 :loading="submitLoading">确 定</el-button>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-export default {
-  props: {
-    //弹窗是否显示
-    dialogVisible: {
-      type: Boolean,
-      default: false,
-      required: true
-    },
-    //弹窗表单
-    dialogForm: {
-      type: Object,
-      default: Object,
-      required: true
-    },
-    //提交loading
-    submitLoading: {
-      type: Boolean,
-      default: false,
-      required: true
-    }
-  },
-  data () {
-    let validateText = (rule, value, callback) => {
-      let reg = /[^\u4e00-\u9fa5]/;
-      if (reg.test(value) || value === "") {
-        callback(new Error("请输入中文拍品名称"));
-      } else {
-        callback();
-      }
-    };
-    return {
-      //弹窗应用表单验证规则
-      formRules: {
-        name: [
-          {
-            required: true,
-            trigger: "blur",
-            validator: validateText
-          }
-        ],
-        code: [{ required: true, message: "请输入拍品代码", trigger: "blur" }]
-      }
-    };
-  },
-  methods: {
-    //提交
-    submitHandle (formName) {
-      this.$refs[formName].validate(valid => {
-        if (valid) {
-          this.$emit("submitHandle", this.dialogForm)
-        }
-      })
-    },
-    //关闭弹窗
-    handleCancel () {
-      this.$emit("getCancel")
-    }
-  }
-}
-</script>

src/views/goods/goodsDetail.vue

@@ -1,38 +0,0 @@
-<template>
-  <section>
-    <div class="text-center mar-t-30">
-      <div class="mar-b-30">
-        <img v-if="code === 'XMSJ'" width="400px" src="@/assets/images/xmsj.jpg">
-        <img v-if="code === 'HWSJ'" width="400px" src="@/assets/images/hwsj.png">
-        <img v-if="code === 'HMSJ'" width="400px" src="@/assets/images/hmsj.jpg">
-        <img v-if="code === 'RYSJ'" width="400px" src="@/assets/images/rysj.png">
-      </div>
-      <div class="mar-30" style="font-size: 30px">
-        当前手机是：
-        <span v-if="code === 'XMSJ'">小米手机</span>
-        <span v-if="code === 'HWSJ'">华为手机</span>
-        <span v-if="code === 'HMSJ'">红米手机</span>
-        <span v-if="code === 'RYSJ'">荣耀手机</span>
-      </div>
-      <el-button type="default" @click="back" round>返回列表</el-button>
-    </div>
-  </section>
-</template>
-
-<script>
-
-export default {
-  name: 'goodsDetail',
-  data () {
-    return {
-      code: this.$route.query.code
-    }
-  },
-  methods: {
-    //返回列表
-    back () {
-      this.$router.go(-1);
-    }
-  }
-}
-</script>

src/views/goods/goodsList.vue

@@ -1,395 +0,0 @@
-<template>
-  <section>
-    <section v-loading="loading"
-             element-loading-text="拼命加载中……"
-             class="bg-white">
-      <div class="table-filter-wrapper mar-l-10">
-        <ph-form @searchBtn="searchBtn"
-                 @resetSearchBtn="resetSearchBtn"
-                 @addHandle="addHandle"
-                 :searchForm="searchForm">
-        </ph-form>
-      </div>
-      <div class="table-wrapper pad-t-5 bor-t-1">
-        <ph-table :tableData="tableData"
-                  @editHandle="editHandle"
-                  @singleDeleteHandle="singleDeleteHandle"
-                  @selectionChangeHandle="selectionChangeHandle">
-        </ph-table>
-        <el-row class="mar-t-10">
-          <el-col :span='4'>
-            <el-button @click="batchDeleteHandle()"
-                       :disabled="isBatchDeleteDisabled"
-                       size="small">批量删除
-            </el-button>
-          </el-col>
-          <el-col :span='20'>
-            <ph-pagination @sendPaginations="sendPaginationsHandle"
-                           :paginations="paginationParams"
-                           class="mar-r-20 text-right">
-            </ph-pagination>
-          </el-col>
-        </el-row>
-      </div>
-    </section>
-    <!--新增、编辑-->
-    <added-editor-dialog :dialogForm="dialogForm"
-                         :submitLoading="submitLoading"
-                         :dialogVisible.sync="addedEditorDialog"
-                         @getCancel="handleCancel"
-                         @submitHandle="submitAddedEditorForm">
-    </added-editor-dialog>
-  </section>
-</template>
-
-<script>
-import Form from './Form'
-import Table from './Table'
-import Pagination from '@/components/Pagination'
-import AddedEditorDialog from './components/AddedEditorDialog'
-
-export default {
-  name: 'goodsList',
-  components: {
-    'ph-pagination': Pagination,
-    'added-editor-dialog': AddedEditorDialog,
-    'ph-form': Form,
-    'ph-table': Table
-  },
-  data () {
-    return {
-      loading: false,//loading
-      submitLoading: false,//弹窗提交loading
-      paginationParams: this.$config.paginationParams,//列表分页
-      handleType: '',//判断弹窗提交是新增还是编辑
-      checkedIds: [],//checkbox被选中的子项
-      isBatchDeleteDisabled: false,//是否可以批量删除
-      //table数据
-      tableData: [{
-        name: '小米手机',
-        code: 'XMSJ',
-		time: 1573625941000
-      }, {
-        name: '华为手机',
-        code: 'HWSJ',
-		time: 1573009362000
-      }, {
-        name: '红米手机',
-        code: 'HMSJ',
-		time: 1573193112000
-      }, {
-        name: '荣耀手机',
-        code: 'RYSJ',
-		time: 1573610740000
-      }],
-      //弹窗
-      addedEditorDialog: false,
-      dialogForm: {
-        name: '',
-        code: ''
-      },
-      //搜索
-      searchForm: {
-        name: '',
-        code: ''
-      }
-    }
-  },
-  created () {
-    //请求列表
-    //this.getList()
-  },
-  methods: {
-    /*
-      *functionName: successList
-      * params: params Object
-      * params: id String
-      * desc:封装初始化获取列表和搜索  共用
-    */
-    async successList (params) {
-	  return this.$message.error("请配置接口!");
-      this.loading = true//loading
-      let res = await this.$api.systemModule.goodsManage.getList(params)
-      let data = res.data.data
-      if (res.data.retcode === this.$config.RET_CODE.SUCCESS_CODE) {
-        this.loading = false
-        if (data.rows.length > 0) {
-          this.isBatchDeleteDisabled = false//启用批量删除
-          this.tableData = data.rows//存储到tableData
-          this.paginationParams.pageSize = data.pageSize//每页的数量
-          this.paginationParams.size = data.size//当前页的数量
-          this.paginationParams.total = data.total//总条数
-          this.paginationParams.pages = data.pages//总页码数
-        } else {
-          this.tableData = []
-          this.paginationParams.total = 0
-          this.isBatchDeleteDisabled = true//禁用批量删除
-        }
-      } else {
-        this.$message({
-          type: 'error',
-          message: res.data.retmsg
-        })
-      }
-    },
-    /*
-      *functionName: getList
-      * params: params Object
-      * params: aliveFlag String
-      * params: pageNo Number
-      * params: pageSize Number
-      * desc:获取表格数据
-    */
-    getList () {
-	  return this.$message.error("请配置接口!");
-      let params = {
-        pageNo: this.paginationParams.pageNo,//页码
-        pageSize: this.paginationParams.pageSize//每页条数
-      }
-      //列表成功请求
-      this.successList(params)
-    },
-    /*
-      *functionName: searchBtn
-      * params: searchData Object
-      * desc:查询
-    */
-    searchBtn (searchData) {
-      let params = {
-        pageNo: this.paginationParams.pageNo,//页码
-        pageSize: this.paginationParams.pageSize,//每页条数
-        name: searchData && searchData.name ? searchData.name : null,
-      }
-      //列表成功请求
-      this.successList(params)
-    },
-    /*
-      *functionName: sendPaginationsHandle
-      * params: params Object
-      * desc:接收分页参数
-    */
-    sendPaginationsHandle () {
-      if (this.searchForm.name !== '' || this.searchForm.code !== '') {
-        let params = {
-          pageNo: this.paginationParams.pageNo,//页码
-          pageSize: this.paginationParams.pageSize,//每页条数
-          name: this.searchForm && this.searchForm.name !== '' ? this.searchForm.name : null,
-        }
-        //发送请求
-        this.successList(params)
-      } else {
-        this.getList()
-      }
-    },
-    /*
-      *functionName: resetSearchBtn
-      * desc:重置搜索查询
-    */
-    resetSearchBtn () {
-      this.searchForm = {}
-      this.paginationParams.pageNo = 1
-      this.getList()
-    },
-    /*
-      *functionName: addHandle
-      * desc:弹出新增
-    */
-    addHandle () {
-      this.handleType = 'add'//判断为新增
-      this.addedEditorDialog = true//显示弹窗
-      //设置传给后台的数据
-      this.dialogForm = {
-        name: '',
-        code: ''
-      }
-    },
-    /*
-      *functionName: selectionChangeHandle
-      * params: checkedData Object
-      * desc:表格全选
-    */
-    selectionChangeHandle (checkedData) {
-      //checkedData是选中的数组，遍历后的数据为数组，如[1,2,3]，追加到checkedIds作为传给后台的参数
-      checkedData.forEach(item => {
-        this.checkedIds.push(item.id)
-      })
-    },
-    /*
-      *functionName: editHandle
-      * params: params Number
-      * desc:弹出修改
-    */
-    editHandle (index, row) {
-      this.handleType = 'edit'//判断为编辑
-      this.addedEditorDialog = true//显示弹窗
-      this.dialogForm = {
-        name: row.name,
-        code: row.code,
-        id: row.id
-      }
-      //请求接口
-      let params = row.id
-	  return this.$message.error("请配置接口!");
-      this.$api.systemModule.goodsManage.getDataById(params)
-        .then(res => {
-          if (res.data.retcode === this.$config.RET_CODE.SUCCESS_CODE) {
-            let data = res.data.data
-            //设置传给后台的数据
-            this.dialogForm = {
-              name: data.name,
-              code: data.code,
-              id: data.id
-            }
-          } else {
-            this.$message({
-              type: 'error',
-              message: res.data.retmsg
-            })
-          }
-        }).catch(err => {
-          console.log(err)
-        })
-    },
-    /*
-      *functionName: deleteHandle
-      * params: params Object
-      * desc:删除共用方法
-    */
-    deleteHandle (tipsText, params, cancelTips) {
-      //提示框
-      this.$confirm(tipsText, '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning',
-        center: true
-      }).then(() => {
-		return this.$message.error("请配置接口!");
-        //请求删除账号接口
-        this.$api.systemModule.goodsManage.batchEdit(params)
-          .then(res => {
-            if (res.data.retcode === this.$config.RET_CODE.SUCCESS_CODE) {
-              this.$message({
-                type: 'success',
-                message: res.data.retmsg
-              })
-              this.getList()
-            } else {
-              this.$message({
-                type: 'error',
-                message: res.data.retmsg
-              })
-            }
-          }).catch(err => {
-            console.log(err)
-          })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: cancelTips
-        })
-      })
-    },
-    /*
-      *functionName: singleDeleteHandle
-      * params: params Object
-      * desc:单个删除
-    */
-    singleDeleteHandle (index, row) {
-      let arr = []
-      arr.push(row.id)
-      let params = {
-        ids: [row.id]//数组
-      }
-      this.deleteHandle('确定删除当前拍品信息?', params, '取消删除')
-    },
-    /*
-      *functionName: batchDeleteHandle
-      * params: params Array
-      * desc:批量删除
-    */
-    batchDeleteHandle () {
-      if (this.checkedIds.length > 0) {
-        let params = {
-          ids: this.checkedIds//数组
-        }
-        this.deleteHandle('确定批量删除当前拍品信息?', params, '取消删除')
-      } else {
-        this.$message({
-          type: 'error',
-          message: '请选择拍品'
-        })
-      }
-    },
-    /*
-      *functionName: handleCancel
-      * desc:点击弹框下的取消
-    */
-    handleCancel () {
-      this.addedEditorDialog = false
-    },
-    /*
-      *functionName: submitAddedEditorForm
-      * params: params Array
-      * desc:新增、修改弹窗提交
-    */
-    submitAddedEditorForm () {
-	  return this.$message.error("请配置接口!");
-      this.submitLoading = true
-      let params = this.dialogForm
-      if (this.handleType === 'add') {
-        //添加
-        this.$api.systemModule.goodsManage.add(params)
-          .then(res => {
-            if (res.data.retcode === this.$config.RET_CODE.SUCCESS_CODE) {
-              this.submitLoading = false
-              this.$message({
-                message: res.data.retmsg,
-                type: "success"
-              })
-              this.getList()
-              this.addedEditorDialog = false//隐藏弹窗
-            } else {
-              //账号已存在或者其他异常
-              this.$message({
-                message: res.data.retmsg,
-                type: "error"
-              })
-              this.submitLoading = false
-            }
-          }).catch(err => {
-            console.log(err)
-            this.addedEditorDialog = false//隐藏弹窗
-            this.submitLoading = false
-          })
-      } else if (this.handleType === 'edit') {
-		return this.$message.error("请配置接口!");
-        //编辑
-        this.$api.systemModule.goodsManage.edit(params)
-          .then(res => {
-            if (res.data.retcode === this.$config.RET_CODE.SUCCESS_CODE) {
-              this.submitLoading = false
-              this.$message({
-                type: "success",
-                message: res.data.retmsg
-              })
-              this.getList()//再次请求列表
-              this.addedEditorDialog = false//隐藏弹窗
-            } else {
-              //其他异常
-              this.$message({
-                type: "error",
-                message: res.data.retmsg
-              })
-              this.submitLoading = false
-            }
-          }).catch(err => {
-            //隐藏弹窗
-            console.log(err)
-            this.addedEditorDialog = false
-            this.submitLoading = false
-          })
-      }
-    }
-  }
-}
-</script>

src/views/login/Login.vue

@@ -27,8 +27,9 @@
 </template>
 
 <script>
-import { loginRequest } from "../../api/requestAPI";
+import { loginRequest } from "../../network/network";
 import axios from "axios";
+
 export default {
   name: "login",
   data() {
@@ -89,14 +90,16 @@ export default {
                 localStorage.setItem("ms_id", res.data.data.id);
                 localStorage.setItem("token", res.data.token);
 
+                
                 this.$message.success("登陆成功");
 
-                this.$router.push("/goods/goodsList");
+                this.$router.push("/config/rule/list");
               } else {
                 this.$message.error("登陆失败,用户名或密码错误");
               }
             })
             .catch((err) => {
+              this.$message.success("网络连接异常,请确认后台服务启动和网络配置");              
               console.log(err);
             });
         } else {
@@ -106,6 +109,7 @@ export default {
         }
       });
     },
+    
   },
 };
 </script>

src/views/rule/edit_form.vue

@@ -199,14 +199,11 @@
   </el-dialog>
 </template>
 <script>
-import {
-  fetchAIPointList,
-  fetchDIPointList,
-  alert_rule_postSave,
-} from "../../api/requestAPI";
+import { fetchAIPointList, fetchDIPointList, alert_rule_postSave, } from "../../network/network";
 import axios from "axios";
 export default {
-  data() {
+  data()
+  {
     return {
       visible: this.isVisible,
       isWindturbine: true,
@@ -483,14 +480,17 @@ export default {
     rowData: Object,
   },
   watch: {
-    isVisible(val) {
+    isVisible(val)
+    {
       this.visible = val;
     },
-    rowData(val) {
+    rowData(val)
+    {
       this.form = JSON.parse(JSON.stringify(val));
     },
     "form.station": {
-      handler(val) {
+      handler(val)
+      {
         if (this.form.category !== undefined && val !== undefined) {
           if (this.form.category === "1") {
             // 风机
@@ -504,7 +504,8 @@ export default {
         }
         // 场站变更 - 加载设备类型
         if (val !== undefined) {
-          let sel_station = this.s_modelList.filter(function (item) {
+          let sel_station = this.s_modelList.filter(function (item)
+          {
             return item.station == val;
           });
           if (sel_station.length > 0)
@@ -515,7 +516,8 @@ export default {
       immediate: true,
     },
     "form.category": {
-      handler(val) {
+      handler(val)
+      {
         if (val !== undefined) {
           if (val === "1") {
             // 风机
@@ -548,7 +550,8 @@ export default {
       immediate: true,
     },
     "form.modelId": {
-      handler(val) {
+      handler(val)
+      {
         if (this.form.station !== undefined && val !== undefined) {
           this.queryWindturbine_AI_DI_Point(this.form.station, val);
         }
@@ -559,25 +562,34 @@ export default {
   },
   methods: {
     // 点击取消事件
-    btnCancelClickHandle() {
+    btnCancelClickHandle()
+    {
       this.visible = false;
       this.$emit("cbFunc", this.visible);
     },
     // 窗口关闭前的回调
-    dialogBeforeClose(done) {
+    dialogBeforeClose(done)
+    {
       this.$confirm("确认关闭？")
-        .then((_) => {
+        .then((_) =>
+        {
           done();
           this.visible = false;
           this.$emit("cbFunc", this.visible);
         })
-        .catch((_) => {});
+        .catch((_) => { });
     },
     // 查询风场AI、DI测点
-    queryWindturbine_AI_DI_Point(station, modelId) {
+    queryWindturbine_AI_DI_Point(station, modelId)
+    {
+
+
       // 获取AI测点
-      fetchAIPointList(station, modelId).then((res) => {
-        res.sort(function (a, b) {
+      fetchAIPointList(station, modelId).then((res) =>
+      {
+        console.log(res)
+        res.sort(function (a, b)
+        {
           if (a.uniformCode < b.uniformCode) {
             return -1;
           }
@@ -589,10 +601,15 @@ export default {
 
         this.AIPointList = res;
         this.AIDataSource = res;
+      }).catch(error =>
+      {
+        console.log("fetchAIPointList 异常:" + error);
       });
       // 获取DI测点
-      fetchDIPointList(station, modelId).then((res) => {
-        res.sort(function (a, b) {
+      fetchDIPointList(station, modelId).then((res) =>
+      {
+        res.sort(function (a, b)
+        {
           if (a.uniformCode < b.uniformCode) {
             return -1;
           }
@@ -608,7 +625,8 @@ export default {
     },
 
     // 函数点击事件
-    tabFuncRowClickHandle(row) {
+    tabFuncRowClickHandle(row)
+    {
       let _row = this.deepClone(row);
       let elInput = document.getElementById("expressionInput");
       let startPos = elInput.selectionStart; //第0个字符到选中的字符
@@ -644,24 +662,29 @@ export default {
       this.form.expression = result; // 赋值给表单中的的字段
     },
     // 运算符点击事件
-    btnOperatorClickHandle(row) {
+    btnOperatorClickHandle(row)
+    {
       this.elInputSplit(row);
     },
     //提交表单
-    submit() {
+    submit()
+    {
       this.form.expression = document.getElementById("expressionInput").value;
-      this.$refs["form"].validate((valid) => {
+      this.$refs["form"].validate((valid) =>
+      {
         if (valid) {
           let loginUser = sessionStorage.getItem("ms_username");
           this.form.userName = loginUser;
 
           this.$confirm("确认关闭？")
-            .then(() => {
+            .then(() =>
+            {
               switch (this.dialogStatus) {
                 //窗口状态：0-新增；1-修改；2-查看
                 case 0:
                   custombj_postSave(this.form)
-                    .then((response) => {
+                    .then((response) =>
+                    {
                       if (response.data.success) {
                         this.$message.success("保存成功");
                         // 关闭窗口
@@ -678,13 +701,15 @@ export default {
                         this.$message.error(response.data.msg);
                       }
                     })
-                    .catch((err) => {
+                    .catch((err) =>
+                    {
                       console.log(err);
                     });
                   break;
                 case 1:
                   custombj_postSave(this.form)
-                    .then((response) => {
+                    .then((response) =>
+                    {
                       if (response.data.success) {
                         this.$message.success("保存成功");
                         // 关闭窗口
@@ -701,7 +726,8 @@ export default {
                         this.$message.error(response.data.msg);
                       }
                     })
-                    .catch((err) => {
+                    .catch((err) =>
+                    {
                       console.log(err);
                     });
                   break;
@@ -712,14 +738,16 @@ export default {
                   break;
               }
             })
-            .catch((err) => {
+            .catch((err) =>
+            {
               console.log(err);
             });
         }
       });
     },
     // 窗口打开事件 - 做重置表单操作
-    dialogOpenHandle() {
+    dialogOpenHandle()
+    {
       // 重置表单
       if (this.dialogStatus === 0) {
         this.isWindturbine = true;
@@ -744,12 +772,14 @@ export default {
       }
 
       // 获取关联部件
-      fetchRelatePart().then((res) => {
+      fetchRelatePart().then((res) =>
+      {
         this.relatePartList = res;
       });
     },
     // 窗口关闭事件 - 做重置表单操作
-    dialogCloseHandle() {
+    dialogCloseHandle()
+    {
       // 重置表单
       if (this.dialogStatus === 0) {
         this.isWindturbine = true;
@@ -774,30 +804,38 @@ export default {
       }
     },
     // AI测点模糊查询
-    AIInputChange() {
-      this.AIPointList = this.AIDataSource.filter((i) => {
+    AIInputChange()
+    {
+      this.AIPointList = this.AIDataSource.filter((i) =>
+      {
         return i.name.indexOf(this.AIPointSearch) != -1;
       });
     },
     // DI测点模糊查询
-    DIInputChange() {
-      this.DIPointList = this.DIDataSource.filter((i) => {
+    DIInputChange()
+    {
+      this.DIPointList = this.DIDataSource.filter((i) =>
+      {
         return i.name.indexOf(this.DIPointSearch) != -1;
       });
     },
-    tbAI_DBClickHandle(row) {
+    tbAI_DBClickHandle(row)
+    {
       this.elInputSplit(row.uniformCode);
     },
-    tbDI_DBClickHandle(row) {
+    tbDI_DBClickHandle(row)
+    {
       this.elInputSplit(row.uniformCode);
     },
-    deepClone(obj) {
+    deepClone(obj)
+    {
       let _obj = JSON.stringify(obj),
         objClone = JSON.parse(_obj);
       return objClone;
     },
     // 表达式字符串拼接
-    elInputSplit(val) {
+    elInputSplit(val)
+    {
       let elInput = document.getElementById("expressionInput");
       let startPos = elInput.selectionStart;
       let endPos = elInput.selectionEnd;
@@ -815,7 +853,7 @@ export default {
   },
 };
 </script>
-<style>
+<style scoped>
 .col-box {
   display: flex;
   flex-direction: column;

src/views/rule/list.vue

@@ -1,12 +1,5 @@
 <template>
   <div>
-    <div class="crumbs">
-      <el-breadcrumb separator="/">
-        <el-breadcrumb-item>
-          <i class="el-icon-lx-cascades"></i>自定义报警
-        </el-breadcrumb-item>
-      </el-breadcrumb>
-    </div>
     <div class="container">
       <el-row type="flex" justify="space-between">
         <div class="handle-box" style="margin-bottom:10px">
@@ -96,7 +89,7 @@
 </template>
 <script>
 import axios from "axios";
-import { alert_rule_fetchTableData } from "../../api/requestAPI";
+import { alert_rule_fetchTableData } from "../../network/network";
 import edit_form from "./edit_form";
 
 const tHeader = [

src/views/upload/index.vue

@@ -1,191 +0,0 @@
-<template>
-  <div style="margin-top: 30px">
-	<!-- 上传图片 -->
-    <div class="fl">
-		<el-upload action="/"
-				 :show-file-list="false"
-				 :before-upload="beforeAvatarUpload"
-				 :http-request="uploadFile">
-			<img v-if="samplePicture" :src="samplePicture">
-			<el-button v-else class="pad-30 bor-1">
-			  <i v-if="!samplePicture" class="el-icon-plus" style="font-size: 30px;"></i>
-			  <i v-if="samplePicture" class="el-icon-loading"></i>
-			  <p class="mar-t-5">上传 图片，大小不超过2M</p>
-			</el-button>
-		</el-upload>
-	</div>
-	<!-- 上传excel -->
-	<div class="fl mar-l-20">
-		<el-upload action="/"
-					 :show-file-list="false"
-					 :before-upload="beforeBatchInExcel"
-					 :http-request="batchInFileExcel">
-			<el-button :loading="importLoaing" class="pad-30">
-				<i class="el-icon-plus" style="font-size: 30px;"></i>
-				<p class="mar-t-5">上传excel，大小不超过2M</p>
-				</el-button>
-		</el-upload>
-	</div>
-	<!-- 上传pdf -->
-	<div class="fl mar-l-20" style="width: 350px;">
-		<el-upload
-			:show-file-list="false"
-			:before-upload="beforeAvatarUploadPdf"
-			:http-request="uploadFilePdf"
-			:limit="1"
-			action="/"
-			multiple>
-			<el-button class="pad-30">
-				<i class="el-icon-plus" style="font-size: 30px;"></i>
-				<p class="mar-t-5">上传 pdf、word，大小不超过10M</p>
-			</el-button>
-		  </el-upload>
-	</div>
-  </div>
-</template>
-<script>
-	export default {
-	  name: 'upload',
-	  data(){
-		return {
-			samplePicture: "",//图片回选地址
-			importLoaing: false,//上传loading  避免重复上传
-		}
-	  },
-	  methods: {
-		//***********************************备注：根据业务进行抽离 ********************************
-		
-		// **************上传图片*****************
-		// 自定义上传文件方法
-		uploadFile(file) {
-		  return this.$message.error("请配置接口!");
-		  let params = new FormData();
-		  params.append("picture", file.file); //后台需要传这picture流
-		  let config = {
-			contentType: false,
-			processData: false,
-			headers: {
-			  "Content-Type": "multipart/form-data" //后台接收类型是form-data
-			  // "Content-Type": "application/x-www-form-urlencoded"
-			}
-		  };
-		  //请求接口  可在api.js中自定义
-		  this.$api.systemModule.uploadFile(params, config)
-			.then(res => {
-			  if (res.data.code === this.$config.RET_CODE.SUCCESS_CODE) {
-				console.log(res.data.data)
-				this.$message.success("上传成功");
-			  } else {
-				this.$message.error(res.data.retmsg);
-			  }
-			})
-			.catch(err => {
-			  console.log(err);
-			});
-		},
-		//上传图片前校验
-		beforeAvatarUpload(file) {
-		  console.log(file.type);
-		  const isJPG = /^image\/(jpeg|png|jpg|gif)$/g.test(file.type);
-		  const isLt2M = file.size / 1024 / 1024 < 2;
-		  if (!isJPG) {
-			this.$message.error("上传图片只能是图片格式!");
-		  }
-		  if (!isLt2M) {
-			this.$message.error("上传图片大小不能超过 2MB!");
-		  }
-		  return isJPG && isLt2M;
-		},
-		
-		// ******************上传excel*************
-		//上传excel
-		batchInFileExcel(file) {
-			return this.$message.error("请配置接口!");
-		    let params = new FormData();
-		    params.append("file", file.file); //后台需要传这file流
-		    let config = {
-		      contentType: false,
-		      processData: false,
-		      headers: {
-		        "Content-Type": "multipart/form-data" //后台接收类型是form-data
-		        // "Content-Type": "application/x-www-form-urlencoded"
-		      }
-		    };
-		    this.importLoaing = true;
-		    //上传回选
-		    this.$api.systemModule.uploadFile(params, config)
-		      .then(res => {
-		        if (res.data.code === this.$config.RET_CODE.SUCCESS_CODE) {
-		          let data = res.data.data;
-		          this.$message.success("上传成功");
-		        } else {
-		          return this.$message.error("上传失败，请选择excel格式文件重新上传");
-		        }
-		        this.importLoaing = false;
-		      })
-		      .catch(err => {
-		        this.importLoaing = false;
-		        return this.$message.error("上传失败，请选择excel格式文件重新上传");
-		        console.log(err);
-		      });
-		  },
-		  //上传excel前校验
-		  beforeBatchInExcel(file) {
-		    const isExcel = file.type === ("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" || "application/vnd.ms-excel");
-		    const isLt2M = file.size / 1024 / 1024 < 2;
-		    if (!isExcel) {
-		      this.$message.error("上传文件只能是 excel 格式!");
-		    }
-		    if (!isLt2M) {
-		      this.$message.error("上传文件大小不能超过 2MB!");
-		    }
-		    return isExcel && isLt2M;
-		  },
-		  
-		  // **************上传pdf****************
-		  //上传pdf
-		  uploadFilePdf(file) {
-			return this.$message.error("请配置接口!");
-			let params = new FormData()
-			params.append('file',file.file)
-			let config = {
-			  'contentType': false,
-			  'processData': false,
-			  headers: {
-				//'Content-Type': 'multipart/form-data',
-				'Content-Type': 'application/x-www-form-urlencoded'
-			  }
-			}
-			this.$api.systemModule.uploadFile(params,config)
-			  .then(res => {
-				if(res.data.retcode === this.$config.RET_CODE.SUCCESS_CODE){
-				  this.$message.success(res.data.retmsg)
-				}else{
-				  this.$message.error(res.data.retmsg)
-				}
-			  }).catch(err => {
-				console.log(err)
-			  })
-		  },
-		  //上传附件前的检验
-		  beforeAvatarUploadPdf(file) {
-			//let filetypes = ["txt", "doc", "xls", "pdf", "docx", "xlsx"]
-			let filetypes = ["pdf","doc","docx"]
-			let filename = file.name
-			let fileted = filename.replace(/.+\./, "")
-			const isLt10M = file.size / 1024 / 1024 < 10
-			let isTYPE = filetypes.includes(fileted)
-			if (!isLt10M) {
-			  this.$message.error("上传文件大小不能超过 10MB!")
-			}
-			if (!isTYPE) {
-			  this.$message({
-				type: 'error',
-				message: '上传文件类型只能是pdf或者word格式!'
-			  })
-			}
-			return isTYPE && isLt10M
-		  }
-	  }
-	}
-</script>

src/views/xDesigner/AppDesign.vue

@@ -19,7 +19,7 @@ export default {
   }
 };
 </script>
-<style lang="css">
+<style lang="css" scoped>
 /* 滚动条 */
 ::-webkit-scrollbar {
   width: 0.25rem;

src/views/xDesigner/viewer.vue

@@ -1,6 +1,5 @@
 <template>
-<div class="mainpage" id="rootElement" ref="rootElement"></div>
-  
+  <div class="mainpage" id="rootElement" ref="rootElement"></div>
 </template>
 
  <script>
@@ -10,7 +9,7 @@ import * as FileSaver from 'file-saver'
 import { Store } from 'le5le-store'
 
 
-import { network } from '@/network/network'
+import { monitor } from '../../network/network'
 
 import example from '@/static/json/example.json'
 
@@ -21,13 +20,15 @@ export default {
   {
     return {
       dataSubscribe: '',
-      nodes: {},//k:tagName, v:[node1,node2]
-      pullDataTimer: ''
+      nodes: {},
+      pullDataTimer: '',
+      paintLockSubscribe: {},
     }
   },
   created()
   {
-    this.open();
+    console.log(this.$route.query);
+
   },
   mounted()
   {
@@ -36,21 +37,16 @@ export default {
   },
 
   methods: {
-    con(){
-      console.log(this.$route.params.path)
-    },
     init()
     {
       window.scrollTo(0, 0);
-      //this.canvasOptions.on = this.onMessage;
       this.canvas = new Topology('rootElement', this.canvasOptions);
       this.canvasHeight = this.canvas.canvas.height;
-      //this.$store.state.canvas = this.canvas;
-      window.v = this.canvas;
-      window.s = this.$store;
 
-      this.canvas.open(JSON.stringify(example));
-      this.canvas.lock(2);
+      this.open();
+
+
+
 
       this.dataSubscribe = Store.subscribe('wxwData', value =>
       {
@@ -59,7 +55,6 @@ export default {
             let penArray = this.nodes[value[i].point];
             for (let e in penArray) {
               let pent = penArray[e].binding.type;
-
               switch (pent.toLowerCase()) {
                 case 'di': {
                   penArray[e].fillStyle = parseInt(value[i].latestValue) % 2 == 0 ? "#e00404ff" : "#21e004ff";
@@ -80,31 +75,41 @@ export default {
         }
         this.canvas.render();
       });
+
+      this.paintLockSubscribe = Store.subscribe('viewLock', tag =>
+      {
+        if (this.canvas) {
+          this.canvas.lock(tag);
+        }
+      });
+
     },
     open()
     {
+      window.v = this.canvas;
+      window.s = this.$store;
+
+      if (this.$route.query.path) {
+        monitor.getJsonFileBy(this.$route.query.path, res =>
+        {
+          console.log(res.data);
+
+          if (res.data && res.data.data && res.data.data.pagejson) {
+            this.canvas.open(res.data.data.pagejson);
+            this.canvas.lock(2);
+          }
+          else {
+            this.canvas.open(JSON.stringify(example));
+            this.canvas.lock(2);
+          }
+        });
 
-      console.log("this.$route.query");
-      console.log(this.$route.query);
-      if (!this.$route.query.id) {
-        return
       }
       else {
-        let path = this.$route.query.id;
-        console.log(path);
-        network.getJsonFile(this.$axios, path);
+        this.canvas.open(JSON.stringify(example));
+        this.canvas.lock(2);
       }
 
-
-      let s = JSON.stringify(example);
-      console.log(s)
-
-      this.canvas.open(s);
-
-
-      // if (data && data.id) {
-      //   canvas.open(data.data)
-      // }  %2Fstatic%2Fjson%2Fexample.json
     },
     pullTagData()
     {
@@ -115,19 +120,11 @@ export default {
         // 遍历出所有要查询的节点
         for (let i = 0; i < this.canvas.data.pens.length; i++) {
           let node = this.canvas.data.pens[i];
-          /**    
-          bingding:{
-            tagName:string;
-            type:string;
-          };
-          //k:tagName, v:[node1,node2]
-          */
           if (node.binding && node.binding.tagName != "") {
 
             if (!this.nodes[node.binding.tagName]) {
 
               this.nodes[node.binding.tagName] = [];
-              //this.nodes[node.binding.tagName] = [];
             }
 
             if (!this.nodes[node.binding.tagName][node.id]) {
@@ -136,20 +133,9 @@ export default {
           }
         }
       }
-      // else
-      // {
-      //   //console.log("----------------------------------------");
-      //   console.log(!this.nodes || Object.keys(this.nodes).length == 0)
-      // }
-
-      //this.getTagValues();
-      network.getTagValues(this.$axios, Object.keys(this.nodes));
+      monitor.getTagValues(Object.keys(this.nodes));
     }
 
-
-
-
-
   },
   beforeDestroy()
   {
@@ -164,8 +150,8 @@ export default {
 }
  </script> 
  <style lang="css" scoped>
- .mainpage{
-   height: 100%;
-   width:100%;
- }
- </style>
+.mainpage {
+  height: 100%;
+  width: 100%;
+}
+</style>

src/views/xDesigner/xdesigner.vue

@@ -46,7 +46,10 @@
       <v-contextmenu-item @click="OnTop">置顶</v-contextmenu-item>
       <v-contextmenu-item @click="OnBottom">置底</v-contextmenu-item>
       <v-contextmenu-item divider></v-contextmenu-item>
-      <v-contextmenu-item @click="OnCombine" v-if="nodes && nodes.pens && (nodes.pens.length > 1)">组合</v-contextmenu-item>
+      <v-contextmenu-item
+        @click="OnCombine"
+        v-if="nodes && nodes.pens && (nodes.pens.length > 1)"
+      >组合</v-contextmenu-item>
       <v-contextmenu-item @click="OnUncombine" v-if="nodes && nodes.pen && nodes.pen.children">取消组合</v-contextmenu-item>
       <v-contextmenu-item @click="OnPenLock">{{ penLocked ? '解锁' : '锁定' }}</v-contextmenu-item>
       <v-contextmenu-item divider></v-contextmenu-item>
@@ -64,7 +67,7 @@
 </template>
 
 
-<style>
+<style scoped>
 a:hover {
   color: #1bb5f5;
 }
@@ -126,6 +129,7 @@ import Nodepropertys from "@/components/nodepropertys"
 import Filepropertys from "@/components/filepropertys"
 import Pens from "@/components/pens.vue"
 import store from '@/store/index'
+import { monitor } from '@/network/network'
 
 import "@/assets/js/canvas2svg"
 
@@ -152,7 +156,8 @@ export default {
       contextmenu: {},
       editFilename: false,
       page: {
-        path: "/",
+        belong: '',
+        path: "",
         name: "",
         elementColor: this.$store.state.designsetting.elementColor,
         paintColor: this.$store.state.designsetting.paintColor,
@@ -183,27 +188,6 @@ export default {
       ],
     }
   },
-
-  created()
-  {
-    // if (process.client && window['echartsData']) {
-    //   for (let key in window['echartsData']) {
-    //     document.body.removeChild(window['echartsData'][key]).div
-    //   }
-    //   window['echartsData'] = {}
-    // }
-    //canvasRegister();
-    // if (process.client) {
-    //   document.onclick = event =>
-    //   {
-    //     this.contextmenu = {
-    //       left: null,
-    //       top: null,
-    //       bottom: null
-    //     }
-    //   }
-    // }
-  },
   mounted()
   {
     this.init();
@@ -214,24 +198,10 @@ export default {
       return this.$store.state.event.event
     }
   },
-  watch: {
-    // event(curVal)
-    // {
-    //   console.log("_________________________________________________!@!!!!!!!!!!!!!!!__________")
-    //   console.log(curVal);
-    //   if (this[curVal.name]) {
-    //     this[curVal.name](curVal.data)
-    //   }
-    // },
-    // $route(val)
-    // {
-    //   this.open()
-    // }
-  },
   methods: {
     handleSubmenuShow(vm, placement)
     {
-      console.log(vm, placement)
+      //console.log(vm, placement)
     },
     init()
     {
@@ -240,8 +210,6 @@ export default {
       this.canvas = new Topology('rootElement', this.canvasOptions);
       this.canvasHeight = this.canvas.canvas.height;
       this.$store.state.canvas = this.canvas;
-      window.v = this.canvas;
-      window.s = this.$store;
     },
     async open()
     {
@@ -278,7 +246,7 @@ export default {
             文件名称:(前后端做好防注入准备,只允许输入中英文数字和转义的反斜杠)
             然后界面需要提供一个树形结构或者列表,方便用户操作(路劲添加或者路劲选择)
             */
-            this.OnSave();
+            this.OnSaveToServer();
           } break;
         case "donwloadJson":
           { this.OnSave(); } break;
@@ -391,10 +359,9 @@ export default {
             } break;
           default:
             {
-              //console.log('onMessage_____Default:', event, value);
             } break;
         }
-        console.log('onMessage:', event, value);
+        //console.log('onMessage:', event, value);
       }, 50)
 
       window.n = this.nodes;
@@ -404,21 +371,10 @@ export default {
     OnLock(lockNumber)
     {
       this.canvas.lock(lockNumber);
-      // if (data.nodes && data.nodes.length) {
-      //   for (const item of data.nodes) {
-      //     if (!item.locked) {
-      //       locked = false
-      //       break
-      //     }
-      //   }
-      // }
     },
 
     onUpdateProps(node)
     {
-      //console.log("canvas.updateProps(node)");
-      // 如果是node属性改变，需要传入node，重新计算node相关属性值
-      // 如果是line属性改变，无需传参
       canvas.updateProps(node)
     },
 
@@ -477,11 +433,68 @@ export default {
           this.canvas.data.bkColor = data.bkColor;
           this.$store.dispatch('setCanvas', this.canvas);
         } catch (e) {
-          //console.log(e)
+          console.log(e)
         }
       };
       reader.readAsText(file);
     },
+    OnSaveToServer()
+    {
+      //#region ---------------------------------------不可为空
+      if (!this.page.belong || this.page.belong == "") {
+        this.$message.error("无法保存,页面-所属环节不可为空");
+
+        this.onMessage('space');
+        return;
+      }
+      if (!this.page.path || this.page.path == "") {
+        this.$message.error("无法保存页面,页面路径不可为空");
+        this.onMessage('space');
+        return;
+      }
+      if (!this.page.name || this.page.name == "") {
+        this.$message.error("无法保存页面,页面名称不可为空");
+        this.onMessage('space');
+        return;
+      }
+
+      //#endregion ------------------------------------------
+      /***
+      *  第一步 保存页面
+
+      *  第二部 保存路径结构      
+       */
+
+      var newPathSummary = JSON.parse(JSON.stringify(this.$store.state.pathSummary));
+
+      if (newPathSummary[this.page.belong].page) {
+        var newPageNode = {
+          "name": this.page.name,
+          "path": this.page.path
+        }
+        newPathSummary[this.page.belong].page[this.page.name] = newPageNode;
+
+        var MonitorJson = {
+          id: 0,
+          pagepath: "/",
+          pagejson: JSON.stringify(newPathSummary),
+        }
+        monitor.setJsonFile(MonitorJson, res =>
+        {
+          this.$message.success("提交文件结构" + res.data.msg);
+        });
+        this.canvas.data.page = this.page;
+        var MonitorPageJson = {
+          id: 0,
+          pagepath: newPathSummary[this.page.belong].path + this.page.path,
+          pagejson: JSON.stringify(this.canvas.data),
+        }
+        monitor.setJsonFile(MonitorPageJson, res =>
+        {
+          this.$message.success("提交页面" + res.data.msg);
+        });
+      }
+    },
     OnSave(data)
     {
       FileSaver.saveAs(

vue.config.js

@@ -4,7 +4,7 @@ module.exports = {
       proxy: {
         "/wisdom-water": {
           ws:false,
-          target: "http://localhost:8033", // 本地请求后端真正的地址，只有本地开发时才会做代理，上线不执行这段代码
+          target: "http://127.0.0.1:8033", // 本地请求后端真正的地址，只有本地开发时才会做代理，上线不执行这段代码
           changeOrigin: true,
           pathRewrite: { // 路径重写
             "^/wisdom-water": "/"