update: 完成版本切换按钮状态控制

src/api/flow.ts

@@ -81,6 +81,13 @@ export function changeVersionById(data: any, id: any) {
  });
}
// 点击编辑切换或者生成dev版本
export function changeVersionToEdit(id: any) {
  return AIotRequest.post({
    url: `${flow.systemEditMgmt}/${id}`
  });
}
/**
 * 版本 start
 */

src/views/flow/SystemDetail.vue

@@ -8,12 +8,14 @@
        :style="{ width: '260px' }"
        :props-map="{ label: 'version', value: 'id' }"
        :options="versionList"
        @change="changeVersion"
      ></common-select>
      <div class="btns">
        <template v-for="btn in btns" :key="btn.name">
          <el-button
            size="small"
            class="btn"
            :disabled="btn.disabled"
            :type="btn.type"
            @click.stop="btn.onClick"
          >
@@ -39,10 +41,11 @@
      </template>
      <template #right>
        <div class="service-content">
          <!-- 详情 -->
          <api-detail-page
            v-if="apiDetail"
            :api-detail="apiDetail"
            :version-state="versionState.CURRENT_STATE"
            :version-state="versionState"
            @edit-logic-api="editLogicApi"
            @init-api-info="initApiInfo"
          ></api-detail-page>
@@ -83,6 +86,7 @@ import { useRoute, useRouter } from 'vue-router';
import { formConfig } from './_config';
import ApiDetailPage from './_components/ApiDetailPage.vue';
import * as api from '../../api/flow';
import { VERSION_STATE, LOGIC_STATE } from './enum.js';
const { proxy } = getCurrentInstance();
const router = useRouter();
@@ -91,30 +95,55 @@ const showDrawer = ref(false);
const drawerType = ref('module');
const operateType = ref('create');
const apiDetail = ref(null);
const versionState = ref('');
const systemId = computed(() => route.query.id);
const curVersionId = ref('');
console.log(VERSION_STATE, LOGIC_STATE);
// 编辑版本
function editVersion() {}
function editVersion() {
  api.changeVersionToEdit(curVersionId.value).then((res) => {
    if (res.resultCode === '0') {
      versionState.value = 'EDITED';
      curVersionId.value = res.result;
      proxy.$message.info('开始编辑');
      // eslint-disable-next-line no-use-before-define
      getModuleData();
    } else {
      proxy.$message.error(res.resultMsg);
    }
  });
}
// 发布版本
function publishVersion() {}
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 btns = computed(() => {
  return [
    {
      label: '编辑',
      name: 'edit',
      disabled: versionState.value === 'EDITED',
      onClick: editVersion,
      type: 'primary'
    },
    {
      label: '发布',
      name: 'publish',
      disabled: versionState.value === 'PUBLISHED',
      onClick: publishVersion,
      type: 'primary'
    }
  ];
});
// 获取系统详情
const systemId = computed(() => route.query.id);
const curVersionId = ref('');
const systemInfo = ref(null);
async function getSystemDetail() {
  await api.getSystemDetailById(systemId.value).then((res) => {
    if (res.resultCode === '0') {
      systemInfo.value = res.result;
      curVersionId.value = systemInfo.value.version.id;
      versionState.value = systemInfo.value.version.state;
    } else {
      systemInfo.value = null;
    }
@@ -142,6 +171,19 @@ function getVersionList() {
      console.log(err);
    });
}
// 切换版本
function changeVersion(val) {
  console.log(val);
  curVersionId.value = val;
  versionList.value.forEach((item) => {
    if (item.id === val) {
      versionState.value = item.state;
    }
  });
  // eslint-disable-next-line no-use-before-define
  getModuleData();
}
/**
 * 版本 end
 */
@@ -222,6 +264,7 @@ function getModuleData() {
    pageNumber: 1,
    versionId: curVersionId.value
  };
  curLogic.value = '';
  api.getModuleList(params).then((res) => {
    if (res.resultCode === '0') {
      moduleTreeData.value = res.result;
@@ -549,7 +592,7 @@ function editLogicApi() {
// 测试
function initApiInfo() {}
watch(curLogic.value, () => {
watch(curLogic, () => {
  getApiDetail();
});
// watch 监听

src/views/flow/_components/ApiDetailPage.vue

@@ -14,20 +14,28 @@
            DELETED("5", "废弃");
          -->
          <el-button
            :disabled="props.versionState === '0'"
            :disabled="props.versionState === 'PUBLISHED'"
            @click.stop="stopTest"
          >
            测试
          </el-button>
          <el-button
            :disabled="
              apiDetail?.state !== 'STARTED' || props.versionState === '0'
              apiDetail?.state !== 'STARTED' ||
              props.versionState === 'PUBLISHED'
            "
            @click.stop="stopLogic"
          >
            停用
          </el-button>
          <el-button type="success" @click.stop="editLogicApi">
          <el-button
            type="success"
            :disabled="
              apiDetail?.state === 'STARTED' ||
              props.versionState === 'PUBLISHED'
            "
            @click.stop="editLogicApi"
          >
            编辑逻辑流
          </el-button>
        </div>
@@ -323,6 +331,8 @@ function testHooks() {
const { testRequest, test, updateTestData } = testHooks();
function validate() {}
function handleClick() {}
watch(
  props,
  () => {