@maketribe/ms-app 3.0.0 → 3.0.1

package/src/layouts/manager-system/components/header/nav/nav.tsx

@@ -1,100 +0,0 @@
-import { ElDropdown, ElDropdownItem } from "element-plus";
-import { MKSvgIcon } from "@maketribe/dm-ui";
-import { Fragment, computed, defineComponent, unref } from "vue";
-import { MKHeaderTools } from "../tools";
-import { MKHeaderBreadcrumb } from "../breadcrumb";
-import { useRouter } from "vue-router";
-import { MSAppClient } from "../../../../../MSAppClient";
-
-type UserDropdownItem = { title: string; icon: string; callback: () => any };
-
-export default defineComponent({
-  name: "MKHeaderNav",
-  setup() {
-    const vueRouter = useRouter();
-
-    const msAppClient = MSAppClient.instance!;
-    const userSession = msAppClient.userSession!;
-
-    const userInfo = computed(() => userSession.userInfo);
-
-    const dropdownItems: UserDropdownItem[] = [
-      // {
-      //   title: "个人中心",
-      //   icon: "User",
-      //   callback: () => {
-      //     vueRouter.push({ name: "profile" });
-      //   },
-      // },
-      {
-        title: "退出登陆",
-        icon: "SwitchButton",
-        callback: () => {
-          msAppClient.logout();
-          vueRouter.push({ name: "login" });
-        },
-      },
-    ];
-
-    const isCollapse = computed({
-      get: () => userSession.menu.isCollapsed,
-      set: (v) => (userSession.menu.isCollapsed = v),
-    });
-
-    const handleToggleMenu = () => {
-      isCollapse.value = !isCollapse.value;
-    };
-
-    const handleCommand = (command: UserDropdownItem) => {
-      command.callback();
-    };
-
-    return () => {
-      const _userInfo = unref(userInfo);
-
-      const userDropdown = _userInfo ? (
-        <ElDropdown
-          class="mk-header-nav__user"
-          onCommand={handleCommand}
-          v-slots={{
-            dropdown: () => {
-              const items = dropdownItems.map((item) => (
-                <ElDropdownItem command={item}>
-                  <MKSvgIcon iconClass={item.icon} /> {item.title}
-                </ElDropdownItem>
-              ));
-
-              return <Fragment>{items}</Fragment>;
-            },
-          }}
-        >
-          <span class="mk-header-nav__user-info">
-            {_userInfo.nickName}
-            <MKSvgIcon class="mk-header-nav__arrow" iconClass="ArrowDownBold" />
-          </span>
-        </ElDropdown>
-      ) : null;
-
-      const asideFolld = unref(isCollapse) ? (
-        <MKSvgIcon iconClass="Expand" />
-      ) : (
-        <MKSvgIcon iconClass="Fold" />
-      );
-
-      return (
-        <div class="mk-header-nav">
-          <div class="mk-header-nav__main">
-            <span class="mk-header-nav__aside-fold" onClick={handleToggleMenu}>
-              {asideFolld}
-            </span>
-            <MKHeaderBreadcrumb />
-          </div>
-          <div class="mk-header-nav__tools">
-            <MKHeaderTools />
-            {userDropdown}
-          </div>
-        </div>
-      );
-    };
-  },
-});

package/src/layouts/manager-system/components/header/tabs/index.ts

@@ -1,5 +0,0 @@
-import HeaderTabs from "./tabs";
-
-export const MKHeaderTabs = HeaderTabs;
-
-export default MKHeaderTabs;

package/src/layouts/manager-system/components/header/tabs/tabs.tsx

@@ -1,72 +0,0 @@
-import { Fragment, Ref, computed, defineComponent, ref, unref } from "vue";
-import { ElTabPane, ElTabs, TabPaneName } from "element-plus";
-import { MKSvgIcon } from "@maketribe/dm-ui";
-import { MSAppClient } from "../../../../../MSAppClient";
-import { Tab } from "../../../../../tabs";
-
-export default defineComponent({
-  name: "MKHeaderTabs",
-  setup() {
-    const userSession = MSAppClient.instance!.userSession!;
-    const tabs = userSession.tabs;
-    const router = userSession.router;
-
-    const currentTab = ref(tabs.getCurrentTab()) as Ref<Tab | null>;
-    const tabList = ref(tabs.getTabs()) as unknown as Ref<Tab[]>;
-
-    const allowClose = computed(() => unref(tabList).length > 1);
-
-    tabs.tabsChangeEvent.on(({ tabs }) => {
-      tabList.value = tabs;
-    });
-
-    tabs.currentTabChangeEvent.on(({ currentTab: current }) => {
-      currentTab.value = current;
-    });
-
-    const handleCloseTab = (id: TabPaneName) => {
-      const tab = tabs.findTabByID(`${id}`);
-
-      if (tab) {
-        tabs.closeTab(tab);
-      }
-    };
-
-    const handleTabItemSelect = (id: TabPaneName) => {
-      const tab = tabs.findTabByID(`${id}`);
-
-      if (tab) {
-        router.changeRoute(tab.realRoute);
-      }
-    };
-
-    return () => {
-      const tabPanes = unref(tabList).map((tab) => (
-        <ElTabPane
-          name={tab.id}
-          v-slots={{
-            label: () => (
-              <Fragment>
-                <MKSvgIcon iconClass={tab.route.iconName} />
-                {tab.title}
-              </Fragment>
-            ),
-          }}
-        />
-      ));
-
-      return (
-        <div class="mk-header-tabs">
-          <ElTabs
-            modelValue={unref(currentTab)?.id ?? ""}
-            onTabChange={handleTabItemSelect}
-            onTabRemove={handleCloseTab}
-            closable={unref(allowClose)}
-          >
-            {tabPanes}
-          </ElTabs>
-        </div>
-      );
-    };
-  },
-});

package/src/layouts/manager-system/components/header/tools/index.ts

@@ -1,5 +0,0 @@
-import HeaderTools from "./tools";
-
-export const MKHeaderTools = HeaderTools;
-
-export default MKHeaderTools;

package/src/layouts/manager-system/components/header/tools/tools.tsx

@@ -1,15 +0,0 @@
-import { MKSvgIcon } from "@maketribe/dm-ui";
-import { defineComponent } from "vue";
-
-export default defineComponent({
-  name: "MKHeaderTools",
-  setup() {
-    return () => {
-      return (
-        <div class="mk-header-tools">
-          {/* <MKSvgIcon class="mk-header-tools__item" iconClass="Refresh" /> */}
-        </div>
-      );
-    };
-  },
-});

package/src/layouts/manager-system/index.ts

@@ -1,6 +0,0 @@
-import { withInstall } from "@maketribe/utils";
-import ManagerSystem from "./manager-system";
-
-export const MKManagerSystem = withInstall(ManagerSystem);
-
-export default MKManagerSystem;

package/src/layouts/manager-system/manager-system.tsx

@@ -1,25 +0,0 @@
-import { defineComponent } from "vue";
-import { MKSystemProvider } from "../../components";
-import MKAside from "./components/aside";
-import MKHeader from "./components/header";
-
-export default defineComponent({
-  name: "MKManagerSystem",
-  setup(props, { slots }) {
-    return () => {
-      return (
-        <MKSystemProvider>
-          <div class="mk-manager-system">
-            <div class="mk-manager-system__aside">
-              <MKAside />
-            </div>
-            <div class="mk-manager-system__main">
-              <MKHeader class="mk-manager-system__header" />
-              <div class="mk-manager-system__content">{slots.default?.()}</div>
-            </div>
-          </div>
-        </MKSystemProvider>
-      );
-    };
-  },
-});

package/src/menu/Menu.ts

@@ -1,142 +0,0 @@
-import { Disposable, Event } from "@maketribe/utils";
-import { PermissionPointManager } from "../PermissionPointManager";
-import { Router } from "../Router";
-import { MenuResult } from "../dataview";
-import { MenuNode } from "./MenuNode";
-
-export class Menu extends Disposable {
-  rootMenus: MenuNode[] = [];
-
-  _currentMenu: MenuNode | null = null;
-
-  isCollapsed: boolean = false;
-
-  permissionPointManager: PermissionPointManager;
-
-  router: Router;
-
-  currentMenuChangeEvent: Event<{ currentMenu: MenuNode | null }> =
-    this.register(new Event());
-
-  constructor(permissionPointManager: PermissionPointManager, router: Router) {
-    super();
-    this.permissionPointManager = permissionPointManager;
-    this.router = router;
-  }
-
-  setMenus(menus: MenuResult[]) {
-    const menuNodes = menus
-      .sort((menu1, menu2) => {
-        const sort1 = parseInt(menu1.sort) || 0;
-        const sort2 = parseInt(menu2.sort) || 0;
-
-        return sort2 - sort1;
-      })
-      .map((menuInfo) => {
-        const route = this.router.getRouteByID(menuInfo.routeId);
-
-        const permissionPoints =
-          this.permissionPointManager.getPermissionPointsByMenuID(menuInfo.id);
-
-        return new MenuNode({
-          id: menuInfo.id,
-          route,
-          iconName: menuInfo.iconName || "",
-          title: menuInfo.title || "",
-          permissionPoints,
-          children: [],
-        });
-      });
-
-    const rootMenuNodes: MenuNode[] = [];
-
-    for (let i = 0, len = menuNodes.length; i < len; i++) {
-      const menuNodeInfo = menus[i];
-      const menuNode = menuNodes[i];
-
-      menuNode.iconName = menuNode.iconName || "default-menu";
-
-      if (!menuNodeInfo.pid) {
-        rootMenuNodes.push(menuNode);
-      }
-
-      for (const route of this.router.getRoutesByMenuID(menuNode.id)) {
-        route.iconName = route.iconName || menuNode.iconName;
-      }
-
-      for (let j = 0; j < len; j++) {
-        const menuNodeInfoInner = menus[j];
-        const menuNodeInner = menuNodes[j];
-
-        if (menuNodeInfoInner.pid === menuNodeInfo.id) {
-          menuNode.children.push(menuNodeInner);
-          menuNodeInner.parent = menuNode;
-        }
-      }
-    }
-
-    this.rootMenus = rootMenuNodes;
-  }
-
-  findMenuNodeByID(id: MenuNode["id"]): MenuNode | null {
-    if (!id) {
-      return null;
-    }
-
-    let list = this.rootMenus.slice();
-
-    for (let i = 0; i < list.length; i++) {
-      const node = list[i];
-
-      if (node.id === id) {
-        return node;
-      }
-
-      list = list.concat(node.children);
-    }
-
-    return null;
-  }
-
-  async setCurrentMenuNode(node: MenuNode | null) {
-    this._currentMenu = node;
-
-    this.isCollapsed = false;
-
-    this.currentMenuChangeEvent.emit({ currentMenu: node });
-
-    return true;
-  }
-
-  getCurrentMenuNode() {
-    return this._currentMenu;
-  }
-
-  getFirstLeafMenuNode(menus: MenuNode[] = this.rootMenus) {
-    function _getFirstLeafMenuNode(menus: MenuNode[]): MenuNode | null {
-      if (!menus.length) {
-        return null;
-      }
-
-      return _getFirstLeafMenuNode(menus[0].children) || menus[0];
-    }
-
-    return _getFirstLeafMenuNode(menus);
-  }
-
-  getMenuNodeByID(id: string): MenuNode | null {
-    let nodes = this.rootMenus.slice();
-
-    for (let i = 0; i < nodes.length; i++) {
-      const node = nodes[i];
-
-      if (node.id === id) {
-        return node;
-      }
-
-      nodes = nodes.concat(node.children);
-    }
-
-    return null;
-  }
-}

package/src/menu/MenuNode.ts

@@ -1,49 +0,0 @@
-import { PermissionPoint } from "../PermissionPointManager";
-import { Route } from "../dataview";
-
-interface MenuNodeOptions {
-  id: string;
-  route?: Route | null;
-  iconName: string;
-  title: string;
-  permissionPoints: PermissionPoint[];
-  children: MenuNode[];
-  parent?: MenuNode | null;
-}
-
-export class MenuNode {
-  id: string;
-
-  iconName: string;
-  title: string;
-  permissionPoints: PermissionPoint[];
-  route: Route | null;
-  children: MenuNode[];
-  parent: MenuNode | null;
-
-  constructor(options: MenuNodeOptions) {
-    const { id, children, route, iconName, title, permissionPoints } = options;
-
-    this.id = id;
-    this.route = route ?? null;
-    this.iconName = iconName;
-    this.title = title;
-    this.children = children;
-    this.parent = options.parent ?? null;
-    this.permissionPoints = permissionPoints;
-  }
-
-  getMenuNodePath(): MenuNode[] {
-    const path: MenuNode[] = [];
-
-    let menuNode: MenuNode | null = this;
-
-    while (menuNode) {
-      path.unshift(menuNode);
-
-      menuNode = menuNode.parent;
-    }
-
-    return path;
-  }
-}

package/src/menu/index.ts

@@ -1,2 +0,0 @@
-export * from "./Menu";
-export * from "./MenuNode";

package/src/page/index/dv/default/add.vue

@@ -1,49 +0,0 @@
-<template>
-  <MKDataFormPage
-    :data-form="dataForm"
-    @submitted="handleCancel"
-    @cancel="handleCancel"
-    @error="handleError"
-  />
-</template>
-
-<script setup lang="ts">
-import { unref, computed, watch, Ref, reactive } from "vue";
-import { useRouter } from "vue-router";
-import { ElMessage } from "element-plus";
-import { DataForm, DataModelCache } from "@maketribe/dm";
-import { useCurrentTab } from "../../../../composables/use-current-tab";
-
-const router = useRouter();
-
-const dataForm: Ref<DataForm | null> = computed(() => {
-  const dataForm = DataModelCache.instance.getDataForm(
-    unref(router.currentRoute).meta.name as string
-  );
-
-  return dataForm ? (reactive(dataForm) as DataForm) : null;
-});
-
-const currentTab = useCurrentTab();
-
-const handleError = (response: any) => {
-  ElMessage.error({ message: response.data.msg || "网络异常" });
-};
-
-const handleCancel = async () => {
-  await router.push({ name: `${unref(router.currentRoute).meta.name}/list` });
-  currentTab!.close();
-};
-
-watch(
-  dataForm,
-  (dataForm) => {
-    if (!dataForm) {
-      return;
-    }
-
-    unref(dataForm)?.addRecord();
-  },
-  { immediate: true }
-);
-</script>

package/src/page/index/dv/default/edit.vue

@@ -1,55 +0,0 @@
-<template>
-  <MKDataFormPage
-    :data-form="dataForm"
-    @submitted="handleCancel"
-    @cancel="handleCancel"
-    @error="handleError"
-  />
-</template>
-
-<script setup lang="ts">
-import { unref, computed, watch, Ref, reactive } from "vue";
-import { useRouter } from "vue-router";
-import { ElMessage } from "element-plus";
-import { DataForm, DataModelCache } from "@maketribe/dm";
-import { useCurrentTab } from "../../../../composables/use-current-tab";
-
-const router = useRouter();
-
-const id = computed(() => unref(router.currentRoute).params.id as string);
-
-const dataForm: Ref<DataForm | null> = computed(() => {
-  const dataForm = DataModelCache.instance.getDataForm(
-    unref(router.currentRoute).meta.name as string
-  );
-
-  return dataForm ? (reactive(dataForm) as DataForm) : null;
-});
-
-const currentTab = useCurrentTab();
-
-const handleError = (response: any) => {
-  ElMessage.error({ message: response.data.msg || "网络异常" });
-};
-
-const handleCancel = async () => {
-  await router.push({ name: `${unref(router.currentRoute).meta.name}/list` });
-  currentTab!.close();
-};
-
-watch(
-  dataForm,
-  (dataForm) => {
-    if (!dataForm) {
-      return;
-    }
-
-    if (!unref(id)) {
-      return;
-    }
-
-    unref(dataForm)?.editRecord(unref(id));
-  },
-  { immediate: true }
-);
-</script>

package/src/page/index/dv/default/index.vue

@@ -1,56 +0,0 @@
-<template>
-  <MKDataTablePage :data-table="dataTable" />
-</template>
-<script setup lang="ts">
-import { unref, computed, reactive, watch } from "vue";
-import { useRouter } from "vue-router";
-import { Disposable } from "@maketribe/utils";
-import { DataModelCache, DataTable } from "@maketribe/dm";
-
-const router = useRouter();
-
-const props = defineProps({
-  dataTable: { type: DataTable<any> },
-});
-
-const dataTable = computed(() => {
-  const dataTable =
-    props.dataTable ||
-    DataModelCache.instance.getDataTable(
-      unref(router.currentRoute).meta.name as string
-    );
-
-  return dataTable ? (reactive(dataTable) as DataTable) : null;
-});
-
-watch(
-  dataTable,
-  (dataTable, _, onCleanup) => {
-    if (!dataTable) {
-      return;
-    }
-
-    const disposable = new Disposable();
-
-    disposable.register(
-      dataTable.addRecordEvent.on(() => {
-        router.push({ name: `${unref(dataTable).name}/add` });
-      })
-    );
-
-    disposable.register(
-      dataTable.editRecordEvent.on(({ item }) => {
-        router.push({
-          name: `${unref(dataTable).name}/edit`,
-          params: { id: item[unref(dataTable)?.primaryKey as string] },
-        });
-      })
-    );
-
-    onCleanup(() => {
-      disposable.dispose();
-    });
-  },
-  { immediate: true }
-);
-</script>

package/src/page/index/dv/default/tree.vue

@@ -1,31 +0,0 @@
-<template>
-  <MKDataTreePage
-    :data-table="dataTable"
-    :data-form="dataForm"
-    :props="{ label: 'name', children: 'children' }"
-  />
-</template>
-
-<script setup lang="ts">
-import { computed, reactive, unref } from "vue";
-import { useRouter } from "vue-router";
-import { DataForm, DataModelCache, DataTable } from "@maketribe/dm";
-
-const router = useRouter();
-
-const dataTable = computed(() => {
-  const dataTable = DataModelCache.instance.getDataTable(
-    unref(router.currentRoute).meta.name as string
-  );
-
-  return dataTable ? (reactive(dataTable) as DataTable) : null;
-});
-
-const dataForm = computed(() => {
-  const dataForm = DataModelCache.instance.getDataForm(
-    unref(router.currentRoute).meta.name as string
-  );
-
-  return dataForm ? (reactive(dataForm) as DataForm) : null;
-});
-</script>

package/src/page/index/dv/ms-member/index.vue

@@ -1,38 +0,0 @@
-<template>
-  <DefaultListPage :data-table="memberTable" />
-
-  <ElDialog v-model="isShowActiveMemberForm" class="dialogClass">
-    <MKDataForm :data-form="activeMemberForm" />
-    <template #footer>
-      <ElButton @click="handleActiveMemberConfirm" type="primary">
-        确定
-      </ElButton>
-    </template>
-  </ElDialog>
-</template>
-
-<script setup lang="ts">
-import { computed, reactive, ref } from "vue";
-import { ElButton, ElDialog } from "element-plus";
-import { DataModelCache } from "@maketribe/dm";
-import DefaultListPage from "../default/index.vue";
-import { MemberTable } from "../../../../dataview";
-
-const isShowActiveMemberForm = ref(false);
-
-const memberTable = reactive(
-  DataModelCache.instance.getDataTable("ms-member")!
-) as MemberTable;
-const activeMemberForm = computed(() => memberTable.activeMemberForm);
-
-memberTable.activeMemberEvent.on(async (member) => {
-  memberTable.activeMemberForm.getLoadingManager().startLoading();
-  await memberTable.activeMemberForm.editRecord(member.id);
-  memberTable.activeMemberForm.getLoadingManager().completeLoading();
-  isShowActiveMemberForm.value = true;
-});
-
-const handleActiveMemberConfirm = async () => {
-  memberTable.approveMember();
-};
-</script>

package/src/page/index/dv/ms-role/index.vue

@@ -1,28 +0,0 @@
-<template>
-  <DefaultListPage :data-table="roleTable" />
-
-  <ElDialog v-model="isShowDialog" appendToBody width="80%">
-    <MKRolePermissionConfig
-      :rolePermissionConfigTable="rolePermissionConfigTable"
-    />
-  </ElDialog>
-</template>
-<script setup lang="ts">
-import { reactive, ref } from "vue";
-import DefaultListPage from "../default/index.vue";
-import { RoleTable, RolePermissionConfigTable } from "../../../../dataview";
-import { MKRolePermissionConfig } from "../../../../components";
-
-const roleTable = reactive(new RoleTable()) as RoleTable;
-const rolePermissionConfigTable = reactive(
-  new RolePermissionConfigTable()
-) as RolePermissionConfigTable;
-
-const isShowDialog = ref(false);
-
-roleTable.configRolePermissionEvent.on(({ item }) => {
-  rolePermissionConfigTable.selectRolePermission(item.id);
-
-  isShowDialog.value = true;
-});
-</script>