分包member 到pagesClient

ghs/src/admin/home/member.vue

@@ -6,7 +6,7 @@
       :isAdd="true"
       :currentTab="tabIndex"
       :height="100"
-      @add="pageTo('/admin/member/add')"
+      @add="pageTo('/pagesClient/member/add')"
       @change="change"
       itemWidth="50%"
     />
@@ -15,7 +15,7 @@
         <tui-list-cell
           :arrow="true"
           @click="pageTo({
-					url: '/admin/member/detail',
+					url: '/pagesClient/member/detail',
 					query: {
 						id: item.id
 					}

ghs/src/pages.json

@@ -57,30 +57,60 @@
 	],
 	"subPackages": [
 		{
-			"root": "admin/order",
+			"root": "pagesClient",
 			"pages": [
 				{
-					"path": "detail",
+					"path": "member/add",
 					"style": {
-						"navigationBarTitleText": "详情"
+						"navigationBarTitleText": "添加客户"
 					}
 				},
 				{
-					"path": "ship",
+					"path": "member/detail",
 					"style": {
-						"navigationBarTitleText": "发货"
+						"navigationBarTitleText": "客户详情"
 					}
 				},
 				{
-					"path": "fill-form",
+					"path": "official/index",
 					"style": {
-						"navigationBarTitleText": "填写收花人"
+						"navigationBarTitleText": "花卉宝"
 					}
 				},
 				{
-					"path": "print",
+					"path": "official/pay",
 					"style": {
-						"navigationBarTitleText": "打印"
+						"navigationBarTitleText": "支付"
+					}
+				},
+				{
+					"path": "official/apply",
+					"style": {
+						"navigationBarTitleText": "申请"
+					}
+				},
+				{
+					"path": "official/callback",
+					"style": {
+						"navigationBarTitleText": "回调"
+					}
+				},
+				{
+					"path": "official/latest-shop",
+					"style": {
+						"navigationBarTitleText": "最近访问的店铺"
+					}
+				},
+				{
+					"path": "official/result",
+					"style": {
+						"navigationBarTitleText": "结果"
+					}
+				},
+				{
+					"path": "official/warn",
+					"style": {
+						"navigationBarTitleText": "开启微信提醒"
 					}
 				}
 			]
@@ -133,18 +163,30 @@
 			]
 		},
 		{
-			"root": "admin/member",
+			"root": "admin/order",
 			"pages": [
 				{
-					"path": "add",
+					"path": "detail",
 					"style": {
-						"navigationBarTitleText": "添加客户"
+						"navigationBarTitleText": "详情"
 					}
 				},
 				{
-					"path": "detail",
+					"path": "ship",
 					"style": {
-						"navigationBarTitleText": "客户详情"
+						"navigationBarTitleText": "发货"
+					}
+				},
+				{
+					"path": "fill-form",
+					"style": {
+						"navigationBarTitleText": "填写收花人"
+					}
+				},
+				{
+					"path": "print",
+					"style": {
+						"navigationBarTitleText": "打印"
 					}
 				}
 			]

ghs/src/pagesClient/index.vue

@@ -0,0 +1,15 @@
+<template>
+    <div>
+
+    </div>
+</template>
+
+<script>
+    export default {
+        name:'ceshe'
+    }
+</script>
+
+<style lang="scss" scoped>
+
+</style>

ghs/src/pagesClient/official/apply.vue

@@ -0,0 +1,442 @@
+<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"
+            placeholder-style="color:#CCCCCC"
+            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"
+            placeholder-style="color:#CCCCCC"
+            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.name"
+            placeholder-class="phcolor"
+            placeholder-style="color:#CCCCCC"
+            class="tui-input"
+            name="name"
+            placeholder="请输入店长姓名"
+          />
+        </tui-list-cell>
+        <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>
+        <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">
+          <tui-list-cell class="line-cell code-wrap" :hover="false">
+            <div class="tui-title">主营业务</div>
+            <div>
+              <button class="admin-button-com blue mini-btn">
+                零售
+              </button>
+              <button style="margin-left:10px;" class="admin-button-com default mini-btn">
+                培训
+              </button>
+            </div>
+          </tui-list-cell>
+          <tui-list-cell class="line-cell" :hover="false">
+              <div class="tui-title">营业执照编号</div>
+              <app-uploader ref="appUploader" :imgList.sync="form.shopImg" :isMain="true" :num="4" />
+              <!-- <input
+                v-model="form.name"
+                placeholder-class="phcolor"
+                placeholder-style="color:#CCCCCC"
+                class="tui-input"
+                name="name"
+                placeholder="请输入营业执照编号"
+              /> -->
+         </tui-list-cell>
+         <tui-list-cell class="line-cell" :hover="false">
+              <div class="tui-title">营业执照图片</div>
+              <input
+                v-model="form.name"
+                placeholder-class="phcolor"
+                placeholder-style="color:#CCCCCC"
+                class="tui-input"
+                name="name"
+                placeholder="请输入营业执照编号"
+              />
+         </tui-list-cell>
+      </div>
+      <!-- 推荐人 -->
+      <div class="module-com recommend-wrap" v-if="!$util.isEmpty(merchantData)">
+        <div class="recommend-tag">推荐人</div>
+        <div class="recommend-det">
+          <image style="width:90rpx;height:90rpx;border-radius:42rpx;" mode="scaleToFill" :src="merchantData.smallLogoUrl" @error="imageError" />
+          <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"
+        :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";
+import { getWxInfo, getWxPhone } from "@/api/mini";
+import AppUploader from "@/components/app-uploader";
+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,
+    AppUploader
+  },
+  data() {
+    return {
+      merchantData: {},
+      form: {
+        name: "",
+        mobile: "",
+        province: "",
+        city: "",
+        dist: "",
+        address: "",
+        floor: "",
+        longitude: "",
+        latitude: "",
+        adminId: ""
+      },
+      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) {
+          let id = uni.getStorageSync("introMerchantId");
+          if (id > 0) {
+            this._getMerchantDet();
+          }
+          // this._regionTree();
+        }
+      });
+    },
+    // _regionTree() {
+    //   regionTree().then(res => {
+    //     this.regionData = res.data.tree;
+    //   });
+    // },
+    _getMerchantDet() {
+      let id = uni.getStorageSync("introMerchantId");
+      getIntroduce({ id: id }).then(res => {
+        this.merchantData = res.data;
+      });
+    },
+    // ==============
+    confirmFn() {
+      let id = uni.getStorageSync("introMerchantId");
+      applyRegister({
+        introMerchantId: id || 0,
+        ...this.form
+      }).then(res => {
+        uni.setStorageSync("officialApply", res.data);
+        this.$util.pageTo({
+          url: "/admin/official/callback",
+          type: 2,
+          query: {
+            pagestatus: 3
+          }
+        });
+      });
+    },
+    // 验证码
+    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);
+          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);
+      this.$util.pageTo({
+          url: "/admin/official/callback",
+          type: 2,
+          query: {
+            pagestatus: 1
+          }
+        });
+      // 验证通过!
+      // 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>

ghs/src/pagesClient/official/callback.vue

@@ -0,0 +1,320 @@
+<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 || pageStatus == 3">
+              <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 v-if="pageStatus == 3">
+            <div class="qr-code-wrap" style="margin-top:100rpx;">
+              <div style="font-size:30rpx;">搜索并关注下方公众号</div>
+              <div style="color:red;font-size:35rpx;font-weight:bold;margin:18rpx 0 18rpx 0">{{officialApply.wxAliasName}}</div>
+              <div style="font-size:30rpx;">审核结果第一时间通知您</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-if="pageStatus == 3">
+            <button
+              class="admin-button-com big blue"
+              style="width:230rpx;"
+              @click="pasteWxAccount()"
+            >复制</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: "3",
+      promptData: [
+        "确认你已经有公众号（服务号），并且已认证和申请微 信支付",
+        "满足以上条件，可以点下方按钮开始授权。",
+        "点击之后会跳到新页面，页面有个二维码，识别后按确 认授权即可。"
+      ],
+	  officialApply: {
+		  wxAliasName:""
+	  },
+	  wxAccount:''
+    };
+  },
+  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('功能待对接！')
+      }
+    },
+    pasteWxAccount() {
+      uni.setClipboardData({
+        data: this.officialApply.wxAliasName,
+        success: function(res) {
+          uni.getClipboardData({
+            success: function(res) {
+              uni.showToast({
+                title: "已复制"
+              });
+            }
+          });
+        }
+      });
+    }
+  }
+};
+</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>

ghs/src/pagesClient/official/index.vue

@@ -0,0 +1,277 @@
+<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" mode="widthFix" />
+      </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`"
+            mode="widthFix"
+            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="电话"
+            mode="widthFix"
+          />
+          <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({
+			url: '/admin/official/pay'
+		})">申请试用</div>
+  </div>
+</template>
+
+<script>
+import AppSwiper from "@/components/app-swiper";
+import AppImg from "@/components/app-img";
+import { applyStatus } from "@/api/official";
+import { share } from "@/mixins";
+export default {
+  name: "index",
+  components: {
+    AppSwiper,
+    AppImg
+  },
+  mixins: [share],
+  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.jweixinFn({
+      title: "更懂您的花卉宝",
+      pagePath: "admin/official/index",
+      imageUrl: ""
+    });
+  },
+  methods: {
+    init() {
+      // 续费
+      if (this.option.pay == 1) {
+        this.status = 3;
+        uni.setStorageSync("renewOption", JSON.stringify(this.option));
+      } else {
+        uni.removeStorageSync("renewOption");
+      }
+      //花店分享的页面有邀人，打开页面保存邀请人
+      let introMerchantId = 0;
+      if (typeof this.option.introMerchantId != "undefined") {
+        introMerchantId = this.option.introMerchantId;
+      }
+      uni.setStorageSync("introMerchantId", introMerchantId);
+    },
+    _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;
+      font-size:27rpx;
+    }
+  }
+  .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>

ghs/src/pagesClient/official/latest-shop.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="app-content">
+      最近问店铺
+  </div>
+</template>
+
+<script>
+import AppSwiper from "@/components/app-swiper";
+import AppImg from "@/components/app-img";
+import { applyStatus } from "@/api/official";
+import { share } from "@/mixins";
+export default {
+  name: "shop-list",
+  components: {},
+  mixins: [share],
+  data() {
+    return {
+      
+    };
+  },
+  onLoad() {
+    
+  },
+  methods: {
+    
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

ghs/src/pagesClient/official/pay.vue

@@ -0,0 +1,196 @@
+<template>
+  <div class="app-content">
+    <div class="banner-wrap">
+      <div class="banner-img">
+        <img :src="`${constant.imgUrl}/retail/official/pay-banner.png`" mode="widthFix" />
+        <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" style="margin-top:20rpx;">
+        <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 v-if="$util.isEmpty(renewOption)" class="flex-center">
+        <span></span>
+        <span class="app-price">
+          <span></span>
+          <span class="app-size-40" style="text-decoration:line-through">{{ detail.price }}</span>
+        </span>
+      </div>
+
+      <div v-else 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: '/admin/official/apply',type:2
+		})"
+      >免费试用</button>
+      <button v-else class="admin-button-com middle blue" @click="wxPay">支付</button>
+    </div>
+  </div>
+</template>
+
+<script>
+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() {},
+  methods: {
+    init() {
+      this._getMealDet();
+      let renewOption = uni.getStorageSync("renewOption");
+      if (renewOption) {
+        this.renewOption = JSON.parse(renewOption);
+      }
+    },
+    _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() {
+      this.$util.pageTo({
+        url: "/official/callback",
+        type: 2,
+        query: {
+          pagestatus: 1
+        }
+      });
+    },
+    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;
+      margin-bottom: 110rpx;
+      .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>

ghs/src/pagesClient/official/result.vue

@@ -0,0 +1,45 @@
+<template>
+	<appResult title="提交成功">
+        <view class="dec">
+            开启微信通知，有订单动态时及时通知您:
+        </view>
+          <!-- @bindcontact="handleContact"
+           open-type="contact" -->
+		<button 
+            class="admin-button-com blue big" 
+            @click="pageTo({
+                url:'/admin/official/warn'
+            })"
+            >
+            去开启
+            </button>
+	</appResult>
+</template>
+
+<script>
+import appResult from '@/components/app-result'
+export default {
+	name: "ApplyResult", // 开单结果
+	components:{
+		appResult
+    },
+    methods:{
+        handleContact(e){
+            console.log(e)
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+    .dec {
+     color: #666666;   
+     font-size: 28px;
+     font-weight: 400;
+     margin-bottom: 30px;
+    }
+	.admin-button-com {
+		margin-bottom: 20px;
+		width: 100%;
+	}
+</style>

ghs/src/pagesClient/official/warn.vue

@@ -0,0 +1,135 @@
+<template>
+    <view>
+        <view class="warn-tit">开启微信提醒</view>
+        <view class="step-view_box">
+            <view 
+                v-for="(item,index) in stepList"
+                :key="index"
+                class="step-li_box">
+                <view class="step-head_box">
+                   <view class="step-icon_num">
+                       {{index + 1}}
+                   </view>
+                   <view v-if="stepList.length - 1  !== index " class="step-line"></view>
+                </view>
+                <view class="step-main_box">
+                    <view class="step-tit">
+                        {{item.title}}
+                    </view>
+                    <view 
+                        class="step-content_box">
+                        <tempelte v-if="index === 0">
+                            <view class="button-box">
+                                <button 
+                                    @bindcontact="handleContact"
+                                    class="admin-button-com blue big" 
+                                    open-type="contact">打开聊天框</button>
+                            </view>
+                            
+                        </tempelte>
+                        <tempelte v-else>
+                            <image class="step-img" :src="item.images" mode="widthFix"></image>
+                        </tempelte>
+                    </view>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+    export default {
+        name:'OfficialWarn',
+        data(){
+            return {
+                stepList:[
+                    {
+                        title:'点击微信聊天框'
+                    },
+                    {
+                        title:'点击框内右下方“开启微信提醒”卡片',
+                        images:`${this.$constant.imgUrl}/ghs/official/step3.png`
+                    },
+                     {
+                        title:'接收二维码点击长按，识别公众号关注即可',
+                        images:`${this.$constant.imgUrl}/ghs/official/step2.png`
+                    },
+                ]
+            }
+        },
+        methods:{
+            handleContact(e){
+                console.log(e)
+            }   
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    .warn-tit {
+        color: #040404;
+        font-size: 36px;
+        font-weight: 600;
+        padding:42px 0 0  52px;
+    }
+    .step-view_box {
+        margin-top: 63px;
+        padding:0 25px 0 40px;
+        & .step-li_box {
+            display: flex;
+            & > .step-head_box {
+                position: relative;
+                & > .step-icon_num {
+                    width: 40px;
+                    height: 40px;
+                    border-radius: 50%;
+                    background-color: $mainColor;
+                    text-align: center;
+                    line-height: 40px;
+                    color: #FFFFFF;
+                    font-size: 28px;
+                    position: relative;
+                    z-index: 50;
+                }
+                & > .step-line {
+                    height: 100%;
+                    width: 0px;
+                    border-left: 1px dashed $mainColor;
+                    position: absolute;
+                    left: 50%;
+                    top: 50%;
+                    transform: translate(-50%, -50%);
+                    z-index: 45;
+                    
+                }
+            }
+            & > .step-main_box {
+                flex: 1;
+                padding-left: 30px;
+                & .step-tit {
+                    color: #141F25;
+                    font-size: 32px;
+                    font-weight: 600;
+                }
+                & .step-content_box {
+                    .button-box {
+                        width: 100%;
+                        padding-right: 25px;
+                          &  .admin-button-com {
+                            margin: 67px 0 85px;
+                        }
+                    }
+                  
+                    & .step-img {
+                        width: 382px;
+                        height: 566px;
+                        margin: 34px 0 71px;
+                    }
+                }
+            }
+        }
+    }
+    .admin-button-com {
+        width: 100%;
+    }
+</style>