kd-aiot-frontend-qms/src/views/inspectionWork/components/fileTableList.vue

<template>
  <div>
    <ele-pro-table
      ref="fileTable"
      :columns="jobColumns1"
      :datasource="fileTableList"
      :need-page="false"
      :immediate="true"
    >
      <template v-slot:action="{ row, $index }">
        <el-link type="primary" @click="fileDetails(row)">预览</el-link>
      </template>
    </ele-pro-table>
  </div>
</template>

<script>
  import { newFilePageAPI } from '@/api/inspectionWork';
  export default {
    components: {},
    props: {
      fileParam: {
        type: Array
      }
    },

    watch: {
      fileParam: {
        handler(val) {
          this.fileParamDatasource(val);
        },
        deep: true,
        immediate: true
      }
    },

    data() {
      return {
        fileTableList: []
      };
    },

    created() {},

    methods: {
      //工艺文件表格回显
      fileParamDatasource(fileParam) {
        let fileId = fileParam.map((item) => item.id).join(',');
        newFilePageAPI({
          ids: "'" + fileId + "'"
        }).then((res) => {
          this.fileTableList = res;
        });
      }
    }
  };
</script>

<style lang="scss" scoped>
  .content_box {
    width: 100%;
    margin-top: 12px;
    max-height: 42vh;
    overflow-y: scroll;
  }

  .content_ll_case {
    display: flex;
    flex-wrap: wrap;
    background: #e6f7ff;
    line-height: 30px;
  }

  .content_ll {
    height: 30px;
    width: 23%;
    display: flex;
    flex-direction: row;
    align-items: center;

    margin: auto;

    .name {
      color: #000;
      font-weight: 500;
      margin-right: 8px;
    }
  }

  ::v-deep .el-table--medium .el-table__cell {
    padding: 4px 0 !important;
  }

  ::v-deep .el-form-item__content {
    line-height: 28px !important;
  }
</style>