| | |
|---|
| | | <template>
|
|---|
| | | <div>
|
|---|
| | | <div class="body" :style="{height:mainHeight+'px'}">
|
|---|
| | | <div class="bodyTopButtonGroup">
|
|---|
| | | <el-button v-waves type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">新增任务</el-button>
|
|---|
| | | <!-- <el-button v-waves type="primary" icon="el-icon-switch-button" @click="">暂停任务</el-button>-->
|
|---|
| | | <!-- <el-button v-waves type="primary" icon="el-icon-caret-right " @click="">开启任务</el-button>-->
|
|---|
| | | <!-- <el-button v-waves type="primary" icon="el-icon-circle-plus-outline" @click="">立即执行</el-button>-->
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <div class="bodyTopFormGroup">
|
|---|
| | | <el-form
|
|---|
| | | ref="form"
|
|---|
| | | :model="form"
|
|---|
| | | label-width="100px"
|
|---|
| | | inline
|
|---|
| | | style="display: flex;"
|
|---|
| | | >
|
|---|
| | | <div class="elForm">
|
|---|
| | | <el-form-item label="母件编码" style=" display: flex;">
|
|---|
| | | <el-input v-model="form.OrgCode" placeholder="请输入" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item label="母件名称" style=" display: flex;">
|
|---|
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item label="母件规格" style=" display: flex;">
|
|---|
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item label="启用状态" style=" display: flex;">
|
|---|
| | | <el-select v-model="form.OrgType" style="width: 200px" placeholder="请选择">
|
|---|
| | | <el-option
|
|---|
| | | v-for="item in OrgTypeArrxx"
|
|---|
| | | :key="item.code"
|
|---|
| | | :label="item.name"
|
|---|
| | | :value="item.code"
|
|---|
| | | />
|
|---|
| | | </el-select>
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item v-show="isExpandForm" label="版本编号" style=" display: flex;">
|
|---|
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item v-show="isExpandForm" label="创建人员" style=" display: flex;">
|
|---|
| | | <el-input v-model="form.UserName" style="width: 200px" placeholder="请输入" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item v-show="isExpandForm" label="创建日期" style=" display: flex;">
|
|---|
| | | <el-date-picker
|
|---|
| | | v-model="form.createdate"
|
|---|
| | | style="width: 200px"
|
|---|
| | | type="date"
|
|---|
| | | placeholder="选择日期"
|
|---|
| | | />
|
|---|
| | | </el-form-item>
|
|---|
| | | </div>
|
|---|
| | | <div
|
|---|
| | | class="bodySearchReset"
|
|---|
| | | :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}"
|
|---|
| | | >
|
|---|
| | | <el-button v-waves type="primary" icon="el-icon-search" @click="search">查询</el-button>
|
|---|
| | | <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">重置</el-button>
|
|---|
| | | </div>
|
|---|
| | | </el-form>
|
|---|
| | | <div
|
|---|
| | | class="bodyTopFormExpand"
|
|---|
| | | >
|
|---|
| | | <svg-icon
|
|---|
| | | v-show="mouseHoverType==='mouseout'"
|
|---|
| | | style="cursor: pointer"
|
|---|
| | | :icon-class="!isExpandForm?'doubleDown3':'doubleUp3'"
|
|---|
| | | @mouseenter="mouseHoverType=$event.type"
|
|---|
| | | />
|
|---|
| | | <svg-icon
|
|---|
| | | v-show="mouseHoverType==='mouseenter'"
|
|---|
| | | style="cursor: pointer"
|
|---|
| | | :icon-class="!isExpandForm?'doubleDown':'doubleUp'"
|
|---|
| | | @click="isExpandForm=!isExpandForm"
|
|---|
| | | @mouseout="mouseHoverType=$event.type"
|
|---|
| | | />
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <div class="elTableDiv">
|
|---|
| | | <el-table
|
|---|
| | | ref="tableDataRef"
|
|---|
| | | class="tableFixed"
|
|---|
| | | :data="tableData"
|
|---|
| | | :height="isExpandForm?tableHeight:(tableHeight+40)+'px'"
|
|---|
| | | border
|
|---|
| | | :row-class-name="tableRowClassName"
|
|---|
| | | :style="{width: 100+'%',height:isExpandForm?tableHeight:(tableHeight+40)+'px',}"
|
|---|
| | | highlight-current-row
|
|---|
| | | :header-cell-style="this.$headerCellStyle"
|
|---|
| | | :cell-style="this.$cellStyle"
|
|---|
| | | @sort-change="sortChange"
|
|---|
| | | >
|
|---|
| | | <el-table-column
|
|---|
| | | type="index"
|
|---|
| | | width="50"
|
|---|
| | | fixed
|
|---|
| | | label="序号"
|
|---|
| | | />
|
|---|
| | | <el-table-column
|
|---|
| | | prop="TaskName"
|
|---|
| | | label="作业名称"
|
|---|
| | | sortable="custom"
|
|---|
| | | />
|
|---|
| | | <el-table-column
|
|---|
| | | prop="GroupName"
|
|---|
| | | label="分组"
|
|---|
| | | sortable="custom"
|
|---|
| | | />
|
|---|
| | | <el-table-column
|
|---|
| | | prop="LastRunTime"
|
|---|
| | | label="最后执行时间"
|
|---|
| | | sortable="custom"
|
|---|
| | | min-width="120"
|
|---|
| | | />
|
|---|
| | | <el-table-column
|
|---|
| | | prop="Interval"
|
|---|
| | | label="间隔"
|
|---|
| | | sortable="custom"
|
|---|
| | | />
|
|---|
| | | <el-table-column
|
|---|
| | | prop="Status"
|
|---|
| | | label="状态"
|
|---|
| | | width="75"
|
|---|
| | | sortable="custom"
|
|---|
| | | >
|
|---|
| | | <template slot-scope="{row}">
|
|---|
| | | <el-tag v-if="row.Status===0" size="medium" type="success">正常</el-tag>
|
|---|
| | | <el-tag v-if="row.Status===1" size="medium" type="danger">暂停</el-tag>
|
|---|
| | | </template>
|
|---|
| | | </el-table-column>
|
|---|
| | | <el-table-column
|
|---|
| | | prop="Describe"
|
|---|
| | | label="描述"
|
|---|
| | | sortable="custom"
|
|---|
| | | />
|
|---|
| | | <el-table-column
|
|---|
| | | prop="ApiUrl"
|
|---|
| | | label="ApiUrl"
|
|---|
| | | sortable="custom"
|
|---|
| | | />
|
|---|
| | | <el-table-column
|
|---|
| | | prop="RequestType"
|
|---|
| | | label="请求方式"
|
|---|
| | | sortable="custom"
|
|---|
| | | />
|
|---|
| | |
|
|---|
| | | <el-table-column
|
|---|
| | | label="操作"
|
|---|
| | | width="200"
|
|---|
| | | fixed="right"
|
|---|
| | | >
|
|---|
| | | <template slot-scope="{row}">
|
|---|
| | | <div class="operationClass">
|
|---|
| | | <el-tooltip class="item" effect="dark" content="暂停任务" placement="top">
|
|---|
| | | <i
|
|---|
| | | class="el-icon-switch-button"
|
|---|
| | | style="margin-right: 15px;color: RED;cursor: pointer"
|
|---|
| | | @click="pauseTask(row)"
|
|---|
| | | />
|
|---|
| | | </el-tooltip>
|
|---|
| | | <el-tooltip class="item" effect="dark" content="开启任务" placement="top">
|
|---|
| | | <i
|
|---|
| | | class="el-icon-caret-right"
|
|---|
| | | style="margin-right: 15px;color: #42B983;cursor: pointer"
|
|---|
| | | @click="startTask(row)"
|
|---|
| | | />
|
|---|
| | | </el-tooltip>
|
|---|
| | | <el-tooltip class="item" effect="dark" content="立即执行" placement="top">
|
|---|
| | | <i
|
|---|
| | | class="el-icon-d-arrow-right"
|
|---|
| | | style="margin-right: 15px;color: #42B983;cursor: pointer"
|
|---|
| | | @click="runTask(row)"
|
|---|
| | | />
|
|---|
| | | </el-tooltip>
|
|---|
| | |
|
|---|
| | | <el-tooltip class="item" effect="dark" content="查看记录" placement="top">
|
|---|
| | | <i
|
|---|
| | | class="el-icon-document"
|
|---|
| | | style="margin-right: 15px;color: #42B983;cursor: pointer"
|
|---|
| | | @click="check(row)"
|
|---|
| | | />
|
|---|
| | | </el-tooltip>
|
|---|
| | |
|
|---|
| | | <el-tooltip class="item" effect="dark" content="编辑任务" placement="top">
|
|---|
| | | <i class="el-icon-edit-outline" :style="{color:$store.state.settings.theme}" @click="edit('edit',row)" />
|
|---|
| | | </el-tooltip>
|
|---|
| | | <el-tooltip v-del-tab-index class="item" effect="dark" :style="{color:$store.state.settings.theme}" content="删除任务" placement="top">
|
|---|
| | | <i class="el-icon-delete" @click="del(row)" />
|
|---|
| | | </el-tooltip>
|
|---|
| | | </div>
|
|---|
| | | </template>
|
|---|
| | | </el-table-column>
|
|---|
| | | </el-table>
|
|---|
| | | </div>
|
|---|
| | | <!--分页-->
|
|---|
| | | <pagination
|
|---|
| | | :total="total"
|
|---|
| | | :page.sync="form.page"
|
|---|
| | | :limit.sync="form.rows"
|
|---|
| | | align="right"
|
|---|
| | | layout="total,prev, pager, next,sizes"
|
|---|
| | | popper-class="select_bottom"
|
|---|
| | | @pagination="getTaskBackGroundGetJobs"
|
|---|
| | | />
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <el-dialog
|
|---|
| | | v-el-drag-dialog
|
|---|
| | | :title="operation==='add'?'新增':'编辑'"
|
|---|
| | | :visible.sync="dialogVisible"
|
|---|
| | | width="900px"
|
|---|
| | | :close-on-click-modal="false"
|
|---|
| | | top="15vh"
|
|---|
| | | @closed="handleClose"
|
|---|
| | | @close="handleClose"
|
|---|
| | | >
|
|---|
| | |
|
|---|
| | | <el-form ref="dialogForm" inline :rules="dialogFormRules" :model="dialogForm" label-width="110px">
|
|---|
| | | <el-form-item label="作业名称" prop="TaskName">
|
|---|
| | | <el-input v-model="dialogForm.TaskName" :disabled="operation!=='add'" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item label="分组" prop="GroupName">
|
|---|
| | | <el-input v-model="dialogForm.GroupName" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | |
|
|---|
| | | <!-- <el-popover v-model="cronPopover">-->
|
|---|
| | | <!-- <cron i18n="cn" @change="changeCron" @close="cronPopover=false" />-->
|
|---|
| | | <!-- <el-form-item slot="reference" label="cron表达式" prop="Interval">-->
|
|---|
| | | <!-- <el-input-->
|
|---|
| | | <!-- v-model="dialogForm.Interval"-->
|
|---|
| | | <!-- placeholder="请输入定时策略"-->
|
|---|
| | | <!-- style="width:200px"-->
|
|---|
| | | <!-- @click="cronPopover=true"-->
|
|---|
| | | <!-- />-->
|
|---|
| | | <!-- </el-form-item>-->
|
|---|
| | | <!-- </el-popover>-->
|
|---|
| | |
|
|---|
| | | <el-form-item label="cron表达式" prop="Interval">
|
|---|
| | | <el-input
|
|---|
| | | v-model="dialogForm.Interval"
|
|---|
| | | placeholder="请输入定时策略"
|
|---|
| | | style="width:200px"
|
|---|
| | | readonly
|
|---|
| | | >
|
|---|
| | | <el-button slot="append" icon="el-icon-thumb" @click="showDialog" />
|
|---|
| | | </el-input>
|
|---|
| | | </el-form-item>
|
|---|
| | |
|
|---|
| | | <el-form-item label="ApiUrl" prop="ApiUrl">
|
|---|
| | | <el-input v-model="dialogForm.ApiUrl" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item label="header(Key)" prop="AuthKey">
|
|---|
| | | <el-input v-model="dialogForm.AuthKey" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | | <el-form-item label="header(value)" prop="AuthValue">
|
|---|
| | | <el-input v-model="dialogForm.AuthValue" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | |
|
|---|
| | | <!-- <el-form-item label="请求方式" prop="RequestType">-->
|
|---|
| | | <!-- <el-input v-model="dialogForm.RequestType" style="width: 200px" />-->
|
|---|
| | | <!-- </el-form-item>-->
|
|---|
| | | <el-form-item label="描述" prop="Describe">
|
|---|
| | | <el-input v-model="dialogForm.Describe" type="textarea" style="width: 200px" />
|
|---|
| | | </el-form-item>
|
|---|
| | |
|
|---|
| | | </el-form>
|
|---|
| | |
|
|---|
| | | <el-dialog
|
|---|
| | | v-el-drag-dialog
|
|---|
| | | :close-on-click-modal="false"
|
|---|
| | | top="8vh"
|
|---|
| | | width="900px"
|
|---|
| | | title="生成 cron"
|
|---|
| | | :visible.sync="showCron"
|
|---|
| | | append-to-body
|
|---|
| | | >
|
|---|
| | | <vcrontab :expression="expression" @hide="showCron=false" @fill="crontabFill" />
|
|---|
| | | </el-dialog>
|
|---|
| | |
|
|---|
| | | <span slot="footer" class="dialog-footer">
|
|---|
| | | <div class="footerButton">
|
|---|
| | | <el-button v-waves @click="dialogVisibleCancel">取 消</el-button>
|
|---|
| | | <el-button v-waves type="primary" @click="dialogVisibleConfirm">确 定</el-button>
|
|---|
| | | </div>
|
|---|
| | | </span>
|
|---|
| | | </el-dialog>
|
|---|
| | |
|
|---|
| | | <el-dialog
|
|---|
| | | v-el-drag-dialog
|
|---|
| | | title="cron 执行记录"
|
|---|
| | | :visible.sync="dialogVisible2"
|
|---|
| | | width="900px"
|
|---|
| | |
|
|---|
| | | top="15vh"
|
|---|
| | | @closed="handleClose2"
|
|---|
| | | @close="handleClose2"
|
|---|
| | | >
|
|---|
| | | <!-- :close-on-click-modal="false"-->
|
|---|
| | | <!-- {{ recordData }}-->
|
|---|
| | |
|
|---|
| | | <el-timeline :reverse="false">
|
|---|
| | | <el-timeline-item
|
|---|
| | | v-for="(item, index) in recordData"
|
|---|
| | | :key="item.BeginDate"
|
|---|
| | | :timestamp="item.Msg"
|
|---|
| | | >
|
|---|
| | | {{ item.BeginDate }}
|
|---|
| | | </el-timeline-item>
|
|---|
| | | </el-timeline>
|
|---|
| | |
|
|---|
| | | <span slot="footer" class="dialog-footer">
|
|---|
| | | <div class="footerButton">
|
|---|
| | | <el-button v-waves @click="dialogVisible2=false">返 回</el-button>
|
|---|
| | | <!-- <el-button v-waves type="primary" @click="dialogVisibleConfirm">确 定</el-button>-->
|
|---|
| | | </div>
|
|---|
| | | </span>
|
|---|
| | | </el-dialog>
|
|---|
| | |
|
|---|
| | | </div>
|
|---|
| | | </template>
|
|---|
| | |
|
|---|
| | | <script>
|
|---|
| | | import Pagination from '@/components/Pagination'
|
|---|
| | | import {
|
|---|
| | | TaskBackGroundAdd,
|
|---|
| | | TaskBackGroundGetJobs,
|
|---|
| | | TaskBackGroundGetRunLog,
|
|---|
| | | TaskBackGroundPause,
|
|---|
| | | TaskBackGroundRemove, TaskBackGroundRun,
|
|---|
| | | TaskBackGroundStart, TaskBackGroundUpdate
|
|---|
| | | } from '@/api/TaskBackGround'
|
|---|
| | | import elDragDialog from '@/directive/el-drag-dialog'
|
|---|
| | | import waves from '@/directive/waves'
|
|---|
| | | import { cron } from 'vue-cron'
|
|---|
| | | import cronstrue from 'cronstrue/i18n'
|
|---|
| | | import vcrontab from '../../components/VcronTab/index'
|
|---|
| | |
|
|---|
| | | export default {
|
|---|
| | | name: 'CronTime',
|
|---|
| | | components: {
|
|---|
| | | Pagination, cron, vcrontab
|
|---|
| | | },
|
|---|
| | | directives: { elDragDialog, waves },
|
|---|
| | | data() {
|
|---|
| | | return {
|
|---|
| | | mouseHoverType: 'mouseout',
|
|---|
| | | isExpandForm: false,
|
|---|
| | | mainHeight: 0,
|
|---|
| | | tableHeight: 0,
|
|---|
| | | form: {
|
|---|
| | | OrgCode: '', // 组织架构代码
|
|---|
| | | OrgName: '', // 组织架构名称
|
|---|
| | | OrgType: '', // 组织类型
|
|---|
| | | UserName: '', // 创建人员
|
|---|
| | | createdate: '',
|
|---|
| | | prop: 'lm_date', // 排序字段
|
|---|
| | | order: 'desc', // 排序字段
|
|---|
| | | page: 1, // 第几页
|
|---|
| | | rows: 20 // 每页多少条
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | total: 10,
|
|---|
| | | tableData: [],
|
|---|
| | | dialogVisible: false,
|
|---|
| | | dialogForm: {
|
|---|
| | | TaskName: '', // 作业名称
|
|---|
| | | GroupName: '', // 分组
|
|---|
| | | Interval: '', // 间隔
|
|---|
| | | ApiUrl: '', // ApiUrl
|
|---|
| | | AuthKey: '', // AuthKey
|
|---|
| | | AuthValue: '', // AuthValue
|
|---|
| | | Describe: '', // 描述
|
|---|
| | | RequestType: 'POST', // 请求类型
|
|---|
| | | LastRunTime: '', // 最后执行时间
|
|---|
| | | Status: 0// 状态
|
|---|
| | | },
|
|---|
| | | cronPopover: false,
|
|---|
| | |
|
|---|
| | | showCron: false,
|
|---|
| | | expression: '',
|
|---|
| | |
|
|---|
| | | operation: '',
|
|---|
| | | dialogFormRules: {
|
|---|
| | | TaskName: [
|
|---|
| | | { required: true, message: '请输入作业任务', trigger: ['blur', 'change'] }
|
|---|
| | | ],
|
|---|
| | | GroupName: [
|
|---|
| | | { required: true, message: '请输入分组', trigger: ['blur', 'change'] }
|
|---|
| | | ],
|
|---|
| | | Interval: [
|
|---|
| | | { required: true, message: '请输入cron表达式', trigger: ['blur', 'change'] }
|
|---|
| | | ],
|
|---|
| | | ApiUrl: [
|
|---|
| | | { required: true, message: '请输入ApiUrl', trigger: ['blur', 'change'] }
|
|---|
| | | ],
|
|---|
| | | RequestType: [
|
|---|
| | | { required: true, message: '请输入请求方式', trigger: ['blur', 'change'] }
|
|---|
| | | ],
|
|---|
| | | Describe: [
|
|---|
| | | { required: true, message: '请输入请求描述', trigger: ['blur', 'change'] }
|
|---|
| | | ]
|
|---|
| | | // AuthKey: [
|
|---|
| | | // { required: true, message: '请输入authKey', trigger: ['blur', 'change'] }
|
|---|
| | | // ],
|
|---|
| | | // AuthValue: [
|
|---|
| | | // { required: true, message: '请输入authValue', trigger: ['blur', 'change'] }
|
|---|
| | | // ]
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | | dialogVisible2: false,
|
|---|
| | | OrgTypeArrxx: [],
|
|---|
| | | recordData: []// 查看记录数组
|
|---|
| | |
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | activated() {
window.addEventListener('resize', this.getHeight)
this.getHeight()
},
created() {
|
|---|
| | | this.getTaskBackGroundGetJobs()
|
|---|
| | | },
|
|---|
| | | mounted() {
|
|---|
| | | window.addEventListener('resize', this.getHeight)
|
|---|
| | | this.getHeight()
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | crontabFill(val) {
|
|---|
| | | this.dialogForm.Interval = val
|
|---|
| | | // const t = cronstrue.toString(this.dialogForm.Interval, { locale: 'zh_CN' })
|
|---|
| | | // console.log(t)
|
|---|
| | | },
|
|---|
| | | showDialog() {
|
|---|
| | | this.expression = this.dialogForm.Interval
|
|---|
| | | // 传入的 cron 表达式，可以反解析到 UI 上
|
|---|
| | | this.showCron = true
|
|---|
| | | },
|
|---|
| | | changeCron(val) {
|
|---|
| | | this.dialogForm.Interval = val
|
|---|
| | | // cronstrue 是一个 JavaScript 库，解析 cron 表达式并输出可读的 cron 描述。
|
|---|
| | | // const t = cronstrue.toString(this.dialogForm.Interval, { locale: 'zh_CN' })
|
|---|
| | | // console.log(t)
|
|---|
| | | },
|
|---|
| | | async getTaskBackGroundGetJobs() {
|
|---|
| | | const res = await TaskBackGroundGetJobs()
|
|---|
| | | this.tableData = res.data
|
|---|
| | | this.total = res.data.length
|
|---|
| | | },
|
|---|
| | | // 排序改变时
|
|---|
| | | sortChange({ column, prop, order }) {
|
|---|
| | | if (order === 'descending') {
|
|---|
| | | order = 'desc'
|
|---|
| | | } else if (order === 'ascending') {
|
|---|
| | | order = 'asc'
|
|---|
| | | } else {
|
|---|
| | | order = 'desc'
|
|---|
| | | }
|
|---|
| | | this.form.order = order
|
|---|
| | | this.form.prop = prop
|
|---|
| | | this.getTaskBackGroundGetJobs()
|
|---|
| | | },
|
|---|
| | | // 查询
|
|---|
| | | search() {
|
|---|
| | | this.getTaskBackGroundGetJobs()
|
|---|
| | | },
|
|---|
| | | // 重置
|
|---|
| | | reset() {
|
|---|
| | | this.form.OrgCode = ''
|
|---|
| | | this.form.OrgName = ''
|
|---|
| | | this.form.OrgType = ''
|
|---|
| | | this.form.UserName = ''
|
|---|
| | | this.getTaskBackGroundGetJobs()
|
|---|
| | | },
|
|---|
| | | // 新增按钮
|
|---|
| | | add(operation) {
|
|---|
| | | this.operation = operation
|
|---|
| | | this.dialogVisible = true
|
|---|
| | | },
|
|---|
| | | // 修改按钮
|
|---|
| | | edit(operation, row) {
|
|---|
| | | this.operation = operation
|
|---|
| | | this.dialogVisible = true
|
|---|
| | | this.$nextTick(() => {
|
|---|
| | | this.dialogForm.TaskName = row.TaskName
|
|---|
| | | this.dialogForm.GroupName = row.GroupName
|
|---|
| | | this.dialogForm.Interval = row.Interval
|
|---|
| | | this.dialogForm.ApiUrl = row.ApiUrl
|
|---|
| | | this.dialogForm.AuthKey = row.AuthKey
|
|---|
| | | this.dialogForm.AuthValue = row.AuthValue
|
|---|
| | | this.dialogForm.Describe = row.Describe
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | // 删除按钮
|
|---|
| | | async del(row) {
|
|---|
| | | this.$confirm('是否确认删除?', '提示', {
|
|---|
| | | confirmButtonText: '确定',
|
|---|
| | | cancelButtonText: '取消',
|
|---|
| | | type: 'warning'
|
|---|
| | | }).then(() => {
|
|---|
| | | TaskBackGroundRemove(row).then(res => {
|
|---|
| | | if (res.code === '200') {
|
|---|
| | | this.$message.success('删除成功!')
|
|---|
| | | if (this.form.page > 1 && this.tableData.length === 1) {
|
|---|
| | | this.form.page--
|
|---|
| | | }
|
|---|
| | | this.getTaskBackGroundGetJobs()
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | }).catch(() => {
|
|---|
| | | this.$message.info('已取消删除')
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | // 暂停任务
|
|---|
| | | async pauseTask(row) {
|
|---|
| | | const res = await TaskBackGroundPause(row)
|
|---|
| | | if (res.code === '200') {
|
|---|
| | | await this.getTaskBackGroundGetJobs()
|
|---|
| | | return this.$message.success(res.message)
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | // 开启任务
|
|---|
| | | async startTask(row) {
|
|---|
| | | const res = await TaskBackGroundStart(row)
|
|---|
| | | if (res.code === '200') {
|
|---|
| | | await this.getTaskBackGroundGetJobs()
|
|---|
| | | return this.$message.success(res.message)
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | // 立即执行
|
|---|
| | | async runTask(row) {
|
|---|
| | | const res = await TaskBackGroundRun(row)
|
|---|
| | | if (res.code === '200') {
|
|---|
| | | await this.getTaskBackGroundGetJobs()
|
|---|
| | | this.$message.success(res.message)
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | // 查看记录
|
|---|
| | | async check(row) {
|
|---|
| | | const data = {
|
|---|
| | | TaskName: row.TaskName,
|
|---|
| | | GroupName: row.GroupName,
|
|---|
| | | page: 1
|
|---|
| | | }
|
|---|
| | | const res = await TaskBackGroundGetRunLog(data)
|
|---|
| | |
|
|---|
| | | if (res.code === '200') {
|
|---|
| | | this.recordData = res.data
|
|---|
| | | this.dialogVisible2 = true
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | // 对话框关闭事件
|
|---|
| | | handleClose() {
|
|---|
| | | this.dialogForm.TaskName = ''
|
|---|
| | | this.dialogForm.GroupName = ''
|
|---|
| | | this.dialogForm.Interval = ''
|
|---|
| | | this.dialogForm.ApiUrl = ''
|
|---|
| | | this.dialogForm.AuthKey = ''
|
|---|
| | | this.dialogForm.AuthValue = ''
|
|---|
| | | this.dialogForm.Describe = ''
|
|---|
| | | this.dialogForm.RequestType = 'POST'
|
|---|
| | | this.dialogForm.LastRunTime = ''
|
|---|
| | | this.dialogForm.Status = 0
|
|---|
| | | this.$refs.dialogForm.clearValidate()
|
|---|
| | | },
|
|---|
| | | // 对话框取消
|
|---|
| | | dialogVisibleCancel() {
|
|---|
| | | this.dialogVisible = false
|
|---|
| | | },
|
|---|
| | | // 对话框确认
|
|---|
| | | dialogVisibleConfirm() {
|
|---|
| | | console.log(this.dialogForm)
|
|---|
| | |
|
|---|
| | | // console.log(new Date().getUTCDate())
|
|---|
| | |
|
|---|
| | | this.$refs.dialogForm.validate(valid => {
|
|---|
| | | if (valid) {
|
|---|
| | | // const data = {
|
|---|
| | | // OrganCode: this.dialogForm.OrgCode,
|
|---|
| | | // OrganName: this.dialogForm.OrgName,
|
|---|
| | | // OperType: this.operation === 'add' ? 'Add' : 'Update',
|
|---|
| | | // Operator: getCookie('admin')
|
|---|
| | | // }
|
|---|
| | |
|
|---|
| | | if (this.operation === 'add') {
|
|---|
| | | TaskBackGroundAdd(this.dialogForm).then(res => {
|
|---|
| | | if (res.code === '200') {
|
|---|
| | | this.$message.success(this.operation === 'add' ? '添加成功！' : '修改成功！')
|
|---|
| | | this.dialogVisible = false
|
|---|
| | | this.getTaskBackGroundGetJobs()
|
|---|
| | | } else {
|
|---|
| | | this.$message.error(this.operation === 'add' ? '添加失败！' : '修改失败！')
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | } else {
|
|---|
| | | TaskBackGroundUpdate(this.dialogForm).then(res => {
|
|---|
| | | if (res.code === '200') {
|
|---|
| | | this.$message.success(this.operation === 'add' ? '添加成功！' : '修改成功！')
|
|---|
| | | this.dialogVisible = false
|
|---|
| | | this.getTaskBackGroundGetJobs()
|
|---|
| | | } else {
|
|---|
| | | this.$message.error(this.operation === 'add' ? '添加失败！' : '修改失败！')
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | handleClose2() {
|
|---|
| | | this.recordData = []
|
|---|
| | | },
|
|---|
| | | // 获取页面高度
|
|---|
| | | getHeight() {
|
|---|
| | | this.$nextTick(() => {
|
|---|
| | | this.mainHeight = window.innerHeight - 85
|
|---|
| | | this.tableHeight = this.mainHeight - 255
|
|---|
| | | this.$refs.tableDataRef.doLayout()
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | tableRowClassName({ row, rowIndex }) {
|
|---|
| | | return 'custom-row'
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | </script>
|
|---|
| | |
|
|---|
| | | <style lang="scss" scoped>
|
|---|
| | | ::v-deep .pop_btn {
|
|---|
| | | display: flex;
|
|---|
| | | justify-content: right;
|
|---|
| | | }
|
|---|
| | | </style>
|
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <div class="body" :style="{height:mainHeight+'px'}"> |
|---|
| | | <div class="bodyTopButtonGroup"> |
|---|
| | | <el-button v-waves type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">新增任务</el-button> |
|---|
| | | <!-- <el-button v-waves type="primary" icon="el-icon-switch-button" @click="">暂停任务</el-button>--> |
|---|
| | | <!-- <el-button v-waves type="primary" icon="el-icon-caret-right " @click="">开启任务</el-button>--> |
|---|
| | | <!-- <el-button v-waves type="primary" icon="el-icon-circle-plus-outline" @click="">立即执行</el-button>--> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="bodyTopFormGroup"> |
|---|
| | | <el-form |
|---|
| | | ref="form" |
|---|
| | | :model="form" |
|---|
| | | label-width="100px" |
|---|
| | | inline |
|---|
| | | style="display: flex;" |
|---|
| | | > |
|---|
| | | <div class="elForm"> |
|---|
| | | <el-form-item label="母件编码" style=" display: flex;"> |
|---|
| | | <el-input v-model="form.OrgCode" placeholder="请输入" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="母件名称" style=" display: flex;"> |
|---|
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="母件规格" style=" display: flex;"> |
|---|
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="启用状态" style=" display: flex;"> |
|---|
| | | <el-select v-model="form.OrgType" style="width: 200px" placeholder="请选择"> |
|---|
| | | <el-option |
|---|
| | | v-for="item in OrgTypeArrxx" |
|---|
| | | :key="item.code" |
|---|
| | | :label="item.name" |
|---|
| | | :value="item.code" |
|---|
| | | /> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item v-show="isExpandForm" label="版本编号" style=" display: flex;"> |
|---|
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item v-show="isExpandForm" label="创建人员" style=" display: flex;"> |
|---|
| | | <el-input v-model="form.UserName" style="width: 200px" placeholder="请输入" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item v-show="isExpandForm" label="创建日期" style=" display: flex;"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="form.createdate" |
|---|
| | | style="width: 200px" |
|---|
| | | type="date" |
|---|
| | | placeholder="选择日期" |
|---|
| | | /> |
|---|
| | | </el-form-item> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | class="bodySearchReset" |
|---|
| | | :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}" |
|---|
| | | > |
|---|
| | | <el-button v-waves type="primary" icon="el-icon-search" @click="search">查询</el-button> |
|---|
| | | <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">重置</el-button> |
|---|
| | | </div> |
|---|
| | | </el-form> |
|---|
| | | <div |
|---|
| | | class="bodyTopFormExpand" |
|---|
| | | > |
|---|
| | | <svg-icon |
|---|
| | | v-show="mouseHoverType==='mouseout'" |
|---|
| | | style="cursor: pointer" |
|---|
| | | :icon-class="!isExpandForm?'doubleDown3':'doubleUp3'" |
|---|
| | | @mouseenter="mouseHoverType=$event.type" |
|---|
| | | /> |
|---|
| | | <svg-icon |
|---|
| | | v-show="mouseHoverType==='mouseenter'" |
|---|
| | | style="cursor: pointer" |
|---|
| | | :icon-class="!isExpandForm?'doubleDown':'doubleUp'" |
|---|
| | | @click="isExpandForm=!isExpandForm" |
|---|
| | | @mouseout="mouseHoverType=$event.type" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="elTableDiv"> |
|---|
| | | <el-table |
|---|
| | | ref="tableDataRef" |
|---|
| | | class="tableFixed" |
|---|
| | | :data="tableData" |
|---|
| | | :height="isExpandForm?tableHeight:(tableHeight+40)+'px'" |
|---|
| | | border |
|---|
| | | :row-class-name="tableRowClassName" |
|---|
| | | :style="{width: 100+'%',height:isExpandForm?tableHeight:(tableHeight+40)+'px',}" |
|---|
| | | highlight-current-row |
|---|
| | | :header-cell-style="this.$headerCellStyle" |
|---|
| | | :cell-style="this.$cellStyle" |
|---|
| | | @sort-change="sortChange" |
|---|
| | | > |
|---|
| | | <el-table-column |
|---|
| | | type="index" |
|---|
| | | width="50" |
|---|
| | | fixed |
|---|
| | | label="序号" |
|---|
| | | /> |
|---|
| | | <el-table-column |
|---|
| | | prop="TaskName" |
|---|
| | | label="作业名称" |
|---|
| | | sortable="custom" |
|---|
| | | /> |
|---|
| | | <el-table-column |
|---|
| | | prop="GroupName" |
|---|
| | | label="分组" |
|---|
| | | sortable="custom" |
|---|
| | | /> |
|---|
| | | <el-table-column |
|---|
| | | prop="LastRunTime" |
|---|
| | | label="最后执行时间" |
|---|
| | | sortable="custom" |
|---|
| | | min-width="120" |
|---|
| | | /> |
|---|
| | | <el-table-column |
|---|
| | | prop="Interval" |
|---|
| | | label="间隔" |
|---|
| | | sortable="custom" |
|---|
| | | /> |
|---|
| | | <el-table-column |
|---|
| | | prop="Status" |
|---|
| | | label="状态" |
|---|
| | | width="75" |
|---|
| | | sortable="custom" |
|---|
| | | > |
|---|
| | | <template slot-scope="{row}"> |
|---|
| | | <el-tag v-if="row.Status===0" size="medium" type="success">正常</el-tag> |
|---|
| | | <el-tag v-if="row.Status===1" size="medium" type="danger">暂停</el-tag> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | prop="Describe" |
|---|
| | | label="描述" |
|---|
| | | sortable="custom" |
|---|
| | | /> |
|---|
| | | <el-table-column |
|---|
| | | prop="ApiUrl" |
|---|
| | | label="ApiUrl" |
|---|
| | | sortable="custom" |
|---|
| | | /> |
|---|
| | | <el-table-column |
|---|
| | | prop="RequestType" |
|---|
| | | label="请求方式" |
|---|
| | | sortable="custom" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <el-table-column |
|---|
| | | label="操作" |
|---|
| | | width="200" |
|---|
| | | fixed="right" |
|---|
| | | > |
|---|
| | | <template slot-scope="{row}"> |
|---|
| | | <div class="operationClass"> |
|---|
| | | <el-tooltip class="item" effect="dark" content="暂停任务" placement="top"> |
|---|
| | | <i |
|---|
| | | class="el-icon-switch-button" |
|---|
| | | style="margin-right: 15px;color: RED;cursor: pointer" |
|---|
| | | @click="pauseTask(row)" |
|---|
| | | /> |
|---|
| | | </el-tooltip> |
|---|
| | | <el-tooltip class="item" effect="dark" content="开启任务" placement="top"> |
|---|
| | | <i |
|---|
| | | class="el-icon-caret-right" |
|---|
| | | style="margin-right: 15px;color: #42B983;cursor: pointer" |
|---|
| | | @click="startTask(row)" |
|---|
| | | /> |
|---|
| | | </el-tooltip> |
|---|
| | | <el-tooltip class="item" effect="dark" content="立即执行" placement="top"> |
|---|
| | | <i |
|---|
| | | class="el-icon-d-arrow-right" |
|---|
| | | style="margin-right: 15px;color: #42B983;cursor: pointer" |
|---|
| | | @click="runTask(row)" |
|---|
| | | /> |
|---|
| | | </el-tooltip> |
|---|
| | | |
|---|
| | | <el-tooltip class="item" effect="dark" content="查看记录" placement="top"> |
|---|
| | | <i |
|---|
| | | class="el-icon-document" |
|---|
| | | style="margin-right: 15px;color: #42B983;cursor: pointer" |
|---|
| | | @click="check(row)" |
|---|
| | | /> |
|---|
| | | </el-tooltip> |
|---|
| | | |
|---|
| | | <el-tooltip class="item" effect="dark" content="编辑任务" placement="top"> |
|---|
| | | <i class="el-icon-edit-outline" :style="{color:$store.state.settings.theme}" @click="edit('edit',row)" /> |
|---|
| | | </el-tooltip> |
|---|
| | | <el-tooltip v-del-tab-index class="item" effect="dark" :style="{color:$store.state.settings.theme}" content="删除任务" placement="top"> |
|---|
| | | <i class="el-icon-delete" @click="del(row)" /> |
|---|
| | | </el-tooltip> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </div> |
|---|
| | | <!--分页--> |
|---|
| | | <pagination |
|---|
| | | :total="total" |
|---|
| | | :page.sync="form.page" |
|---|
| | | :limit.sync="form.rows" |
|---|
| | | align="right" |
|---|
| | | layout="total,prev, pager, next,sizes" |
|---|
| | | popper-class="select_bottom" |
|---|
| | | @pagination="getTaskBackGroundGetJobs" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <el-dialog |
|---|
| | | v-el-drag-dialog |
|---|
| | | :title="operation==='add'?'新增':'编辑'" |
|---|
| | | :visible.sync="dialogVisible" |
|---|
| | | width="900px" |
|---|
| | | :close-on-click-modal="false" |
|---|
| | | top="15vh" |
|---|
| | | @closed="handleClose" |
|---|
| | | @close="handleClose" |
|---|
| | | > |
|---|
| | | |
|---|
| | | <el-form ref="dialogForm" inline :rules="dialogFormRules" :model="dialogForm" label-width="110px"> |
|---|
| | | <el-form-item label="作业名称" prop="TaskName"> |
|---|
| | | <el-input v-model="dialogForm.TaskName" :disabled="operation!=='add'" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="分组" prop="GroupName"> |
|---|
| | | <el-input v-model="dialogForm.GroupName" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | |
|---|
| | | <!-- <el-popover v-model="cronPopover">--> |
|---|
| | | <!-- <cron i18n="cn" @change="changeCron" @close="cronPopover=false" />--> |
|---|
| | | <!-- <el-form-item slot="reference" label="cron表达式" prop="Interval">--> |
|---|
| | | <!-- <el-input--> |
|---|
| | | <!-- v-model="dialogForm.Interval"--> |
|---|
| | | <!-- placeholder="请输入定时策略"--> |
|---|
| | | <!-- style="width:200px"--> |
|---|
| | | <!-- @click="cronPopover=true"--> |
|---|
| | | <!-- />--> |
|---|
| | | <!-- </el-form-item>--> |
|---|
| | | <!-- </el-popover>--> |
|---|
| | | |
|---|
| | | <el-form-item label="cron表达式" prop="Interval"> |
|---|
| | | <el-input |
|---|
| | | v-model="dialogForm.Interval" |
|---|
| | | placeholder="请输入定时策略" |
|---|
| | | style="width:200px" |
|---|
| | | readonly |
|---|
| | | > |
|---|
| | | <el-button slot="append" icon="el-icon-thumb" @click="showDialog" /> |
|---|
| | | </el-input> |
|---|
| | | </el-form-item> |
|---|
| | | |
|---|
| | | <el-form-item label="ApiUrl" prop="ApiUrl"> |
|---|
| | | <el-input v-model="dialogForm.ApiUrl" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="header(Key)" prop="AuthKey"> |
|---|
| | | <el-input v-model="dialogForm.AuthKey" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="header(value)" prop="AuthValue"> |
|---|
| | | <el-input v-model="dialogForm.AuthValue" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | |
|---|
| | | <!-- <el-form-item label="请求方式" prop="RequestType">--> |
|---|
| | | <!-- <el-input v-model="dialogForm.RequestType" style="width: 200px" />--> |
|---|
| | | <!-- </el-form-item>--> |
|---|
| | | <el-form-item label="描述" prop="Describe"> |
|---|
| | | <el-input v-model="dialogForm.Describe" type="textarea" style="width: 200px" /> |
|---|
| | | </el-form-item> |
|---|
| | | |
|---|
| | | </el-form> |
|---|
| | | |
|---|
| | | <el-dialog |
|---|
| | | v-el-drag-dialog |
|---|
| | | :close-on-click-modal="false" |
|---|
| | | top="8vh" |
|---|
| | | width="900px" |
|---|
| | | title="生成 cron" |
|---|
| | | :visible.sync="showCron" |
|---|
| | | append-to-body |
|---|
| | | > |
|---|
| | | <vcrontab :expression="expression" @hide="showCron=false" @fill="crontabFill" /> |
|---|
| | | </el-dialog> |
|---|
| | | |
|---|
| | | <span slot="footer" class="dialog-footer"> |
|---|
| | | <div class="footerButton"> |
|---|
| | | <el-button v-waves @click="dialogVisibleCancel">取 消</el-button> |
|---|
| | | <el-button v-waves type="primary" @click="dialogVisibleConfirm">确 定</el-button> |
|---|
| | | </div> |
|---|
| | | </span> |
|---|
| | | </el-dialog> |
|---|
| | | |
|---|
| | | <el-dialog |
|---|
| | | v-el-drag-dialog |
|---|
| | | title="cron 执行记录" |
|---|
| | | :visible.sync="dialogVisible2" |
|---|
| | | width="900px" |
|---|
| | | |
|---|
| | | top="15vh" |
|---|
| | | @closed="handleClose2" |
|---|
| | | @close="handleClose2" |
|---|
| | | > |
|---|
| | | <!-- :close-on-click-modal="false"--> |
|---|
| | | <!-- {{ recordData }}--> |
|---|
| | | |
|---|
| | | <el-timeline :reverse="false"> |
|---|
| | | <el-timeline-item |
|---|
| | | v-for="(item, index) in recordData" |
|---|
| | | :key="item.BeginDate" |
|---|
| | | :timestamp="item.Msg" |
|---|
| | | > |
|---|
| | | {{ item.BeginDate }} |
|---|
| | | </el-timeline-item> |
|---|
| | | </el-timeline> |
|---|
| | | |
|---|
| | | <span slot="footer" class="dialog-footer"> |
|---|
| | | <div class="footerButton"> |
|---|
| | | <el-button v-waves @click="dialogVisible2=false">返 回</el-button> |
|---|
| | | <!-- <el-button v-waves type="primary" @click="dialogVisibleConfirm">确 定</el-button>--> |
|---|
| | | </div> |
|---|
| | | </span> |
|---|
| | | </el-dialog> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Pagination from '@/components/Pagination' |
|---|
| | | import { |
|---|
| | | TaskBackGroundAdd, |
|---|
| | | TaskBackGroundGetJobs, |
|---|
| | | TaskBackGroundGetRunLog, |
|---|
| | | TaskBackGroundPause, |
|---|
| | | TaskBackGroundRemove, TaskBackGroundRun, |
|---|
| | | TaskBackGroundStart, TaskBackGroundUpdate |
|---|
| | | } from '@/api/TaskBackGround' |
|---|
| | | import elDragDialog from '@/directive/el-drag-dialog' |
|---|
| | | import waves from '@/directive/waves' |
|---|
| | | import { cron } from 'vue-cron' |
|---|
| | | import cronstrue from 'cronstrue/i18n' |
|---|
| | | import vcrontab from '../../components/VcronTab/index' |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: 'CronTime', |
|---|
| | | components: { |
|---|
| | | Pagination, cron, vcrontab |
|---|
| | | }, |
|---|
| | | directives: { elDragDialog, waves }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | mouseHoverType: 'mouseout', |
|---|
| | | isExpandForm: false, |
|---|
| | | mainHeight: 0, |
|---|
| | | tableHeight: 0, |
|---|
| | | form: { |
|---|
| | | OrgCode: '', // 组织架构代码 |
|---|
| | | OrgName: '', // 组织架构名称 |
|---|
| | | OrgType: '', // 组织类型 |
|---|
| | | UserName: '', // 创建人员 |
|---|
| | | createdate: '', |
|---|
| | | prop: 'lm_date', // 排序字段 |
|---|
| | | order: 'desc', // 排序字段 |
|---|
| | | page: 1, // 第几页 |
|---|
| | | rows: 20 // 每页多少条 |
|---|
| | | }, |
|---|
| | | |
|---|
| | | total: 10, |
|---|
| | | tableData: [], |
|---|
| | | dialogVisible: false, |
|---|
| | | dialogForm: { |
|---|
| | | TaskName: '', // 作业名称 |
|---|
| | | GroupName: '', // 分组 |
|---|
| | | Interval: '', // 间隔 |
|---|
| | | ApiUrl: '', // ApiUrl |
|---|
| | | AuthKey: '', // AuthKey |
|---|
| | | AuthValue: '', // AuthValue |
|---|
| | | Describe: '', // 描述 |
|---|
| | | RequestType: 'POST', // 请求类型 |
|---|
| | | LastRunTime: '', // 最后执行时间 |
|---|
| | | Status: 0// 状态 |
|---|
| | | }, |
|---|
| | | cronPopover: false, |
|---|
| | | |
|---|
| | | showCron: false, |
|---|
| | | expression: '', |
|---|
| | | |
|---|
| | | operation: '', |
|---|
| | | dialogFormRules: { |
|---|
| | | TaskName: [ |
|---|
| | | { required: true, message: '请输入作业任务', trigger: ['blur', 'change'] } |
|---|
| | | ], |
|---|
| | | GroupName: [ |
|---|
| | | { required: true, message: '请输入分组', trigger: ['blur', 'change'] } |
|---|
| | | ], |
|---|
| | | Interval: [ |
|---|
| | | { required: true, message: '请输入cron表达式', trigger: ['blur', 'change'] } |
|---|
| | | ], |
|---|
| | | ApiUrl: [ |
|---|
| | | { required: true, message: '请输入ApiUrl', trigger: ['blur', 'change'] } |
|---|
| | | ], |
|---|
| | | RequestType: [ |
|---|
| | | { required: true, message: '请输入请求方式', trigger: ['blur', 'change'] } |
|---|
| | | ], |
|---|
| | | Describe: [ |
|---|
| | | { required: true, message: '请输入请求描述', trigger: ['blur', 'change'] } |
|---|
| | | ] |
|---|
| | | // AuthKey: [ |
|---|
| | | // { required: true, message: '请输入authKey', trigger: ['blur', 'change'] } |
|---|
| | | // ], |
|---|
| | | // AuthValue: [ |
|---|
| | | // { required: true, message: '请输入authValue', trigger: ['blur', 'change'] } |
|---|
| | | // ] |
|---|
| | | |
|---|
| | | }, |
|---|
| | | dialogVisible2: false, |
|---|
| | | OrgTypeArrxx: [], |
|---|
| | | recordData: []// 查看记录数组 |
|---|
| | | |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | activated() { |
|---|
| | | window.addEventListener('resize', this.getHeight) |
|---|
| | | this.getHeight() |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | window.addEventListener('resize', this.getHeight) |
|---|
| | | this.getHeight() |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | crontabFill(val) { |
|---|
| | | this.dialogForm.Interval = val |
|---|
| | | // const t = cronstrue.toString(this.dialogForm.Interval, { locale: 'zh_CN' }) |
|---|
| | | // console.log(t) |
|---|
| | | }, |
|---|
| | | showDialog() { |
|---|
| | | this.expression = this.dialogForm.Interval |
|---|
| | | // 传入的 cron 表达式，可以反解析到 UI 上 |
|---|
| | | this.showCron = true |
|---|
| | | }, |
|---|
| | | changeCron(val) { |
|---|
| | | this.dialogForm.Interval = val |
|---|
| | | // cronstrue 是一个 JavaScript 库，解析 cron 表达式并输出可读的 cron 描述。 |
|---|
| | | // const t = cronstrue.toString(this.dialogForm.Interval, { locale: 'zh_CN' }) |
|---|
| | | // console.log(t) |
|---|
| | | }, |
|---|
| | | async getTaskBackGroundGetJobs() { |
|---|
| | | const res = await TaskBackGroundGetJobs() |
|---|
| | | this.tableData = res.data |
|---|
| | | this.total = res.data.length |
|---|
| | | }, |
|---|
| | | // 排序改变时 |
|---|
| | | sortChange({ column, prop, order }) { |
|---|
| | | if (order === 'descending') { |
|---|
| | | order = 'desc' |
|---|
| | | } else if (order === 'ascending') { |
|---|
| | | order = 'asc' |
|---|
| | | } else { |
|---|
| | | order = 'desc' |
|---|
| | | } |
|---|
| | | this.form.order = order |
|---|
| | | this.form.prop = prop |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | }, |
|---|
| | | // 查询 |
|---|
| | | search() { |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | }, |
|---|
| | | // 重置 |
|---|
| | | reset() { |
|---|
| | | this.form.OrgCode = '' |
|---|
| | | this.form.OrgName = '' |
|---|
| | | this.form.OrgType = '' |
|---|
| | | this.form.UserName = '' |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | }, |
|---|
| | | // 新增按钮 |
|---|
| | | add(operation) { |
|---|
| | | this.operation = operation |
|---|
| | | this.dialogVisible = true |
|---|
| | | }, |
|---|
| | | // 修改按钮 |
|---|
| | | edit(operation, row) { |
|---|
| | | this.operation = operation |
|---|
| | | this.dialogVisible = true |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.dialogForm.TaskName = row.TaskName |
|---|
| | | this.dialogForm.GroupName = row.GroupName |
|---|
| | | this.dialogForm.Interval = row.Interval |
|---|
| | | this.dialogForm.ApiUrl = row.ApiUrl |
|---|
| | | this.dialogForm.AuthKey = row.AuthKey |
|---|
| | | this.dialogForm.AuthValue = row.AuthValue |
|---|
| | | this.dialogForm.Describe = row.Describe |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 删除按钮 |
|---|
| | | async del(row) { |
|---|
| | | this.$confirm('是否确认删除?', '提示', { |
|---|
| | | confirmButtonText: '确定', |
|---|
| | | cancelButtonText: '取消', |
|---|
| | | type: 'warning' |
|---|
| | | }).then(() => { |
|---|
| | | TaskBackGroundRemove(row).then(res => { |
|---|
| | | if (res.code === '200') { |
|---|
| | | this.$message.success('删除成功!') |
|---|
| | | if (this.form.page > 1 && this.tableData.length === 1) { |
|---|
| | | this.form.page-- |
|---|
| | | } |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }).catch(() => { |
|---|
| | | this.$message.info('已取消删除') |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 暂停任务 |
|---|
| | | async pauseTask(row) { |
|---|
| | | const res = await TaskBackGroundPause(row) |
|---|
| | | if (res.code === '200') { |
|---|
| | | await this.getTaskBackGroundGetJobs() |
|---|
| | | return this.$message.success(res.message) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // 开启任务 |
|---|
| | | async startTask(row) { |
|---|
| | | const res = await TaskBackGroundStart(row) |
|---|
| | | if (res.code === '200') { |
|---|
| | | await this.getTaskBackGroundGetJobs() |
|---|
| | | return this.$message.success(res.message) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // 立即执行 |
|---|
| | | async runTask(row) { |
|---|
| | | const res = await TaskBackGroundRun(row) |
|---|
| | | if (res.code === '200') { |
|---|
| | | await this.getTaskBackGroundGetJobs() |
|---|
| | | this.$message.success(res.message) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // 查看记录 |
|---|
| | | async check(row) { |
|---|
| | | const data = { |
|---|
| | | TaskName: row.TaskName, |
|---|
| | | GroupName: row.GroupName, |
|---|
| | | page: 1 |
|---|
| | | } |
|---|
| | | const res = await TaskBackGroundGetRunLog(data) |
|---|
| | | |
|---|
| | | if (res.code === '200') { |
|---|
| | | this.recordData = res.data |
|---|
| | | this.dialogVisible2 = true |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // 对话框关闭事件 |
|---|
| | | handleClose() { |
|---|
| | | this.dialogForm.TaskName = '' |
|---|
| | | this.dialogForm.GroupName = '' |
|---|
| | | this.dialogForm.Interval = '' |
|---|
| | | this.dialogForm.ApiUrl = '' |
|---|
| | | this.dialogForm.AuthKey = '' |
|---|
| | | this.dialogForm.AuthValue = '' |
|---|
| | | this.dialogForm.Describe = '' |
|---|
| | | this.dialogForm.RequestType = 'POST' |
|---|
| | | this.dialogForm.LastRunTime = '' |
|---|
| | | this.dialogForm.Status = 0 |
|---|
| | | this.$refs.dialogForm.clearValidate() |
|---|
| | | }, |
|---|
| | | // 对话框取消 |
|---|
| | | dialogVisibleCancel() { |
|---|
| | | this.dialogVisible = false |
|---|
| | | }, |
|---|
| | | // 对话框确认 |
|---|
| | | dialogVisibleConfirm() { |
|---|
| | | console.log(this.dialogForm) |
|---|
| | | |
|---|
| | | // console.log(new Date().getUTCDate()) |
|---|
| | | |
|---|
| | | this.$refs.dialogForm.validate(valid => { |
|---|
| | | if (valid) { |
|---|
| | | // const data = { |
|---|
| | | // OrganCode: this.dialogForm.OrgCode, |
|---|
| | | // OrganName: this.dialogForm.OrgName, |
|---|
| | | // OperType: this.operation === 'add' ? 'Add' : 'Update', |
|---|
| | | // Operator: getCookie('admin') |
|---|
| | | // } |
|---|
| | | |
|---|
| | | if (this.operation === 'add') { |
|---|
| | | TaskBackGroundAdd(this.dialogForm).then(res => { |
|---|
| | | if (res.code === '200') { |
|---|
| | | this.$message.success(this.operation === 'add' ? '添加成功！' : '修改成功！') |
|---|
| | | this.dialogVisible = false |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | } else { |
|---|
| | | this.$message.error(this.operation === 'add' ? '添加失败！' : '修改失败！') |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } else { |
|---|
| | | TaskBackGroundUpdate(this.dialogForm).then(res => { |
|---|
| | | if (res.code === '200') { |
|---|
| | | this.$message.success(this.operation === 'add' ? '添加成功！' : '修改成功！') |
|---|
| | | this.dialogVisible = false |
|---|
| | | this.getTaskBackGroundGetJobs() |
|---|
| | | } else { |
|---|
| | | this.$message.error(this.operation === 'add' ? '添加失败！' : '修改失败！') |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | handleClose2() { |
|---|
| | | this.recordData = [] |
|---|
| | | }, |
|---|
| | | // 获取页面高度 |
|---|
| | | getHeight() { |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.mainHeight = window.innerHeight - 85 |
|---|
| | | this.tableHeight = this.mainHeight - 255 |
|---|
| | | this.$refs.tableDataRef.doLayout() |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | tableRowClassName({ row, rowIndex }) { |
|---|
| | | return 'custom-row' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="scss" scoped> |
|---|
| | | ::v-deep .pop_btn { |
|---|
| | | display: flex; |
|---|
| | | justify-content: right; |
|---|
| | | } |
|---|
| | | </style> |
|---|
