|
@@ -5,7 +5,7 @@ import { Background } from '@vue-flow/background'
|
|
|
import { Controls } from '@vue-flow/controls'
|
|
import { Controls } from '@vue-flow/controls'
|
|
|
import { MiniMap } from '@vue-flow/minimap'
|
|
import { MiniMap } from '@vue-flow/minimap'
|
|
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
|
|
-import { ArrowLeft, Grid, Connection } from '@element-plus/icons-vue'
|
|
|
|
|
|
|
+import { ArrowLeft, Grid, Connection, Close } from '@element-plus/icons-vue'
|
|
|
import '@vue-flow/core/dist/style.css'
|
|
import '@vue-flow/core/dist/style.css'
|
|
|
import '@vue-flow/core/dist/theme-default.css'
|
|
import '@vue-flow/core/dist/theme-default.css'
|
|
|
import '@vue-flow/controls/dist/style.css'
|
|
import '@vue-flow/controls/dist/style.css'
|
|
@@ -23,7 +23,8 @@ const props = defineProps({
|
|
|
elements: { type: Array, default: () => [] },
|
|
elements: { type: Array, default: () => [] },
|
|
|
rules: { type: Array, default: () => [] },
|
|
rules: { type: Array, default: () => [] },
|
|
|
targetRule: { type: Object, default: null }, // 编辑的目标规则
|
|
targetRule: { type: Object, default: null }, // 编辑的目标规则
|
|
|
- targetElement: { type: Object, default: null } // 目标要素(单要素模式)
|
|
|
|
|
|
|
+ targetElement: { type: Object, default: null }, // 目标要素(单要素模式)
|
|
|
|
|
+ workflowTitle: { type: String, default: '新建规则' } // 工作流标题
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
const emit = defineEmits(['save', 'close'])
|
|
const emit = defineEmits(['save', 'close'])
|
|
@@ -906,6 +907,10 @@ defineExpose({
|
|
|
|
|
|
|
|
<el-divider direction="vertical" />
|
|
<el-divider direction="vertical" />
|
|
|
|
|
|
|
|
|
|
+ <div class="workflow-title">{{ workflowTitle }}</div>
|
|
|
|
|
+
|
|
|
|
|
+ <el-divider direction="vertical" />
|
|
|
|
|
+
|
|
|
<el-button-group>
|
|
<el-button-group>
|
|
|
<el-button :disabled="!canUndo" @click="undo" title="撤销 (Ctrl+Z)" :icon="'RefreshLeft'">
|
|
<el-button :disabled="!canUndo" @click="undo" title="撤销 (Ctrl+Z)" :icon="'RefreshLeft'">
|
|
|
撤销
|
|
撤销
|
|
@@ -938,6 +943,10 @@ defineExpose({
|
|
|
<el-button type="primary" @click="handleSave" title="保存 (Ctrl+S)" :icon="'Check'">
|
|
<el-button type="primary" @click="handleSave" title="保存 (Ctrl+S)" :icon="'Check'">
|
|
|
保存规则
|
|
保存规则
|
|
|
</el-button>
|
|
</el-button>
|
|
|
|
|
+
|
|
|
|
|
+ <el-button text circle @click="$emit('close')" title="关闭" class="close-button">
|
|
|
|
|
+ <el-icon :size="18"><Close /></el-icon>
|
|
|
|
|
+ </el-button>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
@@ -1121,6 +1130,13 @@ defineExpose({
|
|
|
gap: 10px;
|
|
gap: 10px;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+.workflow-title {
|
|
|
|
|
+ font-size: 16px;
|
|
|
|
|
+ font-weight: 700;
|
|
|
|
|
+ color: #1f2937;
|
|
|
|
|
+ letter-spacing: 0.3px;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
.back-button {
|
|
.back-button {
|
|
|
width: 36px;
|
|
width: 36px;
|
|
|
height: 36px;
|
|
height: 36px;
|
|
@@ -1133,6 +1149,18 @@ defineExpose({
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+.close-button {
|
|
|
|
|
+ width: 36px;
|
|
|
|
|
+ height: 36px;
|
|
|
|
|
+ border-radius: 10px;
|
|
|
|
|
+ transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
|
|
|
+
|
|
|
|
|
+ &:hover {
|
|
|
|
|
+ background: #fee;
|
|
|
|
|
+ color: #f56c6c;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
.toolbar-right {
|
|
.toolbar-right {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
align-items: center;
|
|
align-items: center;
|