From 4076c14a8eac96cd716522f2cb15dcda0eb4fcef Mon Sep 17 00:00:00 2001 From: 马宇豪 <978517621@qq.com> Date: 星期三, 10 四月 2024 08:37:53 +0800 Subject: [PATCH] 新修改 --- src/views/monitorData/daily/index.vue | 177 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 170 insertions(+), 7 deletions(-) diff --git a/src/views/monitorData/daily/index.vue b/src/views/monitorData/daily/index.vue index cbaf186..df56e75 100644 --- a/src/views/monitorData/daily/index.vue +++ b/src/views/monitorData/daily/index.vue @@ -1,15 +1,178 @@ <template> - <div> - 日报 - </div> + <div class="system-gas-container"> + <el-card shadow="hover"> + <div class="system-menu-search mb15"> + <el-form :inline="true" > + <el-form-item label="日期:" > + <el-date-picker + v-model="state.tableData.listQuery.searchParams.time" + type="month" + format="YYYY-MM" + value-format="YYYY-MM" + /> + </el-form-item> + <el-button size="default" type="primary" class="ml10" @click="search"> + <el-icon> + <ele-Search /> + </el-icon> + 查询 + </el-button> + <el-button size="default" class="ml10" @click="reset()"> + <el-icon> + <RefreshLeft /> + </el-icon> + 重置 + </el-button> + </el-form> + </div> + <el-table :data="state.tableData.data" style="width: 100%"> + <el-table-column align="center" prop="gmtCreate" label="日期"/> + <el-table-column align="center" prop="name" label="文件名称"/> + <el-table-column label="操作" show-overflow-tooltip width="140"> + <template #default="scope"> + <el-button size="small" text type="primary" @click="downLoad(scope.row)">下载</el-button> + </template> + </el-table-column> + </el-table> + <br /> + <el-pagination + @size-change="onHandleSizeChange" + @current-change="onHandleCurrentChange" + class="page-position" + :pager-count="5" + :page-sizes="[10, 20, 30]" + v-model:current-page="state.tableData.listQuery.pageIndex" + background + v-model:page-size="state.tableData.listQuery.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="state.tableData.total"> + </el-pagination> + <br /> + <br /> + </el-card> + </div> </template> <script setup lang="ts"> +import {onMounted, reactive, ref} from "vue"; +import { TableDailytState } from "/@/types/monitorData"; +import axios from "axios"; +import Cookies from "js-cookie"; +import { ElMessage } from 'element-plus' +import {dailyApi} from "/@/api/monitorData/daily"; +import moment from "moment/moment"; +const state = reactive<TableDailytState>({ + tableData: { + data: [ + // { + // id:'1', + // date: '2023年9月1号', + // file: [ + // { + // filename: '富城能源气体监测日报2023_09_01.docx', + // url: 'xxx' + // } + // + // ] + // } + ], + total: 0, + loading: false, + listQuery: { + pageIndex: 1, + pageSize: 10, + searchParams:{ + time: '' + } + } + } +}); + +onMounted( + () => { + getNowTime(); + initDailyData() + } +); + +const initDailyData = async () => { + const param = { + pageIndex: state.tableData.listQuery.pageIndex, + pageSize: state.tableData.listQuery.pageSize, + searchParams: { + year: state.tableData.listQuery.searchParams.time.substring(0,4), + month: state.tableData.listQuery.searchParams.time.substring(5,7) + } + } + let res = await dailyApi().getDaily(param); + if(res.data.code == 100) { + state.tableData.data = res.data.data; + state.tableData.total = res.data.total; + state.tableData.listQuery.pageIndex = res.data.pageIndex; + state.tableData.listQuery.pageSize = res.data.pageSize; + } + + console.log("数据列表",res) +}; +const getNowTime = () => { + let isDate = new Date() + const year = isDate.getFullYear(); + const month = isDate.getMonth() + 1; + state.tableData.listQuery.searchParams.time = (year + "-" + (month >= 10 ? month : "0" + month)).toString(); +} +const onHandleSizeChange = (val: number) => { + state.tableData.listQuery.pageSize = val; + initDailyData(); +}; +// 分页改变 +const onHandleCurrentChange = (val: number) => { + state.tableData.listQuery.pageIndex = val; + initDailyData(); +}; +const downLoad = (file: any) => { + console.log("file",file) + axios.get(import.meta.env.VITE_API_URL + file.fileUrl, { + headers: { + 'Content-Type': 'application/json', + 'tk': `${Cookies.get('token')}`, + 'uid':`${Cookies.get('uid')}` + }, + responseType: 'blob' + }).then(res => { + if (res) { + const link = document.createElement('a') + let blob = new Blob([res.data], { + type: res.data.type + }) + link.style.display = "none"; + link.href = URL.createObjectURL(blob); // 创建URL + link.setAttribute("download", file.name); + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + ElMessage({ + message: '下载成功', + type: 'success', + }) + } else { + ElMessage({ + message: '获取文件失败', + type: 'error', + }) + } + }) +} +const search = () => { + state.tableData.listQuery.pageIndex = 1; + initDailyData(); + console.log("vla",state.tableData.listQuery.searchParams) +} +const reset = () => { + getNowTime(); + initDailyData(); +} </script> - - - <style scoped lang="scss"> -</style> \ No newline at end of file +</style> -- Gitblit v1.9.2