<template> <div id="main" class="h-all"> <el-container class="h-all"> <el-header height="auto"> <div class="header-button-box"> <el-button size='mini' icon="el-icon-circle-plus-outline" type="primary" v-if="createAndCopyCommand.visible" @click="createReportTaskeInit"> {{$t("common.createBtn")}} </el-button> <el-button size='mini' icon="el-icon-delete" type="danger" v-if="deleteCommand.visible" @click="deleteReportTaskInit"> {{$t("common.deleteBtn")}} </el-button> <el-button size='mini' icon="el-icon-video-play" type="success" v-if="createAndCopyCommand.visible" @click="startReportTaskInit"> {{$t("common.start")}} </el-button> <el-button size='mini' icon="el-icon-video-pause" type="warning" v-if="createAndCopyCommand.visible" @click="stopReportTaskInit"> {{$t("common.stop")}} </el-button> <div class="search-input-box"> <div class="search-input-box"> <label>{{$t('ReportTask.reportTaskName')}}:</label> <el-input size='mini' :placeholder="$t('common.placeholder')" v-model="querySelectReportTaskName" style="width: 180px" clearable> </el-input> </div> <div class="search-input-box"> <label>{{$t('ReportTask.period')}}:</label> <el-select v-model="querySelectPeriod" size="mini" :placeholder="$t('common.selectOption')" :clearable="true"> <el-option v-for="item in PeriodList" :key="item.key" :label="item.label" :value="item.key"> </el-option> </el-select> </div> <div class="search-input-box"> <label>{{$t('ReportTask.reportType')}}:</label> <el-select v-model="querySelectReportType" size="mini" :placeholder="$t('common.selectOption')" :clearable="true"> <el-option v-for="item in reportTypeList" :key="item.key" :label="item.label" :value="item.key"> </el-option> </el-select> </div> <div class="search-input-box"> <label>{{$t('ReportTask.reportTemplateName')}}:</label> <el-select v-model="querySelectReportTemplateName" size="mini" :placeholder="$t('common.selectOption')" :clearable="true"> <el-option v-for="item in reportTemplateList" :key="item.reportTemplateKey" :label="item.reportTemplateName" :value="item.reportTemplateKey"> </el-option> </el-select> </div> <div class="search-input-box"> <label>{{$t('ReportTask.taskStatus')}}:</label> <el-select v-model="querySelectStatus" size="mini" :placeholder="$t('common.selectOption')" :clearable="true"> <el-option v-for="item in StatusList" :key="item.key" :label="item.label" :value="item.key"> </el-option> </el-select> </div> <el-button icon="el-icon-search" type="primary" size = 'mini' @click="queryReportTaskDataByCondition">{{$t('common.queryBtn')}}</el-button> </div> </div> </el-header> <!-- table数据表格 --> <el-main class="adapt-height-box"> <el-table :empty-text="$t('common.noData')" tooltip-effect="dark" ref="singleTable" :data="reportTaskList" stripe header-row-class-name="table-header" cell-class-name="table-cell" class="adapt-height" height="auto" border @selection-change="handleSelectionChange"> <el-table-column type="selection" width="28"> </el-table-column> <el-table-column prop="reportTaskName" :label="$t('ReportTask.reportTaskName')"> </el-table-column> <el-table-column prop="period" :formatter='formatPeriod' :show-overflow-tooltip="true" :label="$t('ReportTask.period')"> </el-table-column> <el-table-column prop="reportTemplateName" :label="$t('ReportTask.reportTemplateName')" :show-overflow-tooltip="true"> </el-table-column> <el-table-column prop="reportType" :formatter='formatReportType' :label="$t('ReportTask.reportType')"> </el-table-column> <el-table-column prop="topN" :formatter="formatterTopN" :label="$t('ReportTask.TopNBottomN')"> </el-table-column> <el-table-column width="70px" :label="$t('ReportTask.taskStatus')"> <template slot-scope="scope"> <el-switch v-model="scope.row.status" :active-value=0 :inactive-value=1 @change="changeStatus(scope.row)"/> </template> </el-table-column> <el-table-column width="155px" v-if="updateCommand.visible" :label="$t('common.operation')"> <template slot-scope="scope"> <el-button size="mini" style="background: #53D214" :title="$t('ReportTask.viewPeriodReport')" @click="handleViewIndexTemplateDetail(scope.row)"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-chakan"></use> </svg> </el-button> <el-button size="mini" style="background: #175BE3" :title="$t('common.copyBtn')" @click="handleCopy(scope.row)"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-fuzhi"></use> </svg> </el-button> <el-button size="mini" style="background: #008000" :title="$t('common.updateBtn')" @click="handleUpdate(scope.row)"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-bianji"></use> </svg> </el-button> </template> </el-table-column> </el-table> <el-pagination background @current-change="handleCurrentChange" :current-page="currentPage" :page-size="pageSize" layout="total, prev, pager, next, jumper" :total="total"> </el-pagination> </el-main> </el-container> <CommandExecuteContext v-bind:commands="commandContext"></CommandExecuteContext> </div> </template> <script> import CommandExecuteContext from '../../commands/CommandExecuteContext' import ReportTaskCommands from '../../commands/ReportTaskCommands' import HelperUtil from '../../utils/HelperUtil' import loading from '../../utils/Loading' import ReportTaskService from '../../domain/services/ReportTaskService' import ReportTemplateService from '../../domain/services/ReportTemplateService' export default { name: 'ReportTask', components: { CommandExecuteContext }, // vue加载初始化函数,加载数据 created: function () { this.getAllReportTemplate() // this.getAllReportTask() // this.queryReportTaskDataByCondition() this.queryInit() }, // 存放数据 data: function () { return { // 命令 commandContext: {}, createAndCopyTitle: '', // 为修改传参数 multipleSelection: [], createAndCopyInitList: {}, deleteList: [], copyInitList: {}, updateInitList: {}, reportTaskList: [], reportTemplateList: [], // form参数 querySelectReportTaskName: '', querySelectPeriod: '', querySelectReportType: '', querySelectReportTemplateName: '', querySelectStatus: '', selectList: [], deviceModelList: [], PeriodList: [ { key: 5, label: this.$t('ReportTask.dayReport') }, { key: 4, label: this.$t('ReportTask.weekReport') }, { key: 3, label: this.$t('ReportTask.monthReport') }, { key: 2, label: this.$t('ReportTask.quarterReport') }, { key: 1, label: this.$t('ReportTask.halfYearReport') }, { key: 0, label: this.$t('ReportTask.yearReport') } ], reportTypeList: [ { key: 0, label: this.$t('ReportTemplateManagement.alarmDistribution') }, { key: 1, label: this.$t('ReportTemplateManagement.alarmTrend') }, { key: 2, label: this.$t('ReportTemplateManagement.alarmTopBottom') }, { key: 3, label: this.$t('ReportTemplateManagement.performanceDistribution') }, { key: 4, label: this.$t('ReportTemplateManagement.performanceTrend') }, { key: 5, label: this.$t('ReportTemplateManagement.performanceTopBottom') } ], StatusList: [ { key: '0', label: this.$t('common.inUse') }, { key: '1', label: this.$t('common.outUse') } ], // 双向绑定展示数据 beginItem: 1, endItem: 100, total: 100, currentPage: 1, pageSize: 100 } }, computed: { createAndCopyCommand () { return ReportTaskCommands.createAndCopyCommand(this.createAndCopyTitle, this.createAndCopyInitList, this.commandContext) }, copyCommand () { return ReportTaskCommands.copyCommand(this.copyInitList, this.commandContext) }, deleteCommand () { return ReportTaskCommands.deleteReportTaskCommand(this.deleteList, this.commandContext) }, updateCommand () { return ReportTaskCommands.updateReportTaskCommand(this.updateInitList, this.commandContext) }, viewCommand () { return ReportTaskCommands.showCollectTaskDetailCommand(this.showList, this.commandContext) }, openTab () { return this.$store.state.openTab }, activeIndex: { get () { return this.$store.state.activeIndex }, set (val) { this.$store.commit('set_active_index', val) } } }, methods: { /** * @Description : chuangjian * @author : ls * @date : 2020/5/26 14:41 * @param : * @return : */ createReportTaskeInit () { this.createAndCopyTitle = this.$t('ReportTask.createReportTask') this.createAndCopyCommand.execute() }, /** * @Description : shanchu * @author : ls * @date : 2020/4/26 15:01 * @param : * @return : */ deleteReportTaskInit () { if (this.multipleSelection.length === 0) { this.InfoTip.warningTip_alarm(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.DELETE_SELECT_CODE)) } else { if (this.multipleSelection.some(item => { return item.status === 0 })) { this.InfoTip.warningTip_alarm(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.STOP_REPORT_TASK_CODE)) this.$refs.singleTable.clearSelection() return } this.deleteList = [] for (var i = 0; i < this.multipleSelection.length; i++) { this.deleteList.push(this.multipleSelection[i].reportTaskKey) } this.deleteCommand.execute() } }, /** * @Description : 启用 * @author : ls * @date : 2020/4/27 16:15 * @param : * @return : */ startReportTaskInit () { if (this.multipleSelection.length === 0) { this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.START_SELECT_CODE)) } else { this.deleteList = [] for (var i = 0; i < this.multipleSelection.length; i++) { if (this.multipleSelection[i].status === 0) { continue } this.deleteList.push(this.multipleSelection[i]['reportTaskKey']) } let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.startReportTask(this.deleteList).then(result => { // this.queryReportTaskDataByConditionStart() for (var j = 0; j < _this.reportTaskList.length; j++) { for (let t = 0; t < _this.deleteList.length; t++) { if (_this.reportTaskList[j].reportTaskKey === _this.deleteList[t]) { _this.reportTaskList[j].status = 0 } } } _this.Loading.closeLoading(loadingInstance) _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.ENABLE_CODE)) }).catch(err => { _this.Loading.closeLoading(loadingInstance) this.InfoTip.errorTip(this, err) }) this.cancel() } }, /** * @Description : 停用 * @author : ls * @date : 2020/4/27 16:14 * @param : * @return : */ stopReportTaskInit () { if (this.multipleSelection.length === 0) { this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.STOP_SELECT_CODE)) } else { this.deleteList = [] for (var i = 0; i < this.multipleSelection.length; i++) { if (this.multipleSelection[i].status === 1) { continue } this.deleteList.push(this.multipleSelection[i]['reportTaskKey']) } let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.startReportTask(this.deleteList).then(result => { // this.queryReportTaskDataByConditionStart() for (var j = 0; j < _this.reportTaskList.length; j++) { for (let t = 0; t < _this.deleteList.length; t++) { if (_this.reportTaskList[j].reportTaskKey === _this.deleteList[t]) { _this.reportTaskList[j].status = 1 } } } _this.Loading.closeLoading(loadingInstance) _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.DISABLE_CODE)) }).catch(err => { _this.Loading.closeLoading(loadingInstance) this.InfoTip.errorTip(this, err) }) this.cancel() } }, /** * @Description : 启用停用 * @author : ls * @date : 2020/5/26 9:34 * @param : * @return : */ changeStatus: function (val) { let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.updateReportTask(val).then(result => { _this.Loading.closeLoading(loadingInstance) _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.MODIFY_CODE)) }).catch(err => { _this.Loading.closeLoading(loadingInstance) this.InfoTip.errorTip(this, err) }) }, /** * @Description : 格式化周期 * @author : ls * @date : 2020/6/9 16:08 * @param : * @return : */ formatPeriod: function (row) { var ret = '' switch (row.period) { case 0: ret = this.$t('ReportTask.yearReport') break case 1: ret = this.$t('ReportTask.halfYearReport') break case 2: ret = this.$t('ReportTask.quarterReport') break case 3: ret = this.$t('ReportTask.monthReport') break case 4: ret = this.$t('ReportTask.weekReport') break case 5: ret = this.$t('ReportTask.dayReport') break } return ret }, /** * @Description : 格式化报表类型 * @author : ls * @date : 2020/6/9 16:38 * @param : * @return : */ formatReportType: function (row) { var ret = '' switch (row.reportType) { case 0: ret = this.$t('ReportTemplateManagement.alarmDistribution') break case 1: ret = this.$t('ReportTemplateManagement.alarmTrend') break case 2: ret = this.$t('ReportTemplateManagement.alarmTopBottom') break case 3: ret = this.$t('ReportTemplateManagement.performanceDistribution') break case 4: ret = this.$t('ReportTemplateManagement.performanceTrend') break case 5: ret = this.$t('ReportTemplateManagement.performanceTopBottom') break } return ret }, /** * @Description : 格式化TopN * @author : ls * @date : 2020/6/9 16:14 * @param : * @return : */ formatterTopN: function (val) { var ret = '' if (val.topN === 0) { ret = 'Top'.concat(val.topNValue) } else if (val.topN === 1) { ret = 'Bottom'.concat(val.topNValue) } else { ret = '' } return ret }, /** * @Description : 取消 * @author : ls * @date : 2020/4/29 18:25 * @param : * @return : */ cancel: function () { this.$refs.singleTable.clearSelection() }, /** * @Description : fuzhi * @author : ls * @date : 2020/4/27 10:54 * @param : * @return : */ handleCopy: function (row) { this.copyInitList = row this.copyCommand.execute() }, /** * @Description : xiugai * @author : ls * @date : 2020/4/27 10:55 * @param : * @return : */ handleUpdate: function (row) { this.updateInitList = row this.updateCommand.execute() }, /** * @Description : 查看指标模板 * @author : ls * @date : 2020/4/29 13:19 * @param : * @return : */ handleViewIndexTemplateDetail (row) { let flag = false for (let item of this.openTab) { if (item.name === '周期报表') { this.$store.commit('delete_keepAliveRouter', 'PeriodReport') this.$store.commit('delete_tabs', '/TheLayout/PeriodReport') this.$store.commit('add_tabs', {route: '/TheLayout/PeriodReport', name: '周期报表', title: 'TheLayoutHeader.PeriodReport'}) this.$store.commit('set_active_index', '/TheLayout/PeriodReport') this.$store.commit('add_keepAliveRouter', 'PeriodReport') this.$router.push({path: '/TheLayout/PeriodReport', query: {reportTaskName: row.reportTaskName}}) flag = true break } } if (!flag) { this.$store.commit('add_tabs', {route: '/TheLayout/PeriodReport', name: '周期报表', title: 'TheLayoutHeader.PeriodReport'}) this.$store.commit('add_keepAliveRouter', 'PeriodReport') this.$store.commit('set_active_index', '/TheLayout/PeriodReport') this.$router.push({path: '/TheLayout/PeriodReport', query: {reportTaskName: row.reportTaskName}}) } }, /** * @Description : shezhitiaojian * @author : ls * @date : 2020/4/27 10:05 * @param : * @return : */ setSelectList: function () { this.selectList = [] if (this.querySelectReportTaskName !== null && this.querySelectReportTaskName !== '') { this.selectList.push({ quaryAttribute: 'reportTaskName', compareSymbol: 'like', compareValue: this.querySelectReportTaskName }) } if (this.querySelectPeriod !== '' && this.querySelectPeriod !== null) { this.selectList.push({ quaryAttribute: 'period', compareSymbol: '=', compareValue: this.querySelectPeriod }) } if (this.querySelectReportType !== '' && this.querySelectReportType !== null) { this.selectList.push({ quaryAttribute: 'reportTemplateKey', compareSymbol: '=', compareValue: this.querySelectReportType }) } if (this.querySelectReportTemplateName !== '' && this.querySelectReportTemplateName !== null) { this.selectList.push({ quaryAttribute: 'reportTemplateKey', compareSymbol: '=', compareValue: this.querySelectReportTemplateName }) } if (this.querySelectStatus !== '' && this.querySelectStatus !== null) { this.selectList.push({ quaryAttribute: 'status', compareSymbol: '=', compareValue: this.querySelectStatus }) } }, /** * @Description : 获取报表模板 * @author : ls * @date : 2020/6/9 15:39 * @param : * @return : */ getAllReportTemplate: function () { let _this = this ReportTemplateService.getAllReportTemplateCollection().then(result => { // 成功 _this.reportTemplateList = Object.values(result) }).catch(err => { _this.InfoTip.errorTip(_this, err) }) }, /** * @Description : 获取所有 * @author : ls * @date : 2020/6/9 12:59 * @param : * @return : */ getAllReportTask: function () { let _this = this let loadingInstance = loading.openLoading() ReportTaskService.getAllReportTaskCollection().then(result => { _this.reportTaskList = Object.values(result) loadingInstance.close() }).catch(err => { this.InfoTip.errorTip(this, err) loadingInstance.close() }) }, /** * @Description : 选中数据 * @author : ls * @date : 2020/4/29 12:06 * @param : * @return : */ handleSelectionChange (val) { this.multipleSelection = val }, /** * @Description : 初始化 * @author : ls * @date : 2020/5/26 14:42 * @param : * @return : */ handleCurrentChange (val) { this.currentPage = val this.beginItem = ((val - 1) * 100) + 1 this.endItem = this.beginItem + 99 if (this.endItem > this.total) { this.endItem = this.total } this.queryReportTaskDataByConditionCurrentPage() }, /** * @Description : 分页 * @author : ls * @date : 2020/5/26 14:44 * @param : * @return : */ queryReportTaskDataByConditionCurrentPage: function () { let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.queryReportTaskListPaging(this.beginItem, this.endItem, this.selectList).then(result => { _this.reportTaskList = Object.values(result) _this.Loading.closeLoading(loadingInstance) }).catch(err => { _this.Loading.closeLoading(loadingInstance) _this.InfoTip.errorTip(_this, err) }) }, /** * @Description : 查询 * @author : ls * @date : 2020/6/10 14:45 * @param : * @return : */ queryInit: function () { this.beginItem = 1 this.setSelectList() let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.getReportTaskTotalCounts(this.selectList).then(result => { _this.total = result _this.Loading.closeLoading(loadingInstance) if (this.total === 0 || this.total < 0) { _this.reportTaskList = [] } else { if (this.total < 100 && this.total > 0) { this.endItem = this.total } else { this.endItem = 100 } this.queryReportTaskDataByConditionCurrentPage() } }).catch(err => { _this.Loading.closeLoading(loadingInstance) _this.InfoTip.errorTip(_this, err) }) }, /** * @Description : 条件查询 * @author : ls * @date : 2020/5/26 14:47 * @param : * @return : */ queryReportTaskDataByCondition: function () { this.beginItem = 1 this.setSelectList() this.reportTaskDataTotalNumber() }, queryReportTaskDataByConditionStart: function () { this.beginItem = 1 this.setSelectList() this.reportTaskDataTotalNumberStart() }, reportTaskDataTotalNumberStart: function () { let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.getReportTaskTotalCounts(this.selectList).then(result => { _this.total = result _this.Loading.closeLoading(loadingInstance) if (this.total === 0 || this.total < 0) { _this.InfoTip.warningTip_alarm(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE)) _this.reportTaskList = [] } else { if (this.total < 100 && this.total > 0) { this.endItem = this.total } else { this.endItem = 100 } this.queryReportTaskDataByConditionCurrentPage() } }).catch(err => { _this.Loading.closeLoading(loadingInstance) _this.InfoTip.errorTip(_this, err) }) }, /** * @Description : 查询总数 * @author : ls * @date : 2020/5/26 15:04 * @param : * @return : */ reportTaskDataTotalNumber: function () { let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.getReportTaskTotalCounts(this.selectList).then(result => { _this.total = result _this.Loading.closeLoading(loadingInstance) if (this.total === 0 || this.total < 0) { _this.InfoTip.warningTip_alarm(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE)) _this.reportTaskList = [] } else { if (this.total < 100 && this.total > 0) { this.endItem = this.total } else { this.endItem = 100 } _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.QUERY_CODE)) this.queryReportTaskDataByConditionCurrentPage() } }).catch(err => { _this.Loading.closeLoading(loadingInstance) _this.InfoTip.errorTip(_this, err) }) }, /** * @Description : 条件查询 * @author : ls * @date : 2020/6/9 13:09 * @param : * @return : */ queryReportTaskDataByCondition1: function () { this.setSelectList() let _this = this let loadingInstance = _this.Loading.openLoading() ReportTaskService.getAllReportTaskCollection().then(result => { _this.reportTaskList = Object.values(result) _this.Loading.closeLoading(loadingInstance) if (_this.reportTaskList.length === 0) { this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.QUERY_NULL_CODE)) } else { this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.QUERY_CODE)) } }).catch(err => { this.InfoTip.errorTip(this, err) loadingInstance.close() }) } }, watch: { commandContext (newVal, oldVal) { if (JSON.stringify(newVal) === '{}') { this.queryInit() this.$refs.singleTable.clearSelection() } deep: true } } } </script> <style scoped> </style>