Merge branch 'fix/DEFECT-2588' into 'main_dev'

fix: 云端产品和设备添加是否是边端产品的提示

See merge request yunteng/thingskit-front!1436

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1722937185750" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5222" id="mx_n_1722937185750" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M0 0v1024a1024 1024 0 0 1 1024-1024H0z" p-id="5223" fill="#1890ff"></path></svg>

@@ -6,6 +6,7 @@ import { deviceProfile } from '/@/api/device/deviceManager';
 import { h } from 'vue';
 import { Tag, Tooltip } from 'ant-design-vue';
 import { handeleCopy } from '../../profiles/step/topic';
+import edgefornt from '/@/assets/icons/edgefornt.svg';
 
 export enum DeviceListAuthEnum {
   /**
@@ -84,8 +85,9 @@ export const columns: BasicColumn[] = [
     title: '别名/设备名称',
     width: 210,
     slots: { customRender: 'name', title: 'deviceTitle' },
+    className: 'device-name-edge',
     customRender: ({ record }) => {
-      return h('div', { style: 'display:flex;flex-direction:column' }, [
+      return h('div', { class: 'py-3 px-3.5' }, [
         record.alias &&
           h(
             'div',
@@ -118,6 +120,19 @@ export const columns: BasicColumn[] = [
             () => `${record.name}`
           )
         ),
+        record.isEdge
+          ? h('div', { class: 'absolute top-0 left-0', fill: '#1890ff' }, [
+              h('img', { src: edgefornt }),
+              h(
+                'span',
+                {
+                  class:
+                    'absolute top-0.5 left-0.5 text-light-50 transform -rotate-45 translate-y-0',
+                },
+                '边'
+              ),
+            ])
+          : '',
       ]);
     },
   },

@@ -711,4 +711,11 @@
       border-right: 30px solid transparent;
     }
   }
+
+  .device-name-edge {
+    width: 100%;
+    height: 100%;
+    padding: 0 !important;
+    position: relative;
+  }
 </style>

@@ -24,6 +24,7 @@
   import { BasicCardList, useCardList } from '/@/components/CardList';
   import { useRoute } from 'vue-router';
   import { ref } from 'vue';
+  import edgefornt from '/@/assets/icons/edgefornt.svg';
 
   defineProps<{
     mode: EnumTableCardMode;
@@ -154,7 +155,7 @@
       <template #renderItem="{ item }: BasicCardListRenderItem<ProfileRecord>">
         <Card hoverable>
           <template #cover>
-            <div class="h-full w-full !flex justify-center items-center text-center p-1">
+            <div class="h-full w-full !flex justify-center items-center text-center p-1 relative">
               <Image
                 @click.stop
                 wrapper-class-name="!w-32 !h-32 !flex !items-center overflow-hidden"
@@ -162,6 +163,13 @@
                 placeholder
                 :fallback="IMAGE_FALLBACK"
               />
+              <div v-if="item.isEdge" class="absolute top-0 left-0">
+                <img :src="edgefornt" />
+                <span
+                  class="absolute top-0 left-0 text-light-50 transform -rotate-45 translate-y-1 translate-x-0.5"
+                  >边</span
+                >
+              </div>
             </div>
           </template>
           <template class="ant-card-actions" #actions>