import { IndexViewController } from '@ibiz-template/controller';
import { useRouter } from '@ibiz-template/vue-util';
import Vue, { ref, watch } from 'vue';

export const getView2Value = (item: IParams) => {
  return item.params.view2
    ? (item.params.view2 ? `/${item.params.view2}` : '') +
        (item.params.params2 ? `/${item.params.params2}` : '')
    : '404';
};

export const getView1Value = (item: IParams) => {
  return (
    (item.params.view1 ? `/${item.params.view1}` : '') +
    (item.params.params1 ? `/${item.params.params1}` : '')
  );
};

export interface RouteMsg {
  key: string;
  fullPath: string;
  modelPath?: string;
  caption?: string;
}

export function useIndexRouteManage(
  proxy: Vue,
  controller: IndexViewController,
) {
  const router = useRouter(proxy);

  /** 当前的路由标识,只由二级路由组成,二级路由一致则就是同一个视图 */
  const currentKey = ref('');

  /** 留一份首页的Path */
  const indexPath = ref('');

  /** key操作记录,只维护当前缓存的key,且每个key在集合里唯一,最新操作的排在最前面 */
  const keyHistory = ref<string[]>([]);

  /** 路由信息,每个key对应的全路由和标题之类的信息 */
  const routeMsgs = ref<RouteMsg[]>([]);

  // 监听路由
  watch(
    () => proxy.$route,
    (newVal, oldVal) => {
      // 只处理有二级路由,只有首页的时候不需要
      if (newVal !== oldVal) {
        currentKey.value = getView2Value(newVal);
        indexPath.value = getView1Value(newVal);
        // 更新或新建对应key的全路由信息,主要是三级路由变更时会用
        const find = routeMsgs.value.find(
          item => item.key === currentKey.value,
        );
        if (find) {
          find.fullPath = newVal.fullPath;
        } else {
          routeMsgs.value.push({
            key: currentKey.value,
            fullPath: newVal.fullPath,
            modelPath: '',
            caption: '',
          });
        }
      }
    },
    { deep: true, immediate: true },
  );

  // 监听当前的key,维护数据
  watch(
    currentKey,
    (newVal, oldVal) => {
      if (newVal !== oldVal && newVal) {
        const index = keyHistory.value.indexOf(newVal);
        // 历史记录里没有的新建信息,放入开头
        if (index === -1) {
          keyHistory.value.unshift(newVal);
        } else {
          // 已存在的调整顺序至开头
          keyHistory.value.splice(index, 1);
          keyHistory.value.unshift(newVal);
        }
      }
    },
    { immediate: true },
  );

  /**
   * 更新路由信息
   *
   * @author lxm
   * @date 2022-09-01 16:09:51
   * @param {string} key
   * @param {IData} opts
   */
  const updateRouteMsg = (key: string, opts: Partial<RouteMsg>) => {
    const find = routeMsgs.value.find(item => item.key === currentKey.value);
    if (find) {
      if (opts.caption) find.caption = opts.caption;
      if (opts.modelPath) find.modelPath = opts.modelPath;
    }
  };

  /**
   * 删除路由缓存数据
   *
   * @author lxm
   * @date 2022-09-22 10:09:11
   * @param {string[]} keys 要删除的keys
   */
  const deleteRouteCache = (keys: string[]) => {
    keys.forEach(key => {
      const index = keyHistory.value.indexOf(key);
      if (index !== -1) {
        keyHistory.value.splice(index, 1);
        const msgIndex = routeMsgs.value.findIndex(item => item.key === key);
        routeMsgs.value.splice(msgIndex, 1);
      }
    });
  };

  /**
   * 关闭视图回调
   *
   * @author lxm
   * @date 2022-09-22 10:09:59
   * @param {string} [key=currentKey.value]
   */
  const closeView = (key: string = currentKey.value) => {
    // 找出删除的key在历史记录里的位置
    deleteRouteCache([key]);
    const toKey = keyHistory.value[0];
    if (!toKey) {
      if (controller.model.source.blankMode) {
        if (window.callback) {
          window.callback();
        }
        window.close();
      } else {
        currentKey.value = '';
        router.push(indexPath.value);
      }
    } else {
      const find = routeMsgs.value.find(item => item.key === toKey);
      router.push(find!.fullPath);
    }
  };

  return {
    currentKey,
    keyHistory,
    routeMsgs,
    updateRouteMsg,
    closeView,
    deleteRouteCache,
  };
}