Files
pj_h5_cloud/src/pages/test/login.vue
T
2025-01-03 09:15:55 +08:00

88 lines
2.6 KiB
Vue

<script setup lang="ts">
import { ref, reactive } from "vue";
import { onLoad, onShow } from "@dcloudio/uni-app";
import { hooks, constant, router } from "@@/index";
import { userApi } from "@@/api";
const data = {};
const state = reactive<any>({
userInfo: null,
});
const applyForm = reactive<any>({
username: "",
password: "",
});
const applyFormRules = reactive<any>({
username: [{ required: true, message: "请输入用户名" }],
password: [{ required: true, message: "请输入密码" }],
});
onLoad(() => {});
onShow(() => {
const userInfoKey = constant.storageConstant.USERINFO;
state.userInfo = uni.getStorageSync(userInfoKey);
});
const applyFormRef = ref<any>(null);
const doSubmit = async () => {
applyFormRef.value.submit();
const { isPass } = applyFormRef.value.validate();
if (!isPass) return;
const tokenKey = constant.storageConstant.TOKEN;
const userInfoKey = constant.storageConstant.USERINFO;
uni.showLoading({ title: "登录中...", mask: true });
// try {
const _pa = { ...applyForm };
const res = await userApi.testLogin(_pa);
console.log(res);
if (res.code != 0) {
uni.showToast({ title: res.msg + "。登录失败,请重新登录", icon: "error" });
return;
}
uni.setStorageSync(tokenKey, res.data);
const { data: userData } = await userApi.userInfo();
uni.setStorageSync(userInfoKey, userData);
// } catch (e) {
// console.log(222)
// console.log(e);
// }
uni.hideLoading();
uni.showToast({ title: "登录成功", icon: "none" });
router.back();
};
</script>
<template>
<crud-layout title="登录" bg="/static/page/blue-bg.png">
<view class="h-30rpx" />
<view class="card p-x-30rpx p-y-40rpx">
<tm-form ref="applyFormRef" v-model="applyForm" :rules="applyFormRules" direction="vertical">
<tm-form-item name="username" label="用户名" :showBottom="false">
<tm-input v-model="applyForm.username" placeholder="请输入用户名.." />
</tm-form-item>
<view class="h-30rpx" />
<tm-form-item name="password" label="验证码" :showBottom="false">
<tm-input password showEye v-model="applyForm.password" placeholder="请输入用户密码.." />
</tm-form-item>
</tm-form>
</view>
<view
v-if="state.detailType != 'view'"
class="bg-#0094ff p-y-20rpx text-center rounded-40rpx m-x-30rpx m-t-60rpx sub-text-30 color-white!"
@tap="doSubmit"
>
登录
</view>
</crud-layout>
</template>
<style lang="scss" scoped>
:deep() {
.tmFormItemLabel {
padding-bottom: 10rpx !important;
}
}
</style>