xiaoy
/
contract-business-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2023-10-8

Browse Source
master
xy 3 years ago
parent d629eade26
commit 4b57e0a8d5
2 changed files with 288 additions and 288 deletions
Show Stats Download Patch File Download Diff File

4
src/views/dashboard/index.vue
Unescape View File

@ -177,7 +177,7 @@
> >
<template slot-scope="scope"> <template slot-scope="scope">
<router-link <router-link
:to="`/statisticalReport/budgetProgress?departmentId=${scope.row.department_id}`" :to="`/statisticalReport/budgetProgress?departmentId=${scope.row.department_id}&type=${sitem[0].type}`"
>查看 >查看
</router-link> </router-link>
</template> </template>
@ -234,7 +234,7 @@
> >
<template slot-scope="scope"> <template slot-scope="scope">
<router-link <router-link
:to="`/statisticalReport/budgetProgress?departmentId=${scope.row.department_id}`" :to="`/statisticalReport/budgetProgress?departmentId=${scope.row.department_id}&type=${sitem[1].type}`"
>查看 >查看
</router-link> </router-link>
</template> </template>

572
src/views/statisticalReport/budgetProgress.vue
Unescape View File

@ -1,30 +1,30 @@
<template> <template>
<div style="padding: 0 20px;"> <div style="padding: 0 20px;">
<lx-header icon="md-apps" text="预算进展情况" style="margin-bottom: 10px; border: 0px; margin-top: 15px"> <lx-header icon="md-apps" text="预算进展情况" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<div slot="content"></div> <div slot="content"></div>
<slot> <slot>
<span style="padding: 0 6px;word-break: keep-all;">年份</span> <span style="padding: 0 6px;word-break: keep-all;">年份</span>
<span> <span>
<DatePicker :value="select.year" placeholder="请选择年份" type="year" placement="bottom-start" style="width: 160px" <DatePicker :value="select.year" placeholder="请选择年份" type="year" placement="bottom-start" style="width: 160px"
@on-change="(e)=>select.year = e"></DatePicker> @on-change="(e)=>select.year = e"></DatePicker>
</span> </span>
<span style="padding: 0 6px;word-break: keep-all;">预算类型</span> <span style="padding: 0 6px;word-break: keep-all;">预算类型</span>
<span> <span>
<el-select size="small" clearable v-model="select.type" placeholder="请选择预算类型" type="date" <el-select size="small" clearable v-model="select.type" placeholder="请选择预算类型" type="date"
style="width: 160px"> style="width: 160px">
<el-option v-for="item in type" :value="item.id" :key="item.id" :label="item.value"></el-option> <el-option v-for="item in type" :value="item.id" :key="item.id" :label="item.value"></el-option>
</el-select> </el-select>
</span> </span>
<span style="padding: 0 6px;"> <span style="padding: 0 6px;">
科室 科室
</span> </span>
<span> <span>
<el-select placeholder="科室选择" clearable size="small" v-model="select.department" style="width: 160px;"> <el-select placeholder="科室选择" clearable size="small" v-model="select.department" style="width: 160px;">
<el-option v-for="item in departments" :label="item.name" :value="item.id" :key="item.id"> <el-option v-for="item in departments" :label="item.name" :value="item.id" :key="item.id">
</el-option> </el-option>
</el-select> </el-select>
</span> </span>
<span style="padding: 0 6px;word-break: keep-all;">付款日期</span> <span style="padding: 0 6px;word-break: keep-all;">付款日期</span>
@ -32,273 +32,273 @@
<DatePicker v-model="select.showDatePicker" clearable placeholder="请选择日期" placement="bottom-start" <DatePicker v-model="select.showDatePicker" clearable placeholder="请选择日期" placement="bottom-start"
style="width: 200px" type="daterange" @on-change="datePick"></DatePicker> style="width: 200px" type="daterange" @on-change="datePick"></DatePicker>
</span> </span>
<Button type="primary" style="margin-left: 10px" ghost <Button type="primary" style="margin-left: 10px" ghost
@click="select = {pageIndex:1,year:'',type:'',department:''}">重置</Button> @click="select = {pageIndex:1,year:'',type:'',department:''}">重置</Button>
<Button type="primary" style="margin-left: 10px" @click="getPlanProgress">查询</Button> <Button type="primary" style="margin-left: 10px" @click="getPlanProgress">查询</Button>
</slot> </slot>
</lx-header> </lx-header>
<xy-table ref="xyTable" :objectSpanMethod="objectSpanMethod" :table-item="table" :list="list" :show-summary="true" :summary-method="summary"> <xy-table ref="xyTable" :objectSpanMethod="objectSpanMethod" :table-item="table" :list="list" :show-summary="true" :summary-method="summary">
<template v-slot:btns> <template v-slot:btns>
<div></div> <div></div>
</template> </template>
</xy-table> </xy-table>
<div style="display: flex;justify-content: flex-end;"> <div style="display: flex;justify-content: flex-end;">
<Page :total="total" show-elevator @on-change="pageChange" /> <Page :total="total" show-elevator @on-change="pageChange" />
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import {
getProgress getProgress
} from "@/api/budget/budget" } from "@/api/budget/budget"
import { import {
listdeptNoAuth listdeptNoAuth
} from "@/api/system/department"; } from "@/api/system/department";
import { import {
getparameter getparameter
} from "@/api/system/dictionary"; } from "@/api/system/dictionary";
import { import {
moneyFormatter moneyFormatter
} from "@/utils"; } from "@/utils";
import { import {
mergeTableRow mergeTableRow
} from "@/utils/mergeTableRow" } from "@/utils/mergeTableRow"
export default { export default {
data() { data() {
return { return {
type: [], //预算类型 type: [], //预算类型
departments: [], departments: [],
select: { select: {
pageIndex: 1, pageIndex: 1,
year: '', year: '',
type: '', type: '',
department: '', department: '',
showDatePicker:'', showDatePicker:'',
start_created_at:'', start_created_at:'',
end_created_at:'' end_created_at:''
}, },
rateTotal: '0%', rateTotal: '0%',
moneyTotal: 0, moneyTotal: 0,
updateMoneyTotal: 0, updateMoneyTotal: 0,
useMoneyTotal: 0, useMoneyTotal: 0,
total: 0, total: 0,
list: [], list: [],
table: [{ table: [{
label: "隶属项目", label: "隶属项目",
prop: 'pid_info_name', prop: 'pid_info_name',
width: 200, width: 200,
align: 'left', align: 'left',
sortable: false, sortable: false,
fixed: 'left' fixed: 'left'
}, },
{ {
prop: 'name', prop: 'name',
label: '项目名称', label: '项目名称',
width: 200, width: 200,
align: 'left', align: 'left',
fixed: 'left' fixed: 'left'
}, },
{ {
prop: 'type', prop: 'type',
label: '预算类型', label: '预算类型',
width: 120, width: 120,
formatter: (cell, data, value) => { formatter: (cell, data, value) => {
let res = this.type.filter(item => { let res = this.type.filter(item => {
return item.id === value return item.id === value
}) })
return res[0]?.value || '未知' return res[0]?.value || '未知'
} }
}, },
{ {
prop: 'year', prop: 'year',
label: '所属年份', label: '所属年份',
width: 160 width: 160
}, },
{ {
prop: 'plan_department.name', prop: 'plan_department.name',
label: "相关科室", label: "相关科室",
width: 180 width: 180
}, },
{ {
prop: 'content', prop: 'content',
label: '描述', label: '描述',
align: 'left', align: 'left',
minWidth: 300 minWidth: 300
}, },
{ {
prop: 'money', prop: 'money',
width: 180, width: 180,
label: '年初预算数(元)', label: '年初预算数(元)',
align: 'right' align: 'right'
}, },
{ {
prop: 'update_money', prop: 'update_money',
width: 180, width: 180,
label: '调整后预算数(元)', label: '调整后预算数(元)',
align: 'right' align: 'right'
}, },
{ {
prop: 'use_money_total', prop: 'use_money_total',
label: '使用金额', label: '使用金额',
align: 'right', align: 'right',
width: 180 width: 180
}, },
{ {
prop: 'rate', prop: 'rate',
label: '进展率', label: '进展率',
width: 200, width: 200,
fixed: "right", fixed: "right",
customFn: (row) => { customFn: (row) => {
let m2 = row.update_money; let m2 = row.update_money;
let m1 = row.money; let m1 = row.money;
let m3 = row.use_money_total; let m3 = row.use_money_total;
let per = 0; let per = 0;
if (m2 != 0) { if (m2 != 0) {
per = ((m3 / m2) * 100).toFixed(2); per = ((m3 / m2) * 100).toFixed(2);
} else if (m1 != 0) { } else if (m1 != 0) {
per = ((m3 / m1) * 100).toFixed(2); per = ((m3 / m1) * 100).toFixed(2);
} }
return ( < div > return ( < div >
<el-progress percentage = { <el-progress percentage = {
Number(per) Number(per)
} > </el-progress> </div > } > </el-progress> </div >
) )
} }
}, },
] ]
} }
}, },
methods: { //合并行, methods: { //合并行,
//日期选择 //日期选择
datePick(e) { datePick(e) {
this.select.start_created_at = e[0] this.select.start_created_at = e[0]
this.select.end_created_at = e[1] this.select.end_created_at = e[1]
}, },
objectSpanMethod({ objectSpanMethod({
row, row,
column, column,
rowIndex, rowIndex,
columnIndex columnIndex
}) { }) {
const span = column['property'] + '-span' const span = column['property'] + '-span'
if (row[span]) { if (row[span]) {
return row[span] return row[span]
} }
}, },
toper(m2, m1, m3) { toper(m2, m1, m3) {
let per = 0; let per = 0;
if (m2 != 0) { if (m2 != 0) {
per = ((m3 / m2) * 100).toFixed(2); per = ((m3 / m2) * 100).toFixed(2);
} else if (m1 != 0) { } else if (m1 != 0) {
per = ((m3 / m1) * 100).toFixed(2); per = ((m3 / m1) * 100).toFixed(2);
} }
return per; return per;
}, },
//统计 //统计
summary(param) { summary(param) {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['xyTable'].$children[0].doLayout() this.$refs['xyTable'].$children[0].doLayout()
}) })
const { const {
columns, columns,
data data
} = param } = param
const sums = [] const sums = []
columns.map((column, index) => { columns.map((column, index) => {
if (index === 0) { if (index === 0) {
sums[index] = '总计' sums[index] = '总计'
return return
} }
if (column.property === 'rate') { if (column.property === 'rate') {
sums[index] = this.rateTotal + "%"; sums[index] = this.rateTotal + "%";
return return
} }
if (column.property === 'use_money_total') { if (column.property === 'use_money_total') {
sums[index] = moneyFormatter(this.useMoneyTotal) sums[index] = moneyFormatter(this.useMoneyTotal)
} }
if (column.property === 'money') { if (column.property === 'money') {
sums[index] = moneyFormatter(this.moneyTotal) sums[index] = moneyFormatter(this.moneyTotal)
} }
if (column.property === 'update_money') { if (column.property === 'update_money') {
sums[index] = moneyFormatter(this.updateMoneyTotal) sums[index] = moneyFormatter(this.updateMoneyTotal)
} }
}) })
return sums return sums
}, },
async getType() { async getType() {
const res = await getparameter({ const res = await getparameter({
number: 'money_way' number: 'money_way'
}) })
this.type = res.detail this.type = res.detail
}, },
//翻页 //翻页
pageChange(e) { pageChange(e) {
this.select.pageIndex = e this.select.pageIndex = e
this.getPlanProgress() this.getPlanProgress()
}, },
//获取科室 //获取科室
getDepartment() { getDepartment() {
listdeptNoAuth().then(res => { listdeptNoAuth().then(res => {
this.departments = res this.departments = res
}) })
}, },
async getPlanProgress() { async getPlanProgress() {
const res = await getProgress({ const res = await getProgress({
page_size: 10, page_size: 10,
page: this.select.pageIndex, page: this.select.pageIndex,
year: this.select.year, year: this.select.year,
type: this.select.type, type: this.select.type,
plan_department_id: this.select.department, plan_department_id: this.select.department,
top_pid: 1, top_pid: 1,
...this.select ...this.select
}) })
for (var m of res.list.data) { for (var m of res.list.data) {
m.pid_info_name = m.pid_info?.name m.pid_info_name = m.pid_info?.name
} }
this.list = this.list =
mergeTableRow({ mergeTableRow({
data: res.list.data, data: res.list.data,
mergeColNames: ["pid_info_name"], // 需要合并的列，默认合并列相同的数据 mergeColNames: ["pid_info_name"], // 需要合并的列，默认合并列相同的数据
firstMergeColNames: ["pid_info_name"], // 受影响的列，只合并以firstMerge为首的同类型数据 firstMergeColNames: ["pid_info_name"], // 受影响的列，只合并以firstMerge为首的同类型数据
firstMerge: 'pid_info_name' // 以哪列为基础进行合并，一般为第一列 firstMerge: 'pid_info_name' // 以哪列为基础进行合并，一般为第一列
}) })
this.total = res.list.total this.total = res.list.total
this.useMoneyTotal = res.use_money_total this.useMoneyTotal = res.use_money_total
this.moneyTotal = res.money; this.moneyTotal = res.money;
this.updateMoneyTotal = res.update_money; this.updateMoneyTotal = res.update_money;
this.rateTotal = this.toper(this.updateMoneyTotal, this.moneyTotal, this.useMoneyTotal) this.rateTotal = this.toper(this.updateMoneyTotal, this.moneyTotal, this.useMoneyTotal)
console.log(res) console.log(res)
} }
}, },
created() { created() {
this.select.year = this.$moment().format('YYYY'); this.select.year = this.$moment().format('YYYY');
}, },
async mounted() { async mounted() {
await this.getType() await this.getType()
await this.getDepartment() await this.getDepartment()
this.select.department = Number(this.$route.query.departmentId) || '' this.select.department = Number(this.$route.query.departmentId) || ''
this.select.type = Number(this.$route.query.typeId) || '' this.select.type = Number(this.$route.query.type) || ''
await this.getPlanProgress() await this.getPlanProgress()
} }
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
</style> </style>

Write Preview
Loading…
Cancel
Save