|
|
@@ -0,0 +1,188 @@
|
|
|
+<template>
|
|
|
+ <div class="list-view" v-loading="loading" :style="{ width: showSummary ? 'auto' : '100%' }">
|
|
|
+ <div class="filters-container">
|
|
|
+ <el-button type="primary" @click="getData">查询</el-button>
|
|
|
+ <el-button
|
|
|
+ @click="download()"
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-download"
|
|
|
+ :loading="downloading"
|
|
|
+ class="filter-item"
|
|
|
+ >
|
|
|
+ 导出
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ row-key="id"
|
|
|
+ ref="table"
|
|
|
+ header-row-class-name="table-header-row"
|
|
|
+ header-cell-class-name="table-header-cell"
|
|
|
+ row-class-name="table-row"
|
|
|
+ cell-class-name="table-cell"
|
|
|
+ v-loading="$store.state.fetchingData"
|
|
|
+ :height="tableHeight"
|
|
|
+ show-summary
|
|
|
+ :summary-method="getSummaries"
|
|
|
+ >
|
|
|
+ <el-table-column label="#" type="index" width="50"></el-table-column>
|
|
|
+ <el-table-column prop="roomName" label="房间名称"></el-table-column>
|
|
|
+ <el-table-column prop="bedName" label="床位名称"></el-table-column>
|
|
|
+ <el-table-column prop="name" label="个人名称"></el-table-column>
|
|
|
+ <el-table-column prop="feeType" label="费用类型"></el-table-column>
|
|
|
+ <el-table-column prop="money" label="费用总额"></el-table-column>
|
|
|
+ <el-table-column prop="settleTime" label="结算时间"></el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import pageableTable from '@/mixins/pageableTable';
|
|
|
+import { addMonths, format } from 'date-fns';
|
|
|
+import Qrcode from '@chenfengyuan/vue-qrcode';
|
|
|
+import PersonalFeeList from '@/components/roomStatus/PersonalFeeList';
|
|
|
+import PersonalFeeEdit from '@/components/operation/PersonalFeeEdit';
|
|
|
+import IndividualRentList from '@/components/operation/IndividualRentList';
|
|
|
+import CheckinInfoEdit from '@/components/operation/CheckinInfoEdit';
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ IndividualRentList
|
|
|
+ },
|
|
|
+ name: 'storeIndividualReport',
|
|
|
+ mixins: [pageableTable],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ roomId: null,
|
|
|
+ search: '',
|
|
|
+ roomInfoOptions: [],
|
|
|
+ showSummary: false,
|
|
|
+ loading: false,
|
|
|
+ downloading: false,
|
|
|
+ tableData: [],
|
|
|
+ showRentDialog: false,
|
|
|
+ selectedCheckinId: null,
|
|
|
+ checkinStatusOptions: [
|
|
|
+ { value: 'in', label: '在住' },
|
|
|
+ { value: 'out', label: '退宿' }
|
|
|
+ ],
|
|
|
+ checkinStatus: ''
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ selection() {
|
|
|
+ return this.$refs.table.selection.map(i => i.id);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getSummaries(param) {
|
|
|
+ const { columns, data } = param;
|
|
|
+ const sums = [];
|
|
|
+ //循环处理所有列数据
|
|
|
+ columns.forEach((column, index) => {
|
|
|
+ if (index === 0) {
|
|
|
+ sums[index] = '总数';
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (index === 1) {
|
|
|
+ sums[index] = '';
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (index === 2) {
|
|
|
+ sums[index] = '';
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (index === 3) {
|
|
|
+ sums[index] = '';
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (index === 9 || index === 15) {
|
|
|
+ const values = data.map(item => Number(item[column.property]));
|
|
|
+ sums[index] =
|
|
|
+ values.reduce((prev, curr) => {
|
|
|
+ const value = Number(curr);
|
|
|
+ if (!isNaN(value)) {
|
|
|
+ return prev + curr;
|
|
|
+ } else {
|
|
|
+ return prev;
|
|
|
+ }
|
|
|
+ }, 0) / values.length;
|
|
|
+ sums[index] = parseFloat(sums[index]).toFixed(2);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ //将每列的所有数据数字化处理成一个数组
|
|
|
+ const values = data.map(item => Number(item[column.property]));
|
|
|
+ //当前列的所有数据全是数字类型时
|
|
|
+ if (!values.every(value => isNaN(value))) {
|
|
|
+ //将当前列数据数组中的所有值,从左到右依次累加处理
|
|
|
+ sums[index] = values.reduce((prev, curr) => {
|
|
|
+ const value = Number(curr);
|
|
|
+ if (!isNaN(value)) {
|
|
|
+ return prev + curr;
|
|
|
+ } else {
|
|
|
+ return prev;
|
|
|
+ }
|
|
|
+ }, 0);
|
|
|
+ sums[index] += '';
|
|
|
+ } else {
|
|
|
+ sums[index] = 'N/A';
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ return sums;
|
|
|
+ },
|
|
|
+ beforeOnCreate() {
|
|
|
+ this.$http.get('/roomInfo/all', { size: 10000, query: { storeId: this.selectedStoreId } }).then(res => {
|
|
|
+ this.roomInfoOptions = res.content;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getData() {
|
|
|
+ this.loading = true;
|
|
|
+ this.$http
|
|
|
+ .get('/personalFee/showCycleFee', {
|
|
|
+ storeId: this.selectedStoreId,
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.loading = false;
|
|
|
+ this.tableData = res;
|
|
|
+ this.showSummary = true;
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ this.loading = false;
|
|
|
+ this.$message.error(e.error);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ download() {
|
|
|
+ this.downloading = true;
|
|
|
+ this.$axios
|
|
|
+ .get('/report/storeIndividualReportExcel', {
|
|
|
+ params: {
|
|
|
+ storeId: this.selectedStoreId,
|
|
|
+ roomId: this.roomId,
|
|
|
+ search: this.search,
|
|
|
+ checkinStatus: this.checkinStatus
|
|
|
+ },
|
|
|
+ responseType: 'blob'
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.downloading = false;
|
|
|
+ const downloadUrl = window.URL.createObjectURL(new Blob([res.data]));
|
|
|
+ const link = document.createElement('a');
|
|
|
+ link.href = downloadUrl;
|
|
|
+ link.setAttribute(
|
|
|
+ 'download',
|
|
|
+ decodeURIComponent(res.headers['content-disposition'].split('filename=')[1])
|
|
|
+ );
|
|
|
+ document.body.appendChild(link);
|
|
|
+ link.click();
|
|
|
+ link.remove();
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ console.log(e);
|
|
|
+ this.downloading = false;
|
|
|
+ this.$message.error(e.error);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="less" scoped></style>
|