qushaowei
2024-03-14 e055d2d93b516985fbc2df0f6f5a135f3230cccf
src/views/mdc/base/MdcMessageApproval.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,178 @@
<template>
  <a-card :bordered="false">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :span="6">
            <a-form-item label="设备编号">
              <a-input placeholder="请输入设备编号" v-model="queryParam.equipmentId"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="6">
            <a-form-item label="消息状态">
              <a-select v-model='queryParam.msgStatus' placeholder="请选择消息状态">
                <a-select-option v-for="item in msgStatusOptionList" :key="item.value" :value="item.value">
                  {{item.title}}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="8">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <a-table
      ref="table"
      size="default"
      bordered
      rowKey="id"
      :columns="columns"
      :dataSource="dataSource"
      :pagination="ipagination"
      :loading="loading"
      @change="handleTableChange">
      <span slot="action" slot-scope="text, record">
        <a @click="showModal(record,0)">查看</a>
        <a-divider type="vertical" v-if="record.hasProcess||record.hasConfirm"></a-divider>
        <a @click="showModal(record,1)" v-if="record.hasProcess">上报</a>
        <a-divider type="vertical" v-if="record.hasConfirm&&record.hasProcess"></a-divider>
        <a @click="showModal(record,2)" v-if="record.hasConfirm">确认</a>
        <!--<a @click="showModal(record,0)">查看</a>-->
        <!--<a-divider type="vertical"></a-divider>-->
        <!--<a @click="showModal(record,1)">上报</a>-->
        <!--<a-divider type="vertical"></a-divider>-->
        <!--<a @click="showModal(record,2)">确认</a>-->
      </span>
    </a-table>
    <mdc-message-approval-modal ref="modalRef" :title="modalTitle" :visible="modalVisible" :buttonId="buttonId"
                                @closeModal="modalVisible = false" @formHasSubmitted="loadData"/>
  </a-card>
</template>
<script>
  import { getAction, putAction } from '@/api/manage'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import { ajaxGetDictItems, getDictItemsFromCache } from '@/api/api'
  import MdcMessageApprovalModal from './modules/MdcMessageApproval/MdcMessageApprovalModal'
  export default {
    name: 'MdcMessageApproval',
    mixins: [JeecgListMixin],
    components: { MdcMessageApprovalModal },
    data() {
      return {
        description: 'mdc消息确认页面',
        queryParam: {},
        columns: [
          {
            title: '设备编号',
            align: 'center',
            dataIndex: 'equipmentId'
          },
          {
            title: '标题',
            align: 'center',
            dataIndex: 'titile'
          }, {
            title: '内容',
            align: 'center',
            dataIndex: 'msgContent',
            width: 450
          }, {
            title: '原因',
            align: 'center',
            dataIndex: 'reportContent',
            width: 450
          }, {
            title: '处理人',
            align: 'center',
            dataIndex: 'senderNames'
          }, {
            title: '确认人',
            align: 'center',
            dataIndex: 'approverNames'
          }, {
            title: '状态',
            align: 'center',
            dataIndex: 'msgStatus',
            customRender: function(text) {
              if (text == '0') {
                return '待处理'
              } else if (text == '1') {
                return '待确认'
              } else if (text == '2') {
                return '已确认'
              } else {
                return '已拒绝'
              }
            }
          }, {
            title: '操作',
            dataIndex: 'action',
            align: 'center',
            scopedSlots: { customRender: 'action' }
          }],
        url: {
          list: '/mdc/mdcMessageApproval/list'
        },
        loading: false,
        msgStatusOptionList: [],
        modalTitle: '',
        modalVisible: false,
        buttonId: null
      }
    },
    created() {
      this.initDictData('mdcMsgStatus')
    },
    methods: {
      /**
       * è°ƒç”¨æŽ¥å£èŽ·å–æ•°æ®å­—å…¸é…ç½®msgStatus
       * @param dictCode æ•°æ®å­—典编号
       */
      initDictData(dictCode) {
        //根据字典Code, åˆå§‹åŒ–字典数组
        ajaxGetDictItems(dictCode, null).then((res) => {
          if (res.success) {
            console.log('res================', res)
            this.msgStatusOptionList = res.result
          }
        })
      },
      /**
       * ç‚¹å‡»æŒ‰é’®å±•示弹窗
       * @param record ç‚¹å‡»è¡Œä¿¡æ¯
       * @param buttonId æŒ‰é’®Id(查看:0,上报:1,确认:2)
       */
      showModal(record, buttonId) {
        this.buttonId = buttonId
        switch (buttonId) {
          case 0:
            this.modalTitle = '消息内容'
            break
          case 1:
            this.modalTitle = '上报原因'
            break
          case 2:
            this.modalTitle = '确认消息'
            break
          default:
            this.modalTitle = '消息内容'
        }
        this.$refs.modalRef.formParams = Object.assign({}, record)
        this.modalVisible = true
      }
    }
  }
</script>