浏览代码

ross页面调整

yuwenjun1997 2 年之前
父节点
当前提交
3c59cddea9

二进制
assets/theme-images/ross/h5-icon-doctor-ad.png


二进制
assets/theme-images/ross/pc-icon-doctor-ad.png


+ 14 - 1
components/SimpleSwiper/index.vue

@@ -1,7 +1,9 @@
 <template>
   <swiper class="swiper simple-swiper" :options="swiperOption">
     <swiper-slide v-for="(item, index) in imageList" :key="index">
-      <div class="slide-content"><img :src="item" class="slide" /></div>
+      <div class="slide-content">
+        <img :src="item" class="slide" :style="imgFit" />
+      </div>
     </swiper-slide>
     <div class="swiper-pagination" slot="pagination"></div>
   </swiper>
@@ -34,6 +36,10 @@ export default {
       type: Boolean,
       default: true,
     },
+    fit: {
+      type: String,
+      default: 'cover',
+    },
   },
   data() {
     const swiperOption = {}
@@ -49,6 +55,13 @@ export default {
       swiperOption,
     }
   },
+  computed: {
+    imgFit() {
+      return {
+        'object-fit': this.fit,
+      }
+    },
+  },
 }
 </script>
 

+ 8 - 8
pages/_template/ross/approve/personnel/operate/detail.vue

@@ -3,13 +3,13 @@
     <div class="page-title">体疗师认证</div>
     <div class="page-top">
       <div class="swiper">
-        <SimpleSwiper :imageList="doctorInfo.bannerList"></SimpleSwiper>
+        <SimpleSwiper :imageList="doctorInfo.bannerList" fit="contain"></SimpleSwiper>
       </div>
     </div>
     <div class="page-content">
       <div class="doctor-info px-4 pt-4 md:pt-0">
         <div class="name pb-4">{{ doctorInfo.doctorName }}</div>
-        <div class="tag pb-1">{{ doctorInfo.tagList.join(' | ') }}</div>
+        <!-- <div class="tag pb-1">{{ doctorInfo.tagList.join(' | ') }}</div> -->
         <div class="code pb-1">
           从业资格证编号:{{ doctorInfo.certificateNo }}
         </div>
@@ -106,11 +106,11 @@ export default {
         &::after {
           content: '';
           display: inline-block;
-          width: 76px;
+          width: 100px;
           height: 28px;
-          background: url(~assets/theme-images/common/h5-icon-doctor-ad.png)
+          background: url(~assets/theme-images/ross/h5-icon-doctor-ad.png)
             no-repeat;
-          background-size: 76px 28px;
+          background-size: auto 28px;
           vertical-align: -5px;
           margin-left: 8px;
         }
@@ -219,11 +219,11 @@ export default {
         &::after {
           content: '';
           display: inline-block;
-          width: 13.6vw;
+          width: 18.6vw;
           height: 5vw;
-          background: url(~assets/theme-images/common/h5-icon-doctor-ad.png)
+          background: url(~assets/theme-images/ross/h5-icon-doctor-ad.png)
             no-repeat;
-          background-size: 13.6vw 5vw;
+          background-size: auto 5vw;
           vertical-align: -0.8vw;
           margin-left: 1.2vw;
         }

+ 10 - 6
pages/_template/ross/approve/personnel/operate/index.vue

@@ -38,7 +38,8 @@
             <img class="cover" :src="item.doctorImage" />
             <div class="info">
               <div class="name" v-text="item.doctorName"></div>
-              <div class="tag">{{ item.tagList.join(' | ') }}</div>
+              <!-- <div class="tag">{{ item.tagList.join(' | ') }}</div> -->
+              <div style="height: 12px"></div>
               <div class="code">
                 资格证编号:<span>{{ item.certificateNo }}</span>
               </div>
@@ -148,13 +149,14 @@ export default {
 
         .cover {
           display: block;
-          width: 104px;
+          width: 78px;
           height: 104px;
         }
         .info {
-          width: 334px;
+          flex: 1;
+          flex-shrink: 0;
           position: relative;
-          margin-left: 12px;
+          margin-left: 16px;
           .name {
             font-size: 18px;
             color: #101010;
@@ -251,12 +253,14 @@ export default {
 
         .cover {
           display: block;
-          width: 21.6vw;
+          width: 16.2vw;
           height: 21.6vw;
         }
         .info {
           position: relative;
-          margin-left: 3.2vw;
+          margin-left: 3.6vw;
+          flex: 1;
+          flex-shrink: 0;
           .name {
             font-size: 4vw;
             color: #101010;