[Feature-3878]Replace the page with element-ui (#4065)
* [Feature-3878]Introduce elment-ui and replace the security center module page with elment-ui * Change node version * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * Replace the page with element-ui * Replace user management with elment-ui * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * fix * Repair the last Sunday of each month
This commit is contained in:
break60
GitHub
parent
a13e737eb4
commit
e033f81e9d
|
|
@ -52,7 +52,6 @@ jobs:
|
|||
npm install
|
||||
npm run lint
|
||||
npm run build
|
||||
|
||||
License-check:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
|
|
@ -68,4 +67,4 @@ jobs:
|
|||
with:
|
||||
java-version: 1.8
|
||||
- name: Check
|
||||
run: mvn -B apache-rat:check
|
||||
run: mvn -B apache-rat:check
|
||||
|
|
@ -490,6 +490,7 @@ MIT licenses
|
|||
clipboard 2.0.1: https://github.com/zenorocha/clipboard.js MIT
|
||||
codemirror 5.43.0: https://github.com/codemirror/CodeMirror MIT
|
||||
dayjs 1.7.8: https://github.com/iamkun/dayjs MIT
|
||||
element-ui 2.13.2: https://github.com/ElemeFE/element MIT
|
||||
html2canvas 0.5.0-beta4: https://github.com/niklasvh/html2canvas MIT
|
||||
jquery 3.3.1: https://github.com/jquery/jquery MIT
|
||||
jquery-ui 1.12.1: https://github.com/jquery/jquery-ui MIT
|
||||
|
|
|
|||
|
|
@ -0,0 +1,21 @@
|
|||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2016-present ElemeFE
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
|
|
@ -207,7 +207,7 @@ const baseConfig = {
|
|||
'jquery':'jquery/dist/jquery.min.js',
|
||||
'jquery-ui': 'jquery-ui'
|
||||
},
|
||||
extensions: ['.js', 'json', '.vue', '.scss']
|
||||
extensions: ['*', '.js', 'json', '.vue', '.scss']
|
||||
},
|
||||
plugins: [
|
||||
new VueLoaderPlugin(),
|
||||
|
|
|
|||
|
|
@ -13,7 +13,6 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@riophae/vue-treeselect": "^0.4.0",
|
||||
"ans-ui": "1.1.9",
|
||||
"axios": "^0.16.2",
|
||||
"bootstrap": "3.3.7",
|
||||
"canvg": "1.5.1",
|
||||
|
|
@ -23,6 +22,8 @@
|
|||
"dagre": "^0.8.5",
|
||||
"dayjs": "^1.7.8",
|
||||
"echarts": "4.1.0",
|
||||
"element-ui": "2.13.2",
|
||||
"font-awesome": "^4.7.0",
|
||||
"html2canvas": "^0.5.0-beta4",
|
||||
"jquery": "3.3.1",
|
||||
"jquery-ui": "^1.12.1",
|
||||
|
|
@ -31,7 +32,7 @@
|
|||
"lodash": "^4.17.11",
|
||||
"normalize.css": "^8.0.1",
|
||||
"vue": "^2.5.17",
|
||||
"vue-router": "2.7.0",
|
||||
"vue-router": "^3.0.0",
|
||||
"vuex": "^3.0.0",
|
||||
"vuex-router-sync": "^5.0.0"
|
||||
},
|
||||
|
|
@ -65,6 +66,7 @@
|
|||
"html-webpack-plugin": "^3.2.0",
|
||||
"mini-css-extract-plugin": "^0.8.2",
|
||||
"node-sass": "^4.14.1",
|
||||
"pack": "^2.2.0",
|
||||
"postcss-loader": "^3.0.0",
|
||||
"progress-bar-webpack-plugin": "^1.12.1",
|
||||
"rimraf": "^2.6.2",
|
||||
|
|
|
|||
|
|
@ -203,5 +203,4 @@
|
|||
</profiles>
|
||||
|
||||
|
||||
|
||||
</project>
|
||||
</project>
|
||||
|
|
@ -18,6 +18,9 @@
|
|||
// The Vue build version to load with the `import` command
|
||||
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
|
||||
import Vue from 'vue'
|
||||
import ElementUI from 'element-ui'
|
||||
import locale from 'element-ui/lib/locale/lang/en'
|
||||
import 'element-ui/lib/theme-chalk/index.css'
|
||||
import App from './App'
|
||||
import router from './router'
|
||||
import store from './store'
|
||||
|
|
@ -27,20 +30,20 @@ import Chart from '@/module/ana-charts'
|
|||
import '@/module/filter/formatDate'
|
||||
import themeData from '@/module/echarts/themeData.json'
|
||||
import Permissions from '@/module/permissions'
|
||||
import 'ans-ui/lib/ans-ui.min.css'
|
||||
import ans from 'ans-ui/lib/ans-ui.min'
|
||||
import en_US from 'ans-ui/lib/locale/en' // eslint-disable-line
|
||||
import 'sass/conf/home/index.scss'
|
||||
import 'bootstrap/dist/css/bootstrap.min.css'
|
||||
|
||||
import 'bootstrap/dist/js/bootstrap.min.js'
|
||||
import 'canvg/dist/browser/canvg.min.js'
|
||||
import 'font-awesome/css/font-awesome.min.css'
|
||||
|
||||
// Component internationalization
|
||||
const useOpt = i18n.globalScope.LOCALE === 'en_US' ? { locale: en_US } : {}
|
||||
const useOpt = i18n.globalScope.LOCALE === 'en_US' ? { locale: locale } : {}
|
||||
|
||||
i18n.globalScope.LOCALE === 'en_US' ? Vue.use(ElementUI, { locale }) : Vue.use(ElementUI)
|
||||
|
||||
// Vue.use(ans)
|
||||
Vue.use(ans, useOpt)
|
||||
Vue.use(useOpt)
|
||||
|
||||
sync(store, router)
|
||||
|
||||
|
|
|
|||
|
|
@ -29,31 +29,31 @@ const toolOper = (dagThis) => {
|
|||
return [
|
||||
{
|
||||
code: 'pointer',
|
||||
icon: 'ans-icon-pointer',
|
||||
icon: 'el-icon-thumb',
|
||||
disable: disabled,
|
||||
desc: `${i18n.$t('Drag Nodes and Selected Items')}`
|
||||
},
|
||||
{
|
||||
code: 'line',
|
||||
icon: 'ans-icon-slash',
|
||||
icon: 'el-icon-top-right',
|
||||
disable: disabled,
|
||||
desc: `${i18n.$t('Select Line Connection')}`
|
||||
},
|
||||
{
|
||||
code: 'remove',
|
||||
icon: 'ans-icon-trash',
|
||||
icon: 'el-icon-delete',
|
||||
disable: disabled,
|
||||
desc: `${i18n.$t('Delete selected lines or nodes')}`
|
||||
},
|
||||
{
|
||||
code: 'download',
|
||||
icon: 'ans-icon-download',
|
||||
icon: 'el-icon-download',
|
||||
disable: !dagThis.type,
|
||||
desc: `${i18n.$t('Download')}`
|
||||
},
|
||||
{
|
||||
code: 'screen',
|
||||
icon: 'ans-icon-max',
|
||||
icon: 'el-icon-rank',
|
||||
disable: false,
|
||||
desc: `${i18n.$t('Full Screen')}`
|
||||
}
|
||||
|
|
@ -150,98 +150,98 @@ const tasksState = {
|
|||
id: 0,
|
||||
desc: `${i18n.$t('Submitted successfully')}`,
|
||||
color: '#A9A9A9',
|
||||
icoUnicode: 'ans-icon-dot-circle',
|
||||
icoUnicode: 'fa-dot-circle-o',
|
||||
isSpin: false
|
||||
},
|
||||
RUNNING_EXECUTION: {
|
||||
id: 1,
|
||||
desc: `${i18n.$t('Executing')}`,
|
||||
color: '#0097e0',
|
||||
icoUnicode: 'ans-icon-gear',
|
||||
icoUnicode: 'el-icon-s-tools',
|
||||
isSpin: true
|
||||
},
|
||||
READY_PAUSE: {
|
||||
id: 2,
|
||||
desc: `${i18n.$t('Ready to pause')}`,
|
||||
color: '#07b1a3',
|
||||
icoUnicode: 'ans-icon-pause-solid',
|
||||
icoUnicode: 'fa-pause-circle',
|
||||
isSpin: false
|
||||
},
|
||||
PAUSE: {
|
||||
id: 3,
|
||||
desc: `${i18n.$t('Pause')}`,
|
||||
color: '#057c72',
|
||||
icoUnicode: 'ans-icon-pause',
|
||||
icoUnicode: 'el-icon-video-pause',
|
||||
isSpin: false
|
||||
},
|
||||
READY_STOP: {
|
||||
id: 4,
|
||||
desc: `${i18n.$t('Ready to stop')}`,
|
||||
color: '#FE0402',
|
||||
icoUnicode: 'ans-icon-coin',
|
||||
icoUnicode: 'fa-stop-circle-o',
|
||||
isSpin: false
|
||||
},
|
||||
STOP: {
|
||||
id: 5,
|
||||
desc: `${i18n.$t('Stop')}`,
|
||||
color: '#e90101',
|
||||
icoUnicode: 'ans-icon-stop',
|
||||
icoUnicode: 'fa-stop-circle',
|
||||
isSpin: false
|
||||
},
|
||||
FAILURE: {
|
||||
id: 6,
|
||||
desc: `${i18n.$t('failed')}`,
|
||||
color: '#000000',
|
||||
icoUnicode: 'ans-icon-fail-empty',
|
||||
icoUnicode: 'el-icon-circle-close',
|
||||
isSpin: false
|
||||
},
|
||||
SUCCESS: {
|
||||
id: 7,
|
||||
desc: `${i18n.$t('success')}`,
|
||||
color: '#33cc00',
|
||||
icoUnicode: 'ans-icon-success-empty',
|
||||
icoUnicode: 'el-icon-circle-check',
|
||||
isSpin: false
|
||||
},
|
||||
NEED_FAULT_TOLERANCE: {
|
||||
id: 8,
|
||||
desc: `${i18n.$t('Need fault tolerance')}`,
|
||||
color: '#FF8C00',
|
||||
icoUnicode: 'ans-icon-pen',
|
||||
icoUnicode: 'el-icon-edit',
|
||||
isSpin: false
|
||||
},
|
||||
KILL: {
|
||||
id: 9,
|
||||
desc: `${i18n.$t('kill')}`,
|
||||
color: '#a70202',
|
||||
icoUnicode: 'ans-icon-minus-circle-empty',
|
||||
icoUnicode: 'el-icon-remove-outline',
|
||||
isSpin: false
|
||||
},
|
||||
WAITTING_THREAD: {
|
||||
id: 10,
|
||||
desc: `${i18n.$t('Waiting for thread')}`,
|
||||
color: '#912eed',
|
||||
icoUnicode: 'ans-icon-sand-clock',
|
||||
icoUnicode: 'fa-hourglass-end',
|
||||
isSpin: false
|
||||
},
|
||||
WAITTING_DEPEND: {
|
||||
id: 11,
|
||||
desc: `${i18n.$t('Waiting for dependence')}`,
|
||||
color: '#5101be',
|
||||
icoUnicode: 'ans-icon-dependence',
|
||||
icoUnicode: 'fa-window-restore',
|
||||
isSpin: false
|
||||
},
|
||||
DELAY_EXECUTION: {
|
||||
id: 12,
|
||||
desc: `${i18n.$t('Delay execution')}`,
|
||||
color: '#5102ce',
|
||||
icoUnicode: 'ans-icon-coin',
|
||||
icoUnicode: 'fa-stop-circle-o',
|
||||
isSpin: false
|
||||
},
|
||||
FORCED_SUCCESS: {
|
||||
id: 13,
|
||||
desc: `${i18n.$t('Forced success')}`,
|
||||
color: '#5102ce',
|
||||
icoUnicode: 'ans-icon-success-solid',
|
||||
icoUnicode: 'el-icon-success',
|
||||
isSpin: false
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,14 +15,13 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
import Vue from 'vue'
|
||||
let v = new Vue()
|
||||
import _ from 'lodash'
|
||||
import i18n from '@/module/i18n'
|
||||
import { jsPlumb } from 'jsplumb'
|
||||
import JSP from './plugIn/jsPlumbHandle'
|
||||
import DownChart from './plugIn/downChart'
|
||||
import store from '@/conf/home/store'
|
||||
import dagre from "dagre"
|
||||
import dagre from 'dagre'
|
||||
|
||||
/**
|
||||
* Prototype method
|
||||
|
|
@ -53,7 +52,7 @@ Dag.prototype.setConfig = function (o) {
|
|||
*/
|
||||
Dag.prototype.create = function () {
|
||||
const self = this
|
||||
let plumbIns = jsPlumb.getInstance()
|
||||
const plumbIns = jsPlumb.getInstance()
|
||||
plumbIns.reset()
|
||||
plumbIns.ready(() => {
|
||||
JSP.init({
|
||||
|
|
@ -78,7 +77,7 @@ Dag.prototype.create = function () {
|
|||
* Action event on the right side of the toolbar
|
||||
*/
|
||||
Dag.prototype.toolbarEvent = function ({ item, code, is }) {
|
||||
let self = this
|
||||
const self = this
|
||||
switch (code) {
|
||||
case 'pointer':
|
||||
JSP.handleEventPointer(is)
|
||||
|
|
@ -93,21 +92,15 @@ Dag.prototype.toolbarEvent = function ({ item, code, is }) {
|
|||
JSP.handleEventScreen({ item, is })
|
||||
break
|
||||
case 'download':
|
||||
v.$modal.dialog({
|
||||
width: 350,
|
||||
closable: false,
|
||||
showMask: true,
|
||||
maskClosable: true,
|
||||
title: i18n.$t('Download'),
|
||||
content: i18n.$t('Please confirm whether the workflow has been saved before downloading'),
|
||||
ok: {
|
||||
handle (e) {
|
||||
DownChart.download({
|
||||
dagThis: self.dag
|
||||
})
|
||||
}
|
||||
},
|
||||
cancel: {}
|
||||
Vue.prototype.$confirm(`${i18n.$t('Please confirm whether the workflow has been saved before downloading')}`, `${i18n.$t('Download')}`, {
|
||||
confirmButtonText: `${i18n.$t('Confirm')}`,
|
||||
cancelButtonText: `${i18n.$t('Cancel')}`,
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
DownChart.download({
|
||||
dagThis: self.dag
|
||||
})
|
||||
}).catch(() => {
|
||||
})
|
||||
break
|
||||
}
|
||||
|
|
@ -130,7 +123,7 @@ Dag.prototype.backfill = function (arg) {
|
|||
|
||||
for (const i in store.state.dag.connects) {
|
||||
const connect = store.state.dag.connects[i]
|
||||
g.setEdge(connect['endPointSourceId'], connect['endPointTargetId'])
|
||||
g.setEdge(connect.endPointSourceId, connect.endPointTargetId)
|
||||
}
|
||||
dagre.layout(g)
|
||||
|
||||
|
|
@ -166,7 +159,7 @@ Dag.prototype.backfill = function (arg) {
|
|||
})
|
||||
})
|
||||
} else {
|
||||
let plumbIns = jsPlumb.getInstance()
|
||||
const plumbIns = jsPlumb.getInstance()
|
||||
plumbIns.reset()
|
||||
plumbIns.ready(() => {
|
||||
JSP.init({
|
||||
|
|
|
|||
|
|
@ -277,8 +277,9 @@ svg path:hover {
|
|||
background: #fff;
|
||||
border-radius: 3px;
|
||||
box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.1);
|
||||
padding: 4px 0;
|
||||
padding: 4px 4px;
|
||||
visibility:hidden;
|
||||
z-index: 10000;
|
||||
a {
|
||||
height: 30px;
|
||||
line-height: 28px;
|
||||
|
|
|
|||
|
|
@ -34,31 +34,33 @@
|
|||
<div class="dag-contect">
|
||||
<div class="dag-toolbar">
|
||||
<div class="assist-btn">
|
||||
<x-button
|
||||
style="vertical-align: middle;"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('View variables')"
|
||||
data-container="body"
|
||||
type="primary"
|
||||
size="xsmall"
|
||||
:disabled="$route.name !== 'projects-instance-details'"
|
||||
@click="_toggleView"
|
||||
icon="ans-icon-code">
|
||||
</x-button>
|
||||
<x-button
|
||||
<el-button
|
||||
style="vertical-align: middle;"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Startup parameter')"
|
||||
:title="$t('View variables')"
|
||||
data-container="body"
|
||||
type="primary"
|
||||
size="xsmall"
|
||||
size="mini"
|
||||
:disabled="$route.name !== 'projects-instance-details'"
|
||||
@click="_toggleParam"
|
||||
icon="ans-icon-arrow-circle-right">
|
||||
</x-button>
|
||||
@click="_toggleView"
|
||||
icon="el-icon-c-scale-to-original">
|
||||
</el-button>
|
||||
<span>
|
||||
<el-button
|
||||
style="vertical-align: middle;"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Startup parameter')"
|
||||
data-container="body"
|
||||
type="primary"
|
||||
size="mini"
|
||||
:disabled="$route.name !== 'projects-instance-details'"
|
||||
@click="_toggleParam"
|
||||
icon="el-icon-arrow-right">
|
||||
</el-button>
|
||||
</span>
|
||||
<span class="name">{{name}}</span>
|
||||
|
||||
<span v-if="name" class="copy-name" @click="_copyName" :data-clipboard-text="name"><em class="ans-icon-copy" data-container="body" data-toggle="tooltip" :title="$t('Copy name')" ></em></span>
|
||||
<span v-if="name" class="copy-name" @click="_copyName" :data-clipboard-text="name"><em class="el-icon-copy-document" data-container="body" data-toggle="tooltip" :title="$t('Copy name')" ></em></span>
|
||||
</div>
|
||||
<div class="save-btn">
|
||||
<div class="operation" style="vertical-align: middle;">
|
||||
|
|
@ -68,71 +70,75 @@
|
|||
:id="item.code"
|
||||
:key="$index"
|
||||
@click="_ckOperation(item,$event)">
|
||||
<x-button type="text" data-container="body" :icon="item.icon" v-tooltip.light="item.desc"></x-button>
|
||||
<el-button type="text" class="operBtn" data-container="body" :icon="item.icon" v-tooltip.light="item.desc"></el-button>
|
||||
</a>
|
||||
</div>
|
||||
<x-button
|
||||
type="primary"
|
||||
v-tooltip.light="$t('Format DAG')"
|
||||
icon="ans-icon-triangle-solid-right"
|
||||
size="xsmall"
|
||||
data-container="body"
|
||||
v-if="(type === 'instance' || 'definition') && urlParam.id !=undefined"
|
||||
style="vertical-align: middle;"
|
||||
@click="dagAutomaticLayout">
|
||||
</x-button>
|
||||
<x-button
|
||||
v-tooltip.light="$t('Refresh DAG status')"
|
||||
data-container="body"
|
||||
style="vertical-align: middle;"
|
||||
icon="ans-icon-refresh"
|
||||
type="primary"
|
||||
:loading="isRefresh"
|
||||
v-if="type === 'instance'"
|
||||
@click="!isRefresh && _refresh()"
|
||||
size="xsmall" >
|
||||
</x-button>
|
||||
<x-button
|
||||
<el-button
|
||||
type="primary"
|
||||
v-tooltip.light="$t('Format DAG')"
|
||||
icon="el-icon-caret-right"
|
||||
size="mini"
|
||||
data-container="body"
|
||||
v-if="(type === 'instance' || 'definition') && urlParam.id !=undefined"
|
||||
style="vertical-align: middle;"
|
||||
@click="dagAutomaticLayout">
|
||||
</el-button>
|
||||
<span>
|
||||
<el-button
|
||||
v-tooltip.light="$t('Refresh DAG status')"
|
||||
data-container="body"
|
||||
style="vertical-align: middle;"
|
||||
icon="el-icon-refresh"
|
||||
type="primary"
|
||||
:loading="isRefresh"
|
||||
v-if="type === 'instance'"
|
||||
@click="!isRefresh && _refresh()"
|
||||
size="mini" >
|
||||
</el-button>
|
||||
</span>
|
||||
<el-button
|
||||
v-if="isRtTasks"
|
||||
style="vertical-align: middle;"
|
||||
type="primary"
|
||||
size="xsmall"
|
||||
icon="ans-icon-play"
|
||||
size="mini"
|
||||
icon="el-icon-back"
|
||||
@click="_rtNodesDag" >
|
||||
{{$t('Return_1')}}
|
||||
</x-button>
|
||||
<x-button
|
||||
type="primary"
|
||||
v-tooltip.light="$t('Close')"
|
||||
icon="ans-icon-off"
|
||||
size="xsmall"
|
||||
data-container="body"
|
||||
v-if="(type === 'instance' || 'definition') "
|
||||
style="vertical-align: middle;"
|
||||
@click="_closeDAG">
|
||||
{{$t('Close')}}
|
||||
</x-button>
|
||||
<x-button
|
||||
</el-button>
|
||||
<span>
|
||||
<el-button
|
||||
type="primary"
|
||||
v-tooltip.light="$t('Close')"
|
||||
icon="el-icon-switch-button"
|
||||
size="mini"
|
||||
data-container="body"
|
||||
v-if="(type === 'instance' || 'definition') "
|
||||
style="vertical-align: middle;"
|
||||
@click="_closeDAG">
|
||||
{{$t('Close')}}
|
||||
</el-button>
|
||||
</span>
|
||||
<el-button
|
||||
style="vertical-align: middle;"
|
||||
type="primary"
|
||||
size="xsmall"
|
||||
size="mini"
|
||||
:loading="spinnerLoading"
|
||||
@click="_saveChart"
|
||||
icon="ans-icon-save"
|
||||
icon="el-icon-document-checked"
|
||||
>
|
||||
{{spinnerLoading ? 'Loading...' : $t('Save')}}
|
||||
</x-button>
|
||||
<x-button
|
||||
style="vertical-align: middle;"
|
||||
type="primary"
|
||||
size="xsmall"
|
||||
v-if="this.type !== 'instance' && this.urlParam.id !== null"
|
||||
:loading="spinnerLoading"
|
||||
@click="_version"
|
||||
icon="ans-icon-dependence"
|
||||
>
|
||||
{{spinnerLoading ? 'Loading...' : $t('Version Info')}}
|
||||
</x-button>
|
||||
</el-button>
|
||||
<span>
|
||||
<el-button
|
||||
style="vertical-align: middle;"
|
||||
type="primary"
|
||||
size="mini"
|
||||
:loading="spinnerLoading"
|
||||
@click="_version"
|
||||
icon="el-icon-info">
|
||||
{{spinnerLoading ? 'Loading...' : $t('Version Info')}}
|
||||
</el-button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="scrollbar dag-container">
|
||||
|
|
@ -140,6 +146,45 @@
|
|||
<div class="jtk-demo-canvas canvas-wide statemachine-demo jtk-surface jtk-surface-nopan jtk-draggable" id="canvas" ></div>
|
||||
</div>
|
||||
</div>
|
||||
<el-drawer
|
||||
:visible.sync="drawer"
|
||||
size="35%"
|
||||
:with-header="false">
|
||||
<m-versions :versionData = versionData @mVersionSwitchProcessDefinitionVersion="mVersionSwitchProcessDefinitionVersion" @mVersionGetProcessDefinitionVersionsPage="mVersionGetProcessDefinitionVersionsPage" @mVersionDeleteProcessDefinitionVersion="mVersionDeleteProcessDefinitionVersion"></m-versions>
|
||||
</el-drawer>
|
||||
<el-drawer
|
||||
:visible.sync="nodeDrawer"
|
||||
size="50%"
|
||||
:with-header="false">
|
||||
<m-form-model v-if="nodeDrawer" :nodeData = nodeData @addTaskInfo="addTaskInfo" @cacheTaskInfo="cacheTaskInfo" @close="close" @onSubProcess="onSubProcess"></m-form-model>
|
||||
</el-drawer>
|
||||
<el-drawer
|
||||
:visible.sync="lineDrawer"
|
||||
size="50%"
|
||||
:wrapperClosable="false"
|
||||
:with-header="false">
|
||||
<m-form-line-model :lineData = lineData @addLineInfo="addLineInfo" @cancel="cancel"></m-form-line-model>
|
||||
</el-drawer>
|
||||
<el-drawer
|
||||
:visible.sync="udpDrawer"
|
||||
size="50%"
|
||||
:wrapperClosable="false"
|
||||
:with-header="false">
|
||||
<m-udp></m-udp>
|
||||
</el-drawer>
|
||||
<el-dialog
|
||||
:title="$t('Set the DAG diagram name')"
|
||||
:visible.sync="dialogVisible"
|
||||
width="45%">
|
||||
<m-udp @onUdp="onUdpDialog" @close="closeDialog"></m-udp>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog
|
||||
:title="$t('Please set the parameters before starting')"
|
||||
:visible.sync="startDialog"
|
||||
width="65%">
|
||||
<m-start :startData= "startData" :startNodeList="startNodeList" :sourceType="sourceType" @onUpdateStart="onUpdateStart" @closeStart="closeStart"></m-start>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -159,6 +204,7 @@
|
|||
import disabledState from '@/module/mixin/disabledState'
|
||||
import { mapActions, mapState, mapMutations } from 'vuex'
|
||||
import mVersions from '../../projects/pages/definition/pages/list/_source/versions'
|
||||
import mStart from '../../projects/pages/definition/pages/list/_source/start'
|
||||
|
||||
let eventModel
|
||||
|
||||
|
|
@ -179,7 +225,39 @@
|
|||
isLoading: false,
|
||||
taskId: null,
|
||||
arg: false,
|
||||
|
||||
versionData: {
|
||||
processDefinition: {
|
||||
id: null,
|
||||
version: '',
|
||||
state: ''
|
||||
},
|
||||
processDefinitionVersions: [],
|
||||
total: null,
|
||||
pageNo: null,
|
||||
pageSize: null
|
||||
},
|
||||
drawer: false,
|
||||
nodeData: {
|
||||
id: null,
|
||||
taskType: '',
|
||||
self: {},
|
||||
preNode: [],
|
||||
rearList: [],
|
||||
instanceId: null
|
||||
},
|
||||
nodeDrawer: false,
|
||||
lineData: {
|
||||
id: null,
|
||||
sourceId: '',
|
||||
targetId: ''
|
||||
},
|
||||
lineDrawer: false,
|
||||
udpDrawer: false,
|
||||
dialogVisible: false,
|
||||
startDialog: false,
|
||||
startData: {},
|
||||
startNodeList: '',
|
||||
sourceType: ''
|
||||
}
|
||||
},
|
||||
mixins: [disabledState],
|
||||
|
|
@ -190,7 +268,18 @@
|
|||
methods: {
|
||||
...mapActions('dag', ['saveDAGchart', 'updateInstance', 'updateDefinition', 'getTaskState', 'switchProcessDefinitionVersion', 'getProcessDefinitionVersionsPage', 'deleteProcessDefinitionVersion']),
|
||||
...mapMutations('dag', ['addTasks', 'cacheTasks', 'resetParams', 'setIsEditDag', 'setName', 'addConnects']),
|
||||
|
||||
startRunning(item,startNodeList,sourceType) {
|
||||
this.startData = item
|
||||
this.startNodeList.startNodeList
|
||||
this.sourceType = sourceType
|
||||
this.startDialog = true
|
||||
},
|
||||
onUpdateStart() {
|
||||
this.startDialog = false
|
||||
},
|
||||
closeStart() {
|
||||
this.startDialog = false
|
||||
},
|
||||
// DAG automatic layout
|
||||
dagAutomaticLayout() {
|
||||
if(this.store.state.dag.isEditDag) {
|
||||
|
|
@ -379,7 +468,12 @@
|
|||
* @param saveEditDAGChart => Process definition editing
|
||||
*/
|
||||
this[this.type === 'instance' ? 'updateInstance' : 'updateDefinition'](this.urlParam.id).then(res => {
|
||||
this.$message.success(res.msg)
|
||||
// this.$message.success(res.msg)
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success',
|
||||
offset: 80
|
||||
})
|
||||
this.spinnerLoading = false
|
||||
// Jump process definition
|
||||
if (this.type === 'instance') {
|
||||
|
|
@ -439,33 +533,12 @@
|
|||
}
|
||||
return true
|
||||
},
|
||||
/**
|
||||
* Global parameter
|
||||
* @param Promise
|
||||
*/
|
||||
_udpTopFloorPop () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mUdp, {
|
||||
on: {
|
||||
onUdp () {
|
||||
modal.remove()
|
||||
resolve()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
onUdpDialog () {
|
||||
this._save()
|
||||
this.dialogVisible = false
|
||||
},
|
||||
closeDialog () {
|
||||
this.dialogVisible = false
|
||||
},
|
||||
/**
|
||||
* Save chart
|
||||
|
|
@ -476,11 +549,7 @@
|
|||
this.$message.warning(`${i18n.$t('Failed to create node to save')}`)
|
||||
return
|
||||
}
|
||||
|
||||
// Global parameters (optional)
|
||||
this._udpTopFloorPop().then(() => {
|
||||
return this._save()
|
||||
})
|
||||
this.dialogVisible = true
|
||||
},
|
||||
/**
|
||||
* Return to the previous child node
|
||||
|
|
@ -540,44 +609,46 @@
|
|||
_toggleParam () {
|
||||
findComponentDownward(this.$root, `starting-params-dag-index`)._toggleParam()
|
||||
},
|
||||
addLineInfo ({ item, fromThis }) {
|
||||
this.addConnects(item)
|
||||
this.lineDrawer = false
|
||||
},
|
||||
cancel ({fromThis}) {
|
||||
this.lineDrawer = false
|
||||
},
|
||||
|
||||
/**
|
||||
* Create a node popup layer
|
||||
* @param Object id
|
||||
*/
|
||||
_createLineLabel({id, sourceId, targetId}) {
|
||||
// $('#jsPlumb_2_50').text('111')
|
||||
let self = this
|
||||
self.$modal.destroy()
|
||||
const removeNodesEvent = (fromThis) => {
|
||||
// Manually destroy events inside the component
|
||||
fromThis.$destroy()
|
||||
// Close the popup
|
||||
eventModel.remove()
|
||||
}
|
||||
eventModel = this.$drawer({
|
||||
className: 'dagMask',
|
||||
render (h) {
|
||||
return h(mFormLineModel,{
|
||||
on: {
|
||||
addLineInfo ({ item, fromThis }) {
|
||||
self.addConnects(item)
|
||||
setTimeout(() => {
|
||||
removeNodesEvent(fromThis)
|
||||
}, 100)
|
||||
},
|
||||
cancel ({fromThis}) {
|
||||
removeNodesEvent(fromThis)
|
||||
}
|
||||
},
|
||||
props: {
|
||||
id: id,
|
||||
sourceId: sourceId,
|
||||
targetId: targetId
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.lineData.id = id
|
||||
this.lineData.sourceId = sourceId
|
||||
this.lineData.targetId = targetId
|
||||
this.lineDrawer = true
|
||||
},
|
||||
|
||||
addTaskInfo ({ item, fromThis }) {
|
||||
this.addTasks(item)
|
||||
this.nodeDrawer = false
|
||||
},
|
||||
|
||||
cacheTaskInfo({item, fromThis}) {
|
||||
this.cacheTasks(item)
|
||||
},
|
||||
|
||||
close ({ item,flag, fromThis }) {
|
||||
this.addTasks(item)
|
||||
// Edit status does not allow deletion of nodes
|
||||
if (flag) {
|
||||
jsPlumb.remove(this.nodeData.id)
|
||||
}
|
||||
this.nodeDrawer = false
|
||||
},
|
||||
onSubProcess ({ subProcessId, fromThis }) {
|
||||
this._subProcessHandle(subProcessId)
|
||||
},
|
||||
|
||||
_createNodes ({ id, type }) {
|
||||
let self = this
|
||||
let preNode = []
|
||||
|
|
@ -609,66 +680,19 @@
|
|||
} else {
|
||||
preNode = []
|
||||
}
|
||||
if (eventModel) {
|
||||
// Close the popup
|
||||
eventModel.remove()
|
||||
}
|
||||
|
||||
const removeNodesEvent = (fromThis) => {
|
||||
// Manually destroy events inside the component
|
||||
fromThis.$destroy()
|
||||
// Close the popup
|
||||
eventModel.remove()
|
||||
}
|
||||
|
||||
this.taskId = id
|
||||
type = type || self.dagBarId
|
||||
|
||||
eventModel = this.$drawer({
|
||||
closable: false,
|
||||
direction: 'right',
|
||||
escClose: true,
|
||||
className: 'dagMask',
|
||||
render: h => h(mFormModel, {
|
||||
on: {
|
||||
addTaskInfo ({ item, fromThis }) {
|
||||
self.addTasks(item)
|
||||
setTimeout(() => {
|
||||
removeNodesEvent(fromThis)
|
||||
}, 100)
|
||||
},
|
||||
/**
|
||||
* Cache the item
|
||||
* @param item
|
||||
* @param fromThis
|
||||
*/
|
||||
cacheTaskInfo({item, fromThis}) {
|
||||
self.cacheTasks(item)
|
||||
},
|
||||
close ({ item,flag, fromThis }) {
|
||||
self.addTasks(item)
|
||||
// Edit status does not allow deletion of nodes
|
||||
if (flag) {
|
||||
jsPlumb.remove(id)
|
||||
}
|
||||
|
||||
removeNodesEvent(fromThis)
|
||||
},
|
||||
onSubProcess ({ subProcessId, fromThis }) {
|
||||
removeNodesEvent(fromThis)
|
||||
self._subProcessHandle(subProcessId)
|
||||
}
|
||||
},
|
||||
props: {
|
||||
id: id,
|
||||
taskType: type,
|
||||
self: self,
|
||||
preNode: preNode,
|
||||
rearList: rearList,
|
||||
instanceId: this.$route.params.id
|
||||
}
|
||||
})
|
||||
})
|
||||
this.nodeData.id = id
|
||||
this.nodeData.taskType = type
|
||||
this.nodeData.self = self
|
||||
this.nodeData.preNode = preNode
|
||||
this.nodeData.rearList = rearList
|
||||
this.nodeData.instanceId = this.$route.params.id
|
||||
|
||||
this.nodeDrawer = true
|
||||
|
||||
},
|
||||
removeEventModelById ($id) {
|
||||
if(eventModel && this.taskId == $id){
|
||||
|
|
@ -676,6 +700,50 @@
|
|||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* switch version in process definition version list
|
||||
*
|
||||
* @param version the version user want to change
|
||||
* @param processDefinitionId the process definition id
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionSwitchProcessDefinitionVersion({ version, processDefinitionId, fromThis }) {
|
||||
this.$store.state.dag.isSwitchVersion = true
|
||||
this.switchProcessDefinitionVersion({
|
||||
version: version,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res=>{
|
||||
this.$message.success($t('Switch Version Successfully'))
|
||||
this.$router.push({ path: `/projects/definition/list/${processDefinitionId}?_t=${new Date().getTime()}` })
|
||||
}).catch(e => {
|
||||
this.$store.state.dag.isSwitchVersion = false
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* Paging event of process definition versions
|
||||
*
|
||||
* @param pageNo page number
|
||||
* @param pageSize page size
|
||||
* @param processDefinitionId the process definition id of page version
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionGetProcessDefinitionVersionsPage({ pageNo, pageSize, processDefinitionId, fromThis }) {
|
||||
this.getProcessDefinitionVersionsPage({
|
||||
pageNo: pageNo,
|
||||
pageSize: pageSize,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res=>{
|
||||
this.versionData.processDefinitionVersions = res.data.lists
|
||||
this.versionData.total = res.data.totalCount
|
||||
this.versionData.pageSize = res.data.pageSize
|
||||
this.versionData.pageNo = res.data.currentPage
|
||||
}).catch(e=>{
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* query the process definition pagination version
|
||||
*/
|
||||
|
|
@ -690,117 +758,15 @@
|
|||
let total = res.data.totalCount
|
||||
let pageSize = res.data.pageSize
|
||||
let pageNo = res.data.currentPage
|
||||
if (this.versionsModel) {
|
||||
this.versionsModel.remove()
|
||||
}
|
||||
this.versionsModel = this.$drawer({
|
||||
direction: 'right',
|
||||
closable: true,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
render (h) {
|
||||
return h(mVersions, {
|
||||
on: {
|
||||
/**
|
||||
* switch version in process definition version list
|
||||
*
|
||||
* @param version the version user want to change
|
||||
* @param processDefinitionId the process definition id
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionSwitchProcessDefinitionVersion ({ version, processDefinitionId, fromThis }) {
|
||||
|
||||
self.$store.state.dag.isSwitchVersion = true
|
||||
|
||||
self.switchProcessDefinitionVersion({
|
||||
version: version,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res => {
|
||||
self.$message.success($t('Switch Version Successfully'))
|
||||
setTimeout(() => {
|
||||
fromThis.$destroy()
|
||||
self.versionsModel.remove()
|
||||
}, 0)
|
||||
self.$router.push({ path: `/projects/definition/list/${processDefinitionId}?_t=${new Date().getTime()}` })
|
||||
}).catch(e => {
|
||||
self.$store.state.dag.isSwitchVersion = false
|
||||
self.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* Paging event of process definition versions
|
||||
*
|
||||
* @param pageNo page number
|
||||
* @param pageSize page size
|
||||
* @param processDefinitionId the process definition id of page version
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionGetProcessDefinitionVersionsPage ({ pageNo, pageSize, processDefinitionId, fromThis }) {
|
||||
self.getProcessDefinitionVersionsPage({
|
||||
pageNo: pageNo,
|
||||
pageSize: pageSize,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res => {
|
||||
fromThis.processDefinitionVersions = res.data.lists
|
||||
fromThis.total = res.data.totalCount
|
||||
fromThis.pageSize = res.data.pageSize
|
||||
fromThis.pageNo = res.data.currentPage
|
||||
}).catch(e => {
|
||||
self.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* delete one version of process definition
|
||||
*
|
||||
* @param version the version need to delete
|
||||
* @param processDefinitionId the process definition id user want to delete
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionDeleteProcessDefinitionVersion ({ version, processDefinitionId, fromThis }) {
|
||||
self.deleteProcessDefinitionVersion({
|
||||
version: version,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res => {
|
||||
self.$message.success(res.msg || '')
|
||||
fromThis.$emit('mVersionGetProcessDefinitionVersionsPage', {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
processDefinitionId: processDefinitionId,
|
||||
fromThis: fromThis
|
||||
})
|
||||
}).catch(e => {
|
||||
self.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* remove this drawer
|
||||
*
|
||||
* @param fromThis
|
||||
*/
|
||||
close ({ fromThis }) {
|
||||
setTimeout(() => {
|
||||
fromThis.$destroy()
|
||||
self.versionsModel.remove()
|
||||
}, 0)
|
||||
}
|
||||
},
|
||||
props: {
|
||||
processDefinition: {
|
||||
id: self.urlParam.id,
|
||||
version: self.$store.state.dag.version,
|
||||
state: self.releaseState
|
||||
},
|
||||
processDefinitionVersions: processDefinitionVersions,
|
||||
total: total,
|
||||
pageNo: pageNo,
|
||||
pageSize: pageSize
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.versionData.processDefinition.id = this.urlParam.id
|
||||
this.versionData.processDefinition.version = this.$store.state.dag.version
|
||||
this.versionData.processDefinition.state = this.releaseState
|
||||
this.versionData.processDefinitionVersions = processDefinitionVersions
|
||||
this.versionData.total = total
|
||||
this.versionData.pageNo = pageNo
|
||||
this.versionData.pageSize = pageSize
|
||||
this.drawer = true
|
||||
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
|
|
@ -869,10 +835,13 @@
|
|||
computed: {
|
||||
...mapState('dag', ['tasks', 'locations', 'connects', 'isEditDag', 'name'])
|
||||
},
|
||||
components: {}
|
||||
components: { mVersions, mFormModel, mFormLineModel, mUdp, mStart }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" rel="stylesheet/scss">
|
||||
@import "./dag";
|
||||
.operBtn {
|
||||
padding: 8px 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<div style="padding-top: 5px;">
|
||||
<x-switch v-model="enable" @on-click="_onSwitch(0, $event)" :disabled="isDetails"></x-switch>
|
||||
<el-switch v-model="enable" size="small" @change="_onSwitch(0, $event)" :disabled="isDetails"></el-switch>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -35,7 +35,7 @@
|
|||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<div style="padding: 5px 0;">
|
||||
<x-switch v-model="waitStartTimeout.enable" @on-click="_onSwitch(1, $event)" :disabled="isDetails"></x-switch>
|
||||
<el-switch v-model="waitStartTimeout.enable" size="small" @change="_onSwitch(1, $event)" :disabled="isDetails"></el-switch>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -46,22 +46,22 @@
|
|||
<span class="text-box">
|
||||
<span>{{$t('Timeout period')}}</span>
|
||||
</span>
|
||||
<x-input v-model="waitStartTimeout.interval" style="width: 100px;" :disabled="isDetails" maxlength="9">
|
||||
<el-input v-model="waitStartTimeout.interval" size="small" style="width: 100px;" :disabled="isDetails" maxlength="9">
|
||||
<span slot="append">{{$t('Minute')}}</span>
|
||||
</x-input>
|
||||
</el-input>
|
||||
<span class="text-box">
|
||||
<span>{{$t('Check interval')}}</span>
|
||||
</span>
|
||||
<x-input v-model="waitStartTimeout.checkInterval" style="width: 100px;" :disabled="isDetails" maxlength="9">
|
||||
<el-input v-model="waitStartTimeout.checkInterval" size="small" style="width: 100px;" :disabled="isDetails" maxlength="9">
|
||||
<span slot="append">{{$t('Minute')}}</span>
|
||||
</x-input>
|
||||
</el-input>
|
||||
<span class="text-box">
|
||||
<span>{{$t('Timeout strategy')}}</span>
|
||||
</span>
|
||||
<div style="padding-top: 6px;">
|
||||
<x-checkbox-group v-model="waitStartTimeout.strategy">
|
||||
<x-checkbox label="FAILED" :disabled="true">{{$t('Timeout failure')}}</x-checkbox>
|
||||
</x-checkbox-group>
|
||||
<el-checkbox-group size="small" v-model="waitStartTimeout.strategy">
|
||||
<el-checkbox label="FAILED" :disabled="true">{{$t('Timeout failure')}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -73,7 +73,7 @@
|
|||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<div style="padding: 5px 0;">
|
||||
<x-switch v-model="waitCompleteTimeout.enable" @on-click="_onSwitch(2, $event)" :disabled="isDetails"></x-switch>
|
||||
<el-switch v-model="waitCompleteTimeout.enable" size="small" @change="_onSwitch(2, $event)" :disabled="isDetails"></el-switch>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -84,17 +84,17 @@
|
|||
<span class="text-box">
|
||||
<span>{{$t('Timeout period')}}</span>
|
||||
</span>
|
||||
<x-input v-model="waitCompleteTimeout.interval" style="width: 100px;" :disabled="isDetails" maxlength="9">
|
||||
<el-input v-model="waitCompleteTimeout.interval" size="small" style="width: 100px;" :disabled="isDetails" maxlength="9">
|
||||
<span slot="append">{{$t('Minute')}}</span>
|
||||
</x-input>
|
||||
</el-input>
|
||||
<span class="text-box">
|
||||
<span>{{$t('Timeout strategy')}}</span>
|
||||
</span>
|
||||
<div style="padding-top: 6px;">
|
||||
<x-checkbox-group v-model="waitCompleteTimeout.strategy">
|
||||
<x-checkbox label="WARN" :disabled="isDetails">{{$t('Timeout alarm')}}</x-checkbox>
|
||||
<x-checkbox label="FAILED" :disabled="isDetails">{{$t('Timeout failure')}}</x-checkbox>
|
||||
</x-checkbox-group>
|
||||
<el-checkbox-group size="small" v-model="waitCompleteTimeout.strategy">
|
||||
<el-checkbox label="WARN" :disabled="isDetails">{{$t('Timeout alarm')}}</el-checkbox>
|
||||
<el-checkbox label="FAILED" :disabled="isDetails">{{$t('Timeout failure')}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -15,33 +15,34 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
<template>
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 157px;"
|
||||
:disabled="isDetails"
|
||||
@on-change="_onChange"
|
||||
size="small"
|
||||
@change="_onChange"
|
||||
v-model="value">
|
||||
<x-input
|
||||
<el-input
|
||||
ref="input"
|
||||
slot="trigger"
|
||||
v-if="isInput"
|
||||
:disabled="isDetails"
|
||||
slot-scope="{ selectedModel }"
|
||||
maxlength="4"
|
||||
@on-blur="_onBlur"
|
||||
@blur="_onBlur"
|
||||
:placeholder="$t('Please choose')"
|
||||
:value="selectedModel === null ? '0' : selectedModel.value"
|
||||
style="width: 100%;"
|
||||
@on-click-icon.stop="_ckIcon">
|
||||
<em slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="!isIconState"></em>
|
||||
<em slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="isIconState"></em>
|
||||
</x-input>
|
||||
<x-option
|
||||
@click="_ckIcon">
|
||||
<em slot="suffix" class="el-icon-error" style="font-size: 15px;cursor: pointer;" v-show="!isIconState"></em>
|
||||
<em slot="suffix" class="el-icon-arrow-down" style="font-size: 12px;" v-show="isIconState"></em>
|
||||
</el-input>
|
||||
<el-option
|
||||
v-for="city in list"
|
||||
:key="city"
|
||||
:value="city"
|
||||
:label="city">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<script>
|
||||
import _ from 'lodash'
|
||||
|
|
@ -67,8 +68,8 @@
|
|||
},
|
||||
methods: {
|
||||
_onChange (o) {
|
||||
this.$emit('valueEvent', +o.value)
|
||||
this._setIconState(+o.value)
|
||||
this.$emit('valueEvent', +o)
|
||||
this._setIconState(+o)
|
||||
},
|
||||
_setIconState (value) {
|
||||
// Whether there is a list
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<div style="padding-top: 5px;">
|
||||
<x-switch v-model="enable" @on-click="_onSwitch" :disabled="isDetails"></x-switch>
|
||||
<el-switch v-model="enable" size="small" @change="_onSwitch" :disabled="isDetails"></el-switch>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -35,10 +35,10 @@
|
|||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<div style="padding-top: 6px;">
|
||||
<x-checkbox-group v-model="strategy">
|
||||
<x-checkbox label="WARN" :disabled="isDetails">{{$t('Timeout alarm')}}</x-checkbox>
|
||||
<x-checkbox label="FAILED" :disabled="isDetails">{{$t('Timeout failure')}}</x-checkbox>
|
||||
</x-checkbox-group>
|
||||
<el-checkbox-group v-model="strategy" size="small">
|
||||
<el-checkbox label="WARN" :disabled="isDetails">{{$t('Timeout alarm')}}</el-checkbox>
|
||||
<el-checkbox label="FAILED" :disabled="isDetails">{{$t('Timeout failure')}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -49,9 +49,9 @@
|
|||
</div>
|
||||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<x-input v-model="interval" style="width: 200px;" :disabled="isDetails" maxlength="9">
|
||||
<el-input v-model="interval" size="small" style="width: 200px;" :disabled="isDetails" maxlength="9">
|
||||
<span slot="append">{{$t('Minute')}}</span>
|
||||
</x-input>
|
||||
</el-input>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -15,18 +15,19 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
<template>
|
||||
<x-select
|
||||
<el-select
|
||||
:disabled="isDetails"
|
||||
@on-change="_onChange"
|
||||
@change="_onChange"
|
||||
v-model="value"
|
||||
size="small"
|
||||
style="width: 180px">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="item in workerGroupsList"
|
||||
:key="item.id"
|
||||
:value="item.id"
|
||||
:label="item.name">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<script>
|
||||
import disabledState from '@/module/mixin/disabledState'
|
||||
|
|
@ -50,8 +51,8 @@
|
|||
},
|
||||
methods: {
|
||||
_onChange (o) {
|
||||
this.value = o.value
|
||||
this.$emit('workerGroupsEvent', o.value)
|
||||
this.value = o
|
||||
this.$emit('workerGroupsEvent', o)
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
|
|||
|
|
@ -26,14 +26,14 @@
|
|||
<div class="text-box"><span>{{$t('Connection name')}}</span></div>
|
||||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<x-input
|
||||
<el-input
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="labelName"
|
||||
:disabled="isDetails"
|
||||
:placeholder="$t('Please enter name')"
|
||||
maxlength="100"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
maxlength="100">
|
||||
</el-input>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -41,8 +41,8 @@
|
|||
</div>
|
||||
<div class="bottom-box">
|
||||
<div class="submit" style="background: #fff;">
|
||||
<x-button type="text" @click="cancel()"> {{$t('Cancel')}} </x-button>
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()" :disabled="isDetails">{{spinnerLoading ? 'Loading...' : $t('Confirm add')}} </x-button>
|
||||
<el-button type="text" size="small" @click="cancel()"> {{$t('Cancel')}} </el-button>
|
||||
<el-button type="primary" size="small" round :loading="spinnerLoading" @click="ok()" :disabled="isDetails">{{spinnerLoading ? 'Loading...' : $t('Confirm add')}} </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -66,9 +66,7 @@
|
|||
},
|
||||
mixins: [disabledState],
|
||||
props: {
|
||||
id: String,
|
||||
sourceId: String,
|
||||
targetId: String
|
||||
lineData: Object
|
||||
},
|
||||
methods: {
|
||||
cancel() {
|
||||
|
|
@ -77,15 +75,15 @@
|
|||
})
|
||||
},
|
||||
ok() {
|
||||
if($(`#${this.id}`).prev().attr('class')==='jtk-overlay') {
|
||||
$(`#${this.id}`).prev().empty()
|
||||
if($(`#${this.lineData.id}`).prev().attr('class')==='jtk-overlay') {
|
||||
$(`#${this.lineData.id}`).prev().empty()
|
||||
}
|
||||
$(`#${this.id}`).text(this.labelName)
|
||||
$(`#${this.lineData.id}`).text(this.labelName)
|
||||
this.$emit('addLineInfo', {
|
||||
item: {
|
||||
labelName: this.labelName,
|
||||
sourceId: this.sourceId,
|
||||
targetId: this.targetId
|
||||
sourceId: this.lineData.sourceId,
|
||||
targetId: this.lineData.targetId
|
||||
},
|
||||
fromThis: this
|
||||
})
|
||||
|
|
@ -95,10 +93,10 @@
|
|||
|
||||
},
|
||||
created () {
|
||||
if($(`#${this.id}`).prev().attr('class').indexOf('jtk-overlay')!==-1) {
|
||||
this.labelName = $(`#${this.id}`).prev().text()
|
||||
if($(`#${this.lineData.id}`).prev().attr('class').indexOf('jtk-overlay')!==-1) {
|
||||
this.labelName = $(`#${this.lineData.id}`).prev().text()
|
||||
} else {
|
||||
this.labelName = $(`#${this.id}`).text()
|
||||
this.labelName = $(`#${this.lineData.id}`).text()
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
|
|
|
|||
|
|
@ -21,10 +21,10 @@
|
|||
<span class="go-subtask">
|
||||
<!-- Component can't pop up box to do component processing -->
|
||||
<m-log :item="backfillItem">
|
||||
<template slot="history"><a href="javascript:" @click="_seeHistory" ><em class="ansicon ans-icon-timer"></em><em>{{$t('View history')}}</em></a></template>
|
||||
<template slot="log"><a href="javascript:"><em class="ansicon ans-icon-log"></em><em>{{$t('View log')}}</em></a></template>
|
||||
<template slot="history"><a href="javascript:" @click="_seeHistory" ><em class="ansicon el-icon-alarm-clock"></em><em>{{$t('View history')}}</em></a></template>
|
||||
<template slot="log"><a href="javascript:"><em class="ansicon el-icon-document"></em><em>{{$t('View log')}}</em></a></template>
|
||||
</m-log>
|
||||
<a href="javascript:" @click="_goSubProcess" v-if="_isGoSubProcess"><em class="ansicon ans-icon-node"></em><em>{{$t('Enter this child node')}}</em></a>
|
||||
<a href="javascript:" @click="_goSubProcess" v-if="_isGoSubProcess"><em class="ansicon fa fa-tasks"></em><em>{{$t('Enter this child node')}}</em></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="content-box" v-if="isContentBox">
|
||||
|
|
@ -34,15 +34,15 @@
|
|||
<div class="text-box"><span>{{$t('Node name')}}</span></div>
|
||||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<x-input
|
||||
<el-input
|
||||
type="text"
|
||||
v-model="name"
|
||||
size="small"
|
||||
:disabled="isDetails"
|
||||
:placeholder="$t('Please enter name (required)')"
|
||||
maxlength="100"
|
||||
@on-blur="_verifName()"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
@blur="_verifName()">
|
||||
</el-input>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -52,10 +52,10 @@
|
|||
<div class="text-box"><span>{{$t('Run flag')}}</span></div>
|
||||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<x-radio-group v-model="runFlag" >
|
||||
<x-radio :label="'NORMAL'" :disabled="isDetails">{{$t('Normal')}}</x-radio>
|
||||
<x-radio :label="'FORBIDDEN'" :disabled="isDetails">{{$t('Prohibition execution')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="runFlag" size="small" style="vertical-align: sub;">
|
||||
<el-radio :label="'NORMAL'" :disabled="isDetails">{{$t('Normal')}}</el-radio>
|
||||
<el-radio :label="'FORBIDDEN'" :disabled="isDetails">{{$t('Prohibition execution')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -67,15 +67,13 @@
|
|||
</div>
|
||||
<div class="cont-box">
|
||||
<label class="label-box">
|
||||
<x-input
|
||||
resize
|
||||
:autosize="{minRows:2}"
|
||||
<el-input
|
||||
:rows="2"
|
||||
type="textarea"
|
||||
:disabled="isDetails"
|
||||
v-model="description"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -95,81 +93,74 @@
|
|||
</div>
|
||||
|
||||
<!-- Number of failed retries -->
|
||||
<div class="clearfix list" v-if="taskType !== 'SUB_PROCESS'">
|
||||
<div class="clearfix list" v-if="nodeData.taskType !== 'SUB_PROCESS'">
|
||||
<div class="text-box">
|
||||
<span>{{$t('Number of failed retries')}}</span>
|
||||
</div>
|
||||
<div class="cont-box">
|
||||
<m-select-input v-model="maxRetryTimes" :list="[0,1,2,3,4]">
|
||||
</m-select-input>
|
||||
<m-select-input v-model="maxRetryTimes" :list="[0,1,2,3,4]"></m-select-input>
|
||||
<span>({{$t('Times')}})</span>
|
||||
<span class="text-b">{{$t('Failed retry interval')}}</span>
|
||||
<m-select-input v-model="retryInterval" :list="[1,10,30,60,120]">
|
||||
</m-select-input>
|
||||
<m-select-input v-model="retryInterval" :list="[1,10,30,60,120]"></m-select-input>
|
||||
<span>({{$t('Minute')}})</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Delay execution time -->
|
||||
<div class="clearfix list" v-if="taskType !== 'SUB_PROCESS' && taskType !== 'CONDITIONS' && taskType !== 'DEPENDENT'">
|
||||
<div class="clearfix list" v-if="nodeData.taskType !== 'SUB_PROCESS' && nodeData.taskType !== 'CONDITIONS' && nodeData.taskType !== 'DEPENDENT'">
|
||||
<div class="text-box">
|
||||
<span>{{$t('Delay execution time')}}</span>
|
||||
</div>
|
||||
<div class="cont-box">
|
||||
<m-select-input v-model="delayTime" :list="[0,1,5,10]">
|
||||
</m-select-input>
|
||||
<m-select-input v-model="delayTime" :list="[0,1,5,10]"></m-select-input>
|
||||
<span>({{$t('Minute')}})</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Branch flow -->
|
||||
<div class="clearfix list" v-if="taskType === 'CONDITIONS'">
|
||||
<div class="clearfix list" v-if="nodeData.taskType === 'CONDITIONS'">
|
||||
<div class="text-box">
|
||||
<span>{{$t('State')}}</span>
|
||||
</div>
|
||||
<div class="cont-box">
|
||||
<span class="label-box" style="width: 193px;display: inline-block;">
|
||||
<x-select style="width: 157px;" v-model="successNode" :disabled="true">
|
||||
<x-option v-for="item in stateList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select style="width: 157px;" size="small" v-model="successNode" :disabled="true">
|
||||
<el-option v-for="item in stateList" :key="item.value" :value="item.value" :label="item.label"></el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
<span class="text-b" style="padding-left: 38px">{{$t('Branch flow')}}</span>
|
||||
<x-select style="width: 157px;" v-model="successBranch" clearable>
|
||||
<x-option v-for="item in rearList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select style="width: 157px;" size="small" v-model="successBranch" clearable>
|
||||
<el-option v-for="item in nodeData.rearList" :key="item.value" :value="item.value" :label="item.label"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list" v-if="taskType === 'CONDITIONS'">
|
||||
<div class="clearfix list" v-if="nodeData.taskType === 'CONDITIONS'">
|
||||
<div class="text-box">
|
||||
<span>{{$t('State')}}</span>
|
||||
</div>
|
||||
<div class="cont-box">
|
||||
<span class="label-box" style="width: 193px;display: inline-block;">
|
||||
<x-select style="width: 157px;" v-model="failedNode" :disabled="true">
|
||||
<x-option v-for="item in stateList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select style="width: 157px;" size="small" v-model="failedNode" :disabled="true">
|
||||
<el-option v-for="item in stateList" :key="item.value" :value="item.value" :label="item.label"></el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
<span class="text-b" style="padding-left: 38px">{{$t('Branch flow')}}</span>
|
||||
<x-select style="width: 157px;" v-model="failedBranch" clearable>
|
||||
<x-option v-for="item in rearList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select style="width: 157px;" size="small" v-model="failedBranch" clearable>
|
||||
<el-option v-for="item in nodeData.rearList" :key="item.value" :value="item.value" :label="item.label"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Task timeout alarm -->
|
||||
<m-timeout-alarm
|
||||
v-if="taskType !== 'DEPENDENT'"
|
||||
v-if="nodeData.taskType !== 'DEPENDENT'"
|
||||
ref="timeout"
|
||||
:backfill-item="backfillItem"
|
||||
@on-timeout="_onTimeout">
|
||||
</m-timeout-alarm>
|
||||
<!-- Dependent timeout alarm -->
|
||||
<m-dependent-timeout
|
||||
v-if="taskType === 'DEPENDENT'"
|
||||
v-if="nodeData.taskType === 'DEPENDENT'"
|
||||
ref="dependentTimeout"
|
||||
:backfill-item="backfillItem"
|
||||
@on-timeout="_onDependentTimeout">
|
||||
|
|
@ -177,7 +168,7 @@
|
|||
|
||||
<!-- shell node -->
|
||||
<m-shell
|
||||
v-if="taskType === 'SHELL'"
|
||||
v-if="nodeData.taskType === 'SHELL'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="SHELL"
|
||||
|
|
@ -185,7 +176,7 @@
|
|||
</m-shell>
|
||||
<!-- waterdrop node -->
|
||||
<m-waterdrop
|
||||
v-if="taskType === 'WATERDROP'"
|
||||
v-if="nodeData.taskType === 'WATERDROP'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="WATERDROP"
|
||||
|
|
@ -193,7 +184,7 @@
|
|||
</m-waterdrop>
|
||||
<!-- sub_process node -->
|
||||
<m-sub-process
|
||||
v-if="taskType === 'SUB_PROCESS'"
|
||||
v-if="nodeData.taskType === 'SUB_PROCESS'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
@on-set-process-name="_onSetProcessName"
|
||||
|
|
@ -202,7 +193,7 @@
|
|||
</m-sub-process>
|
||||
<!-- procedure node -->
|
||||
<m-procedure
|
||||
v-if="taskType === 'PROCEDURE'"
|
||||
v-if="nodeData.taskType === 'PROCEDURE'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="PROCEDURE"
|
||||
|
|
@ -210,23 +201,23 @@
|
|||
</m-procedure>
|
||||
<!-- sql node -->
|
||||
<m-sql
|
||||
v-if="taskType === 'SQL'"
|
||||
v-if="nodeData.taskType === 'SQL'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="SQL"
|
||||
:create-node-id="id"
|
||||
:create-node-id="nodeData.id"
|
||||
:backfill-item="backfillItem">
|
||||
</m-sql>
|
||||
<!-- spark node -->
|
||||
<m-spark
|
||||
v-if="taskType === 'SPARK'"
|
||||
v-if="nodeData.taskType === 'SPARK'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="SPARK"
|
||||
:backfill-item="backfillItem">
|
||||
</m-spark>
|
||||
<m-flink
|
||||
v-if="taskType === 'FLINK'"
|
||||
v-if="nodeData.taskType === 'FLINK'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="FLINK"
|
||||
|
|
@ -234,7 +225,7 @@
|
|||
</m-flink>
|
||||
<!-- mr node -->
|
||||
<m-mr
|
||||
v-if="taskType === 'MR'"
|
||||
v-if="nodeData.taskType === 'MR'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="MR"
|
||||
|
|
@ -242,7 +233,7 @@
|
|||
</m-mr>
|
||||
<!-- python node -->
|
||||
<m-python
|
||||
v-if="taskType === 'PYTHON'"
|
||||
v-if="nodeData.taskType === 'PYTHON'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="PYTHON"
|
||||
|
|
@ -250,44 +241,44 @@
|
|||
</m-python>
|
||||
<!-- dependent node -->
|
||||
<m-dependent
|
||||
v-if="taskType === 'DEPENDENT'"
|
||||
v-if="nodeData.taskType === 'DEPENDENT'"
|
||||
@on-dependent="_onDependent"
|
||||
@on-cache-dependent="_onCacheDependent"
|
||||
ref="DEPENDENT"
|
||||
:backfill-item="backfillItem">
|
||||
</m-dependent>
|
||||
<m-http
|
||||
v-if="taskType === 'HTTP'"
|
||||
v-if="nodeData.taskType === 'HTTP'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="HTTP"
|
||||
:backfill-item="backfillItem">
|
||||
</m-http>
|
||||
<m-datax
|
||||
v-if="taskType === 'DATAX'"
|
||||
v-if="nodeData.taskType === 'DATAX'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="DATAX"
|
||||
:backfill-item="backfillItem">
|
||||
</m-datax>
|
||||
<m-sqoop
|
||||
v-if="taskType === 'SQOOP'"
|
||||
v-if="nodeData.taskType === 'SQOOP'"
|
||||
@on-params="_onParams"
|
||||
@on-cache-params="_onCacheParams"
|
||||
ref="SQOOP"
|
||||
:backfill-item="backfillItem">
|
||||
</m-sqoop>
|
||||
<m-conditions
|
||||
v-if="taskType === 'CONDITIONS'"
|
||||
v-if="nodeData.taskType === 'CONDITIONS'"
|
||||
ref="CONDITIONS"
|
||||
@on-dependent="_onDependent"
|
||||
@on-cache-dependent="_onCacheDependent"
|
||||
:backfill-item="backfillItem"
|
||||
:pre-node="preNode">
|
||||
:pre-node="nodeData.preNode">
|
||||
</m-conditions>
|
||||
<!-- Pre-tasks in workflow -->
|
||||
<m-pre-tasks
|
||||
v-if="['SHELL', 'SUB_PROCESS'].indexOf(taskType) > -1"
|
||||
v-if="['SHELL', 'SUB_PROCESS'].indexOf(nodeData.taskType) > -1"
|
||||
@on-pre-tasks="_onPreTasks"
|
||||
ref="PRE_TASK"
|
||||
:backfill-item="backfillItem"></m-pre-tasks>
|
||||
|
|
@ -295,8 +286,8 @@
|
|||
</div>
|
||||
<div class="bottom-box">
|
||||
<div class="submit" style="background: #fff;">
|
||||
<x-button type="text" id="cancelBtn"> {{$t('Cancel')}} </x-button>
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()" :disabled="isDetails">{{spinnerLoading ? 'Loading...' : $t('Confirm add')}} </x-button>
|
||||
<el-button type="text" size="small" id="cancelBtn"> {{$t('Cancel')}} </el-button>
|
||||
<el-button type="primary" size="small" round :loading="spinnerLoading" @click="ok()" :disabled="isDetails">{{spinnerLoading ? 'Loading...' : $t('Confirm add')}} </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -400,12 +391,7 @@
|
|||
directives: { clickoutside },
|
||||
mixins: [disabledState],
|
||||
props: {
|
||||
id: Number,
|
||||
taskType: String,
|
||||
self: Object,
|
||||
preNode: Array,
|
||||
rearList: Array,
|
||||
instanceId: Number
|
||||
nodeData: Object
|
||||
},
|
||||
methods: {
|
||||
...mapActions('dag', ['getTaskInstanceList']),
|
||||
|
|
@ -452,14 +438,13 @@
|
|||
* Jump to task instance
|
||||
*/
|
||||
_seeHistory () {
|
||||
this.self.$router.push({
|
||||
this.nodeData.self.$router.push({
|
||||
name: 'task-instance',
|
||||
query: {
|
||||
processInstanceId: this.self.$route.params.id,
|
||||
processInstanceId: this.nodeData.self.$route.params.id,
|
||||
taskName: this.backfillItem.name
|
||||
}
|
||||
})
|
||||
this.$modal.destroy()
|
||||
},
|
||||
/**
|
||||
* Enter the child node to judge the process instance or the process definition
|
||||
|
|
@ -471,7 +456,7 @@
|
|||
return
|
||||
}
|
||||
if (this.router.history.current.name === 'projects-instance-details') {
|
||||
let stateId = $(`#${this.id}`).attr('data-state-id') || null
|
||||
let stateId = $(`#${this.nodeData.id}`).attr('data-state-id') || null
|
||||
if (!stateId) {
|
||||
this.$message.warning(`${i18n.$t('The task has not been executed and cannot enter the sub-Process')}`)
|
||||
return
|
||||
|
|
@ -508,8 +493,8 @@
|
|||
this.conditionResult.failedNode[0] = this.failedBranch
|
||||
this.$emit('cacheTaskInfo', {
|
||||
item: {
|
||||
type: this.taskType,
|
||||
id: this.id,
|
||||
type: this.nodeData.taskType,
|
||||
id: this.nodeData.id,
|
||||
name: this.name,
|
||||
params: this.params,
|
||||
description: this.description,
|
||||
|
|
@ -574,7 +559,7 @@
|
|||
return
|
||||
}
|
||||
// Verify task alarm parameters
|
||||
if (this.taskType === 'DEPENDENT') {
|
||||
if (this.nodeData.taskType === 'DEPENDENT') {
|
||||
if (!this.$refs['dependentTimeout']._verification()) {
|
||||
return
|
||||
}
|
||||
|
|
@ -585,7 +570,7 @@
|
|||
}
|
||||
|
||||
// Verify node parameters
|
||||
if (!this.$refs[this.taskType]._verification()) {
|
||||
if (!this.$refs[this.nodeData.taskType]._verification()) {
|
||||
return
|
||||
}
|
||||
// Verify preTasks and update dag-things
|
||||
|
|
@ -595,12 +580,12 @@
|
|||
}
|
||||
else {
|
||||
// Sync data-targetarr
|
||||
$(`#${this.id}`).attr(
|
||||
$(`#${this.nodeData.id}`).attr(
|
||||
'data-targetarr', this.preTaskIdsInWorkflow ? this.preTaskIdsInWorkflow.join(',') : '')
|
||||
|
||||
// Update JSP connections
|
||||
let plumbIns = JSP.JspInstance
|
||||
var targetId = this.id
|
||||
var targetId = this.nodeData.id
|
||||
|
||||
// Update new connections
|
||||
this.preTasksToAdd.map(sourceId => {
|
||||
|
|
@ -626,14 +611,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
$(`#${this.id}`).find('span').text(this.name)
|
||||
$(`#${this.nodeData.id}`).find('span').text(this.name)
|
||||
this.conditionResult.successNode[0] = this.successBranch
|
||||
this.conditionResult.failedNode[0] = this.failedBranch
|
||||
// Store the corresponding node data structure
|
||||
this.$emit('addTaskInfo', {
|
||||
item: {
|
||||
type: this.taskType,
|
||||
id: this.id,
|
||||
type: this.nodeData.taskType,
|
||||
id: this.nodeData.id,
|
||||
name: this.name,
|
||||
params: this.params,
|
||||
description: this.description,
|
||||
|
|
@ -666,7 +651,7 @@
|
|||
* set run flag
|
||||
*/
|
||||
_setRunFlag () {
|
||||
let dom = $(`#${this.id}`).find('.ban-p')
|
||||
let dom = $(`#${this.nodeData.id}`).find('.ban-p')
|
||||
dom.html('')
|
||||
if (this.runFlag === 'FORBIDDEN') {
|
||||
dom.append(rtBantpl())
|
||||
|
|
@ -713,13 +698,13 @@
|
|||
//fillback use cacheTasks
|
||||
let cacheTasks = this.store.state.dag.cacheTasks
|
||||
let o = {}
|
||||
if (cacheTasks[this.id]) {
|
||||
o = cacheTasks[this.id]
|
||||
this.backfillItem = cacheTasks[this.id]
|
||||
if (cacheTasks[this.nodeData.id]) {
|
||||
o = cacheTasks[this.nodeData.id]
|
||||
this.backfillItem = cacheTasks[this.nodeData.id]
|
||||
} else {
|
||||
if (taskList.length) {
|
||||
taskList.forEach(v => {
|
||||
if (v.id === this.id) {
|
||||
if (v.id === this.nodeData.id) {
|
||||
o = v
|
||||
this.backfillItem = v
|
||||
}
|
||||
|
|
@ -750,7 +735,7 @@
|
|||
}
|
||||
if(o.workerGroup == undefined) {
|
||||
this.store.dispatch('dag/getTaskInstanceList',{
|
||||
pageSize: 10, pageNo: 1, processInstanceId: this.instanceId, name: o.name
|
||||
pageSize: 10, pageNo: 1, processInstanceId: this.nodeData.instanceId, name: o.name
|
||||
}).then(res => {
|
||||
this.workerGroup = res.totalList[0].workerGroup
|
||||
})
|
||||
|
|
@ -769,7 +754,7 @@
|
|||
this.isContentBox = true
|
||||
|
||||
// Init value of preTask selector
|
||||
let preTaskIds = $(`#${this.id}`).attr('data-targetarr')
|
||||
let preTaskIds = $(`#${this.nodeData.id}`).attr('data-targetarr')
|
||||
if (!_.isEmpty(this.backfillItem)) {
|
||||
if (preTaskIds && preTaskIds.length) {
|
||||
this.backfillItem.preTasks = preTaskIds.split(',')
|
||||
|
|
@ -796,14 +781,14 @@
|
|||
* Child workflow entry show/hide
|
||||
*/
|
||||
_isGoSubProcess () {
|
||||
return this.taskType === 'SUB_PROCESS' && this.name
|
||||
return this.nodeData.taskType === 'SUB_PROCESS' && this.name
|
||||
},
|
||||
|
||||
//Define the item model
|
||||
_item () {
|
||||
return {
|
||||
type: this.taskType,
|
||||
id: this.id,
|
||||
type: this.nodeData.taskType,
|
||||
id: this.nodeData.id,
|
||||
name: this.name,
|
||||
description: this.description,
|
||||
runFlag: this.runFlag,
|
||||
|
|
|
|||
|
|
@ -29,16 +29,16 @@
|
|||
<span>{{$t('View log')}}</span>
|
||||
<div class="full-screen">
|
||||
<a href="javascript:" @click="_downloadLog" data-container="body" data-toggle="tooltip" :title="$t('Download Log')">
|
||||
<em class="ans-icon-download" style="font-size: 20px"></em>
|
||||
<em class="el-icon-download" style="font-size: 20px"></em>
|
||||
</a>
|
||||
<a href="javascript:" class="refresh-log" :class="loading ? 'active' :''" @click="!loading && _refreshLog()" data-container="body" data-toggle="tooltip" :title="$t('Refresh Log')">
|
||||
<em class="ans-icon-refresh"></em>
|
||||
<em class="el-icon-refresh"></em>
|
||||
</a>
|
||||
<a href="javascript:" @click="_screenOpen" v-show="!isScreen" data-container="body" data-toggle="tooltip" :title="$t('Enter full screen')">
|
||||
<em class="ans-icon-max"></em>
|
||||
<em class="el-icon-rank"></em>
|
||||
</a>
|
||||
<a href="javascript:" @click="_screenClose" v-show="isScreen" data-container="body" data-toggle="tooltip" :title="$t('Cancel full screen')">
|
||||
<em class="ans-icon-min"></em>
|
||||
<em class="el-icon-full-screen"></em>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -48,7 +48,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="operation">
|
||||
<x-button type="primary" shape="circle" @click="close"> {{$t('Close')}} </x-button>
|
||||
<el-button type="primary" size="small" round @click="close"> {{$t('Close')}} </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -118,8 +118,8 @@
|
|||
},
|
||||
_ckLog () {
|
||||
this.isLog = true
|
||||
|
||||
this.store.dispatch('dag/getLog', this._rtParam).then(res => {
|
||||
this.$message.destroy()
|
||||
if (!res.data) {
|
||||
this.isData = false
|
||||
setTimeout(() => {
|
||||
|
|
@ -138,7 +138,6 @@
|
|||
}, 800)
|
||||
}
|
||||
}).catch(e => {
|
||||
this.$message.destroy()
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
|
@ -169,7 +168,7 @@
|
|||
* Download log
|
||||
*/
|
||||
_downloadLog () {
|
||||
downloadFile('log/download-log', {
|
||||
downloadFile('/log/download-log', {
|
||||
taskInstanceId: this.stateId || this.logId
|
||||
})
|
||||
},
|
||||
|
|
@ -203,11 +202,7 @@
|
|||
// Listen for scrollbar events
|
||||
if (($this.scrollTop() + $this.height()) === $this.height()) {
|
||||
if (self.loadingIndex > 0) {
|
||||
self.$message.loading({
|
||||
content: `${i18n.$t('Loading Log...')}`,
|
||||
duration: 0,
|
||||
closable: false
|
||||
})
|
||||
self.$message.info(`${i18n.$t('Loading Log...')}`)
|
||||
self._onUp()
|
||||
}
|
||||
}
|
||||
|
|
@ -215,11 +210,7 @@
|
|||
if ($this.get(0).scrollHeight === ($this.height() + $this.scrollTop())) {
|
||||
// No data is not requested
|
||||
if (self.isData) {
|
||||
self.$message.loading({
|
||||
content: `${i18n.$t('Loading Log...')}`,
|
||||
duration: 0,
|
||||
closable: false
|
||||
})
|
||||
self.$message.info(`${i18n.$t('Loading Log...')}`)
|
||||
self._onDown()
|
||||
}
|
||||
}
|
||||
|
|
@ -240,11 +231,7 @@
|
|||
created () {
|
||||
// Source is a task instance
|
||||
if (this.source === 'list') {
|
||||
this.$message.loading({
|
||||
content: `${i18n.$t('Loading Log...')}`,
|
||||
duration: 0,
|
||||
closable: false
|
||||
})
|
||||
this.$message.info(`${i18n.$t('Loading Log...')}`)
|
||||
this._ckLog()
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -17,28 +17,30 @@
|
|||
<template>
|
||||
<div class="datasource-model">
|
||||
<div class="select-listpp">
|
||||
<x-select v-model="type"
|
||||
<el-select v-model="type"
|
||||
style="width: 160px;"
|
||||
@on-change="_handleTypeChanged"
|
||||
size="small"
|
||||
@change="_handleTypeChanged"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in typeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-select :placeholder="$t('Please select the datasource')"
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select :placeholder="$t('Please select the datasource')"
|
||||
v-model="datasource"
|
||||
style="width: 288px;"
|
||||
size="small"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in datasourceList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -101,7 +103,7 @@
|
|||
/**
|
||||
* Brush type
|
||||
*/
|
||||
_handleTypeChanged ({ value }) {
|
||||
_handleTypeChanged (value) {
|
||||
this.type = value
|
||||
this._getDatasourceData().then(res => {
|
||||
this.datasource = this.datasourceList.length && this.datasourceList[0].id || ''
|
||||
|
|
|
|||
|
|
@ -17,39 +17,39 @@
|
|||
<template>
|
||||
<div class="dep-list-model">
|
||||
<div v-for="(el,$index) in dependItemList" :key='$index' class="list" @click="itemIndex = $index">
|
||||
<x-select filterable :style="{width:isInstance ? '450px' : '450px'}" :disabled="isDetails" v-model="el.projectId" @on-change="_onChangeProjectId">
|
||||
<x-option v-for="item in projectList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-select filterable :style="{width:isInstance ? '450px' : '450px'}" :disabled="isDetails" v-model="el.definitionId" @on-change="_onChangeDefinitionId">
|
||||
<x-option v-for="item in el.definitionList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-select filterable :style="{width:isInstance ? '450px' : '450px'}" :disabled="isDetails" v-model="el.depTasks">
|
||||
<x-option v-for="item in el.depTasksList || []" :key="item" :value="item" :label="item">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-select style="width: 150px;" v-model="el.cycle" :disabled="isDetails" @on-change="_onChangeCycle">
|
||||
<x-option v-for="item in cycleList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-select style="width: 116px;" v-model="el.dateValue" :disabled="isDetails">
|
||||
<x-option v-for="item in el.dateValueList || []" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select filterable :style="{width:isInstance ? '450px' : '450px'}" :disabled="isDetails" v-model="el.projectId" @change="_onChangeProjectId" size="small">
|
||||
<el-option v-for="item in projectList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select filterable :style="{width:isInstance ? '450px' : '450px'}" :disabled="isDetails" v-model="el.definitionId" @change="_onChangeDefinitionId" size="small">
|
||||
<el-option v-for="item in el.definitionList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select filterable :style="{width:isInstance ? '450px' : '450px'}" :disabled="isDetails" v-model="el.depTasks" size="small">
|
||||
<el-option v-for="item in el.depTasksList || []" :key="item" :value="item" :label="item">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select style="width: 150px;" v-model="el.cycle" :disabled="isDetails" @change="_onChangeCycle">
|
||||
<el-option v-for="item in cycleList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select style="width: 116px;" v-model="el.dateValue" :disabled="isDetails">
|
||||
<el-option v-for="item in el.dateValueList || []" :key="item.value" :value="item.value" :label="item.label">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<template v-if="isInstance">
|
||||
<span class="instance-state">
|
||||
<em class="iconfont ans-icon-success-solid" :class="'icon-' + el.state" v-if="el.state === 'SUCCESS'" data-toggle="tooltip" data-container="body" :title="$t('success')"></em>
|
||||
<em class="iconfont ans-icon-clock" :class="'icon-' + el.state" v-if="el.state === 'WAITING'" data-toggle="tooltip" data-container="body" :title="$t('waiting')"></em>
|
||||
<em class="iconfont ans-icon-fail-solid" :class="'icon-' + el.state" v-if="el.state === 'FAILED'" data-toggle="tooltip" data-container="body" :title="$t('failed')"></em>
|
||||
<em class="iconfont el-icon-success" :class="'icon-' + el.state" v-if="el.state === 'SUCCESS'" data-toggle="tooltip" data-container="body" :title="$t('success')"></em>
|
||||
<em class="iconfont el-icon-timer" :class="'icon-' + el.state" v-if="el.state === 'WAITING'" data-toggle="tooltip" data-container="body" :title="$t('waiting')"></em>
|
||||
<em class="iconfont el-icon-error" :class="'icon-' + el.state" v-if="el.state === 'FAILED'" data-toggle="tooltip" data-container="body" :title="$t('failed')"></em>
|
||||
</span>
|
||||
</template>
|
||||
<span class="operation">
|
||||
<a href="javascript:" class="delete" @click="!isDetails && _remove($index)">
|
||||
<em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('delete')" ></em>
|
||||
<em class="el-icon-delete" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('delete')" ></em>
|
||||
</a>
|
||||
<a href="javascript:" class="add" @click="!isDetails && _add()" v-if="$index === (dependItemList.length - 1)">
|
||||
<em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('Add')"></em>
|
||||
<em class="iconfont el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -174,7 +174,7 @@
|
|||
/**
|
||||
* change process get dependItemList
|
||||
*/
|
||||
_onChangeProjectId ({ value }) {
|
||||
_onChangeProjectId (value) {
|
||||
this._getProcessByProjectId(value).then(definitionList => {
|
||||
/*this.$set(this.dependItemList, this.itemIndex, this._dlOldParams(value, definitionList, item))*/
|
||||
let definitionId = definitionList[0].value
|
||||
|
|
@ -187,7 +187,7 @@
|
|||
})
|
||||
})
|
||||
},
|
||||
_onChangeDefinitionId ({ value }) {
|
||||
_onChangeDefinitionId (value) {
|
||||
// get depItem list data
|
||||
this._getDependItemList(value).then(depTasksList => {
|
||||
let item = this.dependItemList[this.itemIndex]
|
||||
|
|
@ -197,7 +197,7 @@
|
|||
this.$set(this.dependItemList, this.itemIndex, this._rtOldParams(value, item.definitionList, depTasksList, item))
|
||||
})
|
||||
},
|
||||
_onChangeCycle ({ value }) {
|
||||
_onChangeCycle (value) {
|
||||
let list = _.cloneDeep(dateValueList[value])
|
||||
this.$set(this.dependItemList[this.itemIndex], 'dateValue', list[0].value)
|
||||
this.$set(this.dependItemList[this.itemIndex], 'dateValueList', list)
|
||||
|
|
|
|||
|
|
@ -20,50 +20,51 @@
|
|||
v-for="(item,$index) in httpParamsList"
|
||||
:key="item.id"
|
||||
@click="_getIndex($index)">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="httpParamsList[$index].prop"
|
||||
:placeholder="$t('prop(required)')"
|
||||
@on-blur="_verifProp()"
|
||||
@blur="_verifProp()"
|
||||
:style="inputStyle">
|
||||
</x-input>
|
||||
<x-select
|
||||
</el-input>
|
||||
<el-select
|
||||
@change="_handlePositionChanged"
|
||||
v-model="httpParamsList[$index].httpParametersType"
|
||||
:placeholder="$t('Http Parameters Position')"
|
||||
:disabled="isDetails"
|
||||
:style="inputStyle"
|
||||
>
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="position in positionList"
|
||||
:key="position.code"
|
||||
:value="position.id"
|
||||
:label="position.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-input
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
v-model="httpParamsList[$index].value"
|
||||
:placeholder="$t('value(required)')"
|
||||
@on-blur="_handleValue()"
|
||||
@blur="_handleValue()"
|
||||
:style="inputStyle">
|
||||
</x-input>
|
||||
</el-input>
|
||||
<span class="lt-add">
|
||||
<a href="javascript:" style="color:red;" @click="!isDetails && _removeUdp($index)" >
|
||||
<em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
|
||||
<em class="el-icon-delete" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
|
||||
</a>
|
||||
</span>
|
||||
<span class="add" v-if="$index === (httpParamsList.length - 1)">
|
||||
<a href="javascript:" @click="!isDetails && _addUdp()" >
|
||||
<em class="ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em class="el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<span class="add-dp" v-if="!httpParamsList.length">
|
||||
<a href="javascript:" @click="!isDetails && _addUdp()" >
|
||||
<em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em class="iconfont el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,117 @@
|
|||
/*
|
||||
* Licensed to the Apache Software Foundation (ASF) under one or more
|
||||
* contributor license agreements. See the NOTICE file distributed with
|
||||
* this work for additional information regarding copyright ownership.
|
||||
* The ASF licenses this file to You under the Apache License, Version 2.0
|
||||
* (the "License"); you may not use this file except in compliance with
|
||||
* the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
<template>
|
||||
<div class="script-model">
|
||||
<m-list-box>
|
||||
<div slot="content">
|
||||
<div class="from-mirror1">
|
||||
<textarea
|
||||
id="code-shell-mirror1"
|
||||
name="code-shell-mirror1"
|
||||
style="opacity: 0">
|
||||
</textarea>
|
||||
</div>
|
||||
</div>
|
||||
</m-list-box>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import _ from 'lodash'
|
||||
import i18n from '@/module/i18n'
|
||||
import mListBox from './listBox'
|
||||
import disabledState from '@/module/mixin/disabledState'
|
||||
import codemirror from '@/conf/home/pages/resource/pages/file/pages/_source/codemirror'
|
||||
|
||||
let editor
|
||||
|
||||
export default {
|
||||
name: 'shell',
|
||||
data () {
|
||||
return {
|
||||
// script
|
||||
rawScript: '',
|
||||
}
|
||||
},
|
||||
mixins: [disabledState],
|
||||
props: {
|
||||
jsonItem: String
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* Processing code highlighting
|
||||
*/
|
||||
_handlerEditor () {
|
||||
// editor
|
||||
let self =this
|
||||
editor = codemirror('code-shell-mirror1', {
|
||||
mode: 'shell',
|
||||
readOnly: this.isDetails
|
||||
})
|
||||
editor.on("change",function(){
|
||||
self.$emit('getJsonBoxValue',editor.getValue())
|
||||
})
|
||||
|
||||
this.keypress = () => {
|
||||
if (!editor.getOption('readOnly')) {
|
||||
editor.showHint({
|
||||
completeSingle: false
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// Monitor keyboard
|
||||
editor.on('keypress', this.keypress)
|
||||
|
||||
editor.setValue(this.rawScript)
|
||||
|
||||
return editor
|
||||
},
|
||||
},
|
||||
watch: {},
|
||||
created () {
|
||||
let o = this.jsonItem
|
||||
|
||||
// Non-null objects represent backfill
|
||||
if (!_.isEmpty(o)) {
|
||||
this.rawScript = o
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
setTimeout(() => {
|
||||
this._handlerEditor()
|
||||
}, 200)
|
||||
},
|
||||
destroyed () {
|
||||
if (editor) {
|
||||
editor.toTextArea() // Uninstall
|
||||
editor.off($('.code-shell-mirror1'), 'keypress', this.keypress)
|
||||
}
|
||||
},
|
||||
components: { mListBox }
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" rel="stylesheet/scss" scope>
|
||||
.script-model {
|
||||
width:100%;
|
||||
}
|
||||
.from-mirror1 {
|
||||
.CodeMirror {
|
||||
min-height: 600px;
|
||||
max-height: 700px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -20,64 +20,68 @@
|
|||
v-for="(item,$index) in localParamsList"
|
||||
:key="item.id"
|
||||
@click="_getIndex($index)">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="localParamsList[$index].prop"
|
||||
:placeholder="$t('prop(required)')"
|
||||
maxlength="256"
|
||||
@on-blur="_verifProp()"
|
||||
@blur="_verifProp()"
|
||||
:style="inputStyle">
|
||||
</x-input>
|
||||
</el-input>
|
||||
<template v-if="hide">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 80px;"
|
||||
size="small"
|
||||
@change="_handleDirectChanged"
|
||||
v-model="localParamsList[$index].direct"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in directList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-select
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select
|
||||
style="width: 118px;"
|
||||
size="small"
|
||||
@change="_handleTypeChanged"
|
||||
v-model="localParamsList[$index].type"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in typeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="localParamsList[$index].value"
|
||||
:placeholder="$t('value(optional)')"
|
||||
maxlength="256"
|
||||
@on-blur="_handleValue()"
|
||||
@blur="_handleValue()"
|
||||
:style="inputStyle">
|
||||
</x-input>
|
||||
</el-input>
|
||||
<span class="lt-add">
|
||||
<a href="javascript:" style="color:red;" @click="!isDetails && _removeUdp($index)" >
|
||||
<em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
|
||||
<em class="el-icon-delete" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
|
||||
</a>
|
||||
</span>
|
||||
<span class="add" v-if="$index === (localParamsList.length - 1)">
|
||||
<a href="javascript:" @click="!isDetails && _addUdp()" >
|
||||
<em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em class="el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<span class="add-dp" v-if="!localParamsList.length">
|
||||
<a href="javascript:" @click="!isDetails && _addUdp()" >
|
||||
<em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em class="iconfont el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -17,27 +17,27 @@
|
|||
<template>
|
||||
<div class="dep-list-model">
|
||||
<div v-for="(el,$index) in dependItemList" :key='$index' class="list" @click="itemIndex = $index">
|
||||
<x-select style="width: 150px;" v-model="el.depTasks" :disabled="isDetails">
|
||||
<x-option v-for="item in preNode" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-select style="width: 116px;" v-model="el.status" :disabled="isDetails">
|
||||
<x-option v-for="item in nodeStatusList || []" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select style="width: 150px;" size="small" v-model="el.depTasks" :disabled="isDetails">
|
||||
<el-option v-for="item in preNode" :key="item.value" :value="item.value" :label="item.label">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-select style="width: 116px;" size="small" v-model="el.status" :disabled="isDetails">
|
||||
<el-option v-for="item in nodeStatusList || []" :key="item.value" :value="item.value" :label="item.label">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<template v-if="isInstance">
|
||||
<span class="instance-state">
|
||||
<em class="iconfont ans-icon-success-solid" :class="'icon-' + el.state" v-if="el.state === 'SUCCESS'" data-toggle="tooltip" data-container="body" :title="$t('success')"></em>
|
||||
<em class="iconfont ans-icon-clock" :class="'icon-' + el.state" v-if="el.state === 'RUNNING_EXECUTION'" data-toggle="tooltip" data-container="body" :title="$t('waiting')"></em>
|
||||
<em class="iconfont ans-icon-fail-solid" :class="'icon-' + el.state" v-if="el.state === 'FAILURE'" data-toggle="tooltip" data-container="body" :title="$t('failed')"></em>
|
||||
<em class="iconfont el-icon-success" :class="'icon-' + el.state" v-if="el.state === 'SUCCESS'" data-toggle="tooltip" data-container="body" :title="$t('success')"></em>
|
||||
<em class="iconfont el-icon-timer" :class="'icon-' + el.state" v-if="el.state === 'RUNNING_EXECUTION'" data-toggle="tooltip" data-container="body" :title="$t('waiting')"></em>
|
||||
<em class="iconfont el-icon-error" :class="'icon-' + el.state" v-if="el.state === 'FAILURE'" data-toggle="tooltip" data-container="body" :title="$t('failed')"></em>
|
||||
</span>
|
||||
</template>
|
||||
<span class="operation">
|
||||
<a href="javascript:" class="delete" @click="!isDetails && _remove($index)">
|
||||
<em class="iconfont ans-icon-trash" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('delete')" ></em>
|
||||
<em class="iconfont el-icon-delete" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('delete')" ></em>
|
||||
</a>
|
||||
<a href="javascript:" class="add" @click="!isDetails && _add()" v-if="$index === (dependItemList.length - 1)">
|
||||
<em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('Add')"></em>
|
||||
<em class="iconfont el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" data-container="body" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,19 +16,20 @@
|
|||
*/
|
||||
<template>
|
||||
<div class="resource-list-model">
|
||||
<x-select multiple
|
||||
<el-select multiple
|
||||
v-model="value"
|
||||
filterable
|
||||
size="small"
|
||||
:disabled="isDetails"
|
||||
:placeholder="$t('Please select resources')"
|
||||
style="width: 100%;">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in resList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -27,9 +27,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<a class="ans-modal-box-close">
|
||||
<em class="ans-icon-min" @click="closeModal"></em>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -83,10 +80,6 @@
|
|||
|
||||
return editor
|
||||
},
|
||||
closeModal() {
|
||||
let self = this
|
||||
self.$emit('closeAble')
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created () {
|
||||
|
|
|
|||
|
|
@ -16,18 +16,19 @@
|
|||
*/
|
||||
<template>
|
||||
<div class="sql-type-model">
|
||||
<x-select
|
||||
<el-select
|
||||
v-model="sqlTypeId"
|
||||
:disabled="isDetails"
|
||||
@on-change="_handleSqlTypeChanged"
|
||||
style="width: 120px;">
|
||||
<x-option
|
||||
@change="_handleSqlTypeChanged"
|
||||
style="width: 120px;"
|
||||
size="small">
|
||||
<el-option
|
||||
v-for="city in sqlTypeList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -53,7 +54,7 @@
|
|||
* return sqlType
|
||||
*/
|
||||
_handleSqlTypeChanged (val) {
|
||||
this.$emit('on-sqlType', val.value)
|
||||
this.$emit('on-sqlType', val)
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
|
|||
|
|
@ -20,30 +20,31 @@
|
|||
v-for="(item,$index) in localStatementList"
|
||||
:key="item.id"
|
||||
@click="_getIndex($index)">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="textarea"
|
||||
size="small"
|
||||
resize="none"
|
||||
:autosize="{minRows:1}"
|
||||
:placeholder="$t('Please enter a non-query SQL statement')"
|
||||
v-model="localStatementList[$index]"
|
||||
@on-blur="_verifProp()"
|
||||
@blur="_verifProp()"
|
||||
style="width: 525px;">
|
||||
</x-input>
|
||||
</el-input>
|
||||
<span class="lt-add">
|
||||
<a href="javascript:" style="color:red;" @click="!isDetails && _removeStatement($index)" >
|
||||
<em class="ans-icon-trash" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
|
||||
<em class="el-icon-delete" :class="_isDetails" data-toggle="tooltip" :title="$t('delete')" ></em>
|
||||
</a>
|
||||
</span>
|
||||
<span class="add" v-if="$index === (localStatementList.length - 1)">
|
||||
<a href="javascript:" @click="!isDetails && _addStatement()" >
|
||||
<em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em class="el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<span class="add" v-if="!localStatementList.length">
|
||||
<a href="javascript:" @click="!isDetails && _addStatement()" >
|
||||
<em class="iconfont ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em class="el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,17 +16,18 @@
|
|||
*/
|
||||
<template>
|
||||
<div class="udfs-model">
|
||||
<x-select multiple
|
||||
<el-select multiple
|
||||
v-model="udfsStr"
|
||||
:disabled="isDetails"
|
||||
size="small"
|
||||
style="width: 100%;">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in udfsList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -23,8 +23,8 @@
|
|||
<a href="javascript:"
|
||||
@click="!isDetails && _addDep()"
|
||||
class="add-dep">
|
||||
<em v-if="!isLoading" class="ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em v-if="isLoading" class="ans-icon-spinner2 as as-spin" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em v-if="!isLoading" class="el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em v-if="isLoading" class="el-icon-loading as as-spin" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</div>
|
||||
<div class="dep-box">
|
||||
|
|
@ -40,7 +40,7 @@
|
|||
@click="!isDetails && _setRelation($index)">
|
||||
{{el.relation === 'AND' ? $t('and') : $t('or')}}
|
||||
</span>
|
||||
<em class="ans-icon-trash dep-delete"
|
||||
<em class="el-icon-delete dep-delete"
|
||||
data-toggle="tooltip"
|
||||
data-container="body"
|
||||
:class="_isDetails"
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
<div slot="content">
|
||||
<label class="label-box">
|
||||
<div style="padding-top: 5px;">
|
||||
<x-switch v-model="enable" @on-click="_onSwitch" :disabled="isDetails"></x-switch>
|
||||
<el-switch v-model="enable" @change="_onSwitch" :disabled="isDetails"></el-switch>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -31,10 +31,10 @@
|
|||
<div slot="text">{{$t('Datasource')}}</div>
|
||||
<div slot="content">
|
||||
<m-datasource
|
||||
ref="refDs"
|
||||
@on-dsData="_onDsData"
|
||||
:supportType="['MYSQL','POSTGRESQL', 'ORACLE', 'SQLSERVER']"
|
||||
:data="{ type:dsType,datasource:datasource }">
|
||||
ref="refDs"
|
||||
@on-dsData="_onDsData"
|
||||
:supportType="['MYSQL','POSTGRESQL', 'ORACLE', 'SQLSERVER']"
|
||||
:data="{ type:dsType,datasource:datasource }">
|
||||
</m-datasource>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
|
@ -48,7 +48,7 @@
|
|||
style="opacity: 0;">
|
||||
</textarea>
|
||||
<a class="ans-modal-box-max">
|
||||
<em class="ans-icon-max" @click="setEditorVal"></em>
|
||||
<em class="el-icon-rank" @click="setEditorVal"></em>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -57,22 +57,22 @@
|
|||
<div slot="text">{{$t('TargetDataBase')}}</div>
|
||||
<div slot="content">
|
||||
<m-datasource
|
||||
ref="refDt"
|
||||
@on-dsData="_onDtData"
|
||||
:supportType="['MYSQL','POSTGRESQL', 'ORACLE', 'SQLSERVER']"
|
||||
:data="{ type:dtType,datasource:datatarget }">
|
||||
ref="refDt"
|
||||
@on-dsData="_onDtData"
|
||||
:supportType="['MYSQL','POSTGRESQL', 'ORACLE', 'SQLSERVER']"
|
||||
:data="{ type:dtType,datasource:datatarget }">
|
||||
</m-datasource>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('TargetTable')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="targetTable"
|
||||
:placeholder="$t('Please enter the table of target')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter the table of target')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -126,9 +126,6 @@
|
|||
name="code-json-mirror"
|
||||
style="opacity: 0;">
|
||||
</textarea>
|
||||
<a class="ans-modal-box-max">
|
||||
<em class="ans-icon-max" @click="setJsonEditorVal"></em>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
|
@ -159,7 +156,12 @@
|
|||
<span> G</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="scriptBoxDialog"
|
||||
append-to-body="true"
|
||||
width="80%">
|
||||
<m-script-box :item="item" @getSriptBoxValue="getSriptBoxValue" @closeAble="closeAble"></m-script-box>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -216,6 +218,8 @@
|
|||
xms: 1,
|
||||
//jvm memory xms
|
||||
xmx: 1,
|
||||
scriptBoxDialog: false,
|
||||
item: '',
|
||||
}
|
||||
},
|
||||
mixins: [disabledState],
|
||||
|
|
@ -225,60 +229,11 @@
|
|||
},
|
||||
methods: {
|
||||
setEditorVal() {
|
||||
let self = this
|
||||
let modal = self.$modal.dialog({
|
||||
className: 'scriptModal',
|
||||
closable: false,
|
||||
showMask: true,
|
||||
maskClosable: true,
|
||||
onClose: function() {
|
||||
|
||||
},
|
||||
render (h) {
|
||||
return h(mScriptBox, {
|
||||
on: {
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
closeAble () {
|
||||
// this.$modal.destroy()
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: editor.getValue()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = editor.getValue()
|
||||
this.scriptBoxDialog = true
|
||||
},
|
||||
setJsonEditorVal() {
|
||||
let self = this
|
||||
let modal = self.$modal.dialog({
|
||||
className: 'scriptModal',
|
||||
closable: false,
|
||||
showMask: true,
|
||||
maskClosable: true,
|
||||
onClose: function() {
|
||||
|
||||
},
|
||||
render (h) {
|
||||
return h(mScriptBox, {
|
||||
on: {
|
||||
getSriptBoxValue (val) {
|
||||
jsonEditor.setValue(val)
|
||||
},
|
||||
closeAble () {
|
||||
// this.$modal.destroy()
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: jsonEditor.getValue()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
_onSwitch (is) {
|
||||
if(is) {
|
||||
|
|
@ -566,7 +521,7 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
components: { mListBox, mDatasource, mLocalParams, mStatementList, mSelectInput }
|
||||
components: { mListBox, mDatasource, mLocalParams, mStatementList, mSelectInput, mScriptBox }
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" rel="stylesheet/scss" scope>
|
||||
|
|
|
|||
|
|
@ -23,8 +23,8 @@
|
|||
<a href="javascript:"
|
||||
@click="!isDetails && _addDep()"
|
||||
class="add-dep">
|
||||
<em v-if="!isLoading" class="ans-icon-increase" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em v-if="isLoading" class="ans-icon-spinner2 as as-spin" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em v-if="!isLoading" class="el-icon-circle-plus-outline" :class="_isDetails" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
<em v-if="isLoading" class="el-icon-loading as as-spin" data-toggle="tooltip" :title="$t('Add')"></em>
|
||||
</a>
|
||||
</div>
|
||||
<div class="dep-box">
|
||||
|
|
@ -40,7 +40,7 @@
|
|||
@click="!isDetails && _setRelation($index)">
|
||||
{{el.relation === 'AND' ? $t('and') : $t('or')}}
|
||||
</span>
|
||||
<em class="ans-icon-trash dep-delete"
|
||||
<em class="el-icon-delete dep-delete"
|
||||
data-toggle="tooltip"
|
||||
data-container="body"
|
||||
:class="_isDetails"
|
||||
|
|
|
|||
|
|
@ -19,30 +19,31 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Program Type')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 130px;"
|
||||
size="small"
|
||||
v-model="programType"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in programTypeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
<m-list-box v-if="programType !== 'PYTHON'">
|
||||
<div slot="text">{{$t('Main class')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
v-model="mainClass"
|
||||
:placeholder="$t('Please enter main class')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="mainClass"
|
||||
:placeholder="$t('Please enter main class')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -56,76 +57,77 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Deploy Mode')}}</div>
|
||||
<div slot="content">
|
||||
<x-radio-group v-model="deployMode">
|
||||
<x-radio :label="'cluster'" :disabled="isDetails"></x-radio>
|
||||
<x-radio :label="'local'" :disabled="isDetails"></x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="deployMode" size="small">
|
||||
<el-radio :label="'cluster'" :disabled="isDetails"></el-radio>
|
||||
<el-radio :label="'local'" :disabled="isDetails"></el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box v-if="deployMode === 'cluster'">
|
||||
<div slot="text">{{$t('Flink Version')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 100px;"
|
||||
size="small"
|
||||
v-model="flinkVersion"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="version in flinkVersionList"
|
||||
:key="version.code"
|
||||
:value="version.code"
|
||||
:label="version.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<div class="list-box-4p" v-if="deployMode === 'cluster'">
|
||||
<div class="clearfix list">
|
||||
<span class="sp1" style="word-break:break-all">{{$t('jobManagerMemory')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="jobManagerMemory"
|
||||
:placeholder="$t('Please enter jobManager memory')"
|
||||
style="width: 200px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 200px;">
|
||||
</el-input>
|
||||
</span>
|
||||
<span class="sp1 sp3">{{$t('taskManagerMemory')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="taskManagerMemory"
|
||||
:placeholder="$t('Please enter the taskManager memory')"
|
||||
style="width: 186px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 186px;">
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
<span class="sp1">{{$t('slot')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="slot"
|
||||
:placeholder="$t('Please enter solt number')"
|
||||
style="width: 200px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 200px;">
|
||||
</el-input>
|
||||
</span>
|
||||
<div v-if="flinkVersion !== '>=1.10'">
|
||||
<span class="sp1 sp3">{{$t('taskManager')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="taskManager"
|
||||
:placeholder="$t('Please enter taskManager number')"
|
||||
style="width: 186px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 186px;">
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -133,26 +135,27 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Command-line parameters')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:autosize="{minRows:2}"
|
||||
:disabled="isDetails"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="mainArgs"
|
||||
:placeholder="$t('Please enter Command-line parameters')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter Command-line parameters')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Other parameters')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
:autosize="{minRows:2}"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="others"
|
||||
:placeholder="$t('Please enter other parameters')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -167,10 +170,10 @@
|
|||
<div slot="text">{{$t('Custom Parameters')}}</div>
|
||||
<div slot="content">
|
||||
<m-local-params
|
||||
ref="refLocalParams"
|
||||
@on-local-params="_onLocalParams"
|
||||
:udp-list="localParams"
|
||||
:hide="false">
|
||||
ref="refLocalParams"
|
||||
@on-local-params="_onLocalParams"
|
||||
:udp-list="localParams"
|
||||
:hide="false">
|
||||
</m-local-params>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
|
|
|||
|
|
@ -19,30 +19,32 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Http Url')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:autosize="{minRows:2}"
|
||||
:disabled="isDetails"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="url"
|
||||
:placeholder="$t('Please Enter Http Url')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Http Method')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 150px;"
|
||||
size="small"
|
||||
v-model="httpMethod"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in httpMethodList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -59,30 +61,31 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Http Check Condition')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 230px;"
|
||||
size="small"
|
||||
v-model="httpCheckCondition"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in httpCheckConditionList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.value">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Http Condition')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:autosize="{minRows:2}"
|
||||
:disabled="isDetails"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="condition"
|
||||
:placeholder="$t('Please Enter Http Condition')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please Enter Http Condition')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
|
|
@ -92,10 +95,7 @@
|
|||
<div slot="content">
|
||||
<label class="label-box">
|
||||
<div style="padding-top: 5px;">
|
||||
<x-switch
|
||||
v-model="timeoutSettings"
|
||||
:disabled="isDetails"
|
||||
></x-switch>
|
||||
<el-switch size="small" v-model="timeoutSettings" :disabled="isDetails"></el-switch>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -107,12 +107,12 @@
|
|||
</div>
|
||||
<div class="cont-box">
|
||||
<span class="label-box" style="width: 193px;display: inline-block;" >
|
||||
<x-input v-model='connectTimeout' maxlength="7" />
|
||||
<el-input size="small" v-model='connectTimeout' maxlength="7"></el-input>
|
||||
</span>
|
||||
<span>{{$t('ms')}}</span>
|
||||
<span class="text-b">{{$t('Socket Timeout')}}</span>
|
||||
<span class="label-box" style="width: 193px;display: inline-block;" >
|
||||
<x-input v-model='socketTimeout' maxlength="7" />
|
||||
<el-input size="small" v-model='socketTimeout' maxlength="7"></el-input>
|
||||
</span>
|
||||
<span>{{$t('ms')}}</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -19,26 +19,26 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Program Type')}}</div>
|
||||
<div slot="content">
|
||||
<x-select v-model="programType" :disabled="isDetails" style="width: 110px;">
|
||||
<x-option
|
||||
<el-select v-model="programType" :disabled="isDetails" style="width: 110px;" size="small">
|
||||
<el-option
|
||||
v-for="city in programTypeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box v-if="programType !== 'PYTHON'">
|
||||
<div slot="text">{{$t('Main class')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="mainClass"
|
||||
:placeholder="$t('Please enter main class')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter main class')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -52,27 +52,27 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Command-line parameters')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:autosize="{minRows:2}"
|
||||
:disabled="isDetails"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="mainArgs"
|
||||
:placeholder="$t('Please enter Command-line parameters')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter Command-line parameters')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Other parameters')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
:autosize="{minRows:2}"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="others"
|
||||
:placeholder="$t('Please enter other parameters')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter other parameters')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
|
|||
|
|
@ -22,21 +22,22 @@
|
|||
</div>
|
||||
<div class="cont-box">
|
||||
<div class="label-box">
|
||||
<x-select
|
||||
<el-select
|
||||
ref="preTasksSelector"
|
||||
style="width: 100%;"
|
||||
filterable
|
||||
multiple
|
||||
size="small"
|
||||
v-model="preTasks"
|
||||
:disabled="isDetails"
|
||||
:id="preTasksSelectorId">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="task in preTaskList"
|
||||
:key="task.id"
|
||||
:value="task.id"
|
||||
:label="task.name">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -30,13 +30,13 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('methods')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
type="input"
|
||||
:disabled="isDetails"
|
||||
v-model="method"
|
||||
:placeholder="$t('Please enter method(optional)')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
<el-input
|
||||
type="input"
|
||||
size="small"
|
||||
:disabled="isDetails"
|
||||
v-model="method"
|
||||
:placeholder="$t('Please enter method(optional)')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
<textarea id="code-python-mirror" name="code-python-mirror" style="opacity: 0;">
|
||||
</textarea>
|
||||
<a class="ans-modal-box-max">
|
||||
<em class="ans-icon-max" @click="setEditorVal"></em>
|
||||
<em class="el-icon-rank" @click="setEditorVal"></em>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -34,12 +34,6 @@
|
|||
<treeselect v-model="resourceList" :multiple="true" maxHeight="200" :options="resourceOptions" :normalizer="normalizer" :value-consists-of="valueConsistsOf" :disabled="isDetails" :placeholder="$t('Please select resources')">
|
||||
<div slot="value-label" slot-scope="{ node }">{{ node.raw.fullName }}</div>
|
||||
</treeselect>
|
||||
<!-- <m-resources
|
||||
ref="refResources"
|
||||
@on-resourcesData="_onResourcesData"
|
||||
@on-cache-resourcesData="_onCacheResourcesData"
|
||||
:resource-list="resourceList">
|
||||
</m-resources> -->
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
|
|
@ -54,6 +48,12 @@
|
|||
</m-local-params>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<el-dialog
|
||||
:visible.sync="scriptBoxDialog"
|
||||
append-to-body="true"
|
||||
width="80%">
|
||||
<m-script-box :item="item" @getSriptBoxValue="getSriptBoxValue" @closeAble="closeAble"></m-script-box>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -90,7 +90,9 @@
|
|||
}
|
||||
},
|
||||
allNoResources: [],
|
||||
noRes: []
|
||||
noRes: [],
|
||||
item: '',
|
||||
scriptBoxDialog: false
|
||||
}
|
||||
},
|
||||
mixins: [disabledState],
|
||||
|
|
@ -105,32 +107,11 @@
|
|||
this.localParams = a
|
||||
},
|
||||
setEditorVal() {
|
||||
let self = this
|
||||
let modal = self.$modal.dialog({
|
||||
className: 'scriptModal',
|
||||
closable: false,
|
||||
showMask: true,
|
||||
maskClosable: true,
|
||||
onClose: function() {
|
||||
|
||||
},
|
||||
render (h) {
|
||||
return h(mScriptBox, {
|
||||
on: {
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
closeAble () {
|
||||
// this.$modal.destroy()
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: editor.getValue()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = editor.getValue()
|
||||
this.scriptBoxDialog = true
|
||||
},
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
/**
|
||||
* return resourceList
|
||||
|
|
@ -362,7 +343,7 @@
|
|||
editor.toTextArea() // Uninstall
|
||||
editor.off($('.code-python-mirror'), 'keypress', this.keypress)
|
||||
},
|
||||
components: { mLocalParams, mListBox, mResources,Treeselect }
|
||||
components: { mLocalParams, mListBox, mResources,Treeselect, mScriptBox }
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" rel="stylesheet/scss" scope>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
style="opacity: 0">
|
||||
</textarea>
|
||||
<a class="ans-modal-box-max">
|
||||
<em class="ans-icon-max" @click="setEditorVal"></em>
|
||||
<em class="el-icon-rank" @click="setEditorVal"></em>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -39,17 +39,6 @@
|
|||
</treeselect>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<!-- <m-list-box>
|
||||
<div slot="text">{{$t('Resources')}}</div>
|
||||
<div slot="content">
|
||||
<m-resources
|
||||
ref="refResources"
|
||||
@on-resourcesData="_onResourcesData"
|
||||
@on-cache-resourcesData="_onCacheResourcesData"
|
||||
:resource-list="resourceList">
|
||||
</m-resources>
|
||||
</div>
|
||||
</m-list-box> -->
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Custom Parameters')}}</div>
|
||||
<div slot="content">
|
||||
|
|
@ -61,6 +50,12 @@
|
|||
</m-local-params>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<el-dialog
|
||||
:visible.sync="scriptBoxDialog"
|
||||
modal-append-to-body="true"
|
||||
width="80%">
|
||||
<m-script-box :item="item" @getSriptBoxValue="getSriptBoxValue" @closeAble="closeAble"></m-script-box>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -98,7 +93,9 @@
|
|||
}
|
||||
},
|
||||
allNoResources: [],
|
||||
noRes: []
|
||||
noRes: [],
|
||||
item: '',
|
||||
scriptBoxDialog: false
|
||||
}
|
||||
},
|
||||
mixins: [disabledState],
|
||||
|
|
@ -113,32 +110,15 @@
|
|||
this.localParams = a
|
||||
},
|
||||
setEditorVal() {
|
||||
let self = this
|
||||
let modal = self.$modal.dialog({
|
||||
className: 'scriptModal',
|
||||
closable: false,
|
||||
showMask: true,
|
||||
maskClosable: true,
|
||||
onClose: function() {
|
||||
|
||||
},
|
||||
render (h) {
|
||||
return h(mScriptBox, {
|
||||
on: {
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
closeAble () {
|
||||
// this.$modal.destroy()
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: editor.getValue()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = editor.getValue()
|
||||
this.scriptBoxDialog = true
|
||||
},
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
// this.scriptBoxDialog = false
|
||||
},
|
||||
closeAble () {
|
||||
// this.scriptBoxDialog = false
|
||||
},
|
||||
/**
|
||||
* return resourceList
|
||||
|
|
|
|||
|
|
@ -19,45 +19,47 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Program Type')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 130px;"
|
||||
size="small"
|
||||
v-model="programType"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in programTypeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Spark Version')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 130px;"
|
||||
size="small"
|
||||
v-model="sparkVersion"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in sparkVersionList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box v-if="programType !== 'PYTHON'">
|
||||
<div slot="text">{{$t('Main class')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
v-model="mainClass"
|
||||
:placeholder="$t('Please enter main class')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="mainClass"
|
||||
:placeholder="$t('Please enter main class')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -71,99 +73,100 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Deploy Mode')}}</div>
|
||||
<div slot="content">
|
||||
<x-radio-group v-model="deployMode">
|
||||
<x-radio :label="'cluster'" :disabled="isDetails"></x-radio>
|
||||
<x-radio :label="'client'" :disabled="isDetails"></x-radio>
|
||||
<x-radio :label="'local'" :disabled="isDetails"></x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="deployMode" size="small">
|
||||
<el-radio :label="'cluster'" :disabled="isDetails"></el-radio>
|
||||
<el-radio :label="'client'" :disabled="isDetails"></el-radio>
|
||||
<el-radio :label="'local'" :disabled="isDetails"></el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<div class="list-box-4p">
|
||||
<div class="clearfix list">
|
||||
<span class="sp1">{{$t('Driver core number')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="driverCores"
|
||||
:placeholder="$t('Please enter driver core number')"
|
||||
style="width: 200px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 200px;">
|
||||
</el-input>
|
||||
</span>
|
||||
<span class="sp1 sp3">{{$t('Driver memory use')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="driverMemory"
|
||||
:placeholder="$t('Please enter driver memory use')"
|
||||
style="width: 186px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 186px;">
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
<span class="sp1">{{$t('Number of Executors')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
v-model="numExecutors"
|
||||
:placeholder="$t('Please enter the number of Executor')"
|
||||
style="width: 200px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="numExecutors"
|
||||
:placeholder="$t('Please enter the number of Executor')"
|
||||
style="width: 200px;">
|
||||
</el-input>
|
||||
</span>
|
||||
<span class="sp1 sp3">{{$t('Executor memory')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
v-model="executorMemory"
|
||||
:placeholder="$t('Please enter the Executor memory')"
|
||||
style="width: 186px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="executorMemory"
|
||||
:placeholder="$t('Please enter the Executor memory')"
|
||||
style="width: 186px;">
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
<span class="sp1">{{$t('Executor core number')}}</span>
|
||||
<span class="sp2">
|
||||
<x-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
v-model="executorCores"
|
||||
:placeholder="$t('Please enter Executor core number')"
|
||||
style="width: 200px;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="executorCores"
|
||||
:placeholder="$t('Please enter Executor core number')"
|
||||
style="width: 200px;">
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Command-line parameters')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
:autosize="{minRows:2}"
|
||||
:disabled="isDetails"
|
||||
type="textarea"
|
||||
v-model="mainArgs"
|
||||
:placeholder="$t('Please enter Command-line parameters')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
<el-input
|
||||
:autosize="{minRows:2}"
|
||||
:disabled="isDetails"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="mainArgs"
|
||||
:placeholder="$t('Please enter Command-line parameters')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Other parameters')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
:disabled="isDetails"
|
||||
:autosize="{minRows:2}"
|
||||
type="textarea"
|
||||
v-model="others"
|
||||
:placeholder="$t('Please enter other parameters')">
|
||||
</x-input>
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
:autosize="{minRows:2}"
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="others"
|
||||
:placeholder="$t('Please enter other parameters')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -174,17 +177,6 @@
|
|||
</treeselect>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<!-- <m-list-box>
|
||||
<div slot="text">{{$t('Resources')}}</div>
|
||||
<div slot="content">
|
||||
<m-resources
|
||||
ref="refResources"
|
||||
@on-resourcesData="_onResourcesData"
|
||||
@on-cache-resourcesData="_onCacheResourcesData"
|
||||
:resource-list="resourceList">
|
||||
</m-resources>
|
||||
</div>
|
||||
</m-list-box> -->
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Custom Parameters')}}</div>
|
||||
<div slot="content">
|
||||
|
|
|
|||
|
|
@ -36,10 +36,10 @@
|
|||
</m-sql-type>
|
||||
</div>
|
||||
<div v-if="sqlType==0" style="display: inline-block;padding-left: 10px;margin-top: 2px;">
|
||||
<x-checkbox-group v-model="showType">
|
||||
<x-checkbox :label="'TABLE'" :disabled="isDetails">{{$t('TableMode')}}</x-checkbox>
|
||||
<x-checkbox :label="'ATTACHMENT'" :disabled="isDetails">{{$t('Attachment')}}</x-checkbox>
|
||||
</x-checkbox-group>
|
||||
<el-checkbox-group v-model="showType" size="small">
|
||||
<el-checkbox :label="'TABLE'" :disabled="isDetails">{{$t('TableMode')}}</el-checkbox>
|
||||
<el-checkbox :label="'ATTACHMENT'" :disabled="isDetails">{{$t('Attachment')}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
|
@ -47,12 +47,12 @@
|
|||
<m-list-box>
|
||||
<div slot="text"><strong class='requiredIcon'>*</strong>{{$t('Title')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="title"
|
||||
:placeholder="$t('Please enter the title of email')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter the title of email')">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -71,13 +71,13 @@
|
|||
<m-list-box v-show="type === 'HIVE'">
|
||||
<div slot="text">{{$t('SQL Parameter')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="connParams"
|
||||
:placeholder="$t('Please enter format') + ' key1=value1;key2=value2...'"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
:placeholder="$t('Please enter format') + ' key1=value1;key2=value2...'">
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -90,7 +90,7 @@
|
|||
style="opacity: 0;">
|
||||
</textarea>
|
||||
<a class="ans-modal-box-max">
|
||||
<em class="ans-icon-max" @click="setEditorVal"></em>
|
||||
<em class="el-icon-rank" @click="setEditorVal"></em>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -136,6 +136,12 @@
|
|||
</m-statement-list>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<el-dialog
|
||||
:visible.sync="scriptBoxDialog"
|
||||
append-to-body="true"
|
||||
width="80%">
|
||||
<m-script-box :item="item" @getSriptBoxValue="getSriptBoxValue" @closeAble="closeAble"></m-script-box>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -185,7 +191,9 @@
|
|||
// recipients
|
||||
receivers: [],
|
||||
// copy to
|
||||
receiversCc: []
|
||||
receiversCc: [],
|
||||
item: '',
|
||||
scriptBoxDialog: false
|
||||
}
|
||||
},
|
||||
mixins: [disabledState],
|
||||
|
|
@ -195,32 +203,11 @@
|
|||
},
|
||||
methods: {
|
||||
setEditorVal() {
|
||||
let self = this
|
||||
let modal = self.$modal.dialog({
|
||||
className: 'scriptModal',
|
||||
closable: false,
|
||||
showMask: true,
|
||||
maskClosable: true,
|
||||
onClose: function() {
|
||||
|
||||
},
|
||||
render (h) {
|
||||
return h(mScriptBox, {
|
||||
on: {
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
closeAble () {
|
||||
// this.$modal.destroy()
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: editor.getValue()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = editor.getValue()
|
||||
this.scriptBoxDialog = true
|
||||
},
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
/**
|
||||
* return sqlType
|
||||
|
|
@ -519,7 +506,7 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
components: { mListBox, mDatasource, mLocalParams, mUdfs, mSqlType, mStatementList, mEmail }
|
||||
components: { mListBox, mDatasource, mLocalParams, mUdfs, mSqlType, mStatementList, mEmail, mScriptBox }
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" rel="stylesheet/scss">
|
||||
|
|
|
|||
|
|
@ -20,23 +20,14 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Custom Job')}}</div>
|
||||
<div slot="content">
|
||||
<x-switch
|
||||
v-model="isCustomTask"
|
||||
@on-click="_onSwitch"
|
||||
:disabled="isDetails"
|
||||
>
|
||||
</x-switch>
|
||||
<el-switch size="small" v-model="isCustomTask" @change="_onSwitch" :disabled="isDetails"></el-switch>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box v-show="isCustomTask">
|
||||
<div slot="text">{{$t('Custom Script')}}</div>
|
||||
<div slot="content">
|
||||
<div class="from-mirror">
|
||||
<textarea
|
||||
id="code-shell-mirror"
|
||||
name="code-shell-mirror"
|
||||
style="opacity: 0;">
|
||||
</textarea>
|
||||
<textarea id="code-shell-mirror" name="code-shell-mirror" style="opacity: 0;"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
|
@ -44,29 +35,25 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Sqoop Job Name')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
v-model="jobName"
|
||||
:placeholder="$t('Please enter Job Name(required)')">
|
||||
</x-input>
|
||||
<el-input :disabled="isDetails" size="small" type="text" v-model="jobName" :placeholder="$t('Please enter Job Name(required)')"></el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Direct')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 130px;"
|
||||
size="small"
|
||||
v-model="modelType"
|
||||
:disabled="isDetails"
|
||||
@on-change="_handleModelTypeChange">
|
||||
<x-option
|
||||
@change="_handleModelTypeChange">
|
||||
<el-option
|
||||
v-for="city in modelTypeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
|
|
@ -100,18 +87,19 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Type')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 130px;"
|
||||
size="small"
|
||||
v-model="sourceType"
|
||||
:disabled="isDetails"
|
||||
@on-change="_handleSourceTypeChange">
|
||||
<x-option
|
||||
@change="_handleSourceTypeChange">
|
||||
<el-option
|
||||
v-for="city in sourceTypeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
|
|
@ -134,10 +122,10 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('ModelType')}}</div>
|
||||
<div slot="content">
|
||||
<x-radio-group v-model="srcQueryType" @on-change="_handleQueryType">
|
||||
<x-radio label="0">{{$t('Form')}}</x-radio>
|
||||
<x-radio label="1">SQL</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="srcQueryType" size="small" @change="_handleQueryType" style="vertical-align: sub;">
|
||||
<el-radio label="0">{{$t('Form')}}</el-radio>
|
||||
<el-radio label="1">SQL</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
|
|
@ -146,34 +134,36 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Table')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="sourceMysqlParams.srcTable"
|
||||
:placeholder="$t('Please enter Mysql Table(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('ColumnType')}}</div>
|
||||
<div slot="content">
|
||||
<x-radio-group v-model="sourceMysqlParams.srcColumnType">
|
||||
<x-radio label="0">{{$t('All Columns')}}</x-radio>
|
||||
<x-radio label="1">{{$t('Some Columns')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="sourceMysqlParams.srcColumnType" size="small" style="vertical-align: sub;">
|
||||
<el-radio label="0">{{$t('All Columns')}}</el-radio>
|
||||
<el-radio label="1">{{$t('Some Columns')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
<m-list-box v-if="sourceMysqlParams.srcColumnType=='1'">
|
||||
<div slot="text">{{$t('Column')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="sourceMysqlParams.srcColumns"
|
||||
:placeholder="$t('Please enter Columns (Comma separated)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
</template>
|
||||
|
|
@ -184,45 +174,49 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Database')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="sourceHiveParams.hiveDatabase"
|
||||
:placeholder="$t('Please enter Hive Database(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Table')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="sourceHiveParams.hiveTable"
|
||||
:placeholder="$t('Please enter Hive Table(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Hive partition Keys')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="sourceHiveParams.hivePartitionKey"
|
||||
:placeholder="$t('Please enter Hive Partition Keys')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Hive partition Values')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="sourceHiveParams.hivePartitionValue"
|
||||
:placeholder="$t('Please enter Hive Partition Values')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
</template>
|
||||
|
|
@ -231,12 +225,13 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Export Dir')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="sourceHdfsParams.exportDir"
|
||||
:placeholder="$t('Please enter Export Dir(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
</template>
|
||||
|
|
@ -251,7 +246,7 @@
|
|||
style="opacity: 0;">
|
||||
</textarea>
|
||||
<a class="ans-modal-box-max">
|
||||
<em class="ans-icon-max" @click="setEditorVal"></em>
|
||||
<em class="el-icon-rank" @click="setEditorVal"></em>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -290,91 +285,97 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Type')}}</div>
|
||||
<div slot="content">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 130px;"
|
||||
size="small"
|
||||
v-model="targetType"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="city in targetTypeList"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<div v-show="targetType==='HIVE'">
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Database')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHiveParams.hiveDatabase"
|
||||
:placeholder="$t('Please enter Hive Database(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Table')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHiveParams.hiveTable"
|
||||
:placeholder="$t('Please enter Hive Table(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('CreateHiveTable')}}</div>
|
||||
<div slot="content">
|
||||
<x-switch v-model="targetHiveParams.createHiveTable"></x-switch>
|
||||
<el-switch v-model="targetHiveParams.createHiveTable" size="small"></el-switch>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('DropDelimiter')}}</div>
|
||||
<div slot="content">
|
||||
<x-switch v-model="targetHiveParams.dropDelimiter"></x-switch>
|
||||
<el-switch v-model="targetHiveParams.dropDelimiter" size="small"></el-switch>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('OverWriteSrc')}}</div>
|
||||
<div slot="content">
|
||||
<x-switch v-model="targetHiveParams.hiveOverWrite"></x-switch>
|
||||
<el-switch v-model="targetHiveParams.hiveOverWrite" size="small"></el-switch>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('ReplaceDelimiter')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHiveParams.replaceDelimiter"
|
||||
:placeholder="$t('Please enter Replace Delimiter')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Hive partition Keys')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHiveParams.hivePartitionKey"
|
||||
:placeholder="$t('Please enter Hive Partition Keys')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Hive partition Values')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHiveParams.hivePartitionValue"
|
||||
:placeholder="$t('Please enter Hive Partition Values')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
</div>
|
||||
|
|
@ -382,62 +383,65 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Target Dir')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHdfsParams.targetPath"
|
||||
:placeholder="$t('Please enter Target Dir(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('DeleteTargetDir')}}</div>
|
||||
<div slot="content">
|
||||
<x-switch v-model="targetHdfsParams.deleteTargetDir"></x-switch>
|
||||
<el-switch v-model="targetHdfsParams.deleteTargetDir" size="small"></el-switch>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('CompressionCodec')}}</div>
|
||||
<div slot="content">
|
||||
<x-radio-group v-model="targetHdfsParams.compressionCodec">
|
||||
<x-radio label="snappy">snappy</x-radio>
|
||||
<x-radio label="lzo">lzo</x-radio>
|
||||
<x-radio label="gzip">gzip</x-radio>
|
||||
<x-radio label="">no</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="targetHdfsParams.compressionCodec" size="small">
|
||||
<el-radio label="snappy">snappy</el-radio>
|
||||
<el-radio label="lzo">lzo</el-radio>
|
||||
<el-radio label="gzip">gzip</el-radio>
|
||||
<el-radio label="">no</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('FileType')}}</div>
|
||||
<div slot="content">
|
||||
<x-radio-group v-model="targetHdfsParams.fileType">
|
||||
<x-radio label="--as-avrodatafile">avro</x-radio>
|
||||
<x-radio label="--as-sequencefile">sequence</x-radio>
|
||||
<x-radio label="--as-textfile">text</x-radio>
|
||||
<x-radio label="--as-parquetfile">parquet</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="targetHdfsParams.fileType" size="small">
|
||||
<el-radio label="--as-avrodatafile">avro</el-radio>
|
||||
<el-radio label="--as-sequencefile">sequence</el-radio>
|
||||
<el-radio label="--as-textfile">text</el-radio>
|
||||
<el-radio label="--as-parquetfile">parquet</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('FieldsTerminated')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHdfsParams.fieldsTerminated"
|
||||
:placeholder="$t('Please enter Fields Terminated')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('LinesTerminated')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetHdfsParams.linesTerminated"
|
||||
:placeholder="$t('Please enter Lines Terminated')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
</div>
|
||||
|
|
@ -458,71 +462,76 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Table')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetMysqlParams.targetTable"
|
||||
:placeholder="$t('Please enter Mysql Table(required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('Column')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetMysqlParams.targetColumns"
|
||||
:placeholder="$t('Please enter Columns (Comma separated)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('FieldsTerminated')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetMysqlParams.fieldsTerminated"
|
||||
:placeholder="$t('Please enter Fields Terminated')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('LinesTerminated')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetMysqlParams.linesTerminated"
|
||||
:placeholder="$t('Please enter Lines Terminated')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box>
|
||||
<div slot="text">{{$t('IsUpdate')}}</div>
|
||||
<div slot="content">
|
||||
<x-switch v-model="targetMysqlParams.isUpdate"></x-switch>
|
||||
<el-switch v-model="targetMysqlParams.isUpdate" size="small"></el-switch>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box v-show="targetMysqlParams.isUpdate">
|
||||
<div slot="text">{{$t('UpdateKey')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="targetMysqlParams.targetUpdateKey"
|
||||
:placeholder="$t('Please enter Update Key')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<m-list-box v-show="targetMysqlParams.isUpdate">
|
||||
<div slot="text">{{$t('UpdateMode')}}</div>
|
||||
<div slot="content">
|
||||
<x-radio-group v-model="targetMysqlParams.targetUpdateMode">
|
||||
<x-radio label="updateonly">{{$t('OnlyUpdate')}}</x-radio>
|
||||
<x-radio label="allowinsert">{{$t('AllowInsert')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="targetMysqlParams.targetUpdateMode" size="small">
|
||||
<el-radio label="updateonly">{{$t('OnlyUpdate')}}</el-radio>
|
||||
<el-radio label="allowinsert">{{$t('AllowInsert')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</m-list-box>
|
||||
|
||||
|
|
@ -530,13 +539,13 @@
|
|||
<m-list-box>
|
||||
<div slot="text">{{$t('Concurrency')}}</div>
|
||||
<div slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="concurrency"
|
||||
:placeholder="$t('Please enter Concurrency')">
|
||||
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</m-list-box>
|
||||
</template>
|
||||
|
|
@ -551,6 +560,12 @@
|
|||
</m-local-params>
|
||||
</div>
|
||||
</m-list-box>
|
||||
<el-dialog
|
||||
:visible.sync="scriptBoxDialog"
|
||||
append-to-body="true"
|
||||
width="80%">
|
||||
<m-script-box :item="item" @getSriptBoxValue="getSriptBoxValue" @closeAble="closeAble"></m-script-box>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -696,8 +711,9 @@
|
|||
replaceDelimiter:"",
|
||||
hivePartitionKey:"",
|
||||
hivePartitionValue:""
|
||||
|
||||
}
|
||||
},
|
||||
item: '',
|
||||
scriptBoxDialog: false
|
||||
}
|
||||
},
|
||||
mixins: [disabledState],
|
||||
|
|
@ -706,32 +722,11 @@
|
|||
},
|
||||
methods: {
|
||||
setEditorVal() {
|
||||
let self = this
|
||||
let modal = self.$modal.dialog({
|
||||
className: 'scriptModal',
|
||||
closable: false,
|
||||
showMask: true,
|
||||
maskClosable: true,
|
||||
onClose: function() {
|
||||
|
||||
},
|
||||
render (h) {
|
||||
return h(mScriptBox, {
|
||||
on: {
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
closeAble () {
|
||||
// this.$modal.destroy()
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: editor.getValue()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = editor.getValue()
|
||||
this.scriptBoxDialog = true
|
||||
},
|
||||
getSriptBoxValue (val) {
|
||||
editor.setValue(val)
|
||||
},
|
||||
_handleQueryType(o){
|
||||
this.sourceMysqlParams.srcQueryType = this.srcQueryType
|
||||
|
|
@ -740,7 +735,7 @@
|
|||
},
|
||||
|
||||
_handleModelTypeChange(a){
|
||||
this._getSourceTypeList(a.label)
|
||||
this._getSourceTypeList(a)
|
||||
this.sourceType = this.sourceTypeList[0].code
|
||||
this._handleSourceTypeChange({label: this.sourceType, value: this.sourceType})
|
||||
},
|
||||
|
|
@ -1267,7 +1262,7 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
components: { mListBox, mDatasource, mLocalParams}
|
||||
components: { mListBox, mDatasource, mLocalParams, mScriptBox}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" rel="stylesheet/scss">
|
||||
|
|
|
|||
|
|
@ -22,19 +22,20 @@
|
|||
</div>
|
||||
<div class="cont-box">
|
||||
<div class="label-box">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 100%;"
|
||||
size="small"
|
||||
filterable
|
||||
v-model="wdiCurr"
|
||||
:disabled="isDetails"
|
||||
@on-change="_handleWdiChanged">
|
||||
<x-option
|
||||
v-for="city in processDefinitionList"
|
||||
:key="city.code"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
@change="_handleWdiChanged">
|
||||
<el-option
|
||||
v-for="city in processDefinitionList"
|
||||
:key="city.code"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -77,7 +78,7 @@
|
|||
* The selected process defines the upper component name padding
|
||||
*/
|
||||
_handleWdiChanged (o) {
|
||||
this.$emit('on-set-process-name', this._handleName(o.value))
|
||||
this.$emit('on-set-process-name', this._handleName(o))
|
||||
},
|
||||
/**
|
||||
* Return the name according to the process definition id
|
||||
|
|
|
|||
|
|
@ -21,22 +21,22 @@
|
|||
<div class="clearfix list">
|
||||
<span class="sp1">{{$t('Deploy Mode')}}</span>
|
||||
<span class="sp2">
|
||||
<x-radio-group v-model="deployMode">
|
||||
<x-radio :label="'client'" :disabled="isDetails"></x-radio>
|
||||
<x-radio :label="'cluster'" :disabled="isDetails"></x-radio>
|
||||
<x-radio :label="'local'" :disabled="isDetails"></x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group size="small" v-model="deployMode">
|
||||
<el-radio :label="'client'" :disabled="isDetails"></el-radio>
|
||||
<el-radio :label="'cluster'" :disabled="isDetails"></el-radio>
|
||||
<el-radio :label="'local'" :disabled="isDetails"></el-radio>
|
||||
</el-radio-group>
|
||||
</span>
|
||||
<span class="sp1 sp3">{{$t('Queue')}}</span>
|
||||
<span class="sp4">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="queue"
|
||||
:placeholder="$t('Please enter queue value')"
|
||||
style="width: 60%;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 60%;">
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -45,27 +45,28 @@
|
|||
<div class="clearfix list">
|
||||
<span class="sp1">{{$t('Master')}}</span>
|
||||
<span class="sp4">
|
||||
<x-select
|
||||
<el-select
|
||||
style="width: 130px;"
|
||||
size="small"
|
||||
v-model="master"
|
||||
:disabled="isDetails">
|
||||
<x-option
|
||||
v-for="city in masterType"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-option
|
||||
v-for="city in masterType"
|
||||
:key="city.code"
|
||||
:value="city.code"
|
||||
:label="city.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</span>
|
||||
<span v-if="masterUrlState">
|
||||
<x-input
|
||||
<el-input
|
||||
:disabled="isDetails"
|
||||
type="input"
|
||||
size="small"
|
||||
v-model="masterUrl"
|
||||
:placeholder="$t('Please Enter Url')"
|
||||
style="width: 60%;"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
style="width: 60%;">
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -14,10 +14,9 @@
|
|||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import Vue from 'vue'
|
||||
import mAffirm from './jumpAffirm'
|
||||
import store from '@/conf/home/store'
|
||||
import i18n from '@/module/i18n'
|
||||
import router from '@/conf/home/router'
|
||||
import { uuid, findComponentDownward } from '@/module/util/'
|
||||
|
||||
|
|
@ -81,34 +80,18 @@ Affirm.paramVerification = (name) => {
|
|||
* Pop-up judgment
|
||||
*/
|
||||
Affirm.isPop = (fn) => {
|
||||
Vue.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mAffirm, {
|
||||
on: {
|
||||
ok () {
|
||||
// save
|
||||
findComponentDownward($root, 'dag-chart')._save('affirm').then(() => {
|
||||
fn()
|
||||
Vue.$modal.destroy()
|
||||
}).catch(() => {
|
||||
fn()
|
||||
Vue.$modal.destroy()
|
||||
})
|
||||
},
|
||||
close () {
|
||||
fn()
|
||||
Vue.$modal.destroy()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
}
|
||||
})
|
||||
}
|
||||
Vue.prototype.$confirm(`${i18n.$t('Whether to save the DAG graph')}`, '', {
|
||||
confirmButtonText: `${i18n.$t('Save')}`,
|
||||
cancelButtonText: `${i18n.$t('Cancel')}`,
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
findComponentDownward($root, 'dag-chart')._save('affirm').then(() => {
|
||||
fn()
|
||||
}).catch(() => {
|
||||
fn()
|
||||
})
|
||||
}).catch(() => {
|
||||
fn()
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -17,7 +17,6 @@
|
|||
import 'jquery-ui/ui/widgets/draggable'
|
||||
import 'jquery-ui/ui/widgets/droppable'
|
||||
import 'jquery-ui/ui/widgets/resizable'
|
||||
import Vue from 'vue'
|
||||
import _ from 'lodash'
|
||||
import i18n from '@/module/i18n'
|
||||
import { jsPlumb } from 'jsplumb'
|
||||
|
|
@ -34,7 +33,6 @@ import {
|
|||
rtTargetarrArr,
|
||||
computeScale
|
||||
} from './util'
|
||||
import mStart from '@/conf/home/pages/projects/pages/definition/pages/list/_source/start'
|
||||
import multiDrag from './multiDrag'
|
||||
|
||||
const JSP = function () {
|
||||
|
|
@ -88,7 +86,7 @@ JSP.prototype.init = function ({ dag, instance, options }) {
|
|||
if (this.config.isClick) {
|
||||
this.connectClick(e)
|
||||
} else {
|
||||
findComponentDownward(this.dag.$root, 'dag-chart')._createLineLabel({id: e._jsPlumb.overlays.label.canvas.id, sourceId: e.sourceId, targetId: e.targetId})
|
||||
findComponentDownward(this.dag.$root, 'dag-chart')._createLineLabel({ id: e._jsPlumb.overlays.label.canvas.id, sourceId: e.sourceId, targetId: e.targetId })
|
||||
}
|
||||
})
|
||||
|
||||
|
|
@ -208,8 +206,8 @@ JSP.prototype.jsonHandle = function ({ largeJson, locations }) {
|
|||
taskType: v.type,
|
||||
runFlag: v.runFlag,
|
||||
nodenumber: locations[v.id].nodenumber,
|
||||
successNode: v.conditionResult === undefined? '' : v.conditionResult.successNode[0],
|
||||
failedNode: v.conditionResult === undefined? '' : v.conditionResult.failedNode[0]
|
||||
successNode: v.conditionResult === undefined ? '' : v.conditionResult.successNode[0],
|
||||
failedNode: v.conditionResult === undefined ? '' : v.conditionResult.failedNode[0]
|
||||
}))
|
||||
|
||||
// contextmenu event
|
||||
|
|
@ -280,10 +278,10 @@ JSP.prototype.tasksContextmenu = function (event) {
|
|||
const isTwo = store.state.dag.isDetails
|
||||
|
||||
const html = [
|
||||
`<a href="javascript:" id="startRunning" class="${isOne ? '' : 'disbled'}"><em class="ans-icon-play"></em><span>${i18n.$t('Start')}</span></a>`,
|
||||
`<a href="javascript:" id="editNodes" class="${isTwo ? 'disbled' : ''}"><em class="ans-icon-edit"></em><span>${i18n.$t('Edit')}</span></a>`,
|
||||
`<a href="javascript:" id="copyNodes" class="${isTwo ? 'disbled' : ''}"><em class="ans-icon-copy"></em><span>${i18n.$t('Copy')}</span></a>`,
|
||||
`<a href="javascript:" id="removeNodes" class="${isTwo ? 'disbled' : ''}"><em class="ans-icon-trash"></em><span>${i18n.$t('Delete')}</span></a>`
|
||||
`<a href="javascript:" id="startRunning" class="${isOne ? '' : 'disbled'}"><em class="el-icon-video-play"></em><span>${i18n.$t('Start')}</span></a>`,
|
||||
`<a href="javascript:" id="editNodes" class="${isTwo ? 'disbled' : ''}"><em class="el-icon-edit-outline"></em><span>${i18n.$t('Edit')}</span></a>`,
|
||||
`<a href="javascript:" id="copyNodes" class="${isTwo ? 'disbled' : ''}"><em class="el-icon-copy-document"></em><span>${i18n.$t('Copy')}</span></a>`,
|
||||
`<a href="javascript:" id="removeNodes" class="${isTwo ? 'disbled' : ''}"><em class="el-icon-delete"></em><span>${i18n.$t('Delete')}</span></a>`
|
||||
]
|
||||
|
||||
const operationHtml = () => {
|
||||
|
|
@ -310,35 +308,7 @@ JSP.prototype.tasksContextmenu = function (event) {
|
|||
const name = store.state.dag.name
|
||||
const id = router.history.current.params.id
|
||||
store.dispatch('dag/getStartCheck', { processDefinitionId: id }).then(res => {
|
||||
const modal = Vue.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mStart, {
|
||||
on: {
|
||||
onUpdate () {
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: {
|
||||
id: id,
|
||||
name: name
|
||||
},
|
||||
startNodeList: $name,
|
||||
sourceType: 'contextmenu'
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}).catch(e => {
|
||||
Vue.$message.error(e.msg || '')
|
||||
this.dag.startRunning({ id: id, name: name }, $name, 'contextmenu')
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
@ -370,7 +340,6 @@ JSP.prototype.tasksDblclick = function (e) {
|
|||
// Untie event
|
||||
if (this.config.isDblclick) {
|
||||
const id = $(e.currentTarget.offsetParent).attr('id')
|
||||
|
||||
findComponentDownward(this.dag.$root, 'dag-chart')._createNodes({
|
||||
id: id,
|
||||
type: $(`#${id}`).attr('data-tasks-type')
|
||||
|
|
@ -499,7 +468,7 @@ JSP.prototype.removeNodes = function ($id) {
|
|||
|
||||
// callback onRemoveNodes event
|
||||
this.options && this.options.onRemoveNodes && this.options.onRemoveNodes($id)
|
||||
let connects = []
|
||||
const connects = []
|
||||
_.map(this.JspInstance.getConnections(), v => {
|
||||
connects.push({
|
||||
endPointSourceId: v.sourceId,
|
||||
|
|
@ -604,10 +573,10 @@ JSP.prototype.copyNodes = function ($id) {
|
|||
JSP.prototype.handleEventScreen = function ({ item, is }) {
|
||||
let screenOpen = true
|
||||
if (is) {
|
||||
item.icon = 'ans-icon-min'
|
||||
item.icon = 'el-icon-full-screen'
|
||||
screenOpen = true
|
||||
} else {
|
||||
item.icon = 'ans-icon-max'
|
||||
item.icon = 'el-icon-rank'
|
||||
screenOpen = false
|
||||
}
|
||||
const $mainLayoutModel = $('.main-layout-model')
|
||||
|
|
@ -658,7 +627,7 @@ JSP.prototype.saveStore = function () {
|
|||
tasks.push(tasksParam)
|
||||
}
|
||||
})
|
||||
if(store.state.dag.connects.length ===this.JspInstance.getConnections().length) {
|
||||
if (store.state.dag.connects.length === this.JspInstance.getConnections().length) {
|
||||
_.map(store.state.dag.connects, u => {
|
||||
connects.push({
|
||||
endPointSourceId: u.endPointSourceId,
|
||||
|
|
@ -666,7 +635,7 @@ JSP.prototype.saveStore = function () {
|
|||
label: u.label
|
||||
})
|
||||
})
|
||||
} else if(store.state.dag.connects.length>0 && store.state.dag.connects.length < this.JspInstance.getConnections().length) {
|
||||
} else if (store.state.dag.connects.length > 0 && store.state.dag.connects.length < this.JspInstance.getConnections().length) {
|
||||
_.map(this.JspInstance.getConnections(), v => {
|
||||
connects.push({
|
||||
endPointSourceId: v.sourceId,
|
||||
|
|
@ -676,12 +645,12 @@ JSP.prototype.saveStore = function () {
|
|||
})
|
||||
_.map(store.state.dag.connects, u => {
|
||||
_.map(connects, v => {
|
||||
if(u.label && u.endPointSourceId === v.endPointSourceId && u.endPointTargetId===v.endPointTargetId) {
|
||||
if (u.label && u.endPointSourceId === v.endPointSourceId && u.endPointTargetId === v.endPointTargetId) {
|
||||
v.label = u.label
|
||||
}
|
||||
})
|
||||
})
|
||||
} else if(store.state.dag.connects.length===0) {
|
||||
} else if (store.state.dag.connects.length === 0) {
|
||||
_.map(this.JspInstance.getConnections(), v => {
|
||||
connects.push({
|
||||
endPointSourceId: v.sourceId,
|
||||
|
|
@ -690,7 +659,7 @@ JSP.prototype.saveStore = function () {
|
|||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
_.map(tasksAll(), v => {
|
||||
locations[v.id] = {
|
||||
name: v.name,
|
||||
|
|
@ -783,7 +752,7 @@ JSP.prototype.jspBackfill = function ({ connects, locations, largeJson }) {
|
|||
_.map(connects, v => {
|
||||
let sourceId = v.endPointSourceId.split('-')
|
||||
let targetId = v.endPointTargetId.split('-')
|
||||
let labels = v.label
|
||||
const labels = v.label
|
||||
if (sourceId.length === 4 && targetId.length === 4) {
|
||||
sourceId = `${sourceId[0]}-${sourceId[1]}-${sourceId[2]}`
|
||||
targetId = `${targetId[0]}-${targetId[1]}-${targetId[2]}`
|
||||
|
|
@ -791,24 +760,24 @@ JSP.prototype.jspBackfill = function ({ connects, locations, largeJson }) {
|
|||
sourceId = v.endPointSourceId
|
||||
targetId = v.endPointTargetId
|
||||
}
|
||||
|
||||
if($(`#${sourceId}`).attr('data-tasks-type') === 'CONDITIONS' && $(`#${sourceId}`).attr('data-successnode') === $(`#${targetId}`).find('.name-p').text()) {
|
||||
|
||||
if ($(`#${sourceId}`).attr('data-tasks-type') === 'CONDITIONS' && $(`#${sourceId}`).attr('data-successnode') === $(`#${targetId}`).find('.name-p').text()) {
|
||||
this.JspInstance.connect({
|
||||
source: sourceId,
|
||||
target: targetId,
|
||||
type: 'basic',
|
||||
paintStyle: { strokeWidth: 2, stroke: '#4caf50' },
|
||||
HoverPaintStyle: {stroke: '#ccc', strokeWidth: 3},
|
||||
overlays:[["Label", { label: labels} ]]
|
||||
HoverPaintStyle: { stroke: '#ccc', strokeWidth: 3 },
|
||||
overlays: [['Label', { label: labels }]]
|
||||
})
|
||||
} else if($(`#${sourceId}`).attr('data-tasks-type') === 'CONDITIONS' && $(`#${sourceId}`).attr('data-failednode') === $(`#${targetId}`).find('.name-p').text()) {
|
||||
} else if ($(`#${sourceId}`).attr('data-tasks-type') === 'CONDITIONS' && $(`#${sourceId}`).attr('data-failednode') === $(`#${targetId}`).find('.name-p').text()) {
|
||||
this.JspInstance.connect({
|
||||
source: sourceId,
|
||||
target: targetId,
|
||||
type: 'basic',
|
||||
paintStyle: { strokeWidth: 2, stroke: '#252d39' },
|
||||
HoverPaintStyle: {stroke: '#ccc', strokeWidth: 3},
|
||||
overlays:[["Label", { label: labels} ]]
|
||||
HoverPaintStyle: { stroke: '#ccc', strokeWidth: 3 },
|
||||
overlays: [['Label', { label: labels }]]
|
||||
})
|
||||
} else {
|
||||
this.JspInstance.connect({
|
||||
|
|
@ -816,8 +785,8 @@ JSP.prototype.jspBackfill = function ({ connects, locations, largeJson }) {
|
|||
target: targetId,
|
||||
type: 'basic',
|
||||
paintStyle: { strokeWidth: 2, stroke: '#2d8cf0' },
|
||||
HoverPaintStyle: {stroke: '#ccc', strokeWidth: 3},
|
||||
overlays:[["Label", { label: labels} ]]
|
||||
HoverPaintStyle: { stroke: '#ccc', strokeWidth: 3 },
|
||||
overlays: [['Label', { label: labels }]]
|
||||
})
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ const saveTargetarr = (valId, domId) => {
|
|||
}
|
||||
|
||||
const rtBantpl = () => {
|
||||
return `<em class="ans-icon-forbidden" data-toggle="tooltip" data-html="true" data-container="body" data-placement="left" title="${i18n.$t('Prohibition execution')}"></em>`
|
||||
return `<em class="fa fa-ban" data-toggle="tooltip" data-html="true" data-container="body" data-placement="left" title="${i18n.$t('Prohibition execution')}"></em>`
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -100,13 +100,13 @@ const setSvgColor = (e, color) => {
|
|||
// Traverse clear all colors
|
||||
$('.jtk-connector').each((i, o) => {
|
||||
_.map($(o)[0].childNodes, v => {
|
||||
if($(v).attr('fill') ==='#ccc') {
|
||||
if ($(v).attr('fill') === '#ccc') {
|
||||
$(v).attr('fill', '#2d8cf0')
|
||||
}
|
||||
if($(v).attr('fill') ==='#4caf50') {
|
||||
$(v).attr('fill','#4caf50').attr('stroke', '#4caf50').attr('stroke-width', 2)
|
||||
if ($(v).attr('fill') === '#4caf50') {
|
||||
$(v).attr('fill', '#4caf50').attr('stroke', '#4caf50').attr('stroke-width', 2)
|
||||
$(v).prev().attr('stroke', '#4caf50').attr('stroke-width', 2)
|
||||
} else if($(v).attr('fill') ==='#252d39') {
|
||||
} else if ($(v).attr('fill') === '#252d39') {
|
||||
$(v).attr('stroke', '#252d39').attr('stroke-width', 2)
|
||||
$(v).prev().attr('stroke', '#252d39').attr('stroke-width', 2)
|
||||
} else {
|
||||
|
|
@ -117,7 +117,7 @@ const setSvgColor = (e, color) => {
|
|||
|
||||
// Add color to the selection
|
||||
_.map($(e.canvas)[0].childNodes, (v, i) => {
|
||||
if($(v).attr('fill') ==='#2d8cf0') {
|
||||
if ($(v).attr('fill') === '#2d8cf0') {
|
||||
$(v).attr('fill', '#ccc')
|
||||
}
|
||||
$(v).attr('stroke', '#ccc')
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
<div class="starting-params-dag-index">
|
||||
<template v-if="isView && isActive">
|
||||
<div class="box">
|
||||
<p class="box-hd"><em class="fa ans-icon-arrow-circle-right"></em><strong>{{$t('Startup parameter')}}</strong></p>
|
||||
<p class="box-hd"><em class="fa fa-chevron-circle-right"></em><strong>{{$t('Startup parameter')}}</strong></p>
|
||||
<ul class="box-bd">
|
||||
<li><span class="tab">{{$t('Startup type')}}：</span><span class="content">{{_rtRunningType(startupParam.commandType)}}</span></li>
|
||||
<li><span class="tab">{{$t('Complement range')}}：</span><span class="content" v-if="startupParam.commandParam && startupParam.commandParam.complementStartDate">{{startupParam.commandParam.complementStartDate}}-{{startupParam.commandParam.complementEndDate}}</span><span class="content" v-else>-</span></li>
|
||||
|
|
|
|||
|
|
@ -15,18 +15,19 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
<template>
|
||||
<x-select
|
||||
<el-select
|
||||
:disabled="isDetails"
|
||||
@on-change="_onChange"
|
||||
@change="_onChange"
|
||||
v-model="value"
|
||||
size="small"
|
||||
style="width: 180px">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="item in itemList"
|
||||
:key="item.id"
|
||||
:value="item.id"
|
||||
:label="item.tenantCode">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<script>
|
||||
import disabledState from '@/module/mixin/disabledState'
|
||||
|
|
@ -60,8 +61,8 @@
|
|||
},
|
||||
methods: {
|
||||
_onChange (o) {
|
||||
this.value = o.value
|
||||
this.$emit('tenantSelectEvent', o.value)
|
||||
this.value = o
|
||||
this.$emit('tenantSelectEvent', o)
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
|
|||
|
|
@ -17,28 +17,26 @@
|
|||
<template>
|
||||
<div class="udp-model">
|
||||
<div class="scrollbar contpi-boxt">
|
||||
<div class="title">
|
||||
<span>{{$t('Set the DAG diagram name')}}</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<x-input
|
||||
<el-input
|
||||
type="text"
|
||||
size="small"
|
||||
v-model="name"
|
||||
:disabled="router.history.current.name === 'projects-instance-details'"
|
||||
:placeholder="$t('Please enter name (required)')">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<template v-if="router.history.current.name !== 'projects-instance-details'">
|
||||
<div style="padding-top: 12px;">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
size="small"
|
||||
v-model="description"
|
||||
:autosize="{minRows:2}"
|
||||
:placeholder="$t('Please enter description(optional)')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -49,14 +47,14 @@
|
|||
<div class="title" style="padding-top: 6px;">
|
||||
<span class="text-b">{{$t('warning of timeout')}}</span>
|
||||
<span style="padding-left: 6px;">
|
||||
<x-switch v-model="checkedTimeout"></x-switch>
|
||||
<el-switch v-model="checkedTimeout" size="small"></el-switch>
|
||||
</span>
|
||||
</div>
|
||||
<div class="content" style="padding-bottom: 10px;" v-if="checkedTimeout">
|
||||
<span>
|
||||
<x-input v-model="timeout" style="width: 160px;" maxlength="9">
|
||||
<el-input v-model="timeout" style="width: 160px;" maxlength="9" size="small">
|
||||
<span slot="append">{{$t('Minute')}}</span>
|
||||
</x-input>
|
||||
</el-input>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
|
@ -78,11 +76,11 @@
|
|||
<div class="submit">
|
||||
<template v-if="router.history.current.name === 'projects-instance-details'">
|
||||
<div class="lint-pt">
|
||||
<x-checkbox v-model="syncDefine">{{$t('Whether to update the process definition')}}</x-checkbox>
|
||||
<el-checkbox v-model="syncDefine" size="small">{{$t('Whether to update the process definition')}}</el-checkbox>
|
||||
</div>
|
||||
</template>
|
||||
<x-button type="text" @click="close()"> {{$t('Cancel')}} </x-button>
|
||||
<x-button type="primary" shape="circle" :disabled="isDetails" @click="ok()">{{$t('Add')}}</x-button>
|
||||
<el-button type="text" size="small" @click="close()"> {{$t('Cancel')}} </el-button>
|
||||
<el-button type="primary" size="small" round :disabled="isDetails" @click="ok()">{{$t('Add')}}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -18,23 +18,23 @@
|
|||
<div class="variable-model">
|
||||
<template v-if="list">
|
||||
<div class="list">
|
||||
<div class="name"><em class="fa ans-icon-code"></em><strong style="padding-top: 3px;display: inline-block">{{$t('Global parameters')}}</strong></div>
|
||||
<div class="name"><em class="fa fa-tasks"></em><strong style="padding-top: 3px;display: inline-block">{{$t('Global parameters')}}</strong></div>
|
||||
<div class="var-cont">
|
||||
<template v-for="(item,$index) in list.globalParams">
|
||||
<x-button
|
||||
size="xsmall"
|
||||
type="ghost"
|
||||
<el-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
@click="_copy('gbudp-' + $index)"
|
||||
:key="$index"
|
||||
:data-clipboard-text="item.prop + ' = ' +item.value"
|
||||
:class="'gbudp-' + $index">
|
||||
<strong style="color: #2A455B;">{{item.prop}}</strong> = {{item.value}}
|
||||
</x-button>
|
||||
</el-button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list" style="height: 30px;">
|
||||
<div class="name"><em class="fa ans-icon-code"></em><strong style="padding-top: 3px;display: inline-block">{{$t('Local parameters')}}</strong></div>
|
||||
<div class="name"><em class="fa fa-code"></em><strong style="padding-top: 3px;display: inline-block">{{$t('Local parameters')}}</strong></div>
|
||||
<div class="var-cont">
|
||||
|
||||
</div>
|
||||
|
|
@ -43,7 +43,7 @@
|
|||
<div class="task-name">Task({{$index}})：{{key}}</div>
|
||||
<div class="var-cont" v-if="item.localParamsList.length">
|
||||
<template v-for="(el,index) in item.localParamsList">
|
||||
<x-button size="xsmall" type="ghost" :key="index" @click="_copy('copy-part-' + index)" :data-clipboard-text="_rtClipboard(el,item.taskType)" :class="'copy-part-' + index">
|
||||
<el-button size="mini" type="primary" :key="index" @click="_copy('copy-part-' + index)" :data-clipboard-text="_rtClipboard(el,item.taskType)" :class="'copy-part-' + index">
|
||||
<span v-for="(e,k,i) in el" :key="i">
|
||||
<template v-if="item.taskType === 'SQL' || item.taskType === 'PROCEDURE'">
|
||||
<template v-if="(k !== 'direct' && k !== 'type')">
|
||||
|
|
@ -54,7 +54,7 @@
|
|||
<strong style="color: #2A455B;">{{k}}</strong> = {{e}}
|
||||
</template>
|
||||
</span>
|
||||
</x-button>
|
||||
</el-button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,139 +16,136 @@
|
|||
*/
|
||||
<template>
|
||||
<div class="datasource-popup-model">
|
||||
<div class="top-p">
|
||||
<span>{{item ? `${$t('Edit')}` : `${$t('Create')}`}}{{`${$t('Datasource')}`}}</span>
|
||||
</div>
|
||||
<div class="content-p">
|
||||
<div class="create-datasource-model">
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Datasource')}}</template>
|
||||
<template slot="content">
|
||||
<x-select style="width: 100%;" v-model="type">
|
||||
<x-option v-for="item in datasourceTypeList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<template slot="content" size="small">
|
||||
<el-select style="width: 100%;" v-model="type">
|
||||
<el-option v-for="item in datasourceTypeList" :key="item.value" :value="item.value" :label="item.label">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Datasource Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="name"
|
||||
maxlength="60"
|
||||
:placeholder="$t('Please enter datasource name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter datasource name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="note"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('IP')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="host"
|
||||
maxlength="60"
|
||||
:placeholder="$t('Please enter IP')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter IP')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Port')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="port"
|
||||
:placeholder="$t('Please enter port')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter port')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f :class="{hidden:showPrincipal}">
|
||||
<template slot="name"><strong>*</strong>Principal</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="principal"
|
||||
:placeholder="$t('Please enter Principal')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter Principal')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('User Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="userName"
|
||||
maxlength="60"
|
||||
:placeholder="$t('Please enter user name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter user name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Password')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="password"
|
||||
v-model="password"
|
||||
:placeholder="$t('Please enter your password')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter your password')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong :class="{hidden:showdDatabase}">*</strong>{{$t('Database Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="database"
|
||||
maxlength="60"
|
||||
:placeholder="$t('Please enter database name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter database name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f v-if="showConnectType">
|
||||
<template slot="name"><strong>*</strong>{{$t('Oracle Connect Type')}}</template>
|
||||
<template slot="content">
|
||||
<x-radio-group v-model="connectType" size="small">
|
||||
<x-radio :label="'ORACLE_SERVICE_NAME'">{{$t('Oracle Service Name')}}</x-radio>
|
||||
<x-radio :label="'ORACLE_SID'">{{$t('Oracle SID')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="connectType" size="small" style="vertical-align: sub;">
|
||||
<el-radio :label="'ORACLE_SERVICE_NAME'">{{$t('Oracle Service Name')}}</el-radio>
|
||||
<el-radio :label="'ORACLE_SID'">{{$t('Oracle SID')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('jdbc connect parameters')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="other"
|
||||
:autosize="{minRows:2}"
|
||||
:placeholder="_rtOtherPlaceholder()"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="_rtOtherPlaceholder()">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom-p">
|
||||
<x-button type="text" @click="_close()"> {{$t('Cancel')}} </x-button>
|
||||
<x-button type="success" shape="circle" @click="_testConnect()" :loading="testLoading">{{testLoading ? 'Loading...' : $t('Test Connect')}}</x-button>
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="_ok()">{{spinnerLoading ? 'Loading...' :item ? `${$t('Edit')}` : `${$t('Submit')}`}} </x-button>
|
||||
<el-button type="text" ize="mini" @click="_close()"> {{$t('Cancel')}} </el-button>
|
||||
<el-button type="success" size="mini" round @click="_testConnect()" :loading="testLoading">{{testLoading ? 'Loading...' : $t('Test Connect')}}</el-button>
|
||||
<el-button type="primary" size="mini" round :loading="spinnerLoading" @click="_ok()">{{spinnerLoading ? 'Loading...' :item ? `${$t('Edit')}` : `${$t('Submit')}`}} </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -17,97 +17,52 @@
|
|||
<template>
|
||||
<div class="list-model">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th scope="col">
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Datasource Name')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="120">
|
||||
<span>{{$t('Datasource Type')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="100">
|
||||
<span>{{$t('Datasource Parameter')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Description')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="150">
|
||||
<span>{{$t('Create Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="150">
|
||||
<span>{{$t('Update Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="80">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="$index">
|
||||
<td>
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="ellipsis">
|
||||
{{item.name}}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.type}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<m-tooltips-JSON :JSON="JSON.parse(item.connectionParams)" :id="item.id">
|
||||
<span slot="reference">
|
||||
<a href="javascript:" class="links" style="font-size: 12px;">{{$t('Click to view')}}</a>
|
||||
</span>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column prop="name" :label="$t('Datasource Name')"></el-table-column>
|
||||
<el-table-column prop="type" :label="$t('Datasource Type')"></el-table-column>
|
||||
<el-table-column :label="$t('Datasource Parameter')">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<m-tooltips-JSON :JSON="JSON.parse(scope.row.connectionParams)" :id="scope.row.id">
|
||||
<span slot="reference">
|
||||
<el-button size="small" type="text">{{$t('Click to view')}}</el-button>
|
||||
</span>
|
||||
</m-tooltips-JSON>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.note" class="ellipsis" v-tooltip.large.top.start.light="{text: item.note, maxWidth: '500px'}">{{item.note}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.createTime">{{item.createTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.updateTime">{{item.updateTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Edit')"
|
||||
icon="ans-icon-edit"
|
||||
@click="_edit(item)">
|
||||
</x-button>
|
||||
<x-poptip
|
||||
:ref="'poptip-delete-' + $index"
|
||||
placement="bottom-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-trash"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('delete')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="description" :label="$t('Description')" width="200"></el-table-column>
|
||||
<el-table-column :label="$t('Create Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.createTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Update Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.updateTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip :content="$t('Edit')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-edit-outline" @click="_edit(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top" :enterable="false">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete(scope.row,scope.row.id)"
|
||||
>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -134,17 +89,10 @@
|
|||
},
|
||||
methods: {
|
||||
...mapActions('datasource', ['deleteDatasource']),
|
||||
/**
|
||||
* Close delete popup layer
|
||||
*/
|
||||
_closeDelete (i) {
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
},
|
||||
/**
|
||||
* Delete current line
|
||||
*/
|
||||
_delete (item, i) {
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
this.deleteDatasource({
|
||||
id: item.id
|
||||
}).then(res => {
|
||||
|
|
|
|||
|
|
@ -19,7 +19,14 @@
|
|||
<template slot="conditions">
|
||||
<m-conditions @on-conditions="_onConditions">
|
||||
<template slot="button-group">
|
||||
<x-button type="ghost" size="small" @click="_create('')">{{$t('Create Datasource')}}</x-button>
|
||||
<el-button size="mini" @click="_create('')">{{$t('Create Datasource')}}</el-button>
|
||||
<el-dialog
|
||||
:title="item ?($t('Edit')+$t('Datasource')) : ($t('Create')+$t('Datasource'))"
|
||||
:visible.sync="dialogVisible"
|
||||
width="65%"
|
||||
:append-to-body="true">
|
||||
<m-create-data-source :item="item" @onUpdate="onUpdate" @close="close"></m-create-data-source>
|
||||
</el-dialog>
|
||||
</template>
|
||||
</m-conditions>
|
||||
</template>
|
||||
|
|
@ -27,7 +34,16 @@
|
|||
<template v-if="datasourcesList.length || total>0">
|
||||
<m-list @on-update="_onUpdate" :datasources-list="datasourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize"></m-list>
|
||||
<div class="page-box">
|
||||
<x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="searchParams.pageSize"
|
||||
:current-page.sync="searchParams.pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!datasourcesList.length && total<=0">
|
||||
|
|
@ -65,8 +81,11 @@
|
|||
// Number of pages
|
||||
pageNo: 1,
|
||||
// Search value
|
||||
searchVal: ''
|
||||
}
|
||||
searchVal: '',
|
||||
|
||||
},
|
||||
dialogVisible: false,
|
||||
item: {},
|
||||
}
|
||||
},
|
||||
mixins: [listUrlParamHandle],
|
||||
|
|
@ -77,30 +96,15 @@
|
|||
* create data source
|
||||
*/
|
||||
_create (item) {
|
||||
let self = this
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mCreateDataSource, {
|
||||
on: {
|
||||
onUpdate () {
|
||||
self._debounceGET('false')
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: item
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = item
|
||||
this.dialogVisible = true
|
||||
},
|
||||
onUpdate () {
|
||||
this._debounceGET('false')
|
||||
this.dialogVisible = false
|
||||
},
|
||||
close () {
|
||||
this.dialogVisible = false
|
||||
},
|
||||
/**
|
||||
* page
|
||||
|
|
@ -151,6 +155,6 @@
|
|||
},
|
||||
mounted () {
|
||||
},
|
||||
components: { mList, mConditions, mSpin, mListConstruction, mNoData }
|
||||
components: { mList, mConditions, mSpin, mListConstruction, mNoData, mCreateDataSource }
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export default {
|
|||
name: 'home',
|
||||
components: { mProjectHome, mListConstruction },
|
||||
mounted() {
|
||||
this.$modal.destroy()
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
export default {
|
||||
name: 'monitor-index',
|
||||
mounted() {
|
||||
this.$modal.destroy()
|
||||
|
||||
},
|
||||
components: { mSecondaryMenu }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,25 +21,10 @@
|
|||
</div>
|
||||
|
||||
<div class="table-box" v-if="zkDirectories.length > 0">
|
||||
<table class="fixed">
|
||||
<caption><!-- placeHolder --></caption>
|
||||
<tr>
|
||||
<th scope="col" style="min-width: 40px">
|
||||
<span>#</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 40px">
|
||||
<span>{{$t('zkDirectory')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in zkDirectories" :key="item.id">
|
||||
<td>
|
||||
<span>{{$index + 1}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.zkDirectory}}</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<el-table :data="zkDirectories" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column prop="zkDirectory" :label="$t('zkDirectory')"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<div v-if="zkDirectories.length === 0">
|
||||
|
|
|
|||
|
|
@ -17,92 +17,32 @@
|
|||
<template>
|
||||
<div class="list-model zookeeper-list">
|
||||
<div class="table-box">
|
||||
<table>
|
||||
<tr>
|
||||
<th>
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('host')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Number of connections')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>watches {{$t('Number')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Sent')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Received')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>leader/follower</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Min latency')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Avg latency')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Max latency')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Node count')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Query time')}}</span>
|
||||
</th>
|
||||
<th style="text-align: center">
|
||||
<span>{{$t('Node self-test status')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="$index">
|
||||
<td>
|
||||
<span>{{$index + 1}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>
|
||||
{{item.hostname}}
|
||||
</span>
|
||||
</td>
|
||||
<td><span>{{item.connections}}</span></td>
|
||||
<td>
|
||||
<span>{{item.watches}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.sent}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.received}}</span>
|
||||
</td>
|
||||
<td><span>{{item.mode}}</span></td>
|
||||
<td>
|
||||
<span>{{item.minLatency}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.avgLatency}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.maxLatency}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.nodeCount}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.date">{{item.date | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column prop="hostname" :label="$t('host')" min-width="130"></el-table-column>
|
||||
<el-table-column prop="connections" :label="$t('Number of connections')"></el-table-column>
|
||||
<el-table-column prop="watches" :label="'watches'+$t('Number')"></el-table-column>
|
||||
<el-table-column prop="sent" :label="$t('Sent')"></el-table-column>
|
||||
<el-table-column prop="received" :label="$t('Received')"></el-table-column>
|
||||
<el-table-column prop="mode" label="leader/follower"></el-table-column>
|
||||
<el-table-column prop="minLatency" :label="$t('Min latency')"></el-table-column>
|
||||
<el-table-column prop="avgLatency" :label="$t('Avg latency')"></el-table-column>
|
||||
<el-table-column prop="maxLatency" :label="$t('Max latency')"></el-table-column>
|
||||
<el-table-column prop="nodeCount" :label="$t('Node count')"></el-table-column>
|
||||
<el-table-column :label="$t('Query time')" min-width="130">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.date | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Node self-test status')" min-width="90">
|
||||
<template slot-scope="scope">
|
||||
<span class="state">
|
||||
<em class="ans-icon-success-solid success" v-if="item.state"></em>
|
||||
<em class="ans-icon-fail-solid error" v-else></em>
|
||||
<em class="el-icon-success success" v-if="scope.row.state"></em>
|
||||
<em class="el-icon-error error" v-else></em>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -48,9 +48,3 @@
|
|||
components: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" rel="stylesheet/scss">
|
||||
.apiserver-model {
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -30,8 +30,8 @@
|
|||
</div>
|
||||
<div class="value-p">
|
||||
<span class="state">
|
||||
<em class="ans-icon-success-solid success" v-if="item.state"></em>
|
||||
<em class="ans-icon-fail-solid error" v-else></em>
|
||||
<em class="el-icon-success success" v-if="item.state"></em>
|
||||
<em class="el-icon-error error" v-else></em>
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-1">{{$t('Health status')}}</div>
|
||||
|
|
@ -59,19 +59,6 @@
|
|||
<div class="text-1">{{$t('Threads connections')}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-md-2">
|
||||
<div class="text-num-model text">
|
||||
<div class="title">
|
||||
<span>{{$t('Max used connections')}}</span>
|
||||
</div>
|
||||
<div class="value-p">
|
||||
<strong :style="{color:color[2]}">{{item.maxUsedConnections}}</strong>
|
||||
</div>
|
||||
<div class="text-1">
|
||||
{{$t('Max used connections')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
<div class="col-md-3">
|
||||
<div class="text-num-model text">
|
||||
<div class="title">
|
||||
|
|
|
|||
|
|
@ -57,6 +57,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-drawer
|
||||
:visible.sync="drawer"
|
||||
:with-header="false">
|
||||
<zookeeper-directories-popup :zkDirectories = zkDirectories></zookeeper-directories-popup>
|
||||
</el-drawer>
|
||||
<div v-if="!workerList.length">
|
||||
<m-no-data></m-no-data>
|
||||
</div>
|
||||
|
|
@ -81,29 +86,21 @@
|
|||
return {
|
||||
isLoading: false,
|
||||
workerList: [],
|
||||
color: themeData.color
|
||||
color: themeData.color,
|
||||
drawer: false,
|
||||
zkDirectories: []
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
methods: {
|
||||
...mapActions('monitor', ['getWorkerData']),
|
||||
_showZkDirectories (item) {
|
||||
let zkDirectories = []
|
||||
item.zkDirectories.forEach(zkDirectory => {
|
||||
zkDirectories.push({
|
||||
this.zkDirectories.push({
|
||||
zkDirectory: zkDirectory
|
||||
})
|
||||
})
|
||||
this.$drawer({
|
||||
direction: 'right',
|
||||
render (h) {
|
||||
return h(zookeeperDirectoriesPopup, {
|
||||
props: {
|
||||
zkDirectories: zkDirectories
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.drawer = true
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
|
|
|
|||
|
|
@ -18,47 +18,39 @@
|
|||
<m-conditions>
|
||||
<template slot="search-group">
|
||||
<div class="list">
|
||||
<x-button type="ghost" size="small" @click="_ckQuery" icon="ans-icon-search"></x-button>
|
||||
<el-button type="primary" size="small" @click="_ckQuery" icon="el-icon-search"></el-button>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-datepicker
|
||||
ref="datepicker"
|
||||
@on-change="_onChangeStartStop"
|
||||
type="daterange"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
placement="bottom-end"
|
||||
:value="[searchParams.startDate,searchParams.endDate]"
|
||||
:panelNum="2">
|
||||
<x-input slot="input" readonly slot-scope="{value}" :value="value" style="width: 310px;" size="small" :placeholder="$t('Select date range')">
|
||||
<em slot="suffix"
|
||||
@click.stop="_dateEmpty()"
|
||||
class="ans-icon-fail-solid"
|
||||
v-show="value"
|
||||
style="font-size: 13px;cursor: pointer;margin-top: 1px;">
|
||||
</em>
|
||||
</x-input>
|
||||
</x-datepicker>
|
||||
<el-date-picker
|
||||
style="width: 310px"
|
||||
v-model="dataTime"
|
||||
size="mini"
|
||||
@change="_onChangeStartStop"
|
||||
type="datetimerange"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('startDate')"
|
||||
:end-placeholder="$t('endDate')"
|
||||
value-format="yyyy-MM-dd HH:mm:ss">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-select style="width: 160px;" @on-change="_onChangeState" :value="searchParams.stateType" >
|
||||
<x-input slot="trigger" readonly :value="selectedModel ? selectedModel.label : ''" slot-scope="{ selectedModel }" style="width: 160px;" size="small" :placeholder="$t('State')" suffix-icon="ans-icon-arrow-down">
|
||||
</x-input>
|
||||
<x-option
|
||||
<el-select style="width: 140px;" @change="_onChangeState" :value="searchParams.stateType" :placeholder="$t('State')" size="mini">
|
||||
<el-option
|
||||
v-for="city in stateTypeList"
|
||||
:key="city.label"
|
||||
:value="city.code"
|
||||
:label="city.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model.trim="searchParams.host" @on-enterkey="_ckQuery" style="width: 140px;" size="small" :placeholder="$t('host')"></x-input>
|
||||
<el-input v-model="searchParams.host" @keyup.enter.native="_ckQuery" style="width: 140px;" size="mini" :placeholder="$t('host')"></el-input>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model.trim="searchParams.executorName" @on-enterkey="_ckQuery" style="width: 140px;" size="small" :placeholder="$t('Executor')"></x-input>
|
||||
<el-input v-model="searchParams.executorName" @keyup.enter.native="_ckQuery" style="width: 140px;" size="mini" :placeholder="$t('Executor')"></el-input>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model.trim="searchParams.searchVal" @on-enterkey="_ckQuery" style="width: 200px;" size="small" :placeholder="$t('name')"></x-input>
|
||||
<el-input v-model="searchParams.searchVal" @keyup.enter.native="_ckQuery" style="width: 200px;" size="mini" :placeholder="$t('name')"></el-input>
|
||||
</div>
|
||||
</template>
|
||||
</m-conditions>
|
||||
|
|
@ -86,7 +78,8 @@
|
|||
host: '',
|
||||
// executor name
|
||||
executorName: ''
|
||||
}
|
||||
},
|
||||
dataTime: []
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
|
|
@ -100,21 +93,15 @@
|
|||
_onChangeStartStop (val) {
|
||||
this.searchParams.startDate = val[0]
|
||||
this.searchParams.endDate = val[1]
|
||||
this.dataTime[0] = val[0]
|
||||
this.dataTime[1]= val[1]
|
||||
},
|
||||
/**
|
||||
* change state
|
||||
*/
|
||||
_onChangeState (val) {
|
||||
this.searchParams.stateType = val.value
|
||||
this.searchParams.stateType = val
|
||||
},
|
||||
/**
|
||||
* empty date
|
||||
*/
|
||||
_dateEmpty () {
|
||||
this.searchParams.startDate = ''
|
||||
this.searchParams.endDate = ''
|
||||
this.$refs.datepicker.empty()
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
},
|
||||
|
|
|
|||
|
|
@ -18,50 +18,42 @@
|
|||
<m-conditions>
|
||||
<template slot="search-group">
|
||||
<div class="list">
|
||||
<x-button type="ghost" size="small" @click="_ckQuery" icon="ans-icon-search"></x-button>
|
||||
<el-button size="mini" @click="_ckQuery" icon="el-icon-search"></el-button>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-datepicker
|
||||
ref="datepicker"
|
||||
@on-change="_onChangeStartStop"
|
||||
type="daterange"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
placement="bottom-end"
|
||||
:value="[searchParams.startDate,searchParams.endDate]"
|
||||
:panelNum="2">
|
||||
<x-input slot="input" readonly slot-scope="{value}" :value="value" style="width: 310px;" size="small" :placeholder="$t('Select date range')">
|
||||
<em slot="suffix"
|
||||
@click.stop="_dateEmpty()"
|
||||
class="ans-icon-fail-solid"
|
||||
v-show="value"
|
||||
style="font-size: 13px;cursor: pointer;margin-top: 1px;">
|
||||
</em>
|
||||
</x-input>
|
||||
</x-datepicker>
|
||||
<el-date-picker
|
||||
style="width: 310px"
|
||||
v-model="dataTime"
|
||||
size="mini"
|
||||
@change="_onChangeStartStop"
|
||||
type="datetimerange"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('startDate')"
|
||||
:end-placeholder="$t('endDate')"
|
||||
value-format="yyyy-MM-dd HH:mm:ss">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-select style="width: 140px;" @on-change="_onChangeState" :value="searchParams.stateType" >
|
||||
<x-input slot="trigger" readonly :value="selectedModel ? selectedModel.label : ''" slot-scope="{ selectedModel }" style="width: 140px;" size="small" :placeholder="$t('State')" suffix-icon="ans-icon-arrow-down">
|
||||
</x-input>
|
||||
<x-option
|
||||
<el-select style="width: 140px;" @change="_onChangeState" :value="searchParams.stateType" :placeholder="$t('State')" size="mini">
|
||||
<el-option
|
||||
v-for="city in stateTypeList"
|
||||
:key="city.label"
|
||||
:value="city.code"
|
||||
:label="city.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model.trim="searchParams.host" @on-enterkey="_ckQuery" style="width: 140px;" size="small" :placeholder="$t('host')"></x-input>
|
||||
<el-input v-model="searchParams.host" @keyup.enter.native="_ckQuery" style="width: 140px;" size="mini" :placeholder="$t('host')"></el-input>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model.trim="searchParams.executorName" @on-enterkey="_ckQuery" style="width: 140px;" size="small" :placeholder="$t('Executor')"></x-input>
|
||||
<el-input v-model="searchParams.executorName" @keyup.enter.native="_ckQuery" style="width: 140px;" size="mini" :placeholder="$t('Executor')"></el-input>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model.trim="searchParams.processInstanceName" @on-enterkey="_ckQuery" style="width: 160px;" size="small" :placeholder="$t('Process Instance')"></x-input>
|
||||
<el-input v-model="searchParams.processInstanceName" @keyup.enter.native="_ckQuery" style="width: 160px;" size="mini" :placeholder="$t('Process Instance')"></el-input>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model.trim="searchParams.searchVal" @on-enterkey="_ckQuery" style="width: 160px;" size="small" :placeholder="$t('name')"></x-input>
|
||||
<el-input v-model="searchParams.searchVal" @keyup.enter.native="_ckQuery" style="width: 160px;" size="mini" :placeholder="$t('name')"></el-input>
|
||||
</div>
|
||||
</template>
|
||||
</m-conditions>
|
||||
|
|
@ -90,7 +82,8 @@
|
|||
// executor name
|
||||
executorName: '',
|
||||
processInstanceName: ''
|
||||
}
|
||||
},
|
||||
dataTime: [],
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
|
|
@ -104,21 +97,15 @@
|
|||
_onChangeStartStop (val) {
|
||||
this.searchParams.startDate = val[0]
|
||||
this.searchParams.endDate = val[1]
|
||||
this.dataTime[0] = val[0]
|
||||
this.dataTime[1]= val[1]
|
||||
},
|
||||
/**
|
||||
* change state
|
||||
*/
|
||||
_onChangeState (val) {
|
||||
this.searchParams.stateType = val.value
|
||||
this.searchParams.stateType = val
|
||||
},
|
||||
/**
|
||||
* empty date
|
||||
*/
|
||||
_dateEmpty () {
|
||||
this.searchParams.startDate = ''
|
||||
this.searchParams.endDate = ''
|
||||
this.$refs.datepicker.empty()
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
},
|
||||
|
|
|
|||
|
|
@ -18,55 +18,48 @@
|
|||
<m-conditions>
|
||||
<template slot="search-group">
|
||||
<div class="list">
|
||||
<x-button type="ghost" size="small" @click="_ckQuery" icon="ans-icon-search"></x-button>
|
||||
<el-button type="ghost" size="mini" @click="_ckQuery" icon="el-icon-search"></el-button>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-datepicker
|
||||
:value="[searchParams.startDate,searchParams.endDate]"
|
||||
ref="datepicker"
|
||||
@on-change="_onChangeStartStop"
|
||||
type="daterange"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
placement="bottom-end"
|
||||
:panelNum="2">
|
||||
<x-input slot="input" readonly slot-scope="{value}" :value="value" style="width: 310px;" size="small" :placeholder="$t('Select date range')">
|
||||
<em slot="suffix"
|
||||
@click.stop="_dateEmpty()"
|
||||
class="ans-icon-fail-solid"
|
||||
v-show="value"
|
||||
style="font-size: 13px;cursor: pointer;margin-top: 1px;">
|
||||
</em>
|
||||
</x-input>
|
||||
</x-datepicker>
|
||||
<el-date-picker
|
||||
v-model="dataTime"
|
||||
type="datetimerange"
|
||||
size="mini"
|
||||
@change="_onChangeStartStop"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('startDate')"
|
||||
:end-placeholder="$t('endDate')"
|
||||
value-format="yyyy-MM-dd HH:mm:ss">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model="searchParams.destTable" style="width: 120px;" size="small" :placeholder="$t('Target Table')"></x-input>
|
||||
<el-input v-model="searchParams.destTable" style="width: 120px;" size="mini" :placeholder="$t('Target Table')"></el-input>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model="searchParams.sourceTable" style="width: 120px;" size="small" :placeholder="$t('Source Table')"></x-input>
|
||||
<el-input v-model="searchParams.sourceTable" style="width: 120px;" size="mini" :placeholder="$t('Source Table')"></el-input>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-select style="width: 90px;" @on-change="_onChangeState" :value="searchParams.state">
|
||||
<x-input slot="trigger" readonly :value="selectedModel ? selectedModel.label : ''" slot-scope="{ selectedModel }" style="width: 90px;" size="small" :placeholder="$t('State')" suffix-icon="ans-icon-arrow-down"></x-input>
|
||||
<x-option
|
||||
<el-select style="width: 90px;" @change="_onChangeState" :value="searchParams.state" :placeholder="$t('State')" size="mini">
|
||||
<el-option
|
||||
v-for="city in stateList"
|
||||
:key="city.label"
|
||||
:value="city.code"
|
||||
:label="city.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-datepicker
|
||||
v-model="searchParams.taskDate"
|
||||
@on-change="_onChangeDate"
|
||||
format="YYYY-MM-DD"
|
||||
:panelNum="1">
|
||||
<x-input slot="input" readonly slot-scope="{value}" style="width: 130px;" :value="value" size="small" :placeholder="$t('Date')"></x-input>
|
||||
</x-datepicker>
|
||||
<el-date-picker
|
||||
v-model="searchParams.taskDate"
|
||||
value-format="yyyy-MM-dd"
|
||||
size="mini"
|
||||
@change="_onChangeDate"
|
||||
type="date"
|
||||
:placeholder="$t('Date')">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="list">
|
||||
<x-input v-model="searchParams.taskName" style="width: 130px;" size="small" :placeholder="$t('Task Name')"></x-input>
|
||||
<el-input v-model="searchParams.taskName" style="width: 130px;" size="mini" :placeholder="$t('Task Name')"></el-input>
|
||||
</div>
|
||||
</template>
|
||||
</m-conditions>
|
||||
|
|
@ -111,7 +104,8 @@
|
|||
taskDate: '',
|
||||
startDate: '',
|
||||
endDate: ''
|
||||
}
|
||||
},
|
||||
dataTime: [],
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
|
|
@ -124,13 +118,13 @@
|
|||
*/
|
||||
_onChangeStartStop (val) {
|
||||
this.searchParams.startDate = val[0]
|
||||
this.searchParams.endDate = val[1]
|
||||
this.searchParams.endDate = val[1]
|
||||
},
|
||||
/**
|
||||
* change state
|
||||
*/
|
||||
_onChangeState (val) {
|
||||
this.searchParams.state = val.value
|
||||
this.searchParams.state = val
|
||||
},
|
||||
/**
|
||||
* empty date
|
||||
|
|
@ -141,7 +135,7 @@
|
|||
this.$refs.datepicker.empty()
|
||||
},
|
||||
_onChangeDate (val) {
|
||||
this.searchParams.taskDate = val.replace(/-/g, '')
|
||||
this.searchParams.taskDate = val
|
||||
}
|
||||
},
|
||||
created () {
|
||||
|
|
|
|||
|
|
@ -17,68 +17,40 @@
|
|||
<template>
|
||||
<div class="list-model">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th>
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Task Name')}}</span>
|
||||
</th>
|
||||
<th width="66">
|
||||
<span>{{$t('Task Date')}}</span>
|
||||
</th>
|
||||
<th width="150">
|
||||
<span>{{$t('Start Time')}}</span>
|
||||
</th>
|
||||
<th width="150">
|
||||
<span>{{$t('End Time')}}</span>
|
||||
</th>
|
||||
<th width="134">
|
||||
<span>{{$t('Duration')}}(s)</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Source Table')}}</span>
|
||||
</th>
|
||||
<th width="100">
|
||||
<span>{{$t('Record Number')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Target Table')}}</span>
|
||||
</th>
|
||||
<th width="100">
|
||||
<span>{{$t('Record Number')}}</span>
|
||||
</th>
|
||||
<th width="88">
|
||||
<span>{{$t('State')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="item.id">
|
||||
<td>
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="ellipsis" data-toggle="tooltip" data-container="body" :title="_rtTooltip(item.procName)" data-html="true">{{item.procName}}</span>
|
||||
</td>
|
||||
<td><span>{{item.procDate}}</span></td>
|
||||
<td>
|
||||
<span v-if="item.startTime">{{item.startTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.endTime">{{item.endTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td><span>{{item.duration}}</span></td>
|
||||
<td><span class="ellipsis" data-toggle="tooltip" data-container="body" :title="_rtTooltip(item.sourceTab)" data-html="true">{{item.sourceTab}}</span></td>
|
||||
<td>
|
||||
<span>{{item.sourceRowCount}}</span>
|
||||
</td>
|
||||
<td><span class="ellipsis" data-toggle="tooltip" data-container="body" :title="_rtTooltip(item.targetTab)" data-html="true">{{item.targetTab}}</span></td>
|
||||
<td><span>{{item.targetRowCount}}</span></td>
|
||||
<td><span>{{item.note}}</span></td>
|
||||
</tr>
|
||||
</table>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column :label="$t('Task Name')" min-width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-popover trigger="hover" placement="top">
|
||||
<p>{{ scope.row.procName }}</p>
|
||||
<div slot="reference" class="name-wrapper">
|
||||
{{ scope.row.procName }}
|
||||
</div>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Task Date')">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.procDate | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Start Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.startTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('End Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.endTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="description" :label="$t('Duration')+'(s)'"></el-table-column>
|
||||
<el-table-column prop="sourceTab" :label="$t('Source Table')"></el-table-column>
|
||||
<el-table-column prop="sourceRowCount" :label="$t('Record Number')"></el-table-column>
|
||||
<el-table-column prop="targetTab" :label="$t('Target Table')"></el-table-column>
|
||||
<el-table-column prop="targetRowCount" :label="$t('Record Number')"></el-table-column>
|
||||
<el-table-column prop="note" :label="$t('State')"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,16 @@
|
|||
<m-list :task-record-list="taskRecordList" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
|
||||
</m-list>
|
||||
<div class="page-box">
|
||||
<x-page :current="parseInt(searchParams.pageNo)" :total="total" show-elevator @on-change="_page"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="searchParams.pageSize"
|
||||
:current-page.sync="searchParams.pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!taskRecordList.length && total<=0">
|
||||
|
|
|
|||
|
|
@ -19,9 +19,9 @@
|
|||
<div class="clearfix input-element" :class="disabled ? 'disabled' : ''">
|
||||
<span class="tag-wrapper" v-for="(item,$index) in activeList" :key="$index" :class="activeIndex === $index ? 'active' : ''">
|
||||
<span class="tag-text">{{item}}</span>
|
||||
<em class="remove-tag ans-icon-close" @click.stop="_del($index)" v-if="!disabled"></em>
|
||||
<em class="remove-tag el-icon-close" @click.stop="_del($index)" v-if="!disabled"></em>
|
||||
</span>
|
||||
<x-poptip
|
||||
<el-popover
|
||||
placement="bottom-start"
|
||||
:append-to-body="true"
|
||||
:visible-arrow="false"
|
||||
|
|
@ -41,23 +41,23 @@
|
|||
<span class="label-wrapper" slot="reference" >
|
||||
<!--@keydown.tab="_emailTab"-->
|
||||
<input
|
||||
class="email-input"
|
||||
ref="emailInput"
|
||||
:style="{width:emailWidth + 'px'}"
|
||||
type="text"
|
||||
v-model="email"
|
||||
:disabled="disabled"
|
||||
:placeholder="$t('Please enter email')"
|
||||
@blur="_emailEnter"
|
||||
@keydown.tab="_emailTab"
|
||||
@keyup.delete="_emailDelete"
|
||||
@keyup.enter="_emailEnter"
|
||||
@keyup.space="_emailEnter"
|
||||
@keyup.186="_emailEnter"
|
||||
@keyup.up="_emailKeyup('up')"
|
||||
@keyup.down="_emailKeyup('down')">
|
||||
class="email-input"
|
||||
ref="emailInput"
|
||||
:style="{width:emailWidth + 'px'}"
|
||||
type="text"
|
||||
v-model="email"
|
||||
:disabled="disabled"
|
||||
:placeholder="$t('Please enter email')"
|
||||
@blur="_emailEnter"
|
||||
@keydown.tab="_emailTab"
|
||||
@keyup.delete="_emailDelete"
|
||||
@keyup.enter="_emailEnter"
|
||||
@keyup.space="_emailEnter"
|
||||
@keyup.186="_emailEnter"
|
||||
@keyup.up="_emailKeyup('up')"
|
||||
@keyup.down="_emailKeyup('down')">
|
||||
</span>
|
||||
</x-poptip>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -299,6 +299,8 @@
|
|||
<style lang="scss" rel="stylesheet/scss">
|
||||
.email-model {
|
||||
width: 100%;
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 5px;
|
||||
.input-element {
|
||||
min-height: 32px;
|
||||
padding: 1px 8px;
|
||||
|
|
|
|||
|
|
@ -17,129 +17,131 @@
|
|||
<template>
|
||||
<div class="list-model" style="position: relative;">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th scope="col" style="min-width: 50px">
|
||||
<x-checkbox @on-change="_topCheckBoxClick" v-model="checkAll"></x-checkbox>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 40px">
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 200px;max-width: 300px;">
|
||||
<span>{{$t('Process Name')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 50px">
|
||||
<span>{{$t('State')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('Create Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('Update Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 150px">
|
||||
<span>{{$t('Description')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 70px">
|
||||
<span>{{$t('Modify User')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 70px">
|
||||
<div style="width: 80px">
|
||||
<span>{{$t('Timing state')}}</span>
|
||||
</div>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 300px">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="item.id">
|
||||
<td width="50"><x-checkbox v-model="item.isCheck" :disabled="item.releaseState === 'ONLINE'" @on-change="_arrDelChange"></x-checkbox></td>
|
||||
<td width="50">
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td style="min-width: 200px;max-width: 300px;padding-right: 10px;">
|
||||
<span class="ellipsis">
|
||||
<router-link :to="{ path: '/projects/definition/list/' + item.id}" tag="a" class="links" :title="item.name">
|
||||
{{item.name}}
|
||||
</router-link>
|
||||
</span>
|
||||
</td>
|
||||
<td><span>{{_rtPublishStatus(item.releaseState)}}</span></td>
|
||||
<td>
|
||||
<span v-if="item.createTime">{{item.createTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.updateTime">{{item.updateTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.description" class="ellipsis" v-tooltip.large.top.start.light="{text: item.description, maxWidth: '500px'}">{{item.description}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.modifyBy">{{item.modifyBy}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.scheduleReleaseState === 'OFFLINE'">{{$t('offline')}}</span>
|
||||
<span v-if="item.scheduleReleaseState === 'ONLINE'">{{$t('online')}}</span>
|
||||
<span v-if="!item.scheduleReleaseState">-</span>
|
||||
</td>
|
||||
<td style="z-index: inherit;">
|
||||
<x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Edit')" @click="_edit(item)" :disabled="item.releaseState === 'ONLINE'" icon="ans-icon-edit"><!--{{$t('编辑')}}--></x-button>
|
||||
<x-button type="success" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Start')" @click="_start(item)" :disabled="item.releaseState !== 'ONLINE'" icon="ans-icon-play"><!--{{$t('启动')}}--></x-button>
|
||||
<x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Timing')" @click="_timing(item)" :disabled="item.releaseState !== 'ONLINE' || item.scheduleReleaseState !== null" icon="ans-icon-timer"><!--{{$t('定时')}}--></x-button>
|
||||
<x-button type="warning" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('online')" @click="_poponline(item)" v-if="item.releaseState === 'OFFLINE'" icon="ans-icon-upward"><!--{{$t('下线')}}--></x-button>
|
||||
<x-button type="error" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('offline')" @click="_downline(item)" v-if="item.releaseState === 'ONLINE'" icon="ans-icon-downward"><!--{{$t('上线')}}--></x-button>
|
||||
<x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Copy Workflow')" @click="_copyProcess(item)" :disabled="item.releaseState === 'ONLINE'" icon="ans-icon-copy"><!--{{$t('复制')}}--></x-button>
|
||||
<x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Cron Manage')" @click="_timingManage(item)" :disabled="item.releaseState !== 'ONLINE'" icon="ans-icon-datetime"><!--{{$t('定时管理')}}--></x-button>
|
||||
<x-poptip
|
||||
:ref="'poptip-delete-' + $index"
|
||||
placement="bottom-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
|
||||
<el-table :data="list" size="mini" style="width: 100%" @selection-change="_arrDelChange">
|
||||
<el-table-column type="selection" width="50" :selectable="selectable"></el-table-column>
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column :label="$t('Process Name')" min-width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-popover trigger="hover" placement="top">
|
||||
<p>{{ scope.row.name }}</p>
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<router-link :to="{ path: '/projects/definition/list/' + scope.row.id}" tag="a" class="links" :title="scope.row.name">
|
||||
{{scope.row.name}}
|
||||
</router-link>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
icon="ans-icon-trash"
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
:disabled="item.releaseState === 'ONLINE'"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('delete')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
<x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('TreeView')" @click="_treeView(item)" icon="ans-icon-node"><!--{{$t('树形图')}}--></x-button>
|
||||
<x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Export')" @click="_export(item)" icon="ans-icon-download"><!--{{$t('导出')}}--></x-button>
|
||||
<x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Version Info')" @click="_version(item)" :disabled="item.releaseState === 'ONLINE'" icon="ans-icon-dependence"><!--{{$t('版本信息')}}--></x-button>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('State')">
|
||||
<template slot-scope="scope">
|
||||
{{_rtPublishStatus(scope.row.releaseState)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Create Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.createTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Update Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.updateTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="description" :label="$t('Description')"></el-table-column>
|
||||
<el-table-column prop="modifyBy" :label="$t('Modify User')"></el-table-column>
|
||||
<el-table-column :label="$t('Timing state')">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.scheduleReleaseState === 'OFFLINE'">{{$t('offline')}}</span>
|
||||
<span v-if="scope.row.scheduleReleaseState === 'ONLINE'">{{$t('online')}}</span>
|
||||
<span v-if="!scope.row.scheduleReleaseState">-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="335" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip :content="$t('Edit')" placement="top" :enterable="false">
|
||||
<el-button type="primary" size="mini" icon="el-icon-edit-outline" :disabled="scope.row.releaseState === 'ONLINE'" @click="_edit(scope.row)" circle></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Start')" placement="top" :enterable="false">
|
||||
<span><el-button type="success" size="mini" :disabled="scope.row.releaseState !== 'ONLINE'" icon="el-icon-video-play" @click="_start(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Timing')" placement="top" :enterable="false">
|
||||
<el-button type="primary" size="mini" icon="el-icon-time" :disabled="scope.row.releaseState !== 'ONLINE' || scope.row.scheduleReleaseState !== null" @click="_timing(scope.row)" circle></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('online')" placement="top" :enterable="false">
|
||||
<span><el-button type="warning" size="mini" v-if="scope.row.releaseState === 'OFFLINE'" icon="el-icon-upload2" @click="_poponline(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('offline')" placement="top" :enterable="false">
|
||||
<el-button type="danger" size="mini" icon="el-icon-download" v-if="scope.row.releaseState === 'ONLINE'" @click="_downline(scope.row)" circle></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Copy Workflow')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" :disabled="scope.row.releaseState === 'ONLINE'" icon="el-icon-document-copy" @click="_copyProcess(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Cron Manage')" placement="top" :enterable="false">
|
||||
<el-button type="primary" size="mini" icon="el-icon-date" :disabled="scope.row.releaseState !== 'ONLINE'" @click="_timingManage(scope.row)" circle></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top" :enterable="false">
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle></el-button>
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete(scope.row,scope.row.id)"
|
||||
>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" :disabled="scope.row.releaseState === 'ONLINE'" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('TreeView')" placement="top" :enterable="false">
|
||||
<el-button type="primary" size="mini" icon="el-icon-s-data" @click="_treeView(scope.row)" circle></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Export')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-s-unfold" @click="_export(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Version Info')" placement="top" :enterable="false">
|
||||
<el-button type="primary" size="mini" icon="el-icon-info" :disabled="scope.row.releaseState === 'ONLINE'" @click="_version(scope.row)" circle></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<x-poptip
|
||||
ref="poptipDeleteAll"
|
||||
placement="bottom-start"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete(-1)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete({},-1)">{{$t('Confirm')}}</x-button>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button size="xsmall" :disabled="!strSelectIds" style="position: absolute; bottom: -48px; left: 22px;" >{{$t('Delete')}}</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
<x-button size="xsmall" :disabled="!strSelectIds" style="position: absolute; bottom: -48px; left: 80px;" @click="_batchExport(item)" >{{$t('Export')}}</x-button>
|
||||
<x-button size="xsmall" :disabled="!strSelectIds" style="position: absolute; bottom: -48px; left: 140px;" @click="_batchCopy(item)" >{{$t('Batch copy')}}</x-button>
|
||||
<x-button size="xsmall" :disabled="!strSelectIds" style="position: absolute; bottom: -48px; left: 225px;" @click="_batchMove(item)" >{{$t('Batch move')}}</x-button>
|
||||
|
||||
<el-tooltip :content="$t('delete')" placement="top">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete({},-1)"
|
||||
>
|
||||
<el-button style="position: absolute; bottom: -48px; left: 19px;" type="primary" size="mini" :disabled="!strSelectIds" slot="reference">{{$t('Delete')}}</el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
<el-button type="primary" size="mini" :disabled="!strSelectIds" style="position: absolute; bottom: -48px; left: 80px;" @click="_batchExport(item)" >{{$t('Export')}}</el-button>
|
||||
<span><el-button type="primary" size="mini" :disabled="!strSelectIds" style="position: absolute; bottom: -48px; left: 140px;" @click="_batchCopy(item)" >{{$t('Batch copy')}}</el-button></span>
|
||||
<el-button type="primary" size="mini" :disabled="!strSelectIds" style="position: absolute; bottom: -48px; left: 225px;" @click="_batchMove(item)" >{{$t('Batch move')}}</el-button>
|
||||
<el-drawer
|
||||
:visible.sync="drawer"
|
||||
size="35%"
|
||||
:with-header="false">
|
||||
<m-versions :versionData = versionData @mVersionSwitchProcessDefinitionVersion="mVersionSwitchProcessDefinitionVersion" @mVersionGetProcessDefinitionVersionsPage="mVersionGetProcessDefinitionVersionsPage" @mVersionDeleteProcessDefinitionVersion="mVersionDeleteProcessDefinitionVersion"></m-versions>
|
||||
</el-drawer>
|
||||
<el-dialog
|
||||
:title="$t('Please set the parameters before starting')"
|
||||
:visible.sync="startDialog"
|
||||
width="65%">
|
||||
<m-start :startData= "startData" @onUpdateStart="onUpdateStart" @closeStart="closeStart"></m-start>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
:title="$t('Set parameters before timing')"
|
||||
:visible.sync="timingDialog"
|
||||
width="65%">
|
||||
<m-timing :timingData="timingData" @onUpdateTiming="onUpdateTiming" @closeTiming="closeTiming"></m-timing>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="relatedItemsDialog"
|
||||
width="30%">
|
||||
<m-related-items :tmp="tmp" @onBatchCopy="onBatchCopy" @onBatchMove="onBatchMove" @closeRelatedItems="closeRelatedItems"></m-related-items>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -157,7 +159,26 @@
|
|||
return {
|
||||
list: [],
|
||||
strSelectIds: '',
|
||||
checkAll: false
|
||||
checkAll: false,
|
||||
drawer: false,
|
||||
versionData: {
|
||||
processDefinition: {},
|
||||
processDefinitionVersions: [],
|
||||
total: null,
|
||||
pageNo: null,
|
||||
pageSize: null
|
||||
},
|
||||
startDialog: false,
|
||||
startData: {},
|
||||
timingDialog: false,
|
||||
timingData: {
|
||||
item: {},
|
||||
receiversD: [],
|
||||
receiversCcD: [],
|
||||
type: ''
|
||||
},
|
||||
relatedItemsDialog: false,
|
||||
tmp: false
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
@ -168,6 +189,14 @@
|
|||
methods: {
|
||||
...mapActions('dag', ['editProcessState', 'getStartCheck', 'getReceiver', 'deleteDefinition', 'batchDeleteDefinition', 'exportDefinition', 'getProcessDefinitionVersionsPage', 'copyProcess', 'switchProcessDefinitionVersion', 'deleteProcessDefinitionVersion', 'moveProcess']),
|
||||
...mapActions('security', ['getWorkerGroupsAll']),
|
||||
|
||||
selectable(row,index) {
|
||||
if(row.releaseState === 'ONLINE') {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
},
|
||||
_rtPublishStatus (code) {
|
||||
return _.filter(publishStatus, v => v.code === code)[0].desc
|
||||
},
|
||||
|
|
@ -180,34 +209,19 @@
|
|||
_start (item) {
|
||||
this.getWorkerGroupsAll()
|
||||
this.getStartCheck({ processDefinitionId: item.id }).then(res => {
|
||||
let self = this
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mStart, {
|
||||
on: {
|
||||
onUpdate () {
|
||||
self._onUpdate()
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: item
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.startData = item
|
||||
this.startDialog = true
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
onUpdateStart () {
|
||||
this._onUpdate()
|
||||
this.startDialog = false
|
||||
},
|
||||
closeStart () {
|
||||
this.startDialog = false
|
||||
},
|
||||
/**
|
||||
* get emial
|
||||
*/
|
||||
|
|
@ -227,52 +241,26 @@
|
|||
_timing (item) {
|
||||
let self = this
|
||||
this._getReceiver(item.id).then(res => {
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mTiming, {
|
||||
on: {
|
||||
onUpdate () {
|
||||
self._onUpdate()
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: item,
|
||||
receiversD: res.receivers,
|
||||
receiversCcD: res.receiversCc,
|
||||
type: 'timing'
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.timingData.item = item,
|
||||
this.timingData.receiversD = res.receivers,
|
||||
this.timingData.receiversCcD = res.receiversCc,
|
||||
this.timingData.type = 'timing'
|
||||
this.timingDialog = true
|
||||
})
|
||||
},
|
||||
onUpdateTiming () {
|
||||
this._onUpdate()
|
||||
this.timingDialog = false
|
||||
},
|
||||
closeTiming () {
|
||||
this.timingDialog = false
|
||||
},
|
||||
/**
|
||||
* Timing manage
|
||||
*/
|
||||
_timingManage (item) {
|
||||
this.$router.push({ path: `/projects/definition/list/timing/${item.id}` })
|
||||
},
|
||||
/**
|
||||
* Close the delete layer
|
||||
*/
|
||||
_closeDelete (i) {
|
||||
// close batch
|
||||
if (i < 0) {
|
||||
this.$refs['poptipDeleteAll'].doClose()
|
||||
return
|
||||
}
|
||||
// close one
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
},
|
||||
/**
|
||||
* delete
|
||||
*/
|
||||
|
|
@ -286,11 +274,9 @@
|
|||
this.deleteDefinition({
|
||||
processDefinitionId: item.id
|
||||
}).then(res => {
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
this._onUpdate()
|
||||
this.$message.success(res.msg)
|
||||
}).catch(e => {
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
|
@ -328,7 +314,7 @@
|
|||
}).then(res => {
|
||||
this.strSelectIds = ''
|
||||
this.$message.success(res.msg)
|
||||
$('body').find('.tooltip.fade.top.in').remove()
|
||||
// $('body').find('.tooltip.fade.top.in').remove()
|
||||
this._onUpdate()
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg || '')
|
||||
|
|
@ -360,7 +346,69 @@
|
|||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* switch version in process definition version list
|
||||
*
|
||||
* @param version the version user want to change
|
||||
* @param processDefinitionId the process definition id
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionSwitchProcessDefinitionVersion({ version, processDefinitionId, fromThis }) {
|
||||
this.switchProcessDefinitionVersion({
|
||||
version: version,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res=>{
|
||||
this.$message.success($t('Switch Version Successfully'))
|
||||
this.$router.push({ path: `/projects/definition/list/${processDefinitionId}` })
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
/**
|
||||
* Paging event of process definition versions
|
||||
*
|
||||
* @param pageNo page number
|
||||
* @param pageSize page size
|
||||
* @param processDefinitionId the process definition id of page version
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionGetProcessDefinitionVersionsPage({ pageNo, pageSize, processDefinitionId, fromThis }) {
|
||||
this.getProcessDefinitionVersionsPage({
|
||||
pageNo: pageNo,
|
||||
pageSize: pageSize,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res=>{
|
||||
this.versionData.processDefinitionVersions = res.data.lists
|
||||
this.versionData.total = res.data.totalCount
|
||||
this.versionData.pageSize = res.data.pageSize
|
||||
this.versionData.pageNo = res.data.currentPage
|
||||
}).catch(e=>{
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
/**
|
||||
* delete one version of process definition
|
||||
*
|
||||
* @param version the version need to delete
|
||||
* @param processDefinitionId the process definition id user want to delete
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionDeleteProcessDefinitionVersion({ version, processDefinitionId, fromThis }) {
|
||||
this.deleteProcessDefinitionVersion({
|
||||
version: version,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res=>{
|
||||
this.$message.success(res.msg || '')
|
||||
this.mVersionGetProcessDefinitionVersionsPage({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
processDefinitionId: processDefinitionId,
|
||||
fromThis: fromThis
|
||||
})
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
_version (item) {
|
||||
let self = this
|
||||
this.getProcessDefinitionVersionsPage({
|
||||
|
|
@ -372,109 +420,14 @@
|
|||
let total = res.data.totalCount
|
||||
let pageSize = res.data.pageSize
|
||||
let pageNo = res.data.currentPage
|
||||
if (this.versionsModel) {
|
||||
this.versionsModel.remove()
|
||||
}
|
||||
this.versionsModel = this.$drawer({
|
||||
direction: 'right',
|
||||
closable: true,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
render (h) {
|
||||
return h(mVersions, {
|
||||
on: {
|
||||
/**
|
||||
* switch version in process definition version list
|
||||
*
|
||||
* @param version the version user want to change
|
||||
* @param processDefinitionId the process definition id
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionSwitchProcessDefinitionVersion ({ version, processDefinitionId, fromThis }) {
|
||||
self.switchProcessDefinitionVersion({
|
||||
version: version,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res => {
|
||||
self.$message.success($t('Switch Version Successfully'))
|
||||
setTimeout(() => {
|
||||
fromThis.$destroy()
|
||||
self.versionsModel.remove()
|
||||
}, 0)
|
||||
self.$router.push({ path: `/projects/definition/list/${processDefinitionId}` })
|
||||
}).catch(e => {
|
||||
self.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
this.versionData.processDefinition = item,
|
||||
this.versionData.processDefinitionVersions = processDefinitionVersions,
|
||||
this.versionData.total = total,
|
||||
this.versionData.pageNo = pageNo,
|
||||
this.versionData.pageSize = pageSize
|
||||
this.drawer = true
|
||||
|
||||
/**
|
||||
* Paging event of process definition versions
|
||||
*
|
||||
* @param pageNo page number
|
||||
* @param pageSize page size
|
||||
* @param processDefinitionId the process definition id of page version
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionGetProcessDefinitionVersionsPage ({ pageNo, pageSize, processDefinitionId, fromThis }) {
|
||||
self.getProcessDefinitionVersionsPage({
|
||||
pageNo: pageNo,
|
||||
pageSize: pageSize,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res => {
|
||||
fromThis.processDefinitionVersions = res.data.lists
|
||||
fromThis.total = res.data.totalCount
|
||||
fromThis.pageSize = res.data.pageSize
|
||||
fromThis.pageNo = res.data.currentPage
|
||||
}).catch(e => {
|
||||
self.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* delete one version of process definition
|
||||
*
|
||||
* @param version the version need to delete
|
||||
* @param processDefinitionId the process definition id user want to delete
|
||||
* @param fromThis fromThis
|
||||
*/
|
||||
mVersionDeleteProcessDefinitionVersion ({ version, processDefinitionId, fromThis }) {
|
||||
self.deleteProcessDefinitionVersion({
|
||||
version: version,
|
||||
processDefinitionId: processDefinitionId
|
||||
}).then(res => {
|
||||
self.$message.success(res.msg || '')
|
||||
fromThis.$emit('mVersionGetProcessDefinitionVersionsPage', {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
processDefinitionId: processDefinitionId,
|
||||
fromThis: fromThis
|
||||
})
|
||||
}).catch(e => {
|
||||
self.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* remove this drawer
|
||||
*
|
||||
* @param fromThis
|
||||
*/
|
||||
close ({ fromThis }) {
|
||||
setTimeout(() => {
|
||||
fromThis.$destroy()
|
||||
self.versionsModel.remove()
|
||||
}, 0)
|
||||
}
|
||||
},
|
||||
props: {
|
||||
processDefinition: item,
|
||||
processDefinitionVersions: processDefinitionVersions,
|
||||
total: total,
|
||||
pageNo: pageNo,
|
||||
pageSize: pageSize
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
|
|
@ -498,59 +451,26 @@
|
|||
* Batch Copy
|
||||
*/
|
||||
_batchCopy () {
|
||||
let self = this
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mRelatedItems, {
|
||||
on: {
|
||||
onBatchCopy (item) {
|
||||
self._copyProcess({id: self.strSelectIds,projectId: item})
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
tmp: false
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.relatedItemsDialog= true
|
||||
this.tmp = false
|
||||
},
|
||||
onBatchCopy (item) {
|
||||
this._copyProcess({id: this.strSelectIds,projectId: item})
|
||||
this.relatedItemsDialog = false
|
||||
},
|
||||
closeRelatedItems () {
|
||||
this.relatedItemsDialog = false
|
||||
},
|
||||
/**
|
||||
* _batchMove
|
||||
*/
|
||||
_batchMove() {
|
||||
let self = this
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mRelatedItems, {
|
||||
on: {
|
||||
onBatchMove (item) {
|
||||
self._moveProcess({id: self.strSelectIds,projectId: item})
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
tmp: true
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.tmp = true
|
||||
this.relatedItemsDialog = true
|
||||
},
|
||||
onBatchMove (item) {
|
||||
this._moveProcess({id: this.strSelectIds,projectId: item})
|
||||
this.relatedItemsDialog = false
|
||||
},
|
||||
/**
|
||||
* Edit state
|
||||
|
|
@ -567,33 +487,18 @@
|
|||
_onUpdate () {
|
||||
this.$emit('on-update')
|
||||
},
|
||||
/**
|
||||
* click the select-all checkbox
|
||||
*/
|
||||
_topCheckBoxClick (is) {
|
||||
_.map(this.list , v => v.isCheck = v.releaseState === 'ONLINE' ? false : is)
|
||||
this._arrDelChange()
|
||||
},
|
||||
/**
|
||||
* the array that to be delete
|
||||
*/
|
||||
_arrDelChange (v) {
|
||||
let arr = []
|
||||
this.list.forEach((item)=>{
|
||||
if (item.isCheck) {
|
||||
arr.push(item.id)
|
||||
}
|
||||
})
|
||||
arr = _.map(v, 'id');
|
||||
this.strSelectIds = _.join(arr, ',')
|
||||
if (v === false) {
|
||||
this.checkAll = false
|
||||
}
|
||||
},
|
||||
/**
|
||||
* batch delete
|
||||
*/
|
||||
_batchDelete () {
|
||||
this.$refs['poptipDeleteAll'].doClose()
|
||||
this.batchDeleteDefinition({
|
||||
processDefinitionIds: this.strSelectIds
|
||||
}).then(res => {
|
||||
|
|
@ -628,6 +533,6 @@
|
|||
},
|
||||
mounted () {
|
||||
},
|
||||
components: { mVersions }
|
||||
components: { mVersions, mStart, mTiming, mRelatedItems }
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -25,14 +25,14 @@
|
|||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Project Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-select v-model="itemId">
|
||||
<x-option
|
||||
<el-select v-model="itemId" size="small">
|
||||
<el-option
|
||||
v-for="item in itemList"
|
||||
:key="item.id"
|
||||
:value="item.id"
|
||||
:label="item.name">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
</div>
|
||||
|
|
@ -62,9 +62,9 @@
|
|||
_ok () {
|
||||
if(this._verification()) {
|
||||
if(this.tmp) {
|
||||
this.$emit('onBatchMove',this.itemId)
|
||||
this.$emit('onBatchMove',this.itemId)
|
||||
} else {
|
||||
this.$emit('onBatchCopy',this.itemId)
|
||||
this.$emit('onBatchCopy',this.itemId)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -16,9 +16,6 @@
|
|||
*/
|
||||
<template>
|
||||
<div class="start-process-model">
|
||||
<div class="title-box">
|
||||
<span>{{$t('Please set the parameters before starting')}}</span>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
<div class="text">
|
||||
{{$t('Process Name')}}
|
||||
|
|
@ -30,10 +27,10 @@
|
|||
{{$t('Failure Strategy')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-radio-group v-model="failureStrategy" style="margin-top: 7px;">
|
||||
<x-radio :label="'CONTINUE'">{{$t('Continue')}}</x-radio>
|
||||
<x-radio :label="'END'">{{$t('End')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="failureStrategy" style="margin-top: 7px;" size="small">
|
||||
<el-radio :label="'CONTINUE'">{{$t('Continue')}}</el-radio>
|
||||
<el-radio :label="'END'">{{$t('End')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list" v-if="sourceType === 'contextmenu'" style="margin-top: -8px;">
|
||||
|
|
@ -41,11 +38,11 @@
|
|||
{{$t('Node execution')}}
|
||||
</div>
|
||||
<div class="cont" style="padding-top: 6px;">
|
||||
<x-radio-group v-model="taskDependType">
|
||||
<x-radio :label="'TASK_POST'">{{$t('Backward execution')}}</x-radio>
|
||||
<x-radio :label="'TASK_PRE'">{{$t('Forward execution')}}</x-radio>
|
||||
<x-radio :label="'TASK_ONLY'">{{$t('Execute only the current node')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="taskDependType" size="small">
|
||||
<el-radio :label="'TASK_POST'">{{$t('Backward execution')}}</el-radio>
|
||||
<el-radio :label="'TASK_PRE'">{{$t('Forward execution')}}</el-radio>
|
||||
<el-radio :label="'TASK_ONLY'">{{$t('Execute only the current node')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
|
|
@ -53,14 +50,14 @@
|
|||
{{$t('Notification strategy')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-select style="width: 200px;" v-model="warningType">
|
||||
<x-option
|
||||
<el-select style="width: 200px;" v-model="warningType" size="small">
|
||||
<el-option
|
||||
v-for="city in warningTypeList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
|
|
@ -84,21 +81,22 @@
|
|||
{{$t('Notification group')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-select
|
||||
style="width: 200px;"
|
||||
v-model="warningGroupId"
|
||||
:disabled="!notifyGroupList.length">
|
||||
<x-input slot="trigger" slot-scope="{ selectedModel }" readonly :placeholder="$t('Please select a notification group')" :value="selectedModel ? selectedModel.label : ''" style="width: 200px;" @on-click-icon.stop="warningGroupId = ''">
|
||||
<em slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId"></em>
|
||||
<em slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="!warningGroupId"></em>
|
||||
</x-input>
|
||||
<x-option
|
||||
<el-select
|
||||
style="width: 200px;"
|
||||
size="small"
|
||||
v-model="warningGroupId"
|
||||
:disabled="!notifyGroupList.length">
|
||||
<el-input slot="trigger" slot-scope="{ selectedModel }" readonly :placeholder="$t('Please select a notification group')" size="small" :value="selectedModel ? selectedModel.label : ''" style="width: 200px;" @on-click-icon.stop="warningGroupId = ''">
|
||||
<em slot="suffix" class="el-icon-error" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId"></em>
|
||||
<em slot="suffix" class="el-icon-bottom" style="font-size: 12px;" v-show="!warningGroupId"></em>
|
||||
</el-input>
|
||||
<el-option
|
||||
v-for="city in notifyGroupList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
|
|
@ -123,7 +121,7 @@
|
|||
</div>
|
||||
<div class="cont">
|
||||
<div style="padding-top: 6px;">
|
||||
<x-checkbox v-model="execType">{{$t('Whether it is a complement process?')}}</x-checkbox>
|
||||
<el-checkbox v-model="execType" size="small">{{$t('Whether it is a complement process?')}}</el-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -133,10 +131,10 @@
|
|||
{{$t('Mode of execution')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-radio-group v-model="runMode" style="margin-top: 7px;">
|
||||
<x-radio :label="'RUN_MODE_SERIAL'">{{$t('Serial execution')}}</x-radio>
|
||||
<x-radio :label="'RUN_MODE_PARALLEL'">{{$t('Parallel execution')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="runMode" style="margin-top: 7px;">
|
||||
<el-radio :label="'RUN_MODE_SERIAL'">{{$t('Serial execution')}}</el-radio>
|
||||
<el-radio :label="'RUN_MODE_PARALLEL'">{{$t('Parallel execution')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
|
|
@ -144,22 +142,23 @@
|
|||
{{$t('Schedule date')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-datepicker
|
||||
style="width: 360px;"
|
||||
:panel-num="2"
|
||||
placement="bottom-start"
|
||||
@on-change="_datepicker"
|
||||
:value="scheduleTime"
|
||||
type="daterange"
|
||||
:placeholder="$t('Select date range')"
|
||||
format="YYYY-MM-DD HH:mm:ss">
|
||||
</x-datepicker>
|
||||
<el-date-picker
|
||||
style="width: 360px"
|
||||
v-model="scheduleTime"
|
||||
size="small"
|
||||
@change="_datepicker"
|
||||
type="datetimerange"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('startDate')"
|
||||
:end-placeholder="$t('endDate')"
|
||||
value-format="yyyy-MM-dd HH:mm:ss">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="submit">
|
||||
<x-button type="text" @click="close()"> {{$t('Cancel')}} </x-button>
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Start')}} </x-button>
|
||||
<el-button type="text" size="small" @click="close()"> {{$t('Cancel')}} </el-button>
|
||||
<el-button type="primary" size="small" round :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Start')}} </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -197,7 +196,7 @@
|
|||
}
|
||||
},
|
||||
props: {
|
||||
item: Object,
|
||||
startData: Object,
|
||||
startNodeList: {
|
||||
type: String,
|
||||
default: ''
|
||||
|
|
@ -211,7 +210,7 @@
|
|||
_start () {
|
||||
this.spinnerLoading = true
|
||||
let param = {
|
||||
processDefinitionId: this.item.id,
|
||||
processDefinitionId: this.startData.id,
|
||||
scheduleTime: this.scheduleTime.length && this.scheduleTime.join(',') || '',
|
||||
failureStrategy: this.failureStrategy,
|
||||
warningType: this.warningType,
|
||||
|
|
@ -231,7 +230,7 @@
|
|||
}
|
||||
this.store.dispatch('dag/processStart', param).then(res => {
|
||||
this.$message.success(res.msg)
|
||||
this.$emit('onUpdate')
|
||||
this.$emit('onUpdateStart')
|
||||
setTimeout(() => {
|
||||
this.spinnerLoading = false
|
||||
this.close()
|
||||
|
|
@ -250,7 +249,7 @@
|
|||
})
|
||||
},
|
||||
_getReceiver () {
|
||||
this.store.dispatch('dag/getReceiver', { processDefinitionId: this.item.id }).then(res => {
|
||||
this.store.dispatch('dag/getReceiver', { processDefinitionId: this.startData.id }).then(res => {
|
||||
this.receivers = res.receivers && res.receivers.split(',') || []
|
||||
this.receiversCc = res.receiversCc && res.receiversCc.split(',') || []
|
||||
})
|
||||
|
|
@ -259,7 +258,7 @@
|
|||
this._start()
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.$emit('closeStart')
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
@ -269,7 +268,7 @@
|
|||
},
|
||||
created () {
|
||||
this.warningType = this.warningTypeList[0].id
|
||||
this.workflowName = this.item.name
|
||||
this.workflowName = this.startData.name
|
||||
|
||||
this._getReceiver()
|
||||
let stateWorkerGroupsList = this.store.state.security.workerGroupsListAll || []
|
||||
|
|
@ -291,7 +290,7 @@
|
|||
this.warningGroupId = ''
|
||||
})
|
||||
})
|
||||
this.workflowName = this.item.name
|
||||
this.workflowName = this.startData.name
|
||||
},
|
||||
computed: {},
|
||||
components: { mEmail, mPriority, mWorkerGroups }
|
||||
|
|
|
|||
|
|
@ -16,48 +16,48 @@
|
|||
*/
|
||||
<template>
|
||||
<div class="timing-process-model">
|
||||
<div class="title-box">
|
||||
<span>{{$t('Set parameters before timing')}}</span>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
<div class="text">
|
||||
{{$t('Start and stop time')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-datepicker
|
||||
style="width: 360px;"
|
||||
:panel-num="2"
|
||||
placement="bottom-start"
|
||||
@on-change="_datepicker"
|
||||
:value="scheduleTime"
|
||||
type="daterange"
|
||||
:placeholder="$t('Select date range')"
|
||||
format="YYYY-MM-DD HH:mm:ss">
|
||||
</x-datepicker>
|
||||
<el-date-picker
|
||||
style="width: 360px"
|
||||
v-model="scheduleTime"
|
||||
size="small"
|
||||
@change="_datepicker"
|
||||
type="datetimerange"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('startDate')"
|
||||
:end-placeholder="$t('endDate')"
|
||||
value-format="yyyy-MM-dd HH:mm:ss">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
<x-button type="info" style="margin-left:20px" shape="circle" :loading="spinnerLoading" @click="preview()">{{$t('Execute time')}}</x-button>
|
||||
<el-button type="info" style="margin-left:20px" size="small" round :loading="spinnerLoading" @click="preview()">{{$t('Execute time')}}</el-button>
|
||||
<div class="text">
|
||||
{{$t('Timing')}}
|
||||
</div>
|
||||
|
||||
<div class="cont">
|
||||
<template>
|
||||
<x-poptip :ref="'poptip'" placement="bottom-start">
|
||||
<el-popover
|
||||
placement="bottom-start"
|
||||
trigger="click">
|
||||
<template slot="reference">
|
||||
<el-input
|
||||
style="width: 360px;"
|
||||
type="text"
|
||||
size="small"
|
||||
readonly
|
||||
:value="crontab">
|
||||
</el-input>
|
||||
</template>
|
||||
<div class="crontab-box">
|
||||
<v-crontab v-model="crontab" :locale="i18n"></v-crontab>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-input
|
||||
style="width: 360px;"
|
||||
type="text"
|
||||
readonly
|
||||
:value="crontab"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
</template>
|
||||
</x-poptip>
|
||||
</el-popover>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -73,10 +73,10 @@
|
|||
{{$t('Failure Strategy')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-radio-group v-model="failureStrategy" style="margin-top: 7px;">
|
||||
<x-radio :label="'CONTINUE'">{{$t('Continue')}}</x-radio>
|
||||
<x-radio :label="'END'">{{$t('End')}}</x-radio>
|
||||
</x-radio-group>
|
||||
<el-radio-group v-model="failureStrategy" style="margin-top: 7px;" size="small">
|
||||
<el-radio :label="'CONTINUE'">{{$t('Continue')}}</el-radio>
|
||||
<el-radio :label="'END'">{{$t('End')}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
|
|
@ -84,16 +84,17 @@
|
|||
{{$t('Notification strategy')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-select
|
||||
style="width: 200px;"
|
||||
v-model="warningType">
|
||||
<x-option
|
||||
v-for="city in warningTypeList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select
|
||||
style="width: 200px;"
|
||||
size="small"
|
||||
v-model="warningType">
|
||||
<el-option
|
||||
v-for="city in warningTypeList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
|
|
@ -117,21 +118,22 @@
|
|||
{{$t('Notification group')}}
|
||||
</div>
|
||||
<div class="cont">
|
||||
<x-select
|
||||
style="width: 200px;"
|
||||
:disabled="!notifyGroupList.length"
|
||||
v-model="warningGroupId">
|
||||
<x-input slot="trigger" readonly slot-scope="{ selectedModel }" :placeholder="$t('Please select a notification group')" :value="selectedModel ? selectedModel.label : ''" style="width: 200px;" @on-click-icon.stop="warningGroupId = {}">
|
||||
<em slot="suffix" class="ans-icon-fail-solid" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId.id"></em>
|
||||
<em slot="suffix" class="ans-icon-arrow-down" style="font-size: 12px;" v-show="!warningGroupId.id"></em>
|
||||
</x-input>
|
||||
<x-option
|
||||
v-for="city in notifyGroupList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<el-select
|
||||
style="width: 200px;"
|
||||
size="small"
|
||||
:disabled="!notifyGroupList.length"
|
||||
v-model="warningGroupId">
|
||||
<el-input slot="trigger" readonly slot-scope="{ selectedModel }" :placeholder="$t('Please select a notification group')" :value="selectedModel ? selectedModel.label : ''" style="width: 200px;" @on-click-icon.stop="warningGroupId = {}">
|
||||
<em slot="suffix" class="el-icon-error" style="font-size: 15px;cursor: pointer;" v-show="warningGroupId.id"></em>
|
||||
<em slot="suffix" class="el-icon-bottom" style="font-size: 12px;" v-show="!warningGroupId.id"></em>
|
||||
</el-input>
|
||||
<el-option
|
||||
v-for="city in notifyGroupList"
|
||||
:key="city.id"
|
||||
:value="city.id"
|
||||
:label="city.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix list">
|
||||
|
|
@ -151,8 +153,8 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="submit">
|
||||
<x-button type="text" @click="close()"> {{$t('Cancel')}} </x-button>
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : (item.crontab ? $t('Edit') : $t('Create'))}} </x-button>
|
||||
<el-button type="text" size="small" @click="close()"> {{$t('Cancel')}} </el-button>
|
||||
<el-button type="primary" size="small" round :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : (timingData.item.crontab ? $t('Edit') : $t('Create'))}} </el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -191,10 +193,7 @@
|
|||
}
|
||||
},
|
||||
props: {
|
||||
item: Object,
|
||||
receiversD: Array,
|
||||
receiversCcD: Array,
|
||||
type: String
|
||||
timingData: Object
|
||||
},
|
||||
methods: {
|
||||
_datepicker (val) {
|
||||
|
|
@ -237,19 +236,19 @@
|
|||
let msg = ''
|
||||
|
||||
// edit
|
||||
if (this.item.crontab) {
|
||||
if (this.timingData.item.crontab) {
|
||||
api = 'dag/updateSchedule'
|
||||
searchParams.id = this.item.id
|
||||
searchParams.id = this.timingData.item.id
|
||||
msg = `${i18n.$t('Edit')}${i18n.$t('success')},${i18n.$t('Please go online')}`
|
||||
} else {
|
||||
api = 'dag/createSchedule'
|
||||
searchParams.processDefinitionId = this.item.id
|
||||
searchParams.processDefinitionId = this.timingData.item.id
|
||||
msg = `${i18n.$t('Create')}${i18n.$t('success')}`
|
||||
}
|
||||
|
||||
this.store.dispatch(api, searchParams).then(res => {
|
||||
this.$message.success(msg)
|
||||
this.$emit('onUpdate')
|
||||
this.$emit('onUpdateTiming')
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
|
|
@ -294,7 +293,7 @@
|
|||
this._timing()
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.$emit('closeTiming')
|
||||
},
|
||||
preview () {
|
||||
this._preview()
|
||||
|
|
@ -303,7 +302,7 @@
|
|||
watch: {
|
||||
},
|
||||
created () {
|
||||
if(this.item.workerGroup===undefined) {
|
||||
if(this.timingData.item.workerGroup===undefined) {
|
||||
let stateWorkerGroupsList = this.store.state.security.workerGroupsListAll || []
|
||||
if (stateWorkerGroupsList.length) {
|
||||
this.workerGroup = stateWorkerGroupsList[0].id
|
||||
|
|
@ -315,12 +314,12 @@
|
|||
})
|
||||
}
|
||||
} else {
|
||||
this.workerGroup = this.item.workerGroup
|
||||
this.workerGroup = this.timingData.item.workerGroup
|
||||
}
|
||||
if(this.item.crontab !== null){
|
||||
this.crontab = this.item.crontab
|
||||
if(this.timingData.item.crontab !== null){
|
||||
this.crontab = this.timingData.item.crontab
|
||||
}
|
||||
if(this.type == 'timing') {
|
||||
if(this.timingData.type == 'timing') {
|
||||
let date = new Date()
|
||||
let year = date.getFullYear()
|
||||
let month = date.getMonth() + 1
|
||||
|
|
@ -339,13 +338,13 @@
|
|||
this.crontab = '0 0 * * * ? *'
|
||||
this.scheduleTime = times
|
||||
}
|
||||
this.receivers = _.cloneDeep(this.receiversD)
|
||||
this.receiversCc = _.cloneDeep(this.receiversCcD)
|
||||
this.receivers = _.cloneDeep(this.timingData.receiversD)
|
||||
this.receiversCc = _.cloneDeep(this.timingData.receiversCcD)
|
||||
},
|
||||
mounted () {
|
||||
let item = this.item
|
||||
let item = this.timingData.item
|
||||
// Determine whether to echo
|
||||
if (this.item.crontab) {
|
||||
if (this.timingData.item.crontab) {
|
||||
this.crontab = item.crontab
|
||||
this.scheduleTime = [formatDate(item.startTime), formatDate(item.endTime)]
|
||||
this.failureStrategy = item.failureStrategy
|
||||
|
|
|
|||
|
|
@ -21,103 +21,69 @@
|
|||
<span class="name">{{$t('Version Info')}}</span>
|
||||
</div>
|
||||
|
||||
<div class="table-box" v-if="processDefinitionVersions.length > 0">
|
||||
<table class="fixed">
|
||||
<caption><!-- placeHolder --></caption>
|
||||
<tr>
|
||||
<th scope="col" style="min-width: 40px;text-align: left">
|
||||
<span>{{$t('Version')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 30px">
|
||||
<span>{{$t('Description')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 50px">
|
||||
<span>{{$t('Create Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 300px">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in processDefinitionVersions" :key="item.id">
|
||||
<td>
|
||||
<span v-if="item.version">
|
||||
<span v-if="item.version === processDefinition.version" style="color: green"><strong>{{item.version}} {{$t('Current Version')}}</strong></span>
|
||||
<span v-else>{{item.version}}</span>
|
||||
<div class="table-box" v-if="versionData.processDefinitionVersions.length > 0">
|
||||
<el-table :data="versionData.processDefinitionVersions" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column prop="userName" :label="$t('Version')">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.version">
|
||||
<span v-if="scope.row.version === versionData.processDefinition.version" style="color: green"><strong>{{scope.row.version}} {{$t('Current Version')}}</strong></span>
|
||||
<span v-else>{{scope.row.version}}</span>
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td style="word-break:break-all;">
|
||||
<span v-if="item.description">{{item.description}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.createTime">{{item.createTime}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<x-poptip
|
||||
:ref="'poptip-switch-version-' + $index"
|
||||
placement="top-end"
|
||||
width="260">
|
||||
<p>{{$t('Confirm Switch To This Version?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeSwitchVersion($index)">
|
||||
{{$t('Cancel')}}
|
||||
</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle"
|
||||
@click="_mVersionSwitchProcessDefinitionVersion(item)">{{$t('Confirm')}}
|
||||
</x-button>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
icon="ans-icon-dependence"
|
||||
type="primary"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
:disabled="item.version === processDefinition.version || 'ONLINE' === processDefinition.state"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Switch To This Version')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
<x-poptip
|
||||
:ref="'poptip-delete-' + $index"
|
||||
placement="top-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}
|
||||
</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle"
|
||||
@click="_mVersionDeleteProcessDefinitionVersion(item,$index)">{{$t('Confirm')}}
|
||||
</x-button>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
icon="ans-icon-trash"
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
:disabled="item.version === processDefinition.version || 'ONLINE' === processDefinition.state"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('delete')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="description" :label="$t('Description')"></el-table-column>
|
||||
<el-table-column :label="$t('Create Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.createTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip :content="$t('Switch To This Version')" placement="top">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Confirm Switch To This Version?')"
|
||||
@onConfirm="_mVersionSwitchProcessDefinitionVersion(scope.row)"
|
||||
>
|
||||
<el-button type="primary" size="mini" icon="el-icon-warning" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_mVersionDeleteProcessDefinitionVersion(scope.row,scope.row.id)"
|
||||
>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<div v-if="processDefinitionVersions.length === 0">
|
||||
<div v-if="versionData.processDefinitionVersions.length === 0">
|
||||
<m-no-data><!----></m-no-data>
|
||||
</div>
|
||||
|
||||
<div v-if="processDefinitionVersions.length > 0">
|
||||
<div v-if="versionData.processDefinitionVersions.length > 0">
|
||||
<div class="bottom-box">
|
||||
<x-button type="text" @click="_close()"> {{$t('Cancel')}}</x-button>
|
||||
<x-page :current="pageNo" :total="total" @on-change="_mVersionGetProcessDefinitionVersionsPage" small>
|
||||
<!----></x-page>
|
||||
<el-pagination
|
||||
style="float:right"
|
||||
background
|
||||
@current-change="_mVersionGetProcessDefinitionVersionsPage"
|
||||
layout="prev, pager, next"
|
||||
:total="versionData.total">
|
||||
</el-pagination>
|
||||
<el-button type="text" size="mini" @click="_close()" style="float:right">{{$t('Cancel')}}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -144,11 +110,7 @@
|
|||
}
|
||||
},
|
||||
props: {
|
||||
processDefinition: Object,
|
||||
processDefinitionVersions: Array,
|
||||
total: Number,
|
||||
pageNo: Number,
|
||||
pageSize: Number
|
||||
versionData: Object
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
|
|
@ -157,7 +119,7 @@
|
|||
_mVersionSwitchProcessDefinitionVersion (item) {
|
||||
this.$emit('mVersionSwitchProcessDefinitionVersion', {
|
||||
version: item.version,
|
||||
processDefinitionId: this.processDefinition.id,
|
||||
processDefinitionId: this.versionData.processDefinition.id,
|
||||
fromThis: this
|
||||
})
|
||||
},
|
||||
|
|
@ -168,7 +130,7 @@
|
|||
_mVersionDeleteProcessDefinitionVersion (item) {
|
||||
this.$emit('mVersionDeleteProcessDefinitionVersion', {
|
||||
version: item.version,
|
||||
processDefinitionId: this.processDefinition.id,
|
||||
processDefinitionId: this.versionData.processDefinition.id,
|
||||
fromThis: this
|
||||
})
|
||||
},
|
||||
|
|
@ -180,25 +142,10 @@
|
|||
this.$emit('mVersionGetProcessDefinitionVersionsPage', {
|
||||
pageNo: val,
|
||||
pageSize: this.pageSize,
|
||||
processDefinitionId: this.processDefinition.id,
|
||||
processDefinitionId: this.versionData.processDefinition.id,
|
||||
fromThis: this
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* Close the switch version layer
|
||||
*/
|
||||
_closeSwitchVersion (i) {
|
||||
this.$refs[`poptip-switch-version-${i}`][0].doClose()
|
||||
},
|
||||
|
||||
/**
|
||||
* Close the delete layer
|
||||
*/
|
||||
_closeDelete (i) {
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
},
|
||||
|
||||
/**
|
||||
* Close and destroy component and component internal events
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -20,8 +20,8 @@
|
|||
<template slot="conditions">
|
||||
<m-conditions @on-conditions="_onConditions">
|
||||
<template slot="button-group">
|
||||
<x-button type="ghost" size="small" @click="() => this.$router.push({name: 'definition-create'})">{{$t('Create process')}}</x-button>
|
||||
<x-button type="ghost" size="small" @click="_uploading">{{$t('Import process')}}</x-button>
|
||||
<el-button size="mini" @click="() => this.$router.push({name: 'definition-create'})">{{$t('Create process')}}</el-button>
|
||||
<el-button size="mini" @click="_uploading">{{$t('Import process')}}</el-button>
|
||||
</template>
|
||||
</m-conditions>
|
||||
</template>
|
||||
|
|
@ -29,7 +29,16 @@
|
|||
<template v-if="processListP.length || total>0">
|
||||
<m-list :process-list="processListP" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize"></m-list>
|
||||
<div class="page-box">
|
||||
<x-page :current="parseInt(searchParams.pageNo)" :total="total" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="searchParams.pageSize"
|
||||
:current-page.sync="searchParams.pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!processListP.length && total<=0">
|
||||
|
|
@ -138,7 +147,7 @@
|
|||
localStore.removeItem('subProcessId')
|
||||
},
|
||||
mounted() {
|
||||
this.$modal.destroy()
|
||||
|
||||
},
|
||||
beforeDestroy () {
|
||||
sessionStorage.setItem('isLeft',1)
|
||||
|
|
|
|||
|
|
@ -18,29 +18,29 @@
|
|||
<m-list-construction :title="$t('TreeView')">
|
||||
<template slot="operation">
|
||||
<span style=" float: right; padding-right:50px">
|
||||
<em class="ans-icon-fail-empty" style="font-size:20px " data-container="body" data-toggle="tooltip" :title="$t('Return')" @click="_close()"></em>
|
||||
<em class="el-icon-back" style="font-size:20px " data-container="body" data-toggle="tooltip" :title="$t('Return')" @click="_close()"></em>
|
||||
</span>
|
||||
</template>
|
||||
<template slot="conditions"></template>
|
||||
<template slot="content">
|
||||
<div class="tree-view-index-model">
|
||||
<div class="tree-limit-select">
|
||||
<x-select v-model="limit" style="width: 70px;" @on-change="_onChangeSelect">
|
||||
<x-option
|
||||
<el-select v-model="limit" style="width: 70px;" @change="_onChangeSelect" size="small">
|
||||
<el-option
|
||||
v-for="city in [{value:25},{value:50},{value:75},{value:100}]"
|
||||
:key="city.value"
|
||||
:value="city.value"
|
||||
:label="city.value">
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-button
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-button
|
||||
@click="_rtTasksDag"
|
||||
v-if="$route.query.subProcessIds"
|
||||
type="primary"
|
||||
size="default"
|
||||
icon="ans-icon-arrow-to-left">
|
||||
size="small"
|
||||
icon="el-icon-d-arrow-left">
|
||||
{{$t('Return_1')}}
|
||||
</x-button>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="tasks-color">
|
||||
<div class="toolbar-color-sp">
|
||||
|
|
@ -48,7 +48,7 @@
|
|||
<span>Node Type</span>
|
||||
</a>
|
||||
<a href="javascript:" v-for="(k,v) in tasksType" :key="v">
|
||||
<em class="ans-icon-circle-solid" :style="{color:k.color}"></em>
|
||||
<em class="el-icon-user-solid" :style="{color:k.color}"></em>
|
||||
<span>{{v}}</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -57,7 +57,7 @@
|
|||
<span>{{$t('Task Status')}}</span>
|
||||
</a>
|
||||
<a href="javascript:" v-for="(item) in tasksState" :key="item.id">
|
||||
<em class="ans-icon-rect-solid" :style="{color:item.color}"></em>
|
||||
<em class="fa fa-square" :style="{color:item.color}"></em>
|
||||
<span>{{item.desc}}</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -189,7 +189,7 @@
|
|||
this.$router.push({ path: `/projects/definition/tree/${subProcessId}`, query: { subProcessIds: subProcessIds.join(',') } })
|
||||
},
|
||||
_onChangeSelect (o) {
|
||||
this.limit = o.value
|
||||
this.limit = o
|
||||
this._getViewTree()
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -22,125 +22,74 @@
|
|||
<div class="list-model" v-if="!isLoading">
|
||||
<template v-if="list.length">
|
||||
<div class="table-box">
|
||||
<table>
|
||||
<tr>
|
||||
<th>
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Process Name')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Start Time')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('End Time')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('crontab')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Failure Strategy')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('State')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Create Time')}}</span>
|
||||
</th>
|
||||
<th>
|
||||
<span>{{$t('Update Time')}}</span>
|
||||
</th>
|
||||
<th width="120">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="item.id">
|
||||
<td>
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span><a href="javascript:">{{item.processDefinitionName}}</a></span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.startTime | formatDate}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.endTime | formatDate}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.crontab}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.failureStrategy}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{_rtReleaseState(item.releaseState)}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.createTime | formatDate}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.updateTime | formatDate}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Edit')"
|
||||
@click="_editTiming(item)"
|
||||
icon="ans-icon-edit"
|
||||
:disabled="item.releaseState === 'ONLINE'" >
|
||||
</x-button>
|
||||
<x-button
|
||||
type="warning"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('online')"
|
||||
@click="_online(item)"
|
||||
icon="ans-icon-upward"
|
||||
v-if="item.releaseState === 'OFFLINE'">
|
||||
</x-button>
|
||||
<x-button
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('offline')"
|
||||
icon="ans-icon-downward"
|
||||
@click="_offline(item)"
|
||||
v-if="item.releaseState === 'ONLINE'">
|
||||
</x-button>
|
||||
<x-poptip
|
||||
:ref="'poptip-delete-' + $index"
|
||||
placement="bottom-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
icon="ans-icon-trash"
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
:disabled="item.releaseState === 'ONLINE'"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('delete')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column prop="processDefinitionName" :label="$t('Process Name')"></el-table-column>
|
||||
<el-table-column :label="$t('Start Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.startTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('End Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.endTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="crontab" :label="$t('crontab')"></el-table-column>
|
||||
<el-table-column prop="failureStrategy" :label="$t('Failure Strategy')"></el-table-column>
|
||||
<el-table-column :label="$t('State')">
|
||||
<template slot-scope="scope">
|
||||
<span>{{_rtReleaseState(scope.row.releaseState)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Create Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.createTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Update Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.updateTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip :content="$t('Edit')" placement="top">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-edit-outline" :disabled="scope.row.releaseState === 'ONLINE'" @click="_editTiming(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('online')" placement="top" v-if="scope.row.releaseState === 'OFFLINE'">
|
||||
<span><el-button type="warning" size="mini" icon="el-icon-upload2" @click="_online(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('offline')" placement="top" v-if="scope.row.releaseState === 'ONLINE'">
|
||||
<span><el-button type="danger" size="mini" icon="el-icon-download" @click="_offline(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete(scope.row,scope.row.id)"
|
||||
>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="page-box">
|
||||
<x-page :current="pageNo" :total="total" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="pageSize"
|
||||
:current-page.sync="pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!list.length">
|
||||
|
|
@ -148,6 +97,12 @@
|
|||
</template>
|
||||
</div>
|
||||
<m-spin :is-spin="isLoading"></m-spin>
|
||||
<el-dialog
|
||||
:title="$t('Set parameters before timing')"
|
||||
:visible.sync="timingDialog"
|
||||
width="65%">
|
||||
<m-timing :timingData="timingData" @onUpdateTiming="onUpdateTiming" @closeTiming="closeTiming"></m-timing>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -166,7 +121,13 @@
|
|||
total: null,
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
list: []
|
||||
list: [],
|
||||
timingDialog: false,
|
||||
timingData: {
|
||||
item: {},
|
||||
receiversD: [],
|
||||
receiversCcD: []
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
@ -285,43 +246,28 @@
|
|||
* timing
|
||||
*/
|
||||
_editTiming (item) {
|
||||
let self = this
|
||||
this._getReceiver(item.processDefinitionId).then(res => {
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mTiming, {
|
||||
on: {
|
||||
onUpdate () {
|
||||
self.pageNo = 1
|
||||
self._getScheduleList('false')
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: item,
|
||||
receiversD: res.receivers,
|
||||
receiversCcD: res.receiversCc
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.timingData.item = item
|
||||
this.timingData.receiversD = res.receivers
|
||||
this.timingData.receiversCcD = res.receiversCc
|
||||
this.timingDialog = true
|
||||
})
|
||||
}
|
||||
},
|
||||
onUpdateTiming () {
|
||||
this.pageNo = 1
|
||||
this._getScheduleList('false')
|
||||
this.timingDialog = false
|
||||
},
|
||||
closeTiming () {
|
||||
this.timingDialog = false
|
||||
},
|
||||
},
|
||||
watch: {},
|
||||
created () {
|
||||
this._getScheduleList()
|
||||
},
|
||||
mounted () {},
|
||||
components: { mSpin, mNoData }
|
||||
components: { mSpin, mNoData, mTiming }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
<m-list-construction :title="$t('Cron Manage')">
|
||||
<template slot="operation">
|
||||
<span style=" float: right; padding-right:50px">
|
||||
<em class="ans-icon-fail-empty" style="font-size:20px " data-container="body" data-toggle="tooltip" :title="$t('Return')" @click="_close()"></em>
|
||||
<em class="el-icon-circle-close" style="font-size:20px " data-container="body" data-toggle="tooltip" :title="$t('Return')" @click="_close()"></em>
|
||||
</span>
|
||||
</template>
|
||||
<template slot="content">
|
||||
|
|
|
|||
|
|
@ -19,15 +19,16 @@
|
|||
<template slot="content">
|
||||
<div class="perject-home-content">
|
||||
<div class="time-model">
|
||||
<x-datepicker
|
||||
:panel-num="2"
|
||||
placement="bottom-end"
|
||||
@on-change="_datepicker"
|
||||
:value="[searchParams.startDate,searchParams.endDate]"
|
||||
type="daterange"
|
||||
:placeholder="$t('Select date range')"
|
||||
format="YYYY-MM-DD HH:mm:ss">
|
||||
</x-datepicker>
|
||||
<el-date-picker
|
||||
v-model="dataTime"
|
||||
type="datetimerange"
|
||||
size="small"
|
||||
@change="_datepicker"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('startDate')"
|
||||
:end-placeholder="$t('endDate')"
|
||||
value-format="yyyy-MM-dd HH:mm:ss">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="row" >
|
||||
<div class="col-md-6">
|
||||
|
|
@ -83,7 +84,8 @@
|
|||
projectId: null,
|
||||
startDate: '',
|
||||
endDate: ''
|
||||
}
|
||||
},
|
||||
dataTime: [],
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
@ -97,8 +99,8 @@
|
|||
},
|
||||
created () {
|
||||
this.searchParams.projectId = this.id === 0 ? 0 : localStore.getItem('projectId')
|
||||
this.searchParams.startDate = dayjs().format('YYYY-MM-DD 00:00:00')
|
||||
this.searchParams.endDate = dayjs().format('YYYY-MM-DD HH:mm:ss')
|
||||
this.dataTime[0] = dayjs().format('YYYY-MM-DD 00:00:00')
|
||||
this.dataTime[1] = dayjs().format('YYYY-MM-DD HH:mm:ss')
|
||||
},
|
||||
components: {
|
||||
mSecondaryMenu,
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
<span>{{$t('Task Status')}}</span>
|
||||
</a>
|
||||
<a href="javascript:" v-for="(item) in tasksState" :key="item.id">
|
||||
<em class="ans-icon-rect-solid" :style="{color:item.color}"></em>
|
||||
<em class="fa fa-square" :style="{color:item.color}"></em>
|
||||
<span>{{item.desc}}</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -17,289 +17,206 @@
|
|||
<template>
|
||||
<div class="list-model" style="position: relative;">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th scope="col" style="min-width: 50px">
|
||||
<x-checkbox @on-change="_topCheckBoxClick" v-model="checkAll"></x-checkbox>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 30px">
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 200px;max-width: 300px;">
|
||||
<span>{{$t('Process Name')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 30px">
|
||||
<span>{{$t('State')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 70px">
|
||||
<span>{{$t('Run Type')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('Scheduling Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('Start Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('End Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 60px">
|
||||
<span>{{$t('Duration')}}s</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 60px">
|
||||
<span>{{$t('Run Times')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 55px">
|
||||
<span>{{$t('fault-tolerant sign')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 135px">
|
||||
<span>{{$t('Executor')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 100px">
|
||||
<div style="width: 100px">
|
||||
<span>{{$t('host')}}</span>
|
||||
<el-table :data="list" size="mini" style="width: 100%" @selection-change="_arrDelChange">
|
||||
<el-table-column type="selection" width="50"></el-table-column>
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column :label="$t('Process Name')" min-width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-popover trigger="hover" placement="top">
|
||||
<p>{{ scope.row.name }}</p>
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<router-link :to="{ path: '/projects/instance/list/' + scope.row.id , query:{id: scope.row.processDefinitionId}}" tag="a" class="links" :title="scope.row.name">{{scope.row.name}}</router-link>
|
||||
</div>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('State')" width="50">
|
||||
<template slot-scope="scope">
|
||||
<span v-html="_rtState(scope.row.state)" style="cursor: pointer;"></span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Run Type')">
|
||||
<template slot-scope="scope">
|
||||
{{_rtRunningType(scope.row.commandType)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Scheduling Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.scheduleTime">{{scope.row.scheduleTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Start Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.startTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('End Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.endTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="duration" :label="$t('Duration')"></el-table-column>
|
||||
<el-table-column prop="runTimes" :label="$t('Run Times')"></el-table-column>
|
||||
<el-table-column prop="recovery" :label="$t('fault-tolerant sign')"></el-table-column>
|
||||
<el-table-column prop="executorName" :label="$t('Executor')"></el-table-column>
|
||||
<el-table-column prop="host" :label="$t('host')" width="150"></el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="240" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<div v-show="scope.row.disabled">
|
||||
<el-tooltip :content="$t('Edit')" placement="top" :enterable="false">
|
||||
<span>
|
||||
<el-button type="primary" size="mini" icon="el-icon-edit-outline" :disabled="scope.row.state !== 'SUCCESS' && scope.row.state !== 'PAUSE' && scope.row.state !== 'FAILURE' && scope.row.state !== 'STOP'" @click="_reEdit(scope.row)" circle></el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Rerun')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" :disabled="scope.row.state !== 'SUCCESS' && scope.row.state !== 'PAUSE' && scope.row.state !== 'FAILURE' && scope.row.state !== 'STOP'" icon="el-icon-refresh" @click="_reRun(scope.row,scope.$index)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Recovery Failed')" placement="top" :enterable="false">
|
||||
<span>
|
||||
<el-button type="success" size="mini" icon="el-icon-circle-close" :disabled="scope.row.state !== 'FAILURE'" @click="_restore(scope.row,scope.$index)" circle></el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="scope.row.state === 'STOP' ? $t('Recovery Suspend') : $t('Stop')" placement="top" :enterable="false">
|
||||
<span><el-button type="warning" size="mini" :disabled="scope.row.state !== 'RUNNING_EXECUTION' && scope.row.state != 'STOP'" :icon="scope.row.state === 'STOP' ? 'el-icon-video-play' : 'el-icon-close'" @click="_stop(scope.row,scope.$index)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="scope.row.state === 'PAUSE' ? $t('Recovery Suspend') : $t('Pause')" placement="top" :enterable="false">
|
||||
<span><el-button type="error" size="mini" :icon="scope.row.state === 'PAUSE' ? 'el-icon-video-play' : 'el-icon-video-pause'" :disabled="scope.row.state !== 'RUNNING_EXECUTION' && scope.row.state !== 'PAUSE'" @click="_suspend(scope.row,scope.$index)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top" :enterable="false">
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle></el-button>
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete(scope.row,scope.row.id)">
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" :disabled="scope.row.releaseState === 'ONLINE'" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Gantt')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-s-operation" @click="_gantt(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 210px">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="item.id">
|
||||
<td width="50"><x-checkbox v-model="item.isCheck" @on-change="_arrDelChange"></x-checkbox></td>
|
||||
<td width="50">
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td style="min-width: 200px;max-width: 300px;padding-right: 10px;">
|
||||
<span class="ellipsis" style="padding-left: 4px;"><router-link :to="{ path: '/projects/instance/list/' + item.id , query:{id: item.processDefinitionId}}" tag="a" class="links" :title="item.name">{{item.name}}</router-link></span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-html="_rtState(item.state)" style="cursor: pointer;"></span>
|
||||
</td>
|
||||
<td><span>{{_rtRunningType(item.commandType)}}</span></td>
|
||||
<td>
|
||||
<span v-if="item.scheduleTime">{{item.scheduleTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.startTime">{{item.startTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.endTime">{{item.endTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td width="70"><span>{{item.duration || '-'}}</span></td>
|
||||
<td width="70"><span>{{item.runTimes}}</span></td>
|
||||
<td><span>{{item.recovery}}</span></td>
|
||||
<td>
|
||||
<span v-if="item.executorName">{{item.executorName}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.host" style="word-break: break-all">{{item.host}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td style="z-index: inherit;">
|
||||
<div v-show="item.disabled">
|
||||
<x-button type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Edit')"
|
||||
@click="_reEdit(item)"
|
||||
icon="ans-icon-edit"
|
||||
:disabled="item.state !== 'SUCCESS' && item.state !== 'PAUSE' && item.state !== 'FAILURE' && item.state !== 'STOP'"></x-button>
|
||||
<x-button type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Rerun')"
|
||||
@click="_reRun(item,$index)"
|
||||
icon="ans-icon-refresh"
|
||||
:disabled="item.state !== 'SUCCESS' && item.state !== 'PAUSE' && item.state !== 'FAILURE' && item.state !== 'STOP'"></x-button>
|
||||
<x-button type="success"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Recovery Failed')"
|
||||
@click="_restore(item,$index)"
|
||||
icon="ans-icon-fail-empty"
|
||||
:disabled="item.state !== 'FAILURE'"></x-button>
|
||||
<x-button type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="item.state === 'STOP' ? $t('Recovery Suspend') : $t('Stop')"
|
||||
@click="_stop(item,$index)"
|
||||
:icon="item.state === 'STOP' ? 'ans-icon-pause-solid' : 'ans-icon-stop'"
|
||||
:disabled="item.state !== 'RUNNING_EXECUTION' && item.state != 'STOP'"></x-button>
|
||||
<x-button type="warning"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="item.state === 'PAUSE' ? $t('Recovery Suspend') : $t('Pause')"
|
||||
@click="_suspend(item,$index)"
|
||||
:icon="item.state === 'PAUSE' ? 'ans-icon-pause-solid' : 'ans-icon-pause'"
|
||||
:disabled="item.state !== 'RUNNING_EXECUTION' && item.state !== 'PAUSE'"></x-button>
|
||||
<x-poptip
|
||||
:ref="'poptip-delete-' + $index"
|
||||
placement="top-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
icon="ans-icon-trash"
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:disabled="item.state !== 'SUCCESS' && item.state !== 'FAILURE' && item.state !== 'STOP' && item.state !== 'PAUSE'"
|
||||
:title="$t('delete')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
|
||||
<x-button type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Gantt')"
|
||||
@click="_gantt(item)"
|
||||
icon="ans-icon-gantt">
|
||||
</x-button>
|
||||
|
||||
</div>
|
||||
<div v-show="!item.disabled">
|
||||
<div v-show="!scope.row.disabled">
|
||||
<!--Edit-->
|
||||
<x-button
|
||||
<el-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-edit"
|
||||
disabled="true">
|
||||
</x-button>
|
||||
size="mini"
|
||||
icon="el-icon-edit-outline"
|
||||
disabled="true"
|
||||
circle>
|
||||
</el-button>
|
||||
|
||||
<!--Rerun-->
|
||||
<x-button
|
||||
v-show="buttonType === 'run'"
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
disabled="true">
|
||||
{{item.count}}
|
||||
</x-button>
|
||||
<x-button
|
||||
<el-tooltip :content="$t('Rerun')" placement="top" :enterable="false">
|
||||
<span>
|
||||
<el-button
|
||||
v-show="buttonType === 'run'"
|
||||
type="info"
|
||||
size="mini"
|
||||
disabled="true"
|
||||
circle>
|
||||
<span style="padding: 0 2px">{{scope.row.count}}</span>
|
||||
</el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-button
|
||||
v-show="buttonType !== 'run'"
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-refresh"
|
||||
disabled="true">
|
||||
</x-button>
|
||||
size="mini"
|
||||
icon="el-icon-refresh"
|
||||
disabled="true"
|
||||
circle>
|
||||
</el-button>
|
||||
|
||||
<!--Recovery Failed-->
|
||||
<x-button
|
||||
v-show="buttonType === 'store'"
|
||||
type="success"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
disabled="true">
|
||||
{{item.count}}
|
||||
</x-button>
|
||||
<x-button
|
||||
v-show="buttonType !== 'store'"
|
||||
type="success"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-fail-empty"
|
||||
disabled="true">
|
||||
</x-button>
|
||||
<span>
|
||||
<el-button
|
||||
v-show="buttonType === 'store'"
|
||||
type="success"
|
||||
size="mini"
|
||||
circle
|
||||
disabled="true">
|
||||
<span style="padding: 0 3px">{{scope.row.count}}</span>
|
||||
</el-button>
|
||||
</span>
|
||||
<el-button
|
||||
v-show="buttonType !== 'store'"
|
||||
type="success"
|
||||
size="mini"
|
||||
circle
|
||||
icon="el-icon-circle-close"
|
||||
disabled="true">
|
||||
</el-button>
|
||||
|
||||
<!--Stop-->
|
||||
<!--<x-button-->
|
||||
<!--type="error"-->
|
||||
<!--shape="circle"-->
|
||||
<!--size="xsmall"-->
|
||||
<!--icon="ans-icon-pause"-->
|
||||
<!--disabled="true">-->
|
||||
<!--</x-button>-->
|
||||
|
||||
<!--倒计时 => Recovery Suspend/Pause-->
|
||||
<x-button
|
||||
v-show="(item.state === 'PAUSE' || item.state == 'STOP') && buttonType === 'suspend'"
|
||||
type="warning"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
disabled="true">
|
||||
{{item.count}}
|
||||
</x-button>
|
||||
<!--Recovery Suspend/Pause-->
|
||||
<span>
|
||||
<el-button
|
||||
style="padding: 0 3px"
|
||||
v-show="(scope.row.state === 'PAUSE' || scope.row.state == 'STOP') && buttonType === 'suspend'"
|
||||
type="warning"
|
||||
size="mini"
|
||||
circle
|
||||
disabled="true">
|
||||
{{scope.row.count}}
|
||||
</el-button>
|
||||
</span>
|
||||
|
||||
<!--Recovery Suspend-->
|
||||
<x-button
|
||||
v-show="(item.state === 'PAUSE' || item.state == 'STOP') && buttonType !== 'suspend'"
|
||||
type="warning"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-pause-solid"
|
||||
disabled="true">
|
||||
</x-button>
|
||||
<el-button
|
||||
v-show="(scope.row.state === 'PAUSE' || scope.row.state == 'STOP') && buttonType !== 'suspend'"
|
||||
type="warning"
|
||||
size="mini"
|
||||
circle
|
||||
icon="el-icon-video-play"
|
||||
disabled="true">
|
||||
</el-button>
|
||||
|
||||
<!--Pause-->
|
||||
<x-button
|
||||
v-show="item.state !== 'PAUSE'"
|
||||
type="warning"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-stop"
|
||||
disabled="true">
|
||||
</x-button>
|
||||
<!--Stop-->
|
||||
<x-button
|
||||
v-show="item.state !== 'STOP'"
|
||||
type="warning"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-pause"
|
||||
disabled="true">
|
||||
</x-button>
|
||||
<span>
|
||||
<el-button
|
||||
v-show="scope.row.state !== 'PAUSE'"
|
||||
type="warning"
|
||||
size="mini"
|
||||
circle
|
||||
icon="el-icon-close"
|
||||
disabled="true">
|
||||
</el-button>
|
||||
</span>
|
||||
|
||||
<!--delete-->
|
||||
<x-button
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-trash"
|
||||
:disabled="true">
|
||||
</x-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
circle
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
:disabled="true">
|
||||
</el-button>
|
||||
|
||||
<!--Gantt-->
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-gantt"
|
||||
disabled="true">
|
||||
</x-button>
|
||||
<el-button
|
||||
type="success"
|
||||
circle
|
||||
size="mini"
|
||||
icon="el-icon-s-operation"
|
||||
disabled="true">
|
||||
</el-button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<x-poptip
|
||||
ref="poptipDeleteAll"
|
||||
placement="bottom-start"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete(-1)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete({},-1)">{{$t('Confirm')}}</x-button>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button size="xsmall" :disabled="!strDelete" style="position: absolute; bottom: -48px; left: 22px;" >{{$t('Delete')}}</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
<el-tooltip :content="$t('delete')" placement="top" :enterable="false">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete({},-1)"
|
||||
>
|
||||
<el-button style="position: absolute; bottom: -48px; left: 19px;" type="primary" size="mini" :disabled="!strDelete" slot="reference">{{$t('Delete')}}</el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -337,19 +254,7 @@
|
|||
*/
|
||||
_rtState (code) {
|
||||
let o = tasksState[code]
|
||||
return `<em class="ansfont ${o.icoUnicode} ${o.isSpin ? 'as as-spin' : ''}" style="color:${o.color}" data-toggle="tooltip" data-container="body" title="${o.desc}"></em>`
|
||||
},
|
||||
/**
|
||||
* Close the delete layer
|
||||
*/
|
||||
_closeDelete (i) {
|
||||
// close batch
|
||||
if (i < 0) {
|
||||
this.$refs['poptipDeleteAll'].doClose()
|
||||
return
|
||||
}
|
||||
// close one
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
return `<em class="fa ansfont ${o.icoUnicode} ${o.isSpin ? 'as as-spin' : ''}" style="color:${o.color}" data-toggle="tooltip" data-container="body" title="${o.desc}"></em>`
|
||||
},
|
||||
/**
|
||||
* delete
|
||||
|
|
@ -364,11 +269,9 @@
|
|||
this.deleteInstance({
|
||||
processInstanceId: item.id
|
||||
}).then(res => {
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
this._onUpdate()
|
||||
this.$message.success(res.msg)
|
||||
}).catch(e => {
|
||||
this.$refs[`poptip-delete-${i}`][0].doClose()
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
|
@ -383,6 +286,7 @@
|
|||
* @param REPEAT_RUNNING
|
||||
*/
|
||||
_reRun (item, index) {
|
||||
console.log(index)
|
||||
this._countDownFn({
|
||||
id: item.id,
|
||||
executeType: 'REPEAT_RUNNING',
|
||||
|
|
@ -525,20 +429,25 @@
|
|||
})
|
||||
this._arrDelChange()
|
||||
},
|
||||
// _arrDelChange (v) {
|
||||
// let arr = []
|
||||
// this.list.forEach((item)=>{
|
||||
// if (item.isCheck) {
|
||||
// arr.push(item.id)
|
||||
// }
|
||||
// })
|
||||
// this.strDelete = _.join(arr, ',')
|
||||
// if (v === false) {
|
||||
// this.checkAll = false
|
||||
// }
|
||||
// },
|
||||
_arrDelChange (v) {
|
||||
let arr = []
|
||||
this.list.forEach((item)=>{
|
||||
if (item.isCheck) {
|
||||
arr.push(item.id)
|
||||
}
|
||||
})
|
||||
arr = _.map(v, 'id');
|
||||
console.log(arr)
|
||||
this.strDelete = _.join(arr, ',')
|
||||
if (v === false) {
|
||||
this.checkAll = false
|
||||
}
|
||||
},
|
||||
_batchDelete () {
|
||||
this.$refs['poptipDeleteAll'].doClose()
|
||||
this.batchDeleteInstance({
|
||||
processInstanceIds: this.strDelete
|
||||
}).then(res => {
|
||||
|
|
|
|||
|
|
@ -25,7 +25,16 @@
|
|||
<m-list :process-instance-list="processInstanceList" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
|
||||
</m-list>
|
||||
<div class="page-box">
|
||||
<x-page :current="parseInt(searchParams.pageNo)" :total="total" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="searchParams.pageSize"
|
||||
:current-page.sync="searchParams.pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!processInstanceList.length && total<=0">
|
||||
|
|
@ -182,7 +191,6 @@
|
|||
}
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
// Cycle acquisition status
|
||||
this.setIntervalP = setInterval(() => {
|
||||
this._debounceGET('false')
|
||||
|
|
|
|||
|
|
@ -14,29 +14,28 @@
|
|||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
import _ from 'lodash';
|
||||
import _ from 'lodash'
|
||||
import i18n from '@/module/i18n/index.js'
|
||||
|
||||
const getCategory = (categoryDic, { workFlowPublishStatus, schedulePublishStatus, id }, sourceWorkFlowId) => {
|
||||
if (id === sourceWorkFlowId) return categoryDic['active']
|
||||
if (id === sourceWorkFlowId) return categoryDic.active
|
||||
switch (true) {
|
||||
case workFlowPublishStatus === '0':
|
||||
return categoryDic['0'];
|
||||
return categoryDic['0']
|
||||
case workFlowPublishStatus === '1' && schedulePublishStatus === '0':
|
||||
return categoryDic['10'];
|
||||
return categoryDic['10']
|
||||
case workFlowPublishStatus === '1' && schedulePublishStatus === '1':
|
||||
default:
|
||||
return categoryDic['1'];
|
||||
return categoryDic['1']
|
||||
}
|
||||
}
|
||||
|
||||
export default function (locations, links, sourceWorkFlowId, isShowLabel) {
|
||||
|
||||
const categoryDic = {
|
||||
'active': { color: '#2D8DF0', category: i18n.$t('KinshipStateActive')},
|
||||
'1': { color: '#00C800', category: i18n.$t('KinshipState1')},
|
||||
'0': { color: '#999999', category: i18n.$t('KinshipState0')},
|
||||
'10': { color: '#FF8F05', category: i18n.$t('KinshipState10')},
|
||||
active: { color: '#2D8DF0', category: i18n.$t('KinshipStateActive') },
|
||||
1: { color: '#00C800', category: i18n.$t('KinshipState1') },
|
||||
0: { color: '#999999', category: i18n.$t('KinshipState0') },
|
||||
10: { color: '#FF8F05', category: i18n.$t('KinshipState10') }
|
||||
}
|
||||
const newData = _.map(locations, (item) => {
|
||||
const { color, category } = getCategory(categoryDic, item, sourceWorkFlowId)
|
||||
|
|
@ -45,27 +44,27 @@ export default function (locations, links, sourceWorkFlowId, isShowLabel) {
|
|||
emphasis: {
|
||||
itemStyle: {
|
||||
color
|
||||
},
|
||||
}
|
||||
},
|
||||
category
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
const categories = [
|
||||
{ name: categoryDic.active.category},
|
||||
{ name: categoryDic['1'].category},
|
||||
{ name: categoryDic['0'].category},
|
||||
{ name: categoryDic['10'].category},
|
||||
{ name: categoryDic.active.category },
|
||||
{ name: categoryDic['1'].category },
|
||||
{ name: categoryDic['0'].category },
|
||||
{ name: categoryDic['10'].category }
|
||||
]
|
||||
let option = {
|
||||
const option = {
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
triggerOn: 'mousemove',
|
||||
backgroundColor: '#2D303A',
|
||||
padding: [8, 12],
|
||||
formatter: (params) => {
|
||||
if (!params.data.name) return '';
|
||||
const { name, scheduleStartTime, scheduleEndTime, crontab, workFlowPublishStatus, schedulePublishStatus } = params.data;
|
||||
if (!params.data.name) return ''
|
||||
const { name, scheduleStartTime, scheduleEndTime, crontab, workFlowPublishStatus, schedulePublishStatus } = params.data
|
||||
const str = `
|
||||
工作流名字：${name}<br/>
|
||||
调度开始时间：${scheduleStartTime}<br/>
|
||||
|
|
@ -74,7 +73,7 @@ export default function (locations, links, sourceWorkFlowId, isShowLabel) {
|
|||
工作流发布状态：${workFlowPublishStatus}<br/>
|
||||
调度发布状态：${schedulePublishStatus}<br/>
|
||||
`
|
||||
return str;
|
||||
return str
|
||||
},
|
||||
color: '#2D303A',
|
||||
textStyle: {
|
||||
|
|
@ -85,16 +84,16 @@ export default function (locations, links, sourceWorkFlowId, isShowLabel) {
|
|||
lineHeight: 12,
|
||||
align: 'left',
|
||||
padding: [4, 4, 4, 4]
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
color: [categoryDic.active.color, categoryDic['1'].color, categoryDic['0'].color, categoryDic['10'].color],
|
||||
legend: [{
|
||||
orient: 'horizontal',
|
||||
top: 6,
|
||||
left: 6,
|
||||
data: categories,
|
||||
data: categories
|
||||
}],
|
||||
series: [{
|
||||
type: 'graph',
|
||||
|
|
@ -111,9 +110,9 @@ export default function (locations, links, sourceWorkFlowId, isShowLabel) {
|
|||
show: isShowLabel,
|
||||
position: 'inside',
|
||||
formatter: (params) => {
|
||||
if (!params.data.name) return '';
|
||||
if (!params.data.name) return ''
|
||||
const str = params.data.name.split('_').map(item => `{a|${item}\n}`).join('')
|
||||
return str;
|
||||
return str
|
||||
},
|
||||
color: '#222222',
|
||||
textStyle: {
|
||||
|
|
@ -124,7 +123,7 @@ export default function (locations, links, sourceWorkFlowId, isShowLabel) {
|
|||
lineHeight: 12,
|
||||
align: 'left',
|
||||
padding: [4, 4, 4, 4]
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -139,7 +138,7 @@ export default function (locations, links, sourceWorkFlowId, isShowLabel) {
|
|||
color: '#999999'
|
||||
}
|
||||
}]
|
||||
};
|
||||
}
|
||||
|
||||
return option
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,33 +18,33 @@
|
|||
<div class="home-main index-model">
|
||||
<div class="project-kinship-content">
|
||||
<div class="search-bar">
|
||||
<x-select filterable clearable
|
||||
<el-select filterable clearable
|
||||
:placeholder="$t('Process Name')"
|
||||
@on-change="onChange"
|
||||
@change="onChange"
|
||||
:style="inputFocusStyle"
|
||||
v-tooltip="tooltipOption(currentItemName)"
|
||||
size="small">
|
||||
<x-option
|
||||
<el-option
|
||||
v-for="work in workList"
|
||||
:key="work.id"
|
||||
:value="work.id"
|
||||
:label="work.name"
|
||||
v-tooltip="tooltipOption(work.name)"
|
||||
>
|
||||
</x-option>
|
||||
</x-select>
|
||||
<x-button type="primary"
|
||||
icon="ans-icon-dot-circle"
|
||||
size="small"
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-button type="primary"
|
||||
icon="fa-dot-circle-o"
|
||||
size="mini"
|
||||
v-tooltip.small.top.start="$t('Reset')"
|
||||
@click="reset"
|
||||
></x-button>
|
||||
<x-button type="ghost"
|
||||
icon="ans-icon-eye"
|
||||
size="small"
|
||||
></el-button>
|
||||
<el-button
|
||||
icon="el-icon-view"
|
||||
size="mini"
|
||||
v-tooltip.small.top="$t('Dag label display control')"
|
||||
@click="changeLabel"
|
||||
></x-button>
|
||||
></el-button>
|
||||
</div>
|
||||
<graph-grid v-if="!isLoading && !!locations.length" :isShowLabel="isShowLabel"></graph-grid>
|
||||
<template v-if="!isLoading && !locations.length">
|
||||
|
|
|
|||
|
|
@ -21,24 +21,24 @@
|
|||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Project Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="projectName"
|
||||
maxlength="60"
|
||||
:placeholder="$t('Please enter name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="description"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
</div>
|
||||
|
|
@ -83,8 +83,12 @@
|
|||
this.$refs['popup'].spinnerLoading = true
|
||||
|
||||
this.store.dispatch(`projects/${this.item ? 'updateProjects' : 'createProjects'}`, param).then(res => {
|
||||
this.$emit('onUpdate')
|
||||
this.$message.success(res.msg)
|
||||
this.$emit('_onUpdate')
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success',
|
||||
offset: 70
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.$refs['popup'].spinnerLoading = false
|
||||
}, 800)
|
||||
|
|
|
|||
|
|
@ -17,99 +17,52 @@
|
|||
<template>
|
||||
<div class="list-model">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th scope="col">
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Project Name')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Owned Users')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Process Define Count')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Process Instance Running Count')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Description')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Create Time')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Update Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="80">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="$index">
|
||||
<td>
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>
|
||||
<a href="javascript:" @click="_switchProjects(item)" class="links">{{item.name}}</a>
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.userName || '-'}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.defCount}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.instRunningCount}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.description" class="ellipsis" v-tooltip.large.top.start.light="{text: item.description, maxWidth: '500px'}">{{item.description}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.createTime">{{item.createTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.updateTime">{{item.updateTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Edit')"
|
||||
@click="_edit(item)"
|
||||
icon="ans-icon-edit">
|
||||
</x-button>
|
||||
<x-poptip
|
||||
:ref="'poptip-' + $index"
|
||||
placement="bottom-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column :label="$t('Project Name')">
|
||||
<template slot-scope="scope">
|
||||
<el-popover trigger="hover" placement="top">
|
||||
<p>{{ scope.row.name }}</p>
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<a href="javascript:" class="links" @click="_switchProjects(scope.row)">{{ scope.row.name }}</a>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('delete')"
|
||||
icon="ans-icon-trash">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userName" :label="$t('Owned Users')"></el-table-column>
|
||||
<el-table-column prop="defCount" :label="$t('Process Define Count')"></el-table-column>
|
||||
<el-table-column prop="instRunningCount" :label="$t('Process Instance Running Count')"></el-table-column>
|
||||
<el-table-column prop="description" :label="$t('Description')" width="200"></el-table-column>
|
||||
<el-table-column :label="$t('Create Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.createTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Update Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.updateTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip :content="$t('Edit')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-edit-outline" @click="_edit(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top" :enterable="false">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete(scope.row,scope.row.id)"
|
||||
>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -139,9 +92,6 @@
|
|||
localStore.setItem('projectId', `${item.id}`)
|
||||
this.$router.push({ path: `/projects/index` })
|
||||
},
|
||||
_closeDelete (i) {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
},
|
||||
/**
|
||||
* Delete Project
|
||||
* @param item Current record
|
||||
|
|
@ -151,11 +101,9 @@
|
|||
this.deleteProjects({
|
||||
projectId: item.id
|
||||
}).then(res => {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
this.$emit('on-update')
|
||||
this.$message.success(res.msg)
|
||||
}).catch(e => {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
|
|
|
|||
|
|
@ -19,7 +19,12 @@
|
|||
<template slot="conditions">
|
||||
<m-conditions @on-conditions="_onConditions">
|
||||
<template slot="button-group">
|
||||
<x-button type="ghost" size="small" @click="_create('')">{{$t('Create Project')}}</x-button>
|
||||
<el-button size="mini" @click="_create('')">{{$t('Create Project')}}</el-button>
|
||||
<el-dialog
|
||||
:visible.sync="createProjectDialog"
|
||||
width="40%">
|
||||
<m-create-project :item="item" @_onUpdate="_onUpdate"></m-create-project>
|
||||
</el-dialog>
|
||||
</template>
|
||||
</m-conditions>
|
||||
</template>
|
||||
|
|
@ -27,7 +32,16 @@
|
|||
<template v-if="projectsList.length || total>0">
|
||||
<m-list :projects-list="projectsList" @on-update="_onUpdate" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize"></m-list>
|
||||
<div class="page-box">
|
||||
<x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="searchParams.pageSize"
|
||||
:current-page.sync="searchParams.pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!projectsList.length && total<=0">
|
||||
|
|
@ -60,7 +74,9 @@
|
|||
pageSize: 10,
|
||||
pageNo: 1,
|
||||
searchVal: ''
|
||||
}
|
||||
},
|
||||
createProjectDialog: false,
|
||||
item: {}
|
||||
}
|
||||
},
|
||||
mixins: [listUrlParamHandle],
|
||||
|
|
@ -82,29 +98,11 @@
|
|||
this.searchParams.pageSize = val
|
||||
},
|
||||
_create (item) {
|
||||
let self = this
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mCreateProject, {
|
||||
on: {
|
||||
onUpdate () {
|
||||
self._debounceGET()
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: item
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.createProjectDialog = true
|
||||
this.item = item
|
||||
},
|
||||
_onUpdate () {
|
||||
this.createProjectDialog = false
|
||||
this._debounceGET()
|
||||
},
|
||||
_getList (flag) {
|
||||
|
|
@ -133,7 +131,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
},
|
||||
components: { mListConstruction, mSpin, mConditions, mList, mCreateProject, mNoData }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -17,104 +17,66 @@
|
|||
<template>
|
||||
<div class="list-model">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th scope="col" style="min-width: 50px">
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 200px;max-width: 300px;">
|
||||
<span>{{$t('Name')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 200px;max-width: 300px;">
|
||||
<span>{{$t('Process Instance')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 60px">
|
||||
<span>{{$t('Executor')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 70px">
|
||||
<span style="margin-left: 5px">{{$t('Node Type')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 30px">
|
||||
<span>{{$t('State')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('Submit Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('Start Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('End Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 130px">
|
||||
<span>{{$t('host')}}</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 70px">
|
||||
<span>{{$t('Duration')}}(s)</span>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 60px">
|
||||
<div style="width: 50px">
|
||||
<span>{{$t('Retry Count')}}</span>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column prop="name" :label="$t('Name')"></el-table-column>
|
||||
<el-table-column :label="$t('Process Instance')" min-width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-popover trigger="hover" placement="top">
|
||||
<p>{{ scope.row.processInstanceName }}</p>
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<a href="javascript:" class="links" @click="_go(scope.row)"><span class="ellipsis" :title="scope.row.processInstanceName">{{scope.row.processInstanceName}}</span></a>
|
||||
</div>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="executorName" :label="$t('Executor')"></el-table-column>
|
||||
<el-table-column prop="taskType" :label="$t('Node Type')"></el-table-column>
|
||||
<el-table-column :label="$t('State')" width="50">
|
||||
<template slot-scope="scope">
|
||||
<span v-html="_rtState(scope.row.state)" style="cursor: pointer;"></span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Submit Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.scheduleTime">{{scope.row.scheduleTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Start Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.startTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('End Time')" width="135">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.endTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="host" :label="$t('host')" width="150"></el-table-column>
|
||||
<el-table-column prop="duration" :label="$t('Duration')"></el-table-column>
|
||||
<el-table-column prop="retryTimes" :label="$t('Retry Count')"></el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="80" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-tooltip :content="$t('Force success')" placement="top" :enterable="false">
|
||||
<span>
|
||||
<el-button type="primary" size="mini" icon="el-icon-success" :disabled="!(scope.row.state === 'FAILURE' || scope.row.state === 'NEED_FAULT_TOLERANCE' || scope.row.state === 'KILL')" @click="_forceSuccess(scope.row)" circle></el-button>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('View log')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" :disabled="scope.row.taskType==='SUB_PROCESS'? true: false" icon="el-icon-tickets" @click="_refreshLog(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</th>
|
||||
<th scope="col" style="min-width: 60px">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="item.id">
|
||||
<td>
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td style="min-width: 200px;max-width: 300px;padding-right: 10px;">
|
||||
<span class="ellipsis" :title="item.name">{{item.name}}</span>
|
||||
</td>
|
||||
<td style="min-width: 200px;max-width: 300px;padding-right: 10px;"><a href="javascript:" class="links" @click="_go(item)"><span class="ellipsis" :title="item.processInstanceName">{{item.processInstanceName}}</span></a></td>
|
||||
<td>
|
||||
<span v-if="item.executorName">{{item.executorName}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td><span style="margin-left: 5px">{{item.taskType}}</span></td>
|
||||
<td><span v-html="_rtState(item.state)" style="cursor: pointer;"></span></td>
|
||||
<td>
|
||||
<span v-if="item.submitTime">{{item.submitTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.startTime">{{item.startTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.endTime">{{item.endTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td><span>{{item.host || '-'}}</span></td>
|
||||
<td><span>{{item.duration}}</span></td>
|
||||
<td><span>{{item.retryTimes}}</span></td>
|
||||
<td>
|
||||
<x-button
|
||||
v-if="item.state === 'FAILURE' || item.state === 'NEED_FAULT_TOLERANCE' || item.state === 'KILL'"
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Force success')"
|
||||
icon="ans-icon-success-solid"
|
||||
@click="_forceSuccess(item)">
|
||||
</x-button>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('View log')"
|
||||
icon="ans-icon-log"
|
||||
:disabled="item.taskType==='SUB_PROCESS'? true: false"
|
||||
@click="_refreshLog(item)">
|
||||
</x-button>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:visible.sync="logDialog"
|
||||
width="30%">
|
||||
<m-log :item="item" :source="source" :logId="logId" @ok="ok" @close="close"></m-log>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -129,7 +91,11 @@
|
|||
return {
|
||||
list: [],
|
||||
isAuth: Permissions.getAuth(),
|
||||
backfillItem: {}
|
||||
backfillItem: {},
|
||||
logDialog: false,
|
||||
item: {},
|
||||
source: '',
|
||||
logId: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
@ -144,31 +110,17 @@
|
|||
return `<em class="${o.icoUnicode} ${o.isSpin ? 'as as-spin' : ''}" style="color:${o.color}" data-toggle="tooltip" data-container="body" title="${o.desc}"></em>`
|
||||
},
|
||||
_refreshLog (item) {
|
||||
let self = this
|
||||
let instance = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mLog, {
|
||||
on: {
|
||||
ok () {
|
||||
},
|
||||
close () {
|
||||
instance.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
self: self,
|
||||
source: 'list',
|
||||
logId: item.id
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = item
|
||||
this.source = 'list'
|
||||
this.logId = item.id
|
||||
this.logDialog = true
|
||||
},
|
||||
ok () {},
|
||||
|
||||
close () {
|
||||
this.logDialog = false
|
||||
},
|
||||
|
||||
_forceSuccess (item) {
|
||||
this.forceTaskSuccess({taskInstanceId: item.id}).then(res => {
|
||||
if (res.code === 0) {
|
||||
|
|
@ -197,6 +149,6 @@
|
|||
mounted () {
|
||||
this.list = this.taskInstanceList
|
||||
},
|
||||
components: { }
|
||||
components: { mLog}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,16 @@
|
|||
<m-list :task-instance-list="taskInstanceList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
|
||||
</m-list>
|
||||
<div class="page-box">
|
||||
<x-page :current="parseInt(searchParams.pageNo)" :total="total" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="searchParams.pageSize"
|
||||
:current-page.sync="searchParams.pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!taskInstanceList.length">
|
||||
|
|
@ -147,7 +156,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
// Cycle acquisition status
|
||||
this.setIntervalP = setInterval(() => {
|
||||
this._debounceGET('false')
|
||||
|
|
|
|||
|
|
@ -26,7 +26,6 @@
|
|||
name: 'resource-index',
|
||||
components: { mSecondaryMenu },
|
||||
mounted() {
|
||||
this.$modal.destroy()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,6 @@
|
|||
export default {
|
||||
name: 'file-manage-index',
|
||||
mounted() {
|
||||
this.$modal.destroy()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -21,39 +21,39 @@
|
|||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('File Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="fileName"
|
||||
maxlength="60"
|
||||
style="width: 300px;"
|
||||
:placeholder="$t('Please enter name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('File Format')}}</template>
|
||||
<template slot="content">
|
||||
<x-select v-model="suffix" style="width: 100px;" @on-change="_onChange">
|
||||
<x-option
|
||||
<el-select v-model="suffix" style="width: 100px;" size="small" @change="_onChange">
|
||||
<el-option
|
||||
v-for="city in fileTypeList"
|
||||
:key="city"
|
||||
:value="city"
|
||||
:label="city">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="description"
|
||||
style="width: 430px;"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
|
|
@ -66,8 +66,8 @@
|
|||
<template slot="name"> </template>
|
||||
<template slot="content">
|
||||
<div class="submit">
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </x-button>
|
||||
<x-button type="text" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </x-button>
|
||||
<el-button type="primary" size="small" round :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </el-button>
|
||||
<el-button type="text" size="small" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
|
|
@ -172,7 +172,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
this._handlerEditor()
|
||||
},
|
||||
destroyed () {
|
||||
|
|
|
|||
|
|
@ -21,47 +21,34 @@
|
|||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Folder Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="name"
|
||||
maxlength="60"
|
||||
style="width: 300px;"
|
||||
:placeholder="$t('Please enter name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<!-- <m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Folder Format')}}</template>
|
||||
<template slot="content">
|
||||
<x-select v-model="type" style="width: 100px;">
|
||||
<x-option
|
||||
v-for="item in folderList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</template>
|
||||
</m-list-box-f> -->
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="description"
|
||||
style="width: 430px;"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"> </template>
|
||||
<template slot="content">
|
||||
<div class="submit">
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </x-button>
|
||||
<x-button type="text" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </x-button>
|
||||
<el-button type="primary" size="mini" round :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </el-button>
|
||||
<el-button type="text" size="mini" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
|
|
@ -128,7 +115,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
},
|
||||
destroyed () {
|
||||
},
|
||||
|
|
|
|||
|
|
@ -21,34 +21,34 @@
|
|||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Folder Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="name"
|
||||
maxlength="60"
|
||||
style="width: 300px;"
|
||||
:placeholder="$t('Please enter name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="description"
|
||||
style="width: 430px;"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"> </template>
|
||||
<template slot="content">
|
||||
<div class="submit">
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </x-button>
|
||||
<x-button type="text" @click="() => $router.push({name: 'resource-udf'})"> {{$t('Cancel')}} </x-button>
|
||||
<el-button type="primary" size="mini" round :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </el-button>
|
||||
<el-button type="text" size="mini" @click="() => $router.push({name: 'resource-udf'})"> {{$t('Cancel')}} </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
|
|
@ -107,7 +107,6 @@
|
|||
this.$message.warning(`${i18n.$t('Please enter resource folder name')}`)
|
||||
return false
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
},
|
||||
|
|
@ -115,7 +114,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
},
|
||||
destroyed () {
|
||||
},
|
||||
|
|
|
|||
|
|
@ -21,10 +21,10 @@
|
|||
<h2>
|
||||
<span>{{name}}</span>
|
||||
<div class="down">
|
||||
<em class="ans-icon-download" style="font-size:20px" data-container="body" data-toggle="tooltip" :title="$t('Download Details')" @click="_downloadFile"></em>
|
||||
<em class="el-icon-download" style="font-size:20px" data-container="body" data-toggle="tooltip" :title="$t('Download Details')" @click="_downloadFile"></em>
|
||||
<em>{{size}}</em>
|
||||
|
||||
<em class="ans-icon-fail-empty" style="font-size:20px" data-container="body" data-toggle="tooltip" :title="$t('Return')" @click="close()"></em>
|
||||
<em class="el-icon-circle-close" style="font-size:20px" data-container="body" data-toggle="tooltip" :title="$t('Return')" @click="close()"></em>
|
||||
|
||||
</div>
|
||||
</h2>
|
||||
|
|
@ -87,7 +87,7 @@
|
|||
this.$router.go(-1)
|
||||
},
|
||||
_downloadFile () {
|
||||
downloadFile('resources/download', {
|
||||
downloadFile('/resources/download', {
|
||||
id: this.$route.params.id
|
||||
})
|
||||
},
|
||||
|
|
|
|||
|
|
@ -27,8 +27,8 @@
|
|||
<textarea id="code-edit-mirror" name="code-edit-mirror"></textarea>
|
||||
</div>
|
||||
<div class="submit-c">
|
||||
<x-button type="text" shape="circle" @click="close()" :disabled="disabled"> {{$t('Return')}} </x-button>
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Save')}} </x-button>
|
||||
<el-button type="text" @click="close()" :disabled="disabled" size="small"> {{$t('Return')}} </el-button>
|
||||
<el-button type="primary" :loading="spinnerLoading" @click="ok()" round size="small">{{spinnerLoading ? 'Loading...' : $t('Save')}} </el-button>
|
||||
</div>
|
||||
</template>
|
||||
<m-no-data :msg="msg" v-if="msg"></m-no-data>
|
||||
|
|
|
|||
|
|
@ -17,113 +17,67 @@
|
|||
<template>
|
||||
<div class="list-model">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th scope="col">
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Name')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Whether directory')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('File Name')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Description')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="100">
|
||||
<span>{{$t('Size')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="140">
|
||||
<span>{{$t('Update Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="140">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="item.id">
|
||||
<td>
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="ellipsis" v-tooltip.large.top.start.light="{text: item.alias, maxWidth: '500px'}">
|
||||
<a href="javascript:" class="links" @click="_go(item)">{{item.alias}}</a>
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.directory? $t('Yes') : $t('No')}}</span>
|
||||
</td>
|
||||
<td><span class="ellipsis" v-tooltip.large.top.start.light="{text: item.fileName, maxWidth: '500px'}">{{item.fileName}}</span></td>
|
||||
<td>
|
||||
<span v-if="item.description" class="ellipsis" v-tooltip.large.top.start.light="{text: item.description, maxWidth: '500px'}">{{item.description}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{_rtSize(item.size)}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.updateTime">{{item.updateTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Edit')"
|
||||
:disabled="_rtDisb(item)"
|
||||
@click="_edit(item,$index)"
|
||||
icon="ans-icon-edit">
|
||||
</x-button>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-play"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Rename')"
|
||||
@click="_rename(item,$index)">
|
||||
</x-button>
|
||||
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Download')"
|
||||
:disabled="item.directory? true: false"
|
||||
@click="_downloadFile(item)"
|
||||
icon="ans-icon-download">
|
||||
</x-button>
|
||||
|
||||
<x-poptip
|
||||
:ref="'poptip-' + $index"
|
||||
placement="bottom-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column :label="$t('Name')">
|
||||
<template slot-scope="scope">
|
||||
<el-popover trigger="hover" placement="top">
|
||||
<p>{{ scope.row.alias }}</p>
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<a href="javascript:" class="links" @click="_go(scope.row)">{{ scope.row.alias }}</a>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
icon="ans-icon-trash"
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('delete')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Whether directory')" width="100">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.directory? $t('Yes') : $t('No')}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="fileName" :label="$t('File Name')"></el-table-column>
|
||||
<el-table-column prop="description" :label="$t('Description')" width="200"></el-table-column>
|
||||
<el-table-column :label="$t('Size')">
|
||||
<template slot-scope="scope">
|
||||
{{_rtSize(scope.row.size)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Update Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.updateTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip :content="$t('Edit')" placement="top">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-edit-outline" @click="_edit(scope.row)" :disabled="_rtDisb(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Rename')" placement="top">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-edit" @click="_rename(scope.row,scope.$index)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Download')" placement="top">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-download" @click="_downloadFile(scope.row)" :disabled="scope.row.directory? true: false" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete(scope.row,scope.row.id)"
|
||||
>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:visible.sync="renameDialog"
|
||||
width="45%">
|
||||
<m-rename :item="item" @onUpDate="onUpDate" @close="close"></m-rename>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -138,7 +92,10 @@
|
|||
name: 'file-manage-list',
|
||||
data () {
|
||||
return {
|
||||
list: []
|
||||
list: [],
|
||||
renameDialog: false,
|
||||
item: {},
|
||||
index: null
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
@ -169,47 +126,31 @@
|
|||
_rtSize (val) {
|
||||
return bytesToSize(parseInt(val))
|
||||
},
|
||||
_closeDelete (i) {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
},
|
||||
_delete (item, i) {
|
||||
this.deleteResource({
|
||||
id: item.id
|
||||
}).then(res => {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
this.$emit('on-update')
|
||||
this.$message.success(res.msg)
|
||||
}).catch(e => {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
_rename (item, i) {
|
||||
let self = this
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mRename, {
|
||||
on: {
|
||||
onUpDate (item) {
|
||||
self.$set(self.list, i, item)
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: item
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = item
|
||||
this.index = i
|
||||
this.renameDialog = true
|
||||
},
|
||||
|
||||
onUpDate(item) {
|
||||
this.$set(this.list, this.index, item)
|
||||
this.renameDialog = false
|
||||
},
|
||||
|
||||
close() {
|
||||
this.renameDialog = false
|
||||
},
|
||||
|
||||
_rtDisb ({ alias, size }) {
|
||||
let i = alias.lastIndexOf('.')
|
||||
let a = alias.substring(i, alias.length)
|
||||
|
|
@ -235,6 +176,6 @@
|
|||
mounted () {
|
||||
this.list = this.fileResourcesList
|
||||
},
|
||||
components: { }
|
||||
components: { mRename }
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -15,29 +15,29 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
<template>
|
||||
<m-popup :ok-text="$t('Rename')" :nameText="$t('Rename')" @ok="_ok" :asyn-loading="true">
|
||||
<m-popup :ok-text="$t('Rename')" :nameText="$t('Rename')" @ok="_ok" @close="close" :asyn-loading="true">
|
||||
<template slot="content">
|
||||
<div class="resource-rename-model">
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="name"
|
||||
:placeholder="$t('Please enter name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="description"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
</div>
|
||||
|
|
@ -101,6 +101,9 @@
|
|||
resolve()
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
|
|
|
|||
|
|
@ -19,11 +19,11 @@
|
|||
<template slot="conditions">
|
||||
<m-conditions @on-conditions="_onConditions">
|
||||
<template slot="button-group">
|
||||
<x-button-group size="small" >
|
||||
<x-button type="ghost" @click="() => $router.push({name: 'resource-file-createFolder'})">{{$t('Create folder')}}</x-button>
|
||||
<x-button type="ghost" @click="() => $router.push({name: 'resource-file-create'})">{{$t('Create File')}}</x-button>
|
||||
<x-button type="ghost" @click="_uploading">{{$t('Upload Files')}}</x-button>
|
||||
</x-button-group>
|
||||
<el-button-group size="small" >
|
||||
<el-button size="mini" @click="() => $router.push({name: 'resource-file-createFolder'})">{{$t('Create folder')}}</el-button>
|
||||
<el-button size="mini" @click="() => $router.push({name: 'resource-file-create'})">{{$t('Create File')}}</el-button>
|
||||
<el-button size="mini" @click="_uploading">{{$t('Upload Files')}}</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</m-conditions>
|
||||
</template>
|
||||
|
|
@ -32,7 +32,16 @@
|
|||
<m-list @on-update="_onUpdate" :file-resources-list="fileResourcesList" :page-no="searchParams.pageNo" :page-size="searchParams.pageSize">
|
||||
</m-list>
|
||||
<div class="page-box">
|
||||
<x-page :current="parseInt(searchParams.pageNo)" :total="total" :page-size="searchParams.pageSize" show-elevator @on-change="_page" show-sizer :page-size-options="[10,30,50]" @on-size-change="_pageSize"></x-page>
|
||||
<el-pagination
|
||||
background
|
||||
@current-change="_page"
|
||||
@size-change="_pageSize"
|
||||
:page-size="searchParams.pageSize"
|
||||
:current-page.sync="searchParams.pageNo"
|
||||
:page-sizes="[10, 30, 50]"
|
||||
layout="sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="!fileResourcesList.length && total<=0">
|
||||
|
|
@ -129,7 +138,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
},
|
||||
beforeDestroy () {
|
||||
sessionStorage.setItem('isLeft',1)
|
||||
|
|
|
|||
|
|
@ -21,39 +21,40 @@
|
|||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('File Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="fileName"
|
||||
maxlength="60"
|
||||
style="width: 300px;"
|
||||
:placeholder="$t('Please enter name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('File Format')}}</template>
|
||||
<template slot="content">
|
||||
<x-select v-model="suffix" style="width: 100px;" @on-change="_onChange">
|
||||
<x-option
|
||||
<el-select v-model="suffix" size="small" style="width: 100px;" @change="_onChange">
|
||||
<el-option
|
||||
v-for="city in fileTypeList"
|
||||
:key="city"
|
||||
:value="city"
|
||||
:label="city">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="description"
|
||||
style="width: 430px;"
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
|
|
@ -66,8 +67,8 @@
|
|||
<template slot="name"> </template>
|
||||
<template slot="content">
|
||||
<div class="submit">
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </x-button>
|
||||
<x-button type="text" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </x-button>
|
||||
<el-button type="primary" size="mini" round :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </el-button>
|
||||
<el-button type="text" size="mini" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
|
|
@ -173,7 +174,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
this._handlerEditor()
|
||||
},
|
||||
destroyed () {
|
||||
|
|
|
|||
|
|
@ -21,47 +21,34 @@
|
|||
<m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Folder Name')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="input"
|
||||
v-model="name"
|
||||
maxlength="60"
|
||||
style="width: 300px;"
|
||||
:placeholder="$t('Please enter name')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter name')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<!-- <m-list-box-f>
|
||||
<template slot="name"><strong>*</strong>{{$t('Folder Format')}}</template>
|
||||
<template slot="content">
|
||||
<x-select v-model="type" style="width: 100px;">
|
||||
<x-option
|
||||
v-for="item in folderList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:label="item.label">
|
||||
</x-option>
|
||||
</x-select>
|
||||
</template>
|
||||
</m-list-box-f> -->
|
||||
<m-list-box-f>
|
||||
<template slot="name">{{$t('Description')}}</template>
|
||||
<template slot="content">
|
||||
<x-input
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="description"
|
||||
style="width: 430px;"
|
||||
:placeholder="$t('Please enter description')"
|
||||
autocomplete="off">
|
||||
</x-input>
|
||||
size="small"
|
||||
:placeholder="$t('Please enter description')">
|
||||
</el-input>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
<m-list-box-f>
|
||||
<template slot="name"> </template>
|
||||
<template slot="content">
|
||||
<div class="submit">
|
||||
<x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </x-button>
|
||||
<x-button type="text" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </x-button>
|
||||
<el-button type="primary" size="mini" round :loading="spinnerLoading" @click="ok()">{{spinnerLoading ? 'Loading...' : $t('Create')}} </el-button>
|
||||
<el-button type="text" size="mini" @click="() => $router.push({name: 'file'})"> {{$t('Cancel')}} </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</m-list-box-f>
|
||||
|
|
@ -128,7 +115,6 @@
|
|||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.$modal.destroy()
|
||||
},
|
||||
destroyed () {
|
||||
},
|
||||
|
|
|
|||
|
|
@ -17,113 +17,67 @@
|
|||
<template>
|
||||
<div class="list-model">
|
||||
<div class="table-box">
|
||||
<table class="fixed">
|
||||
<tr>
|
||||
<th scope="col">
|
||||
<span>{{$t('#')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Name')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Whether directory')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('File Name')}}</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
<span>{{$t('Description')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="100">
|
||||
<span>{{$t('Size')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="140">
|
||||
<span>{{$t('Update Time')}}</span>
|
||||
</th>
|
||||
<th scope="col" width="140">
|
||||
<span>{{$t('Operation')}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="(item, $index) in list" :key="item.id">
|
||||
<td>
|
||||
<span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="ellipsis" v-tooltip.large.top.start.light="{text: item.alias, maxWidth: '500px'}">
|
||||
<a href="javascript:" class="links" @click="_go(item)">{{item.alias}}</a>
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{item.directory? $t('Yes') : $t('No')}}</span>
|
||||
</td>
|
||||
<td><span class="ellipsis" v-tooltip.large.top.start.light="{text: item.fileName, maxWidth: '500px'}">{{item.fileName}}</span></td>
|
||||
<td>
|
||||
<span v-if="item.description" class="ellipsis" v-tooltip.large.top.start.light="{text: item.description, maxWidth: '500px'}">{{item.description}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{_rtSize(item.size)}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="item.updateTime">{{item.updateTime | formatDate}}</span>
|
||||
<span v-else>-</span>
|
||||
</td>
|
||||
<td>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Edit')"
|
||||
:disabled="_rtDisb(item)"
|
||||
@click="_edit(item,$index)"
|
||||
icon="ans-icon-edit">
|
||||
</x-button>
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
icon="ans-icon-play"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Rename')"
|
||||
@click="_rename(item,$index)">
|
||||
</x-button>
|
||||
|
||||
<x-button
|
||||
type="info"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('Download')"
|
||||
:disabled="item.directory? true: false"
|
||||
@click="_downloadFile(item)"
|
||||
icon="ans-icon-download">
|
||||
</x-button>
|
||||
|
||||
<x-poptip
|
||||
:ref="'poptip-' + $index"
|
||||
placement="bottom-end"
|
||||
width="90">
|
||||
<p>{{$t('Delete?')}}</p>
|
||||
<div style="text-align: right; margin: 0;padding-top: 4px;">
|
||||
<x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
|
||||
<x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
|
||||
<el-table :data="list" size="mini" style="width: 100%">
|
||||
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
|
||||
<el-table-column :label="$t('Name')">
|
||||
<template slot-scope="scope">
|
||||
<el-popover trigger="hover" placement="top">
|
||||
<p>{{ scope.row.alias }}</p>
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<a href="javascript:" class="links" @click="_go(scope.row)">{{ scope.row.alias }}</a>
|
||||
</div>
|
||||
<template slot="reference">
|
||||
<x-button
|
||||
icon="ans-icon-trash"
|
||||
type="error"
|
||||
shape="circle"
|
||||
size="xsmall"
|
||||
data-toggle="tooltip"
|
||||
:title="$t('delete')">
|
||||
</x-button>
|
||||
</template>
|
||||
</x-poptip>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Whether directory')" width="100">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.directory? $t('Yes') : $t('No')}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="fileName" :label="$t('File Name')"></el-table-column>
|
||||
<el-table-column prop="description" :label="$t('Description')" width="200"></el-table-column>
|
||||
<el-table-column :label="$t('Size')">
|
||||
<template slot-scope="scope">
|
||||
{{_rtSize(scope.row.size)}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Update Time')" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.updateTime | formatDate}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('Operation')" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip :content="$t('Edit')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-edit-outline" @click="_edit(scope.row)" :disabled="_rtDisb(scope.row)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Rename')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-edit" @click="_rename(scope.row,scope.$index)" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('Download')" placement="top" :enterable="false">
|
||||
<span><el-button type="primary" size="mini" icon="el-icon-download" @click="_downloadFile(scope.row)" :disabled="scope.row.directory? true: false" circle></el-button></span>
|
||||
</el-tooltip>
|
||||
<el-tooltip :content="$t('delete')" placement="top" :enterable="false">
|
||||
<el-popconfirm
|
||||
:confirmButtonText="$t('Confirm')"
|
||||
:cancelButtonText="$t('Cancel')"
|
||||
icon="el-icon-info"
|
||||
iconColor="red"
|
||||
:title="$t('Delete?')"
|
||||
@onConfirm="_delete(scope.row,scope.row.id)"
|
||||
>
|
||||
<el-button type="danger" size="mini" icon="el-icon-delete" circle slot="reference"></el-button>
|
||||
</el-popconfirm>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:visible.sync="renameDialog"
|
||||
width="45%">
|
||||
<m-rename :item="item" @onUpDate="onUpDate" @close="close"></m-rename>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -139,7 +93,8 @@
|
|||
name: 'file-manage-list',
|
||||
data () {
|
||||
return {
|
||||
list: []
|
||||
list: [],
|
||||
renameDialog: false
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
@ -170,47 +125,31 @@
|
|||
_rtSize (val) {
|
||||
return bytesToSize(parseInt(val))
|
||||
},
|
||||
_closeDelete (i) {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
},
|
||||
_delete (item, i) {
|
||||
this.deleteResource({
|
||||
id: item.id
|
||||
}).then(res => {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
this.$emit('on-update')
|
||||
this.$message.success(res.msg)
|
||||
}).catch(e => {
|
||||
this.$refs[`poptip-${i}`][0].doClose()
|
||||
this.$message.error(e.msg || '')
|
||||
})
|
||||
},
|
||||
_rename (item, i) {
|
||||
let self = this
|
||||
let modal = this.$modal.dialog({
|
||||
closable: false,
|
||||
showMask: true,
|
||||
escClose: true,
|
||||
className: 'v-modal-custom',
|
||||
transitionName: 'opacityp',
|
||||
render (h) {
|
||||
return h(mRename, {
|
||||
on: {
|
||||
onUpDate (item) {
|
||||
self.$set(self.list, i, item)
|
||||
modal.remove()
|
||||
},
|
||||
close () {
|
||||
modal.remove()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
item: item
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.item = item
|
||||
this.index = i
|
||||
this.renameDialog = true
|
||||
},
|
||||
|
||||
onUpDate(item) {
|
||||
this.$set(this.list, this.index, item)
|
||||
this.renameDialog = false
|
||||
},
|
||||
|
||||
close() {
|
||||
this.renameDialog = false
|
||||
},
|
||||
|
||||
_rtDisb ({ alias, size }) {
|
||||
let i = alias.lastIndexOf('.')
|
||||
let a = alias.substring(i, alias.length)
|
||||
|
|
@ -246,6 +185,6 @@
|
|||
mounted () {
|
||||
this.list = this.fileResourcesList
|
||||
},
|
||||
components: { }
|
||||
components: { mRename }
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue