feat:水雨情统计

src/views/report/jbmonth/index.vue

@@ -231,7 +231,7 @@
                   </div>
                 </div>
               </div>
-              <el-table id="el-table3" class="report-table" :data="briefingData.fubiao3" border show-summary :summary-method="getSummaries" :span-method="getSpanMethod">
+              <el-table id="el-table3" class="report-table" :data="briefingData.fubiao3" border show-summary :summary-method="getSummaries">
                 <el-table-column prop="type" label="类型" :align="alignment" width="200"></el-table-column>
                 <el-table-column prop="stnm" label="水库名称" :align="alignment" width="200"></el-table-column>
                 <el-table-column label="控制蓄水" :align="alignment">
@@ -379,11 +379,22 @@
 
   // 下载按纽操作
   const handleExport = () => {
-    window.download('/report/jbmonthexport?year=' + queryParams.year + '&month=' + queryParams.month +
+    const params = new URLSearchParams({
-      '&startDate=' + queryParams.startDate + '&endDate=' + queryParams.endDate +
+      year: queryParams.year,
-      "&startDateRiver=" + queryParams.startDateRiver + "&endDateRiver=" + queryParams.endDateRiver +
+      month: queryParams.month,
-      "&startDateRsvr=" + queryParams.startDateRsvr + "&endDateRsvr=" + queryParams.endDateRsvr, {},
+      startDate: queryParams.startDate,
-      queryParams.year + '年' + queryParams.month + `月水雨情简报.doc`)
+      endDate: queryParams.endDate,
+      startDateRiver: queryParams.startDateRiver,
+      endDateRiver: queryParams.endDateRiver,
+      startDateRsvr: queryParams.startDateRsvr,
+      endDateRsvr: queryParams.endDateRsvr
+    }).toString();
+
+    proxy.download(
+      `/report/jbmonthexport?${params}`,
+      {},
+      `${queryParams.year}年${queryParams.month}月水雨情简报.doc`
+    )
   }
 </script>
 <style scoped lang="scss">

src/views/report/jbsyq/index.vue

@@ -0,0 +1,164 @@
+<template>
+  <div class="app-container app-container-bg">
+    <el-card class="first-card" ref='firstCard' shadow="always">
+      <el-form :model="queryParams" ref="queryForm" :inline="true" @submit.native.prevent>
+        <el-form-item label="查询日期" prop="year">
+          <el-date-picker style="width: 150px" v-model="queryParams.selectDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="选择查询日期">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="常年区间">
+          <el-date-picker style="width: 90px" v-model="queryParams.startYear" type="year" value-format="YYYY" format="YYYY" placeholder="起">
+          </el-date-picker>至
+          <el-date-picker style="width: 90px" v-model="queryParams.endYear" type="year" value-format="YYYY" format="YYYY" placeholder="止">
+          </el-date-picker>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">查询</el-button>
+          <el-button type="warning" icon="Download" @click="handleExport">下载</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <div class="el-card-p card-shadow carder-border mt10 pad10 container-box scroll-bar" v-loading="fullscreenLoading">
+      <div class="briefing" v-if="showBriefing">
+        <div class="briefing-content">
+          <div class="suojin">
+            <p class="type-title ">一、河网水情</p>
+            <p class="paragraph ">{{briefingData.river1}}</p>
+          </div>
+
+          <div class="suojin">
+            <p class="type-title ">二、水库水情</p>
+            <p class="paragraph ">{{briefingData.rsvr}}</p>
+            <p class="paragraph ">{{briefingData.river2}}</p>
+          </div>
+        </div>
+      </div>
+      <el-empty v-else description="暂无数据" />
+    </div>
+  </div>
+</template>
+<script setup>
+  import dayjs from 'dayjs'
+  import { reactive, ref, computed } from 'vue'
+  const { proxy } = getCurrentInstance()
+
+  const queryParams = reactive({
+    selectDate: '',
+    endYear: dayjs().format('YYYY'),
+    startYear: '1964',
+  })
+
+  const fullscreenLoading = ref(false)
+  const showBriefing = ref(false)
+  const briefingData = ref({})
+  const alignment = 'center'
+
+  // 查询按钮操作
+  const handleQuery = async () => {
+    fullscreenLoading.value = true
+    showBriefing.value = false
+    try {
+      const res = await proxy.axiosGet('/report/river_report', queryParams)
+      if (res.code == 0) {
+        let data = res.data
+        briefingData.value = data
+        showBriefing.value = true
+      }
+    } finally {
+      fullscreenLoading.value = false
+    }
+  }
+
+  // 下载按钮操作
+  const handleExport = () => {
+    if (!showBriefing.value || !briefingData.value) {
+      proxy.$message.warning('暂无数据可导出')
+      return
+    }
+
+    // 构建文档内容
+    const content = `
+    <html xmlns:o='urn:schemas-microsoft-com:office:office' 
+          xmlns:w='urn:schemas-microsoft-com:office:word' 
+          xmlns='http://www.w3.org/TR/REC-html40'>
+    <head>
+      <meta charset='utf-8'>
+      <title>简报</title>
+    </head>
+    <body>
+      <div>
+        <div style="text-indent: 2em;">
+          <p style="font-size: 32px; height: 50px; font-weight: bold;">一、河网水情</p>
+          <p style="font-family: FangSong; font-size: 20px; letter-spacing: 2px; line-height: 1.6;">${briefingData.value.river1 || ''}</p>
+        </div>
+        
+        <div style="text-indent: 2em;">
+          <p style="font-size: 32px; height: 50px; font-weight: bold;">二、水库水情</p>
+          <p style="font-family: FangSong; font-size: 20px; letter-spacing: 2px; line-height: 1.6;">${briefingData.value.rsvr || ''}</p>
+          <p style="font-family: FangSong; font-size: 20px; letter-spacing: 2px; line-height: 1.6;">${briefingData.value.river2 || ''}</p>
+        </div>
+      </div>
+    </body>
+    </html>
+  `
+
+    // 创建 Blob 对象
+    const blob = new Blob([content], {
+      type: 'application/msword;charset=utf-8'
+    })
+
+    // 创建下载链接
+    const link = document.createElement('a')
+    const fileName = `水雨情统计简报_${queryParams.selectDate || dayjs().format('YYYY-MM-DD')}.doc`
+
+    if (window.Blob && window.navigator.msSaveOrOpenBlob) {
+      // IE
+      window.navigator.msSaveOrOpenBlob(blob, fileName)
+    } else {
+      // 其他浏览器
+      const url = window.URL.createObjectURL(blob)
+      link.href = url
+      link.download = fileName
+      link.click()
+      window.URL.revokeObjectURL(url)
+    }
+  }
+</script>
+<style scoped lang="scss">
+  .briefing {
+    width: 92%;
+    margin: 0 auto;
+
+    /* 简报主体内容 */
+    .briefing-content {
+      font-family: FangSong;
+
+      .suojin {
+        text-indent: 2em;
+
+      }
+
+
+      .paragraph {
+        font-size: 20px;
+        letter-spacing: 2px;
+        line-height: 1.6;
+      }
+
+      .type-title {
+        font-size: 32px;
+        height: 50px;
+        font-weight: bold;
+      }
+
+
+    }
+
+
+  }
+
+  :deep(.el-scrollbar__view) {
+    display: inline !important;
+  }
+</style>

src/views/report/jbweek/index.vue

@@ -0,0 +1,262 @@
+<template>
+  <div class="app-container app-container-bg">
+    <el-card class="first-card" ref='firstCard' shadow="always">
+      <el-form :model="queryParams" ref="queryForm" :inline="true" @submit.native.prevent>
+        <el-form-item label="查询日期" prop="year">
+          <el-date-picker style="width: 150px" v-model="queryParams.selectDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="选择查询日期">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="雨量统计年">
+          <el-date-picker style="width: 90px" v-model="queryParams.startYear" type="year" value-format="YYYY" format="YYYY" placeholder="起">
+          </el-date-picker>至
+          <el-date-picker style="width: 90px" v-model="queryParams.endYear" type="year" value-format="YYYY" format="YYYY" placeholder="止">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="河道统计年">
+          <el-date-picker style="width: 90px" v-model="queryParams.startYear2" type="year" value-format="YYYY" format="YYYY" placeholder="起">
+          </el-date-picker>至
+          <el-date-picker style="width: 90px" v-model="queryParams.endYear2" type="year" value-format="YYYY" format="YYYY" placeholder="止">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="水库统计年">
+          <el-date-picker style="width: 90px" v-model="queryParams.startYear3" type="year" value-format="YYYY" format="YYYY" placeholder="起">
+          </el-date-picker>至
+          <el-date-picker style="width: 90px" v-model="queryParams.endYear3" type="year" value-format="YYYY" format="YYYY" placeholder="止">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">查询</el-button>
+          <el-button type="warning" icon="Download" @click="handleExport">下载</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <div class="el-card-p card-shadow carder-border mt10 pad10 container-box scroll-bar" v-loading="fullscreenLoading">
+      <div class="briefing" v-if="showBriefing">
+        <div class="briefing-title text-center mt20">水雨情简报</div>
+        <div class="briefing-name-date">
+          <div class="briefing-name">{{stationName}}</div>
+        </div>
+        <hr style="color: red;height: 2px;border-top: 2px solid red;" />
+        <div class="briefing-content">
+          <div class="content-title text-center mt50 mb50">{{briefingData.title}}</div>
+          <div class="suojin">
+            <p class="type-title ">一、雨情</p>
+            <p class="paragraph ">1、上周及近期回顾</p>
+            <p class="paragraph ">{{briefingData.lastWeekRain1}}</p>
+            <p class="paragraph ">{{briefingData.lastWeekRain2}}</p>
+            <p class="paragraph ">2、今年回顾</p>
+            <p class="paragraph ">{{briefingData.yearRain}}</p>
+          </div>
+
+          <div class="suojin">
+            <p class="type-title ">二、水情</p>
+            <p class="paragraph ">1、水库水情</p>
+            <p class="paragraph ">{{briefingData.rsvr}}</p>
+            <p class="paragraph ">2、河网水情</p>
+            <p class="paragraph ">{{briefingData.river1}}</p>
+            <p class="paragraph ">{{briefingData.river2}}</p>
+          </div>
+        </div>
+      </div>
+      <el-empty v-else description="暂无数据" />
+    </div>
+  </div>
+</template>
+<script setup>
+  import dayjs from 'dayjs'
+  import { reactive, ref, computed } from 'vue'
+  const { proxy } = getCurrentInstance()
+
+  const queryParams = reactive({
+    selectDate: '',
+    endYear: dayjs().format('YYYY'),
+    startYear: '1964',
+    startYear2: '1964',
+    endYear2: dayjs().format('YYYY'),
+    startYear3: '1964',
+    endYear3: dayjs().format('YYYY'),
+  })
+
+  const stationName = '余姚水文站'
+  const fullscreenLoading = ref(false)
+  const showBriefing = ref(false)
+  const briefingData = ref({})
+  const alignment = 'center'
+  // 查询按钮操作
+  const handleQuery = async () => {
+    fullscreenLoading.value = true
+    showBriefing.value = false
+    try {
+      const res = await proxy.axiosGet('/report/week_report', queryParams)
+      if (res.code == 0) {
+        let data = res.data
+        data.title = data.m + "月第" + data.weekIndex + "周水雨情简况"
+        briefingData.value = data
+        showBriefing.value = true
+      }
+    } finally {
+      fullscreenLoading.value = false
+    }
+  }
+  // 下载按钮操作
+  const handleExport = () => {
+    // const params = new URLSearchParams({
+    //   selectDate: queryParams.selectDate,
+    //   startYear: queryParams.startYear,
+    //   endYear: queryParams.endYear,
+    //   startYear2: queryParams.startYear2,
+    //   endYear2: queryParams.endYear2,
+    //   startYear3: queryParams.startYear3,
+    //   endYear3: queryParams.endYear3
+    // }).toString();
+
+    // proxy.download(
+    //   `/report/week_report_export?${params}`,
+    //   {},
+    //   `${briefingData.value.m}月第${briefingData.value.weekIndex}周水雨情周报.doc`
+    // )
+
+    if (!showBriefing.value) {
+      proxy.$message.warning('暂无数据可导出')
+      return
+    }
+
+    // 获取要导出的内容
+    const content = generateDocContent()
+
+    // 创建Blob对象
+    const blob = new Blob([content], {
+      type: 'application/msword;charset=utf-8'
+    })
+
+    // 创建下载链接
+    const link = document.createElement('a')
+    const fileName = `${briefingData.value.m}月第${briefingData.value.weekIndex}周水雨情简报.doc`
+
+    if (link.download !== undefined) {
+      // 使用 Blob URL
+      const url = URL.createObjectURL(blob)
+      link.setAttribute('href', url)
+      link.setAttribute('download', fileName)
+      link.style.visibility = 'hidden'
+      document.body.appendChild(link)
+      link.click()
+      document.body.removeChild(link)
+      URL.revokeObjectURL(url)
+    } else {
+      // 兼容旧版本浏览器
+      window.open(`data:application/msword;charset=utf-8,${encodeURIComponent(content)}`)
+    }
+  }
+
+  // 生成DOC文档内容
+  const generateDocContent = () => {
+    const data = briefingData.value
+
+    // 简单的 DOC 格式模板
+    return `
+    <html xmlns:o="urn:schemas-microsoft-com:office:office"
+          xmlns:w="urn:schemas-microsoft-com:office:word"
+          xmlns="http://www.w3.org/TR/REC-html40">
+    <head>
+      <meta charset="utf-8">
+      <title>${data.title}</title>
+    </head>
+    <body>
+      <div style="text-align:center;">
+        <p style="font-family:SimSun;color:red;font-size:36pt;font-weight:bold;letter-spacing:10px;margin:20pt 0;">
+          水雨情简报
+        </p>
+        <p style="font-family:KaiTi;font-size:18pt;text-align:right;">
+          ${stationName}
+        </p>
+        <hr style="color:red;height:2px;border-top:2px solid red;" />
+        <p style="font-family:FangSong;font-size:30pt;letter-spacing:5px;margin:40pt 0;">
+          ${data.title}
+        </p>
+      </div>
+      
+      <div style="font-family:FangSong;">
+        <p style="font-size:24pt;font-weight:bold;margin:20pt 0;">一、雨情</p>
+        
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">1、上周及近期回顾</p>
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">${data.lastWeekRain1 || ''}</p>
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">${data.lastWeekRain2 || ''}</p>
+        
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">2、今年回顾</p>
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">${data.yearRain || ''}</p>
+        
+        <p style="font-size:24pt;font-weight:bold;margin:20pt 0;">二、水情</p>
+        
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">1、水库水情</p>
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">${data.rsvr || ''}</p>
+        
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">2、河网水情</p>
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">${data.river1 || ''}</p>
+        <p style="font-size:20pt;margin:10pt 0;text-indent:2em;">${data.river2 || ''}</p>
+      </div>
+    </body>
+    </html>
+  `
+  }
+
+</script>
+<style scoped lang="scss">
+  .briefing {
+    width: 92%;
+    margin: 0 auto;
+
+    .briefing-title {
+      font-family: SimSun;
+      color: red;
+      font-size: 50px;
+      letter-spacing: 10px;
+      font-weight: bold;
+    }
+
+    .briefing-qishu {
+      font-family: KaiTi;
+      font-size: 18px
+    }
+
+    .briefing-name-date {
+      display: flex;
+      justify-content: space-between;
+    }
+
+    /* 简报主体内容 */
+    .briefing-content {
+      font-family: FangSong;
+
+      .suojin {
+        text-indent: 2em;
+
+      }
+
+      .content-title {
+        font-size: 40px;
+        letter-spacing: 5px;
+      }
+
+      .paragraph {
+        font-size: 20px;
+        letter-spacing: 2px;
+        line-height: 1.6;
+      }
+
+      .type-title {
+        font-size: 32px;
+        height: 50px;
+        font-weight: bold;
+      }
+
+
+    }
+
+
+  }
+
+  :deep(.el-scrollbar__view) {
+    display: inline !important;
+  }
+</style>