init

src/components/ShowDialogWrap.vue

@@ -53,9 +53,11 @@ export default {
     dialogResolve: { type: Function, required: true },
     dialogReject: { type: Function, required: true },
 
-    childCmp: { type: Object, default: undefined, required: false }
+    childCmp: { type: Object, default: undefined, required: false },
+    onMounted: { type: Function, default: undefined, required: false },
   },
   mounted() {
+      this.$props.onMounted?.(this);
   },
   data() {
     return {

src/editor/ModelMain.vue

@@ -52,11 +52,11 @@
             </SplitArea>
             <SplitArea class="section-center" :class="{'hidden-split':hideRight}" :size="calcCenterSize">
               <el-tabs type="card" class="section-tabs" v-model="centerActiveName" @tab-click="handleCenterTabClick"
-                       v-if="isShowEditor" :key="editorHash">
-                <el-tab-pane label="模型编辑" name="ModelEditor" lazy>
+                       v-if="isModelOpen" :key="editorHash">
+                <el-tab-pane v-if="isShowEditor" label="模型编辑" name="ModelEditor" lazy>
                   <Model2DEditor @viewportChanged="setCurrentViewport" />
                 </el-tab-pane>
-                <el-tab-pane label="监控视图" name="ModelView" lazy>
+                <el-tab-pane v-if="isShowEditor" label="监控视图" name="ModelView" lazy>
                   <Model3DViewer />
                 </el-tab-pane>
                 <el-tab-pane label="楼层定义" name="ModelFile" lazy>
@@ -103,13 +103,12 @@
   </div>
 </template>
 <script>
-import { markRaw } from 'vue'
 import { renderIcon } from '@/utils/webutils.js'
 import Split from '@/components/split/split.vue'
 import SplitArea from '@/components/split/split-area.vue'
 import { ModelMainInit, ModelMainMounted, ModelMainUnmounted } from './ModelMainInit.js'
 import { getRootMenu } from '@/runtime/DefineMenu.js'
-import { getWidgetByName, getWidgetBySide, getAllWidget } from '@/runtime/DefineWidget.js'
+import { getAllWidget, getWidgetByName, getWidgetBySide } from '@/runtime/DefineWidget.js'
 import Model2DEditor from './Model2DEditor.vue'
 import Model3DViewer from './Model3DViewer.vue'
 import { normalizeShortKey } from '@/utils/webutils.ts'
@@ -188,6 +187,9 @@ export default {
     }
   },
   computed: {
+      isModelOpen() {
+          return this.worldModel.state.isOpened;
+      },
     worldModel() {
       return window['worldModel']
     },

src/editor/OpenProject.vue

@@ -0,0 +1,128 @@
+<script setup lang="ts">
+import { onMounted, reactive, useTemplateRef } from "vue";
+import { AgGridVue } from "ag-grid-vue3";
+import { ElButton } from "element-plus";
+import { type GridOptions } from "ag-grid-enterprise";
+import { type GridApi, type GridReadyEvent } from "ag-grid-community";
+import { Request } from "@ease-forge/shared";
+import { localeText as localeTextCn } from "../components/yvTable/yv-aggrid-cn.locale";
+import "ag-grid-community/styles/ag-grid.css";
+import "ag-grid-community/styles/ag-theme-alpine.css";
+
+defineOptions({
+    name: 'OpenProject',
+});
+
+// 组件事件定义
+const emit = defineEmits<{
+    "cancel": [];
+    "open": [row: any];
+    "add": [expose: OpenProjectExpose];
+}>();
+
+// 定义 Props 类型
+interface OpenProjectProps {
+}
+
+// 读取组件 props 属性
+const props = withDefaults(defineProps<OpenProjectProps>(), {});
+
+// 定义 State 类型
+interface OpenProjectState {
+    grid1Data?: Array<any>;
+}
+
+// state 属性
+const state = reactive<OpenProjectState>({});
+
+// 定义 Data 类型
+interface OpenProjectData {
+    gridSetting: Partial<GridOptions>;
+    api?: GridApi;
+}
+
+// 内部数据
+const data: OpenProjectData = {
+    gridSetting: {
+        localeText: localeTextCn,
+        // suppressNoRowsOverlay: true,
+        // suppressLoadingOverlay: true,
+        // 选择行配置
+        rowSelection: "single",
+        columnDefs: [
+            { field: 'id', headerName: 'id', editable: false, hide: true },
+            { field: 'projectUuid', headerName: '项目编号', editable: false },
+            { field: 'projectLabel', headerName: '项目标题', editable: false },
+            { field: 'projectVersion', headerName: '项目版本', editable: false },
+            { field: 'server', headerName: '所在服务器', editable: false },
+            { field: 'directoryData', headerName: '目录数据', editable: false },
+            { field: 'otherData', headerName: '其他数据', editable: false },
+            { field: 'createAt', headerName: '创建时间', editable: false },
+            { field: 'createBy', headerName: '创建人', editable: false },
+            { field: 'updateAt', headerName: '最后更新时间', editable: false },
+            { field: 'updateBy', headerName: '更新人', editable: false },
+        ],
+        onGridReady(event: GridReadyEvent) {
+            data.api = event.api
+        },
+    },
+};
+const grid = useTemplateRef<InstanceType<typeof AgGridVue>>("gridRef");
+onMounted(loadData);
+
+function loadData() {
+    Request.request.post("/api/workbench/LccModelManager@projectList").then(res => {
+        state.grid1Data = res.records;
+    });
+}
+
+function open() {
+    const row = data.api?.getSelectedRows()?.[0];
+    if (!row) return;
+    emit("open", row);
+}
+
+function add() {
+    emit("add", expose);
+}
+
+interface OpenProjectExpose {
+    state: OpenProjectState;
+    data: OpenProjectData;
+    loadData: () => void;
+}
+
+const expose: OpenProjectExpose = {
+    state,
+    data,
+    loadData,
+};
+// 定义组件公开内容
+defineExpose(expose);
+
+export type {
+    OpenProjectProps,
+    OpenProjectState,
+}
+</script>
+
+<template>
+    <div class="flex-column-container" style="height: 100%;">
+        <AgGridVue
+            ref="gridRef"
+            :class="['ag-theme-alpine', 'yv-table', 'hi-light-selected-row','allow-vertical-line', 'flex-item-fill']"
+            v-bind="{...data.gridSetting}"
+            :modelValue="state.grid1Data"
+        >
+        </AgGridVue>
+        <div class="flex-item-fixed" style="padding-top: 12px;padding-right: 12px;text-align: right;">
+            <ElButton type="primary" @click="open">打开</ElButton>
+            <ElButton type="primary" @click="add">新建项目</ElButton>
+            <ElButton @click="emit('cancel')">取消</ElButton>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+
+</style>

src/editor/menus/FileMenu.ts

@@ -1,8 +1,55 @@
 import { renderIcon, setQueryParam } from '@/utils/webutils.ts'
 import { defineMenu } from '@/runtime/DefineMenu.ts'
 import SvgCode from '@/components/icons/SvgCode'
-import { nextTick } from 'vue'
+import { createVNode, nextTick } from 'vue'
 import type Viewport from '@/core/engine/Viewport.ts'
+import DataForm from '@/components/data-form/DataForm.vue'
+import OpenProject from '../OpenProject.vue'
+import { Request } from '@ease-forge/shared'
+
+function addProject(successful?: Function) {
+    const data = {
+        server: window.location.origin,
+    };
+    system.showDialog(createVNode(DataForm, {
+        style: {
+            paddingRight: "12px",
+        },
+        data: data,
+        formFields: [
+            {
+                dataPath: 'projectUuid', label: '项目编号', input: 'Input',
+                inputProps: {
+                    placeholder: '请输入项目唯一编号',
+                },
+            },
+            {
+                dataPath: 'projectLabel', label: '项目标题', input: 'Input',
+                inputProps: {
+                    placeholder: '请输入项目标题',
+                },
+            },
+        ],
+        columnCount: 1,
+        labelWidth: "80px",
+    }), {
+        title: '创建项目',
+        width: 480,
+        height: 200,
+        showClose: true,
+        showMax: false,
+        showCancelButton: true,
+        showOkButton: true,
+        okButtonText: "创建",
+        cancelButtonText: "取消",
+
+    }).then(() => {
+        Request.request.post("/api/workbench/LccModelManager@addProject", data).then(()=> {
+            system.msg("创建成功");
+            successful?.();
+        })
+    }).finally();
+}
 
 export default defineMenu((menus) => {
   menus.insertChildren('file',
@@ -12,25 +59,65 @@ export default defineMenu((menus) => {
     [
       {
         name: 'open', label: '打开', icon: SvgCode.open, order: 1, tip: 'Ctrl+O',
-        click: async () => {
-          worldModel.state.isOpened = false
-          worldModel.state.isDraft = false
-          worldModel.state.catalog = []
-          worldModel.state.catalogCode = ''
-          worldModel.state.stateManagerId = ''
-          setQueryParam('store', '')
+          click: async () => {
+              worldModel.state.isOpened = false
+              worldModel.state.isDraft = false
+              worldModel.state.catalog = []
+              worldModel.state.catalogCode = ''
+              worldModel.state.stateManagerId = ''
+              setQueryParam('store', '')
 
-          system.showLoading()
-          try {
-            await nextTick()
+              system.showLoading()
+              try {
+                  await nextTick()
 
-            const res = await import('@/example/example1')
-            worldModel.state.isDraft = false
-            await worldModel.loadWorldFromRemoting(res.default)
+                  const res = await import('@/example/example1')
+                  worldModel.state.isDraft = false
+                  await worldModel.loadWorldFromRemoting(res.default)
 
-          } finally {
-            system.clearLoading()
-          }
+              } finally {
+                  system.clearLoading()
+              }
+          },
+        click2: async () => {
+            let dialog: any = null;
+            system.showDialog(createVNode(OpenProject, {
+                onCancel: () => dialog?.onClose(),
+                onOpen: async row => {
+                    dialog?.onClose();
+                    const veryBigData = JSON.parse(row.otherData);
+                    veryBigData.catalog = JSON.parse(row.directoryData);
+                    veryBigData.items = [];
+                    worldModel.state.isOpened = false
+                    worldModel.state.isDraft = false
+                    worldModel.state.catalog = []
+                    worldModel.state.catalogCode = ''
+                    worldModel.state.stateManagerId = ''
+                    setQueryParam('store', '')
+                    system.showLoading()
+                    try {
+                        await nextTick()
+                        worldModel.state.isDraft = false
+                        await worldModel.loadWorldFromRemoting(veryBigData)
+                    } finally {
+                        system.clearLoading()
+                    }
+                },
+                onAdd: that => {
+                    addProject(() => that.loadData());
+                },
+            }), {
+                title: '打开项目',
+                width: 1500,
+                height: 500,
+                showClose: true,
+                showMax: true,
+                showCancelButton: false,
+                showOkButton: false,
+                okButtonText: "创建",
+                cancelButtonText: "取消",
+                onMounted: d => dialog = d,
+            }).finally();
         }
       },
       {
@@ -42,9 +129,9 @@ export default defineMenu((menus) => {
         }
       },
       {
-        name: 'saveAs', label: '新建项目111', icon: renderIcon('ModelFile'), order: 3,
+        name: 'saveAs', label: '新建项目', icon: renderIcon('ModelFile'), order: 3,
         click: () => {
-          system.msg('新建项目111')
+            addProject();
         }
       }
     ]

src/runtime/System.ts

@@ -3,10 +3,10 @@ import _ from 'lodash'
 import localforage from 'localforage'
 import JSON5 from 'json5'
 import hotkeys from 'hotkeys-js'
-import { defineComponent, h, markRaw, nextTick, reactive, toRaw, unref, type App, createApp, type Component } from 'vue'
-import { ElMessage, ElMessageBox, ElNotification } from 'element-plus'
+import { type App, type Component, createApp, defineComponent, h, markRaw, nextTick, reactive, toRaw, unref } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
 import { QuestionFilled } from '@element-plus/icons-vue'
-import { renderIcon, createShortUUID, setQueryParam, getQueryParams } from '@/utils/webutils.ts'
+import { createShortUUID, getQueryParams, renderIcon, setQueryParam } from '@/utils/webutils.ts'
 import type { showDialogOption } from '@/SystemOption'
 import ShowDialogWrap from '@/components/ShowDialogWrap.vue'
 import LoadingDialog from '@/components/LoadingDialog.vue'
@@ -290,4 +290,5 @@ export interface ShowDialogOption {
   showOkButton?: boolean
   cancelButtonText?: string
   okButtonText?: string
+  onMounted?: (dialog:any)=> void;
 }