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.

481 lines
14 KiB

2 years ago
<template>
<div v-if="detail">
<!-- 合同详情-->
<xy-dialog :is-show.sync="isShowDetail" type="normal" title="详情" class="contract-detail">
<template v-slot:normalContent>
<div class="base-info">
<div class="base-info-title">项目基本信息</div>
<div class="base-info-item">
<div class="base-info-item-title">项目名称</div>
<div class="base-info-item-content">{{detail.name}}</div>
</div>
<div class="base-info-item">
<div class="base-info-item-title">项目类型</div>
<div class="base-info-item-content">{{typeFormatter(detail.type)}}</div>
</div>
<div style="display: flex;justify-content: space-between;">
<div class="base-info-item" style="flex-basis: 50%">
<div class="base-info-item-title">采购形式</div>
<div class="base-info-item-content">{{detail.purchase_way?detail.purchase_way.value:'无'}}</div>
</div>
<div class="base-info-item" style="flex-basis: 50%">
<div class="base-info-item-title">采购方式</div>
<div class="base-info-item-content">{{detail.purchase_type?detail.purchase_type.value:'无'}}</div>
</div>
</div>
<div style="display: flex;justify-content: space-between;">
<div class="base-info-item" style="flex-basis: 50%">
<div class="base-info-item-title">签订时间</div>
<div class="base-info-item-content">{{detail.date}}</div>
</div>
<div class="base-info-item" style="flex-basis: 50%">
<div class="base-info-item-title">服务时间</div>
<div class="base-info-item-content">{{detail.start_date}}{{detail.end_date}}</div>
</div>
</div>
<div class="base-info-item">
<div class="base-info-item-title">项目预算</div>
<div class="base-info-item-content">{{moneyFormat(detail.plan_price)}}</div>
<div class="base-info-item-unit">()</div>
</div>
<div class="base-info-item">
<div class="base-info-item-title">资金渠道</div>
<div class="base-info-item-content">{{moneyWayFormatter(detail.money_way_detail)}}</div>
</div>
</div>
<div class="link-budget-plan">
<div class="link-budget-plan-title">关联预算计划</div>
<xy-table :height="260" :isPage='false' :table-item="linkBudgetPlanTable" :show-index="false" :list="detail.plans">
<template v-slot:btns>
<div></div>
</template>
</xy-table>
</div>
<div class="sign-info">
<div class="sign-info-title">签订信息</div>
<div class="sign-info-item">
<div class="sign-info-item-title">合同金额</div>
<div class="sign-info-item-content">{{moneyFormat(detail.money)}}</div>
<div class="sign-info-item-unit"></div>
</div>
<div style="display: flex;justify-content: space-between">
<div class="sign-info-item" style="flex-basis: 50%">
<div class="sign-info-item-title">承包商\供应商</div>
<div class="sign-info-item-content">{{detail.supply}}</div>
</div>
<div class="sign-info-item" style="flex-basis: 50%">
<div class="sign-info-item-title">执行部门</div>
<div class="sign-info-item-content">{{detail.carry_department}}</div>
</div>
</div>
</div>
<div class="related-processes">
<div class="related-processes-title">相关流程进展查看</div>
<div class="related-processes-item">
<div @click="seeBuyProcess" :style="{'color':detail.purchase_last_flow_id ? 'green' : 'red'}">采购流程查看</div>
<div @click="seeSignProcess" :style="{'color':detail.join_last_flow_id ? 'green' : 'red'}">合同会签流程查看</div>
<template v-if="detail.purchase_way?detail.purchase_way.remark === 'true':false">
<div @click="seeBidding" :style="{'color':detail.invite_last_flow_id ? 'green' : 'red'}">招标审批流程查看</div>
</template>
<template v-if="detail.is_plan != 1">
<div @click="seeAskProcess" :style="{'color':detail.req_last_flow_id ? 'green' : 'red'}">请示流程查看</div>
</template>
</div>
</div>
<div class="journal">
<div class="journal-title">日志</div>
<xy-table :height="240" :isPage='false' :table-item="journalTable" :list="detail.log" :show-index="false">
<template v-slot:btns>
<div></div>
</template>
</xy-table>
</div>
</template>
<template v-slot:footerContent>
<Button type="primary" @click='isShowDetail=false'>关闭</Button>
</template>
</xy-dialog>
</div>
</template>
<script>
import {
show as detailContract,
getOatoken
} from "@/api/contract.js";
import {
parseTime
} from "@/utils"
import {
Message
} from "element-ui";
import {
moneyFormatter
} from "@/utils"
import {
getparameter
} from "@/api/system/dictionary";
export default {
components: {
},
data() {
return {
window: {
width: 0,
height: 0,
top: 0,
left: 0
},
//合同详情
id: '',
detail: null,
isShowDetail: false,
linkBudgetPlanTable: [{
label: "ID",
sortable: false,
prop: 'id',
width: 130
},
{
label: "类型",
width: 100,
sortable: false,
customFn: (row) => {
const typeSwitch = (type) => {
{
let res = this.planTypes.filter(item => {
return item.id === type
})
return res[0]?.value || '未知'
}
}
return ( <
div >
<
Tag color = "primary" > {
typeSwitch(row.type)
} <
/Tag> <
/div>
)
}
},
{
label: "项目",
width: 140,
sortable: false,
prop: 'name'
},
{
label: "金额",
sortable: false,
prop: 'money',
align: 'right',
minWidth: 200,
formatter: (v1, v2, value) => {
return Number(value).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,')
}
},
{
label: '使用金额',
sortable: false,
prop: 'useMoney',
align: 'right',
minWidth: 200,
formatter: (v1, v2, value) => {
return Number(value).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,')
}
}
],
journalTable: [{
label: 'ID',
sortable: false,
prop: 'id'
},
{
label: "日志类型",
sortable: false,
prop: 'type'
},
{
label: "日志内容",
sortable: false,
prop: 'remark'
},
{
label: "操作人",
sortable: false,
prop: 'admin.name'
},
{
label: "时间",
sortable: false,
prop: 'created_at',
width: 160,
formatter: (cell, data, value) => {
return parseTime(new Date(value), '{y}-{m}-{d} {h}:{i}')
}
}
],
planTypes: [],
}
},
methods: {
async getPlanTypes() {
const res = await getparameter({
number: 'money_way'
})
this.planTypes = res.detail
},
async seeBuyProcess() {
if (!this.detail?.purchase_last_flow_id) {
Message({
type: "warning",
message: "还未进行采购申请",
duration: 2000
})
return
}
let res = await getOatoken()
let url =
2 years ago
`${process.env.VUE_APP_OA_URL}/admin/flow/view/${this.detail.purchase_last_flow_id}?wuziguanli_oatoken=${res.oatoken}`
2 years ago
let seeBuy = window.open(url, 'seeBuy',
`top=${this.window.top},left=${this.window.left},width=${this.window.width},height=${this.window.height},location=0`
2 years ago
)
console.log(url)
2 years ago
},
async seeBidding() {
if (!this.detail?.invite_last_flow_id) {
Message({
type: "warning",
message: "还未进行招标申请",
duration: 2000
})
return
}
let res = await getOatoken()
let url =
2 years ago
`${process.env.VUE_APP_OA_URL}/admin/flow/view/${this.detail.invite_last_flow_id}?wuziguanli_oatoken=${res.oatoken}`
2 years ago
let seeBidding = window.open(url, 'seeBidding',
`top=${this.window.top},left=${this.window.left},width=${this.window.width},height=${this.window.height},location=0`
2 years ago
)
console.log(url)
2 years ago
},
async seeSignProcess() {
if (!this.detail?.join_last_flow_id) {
Message({
type: "warning",
message: "还未进行会签申请",
duration: 2000
})
return
}
let res = await getOatoken()
let url =
2 years ago
`${process.env.VUE_APP_OA_URL}/admin/flow/view/${this.detail.join_last_flow_id}?wuziguanli_oatoken=${res.oatoken}`
2 years ago
let seeSign = window.open(url, 'seeSign',
`top=${this.window.top},left=${this.window.left},width=${this.window.width},height=${this.window.height},location=0`
2 years ago
)
console.log(url)
2 years ago
},
async seeAskProcess() {
if (!this.detail?.req_last_flow_id) {
Message({
type: "warning",
message: "还未进行请示申请",
duration: 2000
})
return
}
2 years ago
let res = await getOatoken()
console.log(url)
2 years ago
let url =
2 years ago
`${process.env.VUE_APP_OA_URL}/admin/flow/view/${this.detail.req_last_flow_id}?wuziguanli_oatoken=${res.oatoken}`
2 years ago
let seeAsk = window.open(url, 'seeAsk',
`top=${this.window.top},left=${this.window.left},width=${this.window.width},height=${this.window.height},location=0`
2 years ago
)
console.log(url)
2 years ago
},
async getDetail(id) {
this.id = id
let res = await detailContract({
id: id
})
this.detail = res
let plans = res.plans
let linkPlan = res.plan_link
let linkPlanTable = plans?.map(item => {
let res = linkPlan.filter(item1 => {
return item1.plan_id === item.id
})[0]
return {
id: item.id,
type: item.type,
name: item.name,
money: item.money,
useMoney: res.use_money
}
})
this.detail.plans = linkPlanTable
console.log(this.detail)
},
},
computed: {
typeFormatter() {
return function(type) {
switch (type) {
case 1:
return "服务"
break;
case 2:
return "货物"
break;
case 3:
return "工程"
break;
case 4:
return '其他'
break;
default:
return "未知"
}
}
},
moneyWayFormatter() {
return function(arr) {
let res = arr?.map(item => {
return item.value
})
return res?.toString()
}
},
moneyFormat() {
return function(money) {
return moneyFormatter(money)
}
}
},
mounted() {
this.window.width = screen.availWidth * 0.95
this.window.height = screen.availHeight * 0.95
this.window.top = (window.screen.height - 30 - this.window.height) / 2
this.window.left = (window.screen.width - 10 - this.window.width) / 2
}
}
</script>
<style scoped lang="scss">
.contract-detail {
.base-info {
&-title {
font-weight: 600;
padding: 0 10px;
}
&-item {
display: flex;
margin-top: 8px;
&-title {
padding: 0 20px;
}
&-content {}
&-unit {
margin-left: 20px;
}
}
}
.link-budget-plan {
margin-top: 20px;
&-title {
@extend .base-info-title;
padding-bottom: 10px;
}
}
.sign-info {
&-title {
@extend .link-budget-plan-title;
margin-top:20px;
}
&-item {
@extend .base-info-item;
&-title {
@extend .base-info-item-title;
}
&-content {
@extend .base-info-item-content;
}
&-unit {
@extend .base-info-item-unit;
}
}
}
.pay-plan {
margin-top: 20px;
&-title {
@extend .link-budget-plan-title;
}
}
.related-processes {
margin-top: 20px;
&-title {
@extend .link-budget-plan-title;
}
&-item {
//color: red;
display: flex;
&>div {
cursor: pointer;
margin: 0 20px;
}
}
}
.journal {
margin-top: 20px;
&-title {
@extend .link-budget-plan-title;
}
}
}
</style>