import "@/assets/icons/iconfont/iconfont.js";
import "@/assets/icons/iconfont/iconfont.css";
import RenDeptTree from "@/components/ren-dept-tree";
import RenProcessDetail from "@/components/ren-process-detail";
import RenProcessRunning from "@/components/ren-process-running";
import RenRadioGroup from "@/components/ren-radio-group";
import RenRegionTree from "@/components/ren-region-tree";
import RenParentNodeTree from "@/components/ren-parent-node-tree";
import RenSelect from "@/components/ren-select";
import GetPositionByMap from "@/components/map";
import Upload from "@/components/upload";
import ListPageSlot from "@/components/layout/index";
import DotStatus from "@/components/dot-status";
import SplitPane from "@/components/split-pane/index";
import KeyValueList from "@/components/key-value-list/index";
import SelectLoadMore from "@/directive/select-load-more";
import BatchAddForSetting from "@/components/batch-add-for-setting.vue";
import ElementPlus, { ElMessageBoxShortcutMethod, Message } from "element-plus";
import "element-plus/theme-chalk/display.css";
import "element-plus/dist/index.css";
import "animate.css";

import Sortable from "sortablejs";
import "vite-plugin-svg-icons/register";
import { createApp } from "vue";
import { Store } from "vuex";
import VXETable from "vxe-table";
import "vxe-table/lib/style.css";
import "xe-utils";
import App from "./App.vue";
import { initI18n } from "./i18n";
import { IObject } from "./types/interface";
import router from "./router";
import store from "./store";
import * as ElementPlusIcons from "@element-plus/icons-vue";
// 如果只想导入css变量
import "element-plus/theme-chalk/dark/css-vars.css";
// 应用全局样式加载
import "@/styles/index.less";

//bug:https://www.zhihu.com/question/437009843
declare module "@vue/runtime-core" {
  interface ComponentCustomProperties {
    /**
     * vuex存储库
     */
    $store: Store<IObject>;
    /**
     * ref引用
     */
    $refs: any;
    /**
     * element-plus消息方法
     */
    $message: Message;
    /**
     * element-plus弹窗确认
     */
    $confirm: ElMessageBoxShortcutMethod;
    /**
     * element-plus弹窗
     */
    $alert: ElMessageBoxShortcutMethod;
    /**
     * vue3 v-model绑定默认字段名称
     */
    modelValue: any;
    /**
     * sortablejs组件
     */
    sortable: Sortable;
  }
}
VXETable.setup({
  zIndex: 3000,
  select: {
    transfer: true
  }
});

import dateService from "@/service/dateService";
import utilService from "@/service/utilService";
import moment from "moment";
const install = (app: IObject) => {
  app.config.globalProperties.$date = new dateService();
  app.config.globalProperties.$util = utilService;
  app.config.globalProperties.$m = moment;
};

const app = createApp(App);

// elm icon图标
Object.keys(ElementPlusIcons).forEach((iconName) => {
  app.component(iconName, ElementPlusIcons[iconName as keyof typeof ElementPlusIcons]);
});

app.directive("select-load-more", SelectLoadMore);

app.component("BatchAddForSetting", BatchAddForSetting);

app
  .use(store)
  .use(router)
  .use(RenRadioGroup)
  .use(RenSelect)
  .use(RenDeptTree)
  .use(Upload)
  .use(RenRegionTree)
  .use(RenParentNodeTree)
  .use(RenProcessRunning)
  .use(RenProcessDetail)
  .use(GetPositionByMap)
  .use(ListPageSlot)
  .use(DotStatus)
  .use(SplitPane)
  .use(KeyValueList)
  .use(ElementPlus, { size: "default" })
  .use(VXETable)
  .use(initI18n)
  .use(install)
  .mount("#app");