This commit is contained in:
2025-10-31 15:29:59 +08:00
parent d897ce85d4
commit e7271258b9
7 changed files with 117 additions and 27 deletions
+11 -6
View File
@@ -1,24 +1,29 @@
<script setup lang="ts">
import {myfuncs} from './myfunc.js';
import HeardMain from './components/HeardMain.vue';
import FooterMain from './components/FooterMain.vue';
myfuncs.test();
onload = () => {
console.log("Page loaded");
}
</script>
<template>
<div class="page">
<HeardMain />
<RouterView />
<FooterMain />
</div>
</template>
<style scoped></style>
+3
View File
@@ -0,0 +1,3 @@
html, body, #app {
height: 100%;
}
@@ -0,0 +1,70 @@
<script setup lang="ts">
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
</script>
<template>
<footer class="footer footer-transparent d-print-none">
<div class="container-xl">
<div class="row text-center align-items-center flex-row-reverse">
<div class="col-lg-auto ms-lg-auto">
<ul class="list-inline list-inline-dots mb-0">
<li class="list-inline-item">
<a
href="https://git.lmve.net/kevin/ops2/-/blob/main/readme.md?ref_type=heads"
target="_blank"
class="link-secondary"
rel="noopener"
>{{t('footer.doc')}}</a
>
</li>
<li class="list-inline-item">
<a
href="https://git.lmve.net/kevin/ops2/-/blob/main/LICENSE?ref_type=heads"
target="_blank"
class="link-secondary"
>{{t('footer.license')}}</a
>
</li>
<li class="list-inline-item">
<a
href="https://git.lmve.net/kevin/ops2"
target="_blank"
class="link-secondary"
rel="noopener"
>{{t('footer.source_code')}}</a
>
</li>
<li class="list-inline-item">
<a
href="https://github.com/wuwenfengmi1998"
target="_blank"
class="link-secondary"
rel="noopener"
>
kevin
</a>
</li>
</ul>
</div>
<div class="col-12 col-lg-auto mt-3 mt-lg-0">
<ul class="list-inline list-inline-dots mb-0">
<li class="list-inline-item">
{{ t('footer.copy')}}
</li>
<li class="list-inline-item">
<a
href="https://git.lmve.net/kevin/ops2/-/commits/main"
target="_blank"
class="link-secondary"
rel="noopener"
>
v0.0.1
</a>
</li>
</ul>
</div>
</div>
</div>
</footer>
</template>
@@ -80,7 +80,7 @@ onMounted(() => {
<div class="nav-item">
<a @click="set_them('dark')" class="nav-link px-0" :class="{'d-none':theTeme==='dark'}" title="Enable dark mode">
<a @click="set_them('dark')" class="nav-link px-0" :class="{'d-none':theTeme==='dark'}" :title="t('message.dark_mode')">
<!-- Download SVG icon from http://tabler.io/icons/icon/moon -->
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -97,7 +97,7 @@ onMounted(() => {
<path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z" />
</svg>
</a>
<a @click="set_them('light')" class="nav-link px-0" :class="{'d-none':theTeme==='light'}" title="Enable light mode">
<a @click="set_them('light')" class="nav-link px-0" :class="{'d-none':theTeme==='light'}" :title="t('message.light_mode')">
<!-- Download SVG icon from http://tabler.io/icons/icon/sun -->
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -116,7 +116,7 @@ onMounted(() => {
</svg>
</a>
</div>
<!-- 这里判断是否已经登陆 是则显示用户信息 否则显示登陆按钮 -->
<div class="nav-item dropdown">
<a href="#" class="nav-link d-flex lh-1 p-0 px-2" data-bs-toggle="dropdown" aria-label="Open user menu">
<span class="avatar avatar-sm" style="background-image: url(./static/avatars/000m.jpg)"> </span>
@@ -134,6 +134,7 @@ onMounted(() => {
<a href="./sign-in.html" class="dropdown-item">Logout</a>
</div>
</div>
</div>
</div>
</header>
+9 -1
View File
@@ -4,10 +4,18 @@
},
"message": {
"hello": "Hello",
"welcome": "Welcome"
"welcome": "Welcome",
"dark_mode":"Enable dark mode",
"light_mode":"Enable light mode"
},
"button": {
"submit": "Submit",
"cancel": "Cancel"
},
"footer":{
"doc":"Documentation",
"license":"License",
"source_code":"Source Code",
"copy":"Copyright © 2025 Operations. All rights reserved."
}
}
+9 -1
View File
@@ -4,10 +4,18 @@
},
"message": {
"hello": "你好",
"welcome": "欢迎"
"welcome": "欢迎",
"dark_mode":"深色模式",
"light_mode":"亮色模式"
},
"button": {
"submit": "提交",
"cancel": "取消"
},
"footer":{
"doc":"文档",
"license":"许可证",
"source_code":"源代码",
"copy":"版权 © 2025 Operations. 保留所有权利。"
}
}
+11 -16
View File
@@ -1,22 +1,17 @@
<script setup lang="ts">
import { useI18n } from 'vue-i18n'
// 使用 vue-i18n 的 Composition API
const { t, locale } = useI18n()
// 切换语言的函数
const changeLanguage = (lang: string) => {
locale.value = lang
// 可选:将用户选择的语言保存到 localStorage
//localStorage.setItem('userLanguage', lang)
}
</script>
<template>
<div>
<h3>{{ t('message.hello') }}</h3>
<button>{{ t('button.submit') }}</button>
<button @click="changeLanguage('en')">English</button>
<button @click="changeLanguage('zh-CN')">中文</button>
</div>
<div class="container-xl">
<div class="row g-2 align-items-center">
<div class="col">
<h2 class="page-title">
Empty page
</h2>
</div>
</div>
</div>
</template>