feat: chart

packages/design-core/src/App.vue

@@ -13,9 +13,6 @@
           <design-settings v-show="layoutState.settings.showDesignSettings" ref="right"></design-settings>
         </div>
       </div>
-      <div class="tiny-engine-chart">
-        <design-chart />
-      </div>
     </div>
   </tiny-config-provider>
 </template>
@@ -44,7 +41,6 @@ import blockPlugin from '@opentiny/tiny-engine-plugin-block'
 import materials from '@opentiny/tiny-engine-plugin-materials'
 import { useBroadcastChannel } from '@vueuse/core'
 import { constants } from '@opentiny/tiny-engine-utils'
-import DesignChart from './DesignChart.vue'
 
 const { message } = useModal()
 const { requestInitBlocks } = blockPlugin.api
@@ -57,7 +53,6 @@ export default {
     DesignToolbars,
     DesignPlugins,
     DesignCanvas,
-    DesignChart,
     DesignSettings,
     TinyConfigProvider
   },

packages/toolbars/logo/src/Main.vue

@@ -95,6 +95,16 @@
       <span>{{ tipText }}</span>
       <template #footer> </template>
     </tiny-dialog-box>
+
+    <tiny-dialog-box
+      class="tiny-engine-chart"
+      v-model:visible="state.chart"
+      append-to-body="true"
+      width="100%"
+      top="5vh"
+    >
+      <design-chart />
+    </tiny-dialog-box>
   </div>
 </template>
 
@@ -114,6 +124,7 @@ import { iconHelpCircle } from '@opentiny/vue-icon'
 import { useLayout, useApp, getGlobalConfig, useModal } from '@opentiny/tiny-engine-controller'
 import { useHttp } from '@opentiny/tiny-engine-http'
 import { isDevelopEnv } from '@opentiny/tiny-engine-controller/js/environments'
+import DesignChart from '../../../design-core/src/DesignChart.vue'
 
 const http = useHttp()
 
@@ -125,6 +136,7 @@ const state = reactive({
   hoverState: false,
   showMenu: false,
   show: false,
+  chart: false,
   showPreview: false,
   formData: {
     version: '',
@@ -145,7 +157,12 @@ const tipBoxVisibility = ref(false)
 let tipText = ref('发布成功')
 const form = ref(null)
 const menus = ref(
-  getGlobalConfig()?.dslMode === 'Angular' ? [] : [{ name: '应用发布', code: 'publishApp', icon: 'news' }]
+  getGlobalConfig()?.dslMode === 'Angular'
+    ? []
+    : [
+        { name: '应用发布', code: 'publishApp', icon: 'news' },
+        { name: '设计器绘制', code: 'chartDraw', icon: 'chart' }
+      ]
 )
 
 const repalceTrim = (e) => {
@@ -187,6 +204,9 @@ const actions = {
     }
     state.showPreview = true
   },
+  chartDraw() {
+    state.chart = true
+  },
   previewApp() {
     const appId = useApp().appInfoState.selectedId
     // 获取租户 id