Skip to content

杨炀 / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
91d50a89 by zhangmeng
Options

首页样式

1 parent b6c72052
Inline Side-by-side
Showing 17 changed files with 618 additions and 341 deletions
src/App.vue
1 <template> 1 <template>
2 <router-view /> 2 <router-view/>
3 <reset-pwd ref="resetPwdRef" /> 3 <reset-pwd ref="resetPwdRef"/>
4 </template> 4 </template>
5 5
6 <script setup> 6 <script setup>
7 import { nextTick, onMounted, watch} from 'vue' 7 import {nextTick, onMounted, watch} from 'vue'
8 import { handleThemeStyle } from '@/utils/theme' 8 import {handleThemeStyle} from '@/utils/theme'
9 import useSettingsStore from '@/store/modules/settings' 9 import useSettingsStore from '@/store/modules/settings'
10 import ResetPwd from '@/views/system/user/profile/components/resetPwd' 10 import ResetPwd from '@/views/system/user/profile/components/resetPwd'
11 import useUserStore from '@/store/modules/user' 11 import useUserStore from '@/store/modules/user'
12 import { getCurrentInstance } from '@vue/runtime-core' 12 import {getCurrentInstance} from '@vue/runtime-core'
13 import {useStorage} from "@vueuse/core"; 13 import {useStorage} from "@vueuse/core";
14 14
15 const userStore = useUserStore() 15 const userStore = useUserStore()
16 const { proxy } = getCurrentInstance() 16 const {proxy} = getCurrentInstance()
17 const language= useStorage('language',0) 17 const language = useStorage('language', 0)
18 18
19 onMounted(() => { 19 onMounted(() => {
20 document.body.style.setProperty('--el-color-primary', '#0540EC') 20 document.body.style.setProperty('--el-color-primary', '#0540EC')
...@@ -26,7 +26,7 @@ onMounted(() => { ...@@ -26,7 +26,7 @@ onMounted(() => {
26 }) 26 })
27 }) 27 })
28 28
29 watch(language,(val)=>{ 29 watch(language, (val) => {
30 location.reload() 30 location.reload()
31 }) 31 })
32 32
...@@ -46,7 +46,7 @@ watch(language,(val)=>{ ...@@ -46,7 +46,7 @@ watch(language,(val)=>{
46 --el-fill-color-light: #faf5f5; 46 --el-fill-color-light: #faf5f5;
47 --el-button-hover-border-color: #94080B; 47 --el-button-hover-border-color: #94080B;
48 --el-button-hover-bg-color: rgba(148, 8, 11, 0.3); 48 --el-button-hover-bg-color: rgba(148, 8, 11, 0.3);
49 --el-fill-color-lighter: #F6F9FE!important; 49 --el-fill-color-lighter: #F6F9FE !important;
50 } 50 }
51 51
52 .el-button:focus, .el-button:hover { 52 .el-button:focus, .el-button:hover {
...@@ -58,29 +58,34 @@ watch(language,(val)=>{ ...@@ -58,29 +58,34 @@ watch(language,(val)=>{
58 width: 1600px; 58 width: 1600px;
59 margin: auto; 59 margin: auto;
60 } 60 }
61
61 @media screen and (max-width: 1650px) { 62 @media screen and (max-width: 1650px) {
62 .box { 63 .box {
63 width: 1200px; 64 width: 1200px;
64 } 65 }
65 } 66 }
67
66 @media screen and (max-width: 1200px) { 68 @media screen and (max-width: 1200px) {
67 .box { 69 .box {
68 width: 860px; 70 width: 860px;
69 } 71 }
70 } 72 }
73
71 @media screen and (max-width: 900px) { 74 @media screen and (max-width: 900px) {
72 .box { 75 .box {
73 width: 750px; 76 width: 750px;
74 } 77 }
75 } 78 }
76 79
77 .app-main {min-height: 75vh; 80 .app-main {
81 min-height: 75vh;
78 background: #F4F4F4; 82 background: #F4F4F4;
79 } 83 }
80 84
81 .el-breadcrumb__inner { 85 .el-breadcrumb__inner {
82 display: flex; 86 display: flex;
83 87
88
84 .el-icon { 89 .el-icon {
85 margin: 0 4px; 90 margin: 0 4px;
86 } 91 }
...@@ -97,24 +102,27 @@ li.el-select-dropdown__item { ...@@ -97,24 +102,27 @@ li.el-select-dropdown__item {
97 .el-popper .el-menu { 102 .el-popper .el-menu {
98 background: #fff; 103 background: #fff;
99 } 104 }
105
100 .el-popper .el-menu--horizontal .el-menu .el-menu-item { 106 .el-popper .el-menu--horizontal .el-menu .el-menu-item {
101 background: transparent; 107 background: transparent;
102 justify-content: center; 108 justify-content: center;
103 height: 50px; 109 height: 50px;
104 font-size: 18px; 110 font-size: 18px;
105 } 111 }
112
106 .el-popper .el-menu--horizontal .el-menu .el-sub-menu .el-sub-menu__title { 113 .el-popper .el-menu--horizontal .el-menu .el-sub-menu .el-sub-menu__title {
107 background: transparent; 114 background: transparent;
108 justify-content: center; 115 justify-content: center;
109 height: 50px; 116 height: 50px;
110 font-size: 18px; 117 font-size: 18px;
111 } 118 }
112 .el-popper .el-menu--horizontal .el-menu .el-sub-menu.is-active>.el-sub-menu__title { 119
120 .el-popper .el-menu--horizontal .el-menu .el-sub-menu.is-active > .el-sub-menu__title {
113 121
114 } 122 }
115 123
116 .el-popper .el-menu--horizontal .el-menu .el-menu-item.is-active { 124 .el-popper .el-menu--horizontal .el-menu .el-menu-item.is-active {
117 color:var(--el-color-primary); 125 color: var(--el-color-primary);
118 } 126 }
119 127
120 .el-popper, .el-menu--popup { 128 .el-popper, .el-menu--popup {
...@@ -122,63 +130,82 @@ li.el-select-dropdown__item { ...@@ -122,63 +130,82 @@ li.el-select-dropdown__item {
122 } 130 }
123 131
124 :deep(.el-menu--popup) { 132 :deep(.el-menu--popup) {
125 min-width: 130px;padding: 0; 133 min-width: 130px;
134 padding: 0;
126 } 135 }
127 136
128 .el-popper.is-light.is-pure { 137 .el-popper.is-light.is-pure {
129 border: none; 138 border: none;
130 } 139 }
131 .el-menu--horizontal .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal .el-menu-item:not(.is-disabled):hover{ 140
141 .el-menu--horizontal .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
132 background-color: transparent; 142 background-color: transparent;
133 } 143 }
144
134 .el-popper { 145 .el-popper {
135 .el-menu--horizontal .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal .el-menu-item:not(.is-disabled):hover { 146 .el-menu--horizontal .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
136 color: var(--el-color-primary); 147 color: var(--el-color-primary);
137 } 148 }
138 149
139 .el-menu--horizontal { 150 .el-menu--horizontal {
140 border: none; 151 border: none;
141 } 152 }
142 } 153 }
143 154
144 .home-menu { 155 .home-menu {
145 156
146 .el-menu {color: #000;} 157 .el-menu {
147 158 color: #000;
148 .el-menu--horizontal>.el-menu-item {
149 transition: none;color: #000;padding: 6px 0 ;margin: 0 10px;
150 } 159 }
151 160
161 .el-menu--horizontal > .el-menu-item {
162 transition: none;
163 color: #000;
164 padding: 6px 0;
165 margin: 0 10px;
166 }
167
152 .el-sub-menu .el-sub-menu__title { 168 .el-sub-menu .el-sub-menu__title {
153 font-size: 16px;color: #000; 169 font-size: 16px;
170 color: #000;
154 } 171 }
155 172
156 .el-menu--horizontal > .el-sub-menu.is-active .el-sub-menu__title { 173 .el-menu--horizontal > .el-sub-menu.is-active .el-sub-menu__title {
157 border-bottom: none; 174 border-bottom: none;
158 color: var(--el-color-primary); 175 color: var(--el-color-primary);
159 } 176 }
160 177
161 .el-menu--horizontal > .el-sub-menu .el-sub-menu__title:hover { 178 .el-menu--horizontal > .el-sub-menu .el-sub-menu__title:hover {
162 color: #453DEA; 179 color: #453DEA;
163 } 180 }
164 181
165 182
166 .el-menu--horizontal .el-menu-item:not(.is-disabled):hover { 183 .el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
167 color:#000;background: transparent;filter: drop-shadow(0 0 1px #000); 184 color: #fff;
185 background: transparent;
186 filter: drop-shadow(0 0 1px #fff);
168 } 187 }
169 188
189 .el-menu--horizontal .el-menu-item:not(.is-disabled):focus {
190 background: transparent;
191 }
192
170 .el-menu--horizontal > .el-menu-item.is-active { 193 .el-menu--horizontal > .el-menu-item.is-active {
171 border-bottom: 2px solid #000;color: #000!important; 194 border-bottom: 2px solid #fff;
195 color: #fff !important;
172 } 196 }
173 197
174 .el-menu--horizontal { 198 .el-menu--horizontal {
175 height: 35px; 199 height: 35px;
176 border-bottom: none; 200 border-bottom: none;
177 justify-content: start; gap: 40px; 201 justify-content: start;
202 gap: 40px;
178 } 203 }
179 204
180 .el-menu--horizontal > .el-menu-item { 205 .el-menu--horizontal > .el-menu-item {
181 font-size: 16px;font-family: PingFang SC; 206 font-size: 16px;
207 font-family: PingFang SC;
208 color: #fff;
182 } 209 }
183 } 210 }
184 211
...@@ -195,8 +222,10 @@ li.el-select-dropdown__item { ...@@ -195,8 +222,10 @@ li.el-select-dropdown__item {
195 } 222 }
196 223
197 @media (max-width: 1440px) { 224 @media (max-width: 1440px) {
198 .fixed_nav{ transform: scale(0.8); 225 .fixed_nav {
199 transform-origin: left;} 226 transform: scale(0.8);
227 transform-origin: left;
228 }
200 .home-menu .el-menu--horizontal > .el-menu-item { 229 .home-menu .el-menu--horizontal > .el-menu-item {
201 font-size: 16px; 230 font-size: 16px;
202 //padding: 0 10px; 231 //padding: 0 10px;
...@@ -211,11 +240,13 @@ li.el-select-dropdown__item { ...@@ -211,11 +240,13 @@ li.el-select-dropdown__item {
211 font-size: 16px; 240 font-size: 16px;
212 } 241 }
213 } 242 }
243
214 @media (max-width: 1200px) { 244 @media (max-width: 1200px) {
215 .home-menu .el-menu--horizontal { 245 .home-menu .el-menu--horizontal {
216 gap: 30px; 246 gap: 30px;
217 } 247 }
218 } 248 }
249
219 //思源宋体 250 //思源宋体
220 @font-face { 251 @font-face {
221 font-family: SC-song; 252 font-family: SC-song;
...@@ -232,52 +263,95 @@ li.el-select-dropdown__item { ...@@ -232,52 +263,95 @@ li.el-select-dropdown__item {
232 .el-dialog__headerbtn .el-dialog__close { 263 .el-dialog__headerbtn .el-dialog__close {
233 font-size: 33px; 264 font-size: 33px;
234 } 265 }
235 266
236 &.el-dialog { 267 &.el-dialog {
237 padding: 0 100px; 268 padding: 0 100px;
238 --el-dialog-title-font-size: 40px; 269 --el-dialog-title-font-size: 40px;
239 --el-dialog-padding-primary: 50px 20px 0 0; 270 --el-dialog-padding-primary: 50px 20px 0 0;
240 box-shadow: 0 2000px 0 2000px rgba(0, 0, 0, 0.6); 271 box-shadow: 0 2000px 0 2000px rgba(0, 0, 0, 0.6);
241 } 272 }
242 273
243 .el-dialog__headerbtn { 274 .el-dialog__headerbtn {
244 right: 20px; 275 right: 20px;
245 top: 30px; 276 top: 30px;
246 } 277 }
247 } 278 }
248 .searchPark{padding: 10px 20px;height: 100%; 279
280 .searchPark {
281 padding: 10px 20px;
282 height: 100%;
249 background: #F6F6F6; 283 background: #F6F6F6;
250 .el-input__suffix{color:var(--el-color-primary)} 284
251 .el-icon{color:var(--el-color-primary)} 285 .el-input__suffix {
252 .el-input{--el-input-icon-color:var(--el-color-primary)} 286 color: var(--el-color-primary)
287 }
288
289 .el-icon {
290 color: var(--el-color-primary)
291 }
292
293 .el-input {
294 --el-input-icon-color: var(--el-color-primary)
295 }
253 } 296 }
254 .flexformItem{ 297
255 display: flex;width: 100%; 298 .flexformItem {
256 .el-date-editor{ 299 display: flex;
257 --el-date-editor-width:100% 300 width: 100%;
301
302 .el-date-editor {
303 --el-date-editor-width: 100%
304 }
305
306 .el-input__suffix {
307 color: var(--el-color-primary)
308 }
309
310 .el-icon {
311 color: var(--el-color-primary)
312 }
313
314 .el-input {
315 --el-input-icon-color: var(--el-color-primary)
258 } 316 }
259 .el-input__suffix{color:var(--el-color-primary)}
260 .el-icon{color:var(--el-color-primary)}
261 .el-input{--el-input-icon-color:var(--el-color-primary)}
262 } 317 }
263 318
264 .topBanner{ 319 .topBanner {
265 .imgbox{position: relative;height: 100%; 320 .imgbox {
266 img{height: 100%;object-fit: cover;} 321 position: relative;
322 height: 100%;
323
324 img {
325 height: 100%;
326 object-fit: cover;
327 }
267 } 328 }
268 h3{position: absolute;bottom: 0;color: #fff; 329
269 font-size: 36px;margin: 0; 330 h3 {
270 text-align: center;width: 100%;padding: 60px 0 40px; 331 position: absolute;
271 background: linear-gradient(0deg,rgba(0,0,0,0.5),rgba(0,0,0,0)); 332 bottom: 0;
333 color: #fff;
334 font-size: 36px;
335 margin: 0;
336 text-align: center;
337 width: 100%;
338 padding: 60px 0 40px;
339 background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
272 } 340 }
273 } 341 }
274 .tablebody{width: 100%;overflow: auto} 342
343 .tablebody {
344 width: 100%;
345 overflow: auto
346 }
275 347
276 @media (max-width: 800px) { 348 @media (max-width: 800px) {
277 .box{width: 96%} 349 .box {
350 width: 96%
351 }
278 } 352 }
279 353
280 .hz-tag{ 354 .hz-tag {
281 border-radius: 13px; 355 border-radius: 13px;
282 height: 25px; 356 height: 25px;
283 line-height: 25px; 357 line-height: 25px;
...@@ -285,35 +359,41 @@ li.el-select-dropdown__item { ...@@ -285,35 +359,41 @@ li.el-select-dropdown__item {
285 font-weight: 400; 359 font-weight: 400;
286 padding: 0 15px; 360 padding: 0 15px;
287 } 361 }
288 .tag1{ 362
289 background: rgba(50, 177, 108, 0.2); 363 .tag1 {
290 color:rgba(50, 177, 108, 1); 364 background: rgba(50, 177, 108, 0.2);
365 color: rgba(50, 177, 108, 1);
291 } 366 }
292 .tag2{ 367
293 background-color: rgba(243, 152, 0, 0.2); 368 .tag2 {
369 background-color: rgba(243, 152, 0, 0.2);
294 color: #F39800; 370 color: #F39800;
295 } 371 }
296 .tag3{ 372
373 .tag3 {
297 background-color: rgba(0, 160, 233, 0.2); 374 background-color: rgba(0, 160, 233, 0.2);
298 color: #00A0E9; 375 color: #00A0E9;
299 } 376 }
300 .tag4{ 377
378 .tag4 {
301 background-color: rgba(247, 64, 166, 0.2); 379 background-color: rgba(247, 64, 166, 0.2);
302 color: #F740A6; 380 color: #F740A6;
303 } 381 }
304 .hz-row{ 382
383 .hz-row {
305 font-size: 14px; 384 font-size: 14px;
306 font-weight: 400; 385 font-weight: 400;
307 color: #929AA0; 386 color: #929AA0;
308 margin-bottom: 16px; 387 margin-bottom: 16px;
309 388
310 } 389 }
311 .sign{ 390
391 .sign {
312 color: #493CEB; 392 color: #493CEB;
313 } 393 }
314 394
315 .s{ 395 .s {
316 cursor:pointer 396 cursor: pointer
317 } 397 }
318 398
319 </style> 399 </style>
......
src/layoutPc/components/AppBottom.vue
1 <template> 1 <template>
2 <div class="footAll"> 2 <div class="footAll">
3 <div class="box" style="max-width: 90%"> 3 <div class="box" style="max-width: 90%">
4 <el-row v-if="language==0" justify="space-between" align="middle"> 4 <el-row v-if="language==0" align="middle" justify="space-between">
5 <el-col :lg="10" :md="10" :xs="10"> 5 <el-col :lg="10" :md="10" :xs="10">
6 <ul> 6 <div>
7 <li>邮编：214000</li> 7 <img alt="" src="@/assets/pc/bottom_logo.png">
8 <li>微信: 18806179528</li> 8 </div>
9 <!-- <li>QQ: 497118883</li>-->
10 <li>江苏省 无锡市太湖新城和风路与清舒交叉口东北100米</li>
11 </ul>
12 </el-col> 9 </el-col>
13 <el-col :lg="10" :md="10" :xs="10"> 10 <el-col :lg="10" :md="10" :xs="10">
14 <ul style="text-align: right"> 11 <ul style="text-align: right">
12 <li>邮编：214000</li>
13 <li>微信: 18806179528</li>
14 <!-- <li>QQ: 497118883</li>-->
15 <li>江苏省 无锡市太湖新城和风路与清舒交叉口东北100米</li>
15 <li>客服及报障电话:18806179528</li> 16 <li>客服及报障电话:18806179528</li>
16 <li>客服及报障邮箱: office@2025wtcwuxi.com</li> 17 <li>客服及报障邮箱: office@2025wtcwuxi.com</li>
17 </ul> 18 </ul>
18 </el-col> 19 </el-col>
19 <!-- <el-col :lg="4" :md="4" :xs="4">--> 20 <!-- <el-col :lg="4" :md="4" :xs="4">-->
20 <!-- <div>--> 21 <!-- <div>-->
21 <!-- <img class="mauto" src="/img/wb2.jpg"/>--> 22 <!-- <img class="mauto" src="/img/wb2.jpg"/>-->
22 <!-- <p class="text-center mt10">微博关注</p>--> 23 <!-- <p class="text-center mt10">微博关注</p>-->
23 <!-- </div>--> 24 <!-- </div>-->
24 <!-- </el-col>--> 25 <!-- </el-col>-->
25 <el-col :span="24" style="border-top: 1px solid #fff"> 26 <el-col :span="24" style="border-top: 1px solid #fff">
26 <div class="text-center copyright pd10">版权所有@无锡和畅赛事运营有限公司 27 <div class="text-center copyright pd10">版权所有@无锡和畅赛事运营有限公司
27 <a target="_blank" href="https://beian.miit.gov.cn/">ICP备案号：苏ICP备2023054420号-2</a></div> 28 <a href="https://beian.miit.gov.cn/" target="_blank">ICP备案号：苏ICP备2023054420号-2</a></div>
28 </el-col> 29 </el-col>
29 </el-row> 30 </el-row>
30 31
31 <el-row justify="space-between" align="middle" v-if="language===1"> 32 <el-row v-if="language===1" align="middle" justify="space-between">
32 <el-col :span="14"> 33 <el-col :span="14">
33 <ul> 34 <!-- <ul>-->
35 <!-- <li>Postal code：214000</li>-->
36 <!-- <li>Address：100 meters northeast of the intersection of Hefeng Road and Qingshu, the Taihu Lake New Town,-->
37 <!-- Wuxi, Jiangsu-->
38 <!-- </li>-->
39 <!-- </ul>-->
40 <div>
41 <img alt="" src="@/assets/pc/bottom_logo.png">
42 </div>
43 </el-col>
44 <el-col :span="6">
45 <ul style="text-align: right">
34 <li>Postal code：214000</li> 46 <li>Postal code：214000</li>
35 <li>Address：100 meters northeast of the intersection of Hefeng Road and Qingshu, the Taihu Lake New Town, 47 <li>Address：100 meters northeast of the intersection of Hefeng Road and Qingshu, the Taihu Lake New Town,
36 Wuxi, Jiangsu 48 Wuxi, Jiangsu
37 </li> 49 </li>
38 </ul>
39 </el-col>
40 <el-col :span="6">
41 <ul style="text-align: right">
42 <li>Telephone:086-18806179528</li> 50 <li>Telephone:086-18806179528</li>
43 <li>E-mail:office@2025wtcwuxi.com</li> 51 <li>E-mail:office@2025wtcwuxi.com</li>
44 </ul> 52 </ul>
45 </el-col> 53 </el-col>
46 <!-- <el-col :span="4">--> 54 <!-- <el-col :span="4">-->
47 <!-- <div>--> 55 <!-- <div>-->
48 <!-- <img class="mauto" src="/img/wb2.jpg"/>--> 56 <!-- <img class="mauto" src="/img/wb2.jpg"/>-->
49 <!-- <p class="text-center mt10">Weibo</p>--> 57 <!-- <p class="text-center mt10">Weibo</p>-->
50 <!-- </div>--> 58 <!-- </div>-->
51 <!-- </el-col>--> 59 <!-- </el-col>-->
52 <el-col :span="24" style="border-top: 1px solid #fff"> 60 <el-col :span="24" style="border-top: 1px solid #fff">
53 <div class="text-center copyright pd10">Copyright@Wuxi Hechang Sports Operations Co., Ltd 61 <div class="text-center copyright pd10">Copyright@Wuxi Hechang Sports Operations Co., Ltd
54 <a target="_blank" href="https://beian.miit.gov.cn/">ICP：苏ICP备2023054420号-2</a></div> 62 <a href="https://beian.miit.gov.cn/" target="_blank">ICP：苏ICP备2023054420号-2</a></div>
55 </el-col> 63 </el-col>
56 </el-row> 64 </el-row>
57 </div> 65 </div>
58 </div> 66 </div>
59 <!-- <div class="fixed-right forPc">--> 67 <!-- <div class="fixed-right forPc">-->
60 <!-- <div class="mlb" v-if="language===0">--> 68 <!-- <div class="mlb" v-if="language===0">-->
61 <!-- <div @click="goAround" class="mb10 pb5">--> 69 <!-- <div @click="goAround" class="mb10 pb5">-->
62 <!-- <a>--> 70 <!-- <a>-->
63 <!-- <img class="kf" src="@/assets/logo/btn02.png"/>--> 71 <!-- <img class="kf" src="@/assets/logo/btn02.png"/>-->
64 <!-- <div class="text-center mt10">周边活动</div>--> 72 <!-- <div class="text-center mt10">周边活动</div>-->
65 <!-- </a>--> 73 <!-- </a>-->
66 <!-- </div>--> 74 <!-- </div>-->
67 <!-- <div--> 75 <!-- <div-->
68 <!-- style="display: none" title="客服"--> 76 <!-- style="display: none" title="客服"-->
69 <!-- 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')"--> 77 <!-- 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')"-->
70 <!-- >--> 78 <!-- >-->
71 <!-- <img class="kf" src="@/assets/logo/btn01.png"/>--> 79 <!-- <img class="kf" src="@/assets/logo/btn01.png"/>-->
72 <!-- <div class="text-center mt10">在线客服</div>--> 80 <!-- <div class="text-center mt10">在线客服</div>-->
73 <!-- </div>--> 81 <!-- </div>-->
74 <!-- &lt;!&ndash; <div @click="goHelpZH">&ndash;&gt;--> 82 <!-- &lt;!&ndash; <div @click="goHelpZH">&ndash;&gt;-->
75 <!-- &lt;!&ndash; <a>&ndash;&gt;--> 83 <!-- &lt;!&ndash; <a>&ndash;&gt;-->
76 <!-- &lt;!&ndash; <img class="kf" src="@/assets/logo/btn02.png"/>&ndash;&gt;--> 84 <!-- &lt;!&ndash; <img class="kf" src="@/assets/logo/btn02.png"/>&ndash;&gt;-->
77 <!-- &lt;!&ndash; <div class="text-center mt10">周边活动</div>&ndash;&gt;--> 85 <!-- &lt;!&ndash; <div class="text-center mt10">周边活动</div>&ndash;&gt;-->
78 <!-- &lt;!&ndash; </a>&ndash;&gt;--> 86 <!-- &lt;!&ndash; </a>&ndash;&gt;-->
79 <!-- &lt;!&ndash; </div>&ndash;&gt;--> 87 <!-- &lt;!&ndash; </div>&ndash;&gt;-->
80 <!-- </div>--> 88 <!-- </div>-->
81 <!-- <div class="mlb" v-else>--> 89 <!-- <div class="mlb" v-else>-->
82 <!-- <div @click="goAround" class="mb10 pb5">--> 90 <!-- <div @click="goAround" class="mb10 pb5">-->
83 <!-- <a>--> 91 <!-- <a>-->
84 <!-- <img class="kf" src="@/assets/logo/btn02.png"/>--> 92 <!-- <img class="kf" src="@/assets/logo/btn02.png"/>-->
85 <!-- <div class="text-center mt10">ACTIVITIES</div>--> 93 <!-- <div class="text-center mt10">ACTIVITIES</div>-->
86 <!-- </a>--> 94 <!-- </a>-->
87 <!-- </div>--> 95 <!-- </div>-->
88 <!--&lt;!&ndash; <div&ndash;&gt;--> 96 <!--&lt;!&ndash; <div&ndash;&gt;-->
89 <!--&lt;!&ndash; 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')"&ndash;&gt;--> 97 <!--&lt;!&ndash; 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')"&ndash;&gt;-->
90 <!--&lt;!&ndash; title="Live Chat">&ndash;&gt;--> 98 <!--&lt;!&ndash; title="Live Chat">&ndash;&gt;-->
91 <!--&lt;!&ndash; <img class="kf" src="@/assets/logo/btn01.png"/>&ndash;&gt;--> 99 <!--&lt;!&ndash; <img class="kf" src="@/assets/logo/btn01.png"/>&ndash;&gt;-->
92 <!--&lt;!&ndash; <div class="text-center ">LIVE CHAT</div>&ndash;&gt;--> 100 <!--&lt;!&ndash; <div class="text-center ">LIVE CHAT</div>&ndash;&gt;-->
93 <!--&lt;!&ndash; </div>&ndash;&gt;--> 101 <!--&lt;!&ndash; </div>&ndash;&gt;-->
94 <!-- &lt;!&ndash; <div @click="goHelp">&ndash;&gt;--> 102 <!-- &lt;!&ndash; <div @click="goHelp">&ndash;&gt;-->
95 <!-- &lt;!&ndash; <img class="kf" src="@/assets/logo/btn02.png"/>&ndash;&gt;--> 103 <!-- &lt;!&ndash; <img class="kf" src="@/assets/logo/btn02.png"/>&ndash;&gt;-->
96 <!-- &lt;!&ndash; <div class="text-center uppercase">Video Guide</div>&ndash;&gt;--> 104 <!-- &lt;!&ndash; <div class="text-center uppercase">Video Guide</div>&ndash;&gt;-->
97 <!-- &lt;!&ndash; </div>&ndash;&gt;--> 105 <!-- &lt;!&ndash; </div>&ndash;&gt;-->
98 <!-- </div>--> 106 <!-- </div>-->
99 <!-- </div>--> 107 <!-- </div>-->
100 </template> 108 </template>
101 109
102 <script setup> 110 <script setup>
...@@ -142,7 +150,7 @@ const goAround = () => { ...@@ -142,7 +150,7 @@ const goAround = () => {
142 right: 0; 150 right: 0;
143 top: 65%; 151 top: 65%;
144 z-index: 9; 152 z-index: 9;
145 153
146 .mlb { 154 .mlb {
147 background: #fff; 155 background: #fff;
148 border-radius: 10px 0 0 10px; 156 border-radius: 10px 0 0 10px;
...@@ -150,16 +158,16 @@ const goAround = () => { ...@@ -150,16 +158,16 @@ const goAround = () => {
150 padding: 10px 8px; 158 padding: 10px 8px;
151 text-align: center; 159 text-align: center;
152 cursor: pointer; 160 cursor: pointer;
153 161
154 div { 162 div {
155 text-transform: uppercase; 163 text-transform: uppercase;
156 } 164 }
157 165
158 div:first-child { 166 div:first-child {
159 border-bottom: 0.5px solid #eee; 167 border-bottom: 0.5px solid #eee;
160 //padding: 0 0 10px;margin-bottom: 10px; 168 //padding: 0 0 10px;margin-bottom: 10px;
161 } 169 }
162 170
163 div:hover { 171 div:hover {
164 .gradient-text { 172 .gradient-text {
165 font-weight: bold; 173 font-weight: bold;
...@@ -168,46 +176,48 @@ const goAround = () => { ...@@ -168,46 +176,48 @@ const goAround = () => {
168 } 176 }
169 } 177 }
170 178
171 .copyright {
172 font-size: 14px;
173 opacity: 0.88;
174 color: #4C5359;
175 }
176 179
177 .footAll { 180 .footAll {
178 background: #E0E3E5;; 181 //background: #E0E3E5;
182 background: url("@/assets/pc/bottom_bg.png");
179 padding: 36px 0 5px; 183 padding: 36px 0 5px;
180 184
181 p { 185 p {
182 font-size: 14px; 186 font-size: 14px;
183 opacity: 0.88; 187 opacity: 0.88;
184 color: #4C5359; 188 color: #4C5359;
185 } 189 }
186 190
187 ul { 191 ul {
188 list-style: none; 192 list-style: none;
189 193
190 li { 194 li {
191 line-height: 30px; 195 line-height: 30px;
192 font-size: 14px; 196 font-size: 14px;
193 opacity: 0.88; 197 opacity: 1;
194 color: #4C5359; 198 color: #fff;
195 199
196 a { 200 a {
197 margin-left: 15px; 201 margin-left: 15px;
198 202
199 &:hover { 203 &:hover {
200 text-decoration: underline; 204 text-decoration: underline;
201 } 205 }
202 } 206 }
203 } 207 }
204 } 208 }
205 209
206 img { 210 img {
207 height: 80px; 211 height: 80px;
208 } 212 }
209 } 213 }
210 214
215 .copyright {
216 font-size: 14px;
217 //opacity: 0.88;
218 color: #fff;
219 }
220
211 .gradient-text { 221 .gradient-text {
212 font-family: FZJunHeiS-B-GB; 222 font-family: FZJunHeiS-B-GB;
213 font-weight: 600; 223 font-weight: 600;
...@@ -223,23 +233,23 @@ const goAround = () => { ...@@ -223,23 +233,23 @@ const goAround = () => {
223 } 233 }
224 .footAll { 234 .footAll {
225 padding: 10px 0; 235 padding: 10px 0;
226 236
227 ul { 237 ul {
228 li { 238 li {
229 font-size: 10px; 239 font-size: 10px;
230 line-height: 1.4; 240 line-height: 1.4;
231 } 241 }
232 } 242 }
233 243
234 img { 244 img {
235 height: 60px; 245 height: 60px;
236 } 246 }
237 247
238 p { 248 p {
239 font-size: 10px; 249 font-size: 10px;
240 line-height: 1.4; 250 line-height: 1.4;
241 } 251 }
242 252
243 .copyright { 253 .copyright {
244 font-size: 10px; 254 font-size: 10px;
245 line-height: 1.4; 255 line-height: 1.4;
...@@ -249,7 +259,7 @@ const goAround = () => { ...@@ -249,7 +259,7 @@ const goAround = () => {
249 259
250 .ffoot { 260 .ffoot {
251 display: inline-flex; 261 display: inline-flex;
252 262
253 img { 263 img {
254 width: 20px; 264 width: 20px;
255 height: 20px; 265 height: 20px;
......
src/layoutPc/components/AppHeader.vue
1 <template> 1 <template>
2 <div class="topNav"> 2 <div class="topNav">
3 <router-link to="/"> 3 <router-link to="/">
4 <!-- <img class="logo" src="@/assets/v1/nav_logo.png">--> 4 <!-- <img class="logo" src="@/assets/v1/nav_logo.png">-->
5 <img class="logo" src="/img/logo.png"> 5 <img class="logo" src="/img/logo.png">
6 </router-link> 6 </router-link>
7 7
8 <div class="home-menu forPc"> 8 <div class="home-menu forPc">
9 <el-menu v-if="language==0" 9 <el-menu
10 router :default-active="activeIndex" :mode="mode" :ellipsis="true" 10 v-if="language==0"
11 popper-effect="dark" @select="handleSelect" 11 :default-active="activeIndex"
12 :ellipsis="true"
13 :mode="mode"
14 class="enMenu"
15 popper-effect="dark"
16 router
17 @select="handleSelect"
12 > 18 >
13 <el-menu-item index="/">{{ language==0?'首页':'HOME' }}</el-menu-item> 19 <el-menu-item index="/">{{ language == 0 ? '首页' : 'HOME' }}</el-menu-item>
14 <el-menu-item index="/news">{{ language==0?'新闻资讯':'NEWS' }}</el-menu-item> 20 <el-menu-item index="/news">{{ language == 0 ? '新闻资讯' : 'NEWS' }}</el-menu-item>
15 <el-menu-item index="/notice">{{ language==0?'通知公告':'NOTICEBOARD' }}</el-menu-item> 21 <el-menu-item index="/notice">{{ language == 0 ? '通知公告' : 'NOTICEBOARD' }}</el-menu-item>
16 <!-- <el-menu-item index="/match/list">{{ language==0?'赛事服务':'REGISTRATION' }}</el-menu-item>--> 22 <!-- <el-menu-item index="/match/list">{{ language==0?'赛事服务':'REGISTRATION' }}</el-menu-item>-->
17 <el-menu-item index="/saiC">{{ language==0?'竞赛日程':'COMPETITIONS' }}</el-menu-item> 23 <el-menu-item index="/saiC">{{ language == 0 ? '竞赛日程' : 'COMPETITIONS' }}</el-menu-item>
18 <el-menu-item index="/meta">{{ language==0?'媒体中心':'MEDIA' }}</el-menu-item> 24 <el-menu-item index="/meta">{{ language == 0 ? '媒体中心' : 'MEDIA' }}</el-menu-item>
19 <!-- <el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>--> 25 <!-- <el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>-->
20 <el-menu-item index="/about/wuDao">{{ language==0?'关于我们':'ABOUT US' }}</el-menu-item> 26 <el-menu-item index="/about/wuDao">{{ language == 0 ? '关于我们' : 'ABOUT US' }}</el-menu-item>
21 27
22 <!-- <el-sub-menu index="/about">--> 28 <!-- <el-sub-menu index="/about">-->
23 <!-- <el-menu-item index="/about/wuDao">{{ language==0?'舞蹈节':'About Us' }}</el-menu-item>--> 29 <!-- <el-menu-item index="/about/wuDao">{{ language==0?'舞蹈节':'About Us' }}</el-menu-item>-->
24 <!-- <el-menu-item index="/about/regulations" v-if="language==1">Rules & Regulations</el-menu-item>--> 30 <!-- <el-menu-item index="/about/regulations" v-if="language==1">Rules & Regulations</el-menu-item>-->
25 <!-- <el-menu-item index="/about/culture">{{ language==0?'地方文化':'Culture' }}</el-menu-item>--> 31 <!-- <el-menu-item index="/about/culture">{{ language==0?'地方文化':'Culture' }}</el-menu-item>-->
26 <!-- </el-sub-menu>--> 32 <!-- </el-sub-menu>-->
27 </el-menu> 33 </el-menu>
28 <el-menu v-else class="enMenu" 34 <el-menu
29 router :default-active="activeIndex" :mode="mode" :ellipsis="true" 35 v-else
30 popper-effect="dark" @select="handleSelect" 36 :default-active="activeIndex"
37 :ellipsis="true"
38 :mode="mode"
39 class="enMenu"
40 popper-effect="dark"
41 router
42 @select="handleSelect"
31 > 43 >
32 <el-menu-item index="/">{{ language==0?'首页':'HOME' }}</el-menu-item> 44 <el-menu-item index="/">{{ language == 0 ? '首页' : 'HOME' }}</el-menu-item>
33 <el-menu-item index="/news">{{ language==0?'新闻资讯':'NEWS' }}</el-menu-item> 45 <el-menu-item index="/news">{{ language == 0 ? '新闻资讯' : 'NEWS' }}</el-menu-item>
34 <el-menu-item index="/notice">{{ language==0?'通知公告':'NOTICEBOARD' }}</el-menu-item> 46 <el-menu-item index="/notice">{{ language == 0 ? '通知公告' : 'NOTICEBOARD' }}</el-menu-item>
35 <!-- <el-menu-item index="/match/list">{{ language==0?'赛事服务':'COMPETITION INFO' }}</el-menu-item>--> 47 <!-- <el-menu-item index="/match/list">{{ language==0?'赛事服务':'COMPETITION INFO' }}</el-menu-item>-->
36 <el-menu-item index="/saiC">{{ language==0?'竞赛日程':'COMPETITION SCHEDULE' }}</el-menu-item> 48 <el-menu-item index="/saiC">{{ language == 0 ? '竞赛日程' : 'COMPETITION SCHEDULE' }}</el-menu-item>
37 <el-menu-item index="/meta">{{ language==0?'媒体中心':'MEDIA' }}</el-menu-item> 49 <el-menu-item index="/meta">{{ language == 0 ? '媒体中心' : 'MEDIA' }}</el-menu-item>
38 <!-- <el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>--> 50 <!-- <el-menu-item index="/guide">{{ language==0?'参赛指南':'GUIDELINE' }}</el-menu-item>-->
39 <el-menu-item index="/about/wuDao">{{ language==0?'关于我们':'ABOUT US' }}</el-menu-item> 51 <el-menu-item index="/about/wuDao">{{ language == 0 ? '关于我们' : 'ABOUT US' }}</el-menu-item>
40 52
41 <!-- <el-sub-menu index="/about">--> 53 <!-- <el-sub-menu index="/about">-->
42 <!-- <el-menu-item index="/about/wuDaoEn">{{ language==0?'舞蹈节':'About Us' }}</el-menu-item>--> 54 <!-- <el-menu-item index="/about/wuDaoEn">{{ language==0?'舞蹈节':'About Us' }}</el-menu-item>-->
43 <!-- <el-menu-item index="/about/regulations" v-if="language==1">Rules & Regulations</el-menu-item>--> 55 <!-- <el-menu-item index="/about/regulations" v-if="language==1">Rules & Regulations</el-menu-item>-->
44 <!-- <el-menu-item index="/about/cultureEn">{{ language==0?'地方文化':'Culture' }}</el-menu-item>--> 56 <!-- <el-menu-item index="/about/cultureEn">{{ language==0?'地方文化':'Culture' }}</el-menu-item>-->
45 <!-- </el-sub-menu>--> 57 <!-- </el-sub-menu>-->
46 </el-menu> 58 </el-menu>
47 </div> 59 </div>
48 60
49 <div class="flex-right"> 61 <div class="flex-right">
50 <div class="search mr20 forPc"> 62 <div class="search mr20 forPc">
51 <el-button :icon="Search" circle @click="searchNews" /> 63 <el-button :icon="Search" circle @click="searchNews"/>
52 </div> 64 </div>
53 <div class="languageBtn"> 65 <div class="languageBtn">
54 <span :class="language==0?'active':''" @click="changeLanguage(0)">{{ language==0?'中文':'CN' }}</span> 66 <span :class="language==0?'active':''" @click="changeLanguage(0)">{{ language == 0 ? '中文' : 'CN' }}</span>
55 67
56 <span :class="language==1?'active':''" @click="changeLanguage(1)">EN</span> 68 <span :class="language==1?'active':''" @click="changeLanguage(1)">EN</span>
57 </div> 69 </div>
58 <div class="ml20 forPc" > 70 <div class="ml20 forPc">
59 <el-button v-if="!isLogin" @click="goLogin" style="border-radius: 20px;" class="loginBtn"> 71 <el-button v-if="!isLogin" class="loginBtn" link style="border-radius: 20px;" @click="goLogin">
60 <span>{{ language==0?'登录':'LOGIN' }}</span> 72 <span>{{ language == 0 ? '登录' : 'LOGIN' }}</span>
61 <!-- ｜ &nbsp;<span @click="goRegister">注册</span>--> 73 <!-- ｜ &nbsp;<span @click="goRegister">注册</span>-->
62 </el-button> 74 </el-button>
63 75
64 <el-dropdown v-if="isLogin" class="mr20"> 76 <el-dropdown v-if="isLogin" class="mr20">
65 77
66 <el-avatar :icon="UserFilled"> 78 <el-avatar :icon="UserFilled">
67 <!-- {{user.userName.substring(0,4)}}--> 79 <!-- {{user.userName.substring(0,4)}}-->
68 </el-avatar> 80 </el-avatar>
69 81
70 <template #dropdown> 82 <template #dropdown>
71 <el-dropdown-menu> 83 <el-dropdown-menu>
72 <el-dropdown-item @click="router.push('/center/myPassword')">{{ language==0?'个人中心':'Personal' }}</el-dropdown-item> 84 <el-dropdown-item @click="router.push('/center/myPassword')">{{
73 <el-dropdown-item @click="logout()">{{language==0?'退出':'Exit'}}</el-dropdown-item> 85 language == 0 ? '个人中心' : 'Personal'
86 }}
87 </el-dropdown-item>
88 <el-dropdown-item @click="logout()">{{ language == 0 ? '退出' : 'Exit' }}</el-dropdown-item>
74 </el-dropdown-menu> 89 </el-dropdown-menu>
75 </template> 90 </template>
76 </el-dropdown> 91 </el-dropdown>
...@@ -80,19 +95,21 @@ ...@@ -80,19 +95,21 @@
80 <img src="@/assets/v1/menu.png"> 95 <img src="@/assets/v1/menu.png">
81 </a> 96 </a>
82 </div> 97 </div>
83 98
84 <el-drawer 99 <el-drawer
85 v-model="drawer" size="100%" 100 v-model="drawer" :style="{'--el-drawer-padding-primary':0}"
86 :style="{'--el-drawer-padding-primary':0}" direction="ltr" 101 :with-header="false" direction="ltr"
87 :with-header="false" title="菜单" 102 size="100%" title="菜单"
88 > 103 >
89 <div class="weiHead"> 104 <div class="weiHead">
90 <el-button size="large" v-if="!isLogin" @click="goLogin" round style="color: #fff" class="btn-lineG"> 105 <el-button v-if="!isLogin" class="btn-lineG" round size="large" style="color: #fff" @click="goLogin">
91 <span>{{ language==0?'登录':'LOGIN' }}</span> 106 <span>{{ language == 0 ? '登录' : 'LOGIN' }}</span>
92 <!-- ｜ &nbsp;<span @click="goRegister">注册</span>--> 107 <!-- ｜ &nbsp;<span @click="goRegister">注册</span>-->
93 </el-button> 108 </el-button>
94 <el-button type="primary" round plain size="large" v-if="isLogin" @click="logout()">{{language==0?'退出':'Exit'}}</el-button> 109 <el-button v-if="isLogin" plain round size="large" type="primary" @click="logout()">
95 110 {{ language == 0 ? '退出' : 'Exit' }}
111 </el-button>
112
96 <div style="display: flex"> 113 <div style="display: flex">
97 <div class="languageBtn"> 114 <div class="languageBtn">
98 <span v-if="language==0" :class="language==0?'active':''" @click="changeLanguage(0)">中文</span> 115 <span v-if="language==0" :class="language==0?'active':''" @click="changeLanguage(0)">中文</span>
...@@ -100,16 +117,19 @@ ...@@ -100,16 +117,19 @@
100 | 117 |
101 <span :class="language==1?'active':''" @click="changeLanguage(1)">EN</span> 118 <span :class="language==1?'active':''" @click="changeLanguage(1)">EN</span>
102 </div> 119 </div>
103 120
104 <el-icon color="#453DEA" size="30" @click="closeDrawer"><close/></el-icon> 121 <el-icon color="#453DEA" size="30" @click="closeDrawer">
105 122 <close/>
123 </el-icon>
124
106 </div> 125 </div>
107 </div> 126 </div>
108 127
109 <el-menu class="weiMenu" 128 <el-menu
110 v-if="language==0" 129 v-if="language==0"
111 router :default-active="activeIndex" mode="vertical" :ellipsis="false" 130 :default-active="activeIndex"
112 popper-effect="dark" @select="handleSelect" 131 :ellipsis="false" class="weiMenu" mode="vertical" popper-effect="dark"
132 router @select="handleSelect"
113 > 133 >
114 <el-menu-item index="/">首页</el-menu-item> 134 <el-menu-item index="/">首页</el-menu-item>
115 <el-menu-item index="/news">新闻资讯</el-menu-item> 135 <el-menu-item index="/news">新闻资讯</el-menu-item>
...@@ -117,14 +137,15 @@ ...@@ -117,14 +137,15 @@
117 <el-menu-item index="/match/list">赛事服务</el-menu-item> 137 <el-menu-item index="/match/list">赛事服务</el-menu-item>
118 <el-menu-item index="/saiC">竞赛日程</el-menu-item> 138 <el-menu-item index="/saiC">竞赛日程</el-menu-item>
119 <el-menu-item index="/meta">媒体中心</el-menu-item> 139 <el-menu-item index="/meta">媒体中心</el-menu-item>
120 <!-- <el-menu-item index="/guide">参赛指南</el-menu-item>--> 140 <!-- <el-menu-item index="/guide">参赛指南</el-menu-item>-->
121 <el-menu-item index="/about/wuDao">关于我们</el-menu-item> 141 <el-menu-item index="/about/wuDao">关于我们</el-menu-item>
122 <el-menu-item v-if="isLogin" index="/center/myPassword">个人中心</el-menu-item> 142 <el-menu-item v-if="isLogin" index="/center/myPassword">个人中心</el-menu-item>
123 </el-menu> 143 </el-menu>
124 <el-menu class="weiMenu" 144 <el-menu
125 v-if="language==1" 145 v-if="language==1"
126 router :default-active="activeIndex" mode="vertical" :ellipsis="false" 146 :default-active="activeIndex"
127 popper-effect="dark" @select="handleSelect" 147 :ellipsis="false" class="weiMenu" mode="vertical" popper-effect="dark"
148 router @select="handleSelect"
128 > 149 >
129 <el-menu-item index="/">HOME</el-menu-item> 150 <el-menu-item index="/">HOME</el-menu-item>
130 <el-menu-item index="/news">NEWS</el-menu-item> 151 <el-menu-item index="/news">NEWS</el-menu-item>
...@@ -137,18 +158,18 @@ ...@@ -137,18 +158,18 @@
137 <el-menu-item v-if="isLogin" index="/center/myInfo">PERSONAL CENTER</el-menu-item> 158 <el-menu-item v-if="isLogin" index="/center/myInfo">PERSONAL CENTER</el-menu-item>
138 </el-menu> 159 </el-menu>
139 </el-drawer> 160 </el-drawer>
140 <LoginDialog ref="pcloginDialog" @submitForm="reFlash" /> 161 <LoginDialog ref="pcloginDialog" @submitForm="reFlash"/>
141 <VisitorLogin ref="visitorDialog" @submitForm="reFlash" /> 162 <VisitorLogin ref="visitorDialog" @submitForm="reFlash"/>
142 <SearchPop v-if="language==0" ref="searchDialog" /> 163 <SearchPop v-if="language==0" ref="searchDialog"/>
143 <SearchPop_en v-if="language==1" ref="searchDialog" /> 164 <SearchPop_en v-if="language==1" ref="searchDialog"/>
144 </template> 165 </template>
145 166
146 <script setup> 167 <script setup>
147 import { computed, ref, watch } from 'vue' 168 import {computed, ref, watch} from 'vue'
148 import { useRoute, useRouter } from 'vue-router' 169 import {useRoute, useRouter} from 'vue-router'
149 import useUserStore from '@/store/modules/user' 170 import useUserStore from '@/store/modules/user'
150 import { Search,UserFilled } from '@element-plus/icons-vue' 171 import {Search, UserFilled} from '@element-plus/icons-vue'
151 import { getCurrentInstance, onMounted } from '@vue/runtime-core' 172 import {getCurrentInstance, onMounted} from '@vue/runtime-core'
152 import _ from 'lodash' 173 import _ from 'lodash'
153 import LoginDialog from '@/viewsPc/login' 174 import LoginDialog from '@/viewsPc/login'
154 import VisitorLogin from '@/viewsPc/register/components/utype3' 175 import VisitorLogin from '@/viewsPc/register/components/utype3'
...@@ -161,7 +182,7 @@ import {useStorage} from "@vueuse/core"; ...@@ -161,7 +182,7 @@ import {useStorage} from "@vueuse/core";
161 182
162 const router = useRouter() 183 const router = useRouter()
163 const route = useRoute() 184 const route = useRoute()
164 const { proxy } = getCurrentInstance() 185 const {proxy} = getCurrentInstance()
165 const isLogin = ref(false) 186 const isLogin = ref(false)
166 const activeIndex = ref('/') 187 const activeIndex = ref('/')
167 const registerVisible = ref(false) 188 const registerVisible = ref(false)
...@@ -197,19 +218,23 @@ watch(() => route.fullPath, (val) => { ...@@ -197,19 +218,23 @@ watch(() => route.fullPath, (val) => {
197 } 218 }
198 console.log(activeIndex.value) 219 console.log(activeIndex.value)
199 }) 220 })
221
200 function changeLanguage(n) { 222 function changeLanguage(n) {
201 if(language.value == n){ 223 if (language.value == n) {
202 return 224 return
203 } 225 }
204 proxy.$modal.loading() 226 proxy.$modal.loading()
205 language.value = n 227 language.value = n
206 } 228 }
229
207 function showDrawer() { 230 function showDrawer() {
208 drawer.value = true 231 drawer.value = true
209 } 232 }
233
210 function closeDrawer() { 234 function closeDrawer() {
211 drawer.value = false 235 drawer.value = false
212 } 236 }
237
213 function handleSelect(key, keyPath) { 238 function handleSelect(key, keyPath) {
214 // console.log(key) 239 // console.log(key)
215 activeIndex.value = key 240 activeIndex.value = key
...@@ -217,7 +242,7 @@ function handleSelect(key, keyPath) { ...@@ -217,7 +242,7 @@ function handleSelect(key, keyPath) {
217 } 242 }
218 243
219 const logout = () => { 244 const logout = () => {
220 proxy.$modal.confirm(language.value==0?'确定退出？':'Are you sure to exit?').then(function() { 245 proxy.$modal.confirm(language.value == 0 ? '确定退出？' : 'Are you sure to exit?').then(function () {
221 return useUserStore().logOut() 246 return useUserStore().logOut()
222 }).then(() => { 247 }).then(() => {
223 isLogin.value = true 248 isLogin.value = true
...@@ -252,66 +277,90 @@ watch(() => useUserStore().visitor, (val) => { ...@@ -252,66 +277,90 @@ watch(() => useUserStore().visitor, (val) => {
252 proxy.$refs['visitorDialog'].open() 277 proxy.$refs['visitorDialog'].open()
253 } 278 }
254 }) 279 })
280
255 function searchNews() { 281 function searchNews() {
256 proxy.$refs['searchDialog'].open() 282 proxy.$refs['searchDialog'].open()
257 } 283 }
284
258 function getCode() { 285 function getCode() {
259 proxy.$refs['codeRef'].getCode() 286 proxy.$refs['codeRef'].getCode()
260 } 287 }
261 </script> 288 </script>
262 289
263 <style scoped lang="scss"> 290 <style lang="scss" scoped>
264 .home-menu{width: 60vw; 291 .home-menu {
265 :deep(.el-menu--horizontal.el-menu){border: none;} 292 width: 60vw;
293
294 :deep(.el-menu--horizontal.el-menu) {
295 border: none;
296 }
297 }
298
299 .enMenu {
300 background: transparent;
266 } 301 }
267 .loginBtn {color: #fff;margin-right: 15px;border: none; 302
268 background: #000;box-shadow:0 0 10px #fff; 303 .loginBtn {
304 color: #fff;
305 margin-right: 15px;
306 border: none;
307 background: transparent;
308 font-size: 16px;
309 font-weight: bold;
310 //box-shadow: 0 0 10px #fff;
311
269 &:hover { 312 &:hover {
270 box-shadow:0 0 10px #000;border: none; 313 //box-shadow: 0 0 10px #000;
271 color:#fff; 314 border: none;
315 color: #fff;
272 } 316 }
273 317
274 } 318 }
275 319
276 320
277 .topNav { 321 .topNav {
278 box-shadow: 0px 0px 13px rgba(113,113,113); 322 box-shadow: 0px 0px 13px rgba(113, 113, 113);
279 display: flex; 323 display: flex;
280 justify-content: space-between; 324 justify-content: space-between;
281 height: 80px; 325 height: 80px;
282 align-items: center; 326 align-items: center;
283 327 background-image: url("@/assets/pc/nav_bg.png");
328 background-size: 100%;
329
284 .logo { 330 .logo {
285 height: 60px; 331 height: 60px;
286 margin-left: 40px; 332 margin-left: 40px;
287 } 333 }
288 334
289 .flex-right { 335 .flex-right {
290 display: flex; 336 display: flex;
291 align-items: center; 337 align-items: center;
292 } 338 }
293 339
294 .search { 340 .search {
295 position: relative; 341 position: relative;
296 342
297 .el-button.is-circle:hover { 343 .el-button.is-circle:hover {
298 color:var(--el-color-primary); 344 color: var(--el-color-primary);
299 border-color: var(--el-color-primary); 345 border-color: var(--el-color-primary);
300 } 346 }
347
301 .el-button.is-circle:active { 348 .el-button.is-circle:active {
302 background: var(--el-color-primary); 349 background: var(--el-color-primary);
303 color: #fff; 350 color: #fff;
304 border-color: var(--el-color-primary); 351 border-color: var(--el-color-primary);
305 } 352 }
353
306 .el-button.is-circle:focus { 354 .el-button.is-circle:focus {
307 border-color: var(--el-color-primary) 355 border-color: var(--el-color-primary)
308 } 356 }
357
309 :deep(.el-input .el-input__wrapper) { 358 :deep(.el-input .el-input__wrapper) {
310 box-shadow: none; 359 box-shadow: none;
311 border-radius: 18px; 360 border-radius: 18px;
312 background: #F4F4F4; 361 background: #F4F4F4;
313 } 362 }
314 363
315 .el-icon { 364 .el-icon {
316 position: absolute; 365 position: absolute;
317 right: 5px; 366 right: 5px;
...@@ -325,45 +374,100 @@ function getCode() { ...@@ -325,45 +374,100 @@ function getCode() {
325 } 374 }
326 375
327 376
328 .ropenbtn{padding: 10px;display: none; 377 .ropenbtn {
329 img{ width: 44px; filter: grayscale(1);} 378 padding: 10px;
379 display: none;
380
381 img {
382 width: 44px;
383 filter: grayscale(1);
330 } 384 }
385 }
386
387 :deep(.el-input) {
388 height: 100%
389 }
390
391 :deep(.el-form-item) {
392 height: 40px;
393 }
394
395 .home-menu .el-sub-menu {
396 font-size: 16px;
397 }
331 398
332 :deep(.el-input){height: 100%} 399 .weiMenu.el-menu {
333 :deep(.el-form-item){height: 40px;}
334 .home-menu .el-sub-menu{font-size: 16px;}
335 .weiMenu.el-menu{
336 border: none; 400 border: none;
337 :deep(.el-menu-item.is-active){color: var(--el-color-primary);} 401
402 :deep(.el-menu-item.is-active) {
403 color: var(--el-color-primary);
404 }
338 } 405 }
339 .weiHead{display: flex;justify-content: space-between;padding: 15px;align-items: center; 406
407 .weiHead {
408 display: flex;
409 justify-content: space-between;
410 padding: 15px;
411 align-items: center;
340 width: 100%; 412 width: 100%;
341 .languageBtn{font-size: 20px;line-height: 30px;white-space: nowrap;margin-right: 20px;} 413
414 .languageBtn {
415 font-size: 20px;
416 line-height: 30px;
417 white-space: nowrap;
418 margin-right: 20px;
419 }
342 } 420 }
343 .weiMenu{ 421
344 .el-menu-item{font-size: 20px} 422 .weiMenu {
345 :deep(.el-sub-menu__title){font-size: 20px} 423 .el-menu-item {
346 :deep(.el-sub-menu .el-sub-menu__icon-arrow){font-size: 20px} 424 font-size: 20px
425 }
426
427 :deep(.el-sub-menu__title) {
428 font-size: 20px
429 }
430
431 :deep(.el-sub-menu .el-sub-menu__icon-arrow) {
432 font-size: 20px
433 }
347 } 434 }
435
348 @media (max-width: 1675px) { 436 @media (max-width: 1675px) {
349 .search { 437 .search {
350 display: none; 438 display: none;
351 } 439 }
352 } 440 }
441
353 @media (max-width: 1620px) { 442 @media (max-width: 1620px) {
354 .home-menu .el-menu--horizontal > .el-menu-item{margin: 0 2px; } 443 .home-menu .el-menu--horizontal > .el-menu-item {
444 margin: 0 2px;
445 }
355 } 446 }
447
356 @media (max-width: 1450px) { 448 @media (max-width: 1450px) {
357 .home-menu .el-menu--horizontal > .el-menu-item{font-size: 15px} 449 .home-menu .el-menu--horizontal > .el-menu-item {
450 font-size: 15px
451 }
358 } 452 }
359 @media (max-width: 1340px) {
360 453
361 .home-menu .el-menu--horizontal > .el-menu-item{margin: 0; } 454 @media (max-width: 1340px) {
455
456 .home-menu .el-menu--horizontal > .el-menu-item {
457 margin: 0;
458 }
362 } 459 }
460
363 @media (max-width: 1250px) { 461 @media (max-width: 1250px) {
364 .home-menu .el-menu--horizontal > .el-menu-item{font-size: 14px} 462 .home-menu .el-menu--horizontal > .el-menu-item {
365 .topNav .logo{height: 50px;margin-left: 20px} 463 font-size: 14px
464 }
465 .topNav .logo {
466 height: 50px;
467 margin-left: 20px
468 }
366 } 469 }
470
367 @media (max-width: 1000px) { 471 @media (max-width: 1000px) {
368 .box { 472 .box {
369 width: 100% 473 width: 100%
...@@ -371,10 +475,17 @@ function getCode() { ...@@ -371,10 +475,17 @@ function getCode() {
371 .forPc { 475 .forPc {
372 display: none; 476 display: none;
373 } 477 }
374 .ropenbtn{display: block} 478 .ropenbtn {
479 display: block
480 }
375 .loginBtn { 481 .loginBtn {
376 display: none; 482 display: none;
377 } 483 }
378 } 484 }
485
486 .active {
487 color: #fff;
488 border-bottom: 2px solid #fff;
489 }
379 </style> 490 </style>
380 491
......
src/layoutPc/components/indexSearch.vue
1 <template> 1 <template>
2 <el-dialog 2 <el-dialog
3 v-model="show" class="searchpp" width="80vw" append-to-body title="搜索" 3 v-model="show"
4 :close-on-click-modal="true"
5 :modal="false"
6 :show-close="true"
7 append-to-body
8 class="searchpp"
9 destroy-on-close
10 style="padding-top: 10px"
11 title="搜索"
4 top="80px" 12 top="80px"
5 destroy-on-close :show-close="true" :close-on-click-modal="true" :modal="false" 13 width="80vw"
6 > 14 >
7 <div class="searchBody"> 15 <div class="searchBody">
8 <div class="searchline"> 16 <div class="searchline">
9 <el-input v-model="query.name" placeholder="请输入关键词搜索" @change="search" /> 17 <el-input v-model="query.name" placeholder="请输入关键词搜索" @change="search"/>
10 <el-button :icon="Search" @click="search">搜索</el-button> 18 <el-button :icon="Search" @click="search">搜索</el-button>
11 </div> 19 </div>
12 <div class="hotword" hidden> 20 <div class="hotword" hidden>
...@@ -15,7 +23,7 @@ ...@@ -15,7 +23,7 @@
15 <span>2024年奥运会</span> 23 <span>2024年奥运会</span>
16 </div> 24 </div>
17 <h2>近期热门</h2> 25 <h2>近期热门</h2>
18 <el-row class="newsimgcover" :gutter="20"> 26 <el-row :gutter="20" class="newsimgcover">
19 <el-col v-for="(n,index) in hottest" v-show="index<4" :key="index" :span="6"> 27 <el-col v-for="(n,index) in hottest" v-show="index<4" :key="index" :span="6">
20 <div class="item shadow" @click="goDetail(n)"> 28 <div class="item shadow" @click="goDetail(n)">
21 <div class="imgbox"><img :src="fillImgUrl_webSite(n.picUrl)"></div> 29 <div class="imgbox"><img :src="fillImgUrl_webSite(n.picUrl)"></div>
...@@ -23,17 +31,18 @@ ...@@ -23,17 +31,18 @@
23 </div> 31 </div>
24 </el-col> 32 </el-col>
25 </el-row> 33 </el-row>
26 34
27 </div> 35 </div>
28 </el-dialog> 36 </el-dialog>
29 </template> 37 </template>
30 38
31 <script setup> 39 <script setup>
32 import { onMounted, ref } from 'vue' 40 import {onMounted, ref} from 'vue'
33 import { Search } from '@element-plus/icons-vue' 41 import {Search} from '@element-plus/icons-vue'
42
34 const router = useRouter() 43 const router = useRouter()
35 import { getHottest } from '@/apiPc/webSite' 44 import {getHottest} from '@/apiPc/webSite'
36 import { useRouter } from 'vue-router' 45 import {useRouter} from 'vue-router'
37 46
38 const show = ref(false) 47 const show = ref(false)
39 const query = ref({}) 48 const query = ref({})
...@@ -61,6 +70,7 @@ function search() { ...@@ -61,6 +70,7 @@ function search() {
61 } 70 }
62 }) 71 })
63 } 72 }
73
64 const goDetail = (n) => { 74 const goDetail = (n) => {
65 show.value = false 75 show.value = false
66 if (n.isOut == '1') { 76 if (n.isOut == '1') {
...@@ -73,7 +83,7 @@ const goDetail = (n) => { ...@@ -73,7 +83,7 @@ const goDetail = (n) => {
73 } 83 }
74 </script> 84 </script>
75 85
76 <style scoped lang="scss"> 86 <style lang="scss" scoped>
77 h2 { 87 h2 {
78 font-size: 24px; 88 font-size: 24px;
79 margin: 30px 0 15px; 89 margin: 30px 0 15px;
...@@ -83,11 +93,11 @@ h2 { ...@@ -83,11 +93,11 @@ h2 {
83 margin: 0; 93 margin: 0;
84 font-size: 18px; 94 font-size: 18px;
85 color: #7B7F83; 95 color: #7B7F83;
86 96
87 span { 97 span {
88 margin-right: 20px; 98 margin-right: 20px;
89 cursor: pointer; 99 cursor: pointer;
90 100
91 &:hover { 101 &:hover {
92 text-decoration: underline; 102 text-decoration: underline;
93 } 103 }
...@@ -103,14 +113,14 @@ h2 { ...@@ -103,14 +113,14 @@ h2 {
103 height: 60px; 113 height: 60px;
104 margin: 30px 0; 114 margin: 30px 0;
105 background: #F8F8F8; 115 background: #F8F8F8;
106 116
107 .el-input { 117 .el-input {
108 border: none; 118 border: none;
109 background: transparent; 119 background: transparent;
110 outline: none; 120 outline: none;
111 font-size: 18px; 121 font-size: 18px;
112 } 122 }
113 123
114 .el-button { 124 .el-button {
115 width: 130px; 125 width: 130px;
116 font-size: 20px; 126 font-size: 20px;
...@@ -120,7 +130,7 @@ h2 { ...@@ -120,7 +130,7 @@ h2 {
120 background: #000;; 130 background: #000;;
121 border-radius: 0px 5px 5px 0px; 131 border-radius: 0px 5px 5px 0px;
122 } 132 }
123 133
124 :deep(.el-input__wrapper) { 134 :deep(.el-input__wrapper) {
125 background-color: transparent; 135 background-color: transparent;
126 box-shadow: none; 136 box-shadow: none;
......
src/viewsPc/components/homeQuick.vue
...@@ -2,19 +2,35 @@ ...@@ -2,19 +2,35 @@
2 <div v-if="language === 0" class="itemBox"> 2 <div v-if="language === 0" class="itemBox">
3 <el-row :gutter="20"> 3 <el-row :gutter="20">
4 <el-col :lg="4" :sm="12" :xs="12"> 4 <el-col :lg="4" :sm="12" :xs="12">
5 <div class="item" @click="popRemark(0)"><img src="@/assets/dance/btn01.png">签证服务</div> 5 <div class="item bgImg1" @click="popRemark(0)">
6 <!-- <img src="@/assets/dance/btn01.png">-->
7 签证服务
8 </div>
6 </el-col> 9 </el-col>
7 <el-col :lg="4" :sm="12" :xs="12"> 10 <el-col :lg="4" :sm="12" :xs="12">
8 <div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn02.png">酒店预订</div> 11 <div class="item bgImg2" @click="popRemark(1)">
12 <!-- <img src="@/assets/dance/btn02.png">-->
13 酒店预订
14 </div>
9 </el-col> 15 </el-col>
10 <el-col :lg="4" :sm="12" :xs="12"> 16 <el-col :lg="4" :sm="12" :xs="12">
11 <div class="item" @click="popRemark(2)"><img src="@/assets/dance/btn03.png">接送服务</div> 17 <div class="item bgImg3" @click="popRemark(2)">
18 <!-- <img src="@/assets/dance/btn03.png">-->
19 接送服务
20 </div>
21
12 </el-col> 22 </el-col>
13 <el-col :lg="4" :sm="12" :xs="12"> 23 <el-col :lg="4" :sm="12" :xs="12">
14 <div class="item" @click="popRemark(10)"><img src="@/assets/dance/btn04.png">票务服务</div> 24 <div class="item bgImg4" @click="popRemark(10)">
25 <!-- <img src="@/assets/dance/btn04.png">-->
26 票务服务
27 </div>
15 </el-col> 28 </el-col>
16 <el-col :lg="4" :sm="12" :xs="12"> 29 <el-col :lg="4" :sm="12" :xs="12">
17 <div class="item" @click="goMedia"><img src="@/assets/dance/btn07.png">媒体注册</div> 30 <div class="item bgImg5" @click="goMedia">
31 <!-- <img src="@/assets/dance/btn07.png">-->
32 媒体注册
33 </div>
18 </el-col> 34 </el-col>
19 <!-- <el-col :sm="12" :lg="4" :xs="12">--> 35 <!-- <el-col :sm="12" :lg="4" :xs="12">-->
20 <!-- <div class="item" @click="goAround"><img src="@/assets/dance/btn06.png">周边活动</div>--> 36 <!-- <div class="item" @click="goAround"><img src="@/assets/dance/btn06.png">周边活动</div>-->
...@@ -27,24 +43,39 @@ ...@@ -27,24 +43,39 @@
27 <div v-else class="itemBox_en"> 43 <div v-else class="itemBox_en">
28 <el-row :gutter="20" justify="space-around"> 44 <el-row :gutter="20" justify="space-around">
29 <el-col :lg="4" :sm="12" :xs="12"> 45 <el-col :lg="4" :sm="12" :xs="12">
30 <div class="item" @click="popRemark(0)"><img src="@/assets/dance/btn01.png">Visa Services</div> 46 <div class="item bgImg1" @click="popRemark(0)">
47 <!-- <img src="@/assets/dance/btn01.png">-->
48 Visa Services
49 </div>
31 </el-col> 50 </el-col>
32 <el-col :lg="4" :sm="12" :xs="12"> 51 <el-col :lg="4" :sm="12" :xs="12">
33 <div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn02.png">HOTEL RESERVATION</div> 52 <div class="item bgImg2" @click="popRemark(1)">
53 <!-- <img src="@/assets/dance/btn02.png">-->
54 HOTEL RESERVATION
55 </div>
34 </el-col> 56 </el-col>
35 <el-col :lg="4" :sm="12" :xs="12"> 57 <el-col :lg="4" :sm="12" :xs="12">
36 <div class="item" @click="popRemark(2)"><img src="@/assets/dance/btn03.png">TRANSPORTATION RESERVATION</div> 58 <div class="item bgImg3" @click="popRemark(2)">
59 <!-- <img src="@/assets/dance/btn03.png">-->
60 TRANSPORTATION RESERVATION
61 </div>
37 </el-col> 62 </el-col>
38 <el-col :lg="4" :sm="12" :xs="12"> 63 <el-col :lg="4" :sm="12" :xs="12">
39 <div class="item" @click="popRemark(10)"><img src="@/assets/dance/btn04.png">TICKET SERVICES</div> 64 <div class="item bgImg4" @click="popRemark(10)">
65 <!-- <img src="@/assets/dance/btn04.png">-->
66 TICKET SERVICES
67 </div>
40 </el-col> 68 </el-col>
41 <el-col :lg="4" :sm="12" :xs="12"> 69 <el-col :lg="4" :sm="12" :xs="12">
42 <div class="item" @click="goMedia"><img src="@/assets/dance/btn07.png">Media Registration</div> 70 <div class="item bgImg5" @click="goMedia">
71 <!-- <img src="@/assets/dance/btn07.png">-->
72 Media Registration
73 </div>
43 </el-col> 74 </el-col>
44 <!-- <el-col :sm="12" :lg="4" :xs="12">--> 75 <!-- <el-col :sm="12" :lg="4" :xs="12">-->
45 <!-- <div class="item" @click="goAround"><img src="@/assets/dance/btn06.png">Around Activity</div>--> 76 <!-- <div class="item" @click="goAround"><img src="@/assets/dance/btn06.png">Around Activity</div>-->
46 <!-- </el-col>--> 77 <!-- </el-col>-->
47 78
48 <!-- <el-col :sm="12" :lg="4" :xs="12">--> 79 <!-- <el-col :sm="12" :lg="4" :xs="12">-->
49 <!-- <div class="item" @click="liveClick"><img src="@/assets/dance/btn05.png">live streaming</div>--> 80 <!-- <div class="item" @click="liveClick"><img src="@/assets/dance/btn05.png">live streaming</div>-->
50 <!-- </el-col>--> 81 <!-- </el-col>-->
...@@ -101,7 +132,7 @@ watch(matchId, (val) => { ...@@ -101,7 +132,7 @@ watch(matchId, (val) => {
101 console.log(err) 132 console.log(err)
102 form.value = null 133 form.value = null
103 }) 134 })
104 135
105 match.getInfoByCptId({cptId: props.matchId}).then((res) => { 136 match.getInfoByCptId({cptId: props.matchId}).then((res) => {
106 liveData.value = res.data || {} 137 liveData.value = res.data || {}
107 }) 138 })
...@@ -110,9 +141,9 @@ watch(matchId, (val) => { ...@@ -110,9 +141,9 @@ watch(matchId, (val) => {
110 141
111 const liveClick = () => { 142 const liveClick = () => {
112 if (liveData.value.videoStatus == "1") { 143 if (liveData.value.videoStatus == "1") {
113 144
114 if (language.value == 0) { 145 if (language.value == 0) {
115 146
116 window.open(liveData.value.videoUrlCn) 147 window.open(liveData.value.videoUrlCn)
117 } else { 148 } else {
118 window.open(liveData.value.videoUrlEn) 149 window.open(liveData.value.videoUrlEn)
...@@ -136,7 +167,7 @@ onMounted(() => { ...@@ -136,7 +167,7 @@ onMounted(() => {
136 167
137 function building() { 168 function building() {
138 ElMessage.warning(language.value == 0 ? '感谢您对本次比赛的关注，该服务暂无可预订信息，敬请期待。' : 'Thank you for your attention to this competition. The service is currently unavailable for booking. Please stay tuned.') 169 ElMessage.warning(language.value == 0 ? '感谢您对本次比赛的关注，该服务暂无可预订信息，敬请期待。' : 'Thank you for your attention to this competition. The service is currently unavailable for booking. Please stay tuned.')
139 170
140 } 171 }
141 172
142 function applyInvitation() { 173 function applyInvitation() {
...@@ -163,19 +194,19 @@ function goMedia() { ...@@ -163,19 +194,19 @@ function goMedia() {
163 useStore.setVisitor() 194 useStore.setVisitor()
164 return 195 return
165 } 196 }
166 197
167 proxy.$refs['mediaRegisterRef'].open({cptId: matchId.value}) 198 proxy.$refs['mediaRegisterRef'].open({cptId: matchId.value})
168 } 199 }
169 200
170 function popRemark(type) { 201 function popRemark(type) {
171 if(!matchId.value){ 202 if (!matchId.value) {
172 return; 203 return;
173 } 204 }
174 if (!form.value) { 205 if (!form.value) {
175 building() 206 building()
176 return 207 return
177 } 208 }
178 209
179 if (type == '0') { 210 if (type == '0') {
180 // ElMessage.warning('The visa invitation letter application will be available soon. Thank you for your patience.') 211 // ElMessage.warning('The visa invitation letter application will be available soon. Thank you for your patience.')
181 // return; 212 // return;
...@@ -188,7 +219,7 @@ function popRemark(type) { ...@@ -188,7 +219,7 @@ function popRemark(type) {
188 building() 219 building()
189 return 220 return
190 } 221 }
191 222
192 if (!useStore.user) { 223 if (!useStore.user) {
193 // ElMessage({ 224 // ElMessage({
194 // type: 'warning', 225 // type: 'warning',
...@@ -197,12 +228,12 @@ function popRemark(type) { ...@@ -197,12 +228,12 @@ function popRemark(type) {
197 useStore.setVisitor() 228 useStore.setVisitor()
198 return 229 return
199 } 230 }
200 231
201 applyInvitation() 232 applyInvitation()
202 return 233 return
203 } 234 }
204 } 235 }
205 236
206 if ((form.value.isJdView == 0 && type == '1') 237 if ((form.value.isJdView == 0 && type == '1')
207 || (form.value.isCarView == 0 && type == '2') 238 || (form.value.isCarView == 0 && type == '2')
208 || (form.value.isFoodView == 0 && type == '3') 239 || (form.value.isFoodView == 0 && type == '3')
...@@ -213,7 +244,7 @@ function popRemark(type) { ...@@ -213,7 +244,7 @@ function popRemark(type) {
213 building() 244 building()
214 return 245 return
215 } 246 }
216 247
217 if (type == '2') { 248 if (type == '2') {
218 if (!useStore.user) { 249 if (!useStore.user) {
219 // ElMessage({ 250 // ElMessage({
...@@ -223,12 +254,12 @@ function popRemark(type) { ...@@ -223,12 +254,12 @@ function popRemark(type) {
223 useStore.setVisitor() 254 useStore.setVisitor()
224 return 255 return
225 } 256 }
226 257
227 emit("pickUp") 258 emit("pickUp")
228 return; 259 return;
229 } 260 }
230 261
231 262
232 const params = { 263 const params = {
233 matchId: props.matchId, 264 matchId: props.matchId,
234 title: language.value == 0 ? '预订说明' : 'Booking Instructions', 265 title: language.value == 0 ? '预订说明' : 'Booking Instructions',
...@@ -236,7 +267,7 @@ function popRemark(type) { ...@@ -236,7 +267,7 @@ function popRemark(type) {
236 cptName: props.cptName 267 cptName: props.cptName
237 } 268 }
238 proxy.$refs['orderRemarkRef'].open(params) 269 proxy.$refs['orderRemarkRef'].open(params)
239 270
240 // goBooking(type) 271 // goBooking(type)
241 } 272 }
242 273
...@@ -244,7 +275,7 @@ function goBooking(n, f) { ...@@ -244,7 +275,7 @@ function goBooking(n, f) {
244 switch (n) { 275 switch (n) {
245 case 10: 276 case 10:
246 // 票务 277 // 票务
247 278
248 // router.push({ 279 // router.push({
249 // path: `/booking/ticket/${props.matchId}`, 280 // path: `/booking/ticket/${props.matchId}`,
250 // params: {id:props.matchId}, 281 // params: {id:props.matchId},
...@@ -281,7 +312,7 @@ function goBooking(n, f) { ...@@ -281,7 +312,7 @@ function goBooking(n, f) {
281 <style lang="scss" scoped> 312 <style lang="scss" scoped>
282 .itemBox, .itemBox_en { 313 .itemBox, .itemBox_en {
283 padding: 20px; 314 padding: 20px;
284 background: #fff; 315 background: #211D50;
285 box-shadow: 0 0 46px 0 rgba(1, 16, 64, 0.08); 316 box-shadow: 0 0 46px 0 rgba(1, 16, 64, 0.08);
286 border-radius: 20px; 317 border-radius: 20px;
287 } 318 }
...@@ -298,39 +329,72 @@ function goBooking(n, f) { ...@@ -298,39 +329,72 @@ function goBooking(n, f) {
298 align-items: center; 329 align-items: center;
299 justify-content: center; 330 justify-content: center;
300 font-size: 20px; 331 font-size: 20px;
301 background: url("@/assets/dance/btn_bg.png") no-repeat left #FFFFFF; 332 //background: url("@/assets/dance/btn_bg.png") no-repeat left #FFFFFF;
302 background-size: 100% 100%; 333 background-size: 100% 100%;
303 border-radius: 15px; 334 border-radius: 15px;
304 gap: 10px; 335 gap: 10px;
305 336 color: #fff;
306 img { 337 height: 95px;
307 object-fit: contain; 338
308 width: 75px; 339 &:hover {
309 height: 75px; 340 box-shadow: 0 0 10px #eee;
341
342 //img {
343 // transform: rotateY(180deg);
344 //}
345 //
346 //p {
347 // color: #000;
348 //}
310 } 349 }
311 } 350 }
312 351
352 .bgImg1 {
353 background: url("@/assets/pc/btn_bg01.png") no-repeat;
354 background-size: 100%;
355 }
356
357 .bgImg2 {
358 background: url("@/assets/pc/btn_bg02.png") no-repeat;
359 background-size: 100%;
360 }
361
362 .bgImg3 {
363 background: url("@/assets/pc/btn_bg03.png") no-repeat;
364 background-size: 100%;
365 }
366
367 .bgImg4 {
368 background: url("@/assets/pc/btn_bg04.png") no-repeat;
369 background-size: 100%;
370 }
371
372 .bgImg5 {
373 background: url("@/assets/pc/btn_bg05.png") no-repeat;
374 background-size: 100%;
375 }
376
313 .itemBox_en .item { 377 .itemBox_en .item {
314 flex-direction: column; 378 flex-direction: column;
315 text-align: center; 379 text-align: center;
316 text-transform: uppercase; 380 text-transform: uppercase;
317 height: 100%; 381 height: 100%;
318 382
319 img { 383 img {
320 position: relative; 384 position: relative;
321 transition: all 0.2s; 385 transition: all 0.2s;
322 } 386 }
323 387
324 &:hover { 388 &:hover {
325 box-shadow: 0 0 10px #eee; 389 box-shadow: 0 0 10px #eee;
326 390
327 img { 391 //img {
328 transform: rotateY(180deg); 392 // transform: rotateY(180deg);
329 } 393 //}
330 394 //
331 p { 395 //p {
332 color: #000; 396 // color: #000;
333 } 397 //}
334 } 398 }
335 } 399 }
336 400
...@@ -343,7 +407,7 @@ function goBooking(n, f) { ...@@ -343,7 +407,7 @@ function goBooking(n, f) {
343 height: auto !important; 407 height: auto !important;
344 padding: 15px 0; 408 padding: 15px 0;
345 margin: 10px 0; 409 margin: 10px 0;
346 410
347 img { 411 img {
348 width: 50px; 412 width: 50px;
349 height: 50px 413 height: 50px
...@@ -353,5 +417,7 @@ function goBooking(n, f) { ...@@ -353,5 +417,7 @@ function goBooking(n, f) {
353 max-width: 50%; 417 max-width: 50%;
354 flex: 0 0 50%; 418 flex: 0 0 50%;
355 } 419 }
420
421
356 } 422 }
357 </style> 423 </style>
......
vite.config.js
...@@ -83,11 +83,11 @@ export default defineConfig(({mode, command}) => { ...@@ -83,11 +83,11 @@ export default defineConfig(({mode, command}) => {
83 rewrite: (p) => p.replace(/^\/dev-api\/ztx-webSite/, '') 83 rewrite: (p) => p.replace(/^\/dev-api\/ztx-webSite/, '')
84 }, 84 },
85 '/dev-api': { 85 '/dev-api': {
86 target: 'http://192.168.1.118:8082/', 86 // target: 'http://192.168.1.118:8082/',
87 // target: 'http://192.168.1.131:8081/', 87 // target: 'http://192.168.1.131:8081/',
88 // target: 'https://jijin.wtwuxicenter.com/stage-api', 88 // target: 'https://tk005.wxjylt.com/stage-api',
89 // target: 'http://124.70.181.90:1880/stage-api', 89 // target: 'http://124.70.181.90:1880/stage-api',
90 // target: 'https://sys.2025wtcwuxi.com/stage-api/', 90 target: 'https://sys.2025wtcwuxi.com/stage-api/',
91 changeOrigin: true, 91 changeOrigin: true,
92 rewrite: (p) => p.replace(/^\/dev-api/, '') 92 rewrite: (p) => p.replace(/^\/dev-api/, '')
93 }, 93 },
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!