|
|
<!--我的报销,报销列表,其他支出-->
|
|
|
<template>
|
|
|
<div style="padding: 0 20px">
|
|
|
<lx-header
|
|
|
icon="md-apps"
|
|
|
style="margin-bottom: 10px; border: 0px; margin-top: 15px"
|
|
|
>
|
|
|
<div slot="content"></div>
|
|
|
<slot>
|
|
|
<div class="select-bar">
|
|
|
<div>
|
|
|
<span style="padding: 0 6px">创建日期</span>
|
|
|
<span>
|
|
|
<DatePicker
|
|
|
:value="select.year"
|
|
|
placeholder="选择开始日期"
|
|
|
placement="bottom"
|
|
|
style="width: 114px"
|
|
|
type="date"
|
|
|
@on-change="(e) => (select.year = e)"
|
|
|
></DatePicker>
|
|
|
<DatePicker
|
|
|
:value="select.year"
|
|
|
placeholder="选择结束日期"
|
|
|
placement="bottom"
|
|
|
style="width: 114px; margin-left: 6px"
|
|
|
type="date"
|
|
|
@on-change="(e) => (select.year = e)"
|
|
|
></DatePicker>
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<!-- <div>-->
|
|
|
<!-- <span style="padding: 0 6px"> 项目类型 </span>-->
|
|
|
<!-- <span>-->
|
|
|
<!-- <Select-->
|
|
|
<!-- v-model="select.type"-->
|
|
|
<!-- clearable-->
|
|
|
<!-- placeholder="选择项目类型"-->
|
|
|
<!-- style="width: 130px"-->
|
|
|
<!-- >-->
|
|
|
<!-- <Option v-for="item in types" :key="item.id" :value="item.id">{{-->
|
|
|
<!-- item.value }}-->
|
|
|
<!-- </Option>-->
|
|
|
<!-- </Select>-->
|
|
|
<!-- </span>-->
|
|
|
<!-- </div>-->
|
|
|
|
|
|
<div>
|
|
|
<span style="padding: 0 6px"> 科室 </span>
|
|
|
<span>
|
|
|
<Select
|
|
|
placeholder="科室选择"
|
|
|
clearable
|
|
|
v-model="select.department"
|
|
|
style="width: 130px"
|
|
|
>
|
|
|
<Option
|
|
|
v-for="item in departments"
|
|
|
:key="item.id"
|
|
|
:value="item.id"
|
|
|
>{{ item.name }}</Option
|
|
|
>
|
|
|
</Select>
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<div v-if="this.$route.path.split('_')[1] == 2">
|
|
|
<span style="padding: 0 6px"> 报销类型 </span>
|
|
|
<span>
|
|
|
<Select
|
|
|
v-model="select.type"
|
|
|
clearable
|
|
|
placeholder="选择报销类型"
|
|
|
style="width: 130px"
|
|
|
>
|
|
|
<Option
|
|
|
v-for="item in [
|
|
|
{
|
|
|
value: '医药报销支出',
|
|
|
id: 1,
|
|
|
},
|
|
|
{
|
|
|
value: '出差报销支出',
|
|
|
id: 2,
|
|
|
},
|
|
|
]"
|
|
|
:key="item.id"
|
|
|
:value="item.id"
|
|
|
>{{ item.value }}</Option
|
|
|
>
|
|
|
</Select>
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<div v-if="$route.path.split('_')[1] == 3">
|
|
|
<span style="padding: 0 6px"> 其他支出类型 </span>
|
|
|
<span>
|
|
|
<Select
|
|
|
v-model="select.type"
|
|
|
clearable
|
|
|
placeholder="选择其他支出类型"
|
|
|
style="width: 130px"
|
|
|
>
|
|
|
<Option
|
|
|
v-for="item in otherType"
|
|
|
:key="item.id"
|
|
|
:value="item.id"
|
|
|
>{{ item.value }}</Option
|
|
|
>
|
|
|
</Select>
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<div>
|
|
|
<span style="padding: 0 6px">
|
|
|
{{ $route.path.split("_")[1] == 2 ? "报销金额" : "其他支出金额" }}
|
|
|
</span>
|
|
|
<span>
|
|
|
<InputNumber
|
|
|
style="width: 110px"
|
|
|
placeholder="最低价"
|
|
|
v-model="select.start_plan_price"
|
|
|
:formatter="
|
|
|
(value) => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
|
|
"
|
|
|
:parser="(value) => value.replace(/\s?|(,*)/g, '')"
|
|
|
></InputNumber>
|
|
|
<InputNumber
|
|
|
style="width: 110px; margin-left: 6px"
|
|
|
placeholder="最高价"
|
|
|
v-model="select.end_plan_price"
|
|
|
:formatter="
|
|
|
(value) => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
|
|
"
|
|
|
:parser="(value) => value.replace(/\s?|(,*)/g, '')"
|
|
|
></InputNumber>
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<div>
|
|
|
<span style="padding: 0 6px"> 状态 </span>
|
|
|
<span>
|
|
|
<Select
|
|
|
v-model="select.type"
|
|
|
clearable
|
|
|
placeholder="选择状态"
|
|
|
style="width: 110px"
|
|
|
>
|
|
|
<Option v-for="item in types" :key="item.id" :value="item.id">{{
|
|
|
item.value
|
|
|
}}</Option>
|
|
|
</Select>
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<Button
|
|
|
style="margin-left: 10px"
|
|
|
type="primary"
|
|
|
@click="
|
|
|
($refs['addExpenseAccount'].type = 'add'),
|
|
|
$refs['addExpenseAccount'].show()
|
|
|
"
|
|
|
>新增</Button
|
|
|
>
|
|
|
<Button style="margin-left: 10px" type="primary" @click="getList"
|
|
|
>查询</Button
|
|
|
>
|
|
|
<Button style="margin-left: 10px" type="primary" @click="init"
|
|
|
>重置
|
|
|
</Button>
|
|
|
</div>
|
|
|
</slot>
|
|
|
</lx-header>
|
|
|
|
|
|
<xy-table
|
|
|
row-key="id"
|
|
|
:list="list"
|
|
|
:table-item="table"
|
|
|
@delete="(row) => destroy(row.id)"
|
|
|
@editor="
|
|
|
(row) => {
|
|
|
$refs['addExpenseAccount'].setType('editor');
|
|
|
$refs['addExpenseAccount'].setId(row.id);
|
|
|
$refs['addExpenseAccount'].show();
|
|
|
}
|
|
|
"
|
|
|
>
|
|
|
<template #btns>
|
|
|
<el-table-column label="操作" width="220" fixed="right">
|
|
|
<template #default="scope">
|
|
|
<Button
|
|
|
class="slot-btns-item"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click="
|
|
|
$refs['paymentRegistration'].getContract(scope.row),
|
|
|
($refs[
|
|
|
'paymentRegistration'
|
|
|
].isShowPaymentRegistration = true)
|
|
|
"
|
|
|
>
|
|
|
付款登记
|
|
|
</Button>
|
|
|
<template v-if="!scope.row.status === 2">
|
|
|
<Poptip
|
|
|
:transfer="true"
|
|
|
confirm
|
|
|
placement="bottom"
|
|
|
title="确认要删除吗"
|
|
|
@on-ok="() => destroy(scope.row.id)"
|
|
|
>
|
|
|
<i-button style="margin-left: 4px" ghost size="small" type="error"
|
|
|
>删除
|
|
|
</i-button>
|
|
|
</Poptip>
|
|
|
</template>
|
|
|
<Button
|
|
|
style="margin-left: 4px"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click="
|
|
|
$refs['detailContract'].getDetail(scope.row.id),
|
|
|
($refs['detailContract'].isShowDetail = true)
|
|
|
"
|
|
|
>
|
|
|
查看
|
|
|
</Button>
|
|
|
<template v-if="scope.row.status != 2">
|
|
|
<Button
|
|
|
style="margin-left: 4px"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click="
|
|
|
() => {
|
|
|
$refs['addExpenseAccount'].setType('editor');
|
|
|
$refs['addExpenseAccount'].setId(scope.row.id);
|
|
|
$refs['addExpenseAccount'].show();
|
|
|
}
|
|
|
"
|
|
|
>编辑
|
|
|
</Button>
|
|
|
</template>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</template>
|
|
|
</xy-table>
|
|
|
|
|
|
<div style="display: flex; justify-content: flex-end; padding: 10px 0">
|
|
|
<Page
|
|
|
:total="total"
|
|
|
@on-change="
|
|
|
(e) => {
|
|
|
select.page = e;
|
|
|
getList();
|
|
|
}
|
|
|
"
|
|
|
show-elevator
|
|
|
show-sizer
|
|
|
@on-page-size-change="
|
|
|
(e) => {
|
|
|
select.page_size = e;
|
|
|
select.page = 1;
|
|
|
getList();
|
|
|
}
|
|
|
"
|
|
|
/>
|
|
|
</div>
|
|
|
|
|
|
<addExpenseAccount
|
|
|
:other_types="otherType"
|
|
|
:departments="departments"
|
|
|
ref="addExpenseAccount"
|
|
|
@refresh="getList"
|
|
|
></addExpenseAccount>
|
|
|
|
|
|
<detailContract ref="detailContract"></detailContract>
|
|
|
<paymentRegistration ref="paymentRegistration" @refresh="getList"></paymentRegistration>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { getContract, delContract } from "@/api/contract/contract";
|
|
|
import { getparameter } from "@/api/system/dictionary";
|
|
|
import { listdeptNoAuth } from "@/api/system/department";
|
|
|
|
|
|
import addExpenseAccount from "@/views/inOut/component/addExpenseAccount.vue";
|
|
|
import detailContract from '@/views/contract/components/detailContract.vue';
|
|
|
import paymentRegistration from '@/views/contract/components/paymentRegistration.vue'
|
|
|
export default {
|
|
|
components: {
|
|
|
addExpenseAccount,detailContract,paymentRegistration
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
otherType: [],
|
|
|
total: 0,
|
|
|
select: {
|
|
|
page: 1,
|
|
|
page_size: 10,
|
|
|
start_created_at: "",
|
|
|
end_created_at: undefined,
|
|
|
start_plan_price: "",
|
|
|
end_plan_price: "",
|
|
|
department_id: "",
|
|
|
report_type: "",
|
|
|
other_type: "",
|
|
|
is_myself: "",
|
|
|
outcome_type: "",
|
|
|
},
|
|
|
types: [],
|
|
|
departments: [],
|
|
|
|
|
|
list: [],
|
|
|
table: [
|
|
|
{
|
|
|
prop: "name",
|
|
|
label: "项目名称",
|
|
|
width: 190,
|
|
|
fixed: "left",
|
|
|
},
|
|
|
{
|
|
|
label: this.$route.path.split("_")[1] == 2 ? "报销类型" : "支出类型",
|
|
|
width: 160,
|
|
|
customFn: (row) => {
|
|
|
let map = new Map([
|
|
|
[1, "医药报销支出"],
|
|
|
[2, "出差报销支出"],
|
|
|
]);
|
|
|
return this.$route.path.split("_")[1] == 2 ? (
|
|
|
<span>{map.get(row.report_type)}</span>
|
|
|
) : (
|
|
|
<span>{row.other_type?.value}</span>
|
|
|
);
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
prop: "from",
|
|
|
label: "资金来源",
|
|
|
width: 160,
|
|
|
},
|
|
|
{
|
|
|
prop: "money",
|
|
|
label:
|
|
|
this.$route.path.split("_")[1] == 2
|
|
|
? "报销金额（元）"
|
|
|
: "支出金额（元）",
|
|
|
width: 140,
|
|
|
align: "right",
|
|
|
formatter: (cell, data, value) => {
|
|
|
return Number(value)
|
|
|
.toFixed(2)
|
|
|
.replace(/(\d)(?=(\d{3})+\.)/g, "$1,");
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
prop: "apply_money_total",
|
|
|
label:
|
|
|
this.$route.path.split("_")[1] == 2
|
|
|
? "实际报销金额（元）"
|
|
|
: "实际支出金额（元）",
|
|
|
width: 140,
|
|
|
align: "right",
|
|
|
formatter: (cell, data, value) => {
|
|
|
return Number(value)
|
|
|
.toFixed(2)
|
|
|
.replace(/(\d)(?=(\d{3})+\.)/g, "$1,");
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
prop: "fund_log_total",
|
|
|
label: "已付金额",
|
|
|
width: 140,
|
|
|
align: "right",
|
|
|
formatter: (cell, data, value) => {
|
|
|
return Number(value)
|
|
|
.toFixed(2)
|
|
|
.replace(/(\d)(?=(\d{3})+\.)/g, "$1,");
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
prop: "department.name",
|
|
|
label: "业务科室",
|
|
|
width: 140,
|
|
|
},
|
|
|
{
|
|
|
prop: "",
|
|
|
label: "状态",
|
|
|
width: 140,
|
|
|
},
|
|
|
{
|
|
|
prop: "admin.name",
|
|
|
label: "经办人",
|
|
|
width: 140,
|
|
|
},
|
|
|
{
|
|
|
prop: "created_at",
|
|
|
label: "创建日期",
|
|
|
width: 180,
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
init() {
|
|
|
for (let key in this.select) {
|
|
|
if (this.select[key] instanceof Array) {
|
|
|
this.select[key] = [];
|
|
|
} else {
|
|
|
this.select[key] = "";
|
|
|
}
|
|
|
}
|
|
|
|
|
|
this.select.page = 1;
|
|
|
this.select.page_size = 10;
|
|
|
},
|
|
|
|
|
|
async getList() {
|
|
|
const res = await getContract(this.select);
|
|
|
this.list = res.list.data;
|
|
|
this.total = res.list.total;
|
|
|
},
|
|
|
|
|
|
async getDepartment() {
|
|
|
this.departments = await listdeptNoAuth();
|
|
|
},
|
|
|
|
|
|
async getOtherType() {
|
|
|
const res = await getparameter({
|
|
|
number: "other_type",
|
|
|
});
|
|
|
this.otherType = res.detail;
|
|
|
},
|
|
|
|
|
|
destroy(id) {
|
|
|
delContract({
|
|
|
id,
|
|
|
}).then((res) => {
|
|
|
this.getList();
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
computed: {
|
|
|
typeText() {
|
|
|
return function (type) {
|
|
|
if (type == 2) {
|
|
|
return "报销";
|
|
|
}
|
|
|
if (type == 3) {
|
|
|
return "其他支出";
|
|
|
}
|
|
|
};
|
|
|
},
|
|
|
},
|
|
|
created() {
|
|
|
this.select.outcome_type = this.$route.path.split("_")[1];
|
|
|
this.select.is_myself = this.$route.path.split("_")[2];
|
|
|
this.getDepartment();
|
|
|
this.getOtherType();
|
|
|
this.getList();
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
.select-bar {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
align-items: center;
|
|
|
|
|
|
& > div {
|
|
|
margin: 4px;
|
|
|
}
|
|
|
}
|
|
|
</style>
|
