diff --git a/api/fetch.js b/api/fetch.js
new file mode 100644
index 0000000..6443777
--- /dev/null
+++ b/api/fetch.js
@@ -0,0 +1,20 @@
+import api from './api.js'
+
+const fetch = (key, data = {}, transform = true, loadingTitle) => {
+  return new Promise(resolve => {
+    
+    const callback = (res) => {
+      if (!transform) {
+        resolve(res)
+        return
+      }
+      if (res.code == 200) {
+        resolve(res.result)
+      }
+    }
+
+    api(key, data, callback, loadingTitle)
+  })
+}
+
+export default fetch
diff --git a/config.js b/config.js
index 4175d2b..d8c3365 100644
--- a/config.js
+++ b/config.js
@@ -1,6 +1,7 @@
 
 import Vue from 'vue'
 import api from '@/api/api.js'
+import fetch from '@/api/fetch.js'
 import utils from './utils/utils.js'
 
 import uvUI from '@/uni_modules/uv-ui-tools'
@@ -52,5 +53,6 @@ uni.$uv.setConfig({
 Vue.prototype.$config = utils.deepMergeObject(defaultConfig, config[type])
 
 Vue.prototype.$api = api
+Vue.prototype.$fetch = fetch
 
 export default Vue.prototype.$config
\ No newline at end of file
diff --git a/pages.json b/pages.json
index ece21b5..c4a5de1 100644
--- a/pages.json
+++ b/pages.json
@@ -140,6 +140,9 @@
 			},
 			{
 				"path": "checkup/checkupReport/index"
+			},
+			{
+				"path": "common"
 			}
 		]
 	}],
diff --git a/pages/index/center.vue b/pages/index/center.vue
index 012fcd2..8e208f1 100644
--- a/pages/index/center.vue
+++ b/pages/index/center.vue
@@ -26,8 +26,18 @@
 
 				<view class="card">
 					<view v-for="item in list1" :key="item.id">
-						<!-- todo: key -> custom -->
-						<view class="flex row" @click="onClick(item)">
+						<template v-if="item.key === 'service'">
+							<button plain class="flex btn-service" open-type="contact">
+								<view class="flex row">
+									<view class="flex label">
+										<image class="icon" :src="item.icon" mode="scaleToFill"></image>
+										<view>{{ item.label }}</view>
+									</view>
+									<uv-icon name="arrow-right" color="#C6C6C6" size="24rpx"></uv-icon>
+								</view>			
+							</button>
+						</template>
+						<view v-else class="flex row" @click="onClick(item)">
 							<view class="flex label">
 								<image class="icon" :src="item.icon" mode="scaleToFill"></image>
 								<view>{{ item.label }}</view>
@@ -77,19 +87,17 @@
 			return {
 				list1: [
 					{ id: '001', label: '检测预约', icon: '/pages_order/static/center/icon-detectBook.png', path: '/pages_order/checkup/checkupRecords' },
-					// todo
 					{ id: '002', label: '联系客服', icon: '/pages_order/static/center/icon-service.png', key: 'service' },
-					// todo
-					{ id: '003', label: '服用说明', icon: '/pages_order/static/center/icon-instruc.png', path: '/pages_order/mine/instruc' },
-					// todo
-					{ id: '004', label: '用户须知', icon: '/pages_order/static/center/icon-userAgreement.png', path: '/pages_order/mine/userAgreement' },
+					// todo: check key
+					{ id: '003', label: '服用说明', icon: '/pages_order/static/center/icon-instruc.png', path: `/pages_order/common?key=instruc&title=服用说明` },
+					// todo: check key
+					{ id: '004', label: '用户须知', icon: '/pages_order/static/center/icon-userAgreement.png', path: `/pages_order/common?key=userAgreement&title=用户须知` },
 				],
 				list2: [
 					{ id: '005', label: '我的评价', icon: '/pages_order/static/center/icon-comment.png', key: 'comment' },
-					// todo
-					{ id: '006', label: '关于我们', icon: '/pages_order/static/center/icon-aboutUs.png', path: '/pages_order/mine/service' },
-					// todo
-					{ id: '007', label: '修改信息', icon: '/pages_order/static/center/icon-modifyInfo.png', path: '/pages_order/mine/instruc' },
+					// todo: check key
+					{ id: '006', label: '关于我们', icon: '/pages_order/static/center/icon-aboutUs.png', path: `/pages_order/common?key=aboutUs&title=关于我们` },
+					{ id: '007', label: '修改信息', icon: '/pages_order/static/center/icon-modifyInfo.png', path: `/pages_order/auth/wxUserInfo?mode=edit` },
 					{ id: '008', label: '退出登录', icon: '/pages_order/static/center/icon-logout.png', key: 'logout' },
 				],
 			}
@@ -225,4 +233,9 @@
 			}
 		}
 	}
+
+	.btn-service {
+		border: none;
+		padding: 0;
+	}
 </style>
\ No newline at end of file
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 689a64c..51b5c63 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -73,6 +73,9 @@
 		},
 		onLoad() {
 
+			// todo: delete
+			// this.$utils.navigateTo('/pages_order/auth/facialVerify')
+
 			this.productSwiperList = [
 				{ 
 					id: '001', 
diff --git a/pages_order/auth/wxUserInfo.vue b/pages_order/auth/wxUserInfo.vue
index f56675f..debdd23 100644
--- a/pages_order/auth/wxUserInfo.vue
+++ b/pages_order/auth/wxUserInfo.vue
@@ -1,100 +1,132 @@
 <template>
-	<view class="login">
-		
-		<view class="logo">
-			<image :src="configList.config_app_logo" mode=""></image>
-			<view class="text">
-				{{ configList.config_app_name }}
-			</view>
-		</view>
+  <view class="page__view">
 
-		<view class="title">
-			申请获取你的头像、昵称
-		</view>
+		<navbar title="修改信息" leftClick @leftClick="$utils.navigateBack" color="#191919" bgColor="#FFFFFF" />
 
-		<view class="form">
-			<view class="form-item">
-				<view class="label">
-					头像
-				</view>
-				<view class="content">
-					<button class="btn-avatar" :plain="true" :hairline="false" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
-						
-						<image :src="userInfoForm.headImage" v-if="userInfoForm.headImage" class="avatar"
-							mode=""></image>
+    <view class="main">
 
-						<view v-else class="avatar" style="background-color: #C7C7C7; border-radius: 50%;">
-							<uv-icon name="account-fill" color="#ffffff" size="70rpx"></uv-icon>
+      <view class="card">
+        <view class="card-header">个人信息</view>
+        <view class="form">
+          <uv-form 
+            ref="form"
+            :model="form"
+            :rules="rules"
+            errorType="toast"
+          >
+						<view class="form-item">
+							<uv-form-item prop="nickName" :customStyle="formItemStyle">
+								<view class="form-item-label">昵称</view>
+								<view class="form-item-content input">
+									<formInput v-model="form.nickName"></formInput>
+								</view>
+							</uv-form-item>
 						</view>
-						
-					</button>
-				</view>
-			</view>
-			<view class="form-item">
-				<view class="label">
-					昵称
-				</view>
-				<view class="content">
-					<input type="nickname" placeholder="请输入昵称" style="text-align: right;" id="nickName"
-						placeholder-class="uni-placeholder"
-						v-model="userInfoForm.nickName" 
-					/>
-				</view>
-			</view>
-			<view class="form-item">
-				<view class="label">
-					手机号
-				</view>
-				<view class="content">
-					<input v-if="userInfoForm.phone" 
-						placeholder-class="uni-placeholder"
-						placeholder="请输入手机号" 
-						style="text-align: right;"
-						disabled
-						v-model="userInfoForm.phone" 
-					/>
-					<view v-else>
-						<button
-						 :plain="true" :hairline="false"
-							class="btn-phone"
-							open-type="getPhoneNumber" 
-							@getphonenumber="getPhone"
-						>
-							获取电话号码
-						</button>
-					</view>
+						<view class="form-item">
+							<uv-form-item prop="phone" :customStyle="formItemStyle">
+								<view class="form-item-label">电话</view>
+								<view class="form-item-content input">
+									<formInput v-if="form.phone" v-model="form.phone"></formInput>
+									<view v-else>
+										<button
+											class="btn btn-phone"
+											open-type="getPhoneNumber" 
+											@getphonenumber="getPhone"
+										>
+											<view class="text placeholder">获取电话号码</view>
+										</button>
+									</view>
+								</view>
+							</uv-form-item>
+						</view>
+						<view class="form-item">
+							<uv-form-item prop="phone" :customStyle="formItemStyle">
+								<view class="form-item-label">头像</view>
+								<view class="form-item-content input">
+									<button class="btn btn-avatar" :plain="true" :hairline="false" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
+										<view v-if="form.headImage" class="avatar">
+											<image class="img" :src="form.headImage" mode="aspectFill"></image>
+											<view class="flex mask">
+	        							<image class="icon" src="@/pages_order/static/center/icon-change.png" mode="widthFix" />
+											</view>
+										</view>
+										<view v-else class="flex avatar is-empty">
+        							<image class="icon" src="@/pages_order/static/comment/icon-plus.png" mode="widthFix" />
+										</view>
+									</button>
+								</view>
+							</uv-form-item>
+						</view>
+					</uv-form>
 				</view>
 			</view>
-		</view>
-		
-		<view class="btn" @click="submit">
-			确认
-		</view>
-	</view>
+    </view>
+  
+    <view class="bottom">
+      <button class="btn" @click="onSubmit">保存</button>
+    </view>
+
+  </view>
+	
 </template>
 
 <script>
+	import { mapState } from 'vuex'
+
+  import formInput from '@/pages_order/components/formInput.vue'
+
 	export default {
+    components: {
+      formInput,
+    },
+		props: {
+			mode: {
+				type: String,
+				default: null,
+			}
+		},
 		data() {
 			return {
-				userInfoForm: {
-					headImage: '',
-					nickName: '',
-					phone: '',
-				}
-			};
+        form: {
+          nickName: null,
+          phone: null,
+          headImage: null,
+				},
+        rules: {
+          'nickName': {
+            type: 'string',
+            required: true,
+            message: '请输入昵称',
+          },
+          'phone': {
+            type: 'string',
+            required: true,
+            message: '请输入手机号',
+          },
+          'headImage': {
+            type: 'array',
+            required: true,
+            message: '请选择头像',
+          },
+        },
+        formItemStyle: { padding: 0 },
+			}
 		},
-		onShow() {},
-		onLoad() {
-			this.userInfoForm.nickName = this.userInfo.nickName || ''
-			this.userInfoForm.headImage = this.userInfo.headImage || ''
+		computed: {
+			...mapState(['userInfo']),
+		},
+		onLoad(arg) {
+			this.mode = arg.mode
+
+			this.form.nickName = this.userInfo.nickName || ''
+			this.form.phone = this.userInfo.phone || ''
+			this.form.headImage = this.userInfo.headImage || ''
 		},
-		computed: {},
 		methods: {
 			onChooseAvatar(res) {
 				this.$Oss.ossUpload(res.target.avatarUrl)
 				.then(url => {
-					this.userInfoForm.headImage = url
+					this.form.headImage = url
 				})
 			},
 			getPhone(e){
@@ -105,7 +137,7 @@
 						let phoneObj = JSON.parse(res.result)
 						
 						if(phoneObj.errmsg == 'ok'){
-							this.userInfoForm.phone = phoneObj.phone_info.phoneNumber
+							this.form.phone = phoneObj.phone_info.phoneNumber
 						}else{
 							uni.showModal({
 								title: phoneObj.errmsg
@@ -114,171 +146,231 @@
 					}
 				})
 			},
-			submit() {
-				let self = this
-
-				uni.createSelectorQuery().in(this)
-					.select("#nickName")
-					.fields({
-						properties: ["value"],
-					})
-					.exec((res) => {
-						const nickName = res?.[0]?.value
-						self.userInfoForm.nickName = nickName
-						
-						if (self.$utils.verificationAll(self.userInfoForm, {
-								headImage: '请选择头像',
-								nickName: '请填写昵称',
-								phone: '请填写手机号',
-							})) {
-							return
-						}
+      async onSubmit() {
+        try {
+          await this.$refs.form.validate()
+
+					const {
+						nickName,
+						phone,
+						headImage,
+					} = this.form
+					
+					const params = {
+						nickName,
+						phone,
+						headImage,
+					}
+
+					const res = await this.$fetch('updateInfo', params, false)
+					
+					if (res.code == 200) {
 						
-						self.$api('updateInfo', {
-							headImage : self.userInfoForm.headImage,
-							nickName : self.userInfoForm.nickName,
-							phone : self.userInfoForm.phone,
-						}, res => {
-							if (res.code == 200) {
-								uni.reLaunch({
-									url:'/pages/index/index'
-								})
+						uni.showToast({
+							icon: 'success',
+							title: '保存成功',
+						});
+
+						this.$store.commit('getUserInfo')
+
+						setTimeout(() => {
+							if (this.mode === 'edit') {
+								this.$utils.navigateBack()
+								return
 							}
-						})
-					})
-				
-			},
-		}
+							uni.reLaunch({
+								url:'/pages/index/index'
+							})
+						}, 800)
+					}
+
+        } catch (err) {
+          console.log('onSubmit err', err)
+        }
+      },
+		},
 	}
 </script>
 
 <style lang="scss" scoped>
-	.login {
-		display: flex;
-		justify-content: flex-start;
-		align-items: center;
-		height: 100vh;
-		flex-direction: column;
-		position: relative;
 
-		background: $uni-fg-color;
+	.page__view {
+		width: 100vw;
+		min-height: 100vh;
+		background-color: $uni-bg-color;
+		position: relative;
 		
-		.logo{
-			margin-top: 334rpx;
-			width: 320rpx;
-			image{
-				height: 150rpx;
-				width: 320rpx;
-			}
-			.text{
-				margin-top: 90rpx;
-				font-size: 38rpx;
-				font-family: PingFang SC, PingFang SC-Bold;
-				font-weight: 700;
-				text-align: center;
-				color: #000000;
-			}
+		/deep/ .nav-bar__view {
+			position: fixed;
+			top: 0;
+			left: 0;
+		}
+	}
+
+	.main {
+		padding: calc(var(--status-bar-height) + 144rpx) 32rpx 224rpx 32rpx;
+	}
+
+	.card {
+		padding: 32rpx;
+		background: #FAFAFF;
+		border: 2rpx solid #FFFFFF;
+		border-radius: 32rpx;
+
+		& + & {
+			margin-top: 40rpx;
 		}
 
-		.title {
-			margin-top: 48rpx;
+		&-header {
+			font-family: PingFang SC;
+			font-weight: 500;
+			font-size: 36rpx;
+			line-height: 1.4;
+			color: #252545;
+			margin-bottom: 32rpx;
+		}
+	}
+
+	.row {
+		justify-content: space-between;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 1.4;
+		column-gap: 24rpx;
+
+		& + & {
+			margin-top: 32rpx;
+		}
+
+		&-label {
+			flex: none;
+			font-size: 26rpx;
+			color: #8B8B8B;
+		}
+
+		&-content {
 			font-size: 32rpx;
-			font-family: PingFang SC, PingFang SC-Regular;
-			font-weight: 400;
-			color: #000000;
+			color: #181818;
 		}
+	}
 
-		.form {
-			margin-top: 45rpx;
-			width: 100%;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-
-			.form-item {
-				width: 85%;
-				display: flex;
-				align-items: baseline;
-				padding: 11rpx 23rpx;
-
-				position: relative;
-
-				&::after {
-					position: absolute;
-					bottom: 0;
-					left: 0;
-					content: " ";
-					width: 100%;
-					height: 1rpx;
-					border-top: 1px solid rgba(112, 112, 112, 0.35);
-					transform: scaleY(.5);
-				}
+	.form {
+		padding: 8rpx 0 0 0;
 
-				.label {
-					width: 90rpx;
-					font-size: 30rpx;
-					font-family: SimSun, SimSun-Regular;
-					font-weight: 400;
-					text-align: left;
-					color: #000000;
-				}
+		&-item {
+			border-bottom: 2rpx solid #EEEEEE;
 
-				.content {
-					flex: 1;
-					text-align: right;
-				}
+			&:last-child {
+				border: none;
 			}
 
-			.form-item + .form-item {
-				margin-top: 50rpx;
+			& + & {
+				margin-top: 40rpx;
 			}
 
-			.btn-avatar {
-				background: transparent;
-				border: none;
-				border-radius: none;
-				box-shadow: none;
-				padding: 0;
-				margin: 0;
-				font-size: 0;
-				text-align: right;
+			&-label {
+				font-family: PingFang SC;
+				font-weight: 400;
+				font-size: 26rpx;
+				line-height: 1.4;
+				color: #181818;
 			}
 
-			.avatar {
-				display: inline-block;
-				width: 70rpx;
-				height: 70rpx;
-				margin-right: 63rpx;
+			&-content {
+				margin-top: 14rpx;
+				padding: 6rpx 0;
+
+				.text {
+					padding: 2rpx 0;
+					font-family: PingFang SC;
+					font-weight: 400;
+					font-size: 32rpx;
+					line-height: 1.4;
+
+					&.placeholder {
+						color: #C6C6C6;
+					}
+				}
 			}
+		}
+	}
 
-			.btn-phone {
-				border: none;
-				border-radius: 0;
-				padding: 7rpx;
-				margin: 0;
-				text-align: right;
-				color: #C7C7C7;
-				font-size: 30rpx;
-				line-height: 1;
+	.btn-phone {
+		text-align: left;
+		font-family: PingFang SC;
+		font-weight: 400;
+		font-size: 32rpx;
+		line-height: 1.4;
+		color: #393939;
+	}
+
+	.btn-avatar {
+		display: inline-block;
+		width: auto;
+		border: none;
+	}
+
+	.avatar {
+		position: relative;
+		width: 200rpx;
+		height: 200rpx;
+		border-radius: 24rpx;
+		overflow: hidden;
+
+		.img {
+			width: 100%;
+			height: 100%;
+		}
+		
+		.mask {
+			position: absolute;
+			top: 0;
+			left: 0;
+			width: 100%;
+			height: 100%;
+			background: #00000080;
+			border-radius: 24rpx;
+
+			.icon {
+				width: 64rpx;
+				height: 64rpx;
+			}
+		}
+
+		&.is-empty {
+			background: #F3F2F7;
+			
+			.icon {
+				width: 61rpx;
+				height: auto;
 			}
 
 		}
+	}
+
+	.bottom {
+		position: fixed;
+		left: 0;
+		bottom: 0;
+
+		width: 100vw;
+		height: 200rpx;
+		padding: 24rpx 40rpx;
+		background: #FFFFFF;
+		box-sizing: border-box;
 
 		.btn {
-			text-align: center;
-			margin-top: 155rpx;
-				
-			width: 80%;
-			height: 100rpx;
-			border-radius: 50rpx;
-			background-image: linear-gradient(to right, #84A73F, #D8FF8F);
-			color: #fff;
-			
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			border-radius: 50rpx;
-			border: none;
+			width: 100%;
+			padding: 16rpx 0;
+			box-sizing: border-box;
+			font-family: PingFang SC;
+			font-weight: 500;
+			font-size: 36rpx;
+			line-height: 1;
+			color: #FFFFFF;
+			background-image: linear-gradient(to right, #4B348F, #845CFA);
+			border-radius: 41rpx;
 		}
 	}
-</style>
+
+</style>
\ No newline at end of file
diff --git a/pages_order/center/accountCard.vue b/pages_order/center/accountCard.vue
index 91a0278..74ecf4f 100644
--- a/pages_order/center/accountCard.vue
+++ b/pages_order/center/accountCard.vue
@@ -1,19 +1,42 @@
 <template>
-  <view class="flex card">
-    <view class="flex label">
-      <image class="icon" src="/pages_order/static/center/icon-wx.png" mode="scaleToFill"></image>
-      <view>官方微信公众号</view>
+  <view>
+
+    <view class="flex card">
+      <view class="flex label">
+        <image class="icon" src="/pages_order/static/center/icon-wx.png" mode="scaleToFill"></image>
+        <view>官方微信公众号</view>
+      </view>
+      <button class="flex btn" @click="openPopup">
+        <text class="btn-text">即刻关注</text>
+        <uv-icon name="arrow-right" color="#C6C6C6" size="24rpx"></uv-icon>
+      </button>
     </view>
-    <button class="flex btn">
-      <text class="btn-text">即刻关注</text>
-      <uv-icon name="arrow-right" color="#C6C6C6" size="24rpx"></uv-icon>
-    </button>
+
+    <popupQrCode ref="popup" :src="qrCodeUrl"></popupQrCode>
   </view>
 </template>
 
 <script>
-  export default {
+	import { mapState } from 'vuex'
 
+  import popupQrCode from './popupQrCode.vue';
+
+  export default {
+    components: {
+      popupQrCode,
+    },
+		computed: {
+			...mapState(['configList']),
+      qrCodeUrl() {
+        // todo: check key
+        return this.configList['account']
+      },
+		},
+    methods: {
+      openPopup() {
+        this.$refs.popup.open()
+      },
+    },
   }
 </script>
 
diff --git a/pages_order/center/popupQrCode.vue b/pages_order/center/popupQrCode.vue
new file mode 100644
index 0000000..dd23646
--- /dev/null
+++ b/pages_order/center/popupQrCode.vue
@@ -0,0 +1,56 @@
+<template>
+  <uv-popup 
+    ref="popup"
+    :overlayOpacity="0.8"
+    mode="bottom"
+    round="20rpx"
+    :zIndex="1000000"
+  >
+    <view class="flex qr-popup">
+      <text class="tips">即刻关注</text>
+      <image class="qr" :src="src" :show-menu-by-longpress="true"></image>
+    </view>
+  </uv-popup>
+</template>
+
+<script>
+	export default {
+    props: {
+      src: {
+        type: String,
+        default: null
+      }
+    },
+		data() {
+			return {
+      }
+    },
+    methods: {
+      open() {
+        this.$refs.popup.open();
+      },
+      close() {
+        this.$refs.popup.close();
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+.qr-popup {
+  flex-direction: column;
+
+  padding-bottom: 104rpx;
+
+  .tips {
+    margin-top: 75rpx;
+    color: #1B1B1B;
+    font-size: 32rpx;
+  }
+  .qr {
+    margin-top: 40rpx;
+    width: 350rpx;
+    height: 350rpx;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/pages_order/center/reportCard.vue b/pages_order/center/reportCard.vue
index 2dfb7d9..1f5e41b 100644
--- a/pages_order/center/reportCard.vue
+++ b/pages_order/center/reportCard.vue
@@ -2,7 +2,7 @@
   <view class="card">
     <view class="flex header">
       <view class="title">体检报告</view>
-      <button class="btn">体检入口</button>
+      <button class="btn" @click="$utils.navigateTo('/pages_order/checkup/checkupRecords')">体检入口</button>
     </view>
     <view class="flex cols">
       <view class="flex flex-column col score">
diff --git a/pages_order/checkup/checkupBook/apply.vue b/pages_order/checkup/checkupBook/apply.vue
index db855ed..f75abc1 100644
--- a/pages_order/checkup/checkupBook/apply.vue
+++ b/pages_order/checkup/checkupBook/apply.vue
@@ -510,6 +510,11 @@
 
           // todo
           
+          uni.showToast({
+            icon: 'success',
+            title: '提交成功',
+          });
+          
           setTimeout(() => {
             // todo: check
             // this.$utils.navigateBack()
diff --git a/pages_order/common.vue b/pages_order/common.vue
new file mode 100644
index 0000000..0fbdd32
--- /dev/null
+++ b/pages_order/common.vue
@@ -0,0 +1,55 @@
+<template>
+  <view class="page__view">
+
+		<navbar title="修改信息" leftClick @leftClick="$utils.navigateBack" color="#191919" bgColor="#FFFFFF" />
+
+    <view class="main">
+			<uv-parse :content="content"></uv-parse>
+    </view>
+
+  </view>
+	
+</template>
+
+<script>
+	import { mapState } from 'vuex'
+
+	export default {
+		computed: {
+			...mapState(['configList']),
+		},
+		data() {
+			return {
+				title : '',
+				content : '',
+			}
+		},
+		onLoad(arg) {
+			const { key, title } = arg
+
+			this.title = title
+			this.content = this.configList[key]
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+
+	.page__view {
+		width: 100vw;
+		min-height: 100vh;
+		background-color: $uni-bg-color;
+		position: relative;
+		
+		/deep/ .nav-bar__view {
+			position: fixed;
+			top: 0;
+			left: 0;
+		}
+	}
+
+	.main {
+		padding-top: calc(var(--status-bar-height) + 120rpx);
+	}
+
+</style>
\ No newline at end of file
diff --git a/pages_order/order/orderDetail.vue b/pages_order/order/orderDetail.vue
deleted file mode 100644
index 8ca27b7..0000000
--- a/pages_order/order/orderDetail.vue
+++ /dev/null
@@ -1,567 +0,0 @@
-<template>
-	<view>
-		<navbar
-		title="订单详情"
-		leftClick 
-		@leftClick="$utils.navigateBack"
-		/>
-		
-		<!-- 水洗店 -->
-		<view class=""
-		v-if="userShop">
-			<view class="controls">
-				<view class="title">
-					<image src="../static/order/icon.png" mode=""></image>
-					服务完成
-				</view>
-				<view class="tips">
-					待送回
-				</view>
-				<view class="btns">
-					<view class="btn1">
-						快递寄回
-					</view>
-					<view class="btn2">
-						线下配送
-					</view>
-				</view>
-			</view>
-			<view class="steps">
-				<uv-steps 
-				activeColor="#FD5100"
-				:current="stepsCurrent" dot>
-					<uv-steps-item :title="item"
-					:key="index"
-					v-for="(item, index) in steps"></uv-steps-item>
-				</uv-steps>
-			</view>
-		</view>
-		
-		<!-- 酒店和水洗店 -->
-		<view class="info">
-			<view class="flex"
-			style="display: flex;">
-				<view style="width: 8rpx;height: 30rpx;
-				background: #FD5100;border-radius: 6rpx;" />
-				<view class="head-title">服务项目</view>
-			</view>
-		
-			<view class="flex">
-				<view class="server-item">
-					
-					<view class="img-box">
-						<image :src="msgShop.image" mode="aspectFill"></image>
-					</view>
-					
-					<view class="server-info">
-						
-						<view class="server-title">
-							{{msgOrder.projectName}}
-							<!-- <view class="coupon">领券立减</view> -->
-						</view>
-						
-						<view class="current-price">
-							<text class="unit">￥</text>{{msgOrder.money}}
-						</view>
-						
-						<view class="sales-volume" style="margin-top: 5px;">
-							<view class="desc">规格：{{msgOrder.unit}}</view>
-						</view>
-						
-						<view class="time-coupon">
-							
-							<!-- <view class="flex">
-								<image src="@/static/home/time-icon.png"></image>
-								<view class="time">{{msgOrder.useTime}}分钟</view>
-							</view> -->
-							
-							<!-- <view class="sales-volume">
-								<image src="@/static/icons/icon1.png"></image>
-								<view class="desc">已售出{{msgShop.payNum}}+单</view>
-							</view> -->
-							
-						</view>
-						
-					</view>
-					
-				</view>
-			</view>
-		
-			<!-- <view class="line min_tips">
-				<view class="head-div flex">
-					<view style="width: 118rpx;height: 118rpx;border-radius: 50%;overflow: hidden;">
-						<image style="width: 118rpx;" :src="msgTechnician.image" mode="widthFix"></image>
-					</view>
-					<view style="padding: 10rpx 34rpx;display: flex;flex-direction: column;justify-content: space-around;">
-						<view class="nickname">
-							{{msgTechnician.title}}
-							<view v-if="msgTechnician.isVip" class="tag">
-								<image src="@/static/order/s.png" mode="aspectFit"></image>
-								<view class="auth">官方认证</view>
-							</view>
-						</view>
-						<view class="days">
-							<van-rate v-model="msgTechnician.score" :size="10" readonly color="#ffb54c" void-icon="star"
-								void-color="#eee" />
-							<view class="">
-								好评{{msgTechnician.pinNum}}
-							</view>
-						</view>
-					</view>
-				</view>
-				<view @click="gototechnicianDetail(msgTechnician)" class="btn-x">
-					服务技师
-				</view>
-			</view> -->
-		
-			<view class="line address">
-				<view class="address-top">
-					<!-- <view class="">
-						服务地址
-					</view> -->
-					<view class="copy">
-						<image @click="copy(msgOrder.name + ' ' + msgOrder.phone + ' ' + msgOrder.address)" src="/static/order/copy.png"></image>
-					</view>
-				</view>
-				<view class="addressDetail">
-					<view class="">{{msgOrder.name}} {{msgOrder.phone}}</view>
-					<view class="">{{msgOrder.address}}</view>
-				</view>
-			</view>
-		
-		
-			<view class="line">
-				<view class="t min_tips">
-					<view class="">
-						实付款
-					</view>
-					<view class="current-price">
-						￥{{ msgOrder.money }}
-					</view>
-				</view>
-				<view class="min_tips">
-					<view class="">
-						租赁费用
-					</view>
-					<view class="">
-						￥{{ msgOrder.price }}
-					</view>
-				</view>
-				<view class="min_tips">
-					<view class="">
-						水洗费用
-					</view>
-					<view class="">
-						￥{{ msgOrder.price}}
-					</view>
-				</view>
-				<view class="min_tips">
-					<view class="">
-						押金
-					</view>
-					<view class="">
-						￥{{ msgOrder.price }}
-					</view>
-				</view>
-			</view>
-		
-			<!-- 订单信息 -->
-			<view class="line">
-				<view class="t min_tips">
-					<view class="">
-						订单信息
-					</view>
-				</view>
-				<view class="min_tips">
-					<view class="">
-						订单编号
-					</view>
-					<view class="">
-						{{msgOrder.id}}
-					</view>
-				</view>
-				<view class="min_tips">
-					<view class="">
-						下单时间
-					</view>
-					<view class="">
-						{{msgOrder.createTime}}
-					</view>
-				</view>
-			</view>
-		
-		
-			<!-- 下单须知 -->
-			<view class="line">
-				<view class="t min_tips">
-					<view class="">
-						下单须知
-					</view>
-				</view>
-				<view class="min_tips" style="line-height: 40rpx;">
-					{{msgShop.projectExplain}}
-				</view>
-				<view class="btns">
-					<view @click="clickService" class="btn">
-						联系客服
-					</view>
-				</view>
-			</view>
-		
-		</view>
-	</view>
-</template>
-
-<script>
-	import { mapGetters } from 'vuex'
-	export default {
-		computed : {
-			...mapGetters(['userShop']),
-		},
-		data() {
-			return {
-				stepsCurrent : 0,
-				steps : [
-					'接单',
-					'检查',
-					'开始清洗',
-					'服务完成',
-				],
-				msgShop : {
-					money : 99.99,
-					image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg',
-					projectExplain : '1.xxxxxxxxxx xxxxxxxxxx。2.xxxxxx xxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxx xxxxxxxxxxxxxxxx。3.。',
-				},
-				msgOrder : {
-					money : 99.99,
-					address : '广东省广州市越秀区城南故事C3栋2802',
-					name : '李**',
-					phone : '150*****091',
-					unit : '120*40*75【桌子尺寸】',
-					state_dictText : '已完成',
-					price : 199.99,
-					id : '020644568964457',
-					createTime : '2024-01-18  15:39',
-					projectName : '桌布租赁'
-				},
-			}
-		},
-		methods: {
-			
-		}
-	}
-</script>
-
-<style scoped lang="scss">
-	.order {
-		background: linear-gradient(#4899a6, #6fc6ad, #6fc6ad);
-		padding-bottom: 10px;
-	}
-	
-	.controls{
-		margin: 20rpx;
-		background-color: #fff;
-		height: 400rpx;
-		display: flex;
-		flex-direction: column;
-		width: 710rpx;
-		border-radius: 20rpx;
-		justify-content: center;
-		align-items: center;
-		.title{
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			font-size: 40rpx;
-			image{
-				width: 100rpx;
-				height: 100rpx;
-				margin-right: 20rpx;
-			}
-		}
-		.tips{
-			font-size: 26rpx;
-			color: #FD5100;
-			margin-top: 10rpx;
-		}
-		.btns{
-			margin-top: 50rpx;
-			display: flex;
-			view{
-				margin: 0 20rpx;
-				display: flex;
-				justify-content: center;
-				align-items: center;
-				color: #fff;
-				background-color: $uni-color;
-				padding: 15rpx 40rpx;
-				border-radius: 40rpx;
-			}
-			.btn2{
-				background-color: #FFFFFF;
-				border: 1px solid #A7A7A7;
-				color: #A7A7A7;
-			}
-		}
-	}
-	.steps{
-		margin: 20rpx;
-		background-color: #fff;
-		display: flex;
-		flex-direction: column;
-		width: 710rpx;
-		border-radius: 20rpx;
-		padding: 70rpx 0;
-		/deep/ .uv-text__value{
-			font-size: 22rpx !important;
-		}
-	}
-
-	.box {
-		padding: 20px;
-
-		.btns {
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			margin-top: 10px;
-
-			.btn {
-				color: #fff;
-				padding: 10rpx 50rpx;
-				background-color: #ffb300;
-				border-radius: 30rpx;
-				font-size: 25rpx;
-				margin-right: 10rpx;
-			}
-			
-			.btc{
-				background: #ccc;
-			}
-		}
-	}
-
-	.info {
-		margin: 10px;
-		padding: 20rpx;
-		background-color: #fff;
-		width: calc(100% - 40px);
-		border-radius: 10px;
-
-		.head-title {
-			font-family: PingFang SC, PingFang SC-Bold;
-			color: #2f2e2e;
-			line-height: 30rpx;
-			margin-left: 10rpx;
-		}
-
-		.server-item {
-			display: flex;
-			flex-wrap: wrap;
-			align-items: center;
-			justify-content: space-between;
-			background: white;
-			border-radius: 15rpx;
-			box-sizing: border-box;
-			margin: 20rpx 0rpx;
-			width: 100%;
-
-			.img-box {
-				width: 150rpx;
-				height: 150rpx;
-				border-radius: 10rpx;
-				overflow: hidden;
-
-				image {
-					width: 100%;
-					height: 100%;
-				}
-			}
-
-			.server-info {
-				display: flex;
-				flex-direction: column;
-				justify-content: space-around;
-				width: calc(100% - 180rpx);
-				box-sizing: border-box;
-				padding: 10rpx 15rpx;
-
-				.server-title {
-					display: flex;
-					margin-bottom: 10rpx;
-				}
-
-				.coupon {
-					display: flex;
-					justify-content: center;
-					align-items: center;
-					background: #F29E45;
-					color: white;
-					width: 120rpx;
-					height: 40rpx;
-					border-radius: 10rpx;
-					margin-left: 10rpx;
-					font-size: 22rpx;
-				}
-
-				.time-coupon,
-				.price {
-					display: flex;
-					flex-wrap: wrap;
-					align-items: center;
-				}
-
-				.time-coupon {
-					margin: 10rpx 0rpx;
-					font-size: 26rpx;
-					justify-content: space-between;
-					width: 100%;
-
-					.flex {
-						justify-content: center;
-						align-items: center;
-					}
-
-					image {
-						width: 25rpx;
-						height: 25rpx;
-					}
-
-					.time {
-						color: #B8B8B8;
-						margin-left: 6rpx;
-					}
-				}
-
-				.sales-volume {
-					display: flex;
-					align-items: center;
-					color: #B8B8B8;
-					font-size: 24rpx;
-
-					image {
-						width: 25rpx;
-						height: 25rpx;
-					}
-				}
-			}
-		}
-
-		.address {
-			
-			.address-top{
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				
-				image{
-					width: 30rpx;
-					height: 30rpx;
-				}
-			}
-			
-			.addressDetail {
-				color: #777;
-				font-size: 22rpx;
-				padding: 5px 0;
-			}
-
-			text {
-				background-color: #F29E45;
-				padding: 8rpx 10rpx;
-				color: #fff;
-				font-size: 20rpx;
-				margin-left: 10px;
-				border-radius: 5px;
-			}
-		}
-
-		.min_tips {
-			font-size: 22rpx;
-			color: #777;
-			display: flex;
-			justify-content: space-between;
-			padding: 5px 0;
-			align-items: center;
-		}
-
-		.current-price {
-			font-size: 30rpx;
-			color: #FD5100;
-		}
-
-		.line {
-			border-top: 2px dotted #00000011;
-			padding: 20rpx 0;
-
-			.t {
-				padding: 5px 0;
-				color: #000;
-				font-size: 26rpx;
-			}
-		}
-
-		.head-div {
-			.nickname {
-				font-size: 30rpx;
-				font-weight: 600;
-				text-align: left;
-				line-height: 42rpx;
-				display: flex;
-				align-items: center;
-
-				.tag {
-					position: relative;
-					display: flex;
-					align-items: center;
-					
-					image {
-						height: 45rpx;
-						width: 90rpx;
-						vertical-align: middle;
-					}
-					
-					.auth {
-						position: absolute;
-						white-space: nowrap;
-						color: #FF6200;
-						left: 23rpx;
-						font-size: 17rpx;
-					}
-				}
-			}
-
-			.days {
-				font-size: 20rpx;
-				font-weight: 400;
-				text-align: left;
-				line-height: 56rpx;
-				display: flex;
-				align-items: center;
-
-				view {
-					padding-left: 5px;
-				}
-			}
-		}
-
-		.btn-x {
-			color: #6fc6ad;
-			border: 1px solid #6fc6ad;
-			padding: 10rpx 20rpx;
-			border-radius: 30rpx;
-		}
-
-		.btns {
-			display: flex;
-			justify-content: center;
-
-			.btn {
-				color: #6fc6ad;
-				border: 1px solid #6fc6ad;
-				padding: 10rpx 20rpx;
-				border-radius: 30rpx;
-			}
-		}
-	}
-</style>
diff --git a/pages_order/product/styles/tab.scss b/pages_order/product/styles/tab.scss
index 357ca74..8c8ffc2 100644
--- a/pages_order/product/styles/tab.scss
+++ b/pages_order/product/styles/tab.scss
@@ -83,4 +83,8 @@
 
 .section {
   margin-top: 48rpx;
+
+  &-header {
+    margin-bottom: 16rpx;
+  }
 }
diff --git a/pages_order/product/tabCourse/index.vue b/pages_order/product/tabCourse/index.vue
index d0a4ad9..a83d631 100644
--- a/pages_order/product/tabCourse/index.vue
+++ b/pages_order/product/tabCourse/index.vue
@@ -22,14 +22,16 @@
     </view>
 
     <view class="section">
-      <!-- todo -->
-      <sectionHeader :title="`直播 · 05月11日 12:00`" @showAll="jumpToLive"></sectionHeader>
+      <view class="section-header">
+        <!-- todo -->
+        <sectionHeader :title="`直播 · 05月11日 12:00`" @showAll="jumpToLive"></sectionHeader>
+      </view>
       <view style="padding: 0 32rpx;">
         <courseLiveCard v-for="item in liveList" :key="item.id" :data="item"></courseLiveCard>
       </view>
     </view>
     <view class="section">
-      <sectionHeader style="padding-bottom: 16rpx;" title="推荐课程" @showAll="jumpToRecommendCourse"></sectionHeader>
+      <sectionHeader title="推荐课程" @showAll="jumpToRecommendCourse"></sectionHeader>
       <courseRecommendView></courseRecommendView>
     </view>
   </view>
diff --git a/pages_order/product/tabDetect/index.vue b/pages_order/product/tabDetect/index.vue
index f4c2a84..050c084 100644
--- a/pages_order/product/tabDetect/index.vue
+++ b/pages_order/product/tabDetect/index.vue
@@ -36,15 +36,21 @@
     </view>
 
     <view class="section">
-      <sectionHeader title="推荐检测" @showAll="jumpToRecommendDetect"></sectionHeader>
+      <view class="section-header">
+        <sectionHeader title="推荐检测" @showAll="jumpToRecommendDetect"></sectionHeader>
+      </view>
       <detectRecommendSwiper></detectRecommendSwiper>
     </view>
     <view class="section">
-      <sectionHeader title="个性化检测包" @showAll="jumpToPersonalDetect"></sectionHeader>
+      <view class="section-header">
+        <sectionHeader title="个性化检测包" @showAll="jumpToPersonalDetect"></sectionHeader>
+      </view>
       <detectPackageViewVue></detectPackageViewVue>
     </view>
     <view class="section">
-      <sectionHeader title="自选检测" @showAll="jumpToCustomDetect"></sectionHeader>
+      <view class="section-header">
+        <sectionHeader title="自选检测" @showAll="jumpToCustomDetect"></sectionHeader>
+      </view>
       <detectCustomView></detectCustomView>
     </view>
   </view>
diff --git a/pages_order/product/tabNutrient/index.vue b/pages_order/product/tabNutrient/index.vue
index f331ea7..c541acc 100644
--- a/pages_order/product/tabNutrient/index.vue
+++ b/pages_order/product/tabNutrient/index.vue
@@ -36,11 +36,13 @@
     </view>
 
     <view class="section">
-      <sectionHeader title="推荐产品" @showAll="jumpToRecommendNutrient"></sectionHeader>
+      <view class="section-header">
+        <sectionHeader title="推荐产品" @showAll="jumpToRecommendNutrient"></sectionHeader>
+      </view>
       <nutrientRecommendSwiper></nutrientRecommendSwiper>
     </view>
     <view class="section section-custom">
-      <sectionHeader style="padding-bottom: 16rpx;" title="自选补剂" @showAll="jumpToCustomNutrient"></sectionHeader>
+      <sectionHeader title="自选补剂" @showAll="jumpToCustomNutrient"></sectionHeader>
       <nutrientCustomView></nutrientCustomView>
     </view>
   </view>
diff --git a/pages_order/static/center/icon-change.png b/pages_order/static/center/icon-change.png
new file mode 100644
index 0000000..7c1b4a2
Binary files /dev/null and b/pages_order/static/center/icon-change.png differ
diff --git a/store/store.js b/store/store.js
index 0f9dc2c..863ef4a 100644
--- a/store/store.js
+++ b/store/store.js
@@ -93,7 +93,10 @@ const store = new Vuex.Store({
 		// 退出登录
 		logout(state){
 			uni.showModal({
-				title: '确认退出登录吗',
+				title: '退出登录',
+				content: '确认要退出登录吗',
+				cancelColor: '#393939',
+				confirmColor: '#7451DE',
 				success(r) {
 					if(r.confirm){
 						state.userInfo = {}