fix: Optimize the chart

Author: wangdan-fit2cloud

ui/src/components/app-charts/components/BarCharts.vue

@@ -56,7 +56,8 @@ function initChart() {
       text: props.option?.title,
       textStyle: {
         fontSize: '16px',
-      },
+        color: '#1f2329',
+      }
     },
     tooltip: {
       trigger: 'axis',

ui/src/components/app-charts/components/LineCharts.vue

@@ -55,6 +55,7 @@ function initChart() {
       text: props.option?.title,
       textStyle: {
         fontSize: '16px',
+        color: '#1f2329',
       },
     },
     tooltip: {

ui/src/components/workflow-dropdown-menu/application/index.vue

@@ -299,7 +299,6 @@ function folderClickHandle(row: any) {
 }
 
 async function handleClick(val: string) {
-  console.log(val)
   if (val === 'tool') {
     await getToolFolder()
     getToolList()

ui/src/layout/app-main/index.vue

@@ -14,11 +14,8 @@ import { useRoute } from 'vue-router'
 
 const route = useRoute()
 
-
-
 const cachedViews: any = ref([])
 onBeforeUpdate(() => {
-
   const { name, meta } = route
   if (name && !cachedViews.value.includes(name)) {
     cachedViews.value.push(name)

ui/src/layout/layout-template/SimpleLayout.vue

@@ -16,10 +16,11 @@ const {
 } = route as any
 const isShared = computed(() => {
   return (
-    folderId === 'shared' ||
-    from === 'systemShare' ||
-    from === 'systemManage' ||
-    route.path.includes('resource-management')
+    (folderId === 'shared' ||
+      from === 'systemShare' ||
+      from === 'systemManage' ||
+      route.path.includes('resource-management')) &&
+    route.fullPath != '/application'
   )
 })
 </script>
@@ -35,6 +36,7 @@ const isShared = computed(() => {
         show-icon
         :closable="false"
       />
+
       <SystemHeader v-if="isShared"></SystemHeader>
       <UserHeader v-else />
     </div>

ui/src/views/application-overview/component/StatisticsCharts.vue

@@ -61,7 +61,18 @@
           />
         </el-select>
         <div class="p-8">
-          <AppCharts height="316px" id="tokenUsageCharts" type="bar" :option="tokenUsageOption" />
+          <AppCharts
+            v-if="tokenUsage.length > 0"
+            height="316px"
+            id="tokenUsageCharts"
+            type="bar"
+            :option="tokenUsageOption"
+          />
+
+          <div v-else>
+            <h4 class="ml-4">{{ tokenUsageOption.title }}</h4>
+            <el-empty :description="$t('common.noData')" style="height: 316px" />
+          </div>
         </div>
       </el-card>
     </el-col>
@@ -77,11 +88,16 @@
         </el-select>
         <div class="p-8">
           <AppCharts
+            v-if="topQuestions.length > 0"
             height="316px"
             id="topQuestionsCharts"
             type="bar"
             :option="topQuestionsOption"
           />
+          <div v-else>
+            <h4 class="ml-4">{{ topQuestionsOption.title }}</h4>
+            <el-empty :description="$t('common.noData')" style="height: 316px" />
+          </div>
         </div>
       </el-card>
     </el-col>
@@ -215,7 +231,7 @@ const tokenUsageOption = computed(() => {
         data: getAttrsArray(props.tokenUsage?.slice(0, tokenUsageCount.value), 'token_usage'),
       },
     ],
-    dataZoom: props.tokenUsage.length > 0,
+    dataZoom: props.tokenUsage.length > 20,
   }
 })
 const topQuestionsOption = computed(() => {
@@ -230,7 +246,7 @@ const topQuestionsOption = computed(() => {
         ),
       },
     ],
-    dataZoom: props.topQuestions.length > 0,
+    dataZoom: props.topQuestions.length > 20,
   }
 })
 </script>