create-pubinfo 2.0.0-beta.19 → 2.0.0-beta.20

package/templates/pubinfo-template/src/modules/rbac.ts

@@ -0,0 +1,52 @@
+import { rbac } from '@pubinfo/module-rbac';
+import '@pubinfo/module-rbac/style.css';
+
+export function setupRbac() {
+  return rbac({
+    pages: {
+      AuthorityManage: {
+        Resource: true,
+        Role: true,
+        RoleGroup: true,
+        DataPermission: true,
+        Organization: true,
+        User: true,
+        Tenant: import.meta.env.VITE_TENANT_ENABLED === 'true',
+      },
+
+      SystemManage: {
+        DictionaryPage: {
+          Dictionary: true,
+          DictionaryItem: true,
+        },
+        Position: true,
+        Region: true,
+        Group: true,
+      },
+
+      SettingManage: {
+        ThemeSetting: true,
+        LayoutSetting: true,
+        PageAnimationSetting: true,
+        PageSizeSetting: true,
+        MenuSetting: true,
+        TabbarSetting: true,
+        ToolbarSetting: true,
+        BreadcrumbSetting: true,
+        OtherSetting: true,
+      },
+
+      SafeManage: {
+        Blacklist: true,
+        Whitelist: true,
+        SafeSetting: true,
+        WatermarkSetting: true,
+      },
+
+      LogManage: {
+        LoginHistory: true,
+        OperateHistory: true,
+      },
+    },
+  });
+}

package/templates/pubinfo-template/src/routes/index.ts

@@ -0,0 +1,71 @@
+import Login from '@/views/system/login/index.vue';
+import { defineAsyncRoutes, defineSystemRoutes } from 'pubinfo';
+
+import breadcrumb from './modules/demo/breadcrumb.example';
+import Link from './modules/demo/link';
+import MultilevelMenuExample from './modules/demo/multilevel.menu.example';
+import OtherPage from './modules/demo/other.page';
+import Single from './modules/demo/single';
+
+/**
+ * ========================================================================
+ *                       动态路由（异步路由、导航栏路由）
+ *========================================================================*
+ */
+defineAsyncRoutes([
+  {
+    meta: {
+      title: '演示管理系统',
+      icon: 'workbench',
+    },
+    children: [
+      Single,
+      MultilevelMenuExample,
+      OtherPage,
+      Link,
+      breadcrumb,
+    ],
+  },
+  {
+    meta: {
+      title: '演示系统1',
+      icon: 'process-management',
+      isDev: true,
+    },
+  },
+]);
+
+/**
+ * ========================================================================
+ *                            系统路由（包含布局）
+ *========================================================================*
+ */
+defineSystemRoutes([
+  {
+    path: '/',
+    name: 'Home',
+    component: () => import('@/views/system/index.vue'),
+    meta: {
+      title: '首页',
+      icon: 'i-ant-design:home-twotone',
+      breadcrumb: false,
+    },
+  },
+]);
+
+/**
+ * ========================================================================
+ *                          固定路由（默认路由）
+ *========================================================================*
+ */
+export const constantRoutes = [
+  {
+    path: '/login',
+    name: 'Login',
+    component: Login,
+    meta: {
+      whiteList: true,
+      title: '登录',
+    },
+  },
+];

package/templates/pubinfo-template/src/routes/modules/demo/breadcrumb.example.ts

@@ -0,0 +1,62 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+const routes: RouteRecordRaw = {
+  path: '/breadcrumb_example',
+  redirect: '/breadcrumb_example/list1',
+  name: 'breadcrumbExample',
+  meta: {
+    title: '面包屑导航',
+    icon: 'i-solar-confetti-minimalistic-bold',
+  },
+  children: [
+    {
+      path: 'list1',
+      name: 'breadcrumbExampleList1',
+      component: () => import('@/views/demo/breadcrumb_example/list1.vue'),
+      meta: {
+        title: '列表1（平级模式）',
+      },
+    },
+    {
+      path: 'detail1',
+      name: 'breadcrumbExampleDetail1',
+      component: () => import('@/views/demo/breadcrumb_example/detail1.vue'),
+      meta: {
+        title: '详情1',
+        sidebar: false,
+        activeMenu: '/breadcrumb_example/list1',
+      },
+    },
+    {
+      path: 'list2',
+      name: 'breadcrumbExampleList2',
+      redirect: '/breadcrumb_example/demo/list2',
+      meta: {
+        title: '列表2（层级模式）',
+      },
+      children: [
+        {
+          path: '',
+          component: () => import('@/views/demo/breadcrumb_example/list2.vue'),
+          meta: {
+            title: '列表2（层级模式）',
+            sidebar: false,
+            breadcrumb: false,
+          },
+        },
+        {
+          path: 'detail2',
+          name: 'breadcrumbExampleDetail2',
+          component: () => import('@/views/demo/breadcrumb_example/detail2.vue'),
+          meta: {
+            title: '详情2',
+            sidebar: false,
+            activeMenu: '/breadcrumb_example/list2',
+          },
+        },
+      ],
+    },
+  ],
+};
+
+export default routes;

package/templates/pubinfo-template/src/routes/modules/demo/link.ts

@@ -0,0 +1,15 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+const routes: RouteRecordRaw = {
+  path: '/link',
+  name: 'Link',
+  redirect: '',
+  meta: {
+    title: '跳转路由',
+    singleMenu: true,
+    icon: 'i-solar-confetti-minimalistic-bold',
+    link: 'http://124.223.184.245:10000/docs/',
+  },
+};
+
+export default routes;

package/templates/pubinfo-template/src/routes/modules/demo/multilevel.menu.example.ts

@@ -0,0 +1,68 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+const routes: RouteRecordRaw = {
+  path: '/multilevel_menu_example',
+  redirect: '/multilevel_menu_example/page',
+  name: 'multilevelMenuExample',
+  meta: {
+    title: '多级导航',
+    icon: 'i-heroicons-solid:menu-alt-3',
+  },
+  children: [
+    {
+      path: 'page',
+      name: 'multilevelMenuExample1',
+      component: () => import('@/views/demo/multilevel_menu_example/page.vue'),
+      meta: {
+        title: '导航1',
+        icon: 'i-heroicons-solid:menu-alt-3',
+      },
+    },
+    {
+      path: 'level2',
+      name: 'multilevelMenuExample2',
+      redirect: '/multilevel_menu_example/level2/page',
+      meta: {
+        title: '导航2',
+      },
+      children: [
+        {
+          path: 'page',
+          name: 'multilevelMenuExample2-1',
+          component: () => import('@/views/demo/multilevel_menu_example/level2/page.vue'),
+          meta: {
+            title: '导航2-1',
+          },
+        },
+        {
+          path: 'level3',
+          name: 'multilevelMenuExample2-2',
+          redirect: '/multilevel_menu_example/level2/level3/page1',
+          meta: {
+            title: '导航2-2',
+          },
+          children: [
+            {
+              path: 'page1',
+              name: 'multilevelMenuExample2-2-1',
+              component: () => import('@/views/demo/multilevel_menu_example/level2/level3/page1.vue'),
+              meta: {
+                title: '导航2-2-1',
+              },
+            },
+            {
+              path: 'page2',
+              name: 'multilevelMenuExample2-2-2',
+              component: () => import('@/views/demo/multilevel_menu_example/level2/level3/page2.vue'),
+              meta: {
+                title: '导航2-2-2',
+              },
+            },
+          ],
+        },
+      ],
+    },
+  ],
+};
+
+export default routes;

package/templates/pubinfo-template/src/routes/modules/demo/other.page.ts

@@ -0,0 +1,37 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+const routes: RouteRecordRaw = {
+  path: '/other-page',
+  redirect: '/other-page/list',
+  name: 'OtherPage',
+  meta: {
+    title: '下探页面',
+    icon: 'i-solar-confetti-minimalistic-bold',
+  },
+  children: [
+    {
+      path: 'list',
+      name: 'OtherPageList',
+      component: () => import('@/views/demo/other_page/index.vue'),
+      meta: {
+        title: '列表页',
+        sidebar: false,
+        breadcrumb: false,
+        activeMenu: '/other-page',
+      },
+    },
+    {
+      path: 'detail',
+      name: 'OtherPageDetail',
+      component: () => import('@/views/demo/other_page/des.vue'),
+      meta: {
+        title: '详情页',
+        sidebar: false,
+        breadcrumb: true,
+        activeMenu: '/other-page',
+      },
+    },
+  ],
+};
+
+export default routes;

package/templates/pubinfo-template/src/routes/modules/demo/single.ts

@@ -0,0 +1,14 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+const routes: RouteRecordRaw = {
+  path: '/single',
+  component: () => import('@/views/demo/single/index.vue'),
+  name: 'Single',
+  meta: {
+    title: '单页面路由',
+    singleMenu: true,
+    icon: 'i-solar-confetti-minimalistic-bold',
+  },
+};
+
+export default routes;

package/templates/pubinfo-template/src/settings.ts

@@ -0,0 +1,8 @@
+import { defineSettings } from 'pubinfo';
+
+export default defineSettings({
+  // 请在此处编写或粘贴配置代码
+  app: {
+    storagePrefix: 'wsy_rbac',
+  },
+});

package/templates/pubinfo-template/src/stores/index.ts

@@ -0,0 +1,2 @@
+export * from './modules/conter';
+export { useUserStore } from 'pubinfo';

package/templates/pubinfo-template/src/stores/modules/conter.ts

@@ -0,0 +1,16 @@
+import { defineStore } from 'pinia';
+import { computed, ref } from 'vue';
+
+export const useCounterStore = defineStore('counter', () => {
+  const count = ref(0);
+  const doubleCount = computed(() => count.value * 2);
+  function increment() {
+    count.value++;
+  }
+
+  return {
+    count,
+    doubleCount,
+    increment,
+  };
+});

package/templates/pubinfo-template/src/views/demo/breadcrumb_example/detail1.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <div>
+    <PageMain>
+      注意看面包屑导航的变化
+    </PageMain>
+  </div>
+</template>

package/templates/pubinfo-template/src/views/demo/breadcrumb_example/detail2.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <div>
+    <PageMain>
+      注意看面包屑导航的变化
+    </PageMain>
+  </div>
+</template>

package/templates/pubinfo-template/src/views/demo/breadcrumb_example/list1.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <PageMain>
+    <RouterLink :to="{ name: 'breadcrumbExampleDetail1' }">
+      查看详情页
+    </RouterLink>
+  </PageMain>
+</template>

package/templates/pubinfo-template/src/views/demo/breadcrumb_example/list2.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <PageMain>
+    <RouterLink :to="{ name: 'breadcrumbExampleDetail2' }">
+      查看详情页
+    </RouterLink>
+  </PageMain>
+</template>

package/templates/pubinfo-template/src/views/demo/multilevel_menu_example/level2/level3/page1.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <div>
+    <PageMain>
+      多级导航2-2-2221
+    </PageMain>
+  </div>
+</template>

package/templates/pubinfo-template/src/views/demo/multilevel_menu_example/level2/level3/page2.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <div>
+    <PageMain>
+      多级导航2-2-1
+    </PageMain>
+  </div>
+</template>

package/templates/pubinfo-template/src/views/demo/multilevel_menu_example/level2/page.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <div>
+    <PageMain>
+      多级导航2-1
+    </PageMain>
+  </div>
+</template>

package/templates/pubinfo-template/src/views/demo/multilevel_menu_example/page.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+</script>
+
+<template>
+  <div>
+    <PageMain>
+      多级导航1
+    </PageMain>
+  </div>
+</template>

package/templates/pubinfo-template/src/views/demo/other_page/des.vue

@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+
+defineOptions({
+  name: 'OtherPageDetail',
+});
+</script>
+
+<template>
+  <PageMain>
+    123
+  </PageMain>
+</template>

package/templates/pubinfo-template/src/views/demo/other_page/index.vue

@@ -0,0 +1,25 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+
+defineOptions({
+  name: 'OtherPage',
+});
+/* =============================================
+=                   逻辑代码                   =
+============================================= */
+const router = useRouter();
+function jump() {
+  router.push({
+    name: 'OtherPageDetail',
+  });
+}
+</script>
+
+<template>
+  <PageMain>
+    列表页
+    <a-button type="primary" @click="jump">
+      点击跳转入详情页
+    </a-button>
+  </PageMain>
+</template>

package/templates/pubinfo-template/src/views/demo/preview-empty/index.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+/* =============================================
+=               Vue SFC Options 配置           =
+============================================= */
+defineOptions({
+  name: 'PreviewEmpty',
+});
+/* =============================================
+=                   逻辑代码                   =
+============================================= */
+</script>
+
+<template>
+  <div>
+    空白展示页面
+  </div>
+</template>

package/templates/pubinfo-template/src/views/demo/single/index.vue

@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import { PageMain } from 'pubinfo';
+
+defineOptions({
+  name: 'Demo',
+});
+</script>
+
+<template>
+  <PageMain>
+    演示页面，没有任何内容
+  </PageMain>
+</template>

package/templates/pubinfo-template/src/views/system/index.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="home">
+    主页
+  </div>
+</template>

package/templates/pubinfo-template/src/views/system/login/components/LoginForm.vue

@@ -0,0 +1,68 @@
+<script setup lang="ts">
+import { useLoginTabs } from '../composables';
+
+defineOptions({
+  name: 'LoginFrom',
+});
+
+const { tabs, initialTab, changeActiveTab } = useLoginTabs();
+</script>
+
+<template>
+  <div class="login-warp">
+    <div class="login-tabs">
+      <div
+        v-for="(tab, index) in tabs"
+        :key="tab.title"
+        class="login-tab"
+        :class="{ active: initialTab === index }"
+        :style="{ width: `${100 / tabs.length}%` }"
+        @click="changeActiveTab(index)"
+      >
+        {{ tab.title }}
+      </div>
+    </div>
+    <div class="login-form">
+      <component :is="tabs[initialTab].component" :key="tabs[initialTab].title" :name="tabs[initialTab].title" />
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.login-warp {
+  display: flex;
+  flex-direction: column;
+  width: 456px;
+  background: transparent;
+
+  .login-tabs {
+    display: flex;
+    flex-direction: row;
+    overflow: hidden;
+    border: 1px solid #e7e8e9;
+    border-radius: 4px;
+
+    .login-tab {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: center;
+      height: 40px;
+      font-size: 16px;
+      color: #8a8e92;
+      cursor: pointer;
+      border-radius: 4px;
+    }
+
+    .active {
+      color: #2f6bff;
+      background: #ecf1fd;
+    }
+  }
+
+  .login-form {
+    position: relative;
+    min-height: 350px;
+  }
+}
+</style>