feat(shareRegist): 分享注册页面调整改为先注册

components/area-product-list/special-area-wrapper.vue

@@ -103,7 +103,7 @@ export default {
   },
   created() {
     this.getAreaListById(UPGRADE_AREA.id, this.upgradeList)
-    this.getAreaListById(REGIEST_AREA.id, this.registList)
+    // this.getAreaListById(REGIEST_AREA.id, this.registList)
     this.getAreaListById(REPURCHASE_AREA.id, this.repurchaseList)
     this.getAreaListById(HALF_PRICE_AREA.id, this.halfPriceList)
     this.getAreaListById(REISSUE_AREA.id, this.rescissionList)

pages/index/index.vue

@@ -1,11 +1,6 @@
 <template>
   <view :class="userInfo && userInfo.skin ? 'content1' : 'content'">
     <view class="content_a">
-      <!-- 商品专区入口 先别删  -->
-      <!-- <view @tap="goSpecialArea">会员专区</view> -->
-      <!-- <view :class="userInfo && userInfo.skin ? 'index-top1' : 'index-top'">
-      </view> -->
-
       <view class="banner" v-if="isEmpty(banners) == false">
         <view class="uni-margin-wrap">
           <swiper

pages/shareRegist/index.vue

@@ -1,64 +1,55 @@
-<!--
- * @Descripttion:
- * @version:
- * @Author: kBank
- * @Date: 2022-11-21 15:11:22
--->
 <template>
   <view>
-    <view v-if="!pkCountry" class="content1">
+    <view class="content1">
-      <!-- <view class="index_header">
+      <!-- <view class="title">欢迎注册</view> -->
-      <view>注册</view>
-    </view> -->
-      <!-- <view class="tit" v-if="!pkCountry">{{ '嗨粉扫天下' }}</view> -->
-      <!-- 海粉 -->
       <view class="formed1">
-        <u-form :model="form" labelWidth="80px" ref="uForm" :rules="rules">
+        <u-form
-          <u-form-item label="" prop="memberCode">
+          :model="form"
-            <u-input v-model="form.memberCode" type="number" disabled>
+          labelWidth="90px"
-              <u--text
+          ref="uForm"
-                :text="howHeader"
+          labelPosition="top"
-                slot="prefix"
+          :rules="rules"
-                margin="0 3px 0 0"
+        >
-                type="tips"
+          <!-- <u-form-item label="推荐编号" prop="parentCode">
-              ></u--text>
+            <u-input v-model="form.parentCode" disabled> </u-input>
-            </u-input>
+          </u-form-item> -->
-          </u-form-item>
+          <u-form-item label="会员姓名" prop="memberName">
-          <u-form-item label="" prop="memberName">
             <u-input
+              class="custom-input"
               v-model="form.memberName"
               :placeholder="'请输入会员姓名'"
             />
           </u-form-item>
-          <u-form-item label="" prop="phone">
+          <u-form-item label="联系方式" prop="phone">
             <u-input
+              class="custom-input"
               v-model="form.phone"
-              @blur="setMemberCode"
               :placeholder="'请输入联系方式'"
               type="number"
               maxlength="20"
             />
           </u-form-item>
 
-          <u-form-item label="" prop="loginPassword">
+          <!--
+          <u-form-item label="登录密码" prop="loginPwd">
             <u-input
               :password="isPwd"
               :placeholder="'请输入登录密码'"
-              v-model="form.loginPassword"
+              v-model="form.loginPwd"
             >
-              <template slot="suffix">
+              <template #suffix>
                 <u-icon name="eye" @tap="isPwd = !isPwd" v-if="!isPwd"></u-icon>
                 <u-icon name="eye-off" @tap="isPwd = !isPwd" v-else></u-icon>
               </template>
             </u-input>
           </u-form-item>
-          <u-form-item label="" prop="payPassword">
+          <u-form-item label="支付密码" prop="payPwd">
             <u-input
               :password="isPwd2"
               :placeholder="'请输入支付密码'"
-              v-model="form.payPassword"
+              v-model="form.payPwd"
             >
-              <template slot="suffix">
+              <template #suffix>
                 <u-icon
                   name="eye"
                   @tap="isPwd2 = !isPwd2"
@@ -68,13 +59,14 @@
               </template>
             </u-input>
           </u-form-item>
-          <u-form-item label="" prop="code">
+          <u-form-item label="验证码" prop="smsCode">
-            <u-input v-model="form.code" :placeholder="'请输入验证码'">
+            <u-input v-model="form.smsCode" :placeholder="'请输入验证码'">
-              <template slot="suffix">
+              <template #suffix>
                 <view class="getCode" @tap="getVilCode">{{ getCode }}</view>
               </template>
             </u-input>
           </u-form-item>
+          -->
         </u-form>
         <u-button
           type="success"
@@ -84,111 +76,60 @@
           :loading="isLoading"
           :loadingText="'注册中'"
           @click="toLogin"
-          >{{ '立即注册' }}</u-button
+          >{{ '欢迎注册' }}</u-button
         >
       </view>
     </view>
-    <view v-else class="content">
+    <u-modal
-      <!-- <view class="tit" >{{ '海粉扫天下' }}</view>
+      :show="showSuccessModal"
-    <view class="formed"
+      title="注册成功"
-         >
+      :show-cancel-button="true"
-      <u-form :model="form"
+      cancel-text="复制"
-              ref="uForm1"
+      confirm-text="自动登录"
-              :rules="rules1"
+      @confirm="onModalConfirm"
-              labelWidth="80px">
+      @cancel="onModalCancel"
-        <u-form-item label=""
+      @close="showSuccessModal = false"
-                     prop="memberName">
+    >
-          <u-input v-model="form.memberName"
+      <view class="slot-content" v-if="successData">
-                   :placeholder="'请输入真实姓名'" />
+        <view class="success-item">
-        </u-form-item>
+          <text class="item-label">会员编号:</text>
-        <u-form-item label=""
+          <text class="item-value">{{ successData.memberCode }}</text>
-                     prop="phone">
+        </view>
-          <u-input v-model="form.phone"
+        <view class="success-item">
-          :placeholder="'请输入联系方式'" />
+          <text class="item-label">会员姓名:</text>
-        </u-form-item>
+          <text class="item-value">{{ successData.memberName }}</text>
-        <u-form-item label=""
+        </view>
-                     prop="code">
+        <view class="success-item">
-          <u-input v-model="form.code"
+          <text class="item-label">联系方式:</text>
-                   :placeholder="'请输入验证码'">
+          <text class="item-value">{{ successData.phone }}</text>
-            <template slot="suffix">
+        </view>
-              <view class="getCode"
+        <view class="success-item">
-                    @tap="getVilCode">{{ getCode }}</view>
+          <text class="item-label">登录密码:</text>
-            </template>
+          <text class="item-value">{{ successData.loginPassword }}</text>
-          </u-input>
+        </view>
-        </u-form-item>
+        <view class="success-item">
-        <u-form-item label=""
+          <text class="item-label">支付密码:</text>
-                     @click="selCountry">
+          <text class="item-value">{{ successData.payPassword }}</text>
-          <view class="picker">
+        </view>
-            <u-input v-model="form.pkCountryName"
+        <view class="success-item">
-                     disabled
+          <text class="item-label">登录地址:</text>
-                     disabledColor="#ffffff"
+          <text class="item-value">{{ successData.urlAddress }}</text>
-                     :placeholder="'请选择自然国'"
+        </view>
-                     border="none"></u-input>
+      </view>
-            <u-icon name="arrow-right"></u-icon>
+    </u-modal>
-          </view>
-        </u-form-item>
-        <u-form-item label="">
-          <view class="picker">
-            <u-input v-model="form.jsName"
-                     disabled
-                     disabledColor="#ffffff"
-                     :placeholder="'请选择结算国'"
-                     border="none"></u-input>
-          </view>
-        </u-form-item>
-        <u-form-item label=""
-                     prop="loginPassword">
-          <u-input :password="isPwd1"
-                   :placeholder="'请输入登录密码'"
-                   v-model="form.loginPassword">
-            <template slot="suffix">
-              <u-icon name="eye"
-                      @tap="isPwd1=!isPwd1"
-                      v-if="!isPwd1"></u-icon>
-              <u-icon name="eye-off"
-                      @tap="isPwd1=!isPwd1"
-                      v-else></u-icon>
-            </template>
-          </u-input>
-        </u-form-item>
-        <u-form-item label=""
-                     prop="payPassword">
-          <u-input :password="isPwd2"
-          :placeholder="'请输入支付密码'"
-                   v-model="form.payPassword">
-            <template slot="suffix">
-              <u-icon name="eye"
-                      @tap="isPwd2=!isPwd2"
-                      v-if="!isPwd2"></u-icon>
-              <u-icon name="eye-off"
-                      @tap="isPwd2=!isPwd2"
-                      v-else></u-icon>
-            </template>
-          </u-input>
-        </u-form-item>
-      </u-form>
-      <u-button type="success"
-                class="uBtn"
-                shape="circle"
-                color="linear-gradient(to right, #005BAC, #005BAC )"
-                :loading="isLoading"
-                :loadingText="'注册中'"
-                @click="hiLogin">{{ '立即注册' }}</u-button>
-      <u-picker :show="isCountry"
-                keyName="label"
-                immediateChange
-                @confirm="confirmPopup"
-                @cancel="isCountry = false"
-                :columns="countryList"></u-picker>
-
-    </view> -->
-    </view>
-    <view class="mask" v-if="isTrue"> </view>
   </view>
 </template>
 
 <script>
 import * as api from '@/config/goods'
+import {
+  getMemberCode,
+  getPhoneCode,
+  getRegister,
+  autoLogin,
+} from '@/config/share'
+import { setToken } from '@/config/auth.js'
+import store from '@/store'
 export default {
   components: {},
   data() {
@@ -198,6 +139,11 @@ export default {
       pkParent: '',
       form: {
         memberName: '',
+        smsCode: '',
+        loginPwd: '',
+        payPwd: '',
+        parentCode: '',
+        phone: '',
       },
       isLoading: false,
       getCode: '获取验证码',
@@ -210,11 +156,13 @@ export default {
       isPwd: true,
       isPwd1: true,
       isPwd2: true,
+      showSuccessModal: false,
+      successData: null,
       rules: {
-        memberCode: [
+        parentCode: [
           {
             required: true,
-            asyncValidator: this.memberCodeRule,
+            message: '请输入推荐编号',
             trigger: ['blur'],
           },
         ],
@@ -224,6 +172,13 @@ export default {
             message: '请输入会员姓名',
             trigger: ['blur'],
           },
+          {
+            validator: (rule, value, callback) => {
+              return this.$u.test.chinese(value)
+            },
+            message: '请输入中文',
+            trigger: ['blur'],
+          },
         ],
         phone: [
           {
@@ -231,22 +186,29 @@ export default {
             message: '请输入联系方式',
             trigger: ['blur'],
           },
+          {
+            validator: (rule, value, callback) => {
+              return this.$u.test.mobile(value)
+            },
+            message: '手机号格式不正确',
+            trigger: ['blur'],
+          },
         ],
-        code: [
+        smsCode: [
           {
             required: true,
             message: '请输入验证码',
             trigger: ['blur'],
           },
         ],
-        loginPassword: [
+        loginPwd: [
           {
             required: true,
             message: '请输入登录密码',
             trigger: ['blur'],
           },
         ],
-        payPassword: [
+        payPwd: [
           {
             required: true,
             message: '请输入支付密码',
@@ -276,14 +238,14 @@ export default {
             trigger: ['change', 'blur'],
           },
         ],
-        loginPassword: [
+        loginPwd: [
           {
             required: true,
             message: '请输入登录密码',
             trigger: ['change', 'blur'],
           },
         ],
-        payPassword: [
+        payPwd: [
           {
             required: true,
             message: '请输入支付密码',
@@ -296,15 +258,14 @@ export default {
   onReady() {},
   onLoad(options) {
     this.pkParent = options.code
-    this.pkCountry = 1
+    this.pkCountry = options.country || ''
-    this.getGenerate()
     if (this.pkCountry) {
-      this.getCountry()
+      // this.getCountry()
       this.form.pkCountry = this.pkCountry
       uni.setStorageSync('pkCountry', this.pkCountry)
-      uni.redirectTo({
+      // uni.redirectTo({
-        url: '/pages/shareArea/hiList?pkParent=' + this.pkParent,
+      //   url: '/pages/shareArea/hiList?pkParent=' + this.pkParent,
-      })
+      // })
       // this.$refs.uForm1.setRules(this.rules1)
     } else {
       // 获取前缀
@@ -315,11 +276,22 @@ export default {
   },
   onShow() {},
   methods: {
-    setMemberCode() {
+    getUseInfo() {
-      // this.form.memberCode = this.form.phone
+      getUseInfo().then(res => {
-      this.$set(this.form, 'memberCode', this.form.phone)
+        this.userInfo = res.data
+      })
+    },
+    selCountry() {
+      uni.showModal({
+        title: '提示',
+        content: '确认更换自然国',
+        success: res => {
+          if (res.confirm) {
+            this.isCountry = true
+          }
+        },
+      })
     },
-
     memberCodeRule(rule, value, callback) {
       if (!value) {
         callback(new Error('请输入会员编号'))
@@ -338,44 +310,103 @@ export default {
       }
     },
     getHeader() {
-      api.checkShare().then(res => {
+      getMemberCode(this.pkParent).then(res => {
-        if (res.code != 200) {
+        this.$set(this.form, 'parentCode', res.data)
-          this.isTrue = true
+        console.log(this.form)
-        } else {
-          this.isTrue = false
-        }
       })
       // api.prefix(this.pkParent).then((res) => {
       //   this.howHeader = res.msg
       // })
     },
     getGenerate() {
-      return new Promise((resolve, reject) => {
+      api.generate().then(res => {
-        api.generate().then(res => {
+        uni.setStorageSync('mToken', res.msg)
-          resolve(res)
-          uni.setStorageSync('mToken', res.msg)
-        })
       })
     },
     toLogin() {
-      this.$refs.uForm.validate().then(res => {
+      this.$refs.uForm.validate().then(() => {
         this.isLoading = true
-        api
+        // getRegister(Object.assign({}, this.form, { parentCode: this.pkParent }))
-          .regShareMember(
+        getRegister({ ...this.form, parentCode: this.pkParent })
-            Object.assign({}, this.form, { parent: this.pkParent })
-          )
           .then(res => {
             this.isLoading = false
             if (res.code == 200) {
-              uni.redirectTo({
+              this.successData = res.data
-                url:
+              this.showSuccessModal = true
-                  '/pages/shareRegist/success?allData=' +
+            } else {
-                  JSON.stringify(res.data),
+              uni.showToast({
+                title: res.msg || '注册失败',
+                icon: 'none',
               })
             }
           })
+          .catch(() => {
+            this.isLoading = false
+            uni.showToast({
+              title: '注册请求失败',
+              icon: 'none',
+            })
+          })
       })
     },
+    onModalConfirm() {
+      if (this.successData) {
+        this.handleAutoLogin(this.successData)
+      }
+    },
+    onModalCancel() {
+      if (this.successData) {
+        const modalContent = `会员编号: ${this.successData.memberCode}\n会员姓名: ${this.successData.memberName}\n联系方式: ${this.successData.phone}\n登录密码: ${this.successData.loginPassword}\n支付密码: ${this.successData.payPassword}\n登录地址: ${this.successData.urlAddress}`
+        uni.setClipboardData({
+          data: modalContent,
+          success: function () {
+            uni.showToast({
+              title: '复制成功',
+              icon: 'success',
+            })
+          },
+        })
+      }
+    },
+    handleAutoLogin(loginData) {
+      autoLogin({
+        username: loginData.memberCode,
+        password: loginData.loginPassword,
+        uuid: loginData.uuid,
+        pkParent: this.pkParent,
+      })
+        .then(loginRes => {
+          if (loginRes.code === 200) {
+            uni.showToast({
+              title: '登录成功',
+              icon: 'success',
+              duration: 1500,
+            })
+            setToken(loginRes.data.access_token)
+            store.dispatch('GetInfo').then(res => {
+              uni.switchTab({ url: '/pages/index/index' })
+            })
+
+            // setTimeout(() => {
+            //   uni.reLaunch({
+            //     url: '/pages/index/index',
+            //   })
+            // }, 1500)
+          } else {
+            uni.showToast({
+              title: loginRes.msg || '自动登录失败',
+              icon: 'none',
+            })
+          }
+        })
+        .catch(err => {
+          console.log(err)
+          uni.showToast({
+            title: '自动登录请求失败',
+            icon: 'none',
+          })
+        })
+    },
     hiLogin() {
       this.$refs.uForm1.validate().then(res => {
         this.isLoading = true
@@ -419,10 +450,10 @@ export default {
     // 获取验证码
     getVilCode() {
       this.startTime()
-      api
+      getPhoneCode({
-        .verification({
+        phone: this.form.phone,
-          phone: this.form.phone,
+        parentCode: this.pkParent,
-        })
+      })
         .then(res => {})
         .catch(err => {
           this.beginTime = 0
@@ -451,27 +482,24 @@ export default {
 
 <style lang="scss" scoped>
 .content1 {
-  background-image: url('@/static/images/haiRgeiest1.jpg');
-  background-size: 100%;
-  background-repeat: no-repeat;
   height: 100vh;
-}
+  overflow: auto;
-.content {
+  background-image: url('@/static/images/regist-bg.jpg');
-  background-image: url('@/static/images/huan.jpg');
-  // background-image: url('@/static/images/regiestBg.jpg');
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
-  height: 100vh;
+  display: flex;
+  justify-content: center;
+  // padding-top: 35vh;
 }
-.tit {
+
-  font-size: 48px;
+.title {
-  font-family: PangMenZhengDao-Regular, PangMenZhengDao;
+  font-size: 48rpx;
-  font-weight: 400;
+  font-weight: bold;
-  color: #ffffff;
+  color: #333;
   text-align: center;
-  padding-top: 80px;
+  padding-top: 120rpx;
-  margin-bottom: 20px;
+  padding-bottom: 80rpx;
 }
 .index_header {
   background: #f9f9f9;
@@ -490,8 +518,11 @@ export default {
   padding: 0 120rpx;
 }
 .formed1 {
-  padding: 0 120rpx;
+  width: 70%;
-  padding-top: 550rpx;
+  margin-top: 37vh;
+  .custom-input {
+    border-radius: 60rpx;
+  }
 }
 .getCode {
   font-size: 10px;
@@ -516,7 +547,7 @@ export default {
   background: #fff;
 }
 ::v-deep .u-input {
-  background: #fff;
+  background: rgb(233, 233, 233);
 }
 .mask {
   position: fixed;
@@ -525,4 +556,37 @@ export default {
   height: 100vh;
   top: 0;
 }
+
+@keyframes gradient {
+  0% {
+    background-position: 0% 50%;
+  }
+  50% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0% 50%;
+  }
+}
+
+.slot-content {
+  padding: 30rpx 20rpx;
+  font-size: 28rpx;
+}
+.success-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10rpx 0;
+}
+.item-label {
+  color: #606266;
+  margin-right: 20rpx;
+  flex-shrink: 0;
+}
+.item-value {
+  color: #303133;
+  word-break: break-all;
+  text-align: right;
+}
 </style>

util/specialAreaMap.js

@@ -6,7 +6,7 @@ export const REGIEST_AREA = {
 export const UPGRADE_AREA = {
   id: 42,
   // name: '升级专区',
-  name: '复购专区',
+  name: '精品专区',
 }
 
 export const REISSUE_AREA = {