Skip to content

杨炀 / dance-pc

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

add: 个人中心-机构-个人信息

1 parent 86c06939
Inline Side-by-side
Showing 41 changed files with 1605 additions and 828 deletions
src/api/login.js
......@@ -72,7 +72,16 @@ export function getCodeImg() {
timeout: 20000
})
}
export function forgetPassword(data) {
return request({
url: '/forgetPassword',
headers: {
isToken: false
},
method: 'post',
data: data
})
}
// 代退图形认证的获取手机验证码
export function captchaSmsWithCaptchaImage(data) {
return request({
......
src/apiPc/match.js
......@@ -93,9 +93,9 @@ export function getMyGroupList() {
}
// 根据Id获取我的团队
export function getGroupById(groupId) {
export function getGroupInfo() {
return request({
url: `ztx-match/league/group/getMyGroup/${groupId}`,
url: `/league/group/getMyGroup`,
method: 'get'
})
}
......@@ -110,7 +110,7 @@ export function regionsList() {
// 新建团队
export function saveMyGroup(data) {
return request({
url: `ztx-match/league/group/saveMyGroup`,
url: `/league/group/saveMyGroup`,
method: 'post',
data: data
})
......
src/assets/styles/index.scss
......@@ -221,3 +221,32 @@ aside {
.pt30{padding-top: 30px;}
.d-form-border{
border: 1px solid #E5E5E5;margin: 20px 0;padding: 20px}
.dlbox{background: url("@/assets/dance/ds_bg.png") no-repeat left;background-size: 100% 100%;
padding: 0 0 20px;margin: 0 0 20px;
dl{height: 120px;margin: 0;
dt{
height: 30px;
font-size: 16px;margin: 0 0 18px;
font-weight: 600;line-height: 30px;display: inline-block;padding:0 20px 0 14px;
background: linear-gradient(90deg, #8623FC, #453DEA);
border-radius: 0px 0px 15px 0px;color: #fff;}
}
dd{
font-size: 14px;line-height: 1.6;
color: #29343C;}
}
.xzbox{border: 2px solid #DDECFB;padding: 20px;line-height: 2;
color: #29343C;
font-size: 16px;}
.funcBtn{width: 100%;cursor: pointer;
background:url("@/assets/dance/funcBg.png") no-repeat left;
background-size: cover;
border-radius: 16px;box-shadow:var(--el-box-shadow-light);
text-align: center;position: relative;
margin: 24px 0 24px;padding: 0 0 1px;
img{margin: auto;position: relative;top: -20px}
h4{font-size: 18px;margin-top: -10px;}
&:hover{box-shadow:var(--el-box-shadow-dark);}
}
......
src/routerPc/cn.js
......@@ -486,10 +486,16 @@ export const constantRoutes = [
meta: { title: '个人中心' }
},
{
path: 'myTeam',
component: () => import('@/viewsPc/center/teamInfo'),
name: 'myTeam',
meta: { title: '我的团队' }
path: 'myPassword',
component: () => import('@/viewsPc/center/myPassword'),
name: 'myPassword',
meta: { title: '修改密码' }
},
{
path: 'myCertification',
component: () => import('@/viewsPc/center/myCertification'),
name: 'myCertification',
meta: { title: '团队认证' }
},
{
path: 'myMatch',
......
src/utils/request.js
......@@ -126,7 +126,7 @@ service.interceptors.response.use(
const msg = errorCode[code] || res.data.msg || errorCode['default']
// 二进制数据则直接返回
// debugger
if (
res.request.responseType === 'blob' ||
res.request.responseType === 'arraybuffer'
......
src/viewsPc/center/index.vue
......@@ -3,15 +3,25 @@
<div class="box">
<el-row :gutter="20">
<el-col :span="6">
<el-card class="mt30">
<el-card>
<div class="center-menu">
<!-- <el-avatar :size="100" :src="fillImgUrl(myform.avatar)" />-->
<h3>{{ myform.nickName }}</h3>
<ul>
<ul v-if="user.utype=='2'">
<li
v-for="(m, i) in menus"
:key="i"
:class="{ active: m.isActive }"
v-for="(m, i) in menus"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
{{ m.name }}
</a>
</li>
</ul>
<ul v-if="user.utype=='1'">
<li
v-for="(m, i) in menusPersonal"
:key="i"
:class="{ active: m.isActive }"
>
<a href="javascript:void(0)" @click="toInfo(m)">
<img :src="m.isActive ? m.picUrl2 : m.picUrl1">
......@@ -24,7 +34,7 @@
</el-col>
<el-col :span="18">
<router-view />
<router-view :user="user"/>
</el-col>
</el-row>
</div>
......@@ -32,48 +42,107 @@
</template>
<script setup>
import { ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { onMounted } from '@vue/runtime-core'
import {ref} from 'vue'
import {useRoute, useRouter} from 'vue-router'
import {onMounted} from '@vue/runtime-core'
import useUserStore from '@/store/modules/user'
import _ from 'lodash'
const route = useRoute()
const router = useRouter()
const myform = ref({})
const user = ref({})
const menus = ref([
{
name: '基础信息',
routeName: 'myInfo',
picUrl1: '/img/tool01.png',
picUrl2: '/img/tool01_dwn.png',
picUrl1: '/img/nav_26.png',
picUrl2: '/img/nav_26_dwn.png',
isActive: false
},
{
name: '修改密码',
routeName: 'myTeam',
picUrl1: '/img/tool02.png',
picUrl2: '/img/tool02_dwn.png',
routeName: 'myPassword',
picUrl1: '/img/nav_27.png',
picUrl2: '/img/nav_27.png',
isActive: false
},
{
name: '团队认证',
routeName: 'myCertification',
picUrl1: '/img/nav_32.png',
picUrl2: '/img/nav_32_dwn.png',
isActive: false
},
{
name: '我的赛事',
name: '选手管理',
routeName: 'myMatch',
picUrl1: '/img/tool03.png',
picUrl2: '/img/tool03_dwn.png',
picUrl1: '/img/nav_31.png',
picUrl2: '/img/nav_31_dwn.png',
isActive: false
},
{
name: '我的培训',
name: '我的报名',
routeName: 'myMatch',
picUrl1: '/img/nav_28.png',
picUrl2: '/img/nav_28_dwn.png',
isActive: false
},
{
name: '我的预定',
routeName: 'myMatch',
picUrl1: '/img/nav_29.png',
picUrl2: '/img/nav_29_dwn.png',
isActive: false
},
{
name: '系统消息',
routeName: 'myTrain',
picUrl1: '/img/tool04.png',
picUrl2: '/img/tool04_dwn.png',
picUrl1: '/img/nav_30.png',
picUrl2: '/img/nav_30_dwn.png',
isActive: false
}
])
const menusPersonal = ref([
{
name: '基础信息',
routeName: 'myInfo',
picUrl1: '/img/nav_26.png',
picUrl2: '/img/nav_26_dwn.png',
isActive: false
},
{
name: '修改密码',
routeName: 'myPassword',
picUrl1: '/img/nav_27.png',
picUrl2: '/img/nav_27.png',
isActive: false
},
{
name: '我的报名',
routeName: 'myMatch',
picUrl1: '/img/nav_28.png',
picUrl2: '/img/nav_28_dwn.png',
isActive: false
},
{
name: '我的预定',
routeName: 'myMatch',
picUrl1: '/img/nav_29.png',
picUrl2: '/img/nav_29_dwn.png',
isActive: false
},
{
name: '系统消息',
routeName: 'myTrain',
picUrl1: '/img/nav_30.png',
picUrl2: '/img/nav_30_dwn.png',
isActive: false
}
])
onMounted(() => {
myform.value = useUserStore().user || {}
user.value = useUserStore().user || {}
const currMenu = _.find(menus.value, (m) => {
return m.routeName === route.name
......@@ -108,19 +177,24 @@ const toInfo = (item) => {
padding: 0 15px;
}
.center-menu{
.center-menu {
text-align: center;
li{margin-bottom: 15px;}
li {
margin-bottom: 15px;
}
}
li img{
li img {
display: inline-block;
vertical-align:middle;
vertical-align: middle;
margin-right: 20px;
padding: 5px;
}
.active{
color:var(--el-color-primary);
background-color: #f9e7e8;
.active {
color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);
border-radius: 20px;
}
</style>
......
src/viewsPc/center/myCertification.vue 0 → 100644
<template>
<el-card :body-style="{'padding':'0'}">
<div class="indexTitle"><h3 class="leftboderTT">团队认证</h3></div>
</el-card>
</template>
<script setup>
</script>
<style scoped lang="scss">
.indexTitle{margin: 20px 0 12px;padding: 0 20px 15px;border-bottom: 1px solid #e5e5e5;
h3{
font-size: 16px;
color:var(--el-color-primary);
}
}
</style>
src/viewsPc/center/myInfo.vue
<template>
<div class="grid-content">
<el-tabs v-model="activeName">
<el-tab-pane label="个人基本信息" name="first">
<el-form ref="myformRef" :model="myform" label-width="120px">
<el-row v-if="labelArr?.length>0">
<el-col :span="14">
<el-form-item label="姓名">
<el-input v-model="myform.realName" />
</el-form-item>
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="myform.sex">
<el-radio label="0" size="large">男</el-radio>
<el-radio label="1" size="large">女</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item label="身份标签">-->
<!-- <el-checkbox-group v-model="myform.labelArr" size="small">-->
<!-- <el-checkbox-button label="0">运动员</el-checkbox-button>-->
<!-- <el-checkbox-button label="1">教练</el-checkbox-button>-->
<!-- <el-checkbox-button label="2">领队</el-checkbox-button>-->
<!-- <el-checkbox-button label="4">队医</el-checkbox-button>-->
<!-- <el-checkbox-button label="5">翻译</el-checkbox-button>-->
<!-- <el-checkbox-button label="6">官员</el-checkbox-button>-->
<!-- <el-checkbox-button label="3">其他</el-checkbox-button>-->
<!-- </el-checkbox-group>-->
<!-- </el-form-item>-->
<div>
<el-card :body-style="{'padding':'0'}">
<div class="indexTitle"><h3 class="leftboderTT">机构基础信息</h3></div>
<!-- uType字段 1 是个人 2是团体-->
<!-- {{user}}-->
<team-info :form="myform" v-if="user.utype=='2'"/>
<el-form-item label="证件类型">
<el-select v-model="myform.idcType" placeholder="请选择证件类型" style="width: 100%">
<el-option
v-for="item in certificates"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="证件号码">
<el-input v-model="myform.idcCode" @blur="checkCode" />
</el-form-item>
<el-form-item label="出生日期">
<el-date-picker
v-model="myform.birth"
style="width: 100%"
type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
placeholder="请选择出生日期"
/>
</el-form-item>
<el-form-item label="国籍" @change="changeCountryId">
<el-select v-model="myform.countryId" style="width: 100%" :disabled="myform.idcType==0">
<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="民族">
<el-select v-model="myform.nation" style="width: 100%;">
<el-option
v-for="item in nationList"
:key="item.name"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
<el-form-item label="联系方式">
<el-input v-model="myform.phone" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="头像" prop="picUrl">
<ImageUpload v-model="myform.picUrl" :limit="1" />
</el-form-item>
</el-col>
</el-row>
<el-row v-else>
<el-col :span="14">
<!-- <el-form-item label="身份标签">-->
<!-- <el-checkbox-group v-model="myform.labelArr" size="small">-->
<!-- <el-checkbox-button label="0">运动员</el-checkbox-button>-->
<!-- <el-checkbox-button label="1">教练</el-checkbox-button>-->
<!-- <el-checkbox-button label="2">领队</el-checkbox-button>-->
<!-- <el-checkbox-button label="4">队医</el-checkbox-button>-->
<!-- <el-checkbox-button label="5">翻译</el-checkbox-button>-->
<!-- <el-checkbox-button label="6">官员</el-checkbox-button>-->
<!-- <el-checkbox-button label="3">其他</el-checkbox-button>-->
<!-- </el-checkbox-group>-->
<!-- </el-form-item>-->
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="myform.sex">
<el-radio label="0" size="large">男</el-radio>
<el-radio label="1" size="large">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="国籍" @change="changeCountryId">
<el-select v-model="myform.countryId" style="width: 100%" :disabled="myform.idcType==0">
<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="民族">
<el-select v-model="myform.nation" style="width: 100%;">
<el-option
v-for="item in nationList"
:key="item.name"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="text-center">
<el-button type="primary" round @click="save">保存</el-button>
</div>
<el-divider />
<h3 style="padding: 0 20px;">所属参赛队信息</h3>
<el-row :gutter="20" style="padding: 0 20px">
<el-col v-for="(g,index) in groupList" :key="index" :span="8">
<div class="matchItem">
<div class="flex">
<div class="leftImg">
<img class="roundImg" :src="g.imgUrl" mode="aspectFill">
</div>
<div class="rightWen">
<div class="name">{{ g.name }}</div>
<div class="pp">地区：{{ g.regionStr }}
</div>
<div class="pp">类型：
<span>{{ g.typeStr }}</span>
</div>
</div>
</div>
<view class="bottomFunc">
<view class="textButtom" @click="exitGroup(g)">退出参赛队</view>
</view>
</div>
</el-col>
</el-row>
<el-empty v-if="groupList.length==0" description="还没有所属参赛队" />
</el-card>
</el-tab-pane>
</el-tabs>
</div>
</template>
......@@ -150,9 +18,18 @@ import { getCurrentInstance, onMounted } from '@vue/runtime-core'
import * as match from '@/apiPc/match'
import { ElMessage, ElMessageBox } from 'element-plus'
import { nationList } from '@/assets/js/data'
import {getGroupInfo} from "@/apiPc/match";
import TeamInfo from "@/viewsPc/center/teamInfo";
const router = useRouter()
const { proxy } = getCurrentInstance()
const props = defineProps({
user:{
type:Object,
required:true
}
})
const activeName = ref('first')
const myform = ref({
idcType: 0,
......@@ -161,8 +38,7 @@ const myform = ref({
})
const labelArr = ref([])
const groupList = ref([])
const countryList = ref([])
const regionsList = ref([])
const certificates = ref([
{
value: '0',
......@@ -179,27 +55,14 @@ const certificates = ref([
])
onMounted(() => {
match.regionsList().then(res => {
regionsList.value = res.data
})
getCountryList()
getData()
})
function getData() {
match.getMyPersonInfo().then(res => {
match.getGroupInfo().then(res => {
myform.value = res.data
myform.value.labelArr = myform.value.label ? myform.value.label.split(',') : []
labelArr.value = myform.value.label ? myform.value.label.split(',') : []
groupList.value = myform.value.groups || []
// if (labelArr.value.length <= 0)proxy.$modal.msgError('请维护身份标签信息！')
})
}
function changeCountryId() {
if (myform.value.countryId != 240) {
myform.value.nation = '其他'
}
}
function checkCode() {
if (myform.value.idcType == 0 && myform.value.idcCode) {
if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(myform.value.idcCode))) {
......@@ -228,47 +91,18 @@ function checkCode() {
}
}
}
function getCountryList() {
match.countryList().then(res => {
countryList.value = res.data
})
}
function save() {
myform.value.label = myform.value.labelArr.toString()
match.saveMyBaseInfo(myform.value).then(res => {
ElMessage({
message: '保存成功',
type: 'success'
})
getData()
})
}
function exitGroup(g) {
ElMessageBox.confirm('确定退出这个参赛队吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
match.leaveGroup(g.id).then(response => {
ElMessage.success('操作成功')
getData()
})
})
}
</script>
<style scoped lang="scss">
.app-container {
background: #F5F7F9;
}
.grid-content {
background: #fff;
.indexTitle{margin: 20px 0 12px;padding: 0 20px 15px;border-bottom: 1px solid #e5e5e5;
h3{
font-size: 16px;
color:var(--el-color-primary);
}
}
:deep(.el-tabs__nav-wrap) {
padding: 0 15px;
}
</style>
......
src/viewsPc/center/myPassword.vue 0 → 100644
<template>
<div>
<el-card :body-style="{'padding':'0'}">
<div class="indexTitle"><h3 class="leftboderTT">修改密码</h3></div>
<div class="pd20">
<div class="d-form-border" style="margin-top: 0">
<el-form class="d-form" ref="pwdRef" :model="user" :rules="rules" label-width="120px"
style="max-width: 500px;margin: auto">
<el-form-item label="旧密码" prop="oldPassword">
<el-input v-model="user.oldPassword" placeholder="请输入旧密码" type="password" show-password/>
</el-form-item>
<el-form-item label="新密码" prop="newPassword">
<el-input v-model="user.newPassword" placeholder="请设置8位以上大小写字母、数字、特殊符号" type="password"
show-password/>
</el-form-item>
<el-form-item label="确认密码" prop="confirmPassword">
<el-input v-model="user.confirmPassword" placeholder="请确认新密码" type="password" show-password/>
</el-form-item>
</el-form>
</div>
<el-row justify="center">
<el-button type="primary" class="btn-lineG" @click="submit">保存</el-button>
</el-row>
</div>
</el-card>
</div>
</template>
<script setup>
import {updateUserPwd} from '@/api/system/user'
import useUserStore from '@/store/modules/user'
import {reactive, ref, getCurrentInstance} from 'vue'
import {validPassword} from '@/utils/validate'
const show = ref(false)
const {proxy} = getCurrentInstance()
const userStore = useUserStore()
const user = reactive({
oldPassword: undefined,
newPassword: undefined,
confirmPassword: undefined
})
const equalToPassword = (rule, value, callback) => {
if (user.newPassword !== value) {
callback(new Error('两次输入的密码不一致'))
} else {
callback()
}
}
const validPwd = (rule, value, callback) => {
if (import.meta.env.DEV) {
callback()
} else {
if (!validPassword(value)) {
callback(new Error('请设置8位以上大小写字母、数字、特殊符号组合的密码'))
} else {
callback()
}
}
}
const rules = ref({
oldPassword: [{required: true, message: '旧密码不能为空', trigger: 'blur'}],
newPassword: [
{required: true, message: '新密码不能为空', trigger: 'blur'},
{validator: validPwd, trigger: 'blur'}
],
confirmPassword: [
{required: true, message: '确认密码不能为空', trigger: 'blur'},
{required: true, validator: equalToPassword, trigger: 'blur'}
]
})
/** 提交按钮 */
function submit() {
proxy.$refs['pwdRef'].validate(valid => {
if (valid) {
updateUserPwd(user.oldPassword, user.newPassword).then(response => {
proxy.$modal.msgSuccess('修改成功')
userStore.logOut().then(() => {
setTimeout(() => {
location.reload()
}, 1000)
})
})
}
})
};
</script>
<style scoped lang="scss">
.indexTitle {
margin: 20px 0 12px;
padding: 0 20px 15px;
border-bottom: 1px solid #e5e5e5;
h3 {
font-size: 16px;
color: var(--el-color-primary);
}
}
</style>
src/viewsPc/center/teamInfo.vue
<template>
<div>
<div v-if="!showSingle" class="grid-content">
<el-tabs v-model="activeName">
<el-tab-pane label="我的参赛队" name="first">
<div style="margin: 0 15px;">
<el-button type="primary" @click="newGroup">+新建参赛队</el-button>
</div>
<div style="padding: 20px">
<el-row :gutter="20">
<el-col v-for="(g,index) in dataList" :key="index" :span="8" class="mTop">
<div class="matchItem bg">
<div class="flex">
<div v-if="g.imgUrl" class="leftImg">
<img :src="fillImgUrl(g.imgUrl) " mode="aspectFill">
</div>
<div class="rightWen">
<div class="name">{{ g.name }}</div>
<div class="pp"> <span class="labe">联系人：</span>
{{ g.contactPerson }}
</div>
<div class="pp"><span class="labe">类型：</span>{{ g.typeStr }}
</div>
</div>
</div>
<div class="bottomFunc">
<div class="textButtom" @click="viewSingle(g)">查看</div>
<span class="greenline">|</span>
<div class="textButtom" @click="del(g)">删除</div>
</div>
</div>
</el-col>
</el-row>
<el-empty v-if="dataList.length==0" description="还没有参赛队，点击新建参赛队立即创建吧~" />
</div>
</el-tab-pane>
</el-tabs>
<div class="pd20">
<div class="d-form-border" style="margin-top: 0">
<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="用户名">
{{userName}}
</el-form-item>
<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="form.regionId"
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="name">
<el-input type="text" v-model="form.name" placeholder="请输入内容"/>
</el-form-item>
<el-form-item label="联系人姓名" required prop="contactPerson">
<el-input type="text" v-model="form.contactPerson" placeholder="请输入内容"/>
</el-form-item>
<el-form-item label="联系人电话" required prop="contactTelno">
<el-input v-model="form.contactTelno" 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="imgUrl" required label="机构LOGO">
<ImageUpload2
v-model="form.imgUrl" :crop-height="200" :crop-width="200" :limit="1"
:is-show-tip="false"
/>
</el-form-item>
</el-form>
</div>
<div v-if="showSingle" class="teamSingle">
<div class="head">
<span @click="showSingle=false">
<el-icon>
<ArrowLeft />
</el-icon>
返回列表
</span>
<div class="fr">
<el-button type="text" @click="editThisTeam">修改</el-button>
</div>
</div>
<div class="team-body">
<div class="flex">
<div class="leftIMg">
<img width="100" :src="fillImgUrl(baseFormData.imgUrl) ">
</div>
<div class="rightContent">
<div class="rightTop">
<div> {{ baseFormData.name }}</div>
</div>
<el-row>
<el-col :span="12">参赛队简称： {{ baseFormData.abreviations }}</el-col>
<el-col :span="12">参赛队类型：{{ baseFormData.typeStr }}</el-col>
<el-col :span="12">联系人：{{ baseFormData.contactPerson }}</el-col>
<el-col :span="12">联系方式： {{ baseFormData.contactTelno }}</el-col>
<el-col :span="12">所在地区： {{ baseFormData.regionStr }}</el-col>
<el-col :span="12">详细地址： {{ baseFormData.address }}</el-col>
</el-row>
</div>
<!-- <el-descriptions border>
<el-descriptions-item label="logo">
<img width="100" :src="baseFormData.imgUrl">
</el-descriptions-item>
<el-descriptions-item label="参赛队名称">
{{ baseFormData.name }}
</el-descriptions-item>
<el-descriptions-item label="参赛队简称">
{{ baseFormData.abreviations }}
</el-descriptions-item>
<el-descriptions-item label="参赛队类型">
<span>{{ baseFormData.typeStr }}</span>
</el-descriptions-item>
<el-descriptions-item label="联系人">
{{ baseFormData.contactPerson }}
</el-descriptions-item>
<el-descriptions-item label="联系方式">
{{ baseFormData.contactTelno }}
</el-descriptions-item>
<el-descriptions-item label="参赛队名称">
{{ baseFormData.name }}
</el-descriptions-item>
<el-descriptions-item label="所在地区">
{{ baseFormData.regionStr }}
</el-descriptions-item>
<el-descriptions-item label="详细地址">
{{ baseFormData.address }}
</el-descriptions-item>
</el-descriptions> -->
</div>
<el-divider />
<h3 style="padding: 0 20px;">人员管理
<div class="fr">
<el-button type="primary" @click="addMember">+添加人员</el-button>
</div>
</h3>
<div class="memberList">
<ul>
<li
v-for="(k,index) in kindList" :key="index" :class="current==index?'active':''"
@click="changeKind(index)"
>{{ k }}
</li>
</ul>
<el-row :gutter="20" class="paddingRow">
<el-col v-for="(p, index) in memberList" :key="index" :span="8" class="padding-10">
<div class="matchItem">
<div class="flex m-height">
<div v-if="p.picUrl" class="leftImg">
<img class="roundImg" :src="fillImgUrl(p.picUrl)" mode="aspectFill">
</div>
<div class="rightWen">
<div class="name">
<span>
{{ p.realName }}
</span>
<span v-for="l in p.labelArr" v-show="l==current" :key="l" class="tag-view">
<el-tag v-if="l == 2" type="warning">领队</el-tag>
<el-tag v-if="l == 1" type="primary">教练</el-tag>
<el-tag v-if="l == 0" type="success">运动员</el-tag>
<el-tag v-if="l == 4" type="primary">队医</el-tag>
<el-tag v-if="l == 5" type="warning">翻译</el-tag>
<el-tag v-if="l == 6" type="error">官员</el-tag>
<el-tag v-if="l == 3" type="info">其他</el-tag>
</span>
<!-- <span v-if="p.sex==0">（女）</span>
<span v-if="p.sex==1">（男）</span> -->
</div>
<div class="pp">
<span class="labe">证件类型：</span>
<span v-if="p.idcType == 0">居民身份证</span>
<span v-else-if="p.idcType == 1">护照</span>
<span v-else>其他</span>
</div>
<div class="pp">
<span class="labe">证件号：</span>{{ p.idcCode.replace(/^(\d{6})\d{8}(.{4}$)/g, `$1${Array(9).join('*')}$2`) }}
</div>
<div class="pp"><span class="labe">联系方式：</span>{{ p.phone }}</div>
</div>
</div>
<div class="bottomFunc">
<div class="textButtom" @click="goEditCoach(p.id, groupId)">编辑</div>
<span class="greenline">|</span>
<div class="textButtom" @click="delperson(p)">删除</div>
</div>
</div>
</el-col>
</el-row>
<el-empty v-if="memberList.length==0" description="还没有成员" />
</div>
</div>
<div class="text-center">
<el-button type="primary" class="btn-lineG" round @click="save">确定修改</el-button>
</div>
<!-- 新建团队-->
<dialogEditTeam ref="diaEditTeamRef" @submitForm="saveTeam" />
<!-- 添加人员-->
<addCoach ref="dialogAddCoach" @submitForm="addCoachDone" />
</div>
</template>
......@@ -180,170 +56,57 @@ const router = useRouter()
const { proxy } = getCurrentInstance()
import * as match from '@/apiPc/match'
import { ElMessage, ElMessageBox } from 'element-plus'
import dialogEditTeam from './component/teamInfo_form'
import addCoach from '../match/components/addCoach'
const kindList = ref(['运动员', '教练', '领队', '其他', '队医', '翻译', '官员'])
const typeList = ref([{ text: '学校', value: '0' }, { text: '场馆', value: '1' }, {
text: '俱乐部',
value: '2'
}, { text: '机构', value: '3' }])
const activeName = ref('first')
const current = ref(0)
const myform = ref({})
const showSingle = ref(false)
const baseFormData = ref({})
const groupId = ref('')
import useUserStore from '@/store/modules/user'
import _ from "lodash";
const props = defineProps({
form:{
type:Object,
required:true
}
})
const countryList = ref([])
const regionsList = ref([])
const dataList = ref([])
const memberList = ref([])
const regionsArr = ref([])
const userName = ref('')
const registerRules = ref(
{
countryId: [{ required: true, trigger: 'blur', message: '请选择所属国家' },],
address: [{ required: true, trigger: 'blur', message: '请输入地址' },],
name: [{ required: true, trigger: 'blur', message: '请输入' },],
contactPerson: [{ required: true, trigger: 'blur', message: '请输入' },],
contactTelno: [{ required: true, trigger: 'blur', message: '请输入' },],
contactEmail: [{ required: true, trigger: 'blur', message: '请输入' },],
imgUrl: [{ required: true, trigger: 'blur', message: '请上传' },],
})
onMounted(() => {
getList()
// getRegionsList()
getRegionsList()
getCountryList()
regionsArr.value = props.form.regionId
userName.value = useUserStore().user.userName
})
function addMember() {
const params = {
title: '添加人员',
id: 0,
groupId: groupId.value
}
proxy.$refs['dialogAddCoach'].open(params)
}
function goEditCoach(id, groupId) {
const params = {
id: id,
groupId: groupId
}
proxy.$refs['dialogAddCoach'].open(params)
}
function addCoachDone() {
getInfo(groupId.value)
}
function getRegionsList() {
match.regionsList().then(res => {
regionsList.value = res.data
})
}
function getList() {
match.getMyGroupList().then(res => {
dataList.value = res.data
})
}
function newGroup() {
proxy.$refs['diaEditTeamRef'].open({
title: '新建参赛队'
function getCountryList() {
match.countryList().then(res => {
countryList.value = res.data
})
}
function save() {
proxy.$refs['registerRef'].validate((valid) => {
if (valid) {
if (typeof (props.form.regionId) === 'object') {
props.form.regionId = _.last(props.form.regionId)
}
match.saveMyGroup(props.form).then(res => {
function editThisTeam() {
proxy.$refs['diaEditTeamRef'].open({
data: baseFormData.value,
title: '编辑参赛队'
})
}
function changeKind(n) {
// debugger
current.value = n
switch (current.value) {
case 0: {
memberList.value = baseFormData.value.athletes
getLabel(memberList.value)
break
}
case 1: {
memberList.value = baseFormData.value.coaches
getLabel(memberList.value)
break
}
case 2: {
memberList.value = baseFormData.value.leaders
getLabel(memberList.value)
break
}
case 3: {
memberList.value = baseFormData.value.others
getLabel(memberList.value)
break
}
case 4: {
memberList.value = baseFormData.value.teamDoctors
getLabel(memberList.value)
break
}
case 5: {
memberList.value = baseFormData.value.translators
getLabel(memberList.value)
break
}
case 6: {
memberList.value = baseFormData.value.officials
getLabel(memberList.value)
break
}
}
}
function getLabel(list) {
if (list.length > 0) {
for (const m of list) {
m.labelArr = m.label.split(',')
})
}
}
}
function viewSingle(n) {
groupId.value = n.id
showSingle.value = true
getInfo(groupId.value)
}
function getInfo(id) {
match.getGroupById(id).then(res => {
baseFormData.value = res.data
memberList.value = baseFormData.value.athletes
getLabel(memberList.value)
})
}
function saveTeam() {
if (showSingle.value) {
getInfo(groupId.value)
} else {
getList()
}
}
function del(g) {
// 删除团
ElMessageBox.confirm('确定删除这个参赛队吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
match.deleteMyGroup(g.id).then(res => {
ElMessage.success('操作成功')
getList()
})
})
}
function delperson(p) {
// 删除团队下的人
ElMessageBox.confirm(`确定删除${p.realName}吗？`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
match.delPerson(p.id).then(res => {
ElMessage.success('操作成功')
getInfo(groupId.value)
})
})
}
</script>
<style scoped lang="scss">
......@@ -374,7 +137,7 @@ function delperson(p) {
border-radius: 4px;
display: flex;
justify-content: center;
img{
width: 60px;
height: 60px;
......@@ -401,7 +164,7 @@ function delperson(p) {
font-size: 14px;
color: #000;
cursor:pointer;
}
.active{
color: #fff;
......@@ -495,7 +258,7 @@ function delperson(p) {
}
}
}
}
.name{
height: 25px;
......
src/viewsPc/index.vue
......@@ -79,8 +79,8 @@
</div>
<!--赛事日历-->
<el-card :body-style="{'padding':'20px 20px'}">
<!-- <el-calendar v-model="calendarValue" :range="calendarRange">-->
<el-calendar>
<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">
......@@ -417,8 +417,8 @@ const scores = ref([])
const nowscores = ref([])
const livelist = ref([])
const picList = ref([])
// const calendarValue = ref('2024-07-22')
// const calendarRange = ref(['2024-07-21','2024-07-27'])
const calendarValue = ref('2024-07-22')
const calendarRange = ref(['2024-07-21','2024-07-27'])
const showgg = ref(true)
onMounted(() => {
init()
......
src/viewsPc/login.vue
......@@ -88,7 +88,7 @@
<el-input
v-model.trim="changePasswordForm.username"
size="large"
auto-complete="off"
auto-complete="off" @change="changePasswordFormUsername"
placeholder="注册时使用的邮箱/手机号码"
>
......@@ -113,9 +113,9 @@
</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>
<!-- <div class="vcodeBox" :style="isShow?'height:240px':'height:0'">-->
<Vcode :zIndex="9999" :show="isShow" @success="codeSuccess"></Vcode>
<!-- </div>-->
</el-form-item>
<el-form-item prop="password">
......@@ -129,7 +129,7 @@
>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-form-item prop="confirmPassword">
<el-input
v-model.trim="changePasswordForm.confirmPassword"
type="password"
......@@ -146,7 +146,7 @@
size="large"
type="primary"
style="width:100%;"
@click.prevent="handleLogin"
@click.prevent="handleChangePassword"
>
<span>确定</span>
</el-button>
......@@ -159,7 +159,7 @@
<script setup>
import Vcode from "vue3-puzzle-vcode"
import CountDown from '@chenfengyuan/vue-countdown'
import { getCodeImg } from '@/api/login'
import {forgetPassword, getCodeImg} from '@/api/login'
import * as match from '@/apiPc/match'
import Cookies from 'js-cookie'
import useUserStore from '@/store/modules/user'
......@@ -183,6 +183,12 @@ const loginRules = {
password: [{ required: true, trigger: 'change', message: '请输入您账号密码' }],
code: [{ required: true, trigger: 'change', message: '请输入验证码' }]
}
const changePasswordRules = {
username: [{ required: true, trigger: 'change', message: '请输入您的账号' }],
password: [{ required: true, trigger: 'change', message: '请输入您的密码' }],
confirmPassword: [{ required: true, trigger: 'change', message: '请再次输入您的密码' }],
code: [{ required: true, trigger: 'change', message: '请输入验证码' }]
}
const show = ref(false)
const loginStatus = ref(0)
......@@ -284,7 +290,7 @@ function getCookie() {
}
}
function sendsmsMsg() {
if(!changePasswordForm.value.account){
if(!changePasswordForm.value.username){
ElMessage.error('请填写手机/邮箱')
return
}
......@@ -294,6 +300,30 @@ function sendsmsMsg() {
isShow.value = true
}
}
function codeSuccess() {
isShow.value = false
isCodeTrue.value = true
counting.value = true
}
function changePasswordFormUsername() {
isCodeTrue.value = false
}
function handleChangePassword() {
proxy.$refs.changePasswordRef.validate(valid => {
if (valid) {
if(isCodeTrue.value){
delete changePasswordForm.value.confirmPassword
forgetPassword(changePasswordForm.value).then(res=>{
ElMessage.success('操作成功，请登录')
close()
})
} else {
ElMessage.error('请发送验证码')
}
}
})
}
</script>
<style lang="scss" scoped>
......
src/viewsPc/match/components/matchInfo.vue
<template>
<div style="padding: 0 20px 20px">
<!-- 赛事详情-->
<!--赛事详情-->
<div class="indexTitle"><h3 class="leftboderTT">组织机构</h3></div>
<el-row :gutter="20">
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>主办单位</dt>
<dd>世界体育舞蹈联合会（WDSF）</dd>
<dd>亚洲体育舞蹈联合会（DSA）</dd>
<dd>中国体育联合会（CDSF）</dd>
</dl>
</div>
</el-col>
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>承办单位</dt>
<dd>江苏省体育总会</dd>
<dd>无锡市人民政府</dd>
</dl>
</div>
</el-col>
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>协办单位</dt>
<dd>无锡市体育局</dd>
<dd>江苏无锡经济开发区管理委员会</dd>
<dd>江苏省体育舞蹈运动协会</dd>
</dl>
</div>
</el-col>
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>运营单位</dt>
<dd>吉金无锡运动健康有限公司</dd>
</dl>
</div>
</el-col>
</el-row>
<div class="indexTitle"><h3 class="leftboderTT">报名须知</h3></div>
<div class="xzbox">
1.各单位限报1支队伍，每队需报领队1名（运动员可兼任），运动员限报4名<br>
2.参赛运动员必须是参赛企业的员工（包括劳务派遣和外籍员工）<br>
3.参赛运动员必须年满18至50周岁，50周岁以上者不建议参加此次比赛<br>
4.参赛运动员必须身体健康
</div>
<div class="indexTitle"><h3 class="leftboderTT">报名须知</h3></div>
<div class="xzbox" v-html="form.signKnow">
<div class="indexTitle"><h3 class="leftboderTT">竞赛项目</h3></div>
<div class="collapsebox">
<el-collapse v-model="activeNames" @change="handleChange">
<el-collapse-item title="霹雳舞" name="1">
</div>
<div class="indexTitle" v-if="form.type==0"><h3 class="leftboderTT">赛事规程</h3></div>
<div class="xzbox" v-if="form.type==0" v-html="form.ruleUrl"></div>
<div class="indexTitle" v-if="form.type==1"><h3 class="leftboderTT">竞赛项目</h3></div>
<div class="collapsebox" v-if="form.type==1">
<el-collapse v-if="form.cptProjectList?.length > 0">
<el-collapse-item :title="p.name" :name="index" :key="index" v-for="(p,index) in form.cptProjectList">
<div class="pd20">
<table class="table">
<tr>
......@@ -135,171 +99,39 @@
</table>
</div>
</el-collapse-item>
<el-collapse-item title="拉丁舞" name="2">
<div class="pd20">
<table class="table">
<tr>
<td>日期</td>
<td>单元</td>
<td>组别</td>
<td>时间</td>
<td>阶段</td>
</tr>
<tr>
<td rowspan="4">2023/10/6(星期五)</td>
<td rowspan="4">BRK01</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td rowspan="8">2023/10/7(星期六)</td>
<td rowspan="8">BRK02</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
</table>
</div>
</el-collapse-item>
<el-collapse-item title="国际舞" name="3">
<div class="pd20">
<table class="table">
<tr>
<td>日期</td>
<td>单元</td>
<td>组别</td>
<td>时间</td>
<td>阶段</td>
</tr>
<tr>
<td rowspan="4">2023/10/6(星期五)</td>
<td rowspan="4">BRK01</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td rowspan="8">2023/10/7(星期六)</td>
<td rowspan="8">BRK02</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
</table>
</div>
</el-collapse-item>
</el-collapse>
<el-empty image="@/assets/img/order_no.png" image-size="228" v-if="form.cptProjectList?.length == 0" description=" "/>
</div>
</div>
</template>
<script setup>
const props = defineProps({
form:{
type:Object,
required:true
}
})
</script>
<style scoped>
<style scoped lang="scss">
.indexTitle{margin: 20px 0 12px;
h3{
font-size: 20px;
color:var(--el-color-primary);
}
}
.table{width: 100%;border-left: 1px solid #e1e1e1;border-top:1px solid #e1e1e1;
th{background: #eee;padding: 6px 10px;
border-right: 1px solid #e1e1e1;
border-bottom:1px solid #e1e1e1;
font-size: 15px;
}
td{padding: 6px 10px;border-right: 1px solid #e1e1e1;font-size: 15px;
border-bottom:1px solid #e1e1e1;vertical-align: middle;text-align: center;
span{margin-right: 10px}
span::after{content: ','}
span:last-child::after{content: ''}
}
}
</style>
......
src/viewsPc/match/components/matchNews.vue 0 → 100644
<template>
<el-card :body-style="{padding: '10px'}" class="mb20">
<div>
<div class="liveImgbox" @click="goDetail(newsList[0])">
<i class="ii">直播中</i>
<img :src="fillImgUrl_webSite(newsList[0]?.picUrl)">
</div>
</div>
<div class="indexTitle">
<h3 class="leftboderTT">赛事报道</h3>
<a class="more" @click="goList(query2.sortId,'专题报道')">MORE</a>
</div>
<div>
<div class="item" v-for="n in newsList2" :key="n.id">
<p class="esp">{{ n.name }}</p>
</div>
</div>
<div class="indexTitle"><h3 class="leftboderTT">赛事视频</h3>
<a class="more" @click="goList(10000006,'赛事视频')">MORE</a>
</div>
<div>
<div class="videoImgbox" @click="goDetail(newsList[1])">
<img :src="fillImgUrl_webSite(newsList[1]?.picUrl)">
</div>
</div>
<div class="indexTitle"><h3 class="leftboderTT">赛事图片</h3>
<a class="more" @click="goList(10000007,'赛事图片')">MORE</a>
</div>
<div>
<div class="picbox" @click="goDetail(newsList[0])"><img :src="fillImgUrl_webSite(newsList[0]?.picUrl)"/></div>
</div>
</el-card>
</template>
<script setup>
import {getNewsListById} from "@/apiPc/webSite";
import {onMounted, ref} from "vue";
const newsList = ref([])
const newsList2 = ref([])
const query1 = ref({
pageSize: 5,
pageNum: 1,
sortId: '10000006'
})
const query2 = ref({
pageSize: 3,
pageNum: 1,
sortId: '10000003'
})
onMounted(() => {
getList(query1.value)
getList2(query2.value)
})
const getList = (obj) => {
getNewsListById(obj).then(res => {
newsList.value = res.rows
})
}
const getList2 = (obj) => {
getNewsListById(obj).then(res => {
newsList2.value = res.rows
})
}
const goList = (sortId,name) => {
router.push({
path: `/news/list/${sortId}`,
query:{
kindName:name
}
})
}
</script>
<style scoped lang="scss">
.indexTitle{margin: 20px 0 12px;
h3{
font-size: 20px;
color:var(--el-color-primary);
}
}
.item:hover{cursor: pointer;color: var(--el-color-primary)}
.indexTitle a.more{top: 0;}
</style>
src/viewsPc/match/components/matchScheduleList.vue 0 → 100644
<template>
<div style="padding: 0 20px 20px">
<!--日程-->
<el-timeline>
<el-timeline-item
v-for="s in matchData.cptScheduleList"
:key="s.id" hide-timestamp
placement="top"
>
<p style="font-size: 16px;margin: 0">
{{ s.timeRange?.split(',')[0].substring(0, 16) }}
~
{{ s.timeRange?.split(',')[1].substring(0, 16) }}
</p>
<p style="font-size: 16px;">{{ s.name }}</p>
<p v-if="s.introduction" v-html="s.introduction"></p>
<div class="time-address">
<el-icon>
<Position />
</el-icon>
{{ s.address }}
</div>
</el-timeline-item>
</el-timeline>
<el-empty image="@/assets/img/order_no.png" image-size="228" v-if="matchData.cptScheduleList?.length==0" description=" " />
</div>
</template>
<script setup>
const props = defineProps({
matchData:{
type:Object,
required:true
}
})
</script>
<style scoped lang="scss">
.indexTitle{margin: 20px 0 12px;
h3{
font-size: 20px;
color:var(--el-color-primary);
}
}
.table{width: 100%;border-left: 1px solid #e1e1e1;border-top:1px solid #e1e1e1;
th{background: #eee;padding: 6px 10px;
border-right: 1px solid #e1e1e1;
border-bottom:1px solid #e1e1e1;
font-size: 15px;
}
td{padding: 6px 10px;border-right: 1px solid #e1e1e1;font-size: 15px;
border-bottom:1px solid #e1e1e1;vertical-align: middle;text-align: center;
span{margin-right: 10px}
span::after{content: ','}
span:last-child::after{content: ''}
}
}
</style>
src/viewsPc/match/detail.vue
......@@ -5,16 +5,16 @@
<el-card class="mb20">
<el-row :gutter="20">
<el-col :lg="7" :md="24" :xl="6" >
<img class="mauto" src="@/assets/dance/fm.jpg">
<img class="mauto" :src="matchData.bgImgUrl" >
</el-col>
<el-col :lg="9" :md="12" :xl="10">
<h3>
2024年WDSF亚洲体育舞蹈节亚洲体育 舞蹈节
{{ matchData.name }}
</h3>
<p class="ppl"><label class="bm1">比赛时间：</label>2024.07.21-2024.07.23</p>
<p class="ppl"><label class="bm2">赛事级别：</label>联赛</p>
<p class="ppl"><label class="bm3">地&ensp;&ensp;&ensp;&ensp;点：</label>江苏省无锡市滨湖区体育中心A区201</p>
<p class="ppl"><label class="bm4">报名截止：</label>2024-06-30 13:00</p>
<p class="ppl"><label class="bm1">比赛时间：</label>2024.07.21-{{ matchData.endTime }}</p>
<p class="ppl"><label class="bm2">赛事级别：</label>{{ matchData.level }}</p>
<p class="ppl"><label class="bm3">地&ensp;&ensp;&ensp;&ensp;点：</label>{{ matchData.address }}</p>
<p class="ppl"><label class="bm4">报名截止：</label>{{ matchData.signEndTime }}</p>
</el-col>
<el-col :lg="8" :md="12" :xl="8" v-if="matchData.type=='0'">
<p class="countDownTitle"><span>报名截止倒计时</span></p>
......@@ -31,12 +31,14 @@
</template>
</van-count-down>
<div>
<a class="btn-lineG mb20" @click="choseSignType" style="display: block;text-align: center;">我要报名</a>
</div>
</el-col>
</el-row>
</el-card>
<el-row gutter="10">
<el-row gutter="14">
<el-col :lg="4">
<div class="funcBtn">
<img src="@/assets/dance/btn04.png"/>
......@@ -80,41 +82,115 @@
<el-card :body-style="{'padding':'0'}">
<div class="lineHead">
<ul>
<li class="active">赛事详情</li>
<li>日程</li>
<li>参赛队</li>
<li>成绩</li>
<li>报名须知</li>
<li v-for="l in menu" :key="l.name" @click="changeMenu(menu,l)" :class="l.active==1?'active':''">{{l.name}}</li>
</ul>
</div>
<matchInfo/>
<matchInfo :form="matchData" v-if="menu[0].active==1"/>
<match-schedule-list :match-data="matchData" v-if="menu[2].active==1"/>
<div v-if="menu[1].active==1">
<div class="collapsebox">
<el-collapse v-if="matchData.cptProjectList?.length > 0">
<el-collapse-item :title="p.name" :name="index" :key="index" v-for="(p,index) in matchData.cptProjectList">
<div class="pd20">
<table class="table">
<tr>
<td>日期</td>
<td>单元</td>
<td>组别</td>
<td>时间</td>
<td>阶段</td>
</tr>
<tr>
<td rowspan="4">2023/10/6(星期五)</td>
<td rowspan="4">BRK01</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td rowspan="8">2023/10/7(星期六)</td>
<td rowspan="8">BRK02</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td colspan="5" style="text-align: left">
注：竞赛日程将根据最终参赛人数和电视转播的要求进行调整
</td>
</tr>
</table>
</div>
</el-collapse-item>
</el-collapse>
<el-empty image="@/assets/img/order_no.png" image-size="228" v-if="matchData.cptProjectList?.length == 0" description=" "/>
</div>
</div>
</el-card>
<div style="height: 20px"></div>
</el-col>
<el-col :lg="6">
<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">
<div class="gg">
<p><label>报名时间：</label>2023-03-23至2023-05-09</p>
<p><label>比赛时间：</label>2023-05-14至2023-05-14</p>
<p><label>联系方式：</label>13915234567</p>
</div>
</el-tab-pane>
</el-tabs>
</el-card>
<match-news/>
</el-col>
</el-row>
<el-row v-if="matchData.type=='1'">
<el-row v-if="matchData.type=='1'" class="mb20">
<el-col :lg="24">
<el-card :body-style="{'padding':'0'}">
<div class="lineHead">
<ul>
<li v-for="l in menu1" :key="l.name" @click="changeMenu1(l)" :class="l.active==1?'active':''">{{l.name}}</li>
<li v-for="l in menu1" :key="l.name" @click="changeMenu(menu1,l)" :class="l.active==1?'active':''">{{l.name}}</li>
</ul>
</div>
<!-- 分站赛-->
......@@ -148,9 +224,10 @@
<el-button v-else round type="warning" @click="goDetail(n.id)">查看详情</el-button>
</div>
</div>
<el-empty image="@/assets/img/order_no.png" image-size="228" v-if="matchData.cpts?.length == 0" description=" "/>
</div>
<matchInfo :form="matchData" v-if="menu1[1].active==1"/>
<match-schedule-list :match-data="matchData" v-if="menu1[2].active==1"/>
</el-card>
</el-col>
</el-row>
......@@ -179,6 +256,9 @@
<script setup>
import groupDetail from '@/viewsPc/center/component/teamInfo_form'
import matchInfo from '@/viewsPc/match/components/matchInfo'
import MatchScheduleList from "@/viewsPc/match/components/matchScheduleList";
import MatchNews from "@/viewsPc/match/components/matchNews";
import { getCurrentInstance, ref } from 'vue'
import { reactive, onMounted } from '@vue/runtime-core'
import { useRoute, useRouter } from 'vue-router'
......@@ -195,9 +275,10 @@ const data = reactive({
groupId: '',
activeName2:'first',
popupGroupList:false,
menu:[{name:'赛事详情',active:1},{name:'赛事设项',active:0},{name:'日程',active:0},{name:'参赛队',active:0},{name:'成绩',active:0},{name:'报名须知',active:0}],
menu1:[{name:'分站赛',active:1},{name:'赛事详情',active:0},{name:'日程',active:0}]
})
const {matchData,matchId,groupId,activeName2,popupGroupList,menu1} = toRefs(data)
const {matchData,matchId,groupId,activeName2,popupGroupList,menu,menu1} = toRefs(data)
onMounted(() => {
// matchId.value = route.params.id
matchId.value = '1759477811976183809'
......@@ -209,8 +290,8 @@ function getMatch(id) {
matchData.value = res.data
})
}
function changeMenu1(l){
for(const n of menu1.value){
function changeMenu(menu,l){
for(const n of menu){
if(n==l){
n.active = 1
} else {
......@@ -265,34 +346,15 @@ function goAddgroup() {
</script>
<style scoped lang="scss">
.funcBtn{width: 100%;background: #fff;text-align: center;position: relative;
margin: 0 0 24px;padding: 0 0 20px;
img{margin: auto;}
h4{font-size: 18px;margin: 0;}
}
.indexTitle{margin: 20px 0 12px;
h3{
font-size: 20px;
color:var(--el-color-primary);
}
}
.xzbox{border: 2px solid #DDECFB;padding: 20px;line-height: 2;
color: #29343C;
font-size: 16px;}
.dlbox{background: url("@/assets/dance/ds_bg.png") no-repeat left;background-size: 100% 100%;
padding: 0 0 20px;margin: 0 0 20px;
dl{height: 120px;margin: 0;
dt{
height: 30px;
font-size: 16px;margin: 0 0 18px;
font-weight: 600;line-height: 30px;display: inline-block;padding:0 20px 0 14px;
background: linear-gradient(90deg, #8623FC, #453DEA);
border-radius: 0px 0px 15px 0px;color: #fff;}
}
dd{
font-size: 14px;line-height: 1.6;
color: #29343C;}
}
.ppl{color: #29343C;
label{color: #929AA0;}
}
......
src/viewsPc/match/detail_en.vue
......@@ -33,16 +33,16 @@
<div class="funcBtns">
<div>
<img src="@/assets/dance/ds01.png"/>
<h4>TICKET BOOKING</h4>
<img src="@/assets/dance/btn01.png"/>
<h4>酒店预约</h4>
</div>
<div>
<img src="@/assets/dance/ds02.png"/>
<h4>HOTEL RESERVATIONS</h4>
<img src="@/assets/dance/btn02.png"/>
<h4>接送预约</h4>
</div>
<div>
<img src="@/assets/dance/ds03.png"/>
<h4>MAKEUP APPOINTMENTS</h4>
<img src="@/assets/dance/btn03.png"/>
<h4>餐饮预约</h4>
</div>
</div>
</el-col>
......
src/viewsPc/match/detail_fake.vue 0 → 100644
<template>
<div class="app-container">
<div class="mt30" />
<div class="box mb20 ">
<el-card class="mb20">
<el-row :gutter="20">
<el-col :lg="7" :md="24" :xl="6" >
<img class="mauto" src="@/assets/dance/fm.jpg">
</el-col>
<el-col :lg="9" :md="12" :xl="10">
<h3>
2024年WDSF亚洲体育舞蹈节亚洲体育 舞蹈节
</h3>
<p class="ppl"><label class="bm1">比赛时间：</label>2024.07.21-2024.07.23</p>
<p class="ppl"><label class="bm2">赛事级别：</label>联赛</p>
<p class="ppl"><label class="bm3">地&ensp;&ensp;&ensp;&ensp;点：</label>江苏省无锡市滨湖区体育中心A区201</p>
<p class="ppl"><label class="bm4">报名截止：</label>2024-06-30 13:00</p>
</el-col>
<el-col :lg="8" :md="12" :xl="8">
<p class="countDownTitle"><span>报名截止倒计时</span></p>
<van-count-down :time="time" format="DD 天 HH 时 mm 分 ss 秒">
<template #default="timeData">
<span class="block">{{ timeData.days }}</span>
<span class="colon">天</span>
<span class="block">{{ timeData.hours }}</span>
<span class="colon">时</span>
<span class="block">{{ timeData.minutes }}</span>
<span class="colon">分</span>
<span class="block">{{ timeData.seconds }}</span>
<span class="colon">秒</span>
</template>
</van-count-down>
<div class="funcBtns">
<div>
<img src="@/assets/dance/btn01.png"/>
<h4>酒店预约</h4>
</div>
<div>
<img src="@/assets/dance/btn02.png"/>
<h4>接送预约</h4>
</div>
<div>
<img src="@/assets/dance/btn03.png"/>
<h4>餐饮预约</h4>
</div>
</div>
</el-col>
</el-row>
</el-card>
<el-row :gutter="20">
<el-col :lg="18">
<el-card :body-style="{'padding':'0'}">
<div class="lineHead">
<ul>
<li class="active">赛事详情</li>
<li>日程</li>
<li>参赛队</li>
<li>成绩</li>
<li>报名须知</li>
</ul>
</div>
<div style="padding: 0 20px 20px">
<!-- 赛事详情-->
<div class="indexTitle"><h3 class="leftboderTT">组织机构</h3></div>
<el-row :gutter="20">
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>主办单位</dt>
<dd>世界体育舞蹈联合会（WDSF）</dd>
<dd>亚洲体育舞蹈联合会（DSA）</dd>
<dd>中国体育联合会（CDSF）</dd>
</dl>
</div>
</el-col>
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>承办单位</dt>
<dd>江苏省体育总会</dd>
<dd>无锡市人民政府</dd>
</dl>
</div>
</el-col>
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>协办单位</dt>
<dd>无锡市体育局</dd>
<dd>江苏无锡经济开发区管理委员会</dd>
<dd>江苏省体育舞蹈运动协会</dd>
</dl>
</div>
</el-col>
<el-col :lg="8">
<div class="dlbox">
<dl>
<dt>运营单位</dt>
<dd>吉金无锡运动健康有限公司</dd>
</dl>
</div>
</el-col>
</el-row>
<div class="indexTitle"><h3 class="leftboderTT">报名须知</h3></div>
<div class="xzbox">
1.各单位限报1支队伍，每队需报领队1名（运动员可兼任），运动员限报4名<br>
2.参赛运动员必须是参赛企业的员工（包括劳务派遣和外籍员工）<br>
3.参赛运动员必须年满18至50周岁，50周岁以上者不建议参加此次比赛<br>
4.参赛运动员必须身体健康
</div>
<div class="indexTitle"><h3 class="leftboderTT">竞赛项目</h3></div>
<div class="collapsebox">
<el-collapse v-model="activeNames" @change="handleChange">
<el-collapse-item title="霹雳舞" name="1">
<div class="pd20">
<table class="table">
<tr>
<td>日期</td>
<td>单元</td>
<td>组别</td>
<td>时间</td>
<td>阶段</td>
</tr>
<tr>
<td rowspan="4">2023/10/6(星期五)</td>
<td rowspan="4">BRK01</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td rowspan="8">2023/10/7(星期六)</td>
<td rowspan="8">BRK02</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td colspan="5" style="text-align: left">
注：竞赛日程将根据最终参赛人数和电视转播的要求进行调整
</td>
</tr>
</table>
</div>
</el-collapse-item>
<el-collapse-item title="拉丁舞" name="2">
<div class="pd20">
<table class="table">
<tr>
<td>日期</td>
<td>单元</td>
<td>组别</td>
<td>时间</td>
<td>阶段</td>
</tr>
<tr>
<td rowspan="4">2023/10/6(星期五)</td>
<td rowspan="4">BRK01</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td rowspan="8">2023/10/7(星期六)</td>
<td rowspan="8">BRK02</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
</table>
</div>
</el-collapse-item>
<el-collapse-item title="国际舞" name="3">
<div class="pd20">
<table class="table">
<tr>
<td>日期</td>
<td>单元</td>
<td>组别</td>
<td>时间</td>
<td>阶段</td>
</tr>
<tr>
<td rowspan="4">2023/10/6(星期五)</td>
<td rowspan="4">BRK01</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>资格赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>循环赛</td>
</tr>
<tr>
<td rowspan="8">2023/10/7(星期六)</td>
<td rowspan="8">BRK02</td>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>四分之一决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>半决赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>季军赛</td>
</tr>
<tr>
<td>男子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
<tr>
<td>女子</td>
<td>14：30 - 15：30</td>
<td>决赛</td>
</tr>
</table>
</div>
</el-collapse-item>
</el-collapse>
</div>
</div>
</el-card>
<div style="height: 20px"></div>
</el-col>
<el-col :lg="6">
<a class="btn-lineG mb20" 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">
<div class="gg">
<p><label>报名时间：</label>2023-03-23至2023-05-09</p>
<p><label>比赛时间：</label>2023-05-14至2023-05-14</p>
<p><label>联系方式：</label>13915234567</p>
</div>
</el-tab-pane>
</el-tabs>
</el-card>
</el-col>
</el-row>
</div>
<el-dialog v-model="popupGroupList" title="请选择参赛队" width="600px">
<div class="popList">
<div v-for="(t,index) in groups" :key="index" class="teamItem" @click="getThisGroupId(t)">
<el-avatar :size="60" :src="t.imgUrl" />
<span class="name">{{ t.name }}({{ t.abreviations }})</span>
（{{ t.typeStr }}）
</div>
<el-button plain style="width: 100%;height: 50px;font-size:16px;" type="success" @click="goAddgroup()">
<el-icon>
<Plus />
</el-icon>
新建参赛队
</el-button>
</div>
</el-dialog>
</div>
</template>
<script setup>
import { getCurrentInstance, ref } from 'vue'
import { reactive, onMounted } from '@vue/runtime-core'
import { useRoute, useRouter } from 'vue-router'
const route = useRoute()
const router = useRouter()
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')
</script>
<style scoped lang="scss">
.indexTitle{margin: 20px 0 12px;
h3{
font-size: 20px;
color:var(--el-color-primary);
}
}
.xzbox{border: 2px solid #DDECFB;padding: 20px;line-height: 2;
color: #29343C;
font-size: 16px;}
.dlbox{background: url("@/assets/dance/ds_bg.png") no-repeat left;background-size: 100% 100%;
padding: 0 0 20px;margin: 0 0 20px;
dl{height: 120px;margin: 0;
dt{
height: 30px;
font-size: 16px;margin: 0 0 18px;
font-weight: 600;line-height: 30px;display: inline-block;padding:0 20px 0 14px;
background: linear-gradient(90deg, #8623FC, #453DEA);
border-radius: 0px 0px 15px 0px;color: #fff;}
}
dd{
font-size: 14px;line-height: 1.6;
color: #29343C;}
}
.ppl{color: #29343C;
label{color: #929AA0;}
}
.bm1{background: url("@/assets/dance/bm1.png") no-repeat left;background-size: contain;padding-left: 24px;}
.bm2{background: url("@/assets/dance/bm2.png") no-repeat left;background-size: contain;padding-left: 24px;}
.bm3{background: url("@/assets/dance/bm3.png") no-repeat left;background-size: contain;padding-left: 24px;}
.bm4{background: url("@/assets/dance/bm4.png") no-repeat left;background-size: contain;padding-left: 24px;}
.app-container {
padding: 0;
background: #F5F7F9;
}
.countDownTitle {
text-align: center;
color: #525F6B;
position: relative;
width: 100%;
left: 0;
font-size: 14px;
}
.countDownTitle span {
background: #fff;
padding: 0 10px;
position: relative;
z-index: 1;
}
.countDownTitle::after {
position: absolute;
background: #ccc;
height: 1px;
content: '';
top: 0;
bottom: 0;
margin: auto;
width: 100%;
left: 0;
}
.typeTag {
border-radius: 10px 10px 10px 0px;
padding: 2px 12px;
background: #FF8124;
font-size: 14px;
color: #fff;
}
.matchItem {
cursor: pointer;
margin-bottom: 40px;
height: 180px;
background: #FFFFFF;
position: relative;
border-radius: 10px;
.el-avatar {
position: absolute;
left: 20px;
top: 30px;
img {
background: #fff;
}
}
.info {
padding: 12px 0 0 140px;
p {
font-size: 14px;
}
}
.typeTag {
position: absolute;
right: 0;
top: 0;
}
h3 {
font-weight: 500;
font-size: 18px;
color: #000000;
text-overflow: ellipsis;
}
&:hover h3 {
font-weight: bold;
}
}
.el-pagination {
justify-content: center;
--el-pagination-bg-color: none;
}
.kind {
background: #fff;
margin: 0 0 30px;
ul {
list-style: none;
padding: 30px 0 10px;
li {
margin: 0 0 20px;
display: flex;
align-items: center;
}
}
}
.listTitle {
display: flex;
justify-content: space-between;
align-items: center;
}
.match-tabs {
background: #fff;
padding: 10px 20px 20px;
}
.teamItem {
height: 80px;
background: #FBFCFD;
border-radius: 10px;
margin: 10px 0;
display: flex;
align-items: center;
padding: 0 20px;
overflow: hidden;
text-overflow: ellipsis;
.el-avatar {
border: 1px solid #EEEEEE;
}
.name {
margin-left: 15px;
flex: 1;
font-size: 14px;
}
}
.grid-top {
background: #fff;
min-height: 300px;
padding: 28px 28px 10px;
border-radius: 10px;
margin: 30px auto;
position: relative;
.cover {
width: 420px;
height: 250px;
position: absolute;
border-radius: 10px;
background: #fff;
object-fit: cover;
}
.info {
padding-left: 440px;
h3 {
font-weight: 500;
color: #000000;
margin: 0 0 10px;
font-size: 24px;
img{margin-right: 10px}
.typeTag {
border-radius: 13px 13px 13px 0;
margin-left: 10px;
}
}
p {
color: #7B7F83;
font-size: 16px;
}
.countDownTitle{font-size: 14px;}
.el-button.el-button--primary {
background: #CA171D;
border: none;
}
}
}
.gg {
margin: 0 0 28px;
h3 {border-left: 2px solid #BA2E29; padding: 0 0 0 12px;
margin: 20px 0 8px;
font-weight: 500;
font-size: 16px;
}
p {
font-size: 16px;
color: #000;
margin: 0 0 8px;
line-height: 24px;
label{color: #7D8790;}
}
.pp {
border: 1px solid rgba(186, 46, 41, 0.3);
padding: 20px;
}
}
.van-count-down {
text-align: center;
margin: 20px 0;
}
.colon {
display: inline-block;
font-size: 16px;
margin: 0 8px;
color: #7B7F83;
}
.block {
display: inline-block;
width: 52px;
color: #fff;
font-size: 26px;
font-weight: bold;
border-radius: 10px;
background: url(@/assets/img/djs_bg.png) left;
background-size: 100% 100%;
line-height: 50px;
text-align: center;
}
.time-address {
font-size: 15px;
margin: 10px 0 0;
color: #999;
}
.popList .teamItem {
cursor: pointer;
}
.popList .teamItem:hover {
background: #e7e7e7;
}
.richContent {
overflow: hidden;
}
.richContent img {
max-width: 100%;
}
.red-center {
font-size: 24px;
text-align: center;
font-family: DIN Alternate;
padding: 30px 0;
font-weight: bold;
color: #E60012;
}
.plist {
dt {
font-size: 14px;
}
dd {
display: inline-block;
margin: 0 15px 0 0;
}
dd.t {
display: block;
margin: 15px 0 6px;
border-left: 3px solid #1ec886;
line-height: 1;
padding: 6px;
background: #f5f5f5;
}
li {
line-height: 40px;
display: flex;
justify-content: space-between;
padding: 0 20px;
align-items: center;
cursor: pointer;
}
li:hover {
background: #eee;
}
}
.pp .el-link {
margin-right: 15px;
font-size: 16px;
}
:deep(.el-collapse-item__header) {
font-weight: 500;
font-size: 16px;
}
.pobtns {
position: absolute;
right: 20px;
bottom: 20px;
}
:deep(.el-tabs__item) {
font-size: 16px;
}
.signButton {
margin: 0 0 20px;
button {
width: 90%;background: var(--el-color-primary);
font-size: 20px;margin: 30px auto 0;display: block;
height: 50px;
}
}
.el-timeline-item__timestamp.is-top {
font-size: 16px;
}
.el-timeline-item__content {
font-size: 16px;
margin: 10px 0 0;
}
.typeTag.blue {
background: #00a0e9;
}
.typeTag.green {
background: #34cf96;
}
:deep(.el-tabs__nav-wrap::after) {
height: 1px;
}
.table{width: 100%;border-left: 1px solid #e1e1e1;border-top:1px solid #e1e1e1;
th{background: #eee;padding: 6px 10px;
border-right: 1px solid #e1e1e1;
border-bottom:1px solid #e1e1e1;
font-size: 15px;
}
td{padding: 6px 10px;border-right: 1px solid #e1e1e1;font-size: 15px;
border-bottom:1px solid #e1e1e1;vertical-align: middle;text-align: center;
span{margin-right: 10px}
span::after{content: ','}
span:last-child::after{content: ''}
}
}
.flexLine{display: flex;
label{font-weight: normal}
}
.nowteamItem{
height: 100px;
background: #FBFCFD;
border-radius: 10px;
margin: 20px 0;
display: flex;
align-items: center;
padding: 0 20px;
overflow: hidden;
text-overflow: ellipsis;
.el-avatar {margin: 0 20px}
.info{
h3{margin: 0 0 15px;}
p{margin: 0;color: #1ab394}
}
.rr{text-align: right; flex: 1;
span{color: #1ab394}
}
}
.collapsebox{
.el-collapse-item{margin-bottom: 15px;--el-collapse-content-bg-color:#F4F9FE;
border: 2px solid #DDECFB;
.table{background: #fff;}
}
.is-active{--el-collapse-header-bg-color:#F4F9FE}
:deep(.el-collapse-item__header){padding: 0 20px;}
}
.funcBtns{display: flex; justify-content: space-around;
div{text-align: center;background: #F7FAFF;box-shadow:0 0 10px #d4cae4;
border-radius: 15px;padding: 0px 10px 5px;
img{}
h4{margin: 0;font-size: 16px;}
}
}
.table{white-space: nowrap}
@media (max-width: 800px) {
.van-count-down{
.block{margin: 0 10px;}
}
.colon{display: none;}
.funcBtns{
div{padding: 0 0 10px;
margin: 0 5px;
}
}
}
</style>
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!