Skip to content

杨炀 / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
a7717cc5 by 杨炀
Options

no message

1 parent 0610fc57
Expand all
Inline Side-by-side
Showing 38 changed files with 876 additions and 135 deletions
package.json
......@@ -22,6 +22,7 @@
"echarts-wordcloud": "^2.1.0",
"element-plus": "2.2.27",
"file-saver": "2.0.5",
"flag-icon-css": "^4.1.7",
"fuse.js": "6.6.2",
"guid": "^0.0.12",
"js-cookie": "3.0.1",
......@@ -42,6 +43,7 @@
"vue-router": "4.1.4",
"vue-socket.io": "^3.0.10",
"vue-ueditor-wrap": "3.x",
"vue3-puzzle-vcode": "^1.1.7",
"vuedraggable": "^4.1.0",
"zxcvbn": "^4.4.2"
},
......
src/apiPc/login.js
import request from '@/utils/request'
export function loginZtx(username, password, code, uuid) {
export function loginDance(username, password, code, uuid) {
const data = {
username,
password,
......@@ -8,7 +8,7 @@ export function loginZtx(username, password, code, uuid) {
uuid
}
return request({
url: `/loginZtx`,
url: `/userLogin`,
headers: {
isToken: false
},
......
src/assets/dance/btn01.png
src/assets/dance/btn01.png

2.97 KB | W: | H:

src/assets/dance/btn01.png

2.9 KB | W: | H:

src/assets/dance/btn01.png
src/assets/dance/btn01.png
src/assets/dance/btn01.png
src/assets/dance/btn01.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/btn02.png
src/assets/dance/btn02.png

3 KB | W: | H:

src/assets/dance/btn02.png

3.57 KB | W: | H:

src/assets/dance/btn02.png
src/assets/dance/btn02.png
src/assets/dance/btn02.png
src/assets/dance/btn02.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/btn03.png
src/assets/dance/btn03.png

3.18 KB | W: | H:

src/assets/dance/btn03.png

3.19 KB | W: | H:

src/assets/dance/btn03.png
src/assets/dance/btn03.png
src/assets/dance/btn03.png
src/assets/dance/btn03.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/btn04.png
src/assets/dance/btn04.png

2.85 KB | W: | H:

src/assets/dance/btn04.png

2.79 KB | W: | H:

src/assets/dance/btn04.png
src/assets/dance/btn04.png
src/assets/dance/btn04.png
src/assets/dance/btn04.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/btn05.png
src/assets/dance/btn05.png

2.84 KB | W: | H:

src/assets/dance/btn05.png

3.29 KB | W: | H:

src/assets/dance/btn05.png
src/assets/dance/btn05.png
src/assets/dance/btn05.png
src/assets/dance/btn05.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/btn06.png
src/assets/dance/btn06.png

3.36 KB | W: | H:

src/assets/dance/btn06.png

3.34 KB | W: | H:

src/assets/dance/btn06.png
src/assets/dance/btn06.png
src/assets/dance/btn06.png
src/assets/dance/btn06.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/styles/index.scss
......@@ -182,3 +182,39 @@ aside {
margin-bottom: 10px;
}
}
.primary-kx{border:1px solid var(--el-color-primary)!important;color: var(--el-color-primary)!important;}
.primary-kx:hover{}
.border-info{background: rgba(69,61,234,0.04);
border: 1px solid #D3D1F6;
border-radius: 5px;padding: 20px;margin-bottom: 20px;}
.el-step__title.is-success{
color: var(--el-color-primary)!important;
}
.el-step__head.is-success{
.el-step__icon{color: #fff;border: none;
background: linear-gradient(90deg, #8623FC, #453DEA);}
}
.el-step__line{border-top:1px dashed #D1D6D8;background: transparent!important;
}
.el-step__head.is-process{border-top: var(--el-color-primary);
.el-step__icon{color: #fff;border: none;
background: linear-gradient(90deg, #8623FC, #453DEA);}
}
.el-step__title.is-process{
color: var(--el-color-primary)!important;font-weight: 400;
}
.el-step__title{font-weight: 400;}
.pcloginpop.el-dialog{
--el-dialog-box-shadow: 0px 0px 13px 0px rgba(153,153,153,0.14);
--el-dialog-border-radius: 10px;
.el-dialog__header{border-bottom: 1px solid #e1e1e1;
font-weight: 600;
font-size: 24px;}
.el-dialog__headerbtn{font-size: 24px!important;color: #A0A0A0;}
}
.w200px{width: 200px;}
.pt30{padding-top: 30px;}
.d-form-border{
border: 1px solid #E5E5E5;margin: 20px 0;padding: 20px}
......
src/assets/styles/ruoyi.scss
......@@ -496,7 +496,9 @@ img{display: block;}
}
}
.bg-lineg{ background: linear-gradient(90deg, #8623FC, #453DEA);color: #fff;}
.lineHead{height: 50px;padding: 15px;overflow: auto;
.lineHead{
//height: 50px;
padding: 15px;overflow: auto;
background: linear-gradient(90deg, #8623FC, #453DEA);
h3{margin: 0;background: #FFFFFF;
font-size: 18px;
......
src/assets/styles/variables.module.scss
......@@ -36,7 +36,7 @@ $base-sub-menu-background:#000c17;
$base-sub-menu-hover:#001528;
*/
$--color-primary: #409EFF;
$--color-primary: #453DEA;
$--color-success: #67C23A;
$--color-warning: #E6A23C;
$--color-danger: #F56C6C;
......
src/layoutPc/components/AppHeader.vue
......@@ -61,8 +61,14 @@
<!-- ｜ &nbsp;<span @click="goRegister">注册</span>-->
</el-button>
<el-button v-else style="border-radius: 20px;" class="loginBtn"><span @click="router.push('/center/myInfo')">个人中心</span>
&nbsp; ｜ &nbsp;<span @click="logout()">退出</span></el-button>
<el-button v-if="language==0" style="border-radius: 20px;" class="loginBtn">
<span @click="router.push('/center/myInfo')">个人中心</span>
&nbsp; ｜ &nbsp;<span @click="logout()">退出</span>
</el-button>
<el-button v-if="language==1" style="border-radius: 20px;" class="loginBtn">
<span @click="router.push('/center/myInfo')">个人中心</span>
&nbsp; ｜ &nbsp;<span @click="logout()">退出</span>
</el-button>
</div>
</div>
<a class="ropenbtn" @click="showDrawer">
......@@ -125,43 +131,6 @@
</el-menu>
</el-drawer>
<LoginDialog ref="pcloginDialog" @submitForm="reFlash" />
<el-dialog
v-model="registerVisible"
title="用户注册"
width="30%"
>
<el-form
ref="loginRef"
:model="loginForm"
>
<el-form-item prop="telNo" style="height: 40px">
<el-input
v-model="loginForm.telNo"
type="text"
auto-complete="off"
placeholder="请输入手机号"
>
<template #prefix><svg-icon icon-class="phone" class="el-input__icon input-icon" /></template>
</el-input>
</el-form-item>
<el-form-item prop="captcha" style="height: 40px">
<captcha ref="codeRef" v-model="loginForm.captcha" v-model:uuid="loginForm.uuid" style="height: 40px" @keyup.enter="handleLogin" />
</el-form-item>
<el-form-item prop="code" style="height: 40px">
<captcha-sms v-model="loginForm.code" style="height: 40px" :verify="checkCaptchaSms" @keyup.enter="handleLogin" @error="getCode" />
</el-form-item>
<el-form-item style="width: 100%;height: 40px">
<el-button
:loading="loading"
size="large"
type="primary"
style="width: 100%;border: 0;"
>
<span>注册</span>
</el-button>
</el-form-item>
</el-form>
</el-dialog>
<SearchPop v-if="language==0" ref="searchDialog" />
<SearchPop_en v-if="language==1" ref="searchDialog" />
</template>
......@@ -192,7 +161,7 @@ const mode = ref('horizontal')
const language = ref(cache.local.get('language') || 0)
onMounted(() => {
console.log(window.location.href)
if (useUserStore().perId) {
if (useUserStore().user) {
isLogin.value = true
}
if (window.location.href.indexOf('en') > -1) {
......@@ -241,17 +210,15 @@ const logout = () => {
}
const goLogin = (flag) => {
// let param = null
// if (_.isBoolean(flag)) {
// param = {
// notShowClose: flag
// }
// }
// proxy.$refs['pcloginDialog'].open(param)
}
const goRegister = () => {
registerVisible.value = true
let param = null
if (_.isBoolean(flag)) {
param = {
notShowClose: flag
}
}
proxy.$refs['pcloginDialog'].open(param)
}
const reFlash = () => {
// 刷新
location.reload()
......
src/main.js
......@@ -25,6 +25,8 @@ import { getConfigKey, updateConfigByKey } from '@/api/system/config'
import { parseTime, resetForm, addDateRange, handleTree, selectDictLabel, selectDictLabels, fillImgUrl, downloadFile } from '@/utils/ruoyi'
import { CountDown } from 'vant'
import 'vant/lib/index.css'
import 'flag-icon-css/css/flag-icons.css'
// 分页组件
import PaginationPc from '@/components/PaginationPc'
// 自定义表格工具组件
......@@ -55,6 +57,8 @@ import routerEn from './routerPc/en'
import localeCn from 'element-plus/lib/locale/lang/zh-cn' // 中文语言
import localeEn from 'element-plus/lib/locale/lang/en'
const language = cache.local.get('language') || 0
const app = createApp(App)
......@@ -110,6 +114,8 @@ app.use(store)
app.use(plugins)
app.use(elementIcons)
app.use(CountDown)
// app.use(Vcode)
app.component('SvgIcon', SvgIcon)
app.use(VueVideoPlayer)
......
src/permissionPc.js
......@@ -13,7 +13,7 @@ router.beforeEach((to, from, next) => {
// debugger
if (getToken()) {
// 判断当前用户是否已拉取完user_info信息
if (!useUserStore().name) {
if (!useUserStore().user) {
isRelogin.show = true
useUserStore().getInfo().then(() => {
isRelogin.show = false
......
src/routerPc/cn.js
......@@ -319,6 +319,34 @@ export const constantRoutes = [
]
},
{
path: 'register',
component: Empty,
redirect: '/register',
children: [
{
path: '0',
component: () => import('@/viewsPc/register/personal'),
name: 'personalRegister',
meta: { title: '个人注册' }
},{
path: '1',
component: () => import('@/viewsPc/register/team/team'),
name: 'teamRegister',
meta: { title: '团体注册' }
},{
path: 'userAgreement',
component: () => import('@/viewsPc/register/userAgreement'),
name: 'userAgreement',
meta: { title: '团体注册' }
},{
path: 'policy',
component: () => import('@/viewsPc/register/policy'),
name: 'policy',
meta: { title: '团体注册' }
}
]
},
{
path: 'search',
component: Empty,
redirect: '/search',
......
src/store/modules/user.js
......@@ -4,7 +4,7 @@ import defAva from '@/assets/images/profile.jpg'
import { getMyOwnMemberInfo } from '@/api/system/userInfo.js'
import { defineStore } from 'pinia'
import aes from '@/utils/aes'
import { loginZtx } from '@/apiPc/login.js'
import { loginDance } from '@/apiPc/login.js'
import { getRemindCount } from '@/api/system/user'
import { ElMessageBox } from 'element-plus'
......@@ -68,7 +68,7 @@ const useUserStore = defineStore(
const uuid = userInfo.uuid
const code = userInfo.code
return new Promise((resolve, reject) => {
loginZtx(username, password, code, uuid).then(res => {
loginDance(username, password, code, uuid).then(res => {
setToken(res.data.token)
this.token = res.data.token
resolve()
......
src/viewsPc/center/index.vue
......@@ -5,7 +5,7 @@
<el-col :span="6">
<el-card class="mt30">
<div class="center-menu">
<el-avatar :size="100" :src="fillImgUrl(myform.avatar)" />
<!-- <el-avatar :size="100" :src="fillImgUrl(myform.avatar)" />-->
<h3>{{ myform.nickName }}</h3>
<ul>
<li
......@@ -43,14 +43,14 @@ const router = useRouter()
const myform = ref({})
const menus = ref([
{
name: '个人中心',
name: '基础信息',
routeName: 'myInfo',
picUrl1: '/img/tool01.png',
picUrl2: '/img/tool01_dwn.png',
isActive: false
},
{
name: '团体信息',
name: '修改密码',
routeName: 'myTeam',
picUrl1: '/img/tool02.png',
picUrl2: '/img/tool02_dwn.png',
......
src/viewsPc/index.vue
......@@ -48,19 +48,19 @@
<div class="itemBox">
<el-row :gutter="20">
<el-col :sm="12" :lg="8">
<div class="item"><img src="@/assets/dance/btn01.png">赛事介绍</div></el-col>
<div class="item"><img src="@/assets/dance/btn01.png">酒店预订</div></el-col>
<el-col :sm="12" :lg="8">
<div class="item"><img src="@/assets/dance/btn02.png">赛事通知</div></el-col>
<div class="item"><img src="@/assets/dance/btn02.png">车辆预约</div></el-col>
<el-col :sm="12" :lg="8">
<div class="item"><img src="@/assets/dance/btn03.png">报名参与</div>
<div class="item"><img src="@/assets/dance/btn03.png">餐饮预约</div>
</el-col>
<el-col :sm="12" :lg="8">
<div class="item"><img src="@/assets/dance/btn04.png">票务预订</div>
</el-col>
<el-col :sm="12" :lg="8">
<div class="item"><img src="@/assets/dance/btn05.png">酒店预订</div></el-col>
<div class="item"><img src="@/assets/dance/btn05.png">化妆预约</div></el-col>
<el-col :sm="12" :lg="8">
<div class="item"><img src="@/assets/dance/btn06.png">化妆预约</div></el-col>
<div class="item"><img src="@/assets/dance/btn06.png">拍照预约</div></el-col>
</el-row>
</div>
......@@ -79,7 +79,8 @@
</div>
<!--赛事日历-->
<el-card :body-style="{'padding':'20px 20px'}">
<el-calendar v-model="calendarValue" :range="['2024-07-21','2024-07-27']">
<!-- <el-calendar v-model="calendarValue" :range="calendarRange">-->
<el-calendar>
<template #date-cell="data">
<div v-if="data.data.day.slice(8,10)==22" class="primaryDate date">22</div>
<div v-else class="date">
......@@ -112,15 +113,13 @@
</el-col>
<el-col :sm="24" :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">历史排名</h3>
<h3 class="leftboderTT">奖牌榜</h3>
<a class="more" href="#/saiC">MORE</a>
</div>
<!--历史排名-->
<el-card :body-style="{'padding':'10px 20px 18px'}">
<el-tabs v-model="activeRankName" @tab-click="rankTabClick">
<el-tab-pane v-for="(p,index) in rankTabs" :label="p.name" :name="index">
<el-table stripe :data="rankList">
<el-table-column label="排名" align="center" width="55" type="index">
<el-table-column label="名次" align="center" width="55" type="index">
<template #default="scope">
<span v-if="scope.row.index == 1" style="color:#F8A617">{{ scope.row.index }}</span>
<span v-else-if="scope.row.index == 2" style="color:#778B92">{{ scope.row.index }}</span>
......@@ -128,16 +127,44 @@
<span v-else>{{ scope.row.index }}</span>
</template>
</el-table-column>
<el-table-column label="姓名" prop="name" />
<el-table-column label="国家" prop="gj" />
<el-table-column label="分值" align="center">
<el-table-column label="国家/地区" prop="name">
<template #default="scope">
<div>
<span :class="`flag-icon flag-icon-${scope.row.code}`"></span>
{{ scope.row.gj }}</div>
</template>
</el-table-column>
<el-table-column prop="score">
<template #header>
<img src="@/assets/dance/1.png">
</template>
<template #default="scope">
<div class="text-warning">{{ scope.row.score }}</div>
</template>
</el-table-column>
<el-table-column prop="score">
<template #header>
<img src="@/assets/dance/2.png">
</template>
<template #default="scope">
<div class="text-blue">{{ scope.row.score }}</div>
</template>
</el-table-column>
<el-table-column prop="score">
<template #header>
<img src="@/assets/dance/3.png">
</template>
<template #default="scope">
<div class="text-primary">{{ scope.row.score }}</div>
</template>
</el-table-column>
<el-table-column label="总数" align="center">
<template #default="scope">
<div class="text-primary">{{ scope.row.score }}</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</el-card>
</el-col>
</el-row>
......@@ -356,12 +383,13 @@ const canNext = ref(false)
const activeRankName = ref(0)
const time = ref(0)
const rankList = ref([
{ index: '1', name: '陈莎莎', score: '170',gj:'中国' },
{ index: '2', name: '陈莎莎', score: '170' ,gj:'中国'},
{ index: '3', name: '陈莎莎', score: '170',gj:'中国' },
{ index: '4', name: '陈莎莎', score: '170',gj:'中国' },
{ index: '5', name: '陈莎莎', score: '170' ,gj:'中国'},
{ index: '6', name: '陈莎莎', score: '170' ,gj:'中国'}
{ index: '1', code: 'cn', score: '170',gj:'中国' },
{ index: '2', code: 'us', score: '170' ,gj:'中国'},
{ index: '3', code: 'de', score: '170',gj:'中国' },
{ index: '4', code: 'eg', score: '170',gj:'中国' },
{ index: '5', code: 'ly', score: '170' ,gj:'中国'},
{ index: '6', code: 'tn', score: '170' ,gj:'中国'},
{ index: '7', code: 'gw', score: '170' ,gj:'中国'}
])
const rankTabs = ref([
{ name: '拉丁舞' },
......@@ -389,7 +417,8 @@ const scores = ref([])
const nowscores = ref([])
const livelist = ref([])
const picList = ref([])
const calendarValue = ref('2024-07-22')
// const calendarValue = ref('2024-07-22')
// const calendarRange = ref(['2024-07-21','2024-07-27'])
const showgg = ref(true)
onMounted(() => {
init()
......@@ -465,7 +494,8 @@ const goNews = () => {
.item{box-shadow: 0px 0px 21px 0px rgba(41,23,101,0.14);margin: 10px 0;
display: flex;align-items: center;
font-size: 22px;
background: #FFFFFF;
background:url("@/assets/dance/btn_bg.png") no-repeat left #FFFFFF;
background-size: 100% 100%;
border-radius: 15px;
img{margin: 0 5%;}
}
......@@ -578,7 +608,7 @@ const goNews = () => {
}
}
.calendarList{border: 1px solid #F0F0F0;padding:12px 20px;overflow: auto;height: 220px;
.calendarList{border: 1px solid #F0F0F0;padding:12px 20px;overflow: auto;height: 225px;
ul{
li{background: #F6F9FE;margin:7px 0 7px 20px;position: relative;padding: 13px;
border-radius: 10px;
......
src/viewsPc/login.vue
<template>
<el-dialog
v-model="show" class="login" width="560px" append-to-body title="用户登录"
destroy-on-close :show-close="showClose" :close-on-click-modal="false"
<el-dialog close-icon="CircleClose" center
v-model="show" class="pcloginpop" width="450px" :append-to-body="true" :title="title"
destroy-on-close :show-close="showClose" :close-on-click-modal="false" @close="close"
>
<el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
<el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form" v-if="loginStatus==0">
<el-form-item prop="username">
<el-input
v-model.trim="loginForm.username"
size="large"
auto-complete="off"
placeholder="会员号"
placeholder="账号（注册时使用的邮箱/手机号码）"
>
<template #prefix>
<svg-icon icon-class="user" class="el-input__icon input-icon" />
</template>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model.trim="loginForm.password"
type="password"
size="large"
size="large" show-password
auto-complete="off"
placeholder="密码"
@keyup.enter="handleLogin"
>
<template #prefix><svg-icon
icon-class="password"
class="el-input__icon input-icon"
/></template>
</el-input>
</el-form-item>
<el-form-item v-if="captchaEnabled" prop="code">
......@@ -38,16 +33,15 @@
size="large"
auto-complete="off"
placeholder="验证码"
style="width: 70%"
@keyup.enter="handleLogin"
>
<template #prefix>
<svg-icon icon-class="validCode" class="el-input__icon input-icon" />
<template #append>
<div class="login-code">
<img :src="codeUrl" class="login-code-img" @click="getCode">
</div>
</template>
</el-input>
<div class="login-code">
<img :src="codeUrl" class="login-code-img" @click="getCode">
</div>
</el-form-item>
<el-form-item style="width:100%;">
......@@ -64,9 +58,96 @@
</el-button>
</el-form-item>
<el-form-item>
<span style="color: #999;font-size: 12px;">*默认密码是会员号+证件号后四位+)*%</span>
<!-- <span style="color: #999;font-size: 12px;">*默认密码是会员号+证件号后四位+)*%</span>-->
<div style="display: flex;justify-content: space-between;width: 100%;">
<a class="text-primary" @click="showChangePassword">忘记密码?</a>
<a @click="showRegister" class="text-primary">账号注册></a>
</div>
</el-form-item>
<el-form-item>
<div class="agreeLine">
登录或注册即代表同意
<a>《用户协议》</a>和
<a>《隐私政策》</a>
</div>
</el-form-item>
</el-form>
<div v-if="loginStatus==1">
<div class="rItem r1" @click="goRegister(1)">
<h3>机构用户</h3>
</div>
<div class="rItem r2" @click="goRegister(0)">
<h3>个人用户</h3>
</div>
</div>
<div v-if="loginStatus==2">
<el-form ref="changePasswordRef" :model="changePasswordForm" :rules="changePasswordRules" class="login-form">
<el-form-item prop="username">
<el-input
v-model.trim="changePasswordForm.username"
size="large"
auto-complete="off"
placeholder="注册时使用的邮箱/手机号码"
>
</el-input>
</el-form-item>
<el-form-item prop="code">
<el-input
v-model.trim="changePasswordForm.code"
size="large"
auto-complete="off"
placeholder="邮箱/手机验证码"
@keyup.enter="handleLogin"
>
<template #append>
<span class="text-primary" @click="sendsmsMsg">
发送验证码
</span>
</template>
</el-input>
<div class="vcodeBox" :style="isShow?'height:240px':'height:0'">
<Vcode :show="isShow" type="inside" @success="codeSuccess" @close="codeClose" @fail='codeFail'></Vcode>
</div>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model.trim="changePasswordForm.password"
type="password"
size="large" show-password
auto-complete="off"
placeholder="新密码"
@keyup.enter="handleLogin"
>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model.trim="changePasswordForm.confirmPassword"
type="password"
size="large" show-password
auto-complete="off"
placeholder="确认密码"
>
</el-input>
</el-form-item>
<el-form-item style="width:100%;">
<el-button
class="loginBtn"
:loading="loading"
size="large"
type="primary"
style="width:100%;"
@click.prevent="handleLogin"
>
<span>确定</span>
</el-button>
</el-form-item>
</el-form>
</div>
</el-dialog>
</template>
......@@ -77,7 +158,7 @@ import Cookies from 'js-cookie'
import useUserStore from '@/store/modules/user'
import { useRouter } from 'vue-router'
import { getCurrentInstance, ref, watch } from 'vue'
import { ElMessage } from 'element-plus'
import { ElMessage,ElMessageBox} from 'element-plus'
const emit = defineEmits(['submitForm'])
const userStore = useUserStore()
const router = useRouter()
......@@ -97,21 +178,23 @@ const loginRules = {
}
const show = ref(false)
const loginStatus = ref(0)
const title = ref('用户登录')
const showClose = ref(true)
const codeUrl = ref('')
const loading = ref(false)
const showMsgBtn = ref(true)
// 验证码开关
const captchaEnabled = ref(true)
// 注册开关
// const register = ref(false)
// const redirect = ref(undefined)
// watch(show, (val) => {
// if (!val) {
// userStore.setReLogin(false)
// }
// })
//忘记密码
const isShow = ref(false)
const isCodeTrue = ref(false)
const counting = ref(false)
const changePasswordForm = ref({
username:'',
password:'',
confirmPassword:''
})
const open = (params) => {
show.value = true
......@@ -150,7 +233,31 @@ function handleLogin() {
}
})
}
function close() {
loginStatus.value=0
title.value = '用户登录'
}
function showChangePassword() {
loginStatus.value=2
title.value = '忘记密码/密码重置'
}
function showRegister() {
loginStatus.value=1
title.value = '账号注册'
}
function goRegister(n) {
if(n==0){
show.value = false
router.push({
path: `/register/0`
})
} else {
show.value = false
router.push({
path: `/register/1`
})
}
}
function getCode() {
getCodeImg().then(res => {
captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled
......@@ -169,7 +276,17 @@ function getCookie() {
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
}
}
function sendsmsMsg() {
if(!changePasswordForm.value.account){
ElMessage.error('请填写手机/邮箱')
return
}
if(counting.value){
return
} else {
isShow.value = true
}
}
</script>
<style lang="scss" scoped>
......@@ -198,11 +315,17 @@ function getCookie() {
right: 0;
}
.loginBtn {
background: var(--el-color-primary);
height: 50px;
.loginBtn {height: 40px;
background: linear-gradient(-90deg, #8623FC, #453DEA);
border-radius: 20px;
font-size: 18px;
&:hover{
//background: linear-gradient(90deg, #8623FC, #453DEA);
box-shadow: 0 0 10px #453DEA;
}
}
.login {
display: flex;
justify-content: center;
......@@ -220,11 +343,11 @@ function getCookie() {
border-radius: 6px;
position: relative;
background: #ffffff;
padding: 0 50px 5px;
padding: 0 25px 5px;
.el-input {
height: 40px;
:deep(.el-input__wrapper){box-shadow: none;border-bottom:1px solid #E5E5E5; }
input {
height: 40px;
}
......@@ -245,8 +368,6 @@ function getCookie() {
.login-code {
height: 40px;
float: right;
img {
cursor: pointer;
vertical-align: middle;
......@@ -267,13 +388,27 @@ function getCookie() {
}
.login-code-img {
height: 40px;
padding-left: 12px;
height: 40px;float: right;
}
:deep(.el-input-group__append) {
background: #42dcb5;
color: #fff;
background: #fff;padding: 0;
color: #fff;box-shadow: none;
div{color: #fff;}
}
.agreeLine{
a{font-weight: 600;color: #000;
&:hover{text-decoration: underline;}
}
}
.rItem{height: 130px;cursor: pointer;width: 350px;padding: 1px;margin:20px auto;
h3{font-size: 30px;margin: 50px;}
&.r1{background: url("@/assets/dance/r1b.png") no-repeat left;
&:hover{background: url("@/assets/dance/r1.png") no-repeat left;}
}
&.r2{background: url("@/assets/dance/r2b.png") no-repeat left;
&:hover{background: url("@/assets/dance/r2.png") no-repeat left;}
}
&:hover{color: #fff;}
}
</style>
......
src/viewsPc/match/detail.vue
......@@ -363,7 +363,7 @@
</el-col>
<el-col :lg="6">
<a class="btn-lineG mb20" style="display: block;text-align: center;">我要报名</a>
<a class="btn-lineG mb20" @click="choseSignType" style="display: block;text-align: center;">我要报名</a>
<el-card :body-style="{padding: 0}">
<el-tabs v-model="activeName2" class="match-tabs" @tab-click="handleClick">
<el-tab-pane label="报名时间" name="first">
......@@ -395,11 +395,12 @@
</div>
</el-dialog>
<groupDetail ref="dialogEditGroup" @submitForm="getMyGroupList" />
</div>
</template>
<script setup>
import groupDetail from '@/viewsPc/center/component/teamInfo_form'
import { getCurrentInstance, ref } from 'vue'
import { reactive, onMounted } from '@vue/runtime-core'
import { useRoute, useRouter } from 'vue-router'
......@@ -410,9 +411,68 @@ const { proxy } = getCurrentInstance()
import * as match from '@/apiPc/match'
import { toRefs } from '@vueuse/shared'
import { ElMessage } from 'element-plus'
import groupDetail from '../center/component/teamInfo_form'
const activeName2 = ref('first')
const data = reactive({
matchData: {},
matchId: 0,
groupId: '',
activeName2:'first',
popupGroupList:false
})
const {matchData,matchId,groupId,activeName2,popupGroupList} = toRefs(data)
onMounted(() => {
matchId.value = route.params.id
getMatch(route.params.id)
})
function getMatch(id) {
if(id!=0)
match.getMatchById({ id: id }).then(res => {
matchData.value = res.data
})
}
function choseSignType() {
if (matchData.value.signType == '0') {
// 个人报名
checkIsSign(matchData.value.signType).then((res) => {
router.push({
path: `${route.params.id}/singleSign`
})
})
} else {
// 团队报名 团体-队伍报名
getMyGroupList()
}
}
// 获取已报信息
function checkIsSign(signType) {
var obj = {
cptId: matchId.value,
groupId: groupId.value || ''
}
return match.getMySignInfo(obj).then(res => {
if (res.data.type == '1') {
let str = ''
if (signType == '0') {
str = '已报名，不能重复报名'
} else {
str = '该参赛队已报名，请选择其他参赛队'
}
ElMessage.error(str)
return Promise.reject('rejected message')
}
})
}
function getMyGroupList(){
match.getMyGroupList().then(res => {
groups.value = res.data
popupGroupList.value = true
})
}
function goAddgroup() {
// 新团
proxy.$refs['dialogEditGroup'].open({
title: '新建参赛队'
})
}
</script>
<style scoped lang="scss">
......
src/viewsPc/register/personal.vue 0 → 100644
<template>
<div>
<div class="mt30 mb60">
<div class="box">
<!-- 国内-机构注册-->
<el-card>
<el-steps :active="activeStep" finish-status="success" align-center>
<el-step title="创建账号" />
<el-step title="账号信息" />
<el-step title="注册完成" />
</el-steps>
</el-card>
<div class="mt20"></div>
<Step1 v-if="activeStep==0" @submit="toStep2" @userName="getUserName" />
<Step2 v-if="activeStep==1" @submit="toStep3" @prev="toStep1"/>
</div>
</div>
</div>
</template>
<script>
export default {
name: "peraonal"
}
</script>
<style scoped>
</style>
src/viewsPc/register/policy.vue 0 → 100644
<template>
</template>
<script>
export default {
name: "policy"
}
</script>
<style scoped>
</style>
src/viewsPc/register/team/step1.vue 0 → 100644
<template>
<el-card style="min-height: 50vh">
<div class="pt30">
<el-form class="d-form" size="large" label-width="120" style="max-width: 500px;margin: auto">
<el-form-item label="手机/邮箱" required>
<el-input type="text" v-model="form.account" @change="resetCode" @blur="verifyCode"/>
</el-form-item>
<el-form-item label="验证码" required>
<el-input v-model="form.code">
<template #append>
<el-button type="primary" plain style="width: 110px" @click="sendsmsMsg">
<count-down v-if="counting" v-slot="{ totalSeconds }" :time="60000" @end="counting=false">
{{ totalSeconds }} 秒
</count-down>
<span v-else>
发送验证码
</span>
</el-button>
</template>
</el-input>
<div class="vcodeBox" :style="isShow?'height:240px':'height:0'">
<Vcode :show="isShow" type="inside" @success="codeSuccess" @close="codeClose" @fail='codeFail'></Vcode>
</div>
</el-form-item>
</el-form>
</div>
<div class="text-center">
<!-- <el-button class="primary-kx" round @click="goBack">取消</el-button>-->
<el-button type="primary" class="btn-lineG w200px" round @click="next">下一步</el-button>
</div>
</el-card>
</template>
<script setup>
import {reactive} from "@vue/runtime-core";
import {toRefs} from "@vueuse/shared/index";
import Vcode from "vue3-puzzle-vcode"
import { ElMessage } from 'element-plus'
import CountDown from '@chenfengyuan/vue-countdown'
import {getCaptchaSms,checkRegisterCode} from "@/apiPc/match";
const data = reactive({
isShow:false,
isCodeTrue:false,
counting:false,
form:{},
activeStep: 0
})
const {isShow,isCodeTrue,counting,form,activeStep} = toRefs(data)
const emit = defineEmits(['submit','userName'])
function sendsmsMsg() {
if(!form.value.account){
ElMessage.error('请填写手机/邮箱')
return
}
if(counting.value){
return
} else {
isShow.value = true
}
}
function verifyCode() {
if(!form.value.account){
return
}
if(form.value.account.indexOf('@')>-1){
//邮箱
}
}
function codeSuccess(msg) {
console.log('验证通过' + msg);
isShow.value = false
isCodeTrue.value = true
counting.value = true
// getCaptchaSms({account:form.value.account}).then(res=>{
//
// })
}
function resetCode() {
isCodeTrue.value = false
}
function codeFail() {
}
function codeClose() {
}
const goBack = () => {
router.go(-1)
}
const next = () => {
if(!form.value.account){
ElMessage.error('请填写手机/邮箱')
return
}
if(!form.value.code){
ElMessage.error('请填写验证码')
return
}
if(!isCodeTrue.value){
return
}
checkRegisterCode(form.value).then(res=>{
emit('submit')
emit('userName',form.value.account)
})
}
</script>
<style scoped lang="scss">
.el-input-group__append button.el-button, .el-input-group__append button.el-button:hover{
color: var(--el-color-primary);
background: #efefff;
border: var(--el-color-primary) solid 1px;
border-radius: 0;
}
.vcodeBox{ position: relative;margin: 20px 0 0;
width: 320px;overflow: hidden;
height: auto;}
</style>
src/viewsPc/register/team/step2.vue 0 → 100644
<template>
<el-card>
<div class="border-info text-center">
<label>登录账号</label> 321
</div>
<div class="leftboderTT">登录密码 <span>(登录时需要验证，保护账户信息)</span></div>
<div class="d-form-border">
<el-form class="d-form" size="large" label-width="120" style="max-width: 500px;margin: auto">
<el-form-item label="密码" required>
<el-input type="password" show-password v-model="form.password" placeholder="6-16位密码。区分大小写"/>
</el-form-item>
<el-form-item label="确认密码" required>
<el-input type="password" show-password v-model="form.confirmPassword" @blur="vconfirmPassword" placeholder="再次输入密码"/>
</el-form-item>
</el-form>
</div>
<div class="leftboderTT">机构信息</div>
<div class="d-form-border">
<el-form class="d-form" size="large" :model="form" ref="registerRef" :rules="registerRules" label-width="120" style="max-width: 500px;margin: auto">
<el-form-item label="所属国家" required>
<el-select filterable v-model="form.countryId">
<el-option v-for="item in countryList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="详细地址" required prop="address">
<el-cascader v-if="form.countryId == 240"
v-model="regionArr"
style="width: 100%;"
:options="regionsList"
:props="{ label:'text' }"
/>
<el-input type="textarea" v-model="form.address" class="mt10" placeholder="请输入详细地址"/>
</el-form-item>
<el-form-item label="机构名称" required prop="teamName">
<el-input type="text" v-model="form.teamName" placeholder="请输入内容"/>
</el-form-item>
<el-form-item label="联系人姓名" required prop="contactName">
<el-input type="text" v-model="form.contactName" placeholder="请输入内容"/>
</el-form-item>
<el-form-item label="联系人电话" required prop="contactTel">
<el-input v-model="form.contactTel" type="phone" placeholder="请输入内容"/>
</el-form-item>
<el-form-item label="联系人邮箱" required prop="contactEmail">
<el-input v-model="form.contactEmail" type="email" placeholder="请输入内容"/>
</el-form-item>
<el-form-item prop="photo" required label="机构LOGO">
<ImageUpload2
v-model="form.photo" :crop-height="200" :crop-width="200" :limit="1"
:is-show-tip="false"
/>
</el-form-item>
<el-form-item>
<div @click="isAgree = !isAgree" class="flexAgree">
<el-icon v-if="isAgree" color="#453DEA" size="20"><CircleCheckFilled /></el-icon>
<el-icon v-else color="#999" size="20"><CircleCheck /></el-icon>
<div>
我已阅读并接受<a class="text-primary" @click.stop="showAgreeMent">《注册协议》</a>
及<a class="text-primary" @click.stop="showAgreeMent">《个人信息保护政策》</a>
</div>
</div>
</el-form-item>
</el-form>
</div>
<div class="text-center">
<!-- <el-button class="primary-kx" @click="goStep1">上一步</el-button>-->
<el-button type="primary" round class="btn-lineG w200px" @click.prevent="goStep3" :loading="loading">立即注册</el-button>
</div>
</el-card>
</template>
<script setup>
import {getCurrentInstance} from "@vue/runtime-core"
import {onMounted,toRefs,reactive} from "vue"
import * as match from "@/apiPc/match";
import {ElMessage} from "element-plus";
import {setToken} from "@/utils/auth";
const { proxy } = getCurrentInstance()
const emit = defineEmits(['submit','prev'])
const props = defineProps({
})
const data = reactive({
form: {
username:'eryewawa@163.com'
},
loading:false,
countryList: [],
regionsList: [],
regionArr: [],
isAgree:false
})
const {form,countryList,regionsList,isAgree,loading,regionArr} = toRefs(data)
const registerRules = ref(
{
password:[
{ required: true, trigger: 'blur', message: '请输入您的密码' },
{ min: 6, max: 16, message: '用户密码长度必须介于 6 和 16 之间', trigger: 'blur' }
],
confirmPassword: [{ required: true, trigger: 'blur', message: '请再次输入您的密码' },],
countryId: [{ required: true, trigger: 'blur', message: '请选择所属国家' },],
address: [{ required: true, trigger: 'blur', message: '请输入地址' },],
teamName: [{ required: true, trigger: 'blur', message: '请输入' },],
contactName: [{ required: true, trigger: 'blur', message: '请输入' },],
contactTel: [{ required: true, trigger: 'blur', message: '请输入' },],
contactEmail: [{ required: true, trigger: 'blur', message: '请输入' },],
photo: [{ required: true, trigger: 'blur', message: '请上传' },],
})
const vconfirmPassword = () => {
if (form.value.password !== form.value.confirmPassword) {
ElMessage.error('两次输入的密码不一致')
}
}
onMounted(()=>{
getCountryList()
getRegionsList()
})
function getCountryList() {
match.countryList().then(res => {
countryList.value = res.data
})
}
function getRegionsList() {
match.regionsList().then(res => {
regionsList.value = res.data
})
}
const goStep1 = () => {
emit('prev')
}
const goStep3 = () => {
proxy.$refs.registerRef.validate(valid => {
if (valid) {
if(!isAgree.value){
ElMessage.error('请勾选接受')
return
}
loading.value = true
delete form.value.confirmPassword
form.value.regionId = regionArr.value.pop()
match.pcRegisterTeam(form.value).then(res=>{
setToken(res.data.token)
emit('submit')
})
}
})
}
const showAgreeMent = () => {
console.log('111')
}
onMounted(()=>{
console.log(props)
})
</script>
<style scoped lang="scss">
.d-form-border{
border: 1px solid #E5E5E5;margin: 20px 0;padding: 20px}
.leftboderTT{color: var(--el-color-primary);
font-size: 16px;
font-weight: 600;
span{color: #929AA0;font-size: 14px;}
}
.flexAgree{display: flex;align-items: center;
div{margin-left: 8px;font-size: 14px}
}
</style>
src/viewsPc/register/team/step3.vue 0 → 100644
<template>
<el-card style="min-height: 50vh">
<div>
<img src="@/assets/dance/ok.png"/>
<h3>注册成功</h3>
</div>
<div class="border-info text-center">
<label>登录账号</label> 321
</div>
<div class="text-center">
<el-button class="primary-kx" @click="goHome">返回首页</el-button>
<el-button type="primary" @click="goSign">去报名</el-button>
</div>
</el-card>
</template>
<script setup>
import {reactive} from "@vue/runtime-core";
import {toRefs} from "@vueuse/shared/index";
import Vcode from "vue3-puzzle-vcode"
import { ElMessage } from 'element-plus'
import CountDown from '@chenfengyuan/vue-countdown'
import {getCaptchaSms,checkRegisterCode} from "@/apiPc/match";
const data = reactive({
isShow:false,
isCodeTrue:false,
counting:false,
form:{},
activeStep: 0
})
const {isShow,isCodeTrue,counting,form,activeStep} = toRefs(data)
const emit = defineEmits(['submit','userName'])
function sendsmsMsg() {
if(!form.value.account){
ElMessage.error('请填写手机/邮箱')
return
}
if(counting.value){
return
} else {
isShow.value = true
}
}
const goHome = () => {
}
const goSign = () => {
}
</script>
<style scoped lang="scss">
.el-input-group__append button.el-button, .el-input-group__append button.el-button:hover{
color: var(--el-color-primary);
background: #efefff;
border: var(--el-color-primary) solid 1px;
border-radius: 0;
}
</style>
src/viewsPc/register/team/team.vue 0 → 100644
<template>
<div>
<div class="mt30 mb60">
<div class="box">
<!-- 国内-机构注册-->
<el-card>
<el-steps :active="activeStep" align-center>
<el-step title="创建账号" />
<el-step title="账号信息" />
<el-step title="注册完成" />
</el-steps>
</el-card>
<div class="mt20"></div>
<Step1 v-if="activeStep==0" @submit="toStep2" @userName="getUserName" />
<Step2 v-if="activeStep==1" @submit="toStep3" @prev="toStep1"/>
<Step3 v-if="activeStep==2"/>
</div>
</div>
</div>
</template>
<script setup>
import {reactive} from "@vue/runtime-core";
import Step1 from "./step1";
import Step2 from "./step2";
import Step3 from "./step3";
import * as match from "@/apiPc/match";
import {onMounted,toRefs} from "vue";
const data = reactive({
isShow:false,
isCodeTrue:false,
counting:false,
form:{},
activeStep: 0
})
const {isShow,isCodeTrue,counting,form,activeStep} = toRefs(data)
const toStep1 = () => {
activeStep.value = 0
}
const toStep2 = () => {
activeStep.value = 1
}
const toStep3 = () => {
activeStep.value = 2
}
const getUserName = (val) => {
console.log(val)
form.value.userName = val
}
</script>
<style scoped>
</style>
src/viewsPc/register/userAgreement.vue 0 → 100644
<template>
</template>
<script>
export default {
name: "userAgreement"
}
</script>
<style scoped>
</style>
vite.config.js
......@@ -77,12 +77,12 @@ export default defineConfig(({ mode, command }) => {
},
'/dev-api/ztx-webSite': {
// target: 'http://123.60.96.243:1897/stage-api/',
target: 'http://192.168.1.118:8083/',
target: 'http://192.168.1.132:8083/',
changeOrigin: true,
rewrite: (p) => p.replace(/^\/dev-api\/ztx-webSite/, '')
},
'/dev-api': {
target: 'http://192.168.1.118:8083',
target: 'http://192.168.1.132:8083',
// target: 'http://localhost:8787',
changeOrigin: true,
rewrite: (p) => p.replace(/^\/dev-api/, '')
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!