feat: page-serve;

api/api.js

@@ -5,7 +5,7 @@ import utils from '../utils/utils.js'
 let limit = {}
 let debounce = {}
 
-const models = ['index', 'case']
+const models = ['index', 'case', 'serve']
 
 const config = {
 	// 示例

api/model/serve.js

@@ -0,0 +1,20 @@
+// 首页相关接口
+
+const api = {
+	/**
+	 * 查询概述说明列表
+	 */
+	querySummaryList: {
+		url: '/config/querySummaryList',
+		method: 'GET',
+	},
+	/**
+	 * 查询概述说明详情
+	 */
+	querySummaryByParamCode: {
+		url: '/config/querySummaryByParamCode',
+		method: 'GET',
+	},
+}
+
+export default api

pages.json

@@ -38,6 +38,8 @@
 				"path": "thesis/index"
 			}, {
 				"path": "case/index"
+			}, {
+				"path": "serve/index"
 			}
 		]
 	}],

pages/index/center.vue

@@ -1,6 +1,37 @@
 <template>
   <view class="page__view">
+    <view class="bg"></view>
 
+    <view class="main">
+
+      <view class="header">
+        <view class="title">
+          <!-- todo: check key -->
+          <view class="title-text">吉光研途</view>
+          <view class="title-line"></view>
+        </view>
+        <!-- todo: check key -->
+        <view class="desc">为您提供更专业、优质、靠谱的学术服务</view>
+      </view>
+
+			<!-- 轮播图 -->
+			<view class="section swiper">
+				<uv-swiper :list="bannerList" keyName="image" indicator indicatorMode="dot" indicatorActiveColor="#4883F9" indicatorInactiveColor="#FFFFFF" height="424rpx"></uv-swiper>
+			</view>
+
+      <view class="list">
+        <!-- todo: check list will change? -->
+        <view class="list-item" @click="jumpToDetail('other_service')">
+          <image class="list-item-bg" src="@/static/image/bg-other-serve.png" mode="widthFix"></image>
+          <view class="list-item-fg">
+            <view class="title">其他服务</view>
+            <view class="desc">Other services</view>
+          </view>
+        </view>
+      </view>
+
+    </view>
+      
 		<tabber select="center" />
   </view>
 </template>
@@ -12,9 +43,131 @@
 		components: {
       tabber,
     },
+    data() {
+      return {
+        bannerList: [],
+      }
+    },
+    onLoad() {
+      // todo: check
+      this.$fetch('querySummaryList')
+      
+      this.fetchBanner()
+    },
+    methods: {
+			// 获取轮播图
+			async fetchBanner() {
+				try {
+					this.bannerList = (await this.$fetch('queryBannerList', { type: '3' }))?.records // type：0-首页 1-案例 2-服务 3-其他
+				} catch (err) {
+
+				}
+			},
+      jumpToDetail(paramCode) {
+        uni.navigateTo({
+					url: `/pages_order/serve/index?paramCode=${paramCode}`
+				})
+      },
+    },
   }
 </script>
 
 <style scoped lang="scss">
+  .bg {
+    width: 100%;
+    height: 438rpx;
+    background-image: linear-gradient(#4883F9, #4883F9, #4883F9, #FCFDFF);
+  }
+
+  .main {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding: 156rpx 0 182rpx 0;
+  }
+
+  .header {
+
+    .title {
+      margin-left: 25rpx;
+      position: relative;
+      padding: 51rpx 0 6rpx 42rpx;
+
+      &-line {
+        width: 151rpx;
+        height: 11rpx;
+        background: linear-gradient(76deg,#ffffff 2%, #4883f9 88%);
+        border-radius: 6rpx;
+      }
+
+      &-text {
+        position: absolute;
+        top: 0;
+        left: 0;
+        font-size: 46rpx;
+        font-weight: 700;
+        color: #FFFFFF;
+      }
+
+    }
+
+    .desc {
+      font-size: 30rpx;
+      font-weight: 700;
+      color: #FFFFFF;
+      margin: 14rpx 28rpx 32rpx 28rpx;
+    }
+  }
+
+  .swiper {
+    margin: 0 18rpx;
+    border-radius: 25rpx;
+    overflow: hidden;
+    
+    /deep/ .uv-swiper-indicator__wrapper__dot {
+      width: 15rpx;
+      height: 15rpx;
+    }
+
+    /deep/ .uv-swiper-indicator__wrapper__dot--active {
+      width: 15rpx;
+    }
+  }
+
+  .list {
+    padding: 0 12rpx;
+
+    &-item {
+      position: relative;
+
+      & + & {
+        margin-top: 19rpx;
+      }
+
+      &-bg {
+        width: 100%;
+        height: auto;
+      }
+
+      &-fg {
+        position: absolute;
+        top: 70rpx;
+        left: 43rpx;
+
+        .title {
+          font-size: 32rpx;
+          font-weight: 700;
+          color: #000000;
+        }
+
+        .desc {
+          margin-top: 2rpx;
+          font-size: 28rpx;
+          color: #8A8784;
+        }
+      }
+    }
+  }
 
 </style>

pages/index/serve.vue

@@ -1,6 +1,44 @@
 <template>
   <view class="page__view">
+    <view class="bg"></view>
 
+    <view class="main">
+
+      <view class="header">
+        <view class="title">
+          <!-- todo: check key -->
+          <view class="title-text">吉光研途</view>
+          <view class="title-line"></view>
+        </view>
+        <!-- todo: check key -->
+        <view class="desc">为您提供更专业、优质、靠谱的学术服务</view>
+      </view>
+
+			<!-- 轮播图 -->
+			<view class="section swiper">
+				<uv-swiper :list="bannerList" keyName="image" indicator indicatorMode="dot" indicatorActiveColor="#4883F9" indicatorInactiveColor="#FFFFFF" height="424rpx"></uv-swiper>
+			</view>
+
+      <view class="list">
+        <!-- todo: check list will change? -->
+        <view class="list-item" @click="jumpToDetail('academic_advising')">
+          <image class="list-item-bg" src="@/static/image/bg-academic-advising.png" mode="widthFix"></image>
+          <view class="list-item-fg">
+            <view class="title">学术辅导</view>
+            <view class="desc">Academic Advising</view>
+          </view>
+        </view>
+        <view class="list-item" @click="jumpToDetail('thesis_submission')">
+          <image class="list-item-bg" src="@/static/image/bg-paper-submission.png" mode="widthFix"></image>
+          <view class="list-item-fg">
+            <view class="title">论文投递</view>
+            <view class="desc">Paper submission</view>
+          </view>
+        </view>
+      </view>
+
+    </view>
+      
 		<tabber select="serve" />
   </view>
 </template>
@@ -12,9 +50,142 @@
 		components: {
       tabber,
     },
+    data() {
+      return {
+        bannerList: [],
+      }
+    },
+    onLoad() {
+      this.fetchBanner()
+    },
+    methods: {
+			// 获取轮播图
+			async fetchBanner() {
+				try {
+					this.bannerList = (await this.$fetch('queryBannerList', { type: '2' }))?.records // type：0-首页 1-案例 2-服务 3-其他
+				} catch (err) {
+
+				}
+			},
+      jumpToDetail(paramCode) {
+        uni.navigateTo({
+					url: `/pages_order/serve/index?paramCode=${paramCode}`
+				})
+      },
+    },
   }
 </script>
 
 <style scoped lang="scss">
+  .bg {
+    width: 100%;
+    height: 438rpx;
+    background-image: linear-gradient(#4883F9, #4883F9, #4883F9, #FCFDFF);
+  }
+
+  .main {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding: 156rpx 0 182rpx 0;
+  }
+
+  .header {
+
+    .title {
+      margin-left: 25rpx;
+      position: relative;
+      padding: 51rpx 0 6rpx 42rpx;
+
+      &-line {
+        width: 151rpx;
+        height: 11rpx;
+        background: linear-gradient(76deg,#ffffff 2%, #4883f9 88%);
+        border-radius: 6rpx;
+      }
+
+      &-text {
+        position: absolute;
+        top: 0;
+        left: 0;
+        font-size: 46rpx;
+        font-weight: 700;
+        color: #FFFFFF;
+      }
+
+    }
+
+    .desc {
+      font-size: 30rpx;
+      font-weight: 700;
+      color: #FFFFFF;
+      margin: 14rpx 28rpx 32rpx 28rpx;
+    }
+  }
+
+  .swiper {
+    margin: 0 18rpx 15rpx 18rpx;
+    border-radius: 25rpx;
+    overflow: hidden;
+    
+    /deep/ .uv-swiper-indicator__wrapper__dot {
+      width: 15rpx;
+      height: 15rpx;
+    }
+
+    /deep/ .uv-swiper-indicator__wrapper__dot--active {
+      width: 15rpx;
+    }
+  }
+
+  .list {
+    padding: 0 12rpx;
+
+    &-item {
+      position: relative;
+
+      & + & {
+        margin-top: 19rpx;
+      }
+
+      &-bg {
+        width: 100%;
+        height: auto;
+      }
+
+      &-fg {
+        position: absolute;
+        top: 38rpx;
+        left: 51rpx;
+
+        .title {
+          font-size: 32rpx;
+          font-weight: 700;
+          color: #E67722;
+        }
+
+        .desc {
+          margin-top: 2rpx;
+          font-size: 28rpx;
+          color: #BEA898;
+        }
+      }
+
+      &:nth-child(2n) {
+        .list-item-fg {
+          left: 200rpx;
+
+          .title {
+            color: #052464;
+          }
+
+          .desc {
+            color: #A8BADE;
+          }
+        }
+      }
+    }
+  }
 
 </style>

pages_order/serve/index.vue

@@ -0,0 +1,56 @@
+<template>
+  <view class="page__view">
+    
+		<!-- 导航栏 -->
+		<navbar :title="details.paramDesc" leftClick @leftClick="$utils.navigateBack" bgColor="#4883F9" color="#FFFFFF" />
+
+    <view class="main">
+      <view class="title">{{ details.title }}</view>
+      <uv-parse :content="details.details"></uv-parse>
+    </view>
+
+  </view>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        details: {},
+      }
+    },
+    onLoad({ paramCode }) {
+      this.getData(paramCode)
+    },
+    methods: {
+      async getData(paramCode) {
+        try {
+          this.details = await this.$fetch('querySummaryByParamCode', { paramCode })
+          console.log('details', this.details)
+        } catch (err) {
+          console.log('err', err)
+        }
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+
+  .page__view {
+    background: #FFFFFF;
+  }
+
+  .main {
+    padding: 44rpx 40rpx;
+    font-size: 30rpx;
+    color: #000000;
+
+    .title {
+      margin-bottom: 50rpx;
+      font-size: 36rpx;
+      font-weight: 700;
+    }
+  }
+
+</style>