update 合伙人信息维护

xuxueyang

2024-07-17 51edf3ba7b1e5aa58220f90ee895835bbdfd922e

 pages/login/supplier-reg.vue

文件名从 sub_pages/supplier/supplier-reg/supplier-reg.vue 修改
@@ -1,445 +1,455 @@
<template>

   <view class="main-container login-container img100 relative" style="margin-top: 0rpx;">

      <image class="component-bg"

         src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/a5/a54508de179a4942918ecb2c5a4aa9f5bg.png"

         mode="scaleToFill" />





      <view class="t-login top-bg">

         <view class="nav-title">注册</view>

         <view class="login">

            <form class="cl">

               <view class="t-a titles-top">

                  <view class="title-1">HELLO</view>

                  <view class="title-2">欢迎入驻<span class="title-3">花满芜</span></view>

               </view>





               <view class="t-a form-input" v-if="loginType=='code'">

                  <u-input placeholder="请输入手机号"  :border="false"  v-model="phoneNumber">

                     <template slot="suffix">

                        <view class="get-code" :style="{'color':getCodeBtnColor}" @click.stop="getCode()">

                           {{getCodeText}}

                        </view>

                     </template>

                  </u-input>



                  <!-- <u-input type="text" name="userName" placeholder="请输入手机号" v-model="phoneNumber"

                     style="position: relative;z-index: 1;" /> -->





               </view>





               <view class="t-a form-input" v-if="loginType=='code'">

                  <!--       <input type="text" name="userName" placeholder="请输入手机验证码" v-model="smsCode"

                     style="position: relative;z-index: 1;" /> -->

                  <u-input placeholder="请输入手机验证码"    :border="false"   v-model="smsCode"></u-input>



               </view>

               <view class="t-a form-input" v-if="loginType=='code'">

                  <!-- <input type="text" :password="true" name="password" placeholder="请输入密码" v-model="password" /> -->



                  <u-input :password="true" :border="false"     placeholder="请输入密码" v-model="password"></u-input>

               </view>



               <button @tap="login()" class="bottom-button">注 册</button>



               <view class="flex">

                  <view class="topic-font m-l-a m-r-0" @click="toLogin">前往登录</view>

               </view>

               <view class="flex flex-wrap-normal" style="position: fixed;bottom: 40rpx;left: 40rpx;right: 40rpx;"

                  v-if="false">

                  <view :style="{'margin-top': '8rpx','margin-right': '12rpx','font-size':'24rpx'}"

                     @click="protocal=!protocal" class="component-radio" :class="[protocal?'cur':'']">



                  </view>

                  <view class="topic-gray" @click="toProtocol">请仔细阅读《花满芜合伙人供应商入口小程序隐私保护指引》如您同意该指引，请勾选开始使用本小程序

                  </view>

               </view>

            </form>

         </view>

      </view>

   </view>

</template>

<script>

   // import util from '@/utils/util.js'

   // import gzmzApi from '@/api/gzmzApi.js'

   // import myCache from '@/utils/myCache.js'

   export default {

      data() {

         return {

            openId: '-1',



            userName: '',

            password: '',



            phoneNumber: '',

            smsCode: '',



            checked: false,

            loginType: 'code', //pwd和code，密码和验证码登录

            pcfvalue: undefined,

            getCodeText: '获取验证码',

            getCodeBtnColor: "#20613D",

            getCodeisWaiting: false,

            Timer: undefined,

            protocal: false

         };

      },

      methods: {

         toProtocol() {

            uni.navigateTo({

               url: '/sub_pages/supplier/protocol'

            })

         },

         async getCode() {

            // await this.$message.confirm('是否同意入驻协议')

            // this.protocal = true

            console.log('getCode')

            setTimeout(() => {

               uni.hideKeyboard() //隐藏已经显示的软键盘，如果软键盘没有显示则不做任何操作。

            }, 200)



            if (this.getCodeisWaiting) {

               return;

            }

            if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phoneNumber))) { //校验手机号码是否有误

               uni.showToast({

                  title: '请填写正确手机号码',

                  icon: "none"

               });

               return false;

            }

            this.getCodeText = "发送中..." //发送验证码

            this.getCodeisWaiting = true;

            this.getCodeBtnColor = "#000" //追加样式，修改颜色

            //示例用定时器模拟请求效果

            //setTimeout(()用于在指定的毫秒数后调用函数或计算表达式

            const {

               code

            } = await this.$http.request('post', '/api/sms/send/code', {

               data: {

                  tel: this.phoneNumber,

                  userType: 'supplier'

               }

            })

            if (code == 0) {

               uni.showToast({

                  title: '验证码已发送',

                  icon: "none"

               });

               this.setTimer(); //调用定时器方法

            }else{

               this.getCodeText = "获取验证码" //发送验证码

               this.getCodeisWaiting = false;

               this.getCodeBtnColor = "#20613D";

            }

            // setTimeout(() => {

            //    //弹出提示框

            //    //示例默认1234，生产中请删除这一句。

            //    // this.code = '1234'; //发送验证码，进行填入



            // }, 1000)

         },

         //setTimer： 需要每隔一段时间执行一件事的的时候就需要使用SetTimer函数

         setTimer() {

            let holdTime = 60; //定义变量并赋值

            this.getCodeText = "重新获取(60)"

            //setInterval（）是一个实现定时调用的函数，可按照指定的周期（以毫秒计）来调用函数或计算表达式。

            //setInterval方法会不停地调用函数，直到 clearInterval被调用或窗口被关闭。

            this.Timer = setInterval(() => {

               if (holdTime <= 0) {

                  this.getCodeisWaiting = false;

                  this.getCodeBtnColor = "#20613D";

                  this.getCodeText = "获取验证码"

                  clearInterval(this.Timer); //清除该函数

                  return; //返回前面

               }

               this.getCodeText = "重新获取(" + holdTime + ")"

               holdTime--;

            }, 1000)

         },

         toLogin() {

            uni.redirectTo({

               url: '/pages/login/supplier-login'

            })



         },

         changeAll(e) {

            this.pcfvalue = e.detail.value[0]

         },

         async login() {

            uni.showLoading({

               title: '登陆中'

            });

            var that = this;

            if (!that.phoneNumber) {

               uni.showToast({

                  title: '请输入手机号',

                  icon: 'none'

               });

               return;

            }

            if (!that.smsCode) {

               uni.showToast({

                  title: '请输入手机验证码',

                  icon: 'none'

               });

               return;

            }

            if (!that.password) {

               uni.showToast({

                  title: '请输入密码',

                  icon: 'none'

               });

               return;

            }

            // if (this.pcfvalue == undefined) {

            //    util.showMyToast('必须勾选《用户服务协议》及《隐私政策》');

            //    return;

            // }

            let post = {

               tel: this.phoneNumber,

               smsCode: this.smsCode,

               password: this.password,

               // openId: '123456789'

            }

            // const {

            // code

            // } = await this.$http.request('get', '/api/login/admin')

            const resp = await this.$store.dispatch('regSupplier', post);

            // uni.hideLoading()



            if (resp.code == 0) {



               // myCache.cache("userToken", res.data.accessToken)

               // let userRes = await gzmzApi.getMemberInfo();

               // if (userRes.status) {

               //    myCache.cache("userInfo", JSON.stringify(userRes.data))

               // }

               uni.showToast({

                  title: '注册成功！',

                  icon: 'none'

               });

               setTimeout(() => {

                  this.toLogin()

               }, 1000);



            } else {

               // uni.showToast({

               //    title: '登录失败！',

               //    icon: 'none'

               // });

               return;

            }



         },

         tc1(id) {

            uni.navigateTo({

               url: '/pages/users/xieyi?id=' + id,

            });

         }

      }

   };

</script>

<style lang="scss" scoped>

   .form-input {

      background-color: #f8f7fc;

      border-radius: 50rpx;

<template>
   <view class="main-container login-container img100 relative" style="margin-top: 0rpx;">
      <image class="component-bg"
         src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/a5/a54508de179a4942918ecb2c5a4aa9f5bg.png"
         mode="scaleToFill" />


      <view class="t-login top-bg">
         <view class="nav-title">注册</view>
         <view class="login">
            <form class="cl">
               <view class="t-a titles-top">
                  <view class="title-1">HELLO</view>
                  <view class="title-2">欢迎入驻<span class="title-3">花满芜</span></view>
               </view>


               <view class="t-a form-input" v-if="loginType=='code'">
                  <u-input placeholder="请输入手机号" :border="false" v-model="phoneNumber">
                     <template slot="suffix">
                        <view class="get-code" :style="{'color':getCodeBtnColor}" @click.stop="getCode()">
                           {{getCodeText}}
                        </view>
                     </template>
                  </u-input>

                  <!-- <u-input type="text" name="userName" placeholder="请输入手机号" v-model="phoneNumber"
                     style="position: relative;z-index: 1;" /> -->


               </view>


               <view class="t-a form-input" v-if="loginType=='code'">
                  <!--       <input type="text" name="userName" placeholder="请输入手机验证码" v-model="smsCode"
                     style="position: relative;z-index: 1;" /> -->
                  <u-input placeholder="请输入手机验证码" :border="false" v-model="smsCode"></u-input>

               </view>
               <view class="t-a form-input" v-if="loginType=='code'">
                  <!-- <input type="text" :password="true" name="password" placeholder="请输入密码" v-model="password" /> -->

                  <u-input :password="true" :border="false" placeholder="请输入密码" v-model="password"></u-input>
               </view>

               <button @tap="login()" class="bottom-button">注 册</button>

               <view class="flex">
                  <view class="topic-font m-l-a m-r-0" @click="toLogin">前往登录</view>
               </view>
               <view class="flex flex-wrap-normal" style="position: fixed;bottom: 40rpx;left: 40rpx;right: 40rpx;"
                  v-if="false">
                  <view :style="{'margin-top': '8rpx','margin-right': '12rpx','font-size':'24rpx'}"
                     @click="protocal=!protocal" class="component-radio" :class="[protocal?'cur':'']">

                  </view>
                  <view class="topic-gray" @click="toProtocol">请仔细阅读《花满芜合伙人供应商入口小程序隐私保护指引》如您同意该指引，请勾选开始使用本小程序
                  </view>
               </view>
            </form>
         </view>
      </view>
   </view>
</template>
<script>
   // import util from '@/utils/util.js'
   // import gzmzApi from '@/api/gzmzApi.js'
   // import myCache from '@/utils/myCache.js'
   export default {
      data() {
         return {
            openId: '-1',

            userName: '',
            password: '',

            phoneNumber: '',
            smsCode: '',

            checked: false,
            loginType: 'code', //pwd和code，密码和验证码登录
            pcfvalue: undefined,
            getCodeText: '获取验证码',
            getCodeBtnColor: "#20613D",
            getCodeisWaiting: false,
            Timer: undefined,
            protocal: false,
            // #ifdef PUB_SUPPLIER
            apitype: 'supplier',
            // #endif
            // #ifdef PUB_PARTNER
            apitype: 'partner',
            // #endif

         };
      },
      methods: {
         toProtocol() {
            uni.navigateTo({
               url: '/sub_pages/supplier/protocol'
            })
         },
         async getCode() {
            // await this.$message.confirm('是否同意入驻协议')
            // this.protocal = true
            console.log('getCode')
            setTimeout(() => {
               uni.hideKeyboard() //隐藏已经显示的软键盘，如果软键盘没有显示则不做任何操作。
            }, 200)

            if (this.getCodeisWaiting) {
               return;
            }
            if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phoneNumber))) { //校验手机号码是否有误
               uni.showToast({
                  title: '请填写正确手机号码',
                  icon: "none"
               });
               return false;
            }
            this.getCodeText = "发送中..." //发送验证码
            this.getCodeisWaiting = true;
            this.getCodeBtnColor = "#000" //追加样式，修改颜色
            //示例用定时器模拟请求效果
            //setTimeout(()用于在指定的毫秒数后调用函数或计算表达式
            const {
               code
            } = await this.$http.request('post', '/api/sms/send/code', {
               data: {
                  tel: this.phoneNumber,
                  userType: this.apitype
               }
            })
            if (code == 0) {
               uni.showToast({
                  title: '验证码已发送',
                  icon: "none"
               });
               this.setTimer(); //调用定时器方法
            } else {
               this.getCodeText = "获取验证码" //发送验证码
               this.getCodeisWaiting = false;
               this.getCodeBtnColor = "#20613D";
            }
            // setTimeout(() => {
            //    //弹出提示框
            //    //示例默认1234，生产中请删除这一句。
            //    // this.code = '1234'; //发送验证码，进行填入

            // }, 1000)
         },
         //setTimer： 需要每隔一段时间执行一件事的的时候就需要使用SetTimer函数
         setTimer() {
            let holdTime = 60; //定义变量并赋值
            this.getCodeText = "重新获取(60)"
            //setInterval（）是一个实现定时调用的函数，可按照指定的周期（以毫秒计）来调用函数或计算表达式。
            //setInterval方法会不停地调用函数，直到 clearInterval被调用或窗口被关闭。
            this.Timer = setInterval(() => {
               if (holdTime <= 0) {
                  this.getCodeisWaiting = false;
                  this.getCodeBtnColor = "#20613D";
                  this.getCodeText = "获取验证码"
                  clearInterval(this.Timer); //清除该函数
                  return; //返回前面
               }
               this.getCodeText = "重新获取(" + holdTime + ")"
               holdTime--;
            }, 1000)
         },
         toLogin() {
            uni.redirectTo({
               url: '/pages/login/supplier-login'
            })

         },
         changeAll(e) {
            this.pcfvalue = e.detail.value[0]
         },
         async login() {
            uni.showLoading({
               title: '登陆中'
            });
            var that = this;
            if (!that.phoneNumber) {
               uni.showToast({
                  title: '请输入手机号',
                  icon: 'none'
               });
               return;
            }
            if (!that.smsCode) {
               uni.showToast({
                  title: '请输入手机验证码',
                  icon: 'none'
               });
               return;
            }
            if (!that.password) {
               uni.showToast({
                  title: '请输入密码',
                  icon: 'none'
               });
               return;
            }
            // if (this.pcfvalue == undefined) {
            //    util.showMyToast('必须勾选《用户服务协议》及《隐私政策》');
            //    return;
            // }
            let post = {
               tel: this.phoneNumber,
               smsCode: this.smsCode,
               password: this.password,
               type: this.apitype
               // openId: '123456789'
            }
            // const {
            // code
            // } = await this.$http.request('get', '/api/login/admin')
            const resp = await this.$store.dispatch('regUser', post);
            // uni.hideLoading()

            if (resp.code == 0) {

               // myCache.cache("userToken", res.data.accessToken)
               // let userRes = await gzmzApi.getMemberInfo();
               // if (userRes.status) {
               //    myCache.cache("userInfo", JSON.stringify(userRes.data))
               // }
               uni.showToast({
                  title: '注册成功！',
                  icon: 'none'
               });
               setTimeout(() => {
                  this.toLogin()
               }, 1000);

            } else {
               // uni.showToast({
               //    title: '登录失败！',
               //    icon: 'none'
               // });
               return;
            }

         },
         tc1(id) {
            uni.navigateTo({
               url: '/pages/users/xieyi?id=' + id,
            });
         }
      }
   };
</script>
<style lang="scss" scoped>
   .form-input {
      background-color: #f8f7fc;
      border-radius: 50rpx;
      margin-bottom: 50rpx;
      border: 1px solid #e9e9e9;

      /deep/ .u-input{
      border: 1px solid #e9e9e9;

      /deep/ .u-input {
         padding-left: 60rpx !important;
         padding-right: 40rpx !important;
      }

      /deep/ input {

         height: 70rpx;

         line-height: 70rpx;
		
      }


   }

</style>

<style lang="scss" scoped>

   @import '@/pages/login/login.scss';



   .main-container {

      margin: 20px 0;

   }



   .img-a {

      position: absolute;

      width: 100%;

      top: -150rpx;

      right: 0;

   }



   .img-b {

      position: absolute;

      width: 50%;

      bottom: 0;

      left: -120rpx;

   }



   .to-home {

      margin-top: 30rpx;

      font-size: 30rpx;

      color: #5af;

      display: flex;

      flex-direction: row-reverse;

   }



   .t-login {

      width: 100%;

      margin: 0 auto;

      font-size: 28rpx;

      color: #000;

   }



   .t-login .bg {

      width: 100%;

      position: relative;

   }



   .t-login .login {

      width: 650rpx;

      margin: 60rpx auto;

      margin-top: 0rpx;

      font-size: 28rpx;

      color: #000;

   }



   .t-login button {

      font-size: 28rpx;

      background: #5677fc;

      color: #fff;

      height: 90rpx;

      line-height: 90rpx;

      border-radius: 50rpx;

      box-shadow: 0 5px 7px 0 rgba(86, 119, 252, 0.2);

   }



   .t-login input {

      padding: 0 20rpx 0 60rpx;

      height: 90rpx;

      line-height: 90rpx;

      margin-bottom: 50rpx;

      background: #f8f7fc;

      border: 1px solid #e9e9e9;

      font-size: 28rpx;

      border-radius: 50rpx;

   }



   .t-login .t-a {

      position: relative;



      .get-code {

         // position: absolute;

         // right: 0rpx;

         // top: 0rpx;

         // z-index: 99;

         // padding-top: 25rpx;

         // bottom: 0;

         // padding-right: 40rpx;

         // padding-left: 20rpx;

      }

   }



   .t-login .t-a .icon {

      width: 40rpx;

      height: 40rpx;

      position: absolute;

      left: 24rpx;

      top: 14rpx;

      margin-right: 20rpx;

   }



   .t-login .t-a .line {

      width: 2rpx;

      height: 40rpx;

      background-color: #dedede;

      position: absolute;

      top: 28rpx;

      left: 98rpx;

   }



   .t-login .t-b {

      text-align: left;

      font-size: 46rpx;

      color: #000;

      padding: 300rpx 0 30rpx 0;

      font-weight: bold;

   }



   .t-login .t-b2 {

      text-align: left;

      font-size: 32rpx;

      color: #aaaaaa;

      padding: 0rpx 0 120rpx 0;

   }



   .t-login .t-c {

      position: absolute;

      right: 22rpx;

      top: 22rpx;

      background: #5677fc;

      color: #fff;

      font-size: 24rpx;

      border-radius: 50rpx;

      height: 50rpx;

      line-height: 50rpx;

      padding: 0 25rpx;

      z-index: 999;

   }



   .t-login .t-d {

      text-align: center;

      color: #999;

      margin: 80rpx 0;

   }



   .t-login .t-e {

      text-align: center;

      width: 250rpx;

      margin: 80rpx auto 0;

   }



   .t-login .t-g {

      float: left;

      width: 50%;

   }



   .t-login .t-e image {

      width: 50rpx;

      height: 50rpx;

   }



   .t-login .t-f {

      text-align: center;

      margin: 200rpx 0 0 0;

      color: #666;

   }



   .t-login .t-f text {

      margin-left: 20rpx;

      color: #aaaaaa;

      font-size: 27rpx;

   }



   .t-login .uni-input-placeholder {

      color: #000;

   }



   .cl {

      zoom: 1;

   }



   .cl:after {

      clear: both;

      display: block;

      visibility: hidden;

      height: 0;

      content: '\20';

   }


      /deep/ input {
         height: 70rpx;
         line-height: 70rpx;

      }

   }
</style>
<style lang="scss" scoped>
   @import '@/pages/login/login.scss';

   .main-container {
      margin: 20px 0;
   }

   .img-a {
      position: absolute;
      width: 100%;
      top: -150rpx;
      right: 0;
   }

   .img-b {
      position: absolute;
      width: 50%;
      bottom: 0;
      left: -120rpx;
   }

   .to-home {
      margin-top: 30rpx;
      font-size: 30rpx;
      color: #5af;
      display: flex;
      flex-direction: row-reverse;
   }

   .t-login {
      width: 100%;
      margin: 0 auto;
      font-size: 28rpx;
      color: #000;
   }

   .t-login .bg {
      width: 100%;
      position: relative;
   }

   .t-login .login {
      width: 650rpx;
      margin: 60rpx auto;
      margin-top: 0rpx;
      font-size: 28rpx;
      color: #000;
   }

   .t-login button {
      font-size: 28rpx;
      background: #5677fc;
      color: #fff;
      height: 90rpx;
      line-height: 90rpx;
      border-radius: 50rpx;
      box-shadow: 0 5px 7px 0 rgba(86, 119, 252, 0.2);
   }

   .t-login input {
      padding: 0 20rpx 0 60rpx;
      height: 90rpx;
      line-height: 90rpx;
      margin-bottom: 50rpx;
      background: #f8f7fc;
      border: 1px solid #e9e9e9;
      font-size: 28rpx;
      border-radius: 50rpx;
   }

   .t-login .t-a {
      position: relative;

      .get-code {
         // position: absolute;
         // right: 0rpx;
         // top: 0rpx;
         // z-index: 99;
         // padding-top: 25rpx;
         // bottom: 0;
         // padding-right: 40rpx;
         // padding-left: 20rpx;
      }
   }

   .t-login .t-a .icon {
      width: 40rpx;
      height: 40rpx;
      position: absolute;
      left: 24rpx;
      top: 14rpx;
      margin-right: 20rpx;
   }

   .t-login .t-a .line {
      width: 2rpx;
      height: 40rpx;
      background-color: #dedede;
      position: absolute;
      top: 28rpx;
      left: 98rpx;
   }

   .t-login .t-b {
      text-align: left;
      font-size: 46rpx;
      color: #000;
      padding: 300rpx 0 30rpx 0;
      font-weight: bold;
   }

   .t-login .t-b2 {
      text-align: left;
      font-size: 32rpx;
      color: #aaaaaa;
      padding: 0rpx 0 120rpx 0;
   }

   .t-login .t-c {
      position: absolute;
      right: 22rpx;
      top: 22rpx;
      background: #5677fc;
      color: #fff;
      font-size: 24rpx;
      border-radius: 50rpx;
      height: 50rpx;
      line-height: 50rpx;
      padding: 0 25rpx;
      z-index: 999;
   }

   .t-login .t-d {
      text-align: center;
      color: #999;
      margin: 80rpx 0;
   }

   .t-login .t-e {
      text-align: center;
      width: 250rpx;
      margin: 80rpx auto 0;
   }

   .t-login .t-g {
      float: left;
      width: 50%;
   }

   .t-login .t-e image {
      width: 50rpx;
      height: 50rpx;
   }

   .t-login .t-f {
      text-align: center;
      margin: 200rpx 0 0 0;
      color: #666;
   }

   .t-login .t-f text {
      margin-left: 20rpx;
      color: #aaaaaa;
      font-size: 27rpx;
   }

   .t-login .uni-input-placeholder {
      color: #000;
   }

   .cl {
      zoom: 1;
   }

   .cl:after {
      clear: both;
      display: block;
      visibility: hidden;
      height: 0;
      content: '\20';
   }
</style>