fix:1 CN-1470 调整新增/修改role页面权限树的逻辑;2.检查模块下的事件类型饼图legend宽度随分辨率而改变；

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

@@ -1798,6 +1798,12 @@
           margin-right:5px;
         }
       }
+      .top-tool-btn--update:disabled {
+        cursor: not-allowed;
+        opacity: 0.66;
+        i {
+        }
+      }
       .top-tool-btn--update:hover {
         background-color: #57B8D9 !important;
         border-color: #2E88A6 !important;
@@ -1846,6 +1852,12 @@
           margin-right:5px;
         }
       }
+      .top-tool-btn--update:disabled {
+        cursor: not-allowed;
+        opacity: 0.66;
+        i {
+        }
+      }
       .top-tool-btn--update:hover {
         background-color: #57B8D9 !important;
         border-color: #2E88A6 !important;

src/components/layout/Header.vue

@@ -335,8 +335,8 @@ export default {
       this.generateBreadcrumb(breadcrumb, this.$store.getters.menuList)
       if (breadcrumb) {
         // panel菜单是否可以点击跳转：一级菜单不可点击，二级菜单可以点击
-        if(breadcrumb[0] && breadcrumb[1] && breadcrumb[1].route
+        if (breadcrumb[0] && breadcrumb[1] && breadcrumb[1].route &&
-                              && breadcrumb[1].route.indexOf('/panel/') === 0){
+                              breadcrumb[1].route.indexOf('/panel/') === 0) {
           breadcrumb[1].clickable = true
         } else { // 除panel外的菜单是否可以点击跳转:除了新增、编辑，其它均可点击
           breadcrumb.forEach(item => {

src/components/rightBox/settings/RoleBox.vue

@@ -23,7 +23,8 @@
               <button type="button" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new option-btn" style="margin-left: 0px;" @click="expandAllOrNone" :class="{'btn-active':expandAllFlag}">展开/收缩</button>
               <button type="button" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new option-btn" @click="selectAllOrNone" :class="{'btn-active':selectAllFlag}"><span ><i class="cn-icon cn-icon-delete"></i></span></button>
             </div>-->
-            <el-tree :data="menus" :default-expand-all="expandAllFlag" :props="{label:labelFormatter}"  @check-change="selectChange" class="tree-border" node-key="id" ref="menuTree" show-checkbox id="role-box-input-menus">
+            <el-checkbox v-model="isCheckAll" :label="$t('overall.all')" @change="checkAll"></el-checkbox>
+            <el-tree :data="menus" :default-expand-all="expandAllFlag" check-strictly="true" :props="{label:labelFormatter}"  @check-change="selectChange" class="tree-border" node-key="id" ref="menuTree" show-checkbox id="role-box-input-menus">
               <template #default="{ data }">
               <span>
                 <i v-if="data.type === '1'" class="el-icon-menu"></i>
@@ -90,7 +91,8 @@ export default {
       menus: [],
       selectedIds: [],
       selectAllFlag: false,
-      expandAllFlag: true
+      expandAllFlag: true,
+      isCheckAll: false
     }
   },
   watch: {
@@ -150,9 +152,40 @@ export default {
     labelFormatter: function (data, node) {
       return data && data.i18n ? this.$t(data.i18n) : data.name
     },
+    getChildNodes (menu) {
+      let nodeGroup = []
+      if (menu.children && menu.children.length > 0) {
+        nodeGroup = menu.children
+        const _this = this
+        menu.children.forEach(node => {
+          const childNodes = _this.getChildNodes(node)
+          if (childNodes && childNodes.length > 0) {
+            nodeGroup = nodeGroup.concat(childNodes)
+          }
+        })
+      }
+      return nodeGroup
+    },
+    checkAll () {
+      if (this.$refs.menuTree) {
+        if (this.isCheckAll) {
+          let nodeGroup = this.menus
+          const _this = this
+          this.menus.forEach(menu => {
+            const childNodes = _this.getChildNodes(menu)
+            if (childNodes && childNodes.length > 0) {
+              nodeGroup = nodeGroup.concat(childNodes)
+            }
+          })
+          this.$refs.menuTree.setCheckedNodes(nodeGroup)
+        } else {
+          this.$refs.menuTree.setCheckedNodes([])
+        }
+      }
+    },
     selectChange: function (data, isCheck, childIsCheck) {
       if (this.$refs.menuTree) {
-        this.editRole.menuIds = this.$refs.menuTree.getCheckedKeys(true)
+        this.editRole.menuIds = this.$refs.menuTree.getCheckedKeys(false)
       }
     },
     selectAllOrNone: function () {

src/components/table/setting/knowledgeBaseTableForCard.vue

@@ -49,7 +49,7 @@
           <div class="card-desc" :title="data.desc ? data.desc:'—'">{{data.desc ? data.desc : '—'}}</div>
         </div>
         <div class="card-operate__footer">
-          <button v-if="data.showUpdate" :title="$t('overall.update')" class="top-tool-btn--update"
+          <button v-if="data.showUpdate && hasPermission('editBuiltInKnowledgeBase')" :title="$t('overall.update')" class="top-tool-btn--update"
                   @click="jumpToUpdatePage(data,false)">
             <i class="cn-icon-update-knowledge-base cn-icon"></i>
             <span>{{$t('overall.update')}}</span>
@@ -111,7 +111,7 @@
           </el-tabs>
           <div class="update-operate">
             <button :title="$t('overall.update')" class="top-tool-btn--update"
-                    @click="uploadRecord">
+                    @click="uploadRecord"><!--:disabled="hasUpdatingRecord"-->
               <i class="cn-icon-update-knowledge-base cn-icon"></i>
               <span>{{$t('overall.update')}}</span>
             </button>
@@ -123,7 +123,7 @@
           </div>
           <div class="update-operate">
             <button :title="$t('overall.update')" class="top-tool-btn--update"
-                    @click="uploadRecord">
+                    @click="uploadRecord"><!--   :disabled="hasUpdatingRecord" -->
               <i class="cn-icon-update-knowledge-base cn-icon"></i>
               <span>{{$t('overall.update')}}</span>
             </button>
@@ -295,7 +295,7 @@
 import table from '@/mixins/table'
 import Loading from '@/components/common/Loading'
 import { getSecond, getMillisecond, xAxisTimeFormatter, xAxisTimeRich } from '@/utils/date-util'
-import { knowledgeCategoryValue, unitTypes, storageKey, builtInKnowledgeBaseBasicInfo } from '@/utils/constants'
+import { knowledgeCategoryValue, unitTypes, storageKey, builtInKnowledgeBaseBasicInfo, knowledgeCardUpdateRecordType } from '@/utils/constants'
 import { ref, shallowRef } from 'vue'
 import { api } from '@/utils/api'
 import { detectionTooltipFormatter } from '@/views/charts/charts/tools'
@@ -339,6 +339,7 @@ export default {
       psiphon3Loading: false,
       updateLogLoading: false,
       showConfirmSwitch: false,
+      // timer: null,
       switchKnowledgeId: '',
       activeTab: 'updateRecord',
       isNoDataForPsiphon3: false,
@@ -348,6 +349,7 @@ export default {
       tabType: 'total',
       mousemoveCursor: '',
       selectTime: 1440,
+      // hasUpdatingRecord: false,
       tabs: [
         {
           name: 'knowledgeBase.total',
@@ -380,12 +382,6 @@ export default {
   setup () {
     // 没上传过文件的提示
     const uploadErrorTip = ref('')
-    const nowMill = window.$dayJs.tz().valueOf()
-    const timeFilter = ref({
-      startTime: nowMill - 1000 * 60 * 60 * 24,
-      endTime: nowMill,
-      dateRangeValue: 1440
-    })
     return {
       baseUrl: BASE_CONFIG.baseUrl,
       apiVersion: BASE_CONFIG.apiVersion,
@@ -397,8 +393,7 @@ export default {
       fileList: ref([]),
       uploadFileSizeLimit: 1024 * 1024 * 1024,
       myChart: shallowRef(null),
-      chartOption: shallowRef(null),
+      chartOption: shallowRef(null)
-      timeFilter
     }
   },
   methods: {
@@ -470,9 +465,10 @@ export default {
     },
     init (val, show, active, n) {
       this.psiphon3Loading = true
+      const endTime = window.$dayJs.tz().valueOf()
       const params = {
-        startTime: getSecond(this.timeFilter.startTime),
+        startTime: getSecond(endTime - this.selectTime * 60 * 1000),
-        endTime: getSecond(this.timeFilter.endTime)
+        endTime: getSecond(endTime)
       }
       const url = api.knowledgeBaseTimedistribution.replace('{{knowledgeId}}', this.updateKnowledge.knowledgeId).replace('{{type}}', this.tabType)
       axios.get(url, { params: params }).then(response => {
@@ -485,8 +481,10 @@ export default {
             const chartsData = res.data.result.map(item => {
               return [getMillisecond(item.statTime), item.count]
             })
+            if (this.activeTab === knowledgeCardUpdateRecordType.intelligenceLearning) {
               this.echartsInit(chartsData)
             }
+          }
         } else {
           this.httpError(res)
         }
@@ -533,14 +531,14 @@ export default {
       })
     },
     timeChange () {
-      this.timeFilter.endTime = window.$dayJs.tz().valueOf()
-      this.timeFilter.startTime = this.timeFilter.endTime - this.selectTime * 60 * 1000
       if (this.updateKnowledge.source === 'cn_psiphon3_ip') {
         this.init()
       }
+      if (this.activeTab === knowledgeCardUpdateRecordType.intelligenceLearning) {
         this.$nextTick(() => {
           this.handleActiveBar()
         })
+      }
     },
     activeChange (item) { // isClick:代表是通过点击操作来的
       if (item) {
@@ -554,9 +552,11 @@ export default {
     mouseenterTab (item) {
       if (this.isNoDataForPsiphon3) return
       this.mousemoveCursor = item.class
+      if (this.activeTab === knowledgeCardUpdateRecordType.intelligenceLearning) {
         this.$nextTick(() => {
           this.handleActiveBar()
         })
+      }
     },
     mouseleaveTab () {
       this.mousemoveCursor = ''
@@ -586,17 +586,9 @@ export default {
     uploadSuccess (response) {
       this.uploadLoading = false
       this.uploaded = true
-      /* this.uploaded = response.code === 200
-      if (response.code === 200) { */
       this.$message.success(this.$t('tip.success'))
       this.showAddUpdateDialog = false
       this.getCurTabData()
-      if (this.updateKnowledge.source === 'cn_psiphon3_ip') {
-        this.init()
-      }
-      /* } else {
-        this.$message.error(this.$t('tip.uploadFailed', { msg: response.message }))
-      } */
     },
     beforeUpload (file) {
       this.uploadLoading = true
@@ -604,18 +596,12 @@ export default {
     },
     submitConfirm () {
       this.showConfirmDialog = true
-      this.$nextTick(() => {
-        this.handleActiveBar()
-      })
     },
     submit () {
       this.$refs.knowledgeUpload.submit()
     },
     cancle () {
       this.showAddUpdateDialog = false
-      this.$nextTick(() => {
-        this.handleActiveBar()
-      })
     },
     clickCard (data, event) {
       if (data.isSelected) { // 原来为选中，当前点击后未选中
@@ -667,9 +653,11 @@ export default {
         await this.init()
       }
       this.showUpdate()
+      if (this.activeTab === knowledgeCardUpdateRecordType.intelligenceLearning) {
         this.$nextTick(() => {
           this.handleActiveBar()
         })
+      }
     },
     uploadRecord () {
       this.showAddUpdateDialog = true
@@ -682,12 +670,12 @@ export default {
         pageSize: -1
       }
       if (this.showEnable) {
-        if (this.activeTab === 'updateRecord') {
+        if (this.activeTab === knowledgeCardUpdateRecordType.updateRecord) {
           params = {
             ...params,
             opUser: -1
           }
-        } else if (this.activeTab === 'intelligenceLearning') {
+        } else if (this.activeTab === knowledgeCardUpdateRecordType.intelligenceLearning) {
           params = {
             ...params,
             opUser: 0
@@ -701,6 +689,15 @@ export default {
         if (this.updateHistoryList[0]) {
           this.currentVersion = this.updateHistoryList[0].commitVersion + 1
         }
+        /*
+        this.hasUpdatingRecord = false
+        this.updateHistoryList.forEach(item => {
+          if (item.isUpdating) { // if(item.isUpdating){//????????
+            this.hasUpdatingRecord = true
+          }
+        })
+
+ */
       }).catch(e => {
         console.error(e)
       }).finally(() => {
@@ -711,10 +708,7 @@ export default {
     handleClick (tab) {
       this.getCurTabData()
       if (tab.index === '1') {
-        this.init()
+        this.timeChange()
-        this.$nextTick(() => {
-          this.handleActiveBar()
-        })
       }
     },
     clearSelect () {
@@ -779,20 +773,19 @@ export default {
   },
   watch: {
     tabType (n) {
-      this.$nextTick(() => {
+      this.timeChange()
-        this.handleActiveBar()
-      })
     },
-    timeFilter: {
+    /*
-      handler () {
+    hasUpdatingRecord (n) {
-        if (this.updateKnowledge.source === 'cn_psiphon3_ip') {
+      if (n) { // update record页存在“正在更新”的记录时，每20秒自动请求一次接口
-          this.init()
+        this.timer = setTimeout(() => {
-        }
+          this.getCurTabData()
-        this.$nextTick(() => {
+        }, 20000)
-          this.handleActiveBar()
+      } else { // 直到出现新的记录,出现新记录后（失败或者成功）,取消定时请求接口，右上角"update"按钮恢复可用。"正在更新"和"失败”都会有对应的强调样式。
-        })
+        clearTimeout(this.timer)
       }
     },
+    */
     tableData: {
       handler (n) {
         if (this.tableData && this.tableData.length > 0) {
@@ -828,9 +821,7 @@ export default {
       handler (n) {
         if (!n) {
           this.fileList = []
-          if (this.updateKnowledge.source === 'cn_psiphon3_ip') {
+          this.timeChange()
-            this.init()
-          }
         } else {
           if (this.myChart) {
             this.myChart.dispose()
@@ -857,7 +848,7 @@ export default {
     })
   },
   beforeUnmount () {
-    clearTimeout(this.timer)
+    //clearTimeout(this.timer)
     window.removeEventListener('resize', this.resize)
     const dom = document.getElementById('psiphonBarChart')
     if (dom) {

src/views/charts/charts/tools.js

@@ -338,10 +338,10 @@ export function axisFormatter (params) {
   return str
 }
 export function tooLongFormatter (name) {
-  return format.truncateText(name, 150, '12px')
+  return format.truncateText(name, 160, '12px')
 }
 export function tooLongFormatterFor2Columns (name) {
-  return format.truncateText(name, 83, '12px')
+  return format.truncateText(name, 100, '12px')
 }
 export function timeHorizontalFormatter (params) {
   let str = '<div>'

src/views/detections/Index.vue

@@ -138,7 +138,8 @@ import { useRoute } from 'vue-router'
 import Loading from '@/components/common/Loading'
 import ChartTabs from '@/components/common/ChartTabs'
 import { useStore } from 'vuex'
-import { tooLongFormatterFor2Columns } from '@/views/charts/charts/tools'
+import { tooLongFormatter } from '@/views/charts/charts/tools'
+import { format } from 'echarts'
 
 export default {
   name: 'Index',
@@ -271,6 +272,7 @@ export default {
       loading: false,
       oldActiveEntitySearchValue: '',
       initFlag: true // 初始化标识，初始化时保证mounted执行
+      // detectionChart:null
     }
   },
   methods: {
@@ -442,7 +444,13 @@ export default {
             return { value: d.count, name: d.eventType }
           })
           if (data.length > 6) {
-            securityTypeOption.legend.formatter = tooLongFormatterFor2Columns
+            const dom = document.getElementById('eventSeverityPiesecurityEvent')
+            if (dom) {
+              const oneColumnWidth = (dom.clientWidth * 0.56) / 2 - 30
+              securityTypeOption.legend.formatter = function (name) {
+                return format.truncateText(name, oneColumnWidth, '12px')
+              }
+            }
           }
           detectionChart.setOption(securityTypeOption)
 
@@ -489,7 +497,13 @@ export default {
             return { value: d.count, name: d.eventType, itemStyle: { color: getAttackColor(d.eventType) } }
           })
           if (data.length > 6) {
-            securityTypeOption.legend.formatter = tooLongFormatterFor2Columns
+            const dom = document.getElementById('detectionCategoryPersecurityEvent')
+            if (dom) {
+              const oneColumnWidth = (dom.clientWidth * 0.56) / 2 - 30
+              securityTypeOption.legend.formatter = function (name) {
+                return format.truncateText(name, oneColumnWidth, '12px')
+              }
+            }
           }
           detectionChart.setOption(securityTypeOption)
 
@@ -828,6 +842,32 @@ export default {
     },
     resize () {
       this.chartInit.forEach(e => { e.value.resize() })
+      /*
+      //第二个饼图的resize
+      let dom = document.getElementById('detectionCategoryPersecurityEvent')
+      if(dom){
+        let securityTypeOption = this.detectionChart.getOption()
+
+        const chartDom = document.getElementById(`detectionCategoryPer${this.pageType}`)
+        this.detectionChart = echarts.getInstanceByDom(chartDom)
+        if (this.detectionChart) {
+          echarts.dispose(this.detectionChart)
+        }
+        this.detectionChart = echarts.init(chartDom)
+
+        let oneColumnWidth = (dom.clientWidth * 0.56)/2-30
+
+        if (this.statisticsCategoryData.length > 6) {
+          securityTypeOption.legend.formatter = function (name) {
+            return format.truncateText(name, oneColumnWidth, '12px')
+          }
+        }else {
+          securityTypeOption.legend.formatter = tooLongFormatter
+        }
+        this.detectionChart.setOption(securityTypeOption)
+        this.detectionChart.resize()
+      }
+*/
     },
     jumpNewDetetion () {
       this.$router.push({

src/views/detections/options/detectionOptions.js

@@ -187,7 +187,7 @@ export const pieForSeverity = {
   legend: {
     orient: 'vertical',
     type: 'plain',
-    left: '52%',
+    left: '44%',
     top: 'middle',
     icon: 'circle',
     itemWidth: 10, // 设置宽度
@@ -203,7 +203,7 @@ export const pieForSeverity = {
       type: 'pie',
       selectedMode: 'single',
       radius: ['43%', '65%'],
-      center: ['26%', '50%'],
+      center: ['22%', '50%'],
       data: [],
       label: {
         show: false