江河水数据采集代码优化

src/views/water/river/collect/index.vue

@@ -2,29 +2,32 @@
   <div class="ele-body">
     <a-card style="width: 100%" :bordered="false">
       <template #title>
-        <div>
-          <a-space>
-            <a-upload
-              :before-upload="importFileCity"
-              :showUploadList="false"
-              accept=".xls,.xlsx,.csv"
-            >
+        <a-dropdown>
+          <a-upload :before-upload="importFileCity" :showUploadList="false" accept=".xls,.xlsx,.csv">
             <a-button>江河导入</a-button>
-            </a-upload>
-            <a-button @click="showModal" >水功能区导入</a-button>
-            <a-modal v-model:visible="visible" title="水功能区导入" :footer="null">
-              <a-select  allowClear placeholder="请选择行政级别"  @change="currentVal" style="width:150px"> 
-                <a-select-option :value="'1'">国家级水功能</a-select-option>
-                <a-select-option :value="'2'">区控水站水功能</a-select-option>
-              </a-select>
-              <a-upload
-              :before-upload="importFileFunctionArea"
-              :showUploadList="false"
-              accept=".xls,.xlsx,.csv">
-                  <a-button key="submit" type="primary" :loading="loading">导入</a-button>
-              </a-upload>
-          </a-modal>
-            <a-button @click="showModalWater" >水站导入</a-button>
+          </a-upload>
+        </a-dropdown>
+        <a-dropdown>
+          <template #overlay>
+            <a-menu>
+              <a-menu-item>
+                <a-upload :before-upload="importFileFunctionArea" @change="currentVal(1)" :showUploadList="false" accept=".xls,.xlsx,.csv">
+                  国家级水功能
+                </a-upload>
+              </a-menu-item>
+              <a-menu-item>
+                <a-upload :before-upload="importFileFunctionArea" @change="currentVal(2)" :showUploadList="false" accept=".xls,.xlsx,.csv">
+                  区控水站水功能
+                </a-upload>
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button>
+            水功能区导入
+            <DownOutlined />
+          </a-button>
+        </a-dropdown>
+        <a-button @click="showModalWater" >水站导入</a-button>
             <a-modal v-model:visible="visibleWater" title="水站导入" :footer="null">
                <a-select allowClear placeholder="请选择站名"   @change="currentSel" style="width:150px">
                 <a-select-option
@@ -41,36 +44,22 @@
                   <a-button key="submit" type="primary" :loading="loading">导入</a-button>
               </a-upload>
           </a-modal>
-          <a-button @click="templateExp" >模板下载</a-button>
-          <a-modal v-model:visible="visibleTemplate" title="模板下载" :footer="null">
-            <div>
-              <a-button @click="downloadRiver">江河模板下载</a-button>
-            </div>
-            <div>
-              <a-button @click="downloadNational">国家级水功能模板下载</a-button>
-              <a-button @click="downloadWater">区控水功能模板下载</a-button>
-            </div>
-            <div>
-              <a-button @click="downloadState">国家水站模板下载</a-button>
-              <a-button @click="downloadCity">广西水站模板下载</a-button>
-            </div>
-           </a-modal>
-        </a-space>
-        </div>
-        <!-- <div>
-          <a-space align="center" style="margin-top: 10px;">
-            <a-button @click="downloadRiver">江河模板下载</a-button>
-            <a-button @click="downloadNational">国家级水功能模板下载</a-button>
-            <a-button @click="downloadState">国家水站模板下载</a-button>
-          </a-space>
-        </div>
-        <div>
-          <a-space align="center" style="margin-top: 10px;">
-            <a-button > </a-button>
-            <a-button @click="downloadWater" style="margin-left:85px">区控水功能模板下载</a-button>
-            <a-button @click="downloadCity" style="margin-left:13px">广西水站模板下载</a-button>
-          </a-space>
-        </div> -->
+        <a-dropdown>
+          <template #overlay>
+            <a-menu style="word-spacing:10px;">
+              <a-menu-item @click="download('江河-断面共享数据表','xls')"> 江河-断面共享数据表 </a-menu-item>
+              <a-menu-item @click="download('水功能区-国家级水功能区数据表','xlsx')"> 水功能区-国家级水功能区数据表 </a-menu-item>
+              <a-menu-item @click="download('水功能区-自治区级水站月均值数据表','xls')"> 水功能区-自治区级水站月均值数据表</a-menu-item>
+              <a-menu-item @click="download('水站-国家级水站历史数据表','xlsx')"> 水站-国家级水站历史数据表</a-menu-item>
+              <a-menu-item @click="download('水站-自治区级水站均值数据报表','xlsx')" style="word-spacing:3px">水站-自治区级水站均值数据报表
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button type="primary" style="left: 60px">
+            模板下载
+            <DownOutlined />
+          </a-button>
+        </a-dropdown>
       </template>
       <a-tabs v-model:activeKey="activeKey">
         <a-tab-pane tab="江河信息" key="water">
@@ -88,79 +77,60 @@
 </template>
 
 <script>
-import XLSX from "xlsx";
-import utils from "./utils";
-import {Modal} from "ant-design-vue";
-import WaterBill from "./water-bill.vue";
-import FunctionBill from "../../water-function-area/collect/water-bill"
-import StationBill from "../../river-station/collect/water-bill"
-import {saveWaterFunctionAreaBill} from "@/api/ecology/water-function-area"
-import {saveRiverBill} from "@/api/ecology/river";
-import {saveRiverStationBill} from "@/api/ecology/river-station";
+  import XLSX from "xlsx";
+  import utils from "./utils";
+  import {
+    Modal
+  } from "ant-design-vue";
+  import WaterBill from "./water-bill.vue";
+  import FunctionBill from "../../water-function-area/collect/water-bill"
+  import StationBill from "../../river-station/collect/water-bill"
+  import {
+    DownOutlined
+  } from "@ant-design/icons-vue";
+  import {
+    saveWaterFunctionAreaBill
+  } from "@/api/ecology/water-function-area"
+  import {
+    saveRiverBill
+  } from "@/api/ecology/river";
+  import {
+    saveRiverStationBill
+  } from "@/api/ecology/river-station";
 
-import {listInfo} from "@/api/ecology/water/river-water";
+  import {
+    listInfo
+  } from "@/api/ecology/water/river-water";
 
-import {saveRiverSiteBill} from "@/api/ecology/river-site";
-import {downloadRiverTemplate} from "@/utils/excel-util";
+  import {
+    saveRiverSiteBill
+  } from "@/api/ecology/river-site";
+  import {
+    downloadTemplatexls,
+    downloadTemplate
+  } from "@/utils/excel-util";
+  export default {
+    name: "RiverCollectIndex",
 
-export default {
-  name: "RiverCollectIndex",
-  
-  components: {
-    WaterBill,
-    FunctionBill,
-    StationBill
-  },
-  data() {
-    return {
-      activeKey: "functionWater",
-      visible: false,
-      exportType:String,
-      visibleWater:false,
-      visibleTemplate:false,
-      form:{},
-      param:{}
-    };
-  },
-  methods: {
-    //模板下载
-    downloadRiver() {
-      let filename = "江河"
-      downloadRiverTemplate(filename)
+    components: {
+      WaterBill,
+      FunctionBill,
+      DownOutlined,
+      StationBill
     },
-    downloadNational() {
-      let filename = "国家级水功能区"
-      downloadRiverTemplate(filename)
+    data() {
+      return {
+        activeKey: "functionWater",
+        visible: false,
+        exportType: String,
+        visibleWater: false,
+        form: [],
+        param: {}
+      };
     },
-    downloadWater() {
-      let filename = "区控水功能区"
-      downloadRiverTemplate(filename)
-    },
-    downloadState() {
-      let filename = "国家水站"
-      downloadRiverTemplate(filename)
-    },
-    downloadCity() {
-      let filename = "广西水站"
-      downloadRiverTemplate(filename)
-    },
-    currentSel(selVal) {
-        this.param.waterStationPointId = selVal.waterStationPointId;
-        this.param.riverName = selVal.riverName;
-        this.param.stationName = selVal.stationName;
-        this.param.system = selVal.system;
-        this.param.waterTarget = selVal.waterTarget;
-    },
-    currentVal(val) {
-        this.exportType = val;
-    },
-    showModal(){
-      this.visible = true;
-    },
-    templateExp(){
-      this.visibleTemplate = true;
-    },
-    showModalWater(){
+    
+    methods: {
+      showModalWater(){
       listInfo().then((res) => {
             if (res.data.code == 0) {
               console.log(res.data.data)
@@ -171,302 +141,325 @@ export default {
             }
           })
     },
-    /* 导入本地excel文件 */
-    importFileCity(file) {
-      const hide = this.$message.loading("导入中..", 0);
+      //模板下载
+      download(filename, fileType) {
+        if (fileType == "xls") {
+          downloadTemplatexls(filename);
+        } else if (fileType == "xlsx") {
+          downloadTemplate(filename);
+        }
+      },
+      currentSel(selVal) {
+        this.param.waterStationPointId = selVal.waterStationPointId;
+        this.param.riverName = selVal.riverName;
+        this.param.stationName = selVal.stationName;
+        this.param.system = selVal.system;
+        this.param.waterTarget = selVal.waterTarget;
+      },
+      currentVal(val) {
+        this.exportType = val;
+      },
+      showModal() {
+        this.visible = true;
+      },
+      /* 导入本地excel文件 */
+      importFileCity(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 aoa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[0]], {
-            header: 1,
-          });
-
-          const reportDate = aoa[1][0].replace(/[^\d]+/g, "-");
-
-          const riverList = aoa.filter(
-            (item) => {
-              return item.length >= 30 && item[0] && item[0] != "断面编码"
-            }
-          );
-
-
-          // 解析成对象数组
-          const billName = file.name;
-          const billData = utils.toObjData(riverList);
-          if (!billData || billData.length == 0) {
-            hide()
-            Modal.error({
-              title: "导入失败",
-              content: "找不到数据",
+        let reader = new FileReader();
+        reader.onload = (e) => {
+          try {
+            let data = new Uint8Array(e.target.result);
+            let workbook = XLSX.read(data, {
+              type: "array",
             });
-            return;
-          }
-          const tasks = [];
-          if (billData.length > 0) {
-            tasks.push(
-              saveRiverBill({
-                reportTime: new Date(reportDate).getTime(),
-                billName: billName,
-                regionLevel: "市级",
-                surfaceWaterSectionList: billData,
-              })
+            //0.昼间数据 1.夜间数据 2.其他信息
+            let sheetNames = workbook.SheetNames;
+            // 解析成二维数组
+            let aoa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[0]], {
+              header: 1,
+            });
+
+            const reportDate = aoa[1][0].replace(/[^\d]+/g, "-");
+
+            const riverList = aoa.filter(
+              (item) => {
+                return item.length >= 30 && item[0] && item[0] != "断面编码"
+              }
             );
-          }
 
 
-          // 上传到服务器
+            // 解析成对象数组
+            const billName = file.name;
+            const billData = utils.toObjData(riverList);
+            if (!billData || billData.length == 0) {
+              hide()
+              Modal.error({
+                title: "导入失败",
+                content: "找不到数据",
+              });
+              return;
+            }
+            const tasks = [];
+            if (billData.length > 0) {
+              tasks.push(
+                saveRiverBill({
+                  reportTime: new Date(reportDate).getTime(),
+                  billName: billName,
+                  regionLevel: "市级",
+                  surfaceWaterSectionList: billData,
+                })
+              );
+            }
 
-          Promise.all(tasks)
-            .then((res) => {
-              if (res[0].data.code == 0) {
-                Modal.success({
-                  title: "导入成功",
-                  content: `成功导入${billData.length}条数据`,
-                });
-                this.$refs.water && this.$refs.water.reload();
-              } else {
+
+            // 上传到服务器
+
+            Promise.all(tasks)
+              .then((res) => {
+                if (res[0].data.code == 0) {
+                  Modal.success({
+                    title: "导入成功",
+                    content: `成功导入${billData.length}条数据`,
+                  });
+                  this.$refs.water && this.$refs.water.reload();
+                } else {
+                  Modal.error({
+                    title: "导入失败",
+                    content: "数据上传出错",
+                  });
+                }
+
+              })
+              .catch(() => {
                 Modal.error({
                   title: "导入失败",
                   content: "数据上传出错",
                 });
-              }
-
-            })
-            .catch(() => {
-              Modal.error({
-                title: "导入失败",
-                content: "数据上传出错",
+              })
+              .finally(() => {
+                hide();
               });
-            })
-            .finally(() => {
-              hide();
-            });
-        } catch (error) {
-          hide();
-          Modal.error({
-            title: "导入失败",
-            content: error.message,
-          });
-        }
-        // console.log(billData);
-      };
-      reader.readAsArrayBuffer(file);
-
-      return false;
-    },
-    importFileFunctionArea(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 aoa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[0]], {
-            header: 1,
-          });
-          const riverList = aoa.filter(
-            (item) => {
-              console.log("export"+this.exportType)
-              if(this.exportType == "1"){  //国家级水功能
-                return item.length >= 30 && item[8] && item[8] != "水体类型"
-              }else{ //区控水站水功能模板
-                return item[6] && item[6] != "站点名称"
-              }
-             
-            }
-          );
-          console.log(riverList)
-          // 解析成对象数组
-          const billName = file.name;
-          var billData;
-          if(this.exportType == "1"){
-            billData = utils.toNationalLevelDataObj(riverList);
-          }else{
-            billData = utils.towaterStationDataObj(riverList);
-          }
-         
-          if (!billData || billData.length == 0) {
-            hide()
+          } catch (error) {
+            hide();
             Modal.error({
               title: "导入失败",
-              content: "找不到数据",
+              content: error.message,
             });
-            return;
           }
-          const tasks = [];
-          if (billData.length > 0) {
-            if(this.exportType == "1"){
-               tasks.push(
+          // console.log(billData);
+        };
+        reader.readAsArrayBuffer(file);
+
+        return false;
+      },
+      importFileFunctionArea(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 aoa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[0]], {
+              header: 1,
+            });
+            const riverList = aoa.filter(
+              (item) => {
+                console.log("export" + this.exportType)
+                if (this.exportType == "1") { //国家级水功能
+                  return item.length >= 30 && item[8] && item[8] != "水体类型"
+                } else { //区控水站水功能模板
+                  return item[6] && item[6] != "站点名称"
+                }
+
+              }
+            );
+            console.log(riverList)
+            // 解析成对象数组
+            const billName = file.name;
+            var billData;
+            if (this.exportType == "1") {
+              billData = utils.toNationalLevelDataObj(riverList);
+            } else {
+              billData = utils.towaterStationDataObj(riverList);
+            }
+
+            if (!billData || billData.length == 0) {
+              hide()
+              Modal.error({
+                title: "导入失败",
+                content: "找不到数据",
+              });
+              return;
+            }
+            const tasks = [];
+            if (billData.length > 0) {
+              if (this.exportType == "1") {
+                tasks.push(
                   saveWaterFunctionAreaBill({
                     billName: billName,
-                    regionLevel:this.exportType,
+                    regionLevel: this.exportType,
                     nationalLevelWaterFunctionAreaList: billData,
                   })
                 );
-              }else{
+              } else {
                 tasks.push(
                   saveRiverStationBill({
                     billName: billName,
-                    regionLevel:this.exportType,
+                    regionLevel: this.exportType,
                     waterStationWaterFunctionAreaList: billData,
                   })
                 );
               }
-              
-          }
-          // 上传到服务器
-          console.log(tasks);
-          Promise.all(tasks)
-            .then((res) => {
-              if (res[0].data.code == 0) {
-                Modal.success({
-                  title: "导入成功",
-                  content: `成功导入${billData.length}条数据`,
-                });
-                this.visible=false;
-                this.$refs.functionWater && this.$refs.functionWater.reload();
-              } else {
-                Modal.error({
-                  title: "导入失败",
-                  content: res[0].data.msg,
-                });
-              }
 
-            })
-            .catch(() => {
-              Modal.error({
-                title: "导入失败",
-                content: "数据上传出错",
-              });
-            })
-            .finally(() => {
-              hide();
-            });
-        } catch (error) {
-          hide();
-          Modal.error({
-            title: "导入失败",
-            content: error.message,
-          });
-        }
-        // console.log(billData);
-      };
-      reader.readAsArrayBuffer(file);
-
-      return false;
-    },
-    importFileStation(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",
-            cellDates:true
-          });
-          let sheetNames = workbook.SheetNames;
-          // 解析成二维数组
-          let aoa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[0]], {
-            header: 1,
-          });
-          const riverList = aoa.filter(
-            (item) => {
-              if(this.param.system == "1"){
-                return item[1] && item[1] != "时间"
-              }else{
-              
-                return item[2] && item[2] != "时间" && item[2] != "三类标准"&& item[2] != "平均值"&& item[2] != "最大值"&& item[2] != "最小值"&& item[2] != "有效数据个数"&& item[2] != "总数据个数"
-              }
-              
             }
-          );
-          console.log(riverList)
-          // 解析成对象数组
-          const billName = file.name;
-          var billData;
-          if(this.param.system == "1"){ //国家系统
-            billData = utils.toRiverStationObjData(riverList,this.param);
-          }else{
-            billData = utils.toCityStationObjData(riverList,this.param);
-          }
-          
-          if (!billData || billData.length == 0) {
-            hide()
-            Modal.error({
-              title: "导入失败",
-              content: "找不到数据",
-            });
-            return;
-          }
-          const tasks = [];
-          if (billData.length > 0) {
-            tasks.push(
-              saveRiverSiteBill({
-                billName: billName,
-                systemType:this.param.system,
-                waterSiteList: billData,
-              })
-            );
-          }
-          // 上传到服务器
+            // 上传到服务器
+            console.log(tasks);
+            Promise.all(tasks)
+              .then((res) => {
+                if (res[0].data.code == 0) {
+                  Modal.success({
+                    title: "导入成功",
+                    content: `成功导入${billData.length}条数据`,
+                  });
+                  this.visible = false;
+                  this.$refs.functionWater && this.$refs.functionWater.reload();
+                } else {
+                  Modal.error({
+                    title: "导入失败",
+                    content: res[0].data.msg,
+                  });
+                }
 
-          Promise.all(tasks)
-            .then((res) => {
-              if (res[0].data.code == 0) {
-                Modal.success({
-                  title: "导入成功",
-                  content: `成功导入${billData.length}条数据`,
-                });
-                this.visibleWater=false;
-                this.$refs.station && this.$refs.station.reload();
-              } else {
+              })
+              .catch(() => {
                 Modal.error({
                   title: "导入失败",
                   content: "数据上传出错",
                 });
-              }
+              })
+              .finally(() => {
+                hide();
+              });
+          } catch (error) {
+            hide();
+            Modal.error({
+              title: "导入失败",
+              content: error.message,
+            });
+          }
+          // console.log(billData);
+        };
+        reader.readAsArrayBuffer(file);
 
-            })
-            .catch(() => {
+        return false;
+      },
+      importFileStation(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",
+              cellDates: true
+            });
+            let sheetNames = workbook.SheetNames;
+            // 解析成二维数组
+            let aoa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[0]], {
+              header: 1,
+            });
+            const riverList = aoa.filter(
+              (item) => {
+                if (this.param.system == "1") {
+                  return item[1] && item[1] != "时间"
+                } else {
+
+                  return item[2] && item[2] != "时间" && item[2] != "三类标准" && item[2] != "平均值" && item[2] != "最大值" &&
+                    item[2] != "最小值" && item[2] != "有效数据个数" && item[2] != "总数据个数"
+                }
+
+              }
+            );
+            console.log(riverList)
+            // 解析成对象数组
+            const billName = file.name;
+            var billData;
+            if (this.param.system == "1") { //国家系统
+              billData = utils.toRiverStationObjData(riverList, this.param);
+            } else {
+              billData = utils.toCityStationObjData(riverList, this.param);
+            }
+
+            if (!billData || billData.length == 0) {
+              hide()
               Modal.error({
                 title: "导入失败",
-                content: "数据上传出错",
+                content: "找不到数据",
               });
-            })
-            .finally(() => {
-              hide();
-            });
-        } catch (error) {
-          hide();
-          Modal.error({
-            title: "导入失败",
-            content: error.message,
-          });
-        }
-        // console.log(billData);
-      };
-      reader.readAsArrayBuffer(file);
+              return;
+            }
+            const tasks = [];
+            if (billData.length > 0) {
+              tasks.push(
+                saveRiverSiteBill({
+                  billName: billName,
+                  systemType: this.param.system,
+                  waterSiteList: billData,
+                })
+              );
+            }
+            // 上传到服务器
 
-      return false;
+            Promise.all(tasks)
+              .then((res) => {
+                if (res[0].data.code == 0) {
+                  Modal.success({
+                    title: "导入成功",
+                    content: `成功导入${billData.length}条数据`,
+                  });
+                  this.visibleWater = false;
+                  this.$refs.station && this.$refs.station.reload();
+                } else {
+                  Modal.error({
+                    title: "导入失败",
+                    content: "数据上传出错",
+                  });
+                }
+
+              })
+              .catch(() => {
+                Modal.error({
+                  title: "导入失败",
+                  content: "数据上传出错",
+                });
+              })
+              .finally(() => {
+                hide();
+              });
+          } catch (error) {
+            hide();
+            Modal.error({
+              title: "导入失败",
+              content: error.message,
+            });
+          }
+          // console.log(billData);
+        };
+        reader.readAsArrayBuffer(file);
+
+        return false;
+      },
     },
-  },
-};
+  };
+
 </script>
 
 <style scoped lang="less">