blackteay/uniapp-vue3-vite-ts-template
1
0
Fork 0
mirror of https://gitee.com/h_mo/uniapp-vue3-vite-ts-template synced 2025-04-05 06:12:44 +08:00
Code Issues Projects Releases Wiki Activity

style-格式化代码

Browse Source
This commit is contained in:
Huang 2023-02-20 15:14:14 +08:00
parent ff12419ce5
commit 8ff3ca01a0
55 changed files with 1535 additions and 1669 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/App.vue
View File

@ -1,25 +1,25 @@
<script setup lang="ts">
import { onLaunch, onShow, onHide } from '@dcloudio/uni-app';
import { useAuthStore } from '@/state/modules/auth';
import { removeInterceptor, setupInterceptors } from '@/utils/interceptors';
import { useRouterStore } from '@/state/modules/router';
onLaunch(() => {
console.log('App Launch');
removeInterceptor();
import { onLaunch, onShow, onHide } from '@dcloudio/uni-app';
import { useAuthStore } from '@/state/modules/auth';
import { removeInterceptor, setupInterceptors } from '@/utils/interceptors';
import { useRouterStore } from '@/state/modules/router';
onLaunch(() => {
console.log('App Launch');
removeInterceptor();
setupInterceptors();
const appStore = useRouterStore();
appStore.initialize();
});
onShow(() => {
const authStore = useAuthStore();
authStore.initToken();
console.log('App Show');
});
onHide(() => {
console.log('App Hide');
});
setupInterceptors();
const appStore = useRouterStore();
appStore.initialize();
});
onShow(() => {
const authStore = useAuthStore();
authStore.initToken();
console.log('App Show');
});
onHide(() => {
console.log('App Hide');
});
</script>
<style lang="scss">
@import '@/assets/main.scss';
@import '@/assets/main.scss';
</style>

54
src/androidPrivacy.json
View File

@ -1,29 +1,29 @@
{
"version" : "1",
"prompt" : "template",
"title" : "服务协议和隐私政策",
"message" : "　　请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款，包括但不限于：为了更好的向你提供服务，我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>　　你可阅读<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>了解详细信息。如果你同意，请点击下面按钮开始接受我们的服务。",
"buttonAccept" : "同意并接受",
"buttonRefuse" : "暂不同意",
// HX 3.4.13之后版本新增，system 使用系统webview 打开隐私协议链接，默认使用uni-app内置web组件
"hrefLoader" : "default",
"second" : {
"title" : "确认提示",
"message" : "　　进入应用前，你需先同意<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>，否则将退出应用。",
"buttonAccept" : "同意并继续",
"buttonRefuse" : "退出应用"
},
"styles" : {
"backgroundColor" : "#00FF00",
"borderRadius" : "5px",
"title" : {
"color" : "#ff00ff"
},
"buttonAccept" : {
"color" : "#ffff00"
},
"buttonRefuse" : {
"color" : "#00ffff"
}
}
"version": "1",
"prompt": "template",
"title": "服务协议和隐私政策",
"message": "　　请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款，包括但不限于：为了更好的向你提供服务，我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>　　你可阅读<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>了解详细信息。如果你同意，请点击下面按钮开始接受我们的服务。",
"buttonAccept": "同意并接受",
"buttonRefuse": "暂不同意",
// HX 3.4.13之后版本新增，system 使用系统webview 打开隐私协议链接，默认使用uni-app内置web组件
"hrefLoader": "default",
"second": {
"title": "确认提示",
"message": "　　进入应用前，你需先同意<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>，否则将退出应用。",
"buttonAccept": "同意并继续",
"buttonRefuse": "退出应用"
},
"styles": {
"backgroundColor": "#00FF00",
"borderRadius": "5px",
"title": {
"color": "#ff00ff"
},
"buttonAccept": {
"color": "#ffff00"
},
"buttonRefuse": {
"color": "#00ffff"
}
}
}

44
src/assets/main.scss
View File

@ -34,36 +34,36 @@ canvas,
web-view,
:before,
:after {
box-sizing: border-box;
box-sizing: border-box;
}
/* 隐藏scroll-view的滚动条 */
::-webkit-scrollbar {
display: none;
width: 0 !important;
height: 0 !important;
-webkit-appearance: none;
background: transparent;
display: none;
width: 0 !important;
height: 0 !important;
-webkit-appearance: none;
background: transparent;
}
// 超出省略,最多5行
@for $i from 1 through 5 {
.text-ellipsis-#{$i} {
// vue下，单行和多行显示省略号需要单独处理
@if $i == '1' {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
} @else {
display: -webkit-box !important;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
-webkit-line-clamp: $i;
-webkit-box-orient: vertical !important;
}
}
.text-ellipsis-#{$i} {
// vue下，单行和多行显示省略号需要单独处理
@if $i == '1' {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
} @else {
display: -webkit-box !important;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
-webkit-line-clamp: $i;
-webkit-box-orient: vertical !important;
}
}
}
page {
background-color: #f2f2f2;
background-color: #f2f2f2;
}

6
src/components/AppProvider/inedx.vue
View File

@ -1,7 +1,7 @@
<script lang="ts" setup name="AppProvider"></script>
<template>
<view class="_u_bg-blue-500">
<slot></slot>
</view>
<view class="_u_bg-blue-500">
<slot></slot>
</view>
</template>
<style lang="scss" scoped></style>

46
src/components/BasicButton/index.vue
View File

@ -1,32 +1,32 @@
<script lang="ts" setup>
import { buttonProps } from '@/components/BasicButton/prpos';
import { buttonProps } from '@/components/BasicButton/prpos';
const props = defineProps(buttonProps);
const emits = defineEmits(['click']);
const click = () => {
emits('click');
};
const props = defineProps(buttonProps);
const emits = defineEmits(['click']);
const click = () => {
emits('click');
};
</script>
<template>
<view class="default-btn" :disabled="props.disabled" @tap="click">
<slot></slot>
</view>
<view class="default-btn" :disabled="props.disabled" @tap="click">
<slot></slot>
</view>
</template>
<style lang="scss" scoped>
.default-btn {
color: #fff;
border-width: 4rpx;
border-color: #bfdbfe;
border-style: solid;
border-radius: 6rpx;
background-color: #60a5fa;
padding: 12rpx 26rpx;
display: inline-block;
font-size: 24rpx;
&:hover {
background-color: #3b82f6;
}
}
.default-btn {
color: #fff;
border-width: 4rpx;
border-color: #bfdbfe;
border-style: solid;
border-radius: 6rpx;
background-color: #60a5fa;
padding: 12rpx 26rpx;
display: inline-block;
font-size: 24rpx;
&:hover {
background-color: #3b82f6;
}
}
</style>

4
src/components/BasicButton/prpos.ts
View File

@ -1,4 +1,4 @@
export const buttonProps = {
disabled: { type: Boolean, default: false },
click: { type: Function },
disabled: { type: Boolean, default: false },
click: { type: Function },
};

46
src/components/BasicInput/index.vue
View File

@ -1,31 +1,31 @@
<template>
<input :type="type" :name="name" :value="value" />
<input :type="type" :name="name" :value="value" />
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent } from 'vue';
export default defineComponent({
name: 'BasicInput',
props: {
type: {
type: String,
default: 'text',
},
name: {
type: String,
default: '',
},
value: {
type: String,
default: '',
},
},
setup(props) {
const _props = props;
return {};
},
});
export default defineComponent({
name: 'BasicInput',
props: {
type: {
type: String,
default: 'text',
},
name: {
type: String,
default: '',
},
value: {
type: String,
default: '',
},
},
setup(props) {
const _props = props;
return {};
},
});
</script>
<style lang="scss" scoped></style>

78
src/components/Iconify/index.vue
View File

@ -1,54 +1,42 @@
<script lang="ts" setup name="Iconify">
import { computed, ref, unref } from 'vue';
import { assign } from 'lodash-es';
import { computed, ref, unref } from 'vue';
import { assign } from 'lodash-es';
const props = defineProps({
icon: {
type: String,
},
size: {
type: [Number, String],
},
color: {
type: String,
},
});
const props = defineProps({
icon: {
type: String,
},
size: {
type: [Number, String],
},
color: {
type: String,
},
});
const iconSize = ref<string | boolean>(
props.size ? `${props.size}rpx` : false,
);
const style = computed(() => {
return assign(
unref(iconSize)
? { width: unref(iconSize), height: unref(iconSize) }
: {},
props.color ? { color: props.color } : {},
);
});
const iconSize = ref<string | boolean>(props.size ? `${props.size}rpx` : false);
const style = computed(() => {
return assign(unref(iconSize) ? { width: unref(iconSize), height: unref(iconSize) } : {}, props.color ? { color: props.color } : {});
});
const emit = defineEmits(['click']);
const onClick = () => {
emit('click');
};
const emit = defineEmits(['click']);
const onClick = () => {
emit('click');
};
</script>
<template>
<view
ref="elRef"
@click="onClick"
:class="['iconify', icon]"
:style="style"
></view>
<view ref="elRef" @click="onClick" :class="['iconify', icon]" :style="style"></view>
</template>
<style lang="scss" scoped>
.iconify {
display: inline-block;
vertical-align: middle;
height: 44rpx;
width: 44rpx;
color: inherit;
&:hover {
cursor: pointer;
opacity: 0.8;
}
}
.iconify {
display: inline-block;
vertical-align: middle;
height: 44rpx;
width: 44rpx;
color: inherit;
&:hover {
cursor: pointer;
opacity: 0.8;
}
}
</style>

260
src/components/Navbar/index.vue
View File

@ -1,163 +1,119 @@
<script lang="ts" setup name="Navbar">
/**
* 头部导航栏
* @description 所有尺寸都用px2rpx做适配
*/
import { useSystem } from '@/hooks/useSystem';
import { px2rpx } from '@/utils/uniapi';
import { computed, ref } from 'vue';
import { useRoute, useRouter } from '@/hooks/router';
import { useGlobalStyle } from '@/hooks/useGlobalStyle';
import Iconify from '@/components/Iconify/index.vue';
import { HOME_PAGE } from '@/enums/routerEnum';
/**
* 头部导航栏
* @description 所有尺寸都用px2rpx做适配
*/
import { useSystem } from '@/hooks/useSystem';
import { px2rpx } from '@/utils/uniapi';
import { computed, ref } from 'vue';
import { useRoute, useRouter } from '@/hooks/router';
import { useGlobalStyle } from '@/hooks/useGlobalStyle';
import Iconify from '@/components/Iconify/index.vue';
import { HOME_PAGE } from '@/enums/routerEnum';
const {
navigationBarBackgroundColor,
navigationBarTitleText,
navigationBarTextStyle,
} = useGlobalStyle();
const { navigationBarBackgroundColor, navigationBarTitleText, navigationBarTextStyle } = useGlobalStyle();
const { currentRoute, currentPages } = useRoute();
const { currentRoute, currentPages } = useRoute();
const props = defineProps({
bgColor: { type: String },
title: { type: String },
titleColor: { type: String },
titleSize: { type: [String, Number] },
iconSize: { type: [String, Number] },
gap: { type: Number, default: 8 },
isBackShow: { type: Boolean, default: true },
isHomeShow: { type: Boolean },
shadow: { type: Boolean, default: true },
});
const props = defineProps({
bgColor: { type: String },
title: { type: String },
titleColor: { type: String },
titleSize: { type: [String, Number] },
iconSize: { type: [String, Number] },
gap: { type: Number, default: 8 },
isBackShow: { type: Boolean, default: true },
isHomeShow: { type: Boolean },
shadow: { type: Boolean, default: true },
});
const { statusBarHeight } = useSystem();
const statusHeight = computed(() => `${px2rpx(statusBarHeight!)}rpx`);
const defaultNavbarHeight = ref(44);
const defaultTitleSize = ref(16);
const defaultIconSize = ref(24);
const navbarHeight = computed(
() => `${px2rpx(defaultNavbarHeight.value)}rpx`,
);
const headHeight = computed(
() => `${px2rpx((statusBarHeight || 0) + defaultNavbarHeight.value)}rpx`,
);
const sideGap = computed(() => `${px2rpx(props.gap)}rpx`);
const navbarBgColor = computed(
() => props.bgColor || navigationBarBackgroundColor,
);
const navbarTitle = computed(
() =>
props.title ||
currentRoute?.style?.navigationBarTitleText ||
navigationBarTitleText,
);
const navbarTitleColor = computed(
() =>
props.titleColor ||
currentRoute?.style?.navigationBarTextStyle ||
navigationBarTextStyle,
);
const navbarTitleSize = computed(() => {
return `${px2rpx(defaultTitleSize.value) || props.titleSize}rpx`;
});
const navbarLeftIconSize = computed(() => {
return `${px2rpx(defaultIconSize.value) || props.titleSize}`;
});
const backShow = computed(() => {
return currentPages.length > 1 && props.isBackShow;
});
const backHomeShow = computed(() => {
return !currentRoute?.meta?.tabBar && props.isHomeShow;
});
const { statusBarHeight } = useSystem();
const statusHeight = computed(() => `${px2rpx(statusBarHeight!)}rpx`);
const defaultNavbarHeight = ref(44);
const defaultTitleSize = ref(16);
const defaultIconSize = ref(24);
const navbarHeight = computed(() => `${px2rpx(defaultNavbarHeight.value)}rpx`);
const headHeight = computed(() => `${px2rpx((statusBarHeight || 0) + defaultNavbarHeight.value)}rpx`);
const sideGap = computed(() => `${px2rpx(props.gap)}rpx`);
const navbarBgColor = computed(() => props.bgColor || navigationBarBackgroundColor);
const navbarTitle = computed(() => props.title || currentRoute?.style?.navigationBarTitleText || navigationBarTitleText);
const navbarTitleColor = computed(() => props.titleColor || currentRoute?.style?.navigationBarTextStyle || navigationBarTextStyle);
const navbarTitleSize = computed(() => {
return `${px2rpx(defaultTitleSize.value) || props.titleSize}rpx`;
});
const navbarLeftIconSize = computed(() => {
return `${px2rpx(defaultIconSize.value) || props.titleSize}`;
});
const backShow = computed(() => {
return currentPages.length > 1 && props.isBackShow;
});
const backHomeShow = computed(() => {
return !currentRoute?.meta?.tabBar && props.isHomeShow;
});
const router = useRouter();
const onBack = () => {
router.back();
};
const onBackHome = () => {
router.pushTab(HOME_PAGE);
};
const router = useRouter();
const onBack = () => {
router.back();
};
const onBackHome = () => {
router.pushTab(HOME_PAGE);
};
</script>
<template>
<view class="head-wrapper">
<view :class="['page-head', '_u_head-fixed', '_u_shadow']">
<!-- 顶部状态栏 -->
<view class="status-bar"></view>
<!-- navbar -->
<view
:class="[
'navbar-wrapper',
'_u_flex',
'_u_flex-nowrap',
'_u_justify-between',
'_u_items-center',
]"
>
<view
class="_u_flex _u_flex-nowrap _u_items-center _u_h-full _u_w3/10 _u_min-w3/10"
>
<slot name="left">
<view class="_u_h-full _u_flex _u_items-center">
<template v-if="backShow">
<Iconify
@click="onBack"
:size="navbarLeftIconSize"
:color="navbarTitleColor"
icon="i-humbleicons-chevron-left"
/>
</template>
<template v-if="backHomeShow">
<Iconify
@click="onBackHome"
:size="navbarLeftIconSize"
:color="navbarTitleColor"
icon="i-iconoir-home-simple-door"
/>
</template>
</view>
</slot>
</view>
<view
class="navbar__center _u_flex _u_flex-nowrap _u_justify-center _u_items-center _u_h-full _u_w2/5 _u_min-w2/5"
>
<slot>
<text>{{ navbarTitle }}</text>
</slot>
</view>
<view
class="_u_flex _u_flex-nowrap _u_justify-end _u_items-center _u_h-full _u_w3/10 _u_min-w3/10"
>
<slot name="right"></slot>
</view>
</view>
</view>
<!-- 占位符 -->
<view class="placeholder"></view>
</view>
<view class="head-wrapper">
<view :class="['page-head', '_u_head-fixed', '_u_shadow']">
<!-- 顶部状态栏 -->
<view class="status-bar"></view>
<!-- navbar -->
<view :class="['navbar-wrapper', '_u_flex', '_u_flex-nowrap', '_u_justify-between', '_u_items-center']">
<view class="_u_flex _u_flex-nowrap _u_items-center _u_h-full _u_w3/10 _u_min-w3/10">
<slot name="left">
<view class="_u_h-full _u_flex _u_items-center">
<template v-if="backShow">
<Iconify @click="onBack" :size="navbarLeftIconSize" :color="navbarTitleColor" icon="i-humbleicons-chevron-left" />
</template>
<template v-if="backHomeShow">
<Iconify @click="onBackHome" :size="navbarLeftIconSize" :color="navbarTitleColor" icon="i-iconoir-home-simple-door" />
</template>
</view>
</slot>
</view>
<view class="navbar__center _u_flex _u_flex-nowrap _u_justify-center _u_items-center _u_h-full _u_w2/5 _u_min-w2/5">
<slot>
<text>{{ navbarTitle }}</text>
</slot>
</view>
<view class="_u_flex _u_flex-nowrap _u_justify-end _u_items-center _u_h-full _u_w3/10 _u_min-w3/10">
<slot name="right"></slot>
</view>
</view>
</view>
<!-- 占位符 -->
<view class="placeholder"></view>
</view>
</template>
<style lang="scss" scoped>
.head-wrapper {
.page-head {
background: v-bind(navbarBgColor);
.status-bar {
height: v-bind(statusHeight);
}
.navbar-wrapper {
height: v-bind(navbarHeight);
padding-left: v-bind(sideGap);
padding-right: v-bind(sideGap);
.navbar__center {
font-weight: bold;
font-size: v-bind(navbarTitleSize);
color: v-bind(navbarTitleColor);
}
}
}
&,
.placeholder {
height: v-bind(headHeight);
min-height: v-bind(headHeight);
}
}
.head-wrapper {
.page-head {
background: v-bind(navbarBgColor);
.status-bar {
height: v-bind(statusHeight);
}
.navbar-wrapper {
height: v-bind(navbarHeight);
padding-left: v-bind(sideGap);
padding-right: v-bind(sideGap);
.navbar__center {
font-weight: bold;
font-size: v-bind(navbarTitleSize);
color: v-bind(navbarTitleColor);
}
}
}
&,
.placeholder {
height: v-bind(headHeight);
min-height: v-bind(headHeight);
}
}
</style>

16
src/components/Test/index.vue
View File

@ -1,14 +1,14 @@
<script lang="ts" setup>
const props = defineProps({
text: {
type: String,
default: 'text',
},
});
const props = defineProps({
text: {
type: String,
default: 'text',
},
});
const text = 'TEXT: ' + props.text;
const text = 'TEXT: ' + props.text;
</script>
<template>
<view>{{ text }}</view>
<view>{{ text }}</view>
</template>
<style lang="scss" scoped></style>

4
src/enums/appEnum.ts
View File

@ -2,6 +2,6 @@
* @description: 客户端 api 返回结果设置
*/
export enum ClientApiResultEnum {
CLIENT_SUCCESS = 1,
CLIENT_ERROR = 0,
CLIENT_SUCCESS = 1,
CLIENT_ERROR = 0,
}

8
src/enums/httpEnum.ts
View File

@ -2,8 +2,8 @@
* @description: 请求结果设置
*/
export enum ResultEnum {
SUCCESS = 10000,
ERROR = 1,
TIMEOUT = 401,
TYPE = 'success',
SUCCESS = 10000,
ERROR = 1,
TIMEOUT = 401,
TYPE = 'success',
}

150
src/enums/platformEnum.ts
View File

@ -2,25 +2,25 @@
* 平台
*/
export enum PLATFORMS {
DEFAULT = 'DEFAULT' /* 默认 */,
VUE3 = 'VUE3' /* HBuilderX 3.2.0+ */,
APP_PLUS = 'APP-PLUS' /* App */,
APP_PLUS_NVUE = 'APP-PLUS-NVUE' /* App nvue 页面 */,
APP_NVUE = 'APP-NVUE' /* App nvue 页面 */,
H5 = 'H5' /* H5 */,
MP_WEIXIN = 'MP-WEIXIN' /* 微信小程序 */,
MP_ALIPAY = 'MP-ALIPAY' /* 支付宝小程序 */,
MP_BAIDU = 'MP_BAIDU' /* 百度小程序 */,
MP_TOUTIAO = 'MP-TOUTIAO' /* 字节跳动小程序 */,
MP_LARK = 'MP-LARK' /* 飞书小程序 */,
MP_QQ = 'MP-QQ' /* QQ小程序 */,
MP_KUAISHOU = 'MP-KUAISHOU' /* 快手小程序 */,
MP_JD = 'MP-JD' /* 京东小程序 */,
MP_360 = 'MP-360' /* 360小程序 */,
MP = 'MP' /* 微信小程序/支付宝小程序/百度小程序/字节跳动小程序/飞书小程序/QQ小程序/360小程序 */,
QUICKAPP_WEBVIEW = 'QUICKAPP-WEBVIEW' /* 快应用通用(包含联盟、华为) */,
QUICKAPP_WEBVIEW_UNION = 'QUICKAPP-WEBVIEW-UNION' /* 快应用联盟 */,
QUICKAPP_WEBVIEW_HUAWEI = 'QUICKAPP-WEBVIEW-HUAWEI' /* 快应用华为 */,
DEFAULT = 'DEFAULT' /* 默认 */,
VUE3 = 'VUE3' /* HBuilderX 3.2.0+ */,
APP_PLUS = 'APP-PLUS' /* App */,
APP_PLUS_NVUE = 'APP-PLUS-NVUE' /* App nvue 页面 */,
APP_NVUE = 'APP-NVUE' /* App nvue 页面 */,
H5 = 'H5' /* H5 */,
MP_WEIXIN = 'MP-WEIXIN' /* 微信小程序 */,
MP_ALIPAY = 'MP-ALIPAY' /* 支付宝小程序 */,
MP_BAIDU = 'MP_BAIDU' /* 百度小程序 */,
MP_TOUTIAO = 'MP-TOUTIAO' /* 字节跳动小程序 */,
MP_LARK = 'MP-LARK' /* 飞书小程序 */,
MP_QQ = 'MP-QQ' /* QQ小程序 */,
MP_KUAISHOU = 'MP-KUAISHOU' /* 快手小程序 */,
MP_JD = 'MP-JD' /* 京东小程序 */,
MP_360 = 'MP-360' /* 360小程序 */,
MP = 'MP' /* 微信小程序/支付宝小程序/百度小程序/字节跳动小程序/飞书小程序/QQ小程序/360小程序 */,
QUICKAPP_WEBVIEW = 'QUICKAPP-WEBVIEW' /* 快应用通用(包含联盟、华为) */,
QUICKAPP_WEBVIEW_UNION = 'QUICKAPP-WEBVIEW-UNION' /* 快应用联盟 */,
QUICKAPP_WEBVIEW_HUAWEI = 'QUICKAPP-WEBVIEW-HUAWEI' /* 快应用华为 */,
}
/**
@ -28,81 +28,81 @@ export enum PLATFORMS {
* @constructor
*/
function PLATFORM_ENV() {
let platform = PLATFORMS.DEFAULT;
let platform = PLATFORMS.DEFAULT;
/* #ifdef VUE3 */
platform = PLATFORMS.VUE3;
/* #endif */
/* #ifdef VUE3 */
platform = PLATFORMS.VUE3;
/* #endif */
/* #ifdef APP-PLUS */
platform = PLATFORMS.APP_PLUS;
/* #endif */
/* #ifdef APP-PLUS */
platform = PLATFORMS.APP_PLUS;
/* #endif */
/* #ifdef APP-PLUS-NVUE */
platform = PLATFORMS.APP_PLUS_NVUE;
/* #endif */
/* #ifdef APP-PLUS-NVUE */
platform = PLATFORMS.APP_PLUS_NVUE;
/* #endif */
/* #ifdef APP-NVUE */
platform = PLATFORMS.APP_NVUE;
/* #endif */
/* #ifdef APP-NVUE */
platform = PLATFORMS.APP_NVUE;
/* #endif */
/* #ifdef H5 */
platform = PLATFORMS.H5;
/* #endif */
/* #ifdef H5 */
platform = PLATFORMS.H5;
/* #endif */
/* #ifdef MP */
platform = PLATFORMS.MP;
/* #endif */
/* #ifdef MP */
platform = PLATFORMS.MP;
/* #endif */
/* #ifdef MP-WEIXIN */
platform = PLATFORMS.MP_WEIXIN;
/* #endif */
/* #ifdef MP-WEIXIN */
platform = PLATFORMS.MP_WEIXIN;
/* #endif */
/* #ifdef MP-ALIPAY */
platform = PLATFORMS.MP_ALIPAY;
/* #endif */
/* #ifdef MP-ALIPAY */
platform = PLATFORMS.MP_ALIPAY;
/* #endif */
/* #ifdef MP_BAIDU */
platform = PLATFORMS.MP_BAIDU;
/* #endif */
/* #ifdef MP_BAIDU */
platform = PLATFORMS.MP_BAIDU;
/* #endif */
/* #ifdef MP-TOUTIAO */
platform = PLATFORMS.MP_TOUTIAO;
/* #endif */
/* #ifdef MP-TOUTIAO */
platform = PLATFORMS.MP_TOUTIAO;
/* #endif */
/* #ifdef MP-LARK */
platform = PLATFORMS.MP_LARK;
/* #endif */
/* #ifdef MP-LARK */
platform = PLATFORMS.MP_LARK;
/* #endif */
/* #ifdef MP-QQ */
platform = PLATFORMS.MP_QQ;
/* #endif */
/* #ifdef MP-QQ */
platform = PLATFORMS.MP_QQ;
/* #endif */
/* #ifdef MP-KUAISHOU */
platform = PLATFORMS.MP_KUAISHOU;
/* #endif */
/* #ifdef MP-KUAISHOU */
platform = PLATFORMS.MP_KUAISHOU;
/* #endif */
/* #ifdef MP-JD */
platform = PLATFORMS.MP_JD;
/* #endif */
/* #ifdef MP-JD */
platform = PLATFORMS.MP_JD;
/* #endif */
/* #ifdef MP-360 */
platform = PLATFORMS.MP_360;
/* #endif */
/* #ifdef MP-360 */
platform = PLATFORMS.MP_360;
/* #endif */
/* #ifdef QUICKAPP-WEBVIEW */
platform = PLATFORMS.QUICKAPP_WEBVIEW;
/* #endif */
/* #ifdef QUICKAPP-WEBVIEW */
platform = PLATFORMS.QUICKAPP_WEBVIEW;
/* #endif */
/* #ifdef QUICKAPP-WEBVIEW-UNION */
platform = PLATFORMS.QUICKAPP_WEBVIEW_UNION;
/* #endif */
/* #ifdef QUICKAPP-WEBVIEW-UNION */
platform = PLATFORMS.QUICKAPP_WEBVIEW_UNION;
/* #endif */
/* #ifdef QUICKAPP-WEBVIEW-HUAWEI */
platform = PLATFORMS.QUICKAPP_WEBVIEW_HUAWEI;
/* #endif */
/* #ifdef QUICKAPP-WEBVIEW-HUAWEI */
platform = PLATFORMS.QUICKAPP_WEBVIEW_HUAWEI;
/* #endif */
return platform;
return platform;
}
/* 当前平台 */

17
src/enums/routerEnum.ts
View File

@ -1,17 +1,12 @@
export enum NAVIGATE_TYPE {
NAVIGATE_TO = 'navigateTo',
REDIRECT_TO = 'redirectTo',
RE_LAUNCH = 'reLaunch',
SWITCH_TAB = 'switchTab',
NAVIGATE_BACK = 'navigateBack',
NAVIGATE_TO = 'navigateTo',
REDIRECT_TO = 'redirectTo',
RE_LAUNCH = 'reLaunch',
SWITCH_TAB = 'switchTab',
NAVIGATE_BACK = 'navigateBack',
}
export const NAVIGATE_TYPE_LIST = [
'navigateTo',
'redirectTo',
'reLaunch',
'switchTab',
];
export const NAVIGATE_TYPE_LIST = ['navigateTo', 'redirectTo', 'reLaunch', 'switchTab'];
export const HOME_PAGE = '/pages/index/index';
export const LOGIN_PAGE = '/pages/login/index';

44
src/hooks/router.ts
View File

@ -8,7 +8,7 @@ const router = new Navigates();
* 路由hook
*/
export function useRouter() {
return router;
return router;
}
/**
@ -19,26 +19,26 @@ export function useRouter() {
* @return RouteLocationNormalized
*/
export function useRoute(): RouteLocationNormalized {
const currentPages = getCurrentPages();
const currentPage = currentPages[currentPages.length - 1];
const path = currentPage?.route || '';
const routerStore = useRouterStore();
const currentRoute = routerStore.getRoutes?.get(path as string);
let query = {};
/* #ifndef MP-WEIXIN */
// @ts-ignore
query = currentPage?.$page?.options || {};
/* #endif */
const currentPages = getCurrentPages();
const currentPage = currentPages[currentPages.length - 1];
const path = currentPage?.route || '';
const routerStore = useRouterStore();
const currentRoute = routerStore.getRoutes?.get(path as string);
let query = {};
/* #ifndef MP-WEIXIN */
// @ts-ignore
query = currentPage?.$page?.options || {};
/* #endif */
/* #ifdef MP-WEIXIN */
// @ts-ignore
query = currentPage?.options || {};
/* #endif */
return {
currentPages,
currentPage,
path,
currentRoute,
query,
};
/* #ifdef MP-WEIXIN */
// @ts-ignore
query = currentPage?.options || {};
/* #endif */
return {
currentPages,
currentPage,
path,
currentRoute,
query,
};
}

19
src/hooks/useGlobalStyle.ts
View File

@ -5,16 +5,11 @@ const { globalStyle } = pagesJson;
* 全局样式
*/
export const useGlobalStyle = () => {
const {
navigationBarTextStyle,
navigationBarTitleText,
navigationBarBackgroundColor,
backgroundColor,
} = globalStyle;
return {
navigationBarTextStyle,
navigationBarTitleText,
navigationBarBackgroundColor,
backgroundColor,
};
const { navigationBarTextStyle, navigationBarTitleText, navigationBarBackgroundColor, backgroundColor } = globalStyle;
return {
navigationBarTextStyle,
navigationBarTitleText,
navigationBarBackgroundColor,
backgroundColor,
};
};

302
src/hooks/useSystem.ts
View File

@ -4,161 +4,149 @@
* @link https://uniapp.dcloud.net.cn/api/system/info.html
*/
export const useSystem = () => {
const {
// device
deviceId,
deviceBrand,
deviceModel,
deviceType,
devicePixelRatio,
deviceOrientation,
// os
osName,
osVersion,
osLanguage,
osTheme,
// @ts-ignore
osAndroidAPILevel,
// rom
romName,
romVersion,
// browser
browserName,
browserVersion,
// host
hostFontSizeSetting,
hostSDKVersion,
hostName,
hostVersion,
hostLanguage,
hostTheme,
hostPackageName,
// uni-app框架
uniPlatform,
uniCompileVersion,
uniRuntimeVersion,
// app
appId,
appName,
appVersion,
appVersionCode,
appLanguage,
// @ts-ignore
appWgtVersion,
// 其他
ua,
screenWidth,
screenHeight,
windowWidth,
windowHeight,
windowTop,
windowBottom,
statusBarHeight,
safeArea,
safeAreaInsets,
// 某些小程序特殊的返回参数
// @ts-ignore
benchmarkLevel,
// @ts-ignore
batteryLevel,
currentBattery,
navigationBarHeight,
titleBarHeight,
albumAuthorized,
cameraAuthorized,
locationAuthorized,
microphoneAuthorized,
notificationAuthorized,
notificationAlertAuthorized,
notificationBadgeAuthorized,
notificationSoundAuthorized,
bluetoothEnabled,
locationEnabled,
wifiEnabled,
cacheLocation,
storage,
} = uni.getSystemInfoSync();
const {
top: safeAreaTop,
bottom: safeAreaBottom,
left: safeAreaLeft,
right: safeAreaRight,
height: safeAreaHeight,
width: safeAreaWidth,
} = safeArea!;
const {
top: safeAreaInsetsTop,
bottom: safeAreaInsetsBottom,
left: safeAreaInsetsLeft,
right: safeAreaInsetsRight,
} = safeAreaInsets!;
return {
deviceId,
deviceBrand,
deviceModel,
deviceType,
devicePixelRatio,
deviceOrientation,
osName,
osVersion,
osLanguage,
osTheme,
osAndroidAPILevel,
romName,
romVersion,
browserName,
browserVersion,
hostFontSizeSetting,
hostSDKVersion,
hostName,
hostVersion,
hostLanguage,
hostTheme,
hostPackageName,
uniPlatform,
uniCompileVersion,
uniRuntimeVersion,
appId,
appName,
appVersion,
appVersionCode,
appLanguage,
appWgtVersion,
ua,
screenWidth,
screenHeight,
windowWidth,
windowHeight,
windowTop,
windowBottom,
statusBarHeight,
safeAreaTop,
safeAreaBottom,
safeAreaLeft,
safeAreaRight,
safeAreaHeight,
safeAreaWidth,
safeAreaInsetsTop,
safeAreaInsetsBottom,
safeAreaInsetsLeft,
safeAreaInsetsRight,
benchmarkLevel,
batteryLevel,
currentBattery,
navigationBarHeight,
titleBarHeight,
albumAuthorized,
cameraAuthorized,
locationAuthorized,
microphoneAuthorized,
notificationAuthorized,
notificationAlertAuthorized,
notificationBadgeAuthorized,
notificationSoundAuthorized,
bluetoothEnabled,
locationEnabled,
wifiEnabled,
cacheLocation,
storage,
};
const {
// device
deviceId,
deviceBrand,
deviceModel,
deviceType,
devicePixelRatio,
deviceOrientation,
// os
osName,
osVersion,
osLanguage,
osTheme,
// @ts-ignore
osAndroidAPILevel,
// rom
romName,
romVersion,
// browser
browserName,
browserVersion,
// host
hostFontSizeSetting,
hostSDKVersion,
hostName,
hostVersion,
hostLanguage,
hostTheme,
hostPackageName,
// uni-app框架
uniPlatform,
uniCompileVersion,
uniRuntimeVersion,
// app
appId,
appName,
appVersion,
appVersionCode,
appLanguage,
// @ts-ignore
appWgtVersion,
// 其他
ua,
screenWidth,
screenHeight,
windowWidth,
windowHeight,
windowTop,
windowBottom,
statusBarHeight,
safeArea,
safeAreaInsets,
// 某些小程序特殊的返回参数
// @ts-ignore
benchmarkLevel,
// @ts-ignore
batteryLevel,
currentBattery,
navigationBarHeight,
titleBarHeight,
albumAuthorized,
cameraAuthorized,
locationAuthorized,
microphoneAuthorized,
notificationAuthorized,
notificationAlertAuthorized,
notificationBadgeAuthorized,
notificationSoundAuthorized,
bluetoothEnabled,
locationEnabled,
wifiEnabled,
cacheLocation,
storage,
} = uni.getSystemInfoSync();
const { top: safeAreaTop, bottom: safeAreaBottom, left: safeAreaLeft, right: safeAreaRight, height: safeAreaHeight, width: safeAreaWidth } = safeArea!;
const { top: safeAreaInsetsTop, bottom: safeAreaInsetsBottom, left: safeAreaInsetsLeft, right: safeAreaInsetsRight } = safeAreaInsets!;
return {
deviceId,
deviceBrand,
deviceModel,
deviceType,
devicePixelRatio,
deviceOrientation,
osName,
osVersion,
osLanguage,
osTheme,
osAndroidAPILevel,
romName,
romVersion,
browserName,
browserVersion,
hostFontSizeSetting,
hostSDKVersion,
hostName,
hostVersion,
hostLanguage,
hostTheme,
hostPackageName,
uniPlatform,
uniCompileVersion,
uniRuntimeVersion,
appId,
appName,
appVersion,
appVersionCode,
appLanguage,
appWgtVersion,
ua,
screenWidth,
screenHeight,
windowWidth,
windowHeight,
windowTop,
windowBottom,
statusBarHeight,
safeAreaTop,
safeAreaBottom,
safeAreaLeft,
safeAreaRight,
safeAreaHeight,
safeAreaWidth,
safeAreaInsetsTop,
safeAreaInsetsBottom,
safeAreaInsetsLeft,
safeAreaInsetsRight,
benchmarkLevel,
batteryLevel,
currentBattery,
navigationBarHeight,
titleBarHeight,
albumAuthorized,
cameraAuthorized,
locationAuthorized,
microphoneAuthorized,
notificationAuthorized,
notificationAlertAuthorized,
notificationBadgeAuthorized,
notificationSoundAuthorized,
bluetoothEnabled,
locationEnabled,
wifiEnabled,
cacheLocation,
storage,
};
};

12
src/main.ts
View File

@ -4,12 +4,12 @@ import { setupStore } from '@/state';
import 'uno.css';
export function createApp() {
const app = createSSRApp(App);
const app = createSSRApp(App);
// Configure store
setupStore(app);
// Configure store
setupStore(app);
return {
app,
};
return {
app,
};
}

136
src/pages/about/index.vue
View File

@ -1,82 +1,74 @@
<script lang="ts" setup>
import { ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import BasicButton from '@/components/BasicButton/index.vue';
import AppProvider from '@/components/AppProvider/inedx.vue';
import { useAuthStore } from '@/state/modules/auth';
import { useRouter } from '@/hooks/router';
import { ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import BasicButton from '@/components/BasicButton/index.vue';
import AppProvider from '@/components/AppProvider/inedx.vue';
import { useAuthStore } from '@/state/modules/auth';
import { useRouter } from '@/hooks/router';
const authStore = useAuthStore();
const isLogin = ref(false);
const router = useRouter();
onShow(() => {
isLogin.value = authStore.isLogin;
});
const handleJump = (url: string) => {
router.push(url);
};
const authStore = useAuthStore();
const isLogin = ref(false);
const router = useRouter();
onShow(() => {
isLogin.value = authStore.isLogin;
});
const handleJump = (url: string) => {
router.push(url);
};
// 登出
const handleLoginOut = () => {
authStore.loginOut().then(() => {
isLogin.value = false;
});
};
// 登出
const handleLoginOut = () => {
authStore.loginOut().then(() => {
isLogin.value = false;
});
};
</script>
<template>
<AppProvider>
<view class="container">
<view class="head-wrap">
<view class="avatar">
<image class="img" src="/static/images/avatar.png" />
</view>
<view class="desc">{{ isLogin ? '测试' : '未登入' }}</view>
</view>
<view class="cell"
><BasicButton @click="handleJump('/pages/log/index?id=4345&title=log')"
>log</BasicButton
></view
>
<view class="cell" v-if="isLogin"
><BasicButton @click="handleLoginOut">登出</BasicButton></view
>
<view class="cell" v-else>
<BasicButton @click="handleJump('/pages/login/index')">
登入
</BasicButton>
</view>
</view>
</AppProvider>
<AppProvider>
<view class="container">
<view class="head-wrap">
<view class="avatar">
<image class="img" src="/static/images/avatar.png" />
</view>
<view class="desc">{{ isLogin ? '测试' : '未登入' }}</view>
</view>
<view class="cell"><BasicButton @click="handleJump('/pages/log/index?id=4345&title=log')">log</BasicButton></view>
<view class="cell" v-if="isLogin"><BasicButton @click="handleLoginOut">登出</BasicButton></view>
<view class="cell" v-else>
<BasicButton @click="handleJump('/pages/login/index')"> 登入 </BasicButton>
</view>
</view>
</AppProvider>
</template>
<style lang="scss" scoped>
.container {
padding: 96rpx 24rpx;
.head-wrap {
display: flex;
flex-direction: column;
align-items: center;
.avatar {
height: 120rpx;
width: 120rpx;
border: 2rpx solid #d1d5db;
border-radius: 120rpx;
overflow: hidden;
padding: 6rpx;
.img {
height: 100%;
width: 100%;
}
}
.desc {
font-size: 28rpx;
line-height: 120rpx;
}
}
.cell {
margin-top: 60rpx;
text-align: center;
}
}
.container {
padding: 96rpx 24rpx;
.head-wrap {
display: flex;
flex-direction: column;
align-items: center;
.avatar {
height: 120rpx;
width: 120rpx;
border: 2rpx solid #d1d5db;
border-radius: 120rpx;
overflow: hidden;
padding: 6rpx;
.img {
height: 100%;
width: 100%;
}
}
.desc {
font-size: 28rpx;
line-height: 120rpx;
}
}
.cell {
margin-top: 60rpx;
text-align: center;
}
}
</style>

34
src/pages/demo/index.vue
View File

@ -1,26 +1,26 @@
<script lang="ts" setup>
import BasicButton from '@/components/BasicButton/index.vue';
import AppProvider from '@/components/AppProvider/inedx.vue';
import { useRouter } from '@/hooks/router';
import BasicButton from '@/components/BasicButton/index.vue';
import AppProvider from '@/components/AppProvider/inedx.vue';
import { useRouter } from '@/hooks/router';
const router = useRouter();
const jumpList1 = () => {
router.push('/pagesA/list/test1/index?key=words&page=1&limit=15');
};
const router = useRouter();
const jumpList1 = () => {
router.push('/pagesA/list/test1/index?key=words&page=1&limit=15');
};
</script>
<template>
<AppProvider>
<view class="container"> 页面构建中... </view>
<view class="_u_center">
<BasicButton @click="jumpList1">List1 → </BasicButton>
</view>
</AppProvider>
<AppProvider>
<view class="container"> 页面构建中... </view>
<view class="_u_center">
<BasicButton @click="jumpList1">List1 → </BasicButton>
</view>
</AppProvider>
</template>
<style lang="scss" scoped>
.container {
padding: 128rpx 0;
text-align: center;
}
.container {
padding: 128rpx 0;
text-align: center;
}
</style>

112
src/pages/index/index.vue
View File

@ -1,69 +1,69 @@
<script setup lang="ts">
import { ref } from 'vue';
import BasicButton from '@/components/BasicButton/index.vue';
import AppProvider from '@/components/AppProvider/inedx.vue';
import { useRouter } from '@/hooks/router';
import { CURRENT_PLATFORM, PLATFORMS } from '@/enums/platformEnum';
import { judgePlatform } from '@/utils/platform';
import Iconify from '@/components/Iconify/index.vue';
import { ref } from 'vue';
import BasicButton from '@/components/BasicButton/index.vue';
import AppProvider from '@/components/AppProvider/inedx.vue';
import { useRouter } from '@/hooks/router';
import { CURRENT_PLATFORM, PLATFORMS } from '@/enums/platformEnum';
import { judgePlatform } from '@/utils/platform';
import Iconify from '@/components/Iconify/index.vue';
const title = ref('uni-app vue3 ts --Vite');
const title = ref('uni-app vue3 ts --Vite');
const platform = CURRENT_PLATFORM;
const platform = CURRENT_PLATFORM;
const isVue3 = judgePlatform(PLATFORMS.VUE3);
const isVue3 = judgePlatform(PLATFORMS.VUE3);
const router = useRouter();
const handleGetStarted = () => {
router.pushTab('/pages/demo/index');
// router.push('/pages/log/index?id=4345&title=log');
};
const router = useRouter();
const handleGetStarted = () => {
router.pushTab('/pages/demo/index');
// router.push('/pages/log/index?id=4345&title=log');
};
</script>
<template>
<AppProvider>
<view class="content">
<image class="logo" src="/static/svg/LOGO.svg" />
<view class="text-area">
<text class="">{{ title }}</text>
</view>
<view class="text-area">
<text class="">是否是Vue3: {{ isVue3 }}</text>
</view>
<view class="text-area">
<text class="_u_text-red">当前平台: {{ platform }}</text>
</view>
<BasicButton @click="handleGetStarted">Get Started → </BasicButton>
<view class="_u_text-red">uno css</view>
<Iconify icon="i-ph-anchor-simple-thin" size="65" />
<Iconify icon="i-system-uicons-book-text" />
<Iconify icon="i-system-uicons-battery-full" size="65" />
<Iconify icon="i-system-uicons-box-add" :size="65" />
<Iconify icon="i-system-uicons-bell-snooze" color="red" :size="65" />
</view>
</AppProvider>
<AppProvider>
<view class="content">
<image class="logo" src="/static/svg/LOGO.svg" />
<view class="text-area">
<text class="">{{ title }}</text>
</view>
<view class="text-area">
<text class="">是否是Vue3: {{ isVue3 }}</text>
</view>
<view class="text-area">
<text class="_u_text-red">当前平台: {{ platform }}</text>
</view>
<BasicButton @click="handleGetStarted">Get Started → </BasicButton>
<view class="_u_text-red">uno css</view>
<Iconify icon="i-ph-anchor-simple-thin" size="65" />
<Iconify icon="i-system-uicons-book-text" />
<Iconify icon="i-system-uicons-battery-full" size="65" />
<Iconify icon="i-system-uicons-box-add" :size="65" />
<Iconify icon="i-system-uicons-bell-snooze" color="red" :size="65" />
</view>
</AppProvider>
</template>
<style lang="scss">
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.logo {
height: 200rpx;
width: 200rpx;
margin: 280rpx auto 50rpx;
}
.logo {
height: 200rpx;
width: 200rpx;
margin: 280rpx auto 50rpx;
}
.text-area {
display: flex;
justify-content: center;
margin-bottom: 60rpx;
}
.text-area {
display: flex;
justify-content: center;
margin-bottom: 60rpx;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>

10
src/pages/log/index.vue
View File

@ -1,13 +1,13 @@
<template>
<view style="line-height: 88rpx; text-align: center">登录后访问log</view>
<view style="line-height: 88rpx; text-align: center">登录后访问log</view>
</template>
<script lang="ts" setup>
import { onLoad } from '@dcloudio/uni-app';
import { onLoad } from '@dcloudio/uni-app';
onLoad(query => {
console.log('log onLoad', query);
});
onLoad((query) => {
console.log('log onLoad', query);
});
</script>
<style lang="scss" scoped></style>

168
src/pages/login/index.vue
View File

@ -1,99 +1,91 @@
<script setup lang="ts">
import { reactive, ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { useAuthStore } from '@/state/modules/auth';
import { Toast } from '@/utils/uniapi/prompt';
import { useRouter } from '@/hooks/router';
import { reactive, ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { useAuthStore } from '@/state/modules/auth';
import { Toast } from '@/utils/uniapi/prompt';
import { useRouter } from '@/hooks/router';
const redirect = ref<string | undefined>(undefined);
onLoad(query => {
redirect.value = query.redirect
? decodeURIComponent(query.redirect)
: undefined;
});
const redirect = ref<string | undefined>(undefined);
onLoad((query) => {
redirect.value = query.redirect ? decodeURIComponent(query.redirect) : undefined;
});
const router = useRouter();
const router = useRouter();
const form = reactive({
email: 'uni-app@test.com',
password: 'Vue3_Ts_Vite',
});
const authStore = useAuthStore();
const submit = (e: any) => {
authStore.login(e.detail.value).then(() => {
Toast('登录成功', { duration: 1500 });
setTimeout(() => {
if (redirect.value) {
router.go(redirect.value, { replace: true });
return;
}
router.pushTab('/pages/about/index');
}, 1500);
});
};
const form = reactive({
email: 'uni-app@test.com',
password: 'Vue3_Ts_Vite',
});
const authStore = useAuthStore();
const submit = (e: any) => {
authStore.login(e.detail.value).then(() => {
Toast('登录成功', { duration: 1500 });
setTimeout(() => {
if (redirect.value) {
router.go(redirect.value, { replace: true });
return;
}
router.pushTab('/pages/about/index');
}, 1500);
});
};
</script>
<template>
<view class="container">
<view class="title">登录</view>
<view class="form-wrap">
<form class="form" @submit="submit">
<label class="form-item">
<view class="form-label">邮箱:</view>
<view class="form-element"
><input name="email" :value="form.email"
/></view>
</label>
<label class="form-item">
<view class="form-label">密码:</view>
<view class="form-element"
><input type="password" name="password" :value="form.password"
/></view>
</label>
<button form-type="submit" class="submit-btn" hover-class="none"
>登录</button
>
</form>
</view>
</view>
<view class="container">
<view class="title">登录</view>
<view class="form-wrap">
<form class="form" @submit="submit">
<label class="form-item">
<view class="form-label">邮箱:</view>
<view class="form-element"><input name="email" :value="form.email" /></view>
</label>
<label class="form-item">
<view class="form-label">密码:</view>
<view class="form-element"><input type="password" name="password" :value="form.password" /></view>
</label>
<button form-type="submit" class="submit-btn" hover-class="none">登录</button>
</form>
</view>
</view>
</template>
<style lang="scss" scoped>
.container {
margin: 0 auto;
width: 80%;
.title {
padding: 320rpx 0 32rpx 0;
text-align: center;
}
.form-wrap {
padding: 20rpx 24rpx;
box-shadow: 16rpx 16rpx 30rpx #e5e7eb;
.form {
.form-item {
display: flex;
height: 88rpx;
border-bottom: 2rpx solid #dbeafe;
align-items: center;
.form-label {
min-width: 96rpx;
}
.form-element {
flex-grow: 1;
}
}
.submit-btn {
margin-top: 44rpx;
border: 4rpx solid #bfdbfe;
background-color: #60a5fa;
border-radius: 8rpx;
font-size: 28rpx;
color: #ffffff;
:hover {
background-color: #3b82f6;
}
}
}
}
}
.container {
margin: 0 auto;
width: 80%;
.title {
padding: 320rpx 0 32rpx 0;
text-align: center;
}
.form-wrap {
padding: 20rpx 24rpx;
box-shadow: 16rpx 16rpx 30rpx #e5e7eb;
.form {
.form-item {
display: flex;
height: 88rpx;
border-bottom: 2rpx solid #dbeafe;
align-items: center;
.form-label {
min-width: 96rpx;
}
.form-element {
flex-grow: 1;
}
}
.submit-btn {
margin-top: 44rpx;
border: 4rpx solid #bfdbfe;
background-color: #60a5fa;
border-radius: 8rpx;
font-size: 28rpx;
color: #ffffff;
:hover {
background-color: #3b82f6;
}
}
}
}
}
</style>

48
src/pages/notFound/404.vue
View File

@ -1,33 +1,33 @@
<script lang="ts" setup>
import { onLoad } from '@dcloudio/uni-app';
import { ref } from 'vue';
import BasicButton from '@/components/BasicButton/index.vue';
import { useRouter } from '@/hooks/router';
import { onLoad } from '@dcloudio/uni-app';
import { ref } from 'vue';
import BasicButton from '@/components/BasicButton/index.vue';
import { useRouter } from '@/hooks/router';
const go = ref<string>('');
const router = useRouter();
const redirect = ref<string>('');
onLoad(query => {
go.value = query.go || '';
redirect.value = query.redirect || '';
});
const go = ref<string>('');
const router = useRouter();
const redirect = ref<string>('');
onLoad((query) => {
go.value = query.go || '';
redirect.value = query.redirect || '';
});
/**
* 返回首页
*/
const backHome = () => {
router.pushTab(redirect.value);
};
/**
* 返回首页
*/
const backHome = () => {
router.pushTab(redirect.value);
};
</script>
<template>
<view class="w-screen flex flex-col items-center pt-320rpx">
<image class="w-360rpx" mode="widthFix" src="/static/svg/weep.svg" />
<view class="mb-40rpx">
<text>{{ go }} 页面找不到了~</text>
</view>
<BasicButton @click="backHome">返回首页</BasicButton>
</view>
<view class="w-screen flex flex-col items-center pt-320rpx">
<image class="w-360rpx" mode="widthFix" src="/static/svg/weep.svg" />
<view class="mb-40rpx">
<text>{{ go }} 页面找不到了~</text>
</view>
<BasicButton @click="backHome">返回首页</BasicButton>
</view>
</template>
<style lang="scss" scoped></style>

2
src/pages/template/index.vue
View File

@ -1,7 +1,7 @@
<script lang="ts" setup></script>
<template>
<view> 页面模板,新建pages,将此页面内容复制粘贴到新建.vue文件 </view>
<view> 页面模板,新建pages,将此页面内容复制粘贴到新建.vue文件 </view>
</template>
<style lang="scss" scoped></style>

18
src/pagesA/list/test1/index.vue
View File

@ -1,16 +1,14 @@
<script lang="ts" setup>
import BasicButton from '@/components/BasicButton/index.vue';
import { useRouter } from '@/hooks/router';
import BasicButton from '@/components/BasicButton/index.vue';
import { useRouter } from '@/hooks/router';
const router = useRouter();
const jumpTest2 = () => {
router.push('/pagesA/list/test2/index?id=256');
};
const router = useRouter();
const jumpTest2 = () => {
router.push('/pagesA/list/test2/index?id=256');
};
</script>
<template>
<view class="_u_center"> Test1 </view>
<view class="_u_center"
><BasicButton @click="jumpTest2">Test2 → </BasicButton></view
>
<view class="_u_center"> Test1 </view>
<view class="_u_center"><BasicButton @click="jumpTest2">Test2 → </BasicButton></view>
</template>
<style scoped></style>

20
src/pagesA/list/test2/index.vue
View File

@ -1,16 +1,16 @@
<script lang="ts" setup>
import BasicButton from '@/components/BasicButton/index.vue';
import { useRouter } from '@/hooks/router';
import BasicButton from '@/components/BasicButton/index.vue';
import { useRouter } from '@/hooks/router';
const router = useRouter();
const jumpDetail = () => {
router.push('/pagesB/detail/index?page=1&limit=20');
};
const router = useRouter();
const jumpDetail = () => {
router.push('/pagesB/detail/index?page=1&limit=20');
};
</script>
<template>
<view>
<view> Test2 </view>
<BasicButton @click="jumpDetail">Detail → </BasicButton>
</view>
<view>
<view> Test2 </view>
<BasicButton @click="jumpDetail">Detail → </BasicButton>
</view>
</template>
<style scoped></style>

2
src/pagesB/detail/index.vue
View File

@ -1,3 +1,3 @@
<script lang="ts" setup></script>
<template> Detail </template>
<template>Detail</template>
<style scoped></style>

14
src/services/api/auth.ts
View File

@ -9,23 +9,23 @@ const REFRESH_TOKEN = '/refresh/token';
* @param params
*/
export function login(params: LoginParams) {
return request.post<LoginModel>(LOGIN, params, {
custom: {
auth: false,
},
});
return request.post<LoginModel>(LOGIN, params, {
custom: {
auth: false,
},
});
}
/**
* 登出
*/
export function logout() {
return request.post(LOGIN_OUT, {});
return request.post(LOGIN_OUT, {});
}
/**
* 刷新token
*/
export function refreshToken() {
return request.post<LoginModel>(REFRESH_TOKEN, {});
return request.post<LoginModel>(REFRESH_TOKEN, {});
}

6
src/services/model/authModel.d.ts vendored
View File

@ -1,7 +1,7 @@
declare interface LoginParams {
email: string;
password: string;
email: string;
password: string;
}
declare interface LoginModel {
token: string;
token: string;
}

6
src/services/model/baseModel.d.ts vendored
View File

@ -1,5 +1,5 @@
declare interface API<T = any> {
code: number;
data?: T;
message: string;
code: number;
data?: T;
message: string;
}

9
src/settings/encryptionSetting.ts
View File

@ -2,16 +2,13 @@ import { getEnvValue, getPkgVersion, isDevMode } from '@/utils/env';
// System default cache time, in seconds
export const DEFAULT_CACHE_TIME = 60 * 60 * 24 * 7;
const PREFIX =
getEnvValue<string>('VITE_APP_CACHE_PREFIX') ||
getEnvValue<string>('VITE_APP_TITLE') ||
'UNI_APP_VUE3_TS';
const PREFIX = getEnvValue<string>('VITE_APP_CACHE_PREFIX') || getEnvValue<string>('VITE_APP_TITLE') || 'UNI_APP_VUE3_TS';
export const DEFAULT_PREFIX_KEY = `${PREFIX}${getPkgVersion()}`;
// aes encryption key
export const cacheCipher = {
key: 'aQ0{gD1@c_0@oH5:',
iv: 'aF0#gC_$hE1$eA1!',
key: 'aQ0{gD1@c_0@oH5:',
iv: 'aF0#gC_$hE1$eA1!',
};
// Whether the system cache is encrypted using aes

10
src/state/app.ts
View File

@ -1,12 +1,12 @@
import { defineStore } from 'pinia';
interface AppState {
sys?: string | number;
sys?: string | number;
}
export const useAppStore = defineStore({
id: 'app-store',
state: (): AppState => ({}),
getters: {},
actions: {},
id: 'app-store',
state: (): AppState => ({}),
getters: {},
actions: {},
});

2
src/state/index.ts
View File

@ -4,7 +4,7 @@ import { createPinia } from 'pinia';
const store = createPinia();
export function setupStore(app: App<Element>) {
app.use(store);
app.use(store);
}
export { store };

110
src/state/modules/auth.ts
View File

@ -4,62 +4,62 @@ import { TOKEN_KEY } from '@/enums/cacheEnum';
import { login, logout, refreshToken } from '@/services/api/auth';
interface AuthState {
token?: string;
token?: string;
}
export const useAuthStore = defineStore({
id: 'auth',
state: (): AuthState => ({
token: undefined,
}),
getters: {
getToken: state => state.token,
isLogin: (state): boolean => !!state.token,
},
actions: {
initToken() {
this.token = getCache<string>(TOKEN_KEY) || undefined;
},
setToken(token: string | undefined) {
setCache(TOKEN_KEY, token);
this.token = token;
},
/**
* @description 登录
*/
async login(params: LoginParams): Promise<LoginModel> {
try {
const { data } = await login(params);
this.setToken(data.token);
return Promise.resolve(data);
} catch (err: any) {
return Promise.reject(err);
}
},
/**
* @description 登出
*/
async loginOut(): Promise<any> {
try {
const res = await logout();
removeCache(TOKEN_KEY);
this.setToken(undefined);
return Promise.resolve(res);
} catch (err: any) {
return Promise.reject(err);
}
},
/**
* @description 刷新token
*/
async refreshToken(): Promise<LoginModel> {
try {
const { data } = await refreshToken();
this.setToken(data.token);
return Promise.resolve(data);
} catch (err: any) {
return Promise.reject(err);
}
},
},
id: 'auth',
state: (): AuthState => ({
token: undefined,
}),
getters: {
getToken: (state) => state.token,
isLogin: (state): boolean => !!state.token,
},
actions: {
initToken() {
this.token = getCache<string>(TOKEN_KEY) || undefined;
},
setToken(token: string | undefined) {
setCache(TOKEN_KEY, token);
this.token = token;
},
/**
* @description 登录
*/
async login(params: LoginParams): Promise<LoginModel> {
try {
const { data } = await login(params);
this.setToken(data.token);
return Promise.resolve(data);
} catch (err: any) {
return Promise.reject(err);
}
},
/**
* @description 登出
*/
async loginOut(): Promise<any> {
try {
const res = await logout();
removeCache(TOKEN_KEY);
this.setToken(undefined);
return Promise.resolve(res);
} catch (err: any) {
return Promise.reject(err);
}
},
/**
* @description 刷新token
*/
async refreshToken(): Promise<LoginModel> {
try {
const { data } = await refreshToken();
this.setToken(data.token);
return Promise.resolve(data);
} catch (err: any) {
return Promise.reject(err);
}
},
},
});

52
src/state/modules/router.ts
View File

@ -3,33 +3,33 @@ import { Route } from '@/types/router/route';
import { pagesMap } from '@/utils/router/routes';
interface routeStore {
routes: Map<string, Route> | undefined;
currentRouter: Route | undefined;
routes: Map<string, Route> | undefined;
currentRouter: Route | undefined;
}
export const useRouterStore = defineStore({
id: 'routerStore',
state: (): routeStore => ({
routes: undefined,
currentRouter: undefined,
}),
getters: {
getRoutes(state) {
return state.routes;
},
getCurrentRoute(state) {
return state.currentRouter;
},
},
actions: {
initialize() {
this.setRoutes();
},
setRoutes() {
this.routes = pagesMap;
},
setCurrentRoute(path: string) {
this.currentRouter = this.routes?.get(path) || undefined;
},
},
id: 'routerStore',
state: (): routeStore => ({
routes: undefined,
currentRouter: undefined,
}),
getters: {
getRoutes(state) {
return state.routes;
},
getCurrentRoute(state) {
return state.currentRouter;
},
},
actions: {
initialize() {
this.setRoutes();
},
setRoutes() {
this.routes = pagesMap;
},
setCurrentRoute(path: string) {
this.currentRouter = this.routes?.get(path) || undefined;
},
},
});

10
src/state/modules/user.ts
View File

@ -1,12 +1,12 @@
import { defineStore } from 'pinia';
interface UserState {
id?: string | number;
id?: string | number;
}
export const useUserStore = defineStore({
id: 'user',
state: (): UserState => ({}),
getters: {},
actions: {},
id: 'user',
state: (): UserState => ({}),
getters: {},
actions: {},
});

26
src/types/env.d.ts vendored
View File

@ -1,23 +1,23 @@
// / <reference types="vite/client" />
declare module '*.vue' {
import { DefineComponent } from 'vue';
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
const component: DefineComponent<{}, {}, any>;
export default component;
import { DefineComponent } from 'vue';
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
const component: DefineComponent<{}, {}, any>;
export default component;
}
interface ImportMetaEnv {
readonly VITE_ENV: string;
readonly VITE_APP_TITLE: string;
readonly VITE_BASE_URL: string;
readonly VITE_UPLOAD_URL: string;
readonly VITE_PROD: boolean;
readonly VITE_DEV: boolean;
readonly VITE_APP_CACHE_PREFIX: string;
readonly VITE_PORT: number;
readonly VITE_ENV: string;
readonly VITE_APP_TITLE: string;
readonly VITE_BASE_URL: string;
readonly VITE_UPLOAD_URL: string;
readonly VITE_PROD: boolean;
readonly VITE_DEV: boolean;
readonly VITE_APP_CACHE_PREFIX: string;
readonly VITE_PORT: number;
}
interface ImportMeta {
readonly env: ImportMetaEnv;
readonly env: ImportMetaEnv;
}

42
src/types/router/route.d.ts vendored
View File

@ -2,31 +2,31 @@ import { types } from 'sass';
import Boolean = types.Boolean;
export interface Route extends Record<string, any> {
path: string;
meta?: {
ignoreAuth?: boolean;
tabBar: boolean;
};
style: {
navigationBarTitleText: string;
[key: string]: string | boolean;
};
path: string;
meta?: {
ignoreAuth?: boolean;
tabBar: boolean;
};
style: {
navigationBarTitleText: string;
[key: string]: string | boolean;
};
}
export interface SubPackages {
root: string;
pages: Route[];
root: string;
pages: Route[];
}
export interface RouteLocationNormalized {
/* 当前页面栈的实例 */
currentPages: Page.PageInstance<AnyObject, {}>[];
/* 当前页面的实例 */
currentPage: Page.PageInstance;
/* 当前页面在pages.json中的配置 */
currentRoute?: Route;
/* 当前页面的path */
path?: string;
/* 当前页面的url参数 */
query: Record<string, string | string[]>;
/* 当前页面栈的实例 */
currentPages: Page.PageInstance<AnyObject, {}>[];
/* 当前页面的实例 */
currentPage: Page.PageInstance | undefined;
/* 当前页面在pages.json中的配置 */
currentRoute?: Route;
/* 当前页面的path */
path?: string;
/* 当前页面的url参数 */
query: Record<string, string | string[]>;
}

31
src/utils/cache/index.ts vendored
View File

@ -1,37 +1,28 @@
import { createStorage, CreateStorageParams } from './storageCache';
import {
cacheCipher,
DEFAULT_CACHE_TIME,
DEFAULT_PREFIX_KEY,
enableStorageEncryption,
} from '@/settings/encryptionSetting';
import { cacheCipher, DEFAULT_CACHE_TIME, DEFAULT_PREFIX_KEY, enableStorageEncryption } from '@/settings/encryptionSetting';
const options: Partial<CreateStorageParams> = {
prefixKey: DEFAULT_PREFIX_KEY,
key: cacheCipher.key,
iv: cacheCipher.iv,
hasEncrypt: enableStorageEncryption,
timeout: DEFAULT_CACHE_TIME,
prefixKey: DEFAULT_PREFIX_KEY,
key: cacheCipher.key,
iv: cacheCipher.iv,
hasEncrypt: enableStorageEncryption,
timeout: DEFAULT_CACHE_TIME,
};
export const storage = createStorage(options);
export function setCache(
key: string,
value: any,
expire?: number | null,
): void {
storage.set(key, value, expire);
export function setCache(key: string, value: any, expire?: number | null): void {
storage.set(key, value, expire);
}
export function getCache<T = any>(key: string): T {
return storage.get<T>(key);
return storage.get<T>(key);
}
export function removeCache(key: string): void {
return storage.remove(key);
return storage.remove(key);
}
export function clearCache(): void {
return storage.clear();
return storage.clear();
}

190
src/utils/cache/storageCache.ts vendored
View File

@ -4,116 +4,110 @@ import { AesEncryption } from '@/utils/cipher';
import { isNullOrUnDef } from '@/utils/is';
export interface CreateStorageParams extends EncryptionParams {
prefixKey: string;
hasEncrypt: boolean;
timeout?: number | null;
prefixKey: string;
hasEncrypt: boolean;
timeout?: number | null;
}
export const createStorage = ({
prefixKey = '',
key = cacheCipher.key,
iv = cacheCipher.iv,
timeout = null,
hasEncrypt = true,
prefixKey = '',
key = cacheCipher.key,
iv = cacheCipher.iv,
timeout = null,
hasEncrypt = true,
}: Partial<CreateStorageParams> = {}) => {
if (hasEncrypt && [key.length, iv.length].some(item => item !== 16)) {
throw new Error('When hasEncrypt is true, the key or iv must be 16 bits!');
}
if (hasEncrypt && [key.length, iv.length].some((item) => item !== 16)) {
throw new Error('When hasEncrypt is true, the key or iv must be 16 bits!');
}
const encryption = new AesEncryption({ key, iv });
const encryption = new AesEncryption({ key, iv });
/**
* Cache class
* Construction parameters can be passed into sessionStorage, localStorage,
* @class Cache
* @example
*/
class Storage {
private prefixKey?: string;
/**
* Cache class
* Construction parameters can be passed into sessionStorage, localStorage,
* @class Cache
* @example
*/
class Storage {
private prefixKey?: string;
private encryption: AesEncryption;
private encryption: AesEncryption;
private hasEncrypt: boolean;
private hasEncrypt: boolean;
/**
*
* @param {*} storage
*/
constructor() {
this.prefixKey = prefixKey;
this.encryption = encryption;
this.hasEncrypt = hasEncrypt;
}
/**
*
* @param {*} storage
*/
constructor() {
this.prefixKey = prefixKey;
this.encryption = encryption;
this.hasEncrypt = hasEncrypt;
}
private getKey(key: string) {
return `${this.prefixKey}${key}`.toUpperCase();
}
private getKey(key: string) {
return `${this.prefixKey}${key}`.toUpperCase();
}
/**
* Set cache
* @param {string} key
* @param {*} value
* @param {*} expire Expiration time in seconds
* @memberof Cache
*/
set(key: string, value: any, expire: number | null = timeout) {
try {
const stringData = JSON.stringify({
value,
time: Date.now(),
expire: !isNullOrUnDef(expire)
? new Date().getTime() + expire * 1000
: null,
});
const stringifyValue = this.hasEncrypt
? this.encryption.encryptByAES(stringData)
: stringData;
uni.setStorageSync(this.getKey(key), stringifyValue);
} catch (err) {
throw new Error(`setStorageSync error: ${err}`);
}
}
/**
* Set cache
* @param {string} key
* @param {*} value
* @param {*} expire Expiration time in seconds
* @memberof Cache
*/
set(key: string, value: any, expire: number | null = timeout) {
try {
const stringData = JSON.stringify({
value,
time: Date.now(),
expire: !isNullOrUnDef(expire) ? new Date().getTime() + expire * 1000 : null,
});
const stringifyValue = this.hasEncrypt ? this.encryption.encryptByAES(stringData) : stringData;
uni.setStorageSync(this.getKey(key), stringifyValue);
} catch (err) {
throw new Error(`setStorageSync error: ${err}`);
}
}
/**
* Read cache
* @param {string} key
* @param {*} def
* @memberof Cache
*/
get<T = any>(key: string, def: any = null): T {
const val = uni.getStorageSync(this.getKey(key));
if (!val) return def;
/**
* Read cache
* @param {string} key
* @param {*} def
* @memberof Cache
*/
get<T = any>(key: string, def: any = null): T {
const val = uni.getStorageSync(this.getKey(key));
if (!val) return def;
try {
const decVal = this.hasEncrypt
? this.encryption.decryptByAES(val)
: val;
const data = JSON.parse(decVal);
const { value, expire } = data;
if (isNullOrUnDef(expire) || expire < new Date().getTime()) {
this.remove(key);
return def;
}
return value;
} catch (e) {
return def;
}
}
try {
const decVal = this.hasEncrypt ? this.encryption.decryptByAES(val) : val;
const data = JSON.parse(decVal);
const { value, expire } = data;
if (isNullOrUnDef(expire) || expire < new Date().getTime()) {
this.remove(key);
return def;
}
return value;
} catch (e) {
return def;
}
}
/**
* Delete cache based on key
* @param {string} key
* @memberof Cache
*/
remove(key: string) {
uni.removeStorageSync(this.getKey(key));
}
/**
* Delete cache based on key
* @param {string} key
* @memberof Cache
*/
remove(key: string) {
uni.removeStorageSync(this.getKey(key));
}
/**
* Delete all caches of this instance
*/
clear(): void {
uni.clearStorageSync();
}
}
return new Storage();
/**
* Delete all caches of this instance
*/
clear(): void {
uni.clearStorageSync();
}
}
return new Storage();
};

58
src/utils/cipher.ts
View File

@ -7,43 +7,43 @@ import md5 from 'crypto-js/md5';
import Base64 from 'crypto-js/enc-base64';
export interface EncryptionParams {
key: string;
iv: string;
key: string;
iv: string;
}
/**
* AES 加密解密
*/
export class AesEncryption {
private key;
private key;
private iv;
private iv;
constructor(opt: Partial<EncryptionParams> = {}) {
const { key, iv } = opt;
if (key) {
this.key = parse(key);
}
if (iv) {
this.iv = parse(iv);
}
}
constructor(opt: Partial<EncryptionParams> = {}) {
const { key, iv } = opt;
if (key) {
this.key = parse(key);
}
if (iv) {
this.iv = parse(iv);
}
}
get getOptions() {
return {
mode: ECB,
padding: pkcs7,
iv: this.iv,
};
}
get getOptions() {
return {
mode: ECB,
padding: pkcs7,
iv: this.iv,
};
}
encryptByAES(cipherText: string) {
return encrypt(cipherText, this.key!, this.getOptions).toString();
}
encryptByAES(cipherText: string) {
return encrypt(cipherText, this.key!, this.getOptions).toString();
}
decryptByAES(cipherText: string) {
return decrypt(cipherText, this.key!, this.getOptions).toString(UTF8);
}
decryptByAES(cipherText: string) {
return decrypt(cipherText, this.key!, this.getOptions).toString(UTF8);
}
}
/**
@ -51,7 +51,7 @@ export class AesEncryption {
* @param cipherText
*/
export function encryptByBase64(cipherText: string) {
return UTF8.parse(cipherText).toString(Base64);
return UTF8.parse(cipherText).toString(Base64);
}
/**
@ -59,7 +59,7 @@ export function encryptByBase64(cipherText: string) {
* @param cipherText
*/
export function decodeByBase64(cipherText: string) {
return Base64.parse(cipherText).toString(UTF8);
return Base64.parse(cipherText).toString(UTF8);
}
/**
@ -67,5 +67,5 @@ export function decodeByBase64(cipherText: string) {
* @param password
*/
export function encryptByMd5(password: string) {
return md5(password).toString();
return md5(password).toString();
}

20
src/utils/env.ts
View File

@ -6,7 +6,7 @@ import { PLATFORMS } from '@/enums/platformEnum';
* @description: Generate cache key according to version
*/
export function getPkgVersion() {
return `${`__${pkg.version}`}__`.toUpperCase();
return `${`__${pkg.version}`}__`.toUpperCase();
}
/**
@ -25,7 +25,7 @@ export const prodMode = 'production';
* @example:
*/
export function getEnvMode(): string {
return isDevMode() ? devMode : prodMode;
return isDevMode() ? devMode : prodMode;
}
/**
@ -34,8 +34,8 @@ export function getEnvMode(): string {
* @example:
*/
export function getEnvValue<T = any>(key: string): T {
// @ts-ignore
return import.meta.env[key];
// @ts-ignore
return import.meta.env[key];
}
/**
@ -44,7 +44,7 @@ export function getEnvValue<T = any>(key: string): T {
* @example:
*/
export function isDevMode(): boolean {
return getEnvValue<boolean>('VITE_DEV');
return getEnvValue<boolean>('VITE_DEV');
}
/**
@ -53,7 +53,7 @@ export function isDevMode(): boolean {
* @example:
*/
export function isProdMode(): boolean {
return getEnvValue<boolean>('VITE_PROD');
return getEnvValue<boolean>('VITE_PROD');
}
/**
@ -62,8 +62,8 @@ export function isProdMode(): boolean {
* @example:
*/
export function getBaseUrl(): string {
if (judgePlatform(PLATFORMS.H5) && isDevMode()) return '/api';
return getEnvValue<string>('VITE_BASE_URL');
if (judgePlatform(PLATFORMS.H5) && isDevMode()) return '/api';
return getEnvValue<string>('VITE_BASE_URL');
}
/**
@ -72,6 +72,6 @@ export function getBaseUrl(): string {
* @example:
*/
export function getUploadUrl(): string {
if (judgePlatform(PLATFORMS.H5) && isDevMode()) return '/upload';
return getEnvValue<string>('VITE_UPLOAD_URL');
if (judgePlatform(PLATFORMS.H5) && isDevMode()) return '/upload';
return getEnvValue<string>('VITE_UPLOAD_URL');
}

74
src/utils/http/index.ts
View File

@ -7,18 +7,18 @@ import { ResultEnum } from '@/enums/httpEnum';
const BASE_URL = getBaseUrl();
const HEADER = {
'Content-Type': 'application/json;charset=UTF-8;',
Accept: 'application/json, text/plain, */*',
'Content-Type': 'application/json;charset=UTF-8;',
Accept: 'application/json, text/plain, */*',
};
function createRequest() {
return new Request({
baseURL: BASE_URL,
header: HEADER,
custom: {
auth: true,
},
});
return new Request({
baseURL: BASE_URL,
header: HEADER,
custom: {
auth: true,
},
});
}
const request = createRequest();
@ -26,40 +26,40 @@ const request = createRequest();
* 请求拦截器
*/
request.interceptors.request.use(
options => {
if (options.custom?.auth) {
const authStore = useAuthStore();
if (!authStore.isLogin) {
Toast('请先登录');
// token不存在跳转到登录页
return Promise.reject(options);
}
options.header = assign(options.header, {
authorization: `Bearer ${authStore.getToken}`,
});
}
return options;
},
options => Promise.reject(options),
(options) => {
if (options.custom?.auth) {
const authStore = useAuthStore();
if (!authStore.isLogin) {
Toast('请先登录');
// token不存在跳转到登录页
return Promise.reject(options);
}
options.header = assign(options.header, {
authorization: `Bearer ${authStore.getToken}`,
});
}
return options;
},
(options) => Promise.reject(options)
);
/**
* 响应拦截器
*/
request.interceptors.response.use(
async response => {
const { data: resData } = response;
const { code, message } = resData;
if (code === ResultEnum.SUCCESS) {
return resData as any;
}
Toast(message);
return Promise.reject(resData);
},
response =>
// 请求错误做点什么。可以使用async await 做异步操作
// error('Request Error!');
Promise.reject(response),
async (response) => {
const { data: resData } = response;
const { code, message } = resData;
if (code === ResultEnum.SUCCESS) {
return resData as any;
}
Toast(message);
return Promise.reject(resData);
},
(response) =>
// 请求错误做点什么。可以使用async await 做异步操作
// error('Request Error!');
Promise.reject(response)
);
export { request };

12
src/utils/index.ts
View File

@ -6,11 +6,9 @@ import { isObject } from '@/utils/is';
* @param target
*/
export function deepMerge<T = any>(src: any = {}, target: any = {}): T {
let key: string;
for (key in target) {
src[key] = isObject(src[key])
? deepMerge(src[key], target[key])
: (src[key] = target[key]);
}
return src;
let key: string;
for (key in target) {
src[key] = isObject(src[key]) ? deepMerge(src[key], target[key]) : (src[key] = target[key]);
}
return src;
}

9
src/utils/interceptors/index.ts
View File

@ -1,12 +1,9 @@
import {
routerInterceptor,
routerRemoveInterceptor,
} from '@/utils/router/interceptor';
import { routerInterceptor, routerRemoveInterceptor } from '@/utils/router/interceptor';
export function setupInterceptors() {
routerInterceptor();
routerInterceptor();
}
export function removeInterceptor() {
routerRemoveInterceptor();
routerRemoveInterceptor();
}

69
src/utils/is.ts
View File

@ -1,96 +1,91 @@
const { toString } = Object.prototype;
export function is(val: unknown, type: string) {
return toString.call(val) === `[object ${type}]`;
return toString.call(val) === `[object ${type}]`;
}
export function isDef<T = unknown>(val?: T): val is T {
return typeof val !== 'undefined';
return typeof val !== 'undefined';
}
export function isUnDef<T = unknown>(val?: T): val is T {
return !isDef(val);
return !isDef(val);
}
export function isObject(val: any): val is Record<any, any> {
return val !== null && is(val, 'Object');
return val !== null && is(val, 'Object');
}
export function isEmpty<T = unknown>(val: T): val is T {
if (isArray(val) || isString(val)) {
return val.length === 0;
}
if (isArray(val) || isString(val)) {
return val.length === 0;
}
if (val instanceof Map || val instanceof Set) {
return val.size === 0;
}
if (val instanceof Map || val instanceof Set) {
return val.size === 0;
}
if (isObject(val)) {
return Object.keys(val).length === 0;
}
if (isObject(val)) {
return Object.keys(val).length === 0;
}
return false;
return false;
}
export function isDate(val: unknown): val is Date {
return is(val, 'Date');
return is(val, 'Date');
}
export function isNull(val: unknown): val is null {
return val === null;
return val === null;
}
export function isNullAndUnDef(val: unknown): val is null | undefined {
return isUnDef(val) && isNull(val);
return isUnDef(val) && isNull(val);
}
export function isNullOrUnDef(val: unknown): val is null | undefined {
return isUnDef(val) || isNull(val);
return isUnDef(val) || isNull(val);
}
export function isNumber(val: unknown): val is number {
return is(val, 'Number');
return is(val, 'Number');
}
export function isPromise<T = any>(val: unknown): val is Promise<T> {
return (
is(val, 'Promise') &&
isObject(val) &&
isFunction(val.then) &&
isFunction(val.catch)
);
return is(val, 'Promise') && isObject(val) && isFunction(val.then) && isFunction(val.catch);
}
export function isString(val: unknown): val is string {
return is(val, 'String');
return is(val, 'String');
}
export function isFunction(val: unknown): val is Function {
return typeof val === 'function';
return typeof val === 'function';
}
export function isBoolean(val: unknown): val is boolean {
return is(val, 'Boolean');
return is(val, 'Boolean');
}
export function isRegExp(val: unknown): val is RegExp {
return is(val, 'RegExp');
return is(val, 'RegExp');
}
export function isArray(val: any): val is Array<any> {
return val && Array.isArray(val);
return val && Array.isArray(val);
}
export function isWindow(val: any): val is Window {
return typeof window !== 'undefined' && is(val, 'Window');
return typeof window !== 'undefined' && is(val, 'Window');
}
export function isElement(val: unknown): val is Element {
return isObject(val) && !!val.tagName;
return isObject(val) && !!val.tagName;
}
export function isMap(val: unknown): val is Map<any, any> {
return is(val, 'Map');
return is(val, 'Map');
}
export const isServer = typeof window === 'undefined';
@ -98,8 +93,8 @@ export const isServer = typeof window === 'undefined';
export const isClient = !isServer;
export function isUrl(path: string): boolean {
// @ts-ignore
const reg =
/^((https|http|ftp|rtsp|mms):\/\/)(([0-9a-zA-Z_!~*'().&=+$%-]+: )?[0-9a-zA-Z_!~*'().&=+$%-]+@)?(([0-9]{1,3}.){3}[0-9]{1,3}|([0-9a-zA-Z_!~*'()-]+.)*([0-9a-zA-Z][0-9a-zA-Z-]{0,61})?[0-9a-zA-Z].[a-zA-Z]{2,6})(:[0-9]{1,4})?((\/?)|(\/[0-9a-zA-Z_!~*'().;?:@&=+$,%#-]+)+\/?)$/;
return reg.test(path);
// @ts-ignore
const reg =
/^((https|http|ftp|rtsp|mms):\/\/)(([0-9a-zA-Z_!~*'().&=+$%-]+: )?[0-9a-zA-Z_!~*'().&=+$%-]+@)?(([0-9]{1,3}.){3}[0-9]{1,3}|([0-9a-zA-Z_!~*'()-]+.)*([0-9a-zA-Z][0-9a-zA-Z-]{0,61})?[0-9a-zA-Z].[a-zA-Z]{2,6})(:[0-9]{1,4})?((\/?)|(\/[0-9a-zA-Z_!~*'().;?:@&=+$,%#-]+)+\/?)$/;
return reg.test(path);
}

4
src/utils/log.ts
View File

@ -3,9 +3,9 @@ import { getEnvValue } from '@/utils/env';
const projectName = getEnvValue<string>('VITE_APP_TITLE');
export function warn(message: string) {
console.warn(`[${projectName} warn]:${message}`);
console.warn(`[${projectName} warn]:${message}`);
}
export function error(message: string) {
throw new Error(`[${projectName} error]:${message}`);
throw new Error(`[${projectName} error]:${message}`);
}

262
src/utils/platform.ts
View File

@ -7,136 +7,136 @@ import { PLATFORMS } from '@/enums/platformEnum';
* @return boolean
*/
export function judgePlatform(target: PLATFORMS): boolean {
let isVue3 = false;
let isAppPlus = false;
let isAppPlusNvue = false;
let isAppNvue = false;
let isH5 = false;
let isMp = false;
let isMpWeinxin = false;
let isMpAlipay = false;
let isMpBaidu = false;
let isMpToutiao = false;
let isMpLark = false;
let isMpQq = false;
let isMpKuaishou = false;
let isMpJd = false;
let isMp360 = false;
let isQuickAppWebView = false;
let isQuickAppWebViewUnion = false;
let isQuickAppWebViewHuawei = false;
let isVue3 = false;
let isAppPlus = false;
let isAppPlusNvue = false;
let isAppNvue = false;
let isH5 = false;
let isMp = false;
let isMpWeinxin = false;
let isMpAlipay = false;
let isMpBaidu = false;
let isMpToutiao = false;
let isMpLark = false;
let isMpQq = false;
let isMpKuaishou = false;
let isMpJd = false;
let isMp360 = false;
let isQuickAppWebView = false;
let isQuickAppWebViewUnion = false;
let isQuickAppWebViewHuawei = false;
switch (target) {
case PLATFORMS.VUE3:
/* #ifdef VUE3 */
isVue3 = true;
/* #endif */
return isVue3;
break;
case PLATFORMS.APP_PLUS:
/* #ifdef APP-PLUS */
isAppPlus = true;
/* #endif */
return isAppPlus;
break;
case PLATFORMS.APP_PLUS_NVUE:
/* #ifdef APP-PLUS-NVUE */
isAppPlusNvue = true;
/* #endif */
return isAppPlusNvue;
break;
case PLATFORMS.APP_NVUE:
/* #ifdef APP-NVUE */
isAppNvue = true;
/* #endif */
return isAppNvue;
break;
case PLATFORMS.H5:
/* #ifdef H5 */
isH5 = true;
/* #endif */
return isH5;
break;
case PLATFORMS.MP:
/* #ifdef MP */
isMp = true;
/* #endif */
return isMp;
break;
case PLATFORMS.MP_WEIXIN:
/* #ifdef MP-WEIXIN */
isMpWeinxin = true;
/* #endif */
return isMpWeinxin;
break;
case PLATFORMS.MP_ALIPAY:
/* #ifdef MP-ALIPAY */
isMpAlipay = true;
/* #endif */
return isMpAlipay;
break;
case PLATFORMS.MP_BAIDU:
/* #ifdef MP_BAIDU */
isMpBaidu = true;
/* #endif */
return isMpBaidu;
break;
case PLATFORMS.MP_TOUTIAO:
/* #ifdef MP-TOUTIAO */
isMpToutiao = true;
/* #endif */
return isMpToutiao;
break;
case PLATFORMS.MP_LARK:
/* #ifdef MP-LARK */
isMpLark = true;
/* #endif */
return isMpLark;
break;
case PLATFORMS.MP_QQ:
/* #ifdef MP-QQ */
isMpQq = true;
/* #endif */
return isMpQq;
break;
case PLATFORMS.MP_KUAISHOU:
/* #ifdef MP-KUAISHOU */
isMpKuaishou = true;
/* #endif */
return isMpKuaishou;
break;
case PLATFORMS.MP_JD:
/* #ifdef MP-JD */
isMpJd = true;
/* #endif */
return (isMpJd = true);
break;
case PLATFORMS.MP_360:
/* #ifdef MP-360 */
isMp360 = true;
/* #endif */
return isMp360;
break;
case PLATFORMS.QUICKAPP_WEBVIEW:
/* #ifdef QUICKAPP-WEBVIEW */
isQuickAppWebView = true;
/* #endif */
return isQuickAppWebView;
break;
case PLATFORMS.QUICKAPP_WEBVIEW_UNION:
/* #ifdef QUICKAPP-WEBVIEW-UNION */
isQuickAppWebViewUnion = true;
/* #endif */
return isQuickAppWebViewUnion;
break;
case PLATFORMS.QUICKAPP_WEBVIEW_HUAWEI:
/* #ifdef QUICKAPP-WEBVIEW-HUAWEI */
isQuickAppWebViewHuawei = true;
/* #endif */
return isQuickAppWebViewHuawei;
break;
default:
return false;
}
return false;
switch (target) {
case PLATFORMS.VUE3:
/* #ifdef VUE3 */
isVue3 = true;
/* #endif */
return isVue3;
break;
case PLATFORMS.APP_PLUS:
/* #ifdef APP-PLUS */
isAppPlus = true;
/* #endif */
return isAppPlus;
break;
case PLATFORMS.APP_PLUS_NVUE:
/* #ifdef APP-PLUS-NVUE */
isAppPlusNvue = true;
/* #endif */
return isAppPlusNvue;
break;
case PLATFORMS.APP_NVUE:
/* #ifdef APP-NVUE */
isAppNvue = true;
/* #endif */
return isAppNvue;
break;
case PLATFORMS.H5:
/* #ifdef H5 */
isH5 = true;
/* #endif */
return isH5;
break;
case PLATFORMS.MP:
/* #ifdef MP */
isMp = true;
/* #endif */
return isMp;
break;
case PLATFORMS.MP_WEIXIN:
/* #ifdef MP-WEIXIN */
isMpWeinxin = true;
/* #endif */
return isMpWeinxin;
break;
case PLATFORMS.MP_ALIPAY:
/* #ifdef MP-ALIPAY */
isMpAlipay = true;
/* #endif */
return isMpAlipay;
break;
case PLATFORMS.MP_BAIDU:
/* #ifdef MP_BAIDU */
isMpBaidu = true;
/* #endif */
return isMpBaidu;
break;
case PLATFORMS.MP_TOUTIAO:
/* #ifdef MP-TOUTIAO */
isMpToutiao = true;
/* #endif */
return isMpToutiao;
break;
case PLATFORMS.MP_LARK:
/* #ifdef MP-LARK */
isMpLark = true;
/* #endif */
return isMpLark;
break;
case PLATFORMS.MP_QQ:
/* #ifdef MP-QQ */
isMpQq = true;
/* #endif */
return isMpQq;
break;
case PLATFORMS.MP_KUAISHOU:
/* #ifdef MP-KUAISHOU */
isMpKuaishou = true;
/* #endif */
return isMpKuaishou;
break;
case PLATFORMS.MP_JD:
/* #ifdef MP-JD */
isMpJd = true;
/* #endif */
return (isMpJd = true);
break;
case PLATFORMS.MP_360:
/* #ifdef MP-360 */
isMp360 = true;
/* #endif */
return isMp360;
break;
case PLATFORMS.QUICKAPP_WEBVIEW:
/* #ifdef QUICKAPP-WEBVIEW */
isQuickAppWebView = true;
/* #endif */
return isQuickAppWebView;
break;
case PLATFORMS.QUICKAPP_WEBVIEW_UNION:
/* #ifdef QUICKAPP-WEBVIEW-UNION */
isQuickAppWebViewUnion = true;
/* #endif */
return isQuickAppWebViewUnion;
break;
case PLATFORMS.QUICKAPP_WEBVIEW_HUAWEI:
/* #ifdef QUICKAPP-WEBVIEW-HUAWEI */
isQuickAppWebViewHuawei = true;
/* #endif */
return isQuickAppWebViewHuawei;
break;
default:
return false;
}
return false;
}

24
src/utils/router/constant.ts
View File

@ -8,12 +8,12 @@ import { useRouter } from '@/hooks/router';
* @return boolean
*/
export function isIgnoreAuth(path: string): boolean {
const _path = filterPath(path);
const routerStore = useRouterStore();
const routes = routerStore.getRoutes;
if (!routes) return false;
const route = routes.get(_path);
return route === undefined ? true : !!route?.meta?.ignoreAuth;
const _path = filterPath(path);
const routerStore = useRouterStore();
const routes = routerStore.getRoutes;
if (!routes) return false;
const route = routes.get(_path);
return route === undefined ? true : !!route?.meta?.ignoreAuth;
}
/**
@ -21,10 +21,10 @@ export function isIgnoreAuth(path: string): boolean {
* @param path
*/
export function jumpLogin(path: string) {
const _path = path.startsWith('/') ? path : `/${path}`;
const pathQuery = encodeURIComponent(_path);
const router = useRouter();
router.push(`${LOGIN_PAGE}?redirect=${pathQuery}`);
const _path = path.startsWith('/') ? path : `/${path}`;
const pathQuery = encodeURIComponent(_path);
const router = useRouter();
router.push(`${LOGIN_PAGE}?redirect=${pathQuery}`);
}
/**
@ -33,6 +33,6 @@ export function jumpLogin(path: string) {
* @param prefix
*/
export function filterPath(url: string, prefix = '') {
const path = url.split('?')[0];
return prefix + (path.startsWith('/') ? path.substring(1) : path);
const path = url.split('?')[0];
return prefix + (path.startsWith('/') ? path.substring(1) : path);
}

86
src/utils/router/interceptor.ts
View File

@ -1,8 +1,4 @@
import {
HOME_PAGE,
NAVIGATE_TYPE_LIST,
NOT_FOUND_PAGE,
} from '@/enums/routerEnum';
import { HOME_PAGE, NAVIGATE_TYPE_LIST, NOT_FOUND_PAGE } from '@/enums/routerEnum';
import { useAuthStore } from '@/state/modules/auth';
import { isIgnoreAuth, jumpLogin } from '@/utils/router/constant';
@ -13,12 +9,12 @@ import { isIgnoreAuth, jumpLogin } from '@/utils/router/constant';
*/
export function routerBeforeEach(path: string): boolean {
const isIgnore = isIgnoreAuth(path);
if (isIgnore) return true;
const authStore = useAuthStore();
if (authStore.isLogin) return true;
jumpLogin(path);
return false;
const isIgnore = isIgnoreAuth(path);
if (isIgnore) return true;
const authStore = useAuthStore();
if (authStore.isLogin) return true;
jumpLogin(path);
return false;
}
/**
@ -30,50 +26,50 @@ export function routerBeforeEach(path: string): boolean {
* @export void
*/
function addInterceptor(routerName: string) {
uni.addInterceptor(routerName, {
// 跳转前拦截
invoke: args => {
const flag = routerBeforeEach(args.url);
return flag ? args : false;
},
// 成功回调拦截
success: () => {},
// 失败回调拦截
fail: (err: any) => {
let reg: RegExp;
/* #ifdef MP-WEIXIN */
reg = /(.*)?(fail page ")(.*)(" is not found$)/;
/* #endif */
/* #ifndef MP-WEIXIN */
reg = /(.*)?(fail page `)(.*)(` is not found$)/;
/* #endif */
if (reg.test(err.errMsg)) {
const go = err.errMsg.replace(reg, '$3') || '';
uni.navigateTo({
url: `${NOT_FOUND_PAGE}?redirect=${HOME_PAGE}&go=${go}`,
});
}
return false;
},
// 完成回调拦截
complete: () => {},
});
uni.addInterceptor(routerName, {
// 跳转前拦截
invoke: (args) => {
const flag = routerBeforeEach(args.url);
return flag ? args : false;
},
// 成功回调拦截
success: () => {},
// 失败回调拦截
fail: (err: any) => {
let reg: RegExp;
/* #ifdef MP-WEIXIN */
reg = /(.*)?(fail page ")(.*)(" is not found$)/;
/* #endif */
/* #ifndef MP-WEIXIN */
reg = /(.*)?(fail page `)(.*)(` is not found$)/;
/* #endif */
if (reg.test(err.errMsg)) {
const go = err.errMsg.replace(reg, '$3') || '';
uni.navigateTo({
url: `${NOT_FOUND_PAGE}?redirect=${HOME_PAGE}&go=${go}`,
});
}
return false;
},
// 完成回调拦截
complete: () => {},
});
}
/**
* 添加路由拦截器
*/
export function routerInterceptor() {
NAVIGATE_TYPE_LIST.forEach(item => {
addInterceptor(item);
});
NAVIGATE_TYPE_LIST.forEach((item) => {
addInterceptor(item);
});
}
/**
* 移除路由拦截器
*/
export function routerRemoveInterceptor() {
NAVIGATE_TYPE_LIST.forEach(item => {
uni.removeInterceptor(item);
});
NAVIGATE_TYPE_LIST.forEach((item) => {
uni.removeInterceptor(item);
});
}

202
src/utils/router/navigates.ts
View File

@ -7,117 +7,117 @@ import { useRouterStore } from '@/state/modules/router';
import { filterPath } from '@/utils/router/constant';
export type NavigateOptions = Partial<Omit<UniApp.NavigateToOptions, 'url'>> & {
delta?: number;
delta?: number;
};
export class Navigates {
private type: string;
private type: string;
private readonly options: NavigateOptions;
private readonly options: NavigateOptions;
constructor(type?: string, options?: NavigateOptions) {
this.type = type || NAVIGATE_TYPE.NAVIGATE_TO;
this.options = options || {};
}
constructor(type?: string, options?: NavigateOptions) {
this.type = type || NAVIGATE_TYPE.NAVIGATE_TO;
this.options = options || {};
}
navigate(url: string, options?: NavigateOptions) {
const navigateOptions = deepMerge(cloneDeep(this.options), options);
const _options = deepMerge({ url }, navigateOptions);
switch (this.type) {
case NAVIGATE_TYPE.NAVIGATE_TO:
uni.navigateTo(_options);
break;
case NAVIGATE_TYPE.REDIRECT_TO:
uni.redirectTo(_options);
break;
case NAVIGATE_TYPE.RE_LAUNCH:
uni.reLaunch(_options);
break;
case NAVIGATE_TYPE.SWITCH_TAB:
uni.switchTab(_options);
break;
case NAVIGATE_TYPE.NAVIGATE_BACK:
uni.navigateBack(navigateOptions);
break;
default:
warn('navigate Error');
break;
}
}
navigate(url: string, options?: NavigateOptions) {
const navigateOptions = deepMerge(cloneDeep(this.options), options);
const _options = deepMerge({ url }, navigateOptions);
switch (this.type) {
case NAVIGATE_TYPE.NAVIGATE_TO:
uni.navigateTo(_options);
break;
case NAVIGATE_TYPE.REDIRECT_TO:
uni.redirectTo(_options);
break;
case NAVIGATE_TYPE.RE_LAUNCH:
uni.reLaunch(_options);
break;
case NAVIGATE_TYPE.SWITCH_TAB:
uni.switchTab(_options);
break;
case NAVIGATE_TYPE.NAVIGATE_BACK:
uni.navigateBack(navigateOptions);
break;
default:
warn('navigate Error');
break;
}
}
/**
* uni.navigateTo
* @param url
* @param options
*/
push(url: string, options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.NAVIGATE_TO;
this.navigate(url, options);
}
/**
* uni.navigateTo
* @param url
* @param options
*/
push(url: string, options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.NAVIGATE_TO;
this.navigate(url, options);
}
/**
* uni.redirectTo
* @param url
* @param options
*/
replace(url: string, options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.REDIRECT_TO;
this.navigate(url, options);
}
/**
* uni.redirectTo
* @param url
* @param options
*/
replace(url: string, options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.REDIRECT_TO;
this.navigate(url, options);
}
/**
* uni.reLaunch
* @param url
* @param options
*/
replaceAll(url: string, options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.RE_LAUNCH;
this.navigate(url, options);
}
/**
* uni.reLaunch
* @param url
* @param options
*/
replaceAll(url: string, options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.RE_LAUNCH;
this.navigate(url, options);
}
/**
* uni.switchTab
* @param url
* @param options
*/
pushTab(url: string, options?: NavigateOptions) {
// 微信小程序端uni.switchTab拦截无效处理
/* #ifdef MP-WEIXIN */
if (!routerBeforeEach(url)) {
return;
}
/* #endif */
this.type = NAVIGATE_TYPE.SWITCH_TAB;
this.navigate(url, options);
}
/**
* uni.switchTab
* @param url
* @param options
*/
pushTab(url: string, options?: NavigateOptions) {
// 微信小程序端uni.switchTab拦截无效处理
/* #ifdef MP-WEIXIN */
if (!routerBeforeEach(url)) {
return;
}
/* #endif */
this.type = NAVIGATE_TYPE.SWITCH_TAB;
this.navigate(url, options);
}
/**
* uni.navigateBack
* @param options
*/
back(options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.NAVIGATE_BACK;
this.navigate('', options);
}
/**
* uni.navigateBack
* @param options
*/
back(options?: NavigateOptions) {
this.type = NAVIGATE_TYPE.NAVIGATE_BACK;
this.navigate('', options);
}
/**
* 自动判断跳转页面 (navigateTo|switchTab)
* @param url
* @param options
*/
go(url: string, options?: NavigateOptions & { replace?: boolean }) {
const path = filterPath(url);
const routerStore = useRouterStore();
const routes = routerStore.getRoutes;
const route = routes?.get(path);
if (route?.meta?.tabBar) {
this.pushTab(url, options);
return;
}
if (options?.replace) {
this.replace(url, options);
return;
}
this.push(url, options);
}
/**
* 自动判断跳转页面 (navigateTo|switchTab)
* @param url
* @param options
*/
go(url: string, options?: NavigateOptions & { replace?: boolean }) {
const path = filterPath(url);
const routerStore = useRouterStore();
const routes = routerStore.getRoutes;
const route = routes?.get(path);
if (route?.meta?.tabBar) {
this.pushTab(url, options);
return;
}
if (options?.replace) {
this.replace(url, options);
return;
}
this.push(url, options);
}
}

46
src/utils/router/routes.ts
View File

@ -7,35 +7,35 @@ const { pages, subPackages, tabBar } = pagesJson;
// 将pages.json转换成Map对象,path为key
const pagesMap = new Map<string, Route>();
pages.forEach(page => {
pagesMap.set(page.path, page as Route);
pages.forEach((page) => {
pagesMap.set(page.path, page as Route);
});
if (Array.isArray(subPackages) && subPackages.length) {
subPackages.forEach(el => {
const rootPath = el.root;
el.pages.forEach(page => {
page.path = `${rootPath}/${page.path}`;
pagesMap.set(page.path, page as Route);
});
});
subPackages.forEach((el) => {
const rootPath = el.root;
el.pages.forEach((page) => {
page.path = `${rootPath}/${page.path}`;
pagesMap.set(page.path, page as Route);
});
});
}
if (tabBar) {
const tabBarList = tabBar.list;
if (Array.isArray(tabBarList)) {
tabBarList.forEach(el => {
if (pagesMap.has(el.pagePath)) {
const page = pagesMap.get(el.pagePath);
const meta = page?.meta || {};
// @ts-ignore
meta.tabBar = true;
// @ts-ignore
page.meta = assign({}, meta);
pagesMap.set(el.pagePath, page as Route);
}
});
}
const tabBarList = tabBar.list;
if (Array.isArray(tabBarList)) {
tabBarList.forEach((el) => {
if (pagesMap.has(el.pagePath)) {
const page = pagesMap.get(el.pagePath);
const meta = page?.meta || {};
// @ts-ignore
meta.tabBar = true;
// @ts-ignore
page.meta = assign({}, meta);
pagesMap.set(el.pagePath, page as Route);
}
});
}
}
export { pagesMap };

48
src/utils/uniapi/index.ts
View File

@ -5,41 +5,41 @@
* @constructor
*/
export const SetClipboardData = (data: string, showToast = true) =>
new Promise((resolve, reject) => {
uni.setClipboardData({
data,
showToast,
success: res => {
resolve(res);
},
fail: err => {
reject(err);
},
});
});
new Promise((resolve, reject) => {
uni.setClipboardData({
data,
showToast,
success: (res) => {
resolve(res);
},
fail: (err) => {
reject(err);
},
});
});
/**
* @description 获取系统剪贴板内容
* @constructor
*/
export const GetClipboardData = () =>
new Promise((resolve, reject) => {
uni.getClipboardData({
success: res => {
resolve(res);
},
fail: err => {
reject(err);
},
});
});
new Promise((resolve, reject) => {
uni.getClipboardData({
success: (res) => {
resolve(res);
},
fail: (err) => {
reject(err);
},
});
});
/**
* rpx 换算为 px
* @param upx
*/
export const rpx2px = (upx: number) => {
return uni.upx2px(upx);
return uni.upx2px(upx);
};
/**
@ -47,5 +47,5 @@ export const rpx2px = (upx: number) => {
* @param upx
*/
export const px2rpx = (px: number) => {
return px / (uni.upx2px(100) / 100);
return px / (uni.upx2px(100) / 100);
};

82
src/utils/uniapi/prompt.ts
View File

@ -9,24 +9,21 @@
* @param options
* @constructor
*/
export function Toast(
title: string,
options?: Partial<UniApp.ShowToastOptions>,
) {
uni.showToast({
title,
duration: 1500,
icon: 'none',
mask: true,
...options,
});
export function Toast(title: string, options?: Partial<UniApp.ShowToastOptions>) {
uni.showToast({
title,
duration: 1500,
icon: 'none',
mask: true,
...options,
});
}
/**
* 隐藏消息提示框
*/
export function HideToast() {
uni.hideToast();
uni.hideToast();
}
/**
@ -35,22 +32,19 @@ export function HideToast() {
* @param options
* @constructor
*/
export function Loading(
title: string,
options?: Partial<UniApp.ShowLoadingOptions>,
) {
uni.showLoading({
title,
mask: true,
...options,
});
export function Loading(title: string, options?: Partial<UniApp.ShowLoadingOptions>) {
uni.showLoading({
title,
mask: true,
...options,
});
}
/**
* 隐藏 loading 提示框
*/
export function HideLoading() {
uni.hideLoading();
uni.hideLoading();
}
/**
@ -59,17 +53,17 @@ export function HideLoading() {
* @constructor
*/
export function Modal(options: UniApp.ShowModalOptions) {
return new Promise((resolve, reject) => {
uni.showModal({
...options,
success: res => {
resolve(res);
},
fail: res => {
reject(res);
},
});
});
return new Promise((resolve, reject) => {
uni.showModal({
...options,
success: (res) => {
resolve(res);
},
fail: (res) => {
reject(res);
},
});
});
}
/**
@ -78,15 +72,15 @@ export function Modal(options: UniApp.ShowModalOptions) {
* @constructor
*/
export function ActionSheet(options: UniApp.ShowActionSheetOptions) {
return new Promise((resolve, reject) => {
uni.showActionSheet({
...options,
success: res => {
resolve(res);
},
fail: res => {
reject(res);
},
});
});
return new Promise((resolve, reject) => {
uni.showActionSheet({
...options,
success: (res) => {
resolve(res);
},
fail: (res) => {
reject(res);
},
});
});
}