// 标签打印的弹窗组件，属于业务组件
import React from 'react';
import Modal, { ModalProps } from '../../../components/Modal'
import { Renderer, RendererProps } from '../../../factory';
import { BaseSchema } from '../../../Schema';
import { getPrinters } from '../../../utils/print'
import { Api } from '../../../types';
import FilePrint from './components/FilePrint';
import LabelPrint from './components/LabelPrint';
import BillPrint from './components/BillPrint';
import FormPrint from './components/FormPrint';
import DetailPrint from './components/DetailPrint';
import { IColumn } from '../../../store/table';

// 将类型导出，命名需规范
export interface ModalPrintSchema extends BaseSchema {
  type: 'lion-print';
}

export interface ModalPrintProps extends Omit<ModalProps, 'className' | 'onHide'>, RendererProps, Omit<ModalPrintSchema, 'className'> {
  printType: 'label' | 'file' | 'bill' | 'report' | 'detail'
  defValAddApi: Api; // 新增模板
  defValDelApi: Api; // 删除模板
  defValGetApi: Api; // 获取模板
  defValEditApi: Api
  labelDataApi: Api; // 获取标签数据数组
  templateApi: Api; // 获取标签模板
  callbackApi: any; // 打印回调，发送打印时间
  numberField?: string[]; // 动态字段数组，numberField是与后端约定
  labelId?: string;
  classnames: (...args: any[]) => string;
  ctx: {
    items: Array<any>; // 选中的行数据
    rows: Array<any>; // 选中的行数据
    selectedItems: Array<any>; // 选中的行数据
    unSelectedItems: Array<any>; // 未选中的行数据
    ids: string; // 多个 id 值用英文逗号隔开的字符串，前提是行数据中有 id 字段，或者有指定的 primaryField 字段
    primaryField?: string; // CRUD 设置 ID 字段名
    [key: string]: any; // 第一行的所有行数据也会包含进去
  };
  onHide: (e?: any) => void; // modal关闭回调
  isRow?: boolean; // 是否行内按钮
  isSingleFilePrint?: boolean; // 是否文件控件的打印（单文件打印）
  query?: any;
  orderParam?: any
  columns: IColumn[]
  api?: Api
  [key: string]: any;
}

interface ModalPrintState {
  printers: string[]
  baseUrl: string
  modalContainer?: () => HTMLElement
  popupContainer?: () => HTMLElement
}

export class ModalPrint extends React.Component<ModalPrintProps, ModalPrintState>{

  superRole: boolean

  constructor(props: ModalPrintProps) {
    super(props)
    const modalContainer = props.env.getModalContainer
    const userInfo = sessionStorage.getItem('userInfo') ?? '{}'
    const userObj = userInfo && JSON.parse(userInfo)
    this.superRole = userObj.appRole ?? false
    this.state = {
      printers: getPrinters(),
      baseUrl: process.env.NODE_ENV === 'production' ? props.env.axiosInstance?.defaults?.baseURL : 'https://sasdev.sanfu.com/saas_dev',
      modalContainer,
      popupContainer: typeof (modalContainer) === 'function' ? () => modalContainer().querySelector<HTMLElement>('.print-form-container')! : undefined
    }
  }

  render() {
    const { printType, classnames: cx, show = false, size = "xs", env, className, ...otherProps } = this.props
    return (
      // 注意Modal的className不要被props.className覆盖掉
      <Modal className={cx('Modal-print', printType === 'label' && 'is-label')} size={size} show={show} container={env?.getModalContainer ? env.getModalContainer : undefined} {...otherProps}>
        {printType === 'label' && <LabelPrint {...this.props} {...this.state} superRole={this.superRole} />}
        {printType === 'file' && <FilePrint {...this.props} {...this.state} />}
        {printType === 'bill' && <BillPrint {...this.props} {...this.state} />}
        {printType === 'report' && <FormPrint {...this.props} {...this.state} superRole={this.superRole} />}
        {printType === 'detail' && <DetailPrint {...this.props} {...this.state} superRole={this.superRole} />}
      </Modal>
    )
  }
}
@Renderer({
  type: 'label-print'
})
export class ModalPrintRenderer extends ModalPrint { }