elizebeth/src/xt_pages/DepositManagement/Template/DeductionSummary.vue

<template>
<!--  扣费汇总-->
  <div class="main-contain">
    <div class="app-container">
      <div
        style="
          justify-content: flex-start;
          margin: 0px 0 12px 0;
          display: flex;
          align-items: center;
        "
      >
        <div style="display: flex">
          <div style="width: 250px">
            <el-input
              size="small"
              style="width: 200px; margin-left: 10px"
              class="filter-item"
              placeholder="请输入编号/患者名称"
              v-model.trim="keyword"
            />
          </div>

          <div style="width: 465px">
            <span>日期查询：</span>
            <el-date-picker
              v-model="value1"
              type="daterange"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker>
          </div>
          <el-button
            size="small"
            class="filter-item"
            type="primary"
            icon="el-icon-search"
            @click="search"
            >查询</el-button
          >
        </div>
      </div>

      <el-table
        :header-cell-style="{
          backgroundColor: 'rgb(245, 247, 250)',
          color: '#606266',
        }"
        :data="tableData"
         show-summary
        :summary-method="getSummaries"
        max-height="550"
        sum-text="押金支付金额合计"
        border
      >
        <el-table-column type="index" label="序号" align="center" width="200">
        </el-table-column>

        <el-table-column label="患者名称" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.name	 ? scope.row.name	 : "" }}</span>
          </template>
        </el-table-column>

        <el-table-column label="医疗费总额" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.total	 ? scope.row.total	 : "" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="押金支付金额" align="center" prop="decimal">
          <template slot-scope="scope">
            <span>{{ scope.row.decimal	 ? scope.row.decimal	 : "" }}</span>
          </template>
        </el-table-column>
      </el-table>

      <!-- <div>押金支付金额合计：<span>{{sum}}</span></div> -->
    </div>
  </div>
</template>
<script>
import BreadCrumb from "@/xt_pages/components/bread-crumb";
import {
  desummary,
  getweektime
}from "@/api/deposit";
export default {
  components: {
    BreadCrumb,
  },
  data() {
    return {
      crumbs: [
        { path: false, name: "押金管理" },
        { path: "/DepositManagement/DepositSearch", name: "押金查询" },
      ],
      tableData: [{},{},{}],
      // total: 0,
      // page: 1,
      // limit: 10,
      keyword: "",
      value1: "",
      start_time:"",
      end_time:"",
      sum:""
    };
  },

  created(){
    this.init();
    // this.search()
  },
  methods: {
    // 初始化数据
    init() {
      var params = {}
      getweektime(params).then((res) => {
        if (res.data.state == 1){
          this.value1 = [res.data.data.srart_time,res.data.data.end_time]
        }
        this.search()
      })
    },

    // 查询操作
    search() {
      if (this.value1 != null){
        if(this.value1[0] != undefined && this.value1[1] != undefined){
          this.start_time = this.value1[0]
          this.end_time = this.value1[1]
        }
      }else {
        this.start_time = ""
        this.end_time = ""
      }
      var params = {
        keyword: this.keyword,
        start_time: this.start_time,
        end_time: this.end_time,
      };
      console.log("params",params)
      desummary(params).then((res) => {
        if (res.data.state == 1){
          this.tableData = res.data.data.list;
          this.sum = res.data.data.sum;
        }
      })
    },

    // 删除
    toDelete() {},

    // 审核
    examine() {},

    // 打印凭证
    print() {},
  },
};
</script>
<style>
</style>