Commit 732fb23bad9eda7ccc1ac74811b6b04292f3c6d3
Merge branch 'perf/device-detail' into 'main_dev'
perf: 优化设备详情名称过长,新增tooltip提示 See merge request yunteng/thingskit-front!935
Showing
1 changed file
with
15 additions
and
3 deletions
| ... | ... | @@ -5,8 +5,8 @@ import { DeviceTypeEnum } from '/@/api/device/model/deviceModel'; | 
| 5 | 5 | import { getCustomerList } from '/@/api/device/deviceManager'; | 
| 6 | 6 | import { DescItem } from '/@/components/Description/index'; | 
| 7 | 7 | import moment from 'moment'; | 
| 8 | -import { h } from 'vue'; | |
| 9 | -import { Button } from 'ant-design-vue'; | |
| 8 | +import { CSSProperties, h } from 'vue'; | |
| 9 | +import { Button, Tooltip } from 'ant-design-vue'; | |
| 10 | 10 | import { TypeEnum } from './data'; | 
| 11 | 11 | import { PageEnum } from '/@/enums/pageEnum'; | 
| 12 | 12 | import { useGo } from '/@/hooks/web/usePage'; | 
| ... | ... | @@ -24,12 +24,19 @@ export const descSchema = (emit: EmitType): DescItem[] => { | 
| 24 | 24 | field: 'name', | 
| 25 | 25 | label: '设备名称', | 
| 26 | 26 | render(val, data: Record<'alias' | 'name', string>) { | 
| 27 | - return h('span', {}, data.alias || val); | |
| 27 | + return h(Tooltip, { title: data.alias || val }, () => | |
| 28 | + h('span', { style: { cursor: 'pointer' } as CSSProperties }, data.alias || val) | |
| 29 | + ); | |
| 28 | 30 | }, | 
| 29 | 31 | }, | 
| 30 | 32 | { | 
| 31 | 33 | field: 'label', | 
| 32 | 34 | label: '设备标签', | 
| 35 | + render(val) { | |
| 36 | + return h(Tooltip, { title: val }, () => | |
| 37 | + h('span', { style: { cursor: 'pointer' } as CSSProperties }, val) | |
| 38 | + ); | |
| 39 | + }, | |
| 33 | 40 | }, | 
| 34 | 41 | { | 
| 35 | 42 | field: 'deviceProfile.name', | 
| ... | ... | @@ -79,6 +86,11 @@ export const descSchema = (emit: EmitType): DescItem[] => { | 
| 79 | 86 | field: 'description', | 
| 80 | 87 | label: '描述', | 
| 81 | 88 | // span: 2, | 
| 89 | + render(val) { | |
| 90 | + return h(Tooltip, { title: val }, () => | |
| 91 | + h('span', { style: { cursor: 'pointer' } as CSSProperties }, val) | |
| 92 | + ); | |
| 93 | + }, | |
| 82 | 94 | }, | 
| 83 | 95 | ]; | 
| 84 | 96 | }; | ... | ... |