页面

common/http.api.js

@@ -2,8 +2,8 @@
 let apiApp = {
 	login: '/api/mobile/user/applet-login',
 	userInfo: '/api/mobile/user/get-user-info',
-
-
+	hospital: '/api/mobile/hospital/hospital',
+	banner: '/api/mobile/other/banner'
 }
 
 // 此处第二个参数vm，就是我们在页面使用的this，你可以通过vm获取vuex等操作
@@ -13,11 +13,15 @@ const install = (Vue, vm) => {
 	//
 	const login = (params = {}) => vm.$u.get(apiApp.login, params)
 	const getUserInfo = () => vm.$u.get(apiApp.userInfo)
+	const hospitalList = (params = {}) => vm.$u.get(apiApp.hospital, params)
+	const banner = (params = {}) => vm.$u.get(apiApp.banner, params)
 	// end
 
 	vm.$u.api = {
 		login,
-		getUserInfo
+		getUserInfo,
+		hospitalList,
+		banner
 	};
 }
 

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>
@@ -55,7 +55,7 @@
       </view>
 
       <view class="swiper">
-        <u-swiper :list="list"></u-swiper>
+        <u-swiper :list="banners" name="url"></u-swiper>
       </view>
 
       <view class="links">
@@ -82,7 +82,7 @@
         <view class="hospitals__title">热门医院</view>
 
         <view class="hospitals__content">
-          <view class="hospitals__content__item" v-for="item in 3" :key="item">
+          <view class="hospitals__content__item" v-for="item in hospitals" :key="item.key">
             <view class="left">
               <image
                 src="https://sstt.115.langye.net/storage/files/172760356266f9236a22e58.png"
@@ -91,19 +91,19 @@
               ></image>
             </view>
             <view class="right">
-              <view class="title">苏州大学附属第一医院</view>
+              <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"> 内科、外科、五官科、其他 </view>
+              <view class="description"> {{ item.content }} </view>
             </view>
           </view>
         </view>
       </view>
 
       <view class="statistics">
-        <view class="block1" @click="toPage('/package_sub/pages/AddOrder/AddOrder')">
+        <view class="block1" @click="$u.route({ url: '/package_sub/pages/AddOrder/AddOrder' })">
           <view class="text1">陪诊团队介绍</view>
           <view class="text2">让就医体验更美好</view>
           <view class="order">预约陪诊</view>
@@ -178,20 +178,6 @@ export default {
       select: {
         keyword: "",
       },
-      list: [
-        {
-          image: "https://cdn.uviewui.com/uview/swiper/1.jpg",
-          title: "昨夜星辰昨夜风，画楼西畔桂堂东",
-        },
-        {
-          image: "https://cdn.uviewui.com/uview/swiper/2.jpg",
-          title: "身无彩凤双飞翼，心有灵犀一点通",
-        },
-        {
-          image: "https://cdn.uviewui.com/uview/swiper/3.jpg",
-          title: "谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳",
-        },
-      ],
       links: [
         {
           text: "陪诊服务",
@@ -216,6 +202,8 @@ export default {
         },
       ],
 
+      hospitals: [],
+      banners: [],
     };
   },
   mounted() {
@@ -230,6 +218,9 @@ export default {
       uni.getMenuButtonBoundingClientRect().left +
       10;
     this.statusBarHeight = uni.getMenuButtonBoundingClientRect().top;
+
+    this.getHospital()
+    this.getBanner()
   },
   onPageScroll(e) {
     this.isShowSticky = e.scrollTop > this.scrollTop
@@ -252,23 +243,31 @@ export default {
     },
     searchInput(e) {},
 
-    toPage (url, type='page') {
-      switch (type) {
-        case 'page':
-          uni.navigateTo({
-            url
-          })
-          break
-        case 'tabbar':
-          uni.switchTab({
-            url
-          })
-          break
-        case 'back':
-          uni.navigateBack()
-          break
+    async getHospital() {
+      try {
+        const res = await this.$u.api.hospitalList({
+          page: 1,
+          page_size: 10,
+          'show_relation[0]': 'site'
+        })
+        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>
@@ -490,7 +489,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;
+      }
     }
   }
 }