From a2bce22a3a4df5f4662c373e57c07fa4268aeee1 Mon Sep 17 00:00:00 2001 From: 小小儁爺 <1694218219@qq.com> Date: 星期五, 13 六月 2025 09:02:52 +0800 Subject: [PATCH] 1.修改工单打印模板 --- src/views/basicSettings/cronTime.vue | 1263 ++++++++++++++++++++++++++++---------------------------- 1 files changed, 634 insertions(+), 629 deletions(-) diff --git a/src/views/basicSettings/cronTime.vue b/src/views/basicSettings/cronTime.vue index ae6683e..b828741 100644 --- a/src/views/basicSettings/cronTime.vue +++ b/src/views/basicSettings/cronTime.vue @@ -1,629 +1,634 @@ -<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">姝e父</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: '', // 缁勭粐鏋舵瀯浠g爜 - 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: '璇疯緭鍏ron琛ㄨ揪寮�', trigger: ['blur', 'change'] } - ], - ApiUrl: [ - { required: true, message: '璇疯緭鍏piUrl', trigger: ['blur', 'change'] } - ], - RequestType: [ - { required: true, message: '璇疯緭鍏ヨ姹傛柟寮�', trigger: ['blur', 'change'] } - ], - Describe: [ - { required: true, message: '璇疯緭鍏ヨ姹傛弿杩�', trigger: ['blur', 'change'] } - ] - // AuthKey: [ - // { required: true, message: '璇疯緭鍏uthKey', trigger: ['blur', 'change'] } - // ], - // AuthValue: [ - // { required: true, message: '璇疯緭鍏uthValue', 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 搴擄紝瑙f瀽 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">姝e父</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: '', // 缁勭粐鏋舵瀯浠g爜 + 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: '璇疯緭鍏ron琛ㄨ揪寮�', trigger: ['blur', 'change'] } + ], + ApiUrl: [ + { required: true, message: '璇疯緭鍏piUrl', trigger: ['blur', 'change'] } + ], + RequestType: [ + { required: true, message: '璇疯緭鍏ヨ姹傛柟寮�', trigger: ['blur', 'change'] } + ], + Describe: [ + { required: true, message: '璇疯緭鍏ヨ姹傛弿杩�', trigger: ['blur', 'change'] } + ] + // AuthKey: [ + // { required: true, message: '璇疯緭鍏uthKey', trigger: ['blur', 'change'] } + // ], + // AuthValue: [ + // { required: true, message: '璇疯緭鍏uthValue', 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 搴擄紝瑙f瀽 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> -- Gitblit v1.9.3