Forráskód Böngészése

调试部分接口

chuwu 6 éve
szülő
commit
0b86d3b17e

+ 4 - 0
src/assets/scss/common.scss

@@ -8,6 +8,10 @@ $size3: 23px;
     font-size: $size3;
 }
 
+.select-bg {
+    background-color: $hoverColor;
+}
+
 .saga-border {
     border: $borderWidth solid $borderColor;
     box-sizing: border-box;

+ 150 - 3
src/components/common/handsontable.vue

@@ -25,7 +25,10 @@
             // }
         },
         data() {
-            return {}
+            return {
+                hot: null,
+                filtersArr: []
+            }
         },
         created() {},
         mounted() {
@@ -39,6 +42,110 @@
                     height: document.getElementById(this.id).parentNode.clientHeight
                 }
             },
+            afterDocumentKeyDown(e) {
+                this.$emit("keyDown", e)
+            },
+            trimmedRows() {
+                var plugin = this.hot.getPlugin("trimRows").trimmedRows;
+                let dataLength = this.hot.getSourceData().length;
+                let dataArr = new Array();
+                for (let i = 0; i < dataLength; i++) {
+                    dataArr.push(i);
+                }
+                if (plugin.length <= 0) {
+                    dataArr = undefined;
+                } else {
+                    dataArr = this.array_diff(dataArr, plugin);
+                }
+                this.filtersArr = dataArr;
+                return dataArr || [];
+            },
+            //去除数组中相同的元素
+            array_diff(a, b) {
+                for (var i = 0; i < b.length; i++) {
+                    for (var j = 0; j < a.length; j++) {
+                        if (a[j] == b[i]) {
+                            a.splice(j, 1);
+                            j = j - 1;
+                        }
+                    }
+                }
+                return a;
+            },
+            //右键删除
+            romoveFm(index, amout) {
+                console.log(index, amout)
+                this.$emit("delete", index, amout)
+            },
+            //数据发生修改后(失焦)
+            tdChange(changeData, source) {
+                this.$emit("change",changeData,source)
+            },
+            /**
+             * 获取被排序后的数组
+             *
+             * @param changeData 发生改变的数据
+             * @param source     数组
+             *
+             * @return array     经过排序后或者经过搜索后的数组
+             */
+            getParam(changeData, source, hot, trimmedArr) {
+                let param = "";
+                //被筛选过后的数组
+                // let trimmedArr = this.trimmedRows();
+                //是否启用了排序
+                let isSort = hot.getPlugin("columnSorting").isSorted();
+                if (trimmedArr.length && isSort) {
+                    //排序后的数组
+                    let sortArr = hot.getPlugin("columnSorting").rowsMapper.__arrayMap;
+                    param = changeData.map(item => {
+                        return hot.getSourceDataAtRow(trimmedArr[sortArr[item[0]]]);
+                    });
+                } else if (isSort) {
+                    //排序后的数组
+                    let sortArr = hot.getPlugin("columnSorting").rowsMapper.__arrayMap;
+                    param = changeData.map(item => {
+                        return hot.getSourceDataAtRow(sortArr[item[0]]);
+                    });
+                } else if (trimmedArr.length) {
+                    param = changeData.map(item => {
+                        return hot.getSourceDataAtRow(trimmedArr[item[0]]);
+                    });
+                } else {
+                    param = changeData.map(item => {
+                        return hot.getSourceDataAtRow(item[0]);
+                    });
+                }
+                return param;
+            },
+            /**
+             * 
+             * @param {handsontable修改参数} changeData 
+             * @param {*} source 
+             * @param {handsontabele实例} hot 
+             * @param {排序数组} trimmedArr
+             * 
+             * @return 修改数值的前一个对象 
+             */
+            getUnshiftParam(changeData, source, hot, trimmedArr) {
+                //是否启用了排序
+                let isSort = hot.getPlugin("columnSorting").isSorted();
+                if (trimmedArr.length && isSort) {
+                    //排序后的数组
+                    let sortArr = hot.getPlugin("columnSorting").rowsMapper.__arrayMap;
+                    return hot.getSourceDataAtRow(trimmedArr[sortArr[changeData[0][0] - 1]])
+                } else if (isSort) {
+                    //排序后的数组
+                    let sortArr = hot.getPlugin("columnSorting").rowsMapper.__arrayMap;
+                    return hot.getSourceDataAtRow(sortArr[changeData[0][0] - 1])
+                } else if (trimmedArr.length) {
+                    //进行了筛选
+                    return hot.getSourceDataAtRow(trimmedArr[changeData[0][0] - 1])
+                } else {
+                    //没有进行排序和筛选
+                    return hot.getSourceDataAtRow(changeData[0][0] - 1);
+                }
+            },
             init(settings) {
                 console.log("init")
                 var hotElement = document.getElementById(this.id)
@@ -58,14 +165,54 @@
                     dropdownMenu: [
                         "filter_by_condition",
                         "filter_action_bar"
-                    ]
+                    ],
+                    afterOnCellMouseDown: this.tableDown, //鼠标单击
+                    afterChange: this.tdChange, //修改后
+                    afterRemoveRow: this.romoveFm, //右键删除
+                    afterFilter: this.trimmedRows, //排序
+                    afterDocumentKeyDown: this.afterDocumentKeyDown, //鼠标单击
                 }, settings);
                 console.log(hotSettings, settings)
-                var hot = new Handsontable(hotElement, hotSettings);
+                this.hot = new Handsontable(hotElement, hotSettings);
                 let pro = document.getElementById("hot-display-license-info");
                 if (!!pro) {
                     pro.parentNode.removeChild(pro);
                 }
+                return this.hot
+            },
+            tableDown(el, rowArr) {
+                if (rowArr.row < 0) {
+                    return false
+                }
+                let filter = this.filtersArr;
+                //被筛选过后的数组
+                let trimmedArr = this.trimmedRows();
+                //是否启用了排序
+                let isSort = this.hot
+                    .getPlugin("columnSorting")
+                    .isSorted();
+                let myHotMainArr = this.hot.getSourceData()
+                // debugger
+                if (trimmedArr.length && isSort) {
+                    let sortArr = this.hot.getPlugin("columnSorting")
+                        .rowsMapper.__arrayMap;
+                    let infos = myHotMainArr[trimmedArr[sortArr[rowArr.row]]];
+                    this.getInfors(infos, rowArr);
+                } else if (isSort) {
+                    //排序后的数组
+                    let sortArr = this.hot.getPlugin("columnSorting").rowsMapper.__arrayMap;
+                    let infos = myHotMainArr[sortArr[rowArr.row]];
+                    this.getInfors(infos, rowArr);
+                } else if (trimmedArr.length) {
+                    let infos = myHotMainArr[trimmedArr[rowArr.row]];
+                    this.getInfors(infos, rowArr);
+                } else {
+                    let infos = myHotMainArr[rowArr.row];
+                    this.getInfors(infos, rowArr);
+                }
+            },
+            getInfors(obj,row){
+                this.$emit("mouseDown",obj,row)
             }
         }
     }

+ 1 - 1
src/components/config_point/cut_string.vue

@@ -14,7 +14,7 @@
         props: {
             string: {
                 type: String,
-                default: "大家看法的帅哥"
+                default: ""
             }
         },
         data() {

+ 39 - 8
src/components/config_point/data_origin.vue

@@ -1,12 +1,13 @@
 <template>
     <div class="saga-fill">
-        <div class="saga-title center h1">{{reanderData.name}}</div>
-        <div class="center h3">通讯协议:{{reanderData.name}}</div>
+        <div class="saga-title center h1">{{renderData.Name}}</div>
+        <div class="center h3">通讯协议:{{renderData.ProtocolType}}</div>
         <div class="padding10 bg-F5">
-            <p class="p-over2 h5">{{reanderData.note}}</p>
+            <p class="p-over2 h5">{{renderData.Description}}</p>
         </div>
         <div class="doughnut-view">
-            <doughnut width="200" height="200" :id="id"></doughnut>
+            <doughnut v-if="renderData.Sum" width="200" height="200" :renderData="echartsData" :id="id"></doughnut>
+            <div v-else class="center">暂无数据</div>
         </div>
         <slot></slot>
     </div>
@@ -22,7 +23,7 @@
             id: {
                 type: String
             },
-            reanderData: {
+            renderData: {
                 type: Object,
                 default: function() {
                     return {}
@@ -30,11 +31,41 @@
             }
         },
         data() {
-            return {}
+            return {
+                echartsData: []
+            }
+        },
+        created() {
+            console.log(this.renderData)
+            this.changeData()
         },
-        created() {},
         mounted() {},
-        methods: {}
+        methods: {
+            changeData(){
+                this.echartsData = [
+                    {
+                        name: "未使用-" + this.renderData.Notused,
+                        value: this.renderData.Notused
+                    },
+                    {
+                        name: "未关联物理世界-" + this.renderData.Notrelated,
+                        value: this.renderData.Notrelated
+                    },
+                    {
+                        name: "已关联物理世界-" + this.renderData.Related,
+                        value: this.renderData.Related
+                    }
+                ]
+            }
+        },
+        watch:{
+            renderData: {
+                deep: true,
+                handle: function(){
+                    this.changeData()
+                }
+            }
+        }
     }
 </script>
 

+ 27 - 4
src/components/config_point/dialog_main.vue

@@ -1,14 +1,29 @@
 <!--steps3的左侧-->
 <template>
-    <div>
-        <select-one></select-one>
+    <div class="steps3-dialog-main">
+        <select-one :name="'原始点位描述中识别的设备类型'"></select-one>
+        <select-one :name="'已标准化的设备标识'"></select-one>
+        <div class="own-collape">
+            <el-collapse v-model="activeName" accordion>
+                <el-collapse-item name="1">
+                    <template slot="title">
+                        一致性 Consistency23333
+                    </template>
+                <div>与现实生活一致:与现实生活的流程、逻辑保持一致,遵循用户习惯的语言和概念;</div>
+                <div>在界面中一致:所有的元素和结构需保持一致,比如:设计样式、图标和文本、元素的位置等。</div>
+            </el-collapse-item>
+        </el-collapse>
+        </div>
     </div>
 </template>
 <script>
     import selectOne from "components/config_point/select_one"
     export default {
         data() {
-            return {}
+            return {
+                activeName: '1',
+                
+            }
         },
         created() {},
         mounted() {},
@@ -19,5 +34,13 @@
     }
 </script>
 <style lang="scss" scoped>
-
+    .steps3-dialog-main {
+        height: 400px;
+        .own-collape {
+            float: right;
+            width: calc(100% - 520px);
+            height: 100%;
+            position: relative;
+        }
+    }
 </style>

+ 69 - 11
src/components/config_point/ip_input.vue

@@ -1,19 +1,29 @@
 <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>
+        <template v-for="(item,index) in ipAdress">
+            <li class="saga-border">
+                <input type="text" @input="checkIpVal(item,index)" @keyup="turnIpPOS(item,index,$event)" v-model="item.value" ref="ipInput" @blur="setDefaultVal(item)">
+            </li>
+            <span v-if="!!value && index == 3">:</span>
+            <li v-if="!!value && index == 3" class="saga-border">
+                <input type="text" @input="checkIpVal(value[0],4)" @keyup="turnIpPOS(value[0],4,$event)" v-model="value[0].value" ref="ipInput" @blur="setDefaultVal(value)">
+            </li>
+        </template>
     </ul>
 </template>
 <script>
     export default {
         name: "ipInput",
+        props: {
+            ip: {
+                type: [Object, String],
+                default: ""
+            },
+            port: {
+                type: [Number, String],
+                default: ""
+            }
+        },
         data() {
             return {
                 ipAdress: [{
@@ -34,10 +44,36 @@
         mounted() {},
         methods: {
             //methods
+            changeData() {
+                if (this.ip == '') {
+                    this.ipAdress = [{
+                        value: ''
+                    }, {
+                        value: ''
+                    }, {
+                        value: ''
+                    }, {
+                        value: ''
+                    }]
+                } else {
+                    this.ipAdress = this.ip.split(".").map(item => {
+                        return {
+                            value: item
+                        }
+                    })
+                }
+                if (this.port == "") {
+                    this.$set(this.value[0], `value`, '')
+                } else {
+                    this.$set(this.value[0], `value`, this.port)
+                }
+                console.log(this.value)
+            },
             checkIpVal(item, index) {
                 let self = this;
                 //确保每个值都处于0-255
-                let val = item.value;
+                let val = item.value
+                console.log(val,item)
                 //当输入的是空格时,值赋为空
                 val = val.trim();
                 val = parseInt(val, 10);
@@ -52,7 +88,12 @@
                         val = val > 255 ? 255 : val;
                     }
                 }
-                item.value = val;
+                if (index != 4) {
+                    item.value = val;
+                } else {
+                    this.value[0].value = val
+                }
+                this.changeEmit()
             },
             turnIpPOS(item, index, event) {
                 let self = this;
@@ -66,6 +107,9 @@
                 //删除键把当前数据删除完毕后会跳转到前一个input,左一不做任何处理
                 if (e.keyCode == 8) {
                     let val = item.value;
+                    if (!!val && val != 0) {
+                        return false
+                    }
                     if (index == 0) {} else {
                         self.$refs.ipInput[index - 1].focus();
                     }
@@ -76,6 +120,7 @@
                         self.$refs.ipInput[index + 1].focus();
                     }
                 }
+                this.changeEmit()
             },
             setDefaultVal(item) {
                 //当input失去焦点,而ip没有赋值时,会自动赋值为0
@@ -84,7 +129,19 @@
                 if (val == '') {
                     item.value = '0';
                 }
+                this.changeEmit()
             },
+            changeEmit() {
+                let returnData = this.ipAdress.map(item => {
+                    return item.value
+                }).join(".")
+                this.$emit("change", returnData, this.value[0].value)
+            }
+        },
+        watch: {
+            ip: function() {
+                this.changeData()
+            }
         }
     }
 </script>
@@ -95,6 +152,7 @@
         width: 100%;
         height: 100%;
         margin-right: 10px;
+        width: 280px;
         justify-content: space-around;
     }
     .ipAdress li {

+ 55 - 7
src/components/config_point/select_one.vue

@@ -1,6 +1,19 @@
+<!--
+    @param name 表头文案
+    @param isOK 是否显示前一级的完成
+    @param renderData 数据
+    @param infosKey  dom中显示renderData中的某个字段
+-->
+
 <template>
-    <div class="select-own-one">
+    <div class="select-own-one saga-border">
         <p>{{name}}</p>
+        <template v-for="item in renderData">
+            <div @click="checkItem(item)" class="select-item select-bg border-bottom pointer">
+                <span v-if="isOK"></span>
+                {{item[infosKey]}}
+            </div>
+        </template>
     </div>
 </template>
 <script>
@@ -15,13 +28,31 @@
                 type: Boolean,
                 default: false
             },
-            rendData: {
+            renderData: {
                 type: Array,
                 default: function() {
-                    return [{
-                        name: "222"
-                    }]
+                    return [
+                        {
+                            name: "222"
+                        },
+                        {
+                            name: "222"
+                        },
+                        {
+                            name: "222"
+                        },
+                        {
+                            name: "222"
+                        },
+                        {
+                            name: "222"
+                        }
+                    ]
                 }
+            },
+            infosKey: {
+                type: String,
+                default: "name"
             }
         },
         data() {
@@ -29,13 +60,30 @@
         },
         created() {},
         mounted() {},
-        methods: {}
+        methods: {
+            checkItem(item){
+                console.log(item)
+                this.$emit("check",item)
+            }
+        }
     }
 </script>
 <style lang="scss" scoped>
     .select-own-one {
+        display: inline-block;
         height: 100%;
-        width: 160px;
+        width: 230px;
         overflow-y: auto;
     }
+    .border-bottom{
+        border-bottom: 3px solid #ccc;
+    }
+    .select-item{
+        height: 30px;
+        line-height: 30px;
+    }
+    .select-item:hover{
+        color: #fff;
+        background-color: red;
+    }
 </style>

+ 29 - 23
src/components/echarts/doughnut.vue

@@ -10,10 +10,10 @@
             id: {
                 type: String
             },
-            reanderData: {
-                type: Object,
+            renderData: {
+                type: Array,
                 default: function() {
-                    return {}
+                    return []
                 }
             }
         },
@@ -28,15 +28,18 @@
         },
         methods: {
             drawDoughnut() {
+                console.log(this.renderData, "renderData")
                 let options = {
                     tooltip: {
                         trigger: 'item',
-                        formatter: "{a} <br/>{b}: {c} ({d}%)"
+                        formatter: "{b}: ({d}%)"
                     },
                     legend: {
                         orient: 'horizontal',
                         x: 'center', // 'center'
-                        data: ['1', '2', '3']
+                        data: this.renderData.map(item => {
+                            return item.name
+                        })
                     },
                     graphic: {
                         type: 'text',
@@ -51,19 +54,21 @@
                         }
                     },
                     series: [{
-                        name: '数据来源',
+                        name: '',
                         type: 'pie',
                         radius: ['40%', '60%'],
                         itemStyle: {
                             normal: {
                                 label: {
-                                    show: false,
+                                    show: true,
                                     textStyle: {
                                         color: '#3c4858',
                                         fontSize: "9"
                                     },
-                                    //   formatter: function (val) {   //让series 中的文字进行换行
-                                    //     return val.name.split("-").join("\n");                  }
+                                    formatter: function(val) { //让series 中的文字进行换行
+                                    console.log(val,val)
+                                        return val.name.split("-")[0];
+                                    }
                                 },
                                 title: {
                                     text: 'aaaa'
@@ -82,19 +87,20 @@
                                 textColor: '#000'
                             }
                         },
-                        data: [{
-                                value: 20,
-                                name: "1"
-                            },
-                            {
-                                value: 20,
-                                name: "2"
-                            },
-                            {
-                                value: 15,
-                                name: "3"
-                            }
-                        ]
+                        // data: [{
+                        //         value: 20,
+                        //         name: "1"
+                        //     },
+                        //     {
+                        //         value: 20,
+                        //         name: "2"
+                        //     },
+                        //     {
+                        //         value: 15,
+                        //         name: "3"
+                        //     }
+                        // ]
+                        data: this.renderData
                     }],
                     color: ['#9DA2D6', '#FBACA1', '#FFE37F']
                 }
@@ -103,7 +109,7 @@
             },
         },
         watch: {
-            reanderData: {
+            renderData: {
                 deep: true,
                 handler: function() {
                     this.drawDoughnut()

+ 27 - 2
src/fetch/request.js

@@ -3,12 +3,33 @@ import instance from "./fetch"
 import { Message } from 'element-ui';
 import router from '@/router/index.js'
 
+/**
+ * 
+ * @param {项目的filters} obj
+ * 
+ * @return {处理后的字符串}  string
+ */
+function delFilters(obj) {
+    let str, key
+    for (key in obj) {
+        if (typeof obj[key] == 'string') {
+            str = key + "='" + obj[key] + "';"
+        } else {
+            str = key + "=" + obj[key] + ";"
+        }
+    }
+    return str.split(';').map(item => {
+        return !!item ? item : undefined
+
+    }).filter(d => d).join(';')
+}
+
 function successResponse(response, success, failed) {
     let res = response.data;
     let result = res.result || res.Result;
-    if (result == "success") {
+    if (result == "success" || result == "Success") {
         success(res)
-    } else if (result == "failure") {
+    } else if (result == "failure" || result == "Failure") {
         let msg = res.ResultMsg || res.message || res.Message || res.resultMsg
         Message.error({ message: msg })
     } else {
@@ -35,6 +56,10 @@ function errorResponse(response, err) {
  * @returns {Promise}
  */
 export function post(url, data = {}, success) {
+    if (data.hasOwnProperty('Filters')) {
+        data.Filters = delFilters(data.Filters)
+    }
+    console.log(data, 'data')
     instance.post(url, data).then(response => {
         //对接口错误码做处理
         successResponse(response, success)

+ 3 - 1
src/store/index.js

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

+ 19 - 13
src/utils/handsontable/delType.js

@@ -1,12 +1,18 @@
-export function showTypes(arr) {
+/**
+ * 
+ * @param {表头数组} arr 
+ * @param {添加的参数} '
+ * 
+ * @returns {对应数组} arr
+ */
+
+export function showTypes(arr, infosKey = '') {
     let data = arr.map(item => {
-        // if (falg) {
         if (item.FirstTag == "控制参数" ||
             item.FirstTag == "设定参数" ||
             item.FirstTag == "运行参数") {
             return undefined
         }
-        // }
         if (item.InfoPointCode == "BIMLocation") {
             return undefined
         }
@@ -18,7 +24,7 @@ export function showTypes(arr) {
 
             if (item.InfoPointCode == "EquipQRCode") {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     // renderer: text.lookQRCode,
                     readOnly: true
                 }
@@ -33,7 +39,7 @@ export function showTypes(arr) {
                 item.InfoPointCode == "Drawing"
             ) {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     // renderer: text.picType,
                     readOnly: true
                 }
@@ -44,7 +50,7 @@ export function showTypes(arr) {
                 item.InfoPointCode == "Archive" ||
                 item.InfoPointCode == "CheckReport") {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     // renderer: text.fileType,
                     readOnly: true
                 }
@@ -52,7 +58,7 @@ export function showTypes(arr) {
 
             if (item.InputMode == "D1") {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     // renderer: tools.customDropdownRenderer,
                     editor: "chosen",
                     chosenOptions: {
@@ -62,7 +68,7 @@ export function showTypes(arr) {
                 };
             } else if (item.InputMode == "A1" || item.InputMode == "A2") {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     type: "numeric",
                     numericFormat: {
                         pattern: "0,0.00"
@@ -72,7 +78,7 @@ export function showTypes(arr) {
                 };
             } else if (item.InputMode == "C5") {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     type: "date",
                     dateFormat: "YYYY-MM-DD",
                     correctFormat: true
@@ -84,7 +90,7 @@ export function showTypes(arr) {
                 item.InputMode == "L2"
             ) {
                 return {
-                    data: "infos." + item.InfoPointCode
+                    data: infosKey + item.InfoPointCode
                 };
             } else if (
                 item.InputMode == "X" ||
@@ -94,12 +100,12 @@ export function showTypes(arr) {
             ) {
                 //   return undefined
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     readOnly: true
                 };
             } else if (item.InputMode == "D2") {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     // renderer: tools.customDropdownRenderer,
                     editor: "chosen",
                     chosenOptions: {
@@ -109,7 +115,7 @@ export function showTypes(arr) {
                 };
             } else if (item.InputMode == "Own" && !onlyRead) {
                 return {
-                    data: "infos." + item.InfoPointCode,
+                    data: infosKey + item.InfoPointCode,
                     // renderer: text.idType,
                 }
             } else {

+ 15 - 15
src/utils/point_edit/handson_header.js

@@ -1,5 +1,5 @@
 const headers = {
-    "Modbus TCP": [{
+    "modbus-tcp": [{
             InfoPointName: "从站地址",
             InfoPointCode: "SlaveID",
             InputMode: "B1",
@@ -44,7 +44,7 @@ const headers = {
             FirstTag: ""
         }
     ],
-    "BACNet IP": [{
+    "bacnet-ip": [{
             InfoPointName: "设备标识",
             InfoPointCode: "DeviceID",
             InputMode: "B1",
@@ -75,21 +75,21 @@ const headers = {
             FirstTag: ""
         }
     ],
-    "OPC": [{
+    "opc": [{
         InfoPointName: "点位编码(统一标识)",
         InfoPointCode: "Item",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     }],
-    "KNX": [{
+    "knx": [{
         InfoPointName: "组地址",
         InfoPointCode: "GroupAddress",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     }],
-    "MQTT": [{
+    "mqtt": [{
             InfoPointName: "deviceId",
             InfoPointCode: "DeviceId",
             InputMode: "B1",
@@ -104,7 +104,7 @@ const headers = {
             FirstTag: ""
         }
     ],
-    "AMQP": [{
+    "amqp": [{
             InfoPointName: "Exchange",
             InfoPointCode: "Exchange",
             InputMode: "B1",
@@ -120,7 +120,7 @@ const headers = {
         },
         {
             InfoPointName: "Routingkey",
-            InfoPointCode: "Routingkey",
+            InfoPointCode: "RoutingKey",
             InputMode: "B1",
             Visible: true,
             FirstTag: ""
@@ -130,28 +130,28 @@ const headers = {
 
 let common = [{
         InfoPointName: "原始点位描述",
-        InfoPointCode: "",
+        InfoPointCode: "Description",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     },
     {
         InfoPointName: "值/单位说明",
-        InfoPointCode: "",
+        InfoPointCode: "ValueDescription",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     },
     {
         InfoPointName: "位置标签",
-        InfoPointCode: "",
+        InfoPointCode: "LocationFlag",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     },
     {
         InfoPointName: "备注",
-        InfoPointCode: "",
+        InfoPointCode: "Remarks",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
@@ -172,28 +172,28 @@ let common = [{
     },
     {
         InfoPointName: "使用",
-        InfoPointCode: "",
+        InfoPointCode: "Used",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     },
     {
         InfoPointName: "设备类型关键字",
-        InfoPointCode: "",
+        InfoPointCode: "KeyEquipmentType",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     },
     {
         InfoPointName: "设备参数关键字",
-        InfoPointCode: "",
+        InfoPointCode: "KeyEquipmentParameter",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""
     },
     {
         InfoPointName: "设备标识",
-        InfoPointCode: "",
+        InfoPointCode: "EquipmentMark",
         InputMode: "B1",
         Visible: true,
         FirstTag: ""

+ 6 - 0
src/utils/tools.js

@@ -20,4 +20,10 @@ tools.getCookie = name => {
     }
 }
 
+tools.delObjKey = (obj, key) => {
+    if (obj.hasOwnProperty(key)) {
+        delete obj[key]
+    }
+}
+
 export default tools

+ 156 - 41
src/views/config_point/edit_origin/index.vue

@@ -1,73 +1,188 @@
 <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 class="margin-view"></div>
+        <div class="btn-view">
+            <el-button class="btn" @click="btnClick">{{ id? '保存修改': '新建'}}</el-button>
+        </div>
+        <div class="content-view">
+            <el-form label-width="10px" style="width:400px;" :model="formData" class="dcenter">
+                <el-form-item label="">
+                    <el-input v-model="formData.Name" placeholder="请输入新项目名称"></el-input>
+                </el-form-item>
+            </el-form>
+            <el-input type="textarea" class="edit-textarea dcenter block" v-model="formData.Description" placeholder="数据源的说明再次编辑维护..."></el-input>
+            <el-form label-width="120px" style="width:400px;" :model="formData" class="dcenter">
+                <el-form-item label="协议类型">
+                    <el-select v-model="formData.ProtocolType" 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="formData.ProtocolInfo.Ip" :port="formData.ProtocolInfo.Port" @change="changeItem"></ip-input>
+                </el-form-item>
+                <el-form-item label="用户名/密码" v-if="(passWordArr.indexOf(formData.ProtocolType) > -1)">
+                    <el-input v-model="formData.ProtocolInfo.User" style="display:inline-block;width:100px;"></el-input>/
+                    <el-input v-model="formData.ProtocolInfo.Password" style="display:inline-block;width:100px;"></el-input>
+                </el-form-item>
+                <el-form-item label="ProgID" v-if="formData.ProtocolType == 'opc'">
+                    <el-input v-model="formData.ProtocolInfo.ProgID" style="display:inline-block;width:100px;"></el-input>
+                </el-form-item>
+            </el-form>
+        </div>
     </div>
 </template>
 <script>
     import ipInput from "components/config_point/ip_input"
     import bread from "components/common/bread_crumb"
+    import tools from "utils/tools"
+    import {
+        queryDataSource,
+        updateDataSource,
+        createDataSource
+    } from "fetch/point_http"
+    import {
+        mapGetters,
+        mapActions
+    } from "vuex";
     export default {
+        computed: {
+            ...mapGetters("project", [
+                "projectId"
+            ])
+        },
         data() {
             return {
+                passWordArr: ['mqtt', 'amqp', 'opc'],
                 formData: {
-                    "comProtocol": "", //协议类型
-                    "originName": "2323",
-                    "ip": ["", "", "", ""], //ip
-                    "port": "", //端口号,有些协议类型没有该信息
-                    "userName": "", //用户名
-                    "password": "", //密码
-                    "progID": "", //progID
-                    note: ""
+                    "ProtocolType": "", //协议类型
+                    "Name": "",
+                    ProtocolInfo: {
+                        "Ip": "", //ip
+                        "Port": "", //端口号,有些协议类型没有该信息
+                        "User": "", //用户名
+                        "Password": "", //密码
+                        "ProgID": "", //progID
+                    },
+                    Description: ""
                 },
                 options: [{
-                    value: 'Modbus TCP',
+                    value: 'modbus-tcp',
                     label: 'Modbus TCP'
                 }, {
-                    value: 'BACNet IP',
+                    value: 'bacnet-ip',
                     label: 'BACNet IP'
                 }, {
-                    value: 'OPT',
-                    label: 'OPT'
+                    value: 'opc',
+                    label: 'OPC'
                 }, {
-                    value: 'KNX',
+                    value: 'knx',
                     label: 'KNX'
                 }, {
-                    value: 'MQTT',
+                    value: 'mqtt',
                     label: 'MQTT'
                 }, {
-                    value: 'AMQP',
+                    value: 'amqp',
                     label: 'AMQP'
-                }]
+                }],
+                id: this.$route.query.key
             }
         },
         components: {
             ipInput,
             bread
         },
-        created() {},
-        mounted() {},
-        methods: {}
+        created() {
+        },
+        mounted() {
+            if (!!this.id) {
+                this.getDataSouse()
+            }
+        },
+        methods: {
+            changeItem(ip, port) {
+                this.formData.ProtocolInfo.Ip = ip
+                this.formData.ProtocolInfo.Port = port
+            },
+            getDataSouse() {
+                let param = {
+                    Filters: {
+                        ProjectId: this.projectId,
+                        Id: this.id
+                    },
+                    "PageNumber": 1,
+                    "PageSize": 50,
+                    "Projection": [
+                    ]
+                }
+                queryDataSource(param, res => {
+                    let data = res.Content[0]
+                    if (!data.ProtocolInfo) {
+                        //信息点为空时
+                        data.ProtocolInfo = {
+                            "Ip": "", //ip
+                            "Port": "",
+                            "User": "", //用户名
+                            "Password": "", //密码
+                            "ProgID": "", //progID
+                        }
+                    } else {
+                        //有信息点时
+                    }
+                    this.formData = data
+                    console.log(this.formData, "formData")
+                })
+            },
+            btnClick() {
+                console.log(this.formData, "form")
+                let param = this.formData
+                tools.delObjKey(param, "CreateTime")
+                tools.delObjKey(param, "LastUpdate")
+                if (!!this.id) {
+                    if(param.ProtocolInfo.Port == ""){
+                        delete param.ProtocolType.Port
+                    }else{
+                        param.ProtocolType.Port = Number(param.ProtocolType.Port)
+                    }
+                    updateDataSource({
+                        Content: [param],
+                        Projection: []
+                    }, res => {
+                        console.log(res, 'res')
+                        this.$message.success("更新成功!")
+                    })
+                } else {
+                    param.ProjectId = this.projectId
+                    console.log(param, "param")
+                    createDataSource(param, res => {
+                        console.log(res)
+                    })
+                }
+            },
+        }
     }
 </script>
-<style>
-
-</style>
+<style lang="scss">
+    .margin-view {
+        height: 60px;
+    }
+    .btn-view {
+        overflow: hidden;
+        .btn {
+            float: right;
+            margin-right: 40px;
+        }
+    }
+    .content-view {
+        width: 928px;
+        margin: auto;
+        .edit-textarea {
+            margin: 10px 0;
+            height: 117px;
+            textarea {
+                height: 100%;
+                background-color: #EEFAFF;
+            }
+        }
+    }
+</style>

+ 31 - 9
src/views/config_point/index.vue

@@ -5,7 +5,7 @@
         <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">
+                <data-origin :id="'origin' + index" :renderData="item">
                     <el-button @click="maintenance(item)" type="text">维护点位</el-button>
                     <el-button @click="goEdit(item)" type="text">编辑数据源</el-button>
                 </data-origin>
@@ -13,13 +13,18 @@
             <div class="disIne saga-list-item margin5 center pointer" @click="addItem">
                 <i class="add-icon margin50">+</i>
             </div>
-            <router-view></router-view>
+            <!-- <router-view></router-view> -->
             <!-- </el-row> -->
         </div>
     </div>
 </template>
 <script>
     import dataOrigin from "components/config_point/data_origin"
+    import {
+        mapGetters,
+        mapActions
+    } from "vuex";
+    import { queryDataSourceCount } from "fetch/point_http"
     export default {
         components: {
             dataOrigin
@@ -27,30 +32,47 @@
         data() {
             return {
                 projectName: "项目名称",
-                list: [{
-                    name: "111",
-                    id: "222",
-                    note: "21324234324234342343423423312312312312312321312312325345fdsafsdfsddgfshgdfsgehjfvdsbjfasbdfkdbsthjgdbgavksdbgfvjksdafbgdistghbdkbagvaksdbgkjd"
-                }, ]
+                list: []
             }
         },
+        computed: {
+            ...mapGetters("project", [
+                "projectId"
+            ])
+        },
         created() {},
-        mounted() {},
+        mounted() {
+            console.log(this.projectId)
+            this.getList()
+        },
         methods: {
+            getList(){
+                let param = {
+                    Filters: {ProjectId: this.projectId}
+                }
+                queryDataSourceCount(param,res => {
+                    console.log(res)
+                    this.list = res.Content
+                })
+            },
             addItem() {
                 this.$router.push({
                     path: "configPoint/editOrigin"
                 })
             },
             goEdit(item) {
+                console.log(item)
                 this.$router.push({
                     path: "configPoint/editOrigin",
                     query: {
-                        key: item.id
+                        key: item.Id
                     }
                 })
             },
             maintenance(item) {
+                console.log(item)
+                this.$store.commit("project/set_datasource", item.Id);
+                this.$store.commit("project/set_protocol_type", item.ProtocolType);
                 this.$router.push({
                     path: "configPoint/steps",
                 })

+ 27 - 9
src/views/config_point/steps/index.vue

@@ -3,18 +3,18 @@
         <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>
+                <div
+                  @click="changeStep(index)"
+                  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>
+      <step1 ref="step" v-if="activeStep == 1"></step1>
+      <step2 ref="step" v-if="activeStep == 2"></step2>
+      <step3 ref="step" v-if="activeStep == 3"></step3>
+      <step4 ref="step" v-if="activeStep == 4"></step4>
     </div>
   </div>
 </template>
@@ -38,6 +38,24 @@
         methods: {
             stepClick() {
                 console.log("test")
+            },
+            changeStep(index) {
+                console.log()
+                let step = this.$refs.step
+                let flag = step.hasOwnProperty('noSaveData') ? step.noSaveData() : false
+                if (flag || this.activeStep == 4 || this.activeStep == 3) {
+                    this.activeStep = index + 1
+                } else {
+                    this.$confirm('存在数据未保存, 是否继续?', '提示', {
+                        confirmButtonText: '确定',
+                        cancelButtonText: '取消',
+                        type: 'warning'
+                    }).then(() => {
+                        this.activeStep = index + 1
+                    }).catch(() => {
+                        return false
+                    });
+                }
             }
         },
         components: {

+ 138 - 15
src/views/config_point/steps/step1.vue

@@ -4,12 +4,12 @@
             <el-button>获取原始点位当前值</el-button>
             <el-button>导出Excel模板</el-button>
             <el-button>导入Excel</el-button>
-            <el-button>新增行</el-button>
-            <el-button>保存</el-button>
+            <el-button @click="addRow">新增行</el-button>
+            <el-button @click="saveData">保存</el-button>
             <el-checkbox v-model="checked">只显示使用的原始点位</el-checkbox>
         </div>
         <div id="handsontableSteps1">
-            <handsontable-component ref="handsontable"></handsontable-component>
+            <handsontable-component ref="handsontable" @change="changeHand"></handsontable-component>
         </div>
     </div>
 </template>
@@ -17,37 +17,160 @@
     import handsontableComponent from "components/common/handsontable"
     import getHeaderSetting from "utils/point_edit/handson_header"
     import {
+        mapGetters,
+        mapActions
+    } from "vuex";
+    import {
         changeHeader,
         showTypes
     } from "utils/handsontable/delType"
+    import {
+        queryPoint,
+        updatePoint,
+        createPoint
+    } from "fetch/point_http"
     export default {
         data() {
             return {
                 checked: false,
-                settings: {}
+                settings: {},
+                hot: null,
+                changeFlag: true, //是否发生修改
+            }
+        },
+        computed: {
+            ...mapGetters("project", [
+                "projectId",
+                "datasourceId",
+                "protocolType"
+            ])
+        },
+        created() {
+            if (!this.protocolType) {
+                this.$router.push({
+                    path: "/configPoint"
+                })
             }
         },
-        created() {},
         mounted() {
+            console.log(this.datasourceId, this.protocolType)
             this.getData()
         },
         methods: {
+            addRow(){
+                let data = this.hot.getSourceData()
+                data.unshift({})
+                this.hot.loadData(data)
+                this.hot.updateSettings({
+                    maxRows: data.length
+                })
+                console.log(data,this.hot,"data")
+            },
             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
+                let header, width, param, settings
+                header = getHeaderSetting(this.protocolType)
+                width = (document.getElementById("app").clientWidth - 50) / header.length
+                param = {
+                    type: this.protocolType,
+                    data: {
+                        Filters: {
+                            DatasourceId: this.datasourceId,
+                        },
+                        "PageNumber": 1,
+                        "PageSize": 50,
+                    }
                 }
-                this.$refs.handsontable.init(settings)
+                queryPoint(param, res => {
+                    console.log(res)
+                    settings = {
+                        data: res.Content,
+                        colHeaders: changeHeader(header),
+                        columns: showTypes(header),
+                        colWidths: width,
+                        rowHeights: 30,
+                        maxRows: res.Content.length
+                    }
+                    this.hot = this.$refs.handsontable.init(settings)
+                    console.log(this.hot)
+                })
+            },
+            //修改提示
+            changeHand(changeData, source) {
+                if(!!changeData){
+                    this.changeFlag = false
+                }
+                return false
+            },
+            //保存
+            saveData() {
+                if (!!this.hot) {
+                    console.log(this.hot.getSourceData())
+                    let data = this.hot.getSourceData(),updateList = [],createList = [];
+                    data.map(item => {
+                        if(!!item.Id){
+                            delete item.CreateTime
+                            delete item.LastUpdate
+                            updateList.push(item)
+                        }else{
+                            createList.push(item)
+                        }
+                    })
+                    console.log(updateList,"updateList")
+                    if(updateList.length){
+                        this.update(updateList)
+                    }
+
+                    if(createList.length){
+                        this.createList(createList)
+                    }
+                } else {
+                    this.$message.error("请确保存在数据")
+                }
+            },
+            async createList(createList){
+                console.log(createList)
+                let i = 0;
+                for(i;i < createList.length;i++){
+                    if(createList[i].hasOwnProperty("Description")){
+                        await this.create(createList[i])
+                    }
+                }
+                this.changeFlag = true
+            },
+
+            async create(obj){
+                console.log(obj)
+                obj.DatasourceId = this.datasourceId
+                obj.ProjectId = this.projectId
+                await createPoint({
+                    data:obj,
+                    type: this.protocolType
+                    },res => {
+                    console.log(res)
+                    obj.Id = res.Id
+                })
+            },
+            /**
+             * @param {更新list} updateList
+             * 
+             * 更新点位
+             */
+            update(updateList){
+                updatePoint({
+                    data:{Content:updateList},
+                    type: this.protocolType
+                },res => {
+                    console.log(res)
+                })
+            },
+            //没有保存的时候弹窗
+            noSaveData() {
+                return this.changeFlag
             }
         },
         components: {
             handsontableComponent
-        }
+        },
     }
 </script>
 <style lang="scss" scoped>

+ 77 - 20
src/views/config_point/steps/step2.vue

@@ -4,42 +4,69 @@
             <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 @click="examine">检查&微调</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 :width="'60%'" :title="title" :dialogVisible="isDialogShow" @cancel="close">
+            <find-keyword ref="findKeyword" :type="type"></find-keyword>
+        </own-dialog>
+        <own-dialog :width="'60%'" title="关键内容设别——检查&微调" :dialogVisible="examineDialog" @cancel="close">
+            <!-- <find-keyword ref="findKeyword" :type="type"></find-keyword> -->
+            <examine-main></examine-main>
         </own-dialog>
     </div>
 </template>
 <script>
     import handsontableComponent from "components/common/handsontable"
+    import examineMain from "components/config_point/examine_main"
     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"
+    import {
+        mapGetters,
+        mapActions
+    } from "vuex";
+    import {
+        queryPoint
+    } from "fetch/point_http"
+    import findKeyword from "components/config_point/find_keyword"
     export default {
         data() {
             return {
                 checked: false,
                 settings: {},
                 isDialogShow: false,
-                msg: ""
+                msg: "",
+                hot: null,
+                title: "",
+                type: "",
+                examineDialog: false
+            }
+        },
+        created() {
+            if (!this.protocolType) {
+                this.$router.push({
+                    path: "/configPoint"
+                })
             }
         },
-        created() {},
         mounted() {
             this.getData()
         },
+        computed: {
+            ...mapGetters("project", [
+                "projectId",
+                "datasourceId",
+                "protocolType"
+            ])
+        },
         methods: {
             /**
              *  @param num 代表着1类型2参数
@@ -47,32 +74,62 @@
              */
             discern(num) {
                 if (num == 1) {
+                    this.title = "关键内同识别——批量识别设备类型关键字"
+                    this.type = "type"
                 } else if (num == 2) {
+                    this.title = "关键内同识别——批量识别设备参数关键字"
+                    this.type = "arguments"
                 }
                 this.isDialogShow = true
-            },
-            getCutString() {
-                console.log(this.$refs.cutString.getData())
+                this.$nextTick(() => {
+                    this.$refs.findKeyword.changeType()
+                })
             },
             close() {
                 this.isDialogShow = false
             },
+            //点击检查按钮
+            examine(){
+                this.examineDialog = true
+            },
+
+            //获取初始数据
             getData() {
-                let width = (document.getElementById("app").clientWidth - 50) / headerArr.length
-                let settings = {
-                    data: [{}],
-                    colHeaders: changeHeader(headerArr),
-                    columns: showTypes(headerArr),
-                    colWidths: width,
-                    rowHeights: 30
+                let width, param, settings
+                width = (document.getElementById("app").clientWidth - 50) / headerArr.length
+                param = {
+                    type: this.protocolType,
+                    data: {
+                        Filters: {
+                            DatasourceId: this.datasourceId,
+                        },
+                        "PageNumber": 1,
+                        "PageSize": 50,
+                    }
                 }
-                this.$refs.handsontable.init(settings)
+                queryPoint(param, res => {
+                    console.log(res)
+                    settings = {
+                        data: res.Content,
+                        colHeaders: changeHeader(headerArr),
+                        columns: showTypes(headerArr),
+                        colWidths: width,
+                        rowHeights: 30,
+                        maxRows: res.Content.length
+                    }
+                    this.hot = this.$refs.handsontable.init(settings)
+                    console.log(this.hot)
+                })
+            },
+            noSaveData(){
+                return true
             }
         },
         components: {
             handsontableComponent,
             ownDialog,
-            cutString
+            findKeyword,
+            examineMain
         }
     }
 </script>

+ 48 - 11
src/views/config_point/steps/step3.vue

@@ -8,7 +8,7 @@
         <div id="handsontableSteps1">
             <handsontable-component ref="handsontable"></handsontable-component>
         </div>
-        <own-dialog :width="'60%'" :dialogVisible="isDialogShow" @cancel="close">
+        <own-dialog :width="'1000px'" :dialogVisible="isDialogShow" @cancel="close">
             <dialog-main></dialog-main>
         </own-dialog>
     </div>
@@ -16,21 +16,42 @@
 <script>
     import handsontableComponent from "components/common/handsontable"
     import headerArr from "utils/point_edit/steps3.js"
-    import {
+     import {
         changeHeader,
         showTypes
     } from "utils/handsontable/delType"
+    import {
+        mapGetters,
+        mapActions
+    } from "vuex";
     import ownDialog from "components/el_pack/dialog"
     import dialogMain from "components/config_point/dialog_main"
+    import {
+        queryPoint
+    } from "fetch/point_http"
     export default {
         data() {
             return {
                 checked: false,
                 settings: {},
                 isDialogShow: false,
+                hot: null
+            }
+        },
+        computed: {
+            ...mapGetters("project", [
+                "projectId",
+                "datasourceId",
+                "protocolType"
+            ])
+        },
+        created() {
+            if (!this.protocolType) {
+                this.$router.push({
+                    path: "/configPoint"
+                })
             }
         },
-        created() {},
         mounted() {
             this.getData()
         },
@@ -48,15 +69,31 @@
             },
             //初始化表格实例
             getData() {
-                let width = (document.getElementById("app").clientWidth - 50) / headerArr.length
-                let settings = {
-                    data: [{}],
-                    colHeaders: changeHeader(headerArr),
-                    columns: showTypes(headerArr),
-                    colWidths: width,
-                    rowHeights: 30
+                let width, param, settings
+                width = (document.getElementById("app").clientWidth - 50) / headerArr.length
+                param = {
+                    type: this.protocolType,
+                    data: {
+                        Filters: {
+                            Id: this.datasourceId,
+                        },
+                        "PageNumber": 1,
+                        "PageSize": 50,
+                    }
                 }
-                this.$refs.handsontable.init(settings)
+                queryPoint(param, res => {
+                    console.log(res)
+                    settings = {
+                        data: res.Content,
+                        colHeaders: changeHeader(headerArr),
+                        columns: showTypes(headerArr),
+                        colWidths: width,
+                        rowHeights: 30,
+                        maxRows: res.Content.length
+                    }
+                    this.hot = this.$refs.handsontable.init(settings)
+                    console.log(this.hot)
+                })
             }
         },
         components: {

+ 9 - 1
vue.config.js

@@ -19,7 +19,15 @@ module.exports = {
                 ws: true,
                 // 将主机标头的原点更改为目标URL
                 changeOrigin: false
-            }
+            },
+            '/pointconfig': {
+                // 目标 API 地址
+                target: 'http://172.16.0.141:8080/',
+                // 如果要代理 websockets
+                ws: true,
+                // 将主机标头的原点更改为目标URL
+                changeOrigin: false
+            },
         },
         // alias: {
         //     "assets": "src/assets"