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

src/assets/css/components/views/setting/knowledgeBase.scss

@@ -1550,11 +1550,46 @@ height:300px !important;
   }
 }
 }
-.update-knowledge-tip {
+.confirm-knowledge-switch {
+  display: flex;
+  flex-direction: column;
+
+  .el-dialog__header {
+    display: flex;
+    flex-direction: row;
+    border-bottom: 1px solid #eee;
+    height: 42px;
+    min-height: 42px;
+    padding-left: 20px;
+    padding-top: 10px;
+    padding-bottom: 14px;
+    background: #F7F7F7;
+
+    .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 {
+      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;
-  width: 480px !important;
+
   .el-dialog__header{
     display: flex;
     flex-direction: row;
@@ -1564,19 +1599,20 @@ height:300px !important;
     background: #F7F7F7;
     box-shadow: 0 1px 0 0 rgba(53,54,54,0.08);
     padding-left: 20px;
-    padding-top:14px;
+    padding-top: 10px;
     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;
+        font-size: 12px;
-        height:10px;
       }
     }
     .el-dialog__title {
@@ -1593,14 +1629,9 @@ height:300px !important;
     color: #353636;
     letter-spacing: 0;
     line-height: 22px;
-    font-weight: 400;
+    padding-top:12px;
-    padding-top:8px;
     padding-right: 20px;
     padding-left: 20px;
-    .dialog-message {
-      padding-left: 0 !important;
-      padding-right: 0 !important;
-    }
   }
   .el-dialog__footer {
     height:52px;

src/components/table/setting/knowledgeBaseTableForCard.vue

@@ -6,24 +6,15 @@
         <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"
-                           :disabled="true"
                          :active-value="1"
                          :inactive-value="0"
-                           @change="changeStatus($event,data.knowledgeId)"
+                         :before-change="(knowledgeId) => confirmSwitchLearning(data.knowledgeId)"
               >
               </el-switch>
-              </el-tooltip>
             </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"
-                         :disabled="true"
                        :active-value="1"
                        :inactive-value="0"
-                         @change="changeStatus($event,updateKnowledge.knowledgeId)"
+                       :before-change="(knowledgeId) => confirmSwitchLearning(updateKnowledge.knowledgeId)"
             >
             </el-switch>
-            </el-tooltip>
           </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
-        }
-      })
     },
     mouseleave (card) {
-      this.tableData.forEach(t => {
-        if (t.knowledgeId === card.knowledgeId) {
       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
     }
   }
 }