<template> <!-- 任务列表 --> <div id="dailyDatas" class="tab"> <!-- 表格内容展示 --> <div v-show='dailyFlageTable' class="asideBgc"> <div class='butClick'> <xf-buttons @changes="searChange" :btnAuthority='authority' @add='modelAdd(0)' @edit='clickeEdit' @deletes='delectVals()' @get='searchChange' :searchPlaceholder='searchPlaceholder'> <template #search> <span class="m-r-20"> 状态查询: <el-radio-group v-model="resources"> <el-radio label="">全部</el-radio> <el-radio label="RUNNING">执行中</el-radio> <el-radio label="STOP">停止</el-radio> </el-radio-group> </span> </template> </xf-buttons> </div> <xfTable ref="table" :btnAuthority='authority' @sizeSee='sizeChange' @selectionChange='selectionChange' @currentChange='currentChange' @refreshChange='refreshChange' @handleCurrentRowChange=' handleCurrentRowChange' @handleEdit='handleEdit' @daily='daily' @delectVal='delectVal' @prohibit='enable' @enable='enable' @implement='implement' :slotOverhidden='slotName'> </xfTable> </div> <router-view v-show='!dailyFlageTable' @getLists='getLists' @daily='destory'></router-view> <!-- 数据添加 --> <!-- 数据库类型和队列类型 --> <el-dialog title="选择任务类型" :visible.sync="dataSelect" :close-on-click-modal='closeOnClick' :lock-scroll='closeOnClick' width="50%" :modal='closeOnClick'> <el-row type='flex' class="sqlIcon"> <el-col v-for='(item,index) in taskTypes' :key='index' :span='5' :offset='1' class="text-center" @click.native='handleAdd(item.type,item.taskType)'> <el-card shadow="hover"> <span><i :class="item.iconfont"></i></span> <p>{{item.caption}}</p> </el-card> </el-col> </el-col> </el-row> <span slot="footer" class="dialog-footer"> <el-button @click="dataSelect = false">取 消</el-button> </span> </el-dialog> </div> </template> <script> import project from '../../mixins/project' var moment = require('moment'); import { notify } from '../../util/item' /*负责导出组件*/ export default { name: 'dailyDatas', data() { return { deleteId: 'taskId', //标记删除字段 dataSelect: false, dataCl: [{ caption: '数据任务', taskType: 'dataProcessTask', type: 0, iconfont: 'iconfont icon-shujulvwangtubiao-1' }, { caption: '数据补遗', type: 2, taskType: 'dataProcessTask', iconfont: 'iconfont icon-shujulvwangtubiao-' }], resources: '', dailyFlageTable: true, searchPlaceholder: '请输入任务名称', taskTypes: [], closeOnClick: false, deleteList: [], clickValue: '', projectInter: '', slotName: 'taskName', loadOption: { menuWidth: 250, selection: true, columnBtn:false, addBtn: false,//添加按钮 menu: true, column: [{ label: '任务名称', prop: 'taskName', overHidden: true, solt: true }, { label: '类型名称', prop: 'taskType', formatter: (row, value, text, column) => { switch (value) { case 'dataProcessTask': return '数据任务' break; default: return '任务' } } }, { label: '分组名称', prop: 'taskGroup' }, { label: '任务类型', prop: 'isTemp', formatter: function (row, value, text, column) { switch (value) { case 'Y': return '临时' break; default: return '周期' } } }, { label: '任务状态', prop: 'state', formatter: function (row, value, text, column) { switch (value) { case 'WAITING': return '等待中' break; case 'RUNNING': return '执行中' break; case 'CANCELED': return '取消执行' break; case 'ERROR': return '执行异常' break; case 'STOP': return '停止' break; default: return '执行完毕' } } }, { label: '更新日期时间', prop: 'updateTime', formatter: function (row, value, text, column) { if (value === null) { return '' } return moment(value).format('YYYY-MM-DD HH:mm:ss') } }, { label: '启用', prop: 'statusruleAddendumEsp', overHidden: true, solt: true }] }, } }, mixins: [project], watch: { $route(to, from) { // 修改当前页面跳转路径,返回实例,并保存当前菜单栏选中状态 if (to.path === '/quality/dataProcess/scheduledTasks') { this.dailyFlageTable = true } }, }, mounted() { this.projectDatas(); }, methods: { async projectDatas() { /** * 获取任务类型 */ this.deleteList = []; let datas = {}; let response = await this.$http.get(this.nozzle.taskType, datas); this.getLists(); this.taskTypes = response.data ? response.data.data : []; for (let item of this.taskTypes.values()) { item['iconfont'] = 'iconfont icon-shujulvwangtubiao-1'; item['type'] = 0; } // 添加数据补遗参数 this.taskTypes.push({ caption: '数据补遗', type: 2, taskType: 'dataProcessTask', iconfont: 'iconfont icon-shujulvwangtubiao-' }) }, destory() { // 展示任务列表 this.dailyFlageTable = true; }, daily(row, index) { /** * 日志信息查询 */ this.dailyFlageTable = false; // 日志详情 this.$router.push({ path: '/quality/daily', query: { taskName: row['taskName'], taskId: row['taskId'] } }) }, implement(row, index) { /** * 执行 */ if (!row['statusruleAddendumEsp']) { this.$notify({ type: 'warning', message: '启动任务状态,才能执行任务' }) return } this.$http.get(this.nozzle.taskRun, { params: { taskId: row['taskId'] } }).then(response => { notify(response) if (response.data.code === 200) { this.getLists() } }) }, enable(row, index) { /** * 启用 && 禁用 */ // status 启用或者禁用状态:启用为1 禁用为0 let status = row['disabled']; let api = ''; // 启用 if (status) { api = this.nozzle.startTask; } else { // 禁用 api = this.nozzle.stopTask; } this.editParameter(api, { taskId: row['taskId'] }); }, async editParameter(api, datas = {}) { // 修改数据传值 datas['taskParams'] = typeof datas['taskParams'] === 'string' ? datas['taskParams'] : JSON.stringify(datas[ 'taskParams']); const response = await this.$http.get(api, { params: datas }); this.getLists() }, searchChange(val = '') { // 搜索数据 if (val === '') { this.page.currentPage = 1; this.getLists(); } else { this.getLists(val); } }, async getLists(taskName = null) { /** * 获取表格数据 */ this.deleteList = []; let datas = { params: { "taskName": taskName, "state": this.resources === '' ? null : this.resources, "pageNo": this.page.currentPage, "pageSize": this.page.pageSize } } // 获取数据返回状态 日志 let response = await this.getTableData(datas, this.nozzle.taskGet); response = this.statusCalculation(response); this.rendering(response); }, statusCalculation(response) { // 状态值计算 let newRes = response.data.data.list; if (newRes.length !== 0) { for (let item of newRes.values()) { if (item['disabled']) { item['statusruleAddendumEsp'] = false; item['addendumTitle'] = '禁用'; } else { item['statusruleAddendumEsp'] = true; item['addendumTitle'] = '启用'; } } } return response }, modelAdd(type) { /** * 添加数据按钮 * @param {Number} type 类型 */ this.dataSelect = true; }, handleAdd(type, task) { // 新增按钮 this.$router.push({ path: '/dailyWindow', query: { headTitle: type, taskType: task } }) this.dataSelect = false; this.dailyFlageTable = false; }, clickeEdit() { // 单击修改 if (!this.clickValue) { this.$notify.warning('请先选择要修改的行,再进行数据修改!'); return } else { this.handleEdit(this.clickValue) } }, handleEdit(row) { // 行内点击修改 this.$router.push({ path: '/dailyWindow', query: { headTitle: 1, taskId: row['taskId'] } }) this.dailyFlageTable = false; }, deleteUserLise(ids) { // 批量删除 let datas = { "params": { "taskIds": ids } } this.asyncDelete(datas, this.nozzle.taskDelete); }, } } </script> <style> .sqlIcon { margin: 20px 0; } .sqlIcon .iconfont[class^="icon"] { width: auto !important; font-size: 60px; } #dailyDatas .asideBgc { height: 100%; } #dailyDatas .el-dialog__body { padding: 18px 38px 0 38px; } #dailyWindow .el-date-editor .el-range__icon, .el-date-editor .el-range-separator { line-height: 23px; } #dailyWindow .fzs { display: inline-block; width: 330px; text-align: right; padding-right: 10px; } #dailyWindow .w60 { width: 60%; } #dailyWindow .datainterval { width: 26%; } #dailyWindow .yzFlex { display: flex; justify-content: space-around; } #dailyWindow .dataSourceTest { float: right; margin-top: 5px; } #dailyWindow .conditiona { padding: 0px 0 10px 141px; } #dailyWindow .addendumNames { line-height: 40px; } #dailyWindow .el-autocomplete { width: 100%; } #dailyWindow .icon-qiyong:before { color: red; cursor: pointer; } #dailyWindow .el-form-itemSuccess { color: #63e06e; font-size: 12px; line-height: 1; padding-top: 4px; position: absolute; top: 100%; left: 0; } #dailyWindow .pull-left { float: left; color: #1890ff !important; font-size: 14px; line-height: 23px; cursor: pointer; } #dailyWindow .sectionH2 { font-size: 16px; color: #000; padding-bottom: 12px; } #dailyWindow .basicB { box-shadow: 2px 2px 9px 0px var(--white) !important; /* background-color: #fff; */ } #dailyWindow .el-form-item { margin-bottom: 12px; } </style>