import {
|
reactive,
|
computed,
|
ref,
|
h,
|
onMounted,
|
defineAsyncComponent,
|
onUnmounted,
|
watch
|
} from "vue";
|
import type { FormInstance, FormRules, UploadProps } from "element-plus";
|
import type { stateInfo } from "./types";
|
import {
|
captcha,
|
phoneNumberCode,
|
register,
|
exRole
|
} from "@/api/register/index";
|
import { useRoute, useRouter } from "vue-router";
|
import { message } from "@/utils/message";
|
import { getToken } from "@/utils/auth";
|
import { useNav } from "@/layout/hooks/useNav";
|
import { useUserStoreHook } from "@/store/modules/user";
|
import { baseUrlApi } from "@/api/util";
|
import {
|
addDialog,
|
closeDialog,
|
updateDialog,
|
closeAllDialog
|
} from "@/components/ReDialog";
|
import {
|
enterpriseTypes,
|
createrExRolsInformation
|
} from "@/api/register/index";
|
import { cloneDeep } from "@pureadmin/utils";
|
import { changeCusExtend } from "@/api/mine";
|
import agreement from "../component/agreement.vue";
|
const route = useRoute();
|
export function useRegister() {
|
const isLoading = ref(false);
|
const router = useRouter();
|
const state: stateInfo = reactive({
|
headers: {
|
Authorization: `Bearer ${getToken()?.accessToken}`
|
},
|
isShowPassword: false,
|
ruleForm: {
|
id: null, // 主键Id，可为空
|
enterpriseType: [], // 企业类型，不可空，最小长度1
|
exRoleCode: "", // 主体角色代码，不可空，最小长度1
|
transactionCode: "", // 交易主体代码（同角色代码exRoleCode，不可空，最小长度1）
|
businessLicense: "", // 营业执照文件路径，不可空，最小长度1
|
enterpriseName: "", // 企业名称，不可空，最小长度1
|
unifiedSocialCreditCode: "", // 统一社会信用代码，不可空，最小长度1
|
registeredCapital: "", // 注册资金，不可空，最小长度1
|
legalRepresentativeName: "", // 法定代表人姓名，不可空，最小长度1
|
legalRepresentativeIdCard: "", // 法定代表人身份证文件路径，不可空，最小长度1
|
legalRepresentativeIdNumber: "", // 法定代表人身份证号码，不可空，最小长度1
|
legalRepresentativePhone: "", // 法定代表人电话，不可空，最小长度1
|
residence: "", // 企业住所，不可空，最小长度1
|
enterprisePhone: "", // 企业联系电话，不可空，最小长度1
|
establishmentTime: "", // 企业成立时间，不可空，date-time格式
|
mainBusiness: null, // 企业主营业务，可为空
|
enterpriseEmail: "", // 企业邮箱，不可空，最小长度1
|
operatorName: "", // 业务经办人姓名/管理员姓名，不可空，最小长度1
|
operatorIdCard: "", // 业务经办人身份证文件路径或标识，不可空，最小长度1
|
operatorIdNumber: "", // 业务经办人身份证号码，不可空，最小长度1
|
operatorPhone: null, // 业务经办人电话/管理员电话，可为空
|
bankName: "", // 开户行名称，不可空，最小长度1
|
bankAccount: "", // 开户行账号，不可空，最小长度1
|
phoneVCode: "", // 电话号码校验码，不可空，最小长度1
|
bankAccountIMG: "" //开户行收款二维码
|
},
|
rules: {
|
enterpriseType: [
|
{
|
required: true,
|
message: "请选择企业类型",
|
trigger: "blur"
|
}
|
],
|
exRoleCode: [
|
{
|
required: true,
|
message: "请输入选择注册身份",
|
trigger: "blur"
|
}
|
],
|
transactionCode: [
|
{
|
required: true,
|
message: "请输入交易主体代码",
|
trigger: "blur"
|
}
|
],
|
businessLicense: [
|
{
|
required: true,
|
message: "请上传营业执照",
|
trigger: "blur"
|
}
|
],
|
enterpriseName: [
|
{
|
required: true,
|
message: "请输入企业名称",
|
trigger: "blur"
|
}
|
],
|
unifiedSocialCreditCode: [
|
{
|
required: true,
|
message: "请输入统一社会信用代码",
|
trigger: "blur"
|
}
|
],
|
registeredCapital: [
|
{
|
required: true,
|
message: "请输入注册资金",
|
trigger: "blur"
|
}
|
],
|
legalRepresentativeName: [
|
{
|
required: true,
|
message: "请输入法定代表人姓名",
|
trigger: "blur"
|
}
|
],
|
legalRepresentativeIdCard: [
|
{
|
required: true,
|
message: "请上传法定代表人身份证",
|
trigger: "blur"
|
}
|
],
|
legalRepresentativeIdNumber: [
|
{
|
required: true,
|
message: "请输入法定代表人身份证号码",
|
trigger: "blur"
|
}
|
],
|
legalRepresentativePhone: [
|
{
|
required: true,
|
message: "请输入法定代表人电话",
|
trigger: "blur"
|
}
|
],
|
residence: [
|
{
|
required: true,
|
message: "请输入企业住所",
|
trigger: "blur"
|
}
|
],
|
enterprisePhone: [
|
{
|
required: true,
|
message: "请输入企业联系电话",
|
trigger: "blur"
|
}
|
],
|
establishmentTime: [
|
{
|
required: true,
|
message: "请选择企业成立时间",
|
trigger: "blur"
|
}
|
],
|
enterpriseEmail: [
|
{
|
required: true,
|
message: "请输入企业邮箱",
|
trigger: "blur"
|
}
|
],
|
operatorName: [
|
{
|
required: true,
|
message: "请输入业务经办人姓名",
|
trigger: "blur"
|
}
|
],
|
operatorIdCard: [
|
{
|
required: true,
|
message: "请上传业务经办人身份证",
|
trigger: "blur"
|
}
|
],
|
operatorIdNumber: [
|
{
|
required: true,
|
message: "请输入业务经办人身份证号码",
|
trigger: "blur"
|
}
|
],
|
bankName: [
|
{
|
required: true,
|
message: "请输入开户行名称",
|
trigger: "blur"
|
}
|
],
|
bankAccount: [
|
{
|
required: true,
|
message: "请输入开户行账号",
|
trigger: "blur"
|
}
|
],
|
phoneVCode: [
|
{
|
required: true,
|
message: "请输入手机验证码",
|
trigger: "blur"
|
}
|
],
|
operatorPhone: [
|
{
|
required: true,
|
message: "请输入业务经办人联系电话",
|
trigger: "blur"
|
}
|
]
|
},
|
loading: {
|
signIn: false
|
},
|
captchaImage: "",
|
rotateVerifyVisible: false,
|
// rotateVerifyImg: verifyImg,
|
// rotateVerifyImg: themeConfig.value.logoUrl,
|
secondVerEnabled: false,
|
// captchaEnabled: false,
|
isPassRotate: false,
|
capsLockVisible: false,
|
hideTenantForLogin: false,
|
expirySeconds: 60, // 验证码过期时间
|
phoneSeconds: 0, // 手机验证码倒计时
|
roleList: [],
|
code: "",
|
codeId: "",
|
checkedAgree: false,
|
enterpriseList: []
|
});
|
// 验证码过期计时器
|
let timer: any = null;
|
let phonetimer: any = null;
|
|
// 页面初始化
|
onMounted(async () => {
|
// 若URL带有Token参数（第三方登录）
|
// const accessToken = route.query.token;
|
// if (accessToken) await saveTokenAndInitRoutes(accessToken);
|
// watch(
|
// () => themeConfig.value.isLoaded,
|
// isLoaded => {
|
// if (isLoaded) {
|
// 获取登录配置
|
// state.hideTenantForLogin = themeConfig.value.hideTenantForLogin ?? true;
|
// state.secondVerEnabled = themeConfig.value.secondVer ?? true;
|
// state.captchaEnabled = themeConfig.value.captcha ?? true;
|
|
// 获取验证码
|
getCaptcha();
|
exRole().then(res => {
|
state.roleList = res.result;
|
});
|
const nowRole = useUserStoreHook()?.nowRole;
|
// console.log(nowRole);
|
// state.ruleForm.exRoleCode = route.query.code;
|
// if (
|
// state.ruleForm.exRoleCode ==
|
// useUserStoreHook().enterpriseInfo.transactionCode
|
// ) {
|
// state.ruleForm = cloneDeep(useUserStoreHook().enterpriseInfo);
|
// state.ruleForm.enterpriseType = state.ruleForm.enterpriseType.split(",");
|
// isFirst.value = false;
|
// }
|
const resTypes = await enterpriseTypes();
|
state.enterpriseList = resTypes?.result;
|
// 注册验证码过期计时器
|
// if (state.captchaEnabled) {
|
timer = setInterval(() => {
|
if (state.expirySeconds > 0) state.expirySeconds -= 1;
|
}, 1000);
|
|
// }
|
// }
|
// },
|
// { immediate: true }
|
// );
|
|
// 检测大小写按键/CapsLK
|
document.addEventListener("keyup", handleKeyPress);
|
});
|
|
// 页面卸载
|
onUnmounted(() => {
|
// 销毁验证码过期计时器
|
clearInterval(timer);
|
timer = null;
|
clearInterval(phonetimer);
|
phonetimer = null;
|
|
document.removeEventListener("keyup", handleKeyPress);
|
});
|
|
// 检测大小写按键
|
function handleKeyPress(e: KeyboardEvent) {
|
if (e.getModifierState != undefined)
|
state.capsLockVisible = e.getModifierState("CapsLock");
|
}
|
// 获取验证码
|
async function getCaptcha() {
|
// if (!state.captchaEnabled) return;
|
state.code = "";
|
const res = await captcha();
|
state.captchaImage = "data:text/html;base64," + res.result?.img;
|
state.expirySeconds = res.result?.expirySeconds;
|
state.codeId = res.result?.id;
|
}
|
const ruleFormRef = ref<FormInstance>();
|
|
// 验证码区域文字说明
|
const spanRef = ref();
|
const uploadSFZ = ref();
|
async function sendValidationCode() {
|
if (!state.ruleForm.operatorPhone) {
|
return message("请先输入业务经办人联系电话", { type: "warning" });
|
}
|
if (!state.code) {
|
return message("请先输入验证码", { type: "warning" });
|
}
|
const obj = {
|
phone: state.ruleForm.operatorPhone,
|
code: state.code,
|
codeId: state.codeId
|
};
|
const res = await phoneNumberCode(obj);
|
if (res?.code != 200) {
|
return message(res?.message, { type: "warning" });
|
}
|
state.phoneSeconds = 60;
|
phonetimer = setInterval(() => {
|
if (state.phoneSeconds > 0) state.phoneSeconds -= 1;
|
}, 1000);
|
}
|
|
function resetForm(formEl: FormInstance | undefined) {
|
if (!formEl) return;
|
formEl.resetFields();
|
}
|
|
// 提交企业注册信息
|
async function sumbitData(formEl: FormInstance | undefined) {
|
if (!formEl) return;
|
await formEl.validate((valid, fields) => {
|
if (valid) {
|
if (state.checkedAgree) {
|
addDialog({
|
width: "20%",
|
title: "确认信息",
|
contentRenderer: () => (
|
<p>
|
请您认真核对填报的资料是否正确，如因填报错误影响后续投标等操作，平台不承担任何责任，所有后果需要自行承担，请您谨慎填写！
|
</p>
|
), // jsx 语法 （注意在.vue文件启用jsx语法，需要在script开启lang="tsx"）
|
closeCallBack: ({ options, args }) => {
|
if (args?.command === "cancel") {
|
// 您点击了取消按钮
|
} else if (args?.command === "sure") {
|
state.ruleForm.account = state.ruleForm.operatorPhone;
|
const obj = cloneDeep(state.ruleForm);
|
obj.enterpriseType = state.ruleForm.enterpriseType.join(",");
|
register(obj).then(res => {
|
if (res?.code == 200) {
|
message("注册成功！", { type: "success" });
|
router.replace({
|
path: "/RegisterSucess",
|
query: {
|
code: obj.exRoleCode
|
}
|
});
|
} else {
|
message(res?.message, { type: "warning" });
|
}
|
});
|
} else {
|
}
|
}
|
});
|
} else {
|
message("请勾选用户协议", { type: "warning" });
|
}
|
} else {
|
const fail = [];
|
for (const key in fields) {
|
fail.push(fields[key][0].message);
|
}
|
message(fail[0], {
|
type: "warning"
|
});
|
}
|
});
|
}
|
function handleAvatarSuccess(
|
response: Parameters<UploadProps["onSuccess"]>[0],
|
uploadFile: Parameters<UploadProps["onSuccess"]>[1]
|
): ReturnType<UploadProps["onSuccess"]> {
|
if (response.code == "200") {
|
// state.ruleForm.businessLicense = URL.createObjectURL(uploadFile.raw!);
|
const res = response.result;
|
state.ruleForm.businessLicense = res.url; // 营业执照文件路径
|
state.ruleForm.enterpriseName = res.info.Name; // 企业名称
|
state.ruleForm.unifiedSocialCreditCode = res.info.RegNum; // 统一社会信用代码
|
state.ruleForm.registeredCapital = res.info.Capital; // 注册资金（单位：万元）
|
state.ruleForm.legalRepresentativeName = res.info.Person; // 法定代表人姓名
|
state.ruleForm.establishmentTime = res.info.SetDate; // 企业成立时间（格式示例：2025-07-08 14:56:54）
|
state.ruleForm.residence = res.info.Address; // 企业住所（下拉选择，暂以字符串接收）
|
state.ruleForm.mainBusiness = res.info.Business; // 企业主营业务
|
} else {
|
message(response.message, {
|
type: "error"
|
});
|
}
|
isLoading.value = false;
|
}
|
|
function handleAvatarSuccessLegalRepresentative(
|
response: Parameters<UploadProps["onSuccess"]>[0],
|
uploadFile: Parameters<UploadProps["onSuccess"]>[1]
|
): ReturnType<UploadProps["onSuccess"]> {
|
console.log(response);
|
if (response.code == "200") {
|
// state.ruleForm.businessLicense = URL.createObjectURL(uploadFile.raw!);
|
const res = response.result;
|
// if (res.info.Name !== state.ruleForm.enterpriseName) {
|
// message("请上传法定代表人身份证！", { type: "error" });
|
// } else {
|
state.ruleForm.legalRepresentativeIdCard = res.url; // 法定代表人身份证文件路径
|
state.ruleForm.legalRepresentativeIdNumber = res.info.IdNum; // 法定代表人身份证号码
|
// }
|
} else {
|
message(response.message, {
|
type: "error"
|
});
|
}
|
isLoading.value = false;
|
}
|
|
function handleAvatarSuccessOperator(
|
response: Parameters<UploadProps["onSuccess"]>[0],
|
uploadFile: Parameters<UploadProps["onSuccess"]>[1]
|
): ReturnType<UploadProps["onSuccess"]> {
|
if (response.code == "200") {
|
// state.ruleForm.businessLicense = URL.createObjectURL(uploadFile.raw!);
|
const res = response.result;
|
state.ruleForm.operatorName = res.info.Name; // 业务经办人姓名
|
state.ruleForm.operatorIdCard = res.url; // 业务经办人身份证文件路径或标识（上传后存储信息）
|
state.ruleForm.operatorIdNumber = res.info.IdNum; // 业务经办人身份证号码
|
} else {
|
message(response.message, {
|
type: "error"
|
});
|
}
|
isLoading.value = false;
|
}
|
function handlebankAccountIMG(
|
response: Parameters<UploadProps["onSuccess"]>[0],
|
uploadFile: Parameters<UploadProps["onSuccess"]>[1]
|
): ReturnType<UploadProps["onSuccess"]> {
|
if (response.code == "200") {
|
// state.ruleForm.businessLicense = URL.createObjectURL(uploadFile.raw!);
|
state.ruleForm.bankAccountIMG = response.result;
|
} else {
|
message(response.message, {
|
type: "error"
|
});
|
}
|
isLoading.value = false;
|
}
|
function beforeAvatarUpload(
|
rawFile: Parameters<UploadProps["beforeUpload"]>[0]
|
): ReturnType<UploadProps["beforeUpload"]> {
|
isLoading.value = true;
|
// if (rawFile.type !== "image/jpeg") {
|
// message(`请上传jpeg类型的图片`, {
|
// type: "error"
|
// });
|
// return false;
|
// } else if (rawFile.size / 1024 / 1024 > 2) {
|
// message(`图片大小不能超过 2MB！`, {
|
// type: "error"
|
// });
|
// return false;
|
// }
|
return true;
|
}
|
function isLeaf(data) {
|
data.forEach(item => {
|
if (!item.child) {
|
item.leaf = true;
|
}
|
});
|
}
|
function loadNode(node, resolve) {
|
if (node.level === 0) {
|
isLeaf(node.data);
|
return resolve(node.data);
|
} else if (node.level > 0 && node.data.child) {
|
isLeaf(node.data.child);
|
return resolve(node.data.child);
|
} else {
|
return resolve([]);
|
}
|
}
|
function openAgreement() {
|
addDialog({
|
width: "40%",
|
title: "确认信息",
|
contentRenderer: () => h(agreement), // jsx 语法 （注意在.vue文件启用jsx语法，需要在script开启lang="tsx"）
|
closeCallBack: ({ options, args }) => {
|
if (args?.command === "cancel") {
|
// 您点击了取消按钮
|
} else if (args?.command === "sure") {
|
} else {
|
}
|
}
|
});
|
}
|
// 去登录
|
function toLogin() {
|
router.push({ name: "Login" });
|
}
|
return {
|
state,
|
resetForm,
|
sendValidationCode,
|
getCaptcha,
|
ruleFormRef,
|
spanRef,
|
uploadSFZ,
|
isLoading,
|
beforeAvatarUpload,
|
handleAvatarSuccessOperator,
|
handleAvatarSuccessLegalRepresentative,
|
sumbitData,
|
handleAvatarSuccess,
|
loadNode,
|
handlebankAccountIMG,
|
openAgreement,
|
toLogin
|
};
|
}
|
