归档详情页面开发及接口联调

This commit is contained in:
Your Name
2023-10-11 20:20:30 +08:00
parent 620f3411e7
commit 9891cbd6e8
6 changed files with 470 additions and 61 deletions
+163 -45
View File
@@ -81,11 +81,18 @@
</el-col>
<el-col :span="24">
<el-form-item label="申请人案件证据资料:">
<div v-for="(item, index) in applicateArr" :key="index">
<!-- <div v-for="(item, index) in applicateArr" :key="index">
<a href="#" @click="toFile(item, index)" style="color: blue">
{{ item.annexName }}
</a>
</div>
</div> -->
<p
@click="toFile(index, 2)"
v-for="(item, index) in applicantFileArr"
:key="index"
>
<a href="#">{{ item }}</a>
</p>
</el-form-item>
</el-col>
<!-- 仅详情展示 案件质证环节以后显示被申请人证据-->
@@ -94,19 +101,36 @@
label="被申请人案件证据资料:"
prop="respondentEvidence"
>
<div v-for="(item, index) in quiltArr" :key="index">
<!-- <div v-for="(item, index) in quiltArr" :key="index">
<a href="#" @click="toFile1(item, index)" style="color: blue">
{{ item.annexName }}
</a>
</div>
</div> -->
<p
v-for="(item, index) in respondentFileArr"
:key="index"
@click="toFile(index, 6)"
>
<a href="#">{{ item }}</a>
</p>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="裁决书附件:">
<p
v-for="(item, index) in awardFileArr"
:key="index"
@click="toFile(index, 3)"
>
<a href="#">{{ item }}</a>
</p>
</el-form-item>
</el-col>
</el-row>
</el-form>
<!-- 申请人主体信息 -->
<el-form ref="form2" :model="form2" label-width="150px">
<!-- <div v-for="(item, index) in form2.paymentArr" :key="index"> -->
<div>
<el-form ref="form2" :model="form2" label-width="150px" disabled>
<div v-for="(item, index) in form2.paymentArr" :key="index">
<div style="display: flex; justify-content: space-between">
<div style="display: inline-flex">
<div class="infoIcon"></div>
@@ -126,14 +150,12 @@
},
]"
>
<!-- <el-input v-model="item.name" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.name" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="代码:">
<!-- <el-input v-model="item.identityNum" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.identityNum" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -152,8 +174,7 @@
},
]"
>
<!-- <el-input v-model="item.contactTelphone" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.contactTelphone" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -167,8 +188,7 @@
},
]"
>
<!-- <el-input v-model="item.workAddress" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.workAddress" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -182,8 +202,7 @@
},
]"
>
<!-- <el-input v-model="item.workTelphone" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.workTelphone" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -197,8 +216,7 @@
},
]"
>
<!-- <el-input v-model="item.contactAddress" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.contactAddress" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
@@ -218,8 +236,7 @@
},
]"
>
<!-- <el-input v-model="item.nameAgent" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.nameAgent" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -239,8 +256,7 @@
},
]"
>
<!-- <el-input v-model="item.identityNumAgent" placeholder="请输入" /> -->
<el-input placeholder="请输入" />
<el-input v-model="item.identityNumAgent" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -259,11 +275,10 @@
},
]"
>
<!-- <el-input
<el-input
v-model="item.contactTelphoneAgent"
placeholder="请输入"
/> -->
<el-input placeholder="请输入" />
/>
</el-form-item>
</el-col>
<el-col :span="12">
@@ -277,22 +292,21 @@
},
]"
>
<!-- <el-input
<el-input
v-model="item.contactAddressAgent"
placeholder="请输入"
/> -->
<el-input placeholder="请输入" />
/>
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
<el-form ref="form3" label-width="150px" :model="form3">
<!-- <div
<!-- 被申请人主体信息 -->
<el-form ref="form3" label-width="150px" disabled :model="form3">
<div
v-for="(itm, index) in form3.paymentArr1"
:key="index + form2.paymentArr.length"
> -->
<div>
>
<div style="display: flex; justify-content: space-between">
<div style="display: inline-flex">
<div class="infoIcon"></div>
@@ -304,6 +318,7 @@
<el-col :span="12">
<el-form-item
label="被申请人姓名"
:prop="'paymentArr1.' + index + '.name'"
:rules="[
{
required: true,
@@ -312,12 +327,13 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.name" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="身份证号:"
:prop="'paymentArr1.' + index + '.identityNum'"
:rules="[
{
required: true,
@@ -332,12 +348,13 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.identityNum" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="联系电话:"
:prop="'paymentArr1.' + index + '.contactTelphone'"
:rules="[
{
required: true,
@@ -351,12 +368,13 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.contactTelphone" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="单位地址:"
:prop="'paymentArr1.' + index + '.workAddress'"
:rules="[
{
required: true,
@@ -365,12 +383,13 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.workAddress" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="单位电话:"
:prop="'paymentArr1.' + index + '.workTelphone'"
:rules="[
{
required: true,
@@ -379,12 +398,13 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.workTelphone" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="联系地址:"
:prop="'paymentArr1.' + index + '.contactAddress'"
:rules="[
{
required: true,
@@ -393,7 +413,7 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.contactAddress" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
@@ -401,10 +421,12 @@
<div class="infoIcon"></div>
<div class="caseInfo2">代理人信息:</div>
</div>
<!-- <p>代理人信息:</p> -->
<el-row>
<el-col :span="12">
<el-form-item
label="姓名:"
:prop="'paymentArr1.' + index + '.nameAgent'"
:rules="[
{
required: true,
@@ -413,12 +435,14 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.nameAgent" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<!-- -->
<el-form-item
label="身份证号:"
:prop="'paymentArr1.' + index + '.identityNumAgent'"
:rules="[
{
required: true,
@@ -433,12 +457,13 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input v-model="itm.identityNumAgent" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="联系电话:"
:prop="'paymentArr1.' + index + '.contactTelphoneAgent'"
:rules="[
{
required: true,
@@ -452,12 +477,16 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input
v-model="itm.contactTelphoneAgent"
placeholder="请输入"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="联系地址:"
:prop="'paymentArr1.' + index + '.contactAddressAgent'"
:rules="[
{
required: true,
@@ -466,7 +495,10 @@
},
]"
>
<el-input placeholder="请输入" />
<el-input
v-model="itm.contactAddressAgent"
placeholder="请输入"
/>
</el-form-item>
</el-col>
</el-row>
@@ -477,15 +509,98 @@
<script>
export default {
props: ["caseApplicationObj"],
data() {
return {
formData: {},
applicateArr: [],
quiltArr: [],
form2: {},
form3: {},
initpaymentArr: [],
initpaymentArr1: [],
form2: {
paymentArr: [
{
identityType: 1,
name: "",
identityNum: "",
contactTelphone: "",
workAddress: "",
workTelphone: "",
contactAddress: "",
nameAgent: "",
contactTelphoneAgent: "",
contactAddressAgent: "",
},
],
}, //申请人主体信息
form3: {
paymentArr1: [
{
identityType: 2,
name: "",
identityNum: "",
contactTelphone: "",
workAddress: "",
workTelphone: "",
contactAddress: "",
nameAgent: "",
contactTelphoneAgent: "",
contactAddressAgent: "",
},
],
}, //被申请人主体信息
applicantFileArr: [], //申请人
applicantPathArr: [], //申请人
respondentFileArr: [], //被申请人
respondenPathArr: [], //被申请人
awardFileArr: [], //裁决书
awardPathArr: [], //裁决书
};
},
created() {
if (this.caseApplicationObj) {
this.formData = this.caseApplicationObj;
}
console.log("this.formData", this.formData);
if (this.caseApplicationObj && this.caseApplicationObj.caseAffiliates) {
this.caseApplicationObj.caseAffiliates.forEach((item) => {
if (item.identityType == 1) {
this.initpaymentArr.push(item);
} else {
this.initpaymentArr1.push(item);
}
this.form2.paymentArr = this.initpaymentArr;
this.form3.paymentArr1 = this.initpaymentArr1;
});
}
if (this.caseApplicationObj && this.caseApplicationObj.caseAttachList) {
this.caseApplicationObj.caseAttachList.forEach((item) => {
if (item.annexType == 2) {
this.applicantFileArr.push(item.annexName);
this.applicantPathArr.push(item.annexPath);
} else if (item.annexType == 6) {
this.respondentFileArr.push(item.annexName);
this.respondenPathArr.push(item.annexPath);
} else if (item.annexType == 3) {
this.awardFileArr.push(item.annexName);
this.awardPathArr.push(item.annexPath);
}
});
}
},
methods: {
// 预览文件
toFile(index, val) {
let headPath = window.location.origin + "/API";
if (val == 2) {
window.open(headPath + this.applicantPathArr[index], "_blank");
} else if (val == 6) {
window.open(headPath + this.respondenPathArr[index], "_blank");
} else if (val == 3) {
window.open(headPath + this.awardPathArr[index], "_blank");
}
},
},
};
</script>
@@ -506,4 +621,7 @@ export default {
.el-date-editor {
width: 100%;
}
a {
color: blue;
}
</style>