|
|
<template>
|
|
|
<div style="padding: 0 20px">
|
|
|
<lx-header
|
|
|
icon="md-apps"
|
|
|
style="margin-bottom: 10px; border: 0px; margin-top: 15px"
|
|
|
text="预算计划"
|
|
|
>
|
|
|
<div slot="content" />
|
|
|
<slot>
|
|
|
<div>
|
|
|
<span style="padding: 0 6px">年份</span>
|
|
|
<span>
|
|
|
<DatePicker
|
|
|
:value="select.year"
|
|
|
placeholder="选择所属年份"
|
|
|
placement="bottom"
|
|
|
style="width: 130px"
|
|
|
type="year"
|
|
|
@on-change="(e) => (select.year = e,changeYear(e),getBudgets())"
|
|
|
/>
|
|
|
</span>
|
|
|
|
|
|
<span style="padding: 0 6px"> 预算类型 </span>
|
|
|
<span>
|
|
|
|
|
|
<el-select
|
|
|
v-model="select.typeName"
|
|
|
clearable
|
|
|
placeholder="选择预算类型"
|
|
|
style="width: 130px"
|
|
|
@change="changeType"
|
|
|
>
|
|
|
<el-option disabled value="" style="height:150px;overflow: scroll;">
|
|
|
<el-tree
|
|
|
ref="tree1"
|
|
|
style="width:300px"
|
|
|
default-expand-all
|
|
|
:default-checked-keys="checkArr"
|
|
|
:check-strictly="true"
|
|
|
:data="types"
|
|
|
show-checkbox
|
|
|
node-key="id"
|
|
|
highlight-current
|
|
|
:props="defaultProps"
|
|
|
@check="(data, node)=>{return getSelectedNodes(data,node,'tree1')}"
|
|
|
/>
|
|
|
</el-option>
|
|
|
|
|
|
</el-select>
|
|
|
</span>
|
|
|
|
|
|
<span style="padding: 0 6px"> 科室 </span>
|
|
|
<span>
|
|
|
<el-select
|
|
|
v-model="select.department"
|
|
|
placeholder="科室选择"
|
|
|
clearable
|
|
|
size="small"
|
|
|
style="width: 160px"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in departments"
|
|
|
:key="item.id"
|
|
|
:label="item.name"
|
|
|
:value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</span>
|
|
|
<el-switch
|
|
|
v-model="isTree"
|
|
|
active-text="树形结构"
|
|
|
@change="changeTree"
|
|
|
/>
|
|
|
<Button
|
|
|
style="margin-left: 10px"
|
|
|
type="primary"
|
|
|
@click="showAdd('')"
|
|
|
>新增</Button>
|
|
|
<Button
|
|
|
style="margin-left: 10px"
|
|
|
type="primary"
|
|
|
@click="getBudgets"
|
|
|
>查询</Button>
|
|
|
<Button
|
|
|
style="margin-left: 10px"
|
|
|
type="primary"
|
|
|
@click="
|
|
|
() => (select = { page: 1, year: '', type: '', department: '' })
|
|
|
"
|
|
|
>重置
|
|
|
</Button>
|
|
|
</div>
|
|
|
</slot>
|
|
|
</lx-header>
|
|
|
|
|
|
<div v-if="isTree">
|
|
|
<el-table
|
|
|
ref="treeTable"
|
|
|
:height="tableHeight"
|
|
|
class="v-table"
|
|
|
:summary-method="summary"
|
|
|
show-summary
|
|
|
:data="treeData"
|
|
|
style="width: 100%; margin-bottom: 20px"
|
|
|
row-key="id"
|
|
|
border
|
|
|
default-expand-all
|
|
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
|
|
>
|
|
|
<el-table-column
|
|
|
type="index"
|
|
|
align="center"
|
|
|
fixed="left"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
v-for="(item, index) of table"
|
|
|
:prop="item.prop"
|
|
|
:label="item.label"
|
|
|
:width="item.width"
|
|
|
:min-width="item.minWidth"
|
|
|
:fixed="item.fixed"
|
|
|
:align="item.align"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<span v-if="item.formatter">
|
|
|
{{ item.formatter(scope.row, scope.row, scope.row[item.prop]) }}
|
|
|
</span>
|
|
|
<span v-else>
|
|
|
{{
|
|
|
item.prop.indexOf(".") > -1
|
|
|
? scope.row[item.prop.split(".")[0]][item.prop.split(".")[1]]
|
|
|
: scope.row[item.prop]
|
|
|
}}
|
|
|
</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
fixed="right"
|
|
|
header-align="center"
|
|
|
label="操作"
|
|
|
width="240"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<div class="slot-btns">
|
|
|
<Button
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click="showEditor(scope.row)"
|
|
|
>
|
|
|
编辑
|
|
|
</Button>
|
|
|
<Button
|
|
|
v-if="scope.row.pid == 0"
|
|
|
style="margin-left: 10px"
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="info"
|
|
|
@click="showAdd(scope.row)"
|
|
|
>
|
|
|
下级
|
|
|
</Button>
|
|
|
<Poptip
|
|
|
:transfer="true"
|
|
|
style="margin-left: 10px"
|
|
|
confirm
|
|
|
placement="bottom"
|
|
|
title="确认要删除吗"
|
|
|
@on-ok="() => deleteTable(scope.row)"
|
|
|
>
|
|
|
<Button
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="error"
|
|
|
>删除
|
|
|
</Button>
|
|
|
</Poptip>
|
|
|
<Button
|
|
|
style="margin-left: 10px"
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click=""
|
|
|
>
|
|
|
资金申请
|
|
|
</Button>
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div v-if="!isTree">
|
|
|
<xy-table
|
|
|
ref="xyTable"
|
|
|
:object-span-method="objectSpanMethod"
|
|
|
:list="list"
|
|
|
:show-summary="true"
|
|
|
:summary-method="summary"
|
|
|
:table-item="table"
|
|
|
@delete="deleteTable"
|
|
|
@editor="showEditor"
|
|
|
>
|
|
|
<template v-slot:btns>
|
|
|
<el-table-column
|
|
|
fixed="right"
|
|
|
header-align="center"
|
|
|
label="操作"
|
|
|
width="200"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<div class="slot-btns">
|
|
|
<Button
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click="showEditor(scope.row)"
|
|
|
>
|
|
|
编辑
|
|
|
</Button>
|
|
|
<Button
|
|
|
v-if="scope.row.pid == 0"
|
|
|
style="margin-left: 10px"
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="info"
|
|
|
@click="showAdd(scope.row)"
|
|
|
>
|
|
|
下级
|
|
|
</Button>
|
|
|
<Poptip
|
|
|
:transfer="true"
|
|
|
style="margin-left: 10px"
|
|
|
confirm
|
|
|
placement="bottom"
|
|
|
title="确认要删除吗"
|
|
|
@on-ok="() => deleteTable(scope.row)"
|
|
|
>
|
|
|
<i-button
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="error"
|
|
|
>删除
|
|
|
</i-button>
|
|
|
</Poptip>
|
|
|
<Button
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click=""
|
|
|
>
|
|
|
资金申请
|
|
|
</Button>
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</template>
|
|
|
</xy-table>
|
|
|
|
|
|
<div style="display: flex; justify-content: flex-end">
|
|
|
<Page
|
|
|
:total="total"
|
|
|
show-elevator
|
|
|
show-sizer
|
|
|
@on-change="pageChange"
|
|
|
@on-page-size-change="pageSizeChange"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 新增-->
|
|
|
<xy-dialog
|
|
|
ref="addBudget"
|
|
|
:form="form"
|
|
|
:is-show.sync="isShowAdd"
|
|
|
:rules="rules"
|
|
|
title="新增计划"
|
|
|
type="form"
|
|
|
@submit="submit"
|
|
|
>
|
|
|
<template v-if="form.pid_info" v-slot:pid>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">隶属</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<div style="width: 300px">
|
|
|
{{ form.pid_info ? form.pid_info.name : "无" }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:name>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>项目名称
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="form.name"
|
|
|
clearable
|
|
|
placeholder="请填写项目名称"
|
|
|
style="width: 300px"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:year>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>项目所属年份
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-datePicker
|
|
|
v-model="form.year"
|
|
|
clearable
|
|
|
placeholder="请选择所属年份"
|
|
|
placement="bottom"
|
|
|
style="width: 300px"
|
|
|
type="year"
|
|
|
value-format="yyyy"
|
|
|
@change="changeYear"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:type>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>预算类型
|
|
|
</div>
|
|
|
<div class="xy-table-item-content" style="height:150px;overflow: scroll;">
|
|
|
<el-tree
|
|
|
ref="tree2"
|
|
|
style="width:300px"
|
|
|
default-expand-all
|
|
|
:default-checked-keys="checkArr"
|
|
|
:check-strictly="true"
|
|
|
:data="types"
|
|
|
show-checkbox
|
|
|
node-key="id"
|
|
|
highlight-current
|
|
|
:props="defaultProps"
|
|
|
@check="(data, node)=>{return getSelectedNodes(data,node,'tree2')}"
|
|
|
/>
|
|
|
<!-- <el-select
|
|
|
v-model="form.type"
|
|
|
clearable
|
|
|
placeholder="请选择预算类型"
|
|
|
style="width: 300px"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in types"
|
|
|
:label="item.value"
|
|
|
:value="item.id"
|
|
|
></el-option>
|
|
|
</el-select> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<template v-slot:department>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>科室
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-select
|
|
|
v-model="form.department"
|
|
|
placeholder="科室选择"
|
|
|
clearable
|
|
|
size="small"
|
|
|
style="width: 300px"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in departments"
|
|
|
:key="item.id"
|
|
|
:label="item.name"
|
|
|
:value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<template v-slot:plan_department_links>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>可用科室
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-checkbox-group v-model="form.plan_department_link_id">
|
|
|
<el-checkbox
|
|
|
v-for="dept in departments"
|
|
|
:key="dept.id"
|
|
|
:label="dept.id"
|
|
|
>{{ dept.name }}</el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:content>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>内容
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="form.content"
|
|
|
clearable
|
|
|
placeholder="请填写内容"
|
|
|
style="width: 300px"
|
|
|
type="textarea"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:money>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>金额
|
|
|
</div>
|
|
|
<div class="xy-table-item-content xy-table-item-price">
|
|
|
<el-input
|
|
|
v-model="form.money"
|
|
|
clearable
|
|
|
placeholder="请填写金额"
|
|
|
style="width: 300px"
|
|
|
@blur="moneyFormat('money')"
|
|
|
@focus="moneyRecover('money')"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:remark>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">备注</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="form.remark"
|
|
|
clearable
|
|
|
placeholder="请填写备注"
|
|
|
style="width: 300px"
|
|
|
type="textarea"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
</xy-dialog>
|
|
|
|
|
|
<!-- 编辑-->
|
|
|
<xy-dialog
|
|
|
ref="editorDialog"
|
|
|
:form="editorForm"
|
|
|
:is-show.sync="isShowEditor"
|
|
|
:rules="rules"
|
|
|
title="编辑"
|
|
|
type="form"
|
|
|
>
|
|
|
<template v-slot:name>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>项目名称
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="editorForm.name"
|
|
|
clearable
|
|
|
placeholder="请填写项目名称"
|
|
|
style="width: 300px"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:year>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>项目所属年份
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-datePicker
|
|
|
v-model="editorForm.year"
|
|
|
clearable
|
|
|
placeholder="请选择所属年份"
|
|
|
placement="bottom"
|
|
|
style="width: 300px"
|
|
|
type="year"
|
|
|
value-format="yyyy"
|
|
|
@change="changeYear"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:type>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>预算类型
|
|
|
</div>
|
|
|
<div class="xy-table-item-content" style="height:150px;overflow: scroll;">
|
|
|
<el-tree
|
|
|
ref="tree3"
|
|
|
style="width:300px"
|
|
|
default-expand-all
|
|
|
:default-checked-keys="checkArr"
|
|
|
:check-strictly="true"
|
|
|
:data="types"
|
|
|
show-checkbox
|
|
|
node-key="id"
|
|
|
highlight-current
|
|
|
:props="defaultProps"
|
|
|
@check="(data, node)=>{return getSelectedNodes(data,node,'tree3')}"
|
|
|
/>
|
|
|
<!-- <el-select
|
|
|
v-model="editorForm.type"
|
|
|
clearable
|
|
|
placeholder="请选择预算类型"
|
|
|
style="width: 300px"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in types"
|
|
|
:label="item.value"
|
|
|
:value="item.id"
|
|
|
></el-option>
|
|
|
</el-select> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:department>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>科室
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-cascader
|
|
|
:options="departments"
|
|
|
:props="{ checkStrictly: true, label: 'name', value: 'id' }"
|
|
|
:value="editorForm.department"
|
|
|
clearable
|
|
|
size="small"
|
|
|
style="width: 300px"
|
|
|
@change="(e) => (editorForm.department = e[e.length - 1] || '')"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<template v-slot:plan_department_links>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>可用科室
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-checkbox-group v-model="editorForm.plan_department_link_id">
|
|
|
<el-checkbox
|
|
|
v-for="dept in departments"
|
|
|
:key="dept.id"
|
|
|
:label="dept.id"
|
|
|
>{{ dept.name }}</el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<template v-slot:content>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>内容
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="editorForm.content"
|
|
|
autosize
|
|
|
clearable
|
|
|
placeholder="请填写内容"
|
|
|
style="width: 300px"
|
|
|
type="textarea"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:money>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>年初预算数
|
|
|
</div>
|
|
|
<div class="xy-table-item-content xy-table-item-price">
|
|
|
<el-input
|
|
|
v-model="editorForm.money"
|
|
|
clearable
|
|
|
placeholder="请填写年初预算数"
|
|
|
style="width: 300px"
|
|
|
@blur="moneyFormatEditor('money')"
|
|
|
@focus="moneyRecoverEditor('money')"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:update_money>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span
|
|
|
style="color: red; font-weight: 600; padding-right: 4px"
|
|
|
>*</span>调整后预算数
|
|
|
</div>
|
|
|
<div class="xy-table-item-content xy-table-item-price">
|
|
|
<el-input
|
|
|
v-model="editorForm.update_money"
|
|
|
clearable
|
|
|
placeholder="请填写调整后预算数"
|
|
|
style="width: 300px"
|
|
|
@blur="moneyFormatEditor('update_money')"
|
|
|
@focus="moneyRecoverEditor('update_money')"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:remark>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">备注</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="editorForm.remark"
|
|
|
autosize
|
|
|
clearable
|
|
|
placeholder="请填写备注"
|
|
|
style="width: 300px"
|
|
|
type="textarea"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:footerContent>
|
|
|
<Button type="primary" @click="editorTable">确定</Button>
|
|
|
</template>
|
|
|
</xy-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {
|
|
|
addBudget,
|
|
|
getBudget,
|
|
|
delBudget,
|
|
|
editorBudget,
|
|
|
detailBudget
|
|
|
} from '@/api/budget/budget'
|
|
|
import { listdeptNoAuth } from '@/api/system/department'
|
|
|
import { Message } from 'element-ui'
|
|
|
import { parseTime, moneyFormatter, moneyRecovery } from '@/utils'
|
|
|
import { getparameter } from '@/api/system/dictionary'
|
|
|
import {
|
|
|
index as getPlanType
|
|
|
} from '@/api/budget/plantype.js'
|
|
|
import { mergeTableRow } from '@/utils/mergeTableRow'
|
|
|
import {
|
|
|
buildTree
|
|
|
} from '@/utils'
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
tableHeight: 0,
|
|
|
isShowAdd: false,
|
|
|
types: [],
|
|
|
typesbefore: [],
|
|
|
checkArr: [],
|
|
|
defaultProps: {
|
|
|
children: 'children',
|
|
|
label: 'name'
|
|
|
},
|
|
|
treeData: [],
|
|
|
isTree: true,
|
|
|
typeYear: this.$moment().format('YYYY'),
|
|
|
form: {
|
|
|
pid: '0',
|
|
|
name: '',
|
|
|
year: this.$moment().format('YYYY'),
|
|
|
type: '',
|
|
|
department: '',
|
|
|
money: '',
|
|
|
content: '',
|
|
|
remark: '',
|
|
|
plan_department_link_id: [],
|
|
|
plan_department_links: [],
|
|
|
update_money: '',
|
|
|
pid_info: null
|
|
|
},
|
|
|
rules: {
|
|
|
name: [
|
|
|
{
|
|
|
required: true,
|
|
|
message: '必填项'
|
|
|
}
|
|
|
],
|
|
|
type: [
|
|
|
{
|
|
|
required: true,
|
|
|
message: '必选项'
|
|
|
}
|
|
|
],
|
|
|
year: [
|
|
|
{
|
|
|
required: true,
|
|
|
message: '必选项'
|
|
|
}
|
|
|
],
|
|
|
department: [
|
|
|
{
|
|
|
required: true,
|
|
|
message: '必选项'
|
|
|
}
|
|
|
],
|
|
|
money: [
|
|
|
{
|
|
|
required: true,
|
|
|
message: '必填项'
|
|
|
},
|
|
|
{
|
|
|
pattern: /^\d{1,3}(,\d{3})*(\.\d+)/,
|
|
|
message: '必须为数字',
|
|
|
trigger: 'change'
|
|
|
}
|
|
|
],
|
|
|
content: [
|
|
|
{
|
|
|
required: true,
|
|
|
message: '必填项'
|
|
|
}
|
|
|
]
|
|
|
},
|
|
|
list: [],
|
|
|
totalMoney: 0,
|
|
|
total: 0,
|
|
|
pageIndex: 1,
|
|
|
pageSize: 10,
|
|
|
table: [],
|
|
|
tableItem: [
|
|
|
{
|
|
|
label: '项目名称',
|
|
|
prop: 'name',
|
|
|
width: 200,
|
|
|
align: 'left',
|
|
|
sortable: false,
|
|
|
fixed: 'left'
|
|
|
},
|
|
|
{
|
|
|
label: '预算类型',
|
|
|
prop: 'type',
|
|
|
width: 115,
|
|
|
formatter: (cell, data, value) => {
|
|
|
const res = this.typesbefore.filter((item) => {
|
|
|
return item.id === value
|
|
|
})
|
|
|
return res[0]?.name || '未知'
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
label: '所属年份',
|
|
|
prop: 'year',
|
|
|
width: 105
|
|
|
},
|
|
|
{
|
|
|
label: '相关科室',
|
|
|
prop: 'plan_department.name',
|
|
|
width: 110
|
|
|
},
|
|
|
{
|
|
|
label: '年初预算金额(元)',
|
|
|
prop: 'money',
|
|
|
align: 'right',
|
|
|
width: 180,
|
|
|
formatter: (cell, data, value) => {
|
|
|
if (value == 0) return '--'
|
|
|
else return moneyFormatter(value)
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
label: '调整后预算金额(元)',
|
|
|
prop: 'update_money',
|
|
|
align: 'right',
|
|
|
width: 200,
|
|
|
formatter: (cell, data, value) => {
|
|
|
return moneyFormatter(value)
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
label: '创建信息',
|
|
|
prop: 'created_at',
|
|
|
width: 160,
|
|
|
formatter: (cell, data, value) => {
|
|
|
return parseTime(new Date(value), '{y}-{m}-{d}')
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
label: '描述',
|
|
|
minWidth: 300,
|
|
|
prop: 'content',
|
|
|
align: 'left',
|
|
|
sortable: false
|
|
|
}
|
|
|
],
|
|
|
select: {
|
|
|
page: 1,
|
|
|
year: '',
|
|
|
type: '',
|
|
|
department: '',
|
|
|
typeName: ''
|
|
|
},
|
|
|
departments: [], // 部门类型
|
|
|
|
|
|
// 编辑信息
|
|
|
isShowEditor: false,
|
|
|
editorForm: {
|
|
|
plan_department_link_id: []
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.table = this.tableItem
|
|
|
this.initLoad()
|
|
|
|
|
|
this.select.year = this.$moment().format('YYYY')
|
|
|
},
|
|
|
mounted() {
|
|
|
this.getTypes()
|
|
|
this.getDepartment()
|
|
|
this.getBudgets()
|
|
|
},
|
|
|
methods: {
|
|
|
// 合并行
|
|
|
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
const span = column['property'] + '-span'
|
|
|
if (row[span]) {
|
|
|
return row[span]
|
|
|
}
|
|
|
},
|
|
|
changeTree() {
|
|
|
if (!this.isTree) {
|
|
|
this.table = [
|
|
|
{
|
|
|
label: '隶属项目',
|
|
|
prop: 'pid_info_name',
|
|
|
width: 200,
|
|
|
align: 'left',
|
|
|
sortable: false,
|
|
|
fixed: 'left'
|
|
|
}
|
|
|
].concat(this.tableItem)
|
|
|
} else {
|
|
|
this.table = this.tableItem
|
|
|
}
|
|
|
this.getBudgets()
|
|
|
},
|
|
|
initLoad() {
|
|
|
var that = this
|
|
|
var clientHeight = document.documentElement.clientHeight
|
|
|
var lxHeader_height = 96.5 // 查询 头部
|
|
|
var paginationHeight = 37 // 分页的高度
|
|
|
var topHeight = 50 // 页面 头部
|
|
|
const tableHeight =
|
|
|
clientHeight - lxHeader_height - topHeight - paginationHeight - 20
|
|
|
that.tableHeight = tableHeight
|
|
|
},
|
|
|
showAdd(row) {
|
|
|
this.form.pid = '0'
|
|
|
this.form.pid_info = null
|
|
|
this.checkArr = []
|
|
|
this.$refs.tree1.setCheckedKeys([])
|
|
|
this.isShowAdd = true
|
|
|
this.getTypes()
|
|
|
this.getDepartment()
|
|
|
if (row != '') {
|
|
|
this.form.pid = row.id
|
|
|
this.form.pid_info = row
|
|
|
}
|
|
|
},
|
|
|
changeDepartments(v) {
|
|
|
console.log(v)
|
|
|
},
|
|
|
// 事务类型
|
|
|
changeYear(e) {
|
|
|
if (e) {
|
|
|
console.log('e', e)
|
|
|
this.typeYear = e
|
|
|
|
|
|
if (this.isShowAdd) {
|
|
|
this.form.year = e
|
|
|
}
|
|
|
if (this.isShowEditor) {
|
|
|
this.editorForm.year = e
|
|
|
}
|
|
|
this.getTypes()
|
|
|
}
|
|
|
},
|
|
|
changeType(e) {
|
|
|
if (!e) {
|
|
|
this.select.type = ''
|
|
|
this.select.typeName = ''
|
|
|
}
|
|
|
},
|
|
|
getSelectedNodes(data, node, ref) {
|
|
|
const ref_data = ref || 'tree'
|
|
|
this.$refs[ref_data].setCheckedKeys([])
|
|
|
this.checkArr = []
|
|
|
if (data.children && data.children.length > 0) {
|
|
|
this.$Message.warning('当前节点不可选择')
|
|
|
this.form.type = ''
|
|
|
this.select.type = ''
|
|
|
this.editorForm.type = ''
|
|
|
this.$refs[ref_data].setCheckedKeys([])
|
|
|
return
|
|
|
}
|
|
|
this.$refs[ref_data].setCheckedKeys([]) // 删除所有选中节点
|
|
|
this.$refs[ref_data].setCheckedNodes([data]) // 选中已选中节点
|
|
|
if (this.isShowAdd) {
|
|
|
this.form.type = data.id
|
|
|
} else if (this.isShowEditor) {
|
|
|
this.editorForm.type = data.id
|
|
|
} else {
|
|
|
this.select.type = data.id
|
|
|
this.select.typeName = data.name
|
|
|
}
|
|
|
console.log('checkarr', this.select.typeName, this.$refs[ref_data].getCheckedNodes())
|
|
|
this.$forceUpdate()
|
|
|
},
|
|
|
async getTypes() {
|
|
|
// const res = await getparameter({
|
|
|
// number: "money_way",
|
|
|
// });
|
|
|
|
|
|
const res = await getPlanType({
|
|
|
page_size: 999,
|
|
|
page: 1,
|
|
|
sort_name: 'sort',
|
|
|
sort_type: 'asc',
|
|
|
filter: [{
|
|
|
key: 'year',
|
|
|
op: 'eq',
|
|
|
value: this.typeYear
|
|
|
}]
|
|
|
})
|
|
|
this.typesbefore = res.data
|
|
|
this.types = buildTree(res.data)
|
|
|
},
|
|
|
|
|
|
moneyRecoverEditor(key) {
|
|
|
if (!/^\d{1,3}(,\d{3})*(\.\d+)/.test(this.editorForm[key])) {
|
|
|
return
|
|
|
}
|
|
|
this.editorForm[key] = moneyRecovery(this.editorForm[key])
|
|
|
},
|
|
|
moneyFormatEditor(key) {
|
|
|
if (!/^\d+(\.\d+)?$/.test(this.editorForm[key])) {
|
|
|
return
|
|
|
}
|
|
|
this.editorForm[key] = moneyFormatter(this.editorForm[key])
|
|
|
},
|
|
|
moneyRecover(key) {
|
|
|
if (!/^\d{1,3}(,\d{3})*(\.\d+)/.test(this.form[key])) {
|
|
|
return
|
|
|
}
|
|
|
this.form[key] = moneyRecovery(this.form[key])
|
|
|
},
|
|
|
moneyFormat(key) {
|
|
|
if (!/^\d+(\.\d+)?$/.test(this.form[key])) {
|
|
|
return
|
|
|
}
|
|
|
this.form[key] = moneyFormatter(this.form[key])
|
|
|
},
|
|
|
// 合计
|
|
|
summary(param) {
|
|
|
this.$nextTick(() => {
|
|
|
if (!this.isTree) this.$refs['xyTable'].$children[0].doLayout()
|
|
|
else this.$refs['treeTable'].doLayout()
|
|
|
})
|
|
|
const { columns, data } = param
|
|
|
const sums = []
|
|
|
columns.map((column, index) => {
|
|
|
if (index === 0) {
|
|
|
sums[index] = '总计'
|
|
|
return
|
|
|
}
|
|
|
if (column.property === 'money') {
|
|
|
sums[index] = moneyFormatter(this.totalMoney)
|
|
|
return
|
|
|
}
|
|
|
// const values = data.map(item => Number(item[column.property]));
|
|
|
// if (!values.every(value => isNaN(value)) && (column.property === 'money' || column.property === 'plan_price'|| column.property === 'fund_log_total')) {
|
|
|
//
|
|
|
// sums[index] = sums[index].toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,')
|
|
|
// } else {
|
|
|
// sums[index] = '';
|
|
|
// }
|
|
|
})
|
|
|
return sums
|
|
|
},
|
|
|
|
|
|
// 翻页
|
|
|
pageChange(e) {
|
|
|
this.pageIndex = e
|
|
|
this.getBudgets()
|
|
|
},
|
|
|
pageSizeChange(e) {
|
|
|
this.pageSize = e
|
|
|
this.pageIndex = 1
|
|
|
this.getBudgets()
|
|
|
},
|
|
|
// 获取科室
|
|
|
getDepartment() {
|
|
|
listdeptNoAuth().then((res) => {
|
|
|
this.departments = res
|
|
|
})
|
|
|
},
|
|
|
// 查询计划列表
|
|
|
getBudgets() {
|
|
|
getBudget({
|
|
|
page_size: this.pageSize,
|
|
|
page: this.pageIndex,
|
|
|
year: this.select.year,
|
|
|
type: this.select.type,
|
|
|
plan_department_id: this.select.department,
|
|
|
is_tree: this.isTree ? 1 : '',
|
|
|
top_pid: !this.isTree ? 1 : ''
|
|
|
}).then((res) => {
|
|
|
if (this.isTree) this.treeData = res.list
|
|
|
else {
|
|
|
for (var m of res.list.data) {
|
|
|
m.pid_info_name = m.pid_info?.name
|
|
|
}
|
|
|
this.list = mergeTableRow({
|
|
|
data: res.list.data,
|
|
|
mergeColNames: ['pid_info_name'], // 需要合并的列,默认合并列相同的数据
|
|
|
firstMergeColNames: ['pid_info_name'], // 受影响的列,只合并以firstMerge为首的同类型数据
|
|
|
firstMerge: 'pid_info_name' // 以哪列为基础进行合并,一般为第一列
|
|
|
})
|
|
|
this.total = res.list.total
|
|
|
}
|
|
|
this.totalMoney = res.total_money
|
|
|
})
|
|
|
},
|
|
|
// 新增提交
|
|
|
submit() {
|
|
|
const plan_department_links = []
|
|
|
if (this.form.plan_department_link_id.length == 0) {
|
|
|
Message({
|
|
|
message: '请选择可用部门',
|
|
|
type: 'error'
|
|
|
})
|
|
|
return false
|
|
|
}
|
|
|
|
|
|
this.form.plan_department_link_id.map((item) => {
|
|
|
plan_department_links.push({
|
|
|
department_id: item
|
|
|
})
|
|
|
})
|
|
|
|
|
|
addBudget({
|
|
|
name: this.form.name,
|
|
|
type: this.form.type,
|
|
|
year: this.form.year,
|
|
|
content: this.form.content,
|
|
|
money: moneyRecovery(this.form.money),
|
|
|
plan_department_id: this.form.department,
|
|
|
plan_department_links: plan_department_links,
|
|
|
remark: this.form.remark,
|
|
|
pid: this.form.pid
|
|
|
}).then((res) => {
|
|
|
Message({
|
|
|
message: '操作成功',
|
|
|
type: 'success'
|
|
|
})
|
|
|
this.isShowAdd = false
|
|
|
|
|
|
this.$refs['addBudget'].reset()
|
|
|
this.getBudgets()
|
|
|
})
|
|
|
},
|
|
|
// 删除
|
|
|
deleteTable(e) {
|
|
|
delBudget({
|
|
|
id: e.id
|
|
|
}).then((res) => {
|
|
|
Message({
|
|
|
message: '操作成功',
|
|
|
type: 'success'
|
|
|
})
|
|
|
this.getBudgets()
|
|
|
})
|
|
|
},
|
|
|
|
|
|
// 修改
|
|
|
editorTable() {
|
|
|
this.$refs['editorDialog'].$refs['elForm']
|
|
|
.validate()
|
|
|
.then((res) => {
|
|
|
if (this.editorForm.plan_department_link_id.length == 0) {
|
|
|
Message({
|
|
|
message: '请选择可用部门',
|
|
|
type: 'error'
|
|
|
})
|
|
|
return false
|
|
|
}
|
|
|
const plan_department_links = []
|
|
|
this.editorForm.plan_department_link_id.map((item) => {
|
|
|
plan_department_links.push({
|
|
|
department_id: item
|
|
|
})
|
|
|
})
|
|
|
editorBudget({
|
|
|
id: this.editorForm.id,
|
|
|
name: this.editorForm.name,
|
|
|
type: this.editorForm.type,
|
|
|
year: this.editorForm.year,
|
|
|
content: this.editorForm.content,
|
|
|
money: moneyRecovery(this.editorForm.money),
|
|
|
update_money: moneyRecovery(this.editorForm.update_money),
|
|
|
remark: this.editorForm.remark,
|
|
|
plan_department_id: this.editorForm.department,
|
|
|
plan_department_links: plan_department_links
|
|
|
}).then((res) => {
|
|
|
this.isShowEditor = false
|
|
|
Message({
|
|
|
message: '操作成功',
|
|
|
type: 'success'
|
|
|
})
|
|
|
this.getBudgets()
|
|
|
})
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
this.$message({
|
|
|
message: '请填写完整信息',
|
|
|
type: 'error'
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
showEditor(row) {
|
|
|
this.checkArr = []
|
|
|
this.$refs.tree2.setCheckedKeys([])
|
|
|
this.getDepartment()
|
|
|
detailBudget({
|
|
|
id: row.id
|
|
|
}).then((res) => {
|
|
|
this.editorForm = {
|
|
|
id: res.id,
|
|
|
name: res.name,
|
|
|
type: res.type,
|
|
|
department: res.plan_department_id,
|
|
|
money: moneyFormatter(res.money),
|
|
|
update_money: moneyFormatter(res.update_money),
|
|
|
year: res.year,
|
|
|
content: res.content,
|
|
|
remark: res.remark,
|
|
|
plan_department_links: res.plan_department_links,
|
|
|
pid: res.pid
|
|
|
}
|
|
|
const ids = []
|
|
|
res.plan_department_links.map((item) => {
|
|
|
ids.push(item.department_id)
|
|
|
})
|
|
|
// this.editorForm.plan_department_link_id = ids;
|
|
|
this.$set(this.editorForm, 'plan_department_link_id', ids)
|
|
|
this.checkArr = [res.type]
|
|
|
this.typeYear = res.year
|
|
|
this.getTypes()
|
|
|
this.isShowEditor = true
|
|
|
console.log(this.editorForm)
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.xy-table-item-label {
|
|
|
width: 160px;
|
|
|
}
|
|
|
|
|
|
.xy-table-item-price {
|
|
|
position: relative;
|
|
|
|
|
|
&::after {
|
|
|
z-index: 1;
|
|
|
position: absolute;
|
|
|
right: 0;
|
|
|
top: 0;
|
|
|
content: "(元)";
|
|
|
}
|
|
|
|
|
|
::v-deep .el-input__clear {
|
|
|
position: relative;
|
|
|
right: 30px;
|
|
|
z-index: 2;
|
|
|
}
|
|
|
}
|
|
|
::v-deep .el-checkbox__input .el-checkbox__inner {
|
|
|
border-radius: 50%;
|
|
|
}
|
|
|
</style>
|