Skip to content

W
web_nangaoclub
Commit 6680b76f authored by 孙谢炜's avatar 孙谢炜
Browse files
Options

新增轮播图与登录检测

parent c0ea6e29
Expand all Show whitespace changes
Inline Side-by-side
Showing with 831 additions and 339 deletions
vuetify-project/carousel_manage.html 0 → 100644
View file @ 6680b76f
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>轮播图管理</title>
<style>
html,body,#app{
height: 100%;
}
</style>
</head>
<body>
<div id="app"></div>
<script type="module" src="src/carousel_manage.js"></script>
</body>
</html>
vuetify-project/package-lock.json
View file @ 6680b76f
This diff is collapsed.
vuetify-project/package.json
View file @ 6680b76f
...@@ -9,10 +9,11 @@ ...@@ -9,10 +9,11 @@
"dependencies": { "dependencies": {
"@mdi/font": "7.0.96", "@mdi/font": "7.0.96",
"axios": "^1.6.8", "axios": "^1.6.8",
"crypto-js": "^4.2.0",
"dayjs": "^1.11.10", "dayjs": "^1.11.10",
"roboto-fontface": "*", "roboto-fontface": "*",
"vue": "^3.3.0", "vue": "^3.3.0",
"vuetify": "^3.5.9" "vuetify": "^3.6.5"
}, },
"devDependencies": { "devDependencies": {
"@vitejs/plugin-vue": "^4.5.0", "@vitejs/plugin-vue": "^4.5.0",
......
vuetify-project/src/carousel_manage.js 0 → 100644
View file @ 6680b76f
/**
* main.js
*
* Bootstraps Vuetify and other plugins then mounts the App`
*/
// Plugins
import { registerPlugins } from '@/plugins'
// Components
import App from './carousel_manage.vue'
// Composables
import { createApp } from 'vue'
const app = createApp(App)
registerPlugins(app)
app.mount('#app')
vuetify-project/src/carousel_manage.vue 0 → 100644
View file @ 6680b76f
This diff is collapsed.
vuetify-project/src/components/gamemanage.vue
View file @ 6680b76f
...@@ -80,16 +80,17 @@ ...@@ -80,16 +80,17 @@
</v-dialog> </v-dialog>
<div> <div>
<v-card v-if="exist_season" class="mx-auto my-2" href="/lauched_games.html" width="95%" rel="noopener" target="_blank" title="已提交比赛" <v-card v-if="exist_season" class="mx-auto my-2" href="/lauched_games.html" width="95%" rel="noopener"
append-icon="mdi-chevron-right"></v-card> target="_blank" title="已提交比赛" append-icon="mdi-chevron-right"></v-card>
<v-card v-if="exist_season" class="mx-auto my-2" href="/audit_games.html" width="95%" rel="noopener" target="_blank" title="待审核比赛"> <v-card v-if="exist_season" class="mx-auto my-2" href="/audit_games.html" width="95%" rel="noopener" target="_blank"
title="待审核比赛">
<template v-slot:append> <template v-slot:append>
<v-icon v-if="unaudit_number === 0">mdi-chevron-right</v-icon> <v-icon v-if="unaudit_number === 0">mdi-chevron-right</v-icon>
<v-badge v-if="unaudit_number !== 0" color="error" :content="unaudit_number" inline></v-badge> <v-badge v-if="unaudit_number !== 0" color="error" :content="unaudit_number" inline></v-badge>
</template> </template>
</v-card> </v-card>
<v-card v-if="exist_season" class="mx-auto my-2" href="/score_ranking.html" width="95%" rel="noopener" target="_blank" title="球员积分榜单" <v-card v-if="exist_season" class="mx-auto my-2" href="/score_ranking.html" width="95%" rel="noopener"
append-icon="mdi-chevron-right"></v-card> target="_blank" title="球员积分榜单" append-icon="mdi-chevron-right"></v-card>
<v-card class="mx-auto my-2" href="/my_recentgames.html" width="95%" rel="noopener" target="_blank" title="比赛列表" <v-card class="mx-auto my-2" href="/my_recentgames.html" width="95%" rel="noopener" target="_blank" title="比赛列表"
append-icon="mdi-chevron-right"></v-card> append-icon="mdi-chevron-right"></v-card>
</div> </div>
...@@ -161,12 +162,12 @@ watch(score2, (newVal, oldVal) => { ...@@ -161,12 +162,12 @@ watch(score2, (newVal, oldVal) => {
form.value.validate(); // 触发表单验证 form.value.validate(); // 触发表单验证
} }
}); });
function refresh() {
axios.get('/api/players',{ axios.get('/api/players', {
params:{ params: {
lim: 1000, lim: 1000,
} }
}) })
.then(function (response) { .then(function (response) {
const data = response.data; const data = response.data;
exist_season.value = data.ExistSeason; exist_season.value = data.ExistSeason;
...@@ -178,7 +179,7 @@ axios.get('/api/players',{ ...@@ -178,7 +179,7 @@ axios.get('/api/players',{
console.log(error); console.log(error);
}) })
axios.get('/api/lauchedGames',) axios.get('/api/lauchedGames',)
.then(function (response) { .then(function (response) {
const data1 = response.data; const data1 = response.data;
unaudit_number.value = data1.Games.length; unaudit_number.value = data1.Games.length;
...@@ -186,6 +187,15 @@ axios.get('/api/lauchedGames',) ...@@ -186,6 +187,15 @@ axios.get('/api/lauchedGames',)
.catch(function (error) { .catch(function (error) {
console.log(error); console.log(error);
}) })
}
refresh();
const clickGame_model = defineModel();
watch(clickGame_model, (newVal, oldVal) => {
if (newVal !== oldVal) {
refresh();
}
});
function submit() { function submit() {
loading.value = true; loading.value = true;
......
vuetify-project/src/components/home.vue
View file @ 6680b76f
...@@ -2,7 +2,8 @@ ...@@ -2,7 +2,8 @@
<v-card class="relative1" style="height: 200px;" elevation="5"> <v-card class="relative1" style="height: 200px;" elevation="5">
<v-carousel :show-arrows="false" style="height: 100%;width: 100%;" cycle interval="2000" hide-delimiter-background> <v-carousel :show-arrows="false" style="height: 100%;width: 100%;" cycle interval="2000" hide-delimiter-background>
<v-carousel-item v-for="(img, i) in imgs" :key="i" cover> <v-carousel-item v-for="(img, i) in imgs" :key="i" cover>
<img :src="img.src" class="tupian"> <a :href="img.link"><img :src="img.src" class="tupian"></a>
</v-carousel-item> </v-carousel-item>
</v-carousel> </v-carousel>
</v-card> </v-card>
...@@ -239,25 +240,26 @@ ...@@ -239,25 +240,26 @@
<script setup> <script setup>
import { ref } from 'vue'; import { ref, watch } from 'vue';
import { reactive } from 'vue'; import { reactive } from 'vue';
import axios from 'axios'; import axios from 'axios';
const imgs = reactive([ // const imgs = reactive([
{ // {
src: 'https://cdn.vuetifyjs.com/images/carousel/squirrel.jpg', // src: 'https://cdn.vuetifyjs.com/images/carousel/squirrel.jpg',
}, // },
{ // {
src: 'https://cdn.vuetifyjs.com/images/carousel/sky.jpg', // src: 'https://cdn.vuetifyjs.com/images/carousel/sky.jpg',
}, // },
{ // {
src: 'https://cdn.vuetifyjs.com/images/carousel/bird.jpg', // src: 'https://cdn.vuetifyjs.com/images/carousel/bird.jpg',
}, // },
{ // {
src: 'https://cdn.vuetifyjs.com/images/carousel/planet.jpg', // src: 'https://cdn.vuetifyjs.com/images/carousel/planet.jpg',
}, // },
] // ]
); // );
const imgs = ref(new Array());
const items = ref(new Array()); const items = ref(new Array());
const group1 = ref(new Array()); const group1 = ref(new Array());
const group2 = ref(new Array()); const group2 = ref(new Array());
...@@ -315,6 +317,21 @@ function formatYear(date) { ...@@ -315,6 +317,21 @@ function formatYear(date) {
} }
function refresh() { function refresh() {
axios.get('/api/getCarousel')
.then(function(response){
const data7 = response.data;
imgs.value.length = 0;
for(var i = 0; i < data7.Carousels_info.length; i++){
var carousel_img = {
src: data7.Carousels_info[i].src,
link: data7.Carousels_info[i].link,
}
imgs.value[i] = carousel_img;
}
})
.catch(function(error){
console.log(error);
})
axios.get('/api/mySeasonInfo',) axios.get('/api/mySeasonInfo',)
.then(function (response) { .then(function (response) {
const data4 = response.data; const data4 = response.data;
...@@ -450,6 +467,13 @@ function refresh() { ...@@ -450,6 +467,13 @@ function refresh() {
refresh(); refresh();
const clickHome_model = defineModel();
watch(clickHome_model, (newVal, oldVal) => {
if (newVal !== oldVal) {
refresh();
}
});
const cardtitle = ref(null); const cardtitle = ref(null);
const cardtext = ref(null); const cardtext = ref(null);
const dialog1 = ref(false); const dialog1 = ref(false);
......
vuetify-project/src/components/login_comp.vue
View file @ 6680b76f
...@@ -47,6 +47,7 @@ ...@@ -47,6 +47,7 @@
import { ref } from 'vue'; import { ref } from 'vue';
import { reactive } from 'vue'; import { reactive } from 'vue';
import axios from 'axios'; import axios from 'axios';
import CryptoJS from 'crypto-js';
const form = ref(null); const form = ref(null);
const rules = reactive({ const rules = reactive({
...@@ -75,11 +76,16 @@ function info(title, text) { ...@@ -75,11 +76,16 @@ function info(title, text) {
dialog.value = true; dialog.value = true;
} }
function md5Hash(password) {
return CryptoJS.MD5(password).toString();
}
function login() { function login() {
loading.value = true; loading.value = true;
const hashedPassword = md5Hash(password.value); // 使用MD5进行前端哈希处理
axios.post('/api/login', { axios.post('/api/login', {
usrname: usrname.value, usrname: usrname.value,
psword: password.value psword: hashedPassword,
}) })
.then(function (response) { .then(function (response) {
const data = response.data; const data = response.data;
......
vuetify-project/src/components/manage.vue
View file @ 6680b76f
...@@ -56,6 +56,14 @@ ...@@ -56,6 +56,14 @@
> >
<v-list-item-title class="text-h6">比赛管理</v-list-item-title> <v-list-item-title class="text-h6">比赛管理</v-list-item-title>
</v-list-item> </v-list-item>
<v-list-item
color="primary"
href="/carousel_manage.html"
height="60px"
appendIcon = "mdi-chevron-right"
>
<v-list-item-title class="text-h6">轮播图管理</v-list-item-title>
</v-list-item>
</v-list> </v-list>
</v-card> </v-card>
<!-- <div class="text-h4 headline"> <!-- <div class="text-h4 headline">
......
vuetify-project/src/components/register_comp.vue
View file @ 6680b76f
...@@ -30,6 +30,7 @@ ...@@ -30,6 +30,7 @@
import { ref } from 'vue'; import { ref } from 'vue';
import { reactive } from 'vue'; import { reactive } from 'vue';
import { watch } from 'vue'; import { watch } from 'vue';
import CryptoJS from 'crypto-js';
import axios from 'axios'; import axios from 'axios';
const usrname = ref(null); const usrname = ref(null);
...@@ -58,11 +59,16 @@ watch(password, (newVal, oldVal) => { ...@@ -58,11 +59,16 @@ watch(password, (newVal, oldVal) => {
} }
}); });
function md5Hash(password) {
return CryptoJS.MD5(password).toString();
}
function register() { function register() {
loading.value = true; loading.value = true;
const hashedPassword = md5Hash(password.value); // 使用MD5进行前端哈希处理
axios.post('/api/register', { axios.post('/api/register', {
usrname: usrname.value, usrname: usrname.value,
psword: password.value psword: hashedPassword,
}) })
.then(function (response) { .then(function (response) {
const data = response.data; const data = response.data;
......
vuetify-project/src/components/space.vue
View file @ 6680b76f
...@@ -242,7 +242,7 @@ ...@@ -242,7 +242,7 @@
</template> </template>
<script setup> <script setup>
import { ref } from 'vue'; import { ref, watch } from 'vue';
import { reactive } from 'vue'; import { reactive } from 'vue';
import axios from 'axios'; import axios from 'axios';
...@@ -457,6 +457,12 @@ function refresh() { ...@@ -457,6 +457,12 @@ function refresh() {
refresh(); refresh();
const clickMy_model = defineModel();
watch(clickMy_model, (newVal, oldVal) => {
if (newVal !== oldVal) {
refresh();
}
});
function button1() { function button1() {
if (players_id !== 0) { if (players_id !== 0) {
......
vuetify-project/src/main.vue
View file @ 6680b76f
...@@ -2,13 +2,13 @@ ...@@ -2,13 +2,13 @@
<div class="w-auto"> <div class="w-auto">
<v-window v-model="tab" class="h-screen w-auto"> <v-window v-model="tab" class="h-screen w-auto">
<v-window-item :key="1" :value="'tab-1'" class="h-screen w-100 bottom-navigation"> <v-window-item :key="1" :value="'tab-1'" class="h-screen w-100 bottom-navigation">
<Home></Home> <Home v-model="home_click"></Home>
</v-window-item> </v-window-item>
<v-window-item :key="2" :value="'tab-2'" class="h-screen w-100 bottom-navigation"> <v-window-item :key="2" :value="'tab-2'" class="h-screen w-100 bottom-navigation">
<Gamemanage></Gamemanage> <Gamemanage v-model="game_click"></Gamemanage>
</v-window-item> </v-window-item>
<v-window-item :key="3" :value="'tab-3'" class="h-screen w-100 bottom-navigation"> <v-window-item :key="3" :value="'tab-3'" class="h-screen w-100 bottom-navigation">
<Space></Space> <Space v-model="my_click"></Space>
</v-window-item> </v-window-item>
<v-window-item :key="4" :value="'tab-4'" class="h-screen w-100 bottom-navigation"> <v-window-item :key="4" :value="'tab-4'" class="h-screen w-100 bottom-navigation">
<Manage></Manage> <Manage></Manage>
...@@ -17,12 +17,12 @@ ...@@ -17,12 +17,12 @@
<v-layout class="tabs"> <v-layout class="tabs">
<v-bottom-navigation v-model="tab" color="indigo" align-tabs="center" stacked grow> <v-bottom-navigation v-model="tab" color="indigo" align-tabs="center" stacked grow>
<v-btn value="tab-1"> <v-btn value="tab-1" @click="homeClick">
<v-icon>mdi-home</v-icon> <v-icon>mdi-home</v-icon>
首页 首页
</v-btn> </v-btn>
<v-btn value="tab-2"> <v-btn value="tab-2" @click="gameClick">
<v-badge color="error" dot v-if="unaudit_number !== 0"> <v-badge color="error" dot v-if="unaudit_number !== 0">
<v-icon>mdi-table-tennis</v-icon> <v-icon>mdi-table-tennis</v-icon>
</v-badge> </v-badge>
...@@ -30,12 +30,12 @@ ...@@ -30,12 +30,12 @@
比赛 比赛
</v-btn> </v-btn>
<v-btn value="tab-3"> <v-btn value="tab-3" @click="myClick">
<v-icon>mdi-account</v-icon> <v-icon>mdi-account</v-icon>
我的 我的
</v-btn> </v-btn>
<v-btn v-if="is_su" value="tab-4"> <v-btn v-if="is_su" value="tab-4" @click="manageClick">
<v-icon>mdi-account-cog</v-icon> <v-icon>mdi-account-cog</v-icon>
管理 管理
</v-btn> </v-btn>
...@@ -53,20 +53,42 @@ import Home from './components/home.vue'; ...@@ -53,20 +53,42 @@ import Home from './components/home.vue';
import Manage from './components/manage.vue'; import Manage from './components/manage.vue';
import axios from 'axios'; import axios from 'axios';
const tab = ref(null); const tab = ref("tab-1");
const is_su = ref(false); const is_su = ref(false);
const is_member = ref(false);
const unaudit_number = ref(0); const unaudit_number = ref(0);
const home_click = ref(true);
const game_click = ref(true);
const my_click = ref(true);
axios.get('/api/currentUser') function refresh() {
axios.get('/api/currentUser')
.then(function (response) { .then(function (response) {
const data = response.data; const data = response.data;
if (data.status === "SUCCESS") {
is_su.value = data.is_su; is_su.value = data.is_su;
is_member.value = data.is_member;
}
if (data.status === "LOGOUT") {
window.location.href = '/index.html';
}
}) })
// .then(function(response){
// const data2 = response.data;
// if (data2.status === "LOGOUT"){
// window.location.href = '/index.html';
// }
// if (!is_member.value){
// window.location.href = '/index.html';
// }
// }
// )
.catch(function (error) { .catch(function (error) {
console.log(error); console.log(error);
}) })
axios.get('/api/lauchedGames',) axios.get('/api/lauchedGames',)
.then(function (response) { .then(function (response) {
const data1 = response.data; const data1 = response.data;
unaudit_number.value = data1.Games.length; unaudit_number.value = data1.Games.length;
...@@ -74,7 +96,29 @@ axios.get('/api/lauchedGames',) ...@@ -74,7 +96,29 @@ axios.get('/api/lauchedGames',)
.catch(function (error) { .catch(function (error) {
console.log(error); console.log(error);
}) })
}
refresh();
function homeClick() {
home_click.value = !home_click.value;
tab.value = "tab-1"
}
function gameClick() {
game_click.value = !game_click.value;
tab.value = "tab-2"
}
function myClick() {
my_click.value = !my_click.value;
tab.value = "tab-3"
}
function manageClick() {
tab.value = "tab-4"
}
</script> </script>
<style> <style>
......
vuetify-project/src/season_manage.vue
View file @ 6680b76f
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
color="indigo" text="重启赛季"></v-btn> color="indigo" text="重启赛季"></v-btn>
</template> </template>
</v-data-table> </v-data-table>
<div><v-btn style="width: 100px;" class="float-right" variant="text" color="indigo" <div><v-btn style="width: 100px;margin-right: 10px;" class="float-right" variant="text" color="indigo"
prepend-icon="mdi-scoreboard" @click="dialog = true" text="开启赛季"></v-btn></div> prepend-icon="mdi-scoreboard" @click="dialog = true" text="开启赛季"></v-btn></div>
</v-app> </v-app>
<v-dialog v-model="dialog" width="auto"> <v-dialog v-model="dialog" width="auto">
......
vuetify-project/vite.config.mjs
View file @ 6680b76f
...@@ -67,6 +67,7 @@ export default defineConfig({ ...@@ -67,6 +67,7 @@ export default defineConfig({
player_manage: resolve(__dirname, 'player_manage.html'), player_manage: resolve(__dirname, 'player_manage.html'),
game_manage: resolve(__dirname, 'game_manage.html'), game_manage: resolve(__dirname, 'game_manage.html'),
past_seasons: resolve(__dirname, 'past_seasons.html'), past_seasons: resolve(__dirname, 'past_seasons.html'),
carousel_manage: resolve(__dirname, 'carousel_manage.html'),
} }
}, },
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment