jiangping
2024-05-31 6be28040e74e1ff7764478174a9b5d706fe4fc39
h5/pages/staffLogin/login.vue
@@ -6,32 +6,51 @@
    <view class="login_list">
      <view class="login_list_item">
        <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />
        <input
          v-model="form.account"
          maxlength="18"
          placeholder="账号"
        />
        <input v-model="form.username" maxlength="18" placeholder="账号" />
      </view>
      <view class="login_list_item">
        <image src="@/static/login_ic_password@2x.png" mode="widthFix" />
        <input v-model="form.password" type="password" placeholder="密码" />
      </view>
      <view class="login_list_item">
        <image src="@/static/ic_captcha.png" mode="widthFix"></image>
        <input v-model="form.code" placeholder="验证码" type="text" />
        <image
          @click="initCaptcha"
          :src="captcha.image"
          class="captcha"
          mode="widthFix"
        />
      </view>
    </view>
    <view class="login_btn">
      <view class="login_btn_n" @click="onLogin">立即登录</view>
      <view class="for_psd">忘记密码</view>
      <view @click="$jump('/pages/staffLogin/forgetPsd')" class="for_psd"
        >忘记密码</view
      >
    </view>
    <view class="deal_wrap">
      <checkbox @change="dealChange" />
      <text>登录即同意</text>
      <text class="deal">《安泰物流用户协议》</text>
      <text class="deal" @click="isShowProtocol = true"
        >《安泰物流用户协议》</text
      >
    </view>
    <!--  -->
    <u-popup
      :show="isShowProtocol"
      @close="isShowProtocol = false"
      mode="center"
    >
      <view class="modal">111</view>
    </u-popup>
  </view>
</template>
<script>
import { loginPost } from '@/api'
import { loginPost, loginCaptcha, getUserInfo } from '@/api'
import { mapState, mapMutations } from 'vuex'
export default {
  name: 'login',
@@ -40,32 +59,55 @@
      form: {
        account: '',
        password: '',
      }
      },
      isShowProtocol: false,
      captcha: {}
    }
  },
  created() {
  onLoad() {
    this.initCaptcha()
  },
  methods: {
    ...mapMutations(["setToken", "setUserInfo"]),
    dealChange(e) {
      console.log(e)
    },
    initCaptcha() {
      loginCaptcha().then(res => {
        this.captcha = res.data
      })
    },
    onLogin() {
      const { form } = this
      if (!form.account) return uni.showToast({
        title: '账号后不能为空',
      if (!form.username) return uni.showToast({
        title: '账号不能为空',
        icon: 'none'
      })
      if (!form.password) return uni.showToast({
        title: '密码不能为空',
        icon: 'none'
      })
      if (!form.code) return uni.showToast({
        title: '验证码不能为空',
        icon: 'none'
      })
      loginPost({
        ...form,
        uuid: this.captcha.uuid,
        openId: this.$store.state.openId
      }).then(res => {
        console.log('res', res);
        if (res.code === 200) {
          this.setToken(res.data)
          getUserInfo().then(ress => {
            this.setUserInfo(ress.data)
            uni.redirectTo({
              url: "/pages/staff/index"
            })
          })
        }
      })
    }
  }
@@ -125,6 +167,9 @@
        width: 40rpx;
        height: 40rpx;
      }
      .captcha {
        width: 200rpx;
      }
      input {
        flex: 1;
        height: 100%;
@@ -171,4 +216,7 @@
    }
  }
}
.modal {
  padding: 32rpx;
}
</style>