初步改造前端页面

This commit is contained in:
28353131@qq.com 2020-11-29 15:16:17 +08:00
parent 5b598909f7
commit 0d16f9158a

View File

@ -26,15 +26,6 @@
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="预付费金额" prop="prepaid">
<el-input
v-model="queryParams.prepaid"
placeholder="请输入预付费金额"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="预付费时间" prop="prepaidAt"> <el-form-item label="预付费时间" prop="prepaidAt">
<el-date-picker clearable size="small" style="width: 200px" <el-date-picker clearable size="small" style="width: 200px"
v-model="queryParams.prepaidAt" v-model="queryParams.prepaidAt"
@ -57,7 +48,7 @@
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['fantang:prepayment:add']" v-hasPermi="['fantang:prepayment:add']"
>新增 >预付收款
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
@ -147,16 +138,34 @@
<!-- 添加或修改收费管理对话框 --> <!-- 添加或修改收费管理对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-form ref="formAddPrepayment" :model="formAddPrepayment" :rules="rules" label-width="80px">
<el-form-item label="住院号" prop="hospitalId">
<el-autocomplete
popper-class="my-autocomplete"
v-model="state"
:fetch-suggestions="querySearch"
placeholder="请输入住院号"
@select="handleSelect">
<i
class="el-icon-edit el-input__icon"
slot="suffix"
@click="handleIconClick">
</i>
<template slot-scope="{ item }">
<div class="name">{{ item.value }}</div>
<span class="addr">{{ item.address }}</span>
</template>
</el-autocomplete>
</el-form-item>
<el-form-item label="病人id" prop="patientId"> <el-form-item label="病人id" prop="patientId">
<el-input v-model="form.patientId" placeholder="请输入病人id"/> <el-input v-model="formAddPrepayment.patientId" placeholder="请输入病人id"/>
</el-form-item> </el-form-item>
<el-form-item label="预付费金额" prop="prepaid"> <el-form-item label="预付费金额" prop="prepaid">
<el-input v-model="form.prepaid" placeholder="请输入预付费金额"/> <el-input v-model="formAddPrepayment.prepaid" placeholder="请输入预付费金额"/>
</el-form-item> </el-form-item>
<el-form-item label="预付费时间" prop="prepaidAt"> <el-form-item label="预付费时间" prop="prepaidAt">
<el-date-picker clearable size="small" style="width: 200px" <el-date-picker clearable size="small" style="width: 200px"
v-model="form.prepaidAt" v-model="formAddPrepayment.prepaidAt"
type="date" type="date"
value-format="yyyy-MM-dd" value-format="yyyy-MM-dd"
placeholder="选择预付费时间"> placeholder="选择预付费时间">
@ -172,177 +181,237 @@
</template> </template>
<script> <script>
import { import {
addPrepayment, addPrepayment,
delPrepayment, delPrepayment,
exportPrepayment, exportPrepayment,
getPrepayment, getPrepayment,
listPrepayment, listPrepayment,
updatePrepayment updatePrepayment
} from "@/api/fantang/prepayment"; } from "@/api/fantang/prepayment";
export default { export default {
name: "Prepayment", name: "Prepayment",
components: {}, components: {},
data() { data() {
return { return {
// restaurants: [],
loading: true, state: '',
// //
ids: [], loading: true,
// //
single: true, ids: [],
// //
multiple: true, single: true,
// //
showSearch: true, multiple: true,
// //
total: 0, showSearch: true,
// //
prepaymentList: [], total: 0,
// //
title: "", prepaymentList: [],
// //
open: false, title: "",
// //
queryParams: { open: false,
pageNum: 1, //
pageSize: 10, queryParams: {
collectAt: null, pageNum: 1,
settlementAt: null, pageSize: 10,
settlementFlag: null, collectAt: null,
prepaid: null, settlementAt: null,
prepaidAt: null settlementFlag: null,
}, prepaid: null,
// prepaidAt: null
form: {}, },
// //
rules: { formAddPrepayment: {},
patientId: [ //
{required: true, message: "病人id不能为空", trigger: "blur"} rules: {
], patientId: [
prepaid: [ {required: true, message: "病人id不能为空", trigger: "blur"}
{required: true, message: "预付费金额不能为空", trigger: "blur"} ],
], prepaid: [
prepaidAt: [ {required: true, message: "预付费金额不能为空", trigger: "blur"}
{required: true, message: "预付费时间不能为空", trigger: "blur"} ],
] prepaidAt: [
} {required: true, message: "预付费时间不能为空", trigger: "blur"}
}; ]
}, }
created() {
this.getList();
},
methods: {
/** 查询收费管理列表 */
getList() {
this.loading = true;
listPrepayment(this.queryParams).then(response => {
this.prepaymentList = response.rows;
this.total = response.total;
this.loading = false;
});
},
//
cancel() {
this.open = false;
this.reset();
},
//
reset() {
this.form = {
prepaymentId: null,
patientId: null,
collectAt: null,
collectBy: null,
settlementAt: null,
settlementBy: null,
settlementId: null,
settlementFlag: null,
prepaid: null,
prepaidAt: null
}; };
this.resetForm("form");
}, },
/** 搜索按钮操作 */ created() {
handleQuery() {
this.queryParams.pageNum = 1;
this.getList(); this.getList();
}, },
/** 重置按钮操作 */ mounted() {
resetQuery() { this.restaurants = this.loadAll();
this.resetForm("queryForm");
this.handleQuery();
}, },
//
handleSelectionChange(selection) { methods: {
this.ids = selection.map(item => item.prepaymentId) //
this.single = selection.length !== 1 querySearch(queryString, cb) {
this.multiple = !selection.length var restaurants = this.restaurants;
}, var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
/** 新增按钮操作 */ // callback
handleAdd() { cb(results);
this.reset(); },
this.open = true;
this.title = "添加收费管理"; //
}, createFilter(queryString) {
/** 修改按钮操作 */ return (restaurant) => {
handleUpdate(row) { return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
this.reset(); };
const prepaymentId = row.prepaymentId || this.ids },
getPrepayment(prepaymentId).then(response => {
this.form = response.data; //
this.open = true; loadAll() {
this.title = "修改收费管理"; return [
}); { "value": "南拳妈妈龙虾盖浇饭", "address": "普陀区金沙江路1699号鑫乐惠美食广场A13" }
}, ];
/** 提交按钮 */ },
submitForm() {
this.$refs["form"].validate(valid => { //
if (valid) { handleSelect(item) {
if (this.form.prepaymentId != null) { console.log(item);
updatePrepayment(this.form).then(response => { },
this.msgSuccess("修改成功");
this.open = false; //
this.getList(); handleIconClick(ev) {
}); console.log(ev);
} else { },
addPrepayment(this.form).then(response => { /** 查询收费管理列表 */
this.msgSuccess("新增成功"); getList() {
this.open = false; this.loading = true;
this.getList(); listPrepayment(this.queryParams).then(response => {
}); this.prepaymentList = response.rows;
} this.total = response.total;
} this.loading = false;
}); });
}, },
/** 删除按钮操作 */ //
handleDelete(row) { cancel() {
const prepaymentIds = row.prepaymentId || this.ids; this.open = false;
this.$confirm('是否确认删除收费管理编号为"' + prepaymentIds + '"的数据项?', "警告", { this.reset();
confirmButtonText: "确定", },
cancelButtonText: "取消", //
type: "warning" reset() {
}).then(function () { this.formAddPrepayment = {
return delPrepayment(prepaymentIds); prepaymentId: null,
}).then(() => { patientId: null,
collectAt: null,
collectBy: null,
settlementAt: null,
settlementBy: null,
settlementId: null,
settlementFlag: null,
prepaid: null,
prepaidAt: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList(); this.getList();
this.msgSuccess("删除成功"); },
}) /** 重置按钮操作 */
}, resetQuery() {
/** 导出按钮操作 */ this.resetForm("queryForm");
handleExport() { this.handleQuery();
const queryParams = this.queryParams; },
this.$confirm('是否确认导出所有收费管理数据项?', "警告", { //
confirmButtonText: "确定", handleSelectionChange(selection) {
cancelButtonText: "取消", this.ids = selection.map(item => item.prepaymentId)
type: "warning" this.single = selection.length !== 1
}).then(function () { this.multiple = !selection.length
return exportPrepayment(queryParams); },
}).then(response => { /** 新增按钮操作 */
this.download(response.msg); handleAdd() {
}) this.reset();
this.open = true;
this.title = "添加收费管理";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const prepaymentId = row.prepaymentId || this.ids
getPrepayment(prepaymentId).then(response => {
this.formAddPrepayment = response.data;
this.open = true;
this.title = "修改收费管理";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.formAddPrepayment.prepaymentId != null) {
updatePrepayment(this.formAddPrepayment).then(response => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addPrepayment(this.formAddPrepayment).then(response => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const prepaymentIds = row.prepaymentId || this.ids;
this.$confirm('是否确认删除收费管理编号为"' + prepaymentIds + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function () {
return delPrepayment(prepaymentIds);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
})
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams;
this.$confirm('是否确认导出所有收费管理数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function () {
return exportPrepayment(queryParams);
}).then(response => {
this.download(response.msg);
})
}
}
};
</script>
<style lang="scss">
.my-autocomplete {
li {
line-height: normal;
padding: 7px;
.name {
text-overflow: ellipsis;
overflow: hidden;
}
.addr {
font-size: 12px;
color: #b4b4b4;
}
.highlighted .addr {
color: #ddd;
}
} }
} }
}; </style>
</script>