Wangyizhi1
3 years ago
committed by
GitHub
18 changed files with 425 additions and 227 deletions
@ -0,0 +1,52 @@
|
||||
/* |
||||
* 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. |
||||
*/ |
||||
|
||||
import Vue from 'vue' |
||||
import './nodeStatus.scss' |
||||
import i18n from '@/module/i18n' |
||||
import { formatDate } from '@/module/filter/filter' |
||||
|
||||
const nodeStatus = ({ stateProps, taskInstance }) => { |
||||
const Instance = new Vue({ |
||||
data: {}, |
||||
methods: {}, |
||||
render (h) { |
||||
return ( |
||||
<el-tooltip placement="top"> |
||||
<div slot="content"> |
||||
<ul class="status-info"> |
||||
<li>{i18n.$t('Name')}：{taskInstance.name}</li> |
||||
<li>{i18n.$t('State')}：{stateProps.desc}</li> |
||||
<li>{i18n.$t('type')}：{taskInstance.taskType}</li> |
||||
<li>{i18n.$t('host')}：{taskInstance.host || '-'}</li> |
||||
<li>{i18n.$t('Retry Count')}：{taskInstance.retryTimes}</li> |
||||
<li>{i18n.$t('Submit Time')}：{formatDate(taskInstance.submitTime)}</li> |
||||
<li>{i18n.$t('Start Time')}：{formatDate(taskInstance.startTime)}</li> |
||||
<li>{i18n.$t('End Time')}：{taskInstance.endTime ? formatDate(taskInstance.endTime) : '-'}</li> |
||||
</ul> |
||||
</div> |
||||
<em ref="statusIcon" class={`status-icon ${stateProps.icoUnicode}`} style={{ |
||||
color: stateProps.color |
||||
}}></em> |
||||
</el-tooltip> |
||||
) |
||||
} |
||||
}) |
||||
return Instance |
||||
} |
||||
|
||||
export default nodeStatus |
||||
@ -0,0 +1,30 @@
|
||||
/* |
||||
* 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. |
||||
*/ |
||||
|
||||
.status-icon { |
||||
width: 100%; |
||||
height: 100%; |
||||
display: block; |
||||
font-size: 18px; |
||||
} |
||||
|
||||
.status-info { |
||||
margin-bottom: 0; |
||||
li { |
||||
margin-bottom: 5px; |
||||
} |
||||
} |
||||
@ -1,70 +0,0 @@
|
||||
/* |
||||
* 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="dag-status-menu" |
||||
v-show="visible" |
||||
:style="{ |
||||
left: `${left}px`, |
||||
top: `${top}px`, |
||||
}" |
||||
> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { mapState } from 'vuex' |
||||
|
||||
export default { |
||||
name: 'dag-status-menu', |
||||
inject: ['dagChart', 'dagCanvas'], |
||||
data () { |
||||
return { |
||||
visible: false, |
||||
left: 0, |
||||
top: 0, |
||||
currentTask: { |
||||
code: 0, |
||||
name: '', |
||||
type: '' |
||||
} |
||||
} |
||||
}, |
||||
computed: { |
||||
...mapState('dag', ['tasks']) |
||||
}, |
||||
methods: { |
||||
setCurrentTask (task) { |
||||
this.currentTask = { ...this.currentTask, ...task } |
||||
}, |
||||
show (x = 0, y = 0) { |
||||
this.dagCanvas.lockScroller() |
||||
this.visible = true |
||||
this.left = x |
||||
this.top = y |
||||
}, |
||||
hide () { |
||||
this.dagCanvas.unlockScroller() |
||||
this.visible = false |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
@import "./contextMenu"; |
||||
</style> |
||||
Loading…
Reference in new issue