update: 1. new font for log. 2. loss display update

Signed-off-by: ArvinHuang <[email protected]>

resources-front-end/packages/fate-board/src/components/VirtualScroll/VirtualScrollItem.vue

@@ -71,7 +71,8 @@ watch(
     } else if (value && $_pendingScrollUpdate.value === id.value) {
       updateSize();
     }
-  }
+  },
+  { deep: true }
 );
 
 onMounted(() => {

resources-front-end/packages/fate-board/src/style/default.scss

@@ -13,6 +13,7 @@
 
 @import './index.scss';
 @import './scroll.scss';
+@import './font/font.scss';
 
 * {
   margin: 0;

resources-front-end/packages/fate-board/src/style/font/font.scss

@@ -0,0 +1,4 @@
+@font-face {
+  font-family: 'lucon';
+  src: url(~@/style/font/lucon_0.ttf) format('truetype')
+}

resources-front-end/packages/fate-board/src/transform/metric/loss.ts

@@ -7,8 +7,9 @@ export default function Loss (
 
   const configuration = {
     xAxis: {
-      type: 'category',
-      name: 'epoch'
+      type: 'value',
+      name: 'epoch',
+      minInterval: 1
     },
     yAxis: {
       type: 'value',
@@ -38,7 +39,13 @@ export default function Loss (
         pointers.length = 0
       }
       return result
-    })()
+    })(),
+    tooltip: {
+      formatter: (parameters: any) => {
+        return `Epoch: ${parameters[0].axisValue} <br />
+        Loss: ${parameters[0].data[1]}`
+      }
+    }
   }
 
   return {

resources-front-end/packages/fate-board/src/views/dashboard/Log/LoggerScroll.vue

@@ -114,6 +114,8 @@ watch(
     text-align: left;
     text-indent: initial;
     line-height: 20px;
+    white-space: pre-wrap;
+    font-family: 'lucon', 'Lucida Console', Monaco, monospace, 'Arial';
   }
 }
 .f-log-tip {

resources-front-end/packages/fate-ui-component/lib/components/Selection/index.ts

@@ -1,10 +1,10 @@
-import './Selection.scss';
-import FSelection from './Selection.vue';
-import FSelectionChart from './SelectionChart.vue';
-
-const SelectionInstall = (app: any) => {
-  app.component('FSelection', FSelection)
-  app.component('FSelectionChart', FSelectionChart)
-}
-
-export default SelectionInstall
+import './Selection.scss';
+import FSelection from './Selection.vue';
+import FSelectionChart from './SelectionChart.vue';
+
+const SelectionInstall = (app: any) => {
+  app.component('FSelection', FSelection)
+  app.component('FSelectionChart', FSelectionChart)
+}
+
+export default SelectionInstall