fixed: 修改流程json编辑器不生效的bug

.gitignore

aiot
dist-ssr
*.local
*.zip
# Editor directories and files
.vscode/*

package-lock.json

      "integrity": "sha512-JlQpbN2bBRZEs5J8xbpKf3+SU3NUj604Pg2Lm1/RslXk3m5ix9utQ6IYQUs/FGglPvPEF2zmdY9/aL3zUrbNUw==",
      "requires": {
        "vue-demi": "^0.13.11"
      },
      "dependencies": {
        "vue-demi": {
          "version": "0.13.11",
          "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.13.11.tgz",
          "integrity": "sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A=="
        }
      }
    },
    "@babel/code-frame": {
        "fastq": "^1.6.0"
      }
    },
    "@originjs/vite-plugin-commonjs": {
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/@originjs/vite-plugin-commonjs/-/vite-plugin-commonjs-1.0.3.tgz",
      "integrity": "sha512-KuEXeGPptM2lyxdIEJ4R11+5ztipHoE7hy8ClZt3PYaOVQ/pyngd2alaSrPnwyFeOW1UagRBaQ752aA1dTMdOQ==",
      "requires": {
        "esbuild": "^0.14.14"
      },
      "dependencies": {
        "@esbuild/linux-loong64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.14.54.tgz",
          "integrity": "sha512-bZBrLAIX1kpWelV0XemxBZllyRmM6vgFQQG2GdNb+r3Fkp0FOh1NJSvekXDs7jq70k4euu1cryLMfU+mTXlEpw==",
          "optional": true
        },
        "esbuild": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.14.54.tgz",
          "integrity": "sha512-Cy9llcy8DvET5uznocPyqL3BFRrFXSVqbgpMJ9Wz8oVjZlh/zUSNbPRbov0VX7VxN2JH1Oa0uNxZ7eLRb62pJA==",
          "requires": {
            "@esbuild/linux-loong64": "0.14.54",
            "esbuild-android-64": "0.14.54",
            "esbuild-android-arm64": "0.14.54",
            "esbuild-darwin-64": "0.14.54",
            "esbuild-darwin-arm64": "0.14.54",
            "esbuild-freebsd-64": "0.14.54",
            "esbuild-freebsd-arm64": "0.14.54",
            "esbuild-linux-32": "0.14.54",
            "esbuild-linux-64": "0.14.54",
            "esbuild-linux-arm": "0.14.54",
            "esbuild-linux-arm64": "0.14.54",
            "esbuild-linux-mips64le": "0.14.54",
            "esbuild-linux-ppc64le": "0.14.54",
            "esbuild-linux-riscv64": "0.14.54",
            "esbuild-linux-s390x": "0.14.54",
            "esbuild-netbsd-64": "0.14.54",
            "esbuild-openbsd-64": "0.14.54",
            "esbuild-sunos-64": "0.14.54",
            "esbuild-windows-32": "0.14.54",
            "esbuild-windows-64": "0.14.54",
            "esbuild-windows-arm64": "0.14.54"
          }
        },
        "esbuild-android-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-android-64/-/esbuild-android-64-0.14.54.tgz",
          "integrity": "sha512-Tz2++Aqqz0rJ7kYBfz+iqyE3QMycD4vk7LBRyWaAVFgFtQ/O8EJOnVmTOiDWYZ/uYzB4kvP+bqejYdVKzE5lAQ==",
          "optional": true
        },
        "esbuild-android-arm64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.14.54.tgz",
          "integrity": "sha512-F9E+/QDi9sSkLaClO8SOV6etqPd+5DgJje1F9lOWoNncDdOBL2YF59IhsWATSt0TLZbYCf3pNlTHvVV5VfHdvg==",
          "optional": true
        },
        "esbuild-darwin-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.14.54.tgz",
          "integrity": "sha512-jtdKWV3nBviOd5v4hOpkVmpxsBy90CGzebpbO9beiqUYVMBtSc0AL9zGftFuBon7PNDcdvNCEuQqw2x0wP9yug==",
          "optional": true
        },
        "esbuild-darwin-arm64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.54.tgz",
          "integrity": "sha512-OPafJHD2oUPyvJMrsCvDGkRrVCar5aVyHfWGQzY1dWnzErjrDuSETxwA2HSsyg2jORLY8yBfzc1MIpUkXlctmw==",
          "optional": true
        },
        "esbuild-freebsd-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.54.tgz",
          "integrity": "sha512-OKwd4gmwHqOTp4mOGZKe/XUlbDJ4Q9TjX0hMPIDBUWWu/kwhBAudJdBoxnjNf9ocIB6GN6CPowYpR/hRCbSYAg==",
          "optional": true
        },
        "esbuild-freebsd-arm64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.54.tgz",
          "integrity": "sha512-sFwueGr7OvIFiQT6WeG0jRLjkjdqWWSrfbVwZp8iMP+8UHEHRBvlaxL6IuKNDwAozNUmbb8nIMXa7oAOARGs1Q==",
          "optional": true
        },
        "esbuild-linux-32": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.14.54.tgz",
          "integrity": "sha512-1ZuY+JDI//WmklKlBgJnglpUL1owm2OX+8E1syCD6UAxcMM/XoWd76OHSjl/0MR0LisSAXDqgjT3uJqT67O3qw==",
          "optional": true
        },
        "esbuild-linux-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.54.tgz",
          "integrity": "sha512-EgjAgH5HwTbtNsTqQOXWApBaPVdDn7XcK+/PtJwZLT1UmpLoznPd8c5CxqsH2dQK3j05YsB3L17T8vE7cp4cCg==",
          "optional": true
        },
        "esbuild-linux-arm": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.14.54.tgz",
          "integrity": "sha512-qqz/SjemQhVMTnvcLGoLOdFpCYbz4v4fUo+TfsWG+1aOu70/80RV6bgNpR2JCrppV2moUQkww+6bWxXRL9YMGw==",
          "optional": true
        },
        "esbuild-linux-arm64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.54.tgz",
          "integrity": "sha512-WL71L+0Rwv+Gv/HTmxTEmpv0UgmxYa5ftZILVi2QmZBgX3q7+tDeOQNqGtdXSdsL8TQi1vIaVFHUPDe0O0kdig==",
          "optional": true
        },
        "esbuild-linux-mips64le": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.54.tgz",
          "integrity": "sha512-qTHGQB8D1etd0u1+sB6p0ikLKRVuCWhYQhAHRPkO+OF3I/iSlTKNNS0Lh2Oc0g0UFGguaFZZiPJdJey3AGpAlw==",
          "optional": true
        },
        "esbuild-linux-ppc64le": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.54.tgz",
          "integrity": "sha512-j3OMlzHiqwZBDPRCDFKcx595XVfOfOnv68Ax3U4UKZ3MTYQB5Yz3X1mn5GnodEVYzhtZgxEBidLWeIs8FDSfrQ==",
          "optional": true
        },
        "esbuild-linux-riscv64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.54.tgz",
          "integrity": "sha512-y7Vt7Wl9dkOGZjxQZnDAqqn+XOqFD7IMWiewY5SPlNlzMX39ocPQlOaoxvT4FllA5viyV26/QzHtvTjVNOxHZg==",
          "optional": true
        },
        "esbuild-linux-s390x": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.54.tgz",
          "integrity": "sha512-zaHpW9dziAsi7lRcyV4r8dhfG1qBidQWUXweUjnw+lliChJqQr+6XD71K41oEIC3Mx1KStovEmlzm+MkGZHnHA==",
          "optional": true
        },
        "esbuild-netbsd-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.54.tgz",
          "integrity": "sha512-PR01lmIMnfJTgeU9VJTDY9ZerDWVFIUzAtJuDHwwceppW7cQWjBBqP48NdeRtoP04/AtO9a7w3viI+PIDr6d+w==",
          "optional": true
        },
        "esbuild-openbsd-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.54.tgz",
          "integrity": "sha512-Qyk7ikT2o7Wu76UsvvDS5q0amJvmRzDyVlL0qf5VLsLchjCa1+IAvd8kTBgUxD7VBUUVgItLkk609ZHUc1oCaw==",
          "optional": true
        },
        "esbuild-sunos-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.14.54.tgz",
          "integrity": "sha512-28GZ24KmMSeKi5ueWzMcco6EBHStL3B6ubM7M51RmPwXQGLe0teBGJocmWhgwccA1GeFXqxzILIxXpHbl9Q/Kw==",
          "optional": true
        },
        "esbuild-windows-32": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.14.54.tgz",
          "integrity": "sha512-T+rdZW19ql9MjS7pixmZYVObd9G7kcaZo+sETqNH4RCkuuYSuv9AGHUVnPoP9hhuE1WM1ZimHz1CIBHBboLU7w==",
          "optional": true
        },
        "esbuild-windows-64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.14.54.tgz",
          "integrity": "sha512-AoHTRBUuYwXtZhjXZbA1pGfTo8cJo3vZIcWGLiUcTNgHpJJMC1rVA44ZereBHMJtotyN71S8Qw0npiCIkW96cQ==",
          "optional": true
        },
        "esbuild-windows-arm64": {
          "version": "0.14.54",
          "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.54.tgz",
          "integrity": "sha512-M0kuUvXhot1zOISQGXwWn6YtS+Y/1RT9WrVIOywZnJHo3jCDyewAc79aKNQWFCQm+xNHVTq9h8dZKvygoXQQRg==",
          "optional": true
        }
      }
    },
    "@rollup/pluginutils": {
      "version": "4.2.1",
      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.1.tgz",

package.json

    "@antv/x6-plugin-selection": "^2.1.5",
    "@antv/x6-plugin-snapline": "^2.1.6",
    "@antv/x6-vue-shape": "^2.0.10",
    "@originjs/vite-plugin-commonjs": "^1.0.3",
    "@typescript-eslint/parser": "^5.42.1",
    "@vitejs/plugin-vue-jsx": "^3.0.0",
    "@vueuse/core": "^9.5.0",

src/App.vue

  background-color: #f9f9f9;
  font-size: 12px;
  font-family: 'PingFang SC';
  user-select: none;
}
</style>

src/api/flow.ts

}
// 测试接口
export function testLogic(data: any, id: any) {
export function logicModeUpdate(data: any, id: any) {
  return AIotRequest.patch({
    url: `{flow.logicMgmt}/${id}`,
    url: `${flow.logicMgmt}/${id}`,
    data
  });
}
//
// 接口测试
export function testLogic(data: any, id: any) {
  return AIotRequest.post({
    url: `${flow.testLogic}/${id}`,
    data
  });
}

src/main.ts

 * @LastEditTime: 2023-02-23 16:43:29
 * @Description: 主配置
 */
// eslint-disable-next-line import/no-extraneous-dependencies
// import 'jsoneditor';
import { createApp } from 'vue';
import CommonUI from 'common-module-ui';
import 'common-module-ui/lib/style.css';
import { setEventBus } from './utils/eventBus.js';
import { setupGlobalComponents } from './components/index';
// import { setupGlobalComponents } from './components/index';
// import CommonUI from './common-ui/common-module-ui.js';
// import './common-ui/style.css';
  setEventBus(app);
  app.use(router);
  app.use(CommonUI);
  console.log(CommonUI);
  app.use(store);
  setupGlobalComponents(app);
  // setupGlobalComponents(app);
  // 注册项目全局组件
  setupProductComponents(app);

src/views/_components/panel/PanelFunction.vue

</template>
<script setup>
import { getCurrentInstance, ref, watch } from 'vue';
import { ref, watch } from 'vue';
import CommonPanel from './common/CommonPanel.vue';
import InputOutputTab from './sql-components/InputOutputTab.vue';
import ParamItem from './common/ParamItem.vue';
import { getFunctionList } from '../../../api/flow';
const { proxy } = getCurrentInstance();
const props = defineProps({
  targetNode: {
    type: Object,

src/views/_components/panel/PanelSql.vue

import { getCurrentInstance, reactive, ref, watch } from 'vue';
import MyCode from '../_codemirror/MyCode.vue';
import InputOutputTab from './sql-components/InputOutputTab.vue';
import { getSQLList } from '../../../api/flow';
import { getSqlList } from '../../../api/flow';
const { proxy } = getCurrentInstance();
const props = defineProps({
});
// 获取数据库列表
function getList() {
  getSQLList()
  getSqlList()
    .then((res) => {
      if (res.data.resultCode === '0') {
        datasources.value = res.data.result.map((item) => {

src/views/_components/panel/PanelStart.vue

          'min-width': '150'
        }
      ],
      data: dataBus?.[flowId.value]?.customAttrs.data || []
      data: dataBus?.[flowId.value]?.customAttrs?.data || []
    }
  });
  const handleSelectChange = (checkeds) => {

src/views/flow/_components/ApiDetailPage.vue

        <h4 class="sub-title">请求参数</h4>
        <div>
          <JsonEditorVue
          <JsonEditor
            v-model="testRequest.params"
            class="editor"
            current-mode="code"
            :mode-list="['code']"
            @blur="validate"
          ></JsonEditorVue>
          ></JsonEditor>
        </div>
      </div>
      <div class="card">
        <h4 class="sub-title">响应参数</h4>
        <!-- <ipu-input
          v-model="testResponse"
          class="result"
          v-bind="attributes"
          disabled
        ></ipu-input> -->
        <div>
          <!-- <JsonEditorVue
          <JsonEditor
            v-model="testResponse"
            class="editor"
            current-mode="code"
            :mode-list="['code']"
            @blur="validate"
          ></JsonEditorVue> -->
          ></JsonEditor>
        </div>
      </div>
    </div>
</template>
<script setup>
// import JsonEditorVue from 'json-editor-vue3';
import JsonEditor from 'json-editor-vue3';
import { getCurrentInstance, onMounted, ref, watch } from 'vue';
import { logicModeUpdate, testLogic } from '../../../api/flow';
  background: rgba(0, 0, 0, 0.4);
  border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}
.full-screen-container {
  background-color: #000 !important;
}
</style>

src/views/sub-flow/SubFlowList.vue

  </common-drawer>
</template>
<script setup lang="ts">
<script setup>
import { ref, getCurrentInstance, computed } from 'vue';
import { useRouter } from 'vue-router';
import { searchConfig, formConfig } from './_config';
const { proxy } = getCurrentInstance();
const router = useRouter();
const modeMap = <any>{
const modeMap = {
  add: '新增子流程',
  edit: '编辑子流程',
  copy: '复制子流程'
};
const mode = ref('add');
const subFlowId = ref<any>('');
const subFlowId = ref('');
// dialog
const drawerTitle = computed(() => modeMap[mode.value]);
const showDrawer = ref<any>(false);
const showDrawer = ref(false);
// table
const tableHeader = ref<any>([
const tableHeader = ref([
  { name: 'name', label: '名称', 'min-width': 200 },
  { name: 'desc', label: '描述', 'min-width': 200 },
  { name: 'stateDesc', label: '状态', 'min-width': 200 },
  { name: 'referencesNum', label: '关联数', 'min-width': 200 },
  { name: 'custom', type: 'custom', label: '操作', fixed: 'right', width: 200 }
]);
const tableData = ref<any>([]);
const tableData = ref([]);
function parseBtns(item: any) {
  const btns = <any>[
function parseBtns(item) {
  const btns = [
    // eslint-disable-next-line no-use-before-define
    { label: '详情', name: 'view', onClick: view },
    // eslint-disable-next-line no-use-before-define
  return btns;
}
// 功能按钮
const functionButtons = ref<any>([
const functionButtons = ref([
  {
    label: '新增子流程',
    name: 'add',
  }
]);
// 页脚
const page = ref<any>({
const page = ref({
  pageSize: 10,
  current: 1,
  total: 0
// 获取子流程列表
function getSubFlowList() {
  const params = <any>{
  const params = {
    name: '',
    pageNumber: 1,
    pageSize: 10
      console.log(res);
      if (res.resultCode === '0') {
        tableData.value = res.result;
        tableData.value.map((item: any) => {
        tableData.value.map((item) => {
          item.actions = parseBtns(item);
          return item;
        });
}
// 初始化弹窗数据
function initDialogData(data: any) {
function initDialogData(data) {
  subFlowId.value = data.id;
  formConfig.value.subflow.formValues.name = data.name;
  formConfig.value.subflow.formValues.desc = data.desc;
}
// 详情
function view(item: any) {
function view(item) {
  router.push({
    name: 'SubFlow',
    query: {
  });
}
// 编辑子流程
function edit(data: any) {
function edit(data) {
  initDialogData(data);
  mode.value = 'edit';
}
// 删除子流程
function deleteFn(data: any) {
function deleteFn(data) {
  proxy
    .$confirm('确定要删除此子流程吗？', '警告', {
      confirmButtonText: '确定',
}
// 发布子流程
function publish(item: any) {
function publish(item) {
  // stateValue: 1:保存，2：提测；3：测试通过发布；
  const params = <any>{};
  const params = {};
  if (item.state === 'UNPUBLISHED') {
    params.stateValue = '2';
  } else if (item.state === 'PUBLISHED') {
  }
  api
    .updateSubFlowById(params, item.id)
    .then((res: any) => {
    .then((res) => {
      if (res.resultCode === '0') {
        proxy.$message.success(res.resultMsg);
        getSubFlowList();
        proxy.$message.error(res.resultMsg);
      }
    })
    .catch((err: any) => {
    .catch((err) => {
      proxy.$message.error(err);
    });
}
// 测试子流程节点
function test() {}
// 复制子流程
function copy(data: any) {
function copy(data) {
  initDialogData(data);
  mode.value = 'copy';
}
// 发布子流程
// 创建子流程
function createSubFlow(params: any) {
function createSubFlow(params) {
  api
    .createSubFlow(params)
    .then((res: any) => {
    .then((res) => {
      if (res.resultCode === '0') {
        proxy.$message.success(res.resultMsg);
        getSubFlowList();
        proxy.$message.error(res.resultMsg);
      }
    })
    .catch((err: any) => {
    .catch((err) => {
      proxy.$message.error(err);
    });
}
// 修改子流程
function updateSubFlowById(params: any) {
function updateSubFlowById(params) {
  api
    .updateSubFlowById(params, subFlowId.value)
    .then((res: any) => {
    .then((res) => {
      if (res.resultCode === '0') {
        proxy.$message.success('修改成功！');
        // eslint-disable-next-line no-use-before-define
      // eslint-disable-next-line no-use-before-define
      closeDialog();
    })
    .catch((err: any) => {
    .catch((err) => {
      proxy.$message.error(err);
    });
}
// 复制子流程
function copySubFlowById(params: any) {
function copySubFlowById(params) {
  api
    .copySubFlowById(params, subFlowId.value)
    .then((res: any) => {
    .then((res) => {
      if (res.resultCode === '0') {
        proxy.$message.success('复制成功！');
        // eslint-disable-next-line no-use-before-define
      // eslint-disable-next-line no-use-before-define
      closeDialog();
    })
    .catch((err: any) => {
    .catch((err) => {
      proxy.$message.error(err);
    });
}
}
// 确认提交
function confirmDialog() {
  const params = <any>{
  const params = {
    name: formConfig.value.subflow.formValues.name,
    desc: formConfig.value.subflow.formValues.desc,
    databusData: '',
    jsonData: '',
    nodesData: {}
  };
  const param = <any>{
  const param = {
    name: formConfig.value.subflow.formValues.name,
    desc: formConfig.value.subflow.formValues.desc
  };

vite.config.ts

// @ts-ignore
import viteCompression from 'vite-plugin-compression';
import { visualizer } from 'rollup-plugin-visualizer';
import { viteCommonjs } from '@originjs/vite-plugin-commonjs';
// https://vitejs.dev/config/
// @ts-ignore
    base: mode === 'development' ? './' : './',
    plugins: [
      vue(),
      viteCommonjs(),
      visualizer({
        open: true, // 注意这里要设置为true，否则无效
        gzipSize: true,