import Vue from 'vue';

import {UIComponent} from './component';

import {componentForm} from './form';
import {componentSelect} from './select';
import {componentDatepicker} from './datepicker';
import {componentInput} from './input';
import {componentTable} from './table';
import {componentTableItem} from './table-item';
import {componentButton} from './button';
import {componentSideslip} from './sideslip';
import {componentPaging} from './paging';
import {componentSearch} from './search';
import {componentSearchItem} from './search-item';
import {componentTags} from './tags';
import {componentInputMobile} from './input-mobile';
import {componentImagePreview} from './image-preview';
import {componentRadio} from './radio';
import {componentTabs} from './tabs';
import {componentAppPayment} from './app-payment';
import {componentPopup} from './popup';
import {componentSwitch} from './switch';
import {componentArea} from './area';
import {componentPicker} from './picker';
import {componentModal} from './modal';
import {componentField} from './field';
import {componentPullRefresh} from './pull-refresh';
import {componentUpload} from './upload';
import {componentQrcode} from './qrcode';
import {componentAppMenus} from './app-menus';
import {componentAppSendcode} from './app-sendcode';
import {componentGrid} from './grid';
import {componentDForm} from './d-form';
import {componentDFormItem} from './d-form-item';
import {componentTimeline} from './timeline';
import {componentGuidance} from './guidance';
import {componentAppActivityMenus} from './activity-menus';
import {componentMallGoods} from './mall-goods';
import {componentMallOrder} from './mall-order';
import {Component as ComponentStepper} from './stepper';
import {Component as ComponentAppNotice } from './app-notice';
import { componentGoodsSku } from './goods-sku';
import { ComponentSwipeImage } from './swipe-image';
//**  通知 */
export class AppNotice extends ComponentAppNotice {}
//**  轮播图 */
export class SwipeImage extends ComponentSwipeImage {}
//**  步进器 */
export class Stepper extends ComponentStepper {}
//**  商品订单组件 */
export class MallOrder extends componentMallOrder {}
//**  商品展示组件 */
export class MallGoods extends componentMallGoods {}
//**  开关功能 */
export class Switch extends componentSwitch {}
//**  活动菜单 */
export class AppActivityMenus extends componentAppActivityMenus {}
//**  网格 */
export class Grid extends componentGrid {}
//**  左侧导航 */
export class Guidance extends componentGuidance {}
//**  时间线 */
export class Timeline extends componentTimeline {}
//**  新表单 */
export class DForm extends componentDForm {}
//**  新表单子组件 */
export class DFormItem extends componentDFormItem {}
//**  底部菜单 */
export class AppMenus extends componentAppMenus {}
//**  商城下单SKU */
export class GoodsSku extends componentGoodsSku {}
//**  发送验证码 */
export class AppSendcode extends componentAppSendcode {}
//**  开关功能 */
export class Qrcode extends componentQrcode {}
//**  新文本框 */
export class Field extends componentField {}
//**  弹窗 */
export class Modal extends componentModal {}
//** 表单组件 */
export class Form extends componentForm {}
//** 选择组件 */
export class Select extends componentSelect {}
//** 日期组件 */
export class Datepicker extends componentDatepicker {}
//** 文本输入框组件 */
export class Input extends componentInput {}
//** 表格组件 */
export class Table extends componentTable {}
//** 表格子组件 */
export class TableItem extends componentTableItem {}
//** 按钮组件 */
export class Button extends componentButton {}
//** 侧边栏导航组件 */
export class Sideslip extends componentSideslip {}
//** 分页组件 */
export class Paging extends componentPaging {}
//** 搜索控件 */
export class Search extends componentSearch {}
//** 搜索子控件 */
export class SearchItem extends componentSearchItem {}
//** 省市区组件 */
export class Area extends componentArea {}
//** 选择 */
export class Picker extends componentPicker {}

interface toastParams{
  /**
     * 数据绑定数组
     */
    message:string

    /**
     * 提示类型
     */
    type?:"info" | "success" | "warning" | "error"

    /**
     * 停留事件ms
     */
    duration?:number
    /**
     * 顶部距离--解决沉浸式导航
     */
    top?:number
}

interface dialogParams{
  /**
   * 标题
   */
  title?:string
  /**
   * 弹窗提示内容
   */
  content:string
  /**
   * 确定按钮文本
   */
  confirmText?:string
  /**
   * 取消按钮文本
   */
  cancelText?:string
}

interface constBase {
  install: (params?:any) => void
}

interface toastData extends constBase{
  show:(data:toastParams)=>void
}

interface DialogData extends constBase{
  alert:(data:dialogParams)=>Promise<any>
  confirm:(data:dialogParams)=>Promise<any>
}

interface LoaderData extends constBase{
  fade:(data?:{nonmask?:boolean,mini?:boolean})=>void
  hide:()=>void
}

export const Toast: toastData;

export const Dialog:DialogData;

export const Loadimg:constBase;
export const Spin:constBase;

export const Loader:LoaderData

/**
 * 标签组件
 */
export class Tag extends componentTags {}
/**
 * 图片预览组件
 */
export class ImagePreview extends componentImagePreview {}
/**
 * 手机区号选择组件
 */
export class InputMobile extends componentInputMobile {}
/**
 * 单选组件
 */
export class Radio extends componentRadio {}
/**
 * 标签选项
 */
export class Tabs extends componentTabs {}
/**
 * App 支付密码组件
 */
export class AppPayment extends componentAppPayment {}

/**
 * 弹出组件
 */
export class Popup extends componentPopup {}

/**
 * 弹出组件
 */
export class Upload extends componentUpload {}

/**
 * 弹出组件
 */
export class PullRefresh extends componentPullRefresh {}

export type Component = UIComponent;

declare const uiAPI: {
  version: string;
  install: (
      Vue: Vue,
      opts: {
        formData?: any
      }
  ) => void;  
};

declare module 'vue/types/vue' {
  interface Vue {
    dialog:{
        alert:(config:dialogParams) => Promise<any>,
        confirm:(config:dialogParams) => Promise<any>,
        hide:() => void
    }
    toast:(data:toastParams) => void
    loader:{
        fade:(data?:{nonmask?:boolean,mini?:boolean})=>void
        hide:()=>void
    }
  }
}
export default uiAPI;