Commit d064d0c33699d7559b1155549fa038b7c2717593

Authored by fengwotao
1 parent 10c47882

pref:修改大屏设计器列表hover显示内容

Showing 1 changed file with 22 additions and 18 deletions
1 1 <script setup lang="ts">
2   - import { List, Card, Button, PaginationProps, Tooltip } from 'ant-design-vue';
  2 + import { List, Card, Button, PaginationProps, Tooltip, Popover } from 'ant-design-vue';
3 3 import { ReloadOutlined } from '@ant-design/icons-vue';
4 4 import { onMounted, reactive, ref, unref } from 'vue';
5 5 import { OrganizationIdTree, useResetOrganizationTree } from '../common/organizationIdTree';
... ... @@ -179,12 +179,27 @@
179 179 <Card hoverable>
180 180 <template #cover>
181 181 <div class="h-full w-full !flex justify-center items-center text-center p-1">
182   - <img
183   - class="w-full h-36"
184   - alt="example"
185   - :src="item.thumbnail || configurationSrc"
186   - @click="handlePreview(item)"
187   - />
  182 + <Popover title="大屏设计器内容" trigger="hover">
  183 + <template #content>
  184 + <Card.Meta>
  185 + <template #title>
  186 + <span class="truncate">{{ item.name }}</span>
  187 + </template>
  188 + <template #description>
  189 + <div class="truncate h-11">
  190 + <div class="truncate">{{ item.organizationDTO.name }}</div>
  191 + <div class="truncate">{{ item.remark || '' }} </div>
  192 + </div>
  193 + </template>
  194 + </Card.Meta>
  195 + </template>
  196 + <img
  197 + class="w-full h-36"
  198 + alt="example"
  199 + :src="item.thumbnail || configurationSrc"
  200 + @click="handlePreview(item)"
  201 + />
  202 + </Popover>
188 203 </div>
189 204 </template>
190 205 <template class="ant-card-actions" #actions>
... ... @@ -225,17 +240,6 @@
225 240 :trigger="['hover']"
226 241 />
227 242 </template>
228   - <Card.Meta>
229   - <template #title>
230   - <span class="truncate">{{ item.name }}</span>
231   - </template>
232   - <template #description>
233   - <div class="truncate h-11">
234   - <div class="truncate">{{ item.organizationDTO.name }}</div>
235   - <div class="truncate">{{ item.remark || '' }} </div>
236   - </div>
237   - </template>
238   - </Card.Meta>
239 243 </Card>
240 244 </List.Item>
241 245 </template>
... ...