提交
This commit is contained in:
parent
a48d3a2c73
commit
72af062327
15
frontend/index.html
Normal file
15
frontend/index.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" href="/favicon.ico" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta name="description" content="" />
|
||||||
|
<meta name="keywords" content="" />
|
||||||
|
<title>gisbi</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"></div>
|
||||||
|
<script type="module" src="./src/main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
3639
frontend/package-lock.json
generated
3639
frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -19,14 +19,15 @@
|
|||||||
"@element-plus/icons-vue": "^2.3.1"
|
"@element-plus/icons-vue": "^2.3.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@vitejs/plugin-vue": "^4.5.2",
|
|
||||||
"vite": "^5.0.8",
|
|
||||||
"@vue/eslint-config-prettier": "^8.0.0",
|
|
||||||
"@rushstack/eslint-patch": "^1.3.3",
|
"@rushstack/eslint-patch": "^1.3.3",
|
||||||
|
"@vitejs/plugin-vue": "^4.5.2",
|
||||||
|
"@vue/eslint-config-prettier": "^8.0.0",
|
||||||
"eslint": "^8.49.0",
|
"eslint": "^8.49.0",
|
||||||
"eslint-plugin-vue": "^9.17.0",
|
"eslint-plugin-vue": "^9.17.0",
|
||||||
"prettier": "^3.0.3",
|
"prettier": "^3.0.3",
|
||||||
"sass": "^1.69.5"
|
"sass": "^1.89.0",
|
||||||
|
"sass-loader": "^16.0.5",
|
||||||
|
"vite": "^5.0.8"
|
||||||
},
|
},
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=16.0.0",
|
"node": ">=16.0.0",
|
||||||
|
|||||||
@ -50,6 +50,13 @@ export function getDictionaryDataByName(dictName) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function getDictionaryData(dictName) {
|
||||||
|
return request({
|
||||||
|
url: `/dictionaries/name/${dictName}`,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 创建字典
|
* 创建字典
|
||||||
* @param {Object} data 字典数据
|
* @param {Object} data 字典数据
|
||||||
|
|||||||
BIN
frontend/src/assets/401_images/401.gif
Normal file
BIN
frontend/src/assets/401_images/401.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 160 KiB |
BIN
frontend/src/assets/404_images/404.png
Normal file
BIN
frontend/src/assets/404_images/404.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 96 KiB |
BIN
frontend/src/assets/404_images/404_cloud.png
Normal file
BIN
frontend/src/assets/404_images/404_cloud.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
@ -63,8 +63,8 @@ const routes = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/:pathMatch(.*)*',
|
path: '/:pathMatch(.*)*',
|
||||||
name: 'NotFound',
|
name: '404',
|
||||||
component: () => import('@/views/NotFound.vue'),
|
component: () => import('@/views/error-page/404.vue'),
|
||||||
meta: {
|
meta: {
|
||||||
title: '页面未找到',
|
title: '页面未找到',
|
||||||
requiresAuth: false
|
requiresAuth: false
|
||||||
|
|||||||
25
frontend/src/styles/variables.scss
Normal file
25
frontend/src/styles/variables.scss
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
// sidebar
|
||||||
|
$menuText: #505050;
|
||||||
|
$menuActiveText: #409eff;
|
||||||
|
$subMenuActiveText: #409eff;
|
||||||
|
|
||||||
|
$menuBg: #ffffff;
|
||||||
|
$menuHover: #409eff;
|
||||||
|
|
||||||
|
$subMenuBg: #ffffff;
|
||||||
|
$subMenuHover: #409eff;
|
||||||
|
|
||||||
|
$sideBarWidth: 210px;
|
||||||
|
|
||||||
|
// the :export directive is the magic sauce for webpack
|
||||||
|
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
|
||||||
|
:export {
|
||||||
|
menuText: $menuText;
|
||||||
|
menuActiveText: $menuActiveText;
|
||||||
|
subMenuActiveText: $subMenuActiveText;
|
||||||
|
menuBg: $menuBg;
|
||||||
|
menuHover: $menuHover;
|
||||||
|
subMenuBg: $subMenuBg;
|
||||||
|
subMenuHover: $subMenuHover;
|
||||||
|
sideBarWidth: $sideBarWidth;
|
||||||
|
}
|
||||||
114
frontend/src/views/error-page/401.vue
Normal file
114
frontend/src/views/error-page/401.vue
Normal file
@ -0,0 +1,114 @@
|
|||||||
|
<!-- setup 无法设置组件名称，组件名称keepAlive必须 -->
|
||||||
|
<script lang="ts">
|
||||||
|
export default {
|
||||||
|
name: 'Page401'
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { reactive, toRefs } from 'vue';
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
const state = reactive({
|
||||||
|
errGif: new URL(`../../assets/401_images/401.gif`, import.meta.url).href,
|
||||||
|
|
||||||
|
ewizardClap:
|
||||||
|
'https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646',
|
||||||
|
dialogVisible: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const { errGif, ewizardClap, dialogVisible } = toRefs(state);
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
function back() {
|
||||||
|
router.back();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="errPage-container">
|
||||||
|
<el-button icon="el-icon-arrow-left" class="pan-back-btn" @click="back">
|
||||||
|
返回
|
||||||
|
</el-button>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<h1 class="text-jumbo text-ginormous">Oops!</h1>
|
||||||
|
gif来源<a href="https://zh.airbnb.com/" target="_blank">airbnb</a> 页面
|
||||||
|
<h2>你没有权限去该页面</h2>
|
||||||
|
<h6>如有不满请联系你领导</h6>
|
||||||
|
<ul class="list-unstyled">
|
||||||
|
<li>或者你可以去:</li>
|
||||||
|
<li class="link-type">
|
||||||
|
<router-link to="/dashboard"> 回首页 </router-link>
|
||||||
|
</li>
|
||||||
|
<li class="link-type">
|
||||||
|
<a href="https://www.taobao.com/">随便看看</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" @click.prevent="dialogVisible = true">点我看图</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<img
|
||||||
|
:src="errGif"
|
||||||
|
width="313"
|
||||||
|
height="428"
|
||||||
|
alt="Girl has dropped her ice cream."
|
||||||
|
/>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-dialog v-model="dialogVisible" title="随便看">
|
||||||
|
<img :src="ewizardClap" class="pan-img" />
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.errPage-container {
|
||||||
|
width: 800px;
|
||||||
|
max-width: 100%;
|
||||||
|
margin: 100px auto;
|
||||||
|
|
||||||
|
.pan-back-btn {
|
||||||
|
background: #008489;
|
||||||
|
color: #fff;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pan-gif {
|
||||||
|
margin: 0 auto;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pan-img {
|
||||||
|
display: block;
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-jumbo {
|
||||||
|
font-size: 60px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #484848;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-unstyled {
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
li {
|
||||||
|
padding-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #008489;
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
280
frontend/src/views/error-page/404.vue
Normal file
280
frontend/src/views/error-page/404.vue
Normal file
@ -0,0 +1,280 @@
|
|||||||
|
<!-- setup 无法设置组件名称，组件名称keepAlive必须 -->
|
||||||
|
<script lang="ts">
|
||||||
|
export default {
|
||||||
|
name: 'Page404'
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
function message() {
|
||||||
|
return 'The webmaster said that you can not enter this page...';
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="wscn-http404-container">
|
||||||
|
<div class="wscn-http404">
|
||||||
|
<div class="pic-404">
|
||||||
|
<img
|
||||||
|
class="pic-404__parent"
|
||||||
|
src="@/assets/404_images/404.png"
|
||||||
|
alt="404"
|
||||||
|
/>
|
||||||
|
<img
|
||||||
|
class="pic-404__child left"
|
||||||
|
src="@/assets/404_images/404_cloud.png"
|
||||||
|
alt="404"
|
||||||
|
/>
|
||||||
|
<img
|
||||||
|
class="pic-404__child mid"
|
||||||
|
src="@/assets/404_images/404_cloud.png"
|
||||||
|
alt="404"
|
||||||
|
/>
|
||||||
|
<img
|
||||||
|
class="pic-404__child right"
|
||||||
|
src="@/assets/404_images/404_cloud.png"
|
||||||
|
alt="404"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="bullshit">
|
||||||
|
<div class="bullshit__oops">OOPS!</div>
|
||||||
|
<div class="bullshit__info">
|
||||||
|
All rights reserved
|
||||||
|
<a
|
||||||
|
style="color: #20a0ff"
|
||||||
|
href="https://wallstreetcn.com"
|
||||||
|
target="_blank"
|
||||||
|
>wallstreetcn</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="bullshit__headline">{{ message }}</div>
|
||||||
|
<div class="bullshit__info">
|
||||||
|
Please check that the URL you entered is correct, or click the button
|
||||||
|
below to return to the homepage.
|
||||||
|
</div>
|
||||||
|
<a href="" class="bullshit__return-home">Back to home</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.wscn-http404-container {
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
position: absolute;
|
||||||
|
top: 40%;
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wscn-http404 {
|
||||||
|
position: relative;
|
||||||
|
width: 1200px;
|
||||||
|
padding: 0 50px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.pic-404 {
|
||||||
|
position: relative;
|
||||||
|
float: left;
|
||||||
|
width: 600px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
&__parent {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__child {
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
width: 80px;
|
||||||
|
top: 17px;
|
||||||
|
left: 220px;
|
||||||
|
opacity: 0;
|
||||||
|
animation-name: cloudLeft;
|
||||||
|
animation-duration: 2s;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
animation-delay: 1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.mid {
|
||||||
|
width: 46px;
|
||||||
|
top: 10px;
|
||||||
|
left: 420px;
|
||||||
|
opacity: 0;
|
||||||
|
animation-name: cloudMid;
|
||||||
|
animation-duration: 2s;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
animation-delay: 1.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.right {
|
||||||
|
width: 62px;
|
||||||
|
top: 100px;
|
||||||
|
left: 500px;
|
||||||
|
opacity: 0;
|
||||||
|
animation-name: cloudRight;
|
||||||
|
animation-duration: 2s;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
animation-delay: 1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes cloudLeft {
|
||||||
|
0% {
|
||||||
|
top: 17px;
|
||||||
|
left: 220px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
top: 33px;
|
||||||
|
left: 188px;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
top: 81px;
|
||||||
|
left: 92px;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
top: 97px;
|
||||||
|
left: 60px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes cloudMid {
|
||||||
|
0% {
|
||||||
|
top: 10px;
|
||||||
|
left: 420px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
top: 40px;
|
||||||
|
left: 360px;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
top: 130px;
|
||||||
|
left: 180px;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
top: 160px;
|
||||||
|
left: 120px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes cloudRight {
|
||||||
|
0% {
|
||||||
|
top: 100px;
|
||||||
|
left: 500px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
top: 120px;
|
||||||
|
left: 460px;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
top: 180px;
|
||||||
|
left: 340px;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
top: 200px;
|
||||||
|
left: 300px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bullshit {
|
||||||
|
position: relative;
|
||||||
|
float: left;
|
||||||
|
width: 300px;
|
||||||
|
padding: 30px 0;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
&__oops {
|
||||||
|
font-size: 32px;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 40px;
|
||||||
|
color: #1482f0;
|
||||||
|
opacity: 0;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
animation-name: slideUp;
|
||||||
|
animation-duration: 0.5s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__headline {
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 24px;
|
||||||
|
color: #222;
|
||||||
|
font-weight: bold;
|
||||||
|
opacity: 0;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
animation-name: slideUp;
|
||||||
|
animation-duration: 0.5s;
|
||||||
|
animation-delay: 0.1s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__info {
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 21px;
|
||||||
|
color: grey;
|
||||||
|
opacity: 0;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
animation-name: slideUp;
|
||||||
|
animation-duration: 0.5s;
|
||||||
|
animation-delay: 0.2s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__return-home {
|
||||||
|
display: block;
|
||||||
|
float: left;
|
||||||
|
width: 110px;
|
||||||
|
height: 36px;
|
||||||
|
background: #1482f0;
|
||||||
|
border-radius: 100px;
|
||||||
|
text-align: center;
|
||||||
|
color: #ffffff;
|
||||||
|
opacity: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 36px;
|
||||||
|
cursor: pointer;
|
||||||
|
animation-name: slideUp;
|
||||||
|
animation-duration: 0.5s;
|
||||||
|
animation-delay: 0.3s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideUp {
|
||||||
|
0% {
|
||||||
|
transform: translateY(60px);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateY(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -38,7 +38,8 @@ export default defineConfig({
|
|||||||
css: {
|
css: {
|
||||||
preprocessorOptions: {
|
preprocessorOptions: {
|
||||||
scss: {
|
scss: {
|
||||||
additionalData: '@import "@/styles/variables.scss";'
|
additionalData: '@use "@/styles/variables.scss" as vars;',
|
||||||
|
silenceDeprecations: ["legacy-js-api"]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user