Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | 7x 7x 7x 7x | <template> <div :class="$style.root" :selected="parentVM.multiple ? currentSelected : isSelected" :readonly="parentVM.readonly" :readonly-mode="parentVM.readonlyMode" :disabled="disabled || parentVM.disabled" @click="select" :style="{ width: parentVM.itemWidth }" v-ellipsis-title="parentVM.showTitle" :designer="$env.VUE_APP_DESIGNER" vusion-slot-name="item"> <slot></slot> </div> </template> <script> import { UListViewItem } from '../u-list-view.vue'; export default { name: 'u-grid-view-item', parentName: 'u-grid-view', groupName: 'u-grid-view-group', extends: UListViewItem, }; </script> <style module> @import '../u-list-view.vue/item.css'; .root { display: inline-block; vertical-align: middle; } .root:hover { background: none; } .root[selected] { background: none; color: initial; } /* 选中后卡片字体会变白,而卡片的背景是白色的,导致字看不见 */ .root[selected] [class^="u-card__"] { color: var(--color-base); } .root[designer]{ position: relative; } .root[designer] + .root[designer]:after{ content: ''; position: absolute; display: block; background: rgba(255,255,255,0.8); top: 0; left: 0; bottom: 0; right: 0; } </style> |