121 lines
4.1 KiB
Vue
121 lines
4.1 KiB
Vue
<script setup lang="ts">
|
||
import { ref, reactive } from "vue"
|
||
import { onShow } from "@dcloudio/uni-app"
|
||
import { constant, router } from "@@/index"
|
||
import { userApi, miniPlatformApi } from "@@/api"
|
||
import { getAppInfo } from "@@/utils/app"
|
||
|
||
import AffirmCheck from "@/sheep/components/common/affirm-check.vue"
|
||
import AffirmModal from "@/sheep/components/common/affirm-modal.vue"
|
||
import ServiceText from "@/sheep/components/common/service-text.vue"
|
||
|
||
const affirmModalRef = ref()
|
||
const state = reactive<any>({
|
||
userInfo: null,
|
||
isAgree: false,
|
||
|
||
loginErrorVisible: false,
|
||
loginErrorCode: null,
|
||
})
|
||
|
||
const serviceTextRef = ref<any>(null)
|
||
|
||
onShow(() => {
|
||
const userInfoKey = constant.storageConstant.USERINFO
|
||
state.userInfo = uni.getStorageSync(userInfoKey)
|
||
})
|
||
|
||
// 小程序获取手机号
|
||
const minAppGetphone = async (e) => {
|
||
const phoneDetail = e?.detail
|
||
if (!phoneDetail) {
|
||
uni.showToast({ title: "获取手机号失败", icon: "none" })
|
||
return
|
||
}
|
||
try {
|
||
uni.showLoading({ title: '登录中...', mask: true })
|
||
// 获取用户手机号
|
||
const { data, code }: any = await miniPlatformApi.autoAdminLogin({
|
||
miniPlatformType: await getAppInfo(),
|
||
code: phoneDetail.code,
|
||
})
|
||
if (data.errorCode) {
|
||
state.loginErrorCode = data.errorCode
|
||
state.loginErrorVisible = true
|
||
uni.hideLoading()
|
||
return
|
||
}
|
||
const { data: userData } = await userApi.userInfo()
|
||
uni.setStorageSync(constant.storageConstant.USERINFO, userData)
|
||
uni.setStorageSync(constant.storageConstant.TOKEN, data)
|
||
uni.hideLoading()
|
||
uni.showToast({ title: "登录成功", icon: "success" })
|
||
router.jump("/pages/tabbar/canteen")
|
||
} catch (error) {
|
||
console.error("登录错误", error);
|
||
}
|
||
}
|
||
|
||
// 没有授权点击登录
|
||
const doLogin = () => {
|
||
// 没有同意
|
||
if (!state.isAgree) {
|
||
affirmModalRef.value.show()
|
||
return
|
||
}
|
||
}
|
||
|
||
const affirmConfirm = () => {
|
||
state.isAgree = true
|
||
}
|
||
|
||
</script>
|
||
|
||
<template>
|
||
<crud-layout title="登录" bg="/static/page/blue-bg.png">
|
||
<view class="h-30rpx" />
|
||
|
||
<view class="flex-col-center m-t-160rpx">
|
||
<view class="size-220rpx bg-white rounded-full flex-row-center">
|
||
<image class="size-200rpx rounded-full" src="/static/logo/jgsw.jpeg" mode="aspectFit" />
|
||
</view>
|
||
<view class="m-t-20rpx sub-text-28">浦江县机关事务智慧后勤一体化平台</view>
|
||
</view>
|
||
|
||
<view class="m-t-160rpx">
|
||
<button v-if="!state.isAgree" class="bg-#0094ff color-white" @click="doLogin">
|
||
手机号一键登录
|
||
</button>
|
||
<button v-else class="bg-#0094ff color-white" open-type="getPhoneNumber" @getphonenumber="minAppGetphone">
|
||
手机号一键登录
|
||
</button>
|
||
</view>
|
||
|
||
<affirm-check v-model="state.isAgree" class="absolute bottom-30rpx" />
|
||
<affirm-modal ref="affirmModalRef" @confirm="affirmConfirm" />
|
||
<service-text ref="serviceTextRef" :showPhoneText="false" />
|
||
<tm-modal :show="state.loginErrorVisible" title="登录错误" cancelText="取消" confirmText="联系客服" height="auto"
|
||
@close="state.loginErrorVisible = false" @confirm="serviceTextRef?.openModal?.()">
|
||
<view class="px-20rpx bottom-40rpx">
|
||
<view v-if="state.loginErrorCode == '10'" class="sub-text-26">
|
||
<text>登录错误，获取本机微信手机号失败，请联系客服</text>
|
||
</view>
|
||
<view v-if="state.loginErrorCode == '20'" class="sub-text-26">
|
||
<text>登录错误，本系统只为浦江县机关事务服务，如有疑问请联系客服</text>
|
||
</view>
|
||
<view v-if="state.loginErrorCode == '30'" class="sub-text-26">
|
||
<text>登录错误，请联系客服</text>
|
||
</view>
|
||
</view>
|
||
</tm-modal>
|
||
</crud-layout>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
:deep() {
|
||
.tmFormItemLabel {
|
||
padding-bottom: 10rpx !important;
|
||
}
|
||
}
|
||
</style>
|