This commit is contained in:
Putoo
2026-04-24 12:49:51 +08:00
parent 5857e6073f
commit 41958a79e4
4 changed files with 597 additions and 206 deletions

View File

@@ -10,6 +10,7 @@ export default defineNuxtConfig({
// 开发服务器配置 // 开发服务器配置
devServer: { devServer: {
host: '0.0.0.0',
port: 5068, port: 5068,
}, },

View File

@@ -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;
}

View File

@@ -1,211 +1,11 @@
<template> <template>
<div class="layout-default"> <slot />
<!-- 顶部导航栏 -->
<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 />
</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>

View File

@@ -1,9 +1,90 @@
<template> <template>
<div> <div class="head">
<!-- 重定向到 /home --> <img src="http://gree.pccsh.com/images/site/logo.png" class="logo" /><br />
</div> 驰骋四海&#xB7;社区版
</div>
<div>
当前在线<strong> 139 </strong>位玩家在驰骋四海
</div>
<div class="content" style="font-size:17px">
<div>
亲爱的&nbsp;<strong style="color:red">探玩玩家</strong>欢迎来到驰骋四海&#xB7;社区版!
</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>&nbsp;&nbsp;<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">&#x2727;&#x3010;1&#x3011;新手村&#x2730;村长()</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&amp;sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[招募令]航海时代2设计专员招募</a>
</div>
<div class="item">
2.
<a class="" href="/Pallet/Notice/Detail?nt=2026041701&amp;sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[活动]4月份活动集锦</a>
</div>
<div class="item">
3.
<a class="" href="/Pallet/Notice/Detail?nt=2026040901&amp;sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[推广] 4月份推广</a>
</div>
<div class="item">
4.
<a class="" href="/Pallet/Notice/Detail?nt=2026030101&amp;sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">[推广] 3月份推广</a>
</div>
<div class="item">
5.
<a class="" href="/Pallet/Notice/Detail?nt=2025080002&amp;sid=klxy7ADn96CBYGWQ9AG4xPqFC2Ib6Ty1Kx">&#x3010;驰骋四海&#x3011;卡片&#x306E;攻略&#xFF08;2.24&#xFF09;</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>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
await navigateTo('/auth/login', { replace: true })
// await navigateTo('/auth/login', { replace: true })
</script> </script>