王恒
2025-08-06 c62f4961f9d86460a5d483d7b31c05f98b113290
pages/companyLogin/companyLogin.vue
@@ -1,16 +1,16 @@
<!-- 企业登录 -->
<template>
   <view class="companylogin">
      <u-navbar title="" :autoBack="true" bgColor="transparent">
         <template slot="center">
         </template>
      </u-navbar>
      <view class="image-box">
         <image src="/static/policy/loginHeader.png" mode="widthFix" ></image>
      </view>
      <view class="content-box">
         <!-- <u-form label-width="60" labelAlign="right" >
  <view class="companylogin">
    <u-navbar :autoBack="true" bgColor="transparent">
      <template slot="center">
      </template>
    </u-navbar>
    <view class="image-box">
      <image src="/static/policy/loginHeader.png" mode="widthFix"></image>
    </view>
    <view class="content-box">
      <!-- <u-form label-width="60" labelAlign="right" >
            <u-form-item label="手机号">
               <u-input style="width: 80%;" v-model="form.phone" placeholder="请输入"></u-input>
            </u-form-item>
@@ -23,230 +23,294 @@
               </u-input>
            </u-form-item>
         </u-form> -->
         <view class="form">
            <view class="form-item margin-bottom">
               <view class="form-label">
                  手机号
               </view>
               <view class="form-input">
                  <input type="number"  v-model="form.phone"  placeholder="请输入11位手机号"/>
               </view>
            </view>
            <view class="form-item">
               <view class="form-label">
                  验证码
               </view>
               <view class="form-input set-flex set-flex-content-between">
                  <input type="number" v-model="form.code"  placeholder="请输入验证码"/>
                  <view @click="getCode">
                     <text class="driver"></text>
                     <text class="getcode">{{tips}}</text>
                  </view>
               </view>
            </view>
         </view>
         <view style="margin-top: 56rpx;">
            <view class="per-button" @click="loging">登录</view>
         </view>
          <view @click="goRegister" class="company-register" v-if="form.userType == '02'">
             企业注册
          </view>
         <!-- <u--text text="企业注册" type="primary" @click="goRegister"></u--text> -->
      </view>
   </view>
      <view class="form">
        <view class="form-item margin-bottom">
          <view class="form-label">
            手机号
          </view>
          <view class="form-input">
            <input type="number" v-model="form.phone" placeholder="请输入11位手机号" />
          </view>
        </view>
        <view class="form-item">
          <view class="form-label">
            验证码
          </view>
          <view class="form-input set-flex set-flex-content-between">
            <input type="number" v-model="form.code" placeholder="请输入验证码" />
            <view>
              <text class="driver"></text>
              <text class="getcode">{{tips}}</text>
            </view>
          </view>
        </view>
      </view>
      <view style="margin-top: 56rpx;">
        <view class="per-button" @click="loging">登录</view>
      </view>
      <view @click="goRegister" class="company-register" v-if="form.userType == '02'">
        企业注册
      </view>
      <!-- <u--text text="企业注册" type="primary" @click="goRegister"></u--text> -->
    </view>
    <selectVue ref="selectVue" @select="select"></selectVue>
  </view>
</template>
<script>
   // 00营商办,01执法,02企业 区分不同的登陆页面
   import { getCode, codeLogin, getInfo } from '@/api/auth.js'
   export default {
      data() {
         return {
            tips: '获取验证码',
            form: {
               phone: '',
               code: '',
               userType: '01'
            },
            loginToken: '',
            isSendCode: false,
            countdownTime: 20,
            timer: ''
         }
      },
      onLoad(options) {
         if(options.code) {
            this.form.userType = options.code
         }
      },
      onUnload() {
         if(this.timer) {
            clearTimeout(this.timer)
            this.timer = null
         }
      },
      methods: {
         getCode() {
            if(!this.form.phone){
               uni.showToast({
                  title: '请输入手机号',
                  icon: 'none'
               })
               return
            }
            if(!this.$u.test.mobile(this.form.phone)){
               uni.showToast({
                  title: '请输入正确的手机号',
                  icon: 'none'
               })
               return
            }
            if (!this.isSendCode) {
               this.isSendCode = true
               uni.showLoading({
                  title: '正在获取验证码'
               })
               getCode({phone: this.form.phone }).then(val => {
                     if(val.data.code == 200) {
                        this.startCountdown()
                        uni.hideLoading();
                        this.tips = `${this.countdownTime}s后重新获取`
                        uni.$u.toast('验证码已发送');
                     }
               }).catch(err => {
                  this.isSendCode = false
               })
            } else {
               uni.$u.toast('倒计时结束后再发送');
            }
         },
         startCountdown() {
            if(this.timer) {
               clearTimeout(this.timer)
               this.timer = null
            }
            if(this.countdownTime <= 0) {
               this.tips = "重新获取"
               this.isSendCode = false
               this.countdownTime = 20
               return
            }
            this.timer = setTimeout(() => {
               this.countdownTime--
               this.tips = `${this.countdownTime}s后重新获取`
               this.startCountdown()
            }, 1000)
         },
         loging() {
            if(!this.form.phone){
               uni.showToast({
                  title: '请输入手机号',
                  icon: 'none'
               })
               return
            }
            if(!this.form.code){
               uni.showToast({
                  title: '请输入验证码',
                  icon: 'none'
               })
               return
            }
            codeLogin(this.form).then(val => {
               if(val.data.token) {
                  this.loginToken = val.data.token
                  uni.setStorageSync('sessionToken', this.loginToken)
                  this.getInfo()
               }
            })
         },
         getInfo() {
            getInfo().then(val => {
               uni.setStorageSync('userInfo',  val.data.data)
               if(this.form.userType == '02') {
                  uni.reLaunch({
                     url:`/qiye/qiyeIndex/qiyeIndex?id=${val.data.data.deptId}`
                  })
               } else if(this.form.userType == '01'){
                  uni.reLaunch({
                     url:`/policy/policyIndex/policyIndex`
                  })
               } else {
                  uni.reLaunch({
                     url:`/policy/policyIndex/policyIndex`
                  })
               }
            })
         },
         goRegister() {
            uni.navigateTo({
               url: `/pages/registerCompany/registerCompany`
            })
         }
      }
   }
  // 00营商办,01执法,02企业 区分不同的登陆页面
  import {
    getCode,
    codeLogin,
    getInfo,
    getCompanyList
  } from '@/api/auth.js'
  import selectVue from '@/components/select.vue'
  export default {
    components: {
      selectVue
    },
    data() {
      return {
        tips: '获取验证码',
        form: {
          phone: '',
          code: '',
          userType: '01'
        },
        loginToken: '',
        isSendCode: false,
        countdownTime: 20,
        timer: '',
        sessionToken: "",
        userInfo: {}
      }
    },
    onLoad(options) {
      if (options.code) {
        this.form.userType = options.code
      }
    },
    onUnload() {
      if (this.timer) {
        clearTimeout(this.timer)
        this.timer = null
      }
    },
    methods: {
      getCode() {
        if (!this.form.phone) {
          uni.showToast({
            title: '请输入手机号',
            icon: 'none'
          })
          return
        }
        if (!this.$u.test.mobile(this.form.phone)) {
          uni.showToast({
            title: '请输入正确的手机号',
            icon: 'none'
          })
          return
        }
        if (!this.isSendCode) {
          this.isSendCode = true
          uni.showLoading({
            title: '正在获取验证码'
          })
          getCode({
            phone: this.form.phone
          }).then(val => {
            if (val.data.code == 200) {
              this.startCountdown()
              uni.hideLoading();
              this.tips = `${this.countdownTime}s后重新获取`
              uni.$u.toast('验证码已发送');
            }
          }).catch(err => {
            this.isSendCode = false
          })
        } else {
          uni.$u.toast('倒计时结束后再发送');
        }
      },
      startCountdown() {
        if (this.timer) {
          clearTimeout(this.timer)
          this.timer = null
        }
        if (this.countdownTime <= 0) {
          this.tips = "重新获取"
          this.isSendCode = false
          this.countdownTime = 20
          return
        }
        this.timer = setTimeout(() => {
          this.countdownTime--
          this.tips = `${this.countdownTime}s后重新获取`
          this.startCountdown()
        }, 1000)
      },
      loging() {
        if (!this.form.phone) {
          uni.showToast({
            title: '请输入手机号',
            icon: 'none'
          })
          return
        }
        // if(!this.form.code){
        //    uni.showToast({
        //       title: '请输入验证码',
        //       icon: 'none'
        //    })
        //    return
        // }
        codeLogin(this.form).then(val => {
          if (val.data.token) {
            this.loginToken = val.data.token
            uni.setStorageSync('sessionToken', this.loginToken)
            this.getInfo()
          }
        })
      },
      getInfo() {
        getInfo().then(val => {
          // uni.setStorageSync('userInfo',  val.data.data)
          if (val.data.code === 200) {
            this.userInfo = val.data.data
            if (this.form.userType == '02') {
              // 获取企业
              this.getCompanyList(val.data.data.phonenumber)
            } else if (this.form.userType == '01') {
              uni.setStorageSync('userInfo', val.data.data)
              // uni.setStorageSync('sessionToken', this.loginToken)
              uni.reLaunch({
                url: `/policy/policyIndex/policyIndex`
              })
            } else {
              uni.setStorageSync('userInfo', val.data.data)
              // uni.setStorageSync('sessionToken', this.loginToken)
              uni.reLaunch({
                url: `/policy/policyIndex/policyIndex`
              })
            }
          } else {
            uni.removeStorageSync('sessionToken')
            uni.showToast({
              title: val.data.msg,
              icon: 'none'
            })
          }
        }).catch(err => {
          uni.removeStorageSync('sessionToken')
        })
      },
      goRegister() {
        uni.navigateTo({
          url: `/pages/registerCompany/registerCompany`
        })
      },
      getCompanyList(companyPhone) {
        getCompanyList({
          companyPhone,
          companyStatus: 0,
          checkStatus: 2
        }).then(val => {
          if (val.data.rows.length > 1) {
            this.$refs.selectVue.open(val.data.rows)
          } else {
            uni.setStorageSync('userInfo', this.userInfo)
            uni.reLaunch({
              url: `/qiye/qiyeIndex/qiyeIndex?id=${this.userInfo.deptId}`
            })
          }
        })
      },
      select(event) {
        uni.setStorageSync('userInfo', this.userInfo)
        uni.reLaunch({
          url: `/qiye/qiyeIndex/qiyeIndex?id=${event}`
        })
      }
    }
  }
</script>
<style scoped lang="scss">
   .companylogin {
      &>.image-box {
         width: 100%;
         height: 345rpx;
         text-align: center;
         background-color: #111;
         &>image{
            width: 100%;
            height: 345rpx;
         }
      }
      .content-box{
         border-radius: 40rpx 40rpx 0 0;
         padding: 40rpx 32rpx;
         position: relative;
         top: 80rpx;
         background-color: white;
         .form {
            .form-item{
               .form-label{
                  font-size: 34rpx;
                  margin: 0 0 24rpx 16rpx;
               }
               .form-input{
                  background-color: #F7F7F7;
                  padding: 20rpx;
                  border-radius: 20rpx;
               }
            }
         }
         .margin-bottom{
            margin-bottom: 36rpx;
         }
         .getcode{
            color: #1171E0;
            font-size: 34rpx;
            font-weight: 500;
            width: 20%;
         }
         .driver{
            display: inline-block;
            vertical-align: middle;
            margin-right: 20rpx;
            width: 2rpx;
            height: 48rpx;
            background-color: #C3C6CD;
         }
      }
      .company-register{
         position: fixed;
         bottom: 32rpx;
         left: 50%;
         transform: translateX(-50%);
         padding: 16rpx 46rpx;
         color: #1171E0;
         display: inline-block;
         border-radius: 12rpx;
         border: 2rpx solid #ABD2FF;
         background: #F0F8FF;
      }
   }
  .companylogin {
    &>.image-box {
      width: 100%;
      height: 345rpx;
      text-align: center;
      background-color: #111;
      &>image {
        width: 100%;
        height: 345rpx;
      }
    }
    .content-box {
      border-radius: 40rpx 40rpx 0 0;
      padding: 40rpx 32rpx;
      position: relative;
      top: 80rpx;
      background-color: white;
      .form {
        .form-item {
          .form-label {
            font-size: 34rpx;
            margin: 0 0 24rpx 16rpx;
          }
          .form-input {
            background-color: #F7F7F7;
            padding: 20rpx;
            border-radius: 20rpx;
          }
        }
      }
      .margin-bottom {
        margin-bottom: 36rpx;
      }
      .getcode {
        color: #1171E0;
        font-size: 34rpx;
        font-weight: 500;
        width: 20%;
      }
      .driver {
        display: inline-block;
        vertical-align: middle;
        margin-right: 20rpx;
        width: 2rpx;
        height: 48rpx;
        background-color: #C3C6CD;
      }
    }
    .company-register {
      position: fixed;
      bottom: 32rpx;
      left: 50%;
      transform: translateX(-50%);
      padding: 16rpx 46rpx;
      color: #1171E0;
      display: inline-block;
      border-radius: 12rpx;
      border: 2rpx solid #ABD2FF;
      background: #F0F8FF;
    }
  }
  ::v-deep .u-radio {
    margin-bottom: 20rpx;
  }
</style>