1

lzhe

2025-08-10 8b685e0b3bb920dc5fb5a4c29e71ce27b1d36248

1

 src/views/wel/components/TodolistLeft.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,236 @@
<!--
 * @Date: 2025-07-01 20:45:15
 * @LastEditors: gaoshp
 * @LastEditTime: 2025-08-06 20:40:36
 * @FilePath: /mdmweb/src/views/flow/components/TodolistLeft.vue
-->
<template>
    <basic-container>
        <div class="tool">
            <avue-form :option="attOption"
             v-model="attForm"
             :upload-after="uploadAfter" class="att-box"></avue-form>
        </div>
        <el-table :data="tableData" border @row-click="showContent" max-height="200">
            <!-- <el-table-column prop="machineCode" label="加工机床">
            </el-table-column> -->
            <el-table-column prop="name" label="程序名称">
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="60" align="center">
            <template #default="scope" >
                <el-button type="text" size="small" @click.stop="del(scope.$index,scope.row)">删除</el-button>
            </template>
            </el-table-column>
        </el-table>
        <h4>程序内容</h4>
        <div v-html="appContent" class="app-content">
        </div>
        <el-dialog title="程序选择" v-model="appDialog" width="50%" v-if="appDialog">
            <avue-crud :option="optionApp" v-model="form" v-model:page="page" ref="crud" :data="appData"
                @current-change="currentChange" @size-change="sizeChange"
                @on-load="onLoad" @selection-change="selectionChange">
                <template #search="{ }"></template>
                <template #search-menu="{ }"></template>
            </avue-crud>
            <div slot="footer" class="dialog-footer">
                <el-button @click="appDialog = false">取 æ¶ˆ</el-button>
                <el-button type="primary" @click="add">ç¡® å®š</el-button>
            </div>
        </el-dialog>
    </basic-container>
</template>

<script>
import { getAppList,getSelectedAppList,getContent,removeAtt} from '@/api/flow/todolist';
export default {
    props: {
        row: {
            type: Object,
        }
    },
    data() {
        return {
            showContentId: '',
            attForm: {
                att: '',
            }, //程序上传表单
            attOption: {
                submitBtn: false,
                emptyBtn: false,
                menu: false,
                column: [
                    {
                        label: '添加程序',
                        prop: 'att',
                        type: 'upload',
                        multiple: true,
                        action: '/api/blade-mdm/flow/mgr/ncupload',
                        span: 24,
                        data: {
                            processInstanceId: this.row.processInstanceId
                        },
                    }
                ]
            }, //程序上传
            tableData: [],//已选程序
            appContent: '',//程序内容
            appDialog: false,
            form: {},
            page: {
                page: 1,
                size: 10,
                total: 0,
            },
            appData: [],
            selectionList: [],
            optionApp: {
                menu: false,
                gridBtn: false,
                addBtn: false,
                editBtn: false,
                delBtn: false,
                columnBtn: false,
                refreshBtn: false,
                searchShowBtn: false,
                tip: false,
                searchShow: false,
                dialogWidth: '60%',
                border: true,
                index: true,
                selection: true,
                menuWidth: 100,
                dialogClickModal: false,
                column: [
                    {
                        label: '加工机床',
                        prop: 'machineCode',
                    },
                    {
                        label: '程序名称',
                        prop: 'name',
                    },
                    // {
                    //     label: '工序名称',
                    //     prop: 'processName',
                    // },
                ],
            },
        }
    },
    mounted() {
        this.getAttList();
        this.onLoad(this.page);
    },
    methods: {
        uploadAfter(res, done, loading, column) {
            if (res.code === 200) {
                this.getAttList();
                this.$message.success('上传成功');
                this.attForm.att = '';
                return done();
            } else {
                console.log(res)
                this.$message.warning(res.msg || '上传失败');
                done()
            }
        },
        getAttList () {
            getSelectedAppList(this.row.processInstanceId).then(res => {
                if (res.data.code !== 200) {
                    this.$message.error('获取已选程序失败');
                    return;
                } else {
                    this.tableData = res.data.data || [];
                }
                // this.$emit('selection-change',this.tableData)
            })
        },
        addApp() {
            this.appDialog = true;
        },
        currentChange(currentPage) {
            this.page.currentPage = currentPage;
        },
        sizeChange(pageSize) {
            this.page.pageSize = pageSize;
        },
        selectionChange(list) {
            this.selectionList = list;
        },
        onLoad(page, params = {}) {
            const query = {}
            getAppList(page.currentPage, page.pageSize, Object.assign(query, params)).then(res => {
                const data = res.data.data;
                this.page.total = data.total;
                this.appData = data.records;
            });
        },
        add () {
            console.log('add')
            this.tableData = this.tableData.concat(this.selectionList.filter(item => {
                return !this.tableData.some(existingItem => existingItem.id === item.id);
            }));
            this.appDialog = false;
            this.$emit('selection-change',this.tableData)
        },
        showContent (row, column, event) {
            if(!row?.id) {
                this.showContentId = ''
                return this.appContent = '';
            }
            this.showContentId = row.id
            getContent(row.id).then(res => {
                if(res.data.code === 200) {
                    this.appContent = res.data.data
                } else {
                    this.appContent = '程序内容加载失败'
                }
            })
        },
        del (index,row) {
            if(row.id === this.showContentId) {
                this.showContentId = '';
                this.showContent(null, null, null);
            }
            removeAtt(row.id).then(res => {
                if(res.data.code === 200) {
                    this.$message.success('删除成功');
                    this.getAttList();
                } else {
                    this.$message.error('删除失败');
                }
            })
        }
    },
}
</script>

<style lang="scss" scoped>
.tool {
    text-align: right;
    margin-bottom: 10px;
}

.dialog-footer {
    text-align: center;
}
.app-content {
    background-color: #fffee1;
    padding: 10px 30px;
    min-height: 100px;
    overflow: auto;
    max-height: 400px;
    white-space: pre-wrap;
}

</style>
<style lang="scss">
    .att-box {
        .el-form-item--default {
            margin-bottom: 0;
        }
        .avue-form__menu--center {
            display: none;
        }
    }
</style>

 src/views/wel/components/TodolistRightTop.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,99 @@
<!--
 * @Date: 2025-07-01 20:45:15
 * @LastEditors: gaoshp
 * @LastEditTime: 2025-08-02 21:54:27
 * @FilePath: /mdmweb/src/views/flow/components/TodolistRightTop.vue
-->
<template>
    <basic-container>
    <el-form :inline="true" :model="formInline" class="demo-form-inline" label-width="120px" disabled>
        <el-form-item label="任务名称">
            <el-input v-model="formInline.processDefinitionName" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="创建人">
            <el-input v-model="formInline.startUserName" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="图号版次">
            <el-input v-model="formInline.drawingNoEdition" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="工艺版次">
            <el-input v-model="formInline.craftEdition" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="任务车间">
            <el-input v-model="formInline.workShop" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="产品型号">
            <el-input v-model="formInline.productModel" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="工序号">
            <el-input v-model="formInline.processNo" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="工序名称">
            <el-input v-model="formInline.processName" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="工序版次">
            <el-input v-model="formInline.processEdition" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="零组件号">
            <el-input v-model="formInline.drawingNo" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="加工机床">
            <el-input v-model="formInline.machineCode" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="过程卡号">
            <el-input v-model="formInline.empty" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="创建时间">
            <el-input v-model="formInline.createTime" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="计划加工时间">
            <el-input v-model="formInline.planStartTime" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="程序包名">
            <el-input v-model="formInline.programPackageName" placeholder=""></el-input>
        </el-form-item>
        <el-form-item label="当前节点">
            <el-input v-model="formInline.taskName" placeholder=""></el-input>
        </el-form-item>
    </el-form>
    </basic-container>
</template>

<script>
export default {
    props: {
        row: {
            type: Object,
        }
    },
    data() {
        return {
            formInline: {}
        }
    },
    mounted() {
        // Initialize formInline with row data
   //      this.formInline = {
   //          ...this.row,
   //          processDefinitionName: this.row.processDefinitionName || '',
   //          taskName: this.row.taskName || '',
   //          createTime: this.row.createTime || '',
   //          startUserName: this.row.startUserName || '',
   //          drawingNoEdition: this.row.variables.drawingNoEdition || '',
   //          craftEdition: this.row.variables.craftEdition || '',
   //          machineCode: this.row.variables.machineCode || '',
   //          processName: this.row.variables.processName || '',
   //          processNo: this.row.variables.processNo || '',
            // processEdition: this.row.variables.processEdition || '',
			
   //          planStartTime: this.row.variables.planStartTime || '',
   //          productModel: this.row.variables.productModel || '',
            // programPackageName: this.row.variables.programPackageName || '',
            // workShop: this.row.variables.workShop || '',
   //          drawingNo: this.row.variables.drawingNo || '',
   //      }
    }
}
</script>

<style lang="scss" scoped></style>

 src/views/wel/index.vue

@@ -36,14 +36,17 @@
      </template> -->
      <template #name="{ row }">
        <span>{{row.name}}</span>
        <el-button :size="size" text v-if="row.nodeType != 70" icon="el-icon-setting" type="primary" placeholder="修改" @click="showEdit(row)" title="修改"></el-button>
        <!-- <el-button :size="size" text v-if="row.nodeType != 70" icon="el-icon-setting" type="primary" placeholder="修改" @click="showEdit(row)" title="修改"></el-button>
        <el-button :size="size" text v-if="row.nodeType != 10" icon="el-icon-delete" type="primary" @click="showDel(row)" placeholder="删除" title="删除"></el-button>
        <el-button :size="size" text v-if="row.nodeType != 60 && row.nodeType != 70" icon="el-icon-document-add" type="primary" @click="showAdd(row)" placeholder="新增子级" title="新增子级"></el-button>
        <el-button :size="size" text v-if="row.nodeType == 60 || row.nodeType == 50" icon="el-icon-upload" type="primary" @click="showUpload(row)" placeholder="文件上传" title="文件上传"></el-button>
        <el-button :size="size" text v-if="row.nodeType == 60 || row.nodeType == 50" icon="el-icon-upload" type="primary" @click="showUpload(row)" placeholder="文件上传" title="文件上传"></el-button> -->
        <!-- æ¶‰å¯†ç½‘才有 -->
        <el-button :size="size" text v-if="row.nodeType == 70 && isSM" icon="el-icon-pie-chart" type="primary" @click="upgrade(row)" placeholder="升版" title="升版"></el-button>
        <!-- <el-button :size="size" text v-if="row.nodeType == 70 && isSM" icon="el-icon-pie-chart" type="primary" @click="upgrade(row)" placeholder="升版" title="升版"></el-button> -->
        <!-- å·¥æŽ§ç½‘才有 -->
        <el-button :size="size" text v-if="row.nodeType == 70 && !isSM" icon="el-icon-position" type="primary" @click="downsend(row)" placeholder="下发" title="下发"></el-button>
        <!-- <el-button :size="size" text v-if="row.nodeType == 70 && !isSM" icon="el-icon-position" type="primary" @click="downsend(row)" placeholder="下发" title="下发"></el-button> -->
        <!-- æ›¿æ¢ -->
        <el-button :size="size" text v-if="row.nodeType == 60 && isSM" icon="el-icon-switch" type="primary" @click="replacement(row)" placeholder="替换" title="替换"></el-button>
        <!-- <el-icon><Switch /></el-icon> -->
      </template>
    </avue-crud>
    <!-- æ–°å¢žèŠ‚点 -->
@@ -84,13 +87,96 @@
          <code-diff :old-string="this.content1" :new-string="this.content2" output-format="side-by-side" :hideStat="true" :filename="codeDiffFileName1" :newFilename="codeDiffFileName2"/>
      </div>
  </el-drawer>
  <!-- æ›¿æ¢ -->
  <el-drawer title="替换" append-to-body v-model="todolistModel" size="100%" class="code-box">
    <div class="approve-box">
        <div class="left">
            <TodolistLeft :row="row" @selection-change="todoSelectionChange" />
        </div>
        <div class="right">
            <TodolistRightTop :row="row" />
            <avue-form ref="form" :option="optionApprove" v-model="formApprove" @submit="handleSubmit" />
        </div>
    </div>
  </el-drawer>
</template>

<script>
import { ElMessage } from 'element-plus';
import TodolistLeft from './components/TodolistLeft.vue';
import TodolistRightTop from './components/TodolistRightTop.vue';
export default {
  components: {
    TodolistLeft,
    TodolistRightTop
  },
  data() {
    let rejectText = '驳回';//+this.row.categoryName;
    return {
      replaceDataId: "",
      formApprove: {
        title: '',
        comment: '',
        approve: '', // é»˜è®¤åŒæ„
        assignee: ''
      },
      optionApprove: {
        labelWidth: 100,
        column: [
          {
            label: '流程标题',
            prop: 'title',
            rules: [{ required: true, message: '请输入流程标题', trigger: 'blur' }],
          },
          {
            label: '发送给',
            prop: 'assignee',
            type: 'select',
            dicUrl: `/api/blade-mdm/flow/flow-user-list?deptId=0`,
            dicFlag: true,
            props: {
              label: 'name',
              value: 'id',
            },
            filterable: true,
            span: 24,
            disabled: false,
            rules: [{ required: true, message: '请选择', trigger: 'change' }],
          },
          {
              label: '工序版次',
              prop: 'processEdition',
              type: 'input',
              span: 24,
              // disabled: true,
              display: false,// éšè—æ˜¾ç¤º
              // rules: [{ required: true, message: '请选择下一审批用户', trigger: 'blur' }],
          },
          {
              label: '备注',
              span: 24,
              prop: 'comment',
              type: 'textarea',
              // rules: [{ required: true, message: '请输入审批意见', trigger: 'blur' }],
              rules: [
                  {
                  validator: (rule, value, callback) => {
                      console.log('-------',this.formApprove)
                      if (value === '' && this.formApprove.approve !== 'Y') {
                          callback(new Error('请输入备注'));
                      } else {
                          callback();
                      }
                  },
                  trigger: 'blur'
                  }
              ]
          },
        ],
      },
      applist: [],
      row: {},
      todolistModel: false,
      diffBox: false,
      content1: "",
      content2: "",
@@ -299,6 +385,12 @@
        menu: false,
        searchBtn: false,
        emptyBtn: false,
        refreshBtn: false,
        columnBtn: false,
        searchShowBtn: false,
        refreshBtn: false,
        copyBtn: false,
        gridBtn: false,
        column: [
          {
            label: '目录',
@@ -528,11 +620,77 @@
    }
  },
  watch: {
    uploadmodalBox(old) {
      //this.onLoad();
    }
    
  },
  methods: {
    handleSubmit(form, done) {
      //发起程序替换流程
      var obj = {
        title: this.formApprove.title,
        nodeId: this.id,
        tempInstanceId: this.replaceDataId,
        assignee: this.formApprove.assignee
      }
      axios({
        url: '/blade-mdm/flow/replace/start',
        method: 'post',
        data: obj
      }).then(
      resp => {
        this.$message({
          type: 'success',
          message: '操作成功!',
        });
        done();
        this.todolistModel = false;
      });
      // if(this.row.taskDefinitionKey === 'programmingTask') {
      //     // if(this.applist.length !== 1) {
      //     //     done();
      //     //     return this.$message.success('请选择1个程序');
      //     // }
      // }
      // approve({
      //     ...this.formApprove,
      //     taskId: this.row.taskId,
      //     processInstanceId: this.row.processInstanceId,
      //     // programIds: this.row.taskDefinitionKey === 'programmingTask' ? this.applist.map(v => v.id).join(',') : '',
      // }).then(res => {
      //     if(res.data.code !== 200) {
      //         this.$message.error(res.data.msg);
      //         done();
      //         return;
      //     }
      //     this.$message.success('审批成功');
      //     this.approveBox = false;
      //     this.onLoad(this.page, this.query);
      //     done();
      // }).catch(err => {
      //     done();
      //     console.error(err);
      // });
    },
    todoSelectionChange(applist) {
      this.applist = applist;
    },
    replacement(row) {  //替换
      this.id = row.id;
      this.formApprove = {
          comment: '',
          approve: 'Y', // é»˜è®¤åŒ
      }
      //准备程序替换流程 
      axios({
        url: '/blade-mdm/flow/replace/prestart',
        method: 'post',
        params: {nodeId: row.id}
      }).then(
      resp => {
        this.row = row;
        this.replaceDataId = resp.data.data;
        this.todolistModel = true;
      });
    },
    convertToHtml(text) {
        return text.replace(/\r\n/g, '<br>');
    },
@@ -985,6 +1143,21 @@
.highlight-row:hover {
  background-color: #e6f0ff !important;
}
.approve-box {
  display: flex;

  &>div {
      border: 1px solid #ccc;
  }

  .left {
      width: 400px;
  }

  .right {
      flex: 1;
  }
}
</style>
<style>
  .highlight-row {

 src/views/wel/todolist.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,500 @@
<template>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" v-model:page="page" v-model="form" ref="crud"
            @search-change="searchChange" @search-reset="searchReset" @current-change="currentChange"
            @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad"
            @selection-change="selectionTransferTask">
            <template #menu-left>
                <el-button type="primary" plain @click="reassign">重新指派
                </el-button>
            </template>
            <template #menu="scope">
                <el-button type="primary" text size="default" @click.stop="handleAction(scope.row, scope.index)">审批
                </el-button>
            </template>
        </avue-crud>
        <el-dialog title="指派" append-to-body v-model="reassignBox" width="30%">
            <avue-form ref="reassginform" :option="reassignOption" v-model="reassignForm" @submit="toPerson"></avue-form>
        </el-dialog>
        <el-drawer title="审批" append-to-body v-model="approveBox" size="100%" v-if="approveBox">
            <div class="approve-box">
                <div class="left">
                    <TodolistLeft :row="row" @selection-change="selectionChange" />
                </div>
                <div class="right">
                    <TodolistRightTop :row="row" />
                    <avue-form ref="form" :option="optionApprove" v-model="formApprove" @submit="handleSubmit" />
                </div>
            </div>
        </el-drawer>
    </basic-container>
</template>

<script>
import { getList, approve, getAssignee,reassgin } from '@/api/flow/todolist';
import { mapGetters } from 'vuex';
import dayjs from 'dayjs';
import TodolistLeft from './components/TodolistLeft.vue';
import TodolistRightTop from './components/TodolistRightTop.vue';
export default {
    components: {
        TodolistLeft,
        TodolistRightTop
    },
    data() {
        let rejectText = '驳回';//+this.row.categoryName;
        console.log(this,'ttt');
        return {
            
            applist: [],
            assigneeData: [],
            row: {},
            approveBox: false,
            formApprove: {
                comment: '',
                approve: '', // é»˜è®¤åŒæ„
                assignee: ''
            },
            optionApprove: {
                labelWidth: 100,
                column: [

                    {
                        label: '审批结果',
                        prop: 'approve',
                        type: 'radio',
                        span: 24,
                        dicData: [
                            { label: '通过', value: 'Y' },
                            { label: rejectText, value: 'N' },
                        ],
                        rules: [{ required: true, message: '请选择审批结果', trigger: 'blur' }],
                    },
                    {
                        label: '发送给',
                        prop: 'assignee',
                        type: 'select',
                        // dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        // dicFlag: true,
                        props: {
                            label: 'name',
                            value: 'id',
                        },
                        filterable: true,
                        span: 24,
                        disabled: false,
                        dicData: [

                        ],
                        // rules: [{ required: true, message: '请选择下一审批用户', trigger: 'blur' }],
                    },
                    {
                        label: '工序版次',
                        prop: 'processEdition',
                        type: 'input',
                        span: 24,
                        // disabled: true,
                        display: false,// éšè—æ˜¾ç¤º
                        // rules: [{ required: true, message: '请选择下一审批用户', trigger: 'blur' }],
                    },
                    {
                        label: '备注',
                        span: 24,
                        prop: 'comment',
                        type: 'textarea',
                        // rules: [{ required: true, message: '请输入审批意见', trigger: 'blur' }],
                        rules: [
                            {
                            validator: (rule, value, callback) => {
                                console.log('-------',this.formApprove)
                                if (value === '' && this.formApprove.approve !== 'Y') {
                                    callback(new Error('请输入备注'));
                                } else {
                                    callback();
                                }
                            },
                            trigger: 'blur'
                            }
                        ]
                    },
                ],
            },
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            form: {},
            query: {},
            loading: true,
            option: {
                rowKey: "taskId",
                addBtn: false,
                editBtn: false,
                delBtn: false,
                columnBtn: false,
                tip: false,
                // simplePage: true,
                searchShow: true,
                searchMenuSpan: 6,
                dialogWidth: '60%',
                // tree: true,
                border: true,
                index: true,
                selection: true,
                // viewBtn: true,
                menuWidth: 100,
                dialogClickModal: false,
                column: [
                    {
                        label: '关键字',
                        prop: 'keyword',
                        width: 300,
                        search: true,
                        searchType: 'input',
                        hide: true,
                        dicData: [
                            {
                                label: '涉密网程序',
                                value: 1,
                            },
                            {
                                label: '工控网车床程序',
                                value: 2,
                            },
                        ],
                    },
                    {
                        label: '标题',
                        prop: '',
                        width: 100,
                        render: ({ row }) => {
                            return h('p',
                                {
                                    attrs: {},
                                    class: {},
                                    style: {},
                                }, row?.variables?.title)
                        }
                    },
                    {
                        label: '流程名称',
                        prop: 'processDefinitionName',
                        width: 100,
                    },/*
                    {
                        label: '流程类型',
                        width: 100,
                        prop: 'categoryName',
                    },*/

                    {
                        label: '机床',
                        width: 100,
                        prop: '',
                        formatter: (val, value, label) => {
                            return `${val?.variables?.machineCode}`;
                        },
                    },
                    {
                        label: '创建人',
                        width: 100,
                        prop: 'startUserName',
                    },
                    {
                        label: '创建时间',
                        width: 200,
                        prop: 'processCreateTime',
                        type: 'datetime',
                        format: 'YYYY-MM-DD HH:mm:ss',
                        valueFormat: 'YYYY-MM-DD HH:mm:ss',
                        search: true,
                        searchRange: true,
                        searchSpan: 8,
                        // hide: true,
                    },
                    {
                        label: '上一步用户',
                        width: 200,
                        prop: '',
                        formatter: (val, value, label) => {
                            return `${val?.variables?.approveUserNickName || ''}`;
                        },
                    },
                    {
                        label: '当前节点',
                        width: 200,
                        prop: 'taskName',
                    },
                    {
                        label: '文件',
                        width: 200,
                        prop: 'file',
                    },
                    {
                        label: '到达时间',
                        width: 200,
                        prop: 'createTime',
                    },
                    {
                        label: '到达描述',
                        width: 200,
                        prop: 'comment',
                    },

                ],
            },
            data: [],
            transferTaskSelection: [],
            reassignBox: false,
            reassignOption: {
                submitBtn: true,
                emptyBtn: false,
                column: [
                    {
                        label: '发送给',
                        prop: 'newAssigneeId',
                        type: 'select',
                        // dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        // dicFlag: true,
                        props: {
                            label: 'name',
                            value: 'id',
                        },
                        span: 24,
                        disabled: false,
                        dicData: [

                        ],
                        rules: [{ required: true, message: '请输入选择', trigger: 'blur' }],
                    },
                    {
                        label: '备注',
                        span: 24,
                        prop: 'comment',
                        type: 'textarea',
                        rules: [{ required: true, message: '请输入审批意见', trigger: 'blur' }],
                    },
                ],
            },
            reassignForm: {}
        };
    },
    watch: {
        // 'form.category'() {
        //     const category = func.toInt(this.form.category);
        //     this.$refs.crud.option.column.filter(item => {
        //         if (item.prop === 'path') {
        //             item.rules[0].required = category === 1;
        //         }
        //         if (item.prop === 'isOpen') {
        //             item.disabled = category === 2;
        //         }
        //     });
        // },
        'formApprove.approve'(val) {
            if (val === 'Y' && ["approveTask", 'seniorApproveTask'].includes(this.row.taskDefinitionKey)) {// é«˜å¸ˆ
                this.optionApprove.column[1].disabled = true;
                this.formApprove.assignee = ''; // å¦‚果是通过，则默认指派给自己
            } else if(val === 'Y'){
               this.setAssignee(this.row);
            } else if(val === 'N') {
                this.formApprove.assignee = ''
                // this.formApprove.assignee = row.variables.senior;
            }
            if(val === 'Y' && ['confirmIsUseableTask'].includes(this.row.taskDefinitionKey) && this.row.variables.isProcessEditionSame=='N') {
                this.optionApprove.column[2].display = true; // æ˜¾ç¤ºå·¥åºç‰ˆæ¬¡
            } else {
                this.optionApprove.column[2].display = false; // éšè—å·¥åºç‰ˆæ¬¡
            }
            
        },
    },
    computed: {
        ...mapGetters(['userInfo', 'permission']),
        // permissionList() {
        //     return {
        //         addBtn: this.validData(this.permission.menu_add, false),
        //         viewBtn: this.validData(this.permission.menu_view, false),
        //         delBtn: this.validData(this.permission.menu_delete, false),
        //         editBtn: this.validData(this.permission.menu_edit, false),
        //     };
        // },
    },
    mounted() {
        getAssignee().then(res => {
            this.assigneeData = res.data.data;
            this.optionApprove.column[1].dicData = this.assigneeData;
            this.reassignOption.column[0].dicData = this.assigneeData;
        })
    },
    methods: {
        selectionTransferTask(list) {
            this.transferTaskSelection = list;
        },
        reassign() {// é‡æ–°æŒ‡æ´¾
            if (this.transferTaskSelection.length === 0) {
                this.$message.warning('请选择需要重新指派的任务');
                return;
            }
            if (this.transferTaskSelection.length > 1) {
                this.$message.warning('请选择一条');
                return;
            }
            this.reassignBox = true;
        },
        toPerson(form, done) {
            this.$confirm('请确认是否指派', '', {
                confirmButtonText: this.$t('submitText'),
                cancelButtonText: this.$t('cancelText'),
                type: 'warning',
            }).then(() => {
                console.log('toPerson', form);
                reassgin({
                    ...form,
                    taskId: this.transferTaskSelection[0].taskId,
                    processInstanceId: this.transferTaskSelection[0].processInstanceId,
                }).then(res => {
                    this.$message.success('指派成功');
                    this.reassignBox = false;
                    this.$refs?.reassginform?.resetForm();
                    this.onLoad(this.page, this.query);
                    done()

                }).catch(err => {
                    console.error(err);
                    done()
                })
            });
            done();
        },
        setAssignee (row) {
             if (["check", 'cureCheckTask '].includes(row.taskDefinitionKey)) {// æ ¡å¯¹
                this.formApprove.assignee = row.variables.senior;
            } else if (["programmingTask",'cureProgramTask'].includes(row.taskDefinitionKey)) {// ç¼–制，校对
                this.formApprove.assignee = row.variables.checker;
            } else if (row.taskDefinitionKey == "teamLeaderTask") {
                this.formApprove.assignee = row.variables.programmer
            } else if (row.taskDefinitionKey == "confirmIsUseableTask") {
                this.formApprove.assignee = row.variables.checker
            } else if (["approveTask", 'seniorApproveTask'].includes(row.taskDefinitionKey)) {// é«˜å¸ˆå®¡æ ¸

            }
        },
        handleAction(row, index) {
            this.formApprove = {
                comment: '',
                approve: 'Y', // é»˜è®¤åŒ
            }
            this.approveBox = true;
            this.row = row
            this.setAssignee(row);
            console.log('handleAction', row, index);
        },
        handleSubmit(form, done) {
            if(this.row.taskDefinitionKey === 'programmingTask') {
                // if(this.applist.length !== 1) {
                //     done();
                //     return this.$message.success('请选择1个程序');
                // }
            }
            approve({
                ...this.formApprove,
                taskId: this.row.taskId,
                processInstanceId: this.row.processInstanceId,
                // programIds: this.row.taskDefinitionKey === 'programmingTask' ? this.applist.map(v => v.id).join(',') : '',
            }).then(res => {
                if(res.data.code !== 200) {
                    this.$message.error(res.data.msg);
                    done();
                    return;
                }
                this.$message.success('审批成功');
                this.approveBox = false;
                this.onLoad(this.page, this.query);
                done();
            }).catch(err => {
                done();
                console.error(err);
            });
        },
        searchChange(params, done) {
            let data = {}
            this.query = params;
            this.page.currentPage = 1;
            console.log('searchChange', params);
            params.createTimeBegin = params?.processCreateTime?.[0] || '';
            params.createTimeEnd = params?.processCreateTime?.[1] || '';
            console.log(params);
            // data = {
            //     createTimeBegin: dayjs(params.createTimeBegin).isValid() ? dayjs(params.createTimeBegin).format('YYYY-MM-DD') : '',
            //     createTimeEnd: dayjs(params.createTimeEnd).isValid() ? dayjs(params.createTimeEnd).format('YYYY-MM-DD') : '',
            //     keyword: params.keyword || ''
            // }
            data = {
                createTimeBegin: params.createTimeBegin,
                createTimeEnd: params.createTimeEnd,
                keyword: params.keyword || ''
            }
            this.query = data
            this.onLoad(this.page, data);
            done();
        },
        searchReset() {
            this.query = {};
            this.onLoad(this.page);
        },
        currentChange(currentPage) {
            this.page.currentPage = currentPage;
        },
        sizeChange(pageSize) {
            this.page.pageSize = pageSize;
        },
        refreshChange() {
            this.onLoad(this.page, this.query);
        },

        onLoad(page, params = {}) {
            const query = {
                ...this.query,
                // category: params.category ? flowCategory(params.category) : null,
                mode: this.mode,
            };
            try {
                delete query.processCreateTime; // åˆ é™¤ä¸å¿…要的查询条件
            } catch (error) {
                console.error('日期格式化错误', error);
            }

            this.loading = true;
            getList(page.currentPage, page.pageSize, Object.assign(query, params)).then(res => {
                const data = res.data.data;
                this.page.total = data.total;
                this.data = data.records;
                this.loading = false;
            });
        },
        selectionChange(applist) {
            this.applist = applist
        },
    },
};
</script>

<style scoped="scoped" lang="scss">
.approve-box {
    display: flex;

    &>div {
        border: 1px solid #ccc;
    }

    .left {
        width: 400px;
    }

    .right {
        flex: 1;
    }
}
</style>

 yarn.lock

@@ -2014,7 +2014,7 @@

v-code-diff@^1.13.1:
  version "1.13.1"
  resolved "https://registry.npmmirror.com/v-code-diff/-/v-code-diff-1.13.1.tgz"
  resolved "https://registry.yarnpkg.com/v-code-diff/-/v-code-diff-1.13.1.tgz#acead9aeec90ecf0769fdd23dc2e6ca2ecaa631f"
  integrity sha512-9LTV1dZhC1oYTntyB94vfumGgsfIX5u0fEDSI2Txx4vCE5sI5LkgeLJRRy2SsTVZmDcV+R73sBr0GpPn0TJxMw==
  dependencies:
    diff "^5.2.0"