excel导入数据处理前端

  dialogErrorVisible = false;
  dialogErrorTitle = '';//错误标题

  public get gridErrorOptions(): GridOptions {
    return {
      headerHeight: 30, // 表头高度
      rowHeight: 30, // 行高
      columnDefs: [
        //列定义
        {
          headerName: "序号",
          field: "SerialNumber",
          width: 40,
          pinned: 'left',
        },
        {
          headerName: "合同产品名称",
          field: "ContractName",
          width: 120,
          pinned: 'left',
          cellClassRules: {
            'pink-background': (params) => {
                if(params.data.ErrorColMsg && Object.keys(params.data.ErrorColMsg).length > 0){
                  if(params.data.ErrorColMsg.hasOwnProperty(1)){
                    return true;
                  }
                }
                return false;
            }
          }
        },
        {
          headerName: "备注",
          field: "Remarks",
          width: 80,
        },
      ],
      showToolPanel: false, // 显示工具栏
      enableSorting: true, //允许排序
      enableColResize: true, //允许调整列宽
      suppressLoadingOverlay: true, // 去掉表格加载数据提示
      suppressNoRowsOverlay: true, // 去掉表格无数据提示
      suppressDragLeaveHidesColumns: true, //防止拖动的时候隐藏表格列
      suppressContextMenu: true, // 阻止表格的右键菜单
      defaultColDef: {
        suppressMenu: true, //隐藏表头菜单
      },
      rowSelection: "single", //只允许单行选中
      isExternalFilterPresent: () => {
        // 检查是否存在外部过滤器
        return true;
      },
      doesExternalFilterPass: (node) => {
        // 过滤显示 ErrorColMsg 对象中有 key 值的数据
        return node.data.ErrorColMsg && Object.keys(node.data.ErrorColMsg).length > 0;
      },
    };
  }

  <!--错误详情弹窗-->
  <el-dialog class="error-mainproject" :visible.sync="dialogErrorVisible" width="136vh" top="8vh" :title="dialogErrorTitle">
    <div>
      <ag-grid-vue class="ag-fresh absolute ag-theme-balham" :gridOptions="gridErrorOptions" style="height: 75vh;"></ag-grid-vue>
    </div>
  </el-dialog>

.error-mainproject .pink-background {
  background-color: pink;
}