import type {
  IPublicTypeComponentMetadata,
  IPublicTypeSnippet,
} from '@alilc/lowcode-types';
import type { TaskProgressMessages } from '../../src/components/task-progress';

const messageLabels: Record<Exclude<keyof TaskProgressMessages, 'showAll'>, string> = {
  title: '区域名称（辅助阅读）',
  refresh: '刷新',
  refreshing: '刷新中',
  retry: '重试',
  loading: '加载中',
  errorTitle: '加载失败标题',
  errorHint: '加载失败提示',
  stale: '旧数据标题',
  staleHint: '旧数据提示',
  partial: '部分异常标题',
  partialHint: '部分异常提示',
  denied: '无权限标题',
  deniedHint: '无权限提示',
  collapse: '收起',
  done: '已完成节点',
  current: '当前节点',
  upcoming: '后续节点',
  skipped: '已跳过节点',
  unknownNode: '未知节点',
  refreshDone: '刷新完成播报',
};

const TaskProgressMeta: IPublicTypeComponentMetadata = {
  componentName: 'TaskProgress',
  title: '任务进度',
  category: '数据展示',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: '@pisell/private-materials',
    version: '6.12.243',
    exportName: 'TaskProgress',
    main: 'src/index.ts',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        name: 'componentProps',
        title: {
          label: '整体 Props',
          tip: 'componentProps | 一次传入整个属性对象，同名字段优先于面板单项配置；包含函数或 Date 时使用变量绑定，未提供的字段沿用单项配置',
        },
        setter: [
          { componentName: 'JsonSetter' },
          { componentName: 'VariableSetter' },
        ],
      },
      {
        name: 'model',
        title: {
          label: '任务数据',
          tip: 'model | 标准任务模型 { orderId, title?, tasks, issues }；tasks 和 issues 必须为数组，未获取数据时传 null',
        },
        setter: [
          { componentName: 'JsonSetter' },
          { componentName: 'VariableSetter' },
        ],
        defaultValue: null,
      },
      {
        name: 'reference',
        title: {
          label: '凭证编号',
          tip: 'reference | 独立订单凭证，顶部显示 value，label 用于辅助阅读；切换订单时同步更新或清除',
        },
        setter: [
          {
            componentName: 'ObjectSetter',
            props: {
              config: {
                items: [
                  {
                    name: 'label',
                    title: '编号名称',
                    setter: [
                      { componentName: 'StringSetter' },
                      { componentName: 'VariableSetter' },
                    ],
                  },
                  {
                    name: 'value',
                    title: '编号内容',
                    setter: [
                      { componentName: 'StringSetter' },
                      { componentName: 'VariableSetter' },
                    ],
                  },
                ],
              },
            },
          },
          { componentName: 'JsonSetter' },
          { componentName: 'VariableSetter' },
        ],
      },
      {
        name: 'loading',
        title: {
          label: '加载中',
          tip: 'loading | 禁用刷新按钮并显示加载动画，已有任务继续展示',
        },
        setter: [
          { componentName: 'BoolSetter' },
          { componentName: 'VariableSetter' },
        ],
        defaultValue: false,
      },
      {
        name: 'error',
        title: {
          label: '加载失败',
          tip: 'error | 无数据时展示错误提示，有数据时标记为上次查询结果',
        },
        setter: [
          { componentName: 'BoolSetter' },
          { componentName: 'VariableSetter' },
        ],
        defaultValue: false,
      },
      {
        name: 'forbidden',
        title: {
          label: '无访问权限',
          tip: 'forbidden | 隐藏旧任务和凭证编号，优先显示无访问权限提示',
        },
        setter: [
          { componentName: 'BoolSetter' },
          { componentName: 'VariableSetter' },
        ],
        defaultValue: false,
      },
      {
        name: 'updatedAt',
        title: {
          label: '最近更新时间',
          tip: 'updatedAt | 绑定 Date 对象或 null，仅用于辅助阅读更新播报，不显示时间；不要传入日期字符串',
        },
        setter: 'VariableSetter',
        defaultValue: null,
      },
      {
        name: 'locale',
        title: {
          label: '语言',
          tip: 'locale | 以 en 开头使用英文，其余回退中文；任务名称和业务状态文案由 model 提供',
        },
        setter: [
          {
            componentName: 'SelectSetter',
            props: {
              options: [
                { title: '简体中文', value: 'zh-CN' },
                { title: 'English', value: 'en-US' },
              ],
            },
          },
          { componentName: 'VariableSetter' },
        ],
        defaultValue: 'zh-CN',
      },
      {
        name: 'messages',
        title: {
          label: '自定义文案',
          tip: 'messages | 按需覆盖公共交互文案，未配置的字段沿用当前语言；showAll 为接收剩余数量并返回文案的函数',
        },
        setter: [
          {
            componentName: 'ObjectSetter',
            props: {
              config: {
                items: [
                  ...Object.entries(messageLabels).map(([name, label]) => ({
                    name,
                    title: { label, tip: `messages.${name}` },
                    setter: [
                      { componentName: 'StringSetter' },
                      { componentName: 'VariableSetter' },
                    ],
                  })),
                  {
                    name: 'showAll',
                    title: {
                      label: '展开文案函数',
                      tip: 'messages.showAll | (remaining: number) => string，返回查看其余任务的按钮文案',
                    },
                    setter: [
                      { componentName: 'FunctionSetter' },
                      { componentName: 'VariableSetter' },
                    ],
                  },
                ],
              },
            },
          },
          { componentName: 'VariableSetter' },
        ],
      },
      {
        name: 'initialVisible',
        title: {
          label: '首屏任务数',
          tip: 'initialVisible | 默认显示的任务数量，多余任务可展开；至少为 1，小数向下取整',
        },
        setter: [
          {
            componentName: 'NumberSetter',
            props: { min: 1, step: 1, precision: 0 },
          },
          { componentName: 'VariableSetter' },
        ],
        defaultValue: 2,
      },
      {
        name: 'motion',
        title: {
          label: '动画效果',
          tip: 'motion | auto 启用动画并遵循系统降动效偏好，off 关闭光晕和刷新动画',
        },
        setter: [
          {
            componentName: 'SelectSetter',
            props: {
              options: [
                { title: '自动', value: 'auto' },
                { title: '关闭', value: 'off' },
              ],
            },
          },
          { componentName: 'VariableSetter' },
        ],
        defaultValue: 'auto',
      },
      {
        name: 'className',
        title: { label: '自定义类名', tip: 'className | 追加到组件根节点的类名' },
        setter: [
          { componentName: 'StringSetter' },
          { componentName: 'VariableSetter' },
        ],
      },
      {
        name: 'style',
        title: {
          label: '自定义样式',
          tip: 'style | 支持行内样式和 --tp-* CSS 变量，如 { "--tp-accent": "#b33f38" }',
        },
        setter: [
          { componentName: 'JsonSetter' },
          { componentName: 'VariableSetter' },
        ],
      },
      {
        name: 'onRefresh',
        title: {
          label: '刷新回调',
          tip: 'onRefresh | 点击刷新时调用，由页面发起查询并更新 model、loading 等状态',
        },
        setter: [
          { componentName: 'FunctionSetter' },
          { componentName: 'VariableSetter' },
        ],
      },
    ],
    supports: {
      style: true,
      className: true,
      events: [
        {
          name: 'onRefresh',
          description: '重新查询任务，并更新 model、loading、error、forbidden 和 updatedAt。',
        },
      ],
    },
    component: {
      isContainer: false,
    },
  },
};

const snippets: IPublicTypeSnippet[] = [
  {
    title: '任务进度',
    screenshot: '',
    schema: {
      componentName: 'TaskProgress',
      props: {
        // 本地展示数据；接入页面时替换为真实订单的标准任务模型。
        model: {
          orderId: 'demo-order',
          title: '任务进度',
          issues: [],
          tasks: [
            {
              id: 'demo-task-1',
              title: '示例服务项目 1',
              subtitle: '标准规格',
              quantity: '1',
              remark: { label: '备注', value: '按约定方式处理' },
              validity: 'active',
              status: { label: '处理中', tone: 'active' },
              nodes: [
                { id: 'queued', label: '待处理', state: 'done' },
                { id: 'processing', label: '处理中', state: 'current' },
                { id: 'ready', label: '待确认', state: 'upcoming' },
                { id: 'completed', label: '已完成', state: 'upcoming' },
              ],
              fields: [{ label: '服务位置', value: '服务区 A', emphasis: 'primary' }],
            },
            {
              id: 'demo-task-2',
              title: '示例服务项目 2',
              quantity: '2',
              validity: 'active',
              status: { label: '待确认', tone: 'ready' },
              nodes: [
                { id: 'queued', label: '待处理', state: 'done' },
                { id: 'processing', label: '处理中', state: 'done' },
                { id: 'ready', label: '待确认', state: 'current' },
                { id: 'completed', label: '已完成', state: 'upcoming' },
              ],
              notice: '请确认此项目的服务结果。',
            },
            {
              id: 'demo-task-3',
              title: '示例服务项目 3',
              quantity: '1',
              validity: 'active',
              status: { label: '已完成', tone: 'complete' },
              nodes: [
                { id: 'queued', label: '待处理', state: 'done' },
                { id: 'processing', label: '处理中', state: 'done' },
                { id: 'ready', label: '待确认', state: 'done' },
                { id: 'completed', label: '已完成', state: 'done' },
              ],
            },
          ],
        },
        reference: { label: '凭证编号', value: 'A016' },
        loading: false,
        error: false,
        forbidden: false,
        updatedAt: null,
        locale: 'zh-CN',
        initialVisible: 2,
        motion: 'auto',
        onRefresh: {
          type: 'JSFunction',
          value: 'function onRefresh() {}',
        },
      },
    },
  },
];

export default {
  ...TaskProgressMeta,
  snippets,
};