/**
 * @name 任务工单
 * 采购管理 · 业管发起端
 */

import React, { useMemo } from 'react';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/locale/zh_CN';
import {
  type AnnotationSourceDocument,
  type AnnotationViewerOptions
} from '@axhub/annotation';
import { PrototypeAnnotationHost } from '../../common/prototype-annotation-host';
import 'antd/dist/reset.css';
import '../vehicle-management/style.css';
import './styles/index.css';
import TaskWorkOrderPage from './TaskWorkOrderPage.jsx';
import annotationSourceDocument from './annotation-source.json';

const vmTheme = {
  token: {
    colorPrimary: '#32a06e',
    colorLink: '#32a06e',
    colorLinkHover: '#3fb87c',
    borderRadius: 8,
    fontFamily:
      'Inter, -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif',
    fontSize: 14,
    colorText: '#18181b',
    colorTextSecondary: '#52525b',
    colorBorder: '#e5e7eb',
    colorBgContainer: '#ffffff',
  },
  components: {
    Table: {
      headerBg: '#f6f7f7',
      headerColor: '#71717a',
      rowHoverBg: '#f6f7f7',
      borderColor: '#e5e7eb',
      cellPaddingBlock: 6,
      cellPaddingInline: 10,
    },
    Button: { controlHeight: 32, fontWeight: 500 },
    Input: { controlHeight: 32 },
    Select: { controlHeight: 32 },
  },
};

export default function TaskWorkOrderApp() {
  const annotationOptions = useMemo<AnnotationViewerOptions>(
    () => ({
      showToolbar: true,
      showThemeToggle: true,
      showColorFilter: true,
      emptyWhenNoData: false,
      toolbarEdge: 'right',
      currentPageId: 'list',
    }),
    [],
  );

  return (
    <ConfigProvider theme={vmTheme} locale={zhCN}>
      <TaskWorkOrderPage />
      <PrototypeAnnotationHost
        source={annotationSourceDocument as AnnotationSourceDocument}
        options={annotationOptions}
      />
    </ConfigProvider>
  );
}
