master
parent
4c032c1f2f
commit
fbefb493f4
@ -0,0 +1,583 @@
|
||||
<template>
|
||||
<div v-if="detail">
|
||||
<!-- 合同详情-->
|
||||
<xy-dialog :is-show.sync="isShowDetail" type="normal" title="经费借款" class="contract-detail">
|
||||
<template v-slot:default>
|
||||
<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" v-if="detail.outcome_type === 1">
|
||||
<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%" v-if="detail.outcome_type === 1">
|
||||
<div class="base-info-item-title">采购形式</div>
|
||||
<div class="base-info-item-content" v-if="detail.purchase_way">
|
||||
{{ detail.purchase_way.value }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="base-info-item" style="flex-basis: 50%" v-if="detail.outcome_type === 1">
|
||||
<div class="base-info-item-title">采购方式</div>
|
||||
<div class="base-info-item-content" v-if="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%" v-if="detail.outcome_type === 1">
|
||||
<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%" v-if="detail.outcome_type === 1">
|
||||
<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" v-if="detail.outcome_type === 1">
|
||||
<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" v-if="detail.outcome_type === 1">
|
||||
<div class="base-info-item-title">资金渠道</div>
|
||||
<div class="base-info-item-content">
|
||||
{{ moneyWayFormatter(detail.money_way_detail) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="base-info-item" v-if="detail.outcome_type !== 1">
|
||||
<div class="base-info-item-title">备注</div>
|
||||
<div class="base-info-item-content">
|
||||
{{ detail.remark }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="base-info-item" v-if="detail.outcome_type !== 1">
|
||||
<div class="base-info-item-title">附件</div>
|
||||
<div class="base-info-item-content">
|
||||
<div v-for="i in detail.files_detail">
|
||||
<a @click="open(i)">{{ i.original_name }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="link-budget-plan">
|
||||
<div class="link-budget-plan-title">关联预算计划</div>
|
||||
<div style="display: flex;align-items: center;" v-if="detail.plan_link.length<1">
|
||||
<DatePicker :value="planSelect.year" placeholder="选择所属年份" placement="bottom-start"
|
||||
style="width: 140px;margin-right: 10px;" type="year" @on-change="(e) => {
|
||||
planSelect.year = e
|
||||
getPlan()
|
||||
}"></DatePicker>
|
||||
<el-select placeholder="科室选择" clearable size="small" v-model="planSelect.plan_department_id"
|
||||
style="width: 180px;margin-right: 10px;" @change="getPlan">
|
||||
<el-option v-for="item in departments" :label="item.name" :value="item.id" :key="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<Input v-model="planSelect.name" search enter-button="搜 索" placeholder="搜索预算计划.." @on-search="getPlan" />
|
||||
</div>
|
||||
|
||||
<xy-table :list="plans" :show-index="false" :table-item="planTable" :height="310" style="margin-top: 10px;"
|
||||
ref="PlanTable" row-key="id" border default-expand-all
|
||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" @selection-change="planPick">
|
||||
<template v-slot:btns>
|
||||
<el-table-column label="使用金额（元）" header-align="center" width="150"
|
||||
:fixed="$store.getters.device === 'mobile'?false:'right'">
|
||||
<template slot-scope="scope" v-if="scope.row.pid > 0">
|
||||
<Input :value="scope.row._inputMoney" @input="planInput($event,scope.row)" />
|
||||
<!-- <InputNumber style="width: 120px" :min="0" :precision="2" :active-change="false"
|
||||
:value="Number(scope.row._inputMoney)" @input="e => scope.row._inputMoney = e" :formatter="
|
||||
(value) => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
||||
" :parser="(value) => value.replace(/\$\s?|(,*)/g, '')"></InputNumber> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</xy-table>
|
||||
</div>
|
||||
|
||||
<!-- <xy-table :height="260" :table-item="linkBudgetPlanTable" :show-index="false" :list="detail.plans">
|
||||
<template v-slot:btns>
|
||||
<div></div>
|
||||
</template>
|
||||
</xy-table> -->
|
||||
</template>
|
||||
<template v-slot:footerContent>
|
||||
<div style="display: flex;align-items: center;justify-content: flex-end;">
|
||||
<Button ghost type="primary" @click="isShowDetail=false">关闭</Button>
|
||||
<Button type="primary" style="margin-left: 10px;" @click="submit">确认</Button>
|
||||
</div>
|
||||
</template>
|
||||
</xy-dialog>
|
||||
|
||||
<Modal :width="76" transfer v-model="showModal" :footer-hide="true" title="预览">
|
||||
<template>
|
||||
<iframe style="width: 100%; height: 57vh" :src="codeUri" border="0"></iframe>
|
||||
</template>
|
||||
</Modal>
|
||||
<!-- oa办理-->
|
||||
<Modal
|
||||
:width="86"
|
||||
class-name="oa-modal"
|
||||
title="流程办理"
|
||||
fullscreen
|
||||
:mask-closable="false"
|
||||
v-model="isShowOaModal"
|
||||
footer-hide
|
||||
>
|
||||
<div style="width: 100%;height: 100%;">
|
||||
<iframe style="width: 100%;height: 100%;border-radius: 0 0 6px 6px;" :src="oaUrl" frameborder="0"></iframe>
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
detailContract,
|
||||
editorContract
|
||||
} from "@/api/contract/contract";
|
||||
import {
|
||||
Message
|
||||
} from "element-ui";
|
||||
import {
|
||||
moneyFormatter
|
||||
} from "@/utils";
|
||||
|
||||
import axios from "axios";
|
||||
import {
|
||||
getBudget
|
||||
} from "@/api/budget/budget";
|
||||
import {
|
||||
getToken
|
||||
} from "@/utils/auth";
|
||||
import {
|
||||
deepCopy
|
||||
} from "@/utils";
|
||||
import {flowStatusConfig} from "@/api/common";
|
||||
export default {
|
||||
props: {
|
||||
departments: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
},
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
showModal: false,
|
||||
codeUri: '',
|
||||
isShowOaModal: false,
|
||||
oaUrl: "",
|
||||
window: {
|
||||
width: 0,
|
||||
height: 0,
|
||||
top: 0,
|
||||
left: 0,
|
||||
},
|
||||
|
||||
//合同详情
|
||||
id: "",
|
||||
detail: null,
|
||||
isShowDetail: false,
|
||||
plans: [],
|
||||
contract_plan_links: [],
|
||||
custom_model_id:'',
|
||||
planSelect: {
|
||||
name: "",
|
||||
page_size: 20,
|
||||
page: 1,
|
||||
is_tree: 1,
|
||||
year: new Date().getFullYear().toString(),
|
||||
plan_department_id: "",
|
||||
type: ""
|
||||
},
|
||||
planTable: [{
|
||||
fixed: 'left',
|
||||
sortable: false,
|
||||
width: 44,
|
||||
reserveSelection: true,
|
||||
type: "selection",
|
||||
selectable: (row, index) => {
|
||||
return row.pid > 0
|
||||
},
|
||||
},
|
||||
{
|
||||
label: "科室",
|
||||
prop: 'plan_department.name',
|
||||
width: 160,
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
label: "年份",
|
||||
prop: 'year',
|
||||
width: 80,
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
label: "分类",
|
||||
prop: 'type_detail.value',
|
||||
},
|
||||
{
|
||||
label: "名称",
|
||||
prop: 'name',
|
||||
align: 'left',
|
||||
width: 220,
|
||||
},
|
||||
{
|
||||
label: "计划金额",
|
||||
prop: 'money',
|
||||
align: 'right',
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
label: "实付金额",
|
||||
prop: 'use_money_total',
|
||||
width: 120,
|
||||
align: 'right'
|
||||
},
|
||||
{
|
||||
label: '已用金额',
|
||||
prop: 'has_money_total',
|
||||
width: 120,
|
||||
align: 'right'
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async getFlowConfig() {
|
||||
try {
|
||||
const res = await flowStatusConfig()
|
||||
let arr = []
|
||||
arr = res.map(i => JSON.parse(i.value))
|
||||
arr.map(item=>{
|
||||
if(item.tag==='unit_loan'){
|
||||
this.custom_model_id = item.custom_model_id
|
||||
}
|
||||
})
|
||||
|
||||
} catch (err) {
|
||||
this.custom_model_id = ''
|
||||
}
|
||||
},
|
||||
async getPlan() {
|
||||
try {
|
||||
let res = await getBudget(this.planSelect)
|
||||
let copyPlan = deepCopy(this.detail.plan_link)
|
||||
console.log("res", copyPlan, this.detail.plan_link)
|
||||
this.$refs['PlanTable'].clearSelection()
|
||||
// 如果前面有选关联的 计划
|
||||
if (copyPlan.length > 0) {
|
||||
let arr = []
|
||||
res.list.forEach((item) => {
|
||||
item._inputMoney = 0
|
||||
let temp = copyPlan.find(i => i.plan_id === item.id)
|
||||
if (temp) {
|
||||
item._linkId = temp.id
|
||||
item._inputMoney = temp.use_money
|
||||
if (item.children && item.children.length > 0) {
|
||||
item.children.forEach((i => {
|
||||
i._inputMoney = temp.use_money
|
||||
}))
|
||||
}
|
||||
arr.push(item)
|
||||
}
|
||||
});
|
||||
this.plans = arr;
|
||||
|
||||
} else {
|
||||
res.list.forEach((item => {
|
||||
item._inputMoney = 0
|
||||
if (item.children && item.children.length > 0) {
|
||||
item.children.forEach((i => {
|
||||
i._inputMoney = 0
|
||||
}))
|
||||
}
|
||||
}))
|
||||
this.plans = res.list;
|
||||
}
|
||||
|
||||
|
||||
} catch (e) {
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
planPick(selection) {
|
||||
console.log("selection", selection)
|
||||
this.contract_plan_links = selection.map(i => ({
|
||||
plan_id: i.id,
|
||||
is_pre: 1,
|
||||
use_money: i._inputMoney,
|
||||
new_money: i._inputMoney,
|
||||
custom_model_id: this.custom_model_id
|
||||
}))
|
||||
},
|
||||
//预算计划金额输入
|
||||
planInput(e, row) {
|
||||
if (!/^[0-9]+.?[0-9]*$/.test(e) && e) {
|
||||
Message({
|
||||
type: 'warning',
|
||||
message: '金额格式错误'
|
||||
})
|
||||
row._inputMoney = 0
|
||||
return
|
||||
}
|
||||
if (e <= (Number(row.money) - Number(row.use_money_total))) {
|
||||
row._inputMoney = e
|
||||
return
|
||||
}
|
||||
Message({
|
||||
type: 'warning',
|
||||
message: '使用金额大于剩余预算'
|
||||
})
|
||||
row._inputMoney = 0
|
||||
},
|
||||
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;
|
||||
await this.getPlan()
|
||||
},
|
||||
submit(){
|
||||
if(this.contract_plan_links.length<1){
|
||||
this.$message.warning('请选择预算计划')
|
||||
return
|
||||
}
|
||||
console.log("123",{
|
||||
id:this.id,
|
||||
has_act_links:1,
|
||||
contract_plan_links:this.contract_plan_links,
|
||||
})
|
||||
// return
|
||||
editorContract({
|
||||
id:this.id,
|
||||
has_act_links:1,
|
||||
contract_plan_links:this.contract_plan_links,
|
||||
}).then(_ => {
|
||||
this.$message.success('提交成功')
|
||||
this.$emit('update:isShowDetail', false)
|
||||
this.$emit('refresh')
|
||||
this.openOa()
|
||||
})
|
||||
},
|
||||
openOa(){
|
||||
let url = `${process.env.VUE_APP_OUT_URL}/#/flow/create?auth_token=${window.encodeURIComponent(getToken())}&module_name=oa&isSinglePage=1&module_id=${this.custom_model_id}&out_contract_id=${this.id}&default_json={}`
|
||||
this.oaUrl = url
|
||||
this.isShowOaModal = true
|
||||
},
|
||||
open(e) {
|
||||
this.codeUri = `http://view.ali251.langye.net:8012/onlinePreview?url=${encodeURIComponent(
|
||||
new Buffer(e.url).toString("base64")
|
||||
)}`;
|
||||
|
||||
this.showModal = true;
|
||||
}
|
||||
},
|
||||
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);
|
||||
};
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
isShowDetail(val) {
|
||||
if (val) {
|
||||
|
||||
}else{
|
||||
this.plans = []
|
||||
this.contract_plan_links = []
|
||||
this.planSelect = {
|
||||
name: "",
|
||||
page_size: 20,
|
||||
page: 1,
|
||||
is_tree: 1,
|
||||
year: new Date().getFullYear().toString(),
|
||||
plan_department_id: "",
|
||||
type: ""
|
||||
},
|
||||
this.$refs['PlanTable'].clearSelection()
|
||||
}
|
||||
},
|
||||
isShowOaModal(newVal) {
|
||||
if (newVal) {
|
||||
|
||||
} else {
|
||||
this.oaUrl = ''
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getFlowConfig()
|
||||
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;
|
||||
},
|
||||
created() {},
|
||||
};
|
||||
</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;
|
||||
}
|
||||
|
||||
&-item {
|
||||
@extend .base-info-item;
|
||||
|
||||
&-title {
|
||||
@extend .base-info-item-title;
|
||||
}
|
||||
|
||||
&-content {
|
||||
@extend .base-info-item-content;
|
||||
}
|
||||
|
||||
&-unit {
|
||||
@extend .base-info-item-unit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.out-sign-info {
|
||||
margin-top: 20px;
|
||||
@extend .sign-info;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: red;
|
||||
|
||||
&:hover {
|
||||
color: red;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue