更新
This commit is contained in:
jiangyouyi
parent
f1d480f117
commit
1a0cc6d8da
@ -1,118 +1,438 @@
|
||||
<template>
|
||||
<el-dialog @confirm="handleSubmit" title="合同详情" v-model="show">
|
||||
<el-form ref="formRef" :model="formData" label-width="90px" :rules="formRules">
|
||||
<el-form-item label="合同类型" prop="contract_type">
|
||||
<el-input
|
||||
v-model="formData.contract_type_name"
|
||||
:disabled="true"
|
||||
clearable
|
||||
placeholder="请输入合同类型"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同编号" prop="contract_no">
|
||||
<el-input
|
||||
v-model="formData.contract_no"
|
||||
:disabled="true"
|
||||
clearable
|
||||
placeholder="暂无合同编号"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="甲方" prop="party_a">
|
||||
<el-input
|
||||
v-model="formData.party_a_name"
|
||||
:disabled="true"
|
||||
clearable
|
||||
placeholder="暂无甲方"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="乙方" prop="party_b">
|
||||
<el-input
|
||||
v-model="formData.party_b_name"
|
||||
:disabled="true"
|
||||
clearable
|
||||
placeholder="暂无乙方"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="片区经理" prop="area_manager_name">
|
||||
<el-input
|
||||
v-model="formData.area_manager"
|
||||
:disabled="true"
|
||||
clearable
|
||||
placeholder="暂无经理"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="类型" prop="type">
|
||||
<el-input
|
||||
v-model="formData.type_name"
|
||||
:disabled="true"
|
||||
clearable
|
||||
placeholder="暂无状态"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-input
|
||||
v-model="formData.status_name"
|
||||
:disabled="true"
|
||||
clearable
|
||||
placeholder="暂无状态"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同地址" v-if="formData.status == 1">
|
||||
<el-link type="success" :href="formData.url" target="_blank">在线查看</el-link>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="btn_men">
|
||||
<el-button @click="show = false">取消</el-button>
|
||||
<el-button type="primary" @click="show = false">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-card class="box-card">
|
||||
<template #header>
|
||||
<span>公司基本信息</span>
|
||||
</template>
|
||||
<el-form
|
||||
:inline="true"
|
||||
ref="formRef"
|
||||
:model="compeny"
|
||||
label-width="90px"
|
||||
:rules="formRules"
|
||||
class="select"
|
||||
>
|
||||
<el-form-item label="公司名称" prop="company_name" required>
|
||||
<el-input
|
||||
v-model="compeny.company_name"
|
||||
placeholder="请输入公司名称"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="社会代码" prop="organization_code" required>
|
||||
<el-input
|
||||
v-model="compeny.organization_code"
|
||||
placeholder="请输入社会代码"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="公司类型" prop="compeny" >
|
||||
<el-select
|
||||
v-model="compeny.company_type"
|
||||
placeholder="请输入公司类型"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="省" prop="province" >
|
||||
<el-select
|
||||
v-model="compeny.province"
|
||||
placeholder="请选择省"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="市" prop="city" >
|
||||
<el-select
|
||||
v-model="compeny.city"
|
||||
placeholder="请选择市"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="区" prop="area" >
|
||||
<el-select
|
||||
v-model="compeny.area"
|
||||
placeholder="请选择区"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="镇" prop="company_type_name" >
|
||||
<el-select
|
||||
v-model="compeny.company_type_name"
|
||||
placeholder="请选择镇"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="地址" prop="address" >
|
||||
<el-input
|
||||
v-model="compeny.address"
|
||||
placeholder="请输入公司地址"
|
||||
:style="{ width: '31.5rem' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card>
|
||||
<template #header>
|
||||
<span>公司资质信息</span>
|
||||
</template>
|
||||
<el-form
|
||||
:inline="true"
|
||||
ref="formRef"
|
||||
:model="compeny"
|
||||
label-width="90px"
|
||||
:rules="formRules"
|
||||
>
|
||||
<el-form-item label="公司资质" prop="contract_type" required>
|
||||
<div class="company">
|
||||
<img :src="compenyimg.bank_account"/>
|
||||
<img :src="compenyimg.bank_accountB"/>
|
||||
</div>
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item label="其他资质" prop="contract_no" required>
|
||||
<div class="company">
|
||||
<img :src="compenyimg.business_license"/>
|
||||
<img :src="compenyimg.business_licenseB"/>
|
||||
</div>
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card v-if="show">
|
||||
<template #header>
|
||||
<span>单位基本信息</span>
|
||||
</template>
|
||||
<el-form
|
||||
:inline="true"
|
||||
ref="formRef"
|
||||
:model="compenyB"
|
||||
label-width="90px"
|
||||
:rules="formRules"
|
||||
class="select"
|
||||
>
|
||||
<el-form-item label="公司名称" prop="company_name" required>
|
||||
<el-input
|
||||
v-model="compenyB.company_name"
|
||||
placeholder="请输入公司名称"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="社会代码" prop="organization_code" required>
|
||||
<el-input
|
||||
v-model="compenyB.organization_code"
|
||||
placeholder="请输入社会代码"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="公司类型" prop="company_type" >
|
||||
<el-select
|
||||
v-model="compenyB.company_type"
|
||||
placeholder="请输入社会类型"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="省" prop="province" >
|
||||
<el-select
|
||||
v-model="compenyB.province"
|
||||
placeholder="请选择省"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="市" prop="city" >
|
||||
<el-select
|
||||
v-model="compenyB.city"
|
||||
placeholder="请选择市"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="区" prop="area" >
|
||||
<el-select
|
||||
v-model="compenyB.area"
|
||||
placeholder="请选择区"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="镇" prop="street" >
|
||||
<el-select
|
||||
v-model="compenyB.street"
|
||||
placeholder="请选择镇"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="地址" prop="street" >
|
||||
<el-input
|
||||
v-model="compenyB.street"
|
||||
placeholder="请输入公司地址"
|
||||
:style="{ width: '31.5rem' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card v-if="show">
|
||||
<template #header>
|
||||
<span>单位资质信息</span>
|
||||
</template>
|
||||
<el-form
|
||||
:inline="true"
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
label-width="90px"
|
||||
:rules="formRules"
|
||||
>
|
||||
<el-form-item label="公司资质" prop="contract_type" required>
|
||||
<div class="company">
|
||||
<img :src="compenyimg.bank_account"/>
|
||||
<img :src="compenyimg.bank_accountB"/>
|
||||
</div>
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item label="其他资质" prop="contract_no" required>
|
||||
<div class="company">
|
||||
<img :src="compenyimg.business_license"/>
|
||||
<img :src="compenyimg.business_licenseB"/>
|
||||
</div>
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card v-if="flag">
|
||||
<template #header>
|
||||
<span>个人基本信息</span>
|
||||
</template>
|
||||
<div class="persenal">
|
||||
<img :src="persen.avatar">
|
||||
<el-form
|
||||
:inline="true"
|
||||
ref="formRef"
|
||||
:model="persen"
|
||||
label-width="90px"
|
||||
:rules="formRules"
|
||||
class="select"
|
||||
>
|
||||
<el-form-item label="姓名">
|
||||
<el-input
|
||||
v-model="persen.nickname"
|
||||
placeholder="请输入姓名"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别">
|
||||
<el-input
|
||||
v-model="persen.sex"
|
||||
placeholder="请输入性别"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话">
|
||||
<el-input
|
||||
v-model="persen.mobile"
|
||||
placeholder="请输入联系电话"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证号">
|
||||
<el-input
|
||||
v-model="persen.id"
|
||||
placeholder="请输入身份证号"
|
||||
:style="{ width: '22rem' }"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="省" prop="province" >
|
||||
<el-select
|
||||
v-model="persen.province"
|
||||
placeholder="请选择省"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="市" prop="city" >
|
||||
<el-select
|
||||
v-model="persen.city"
|
||||
placeholder="请选择市"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="区" prop="area" >
|
||||
<el-select
|
||||
v-model="persen.area"
|
||||
placeholder="请选择区"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="镇" prop="street" >
|
||||
<el-select
|
||||
v-model="persen.street"
|
||||
placeholder="请选择镇"
|
||||
>
|
||||
<el-option></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card v-if="flag">
|
||||
<template #header>
|
||||
<span>个人资质信息</span>
|
||||
</template>
|
||||
<el-form class="idcard" :model="persenimg" :inline="true">
|
||||
<el-form-item label="身份证">
|
||||
<img :src="persenimg.id_card" >
|
||||
<img :src="persenimg.id_card_b" >
|
||||
</el-form-item>
|
||||
<el-form-item label="行驶证">
|
||||
<img :src="persenimg.car_card" >
|
||||
<img :src="persenimg.car_card_b" >
|
||||
</el-form-item>
|
||||
<el-form-item label="银行卡号">
|
||||
<img :src="persenimg.bank_account" >
|
||||
<img :src="persenimg.bank_account_b" >
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card>
|
||||
<template #header>
|
||||
<span>电子合同</span>
|
||||
</template>
|
||||
<el-form
|
||||
:inline="true"
|
||||
class="frame"
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
label-width="90px"
|
||||
:rules="formRules"
|
||||
>
|
||||
<el-form-item label="签约方" prop="contract_type">
|
||||
<el-input
|
||||
v-model="formData.party_b_name"
|
||||
:disabled="true"
|
||||
placeholder="暂无签约方"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="被签约公司" prop="contract_no">
|
||||
<el-input
|
||||
v-model="formData.party_b_name"
|
||||
:disabled="true"
|
||||
placeholder="暂无签约方"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同类型" prop="contract_no">
|
||||
<el-input
|
||||
v-model="formData.party_b_name"
|
||||
:disabled="true"
|
||||
placeholder="暂无签约方"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="合同编号" prop="contract_no">
|
||||
<el-input
|
||||
v-model="formData.party_b_name"
|
||||
:disabled="true"
|
||||
placeholder="暂无签约方"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-card>
|
||||
<el-form>
|
||||
<el-form-item required label="合同上传">
|
||||
<el-button type="primary">上传</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, defineExpose } from 'vue'
|
||||
import { apiContractDetail } from "@/api/contract";
|
||||
import { ref, reactive, defineExpose } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
const { query } = useRoute();
|
||||
const formData = reactive({
|
||||
id: '',
|
||||
company_id: '',
|
||||
contract_type: '',
|
||||
contract_type_name: '',
|
||||
contract_no: '',
|
||||
file: '',
|
||||
status: '',
|
||||
party_a: '',
|
||||
party_a_name: '',
|
||||
party_b: '',
|
||||
party_b_name: '',
|
||||
area_manager: '',
|
||||
area_manager_name: '',
|
||||
type_name: '',
|
||||
url: '',
|
||||
status_name: ''
|
||||
})
|
||||
const show = ref(false)
|
||||
const shoeEditFn = (flag) => {
|
||||
show.value = flag
|
||||
}
|
||||
id: "",
|
||||
company_id: "",
|
||||
contract_type: "",
|
||||
contract_type_name: "",
|
||||
contract_no: "",
|
||||
file: "",
|
||||
status: "",
|
||||
party_a: "",
|
||||
party_a_name: "",
|
||||
party_b: "",
|
||||
party_b_name: "",
|
||||
area_manager: "",
|
||||
area_manager_name: "",
|
||||
type_name: "",
|
||||
url: "",
|
||||
status_name: "",
|
||||
});
|
||||
const compeny=ref([])
|
||||
const compenyimg=ref([])
|
||||
const compenyB=ref([])
|
||||
const compenyBimg=ref([])
|
||||
const persen=ref([])
|
||||
const persenimg=ref([])
|
||||
const show = ref(true);
|
||||
const flag = ref(true);
|
||||
// 传值赋值
|
||||
const setFormData = async (data) => {
|
||||
for (const key in formData) {
|
||||
if (data[key] != null && data[key] != undefined) {
|
||||
//@ts-ignore
|
||||
formData[key] = data[key]
|
||||
if (key == 'type') {
|
||||
formData.type = data.type == 1 ? '公司' : '个人'
|
||||
}
|
||||
}
|
||||
apiContractDetail({ id: query.id }).then((res) => {
|
||||
compeny.value=res.party_a_info
|
||||
compenyimg.value=res.party_a_info.qualification
|
||||
if(res.type==2)
|
||||
{
|
||||
persen.value=res.party_b_info
|
||||
persenimg.value=res.party_b_info.qualification
|
||||
show.value=false
|
||||
}
|
||||
}
|
||||
else if(res.type==1)
|
||||
{
|
||||
compenyB.value=res.party_b_info
|
||||
compenyBimg.value=res.party_b_info.qualification
|
||||
flag.value=false
|
||||
}
|
||||
console.log(res)
|
||||
|
||||
defineExpose({
|
||||
shoeEditFn,
|
||||
setFormData
|
||||
})
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.btn_men {
|
||||
text-align: right;
|
||||
text-align: right;
|
||||
}
|
||||
.frame {
|
||||
.el-form-item {
|
||||
.el-input {
|
||||
width: 43rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.select{
|
||||
.el-form-item {
|
||||
.el-select {
|
||||
width: 12rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.company{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
img{
|
||||
width: 20rem;
|
||||
height: 10rem;
|
||||
}
|
||||
}
|
||||
.persenal{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
img{
|
||||
width: 8rem;
|
||||
height:10rem;
|
||||
}
|
||||
}
|
||||
.idcard{
|
||||
img{
|
||||
width: 12rem;
|
||||
height: 10rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -103,8 +103,8 @@
|
||||
type="primary"
|
||||
link
|
||||
@click="showDetil(row.id)"
|
||||
>
|
||||
详情
|
||||
>
|
||||
<router-link :to="{path:'/contract/detail',query: {id: row.id}}">详情</router-link>
|
||||
</el-button>
|
||||
|
||||
<!-- <el-button v-perms="['contract.contract/delete']" type="danger" link
|
||||
@ -117,18 +117,20 @@
|
||||
<pagination v-model="pager" @change="getLists" />
|
||||
</div>
|
||||
</el-card>
|
||||
<contractDetil ref="childDetil"></contractDetil>
|
||||
<!-- <contractDetil ref="childDetil"></contractDetil> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="contractLists">
|
||||
import contractDetil from './contractDetil.vue'
|
||||
// import contractDetil from './contractDetil.vue'
|
||||
import { usePaging } from '@/hooks/usePaging'
|
||||
import { useDictData } from '@/hooks/useDictOptions'
|
||||
import { apiContractLists, apiContractDelete, apiContractDetail } from '@/api/contract'
|
||||
import { timeFormat } from '@/utils/util'
|
||||
import feedback from '@/utils/feedback'
|
||||
|
||||
|
||||
|
||||
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
|
||||
// 是否显示编辑框
|
||||
const showEdit = ref(false)
|
||||
@ -164,9 +166,9 @@ const { pager, getLists, resetParams, resetPage } = usePaging({
|
||||
// 详情
|
||||
const childDetil = ref()
|
||||
const showDetil = async (id) => {
|
||||
const res = await apiContractDetail({ id })
|
||||
childDetil.value.setFormData(res)
|
||||
childDetil.value.shoeEditFn(true)
|
||||
// const res = await apiContractDetail({ id })
|
||||
// childDetil.value.setFormData(res)
|
||||
// childDetil.value.shoeEditFn(true)
|
||||
}
|
||||
// 查看合同
|
||||
const checkContcat = (id: number) => {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user