111
This commit is contained in:
@@ -10,6 +10,7 @@ export default defineNuxtConfig({
|
|||||||
|
|
||||||
// 开发服务器配置
|
// 开发服务器配置
|
||||||
devServer: {
|
devServer: {
|
||||||
|
host: '0.0.0.0',
|
||||||
port: 5068,
|
port: 5068,
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -1 +1,510 @@
|
|||||||
/* 全局扩展样式留空,默认使用 Vant 样式体系。 */
|
body, div, p, a, table, textarea, form, img, ul, li {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0 auto;
|
||||||
|
line-height: 1.5;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.game_nav {
|
||||||
|
background: #302828;
|
||||||
|
color: white;
|
||||||
|
font-size: 15px;
|
||||||
|
padding: 2px 0px 2px 3px;
|
||||||
|
color: white;
|
||||||
|
font-style: italic;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
}
|
||||||
|
|
||||||
|
div {
|
||||||
|
margin: 5px 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
div img {
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
div img {
|
||||||
|
max-width: 100%;
|
||||||
|
width: exPRession(document.body.clientWidth>250?"250px":"auto");
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
max-height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.step-logo {
|
||||||
|
max-height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head {
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
}
|
||||||
|
|
||||||
|
.border {
|
||||||
|
border-bottom: 1px dashed #9f8d8d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tips {
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu {
|
||||||
|
}
|
||||||
|
|
||||||
|
.clear {
|
||||||
|
height: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.foot {
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #1e5494;
|
||||||
|
margin: 0 5px;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:link {
|
||||||
|
color: #1e5494;
|
||||||
|
/*display: inline-block;*/
|
||||||
|
margin: 3px 4px 3px 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover, a:active, a:focus {
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: #1e5494;
|
||||||
|
}
|
||||||
|
|
||||||
|
.a-nomargin {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.a-nodec {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-red {
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-red a {
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-msg {
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.common {
|
||||||
|
}
|
||||||
|
|
||||||
|
.common img {
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.PageTips {
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.algin-center {
|
||||||
|
text-align: center
|
||||||
|
}
|
||||||
|
|
||||||
|
.input {
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ipt {
|
||||||
|
width: 60%;
|
||||||
|
display: block;
|
||||||
|
padding: 6px 12px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #555;
|
||||||
|
background-color: #fff;
|
||||||
|
background-image: none;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 4px;
|
||||||
|
box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
|
||||||
|
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
display: inline-block;
|
||||||
|
margin-bottom: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
text-align: center;
|
||||||
|
white-space: nowrap;
|
||||||
|
vertical-align: middle;
|
||||||
|
-ms-touch-action: manipulation;
|
||||||
|
touch-action: manipulation;
|
||||||
|
cursor: pointer;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
background-image: none;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-danger {
|
||||||
|
color: #fff;
|
||||||
|
background-color: #d9534f;
|
||||||
|
border-color: #d43f3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-waring {
|
||||||
|
color: #fff;
|
||||||
|
background-color: #FE5E08;
|
||||||
|
border-color: #FE5E08;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-ret {
|
||||||
|
border-color: #d2d2d2;
|
||||||
|
background: 0 0;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chat {
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chat img {
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.em {
|
||||||
|
height: 22px;
|
||||||
|
width: 22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ftbtn {
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.equImg-min {
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
}
|
||||||
|
.user-head {
|
||||||
|
max-height: 25px;
|
||||||
|
max-width: 25px;
|
||||||
|
}
|
||||||
|
/******装备样式******/
|
||||||
|
.equImg {
|
||||||
|
max-width: 130px;
|
||||||
|
max-height: 230px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tq {
|
||||||
|
background-image: url('/images/site/equ/tq.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.ty {
|
||||||
|
background-image: url('/images/site/equ/ty.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.ms {
|
||||||
|
background-image: url('/images/site/equ/ms.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.zx {
|
||||||
|
background-image: url('/images/site/equ/zx.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.sy {
|
||||||
|
background-image: url('/images/site/equ/sy.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.gw {
|
||||||
|
background-image: url('/images/site/equ/gw.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.ly {
|
||||||
|
background-image: url('/images/site/equ/ly.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.hm {
|
||||||
|
background-image: url('/images/site/equ/hm.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.j_r {
|
||||||
|
background-image: url('/images/site/equ/r.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.j_l {
|
||||||
|
background-image: url('/images/site/equ/l.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
background-size: 15px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
/**********End*******/
|
||||||
|
/***副本***/
|
||||||
|
.dup {
|
||||||
|
background-image: url('/images/site/dup/dup.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
/***任务***/
|
||||||
|
.task-ret {
|
||||||
|
background-image: url('/images/site/tr.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.task-get {
|
||||||
|
background-image: url('/images/site/tg.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
}
|
||||||
|
/*九宫图片*/
|
||||||
|
.gray {
|
||||||
|
-webkit-filter: grayscale(100%);
|
||||||
|
-moz-filter: grayscale(100%);
|
||||||
|
-ms-filter: grayscale(100%);
|
||||||
|
-o-filter: grayscale(100%);
|
||||||
|
filter: grayscale(100%);
|
||||||
|
filter: gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*九宫样式*/
|
||||||
|
.wrapper {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 51px 51px 51px;
|
||||||
|
grid-template-rows: 51px 51px 51px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list {
|
||||||
|
background: #eee;
|
||||||
|
margin-right: 1px;
|
||||||
|
margin-bottom: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list img {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/********其他*******/
|
||||||
|
.mounthImg {
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/***广播***/
|
||||||
|
.broad {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broad-gift {
|
||||||
|
background-image: url('/images/site/broad/gift.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broad-system {
|
||||||
|
background-image: url('/images/site/broad/system.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broad-award {
|
||||||
|
background-image: url('/images/site/broad/award.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broad-remind {
|
||||||
|
background-image: url('/images/site/broad/remind.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broad-promote {
|
||||||
|
background-image: url('/images/site/broad/promote.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
.broad-hot1 {
|
||||||
|
background-image: url('/images/site/broad/hot1.gif');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
background-size: 18px; /*设置图片大小*/
|
||||||
|
margin-right: 2px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
/****礼物***/
|
||||||
|
.gift {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.attire {
|
||||||
|
height: 200px;
|
||||||
|
width: 125px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/****限时活动****/
|
||||||
|
.act_item {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
border: 1px solid #9f8d8d;
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act_menu a {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act_content {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act_header {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_act_head {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_act_head {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_act_item {
|
||||||
|
border-bottom: 1px dashed #9f8d8d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_act_title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_act_con {
|
||||||
|
font-size: 15px;
|
||||||
|
padding: 3px;
|
||||||
|
text-indent: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m_act_con a {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge {
|
||||||
|
max-height: 25px;
|
||||||
|
max-width: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.maxname {
|
||||||
|
max-height: 150px;
|
||||||
|
max-width: 250px;
|
||||||
|
}
|
||||||
@@ -1,211 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="layout-default">
|
|
||||||
<!-- 顶部导航栏 -->
|
|
||||||
<header class="layout-header">
|
|
||||||
<div class="header-left">
|
|
||||||
<h1 class="logo">Kx UI Framework</h1>
|
|
||||||
</div>
|
|
||||||
<div class="header-right">
|
|
||||||
<span class="user-info" v-if="userStore.isLogin">
|
|
||||||
欢迎, {{ userStore.userNickname }}
|
|
||||||
</span>
|
|
||||||
<NuxtLink to="/home" class="header-link" v-if="!userStore.isLogin">登录</NuxtLink>
|
|
||||||
<a href="javascript:;" class="header-link" v-else @click="handleLogout">退出</a>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- 主体内容区域 -->
|
|
||||||
<div class="layout-body">
|
|
||||||
<!-- 侧边栏 -->
|
|
||||||
<aside class="layout-sidebar" :class="{ collapsed: appStore.sidebarCollapsed }">
|
|
||||||
<nav class="sidebar-nav">
|
|
||||||
<NuxtLink to="/home" class="nav-item" :class="{ active: route.path === '/home' }">
|
|
||||||
<span class="nav-icon">🏠</span>
|
|
||||||
<span class="nav-text">首页</span>
|
|
||||||
</NuxtLink>
|
|
||||||
<NuxtLink to="/auth/login" class="nav-item" :class="{ active: route.path === '/auth/login' }">
|
|
||||||
<span class="nav-icon">🔐</span>
|
|
||||||
<span class="nav-text">登录页</span>
|
|
||||||
</NuxtLink>
|
|
||||||
</nav>
|
|
||||||
</aside>
|
|
||||||
|
|
||||||
<!-- 主内容区域 -->
|
|
||||||
<main class="layout-main">
|
|
||||||
<slot />
|
<slot />
|
||||||
</main>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 底部 -->
|
|
||||||
<footer class="layout-footer">
|
|
||||||
<p>© 2026 Kx UI Framework. All rights reserved.</p>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
<!-- 全局加载遮罩 -->
|
|
||||||
<div class="loading-mask" v-if="appStore.isLoading">
|
|
||||||
<div class="loading-spinner">
|
|
||||||
<div class="spinner"></div>
|
|
||||||
<p>{{ appStore.loadingText || '加载中...' }}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useUserStore } from '~/stores/user'
|
|
||||||
import { useAppStore } from '~/stores/app'
|
|
||||||
|
|
||||||
const userStore = useUserStore()
|
|
||||||
const appStore = useAppStore()
|
|
||||||
const route = useRoute()
|
|
||||||
const router = useRouter()
|
|
||||||
|
|
||||||
// 退出登录
|
|
||||||
const handleLogout = () => {
|
|
||||||
userStore.clearUserInfo()
|
|
||||||
router.push('/auth/login')
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.layout-default {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-header {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
height: 60px;
|
|
||||||
padding: 0 20px;
|
|
||||||
background-color: var(--bg-color);
|
|
||||||
border-bottom: 1px solid var(--border-color);
|
|
||||||
box-shadow: var(--box-shadow-light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.header-left .logo {
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: 600;
|
|
||||||
color: var(--primary-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.header-right {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-info {
|
|
||||||
color: var(--text-color-secondary);
|
|
||||||
}
|
|
||||||
|
|
||||||
.header-link {
|
|
||||||
color: var(--primary-color);
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 6px 12px;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
transition: background-color 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header-link:hover {
|
|
||||||
background-color: var(--bg-color-page);
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-body {
|
|
||||||
display: flex;
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-sidebar {
|
|
||||||
width: 200px;
|
|
||||||
background-color: var(--bg-color);
|
|
||||||
border-right: 1px solid var(--border-color);
|
|
||||||
transition: width 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-sidebar.collapsed {
|
|
||||||
width: 60px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-nav {
|
|
||||||
padding: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 10px;
|
|
||||||
padding: 12px 20px;
|
|
||||||
color: var(--text-color);
|
|
||||||
text-decoration: none;
|
|
||||||
transition: background-color 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-item:hover {
|
|
||||||
background-color: var(--bg-color-page);
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-item.active {
|
|
||||||
background-color: var(--primary-color);
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-icon {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-text {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-main {
|
|
||||||
flex: 1;
|
|
||||||
padding: 20px;
|
|
||||||
background-color: var(--bg-color-page);
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout-footer {
|
|
||||||
padding: 20px;
|
|
||||||
text-align: center;
|
|
||||||
color: var(--text-color-secondary);
|
|
||||||
border-top: 1px solid var(--border-color);
|
|
||||||
background-color: var(--bg-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.loading-mask {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
background-color: rgba(0, 0, 0, 0.5);
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
z-index: 9999;
|
|
||||||
}
|
|
||||||
|
|
||||||
.loading-spinner {
|
|
||||||
text-align: center;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.spinner {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
margin: 0 auto 10px;
|
|
||||||
border: 3px solid rgba(255, 255, 255, 0.3);
|
|
||||||
border-top-color: #fff;
|
|
||||||
border-radius: 50%;
|
|
||||||
animation: spin 1s linear infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes spin {
|
|
||||||
to {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
@@ -1,9 +1,90 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div class="head">
|
||||||
|
<img src="http://gree.pccsh.com/images/site/logo.png" class="logo" /><br />
|
||||||
|
【驰骋四海·社区版】
|
||||||
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<!-- 重定向到 /home -->
|
|
||||||
|
✧当前在线<strong> 139 </strong>位玩家在驰骋四海✧
|
||||||
|
</div>
|
||||||
|
<div class="content" style="font-size:17px">
|
||||||
|
<div>
|
||||||
|
亲爱的 <strong style="color:red">探玩玩家</strong>,欢迎来到驰骋四海·社区版!
|
||||||
|
</div>
|
||||||
|
<div style="margin-top:5px;">
|
||||||
|
<div>
|
||||||
|
➢<a href="http://m.twbar.cn/Home/Index?sid=KrWxKypJuDO0zFKrTig0bG">返回探玩驿站</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
➸<a href="http://m.twbar.cn/b/1145?sid=KrWxKypJuDO0zFKrTig0bG">游戏论坛</a> ➸<a class="" href="/Login/LoginOut?sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">退出游戏</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common">
|
||||||
|
<div class="title">
|
||||||
|
=====☆<a class="" href="/Pallet/GameOpen/GameUser?sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">我的区服</a>☆=====
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="item">
|
||||||
|
<a href="/LoginGame/LoginOk?sid=W6Wg8iH9gY7wIBNSEdtFcQ3KbI5YiKDo">✧【1区】新手村✰村长(男)</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common">
|
||||||
|
<div class="title">
|
||||||
|
=====☆其他区服☆=====
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
<span>暂无区服.</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="title">
|
||||||
|
=====☆<a class="" href="/Pallet/Notice/Index?sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">官方公告</a>☆=====
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div class="item">
|
||||||
|
1.
|
||||||
|
<a class="" href="/Pallet/Notice/Detail?nt=2026041901&sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[招募令]航海时代2设计专员招募</a>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
2.
|
||||||
|
<a class="" href="/Pallet/Notice/Detail?nt=2026041701&sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[活动]4月份活动集锦</a>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
3.
|
||||||
|
<a class="" href="/Pallet/Notice/Detail?nt=2026040901&sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[推广] 4月份推广</a>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
4.
|
||||||
|
<a class="" href="/Pallet/Notice/Detail?nt=2026030101&sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[推广] 3月份推广</a>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
5.
|
||||||
|
<a class="" href="/Pallet/Notice/Detail?nt=2025080002&sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">【驰骋四海】卡片の攻略(2.24)</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title">
|
||||||
|
=====☆服务导航☆=====
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
<a class="" href="/Index/Kefu?sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">客服</a>.<a class="" href="/Index/About?sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">关于</a>.<a class="" href="/Index/Cooperation?sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">合作</a>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
切换线路:
|
||||||
|
<span class="game_line">
|
||||||
|
<a class="" href="http://g.pccsh.com:5016/Index/Index?sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">1</a>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="foot">
|
||||||
|
<div class="timeService">
|
||||||
|
小G报时(18:33)
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
await navigateTo('/auth/login', { replace: true })
|
|
||||||
|
// await navigateTo('/auth/login', { replace: true })
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user