<script>
import {
  updateFangpaishuiPumpoperationrecordApi,
  deleteFangpaishuiPumpoperationrecordApi,
  findPumpoperationrecordByDetailApi,
  addFangpaishuiPumpoperationrecordApi,
  findFangpaishuiPumpoperationrecordByMonthApi,
} from "@@/apis/tables/drainageWorkshop/pumpOperationLog.ts";
import { getSpecificDate } from "@@/utils/datetime";
export default {
  data() {
    return {
      date: "",
      tableList: [],
    };
  },
  created() {
    // 页面渲染之前执行，一般调用methods定义的方法
    this.getList();
  },
  methods: {
    //获取列表
    async getList() {
      const res = await findAllMiningglossApi();
      console.log(res);
    },
    //按月查询
    async getMouthLoss() {
      let data = getSpecificDate(this.date);
      const res = await findTotalMiningByMonthApi(data);
      console.log(res);
    },
  },
};
</script>

<template>
  <div class="app-container">
    <div style="margin-bottom: 20px">
      <el-date-picker
        v-model="date"
        type="date"
        placeholder="请选择日期"
        size="default"
      />
      <el-button
        type="primary"
        size="mini"
        style="margin-left: 20px"
        @click="getMouthLoss"
        >查询</el-button
      >
    </div>
    <el-table
      :data="tableList"
      border
      style="width: 100%"
      :span-method="spanMethod"
      :header-align="center"
      :cell-style="rowStyle"
    >
      <el-table-column align="center" fixed prop="amount" label="日期" />
      <el-table-column align="center" prop="amount" label="白班">
        <el-table-column align="center" prop="amount" label="大厂要矿时间" />
        <el-table-column align="center" prop="amount" label="下去时间" />
        <el-table-column align="center" prop="amount" label="11节列数" />
      </el-table-column>
      <el-table-column align="center" prop="amount" label="夜班">
        <el-table-column align="center" prop="amount" label="大厂要矿时间" />
        <el-table-column align="center" prop="amount" label="下去时间" />
        <el-table-column align="center" prop="amount" label="11节列数"
      /></el-table-column>
      <el-table-column align="center" prop="amount" label="夜班早晨7点以后下" />
      <el-table-column align="center" prop="amount" label="白班早晨8点以后回" />
      <!-- 空数据时的显示 -->
      <template #empty>
        <div style="display: grid; place-items: center center">
          <el-empty :image-size="242" :description="暂无数据" />
        </div>
      </template>
    </el-table>
    <el-dialog
      v-model="updateprecipitationform"
      title="修改降水量信息"
      width="500"
    >
      <el-form :model="precipitationform">
        <el-form-item label="降水量" :label-width="formLabelWidth">
          <el-input v-model="precipitationform.amount" autocomplete="off" />
        </el-form-item>
        <el-form-item label="计量单位" :label-width="formLabelWidth">
          <el-input v-model="precipitationform.unit" autocomplete="off" />
        </el-form-item>
        <el-form-item label="月份" :label-width="formLabelWidth">
          <el-date-picker
            v-model="precipitationform.monthDate"
            type="datetime"
            placeholder="选择月份"
          />
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="updateprecipitationform = false"> 取消 </el-button>
          <el-button type="primary" @click="updatePrecipitation">
            提交
          </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
