Merge branch 'main' of https://gitea-inner.fontree.cn/scout666/liveh5-nuxt

- 新增 LiveRoom 页面，包含视频播放器和直播间功能按钮
- 修改 nuxt.config.js，将开发服务器主机设置为 localhost，端口保持3000

app/components/AppFooter.vue

@@ -5,12 +5,15 @@ import HomeIcon from "~/components/icons/HomeIcon.vue";
 const route = useRoute()
 
 const active = ref(0)
-
 const show = computed(() => {
   if (route.name && names.includes(route.name))
     return true
   return false
 })
+const initData=()=>{
+  active.value=route.path==='/'?0:1
+}
+initData()
 </script>
 
 <template>

app/components/AppHeader.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script setup>
 import { useAppFooterRouteNames as routeWhiteList } from '~/config'
 
 const route = useRoute()
@@ -34,7 +34,8 @@ const showLeftArrow = computed(() => route.name && routeWhiteList.includes(route
     placeholder clickable fixed
     @click-left="onBack"
   >
-    <template #title>
+    <template #title v-if="route.meta.i18n==='menu.home'">
+
       <div class="flex flex-col items-center justify-center">
         <div class="text-#000000 text-17px mb-5px font-600">{{ title }}</div>
         <div class="text-#939393 text-10px line-height-none font-100">{{subTitle}}</div>

app/components/itemDetail/index.vue

@@ -0,0 +1,64 @@
+<script setup>
+import { ImagePreview } from 'vant';
+const images = [
+  'https://e-cdn.fontree.cn/fonchain-main/prod/file/default/setting/637d95b4-2ae9-4a74-bd60-a3a9d2ca2ca0.png',
+  'https://e-cdn.fontree.cn/fonchain-main/prod/file/default/setting/f7b65e23-ce21-41b4-8e58-9e6dc6950727.png',
+  'https://e-cdn.fontree.cn/fonchain-main/prod/file/default/setting/41eceb23-d168-4049-ae8e-48c5328b192f.png',
+];
+const clickSwipe=(index)=>{
+  showImagePreview({
+    images: images,
+    startPosition:index,
+  })
+}
+</script>
+
+<template>
+<div>
+  <van-swipe style="height: 188px" indicator-color="#B4B4B4"   lazy-render >
+    <van-swipe-item v-for="(image,index) in images" :key="image" @click="clickSwipe(index)">
+      <van-image
+          fit="contain"
+          width="100%"
+          :height="188"
+          :src="image"
+      />
+    </van-swipe-item>
+  </van-swipe>
+  <div class="px-[16px] bg-[#fff] pt-[11px] mb-6px">
+    <div class="text-[#000] text-[16px] mb-[12px]">日出而作，日落而息</div>
+    <div class="text-#575757 text-[14px] pb-8px">
+      <div class="flex mb-[4px]">
+        <div class="w-[70px]">作者：</div>
+        <div>张天赐</div>
+      </div>
+      <div class="flex mb-[4px]">
+        <div class="w-[70px] flex-shrink-0">总平尺数：</div>
+        <div>—</div>
+      </div>
+      <div class="flex mb-[4px]">
+        <div class="w-[70px] flex-shrink-0">长*宽：</div>
+        <div>100*200cm</div>
+      </div>
+      <div class="flex mb-[4px]">
+        <div class="w-[70px] flex-shrink-0">画作简介：</div>
+        <div>是打卡时间到卡上即可点击卡拉斯科健康就阿斯科利打卡时间到卡萨带手机的啊科技是打卡时</div>
+      </div>
+    </div>
+  </div>
+  <div class="flex px-[16px] bg-#fff h-[36px] items-center mb-6px">
+    <div class="text-[#575757] text-[14px]">起拍价：</div>
+    <div class="text-#575757 text-14px font-bold">RMB 1,000</div>
+  </div>
+  <div class="px-[16px] bg-#fff pt-12px pb-18px">
+    <div class="text-[#575757] text-[14px] mb-4px">竞价表：</div>
+    <div>
+      <img src="@/static/images/1981736313.png" alt="">
+    </div>
+  </div>
+</div>
+</template>
+
+<style scoped>
+
+</style>

app/layouts/default.vue

@@ -2,7 +2,7 @@
   <main class="flex flex-col min-h-svh">
     <AppHeader class="h-[var(--van-nav-bar-height)]" />
 
-    <div class="flex-1 pb-[var(--van-nav-bar-height)]">
+    <div class="flex-1 flex flex-col">
       <slot />
     </div>
 

app/pages/LiveRoom/index.vue

@@ -0,0 +1,30 @@
+<template>
+  <div class="relative">
+    <video id="videoPlayer" controls autoplay>
+      <source src="http://localhost:3213/video" type="video/mp4">
+    </video>
+    <div class="absolute bg-#fff w-60px top-196px right-0 z-999 rounded-l-4px">
+      <div class="w-full h-60px text-#7D7D7F text-12px flex flex-col justify-center items-center border-b-1px border-b-#D3D3D3">
+        <div>拍品</div>
+        <div>(1/188)</div>
+      </div>
+      <div class="w-full h-60px flex flex-col items-center justify-center">
+        <div class="mb-3px">
+          <img src="@/static/images/lock4@2x.png" class="w-16px h-21px" alt="">
+        </div>
+        <div class="text-#2B53AC text-10px">开启出价</div>
+      </div>
+    </div>
+  </div>
+
+</template>
+
+<script setup>
+</script>
+
+<style scoped>
+video {
+  width: 100%;
+  height: auto;
+}
+</style>

app/pages/countryRegion/index.vue

@@ -1,8 +1,10 @@
 <script setup>
-import {ref} from 'vue';
+import {ref, computed, watch} from 'vue';
 import pinyin from 'pinyin';
 import countryCode from './data/index.js';
+import { useI18n } from 'vue-i18n'
 
+const { t, locale } = useI18n()
 const value = ref('');
 const alphabet = [
   'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M',
@@ -12,27 +14,41 @@ const alphabet = [
 function groupByPinyinInitial(data) {
   const grouped = {};
   data.forEach(country => {
-    const initial = pinyin(country.cn, {style: pinyin.STYLE_FIRST_LETTER})[0][0].toUpperCase();
+    // 根据当前语言选择对应的国家名称
+    const countryName = locale.value === 'zh-CN' ? country.cn : 
+                       locale.value === 'zh-TW' ? country.tw : 
+                       locale.value === 'ja-JP' ? country.ja :
+                       country.en;
+                       
+    const initial = locale.value === 'ja-JP' ? '' : 
+                   locale.value === 'zh-CN' || locale.value === 'zh-TW' ? 
+                   pinyin(countryName, {style: pinyin.STYLE_FIRST_LETTER})[0][0].toUpperCase() :
+                   countryName.charAt(0).toUpperCase();
+                   
     if (!grouped[initial]) {
       grouped[initial] = [];
     }
-    grouped[initial].push(country);
+    grouped[initial].push({
+      ...country,
+      displayName: countryName
+    });
   });
 
   return grouped;
 }
 
 const groupedCountries = ref([])
-const initData=()=>{
+const initData = () => {
   groupedCountries.value = groupByPinyinInitial(countryCode);
 }
+
 const searchCountry = computed(() => {
   if (!value.value) {
     return groupedCountries.value;
   }
   return Object.keys(groupedCountries.value).reduce((filtered, initial) => {
     const countries = groupedCountries.value[initial].filter(country =>
-        country.cn.includes(value.value)
+        country.displayName.toLowerCase().includes(value.value.toLowerCase())
     );
     if (countries.length > 0) {
       filtered[initial] = countries;
@@ -40,27 +56,47 @@ const searchCountry = computed(() => {
     return filtered;
   }, {});
 });
+
+const showIndexBar = computed(() => locale.value !== 'ja-JP')
+
 initData()
+
+// 监听语言变化，重新初始化数据
+watch(locale, () => {
+  initData()
+})
 </script>
 
 <template>
   <div>
     <van-sticky>
-      <van-search v-model="value" placeholder="请输入国家和地区"/>
+      <van-search v-model="value" :placeholder="t('countryRegion.searchPlaceholder')"/>
     </van-sticky>
-    <van-index-bar sticky :sticky-offset-top="55" class="mt-[00px]" :index-list="alphabet">
+    <van-index-bar 
+      v-if="showIndexBar"
+      sticky 
+      :sticky-offset-top="55"  
+      :index-list="alphabet"
+    >
       <template v-for="(countries, index) in searchCountry" :key="index">
         <van-index-anchor
             :index="index"
         ></van-index-anchor>
-        <van-cell v-for="country in countries" :key="country.code" :title="country.cn">
+        <van-cell v-for="country in countries" :key="country.code" :title="country.displayName">
           <div class="pr-[25px]"> +{{ country.zone }}</div>
         </van-cell>
       </template>
-
-
     </van-index-bar>
-    <van-back-top right="15vw" bottom="10vh"/>
+
+    <div v-else>
+      <van-cell v-for="country in Object.values(searchCountry).flat()" 
+                :key="country.code" 
+                :title="country.displayName">
+        <div class="pr-[25px]"> +{{ country.zone }}</div>
+      </van-cell>
+    </div>
+
+    <van-back-top v-if="showIndexBar" right="15vw" bottom="10vh"/>
   </div>
 </template>
 

app/pages/home/index.vue

@@ -1,9 +1,15 @@
 <script setup>
 import liveBroadcast from '@/components/liveBroadcast/index.vue'
-import { useRect } from '@vant/use';
-import { ImagePreview } from 'vant';
+import {useRect} from '@vant/use';
 
-const liveRef=ref(null)
+import itemDetail from '@/components/itemDetail/index.vue'
+
+definePageMeta({
+  layout: 'default',
+  title: '主页',
+  i18n: 'menu.home',
+})
+const liveRef = ref(null)
 const loading = ref(false)
 const finished = ref(false)
 const refreshing = ref(false)
@@ -73,169 +79,130 @@ function onRefresh() {
   refreshing.value = true
   loadData()
 }
+
 const leftColumn = computed(() => {
   return list.value.filter((_, index) => index % 2 === 0)
 })
 const rightColumn = computed(() => {
   return list.value.filter((_, index) => index % 2 === 1)
 })
-const show=ref(false)
-const showHeight=ref('')
-const openShow=()=>{
+const show = ref(false)
+const showHeight = ref('')
+const openShow = () => {
   const rect = useRect(liveRef.value.$el);
-  showHeight.value=rect.height
-  nextTick(()=>{
-    show.value=true
-  })
-}
-const images = [
-  'https://e-cdn.fontree.cn/fonchain-main/prod/file/default/setting/637d95b4-2ae9-4a74-bd60-a3a9d2ca2ca0.png',
-  'https://e-cdn.fontree.cn/fonchain-main/prod/file/default/setting/f7b65e23-ce21-41b4-8e58-9e6dc6950727.png',
-  'https://e-cdn.fontree.cn/fonchain-main/prod/file/default/setting/41eceb23-d168-4049-ae8e-48c5328b192f.png',
-];
-const clickSwipe=(index)=>{
-  showImagePreview({
-    images: images,
-    startPosition:index,
+  showHeight.value = rect.height
+  nextTick(() => {
+    show.value = true
   })
 }
+
 </script>
 
 <template>
-  <liveBroadcast ref="liveRef" />
-  <van-tabs sticky animated>
-    <van-tab title="拍品列表">
-      <div class="px-[16px] pt-[16px]">
-        <van-pull-refresh>
-          <van-list
-              v-model:loading="loading"
-              :finished="finished"
-              finished-text="没有更多了"
-              @load="loadData"
-          >
-            <div class="w-full flex gap-[16px]">
-              <div class="flex flex-1 flex-col gap-[16px]">
-                <div
-                    v-for="(item, index) in leftColumn"
-                    :key="index"
-                    class="w-full"
-                    @click="openShow"
-                >
-                  <div class="relative w-full">
-                    <van-image
-                        :src="item.image"
-                        :style="{ aspectRatio: item.ratio }"
-                        fit="cover"
-                        class="w-full"
-                    />
-                    <div class="absolute left-[8px] top-[8px] h-[17px] w-[45px] flex items-center justify-center bg-[#2b53ac] text-[12px] text-[#fff]">
-                      LOT{{ index * 2 + 1 }}
+  <div class="bg-#fff flex-grow-1">
+    <liveBroadcast ref="liveRef"/>
+    <van-tabs sticky animated>
+      <van-tab title="拍品列表">
+        <div class="px-[16px] pt-[16px]">
+          <van-pull-refresh>
+            <van-list
+                v-model:loading="loading"
+                :finished="finished"
+                finished-text="没有更多了"
+                @load="loadData"
+            >
+              <div class="w-full flex gap-[16px]">
+                <div class="flex flex-1 flex-col gap-[16px]">
+                  <div
+                      v-for="(item, index) in leftColumn"
+                      :key="index"
+                      class="w-full"
+                      @click="openShow"
+                  >
+                    <div class="relative w-full">
+                      <van-image
+                          :src="item.image"
+                          :style="{ aspectRatio: item.ratio }"
+                          fit="cover"
+                          class="w-full"
+                      />
+                      <div
+                          class="absolute left-[8px] top-[8px] h-[17px] w-[45px] flex items-center justify-center bg-[#2b53ac] text-[12px] text-[#fff]">
+                        LOT{{ index * 2 + 1 }}
+                      </div>
+                    </div>
+                    <div class="pt-[8px]">
+                      <div class="text-[14px] text-[#000000] leading-[20px]">
+                        {{ item.title }}
+                      </div>
+                      <div class="mt-[4px] text-[12px] text-[#575757]">
+                        起拍价：{{ item.startingPrice }}
+                      </div>
+                      <div
+                          v-if="item.transactionPrice"
+                          class="mt-[4px] text-[12px] text-[#b58047]"
+                      >
+                        成交价：{{ item.transactionPrice }}
+                      </div>
                     </div>
                   </div>
-                  <div class="pt-[8px]">
-                    <div class="text-[14px] text-[#000000] leading-[20px]">
-                      {{ item.title }}
+                </div>
+                <div class="flex flex-1 flex-col gap-[16px]">
+                  <div
+                      v-for="(item, index) in rightColumn"
+                      :key="index"
+                      class="w-full"
+                      @click="openShow"
+                  >
+                    <div class="relative w-full">
+                      <van-image
+                          :src="item.image"
+                          :style="{ aspectRatio: item.ratio }"
+                          fit="cover"
+                          class="w-full"
+                      />
+                      <div
+                          class="absolute left-[8px] top-[8px] h-[17px] w-[45px] flex items-center justify-center bg-[#2b53ac] text-[12px] text-[#fff]">
+                        LOT{{ index * 2 + 2 }}
+                      </div>
                     </div>
-                    <div class="mt-[4px] text-[12px] text-[#575757]">
-                      起拍价：{{ item.startingPrice }}
-                    </div>
-                    <div
-                        v-if="item.transactionPrice"
-                        class="mt-[4px] text-[12px] text-[#b58047]"
-                    >
-                      成交价：{{ item.transactionPrice }}
+                    <div class="pt-[8px]">
+                      <div class="text-[14px] text-[#000000] leading-[20px]">
+                        {{ item.title }}
+                      </div>
+                      <div class="mt-[4px] text-[12px] text-[#575757]">
+                        起拍价：{{ item.startingPrice }}
+                      </div>
+                      <div
+                          v-if="item.transactionPrice"
+                          class="mt-[4px] text-[12px] text-[#b58047]"
+                      >
+                        成交价：{{ item.transactionPrice }}
+                      </div>
                     </div>
                   </div>
                 </div>
               </div>
-              <div class="flex flex-1 flex-col gap-[16px]">
-                <div
-                    v-for="(item, index) in rightColumn"
-                    :key="index"
-                    class="w-full"
-                >
-                  <div class="relative w-full">
-                    <van-image
-                        :src="item.image"
-                        :style="{ aspectRatio: item.ratio }"
-                        fit="cover"
-                        class="w-full"
-                    />
-                    <div class="absolute left-[8px] top-[8px] h-[17px] w-[45px] flex items-center justify-center bg-[#2b53ac] text-[12px] text-[#fff]">
-                      LOT{{ index * 2 + 2 }}
-                    </div>
-                  </div>
-                  <div class="pt-[8px]">
-                    <div class="text-[14px] text-[#000000] leading-[20px]">
-                      {{ item.title }}
-                    </div>
-                    <div class="mt-[4px] text-[12px] text-[#575757]">
-                      起拍价：{{ item.startingPrice }}
-                    </div>
-                    <div
-                        v-if="item.transactionPrice"
-                        class="mt-[4px] text-[12px] text-[#b58047]"
-                    >
-                      成交价：{{ item.transactionPrice }}
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </van-list>
-        </van-pull-refresh>
-      </div>
-    </van-tab>
-    <van-tab title="拍卖说明">
-      内容 2
-    </van-tab>
-  </van-tabs>
-  <van-back-top right="15vw" bottom="10vh"/>
-  <van-action-sheet :round="false" v-model:show="show" title="拍品详情">
-    <div class="content bg-[#F0F0F0]" :style="`height: calc(100vh - ${showHeight+39+46}px)`">
-      <van-swipe style="height: 188px" indicator-color="#B4B4B4"   lazy-render >
-        <van-swipe-item v-for="(image,index) in images" :key="image" @click="clickSwipe(index)">
-          <van-image
-              fit="contain"
-              width="100%"
-              :height="188"
-              :src="image"
-          />
-        </van-swipe-item>
-      </van-swipe>
-      <div class="px-[16px] bg-[#fff] pt-[11px] mb-6px">
-        <div class="text-[#000] text-[16px] mb-[12px]">日出而作，日落而息</div>
-        <div class="text-#575757 text-[14px] pb-8px">
-          <div class="flex mb-[4px]">
-            <div class="w-[70px]">作者：</div>
-            <div>张天赐</div>
-          </div>
-          <div class="flex mb-[4px]">
-            <div class="w-[70px] flex-shrink-0">总平尺数：</div>
-            <div>—</div>
-          </div>
-          <div class="flex mb-[4px]">
-            <div class="w-[70px] flex-shrink-0">长*宽：</div>
-            <div>100*200cm</div>
-          </div>
-          <div class="flex mb-[4px]">
-            <div class="w-[70px] flex-shrink-0">画作简介：</div>
-            <div>是打卡时间到卡上即可点击卡拉斯科健康就阿斯科利打卡时间到卡萨带手机的啊科技是打卡时</div>
-          </div>
+            </van-list>
+          </van-pull-refresh>
         </div>
-      </div>
-      <div class="flex px-[16px] bg-#fff h-[36px] items-center mb-6px">
-        <div class="text-[#575757] text-[14px]">起拍价：</div>
-        <div class="text-#575757 text-14px font-bold">RMB 1,000</div>
-      </div>
-      <div class="px-[16px] bg-#fff pt-12px pb-18px">
-        <div class="text-[#575757] text-[14px] mb-4px">竞价表：</div>
-        <div>
-          <img src="@/static/images/1981736313.png" alt="">
+      </van-tab>
+      <van-tab title="拍卖说明">
+        <div class="px-16px pt-14px">
+          <div class="text-#575757 text-14px">
+            这里是后台富文本配置的说明，啊即可打开三等奖撒度老师的湿答答是快乐的阿四大皆空
+          </div>
+          <div></div>
         </div>
+      </van-tab>
+    </van-tabs>
+    <van-back-top right="15vw" bottom="10vh"/>
+    <van-action-sheet :round="false" v-model:show="show" title="拍品详情">
+      <div class="content bg-[#F0F0F0]" :style="`height: calc(100vh - ${showHeight+85}px)`">
+        <itemDetail></itemDetail>
       </div>
-    </div>
-  </van-action-sheet>
+    </van-action-sheet>
+  </div>
 </template>
 <style>
 :root:root {
@@ -243,11 +210,12 @@ const clickSwipe=(index)=>{
 }
 </style>
 <style scoped lang="scss">
-:deep(.van-swipe__indicator){
+:deep(.van-swipe__indicator) {
   width: 8px;
   height: 8px;
 }
-:deep(.van-swipe__indicator:not(.van-swipe__indicator--active) ){
-  background:rgba(0,0,0,0.8);
+
+:deep(.van-swipe__indicator:not(.van-swipe__indicator--active) ) {
+  background: rgba(0, 0, 0, 0.8);
 }
 </style>

app/pages/login/index.vue

@@ -2,6 +2,9 @@
 import { useRouter } from 'vue-router';
 
 const router = useRouter();
+definePageMeta({
+  layout: 'login',
+})
 function goToPage() {
   router.push('/countryRegion');
 }

app/pages/profile/index.vue

@@ -7,7 +7,81 @@ definePageMeta({
 </script>
 
 <template>
-  <div>
-  12312
+  <div class="w-[100vw] bg-[url('@/static/images/3532@2x.png')] bg-cover pt-43px flex-grow-1 flex flex-col">
+  <div class="flex items-center px-16px mb-43px">
+    <div class="mr-23px">
+      <img class="w-57px h-57px" src="@/static/images/5514@2x.png" alt="">
+    </div>
+    <div class="flex flex-col">
+      <div class="text-18px text-#181818">张三</div>
+      <div class="text-#575757 text-14px">15834362333</div>
+    </div>
+  </div>
+    <div class="flex-grow-1">
+      <div class="border-b-1px border-b-#D3D3D3  px-16px flex">
+        <div class="text-#000 text-16px border-b-3 border-b-#2B53AC h-36px">我的拍品</div>
+      </div>
+      <van-pull-refresh>
+        <van-list
+            finished-text="没有更多了"
+        >
+          <div class="px-16px pt-14px">
+            <div class="text-#575757 text-14px mb-3px">2025.01.12</div>
+            <div class="flex mb-22px">
+              <div class="flex-shrink-0 mr-10px">
+                <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+              </div>
+              <div class="flex flex-col justify-between">
+                <div class="text-#000 text-16px ellipsis line-height-21px">张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰…</div>
+                <div class="text-#575757 text-14px line-height-none ">起拍价：RMB 1,000</div>
+                <div class="text-#B58047 text-14px line-height-none">成交价：RMB 10,000</div>
+              </div>
+            </div>
+            <div class="flex">
+              <div class="flex-shrink-0 mr-10px">
+                <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+              </div>
+              <div class="flex flex-col justify-between">
+                <div class="text-#000 text-16px ellipsis line-height-21px">张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰…</div>
+                <div class="text-#575757 text-14px line-height-none ">起拍价：RMB 1,000</div>
+                <div class="text-#B58047 text-14px line-height-none">成交价：RMB 10,000</div>
+              </div>
+            </div>
+          </div>
+          <div class="px-16px pt-14px">
+            <div class="text-#575757 text-14px mb-3px">2025.01.12</div>
+            <div class="flex mb-22px">
+              <div class="flex-shrink-0 mr-10px">
+                <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+              </div>
+              <div class="flex flex-col justify-between">
+                <div class="text-#000 text-16px ellipsis line-height-21px">张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰…</div>
+                <div class="text-#575757 text-14px line-height-none ">起拍价：RMB 1,000</div>
+                <div class="text-#B58047 text-14px line-height-none">成交价：RMB 10,000</div>
+              </div>
+            </div>
+            <div class="flex">
+              <div class="flex-shrink-0 mr-10px">
+                <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+              </div>
+              <div class="flex flex-col justify-between">
+                <div class="text-#000 text-16px ellipsis line-height-21px">张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰…</div>
+                <div class="text-#575757 text-14px line-height-none ">起拍价：RMB 1,000</div>
+                <div class="text-#B58047 text-14px line-height-none">成交价：RMB 10,000</div>
+              </div>
+            </div>
+          </div>
+        </van-list>
+      </van-pull-refresh>
+    </div>
   </div>
 </template>
+<style scoped>
+.ellipsis {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+</style>

i18n/locales/en-US.json

@@ -43,5 +43,8 @@
     "btn_fetch": "Fetch",
     "btn_clear": "Clear",
     "btn_empty_desc": "No data"
+  },
+  "countryRegion": {
+    "searchPlaceholder": "Please enter the country and region"
   }
 }

i18n/locales/ja-JP.json

@@ -43,5 +43,8 @@
     "btn_fetch": "取得",
     "btn_clear": "クリア",
     "btn_empty_desc": "データなし"
+  },
+  "countryRegion": {
+    "searchPlaceholder": "国と地域を入力してください"
   }
 }

i18n/locales/zh-CN.json

@@ -47,5 +47,8 @@
     "btn_fetch": "拉取",
     "btn_clear": "清空",
     "btn_empty_desc": "暂无数据"
+  },
+  "countryRegion": {
+    "searchPlaceholder": "请输入国家和地区"
   }
 }

i18n/locales/zh-TW.json

@@ -43,5 +43,8 @@
     "btn_fetch": "拉取",
     "btn_clear": "清空",
     "btn_empty_desc": "暫無數據"
+  },
+  "countryRegion": {
+    "searchPlaceholder": "請輸入國家和地區"
   }
 }

nuxt.config.js

@@ -93,7 +93,8 @@ export default defineNuxtConfig({
         { rel: 'icon', href: '/favicon.ico', sizes: 'any' },
       ],
       meta: [
-        { name: 'viewport', content: 'width=device-width, initial-scale=1, viewport-fit=cover' },
+        { name: 'viewport', content: 'width=device-width, initial-scale=1, viewport-fit=cover,user-scalable=no' },
+        { name: 'apple-mobile-web-app-capable', content: 'yes' },
         { name: 'apple-mobile-web-app-status-bar-style', content: 'black-translucent' },
         { name: 'theme-color', media: '(prefers-color-scheme: light)', content: '#ffffff' },
         { name: 'theme-color', media: '(prefers-color-scheme: dark)', content: '#222222' },
@@ -143,12 +144,10 @@ export default defineNuxtConfig({
   future: {
     compatibilityVersion: 4,
   },
-
   // 指定 Nuxt 应用程序的兼容性日期，确保应用程序在未来的 Nuxt 版本中保持稳定性
   compatibilityDate: '2025-01-09',
-  
   devServer: {
-    host: '0.0.0.0',
-    port: 3000,
+    host: 'localhost', // Set the host to 'localhost'
+    port: 3000,        // Set the port to 3000 or any other port you prefer
   },
 })