feat: optimized git icon

crawlab-team · Jun 30, 2024 · 1711690 · 1711690
1 parent f11999d
commit 1711690
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 12 deletions.
diff --git a/src/i18n/lang/en/components/git.ts b/src/i18n/lang/en/components/git.ts
@@ -188,6 +188,13 @@ const git: LComponentsGit = {
   diff: {
     title: 'File Diff',
   },
+  providers: {
+    github: 'GitHub',
+    bitbucket: 'Bitbucket',
+    gitlab: 'GitLab',
+    aws: 'AWS',
+    git: 'Git',
+  },
 };
 
 export default git;
diff --git a/src/i18n/lang/zh/components/git.ts b/src/i18n/lang/zh/components/git.ts
@@ -188,6 +188,13 @@ const git: LComponentsGit = {
   diff: {
     title: '文件变更',
   },
+  providers: {
+    github: 'GitHub',
+    bitbucket: 'Bitbucket',
+    gitlab: 'GitLab',
+    aws: 'AWS',
+    git: 'Git',
+  },
 };
 
 export default git;
diff --git a/src/interfaces/i18n/components/git.d.ts b/src/interfaces/i18n/components/git.d.ts
@@ -188,4 +188,11 @@ interface LComponentsGit {
   diff: {
     title: string;
   };
+  providers: {
+    github: string;
+    bitbucket: string;
+    gitlab: string;
+    aws: string;
+    git: string;
+  };
 }
diff --git a/src/views/git/detail/tabs/GitDetailTabLogs.vue b/src/views/git/detail/tabs/GitDetailTabLogs.vue
@@ -37,17 +37,27 @@ const tableColumns = computed<Column<GitLog>[]>(() => {
       title: t('components.git.logs.table.columns.reference'),
       width: 120,
       cellRenderer: ({ rowData }: { rowData: GitLog }) => {
-        return rowData.refs?.map(r =>
-          h(Tag, {
-            label: r.name,
-            icon:
-              r.type === GIT_REF_TYPE_BRANCH
-                ? ['fa', 'code-branch']
-                : ['fa', 'tag'],
-            effect: r.type === GIT_REF_TYPE_BRANCH ? 'dark' : 'light',
-            type: r.type === GIT_REF_TYPE_BRANCH ? 'primary' : 'success',
-            tooltip: `${r.type}: ${r.name}`,
-          })
+        return h(
+          'div',
+          {
+            style: {
+              display: 'flex',
+              flexWrap: 'wrap',
+              gap: '5px',
+            },
+          },
+          rowData.refs?.map(r =>
+            h(Tag, {
+              label: r.name,
+              icon:
+                r.type === GIT_REF_TYPE_BRANCH
+                  ? ['fa', 'code-branch']
+                  : ['fa', 'tag'],
+              effect: r.type === GIT_REF_TYPE_BRANCH ? 'dark' : 'light',
+              type: r.type === GIT_REF_TYPE_BRANCH ? 'primary' : 'success',
+              tooltip: `${r.type}: ${r.name}`,
+            })
+          )
         );
       },
     },

diff --git a/src/views/git/list/useGitList.ts b/src/views/git/list/useGitList.ts
@@ -82,6 +82,23 @@ const useGitList = () => {
     },
   ]);
 
+  const getGitIcon = (row: Git): { icon: Icon; color?: string } => {
+    if (row.url?.includes('github')) {
+      return { icon: ['fab', 'github'], color: '#0d1117' };
+    } else if (row.url?.includes('bitbucket')) {
+      return { icon: ['fab', 'bitbucket'], color: '#0052cc' };
+    } else if (row.url?.includes('gitlab')) {
+      return { icon: ['fab', 'gitlab'], color: '#E24329' };
+    } else if (row.url?.includes('amazonaws')) {
+      return { icon: ['fab', 'aws'], color: '#232f3e' };
+    } else {
+      return {
+        icon: ['fab', 'git'],
+        color: 'var(--cl-info-medium-dark-color)',
+      };
+    }
+  };
+
   // table columns
   const tableColumns = computed<TableColumns<Git>>(
     () =>
@@ -105,7 +122,8 @@ const useGitList = () => {
               },
               [
                 h(ClIcon, {
-                  icon: ['fab', 'git'],
+                  icon: getGitIcon(row).icon,
+                  color: getGitIcon(row).color,
                 }),
                 h(NavLink, {
                   path: `/gits/${row._id}`,