update： 流程编排系统管理功能完善

package-lock.json

@@ -7064,6 +7064,11 @@
      "resolved": "https://registry.npmjs.org/mobius1-selectr/-/mobius1-selectr-2.4.13.tgz",
      "integrity": "sha512-Mk9qDrvU44UUL0EBhbAA1phfQZ7aMZPjwtL7wkpiBzGh8dETGqfsh50mWoX9EkjDlkONlErWXArHCKfoxVg0Bw=="
    },
    "moment": {
      "version": "2.29.4",
      "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz",
      "integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w=="
    },
    "mousetrap": {
      "version": "1.6.5",
      "resolved": "https://registry.npmjs.org/mousetrap/-/mousetrap-1.6.5.tgz",

package.json

@@ -32,6 +32,7 @@
    "eslint-plugin-vue": "^9.7.0",
    "json-editor-vue3": "^1.0.8",
    "mitt": "^3.0.0",
    "moment": "^2.29.4",
    "prettier": "^2.7.1",
    "qs": "^6.11.1",
    "sass": "^1.56.1",

src/App.vue

@@ -15,7 +15,14 @@
    :aside-width="asideWidth"
    :breads="route.meta.breadcrumb"
    @handle-change-collapse="handleChangeCollapse"
  ></common-layer>
  >
    <!-- <template #breadLeft>
      <div>左侧说明文件</div>
    </template>
    <template #breadRight>
      <el-button size="small" type="primary">右侧插槽位置</el-button>
    </template> -->
  </common-layer>
</template>
<script setup lang="ts">
import { ref } from 'vue';
@@ -36,6 +43,13 @@ const menuList = ref<any>([
    icon: 'common-jihuoshebei',
    level: 1,
    path: '/sub-flow'
  },
  {
    label: '上线管理',
    name: 'manager',
    icon: 'common-jihuoshebei',
    level: 1,
    path: '/manager'
  }
]);

src/api/flow.ts

@@ -39,9 +39,9 @@ export function createSystem(data: any) {
}
// 修改系统
export function updateSystem(data: any) {
export function updateSystem(data: any, id: any) {
  return AIotRequest.patch({
    url: flow.systemMgmt,
    url: `${flow.systemMgmt}/${id}`,
    data
  });
}
@@ -54,9 +54,9 @@ export function deleteSystemById(data: any) {
  });
}
// 克隆系统
export function copySystemById(data: any) {
export function copySystemById(data: any, id: any) {
  return AIotRequest.post({
    url: flow.systemMgmt,
    url: `${flow.sysclone}/${id}`,
    data
  });
}
@@ -66,6 +66,20 @@ export function getSystemDetailById(id: any) {
    url: `${flow.systemMgmt}/${id}`
  });
}
// 获取已上线version列表
export function getOnlineVersionList(data: any) {
  return AIotRequest.get({
    url: flow.stableVersion,
    data
  });
}
// 切换版本
export function changeVersionById(data: any, id: any) {
  return AIotRequest.patch({
    url: `${flow.systemMgmt}/${id}`,
    data
  });
}
/**
 * 版本 start

src/views/flow/SystemDetail.vue

@@ -38,13 +38,17 @@
        </div>
      </template>
      <template #right>
        <div class="content">
        <div class="service-content">
          <api-detail-page
            v-if="apiDetail"
            :api-detail="apiDetail"
            :version-state="versionState.CURRENT_STATE"
            @edit-logic-api="editLogicApi"
            @init-api-info="initApiInfo"
          ></api-detail-page>
          <div v-else class="empty">
            <el-empty description="请创建一条逻辑"></el-empty>
          </div>
        </div>
      </template>
    </common-panel>
@@ -96,6 +100,12 @@ const btns = ref([
  { label: '编辑', name: 'edit', onClick: editVersion, type: 'primary' },
  { label: '发布', name: 'publish', onClick: publishVersion, type: 'primary' }
]);
const versionState = ref({
  EDIT_STATE: '0', // 稳定太
  DEVELOPMENT_STATE: '1', // 编辑太
  CURRENT_STATE: '0' // 当前默认状态为稳定太
});
// 获取系统详情
const systemId = computed(() => route.query.id);
const curVersionId = ref('');
@@ -215,6 +225,9 @@ function getModuleData() {
  api.getModuleList(params).then((res) => {
    if (res.resultCode === '0') {
      moduleTreeData.value = res.result;
      if (!curLogic.value) {
        curLogic.value = moduleTreeData.value?.[0]?.logicServices?.[0].id || '';
      }
    } else {
      proxy.$message.error('');
    }
@@ -361,7 +374,6 @@ function update(node, data) {
  operateType.value = 'edit';
  if (node.level === 1) {
    drawerType.value = 'module';
    moduleTitle.value = '编辑模块';
    curModule.value = data.id;
    moduleValues.value = {
@@ -405,7 +417,6 @@ function clone(node, data) {
        name: 'moduleId',
        type: 'select',
        label: '选择模块',
        attrs: {
          col: 1,
          style: {
@@ -432,6 +443,9 @@ function clone(node, data) {
}
// 获取接口详情
async function getApiDetail() {
  if (!curLogic.value) {
    return;
  }
  await api.getLogicDetailById(curLogic.value).then((res) => {
    if (res.resultCode === '0') {
      apiDetail.value = res.result;
@@ -446,6 +460,8 @@ function handelNodeClick(data) {
  if (isLeaf) {
    curLogic.value = data.id;
    getApiDetail();
  } else {
    curLogic.value = '';
  }
}
@@ -541,6 +557,7 @@ onMounted(async () => {
  await getSystemDetail();
  await getVersionList();
  await getModuleData();
  await getApiDetail();
});
</script>
@@ -548,6 +565,9 @@ onMounted(async () => {
.system-tree {
  height: 100%;
  background: #fff;
  padding: 10px;
  border-radius: 4px;
  box-sizing: border-box;
}
.system-detail-btns {
  display: flex;
@@ -560,4 +580,26 @@ onMounted(async () => {
  width: calc(100% - 48px);
  margin-left: 24px;
}
.service-content {
  width: 100%;
  height: 100%;
  .empty {
    width: 100%;
    height: 100%;
    display: flex;
    flex: 0 0 1;
    justify-content: center;
    align-items: center;
  }
  .versionInfo {
    .version-name {
      display: inline-block;
      text-align: end;
      margin-right: 10px;
    }
    .el-input {
      width: 200px;
    }
  }
}
</style>

src/views/flow/SystemList.vue

@@ -1,36 +1,56 @@
<template>
  <common-card-group
    :card-numbers="cardNumbers"
    :card-infos="cardInfos"
    :span="8"
    layer="row-col"
    :btns="btns"
    :cards="cardList"
    @handel-click-create-card="handelClickCreateCard"
  ></common-card-group>
  <div class="system-list">
    <common-card-group
      :card-numbers="cardNumbers"
      :card-infos="cardInfos"
      :span="6"
      layer="row-col"
      :btns="btns"
      :cards="cardList"
      @handel-click-create-card="handelClickCreateCard"
      @handel-card-click="viewDetail"
    ></common-card-group>
  </div>
  <!-- 弹窗 -->
  <common-drawer
    v-if="showDialog"
    :title="dialogTitle"
    :title="titleMap[drawerType]"
    @close-dialog="closeDialog"
    @confirm-dialog="confirmDialog"
  >
    <!-- 复制系统 -->
    <common-form
      v-if="drawerType === 'clone'"
      :forms="formConfig.system.copyForms"
      :form-values="formConfig.system.copyValues"
    ></common-form>
    <!-- 新建/编辑系统 -->
    <common-form
      v-else-if="drawerType === 'create' || drawerType === 'edit'"
      :forms="formConfig.system.forms"
      :form-values="formConfig.system.formValues"
    ></common-form>
    <!-- 版本切换 -->
    <common-form
      v-else
      :forms="formConfig.system.versionForms"
      :form-values="formConfig.system.versionValues"
    ></common-form>
  </common-drawer>
</template>
<script setup>
import { ref, onMounted, getCurrentInstance } from 'vue';
import { useRouter } from 'vue-router';
import moment from 'moment';
import * as api from '../../api/flow';
import { formConfig } from './_config';
const router = useRouter();
const { proxy } = getCurrentInstance();
const dialogTitle = ref('新增系统');
const drawerType = ref('create');
const showDialog = ref(false);
const curSystemId = ref('');
// 数据展示
@@ -39,32 +59,79 @@ const cardNumbers = ref([
  { label: '模型数量', name: 'moduleNumber' },
  { label: '接口数量', name: 'logicServiceNumber' }
]);
const titleMap = ref({
  edit: '编辑系统',
  create: '新增系统',
  clone: '复制系统',
  switch: '版本切换'
});
const cardInfos = ref([]);
const versionList = ref([]);
// 复制系统
// function copySystemById() {}
// 编辑
function updateSystem(data) {
  drawerType.value = 'edit';
  formConfig.value.system.formValues = {
    name: data.name,
    code: data.code,
    desc: data.desc
  };
  curSystemId.value = data.id;
  showDialog.value = true;
  // eslint-disable-next-line no-use-before-define
  openDialog('edit');
}
// 删除
function deleteSystem() {
function deleteSystem(data) {
  proxy
    .$confirm('确定删除该系统吗？', '警告', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    })
    .then(() => {});
    .then(() => {
      api.deleteSystemById(data.id).then((res) => {
        if (res.resultCode === '0') {
          // eslint-disable-next-line no-use-before-define
          getSystemList();
        } else {
          proxy.$message.error(res.resultMsg);
        }
      });
    });
}
// 获取已上线版本列表
function getOnlineVersionList(id) {
  const params = {
    systemId: id
  };
  api.getOnlineVersionList(params).then((res) => {
    if (res.resultCode === '0') {
      versionList.value = res.result || [];
      formConfig.value.system.versionForms[0].attrs.options = versionList.value;
    } else {
      versionList.value = [];
      proxy.$message.error(res.resultMsg);
    }
  });
}
function openDialog(type) {
  drawerType.value = type;
  showDialog.value = true;
}
// 版本切换
function changeVersion() {}
async function changeVersion(data) {
  // drawerType.value = 'switch';
  formConfig.value.system.versionValues = {
    stateValue: data.version.id
  };
  curSystemId.value = data.id;
  await getOnlineVersionList(data.id);
  await openDialog('switch');
}
// 查看详情
function viewDetail(item) {
@@ -76,10 +143,18 @@ function viewDetail(item) {
  });
}
// 复制
function copySystem() {}
function copySystem(data) {
  // drawerType.value = 'clone';
  formConfig.value.system.copyValues = {
    name: data.name,
    code: data.code
  };
  curSystemId.value = data.id;
  openDialog('clone');
}
const btns = ref([
  { label: '查看', name: 'view', onClick: viewDetail, icon: 'common-chakan' },
  { label: '编辑', name: 'edit', onClick: updateSystem, icon: 'common-bianji' },
  { label: '复制', name: 'copy', onClick: copySystem, icon: 'common-fuzhi' },
  {
    label: '删除',
    name: 'delete',
@@ -91,11 +166,10 @@ const btns = ref([
    name: 'change',
    onClick: changeVersion,
    icon: 'common-fenxiang'
  },
  { label: '复制', name: 'copy', onClick: copySystem, icon: 'common-fuzhi' }
  }
]);
function handelClickCreateCard() {
  showDialog.value = true;
  openDialog('create');
}
const cardList = ref([]);
@@ -108,15 +182,13 @@ function getSystemList() {
      cardList.value = res.result;
      cardList.value.map((item) => {
        item.title = item.name;
        item.subTitle = moment(item.doneDate).format('YYYY-MM-DD hh:mm:ss');
        item.url = '';
        item.tags = [
          { label: `v${item?.version?.version}` || 'dev', type: 'success' }
        ];
        item.numbers = {
          executeServiceUrl: item.executeServiceUrl,
          moduleNumber: item?.version?.moduleNumber || 0,
          logicServiceNumber: item?.version?.logicServiceNumber || 0
        };
        item.moduleNumber = item?.version?.moduleNumber || 0;
        item.logicServiceNumber = item?.version?.logicServiceNumber;
        return item;
      });
    } else {
@@ -125,6 +197,54 @@ function getSystemList() {
  });
}
// 新增系统
function createSystem(params) {
  api.createSystem(params).then((res) => {
    if (res.resultCode === '0') {
      getSystemList();
    } else {
      proxy.$message.error(res.resultMsg);
    }
  });
}
// 修改系统
function updateSystemById(params) {
  api.updateSystem(params, curSystemId.value).then((res) => {
    if (res.resultCode === '0') {
      getSystemList();
    } else {
      proxy.$message.error(res.resultMsg);
    }
  });
}
// 克隆系统
function cloneSystemById(params) {
  api.copySystemById(params, curSystemId.value).then((res) => {
    if (res.resultCode === '0') {
      getSystemList();
    } else {
      proxy.$message.error(res.resultMsg);
    }
  });
}
// 切换版本
function changeVersionById() {
  const params = {
    startedVersionId: formConfig.value.system.versionValues.stateValue
  };
  api.changeVersionById(params, curSystemId.value).then((res) => {
    if (res.resultCode === '0') {
      proxy.$message.success('版本已切换！');
      getSystemList();
    } else {
      proxy.$message.error(res.resultMsg);
    }
  });
}
// 切换版本
// 弹窗
// 关闭弹窗
function closeDialog() {
@@ -133,6 +253,24 @@ function closeDialog() {
// 弹窗确认
function confirmDialog() {
  const params = { ...formConfig.value.system.formValues };
  const cloneParams = { ...formConfig.value.system.copyValues };
  switch (drawerType.value) {
    case 'edit':
      updateSystemById(params);
      break;
    case 'create':
      createSystem(params);
      break;
    case 'clone':
      cloneSystemById(cloneParams);
      break;
    case 'switch':
      changeVersionById();
      break;
    default:
      break;
  }
  closeDialog();
}
onMounted(() => {
@@ -140,4 +278,8 @@ onMounted(() => {
});
</script>
<style scoped lang="scss"></style>
<style scoped lang="scss">
.system-list {
  padding-bottom: 50px;
}
</style>

src/views/flow/_config.js

@@ -40,6 +40,49 @@ export const formConfig = ref({
      name: '',
      desc: '',
      code: ''
    },
    copyForms: [
      {
        label: '名称',
        name: 'name',
        type: 'input',
        span: 24,
        attrs: { placeholder: '请输入名称', clearable: true }
      },
      {
        label: '根路径',
        name: 'code',
        type: 'input',
        span: 24,
        attrs: { placeholder: '请输入名称', clearable: true }
      }
    ],
    copyValues: {
      name: '',
      code: ''
    },
    versionForms: [
      {
        name: 'stateValue',
        type: 'select',
        label: '版本切换',
        span: 24,
        attrs: {
          style: {
            width: '276px'
          },
          options: [],
          propsMap: {
            label: 'version',
            value: 'id'
          },
          clearable: true,
          placeholder: '请选择版本！'
        }
      }
    ],
    versionValues: {
      stateValue: ''
    }
  },
  module: {

src/views/flow/enum.js

@@ -0,0 +1,35 @@
// 版本状态
export const VERSION_STATE = {
  EDITED: {
    value: '1',
    text: '未发布'
  },
  PUBLISHED: {
    value: '2',
    text: '已发布'
  },
  DELETED: {
    value: '3',
    text: '废弃'
  }
};
// 接口状态
export const LOGIC_STATE = {
  UNPUBLISHED: {
    value: '1',
    text: '未发布'
  },
  PUBLISHED: {
    value: '2',
    text: '已发布'
  },
  TESTED: {
    value: '3',
    text: '已测试'
  },
  DELETED: {
    value: '4',
    text: '废弃'
  }
};