art: 设备管理-周保工单-按钮权限控制，批量领取

zhangherong

2025-04-23 6c16bede88a1d776f0eced7028cca2080a1a606f

 src/views/eam/maintenance/EamWeekMaintenanceOrderList.vue

@@ -2,7 +2,7 @@
  <a-card :bordered="false">

    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
    <div class="table-page-search-wrapper" v-if="isDisplayOperation">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="4" :lg="7" :md="8" :sm="24">
@@ -37,16 +37,16 @@
    </div>

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
    <div class="table-operator" v-if="isDisplayOperation">
      <a-button @click="handleAdd" type="primary" icon="plus" v-if="isShowAuth('eam:weekMaintenance:add')">新增</a-button>
      <a-dropdown v-if="selectedRowKeys.length > 0">
        <a-menu slot="overlay">
          <a-menu-item key="1" @click="handlerBatchAbolish">
          <a-menu-item key="1" @click="handlerBatchAbolish" v-if="isShowAuth('eam:weekMaintenance:abolish')">
            <a-icon type="delete" />
            作废
          </a-menu-item>
          <a-menu-item key="1" @click="handlerBatchCollect">
            <a-icon type="delete" />
          <a-menu-item key="2" @click="handlerBatchCollect" v-if="isShowAuth('eam:weekMaintenance:collect')">
            <a-icon type="form" />
            领取
          </a-menu-item>
        </a-menu>
@@ -58,7 +58,7 @@

    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;" v-if="isDisplayOperation">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a
        style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
@@ -74,21 +74,20 @@
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
        :scroll="{x:'max-content'}"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        @change="handleTableChange">

        <span slot="action" slot-scope="text, record">
          <a v-if="record.maintenanceStatus === 'WAIT_MAINTENANCE'" @click="handleEdit(record)">编辑</a>
          <a-divider type="vertical" />
          <a v-if="record.maintenanceStatus === 'WAIT_MAINTENANCE' && isShowAuth('eam:weekMaintenance:edit')" @click="handleEdit(record)">编辑</a>
          <a-divider type="vertical" v-if="record.maintenanceStatus === 'WAIT_MAINTENANCE' && isShowAuth('eam:weekMaintenance:edit')" />
          <a-popconfirm title="确定领取吗?" @confirm="() => handlerCollect(record.id)">
            <a>领取</a>
          </a-popconfirm>
          <a-dropdown>
            <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
            <a-menu slot="overlay">
               <a-menu-item v-if="record.maintenanceStatus === 'WAIT_MAINTENANCE'">
                <a-popconfirm title="确定领取吗?" @confirm="() => handlerCollect(record.id)">
                  <a>领取</a>
                </a-popconfirm>
              </a-menu-item>
              <a-menu-item v-if="record.maintenanceStatus === 'WAIT_MAINTENANCE'">
              <a-menu-item v-if="record.maintenanceStatus === 'WAIT_MAINTENANCE'  && isShowAuth('eam:weekMaintenance:abolish')">
                <a-popconfirm title="确定作废吗?" @confirm="() => handlerAbolish(record.id)">
                  <a>作废</a>
                </a-popconfirm>
@@ -106,7 +105,7 @@

    <!-- 表单区域 -->
    <eamWeekMaintenanceOrder-modal ref="modalForm" @ok="modalFormOk"></eamWeekMaintenanceOrder-modal>
    <week-maintenance-approval-modal ref="weekMaintenanceApprovalModal"></week-maintenance-approval-modal>
    <week-maintenance-approval-modal ref="weekMaintenanceApprovalModal" :selectShenpiData="selectWeekMaintenanceData"></week-maintenance-approval-modal>
  </a-card>
</template>

@@ -126,9 +125,17 @@
    EamWeekMaintenanceOrderModal,
    WeekMaintenanceApprovalModal
  },
  props: {
    isDisplayOperation: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      description: '周保工单管理页面',
      disableMixinCreated: true,
      selectWeekMaintenanceData:{},
      // 表头
      columns: [
        {
@@ -265,22 +272,38 @@
          dataIndex: 'remark',
          width: 60,
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          fixed: 'right',
          width: 100,
          scopedSlots: { customRender: 'action' }
        }
        // {
        //   title: '操作',
        //   dataIndex: 'action',
        //   align: 'center',
        //   fixed: 'right',
        //   width: 100,
        //   scopedSlots: { customRender: 'action' }
        // }
      ],
      url: {
        list: '/eam/weekMaintenanceOrder/list',
        abolish: '/eam/weekMaintenanceOrder/abolish',
        abolishBatch: '/eam/weekMaintenanceOrder/abolishBatch',
        collect: '/eam/weekMaintenanceOrder/collect',
        collectBatch: '/eam/weekMaintenanceOrder/collectBatch',
      }
    }
  },
  created() {
    if (!this.isDisplayOperation) {
      return
    }
    const operationColumn = {
      title: '操作',
      dataIndex: 'action',
      align: 'center',
      fixed: 'right',
      width: 147,
      scopedSlots: { customRender: 'action' }
    }
    this.columns = [...this.columns, operationColumn]
    this.loadData(1)
  },
  computed: {},
  methods: {
@@ -389,9 +412,55 @@
    },
    //批量领取
    handlerBatchCollect(){

      if(!this.url.collectBatch){
        this.$message.error("请设置url.abolishBatch属性!")
        return
      }
      if (this.selectedRowKeys.length <= 0) {
        // this.$message.warning('请选择一条记录！');
        this.$notification.warning({
          message:'消息',
          description:"请选择一条记录"
        });
        return;
      } else {
        var ids = "";
        for (var a = 0; a < this.selectedRowKeys.length; a++) {
          ids += this.selectedRowKeys[a] + ",";
        }
        var that = this;
        this.$confirm({
          title: "确认领取",
          content: "是否领取选中数据，只有待保养状态的数据才可领取成功?",
          onOk: function () {
            that.loading = true;
            deleteAction(that.url.collectBatch, {ids: ids}).then((res) => {
              if (res.success) {
                //重新计算分页问题
                that.reCalculatePage(that.selectedRowKeys.length)
                // that.$message.success(res.message);
                that.$notification.success({
                  message:'消息',
                  description:res.message
                });
                that.loadData();
                that.onClearSelected();
              } else {
                // that.$message.warning(res.message);
                that.$notification.warning({
                  message:'消息',
                  description:res.message
                });
              }
            }).finally(() => {
              that.loading = false;
            });
          }
        });
      }
    },
    handleDetail(record) {
      this.selectWeekMaintenanceData = Object.assign({}, record)
      this.$refs.weekMaintenanceApprovalModal.recordDetail(record)
      this.$refs.weekMaintenanceApprovalModal.title = '详情';
      this.$refs.weekMaintenanceApprovalModal.disableSubmit = true