import { GridOptions, themeQuartz } from "ag-grid-community"
const borderConfig = {
  style: "solid", // 虚线改实线更简洁，也可保留 dotted 但建议用 solid
  width: 0.3,     // 更细的边框，减少视觉干扰
  color: "#d3d3d3" // 浅灰色边框，清新不刺眼
};

// 简洁清新风格的主题配置
export const myTheme = themeQuartz.withParams({
  // 核心：移除外边框，减少视觉包裹感
  wrapperBorder: false,

  // 表头样式（柔和浅蓝，无加粗，更轻盈）
  headerBackgroundColor: "#f0f2f3", // 极浅的背景色，替代深一点的 #e7f3fc
  headerTextColor: "#374151",      // 深灰色文字，比纯黑更柔和
  headerFontSize: 15,              // 字体稍大一点，更易读
  headerFontWeight: "normal",      // 取消加粗，降低视觉重量

  // 行/列/表头边框（统一浅灰细边框）
  rowBorder: borderConfig,
  columnBorder: borderConfig,
  headerRowBorder: borderConfig,

  // 可选：偶数行背景色（轻微区分，更清新）
  dataBackgroundColor: "#fefefe"
});
export const gridOptions: GridOptions<any> = {
  treeData: true,
  animateRows: true,
  tooltipShowMode: 'whenTruncated',
  suppressAggFuncInHeader: true,
  singleClickEdit: true,
  suppressClickEdit: false,
  suppressContextMenu: false,
  // autoSizeStrategy: {
  //       type: 'fitGridWidth',
  //       defaultMinWidth: 100,
  //      },
  groupDefaultExpanded: -1,
  suppressFieldDotNotation: true,
  // Keep group expand/collapse state when rowData updates after edits/saves.
  getRowId: params => String(params.data?.id ?? params.data?.path?.join('/') ?? ''),
  getDataPath: data => data.path,
  getContextMenuItems: () => ['copy', 'paste', 'separator', 'export'],
  defaultColDef: {
    resizable: true,
    sortable: false,
    filter: false,
    wrapHeaderText: true,
    autoHeaderHeight: true
  },
  defaultColGroupDef: {
    wrapHeaderText: true,
    autoHeaderHeight: true
  }
}