压缩包上传回显

This commit is contained in:
hanchaobo
2024-03-05 09:15:47 +08:00
parent bcd9f7cbb2
commit a61a1388f7
2 changed files with 203 additions and 177 deletions
+201 -175
View File
@@ -7,34 +7,43 @@
<el-tab-pane label="证据清单" name="second" v-if="tabFlag"> <el-tab-pane label="证据清单" name="second" v-if="tabFlag">
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
<el-form v-if="activeName == 'first'" :disabled="caseDisabled" :model="formData" ref="ruleForm" label-width="130px" <el-form v-if="activeName == 'first'" :disabled="caseDisabled" :model="formData" ref="ruleForm"
class="demo-ruleForm"> label-width="130px" class="demo-ruleForm">
<el-row> <el-row>
<div style="display: inline-flex"> <div style="display: inline-flex">
<div class="infoIcon"></div> <div class="infoIcon"></div>
<div class="caseInfo">案件信息:</div> <div class="caseInfo">案件信息:</div>
</div> </div>
<el-divider></el-divider> <el-divider></el-divider>
<el-col :span="24">
<el-form-item label="压缩包导入">
<el-upload class="upload-demo" :action="zipUrl()" :before-remove="beforeRemoveZip" multiple accept='.zip' :limit="1"
:on-exceed="handleExceedZip" :on-success='successZip' :file-list="fileListZip">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传zip压缩包</div>
</el-upload>
</el-form-item>
</el-col>
<el-col :span="24"> <el-col :span="24">
<el-form-item label="申请人调解请求" prop="arbitratClaims" :rules="[ <el-form-item label="申请人调解请求" prop="arbitratClaims" :rules="[
{ {
required: true, required: true,
message: '申请人调解请求不能为空', message: '申请人调解请求不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.arbitratClaims" placeholder="请输入申请人调解诉求" type="textarea" <el-input v-model="formData.arbitratClaims" placeholder="请输入申请人调解诉求" type="textarea"
:autosize="{ minRows: 4, maxRows: 8 }" /> :autosize="{ minRows: 4, maxRows: 8 }" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24"> <el-col :span="24">
<el-form-item label="事实和理由" prop="facts" :rules="[ <el-form-item label="事实和理由" prop="facts" :rules="[
{ {
required: true, required: true,
message: '事实和理由不能为空', message: '事实和理由不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.facts" placeholder="请输入事实和理由" type="textarea" <el-input v-model="formData.facts" placeholder="请输入事实和理由" type="textarea"
:autosize="{ minRows: 4, maxRows: 8 }" /> :autosize="{ minRows: 4, maxRows: 8 }" />
</el-form-item> </el-form-item>
@@ -132,84 +141,84 @@
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 1"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 1">
<el-form-item label="申请机构名称" prop="affiliate.applicationName" :rules="[ <el-form-item label="申请机构名称" prop="affiliate.applicationName" :rules="[
{ {
required: true, required: true,
message: '申请机构名称不能为空', message: '申请机构名称不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.applicationName" placeholder="请输入申请机构名称" /> <el-input v-model="formData.affiliate.applicationName" placeholder="请输入申请机构名称" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 0"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 0">
<el-form-item label="申请人" prop="affiliate.applicationName" :rules="[ <el-form-item label="申请人" prop="affiliate.applicationName" :rules="[
{ {
required: true, required: true,
message: '申请人名称不能为空', message: '申请人名称不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.applicationName" disabled placeholder="请输入申请人姓名" /> <el-input v-model="formData.affiliate.applicationName" disabled placeholder="请输入申请人姓名" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 1"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 1">
<el-form-item label="统一社会信用代码" prop="affiliate.code" :rules="[ <el-form-item label="统一社会信用代码" prop="affiliate.code" :rules="[
{ {
required: true, required: true,
message: '统一社会信用代码不能为空', message: '统一社会信用代码不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.code" placeholder="请输入统一社会信用代码" /> <el-input v-model="formData.affiliate.code" placeholder="请输入统一社会信用代码" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 0"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 0">
<el-form-item label="申请人身份证号码" prop="affiliate.code" :rules="[ <el-form-item label="申请人身份证号码" prop="affiliate.code" :rules="[
{ {
required: true, required: true,
message: '申请人身份证号不能为空', message: '申请人身份证号不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: pattern:
/^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/, /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,
message: '请输入正确的身份证号码', message: '请输入正确的身份证号码',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.code" disabled placeholder="请输入申请人的身份证号" /> <el-input v-model="formData.affiliate.code" disabled placeholder="请输入申请人的身份证号" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 0"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 0">
<el-form-item label="申请人邮箱" prop="affiliate.applicationEmail" :rules="[ <el-form-item label="申请人邮箱" prop="affiliate.applicationEmail" :rules="[
{ {
required: true, required: true,
message: '申请人邮箱不能为空', message: '申请人邮箱不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: pattern:
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/, /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/,
message: '请输入正确的邮箱地址', message: '请输入正确的邮箱地址',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.applicationEmail" disabled placeholder="请输入申请人邮箱" /> <el-input v-model="formData.affiliate.applicationEmail" disabled placeholder="请输入申请人邮箱" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 0"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 0">
<el-form-item label="申请人电话" prop="affiliate.applicationPhone" :rules="[ <el-form-item label="申请人电话" prop="affiliate.applicationPhone" :rules="[
{ {
required: true, required: true,
message: '申请人联系电话不能为空', message: '申请人联系电话不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/, pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/,
message: '请输入正确的手机号码', message: '请输入正确的手机号码',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.applicationPhone" disabled placeholder="请输入申请人联系电话" /> <el-input v-model="formData.affiliate.applicationPhone" disabled placeholder="请输入申请人联系电话" />
</el-form-item> </el-form-item>
</el-col> </el-col>
@@ -231,50 +240,50 @@
</el-col> --> </el-col> -->
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 1"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 1">
<el-form-item label="法定代表人" prop="affiliate.compLegalPerson" :rules="[ <el-form-item label="法定代表人" prop="affiliate.compLegalPerson" :rules="[
{ {
required: true, required: true,
message: '法定代表人不能为空', message: '法定代表人不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.compLegalPerson" placeholder="请输入法定代表人" /> <el-input v-model="formData.affiliate.compLegalPerson" placeholder="请输入法定代表人" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="申请人住所" prop="affiliate.applicantHome" :rules="[ <el-form-item label="申请人住所" prop="affiliate.applicantHome" :rules="[
{ {
required: true, required: true,
message: '申请人住所不能为空', message: '申请人住所不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.applicantHome" placeholder="请输入申请人住所" /> <el-input v-model="formData.affiliate.applicantHome" placeholder="请输入申请人住所" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="申请人联系地址" prop="affiliate.applicantAddress" :rules="[ <el-form-item label="申请人联系地址" prop="affiliate.applicantAddress" :rules="[
{ {
required: true, required: true,
message: '申请人联系地址不能为空', message: '申请人联系地址不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.applicantAddress" placeholder="请输入申请人联系地址" /> <el-input v-model="formData.affiliate.applicantAddress" placeholder="请输入申请人联系地址" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 1"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 1">
<el-form-item label="代理人联系电话" prop="affiliate.contactTelphoneAgent" :rules="[ <el-form-item label="代理人联系电话" prop="affiliate.contactTelphoneAgent" :rules="[
{ {
required: true, required: true,
message: '代理人联系电话不能为空', message: '代理人联系电话不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/, pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/,
message: '请输入正确的手机号码', message: '请输入正确的手机号码',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.contactTelphoneAgent" disabled placeholder="请输入代理人联系电话" /> <el-input v-model="formData.affiliate.contactTelphoneAgent" disabled placeholder="请输入代理人联系电话" />
</el-form-item> </el-form-item>
</el-col> </el-col>
@@ -285,12 +294,12 @@
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 1"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 1">
<el-form-item label="代理人姓名" prop="affiliate.nameAgent" :rules="[ <el-form-item label="代理人姓名" prop="affiliate.nameAgent" :rules="[
{ {
required: true, required: true,
message: '代理人姓名不能为空', message: '代理人姓名不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.nameAgent" disabled placeholder="请输入代理人姓名" /> <el-input v-model="formData.affiliate.nameAgent" disabled placeholder="请输入代理人姓名" />
</el-form-item> </el-form-item>
</el-col> </el-col>
@@ -301,84 +310,85 @@
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 1"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 1">
<el-form-item label="代理人邮箱" prop="affiliate.agentEmail" :rules="[ <el-form-item label="代理人邮箱" prop="affiliate.agentEmail" :rules="[
{ {
required: true, required: true,
message: '代理人邮箱不能为空', message: '代理人邮箱不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: pattern:
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/, /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/,
message: '请输入正确的邮箱地址', message: '请输入正确的邮箱地址',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.agentEmail" disabled placeholder="请输入代理人邮箱" /> <el-input v-model="formData.affiliate.agentEmail" disabled placeholder="请输入代理人邮箱" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="formData.affiliate.organizeFlag == 0"> <el-col :span="12" v-if="formData.affiliate.organizeFlag == 0">
<el-form-item label="代理人邮箱" prop="affiliate.agentEmail" :rules="[ <el-form-item label="代理人邮箱" prop="affiliate.agentEmail" :rules="[
{ {
pattern: pattern:
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/, /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/,
message: '请输入正确的邮箱地址', message: '请输入正确的邮箱地址',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.agentEmail" placeholder="请输入代理人邮箱" /> <el-input v-model="formData.affiliate.agentEmail" placeholder="请输入代理人邮箱" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="被申请人姓名" prop="affiliate.respondentName" :rules="[ <el-form-item label="被申请人姓名" prop="affiliate.respondentName" :rules="[
{ {
required: true, required: true,
message: '被申请人姓名不能为空', message: '被申请人姓名不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.respondentName" placeholder="请输入被申请人姓名" /> <el-input v-model="formData.affiliate.respondentName" placeholder="请输入被申请人姓名" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="被申请人联系电话" prop="affiliate.respondentPhone" :rules="[ <el-form-item label="被申请人联系电话" prop="affiliate.respondentPhone" :rules="[
{ {
required: true, required: true,
message: '被申请人联系电话不能为空', message: '被申请人联系电话不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/, pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/,
message: '请输入正确的手机号码', message: '请输入正确的手机号码',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.respondentPhone" placeholder="请输入被申请人联系电话" /> <el-input v-model="formData.affiliate.respondentPhone" placeholder="请输入被申请人联系电话" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="被申请人身份证号" prop="affiliate.respondentIdentityNum" :rules="[ <el-form-item label="被申请人身份证号" prop="affiliate.respondentIdentityNum" :rules="[
{ {
required: true, required: true,
message: '被申请人身份证号不能为空', message: '被申请人身份证号不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: pattern:
/^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/, /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,
message: '请输入正确的身份证号码', message: '请输入正确的身份证号码',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.respondentIdentityNum" @blur="handleBlur" placeholder="请输入被申请人身份证号" /> <el-input v-model="formData.affiliate.respondentIdentityNum" @blur="handleBlur"
placeholder="请输入被申请人身份证号" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="被申请人性别:" prop="affiliate.respondentSex" :rules="[ <el-form-item label="被申请人性别:" prop="affiliate.respondentSex" :rules="[
{ {
required: true, required: true,
message: '请选择性别', message: '请选择性别',
}, },
]"> ]">
<el-radio-group v-model="formData.affiliate.respondentSex" disabled> <el-radio-group v-model="formData.affiliate.respondentSex" disabled>
<el-radio :label="0">男</el-radio> <el-radio :label="0">男</el-radio>
<el-radio :label="1">女</el-radio> <el-radio :label="1">女</el-radio>
@@ -393,29 +403,29 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="被申请人申请人住所" prop="affiliate.respondentHome" :rules="[ <el-form-item label="被申请人申请人住所" prop="affiliate.respondentHome" :rules="[
{ {
required: true, required: true,
message: '被申请人申请人住所不能为空', message: '被申请人申请人住所不能为空',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.respondentHome" placeholder="请输入被申请人申请人住所" /> <el-input v-model="formData.affiliate.respondentHome" placeholder="请输入被申请人申请人住所" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="被申请人邮箱" prop="affiliate.respondentEmail" :rules="[ <el-form-item label="被申请人邮箱" prop="affiliate.respondentEmail" :rules="[
{ {
required: true, required: true,
message: '代理人邮箱不能为空', message: '代理人邮箱不能为空',
trigger: 'blur', trigger: 'blur',
}, },
{ {
pattern: pattern:
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/, /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/,
message: '请输入正确的邮箱地址', message: '请输入正确的邮箱地址',
trigger: 'blur', trigger: 'blur',
}, },
]"> ]">
<el-input v-model="formData.affiliate.respondentEmail" placeholder="请输入被申请人邮箱" /> <el-input v-model="formData.affiliate.respondentEmail" placeholder="请输入被申请人邮箱" />
</el-form-item> </el-form-item>
</el-col> </el-col>
@@ -453,6 +463,7 @@
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { import {
caseApplicationInsert, caseApplicationInsert,
@@ -490,6 +501,7 @@ export default {
modelFlag: false, modelFlag: false,
fileURL: window.location.origin + "/API", fileURL: window.location.origin + "/API",
fileList: [], fileList: [],
fileListZip:[],
filedata: { filedata: {
annexType: 2, annexType: 2,
}, },
@@ -612,6 +624,9 @@ export default {
UploadUrl() { UploadUrl() {
return window.location.origin + "/API/common/upload"; return window.location.origin + "/API/common/upload";
}, },
zipUrl() {
return window.location.origin + "/API/caseApplication/userIdentify";
},
/**文件上传成功*/ /**文件上传成功*/
handlSuccess(res, file) { handlSuccess(res, file) {
this.formData.caseAttachList.push({ this.formData.caseAttachList.push({
@@ -634,6 +649,17 @@ export default {
(item) => item.annexId != file.annexId (item) => item.annexId != file.annexId
); );
}, },
handleExceedZip(files, fileList) {
this.$message.warning(`当前限制选择 1 个文件`);
},
beforeRemoveZip(file, fileList) {
return this.$confirm(`确定移除 ${file.name}?`);
},
successZip(res){
this.formData = res.data;
this.$set(this.formData.affiliate,'organizeFlag',0);
this.$set(this.formData.affiliate,'respondentSex',Number(res.data.affiliate.respondentSex));
},
handlePreview(file) { handlePreview(file) {
window.open( window.open(
window.location.origin + "/API" + file.certificatePath, window.location.origin + "/API" + file.certificatePath,
@@ -692,7 +718,7 @@ export default {
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.infoIcon { .infoIcon {
width: 4px; width: 4px;
+2 -2
View File
@@ -12,10 +12,10 @@ const name = process.env.VUE_APP_TITLE || '调解系统' // 网页标题
const port = process.env.port || process.env.npm_config_port || 80 // 端口 const port = process.env.port || process.env.npm_config_port || 80 // 端口
// const API = 'http://121.40.189.20:9001' //生产 // const API = 'http://121.40.189.20:9001' //生产
const API = 'http://121.40.189.20:6001' //测试 // const API = 'http://121.40.189.20:6001' //测试
// const API = 'http://192.168.3.18:6001' //B // const API = 'http://192.168.3.18:6001' //B
// const API = 'http://172.16.0.237:6001' //Q // const API = 'http://172.16.0.237:6001' //Q
// const API = 'http://172.16.1.43:6001' //w const API = 'http://172.16.1.26:6001' //w
// vue.config.js 配置说明 // vue.config.js 配置说明
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions