import { state } from '../../core/state';
import { openUserModal } from '../../components/Modal/UserModal';
import { formatInline } from '../../core/utils';
import { createListView } from './ListFactory';

export function renderUserList(container: HTMLElement) {
  createListView(container, {
    title: '사용자',
    dataSource: () => state.masterData.users || [],
    searchKeys: ['emp_no', 'user_name', 'dept_name', 'position', 'status'],
    filterOptions: {
      keywordLabel: '사번/이름/부서/직급 검색',
      showCorp: false,
      showDept: true,
      showType: false
    },
    onRowClick: (user) => openUserModal(user, 'view'),
    columns: [
      {
        header: '사번',
        sortKey: 'emp_no',
        align: 'center',
        width: '15%',
        render: u => formatInline(u.emp_no || '-')
      },
      {
        header: '이름',
        sortKey: 'user_name',
        align: 'center',
        width: '15%',
        render: u => formatInline(u.user_name || '-')
      },
      {
        header: '조직 (부서)',
        sortKey: 'dept_name',
        align: 'left',
        width: '25%',
        render: u => formatInline(u.dept_name || '-')
      },
      {
        header: '직급 (직무)',
        sortKey: 'position',
        align: 'left',
        width: '25%',
        render: u => formatInline(u.position || '-')
      },
      {
        header: '상태',
        sortKey: 'status',
        align: 'center',
        width: '10%',
        render: u => {
          const status = u.status || '재직';
          const badgeClass = status === '퇴직' ? 'badge-danger' : 'badge-success';
          return `<span class="badge ${badgeClass}">${status}</span>`;
        }
      }
    ]
  });
}