1、保养规范审批流程根据规范分类区分展示保养项明细 2、调整二保批量新增功能

zhaowei

昨天 7859c063db5effe91f2418056e70b848177a3628

 src/views/flowable/workflow/MaintenanceStandard/MaintenanceStandardApprovalModal.vue

@@ -74,21 +74,79 @@
          </a-col>

          <a-col :span="10" class="scroll-col">
            <a-tabs default-active-key="1">
              <a-tab-pane key="1" tab="保养项明细">
                <j-vxe-table ref="editableDetailTable" bordered alwaysEdit keep-source :dataSource="detail.dataSource"
                             :columns="detail.columns">
                  <template v-slot:itemCategory="props">
                    <j-dict-select-tag v-model="props.row.itemCategory" :dict-code="encodedDictCode" disabled/>
                  </template>
                </j-vxe-table>
              </a-tab-pane>
            <a-tabs v-model="activeTabKey">
              <template v-if="model.maintenanceCategory==='POINT_INSPECTION'">
                <a-tab-pane key="1" tab="日点检">
                  <j-vxe-table bordered alwaysEdit keep-source :dataSource="detail.dataSource1"
                               :columns="detail.columns">
                    <template v-slot:itemCategory="props">
                      <j-dict-select-tag v-model="props.row.itemCategory" :dict-code="encodedDictCode" disabled/>
                    </template>
                  </j-vxe-table>
                </a-tab-pane>

              <template v-if="selectShenpiData.procInstId">
                <a-tab-pane tab='流程图' forceRender>
                  <img :src="imageSrc" width="100%" v-if="imageSrc"/>
                <a-tab-pane key="2" tab="周点检">
                  <j-vxe-table bordered alwaysEdit keep-source :dataSource="detail.dataSource2"
                               :columns="detail.columns">
                    <template v-slot:itemCategory="props">
                      <j-dict-select-tag v-model="props.row.itemCategory" :dict-code="encodedDictCode" disabled/>
                    </template>
                  </j-vxe-table>
                </a-tab-pane>
              </template>

              <template v-if="model.maintenanceCategory==='SECOND_MAINTENANCE'">
                <a-tab-pane key="1" tab="操作工">
                  <j-vxe-table bordered alwaysEdit keep-source :dataSource="detail.dataSource1"
                               :columns="detail.columns">
                    <template v-slot:itemCategory="props">
                      <j-dict-select-tag v-model="props.row.itemCategory" :dict-code="encodedDictCode" disabled/>
                    </template>
                  </j-vxe-table>
                </a-tab-pane>

                <a-tab-pane key="2" tab="维修工">
                  <j-vxe-table bordered alwaysEdit keep-source :dataSource="detail.dataSource2"
                               :columns="detail.columns">
                    <template v-slot:itemCategory="props">
                      <j-dict-select-tag v-model="props.row.itemCategory" :dict-code="encodedDictCode" disabled/>
                    </template>
                  </j-vxe-table>
                </a-tab-pane>
              </template>

              <template v-if="model.maintenanceCategory==='THIRD_MAINTENANCE'">
                <a-tab-pane key="1" tab="三保">
                  <j-vxe-table bordered alwaysEdit keep-source :dataSource="detail.dataSource1"
                               :columns="detail.columns">
                    <template v-slot:itemCategory="props">
                      <j-dict-select-tag v-model="props.row.itemCategory" :dict-code="encodedDictCode" disabled/>
                    </template>
                  </j-vxe-table>
                </a-tab-pane>
              </template>

              <template v-if="selectShenpiData.processDefinitionKey">
                <a-tab-pane key='3' tab='流程图'>
                  <img :src="imageSrc" alt="Fetched Image"/>
                </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-tabs>
          </a-col>

@@ -161,6 +219,7 @@
        confirmLoading: false,
        spinning: false,
        model: {},
        hitaskDataSource: [],
        validatorRules: {
          repairManagerApproveResult: [{ required: true, message: '请选择确认类型' }],
          technicalManagerApproveResult: [{ required: true, message: '请选择确认类型' }]
@@ -175,6 +234,7 @@
          sm: { span: 16 }
        },
        visible: false,
        activeTabKey: '1',
        // 表头
        url: {
          diagramView: '/assign/flow/diagramView',
@@ -184,7 +244,8 @@
          detailList: '/eam/eamMaintenanceStandardDetail/queryList'
        },
        detail: {
          dataSource: [],
          dataSource1: [],
          dataSource2: [],
          columns: [],
          inspectionColumns: [
            {
@@ -201,16 +262,17 @@
              title: '项目序号',
              key: 'itemCode',
              type: JVXETypes.normal,
              align: 'center'
            },
            {
              title: '保养项分类',
              key: 'itemCategory',
              type: JVXETypes.slot,
              slotName: 'itemCategory',
              align: 'center',
              disabled: true
              width: 100
            },
            // {
            //   title: '保养项分类',
            //   key: 'itemCategory',
            //   type: JVXETypes.slot,
            //   slotName: 'itemCategory',
            //   align: 'center',
            //   disabled: true
            // },
            {
              title: '保养项目',
              key: 'itemName',
@@ -239,16 +301,17 @@
              title: '项目序号',
              key: 'itemCode',
              type: JVXETypes.normal,
              align: 'center'
            },
            {
              title: '保养项分类',
              key: 'itemCategory',
              type: JVXETypes.slot,
              slotName: 'itemCategory',
              align: 'center',
              disabled: true
              width: 100
            },
            // {
            //   title: '保养项分类',
            //   key: 'itemCategory',
            //   type: JVXETypes.slot,
            //   slotName: 'itemCategory',
            //   align: 'center',
            //   disabled: true
            // },
            {
              title: '保养项目',
              key: 'itemName',
@@ -315,11 +378,11 @@
    },
    computed: {
      displayRepairLeaderFlag() {
        return this.model.standardStatus && ['WAIT_REPAIR_DIRECTOR', 'WAIT_TECHNICAL_DIRECTOR', 'REJECTED'].includes(this.model.standardStatus)
        return this.model.standardStatus && ['WAIT_REPAIR_DIRECTOR', 'WAIT_TECHNICAL_DIRECTOR', 'START', 'REJECTED'].includes(this.model.standardStatus)
      },

      displayTechnicalDirectorFlag() {
        return this.model.standardStatus && ['WAIT_TECHNICAL_DIRECTOR', 'REJECTED'].includes(this.model.standardStatus) && this.model.repairManagerApproveResult === '1'
        return this.model.standardStatus && ['WAIT_TECHNICAL_DIRECTOR', 'START', 'REJECTED'].includes(this.model.standardStatus) && this.model.repairManagerApproveResult === '1'
      },

      encodedDictCode() {
@@ -333,8 +396,25 @@
       * @param record 主页面列表行记录
       */
      handleApprove(record) {
        this.activeTabKey = '1'
        this.getBasicInformationByApi(record)
        this.getFlowChartImageByApi(record)
        this.getFlowTaskListByApi(record)
      },

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

      /**
@@ -342,8 +422,10 @@
       * @param record 主页面列表行记录
       */
      handleDetail(record) {
        this.detail.dataSource = []
        this.activeTabKey = '1'
        this.detail.dataSource1 = this.detail.dataSource2 = []
        this.model = Object.assign({}, record)
        this.getFlowTaskListByApi(record)
        this.loadDetail(record.id)
      },

@@ -354,7 +436,7 @@
      getBasicInformationByApi(record) {
        this.spinning = true
        this.model = {}
        this.detail.dataSource = []
        this.detail.dataSource1 = this.detail.dataSource2 = []
        const that = this
        getAction(this.url.queryById, { id: record.dataId })
          .then(res => {
@@ -405,9 +487,26 @@
       * @param dataId 业务ID
       */
      loadDetail(dataId) {
        this.spinning = true
        getAction(this.url.detailList, { standardId: dataId })
          .then(res => {
            if (res.success) this.detail.dataSource = res.result
            if (res.success) {
              switch (this.model.maintenanceCategory) {
                case 'POINT_INSPECTION':
                  this.detail.dataSource1 = res.result.filter(item => item.itemCategory === 'DAY_INSPECTION')
                  this.detail.dataSource2 = res.result.filter(item => item.itemCategory === 'WEEK_INSPECTION')
                  break
                case 'SECOND_MAINTENANCE':
                  this.detail.dataSource1 = res.result.filter(item => item.itemCategory === 'OPERATOR_MAINTENANCE')
                  this.detail.dataSource2 = res.result.filter(item => item.itemCategory === 'REPAIRER_MAINTENANCE')
                  break
                case 'THIRD_MAINTENANCE':
                  this.detail.dataSource1 = res.result
                  break
                default:
                  break
              }
            }
          })
          .finally(() => {
            this.spinning = false
@@ -415,11 +514,6 @@
      },

      async submitForm() {
        let errMap = await this.$refs.editableDetailTable.validateTable()
        if (errMap) {
          return
        }

        this.$refs.form.validate(valid => {
          if (valid) {
            this.confirmLoading = this.spinning = true
@@ -481,4 +575,120 @@
      }
    }
  }

  /* 全局禁选样式 - 作用于整个页面 */
  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;
  }
</style>