BUG 29500

src/saas/AppGridManagement/Organization.vue

@@ -11,7 +11,10 @@
         <div class="name">
           <AiOpenData v-if="item.wxUserId" type="userName" :openid="item.wxUserId"/>
         </div>
-        <div class="gird">{{item.checkType == 2 ? '网格长' : '网格员'}}</div>
+        <div flex class="spb">
+          <div class="gird" v-text="item.checkType == 2 ? '网格长' : '网格员'"/>
+          <div class="gird dark" v-text="item.label"/>
+        </div>
         <p>{{ item.girdName }}</p>
       </div>
     </div>
@@ -23,7 +26,10 @@
       </div>
       <div class="right">
         <div class="name">
+          <div flex>
             <AiOpenData v-if="item.wxUserId" type="userName" :openid="item.wxUserId"/>
+            <div class="gird dark" v-text="item.label"/>
+          </div>
           <span class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</span>
           <span class="num" v-if="item.checkType == 1">家庭数({{ item.residentNumber }})</span>
         </div>
@@ -33,13 +39,15 @@
         </div>
       </div>
     </div>
-    <AiEmpty description="暂无数据" class="emptyWrap" v-if="dataInfo.parentGirdMembers && !dataInfo.parentGirdMembers.length && !dataInfo.girdMembers.length"></AiEmpty>
+    <AiEmpty description="暂无数据" class="emptyWrap"
+             v-if="dataInfo.parentGirdMembers && !dataInfo.parentGirdMembers.length && !dataInfo.girdMembers.length"></AiEmpty>
     <div class="pad-b112"></div>
   </div>
 </template>
 
 <script>
 import {mapActions} from 'vuex'
+
 export default {
   data() {
     return {
@@ -97,6 +105,7 @@ export default {
 <style lang="scss" scoped>
 .Organization {
   background-color: #f5f5f5;
+
   .title {
     font-size: 38px;
     font-family: PingFangSC-Semibold, PingFang SC;
@@ -106,6 +115,7 @@ export default {
     padding-left: 32px;
     margin-bottom: 32px;
   }
+
   .user-content {
     width: calc(100% - 64px);
     margin: 0 0 32px 32px;
@@ -113,18 +123,22 @@ export default {
     padding: 32px;
     box-sizing: border-box;
     display: flex;
+
     img {
       width: 200px;
       height: 200px;
       margin-right: 32px;
     }
+
     image {
       width: 200px;
       height: 200px;
       margin-right: 32px;
     }
+
     .right {
       width: 100%;
+
       .name {
         font-size: 32px;
         font-family: PingFangSC-Medium, PingFang SC;
@@ -133,6 +147,7 @@ export default {
         line-height: 44px;
         margin-bottom: 12px;
       }
+
       .gird {
         display: inline-block;
         line-height: 44px;
@@ -143,7 +158,14 @@ export default {
         font-family: PingFangSC-Regular, PingFang SC;
         color: #26F;
         margin-bottom: 12px;
+
+        &.dark {
+          color: #fff;
+          background: #26f;
+          margin-left: 16px;
         }
+      }
+
       p {
         font-size: 26px;
         font-family: PingFangSC-Regular, PingFang SC;
@@ -152,26 +174,31 @@ export default {
       }
     }
   }
+
   .user-item {
     img {
       width: 96px;
       height: 96px;
       border-radius: 50%;
     }
+
     image {
       width: 96px;
       height: 96px;
       border-radius: 50%;
     }
+
     .gird {
       display: inline-block;
       margin-left: 16px;
       margin-bottom: 0 !important;
     }
+
     .name {
       margin-bottom: 8px !important;
     }
   }
+
   .family-btn {
     font-size: 26px;
     font-family: PingFangSC-Regular, PingFang SC;
@@ -179,12 +206,14 @@ export default {
     line-height: 36px;
     float: right;
   }
+
   .num {
     font-size: 26px;
     font-family: PingFangSC-Regular, PingFang SC;
     line-height: 36px;
     float: right;
   }
+
   .pad-b112 {
     padding-bottom: 112px;
   }