kd-aiot-frontend-eom/src/views/contractManage/contractBook/components/changeList.vue

<template>
  <div>
    <ele-pro-table
      ref="table"
      :needPage="false"
      :columns="columns"
      :datasource="datasource"
      class="time-form"
    >
      <!-- 查看详情列 -->
      <template v-slot:contractName="{ row }">
        <el-link type="primary" :underline="false" @click="openDetail(row)">
          {{ row.contractName }}
        </el-link>
      </template>
    </ele-pro-table>
    <detail-dialog ref="contactDetailDialogRef"></detail-dialog>
  </div>
</template>
<script>
  import { reviewStatus } from '@/enum/dict';
  import { getTableList } from '@/api/contractManage/contractChange.js';
  import detailDialog from './detailDialog1.vue';

  export default {
    components: { detailDialog },
    data() {
      return {
        datasource: [],
        columns: [
          {
            width: 60,
            label: '序号',
            type: 'index',
            columnKey: 'index',
            align: 'center'
          },
          {
            minWidth: 200,
            prop: 'changeCode',
            label: '编码',
            align: 'center',
            slot: 'changeCode',
            showOverflowTooltip: true
          },
          {
            minWidth: 200,
            prop: 'contractName',
            label: '变更合同',
            slot: 'contractName',
            align: 'center',
            showOverflowTooltip: true
          },

          {
            minWidth: 200,
            prop: 'reason',
            label: '变更原因',
            align: 'center',
            showOverflowTooltip: true
          },

          {
            minWidth: 80,
            prop: 'remark',
            label: '变更描述',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'approvalStatus',
            label: '审核状态',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 100,
            formatter: (_row, _column, cellValue) => {
              return reviewStatus[_row.approvalStatus];
            }
          },
          {
            minWidth: 100,
            prop: 'createUserName',
            label: '创建人',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            minWidth: 100,
            prop: 'createTime',
            label: '创建时间',
            align: 'center',
            showOverflowTooltip: true
          }
        ]
      };
    },

    methods: {
      //查看详情
      openDetail(row) {
        this.$refs.contactDetailDialogRef.open({id:row.contractId});
      },
      init(id) {
        getTableList({
          pageNum: 1,
          size: 100,
          contractId: id
        }).then((res) => {
          this.datasource=res.list
        });
      }
    }
  };
</script>
<style lang="scss" scoped></style>