You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dolphinscheduler.apache.org by so...@apache.org on 2022/03/10 10:48:47 UTC
[dolphinscheduler] branch dev updated: [Feature][UI Next][V1.0.0-Alpha] Unify clickable text in tables. (#8813)
This is an automated email from the ASF dual-hosted git repository.
songjian pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/dolphinscheduler.git
The following commit(s) were added to refs/heads/dev by this push:
new f5711e4 [Feature][UI Next][V1.0.0-Alpha] Unify clickable text in tables. (#8813)
f5711e4 is described below
commit f5711e4fcd744cdab8aefcf8f08a4a951481b83b
Author: Amy0104 <97...@users.noreply.github.com>
AuthorDate: Thu Mar 10 18:48:40 2022 +0800
[Feature][UI Next][V1.0.0-Alpha] Unify clickable text in tables. (#8813)
---
.../button-link}/index.module.scss | 6 +-
.../button-link/index.tsx} | 61 ++++++++--------
.../src/components/modal/index.tsx | 9 +--
dolphinscheduler-ui-next/src/service/service.ts | 2 +-
dolphinscheduler-ui-next/src/utils/log.ts | 27 +++++---
.../src/views/datasource/list/use-columns.ts | 14 ++--
.../src/views/projects/list/use-table.ts | 9 +--
.../projects/task/definition/index.module.scss | 10 ---
.../views/projects/task/definition/use-table.ts | 15 ++--
.../projects/workflow/definition/index.module.scss | 8 ---
.../projects/workflow/definition/use-table.ts | 62 ++++++++---------
.../projects/workflow/instance/index.module.scss | 8 ---
.../views/projects/workflow/instance/use-table.ts | 81 ++++++++++------------
.../src/views/resource/file/table/use-table.ts | 14 ++--
.../views/resource/udf/resource/index.module.scss | 8 ---
.../src/views/resource/udf/resource/use-table.ts | 37 ++++------
dolphinscheduler-ui/src/sass/common/_table.scss | 81 ++++++++++------------
17 files changed, 187 insertions(+), 265 deletions(-)
diff --git a/dolphinscheduler-ui-next/src/views/resource/file/table/index.module.scss b/dolphinscheduler-ui-next/src/components/button-link/index.module.scss
similarity index 92%
rename from dolphinscheduler-ui-next/src/views/resource/file/table/index.module.scss
rename to dolphinscheduler-ui-next/src/components/button-link/index.module.scss
index 488e8c0..9f5dfe3 100644
--- a/dolphinscheduler-ui-next/src/views/resource/file/table/index.module.scss
+++ b/dolphinscheduler-ui-next/src/components/button-link/index.module.scss
@@ -14,10 +14,10 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
+.button-link {
+ cursor: pointer;
+ color: var(--n-color-target);
-.links {
- color: #2080f0;
- text-decoration: none;
&:hover {
text-decoration: underline;
}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/definition/index.module.scss b/dolphinscheduler-ui-next/src/components/button-link/index.tsx
similarity index 52%
copy from dolphinscheduler-ui-next/src/views/projects/task/definition/index.module.scss
copy to dolphinscheduler-ui-next/src/components/button-link/index.tsx
index 914df25..96f1aff 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/definition/index.module.scss
+++ b/dolphinscheduler-ui-next/src/components/button-link/index.tsx
@@ -14,41 +14,38 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
+import { defineComponent, PropType, renderSlot } from 'vue'
+import { NButton } from 'naive-ui'
+import styles from './index.module.scss'
-.search-card {
- display: flex;
- justify-content: space-between;
- align-items: center;
-
- .box {
- display: flex;
- justify-content: flex-end;
- align-items: center;
- width: 300px;
-
- button,
- input {
- margin-left: 10px;
- }
+const props = {
+ disabled: {
+ type: Boolean,
+ default: false
+ },
+ iconPlacement: {
+ type: String as PropType<'left' | 'right'>,
+ default: 'left'
}
}
-.table-card {
- margin-top: 8px;
-
- .pagination {
- margin-top: 20px;
- display: flex;
- justify-content: center;
+const ButtonLink = defineComponent({
+ name: 'button-link',
+ props,
+ emits: ['click'],
+ setup(props, { slots, emit }) {
+ const onClick = (ev: MouseEvent) => {
+ emit('click', ev)
+ }
+ return () => (
+ <NButton {...props} onClick={onClick} text class={styles['button-link']}>
+ {{
+ default: renderSlot(slots, 'default'),
+ icon: renderSlot(slots, 'icon')
+ }}
+ </NButton>
+ )
}
-}
-
-.links {
- color: dodgerblue;
- text-decoration: none;
- cursor: pointer;
+})
- &:hover {
- text-decoration: underline;
- }
-}
+export default ButtonLink
diff --git a/dolphinscheduler-ui-next/src/components/modal/index.tsx b/dolphinscheduler-ui-next/src/components/modal/index.tsx
index 9ad83f2..9666a82 100644
--- a/dolphinscheduler-ui-next/src/components/modal/index.tsx
+++ b/dolphinscheduler-ui-next/src/components/modal/index.tsx
@@ -15,8 +15,9 @@
* limitations under the License.
*/
-import { defineComponent, h, PropType, renderSlot, Ref } from 'vue'
-import { NModal, NCard, NButton, NSpace, NIcon } from 'naive-ui'
+import { defineComponent, PropType, renderSlot, Ref } from 'vue'
+import { NModal, NCard, NButton, NSpace } from 'naive-ui'
+import ButtonLink from '@/components/button-link'
import { useI18n } from 'vue-i18n'
import styles from './index.module.scss'
import { LinkOption } from '@/components/modal/types'
@@ -108,12 +109,12 @@ const Modal = defineComponent({
.filter((item: any) => item.show)
.map((item: any) => {
return (
- <NButton text onClick={item.action}>
+ <ButtonLink onClick={item.action}>
{{
default: () => item.text,
icon: () => item.icon()
}}
- </NButton>
+ </ButtonLink>
)
})}
</NSpace>
diff --git a/dolphinscheduler-ui-next/src/service/service.ts b/dolphinscheduler-ui-next/src/service/service.ts
index 58d3a5b..c22d51f 100644
--- a/dolphinscheduler-ui-next/src/service/service.ts
+++ b/dolphinscheduler-ui-next/src/service/service.ts
@@ -29,7 +29,7 @@ const userStore = useUserStore()
* @description Log and display errors
* @param {Error} error Error object
*/
- const handleError = (res: AxiosResponse<any, any>) => {
+const handleError = (res: AxiosResponse<any, any>) => {
// Print to console
if (import.meta.env.MODE === 'development') {
utils.log.capsule('DolphinScheduler', 'UI-NEXT')
diff --git a/dolphinscheduler-ui-next/src/utils/log.ts b/dolphinscheduler-ui-next/src/utils/log.ts
index cb7cc95..6434e51 100644
--- a/dolphinscheduler-ui-next/src/utils/log.ts
+++ b/dolphinscheduler-ui-next/src/utils/log.ts
@@ -27,11 +27,20 @@ const log = {
const typeColor = (type = 'primary') => {
let color = ''
switch (type) {
- case 'primary': color = '#1890ff'; break
- case 'success': color = '#52c41a'; break
- case 'warning': color = '#faad14'; break
- case 'error': color = '#ff4d4f'; break
- default:; break
+ case 'primary':
+ color = '#1890ff'
+ break
+ case 'success':
+ color = '#52c41a'
+ break
+ case 'warning':
+ color = '#faad14'
+ break
+ case 'error':
+ color = '#ff4d4f'
+ break
+ default:
+ break
}
return color
}
@@ -42,11 +51,13 @@ const typeColor = (type = 'primary') => {
* @param {String} text info text
* @param {String} type style
*/
- log.capsule = (title: string, text: string, type: string = 'primary') => {
+log.capsule = (title: string, text: string, type: string = 'primary') => {
console.log(
`%c ${title} %c ${text} %c`,
'background:#35495E; padding: 2px ; border-radius: 3px 0 0 3px; color: #fff;',
- `background:${typeColor(type)}; padding: 2px; border-radius: 0 3px 3px 0; color: #fff;`,
+ `background:${typeColor(
+ type
+ )}; padding: 2px; border-radius: 0 3px 3px 0; color: #fff;`,
'background:transparent'
)
}
@@ -61,4 +72,4 @@ log.error = function (info) {
console.groupEnd()
}
-export default log
\ No newline at end of file
+export default log
diff --git a/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts b/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts
index 5a0f556..976c723 100644
--- a/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts
+++ b/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts
@@ -20,6 +20,7 @@ import { useI18n } from 'vue-i18n'
import { NPopover, NButton, NIcon, NPopconfirm, NSpace } from 'naive-ui'
import { EditOutlined, DeleteOutlined } from '@vicons/antd'
import JsonHighlight from './json-highlight'
+import ButtonLink from '@/components/button-link'
import { TableColumns } from './types'
export function useColumns(onCallback: Function) {
@@ -52,16 +53,9 @@ export function useColumns(onCallback: Function) {
{ trigger: 'click' },
{
trigger: () =>
- h(
- NButton,
- {
- quaternary: true,
- type: 'primary'
- },
- {
- default: () => t('datasource.click_to_view')
- }
- ),
+ h(ButtonLink, null, {
+ default: () => t('datasource.click_to_view')
+ }),
default: () => h(JsonHighlight, { rowData })
}
)
diff --git a/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts
index d414a13..e68552f 100644
--- a/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts
@@ -18,6 +18,7 @@
import { h, reactive, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { useAsyncState } from '@vueuse/core'
+import ButtonLink from '@/components/button-link'
import { queryProjectListPaging } from '@/service/modules/projects'
import { parseTime } from '@/utils/common'
import { deleteProject } from '@/service/modules/projects'
@@ -77,18 +78,14 @@ export function useTable() {
{
default: () =>
h(
- 'a',
+ ButtonLink,
{
onClick: () => {
menuStore.setProjectCode(row.code)
router.push({ path: `/projects/${row.code}` })
}
},
- {
- default: () => {
- return row.name
- }
- }
+ { default: () => row.name }
),
tooltip: () => row.name
}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/definition/index.module.scss b/dolphinscheduler-ui-next/src/views/projects/task/definition/index.module.scss
index 914df25..756290d 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/definition/index.module.scss
+++ b/dolphinscheduler-ui-next/src/views/projects/task/definition/index.module.scss
@@ -42,13 +42,3 @@
justify-content: center;
}
}
-
-.links {
- color: dodgerblue;
- text-decoration: none;
- cursor: pointer;
-
- &:hover {
- text-decoration: underline;
- }
-}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts
index bebaa4a..bda2897 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts
@@ -18,6 +18,7 @@
import { useAsyncState } from '@vueuse/core'
import { reactive, h, ref } from 'vue'
import { NButton, NIcon, NPopconfirm, NSpace, NTag, NTooltip } from 'naive-ui'
+import ButtonLink from '@/components/button-link'
import { useI18n } from 'vue-i18n'
import {
DeleteOutlined,
@@ -30,7 +31,6 @@ import {
deleteTaskDefinition
} from '@/service/modules/task-definition'
import { useRoute } from 'vue-router'
-import styles from './index.module.scss'
import type {
TaskDefinitionItem,
TaskDefinitionRes
@@ -55,18 +55,11 @@ export function useTable(onEdit: Function) {
width: 400,
render: (row: IRecord) =>
h(
- 'a',
+ ButtonLink,
{
- class: styles.links,
- onClick: () => {
- onEdit(row, true)
- }
+ onClick: () => void onEdit(row, true)
},
- {
- default: () => {
- return row.taskName
- }
- }
+ { default: () => row.taskName }
)
},
{
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.module.scss b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.module.scss
index cfaee42..7eac171 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.module.scss
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.module.scss
@@ -86,11 +86,3 @@
width: 86%;
}
}
-
-.links {
- color: #2080f0;
- text-decoration: none;
- &:hover {
- text-decoration: underline;
- }
-}
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts
index 547381b..65734c1 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts
@@ -29,10 +29,10 @@ import {
release
} from '@/service/modules/process-definition'
import TableAction from './components/table-action'
-
import { IDefinitionParam } from './types'
import styles from './index.module.scss'
import { NEllipsis, NTag } from 'naive-ui'
+import ButtonLink from '@/components/button-link'
export function useTable() {
const { t } = useI18n()
@@ -72,17 +72,15 @@ export function useTable() {
{
default: () =>
h(
- 'a',
+ ButtonLink,
{
- href: 'javascript:',
- class: styles.links,
onClick: () =>
- router.push({
+ void router.push({
name: 'workflow-definition-detail',
params: { code: row.code }
})
},
- row.name
+ { default: () => row.name }
),
tooltip: () => row.name
}
@@ -191,15 +189,14 @@ export function useTable() {
}
const deleteWorkflow = (row: any) => {
- deleteByCode(variables.projectCode, row.code)
- .then(() => {
- window.$message.success(t('project.workflow.success'))
- getTableData({
- pageSize: variables.pageSize,
- pageNo: variables.page,
- searchVal: variables.searchVal
- })
+ deleteByCode(variables.projectCode, row.code).then(() => {
+ window.$message.success(t('project.workflow.success'))
+ getTableData({
+ pageSize: variables.pageSize,
+ pageNo: variables.page,
+ searchVal: variables.searchVal
})
+ })
}
const releaseWorkflow = (row: any) => {
@@ -209,15 +206,14 @@ export function useTable() {
| 'OFFLINE'
| 'ONLINE'
}
- release(data, variables.projectCode, row.code)
- .then(() => {
- window.$message.success(t('project.workflow.success'))
- getTableData({
- pageSize: variables.pageSize,
- pageNo: variables.page,
- searchVal: variables.searchVal
- })
+ release(data, variables.projectCode, row.code).then(() => {
+ window.$message.success(t('project.workflow.success'))
+ getTableData({
+ pageSize: variables.pageSize,
+ pageNo: variables.page,
+ searchVal: variables.searchVal
})
+ })
}
const copyWorkflow = (row: any) => {
@@ -225,15 +221,14 @@ export function useTable() {
codes: String(row.code),
targetProjectCode: variables.projectCode
}
- batchCopyByCodes(data, variables.projectCode)
- .then(() => {
- window.$message.success(t('project.workflow.success'))
- getTableData({
- pageSize: variables.pageSize,
- pageNo: variables.page,
- searchVal: variables.searchVal
- })
+ batchCopyByCodes(data, variables.projectCode).then(() => {
+ window.$message.success(t('project.workflow.success'))
+ getTableData({
+ pageSize: variables.pageSize,
+ pageNo: variables.page,
+ searchVal: variables.searchVal
})
+ })
}
const downloadBlob = (data: any, fileNameS = 'json') => {
@@ -267,10 +262,9 @@ export function useTable() {
const data = {
codes: String(row.code)
}
- batchExportByCodes(data, variables.projectCode)
- .then((res: any) => {
- downloadBlob(res, fileName)
- })
+ batchExportByCodes(data, variables.projectCode).then((res: any) => {
+ downloadBlob(res, fileName)
+ })
}
const gotoTimingManage = (row: any) => {
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.module.scss b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.module.scss
index cfaee42..7eac171 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.module.scss
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.module.scss
@@ -86,11 +86,3 @@
width: 86%;
}
}
-
-.links {
- color: #2080f0;
- text-decoration: none;
- &:hover {
- text-decoration: underline;
- }
-}
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts
index cd6616a..cf6e6e3 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts
@@ -22,6 +22,7 @@ import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import type { Router } from 'vue-router'
import { NTooltip, NIcon, NSpin } from 'naive-ui'
+import ButtonLink from '@/components/button-link'
import { RowKey } from 'naive-ui/lib/data-table/src/interface'
import {
queryProcessInstanceListPaging,
@@ -74,24 +75,18 @@ export function useTable() {
title: t('project.workflow.workflow_name'),
key: 'name',
width: 200,
- render: (_row: IWorkflowInstance) =>
+ render: (row: IWorkflowInstance) =>
h(
- 'a',
+ ButtonLink,
{
- href: 'javascript:',
- class: styles.links,
onClick: () =>
- router.push({
+ void router.push({
name: 'workflow-instance-detail',
- params: { id: _row.id },
- query: { code: _row.processDefinitionCode }
+ params: { id: row.id },
+ query: { code: row.processDefinitionCode }
})
},
- {
- default: () => {
- return _row.name
- }
- }
+ { default: () => row.name }
)
},
{
@@ -276,15 +271,14 @@ export function useTable() {
}
const deleteInstance = (id: number) => {
- deleteProcessInstanceById(id, variables.projectCode)
- .then(() => {
- window.$message.success(t('project.workflow.success'))
- if (variables.tableData.length === 1 && variables.page > 1) {
- variables.page -= 1
- }
+ deleteProcessInstanceById(id, variables.projectCode).then(() => {
+ window.$message.success(t('project.workflow.success'))
+ if (variables.tableData.length === 1 && variables.page > 1) {
+ variables.page -= 1
+ }
- getTableData()
- })
+ getTableData()
+ })
}
const batchDeleteInstance = () => {
@@ -292,32 +286,30 @@ export function useTable() {
processInstanceIds: _.join(variables.checkedRowKeys, ',')
}
- batchDeleteProcessInstanceByIds(data, variables.projectCode)
- .then(() => {
- window.$message.success(t('project.workflow.success'))
+ batchDeleteProcessInstanceByIds(data, variables.projectCode).then(() => {
+ window.$message.success(t('project.workflow.success'))
- if (
- variables.tableData.length === variables.checkedRowKeys.length &&
- variables.page > 1
- ) {
- variables.page -= 1
- }
+ if (
+ variables.tableData.length === variables.checkedRowKeys.length &&
+ variables.page > 1
+ ) {
+ variables.page -= 1
+ }
- variables.checkedRowKeys = []
- getTableData()
- })
+ variables.checkedRowKeys = []
+ getTableData()
+ })
}
/**
* operating
*/
const _upExecutorsState = (param: ExecuteReq) => {
- execute(param, variables.projectCode)
- .then(() => {
- window.$message.success(t('project.workflow.success'))
+ execute(param, variables.projectCode).then(() => {
+ window.$message.success(t('project.workflow.success'))
- getTableData()
- })
+ getTableData()
+ })
}
/**
@@ -348,14 +340,13 @@ export function useTable() {
const _countDownFn = (param: ICountDownParam) => {
const { index } = param
variables.tableData[index].buttonType = param.buttonType
- execute(param, variables.projectCode)
- .then(() => {
- variables.tableData[index].disabled = true
- window.$message.success(t('project.workflow.success'))
- _countDown(() => {
- getTableData()
- }, index)
- })
+ execute(param, variables.projectCode).then(() => {
+ variables.tableData[index].disabled = true
+ window.$message.success(t('project.workflow.success'))
+ _countDown(() => {
+ getTableData()
+ }, index)
+ })
}
return {
diff --git a/dolphinscheduler-ui-next/src/views/resource/file/table/use-table.ts b/dolphinscheduler-ui-next/src/views/resource/file/table/use-table.ts
index 7153d83..699fcbd 100644
--- a/dolphinscheduler-ui-next/src/views/resource/file/table/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/resource/file/table/use-table.ts
@@ -22,9 +22,9 @@ import { bytesToSize } from '@/utils/common'
import { useFileStore } from '@/store/file/file'
import TableAction from './table-action'
import { IRenameFile } from '../types'
+import ButtonLink from '@/components/button-link'
import type { Router } from 'vue-router'
import type { TableColumns } from 'naive-ui/es/data-table/src/interface'
-import styles from './index.module.scss'
const goSubFolder = (router: Router, item: any) => {
const fileStore = useFileStore()
@@ -55,17 +55,11 @@ export function useTable(renameResource: IRenameFile, updateList: () => void) {
width: 120,
render: (row) =>
h(
- 'a',
+ ButtonLink,
{
- href: 'javascript:',
- class: styles.links,
- onClick: () => goSubFolder(router, row)
+ onClick: () => void goSubFolder(router, row)
},
- {
- default: () => {
- return row.name
- }
- }
+ { default: () => row.name }
)
},
{ title: t('resource.file.user_name'), width: 100, key: 'user_name' },
diff --git a/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.module.scss b/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.module.scss
index 989ee0f..a786d64 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.module.scss
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.module.scss
@@ -70,12 +70,4 @@
align-items: center;
margin-top: 20px;
}
-
- .links {
- color: #2080f0;
- text-decoration: none;
- &:hover {
- text-decoration: underline;
- }
- }
}
diff --git a/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts b/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts
index 164694e..05014d7 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts
@@ -31,8 +31,8 @@ import {
deleteResource,
queryResourceById
} from '@/service/modules/resources'
+import ButtonLink from '@/components/button-link'
import { IUdfResourceParam } from './types'
-import styles from './index.module.scss'
const goSubFolder = (router: Router, item: any) => {
const fileStore = useFileStore()
@@ -75,23 +75,15 @@ export function useTable() {
title: t('resource.udf.udf_source_name'),
key: 'alias',
render: (row) => {
- if (!row.directory) {
- return row.alias
- } else {
- return h(
- 'a',
- {
- href: 'javascript:',
- class: styles.links,
- onClick: () => goSubFolder(router, row)
- },
- {
- default: () => {
- return row.alias
- }
- }
- )
- }
+ return !row.directory
+ ? row.alias
+ : h(
+ ButtonLink,
+ {
+ onClick: () => void goSubFolder(router, row)
+ },
+ { default: () => row.alias }
+ )
}
},
{
@@ -265,11 +257,10 @@ export function useTable() {
fullName
},
id
- )
- .then((res: any) => {
- fileStore.setCurrentDir(res.fullName)
- router.push({ name: 'resource-sub-manage', params: { id: res.id } })
- })
+ ).then((res: any) => {
+ fileStore.setCurrentDir(res.fullName)
+ router.push({ name: 'resource-sub-manage', params: { id: res.id } })
+ })
}
return {
diff --git a/dolphinscheduler-ui/src/sass/common/_table.scss b/dolphinscheduler-ui/src/sass/common/_table.scss
index 2f229a1..eea4e56 100644
--- a/dolphinscheduler-ui/src/sass/common/_table.scss
+++ b/dolphinscheduler-ui/src/sass/common/_table.scss
@@ -14,43 +14,43 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
- .ansfont {
+.ansfont {
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
- .as {
+.as {
display: inline-block;
font-size: 14px;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
- .as-spin {
- -webkit-animation: as-spin 2s infinite linear;
- animation: as-spin 2s infinite linear;
+.as-spin {
+ -webkit-animation: as-spin 2s infinite linear;
+ animation: as-spin 2s infinite linear;
+}
+@-webkit-keyframes as-spin {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
}
- @-webkit-keyframes as-spin {
- 0% {
- -webkit-transform: rotate(0deg);
- transform: rotate(0deg);
- }
- 100% {
- -webkit-transform: rotate(359deg);
- transform: rotate(359deg);
- }
+ 100% {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
}
- @keyframes as-spin {
- 0% {
- -webkit-transform: rotate(0deg);
- transform: rotate(0deg);
- }
- 100% {
- -webkit-transform: rotate(359deg);
- transform: rotate(359deg);
- }
+}
+@keyframes as-spin {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
}
+ 100% {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
+ }
+}
.table-box {
border-top: 1px solid #ecf3ff;
.ans-checkbox-wrapper-disabled {
@@ -71,7 +71,7 @@
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
- white-space: nowrap;
+ white-space: nowrap;
display: block;
}
button {
@@ -97,7 +97,8 @@
&:hover {
background: #ddecff;
}
- th,td{
+ th,
+ td {
&:nth-child(1) {
width: 50px;
text-align: center;
@@ -108,13 +109,13 @@
width: 60px;
text-align: center;
}
- >span {
+ > span {
font-size: 12px;
color: #555;
}
}
td {
- >span {
+ > span {
font-size: 12px;
color: #666;
}
@@ -126,21 +127,16 @@
}
}
}
- .links {
- color: #2d8cf0;
- &:hover {
- text-decoration: underline;
- }
- }
}
.table-small-model {
padding: 0 10px;
table {
width: 100%;
- tr{
+ tr {
background: #fff;
- th,td {
+ th,
+ td {
padding-left: 8px;
}
th {
@@ -149,19 +145,16 @@
font-size: 12px;
font-weight: bold;
color: #333;
- border-bottom: 2px solid #ECEDEC;
+ border-bottom: 2px solid #ecedec;
}
td {
height: 32px;
line-height: 32px;
- border-bottom: 1px solid #ECEDEC;
+ border-bottom: 1px solid #ecedec;
span {
font-size: 12px;
color: #333;
}
- .links {
- color:#2d8cf0;
- }
}
&:hover {
td {
@@ -171,10 +164,10 @@
}
}
}
-.el-table--enable-row-hover .el-table__body tr:hover>td {
+.el-table--enable-row-hover .el-table__body tr:hover > td {
background-color: #ddecff;
}
-.el-table th>.cell {
+.el-table th > .cell {
color: #555;
padding-left: 0;
padding-right: 0;
@@ -182,7 +175,7 @@
.el-table td div {
color: #666;
}
-.el-table td>.cell {
+.el-table td > .cell {
padding-left: 0;
padding-right: 0;
-}
\ No newline at end of file
+}