create-young-proj 0.1.0 → 0.2.0

package/template-vue-mobile/src/layouts/sub.vue

@@ -0,0 +1,20 @@
+<!--
+ * @Author: zhangyang
+ * @Date: 2022-12-03 16:21:10
+ * @LastEditTime: 2023-02-01 11:24:56
+ * @Description:
+-->
+<script lang="ts" setup>
+const route = useRoute();
+const title = computed(() => route.meta.title || import.meta.env.VITE_TITLE);
+</script>
+
+<template>
+  <VanNavBar :border="false" left-arrow @click-left="$router.back()">
+    <template #title>
+      <span class="text-[#FFFFFF] text-16px font-700">{{ title }}</span>
+    </template>
+  </VanNavBar>
+  <RouterView v-bind="$attrs" />
+</template>
+

package/template-vue-mobile/src/main.ts

@@ -0,0 +1,35 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2022-12-03 15:57:40
+ * @LastEditTime: 2023-02-01 12:01:43
+ * @Description:
+ */
+// polyfill
+import 'core-js/stable';
+import 'regenerator-runtime/runtime';
+// 统一浏览器样式
+import '@unocss/reset/tailwind.css';
+import 'uno.css';
+// vant 指令的样式
+import 'vant/es/toast/style/index';
+import 'vant/es/dialog/style/index';
+import 'vant/es/notify/style/index';
+import 'vant/es/image-preview/style/index';
+
+import { createApp } from 'vue';
+import App from './App.vue';
+
+const app = createApp(App);
+
+Object.values(import.meta.glob<{ install: UserModule }>('./modules/*.ts', { eager: true })).map(
+  ({ install }) => install(app),
+);
+
+setTimeout(async () => {
+  if (window?.__YOUNG_VITE_ENV__?.VITE_ENABLE_VCONSOLE) {
+    const VConsole = await (await import('vconsole')).default;
+    new VConsole();
+  }
+}, 1e4);
+
+app.mount('#app');

package/template-vue-mobile/src/modules/1-router.ts

@@ -0,0 +1,40 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2022-03-01 14:01:31
+ * @LastEditTime: 2023-02-01 11:22:42
+ * @Description: 路由模块
+ */
+import { createRouter, createWebHashHistory } from 'vue-router';
+import { setupLayouts } from 'virtual:generated-layouts';
+import routes from '~pages';
+
+/**
+ * 路由元数据类型扩展
+ */
+declare module 'vue-router' {
+  interface RouteMeta {
+    /**
+     * 页面标题
+     */
+    title: string;
+    /**
+     * 需要登录，不设置则为白名单页面
+     */
+    auth?: boolean;
+    /**
+     * 页面布局，对应 layouts 目录下的布局页面，默认为 default
+     */
+    layout?: 'default' | 'sub' | 'blank';
+  }
+}
+
+export const finalRoutes = setupLayouts(routes);
+
+export const router = createRouter({
+  history: createWebHashHistory(),
+  routes: finalRoutes,
+});
+
+export const install: UserModule = (app) => {
+  app.use(router);
+};

package/template-vue-mobile/src/modules/2-pinia.ts

@@ -0,0 +1,10 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2022-03-01 14:01:31
+ * @LastEditTime: 2023-01-13 15:42:50
+ * @Description: 状态管理
+ */
+export const install: UserModule = (app) => {
+  const pinia = createPinia();
+  app.use(pinia);
+};

package/template-vue-mobile/src/modules/3-net.ts

@@ -0,0 +1,46 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2022-03-01 14:01:31
+ * @LastEditTime: 2023-01-13 15:54:59
+ * @Description: 网络请求
+ */
+import { useHttp } from '@bluesyoung/http';
+
+let loadingInstance: ReturnType<typeof showLoadingToast>;
+
+export const startLoading = () => {
+  loadingInstance = showLoadingToast({
+    message: '拼命加载中...',
+    forbidClick: true,
+  });
+};
+
+export const endLoading = () => loadingInstance?.close?.();
+
+export const http = useHttp({
+  timeout: -1,
+  loading: {
+    start: startLoading,
+    end: endLoading,
+  },
+  fail(err) {
+    console.log('🚀 ~ file: 3-net.ts:60 ~ err', err, typeof err);
+    if (typeof err === 'string') {
+      // 通用失败，弹出提示信息
+      showFailToast(err);
+    }
+
+    if (err instanceof Error) {
+      showFailToast(
+        // @ts-ignore 接口出错
+        err?.response?.data?.message || err?.response?.data?.msg || err.message || '网络错误！',
+      );
+    }
+
+    throw err;
+  },
+});
+
+export const apis = http.__mixin__({});
+
+export const install: UserModule = (ctx) => {};

package/template-vue-mobile/src/modules/4-auth.ts

@@ -0,0 +1,64 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2022-03-01 19:40:13
+ * @LastEditTime: 2023-02-01 11:46:18
+ * @Description: 权限校验
+ */
+import { router } from './1-router';
+import type { RouteLocationNormalized } from 'vue-router';
+import { YoungLocalStorage } from '@bluesyoung/utils';
+
+const changeTitle = (to: RouteLocationNormalized) => {
+  document.title = to.meta.title || (import.meta.env.VITE_TITLE as string);
+};
+
+export const hasPermission = (path: string) => {};
+
+export const sureLeave = async () => {
+  try {
+    await showConfirmDialog({
+      title: '温馨提示',
+      message: '您确定要离开吗？',
+    });
+    return true;
+  } catch (error) {
+    return false;
+  }
+};
+
+export const install: UserModule = (app) => {
+  // todo: 按需替换为 api 操作
+  const store = new YoungLocalStorage();
+  const api = {
+    getInfo: () => store.get('user.info'),
+    setInfo: () => store.set('user.info', { key: 'cdcsdfdf' }),
+  };
+
+  router.beforeEach(async (to, from) => {
+    // auth
+    if (to.meta.auth) {
+      const info = await api.getInfo();
+      if (info) {
+        return true;
+      }
+      try {
+        // todo: 可根据情况替换为跳转登录页, /base/login
+        await showDialog({
+          title: '温馨提示',
+          message: '我是默认的登录框，点击即登录',
+          showCancelButton: true,
+        });
+        await api.setInfo();
+        return true;
+      } catch (error) {
+        return false;
+      }
+    } else {
+      return true;
+    }
+  });
+
+  router.afterEach((to) => {
+    changeTitle(to);
+  });
+};