移动官网

store/src/admin/home/console.vue

@@ -0,0 +1,25 @@
+<template>
+  <view @click="goTo">aaa</view>
+</template>
+
+<script>
+export default {
+  name: "console",
+  data() {
+    return {};
+  },
+  onLoad() {
+
+  },
+  methods: {
+    goTo(){
+    this.$util.pageTo({
+      url: "/admin/official/index"
+    });      
+    }
+  }
+};
+</script>
+
+<style lang='scss' scoped>
+</style>

store/src/admin/home/routeTo.vue

@@ -1,20 +0,0 @@
-<template>
-  <view>
-    加载中...
-  </view>
-</template>
-
-<script>
-export default {
-  name: "routeTo",
-  components: {},
-  data() {
-    return {};
-  },
-  computed: {},
-  methods: {}
-};
-</script>
-
-<style lang="scss" scoped>
-</style>

store/src/admin/official/apply.vue

@@ -0,0 +1,317 @@
+<template>
+	<div class="app-content">
+		<form @submit="formSubmit">
+			<div class="module-com">
+				<tui-list-cell class="line-cell" :hover="false">
+					<div class="tui-title">花店名称</div>
+					<input v-model="form.name" placeholder-class="phcolor" class="tui-input" name="name" placeholder="请输入姓名" />
+				</tui-list-cell>
+				<tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="openAddres">
+					<div class="tui-title">花店地址</div>
+					<div class="tui-input" v-if="form.province">{{ form.province + '-' + form.city }}</div>
+					<div class="tui-placeholder" v-else>请选择</div>
+				</tui-list-cell>
+				<tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="selRegionFn">
+					<div class="tui-title">详细地址</div>
+					<div class="tui-input" v-if="form.address">{{ form.address }}</div>
+					<div class="tui-placeholder" v-else>请选择详细地址</div>
+				</tui-list-cell>
+				<tui-list-cell class="line-cell" :hover="false">
+					<div class="tui-title">门牌号</div>
+					<input v-model="form.floor" placeholder-class="phcolor" class="tui-input" name="floor" placeholder="楼号门牌号（选填）" />
+				</tui-list-cell>
+			</div>
+			<!-- 手机号 -->
+			<div class="module-com">
+				<tui-list-cell class="line-cell" :hover="false">
+					<div class="tui-title">手机号</div>
+					<input v-model="form.mobile" placeholder-class="phcolor" class="tui-input" name="mobile" placeholder="请输入" type="number" />
+				</tui-list-cell>
+				<tui-list-cell class="line-cell code-wrap" :hover="false">
+					<div class="tui-title">验证码</div>
+					<input v-model="form.code" placeholder-class="phcolor" class="tui-input" name="code" placeholder="请输入验证码" type="number" />
+					<div class="tui-code" v-if="isSend">{{ countDown + 's' }}</div>
+					<div class="tui-code" v-else @click="getCode">获取验证码</div>
+				</tui-list-cell>
+			</div>
+			<!-- 推荐人 -->
+			<div class="module-com recommend-wrap" v-if="!$util.isEmpty(merchantData)">
+				<div class="recommend-tag">推荐花店</div>
+				<div class="recommend-det">
+					<app-avatar-module :src="merchantData.smallLogoUrl" :width="78" alt="推荐人头像" />
+					<div class="recommend-info">
+						<div class="app-size-32">{{ merchantData.merchantName }}</div>
+						<div class="app-color-2">{{ merchantData.fullAddress }}</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="btn-wrap">
+				<button class="admin-button-com blue big" formType="submit">确认</button>
+			</div>
+			<!-- 选择地区 -->
+			<app-area-sel :show.sync="showRegion" @change="changeAreaFn" :city="form.city" />
+			<!-- 省市联动 -->
+			<simple-address ref="simpleAddress" :region="regionData" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onCityConfirm"></simple-address>
+		</form>
+	</div>
+</template>
+
+<script>
+	import TuiListCell from '@/components/plugin/list-cell'
+	import AppAreaSel from '@/components/app-area-sel'
+	import SimpleAddress from '@/components/plugin/simple-address'
+	import AppAvatarModule from '@/components/module/app-avatar'
+	const form = require('@/utils/formValidation.js')
+	// api
+	import { getIntroduce, applyRegister, sendSmsW, regionTree } from '@/api/official'
+	// import { getShopUser } from '@/utils/auth'
+	export default {
+		name: 'apply-data',
+		components: {
+			TuiListCell,
+			AppAreaSel,
+			SimpleAddress,
+			AppAvatarModule
+		},
+		data() {
+			return {
+				merchantData: {},
+				form: {
+					name: '',
+					mobile: '',
+					province: '',
+					city: '',
+					dist: '',
+					address: '',
+					floor: '',
+					longitude: '',
+					latitude: ''
+					// 推荐商家id
+					// oldId: ''
+				},
+				showRegion: false,
+				// 省市联动
+				regionData: [],
+				cityPickerValueDefault: [0, 0],
+				// 验证码
+				isSend: 0,
+				countDown: 119,
+				timer: null
+			}
+		},
+		onLoad() {
+			// if (!this.$util.isLogin()) {
+			// 	// getShopUser()
+			// 	return false
+			// }
+			// this.init()
+		},
+		methods: {
+			init() {
+				this.$util.getCheckLogin().then(res => {
+					if (res) {
+						// #ifdef H5
+						let id = sessionStorage.getItem('introMerchantId')
+						if (id) {
+							this._getMerchantDet()
+						}
+						// #endif
+						this._regionTree()
+					}
+				})
+			},
+			_regionTree() {
+				regionTree().then(res => {
+					this.regionData = res.data.tree
+				})
+			},
+			_getMerchantDet() {
+				// #ifdef H5
+				let id = sessionStorage.getItem('introMerchantId')
+				getIntroduce({ id: id }).then(res => {
+					this.merchantData = res.data
+				})
+				// #endif
+			},
+			// ==============
+			confirmFn() {
+				let id = sessionStorage.getItem('introMerchantId')
+				applyRegister({
+					// oldId: this.option.merchantId || 0,
+					introMerchantId: id || 0,
+					...this.form
+				}).then(res => {
+					uni.setStorageSync('officialApply', res.data)
+					this.$util.pageTo({
+						// url: '/official/pay',
+						url: '/official/callback',
+						type: 2,
+						query: {
+							pagestatus: 3
+							// orderSn: this.option.orderSn,
+							// payDiscountPrice: res.data.discountAmount
+						}
+					})
+				})
+			},
+			// 验证码
+			getCode() {
+				if (!this.form.mobile || !this.$util.checkMobile(this.form.mobile)) {
+					this.$msg('请输入正确的手机号！')
+					return false
+				}
+				this.isSend = 1
+				sendSmsW({
+					type: 1,
+					mobile: this.form.mobile
+				})
+					.then(res => {
+						this.beginCountDown()
+						this.$msg('发送成功！')
+					})
+					.catch(() => {
+						this.isSend = 0
+						this.$msg('发送失败！')
+					})
+			},
+			// 倒计时
+			beginCountDown() {
+				this.countDown = 119
+				this.timer = setInterval(() => {
+					if (this.countDown === 0) {
+						clearInterval(this.timer)
+						this.isSend = 0
+						return
+					}
+					this.countDown -= 1
+				}, 1000)
+			},
+			// 选择地址
+			selRegionFn() {
+				if (!this.form.city) {
+					this.$msg('请先选择地址！')
+					return false
+				}
+				this.showRegion = true
+				// let that = this
+				// uni.chooseLocation({
+				// 	success: (res) => {
+				// 		this.form.address = res.address
+				// 		this.form.latitude = res.latitude
+				// 		this.form.longitude = res.longitude
+				// 		console.log('位置名称：' + res.name)
+				// 		console.log('详细地址：' + res.address)
+				// 		console.log('纬度：' + res.latitude)
+				// 		console.log('经度：' + res.longitude)
+				// 	}
+				// })
+			},
+			changeAreaFn(e) {
+				console.log('changeAreaFn', e)
+				this.form.address = e.address
+				this.form.latitude = e.location.lat
+				this.form.longitude = e.location.lng
+			},
+			// -----
+			// 省市联动
+			openAddres() {
+				this.$refs.simpleAddress.open()
+			},
+			onCityConfirm(e) {
+				// this.form.receiveAddress = e.label
+				this.form.province = e.provinceName
+				this.form.city = e.cityName
+				// this.pickerText = JSON.stringify(e)
+			},
+			// 表单验证
+			formSubmit(e) {
+				// 表单规则
+				let rules = []
+				// 进行表单检查
+				let formData = e.detail.value
+				let checkRes = form.validation(formData, rules)
+				// 验证通过!
+				if (!checkRes) {
+					setTimeout(() => {
+						this.confirmFn()
+					})
+				} else {
+					this.$msg(checkRes)
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.module-com {
+		margin-bottom: 20px;
+		background-color: #fff;
+		.module-tit {
+			padding: 20px 18px;
+			font-size: 28px;
+			font-weight: 600;
+			border-bottom: 1px solid $borderColor;
+		}
+		.module-det {
+			padding: 0 30px;
+		}
+	}
+	// 公共
+	.line-cell {
+		.tui-title {
+			width: 210px;
+			color: $fontColor2;
+		}
+		.tui-input {
+			width: calc(100% - 210px);
+			font-size: 28px;
+		}
+		.tui-placeholder {
+			color: #ccc;
+		}
+		.phcolor {
+			color: #ccc;
+		}
+	}
+	.btn-wrap {
+		width: 90%;
+		margin: 60px auto;
+		.admin-button-com {
+			width: 100%;
+			margin: 0 auto;
+		}
+	}
+	// 验证码
+	.code-wrap {
+		.tui-input {
+			width: calc(100% - 410px);
+			font-size: 28px;
+		}
+		.tui-code {
+			width: 200px;
+			text-align: center;
+			border-left: 1px solid $borderColor;
+			color: $mainColor;
+		}
+	}
+	// 推荐人
+	.recommend-wrap {
+		padding: 30px 45px;
+		.recommend-tag {
+			font-size: 28px;
+			color: $fontColor2;
+			margin-bottom: 24px;
+		}
+		.recommend-det {
+			@include disFlex(center, flex-start);
+			.recommend-info {
+				margin-left: 20px;
+				.app-size-32 {
+					margin-bottom: 4px;
+				}
+			}
+		}
+	}
+</style>

store/src/admin/official/callback.vue

@@ -0,0 +1,285 @@
+<template>
+	<!-- 官网各种回调页面 -->
+	<div class="app-content">
+		<div class="callback-wrap">
+			<div class="callback-blo" :class="{ 'paddingTop' : pageStatus == 7 }">
+				<block v-if="pageStatus == 7">
+					<div class="module-wrap">
+						<div class="module-tit">提示</div>
+						<div class="module-det">
+							<div class="module-list" v-for="(item, index) in promptData" :key="index">
+								<span class="dot-wrap"></span>
+								<span>{{ item }}</span>
+							</div>
+						</div>
+					</div>
+				</block>
+				<block v-else>
+					<!-- 使用icon -->
+					<!-- 成功 icon -->
+					<block v-if="pageStatus == 1">
+						<div class="status-img">
+							<img :src="`${constant.imgUrl}/retail/callback/success.png`" alt mode="widthFix" />
+						</div>
+					</block>
+					<!-- 使用图片 -->
+					<!-- 支付成功 -->
+					<block v-else>
+						<div class="icon">
+							<i class="iconfont icondaizhifu"></i>
+						</div>
+					</block>
+					<!-- prompt-wrap -->
+					<div class="prompt-wrap">
+						<block v-if="pageStatus == 1">
+							<div class="prompt-tit" style="color: #09bb07">恭喜您, 续订成功!</div>
+							<div>
+								<span class="app-color-2">你的帐号有效期已延长至:</span>
+								<span>{{ data.deadline | formatTime('YYYY-MM-DD hh:mm:ss') }}</span>
+							</div>
+						</block>
+						<block v-if="pageStatus == 2">
+							<div class="prompt-tit">申请已提交</div>
+							<div>
+								<span class="app-color-2">审核大约需要一个工作日，请耐心等候</span>
+							</div>
+						</block>
+					</div>
+					<!-- qr-code -->
+					<!-- <div class="qr-code-wrap" v-if="option.focus == 0"> -->
+					<block v-if="pageStatus == 2">
+						<div class="qr-code-wrap">
+							<div class="qr-code-img">
+								<!-- <img :src="`${constant.imgUrl}/retail/common/qr-code.png`" alt /> -->
+								<img :src="officialApply.qrCode" alt="">
+							</div>
+							<div>识别二维码关注花卉宝</div>
+							<div>审核结果将通过微信通知您</div>
+						</div>
+					</block>
+				</block>
+				<!-- button -->
+				<div class="button-wrap">
+					<block v-if="pageStatus == 1 || pageStatus == 7">
+						<button class="admin-button-com big blue" @click="jumpPage">{{ btnText }}</button>
+					</block>
+					<block v-else>
+						<button class="admin-button-com big default" @click="jumpPage">{{ btnText }}</button>
+					</block>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	/** *
+	 * 页面状态
+	 * @parmas pageStatus 进入页面的状态
+	 * @parmas 1 续订成功
+	 * @parmas 2 申请已提交
+	 * @parmas 3 申请已提交 - 返回二维码 -- successPay
+	 * @parmas 4 审核未通过 -- successEval
+	 * @parmas 5 审核通过 - 扫码支付 -- successPayCode
+	 * @parmas 6 授权成功 - 扫码支付 -- successPayCode
+	 * @parmas 7 授权提示 - 扫码支付 -- successPayCode
+	 */
+	// api
+	import { accountDet, applyStatus, getAuthUrl } from '@/api/official'
+	// import { getShopUser } from '@/utils/auth'
+	export default {
+		name: 'callback',
+		data() {
+			return {
+				constant: this.$constant,
+				data: {},
+				// pageStatus: '2',
+				pageStatus: '2',
+				promptData: ['确认你已经有公众号（服务号），并且已认证和申请微 信支付', '满足以上条件，可以点下方按钮开始授权。', '点击之后会跳到新页面，页面有个二维码，识别后按确 认授权即可。'],
+				officialApply: {}
+			}
+		},
+		computed: {
+			btnText() {
+				let text = ''
+				switch (this.pageStatus) {
+					case '1':
+						text = '返回管理中心'
+						break
+					case '2':
+						text = '返回首页'
+						break
+					case '3':
+						text = '返回首页'
+						break
+					case '4':
+						text = '返回首页'
+						break
+					case '5':
+						text = '开始授权'
+						break
+					case '6':
+						text = '管理中心'
+						break
+					case '7':
+						text = '开始授权'
+						break
+					default:
+						text = '返回管理中心'
+						break
+				}
+				return text
+			}
+		},
+		onLoad() {
+			// if (!this.$util.isLogin()) {
+			// 	getShopUser()
+			// 	return false
+			// }
+		},
+		mounted() {
+			// this.pageStatus = this.option.pageStatus
+			// this.init()
+		},
+		methods: {
+			init() {
+				let officialApply = uni.getStorageSync('officialApply')
+				if (!this.$util.isEmpty(officialApply)) {
+					this.officialApply = officialApply
+				}
+				if (this.option.pagestatus == 1) {
+					this.pageStatus = 1
+				}
+				this.$util.getCheckLogin().then(res => {
+					if (res) {
+						// this._getStatus()
+						if (this.pageStatus == 1 || this.pageStatus == 5) {
+							this._accountDet()
+						}
+					}
+				})
+			},
+			// 获取状态
+			_getStatus() {
+				applyStatus().then(res => {
+					let status = res.data.status
+					if (status == 1) {
+						this.pageStatus = 2
+					}
+				})
+			},
+			// 获取用户信息
+			_accountDet() {
+				accountDet().then(res => {
+					this.data = res.data
+				})
+			},
+			jumpPage() {
+				if (this.btnText == '返回首页') {
+					this.$util.pageTo({
+						url: '/official/index',
+						query: {
+							id: this.option.id
+						}
+					})
+				} else if (this.btnText == '返回管理中心') {
+					// this.$util.pageTo({
+					// 	url: '/official/index',
+					// 	query: {
+					// 		id: this.option.id
+					// 	}
+					// })
+					// #ifdef H5
+					location.href = `${window.location.protocol}//b.${this.$constant.firstHost}.com/#/`
+					// #endif
+				} else if (this.btnText == '开始授权') {
+					getAuthUrl().then(res => {
+						// #ifdef H5
+						location.href = res.data.url
+						// #endif
+					})
+					// this.$msg('功能待对接！')
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.callback-wrap {
+		padding-top: 30px;
+		.callback-blo {
+			width: calc(100% - 60px);
+			margin: 0 30px;
+			padding: 70px 0;
+			background-color: #fff;
+			box-shadow: 2px 2px 16px 0px rgba(181, 181, 181, 0.29);
+			border-radius: 10px;
+			text-align: center;
+			&.paddingTop {
+				padding-top: 40px;
+			}
+			// 使用icon
+			.icon {
+				.iconfont {
+					font-size: 170px;
+				}
+				.icondaizhifu {
+					color: #ffa92e;
+				}
+			}
+			// 使用状态图片
+			.status-img {
+				width: 294px;
+				margin: 0 auto;
+			}
+		}
+		// module
+		.module-wrap {
+			padding: 0 32px;
+			text-align: left;
+			.module-tit {
+				font-size: 38px;
+				// margin-bottom: 20px;
+			}
+			.module-det {
+				.module-list {
+					@include disFlex(flex-start, flex-start);
+					margin-top: 30px;
+					.dot-wrap {
+						width: 10px;
+						height: 10px;
+						border-radius: 50%;
+						background-color: $mainColor;
+						margin-top: 12px;
+						margin-right: 24px;
+					}
+				}
+			}
+		}
+		// prompt
+		.prompt-wrap {
+			margin-top: 60px;
+			.prompt-tit {
+				font-size: 36px;
+				margin-bottom: 10px;
+			}
+		}
+		// qr-code
+		.qr-code-wrap {
+			color: $fontColor2;
+			text-align: center;
+			& > div {
+				margin-top: 10px;
+			}
+			.qr-code-img {
+				width: 226px;
+				margin: 60px auto 40px;
+			}
+		}
+		// button
+		.button-wrap {
+			margin-top: 80px;
+		}
+	}
+</style>

store/src/admin/official/index.vue

@@ -0,0 +1,283 @@
+<template>
+	<div class="app-content">
+		<div class="tab-wrap">
+			<div class="logo-img">
+				<img :src="`${constant.imgUrl}/retail/official/logo.png`" alt="" />
+			</div>
+			<div class="phone-img" @click="contactFn">
+				<img :src="`${constant.imgUrl}/retail/official/phone.png`" alt="" />
+			</div>
+		</div>
+		<app-swiper :height="{type: 'number',val: 750}" :list="swiper" />
+		<div class="module-com" v-for="(item, index) in contentData" :key="index">
+			<div class="module-tit">
+				<div class="tit-main" v-html="item.title"></div>
+				<div class="tit-sub">{{ item.subTitle }}</div>
+			</div>
+			<div class="module-det">
+				<app-img class="module-img" :src="item.img" :lazy-load="true" />
+			</div>
+		</div>
+		<!-- ad -->
+		<div class="cooperation-wrap">
+			<div class="ad-title">
+				<span>他们</span>
+				<span class="app-color-1">都在用</span>
+			</div>
+			<div class="ad-list-wrap">
+				<div class="ad-list" v-for="(item, index) in adData" :key="index">
+					<app-img :src="`${constant.imgUrl}/retail/official/list-${index + 1}.png`" alt="" />
+				</div>
+			</div>
+			<div class="official-wrap">
+				<div class="off-title">花卉宝，花店数字化建设者</div>
+				<div class="off-sub-tit" @click="contactFn">
+					<app-img :src="`${constant.imgUrl}/retail/official/phone-small.png`" alt="" />
+					<span>咨询热线：0592 - 3272000</span>
+				</div>
+			</div>
+		</div>
+		<!-- trademark -->
+		<div class="bottom-trademark">
+			<img :src="`${constant.imgUrl}/retail/common/trademark.png`" alt="" />
+		</div>
+		<!-- buttom -->
+		<div v-if="status == 3" class="app-footer" @click="pageTo({
+			url: '/official/pay',
+			status: 1
+		})">立即续费</div>
+		<div v-else class="app-footer" @click="pageTo({
+			url: '/official/pay'
+		})">申请试用</div>
+		<!-- <div v-if="status == -1" class="app-footer" @click="pageTo({
+			url: '/official/pay',
+			status: 2
+		})">申请试用</div>
+		<div v-if="status == 0" class="app-footer under-review">审核中</div>
+		<div v-if="status == 1" class="app-footer under-review">试用中</div>
+		<div v-if="status == 2" class="app-footer under-review">审核未通过</div> -->
+		<!-- <div v-if="status == 4" class="app-footer" @click="pageTo({
+			url: '/official/apply',
+			status: 2
+		})">立即订购</div> -->
+	</div>
+</template>
+
+<script>
+	import AppSwiper from '@/components/app-swiper'
+	import AppImg from '@/components/app-img'
+	// api
+	import { applyStatus } from '@/api/official'
+	export default {
+		name: 'index',
+		components: {
+			AppSwiper,
+			AppImg
+		},
+		data() {
+			return {
+				constant: this.$constant,
+				status: -2,
+				swiper: [
+					{
+						img: `${this.$constant.imgUrl}/retail/official/banner-1.png`
+					},
+					{
+						img: `${this.$constant.imgUrl}/retail/official/banner-2.png`
+					},
+					{
+						img: `${this.$constant.imgUrl}/retail/official/banner-3.png`
+					},
+					{
+						img: `${this.$constant.imgUrl}/retail/official/banner-4.png`
+					}
+				],
+				contentData: [
+					{
+						title: `<span class="app-color-1">一键搭建</span>花店商城`,
+						subTitle: `各大节日商城自动涨价，客户下单自动按距离计算运费`,
+						img: `${this.$constant.imgUrl}/retail/official/content-1.png`
+					},
+					{
+						title: `<span class="app-color-1">流程化</span>管理订单`,
+						subTitle: `有效把控订单的生命周期，从下单、打单、制作到发货、配送、 送达自动通知客户，大幅提升客户体验`,
+						img: `${this.$constant.imgUrl}/retail/official/content-2.png`
+					},
+					{
+						title: `丰富多样的<span class="app-color-1">营销工具</span>`,
+						subTitle: `契合花店日常经营的营销工具，拉新、转化、复购、裂变， 面面俱到`,
+						img: `${this.$constant.imgUrl}/retail/official/content-3.png`
+					},
+					{
+						title: `连通各渠道<span class="app-color-1">客户和订单</span>`,
+						subTitle: `线上、门店、微信、支付宝和美团等自动汇总后台，客户统一接待，订单统一管理，不必周旋于各个平台`,
+						img: `${this.$constant.imgUrl}/retail/official/content-4.png`
+					},
+					{
+						title: `<span class="app-color-1">一键吸粉 </span>注册会员`,
+						subTitle: `告别繁琐手续，一键操作，注册会员简单快捷，到店客户粉丝转化率提升80%`,
+						img: `${this.$constant.imgUrl}/retail/official/content-5.png`
+					},
+					{
+						title: `智能的<span class="app-color-1">会员系统</span>`,
+						subTitle: `客户充值消费自动累积成长值、升级会员，付款自动识别会员打折，精准把握每个客户的个性和特征`,
+						img: `${this.$constant.imgUrl}/retail/official/content-6.png`
+					},
+					{
+						title: `经营<span class="app-color-1">数据分析</span>`,
+						subTitle: `系统实时分析数据，花店每个时期的经营情况一目了然，知己知彼，百战百胜`,
+						img: `${this.$constant.imgUrl}/retail/official/content-7.png`
+					}
+				],
+				adData: [1, 2, 3, 4, 5, 6, 7, 8]
+			}
+		},
+		onLoad() {
+			// this.init()
+		},
+		methods: {
+			init() {
+				// 续费
+				if (this.option.pay == 1) {
+					// #ifdef H5
+					this.status = 3
+					sessionStorage.setItem('renewOption', JSON.stringify(this.option))
+					// #endif
+				} else {
+					// #ifdef H5
+					sessionStorage.removeItem('renewOption')
+					// #endif
+				}
+
+				// 邀请新华店
+				if (this.option.introMerchantId) {
+					// #ifdef H5
+					sessionStorage.setItem('introMerchantId', this.option.introMerchantId)
+					// #endif
+				}
+				// let token = uni.getStorageSync('token')
+				// if (token) {
+				// 	this._getDet()
+				// } else {
+				// 	this.status = -1
+				// }
+			},
+			_getDet() {
+				applyStatus().then(res => {
+					this.status = res.data.status
+				})
+			},
+			contactFn() {
+				uni.makePhoneCall({
+					phoneNumber: '05923272000'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.app-content {
+		background-color: #fff;
+		padding-bottom: 100px;
+	}
+	.tab-wrap {
+		@include disFlex(center, space-between);
+		height: 100px;
+		padding: 0 30px;
+		.logo-img {
+			width: 160px;
+		}
+		.phone-img {
+			width: 50px;
+		}
+	}
+	// module
+	.module-com {
+		margin-top: 80px;
+		.module-tit {
+			text-align: center;
+			.tit-main {
+				font-size: 36px;
+				font-weight: 600;
+				margin-bottom: 14px;
+			}
+			.tit-sub {
+				width: 90%;
+				margin: 0 auto;
+				color: $fontColor3;
+				line-height: 34px;
+			}
+		}
+		.module-det {
+			.module-img {
+				min-height: 470px;
+			}
+		}
+	}
+	// cooperation
+	.cooperation-wrap {
+		width: 100%;
+		height: 552px;
+		background: url('../../static/images/official/bg.png');
+		padding-top: 60px;
+		.ad-title {
+			color: #fff;
+			font-size: 36px;
+			font-weight: 600;
+			margin-bottom: 50px;
+			text-align: center;
+		}
+		.ad-list-wrap {
+			@include disFlex(center, center);
+			flex-wrap: wrap;
+			margin-bottom: 30px;
+			.ad-list {
+				width: 166px;
+				margin-right: 10px;
+				margin-bottom: 10px;
+			}
+		}
+		.official-wrap {
+			color: #fff;
+			background-color: rgba(#000000, 0.6);
+			width: 90%;
+			margin: 0 auto;
+			padding: 20px 0;
+			.off-title {
+				font-size: 36px;
+				font-weight: 600;
+				margin-bottom: 10px;
+				text-align: center;
+			}
+			.off-sub-tit {
+				@include disFlex(center, center);
+				img {
+					width: 28px;
+					height: 28px;
+					margin-right: 10px;
+				}
+			}
+		}
+	}
+	// trademark
+	.bottom-trademark {
+		height: 150px;
+		@include disFlex(center, center);
+		background-color: #242627;
+		img {
+			width: 140px;
+		}
+	}
+	// footer
+	.app-footer {
+		color: #fff;
+		font-size: 36px;
+		font-weight: 600;
+		background: linear-gradient(90deg, #3ab7ff, #3385ff);
+		&.under-review {
+			background: #fff !important;
+			color: #333 !important;
+		}
+	}
+</style>

store/src/admin/official/pay.vue

@@ -0,0 +1,195 @@
+<template>
+	<div class="app-content">
+		<div class="banner-wrap">
+			<div class="banner-img">
+				<img :src="`${constant.imgUrl}/retail/official/pay-banner.png`" alt />
+				<div class="meal-det">
+					<div class="meal-title">{{ detail.name }}</div>
+					<div class="meal-introduce">{{ detail.introduce }}</div>
+				</div>
+			</div>
+			<div class="flex-center-between app-size-28">
+				<div>软件周期</div>
+				<div>1年</div>
+			</div>
+		</div>
+		<!-- list -->
+		<div class="module-wrap">
+			<div class="module-tit">主要功能</div>
+			<div class="module-det">
+				<div class="list-wrap">
+					<div class="list" v-for="(item, index) in funcitonData" :key="index">
+						<span :class="{ 'app-color-3' : !item.has}">{{ item.name }}</span>
+						<i class="iconfont" :class="[item.has ? 'icondagou' : 'iconguanbi']"></i>
+					</div>
+				</div>
+			</div>
+		</div>
+		<!-- buttom -->
+		<div class="page-btn app-footer">
+			<div class="flex-center">
+				<span>合计</span>
+				<span class="app-price">
+					<span>￥</span>
+					<span class="app-size-40">{{ detail.price }}</span>
+				</span>
+			</div>
+			<button v-if="$util.isEmpty(renewOption)" class="admin-button-com middle blue" @click="pageTo({
+			url: '/official/apply'
+		})">免费试用</button>
+			<button v-else class="admin-button-com middle blue" @click="wxPay">支付</button>
+		</div>
+	</div>
+</template>
+
+<script>
+	// import { getShopUser } from '@/utils/auth'
+	import wexinPay from '@/utils/pay/wxPay'
+	import { getMealDet, renewWxPay } from '@/api/official'
+	export default {
+		name: 'pay-page',
+		data() {
+			return {
+				constant: this.$constant,
+				detail: {},
+				funcitonData: [],
+				renewOption: null
+			}
+		},
+		onLoad() {
+			// if (!this.$util.isLogin()) {
+			// 	getShopUser()
+			// 	return false
+			// }
+			// this.init()
+		},
+		methods: {
+			init() {
+				this.$util.getCheckLogin().then(res => {
+					if (res) {
+						this._getMealDet()
+
+						// 续费
+						// #ifdef H5
+						let renewOption = sessionStorage.getItem('renewOption')
+						if (renewOption) {
+							this.renewOption = JSON.parse(renewOption)
+						}
+						// #endif
+					}
+				})
+			},
+			_getMealDet() {
+				getMealDet({ id: 1 }).then(res => {
+					if (this.$util.isEmpty(res.data)) return false
+					this.detail = res.data.detail
+					this.funcitonData = res.data.function
+				})
+			},
+			wxPay() {
+				renewWxPay({ id: this.detail.id, merchantId: this.renewOption.merchantId }).then(res => {
+					wexinPay(res.data, this.paySuccess, this.payFail)
+				})
+			},
+			// 支付成功
+			paySuccess() {
+				// alert('支付成功!')
+				this.$util.pageTo({
+					url: '/official/callback',
+					type: 2,
+					query: {
+						pagestatus: 1
+						// orderSn: this.option.orderSn,
+						// payDiscountPrice: res.data.discountAmount
+					}
+				})
+			},
+			payFail() {
+				this.$msg('支付失败，请重新支付！')
+			}
+		}
+	}
+</script>
+
+<style lang='scss' scoped>
+	.app-content {
+		background-color: #fff;
+	}
+	.banner-wrap {
+		padding: 32px;
+		width: calc(100% - 64px);
+		border-bottom: 20px solid $backColor;
+		.banner-img {
+			width: 100%;
+			margin-bottom: 6px;
+			position: relative;
+			.meal-det {
+				position: absolute;
+				top: 40px;
+				left: 30px;
+				width: 60%;
+				color: #fff;
+				.meal-title {
+					font-size: 42px;
+					font-weight: 600;
+					margin-bottom: 28px;
+					letter-spacing: 8px;
+				}
+				.meal-introduce {
+					line-height: 40px;
+					letter-spacing: 2px;
+				}
+			}
+		}
+	}
+	// list
+	.module-wrap {
+		padding: 40px 30px 0;
+		.module-tit {
+			font-size: 28px;
+			font-weight: 600;
+			margin-bottom: 24px;
+		}
+		.module-det {
+			.list-wrap {
+				border: 2px solid #f9f9f9;
+				border-top: none;
+				.list {
+					@include disFlex(center, space-between);
+					padding: 20px 26px;
+					border-top: 2px solid #f9f9f9;
+					&:nth-child(odd) {
+						background-color: #eee;
+					}
+					.iconfont {
+						font-size: 30px;
+					}
+					.icondagou {
+						color: $mainColor;
+					}
+					.iconguanbi {
+						font-size: 24px;
+						color: $fontColor3;
+					}
+				}
+			}
+		}
+	}
+	// button
+	.page-btn {
+		width: calc(100% - 60px);
+		@include disFlex(center, space-between);
+		padding: 0 30px;
+		.app-price {
+			margin-bottom: 8px;
+			margin-left: 4px;
+		}
+		.red {
+			width: 270px;
+		}
+		.admin-button-com {
+			width: 200px;
+			font-size: 32px;
+		}
+	}
+</style>

store/src/pages.json

@@ -1,5 +1,11 @@
 {
 	"pages": [
+		{
+			"path": "admin/home/console",
+			"style": {
+				"navigationBarTitleText": ""
+			}
+		},
 		{
 			"path": "admin/home/workbench",
 			"style": {
@@ -56,6 +62,17 @@
 				}
 			]
 		},
+		{
+			"root": "admin/official",
+			"pages": [
+				{
+					"path": "index",
+					"style": {
+						"navigationBarTitleText": "花卉宝"
+					}
+				}
+			]
+		},
 		{
 			"root": "admin/member",
 			"pages": [