|
|
|
|
@ -0,0 +1,323 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<!-- 编辑-->
|
|
|
|
|
<xy-dialog :is-show.sync="isShowEditor" title="合同编辑" type="form" :form="detail" :rules="rules" @submit="editor" ref="addContract">
|
|
|
|
|
<template v-slot:name>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>项目名称</Col>
|
|
|
|
|
<Col>
|
|
|
|
|
<Input placeholder="请填写项目名称" v-model="detail.name" style="width: 300px;"/>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-slot:type>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>项目类型</Col>
|
|
|
|
|
<Col>
|
|
|
|
|
<Select placeholder="请选择项目类型" v-model="detail.type" style="width: 300px;">
|
|
|
|
|
<Option v-for="item in [{label:'服务',value:1},{label:'货品',value:2},{label:'工程',value:3}]" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
|
|
|
|
</Select>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-slot:methods>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>采购类型</Col>
|
|
|
|
|
<Col>
|
|
|
|
|
<Select placeholder="请选择采购类型" v-model="detail.methods" style="width: 300px;">
|
|
|
|
|
<Option v-for="item in purchaseType" :value="item.id" :key="item.id">{{ item.value }}</Option>
|
|
|
|
|
</Select>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-slot:modality>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>采购形式</Col>
|
|
|
|
|
<Col>
|
|
|
|
|
<Select placeholder="请选择采购形式" v-model="detail.modality" style="width: 300px;">
|
|
|
|
|
<Option v-for="item in purchaseWay" :value="item.id" :key="item.id">{{ item.value }}</Option>
|
|
|
|
|
</Select>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-slot:price>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>合同预算价</Col>
|
|
|
|
|
<Col>
|
|
|
|
|
<Input placeholder="请填写合同预算价" v-model="detail.price" style="width: 300px;"/>
|
|
|
|
|
</Col>
|
|
|
|
|
<Col offset="1">（万）</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-slot:fundingChannels>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>资金渠道</Col>
|
|
|
|
|
<Col>
|
|
|
|
|
<Select placeholder="请选择资金渠道" v-model="detail.fundingChannels" style="width: 300px;">
|
|
|
|
|
<Option v-for="item in moneyWay" :value="item.id" :key="item.id">{{ item.value }}</Option>
|
|
|
|
|
</Select>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-slot:isBudget>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>是否预算</Col>
|
|
|
|
|
<Col>
|
|
|
|
|
<i-switch v-model="detail.isBudget" @on-change="detail.isBudget = $event" />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-if="detail.isBudget" v-slot:plan>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span="5"><span style="font-weight: 600;padding-right: 4px;color: red;">*</span>关联预算计划</Col>
|
|
|
|
|
<Col style="margin: auto 0;">
|
|
|
|
|
<div class="contract-add-plan" style="width: 300px;" @click="isShowPlan = true,getBudgets()">
|
|
|
|
|
<template v-if="detail.plan.length > 0">
|
|
|
|
|
<template v-for="item in detail.plan">
|
|
|
|
|
<Tag closable color="primary" @on-close="delPlan(item)">{{item.label}}</Tag>
|
|
|
|
|
</template>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<div class="contract-add-plan-no-plan">请选择关联计划</div>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
</xy-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- 编辑中 预算计划 -->
|
|
|
|
|
<xy-dialog :is-show.sync="isShowPlan" title="预算计划" :width="640">
|
|
|
|
|
<template v-slot:normalContent>
|
|
|
|
|
<Input v-model="planSearch" search enter-button="搜 索" placeholder="搜索预算计划.." @on-search="getBudgets"/>
|
|
|
|
|
|
|
|
|
|
<xy-table :list="plans" :show-index="false" :table-item="planTable" :height="300" style="margin-top: 10px;">
|
|
|
|
|
<template v-slot:btns>
|
|
|
|
|
<el-table-column label="使用金额" header-align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<Input :value="scope.row.useMoney ? scope.row.useMoney: scope.row.money" @input="(e)=>scope.row.useMoney = e"/>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</template>
|
|
|
|
|
</xy-table>
|
|
|
|
|
|
|
|
|
|
<div style="display: flex;justify-content: flex-end;">
|
|
|
|
|
<Page :total="planTotal" show-elevator @on-change="planPageChange"/>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<template v-slot:footerContent>
|
|
|
|
|
<Button type="primary" @click="isShowPlan = false">确定</Button>
|
|
|
|
|
</template>
|
|
|
|
|
</xy-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import {editorContract,detailContract} from "@/api/contract/contract";
|
|
|
|
|
import {getBudget} from "@/api/budget/budget";
|
|
|
|
|
import {Message} from 'element-ui'
|
|
|
|
|
export default {
|
|
|
|
|
props:{
|
|
|
|
|
purchaseType:Array,
|
|
|
|
|
moneyWay:Array,
|
|
|
|
|
purchaseWay:Array
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
var planPass = (rule, value, callback) => {
|
|
|
|
|
if(this.detail.isBudget){
|
|
|
|
|
if(this.detail.plan.length === 0){
|
|
|
|
|
return callback(new Error('必选'))
|
|
|
|
|
}else{
|
|
|
|
|
callback()
|
|
|
|
|
}
|
|
|
|
|
}else{
|
|
|
|
|
callback()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return {
|
|
|
|
|
contrantId:'',
|
|
|
|
|
isShowEditor:false,
|
|
|
|
|
isShowPlan:false,
|
|
|
|
|
detail:{},
|
|
|
|
|
rules:{
|
|
|
|
|
name:[
|
|
|
|
|
{required:true,message:"必填"}
|
|
|
|
|
],
|
|
|
|
|
type:[
|
|
|
|
|
{required:true,message:"必选"}
|
|
|
|
|
],
|
|
|
|
|
methods:[
|
|
|
|
|
{required:true,message:"必选"}
|
|
|
|
|
],
|
|
|
|
|
modality:[
|
|
|
|
|
{required:true,message:"必选"}
|
|
|
|
|
],
|
|
|
|
|
price:[
|
|
|
|
|
{required:true,message:"必填"}
|
|
|
|
|
],
|
|
|
|
|
fundingChannels:[
|
|
|
|
|
{required:true,message:"必填"}
|
|
|
|
|
],
|
|
|
|
|
plan:[
|
|
|
|
|
{validator:planPass}
|
|
|
|
|
]
|
|
|
|
|
},
|
|
|
|
|
plans:[],
|
|
|
|
|
planSearch:'',
|
|
|
|
|
planTable:[
|
|
|
|
|
{
|
|
|
|
|
sortable:false,
|
|
|
|
|
width:36,
|
|
|
|
|
customFn:(row)=>{
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<Checkbox value={this.isInArray(row.id)} on={{['on-change']:(e)=>this.selectPlan(e,row)}}></Checkbox>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label:"分类",
|
|
|
|
|
prop:'type',
|
|
|
|
|
formatter:(cell,data,value)=>{
|
|
|
|
|
switch (value){
|
|
|
|
|
case 1:
|
|
|
|
|
return "部门预算"
|
|
|
|
|
break;
|
|
|
|
|
case 2:
|
|
|
|
|
return "水务计划"
|
|
|
|
|
break;
|
|
|
|
|
default:
|
|
|
|
|
return "未知"
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label:"名称",
|
|
|
|
|
prop:'name',
|
|
|
|
|
align:'left'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label:"计划金额",
|
|
|
|
|
prop:'money',
|
|
|
|
|
align:'right'
|
|
|
|
|
}
|
|
|
|
|
],
|
|
|
|
|
planTotal:0,
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
//预算计划表默认选择
|
|
|
|
|
isInArray(id){
|
|
|
|
|
this.detail.plan.map(item=>{
|
|
|
|
|
return item.value.plan_id === id ? true : false
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//选择计划
|
|
|
|
|
selectPlan(e,row){
|
|
|
|
|
if(e){
|
|
|
|
|
this.detail.plan.push({
|
|
|
|
|
label:row.name,
|
|
|
|
|
value:{
|
|
|
|
|
plan_id:row.id,
|
|
|
|
|
use_money:row.useMoney ?? row.money,
|
|
|
|
|
new_money:row.money
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}else{
|
|
|
|
|
this.detail.plan.map((item,index)=>{
|
|
|
|
|
if(item.value.plan_id === row.id){
|
|
|
|
|
this.detail.plan.splice(index,1)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
delPlan(val){
|
|
|
|
|
this.detail.plan.map((item,index)=>{
|
|
|
|
|
if(item.value.plan_id === val.value.plan_id){
|
|
|
|
|
this.detail.plan.splice(index,1)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
//获取预算计划
|
|
|
|
|
async getBudgets(){
|
|
|
|
|
let res = await getBudget({name:this.planSearch,page_size:10,page:this.plansPageIndex})
|
|
|
|
|
this.plans = res.data
|
|
|
|
|
this.planTotal = res.total
|
|
|
|
|
},
|
|
|
|
|
planPageChange(e){
|
|
|
|
|
this.plansPageIndex = e
|
|
|
|
|
this.getBudgets()
|
|
|
|
|
},
|
|
|
|
|
async getDetail(id){
|
|
|
|
|
let res = await detailContract({id:id})
|
|
|
|
|
this.contrantId = res.id
|
|
|
|
|
this.detail = {
|
|
|
|
|
name:res.name,
|
|
|
|
|
type:res.type,
|
|
|
|
|
methods:res.purchase_type_id,
|
|
|
|
|
modality:res.purchase_way_id,
|
|
|
|
|
fundingChannels:res.money_way_id,
|
|
|
|
|
price:res.plan_price,
|
|
|
|
|
isBudget:res.is_plan === 1 ? true : false,
|
|
|
|
|
plan:res.plans.map(item=>{
|
|
|
|
|
return {
|
|
|
|
|
label:item.name,
|
|
|
|
|
value:{
|
|
|
|
|
plan_id:item.id,
|
|
|
|
|
use_money:item.useMoney ?? item.money,
|
|
|
|
|
new_money:item.money
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
editor(){
|
|
|
|
|
editorContract({
|
|
|
|
|
id:this.contrantId,
|
|
|
|
|
type:this.detail.type,
|
|
|
|
|
is_plan:this.detail.isBudget ? 1 : 0,
|
|
|
|
|
purchase_type_id:this.detail.methods,
|
|
|
|
|
purchase_way_id:this.detail.modality,
|
|
|
|
|
money_way_id:this.detail.fundingChannels,
|
|
|
|
|
plan_price:this.detail.price,
|
|
|
|
|
name:this.detail.name,
|
|
|
|
|
contract_plan_links:this.detail.plan.map(item=>{
|
|
|
|
|
return item.value
|
|
|
|
|
})
|
|
|
|
|
}).then(res=>{
|
|
|
|
|
this.isShowEditor = false
|
|
|
|
|
Message({
|
|
|
|
|
type:'success',
|
|
|
|
|
message:"操作成功"
|
|
|
|
|
})
|
|
|
|
|
this.$emit('success')
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
.contract-add-plan{
|
|
|
|
|
min-height: 30px;
|
|
|
|
|
border: 1px solid #dcdee2;
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
align-items: center;
|
|
|
|
|
align-content: center;
|
|
|
|
|
|
|
|
|
|
padding: 0 8px;
|
|
|
|
|
&-no-plan{
|
|
|
|
|
height: 30px;
|
|
|
|
|
line-height: 30px;
|
|
|
|
|
color: #CDD0D5;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
