Compare commits
No commits in common. "GraduationDesign-FrontEnd" and "main" have entirely different histories.
Graduation
...
main
30
.gitignore
vendored
30
.gitignore
vendored
@ -1,30 +0,0 @@
|
|||||||
# Logs
|
|
||||||
logs
|
|
||||||
*.log
|
|
||||||
npm-debug.log*
|
|
||||||
yarn-debug.log*
|
|
||||||
yarn-error.log*
|
|
||||||
pnpm-debug.log*
|
|
||||||
lerna-debug.log*
|
|
||||||
|
|
||||||
node_modules
|
|
||||||
.DS_Store
|
|
||||||
dist
|
|
||||||
dist-ssr
|
|
||||||
coverage
|
|
||||||
*.local
|
|
||||||
|
|
||||||
/cypress/videos/
|
|
||||||
/cypress/screenshots/
|
|
||||||
|
|
||||||
# Editor directories and files
|
|
||||||
.vscode/*
|
|
||||||
!.vscode/extensions.json
|
|
||||||
.idea
|
|
||||||
*.suo
|
|
||||||
*.ntvs*
|
|
||||||
*.njsproj
|
|
||||||
*.sln
|
|
||||||
*.sw?
|
|
||||||
|
|
||||||
*.tsbuildinfo
|
|
||||||
3
.vscode/extensions.json
vendored
3
.vscode/extensions.json
vendored
@ -1,3 +0,0 @@
|
|||||||
{
|
|
||||||
"recommendations": ["Vue.volar"]
|
|
||||||
}
|
|
||||||
29
README.md
29
README.md
@ -1,29 +1,2 @@
|
|||||||
# graduation_design-front_end
|
# GraduationDesign
|
||||||
|
|
||||||
This template should help get you started developing with Vue 3 in Vite.
|
|
||||||
|
|
||||||
## Recommended IDE Setup
|
|
||||||
|
|
||||||
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
|
|
||||||
|
|
||||||
## Customize configuration
|
|
||||||
|
|
||||||
See [Vite Configuration Reference](https://vite.dev/config/).
|
|
||||||
|
|
||||||
## Project Setup
|
|
||||||
|
|
||||||
```sh
|
|
||||||
npm install
|
|
||||||
```
|
|
||||||
|
|
||||||
### Compile and Hot-Reload for Development
|
|
||||||
|
|
||||||
```sh
|
|
||||||
npm run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
### Compile and Minify for Production
|
|
||||||
|
|
||||||
```sh
|
|
||||||
npm run build
|
|
||||||
```
|
|
||||||
|
|||||||
13
index.html
13
index.html
@ -1,13 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<link rel="icon" href="/favicon.ico">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Vite App</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="app"></div>
|
|
||||||
<script type="module" src="/src/main.ts"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
"paths": {
|
|
||||||
"@/*": ["./src/*"]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"exclude": ["node_modules", "dist"]
|
|
||||||
}
|
|
||||||
3376
package-lock.json
generated
3376
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
23
package.json
23
package.json
@ -1,23 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "graduation_design-front_end",
|
|
||||||
"version": "0.0.0",
|
|
||||||
"private": true,
|
|
||||||
"type": "module",
|
|
||||||
"scripts": {
|
|
||||||
"dev": "vite",
|
|
||||||
"build": "vite build",
|
|
||||||
"preview": "vite preview"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"@element-plus/icons-vue": "^2.3.1",
|
|
||||||
"axios": "^1.10.0",
|
|
||||||
"element-plus": "^2.10.4",
|
|
||||||
"vue": "^3.5.17",
|
|
||||||
"vue-router": "^4.5.1"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@vitejs/plugin-vue": "^6.0.0",
|
|
||||||
"vite": "^7.0.0",
|
|
||||||
"vite-plugin-vue-devtools": "^7.7.7"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
13
src/App.vue
13
src/App.vue
@ -1,13 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div id="app">
|
|
||||||
<RouterView></RouterView>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
body{
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
width: 90%;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
.common-layout {
|
|
||||||
background-color: rgba(0, 149, 5, 0.9);
|
|
||||||
height: 100lvh;
|
|
||||||
width: 100lvw;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.container-header{
|
|
||||||
height: 8lvh;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.container-all{
|
|
||||||
height: 100lvh;
|
|
||||||
}
|
|
||||||
.container-aside{
|
|
||||||
background-color: rgba(0, 149, 255, 0.9);
|
|
||||||
height: 100%;
|
|
||||||
margin: auto;
|
|
||||||
width: 200px;
|
|
||||||
}
|
|
||||||
.flex-grow {
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
|
||||||
@ -1,58 +0,0 @@
|
|||||||
body {
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100lvh
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 90%;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo {
|
|
||||||
background-color: #4081bf;
|
|
||||||
height: 10vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*菜单-重定高度*/
|
|
||||||
.el-menu--horizontal {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
max-height: 70px;
|
|
||||||
min-height: 40px;
|
|
||||||
--el-menu-horizontal-height: 65%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 使用 Flex 布局控制菜单 */
|
|
||||||
.el-menu-demo {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 创建弹性空间 */
|
|
||||||
.flex-grow {
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 确保菜单项正常显示 */
|
|
||||||
/*V0.2.3.20250726 修复el-menu-item全局影响问题*/
|
|
||||||
.el-menu-item-A {
|
|
||||||
width: 10lvw;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*头像*/
|
|
||||||
.demo-type {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
.demo-type > div {
|
|
||||||
flex: 1;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.demo-type > div:not(:last-child) {
|
|
||||||
border-right: 1px solid var(--el-border-color);
|
|
||||||
}
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
.center-container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
/*background-color: red;*/
|
|
||||||
width: 100%;
|
|
||||||
height: 100lvh;
|
|
||||||
}
|
|
||||||
@ -1,96 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import "@/components/account/sign-in.css"
|
|
||||||
import {reactive, ref} from 'vue'
|
|
||||||
|
|
||||||
const emit = defineEmits(['option'])
|
|
||||||
const handleBack = () => {
|
|
||||||
emit('option')
|
|
||||||
}
|
|
||||||
|
|
||||||
import type {FormInstance, FormRules} from 'element-plus'
|
|
||||||
import {Back} from "@element-plus/icons-vue";
|
|
||||||
|
|
||||||
const ruleFormRef = ref<FormInstance>()
|
|
||||||
const validateEmail = (rule: any, value: string, callback: any) => {
|
|
||||||
if (!value) {
|
|
||||||
callback(new Error('请输入邮箱地址'))
|
|
||||||
} else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
|
|
||||||
callback(new Error('请输入有效的邮箱地址'))
|
|
||||||
} else {
|
|
||||||
callback()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const validatePass = (rule: any, value: any, callback: any) => {
|
|
||||||
if (value === '') {
|
|
||||||
callback(new Error('请输入密码'))
|
|
||||||
} else {
|
|
||||||
if (ruleForm.checkPass !== '') {
|
|
||||||
if (!ruleFormRef.value) return
|
|
||||||
ruleFormRef.value.validateField('checkPass')
|
|
||||||
}
|
|
||||||
callback()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const ruleForm = reactive({
|
|
||||||
email: '',
|
|
||||||
pass: '',
|
|
||||||
})
|
|
||||||
|
|
||||||
const rules = reactive<FormRules<typeof ruleForm>>({
|
|
||||||
email: [{validator:validateEmail,trigger:'blur'}],
|
|
||||||
pass: [{validator: validatePass, trigger: 'blur'}],
|
|
||||||
})
|
|
||||||
|
|
||||||
const submitForm = (formEl: FormInstance | undefined) => {
|
|
||||||
if (!formEl) return
|
|
||||||
formEl.validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
console.log('submit!')
|
|
||||||
} else {
|
|
||||||
console.log('error submit!')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<el-form
|
|
||||||
ref="ruleFormRef"
|
|
||||||
style="max-width: 600px"
|
|
||||||
:model="ruleForm"
|
|
||||||
status-icon
|
|
||||||
:rules="rules"
|
|
||||||
label-width="auto"
|
|
||||||
class="demo-ruleForm"
|
|
||||||
>
|
|
||||||
<el-form-item style="width:100%;">
|
|
||||||
<!-- 返回-->
|
|
||||||
<el-button :shouldAddSpace="true" class="ButtonState-left ButtonState" round @click="handleBack">
|
|
||||||
<el-icon>
|
|
||||||
<Back/>
|
|
||||||
</el-icon>
|
|
||||||
返回
|
|
||||||
</el-button>
|
|
||||||
<el-text>登录</el-text>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="电子邮箱（Email）" prop="email">
|
|
||||||
<el-input v-model="ruleForm.email" type="email" autocomplete="off"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="密码（Password）" prop="pass">
|
|
||||||
<el-input v-model="ruleForm.pass" type="password" autocomplete="off"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item style="width:100%;">
|
|
||||||
<!-- 忘记密码-->
|
|
||||||
<el-button key="ResetPassword" type="info" text style="height: 20px; margin: 0;padding: 0;">忘记密码？</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="submitForm(ruleFormRef)" style="height: 70px;">提交</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
.el-button {
|
|
||||||
margin-bottom: 25px;
|
|
||||||
height: 10lvh;
|
|
||||||
width: 50lvw;
|
|
||||||
}
|
|
||||||
@ -1,31 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import "@/components/account/sign-option.css"
|
|
||||||
//定义事件
|
|
||||||
const emit = defineEmits(['signin', 'signup'])
|
|
||||||
//登陆事件
|
|
||||||
const SigninOption = () => {
|
|
||||||
emit('signin')
|
|
||||||
}
|
|
||||||
//注册事件
|
|
||||||
const SignupOption = () => {
|
|
||||||
emit('signup')
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="frame">
|
|
||||||
<div class="frame-left"></div>
|
|
||||||
<div class="frame-interlocutory">
|
|
||||||
<div>
|
|
||||||
<el-button type="success" plain @click="SigninOption">登录</el-button>
|
|
||||||
<br>
|
|
||||||
<el-button type="warning" plain @click="SignupOption">注册</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="frame-right"></div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,15 +0,0 @@
|
|||||||
.el-text {
|
|
||||||
text-align: center;
|
|
||||||
width: 60%;
|
|
||||||
margin: 0;
|
|
||||||
padding:0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ButtonState {
|
|
||||||
width: 30%;
|
|
||||||
max-width: 120px;
|
|
||||||
min-width: 50px;
|
|
||||||
height: 30px;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
@ -1,110 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import "@/components/account/sign-up.css"
|
|
||||||
import {reactive, ref} from 'vue'
|
|
||||||
|
|
||||||
const emit = defineEmits(['option'])
|
|
||||||
const handleBack = () => {
|
|
||||||
emit('option')
|
|
||||||
}
|
|
||||||
|
|
||||||
import type {FormInstance, FormRules} from 'element-plus'
|
|
||||||
import {Back} from "@element-plus/icons-vue";
|
|
||||||
|
|
||||||
const ruleFormRef = ref<FormInstance>()
|
|
||||||
const validateEmail = (rule: any, value: string, callback: any) => {
|
|
||||||
if (!value) {
|
|
||||||
callback(new Error('请输入邮箱地址'))
|
|
||||||
} else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
|
|
||||||
callback(new Error('请输入有效的邮箱地址'))
|
|
||||||
} else {
|
|
||||||
callback()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const validatePass = (rule: any, value: any, callback: any) => {
|
|
||||||
if (value === '') {
|
|
||||||
callback(new Error('请输入密码'))
|
|
||||||
} else {
|
|
||||||
if (ruleForm.checkPass !== '') {
|
|
||||||
if (!ruleFormRef.value) return
|
|
||||||
ruleFormRef.value.validateField('checkPass')
|
|
||||||
}
|
|
||||||
callback()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const validatePass2 = (rule: any, value: any, callback: any) => {
|
|
||||||
if (value === '') {
|
|
||||||
callback(new Error('请二次确认密码'))
|
|
||||||
} else if (value !== ruleForm.pass) {
|
|
||||||
callback(new Error("Two inputs don't match!"))
|
|
||||||
} else {
|
|
||||||
callback()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const ruleForm = reactive({
|
|
||||||
userid: '',
|
|
||||||
email: '',
|
|
||||||
pass: '',
|
|
||||||
checkPass: '',
|
|
||||||
})
|
|
||||||
|
|
||||||
const rules = reactive<FormRules<typeof ruleForm>>({
|
|
||||||
email: [{validator:validateEmail,trigger:'blur'}],
|
|
||||||
pass: [{validator: validatePass, trigger: 'blur'}],
|
|
||||||
checkPass: [{validator: validatePass2, trigger: 'blur'}],
|
|
||||||
})
|
|
||||||
|
|
||||||
const submitForm = (formEl: FormInstance | undefined) => {
|
|
||||||
if (!formEl) return
|
|
||||||
formEl.validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
console.log('submit!')
|
|
||||||
} else {
|
|
||||||
console.log('error submit!')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<el-form
|
|
||||||
ref="ruleFormRef"
|
|
||||||
style="max-width: 600px"
|
|
||||||
:model="ruleForm"
|
|
||||||
status-icon
|
|
||||||
:rules="rules"
|
|
||||||
label-width="auto"
|
|
||||||
class="demo-ruleForm"
|
|
||||||
>
|
|
||||||
<el-form-item style="width:100%;">
|
|
||||||
<!-- 返回-->
|
|
||||||
<el-button :shouldAddSpace="true" class="ButtonState-left ButtonState" round @click="handleBack">
|
|
||||||
<el-icon>
|
|
||||||
<Back/>
|
|
||||||
</el-icon>
|
|
||||||
返回
|
|
||||||
</el-button>
|
|
||||||
<el-text>注册</el-text>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="用户名（UserID）" prop="userid">
|
|
||||||
<el-input v-model="ruleForm.text" type="text" autocomplete="off"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="电子邮箱（Email）" prop="email">
|
|
||||||
<el-input v-model="ruleForm.email" type="email" autocomplete="off"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="密码（Password）" prop="pass">
|
|
||||||
<el-input v-model="ruleForm.pass" type="password" autocomplete="off"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="二次确认密码（CheckPass）" prop="checkPass">
|
|
||||||
<el-input v-model="ruleForm.checkPass" type="password" autocomplete="off"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="submitForm(ruleFormRef)" style="height: 70px;">提交</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
404
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
27
src/main.ts
27
src/main.ts
@ -1,27 +0,0 @@
|
|||||||
import './assets/main.css'
|
|
||||||
|
|
||||||
import { createApp } from 'vue'
|
|
||||||
import App from './App.vue'
|
|
||||||
import ElementPlus from 'element-plus'
|
|
||||||
import * as ElementPlusIconsVue from '@element-plus/icons-vue' // 图标导入
|
|
||||||
import 'element-plus/dist/index.css'
|
|
||||||
import router from './router/router'
|
|
||||||
import axios from 'axios'
|
|
||||||
|
|
||||||
const app = createApp(App)
|
|
||||||
|
|
||||||
// 全局注册所有Element Plus图标
|
|
||||||
Object.keys(ElementPlusIconsVue).forEach(key => {
|
|
||||||
// 使用类型断言确保类型正确
|
|
||||||
app.component(key, (ElementPlusIconsVue as Record<string, any>)[key])
|
|
||||||
})
|
|
||||||
|
|
||||||
// 安装插件
|
|
||||||
app.use(router)
|
|
||||||
.use(ElementPlus)
|
|
||||||
|
|
||||||
// 全局使用axios挂载到app.config.globalProperties
|
|
||||||
app.config.globalProperties.$axios = axios
|
|
||||||
|
|
||||||
// 挂载应用
|
|
||||||
app.mount('#app')
|
|
||||||
@ -1,117 +0,0 @@
|
|||||||
import {createRouter, createWebHashHistory, RouteRecordRaw} from "vue-router";
|
|
||||||
import Home from "@/views/Home.vue";
|
|
||||||
import NotFound from "@/error/NotFound.vue";
|
|
||||||
import Account from "@/views/ordinary/account.vue"
|
|
||||||
import Books from "@/views/ordinary/books.vue"
|
|
||||||
import Journals from "@/views/ordinary/journals.vue"
|
|
||||||
import Newspapers from "@/views/ordinary/newspapers.vue";
|
|
||||||
import Main from "@/views/ordinary/main.vue";
|
|
||||||
import SMA from "@/views/managerial/SMA.vue";
|
|
||||||
import BMA from "@/views/managerial/BMA.vue";
|
|
||||||
import UAA from "@/views/managerial/UAA.vue"
|
|
||||||
import AccountCancel from "@/views/managerial/BMA/Account-Cancel.vue";
|
|
||||||
import AccountBusiness from "@/views/managerial/BMA/Account-Business.vue";
|
|
||||||
import BookInquire from "@/views/managerial/BMA/Book-Inquire.vue";
|
|
||||||
import BookBorrowBack from "@/views/managerial/BMA/Book-BorrowBack.vue";
|
|
||||||
import TicketCreate from "@/views/managerial/BMA/Ticket-Create.vue";
|
|
||||||
import TicketInquire from "@/views/managerial/BMA/Ticket-Inquire.vue";
|
|
||||||
|
|
||||||
const routes: Array<RouteRecordRaw> = [
|
|
||||||
{
|
|
||||||
path: "/",
|
|
||||||
name: "home",
|
|
||||||
component: Home,
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
path: "account",
|
|
||||||
name: "account",
|
|
||||||
component: Account,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "books",
|
|
||||||
name: "books",
|
|
||||||
component: Books,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "journals",
|
|
||||||
name: "journals",
|
|
||||||
component: Journals,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "newspapers",
|
|
||||||
name: "newspapers",
|
|
||||||
component: Newspapers,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "main",
|
|
||||||
name: "main",
|
|
||||||
component: Main,
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/account",
|
|
||||||
name: "account",
|
|
||||||
component: Account,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/UAA",
|
|
||||||
name: "UAA",
|
|
||||||
component: UAA,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/SMA",
|
|
||||||
name: "SMA",
|
|
||||||
component: SMA,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/BMA",
|
|
||||||
name: "BMA",
|
|
||||||
component: BMA,
|
|
||||||
redirect: "/BMA/AccountBusiness", // 添加默认重定向到业务页
|
|
||||||
children:[
|
|
||||||
{
|
|
||||||
path:"AccountCancel",
|
|
||||||
name:"AccountCancel" ,
|
|
||||||
component:AccountCancel,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path:"AccountBusiness",
|
|
||||||
name:"AccountBusiness",
|
|
||||||
component:AccountBusiness,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path:"BookInquire",
|
|
||||||
name:"BookInquire",
|
|
||||||
component:BookInquire,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path:"BookBorrowBack",
|
|
||||||
name:"BookBorrowBack",
|
|
||||||
component:BookBorrowBack,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path:"TicketCreate",
|
|
||||||
name:"TicketCreate",
|
|
||||||
component:TicketCreate,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path:"TicketInquire",
|
|
||||||
name:"TicketInquire",
|
|
||||||
component:TicketInquire,
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/:pathMatch(.*)*",
|
|
||||||
name: "NotFound",
|
|
||||||
component: NotFound
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
const router = createRouter({
|
|
||||||
history: createWebHashHistory(),
|
|
||||||
routes
|
|
||||||
})
|
|
||||||
|
|
||||||
export default router
|
|
||||||
@ -1,53 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import "@/assets/ordinary/Home.css"
|
|
||||||
import {ref} from 'vue'
|
|
||||||
import {useRouter} from "vue-router";
|
|
||||||
const UserID = ref('用户')
|
|
||||||
const imgsrc = ref('https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png') //头像
|
|
||||||
const router = useRouter()
|
|
||||||
const activeIndex = ref(router.currentRoute.value.path) // 根据当前路由设置激活状态
|
|
||||||
const handleSelect = (path: string) => {
|
|
||||||
router.push(path)
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<header>
|
|
||||||
<div class="container logo"><img src="#" alt="LOGO"></div>
|
|
||||||
<div class="container">
|
|
||||||
<el-menu
|
|
||||||
:default-active="activeIndex"
|
|
||||||
class="el-menu-demo"
|
|
||||||
mode="horizontal"
|
|
||||||
:ellipsis="false"
|
|
||||||
@select="handleSelect"
|
|
||||||
router
|
|
||||||
>
|
|
||||||
<!-- 左侧菜单项 -->
|
|
||||||
<el-menu-item index="/main" :route="{ path: '/mian'}" class="el-menu-item-A">首页</el-menu-item>
|
|
||||||
<el-menu-item index="/books" :route="{ path: '/books'}" class="el-menu-item-A">图书</el-menu-item>
|
|
||||||
<el-menu-item index="/journals" :route="{ path: '/journals'}" class="el-menu-item-A">期刊</el-menu-item>
|
|
||||||
<el-menu-item index="/newspapers" :route="{ path: '/newspapers'}" class="el-menu-item-A">报纸</el-menu-item>
|
|
||||||
<!-- 弹性空间 -->
|
|
||||||
<div class="flex-grow"/>
|
|
||||||
<el-sub-menu>
|
|
||||||
<template #title>
|
|
||||||
<el-avatar :src="imgsrc" :size="45" style="margin-right: 20px">请登录</el-avatar>
|
|
||||||
<span>{{ UserID }}</span>
|
|
||||||
</template>
|
|
||||||
<el-menu-item index="/UAA" :route="{ path: '/UAA'}" v-if="true">个人中心</el-menu-item>
|
|
||||||
<el-menu-item v-if="true">注销</el-menu-item>
|
|
||||||
<el-menu-item v-if="false">登录</el-menu-item>
|
|
||||||
</el-sub-menu>
|
|
||||||
</el-menu>
|
|
||||||
<!-- <div class="h-6"/>-->
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
<div class="container row-A">
|
|
||||||
<RouterView></RouterView>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,96 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import "@/assets/managerial/BMA.css"
|
|
||||||
|
|
||||||
const imgsrc = ref('https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png') //头像
|
|
||||||
const UserID = ref('管理员')
|
|
||||||
import {MessageBox, Notebook, User} from "@element-plus/icons-vue";
|
|
||||||
import {computed, ref} from "vue";
|
|
||||||
import {useRoute} from "vue-router";
|
|
||||||
|
|
||||||
const handleOpen = (key: string, keyPath: string[]) => {
|
|
||||||
console.log(key, keyPath)
|
|
||||||
}
|
|
||||||
const handleClose = (key: string, keyPath: string[]) => {
|
|
||||||
console.log(key, keyPath)
|
|
||||||
}
|
|
||||||
|
|
||||||
const route = useRoute()
|
|
||||||
const activeIndex = computed(() => route.path)
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="common-layout">
|
|
||||||
<el-container class="container-all">
|
|
||||||
<el-header style="height: 8lvh; background-color: #4081bf;">
|
|
||||||
<div class="container-header">
|
|
||||||
<img src="#" alt="logo" style="background-color: aqua">
|
|
||||||
<div class="flex-grow"/>
|
|
||||||
<el-menu
|
|
||||||
class="el-menu-vertical-header"
|
|
||||||
@open="handleOpen"
|
|
||||||
@close="handleClose"
|
|
||||||
>
|
|
||||||
<el-sub-menu>
|
|
||||||
<template #title>
|
|
||||||
<el-avatar :src="imgsrc" :size="45" style="margin-right: 20px">请登录</el-avatar>
|
|
||||||
<span>{{UserID}}</span>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<el-menu-item v-if="true">注销</el-menu-item>
|
|
||||||
</el-sub-menu>
|
|
||||||
</el-menu>
|
|
||||||
</div>
|
|
||||||
</el-header>
|
|
||||||
<el-container>
|
|
||||||
<el-aside class="container-aside">
|
|
||||||
<el-scrollbar>
|
|
||||||
<el-menu
|
|
||||||
:default-active="activeIndex"
|
|
||||||
class="el-menu-vertical-demo"
|
|
||||||
router
|
|
||||||
>
|
|
||||||
<el-sub-menu index="1">
|
|
||||||
<template #title>
|
|
||||||
<el-icon>
|
|
||||||
<User/>
|
|
||||||
</el-icon>
|
|
||||||
<span>账号管理</span>
|
|
||||||
</template>
|
|
||||||
<el-menu-item index="/BMA/AccountCancel" :route="{ name: 'AccountCancel' }">账号注册</el-menu-item>
|
|
||||||
<el-menu-item index="/BMA/AccountBusiness" :route="{ name: 'AccountBusiness' }">账号业务</el-menu-item>
|
|
||||||
<el-menu-item index="/UAA" :route="{ name: 'UAA' }">个人中心</el-menu-item>
|
|
||||||
</el-sub-menu>
|
|
||||||
<el-sub-menu index="2">
|
|
||||||
<template #title>
|
|
||||||
<el-icon>
|
|
||||||
<Notebook/>
|
|
||||||
</el-icon>
|
|
||||||
<span>借阅管理</span>
|
|
||||||
</template>
|
|
||||||
<el-menu-item index="/BMA/BookInquire" :route="{ name:'BookInquire'}">图书查询</el-menu-item>
|
|
||||||
<el-menu-item index="/BMA/BookBorrowBack" :route="{ name:'BookBorrowBack'}">借还业务</el-menu-item>
|
|
||||||
</el-sub-menu>
|
|
||||||
<el-sub-menu index="3">
|
|
||||||
<template #title>
|
|
||||||
<el-icon><MessageBox /></el-icon>
|
|
||||||
<span>咨询投诉</span>
|
|
||||||
</template>
|
|
||||||
<el-menu-item index="/BMA/TicketCreate" :route="{ name:'TicketCreate'}">工单创建</el-menu-item>
|
|
||||||
<el-menu-item index="/BMA/TicketInquire" :route="{ name:'TicketInquire'}">工单查询</el-menu-item>
|
|
||||||
</el-sub-menu>
|
|
||||||
</el-menu>
|
|
||||||
</el-scrollbar>
|
|
||||||
</el-aside>
|
|
||||||
<el-container>
|
|
||||||
<el-main>
|
|
||||||
<RouterView></RouterView>
|
|
||||||
</el-main>
|
|
||||||
</el-container>
|
|
||||||
</el-container>
|
|
||||||
</el-container>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
账号业务
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
账号注册
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
借还业务
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
图书查询
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
工单创建
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
工单查询
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,32 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import "@/assets/ordinary/account.css"
|
|
||||||
import {ref} from 'vue'
|
|
||||||
import SignOption from "@/components/account/sign-option.vue";
|
|
||||||
import SignIn from "@/components/account/sign-in.vue";
|
|
||||||
import SignUp from "@/components/account/sign-up.vue";
|
|
||||||
|
|
||||||
//选项参数
|
|
||||||
const state = ref('Option')
|
|
||||||
const SigninOption = () => {
|
|
||||||
state.value = 'SignIn'
|
|
||||||
}
|
|
||||||
const SignupOption = () => {
|
|
||||||
state.value = 'SignUp'
|
|
||||||
}
|
|
||||||
const handleOption = () => {
|
|
||||||
state.value = 'Option'
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="center-container">
|
|
||||||
<!-- @signin="SigninOption" 自定义事件-->
|
|
||||||
<SignOption v-if="state=='Option'" @signin="SigninOption" @signup="SignupOption"></SignOption>
|
|
||||||
<sign-in v-if="state=='SignIn'" @option="handleOption"></sign-in>
|
|
||||||
<sign-up v-if="state=='SignUp'" @option="handleOption"></sign-up>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
图书
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
期刊
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
首页
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
报纸
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,18 +0,0 @@
|
|||||||
import { fileURLToPath, URL } from 'node:url'
|
|
||||||
|
|
||||||
import { defineConfig } from 'vite'
|
|
||||||
import vue from '@vitejs/plugin-vue'
|
|
||||||
import vueDevTools from 'vite-plugin-vue-devtools'
|
|
||||||
|
|
||||||
// https://vite.dev/config/
|
|
||||||
export default defineConfig({
|
|
||||||
plugins: [
|
|
||||||
vue(),
|
|
||||||
vueDevTools(),
|
|
||||||
],
|
|
||||||
resolve: {
|
|
||||||
alias: {
|
|
||||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
})
|
|
||||||
Loading…
x
Reference in New Issue
Block a user