test/go-view
1
0
Fork 0
mirror of https://gitee.com/dromara/go-view.git synced 2024-11-29 18:28:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

修改样式细节，修改utils

Browse Source
This commit is contained in:
MTrun 2021-12-14 16:41:43 +08:00
parent 7e5d5aa067
commit 0b326c4e76
12 changed files with 98 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/axios.ts
View File

@ -1,7 +1,7 @@
import axios, { AxiosResponse, AxiosRequestConfig } from 'axios'
import { ResultEnum } from "@/enums/httpEnum"
import { ErrorPageNameMap } from "@/enums/pageEnum"
import { redirectErrorPage } from '@/utils'
import { redirectErrorPage } from '@/utils/page'
const axiosInstance = axios.create({
baseURL: import.meta.env.DEV ? import.meta.env.VITE_DEV_PATH : import.meta.env.VITE_PRO_PATH,

23
src/styles/common/animation.scss Normal file
View File

@ -0,0 +1,23 @@
.v-modal-enter {
animation: v-modal-in 0.2s ease;
}
.v-modal-leave {
animation: v-modal-out 0.2s ease forwards;
}
@keyframes v-modal-in {
0% {
opacity: 0;
}
100% {
}
}
@keyframes v-modal-out {
0% {
}
100% {
opacity: 0;
}
}

2
src/styles/common/mixins/config.scss
View File

@ -1,4 +1,4 @@
$namespace: 'go';
$theme-light: 'light';
$theme-dart: 'dart';
$theme-dark: 'dark';
$state-prefix: 'is-';

2
src/styles/common/mixins/mixins.scss
View File

@ -15,7 +15,7 @@
}
@mixin go-d($block) {
$B: $namespace + '-' + $theme-dart + '-' + $block !global;
$B: $namespace + '-' + $theme-dark + '-' + $block !global;
.#{$B} {
@content;
}

7
src/styles/common/style.scss
View File

@ -1,13 +1,14 @@
@import './var.scss';
@import './animation.scss';
// 毛玻璃
.--background-filter {
backdrop-filter: $--filter-blur;
background-color: $--filter-color;
backdrop-filter: $--filter-blur-base;
background-color: $--filter-color-base;
}
// 边框圆角
.--border-radius {
border-radius: $--border-radius;
border-radius: $--border-radius-base;
overflow: hidden;
}

10
src/styles/common/var.scss
View File

@ -1,6 +1,10 @@
// 模糊
$--filter-blur: blur(2px);
$--filter-blur-base: blur(2px);
// 毛玻璃
$--filter-color: rgba(0, 0, 0, 0.07);
$--filter-color-base: rgba(0, 0, 0, 0.07);
// 边框
$--border-radius: 5px;
$--border-radius-base: 5px;
/// 阴影
$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04) !default;
$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12) !default;
$--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default;

34
src/utils/comp.ts
View File

@ -1,34 +0,0 @@
import { Component, DefineComponent } from "vue";
import { App, Plugin, getCurrentInstance } from "vue";
interface Registed {
[key: string]: boolean;
}
let registed: Registed = {};
interface Comp {
displayName?: string;
name?: string;
}
type RegisteComp = (comp: Comp & Plugin) => void;
const registeComp: RegisteComp = comp => {
const name = comp.displayName || comp.name;
if (name && !registed[name]) {
const instance = getCurrentInstance();
const app = instance?.appContext.app;
if (app) {
app.use(comp);
registed[name] = true;
}
}
};
const regComp: (comp: any) => void = comp => {
const instance = getCurrentInstance();
const app = instance?.appContext.app;
app?.component(comp?.name, comp);
};
export { registeComp, regComp };

13
src/utils/index.ts
View File

@ -1,8 +1,5 @@
import { h } from 'vue';
import { NIcon } from 'naive-ui';
import { ResultEnum } from "@/enums/httpEnum"
import { ErrorPageNameMap } from "@/enums/pageEnum"
import router from '@/router';
/**
* * 生成一个用不重复的ID
@ -24,14 +21,4 @@ export const renderIcon = (icon: any) => {
return () => h(NIcon, null, { default: () => h(icon) });
}
/**
* * 错误页重定向
* @param icon
* @returns
*/
export const redirectErrorPage = (code: ResultEnum) => {
router.push({
name: ErrorPageNameMap.get(code)
})
}

25
src/utils/page.ts Normal file
View File

@ -0,0 +1,25 @@
import { ResultEnum } from "@/enums/httpEnum"
import { ErrorPageNameMap } from "@/enums/pageEnum"
import router from '@/router';
/**
* * 错误页重定向
* @param icon
* @returns
*/
export const redirectErrorPage = (code: ResultEnum) => {
if(!code) return false
const pageName = ErrorPageNameMap.get(code)
if(!pageName) return false
routerTurnByName(pageName)
}
/**
* * 根据名字跳转路由
* @param pageName
*/
export const routerTurnByName = (pageName: string) => {
router.push({
name: pageName
})
}

46
src/views/exception/403.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="flex flex-col justify-center page-container">
<div class="go-error">
<div class="text-center">
<img src="~@/assets/images/exception/403.svg" alt="" />
</div>
@ -11,30 +11,32 @@
</template>
<script lang="ts" setup>
import { useRouter } from 'vue-router';
const router = useRouter();
function goHome() {
router.push('/');
}
import { useRouter } from 'vue-router'
import { PageEnum } from '@/enums/pageEnum'
import { routerTurnByName } from '@/utils/page'
const router = useRouter()
function goHome() {
routerTurnByName(PageEnum.BASE_HOME_NAME)
}
</script>
<style lang="scss" scoped>
.page-container {
width: 100%;
border-radius: 4px;
padding: 50px 0;
height: 100vh;
.text-center {
h1 {
color: #666;
padding: 20px 0;
}
}
img {
width: 350px;
margin: 0 auto;
@include go(error) {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
padding: 100px 0;
.text-center {
h1 {
color: #666;
padding: 20px 0;
}
}
img {
width: 350px;
margin: 0 auto;
}
}
</style>

5
src/views/exception/404.vue
View File

@ -13,11 +13,10 @@
<script lang="ts" setup>
import { useRouter } from 'vue-router'
import { PageEnum } from '@/enums/pageEnum'
import { routerTurnByName } from '@/utils/page'
const router = useRouter()
function goHome() {
router.push({
name: PageEnum.BASE_HOME_NAME
})
routerTurnByName(PageEnum.BASE_HOME_NAME)
}
</script>

18
src/views/exception/500.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="flex flex-col justify-center page-container">
<div class="go-error">
<div class="text-center">
<img src="~@/assets/images/exception/500.svg" alt="" />
</div>
@ -12,19 +12,21 @@
<script lang="ts" setup>
import { useRouter } from 'vue-router'
import { PageEnum } from '@/enums/pageEnum'
import { routerTurnByName } from '@/utils/page'
const router = useRouter()
const goHome = () => {
router.push('/')
function goHome() {
routerTurnByName(PageEnum.BASE_HOME_NAME)
}
</script>
<style lang="scss" scoped>
.page-container {
@include go(error) {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
border-radius: 4px;
padding: 50px 0;
height: 100vh;
padding: 100px 0;
.text-center {
h1 {
color: #666;