scout666/liveh5-nuxt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/main'

Browse Source
This commit is contained in:
xingyy 2025-02-19 15:14:10 +08:00
commit ddebdbae4a
1 changed files with 57 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
app/pages/countryRegion/index.vue
View File

@ -11,11 +11,17 @@ const router = useRouter()
console.log('router',router)
const { t, locale } = useI18n()
const value = ref('');
const alphabet = [
'#',
'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M',
'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'
];
const alphabet = computed(() => {
if (!groupedCountries.value) return ['#'];
// 获取所有实际存在的分组字母
const letters = Object.keys(groupedCountries.value)
.filter(key => key !== '#')
.sort();
// 确保 # 永远在最前
return ['#', ...letters];
});
// 常用国家的代码列表
const frequentCountryCodes = ['CN', 'TW', 'JP', 'US'];
@ -47,10 +53,18 @@ function groupByPinyinInitial(data) {
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();
// 根据语言环境决定使用拼音还是英文首字母
let initial;
if (locale.value === 'zh-CN' || locale.value === 'zh-TW') {
// 中文和繁体使用拼音首字母
const pinyinName = locale.value === 'zh-CN' ? country.cn : country.tw;
initial = pinyin(pinyinName, {style: pinyin.STYLE_FIRST_LETTER})[0][0].toUpperCase();
} else if (locale.value === 'ja-JP') {
initial = '';
} else {
// 英文使用 en 字段首字母
initial = country.en.charAt(0).toUpperCase();
}
if (!grouped[initial]) {
grouped[initial] = [];
@ -62,12 +76,38 @@ function groupByPinyinInitial(data) {
}
});
if (locale.value === 'ja-JP') {
// 日文环境下按照片假名排序
grouped[''] = grouped[''].sort((a, b) => a.displayName.localeCompare(b.displayName, 'ja-JP'));
// 对每个分组内的国家按照对应语言排序
Object.keys(grouped).forEach(key => {
grouped[key].sort((a, b) => {
if (locale.value === 'zh-CN' || locale.value === 'zh-TW') {
// 中文和繁体使用拼音排序
const pinyinA = pinyin(locale.value === 'zh-CN' ? a.cn : a.tw, {style: pinyin.STYLE_NORMAL}).join('');
const pinyinB = pinyin(locale.value === 'zh-CN' ? b.cn : b.tw, {style: pinyin.STYLE_NORMAL}).join('');
return pinyinA.localeCompare(pinyinB);
} else if (locale.value === 'ja-JP') {
return a.displayName.localeCompare(b.displayName, 'ja-JP');
} else {
return a.en.localeCompare(b.en);
}
});
});
if (locale.value === 'ja-JP') {
return grouped;
} else {
// 按字母顺序返回排序后的对象
const sortedGrouped = {};
// 确保 # 永远在最前
sortedGrouped['#'] = grouped['#'];
// 其他字母按顺序排序
Object.keys(grouped)
.filter(key => key !== '#')
.sort()
.forEach(key => {
sortedGrouped[key] = grouped[key];
});
return sortedGrouped;
}
}
const groupedCountries = ref([])
@ -83,6 +123,7 @@ const searchCountry = computed(() => {
const countries = groupedCountries.value[initial].filter(country =>
country.displayName.toLowerCase().includes(value.value.toLowerCase())
);
if (countries.length > 0) {
filtered[initial] = countries;
}
@ -103,7 +144,7 @@ const handleCountrySelect = (country) => {
}
initData()
console.log('searchCountry',searchCountry.value)
// 监听语言变化，重新初始化数据
watch(locale, () => {
initData()