<template>
|
<div class="app-container">
|
<el-form
|
class="opo-query-form"
|
:model="queryParams"
|
ref="queryForm"
|
:inline="true"
|
v-show="showSearch"
|
label-width="90px"
|
>
|
<el-form-item label="接收医院" prop="hospitalno">
|
<el-select
|
v-model="queryParams.hospitalno"
|
placeholder="请选择接收医院"
|
clearable
|
filterable
|
size="small"
|
style="width: 200px"
|
>
|
<el-option
|
v-for="item in organizationList"
|
:key="item.organizationid"
|
:label="item.organizationname"
|
:value="item.organizationid"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="捐献者" prop="donorname">
|
<el-input
|
v-model="queryParams.donorname"
|
placeholder="请输入捐献者姓名"
|
clearable
|
size="small"
|
@keyup.enter.native="handleQuery"
|
/>
|
</el-form-item>
|
<el-form-item label="报告日期">
|
<el-date-picker
|
v-model="donatetimeRange"
|
type="daterange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
value-format="yyyy-MM-dd"
|
clearable
|
size="small"
|
@change="handleDonatetimeChange"
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
type="primary"
|
icon="el-icon-search"
|
size="mini"
|
@click="handleQuery"
|
>搜索</el-button
|
>
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
|
>重置</el-button
|
>
|
</el-form-item>
|
</el-form>
|
|
<el-row :gutter="10" class="mb8">
|
<right-toolbar
|
:showSearch.sync="showSearch"
|
@queryTable="getList"
|
></right-toolbar>
|
</el-row>
|
|
<el-table v-loading="loading" border :data="organfeeList">
|
<el-table-column type="index" label="序号" width="55" align="center" />
|
<el-table-column
|
prop="donatetime"
|
label="报告日期"
|
width="120"
|
align="center"
|
>
|
<template slot-scope="scope">
|
<span>{{ parseTime(scope.row.donatetime, "{y}-{m}-{d}") }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="donorname"
|
label="捐献者"
|
width="120"
|
align="center"
|
/>
|
<el-table-column
|
prop="organname"
|
label="器官名称"
|
width="120"
|
align="center"
|
/>
|
<el-table-column
|
prop="caseno"
|
label="器官分配编号"
|
align="center"
|
show-overflow-tooltip
|
/>
|
<el-table-column prop="name" label="受体姓氏" width="120" align="center" />
|
<el-table-column label="移植日期" width="120" align="center">
|
<template slot-scope="scope">
|
<span>{{ parseTime(scope.row.receiveTime, "{y}-{m}-{d}") }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="器官状态" width="120" align="center">
|
<template slot-scope="scope">
|
<span>{{ selectOrganState(scope.row.organState) }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="organcharge"
|
label="应收金额"
|
width="120"
|
align="center"
|
/>
|
<el-table-column
|
prop="amount"
|
label="实收金额"
|
width="120"
|
align="center"
|
/>
|
<el-table-column
|
prop="organchargedesc"
|
label="备注"
|
align="center"
|
show-overflow-tooltip
|
/>
|
<el-table-column
|
label="操作"
|
width="160"
|
align="center"
|
fixed="right"
|
>
|
<template slot-scope="scope">
|
<el-button
|
type="text"
|
icon="el-icon-edit"
|
@click="handleEdit(scope.row)"
|
v-hasPermi="['project:donorchargeorgan:edit']"
|
>修改</el-button
|
>
|
<el-button
|
v-if="isUncharged(scope.row)"
|
type="text"
|
icon="el-icon-check"
|
@click="handleCharge(scope.row)"
|
v-hasPermi="['project:donorchargeorgan:edit']"
|
>已收费</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
:page.sync="queryParams.pageNum"
|
:limit.sync="queryParams.pageSize"
|
@pagination="getList"
|
/>
|
|
<!-- 修改器官状态、备注 -->
|
<el-dialog
|
title="修改器官信息"
|
:visible.sync="editOpen"
|
width="500px"
|
append-to-body
|
:close-on-click-modal="false"
|
>
|
<el-form ref="editForm" :model="editForm" label-width="90px">
|
<el-form-item label="器官状态" prop="organState">
|
<el-select
|
v-model="editForm.organState"
|
placeholder="请选择器官状态"
|
style="width: 100%"
|
>
|
<el-option
|
v-for="item in organStateList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="备注" prop="organchargedesc">
|
<el-input
|
v-model="editForm.organchargedesc"
|
type="textarea"
|
:rows="3"
|
maxlength="200"
|
show-word-limit
|
placeholder="请输入备注"
|
/>
|
</el-form-item>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="editOpen = false">取 消</el-button>
|
<el-button type="primary" :loading="editLoading" @click="submitEdit"
|
>确 定</el-button
|
>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
listDonorchargeorgan,
|
updateDonorchargeorgan
|
} from "@/api/project/donorcharge";
|
import { listOrganization } from "@/api/project/organization";
|
|
export default {
|
name: "Organfee",
|
data() {
|
return {
|
// 遮罩层
|
loading: false,
|
// 显示搜索条件
|
showSearch: true,
|
// 总条数
|
total: 0,
|
// 器官费用列表
|
organfeeList: [],
|
// 接收医院(机构)下拉数据
|
organizationList: [],
|
// 报告日期区间
|
donatetimeRange: [],
|
// 器官状态(对应 service_donorchargeorgan.organ_state)
|
organStateList: [
|
{ value: "1", label: "移植" },
|
{ value: "2", label: "失功" },
|
{ value: "3", label: "库存" },
|
{ value: "4", label: "已移植" },
|
{ value: "5", label: "弃用" },
|
{ value: "6", label: "直系免除" },
|
{ value: "7", label: "不良事件" }
|
],
|
// 修改弹窗
|
editOpen: false,
|
editLoading: false,
|
editForm: {
|
id: null,
|
organState: null,
|
organchargedesc: null
|
},
|
// 查询参数
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
hospitalno: null,
|
donorname: null,
|
paymentid: null,
|
// false:走 queryListBypaymentidIsNull,即未收齐费用的器官
|
paymentidIsNotNull: false,
|
starttime: null,
|
endtime: null,
|
selectAll: true
|
}
|
};
|
},
|
created() {
|
this.getOrganizationList();
|
this.getList();
|
},
|
methods: {
|
/** 查询器官费用列表 */
|
getList() {
|
this.loading = true;
|
listDonorchargeorgan(this.queryParams)
|
.then(response => {
|
this.organfeeList = response.rows;
|
this.total = response.total;
|
})
|
.finally(() => {
|
this.loading = false;
|
});
|
},
|
/** 是否未收费:organ_charge_state 为 0 或为空 */
|
isUncharged(row) {
|
const state = row.organChargeState;
|
return (
|
state === null || state === undefined || state === "" || String(state) === "0"
|
);
|
},
|
/** 确认已收费:organ_charge_state 置为 1 */
|
handleCharge(row) {
|
this.$modal
|
.confirm('确认“' + (row.donorname || "") + "”的器官费用已收取?")
|
.then(() => {
|
return updateDonorchargeorgan({
|
id: row.id,
|
organChargeState: "1"
|
});
|
})
|
.then(() => {
|
this.$modal.msgSuccess("操作成功");
|
this.getList();
|
})
|
.catch(() => {});
|
},
|
/** 打开修改弹窗(器官状态、备注) */
|
handleEdit(row) {
|
this.editForm = {
|
id: row.id,
|
organState:
|
row.organState === null || row.organState === undefined
|
? null
|
: String(row.organState),
|
organchargedesc: row.organchargedesc || ""
|
};
|
this.editOpen = true;
|
},
|
/** 提交修改 */
|
submitEdit() {
|
if (!this.editForm.organState) {
|
this.$modal.msgWarning("请选择器官状态");
|
return;
|
}
|
this.editLoading = true;
|
updateDonorchargeorgan(this.editForm)
|
.then(() => {
|
this.$modal.msgSuccess("修改成功");
|
this.editOpen = false;
|
this.getList();
|
})
|
.finally(() => {
|
this.editLoading = false;
|
});
|
},
|
/** 查询接收医院(机构)下拉数据 */
|
getOrganizationList() {
|
listOrganization({ pageNum: 1, pageSize: 100000, organizationtype: 4 })
|
.then(response => {
|
this.organizationList = response.rows || [];
|
})
|
.catch(() => {
|
this.organizationList = [];
|
});
|
},
|
/** 搜索按钮操作 */
|
handleQuery() {
|
this.queryParams.pageNum = 1;
|
this.getList();
|
},
|
/** 重置按钮操作 */
|
resetQuery() {
|
this.donatetimeRange = [];
|
this.queryParams.hospitalno = null;
|
this.queryParams.donorname = null;
|
this.queryParams.starttime = null;
|
this.queryParams.endtime = null;
|
this.queryParams.pageNum = 1;
|
this.getList();
|
},
|
/** 报告日期区间 -> 查询参数,未选择时传 null,避免后端拼出 donatetime >= '' */
|
handleDonatetimeChange(val) {
|
if (val && val.length === 2) {
|
this.queryParams.starttime = val[0] + " 00:00:00";
|
this.queryParams.endtime = val[1] + " 23:59:59";
|
} else {
|
this.queryParams.starttime = null;
|
this.queryParams.endtime = null;
|
}
|
this.queryParams.pageNum = 1;
|
},
|
/** 器官状态值转文本 */
|
selectOrganState(value) {
|
if (value === null || value === undefined || value === "") {
|
return "";
|
}
|
const item = this.organStateList.find(
|
state => String(state.value) === String(value)
|
);
|
return item ? item.label : value;
|
}
|
}
|
};
|
</script>
|