Commit 89dc06b50d03f34a9c5ad7706391d7f304780cfb
1 parent
74b39748
perf: adjust TextComponent font size
Showing
6 changed files
with
45 additions
and
17 deletions
| @@ -92,13 +92,15 @@ | @@ -92,13 +92,15 @@ | ||
| 92 | placement="topLeft" | 92 | placement="topLeft" |
| 93 | :title="dateUtil(props?.value?.updateTime || new Date()).format(DEFAULT_DATE_FORMAT)" | 93 | :title="dateUtil(props?.value?.updateTime || new Date()).format(DEFAULT_DATE_FORMAT)" |
| 94 | > | 94 | > |
| 95 | - <span>更新时间:</span> | ||
| 96 | - <span | 95 | + <div |
| 97 | :style="{ fontSize: fontSize({ radio: getRadio, basic: 12, max: 16 }) }" | 96 | :style="{ fontSize: fontSize({ radio: getRadio, basic: 12, max: 16 }) }" |
| 98 | class="truncate" | 97 | class="truncate" |
| 99 | > | 98 | > |
| 100 | - {{ dateUtil(props?.value?.updateTime || new Date()).format(DEFAULT_DATE_FORMAT) }} | ||
| 101 | - </span> | 99 | + <span class="mr-1">更新时间:</span> |
| 100 | + <span class="truncate"> | ||
| 101 | + {{ dateUtil(props?.value?.updateTime || new Date()).format(DEFAULT_DATE_FORMAT) }} | ||
| 102 | + </span> | ||
| 103 | + </div> | ||
| 102 | </Tooltip> | 104 | </Tooltip> |
| 103 | </div> | 105 | </div> |
| 104 | </div> | 106 | </div> |
| 1 | <script lang="ts" setup> | 1 | <script lang="ts" setup> |
| 2 | - import { MoreOutlined, LineChartOutlined } from '@ant-design/icons-vue'; | 2 | + import { MoreOutlined } from '@ant-design/icons-vue'; |
| 3 | import { DropMenu } from '/@/components/Dropdown'; | 3 | import { DropMenu } from '/@/components/Dropdown'; |
| 4 | import Dropdown from '/@/components/Dropdown/src/Dropdown.vue'; | 4 | import Dropdown from '/@/components/Dropdown/src/Dropdown.vue'; |
| 5 | import { Tooltip } from 'ant-design-vue'; | 5 | import { Tooltip } from 'ant-design-vue'; |
| 6 | import SvgIcon from '/@/components/Icon/src/SvgIcon.vue'; | 6 | import SvgIcon from '/@/components/Icon/src/SvgIcon.vue'; |
| 7 | - import { MoreActionEvent } from '../../config/config'; | 7 | + import { isBataBoardSharePage, MoreActionEvent } from '../../config/config'; |
| 8 | import { computed } from '@vue/reactivity'; | 8 | import { computed } from '@vue/reactivity'; |
| 9 | import { usePermission } from '/@/hooks/web/usePermission'; | 9 | import { usePermission } from '/@/hooks/web/usePermission'; |
| 10 | import { DataSource } from '/@/api/dataBoard/model'; | 10 | import { DataSource } from '/@/api/dataBoard/model'; |
| 11 | + import { useRoute } from 'vue-router'; | ||
| 11 | 12 | ||
| 12 | const emit = defineEmits(['action']); | 13 | const emit = defineEmits(['action']); |
| 13 | const props = defineProps<{ | 14 | const props = defineProps<{ |
| @@ -41,6 +42,12 @@ | @@ -41,6 +42,12 @@ | ||
| 41 | return basicMenu; | 42 | return basicMenu; |
| 42 | }); | 43 | }); |
| 43 | 44 | ||
| 45 | + const ROUTE = useRoute(); | ||
| 46 | + | ||
| 47 | + const getIsSharePage = computed(() => { | ||
| 48 | + return isBataBoardSharePage(ROUTE.path); | ||
| 49 | + }); | ||
| 50 | + | ||
| 44 | const handleMenuEvent = (event: DropMenu) => { | 51 | const handleMenuEvent = (event: DropMenu) => { |
| 45 | emit('action', event, props.id); | 52 | emit('action', event, props.id); |
| 46 | }; | 53 | }; |
| @@ -72,7 +79,7 @@ | @@ -72,7 +79,7 @@ | ||
| 72 | @menu-event="handleMenuEvent" | 79 | @menu-event="handleMenuEvent" |
| 73 | > | 80 | > |
| 74 | <Tooltip title="更多"> | 81 | <Tooltip title="更多"> |
| 75 | - <MoreOutlined class="transform rotate-90 cursor-pointer" /> | 82 | + <MoreOutlined v-if="!getIsSharePage" class="transform rotate-90 cursor-pointer" /> |
| 76 | </Tooltip> | 83 | </Tooltip> |
| 77 | </Dropdown> | 84 | </Dropdown> |
| 78 | </div> | 85 | </div> |
| @@ -9,10 +9,21 @@ export enum MoreActionEvent { | @@ -9,10 +9,21 @@ export enum MoreActionEvent { | ||
| 9 | export const DEFAULT_WIDGET_WIDTH = 6; | 9 | export const DEFAULT_WIDGET_WIDTH = 6; |
| 10 | export const DEFAULT_WIDGET_HEIGHT = 6; | 10 | export const DEFAULT_WIDGET_HEIGHT = 6; |
| 11 | 11 | ||
| 12 | -export const DATA_BOARD_SHARE_URL = (boardId = ':boardId', tenantId = ':tenantId') => | ||
| 13 | - `/data/board/share/${boardId}/${tenantId}`; | 12 | +export const DATA_BOARD_SHARE_URL = ( |
| 13 | + boardId = ':boardId', | ||
| 14 | + tenantId = ':tenantId', | ||
| 15 | + name = ':boardName?' | ||
| 16 | +) => `/data/board/share/${boardId}/${tenantId}/${name}`; | ||
| 14 | 17 | ||
| 15 | export const isBataBoardSharePage = (url: string) => { | 18 | export const isBataBoardSharePage = (url: string) => { |
| 16 | const reg = /^\/data\/board\/share/g; | 19 | const reg = /^\/data\/board\/share/g; |
| 17 | return reg.test(url); | 20 | return reg.test(url); |
| 18 | }; | 21 | }; |
| 22 | + | ||
| 23 | +export const encode = (string: string) => { | ||
| 24 | + return encodeURIComponent(string); | ||
| 25 | +}; | ||
| 26 | + | ||
| 27 | +export const decode = (string: string) => { | ||
| 28 | + return decodeURIComponent(string); | ||
| 29 | +}; |
| @@ -9,6 +9,7 @@ | @@ -9,6 +9,7 @@ | ||
| 9 | import { useModalInner } from '/@/components/Modal'; | 9 | import { useModalInner } from '/@/components/Modal'; |
| 10 | import { DataBoardLayoutInfo } from '../../types/type'; | 10 | import { DataBoardLayoutInfo } from '../../types/type'; |
| 11 | import { useMessage } from '/@/hooks/web/useMessage'; | 11 | import { useMessage } from '/@/hooks/web/useMessage'; |
| 12 | + import { decode } from '../../config/config'; | ||
| 12 | 13 | ||
| 13 | interface DataComponentRouteParams extends RouteParams { | 14 | interface DataComponentRouteParams extends RouteParams { |
| 14 | id: string; | 15 | id: string; |
| @@ -21,7 +22,7 @@ | @@ -21,7 +22,7 @@ | ||
| 21 | const { createMessage } = useMessage(); | 22 | const { createMessage } = useMessage(); |
| 22 | 23 | ||
| 23 | const boardId = computed(() => { | 24 | const boardId = computed(() => { |
| 24 | - return (ROUTE.params as DataComponentRouteParams).id; | 25 | + return decode((ROUTE.params as DataComponentRouteParams).boardId as string); |
| 25 | }); | 26 | }); |
| 26 | 27 | ||
| 27 | const frontId = ref(''); | 28 | const frontId = ref(''); |
| @@ -9,6 +9,7 @@ | @@ -9,6 +9,7 @@ | ||
| 9 | import DataBindModal from './components/DataBindModal.vue'; | 9 | import DataBindModal from './components/DataBindModal.vue'; |
| 10 | import { useModal } from '/@/components/Modal'; | 10 | import { useModal } from '/@/components/Modal'; |
| 11 | import { | 11 | import { |
| 12 | + decode, | ||
| 12 | DEFAULT_WIDGET_HEIGHT, | 13 | DEFAULT_WIDGET_HEIGHT, |
| 13 | DEFAULT_WIDGET_WIDTH, | 14 | DEFAULT_WIDGET_WIDTH, |
| 14 | isBataBoardSharePage, | 15 | isBataBoardSharePage, |
| @@ -41,12 +42,16 @@ | @@ -41,12 +42,16 @@ | ||
| 41 | const { createMessage, createConfirm } = useMessage(); | 42 | const { createMessage, createConfirm } = useMessage(); |
| 42 | 43 | ||
| 43 | const getBoardId = computed(() => { | 44 | const getBoardId = computed(() => { |
| 44 | - return (ROUTE.params as { id: string }).id; | 45 | + return decode((ROUTE.params as { boardId: string }).boardId); |
| 46 | + }); | ||
| 47 | + | ||
| 48 | + const getDataBoardName = computed(() => { | ||
| 49 | + return decode((ROUTE.params as { boardName: string }).boardName || ''); | ||
| 45 | }); | 50 | }); |
| 46 | 51 | ||
| 47 | const getSharePageParams = computed(() => { | 52 | const getSharePageParams = computed(() => { |
| 48 | const { boardId, tenantId } = ROUTE.params as { boardId: string; tenantId: string }; | 53 | const { boardId, tenantId } = ROUTE.params as { boardId: string; tenantId: string }; |
| 49 | - return { boardId, tenantId }; | 54 | + return { boardId: decode(boardId), tenantId: decode(tenantId) }; |
| 50 | }); | 55 | }); |
| 51 | 56 | ||
| 52 | const getIsSharePage = computed(() => { | 57 | const getIsSharePage = computed(() => { |
| @@ -303,7 +308,7 @@ | @@ -303,7 +308,7 @@ | ||
| 303 | <template #title> | 308 | <template #title> |
| 304 | <div class="flex items-center"> | 309 | <div class="flex items-center"> |
| 305 | <RollbackOutlined v-if="!getIsSharePage" class="mr-3" @click="handleBack" /> | 310 | <RollbackOutlined v-if="!getIsSharePage" class="mr-3" @click="handleBack" /> |
| 306 | - <span>看板名称</span> | 311 | + <span>{{ getDataBoardName }}</span> |
| 307 | </div> | 312 | </div> |
| 308 | </template> | 313 | </template> |
| 309 | <template #extra> | 314 | <template #extra> |
| @@ -18,6 +18,7 @@ | @@ -18,6 +18,7 @@ | ||
| 18 | import Authority from '/@/components/Authority/src/Authority.vue'; | 18 | import Authority from '/@/components/Authority/src/Authority.vue'; |
| 19 | import { computed } from '@vue/reactivity'; | 19 | import { computed } from '@vue/reactivity'; |
| 20 | import { usePermission } from '/@/hooks/web/usePermission'; | 20 | import { usePermission } from '/@/hooks/web/usePermission'; |
| 21 | + import { encode } from './config/config'; | ||
| 21 | 22 | ||
| 22 | const ListItem = List.Item; | 23 | const ListItem = List.Item; |
| 23 | const router = useRouter(); | 24 | const router = useRouter(); |
| @@ -50,14 +51,14 @@ | @@ -50,14 +51,14 @@ | ||
| 50 | pageSize.value = size; | 51 | pageSize.value = size; |
| 51 | } | 52 | } |
| 52 | 53 | ||
| 53 | - const createShareUrl = (boardId: string, tenantId: string) => { | 54 | + const createShareUrl = (boardId: string, tenantId: string, name: string) => { |
| 54 | const { origin } = location; | 55 | const { origin } = location; |
| 55 | - return `${origin}${DATA_BOARD_SHARE_URL(boardId, tenantId)}`; | 56 | + return `${origin}${DATA_BOARD_SHARE_URL(encode(boardId), encode(tenantId), encode(name))}`; |
| 56 | }; | 57 | }; |
| 57 | 58 | ||
| 58 | const { clipboardRef } = useCopyToClipboard(); | 59 | const { clipboardRef } = useCopyToClipboard(); |
| 59 | const handleCopyShareUrl = (record: DataBoardRecord) => { | 60 | const handleCopyShareUrl = (record: DataBoardRecord) => { |
| 60 | - clipboardRef.value = createShareUrl(record.id, record.tenantId); | 61 | + clipboardRef.value = createShareUrl(record.id, record.tenantId, record.name); |
| 61 | unref(clipboardRef) ? createMessage.success('复制成功') : createMessage.error('未找到分享链接'); | 62 | unref(clipboardRef) ? createMessage.success('复制成功') : createMessage.error('未找到分享链接'); |
| 62 | }; | 63 | }; |
| 63 | 64 | ||
| @@ -133,7 +134,8 @@ | @@ -133,7 +134,8 @@ | ||
| 133 | 134 | ||
| 134 | const handleViewBoard = (record: DataBoardRecord) => { | 135 | const handleViewBoard = (record: DataBoardRecord) => { |
| 135 | const hasDetailPermission = hasPermission('api:yt:dataBoard:detail'); | 136 | const hasDetailPermission = hasPermission('api:yt:dataBoard:detail'); |
| 136 | - if (hasDetailPermission) router.push(`/data/board/detail/${record.id}`); | 137 | + if (hasDetailPermission) |
| 138 | + router.push(`/data/board/detail/${encode(record.id)}/${encode(record.name)}`); | ||
| 137 | }; | 139 | }; |
| 138 | 140 | ||
| 139 | const handlePagenationPosition = () => { | 141 | const handlePagenationPosition = () => { |