| | |
| | | /** |
| | | * CChinaArea - 表单项,中国地址三级联动 |
| | | * 中国地区选择器组件,用于在表单中选择省市区地址 |
| | | * 内置完整的中国行政区划数据,支持多级联动选择 |
| | | * 支持自动通过地理定位获取省市区 |
| | | * @author Tevin |
| | | */ |
| | | |
| | | <template> |
| | | <view class="c-china-area"> |
| | | <view :class="['c-china-area', readOnly ? 'read-only' : '']"> |
| | | <picker |
| | | class="c-china-area-picker" |
| | | mode="multiSelector" |
| | |
| | | }, |
| | | // 占位提示 |
| | | placeholder: String, |
| | | // 是否只读 |
| | | readOnly: { |
| | | type: Boolean, |
| | | default: false, |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | |
| | | // 省 |
| | | if (codes[0]) { |
| | | const proviceIndex = locationTree.findIndex( |
| | | provice => provice.value === codes[0] |
| | | provice => provice.value === codes[0], |
| | | ); |
| | | if (proviceIndex >= 0) { |
| | | range[1] = locationTree[proviceIndex].children; |
| | |
| | | // 市 |
| | | if (codes[1]) { |
| | | const cityIndex = range[1].findIndex( |
| | | city => city.value === codes[1] |
| | | city => city.value === codes[1], |
| | | ); |
| | | if (cityIndex >= 0) { |
| | | range[2] = range[1][cityIndex].children; |
| | |
| | | // 区 |
| | | if (codes[2]) { |
| | | const distIndex = range[2].findIndex( |
| | | dist => dist.value === codes[2] |
| | | dist => dist.value === codes[2], |
| | | ); |
| | | if (distIndex >= 0) { |
| | | current[2] = distIndex; |
| | |
| | | range[3] = |
| | | range[2][current[2]].children || []; |
| | | const streetIndex = range[3].findIndex( |
| | | street => street.value === codes[3] |
| | | street => street.value === codes[3], |
| | | ); |
| | | if (streetIndex >= 0) { |
| | | current[3] = streetIndex; |
| | |
| | | }); |
| | | } |
| | | this.range = range; |
| | | this.current = current; |
| | | setTimeout(() => { |
| | | this.current = current; |
| | | }, 100); |
| | | }); |
| | | }, |
| | | updateColumns(roll) { |
| | |
| | | address.province.replace(/省|市|自治区|特别行政区/g, ''), |
| | | address.city, |
| | | address.district, |
| | | address.street, |
| | | ]; |
| | | if (this.level === 4) { |
| | | regions.push(address.street); |
| | | } |
| | | $locations.getRegionCodes(regions, codes => { |
| | | if (codes && codes.length > 0) { |
| | | $locations.getRegionNames(codes, names => { |