chore(Area): adjust some codes

This commit is contained in:
chenjiahan 2022-01-21 11:32:25 +08:00 committed by neverland
parent 95cf27745b
commit 6bba2906bc
2 changed files with 39 additions and 44 deletions

View File

@ -16,7 +16,7 @@ import {
createNamespace,
} from '../utils';
import { pickerSharedProps } from '../picker/Picker';
import { formatDataForCascade } from './utils';
import { INHERIT_PROPS, INHERIT_SLOTS, formatDataForCascade } from './utils';
// Components
import { Picker } from '../picker';
@ -26,25 +26,6 @@ import type { AreaList } from './types';
const [name, bem] = createNamespace('area');
const INHERIT_SLOTS = [
'title',
'cancel',
'confirm',
'toolbar',
'columns-top',
'columns-bottom',
] as const;
const INHERIT_PROPS = [
'title',
'loading',
'readonly',
'optionHeight',
'swipeDuration',
'visibleOptionNum',
'cancelButtonText',
'confirmButtonText',
] as const;
const areaProps = extend({}, pickerSharedProps, {
modelValue: String,
columnsNum: makeNumericProp(3),
@ -66,15 +47,7 @@ export default defineComponent({
setup(props, { emit, slots }) {
const codes = ref<string[]>([]);
const columns = computed(() =>
formatDataForCascade(
props.areaList,
props.columnsNum,
props.columnsPlaceholder
)
);
const columns = computed(() => formatDataForCascade(props));
const onChange = (...args: unknown[]) => emit('change', ...args);
const onCancel = (...args: unknown[]) => emit('cancel', ...args);
const onConfirm = (...args: unknown[]) => emit('confirm', ...args);

View File

@ -1,8 +1,27 @@
import type { AreaList } from '.';
import type { AreaProps } from '.';
import type { PickerOption } from '../picker';
const EMPTY_CODE = '000000';
export const INHERIT_SLOTS = [
'title',
'cancel',
'confirm',
'toolbar',
'columns-top',
'columns-bottom',
] as const;
export const INHERIT_PROPS = [
'title',
'loading',
'readonly',
'optionHeight',
'swipeDuration',
'visibleOptionNum',
'cancelButtonText',
'confirmButtonText',
] as const;
const makeOption = (
text = '',
value = EMPTY_CODE,
@ -13,20 +32,19 @@ const makeOption = (
children,
});
export function formatDataForCascade(
{ city_list: city, county_list: county, province_list: province }: AreaList,
columnsNum: number | string,
placeholder: string[]
) {
export function formatDataForCascade({
areaList,
columnsNum,
columnsPlaceholder: placeholder,
}: AreaProps) {
const {
city_list: city,
county_list: county,
province_list: province,
} = areaList;
const showCity = columnsNum > 1;
const showCounty = columnsNum > 2;
const getCityChildren = () => {
if (showCounty) {
return placeholder.length ? [makeOption(placeholder[1])] : [];
}
};
const getProvinceChildren = () => {
if (showCity) {
return placeholder.length
@ -45,6 +63,12 @@ export function formatDataForCascade(
const cityMap = new Map<string, PickerOption>();
if (showCity) {
const getCityChildren = () => {
if (showCounty) {
return placeholder.length ? [makeOption(placeholder[1])] : [];
}
};
Object.keys(city).forEach((code) => {
const option = makeOption(city[code], code, getCityChildren());
cityMap.set(code.slice(0, 4), option);
@ -68,9 +92,7 @@ export function formatDataForCascade(
const options = Array.from(provinceMap.values()) as PickerOption[];
if (placeholder.length) {
const county = showCounty
? [makeOption(placeholder[2], EMPTY_CODE)]
: undefined;
const county = showCounty ? [makeOption(placeholder[2])] : undefined;
const city = showCity
? [makeOption(placeholder[1], EMPTY_CODE, county)]
: undefined;