xnzt/xnzt-h5/pages/formPages/enterprise/legalInfoForm/index.vue

374 lines
9.9 KiB
Vue
Raw Normal View History

2024-11-11 10:27:27 +08:00
<template>
<!-- <div class="legalInfoForm">legalInfoForm</div> -->
<view class="legalInfoForm">
<view>
<uni-forms
ref="form"
:model="form"
:rules="rules"
class="form"
label-position="top"
label-width="100%"
validate-trigger="bind"
>
<uni-forms-item label="法人姓名" name="legalName">
<uni-easyinput
v-model="form.legalName"
placeholder="请输入法人姓名"
/>
</uni-forms-item>
<uni-forms-item class="flex-radio" label="性别">
<uni-radio-group v-model="form.sex">
<uni-data-checkbox
v-model="form.sex"
:localdata="dictLists['sys_user_sex']"
/>
</uni-radio-group>
</uni-forms-item>
<uni-forms-item label="身份证号" name="identityno">
<uni-easyinput
v-model="form.identityno"
placeholder="请输入身份证号"
/>
</uni-forms-item>
<uni-forms-item label="法人电话" name="legalTel">
<uni-easyinput v-model="form.legalTel" placeholder="请输入法人电话" />
</uni-forms-item>
<uni-forms-item label="邮政编码" name="postCode">
<uni-easyinput v-model="form.postCode" placeholder="请输入邮政编码" />
</uni-forms-item>
<uni-forms-item label="邮箱" name="email">
<uni-easyinput v-model="form.email" placeholder="请输入邮箱" />
</uni-forms-item>
<uni-forms-item label="住所" name="address">
<uni-easyinput v-model="form.address" placeholder="请输入住所" />
</uni-forms-item>
<uni-forms-item label="政治面貌" name="political">
<uni-data-select
v-model="form.political"
:localdata="dictLists['sys_political_type']"
width="100%"
placeholder="请选择主体类型"
/>
</uni-forms-item>
<uni-forms-item label="社会职务" name="work">
<uni-data-select
v-model="form.work"
:localdata="dictLists['sys_social_position']"
width="100%"
placeholder="请选择主体类型"
/>
</uni-forms-item>
<uni-forms-item label="联系人" name="contacts">
<uni-easyinput v-model="form.contacts" placeholder="请输入联系人" />
</uni-forms-item>
<uni-forms-item label="联系电话" name="contactTel">
<uni-easyinput
v-model="form.contactTel"
placeholder="请输入联系电话"
/>
</uni-forms-item>
<uni-forms-item label="企业官网" name="website">
<uni-easyinput v-model="form.website" placeholder="请输入企业官网" />
</uni-forms-item>
</uni-forms>
<view style="height: 44px">
<button v-if="false">
<text>{{ "测 试" }}</text>
</button>
</view>
</view>
<view v-if="true" class="foot">
<button @click="cencel" :plain="false" class="cencel">
<text>{{ "取 消" }}</text>
</button>
<button @click="showConfirm" type="primary" class="confirm">
<text>{{ "确 认" }}</text>
</button>
</view>
</view>
</template>
<script>
import {
addLegalInfo,
updateLegalInfo,
selectLegalInfo,
} from "@/api/enterprise/legalInfo";
export default {
name: "legalInfoForm",
components: {},
props: {},
data() {
const verificationSj = (rule, value, data, callback) => {
return new Promise((resolve, reject) => {
var reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
if (!reg.test(value)) {
reject(new Error("手机号格式错误"));
} else {
resolve();
}
});
};
const verificationSfz = (rule, value, data, callback) => {
return new Promise((resolve, reject) => {
var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if (!reg.test(value)) {
reject(new Error("请输入正确的身份证号码"));
} else {
resolve();
}
});
};
const verificationYx = (rule, value, data, callback) => {
return new Promise((resolve, reject) => {
var reg = /^([a-zA-Z0-9]+[-_\.]?)+@[a-zA-Z0-9]+\.[a-z]+$/;
if (!reg.test(value)) {
reject(new Error("请输入正确的身份证号码"));
} else {
resolve();
}
});
};
return {
form: {},
dictLists: {},
rules: {
identityno: {
rules: [
{
required: false,
errorMessage: "请输入身份证号",
validateFunction: (rule, value, data, callback) =>
verificationSfz(rule, value, data, callback),
},
],
},
legalTel: {
rules: [
{
required: false,
errorMessage: "请输入法人电话",
validateFunction: (rule, value, data, callback) =>
verificationSj(rule, value, data, callback),
},
],
},
email: {
rules: [
{
required: false,
errorMessage: "请输入邮箱地址",
validateFunction: (rule, value, data, callback) =>
verificationYx(rule, value, data, callback),
},
],
},
contactTel: {
rules: [
{
required: false,
errorMessage: "请输入联系电话",
validateFunction: (rule, value, data, callback) =>
verificationSj(rule, value, data, callback),
},
],
},
},
};
},
computed: {},
methods: {
getLegalInfo() {
selectLegalInfo().then((response) => {
let form = response.data;
if (!(form === undefined || form.id === null || form.id === "")) {
this.form = form;
}
this.$modal.closeLoading();
});
},
naviBack(isNew) {
let pages = getCurrentPages(); //关于获取页面的官方文档https://uniapp.dcloud.io/api/window/window
let prevPage = pages[pages.length - 2];
uni.navigateBack({
delta: 1,
success: () => {
if (isNew !== undefined) {
setTimeout(function () {
prevPage.$vm.getMsg(isNew);
}, 200);
}
},
});
},
reset() {
this.form = {
legalName: null,
sex: "0",
identityno: null,
legalTel: null,
postCode: null,
email: null,
address: null,
political: null,
work: null,
contactTel: null,
contacts: null,
website: null,
};
},
async initializeDict() {
this.dictByType("sys_user_sex");
this.dictByType("sys_political_type");
this.dictByType("sys_social_position");
},
dictByType(type) {
this.getDicts(type).then((response) => {
let dicts = [];
for (let dict of response.data) {
let element = {};
element["value"] = dict.dictValue;
element["text"] = dict.dictLabel;
element["label"] = dict.dictLabel;
dicts.push(element);
}
this.$set(this.dictLists, type, dicts);
});
},
cencel() {
this.naviBack();
},
submitForm() {
let isNew =
this.form.id === null ||
this.form.id === undefined ||
this.form.id === "";
if (isNew) {
addLegalInfo(this.form).then((response) => {
this.naviBack(isNew);
});
} else {
updateLegalInfo(this.form).then((response) => {
this.naviBack(isNew);
});
}
},
showConfirm() {
this.$refs["form"].validate().then((res) => {
this.$cus_modal.confirm().then((conf_res) => {
if (conf_res.confirm === true) {
this.submitForm();
}
});
});
},
},
watch: {},
// 页面周期函数--监听页面加载
onLoad() {
this.$modal.loading("加载中,请耐心等待...");
this.reset();
this.initializeDict();
this.getLegalInfo();
},
// 页面周期函数--监听页面初次渲染完成
onReady() {},
// 页面周期函数--监听页面显示(not-nvue)
onShow() {},
// 页面周期函数--监听页面隐藏
onHide() {},
// 页面周期函数--监听页面卸载
onUnload() {
const that = this
return that.$listenOB.goBack()
},
// 页面处理函数--监听用户下拉动作
// onPullDownRefresh() { uni.stopPullDownRefresh(); },
// 页面处理函数--监听用户上拉触底
// onReachBottom() {},
// 页面处理函数--监听页面滚动(not-nvue)
// onPageScroll(event) {},
// 页面处理函数--用户点击右上角分享
// onShareAppMessage(options) {},
};
</script>
<style lang="scss" scoped>
.legalInfoForm {
background-color: white;
height: calc(100%);
.foot {
width: 100vw;
height: 44px;
bottom: 0px;
display: flex;
position: fixed;
z-index: 2;
.cencel {
border-radius: 0px;
border: 0px;
width: 50%;
background-color: white;
}
.confirm {
border-radius: 0px;
border: 0px;
width: 50%;
color: white;
}
}
}
.form {
text-align: center;
margin: auto;
width: 80%;
/deep/ .flex-radio {
uni-radio-group {
width: 100%;
.checklist-group {
display: flex;
justify-content: space-evenly;
}
}
}
/deep/ .uni-forms-item {
.uni-forms-item__content {
.uni-file-picker {
.uni-file-picker__header {
.file-title {
span {
color: #ff0000a6;
}
}
}
}
.uni-mt-5 {
.uni-icons {
background: #007aff21;
line-height: 35px;
height: 35px;
}
}
.uni-select-cy {
z-index: 1;
.uni-select-cy-select {
z-index: -500;
}
}
}
}
}
</style>