邀约页面空列表

src/pages/index/index.vue

@@ -145,56 +145,71 @@ const goToContactEditPage = (item) => {
           </nut-empty>
         </View>
         <View v-else>
-          <View class="h4 p-3">来访联系人</View>
-          <View class="w-100 d-flex flex-wrap">
-            <View style="width: 25vw" v-for="item in state.normalContacts">
-              <View class="m-2 p-3 border" hover-class="card-hover-gray" @tap="goToContactEditPage(item)">
-                <View class="d-flex justify-content-center">
-                  <NutBadge :value="item.isBlock?'阻止':''">
-                    <NutBadge :value="item.isVIP?'VIP':''">
-                      <NutAvatar size="normal" color="white" :bg-color="BjxHelper.mbString2RgbHex(item.name)" class="overflow-hidden">
-                        <img  v-if="item.avatar" :src="item.avatar" />
-                        <view v-else-if="BjxHelper.getBJXFirstChar(item.name)">{{BjxHelper.getBJXFirstChar(item.name)}}</view>
-                        <view v-else>
-                          <Text className='fas fa-user fa-lg'/>
-                        </view>
-                      </NutAvatar>
-                    </NutBadge>
-                  </NutBadge>
-                </View>
-                <View class="d-flex justify-content-center small b pt-2 text-nowrap overflow-hidden">
-                  {{item.name}}
-                </View>
-
+          <View v-if="state.normalContacts.length === 0 && state.flexContacts.length === 0">
+            <View class="d-flex flex-column p-3">
+              <View class="d-flex justify-content-center p-3">
+                <View class="h4 text-muted">还没有邀约</View>
+              </View>
+              <View class="d-flex justify-content-center">
+                <View class="text-muted" >添加您邀约的访客，让数字人认识他</View>
               </View>
             </View>
-
           </View>
 
-          <View class="h4 p-3">可随时来访联系人</View>
-          <View class="w-100 d-flex flex-wrap">
-            <View style="width: 25vw" v-for="item in state.flexContacts">
-              <View class="m-2 p-3 border" hover-class="card-hover-gray" @tap="goToContactEditPage(item)">
-                <View class="d-flex justify-content-center">
-                  <NutBadge :value="item.isBlock?'阻止':''">
-                    <NutBadge :value="item.isVIP?'VIP':''">
-                      <NutAvatar size="normal" color="white" :bg-color="BjxHelper.mbString2RgbHex(item.name)" class="overflow-hidden">
-                        <img  v-if="item.avatar" :src="item.avatar" />
-                        <view v-else-if="BjxHelper.getBJXFirstChar(item.name)">{{BjxHelper.getBJXFirstChar(item.name)}}</view>
-                        <view v-else>
-                          <Text className='fas fa-user fa-lg'/>
-                        </view>
-                      </NutAvatar>
+          <View v-else>
+            <View class="h4 p-3" v-if="state.normalContacts.length !== 0">来访联系人</View>
+            <View v-else></View>
+            <View class="w-100 d-flex flex-wrap">
+              <View style="width: 25vw" v-for="item in state.normalContacts">
+                <View class="m-2 p-3 border" hover-class="card-hover-gray" @tap="goToContactEditPage(item)">
+                  <View class="d-flex justify-content-center">
+                    <NutBadge :value="item.isBlock?'阻止':''">
+                      <NutBadge :value="item.isVIP?'VIP':''">
+                        <NutAvatar size="normal" color="white" :bg-color="BjxHelper.mbString2RgbHex(item.name)" class="overflow-hidden">
+                          <img  v-if="item.avatar" :src="item.avatar" />
+                          <view v-else-if="BjxHelper.getBJXFirstChar(item.name)">{{BjxHelper.getBJXFirstChar(item.name)}}</view>
+                          <view v-else>
+                            <Text className='fas fa-user fa-lg'/>
+                          </view>
+                        </NutAvatar>
+                      </NutBadge>
                     </NutBadge>
-                  </NutBadge>
-                </View>
-                <View class="d-flex justify-content-center small b pt-2 text-nowrap overflow-hidden">
-                  {{item.name}}
-                </View>
+                  </View>
+                  <View class="d-flex justify-content-center small b pt-2 text-nowrap overflow-hidden">
+                    {{item.name}}
+                  </View>
 
+                </View>
               </View>
+
             </View>
 
+            <View class="h4 p-3" v-if="state.normalContacts.length !== 0">可随时来访联系人</View>
+            <View v-else></View>
+            <View class="w-100 d-flex flex-wrap">
+              <View style="width: 25vw" v-for="item in state.flexContacts">
+                <View class="m-2 p-3 border" hover-class="card-hover-gray" @tap="goToContactEditPage(item)">
+                  <View class="d-flex justify-content-center">
+                    <NutBadge :value="item.isBlock?'阻止':''">
+                      <NutBadge :value="item.isVIP?'VIP':''">
+                        <NutAvatar size="normal" color="white" :bg-color="BjxHelper.mbString2RgbHex(item.name)" class="overflow-hidden">
+                          <img  v-if="item.avatar" :src="item.avatar" />
+                          <view v-else-if="BjxHelper.getBJXFirstChar(item.name)">{{BjxHelper.getBJXFirstChar(item.name)}}</view>
+                          <view v-else>
+                            <Text className='fas fa-user fa-lg'/>
+                          </view>
+                        </NutAvatar>
+                      </NutBadge>
+                    </NutBadge>
+                  </View>
+                  <View class="d-flex justify-content-center small b pt-2 text-nowrap overflow-hidden">
+                    {{item.name}}
+                  </View>
+
+                </View>
+              </View>
+
+            </View>
           </View>
         </View>
       </View>