update(console): optimize log font, add missing auth (#2337)

star-whale · Jun 9, 2023 · e99ca3f · e99ca3f
1 parent ff71a9e
commit e99ca3f
Show file tree

Hide file tree

Showing 10 changed files with 85 additions and 44 deletions.
diff --git a/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.css b/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.css
@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3410006 */
-  src: url('iconfont.woff2?t=1684302879106') format('woff2'),
-       url('iconfont.woff?t=1684302879106') format('woff'),
-       url('iconfont.ttf?t=1684302879106') format('truetype');
+  src: url('iconfont.woff2?t=1686280722163') format('woff2'),
+       url('iconfont.woff?t=1686280722163') format('woff'),
+       url('iconfont.ttf?t=1686280722163') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-vscode:before {
+  content: "\e66b";
+}
+
+.icon-WeChat2:before {
+  content: "\e66a";
+}
+
 .icon-layout-1:before {
   content: "\e667";
 }

diff --git a/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.js b/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.js
diff --git a/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.json b/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.json
@@ -5,6 +5,20 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "35913528",
+      "name": "vscode",
+      "font_class": "vscode",
+      "unicode": "e66b",
+      "unicode_decimal": 58987
+    },
+    {
+      "icon_id": "35869570",
+      "name": "WeChat2",
+      "font_class": "WeChat2",
+      "unicode": "e66a",
+      "unicode_decimal": 58986
+    },
     {
       "icon_id": "35478546",
       "name": "layout-1",

diff --git a/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.ttf b/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.ttf
diff --git a/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.woff b/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.woff
diff --git a/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.woff2 b/console/packages/starwhale-ui/src/IconFont/fonts/iconfont.woff2
diff --git a/console/packages/starwhale-ui/src/IconFont/index.tsx b/console/packages/starwhale-ui/src/IconFont/index.tsx
@@ -105,6 +105,9 @@ export type IconTypesT =
     | 'layout-1'
     | 'layout-2'
     | 'layout-3'
+    | 'WeChat'
+    | 'WeChat2'
+    | 'vscode'
 
 interface IIconFontProps {
     style?: React.CSSProperties

diff --git a/console/src/components/LogViewer/LogView.scss b/console/src/components/LogViewer/LogView.scss
@@ -1,6 +1,12 @@
 .pf-c-log-viewer {
-    --pf-c-log-viewer__text--FontSize: 16px;
+    // --pf-c-log-viewer__text--FontSize: 12px;
+    // --pf-c-log-viewer__text--FontFamily: 'Monaco', monospace;
+    // --pf-c-log-viewer__index--FontFamily: 'Monaco', monospace;
     --pf-c-button--LineHeight: 1;
+    .pf-c-log-viewer__list {
+        font-size: 12px;
+        font-family: 'Roboto Mono', monospace;
+    }
 
     .pf-c-log-viewer__scroll-container {
         &::-webkit-scrollbar {

diff --git a/console/src/pages/Evaluation/EvaluationOverviewLayout.tsx b/console/src/pages/Evaluation/EvaluationOverviewLayout.tsx
@@ -80,26 +80,34 @@ function EvaluationOverviewLayout({ children }: IJobLayoutProps) {
                 <>
                     <Button onClick={() => handleAction(job.id, JobActionType.CANCEL)}>{t('Cancel')}</Button>
                     &nbsp;&nbsp;
-                    <Button onClick={() => handleAction(job.id, JobActionType.PAUSE)}>{t('Pause')}</Button>
+                    <WithCurrentAuth id='job-pause'>
+                        <Button onClick={() => handleAction(job.id, JobActionType.PAUSE)}>{t('Pause')}</Button>
+                    </WithCurrentAuth>
                 </>
             ),
             [JobStatusType.RUNNING]: (
                 <>
                     <Button onClick={() => handleAction(job.id, JobActionType.CANCEL)}>{t('Cancel')}</Button>
                     &nbsp;&nbsp;
-                    <Button onClick={() => handleAction(job.id, JobActionType.PAUSE)}>{t('Pause')}</Button>
+                    <WithCurrentAuth id='job-pause'>
+                        <Button onClick={() => handleAction(job.id, JobActionType.PAUSE)}>{t('Pause')}</Button>
+                    </WithCurrentAuth>
                 </>
             ),
             [JobStatusType.PAUSED]: (
                 <>
                     <Button onClick={() => handleAction(job.id, JobActionType.CANCEL)}>{t('Cancel')}</Button>
                     &nbsp;&nbsp;
-                    <Button onClick={() => handleAction(job.id, JobActionType.RESUME)}>{t('Resume')}</Button>
+                    <WithCurrentAuth id='job-resume'>
+                        <Button onClick={() => handleAction(job.id, JobActionType.RESUME)}>{t('Resume')}</Button>
+                    </WithCurrentAuth>
                 </>
             ),
             [JobStatusType.FAIL]: (
                 <>
-                    <Button onClick={() => handleAction(job.id, JobActionType.RESUME)}>{t('Resume')}</Button>
+                    <WithCurrentAuth id='job-resume'>
+                        <Button onClick={() => handleAction(job.id, JobActionType.RESUME)}>{t('Resume')}</Button>
+                    </WithCurrentAuth>
                 </>
             ),
         }

diff --git a/console/src/pages/Job/TaskListCard.tsx b/console/src/pages/Job/TaskListCard.tsx
@@ -12,6 +12,7 @@ import qs from 'qs'
 import moment from 'moment'
 import JobStatus from '@/domain/job/components/JobStatus'
 import { WithCurrentAuth } from '@/api/WithAuth'
+import { IconFont } from '@starwhale/ui'
 
 export interface ITaskListCardProps {
     header: React.ReactNode
@@ -46,7 +47,6 @@ export default function TaskListCard({ header, onAction }: ITaskListCardProps) {
                     t('Task ID'),
                     t('Step'),
                     t('Resource Pool'),
-                    t('Debug'),
                     t('Started'),
                     t('End Time'),
                     t('Duration'),
@@ -59,41 +59,43 @@ export default function TaskListCard({ header, onAction }: ITaskListCardProps) {
                             task.id,
                             task.stepName,
                             task.resourcePool,
-                            <WithCurrentAuth id='job-dev' key='devUrl'>
-                                {(bool: boolean) =>
-                                    bool && task.devUrl ? (
-                                        <a target='_blank' href={task.devUrl} rel='noreferrer'>
-                                            {t('To Debug')}
-                                        </a>
-                                    ) : (
-                                        '-'
-                                    )
-                                }
-                            </WithCurrentAuth>,
                             task.startedTime && formatTimestampDateTime(task.startedTime),
                             task.finishedTime && formatTimestampDateTime(task.finishedTime),
                             task.finishedTime && task.startedTime && task.finishedTime !== -1 && task.startedTime !== -1
                                 ? moment.duration(task.finishedTime - task.startedTime, 'milliseconds').humanize()
                                 : '-',
                             <JobStatus key='status' status={task.taskStatus as any} />,
-                            <StyledLink
-                                key={task.uuid}
-                                onClick={(e: any) => {
-                                    // eslint-disalbe-next-line no-unused-expressions
-                                    const trDom = e.currentTarget.closest('tr')
-                                    const trDoms = trDom?.parentElement?.children
-                                    _.forEach(trDoms, (d) => {
-                                        d?.classList.remove('tr--selected')
-                                    })
-                                    trDom?.classList.add('tr--selected')
+                            <p key='action' style={{ display: 'flex', gap: '10px' }}>
+                                <StyledLink
+                                    key={task.uuid}
+                                    onClick={(e: any) => {
+                                        // eslint-disalbe-next-line no-unused-expressions
+                                        const trDom = e.currentTarget.closest('tr')
+                                        const trDoms = trDom?.parentElement?.children
+                                        _.forEach(trDoms, (d) => {
+                                            d?.classList.remove('tr--selected')
+                                        })
+                                        trDom?.classList.add('tr--selected')
 
-                                    onAction?.('viewlog', {
-                                        ...task,
-                                    })
-                                }}
-                            >
-                                {t('View Log')}
-                            </StyledLink>,
+                                        onAction?.('viewlog', {
+                                            ...task,
+                                        })
+                                    }}
+                                >
+                                    {t('View Log')}
+                                </StyledLink>
+                                <WithCurrentAuth id='job-dev' key='devUrl'>
+                                    {(bool: boolean) =>
+                                        bool && task.devUrl ? (
+                                            <a target='_blank' href={task.devUrl} rel='noreferrer' title='debug'>
+                                                <IconFont type='vscode' size={14} />
+                                            </a>
+                                        ) : (
+                                            ''
+                                        )
+                                    }
+                                </WithCurrentAuth>
+                            </p>,
                         ]
                     }) ?? []
                 }