@robot-admin/naive-ui-components 0.8.1 → 0.9.0

package/dist/C_City.css

@@ -1,4 +1,4 @@
-/* unplugin-vue-components disabled */.city-selector-trigger[data-v-06a335f4] {
+/* unplugin-vue-components disabled */.city-selector-trigger[data-v-00b4ba0b] {
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
@@ -10,29 +10,29 @@
   cursor: pointer;
   transition: all 0.3s;
 }
-.city-selector-trigger[data-v-06a335f4]:hover {
+.city-selector-trigger[data-v-00b4ba0b]:hover {
   border-color: var(--c-primary, #1890ff);
 }
-.city-selector-trigger__text[data-v-06a335f4] {
+.city-selector-trigger__text[data-v-00b4ba0b] {
   flex: 1;
   font-size: 14px;
 }
-.city-selector-trigger__icon[data-v-06a335f4] {
+.city-selector-trigger__icon[data-v-00b4ba0b] {
   margin-left: 8px;
   color: #999;
   font-size: 16px;
   transition: transform 0.3s;
 }
-.city-selector-trigger__icon.is-active[data-v-06a335f4] {
+.city-selector-trigger__icon.is-active[data-v-00b4ba0b] {
   transform: rotate(180deg);
 }
-.city-selector-content[data-v-06a335f4] {
+.city-selector-content[data-v-00b4ba0b] {
   display: flex;
   flex-direction: column;
   height: 500px;
   padding: 0;
 }
-.city-selector-header[data-v-06a335f4] {
+.city-selector-header[data-v-00b4ba0b] {
   display: flex;
   align-items: center;
   gap: 12px;
@@ -40,10 +40,10 @@
   border-bottom: 1px solid rgba(247, 247, 247, 0.514);
   flex-shrink: 0;
 }
-.city-selector-header .city-selector-search[data-v-06a335f4] {
+.city-selector-header .city-selector-search[data-v-00b4ba0b] {
   flex: 1;
 }
-.city-selector-letters[data-v-06a335f4] {
+.city-selector-letters[data-v-00b4ba0b] {
   display: flex;
   flex-wrap: wrap;
   gap: 6px;
@@ -51,7 +51,7 @@
   padding: 8px;
   flex-shrink: 0;
 }
-.city-selector-letters .city-selector-letter[data-v-06a335f4] {
+.city-selector-letters .city-selector-letter[data-v-00b4ba0b] {
   padding: 2px 6px;
   cursor: pointer;
   color: var(--c-primary, #1890ff);
@@ -61,52 +61,52 @@
   min-width: 24px;
   text-align: center;
 }
-.city-selector-letters .city-selector-letter[data-v-06a335f4]:hover {
+.city-selector-letters .city-selector-letter[data-v-00b4ba0b]:hover {
   background-color: var(--c-primary, #1890ff);
   color: #fff;
   border-radius: 2px;
 }
-.city-selector-body[data-v-06a335f4] {
+.city-selector-body[data-v-00b4ba0b] {
   flex: 1;
   margin: 12px;
   margin-top: 8px;
   overflow: hidden;
 }
-.city-list[data-v-06a335f4],
-.province-list[data-v-06a335f4] {
+.city-list[data-v-00b4ba0b],
+.province-list[data-v-00b4ba0b] {
   padding: 0 8px;
 }
-.city-group[data-v-06a335f4],
-.province-group[data-v-06a335f4] {
+.city-group[data-v-00b4ba0b],
+.province-group[data-v-00b4ba0b] {
   display: flex;
   margin-bottom: 12px;
   padding-bottom: 12px;
   border-bottom: 1px solid rgba(247, 247, 247, 0.514);
 }
-.city-group[data-v-06a335f4]:last-child,
-.province-group[data-v-06a335f4]:last-child {
+.city-group[data-v-00b4ba0b]:last-child,
+.province-group[data-v-00b4ba0b]:last-child {
   border-bottom: none;
   margin-bottom: 0;
   padding-bottom: 0;
 }
-.city-group__letter[data-v-06a335f4], .city-group__name[data-v-06a335f4],
-.province-group__letter[data-v-06a335f4],
-.province-group__name[data-v-06a335f4] {
+.city-group__letter[data-v-00b4ba0b], .city-group__name[data-v-00b4ba0b],
+.province-group__letter[data-v-00b4ba0b],
+.province-group__name[data-v-00b4ba0b] {
   flex-shrink: 0;
   width: 70px;
   font-weight: 500;
   font-size: 14px;
   line-height: 28px;
 }
-.city-group__cities[data-v-06a335f4],
-.province-group__cities[data-v-06a335f4] {
+.city-group__cities[data-v-00b4ba0b],
+.province-group__cities[data-v-00b4ba0b] {
   flex: 1;
   display: flex;
   flex-wrap: wrap;
   gap: 6px;
   align-items: flex-start;
 }
-.city-item[data-v-06a335f4] {
+.city-item[data-v-00b4ba0b] {
   padding: 3px 10px;
   cursor: pointer;
   font-size: 13px;
@@ -114,19 +114,19 @@
   transition: all 0.3s;
   line-height: 20px;
 }
-.city-item[data-v-06a335f4]:hover {
+.city-item[data-v-00b4ba0b]:hover {
   background-color: #f0f0f0;
   color: var(--c-primary, #1890ff);
 }
-.city-item.is-active[data-v-06a335f4] {
+.city-item.is-active[data-v-00b4ba0b] {
   background-color: var(--c-primary, #1890ff);
   color: #fff;
 }
-[data-v-06a335f4] .n-scrollbar .n-scrollbar-rail {
+[data-v-00b4ba0b] .n-scrollbar .n-scrollbar-rail {
   right: 2px;
 }
-[data-v-06a335f4] .n-scrollbar .n-scrollbar-content {
+[data-v-00b4ba0b] .n-scrollbar .n-scrollbar-content {
   padding-right: 12px;
 }
 
-/*# sourceMappingURL=C_City-Cv5BESaN.css.map*/
+/*# sourceMappingURL=C_City-Bam08Qv3.css.map*/

package/dist/C_City.js.map

@@ -1 +1 @@
-{"version":3,"file":"C_City.js","names":["modelValue","placeholder","showLetters"],"sources":["../src/components/C_City/province.json","../src/components/C_City/index.vue","../src/components/C_City/index.vue","../src/components/C_City/index.vue"],"sourcesContent":["","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-05-30\r\n * @Description: 城市选择器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <NPopover\r\n    v-model:show=\"visible\"\r\n    placement=\"bottom-start\"\r\n    :width=\"430\"\r\n    trigger=\"click\"\r\n    :show-arrow=\"false\"\r\n  >\r\n    <template #trigger>\r\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\r\n        <div class=\"city-selector-trigger\">\r\n          <span class=\"city-selector-trigger__text\">{{\r\n            modelValue || placeholder\r\n          }}</span>\r\n        </div>\r\n      </slot>\r\n    </template>\r\n\r\n    <div class=\"city-selector-content\">\r\n      <div class=\"city-selector-header\">\r\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\r\n          <NRadioButton value=\"city\">按城市</NRadioButton>\r\n          <NRadioButton value=\"province\">按省份</NRadioButton>\r\n        </NRadioGroup>\r\n        <NSelect\r\n          v-model:value=\"searchValue\"\r\n          class=\"city-selector-search\"\r\n          :options=\"searchOptions\"\r\n          filterable\r\n          clearable\r\n          placeholder=\"搜索城市\"\r\n          @update:value=\"handleSearchSelect\"\r\n        />\r\n      </div>\r\n\r\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\r\n        <span\r\n          v-for=\"letter in letters\"\r\n          :key=\"letter\"\r\n          class=\"city-selector-letter\"\r\n          @click=\"scrollToLetter(letter)\"\r\n        >\r\n          {{ letter }}\r\n        </span>\r\n      </div>\r\n\r\n      <NScrollbar class=\"city-selector-body\">\r\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\r\n          <div\r\n            v-for=\"(cities, letter) in cityDataByLetter\"\r\n            :key=\"letter\"\r\n            :id=\"`letter-${letter}`\"\r\n            class=\"city-group\"\r\n          >\r\n            <div class=\"city-group__letter\">{{ letter }}:</div>\r\n            <div class=\"city-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in cities\"\r\n                :key=\"`${letter}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city.name }\"\r\n                @click=\"handleCitySelect(city.name)\"\r\n              >\r\n                {{ city.name }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div v-else class=\"province-list\">\r\n          <div\r\n            v-for=\"province in allProvinces\"\r\n            :key=\"province.id\"\r\n            :id=\"`letter-${province.id}`\"\r\n            class=\"province-group\"\r\n          >\r\n            <div class=\"province-group__name\">{{ province.name }}:</div>\r\n            <div class=\"province-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in province.data\"\r\n                :key=\"`${province.id}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city }\"\r\n                @click=\"handleCitySelect(city)\"\r\n              >\r\n                {{ city }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </NScrollbar>\r\n    </div>\r\n  </NPopover>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onMounted } from \"vue\";\r\nimport {\r\n  NPopover,\r\n  NRadioGroup,\r\n  NRadioButton,\r\n  NSelect,\r\n  NScrollbar,\r\n} from \"naive-ui\";\r\nimport type { SelectOption } from \"naive-ui\";\r\nimport provinceData from \"./province.json\";\r\n\r\ndefineOptions({ name: \"C_City\" });\r\n\r\ninterface CityItem {\r\n  id: number;\r\n  spell: string;\r\n  name: string;\r\n}\r\n\r\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\r\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\r\n\r\nonMounted(async () => {\r\n  const mod = await import(\"./city.json\");\r\n  cityData.value = mod.default ?? mod;\r\n});\r\n\r\ninterface ProvinceItem {\r\n  id?: string;\r\n  name: string;\r\n  data: string[];\r\n}\r\n\r\ninterface Props {\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  showLetters?: boolean;\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"change\", value: string): void;\r\n}\r\n\r\nwithDefaults(defineProps<Props>(), {\r\n  placeholder: \"请选择城市\",\r\n  showLetters: true,\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst visible = ref(false);\r\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\r\nconst searchValue = ref(\"\");\r\n\r\nconst allProvinces = computed(() => {\r\n  const provinces: ProvinceItem[] = [];\r\n  Object.values(provinceData).forEach((group) => {\r\n    provinces.push(...(group as ProvinceItem[]));\r\n  });\r\n  return provinces;\r\n});\r\n\r\nconst cityDataByLetter = computed(() => {\r\n  if (cityData.value?.cities) {\r\n    return cityData.value.cities;\r\n  }\r\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\r\n  const cities: Record<string, CityItem[]> = {};\r\n  let cityId = 1;\r\n  const citySet = new Set<string>();\r\n  allProvinces.value.forEach((province) => {\r\n    province.data.forEach((cityName) => {\r\n      citySet.add(cityName);\r\n    });\r\n  });\r\n  Array.from(citySet).forEach((cityName) => {\r\n    const letter = cityName[0].toUpperCase();\r\n    if (!cities[letter]) cities[letter] = [];\r\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\r\n  });\r\n  const sortedCities: Record<string, CityItem[]> = {};\r\n  Object.keys(cities)\r\n    .sort()\r\n    .forEach((letter) => {\r\n      sortedCities[letter] = cities[letter].sort((a, b) =>\r\n        a.name.localeCompare(b.name, \"zh-CN\"),\r\n      );\r\n    });\r\n  return sortedCities;\r\n});\r\n\r\nconst letters = computed(() => {\r\n  if (radioValue.value === \"city\") {\r\n    return Object.keys(cityDataByLetter.value).sort();\r\n  } else {\r\n    const provinceLetters = new Set<string>();\r\n    Object.keys(provinceData).forEach((key) => {\r\n      if (key !== \"直辖市\" && key !== \"港澳\") {\r\n        provinceLetters.add(key);\r\n      }\r\n    });\r\n    const result = Array.from(provinceLetters).sort();\r\n    result.push(\"直辖市\", \"港澳\");\r\n    return result;\r\n  }\r\n});\r\n\r\nconst searchOptions = computed((): SelectOption[] => {\r\n  if (radioValue.value === \"city\") {\r\n    const options: SelectOption[] = [];\r\n    Object.values(cityDataByLetter.value).forEach((cities) => {\r\n      (cities as CityItem[]).forEach((city) => {\r\n        options.push({\r\n          label: city.name,\r\n          value: city.name,\r\n        });\r\n      });\r\n    });\r\n    return options;\r\n  } else {\r\n    return allProvinces.value.flatMap((province) =>\r\n      province.data.map((city) => ({\r\n        label: `${city} (${province.name})`,\r\n        value: city,\r\n      })),\r\n    );\r\n  }\r\n});\r\n\r\nconst handleCitySelect = (cityName: string): void => {\r\n  emit(\"update:modelValue\", cityName);\r\n  emit(\"change\", cityName);\r\n  visible.value = false;\r\n};\r\n\r\nconst handleSearchSelect = (value: string): void => {\r\n  if (value) {\r\n    handleCitySelect(value);\r\n    searchValue.value = \"\";\r\n  }\r\n};\r\n\r\nconst scrollToLetter = (letter: string): void => {\r\n  const element = document.getElementById(`letter-${letter}`);\r\n  if (element) {\r\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\r\n  }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-05-30\r\n * @Description: 城市选择器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <NPopover\r\n    v-model:show=\"visible\"\r\n    placement=\"bottom-start\"\r\n    :width=\"430\"\r\n    trigger=\"click\"\r\n    :show-arrow=\"false\"\r\n  >\r\n    <template #trigger>\r\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\r\n        <div class=\"city-selector-trigger\">\r\n          <span class=\"city-selector-trigger__text\">{{\r\n            modelValue || placeholder\r\n          }}</span>\r\n        </div>\r\n      </slot>\r\n    </template>\r\n\r\n    <div class=\"city-selector-content\">\r\n      <div class=\"city-selector-header\">\r\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\r\n          <NRadioButton value=\"city\">按城市</NRadioButton>\r\n          <NRadioButton value=\"province\">按省份</NRadioButton>\r\n        </NRadioGroup>\r\n        <NSelect\r\n          v-model:value=\"searchValue\"\r\n          class=\"city-selector-search\"\r\n          :options=\"searchOptions\"\r\n          filterable\r\n          clearable\r\n          placeholder=\"搜索城市\"\r\n          @update:value=\"handleSearchSelect\"\r\n        />\r\n      </div>\r\n\r\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\r\n        <span\r\n          v-for=\"letter in letters\"\r\n          :key=\"letter\"\r\n          class=\"city-selector-letter\"\r\n          @click=\"scrollToLetter(letter)\"\r\n        >\r\n          {{ letter }}\r\n        </span>\r\n      </div>\r\n\r\n      <NScrollbar class=\"city-selector-body\">\r\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\r\n          <div\r\n            v-for=\"(cities, letter) in cityDataByLetter\"\r\n            :key=\"letter\"\r\n            :id=\"`letter-${letter}`\"\r\n            class=\"city-group\"\r\n          >\r\n            <div class=\"city-group__letter\">{{ letter }}:</div>\r\n            <div class=\"city-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in cities\"\r\n                :key=\"`${letter}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city.name }\"\r\n                @click=\"handleCitySelect(city.name)\"\r\n              >\r\n                {{ city.name }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div v-else class=\"province-list\">\r\n          <div\r\n            v-for=\"province in allProvinces\"\r\n            :key=\"province.id\"\r\n            :id=\"`letter-${province.id}`\"\r\n            class=\"province-group\"\r\n          >\r\n            <div class=\"province-group__name\">{{ province.name }}:</div>\r\n            <div class=\"province-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in province.data\"\r\n                :key=\"`${province.id}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city }\"\r\n                @click=\"handleCitySelect(city)\"\r\n              >\r\n                {{ city }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </NScrollbar>\r\n    </div>\r\n  </NPopover>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onMounted } from \"vue\";\r\nimport {\r\n  NPopover,\r\n  NRadioGroup,\r\n  NRadioButton,\r\n  NSelect,\r\n  NScrollbar,\r\n} from \"naive-ui\";\r\nimport type { SelectOption } from \"naive-ui\";\r\nimport provinceData from \"./province.json\";\r\n\r\ndefineOptions({ name: \"C_City\" });\r\n\r\ninterface CityItem {\r\n  id: number;\r\n  spell: string;\r\n  name: string;\r\n}\r\n\r\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\r\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\r\n\r\nonMounted(async () => {\r\n  const mod = await import(\"./city.json\");\r\n  cityData.value = mod.default ?? mod;\r\n});\r\n\r\ninterface ProvinceItem {\r\n  id?: string;\r\n  name: string;\r\n  data: string[];\r\n}\r\n\r\ninterface Props {\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  showLetters?: boolean;\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"change\", value: string): void;\r\n}\r\n\r\nwithDefaults(defineProps<Props>(), {\r\n  placeholder: \"请选择城市\",\r\n  showLetters: true,\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst visible = ref(false);\r\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\r\nconst searchValue = ref(\"\");\r\n\r\nconst allProvinces = computed(() => {\r\n  const provinces: ProvinceItem[] = [];\r\n  Object.values(provinceData).forEach((group) => {\r\n    provinces.push(...(group as ProvinceItem[]));\r\n  });\r\n  return provinces;\r\n});\r\n\r\nconst cityDataByLetter = computed(() => {\r\n  if (cityData.value?.cities) {\r\n    return cityData.value.cities;\r\n  }\r\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\r\n  const cities: Record<string, CityItem[]> = {};\r\n  let cityId = 1;\r\n  const citySet = new Set<string>();\r\n  allProvinces.value.forEach((province) => {\r\n    province.data.forEach((cityName) => {\r\n      citySet.add(cityName);\r\n    });\r\n  });\r\n  Array.from(citySet).forEach((cityName) => {\r\n    const letter = cityName[0].toUpperCase();\r\n    if (!cities[letter]) cities[letter] = [];\r\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\r\n  });\r\n  const sortedCities: Record<string, CityItem[]> = {};\r\n  Object.keys(cities)\r\n    .sort()\r\n    .forEach((letter) => {\r\n      sortedCities[letter] = cities[letter].sort((a, b) =>\r\n        a.name.localeCompare(b.name, \"zh-CN\"),\r\n      );\r\n    });\r\n  return sortedCities;\r\n});\r\n\r\nconst letters = computed(() => {\r\n  if (radioValue.value === \"city\") {\r\n    return Object.keys(cityDataByLetter.value).sort();\r\n  } else {\r\n    const provinceLetters = new Set<string>();\r\n    Object.keys(provinceData).forEach((key) => {\r\n      if (key !== \"直辖市\" && key !== \"港澳\") {\r\n        provinceLetters.add(key);\r\n      }\r\n    });\r\n    const result = Array.from(provinceLetters).sort();\r\n    result.push(\"直辖市\", \"港澳\");\r\n    return result;\r\n  }\r\n});\r\n\r\nconst searchOptions = computed((): SelectOption[] => {\r\n  if (radioValue.value === \"city\") {\r\n    const options: SelectOption[] = [];\r\n    Object.values(cityDataByLetter.value).forEach((cities) => {\r\n      (cities as CityItem[]).forEach((city) => {\r\n        options.push({\r\n          label: city.name,\r\n          value: city.name,\r\n        });\r\n      });\r\n    });\r\n    return options;\r\n  } else {\r\n    return allProvinces.value.flatMap((province) =>\r\n      province.data.map((city) => ({\r\n        label: `${city} (${province.name})`,\r\n        value: city,\r\n      })),\r\n    );\r\n  }\r\n});\r\n\r\nconst handleCitySelect = (cityName: string): void => {\r\n  emit(\"update:modelValue\", cityName);\r\n  emit(\"change\", cityName);\r\n  visible.value = false;\r\n};\r\n\r\nconst handleSearchSelect = (value: string): void => {\r\n  if (value) {\r\n    handleCitySelect(value);\r\n    searchValue.value = \"\";\r\n  }\r\n};\r\n\r\nconst scrollToLetter = (letter: string): void => {\r\n  const element = document.getElementById(`letter-${letter}`);\r\n  if (element) {\r\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\r\n  }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-05-30\r\n * @Description: 城市选择器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <NPopover\r\n    v-model:show=\"visible\"\r\n    placement=\"bottom-start\"\r\n    :width=\"430\"\r\n    trigger=\"click\"\r\n    :show-arrow=\"false\"\r\n  >\r\n    <template #trigger>\r\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\r\n        <div class=\"city-selector-trigger\">\r\n          <span class=\"city-selector-trigger__text\">{{\r\n            modelValue || placeholder\r\n          }}</span>\r\n        </div>\r\n      </slot>\r\n    </template>\r\n\r\n    <div class=\"city-selector-content\">\r\n      <div class=\"city-selector-header\">\r\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\r\n          <NRadioButton value=\"city\">按城市</NRadioButton>\r\n          <NRadioButton value=\"province\">按省份</NRadioButton>\r\n        </NRadioGroup>\r\n        <NSelect\r\n          v-model:value=\"searchValue\"\r\n          class=\"city-selector-search\"\r\n          :options=\"searchOptions\"\r\n          filterable\r\n          clearable\r\n          placeholder=\"搜索城市\"\r\n          @update:value=\"handleSearchSelect\"\r\n        />\r\n      </div>\r\n\r\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\r\n        <span\r\n          v-for=\"letter in letters\"\r\n          :key=\"letter\"\r\n          class=\"city-selector-letter\"\r\n          @click=\"scrollToLetter(letter)\"\r\n        >\r\n          {{ letter }}\r\n        </span>\r\n      </div>\r\n\r\n      <NScrollbar class=\"city-selector-body\">\r\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\r\n          <div\r\n            v-for=\"(cities, letter) in cityDataByLetter\"\r\n            :key=\"letter\"\r\n            :id=\"`letter-${letter}`\"\r\n            class=\"city-group\"\r\n          >\r\n            <div class=\"city-group__letter\">{{ letter }}:</div>\r\n            <div class=\"city-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in cities\"\r\n                :key=\"`${letter}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city.name }\"\r\n                @click=\"handleCitySelect(city.name)\"\r\n              >\r\n                {{ city.name }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div v-else class=\"province-list\">\r\n          <div\r\n            v-for=\"province in allProvinces\"\r\n            :key=\"province.id\"\r\n            :id=\"`letter-${province.id}`\"\r\n            class=\"province-group\"\r\n          >\r\n            <div class=\"province-group__name\">{{ province.name }}:</div>\r\n            <div class=\"province-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in province.data\"\r\n                :key=\"`${province.id}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city }\"\r\n                @click=\"handleCitySelect(city)\"\r\n              >\r\n                {{ city }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </NScrollbar>\r\n    </div>\r\n  </NPopover>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onMounted } from \"vue\";\r\nimport {\r\n  NPopover,\r\n  NRadioGroup,\r\n  NRadioButton,\r\n  NSelect,\r\n  NScrollbar,\r\n} from \"naive-ui\";\r\nimport type { SelectOption } from \"naive-ui\";\r\nimport provinceData from \"./province.json\";\r\n\r\ndefineOptions({ name: \"C_City\" });\r\n\r\ninterface CityItem {\r\n  id: number;\r\n  spell: string;\r\n  name: string;\r\n}\r\n\r\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\r\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\r\n\r\nonMounted(async () => {\r\n  const mod = await import(\"./city.json\");\r\n  cityData.value = mod.default ?? mod;\r\n});\r\n\r\ninterface ProvinceItem {\r\n  id?: string;\r\n  name: string;\r\n  data: string[];\r\n}\r\n\r\ninterface Props {\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  showLetters?: boolean;\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"change\", value: string): void;\r\n}\r\n\r\nwithDefaults(defineProps<Props>(), {\r\n  placeholder: \"请选择城市\",\r\n  showLetters: true,\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst visible = ref(false);\r\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\r\nconst searchValue = ref(\"\");\r\n\r\nconst allProvinces = computed(() => {\r\n  const provinces: ProvinceItem[] = [];\r\n  Object.values(provinceData).forEach((group) => {\r\n    provinces.push(...(group as ProvinceItem[]));\r\n  });\r\n  return provinces;\r\n});\r\n\r\nconst cityDataByLetter = computed(() => {\r\n  if (cityData.value?.cities) {\r\n    return cityData.value.cities;\r\n  }\r\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\r\n  const cities: Record<string, CityItem[]> = {};\r\n  let cityId = 1;\r\n  const citySet = new Set<string>();\r\n  allProvinces.value.forEach((province) => {\r\n    province.data.forEach((cityName) => {\r\n      citySet.add(cityName);\r\n    });\r\n  });\r\n  Array.from(citySet).forEach((cityName) => {\r\n    const letter = cityName[0].toUpperCase();\r\n    if (!cities[letter]) cities[letter] = [];\r\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\r\n  });\r\n  const sortedCities: Record<string, CityItem[]> = {};\r\n  Object.keys(cities)\r\n    .sort()\r\n    .forEach((letter) => {\r\n      sortedCities[letter] = cities[letter].sort((a, b) =>\r\n        a.name.localeCompare(b.name, \"zh-CN\"),\r\n      );\r\n    });\r\n  return sortedCities;\r\n});\r\n\r\nconst letters = computed(() => {\r\n  if (radioValue.value === \"city\") {\r\n    return Object.keys(cityDataByLetter.value).sort();\r\n  } else {\r\n    const provinceLetters = new Set<string>();\r\n    Object.keys(provinceData).forEach((key) => {\r\n      if (key !== \"直辖市\" && key !== \"港澳\") {\r\n        provinceLetters.add(key);\r\n      }\r\n    });\r\n    const result = Array.from(provinceLetters).sort();\r\n    result.push(\"直辖市\", \"港澳\");\r\n    return result;\r\n  }\r\n});\r\n\r\nconst searchOptions = computed((): SelectOption[] => {\r\n  if (radioValue.value === \"city\") {\r\n    const options: SelectOption[] = [];\r\n    Object.values(cityDataByLetter.value).forEach((cities) => {\r\n      (cities as CityItem[]).forEach((city) => {\r\n        options.push({\r\n          label: city.name,\r\n          value: city.name,\r\n        });\r\n      });\r\n    });\r\n    return options;\r\n  } else {\r\n    return allProvinces.value.flatMap((province) =>\r\n      province.data.map((city) => ({\r\n        label: `${city} (${province.name})`,\r\n        value: city,\r\n      })),\r\n    );\r\n  }\r\n});\r\n\r\nconst handleCitySelect = (cityName: string): void => {\r\n  emit(\"update:modelValue\", cityName);\r\n  emit(\"change\", cityName);\r\n  visible.value = false;\r\n};\r\n\r\nconst handleSearchSelect = (value: string): void => {\r\n  if (value) {\r\n    handleCitySelect(value);\r\n    searchValue.value = \"\";\r\n  }\r\n};\r\n\r\nconst scrollToLetter = (letter: string): void => {\r\n  const element = document.getElementById(`letter-${letter}`);\r\n  if (element) {\r\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\r\n  }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n"],"mappings":"86HG2HA,IAAM,GAAA,EAAA,EAAA,KAA8D,KAAK,EAEzE,EAAA,EAAA,WAAU,SAAY,CACpB,IAAM,EAAM,MAAA,QAAA,SAAA,CAAA,SAAA,QAAM,YAAA,CAAA,CAClB,EAAS,MAAQ,EAAI,SAAW,GAChC,CAwBF,IAAM,EAAO,EAEP,GAAA,EAAA,EAAA,KAAc,GAAM,CACpB,GAAA,EAAA,EAAA,KAAsC,OAAO,CAC7C,GAAA,EAAA,EAAA,KAAkB,GAAG,CAErB,GAAA,EAAA,EAAA,cAA8B,CAClC,IAAM,EAA4B,EAAE,CAIpC,OAHA,OAAO,OAAO,EAAa,CAAC,QAAS,GAAU,CAC7C,EAAU,KAAK,GAAI,EAAyB,EAC5C,CACK,GACP,CAEI,GAAA,EAAA,EAAA,cAAkC,CACtC,GAAI,EAAS,OAAO,OAClB,OAAO,EAAS,MAAM,OAGxB,IAAM,EAAqC,EAAE,CACzC,EAAS,EACP,EAAU,IAAI,IACpB,EAAa,MAAM,QAAS,GAAa,CACvC,EAAS,KAAK,QAAS,GAAa,CAClC,EAAQ,IAAI,EAAS,EACrB,EACF,CACF,MAAM,KAAK,EAAQ,CAAC,QAAS,GAAa,CACxC,IAAM,EAAS,EAAS,GAAG,aAAa,CACnC,EAAO,KAAS,EAAO,GAAU,EAAE,EACxC,EAAO,GAAQ,KAAK,CAAE,GAAI,IAAU,KAAM,EAAU,MAAO,GAAI,CAAC,EAChE,CACF,IAAM,EAA2C,EAAE,CAQnD,OAPA,OAAO,KAAK,EAAO,CAChB,MAAM,CACN,QAAS,GAAW,CACnB,EAAa,GAAU,EAAO,GAAQ,MAAM,EAAG,IAC7C,EAAE,KAAK,cAAc,EAAE,KAAM,QAAQ,CACtC,EACD,CACG,GACP,CAEI,GAAA,EAAA,EAAA,cAAyB,CAC7B,GAAI,EAAW,QAAU,OACvB,OAAO,OAAO,KAAK,EAAiB,MAAM,CAAC,MAAM,CAC5C,CACL,IAAM,EAAkB,IAAI,IAC5B,OAAO,KAAK,EAAa,CAAC,QAAS,GAAQ,CACrC,IAAQ,OAAS,IAAQ,MAC3B,EAAgB,IAAI,EAAI,EAE1B,CACF,IAAM,EAAS,MAAM,KAAK,EAAgB,CAAC,MAAM,CAEjD,OADA,EAAO,KAAK,MAAO,KAAK,CACjB,IAET,CAEI,GAAA,EAAA,EAAA,cAA+C,CACnD,GAAI,EAAW,QAAU,OAAQ,CAC/B,IAAM,EAA0B,EAAE,CASlC,OARA,OAAO,OAAO,EAAiB,MAAM,CAAC,QAAS,GAAW,CACvD,EAAsB,QAAS,GAAS,CACvC,EAAQ,KAAK,CACX,MAAO,EAAK,KACZ,MAAO,EAAK,KACb,CAAC,EACF,EACF,CACK,OAEP,OAAO,EAAa,MAAM,QAAS,GACjC,EAAS,KAAK,IAAK,IAAU,CAC3B,MAAO,GAAG,EAAK,IAAI,EAAS,KAAK,GACjC,MAAO,EACR,EAAE,CACJ,EAEH,CAEI,EAAoB,GAA2B,CACnD,EAAK,oBAAqB,EAAS,CACnC,EAAK,SAAU,EAAS,CACxB,EAAQ,MAAQ,IAGZ,EAAsB,GAAwB,CAC9C,IACF,EAAiB,EAAM,CACvB,EAAY,MAAQ,KAIlB,EAAkB,GAAyB,CAC/C,IAAM,EAAU,SAAS,eAAe,UAAU,IAAS,CACvD,GACF,EAAQ,eAAe,CAAE,SAAU,SAAU,MAAO,QAAS,CAAC,gEAtJrD,EAAA,SAAA,CAAA,CA1FD,KAAM,EAAA,gCAAA,EAAO,MAAA,EACrB,UAAU,eACT,MAAO,IACR,QAAQ,QACP,aAAY,KAEF,SAAA,EAAA,EAAA,aAOF,EAAA,EAAA,EAAA,YAAA,EAAA,OAAA,UAAA,CANe,MAAOA,EAAAA,WAAa,QAAS,EAAA,WAM5C,EAAA,EAAA,EAAA,oBADC,MAJN,EAIM,EAAA,EAAA,EAAA,oBADK,OAFT,GAAA,EAAA,EAAA,iBACEA,EAAAA,YAAcC,EAAAA,YAAW,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,2BA+E3B,EAAA,EAAA,EAAA,oBAAA,MAzEN,EAyEM,0BA1DE,MAdN,EAcM,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAVU,EAAA,YAAA,CAAA,CAHO,MAAO,EAAA,iCAAA,EAAU,MAAA,EAAE,KAAK,oCACE,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,aAAA,CAAA,CAA/B,MAAM,OAAM,CAAA,2BAAI,AAAA,EAAA,KAAA,EAAA,EAAA,EAAA,iBAAH,MAAG,GAAA,CAAA,CAAA,4CACmB,EAAA,aAAA,CAAA,CAAnC,MAAM,WAAU,CAAA,2BAAI,AAAA,EAAA,KAAA,EAAA,EAAA,EAAA,iBAAH,MAAG,GAAA,CAAA,CAAA,gEAUlC,EAAA,QAAA,CAAA,CAPQ,MAAO,EAAA,kCAAA,EAAW,MAAA,EAMX,EAAA,CALf,MAAM,uBACL,QAAS,EAAA,MACV,WAAA,GACA,UAAA,GACA,YAAY,sCAKLC,EAAAA,cAAAA,EAAAA,EAAAA,YAAAA,EAAAA,EAAAA,EAAAA,oBASL,MATN,EASM,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBADG,EAAA,SAAA,MAAA,EAAA,EAAA,YANY,EAAA,MAAV,+CAMF,OAAA,CALJ,IAAK,EACN,MAAM,uBACL,QAAK,GAAE,EAAe,EAAM,wBAE1B,EAAM,CAAA,EAAA,EAAA,8EAgDA,EAAA,WAAA,CAAA,CA5CD,MAAM,qBAAoB,CAAA,2BAuBV,CAtBf,EAAA,QAAU,SAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAoBf,MApBN,EAoBM,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBADE,EAAA,SAAA,MAAA,EAAA,EAAA,YAjBuB,EAAA,OAAnB,EAAQ,gDAiBZ,MAAA,CAhBH,IAAK,EACL,GAAE,UAAY,IACf,MAAM,wCAE6C,MAAnD,GAAA,EAAA,EAAA,iBAAmC,EAAM,CAAG,IAAC,EAAA,EAAA,EAAA,EAAA,oBAWvC,MAVN,EAUM,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBADG,EAAA,SAAA,MAAA,EAAA,EAAA,YAPmB,GAAhB,EAAM,gDAOT,OAAA,CANJ,IAAG,GAAK,EAAM,GAAI,IACnB,OAAA,EAAA,EAAA,gBAAK,CAAC,YAAW,CAAA,YACMF,EAAAA,aAAe,EAAK,KAAI,CAAA,CAAA,CAC9C,QAAK,GAAE,EAAiB,EAAK,KAAI,wBAE/B,EAAK,KAAI,CAAA,GAAA,EAAA,wEA0Bd,MApBN,EAoBM,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBADE,EAAA,SAAA,MAAA,EAAA,EAAA,YAjBe,EAAA,MAAZ,+CAiBH,MAAA,CAhBH,IAAK,EAAS,GACd,GAAE,UAAY,EAAS,KACxB,MAAM,4CAEsD,MAA5D,GAAA,EAAA,EAAA,iBAAqC,EAAS,KAAI,CAAG,IAAC,EAAA,EAAA,EAAA,EAAA,oBAWhD,MAVN,EAUM,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBADG,EAAA,SAAA,MAAA,EAAA,EAAA,YAPmB,EAAS,MAAzB,EAAM,gDAOT,OAAA,CANJ,IAAG,GAAK,EAAS,GAAE,GAAI,IACxB,OAAA,EAAA,EAAA,gBAAK,CAAC,YAAW,CAAA,YACMA,EAAAA,aAAe,EAAI,CAAA,CAAA,CACzC,QAAK,GAAE,EAAiB,EAAI,wBAE1B,EAAI,CAAA,GAAA,EAAA"}
+{"version":3,"file":"C_City.js","names":[],"sources":["../src/components/C_City/province.json","../src/components/C_City/index.vue"],"sourcesContent":["","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-05-30\n * @Description: 城市选择器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n  <NPopover\n    v-model:show=\"visible\"\n    placement=\"bottom-start\"\n    :width=\"430\"\n    trigger=\"click\"\n    :show-arrow=\"false\"\n  >\n    <template #trigger>\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\n        <div class=\"city-selector-trigger\">\n          <span class=\"city-selector-trigger__text\">{{\n            modelValue || placeholder\n          }}</span>\n        </div>\n      </slot>\n    </template>\n\n    <div class=\"city-selector-content\">\n      <div class=\"city-selector-header\">\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\n          <NRadioButton value=\"city\">按城市</NRadioButton>\n          <NRadioButton value=\"province\">按省份</NRadioButton>\n        </NRadioGroup>\n        <NSelect\n          v-model:value=\"searchValue\"\n          class=\"city-selector-search\"\n          :options=\"searchOptions\"\n          filterable\n          clearable\n          placeholder=\"搜索城市\"\n          @update:value=\"handleSearchSelect\"\n        />\n      </div>\n\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\n        <span\n          v-for=\"letter in letters\"\n          :key=\"letter\"\n          class=\"city-selector-letter\"\n          @click=\"scrollToLetter(letter)\"\n        >\n          {{ letter }}\n        </span>\n      </div>\n\n      <NScrollbar class=\"city-selector-body\">\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\n          <div\n            v-for=\"(cities, letter) in cityDataByLetter\"\n            :key=\"letter\"\n            :id=\"`letter-${letter}`\"\n            class=\"city-group\"\n          >\n            <div class=\"city-group__letter\">{{ letter }}:</div>\n            <div class=\"city-group__cities\">\n              <span\n                v-for=\"(city, index) in cities\"\n                :key=\"`${letter}-${index}`\"\n                class=\"city-item\"\n                :class=\"{ 'is-active': modelValue === city.name }\"\n                @click=\"handleCitySelect(city.name)\"\n              >\n                {{ city.name }}\n              </span>\n            </div>\n          </div>\n        </div>\n\n        <div v-else class=\"province-list\">\n          <div\n            v-for=\"province in allProvinces\"\n            :key=\"province.id\"\n            :id=\"`letter-${province.id}`\"\n            class=\"province-group\"\n          >\n            <div class=\"province-group__name\">{{ province.name }}:</div>\n            <div class=\"province-group__cities\">\n              <span\n                v-for=\"(city, index) in province.data\"\n                :key=\"`${province.id}-${index}`\"\n                class=\"city-item\"\n                :class=\"{ 'is-active': modelValue === city }\"\n                @click=\"handleCitySelect(city)\"\n              >\n                {{ city }}\n              </span>\n            </div>\n          </div>\n        </div>\n      </NScrollbar>\n    </div>\n  </NPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from \"vue\";\nimport {\n  NPopover,\n  NRadioGroup,\n  NRadioButton,\n  NSelect,\n  NScrollbar,\n} from \"naive-ui\";\nimport type { SelectOption } from \"naive-ui\";\nimport provinceData from \"./province.json\";\n\ndefineOptions({ name: \"C_City\" });\n\ninterface CityItem {\n  id: number;\n  spell: string;\n  name: string;\n}\n\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\n\nonMounted(async () => {\n  const mod = await import(\"./city.json\");\n  cityData.value = mod.default ?? mod;\n});\n\ninterface ProvinceItem {\n  id?: string;\n  name: string;\n  data: string[];\n}\n\ninterface Props {\n  modelValue?: string;\n  placeholder?: string;\n  showLetters?: boolean;\n}\n\ninterface Emits {\n  (e: \"update:modelValue\", value: string): void;\n  (e: \"change\", value: string): void;\n}\n\nwithDefaults(defineProps<Props>(), {\n  placeholder: \"请选择城市\",\n  showLetters: true,\n});\n\nconst emit = defineEmits<Emits>();\n\nconst visible = ref(false);\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\nconst searchValue = ref(\"\");\n\nconst allProvinces = computed(() => {\n  const provinces: ProvinceItem[] = [];\n  Object.values(provinceData).forEach((group) => {\n    provinces.push(...(group as ProvinceItem[]));\n  });\n  return provinces;\n});\n\nconst cityDataByLetter = computed(() => {\n  if (cityData.value?.cities) {\n    return cityData.value.cities;\n  }\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\n  const cities: Record<string, CityItem[]> = {};\n  let cityId = 1;\n  const citySet = new Set<string>();\n  allProvinces.value.forEach((province) => {\n    province.data.forEach((cityName) => {\n      citySet.add(cityName);\n    });\n  });\n  Array.from(citySet).forEach((cityName) => {\n    const letter = cityName[0].toUpperCase();\n    if (!cities[letter]) cities[letter] = [];\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\n  });\n  const sortedCities: Record<string, CityItem[]> = {};\n  Object.keys(cities)\n    .sort()\n    .forEach((letter) => {\n      sortedCities[letter] = cities[letter].sort((a, b) =>\n        a.name.localeCompare(b.name, \"zh-CN\"),\n      );\n    });\n  return sortedCities;\n});\n\nconst letters = computed(() => {\n  if (radioValue.value === \"city\") {\n    return Object.keys(cityDataByLetter.value).sort();\n  } else {\n    const provinceLetters = new Set<string>();\n    Object.keys(provinceData).forEach((key) => {\n      if (key !== \"直辖市\" && key !== \"港澳\") {\n        provinceLetters.add(key);\n      }\n    });\n    const result = Array.from(provinceLetters).sort();\n    result.push(\"直辖市\", \"港澳\");\n    return result;\n  }\n});\n\nconst searchOptions = computed((): SelectOption[] => {\n  if (radioValue.value === \"city\") {\n    const options: SelectOption[] = [];\n    Object.values(cityDataByLetter.value).forEach((cities) => {\n      (cities as CityItem[]).forEach((city) => {\n        options.push({\n          label: city.name,\n          value: city.name,\n        });\n      });\n    });\n    return options;\n  } else {\n    return allProvinces.value.flatMap((province) =>\n      province.data.map((city) => ({\n        label: `${city} (${province.name})`,\n        value: city,\n      })),\n    );\n  }\n});\n\nconst handleCitySelect = (cityName: string): void => {\n  emit(\"update:modelValue\", cityName);\n  emit(\"change\", cityName);\n  visible.value = false;\n};\n\nconst handleSearchSelect = (value: string): void => {\n  if (value) {\n    handleCitySelect(value);\n    searchValue.value = \"\";\n  }\n};\n\nconst scrollToLetter = (letter: string): void => {\n  const element = document.getElementById(`letter-${letter}`);\n  if (element) {\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n  }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n"],"mappings":"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"}

package/dist/C_City2.js

@@ -1,2 +1,2 @@
-import{t as e}from"./export-helper.js";import{NPopover as t,NRadioButton as n,NRadioGroup as r,NScrollbar as i,NSelect as a}from"naive-ui";import{Fragment as o,computed as s,createBlock as c,createCommentVNode as l,createElementBlock as u,createElementVNode as d,createTextVNode as f,createVNode as p,defineComponent as m,normalizeClass as h,onMounted as g,openBlock as _,ref as v,renderList as y,renderSlot as b,toDisplayString as x,unref as S,withCtx as C}from"vue";var w={A:[{name:`安徽`,id:`A`,data:[`合肥`,`芜湖`,`蚌埠`,`淮南`,`马鞍山`,`淮北`,`铜陵`,`安庆`,`黄山`,`滁州`,`阜阳`,`宿州`,`六安`,`亳州`,`池州`,`宣城`]}],C:[{name:`重庆`,id:`C`,data:`万州.涪陵.渝中.大渡口.江北.沙坪坝.九龙坡.南岸.北碚.綦江.大足.渝北.巴南.黔江.长寿.江津.合川.永川.南川.璧山.铜梁.潼南.荣昌.开州.梁平.武隆.城口县.丰都县.垫江县.忠县.云阳县.奉节县.巫山县.巫溪县.石柱土家族自治县.秀山土家族苗族自治县.酉阳土家族苗族自治县.彭水苗族土家族自治县`.split(`.`)}],F:[{name:`福建`,id:`F`,data:[`福州`,`厦门`,`莆田`,`三明`,`泉州`,`漳州`,`南平`,`龙岩`,`宁德`]}],G:[{name:`广东`,id:`G`,data:[`广州`,`韶关`,`深圳`,`珠海`,`汕头`,`佛山`,`江门`,`湛江`,`茂名`,`肇庆`,`惠州`,`梅州`,`汕尾`,`河源`,`阳江`,`清远`,`东莞`,`中山`,`潮州`,`揭阳`,`云浮`]},{name:`广西`,data:[`南宁`,`柳州`,`桂林`,`梧州`,`北海`,`防城港`,`钦州`,`贵港`,`玉林`,`百色`,`贺州`,`河池`,`来宾`,`崇左`]},{name:`贵州`,data:[`贵阳`,`六盘水`,`遵义`,`安顺`,`毕节`,`铜仁`,`黔西南布依族苗族自治州`,`黔东南苗族侗族自治州`,`黔南布依族苗族自治州`]},{name:`甘肃`,data:[`兰州`,`嘉峪关`,`金昌`,`白银`,`天水`,`武威`,`张掖`,`平凉`,`酒泉`,`庆阳`,`定西`,`陇南`,`临夏回族自治州`,`甘南藏族自治州`]}],H:[{name:`河北`,id:`H`,data:[`石家庄`,`唐山`,`秦皇岛`,`邯郸`,`邢台`,`保定`,`张家口`,`承德`,`沧州`,`廊坊`,`衡水`]},{name:`黑龙江`,data:[`哈尔滨`,`齐齐哈尔`,`鸡西`,`鹤岗`,`双鸭山`,`大庆`,`伊春`,`佳木斯`,`七台河`,`牡丹江`,`黑河`,`绥化`,`大兴安岭地`]},{name:`河南`,data:[`郑州`,`开封`,`洛阳`,`平顶山`,`安阳`,`鹤壁`,`新乡`,`焦作`,`濮阳`,`许昌`,`漯河`,`三门峡`,`南阳`,`商丘`,`信阳`,`周口`,`驻马店`,`济源`]},{name:`湖北`,data:[`武汉`,`黄石`,`十堰`,`宜昌`,`襄阳`,`鄂州`,`荆门`,`孝感`,`荆州`,`黄冈`,`咸宁`,`随州`,`恩施土家族苗族自治州`,`仙桃`,`潜江`,`天门`,`神农架林`]},{name:`湖南`,data:[`长沙`,`株洲`,`湘潭`,`衡阳`,`邵阳`,`岳阳`,`常德`,`张家界`,`益阳`,`郴州`,`永州`,`怀化`,`娄底`,`湘西土家族苗族自治州`]},{name:`海南`,data:[`海口`,`三亚`,`三沙`,`儋州`,`五指山`,`琼海`,`文昌`,`万宁`,`东方`,`定安县`,`屯昌县`,`澄迈县`,`临高县`,`白沙黎族自治县`,`昌江黎族自治县`,`乐东黎族自治县`,`陵水黎族自治县`,`保亭黎族苗族自治县`,`琼中黎族苗族自治县`]}],J:[{name:`吉林`,id:`J`,data:[`长春`,`吉林`,`四平`,`辽源`,`通化`,`白山`,`松原`,`白城`,`延边朝鲜族自治州`]},{name:`江苏`,data:[`南京`,`无锡`,`徐州`,`常州`,`苏州`,`南通`,`连云港`,`淮安`,`盐城`,`扬州`,`镇江`,`泰州`,`宿迁`]},{name:`江西`,data:[`南昌`,`景德镇`,`萍乡`,`九江`,`新余`,`鹰潭`,`赣州`,`吉安`,`宜春`,`抚州`,`上饶`]}],L:[{name:`辽宁`,id:`L`,data:[`沈阳`,`大连`,`鞍山`,`抚顺`,`本溪`,`丹东`,`锦州`,`营口`,`阜新`,`辽阳`,`盘锦`,`铁岭`,`朝阳`,`葫芦岛`]}],N:[{name:`内蒙古`,id:`N`,data:[`呼和浩特`,`包头`,`乌海`,`赤峰`,`通辽`,`鄂尔多斯`,`呼伦贝尔`,`巴彦淖尔`,`乌兰察布`,`兴安盟`,`锡林郭勒盟`,`阿拉善盟`]},{name:`宁夏`,data:[`银川`,`石嘴山`,`吴忠`,`固原`,`中卫`]}],Q:[{name:`青海`,id:`Q`,data:[`西宁`,`海东`,`海北藏族自治州`,`黄南藏族自治州`,`海南藏族自治州`,`果洛藏族自治州`,`玉树藏族自治州`,`海西蒙古族藏族自治州`]}],S:[{name:`山西`,id:`S`,data:[`太原`,`大同`,`阳泉`,`长治`,`晋城`,`朔州`,`晋中`,`运城`,`忻州`,`临汾`,`吕梁`]},{name:`上海`,data:[`黄浦`,`徐汇`,`长宁`,`静安`,`普陀`,`虹口`,`杨浦`,`闵行`,`宝山`,`嘉定`,`浦东新`,`金山`,`松江`,`青浦`,`奉贤`,`崇明`]},{name:`山东`,data:[`济南`,`青岛`,`淄博`,`枣庄`,`东营`,`烟台`,`潍坊`,`济宁`,`泰安`,`威海`,`日照`,`临沂`,`德州`,`聊城`,`滨州`,`菏泽`]},{name:`四川`,data:[`成都`,`自贡`,`攀枝花`,`泸州`,`德阳`,`绵阳`,`广元`,`遂宁`,`内江`,`乐山`,`南充`,`眉山`,`宜宾`,`广安`,`达州`,`雅安`,`巴中`,`资阳`,`阿坝藏族羌族自治州`,`甘孜藏族自治州`,`凉山彝族自治州`]},{name:`陕西`,data:[`西安`,`铜川`,`宝鸡`,`咸阳`,`渭南`,`延安`,`汉中`,`榆林`,`安康`,`商洛`]}],T:[{name:`天津`,id:`T`,data:[`和平`,`河东`,`河西`,`南开`,`河北`,`红桥`,`东丽`,`西青`,`津南`,`北辰`,`武清`,`宝坻`,`滨海新`,`宁河`,`静海`,`蓟州`]}],X:[{name:`西藏`,id:`X`,data:[`拉萨`,`日喀则`,`昌都`,`林芝`,`山南`,`那曲`,`阿里地`]},{name:`新疆`,data:[`乌鲁木齐`,`克拉玛依`,`吐鲁番`,`哈密`,`昌吉回族自治州`,`博尔塔拉蒙古自治州`,`巴音郭楞蒙古自治州`,`阿克苏地`,`克孜勒苏柯尔克孜自治州`,`喀什地`,`和田地`,`伊犁哈萨克自治州`,`塔城地`,`阿勒泰地`,`石河子`,`阿拉尔`,`图木舒克`,`五家渠`,`北屯`,`铁门关`,`双河`,`可克达拉`,`昆玉`,`胡杨河`]}],Y:[{name:`云南`,id:`Y`,data:[`昆明`,`曲靖`,`玉溪`,`保山`,`昭通`,`丽江`,`普洱`,`临沧`,`楚雄彝族自治州`,`红河哈尼族彝族自治州`,`文山壮族苗族自治州`,`西双版纳傣族自治州`,`大理白族自治州`,`德宏傣族景颇族自治州`,`怒江傈僳族自治州`,`迪庆藏族自治州`]}],Z:[{name:`浙江`,id:`Z`,data:[`杭州`,`宁波`,`温州`,`嘉兴`,`湖州`,`绍兴`,`金华`,`衢州`,`舟山`,`台州`,`丽水`]}],直辖市:[{name:`直辖市`,id:`直辖市`,data:[`北京`,`天津`,`上海`,`重庆`]}],港澳:[{name:`港澳`,id:`港澳`,data:[`香港`,`澳门`]}]};const T={class:`city-selector-trigger`},E={class:`city-selector-trigger__text`},D={class:`city-selector-content`},O={class:`city-selector-header`},k={key:0,class:`city-selector-letters`},A=[`onClick`],j={key:0,class:`city-list`},M=[`id`],N={class:`city-group__letter`},P={class:`city-group__cities`},F=[`onClick`],I={key:1,class:`province-list`},L=[`id`],R={class:`province-group__name`},z={class:`province-group__cities`},B=[`onClick`];var V=e(m({name:`C_City`,__name:`index`,props:{modelValue:{},placeholder:{default:`请选择城市`},showLetters:{type:Boolean,default:!0}},emits:[`update:modelValue`,`change`],setup(e,{emit:m}){let V=v(null);g(async()=>{let e=await import(`./city.js`);V.value=e.default??e});let H=m,U=v(!1),W=v(`city`),G=v(``),K=s(()=>{let e=[];return Object.values(w).forEach(t=>{e.push(...t)}),e}),q=s(()=>{if(V.value?.cities)return V.value.cities;let e={},t=1,n=new Set;K.value.forEach(e=>{e.data.forEach(e=>{n.add(e)})}),Array.from(n).forEach(n=>{let r=n[0].toUpperCase();e[r]||(e[r]=[]),e[r].push({id:t++,name:n,spell:``})});let r={};return Object.keys(e).sort().forEach(t=>{r[t]=e[t].sort((e,t)=>e.name.localeCompare(t.name,`zh-CN`))}),r}),J=s(()=>{if(W.value===`city`)return Object.keys(q.value).sort();{let e=new Set;Object.keys(w).forEach(t=>{t!==`直辖市`&&t!==`港澳`&&e.add(t)});let t=Array.from(e).sort();return t.push(`直辖市`,`港澳`),t}}),Y=s(()=>{if(W.value===`city`){let e=[];return Object.values(q.value).forEach(t=>{t.forEach(t=>{e.push({label:t.name,value:t.name})})}),e}else return K.value.flatMap(e=>e.data.map(t=>({label:`${t} (${e.name})`,value:t})))}),X=e=>{H(`update:modelValue`,e),H(`change`,e),U.value=!1},Z=e=>{e&&(X(e),G.value=``)},Q=e=>{let t=document.getElementById(`letter-${e}`);t&&t.scrollIntoView({behavior:`smooth`,block:`start`})};return(e,s)=>(_(),c(S(t),{show:U.value,"onUpdate:show":s[2]||=e=>U.value=e,placement:`bottom-start`,width:430,trigger:`click`,"show-arrow":!1},{trigger:C(()=>[b(e.$slots,`trigger`,{value:e.modelValue,visible:U.value},()=>[d(`div`,T,[d(`span`,E,x(e.modelValue||e.placeholder),1)])],!0)]),default:C(()=>[d(`div`,D,[d(`div`,O,[p(S(r),{value:W.value,"onUpdate:value":s[0]||=e=>W.value=e,size:`small`},{default:C(()=>[p(S(n),{value:`city`},{default:C(()=>s[3]||=[f(`按城市`,-1)]),_:1,__:[3]}),p(S(n),{value:`province`},{default:C(()=>s[4]||=[f(`按省份`,-1)]),_:1,__:[4]})]),_:1},8,[`value`]),p(S(a),{value:G.value,"onUpdate:value":[s[1]||=e=>G.value=e,Z],class:`city-selector-search`,options:Y.value,filterable:``,clearable:``,placeholder:`搜索城市`},null,8,[`value`,`options`])]),e.showLetters?(_(),u(`div`,k,[(_(!0),u(o,null,y(J.value,e=>(_(),u(`span`,{key:e,class:`city-selector-letter`,onClick:t=>Q(e)},x(e),9,A))),128))])):l(`v-if`,!0),p(S(i),{class:`city-selector-body`},{default:C(()=>[W.value===`city`?(_(),u(`div`,j,[(_(!0),u(o,null,y(q.value,(t,n)=>(_(),u(`div`,{key:n,id:`letter-${n}`,class:`city-group`},[d(`div`,N,x(n)+`:`,1),d(`div`,P,[(_(!0),u(o,null,y(t,(t,r)=>(_(),u(`span`,{key:`${n}-${r}`,class:h([`city-item`,{"is-active":e.modelValue===t.name}]),onClick:e=>X(t.name)},x(t.name),11,F))),128))])],8,M))),128))])):(_(),u(`div`,I,[(_(!0),u(o,null,y(K.value,t=>(_(),u(`div`,{key:t.id,id:`letter-${t.id}`,class:`province-group`},[d(`div`,R,x(t.name)+`:`,1),d(`div`,z,[(_(!0),u(o,null,y(t.data,(n,r)=>(_(),u(`span`,{key:`${t.id}-${r}`,class:h([`city-item`,{"is-active":e.modelValue===n}]),onClick:e=>X(n)},x(n),11,B))),128))])],8,L))),128))]))]),_:1})])]),_:3},8,[`show`]))}}),[[`__scopeId`,`data-v-06a335f4`]]);export{V as t};
+import{t as e}from"./export-helper.js";import{Fragment as t,computed as n,createBlock as r,createCommentVNode as i,createElementBlock as a,createElementVNode as o,createTextVNode as s,createVNode as c,defineComponent as l,normalizeClass as u,onMounted as d,openBlock as f,ref as p,renderList as m,renderSlot as h,toDisplayString as g,unref as _,withCtx as v}from"vue";import{NPopover as y,NRadioButton as b,NRadioGroup as x,NScrollbar as S,NSelect as C}from"naive-ui";var w={A:[{name:`安徽`,id:`A`,data:[`合肥`,`芜湖`,`蚌埠`,`淮南`,`马鞍山`,`淮北`,`铜陵`,`安庆`,`黄山`,`滁州`,`阜阳`,`宿州`,`六安`,`亳州`,`池州`,`宣城`]}],C:[{name:`重庆`,id:`C`,data:`万州.涪陵.渝中.大渡口.江北.沙坪坝.九龙坡.南岸.北碚.綦江.大足.渝北.巴南.黔江.长寿.江津.合川.永川.南川.璧山.铜梁.潼南.荣昌.开州.梁平.武隆.城口县.丰都县.垫江县.忠县.云阳县.奉节县.巫山县.巫溪县.石柱土家族自治县.秀山土家族苗族自治县.酉阳土家族苗族自治县.彭水苗族土家族自治县`.split(`.`)}],F:[{name:`福建`,id:`F`,data:[`福州`,`厦门`,`莆田`,`三明`,`泉州`,`漳州`,`南平`,`龙岩`,`宁德`]}],G:[{name:`广东`,id:`G`,data:[`广州`,`韶关`,`深圳`,`珠海`,`汕头`,`佛山`,`江门`,`湛江`,`茂名`,`肇庆`,`惠州`,`梅州`,`汕尾`,`河源`,`阳江`,`清远`,`东莞`,`中山`,`潮州`,`揭阳`,`云浮`]},{name:`广西`,data:[`南宁`,`柳州`,`桂林`,`梧州`,`北海`,`防城港`,`钦州`,`贵港`,`玉林`,`百色`,`贺州`,`河池`,`来宾`,`崇左`]},{name:`贵州`,data:[`贵阳`,`六盘水`,`遵义`,`安顺`,`毕节`,`铜仁`,`黔西南布依族苗族自治州`,`黔东南苗族侗族自治州`,`黔南布依族苗族自治州`]},{name:`甘肃`,data:[`兰州`,`嘉峪关`,`金昌`,`白银`,`天水`,`武威`,`张掖`,`平凉`,`酒泉`,`庆阳`,`定西`,`陇南`,`临夏回族自治州`,`甘南藏族自治州`]}],H:[{name:`河北`,id:`H`,data:[`石家庄`,`唐山`,`秦皇岛`,`邯郸`,`邢台`,`保定`,`张家口`,`承德`,`沧州`,`廊坊`,`衡水`]},{name:`黑龙江`,data:[`哈尔滨`,`齐齐哈尔`,`鸡西`,`鹤岗`,`双鸭山`,`大庆`,`伊春`,`佳木斯`,`七台河`,`牡丹江`,`黑河`,`绥化`,`大兴安岭地`]},{name:`河南`,data:[`郑州`,`开封`,`洛阳`,`平顶山`,`安阳`,`鹤壁`,`新乡`,`焦作`,`濮阳`,`许昌`,`漯河`,`三门峡`,`南阳`,`商丘`,`信阳`,`周口`,`驻马店`,`济源`]},{name:`湖北`,data:[`武汉`,`黄石`,`十堰`,`宜昌`,`襄阳`,`鄂州`,`荆门`,`孝感`,`荆州`,`黄冈`,`咸宁`,`随州`,`恩施土家族苗族自治州`,`仙桃`,`潜江`,`天门`,`神农架林`]},{name:`湖南`,data:[`长沙`,`株洲`,`湘潭`,`衡阳`,`邵阳`,`岳阳`,`常德`,`张家界`,`益阳`,`郴州`,`永州`,`怀化`,`娄底`,`湘西土家族苗族自治州`]},{name:`海南`,data:[`海口`,`三亚`,`三沙`,`儋州`,`五指山`,`琼海`,`文昌`,`万宁`,`东方`,`定安县`,`屯昌县`,`澄迈县`,`临高县`,`白沙黎族自治县`,`昌江黎族自治县`,`乐东黎族自治县`,`陵水黎族自治县`,`保亭黎族苗族自治县`,`琼中黎族苗族自治县`]}],J:[{name:`吉林`,id:`J`,data:[`长春`,`吉林`,`四平`,`辽源`,`通化`,`白山`,`松原`,`白城`,`延边朝鲜族自治州`]},{name:`江苏`,data:[`南京`,`无锡`,`徐州`,`常州`,`苏州`,`南通`,`连云港`,`淮安`,`盐城`,`扬州`,`镇江`,`泰州`,`宿迁`]},{name:`江西`,data:[`南昌`,`景德镇`,`萍乡`,`九江`,`新余`,`鹰潭`,`赣州`,`吉安`,`宜春`,`抚州`,`上饶`]}],L:[{name:`辽宁`,id:`L`,data:[`沈阳`,`大连`,`鞍山`,`抚顺`,`本溪`,`丹东`,`锦州`,`营口`,`阜新`,`辽阳`,`盘锦`,`铁岭`,`朝阳`,`葫芦岛`]}],N:[{name:`内蒙古`,id:`N`,data:[`呼和浩特`,`包头`,`乌海`,`赤峰`,`通辽`,`鄂尔多斯`,`呼伦贝尔`,`巴彦淖尔`,`乌兰察布`,`兴安盟`,`锡林郭勒盟`,`阿拉善盟`]},{name:`宁夏`,data:[`银川`,`石嘴山`,`吴忠`,`固原`,`中卫`]}],Q:[{name:`青海`,id:`Q`,data:[`西宁`,`海东`,`海北藏族自治州`,`黄南藏族自治州`,`海南藏族自治州`,`果洛藏族自治州`,`玉树藏族自治州`,`海西蒙古族藏族自治州`]}],S:[{name:`山西`,id:`S`,data:[`太原`,`大同`,`阳泉`,`长治`,`晋城`,`朔州`,`晋中`,`运城`,`忻州`,`临汾`,`吕梁`]},{name:`上海`,data:[`黄浦`,`徐汇`,`长宁`,`静安`,`普陀`,`虹口`,`杨浦`,`闵行`,`宝山`,`嘉定`,`浦东新`,`金山`,`松江`,`青浦`,`奉贤`,`崇明`]},{name:`山东`,data:[`济南`,`青岛`,`淄博`,`枣庄`,`东营`,`烟台`,`潍坊`,`济宁`,`泰安`,`威海`,`日照`,`临沂`,`德州`,`聊城`,`滨州`,`菏泽`]},{name:`四川`,data:[`成都`,`自贡`,`攀枝花`,`泸州`,`德阳`,`绵阳`,`广元`,`遂宁`,`内江`,`乐山`,`南充`,`眉山`,`宜宾`,`广安`,`达州`,`雅安`,`巴中`,`资阳`,`阿坝藏族羌族自治州`,`甘孜藏族自治州`,`凉山彝族自治州`]},{name:`陕西`,data:[`西安`,`铜川`,`宝鸡`,`咸阳`,`渭南`,`延安`,`汉中`,`榆林`,`安康`,`商洛`]}],T:[{name:`天津`,id:`T`,data:[`和平`,`河东`,`河西`,`南开`,`河北`,`红桥`,`东丽`,`西青`,`津南`,`北辰`,`武清`,`宝坻`,`滨海新`,`宁河`,`静海`,`蓟州`]}],X:[{name:`西藏`,id:`X`,data:[`拉萨`,`日喀则`,`昌都`,`林芝`,`山南`,`那曲`,`阿里地`]},{name:`新疆`,data:[`乌鲁木齐`,`克拉玛依`,`吐鲁番`,`哈密`,`昌吉回族自治州`,`博尔塔拉蒙古自治州`,`巴音郭楞蒙古自治州`,`阿克苏地`,`克孜勒苏柯尔克孜自治州`,`喀什地`,`和田地`,`伊犁哈萨克自治州`,`塔城地`,`阿勒泰地`,`石河子`,`阿拉尔`,`图木舒克`,`五家渠`,`北屯`,`铁门关`,`双河`,`可克达拉`,`昆玉`,`胡杨河`]}],Y:[{name:`云南`,id:`Y`,data:[`昆明`,`曲靖`,`玉溪`,`保山`,`昭通`,`丽江`,`普洱`,`临沧`,`楚雄彝族自治州`,`红河哈尼族彝族自治州`,`文山壮族苗族自治州`,`西双版纳傣族自治州`,`大理白族自治州`,`德宏傣族景颇族自治州`,`怒江傈僳族自治州`,`迪庆藏族自治州`]}],Z:[{name:`浙江`,id:`Z`,data:[`杭州`,`宁波`,`温州`,`嘉兴`,`湖州`,`绍兴`,`金华`,`衢州`,`舟山`,`台州`,`丽水`]}],直辖市:[{name:`直辖市`,id:`直辖市`,data:[`北京`,`天津`,`上海`,`重庆`]}],港澳:[{name:`港澳`,id:`港澳`,data:[`香港`,`澳门`]}]};const T={class:`city-selector-trigger`},E={class:`city-selector-trigger__text`},D={class:`city-selector-content`},O={class:`city-selector-header`},k={key:0,class:`city-selector-letters`},A=[`onClick`],j={key:0,class:`city-list`},M=[`id`],N={class:`city-group__letter`},P={class:`city-group__cities`},F=[`onClick`],I={key:1,class:`province-list`},L=[`id`],R={class:`province-group__name`},z={class:`province-group__cities`},B=[`onClick`];var V=e(l({name:`C_City`,__name:`index`,props:{modelValue:{},placeholder:{default:`请选择城市`},showLetters:{type:Boolean,default:!0}},emits:[`update:modelValue`,`change`],setup(e,{emit:l}){let V=p(null);d(async()=>{let e=await import(`./city.js`);V.value=e.default??e});let H=l,U=p(!1),W=p(`city`),G=p(``),K=n(()=>{let e=[];return Object.values(w).forEach(t=>{e.push(...t)}),e}),q=n(()=>{if(V.value?.cities)return V.value.cities;let e={},t=1,n=new Set;K.value.forEach(e=>{e.data.forEach(e=>{n.add(e)})}),Array.from(n).forEach(n=>{let r=n[0].toUpperCase();e[r]||(e[r]=[]),e[r].push({id:t++,name:n,spell:``})});let r={};return Object.keys(e).sort().forEach(t=>{r[t]=e[t].sort((e,t)=>e.name.localeCompare(t.name,`zh-CN`))}),r}),J=n(()=>{if(W.value===`city`)return Object.keys(q.value).sort();{let e=new Set;Object.keys(w).forEach(t=>{t!==`直辖市`&&t!==`港澳`&&e.add(t)});let t=Array.from(e).sort();return t.push(`直辖市`,`港澳`),t}}),Y=n(()=>{if(W.value===`city`){let e=[];return Object.values(q.value).forEach(t=>{t.forEach(t=>{e.push({label:t.name,value:t.name})})}),e}else return K.value.flatMap(e=>e.data.map(t=>({label:`${t} (${e.name})`,value:t})))}),X=e=>{H(`update:modelValue`,e),H(`change`,e),U.value=!1},Z=e=>{e&&(X(e),G.value=``)},Q=e=>{let t=document.getElementById(`letter-${e}`);t&&t.scrollIntoView({behavior:`smooth`,block:`start`})};return(e,n)=>(f(),r(_(y),{show:U.value,"onUpdate:show":n[2]||=e=>U.value=e,placement:`bottom-start`,width:430,trigger:`click`,"show-arrow":!1},{trigger:v(()=>[h(e.$slots,`trigger`,{value:e.modelValue,visible:U.value},()=>[o(`div`,T,[o(`span`,E,g(e.modelValue||e.placeholder),1)])],!0)]),default:v(()=>[o(`div`,D,[o(`div`,O,[c(_(x),{value:W.value,"onUpdate:value":n[0]||=e=>W.value=e,size:`small`},{default:v(()=>[c(_(b),{value:`city`},{default:v(()=>n[3]||=[s(`按城市`,-1)]),_:1,__:[3]}),c(_(b),{value:`province`},{default:v(()=>n[4]||=[s(`按省份`,-1)]),_:1,__:[4]})]),_:1},8,[`value`]),c(_(C),{value:G.value,"onUpdate:value":[n[1]||=e=>G.value=e,Z],class:`city-selector-search`,options:Y.value,filterable:``,clearable:``,placeholder:`搜索城市`},null,8,[`value`,`options`])]),e.showLetters?(f(),a(`div`,k,[(f(!0),a(t,null,m(J.value,e=>(f(),a(`span`,{key:e,class:`city-selector-letter`,onClick:t=>Q(e)},g(e),9,A))),128))])):i(`v-if`,!0),c(_(S),{class:`city-selector-body`},{default:v(()=>[W.value===`city`?(f(),a(`div`,j,[(f(!0),a(t,null,m(q.value,(n,r)=>(f(),a(`div`,{key:r,id:`letter-${r}`,class:`city-group`},[o(`div`,N,g(r)+`:`,1),o(`div`,P,[(f(!0),a(t,null,m(n,(t,n)=>(f(),a(`span`,{key:`${r}-${n}`,class:u([`city-item`,{"is-active":e.modelValue===t.name}]),onClick:e=>X(t.name)},g(t.name),11,F))),128))])],8,M))),128))])):(f(),a(`div`,I,[(f(!0),a(t,null,m(K.value,n=>(f(),a(`div`,{key:n.id,id:`letter-${n.id}`,class:`province-group`},[o(`div`,R,g(n.name)+`:`,1),o(`div`,z,[(f(!0),a(t,null,m(n.data,(t,r)=>(f(),a(`span`,{key:`${n.id}-${r}`,class:u([`city-item`,{"is-active":e.modelValue===t}]),onClick:e=>X(t)},g(t),11,B))),128))])],8,L))),128))]))]),_:1})])]),_:3},8,[`show`]))}}),[[`__scopeId`,`data-v-00b4ba0b`]]);export{V as t};
 //# sourceMappingURL=C_City2.js.map

package/dist/C_City2.js.map

@@ -1 +1 @@
-{"version":3,"file":"C_City2.js","names":["modelValue","placeholder","showLetters"],"sources":["../src/components/C_City/province.json","../src/components/C_City/index.vue","../src/components/C_City/index.vue","../src/components/C_City/index.vue"],"sourcesContent":["","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-05-30\r\n * @Description: 城市选择器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <NPopover\r\n    v-model:show=\"visible\"\r\n    placement=\"bottom-start\"\r\n    :width=\"430\"\r\n    trigger=\"click\"\r\n    :show-arrow=\"false\"\r\n  >\r\n    <template #trigger>\r\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\r\n        <div class=\"city-selector-trigger\">\r\n          <span class=\"city-selector-trigger__text\">{{\r\n            modelValue || placeholder\r\n          }}</span>\r\n        </div>\r\n      </slot>\r\n    </template>\r\n\r\n    <div class=\"city-selector-content\">\r\n      <div class=\"city-selector-header\">\r\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\r\n          <NRadioButton value=\"city\">按城市</NRadioButton>\r\n          <NRadioButton value=\"province\">按省份</NRadioButton>\r\n        </NRadioGroup>\r\n        <NSelect\r\n          v-model:value=\"searchValue\"\r\n          class=\"city-selector-search\"\r\n          :options=\"searchOptions\"\r\n          filterable\r\n          clearable\r\n          placeholder=\"搜索城市\"\r\n          @update:value=\"handleSearchSelect\"\r\n        />\r\n      </div>\r\n\r\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\r\n        <span\r\n          v-for=\"letter in letters\"\r\n          :key=\"letter\"\r\n          class=\"city-selector-letter\"\r\n          @click=\"scrollToLetter(letter)\"\r\n        >\r\n          {{ letter }}\r\n        </span>\r\n      </div>\r\n\r\n      <NScrollbar class=\"city-selector-body\">\r\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\r\n          <div\r\n            v-for=\"(cities, letter) in cityDataByLetter\"\r\n            :key=\"letter\"\r\n            :id=\"`letter-${letter}`\"\r\n            class=\"city-group\"\r\n          >\r\n            <div class=\"city-group__letter\">{{ letter }}:</div>\r\n            <div class=\"city-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in cities\"\r\n                :key=\"`${letter}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city.name }\"\r\n                @click=\"handleCitySelect(city.name)\"\r\n              >\r\n                {{ city.name }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div v-else class=\"province-list\">\r\n          <div\r\n            v-for=\"province in allProvinces\"\r\n            :key=\"province.id\"\r\n            :id=\"`letter-${province.id}`\"\r\n            class=\"province-group\"\r\n          >\r\n            <div class=\"province-group__name\">{{ province.name }}:</div>\r\n            <div class=\"province-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in province.data\"\r\n                :key=\"`${province.id}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city }\"\r\n                @click=\"handleCitySelect(city)\"\r\n              >\r\n                {{ city }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </NScrollbar>\r\n    </div>\r\n  </NPopover>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onMounted } from \"vue\";\r\nimport {\r\n  NPopover,\r\n  NRadioGroup,\r\n  NRadioButton,\r\n  NSelect,\r\n  NScrollbar,\r\n} from \"naive-ui\";\r\nimport type { SelectOption } from \"naive-ui\";\r\nimport provinceData from \"./province.json\";\r\n\r\ndefineOptions({ name: \"C_City\" });\r\n\r\ninterface CityItem {\r\n  id: number;\r\n  spell: string;\r\n  name: string;\r\n}\r\n\r\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\r\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\r\n\r\nonMounted(async () => {\r\n  const mod = await import(\"./city.json\");\r\n  cityData.value = mod.default ?? mod;\r\n});\r\n\r\ninterface ProvinceItem {\r\n  id?: string;\r\n  name: string;\r\n  data: string[];\r\n}\r\n\r\ninterface Props {\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  showLetters?: boolean;\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"change\", value: string): void;\r\n}\r\n\r\nwithDefaults(defineProps<Props>(), {\r\n  placeholder: \"请选择城市\",\r\n  showLetters: true,\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst visible = ref(false);\r\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\r\nconst searchValue = ref(\"\");\r\n\r\nconst allProvinces = computed(() => {\r\n  const provinces: ProvinceItem[] = [];\r\n  Object.values(provinceData).forEach((group) => {\r\n    provinces.push(...(group as ProvinceItem[]));\r\n  });\r\n  return provinces;\r\n});\r\n\r\nconst cityDataByLetter = computed(() => {\r\n  if (cityData.value?.cities) {\r\n    return cityData.value.cities;\r\n  }\r\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\r\n  const cities: Record<string, CityItem[]> = {};\r\n  let cityId = 1;\r\n  const citySet = new Set<string>();\r\n  allProvinces.value.forEach((province) => {\r\n    province.data.forEach((cityName) => {\r\n      citySet.add(cityName);\r\n    });\r\n  });\r\n  Array.from(citySet).forEach((cityName) => {\r\n    const letter = cityName[0].toUpperCase();\r\n    if (!cities[letter]) cities[letter] = [];\r\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\r\n  });\r\n  const sortedCities: Record<string, CityItem[]> = {};\r\n  Object.keys(cities)\r\n    .sort()\r\n    .forEach((letter) => {\r\n      sortedCities[letter] = cities[letter].sort((a, b) =>\r\n        a.name.localeCompare(b.name, \"zh-CN\"),\r\n      );\r\n    });\r\n  return sortedCities;\r\n});\r\n\r\nconst letters = computed(() => {\r\n  if (radioValue.value === \"city\") {\r\n    return Object.keys(cityDataByLetter.value).sort();\r\n  } else {\r\n    const provinceLetters = new Set<string>();\r\n    Object.keys(provinceData).forEach((key) => {\r\n      if (key !== \"直辖市\" && key !== \"港澳\") {\r\n        provinceLetters.add(key);\r\n      }\r\n    });\r\n    const result = Array.from(provinceLetters).sort();\r\n    result.push(\"直辖市\", \"港澳\");\r\n    return result;\r\n  }\r\n});\r\n\r\nconst searchOptions = computed((): SelectOption[] => {\r\n  if (radioValue.value === \"city\") {\r\n    const options: SelectOption[] = [];\r\n    Object.values(cityDataByLetter.value).forEach((cities) => {\r\n      (cities as CityItem[]).forEach((city) => {\r\n        options.push({\r\n          label: city.name,\r\n          value: city.name,\r\n        });\r\n      });\r\n    });\r\n    return options;\r\n  } else {\r\n    return allProvinces.value.flatMap((province) =>\r\n      province.data.map((city) => ({\r\n        label: `${city} (${province.name})`,\r\n        value: city,\r\n      })),\r\n    );\r\n  }\r\n});\r\n\r\nconst handleCitySelect = (cityName: string): void => {\r\n  emit(\"update:modelValue\", cityName);\r\n  emit(\"change\", cityName);\r\n  visible.value = false;\r\n};\r\n\r\nconst handleSearchSelect = (value: string): void => {\r\n  if (value) {\r\n    handleCitySelect(value);\r\n    searchValue.value = \"\";\r\n  }\r\n};\r\n\r\nconst scrollToLetter = (letter: string): void => {\r\n  const element = document.getElementById(`letter-${letter}`);\r\n  if (element) {\r\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\r\n  }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-05-30\r\n * @Description: 城市选择器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <NPopover\r\n    v-model:show=\"visible\"\r\n    placement=\"bottom-start\"\r\n    :width=\"430\"\r\n    trigger=\"click\"\r\n    :show-arrow=\"false\"\r\n  >\r\n    <template #trigger>\r\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\r\n        <div class=\"city-selector-trigger\">\r\n          <span class=\"city-selector-trigger__text\">{{\r\n            modelValue || placeholder\r\n          }}</span>\r\n        </div>\r\n      </slot>\r\n    </template>\r\n\r\n    <div class=\"city-selector-content\">\r\n      <div class=\"city-selector-header\">\r\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\r\n          <NRadioButton value=\"city\">按城市</NRadioButton>\r\n          <NRadioButton value=\"province\">按省份</NRadioButton>\r\n        </NRadioGroup>\r\n        <NSelect\r\n          v-model:value=\"searchValue\"\r\n          class=\"city-selector-search\"\r\n          :options=\"searchOptions\"\r\n          filterable\r\n          clearable\r\n          placeholder=\"搜索城市\"\r\n          @update:value=\"handleSearchSelect\"\r\n        />\r\n      </div>\r\n\r\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\r\n        <span\r\n          v-for=\"letter in letters\"\r\n          :key=\"letter\"\r\n          class=\"city-selector-letter\"\r\n          @click=\"scrollToLetter(letter)\"\r\n        >\r\n          {{ letter }}\r\n        </span>\r\n      </div>\r\n\r\n      <NScrollbar class=\"city-selector-body\">\r\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\r\n          <div\r\n            v-for=\"(cities, letter) in cityDataByLetter\"\r\n            :key=\"letter\"\r\n            :id=\"`letter-${letter}`\"\r\n            class=\"city-group\"\r\n          >\r\n            <div class=\"city-group__letter\">{{ letter }}:</div>\r\n            <div class=\"city-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in cities\"\r\n                :key=\"`${letter}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city.name }\"\r\n                @click=\"handleCitySelect(city.name)\"\r\n              >\r\n                {{ city.name }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div v-else class=\"province-list\">\r\n          <div\r\n            v-for=\"province in allProvinces\"\r\n            :key=\"province.id\"\r\n            :id=\"`letter-${province.id}`\"\r\n            class=\"province-group\"\r\n          >\r\n            <div class=\"province-group__name\">{{ province.name }}:</div>\r\n            <div class=\"province-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in province.data\"\r\n                :key=\"`${province.id}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city }\"\r\n                @click=\"handleCitySelect(city)\"\r\n              >\r\n                {{ city }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </NScrollbar>\r\n    </div>\r\n  </NPopover>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onMounted } from \"vue\";\r\nimport {\r\n  NPopover,\r\n  NRadioGroup,\r\n  NRadioButton,\r\n  NSelect,\r\n  NScrollbar,\r\n} from \"naive-ui\";\r\nimport type { SelectOption } from \"naive-ui\";\r\nimport provinceData from \"./province.json\";\r\n\r\ndefineOptions({ name: \"C_City\" });\r\n\r\ninterface CityItem {\r\n  id: number;\r\n  spell: string;\r\n  name: string;\r\n}\r\n\r\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\r\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\r\n\r\nonMounted(async () => {\r\n  const mod = await import(\"./city.json\");\r\n  cityData.value = mod.default ?? mod;\r\n});\r\n\r\ninterface ProvinceItem {\r\n  id?: string;\r\n  name: string;\r\n  data: string[];\r\n}\r\n\r\ninterface Props {\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  showLetters?: boolean;\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"change\", value: string): void;\r\n}\r\n\r\nwithDefaults(defineProps<Props>(), {\r\n  placeholder: \"请选择城市\",\r\n  showLetters: true,\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst visible = ref(false);\r\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\r\nconst searchValue = ref(\"\");\r\n\r\nconst allProvinces = computed(() => {\r\n  const provinces: ProvinceItem[] = [];\r\n  Object.values(provinceData).forEach((group) => {\r\n    provinces.push(...(group as ProvinceItem[]));\r\n  });\r\n  return provinces;\r\n});\r\n\r\nconst cityDataByLetter = computed(() => {\r\n  if (cityData.value?.cities) {\r\n    return cityData.value.cities;\r\n  }\r\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\r\n  const cities: Record<string, CityItem[]> = {};\r\n  let cityId = 1;\r\n  const citySet = new Set<string>();\r\n  allProvinces.value.forEach((province) => {\r\n    province.data.forEach((cityName) => {\r\n      citySet.add(cityName);\r\n    });\r\n  });\r\n  Array.from(citySet).forEach((cityName) => {\r\n    const letter = cityName[0].toUpperCase();\r\n    if (!cities[letter]) cities[letter] = [];\r\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\r\n  });\r\n  const sortedCities: Record<string, CityItem[]> = {};\r\n  Object.keys(cities)\r\n    .sort()\r\n    .forEach((letter) => {\r\n      sortedCities[letter] = cities[letter].sort((a, b) =>\r\n        a.name.localeCompare(b.name, \"zh-CN\"),\r\n      );\r\n    });\r\n  return sortedCities;\r\n});\r\n\r\nconst letters = computed(() => {\r\n  if (radioValue.value === \"city\") {\r\n    return Object.keys(cityDataByLetter.value).sort();\r\n  } else {\r\n    const provinceLetters = new Set<string>();\r\n    Object.keys(provinceData).forEach((key) => {\r\n      if (key !== \"直辖市\" && key !== \"港澳\") {\r\n        provinceLetters.add(key);\r\n      }\r\n    });\r\n    const result = Array.from(provinceLetters).sort();\r\n    result.push(\"直辖市\", \"港澳\");\r\n    return result;\r\n  }\r\n});\r\n\r\nconst searchOptions = computed((): SelectOption[] => {\r\n  if (radioValue.value === \"city\") {\r\n    const options: SelectOption[] = [];\r\n    Object.values(cityDataByLetter.value).forEach((cities) => {\r\n      (cities as CityItem[]).forEach((city) => {\r\n        options.push({\r\n          label: city.name,\r\n          value: city.name,\r\n        });\r\n      });\r\n    });\r\n    return options;\r\n  } else {\r\n    return allProvinces.value.flatMap((province) =>\r\n      province.data.map((city) => ({\r\n        label: `${city} (${province.name})`,\r\n        value: city,\r\n      })),\r\n    );\r\n  }\r\n});\r\n\r\nconst handleCitySelect = (cityName: string): void => {\r\n  emit(\"update:modelValue\", cityName);\r\n  emit(\"change\", cityName);\r\n  visible.value = false;\r\n};\r\n\r\nconst handleSearchSelect = (value: string): void => {\r\n  if (value) {\r\n    handleCitySelect(value);\r\n    searchValue.value = \"\";\r\n  }\r\n};\r\n\r\nconst scrollToLetter = (letter: string): void => {\r\n  const element = document.getElementById(`letter-${letter}`);\r\n  if (element) {\r\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\r\n  }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-05-30\r\n * @Description: 城市选择器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <NPopover\r\n    v-model:show=\"visible\"\r\n    placement=\"bottom-start\"\r\n    :width=\"430\"\r\n    trigger=\"click\"\r\n    :show-arrow=\"false\"\r\n  >\r\n    <template #trigger>\r\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\r\n        <div class=\"city-selector-trigger\">\r\n          <span class=\"city-selector-trigger__text\">{{\r\n            modelValue || placeholder\r\n          }}</span>\r\n        </div>\r\n      </slot>\r\n    </template>\r\n\r\n    <div class=\"city-selector-content\">\r\n      <div class=\"city-selector-header\">\r\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\r\n          <NRadioButton value=\"city\">按城市</NRadioButton>\r\n          <NRadioButton value=\"province\">按省份</NRadioButton>\r\n        </NRadioGroup>\r\n        <NSelect\r\n          v-model:value=\"searchValue\"\r\n          class=\"city-selector-search\"\r\n          :options=\"searchOptions\"\r\n          filterable\r\n          clearable\r\n          placeholder=\"搜索城市\"\r\n          @update:value=\"handleSearchSelect\"\r\n        />\r\n      </div>\r\n\r\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\r\n        <span\r\n          v-for=\"letter in letters\"\r\n          :key=\"letter\"\r\n          class=\"city-selector-letter\"\r\n          @click=\"scrollToLetter(letter)\"\r\n        >\r\n          {{ letter }}\r\n        </span>\r\n      </div>\r\n\r\n      <NScrollbar class=\"city-selector-body\">\r\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\r\n          <div\r\n            v-for=\"(cities, letter) in cityDataByLetter\"\r\n            :key=\"letter\"\r\n            :id=\"`letter-${letter}`\"\r\n            class=\"city-group\"\r\n          >\r\n            <div class=\"city-group__letter\">{{ letter }}:</div>\r\n            <div class=\"city-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in cities\"\r\n                :key=\"`${letter}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city.name }\"\r\n                @click=\"handleCitySelect(city.name)\"\r\n              >\r\n                {{ city.name }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div v-else class=\"province-list\">\r\n          <div\r\n            v-for=\"province in allProvinces\"\r\n            :key=\"province.id\"\r\n            :id=\"`letter-${province.id}`\"\r\n            class=\"province-group\"\r\n          >\r\n            <div class=\"province-group__name\">{{ province.name }}:</div>\r\n            <div class=\"province-group__cities\">\r\n              <span\r\n                v-for=\"(city, index) in province.data\"\r\n                :key=\"`${province.id}-${index}`\"\r\n                class=\"city-item\"\r\n                :class=\"{ 'is-active': modelValue === city }\"\r\n                @click=\"handleCitySelect(city)\"\r\n              >\r\n                {{ city }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </NScrollbar>\r\n    </div>\r\n  </NPopover>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onMounted } from \"vue\";\r\nimport {\r\n  NPopover,\r\n  NRadioGroup,\r\n  NRadioButton,\r\n  NSelect,\r\n  NScrollbar,\r\n} from \"naive-ui\";\r\nimport type { SelectOption } from \"naive-ui\";\r\nimport provinceData from \"./province.json\";\r\n\r\ndefineOptions({ name: \"C_City\" });\r\n\r\ninterface CityItem {\r\n  id: number;\r\n  spell: string;\r\n  name: string;\r\n}\r\n\r\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\r\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\r\n\r\nonMounted(async () => {\r\n  const mod = await import(\"./city.json\");\r\n  cityData.value = mod.default ?? mod;\r\n});\r\n\r\ninterface ProvinceItem {\r\n  id?: string;\r\n  name: string;\r\n  data: string[];\r\n}\r\n\r\ninterface Props {\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  showLetters?: boolean;\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"change\", value: string): void;\r\n}\r\n\r\nwithDefaults(defineProps<Props>(), {\r\n  placeholder: \"请选择城市\",\r\n  showLetters: true,\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst visible = ref(false);\r\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\r\nconst searchValue = ref(\"\");\r\n\r\nconst allProvinces = computed(() => {\r\n  const provinces: ProvinceItem[] = [];\r\n  Object.values(provinceData).forEach((group) => {\r\n    provinces.push(...(group as ProvinceItem[]));\r\n  });\r\n  return provinces;\r\n});\r\n\r\nconst cityDataByLetter = computed(() => {\r\n  if (cityData.value?.cities) {\r\n    return cityData.value.cities;\r\n  }\r\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\r\n  const cities: Record<string, CityItem[]> = {};\r\n  let cityId = 1;\r\n  const citySet = new Set<string>();\r\n  allProvinces.value.forEach((province) => {\r\n    province.data.forEach((cityName) => {\r\n      citySet.add(cityName);\r\n    });\r\n  });\r\n  Array.from(citySet).forEach((cityName) => {\r\n    const letter = cityName[0].toUpperCase();\r\n    if (!cities[letter]) cities[letter] = [];\r\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\r\n  });\r\n  const sortedCities: Record<string, CityItem[]> = {};\r\n  Object.keys(cities)\r\n    .sort()\r\n    .forEach((letter) => {\r\n      sortedCities[letter] = cities[letter].sort((a, b) =>\r\n        a.name.localeCompare(b.name, \"zh-CN\"),\r\n      );\r\n    });\r\n  return sortedCities;\r\n});\r\n\r\nconst letters = computed(() => {\r\n  if (radioValue.value === \"city\") {\r\n    return Object.keys(cityDataByLetter.value).sort();\r\n  } else {\r\n    const provinceLetters = new Set<string>();\r\n    Object.keys(provinceData).forEach((key) => {\r\n      if (key !== \"直辖市\" && key !== \"港澳\") {\r\n        provinceLetters.add(key);\r\n      }\r\n    });\r\n    const result = Array.from(provinceLetters).sort();\r\n    result.push(\"直辖市\", \"港澳\");\r\n    return result;\r\n  }\r\n});\r\n\r\nconst searchOptions = computed((): SelectOption[] => {\r\n  if (radioValue.value === \"city\") {\r\n    const options: SelectOption[] = [];\r\n    Object.values(cityDataByLetter.value).forEach((cities) => {\r\n      (cities as CityItem[]).forEach((city) => {\r\n        options.push({\r\n          label: city.name,\r\n          value: city.name,\r\n        });\r\n      });\r\n    });\r\n    return options;\r\n  } else {\r\n    return allProvinces.value.flatMap((province) =>\r\n      province.data.map((city) => ({\r\n        label: `${city} (${province.name})`,\r\n        value: city,\r\n      })),\r\n    );\r\n  }\r\n});\r\n\r\nconst handleCitySelect = (cityName: string): void => {\r\n  emit(\"update:modelValue\", cityName);\r\n  emit(\"change\", cityName);\r\n  visible.value = false;\r\n};\r\n\r\nconst handleSearchSelect = (value: string): void => {\r\n  if (value) {\r\n    handleCitySelect(value);\r\n    searchValue.value = \"\";\r\n  }\r\n};\r\n\r\nconst scrollToLetter = (letter: string): void => {\r\n  const element = document.getElementById(`letter-${letter}`);\r\n  if (element) {\r\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\r\n  }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n"],"mappings":"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"}
+{"version":3,"file":"C_City2.js","names":[],"sources":["../src/components/C_City/province.json","../src/components/C_City/index.vue"],"sourcesContent":["","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-05-30\n * @Description: 城市选择器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n  <NPopover\n    v-model:show=\"visible\"\n    placement=\"bottom-start\"\n    :width=\"430\"\n    trigger=\"click\"\n    :show-arrow=\"false\"\n  >\n    <template #trigger>\n      <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\n        <div class=\"city-selector-trigger\">\n          <span class=\"city-selector-trigger__text\">{{\n            modelValue || placeholder\n          }}</span>\n        </div>\n      </slot>\n    </template>\n\n    <div class=\"city-selector-content\">\n      <div class=\"city-selector-header\">\n        <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\n          <NRadioButton value=\"city\">按城市</NRadioButton>\n          <NRadioButton value=\"province\">按省份</NRadioButton>\n        </NRadioGroup>\n        <NSelect\n          v-model:value=\"searchValue\"\n          class=\"city-selector-search\"\n          :options=\"searchOptions\"\n          filterable\n          clearable\n          placeholder=\"搜索城市\"\n          @update:value=\"handleSearchSelect\"\n        />\n      </div>\n\n      <div v-if=\"showLetters\" class=\"city-selector-letters\">\n        <span\n          v-for=\"letter in letters\"\n          :key=\"letter\"\n          class=\"city-selector-letter\"\n          @click=\"scrollToLetter(letter)\"\n        >\n          {{ letter }}\n        </span>\n      </div>\n\n      <NScrollbar class=\"city-selector-body\">\n        <div v-if=\"radioValue === 'city'\" class=\"city-list\">\n          <div\n            v-for=\"(cities, letter) in cityDataByLetter\"\n            :key=\"letter\"\n            :id=\"`letter-${letter}`\"\n            class=\"city-group\"\n          >\n            <div class=\"city-group__letter\">{{ letter }}:</div>\n            <div class=\"city-group__cities\">\n              <span\n                v-for=\"(city, index) in cities\"\n                :key=\"`${letter}-${index}`\"\n                class=\"city-item\"\n                :class=\"{ 'is-active': modelValue === city.name }\"\n                @click=\"handleCitySelect(city.name)\"\n              >\n                {{ city.name }}\n              </span>\n            </div>\n          </div>\n        </div>\n\n        <div v-else class=\"province-list\">\n          <div\n            v-for=\"province in allProvinces\"\n            :key=\"province.id\"\n            :id=\"`letter-${province.id}`\"\n            class=\"province-group\"\n          >\n            <div class=\"province-group__name\">{{ province.name }}:</div>\n            <div class=\"province-group__cities\">\n              <span\n                v-for=\"(city, index) in province.data\"\n                :key=\"`${province.id}-${index}`\"\n                class=\"city-item\"\n                :class=\"{ 'is-active': modelValue === city }\"\n                @click=\"handleCitySelect(city)\"\n              >\n                {{ city }}\n              </span>\n            </div>\n          </div>\n        </div>\n      </NScrollbar>\n    </div>\n  </NPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from \"vue\";\nimport {\n  NPopover,\n  NRadioGroup,\n  NRadioButton,\n  NSelect,\n  NScrollbar,\n} from \"naive-ui\";\nimport type { SelectOption } from \"naive-ui\";\nimport provinceData from \"./province.json\";\n\ndefineOptions({ name: \"C_City\" });\n\ninterface CityItem {\n  id: number;\n  spell: string;\n  name: string;\n}\n\n// 城市数据懒加载（83KB JSON 仅在组件挂载时加载）\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\n\nonMounted(async () => {\n  const mod = await import(\"./city.json\");\n  cityData.value = mod.default ?? mod;\n});\n\ninterface ProvinceItem {\n  id?: string;\n  name: string;\n  data: string[];\n}\n\ninterface Props {\n  modelValue?: string;\n  placeholder?: string;\n  showLetters?: boolean;\n}\n\ninterface Emits {\n  (e: \"update:modelValue\", value: string): void;\n  (e: \"change\", value: string): void;\n}\n\nwithDefaults(defineProps<Props>(), {\n  placeholder: \"请选择城市\",\n  showLetters: true,\n});\n\nconst emit = defineEmits<Emits>();\n\nconst visible = ref(false);\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\nconst searchValue = ref(\"\");\n\nconst allProvinces = computed(() => {\n  const provinces: ProvinceItem[] = [];\n  Object.values(provinceData).forEach((group) => {\n    provinces.push(...(group as ProvinceItem[]));\n  });\n  return provinces;\n});\n\nconst cityDataByLetter = computed(() => {\n  if (cityData.value?.cities) {\n    return cityData.value.cities;\n  }\n  // 数据未加载时，从省份数据生成城市索引作为 fallback\n  const cities: Record<string, CityItem[]> = {};\n  let cityId = 1;\n  const citySet = new Set<string>();\n  allProvinces.value.forEach((province) => {\n    province.data.forEach((cityName) => {\n      citySet.add(cityName);\n    });\n  });\n  Array.from(citySet).forEach((cityName) => {\n    const letter = cityName[0].toUpperCase();\n    if (!cities[letter]) cities[letter] = [];\n    cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\n  });\n  const sortedCities: Record<string, CityItem[]> = {};\n  Object.keys(cities)\n    .sort()\n    .forEach((letter) => {\n      sortedCities[letter] = cities[letter].sort((a, b) =>\n        a.name.localeCompare(b.name, \"zh-CN\"),\n      );\n    });\n  return sortedCities;\n});\n\nconst letters = computed(() => {\n  if (radioValue.value === \"city\") {\n    return Object.keys(cityDataByLetter.value).sort();\n  } else {\n    const provinceLetters = new Set<string>();\n    Object.keys(provinceData).forEach((key) => {\n      if (key !== \"直辖市\" && key !== \"港澳\") {\n        provinceLetters.add(key);\n      }\n    });\n    const result = Array.from(provinceLetters).sort();\n    result.push(\"直辖市\", \"港澳\");\n    return result;\n  }\n});\n\nconst searchOptions = computed((): SelectOption[] => {\n  if (radioValue.value === \"city\") {\n    const options: SelectOption[] = [];\n    Object.values(cityDataByLetter.value).forEach((cities) => {\n      (cities as CityItem[]).forEach((city) => {\n        options.push({\n          label: city.name,\n          value: city.name,\n        });\n      });\n    });\n    return options;\n  } else {\n    return allProvinces.value.flatMap((province) =>\n      province.data.map((city) => ({\n        label: `${city} (${province.name})`,\n        value: city,\n      })),\n    );\n  }\n});\n\nconst handleCitySelect = (cityName: string): void => {\n  emit(\"update:modelValue\", cityName);\n  emit(\"change\", cityName);\n  visible.value = false;\n};\n\nconst handleSearchSelect = (value: string): void => {\n  if (value) {\n    handleCitySelect(value);\n    searchValue.value = \"\";\n  }\n};\n\nconst scrollToLetter = (letter: string): void => {\n  const element = document.getElementById(`letter-${letter}`);\n  if (element) {\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n  }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n"],"mappings":"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"}

package/dist/C_Code-BFi5xxnM.css.map

@@ -0,0 +1 @@
+{"version":3,"file":"C_Code-BFi5xxnM.css","names":[],"sources":["../src/components/C_Code/index.vue?vue&type=style&index=0&scoped=bc1cd0d6&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.mr-2[data-v-bc1cd0d6] {\n  margin-right: 0.5rem;\n}\n.ml-2[data-v-bc1cd0d6] {\n  margin-left: 0.5rem;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA"}

package/dist/C_Code-CZ7yfnri.css.map

@@ -0,0 +1 @@
+{"version":3,"file":"C_Code-CZ7yfnri.css","names":[],"sources":["../src/components/C_Code/index.vue?vue&type=style&index=0&scoped=bc1cd0d6&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.mr-2[data-v-bc1cd0d6] {\n  margin-right: 0.5rem;\n}\n.ml-2[data-v-bc1cd0d6] {\n  margin-left: 0.5rem;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA"}

package/dist/C_Code.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./C_Icon.js`);const e=require(`./C_Code.js`);exports.C_Code=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./C_Code.js`);exports.C_Code=e.t;

package/dist/C_Code.css

@@ -1,8 +1,8 @@
-/* unplugin-vue-components disabled */.mr-2[data-v-2f676c83] {
+/* unplugin-vue-components disabled */.mr-2[data-v-bc1cd0d6] {
   margin-right: 0.5rem;
 }
-.ml-2[data-v-2f676c83] {
+.ml-2[data-v-bc1cd0d6] {
   margin-left: 0.5rem;
 }
 
-/*# sourceMappingURL=C_Code-DPZlNSxL.css.map*/
+/*# sourceMappingURL=C_Code-BFi5xxnM.css.map*/

package/dist/C_Code.js

@@ -1 +1 @@
-import"./C_Icon2.js";import{t as e}from"./C_Code2.js";export{e as C_Code};
+import{t as e}from"./C_Code2.js";export{e as C_Code};

package/dist/C_Code.js.map

@@ -1 +1 @@
-{"version":3,"file":"C_Code.js","names":["showHeader","title","language","showFullscreen","code","showLineNumbers","wordWrap","trim"],"sources":["../src/components/C_Code/index.vue","../src/components/C_Code/index.vue","../src/components/C_Code/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-19\r\n * @Description: 全局代码高亮组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-code-wrapper\">\r\n    <!-- 代码标题栏 -->\r\n    <div v-if=\"showHeader\" class=\"c-code-header\">\r\n      <div class=\"c-code-title\">\r\n        <C_Icon\r\n          v-if=\"languageIcon\"\r\n          :name=\"languageIcon\"\r\n          :size=\"16\"\r\n          class=\"mr-2\"\r\n        />\r\n        <span>{{ title || getLanguageTitle(language) }}</span>\r\n      </div>\r\n      <div class=\"c-code-actions\">\r\n        <NTooltip trigger=\"hover\">\r\n          <template #trigger>\r\n            <NButton\r\n              size=\"tiny\"\r\n              quaternary\r\n              @click=\"copyCode\"\r\n              :loading=\"copying\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\r\n                  :loading=\"copying\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </template>\r\n          复制代码\r\n        </NTooltip>\r\n\r\n        <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\r\n          <template #trigger>\r\n            <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\r\n              <template #icon>\r\n                <C_Icon\r\n                  :name=\"\r\n                    isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\r\n                  \"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </template>\r\n          {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\r\n        </NTooltip>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- 代码内容区域 -->\r\n    <div class=\"c-code-content\">\r\n      <div\r\n        class=\"code-wrapper\"\r\n        @mouseenter=\"showFloatingCopy = true\"\r\n        @mouseleave=\"showFloatingCopy = false\"\r\n      >\r\n        <NCode\r\n          :key=\"`code-${language}-${code.length}`\"\r\n          :code=\"code\"\r\n          :language=\"language\"\r\n          :hljs=\"hljs\"\r\n          :show-line-numbers=\"showLineNumbers\"\r\n          :word-wrap=\"wordWrap\"\r\n          :trim=\"trim\"\r\n          :style=\"codeStyle\"\r\n          @click=\"emit('click', $event)\"\r\n        />\r\n\r\n        <!-- 悬浮复制按钮 -->\r\n        <Transition name=\"fade\">\r\n          <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\r\n            <NTooltip trigger=\"hover\">\r\n              <template #trigger>\r\n                <NButton\r\n                  size=\"small\"\r\n                  quaternary\r\n                  @click=\"copyCode\"\r\n                  :loading=\"copying\"\r\n                  class=\"copy-floating\"\r\n                >\r\n                  <template #icon>\r\n                    <C_Icon\r\n                      :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\r\n                      :loading=\"copying\"\r\n                    />\r\n                  </template>\r\n                </NButton>\r\n              </template>\r\n              复制代码\r\n            </NTooltip>\r\n          </div>\r\n        </Transition>\r\n      </div>\r\n\r\n      <!-- 语言加载状态 -->\r\n      <div v-if=\"languageLoading\" class=\"c-code-loading\">\r\n        <NSpin size=\"small\" />\r\n        <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- 全屏模态框 -->\r\n    <NModal\r\n      v-model:show=\"isFullscreen\"\r\n      :mask-closable=\"false\"\r\n      :show-icon=\"false\"\r\n      :bordered=\"false\"\r\n      style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\r\n    >\r\n      <div class=\"fullscreen-content\">\r\n        <div class=\"fullscreen-header\">\r\n          <div class=\"fullscreen-title\">\r\n            <C_Icon\r\n              v-if=\"languageIcon\"\r\n              :name=\"languageIcon\"\r\n              :size=\"16\"\r\n              class=\"mr-2\"\r\n            />\r\n            <span>{{ title || getLanguageTitle(language) }}</span>\r\n          </div>\r\n          <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\r\n            <template #icon>\r\n              <C_Icon name=\"mdi:close\" />\r\n            </template>\r\n          </NButton>\r\n        </div>\r\n        <div class=\"fullscreen-body\">\r\n          <NCode\r\n            :key=\"`fullscreen-code-${language}-${code.length}`\"\r\n            :code=\"code\"\r\n            :language=\"language\"\r\n            :hljs=\"hljs\"\r\n            :show-line-numbers=\"showLineNumbers\"\r\n            :word-wrap=\"wordWrap\"\r\n            :trim=\"trim\"\r\n          />\r\n        </div>\r\n      </div>\r\n    </NModal>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport {\r\n  ref,\r\n  computed,\r\n  watch,\r\n  onMounted,\r\n  onUnmounted,\r\n  nextTick,\r\n  inject,\r\n} from \"vue\";\r\nimport C_Icon from \"../C_Icon/index.vue\";\r\n\r\n// 直接在组件内定义 HighlightManager 接口，避免导入错误\r\ninterface HighlightManager {\r\n  getHljs?: () => any;\r\n  loadLanguage?: (language: string) => Promise<void>;\r\n  getLoadedLanguages?: () => string[];\r\n}\r\n\r\n// 组件名称定义\r\ndefineOptions({\r\n  name: \"CCode\",\r\n});\r\n\r\ninterface Props {\r\n  code: string;\r\n  language?: string;\r\n  title?: string;\r\n  showHeader?: boolean;\r\n  showLineNumbers?: boolean;\r\n  wordWrap?: boolean;\r\n  trim?: boolean;\r\n  showFullscreen?: boolean;\r\n  maxHeight?: string | number;\r\n  autoLoadLanguage?: boolean;\r\n}\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n  code: \"\",\r\n  language: \"text\",\r\n  showHeader: true,\r\n  showLineNumbers: true,\r\n  wordWrap: false,\r\n  trim: true,\r\n  showFullscreen: false,\r\n  autoLoadLanguage: true,\r\n});\r\n\r\nconst emit = defineEmits<{\r\n  copy: [code: string];\r\n  click: [event: MouseEvent];\r\n  fullscreen: [isFullscreen: boolean];\r\n}>();\r\n\r\n// 尝试获取 highlight 实例（如果用户安装了插件）\r\nconst highlightManager = inject<HighlightManager | null>(\r\n  \"highlightManager\",\r\n  null,\r\n);\r\n\r\nconst copying = ref(false);\r\nconst isFullscreen = ref(false);\r\nconst languageLoading = ref(false);\r\nconst showFloatingCopy = ref(false);\r\n\r\n// 安全地获取 hljs 实例\r\nconst hljs = computed(() => {\r\n  try {\r\n    return highlightManager?.getHljs?.() || null;\r\n  } catch (error) {\r\n    console.warn(\"Highlight.js not available:\", error);\r\n    return null;\r\n  }\r\n});\r\n\r\n// 语言图标映射（使用标准的 MDI 图标名称）\r\nconst languageIcon = computed(() => {\r\n  const iconMap: Record<string, string> = {\r\n    javascript: \"mdi:language-javascript\",\r\n    typescript: \"mdi:language-typescript\",\r\n    python: \"mdi:language-python\",\r\n    html: \"mdi:language-html5\",\r\n    css: \"mdi:language-css3\",\r\n    vue: \"mdi:vuejs\",\r\n    react: \"mdi:react\",\r\n    json: \"mdi:code-json\",\r\n    java: \"mdi:language-java\",\r\n    cpp: \"mdi:language-cpp\",\r\n    go: \"mdi:language-go\",\r\n    rust: \"mdi:language-rust\",\r\n    php: \"mdi:language-php\",\r\n    csharp: \"mdi:language-csharp\",\r\n    sql: \"mdi:database\",\r\n    yaml: \"mdi:file-code\",\r\n    xml: \"mdi:xml\",\r\n    markdown: \"mdi:language-markdown\",\r\n    bash: \"mdi:bash\",\r\n    shell: \"mdi:console\",\r\n    powershell: \"mdi:powershell\",\r\n    swift: \"mdi:language-swift\",\r\n    kotlin: \"mdi:language-kotlin\",\r\n    ruby: \"mdi:language-ruby\",\r\n  };\r\n  return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\r\n});\r\n\r\n// 代码样式\r\nconst codeStyle = computed(() => {\r\n  if (!props.maxHeight) return {};\r\n  return {\r\n    maxHeight:\r\n      typeof props.maxHeight === \"number\"\r\n        ? `${props.maxHeight}px`\r\n        : props.maxHeight,\r\n  };\r\n});\r\n\r\n// 自动加载语言包\r\nwatch(\r\n  () => props.language,\r\n  async (newLanguage) => {\r\n    if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\r\n      return;\r\n\r\n    const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\r\n    if (loadedLanguages.includes(newLanguage)) return;\r\n\r\n    languageLoading.value = true;\r\n    try {\r\n      await highlightManager.loadLanguage?.(newLanguage);\r\n      await nextTick();\r\n    } catch (error) {\r\n      console.warn(`Failed to load language: ${newLanguage}`, error);\r\n    } finally {\r\n      languageLoading.value = false;\r\n    }\r\n  },\r\n  { immediate: true },\r\n);\r\n\r\n/**\r\n * 复制代码到剪贴板\r\n */\r\nasync function copyCode() {\r\n  if (copying.value) return;\r\n  copying.value = true;\r\n\r\n  try {\r\n    await navigator.clipboard.writeText(props.code);\r\n    emit(\"copy\", props.code);\r\n  } catch (error) {\r\n    console.error(\"Copy failed:\", error);\r\n  } finally {\r\n    copying.value = false;\r\n  }\r\n}\r\n\r\n/**\r\n * 切换全屏显示状态\r\n */\r\nfunction toggleFullscreen() {\r\n  isFullscreen.value = !isFullscreen.value;\r\n  emit(\"fullscreen\", isFullscreen.value);\r\n}\r\n\r\n/**\r\n * 获取编程语言的显示标题\r\n */\r\nfunction getLanguageTitle(lang: string): string {\r\n  const titleMap: Record<string, string> = {\r\n    javascript: \"JavaScript\",\r\n    typescript: \"TypeScript\",\r\n    python: \"Python\",\r\n    java: \"Java\",\r\n    cpp: \"C++\",\r\n    csharp: \"C#\",\r\n    php: \"PHP\",\r\n    go: \"Go\",\r\n    rust: \"Rust\",\r\n    html: \"HTML\",\r\n    css: \"CSS\",\r\n    json: \"JSON\",\r\n    bash: \"Bash\",\r\n    shell: \"Shell\",\r\n    yaml: \"YAML\",\r\n    xml: \"XML\",\r\n    markdown: \"Markdown\",\r\n    sql: \"SQL\",\r\n    powershell: \"PowerShell\",\r\n    swift: \"Swift\",\r\n    kotlin: \"Kotlin\",\r\n    ruby: \"Ruby\",\r\n    vue: \"Vue\",\r\n    react: \"React\",\r\n  };\r\n  return titleMap[lang.toLowerCase()] || lang.toUpperCase();\r\n}\r\n\r\n/**\r\n * 处理ESC键退出全屏\r\n */\r\nfunction handleEscapeKey(event: KeyboardEvent) {\r\n  if (event.key === \"Escape\" && isFullscreen.value) {\r\n    toggleFullscreen();\r\n  }\r\n}\r\n\r\nonMounted(() => {\r\n  document.addEventListener(\"keydown\", handleEscapeKey);\r\n});\r\n\r\nonUnmounted(() => {\r\n  document.removeEventListener(\"keydown\", handleEscapeKey);\r\n});\r\n\r\ndefineExpose({\r\n  copyCode,\r\n  toggleFullscreen,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.mr-2 {\r\n  margin-right: 0.5rem;\r\n}\r\n\r\n.ml-2 {\r\n  margin-left: 0.5rem;\r\n}\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-19\r\n * @Description: 全局代码高亮组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-code-wrapper\">\r\n    <!-- 代码标题栏 -->\r\n    <div v-if=\"showHeader\" class=\"c-code-header\">\r\n      <div class=\"c-code-title\">\r\n        <C_Icon\r\n          v-if=\"languageIcon\"\r\n          :name=\"languageIcon\"\r\n          :size=\"16\"\r\n          class=\"mr-2\"\r\n        />\r\n        <span>{{ title || getLanguageTitle(language) }}</span>\r\n      </div>\r\n      <div class=\"c-code-actions\">\r\n        <NTooltip trigger=\"hover\">\r\n          <template #trigger>\r\n            <NButton\r\n              size=\"tiny\"\r\n              quaternary\r\n              @click=\"copyCode\"\r\n              :loading=\"copying\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\r\n                  :loading=\"copying\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </template>\r\n          复制代码\r\n        </NTooltip>\r\n\r\n        <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\r\n          <template #trigger>\r\n            <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\r\n              <template #icon>\r\n                <C_Icon\r\n                  :name=\"\r\n                    isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\r\n                  \"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </template>\r\n          {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\r\n        </NTooltip>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- 代码内容区域 -->\r\n    <div class=\"c-code-content\">\r\n      <div\r\n        class=\"code-wrapper\"\r\n        @mouseenter=\"showFloatingCopy = true\"\r\n        @mouseleave=\"showFloatingCopy = false\"\r\n      >\r\n        <NCode\r\n          :key=\"`code-${language}-${code.length}`\"\r\n          :code=\"code\"\r\n          :language=\"language\"\r\n          :hljs=\"hljs\"\r\n          :show-line-numbers=\"showLineNumbers\"\r\n          :word-wrap=\"wordWrap\"\r\n          :trim=\"trim\"\r\n          :style=\"codeStyle\"\r\n          @click=\"emit('click', $event)\"\r\n        />\r\n\r\n        <!-- 悬浮复制按钮 -->\r\n        <Transition name=\"fade\">\r\n          <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\r\n            <NTooltip trigger=\"hover\">\r\n              <template #trigger>\r\n                <NButton\r\n                  size=\"small\"\r\n                  quaternary\r\n                  @click=\"copyCode\"\r\n                  :loading=\"copying\"\r\n                  class=\"copy-floating\"\r\n                >\r\n                  <template #icon>\r\n                    <C_Icon\r\n                      :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\r\n                      :loading=\"copying\"\r\n                    />\r\n                  </template>\r\n                </NButton>\r\n              </template>\r\n              复制代码\r\n            </NTooltip>\r\n          </div>\r\n        </Transition>\r\n      </div>\r\n\r\n      <!-- 语言加载状态 -->\r\n      <div v-if=\"languageLoading\" class=\"c-code-loading\">\r\n        <NSpin size=\"small\" />\r\n        <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- 全屏模态框 -->\r\n    <NModal\r\n      v-model:show=\"isFullscreen\"\r\n      :mask-closable=\"false\"\r\n      :show-icon=\"false\"\r\n      :bordered=\"false\"\r\n      style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\r\n    >\r\n      <div class=\"fullscreen-content\">\r\n        <div class=\"fullscreen-header\">\r\n          <div class=\"fullscreen-title\">\r\n            <C_Icon\r\n              v-if=\"languageIcon\"\r\n              :name=\"languageIcon\"\r\n              :size=\"16\"\r\n              class=\"mr-2\"\r\n            />\r\n            <span>{{ title || getLanguageTitle(language) }}</span>\r\n          </div>\r\n          <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\r\n            <template #icon>\r\n              <C_Icon name=\"mdi:close\" />\r\n            </template>\r\n          </NButton>\r\n        </div>\r\n        <div class=\"fullscreen-body\">\r\n          <NCode\r\n            :key=\"`fullscreen-code-${language}-${code.length}`\"\r\n            :code=\"code\"\r\n            :language=\"language\"\r\n            :hljs=\"hljs\"\r\n            :show-line-numbers=\"showLineNumbers\"\r\n            :word-wrap=\"wordWrap\"\r\n            :trim=\"trim\"\r\n          />\r\n        </div>\r\n      </div>\r\n    </NModal>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport {\r\n  ref,\r\n  computed,\r\n  watch,\r\n  onMounted,\r\n  onUnmounted,\r\n  nextTick,\r\n  inject,\r\n} from \"vue\";\r\nimport C_Icon from \"../C_Icon/index.vue\";\r\n\r\n// 直接在组件内定义 HighlightManager 接口，避免导入错误\r\ninterface HighlightManager {\r\n  getHljs?: () => any;\r\n  loadLanguage?: (language: string) => Promise<void>;\r\n  getLoadedLanguages?: () => string[];\r\n}\r\n\r\n// 组件名称定义\r\ndefineOptions({\r\n  name: \"CCode\",\r\n});\r\n\r\ninterface Props {\r\n  code: string;\r\n  language?: string;\r\n  title?: string;\r\n  showHeader?: boolean;\r\n  showLineNumbers?: boolean;\r\n  wordWrap?: boolean;\r\n  trim?: boolean;\r\n  showFullscreen?: boolean;\r\n  maxHeight?: string | number;\r\n  autoLoadLanguage?: boolean;\r\n}\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n  code: \"\",\r\n  language: \"text\",\r\n  showHeader: true,\r\n  showLineNumbers: true,\r\n  wordWrap: false,\r\n  trim: true,\r\n  showFullscreen: false,\r\n  autoLoadLanguage: true,\r\n});\r\n\r\nconst emit = defineEmits<{\r\n  copy: [code: string];\r\n  click: [event: MouseEvent];\r\n  fullscreen: [isFullscreen: boolean];\r\n}>();\r\n\r\n// 尝试获取 highlight 实例（如果用户安装了插件）\r\nconst highlightManager = inject<HighlightManager | null>(\r\n  \"highlightManager\",\r\n  null,\r\n);\r\n\r\nconst copying = ref(false);\r\nconst isFullscreen = ref(false);\r\nconst languageLoading = ref(false);\r\nconst showFloatingCopy = ref(false);\r\n\r\n// 安全地获取 hljs 实例\r\nconst hljs = computed(() => {\r\n  try {\r\n    return highlightManager?.getHljs?.() || null;\r\n  } catch (error) {\r\n    console.warn(\"Highlight.js not available:\", error);\r\n    return null;\r\n  }\r\n});\r\n\r\n// 语言图标映射（使用标准的 MDI 图标名称）\r\nconst languageIcon = computed(() => {\r\n  const iconMap: Record<string, string> = {\r\n    javascript: \"mdi:language-javascript\",\r\n    typescript: \"mdi:language-typescript\",\r\n    python: \"mdi:language-python\",\r\n    html: \"mdi:language-html5\",\r\n    css: \"mdi:language-css3\",\r\n    vue: \"mdi:vuejs\",\r\n    react: \"mdi:react\",\r\n    json: \"mdi:code-json\",\r\n    java: \"mdi:language-java\",\r\n    cpp: \"mdi:language-cpp\",\r\n    go: \"mdi:language-go\",\r\n    rust: \"mdi:language-rust\",\r\n    php: \"mdi:language-php\",\r\n    csharp: \"mdi:language-csharp\",\r\n    sql: \"mdi:database\",\r\n    yaml: \"mdi:file-code\",\r\n    xml: \"mdi:xml\",\r\n    markdown: \"mdi:language-markdown\",\r\n    bash: \"mdi:bash\",\r\n    shell: \"mdi:console\",\r\n    powershell: \"mdi:powershell\",\r\n    swift: \"mdi:language-swift\",\r\n    kotlin: \"mdi:language-kotlin\",\r\n    ruby: \"mdi:language-ruby\",\r\n  };\r\n  return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\r\n});\r\n\r\n// 代码样式\r\nconst codeStyle = computed(() => {\r\n  if (!props.maxHeight) return {};\r\n  return {\r\n    maxHeight:\r\n      typeof props.maxHeight === \"number\"\r\n        ? `${props.maxHeight}px`\r\n        : props.maxHeight,\r\n  };\r\n});\r\n\r\n// 自动加载语言包\r\nwatch(\r\n  () => props.language,\r\n  async (newLanguage) => {\r\n    if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\r\n      return;\r\n\r\n    const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\r\n    if (loadedLanguages.includes(newLanguage)) return;\r\n\r\n    languageLoading.value = true;\r\n    try {\r\n      await highlightManager.loadLanguage?.(newLanguage);\r\n      await nextTick();\r\n    } catch (error) {\r\n      console.warn(`Failed to load language: ${newLanguage}`, error);\r\n    } finally {\r\n      languageLoading.value = false;\r\n    }\r\n  },\r\n  { immediate: true },\r\n);\r\n\r\n/**\r\n * 复制代码到剪贴板\r\n */\r\nasync function copyCode() {\r\n  if (copying.value) return;\r\n  copying.value = true;\r\n\r\n  try {\r\n    await navigator.clipboard.writeText(props.code);\r\n    emit(\"copy\", props.code);\r\n  } catch (error) {\r\n    console.error(\"Copy failed:\", error);\r\n  } finally {\r\n    copying.value = false;\r\n  }\r\n}\r\n\r\n/**\r\n * 切换全屏显示状态\r\n */\r\nfunction toggleFullscreen() {\r\n  isFullscreen.value = !isFullscreen.value;\r\n  emit(\"fullscreen\", isFullscreen.value);\r\n}\r\n\r\n/**\r\n * 获取编程语言的显示标题\r\n */\r\nfunction getLanguageTitle(lang: string): string {\r\n  const titleMap: Record<string, string> = {\r\n    javascript: \"JavaScript\",\r\n    typescript: \"TypeScript\",\r\n    python: \"Python\",\r\n    java: \"Java\",\r\n    cpp: \"C++\",\r\n    csharp: \"C#\",\r\n    php: \"PHP\",\r\n    go: \"Go\",\r\n    rust: \"Rust\",\r\n    html: \"HTML\",\r\n    css: \"CSS\",\r\n    json: \"JSON\",\r\n    bash: \"Bash\",\r\n    shell: \"Shell\",\r\n    yaml: \"YAML\",\r\n    xml: \"XML\",\r\n    markdown: \"Markdown\",\r\n    sql: \"SQL\",\r\n    powershell: \"PowerShell\",\r\n    swift: \"Swift\",\r\n    kotlin: \"Kotlin\",\r\n    ruby: \"Ruby\",\r\n    vue: \"Vue\",\r\n    react: \"React\",\r\n  };\r\n  return titleMap[lang.toLowerCase()] || lang.toUpperCase();\r\n}\r\n\r\n/**\r\n * 处理ESC键退出全屏\r\n */\r\nfunction handleEscapeKey(event: KeyboardEvent) {\r\n  if (event.key === \"Escape\" && isFullscreen.value) {\r\n    toggleFullscreen();\r\n  }\r\n}\r\n\r\nonMounted(() => {\r\n  document.addEventListener(\"keydown\", handleEscapeKey);\r\n});\r\n\r\nonUnmounted(() => {\r\n  document.removeEventListener(\"keydown\", handleEscapeKey);\r\n});\r\n\r\ndefineExpose({\r\n  copyCode,\r\n  toggleFullscreen,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.mr-2 {\r\n  margin-right: 0.5rem;\r\n}\r\n\r\n.ml-2 {\r\n  margin-left: 0.5rem;\r\n}\r\n</style>\r\n","<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-19\r\n * @Description: 全局代码高亮组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-code-wrapper\">\r\n    <!-- 代码标题栏 -->\r\n    <div v-if=\"showHeader\" class=\"c-code-header\">\r\n      <div class=\"c-code-title\">\r\n        <C_Icon\r\n          v-if=\"languageIcon\"\r\n          :name=\"languageIcon\"\r\n          :size=\"16\"\r\n          class=\"mr-2\"\r\n        />\r\n        <span>{{ title || getLanguageTitle(language) }}</span>\r\n      </div>\r\n      <div class=\"c-code-actions\">\r\n        <NTooltip trigger=\"hover\">\r\n          <template #trigger>\r\n            <NButton\r\n              size=\"tiny\"\r\n              quaternary\r\n              @click=\"copyCode\"\r\n              :loading=\"copying\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\r\n                  :loading=\"copying\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </template>\r\n          复制代码\r\n        </NTooltip>\r\n\r\n        <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\r\n          <template #trigger>\r\n            <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\r\n              <template #icon>\r\n                <C_Icon\r\n                  :name=\"\r\n                    isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\r\n                  \"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </template>\r\n          {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\r\n        </NTooltip>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- 代码内容区域 -->\r\n    <div class=\"c-code-content\">\r\n      <div\r\n        class=\"code-wrapper\"\r\n        @mouseenter=\"showFloatingCopy = true\"\r\n        @mouseleave=\"showFloatingCopy = false\"\r\n      >\r\n        <NCode\r\n          :key=\"`code-${language}-${code.length}`\"\r\n          :code=\"code\"\r\n          :language=\"language\"\r\n          :hljs=\"hljs\"\r\n          :show-line-numbers=\"showLineNumbers\"\r\n          :word-wrap=\"wordWrap\"\r\n          :trim=\"trim\"\r\n          :style=\"codeStyle\"\r\n          @click=\"emit('click', $event)\"\r\n        />\r\n\r\n        <!-- 悬浮复制按钮 -->\r\n        <Transition name=\"fade\">\r\n          <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\r\n            <NTooltip trigger=\"hover\">\r\n              <template #trigger>\r\n                <NButton\r\n                  size=\"small\"\r\n                  quaternary\r\n                  @click=\"copyCode\"\r\n                  :loading=\"copying\"\r\n                  class=\"copy-floating\"\r\n                >\r\n                  <template #icon>\r\n                    <C_Icon\r\n                      :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\r\n                      :loading=\"copying\"\r\n                    />\r\n                  </template>\r\n                </NButton>\r\n              </template>\r\n              复制代码\r\n            </NTooltip>\r\n          </div>\r\n        </Transition>\r\n      </div>\r\n\r\n      <!-- 语言加载状态 -->\r\n      <div v-if=\"languageLoading\" class=\"c-code-loading\">\r\n        <NSpin size=\"small\" />\r\n        <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- 全屏模态框 -->\r\n    <NModal\r\n      v-model:show=\"isFullscreen\"\r\n      :mask-closable=\"false\"\r\n      :show-icon=\"false\"\r\n      :bordered=\"false\"\r\n      style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\r\n    >\r\n      <div class=\"fullscreen-content\">\r\n        <div class=\"fullscreen-header\">\r\n          <div class=\"fullscreen-title\">\r\n            <C_Icon\r\n              v-if=\"languageIcon\"\r\n              :name=\"languageIcon\"\r\n              :size=\"16\"\r\n              class=\"mr-2\"\r\n            />\r\n            <span>{{ title || getLanguageTitle(language) }}</span>\r\n          </div>\r\n          <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\r\n            <template #icon>\r\n              <C_Icon name=\"mdi:close\" />\r\n            </template>\r\n          </NButton>\r\n        </div>\r\n        <div class=\"fullscreen-body\">\r\n          <NCode\r\n            :key=\"`fullscreen-code-${language}-${code.length}`\"\r\n            :code=\"code\"\r\n            :language=\"language\"\r\n            :hljs=\"hljs\"\r\n            :show-line-numbers=\"showLineNumbers\"\r\n            :word-wrap=\"wordWrap\"\r\n            :trim=\"trim\"\r\n          />\r\n        </div>\r\n      </div>\r\n    </NModal>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport {\r\n  ref,\r\n  computed,\r\n  watch,\r\n  onMounted,\r\n  onUnmounted,\r\n  nextTick,\r\n  inject,\r\n} from \"vue\";\r\nimport C_Icon from \"../C_Icon/index.vue\";\r\n\r\n// 直接在组件内定义 HighlightManager 接口，避免导入错误\r\ninterface HighlightManager {\r\n  getHljs?: () => any;\r\n  loadLanguage?: (language: string) => Promise<void>;\r\n  getLoadedLanguages?: () => string[];\r\n}\r\n\r\n// 组件名称定义\r\ndefineOptions({\r\n  name: \"CCode\",\r\n});\r\n\r\ninterface Props {\r\n  code: string;\r\n  language?: string;\r\n  title?: string;\r\n  showHeader?: boolean;\r\n  showLineNumbers?: boolean;\r\n  wordWrap?: boolean;\r\n  trim?: boolean;\r\n  showFullscreen?: boolean;\r\n  maxHeight?: string | number;\r\n  autoLoadLanguage?: boolean;\r\n}\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n  code: \"\",\r\n  language: \"text\",\r\n  showHeader: true,\r\n  showLineNumbers: true,\r\n  wordWrap: false,\r\n  trim: true,\r\n  showFullscreen: false,\r\n  autoLoadLanguage: true,\r\n});\r\n\r\nconst emit = defineEmits<{\r\n  copy: [code: string];\r\n  click: [event: MouseEvent];\r\n  fullscreen: [isFullscreen: boolean];\r\n}>();\r\n\r\n// 尝试获取 highlight 实例（如果用户安装了插件）\r\nconst highlightManager = inject<HighlightManager | null>(\r\n  \"highlightManager\",\r\n  null,\r\n);\r\n\r\nconst copying = ref(false);\r\nconst isFullscreen = ref(false);\r\nconst languageLoading = ref(false);\r\nconst showFloatingCopy = ref(false);\r\n\r\n// 安全地获取 hljs 实例\r\nconst hljs = computed(() => {\r\n  try {\r\n    return highlightManager?.getHljs?.() || null;\r\n  } catch (error) {\r\n    console.warn(\"Highlight.js not available:\", error);\r\n    return null;\r\n  }\r\n});\r\n\r\n// 语言图标映射（使用标准的 MDI 图标名称）\r\nconst languageIcon = computed(() => {\r\n  const iconMap: Record<string, string> = {\r\n    javascript: \"mdi:language-javascript\",\r\n    typescript: \"mdi:language-typescript\",\r\n    python: \"mdi:language-python\",\r\n    html: \"mdi:language-html5\",\r\n    css: \"mdi:language-css3\",\r\n    vue: \"mdi:vuejs\",\r\n    react: \"mdi:react\",\r\n    json: \"mdi:code-json\",\r\n    java: \"mdi:language-java\",\r\n    cpp: \"mdi:language-cpp\",\r\n    go: \"mdi:language-go\",\r\n    rust: \"mdi:language-rust\",\r\n    php: \"mdi:language-php\",\r\n    csharp: \"mdi:language-csharp\",\r\n    sql: \"mdi:database\",\r\n    yaml: \"mdi:file-code\",\r\n    xml: \"mdi:xml\",\r\n    markdown: \"mdi:language-markdown\",\r\n    bash: \"mdi:bash\",\r\n    shell: \"mdi:console\",\r\n    powershell: \"mdi:powershell\",\r\n    swift: \"mdi:language-swift\",\r\n    kotlin: \"mdi:language-kotlin\",\r\n    ruby: \"mdi:language-ruby\",\r\n  };\r\n  return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\r\n});\r\n\r\n// 代码样式\r\nconst codeStyle = computed(() => {\r\n  if (!props.maxHeight) return {};\r\n  return {\r\n    maxHeight:\r\n      typeof props.maxHeight === \"number\"\r\n        ? `${props.maxHeight}px`\r\n        : props.maxHeight,\r\n  };\r\n});\r\n\r\n// 自动加载语言包\r\nwatch(\r\n  () => props.language,\r\n  async (newLanguage) => {\r\n    if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\r\n      return;\r\n\r\n    const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\r\n    if (loadedLanguages.includes(newLanguage)) return;\r\n\r\n    languageLoading.value = true;\r\n    try {\r\n      await highlightManager.loadLanguage?.(newLanguage);\r\n      await nextTick();\r\n    } catch (error) {\r\n      console.warn(`Failed to load language: ${newLanguage}`, error);\r\n    } finally {\r\n      languageLoading.value = false;\r\n    }\r\n  },\r\n  { immediate: true },\r\n);\r\n\r\n/**\r\n * 复制代码到剪贴板\r\n */\r\nasync function copyCode() {\r\n  if (copying.value) return;\r\n  copying.value = true;\r\n\r\n  try {\r\n    await navigator.clipboard.writeText(props.code);\r\n    emit(\"copy\", props.code);\r\n  } catch (error) {\r\n    console.error(\"Copy failed:\", error);\r\n  } finally {\r\n    copying.value = false;\r\n  }\r\n}\r\n\r\n/**\r\n * 切换全屏显示状态\r\n */\r\nfunction toggleFullscreen() {\r\n  isFullscreen.value = !isFullscreen.value;\r\n  emit(\"fullscreen\", isFullscreen.value);\r\n}\r\n\r\n/**\r\n * 获取编程语言的显示标题\r\n */\r\nfunction getLanguageTitle(lang: string): string {\r\n  const titleMap: Record<string, string> = {\r\n    javascript: \"JavaScript\",\r\n    typescript: \"TypeScript\",\r\n    python: \"Python\",\r\n    java: \"Java\",\r\n    cpp: \"C++\",\r\n    csharp: \"C#\",\r\n    php: \"PHP\",\r\n    go: \"Go\",\r\n    rust: \"Rust\",\r\n    html: \"HTML\",\r\n    css: \"CSS\",\r\n    json: \"JSON\",\r\n    bash: \"Bash\",\r\n    shell: \"Shell\",\r\n    yaml: \"YAML\",\r\n    xml: \"XML\",\r\n    markdown: \"Markdown\",\r\n    sql: \"SQL\",\r\n    powershell: \"PowerShell\",\r\n    swift: \"Swift\",\r\n    kotlin: \"Kotlin\",\r\n    ruby: \"Ruby\",\r\n    vue: \"Vue\",\r\n    react: \"React\",\r\n  };\r\n  return titleMap[lang.toLowerCase()] || lang.toUpperCase();\r\n}\r\n\r\n/**\r\n * 处理ESC键退出全屏\r\n */\r\nfunction handleEscapeKey(event: KeyboardEvent) {\r\n  if (event.key === \"Escape\" && isFullscreen.value) {\r\n    toggleFullscreen();\r\n  }\r\n}\r\n\r\nonMounted(() => {\r\n  document.addEventListener(\"keydown\", handleEscapeKey);\r\n});\r\n\r\nonUnmounted(() => {\r\n  document.removeEventListener(\"keydown\", handleEscapeKey);\r\n});\r\n\r\ndefineExpose({\r\n  copyCode,\r\n  toggleFullscreen,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.mr-2 {\r\n  margin-right: 0.5rem;\r\n}\r\n\r\n.ml-2 {\r\n  margin-left: 0.5rem;\r\n}\r\n</style>\r\n"],"mappings":"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"}
+{"version":3,"file":"C_Code.js","names":[],"sources":["../src/components/C_Code/index.vue"],"sourcesContent":["<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-06-19\n * @Description: 全局代码高亮组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n  <div class=\"c-code-wrapper\">\n    <!-- 代码标题栏 -->\n    <div v-if=\"showHeader\" class=\"c-code-header\">\n      <div class=\"c-code-title\">\n        <C_Icon\n          v-if=\"languageIcon\"\n          :name=\"languageIcon\"\n          :size=\"16\"\n          class=\"mr-2\"\n        />\n        <span>{{ title || getLanguageTitle(language) }}</span>\n      </div>\n      <div class=\"c-code-actions\">\n        <NTooltip trigger=\"hover\">\n          <template #trigger>\n            <NButton\n              size=\"tiny\"\n              quaternary\n              @click=\"copyCode\"\n              :loading=\"copying\"\n            >\n              <template #icon>\n                <C_Icon\n                  :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n                  :loading=\"copying\"\n                />\n              </template>\n            </NButton>\n          </template>\n          复制代码\n        </NTooltip>\n\n        <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\n          <template #trigger>\n            <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\n              <template #icon>\n                <C_Icon\n                  :name=\"\n                    isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\n                  \"\n                />\n              </template>\n            </NButton>\n          </template>\n          {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\n        </NTooltip>\n      </div>\n    </div>\n\n    <!-- 代码内容区域 -->\n    <div class=\"c-code-content\">\n      <div\n        class=\"code-wrapper\"\n        @mouseenter=\"showFloatingCopy = true\"\n        @mouseleave=\"showFloatingCopy = false\"\n      >\n        <NCode\n          :key=\"`code-${language}-${code.length}`\"\n          :code=\"code\"\n          :language=\"language\"\n          :hljs=\"hljs\"\n          :show-line-numbers=\"showLineNumbers\"\n          :word-wrap=\"wordWrap\"\n          :trim=\"trim\"\n          :style=\"codeStyle\"\n          @click=\"emit('click', $event)\"\n        />\n\n        <!-- 悬浮复制按钮 -->\n        <Transition name=\"fade\">\n          <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\n            <NTooltip trigger=\"hover\">\n              <template #trigger>\n                <NButton\n                  size=\"small\"\n                  quaternary\n                  @click=\"copyCode\"\n                  :loading=\"copying\"\n                  class=\"copy-floating\"\n                >\n                  <template #icon>\n                    <C_Icon\n                      :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n                      :loading=\"copying\"\n                    />\n                  </template>\n                </NButton>\n              </template>\n              复制代码\n            </NTooltip>\n          </div>\n        </Transition>\n      </div>\n\n      <!-- 语言加载状态 -->\n      <div v-if=\"languageLoading\" class=\"c-code-loading\">\n        <NSpin size=\"small\" />\n        <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\n      </div>\n    </div>\n\n    <!-- 全屏模态框 -->\n    <NModal\n      v-model:show=\"isFullscreen\"\n      :mask-closable=\"false\"\n      :show-icon=\"false\"\n      :bordered=\"false\"\n      style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\n    >\n      <div class=\"fullscreen-content\">\n        <div class=\"fullscreen-header\">\n          <div class=\"fullscreen-title\">\n            <C_Icon\n              v-if=\"languageIcon\"\n              :name=\"languageIcon\"\n              :size=\"16\"\n              class=\"mr-2\"\n            />\n            <span>{{ title || getLanguageTitle(language) }}</span>\n          </div>\n          <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\n            <template #icon>\n              <C_Icon name=\"mdi:close\" />\n            </template>\n          </NButton>\n        </div>\n        <div class=\"fullscreen-body\">\n          <NCode\n            :key=\"`fullscreen-code-${language}-${code.length}`\"\n            :code=\"code\"\n            :language=\"language\"\n            :hljs=\"hljs\"\n            :show-line-numbers=\"showLineNumbers\"\n            :word-wrap=\"wordWrap\"\n            :trim=\"trim\"\n          />\n        </div>\n      </div>\n    </NModal>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {\n  ref,\n  computed,\n  watch,\n  onMounted,\n  onUnmounted,\n  nextTick,\n  inject,\n} from \"vue\";\nimport C_Icon from \"../C_Icon/index.vue\";\n\n// 直接在组件内定义 HighlightManager 接口，避免导入错误\ninterface HighlightManager {\n  getHljs?: () => any;\n  loadLanguage?: (language: string) => Promise<void>;\n  getLoadedLanguages?: () => string[];\n}\n\n// 组件名称定义\ndefineOptions({\n  name: \"CCode\",\n});\n\ninterface Props {\n  code: string;\n  language?: string;\n  title?: string;\n  showHeader?: boolean;\n  showLineNumbers?: boolean;\n  wordWrap?: boolean;\n  trim?: boolean;\n  showFullscreen?: boolean;\n  maxHeight?: string | number;\n  autoLoadLanguage?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  code: \"\",\n  language: \"text\",\n  showHeader: true,\n  showLineNumbers: true,\n  wordWrap: false,\n  trim: true,\n  showFullscreen: false,\n  autoLoadLanguage: true,\n});\n\nconst emit = defineEmits<{\n  copy: [code: string];\n  click: [event: MouseEvent];\n  fullscreen: [isFullscreen: boolean];\n}>();\n\n// 尝试获取 highlight 实例（如果用户安装了插件）\nconst highlightManager = inject<HighlightManager | null>(\n  \"highlightManager\",\n  null,\n);\n\nconst copying = ref(false);\nconst isFullscreen = ref(false);\nconst languageLoading = ref(false);\nconst showFloatingCopy = ref(false);\n\n// 安全地获取 hljs 实例\nconst hljs = computed(() => {\n  try {\n    return highlightManager?.getHljs?.() || null;\n  } catch (error) {\n    console.warn(\"Highlight.js not available:\", error);\n    return null;\n  }\n});\n\n// 语言图标映射（使用标准的 MDI 图标名称）\nconst languageIcon = computed(() => {\n  const iconMap: Record<string, string> = {\n    javascript: \"mdi:language-javascript\",\n    typescript: \"mdi:language-typescript\",\n    python: \"mdi:language-python\",\n    html: \"mdi:language-html5\",\n    css: \"mdi:language-css3\",\n    vue: \"mdi:vuejs\",\n    react: \"mdi:react\",\n    json: \"mdi:code-json\",\n    java: \"mdi:language-java\",\n    cpp: \"mdi:language-cpp\",\n    go: \"mdi:language-go\",\n    rust: \"mdi:language-rust\",\n    php: \"mdi:language-php\",\n    csharp: \"mdi:language-csharp\",\n    sql: \"mdi:database\",\n    yaml: \"mdi:file-code\",\n    xml: \"mdi:xml\",\n    markdown: \"mdi:language-markdown\",\n    bash: \"mdi:bash\",\n    shell: \"mdi:console\",\n    powershell: \"mdi:powershell\",\n    swift: \"mdi:language-swift\",\n    kotlin: \"mdi:language-kotlin\",\n    ruby: \"mdi:language-ruby\",\n  };\n  return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\n});\n\n// 代码样式\nconst codeStyle = computed(() => {\n  if (!props.maxHeight) return {};\n  return {\n    maxHeight:\n      typeof props.maxHeight === \"number\"\n        ? `${props.maxHeight}px`\n        : props.maxHeight,\n  };\n});\n\n// 自动加载语言包\nwatch(\n  () => props.language,\n  async (newLanguage) => {\n    if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\n      return;\n\n    const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\n    if (loadedLanguages.includes(newLanguage)) return;\n\n    languageLoading.value = true;\n    try {\n      await highlightManager.loadLanguage?.(newLanguage);\n      await nextTick();\n    } catch (error) {\n      console.warn(`Failed to load language: ${newLanguage}`, error);\n    } finally {\n      languageLoading.value = false;\n    }\n  },\n  { immediate: true },\n);\n\n/**\n * 复制代码到剪贴板\n */\nasync function copyCode() {\n  if (copying.value) return;\n  copying.value = true;\n\n  try {\n    await navigator.clipboard.writeText(props.code);\n    emit(\"copy\", props.code);\n  } catch (error) {\n    console.error(\"Copy failed:\", error);\n  } finally {\n    copying.value = false;\n  }\n}\n\n/**\n * 切换全屏显示状态\n */\nfunction toggleFullscreen() {\n  isFullscreen.value = !isFullscreen.value;\n  emit(\"fullscreen\", isFullscreen.value);\n}\n\n/**\n * 获取编程语言的显示标题\n */\nfunction getLanguageTitle(lang: string): string {\n  const titleMap: Record<string, string> = {\n    javascript: \"JavaScript\",\n    typescript: \"TypeScript\",\n    python: \"Python\",\n    java: \"Java\",\n    cpp: \"C++\",\n    csharp: \"C#\",\n    php: \"PHP\",\n    go: \"Go\",\n    rust: \"Rust\",\n    html: \"HTML\",\n    css: \"CSS\",\n    json: \"JSON\",\n    bash: \"Bash\",\n    shell: \"Shell\",\n    yaml: \"YAML\",\n    xml: \"XML\",\n    markdown: \"Markdown\",\n    sql: \"SQL\",\n    powershell: \"PowerShell\",\n    swift: \"Swift\",\n    kotlin: \"Kotlin\",\n    ruby: \"Ruby\",\n    vue: \"Vue\",\n    react: \"React\",\n  };\n  return titleMap[lang.toLowerCase()] || lang.toUpperCase();\n}\n\n/**\n * 处理ESC键退出全屏\n */\nfunction handleEscapeKey(event: KeyboardEvent) {\n  if (event.key === \"Escape\" && isFullscreen.value) {\n    toggleFullscreen();\n  }\n}\n\nonMounted(() => {\n  document.addEventListener(\"keydown\", handleEscapeKey);\n});\n\nonUnmounted(() => {\n  document.removeEventListener(\"keydown\", handleEscapeKey);\n});\n\ndefineExpose({\n  copyCode,\n  toggleFullscreen,\n});\n</script>\n\n<style lang=\"scss\" scoped>\n.mr-2 {\n  margin-right: 0.5rem;\n}\n\n.ml-2 {\n  margin-left: 0.5rem;\n}\n</style>\n"],"mappings":"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"}