<!-- -->
|
<template>
|
<div class="app-container">
|
<el-col :span="24" v-if="showType == 'list'">
|
<el-card shadow="never">
|
<el-form :model="queryParams" ref="queryForm" :inline="true">
|
<el-form-item label="姓名" prop="name">
|
<el-input
|
v-model="queryParams.name"
|
placeholder="请输入姓名"
|
clearable
|
size="small"
|
@keyup.enter.native="handleQuery"
|
/>
|
</el-form-item>
|
<el-form-item label="捐献进度" prop="recordstate">
|
<el-select
|
v-model="queryParams.recordstate"
|
placeholder="请选择当前进度"
|
clearable
|
size="small"
|
>
|
<el-option
|
v-for="dict in dict.type.sys_DonationStatus"
|
:key="dict.value"
|
:label="dict.label"
|
:value="dict.value"
|
/>
|
</el-select>
|
</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-table
|
v-loading="loading"
|
style="width: 1240px"
|
fit
|
highlight-current-row
|
header-align
|
border
|
:data="donationCaseTableData"
|
>
|
<el-table-column
|
label="案例时间"
|
align="center"
|
prop="reporttime"
|
width="150"
|
>
|
<template slot-scope="scope">
|
<span>{{ parseTime(scope.row.reporttime, "{y}-{m}-{d}") }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="姓名"
|
width="120"
|
align="center"
|
prop="name"
|
/>
|
<el-table-column label="年龄" width="120" align="center" prop="age" />
|
<el-table-column label="性别" width="120" align="center" prop="sex">
|
<template slot-scope="scope">
|
<dict-tag
|
:options="dict.type.sys_user_sex"
|
:value="scope.row.sex"
|
/>
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="专职人员"
|
align="center"
|
prop="reportername"
|
width="100"
|
/>
|
<el-table-column
|
label="业务组"
|
align="center"
|
prop="treatmenthospitalname"
|
/>
|
<el-table-column label="捐献进度" align="center" prop="recordstate">
|
<template slot-scope="scope">
|
<dict-tag
|
:options="dict.type.sys_donornode"
|
:value="scope.row.workflow"
|
/>
|
</template>
|
</el-table-column>
|
|
<el-table-column
|
label="操作"
|
align="center"
|
class-name="small-padding fixed-width"
|
width="200"
|
fixed="right"
|
>
|
<template slot-scope="scope">
|
<el-button
|
size="mini"
|
type="text"
|
icon="el-icon-download"
|
@click="exportSummary(scope.row.id)"
|
v-hasPermi="['project:fundstatistics:summaryexoprt']"
|
>导出</el-button
|
>
|
<el-button
|
size="mini"
|
type="text"
|
icon="el-icon-edit"
|
@click="jumptocost(scope.row)"
|
v-hasPermi="['project:fundstatistics:list']"
|
>查看成本汇总</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
<!-- hide-on-single-page -->
|
<pagination
|
v-show="total > 0"
|
style="margin-left: 100px"
|
:total="total"
|
:page.sync="queryParams.pageNum"
|
:limit.sync="queryParams.pageSize"
|
@pagination="getBaseInfoList"
|
/>
|
</el-card>
|
</el-col>
|
<el-col :span="24" v-if="showType == 'costinfo'">
|
<el-form :model="curCaseInfo" ref="infoForm" :inline="true">
|
<el-row>
|
<el-col :span="3">
|
<el-button
|
type="primary"
|
icon="el-icon-back"
|
@click="backDonateList"
|
>捐献列表</el-button
|
>
|
</el-col>
|
<el-form-item label="捐献编号" prop="donorno">
|
<el-input v-model="curCaseInfo.donorno" disabled />
|
</el-form-item>
|
<el-form-item label="姓名" prop="name">
|
<el-input v-model="curCaseInfo.name" disabled />
|
</el-form-item>
|
</el-row>
|
</el-form>
|
<el-row>
|
<fund-summary :donorno="curdonorno"></fund-summary>
|
</el-row>
|
</el-col>
|
</div>
|
</template>
|
|
<script>
|
//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
|
//例如:import 《组件名称》 from '《组件路径》';
|
import { listDonatebaseinfo } from "@/api/project/donatebaseinfo";
|
import { getDonationCost, exportFundCost } from "@/api/project/financesubject";
|
import FundSummary from "@/views/project/components/fundsummary";
|
import { getToken } from "@/utils/auth";
|
|
export default {
|
//import引入的组件需要注入到对象中才能使用
|
components: {
|
FundSummary
|
},
|
dicts: [
|
"sys_Organ",
|
"sys_organstate",
|
"sys_user_sex",
|
"sys_IDType",
|
"sys_AgeUnit",
|
"sys_DonationStatus",
|
"sys_donornode"
|
],
|
data() {
|
//这里存放数据
|
return {
|
// 遮罩层
|
loading: true,
|
// 总条数
|
total: 0,
|
//捐献案例列表数据
|
donationCaseTableData: [],
|
//搜索参数
|
queryParams: {
|
pageNum: 1,
|
recordstate: null,
|
donorno: "",
|
name: "",
|
pageSize: 10,
|
name: null,
|
donorno: null
|
},
|
curdonorno: null,
|
showType: "list",
|
curCaseInfo: {
|
donorno: null,
|
name: null,
|
id: null
|
},
|
headers: {
|
Authorization: "Bearer " + getToken()
|
}
|
};
|
},
|
//监听属性 类似于data概念
|
computed: {},
|
//监控data中的数据变化
|
watch: {},
|
//方法集合
|
methods: {
|
/** 查询捐献基础列表 */
|
getBaseInfoList() {
|
this.loading = true;
|
if (this.queryParams.recordstate == "") {
|
this.queryParams.recordstate = null;
|
}
|
listDonatebaseinfo(this.queryParams).then(response => {
|
this.donationCaseTableData = response.rows;
|
this.total = response.total;
|
this.loading = false;
|
});
|
},
|
jumptocost(row) {
|
this.showType = "costinfo";
|
this.curdonorno = row.id;
|
this.curCaseInfo.donorno = row.donorno;
|
this.curCaseInfo.name = row.name;
|
//console.log("dononro:" + this.curdonorno);
|
},
|
|
backDonateList() {
|
this.showType = "list";
|
},
|
/** 搜索按钮操作 */
|
handleQuery() {
|
this.queryParams.pageNum = 1;
|
this.getBaseInfoList();
|
},
|
/** 重置按钮操作 */
|
resetQuery() {
|
this.daterangeReporttime = [];
|
this.resetForm("queryForm");
|
this.handleQuery();
|
},
|
//导出汇总表
|
exportSummary(id) {
|
exportFundCost(id).then(res => {
|
var fileUrl = res;
|
//获取当前网址
|
var urlBase = process.env.VUE_APP_BASE_API;
|
var curWWWPath = window.document.location.href;
|
var pos = curWWWPath.indexOf(window.document.location.pathname);
|
// 创建a标签
|
var aEle = document.createElement("a");
|
aEle.href =
|
curWWWPath.substring(0, pos) + urlBase + fileUrl["downloadUrl"];
|
console.log(aEle.href);
|
// 添加Authorization头部
|
fetch(aEle.href, {
|
headers: this.headers
|
})
|
.then(response => {
|
// 将文件下载链接作为blob对象进行下载
|
return response.blob();
|
})
|
.then(blob => {
|
const url = window.URL.createObjectURL(new Blob([blob]));
|
console.log(url);
|
const link = document.createElement("a");
|
link.href = url;
|
const name = fileUrl["downloadName"];
|
link.setAttribute("download", name); // 替换file.pdf为实际的文件名
|
document.body.appendChild(link);
|
link.click();
|
link.parentNode.removeChild(link);
|
});
|
});
|
}
|
},
|
//生命周期 - 创建完成(可以访问当前this实例)
|
created() {
|
this.getBaseInfoList();
|
},
|
//生命周期 - 挂载完成(可以访问DOM元素)
|
mounted() {},
|
beforeCreate() {}, //生命周期 - 创建之前
|
beforeMount() {}, //生命周期 - 挂载之前
|
beforeUpdate() {}, //生命周期 - 更新之前
|
updated() {}, //生命周期 - 更新之后
|
beforeDestroy() {}, //生命周期 - 销毁之前
|
destroyed() {}, //生命周期 - 销毁完成
|
activated() {} //如果页面有keep-alive缓存功能,这个函数会触发
|
};
|
</script>
|
<style scoped>
|
/* @import url(); 引入公共css类 */
|
</style>
|