jczxw-java/src/views/water/drinking-water-village/collect/index.vue

<template>
  <div class="ele-body">
    <a-card style="width: 100%" :bordered="false">
      <template #title>
        <a-space>
          <a-upload
            :before-upload="importFileTop"
            :showUploadList="false"
            accept=".xls,.xlsx,.csv"
          >
            <a-button>农村地表水导入</a-button>
          </a-upload>
          <a-upload
            :before-upload="importFileBottom"
            :showUploadList="false"
            accept=".xls,.xlsx,.csv"
          >
            <a-button>农村地下水导入</a-button>
          </a-upload>
        </a-space>
        <a-dropdown>
          <template #overlay>
            <a-menu>
              <a-menu-item @click="download('农村村庄地表水饮用水','xlsx')"> 农村村庄地表水饮用水</a-menu-item>
              <a-menu-item @click="download('农村村庄地下水饮用水','xlsx')"> 农村村庄地下水饮用水</a-menu-item>
            </a-menu>
          </template>
          <a-button  type="primary" style="left: 10px;background: #2FA524FF; border-color: #2FA524FF;color: #FFFFFF">
            模板下载
            <DownOutlined />
          </a-button>
        </a-dropdown>
      </template>
      <a-tabs v-model:activeKey="activeKey">
        <a-tab-pane tab="农村饮用水" key="water">
          <water-bill ref="water"></water-bill>
        </a-tab-pane>
      </a-tabs>
    </a-card>
  </div>
</template>

<script>
import XLSX from "xlsx";
import utils from "./utils";
import { Modal } from "ant-design-vue";
import WaterBill from "./water-bill.vue";
import { DownOutlined } from "@ant-design/icons-vue";
import { saveDrinkingWaterVillageBill } from "@/api/ecology/drinking-water-village";
import {
  downloadTemplatexls,
  downloadTemplate,
  downloadTemplatexlsm,
} from "@/utils/excel-util";
export default {
  name: "DrinkWaterVillageCollectIndex",
  components: {
    WaterBill,
    DownOutlined,
  },
  data() {
    return {
      activeKey: "water",
    };
  },
  methods: {
    /* 导入农村地表水文件 */
    importFileTop(file) {
      const hide = this.$message.loading("导入中..", 0);
      let reader = new FileReader();
      reader.onload = (e) => {
        try {
          let data = new Uint8Array(e.target.result);
          let workbook = XLSX.read(data, {
            type: "array",
          });
          //0.昼间数据 1.夜间数据 2.其他信息
          let sheetNames = workbook.SheetNames;
          // 解析成二维数组
          let aoa1 = XLSX.utils.sheet_to_json(
            workbook.Sheets[sheetNames[0]], {
            header: 1,
          });

          const drinkingWaterVillageList = aoa1.filter((item) => {
            // return item.length >= 40 && typeof item[0] == "number";
            return (
            item.length >= 40 && item[0] && !item[0].includes("断面代码") && !item[0].includes("导出人") && !item[0].includes("地表水")
            );
          });

          // 解析成对象数组
          // console.log(file);
          const billName1 = file.name;
          const billData1 = utils.toVillageTop(drinkingWaterVillageList);
          // console.log(billData1);
          if (!billData1 || billData1.length == 0) {
            hide();
            Modal.error({
              title: "导入失败",
              content: "找不到可用数据",
            });

            return;
          }

          if (billData1.length > 0) {
            // 上传到服务器
            saveDrinkingWaterVillageBill({
              billName: billName1,
              regionLevel: "农村",
              waterSourceType: 1,
              drinkingWaterType: 1,
              drinkingWaterVillageList: billData1,
            })
              .then((res) => {
                if (res.data.code == 0) {
                  Modal.success({
                    title: "导入成功",
                    content: `成功导入${billData1.length}条数据`,
                  });
                  this.$refs.water && this.$refs.water.reload();
                } else {
                  Modal.error({
                    title: "导入失败",
                    content: "数据上传出错",
                  });
                }
              })
              .catch(() => {
                Modal.error({
                  title: "导入失败",
                  content: "数据上传出错",
                });
              })
              .finally(() => {
                hide();
              });
          }
        } catch (error) {
          hide();
          Modal.error({
            title: "导入失败",
            content: error.message,
          });
          console.log(error);
        }
      };
      reader.readAsArrayBuffer(file);
      return false;
    },
    /* 导入农村地下水文件 */
    importFileBottom(file) {
      const hide = this.$message.loading("导入中..", 0);
      let reader = new FileReader();
      reader.onload = (e) => {
        try {
          let data = new Uint8Array(e.target.result);
          let workbook = XLSX.read(data, {
            type: "array",
          });
          //0.昼间数据 1.夜间数据 2.其他信息
          let sheetNames = workbook.SheetNames;
          // 解析成二维数组
          let aoa1 = XLSX.utils.sheet_to_json(
            workbook.Sheets[sheetNames[0]], {
            header: 1,
          });

          const drinkingWaterVillageList = aoa1.filter((item) => {
            return (
            item.length >= 40 && item[0] && !item[0].includes("点位代码") && !item[0].includes("导出人") && !item[0].includes("地下水")
            );
          });

          // 解析成对象数组
          console.log(file);
          const billName1 = file.name;
          const billData1 = utils.toVillageBottom(drinkingWaterVillageList);
          console.log(billData1);
          if (!billData1 || billData1.length == 0) {
            hide();
            Modal.error({
              title: "导入失败",
              content: "找不到可用数据",
            });

            return;
          }

          if (billData1.length > 0) {
            // 上传到服务器
            saveDrinkingWaterVillageBill({
              billName: billName1,
              regionLevel: "农村",
              waterSourceType: 2,
              drinkingWaterType: 1,
              drinkingWaterVillageList: billData1,
            })
              .then((res) => {
                if (res.data.code == 0) {
                  Modal.success({
                    title: "导入成功",
                    content: `成功导入${billData1.length}条数据`,
                  });
                  this.$refs.water && this.$refs.water.reload();
                } else {
                  Modal.error({
                    title: "导入失败",
                    content: "数据上传出错",
                  });
                }
              })
              .catch(() => {
                Modal.error({
                  title: "导入失败",
                  content: "数据上传出错",
                });
              })
              .finally(() => {
                hide();
              });
          }
        } catch (error) {
          hide();
          Modal.error({
            title: "导入失败",
            content: error.message,
          });
          console.log(error);
        }
      };
      reader.readAsArrayBuffer(file);
      return false;
    },
    //下载文件
    download(filename, fileType) {
      if (fileType == "xls") {
        downloadTemplatexls(filename);
      } else if (fileType == "xlsm") {
        downloadTemplatexlsm(filename);
      } else if (fileType == "xlsx") {
        downloadTemplate(filename);
      }
    },
  },
};
</script>

<style scoped lang="less">
</style>