Merge pull request #662 from dataease/pr@dev@feat_panel-linkage-bar

refactor:联动设置出现未匹配的字段时，给提示

frontend/src/components/canvas/components/Editor/LinkageField.vue

@@ -3,6 +3,7 @@
   <el-popover
     width="400"
     trigger="click"
+    style="max-height: 400px;overflow-y: auto"
   >
     <el-row>
       <el-col :span="11">
@@ -13,52 +14,55 @@
       </el-col>
     </el-row>
 
-    <el-row v-for="(item, index) in linkageInfo.linkageFields" :key="index">
+    <el-row style="height: 120px;overflow-y: auto">
-      <el-col :span="11">
+
-        <div class="select-filed">
+      <el-row v-for="(item, index) in linkageInfo.linkageFields" :key="index">
-          <el-select v-model="item.sourceField" size="mini" placeholder="请选择">
+        <el-col :span="11">
-            <el-option
+          <div class="select-filed">
-              v-for="item in sourceLinkageInfo.targetViewFields"
+            <el-select v-model="item.sourceField" size="mini" placeholder="请选择">
-              :key="item.id"
+              <el-option
-              :label="item.name"
+                v-for="item in sourceLinkageInfo.targetViewFields"
-              :value="item.id"
+                :key="item.id"
-            >
+                :label="item.name"
-              <span style="float: left">
+                :value="item.id"
-                <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
+              >
-                <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
+                <span style="float: left">
-                <svg-icon v-if="item.deType === 2 || item.value === 3" icon-class="field_value" class="field-icon-value" />
+                  <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
-                <svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
+                  <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
-              </span>
+                  <svg-icon v-if="item.deType === 2 || item.value === 3" icon-class="field_value" class="field-icon-value" />
-              <span style="float: left; color: #8492a6; font-size: 12px">{{ item.name }}</span>
+                  <svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
-            </el-option>
+                </span>
-          </el-select>
+                <span style="float: left; color: #8492a6; font-size: 12px">{{ item.name }}</span>
-        </div>
+              </el-option>
-      </el-col>
+            </el-select>
-      <el-col :span="11">
+          </div>
-        <div class="select-filed">
+        </el-col>
-          <el-select v-model="item.targetField" size="mini" placeholder="请选择">
+        <el-col :span="11">
-            <el-option
+          <div class="select-filed">
-              v-for="item in linkageInfo.targetViewFields"
+            <el-select v-model="item.targetField" size="mini" placeholder="请选择">
-              :key="item.id"
+              <el-option
-              :label="item.name"
+                v-for="item in linkageInfo.targetViewFields"
-              :value="item.id"
+                :key="item.id"
-            >
+                :label="item.name"
-              <span style="float: left">
+                :value="item.id"
-                <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
+              >
-                <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
+                <span style="float: left">
-                <svg-icon v-if="item.deType === 2 || item.value === 3" icon-class="field_value" class="field-icon-value" />
+                  <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
-                <svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
+                  <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
-              </span>
+                  <svg-icon v-if="item.deType === 2 || item.value === 3" icon-class="field_value" class="field-icon-value" />
-              <span style="float: left; color: #8492a6; font-size: 12px">{{ item.name }}</span>
+                  <svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
-            </el-option>
+                </span>
-          </el-select>
+                <span style="float: left; color: #8492a6; font-size: 12px">{{ item.name }}</span>
-        </div>
+              </el-option>
-      </el-col>
+            </el-select>
-      <el-col :span="2">
+          </div>
-        <div>
+        </el-col>
-          <el-button icon="el-icon-delete" type="text" size="small" style="float: left" @click="deleteLinkageField(index)" />
+        <el-col :span="2">
-        </div>
+          <div>
-      </el-col>
+            <el-button icon="el-icon-delete" type="text" size="small" style="float: left" @click="deleteLinkageField(index)" />
+          </div>
+        </el-col>
+      </el-row>
     </el-row>
 
     <el-row class="bottom">
@@ -67,7 +71,6 @@
 
     <!--    <el-button slot="reference">T</el-button>-->
     <i slot="reference" class="icon iconfont icon-edit slot-class" />
-
   </el-popover>
 </template>
 
@@ -183,5 +186,9 @@ export default {
     height: 35px;
     border-radius: 3px;
   }
+  >>>.el-popover{
+    height: 200px;
+    overflow: auto;
+  }
 
 </style>

frontend/src/components/canvas/components/Toolbar.vue

@@ -320,6 +320,38 @@ export default {
       this.close()
     },
     saveLinkage() {
+      // 字段检查
+      // let checkCount = 0
+      for (const key in this.targetLinkageInfo) {
+        let subCheckCount = 0
+        const linkageInfo = this.targetLinkageInfo[key]
+        const linkageFields = linkageInfo['linkageFields']
+        if (linkageFields) {
+          linkageFields.forEach(function(linkage) {
+            if (!(linkage.sourceField && linkage.targetField)) {
+              subCheckCount++
+            }
+          })
+        }
+
+        if (subCheckCount > 0) {
+          this.$message({
+            message: this.$t('chart.datalist') + '【' + linkageInfo.targetViewName + '】' + this.$t('panel.exit_un_march_linkage_field'),
+            type: 'error',
+            showClose: true
+          })
+          return
+        }
+      }
+      // if (checkCount > 0) {
+      //   this.$message({
+      //     message: this.$t('panel.exit_un_march_linkage_field'),
+      //     type: 'error',
+      //     showClose: true
+      //   })
+      //   return
+      // }
+
       const request = {
         panelId: this.$store.state.panel.panelInfo.id,
         sourceViewId: this.curLinkageView.propValue.viewId,

frontend/src/lang/en.js

@@ -1212,7 +1212,8 @@ export default {
     drill: 'drill',
     linkage: 'linkage',
     cancel_linkage: 'Cancel Linkage',
-    remove_all_linkage: 'Remove All Linkage'
+    remove_all_linkage: 'Remove All Linkage',
+    exit_un_march_linkage_field: 'Exit Un March Linkage Field'
   },
   plugin: {
     local_install: 'Local installation',

frontend/src/lang/tw.js

@@ -1211,7 +1211,8 @@ export default {
     drill: '下钻',
     linkage: '联动',
     cancel_linkage: '取消联动',
-    remove_all_linkage: '清除所有联动'
+    remove_all_linkage: '清除所有联动',
+    exit_un_march_linkage_field: '存在未匹配联动关系的字段'
   },
   plugin: {
     local_install: '本地安裝',

frontend/src/lang/zh.js

@@ -1213,7 +1213,8 @@ export default {
     drill: '下钻',
     linkage: '联动',
     cancel_linkage: '取消联动',
-    remove_all_linkage: '清除所有联动'
+    remove_all_linkage: '清除所有联动',
+    exit_un_march_linkage_field: '存在未匹配联动关系的字段'
   },
   plugin: {
     local_install: '本地安装',