fix: 修复知识库更新结束或者在上传页面返回后柱状图消失的问题

2023-10-30 11:26:24 +08:00
parent dbc68077ca
commit a7d6ffb4b4
3 changed files with 1402 additions and 1392 deletions
--- a/src/assets/css/components/views/setting/knowledgeBase.scss
+++ b/src/assets/css/components/views/setting/knowledgeBase.scss
@@ -38,8 +38,8 @@
      margin-right:20px;
      margin-top: 20px;
    }
-}
-.top-tool-btn--user_defined_library {
+  }
+  .top-tool-btn--user_defined_library {
    background: #F5F8FA;
    border: 1px solid rgba(222,222,222,1);
    box-shadow: 0px 2px 4px 0px rgba(51,51,51,0.02);
@@ -58,13 +58,13 @@
      font-size:14px !important;
      margin-right:6px;
    }
-}
-.top-tool-btn--user_defined_library:hover {
+  }
+  .top-tool-btn--user_defined_library:hover {
    border: 1px solid $--border-color-primary;
    background-color: $--button-gray-hover-background-color;
    cursor: pointer;
-}
-.knowledge-base-built-in__content {
+  }
+  .knowledge-base-built-in__content {
    display:flex;
    flex-direction:row;
    padding:12px 0 20px 20px;
@@ -356,8 +356,8 @@
        }
      }
    }
-}
-.knowledge-base-user-defined__content {
+  }
+  .knowledge-base-user-defined__content {
    display:flex;
    flex-direction:row;
    padding:12px 20px 20px 20px;
@@ -962,35 +962,35 @@
        box-shadow: 0 -1px 4px 0 rgba(0,0,0,0.07);
      }
    }
-}
+  }
 }
 .reference-tag__tip {
-display: flex;
-flex-direction: column;
-font-size: 12px;
-color: #575757;
-font-weight: 400;
-min-width:130px;
-max-height:240px;
-overflow-y:auto;
-cursor:pointer;
-.reference-tag {
+  display: flex;
+  flex-direction: column;
+  font-size: 12px;
+  color: #575757;
+  font-weight: 400;
+  min-width:130px;
+  max-height:240px;
+  overflow-y:auto;
+  cursor:pointer;
+  .reference-tag {
    height:24px;
    min-height:24px;
    padding-top: 3px;
-}
+  }
 }
 .edit-knowledge-base {
-height: 100%;
+  height: 100%;

-.edit-knowledge-base__header {
+  .edit-knowledge-base__header {
    padding: 30px 0 30px 20px;
    font-size: 24px;
    line-height: 24px;
    font-weight: 900;
    color: #353636;
-}
-.edit-knowledge-base__body {
+  }
+  .edit-knowledge-base__body {
    display: flex;
    height: calc(100% - 147px);
    padding-left: 20px;
@@ -1379,8 +1379,8 @@ height: 100%;
        display: none;
      }
    }
-}
-.edit-knowledge-base__footer {
+  }
+  .edit-knowledge-base__footer {
    display: flex;
    align-items: center;
    justify-content: center;
@@ -1419,48 +1419,48 @@ height: 100%;
      opacity: .6;
      cursor: default;
    }
-}
+  }
 }
 .addTagBtn {
-position: absolute;
-bottom: 9px;
-height:24px !important;
-min-height: 24px !important;
-font-size: 12px;
-color: #353636;
-font-weight: 500;
-width: 598px;
-margin-left: 10px;
-background: rgb(245, 248, 250);
-border: 1px #DEDEDE solid;
-padding: 0 !important;
-box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
-border-radius: 2px;
-font-family:NotoSansHans-Medium !important;
+  position: absolute;
+  bottom: 9px;
+  height:24px !important;
+  min-height: 24px !important;
+  font-size: 12px;
+  color: #353636;
+  font-weight: 500;
+  width: 598px;
+  margin-left: 10px;
+  background: rgb(245, 248, 250);
+  border: 1px #DEDEDE solid;
+  padding: 0 !important;
+  box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
+  border-radius: 2px;
+  font-family:NotoSansHans-Medium !important;

-.add-tag-btn {
+  .add-tag-btn {
    color: #575757 !important;
    font-size: 9px !important;
    margin: 0 8px 2px 8px;
-}
+  }

-&:hover {
+  &:hover {
   i {
     color: #699DC9 !important;
   }
-}
+  }

-span {
+  span {
    font-family:NotoSansHans-Medium !important;
-}
+  }
 }
 .del-model-hint {
-display:flex;
-flex-direction: column;
-padding-bottom:0px !important;
-width:480px !important;
-height:300px !important;
-.el-dialog__header{
+  display:flex;
+  flex-direction: column;
+  padding-bottom:0px !important;
+  width:480px !important;
+  height:300px !important;
+  .el-dialog__header{
    display: flex;
    flex-direction: row;
    border-bottom:1px solid #eee;
@@ -1490,8 +1490,8 @@ height:300px !important;
      letter-spacing: 0;
      font-weight: 400;
    }
-}
-.el-dialog__body {
+  }
+  .el-dialog__body {
    height:206px;
    min-height:206px;
    font-size: 14px;
@@ -1517,8 +1517,8 @@ height:300px !important;
      background-color: #38ACD2;
      border-color: #38ACD2;
    }
-}
-.el-dialog__footer {
+  }
+  .el-dialog__footer {
    height:52px;
    min-height:52px;
    border-top:1px solid #eee;
@@ -1548,7 +1548,7 @@ height:300px !important;
      background-color:#2d8cf0;
      border-color:#2d8cf0;
    }
-}
+  }
 }
 .confirm-knowledge-switch {
  display: flex;
@@ -1894,16 +1894,17 @@ height:300px !important;
    .update-dialog__table {
      border-bottom: none;
      border-radius: 0.28571rem;
-      height:calc(90vh - 190px - 200px - 50px - 10px);//dialog为屏幕的90% - 表格以上内容的高度 - pishon3柱状图的高度 - 表格和柱状图之间的距离 - 底部留白的距离
-      max-height:calc(90vh - 190px - 200px - 50px - 10px);
-      //min-height:250px;
+      height: calc(100% - 125px);//dialog为屏幕的90% - 表格以上内容的高度 - pishon3柱状图的高度 - 表格和柱状图之间的距离 - 底部留白的距离
      .el-table--border th, .el-table--border td {
        border-right: none;
      }
      .el-table__body-wrapper {
-        height: 100%;
+        height: calc(100% - 48px);
        overflow-y: auto;
      }
+      &.update-dialog__table--psiphon3 {
+        height: calc(90vh - 190px - 200px - 50px - 10px);
+      }
    }
    .update-knowledge-form {
      .el-upload {
--- a/src/components/table/setting/knowledgeBaseTableForCard.vue
+++ b/src/components/table/setting/knowledgeBaseTableForCard.vue
@@ -126,7 +126,7 @@
            </button>
          </div>
        </div>
-        <div style="height: calc(90vh - 190px - 200px - 50px - 10px - 42px);margin-top: 42px; position: absolute; width: calc(100% - 60px)">
+        <div :style="{height: updateKnowledge.source === 'cn_psiphon3_ip' ? 'calc(90vh - 190px - 200px - 50px - 42px)' : 'calc(100% - 242px)',  marginTop: '42px', position: 'absolute', width: 'calc(100% - 60px)'}">
          <loading :loading="updateLogLoading"></loading>
        </div>
        <el-table ref="updateDataTable"
@@ -134,7 +134,8 @@
                  :data="updateHistoryList"
                  @selection-change="secondSelectionChange"
                  width="100%"
-                  class="update-dialog__table"
+                  :class="updateKnowledge.source === 'cn_psiphon3_ip' ? 'update-dialog__table update-dialog__table--psiphon3' : 'update-dialog__table'"
+                  :header-cell-style="{background:'#f5f7fa',color:'#353636',fontWeight: '400',fontSize: '12px',borderRight: 'none',borderBottom: 'none'}"
                  cell-style="padding:6px 0px;font-size: 12px;color: #353636;font-weight: 400;line-height: 20px;border-right:none;"
                  header-cell-style="padding:8px 0px;font-size: 12px;color: #353636;font-weight: 500;border-right:none;">
          <el-table-column prop="opTime" :label="$t('entities.tab.informationAggregation.updateTime')" width="150" ></el-table-column>
@@ -153,7 +154,7 @@
          </template>
        </el-table>

-        <div class="psiphon3">
+        <div class="psiphon3" v-if="updateKnowledge.source === 'cn_psiphon3_ip'">
          <div class="psiphon3-title">{{$t('knowledgeBase.psiphon3IpCount')}}</div>
          <div class="psiphon3-bar">
            <chart-error v-if="showErrorForPsiphon3" :content="errorMsgForPsiphon3"/>
@@ -576,6 +577,7 @@ export default {
      this.$message.success(this.$t('tip.success'))
      this.showAddUpdateDialog = false
      this.getCurTabData()
+      this.init()
      /* } else {
        this.$message.error(this.$t('tip.uploadFailed', { msg: response.message }))
      } */
@@ -748,6 +750,7 @@ export default {
    },
    tableData: {
      handler (n) {
+        console.info(n)
        if (this.tableData && this.tableData.length > 0) {
          this.aiTaggingList = []
          this.websketchList = []
@@ -773,6 +776,12 @@ export default {
      handler (n) {
        if (!n) {
          this.fileList = []
+          if (this.updateKnowledge.source === 'cn_psiphon3_ip') {
+            this.init()
+          }
+        } else {
+          this.myChart && this.myChart.dispose()
+          this.myChart = null
        }
      }
    }
--- a/src/utils/date-util.js
+++ b/src/utils/date-util.js
@@ -121,7 +121,7 @@ export function xAxisTimeFormatter (value) {
    ':' +
    (date.getMinutes() < 10 ? `0${date.getMinutes()}` : date.getMinutes())
  // 如果是一天的开始
-  console.info(date, dayStart, hourStart, HHmm)
+  console.info(date.getTime(), dayStart.getTime(), hourStart.getTime(), date.getTime() === dayStart.getTime(), date.getTime() === hourStart.getTime())
  if (date.getTime() === dayStart.getTime()) {
    return '{day|' + dateFormat(date, 'YYYY-MM-DD') + '}'
  } else if (date.getTime() === hourStart.getTime()) {