You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
775 lines
24 KiB
775 lines
24 KiB
3 years ago
|
<template>
|
||
|
|
<view class="evan-form-show">
|
||
|
|
<view class="bottom-border">
|
||
|
|
<view class="left-border"><text class="mgl10">基本信息</text></view>
|
||
|
|
</view>
|
||
|
|
<uni-forms :value="formData" ref="form" validate-trigger="bind" err-show-type="toast">
|
||
|
|
<uni-forms-item required name="cusType" label="客户类型">
|
||
|
|
<uni-data-checkbox v-model="cusType" :localdata="cusTypeList"></uni-data-checkbox>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="code" required label="客户编号">
|
||
|
|
<uni-easyinput type="text" :inputBorder="true" v-model="enterpriseForm.code" placeholder="请输入客户编号"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="name" required label="客户名称">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.name" placeholder="客户名称"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="socialUnifiedCode" required label="社会统一代码">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.socialUnifiedCode" placeholder="社会统一代码"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="联系电话">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="联系电话"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="注册时间">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="注册时间"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="注册资金(万元)">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="注册资金"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="注册地址">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="注册地址"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="员工人数">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="员工人数"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="经营地址">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="经营地址"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="业务类别">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="业务类别"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="经营范围">
|
||
|
|
<uni-easyinput disabled type="textarea" v-model="enterpriseForm.remarks" placeholder="经营范围"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
</uni-forms>
|
||
|
|
|
||
|
|
<view class="bottom-border">
|
||
|
|
<view class="left-border"><text class="mgl10">法人信息</text></view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<uni-forms :value="enterpriseFrom" ref="form" validate-trigger="bind" err-show-type="toast">
|
||
|
|
<uni-forms-item required name="cusType" label="姓名">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.name" placeholder="姓名"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item required name="gender" label="性别">
|
||
|
|
<uni-data-checkbox disabled v-model="enterpriseFrom.gender" :localdata="genderList"></uni-data-checkbox>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="name" required label="身份证号">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.name" placeholder="身份证号"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="socialUnifiedCode" required label="联系电话">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.socialUnifiedCode" placeholder="联系电话"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="户口所在地">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="户口所在地"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="phone" required label="家庭住址">
|
||
|
|
<uni-easyinput disabled type="text" :inputBorder="true" v-model="enterpriseForm.phone" placeholder="家庭住址"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item required name="isExist" label="是否存在关联人">
|
||
|
|
<uni-data-checkbox v-model="enterpriseForm.isExist" :localdata="isExistList"></uni-data-checkbox>
|
||
|
|
</uni-forms-item>
|
||
|
|
</uni-forms>
|
||
|
|
|
||
|
|
<view class="bottom-border">
|
||
|
|
<view class="left-border"><text class="mgl10">申请贷款相关信息</text></view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<uni-forms :value="enterpriseFrom" ref="form" validate-trigger="bind" err-show-type="toast">
|
||
|
|
<uni-forms-item required name="cusType" label="申请额度(万元)">
|
||
|
|
<uni-easyinput type="text" :inputBorder="true" v-model="enterpriseForm.name" placeholder="姓名"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item required name="gender" label="申请期限">
|
||
|
|
<uni-easyinput type="text" :inputBorder="true" v-model="enterpriseForm.name" placeholder="申请期限"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="name" required label="贷款银行">
|
||
|
|
<uni-easyinput type="text" :inputBorder="true" v-model="enterpriseForm.name" placeholder="贷款银行"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="name" required label="贷款用途">
|
||
|
|
<uni-easyinput type="text" :inputBorder="true" v-model="enterpriseForm.name" placeholder="贷款用途"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
<!-- <uni-forms-item name="enGuaranteeMeasures" required label="反担保措施">
|
||
|
|
<uni-data-checkbox disabled v-model="enterpriseFrom.enGuaranteeMeasures" :localdata="easuresList"></uni-data-checkbox>
|
||
|
|
</uni-forms-item> -->
|
||
|
|
<uni-forms-item name="enGuaranteeMeasures" required label="反担保措施">
|
||
|
|
<uni-picker v-model="enterpriseFrom.enGuaranteeMeasures" :pickData="easuresList"></uni-picker>
|
||
|
|
</uni-forms-item>
|
||
|
|
<uni-forms-item name="name" required label="反担保措施描述">
|
||
|
|
<uni-easyinput type="textarea" v-model="enterpriseForm.remarks" placeholder="请输入反担保措施描述"></uni-easyinput>
|
||
|
|
</uni-forms-item>
|
||
|
|
</uni-forms>
|
||
|
|
|
||
|
|
<view class="bottom-border">
|
||
|
|
<view class="left-border"><text class="mgl10">附件</text></view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传营业执照</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传法定代表人夫妻及企业实际经营者身份证附件</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传法定代表人夫妻户口本、结婚证（离婚证）</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传法定代表人身份证证明</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传公司章程</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传由会计师事务所审计的上一年度及本年度审计报告</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传企业信用报告</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传企业法人夫妇信用报告、实际经营者信用报告</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传征信业务授权书、承诺书</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传增值税纳税报表首表/完税证明</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传股东会会议纪要</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="cu-bar bg-white">
|
||
|
|
<view class="action">
|
||
|
|
<text class="is-required">*</text>
|
||
|
|
<text class="label-color">上传反担保资料和评估报告</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="cu-form-group">
|
||
|
|
<view class="grid col-4 grid-square flex-sub">
|
||
|
|
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
|
||
|
|
<image :src="imgList[index]" mode="aspectFill"></image>
|
||
|
|
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
|
||
|
|
<text class='cuIcon-close'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
|
||
|
|
<text class='cuIcon-cameraadd'></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="foot-btn btn-rig pad-bt">
|
||
|
|
<button plain class="mini-btn round plain-btn" type="primary" size="mini" @click="goto('/pages/application/application')">返回</button>
|
||
|
|
<button class="mini-btn round def-btn mar-lr" type="primary" size="mini" @click="goto('/pages/application/application')">保存</button>
|
||
|
|
<button class="mini-btn round suc-btn" type="primary" size="mini" @click="goto('/pages/application/application')">提交</button>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<timeline></timeline>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import utils from '@/components/evan-form/utils.js'
|
||
|
|
const CONTACT_INFO={
|
||
|
|
name:'',
|
||
|
|
phone:'',
|
||
|
|
duty:''
|
||
|
|
}
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
cusTypeList: [{
|
||
|
|
text: '个人',
|
||
|
|
value: '0'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: '企业',
|
||
|
|
value: '1'
|
||
|
|
}],//客户类型列表
|
||
|
|
cusType: '1',
|
||
|
|
employeeMsg: [{
|
||
|
|
name: '个人',
|
||
|
|
value: '3'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '企业',
|
||
|
|
value: '4'
|
||
|
|
}],//客户经理列表
|
||
|
|
genderList: [{
|
||
|
|
text: '男',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: '女',
|
||
|
|
value: 2
|
||
|
|
}],//性别列表
|
||
|
|
easuresList: [{
|
||
|
|
text: '第三方保证',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: '抵押',
|
||
|
|
value: 2
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: '个人无限责任连带',
|
||
|
|
value: 3
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: '质押',
|
||
|
|
value: 4
|
||
|
|
}],
|
||
|
|
imgList: [],
|
||
|
|
maritalList: ['未婚','已婚','离异','再婚'],//婚姻状况列表
|
||
|
|
educationList: ['本科','大专','高职','中专','其他'],//学历列表
|
||
|
|
isExistList: [{
|
||
|
|
text: '否',
|
||
|
|
value: 0
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: '是',
|
||
|
|
value: 1
|
||
|
|
}],//是否存在关联人列表
|
||
|
|
manager: '',
|
||
|
|
enterpriseFrom: {
|
||
|
|
maritalStatus: 0,//婚姻状况
|
||
|
|
gender: 1,//性别
|
||
|
|
education: 0, //学历
|
||
|
|
legalGender: 1, //关联人性别
|
||
|
|
isExistRelated: 0, //是否存在关联人
|
||
|
|
enGuaranteeMeasures: ''
|
||
|
|
},//个人form
|
||
|
|
enterpriseForm: {},//企业form
|
||
|
|
hideRequiredAsterisk: false,
|
||
|
|
// 表单的内容必须初始化
|
||
|
|
info: {
|
||
|
|
name: '',
|
||
|
|
email: '',
|
||
|
|
desc: '',
|
||
|
|
phone: '',
|
||
|
|
sex: '',
|
||
|
|
},
|
||
|
|
rules: {
|
||
|
|
cusType: {
|
||
|
|
required: true,
|
||
|
|
message: '请选择客户'
|
||
|
|
},
|
||
|
|
code: {
|
||
|
|
required: true,
|
||
|
|
message: '请选择客户编号'
|
||
|
|
},
|
||
|
|
manager: {
|
||
|
|
required: true,
|
||
|
|
message: '请选择客户经理'
|
||
|
|
},
|
||
|
|
name: {
|
||
|
|
required: true,
|
||
|
|
message: '请输入姓名'
|
||
|
|
},
|
||
|
|
email: [{
|
||
|
|
required: true,
|
||
|
|
message: '请输入邮箱'
|
||
|
|
}, {
|
||
|
|
type: 'email',
|
||
|
|
message: '邮箱格式不正确'
|
||
|
|
}],
|
||
|
|
desc: [{
|
||
|
|
required: true,
|
||
|
|
message: '请输入简介'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
min: 10,
|
||
|
|
max: 30,
|
||
|
|
message: '简介必须在10到30个字之间'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
phone: [{
|
||
|
|
required: true,
|
||
|
|
message: '请输入手机号'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
validator: (rule, value, callback) => {
|
||
|
|
// 注意这里如果用的是methods里的isMobilePhone将不生效
|
||
|
|
if (this.$utils.isMobilePhone(value)) {
|
||
|
|
callback()
|
||
|
|
} else {
|
||
|
|
callback(new Error('手机号格式不正确'))
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 或者这样也是可以的
|
||
|
|
// {
|
||
|
|
// validator: this.isMobile
|
||
|
|
// }
|
||
|
|
],
|
||
|
|
sex: {
|
||
|
|
required: true,
|
||
|
|
message: '请选择性别'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
info2:{
|
||
|
|
name:'',
|
||
|
|
email:'',
|
||
|
|
phone:''
|
||
|
|
},
|
||
|
|
rules2:{
|
||
|
|
name: {
|
||
|
|
required: true,
|
||
|
|
message: '请输入姓名'
|
||
|
|
},
|
||
|
|
email: [{
|
||
|
|
required: true,
|
||
|
|
message: '请输入邮箱'
|
||
|
|
}, {
|
||
|
|
type: 'email',
|
||
|
|
message: '邮箱格式不正确'
|
||
|
|
}],
|
||
|
|
phone:[{
|
||
|
|
required: true,
|
||
|
|
message: '请输入手机号'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
pattern:'^1\\d{10}$', // 注意这里由于小程序的缘故正则表达式需要通过string的方式传递并且去除两边的斜杠，中间的斜杠变成两个斜杠
|
||
|
|
message:'手机号格式不正确'
|
||
|
|
}
|
||
|
|
]
|
||
|
|
},
|
||
|
|
dynamicInfo:{
|
||
|
|
test1:'',
|
||
|
|
test2:'',
|
||
|
|
list:[{...CONTACT_INFO}]
|
||
|
|
},
|
||
|
|
dynamicRules:{
|
||
|
|
test1:[{required:true,message:'请输入rule规则字段'},{min:4,max:8,message:'必须4-8位'}]
|
||
|
|
},
|
||
|
|
showRuleParam:true,
|
||
|
|
showRequiredParam:true,
|
||
|
|
mobileRules:[{required:true,message:'请输入手机号'},{pattern:'^1\\d{10}$',message:'手机号格式不正确'}] // 注意这里由于小程序的缘故正则表达式需要通过string的方式传递并且去除两边的斜杠，中间的斜杠变成两个斜杠
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
// 这里必须放在mounted中，不然h5，支付宝小程序等会找不到this.$refs.form
|
||
|
|
this.$refs.form.setRules(this.rules)
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
//客户类型选择
|
||
|
|
cusChange(e) {
|
||
|
|
this.cusType = e.detail.value
|
||
|
|
},
|
||
|
|
//性别选择
|
||
|
|
genderChange(e) {
|
||
|
|
this.personageForm.gender = e.detail.value
|
||
|
|
},
|
||
|
|
//婚姻状况选择
|
||
|
|
maritalChange(e) {
|
||
|
|
this.personageForm.maritalStatus = e.detail.value
|
||
|
|
},
|
||
|
|
//学历选择
|
||
|
|
educationChange(e) {
|
||
|
|
this.personageForm.education = e.detail.value
|
||
|
|
},
|
||
|
|
//关联人性别选择
|
||
|
|
legalGenderChange(e) {
|
||
|
|
this.personageForm.legalGender = e.detail.value
|
||
|
|
},
|
||
|
|
isExistChange(e) {
|
||
|
|
this.personageForm.isExistRelated = e.detail.value
|
||
|
|
},
|
||
|
|
bindPickerChange: function(e) {
|
||
|
|
// this.cusType = e.target.value
|
||
|
|
},
|
||
|
|
save() {
|
||
|
|
this.$refs.form.validate((res) => {
|
||
|
|
if (res) {
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
promiseSave(){
|
||
|
|
this.$refs.form.validate().then((res)=>{
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}).catch(()=>{
|
||
|
|
})
|
||
|
|
},
|
||
|
|
async asyncSave(){
|
||
|
|
try{
|
||
|
|
const result=await this.$refs.form.validate()
|
||
|
|
if(result){
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
} catch(e){
|
||
|
|
console.log(e)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
saveForm2(){
|
||
|
|
this.$refs.form2.validate((res) => {
|
||
|
|
if (res) {
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
utilsSave() {
|
||
|
|
utils.validate(this.info, this.rules, (res, errors) => {
|
||
|
|
if (res) {
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
validateSingle() {
|
||
|
|
this.$refs.form.validateField('email', (res) => {
|
||
|
|
if (res) {
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
validateMultiple() {
|
||
|
|
this.$refs.form.validateField(['email', 'phone'], (res) => {
|
||
|
|
if (res) {
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
isMobilePhone() {
|
||
|
|
const reg = /^1\d{10}$/
|
||
|
|
if (reg.test(value)) {
|
||
|
|
return true
|
||
|
|
}
|
||
|
|
return false
|
||
|
|
},
|
||
|
|
isMobile(rule, value, callback) {
|
||
|
|
if (this.$utils.isMobilePhone(value)) {
|
||
|
|
callback()
|
||
|
|
} else {
|
||
|
|
callback(new Error('手机号格式不正确'))
|
||
|
|
}
|
||
|
|
},
|
||
|
|
sexChange(e) {
|
||
|
|
this.info.sex = e.detail.value
|
||
|
|
},
|
||
|
|
addContact(){
|
||
|
|
this.dynamicInfo.list.push({...CONTACT_INFO})
|
||
|
|
},
|
||
|
|
deleteContact(index){
|
||
|
|
this.dynamicInfo.list.splice(index,1)
|
||
|
|
},
|
||
|
|
toggleRuleParam(){
|
||
|
|
this.showRuleParam=!this.showRuleParam
|
||
|
|
},
|
||
|
|
toggleRequiredParam(){
|
||
|
|
this.showRequiredParam=!this.showRequiredParam
|
||
|
|
},
|
||
|
|
dynamicSave(){
|
||
|
|
this.$refs.dynamicForm.validate((res)=>{
|
||
|
|
if(res){
|
||
|
|
uni.showToast({
|
||
|
|
title: '验证通过'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
ViewImage(e) {
|
||
|
|
uni.previewImage({
|
||
|
|
urls: this.imgList,
|
||
|
|
current: e.currentTarget.dataset.url
|
||
|
|
});
|
||
|
|
},
|
||
|
|
DelImg(e) {
|
||
|
|
uni.showModal({
|
||
|
|
title: '提示',
|
||
|
|
content: '确定要删除该文件吗？',
|
||
|
|
cancelText: '取消',
|
||
|
|
confirmText: '确定',
|
||
|
|
success: res => {
|
||
|
|
if (res.confirm) {
|
||
|
|
this.imgList.splice(e.currentTarget.dataset.index, 1)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
ChooseImage() {
|
||
|
|
uni.chooseImage({
|
||
|
|
count: 4, //默认9
|
||
|
|
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
||
|
|
sourceType: ['album'], //从相册选择
|
||
|
|
success: (res) => {
|
||
|
|
if (this.imgList.length != 0) {
|
||
|
|
this.imgList = this.imgList.concat(res.tempFilePaths)
|
||
|
|
} else {
|
||
|
|
this.imgList = res.tempFilePaths
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.evan-form-show {
|
||
|
|
padding: 0 30rpx;
|
||
|
|
background-color: #fff;
|
||
|
|
|
||
|
|
.form-input {
|
||
|
|
font-size: 28rpx;
|
||
|
|
color: #333;
|
||
|
|
text-align: right;
|
||
|
|
width: 100%;
|
||
|
|
box-sizing: border-box;
|
||
|
|
height: 60rpx;
|
||
|
|
&.textarea{
|
||
|
|
height: 240rpx;
|
||
|
|
padding: 24rpx 0;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.form-input-placeholder {
|
||
|
|
font-size: 28rpx;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
|
||
|
|
&__button {
|
||
|
|
width: 100%;
|
||
|
|
height: 88rpx;
|
||
|
|
border-radius: 8rpx;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
padding: 0;
|
||
|
|
font-size: 36rpx;
|
||
|
|
color: #fff;
|
||
|
|
margin-top: 20rpx;
|
||
|
|
background-color: #2D87D5;
|
||
|
|
|
||
|
|
&::before,
|
||
|
|
&::after {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.customize-form-item {
|
||
|
|
&__label {
|
||
|
|
font-size: 28rpx;
|
||
|
|
color: #333;
|
||
|
|
margin-bottom: 16rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
&__radio {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
margin-bottom: 16rpx;
|
||
|
|
|
||
|
|
&__text {
|
||
|
|
font-size: 28rpx;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.label-color{
|
||
|
|
color: #00B9FF;
|
||
|
|
}
|
||
|
|
// 必填
|
||
|
|
.is-required {
|
||
|
|
color: $uni-color-error;
|
||
|
|
}
|
||
|
|
</style>
|