Commit 847bd345 authored by LiXuyang's avatar LiXuyang

个人信息

parent 3cc9e1ed
This diff is collapsed.
......@@ -4,7 +4,7 @@ import { InputProps } from 'ant-design-vue';
export const identityFormSchema: FormSchema[] = [
{
field: 'identity',
label: '身份选择',
label: '身份选择',
defaultValue: '数据买家',
slot: 'identity',
required: true,
......@@ -13,25 +13,25 @@ export const identityFormSchema: FormSchema[] = [
export const enterpriseFormSchema: FormSchema[] = [
{
field: 'license',
label: '营业执照',
label: '营业执照',
slot: 'license',
required: true,
},
{
field: 'logo',
label: '公司LOGO',
label: '公司LOGO',
slot: 'logo',
required: true,
},
{
field: 'companyName',
label: '公司名称',
label: '公司名称',
slot: 'companyName',
required: true,
},
{
field: 'code',
label: '统一社会信用代码',
label: '统一社会信用代码',
component: 'Input',
componentProps: {
placeholder: '请输入统一社会信用代码',
......@@ -40,13 +40,13 @@ export const enterpriseFormSchema: FormSchema[] = [
},
{
field: 'leader',
label: '法人',
label: '法人',
slot: 'leader',
required: true,
},
{
field: 'leaderNum',
label: '法人身份证号码',
label: '法人身份证号码',
component: 'Input',
componentProps: {
placeholder: '请输入法人身份证号码',
......@@ -55,7 +55,7 @@ export const enterpriseFormSchema: FormSchema[] = [
},
{
field: 'buildTime',
label: '成立日期',
label: '成立日期',
component: 'DatePicker',
componentProps: {
placeholder: '请选择成立日期',
......@@ -64,7 +64,7 @@ export const enterpriseFormSchema: FormSchema[] = [
},
{
field: 'registerNum',
label: '注册资本',
label: '注册资本',
component: 'Input',
componentProps: {
placeholder: '请输入注册资本',
......@@ -73,7 +73,7 @@ export const enterpriseFormSchema: FormSchema[] = [
},
{
field: 'businessRange',
label: '经营范围',
label: '经营范围',
component: 'InputTextArea',
componentProps: {
placeholder: '请输入经营范围(最多1024个字符)',
......@@ -83,14 +83,14 @@ export const enterpriseFormSchema: FormSchema[] = [
},
{
field: 'registerAddress',
label: '注册地址',
label: '注册地址',
component: 'Select',
componentProps: {},
required: true,
},
{
field: 'detailAddress',
label: '详细地址',
label: '详细地址',
component: 'Input',
componentProps: {
placeholder: '请输入详细地址(最多30个字符)',
......@@ -101,37 +101,37 @@ export const enterpriseFormSchema: FormSchema[] = [
export const applicantFormSchema: FormSchema[] = [
{
field: 'type',
label: '申办人身份',
label: '申办人身份',
defaultValue: '授权代表',
slot: 'type',
},
{
field: 'idCardFront',
label: '申办人身份证正面',
label: '申办人身份证正面',
required: true,
slot: 'idCardFront',
},
{
field: 'idCardReverse',
label: '申办人身份证反面',
label: '申办人身份证反面',
required: true,
slot: 'idCardReverse',
},
{
field: 'name',
label: '申办人姓名',
label: '申办人姓名',
required: true,
slot: 'name',
},
{
field: 'idNo',
label: '申办人身份证号码',
label: '申办人身份证号码',
required: true,
slot: 'idNo',
},
{
field: 'phone',
label: '申办人电话',
label: '申办人电话',
component: 'Input',
componentProps: {
placeholder: '请输入申办人电话',
......
......@@ -4,7 +4,7 @@
<div class="flex">
<div class="flex-1 header">
<!-- <LeftOutlined class="h-back" @click="handleBack" />-->
<ApiOutlined class="h-icon" />
<VerifiedOutlined class="h-icon" />
<div class="h-txt">
<div class="h-des">企业认证</div>
<div class="h-path">个人中心/企业认证</div>
......@@ -134,8 +134,8 @@
<template #doc="{ field, model }">
<div class="field-item flex">
<div class="label">
<div class="required" style="margin-right: 2em">企业授权文件</div>
<div>(需要加盖公章)</div>
<div class="required" style="margin-right: 1em">企业授权文件</div>
<div>(需要加盖公章)</div>
</div>
<div class="flex-1">
<UploadDragger
......@@ -160,7 +160,7 @@
<div class="field-item flex">
<div class="label">
<div class="required" style="margin-right: 2em">企业承诺函</div>
<div>(需要加盖公章)</div>
<div>(需要加盖公章)</div>
</div>
<div class="flex-1">
<UploadDragger
......@@ -213,7 +213,7 @@
Checkbox,
} from 'ant-design-vue';
import { identityOptions, typeOptions } from './ecData';
import { ApiOutlined, PlusOutlined } from '@ant-design/icons-vue';
import { VerifiedOutlined, PlusOutlined } from '@ant-design/icons-vue';
import { useRouter } from 'vue-router';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import { FormProps, useForm } from '@/components/Form';
......@@ -250,9 +250,7 @@
createMessage.warning('请阅读并勾选平台协议!');
return;
}
// await identityValidate();
// await enterpriseValidate();
// await applicantValidate();
// await Promise.all([identityValidate(), enterpriseValidate(), applicantValidate()]);
createMessage.success('提交成功!');
}
function handleSave() {
......@@ -269,6 +267,7 @@
actionColOptions: {
span: 23,
},
} as FormProps);
const [enterpriseForm, { validate: enterpriseValidate }] = useForm({
labelWidth: 150,
......
......@@ -4,7 +4,7 @@
<div class="flex">
<div class="flex-1 header">
<!-- <LeftOutlined class="h-back" @click="handleBack" />-->
<ApiOutlined class="h-icon" />
<UserOutlined class="h-icon" />
<div class="h-txt">
<div class="h-des">个人信息</div>
<div class="h-path">个人中心/个人信息</div>
......@@ -12,6 +12,126 @@
</div>
</div>
</template>
<div class="flex" style="gap: 20px">
<div class="w-3/4 main-left">
<div class="pe-body main-header">
<div class="t-left">
<div class="t-des"> 企业实名认证 </div>
<div class="t-icon">未认证</div>
</div>
<div>
<a-button type="link" @click="handleAuthentic"> 立刻认证 </a-button>
</div>
</div>
<div class="pe-body">
<div class="title"> 企业信息 </div>
<Divider style="margin: 0" />
<div class="enterprise-form">
<Row :gutter="[16, 30]">
<Col :span="8" v-for="info in enterpriseList" :key="info">
<div class="col-item">
<div class="item-label">{{ info.label }}:</div>
<div class="item-des">{{
enterprise[info.field] ? enterprise[info.field] : '-'
}}</div>
</div>
</Col>
</Row>
</div>
</div>
<div class="pe-body">
<div class="title"> 申办人信息 </div>
<Divider style="margin: 0" />
<div class="enterprise-form">
<Row :gutter="[16, 30]">
<Col :span="8" v-for="info in applicantList" :key="info">
<div class="col-item">
<div class="item-label">{{ info.label }}:</div>
<div class="item-des">{{
applicant[info.field] ? applicant[info.field] : '-'
}}</div>
</div>
</Col>
</Row>
</div>
</div>
</div>
<div class="w-1/4 main-right">
<div class="pe-body user-info">
<div class="user-hd">
<img class="img" src="/src/assets/images/userImg.png" alt="" />
<div class="hd-right">
<div class="user-name"> admin </div>
<div class="user-welcome"> 欢迎登录数据要数建设与应用服务平台 </div>
</div>
</div>
<div>
<Alert message="您尚未进行企业认证" type="warning" show-icon>
<template #action>
<a-button size="small" type="link" @click="handleAuthentic">
立即认证
<RightOutlined />
</a-button>
</template>
</Alert>
</div>
<div class="field-item">
<div class="label"> 登录ID </div>
<div class="value"> 1883668527055888802 </div>
</div>
<div class="field-item">
<div class="label"> 注册时间 </div>
<div class="value"> 2023-08-13 15:22:28 </div>
</div>
<Divider style="margin: 0" />
<div class="flex" style="gap: 10px">
<div class="flex">
<div class="tab">
<CheckCircleFilled class="icon" />
<div class="des"> 数据买家 </div>
</div>
</div>
<div class="flex">
<div class="tab">
<CheckCircleFilled class="icon" />
<div class="des"> 数据卖家 </div>
</div>
</div>
</div>
</div>
<div class="pe-body platform">
<div class="title"> 平台对接 </div>
<Divider style="margin: 0" />
<div class="p-card">
<div class="field-item">
<div class="label"> PublicKey </div>
<div class="value"> 暂无 </div>
</div>
<div class="field-item">
<div class="label"> SecretKey </div>
<div class="value"> 暂无 </div>
</div>
</div>
</div>
<div class="pe-body platform">
<div class="title"> 账号安全 </div>
<Divider style="margin: 0" />
<div class="p-card">
<div class="field-item">
<div class="label"> 登录密码 </div>
<div class="value flex">
<div>已设置</div>
<a style="margin-left: 15px">修改</a>
</div>
</div>
<div class="field-item">
<div class="label"> 手机号 </div>
<div class="value"> 166****3686 </div>
</div>
</div>
</div>
</div>
</div>
</PageWrapper>
</template>
......@@ -24,8 +144,17 @@
Input,
RadioGroup,
Checkbox,
Row,
Col,
Alert,
} from 'ant-design-vue';
import { ApiOutlined, PlusOutlined } from '@ant-design/icons-vue';
import {
ApiOutlined,
PlusOutlined,
UserOutlined,
RightOutlined,
CheckCircleFilled,
} from '@ant-design/icons-vue';
import { useRouter } from 'vue-router';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import { FormProps, useForm } from '@/components/Form';
......@@ -36,6 +165,21 @@
} from '@/views/personalCenter/enterpriseCertification/ec.data';
import { ref } from 'vue';
import { useMessage } from '@/hooks/web/useMessage';
import { enterpriseList, applicantList } from './personalData';
// 初始化
const router = useRouter();
// 数据
const enterprise = ref({});
const applicant = ref({});
/**
* 方法
*/
function handleAuthentic() {
router.push({
path: '/personalCenter/enterpriseCertification',
});
}
</script>
<style scoped>
......@@ -62,4 +206,103 @@
}
}
}
.pe-body {
background-color: #ffffff;
}
.title {
font-size: 16px;
padding: 20px 30px;
}
.main-left {
display: flex;
flex-direction: column;
gap: 15px;
.main-header {
padding: 10px 30px;
display: flex;
.t-left {
flex: 1;
display: flex;
gap: 10px;
.t-des {
font-size: 18px;
line-height: 32px;
}
.t-icon {
height: 20px;
line-height: 16px;
padding: 2px 8px;
margin-top: 6px;
color: #ffffff;
background-color: #ee3533;
}
}
}
.enterprise-form {
padding: 30px 0 0 3%;
margin-bottom: 30px;
.col-item {
display: flex;
.item-label {
width: 150px;
}
}
}
}
.main-right {
display: flex;
flex-direction: column;
gap: 15px;
.user-info {
padding: 10px 20px;
display: flex;
flex-direction: column;
gap: 20px;
.user-hd {
display: flex;
gap: 10px;
.img {
width: 80px;
height: 80px;
}
.hd-right {
display: flex;
flex-direction: column;
gap: 10px;
justify-content: center;
.user-name {
font-size: 22px;
font-weight: bolder;
}
.user-welcome {
font-size: 16px;
}
}
}
.tab {
border: 1px solid #2ac01d;
padding: 6px 10px;
color: #2ac01d;
display: flex;
gap: 6px;
}
}
.platform {
.p-card {
padding: 20px;
display: flex;
flex-direction: column;
gap: 15px;
}
}
.field-item {
display: flex;
}
.label {
color: #888888;
flex: 1;
}
.value {
}
}
</style>
export const enterpriseList = [
{
label: '企业名称',
field: 'companyName',
},
{
label: '统一社会信用代码',
field: 'code',
},
{
label: '法人',
field: 'leader',
},
{
label: '法人身份证号码',
field: 'leaderNum',
},
{
label: '成立日期',
field: 'buildTime',
},
{
label: '注册资本',
field: 'registerNum',
},
{
label: '经营范围',
field: 'businessRange',
},
{
label: '注册地址',
field: 'registerAddress',
},
{
label: '详细地址',
field: 'detailAddress',
},
{
label: '营业执照',
field: 'license',
},
{
label: '公司LOGO',
field: 'logo',
},
];
export const applicantList = [
{
label: '申办人姓名',
field: 'name',
},
{
label: '申办人电话',
field: 'phone',
},
{
label: '申办人身份证号码',
field: 'idNo',
},
{
label: '身份证正面',
field: 'idCardFront',
},
{
label: '身份证反面',
field: 'idCardReverse',
},
{
label: '企业承诺函',
field: 'letter',
},
{
label: '企业授权文件',
field: 'doc',
},
];
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment