|
|
|
|
@ -0,0 +1,298 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="page">
|
|
|
|
|
<div class="select-container">
|
|
|
|
|
<DatePicker
|
|
|
|
|
:value="planSelect.year"
|
|
|
|
|
placeholder="选择所属年份"
|
|
|
|
|
placement="bottom-start"
|
|
|
|
|
style="width: 180px;margin-right: 10px;"
|
|
|
|
|
type="year"
|
|
|
|
|
@on-change="(e) => {
|
|
|
|
|
planSelect.year = e
|
|
|
|
|
getBudgets()
|
|
|
|
|
}"
|
|
|
|
|
></DatePicker>
|
|
|
|
|
<el-select
|
|
|
|
|
placeholder="科室选择"
|
|
|
|
|
clearable
|
|
|
|
|
size="small"
|
|
|
|
|
v-model="planSelect.plan_department_id"
|
|
|
|
|
style="width: 180px;margin-right: 10px;"
|
|
|
|
|
@change="getBudgets"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in departments"
|
|
|
|
|
:label="item.name"
|
|
|
|
|
:value="item.id"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
>
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-cascader
|
|
|
|
|
placeholder="资金类型选择"
|
|
|
|
|
:options="planTypes"
|
|
|
|
|
:props="{
|
|
|
|
|
checkStrictly: false,
|
|
|
|
|
label: 'name',
|
|
|
|
|
value: 'id',
|
|
|
|
|
}"
|
|
|
|
|
:value="planSelect.type"
|
|
|
|
|
clearable
|
|
|
|
|
size="small"
|
|
|
|
|
style="width: 220px;margin-right: 10px;"
|
|
|
|
|
@change="(e) => {
|
|
|
|
|
planSelect.type = e[e.length - 1] || '';
|
|
|
|
|
getBudgets();
|
|
|
|
|
}"
|
|
|
|
|
/>
|
|
|
|
|
<Input
|
|
|
|
|
v-model="planSelect.name"
|
|
|
|
|
search
|
|
|
|
|
enter-button="搜 索"
|
|
|
|
|
clearable
|
|
|
|
|
placeholder="搜索预算计划.."
|
|
|
|
|
@on-search="getBudgets"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<xy-table
|
|
|
|
|
:list="plans"
|
|
|
|
|
:show-index="false"
|
|
|
|
|
:table-item="planTable"
|
|
|
|
|
:height="boxHeight"
|
|
|
|
|
style="margin-top: 10px"
|
|
|
|
|
ref="editorPlanTable"
|
|
|
|
|
row-key="id"
|
|
|
|
|
border
|
|
|
|
|
default-expand-all
|
|
|
|
|
@select="planPick"
|
|
|
|
|
:tree-props="{ children: 'notChildren', hasChildren: 'hasChildren' }"
|
|
|
|
|
>
|
|
|
|
|
<template v-slot:btns>
|
|
|
|
|
<el-table-column
|
|
|
|
|
label="使用金额（元）"
|
|
|
|
|
fixed="right"
|
|
|
|
|
header-align="center"
|
|
|
|
|
width="144"
|
|
|
|
|
>
|
|
|
|
|
<template slot-scope="scope" v-if="scope.row.pid === 0">
|
|
|
|
|
<InputNumber
|
|
|
|
|
style="width: 120px"
|
|
|
|
|
:min="0"
|
|
|
|
|
:precision="2"
|
|
|
|
|
:active-change="false"
|
|
|
|
|
v-model="scope.row._inputMoney"
|
|
|
|
|
:formatter="
|
|
|
|
|
(value) => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
|
|
|
|
"
|
|
|
|
|
:parser="(value) => value.replace(/\$\s?|(,*)/g, '')"
|
|
|
|
|
></InputNumber>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</template>
|
|
|
|
|
</xy-table>
|
|
|
|
|
<div style="display: flex; justify-content: flex-end" class="pagination">
|
|
|
|
|
<Page
|
|
|
|
|
:total="planTotal"
|
|
|
|
|
show-elevator
|
|
|
|
|
@on-change="
|
|
|
|
|
(e) => {
|
|
|
|
|
planSelect.page = e;
|
|
|
|
|
getBudgets();
|
|
|
|
|
}
|
|
|
|
|
"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import { getBudget } from "@/api/budget/budget";
|
|
|
|
|
import { listdeptNoAuth } from "@/api/system/department";
|
|
|
|
|
import { getparameterTree } from "@/api/system/dictionary";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
boxHeight: 0,
|
|
|
|
|
planTypes: [],
|
|
|
|
|
departments: [],
|
|
|
|
|
plans: [],
|
|
|
|
|
planSelect: {
|
|
|
|
|
name: "",
|
|
|
|
|
page_size: 20,
|
|
|
|
|
page: 1,
|
|
|
|
|
is_tree: 1,
|
|
|
|
|
year: new Date().getFullYear().toString(),
|
|
|
|
|
plan_department_id: "",
|
|
|
|
|
type: ""
|
|
|
|
|
},
|
|
|
|
|
planTable: [
|
|
|
|
|
{
|
|
|
|
|
sortable: false,
|
|
|
|
|
width: 44,
|
|
|
|
|
type: "selection",
|
|
|
|
|
reserveSelection: true,
|
|
|
|
|
fixed: "left",
|
|
|
|
|
selectable: (row, index) => {
|
|
|
|
|
return row.pid === 0;
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "科室",
|
|
|
|
|
prop: "plan_department.name",
|
|
|
|
|
width: 120,
|
|
|
|
|
align: "center",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "年份",
|
|
|
|
|
prop: "year",
|
|
|
|
|
width: 80,
|
|
|
|
|
align: "center",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "分类",
|
|
|
|
|
prop: "type_detail.value",
|
|
|
|
|
width: 120,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "名称",
|
|
|
|
|
prop: "name",
|
|
|
|
|
minWidth: 180,
|
|
|
|
|
align: "left",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "内容",
|
|
|
|
|
prop: "content",
|
|
|
|
|
minWidth: 200,
|
|
|
|
|
align: "left",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "计划金额",
|
|
|
|
|
prop: "money",
|
|
|
|
|
align: "right",
|
|
|
|
|
width: 120,
|
|
|
|
|
formatter: (v1, v2, value) => {
|
|
|
|
|
return `${(value && parseFloat(value) !== 0) ? value : v1.update_money }`.replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "实付金额",
|
|
|
|
|
prop: "use_money_total",
|
|
|
|
|
width: 120,
|
|
|
|
|
align: "right",
|
|
|
|
|
formatter: (v1, v2, value) =>
|
|
|
|
|
value ? `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ",") : "",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "已用金额",
|
|
|
|
|
prop: "has_money_total",
|
|
|
|
|
width: 120,
|
|
|
|
|
align: "right",
|
|
|
|
|
formatter: (v1, v2, value) =>
|
|
|
|
|
value ? `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ",") : "",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
planTotal: 0,
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
planPick (selection, row) {
|
|
|
|
|
if (row.year != new Date().getFullYear()) {
|
|
|
|
|
this.$confirm("您选择了非本年预算，是否继续？").catch(_ => {
|
|
|
|
|
this.$refs['editorPlanTable'].toggleRowSelection(row)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//获取预算计划
|
|
|
|
|
async getBudgets() {
|
|
|
|
|
let res = await getBudget(this.planSelect);
|
|
|
|
|
res.list.forEach((item) => (item._inputMoney = 0));
|
|
|
|
|
this.plans = res.list;
|
|
|
|
|
this.planTotal = res.list.total || 0;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
getDepartment() {
|
|
|
|
|
listdeptNoAuth().then((res) => {
|
|
|
|
|
this.departments = res;
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
async getPlanTypes() {
|
|
|
|
|
const res = await getparameterTree({
|
|
|
|
|
id: 3
|
|
|
|
|
});
|
|
|
|
|
const dataHandler = (data) => {
|
|
|
|
|
data.forEach(i => {
|
|
|
|
|
if (i.hasOwnProperty('detail')) {
|
|
|
|
|
i.children = i.detail.map(j => {
|
|
|
|
|
j.name = j.value
|
|
|
|
|
return j;
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
dataHandler(i['children'])
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
return data;
|
|
|
|
|
}
|
|
|
|
|
this.planTypes = dataHandler(res?.children) || []
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
getSelections() {
|
|
|
|
|
return new Promise((resolve, reject) => {
|
|
|
|
|
const selections = this.$refs["editorPlanTable"].getSelection();
|
|
|
|
|
if (selections?.length > 0) {
|
|
|
|
|
for (let i of selections) {
|
|
|
|
|
if (i._inputMoney <= 0) {
|
|
|
|
|
this.$message({
|
|
|
|
|
type: "warning",
|
|
|
|
|
message: `【${i.year}】${i.name} 使用金额需要大于0！`,
|
|
|
|
|
});
|
|
|
|
|
reject(`【${i.year}】${i.name} 使用金额需要大于0！`)
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
if (i._inputMoney > ((Number(i.money) || Number(i.update_money)) - Number(i.has_money_total))) {
|
|
|
|
|
this.$message({
|
|
|
|
|
type: "warning",
|
|
|
|
|
message: `【${i.year}】${i.name} 使用金额大于剩余预算！`,
|
|
|
|
|
});
|
|
|
|
|
reject(`【${i.year}】${i.name} 使用金额大于剩余预算！`)
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
resolve(selections.map((i) => ({
|
|
|
|
|
plan_id: i.id,
|
|
|
|
|
plan_title: i.title,
|
|
|
|
|
use_money: i._inputMoney,
|
|
|
|
|
new_money: i.money,
|
|
|
|
|
})))
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
computed: {},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.boxHeight = window.innerHeight - document.querySelector('.select-container')?.getBoundingClientRect()?.height - document.querySelector('.pagination')?.getBoundingClientRect()?.height - 50
|
|
|
|
|
console.log(this.boxHeight, 'box')
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
window.$getPlans = this.getSelections
|
|
|
|
|
this.getPlanTypes()
|
|
|
|
|
this.getDepartment()
|
|
|
|
|
this.getBudgets()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
.page {
|
|
|
|
|
padding: 10px;
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
.select-container {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
