添加流程节点

lyh

12 小时以前 ae9b400eae985f6b6f2e33f66ee1575f72675898

 src/views/flowable/workflow/InspectionOrder/InspectionOrderHandle.vue

@@ -78,9 +78,9 @@
          <a-col :span="!isDisplayConfirm?16:10" class="scroll-col">
            <a-tabs :active-key="activeTabKey" @change="handleTabChange">
              <a-tab-pane key="1" tab="日点检">
                <j-vxe-table ref="editableDetailTable1" :rowNumber="false" rowSelection bordered
                <j-vxe-table ref="editableDetailTable1" :columns="getColumns()" :rowNumber="false" rowSelection bordered
                             alwaysEdit :toolbar="false" keep-source :height="500"
                             :dataSource="detail.dayInspectionList" :columns="detail.columns"
                             :dataSource="detail.dayInspectionList"
                             @selectRowChange="handleTableSelectRowChange($event,'Day')">
                  <template v-slot:inspectionResult="props">
                    <j-dict-select-tag v-model="props.row.inspectionResult" dictCode="inspection_project_result"
@@ -97,17 +97,25 @@

                  <template v-slot:reportFlag="props">
                    <j-dict-select-tag v-model="props.row.reportFlag"
                                       :placeholder="props.row.inspectionResult&&props.row.inspectionResult!='NORMAL'?'请选择异常是否报修':''"
                                       :disabled="isDisableOperation||!props.row.inspectionResult||props.row.inspectionResult=='NORMAL'"
                                       :disabled="true"
                                       dictCode="yn" style="width: 100%"/>
                  </template>

                  <!-- 操作 -->
                  <template v-slot:action="props">
                    <a :class="{ 'disabled-link': shouldDisableRepairButton(props.row) }"
                       @click="!shouldDisableRepairButton(props.row) && handleRepairReporting(props.row)">
                      报修填报
                    </a>
                  </template>

                </j-vxe-table>
              </a-tab-pane>

              <a-tab-pane key="2" tab="周点检" forceRender>
                <j-vxe-table ref="editableDetailTable2" :rowNumber="false" rowSelection bordered
                             alwaysEdit :toolbar="false" keep-source :height="500"
                             :dataSource="detail.weekInspectionList" :columns="detail.columns"
                             :dataSource="detail.weekInspectionList"  :columns="getColumns()"
                             @selectRowChange="handleTableSelectRowChange($event,'Week')">
                  <template v-slot:inspectionResult="props">
                    <j-dict-select-tag v-model="props.row.inspectionResult" dictCode="inspection_project_result"
@@ -125,10 +133,19 @@

                  <template v-slot:reportFlag="props">
                    <j-dict-select-tag v-model="props.row.reportFlag"
                                       :placeholder="props.row.inspectionResult&&props.row.inspectionResult!='NORMAL'?'请选择异常是否报修':''"
                                       :disabled="isDisableOperation||!props.row.inspectionResult||props.row.inspectionResult=='NORMAL'"
                                       :disabled="true"
                                       dictCode="yn" style="width: 100%"/>
                  </template>


                  <!-- 操作 -->
                  <template v-slot:action="props">
                    <a :class="{ 'disabled-link': shouldDisableRepairButton(props.row) }"
                       @click="!shouldDisableRepairButton(props.row) && handleRepairReporting(props.row)">
                      报修填报
                    </a>
                  </template>

                </j-vxe-table>
              </a-tab-pane>

@@ -137,6 +154,23 @@
                  <img :src="imageSrc" v-if="imageSrc"/>
                </a-tab-pane>
              </template>

              <a-tab-pane key='4' tab='流转节点'>
                <a-card>
                  <a-timeline style="padding:0 1% 0 12%" >
                    <a-timeline-item color='white' v-for="(item,index1) in hitaskDataSource" :key="index1">
                      <div class="bottom">
                        <p>处理人：{{item.assignee_dictText}}</p>
                        <p v-if="index1 !==0">处理时长：{{item.duration}}</p>
                        <p v-if="item.name !== '提交申请'">处理类型：{{item.sequenceFlowName}}</p>
                        <p v-if="item.description != null">处理意见：{{item.description}}</p>
                        <div class="left_qiu"><span>{{item.taskName}}</span></div>
                      </div>
                    </a-timeline-item>
                  </a-timeline>
                </a-card>
              </a-tab-pane>


              <a-button
                v-if="activeTabKey=='1'||activeTabKey=='2'"
@@ -172,6 +206,7 @@
          </a-col>
        </a-row>
      </a-form-model>
      <eamReportRepair-modal ref="modalForm"  @ok="handleRepairComplete" @close="handleRepairClose"/>
    </a-spin>
  </j-modal>
</template>
@@ -181,10 +216,11 @@
  import MaintenanceEquipmentSelect from '@views/eam/equipment/modules/MaintenanceEquipmentSelect.vue'
  import { JVXETypes } from '@comp/jeecg/JVxeTable'
  import moment from 'moment'
  import EamReportRepairModal from "@views/eam/repair/modules/EamReportRepairList/EamReportRepairModal.vue";

  export default {
    name: 'InspectionOrderHandle',
    components: { MaintenanceEquipmentSelect },
    components: {EamReportRepairModal, MaintenanceEquipmentSelect },
    props: {
      selectShenpiData: {
        type: Object
@@ -196,6 +232,7 @@
        confirmLoading: false,
        spinning: false,
        model: {},
        currentRepairRow: null,
        validatorRules: {
          confirmDealType: [
            { required: true, message: '请选择处理类型' }
@@ -273,6 +310,13 @@
              validateRules: [
                { handler: this.customValidator }
              ]
            },
            {
              title: '操作',
              align: 'center',
              type: JVXETypes.slot,
              slotName: 'action',
              fixed: 'right'
            }
          ],
          dayInspectionList: [],
@@ -281,9 +325,10 @@
        },
        selectedDayInspectionRowKeys: [],
        selectedWeekInspectionRowKeys: [],
        hitaskDataSource:[],
        disableSubmit: false,
        activeTabKey: '1',
        title: ''
        title: '',
      }
    },
    computed: {
@@ -292,15 +337,92 @@
      },
      isDisableOperation() {
        return this.disableSubmit || this.model.inspectionStatus !== 'UNDER_INSPECTION'
      },
      // 添加操作列显示条件
      shouldShowActionColumn() {
        return this.model.inspectionStatus === 'UNDER_INSPECTION';
      }
    },
    methods: {
      // 添加获取列的方法
      getColumns() {
        const columns = [
          // 基础列定义（序号、保养项等）
          {
            title: '序号',
            key: 'itemCode',
            type: JVXETypes.normal,
            width: 60,
            align: 'center',
            fixed: 'left'
          },
          {
            title: '保养项',
            key: 'itemName',
            type: JVXETypes.normal,
            align: 'center',
            fixed: 'left'
          },
          {
            title: '保养要求',
            key: 'itemDemand',
            type: JVXETypes.normal,
            align: 'center',
            fixed: 'left'
          },
          {
            title: '点检结果',
            key: 'inspectionResult',
            type: JVXETypes.slot,
            slotName: 'inspectionResult',
            align: 'center',
            validateRules: [
              { required: true, message: '${title}不能为空' }
            ]
          },
          {
            title: '异常描述',
            key: 'exceptionDescription',
            type: JVXETypes.slot,
            slotName: 'exceptionDescription',
            align: 'center',
            validateRules: [
              { handler: this.customValidator }
            ]
          },
          {
            title: '异常是否报修',
            key: 'reportFlag',
            type: JVXETypes.slot,
            slotName: 'reportFlag',
            align: 'center',
            validateRules: [
              { handler: this.customValidator }
            ]
          }
        ];

        // 仅在点检中状态下添加操作列
        if (this.shouldShowActionColumn) {
          columns.push({
            title: '操作',
            align: 'center',
            type: JVXETypes.slot,
            width: 150,
            slotName: 'action',
            fixed: 'right'
          });
        }
        return columns;
      },

      handleApprove(record) {
        this.spinning = true
        this.activeTabKey = '1'
        this.detail.dayInspectionList = this.detail.weekInspectionList = []
        this.getBasicInformationByApi(record)
        this.getFlowChartImageByApi(record)
        this.getFlowTaskListByApi(record)
      },

      handleDetail(record) {
@@ -310,6 +432,7 @@
        this.model = Object.assign({}, record)
        this.getDayInspectionOrderListByApi(record.id)
        this.getWeekInspectionOrderListByApi(record.standardId)
        this.getFlowTaskListByApi(record)
      },

      /**
@@ -520,6 +643,55 @@
        }
      },

      /**
       * 获取流转节点
       * @param record
       */
      getFlowTaskListByApi(record) {
        let parmhis={
          'procInstId': record.procInstId
        }
        getAction(this.url.queryHisTaskList,parmhis).then(res=>{
          this.hitaskDataSource=res.result
        }).finally(
          this.visible = true,
          console.log('this.approveData---->', this.approveData)
        )
      },

      // 添加禁用条件判断方法
      shouldDisableRepairButton(row) {
        return this.model.inspectionStatus !== 'UNDER_INSPECTION' ||
          row.inspectionResult !== 'ANOMALY';
      },

      /**
       * 异常描述填报故障报修
       * @param exceptionDescription
       */
      handleRepairReporting(row) {
        this.currentRepairRow = row; // 存储当前操作行
        let record = {
          faultDescription: row.exceptionDescription,
          equipmentId: this.model.equipmentId
        }
        this.$refs.modalForm.handleRepair(record)
      },

      handleRepairClose(success) {
        if (!success && this.currentRepairRow) {
          this.currentRepairRow = null; // 清除未成功的操作
        }
      },

      handleRepairComplete(success) {
        if (success && this.currentRepairRow) {
          this.$set(this.currentRepairRow, 'reportFlag', '1');
          this.$message.success("报修已成功提交");
        }
        this.currentRepairRow = null;
      },

      handleCancel() {
        this.selectedDayInspectionRowKeys = this.selectedWeekInspectionRowKeys = []
        this.visible = false
@@ -552,4 +724,122 @@
      }
    }
  }
  /* 全局禁选样式 - 作用于整个页面 */
  html.submitting,
  html.submitting body {
    pointer-events: none !important;
    cursor: wait !important;
  }

  /* 蒙层效果增强 */
  html.submitting::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.5);
    z-index: 9998;
  }

  /* 加载指示器 - 更明显的视觉反馈 */
  html.submitting::after {
    content: '提交中...';
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #1890ff;
    color: white;
    padding: 10px 20px;
    border-radius: 4px;
    z-index: 9999;
  }

  /* 禁用状态按钮样式 */
  .disabled-btn {
    opacity: 0.6;
    cursor: not-allowed !important;
  }

  .shallow-hr {
    border: 0;
    height: 1px; /* 分界线的高度 */
    background-color: rgba(0, 0, 0, 0.1); /* 使用 RGBA 颜色，并设置较低的透明度 */
    margin: 20px 0; /* 分界线上下的外边距 */
  }
  .btn-custom {
    background-color: #4CAF50; /* 绿色背景 */
    color: white; /* 白色文字 */
    border: none; /* 无边框 */
    padding: 5px 15px; /* 内边距 */
    text-align: center; /* 文字居中 */
    text-decoration: none; /* 无下划线 */
    display: inline-block; /* 行内块元素 */
    font-size: 12px; /* 字体大小 */
    margin: 4px 2px; /* 外边距 */
    cursor: pointer; /* 鼠标悬停时显示手型 */
    border-radius: 4px; /* 圆角边框 */
  }

  .bold-large-label {
    font-weight: bold;
    font-size: 20px; /* 或你需要的任何大小 */
  }
  .left_qiu{
    position: absolute;
    left: -74px;
    top: 0;
    width:54px;
    border-radius: 50%;
    height:54px;
    font-size: 13px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    background: #0099ff;
    transform: translate(0, 0);
  }
  /deep/ .ant-timeline-item-tail{
    left: -29px !important;
  }
  .left_qiu span{
    width: 3em;
    display: block;
    color: #fff;
    text-align: center;
  }
  .img{
    width: 75%;
  }

  .wrap{
    clear: both;
    width: 100%;
    display: flex;
    height: 50px;
    border: 1px solid #ccc;
    /* background-color: aqua; */
  }
  .box{
    width:21%;
    height:50px;
    border-right: 1px solid #ccc;
    line-height: 50px;
    /* background: red; */
    text-align:center;
    margin: auto;
  }


  /* 添加禁用样式 */
  .disabled-link {
    color: #999;
    cursor: not-allowed;
    pointer-events: none;
    text-decoration: none;
  }
</style>