Commit 0884dff38e1248078b3931d3e919070bf8cd5992
1 parent
d73ce170
feat: data board detail add back button
Showing
4 changed files
with
44 additions
and
15 deletions
| ... | ... | @@ -18,6 +18,7 @@ |
| 18 | 18 | DEFAULT_DATE_FORMAT, |
| 19 | 19 | fontSize, |
| 20 | 20 | } from '../../detail/config/util'; |
| 21 | + import { Tooltip } from 'ant-design-vue'; | |
| 21 | 22 | |
| 22 | 23 | const props = defineProps({ |
| 23 | 24 | add: { |
| ... | ... | @@ -90,8 +91,13 @@ |
| 90 | 91 | class="text-xs text-center text-gray-400 truncate" |
| 91 | 92 | :style="{ fontSize: fontSize({ radio: getRadio, basic: 12, max: 16 }) }" |
| 92 | 93 | > |
| 93 | - <span class="mr-2">更新时间:</span> | |
| 94 | - <span> {{ props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT) }}</span> | |
| 94 | + <Tooltip | |
| 95 | + placement="topLeft" | |
| 96 | + :title="props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT)" | |
| 97 | + > | |
| 98 | + <span class="mr-2">更新时间:</span> | |
| 99 | + <span> {{ props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT) }}</span> | |
| 100 | + </Tooltip> | |
| 95 | 101 | </div> |
| 96 | 102 | </div> |
| 97 | 103 | </div> | ... | ... |
| 1 | 1 | <script lang="ts" setup> |
| 2 | 2 | import { computed } from 'vue'; |
| 3 | - import { Space } from 'ant-design-vue'; | |
| 3 | + import { Space, Tooltip } from 'ant-design-vue'; | |
| 4 | 4 | import type { DigitalDashBoardLayout, DigitalDashBoardValue } from './digitalDashBoard.config'; |
| 5 | 5 | import { dateUtil } from '/@/utils/dateUtil'; |
| 6 | 6 | import { |
| ... | ... | @@ -89,8 +89,13 @@ |
| 89 | 89 | class="text-center mt-1 text-gray-400 text-xs truncate" |
| 90 | 90 | :style="{ fontSize: fontSize({ radio: getRadio, basic: 12, max: 16 }) }" |
| 91 | 91 | > |
| 92 | - <span class="mr-1">更新时间:</span> | |
| 93 | - <span>{{ props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT) }}</span> | |
| 92 | + <Tooltip | |
| 93 | + placement="topLeft" | |
| 94 | + :title="props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT)" | |
| 95 | + > | |
| 96 | + <span class="mr-1">更新时间:</span> | |
| 97 | + <span>{{ props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT) }}</span> | |
| 98 | + </Tooltip> | |
| 94 | 99 | </div> |
| 95 | 100 | </div> |
| 96 | 101 | <div></div> | ... | ... |
| 1 | 1 | <script lang="ts" setup> |
| 2 | - import { computed } from '@vue/reactivity'; | |
| 3 | - import { Statistic } from 'ant-design-vue'; | |
| 4 | - import { fontSize, RadioRecord, DEFAULT_RADIO_RECORD } from '../../detail/config/util'; | |
| 2 | + import { computed } from 'vue'; | |
| 3 | + import { Statistic, Tooltip } from 'ant-design-vue'; | |
| 4 | + import { | |
| 5 | + fontSize, | |
| 6 | + RadioRecord, | |
| 7 | + DEFAULT_RADIO_RECORD, | |
| 8 | + DEFAULT_DATE_FORMAT, | |
| 9 | + } from '../../detail/config/util'; | |
| 5 | 10 | import type { TextComponentLayout, TextComponentValue } from './config'; |
| 6 | 11 | import { SvgIcon } from '/@/components/Icon'; |
| 12 | + import { dateUtil } from '/@/utils/dateUtil'; | |
| 7 | 13 | const props = defineProps({ |
| 8 | 14 | layout: { |
| 9 | 15 | type: Object as PropType<TextComponentLayout>, |
| ... | ... | @@ -82,12 +88,18 @@ |
| 82 | 88 | </div> |
| 83 | 89 | </div> |
| 84 | 90 | <div v-if="getShowUpdate" class="text-center text-xs text-gray-400 truncate"> |
| 85 | - <span | |
| 86 | - :style="{ fontSize: fontSize({ radio: getRadio, basic: 12, max: 16 }) }" | |
| 87 | - class="truncate" | |
| 88 | - > | |
| 89 | - 更新时间: {{ props.value.updateTime }}</span | |
| 91 | + <Tooltip | |
| 92 | + placement="topLeft" | |
| 93 | + :title="props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT)" | |
| 90 | 94 | > |
| 95 | + <span>更新时间:</span> | |
| 96 | + <span | |
| 97 | + :style="{ fontSize: fontSize({ radio: getRadio, basic: 12, max: 16 }) }" | |
| 98 | + class="truncate" | |
| 99 | + > | |
| 100 | + {{ props.value.updateTime || dateUtil().format(DEFAULT_DATE_FORMAT) }} | |
| 101 | + </span> | |
| 102 | + </Tooltip> | |
| 91 | 103 | </div> |
| 92 | 104 | </div> |
| 93 | 105 | </template> | ... | ... |
| ... | ... | @@ -14,7 +14,7 @@ |
| 14 | 14 | getDataComponent, |
| 15 | 15 | updateDataBoardLayout, |
| 16 | 16 | } from '/@/api/dataBoard'; |
| 17 | - import { useRoute } from 'vue-router'; | |
| 17 | + import { useRoute, useRouter } from 'vue-router'; | |
| 18 | 18 | import { computed, unref } from '@vue/reactivity'; |
| 19 | 19 | import { DataComponentRecord, DataSource, Layout } from '/@/api/dataBoard/model'; |
| 20 | 20 | import { frontComponentMap } from './config/help'; |
| ... | ... | @@ -25,6 +25,8 @@ |
| 25 | 25 | |
| 26 | 26 | const ROUTE = useRoute(); |
| 27 | 27 | |
| 28 | + const ROUTER = useRouter(); | |
| 29 | + | |
| 28 | 30 | const { createMessage, createConfirm } = useMessage(); |
| 29 | 31 | const getBoardId = computed(() => { |
| 30 | 32 | return (ROUTE.params as { id: string }).id; |
| ... | ... | @@ -43,6 +45,10 @@ |
| 43 | 45 | const defaultWidth = 6; |
| 44 | 46 | const defaultHeight = 6; |
| 45 | 47 | |
| 48 | + const handleBack = () => { | |
| 49 | + ROUTER.go(-1); | |
| 50 | + }; | |
| 51 | + | |
| 46 | 52 | function updateSize(i: string, _newH: number, _newW: number, newHPx: number, newWPx: number) { |
| 47 | 53 | newWPx = Number(newWPx); |
| 48 | 54 | newHPx = Number(newHPx); |
| ... | ... | @@ -243,7 +249,7 @@ |
| 243 | 249 | |
| 244 | 250 | <template> |
| 245 | 251 | <section class="bg-light-50 flex flex-col overflow-hidden h-full w-full"> |
| 246 | - <PageHeader title="水电表看板"> | |
| 252 | + <PageHeader title="水电表看板" @back="handleBack"> | |
| 247 | 253 | <template #extra> |
| 248 | 254 | <Button type="primary" @click="handleOpenCreatePanel">创建组件</Button> |
| 249 | 255 | </template> | ... | ... |