modify relation delete n-1 or 1-n

src/components/point/dynamicdata/delRelationDialog.vue

@@ -2,43 +2,46 @@
   <el-dialog title="提示" :visible.sync="dialogVisible" :width="dialogWidth" @close="handleClose" id="delRelation">
     <span>确定要清除对应关系？</span>
     <div v-loading="loading">
-      <div v-show="0">
-        <el-row>
+      <div v-show="ltableData.length>1">
+        <div style="margin:10px 0;">有多个设备标识对应了该设备实例，是否一并清除对应关系？</div>
+        <el-row class="bgf5">
           <el-col :span="18">
-            <el-table :data="tableData" style="width: 100%;max-height:400px;" height="calc(100% - 160px)">
-              <el-table-column label="设备标识" align="right">
-                <el-table-column label="数据源" prop="name" class-name="bgf5" align="right"></el-table-column>
-                <el-table-column label="位置标签" prop="name" align="right"></el-table-column>
-                <el-table-column label="设备标识" prop="name" align="right"></el-table-column>
-                <el-table-column type="selection"></el-table-column>
+            <el-table :data="ltableData" style="width: 100%;max-height:400px;" height="calc(100% - 160px)" @selection-change="changeSelection">
+              <el-table-column label="设备标识" align="right" class-name="bgfff">
+                <el-table-column label="数据源" prop="Datasource" align="right" class-name="bgfff" show-overflow-tooltip></el-table-column>
+                <el-table-column label="位置标签" prop="LocationFlag" align="right" class-name="bgfff" show-overflow-tooltip>
+                  <template slot-scope="scope">{{ scope.row.LocationFlag.toString() }}</template>
+                </el-table-column>
+                <el-table-column label="设备标识" prop="EquipmentMark" align="right" class-name="bgf5" show-overflow-tooltip></el-table-column>
+                <el-table-column type="selection" class-name="bgf5"></el-table-column>
               </el-table-column>
             </el-table>
           </el-col>
           <el-col :span="6">
-            <el-table :data="tableData" style="width: 100%;max-height:400px;" height="calc(100% - 160px)">
-              <el-table-column label="设备实例">
-                <el-table-column label="设备实例" prop="name" class-name="bgf5"></el-table-column>
-              </el-table-column>
-            </el-table>
+            <div class="singleDir pl-10 font-default">设备实例</div>
+            <div class="pl-10 font-default">{{rtableData[0].EquipLocalName}}</div>
+            <div class="pl-10 font-default">{{rtableData[0].BuildLocalName}}-{{rtableData[0].FloorLocalName}}</div>
+            <div class="pl-10 font-default">{{rtableData[0].RoomLocalName}}</div>
           </el-col>
         </el-row>
       </div>
-      <div v-show="0">
-        <el-row>
-          <el-col :span="18">
-            <el-table :data="tableData" style="width: 100%;max-height:400px;" height="calc(100% - 160px)">
-              <el-table-column label="设备标识" align="right">
-                <el-table-column label="数据源" prop="name" class-name="bgf5" align="right"></el-table-column>
-                <el-table-column label="位置标签" prop="name" align="right"></el-table-column>
-                <el-table-column label="设备标识" prop="name" align="right"></el-table-column>
-                <el-table-column type="selection"></el-table-column>
-              </el-table-column>
-            </el-table>
-          </el-col>
+      <div v-show="rtableData.length>1">
+        <div style="margin:10px 0;">有多个设备实例对应了该设备标识，是否一并清除对应关系？</div>
+        <el-row class="bgf5">
           <el-col :span="6">
-            <el-table :data="tableData" style="width: 100%;max-height:400px;" height="calc(100% - 160px)">
-              <el-table-column label="设备实例">
-                <el-table-column label="设备实例" prop="name" class-name="bgf5"></el-table-column>
+            <div class="singleDir pr-10 font-default tr">设备标识</div>
+            <div class="pr-10 font-default tr">{{ltableData[0].EquipmentMark}}</div>
+            <div class="pr-10 font-default tr">{{ltableData[0].LocationFlag.toString()}}</div>
+            <div class="pr-10 font-default tr">{{ltableData[0].Datasource}}</div>
+          </el-col>
+          <el-col :span="18">
+            <el-table :data="rtableData" style="width: 100%;max-height:400px;" height="calc(100% - 160px)" @selection-change="changeSelection">
+              <el-table-column label="设备实例" class-name="bgfff">
+                <el-table-column type="selection" class-name="bgf5"></el-table-column>
+                <el-table-column label="设备实例名称" prop="EquipLocalName" class-name="bgf5" show-overflow-tooltip></el-table-column>
+                <el-table-column label="设备实例编码" prop="ObjectID" class-name="bgfff" show-overflow-tooltip></el-table-column>
+                <el-table-column label="所在建筑楼层" prop="FloorLocalName" class-name="bgfff" show-overflow-tooltip> </el-table-column>
+                <el-table-column label="所在业务空间" prop="RoomLocalName" class-name="bgfff" show-overflow-tooltip></el-table-column>
               </el-table-column>
             </el-table>
           </el-col>
@@ -46,7 +49,7 @@
       </div>
     </div>
     <span slot="footer" class="dialog-footer">
-      <el-button size="small">取消</el-button>
+      <el-button size="small" @click="handleClose">取消</el-button>
       <el-button size="small" type="primary" v-show="1" v-loading="loading" @click="handleDelete">确定</el-button>
       <el-button size="small" type="primary" v-show="0" v-loading="loading">清除已选的对应规则</el-button>
     </span>
@@ -58,123 +61,174 @@ export default {
   data() {
     return {
       dialogVisible: false, //弹窗显示与隐藏
-      tableData: [
-        {
-          id: "12987122",
-          name: "好滋好味鸡蛋仔",
-          category: "江浙小吃、小吃零食",
-          desc: "荷兰优质淡奶，奶香浓而不腻",
-          address: "上海市普陀区真北路",
-          shop: "王小虎夫妻店",
-          shopId: "10333"
-        },
-        {
-          id: "12987123",
-          name: "好滋好味鸡蛋仔",
-          category: "江浙小吃、小吃零食",
-          desc: "荷兰优质淡奶，奶香浓而不腻",
-          address: "上海市普陀区真北路",
-          shop: "王小虎夫妻店",
-          shopId: "10333"
-        },
-        {
-          id: "12987125",
-          name: "好滋好味鸡蛋仔",
-          category: "江浙小吃、小吃零食",
-          desc: "荷兰优质淡奶，奶香浓而不腻",
-          address: "上海市普陀区真北路",
-          shop: "王小虎夫妻店",
-          shopId: "10333"
-        },
-        {
-          id: "12987126",
-          name: "好滋好味鸡蛋仔",
-          category: "江浙小吃、小吃零食",
-          desc: "荷兰优质淡奶，奶香浓而不腻",
-          address: "上海市普陀区真北路",
-          shop: "王小虎夫妻店",
-          shopId: "10333"
-        },
-        {
-          id: "12987127",
-          name: "好滋好味鸡蛋仔",
-          category: "江浙小吃、小吃零食",
-          desc: "荷兰优质淡奶，奶香浓而不腻",
-          address: "上海市普陀区真北路",
-          shop: "王小虎夫妻店",
-          shopId: "10333"
-        },
-        {
-          id: "12987128",
-          name: "好滋好味鸡蛋仔",
-          category: "江浙小吃、小吃零食",
-          desc: "荷兰优质淡奶，奶香浓而不腻",
-          address: "上海市普陀区真北路",
-          shop: "王小虎夫妻店",
-          shopId: "10333"
-        },
-        {
-          id: "12987129",
-          name: "好滋好味鸡蛋仔",
-          category: "江浙小吃、小吃零食",
-          desc: "荷兰优质淡奶，奶香浓而不腻",
-          address: "上海市普陀区真北路",
-          shop: "王小虎夫妻店",
-          shopId: "10333"
-        }
-      ],
+      ltableData: [], // 左侧数据
+      rtableData: [], // 右侧数据
       activeName: "first", //当前所在tab页
-      loading: false,
-      dialogWidth: '20%',
+      loading: false, //loading状态
+      dialogWidth: "20%", //弹窗宽度
+      selection:[]
     };
   },
   methods: {
+    //弹窗显示
     showDialog(row) {
-      this.dialogVisible = true;
+      this.loading = true;
       //需先用对象请求接口返回所需对象
       console.log(row);
       let param = [];
       let o1 = {
-        ObjectID:row.ObjectID,
-        TypeName:row.TypeName
-      }
+        ObjectID: row.ObjectID,
+        TypeName: row.TypeName
+      };
       let o2 = {
-        EquipmentMark:row.EquipmentMark,
-        TypeName:row.TypeName
-      }
-      let Objs = []
-      let Points = []
+        EquipmentMark: row.EquipmentMark,
+        TypeName: row.TypeName
+      };
+      let Objs = [];
+      let Points = [];
       Objs.push(o1);
       Points.push(o2);
       let object = {
-        Objs:Objs,
-        Points:Points,
-      }
-      param.push(object)
+        Objs: Objs,
+        Points: Points
+      };
+      param.push(object);
       this.param = param;
-      console.log(param)
+      setTimeout(() => {
+        this.loading = false;
+      }, 800);
+      let res = [
+        {
+          Objs: [
+            {
+              BuildLocalName: "南主楼",
+              EquipLocalName: "路演休闲大厅风机盘管",
+              FloorLocalName: "F3",
+              ObjectID: "dd825b8d300811e98edb056b3a4c3ca8",
+              ProjectId: "Pj1101020006",
+              RoomLocalName: "路演休闲大厅 42",
+              SpaceType: "默认分区",
+              SubTypeCode: "ATFC",
+              SubTypeName: "ATFC",
+              TypeCode: "Eq",
+              TypeName: "设备"
+            },
+            // {
+            //   BuildLocalName: "南主楼",
+            //   EquipLocalName: "路演休闲大厅3333风机盘管",
+            //   FloorLocalName: "F3",
+            //   ObjectID: "dd825b8d300811e98edb056b3a4c3cau",
+            //   ProjectId: "Pj1101020006",
+            //   RoomLocalName: "路演休闲大厅 42",
+            //   SpaceType: "默认分区",
+            //   SubTypeCode: "ATFC",
+            //   SubTypeName: "ATFC",
+            //   TypeCode: "Eq",
+            //   TypeName: "设备"
+            // }
+          ],
+          Points: [
+            {
+              Datasource: "2112",
+              EquipmentMark: "1",
+              LocationFlag: ["俄1231232"],
+              ProjectId: "Pj1101020006",
+              SubTypeCode: "SISU",
+              SubTypeName: "喷灌机组",
+              TypeCode: "Eq",
+              TypeName: "设备"
+            },
+            // {
+            //   Datasource: "2112",
+            //   EquipmentMark: "2",
+            //   LocationFlag: ["俄1231232"],
+            //   ProjectId: "Pj1101020006",
+            //   SubTypeCode: "SISU",
+            //   SubTypeName: "喷灌机组",
+            //   TypeCode: "Eq",
+            //   TypeName: "设备"
+            // },
+            // {
+            //   Datasource: "2112",
+            //   EquipmentMark: "3",
+            //   LocationFlag: ["俄1231232"],
+            //   ProjectId: "Pj1101020006",
+            //   SubTypeCode: "SISU",
+            //   SubTypeName: "喷灌机组",
+            //   TypeCode: "Eq",
+            //   TypeName: "设备"
+            // },
+            // {
+            //   Datasource: "2112",
+            //   EquipmentMark: "5",
+            //   LocationFlag: ["俄1231232"],
+            //   ProjectId: "Pj1101020006",
+            //   SubTypeCode: "SISU",
+            //   SubTypeName: "喷灌机组",
+            //   TypeCode: "Eq",
+            //   TypeName: "设备"
+            // }
+          ]
+        }
+      ];
+      this.ltableData = res[0].Points;
+      this.rtableData = res[0].Objs;
+      // objs->实例 point-实例标识
+      if (res[0].Objs.length > 1 || res[0].Points.length > 1) {
+        this.dialogWidth = "60%";
+      }
+      console.log(this.ltableData);
+      this.dialogVisible = true;
     },
     handleClick() {},
-    handleClose(done) {},
+    handleClose(done) {
+      this.dialogVisible = false;
+    },
+    //确认清除对应关系
     handleDelete(i, t) {
-      console.log(i)
-      console.log(t)
+      console.log(i);
+      console.log(t);
+      //param.objs and param.point .length>1
+      return;
       dynamicDeleteRelation(this.param, res => {
         console.log(res);
-        this.$emit('refresh')
-      });}
+        this.$emit("refresh");
+      });
+    },
+    //表格中选择事件
+    changeSelection(){}
   },
   mounted() {},
   created() {}
 };
 </script>
 <style lang="scss" scoped>
-#applyRules {
-  /deep/ td.bgf5 {
+#delRelation {
+  /deep/ .bgf5 {
     background-color: #f5f7fa;
   }
-  td p {
-    text-align: center;
+  /deep/ .bgfff {
+    background-color: #fff;
+  }
+  div.singleDir {
+    font-weight: 800;
+    color: #606266;
+    border-bottom: 1px solid #ebeef5;
+    background: #fff;
+    border-top: 1px solid #ebeef5;
+  }
+  .pl-10 {
+    padding-left: 10px;
+  }
+  .pr-10 {
+    padding-right: 10px;
+  }
+  .font-default {
+    line-height: 42px;
+    font-size: 12px;
+  }
+  .tr {
+    text-align: right;
   }
 }
 </style>

src/views/point/dynamicdata/index.vue

@@ -69,7 +69,7 @@
           <el-table-column prop="SubTypeName" label="数字字典设备类型" show-overflow-tooltip></el-table-column>
         </el-table-column>
         <el-table-column label="对应物理世界中的设备实例">
-          <el-table-column prop="ObjectID" label="对应的设备实例" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="EquipLocalName" label="对应的设备实例" show-overflow-tooltip></el-table-column>
           <el-table-column prop="FloorLocalName" label="实例所在建筑楼层" show-overflow-tooltip></el-table-column>
           <el-table-column prop="RoomLocalName" label="实例所在业务空间" show-overflow-tooltip></el-table-column>
         </el-table-column>
@@ -87,6 +87,14 @@
     <apply-rules-dialog ref="apply"></apply-rules-dialog>
     <!-- 清除对应关系弹窗 -->
     <del-relation-dialog ref="del" @refresh="refresh"></del-relation-dialog>
+    <!-- 规则更新提示 -->
+    <el-dialog title="提示" :visible.sync="ruleDialogShow" width="25%" @close="rulesClose">
+      <span>{{ruleDialogStr}}</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" @click="rulesClose">稍后处理</el-button>
+        <el-button size="small" type="primary" @click="nowDo">现在执行</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -127,7 +135,9 @@ export default {
       },
       form: {}, //查询条件
       lastUpdateTime: "", //最后更新时间
-      tipsType: 1 //提示信息种类
+      tipsType: 1, //提示信息种类
+      ruleDialogShow: false, //规则提示执行弹窗
+      ruleDialogStr:'',//规则提示执行弹窗文字
     };
   },
   components: {
@@ -139,7 +149,7 @@ export default {
   },
   mounted() {},
   methods: {
-    //获取查询条件-
+    //获取查询条件-提示信息
     init() {
       let param = { Related: true };
       //对象类型
@@ -149,7 +159,7 @@ export default {
           if (this.typeList.length) {
             this.curType = this.typeList[0].Name;
             this.getTableData();
-          }else{
+          } else {
             this.tableData = [];
           }
         }
@@ -179,15 +189,20 @@ export default {
             for (let i = 0; i < res.Content.length; i++) {
               if (res.Content[i].Type == "未执行对应规则") {
                 this.tipsType = 3;
+                this.ruleDialogStr = '对应规则更新，是否现在执行？';
+                this.ruleDialogShow = true;
                 return;
               }
               if (res.Content[i].Type == "原始点位增删") {
                 this.tipsType = 2;
+                this.ruleDialogStr = '原始点位变化，部分标识受到影响，请重新执行对应规则';
+                this.ruleDialogShow = true;
                 return;
               }
               if (res.Content[i].Type == "最后一次执行时间") {
                 this.lastUpdateTime = res.Content[i].Content;
                 this.tipsType = 1;
+                this.ruleDialogShow = false;
                 return;
               }
             }
@@ -250,10 +265,17 @@ export default {
         }
       });
     },
-    refresh(){
+    //刷新列表
+    refresh() {
       this.page.pageNumber = 1;
       this.getTableData();
-    }
+    },
+    //规则执行弹窗
+    rulesClose() {
+      this.ruleDialogShow = false;
+    },
+    //现在执行
+    nowDo(){}
   },
   watch: {
     projectId() {