doum
2025-09-08 55ba702c1df240929e68df3b42fa9cb0607378b8
admin/src/views/business/analysis.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,203 @@
<template>
    <TableLayout :permissions="['business:wxbill:query']">
        <!-- æœç´¢è¡¨å• -->
        <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline>
            <el-form-item label="对账日期" prop="name">
                <el-date-picker
                    v-model="value1"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    :picker-options="pickerOptions"
                    format="yyyy-MM-dd" value-format="yyyy-MM-dd HH:mm:ss"
                    @change="selectDate"
                ></el-date-picker>
            </el-form-item>
            <section>
                <el-button type="primary" @click="search">搜索</el-button>
                <el-button @click="reset">重置</el-button>
                <el-button type="primary" @click="daochu">导出</el-button>
            </section>
        </el-form>
        <!-- è¡¨æ ¼å’Œåˆ†é¡µ -->
        <template v-slot:table-wrap>
            <el-table
                v-loading="isWorking.search"
                :data="list"
                stripe
                border
            >
                <el-table-column :prop="item" :label="item" align="center" v-for="(item, index) in column" :key="index"></el-table-column>
            </el-table>
        </template>
    </TableLayout>
</template>
<script>
  import BaseTable from '@/components/base/BaseTable'
  import TableLayout from '@/layouts/TableLayout'
  import Pagination from '@/components/common/Pagination'
  import { getBikeIncomeReportVOList, bikeIncomeExportExcel } from '@/api/business/goodsorder'
  export default {
    name: 'analysis',
    extends: BaseTable,
    components: { TableLayout, Pagination },
    data () {
      return {
        value1: [],
        list: [],
        column: [],
        // æœç´¢
        searchForm: {
          endDate: '',
          startDate: ''
        },
        sumData: {
        },
        pickerOptions: {}
      }
    },
    created () {
      this.config({
        module: '',
        api: '/business/wxBill',
        'field.id': 'id',
        'field.main': 'id'
      })
      this.pickerOptions.disabledDate = (time) => {
        // ä¸€å¤©
        const tempTime = 3600 * 1000 * 24
        return time.getTime() > new Date() - tempTime
      }
      const yesterday = new Date();
      yesterday.setDate(yesterday.getDate() - 1);
      const startDate = new Date(yesterday);
      startDate.setDate(startDate.getDate() - 30);
      this.searchForm.startDate = startDate.toISOString().split('T')[0] + ' 00:00:00'
      this.searchForm.endDate = yesterday.toISOString().split('T')[0] + ' 00:00:00'
      this.value1 = [this.searchForm.startDate, this.searchForm.endDate]
      this.search()
    },
    methods: {
      search() {
        getBikeIncomeReportVOList({
          startDate: this.searchForm.startDate,
          endDate: this.searchForm.endDate
        }).then(res => {
          this.column = res.map(item => item[0])
          const keys = res.map(row => row[0]); // èŽ·å–é”®å
          const values = res.map(row => row.slice(1, row.length)); // èŽ·å–å€¼
          this.list = values[0].map((_, index) => {
            return keys.reduce((obj, key, i) => {
              obj[key] = values[i][index];
              return obj;
            }, {});
          });
        })
      },
      daochu() {
        bikeIncomeExportExcel({
          startDate: this.searchForm.startDate,
          endDate: this.searchForm.endDate
        }).then(res => {
          this.download(res)
          console.log(res.data)
        })
      },
      reset () {
        const yesterday = new Date();
        yesterday.setDate(yesterday.getDate() - 1);
        const startDate = new Date(yesterday);
        startDate.setDate(startDate.getDate() - 30);
        this.searchForm.startDate = startDate.toISOString().split('T')[0] + ' 00:00:00'
        this.searchForm.endDate = yesterday.toISOString().split('T')[0] + ' 00:00:00'
        this.value1 = [this.searchForm.startDate, this.searchForm.endDate]
        this.search()
      },
      getDays(startDate, endDate) {
        const date1 = new Date(startDate); // ç¬¬ä¸€ä¸ªæ—¥æœŸ
        const date2 = new Date(endDate); // ç¬¬äºŒä¸ªæ—¥æœŸ
        const timeDifference = date2 - date1;
        return timeDifference / (1000 * 3600 * 24);
      },
      selectDate (v) {
        // this.searchForm.startDate = ''
        // this.searchForm.endDate = ''
        if (v) {
          if (this.getDays(v[0], v[1]) > 30) {
            this.$message.warning('最多只能选择30天')
            const yesterday = new Date();
            yesterday.setDate(yesterday.getDate() - 1);
            const startDate = new Date(yesterday);
            startDate.setDate(startDate.getDate() - 30);
            this.searchForm.startDate = startDate.toISOString().split('T')[0] + ' 00:00:00'
            this.searchForm.endDate = yesterday.toISOString().split('T')[0] + ' 00:00:00'
            this.value1 = [this.searchForm.startDate, this.searchForm.endDate]
          } else {
            this.searchForm.startDate = v[0]
            this.searchForm.endDate = v[1]
          }
        }
        this.search()
      },
      // é¡µç å˜æ›´å¤„理
      handlePageChange (pageIndex) {
        this.__checkApi()
        this.tableData.pagination.pageIndex = pageIndex || this.tableData.pagination.pageIndex
        this.isWorking.search = true
        this.api.fetchList({
          page: this.tableData.pagination.pageIndex,
          capacity: this.tableData.pagination.pageSize,
          model: this.searchForm,
          sorts: this.tableData.sorts
        })
          .then(data => {
            this.tableData.list = data.records
            this.tableData.pagination.total = data.total
            this.sumData = data.extData
          })
          .catch(e => {
            this.$tip.apiFailed(e)
          })
          .finally(() => {
            this.isWorking.search = false
          })
      }
    }
  }
</script>
<style lang="scss" scoped>
    ::v-deep .el-table tbody tr:last-child {
        font-size: 16px;
        font-weight: bold;
        background-color: #f3f3fb;
    }
    .sum {
        display: flex;
        font-size: 16px;
        margin-bottom: 10px;
        background-color: rgb(243, 243, 251);
        .sum-title {
            flex-shrink: 0;
            background-color: rgb(111, 129, 198);
            color: #fff;
            font-weight: 500;
            text-align: center;
            padding: 15px;
        }
        .sum-value {
            padding: 15px 30px;
            :first-child {
                font-size: 14px;
            }
            :last-child {
                font-weight: 600;
            }
        }
    }
</style>