陪诊

common/http.api.js

@@ -1,3 +1,4 @@
+
 //api集合
 let apiApp = {
 	// 用户
@@ -119,3 +120,4 @@ const install = (Vue, vm) => {
 export default {
 	install
 }
+

pages/index/index.vue

@@ -8,7 +8,7 @@
         alt=""
       ></image>
       <view class="top" :style="{ 'padding-right': menuButtonRight + 'px' }">
-        <view class="position" @click="toPage('/pages/CitySelect/CitySelect')">
+        <view class="position" @click="$u.route({ url: '/pages/CitySelect/CitySelect' })">
           <u-icon name="map-fill"></u-icon>
           <view>{{ vuex_location.city.replace(/(市|区|县)/,'') }}</view>
           <u-icon name="arrow-down" size="22"></u-icon>
@@ -93,7 +93,7 @@
             <view class="right">
               <view class="title">{{ item.name }}</view>
               <view class="tag">
-                <view class="tag__item">三甲</view>
+                <view class="tag__item">{{ item.good_at }}</view>
                 <view class="tag__item">综合医院</view>
               </view>
               <view class="description"> {{item.good_at}} </view>
@@ -205,6 +205,8 @@ export default {
         },
       ],
 
+      hospitals: [],
+      banners: [],
     };
   },
   mounted() {
@@ -219,6 +221,9 @@ export default {
       uni.getMenuButtonBoundingClientRect().left +
       10;
     this.statusBarHeight = uni.getMenuButtonBoundingClientRect().top;
+
+    this.getHospital()
+    this.getBanner()
   },
   onPageScroll(e) {
     this.isShowSticky = e.scrollTop > this.scrollTop
@@ -260,23 +265,31 @@ export default {
 	},
     searchInput(e) {},
 
-    toPage (url, type='page') {
-      switch (type) {
-        case 'page':
-          uni.navigateTo({
-            url
-          })
-          break
-        case 'tabbar':
-          uni.switchTab({
-            url
+    async getHospital() {
+      try {
+        const res = await this.$u.api.hospitalList({
+          page: 1,
+          page_size: 10,
+          'show_relation[0]': 'site'
         })
-          break
-        case 'back':
-          uni.navigateBack()
-          break
+        this.hospitals = res.data
+      } catch (err) {
+
       }
     },
+    async getBanner() {
+      try {
+        const res = await this.$u.api.banner({
+          position: 1
+        })
+        this.banners = res.map(i => ({
+          ...i,
+          url: i.image?.url
+        }))
+      } catch (err) {
+
+      }
+    }
   },
 };
 </script>
@@ -498,7 +511,7 @@ export default {
             }
           }
           .description {
-            width: 320rpx;
+            max-width: 320rpx;
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;

pages/me/me.vue

@@ -3,13 +3,26 @@
     <image class="bkg" mode="aspectFill" src="~@/static/me/bkg.png"></image>
 
     <view class="top">
-      <image class="avatar" mode="aspectFit" src="http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg"></image>
+      <image class="avatar" mode="aspectFit" :src="vuex_user.headimgurl"></image>
 
       <view class="info">
         <view class="info-name">{{ vuex_user.nickname || '微信用户' }}</view>
         <view class="info-mobile">手机号：{{ vuex_user.mobile || '' }}</view>
       </view>
     </view>
+
+    <view class="panel panel1">
+      <view class="tab" v-for="i in 5">
+        <image class="tab__icon" mode="aspectFit" src="~@/static/index/jiuyifuwu.png"></image>
+        <view>陪诊订单</view>
+      </view>
+    </view>
+    <view class="panel panel2">
+      <view class="row" v-for="i in 4">
+        <image class="row__icon" mode="aspectFit" src="~@/static/index/block1.png"></image>
+        <view>我要分享</view>
+      </view>
+    </view>
     <tabbar />
   </view>
 </template>
@@ -29,7 +42,9 @@ export default {
 
 <style lang="scss">
 .container {
+  min-height: 100vh;
   position: relative;
+  background: #f4efef;
 
   .bkg {
     width: 100vw;
@@ -41,10 +56,64 @@ export default {
   }
 
   .top {
-    padding: 0 25rpx;
+    display: flex;
+    align-items: center;
+    position: relative;
+    padding: 4vh 25rpx 0;
 
     .avatar {
+      width: 100rpx;
+      height: 100rpx;
+      border-radius: 100%;
+      background: #fff;
+      padding: 10rpx;
+      object-fit: cover;
+    }
+    .info {
+      padding-left: 40rpx;
+
+      &-name {
+        font-weight: 600;
+      }
+    }
+  }
+
+  .panel {
+    position: relative;
+    background: #fff;
+    border-radius: 10rpx;
+    margin: 40rpx 25rpx 0;
+    padding: 28rpx 25rpx;
+  }
+  .panel1 {
+    display: grid;
+    grid-gap: 24rpx;
+    grid-template-columns: repeat(3, 1fr);
+
+    .tab {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
 
+      &__icon {
+        width: 80rpx;
+        height: 80rpx;
+        margin-bottom: 10rpx;
+      }
+    }
+  }
+  .panel2 {
+    .row {
+      display: flex;
+      padding: 20rpx 10rpx;
+      border-bottom: 2rpx #aaa solid;
+
+      &__icon {
+        width: 40rpx;
+        height: 40rpx;
+        margin-right: 20rpx;
+      }
     }
   }
 }