基础项目

.gitignore

@@ -0,0 +1,21 @@
+.DS_Store
+node_modules
+/dist
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw*

README.md

@@ -0,0 +1,611 @@
+# 前端团队代码规范
+
+## 命名规范
+全部采取小写方式，以下划线分隔。
+
+例： 
+```
+my_project_name
+```
+
+### 目录命名
+参照项目命名规则；
+
+有复数结构时，要采用复数命名法。
+
+例：
+```
+scripts, styles, images, data_models
+```
+
+### JS文件命名
+#### 参照项目命名规则。
+
+例：
+```
+account_model.js
+```
+
+CSS, SCSS文件命名
+#### 参照项目命名规则。
+
+例：
+```
+retina_sprites.scss
+```
+
+#### HTML文件命名
+参照项目命名规则。
+
+例：
+```
+error_report.html
+```
+
+## DOM规范
+
+### 属性顺序
+
+属性应该按照特定的顺序出现以保证易读性;
+
+- <code>class</code>
+- <code>id</code>
+- <code>name</code>
+- <code>data-*</code>
+- <code>src</code> <code>for</code> <code>type</code> <code>href</code> <code>value</code> <code>max-length</code> <code>max</code> <code>min</code> <code>pattern</code> 
+- <code>placeholder</code> <code>title</code> <code>alt</code>
+- <code>aria-*</code> <code>role</code>
+- <code>required</code> <code>readonly</code> <code>disabled</code>
+
+class是为高可复用组件设计的，所以应处在第一位；
+
+id更加具体且应该尽量少使用，所以将它放在第二位。
+
+````
+<a class="..." id="..." data-modal="toggle" href="#">Example link</a>
+
+<input class="form-control" type="text">
+
+<img src="..." alt="...">
+
+````
+
+
+## css,scss
+
+### 空格
+以下几种情况不需要空格：
+
+- 属性名后
+- 多个规则的分隔符','前
+- !important '!'后
+- 属性值中'('后和')'前
+- 行末不要有多余的空格
+  
+以下几种情况需要空格：
+
+- 属性值前
+- 选择器'>', '+', '~'前后
+- '{'前
+- !important '!'前
+- @else 前后
+- 属性值中的','后
+- 注释'/'后和'/'前
+  
+```
+/* not good */
+.element {
+    color :red! important;
+    background-color: rgba(0,0,0,.5);
+}
+
+/* good */
+.element {
+    color: red !important;
+    background-color: rgba(0, 0, 0, .5);
+}
+
+/* not good */
+.element ,
+.dialog{
+    ...
+}
+
+/* good */
+.element,
+.dialog {
+
+}
+
+/* not good */
+.element>.dialog{
+    ...
+}
+
+/* good */
+.element > .dialog{
+    ...
+}
+
+/* not good */
+.element{
+    ...
+}
+
+/* good */
+.element {
+    ...
+}
+
+/* not good */
+@if{
+    ...
+}@else{
+    ...
+}
+
+/* good */
+@if {
+    ...
+} @else {
+    ...
+}
+```
+
+### 命名
+- 类名使用小写字母，以中划线分隔
+- id采用驼峰式命名
+- scss中的变量、函数、混合、placeholder采用驼峰式命名
+
+```
+/* class */
+.element-content {
+    ...
+}
+
+/* id */
+#myDialog {
+    ...
+}
+
+/* 变量 */
+$colorBlack: #000;
+
+/* 函数 */
+@function pxToRem($px) {
+    ...
+}
+
+/* 混合 */
+@mixin centerBlock {
+    ...
+}
+
+/* placeholder */
+%myDialog {
+    ...
+}
+```
+
+## JavaScript
+
+### 空行
+
+以下几种情况需要空行：
+
+- 变量声明后（当变量声明在代码块的最后一行时，则无需空行）
+- 注释前（当注释在代码块的第一行时，则无需空行）
+- 代码块后（在函数调用、数组、对象中则无需空行）
+- 文件最后保留一个空行
+
+```
+// need blank line after variable declaration
+var x = 1;
+
+// not need blank line when variable declaration is last expression in the current block
+if (x >= 1) {
+    var y = x + 1;
+}
+
+var a = 2;
+
+// need blank line before line comment
+a++;
+
+function b() {
+    // not need blank line when comment is first line of block
+    return a;
+}
+
+// need blank line after blocks
+for (var i = 0; i < 2; i++) {
+    if (true) {
+        return false;
+    }
+
+    continue;
+}
+
+var obj = {
+    foo: function() {
+        return 1;
+    },
+
+    bar: function() {
+        return 2;
+    }
+};
+
+// not need blank line when in argument list, array, object
+func(
+    2,
+    function() {
+        a++;
+    },
+    3
+);
+
+var foo = [
+    2,
+    function() {
+        a++;
+    },
+    3
+];
+
+var foo = {
+    a: 2,
+    b: function() {
+        a++;
+    },
+    c: 3
+};
+```
+
+### 文档注释
+
+各类标签@param, @method等；
+
+建议在以下情况下使用：
+
+- 所有常量
+- 所有函数
+- 所有类
+
+```
+/**
+ * @func
+ * @desc 一个带参数的函数
+ * @param {string} a - 参数a
+ * @param {number} b=1 - 参数b默认值为1
+ * @param {string} c=1 - 参数c有两种支持的取值</br>1—表示x</br>2—表示xx
+ * @param {object} d - 参数d为一个对象
+ * @param {string} d.e - 参数d的e属性
+ * @param {string} d.f - 参数d的f属性
+ * @param {object[]} g - 参数g为一个对象数组
+ * @param {string} g.h - 参数g数组中一项的h属性
+ * @param {string} g.i - 参数g数组中一项的i属性
+ * @param {string} [j] - 参数j是一个可选参数
+ */
+function foo(a, b, c, d, g, j) {
+    ...
+}
+```
+
+### 引号
+
+最外层统一使用单引号。
+
+```
+// not good
+var x = "test";
+
+// good
+var y = 'foo',
+    z = '<div id="test"></div>';
+```
+
+### 变量命名
+
+- 标准变量采用驼峰式命名（除了对象的属性外，主要是考虑到cgi返回的数据）
+- 'ID'在变量名中全大写
+- 'URL'在变量名中全大写
+- 'Android'在变量名中大写第一个字母
+- 'iOS'在变量名中小写第一个，大写后两个字母
+- 常量全大写，用下划线连接
+- 构造函数，大写第一个字母
+- jquery对象必须以'$'开头命名
+
+```
+var thisIsMyName;
+
+var goodID;
+
+var reportURL;
+
+var AndroidVersion;
+
+var iOSVersion;
+
+var MAX_COUNT = 10;
+
+function Person(name) {
+    this.name = name;
+}
+
+// not good
+var body = $('body');
+
+// good
+var $body = $('body');
+```
+
+### 变量声明
+
+一个函数作用域中所有的变量声明尽量提到函数首部，用一个var声明，不允许出现两个连续的var声明。
+
+```
+function doSomethingWithItems(items) {
+    // use one var
+    var value = 10,
+        result = value + 10,
+        i,
+        len;
+
+    for (i = 0, len = items.length; i < len; i++) {
+        result += 10;
+    }
+}
+```
+
+### 函数
+
+无论是函数声明还是函数表达式，'('前不要空格，但'{'前一定要有空格；
+
+函数调用括号前不需要空格；
+
+立即执行函数外必须包一层括号；
+
+不要给inline function命名；
+
+参数之间用', '分隔，注意逗号后有一个空格。
+
+```
+// no space before '(', but one space before'{'
+var doSomething = function(item) {
+    // do something
+};
+
+function doSomething(item) {
+    // do something
+}
+
+// not good
+doSomething (item);
+
+// good
+doSomething(item);
+
+// requires parentheses around immediately invoked function expressions
+(function() {
+    return 1;
+})();
+
+// not good
+[1, 2].forEach(function x() {
+    ...
+});
+
+// good
+[1, 2].forEach(function() {
+    ...
+});
+
+// not good
+var a = [1, 2, function a() {
+    ...
+}];
+
+// good
+var a = [1, 2, function() {
+    ...
+}];
+
+// use ', ' between function parameters
+var doSomething = function(a, b, c) {
+    // do something
+};
+```
+
+### 数组、对象
+
+对象属性名不需要加引号；
+
+对象以缩进的形式书写，不要写在一行；
+
+数组、对象最后不要有逗号。
+
+```
+// not good
+var a = {
+    'b': 1
+};
+
+var a = {b: 1};
+
+var a = {
+    b: 1,
+    c: 2,
+};
+
+// good
+var a = {
+    b: 1,
+    c: 2
+};
+```
+
+### 括号
+
+下列关键字后必须有大括号（即使代码块的内容只有一行）：if, else,for, while, do, switch, try, catch, finally, with。
+
+```
+// not good
+if (condition)
+    doSomething();
+
+// good
+if (condition) {
+    doSomething();
+}
+```
+
+### jshint
+用'===', '!=='代替'==', '!='；
+
+for-in里一定要有hasOwnProperty的判断；
+
+不要在内置对象的原型上添加方法，如Array, Date；
+
+不要在内层作用域的代码里声明了变量，之后却访问到了外层作用域的同名变量；
+
+变量不要先使用后声明；
+
+不要在一句代码中单单使用构造函数，记得将其赋值给某个变量；
+
+不要在同个作用域下声明同名变量；
+
+不要在一些不需要的地方加括号，例：delete(a.b)；
+
+不要使用未声明的变量（全局变量需要加到.jshintrc文件的globals属性里面）；
+
+不要声明了变量却不使用；
+
+不要在应该做比较的地方做赋值；
+
+debugger不要出现在提交的代码里；
+
+数组中不要存在空元素；
+
+不要在循环内部声明函数；
+
+不要像这样使用构造函数，例：new function () { ... }, new Object；
+
+```
+// not good
+if (a == 1) {
+    a++;
+}
+
+// good
+if (a === 1) {
+    a++;
+}
+
+// good
+for (key in obj) {
+    if (obj.hasOwnProperty(key)) {
+        // be sure that obj[key] belongs to the object and was not inherited
+        console.log(obj[key]);
+    }
+}
+
+// not good
+Array.prototype.count = function(value) {
+    return 4;
+};
+
+// not good
+var x = 1;
+
+function test() {
+    if (true) {
+        var x = 0;
+    }
+
+    x += 1;
+}
+
+// not good
+function test() {
+    console.log(x);
+
+    var x = 1;
+}
+
+// not good
+new Person();
+
+// good
+var person = new Person();
+
+// not good
+delete(obj.attr);
+
+// good
+delete obj.attr;
+
+// not good
+if (a = 10) {
+    a++;
+}
+
+// not good
+var a = [1, , , 2, 3];
+
+// not good
+var nums = [];
+
+for (var i = 0; i < 10; i++) {
+    (function(i) {
+        nums[i] = function(j) {
+            return i + j;
+        };
+    }(i));
+}
+
+// not good
+var singleton = new function() {
+    var privateVar;
+
+    this.publicMethod = function() {
+        privateVar = 1;
+    };
+
+    this.publicMethod2 = function() {
+        privateVar = 2;
+    };
+};
+
+```
+
+
+# point-standard
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
+
+### Run your tests
+```
+npm run test
+```
+
+### Lints and fixes files
+```
+npm run lint
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).

babel.config.js

@@ -0,0 +1,14 @@
+module.exports = {
+    presets: [
+        '@vue/app'
+    ],
+    plugins: [
+        [
+            "component",
+            {
+                "libraryName": "element-ui",
+                "styleLibraryName": "theme-chalk"
+            }
+        ]
+    ]
+}

package.json

@@ -0,0 +1,36 @@
+{
+    "name": "point-standard",
+    "version": "0.1.0",
+    "private": true,
+    "scripts": {
+        "serve": "vue-cli-service serve",
+        "build": "vue-cli-service build"
+    },
+    "dependencies": {
+        "axios": "^0.18.0",
+        "echarts": "^4.1.0",
+        "element-ui": "^2.5.4",
+        "handsontable-pro": "^3.0.0",
+        "vue": "^2.5.22",
+        "vue-router": "^3.0.1",
+        "vuex": "^3.0.1"
+    },
+    "devDependencies": {
+        "@vue/cli-plugin-babel": "^3.4.0",
+        "@vue/cli-service": "^3.4.0",
+        "babel-plugin-component": "^1.1.1",
+        "node-sass": "^4.9.0",
+        "sass-loader": "^7.1.0",
+        "vue-template-compiler": "^2.5.21"
+    },
+    "postcss": {
+        "plugins": {
+            "autoprefixer": {}
+        }
+    },
+    "browserslist": [
+        "> 1%",
+        "last 2 versions",
+        "not ie <= 8"
+    ]
+}

public/index.html

@@ -0,0 +1,17 @@
+<!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>point-standard</title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but point-standard 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>

src/App.vue

@@ -0,0 +1,10 @@
+<template>
+  <div id="app">
+    <keep-alive>
+      <router-view/>
+    </keep-alive>
+  </div>
+</template>
+
+<style lang="scss">
+</style>

src/assets/css/jsmind.css

@@ -0,0 +1,477 @@
+/*
+ * Released under BSD License
+ * Copyright (c) 2014-2015 hizzgdev@163.com
+ * 
+ * Project Home:
+ *   https://github.com/hizzgdev/jsmind/
+ */
+
+
+/* important section */
+
+.jsmind-inner {
+    position: relative;
+    overflow: auto;
+    width: 100%;
+    height: 100%;
+}
+
+
+/*box-shadow:0 0 2px #000;*/
+
+.jsmind-inner {
+    moz-user-select: -moz-none;
+    -moz-user-select: none;
+    -o-user-select: none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+
+/* z-index:1 */
+
+canvas {
+    position: absolute;
+    z-index: 1;
+}
+
+
+/* z-index:2 */
+
+jmnodes {
+    position: absolute;
+    z-index: 2;
+    background-color: rgba(0, 0, 0, 0);
+}
+
+
+/*background color is necessary*/
+
+jmnode {
+    position: absolute;
+    cursor: default;
+    max-width: 400px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+jmexpander {
+    position: absolute;
+    width: 11px;
+    height: 11px;
+    display: block;
+    overflow: hidden;
+    line-height: 12px;
+    font-size: 12px;
+    text-align: center;
+    border-radius: 6px;
+    border-width: 1px;
+    border-style: solid;
+    cursor: pointer;
+}
+
+
+/* default theme */
+
+jmnode {
+    padding: 10px;
+    background-color: #fff;
+    color: #333;
+    border-radius: 5px;
+    box-shadow: 1px 1px 1px #666;
+    font: 16px/1.125 Verdana, Arial, Helvetica, sans-serif;
+}
+
+jmnode:hover {
+    box-shadow: 2px 2px 8px #000;
+    background-color: #ebebeb;
+    color: #333;
+}
+
+jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+    box-shadow: 2px 2px 8px #000;
+}
+
+jmnode.root {
+    font-size: 24px;
+}
+
+jmexpander {
+    border-color: gray;
+}
+
+jmexpander:hover {
+    border-color: #000;
+}
+
+@media screen and (max-device-width: 1024px) {
+    jmnode {
+        padding: 5px;
+        border-radius: 3px;
+        font-size: 14px;
+    }
+    jmnode.root {
+        font-size: 21px;
+    }
+}
+
+
+/* primary theme */
+
+jmnodes.theme-primary jmnode {
+    background-color: #428bca;
+    color: #fff;
+    border-color: #357ebd;
+}
+
+jmnodes.theme-primary jmnode:hover {
+    background-color: #3276b1;
+    border-color: #285e8e;
+}
+
+jmnodes.theme-primary jmnode.selected {
+    background-color: #f1c40f;
+    color: #fff;
+}
+
+jmnodes.theme-primary jmnode.root {}
+
+jmnodes.theme-primary jmexpander {}
+
+jmnodes.theme-primary jmexpander:hover {}
+
+
+/* warning theme */
+
+jmnodes.theme-warning jmnode {
+    background-color: #f0ad4e;
+    border-color: #eea236;
+    color: #fff;
+}
+
+jmnodes.theme-warning jmnode:hover {
+    background-color: #ed9c28;
+    border-color: #d58512;
+}
+
+jmnodes.theme-warning jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-warning jmnode.root {}
+
+jmnodes.theme-warning jmexpander {}
+
+jmnodes.theme-warning jmexpander:hover {}
+
+
+/* danger theme */
+
+jmnodes.theme-danger jmnode {
+    background-color: #d9534f;
+    border-color: #d43f3a;
+    color: #fff;
+}
+
+jmnodes.theme-danger jmnode:hover {
+    background-color: #d2322d;
+    border-color: #ac2925;
+}
+
+jmnodes.theme-danger jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-danger jmnode.root {}
+
+jmnodes.theme-danger jmexpander {}
+
+jmnodes.theme-danger jmexpander:hover {}
+
+
+/* success theme */
+
+jmnodes.theme-success jmnode {
+    background-color: #5cb85c;
+    border-color: #4cae4c;
+    color: #fff;
+}
+
+jmnodes.theme-success jmnode:hover {
+    background-color: #47a447;
+    border-color: #398439;
+}
+
+jmnodes.theme-success jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-success jmnode.root {}
+
+jmnodes.theme-success jmexpander {}
+
+jmnodes.theme-success jmexpander:hover {}
+
+
+/* info theme */
+
+jmnodes.theme-info jmnode {
+    background-color: #5dc0de;
+    border-color: #46b8da;
+    ;
+    color: #fff;
+}
+
+jmnodes.theme-info jmnode:hover {
+    background-color: #39b3d7;
+    border-color: #269abc;
+}
+
+jmnodes.theme-info jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-info jmnode.root {}
+
+jmnodes.theme-info jmexpander {}
+
+jmnodes.theme-info jmexpander:hover {}
+
+
+/* greensea theme */
+
+jmnodes.theme-greensea jmnode {
+    background-color: #1abc9c;
+    color: #fff;
+}
+
+jmnodes.theme-greensea jmnode:hover {
+    background-color: #16a085;
+}
+
+jmnodes.theme-greensea jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-greensea jmnode.root {}
+
+jmnodes.theme-greensea jmexpander {}
+
+jmnodes.theme-greensea jmexpander:hover {}
+
+
+/* nephrite theme */
+
+jmnodes.theme-nephrite jmnode {
+    background-color: #2ecc71;
+    color: #fff;
+}
+
+jmnodes.theme-nephrite jmnode:hover {
+    background-color: #27ae60;
+}
+
+jmnodes.theme-nephrite jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-nephrite jmnode.root {}
+
+jmnodes.theme-nephrite jmexpander {}
+
+jmnodes.theme-nephrite jmexpander:hover {}
+
+
+/* belizehole theme */
+
+jmnodes.theme-belizehole jmnode {
+    background-color: #3498db;
+    color: #fff;
+}
+
+jmnodes.theme-belizehole jmnode:hover {
+    background-color: #2980b9;
+}
+
+jmnodes.theme-belizehole jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-belizehole jmnode.root {}
+
+jmnodes.theme-belizehole jmexpander {}
+
+jmnodes.theme-belizehole jmexpander:hover {}
+
+
+/* wisteria theme */
+
+jmnodes.theme-wisteria jmnode {
+    background-color: #9b59b6;
+    color: #fff;
+}
+
+jmnodes.theme-wisteria jmnode:hover {
+    background-color: #8e44ad;
+}
+
+jmnodes.theme-wisteria jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-wisteria jmnode.root {}
+
+jmnodes.theme-wisteria jmexpander {}
+
+jmnodes.theme-wisteria jmexpander:hover {}
+
+
+/* asphalt theme */
+
+jmnodes.theme-asphalt jmnode {
+    background-color: #34495e;
+    color: #fff;
+}
+
+jmnodes.theme-asphalt jmnode:hover {
+    background-color: #2c3e50;
+}
+
+jmnodes.theme-asphalt jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-asphalt jmnode.root {}
+
+jmnodes.theme-asphalt jmexpander {}
+
+jmnodes.theme-asphalt jmexpander:hover {}
+
+
+/* orange theme */
+
+jmnodes.theme-orange jmnode {
+    background-color: #f1c40f;
+    color: #fff;
+}
+
+jmnodes.theme-orange jmnode:hover {
+    background-color: #f39c12;
+}
+
+jmnodes.theme-orange jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-orange jmnode.root {}
+
+jmnodes.theme-orange jmexpander {}
+
+jmnodes.theme-orange jmexpander:hover {}
+
+
+/* pumpkin theme */
+
+jmnodes.theme-pumpkin jmnode {
+    background-color: #e67e22;
+    color: #fff;
+}
+
+jmnodes.theme-pumpkin jmnode:hover {
+    background-color: #d35400;
+}
+
+jmnodes.theme-pumpkin jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-pumpkin jmnode.root {}
+
+jmnodes.theme-pumpkin jmexpander {}
+
+jmnodes.theme-pumpkin jmexpander:hover {}
+
+
+/* pomegranate theme */
+
+jmnodes.theme-pomegranate jmnode {
+    background-color: #e74c3c;
+    color: #fff;
+}
+
+jmnodes.theme-pomegranate jmnode:hover {
+    background-color: #c0392b;
+}
+
+jmnodes.theme-pomegranate jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-pomegranate jmnode.root {}
+
+jmnodes.theme-pomegranate jmexpander {}
+
+jmnodes.theme-pomegranate jmexpander:hover {}
+
+
+/* clouds theme */
+
+jmnodes.theme-clouds jmnode {
+    background-color: #ecf0f1;
+    color: #333;
+}
+
+jmnodes.theme-clouds jmnode:hover {
+    background-color: #bdc3c7;
+}
+
+jmnodes.theme-clouds jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-clouds jmnode.root {}
+
+jmnodes.theme-clouds jmexpander {}
+
+jmnodes.theme-clouds jmexpander:hover {}
+
+
+/* asbestos theme */
+
+jmnodes.theme-asbestos jmnode {
+    background-color: #95a5a6;
+    color: #fff;
+}
+
+jmnodes.theme-asbestos jmnode:hover {
+    background-color: #7f8c8d;
+}
+
+jmnodes.theme-asbestos jmnode.selected {
+    background-color: #11f;
+    color: #fff;
+}
+
+jmnodes.theme-asbestos jmnode.root {}
+
+jmnodes.theme-asbestos jmexpander {}
+
+jmnodes.theme-asbestos jmexpander:hover {}

src/assets/scss/common.scss

@@ -0,0 +1,108 @@
+$borderWidth: 1px;
+$borderColor: #ccc;
+$hoverColor: #409EFF;
+$w: 1200px;
+$radiusWidth: 4px;
+$size3: 23px;
+.saga-size3 {
+    font-size: $size3;
+}
+
+.saga-border {
+    border: $borderWidth solid $borderColor;
+    box-sizing: border-box;
+    border-radius: $radiusWidth;
+}
+
+.border-hover {}
+
+.border-hover:hover {
+    border-color: $hoverColor;
+}
+
+.saga-dashed-border {
+    border: $borderWidth dashed $borderColor;
+    border-radius: $radiusWidth;
+}
+
+.flex {
+    display: flex;
+    justify-content: space-around;
+}
+
+.saga-fill {
+    width: 100%;
+    height: 100%;
+}
+
+.margin5 {
+    margin: 18px;
+}
+
+.dcenter {
+    margin-left: auto;
+    margin-right: auto;
+}
+
+.h1 {
+    font-size: 24px;
+    color: #8E9CC1;
+}
+
+.h3 {
+    font-size: 14px;
+    color: #333;
+}
+
+.h5 {
+    font-size: 12px;
+    color: #999;
+}
+
+.center {
+    text-align: center;
+}
+
+.padding10 {
+    padding: 10px;
+}
+
+.bg-F5 {
+    background: #F5FCFF;
+}
+
+.block {
+    display: block;
+}
+
+.w {
+    width: $w;
+}
+
+.h100 {
+    height: 100%;
+}
+
+.p-over2 {
+    text-overflow: -o-ellipsis-lastline;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2; //这儿的数字代表的就是你所需要实现效果的第N行
+    -webkit-box-orient: vertical;
+    overflow-wrap: break-word;
+}
+
+.pointer {
+    cursor: pointer;
+}
+
+@media screen and (max-width: 1200px) {
+    .w {
+        width: 960px;
+    }
+    html {
+        overflow-x: auto;
+        overflow-y: auto;
+    }
+}

src/assets/scss/reset.scss

@@ -0,0 +1,321 @@
+$WinWitdh:1200px;
+$BaseC:#555;
+$LinkC:#06f;
+$HoverC:#f60;
+$FontSize:13px;
+// mixins
+@mixin dz($time:0.25s) {
+    -webkit-transition: all $time ease-in-out;
+    -moz-transition: all $time ease-in-out;
+    -o-transition: all $time ease-in-out;
+    transition: all $time ease-in-out;
+}
+
+// @charset "UTF-8";
+body,
+ul,
+ol,
+dl,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+pre,
+form,
+fieldset,
+legend,
+input,
+button,
+textarea,
+p,
+blockquote,
+table,
+th,
+td,
+menu {
+    margin: 0;
+    padding: 0
+}
+
+html,
+body,
+#app {
+    height: 100%;
+    width: 100%;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+    table-layout: fixed
+}
+
+ul,
+ol,
+menu {
+    list-style: none
+}
+
+fieldset,
+img {
+    border: none
+}
+
+img,
+object,
+select,
+input,
+textarea,
+button {
+    vertical-align: middle
+}
+
+input,
+textarea,
+select,
+address,
+caption,
+cite,
+code,
+dfn,
+em,
+i,
+b,
+strong,
+small,
+th,
+var,
+abbr {
+    font-size: 100%;
+    font-style: normal
+}
+
+caption,
+th {
+    text-align: left;
+}
+
+article,
+aside,
+footer,
+header,
+hgroup,
+nav,
+section,
+figure,
+figcaption {
+    display: block;
+}
+
+code,
+kbd,
+pre,
+samp,
+tt {
+    font-family: Consolas, "Courier New", Courier, monospace;
+}
+
+address,
+cite,
+dfn,
+em,
+var,
+i {
+    font-style: normal;
+}
+
+blockquote,
+q {
+    quotes: none;
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+    content: "";
+    content: none;
+}
+
+a {
+    color: $LinkC;
+    text-decoration: none;
+    cursor: pointer;
+    &:link,
+    &:visited,
+    &:active {
+        color: $LinkC;
+    }
+    &:hover,
+    &:focus {
+        color: $HoverC;
+        text-decoration: underline;
+        outline: none;
+    }
+    &,
+    span,
+    i,
+    em,
+    u,
+    strong,
+    b,
+    p,
+    img,
+    ul,
+    li,
+    div,
+    dd,
+    dt,
+    dl,
+    ol,
+    table,
+    th,
+    td,
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6,
+    input,
+    textarea,
+    button,
+    small,
+    select {
+        cursor: pointer;
+        @include dz;
+    }
+}
+
+abbr[title],
+acronym[title] {
+    border-bottom: 1px dotted;
+    cursor: help;
+}
+
+// base by fungleo
+html {
+    min-width: $WinWitdh;
+    // overflow-y: scroll;
+}
+
+body {
+    font-size: $FontSize;
+    color: $BaseC;
+    line-height: 2;
+}
+
+body,
+button,
+input,
+select,
+textarea {
+    font-family: tahoma, Helvetica, Arial, "\5FAE\8F6F\96C5\9ED1";
+    *font-family: "\5FAE\8F6F\96C5\9ED1";
+}
+
+h1 {
+    font-size: $FontSize+10;
+}
+
+h2 {
+    font-size: $FontSize+8;
+}
+
+h3 {
+    font-size: $FontSize+6;
+}
+
+h4 {
+    font-size: $FontSize+4;
+}
+
+h5 {
+    font-size: $FontSize+2;
+}
+
+h6 {
+    font-size: $FontSize;
+}
+
+hr {
+    border: none;
+    height: 1px;
+    background: lighten($BaseC, 50%);
+}
+
+.fl {
+    float: left;
+}
+
+.fr {
+    float: right;
+}
+
+.tl {
+    text-align: left;
+}
+
+.tr {
+    text-align: right;
+}
+
+.tc {
+    text-align: center;
+}
+
+.cf:before,
+.cf:after,
+.web:before,
+.web:after,
+.web_:before,
+.web_:after {
+    content: "";
+    display: table;
+}
+
+.cf:after,
+.web:after,
+.web_:after {
+    clear: both;
+}
+
+.cf {
+    zoom: 1;
+}
+
+.web {
+    width: $WinWitdh;
+    margin-left: auto;
+    margin-right: auto;
+    zoom: 1;
+}
+
+.web_ {
+    min-width: $WinWitdh;
+    width: 100%;
+    zoom: 1;
+}
+
+.block {
+    display: block;
+}
+
+.none {
+    display: none
+}
+
+.clear {
+    clear: both;
+}
+
+.fl {
+    float: left;
+}
+
+.disIne {
+    display: inline-block;
+}

src/components/common/bread_crumb.vue

@@ -0,0 +1,26 @@
+<template>
+  <el-breadcrumb separator-class="el-icon-arrow-right">
+    <template v-for="item in brandArr">
+      <el-breadcrumb-item :to="{ path: item.path }">{{item.name}}</el-breadcrumb-item>
+    </template>
+  </el-breadcrumb>
+</template>
+<script>
+import { mapGetters, mapActions } from "vuex";
+export default {
+  data() { return {} },
+  computed: {
+    ...mapGetters("bread", [
+      "isShow",
+      "brandArr"
+    ])
+  },
+  created() {
+    console.log(this.isShow, this.brandArr)
+  },
+  mounted() { },
+  methods: {}
+}
+</script>
+<style>
+</style>

src/components/common/handsontable.vue

@@ -0,0 +1,75 @@
+<!--
+    id: 选填，没有得话给随机id
+    settting: handsontable得配置，其中必填data选项
+-->
+
+<template>
+  <div style="height: 100%;">
+    <div :id="id"></div>
+  </div>
+</template>
+<script>
+
+import Handsontable from "handsontable-pro"
+import './../../../node_modules/handsontable-pro/dist/handsontable.full.css'
+import zhCN from 'handsontable-pro/languages/zh-CN';
+
+export default {
+  props: {
+    id: {
+      type: String,
+      default: function createRandomId() {
+        return (Math.random() * 10000000).toString(16).substr(0, 4) + '-' + (new Date()).getTime() + '-' + Math.random().toString().substr(2, 5);
+      }
+    },
+    // settings: {//必填
+    //   type: Object
+    // }
+  },
+  data() { return {} },
+  created() { },
+  mounted() {
+    // console.log(handsontable)
+    // this.init()
+  },
+  methods: {
+
+    getElement() {
+      return {
+        width: document.getElementById(this.id).clientWidth,
+        height: document.getElementById(this.id).parentNode.clientHeight
+      }
+    },
+    init(settings) {
+      console.log("init")
+      var hotElement = document.getElementById(this.id)
+      var hotSettings = Object.assign({
+        width: this.getElement().width,
+        rowHeaders: true,
+        colHeaders: true,
+        filters: true,
+        height: this.getElement().height,
+        columnSorting: true, //添加排序
+        sortIndicator: true, //添加排序
+        renderAllRows: true,
+        autoColumnSize: true,
+        language: "zh-CN",
+        manualColumnResize: true,
+        manualColumnMove: true,
+        dropdownMenu: [
+          "filter_by_condition",
+          "filter_action_bar"
+        ]
+      }, settings);
+      console.log(hotSettings, settings)
+      var hot = new Handsontable(hotElement, hotSettings);
+      let pro = document.getElementById("hot-display-license-info");
+      if (!!pro) {
+        pro.parentNode.removeChild(pro);
+      }
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/components/common/jsmind.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="h100">
+    <div :id="id" style="width:100%;height:100%;"></div>
+  </div>
+</template>
+<script>
+import "assets/js/jsmind.js"
+import "assets/css/jsmind.css"
+export default {
+  name: "jsMindComponent",
+  props: {
+    id: {
+      type: String,
+      default: function createRandomId() {
+        return (Math.random() * 10000000).toString(16).substr(0, 4) + '-' + (new Date()).getTime() + '-' + Math.random().toString().substr(2, 5);
+      }
+    },
+  },
+  data() { return {} },
+  created() {
+    console.log(111)
+  },
+  mounted() {
+    console.log(jsMind)
+  },
+  methods: {
+    initData(options, data) {
+      let option = Object.assign({
+        container: this.id,
+        editable: true,
+        theme: 'orange'
+      }, options)
+      var el = {
+        container: this.id,
+        editable: true, //是否启用编辑
+        theme: "greensea", //主题
+        mode: "side", //显示模式
+        support_html: true //是否支持节点里的HTML元素
+      };
+      console.log(document.getElementById(this.id).clientWidth, document.getElementById(this.id).clientHeight)
+      var jm = new jsMind(el)
+      jm.show(data)
+      console.log(jm)
+      //   return jm
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/components/config_point/cut_string.vue

@@ -0,0 +1,66 @@
+<template>
+  <div class="flex">
+    <template v-for="(item,index) in stringArr">
+      <span
+        @click="checkItem(item,index)"
+        :class="{'bg': (arr.indexOf(index) > -1)} "
+        class="cut-string saga-border pointer border-hover"
+      >{{item}}</span>
+    </template>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    string: {
+      type: String,
+      default: "大家看法的帅哥"
+    }
+  },
+  data() {
+    return {
+      stringArr: this.string.split(""),
+      obj: {},
+      arr: []
+    }
+  },
+  created() {
+  },
+  mounted() { },
+  methods: {
+    checkItem(item, index) {
+      this.obj[index] = item
+      this.arr.push(index)
+    },
+    clear() {
+      this.stringArr = this.string.split("")
+      this.obj = {}
+      this.arr = []
+    },
+    getData() {
+      let string = ""
+      for (let key in this.obj) {
+        string += this.obj[key]
+      }
+      console.log(string)
+      return string
+    }
+  },
+  watch: {
+    string: function () {
+      this.clear()
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.cut-string {
+  width: 50px;
+  height: 50px;
+  text-align: center;
+  line-height: 50px;
+}
+.bg {
+  background: red;
+}
+</style>

src/components/config_point/data_origin.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="saga-fill">
+    <div class="saga-title center h1">{{reanderData.name}}</div>
+    <div class="center h3">通讯协议：{{reanderData.name}}</div>
+    <div class="padding10 bg-F5">
+      <p class="p-over2 h5">{{reanderData.note}}</p>
+    </div>
+    <div class="doughnut-view">
+      <doughnut width="200" height="200" :id="id"></doughnut>
+    </div>
+    <slot></slot>
+  </div>
+</template>
+<script>
+
+import doughnut from "components/echarts/doughnut"
+
+export default {
+  name: "dataOrgin",
+  components: {
+    doughnut
+  },
+  props: {
+    id: {
+      type: String
+    },
+    reanderData: {
+      type: Object,
+      default: function () {
+        return {}
+      }
+    }
+  },
+  data() { return {} },
+  created() { },
+  mounted() { },
+  methods: {}
+}
+</script>
+
+<style lang="scss" scoped>
+.doughnut-view {
+  height: 300px;
+  width: 100%;
+  padding: 5px;
+  box-sizing: border-box;
+}
+</style>
+

src/components/config_point/dialog_main.vue

@@ -0,0 +1,20 @@
+<!--steps3的左侧-->
+<template>
+  <div>
+    <select-one></select-one>
+  </div>
+</template>
+<script>
+import selectOne from "components/config_point/select_one"
+export default {
+  data() { return {} },
+  created() { },
+  mounted() { },
+  methods: {},
+  components: {
+    selectOne
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/components/config_point/ip_input.vue

@@ -0,0 +1,143 @@
+<template>
+  <ul class="ipAdress">
+    <li v-for="(item,index) in ipAdress" class="saga-border">
+      <input
+        type="text"
+        @input="checkIpVal(item,index)"
+        @keyup="turnIpPOS(item,index,$event)"
+        v-model="item.value"
+        ref="ipInput"
+        @blur="setDefaultVal(item)"
+      >
+      <!-- <div></div> -->
+    </li>
+    <span>：</span>
+    <li class="saga-border">
+      <input
+        type="text"
+        @input="checkIpVal(value,4)"
+        @keyup="turnIpPOS(value,4,$event)"
+        v-model="value.value"
+        ref="ipInput"
+        @blur="setDefaultVal(value)"
+      >
+      <!-- <div></div> -->
+    </li>
+  </ul>
+</template>
+<script>
+export default {
+  name: "ipInput",
+  data() {
+    return {
+      ipAdress: [{
+        value: ''
+      }, {
+        value: ''
+      }, {
+        value: ''
+      }, {
+        value: ''
+      }],
+      value: [{
+        value: ''
+      }]
+    }
+  },
+  created() { },
+  mounted() { },
+  methods: {
+    //methods
+    checkIpVal(item, index) {
+      let self = this;
+      //确保每个值都处于0-255
+      let val = item.value;
+      //当输入的是空格时，值赋为空
+      val = val.trim();
+      val = parseInt(val, 10);
+      if (isNaN(val)) {
+        val = ''
+      } else {
+        if (index == 4) {
+          val = val < 0 ? 0 : val;
+          val = val > 65535 ? 65535 : val;
+        } else {
+          val = val < 0 ? 0 : val;
+          val = val > 255 ? 255 : val;
+        }
+      }
+      item.value = val;
+    },
+    turnIpPOS(item, index, event) {
+      let self = this;
+      let e = event || window.event;
+      //左箭头向左跳转，左一不做任何措施
+      if (e.keyCode == 37) {
+        if (index == 0) { } else {
+          self.$refs.ipInput[index - 1].focus();
+        }
+      }
+      //删除键把当前数据删除完毕后会跳转到前一个input，左一不做任何处理
+      if (e.keyCode == 8) {
+        let val = item.value;
+        if (index == 0) { } else {
+          self.$refs.ipInput[index - 1].focus();
+        }
+      }
+      //右箭头、回车键、空格键、冒号均向右跳转，右一不做任何措施
+      if (e.keyCode == 39 || e.keyCode == 13 || e.keyCode == 32 || e.keyCode == 190) {
+        if (index == 4) { } else {
+          self.$refs.ipInput[index + 1].focus();
+        }
+      }
+    },
+    setDefaultVal(item) {
+      //当input失去焦点，而ip没有赋值时，会自动赋值为0
+      let self = this;
+      let val = item.value;
+      if (val == '') {
+        item.value = '0';
+      }
+    },
+  }
+}
+</script>
+<style lang="scss" scoped>
+.ipAdress {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  margin-right: 10px;
+  justify-content: space-around;
+}
+.ipAdress li {
+  position: relative;
+  //   height: 23px;
+  margin: 2px;
+}
+ul[class="ipAdress"] input[type="text"] {
+  border: none;
+  width: 100%;
+  //   height: 23px;
+  text-align: center;
+  background: transparent;
+}
+.ipAdress li div {
+  position: absolute;
+  bottom: 2px;
+  right: 0;
+  border-radius: 50%;
+  background: #0190fe;
+  width: 2px;
+  height: 2px;
+}
+/*只需要3个div*/
+.ipAdress li:last-child div {
+  display: none;
+}
+/*取消掉默认的input focus状态*/
+.ipAdress input:focus {
+  outline: none;
+}
+</style>

src/components/config_point/select_one.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="select-own-one">
+    <p>{{name}}</p>
+  </div>
+</template>
+<script>
+export default {
+  name: "select_one",
+  props: {
+    name: {
+      type: String,
+      default: "原始点位描述"
+    },
+    isOK: {
+      type: Boolean,
+      default: false
+    },
+    rendData: {
+      type: Array,
+      default: function () {
+        return [
+          {
+            name: "222"
+          }
+        ]
+      }
+    }
+  },
+  data() { return {} },
+  created() { },
+  mounted() { },
+  methods: {}
+}
+</script>
+<style lang="scss" scoped>
+.select-own-one {
+  height: 100%;
+  width: 160px;
+  overflow-y: auto;
+}
+</style>

src/components/echarts/doughnut.vue

@@ -0,0 +1,104 @@
+<template>
+  <div style="width:100%;height:100%;" :id="id"></div>
+</template>
+<script>
+import echarts from "echarts"
+export default {
+  name: "doughnut",
+  props: {
+    id: {
+      type: String
+    },
+    reanderData: {
+      type: Object,
+      default: function () {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      myCharts: null
+    }
+  },
+  created() { },
+  mounted() {
+    this.drawDoughnut()
+  },
+  methods: {
+    drawDoughnut() {
+      let options = {
+        tooltip: {
+          trigger: 'item',
+          formatter: "{a} <br/>{b}: {c} ({d}%)"
+        },
+        legend: {
+          orient: 'horizontal',
+          x: 'center', // 'center'
+          data: ['1', '2', '3']
+        },
+        graphic: {
+          type: 'text',
+          left: 'center',
+          top: 'center',
+          style: {
+            text: '数据源\n1111',
+            textAlign: 'center',
+            fill: '#000',
+            width: 30,
+            height: 30
+          }
+        },
+        series: [
+          {
+            name: '数据来源',
+            type: 'pie',
+            radius: ['40%', '60%'],
+            itemStyle: {
+              normal: {
+                label: {
+                  show: false,
+                  textStyle: { color: '#3c4858', fontSize: "9" },
+                  //   formatter: function (val) {   //让series 中的文字进行换行
+                  //     return val.name.split("-").join("\n");                  }
+                },
+                title: {
+                  text: 'aaaa'
+                },
+                labelLine: {
+                  show: false,
+                  lineStyle: { color: '#3c4858' }
+                }
+              },
+              emphasis: {
+                shadowBlur: 5,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)',
+                textColor: '#000'
+              }
+            },
+            data: [
+              { value: 20, name: "1" },
+              { value: 20, name: "2" },
+              { value: 15, name: "3" }
+            ]
+          }
+        ],
+        color: ['#9DA2D6', '#FBACA1', '#FFE37F']
+      }
+      this.myCharts = echarts.init(document.getElementById(this.id))
+      this.myCharts.setOption(options)
+    },
+  },
+  watch: {
+    reanderData: {
+      deep: true,
+      handler: function () {
+        this.drawDoughnut()
+      }
+    }
+  }
+}
+</script>
+<style>
+</style>

src/components/el_pack/dialog.vue

@@ -0,0 +1,76 @@
+
+
+<template>
+  <el-dialog
+    :title="title"
+    :close-on-press-escape="escape"
+    :close-on-click-modal="isModel"
+    :visible.sync="dialogVisible"
+    :width="width"
+    :before-close="cancel"
+  >
+    <slot></slot>
+    <span v-if="!!footer" slot="footer" class="dialog-footer">
+      <el-button @click="cancel">{{footer.cancel ? footer.cancel : "取 消"}}</el-button>
+      <el-button type="primary" @click="confirm">{{footer.confirm ? footer.confirm : "确 定"}}</el-button>
+    </span>
+  </el-dialog>
+</template>
+<script>
+export default {
+  /**
+   * props //#endregion
+   * @param width  宽度，选填。默认40%，非必填
+   * @param dialogVisible  dialog是否显示，必填，默认false
+   * @param footer   dialog的下级footer的文案{cancel:'',confirm: ''}默认undefind，非必填
+   * @param isModel  model层点击隐藏dialog，非必填，默认true
+   * @param escape  键盘点击esc隐藏dialog,非必填，默认true
+   * @param title  表头文案，默认‘必填’
+   * 
+   * @event cancel 取消事件，父组件必填
+   * @event confirm 确定事件，非必填
+   */
+  name: "ownDialog",
+  props: {
+    width: {
+      type: String,
+      default: "40%"
+    },
+    dialogVisible: {
+      type: Boolean,
+      default: false
+    },
+    footer: {
+      type: [Object, undefined],
+      default: undefined
+    },
+    isModel: {
+      type: Boolean,
+      default: true
+    },
+    escape: {
+      type: Boolean,
+      default: true
+    },
+    title: {
+      type: String,
+      default: "提示"
+    }
+  },
+  data() { return {} },
+  created() { },
+  mounted() {
+
+  },
+  methods: {
+    cancel() {
+      this.$emit("cancel")
+    },
+    confirm() {
+      this.$emit("confirm")
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/element_config/index.js

@@ -0,0 +1,146 @@
+import Vue from 'vue';
+import {
+    Pagination,
+    Dialog,
+    Autocomplete,
+    Dropdown,
+    DropdownMenu,
+    DropdownItem,
+    Menu,
+    Submenu,
+    MenuItem,
+    MenuItemGroup,
+    Input,
+    InputNumber,
+    Radio,
+    RadioGroup,
+    RadioButton,
+    Checkbox,
+    CheckboxButton,
+    CheckboxGroup,
+    Switch,
+    Select,
+    Option,
+    OptionGroup,
+    Button,
+    ButtonGroup,
+    Table,
+    TableColumn,
+    DatePicker,
+    TimeSelect,
+    TimePicker,
+    Popover,
+    Tooltip,
+    Breadcrumb,
+    BreadcrumbItem,
+    Form,
+    FormItem,
+    Tabs,
+    TabPane,
+    Tag,
+    Tree,
+    Alert,
+    Slider,
+    Icon,
+    Row,
+    Col,
+    Upload,
+    Progress,
+    Badge,
+    Card,
+    Rate,
+    Steps,
+    Step,
+    Carousel,
+    CarouselItem,
+    Collapse,
+    CollapseItem,
+    Cascader,
+    ColorPicker,
+    Transfer,
+    Container,
+    Header,
+    Aside,
+    Main,
+    Footer,
+    Loading,
+    MessageBox,
+    Message,
+    Notification
+} from 'element-ui';
+
+Vue.prototype.$ELEMENT = { size: 'small', zIndex: 3000 };
+
+Vue.use(Pagination);
+Vue.use(Dialog);
+Vue.use(Autocomplete);
+Vue.use(Dropdown);
+Vue.use(DropdownMenu);
+Vue.use(DropdownItem);
+Vue.use(Menu);
+Vue.use(Submenu);
+Vue.use(MenuItem);
+Vue.use(MenuItemGroup);
+Vue.use(Input);
+Vue.use(InputNumber);
+Vue.use(Radio);
+Vue.use(RadioGroup);
+Vue.use(RadioButton);
+Vue.use(Checkbox);
+Vue.use(CheckboxButton);
+Vue.use(CheckboxGroup);
+Vue.use(Switch);
+Vue.use(Select);
+Vue.use(Option);
+Vue.use(OptionGroup);
+Vue.use(Button);
+Vue.use(ButtonGroup);
+Vue.use(Table);
+Vue.use(TableColumn);
+Vue.use(DatePicker);
+Vue.use(TimeSelect);
+Vue.use(TimePicker);
+Vue.use(Popover);
+Vue.use(Tooltip);
+Vue.use(Breadcrumb);
+Vue.use(BreadcrumbItem);
+Vue.use(Form);
+Vue.use(FormItem);
+Vue.use(Tabs);
+Vue.use(TabPane);
+Vue.use(Tag);
+Vue.use(Tree);
+Vue.use(Alert);
+Vue.use(Slider);
+Vue.use(Icon);
+Vue.use(Row);
+Vue.use(Col);
+Vue.use(Upload);
+Vue.use(Progress);
+Vue.use(Badge);
+Vue.use(Card);
+Vue.use(Rate);
+Vue.use(Steps);
+Vue.use(Step);
+Vue.use(Carousel);
+Vue.use(CarouselItem);
+Vue.use(Collapse);
+Vue.use(CollapseItem);
+Vue.use(Cascader);
+Vue.use(ColorPicker);
+Vue.use(Transfer);
+Vue.use(Container);
+Vue.use(Header);
+Vue.use(Aside);
+Vue.use(Main);
+Vue.use(Footer);
+
+Vue.use(Loading.directive);
+
+Vue.prototype.$loading = Loading.service;
+Vue.prototype.$msgbox = MessageBox;
+Vue.prototype.$alert = MessageBox.alert;
+Vue.prototype.$confirm = MessageBox.confirm;
+Vue.prototype.$prompt = MessageBox.prompt;
+Vue.prototype.$notify = Notification;
+Vue.prototype.$message = Message;

src/fetch/fetch.js

@@ -0,0 +1,36 @@
+import axios from "axios";
+
+//axios 配置
+
+const instance = axios.create({
+    headers: {
+        "Content-Type": "application/json"
+    },
+    timeout: 30000,
+    baseURL: "", //接口请求地址
+})
+
+instance.interceptors.request.use(config => {
+    // 在发送请求之前做些什么，比如传token
+    const token = localStorage.getItem('token');
+    if (token) {
+        config.headers.Authorization = token;
+    }
+    //config.data = JSON.stringify(config.data);
+    return config
+}, error => {
+    console.log(error)
+    return Promise.reject(error)
+})
+
+// 添加相应拦截器
+instance.interceptors.response.use(response => {
+    //对相应的数据做处理
+    const res = response;
+    return res;
+}, error => {
+    console.error(error)
+    return Promise.reject(error)
+})
+
+export default instance

src/fetch/index.js

@@ -0,0 +1,7 @@
+import {get, post, request } from './request'
+
+let dataForm = '/data-platform-3'
+
+export function getTest(success) {
+    return get(`${dataForm}/dict/query/equipment_family`, {}, success)
+}

src/fetch/request.js

@@ -0,0 +1,87 @@
+import instance from "./fetch"
+
+import { Message } from 'element-ui';
+import router from '@/router/index.js'
+
+function successResponse(response, success, failed) {
+    let res = response.data;
+    let result = res.result || res.Result;
+    if (result == "success") {
+        success(res)
+    } else if (result == "failure") {
+        let msg = res.ResultMsg || res.message || res.Message || res.resultMsg
+        Message.error({ message: msg })
+    } else {
+        router.replace('/login')
+    }
+}
+
+function errorResponse(response, err) {
+    let json = JSON.stringify(err),
+        lastData = JSON.parse(json)
+    console.log(err)
+    if (lastData.hasOwnProperty('config')) {
+        Message.error({ message: '接口：' + lastData.config.url + '请求错误' })
+    } else {
+        Message.error({ message: '请求错误:' + err });
+    }
+}
+
+
+/**
+ * post 请求方法
+ * @param url
+ * @param data
+ * @returns {Promise}
+ */
+export function post(url, data = {}, success) {
+    instance.post(url, data).then(response => {
+        //对接口错误码做处理
+        successResponse(response, success)
+    }, err => {
+        errorResponse({}, err)
+    })
+}
+
+
+/**
+ * get 请求方法
+ * @param url
+ * @param data
+ * @returns {Promise}
+ */
+export function get(url, data = {}, success) {
+    instance.get(url, {
+            params: data
+        })
+        .then(response => {
+            successResponse(response, success)
+        })
+        .catch(err => {
+            errorResponse({}, err)
+        })
+}
+
+/**
+ * 封装所有请求
+ * @param methed
+ * @param url
+ * @param data 
+ * @param headers
+ * @returns {Promise}
+ */
+export function request(methed, url, data = {}, headers, success) {
+    instance({
+            method: methed || 'post',
+            url: url,
+            data: methed === 'get' ? { params: data } : data,
+            headers: headers || { 'Content-Type': 'application/json' },
+        })
+        .then(response => {
+            //对接口错误码做处理
+            successResponse(response, success)
+        })
+        .catch(err => {
+            errorResponse(response, err)
+        })
+}

src/main.js

@@ -0,0 +1,23 @@
+import Vue from 'vue'
+import App from './App.vue'
+import router from './router/index'
+import store from './store/index'
+
+//element-ui引入config
+import "./element_config"
+
+//初始化样式
+import "assets/scss/reset.scss"
+import "assets/scss/common.scss";
+
+//路由拦截
+import "./router/beforEach"
+
+
+Vue.config.productionTip = false
+
+new Vue({
+    router,
+    store,
+    render: h => h(App)
+}).$mount('#app')

src/router/beforEach.js

@@ -0,0 +1,41 @@
+import router from '@/router'
+import store from '@/store'
+import { Message } from 'element-ui'
+import { tools } from '@/utils/tools'
+
+//不重定向的白名单
+const whiteList = ['/login']
+
+router.beforeEach((to, from, next) => {
+    // if (tools.getCookie()) {
+    //     if (to.path == "login") {
+    //         next({ path: "/" })
+    //     } else {
+    //         if (store.getters.)
+    //     }
+    // }
+    let fullPath = to.fullPath,
+        str = "创建",
+        breadArr = [],
+        path = to.path,
+        toBread = to.meta.breadArr
+    if (fullPath.indexOf("?") > -1) {
+        str = "编辑"
+    }
+    if (!!to.meta.breadShow) {
+        breadArr = toBread.map((item, index) => {
+            let obj = {}
+            obj.path = item.path
+            obj.name = item.name
+            if (index + 1 == toBread.length) {
+                obj.name = str + item.name
+            }
+            return obj
+        })
+    }
+    console.log(to, from, next, breadArr, "store")
+    store.commit("bread/set_isShow", to.meta.breadShow)
+    store.commit("bread/set_brandArr", breadArr)
+    document.title = to.meta.title
+    next()
+})

src/router/index.js

@@ -0,0 +1,81 @@
+import Vue from 'vue'
+import Router from 'vue-router'
+import Home from 'views/Home.vue'
+// import configPoint from 'views/config_point'
+// import notFind from "views/404"
+// import editOrigin from "views/config_point/edit_origin"
+// import layout from "views/layout/layout"
+
+const configPoint = () =>
+    import ("views/config_point")
+const notFind = () =>
+    import ("views/404")
+const editOrigin = () =>
+    import ("views/config_point/edit_origin")
+const layout = () =>
+    import ("views/layout/layout")
+const steps = () =>
+    import ("views/config_point/steps")
+Vue.use(Router)
+
+export default new Router({
+    mode: 'history',
+    base: process.env.BASE_URL,
+    routes: [{
+            path: '*',
+            name: 'notFind',
+            component: notFind
+        },
+        {
+            path: "/configPoint",
+            name: "",
+            meta: {
+                title: "点位配置"
+            },
+            component: layout,
+            children: [{
+                    path: "/",
+                    name: "configPoint",
+                    meta: {
+                        title: "点位配置"
+                    },
+                    component: configPoint,
+                },
+                {
+                    path: "editOrigin",
+                    name: "editOrigin",
+                    component: editOrigin,
+                    meta: {
+                        breadShow: true,
+                        title: "数据源",
+                        type: "edit",
+                        breadArr: [{
+                            path: "/configPoint",
+                            name: "点位配置"
+                        }, {
+                            path: "/configPoint/editOrigin",
+                            name: "数据源"
+                        }]
+                    }
+                },
+                {
+                    path: "steps",
+                    name: "steps",
+                    component: steps,
+                    meta: {
+                        breadShow: true,
+                        title: "点位表维护",
+                        type: "edit",
+                        breadArr: [{
+                            path: "/configPoint",
+                            name: "数据源管理"
+                        }, {
+                            path: "/configPoint/steps",
+                            name: "点位表维护"
+                        }]
+                    }
+                }
+            ]
+        },
+    ]
+})

src/store/common/brand_crumb.js

@@ -0,0 +1,24 @@
+const module_brand = {
+    namespaced: true,
+    state: {
+        isShow: false,
+        brandArr: []
+    },
+    mutations: {
+        set_isShow(state, val) {
+            state.isShow = val
+        },
+        set_brandArr(state, val) {
+            state.brandArr = val
+        }
+    },
+    actions: {
+
+    },
+    getters: {
+        isShow: state => state.isShow,
+        brandArr: state => state.brandArr
+    }
+}
+
+export default module_brand

src/store/index.js

@@ -0,0 +1,11 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+import bread from "./common/brand_crumb"
+
+Vue.use(Vuex)
+
+export default new Vuex.Store({
+    modules: {
+        bread
+    }
+})

src/store/module.js

@@ -0,0 +1,5 @@
+import { brand } from "./common/brand_crumb"
+
+export default {
+    brand
+}

src/utils/handsontable/delType.js

@@ -0,0 +1,156 @@
+export function showTypes(arr) {
+    let data = arr.map(item => {
+        // if (falg) {
+        if (item.FirstTag == "控制参数" ||
+            item.FirstTag == "设定参数" ||
+            item.FirstTag == "运行参数") {
+            return undefined
+        }
+        // }
+        if (item.InfoPointCode == "BIMLocation") {
+            return undefined
+        }
+        if (item.Visible) {
+            //固定不显示的code
+            // if (!showTools.cantShow(item.InfoPointCode)) {
+            //     return undefined
+            // }
+
+            if (item.InfoPointCode == "EquipQRCode") {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    // renderer: text.lookQRCode,
+                    readOnly: true
+                }
+            }
+
+            //图片类型
+            if (
+                item.InfoPointCode == "InstallPic" ||
+                item.InfoPointCode == "InstallDrawing" ||
+                item.InfoPointCode == "Nameplate" ||
+                item.InfoPointCode == "Pic" ||
+                item.InfoPointCode == "Drawing"
+            ) {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    // renderer: text.picType,
+                    readOnly: true
+                }
+            }
+
+            //文件类型
+            if (item.InfoPointCode == "InsuranceFile" ||
+                item.InfoPointCode == "Archive" ||
+                item.InfoPointCode == "CheckReport") {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    // renderer: text.fileType,
+                    readOnly: true
+                }
+            }
+
+            if (item.InputMode == "D1") {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    // renderer: tools.customDropdownRenderer,
+                    editor: "chosen",
+                    chosenOptions: {
+                        // multiple: true,//多选
+                        data: item.DataSource || ""
+                    }
+                };
+            } else if (item.InputMode == "A1" || item.InputMode == "A2") {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    type: "numeric",
+                    numericFormat: {
+                        pattern: "0,0.00"
+                            // culture: 'de-DE' // use this for EUR (German),
+                            // more cultures available on http://numbrojs.com/languages.html
+                    }
+                };
+            } else if (item.InputMode == "C5") {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    type: "date",
+                    dateFormat: "YYYY-MM-DD",
+                    correctFormat: true
+                };
+            } else if (
+                item.InputMode == "B1" ||
+                item.InputMode == "L" ||
+                item.InputMode == "L1" ||
+                item.InputMode == "L2"
+            ) {
+                return {
+                    data: "infos." + item.InfoPointCode
+                };
+            } else if (
+                item.InputMode == "X" ||
+                item.InputMode == "F2"
+                // item.InputMode == "L1" ||
+                // item.InputMode == "L2"
+            ) {
+                //   return undefined
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    readOnly: true
+                };
+            } else if (item.InputMode == "D2") {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    // renderer: tools.customDropdownRenderer,
+                    editor: "chosen",
+                    chosenOptions: {
+                        multiple: true, //多选
+                        data: item.DataSource || ""
+                    }
+                };
+            } else if (item.InputMode == "Own" && !onlyRead) {
+                return {
+                    data: "infos." + item.InfoPointCode,
+                    // renderer: text.idType,
+                }
+            } else {
+                return undefined;
+            }
+        } else {
+            return undefined
+        }
+
+    }).filter(item => item);
+    return data
+}
+
+export function changeHeader(arr) {
+    let data = arr.map(item => {
+        // if (falg) {
+        if (item.FirstTag == "控制参数" ||
+            item.FirstTag == "设定参数" ||
+            item.FirstTag == "运行参数") {
+            return undefined
+        }
+        // }
+
+        if (item.InfoPointCode == "BIMLocation") {
+            return undefined
+        }
+        // if (
+        //     readArr.indexOf(item.InputMode) > -1
+        // ) {
+        if (item.Visible) {
+            if (!item.Unit) {
+                return item.InfoPointName;
+            } else {
+                return item.InfoPointName + "(" + item.Unit + ")";
+            }
+        } else {
+            return undefined
+        }
+        // } else {
+        //     return undefined;
+        // }
+    }).filter(d => d);
+    return data
+}

src/utils/point_edit/handson_header.js

@@ -0,0 +1,213 @@
+const headers = {
+    "Modbus TCP": [{
+            InfoPointName: "从站地址",
+            InfoPointCode: "SlaveID",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "寄存器地址（16位）",
+            InfoPointCode: "Address",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "寄存器个数",
+            InfoPointCode: "Quantity",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "位（单双字节）",
+            InfoPointCode: "Convtype",
+            InputMode: "B1",
+            DataSource: [{
+                    Code: "单字",
+                    Name: "单字"
+                },
+                {
+                    Code: "双字",
+                    Name: "双字"
+                }
+            ],
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "翻转规则",
+            InfoPointCode: "ReverseRule",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        }
+    ],
+    "BACNet IP": [{
+            InfoPointName: "设备标识",
+            InfoPointCode: "DeviceID",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "实例功能号",
+            InfoPointCode: "InstanceNumber",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "数据类型",
+            InfoPointCode: "Type",
+            DataSource: [{
+                    Code: "analogInput",
+                    Name: "analogInput"
+                },
+                {
+                    Code: "analogOutput",
+                    Name: "analogOutput"
+                }
+            ],
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        }
+    ],
+    "OPC": [{
+        InfoPointName: "点位编码（统一标识）",
+        InfoPointCode: "Item",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    }],
+    "KNX": [{
+        InfoPointName: "组地址",
+        InfoPointCode: "GroupAddress",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    }],
+    "MQTT": [{
+            InfoPointName: "deviceId",
+            InfoPointCode: "DeviceId",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "item",
+            InfoPointCode: "Item",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        }
+    ],
+    "AMQP": [{
+            InfoPointName: "Exchange",
+            InfoPointCode: "Exchange",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "type",
+            InfoPointCode: "Type",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        },
+        {
+            InfoPointName: "Routingkey",
+            InfoPointCode: "Routingkey",
+            InputMode: "B1",
+            Visible: true,
+            FirstTag: ""
+        }
+    ]
+}
+
+let common = [{
+        InfoPointName: "原始点位描述",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "值/单位说明",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "位置标签",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "备注",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "原始数值",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "采集时间",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "使用",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "设备类型关键字",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "设备参数关键字",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "设备标识",
+        InfoPointCode: "",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    }
+]
+
+/**
+ * 
+ * @param {数据源类型} type
+ * 
+ * @returns  headersArr
+ */
+function getHeaderSetting(type) {
+    return headers[type].concat(common)
+}
+
+export default getHeaderSetting

src/utils/point_edit/steps2.js

@@ -0,0 +1,36 @@
+export default [{
+        InfoPointName: "原始点位描述",
+        InfoPointCode: "Description",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "位置",
+        InfoPointCode: "LocationFlag",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "备注",
+        InfoPointCode: "Remarks",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "设备类型关键字",
+        InfoPointCode: "KeyEquipmentType",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "设备参数关键字",
+        InfoPointCode: "KeyEquipmentParameter",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    }
+]

src/utils/point_edit/steps3.js

@@ -0,0 +1,57 @@
+export default [{
+        InfoPointName: "原始点位描述",
+        InfoPointCode: "Description",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "位置",
+        InfoPointCode: "LocationFlag",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "关键内容",
+        InfoPointCode: "Remarks",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "设备标识",
+        InfoPointCode: "EquipmentMark",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "数据字典设备类&信息点",
+        InfoPointCode: "Remarks",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "值处理方式",
+        InfoPointCode: "DataRuleType",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "备注",
+        InfoPointCode: "Remarks",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    },
+    {
+        InfoPointName: "操作",
+        InfoPointCode: "KeyEquipmentParameter",
+        InputMode: "B1",
+        Visible: true,
+        FirstTag: ""
+    }
+]

src/utils/tools.js

@@ -0,0 +1,23 @@
+const tools = {}
+
+//存储cookie
+tools.setCookie = (name, value) => {
+    var Days = 30; /* 设置cookie保存时间 */
+    var exp = new Date();
+    exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);
+    document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
+}
+
+
+//获取cookie
+tools.getCookie = name => {
+    var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
+    if (arr = document.cookie.match(reg)) {
+        return unescape(arr[2]);
+    } else {
+        /* 如果没有参数，那么就获取本域下的所有cookie */
+        return document.cookie;
+    }
+}
+
+export default tools

src/views/404/index.vue

@@ -0,0 +1,343 @@
+<template>
+    <div class="saga-container">
+        <div class="saga-error404page">
+            <div class="saga-newcharacter404">
+                <div class="saga-chair404"></div>
+                <div class="saga-leftshoe404"></div>
+                <div class="saga-rightshoe404"></div>
+                <div class="saga-legs404"></div>
+                <div class="saga-torso404">
+                    <div class="saga-body404"></div>
+                    <div class="saga-leftarm404"></div>
+                    <div class="saga-rightarm404"></div>
+                    <div class="saga-head404">
+                        <div class="saga-eyes404"></div>
+                    </div>
+                </div>
+                <div class="saga-laptop404"></div>
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+    export default {
+        data() {
+            return {}
+        },
+        created() {},
+        mounted() {},
+        methods: {}
+    }
+</script>
+<style lang="scss">
+    .saga-container {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        height: 100vh;
+    }
+    body {
+        background-color: white;
+        overflow: hidden;
+    }
+    .saga-error404page {
+        width: 400px;
+        height: 800px;
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+    }
+    .saga-body404,
+    .saga-head404,
+    .saga-eyes404,
+    .saga-leftarm404,
+    .saga-rightarm404,
+    .saga-chair404,
+    .saga-leftshoe404,
+    .saga-rightshoe404,
+    .saga-legs404,
+    .saga-laptop404 {
+        background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/15979/404-character-new.png) 0 0 no-repeat;
+        width: 200px;
+        height: 200px;
+    }
+    .saga-newcharacter404,
+    .saga-torso404,
+    .saga-body404,
+    .saga-head404,
+    .saga-eyes404,
+    .saga-leftarm404,
+    .saga-rightarm404,
+    .saga-chair404,
+    .saga-leftshoe404,
+    .saga-rightshoe404,
+    .saga-legs404,
+    .saga-laptop404 {
+        background-size: 750px;
+        position: absolute;
+        display: block;
+    }
+    .saga-newcharacter404 {
+        width: 400px;
+        height: 800px;
+        left: 50%;
+        top: 20px;
+        margin-left: -200px;
+    }
+    $swayspeed: 20s;
+    .saga-torso404 {
+        position: absolute;
+        display: block;
+        top: 138px;
+        left: 0px;
+        width: 389px;
+        height: 252px;
+        animation: sway $swayspeed ease infinite;
+        transform-origin: 50% 100%;
+    }
+    .saga-body404 {
+        position: absolute;
+        display: block;
+        top: 0px;
+        left: 0px;
+        width: 389px;
+        height: 253px;
+    }
+    .saga-head404 {
+        position: absolute;
+        top: -148px;
+        left: 106px;
+        width: 160px;
+        height: 194px;
+        background-position: 0px -265px;
+        transform-origin: 50% 85%;
+        animation: headTilt $swayspeed ease infinite;
+    }
+    .saga-eyes404 {
+        position: absolute;
+        top: 92px;
+        left: 34px;
+        width: 73px;
+        height: 18px;
+        background-position: -162px -350px;
+        animation: blink404 10s steps(1) infinite, pan 10s ease-in-out infinite;
+    }
+    .saga-leftarm404 {
+        position: absolute;
+        top: 159px;
+        left: 0;
+        width: 165px;
+        height: 73px;
+        background-position: -265px -341px;
+        transform-origin: 9% 35%;
+        transform: rotateZ(0deg);
+        animation: typeLeft 0.4s linear infinite;
+    }
+    .saga-rightarm404 {
+        position: absolute;
+        top: 148px;
+        left: 231px;
+        width: 157px;
+        height: 91px;
+        background-position: -442px -323px;
+        transform-origin: 90% 25%;
+        animation: typeLeft 0.4s linear infinite;
+    }
+    .saga-chair404 {
+        position: absolute;
+        top: 430px;
+        left: 55px;
+        width: 260px;
+        height: 365px;
+        background-position: -12px -697px;
+    }
+    .saga-legs404 {
+        position: absolute;
+        top: 378px;
+        left: 4px;
+        width: 370px;
+        height: 247px;
+        background-position: -381px -443px;
+    }
+    .saga-leftshoe404 {
+        position: absolute;
+        top: 591px;
+        left: 54px;
+        width: 130px;
+        height: 92px;
+        background-position: -315px -749px;
+    }
+    .saga-rightshoe404 {
+        position: absolute;
+        top: 594px;
+        left: 187px;
+        width: 135px;
+        height: 81px;
+        background-position: -453px -749px;
+        transform-origin: 35% 12%;
+        animation: tapRight 1s linear infinite;
+    }
+    .saga-laptop404 {
+        position: absolute;
+        top: 186px;
+        left: 9px;
+        width: 365px;
+        height: 216px;
+        background-position: -2px -466px;
+        transform-origin: 50% 100%;
+        animation: tapWobble 0.4s linear infinite;
+    }
+    @keyframes sway {
+        0% {
+            transform: rotateZ(0deg);
+        }
+        20% {
+            transform: rotateZ(0deg);
+        }
+        25% {
+            transform: rotateZ(4deg);
+        }
+        45% {
+            transform: rotateZ(4deg);
+        }
+        50% {
+            transform: rotateZ(0deg);
+        }
+        70% {
+            transform: rotateZ(0deg);
+        }
+        75% {
+            transform: rotateZ(-4deg);
+        }
+        90% {
+            transform: rotateZ(-4deg);
+        }
+        100% {
+            transform: rotateZ(0deg);
+        }
+    }
+    @keyframes headTilt {
+        0% {
+            transform: rotateZ(0deg);
+        }
+        20% {
+            transform: rotateZ(0deg);
+        }
+        25% {
+            transform: rotateZ(-4deg);
+        }
+        35% {
+            transform: rotateZ(-4deg);
+        }
+        38% {
+            transform: rotateZ(2deg);
+        }
+        42% {
+            transform: rotateZ(2deg);
+        }
+        45% {
+            transform: rotateZ(-4deg);
+        }
+        50% {
+            transform: rotateZ(0deg);
+        }
+        70% {
+            transform: rotateZ(0deg);
+        }
+        82% {
+            transform: rotateZ(0deg);
+        }
+        85% {
+            transform: rotateZ(4deg);
+        }
+        90% {
+            transform: rotateZ(4deg);
+        }
+        100% {
+            transform: rotateZ(0deg);
+        }
+    }
+    @keyframes typeLeft {
+        0% {
+            transform: rotateZ(0deg);
+        }
+        25% {
+            transform: rotateZ(7deg);
+        }
+        75% {
+            transform: rotateZ(-6deg);
+        }
+        100% {
+            transform: rotateZ(0deg);
+        }
+    }
+    @keyframes typeRight {
+        0% {
+            transform: rotateZ(0deg);
+        }
+        25% {
+            transform: rotateZ(-6deg);
+        }
+        75% {
+            transform: rotateZ(7deg);
+        }
+        100% {
+            transform: rotateZ(0deg);
+        }
+    }
+    @keyframes tapWobble {
+        0% {
+            transform: rotateZ(-0.2deg);
+        }
+        50% {
+            transform: rotateZ(0.2deg);
+        }
+        100% {
+            transform: rotateZ(-0.2deg);
+        }
+    }
+    @keyframes tapRight {
+        0% {
+            transform: rotateZ(0deg);
+        }
+        90% {
+            transform: rotateZ(-6deg);
+        }
+        100% {
+            transform: rotateZ(0deg);
+        }
+    }
+    @keyframes blink404 {
+        0% {
+            background-position: -162px -350px;
+        }
+        94% {
+            background-position: -162px -350px;
+        }
+        98% {
+            background-position: -162px -368px;
+        }
+        100% {
+            background-position: -162px -350px;
+        }
+    }
+    @keyframes pan {
+        0% {
+            transform: translateX(-2px);
+        }
+        49% {
+            transform: translateX(-2px);
+        }
+        50% {
+            transform: translateX(2px);
+        }
+        99% {
+            transform: translateX(2px);
+        }
+        100% {
+            transform: translateX(-2px);
+        }
+    }
+</style>

src/views/Home.vue

@@ -0,0 +1,21 @@
+<template>
+  <div class="home">
+    <el-input v-model="testData"></el-input>
+    <router-link to="/about">to</router-link>
+  </div>
+</template>
+
+<script>
+// @ is an alias to /src
+
+export default {
+  name: 'home',
+  components: {
+  },
+  data(){
+      return {
+          testData: ""
+      }
+  }
+}
+</script>

src/views/config_point/edit_origin/index.vue

@@ -0,0 +1,86 @@
+<template>
+  <div>
+    <bread></bread>
+    <h3 class="center">{{formData.originName}}</h3>
+    <el-input
+      type="textarea"
+      class="dcenter block"
+      style="width:600px;margin-bottom: 10px;"
+      v-model="formData.note"
+      placeholder="数据源的说明再次编辑维护..."
+    ></el-input>
+    <el-form label-width="120px" style="width:600px;" :model="formData" class="dcenter">
+      <el-form-item label="协议类型">
+        <el-select v-model="formData.comProtocol" filterable placeholder="请选择">
+          <el-option
+            v-for="item in options"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="主机IP地址">
+        <ip-input></ip-input>
+      </el-form-item>
+      <el-form-item label="用户名/密码">
+        <el-input style="display:inline-block;width:100px;"></el-input>/
+        <el-input style="display:inline-block;width:100px;"></el-input>
+      </el-form-item>
+      <el-form-item label="ProgID">
+        <el-input style="display:inline-block;width:100px;"></el-input>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<script>
+
+import ipInput from "components/config_point/ip_input"
+import bread from "components/common/bread_crumb"
+
+export default {
+  data() {
+    return {
+      formData: {
+        "comProtocol": "",//协议类型
+        "originName": "2323",
+        "ip": ["", "", "", ""],//ip
+        "port": "",//端口号，有些协议类型没有该信息
+        "userName": "",//用户名
+        "password": "",//密码
+        "progID": "",//progID
+        note: ""
+      },
+      options: [{
+        value: 'Modbus TCP',
+        label: 'Modbus TCP'
+      }, {
+        value: 'BACNet IP',
+        label: 'BACNet IP'
+      }, {
+        value: 'OPT',
+        label: 'OPT'
+      }, {
+        value: 'KNX',
+        label: 'KNX'
+      }, {
+        value: 'MQTT',
+        label: 'MQTT'
+      }, {
+        value: 'AMQP',
+        label: 'AMQP'
+      }]
+    }
+  },
+  components: {
+    ipInput,
+    bread
+  },
+  created() {
+  },
+  mounted() { },
+  methods: {}
+}
+</script>
+<style>
+</style>

src/views/config_point/index.vue

@@ -0,0 +1,91 @@
+<template>
+  <div class="saga-config-point">
+    <h3 class="center">{{projectName}}</h3>
+    <p class="center">此项目包括{{list.length}}个数据源</p>
+    <div class="saga-origin-list dcenter w">
+      <!-- <el-row> -->
+      <div class="disIne border-hover saga-list-item margin5" v-for="(item,index) in list">
+        <data-origin :id="'origin' + index" :reanderData="item">
+          <el-button @click="maintenance(item)" type="text">维护点位</el-button>
+          <el-button @click="goEdit(item)" type="text">编辑数据源</el-button>
+        </data-origin>
+      </div>
+      <div class="disIne saga-list-item margin5 center pointer" @click="addItem">
+        <i class="add-icon margin50">+</i>
+      </div>
+      <router-view></router-view>
+      <!-- </el-row> -->
+    </div>
+  </div>
+</template>
+<script>
+import dataOrigin from "components/config_point/data_origin"
+export default {
+  components: {
+    dataOrigin
+  },
+  data() {
+    return {
+      projectName: "项目名称",
+      list: [
+        {
+          name: "111",
+          id: "222",
+          note: "21324234324234342343423423312312312312312321312312325345fdsafsdfsddgfshgdfsgehjfvdsbjfasbdfkdbsthjgdbgavksdbgfvjksdafbgdistghbdkbagvaksdbgkjd"
+        },
+      ]
+    }
+  },
+  created() { },
+  mounted() { },
+  methods: {
+    addItem() {
+      this.$router.push({
+        path: "configPoint/editOrigin"
+      })
+    },
+    goEdit(item) {
+      this.$router.push({
+        path: "configPoint/editOrigin",
+        query: {
+          key: item.id
+        }
+      })
+    },
+    maintenance(item) {
+      this.$router.push({
+        path: "configPoint/steps",
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.saga-config-point {
+  height: 100%;
+  overflow-y: auto;
+  .add-icon {
+    font-size: 40px;
+  }
+  .margin50 {
+    display: block;
+    height: 100%;
+    line-height: 8;
+  }
+  .saga-origin-list {
+    display: flex;
+    flex-wrap: wrap;
+    // justify-content: space-around;
+    height: calc(100% - 90px);
+    .saga-list-item {
+      width: 320px;
+      height: 475px;
+      border-radius: 22px;
+      border: 6px solid #dee3f3;
+      //   &:hover {
+      //     border-color: #409eff;
+      //   }
+    }
+  }
+}
+</style>

src/views/config_point/steps/collection.vue

@@ -0,0 +1,13 @@
+<template>
+  <div></div>
+</template>
+<script>
+export default {
+  data() { return {} },
+  created() { },
+  mounted() { },
+  methods: {}
+}
+</script>
+<style>
+</style>

src/views/config_point/steps/index.vue

@@ -0,0 +1,73 @@
+<template>
+  <div class="h100 saga-maintenance">
+    <bread class="bread-view"></bread>
+    <div class="saga-btns-view">
+      <template v-for="(item,index) in jsonTitle">
+        <div
+          @click="activeStep = index + 1"
+          class="saga-steps-btn saga-border pointer saga-size3"
+        >{{item}}</div>
+        <div v-if="index < jsonTitle.length - 1" class="saga-steps-btn saga-size3">👉</div>
+      </template>
+    </div>
+    <div class="main-view">
+      <step1 v-if="activeStep == 1"></step1>
+      <step2 v-if="activeStep == 2"></step2>
+      <step3 v-if="activeStep == 3"></step3>
+      <step4 v-if="activeStep == 4"></step4>
+    </div>
+  </div>
+</template>
+<script>
+import bread from "components/common/bread_crumb"
+import step1 from "./step1"
+import step2 from "./step2"
+import step3 from "./step3"
+import step4 from "./step4"
+
+export default {
+  data() {
+    return {
+      activeStep: 1,//活跃的step
+      jsonTitle: [
+        "原始点位表收集", "原始点位描述关键内同识别", "原始点位描述标准化", "点位表处理结果检查"
+      ]
+    }
+  },
+  created() { },
+  mounted() { },
+  methods: {
+    stepClick() {
+      console.log("test")
+    }
+  },
+  components: {
+    bread,
+    step1,
+    step2,
+    step3,
+    step4
+  },
+}
+</script>
+<style lang="scss">
+.h100 {
+  .bread-view {
+    height: 45px;
+  }
+  .main-view {
+    height: calc(100% - 155px);
+    background: #ccc;
+    margin-top: 10px;
+  }
+  .saga-btns-view {
+    .saga-steps-btn {
+      height: 80px;
+      text-align: center; /*设置文本水平居中*/
+      display: table-cell;
+      vertical-align: middle;
+      padding: 0 30px;
+    }
+  }
+}
+</style>

src/views/config_point/steps/step1.vue

@@ -0,0 +1,65 @@
+<template>
+  <div id="handsonStep1">
+    <div class="btns-view">
+      <el-button>获取原始点位当前值</el-button>
+      <el-button>导出Excel模板</el-button>
+      <el-button>导入Excel</el-button>
+      <el-button>新增行</el-button>
+      <el-button>保存</el-button>
+      <el-checkbox v-model="checked">只显示使用的原始点位</el-checkbox>
+    </div>
+    <div id="handsontableSteps1">
+      <handsontable-component ref="handsontable"></handsontable-component>
+    </div>
+  </div>
+</template>
+<script>
+
+import handsontableComponent from "components/common/handsontable"
+import getHeaderSetting from "utils/point_edit/handson_header"
+import { changeHeader, showTypes } from "utils/handsontable/delType"
+
+export default {
+  data() {
+    return {
+      checked: false,
+      settings: {}
+    }
+  },
+  created() { },
+  mounted() {
+    this.getData()
+  },
+  methods: {
+    getData() {
+      let header = getHeaderSetting("Modbus TCP")
+      let width = (document.getElementById("app").clientWidth - 50) / header.length
+      let settings = {
+        data: [{}],
+        colHeaders: changeHeader(header),
+        columns: showTypes(header),
+        colWidths: width,
+        rowHeights: 30
+      }
+      this.$refs.handsontable.init(settings)
+    }
+  },
+  components: {
+    handsontableComponent
+  }
+}
+</script>
+<style lang="scss" scoped>
+#handsonStep1 {
+  height: 100%;
+  .btns-view {
+    height: 50px;
+    vertical-align: middle;
+  }
+  #handsontableSteps1 {
+    height: calc(100% - 50px);
+    overflow: hidden;
+    position: relative;
+  }
+}
+</style>

src/views/config_point/steps/step2.vue

@@ -0,0 +1,95 @@
+<template>
+  <div id="handsonStep2">
+    <div class="btns-view">
+      <el-button>AI自动识别</el-button>
+      <el-button @click="discern(1)">批量识别设备类型关键字</el-button>
+      <el-button @click="discern(2)">批量识别设备参数关键字</el-button>
+      <el-button>检查&微调</el-button>
+      <el-button>刷新</el-button>
+      <el-button>保存</el-button>
+    </div>
+    <div id="handsontableSteps1">
+      <handsontable-component ref="handsontable"></handsontable-component>
+    </div>
+    <own-dialog :width="'60%'" :dialogVisible="isDialogShow" @cancel="close">
+      <cut-string ref="cutString"></cut-string>
+      <el-button @click="getCutString">此条无法识别</el-button>
+      <el-button @click="getCutString">继续发现关键字</el-button>
+    </own-dialog>
+  </div>
+</template>
+<script>
+import handsontableComponent from "components/common/handsontable"
+import headerArr from "utils/point_edit/steps2.js"
+import { changeHeader, showTypes } from "utils/handsontable/delType"
+import ownDialog from "components/el_pack/dialog"
+import cutString from "components/config_point/cut_string"
+
+export default {
+  data() {
+    return {
+      checked: false,
+      settings: {},
+      isDialogShow: false,
+      msg: ""
+    }
+  },
+  created() { },
+  mounted() {
+    this.getData()
+  },
+  methods: {
+    /**
+     *  @param num 代表着1类型2参数
+     * 
+     */
+    discern(num) {
+      if (num == 1) {
+
+      } else if (num == 2) {
+
+      }
+      this.isDialogShow = true
+    },
+
+    getCutString() {
+      console.log(this.$refs.cutString.getData())
+    },
+
+    close() {
+      this.isDialogShow = false
+    },
+
+    getData() {
+      let width = (document.getElementById("app").clientWidth - 50) / headerArr.length
+      let settings = {
+        data: [{}],
+        colHeaders: changeHeader(headerArr),
+        columns: showTypes(headerArr),
+        colWidths: width,
+        rowHeights: 30
+      }
+      this.$refs.handsontable.init(settings)
+    }
+  },
+  components: {
+    handsontableComponent,
+    ownDialog,
+    cutString
+  }
+}
+</script>
+<style lang="scss" scoped>
+#handsonStep2 {
+  height: 100%;
+  .btns-view {
+    height: 50px;
+    vertical-align: middle;
+  }
+  #handsontableSteps1 {
+    height: calc(100% - 50px);
+    overflow: hidden;
+    position: relative;
+  }
+}
+</style>

src/views/config_point/steps/step3.vue

@@ -0,0 +1,81 @@
+<template>
+  <div id="handsonStep2">
+    <div class="btns-view">
+      <el-button @click="dialogShow(1)">根据关键内容批量标准化设备标识</el-button>
+      <el-button @click="dialogShow(2)">根据关键内容批量对应数据字典</el-button>
+      <el-checkbox v-model="checked">只显示未标准化得的原始点位</el-checkbox>
+    </div>
+    <div id="handsontableSteps1">
+      <handsontable-component ref="handsontable"></handsontable-component>
+    </div>
+    <own-dialog :width="'60%'" :dialogVisible="isDialogShow" @cancel="close">
+      <dialog-main></dialog-main>
+    </own-dialog>
+  </div>
+</template>
+<script>
+import handsontableComponent from "components/common/handsontable"
+import headerArr from "utils/point_edit/steps3.js"
+import { changeHeader, showTypes } from "utils/handsontable/delType"
+import ownDialog from "components/el_pack/dialog"
+import dialogMain from "components/config_point/dialog_main"
+export default {
+  data() {
+    return {
+      checked: false,
+      settings: {},
+      isDialogShow: false,
+    }
+  },
+  created() { },
+  mounted() {
+    this.getData()
+  },
+  methods: {
+    //页面关闭
+    close() {
+      this.isDialogShow = false
+    },
+    //页面显示num1为标准化设备标识，2为对应数据字典
+    dialogShow(num) {
+      if (num == 1) {
+
+      } else if (num == 2) {
+
+      }
+      this.isDialogShow = true
+    },
+    //初始化表格实例
+    getData() {
+      let width = (document.getElementById("app").clientWidth - 50) / headerArr.length
+      let settings = {
+        data: [{}],
+        colHeaders: changeHeader(headerArr),
+        columns: showTypes(headerArr),
+        colWidths: width,
+        rowHeights: 30
+      }
+      this.$refs.handsontable.init(settings)
+    }
+  },
+  components: {
+    handsontableComponent,
+    ownDialog,
+    dialogMain
+  }
+}
+</script>
+<style lang="scss" scoped>
+#handsonStep2 {
+  height: 100%;
+  .btns-view {
+    height: 50px;
+    vertical-align: middle;
+  }
+  #handsontableSteps1 {
+    height: calc(100% - 50px);
+    overflow: hidden;
+    position: relative;
+  }
+}
+</style>

src/views/config_point/steps/step4.vue

@@ -0,0 +1,110 @@
+<template>
+  <div class="h100 steps4">
+    <div class="btns-view">
+      <el-button>根据关键内容批量标准化设备标识</el-button>
+      <el-button>根据关键内容批量对应数据字典</el-button>
+    </div>
+    <el-tabs type="border-card" @tab-click="clickTabs" class="tabs-h" tab-position="bottom">
+      <el-tab-pane>
+        <span slot="label">
+          <i class="el-icon-date"></i> 我的行程
+        </span>
+        <js-mind-component ref="jsmind1"></js-mind-component>
+      </el-tab-pane>
+      <el-tab-pane class="h100" label="消息中心">
+        <js-mind-component ref="jsmind2"></js-mind-component>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+<script>
+import jsMindComponent from "components/common/jsmind"
+export default {
+  name: "steps4",
+  data() { return {} },
+  created() { },
+  mounted() {
+  },
+  methods: {
+    clickTabs(val) {
+      console.log(this.$refs, val)
+      var mind = {
+        /* 元数据，定义思维导图的名称、作者、版本等信息 */
+        meta: {
+          name: "jsMind-demo-tree",
+          author: "hizzgdev@163.com",
+          version: "0.2"
+        },
+        /* 数据格式声明 */
+        format: "node_tree",
+        /* 数据内容 */
+        data: {
+          id: "root",
+          topic: "jsMind",
+          children: [
+            {
+              id: "easy",
+              topic: "Easy",
+              direction: "left",
+              expanded: false,
+              children: [
+                { id: "easy1", topic: "Easy to show" },
+                { id: "easy2", topic: "Easy to edit" },
+                { id: "easy3", topic: "Easy to store" },
+                { id: "easy4", topic: "Easy to embed" }
+              ]
+            },
+            {
+              id: "open",
+              topic: "Open Source",
+              direction: "right",
+              expanded: true,
+              children: [
+                { id: "open1", topic: "on GitHub" },
+                { id: "open2", topic: "BSD License" }
+              ]
+            },
+            {
+              id: "powerful",
+              topic: "Powerful",
+              direction: "right",
+              children: [
+                { id: "powerful1", topic: "Base on Javascript" },
+                { id: "powerful2", topic: "Base on HTML5" },
+                { id: "powerful3", topic: "Depends on you" }
+              ]
+            },
+            {
+              id: "other",
+              topic: "test node",
+              direction: "left",
+              children: [
+                { id: "other1", topic: "I'm from local variable" },
+                { id: "other2", topic: "I can do everything" }
+              ]
+            }
+          ]
+        }
+      };
+      let jsMind1 = this.$refs.jsmind1.initData({}, mind)
+    }
+  },
+  components: {
+    jsMindComponent
+  }
+}
+</script>
+<style lang="scss">
+.tabs-h {
+  height: calc(100% - 50px);
+  .el-tabs__content {
+    height: calc(100% - 70px);
+    > div {
+      height: 100%;
+    }
+  }
+}
+.saga-mind-view {
+  //   height: 450px;
+}
+</style>

src/views/layout/layout.vue

@@ -0,0 +1,14 @@
+<template>
+  <router-view></router-view>
+</template>
+<script>
+export default {
+  name: "Layout",
+  data() { return {} },
+  created() { },
+  mounted() { },
+  methods: {}
+}
+</script>
+<style>
+</style>

src/views/login/index.vue

@@ -0,0 +1,23 @@
+<template>
+  <div>
+    <el-button @click="createPost">测试请求</el-button>
+  </div>
+</template>
+<script>
+
+import { getTest } from 'fetch'
+export default {
+  data() { return {} },
+  created() { },
+  mounted() { },
+  methods: {
+    createPost() {
+      getTest(_ => {
+        console.log(_)
+      })
+    }
+  }
+}
+</script>
+<style lang="scss">
+</style>

vue.config.js

@@ -0,0 +1,41 @@
+const path = require("path")
+
+function resolve(dir) {
+    return path.join(__dirname, dir)
+}
+// 作为配置文件，直接导出配置对象即可
+module.exports = {
+    devServer: {
+        // 设置主机地址
+        host: 'localhost',
+        // 设置默认端口
+        port: 8080,
+        // 设置代理
+        proxy: {
+            '/data-platform-3': {
+                // 目标 API 地址
+                target: 'http://192.168.20.225:8080/',
+                // 如果要代理 websockets
+                ws: true,
+                // 将主机标头的原点更改为目标URL
+                changeOrigin: false
+            }
+        },
+        // alias: {
+        //     "assets": "src/assets"
+        // }
+    },
+    lintOnSave: true,
+    chainWebpack: (config) => {
+        config.resolve.alias
+            .set('@$', resolve('src'))
+            .set('assets', resolve('src/assets'))
+            .set('components', resolve('src/components'))
+            .set('static', resolve('src/static'))
+            .set('views', resolve('src/views'))
+            .set('store', resolve('src/store'))
+            .set('fetch', resolve('src/fetch'))
+            .set('utils', resolve('src/utils'))
+    }
+
+}