|
|
@@ -0,0 +1,210 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-dialog v-model="visible" title="一次性导出报告" width="500" :close-on-click-modal="false" :before-close="handleClose">
|
|
|
+
|
|
|
+ <el-form
|
|
|
+ ref="ruleFormRef"
|
|
|
+ style="max-width: 600px"
|
|
|
+ :model="ruleForm"
|
|
|
+ :rules="rules"
|
|
|
+ label-width="auto"
|
|
|
+ >
|
|
|
+ <el-form-item label="日期范围：" prop="startToEnd">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="ruleForm.startToEnd"
|
|
|
+ type="daterange"
|
|
|
+ unlink-panels
|
|
|
+ range-separator="To"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ :shortcuts="shortcuts"
|
|
|
+ format="YYYY-MM-DD"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="模板：" prop="templateId">
|
|
|
+ <el-select v-model="ruleForm.templateId" placeholder="请选择模板" style="width: 100%">
|
|
|
+ <el-option
|
|
|
+ v-for="item in tableData"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.templateName"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button @click="handleClose">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submit(ruleFormRef)" :loading="btnLoading"> 确 认 </el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+import { ref,reactive } from 'vue'
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+import { reportApi } from '@/services/api'
|
|
|
+
|
|
|
+import type { FormInstance, FormRules } from 'element-plus'
|
|
|
+const ruleFormRef = ref<FormInstance>()
|
|
|
+interface ruleFormTypes {
|
|
|
+ templateId:number | null
|
|
|
+ beginTime:string
|
|
|
+ endTime:string
|
|
|
+ startToEnd:string[]
|
|
|
+}
|
|
|
+const ruleForm = ref<ruleFormTypes>(
|
|
|
+ {
|
|
|
+ templateId: null,
|
|
|
+ beginTime:'',
|
|
|
+ endTime:'',
|
|
|
+ startToEnd: []
|
|
|
+ }
|
|
|
+)
|
|
|
+const rules = reactive<FormRules<ruleFormTypes>>({
|
|
|
+ templateId: [{ required: true, message: '请选择模板', trigger: 'change' }],
|
|
|
+ startToEnd: [{ required: true, message: '请选择时间范围', trigger: 'change' }],
|
|
|
+})
|
|
|
+
|
|
|
+const shortcuts = [
|
|
|
+ {
|
|
|
+ text: '上周',
|
|
|
+ value: () => {
|
|
|
+ const end = new Date()
|
|
|
+ const start = new Date()
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
|
|
+ return [start, end]
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ text: '上个月',
|
|
|
+ value: () => {
|
|
|
+ const end = new Date()
|
|
|
+ const start = new Date()
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
|
|
+ return [start, end]
|
|
|
+ },
|
|
|
+ },
|
|
|
+]
|
|
|
+
|
|
|
+const visible = ref(false)
|
|
|
+interface reportTemplate {
|
|
|
+ id: number
|
|
|
+ templateName: string
|
|
|
+ templatePath: string
|
|
|
+ createId: number
|
|
|
+ createTime: Date
|
|
|
+}
|
|
|
+const tableData = ref<reportTemplate[]>([])
|
|
|
+const btnLoading = ref(false)
|
|
|
+
|
|
|
+const handleClose = () => {
|
|
|
+ ruleForm.value = {
|
|
|
+ templateId: null,
|
|
|
+ beginTime:'',
|
|
|
+ endTime:'',
|
|
|
+ startToEnd: []
|
|
|
+ }
|
|
|
+ visible.value = false
|
|
|
+}
|
|
|
+
|
|
|
+const parentParams = ref({})
|
|
|
+
|
|
|
+
|
|
|
+const open = (obj: object | null) => {
|
|
|
+ parentParams.value = obj || {}
|
|
|
+ if (!tableData.value.length) {
|
|
|
+ getTemplateList()
|
|
|
+ }
|
|
|
+ btnLoading.value = false
|
|
|
+ visible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+const downLoad2 = (guid: string, fileName = 'download') => {
|
|
|
+ //获取下载地址
|
|
|
+ const href = getDownloadPath(guid)
|
|
|
+ if (!href) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const anchor = document.createElement('a')
|
|
|
+ if ('download' in anchor) {
|
|
|
+ anchor.href = href
|
|
|
+ anchor.setAttribute('download', fileName)
|
|
|
+ anchor.className = 'download-js-link'
|
|
|
+ anchor.innerHTML = 'downloading...'
|
|
|
+ anchor.style.display = 'none'
|
|
|
+ document.body.appendChild(anchor)
|
|
|
+ setTimeout(function () {
|
|
|
+ anchor.click()
|
|
|
+ document.body.removeChild(anchor)
|
|
|
+ }, 66)
|
|
|
+ return true
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//获取下载地址
|
|
|
+const getDownloadPath = (guid: string) => {
|
|
|
+ if (!guid) {
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+ return `/api/fileManager/downloadFile?fileId=${guid}`
|
|
|
+}
|
|
|
+
|
|
|
+const submit = async (formEl:FormInstance | undefined ) => {
|
|
|
+
|
|
|
+ try {
|
|
|
+ // 1. 检验表单
|
|
|
+ if (!formEl) return
|
|
|
+ await formEl.validate(async (valid, fields) => {
|
|
|
+ if (valid) {
|
|
|
+ // 2. 获取开始与结束日期
|
|
|
+ var params = {
|
|
|
+ templateId:ruleForm.value.templateId,
|
|
|
+ beginTime:ruleForm.value.startToEnd[0],
|
|
|
+ endTime:ruleForm.value.startToEnd[1]
|
|
|
+ }
|
|
|
+ // 3. 请求
|
|
|
+ btnLoading.value = true;
|
|
|
+ try {
|
|
|
+ const response = await reportApi.oneClickExportReport(params)
|
|
|
+ ElMessage.success('一键导出上月资讯报告成功')
|
|
|
+ if (response.code == 200) {
|
|
|
+ const guid = response.data
|
|
|
+ //执行下载
|
|
|
+ downLoad2(guid)
|
|
|
+ handleClose()
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ ElMessage.error('一键导出上月资讯报告失败')
|
|
|
+ } finally {
|
|
|
+ btnLoading.value = false;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ ElMessage.error('请检查参数')
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ } catch (error) {
|
|
|
+ ElMessage.error('导出报告失败')
|
|
|
+ btnLoading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const getTemplateList = async () => {
|
|
|
+ try {
|
|
|
+ const response = await reportApi.getReportTemplate()
|
|
|
+ if (response.code == 200) {
|
|
|
+ tableData.value = response.data || []
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ ElMessage.error('获取报告模板失败')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+defineExpose({
|
|
|
+ open,
|
|
|
+})
|
|
|
+</script>
|
zero