dev

src/components/outpatient/MedicalQueue.vue

@@ -30,13 +30,13 @@
           <el-scrollbar style="height: 100%">
             <li class="list-item" :class="curItem?.id == item.id ? 'active' : ''" v-for="(item, index) in list"
                 :key="index" @click="clickLi(item)">
-                <span class="item-avatar" style="position: relative">
+              <div class="item-avatar">
                 <img v-if="item.gender==1" class="avatar" src="/static/images/outpatient/man.png"
                      alt="头像"/>
                 <img v-if="item.gender==2" class="avatar" src="/static/images/outpatient/women.png"
                      alt="头像"/>
-                   <span v-if="item.isAppointment" class="iconfont icon-yuyue yuYueIcon"></span>
-                </span>
+                <i v-if="item.isAppointment" class="iconfont icon-yuyueh yuYueIcon"></i>
+              </div>
               <span class="item-name">{{ item.name }}</span>
               <span class="item-time">
                 {{ formatListTime(item.appointmentTime) }}
@@ -343,6 +343,21 @@ watch(() => selectedDate.value, (newValue, oldValue) => {
       .item-avatar {
         width: 26px;
         margin-right: 10px;
+        position: relative;
+
+        .yuYueIcon {
+          display: inline-block;
+          width: 12px;
+          height: 12px;
+          position: absolute;
+          bottom: 11px;
+          right: -1px;
+          color: #31e3ca;
+          font-size: 12px;
+          z-index: 99;
+          background: #fff;
+          border-radius: 12px;
+        }
 
         .avatar {
           margin-top: 11px;
@@ -417,15 +432,4 @@ watch(() => selectedDate.value, (newValue, oldValue) => {
   right: 0;
   top: 50px;
 }
-
-.yuYueIcon {
-  width: 13px;
-  height: 13px;
-  position: absolute;
-  top: -8px;
-  color: rgb(255, 102, 0);
-  font-size: 12px;
-  right: 0;
-  z-index: 99;
-}
 </style>