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> | ... | ... |