Commit d064d0c33699d7559b1155549fa038b7c2717593

Authored by fengwotao
1 parent 10c47882

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

Showing 1 changed file with 22 additions and 18 deletions
1 <script setup lang="ts"> 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 import { ReloadOutlined } from '@ant-design/icons-vue'; 3 import { ReloadOutlined } from '@ant-design/icons-vue';
4 import { onMounted, reactive, ref, unref } from 'vue'; 4 import { onMounted, reactive, ref, unref } from 'vue';
5 import { OrganizationIdTree, useResetOrganizationTree } from '../common/organizationIdTree'; 5 import { OrganizationIdTree, useResetOrganizationTree } from '../common/organizationIdTree';
@@ -179,12 +179,27 @@ @@ -179,12 +179,27 @@
179 <Card hoverable> 179 <Card hoverable>
180 <template #cover> 180 <template #cover>
181 <div class="h-full w-full !flex justify-center items-center text-center p-1"> 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 </div> 203 </div>
189 </template> 204 </template>
190 <template class="ant-card-actions" #actions> 205 <template class="ant-card-actions" #actions>
@@ -225,17 +240,6 @@ @@ -225,17 +240,6 @@
225 :trigger="['hover']" 240 :trigger="['hover']"
226 /> 241 />
227 </template> 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 </Card> 243 </Card>
240 </List.Item> 244 </List.Item>
241 </template> 245 </template>