Sfoglia il codice sorgente

申请流程优化

shish 6 anni fa
parent
commit
42256d5b14
2 ha cambiato i file con 662 aggiunte e 569 eliminazioni
  1. 390 308
      store/src/admin/official/apply.vue
  2. 272 261
      store/src/admin/official/index.vue

+ 390 - 308
store/src/admin/official/apply.vue

@@ -1,317 +1,399 @@
 <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="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 code-wrap" :hover="false">
+          <div class="tui-title">店长昵称</div>
+          <div class="tui-code" style="width:260rpx;">{{nickname}}</div>
+          <button
+            class="admin-button-com blue mini-btn"
+            open-type="getUserInfo"
+            @getuserinfo="getWxAvatar"
+          >点击生成</button>
+        </tui-list-cell>
+      </div>
+      <!-- 手机号 -->
+      <div class="module-com">
+        <tui-list-cell class="line-cell code-wrap" :hover="false">
+          <div class="tui-title">手机号</div>
+          <div class="tui-code" style="width:260rpx;">{{form.mobile}}</div>
+          <button
+            class="admin-button-com blue mini-btn"
+            open-type="getPhoneNumber"
+            @getphonenumber="getWxMobile"
+          >点击生成</button>
+        </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>
+      <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)
-				}
-			}
-		}
-	}
+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";
+import { getWxInfo, getWxPhone } from "@/api/mini";
+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: "",
+		adminId: ""
+        // 推荐商家id
+        // oldId: ''
+      },
+      showRegion: false,
+      // 省市联动
+      regionData: [],
+      cityPickerValueDefault: [0, 0],
+      // 验证码
+      isSend: 0,
+      countDown: 119,
+	  timer: null,
+	  nickname:""
+    };
+  },
+  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");
+		  let id = uni.getStorageSync('introMerchantId');
+          if (id > 0) {
+            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("发送失败!");
+        });
+    },
+    // 获取微信手机号
+    getWxMobile(e) {
+      console.log(e);
+      if (e.detail.errMsg === "getPhoneNumber:ok") {
+        getWxPhone({
+          iv: e.detail.iv,
+          encryptedData: e.detail.encryptedData
+        }).then(res => {
+          this.form.mobile = res.data.mobile;
+          uni.showToast({
+            icon: "success"
+          });
+        });
+      } else {
+        this.$msg("获取信息失败!");
+      }
+    },
+    // 获取微信信息
+    getWxAvatar() {
+      uni.getUserInfo({
+        provider: "weixin",
+        success: res => {
+          console.log("res", res);
+          // this.popupShow = true
+          getWxInfo({ iv: res.iv, encryptedData: res.encryptedData }).then(
+            subRes => {
+              this.form.adminId = subRes.data.id;
+              this.nickname = subRes.data.nickname;
+              uni.showToast({
+                icon: "success"
+              });
+            }
+          );
+        },
+        fail: () => {
+          // this.loading = false
+        }
+      });
+    },
+    // 倒计时
+    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 = [
+        {
+          name: "adminId",
+          rule: ["required"],
+          msg: ["请点击生成昵称"]
+        }
+      ];
+      // 进行表单检查
+      let formData = this.form;
+      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;
-				}
-			}
-		}
-	}
+.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>

+ 272 - 261
store/src/admin/official/index.vue

@@ -1,281 +1,292 @@
 <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" :style="{backgroundImage:'url(' + backgroundImg + ')'}">
-			<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({
+  <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" :style="{backgroundImage:'url(' + backgroundImg + ')'}">
+      <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: '/admin/official/pay',
 			status: 1
-		})">立即续费</div>
-		<div v-else class="app-footer" @click="pageTo({
+		})"
+    >立即续费</div>
+    <div v-else class="app-footer" @click="pageTo({
 			url: '/admin/official/pay'
 		})">申请试用</div>
-		<!-- <div v-if="status == -1" class="app-footer" @click="pageTo({
+    <!-- <div v-if="status == -1" class="app-footer" @click="pageTo({
 			url: '/admin/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({
+    <div v-if="status == 2" class="app-footer under-review">审核未通过</div>-->
+    <!-- <div v-if="status == 4" class="app-footer" @click="pageTo({
 			url: '/admin/official/apply',
 			status: 2
-		})">立即订购</div> -->
-	</div>
+    })">立即订购</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`
-					}
-				],
-				backgroundImg:`${this.$constant.imgUrl}/retail/official/bg.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-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-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-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
-				}
+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`
+        }
+      ],
+      backgroundImg: `${this.$constant.imgUrl}/retail/official/bg.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-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-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-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'
-				})
-			}
-		}
-	}
+      //花店分享的页面有邀人,打开页面保存邀请人
+
+      // #ifdef H5
+      //sessionStorage.setItem('introMerchantId', this.option.introMerchantId)
+      // #endif
+      let introMerchantId =
+        typeof this.option.introMerchantId == "undefined"
+          ? 0
+          : this.option.introMerchantId;
+      console.log("数据分析。。。。。。。");
+      console.log(introMerchantId);
+      uni.setStorageSync("introMerchantId", introMerchantId);
+
+      // 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);
-		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;
-		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 {
-		@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;
-		}
-	}
+.app-content {
+  background-color: #fff;
+  padding-bottom: 100px;
+}
+.tab-wrap {
+  @include disFlex(center, space-between);
+  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;
+  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 {
+  @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>