Skip to content

W
web_nangaoclub
Commit 7cc2ba73 authored by sunxiwei's avatar sunxiwei
Browse files
Options

ajax审核部分代码

parent e1c5cfb4
Hide whitespace changes
Inline Side-by-side
Showing with 324 additions and 61 deletions
vuetify-project/audit.html → vuetify-project/audit_games.html
View file @ 7cc2ba73
......@@ -15,7 +15,7 @@
<body>
<div id="app"></div>
<script type="module" src="src/components/audit.js"></script>
<script type="module" src="src/audit_games.js"></script>
</body>
</html>
vuetify-project/game_detail.html → vuetify-project/lauched_games.html
View file @ 7cc2ba73
......@@ -15,7 +15,7 @@
<body>
<div id="app"></div>
<script type="module" src="src/components/game_detail.js"></script>
<script type="module" src="src/lauched_games.js"></script>
</body>
</html>
vuetify-project/package-lock.json
View file @ 7cc2ba73
......@@ -10,6 +10,7 @@
"dependencies": {
"@mdi/font": "7.0.96",
"axios": "^1.6.8",
"dayjs": "^1.11.10",
"roboto-fontface": "*",
"vue": "^3.3.0",
"vuetify": "^3.5.9"
......@@ -882,6 +883,11 @@
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
},
"node_modules/dayjs": {
"version": "1.11.10",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
"integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
},
"node_modules/debug": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
......
vuetify-project/package.json
View file @ 7cc2ba73
......@@ -9,6 +9,7 @@
"dependencies": {
"@mdi/font": "7.0.96",
"axios": "^1.6.8",
"dayjs": "^1.11.10",
"roboto-fontface": "*",
"vue": "^3.3.0",
"vuetify": "^3.5.9"
......
vuetify-project/src/components/audit.js → vuetify-project/src/audit_games.js
View file @ 7cc2ba73
......@@ -8,7 +8,7 @@
import { registerPlugins } from '@/plugins'
// Components
import App from './audit.vue'
import App from './audit_games.vue'
// Composables
import { createApp } from 'vue'
......
vuetify-project/src/components/audit.vue → vuetify-project/src/audit_games.vue
View file @ 7cc2ba73
......@@ -11,6 +11,9 @@
<v-text-field v-model="search" append-icon="mdi-magnify" label="搜索" single-line hide-details></v-text-field>
</v-toolbar>
</template>
<template v-slot:item.date="{ item }">
{{ item.date }}
</template>
<template v-slot:item.team="{ item }">
{{ item.homeTeam }} VS {{ item.awayTeam }}
</template>
......@@ -31,18 +34,63 @@
import { ref } from 'vue';
import { reactive } from 'vue';
import { computed } from 'vue';
import axios from 'axios';
const matches = ref(new Array());
refresh();
function refresh(){
axios.get('/api/lauchedGames',)
.then(function(response){
const data = response.data;
for(var i = 0; i < data.Games.length; i++){
var match = {
id:data.Games[i].id,
date:data.Games[i].game_date,
homeTeam:data.Games[i].player1_real_name,
awayTeam:data.Games[i].player2_real_name,
homeScore:data.Games[i].score1,
awayScore:data.Games[i].score2,
verify:true,
}
matches.value[i] = match;
}
})
.catch(function (error) {
console.log(error);
})
}
function refresh1(){
axios.get('/api/lauchedGames',)
.then(function(response){
const data = response.data;
const matches = ref(new Array());
for(var i = 0; i < data.Games.length; i++){
var match = {
id:data.Games[i].id,
date:data.Games[i].game_date,
homeTeam:data.Games[i].player1_real_name,
awayTeam:data.Games[i].player2_real_name,
homeScore:data.Games[i].score1,
awayScore:data.Games[i].score2,
verify:true,
}
matches.value[i] = match;
}
})
.catch(function (error) {
console.log(error);
})
}
const search = ref('');
const headers = reactive([
{ title: '比赛', key: 'team' },
{ title: '比分', key: 'score' },
{ title: '日期', key: 'date', sortable: false },
{ title: '比赛', key: 'team', sortable: false },
{ title: '比分', key: 'score', sortable: false },
{ title: '审核', key: 'actions', sortable: false }
]);
const matches = ref([
{ id: 1, homeTeam: '张三', awayTeam: '零', homeScore: 2, awayScore: 1, status: 'pending' },
{ id: 2, homeTeam: '李四', awayTeam: '一', homeScore: 0, awayScore: 3, status: 'pending' },
{ id: 3, homeTeam: '王五', awayTeam: '二', homeScore: 2, awayScore: 2, status: 'pending' },
]);
// const matches = ref(new Array());
const filteredMatches = computed(() => {
// return matches.value
......@@ -55,12 +103,30 @@ const filteredMatches = computed(() => {
})
function approveMatch(match) {
// Perform approval logic
match.status = 'approved';
}
function rejectMatch(match) {
// Perform rejection logic
match.status = 'rejected';
match.verify = true;
axios.post('/api/confirmGame',{
game_id:match.id,
confirm:match.verify
})
.then(function(){
refresh1();
})
.catch(function (error) {
console.log(error);
})
}
function rejectMatch(match){
match.verify = false;
axios.post('/api/confirmGame',{
game_id:match.id,
confirm:match.verify
})
.then(function(){
refresh1();
})
.catch(function (error) {
console.log(error);
})
}
</script>
\ No newline at end of file
vuetify-project/src/components/gamemanage.vue
View file @ 7cc2ba73
......@@ -10,46 +10,45 @@
<v-form v-model="isValid">
<v-row no-gutters>
<v-col align-self="center">
<v-autocomplete variant="underlined" v-model="player1" label="姓名" :rules="[rules.player1]"
:items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"></v-autocomplete>
<v-autocomplete variant="underlined" v-model="player1" label="姓名"
:rules="[rules.player_not_none, rules.player1]" :items="arr"></v-autocomplete>
</v-col>
<v-col cols="2" align-self="center">
<div class="text-h6" style="text-align: center;">VS</div>
</v-col>
<v-col align-self="center">
<v-autocomplete variant="underlined" v-model="player2" label="姓名" :rules="[rules.player2]"
:items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"></v-autocomplete>
<v-autocomplete variant="underlined" v-model="player2" label="姓名"
:rules="[rules.player_not_none, rules.player2]" :items="arr"></v-autocomplete>
</v-col>
</v-row>
<v-row no-gutters>
<v-col align-self="center">
<v-select variant="underlined" v-model="score1" label="得分" :rules="[rules.score1]"
<v-select variant="underlined" v-model="score1" label="得分" :rules="[rules.score_not_none, rules.score1]"
:items="['0', '1', '2', '3', '4', '5']"></v-select>
</v-col>
<v-col cols="2" align-self="center">
<div class="text-h6" style="text-align: center;">:</div>
</v-col>
<v-col align-self="center">
<v-select variant="underlined" v-model="score2" label="得分" :rules="[rules.score2]"
<v-select variant="underlined" v-model="score2" label="得分" :rules="[rules.score_not_none, rules.score2]"
:items="['0', '1', '2', '3', '4', '5']"></v-select>
</v-col>
</v-row>
<v-dialog>
<template v-slot:activator="{ props: activatorProps }">
<v-btn block v-bind="activatorProps" class="text-none mb-4" color="indigo" size="large"
variant="outlined">
<v-btn block v-bind="activatorProps" class="text-none mb-4" color="indigo" size="large" variant="outlined">
<template v-slot:default>
{{ selectedDate.getFullYear() }}-{{ selectedDate.getMonth() + 1 }}-{{ selectedDate.getDate() }}
选择比赛日期：{{ selectedDate.toLocaleDateString() }}
</template>
</v-btn>
</template>
<template v-slot:default="{ isActive }">
<v-card>
<v-locale-provider locale="zhHans">
<v-date-picker v-model="selectedDate" header="日期" title="选择比赛日期" color="indigo" width="100%"></v-date-picker>
</v-locale-provider>
<v-locale-provider locale="zhHans">
<v-date-picker v-model="selectedDate" header="日期" title="选择比赛日期" color="indigo"
width="100%"></v-date-picker>
</v-locale-provider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn variant="flat" text="确定" color="indigo" @click="isActive.value = false"></v-btn>
......@@ -66,11 +65,24 @@
</v-card>
<v-dialog v-model="dialog" width="auto">
<v-card width="300px">
<v-card-title>
{{ cardtitle }}
</v-card-title>
<v-card-text>
{{ cardtext }}
</v-card-text>
<template v-slot:actions>
<v-btn class="ms-auto" variant="flat" color="indigo" text="确认" @click="dialog = false"></v-btn>
</template>
</v-card>
</v-dialog>
<div>
<v-card class="mx-auto my-2" href="../../game_detail.html" width="95%" rel="noopener" target="_blank" title="已提交比赛"
<v-card class="mx-auto my-2" href="/lauched_games.html" width="95%" rel="noopener" target="_blank" title="已提交比赛"
append-icon="mdi-chevron-right"></v-card>
<v-card class="mx-auto my-2" href="../../audit.html" width="95%" rel="noopener" target="_blank" title="待审核比赛"
<v-card class="mx-auto my-2" href="/audit_games.html" width="95%" rel="noopener" target="_blank" title="待审核比赛"
append-icon="mdi-chevron-right"></v-card>
</div>
......@@ -88,37 +100,66 @@ const score1 = ref(null);
const score2 = ref(null);
const loading = ref(false);
const selectedDate = ref(new Date());
const arr = ref(new Array());
const id = ref(null);
var s1;
var s2;
var p1_id;
var p2_id;
const rules = reactive({
email: v => !!(v || '').match(/@/) || 'Please enter a valid email',
length: len => v => (v || '').length >= len || `Invalid character length, required ${len}`,
player1: v => !!v || '姓名不能为空',
player2: v => !!v || '姓名不能为空',
// password: v => !!(v || '').match(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*(_|[^\w])).+$/) ||
// 'Password must contain an upper case letter, a numeric character, and a special character',
player_not_none: v => !!v || '姓名不能为空',
player1: v => v != player2.value || '姓名不能相同',
player2: v => v != player1.value || '姓名不能相同',
required: v => !!v || 'This field is required',
score1: v => !!v || '得分不能为空',
score2: v => !!v || '得分不能为空',
score_not_none: v => !!v || '得分不能为空',
score1: v => v != score2.value || '得分不能相同',
score2: v => v != score1.value || '得分不能相同',
});
function submit() {
loading.value = true;
axios.get('/api/players', {
usrname: usrname.value,
psword: password.value
axios.get('/api/players')
.then(function (response) {
const data = response.data;
for (var i = 0; i < data.Players.length; i++) {
arr.value[i] = data.Players[i].player_id.toString() + '-' + data.Players[i].player_real_name;
}
})
.catch(function (error) {
console.log(error);
})
.then(function (response) {
})
.catch(function (error) {
console.log(error);
});
axios.post('/api/register', {
usrname: usrname.value,
psword: password.value
function submit() {
loading.value = true;
p1_id = parseInt(player1.value);
p2_id = parseInt(player2.value);
s1 = parseInt(score1.value);
s2 = parseInt(score2.value);
if (s1 < s2) {
id.value = p1_id;
}
else {
id.value = p2_id;
}
axios.post('/api/launchGame', {
player1_id: p1_id,
score1: s1,
player2_id: p2_id,
score2: s2,
confirmer_id: id.value,
game_date: selectedDate.value.toLocaleDateString(),
})
.then(function (response) {
const data = response.data;
console.log(data)
if (data.status == 'SUCCESS') {
info('提交成功！', "");
}
})
.catch(function (error) {
console.log(error);
......@@ -127,6 +168,15 @@ function submit() {
}
const cardtitle = ref(null);
const cardtext = ref(null);
const dialog = ref(false);
function info(title, text) {
cardtitle.value = title;
cardtext.value = text;
dialog.value = true;
}
</script>
<style>
......
vuetify-project/src/components/login_comp.vue
View file @ 7cc2ba73
......@@ -12,16 +12,33 @@
</v-btn>
</v-card-actions>
<v-dialog v-model="realname1">
<v-card>
<v-card-text>如要加入俱乐部，请输入真实姓名：
<v-text-field v-model="realname" variant="filled" :rules="[rules.realname]" color="indigo"
label="姓名"></v-text-field>
<v-btn :disabled="!isValid" :loading="loading" block class="text-none mb-4" color="indigo" size="x-large"
variant="flat" @click="submit">
提交
</v-btn>
<v-form v-model="isValid">
<v-dialog v-model="realname1">
<v-card>
<v-card-text>如要加入俱乐部，请输入真实姓名：
<v-text-field v-model="realname" variant="filled" :rules="[rules.realname]" color="indigo"
label="姓名"></v-text-field>
<v-btn :disabled="!isValid" :loading="loading" block class="text-none mb-4" color="indigo" size="x-large"
variant="flat" @click="submit">
提交
</v-btn>
</v-card-text>
</v-card>
</v-dialog>
</v-form>
<v-dialog v-model="dialog" width="auto">
<v-card width="300px">
<v-card-title>
{{ cardtitle }}
</v-card-title>
<v-card-text>
{{ cardtext }}
</v-card-text>
<template v-slot:actions>
<v-btn class="ms-auto" variant="flat" color="indigo" text="确认" @click="dialog = false"></v-btn>
</template>
</v-card>
</v-dialog>
......@@ -88,7 +105,7 @@ function submit() {
name: realname.value,
})
.then(function () {
alert('提交完成，请联系管理员审核');
info('提交成功！', "请联系管理员审核！");
})
.catch(function (error) {
console.log(error);
......@@ -96,4 +113,13 @@ function submit() {
loading.value = false;
}
const cardtitle = ref(null);
const cardtext = ref(null);
const dialog = ref(false);
function info(title, text) {
cardtitle.value = title;
cardtext.value = text;
dialog.value = true;
}
</script>
\ No newline at end of file
vuetify-project/src/components/register_comp.vue
View file @ 7cc2ba73
......@@ -12,6 +12,19 @@
注册
</v-btn>
</v-card-actions>
<v-dialog v-model="dialog" width="auto">
<v-card width="300px">
<v-card-title>
{{ cardtitle }}
</v-card-title>
<v-card-text>
{{ cardtext }}
</v-card-text>
<template v-slot:actions>
<v-btn class="ms-auto" variant="flat" color="indigo" text="确认" @click="dialog = false"></v-btn>
</template>
</v-card>
</v-dialog>
</template>
<script setup>
import { ref } from 'vue';
......@@ -45,11 +58,11 @@ function register(){
.then(function (response) {
const data = response.data;
if(data.status == 'SUCCESS'){
alert('注册成功！');
info('注册成功！', "");
}
else if(data.status == 'FAILED')
{
alert('用户名已存在！');
info('用户名已存在！', "");
}
})
.catch(function (error) {
......@@ -58,4 +71,13 @@ function register(){
loading.value =false;
}
const cardtitle = ref(null);
const cardtext = ref(null);
const dialog = ref(false);
function info(title,text) {
cardtitle.value = title;
cardtext.value = text;
dialog.value=true;
}
</script>
\ No newline at end of file
vuetify-project/src/components/game_detail.js → vuetify-project/src/lauched_games.js
View file @ 7cc2ba73
......@@ -8,7 +8,7 @@
import { registerPlugins } from '@/plugins'
// Components
import App from './game_detail.vue'
import App from './lauched_games.vue'
// Composables
import { createApp } from 'vue'
......
vuetify-project/src/components/game_detail.vue → vuetify-project/src/lauched_games.vue
View file @ 7cc2ba73
......@@ -11,6 +11,9 @@
hide-details></v-text-field>
</v-toolbar>
</template>
<template v-slot:item.date="{ item }">
{{ item.date }}
</template>
<template v-slot:item.name="{ item }">
{{ item.username }} VS {{ item.opponentname }}
</template>
......@@ -18,9 +21,9 @@
{{ item.userScore }} - {{ item.opponentScore }}
</template>
<template v-slot:item.verified="{ item }">
<v-icon v-if="item.verified === 1" color="blue">mdi-help-circle</v-icon>
<v-icon v-else-if="item.verified === 2" color="red">mdi-check-circle</v-icon>
<v-icon v-else-if="item.verified === 3" color="green">mdi-close-circle</v-icon>
<v-icon v-if="item.verified === 'WAITING'" color="blue">mdi-help-circle</v-icon>
<v-icon v-else-if="item.verified === 'PASSED'" color="green">mdi-check-circle</v-icon>
<v-icon v-else-if="item.verified === 'REJECT'" color="red">mdi-close-circle</v-icon>
<!-- <v-icon :color="item.verified != 1 ? (item.verified == 2 ? 'green' : 'red') : 'red'">{{ item.verified ?
'mdi-check-circle' :
'mdi-close-circle' }}</v-icon> -->
......@@ -33,19 +36,20 @@
import { ref } from 'vue';
import { reactive } from 'vue';
import { computed } from 'vue';
import axios from 'axios';
const search = ref('');
const headers = reactive([
{ title: '比赛', key: 'name', sortable: true },
{ title: '比分', key: 'score', sortable: true },
{ title: '日期', key: 'date', sortable: false },
{ title: '比赛', key: 'name', sortable: false },
{ title: '比分', key: 'score', sortable: false },
{ title: '审核状态', key: 'verified' },
]);
const matches = ref([
{ id: 1, username: '张三', opponentname: '零', userScore: 3, opponentScore: 2, verified: 1 },
{ id: 2, username: '李四', opponentname: '一', userScore: 1, opponentScore: 1, verified: 2 },
{ id: 3, username: '王五', opponentname: '二', userScore: 2, opponentScore: 4, verified: 3 },
]);
const matches = ref(new Array());
// matches = [
// { id: 1, username: '张三', opponentname: '零', userScore: 3, opponentScore: 2, verified: "PASSED" },
// ];
const filteredMatches = computed(() => {
// return matches.value
......@@ -57,4 +61,24 @@ const filteredMatches = computed(() => {
);
})
axios.get('/api/myLauchedGames',)
.then(function(response){
const data = response.data;
for(var i = 0; i < data.Games.length; i++){
// matches.value[i].id = i+1;
var match = {
id:data.Games[i].id,
date:data.Games[i].game_date,
username:data.Games[i].player1_real_name,
opponentname:data.Games[i].player2_real_name,
userScore:data.Games[i].score1,
opponentScore:data.Games[i].score2,
verified:data.Games[i].status,
}
matches.value[i] = match;
}
})
.catch(function (error) {
console.log(error);
})
</script>
\ No newline at end of file
vuetify-project/vite.config.mjs
View file @ 7cc2ba73
......@@ -55,6 +55,8 @@ export default defineConfig({
home: resolve(__dirname, 'home.html'),
space: resolve(__dirname, 'space.html'),
main: resolve(__dirname, 'main.html'),
lauched_games: resolve(__dirname, 'lauched_games.html'),
audit_games: resolve(__dirname, 'audit_games.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