Commit e1c5cfb4 authored by sunxiwei's avatar sunxiwei

登录、注册ajax;

parent 8993c8ae
...@@ -9,9 +9,10 @@ ...@@ -9,9 +9,10 @@
"version": "0.0.0", "version": "0.0.0",
"dependencies": { "dependencies": {
"@mdi/font": "7.0.96", "@mdi/font": "7.0.96",
"axios": "^1.6.8",
"roboto-fontface": "*", "roboto-fontface": "*",
"vue": "^3.3.0", "vue": "^3.3.0",
"vuetify": "^3.0.0" "vuetify": "^3.5.9"
}, },
"devDependencies": { "devDependencies": {
"@vitejs/plugin-vue": "^4.5.0", "@vitejs/plugin-vue": "^4.5.0",
...@@ -758,6 +759,21 @@ ...@@ -758,6 +759,21 @@
"node": ">= 8" "node": ">= 8"
} }
}, },
"node_modules/asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
},
"node_modules/axios": {
"version": "1.6.8",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.6.8.tgz",
"integrity": "sha512-v/ZHtJDU39mDpyBoFVkETcd/uNdxrWRrg3bKpOKzXFA6Bvqopts6ALSMU3y6ijYxbw2B+wPrIv46egTzJXCLGQ==",
"dependencies": {
"follow-redirects": "^1.15.6",
"form-data": "^4.0.0",
"proxy-from-env": "^1.1.0"
}
},
"node_modules/balanced-match": { "node_modules/balanced-match": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
...@@ -818,6 +834,17 @@ ...@@ -818,6 +834,17 @@
"fsevents": "~2.3.2" "fsevents": "~2.3.2"
} }
}, },
"node_modules/combined-stream": {
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
"integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
"dependencies": {
"delayed-stream": "~1.0.0"
},
"engines": {
"node": ">= 0.8"
}
},
"node_modules/cross-env": { "node_modules/cross-env": {
"version": "7.0.3", "version": "7.0.3",
"resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz", "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
...@@ -872,6 +899,14 @@ ...@@ -872,6 +899,14 @@
} }
} }
}, },
"node_modules/delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
"engines": {
"node": ">=0.4.0"
}
},
"node_modules/entities": { "node_modules/entities": {
"version": "4.5.0", "version": "4.5.0",
"resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz", "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
...@@ -963,6 +998,38 @@ ...@@ -963,6 +998,38 @@
"node": ">=8" "node": ">=8"
} }
}, },
"node_modules/follow-redirects": {
"version": "1.15.6",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
"integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
"funding": [
{
"type": "individual",
"url": "https://github.com/sponsors/RubenVerborgh"
}
],
"engines": {
"node": ">=4.0"
},
"peerDependenciesMeta": {
"debug": {
"optional": true
}
}
},
"node_modules/form-data": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
"integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"mime-types": "^2.1.12"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/fsevents": { "node_modules/fsevents": {
"version": "2.3.3", "version": "2.3.3",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
...@@ -1120,6 +1187,25 @@ ...@@ -1120,6 +1187,25 @@
"node": ">=8.6" "node": ">=8.6"
} }
}, },
"node_modules/mime-db": {
"version": "1.52.0",
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
"integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
"engines": {
"node": ">= 0.6"
}
},
"node_modules/mime-types": {
"version": "2.1.35",
"resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
"integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
"dependencies": {
"mime-db": "1.52.0"
},
"engines": {
"node": ">= 0.6"
}
},
"node_modules/minimatch": { "node_modules/minimatch": {
"version": "9.0.3", "version": "9.0.3",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
...@@ -1226,6 +1312,11 @@ ...@@ -1226,6 +1312,11 @@
"node": "^10 || ^12 || >=14" "node": "^10 || ^12 || >=14"
} }
}, },
"node_modules/proxy-from-env": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
},
"node_modules/queue-microtask": { "node_modules/queue-microtask": {
"version": "1.2.3", "version": "1.2.3",
"resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
...@@ -1588,9 +1679,9 @@ ...@@ -1588,9 +1679,9 @@
} }
}, },
"node_modules/vuetify": { "node_modules/vuetify": {
"version": "3.5.5", "version": "3.5.9",
"resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.5.5.tgz", "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.5.9.tgz",
"integrity": "sha512-WENee4TkmWmwMEtmAHaljQZjR2AdmK1zetzH2rpEhlvkiTDEuIB0yKLGBv+vshH0XBRS84cf7uSjfceOvAhhSQ==", "integrity": "sha512-tA3N2uWZFNSZRFNnXN841x4rWozYXKC0fGW/mJIwcKkQiI0+gmVCETtjF8bnOS7L1s0buWzw94uYTlXQa5AQ4w==",
"engines": { "engines": {
"node": "^12.20 || >=14.13" "node": "^12.20 || >=14.13"
}, },
......
...@@ -8,9 +8,10 @@ ...@@ -8,9 +8,10 @@
}, },
"dependencies": { "dependencies": {
"@mdi/font": "7.0.96", "@mdi/font": "7.0.96",
"axios": "^1.6.8",
"roboto-fontface": "*", "roboto-fontface": "*",
"vue": "^3.3.0", "vue": "^3.3.0",
"vuetify": "^3.0.0" "vuetify": "^3.5.9"
}, },
"devDependencies": { "devDependencies": {
"@vitejs/plugin-vue": "^4.5.0", "@vitejs/plugin-vue": "^4.5.0",
......
...@@ -7,45 +7,63 @@ ...@@ -7,45 +7,63 @@
<!-- <v-card-title color="indigo"> <!-- <v-card-title color="indigo">
提交比赛 提交比赛
</v-card-title> --> </v-card-title> -->
<v-form v-model="isValid">
<v-row no-gutters> <v-row no-gutters>
<v-col align-self="center"> <v-col align-self="center">
<v-autocomplete variant="underlined" v-model="player1" label="姓名" <v-autocomplete variant="underlined" v-model="player1" label="姓名" :rules="[rules.player1]"
:items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"></v-autocomplete> :items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"></v-autocomplete>
</v-col> </v-col>
<v-col cols="2" align-self="center"> <v-col cols="2" align-self="center">
<div class="text-h6" style="text-align: center;">VS</div> <div class="text-h6" style="text-align: center;">VS</div>
</v-col> </v-col>
<v-col align-self="center"> <v-col align-self="center">
<v-autocomplete variant="underlined" v-model="player2" label="姓名" <v-autocomplete variant="underlined" v-model="player2" label="姓名" :rules="[rules.player2]"
:items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"></v-autocomplete> :items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"></v-autocomplete>
</v-col> </v-col>
</v-row> </v-row>
<v-row no-gutters> <v-row no-gutters>
<v-col align-self="center"> <v-col align-self="center">
<v-autocomplete variant="underlined" v-model="score1" label="得分" <v-select variant="underlined" v-model="score1" label="得分" :rules="[rules.score1]"
:items="['0', '1', '2', '3', '4', '5']"></v-autocomplete> :items="['0', '1', '2', '3', '4', '5']"></v-select>
</v-col> </v-col>
<v-col cols="2" align-self="center"> <v-col cols="2" align-self="center">
<div class="text-h6" style="text-align: center;">:</div> <div class="text-h6" style="text-align: center;">:</div>
</v-col> </v-col>
<v-col align-self="center"> <v-col align-self="center">
<v-autocomplete variant="underlined" v-model="score2" label="得分" <v-select variant="underlined" v-model="score2" label="得分" :rules="[rules.score2]"
:items="['0', '1', '2', '3', '4', '5']"></v-autocomplete> :items="['0', '1', '2', '3', '4', '5']"></v-select>
</v-col> </v-col>
</v-row> </v-row>
<v-btn :disabled="loading" :loading="loading" class="text-none mb-4" color="indigo-lighten-2" size="large" <v-dialog>
variant="flat" block @click="loading = !loading"> <template v-slot:activator="{ props: activatorProps }">
<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() }}
</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-card-actions>
<v-spacer></v-spacer>
<v-btn variant="flat" text="确定" color="indigo" @click="isActive.value = false"></v-btn>
</v-card-actions>
</v-card>
</template>
</v-dialog>
<v-btn :disabled="!isValid" :loading="loading" class="text-none mb-4" color="indigo" size="large" variant="flat"
block @click="submit">
提交 提交
</v-btn> </v-btn>
</v-form>
</v-container> </v-container>
<!-- <v-container>
</v-container> -->
<!-- <v-container>
</v-container> -->
</v-card> </v-card>
...@@ -60,15 +78,53 @@ ...@@ -60,15 +78,53 @@
<script setup> <script setup>
import { ref } from 'vue'; import { ref } from 'vue';
import { reactive } from 'vue';
import axios from 'axios';
// import { reactive } from 'vue'; const isValid = ref(false);
const player1 = ref(null); const player1 = ref(null);
const player2 = ref(null); const player2 = ref(null);
const score1 = ref(null); const score1 = ref(null);
const score2 = ref(null); const score2 = ref(null);
const loading = ref(false); const loading = ref(false);
const selectedDate = ref(new Date());
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',
required: v => !!v || 'This field is required',
score1: v => !!v || '得分不能为空',
score2: v => !!v || '得分不能为空',
});
function submit() {
loading.value = true;
axios.get('/api/players', {
usrname: usrname.value,
psword: password.value
})
.then(function (response) {
})
.catch(function (error) {
console.log(error);
});
axios.post('/api/register', {
usrname: usrname.value,
psword: password.value
})
.then(function (response) {
})
.catch(function (error) {
console.log(error);
});
loading.value = false;
}
</script> </script>
......
<template> <template>
<v-form <v-form ref="form" v-model="isValid" class="pa-4 pt-6">
ref="form" <v-text-field v-model="usrname" variant="filled" :rules="[rules.usrname]" color="indigo" label="用户名"></v-text-field>
v-model="isValid" <v-text-field v-model="password" variant="filled" :rules="[rules.password]" color="indigo" label="密码"
class="pa-4 pt-6" type="password"></v-text-field>
>
<v-text-field
v-model="usrname"
variant="filled"
:rules="[rules.usrname]"
color="pink"
label="用户名"
></v-text-field>
<v-text-field
v-model="password"
variant="filled"
:rules="[rules.password]"
color="pink"
label="密码"
type="password"
></v-text-field>
<!--
:rules="[rules.password]"
counter="6"
style="min-height: 96px"
<v-text-field
v-model="email"
:rules="[rules.email]"
variant="filled"
color="deep-purple"
label="Email address"
type="email"
></v-text-field> -->
<!-- <v-textarea
v-model="bio"
auto-grow
variant="filled"
color="deep-purple"
label="Bio"
rows="1"
></v-textarea> -->
</v-form> </v-form>
<!-- <v-divider></v-divider> -->
<v-card-actions> <v-card-actions>
<v-btn <v-btn :disabled="!isValid" :loading="loading" block class="text-none mb-4" color="indigo" size="x-large"
:disabled="!isValid" variant="flat" @click="login">
:loading="loading"
block
class="text-none mb-4"
color="pink"
size="x-large"
variant="flat"
@click="loading = !loading"
>
登录 登录
</v-btn> </v-btn>
<!-- <v-btn
variant="text"
@click="form.reset()"
>
Clear
</v-btn>
<v-spacer></v-spacer>
<v-btn
:disabled="!isValid"
:loading="isLoading"
color="deep-purple-accent-4"
>
Submit
</v-btn> -->
</v-card-actions> </v-card-actions>
<!-- <v-dialog <v-dialog v-model="realname1">
v-model="dialog"
max-width="400"
persistent
>
<v-card> <v-card>
<v-card-title class="text-h5 bg-grey-lighten-3"> <v-card-text>如要加入俱乐部,请输入真实姓名:
Legal <v-text-field v-model="realname" variant="filled" :rules="[rules.realname]" color="indigo"
</v-card-title> label="姓名"></v-text-field>
<v-card-text> <v-btn :disabled="!isValid" :loading="loading" block class="text-none mb-4" color="indigo" size="x-large"
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. variant="flat" @click="submit">
</v-card-text> 提交
<v-divider></v-divider>
<v-card-actions>
<v-btn
variant="text"
@click="agreement = false, dialog = false"
>
No
</v-btn>
<v-spacer></v-spacer>
<v-btn
color="deep-purple"
variant="tonal"
@click="agreement = true, dialog = false"
>
Yes
</v-btn> </v-btn>
</v-card-actions> </v-card-text>
</v-card> </v-card>
</v-dialog> --> </v-dialog>
</template> </template>
<script setup> <script setup>
import { ref } from 'vue'; import { ref } from 'vue';
import { reactive } from 'vue'; import { reactive } from 'vue';
import axios from 'axios';
const form = ref(null) const form = ref(null);
const rules = reactive({ const rules = reactive({
email: v => !!(v || '').match(/@/) || 'Please enter a valid email', email: v => !!(v || '').match(/@/) || 'Please enter a valid email',
length: len => v => (v || '').length >= len || `Invalid character length, required ${len}`, length: len => v => (v || '').length >= len || `Invalid character length, required ${len}`,
usrname:v => !!v || '用户名不能为空', usrname: v => !!v || '用户名不能为空',
password:v => !!v || '密码不能为空', password: v => !!v || '密码不能为空',
// password: v => !!(v || '').match(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*(_|[^\w])).+$/) || // password: v => !!(v || '').match(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*(_|[^\w])).+$/) ||
// 'Password must contain an upper case letter, a numeric character, and a special character', // 'Password must contain an upper case letter, a numeric character, and a special character',
required: v => !!v || 'This field is required', required: v => !!v || 'This field is required',
realname: v => !!v || '姓名不能为空',
});
const usrname = ref(null);
const password = ref(null);
const realname = ref(null);
const isValid = ref(false);
const realname1 = ref(false);
const loading = ref(false);
function login() {
loading.value = true;
axios.post('/api/login', {
usrname: usrname.value,
psword: password.value
})
.then(function (response) {
const data = response.data;
// console.log(data.is_member);
// console.log(data.is_member == 0);
if (data.status == 'SUCCESS') {
if (data.is_su) {
// window.location.href = '/main.html';
// console.log("su");
}
else if (data.is_member) {
// console.log("member");
window.location.href = '/main.html';
}
else if (!data.is_member) {
// console.log("not member");
// console.log(realname1);
realname1.value = true;
}
}
})
.catch(function (error) {
console.log(error);
}); });
const usrname = ref(null); loading.value = false;
const password = ref(null); }
const isValid = ref(false);
const isLoading = ref(false);
const loading = ref(false);
function submit() {
loading.value = true;
axios.post('/api/setRealName', {
name: realname.value,
})
.then(function () {
alert('提交完成,请联系管理员审核');
})
.catch(function (error) {
console.log(error);
});
loading.value = false;
}
// export default { </script>
// data: () => ({ \ No newline at end of file
// agreement: false,
// bio: 'Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts',
// dialog: false,
// email: undefined,
// isValid: false,
// isLoading: false,
// password: undefined,
// phone: undefined,
// rules: {
// email: v => !!(v || '').match(/@/) || 'Please enter a valid email',
// length: len => v => (v || '').length >= len || `Invalid character length, required ${len}`,
// password: v => !!(v || '').match(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*(_|[^\w])).+$/) ||
// 'Password must contain an upper case letter, a numeric character, and a special character',
// required: v => !!v || 'This field is required',
// },
// }),
// }
</script>
\ No newline at end of file
<template> <template>
<v-form <v-form ref="form" v-model="isValid" class="pa-4 pt-6">
ref="form" <v-text-field v-model="usrname" variant="filled" :rules="[rules.usrname]" color="indigo" label="用户名"></v-text-field>
v-model="isValid" <v-text-field v-model="password" variant="filled" :rules="[rules.password]" color="indigo" label="密码"
class="pa-4 pt-6" type="password"></v-text-field>
> <v-text-field v-model="confirmpassword" variant="filled" :rules="[rules.confirmpassword]" color="indigo" label="确认密码"
<v-text-field type="password"></v-text-field>
v-model="usrname"
variant="filled"
:rules="[rules.usrname]"
color="pink"
label="用户名"
></v-text-field>
<v-text-field
v-model="password"
variant="filled"
:rules="[rules.password]"
color="pink"
label="密码"
type="password"
></v-text-field>
<v-text-field
v-model="confirmpassword"
variant="filled"
:rules="[rules.confirmpassword]"
color="pink"
label="确认密码"
type="password"
></v-text-field>
<!--
:rules="[rules.password]"
counter="6"
style="min-height: 96px"
<v-text-field
v-model="email"
:rules="[rules.email]"
variant="filled"
color="deep-purple"
label="Email address"
type="email"
></v-text-field> -->
<!-- <v-textarea
v-model="bio"
auto-grow
variant="filled"
color="deep-purple"
label="Bio"
rows="1"
></v-textarea> -->
</v-form> </v-form>
<v-card-actions> <v-card-actions>
<v-btn <v-btn :disabled="!isValid" :loading="loading" block class="text-none mb-4" color="indigo" size="x-large"
:disabled="!isValid" variant="flat" @click="register">
:loading="loading"
block
class="text-none mb-4"
color="pink"
size="x-large"
variant="flat"
@click="loading = !loading"
>
注册 注册
</v-btn> </v-btn>
<!-- <v-btn
variant="text"
@click="form.reset()"
>
Clear
</v-btn>
<v-spacer></v-spacer>
<v-btn
:disabled="!isValid"
:loading="isLoading"
color="deep-purple-accent-4"
>
Submit
</v-btn> -->
</v-card-actions> </v-card-actions>
</template> </template>
<script setup> <script setup>
import { ref } from 'vue'; import { ref } from 'vue';
import { reactive } from 'vue'; import { reactive } from 'vue';
import axios from 'axios';
const form = ref(null) const form = ref(null)
const rules = reactive({ const rules = reactive({
email: v => !!(v || '').match(/@/) || 'Please enter a valid email', email: v => !!(v || '').match(/@/) || 'Please enter a valid email',
length: len => v => (v || '').length >= len || `Invalid character length, required ${len}`, length: len => v => (v || '').length >= len || `Invalid character length, required ${len}`,
usrname:v => !!v || '用户名不能为空', usrname: v => !!v || '用户名不能为空',
confirmpassword:v => v === password.value || '密码不匹配', confirmpassword: v => v === password.value || '密码不匹配',
password:v => !!v || '密码不能为空', password: v => !!v || '密码不能为空',
// password: v => !!(v || '').match(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*(_|[^\w])).+$/) || // password: v => !!(v || '').match(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*(_|[^\w])).+$/) ||
// 'Password must contain an upper case letter, a numeric character, and a special character', // 'Password must contain an upper case letter, a numeric character, and a special character',
required: v => !!v || 'This field is required', required: v => !!v || 'This field is required',
}); });
const usrname = ref(null); const usrname = ref(null);
const password = ref(null); const password = ref(null);
const confirmpassword = ref(null); const confirmpassword = ref(null);
const isValid = ref(false); const isValid = ref(false);
const isLoading = ref(false); // const isLoading = ref(false);
const loading = ref(false); const loading = ref(false);
function register(){
loading.value =true;
axios.post('/api/register', {
usrname:usrname.value,
psword:password.value
})
.then(function (response) {
const data = response.data;
if(data.status == 'SUCCESS'){
alert('注册成功!');
}
else if(data.status == 'FAILED')
{
alert('用户名已存在!');
}
})
.catch(function (error) {
console.log(error);
});
loading.value =false;
}
// export default { </script>
// data: () => ({ \ No newline at end of file
// agreement: false,
// bio: 'Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts',
// dialog: false,
// email: undefined,
// isValid: false,
// isLoading: false,
// password: undefined,
// phone: undefined,
// rules: {
// email: v => !!(v || '').match(/@/) || 'Please enter a valid email',
// length: len => v => (v || '').length >= len || `Invalid character length, required ${len}`,
// password: v => !!(v || '').match(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*(_|[^\w])).+$/) ||
// 'Password must contain an upper case letter, a numeric character, and a special character',
// required: v => !!v || 'This field is required',
// },
// }),
// }
</script>
\ No newline at end of file
...@@ -13,13 +13,13 @@ const tab = ref(null) ...@@ -13,13 +13,13 @@ const tab = ref(null)
<v-app class="h-100 w-100"> <v-app class="h-100 w-100">
<v-main class="h-100 w-100 d-flex justify-center align-center"> <v-main class="h-100 w-100 d-flex justify-center align-center">
<v-card class="main-card "> <v-card class="main-card ">
<div class="card-title bg-deep-purple-accent-4 text-h5 text-center pa-5"> <div class="card-title bg-indigo text-h5 text-center pa-5">
南高乒乓球俱乐部 南高乒乓球俱乐部
</div> </div>
<v-tabs <v-tabs
v-model="tab" v-model="tab"
bg-color="deep-purple-accent-4" bg-color="indigo"
grow grow
> >
<v-tab value="login"> <v-tab value="login">
......
...@@ -9,6 +9,8 @@ import { registerPlugins } from '@/plugins' ...@@ -9,6 +9,8 @@ import { registerPlugins } from '@/plugins'
// Components // Components
import App from './main.vue' import App from './main.vue'
import { createVuetify } from 'vuetify'
import { zhHans } from 'vuetify/locale'
// Composables // Composables
import { createApp } from 'vue' import { createApp } from 'vue'
...@@ -17,4 +19,12 @@ const app = createApp(App) ...@@ -17,4 +19,12 @@ const app = createApp(App)
registerPlugins(app) registerPlugins(app)
const vuetify = createVuetify({
locale: {
locale: 'zhHans',
messages: { zhHans },
},
})
app.use(vuetify)
app.mount('#app') app.mount('#app')
<script setup>
import { ref } from 'vue';
import Gamemanage from './components/gamemanage.vue';
import Space from './components/space.vue';
import Home from './components/home.vue';
const tab = ref(null)
</script>
<template> <template>
<div class="h-screen w-auto"> <div class="h-screen w-auto">
<v-window v-model="tab" class="h-screen w-auto"> <v-window v-model="tab" class="h-screen w-auto">
...@@ -42,6 +34,15 @@ const tab = ref(null) ...@@ -42,6 +34,15 @@ const tab = ref(null)
</div> </div>
</template> </template>
<script setup>
import { ref } from 'vue';
import Gamemanage from './components/gamemanage.vue';
import Space from './components/space.vue';
import Home from './components/home.vue';
const tab = ref(null)
</script>
<style> <style>
.tabs { .tabs {
width: 100%; width: 100%;
......
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