update

gradle.properties

@@ -38,7 +38,7 @@ application_version=1.0.0
 platform_group=io.sc
 platform_version=8.1.44
 platform_plugin_version=8.1.44
-platform_core_frontend_version=8.1.287
+platform_core_frontend_version=8.1.288
 
 ###########################################################
 # dependencies version

io.sc.platform.core.frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "platform-core",
-  "version": "8.1.287",
+  "version": "8.1.288",
   "description": "前端核心包,用于快速构建前端的脚手架",
   "//main": "库的主文件",
   "main": "dist/platform-core.js",

io.sc.platform.core.frontend/template-project/package.json

@@ -1,6 +1,6 @@
 {
   "name": "platform-core",
-  "version": "8.1.287",
+  "version": "8.1.288",
   "description": "前端核心包,用于快速构建前端的脚手架",
   "private": false,
   "keywords": [],
@@ -104,7 +104,7 @@
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.287",
+    "platform-core": "8.1.288",
     "quasar": "2.15.4",
     "tailwindcss": "3.4.4",
     "vue": "3.4.31",

io.sc.platform.core.frontend/template-project/src/components/index.ts

@@ -11,6 +11,7 @@ import component_testcase_codemirror from '@/views/testcase/code-mirror/code-mir
 import component_testcase_loading from '@/views/testcase/loading/loading.vue';
 import component_testcase_excel from '@/views/testcase/excel/Excel.vue';
 import component_testcase_word from '@/views/testcase/word/Word.vue';
+import component_testcase_maxgraph from '@/views/testcase/maxgraph/Maxgraph.vue';
 import component_testcase_likmDialog from '@/views/likm/Dialog.vue';
 import component_testcase_likmDrawer from '@/views/likm/Drawer.vue';
 import component_testcase_likmForm from '@/views/likm/Form.vue';
@@ -31,6 +32,7 @@ const localComponents = {
   'component.testcase.loading': component_testcase_loading,
   'component.testcase.excel': component_testcase_excel,
   'component.testcase.word': component_testcase_word,
+  'component.testcase.maxgraph': component_testcase_maxgraph,
   'component.testcase.likmDialog': component_testcase_likmDialog,
   'component.testcase.likmDrawer': component_testcase_likmDrawer,
   'component.testcase.likmForm': component_testcase_likmForm,

io.sc.platform.core.frontend/template-project/src/menus/menus.json

@@ -81,6 +81,15 @@
     "icon": "bi-palette",
     "routeName": "route.testcase.excel"
   },
+  {
+    "type": "ROUTE",
+    "order": 500,
+    "parentId": "menu.testcase",
+    "id": "menu.testcase.maxgraph",
+    "titleI18nKey": "menu.testcase.maxgraph",
+    "icon": "bi-palette",
+    "routeName": "route.testcase.maxgraph"
+  },
   {
     "type": "ROUTE",
     "order": 500,

io.sc.platform.core.frontend/template-project/src/routes/routes.json

@@ -117,6 +117,19 @@
     }
   },
 
+  {
+    "name": "route.testcase.maxgraph",
+    "path": "testcase/maxgraph",
+    "parent": "/",
+    "priority": 0,
+    "component": "component.testcase.maxgraph",
+    "componentPath": "@/views/testcase/maxgraph/Maxgraph.vue",
+    "redirect": null,
+    "meta": {
+      "permissions": ["/testcase/maxgraph/**/*"]
+    }
+  },
+
   {
     "name": "route.testcase.likm.dialog",
     "path": "testcase/likm/dialog",

io.sc.platform.core.frontend/template-project/src/views/likm/Grid.vue

@@ -57,14 +57,14 @@
         </q-tab-panels>
       </template>
     </q-splitter> -->
-    <w-grid
+    <!-- <w-grid
       ref="gridRef"
       :title="testGrid.title"
       draggable
       :dense="state.dense"
       :hide-bottom="false"
       :data-url="testGrid.tableDataUrl"
-      :auto-fetch-data="false"
+      :auto-fetch-data="true"
       :checkbox-selection="true"
       selection="multiple"
       :query-form-cols-num="6"
@@ -95,16 +95,86 @@
       @row-db-click="rowDbClick"
       @after-request-data="
         () => {
-          // console.info('1111111111111111111111111111');
         }
       "
-    ></w-grid>
+    ></w-grid> -->
+    <w-grid
+      ref="applicationGridRef"
+      :title="$t('system.application.grid.title')"
+      :config-button="true"
+      selection="multiple"
+      :checkbox-selection="true"
+      :sort-no="true"
+      :draggable="true"
+      :data-url="Environment.apiContextPath('/api/system/application')"
+      :sort-by="['order']"
+      :query-form-cols-num="3"
+      :query-form-fields="[
+        { name: 'code', label: $t('code'), type: 'text' },
+        { name: 'name', label: $t('name'), type: 'text' },
+        { name: 'enable', label: $t('isEnable'), type: 'select', options: Options.yesNo() },
+      ]"
+      :toolbar-configure="{ noIcon: false }"
+      :toolbar-actions="['query', 'refresh', 'separator', 'add', 'clone', 'edit', 'remove', 'separator', 'view', 'separator', 'export']"
+      :columns="[
+        { width: 60, name: 'order', label: $t('order') },
+        { width: 100, name: 'code', label: $t('code') },
+        { width: '100%', name: 'name', label: $t('name') },
+        { width: 80, name: 'enable', label: $t('status'), format: Formater.enableTag() },
+        { width: 120, name: 'lastModifier', label: $t('lastModifier') },
+        { width: 120, name: 'lastModifyDate', label: $t('lastModifyDate'), format: Formater.dateOnly() },
+      ]"
+      :editor="{
+        dialog: {
+          width: '600px',
+          height: '300px',
+        },
+        form: {
+          colsNum: 1,
+          fields: [
+            { name: 'code', label: $t('code'), type: 'text', required: true },
+            { name: 'name', label: $t('name'), type: 'text', required: true },
+            { name: 'description', label: $t('description'), type: 'textarea', rows: 1 },
+            { name: 'order', label: $t('order'), type: 'number' },
+            { name: 'enable', label: $t('enable'), type: 'checkbox', defaultValue: true },
+          ],
+        },
+      }"
+      :viewer="{
+        panel: {
+          columnNum: 1,
+          fields: [
+            { name: 'id', label: $t('id') },
+            { name: 'code', label: $t('code') },
+            { name: 'name', label: $t('name') },
+            { name: 'description', label: $t('description') },
+            { name: 'enable', label: $t('enable'), format: Formater.none() },
+            { name: 'order', label: $t('order') },
+            { name: 'dataComeFrom', label: $t('dataComeFrom') },
+            { name: 'creator', label: $t('creator') },
+            { name: 'createDate', label: $t('createDate') },
+            { name: 'lastModifier', label: $t('lastModifier') },
+            { name: 'lastModifyDate', label: $t('lastModifyDate'), format: Formater.none() },
+            { name: 'corporationCode', label: $t('corporationCode') },
+          ],
+        },
+      }"
+      @row-click="(evt, row, index) => {}"
+      @before-request-data="() => {}"
+      @after-row-draggable="
+        (grid, updateDatas) => {
+          console.info('grid=====', grid);
+          console.info('updateDatas======', updateDatas);
+        }
+      "
+    >
+    </w-grid>
   </div>
 </template>
 
 <script setup lang="ts">
 import { ref, onMounted, nextTick, reactive, computed } from 'vue';
-import { axios, Environment, EnumTools, Options } from '@/platform';
+import { axios, Environment, EnumTools, Options, Formater } from '@/platform';
 import EnableIcon from '@/platform/components/grid/EnableIcon.vue';
 import { IconEnum } from '@/platform/enums';
 
@@ -300,52 +370,52 @@ const testGrid = {
     // { label: '最后修改时间', name: 'lastModifyDate', type: 'w-date' },
   ],
   tableColumns: [
-    {
+    // {
-      name: 'info',
+    //   name: 'info',
-      label: '用户信息',
+    //   label: '用户信息',
-      columns: [
+    //   columns: [
-        { name: 'loginName', label: '登录名', align: 'right' },
+    //     { name: 'loginName', label: '登录名', align: 'right' },
-        { name: 'userName', label: '用户名' },
+    //     { name: 'userName', label: '用户名' },
-      ],
+    //   ],
-    },
+    // },
-    // { name: 'loginName', label: '登录名', align: 'right' },
+    { name: 'loginName', label: '登录名', align: 'right' },
-    // { name: 'userName', label: '用户名' },
+    { name: 'userName', label: '用户名' },
-    {
+    // {
-      name: 'lxxx',
+    //   name: 'lxxx',
-      label: '联系方式',
+    //   label: '联系方式',
-      columns: [
+    //   columns: [
-        {
+    //     {
-          name: 'email',
+    //       name: 'email',
-          label: '邮箱地址',
+    //       label: '邮箱地址',
-          columns: [
+    //       columns: [
-            { width: 100, name: 'auc', label: 'auc' },
+    //         { width: 100, name: 'auc', label: 'auc' },
-            { width: 100, name: 'ar', label: 'ar' },
+    //         { width: 100, name: 'ar', label: 'ar' },
-            { width: 100, name: 'ks', label: 'ks' },
+    //         { width: 100, name: 'ks', label: 'ks' },
-          ],
+    //       ],
-        },
+    //     },
-        {
+    //     {
-          name: 'tx',
+    //       name: 'tx',
-          label: '通讯',
+    //       label: '通讯',
-          columns: [
+    //       columns: [
-            { name: 'phone', label: '电话' },
+    //         { name: 'phone', label: '电话' },
-            { name: 'mobile', label: '手机号' },
+    //         { name: 'mobile', label: '手机号' },
-          ],
+    //       ],
-        },
+    //     },
-        {
+    //     {
-          name: 'qq',
+    //       name: 'qq',
-          label: 'QQ',
+    //       label: 'QQ',
-          // columns: [
+    //       // columns: [
-          //   { width: 100, name: 'aucQualitative', label: 'aucQualitative' },
+    //       //   { width: 100, name: 'aucQualitative', label: 'aucQualitative' },
-          //   { width: 100, name: 'arQualitative', label: 'arQualitative' },
+    //       //   { width: 100, name: 'arQualitative', label: 'arQualitative' },
-          //   { width: 100, name: 'ksQualitative', label: 'ksQualitative' },
+    //       //   { width: 100, name: 'ksQualitative', label: 'ksQualitative' },
-          // ],
+    //       // ],
-        },
+    //     },
-      ],
+    //   ],
-    },
+    // },
-    // { name: 'email', label: '邮箱地址' },
+    { name: 'email', label: '邮箱地址' },
-    // { name: 'phone', label: '电话' },
+    { name: 'phone', label: '电话' },
-    // { name: 'mobile', label: '手机号' },
+    { name: 'mobile', label: '手机号' },
-    // { name: 'qq', label: 'QQ' },
+    { name: 'qq', label: 'QQ' },
     { name: 'description', label: '描述', width: 400 },
     {
       name: 'enable',
@@ -417,46 +487,46 @@ const testGrid = {
 };
 
 onMounted(() => {
-  gridRef.value.setLocalData([
+  // gridRef.value.setLocalData([
-    {
+  //   {
-      loginName: 'admin1',
+  //     loginName: 'admin1',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin2',
+  //     loginName: 'admin2',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin3',
+  //     loginName: 'admin3',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin4',
+  //     loginName: 'admin4',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin5',
+  //     loginName: 'admin5',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin6',
+  //     loginName: 'admin6',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin7',
+  //     loginName: 'admin7',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin8',
+  //     loginName: 'admin8',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin9',
+  //     loginName: 'admin9',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin10',
+  //     loginName: 'admin10',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin11',
+  //     loginName: 'admin11',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin12',
+  //     loginName: 'admin12',
-    },
+  //   },
-    {
+  //   {
-      loginName: 'admin13',
+  //     loginName: 'admin13',
-    },
+  //   },
-  ]);
+  // ]);
 });
 </script>

io.sc.platform.core.frontend/template-project/src/views/likm/TreeGrid.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="h-full">
     <w-grid
       ref="gridRef"
       :title="testGrid.title"
@@ -15,6 +15,12 @@
       :query-form-fields="testGrid.queryFormFields"
       :query-form-cols-num="3"
       @update-ticked="updateTicked"
+      @after-row-draggable="
+        (grid, updateDatas) => {
+          console.info('grid=====', grid);
+          console.info('updateDatas======', updateDatas);
+        }
+      "
     ></w-grid>
   </div>
 </template>
@@ -29,8 +35,8 @@ import { IconEnum } from '@/platform/enums';
 const { t } = useI18n();
 
 const updateTicked = (event, row) => {
-  console.info('treeGrid.updateTicked.event====', event);
+  // console.info('treeGrid.updateTicked.event====', event);
-  console.info('treeGrid.updateTicked.row====', row);
+  // console.info('treeGrid.updateTicked.row====', row);
 };
 
 const startY = ref(0);

io.sc.platform.core.frontend/template-project/src/views/testcase/maxgraph/Maxgraph.vue

@@ -0,0 +1,51 @@
+<template>
+  <div id="graph-container"></div>
+</template>
+<script setup lang="ts">
+import { onMounted, vue } from 'vue';
+import { type CellStyle, Graph, InternalEvent } from '@maxgraph/core';
+
+onMounted(() => {
+  const container = <HTMLElement>document.getElementById('graph-container');
+  // Disables the built-in context menu
+  InternalEvent.disableContextMenu(container);
+
+  const graph = new Graph(container);
+  graph.setPanning(true); // Use mouse right button for panning
+  // Gets the default parent for inserting new cells. This
+  // is normally the first child of the root (ie. layer 0).
+  const parent = graph.getDefaultParent();
+
+  // Adds cells to the model in a single step
+  graph.batchUpdate(() => {
+    const vertex01 = graph.insertVertex({
+      parent,
+      position: [10, 10],
+      size: [100, 100],
+      value: 'rectangle',
+    });
+    const vertex02 = graph.insertVertex({
+      parent,
+      position: [350, 90],
+      size: [50, 50],
+      style: {
+        fillColor: 'orange',
+        shape: 'ellipse',
+        verticalAlign: 'top',
+        verticalLabelPosition: 'bottom',
+      },
+      value: 'ellipse',
+    });
+    graph.insertEdge({
+      parent,
+      source: vertex01,
+      target: vertex02,
+      value: 'edge',
+      style: {
+        edgeStyle: 'orthogonalEdgeStyle',
+        rounded: true,
+      },
+    });
+  });
+});
+</script>

io.sc.platform.core.frontend/template-project/src/views/types/VertexParameterType.ts

@@ -1,11 +0,0 @@
-import { Geometry,CellStyle } from '@maxgraph/core';
-
-export type VertexParameterType = {
-  id: string | undefined;
-  title: string | undefined;
-  width?: number;
-  height?:number;
-  geometry?: Geometry;
-  value: any;
-  style?: CellStyle;
-};