提交 0649011e 作者: Vben

feat: add JsonPreview component

上级 a8126850
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
- 新增图形编辑器示例 - 新增图形编辑器示例
- 新增代码编辑器(包含 Json 编辑器) - 新增代码编辑器(包含 Json 编辑器)
- 新增 `JsonPreview`Json 数据查看组件
### ⚡ Performance Improvements ### ⚡ Performance Improvements
......
...@@ -32,6 +32,6 @@ export function generateModifyVars(dark = false) { ...@@ -32,6 +32,6 @@ export function generateModifyVars(dark = false) {
'font-size-base': '14px', // Main font size 'font-size-base': '14px', // Main font size
'border-radius-base': '2px', // Component/float fillet 'border-radius-base': '2px', // Component/float fillet
'link-color': primary, // Link color 'link-color': primary, // Link color
'content-background': '#fafafa', // Link color 'app-content-background': '#fafafa', // Link color
}; };
} }
...@@ -53,7 +53,7 @@ export function configThemePlugin(isBuild: boolean): Plugin[] { ...@@ -53,7 +53,7 @@ export function configThemePlugin(isBuild: boolean): Plugin[] {
'border-color-base': '#303030', 'border-color-base': '#303030',
// 'border-color-split': '#30363d', // 'border-color-split': '#30363d',
'item-active-bg': '#111b26', 'item-active-bg': '#111b26',
'content-background': '#ffffff0a', // Link color 'app-content-background': 'rgb(255 255 255 / 4%)',
}, },
}), }),
]; ];
......
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
"@iconify/iconify": "^2.0.0-rc.6", "@iconify/iconify": "^2.0.0-rc.6",
"@logicflow/core": "^0.3.0", "@logicflow/core": "^0.3.0",
"@logicflow/extension": "^0.3.0", "@logicflow/extension": "^0.3.0",
"@vueuse/core": "^4.8.1", "@vueuse/core": "^4.8.2",
"@zxcvbn-ts/core": "^0.3.0", "@zxcvbn-ts/core": "^0.3.0",
"ant-design-vue": "^2.1.2", "ant-design-vue": "^2.1.2",
"axios": "^0.21.1", "axios": "^0.21.1",
...@@ -120,7 +120,7 @@ ...@@ -120,7 +120,7 @@
"vite-plugin-style-import": "^0.9.2", "vite-plugin-style-import": "^0.9.2",
"vite-plugin-svg-icons": "^0.4.3", "vite-plugin-svg-icons": "^0.4.3",
"vite-plugin-theme": "^0.7.1", "vite-plugin-theme": "^0.7.1",
"vite-plugin-windicss": "0.14.5", "vite-plugin-windicss": "0.14.6",
"vue-eslint-parser": "^7.6.0", "vue-eslint-parser": "^7.6.0",
"vue-tsc": "^0.0.24" "vue-tsc": "^0.0.24"
}, },
......
import type { App } from 'vue'; import type { App } from 'vue';
import codeEditor from './src/CodeEditor.vue'; import codeEditor from './src/CodeEditor.vue';
import jsonPreview from './src/json-preview/JsonPreview.vue';
export const CodeEditor = Object.assign(codeEditor, { export const CodeEditor = Object.assign(codeEditor, {
install(app: App) { install(app: App) {
app.component(codeEditor.name, codeEditor); app.component(codeEditor.name, codeEditor);
}, },
}); });
export const JsonPreview = Object.assign(jsonPreview, {
install(app: App) {
app.component(jsonPreview.name, jsonPreview);
},
});
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
import 'vue-json-pretty/lib/styles.css'; import 'vue-json-pretty/lib/styles.css';
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
export default defineComponent({ export default defineComponent({
name: 'DataDialog', name: 'JsonPreview',
components: { components: {
VueJsonPretty, VueJsonPretty,
}, },
......
import type { App } from 'vue'; import type { App } from 'vue';
import dataDialog from './src/DataDialog.vue';
import flowChart from './src/index.vue'; import flowChart from './src/index.vue';
export const FlowChart = Object.assign(flowChart, { export const FlowChart = Object.assign(flowChart, {
...@@ -7,9 +6,3 @@ export const FlowChart = Object.assign(flowChart, { ...@@ -7,9 +6,3 @@ export const FlowChart = Object.assign(flowChart, {
app.component(flowChart.name, flowChart); app.component(flowChart.name, flowChart);
}, },
}); });
export const DataDialog = Object.assign(dataDialog, {
install(app: App) {
app.component(dataDialog.name, dataDialog);
},
});
...@@ -30,6 +30,7 @@ ...@@ -30,6 +30,7 @@
props: { props: {
prefixCls: String, prefixCls: String,
}, },
emits: ['view-data'],
setup(_, { emit }) { setup(_, { emit }) {
const toolbarItemList = ref<ToolbarConfig[]>([ const toolbarItemList = ref<ToolbarConfig[]>([
{ {
...@@ -112,7 +113,7 @@ ...@@ -112,7 +113,7 @@
lf.getSnapshot(); lf.getSnapshot();
break; break;
case ToolbarTypeEnum.VIEW_DATA: case ToolbarTypeEnum.VIEW_DATA:
emit('catData'); emit('view-data');
break; break;
} }
}; };
...@@ -131,12 +132,17 @@ ...@@ -131,12 +132,17 @@
}, },
}); });
</script> </script>
<style lang="less" scoped> <style lang="less">
@prefix-cls: ~'@{namespace}-flow-chart-toolbar'; @prefix-cls: ~'@{namespace}-flow-chart-toolbar';
html[data-theme='dark'] {
.lf-dnd {
background: #080808;
}
}
.@{prefix-cls} { .@{prefix-cls} {
height: 36px; height: 36px;
background: @content-background; background-color: @app-content-background;
border-bottom: 1px solid @border-color-base; border-bottom: 1px solid @border-color-base;
.disabeld { .disabeld {
......
.lf-control {
position: absolute;
top: 0;
right: 10px;
display: flex;
padding: 0 15px;
margin: 5px;
background: rgba(255, 255, 255, 0.8);
border-radius: 5px;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.lf-control-item {
display: flex;
padding: 5px 10px;
cursor: pointer;
flex-direction: column;
align-items: center;
justify-content: center;
}
.lf-control-item:hover {
background: #efefef;
}
.lf-control-item.disabled {
cursor: not-allowed;
filter: opacity(0.6);
}
.lf-control-item.disabled:hover {
background: #fff;
}
.lf-control-item.disabled i {
pointer-events: none;
}
.lf-control-item i {
display: inline-block;
width: 20px;
height: 20px;
vertical-align: middle;
background-size: cover;
}
.lf-control-text {
margin-top: 5px;
font-size: 12px;
}
.lf-control-zoomOut {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAFMElEQVR4Xu3dsQ3CQBBFQei/KEoDXQG2xAv9h3yDnb0nh7xffgQIXAq82RAgcC0gEK+DwI2AQDwPAgLxBgg0AV+Q5mZqREAgI4e2ZhMQSHMzNSIgkJFDW7MJCKS5mRoREMjIoa3ZBATS3EyNCAhk5NDWbAICaW6mRgQEMnJoazYBgTQ3UyMCAhk5tDWbgECam6kRAYGMHNqaTUAgzc3UiIBARg5tzSYgkOZmakRAICOHtmYTEEhzMzUiIJCRQ1uzCQikuZkaERDIyKGt2QQE0txMjQgIZOTQ1mwCAmlupkYEBDJyaGs2AYE0N1MjAgIZObQ1m4BAmpupEQGBjBzamk1AIM3N1IiAQEYObc0mIJDmZmpEQCAjh7ZmExBIczM1IiCQkUNbswkIpLmZGhEQyMihrdkEBNLcTI0ICGTk0NZsAgJpbqZGBAQycmhrNgGBNDdTIwICGTm0NZuAQJqbqREBgYwc2ppNQCDNzdSIgEBGDm3NJiCQ5mZqREAgI4e2ZhMQSHMzNSIgkJFDW7MJCKS5mRoREMjIoa3ZBATS3EyNCAhk5NDWbAICaW6mRgQEMnJoazYBgTQ3UyMCAhk5tDWbgECam6kRAYGMHNqaTUAgzc3UiIBARg5tzSYgkOZmakRAICOHtmYTEEhzMzUiIJCRQ1uzCQikuZkaERDIyKGt2QQE0txMjQgIZOTQ1mwCAmlupkYEBDJyaGs2AYE0N1MjAgIZObQ1m4BAmpupEQGBjBzamk3gBPJpo6YIPF/gBPJ9/po2JNAEBNLcTI0ICGTk0NZsAgJpbqZGBAQycmhrNgGBNDdTIwICGTm0NZuAQJqbqREBgYwc2ppNQCDNzdSIgEBGDm3NJiCQ5mZqREAgI4e2ZhMQSHMzNSIgkJFDW7MJCKS5mRoREMjIoa3ZBATS3EyNCAhk5NDWbAICaW6mRgQEMnJoazYBgTQ3UyMCAhk5tDWbgECam6kRAYGMHNqaTUAgzc3UiIBARg5tzSYgkOZmakRAICOHtmYTEEhzMzUiIJCRQ1uzCQikuZkaETiB+AOdkWNb83+BE4gfAQIXAgLxNAjcCAjE8yAgEG+AQBPwBWlupkYEBDJyaGs2AYE0N1MjAgIZObQ1m4BAmpupEQGBjBzamk1AIM3N1IiAQEYObc0mIJDmZmpEQCAjh7ZmExBIczM1IiCQkUNbswkIpLmZGhEQyMihrdkEBNLcTI0ICGTk0NZsAgJpbqZGBAQycmhrNgGBNDdTIwICGTm0NZuAQJqbqREBgYwc2ppNQCDNzdSIgEBGDm3NJiCQ5mZqREAgI4e2ZhMQSHMzNSIgkJFDW7MJCKS5mRoREMjIoa3ZBATS3EyNCAhk5NDWbAICaW6mRgQEMnJoazYBgTQ3UyMCAhk5tDWbgECam6kRAYGMHNqaTUAgzc3UiIBARg5tzSYgkOZmakRAICOHtmYTEEhzMzUiIJCRQ1uzCQikuZkaERDIyKGt2QQE0txMjQgIZOTQ1mwCAmlupkYEBDJyaGs2AYE0N1MjAgIZObQ1m4BAmpupEQGBjBzamk1AIM3N1IiAQEYObc0mIJDmZmpEQCAjh7ZmExBIczM1IiCQkUNbswkIpLmZGhEQyMihrdkEBNLcTI0ICGTk0NZsAgJpbqZGBAQycmhrNgGBNDdTIwICGTm0NZuAQJqbqREBgYwc2ppNQCDNzdSIgEBGDm3NJiCQ5mZqREAgI4e2ZhMQSHMzNSIgkJFDW7MJCKS5mRoREMjIoa3ZBATS3EyNCPwAiAUiJ9hUCCUAAAAASUVORK5CYII=);
}
.lf-control-zoomIn {
background-image: url(data:image/png;base64,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);
}
.lf-control-fit {
background-image: url(data:image/png;base64,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);
}
.lf-control-undo {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAARvklEQVR4Xu2dB6wvRRXGf4iKgCJg7xJBUFDBLlZiBWyxUBXFACoWxEIRxAJYg4iFiGDEiLyHGkURxYiNKEZBRYiIYq+oWJ+o0Yjmu+yfd999/7Jlzu7s7neSm/uSN3Pm7Hf2u7Mzc+acDbAYASMwE4ENjI0RMAKzETBB/HYYgTkImCB+PYyACeJ3wAjUQ8AzSD3c3GskCJggI3G0H7MeAiZIPdzcayQImCDxjr498Bbg2fFDeYTUCJggqRFdV99zgJOANcCdYoey9ggETJAIVOFWwAeBXQv1vzJBYoCO1mqCpEf4ycAHgC2XqTZB0uPcikYTJB3MmwPvAfaZotIESYdzq5pMkDRwPwY4A7jNDHUmSBqcW9digjSDfFPgRODABWpMkGY4d9bbBKkP/UOBVSUX3yZIfZw77WmCVIf/JsCbgEOAsviZINVxzqJHWQdnYWwGRtwPWA1sXdEWE6QiYLk0N0HKeeJGwGuBI4ANy3VZp5UJUgO0HLqYIIu9sD1wFqDfdcUEqYtcx/1MkNkOuAFwGPB64MYN/WSCNASwq+4myHTktcbQWkNrjhRigqRAsQMdJsi6oAuPFwNvBjZJ6A8TJCGYbaoyQdairWhbnWvofCO1mCCpEW1JnwlyHdDPK07ENwvC3QQJAjZa7dgJsjIsPQpvEyQK2WC9YybItLD0KLhNkChkg/WOkSAKS38vsGcwtsvVmyAtgp1yqLERZFFYekpsTZAoNFvUOxaCKCz9ncVivEV4rx/KM0gXqCcYcwwEqRKWngDSqSpMkChkg/UOmSAKS1e6nZdUCEuPgtsEiUI2WO9QCVI3LD0KbhMkCtlgvUMjiMLSFVyoIMM6YelRcJsgUcgG6x0SQVKEpUfBbYJEIRusdwgEUVj6kcWFJs0gOYoJkqNXStjUd4KkDksvAVmtJiZILdi679RXgsjulxbJEzbuHsaFFpggCyHKs0EfCRIZlh7lJRMkCtlgvX0jyAHA24GbBeOSWr0JkhrRlvT1hSBK6anUnoql6qOYIH30WgYnzGVg2xt494ps6WX65dTGBMnJGxVsyXkGUfkAlRHQvY2+iwnSUw/mShAVnlEBGt34G4KYID31Ym4E0eJbYenP7Smes8w2QXrq0JwI8ijgw4CKXg5NTJCeejQHguig723AwT3ZNKjjahOkDmoZ9OmaIA8qMhjeNQMsIk0wQSLRDdTdFUGU6/YNwKsABRsOXUyQnnq4C4Lcp8iWvm1PMatjtglSB7UM+rRJkBsWYemvAXINS49yiQkShWyw3rYIorD0jwGaPcYoJkhPvR5NEOk/FDgeUBKFsYoJ0lPPRxKkj2HpUW40QaKQDdYbRZCDgBOAmwbb3xf1JkhfPLXCztQE6XtYepQbTZAoZIP1piTIvsC7gC2Cbe6jehOkj15LFNqhsPRTgaf1FIO2zP5KWwM1GOdfwD+n/FwD/AK4svi5qsEYveradAZ5CnAacMtePbWNbYrA35eR5fvABcAXmyrNsX9dgigsXbf89svxoWxTJwho5vkq8AXgfOA7wLWdWJJw0DoEeSxw+kDD0hNCO3pVfwXOLYJRz+krGlUIorB0bd2+sK8Pa7s7Q+CPwEeBM4tZ5n+dWVJx4LIEUY0NXWa6S0X9bm4EViKgHT1lqFH6pj/kDs8igigsXWEiLx9JWHru/hqSfVqzqFakarj8LtcHm0eQMYal5+qnIdulreX3AW/MkSizCKKQdF1oshiBNhHQQbPeu6vbHHTeWCsJoktMZ404LD0Xv4zZDu1+HVtkt/lP10BMCKJrr1pnHAds1LVRHt8IAD8GXgmc3SUaIshWxQ7VQ7o0xGMbgRkIfLkodXFZFwiJIM8udhM26cIAj2kESiLw6qIeTMnmaZpNPrF8uSkNntYSi4BivvYBfh07zFrtyxfp+rdqir8Z6EPVprYw8jh5IfA3YH/g422YNW2bVwkWdNKppG4WI5ArAkpuHp7DedY5iHa1DgdeB+g03WIEckTga4AqAayJMm5RqEnOtcejMLHefiGg3S1VHvt9hNmLCKIxleTttcARwIYRRlinEWiIwM+AXQD9TiplCDIZ8H5FbL/WKBYjkBsCmkE0kyQ9L6lCEAGi5G9vAg5JdJ89N5BtT78R+AvwMOB7qR6jKkEm4+p+yCpA5ycWI5ATAppJFBXykxRG1SWIxt4UOBE4MIUh1mEEEiLwS+DBwG+a6mxCkMnY+u7TuYmSxlmMQC4I/BDYGdB139qSgiAafHPgFGCP2pYMv2PuebG0Q6kcZ5sBylpz8wG45LvAw5uck6QiyARLJY9TnixnV1z37dKUf+cevnC3LdaZdwT0c0/gicW/+/I4Ckl5el1jUxNEdqi2+QeA3esaNcB+yko4pIQXOwBPKH4e3QN/KcZQedwqSwRBJkYoqZxqng9hqq4M7IoOQ87Nq0+yxwNPAnYDbtEUrID+upmondeLquqOJIhsUc1zpQtSDfQxy5AJstyvirpQAOFRGc6YCpHXzKezktISTZCJIUo2p1ro2hoeo4yFIBPfiijPK4iS01nZeUVwY+l3sC2CyCDVQl890jD6sRFk8gIqEvxgQLcBtTbNQVTcSdUISkmbBJFBY00OMVaCTF5CbRsrAYMSg3RddUyfWIonLHU+0jZBJoCNLb3Q2Aky8bs+t5SfV/FSXYpSW+1VxoCuCCLbVDddi7mji3+XsbevbUyQtZ6bXMZTgji9A12Jtqk/t2jwLgkyse2+ReDj3RcZ2+P/7+tBYSTkDyhyXmmnswvR2dR2RTWtmePnQJCJcQqj16WsIYoJMt2rit/7DKA/kl2IEpQcOW/gnAgiO5UoQjtd2vEakvgTa7Y3lY9NawKFsLQtyjCvGWzm2UhuBBFASjk0uZTVNmBR4w0t1CQCJ229HhCheIFOpdtVsvapkiNBJobq9F2n8F19o6b0lWeQxWjqXVQqH2X6bFNUkPR2gH6vJzkTRMZq/1wp8Z/TJmIBY5kg5UDVDpe2gfcs1zxZK80gmkl6R5CJwfo+VYRwX8tN+xOr2rusKrltRgnr0FBnNFqTrCO5zyDLjdVlHlUiqh3bX81HSVt7F6sanPpDqOwkuo/SlhwKvKPPBJnYvjfwnp5dyvInVvXXXDPI51vMnnMFcI8hEETPoEWVarU/rjrunfTwJ1Y92F8PHFOva61eujNy4fKeffrEmvbE2hZUOWEt5nMWzyD1vKNQlEsApcBtQ7TOVZj+9dJ3guhB+lDbxASp/3rvVNwEbCPtrSruav1zzcTcIRBEz6LneGlxwJhjbRMTpD5B1POtwKuaqSjde537IkMhyOTptylydD2wNBztNPQapBnOSnmrop5tHBp/tUgVtGTx0AiiZ9Jhk4IelZE+l9omnkGaEUS9X1Q3M0nFoa8tEo0snawPkSATPHKqbWKCVHxLpzTXHzuVN9AOZrQ8Ffjk0Ami51PyAFXJUrWsNhZ5sxxngqR5pZ9fVGROo222FoU3aU076Blk+eN3XdvEBEnzSusPnhJSR4ccXT7ZWh7yJ9ZKl2ihpwsy+svQ9nObIGkI0uaOlj7lrmr7RUkHU31NXdQ2MUHq+2tlT6Vw/WkLf+SepesWYySIANfJu9KihpcRLrzrbd50BJEmxWip7EakKHDx0LESZAJsW7VNPIOkfZVVAnC9yNu0QyxlPHnC2AkiTFXb5GRAUcJRYoKkRfZewKVpVa6n7efKjWCCrMXlycWlLN07SS0mSGpEr8uMGOGr5ZbexARZ13HKH6t70bsm9qcJkhjQIpdaqeyIDYbe0QSZjp4W7/rGTVXbxARp8JbO6KobgLrqECl7mSCz4b0D8CFglwQe8C5WAhBXqNBluYWpQxsOe4wJshhBBckp3FoJzuqKZ5C6yM3up5qPWkhHyskmSDl4m9Y2MUHK4Vy1lS44bVS1U4X2q0yQCmgBhwFvqdZlqbU/sWqAVqLLd4AdS7Sr2+Q8E6Q6dHVqm3gGqY5zmR7RJ+rfNEHKuGH9NkomoGx8Ki1WpsaFCVIP50W9lJp2n0WNGvz/lSZIA/SA+xSZyTWrzBMTpBnOs3qfCLwsRvWS1qtNkDTonlDU35ulzZkV0+C8UotmcVWqChMTJB2082qbeAZJh/NyTbrfo9uiUbLGBEkLrVIO6XT3BSvUmiBpcZ5oU5DpC2NUL2n9jQkSg+7K2iYmSAzOZwD7xqhe0voDEyQOXV3KUpJtFYQxQWJw/hTwpBjVS1ovNkEC0S1UKzL4+A4LVcY/YXcjRB8UfskEace5N51V4qud4Qc7igreKBlHlJxtgkRBa73RCNwN+FHwIKebIMEIW30YAroBupT9MFCOMkEC0bXqUASUe1lZMyPlqSZIJLzWHYnA14EHRw4AbGuCBCNs9SEI6Cr0n4OTx/0b2NgECfGflQYjoDrqq4PHUJXde5sgwShbfQgCZwbnMZPRZwFO2hDiPiuNRECfV78Lvmor+1+huDrPIJGutO4IBA4uQngidC/Xqbs+l5og0TBbf2oELgZU7yVS/gJsoQFMkEiYrTs1Ag8Avpla6RR9qyZXeU2QFtD2EMkQUKI4JYyLlgOA93sGiYbZ+lMioNLe30ipcI4uFelRqiZ/YrUEuIdpjoDql6s6WLT8ANhuMog/saLhtv4UCDwT+EgKRSV0KBHEcSZICaTcJAsEdO7xkxZqgehh/wfcsaiku/TwnkGyeAdsxBwElGFfBTXbkC+srH1ogrQBu8eoi4Dum+veeVui/AFKBHG9mCBtQe9xqiKgbJU6FNR15TbkGuCWgDLGmyBtIO4xaiOwWUGObWprqN7xVOCgld08g1QH0j3iETgX2C1+mHVGEBnXu+NugrTsBQ83F4EbFGHmz2gZp9OB/aeNaYK07AkPNxMBvYvasYrMlDht8P8CWwFKML6emCB+Y3NBQGsAxUC1LadMyaXsRXrbXvB4MxFQcdSPdrDmkEG6d771rNlDDTyD+M3tEoFbA+cBO3VkxEmLCvCYIB15xsOieiqfAG7XERa/L2aPNfPGN0E68s6Ih90QOKqo8VimvmMUVPsVmwJz9ZsgUfBb7zQEdM9C6w3dDOxSLiwbOm+CdOmm8YytmUJZQo5uMXRkFrra1t1exXHKwG+ClEHJbZog8EhAW7htho3Ms1cFV19Z9oFMkLJIuV1VBHYpdoiUhT0XuQK4P6DAxFJigpSCyY1KInDjIhvIIcCOJfu01ezvRV17Xb4qLSZIaajccA4CuiuuEJE9gFtkiJRuCu4OfLaqbSZIVcTcXggoHH1n4BEFMe6cOSzHAMfWsdEEqYPauPpsDtyr2Pm5N/BwYIceQfDpJpVwx0wQpdBPUYT+WuCCHr0ws0zVAd6WgJIkaIbQb6W/UThIX+XbgGrWzz0tn/dwYyaItvre1lfP2+6FCFxZVKD608KWcxqYIE3Qc99cEfhpcVL+26YGmiBNEXT/3BAQKRQIOfUCVFVjTZCqiLl9zgjoc0qFPfV5lURMkCQwWkkGCFxVLMhLxViVtdcEKYuU2+WMwI8LcvwqtZEmSGpEra9tBC4BHg002q2aZbQJ0rY7PV5KBL5S3GX/R0qly3WZIFHIWm80AqcBB0YPYoJEI2z9qRFQgU1dlz0nteJp+kyQNlD2GKkQUHkClULQjlUrYoK0ArMHaYiAMq4fDryzoZ7K3U2QypC5Q8sIKBBUWdeTnm+UfQYTpCxSbtc2AspbpYBS5evtTEyQzqD3wDMQ0PUB5cs9Avhb1yiZIF17wOMvR+Ci4o7Ot3KBxQTJxRPjtUP3xXXrT+l4dPCXlZggWbljVMZoZ0rri7dOq+yUCxImSC6eGI8dPwNU0endwB9zf2wTJHcPDcM+HeytBs4EtM7ojZggvXFV7wy9GvhM8Rl1fu+sLww2QfrqufzsVuYQHeopHESEuCw/E6tbZIJUx8w9QAGDPyyutl5e7D59bYjAmCBD9Gr9Z/prsXDW5SP9aBGt338AlClEd731o8+nUciYCTIKB/shmyFggjTDz70HjoAJMnAH+/GaIWCCNMPPvQeOgAkycAf78ZohYII0w8+9B46ACTJwB/vxmiFggjTDz70HjsD/AT5bM+fiPLaOAAAAAElFTkSuQmCC);
}
.lf-control-redo {
background-image: url(data:image/png;base64,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);
}
/* menu */
.lf-menu {
position: absolute;
display: none;
width: 200px;
padding: 10px 0;
margin: 0 0 0 10px;
background: #fff;
border: 1px solid #efefee;
border-radius: 3px;
}
.lf-menu > li {
position: relative;
padding: 3px 12px;
font-size: 12px;
line-height: 18px;
list-style: none;
cursor: pointer;
transition: all 120ms ease-in-out;
}
.lf-menu-item__disabled {
color: #aaa;
pointer-events: none;
cursor: default;
opacity: 0.88;
}
.lf-menu-item:hover {
background: #f3f3f3;
}
/* dnd */
.lf-dnd {
position: absolute;
padding: 15px 5px;
margin: 5px;
background: rgba(255, 255, 255, 0.8);
border-radius: 5px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.lf-dnd-item {
margin-top: 5px;
font-size: 14px;
text-align: center;
}
.lf-dnd-item:first-child {
margin-top: 0;
}
.lf-dnd-item div {
width: 40px;
height: 40px;
}
.lf-dnd-item div:hover {
cursor: grab;
}
.lf-dnd-circle {
background: url('data:image/png;base64,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')
center center no-repeat;
}
.lf-dnd-rect {
background: url('data:image/png;base64,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')
center center no-repeat;
}
.lf-dnd-polygon {
background: url('data:image/png;base64,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')
center center no-repeat;
}
.lf-dnd-triangle {
background: url('data:image/png;base64,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')
center center no-repeat;
}
.lf-dnd-hexagon {
background: url('data:image/png;base64,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')
center center no-repeat;
}
.lf-dnd-star {
background: url('data:image/png;base64,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')
center center no-repeat;
}
.lf-selection-select {
position: absolute;
border: 2px dashed darkorange;
}
.lf-mini-map {
position: absolute;
padding-top: 20px;
overflow: hidden;
background: rgba(255, 255, 255, 1);
border: 1px solid #93a3b4;
}
.lf-mini-map-graph {
position: relative;
overflow: hidden;
}
.lf-minimap-viewport {
position: absolute;
top: 0;
left: 0;
cursor: grab;
border: 2px solid rgb(24, 125, 255);
}
.lf-mini-map-header {
position: absolute;
top: 0;
right: 0;
left: 0;
height: 18px;
padding: 0 10px;
line-height: 18px;
text-shadow: 0 1px 0 rgb(255 255 255 / 33%);
background-color: #a6a6a6;
background-image: linear-gradient(to top, #b2b2b2, #9b9b9b);
border: 1px solid #999;
border-top: #bfbfbf solid 1px;
border-bottom: #666 solid 1px;
}
.lf-mini-map-close {
position: absolute;
top: 0;
right: 2px;
width: 18px;
height: 18px;
cursor: pointer;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAACL0lEQVRoQ+1YT2vUQBT/vS+Smc3u0ZtfwA+hUKEttIIVbMEWrGAL3UItqKCCCipooS3Ynu29ePfqLcnO5Nov0NsrWbc0myxtJpNmGZw9LZk37/3+vCTzQnD8R47jhycwbQe9A94BSwV8C1kKaL3dO2AtoWWC/8+BMJB9ItwHcM6MX0mqtm1EzOU7Y8bvJFV9k3zGDnSFPAVw76oIb8ZavzIpehnbE+Ilg/J7/8Za3THJVYfAHwB3x4owXsSpemNSuCs6zwEu7rl9AmEgt4hQspkIa5FS76uQCKV8RoxSLDP6pi1p7EAGsCvEBkA7ZbC0EuvBp+tI9IR4yqBSDIE3Iq13qwiQj6lFYEgikOsgvC4VJDyJlfo6CUg3kI9BmLBG67EevDUFn8XXJpBt7km5yox3xcIMfpRo/SN/PZRygRhj17J1JqwmSn2oA96awL926iwD/LEIgJjmo3RwMCQadGaZePh/3H5ejrT+XBd8IwSGJKRcAuPLhHZ6mIkMxlFpjbEUp+qbDfjGCGSJQiEWCfS9CiAmLCZK7VWJvSnG6h4oJu8FnTkm3r+uKDHNReng8CZgVdcbJTBqpxkwfk4EQJiJlTquCq5KnCeQV8npFnL6Jnb6Mer0i8zpo4TThzmnj9OjGXardDBrZqDZbmMmdnukdH6oL3xWOTG1vNh6oxn7AYB2PqtUOWC1GdP4Ya5N8I0ONG0Dv6znHZiW8t6BaSvvHfAONKSAf4w2JGTtNBey0xBAkjSEzwAAAABJRU5ErkJggg==');
background-size: contain;
}
<template> <template>
<div class="h-full" :class="prefixCls"> <div class="h-full" :class="prefixCls">
<FlowChartToolbar :prefixCls="prefixCls" v-if="toolbar" /> <FlowChartToolbar :prefixCls="prefixCls" v-if="toolbar" @view-data="handlePreview" />
<div ref="lfElRef" class="h-full"></div> <div ref="lfElRef" class="h-full"></div>
<BasicModal @register="register" title="流程数据" width="50%">
<JsonPreview :data="graphData" />
</BasicModal>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
...@@ -14,15 +17,18 @@ ...@@ -14,15 +17,18 @@
import { Snapshot, BpmnElement, Menu, DndPanel } from '@logicflow/extension'; import { Snapshot, BpmnElement, Menu, DndPanel } from '@logicflow/extension';
import { useDesign } from '/@/hooks/web/useDesign'; import { useDesign } from '/@/hooks/web/useDesign';
import { useAppStore } from '/@/store/modules/app';
import { createFlowChartContext } from './useFlowContext'; import { createFlowChartContext } from './useFlowContext';
import { toLogicFlowData } from './adpterForTurbo'; import { toLogicFlowData } from './adpterForTurbo';
import { useModal, BasicModal } from '/@/components/Modal';
import { JsonPreview } from '/@/components/CodeEditor';
import '@logicflow/core/dist/style/index.css'; import '@logicflow/core/dist/style/index.css';
import './index.css'; import '@logicflow/extension/lib/style/index.css';
export default defineComponent({ export default defineComponent({
name: 'FlowChart', name: 'FlowChart',
components: { FlowChartToolbar }, components: { BasicModal, FlowChartToolbar, JsonPreview },
props: { props: {
flowOptions: { flowOptions: {
type: Object as PropType<Definition>, type: Object as PropType<Definition>,
...@@ -41,10 +47,13 @@ ...@@ -41,10 +47,13 @@
}, },
setup(props) { setup(props) {
const lfElRef = ref<ElRef>(null); const lfElRef = ref<ElRef>(null);
const graphData = ref<Recordable>({});
const lfInstance = ref<Nullable<LogicFlow>>(null); const lfInstance = ref<Nullable<LogicFlow>>(null);
const { prefixCls } = useDesign('flow-chart'); const { prefixCls } = useDesign('flow-chart');
const appStore = useAppStore();
const [register, { openModal }] = useModal();
createFlowChartContext({ createFlowChartContext({
logicFlow: (lfInstance as unknown) as LogicFlow, logicFlow: (lfInstance as unknown) as LogicFlow,
}); });
...@@ -55,7 +64,7 @@ ...@@ -55,7 +64,7 @@
const defaultOptions: Partial<Definition> = { const defaultOptions: Partial<Definition> = {
grid: true, grid: true,
background: { background: {
color: '#f7f9ff', color: appStore.getDarkMode === 'light' ? '#f7f9ff' : '#151515',
}, },
keyboard: { keyboard: {
enabled: true, enabled: true,
...@@ -73,12 +82,20 @@ ...@@ -73,12 +82,20 @@
); );
watch( watch(
() => props.flowOptions, () => appStore.getDarkMode,
() => {
init();
}
);
watch(
() => unref(getFlowOptions),
(options) => { (options) => {
unref(lfInstance)?.updateEditConfig(options); unref(lfInstance)?.updateEditConfig(options);
} }
); );
let isInit = false;
// init logicFlow // init logicFlow
async function init() { async function init() {
await nextTick(); await nextTick();
...@@ -87,14 +104,17 @@ ...@@ -87,14 +104,17 @@
if (!lfEl) { if (!lfEl) {
return; return;
} }
if (!isInit) {
// Canvas configuration
LogicFlow.use(Snapshot);
// Use the bpmn plug-in to introduce bpmn elements, which can be used after conversion in turbo
LogicFlow.use(BpmnElement);
// Start the right-click menu
LogicFlow.use(Menu);
LogicFlow.use(DndPanel);
isInit = true;
}
// Canvas configuration
LogicFlow.use(Snapshot);
// Use the bpmn plug-in to introduce bpmn elements, which can be used after conversion in turbo
LogicFlow.use(BpmnElement);
// Start the right-click menu
LogicFlow.use(Menu);
LogicFlow.use(DndPanel);
lfInstance.value = new LogicFlow({ lfInstance.value = new LogicFlow({
...unref(getFlowOptions), ...unref(getFlowOptions),
container: lfEl, container: lfEl,
...@@ -113,11 +133,24 @@ ...@@ -113,11 +133,24 @@
lf.render(lFData); lf.render(lFData);
} }
function handlePreview() {
const lf = unref(lfInstance);
if (!lf) {
return;
}
graphData.value = unref(lf).getGraphData();
openModal();
}
onMounted(init); onMounted(init);
return { return {
register,
prefixCls, prefixCls,
lfElRef, lfElRef,
handlePreview,
graphData,
}; };
}, },
}); });
......
...@@ -20,7 +20,7 @@ html[data-theme='light'] { ...@@ -20,7 +20,7 @@ html[data-theme='light'] {
z-index: 10; z-index: 10;
height: @multiple-height + 2; height: @multiple-height + 2;
line-height: @multiple-height + 2; line-height: @multiple-height + 2;
background: @component-background; background-color: @component-background;
border-bottom: 1px solid @border-color-base; border-bottom: 1px solid @border-color-base;
.ant-tabs-small { .ant-tabs-small {
...@@ -31,7 +31,7 @@ html[data-theme='light'] { ...@@ -31,7 +31,7 @@ html[data-theme='light'] {
.ant-tabs-card-bar { .ant-tabs-card-bar {
height: @multiple-height; height: @multiple-height;
margin: 0; margin: 0;
background: @component-background; background-color: @component-background;
border: 0; border: 0;
box-shadow: none; box-shadow: none;
...@@ -45,7 +45,7 @@ html[data-theme='light'] { ...@@ -45,7 +45,7 @@ html[data-theme='light'] {
padding-right: 12px; padding-right: 12px;
line-height: calc(@multiple-height - 2px); line-height: calc(@multiple-height - 2px);
color: @text-color-base; color: @text-color-base;
background: @component-background; background-color: @component-background;
transition: none; transition: none;
&:hover { &:hover {
......
...@@ -33,7 +33,7 @@ export const useAppStore = defineStore({ ...@@ -33,7 +33,7 @@ export const useAppStore = defineStore({
getPageLoading() { getPageLoading() {
return this.pageLoading; return this.pageLoading;
}, },
getDarkMode() { getDarkMode(): 'light' | 'dark' | string {
return this.darkMode || localStorage.getItem(APP_DARK_MODE_KEY_) || darkMode; return this.darkMode || localStorage.getItem(APP_DARK_MODE_KEY_) || darkMode;
}, },
......
...@@ -58,7 +58,6 @@ export default ({ command, mode }: ConfigEnv): UserConfig => { ...@@ -58,7 +58,6 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
proxy: createProxy(VITE_PROXY), proxy: createProxy(VITE_PROXY),
}, },
build: { build: {
minify: 'esbuild',
target: 'es2015', target: 'es2015',
outDir: OUTPUT_DIR, outDir: OUTPUT_DIR,
terserOptions: { terserOptions: {
......
...@@ -1713,25 +1713,25 @@ ...@@ -1713,25 +1713,25 @@
resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.0.11.tgz#20d22dd0da7d358bb21c17f9bde8628152642c77" resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.0.11.tgz#20d22dd0da7d358bb21c17f9bde8628152642c77"
integrity sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA== integrity sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA==
"@vueuse/core@^4.8.1": "@vueuse/core@^4.8.2":
version "4.8.1" version "4.8.2"
resolved "https://registry.npmjs.org/@vueuse/core/-/core-4.8.1.tgz#d7a7fb2e72610d1962ecb9244bd93dacb96d921c" resolved "https://registry.npmjs.org/@vueuse/core/-/core-4.8.2.tgz#b14e43ae640c38f59591db146d6e15c551368414"
integrity sha512-oXFEDaKNU69Rj20/Hd7ZlmTpEtA2M19cRkZaL4A0Nl0w5Wb5In/8aK+0vtdi1VyMUXXbq6h1OGKCJcIhg5cziA== integrity sha512-d6SX9YSWC8svdCEZvlKH3zmstPqNS1h1RHgZUbkxAC/zoNIYP88Ivl1pF3SYm0Iksl6D4Zu/oImKXWCBW21r6g==
dependencies: dependencies:
"@vueuse/shared" "4.8.1" "@vueuse/shared" "4.8.2"
vue-demi latest vue-demi latest
"@vueuse/shared@4.8.1": "@vueuse/shared@4.8.2":
version "4.8.1" version "4.8.2"
resolved "https://registry.npmjs.org/@vueuse/shared/-/shared-4.8.1.tgz#45fd5f64bf4e8944db42a5b72fa2705cfc74608a" resolved "https://registry.npmjs.org/@vueuse/shared/-/shared-4.8.2.tgz#7c9a738ddba9b60b3eb2e6702d657c2b4c94651c"
integrity sha512-ONKJoIvZPrGCA8loK7dX+ZcjgZLikI+vPiz1lWlXs6+jZiQiZSLkmvg1NjV6Cfb6OqbDCfEScTWLbZHB7EwrRw== integrity sha512-Bjy15IHyqUpRbg9cRE9afFwD0gLtGI0tJW7fITWGCwYmSWpBoD+EnGBBGvnoP9pOtxkri9Wte/uKwcVnDos7QA==
dependencies: dependencies:
vue-demi latest vue-demi latest
"@windicss/plugin-utils@0.14.5": "@windicss/plugin-utils@0.14.6":
version "0.14.5" version "0.14.6"
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.14.5.tgz#f41889c866ca9163981276ab9f2903b8bea091e8" resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.14.6.tgz#25d3fdda3a8b0a560f3daed6588abd0a4fbef195"
integrity sha512-5BFPFGFskNBm9JudAlWJSgk0Pq5H9fmbhY2O2WZzvy0eZCJ9fY3f9lJrUxZElLSP9Tp72r08kV+9x/39X63bsQ== integrity sha512-jF+dJ6D4/UqVHSbH5kCdSoPnklLTZDf+seck4unICI0qyzmyPsrO15nmSS/gIvnmCedUfBrQj1MfYOX0tccFjQ==
dependencies: dependencies:
debug "^4.3.2" debug "^4.3.2"
fast-glob "^3.2.5" fast-glob "^3.2.5"
...@@ -9278,12 +9278,12 @@ vite-plugin-theme@^0.7.1: ...@@ -9278,12 +9278,12 @@ vite-plugin-theme@^0.7.1:
esbuild-plugin-alias "^0.1.2" esbuild-plugin-alias "^0.1.2"
tinycolor2 "^1.4.2" tinycolor2 "^1.4.2"
vite-plugin-windicss@0.14.5: vite-plugin-windicss@0.14.6:
version "0.14.5" version "0.14.6"
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.14.5.tgz#399cbe8964595f02ba9d6d66dc3503f4cf983de0" resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.14.6.tgz#c17b66b5f35a3b1ffdfc3e969ce28a528305716e"
integrity sha512-TOYb4Bz5FpWfJavzAtvjuhGew6tJnjx1ZxRmEBOG7RUFFdclWG0CRcHXSVvwpigYHl2TaNwkpHmpM8dyhN6Scw== integrity sha512-bFyKfvnsa3nAab9LgrFInzdQhsIJyeNdCczgjrYMxjO8WlgiQuIFyJ1RTYQnYmQRlbvU9jpOL5XDxsFUMKRLUg==
dependencies: dependencies:
"@windicss/plugin-utils" "0.14.5" "@windicss/plugin-utils" "0.14.6"
chalk "^4.1.0" chalk "^4.1.0"
debug "^4.3.2" debug "^4.3.2"
windicss "^2.5.14" windicss "^2.5.14"
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论