Merge branch 'perf/configuration-center' into 'main_dev'

perf: 优化组态分页展示,增加icon区分phone和pc端

See merge request yunteng/thingskit-front!885

@@ -11,7 +11,7 @@
   import { ConfigurationCenterItemsModal } from '/@/api/configuration/center/model/configurationCenterModal';
   import { PageWrapper } from '/@/components/Page';
   import { BasicForm, useForm } from '/@/components/Form';
-  import { ConfigurationPermission, searchFormSchema } from './center.data';
+  import { ConfigurationPermission, Platform, searchFormSchema } from './center.data';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { Authority } from '/@/components/Authority';
   import { isDevMode } from '/@/utils/env';
@@ -30,6 +30,7 @@
   import { ViewType } from '../../visual/board/config/panelDetail';
   import { useRole } from '/@/hooks/business/useRole';
   import { useClipboard } from '@vueuse/core';
+  import { Icon } from '/@/components/Icon';
 
   const listColumn = ref(5);
 
@@ -187,7 +188,7 @@
 
   onMounted(() => {
     const clientHeight = document.documentElement.clientHeight;
-    const rect = getBoundingClientRect(unref(listEl)!.$el!) as DOMRect;
+    const rect = getBoundingClientRect(unref(listEl)!.$el! as HTMLElement) as DOMRect;
     // margin-top 24 height 24
     const paginationHeight = 24 + 24 + 8;
     // list pading top 8 maring-top 8 extra slot 56
@@ -322,7 +323,16 @@
                 </template>
                 <template #description>
                   <div class="truncate h-11">
-                    <div class="truncate">{{ item.organizationDTO.name }}</div>
+                    <div class="truncate flex justify-between items-center">
+                      <div>{{ item.organizationDTO.name }}</div>
+                      <Icon
+                        :icon="
+                          item.platform === Platform.PC
+                            ? 'ri:computer-line'
+                            : 'clarity:mobile-phone-solid'
+                        "
+                      />
+                    </div>
                     <div class="truncate">{{ item.remark || '' }} </div>
                   </div>
                 </template>