Commit f0d9f677 authored by XieZhiXiong's avatar XieZhiXiong

chore: 隔绝样式影响、补充属性

parent ecbf0961
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2021-08-05 14:54:18
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-08-07 16:36:14
* @LastEditTime: 2021-08-10 16:42:18
* @Description:
*/
import React from 'react';
......@@ -20,7 +20,7 @@ const AddressRadioGroupFormilyItem = connect()((props) => {
...rest
} = props;
return (
<div style={{ flex: 1 }}>
<div style={{ flex: 1, overflow: 'hidden' }}>
<AddressRadioGroup
addressType={addressType}
isDefault={isDefault}
......
......@@ -6,6 +6,7 @@
&-input {
flex: 1;
overflow: hidden;
}
&-action {
......
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2021-08-05 10:28:06
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-08-10 10:20:55
* @LastEditTime: 2021-08-10 16:55:26
* @Description: 地址选择 FormItem
*/
import React, { useState, useEffect, useMemo, useRef } from 'react';
......@@ -148,7 +148,7 @@ const AddressSelect: React.FC<IProps> = (props) => {
triggerChange(undefined);
}
if (isDefaultAddress && defaultItem) {
if (isDefaultAddress && defaultItem && !disabled) {
const { shipperName, receiverName, ...rest } = defaultItem;
const next = {
name: shipperName || receiverName,
......@@ -427,12 +427,17 @@ const AddressSelect: React.FC<IProps> = (props) => {
}}
>
<div className={styles['address-select']}>
<Select
options={options}
value={value?.id}
onChange={handleSelectChange}
disabled={disabled}
/>
<div className={styles['address-select-input']}>
<Select
options={options}
value={value?.id}
onChange={handleSelectChange}
disabled={disabled}
style={{
width: '100%',
}}
/>
</div>
<Button
onClick={() => handleVisibleDrawer(true)}
className={styles['address-select-action']}
......
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2021-08-05 14:02:46
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-08-10 14:05:13
* @LastEditTime: 2021-08-10 16:58:04
* @Description:
*/
import { ISchema } from '@formily/antd';
......@@ -14,228 +14,238 @@ export const createSchema = (addressType = 2): ISchema => {
return {
type: 'object',
properties: {
ADDRESS_LIST: {
MEGA_LAYOUT: {
type: 'object',
'x-component': 'FlagBox',
'x-component': 'Mega-Layout',
'x-component-props': {
title: `选择${typeCN}地址`,
border: false,
grid: false,
},
properties: {
MEGA_LAYOUT_1: {
ADDRESS_LIST: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component': 'FlagBox',
'x-component-props': {
wrapperCol: 24,
title: `选择${typeCN}地址`,
border: false,
},
properties: {
address: {
type: 'string',
'x-component': 'AddressRadioGroup',
MEGA_LAYOUT_1: {
type: 'object',
'x-component': 'Mega-Layout',
'x-component-props': {
onClickEdit: '{{ handleEditAddress }}',
wrapperCol: 24,
},
properties: {
address: {
type: 'string',
'x-component': 'AddressRadioGroup',
'x-component-props': {
onClickEdit: '{{ handleEditAddress }}',
},
},
},
},
},
},
},
},
ADD_ACTION: {
type: 'object',
'x-component': 'AddButton',
},
ADDRESS_NEW: {
type: 'object',
'x-component': 'FlagBox',
'x-component-props': {
title: `填写${typeCN}信息`,
border: false,
},
visible: false,
properties: {
MEGA_LAYOUT_2: {
ADD_ACTION: {
type: 'object',
'x-component': 'mega-layout',
'x-component': 'AddButton',
},
ADDRESS_NEW: {
type: 'object',
'x-component': 'FlagBox',
'x-component-props': {
labelCol: 4,
wrapperCol: 20,
labelAlign: 'left',
title: `填写${typeCN}信息`,
border: false,
},
visible: false,
properties: {
name: {
type: 'string',
title: `${operator}人`,
'x-component-props': {
placeholder: '请输入',
},
'x-rules': [
{
required: true,
message: `请输入${operator}人`,
},
{
limitByte: true, // 自定义校验规则
maxByte: 20,
},
],
required: true,
},
MEGA_LAYOUT_2_1: {
MEGA_LAYOUT_2: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
label: `{{ required("${typeCN}地区") }}`,
wrapperCol: 24,
full: false,
labelCol: 4,
wrapperCol: 20,
labelAlign: 'left',
},
required: true,
properties: {
MEGA_LAYOUT_2_1_1: {
name: {
type: 'string',
title: `${operator}人`,
'x-component-props': {
placeholder: '请输入',
},
'x-rules': [
{
required: true,
message: `请输入${operator}人`,
},
{
limitByte: true, // 自定义校验规则
maxByte: 20,
},
],
required: true,
},
MEGA_LAYOUT_2_1: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
full: true,
autoRow: true,
columns: 3,
label: `{{ required("${typeCN}地区") }}`,
wrapperCol: 24,
},
required: true,
properties: {
provinceCode: {
type: 'string',
enum: [],
MEGA_LAYOUT_2_1_1: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
placeholder: '-省份/直辖市-',
grid: true,
full: true,
autoRow: true,
columns: 3,
},
'x-linkages': [
{
type: 'value:linkage',
condition: '{{ !!$self.value }}', // $self.value 不生效不知道咋滴
origin: 'provinceCode',
target: 'cityCode',
properties: {
provinceCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '-省份/直辖市-',
},
'x-linkages': [
{
type: 'value:linkage',
condition: '{{ !!$self.value }}', // $self.value 不生效不知道咋滴
origin: 'provinceCode',
target: 'cityCode',
},
],
required: true,
},
],
required: true,
},
cityCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '-市-',
},
'x-linkages': [
{
type: 'value:linkage',
condition: '{{ !!$self.value }}', // $self.value 不生效不知道咋滴
origin: 'cityCode',
target: 'districtCode',
cityCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '-市-',
},
'x-linkages': [
{
type: 'value:linkage',
condition: '{{ !!$self.value }}', // $self.value 不生效不知道咋滴
origin: 'cityCode',
target: 'districtCode',
},
],
required: true,
},
districtCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '-区-',
},
required: true,
},
],
required: true,
},
districtCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '-区-',
},
required: true,
},
},
},
},
},
detailed: {
type: 'string',
title: '详细地址',
'x-component-props': {
placeholder: '请输入详细地址(最长60个字符,30个汉字)',
},
'x-rules': [
{
required: true,
message: '请输入详细地址',
detailed: {
type: 'string',
title: '详细地址',
'x-component-props': {
placeholder: '请输入详细地址(最长60个字符,30个汉字)',
},
'x-rules': [
{
required: true,
message: '请输入详细地址',
},
{
limitByte: true, // 自定义校验规则
maxByte: 60,
}
],
},
{
limitByte: true, // 自定义校验规则
maxByte: 60,
}
],
},
postalCode: {
type: 'string',
title: '邮编',
'x-component-props': {},
'x-rules': [
{
limitByte: true, // 自定义校验规则
maxByte: 20,
}
],
},
MEGA_LAYOUT_2_2: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
label: '{{ required("手机号码") }}',
wrapperCol: 24,
},
properties: {
MEGA_LAYOUT2_1: {
postalCode: {
type: 'string',
title: '邮编',
'x-component-props': {},
'x-rules': [
{
limitByte: true, // 自定义校验规则
maxByte: 20,
}
],
},
MEGA_LAYOUT_2_2: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
grid: true,
full: true,
label: '{{ required("手机号码") }}',
wrapperCol: 24,
},
properties: {
areaCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '请选择',
},
required: true,
},
phone: {
type: 'string',
required: true,
'x-mega-props': {
span: 3,
},
MEGA_LAYOUT2_1: {
type: 'object',
'x-component': 'mega-layout',
'x-component-props': {
placeholder: '请输入你的手机号码',
maxLength: 11,
grid: true,
full: true,
},
'x-rules': [
{
pattern: PATTERN_MAPS.phone,
message: '请输入正确格式的手机号',
properties: {
areaCode: {
type: 'string',
enum: [],
'x-component-props': {
placeholder: '请选择',
},
required: true,
},
],
phone: {
type: 'string',
required: true,
'x-mega-props': {
span: 3,
},
'x-component-props': {
placeholder: '请输入你的手机号码',
maxLength: 11,
},
'x-rules': [
{
pattern: PATTERN_MAPS.phone,
message: '请输入正确格式的手机号',
},
],
},
},
},
},
},
},
},
tel: {
type: 'string',
title: '电话号码',
'x-component-props': {},
'x-rules': [
{
pattern: PATTERN_MAPS.tel,
message: '请输入正确格式的电话号码',
tel: {
type: 'string',
title: '电话号码',
'x-component-props': {},
'x-rules': [
{
pattern: PATTERN_MAPS.tel,
message: '请输入正确格式的电话号码',
},
],
},
],
},
isDefault: {
type: 'boolean',
title: '是否默认',
'x-component': 'Switch',
isDefault: {
type: 'boolean',
title: '是否默认',
'x-component': 'Switch',
},
},
},
},
},
},
},
}
},
};
};
\ No newline at end of file
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2021-08-05 11:26:43
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-08-05 11:30:21
* @LastEditTime: 2021-08-10 16:49:14
* @Description:
*/
import React from 'react';
......@@ -15,12 +15,16 @@ const CustomAddressSelect = connect()((props) => {
value,
onChange,
addressType,
isDefault,
disabled,
...rest
} = props;
return (
<div style={{ flex: 1 }}>
<div style={{ flex: 1, overflow: 'hidden' }}>
<AddressSelect
addressType={addressType}
isDefault={isDefault}
disabled={disabled}
value={value}
onChange={onChange}
{...rest}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment