Skip to content

杨炀 / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
763d3b45 by 杨炀
Options

no message

1 parent 5119038f
Inline Side-by-side
Showing 71 changed files with 816 additions and 846 deletions
index.html
......@@ -7,7 +7,7 @@
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="/favicon.ico">
<title>亚洲体育舞蹈节</title>
<title>世锦赛</title>
<!-- <script src="./browser.js"></script>-->
<!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
......
src/App.vue
......@@ -17,8 +17,8 @@ const { proxy } = getCurrentInstance()
const language= useStorage('language',0)
onMounted(() => {
document.body.style.setProperty('--el-color-primary', '#453DEA')
document.body.style.setProperty('--el-color-primary-light-3', '#8623FC')
document.body.style.setProperty('--el-color-primary', '#0540EC')
document.body.style.setProperty('--el-color-primary-light-3', '#1B69F8')
document.body.style.setProperty('--el-button-hover-bg-color', '#fff')
nextTick(() => {
// 初始化主题样式
......@@ -91,7 +91,7 @@ li.el-select-dropdown__item {
}
:root {
--el-color-primary: #453DEA;
--el-color-primary: #0557EC;
}
.el-popper .el-menu {
......@@ -128,7 +128,9 @@ li.el-select-dropdown__item {
.el-popper.is-light.is-pure {
border: none;
}
.el-menu--horizontal .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal .el-menu-item:not(.is-disabled):hover{
background-color: transparent;
}
.el-popper {
.el-menu--horizontal .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
color: var(--el-color-primary);
......@@ -144,11 +146,11 @@ li.el-select-dropdown__item {
.el-menu {color: #000;}
.el-menu--horizontal>.el-menu-item {
transition: none;color: #000;padding: 6px 10px ;margin: 0 10px;border-radius: 18px;
transition: none;color: #000;padding: 6px 0 ;margin: 0 10px;
}
.el-sub-menu .el-sub-menu__title {
font-size: 18px;color: #000;
font-size: 16px;color: #000;
}
.el-menu--horizontal > .el-sub-menu.is-active .el-sub-menu__title {
......@@ -164,17 +166,13 @@ li.el-select-dropdown__item {
color: #453DEA;
}
.el-menu--horizontal .el-menu-item:not(.is-disabled):focus {
}
.el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
color: #453DEA;
color:#000;background: transparent;filter: drop-shadow(0 0 1px #000);
}
.el-menu--horizontal > .el-menu-item.is-active {
border-bottom: none;background: linear-gradient(-90deg, #8623FC, #453DEA);
border-radius: 18px;color: #fff!important;
border-bottom: 2px solid #000;color: #000!important;
}
.el-menu--horizontal {
......@@ -184,7 +182,7 @@ li.el-select-dropdown__item {
}
.el-menu--horizontal > .el-menu-item {
font-size: 20px;
font-size: 16px;
}
}
......
src/apiPc/match.js
......@@ -15,6 +15,13 @@ export function getMatchById(params) {
params: params
})
}
export function getInfoByCptId(params) {
return request({
url: `/league/competitionLive/getInfoByCptId`,
method: 'get',
params: params
})
}
export function refundApply(orderId) {
return request({
......
src/assets/dance/about_bg.png
src/assets/dance/about_bg.png

87 KB | W: | H:

src/assets/dance/about_bg.png

157 KB | W: | H:

src/assets/dance/about_bg.png
src/assets/dance/about_bg.png
src/assets/dance/about_bg.png
src/assets/dance/about_bg.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/banner.png
src/assets/dance/banner.png

1.3 MB | W: | H:

src/assets/dance/banner.png

1.56 MB | W: | H:

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

2.9 KB | W: | H:

src/assets/dance/btn01.png

13.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.57 KB | W: | H:

src/assets/dance/btn02.png

15.9 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.19 KB | W: | H:

src/assets/dance/btn03.png

14.9 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.79 KB | W: | H:

src/assets/dance/btn04.png

16.9 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

3.29 KB | W: | H:

src/assets/dance/btn05.png

15.1 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/btn_bg.png
src/assets/dance/btn_bg.png

37.9 KB | W: | H:

src/assets/dance/btn_bg.png

13.2 KB | W: | H:

src/assets/dance/btn_bg.png
src/assets/dance/btn_bg.png
src/assets/dance/btn_bg.png
src/assets/dance/btn_bg.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/map.png
src/assets/dance/map.png

129 KB | W: | H:

src/assets/dance/map.png

291 KB | W: | H:

src/assets/dance/map.png
src/assets/dance/map.png
src/assets/dance/map.png
src/assets/dance/map.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/map01.png
src/assets/dance/map01.png

971 Bytes | W: | H:

src/assets/dance/map01.png

605 Bytes | W: | H:

src/assets/dance/map01.png
src/assets/dance/map01.png
src/assets/dance/map01.png
src/assets/dance/map01.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/map02.png
src/assets/dance/map02.png

1.07 KB | W: | H:

src/assets/dance/map02.png

714 Bytes | W: | H:

src/assets/dance/map02.png
src/assets/dance/map02.png
src/assets/dance/map02.png
src/assets/dance/map02.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/map03.png
src/assets/dance/map03.png

1.07 KB | W: | H:

src/assets/dance/map03.png

654 Bytes | W: | H:

src/assets/dance/map03.png
src/assets/dance/map03.png
src/assets/dance/map03.png
src/assets/dance/map03.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/next1.png
src/assets/dance/next1.png

1.12 KB | W: | H:

src/assets/dance/next1.png

885 Bytes | W: | H:

src/assets/dance/next1.png
src/assets/dance/next1.png
src/assets/dance/next1.png
src/assets/dance/next1.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/p.png
src/assets/dance/p.png

979 Bytes | W: | H:

src/assets/dance/p.png

985 Bytes | W: | H:

src/assets/dance/p.png
src/assets/dance/p.png
src/assets/dance/p.png
src/assets/dance/p.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/prev1.png
src/assets/dance/prev1.png

1.09 KB | W: | H:

src/assets/dance/prev1.png

903 Bytes | W: | H:

src/assets/dance/prev1.png
src/assets/dance/prev1.png
src/assets/dance/prev1.png
src/assets/dance/prev1.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/dance/time_bg.png
src/assets/dance/time_bg.png

8.24 KB | W: | H:

src/assets/dance/time_bg.png

6.67 KB | W: | H:

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

2.51 KB | W: | H:

src/assets/logo/btn01.png

882 Bytes | W: | H:

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

2.76 KB | W: | H:

src/assets/logo/btn02.png

493 Bytes | W: | H:

src/assets/logo/btn02.png
src/assets/logo/btn02.png
src/assets/logo/btn02.png
src/assets/logo/btn02.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/styles/index.scss
......@@ -206,14 +206,14 @@ aside {
}
.el-step__head.is-success{
.el-step__icon{color: #fff;border: none;
background: linear-gradient(90deg, #8623FC, #453DEA);}
background: #000;}
}
.el-step__line{border-top:1px dashed #D1D6D8;background: transparent!important;
.el-step__line-inner{border-width: 0!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);}
background: #000;}
}
.el-step__title.is-process{
color: var(--el-color-primary)!important;font-weight: 400;
......@@ -242,7 +242,7 @@ aside {
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);
background: #000;
border-radius: 0px 0px 15px 0px;color: #fff;}
}
dd{
......
src/assets/styles/ruoyi.scss
......@@ -14,7 +14,7 @@
.borderRadius10{border-radius: 10px;}
.w80{width: 80%;}
.w50{width: 50%;}
.text-gray{color: #999}
.text-gray{color: #929AA0}
.uppercase{
text-transform: uppercase;
*{
......@@ -464,7 +464,7 @@ img{display: block;}
}
}
.rotate90_180{transform: rotate(90deg) rotateX(180deg);}
.istop{background: var(--el-color-primary);color: #fff;
.istop{background: #E91C1A;color: #fff;
font-size: 14px;padding: 2px 6px;margin-right: 10px;
border-radius: 5px 5px 0px 5px;position: relative;top: -2px;}
.newsLine{
......@@ -513,14 +513,14 @@ img{display: block;}
}
}
}
.bg-lineg{ background: linear-gradient(90deg, #8623FC, #453DEA);color: #fff;}
.bg-lineg{ background: #000;color: #fff;}
.lineHead{
//height: 50px;
padding: 15px;overflow: auto;
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
h3{margin: 0;background: #FFFFFF;
font-size: 18px;
color: var(--el-color-primary);
color: #000;
border-radius: 5px;display: inline;padding: 5px 15px;}
ul{margin: 0;padding: 0;white-space: nowrap;
li{border-radius: 5px;display: inline;padding: 5px 15px; font-size: 18px;text-transform: capitalize;
......@@ -578,7 +578,7 @@ img{display: block;}
img{object-fit: cover;height: 100%;}
.date{width: 60px;height: 60px;text-align: center;
position: absolute;left: 0;top:16px;
background: var(--el-color-primary);
background: #000;
.day{color: #fff;transform: scaleX(0.7);font-weight: bold;font-size: 24px;}
p{font-size: 14px;margin: 0;transform: scaleX(0.7);font-weight: bold;color: #fff;}
}
......@@ -729,6 +729,17 @@ img{display: block;}
flex-direction: row-reverse;
}
}
@media screen and (max-width: 768px) {
.newsflex{
.el-col:nth-child(2) .item{
flex-direction: row-reverse;
}
.el-col:nth-child(3) .item{
flex-direction: row;
}
}
}
.newsimgcover{
.item{margin: 10px 0;
......@@ -1048,10 +1059,7 @@ img{display: block;}
95%{transform: translateY(-3px);}
100%{transform: translateY(0px);}
}
.smallToday{display: flex;align-items: center;
.type{margin-right: 20px;}
h3{margin: 0 0 10px;}
}
.weatherbox{padding: 20px 0;
.today{text-align: center;display: flex;justify-content: center;align-items: center;margin: 0 0 30px;
.type{margin-left: 30px;}
......@@ -1333,12 +1341,13 @@ img{display: block;}
font-size: 16px;
color: var(--el-color-primary);
}
.blackBtn{background: #000;}
.btn-lineG{background: linear-gradient(-90deg, #8623FC, #453DEA);
.btn-lineG{background: linear-gradient(90deg, #1B69F8, #0540EC);
border-radius: 23px;padding: 6px 40px;
color: #FFFFFF;
font-size: 18px;}
.btn-lineG:hover{color: #fff;box-shadow: 0 0 10px #453DEA}
.btn-lineG:hover{color: #fff;box-shadow: 0 0 10px #453DEA;background: linear-gradient(-90deg, #1B69F8, #0540EC);}
.indexTitle {
position: relative;margin: 50px 0 25px;
......@@ -1350,11 +1359,7 @@ img{display: block;}
}
.leftboderTT{
font-size: 36px;margin: 0;line-height: 1;text-transform: uppercase;
position:relative;padding-left: 22px;
&::before{ content: '';position: absolute;left: 0;width: 6px;
height: 100%;top: 0;bottom: 0;margin: auto;
background: linear-gradient(0deg, #8623FC, #453DEA);
border-radius: 3px;}
position:relative;
}
img.more {
cursor: pointer;
......@@ -1371,19 +1376,16 @@ img{display: block;}
.activeItem {
cursor: pointer;
background: #FFFFFF;
border-image: linear-gradient(-90deg, #8623FC, #453DEA);
border-image-slice: 1;
border-image-width: 0 0 4px;
&:hover {
.imgbox img {
transform: scale(1.1);
transform-origin: center;
}
.info{
background: linear-gradient(-90deg, #8623FC, #453DEA);
background: #000;
color: #fff;
p{color: #fff;}
a{color: #fff;}
a{color: #fff;background: url("@/assets/dance/arrow2.png") no-repeat right;}
}
}
......@@ -1404,8 +1406,10 @@ img{display: block;}
h3 {
margin: 0;
}
a{color: #453DEA;
font-size: 14px;}
a{color: #000;display: block;text-align: right;
font-size: 14px;background: url("@/assets/dance/arrow02.png") no-repeat right;
padding-right: 30px;
}
p {
color: #7B7F83;
font-size: 14px;
......@@ -1450,9 +1454,9 @@ img{display: block;}
}
.languageBtn{white-space: nowrap;
font-size: 16px;
span{padding: 0 5px;cursor: pointer;}
span:hover{font-weight: bold;}
.active{color: var(--el-color-primary);font-weight: bold;cursor: pointer;}
span{margin: 0 10px;cursor: pointer;color: #929AA0;padding: 6px 0;}
span:hover{filter: drop-shadow(0 0 1px #000);}
.active{color: #000;font-weight: bold;cursor: pointer;border-bottom: 2px solid #000;}
}
.mapBox{word-break: break-all;}
.as16_9{aspect-ratio: 16/9;}
......
src/layoutPc/components/AppBottom.vue
<template>
<div class="footAll">
<div class="box" style="max-width: 90%">
<el-row style="align-items: center;" v-if="language==0">
<el-row v-if="language==0" justify="space-between" align="middle">
<el-col :lg="10" :md="10" :xs="10">
<ul>
<li>邮编：214000</li>
......@@ -24,12 +24,11 @@
</el-col>
<el-col :span="24" style="border-top: 1px solid #fff">
<div class="text-center copyright pd10">版权所有@无锡和畅赛事运营有限公司
&ensp;&ensp
<a target="_blank" href="https://beian.miit.gov.cn/">ICP备案号：苏ICP备2023054420号-2</a></div>
</el-col>
</el-row>
<el-row style="align-items: center;" v-if="language===1">
<el-row justify="space-between" align="middle" v-if="language===1">
<el-col :span="14">
<ul>
<li>Postal code：214000</li>
......@@ -59,24 +58,24 @@
<div class="mlb" v-if="language===0">
<div onclick="window.open('https://ykf-weixin01.7moor.com/wapchat.html?accessId=6c500b60-02c6-11ef-9a4d-85cd5dacc5bf&fromUrl=&urlTitle=&language=ZHCN','_blank','height=700px,width=700px,top=50,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')" title="客服" >
<img class="kf" src="@/assets/logo/btn01.png"/>
<div class="text-center mt10 gradient-text">在线客服</div>
<div class="text-center mt10">在线客服</div>
</div>
<div @click="goHelpZH">
<!-- <a target="_blank" href="https://wdsfwuxicenter.com/stage-api/fs/file/操作指引.zip">-->
<a>
<img class="kf" src="@/assets/logo/btn02.png"/>
<div class="text-center mt10 gradient-text">指南下载</div>
<div class="text-center mt10">指南下载</div>
</a>
</div>
</div>
<div class="mlb" v-else>
<div onclick="window.open('https://ykf-weixin01.7moor.com/wapchat.html?accessId=707daf80-02c6-11ef-9a4d-85cd5dacc5bf&fromUrl=&urlTitle=&language=EN','_blank','height=700px,width=700px,top=100,left=150,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')" title="Live Chat">
<img class="kf" src="@/assets/logo/btn01.png"/>
<div class="text-center gradient-text">LIVE CHAT</div>
<div class="text-center ">LIVE CHAT</div>
</div>
<div @click="goHelp">
<img class="kf" src="@/assets/logo/btn02.png"/>
<div class="text-center gradient-text uppercase">Video Guide</div>
<div class="text-center uppercase">Video Guide</div>
</div>
</div>
</div>
......
src/layoutPc/components/AppHeader.vue
......@@ -12,14 +12,14 @@
>
<el-menu-item index="/">{{ language==0?'首页':'HOME' }}</el-menu-item>
<el-menu-item index="/news">{{ language==0?'新闻资讯':'NEWS' }}</el-menu-item>
<el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>
<el-menu-item index="/match/list">{{ language==0?'大赛报名':'REGISTRATION' }}</el-menu-item>
<el-menu-item index="/saiC">{{ language==0?'赛程安排':'COMPETITIONS' }}</el-menu-item>
<el-menu-item index="/meta">{{ language==0?'媒体中心':'MEDIA' }}</el-menu-item>
<el-menu-item index="/notice">{{ language==0?'通知公告':'NOTICEBOARD' }}</el-menu-item>
<el-menu-item index="/match/list">{{ language==0?'赛事服务':'REGISTRATION' }}</el-menu-item>
<el-menu-item index="/saiC">{{ language==0?'竞赛日程':'COMPETITIONS' }}</el-menu-item>
<el-menu-item index="/meta">{{ language==0?'媒体中心':'MEDIA' }}</el-menu-item>
<el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>
<el-menu-item index="/about/wuDao">{{ language==0?'关于我们':'CONTACT & MORE' }}</el-menu-item>
<!-- <el-sub-menu index="/about">-->
<!-- <template #title>{{ language==0?'关于我们':'CONTACT & MORE' }}</template>-->
<!-- <el-menu-item index="/about/wuDao">{{ language==0?'舞蹈节':'About Us' }}</el-menu-item>-->
<!-- <el-menu-item index="/about/regulations" v-if="language==1">Rules & Regulations</el-menu-item>-->
<!-- <el-menu-item index="/about/culture">{{ language==0?'地方文化':'Culture' }}</el-menu-item>-->
......@@ -31,14 +31,14 @@
>
<el-menu-item index="/">{{ language==0?'首页':'HOME' }}</el-menu-item>
<el-menu-item index="/news">{{ language==0?'新闻资讯':'NEWS' }}</el-menu-item>
<el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>
<el-menu-item index="/match/list">{{ language==0?'大赛报名':'REGISTRATION' }}</el-menu-item>
<el-menu-item index="/saiC">{{ language==0?'赛程安排':'COMPETITIONS' }}</el-menu-item>
<el-menu-item index="/meta">{{ language==0?'媒体中心':'MEDIA' }}</el-menu-item>
<el-menu-item index="/notice">{{ language==0?'通知公告':'NOTICEBOARD' }}</el-menu-item>
<el-menu-item index="/match/list">{{ language==0?'赛事服务':'REGISTRATION' }}</el-menu-item>
<el-menu-item index="/saiC">{{ language==0?'竞赛日程':'COMPETITIONS' }}</el-menu-item>
<el-menu-item index="/meta">{{ language==0?'媒体中心':'MEDIA' }}</el-menu-item>
<el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>
<el-menu-item index="/about/wuDao">{{ language==0?'关于我们':'CONTACT & MORE' }}</el-menu-item>
<!-- <el-sub-menu index="/about">-->
<!-- <template #title>{{ language==0?'关于我们':'CONTACT & MORE' }}</template>-->
<!-- <el-menu-item index="/about/wuDaoEn">{{ language==0?'舞蹈节':'About Us' }}</el-menu-item>-->
<!-- <el-menu-item index="/about/regulations" v-if="language==1">Rules & Regulations</el-menu-item>-->
<!-- <el-menu-item index="/about/cultureEn">{{ language==0?'地方文化':'Culture' }}</el-menu-item>-->
......@@ -52,7 +52,7 @@
</div>
<div class="languageBtn">
<span :class="language==0?'active':''" @click="changeLanguage(0)">{{ language==0?'中文':'CN' }}</span>
|
<span :class="language==1?'active':''" @click="changeLanguage(1)">EN</span>
</div>
<div class="ml20 forPc" >
......@@ -114,15 +114,11 @@
<el-menu-item index="/">首页</el-menu-item>
<el-menu-item index="/news">新闻资讯</el-menu-item>
<el-menu-item index="/notice">通知公告</el-menu-item>
<el-menu-item index="/match/list">大赛报名</el-menu-item>
<el-menu-item index="/saiC">赛程安排</el-menu-item>
<el-menu-item index="/match/list">赛事服务</el-menu-item>
<el-menu-item index="/saiC">竞赛日程</el-menu-item>
<el-menu-item index="/meta">媒体中心</el-menu-item>
<el-menu-item index="/guide">参赛指南</el-menu-item>
<el-sub-menu index="/about">
<template #title>关于我们</template>
<el-menu-item index="/about/wuDao">舞蹈节</el-menu-item>
<el-menu-item index="/about/culture">地方文化</el-menu-item>
</el-sub-menu>
<el-menu-item index="/about/wuDao">关于我们</el-menu-item>
<el-menu-item v-if="isLogin" index="/center/myInfo">个人中心</el-menu-item>
</el-menu>
<el-menu class="weiMenu"
......@@ -137,12 +133,13 @@
<el-menu-item index="/saiC">COMPETITIONS</el-menu-item>
<el-menu-item index="/meta">MEDIA</el-menu-item>
<el-menu-item index="/guide">GUIDELINE</el-menu-item>
<el-sub-menu index="/about">
<template #title>CONTACT & MORE</template>
<el-menu-item index="/about/wuDaoEn">About Us</el-menu-item>
<el-menu-item index="/about/regulations">Rules & Regulations</el-menu-item>
<el-menu-item index="/about/cultureEn">Culture</el-menu-item>
</el-sub-menu>
<el-menu-item index="/about/wuDao">CONTACT & MORE</el-menu-item>
<!-- <el-sub-menu index="/about">-->
<!-- <template #title>CONTACT & MORE</template>-->
<!-- <el-menu-item index="/about/wuDaoEn">About Us</el-menu-item>-->
<!-- <el-menu-item index="/about/regulations">Rules & Regulations</el-menu-item>-->
<!-- <el-menu-item index="/about/cultureEn">Culture</el-menu-item>-->
<!-- </el-sub-menu>-->
<el-menu-item v-if="isLogin" index="/center/myInfo">PERSONAL CENTER</el-menu-item>
</el-menu>
</el-drawer>
......@@ -270,15 +267,9 @@ function getCode() {
:deep(.el-menu--horizontal.el-menu){border: none;}
}
.loginBtn {color: #fff;margin-right: 15px;border: none;
background: linear-gradient(-90deg, #8623FC, #453DEA);box-shadow:0 0 10px #fff;
&:active {
color: #fff;
background:linear-gradient(0deg, #8623FC, #453DEA);
border:none;
}
background: #000;box-shadow:0 0 10px #fff;
&:hover {
box-shadow:0 0 10px var(--el-color-primary);border: none;
box-shadow:0 0 10px #000;border: none;
color:#fff;
}
......@@ -337,12 +328,11 @@ function getCode() {
.ropenbtn{padding: 10px;display: none;
img{ width: 44px;}
img{ width: 44px; filter: grayscale(1);}
}
:deep(.el-input){height: 100%}
:deep(.el-form-item){height: 40px;}
//.home-menu .el-menu--horizontal > .el-menu-item{margin: 0 5px; font-size: 18px;}
.home-menu .el-sub-menu{font-size: 16px;}
.weiMenu.el-menu{
border: none;
......
src/layoutPc/components/AppTop.vue
......@@ -188,15 +188,15 @@ function getCode() {
<style scoped lang="scss">
.loginBtn {color: #fff;margin-right: 15px;border: none;
background: linear-gradient(-90deg, #8623FC, #453DEA);box-shadow:0 0 10px #fff;
background: #000;box-shadow:0 0 10px #fff;
&:active {
color: #fff;
background:linear-gradient(0deg, #8623FC, #453DEA);
background:#000;
border:none;
}
&:hover {
box-shadow:0 0 10px var(--el-color-primary);border: none;
box-shadow:0 0 10px #aaa;border: none;
color:#fff;
}
......@@ -257,7 +257,7 @@ function getCode() {
.ropenbtn{padding: 10px;display: none;
img{ width: 44px;}
img{ width: 44px; filter: grayscale(1);}
}
:deep(.el-input){height: 100%}
......
src/layoutPc/components/indexSearch.vue
......@@ -117,7 +117,7 @@ h2 {
border: none;
height: 60px;
color: #fff;
background: linear-gradient(-90deg, #8623FC, #453DEA);;
background: #000;;
border-radius: 0px 5px 5px 0px;
}
......
src/layoutPc/components/indexSearch_en.vue
......@@ -103,7 +103,7 @@ h2 {
border: none;
height: 60px;
color: #fff;
background: linear-gradient(-90deg, #8623FC, #453DEA);;
background: #000;;
border-radius: 0px 5px 5px 0px;
}
......
src/store/modules/user.js
......@@ -33,7 +33,8 @@ const useUserStore = defineStore(
reLogin: {show:false,query:{}},
visitor: false,
language: 0,
activeName:"5"
activeName:"5",
weather: null,
}),
actions: {
// 登录
......@@ -167,7 +168,11 @@ const useUserStore = defineStore(
},
updataActiveName(v){
this.activeName=v
},
setWeather(obj){
this.weather=obj
}
}
})
......
src/viewsPc/about/culture_en.vue
......@@ -43,7 +43,7 @@
.bbtn{position: absolute;right: 5px;bottom: 0px;
color: #fff;border-radius: 50px;padding: 10px 20px;
font-size: 18px;cursor: pointer;
background: linear-gradient(-90deg, #8623FC, #453DEA); ;
background: #000; ;
&:hover{filter: brightness(1.6)}
}
}
......
src/viewsPc/about/wudao.vue
......@@ -111,8 +111,8 @@ const getDetail = (item,index)=>{
border-radius: 50%;right: -29px;border: 4px solid #fff;outline: 2px solid #898989;
box-sizing: content-box;top: 0;bottom: 0;margin: auto;}
li.active{color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);
&::after{outline: 2px solid #453DEA;background: #453DEA;}
background: #000;
&::after{outline: 2px solid #000;background: #000;}
}
}
.infoPart{
......
src/viewsPc/booking/car.vue
......@@ -38,12 +38,12 @@
<div class="plr20">
<div v-for="(r,index) in h.carVoList" :key="index" class="room">
<el-row :gutter="30" align="middle">
<el-col :span="4">
<el-col :lg="4">
<div class="roomImg">
<img :src="fillImgUrl(r.photos?.split(',')[0])">
</div>
</el-col>
<el-col :span="14">
<el-col :lg="14">
<h3 class="name flex">{{ r.carType }}
<div class="tagbox">
<span class="tag">{{ r.carColor }}</span>
......@@ -59,7 +59,7 @@
}}: {{ r.operStart }} ~ {{ r.operEnd }}</span>
</div>
</el-col>
<el-col :span="3">
<el-col :lg="3" :xs="12">
<div v-if="language==0" class="price">¥
<span
v-if="r.outPrice&&r.inPrice">{{ Number(r.inPrice) > Number(r.outPrice) ? r.outPrice : r.inPrice }}</span>
......@@ -76,7 +76,7 @@
</div>
</el-col>
<el-col :span="3">
<el-col :lg="3" :xs="12">
<el-button class="btn-lineG w100" round type="primary" @click="goOrder(h,r)">
{{ language == 0 ? '我要预订' : 'Select' }}
</el-button>
......@@ -349,5 +349,16 @@ function goOrder(item, car) {
}
}
}
@media screen and (max-width: 768px) {
.hotel{
.index{font-size: 14px;}
p{font-size: 16px}
.room{
.name{margin: 20px 0 0;}
.price{font-size: 16px;
span{font-size: 24px;}
}
}
}
}
</style>
......
src/viewsPc/booking/carOrder.vue
......@@ -3,13 +3,12 @@
<div class="box">
<el-card :body-style="{ padding: '0px' }" class="mt20">
<div slot="header">
<div class="bg-lineg uppercase">{{
language == 0 ? '车辆预约下单' : 'TRANSPORTATION RESERVATION order'
}}
<div class="bg-lineg uppercase">
{{language == 0 ? '车辆预约下单' : 'TRANSPORTATION RESERVATION order' }}
</div>
</div>
<el-row :gutter="20" class="pd20">
<el-col :span="14">
<el-col :lg="14">
<div class="border-info">
<div class="flex aic">
<h3 class="esp">{{ item.checkIn }}</h3>
......@@ -123,7 +122,7 @@
</el-form>
</div>
</el-col>
<el-col :span="10">
<el-col :lg="10">
<div class="leftboderTT">{{ language == 0 ? '订单明细' : 'Order details' }}</div>
<div class="border-rr mt20 pd20 ccitemBox">
<label v-show="form.useType.indexOf('0')>-1"> {{ language == 0 ? '接站车辆费' : 'Room fee' }}
......@@ -152,14 +151,14 @@
<el-card class="mt30">
<el-row align="middle" justify="space-between">
<el-col :span="12">
<el-col :lg="12">
<label>{{ language == 0 ? '共计金额' : 'Total' }}：
<span class=" text-warning"> {{ language == 0 ? '¥' : '€' }}<span class="bigMoney">{{
money
}}</span></span>
</label>
</el-col>
<el-col :span="12" class="text-right">
<el-col :lg="12" class="text-right">
<el-button :loading="payLoading" class="btn-lineG w200px" round type="primary" @click="submit">
{{ language == 0 ? '确认付款' : 'Pay' }}
</el-button>
......@@ -392,7 +391,7 @@ function pushFrom() {
span {
color: #FF8124;
font-family: DIN Alternate;
font-family: DIN Alternate, sans-serif;
font-size: 24px;
}
}
......@@ -434,7 +433,7 @@ function pushFrom() {
}
span {
border-radius: 13px;
border-radius: 13px;display: inline-block;
font-size: 12px;
padding: 4px 10px;
margin-right: 10px;
......@@ -461,4 +460,8 @@ function pushFrom() {
color: rgba(247, 64, 166, 1);
}
}
@media screen and (max-width: 768px) {
.leftboderTT{margin: 30px 0 15px;}
}
</style>
......
src/viewsPc/booking/component/makeUpCalendar.vue
......@@ -259,7 +259,7 @@ function goMatch(n) {
.primaryDate {
color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
}
.date {
......@@ -310,7 +310,7 @@ function goMatch(n) {
li::before {
content: '';
background: linear-gradient(0deg, #8623FC, #453DEA);
background: #000;
border-radius: 50%;
width: 8px;
height: 8px;
......@@ -334,7 +334,7 @@ function goMatch(n) {
//li:hover {
// color: #fff;
// background: linear-gradient(-90deg, #8623FC, #453DEA);
// background: #000;
//
// label {
// color: #fff;
......@@ -362,7 +362,7 @@ function goMatch(n) {
}
:deep(.el-calendar__header) {
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
height: 50px;
line-height: 50px;
}
......
src/viewsPc/booking/component/photoGraphyCalendar.vue
......@@ -239,7 +239,7 @@ function disabledDateRZ(date) {
.primaryDate {
color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
}
.date {
......@@ -290,7 +290,7 @@ function disabledDateRZ(date) {
li::before {
content: '';
background: linear-gradient(0deg, #8623FC, #453DEA);
background: #000;
border-radius: 50%;
width: 8px;
height: 8px;
......@@ -314,7 +314,7 @@ function disabledDateRZ(date) {
//li:hover {
// color: #fff;
// background: linear-gradient(-90deg, #8623FC, #453DEA);
// background: #000;
//
// label {
// color: #fff;
......@@ -344,7 +344,7 @@ function disabledDateRZ(date) {
}
:deep(.el-calendar__header) {
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
height: 50px;
line-height: 50px;
}
......
src/viewsPc/booking/foodOrder.vue
......@@ -7,7 +7,7 @@
</div>
<!-- {{room}}-->
<el-row class="pd20" :gutter="20">
<el-col :span="14">
<el-col :lg="14">
<div class="border-info">
<h3>{{ restaurant.name }}</h3>
<div class="room">
......@@ -59,7 +59,7 @@
</el-form>
</div>
</el-col>
<el-col :span="10">
<el-col :lg="10">
<div class="leftboderTT">{{ language == 0 ? '订单明细' : 'Order details' }}</div>
<div class="border-rr mt20 pd20 ccitemBox">
<label> {{food.name }}</label>
......@@ -78,12 +78,12 @@
<el-card class="mt30">
<el-row justify="space-between" align="middle">
<el-col :span="12">
<el-col :lg="12">
<label>{{ language == 0 ? '共计金额' : 'Total' }}：
<span class=" text-warning"> {{ language == 0 ? '¥' : '€' }}<span class="bigMoney">{{ form.total }}</span></span>
</label>
</el-col>
<el-col :span="12" class="text-right">
<el-col :lg="12" class="text-right">
<el-button type="primary" size="large" class="btn-lineG w200px" @click="submit" round>{{ language == 0 ?'确认付款':'Pay' }}</el-button>
</el-col>
</el-row>
......@@ -338,4 +338,8 @@ function submit() {
color: #FF8124;
}
.tip{font-size: 14px;color: #666;padding: 0 10px;}
@media screen and (max-width: 768px) {
.leftboderTT{margin: 30px 0 15px;}
}
</style>
......
src/viewsPc/booking/hotel.vue
......@@ -19,12 +19,12 @@
<el-card @click="goDetail(h)">
<!-- 酒店列表-->
<el-row class="hotel" align="middle" :gutter="20">
<el-col :span="6">
<el-col :lg="6" :md="6">
<div class="imgbox">
<img class="w100" :src="fillImgUrl(h.photos?.split(',')[0])"/>
</div>
</el-col>
<el-col :span="12">
<el-col :lg="12" :md="12">
<h3 class="esp">{{h.name}}</h3>
<div class="starBox">
<img v-for="i in Number(h.starLevel||0)" src="@/assets/booking/star.png">
......@@ -38,11 +38,11 @@
{{h.address}}
</p>
</el-col>
<el-col :span="4" class="text-right">
<el-col :lg="4" :md="4" class="text-right">
<div class="price">{{ language==0?'¥':'€' }}<span>{{ h.price }}</span>
<i v-if="language==0">起</i>
</div>
<el-button class="btn-lineG w200px" round type="primary" >{{ language==0?'立即预订':'Select' }} ⇀</el-button>
<el-button class="w200px blackBtn" round type="primary" >{{ language==0?'立即预订':'Select' }} ⇀</el-button>
</el-col>
</el-row>
</el-card>
......@@ -116,6 +116,7 @@
span{font-size: 36px;margin: 0 8px;font-family: 'DINAlternate-Bold';font-weight: 600;}
i{font-style: normal;color: #929AA0;}
}
.blackBtn{background: #000;border: #000;}
}
.banner{height: 140px;background-size: cover;text-align: center;
background: url("@/assets/booking/jd_bg.png") center;display: flex;align-items: center;
......@@ -145,4 +146,7 @@
span:nth-child(4n+2){background: rgba(0, 160, 233, 0.2);color: rgba(0, 160, 233, 1);}
span:nth-child(4n+3){background: rgba(247, 64, 166, 0.2);color:rgba(247, 64, 166, 1);}
}
@media screen and (max-width: 768px) {
.hotel h3{margin: 20px 0 10px; font-size: 18px;}
}
</style>
......
src/viewsPc/booking/hotelDetail.vue
......@@ -6,7 +6,7 @@
<!-- <el-col :span="6">-->
<!-- <img class="w100" :src="fillImgUrl(form.photos?.split(',')[0])"/>-->
<!-- </el-col>-->
<el-col :span="language == 0?16:24">
<el-col :lg="language == 0?16:24">
<h3 class="esp flex">{{ form?.name }}
<div class="starBox ml20">
<img v-for="i in Number(form?.starLevel||0)" src="@/assets/booking/star.png">
......@@ -34,7 +34,7 @@
<div :class="showAll?'':'esp_2'" @click="showAll=!showAll" v-html="form.introduction.toString()"></div>
</div>
</el-col>
<el-col :span="8" class="text-right" v-if="language == 0">
<el-col :lg="8" class="text-right" v-if="language == 0">
<div class="mapBox" @click="goMap">
<div id="map"></div>
</div>
......@@ -45,15 +45,15 @@
<div class="mt30">
<el-row :gutter="20">
<el-col :span="10">
<el-col :lg="10">
<div class="imgbox hotelImg">
<el-image :src="fillImgUrl(form?.photos?.split(',')[0])" fit="cover"
:preview-src-list="form?.photos?.split(',')"/>
</div>
</el-col>
<el-col :span="14">
<el-col :lg="14">
<el-row class="h100" :gutter="20">
<el-col :span="8" class="oddmb" v-for="(p,index) in form?.photos?.split(',').slice(1,7)">
<el-col :lg="8" class="oddmb" v-for="(p,index) in form?.photos?.split(',').slice(1,7)">
<div class="imgbox hotelImg">
<el-image :src="fillImgUrl(p)" fit="cover"/>
</div>
......@@ -68,7 +68,7 @@
<ul>
<li>
{{ language == 0 ? '房型选择' : 'Available Rooms' }}
<span style="margin-left: 100px" @click="initTime">
<span style="margin-left: 50px" @click="initTime">
<el-date-picker
@change="getDaysBetween"
v-model="hotTime"
......@@ -87,12 +87,12 @@
<div v-for="(r,index) in roomList" :key="index" class="room"
v-show="language==0?r.roomPrice>0:r.roomPriceEn>0">
<el-row :gutter="30" align="middle">
<el-col :span="4">
<el-col :lg="4">
<div class="roomImg">
<img :src="fillImgUrl(r.photo?.split(',')[0])">
</div>
</el-col>
<el-col :span="14">
<el-col :lg="14">
<h3 class="name">{{ r.roomType }}</h3>
<el-row :gutter="10">
<el-col :span="8">{{ r.area }}m²</el-col>
......@@ -111,12 +111,12 @@
<a v-show="r.label?.split('，').length>4">{{ language==0?'更多':'MORE' }} ></a>
</div>
</el-col>
<el-col :span="3">
<el-col :lg="3" :md="12" :sm="12" :xs="12">
<div class="price">{{
language == 0 ? '¥' : '€'
}}<span>{{ language == 0 ? r.roomPrice : r.roomPriceEn }}</span></div>
</el-col>
<el-col :span="3">
<el-col :lg="3" :md="12" :sm="12" :xs="12">
<!-- :disabled="!r.useCount && !hotTime"-->
<el-button v-if="language==0" :class="{'forbid':!(!hotTime[0] || r.useCount>0)}"
@click="goOrder(r)" class="bg-lineg button">
......@@ -410,7 +410,7 @@ function goMap() {
}
}
.bg-lineg {
.bg-lineg {background: linear-gradient(90deg, #1B69F8, #0540EC);
margin: auto;
border-radius: 10px;
text-align: center;
......@@ -572,4 +572,8 @@ function goMap() {
.forbid:hover {
box-shadow: none;
}
@media screen and (max-width: 768px) {
.roomImg{margin: 0 0 20px;}
}
</style>
......
src/viewsPc/booking/hotelOrder.vue
<template>
<div>
<div class="box">
<el-card :body-style="{ padding: '0px' }" class="mt20">
<el-card :body-style="{ padding: '0px' }" class="mt20 mb30">
<div slot="header">
<div class="bg-lineg">{{ language == 0 ? '酒店预约下单' : 'Hotel booking order' }}</div>
</div>
<!-- {{room}}-->
<el-row class="pd20" :gutter="20">
<el-col :span="14">
<el-col :lg="14">
<div class="border-info">
<h3>{{ hotelName }}</h3>
<div class="roomType">{{ room.roomType }}</div>
......@@ -88,7 +88,7 @@
</el-form>
</div>
</el-col>
<el-col :span="10">
<el-col :lg="10">
<div class="leftboderTT">{{ language == 0 ? '订单明细' : 'Order details' }}</div>
<div class="border-rr mt20 pd20 ccitemBox">
<label> {{ language == 0 ? '房费' : 'Room fee' }}
......@@ -127,7 +127,7 @@
</el-row>
</el-card>
<el-card class="mt30">
<el-card class="mt30 mb30">
<el-row justify="space-between" align="middle">
<el-col :span="12">
<label>{{ language == 0 ? '共计金额' : 'Total' }}：
......@@ -508,7 +508,7 @@ function submit() {
.leftboderTT {
font-weight: 600;
font-size: 16px;
color: #453DEA;
color: var(--el-color-primary);
}
.border-rr {
......@@ -559,4 +559,8 @@ function submit() {
color: #FF8124;
}
.tip{font-size: 14px;color: #666;padding: 0 10px;}
@media screen and (max-width: 768px) {
.leftboderTT{margin: 30px 0 15px;}
}
</style>
......
src/viewsPc/center/index.vue
......@@ -454,7 +454,7 @@ li img {
.active {
color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
border-radius: 20px;
}
@media (max-width: 500px) {
......
src/viewsPc/center/myCertification.vue
......@@ -153,7 +153,7 @@ fieldset {
}
&.is-active {
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
.el-radio-button__inner {
color: #fff;
......
src/viewsPc/components/homeCalendar.vue
......@@ -99,7 +99,7 @@ function goMatch(n) {
.primaryDate {
color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
}
.date {
......@@ -129,7 +129,7 @@ function goMatch(n) {
font-size: 15px;
label {
color: #453DEA;
color: #000;
margin-right: 15px;
&::before {
......@@ -150,7 +150,7 @@ function goMatch(n) {
li::before {
content: '';
background: linear-gradient(0deg, #8623FC, #453DEA);
background: #000;
border-radius: 50%;
width: 8px;
height: 8px;
......@@ -174,7 +174,7 @@ function goMatch(n) {
li:hover {
color: #fff;
background: linear-gradient(-90deg, #8623FC, #453DEA);
background: #000;
label {
color: #fff;
......
src/viewsPc/components/homeQuick.vue
<template>
<div class="itemBox" v-if="language == 0">
<el-row :gutter="20">
<el-col :sm="12" :lg="8" :xs="12">
<div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn01.png">酒店预订</div>
<div class="itemBox" v-if="language === 0">
<el-row :gutter="0" justify="space-around">
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="building"><img src="@/assets/dance/btn01.png">签证服务</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item" @click="popRemark(2)"><img src="@/assets/dance/btn02.png">车辆预订</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn02.png">酒店预订</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item" @click="popRemark(3)"><img src="@/assets/dance/btn03.png">餐饮预订</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="popRemark(2)"><img src="@/assets/dance/btn03.png">接送服务</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item" @click="popRemark(0)"><img src="@/assets/dance/btn04.png">票务预订</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="goAbout"><img src="@/assets/dance/btn04.png">场馆介绍</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item" @click="popRemark(4)"><img src="@/assets/dance/btn05.png">化妆预约</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item" @click="popRemark(5)"><img src="@/assets/dance/btn06.png">拍照预约</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="liveClick"><img src="@/assets/dance/btn05.png">赛事直播</div>
</el-col>
</el-row>
</div>
<div class="itemBox_en" v-else>
<el-row :gutter="20">
<el-col :sm="12" :lg="8" :xs="12">
<div class="item_en" @click="popRemark(1)"><img src="@/assets/dance/btn01.png">
<p>HOTEL RESERVATION</p>
</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item_en" @click="popRemark(2)"><img src="@/assets/dance/btn02.png">
<p>TRANSPORTATION RESERVATION</p>
</div>
<el-row :gutter="20" justify="space-around">
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="building"><img src="@/assets/dance/btn01.png">Visa Services</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item_en" @click="popRemark(3)"><img src="@/assets/dance/btn03.png">
<p>DINING RESERVATION</p>
</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn02.png">HOTEL RESERVATION</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item_en" @click="popRemark(0)">
<img src="@/assets/dance/btn04.png">
<p>TICKET BOOKING</p>
</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="popRemark(2)"><img src="@/assets/dance/btn03.png">TRANSPORTATION RESERVATION</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item_en" @click="popRemark(4)"><img src="@/assets/dance/btn05.png">
<p>MAKEUP APPOINTMENT</p>
</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="goAbout"><img src="@/assets/dance/btn04.png">Venue Introduction</div>
</el-col>
<el-col :sm="12" :lg="8" :xs="12">
<div class="item_en" @click="popRemark(5)"><img src="@/assets/dance/btn06.png">
<p>PHOTOGRAPHY APPOINTMENT</p>
</div>
<el-col :sm="12" :lg="4" :xs="12">
<div class="item" @click="liveClick"><img src="@/assets/dance/btn05.png">live streaming</div>
</el-col>
</el-row>
</div>
......@@ -72,6 +53,7 @@ import {ElMessage} from "element-plus";
import {getCurrentInstance} from "@vue/runtime-core";
import {computed, onMounted, watch} from "vue";
import {getBaseInfoByActiveId} from "@/apiPc/booking";
import * as match from "@/apiPc/match";
const props = defineProps({
matchId: {
......@@ -87,6 +69,7 @@ const props = defineProps({
})
const language = useStorage('language', 0)
const form = ref({})
const liveData = ref({})
const matchId = computed(() => props.matchId);
watch(matchId, (val) => {
......@@ -97,9 +80,30 @@ watch(matchId, (val) => {
console.log(err)
form.value = null
})
match.getInfoByCptId({ cptId:props.matchId }).then((res) => {
liveData.value = res.data || {}
})
}
})
const liveClick = () => {
if (liveData.value.videoStatus=="1") {
if(language.value==0){
window.open(liveData.value.videoUrlCn)
} else {
window.open(liveData.value.videoUrlEn)
}
} else {
ElMessage.warning(language.value == 0 ? '暂无直播' : 'No live')
}
}
const goAbout = () => {
router.push({path: `/about/wuDao`})
}
onMounted(() => {
})
......@@ -168,61 +172,37 @@ function goBooking(n) {
</script>
<style scoped lang="scss">
.itemBox {
padding: 20px 40px;
.itemBox,.itemBox_en {
padding: 20px 0;background: #fff;box-shadow: 0 0 46px 0 rgba(1,16,64,0.08);
border-radius: 20px;margin-bottom: 22px;
}
.itemBox_en {
padding: 20px 40px;
p {
margin: 0;
height: 40px;
line-height: 20px;
display: flex;
align-items: center;
}
}
.item {
box-shadow: 0px 0px 21px 0px rgba(41, 23, 101, 0.14);
margin: 10px 0;
display: flex;
align-items: center;
font-size: 22px;
font-size: 20px;
background: url("@/assets/dance/btn_bg.png") no-repeat left #FFFFFF;
background-size: 100% 100%;
border-radius: 15px;
img {
margin: 0 5%;
margin: 0 5%;width: 75px;
}
}
.item_en {
box-shadow: 0px 0px 21px 0px rgba(41, 23, 101, 0.14);
margin: 40px 0 0;
cursor: pointer;
display: flex;
align-items: center;
text-align: center;
color: #333;
font-size: 18px;
flex-direction: column;
padding: 35px 10px 20px;
background: url("@/assets/dance/znbb.png") no-repeat left #FFFFFF;
background-size: cover;
position: relative;
border-radius: 15px;
.itemBox_en{}
.itemBox_en .item {
flex-direction: column;text-align: center;text-transform: uppercase;
height: 100%;
img {
position: absolute;
top: -30px;
position: relative;
transition: all 0.2s;
}
&:hover {
box-shadow: 0 0 10px #333;
box-shadow: 0 0 10px #eee;
img {
transform: rotateY(180deg);
......
src/viewsPc/components/homeWeatherBar.vue 0 → 100644
<template>
<div class="box weatherLine">
<el-row :gutter="20" align="middle" style="height: 100%;">
<el-col :sm="24" :lg="10">
<!--天气-->
<div class="leftFlex">
<div class="smallToday">
<div class="type">
<weather-icon :type="weatherObj.forecast[0]?.type" :width="50"/>
</div>
<div class="wd_p">
<!-- {{ weatherObj.forecast[0]?.low.slice(2) }}~-->
{{ weatherObj.forecast[0]?.high.slice(2) }}
</div>
</div>
<div>{{ language ==0?'无锡':'Wuxi' }}</div>
<div>{{dayjs().month()<9?'0':''}}{{dayjs().month()+1}} / {{dayjs().date()}}</div>
<div v-if="language ==0">{{week[dayjs().day()]}}</div>
<div v-else>{{weekEn[dayjs().day()]}}</div>
<div class="forPc">{{dayjs().hour()<10?'0':''}}{{dayjs().hour()}}:{{dayjs().minute()<10?'0':''}}{{dayjs().minute()}}</div>
</div>
</el-col>
<el-col :sm="24" :lg="14">
<el-button round class="searchfw">
<el-icon class="mr20">
<Search/>
</el-icon>
服务查询
</el-button>
</el-col>
</el-row>
</div>
</template>
<script setup>
import {onMounted, ref} from "vue"
import useUserStore from '@/store/modules/user'
import WeatherIcon from '@/viewsPc/components/weatherIcon'
import {getWeather} from "@/apiPc/webSite"
import dayjs from "dayjs"
const language = useUserStore().language
const weatherObj = ref({
forecast:[]
})
const week = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六']
const weekEn = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday']
onMounted(()=>{
if(useUserStore().weather == null){
init()
}
})
function init(){
getWeather().then(res=>{
weatherObj.value = JSON.parse(res.data).data
useUserStore().setWeather(weatherObj.value)
})
}
</script>
<style scoped lang="scss">
.weatherLine {padding: 12px;
background: linear-gradient(90deg, #0557EC, #0540EC, #013499);
border-radius: 45px;
color: #fff;
}
.leftFlex{display: flex;align-items: center;justify-content: space-between;
> div{background: url("@/assets/dance/line.png") no-repeat right;width: 20%;
justify-content: center;
min-height: 56px;
display: flex;
align-items: center;}
.smallToday{
width: 30%;
.wd_p{font-size: 18px;}
}
}
.smallToday{display: flex;align-items: center;
.type{margin-right: 10px;}
h3{margin: 0 0 10px;}
}
.searchfw{width: 100%;height:65px;border-radius: 100px;font-size: 24px;}
@media screen and (max-width: 768px) {
.forPc{display: none;}
.weatherLine{border-radius: 15px}
.leftFlex {margin-bottom: 15px;
.smallToday{width: 40%;
}
}
.leftFlex > div{font-size: 12px; width: 15%;}
.searchfw{font-size: 18px;height: 40px;}
}
</style>
src/viewsPc/components/querybackNumber.vue
......@@ -175,7 +175,7 @@ function showDetail(name) {
cursor: pointer;border: 1px solid #e1e1e1;border-radius: 4px;
width: 350px;text-align: center;line-height: 130px;
padding: 1px; font-size: 30px;color: #fff;
margin: 20px auto;background:linear-gradient(90deg, #8623FC, #453DEA);
margin: 20px auto;background:#000;
&:hover{
background:linear-gradient(90deg, #453DEA, #8623FC);
box-shadow: 0 4px 10px #453DEA;border: none;
......
src/viewsPc/components/schSearch.vue
......@@ -236,7 +236,7 @@ function showDetail(name) {
cursor: pointer;border: 1px solid #e1e1e1;border-radius: 4px;
width: 350px;text-align: center;line-height: 130px;
padding: 1px; font-size: 30px;color: #fff;
margin: 20px auto;background:linear-gradient(90deg, #8623FC, #453DEA);
margin: 20px auto;background:#000;
&:hover{
background:linear-gradient(90deg, #453DEA, #8623FC);
box-shadow: 0 4px 10px #453DEA;border: none;
......
src/viewsPc/home.vue
......@@ -61,9 +61,6 @@
</div>
</el-dialog>
</div>
<div class="poCode">
<el-image :preview-src-list="['/img/code.jpg']" hide-on-click-modal="true" style="width: 120px;height: 120px;" src="/img/code.jpg"/>
</div>
<dialog-master-class ref="masterClassRef"/>
<pick-up ref="pickupRef"></pick-up>
<back-number ref="backNumberRef"></back-number>
......
src/viewsPc/index.vue
<template>
<div>
<div class="banner">
<el-carousel class="forPc" autoplay :interval="2000" height="450px" :autoplay="false" arrow="hover" @change="carouselChange">
<el-carousel class="forPc" autoplay :interval="2000" height="450px" :autoplay="false" arrow="hover"
@change="carouselChange">
<el-carousel-item style="height: 450px;" v-for="n in maList" :key="n.id">
<div class="bannerItem">
<div class="h100" @click.stop="goMatch(n)">
<img v-if="n.bgImgUrl" class="bannerImg" :src="fillImgUrl(n.bgImgUrl)">
<img v-else class="bannerImg" src="@/assets/dance/banner.png">
<div class="box forPc" style="position: absolute;top: 0;left: 0;right: 0;margin: auto;">
<div class="banner-count" v-if="n.time>0" @click="goMatch(n)">
距离开始还有
<van-count-down :time="n.time" format="DD 天 HH 时 mm 分 ss 秒">
<div v-if="!liveData || liveData.videoStatus==0">
<!-- <div class="banner-count bb"></div>-->
</div>
<div class="banner-count" v-if="currentDateTime < liveData.videoStart" @click="goliveUrl">
距离直播开始
<van-count-down :time="liveStartTime" format="DD 天 HH 时 mm 分 ss 秒">
<template #default="timeData">
<div class="block">{{ timeData.days }}
<span class="colon">天</span>
......@@ -30,14 +34,16 @@
</template>
</van-count-down>
</div>
<div v-if="n.timeEnd<0">
<div class="banner-count bb" @click="goMatch(n)">
报名已结束
</div>
<!--如果有直播-->
<div v-if="liveData&& liveData.videoStatus==1" @click.stop="goliveUrl">
<div class="banner-count bb" v-if="(currentDateTime>liveData.videoStart)&&(currentDateTime<liveData.videoEnd)">直播进行中</div>
<div class="banner-count bb" v-if="currentDateTime > liveData.videoEnd">直播已结束</div>
<!-- <div class="banner-count bb" v-if="currentDateTime < liveData.videoStart">直播即将开始</div>-->
</div>
<div class="banner-count bb" v-if="n.time<=0 && n.timeEnd>=0" @click="goMatch(n)">
开始报名
<div v-if="liveData&& liveData.picStatus==1" @click.stop="gopicliveUrl">
<div class="picliveBtn" v-if="(currentDateTime>liveData.picStart)&&(currentDateTime<liveData.picEnd)">图片直播中</div>
<div class="picliveBtn" v-if="currentDateTime > liveData.picEnd">图片直播</div>
<div class="picliveBtn" v-if="currentDateTime < liveData.picStart">图片直播</div>
</div>
</div>
</div>
......@@ -51,9 +57,9 @@
<img v-if="n.bgImgUrl" class="bannerImg" :src="fillImgUrl(n.bgImgUrl)">
<img v-else class="bannerImg" src="@/assets/dance/banner.png">
<div style="position: absolute;left: 0;right: 0;bottom: 0;margin: auto;">
<div class="banner-count" v-if="n.time>0" @click="goMatch(n)">
距离开始还有
<van-count-down :time="n.time" format="DD 天 HH 时 mm 分 ss 秒">
<div class="banner-count" v-if="currentDateTime < liveData.videoStart" @click="goliveUrl">
距离直播开始
<van-count-down :time="liveStartTime" format="DD 天 HH 时 mm 分 ss 秒">
<template #default="timeData">
<div class="block">{{ timeData.days }}
<span class="colon">天</span>
......@@ -73,38 +79,9 @@
</template>
</van-count-down>
</div>
<div v-if="n.timeEnd<0">
<!-- <a target="_blank" href="https://wx.vzan.com/live/page/1151815649?v=1720589464698" class="banner-count" v-if="time>0&&n.id=='1778253367748993026'" @click="goMatch(n)">-->
<!-- <van-count-down :time="time" format="DD 天 HH 时 mm 分 ss 秒">-->
<!-- <template #default="timeData">-->
<!-- <div class="block">{{ timeData.days }}-->
<!-- <span class="colon">天</span>-->
<!-- </div>-->
<!-- ：-->
<!-- <div class="block">{{ timeData.hours }}-->
<!-- <span class="colon">时</span>-->
<!-- </div>-->
<!-- ：-->
<!-- <div class="block">{{ timeData.minutes }}-->
<!-- <span class="colon">分</span>-->
<!-- </div>-->
<!-- ：-->
<!-- <div class="block">{{ timeData.seconds }}-->
<!-- <span class="colon">秒</span>-->
<!-- </div>-->
<!-- </template>-->
<!-- </van-count-down>-->
<!-- 开始直播-->
<!-- </a>-->
<!-- <a target="_blank" href="https://wx.vzan.com/live/page/1151815649?v=1720589464698" class="banner-count bb" v-else-if="time<=0&&n.id=='1778253367748993026'" @click="goMatch(n)">-->
<!-- 直播进行中-->
<!-- </a>-->
<div class="banner-count bb" @click="goMatch(n)">
报名已结束
</div>
</div>
<div class="banner-count bb" v-if="n.time<=0 && n.timeEnd>=0" @click="goMatch(n)">
开始报名
<div v-if="liveData&& liveData.videoStatus==1" @click.stop="goliveUrl">
<div class="banner-count" v-if="(currentDateTime>liveData.videoStart)&&(currentDateTime<liveData.videoEnd)">直播进行中</div>
<div class="banner-count" v-if="currentDateTime > liveData.videoEnd">直播已结束</div>
</div>
</div>
</div>
......@@ -113,101 +90,37 @@
</el-carousel>
</div>
<div class="box zn-bg">
<div class="zn-Box">
<img class="bbbg" v-if="matchData?.logoUrl" :src="fillImgUrl(matchData.logoUrl)"/>
<el-row style="align-items: center">
<el-col :sm="24" :lg="10">
<div class="bgbg">
<h1 style="color: #fff">{{matchData?.name}}</h1>
<a class="zn-btn" @click="goGuide" target="_blank" >参赛指南
<el-icon>
<download/>
</el-icon>
</a>
<!-- <a class="zn-btn ml20 btn-q forPc" v-show="matchData?.id=='1778253367748993026'" @click="popMaster">青少年公益课报名</a>-->
<a class="zn-btn ml20 btn-q" v-show="matchData?.id=='1778253367748993026'" @click="backNumberSearch">背号查询</a>
<a class="zn-btn ml20 btn-q" v-show="matchData?.id=='1778253367748993026'" @click="schSearch">日程查询</a>
</div>
</el-col>
<el-col :sm="24" :lg="14">
<HomeQuick :match-id="matchData?.id" :cpt-name="matchData?.name"/>
</el-col>
</el-row>
</div>
<div class="box">
<HomeQuick :match-id="matchData?.id" :cpt-name="matchData?.name"/>
</div>
<home-weather-bar/>
<div id="part0" class="box part">
<el-row :gutter="20">
<el-col :sm="24" :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">赛事日程</h3>
<a class="more" href="#/saiC">MORE</a>
<h3 class="leftboderTT">通知公告</h3>
<a class="more" href="#/notice">MORE</a>
</div>
<!--赛事日历-->
<el-card :body-style="{'padding':'20px 20px'}">
<home-calendar/>
<el-card :body-style="{'padding':'10px 20px 18px'}">
<div v-for="(n,index) in newsList" :key="index" class="newline" @click="goDetail(n)">
<h3>{{ n.name }}</h3>
<span class="date">{{n.belongTime}}</span>
</div>
</el-card>
</el-col>
<el-col :sm="24" :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">奖牌榜（2023）</h3>
<h3 class="leftboderTT">赛事日程</h3>
<a class="more" href="#/saiC">MORE</a>
</div>
<!--历史排名-->
<el-card :body-style="{'padding':'10px 20px 18px'}">
<el-table stripe :data="rankList">
<el-table-column label="名次" align="center" width="50" 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>
<span v-else-if="scope.row.index == 3" style="color:#7F2D00">{{ scope.row.index }}</span>
<span v-else>{{ scope.row.index }}</span>
</template>
</el-table-column>
<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 label="组合" align="center">
<template #default="scope">
<div class="text-primary esp">{{ scope.row.name }}</div>
</template>
</el-table-column>
<el-table-column width="60">
<template #header>
<img class="mauto" src="@/assets/dance/1.png">
</template>
<template #default="scope">
<div class="text-warning text-center">{{ scope.row.jin }}</div>
</template>
</el-table-column>
<el-table-column width="60">
<template #header>
<img class="mauto" src="@/assets/dance/2.png">
</template>
<template #default="scope">
<div class="text-blue text-center">{{ scope.row.yin }}</div>
</template>
</el-table-column>
<el-table-column width="60">
<template #header>
<img class="mauto" src="@/assets/dance/3.png">
</template>
<template #default="scope">
<div class="text-primary text-center">{{ scope.row.tong }}</div>
</template>
</el-table-column>
</el-table>
<!--赛事日历-->
<el-card :body-style="{'padding':'18px 20px 20px'}">
<home-calendar/>
</el-card>
</el-col>
</el-row>
</div>
<!-- 新闻 -->
......@@ -230,13 +143,13 @@
</div>
<div class="info">
<div class="date">
{{ n.sortName }} ｜ {{n.belongTime}}
{{ n.sortName }} ｜ {{ n.belongTime }}
</div>
<h3 class="esp">{{ n.name }}</h3>
<p class="esp_2" style="height: 40px">
{{n.subName}}
{{ n.subName }}
</p>
<a>查看详情</a>
<a>查看详情</a>
</div>
</div>
</el-col>
......@@ -272,16 +185,16 @@
</van-count-down>
</div>
<i class="ii" v-else-if="etime>0&&time<=0">直播中</i>
<!-- <i class="livetimecount" v-if="etime<=0">直播已结束</i>-->
<!-- <i class="livetimecount" v-if="etime<=0">直播已结束</i>-->
<div class="imgBox">
<img v-if="time>0" src="/img/111.jpeg"/>
<img v-if="time>0" src="/img/111.jpeg"/>
<img v-else :src="fillImgUrl_webSite(livelist[0]?.picUrl)">
</div>
<h3 class="esp" v-if="time>0">
2024WDSF亚洲体育舞蹈节
世锦赛
</h3>
<h3 class="esp" v-else>
{{livelist[0]?.name }}
{{ livelist[0]?.name }}
</h3>
</a>
</el-col>
......@@ -304,41 +217,25 @@
</el-col>
</el-row>
<el-row class="news-l-r">
<el-col v-for="(n,index) in livelist" :lg="8" v-show="index>0">
<el-col v-for="(n,index) in livelist" :lg="8" v-show="index>0">
<div class="item" style="padding: 0;margin: 20px 0 0" @click="goDetail(n)">
<div class="imgbox">
<i class="playIcon"></i>
<img :src="fillImgUrl_webSite(n.picUrl)"></div>
<div class="info">
<div class="text-primary small-size">
<span v-if="n.subName">{{n.subName + ' | '}}</span>
{{ n.belongTime }}</div>
<div class="small-size text-gray">
<span v-if="n.subName">{{ n.subName + ' | ' }}</span>
{{ n.belongTime }}
</div>
<h2 class="esp_2">{{ n.name }}</h2>
</div>
</div>
</el-col>
</el-row>
</el-card>
</div>
</div>
<div hidden>
<div class="box">
<div class="indexTitle">
<h3 class="leftboderTT">评委介绍</h3>
</div>
<el-row :gutter="20">
<el-col :sm="12" :xl="4" :xs="12" :lg="4" :md="8" v-for="n in personList" :key="n.name">
<div class="teacher" @click="goLeaderInfo">
<div class="imgbox"><img :src="n.src"></div>
<h3 class="esp">{{ n.name }}</h3>
<p class="esp text-primary">{{ n.pp }}</p>
</div>
</el-col>
</el-row>
</div>
</div>
<div class="box">
<el-row :gutter="20">
<el-col :lg="12">
......@@ -349,9 +246,6 @@
<div class="aboutBox">
<div class="content">
<div v-html="aboutUsContent"></div>
<!-- 无锡WDSF亚洲体育舞蹈节是由世界体育舞蹈（无锡）中心（世界体育舞蹈联合、亚洲体育舞蹈联合、中国体育舞蹈联合会和无锡市人民政府共建）打造面向全球的、长期落户的、城市自主的品牌赛事。-->
<!-- 2023年7月首次举办无锡2023年WDSF亚洲体育舞蹈节，包括2023年WDSF世界标准舞锦标赛、2023年WDSF世界体育舞蹈大奖赛（中国无锡）、2023年全国体育舞蹈公开系列赛（无锡站），共吸引来自全球39个国家及地区的1,716名顶级舞者参与。-->
<!-- 同时，并将世界体育舞蹈（无锡）中心成功落户中国无锡，以“节日有竞赛、竞赛节日化”为发展指导原则，“四方”共同努力服务全球舞者。 <div class="shadowbox"/>-->
</div>
<div class="mt30 text-center">
<a class="btn-lineG" href="#/about/wuDao" style="display: inline-flex;align-items: center;">了解更多<img
......@@ -390,7 +284,7 @@
<h3 class="leftboderTT">合作伙伴</h3>
</div>
<el-row :gutter="20">
<el-col :lg="6" :sm="6" :xs="6" v-for="p in partners">
<el-col :lg="6" :sm="6" :xs="12" v-for="p in partners">
<div class="logobox">
<img :src="fillImgUrl(JSON.parse(p.picUrl))">
</div>
......@@ -411,9 +305,11 @@ import _ from 'lodash'
import {Swiper, SwiperSlide} from 'swiper/vue'
import {Autoplay, Navigation} from 'swiper'
import 'swiper/css'
import {dayjs} from 'element-plus'
import {dayjs, ElMessage} from 'element-plus'
import * as match from "@/apiPc/match";
import {getAboutUs, getppInfo, getZNList} from "@/apiPc/match";
import {getAboutUs, getInfoByCptId, getppInfo, getZNList} from "@/apiPc/match";
import HomeWeatherBar from "@/viewsPc/components/homeWeatherBar";
const modules = [Autoplay, Navigation]
const navigationPic = ref({
nextEl: '.picnext',
......@@ -421,17 +317,11 @@ const navigationPic = ref({
})
const router = useRouter()
const {proxy} = getCurrentInstance()
const emit = defineEmits(['pop','pickup','backNumber','schSearch'])
const emit = defineEmits(['pop', 'pickup', 'backNumber', 'schSearch'])
const currentDateTime = dayjs().format('YYYY-MM-DD HH:mm:ss')
const time = ref(0)
const etime = ref(0)
const personList = ref([
{ name: 'Wolfgang Eliasch', pp: '拉丁舞裁判长 奥地利', src: '/img/1.png' },
{ name: 'Nenad Jeftic', pp: '标准舞裁判长 塞尔维亚', src: '/img/2.png' },
{ name: 'Dorel Bagiu', pp: '罗马尼亚', src: '/img/3.png' },
{ name: 'Eduard Korotin', pp: ' 爱沙尼亚', src: '/img/4.png' },
{ name: 'Ana Cristina Silva', pp: '葡萄牙', src: '/img/5.png'},
{ name: 'Dallas Leslie Williams', pp: '记分长 澳大利亚', src: '/img/6.png' }
])
const newsList = ref([])
const activeNews = ref(0)
const banners = ref([])
const newest = ref([])
......@@ -446,7 +336,9 @@ const maList = ref([])
const loading = ref(false)
const picList = ref([])
const partners = ref([])
const liveData = ref({})
const aboutUsContent = ref('')
const liveStartTime = ref(0)
onMounted(() => {
init()
......@@ -457,7 +349,7 @@ const init = () => {
time.value = dayjs('2024-07-17 07:00:00').diff(today, 'millisecond')
etime.value = dayjs('2024-07-22 12:00:00').diff(today, 'millisecond')
getNewsListById({
pageSize: time.value>0? 3:4,
pageSize: time.value > 0 ? 3 : 4,
pageNum: 1,
sortId: '10000006'
}
......@@ -481,35 +373,50 @@ const init = () => {
).then(res => {
newest2.value = res.rows
})
match.getMaList({topFlag:1}).then((res) => {
getNewsListById({pageSize: 6, pageNum: 1,sortId: '20000000'}).then(res => {
newsList.value = res.rows
})
match.getMaList({topFlag: 1}).then((res) => {
maList.value = res.rows
for (let n of maList.value) {
var today = dayjs().format('YYYY-MM-DD HH:mm:ss')
if(n.signBeginTime){
if (n.signBeginTime) {
n.time = dayjs(n.signBeginTime).diff(today, 'millisecond')
} else {
n.time = 0
}
if(n.signEndTime){
if (n.signEndTime) {
n.timeEnd = dayjs(n.signEndTime).diff(today, 'millisecond')
} else {
n.time = 0
}
}
matchData.value = maList.value[0]
getMatchInfo(matchData.value.id)
})
getpartners()
}
const getMatchInfo = (id) => {
match.getInfoByCptId({ cptId:id }).then((res) => {
liveData.value = res.data || {}
if(liveData.value.videoStart){
liveStartTime.value = dayjs(liveData.value.videoStart).diff(currentDateTime.value, 'millisecond')
}
})
}
const getpartners = () => {
match.getppInfo('10000001').then((res) => {
aboutUsContent.value = res.data.contextZh
aboutUsContent.value = res.data.contextZh
})
match.getZNList({sortId:'2000',language:1}).then((res) => {
match.getZNList({sortId: '2000', language: 1}).then((res) => {
partners.value = res.rows
})
}
const carouselChange = (e) => {
matchData.value = maList.value[e]
getMatchInfo(matchData.value.id)
}
const goDetail = (n) => {
if (n.isOut === '1') {
......@@ -521,7 +428,7 @@ const goDetail = (n) => {
}
}
const golive = (n) => {
if(time.value>0){
if (time.value > 0) {
window.open('https://wx.vzan.com/live/page/1151815649?v=1720589464698')
} else {
router.push({
......@@ -556,56 +463,60 @@ const goGuide = () => {
router.push({
name: 'guide',
query: {
index:8
index: 8
}
})
}
const popMaster = () => {
var params = {
cptId:matchData.value.id
cptId: matchData.value.id
}
emit('pop',params)
emit('pop', params)
}
const backNumberSearch = () => {
var params = {
cptId:matchData.value.id
cptId: matchData.value.id
}
emit('backNumber',params)
emit('backNumber', params)
}
const schSearch = () => {
var params = {
cptId:matchData.value.id
cptId: matchData.value.id
}
emit('schSearch',params)
emit('schSearch', params)
}
const handlePickup=()=>{
const params={
cptId :matchData.value.id
const handlePickup = () => {
const params = {
cptId: matchData.value.id
}
emit('pickup',params)
emit('pickup', params)
}
const goliveUrl = () => {
if (liveData.value.videoStatus=="1") {
window.open(liveData.value.videoUrlCn)
} else {
ElMessage.warning( '暂无直播' )
}
}
const gopicliveUrl = () => {
if (liveData.value.picStatus=="1") {
window.open(liveData.value.picUrlCn)
} else {
ElMessage.warning( '暂无直播' )
}
}
</script>
<style scoped lang="scss">
.zn-bg {
background: linear-gradient(90deg, #8623FC, #8623FC, #8623FC, #8623FC, #8623FC, #8623FC, #453DEA, #8623FC);
border-radius: 15px;
background: #FFFFFF;margin-bottom: 22px;
box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
border-radius: 20px;
}
.zn-Box {
background-size: contain;
position: relative;
overflow: hidden;
.bbbg {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
}
.bgbg {
padding: 5%;
......@@ -615,7 +526,7 @@ const handlePickup=()=>{
}
.itemBox {
padding: 20px 40px;
padding: 20px 0;
}
border-radius: 15px;
......@@ -647,8 +558,17 @@ const handlePickup=()=>{
height: 450px;
background: #000;
position: relative;
.picliveBtn{ position: absolute;cursor: pointer;
bottom: 24%;
font-size: 20px;
padding: 10px 25px;
right: 5%;
color: #fff;
border: 2px solid #e1e1e1;
border-radius: 50px;}
.banner-count {cursor: pointer;
.banner-count {
cursor: pointer;
position: absolute;
padding: 20px 40px;
font-size: 20px;
......@@ -656,12 +576,6 @@ const handlePickup=()=>{
overflow: hidden;
background: url("@/assets/dance/time_bg.png") no-repeat center;
background-size: 100% 100%;
//border-radius: 100px;
//border-image: linear-gradient(-90deg, #7A6BEB, #F982AD, #7A6BEB) round;
//border-image-slice: 1;
//border-image-width:4px;
//border-image-outset:4px;
//background: rgba(0,0,0,0.3);
bottom: 40%;
display: flex;
flex-wrap: nowrap;
......@@ -691,10 +605,20 @@ const handlePickup=()=>{
font-size: 20px;
}
}
.bb{width: 580px;justify-content: center;height: 100px;font-size: 30px;}
.banner-count.bb:hover{box-shadow: 0 0 20px #453DEA;border-radius: 100px;
background: linear-gradient(-90deg, #8623FC, #453DEA)
.bb {
width: 580px;
justify-content: center;
height: 100px;
font-size: 30px;
}
.banner-count.bb:hover {
box-shadow: 0 0 20px #453DEA;
border-radius: 100px;
background: #000
}
.box {
position: absolute;
height: 100%;
......@@ -761,6 +685,7 @@ const handlePickup=()=>{
position: relative;
height: 400px;
}
.ggbond {
height: 230px;
position: relative;
......@@ -776,44 +701,94 @@ const handlePickup=()=>{
}
}
.teacher{height: 410px;background: #fff;
position: relative;border-radius: 10px;overflow: hidden;
.imgbox{background: linear-gradient(0,#C8AAFC,#fff)}
img{height: 350px;width: 100%;object-fit: cover;}
h3{color: #fff;background: url("@/assets/dance/name_bg.png") no-repeat center;
background-size:110% 100%;text-align: center;height: 30px;line-height: 30px;
font-size: 18px;position: absolute;width: 100%;bottom: 30px;}
p{text-align: center;margin: 25px 0 0;
font-size: 14px;}
.teacher {
height: 410px;
background: #fff;
position: relative;
border-radius: 10px;
overflow: hidden;
.imgbox {
background: linear-gradient(0, #C8AAFC, #fff)
}
img {
height: 350px;
width: 100%;
object-fit: cover;
}
h3 {
color: #fff;
background: url("@/assets/dance/name_bg.png") no-repeat center;
background-size: 110% 100%;
text-align: center;
height: 30px;
line-height: 30px;
font-size: 18px;
position: absolute;
width: 100%;
bottom: 30px;
}
p {
text-align: center;
margin: 25px 0 0;
font-size: 14px;
}
}
@media screen and (max-width: 1650px) {
.teacher{height: 320px;
.imgbox{
img{height: 260px}
.teacher {
height: 320px;
.imgbox {
img {
height: 260px
}
}
}
}
@media screen and (max-width: 1200px) {
.teacher{height: 450px;margin: 0 0 20px;
.imgbox{
img{height: 390px}
.teacher {
height: 450px;
margin: 0 0 20px;
.imgbox {
img {
height: 390px
}
}
}
}
@media screen and (max-width: 900px) {
.teacher{height: 400px;margin: 0 0 20px;
.imgbox{
img{height: 340px}
.teacher {
height: 400px;
margin: 0 0 20px;
.imgbox {
img {
height: 340px
}
}
}
}
@media screen and (max-width: 800px) {
.teacher{height: 400px;margin: 0 0 20px;
.imgbox{
img{height: 260px}
.teacher {
height: 400px;
margin: 0 0 20px;
.imgbox {
img {
height: 260px
}
}
}
}
.aboutBox {
background: url("@/assets/dance/about_bg.png") no-repeat center;
height: 375px;
......@@ -901,7 +876,9 @@ const handlePickup=()=>{
margin: 0 0 30px;
img {
width: 100%;height: 100%;object-fit: contain;
width: 100%;
height: 100%;
object-fit: contain;
}
}
......@@ -955,6 +932,8 @@ const handlePickup=()=>{
.box {
width: 94%
}
.calendarList {
padding: 0;
......@@ -1028,15 +1007,30 @@ const handlePickup=()=>{
}
}
}
.livetimecount{position: absolute;top: 0;z-index: 2;background: #F04035;
.livetimecount {
position: absolute;
top: 0;
z-index: 2;
background: #F04035;
padding: 2px 4px;
&::after{content: ''; width: 0;
height: 0;position: absolute;right: -15px;top: 0;
&::after {
content: '';
width: 0;
height: 0;
position: absolute;
right: -15px;
top: 0;
border-top: 24px solid #F04035;
border-right: 15px solid transparent;}
.van-count-down { display: flex;
border-right: 15px solid transparent;
}
.van-count-down {
display: flex;
color: #fff;
font-size: 14px;
.block {
color: #fff;
text-align: center;
......@@ -1045,21 +1039,34 @@ const handlePickup=()=>{
}
}
}
.newline{display: flex;align-items: center;height: 56px;justify-content: space-between;
cursor: pointer;
h3{font-weight: 400;margin: 0;width: 80%;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;
font-size: 18px;
color: #030303;}
span{font-weight: 400;
font-size: 14px;
color: #B4B6B8;}
&:hover{
background: #F7F8FC;
}
}
@media (max-width: 500px) {
.forPc{display: none!important;}
.logobox{
.forPc {
display: none !important;
}
.logobox {
height: 60px;
}
.newline{height: 40px;
h3{width: 70%;font-size: 14px;}
span{font-size: 12px;}
}
}
:deep(.btn-q) {
//background: #FFFFFF;
//font-size: 18px;
//color: #453DEA;
//border-radius: 23px;
//padding: 10px 20px;
//display: inline-flex;
//align-items: center;
:deep(.btn-q) {
padding: 20px 40px;
font-size: 20px;
align-items: center;
......@@ -1073,18 +1080,18 @@ const handlePickup=()=>{
box-sizing: inherit;
}
.btn-q:hover{
.btn-q:hover {
box-shadow: 0 0 20px #453DEA;
border-radius: 100px;
background: linear-gradient(-90deg, #8623FC, #453DEA) !important;
background: #000 !important;
}
.ding{
.ding {
position: fixed;
right: 0px;
z-index:99;
z-index: 99;
top: 40%;
background: linear-gradient(-90deg, #8623FC, #453DEA) !important;
background: #000 !important;
box-shadow: none;
color: #fff;
border-radius: 10px;
......@@ -1092,4 +1099,6 @@ const handlePickup=()=>{
width: 192px;
text-align: center;
}
</style>
......
src/viewsPc/index_en.vue
......@@ -8,33 +8,36 @@
<img v-if="n.bgImgUrl" class="bannerImg" :src="fillImgUrl(n.bgImgUrl)">
<img v-else class="bannerImg" src="@/assets/dance/banner.png">
<div class="box" style="position: absolute;top: 0;left: 0;right: 0;margin: auto;">
<div class="banner-count" v-if="n.time>0" >
Countdown
<van-count-down :time="n.time" format="DD 天 HH 时 mm 分 ss 秒">
<div class="banner-count" v-if="currentDateTime < liveData.videoStart" @click="goliveUrl">
Live Countdown
<van-count-down :time="liveStartTime" format="DD 天 HH 时 mm 分 ss 秒">
<template #default="timeData">
<div class="block">{{ timeData.days }}
<span class="colon">Days</span>
</div>：
<span class="colon">天</span>
</div>
：
<div class="block">{{ timeData.hours }}
<span class="colon">Hrs</span>
</div>：
<span class="colon">时</span>
</div>
：
<div class="block">{{ timeData.minutes }}
<span class="colon">Min</span>
</div>：
<span class="colon">分</span>
</div>
：
<div class="block">{{ timeData.seconds }}
<span class="colon">Sec</span>
<span class="colon">秒</span>
</div>
</template>
</van-count-down>
</div>
<div v-if="n.timeEnd<0">
<div class="banner-count bb" @click="goMatch(n)">
Registration has ended
<div v-if="liveData&& liveData.videoStatus==1" @click.stop="goliveUrl">
<div class="banner-count" v-if="(currentDateTime>liveData.videoStart)&&(currentDateTime<liveData.videoEnd)">
Live Now
</div>
<div class="banner-count" v-if="currentDateTime > liveData.videoEnd">
Live End
</div>
</div>
<div class="banner-count bb" v-if="n.time<=0&&n.timeEnd>=0" @click="goMatch(n)">
REGISTER NOW
</div>
</div>
</div>
......@@ -48,9 +51,9 @@
<img v-if="n.bgImgUrl" class="bannerImg" :src="fillImgUrl(n.bgImgUrl)">
<img v-else class="bannerImg" src="@/assets/dance/banner.png">
<div style="position: absolute;left: 0;right: 0;bottom: 0;margin: auto;">
<div class="banner-count" v-if="n.time>0" >
Countdown
<van-count-down :time="n.time" format="DD 天 HH 时 mm 分 ss 秒">
<div class="banner-count" v-if="currentDateTime < liveData.videoStart" @click="goliveUrl">
Live Countdown
<van-count-down :time="liveStartTime" format="DD 天 HH 时 mm 分 ss 秒">
<template #default="timeData">
<div class="block">{{ timeData.days }}
<span class="colon">Days</span>
......@@ -67,16 +70,14 @@
</template>
</van-count-down>
</div>
<div v-if="n.timeEnd<0">
<div class="banner-count bb" @click="goMatch(n)">
Registration has ended
<div v-if="liveData&& liveData.videoStatus==1" @click.stop="goliveUrl">
<div class="banner-count" v-if="(currentDateTime>liveData.videoStart)&&(currentDateTime<liveData.videoEnd)">
Live Now
</div>
<div class="banner-count" v-if="currentDateTime > liveData.videoEnd">
Live End
</div>
</div>
<div class="banner-count bb" v-if="n.time<=0&&n.timeEnd>=0" @click="goMatch(n)">
REGISTER NOW
</div>
</div>
</div>
</div>
......@@ -84,33 +85,8 @@
</el-carousel>
</div>
<div class="box zn-bg">
<div class="zn-Box">
<img class="bbbg" v-if="matchData?.logoUrl" :src="fillImgUrl(matchData?.logoUrl)"/>
<el-row>
<el-col :sm="24" :lg="10">
<div class="bgbg">
<h1 style="color: #fff">{{matchData?.name}}</h1>
<div class="mb30">
<a class="zn-btn" style="font-size: 15px" @click="goGuide">
GUIDELINE
<el-icon><download /></el-icon>
</a>
<!-- <a class="zn-btn ml20 btn-q forPc" v-show="matchData?.id=='1778253367748993026'" style="font-size: 15px;margin-right: 20px" @click="popMaster">-->
<!-- Junior &Youth Camp REGISTER<el-icon><Edit /></el-icon>-->
<!-- </a>-->
<a class="zn-btn ml20 btn-q" v-show="matchData?.id=='1778253367748993026'" @click="backNumberSearch">Competition Number</a>
<a class="zn-btn ml20 btn-q" v-show="matchData?.id=='1778253367748993026'" @click="schSearchSearch">Schedule Inquiry</a>
</div>
</div>
</el-col>
<el-col :sm="24" :lg="14">
<HomeQuick :match-id="matchData?.id" :cpt-name="matchData?.name"/>
</el-col>
</el-row>
</div>
<div class="box">
<HomeQuick :match-id="matchData?.id" :cpt-name="matchData?.name"/>
</div>
......@@ -118,70 +94,27 @@
<el-row :gutter="20">
<el-col :sm="24" :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">COMPETITION SCHEDULE</h3>
<a class="more" @click="gosaiC">MORE</a>
<h3 class="leftboderTT">NOTICEBOARD</h3>
<a class="more" href="#/notice">MORE</a>
</div>
<!--赛事日历-->
<el-card :body-style="{'padding':'20px 20px'}">
<home-calendar/>
<el-card :body-style="{'padding':'10px 20px 18px'}">
<div v-for="(n,index) in newsList" :key="index" class="newline" @click="goDetail(n)">
<h3>{{ n.name }}</h3>
<span class="date">{{n.belongTime}}</span>
</div>
</el-card>
</el-col>
<el-col :sm="24" :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">MEDAL LIST（2023）</h3>
<a class="more" href="#/saiC">MORE</a>
<h3 class="leftboderTT">COMPETITION SCHEDULE</h3>
<a class="more" @click="gosaiC">MORE</a>
</div>
<!--历史排名-->
<el-card :body-style="{'padding':'10px 20px 18px'}">
<el-table stripe :data="rankList">
<el-table-column label="RANK" align="center" width="80" 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>
<span v-else-if="scope.row.index == 3" style="color:#7F2D00">{{ scope.row.index }}</span>
<span v-else>{{ scope.row.index }}</span>
</template>
</el-table-column>
<el-table-column label="COUNTRY">
<template #default="scope">
<div>
<span :class="`flag-icon flag-icon-${scope.row.code}`"></span>
{{ scope.row.en_gj }}
</div>
</template>
</el-table-column>
<el-table-column label="COUPLE" align="center">
<template #default="scope">
<div class="text-primary esp">{{ scope.row.name }}</div>
</template>
</el-table-column>
<el-table-column width="50">
<template #header>
<img class="mauto" src="@/assets/dance/1.png">
</template>
<template #default="scope">
<div class="text-warning text-center">{{ scope.row.jin }}</div>
</template>
</el-table-column>
<el-table-column width="50">
<template #header>
<img class="mauto" src="@/assets/dance/2.png">
</template>
<template #default="scope">
<div class="text-blue text-center">{{ scope.row.yin }}</div>
</template>
</el-table-column>
<el-table-column width="50">
<template #header>
<img class="mauto" src="@/assets/dance/3.png">
</template>
<template #default="scope">
<div class="text-primary text-center">{{ scope.row.tong }}</div>
</template>
</el-table-column>
</el-table>
<!--赛事日历-->
<el-card :body-style="{'padding':'20px 20px'}">
<home-calendar/>
</el-card>
</el-col>
</el-row>
</div>
<!-- NEWS -->
......@@ -218,7 +151,6 @@
</div>
</div>
<div class="part">
<div class="box">
<div class="indexTitle">
<h3 class="leftboderTT">MEDIA</h3>
......@@ -423,6 +355,10 @@ const picList = ref([])
const calendarValue = ref('2024-07-22')
const aboutUsContent = ref('')
const partners = ref([])
const newsList = ref([])
const currentDateTime = dayjs().format('YYYY-MM-DD HH:mm:ss')
const liveStartTime = ref(0)
const liveData = ref({})
const matchData = ref({})
onMounted(() => {
......@@ -431,8 +367,9 @@ onMounted(() => {
const init = () => {
var today = dayjs().format('YYYY-MM-DD HH:mm:ss')
etime.value = dayjs('2024-07-22 12:00:00').diff(today, 'millisecond')
time.value = dayjs('2024-07-17 07:00:00').diff(today, 'millisecond')
getNewsListById({pageSize: 6, pageNum: 1,sortId: '20000001'}).then(res => {
newsList.value = res.rows
})
getNewsListById(
{ pageSize: 4,
pageNum: 1,
......@@ -455,19 +392,19 @@ const init = () => {
})
match.getMaList({topFlag:1}).then((res) => {
maList.value = res.rows
for (let n of maList.value) {
var today = dayjs().format('YYYY-MM-DD HH:mm:ss')
n.time = dayjs(n.signBeginTime).diff(today, 'millisecond')
if(n.signEndTime){
n.timeEnd = dayjs(n.signEndTime).diff(today, 'millisecond')
} else {
n.time = 0
}
}
matchData.value = maList.value[0]
getMatchInfo(matchData.value.id)
})
getpartners()
}
const getMatchInfo = (id) => {
match.getInfoByCptId({ cptId:id }).then((res) => {
liveData.value = res.data || {}
if(liveData.value.videoStart){
liveStartTime.value = dayjs(liveData.value.videoStart).diff(currentDateTime.value, 'millisecond')
}
})
}
const getpartners = () => {
match.getAboutUs().then((res) => {
aboutUsContent.value = res.data.contextEn
......@@ -547,6 +484,21 @@ const handlePickup=()=>{
}
emit('pickup',params)
}
const goliveUrl = () => {
if (liveData.value.videoStatus=="1") {
window.open(liveData.value.videoUrlCn)
} else {
ElMessage.warning('No live' )
}
}
const gopicliveUrl = () => {
if (liveData.value.picStatus=="1") {
window.open(liveData.value.picUrlCn)
} else {
ElMessage.warning( 'No live' )
}
}
</script>
<style scoped lang="scss">
......@@ -619,7 +571,7 @@ const handlePickup=()=>{
}
.bb{width: 580px;justify-content: center;height: 100px;font-size: 30px;}
.banner-count.bb:hover{box-shadow: 0 0 20px #453DEA;border-radius: 100px;
background: linear-gradient(-90deg, #8623FC, #453DEA)
background: #000
}
.box {
position: absolute;
......@@ -686,7 +638,7 @@ const handlePickup=()=>{
:deep(.el-calendar__button-group){display: none;}
:deep(.el-calendar-table thead th){padding: 5px 0 0}
.primaryDate{color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);}
background: #000;}
.date{ margin:auto;border-radius: 50%;width: 30px;height: 30px;line-height: 30px;
font-weight: bold;
}
......@@ -698,19 +650,19 @@ const handlePickup=()=>{
border-radius: 10px;
font-weight: 500;
font-size: 15px;
label{color: #453DEA;margin-right: 15px;
label{color: #000;margin-right: 15px;
&::before{content: '';background:#fff;left: -17px;top: 0px;bottom: 0;margin: auto;
border-radius: 50%;width: 2px;height: 2px;position: absolute;z-index: 1}
}
}
li::before{content: '';background: linear-gradient(0deg, #8623FC, #453DEA);
li::before{content: '';background: #000;
border-radius: 50%;width: 8px;height: 8px;position: absolute;
left: -20px;top: 0;bottom: 0;margin: auto;z-index: 1;
}
li::after{content: ''; left: -16px;width: 1px;height: 100%;
background: #EBEBEB; position: absolute;top: 20px}
li:hover{color: #fff;
background: linear-gradient(-90deg, #8623FC, #453DEA);
background: #000;
label{color: #fff;}
}
}
......@@ -813,8 +765,24 @@ const handlePickup=()=>{
cursor: pointer;
&:hover{filter:brightness(2)}}
}
.newline{display: flex;align-items: center;height: 56px;justify-content: space-between;
cursor: pointer;
h3{font-weight: 400;margin: 0;width: 80%;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;
font-size: 18px;
color: #030303;}
span{font-weight: 400;
font-size: 14px;
color: #B4B6B8;}
&:hover{
background: #F7F8FC;
}
}
@media (max-width: 800px) {
.newline{height: 40px;
h3{width: 70%;font-size: 14px;}
span{font-size: 12px;}
}
.box{width: 94%}
.calendarList{padding: 0;
ul{
......@@ -871,7 +839,7 @@ const handlePickup=()=>{
.btn-q:hover{
box-shadow: 0 0 20px #453DEA;
border-radius: 100px;
background: linear-gradient(-90deg, #8623FC, #453DEA) !important;
background: #000 !important;
}
.ding{
......@@ -879,7 +847,7 @@ const handlePickup=()=>{
right:0px;
z-index:99;
top: 40%;
background: linear-gradient(-90deg, #8623FC, #453DEA) !important;
background: #000 !important;
box-shadow: none;
color: #fff;
border-radius: 10px;
......
src/viewsPc/login.vue
......@@ -437,13 +437,13 @@ const goPolicy = () => {
.loginBtn {
height: 40px;
background: linear-gradient(-90deg, #8623FC, #453DEA);
background: #000;
border-radius: 20px;
font-size: 18px;
&:hover {
//background: linear-gradient(90deg, #8623FC, #453DEA);
box-shadow: 0 0 10px #453DEA;
//background: #000;
box-shadow: 0 0 10px #000;
}
}
......
src/viewsPc/match/components/quick-row.vue
<template>
<div style="filter: opacity(1)">
<el-row v-if="language==0" class="btnbox" justify='space-between'>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(0)">
<img src="@/assets/dance/btn04.png"/>
<h4>票务预订</h4>
<img src="@/assets/dance/btn01.png"/>
<h4>签证服务</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(1)">
<img src="@/assets/dance/btn01.png"/>
<img src="@/assets/dance/btn02.png"/>
<h4>酒店预订</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(2)">
<img src="@/assets/dance/btn02.png"/>
<h4>车辆预订</h4>
<img src="@/assets/dance/btn03.png"/>
<h4>接送服务</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(6)">
<img src="@/assets/dance/btn07.png"/>
<h4>预订查询</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(3)">
<img src="@/assets/dance/btn03.png"/>
<h4>餐饮预订</h4>
<img src="@/assets/dance/btn04.png"/>
<h4>场馆介绍</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(4)">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="liveClick">
<img src="@/assets/dance/btn05.png"/>
<h4>化妆预约</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(5)">
<img src="@/assets/dance/btn06.png"/>
<h4>拍照预约</h4>
<h4>赛事直播</h4>
</div>
</el-col>
</el-row>
<el-row v-else class="btnbox" justify='space-between'>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(0)">
<img src="@/assets/dance/btn04.png"/>
<h4>TICKET BOOKING</h4>
<img src="@/assets/dance/btn01.png"/>
<h4>Visa Services</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(1)">
<img src="@/assets/dance/btn01.png"/>
<img src="@/assets/dance/btn02.png"/>
<h4>HOTEL RESERVATION</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(2)">
<img src="@/assets/dance/btn02.png"/>
<img src="@/assets/dance/btn03.png"/>
<h4>TRANSPORTATION RESERVATION</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(6)">
<img src="@/assets/dance/btn07.png"/>
<h4>RESERVATION SEARCH</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(3)">
<img src="@/assets/dance/btn03.png"/>
<h4>DINING RESERVATION</h4>
<img src="@/assets/dance/btn04.png"/>
<h4>Venue Introduction</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(4)">
<el-col :lg="4" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="liveClick">
<img src="@/assets/dance/btn05.png"/>
<h4>MAKEUP APPOINTMENT</h4>
</div>
</el-col>
<el-col :lg="3" :md="7" :sm="11" :xs="11">
<div class="funcBtn" @click="popRemark(5)">
<img src="@/assets/dance/btn06.png"/>
<h4>PHOTOGRAPHY APPOINTMENT</h4>
<h4>live streaming</h4>
</div>
</el-col>
</el-row>
......@@ -105,6 +81,7 @@ import OrderRemark from '@/viewsPc/components/orderRemark'
import {getBaseInfoByActiveId} from "@/apiPc/booking";
import {getCurrentInstance} from "@vue/runtime-core";
import {onMounted} from "vue";
import * as match from "@/apiPc/match";
const {proxy} = getCurrentInstance()
......@@ -123,6 +100,7 @@ const props = defineProps({
}
})
const form = ref()
const liveData = ref({})
onMounted(() => {
getBaseInfoByActiveId(props.matchId).then(res => {
form.value = res.data || null
......@@ -130,13 +108,29 @@ onMounted(() => {
form.value = null
console.log(err)
})
match.getInfoByCptId({ cptId:props.matchId }).then((res) => {
liveData.value = res.data || {}
})
})
function building() {
ElMessage.warning(language.value == 0 ? '感谢您对本次比赛的关注，该服务暂无可预订信息，敬请期待。' : 'Thank you for your attention to this competition. The service is currently unavailable for booking. Please stay tuned.')
}
const liveClick = () => {
if (liveData.value.videoStatus=="1") {
if(language.value==0){
window.open(liveData.value.videoUrlCn)
} else {
window.open(liveData.value.videoUrlEn)
}
} else {
ElMessage.warning(language.value == 0 ? '暂无直播' : 'No live')
}
}
function popRemark(type) {
if (type == 6) {
return router.push({
......@@ -225,10 +219,12 @@ h4 {
// flex: 0 0 14.28%;
// }
//}
.funcBtn{text-transform: uppercase;
h4 {display: flex;align-items: center;justify-content: center;height: 20%;}
}
.fixedKP {
position: fixed;
background: linear-gradient(-90deg, #8623FC, #453DEA);
background: #000;
left: 0;
top: 450px;
cursor: pointer;
......
src/viewsPc/match/detail_en.vue
......@@ -142,173 +142,54 @@
</div>
</el-col>
<el-col v-if="matchData.type=='0'" :lg="8" :md="12" :xl="8">
<p v-if="language==0" class="countDownTitle">
<span v-if="startSign>0">报名开始倒计时</span>
<span v-else>报名截止倒计时</span>
</p>
<p v-else class="countDownTitle">
<span>REGISTRATION COUNTDOWN</span>
</p>
<van-count-down :time="startSign>0?startSign:time" format="DD 天 HH 时 mm 分 ss 秒">
<template #default="timeData">
<span class="block">{{ timeData.days }}</span>
<span class="colon">{{ language == 0 ? '天' : 'Days' }}</span>
<span class="block">{{ timeData.hours }}</span>
<span class="colon">{{ language == 0 ? '时' : 'Hrs' }}</span>
<span class="block">{{ timeData.minutes }}</span>
<span class="colon">{{ language == 0 ? '分' : 'Min' }}</span>
<span class="block">{{ timeData.seconds }}</span>
<span class="colon">{{ language == 0 ? '秒' : 'Sec' }}</span>
</template>
</van-count-down>
<div class="flexCenter">
<el-button v-if="matchData.progressStatusCode=='2'" ref="RegisterRef" class="btn-lineG mt10 w100" round
style="font-size: 16px"
type="primary" @click="choseSignType">
{{ language == 0 ? '我要报名' : 'REGISTER' }}
</el-button>
<div v-else-if="time<=0" class="btn-lineG mb20 mauto text-center" style="opacity: 0.5;">
{{ language == 0 ? '报名已结束' : 'Registration has ended' }}
</div>
<div v-else-if="startSign>0" class="btn-lineG mb20 mauto text-center" style="opacity: 0.5;">
{{ language == 0 ? '报名未开始' : 'Not started yet' }}
</div>
</div>
<p class="text-gray text-center uppercase">{{
language == 0 ? '报名截止' : 'Registration Deadline'
}}：{{ matchData.signEndTime?.slice(0, 10) }}</p>
</el-col>
<!-- <el-col v-if="matchData.type=='0'" :lg="8" :md="12" :xl="8">-->
<!-- <p v-if="language==0" class="countDownTitle">-->
<!-- <span v-if="startSign>0">报名开始倒计时</span>-->
<!-- <span v-else>报名截止倒计时</span>-->
<!-- </p>-->
<!-- <p v-else class="countDownTitle">-->
<!-- <span>REGISTRATION COUNTDOWN</span>-->
<!-- </p>-->
<!-- <van-count-down :time="startSign>0?startSign:time" format="DD 天 HH 时 mm 分 ss 秒">-->
<!-- <template #default="timeData">-->
<!-- <span class="block">{{ timeData.days }}</span>-->
<!-- <span class="colon">{{ language == 0 ? '天' : 'Days' }}</span>-->
<!-- <span class="block">{{ timeData.hours }}</span>-->
<!-- <span class="colon">{{ language == 0 ? '时' : 'Hrs' }}</span>-->
<!-- <span class="block">{{ timeData.minutes }}</span>-->
<!-- <span class="colon">{{ language == 0 ? '分' : 'Min' }}</span>-->
<!-- <span class="block">{{ timeData.seconds }}</span>-->
<!-- <span class="colon">{{ language == 0 ? '秒' : 'Sec' }}</span>-->
<!-- </template>-->
<!-- </van-count-down>-->
<!-- <div class="flexCenter">-->
<!-- <el-button v-if="matchData.progressStatusCode=='2'" ref="RegisterRef" class="btn-lineG mt10 w100" round-->
<!-- style="font-size: 16px"-->
<!-- type="primary" @click="choseSignType">-->
<!-- {{ language == 0 ? '我要报名' : 'REGISTER' }}-->
<!-- </el-button>-->
<!-- <div v-else-if="time<=0" class="btn-lineG mb20 mauto text-center" style="opacity: 0.5;">-->
<!-- {{ language == 0 ? '报名已结束' : 'Registration has ended' }}-->
<!-- </div>-->
<!-- <div v-else-if="startSign>0" class="btn-lineG mb20 mauto text-center" style="opacity: 0.5;">-->
<!-- {{ language == 0 ? '报名未开始' : 'Not started yet' }}-->
<!-- </div>-->
<!-- </div>-->
<!-- <p class="text-gray text-center uppercase">{{-->
<!-- language == 0 ? '报名截止' : 'Registration Deadline'-->
<!-- }}：{{ matchData.signEndTime?.slice(0, 10) }}</p>-->
<!-- </el-col>-->
</el-row>
</el-card>
<!-- 只联赛有-->
<quick-row v-if="matchData.leagueId==0" :match-id="matchId"/>
<el-row v-if="matchData.type=='0'" :gutter="20">
<el-col :lg="18">
<el-card :body-style="{'padding':'0'}">
<div class="lineHead">
<ul>
<li v-for="l in menu" :key="l.name" :class="l.active==1?'active':''" @click="changeMenu(menu,l)">
{{ language == 0 ? l.cn : l.name }}
</li>
</ul>
</div>
<matchInfo v-if="menu[0].active==1" :form="matchData"/>
<div v-if="menu[1].active==1">
<match-info-project-list :is-national="isNational" :match-id="matchData.id"/>
</div>
<match-schedule-list v-if="menu[2].active==1" :match-data="matchData"/>
<div v-if="menu[3].active==1">
<div v-if="matchData.showPersonFlag=='1'">
<!-- <el-row :gutter="20" v-if="matchData.signType == '0'">-->
<!-- <el-col v-for="t in signDoneGroupList" :key="t.id" :span="8">-->
<!-- <div class="teamItem">-->
<!-- <el-avatar :size="60" :src="fillImgUrl(t.imgUrl||t.avatar)"/>-->
<!-- <span class="name">{{ t.name }}</span>-->
<!-- </div>-->
<!-- </el-col>-->
<!-- </el-row>-->
<el-row :gutter="20" class="pd20">
<el-col :span="24">
<div class="fr mb20">
<div class="flex">
<el-input v-model="queryGroupList.groupName" :placeholder="language == 0 ? '请输入参赛队名称' :'Please enter the Team name'" :prefix-icon="Search" class="mr10"
clearable
size="small" @change="getGroupListByCptId"/>
<el-input v-model="queryGroupList.athleteName" :placeholder=" language == 0 ? '请输入运动员查询' :'Please enter the athlete name'" :prefix-icon="Search"
clearable
size="small" @change="getGroupListByCptId"/>
</div>
</div>
<el-table :data="signDoneGroupList">
<el-table-column :label="language == 0 ? '组别代码' :'EVENT CODE'" align="center" min-width="120"
prop="groupCode"/>
<el-table-column :label="language == 0 ?'组别':'EVENT'" min-width="200" prop="group">
<template #default="scope">
<div class="esp">{{ scope.row.group }}</div>
</template>
</el-table-column>
<el-table-column :label="language == 0 ?'男运动员':'man name'" min-width="150"
prop="maleAthName"/>
<el-table-column :label="language == 0 ?'女运动员':'woman name'" min-width="150"
prop="femaleAthName"/>
<el-table-column :label="language == 0 ?'舞种':'Division'" align="center" min-width="90"
prop="danceType"/>
<el-table-column :label="language == 0 ?'国籍':'Representing'" align="center" min-width="130"
prop="countryName"/>
<el-table-column :label="language == 0 ?'参赛队名称':'Team name'" align="center" min-width="150"
prop="groupName"/>
</el-table>
<PaginationPc
v-show="signDoneGroupListToTal>0"
v-model:limit="queryGroupList.pageSize"
v-model:page="queryGroupList.pageNum"
:total="signDoneGroupListToTal"
@pagination="getGroupListByCptId"
/>
</el-col>
</el-row>
</div>
<div v-else>
<el-empty :image="`/img/order_no.png`" :image-size="228" description=""/>
</div>
</div>
<div v-if="menu[4].active==1">
<!--成绩-->
<el-empty :image="`/img/order_no.png`" :image-size="228" description=""/>
</div>
<div v-if="menu[5].active==1" class="pd20">
<div class="xzbox">
<div v-html="matchData.signKnow"></div>
<div v-if="matchData.signKnowUrl">
<el-link v-for="(item,index) in JSON.parse(matchData.signKnowUrl)" :href="fillImgUrl(item.url)"
target="_blank" type="primary">
<el-icon :size="20">
<Download/>
</el-icon>
{{ item.name }}
</el-link>
</div>
</div>
</div>
</el-card>
<div style="height: 20px"></div>
</el-col>
<el-col :lg="6">
<match-news :match-id="matchId"/>
</el-col>
</el-row>
<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" :class="l.active==1?'active':''" @click="changeMenu(menu1,l)">
{{ language == 0 ? l.cn : l.name }}
</li>
</ul>
</div>
<!-- 分站赛-->
<substation-list v-if="menu1[0].active==1" :list="matchData.cpts"/>
<matchInfo v-if="menu1[1].active==1" :form="matchData"/>
<match-schedule-list v-if="menu1[2].active==1" :match-data="matchData"/>
</el-card>
</el-col>
</el-row>
<!-- 邀请函 @click="applyInvitation"-->
<quick-row :match-id="matchId"/>
</div>
<div v-if="matchData.leagueId==0" class="fixed_gg_l" @click="applyInvitation">
<img v-if="language==0" src="@/assets/logo/Invitation_c.png"/>
<img v-else src="@/assets/logo/Invitation_e.png"/>
</div>
<affix-invitation ref="dialogInvitationRef"/>
<div style="height: 50px"></div>
......@@ -364,6 +245,7 @@ import {dayjs, ElMessage, ElMessageBox} from 'element-plus'
import useUserStore from "@/store/modules/user"
import {useStorage} from "@vueuse/core/index"
import {Search} from "@element-plus/icons-vue"
import {getInfoByCptId} from "@/apiPc/match";
const user = useUserStore().user
const group = useUserStore().group
......@@ -430,6 +312,9 @@ function getMatchId() {
getMatch(matchId.value)
getGroupListByCptId()
})
match.getInfoByCptId({id: matchId.value}).then(res=>{
})
}
function getMatch(id) {
......@@ -771,7 +656,7 @@ const openPickup = () => {
right: 0;
z-index: 99;
top: 38%;
background: linear-gradient(-90deg, #8623FC, #453DEA) !important;
background: #000 !important;
box-shadow: 0 0 10px #666;
color: #fff;
border-radius: 10px;
......@@ -856,7 +741,7 @@ const openPickup = () => {
line-height: 30px;
display: inline-block;
padding: 0 20px 0 14px;
background: linear-gradient(90deg, #8623FC, #453DEA);
background: #000;
border-radius: 0px 0px 15px 0px;
color: #fff;
}
......
src/viewsPc/match/index.vue
......@@ -190,17 +190,20 @@ function getList() {
}
total.value = res.total
loading.value = false
goDetail(res.rows[0].id)
})
}
function goDetail(id) {
const routeLocation = router.resolve({
// const routeLocation = router.resolve({
router.push({
name: 'matchDetail',
params: {
id: id
}
})
window.open(routeLocation.href, '_blank')
// window.open(routeLocation.href, '_blank')
}
</script>
......
src/viewsPc/meta/index.vue
......@@ -52,7 +52,7 @@
<div class="picbox" @click="goDetail(newsList2[0])"><img :src="fillImgUrl_webSite(newsList2[0]?.picUrl)"/></div>
</el-col>
<el-col :lg="15">
<el-row :gutter="20">
<el-row class="mb20" :gutter="20">
<el-col :lg="16">
<div class="picbox" @click="goDetail(newsList2[1])"><img :src="fillImgUrl_webSite(newsList2[1]?.picUrl)"/></div>
</el-col>
......
src/viewsPc/news/index.vue
......@@ -299,6 +299,12 @@ const goDetail = (n) => {
}
</script>
<style lang="scss" scoped>
.activeItem{
border-bottom: 2px solid #C7C7CD;
&:hover{
border-bottom: #000;
}
}
.leftboderTT{
font-size: 20px;}
.flexBody {
......
src/viewsPc/notice/index.vue
......@@ -152,24 +152,24 @@ const goDetail = (n) => {
color: var(--el-color-primary);}
}
.firstItem{cursor: pointer;
background: #F8F4FF;height: 100%;padding: 10px 20px;
background: #F7F8FC;height: 100%;padding: 10px 20px;
.date{font-weight: bold;transform: scaleX(0.7);transform-origin: left;
font-size: 18px;
color: var(--el-color-primary);
color: #4C5359;
p{margin: 5px 0;}
}
h3{margin: 10px 0;
font-size: 22px;}
.go{color: var(--el-color-primary);
.go{color: #929AA0;
font-size: 14px;padding: 0 0 5px;}
&:hover{background: linear-gradient(90deg, #8623fc3d, #453dea36);}
&:hover{background: #dcdde1;}
}
.newsLine{
.firstItem{margin-bottom: 10px;}
.item{display: flex;position: relative;width: 100%;height: 90px;
align-items: center;cursor: pointer;border-bottom: 1px dashed #EEEEEE;
.date{width: 60px;height: 60px;text-align: center;background: #FAFAFA;margin: 0 10px;
.day{color: var(--el-color-primary);transform: scaleX(0.7);font-weight: bold;font-size: 24px;}
.day{color: #4C5359;transform: scaleX(0.7);font-weight: bold;font-size: 24px;}
p{font-size: 14px;margin: 0;transform: scaleX(0.7);font-weight: bold;color: #7B7F83;}
}
.item-body{width: 60%;
......@@ -180,14 +180,14 @@ const goDetail = (n) => {
filter:grayscale(1);
}
}
.item:hover{background: #F8F4FF;
.item:hover{background: #f7f8fc;
.date{
background: var(--el-color-primary);
background:#000;
.day{color: #fff;}
p{color: #fff;}
}
.item-body{
h3{color: var(--el-color-primary);}
h3{color: #000;}
}
}
}
......
src/viewsPc/register/userAgreement.vue
......@@ -5,7 +5,7 @@
<div v-if="language==0">
<h4>一、协议生效与适用范围</h4>
1.1
本协议是您与无锡吉J体育舞蹈数字化平台系统（以下简称“系统”）之间关于您注册并使用系统服务所订立的协议。<br/><br/>
本协议是您与本平台系统（以下简称“系统”）之间关于您注册并使用系统服务所订立的协议。<br/><br/>
1.2 您通过点击或以其他方式选择接受本协议，即表示您已充分阅读、理解并同意接受本协议的约束。如果您不同意本协议的任何条款，请不要进行注册或使用本系统的服务。
<br/><br/>
1.3 本协议适用于您使用系统提供的所有服务，包括但不限于在线课程、社区交流、活动报名等。<br/>
......
src/viewsPc/saiC/index.vue
......@@ -147,7 +147,7 @@ h3{background: #F5F0FF;margin: 0;padding: 10px 0;
:deep(.el-calendar__button-group){display: none;}
}
.primaryDate{color: #fff;
background: linear-gradient(90deg, #8623FC, #453DEA);}
background: #000;}
.date{ margin:5px auto;border-radius: 50%;width: 34px;height: 34px;line-height: 34px;
font-weight: bold;
}
......@@ -158,19 +158,19 @@ h3{background: #F5F0FF;margin: 0;padding: 10px 0;
border-radius: 10px;
font-weight: 500;
font-size: 15px;cursor: pointer;
label{color: #453DEA;margin-right: 15px;
label{color: #000;margin-right: 15px;
&::before{content: '';background:#fff;left: -17px;top: 0px;bottom: 0;margin: auto;
border-radius: 50%;width: 2px;height: 2px;position: absolute;z-index: 1}
}
}
li::before{content: '';background: linear-gradient(0deg, #8623FC, #453DEA);
li::before{content: '';background: #000;
border-radius: 50%;width: 8px;height: 8px;position: absolute;
left: -20px;top: 0;bottom: 0;margin: auto;z-index: 1;
}
li::after{content: ''; left: -16px;width: 1px;height: 100%;
background: #EBEBEB; position: absolute;top: 20px}
li:hover{color: #fff;
background: linear-gradient(-90deg, #8623FC, #453DEA);
background: #000;
label{color: #fff;}
}
}
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!