|
|
|
|
@@ -6,7 +6,8 @@
|
|
|
|
|
<component :is="headerIcon"/>
|
|
|
|
|
</el-icon>
|
|
|
|
|
<ellipsis class="name" hover-tip :content="title"/>
|
|
|
|
|
<el-icon v-if="!isRoot && designState" size="20" style="float:right;cursor: pointer" @click.stop="emit('delNode')">
|
|
|
|
|
<el-icon v-if="!isRoot && designState" size="20" style="float:right;cursor: pointer"
|
|
|
|
|
@click.stop="emit('delNode')">
|
|
|
|
|
<Close/>
|
|
|
|
|
</el-icon>
|
|
|
|
|
</div>
|
|
|
|
|
@@ -22,10 +23,14 @@
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else-if="showAvatar">
|
|
|
|
|
<span class="placeholder" v-if="userInfo.length === 0">{{ placeholder }}</span>
|
|
|
|
|
<div v-else v-for="item in userInfo" class="circle-user">
|
|
|
|
|
<span >{{item.name}}</span>
|
|
|
|
|
<div v-else v-for="item in userInfo" class="circle-user">
|
|
|
|
|
<span>{{ item.name }}</span>
|
|
|
|
|
<el-button v-if="item.state==='RUNNING'" type="warning" loading circle class="circle-icon"></el-button>
|
|
|
|
|
<el-button v-else-if="item.state==='UNACTIVATED'" type="info" :icon="More" circle
|
|
|
|
|
class="circle-icon"></el-button>
|
|
|
|
|
<el-button v-else type="success" :icon="Check" circle class="circle-icon"></el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <avatar-ellipsis :row="3" :user-info="userInfo"/>-->
|
|
|
|
|
<!-- <avatar-ellipsis :row="3" :user-info="userInfo"/>-->
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<span class="placeholder" v-if="(content || '').trim() === ''">{{ placeholder }}</span>
|
|
|
|
|
@@ -43,9 +48,9 @@
|
|
|
|
|
<div class="node-footer">
|
|
|
|
|
<div v-if="merge" class="branch-merge">
|
|
|
|
|
<svg-icon name="fenzhi" :class-name="'fen-icon'"/>
|
|
|
|
|
<!-- <img data-v-1e7b1da5=""-->
|
|
|
|
|
<!-- src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAABXlJREFUeF7tmm2IVGUUx3/nLkQUqxmkpAVhSPUllZX8EEGhvVgZQWCU6wcpsqi2mXtnoaBwoqLCufeO9oJYUJQiFZWlZPQCfYiIXkylstTyS1oWWeYWCe6cuLsz7t3r3Ll3du6907oz35bnPM9z/r895zznmWeECf6RCa6fDoBOBExwAp0UmOAB0CmCnRTopECbCZi2nivK1CMD7FpXlH+ydqctKZBz9QyjwkqFG4HzfKK/0gpvl/ulmBWIzAHkVmlRDFY2EihwwLFkRhYQxgzAtHW2CpcBc4CpOsg26eK7yVPYVFwu/9ZzPufq2VLhQBxhAk85lvSF2Y5l/3prjQlAvqR3IjwJTKqz6DeGssQuyLfBsbyjz6PcFgeAZyOwzLFk/QnrjHH/RACYtj6ncHuUCDWYXs7Lz367XEn3inB+1NzauMLGsiW3+u1b2b9lAH22LuiCD2IJED5yTbmiZpt3dAbKT7Hmjhjtdi25oPZnK/uH7dtUCpi2vqVwQ1wRWuHhWkW3StpTEb6IO3fIThhwTemuzWll/0QA5G39FTgrtghhs2vKELA7inra6d38HXvusOEnriWXHo+iFvZvGUDfap3VdYzdzQgIHmd5W7cBc2Ovoax1C3KXZ5/E/i3VgCQciNMD+J1Ug55yXjxo7QfgOdFKCvjyeL/C9MgoEBa5przrt0ti/+C+mRVB/8amrWsU7m2Ql/c5lqwJjre9CDZ1DMFnriXzw0SatvZW4FqBW6o2vwGvCGxyLPmw3rym9g8cwy0XQV8Ix2qEgH0C1ziWNCyceVu1uvZrriVLGqVGsainHO7mRyDynlCvEWupCI7Kxcat6BFg+OwW9ohyfSMIcQF44v/sZovAlRH1I7QVTwyAt1Cjy8hfh9hYvepGQogDoI74HYbSXzHwusTYl7FEAURVcdPWN+NAiAJQTzzCda4p+6N8iDPe1CkQZ8FAtY+E0AhA2uKHszTlT1QkhAHIQnwmAKr1IjQS6gHISnxmABpBCALIUnymAMIgKHxf6wMmH6E3cNTtSLLgZXoKNOgAR6UDyqyq7esKk3znfOriM48AXzc5AmGE1EFgWvXPTMS3DcAJ6TA6XDIT31YAoRCEc5JqcuKc8Kn3AVFO+E4BryvJVHzbI8BzwAdgi2vJ4ihgSY//nyIg8jqctPi2RYBp61wV5qsyR2BFVdhBhBe0wtdisNU15VAagoNrZh4BOVsfFcVCODVUoLBn6E2hIBvShpApgLyt3nvhRXFFCWxwLOmNaz8Wu8wA5G31ntQWNOukwD2OJc80Oy+ufSYAciVdJsJLcZ0K2nV1MbuUk51jnd9oXuoACmW9eHCQj49/T+j3RtiJslPgFxXmoVxe11nhPdeUq8clANPWPoXVQef9D6e1saEHVINHUBYF7Q1lnl2QL5OGkHoE5G19GRhVyBQ+L1tyST0xoa/Iygq3IOvGI4BdwIWjHBeecE15IExM3tYfgJmBOetcU2o9Q2IcsoiAw8Gf0qhyU7kgb4QCcPRTlNGvSspmtzD81J7kJ30AJX0fYeHo2seLjiXLG0TA78CZ/nGFB8uWPJakeG+t9AE4+jjK/XGLWtgTusBix5It4w5ArqRLRTjhl14IW40KD/kre66ki0R4p57IrgozS/2yb9wByDvqhbKX07Xv/oIavMfOP6pFb0pdgcqrbkFuTlp8JingbRIaBfEUHUOYltbtMPUaUNNo2rpeYWk8zSNWqvSmeSvMDIAnybT1boWnY0I4aigL7YJ4bXRqn0wBeCqG7gYVVqFcFapKWXt0gP5nizKQmvLqwpkDqAkaanmhB4MelOkI27XCDjHY7pqyN23htfXbBiArgVH7dABEETrZxzsRcLL/h6P0/Qc1qphfvB2K3wAAAABJRU5ErkJggg=="-->
|
|
|
|
|
<!-- alt="">-->
|
|
|
|
|
<!-- <img data-v-1e7b1da5=""-->
|
|
|
|
|
<!-- src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAABXlJREFUeF7tmm2IVGUUx3/nLkQUqxmkpAVhSPUllZX8EEGhvVgZQWCU6wcpsqi2mXtnoaBwoqLCufeO9oJYUJQiFZWlZPQCfYiIXkylstTyS1oWWeYWCe6cuLsz7t3r3Ll3du6907oz35bnPM9z/r895zznmWeECf6RCa6fDoBOBExwAp0UmOAB0CmCnRTopECbCZi2nivK1CMD7FpXlH+ydqctKZBz9QyjwkqFG4HzfKK/0gpvl/ulmBWIzAHkVmlRDFY2EihwwLFkRhYQxgzAtHW2CpcBc4CpOsg26eK7yVPYVFwu/9ZzPufq2VLhQBxhAk85lvSF2Y5l/3prjQlAvqR3IjwJTKqz6DeGssQuyLfBsbyjz6PcFgeAZyOwzLFk/QnrjHH/RACYtj6ncHuUCDWYXs7Lz367XEn3inB+1NzauMLGsiW3+u1b2b9lAH22LuiCD2IJED5yTbmiZpt3dAbKT7Hmjhjtdi25oPZnK/uH7dtUCpi2vqVwQ1wRWuHhWkW3StpTEb6IO3fIThhwTemuzWll/0QA5G39FTgrtghhs2vKELA7inra6d38HXvusOEnriWXHo+iFvZvGUDfap3VdYzdzQgIHmd5W7cBc2Ovoax1C3KXZ5/E/i3VgCQciNMD+J1Ug55yXjxo7QfgOdFKCvjyeL/C9MgoEBa5przrt0ti/+C+mRVB/8amrWsU7m2Ql/c5lqwJjre9CDZ1DMFnriXzw0SatvZW4FqBW6o2vwGvCGxyLPmw3rym9g8cwy0XQV8Ix2qEgH0C1ziWNCyceVu1uvZrriVLGqVGsainHO7mRyDynlCvEWupCI7Kxcat6BFg+OwW9ohyfSMIcQF44v/sZovAlRH1I7QVTwyAt1Cjy8hfh9hYvepGQogDoI74HYbSXzHwusTYl7FEAURVcdPWN+NAiAJQTzzCda4p+6N8iDPe1CkQZ8FAtY+E0AhA2uKHszTlT1QkhAHIQnwmAKr1IjQS6gHISnxmABpBCALIUnymAMIgKHxf6wMmH6E3cNTtSLLgZXoKNOgAR6UDyqyq7esKk3znfOriM48AXzc5AmGE1EFgWvXPTMS3DcAJ6TA6XDIT31YAoRCEc5JqcuKc8Kn3AVFO+E4BryvJVHzbI8BzwAdgi2vJ4ihgSY//nyIg8jqctPi2RYBp61wV5qsyR2BFVdhBhBe0wtdisNU15VAagoNrZh4BOVsfFcVCODVUoLBn6E2hIBvShpApgLyt3nvhRXFFCWxwLOmNaz8Wu8wA5G31ntQWNOukwD2OJc80Oy+ufSYAciVdJsJLcZ0K2nV1MbuUk51jnd9oXuoACmW9eHCQj49/T+j3RtiJslPgFxXmoVxe11nhPdeUq8clANPWPoXVQef9D6e1saEHVINHUBYF7Q1lnl2QL5OGkHoE5G19GRhVyBQ+L1tyST0xoa/Iygq3IOvGI4BdwIWjHBeecE15IExM3tYfgJmBOetcU2o9Q2IcsoiAw8Gf0qhyU7kgb4QCcPRTlNGvSspmtzD81J7kJ30AJX0fYeHo2seLjiXLG0TA78CZ/nGFB8uWPJakeG+t9AE4+jjK/XGLWtgTusBix5It4w5ArqRLRTjhl14IW40KD/kre66ki0R4p57IrgozS/2yb9wByDvqhbKX07Xv/oIavMfOP6pFb0pdgcqrbkFuTlp8JingbRIaBfEUHUOYltbtMPUaUNNo2rpeYWk8zSNWqvSmeSvMDIAnybT1boWnY0I4aigL7YJ4bXRqn0wBeCqG7gYVVqFcFapKWXt0gP5nizKQmvLqwpkDqAkaanmhB4MelOkI27XCDjHY7pqyN23htfXbBiArgVH7dABEETrZxzsRcLL/h6P0/Qc1qphfvB2K3wAAAABJRU5ErkJggg=="-->
|
|
|
|
|
<!-- alt="">-->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btn">
|
|
|
|
|
<insert-button v-if="designState" @insertNode="type => emit('insertNode', type)"/>
|
|
|
|
|
@@ -62,7 +67,7 @@ import InsertButton from '../common/InsertButton.vue'
|
|
|
|
|
import Ellipsis from '../common/Ellipsis.vue'
|
|
|
|
|
import AvatarEllipsis from '../common/AvatarEllipsis.vue'
|
|
|
|
|
import SvgIcon from '@/components/svgIcon/index.vue'
|
|
|
|
|
import {Close, Warning, Plus} from '@element-plus/icons-vue'
|
|
|
|
|
import {Close, Warning, Plus, Check, More} from '@element-plus/icons-vue'
|
|
|
|
|
|
|
|
|
|
const emit = defineEmits(['insertNode'])
|
|
|
|
|
const props = defineProps({
|
|
|
|
|
@@ -154,7 +159,16 @@ const props = defineProps({
|
|
|
|
|
const designState = computed(() => {
|
|
|
|
|
return props.mode === 'design'
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const getState = (state) => {
|
|
|
|
|
switch (state) {
|
|
|
|
|
case 'finish':
|
|
|
|
|
return 'check'
|
|
|
|
|
case 'UNACTIVATED':
|
|
|
|
|
return 'more'
|
|
|
|
|
case 'RUNNING':
|
|
|
|
|
return 'loading'
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const init = () => {
|
|
|
|
|
// let userInfo = this.$store.state.selectUserMap.get(this.nodeId);
|
|
|
|
|
@@ -176,7 +190,7 @@ const init = () => {
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.circle-user{
|
|
|
|
|
.circle-user {
|
|
|
|
|
width: 50px;
|
|
|
|
|
height: 50px;
|
|
|
|
|
display: flex;
|
|
|
|
|
@@ -184,7 +198,18 @@ const init = () => {
|
|
|
|
|
align-items: center;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
border: 1px solid #ACACAC;
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
.circle-icon {
|
|
|
|
|
width: 10px;
|
|
|
|
|
height: 10px;
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: auto !important;
|
|
|
|
|
bottom: -9px;
|
|
|
|
|
right: 15px !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.root {
|
|
|
|
|
&:before {
|
|
|
|
|
display: none !important;
|
|
|
|
|
|