CN-1400 fix: 界面支持智能学习启停

2023-10-22 23:10:00 +08:00
parent fefca1588f
commit 012d873b71
2 changed files with 128 additions and 70 deletions
--- a/src/assets/css/components/views/setting/knowledgeBase.scss
+++ b/src/assets/css/components/views/setting/knowledgeBase.scss
@@ -1550,33 +1550,69 @@ height:300px !important;
  }
 }
 }
-.update-knowledge-tip {
-  display:flex;
+.confirm-knowledge-switch {
+  display: flex;
  flex-direction: column;
-  padding-bottom: 0 !important;
-  width: 480px !important;
-  .el-dialog__header{
+
+  .el-dialog__header {
    display: flex;
    flex-direction: row;
-    border-bottom:1px solid #eee;
-    height:42px;
-    min-height:42px;
+    border-bottom: 1px solid #eee;
+    height: 42px;
+    min-height: 42px;
+    padding-left: 20px;
+    padding-top: 10px;
+    padding-bottom: 14px;
    background: #F7F7F7;
-    box-shadow: 0 1px 0 0 rgba(53,54,54,0.08);
-    padding-left:20px;
-    padding-top:14px;
-    padding-bottom:14px;
+
    .el-dialog__headerbtn {
      display: flex !important;
      flex-direction: row-reverse;
      justify-content: center;
      align-items: center;
-      font-size: 10px;
-      line-height: 10px;
      padding-right: 5px !important;
+      top: 16px;
+      right: 10px;
      i {
-        width:10px;
-        height:10px;
+        font-size: 12px;
+      }
+    }
+    .el-dialog__title {
+      font-size: 14px !important;
+      color: #353636;
+      letter-spacing: 0;
+      font-weight: 400;
+    }
+  }
+}
+.update-knowledge-tip, .confirm-knowledge-switch {
+  display:flex;
+  flex-direction: column;
+  padding-bottom: 0 !important;
+
+  .el-dialog__header{
+    display: flex;
+    flex-direction: row;
+    border-bottom:1px solid #eee;
+    height: 42px;
+    min-height:42px;
+    background: #F7F7F7;
+    box-shadow: 0 1px 0 0 rgba(53,54,54,0.08);
+    padding-left: 20px;
+    padding-top: 10px;
+    padding-bottom: 14px;
+
+    .el-dialog__headerbtn {
+      display: flex !important;
+      flex-direction: row-reverse;
+      justify-content: center;
+      align-items: center;
+      padding-right: 5px !important;
+      top: 16px;
+      right: 10px;
+
+      i {
+        font-size: 12px;
      }
    }
    .el-dialog__title {
@@ -1593,14 +1629,9 @@ height:300px !important;
    color: #353636;
    letter-spacing: 0;
    line-height: 22px;
-    font-weight: 400;
-    padding-top:8px;
-    padding-right:20px;
-    padding-left:20px;
-    .dialog-message {
-      padding-left: 0 !important;
-      padding-right: 0 !important;
-    }
+    padding-top:12px;
+    padding-right: 20px;
+    padding-left: 20px;
  }
  .el-dialog__footer {
    height:52px;
--- a/src/components/table/setting/knowledgeBaseTableForCard.vue
+++ b/src/components/table/setting/knowledgeBaseTableForCard.vue
@@ -3,27 +3,18 @@
    <div class="card-type-title" v-if="aiTaggingList.length > 0">{{$t('knowledgeBase.intelligenceLearning')}}</div>
    <el-checkbox-group v-model="checkList" >
      <div class="card-box" v-for="data in aiTaggingList" :key="data.knowledgeId">
-        <div @click="isSelectedStatus && data.isBuiltIn !== 1 && clickCard(data,$event)"  @mouseenter="mouseenter(data)" @mouseleave="mouseleave(data)" class="card-item"  :class="data.isSelected ? 'card-selected' : ''">
+        <div @click="isSelectedStatus && data.isBuiltIn !== 1 && clickCard(data,$event)" @mouseenter="mouseenter(data)" @mouseleave="mouseleave(data)" class="card-item"  :class="data.isSelected ? 'card-selected' : ''">
          <div class="card-content">
            <div class="card-operate">
-              <el-tooltip
-                  effect="light"
-                  trigger="hover"
-                  :content="$t('tip.notAvailable')"
-                  placement="right"
-                  popper-class="panel-tooltip"
+              <el-switch v-model="data.status"
+                         class="card-enable"
+                         active-color="#38ACD2"
+                         inactive-color="#C0CEDB"
+                         :active-value="1"
+                         :inactive-value="0"
+                         :before-change="(knowledgeId) => confirmSwitchLearning(data.knowledgeId)"
              >
-                <el-switch v-model="data.status"
-                           class="card-enable"
-                           active-color="#38ACD2"
-                           inactive-color="#C0CEDB"
-                           :disabled="true"
-                           :active-value="1"
-                           :inactive-value="0"
-                           @change="changeStatus($event,data.knowledgeId)"
-                >
-                </el-switch>
-              </el-tooltip>
+              </el-switch>
            </div>
            <div class="card-icon">
              <img :src="data.iconUrl"/>
@@ -86,24 +77,14 @@
            <div class="update-title">
              <div class="card-title-name" :title="updateKnowledge.label">{{updateKnowledge.label}}</div>
            </div>
-            <el-tooltip
-                effect="light"
-                trigger="hover"
-                v-if="showEnable"
-                :content="$t('tip.notAvailable')"
-                placement="right"
-                popper-class="panel-tooltip"
+            <el-switch v-model="updateKnowledge.status"
+                       active-color="#38ACD2"
+                       inactive-color="#C0CEDB"
+                       :active-value="1"
+                       :inactive-value="0"
+                       :before-change="(knowledgeId) => confirmSwitchLearning(updateKnowledge.knowledgeId)"
            >
-              <el-switch v-model="updateKnowledge.status"
-                         active-color="#38ACD2"
-                         inactive-color="#C0CEDB"
-                         :disabled="true"
-                         :active-value="1"
-                         :inactive-value="0"
-                         @change="changeStatus($event,updateKnowledge.knowledgeId)"
-              >
-              </el-switch>
-            </el-tooltip>
+            </el-switch>
          </div>
          <div class="knowledge-desc" :title="updateKnowledge.desc">{{updateKnowledge.desc ? updateKnowledge.desc : '—'}}</div>
        </div>
@@ -187,6 +168,7 @@
    <el-dialog v-model="showConfirmDialog"
               :title="$t('overall.tips')"
               custom-class="update-knowledge-tip"
+               :width="480"
               :before-close="handleConfirmClose">
      <div class="dialog-message">{{$t('knowledge.updateTips')}}</div>
      <template #footer>
@@ -196,6 +178,20 @@
        </span>
      </template>
    </el-dialog>
+    <el-dialog
+        v-model="showConfirmSwitch"
+        :width="330"
+        custom-class="confirm-knowledge-switch"
+        :title="$t('overall.hint')"
+    >
+      <div class="dialog-message">{{ confirmSwitchLearningTip }}</div>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="showConfirmSwitch = false">{{ $t('overall.cancel') }}</el-button>
+          <el-button type="primary" @click="switchLearning">OK</el-button>
+        </span>
+      </template>
+    </el-dialog>
  </div>
 </template>

@@ -237,7 +233,9 @@ export default {
      updateHistoryList: [],
      updateObject: {},
      currentVersion: 0,
-      uploadLoading: false
+      uploadLoading: false,
+      showConfirmSwitch: false,
+      switchKnowledgeId: ''
    }
  },
  setup () {
@@ -364,18 +362,10 @@ export default {
      })
    },
    mouseenter (card) {
-      this.tableData.forEach(t => {
-        if (t.knowledgeId === card.knowledgeId) {
-          card.showUpdate = true
-        }
-      })
+      card.showUpdate = true
    },
    mouseleave (card) {
-      this.tableData.forEach(t => {
-        if (t.knowledgeId === card.knowledgeId) {
-          card.showUpdate = false
-        }
-      })
+      card.showUpdate = false
    },
    del (data) {
      this.$emit('delete', data)
@@ -392,6 +382,29 @@ export default {
          dataType: dataType
        }
      })
+    },
+    confirmSwitchLearning (id) {
+      this.showConfirmSwitch = true
+      this.switchKnowledgeId = id
+      return false
+    },
+    switchLearning () {
+      const hint = this.aiTaggingList.find(d => d.knowledgeId === this.switchKnowledgeId)
+      const toStatus = hint.status === 0 ? 1 : 0
+      axios.patch(api.knowledgeBaseEnable, { list: [{ knowledgeId: this.switchKnowledgeId, status: toStatus }] }).then(res => {
+        if (res.status === 200) {
+          hint.status = toStatus
+          this.$message.success(this.$t('tip.success'))
+        } else {
+          console.error(res.message)
+          this.errorMsgHandler(res)
+        }
+      }).catch(e => {
+        console.error(e)
+        this.errorMsgHandler(e)
+      }).finally(() => {
+        this.showConfirmSwitch = false
+      })
    }
  },
  watch: {
@@ -445,6 +458,20 @@ export default {
        action: 'overwrite',
        description: this.updateObject.description
      }
+    },
+    confirmSwitchLearningTip () {
+      let tip = ''
+      if (this.switchKnowledgeId) {
+        const find = this.aiTaggingList.find(item => item.knowledgeId === this.switchKnowledgeId)
+        if (find) {
+          if (find.status === 0) {
+            tip = this.$t('tip.confirmEnablePsiphon3') + '?'
+          } else if (find.status === 1) {
+            tip = this.$t('tip.confirmDisablePsiphon3') + '?'
+          }
+        }
+      }
+      return tip
    }
  }
 }