大幅度修改医疗服务首页的模式，添加名医介绍。

src/api/home-page.js

@@ -0,0 +1,8 @@
+import request from '../utils/request'
+
+export function selectHomePageDoctors() {
+  return request({
+    url: '/homepage/selectHomePageDoctors',
+    method: 'get',
+  })
+}

src/index.css

@@ -7,8 +7,8 @@
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 	color: #2c3e50;
-	/* background-color: rgb(238, 238, 250); */
-	background-image: url('./assets/light-background.jpg');
+	background-color: rgb(251, 251, 255);
+	/* background-image: url('./assets/light-background.jpg'); */
 	background-size: 100% 100%;
 }
 .loading-box_wrapper {

src/store/index.js

@@ -8,6 +8,7 @@ export default createStore({
       height: 0,
     },
     patientCards: [],
+    homePageDoctors: [],
     appointmentInfo: {},
     currentExamDate: null,
     examIndexArray: [],
@@ -16,6 +17,7 @@ export default createStore({
     SET_LOADING: (state, payload) => (state.loading = payload),
     SET_WINDOWSIZE: (state, payload) => (state.windowSize = payload),
     SET_PATIENTCARDS: (state, payload) => (state.patientCards = payload),
+    SET_HOMEPAGEDOCTORS: (state, payload) => (state.homePageDoctors = payload),
     SET_APPOINTMENTINFO: (state, payload) => (state.appointmentInfo = payload),
     SET_CURRENTEXAMDATE: (state, payload) => (state.currentExamDate = payload),
     SET_EXAMINDEXARRAY: (state, payload) => (state.examIndexArray = payload),
@@ -30,6 +32,9 @@ export default createStore({
     SET_PATIENTCARDS({ commit }, payload) {
       commit('SET_PATIENTCARDS', payload)
     },
+    SET_HOMEPAGEDOCTORS({ commit }, payload) {
+      commit('SET_HOMEPAGEDOCTORS', payload)
+    },
     SET_APPOINTMENTINFO({ commit }, payload) {
       commit('SET_APPOINTMENTINFO', payload)
     },

src/utils/request.js

@@ -3,8 +3,8 @@ import { Toast, Dialog } from 'vant'
 import store from '../store/index'
 
 const service = axios.create({
-  // baseURL: 'http://172.16.30.26:8805/wxserver/', // dev
-  baseURL: 'http://218.104.151.241:8805/wxserver', // prod
+  baseURL: 'http://172.16.30.26:8805/wxserver/', // dev
+  // baseURL: 'http://218.104.151.241:8805/wxserver', // prod
   withCredentials: true,
   timeout: 0,
 })

src/views/hospital-service/HospitalServiceHome.vue

@@ -1,44 +1,251 @@
 <template>
-  <window-size :showBackNav="false" :offset="170">
-    <div style="height: 5px"></div>
-    <van-grid :gutter="5" clickable :column-num="3">
-      <van-grid-item icon="phone" text="预约挂号" to="/appointment" />
-      <van-grid-item icon="gold-coin" text="门诊缴费" :to="filterPath('/unPaidList/', '/selectPayPatient')" />
-      <van-grid-item icon="search" text="报告查询" :to="filterPath('/checkExamIndex/', '/selectExamPatient')" />
-    </van-grid>
-    <div style="height: 5px"></div>
-    <van-grid :gutter="5" clickable :column-num="3">
-      <van-grid-item icon="smile" text="问卷调查" :to="filterPath('/assessments/', '/selectAssessmentPatient')" />
-      <van-grid-item icon="column" text="体检报告" to="/physicalExamination" />
-      <van-grid-item icon="wap-home" text="住院服务" :to="filterPath('/inPatientService/', '/selectInpatientCard')" />
-    </van-grid>
-    <div style="height: 5px"></div>
-    <van-grid :gutter="5" clickable :column-num="3">
-      <van-grid-item
-        icon="shopping-cart"
-        text="健康商城"
-        :to="filterPath('/healthCartCategory/', '/selectHealthCartPatient')"
-      />
-      <van-grid-item icon="hot" text="新冠检测" :to="filterPath('/selectCovidBranch/', '/selectOrderCovidPatient')" />
-    </van-grid>
-    <div style="height: 5px"></div>
+  <window-size :showBackNav="false">
+    <div class="logo-div">
+      <div style="width: 3%"></div>
+      <div><img src="../../assets/thyylogo.png" style="height: 60px" /></div>
+      <div style="height: 60px; line-height: 60px; color: #00525e">
+        <h3>微信医疗服务平台</h3>
+      </div>
+    </div>
+    <div class="yuyueguahao" @click="routeTo('/appointment')">
+      <div>
+        <img src="../../assets/hospital-service/yuyueguahao2.png" />
+      </div>
+      <p>预约挂号&nbsp;<van-tag type="success" plain>快速、便捷</van-tag></p>
+    </div>
+    <div id="router-lane">
+      <div style="height: 10px"></div>
+      <van-row gutter="5">
+        <van-col span="6" @click="routeTo('/appointment')">
+          <img src="../../assets/hospital-service/yuyueguahao.png" />
+          <div class="icon-label">预约挂号</div>
+        </van-col>
+        <van-col span="6" @click="routeTo(filterPath('/unPaidList/', '/selectPayPatient'))">
+          <img src="../../assets/hospital-service/menzhenjiaofei.png" />
+          <div class="icon-label">门诊缴费</div>
+        </van-col>
+        <van-col span="6" @click="routeTo(filterPath('/checkExamIndex/', '/selectExamPatient'))">
+          <img src="../../assets/hospital-service/baogaochaxun.png" />
+          <div class="icon-label">报告查询</div>
+        </van-col>
+        <van-col span="6" @click="routeTo(filterPath('/inPatientService/', '/selectInpatientCard'))">
+          <img src="../../assets/hospital-service/zhuyuanfuwu.png" />
+          <div class="icon-label">住院服务</div>
+        </van-col>
+      </van-row>
+      <div style="height: 10px"></div>
+      <van-row gutter="5">
+        <van-col span="6" @click="routeTo(filterPath('/assessments/', '/selectAssessmentPatient'))">
+          <img src="../../assets/hospital-service/wenjuandiaocha.png" />
+          <div class="icon-label">问卷调查</div>
+        </van-col>
+        <van-col span="6" @click="routeTo('/physicalExamination')">
+          <img src="../../assets/hospital-service/tijianbaogao.png" />
+          <div class="icon-label">体检报告</div>
+        </van-col>
+        <van-col span="6" @click="routeTo(filterPath('/healthCartCategory/', '/selectHealthCartPatient'))">
+          <img src="../../assets/hospital-service/gouwuche.png" />
+          <div class="icon-label">健康商城</div>
+        </van-col>
+      </van-row>
+    </div>
+    <div
+      class="yuyueguahao xinguanjiance"
+      @click="routeTo(filterPath('/selectCovidBranch/', '/selectOrderCovidPatient'))"
+    >
+      <div>
+        <img src="../../assets/hospital-service/xinguanjiance2.png" />
+      </div>
+      <p>新冠检测快速下单与查询</p>
+    </div>
+    <div style="width: 90%; margin-left: 5%; margin-top: 15px">
+      <van-tag size="large" type="warning">名医介绍</van-tag>
+    </div>
+    <div :style="swipeStyle">
+      <van-swipe :autoplay="10000" :show-indicators="false" vertical style="height: 100%">
+        <van-swipe-item v-for="(arr, index) in doctors" :key="index">
+          <div :style="swipeRowStyle" v-for="item in arr" :key="item.doctorCode" @click="clickDoctor(item)">
+            <van-image
+              round
+              fit="cover"
+              style="margin-top: 5px; margin-left: 5px"
+              :width="portraitWidth"
+              :height="portraitHeight"
+              :src="'data:image/png;base64,' + item.portrait"
+            />
+            <div :style="infoStyle">
+              {{ item.doctorName }} | {{ item.deptName }} | {{ item.title }}
+              <div v-show="item.specialty" :style="specialtyStyle">擅长{{ item.specialty }}</div>
+            </div>
+          </div>
+        </van-swipe-item>
+      </van-swipe>
+    </div>
   </window-size>
 </template>
 
 <script>
-import { computed } from 'vue'
+import { computed, onMounted } from 'vue'
 import store from '../../store'
+import { selectHomePageDoctors } from '../../api/home-page'
+import { getDate } from '../../utils/date'
+import router from '../../router'
 export default {
   setup() {
+    const windowSize = store.state.windowSize
+    const swipeStyle = {
+      width: '90%',
+      marginLeft: '5%',
+      marginTop: '5px',
+      height: windowSize.h - 460 + 'px',
+      h: windowSize.h - 460,
+      w: windowSize.w * 0.9,
+    }
+
+    const swipeRowStyle = {
+      width: '100%',
+      height: swipeStyle.h / 3 - 5 + 'px',
+      marginBottom: '5px',
+      borderRadius: '8px',
+      backgroundColor: '#00525e',
+      backgroundImage: 'linear-gradient(to bottom right, #03a0b8, #00525e)',
+      display: 'flex',
+      h: swipeStyle.h / 3 - 5,
+      color: 'white',
+    }
+
+    const portraitHeight = swipeRowStyle.h - 10 + 'px'
+    const portraitWidth = swipeRowStyle.h * 0.65 + 'px'
+
+    const infoStyle = {
+      width: swipeStyle.w - swipeRowStyle.h * 0.65 - 10 + 'px',
+      height: '32px',
+      fontSize: '13px',
+      fontWeight: 'bold',
+      marginLeft: '10px',
+      marginTop: swipeRowStyle.h / 2 - 20 + 'px',
+    }
+
+    const specialtyStyle = {
+      overflow: 'hidden',
+      textOverflow: 'ellipsis',
+      whiteSpace: 'nowrap',
+      fontSize: '12px',
+      fontWeight: 'normal',
+      paddingRight: '15px',
+    }
+
     const cards = computed(() => {
       return store.state.patientCards
     })
     const filterPath = (singleCardPath, multipleCardsPath) => {
       return cards.value.length === 1 ? singleCardPath + cards.value[0].patientId : multipleCardsPath
     }
+    const doctors = computed(() => {
+      return store.state.homePageDoctors
+    })
+    const date = getDate()
+    const clickDoctor = (val) => {
+      const path = '/doctorArrangement/' + date + '/' + val.deptCode + '/' + val.doctorCode
+      router.push(path)
+    }
+
+    const routeTo = (val) => {
+      router.push(val)
+    }
+
+    onMounted(() => {
+      if (doctors.value.length === 0) {
+        selectHomePageDoctors().then((res) => {
+          store.commit('SET_HOMEPAGEDOCTORS', res)
+        })
+      }
+    })
     return {
       filterPath,
+      doctors,
+      clickDoctor,
+      swipeStyle,
+      swipeRowStyle,
+      portraitHeight,
+      portraitWidth,
+      infoStyle,
+      specialtyStyle,
+      routeTo,
     }
   },
 }
-</script>
+</script>
+
+<style scoped>
+.logo-div {
+  width: 100%;
+  height: 60px;
+  display: flex;
+  border-color: #7c7c7c;
+  background: linear-gradient(
+    top,
+    rgba(38, 38, 38, 0.8),
+    #e6e6e6 25%,
+    #ffffff 38%,
+    #c5c5c5 63%,
+    #f7f7f7 87%,
+    rgba(38, 38, 38, 0.8)
+  );
+  background: -webkit-linear-gradient(
+    top,
+    rgba(38, 38, 38, 0.5),
+    #e6e6e6 25%,
+    #ffffff 38%,
+    rgba(0, 0, 0, 0.25) 63%,
+    #e6e6e6 87%,
+    rgba(38, 38, 38, 0.4)
+  );
+}
+.yuyueguahao {
+  margin-top: 10px;
+  width: 90%;
+  margin-left: 5%;
+  height: 70px;
+  background: url('../../assets/hospital-service/yuyueguahaobackground.png') no-repeat;
+  background-size: 100%;
+  border-radius: 8px;
+  display: flex;
+}
+.yuyueguahao img {
+  margin-left: 10px;
+  margin-top: 11px;
+}
+.yuyueguahao p {
+  color: white;
+  font-size: 18px;
+  font-weight: bold;
+  height: 70px;
+  line-height: 70px;
+  padding-left: 10px;
+}
+
+.xinguanjiance {
+  background: url('../../assets/hospital-service/xinguanjiancebackground.png') no-repeat !important;
+  background-size: 100% !important;
+}
+
+.bold-text {
+  font-weight: bold;
+}
+
+#router-lane .van-col {
+  text-align: center;
+}
+
+#router-lane img {
+  width: 32px;
+  height: 32px;
+}
+
+.icon-label {
+  font-size: 13px;
+  color: #333;
+  /* color:#048a9e; */
+}
+</style>

src/views/mine/MineHome.vue

@@ -1,5 +1,5 @@
 <template>
-  <window-size :showBackNav="false" :offset="170">
+  <window-size :showBackNav="false" :offset="0">
     <van-cell-group title="我的">
       <van-cell icon="friends" title="我的就诊人" is-link to="/myPatientIdCards"></van-cell>
       <van-cell icon="star" title="我的收藏" is-link to="/myCollection"></van-cell>