diff --git a/src/components/card/styles/thing-card.scss b/src/components/card/styles/thing-card.scss
index 0aacfbf8c..2503716b4 100644
--- a/src/components/card/styles/thing-card.scss
+++ b/src/components/card/styles/thing-card.scss
@@ -42,7 +42,7 @@
   cursor: pointer;
 }
 
-.thing-content {
+.thing-card-content {
   height: 100%;
   display: flex;
   flex-direction: column;
@@ -106,7 +106,7 @@
   border-bottom: 1px solid #fbc4c4;
 }
 
-.thing-body {
+.thing-card__body {
   display: flex;
   flex-direction: column;
 
@@ -114,7 +114,7 @@
     padding-inline-start: 5px;
   }
 
-  .thing-body-content {
+  .thing-card-body-content {
     display: flex;
     justify-content: center;
 
@@ -196,14 +196,14 @@
   }
 }
 
-.thing__footer {
+.thing-card__footer {
   height: 20px;
   margin-top: 2px;
   display: flex;
   justify-content: space-between;
   border-top: 1px solid #dcdfe6;
 
-  .thing__footer-title {
+  .thing-card-footer-title {
     text-align: center;
     font-size: 14px;
     font-weight: bold;
diff --git a/src/views/application/ApplicationCard.vue b/src/views/application/ApplicationCard.vue
index 19c5d5892..798fd01f1 100644
--- a/src/views/application/ApplicationCard.vue
+++ b/src/views/application/ApplicationCard.vue
@@ -1,17 +1,17 @@
 <template>
     <div class="thing-card thing-card-application">
         <el-card shadow="hover">
-            <div class="thing-content">
-                <div class="thing-body">
-                    <div class="thing-body-content">
-                        <div class="thing-body-content-application-icon" @click="show()">
+            <div class="thing-card-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
+                        <div class="thing-card-body-content-application-icon" @click="show()">
                             <el-avatar shape="square" :size="120" fit="fill" :src="icon"></el-avatar>
                         </div>
                     </div>
                 </div>
-                <div class="thing__footer">
-                    <div class="thing__footer-title">
-                        <span class="thing-body-content-application-name">{{name}}</span>
+                <div class="thing-card__footer">
+                    <div class="thing-card-footer-title">
+                        <span class="thing-card-body-content-application-name">{{name}}</span>
                     </div>
                 </div>
             </div>
@@ -65,7 +65,7 @@
         }
     }
 
-    .thing-body-content-application-icon {
+    .thing-card-body-content-application-icon {
         width: 120px;
         cursor: pointer;
 
@@ -74,7 +74,7 @@
         }
     }
 
-    .thing-body-content-application-name {
+    .thing-card-body-content-application-name {
         display: block;
         width: 120px;
         overflow: hidden;
diff --git a/src/views/dashboard/DashboardCard.vue b/src/views/dashboard/DashboardCard.vue
index fbf1533ac..b25894272 100644
--- a/src/views/dashboard/DashboardCard.vue
+++ b/src/views/dashboard/DashboardCard.vue
@@ -1,16 +1,16 @@
 <template>
     <div class="thing-card thing-card-dashboard">
         <el-card shadow="hover">
-            <div class="thing-content">
-                <div class="thing-body">
-                    <div class="thing-body-content">
+            <div class="thing-card-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <div class="thing-body-content-dashboard-snapshot" @click="show()">
                             <img :src="snapshot">
                         </div>
                     </div>
                 </div>
-                <div class="thing__footer">
-                    <div class="thing__footer-title">
+                <div class="thing-card__footer">
+                    <div class="thing-card-footer-title">
                         <span class="thing-body-content-dashboard-name">{{name}}</span>
                     </div>
                 </div>
diff --git a/src/views/device/DeviceCard.vue b/src/views/device/DeviceCard.vue
index 675ce5a6f..465c0c110 100644
--- a/src/views/device/DeviceCard.vue
+++ b/src/views/device/DeviceCard.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="thing-card">
         <el-card shadow="hover">
-            <div class="thing-content">
+            <div class="thing-card-content">
                 <div class="thing-header" v-bind:class="{'header-enable':data.enable,'header-disable':!data.enable}">
                     <div class="thing-icon">
                         <img :src="icon" :alt="data.name">
@@ -15,15 +15,15 @@
                         <el-tag v-else type="info" effect="plain">离线</el-tag>
                     </div>
                 </div>
-                <div class="thing-body">
-                    <div class="thing-body-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <ul class="thing-body-content-item">
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-s-promotion"/> 所属驱动: </span>{{driver(data.driverId)}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-tickets"/> 包含模板: </span>{{data.profileIds?profile(data.profileIds):''}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-coin"/> 存储类型: </span>{{data.multi?'结构数据':'单点数据'}}</li>
                         </ul>
                     </div>
-                    <div title="设备描述信息" class="thing-body-content">
+                    <div title="设备描述信息" class="thing-card-body-content">
                         <p class="thing-content-nowrap-description">{{data.description?data.description:'无描述信息'}}</p>
                     </div>
                     <div class="thing-body-content-time">
@@ -35,7 +35,7 @@
                         </ul>
                     </div>
                 </div>
-                <div v-if="!embedded" class="thing__footer">
+                <div v-if="!embedded" class="thing-card__footer">
                     <div class="thing-copy-id">
                         <el-tooltip class="item" effect="dark" placement="top" v-if="data.id" content="点击复制ID">
                             <el-button class="button" type="text" icon="el-icon-document-copy" v-on:click="copyId(data.id)">{{data.id}}</el-button>
diff --git a/src/views/driver/DriverCard.vue b/src/views/driver/DriverCard.vue
index 113e59f94..d19a93c17 100644
--- a/src/views/driver/DriverCard.vue
+++ b/src/views/driver/DriverCard.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="thing-card">
         <el-card shadow="hover">
-            <div class="thing-content">
+            <div class="thing-card-content">
                 <div class="thing-header" v-bind:class="{'header-enable':data.enable,'header-disable':!data.enable}">
                     <div class="thing-icon"><img :src="icon" :alt="data.name"></div>
                     <div class="thing-name thing-content-nowrap-title" @click="copyId(data.id)">{{data.name}}</div>
@@ -14,15 +14,15 @@
                         <el-tag v-else type="info" effect="plain">离线</el-tag>
                     </div>
                 </div>
-                <div class="thing-body">
-                    <div class="thing-body-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <ul class="thing-body-content-item">
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-connection"/> 端口: </span>{{data.port}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-monitor"/> 主机: </span>{{data.host}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-s-promotion"/> 驱动服务: </span>{{data.serviceName}}</li>
                         </ul>
                     </div>
-                    <div title="驱动描述信息" class="thing-body-content">
+                    <div title="驱动描述信息" class="thing-card-body-content">
                         <p class="thing-content-nowrap-description">{{data.description?data.description:'无描述信息'}}</p>
                     </div>
                     <div class="thing-body-content-time">
@@ -34,7 +34,7 @@
                         </ul>
                     </div>
                 </div>
-                <div class="thing__footer">
+                <div class="thing-card__footer">
                     <div class="thing-copy-id">
                         <el-tooltip class="item" effect="dark" placement="top" v-if="data.id" content="点击复制ID">
                             <el-button class="button" type="text" icon="el-icon-document-copy" v-on:click="copyId(data.id)">{{data.id}}</el-button>
diff --git a/src/views/gateway/GatewayCard.vue b/src/views/gateway/GatewayCard.vue
index 0e5cae730..1609d82c2 100644
--- a/src/views/gateway/GatewayCard.vue
+++ b/src/views/gateway/GatewayCard.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="thing-card">
         <el-card shadow="hover">
-            <div class="thing-content">
+            <div class="thing-card-content">
                 <div class="thing-header" v-bind:class="{'header-enable':data.enable,'header-disable':!data.enable}">
                     <div class="thing-icon"><img :src="icon" :alt="data.name"></div>
                     <div class="thing-name thing-content-nowrap-title" @click="copyId(data.id)">{{data.name}}</div>
@@ -14,15 +14,15 @@
                         <el-tag v-else type="info" effect="plain">离线</el-tag>
                     </div>
                 </div>
-                <div class="thing-body">
-                    <div class="thing-body-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <ul class="thing-body-content-item">
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-connection"/> 端口: </span>{{data.port}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-monitor"/> 主机: </span>{{data.host}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-s-promotion"/> 网关服务: </span>{{data.serviceName}}</li>
                         </ul>
                     </div>
-                    <div title="网关描述信息" class="thing-body-content">
+                    <div title="网关描述信息" class="thing-card-body-content">
                         <p class="thing-content-nowrap-description">{{data.description?data.description:'无描述信息'}}</p>
                     </div>
                     <div class="thing-body-content-time">
@@ -34,7 +34,7 @@
                         </ul>
                     </div>
                 </div>
-                <div class="thing__footer">
+                <div class="thing-card__footer">
                     <div class="thing-copy-id">
                         <el-tooltip class="item" effect="dark" placement="top" v-if="data.id" content="点击复制ID">
                             <el-button class="button" type="text" icon="el-icon-document-copy" v-on:click="copyId(data.id)">{{data.id}}</el-button>
diff --git a/src/views/point/PointCard.vue b/src/views/point/PointCard.vue
index 8a4ca32a5..1559d7995 100644
--- a/src/views/point/PointCard.vue
+++ b/src/views/point/PointCard.vue
@@ -1,14 +1,14 @@
 <template>
     <div class="thing-card">
         <el-card shadow="hover">
-            <div class="thing-content">
+            <div class="thing-card-content">
                 <div class="thing-header" v-bind:class="{'header-enable':data.enable,'header-disable':!data.enable}">
                     <div class="thing-icon"><img :src="icon" :alt="data.name"></div>
                     <div class="thing-name thing-content-nowrap-title" @click="copyId(data.id)">{{data.name}}</div>
                     <div title="状态" class="thing-status"></div>
                 </div>
-                <div class="thing-body">
-                    <div class="thing-body-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <ul class="thing-body-content-item-point thing-body-content-item">
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-location-outline"/> 所属模板: </span>{{profile(data.profileId)}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-location-outline"/> 累计标识: </span>{{data.accrue?'累计':'不累计'}}</li>
@@ -24,7 +24,7 @@
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-location-outline"/> 最大值: </span>{{data.maximum}}</li>
                         </ul>
                     </div>
-                    <div title="位号描述信息" class="thing-body-content">
+                    <div title="位号描述信息" class="thing-card-body-content">
                         <p class="thing-content-nowrap-description">{{data.description?data.description:'无描述信息'}}</p>
                     </div>
                     <div class="thing-body-content-time">
@@ -36,7 +36,7 @@
                         </ul>
                     </div>
                 </div>
-                <div v-if="!embedded" class="thing__footer">
+                <div v-if="!embedded" class="thing-card__footer">
                     <div class="thing-copy-id">
                         <el-tooltip class="item" effect="dark" placement="top" v-if="data.id" content="点击复制ID">
                             <el-button class="button" type="text" icon="el-icon-document-copy" v-on:click="copyId(data.id)">{{data.id}}</el-button>
diff --git a/src/views/point/info/PointInfoCard.vue b/src/views/point/info/PointInfoCard.vue
index 7356f2187..5ded287d0 100644
--- a/src/views/point/info/PointInfoCard.vue
+++ b/src/views/point/info/PointInfoCard.vue
@@ -1,13 +1,13 @@
 <template>
     <div class="thing-card cursor-pointer" @click="select(data)">
         <el-card :shadow="data.shadow">
-            <div class="thing-content">
+            <div class="thing-card-content">
                 <div class="thing-header" v-bind:class="{'header-enable':isConfig,'header-disable':!isConfig}">
                     <div class="thing-icon"><img :src="isSelect" :alt="data.name"></div>
                     <div class="thing-name thing-content-nowrap-title" @click="copyId(data.id)">{{data.name}}</div>
                 </div>
-                <div class="thing-body">
-                    <div class="thing-body-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <ul class="thing-body-content-item">
                             <li class="thing-content-nowrap-item" :key="attribute.id" v-if="attribute" v-for="attribute in attributes">
                                 <span><i class="el-icon-goblet"/> {{attribute.displayName}}: </span>{{data[attribute.name].value}}
diff --git a/src/views/point/value/PointValueCard.vue b/src/views/point/value/PointValueCard.vue
index 87d6ed9f9..e6f93ab23 100644
--- a/src/views/point/value/PointValueCard.vue
+++ b/src/views/point/value/PointValueCard.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="thing-card">
         <el-card shadow="hover">
-            <div class="thing-content">
+            <div class="thing-card-content">
                 <div class="thing-header" v-bind:class="{'header-enable':data.interval<200,'header-disable':data.interval>=200}">
                     <div class="thing-icon"><img :src="icon" :alt="data.name"></div>
                     <div class="thing-name thing-content-nowrap-title" @click="copyId(data.id)">{{point(data.pointId)}}</div>
@@ -12,8 +12,8 @@
                         <el-tag v-else-if="data.rw===2" type="success" effect="plain">读写</el-tag>
                     </div>
                 </div>
-                <div class="thing-body">
-                    <div class="thing-body-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <ul class="thing-body-content-value">
                             <li title="处理值，点击复制" class="thing-content-nowrap-item value" @click="copyValue(data)">{{data.value}}</li>
                             <li v-if="embedded" title="详细内容" class="value-detail thing-content-nowrap-item">
@@ -45,7 +45,7 @@
                         </ul>
                     </div>
                 </div>
-                <div v-if="!embedded" class="thing__footer">
+                <div v-if="!embedded" class="thing-card__footer">
                     <div class="thing-copy-id">
                         <el-tooltip class="item" effect="dark" placement="top" v-if="data.id" content="点击复制ID">
                             <el-button class="button" type="text" icon="el-icon-document-copy" v-on:click="copyId(data.id)">{{data.id}}</el-button>
diff --git a/src/views/profile/ProfileCard.vue b/src/views/profile/ProfileCard.vue
index b9ed3a28d..553627e0a 100644
--- a/src/views/profile/ProfileCard.vue
+++ b/src/views/profile/ProfileCard.vue
@@ -1,20 +1,20 @@
 <template>
     <div class="thing-card">
         <el-card shadow="hover">
-            <div class="thing-content">
+            <div class="thing-card-content">
                 <div class="thing-header" v-bind:class="{'header-enable':data.enable,'header-disable':!data.enable}">
                     <div class="thing-icon"><img :src="icon" :alt="data.name"></div>
                     <div class="thing-name thing-content-nowrap-title" @click="copyId(data.id)">{{data.name}}</div>
                     <div title="状态" class="thing-status"></div>
                 </div>
-                <div class="thing-body">
-                    <div class="thing-body-content">
+                <div class="thing-card__body">
+                    <div class="thing-card-body-content">
                         <ul class="thing-body-content-item">
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-ice-cream-square"/> 位号个数: </span>{{data.pointIds.length||0}}</li>
                             <li class="thing-content-nowrap-item"><span><i class="el-icon-collection-tag"/> 位号: </span>{{point(data.pointIds)}}</li>
                         </ul>
                     </div>
-                    <div title="模板描述信息" class="thing-body-content">
+                    <div title="模板描述信息" class="thing-card-body-content">
                         <p class="thing-content-nowrap-description">{{data.description?data.description:'无描述信息'}}</p>
                     </div>
                     <div class="thing-body-content-time">
@@ -26,7 +26,7 @@
                         </ul>
                     </div>
                 </div>
-                <div v-if="!embedded" class="thing__footer">
+                <div v-if="!embedded" class="thing-card__footer">
                     <div class="thing-copy-id">
                         <el-tooltip class="item" effect="dark" placement="top" v-if="data.id" content="点击复制ID">
                             <el-button class="button" type="text" icon="el-icon-document-copy" v-on:click="copyId(data.id)">{{data.id}}</el-button>