jcq 2 дней назад
Родитель
Сommit
1101304e28
1 измененных файлов с 420 добавлено и 0 удалено
  1. 420 0
      src/components/common/ChineseRegionSelector.vue

+ 420 - 0
src/components/common/ChineseRegionSelector.vue

@@ -0,0 +1,420 @@
+<template>
+	<div class="chinese-region-selector">
+		<el-select
+			v-model="selectedCountry"
+			placeholder="选择国家"
+			filterable
+			class="!w-48"
+			@change="onCountryChange"
+		>
+			<el-option-group v-for="continent in continentOptions" :key="continent.label" :label="continent.label">
+				<el-option 
+					v-for="country in continent.countries" 
+					:key="country.code" 
+					:label="country.name" 
+					:value="country.code" 
+				/>
+			</el-option-group>
+		</el-select>
+
+		<el-select
+			v-if="selectedCountry && states.length > 0"
+			v-model="selectedState"
+			placeholder="选择省份/州"
+			filterable
+			class="!w-48 ml-2"
+			@change="onStateChange"
+		>
+			<el-option 
+				v-for="state in states" 
+				:key="state.code" 
+				:label="state.name" 
+				:value="state.name" 
+			/>
+		</el-select>
+
+		<el-button 
+			v-if="selectedCountry" 
+			type="primary" 
+			size="small" 
+			class="ml-2"
+			@click="addRegion"
+		>
+			添加地区
+		</el-button>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+
+interface RegionData {
+	country: string;
+	state?: string;
+	code: string;
+}
+
+const props = defineProps<{
+	modelValue?: RegionData[];
+}>();
+
+const emit = defineEmits<{
+	'update:modelValue': [value: RegionData[]];
+}>();
+
+const continentOptions = ref<any[]>([]);
+const selectedCountry = ref('');
+const selectedState = ref('');
+const states = ref<any[]>([]);
+const countryCode = ref('');
+
+// 预定义的中文国家数据
+const countriesData = [
+	// 亚洲
+	{ name: '中国', code: 'CN', continent: '亚洲' },
+	{ name: '日本', code: 'JP', continent: '亚洲' },
+	{ name: '韩国', code: 'KR', continent: '亚洲' },
+	{ name: '印度', code: 'IN', continent: '亚洲' },
+	{ name: '新加坡', code: 'SG', continent: '亚洲' },
+	{ name: '泰国', code: 'TH', continent: '亚洲' },
+	{ name: '马来西亚', code: 'MY', continent: '亚洲' },
+	{ name: '印度尼西亚', code: 'ID', continent: '亚洲' },
+	{ name: '菲律宾', code: 'PH', continent: '亚洲' },
+	{ name: '越南', code: 'VN', continent: '亚洲' },
+	{ name: '台湾', code: 'TW', continent: '亚洲' },
+	{ name: '香港', code: 'HK', continent: '亚洲' },
+	{ name: '澳门', code: 'MO', continent: '亚洲' },
+	{ name: '巴基斯坦', code: 'PK', continent: '亚洲' },
+	{ name: '孟加拉国', code: 'BD', continent: '亚洲' },
+	{ name: '斯里兰卡', code: 'LK', continent: '亚洲' },
+	{ name: '缅甸', code: 'MM', continent: '亚洲' },
+	{ name: '柬埔寨', code: 'KH', continent: '亚洲' },
+	{ name: '老挝', code: 'LA', continent: '亚洲' },
+	{ name: '蒙古', code: 'MN', continent: '亚洲' },
+	{ name: '哈萨克斯坦', code: 'KZ', continent: '亚洲' },
+	{ name: '乌兹别克斯坦', code: 'UZ', continent: '亚洲' },
+	{ name: '吉尔吉斯斯坦', code: 'KG', continent: '亚洲' },
+	{ name: '塔吉克斯坦', code: 'TJ', continent: '亚洲' },
+	{ name: '土库曼斯坦', code: 'TM', continent: '亚洲' },
+	{ name: '阿富汗', code: 'AF', continent: '亚洲' },
+	{ name: '伊朗', code: 'IR', continent: '亚洲' },
+	{ name: '伊拉克', code: 'IQ', continent: '亚洲' },
+	{ name: '叙利亚', code: 'SY', continent: '亚洲' },
+	{ name: '黎巴嫩', code: 'LB', continent: '亚洲' },
+	{ name: '约旦', code: 'JO', continent: '亚洲' },
+	{ name: '以色列', code: 'IL', continent: '亚洲' },
+	{ name: '巴勒斯坦', code: 'PS', continent: '亚洲' },
+	{ name: '沙特阿拉伯', code: 'SA', continent: '亚洲' },
+	{ name: '阿联酋', code: 'AE', continent: '亚洲' },
+	{ name: '卡塔尔', code: 'QA', continent: '亚洲' },
+	{ name: '巴林', code: 'BH', continent: '亚洲' },
+	{ name: '科威特', code: 'KW', continent: '亚洲' },
+	{ name: '阿曼', code: 'OM', continent: '亚洲' },
+	{ name: '也门', code: 'YE', continent: '亚洲' },
+	{ name: '土耳其', code: 'TR', continent: '亚洲' },
+	{ name: '塞浦路斯', code: 'CY', continent: '亚洲' },
+	{ name: '格鲁吉亚', code: 'GE', continent: '亚洲' },
+	{ name: '亚美尼亚', code: 'AM', continent: '亚洲' },
+	{ name: '阿塞拜疆', code: 'AZ', continent: '亚洲' },
+
+	// 欧洲
+	{ name: '英国', code: 'GB', continent: '欧洲' },
+	{ name: '法国', code: 'FR', continent: '欧洲' },
+	{ name: '德国', code: 'DE', continent: '欧洲' },
+	{ name: '意大利', code: 'IT', continent: '欧洲' },
+	{ name: '西班牙', code: 'ES', continent: '欧洲' },
+	{ name: '荷兰', code: 'NL', continent: '欧洲' },
+	{ name: '瑞士', code: 'CH', continent: '欧洲' },
+	{ name: '瑞典', code: 'SE', continent: '欧洲' },
+	{ name: '挪威', code: 'NO', continent: '欧洲' },
+	{ name: '丹麦', code: 'DK', continent: '欧洲' },
+	{ name: '芬兰', code: 'FI', continent: '欧洲' },
+	{ name: '俄罗斯', code: 'RU', continent: '欧洲' },
+	{ name: '波兰', code: 'PL', continent: '欧洲' },
+	{ name: '捷克', code: 'CZ', continent: '欧洲' },
+	{ name: '匈牙利', code: 'HU', continent: '欧洲' },
+	{ name: '奥地利', code: 'AT', continent: '欧洲' },
+	{ name: '比利时', code: 'BE', continent: '欧洲' },
+	{ name: '卢森堡', code: 'LU', continent: '欧洲' },
+	{ name: '爱尔兰', code: 'IE', continent: '欧洲' },
+	{ name: '葡萄牙', code: 'PT', continent: '欧洲' },
+	{ name: '希腊', code: 'GR', continent: '欧洲' },
+	{ name: '保加利亚', code: 'BG', continent: '欧洲' },
+	{ name: '罗马尼亚', code: 'RO', continent: '欧洲' },
+	{ name: '克罗地亚', code: 'HR', continent: '欧洲' },
+	{ name: '斯洛文尼亚', code: 'SI', continent: '欧洲' },
+	{ name: '斯洛伐克', code: 'SK', continent: '欧洲' },
+	{ name: '立陶宛', code: 'LT', continent: '欧洲' },
+	{ name: '拉脱维亚', code: 'LV', continent: '欧洲' },
+	{ name: '爱沙尼亚', code: 'EE', continent: '欧洲' },
+	{ name: '马耳他', code: 'MT', continent: '欧洲' },
+	{ name: '冰岛', code: 'IS', continent: '欧洲' },
+	{ name: '列支敦士登', code: 'LI', continent: '欧洲' },
+	{ name: '摩纳哥', code: 'MC', continent: '欧洲' },
+	{ name: '圣马力诺', code: 'SM', continent: '欧洲' },
+	{ name: '梵蒂冈', code: 'VA', continent: '欧洲' },
+	{ name: '安道尔', code: 'AD', continent: '欧洲' },
+	{ name: '白俄罗斯', code: 'BY', continent: '欧洲' },
+	{ name: '乌克兰', code: 'UA', continent: '欧洲' },
+	{ name: '摩尔多瓦', code: 'MD', continent: '欧洲' },
+	{ name: '北马其顿', code: 'MK', continent: '欧洲' },
+	{ name: '阿尔巴尼亚', code: 'AL', continent: '欧洲' },
+	{ name: '波黑', code: 'BA', continent: '欧洲' },
+	{ name: '黑山', code: 'ME', continent: '欧洲' },
+	{ name: '塞尔维亚', code: 'RS', continent: '欧洲' },
+	{ name: '科索沃', code: 'XK', continent: '欧洲' },
+
+	// 北美洲
+	{ name: '美国', code: 'US', continent: '北美洲' },
+	{ name: '加拿大', code: 'CA', continent: '北美洲' },
+	{ name: '墨西哥', code: 'MX', continent: '北美洲' },
+	{ name: '危地马拉', code: 'GT', continent: '北美洲' },
+	{ name: '伯利兹', code: 'BZ', continent: '北美洲' },
+	{ name: '萨尔瓦多', code: 'SV', continent: '北美洲' },
+	{ name: '洪都拉斯', code: 'HN', continent: '北美洲' },
+	{ name: '尼加拉瓜', code: 'NI', continent: '北美洲' },
+	{ name: '哥斯达黎加', code: 'CR', continent: '北美洲' },
+	{ name: '巴拿马', code: 'PA', continent: '北美洲' },
+	{ name: '古巴', code: 'CU', continent: '北美洲' },
+	{ name: '牙买加', code: 'JM', continent: '北美洲' },
+	{ name: '海地', code: 'HT', continent: '北美洲' },
+	{ name: '多米尼加', code: 'DO', continent: '北美洲' },
+	{ name: '特立尼达和多巴哥', code: 'TT', continent: '北美洲' },
+	{ name: '巴巴多斯', code: 'BB', continent: '北美洲' },
+	{ name: '安提瓜和巴布达', code: 'AG', continent: '北美洲' },
+	{ name: '圣基茨和尼维斯', code: 'KN', continent: '北美洲' },
+	{ name: '圣卢西亚', code: 'LC', continent: '北美洲' },
+	{ name: '圣文森特和格林纳丁斯', code: 'VC', continent: '北美洲' },
+	{ name: '格林纳达', code: 'GD', continent: '北美洲' },
+	{ name: '巴哈马', code: 'BS', continent: '北美洲' },
+	{ name: '多米尼克', code: 'DM', continent: '北美洲' },
+
+	// 南美洲
+	{ name: '巴西', code: 'BR', continent: '南美洲' },
+	{ name: '阿根廷', code: 'AR', continent: '南美洲' },
+	{ name: '智利', code: 'CL', continent: '南美洲' },
+	{ name: '哥伦比亚', code: 'CO', continent: '南美洲' },
+	{ name: '秘鲁', code: 'PE', continent: '南美洲' },
+	{ name: '委内瑞拉', code: 'VE', continent: '南美洲' },
+	{ name: '厄瓜多尔', code: 'EC', continent: '南美洲' },
+	{ name: '玻利维亚', code: 'BO', continent: '南美洲' },
+	{ name: '巴拉圭', code: 'PY', continent: '南美洲' },
+	{ name: '乌拉圭', code: 'UY', continent: '南美洲' },
+	{ name: '圭亚那', code: 'GY', continent: '南美洲' },
+	{ name: '苏里南', code: 'SR', continent: '南美洲' },
+	{ name: '法属圭亚那', code: 'GF', continent: '南美洲' },
+	{ name: '福克兰群岛', code: 'FK', continent: '南美洲' },
+
+	// 大洋洲
+	{ name: '澳大利亚', code: 'AU', continent: '大洋洲' },
+	{ name: '新西兰', code: 'NZ', continent: '大洋洲' },
+	{ name: '斐济', code: 'FJ', continent: '大洋洲' },
+	{ name: '巴布亚新几内亚', code: 'PG', continent: '大洋洲' },
+	{ name: '所罗门群岛', code: 'SB', continent: '大洋洲' },
+	{ name: '瓦努阿图', code: 'VU', continent: '大洋洲' },
+	{ name: '新喀里多尼亚', code: 'NC', continent: '大洋洲' },
+	{ name: '法属波利尼西亚', code: 'PF', continent: '大洋洲' },
+	{ name: '萨摩亚', code: 'WS', continent: '大洋洲' },
+	{ name: '汤加', code: 'TO', continent: '大洋洲' },
+	{ name: '基里巴斯', code: 'KI', continent: '大洋洲' },
+	{ name: '图瓦卢', code: 'TV', continent: '大洋洲' },
+	{ name: '瑙鲁', code: 'NR', continent: '大洋洲' },
+	{ name: '密克罗尼西亚', code: 'FM', continent: '大洋洲' },
+	{ name: '马绍尔群岛', code: 'MH', continent: '大洋洲' },
+	{ name: '帕劳', code: 'PW', continent: '大洋洲' },
+	{ name: '库克群岛', code: 'CK', continent: '大洋洲' },
+	{ name: '纽埃', code: 'NU', continent: '大洋洲' },
+	{ name: '托克劳', code: 'TK', continent: '大洋洲' },
+	{ name: '瓦利斯和富图纳', code: 'WF', continent: '大洋洲' },
+	{ name: '美属萨摩亚', code: 'AS', continent: '大洋洲' },
+	{ name: '关岛', code: 'GU', continent: '大洋洲' },
+	{ name: '北马里亚纳群岛', code: 'MP', continent: '大洋洲' },
+	{ name: '美属维尔京群岛', code: 'VI', continent: '大洋洲' },
+	{ name: '波多黎各', code: 'PR', continent: '大洋洲' },
+
+	// 非洲
+	{ name: '南非', code: 'ZA', continent: '非洲' },
+	{ name: '埃及', code: 'EG', continent: '非洲' },
+	{ name: '尼日利亚', code: 'NG', continent: '非洲' },
+	{ name: '肯尼亚', code: 'KE', continent: '非洲' },
+	{ name: '摩洛哥', code: 'MA', continent: '非洲' },
+	{ name: '阿尔及利亚', code: 'DZ', continent: '非洲' },
+	{ name: '苏丹', code: 'SD', continent: '非洲' },
+	{ name: '坦桑尼亚', code: 'TZ', continent: '非洲' },
+	{ name: '乌干达', code: 'UG', continent: '非洲' },
+	{ name: '加纳', code: 'GH', continent: '非洲' },
+	{ name: '埃塞俄比亚', code: 'ET', continent: '非洲' },
+	{ name: '安哥拉', code: 'AO', continent: '非洲' },
+	{ name: '赞比亚', code: 'ZM', continent: '非洲' },
+	{ name: '津巴布韦', code: 'ZW', continent: '非洲' },
+	{ name: '马拉维', code: 'MW', continent: '非洲' },
+	{ name: '莫桑比克', code: 'MZ', continent: '非洲' },
+	{ name: '马达加斯加', code: 'MG', continent: '非洲' },
+	{ name: '喀麦隆', code: 'CM', continent: '非洲' },
+	{ name: '科特迪瓦', code: 'CI', continent: '非洲' },
+	{ name: '布基纳法索', code: 'BF', continent: '非洲' },
+	{ name: '马里', code: 'ML', continent: '非洲' },
+	{ name: '尼日尔', code: 'NE', continent: '非洲' },
+	{ name: '乍得', code: 'TD', continent: '非洲' },
+	{ name: '塞内加尔', code: 'SN', continent: '非洲' },
+	{ name: '几内亚', code: 'GN', continent: '非洲' },
+	{ name: '塞拉利昂', code: 'SL', continent: '非洲' },
+	{ name: '利比里亚', code: 'LR', continent: '非洲' },
+	{ name: '多哥', code: 'TG', continent: '非洲' },
+	{ name: '贝宁', code: 'BJ', continent: '非洲' },
+	{ name: '卢旺达', code: 'RW', continent: '非洲' },
+	{ name: '布隆迪', code: 'BI', continent: '非洲' },
+	{ name: '吉布提', code: 'DJ', continent: '非洲' },
+	{ name: '索马里', code: 'SO', continent: '非洲' },
+	{ name: '厄立特里亚', code: 'ER', continent: '非洲' },
+	{ name: '利比亚', code: 'LY', continent: '非洲' },
+	{ name: '突尼斯', code: 'TN', continent: '非洲' },
+	{ name: '南苏丹', code: 'SS', continent: '非洲' },
+	{ name: '中非', code: 'CF', continent: '非洲' },
+	{ name: '刚果', code: 'CG', continent: '非洲' },
+	{ name: '刚果民主共和国', code: 'CD', continent: '非洲' },
+	{ name: '加蓬', code: 'GA', continent: '非洲' },
+	{ name: '赤道几内亚', code: 'GQ', continent: '非洲' },
+	{ name: '圣多美和普林西比', code: 'ST', continent: '非洲' },
+	{ name: '佛得角', code: 'CV', continent: '非洲' },
+	{ name: '塞舌尔', code: 'SC', continent: '非洲' },
+	{ name: '毛里求斯', code: 'MU', continent: '非洲' },
+	{ name: '科摩罗', code: 'KM', continent: '非洲' },
+	{ name: '马约特', code: 'YT', continent: '非洲' },
+	{ name: '留尼汪', code: 'RE', continent: '非洲' },
+	{ name: '圣赫勒拿', code: 'SH', continent: '非洲' },
+	{ name: '西撒哈拉', code: 'EH', continent: '非洲' },
+	{ name: '博茨瓦纳', code: 'BW', continent: '非洲' },
+	{ name: '纳米比亚', code: 'NA', continent: '非洲' },
+	{ name: '斯威士兰', code: 'SZ', continent: '非洲' },
+	{ name: '莱索托', code: 'LS', continent: '非洲' }
+];
+
+// 中国省份数据
+const chinaProvinces = [
+	'北京市', '天津市', '河北省', '山西省', '内蒙古自治区', '辽宁省', '吉林省', '黑龙江省',
+	'上海市', '江苏省', '浙江省', '安徽省', '福建省', '江西省', '山东省', '河南省',
+	'湖北省', '湖南省', '广东省', '广西壮族自治区', '海南省', '重庆市', '四川省', '贵州省',
+	'云南省', '西藏自治区', '陕西省', '甘肃省', '青海省', '宁夏回族自治区', '新疆维吾尔自治区',
+	'香港特别行政区', '澳门特别行政区', '台湾省'
+];
+
+// 美国州数据
+const usaStates = [
+	'阿拉巴马州', '阿拉斯加州', '亚利桑那州', '阿肯色州', '加利福尼亚州', '科罗拉多州', '康涅狄格州', '特拉华州',
+	'佛罗里达州', '佐治亚州', '夏威夷州', '爱达荷州', '伊利诺伊州', '印第安纳州', '爱荷华州', '堪萨斯州',
+	'肯塔基州', '路易斯安那州', '缅因州', '马里兰州', '马萨诸塞州', '密歇根州', '明尼苏达州', '密西西比州',
+	'密苏里州', '蒙大拿州', '内布拉斯加州', '内华达州', '新罕布什尔州', '新泽西州', '新墨西哥州', '纽约州',
+	'北卡罗来纳州', '北达科他州', '俄亥俄州', '俄克拉荷马州', '俄勒冈州', '宾夕法尼亚州', '罗得岛州', '南卡罗来纳州',
+	'南达科他州', '田纳西州', '德克萨斯州', '犹他州', '佛蒙特州', '弗吉尼亚州', '华盛顿州', '西弗吉尼亚州',
+	'威斯康星州', '怀俄明州'
+];
+
+// 其他国家的主要省份/州
+const otherStates: { [key: string]: string[] } = {
+	'CA': ['安大略省', '魁北克省', '不列颠哥伦比亚省', '阿尔伯塔省', '马尼托巴省', '萨斯喀彻温省', '新斯科舍省', '新不伦瑞克省', '纽芬兰与拉布拉多省', '爱德华王子岛省', '育空地区', '西北地区', '努纳武特地区'],
+	'AU': ['新南威尔士州', '维多利亚州', '昆士兰州', '西澳大利亚州', '南澳大利亚州', '塔斯马尼亚州', '澳大利亚首都领地', '北领地'],
+	'BR': ['圣保罗州', '里约热内卢州', '米纳斯吉拉斯州', '巴伊亚州', '巴拉那州', '南里奥格兰德州', '伯南布哥州', '塞阿拉州', '帕拉州', '马托格罗索州'],
+	'IN': ['马哈拉施特拉邦', '北方邦', '比哈尔邦', '西孟加拉邦', '安得拉邦', '泰米尔纳德邦', '中央邦', '拉贾斯坦邦', '卡纳塔克邦', '古吉拉特邦'],
+	'JP': ['东京都', '大阪府', '爱知县', '神奈川县', '埼玉县', '千叶县', '兵库县', '北海道', '福冈县', '静冈县'],
+	'KR': ['首尔特别市', '釜山广域市', '大邱广域市', '仁川广域市', '光州广域市', '大田广域市', '蔚山广域市', '京畿道', '江原道', '忠清北道'],
+	'DE': ['巴伐利亚州', '巴登-符腾堡州', '北莱茵-威斯特法伦州', '下萨克森州', '黑森州', '萨克森州', '莱茵兰-普法尔茨州', '柏林州', '石勒苏益格-荷尔斯泰因州', '勃兰登堡州'],
+	'FR': ['法兰西岛大区', '奥弗涅-罗讷-阿尔卑斯大区', '新阿基坦大区', '奥克西塔尼大区', '普罗旺斯-阿尔卑斯-蓝色海岸大区', '大东部大区', '上法兰西大区', '布列塔尼大区', '卢瓦尔河地区大区', '诺曼底大区'],
+	'GB': ['英格兰', '苏格兰', '威尔士', '北爱尔兰'],
+	'IT': ['伦巴第大区', '拉齐奥大区', '坎帕尼亚大区', '西西里大区', '威尼托大区', '艾米利亚-罗马涅大区', '皮埃蒙特大区', '普利亚大区', '托斯卡纳大区', '卡拉布里亚大区'],
+	'ES': ['安达卢西亚自治区', '加泰罗尼亚自治区', '马德里自治区', '瓦伦西亚自治区', '加利西亚自治区', '卡斯蒂利亚-莱昂自治区', '巴斯克自治区', '卡斯蒂利亚-拉曼恰自治区', '穆尔西亚自治区', '阿拉贡自治区'],
+	'RU': ['莫斯科州', '圣彼得堡州', '克拉斯诺达尔边疆区', '斯维尔德洛夫斯克州', '新西伯利亚州', '下诺夫哥罗德州', '萨马拉州', '车里雅宾斯克州', '鄂木斯克州', '鞑靼斯坦共和国'],
+	'MX': ['墨西哥州', '哈利斯科州', '新莱昂州', '普埃布拉州', '韦拉克鲁斯州', '瓜纳华托州', '恰帕斯州', '米却肯州', '瓦哈卡州', '奇瓦瓦州'],
+	'AR': ['布宜诺斯艾利斯省', '科尔多瓦省', '圣菲省', '门多萨省', '图库曼省', '恩特雷里奥斯省', '萨尔塔省', '查科省', '科连特斯省', '圣地亚哥-德尔埃斯特罗省'],
+	'ZA': ['豪登省', '夸祖鲁-纳塔尔省', '西开普省', '东开普省', '自由州省', '林波波省', '普马兰加省', '北开普省', '西北省']
+};
+
+// 初始化地区数据
+const initRegionData = () => {
+	// 按大洲分组
+	const continentMap: { [key: string]: any[] } = {
+		'亚洲': [],
+		'欧洲': [],
+		'北美洲': [],
+		'南美洲': [],
+		'大洋洲': [],
+		'非洲': []
+	};
+	
+	countriesData.forEach(country => {
+		if (continentMap[country.continent]) {
+			continentMap[country.continent].push(country);
+		}
+	});
+	
+	// 转换为数组格式
+	continentOptions.value = Object.keys(continentMap).map(continent => ({
+		label: continent,
+		countries: continentMap[continent].sort((a, b) => a.name.localeCompare(b.name))
+	}));
+};
+
+// 国家变化处理
+const onCountryChange = (countryCodeValue: string) => {
+	selectedState.value = '';
+	countryCode.value = countryCodeValue;
+	
+	// 根据国家代码获取省份/州
+	if (countryCodeValue === 'CN') {
+		states.value = chinaProvinces.map(name => ({ name, code: name }));
+	} else if (countryCodeValue === 'US') {
+		states.value = usaStates.map(name => ({ name, code: name }));
+	} else if (otherStates[countryCodeValue]) {
+		states.value = otherStates[countryCodeValue].map(name => ({ name, code: name }));
+	} else {
+		states.value = [];
+	}
+};
+
+// 省份变化处理
+const onStateChange = (stateName: string) => {
+	// 省份选择完成
+};
+
+// 添加地区
+const addRegion = () => {
+	if (!selectedCountry.value) return;
+	
+	const country = countriesData.find(c => c.code === selectedCountry.value);
+	if (!country) return;
+	
+	const regionData: RegionData = {
+		country: country.name,
+		code: country.code
+	};
+	
+	if (selectedState.value) {
+		regionData.state = selectedState.value;
+	}
+	
+	const currentRegions = props.modelValue || [];
+	const newRegions = [...currentRegions, regionData];
+	
+	emit('update:modelValue', newRegions);
+	
+	// 重置选择
+	selectedCountry.value = '';
+	selectedState.value = '';
+	states.value = [];
+	countryCode.value = '';
+};
+
+// 组件挂载时初始化地区数据
+onMounted(() => {
+	initRegionData();
+});
+</script>
+
+<style lang="scss" scoped>
+.chinese-region-selector {
+	display: flex;
+	align-items: center;
+	flex-wrap: wrap;
+	gap: 8px;
+}
+</style>