更新流程实现

xiangpei

2025-03-17 5a98e5f9ce50bb5de56a54cae14e5ea49fbe2c07

更新流程实现

 src/api/flowable/definition.js

@@ -95,7 +95,7 @@
  })
}

// 读取xml文件
// 保存xml文件
export function saveXml(data) {
  return request({
    url: '/flowable/definition/save',
@@ -104,6 +104,15 @@
  })
}

// 更新xml文件
export function updateXml(data) {
  return request({
    url: '/flowable/definition/update',
    method: 'post',
    data: data
  })
}

// 新增流程定义
export function addDeployment(data) {
  return request({

 src/components/Process/index.vue

@@ -39,6 +39,7 @@
            <el-button size="mini" icon="el-icon-download" @click="saveXML(true)">下载xml</el-button>
            <el-button size="mini" icon="el-icon-picture" @click="saveImg('svg', true)">下载svg</el-button>
            <el-button size="mini" type="primary" @click="save">保存模型</el-button>
            <el-button size="mini" type="warning" @click="update">更新模型</el-button>
            <el-button size="mini" type="danger" @click="goBack">关闭</el-button>
          </el-button-group>
        </div>
@@ -68,6 +69,7 @@
// 引入flowable的节点文件
import FlowableModule from './flowable/flowable.json'
import customControlsModule from './customPanel'
import {taskWait} from "@/api/projectProcess/projectProcess";
export default {
  name: "BpmnModel",
  components: {Designer},
@@ -256,6 +258,39 @@
      this.goBack();
    },

    update() {
      this.$prompt('更新流程不会产生新版本，重要的是你不能修改流程推进中已经执行过的任务节点，否则会引起数据问题！！，<span style="color: red">请在下方输入：我已知晓</span>', '更新流程', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        customClass: 'updateC',
        dangerouslyUseHTMLString: true,
        inputType: 'textarea',
        inputValidator: (value) => {
          if (!value || value.trim() === '') {
            return "请输入：我已知晓"
          }
          if (value !== "我已知晓") {
            return "输入错误，请输入：我已知晓"
          }
          return true
        },
        inputErrorMessage: '请输入：我已知晓'
      }).then(async ({value}) => {
        const process = this.getProcess()
        const xml = await this.saveXML()
        const svg = await this.saveImg()
        const result = {process, xml, svg}
        this.$emit('update', result)
        window.parent.postMessage(result, '*')
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        });
      });
    },

    // 打开流程文件
    openBpmn(file) {
      const reader = new FileReader()
@@ -348,5 +383,10 @@
    width: 100%;
    margin: 0 0 5px;
  }

}

.updateC {
  width: 500px;
}
</style>

 src/views/flowable/definition/model.vue

@@ -5,6 +5,7 @@
      :xml="xml"
      :is-view="false"
      @save="save"
      @update="update"
      @showXML="showXML"
    />
    <!--在线查看xml-->
@@ -17,7 +18,7 @@
  </div>
</template>
<script>
import {readXml, roleList, saveXml, userList,expList} from "@/api/flowable/definition";
import {readXml, roleList, saveXml, userList, expList, updateXml} from "@/api/flowable/definition";
import BpmnModel from '@/components/Process'
import vkBeautify from 'vkbeautify'
import hljs from 'highlight.js'
@@ -101,6 +102,21 @@
        this.$tab.closeOpenPage(obj);
      })
    },
    /** 更新xml */
    update(data) {
      const params = {
        deploymentId: this.$route.query && this.$route.query.deployId,
        name: data.process.name,
        category: data.process.category,
        xml: data.xml
      }
      updateXml(params).then(res => {
        this.$modal.msgSuccess(res.msg)
        // 关闭当前标签页并返回上个页面
        const obj = { path: "/flowable/definition", query: { t: Date.now()} };
        this.$tab.closeOpenPage(obj);
      })
    },
    /** 指定流程办理人员列表 */
    getDataList() {
      userList().then(res => {