效果图:
HTML部分代码:
<cube-form-group style="background: #FFFFFF;">
<cube-form-item :field="fields[0]"></cube-form-item>
<cube-form-item :field="fields[1]"></cube-form-item>
<cube-form-item :field="fields[2]" class="cube-form-none-border">
<div class="upload-box">
<p>上传营业执照照片</p>
<cube-upload
ref="businessLicenseUrl"
v-model="model.businessLicenseUrl"
:action="action + '?type=3&code=企业统一社会信用代码'"
@files-added="addedHandler('businessLicenseUrl')"
@file-error="errHandler"
>
<div class="clear-fix">
<cube-upload-file
v-for="(file, i) in model.businessLicenseUrl"
:file="file"
:key="i"
></cube-upload-file>
<cube-upload-btn :multiple="false">
<div>
<i></i>
<p>上传营业执照照片</p>
</div>
</cube-upload-btn>
</div>
</cube-upload>
</div>
</cube-form-item>
<div class="form-cap"></div>
<cube-form-item :field="fields[3]"></cube-form-item>
<cube-form-item :field="fields[4]"></cube-form-item>
<div class="upload-double">
<cube-form-item :field="fields[5]">
<div class="upload-box">
<p>上传法人身份证</p>
<cube-upload
ref="legalPersonIdCardFrontUrl"
v-model="model.legalPersonIdCardFrontUrl"
:action="action + '?type=1&code=企业统一社会信用代码'"
@files-added="addedHandler('legalPersonIdCardFrontUrl')"
@file-error="errHandler"
>
<div class="clear-fix">
<cube-upload-file
v-for="(file, i) in model.legalPersonIdCardFrontUrl"
:file="file"
:key="i"
></cube-upload-file>
<cube-upload-btn :multiple="false">
<div>
<i></i>
<p>上传法人身份证正面照片</p>
</div>
</cube-upload-btn>
</div>
</cube-upload>
</div>
</cube-form-item>
<cube-form-item :field="fields[6]">
<cube-upload
ref="legalPersonIdCardBackUrl"
v-model="model.legalPersonIdCardBackUrl"
:action="action + '?type=2&code=企业统一社会信用代码'"
@files-added="addedHandler('legalPersonIdCardBackUrl')"
@file-error="errHandler"
>
<div class="clear-fix">
<cube-upload-file
v-for="(file, i) in model.legalPersonIdCardBackUrl"
:file="file"
:key="i"
></cube-upload-file>
<cube-upload-btn :multiple="false">
<div>
<i></i>
<p>上传法人身份证反面照片</p>
</div>
</cube-upload-btn>
</div>
</cube-upload>
</cube-form-item>
</div>
<div class="form-cap"></div>
<cube-form-item :field="fields[7]"></cube-form-item>
<cube-form-item :field="fields[8]"></cube-form-item>
<cube-form-item :field="fields[9]"></cube-form-item>
<cube-form-item :field="fields[10]"></cube-form-item>
<cube-form-item :field="fields[11]" class="cube-form-none-border">
<cube-upload
ref="controlPersonIdCardFrontUrl"
v-model="model.controlPersonIdCardFrontUrl"
:action="action + '?type=4&code=