|
|
|
|
@ -26,14 +26,79 @@ export class DoorConfigModal extends React.Component<{ store?: DoorDrawerStore;
|
|
|
|
|
store.SetDrawerDepth();
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
UNSAFE_componentWillMount()
|
|
|
|
|
/**
|
|
|
|
|
*渲染拉手
|
|
|
|
|
*/
|
|
|
|
|
renderHandle = () =>
|
|
|
|
|
{
|
|
|
|
|
this.uiOption = this.props.store.UIOption as IUiOption<IDoorConfigOption & IDrawerConfigOption>;
|
|
|
|
|
this.isDoor = this.props.store instanceof DoorStore;
|
|
|
|
|
}
|
|
|
|
|
render()
|
|
|
|
|
const { store } = this.props;
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<H5>拉手</H5>
|
|
|
|
|
<div>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="handleAngle"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title="旋转角"
|
|
|
|
|
/>
|
|
|
|
|
<div>
|
|
|
|
|
<RadioGroup
|
|
|
|
|
className="door-pos-type"
|
|
|
|
|
inline={true}
|
|
|
|
|
selectedValue={store.m_Option.handleHorPos}
|
|
|
|
|
onChange={e =>
|
|
|
|
|
{
|
|
|
|
|
const store = this.props.store;
|
|
|
|
|
store.m_Option.handleHorPos = safeEval(e.currentTarget.value) as HandleHorPos;
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<Radio label="左距" value={HandleHorPos.Left} />
|
|
|
|
|
<Radio label="右距" value={HandleHorPos.Right} />
|
|
|
|
|
<Radio label="居中" value={HandleHorPos.Mid} />
|
|
|
|
|
</RadioGroup>
|
|
|
|
|
<ToasterInput
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="horSpacing"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
inline={true}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<RadioGroup
|
|
|
|
|
className="door-pos-type"
|
|
|
|
|
inline={true}
|
|
|
|
|
selectedValue={store.m_Option.handleVePos}
|
|
|
|
|
onChange={e =>
|
|
|
|
|
{
|
|
|
|
|
store.m_Option.handleVePos = safeEval(e.currentTarget.value) as HandleVePos;
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<Radio label="上距" value={HandleVePos.Top} />
|
|
|
|
|
<Radio label="下距" value={HandleVePos.Bottom} />
|
|
|
|
|
<Radio label="居中" value={HandleVePos.Mid} />
|
|
|
|
|
</RadioGroup>
|
|
|
|
|
<ToasterInput
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="veSpacing"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
inline={true}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
*渲染门板
|
|
|
|
|
*/
|
|
|
|
|
renderDoor = () =>
|
|
|
|
|
{
|
|
|
|
|
const { store } = this.props;
|
|
|
|
|
const { m_Option } = store as DoorStore;
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<DoorDrawerRowCol
|
|
|
|
|
@ -53,21 +118,73 @@ export class DoorConfigModal extends React.Component<{ store?: DoorDrawerStore;
|
|
|
|
|
handleDrawerDepth={this.handleDrawerDepth}
|
|
|
|
|
/>
|
|
|
|
|
<Divider />
|
|
|
|
|
<div className='flex'>
|
|
|
|
|
<div>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="doorThickness"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title="门板厚"
|
|
|
|
|
onChange={() =>
|
|
|
|
|
{
|
|
|
|
|
if (store.m_Option.doorPosType === DoorPosType.In)
|
|
|
|
|
{
|
|
|
|
|
store.m_Option.offset = (store.m_Option as IDoorConfigOption).doorThickness;
|
|
|
|
|
this.uiOption.offset = this.uiOption.doorThickness;
|
|
|
|
|
}
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
<div>
|
|
|
|
|
<Checkbox
|
|
|
|
|
label="正反面排孔"
|
|
|
|
|
inline
|
|
|
|
|
checked={(store as DoorStore).m_Option.frontAndBackDrill}
|
|
|
|
|
onChange={() => (store as DoorStore).m_Option.frontAndBackDrill = !(store as DoorStore).m_Option.frontAndBackDrill}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<Checkbox
|
|
|
|
|
label="使用模块时:修改板名为开门方向"
|
|
|
|
|
inline
|
|
|
|
|
checked={(store as DoorStore).m_Option.changeTemplateBoardNameOfOpenDir}
|
|
|
|
|
onChange={() => (store as DoorStore).m_Option.changeTemplateBoardNameOfOpenDir = !(store as DoorStore).m_Option.changeTemplateBoardNameOfOpenDir}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<H6 style={{ textAlign: "center" }}>门板封边</H6>
|
|
|
|
|
<Input5Or4Component
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
showDirectionIcon={false}
|
|
|
|
|
hasCenter={false}
|
|
|
|
|
optKey=""
|
|
|
|
|
upKey="topDoorSeal"
|
|
|
|
|
downKey="bottomDoorSeal"
|
|
|
|
|
leftKey="leftDoorSeal"
|
|
|
|
|
rightKey="rightDoorSeal"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<Divider />
|
|
|
|
|
<div className='flex-between'>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="thickness"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title="立板厚"
|
|
|
|
|
title="板厚"
|
|
|
|
|
inline={true}
|
|
|
|
|
/>
|
|
|
|
|
<div>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="depth"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title={this.isDoor ? "立板深" : "抽屉深"}
|
|
|
|
|
title={"深度"}
|
|
|
|
|
inline={true}
|
|
|
|
|
isDisabled={store.m_Option.isAuto}
|
|
|
|
|
/>
|
|
|
|
|
@ -79,178 +196,202 @@ export class DoorConfigModal extends React.Component<{ store?: DoorDrawerStore;
|
|
|
|
|
{
|
|
|
|
|
store.m_Option.isAuto = !store.m_Option.isAuto;
|
|
|
|
|
if (store.m_Option.isAuto)
|
|
|
|
|
{
|
|
|
|
|
if (this.isDoor)
|
|
|
|
|
{
|
|
|
|
|
store.m_Option.depth = store.totalDepth;
|
|
|
|
|
this.uiOption.depth = store.totalDepth.toString();
|
|
|
|
|
}
|
|
|
|
|
else
|
|
|
|
|
{
|
|
|
|
|
this.handleDrawerDepth();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
{
|
|
|
|
|
!this.isDoor && <SetBoardDataItem
|
|
|
|
|
className="drawerTotalDepth"
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="drawerTotalDepth"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title="抽屉最大深度"
|
|
|
|
|
tip="最大深度"
|
|
|
|
|
onChange={() =>
|
|
|
|
|
{
|
|
|
|
|
this.handleDrawerDepth();
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
}
|
|
|
|
|
</div>
|
|
|
|
|
<Divider />
|
|
|
|
|
<div className={this.isDoor ? "flexWrap" : ""}>
|
|
|
|
|
</div>
|
|
|
|
|
<div className='flex-arround'>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
className={(!this.isDoor) ? "br-name" : ""}
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="boardName"
|
|
|
|
|
className="verticalBoardName"
|
|
|
|
|
optKey="verticalBoardName"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
title="柜名"
|
|
|
|
|
placeHolder="输入柜名"
|
|
|
|
|
isDisabled={true}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title="立板名称"
|
|
|
|
|
inline
|
|
|
|
|
/>
|
|
|
|
|
{
|
|
|
|
|
this.isDoor && <SetBoardDataItem
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="doorThickness"
|
|
|
|
|
className="layerBoardName"
|
|
|
|
|
optKey="layerBoardName"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title="门板厚"
|
|
|
|
|
onChange={() =>
|
|
|
|
|
{
|
|
|
|
|
if (store.m_Option.doorPosType === DoorPosType.In)
|
|
|
|
|
{
|
|
|
|
|
store.m_Option.offset = (store.m_Option as IDoorConfigOption).doorThickness;
|
|
|
|
|
this.uiOption.offset = this.uiOption.doorThickness;
|
|
|
|
|
}
|
|
|
|
|
}}
|
|
|
|
|
title="层板名称"
|
|
|
|
|
inline
|
|
|
|
|
/>
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<Divider />
|
|
|
|
|
{
|
|
|
|
|
this.isDoor && <div className="flex-arround">
|
|
|
|
|
<div className="flex-arround">
|
|
|
|
|
<div>
|
|
|
|
|
<H6>层板立板封边</H6>
|
|
|
|
|
<H5>立板封边/排钻</H5>
|
|
|
|
|
<Input5Or4Component
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
showDirectionIcon={false}
|
|
|
|
|
type={CheckObjectType.BR}
|
|
|
|
|
showDirectionIcon={true}
|
|
|
|
|
hasCenter={false}
|
|
|
|
|
optKey=""
|
|
|
|
|
upKey="topBrSeal"
|
|
|
|
|
downKey="bottomBrSeal"
|
|
|
|
|
leftKey="leftBrSeal"
|
|
|
|
|
rightKey="rightBrSeal"
|
|
|
|
|
upKey="lbSealedUp"
|
|
|
|
|
downKey="lbSealedDown"
|
|
|
|
|
leftKey="lbSealedLeft"
|
|
|
|
|
rightKey="lbSealedRight"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
uiOption={store.UIOption}
|
|
|
|
|
isShowEditor={true}
|
|
|
|
|
highDrillOption={store.m_Option.lbHightDrillOption}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<H6>门板封边</H6>
|
|
|
|
|
<H5>层板封边/排钻</H5>
|
|
|
|
|
<Input5Or4Component
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
showDirectionIcon={false}
|
|
|
|
|
showDirectionIcon={true}
|
|
|
|
|
hasCenter={false}
|
|
|
|
|
optKey=""
|
|
|
|
|
upKey="topDoorSeal"
|
|
|
|
|
downKey="bottomDoorSeal"
|
|
|
|
|
leftKey="leftDoorSeal"
|
|
|
|
|
rightKey="rightDoorSeal"
|
|
|
|
|
upKey="topBrSeal"
|
|
|
|
|
downKey="bottomBrSeal"
|
|
|
|
|
leftKey="leftBrSeal"
|
|
|
|
|
rightKey="rightBrSeal"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
isShowEditor={true}
|
|
|
|
|
highDrillOption={m_Option.cbHightDrillOption}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
}
|
|
|
|
|
<H5>拉手</H5>
|
|
|
|
|
<Divider />
|
|
|
|
|
{this.renderHandle()}
|
|
|
|
|
<Divider />
|
|
|
|
|
<HingeRules
|
|
|
|
|
store={store as DoorStore}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
*渲染抽屉
|
|
|
|
|
*/
|
|
|
|
|
renderDrawer = () =>
|
|
|
|
|
{
|
|
|
|
|
const { store } = this.props;
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<DoorDrawerRowCol
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
store={store}
|
|
|
|
|
/>
|
|
|
|
|
<Divider />
|
|
|
|
|
<UpDownSpaceComponent
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
store={store}
|
|
|
|
|
/>
|
|
|
|
|
<Divider />
|
|
|
|
|
<ChangeDoorOrDrawerPosition
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
store={store}
|
|
|
|
|
isDoor={this.isDoor}
|
|
|
|
|
handleDrawerDepth={this.handleDrawerDepth}
|
|
|
|
|
/>
|
|
|
|
|
<Divider />
|
|
|
|
|
<div>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="handleAngle"
|
|
|
|
|
optKey="depth"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
title="旋转角"
|
|
|
|
|
title={"抽屉深"}
|
|
|
|
|
inline={true}
|
|
|
|
|
isDisabled={store.m_Option.isAuto}
|
|
|
|
|
/>
|
|
|
|
|
<div>
|
|
|
|
|
<RadioGroup
|
|
|
|
|
className="door-pos-type"
|
|
|
|
|
<Checkbox
|
|
|
|
|
inline={true}
|
|
|
|
|
selectedValue={store.m_Option.handleHorPos}
|
|
|
|
|
onChange={e =>
|
|
|
|
|
checked={store.m_Option.isAuto}
|
|
|
|
|
label="智能识别"
|
|
|
|
|
onChange={() =>
|
|
|
|
|
{
|
|
|
|
|
store.m_Option.handleHorPos = safeEval(e.currentTarget.value) as HandleHorPos;
|
|
|
|
|
store.m_Option.isAuto = !store.m_Option.isAuto;
|
|
|
|
|
if (store.m_Option.isAuto)
|
|
|
|
|
{
|
|
|
|
|
this.handleDrawerDepth();
|
|
|
|
|
}
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<Radio label="左距" value={HandleHorPos.Left} />
|
|
|
|
|
<Radio label="右距" value={HandleHorPos.Right} />
|
|
|
|
|
<Radio label="居中" value={HandleHorPos.Mid} />
|
|
|
|
|
</RadioGroup>
|
|
|
|
|
<ToasterInput
|
|
|
|
|
/>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
inline
|
|
|
|
|
className="drawerTotalDepth"
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="horSpacing"
|
|
|
|
|
optKey="drawerTotalDepth"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
inline={true}
|
|
|
|
|
title="抽屉最大深度"
|
|
|
|
|
tip="最大深度"
|
|
|
|
|
onChange={() =>
|
|
|
|
|
{
|
|
|
|
|
this.handleDrawerDepth();
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<Divider />
|
|
|
|
|
<div>
|
|
|
|
|
<RadioGroup
|
|
|
|
|
className="door-pos-type"
|
|
|
|
|
inline={true}
|
|
|
|
|
selectedValue={store.m_Option.handleVePos}
|
|
|
|
|
onChange={e =>
|
|
|
|
|
{
|
|
|
|
|
store.m_Option.handleVePos = safeEval(e.currentTarget.value) as HandleVePos;
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<Radio label="上距" value={HandleVePos.Top} />
|
|
|
|
|
<Radio label="下距" value={HandleVePos.Bottom} />
|
|
|
|
|
<Radio label="居中" value={HandleVePos.Mid} />
|
|
|
|
|
</RadioGroup>
|
|
|
|
|
<ToasterInput
|
|
|
|
|
<div >
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="veSpacing"
|
|
|
|
|
className="verticalBoardName"
|
|
|
|
|
optKey="verticalBoardName"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
inline={true}
|
|
|
|
|
title="立板名称"
|
|
|
|
|
inline
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
{
|
|
|
|
|
this.isDoor && <HingeRules
|
|
|
|
|
store={store as DoorStore}
|
|
|
|
|
<div>
|
|
|
|
|
<SetBoardDataItem
|
|
|
|
|
type={CheckObjectType.Do}
|
|
|
|
|
optKey="thickness"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={this.uiOption}
|
|
|
|
|
/>
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
this.isDoor && <div><Checkbox
|
|
|
|
|
label="正反面排孔"
|
|
|
|
|
inline
|
|
|
|
|
checked={(store as DoorStore).m_Option.frontAndBackDrill}
|
|
|
|
|
onChange={() => (store as DoorStore).m_Option.frontAndBackDrill = !(store as DoorStore).m_Option.frontAndBackDrill}
|
|
|
|
|
title="立板厚"
|
|
|
|
|
inline={true}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
this.isDoor && <div><Checkbox
|
|
|
|
|
label="使用模块时:修改板名为开门方向"
|
|
|
|
|
inline
|
|
|
|
|
checked={(store as DoorStore).m_Option.changeTemplateBoardNameOfOpenDir}
|
|
|
|
|
onChange={() => (store as DoorStore).m_Option.changeTemplateBoardNameOfOpenDir = !(store as DoorStore).m_Option.changeTemplateBoardNameOfOpenDir}
|
|
|
|
|
<div>
|
|
|
|
|
<H5 style={{ textAlign: "center" }}>立板封边/排钻</H5>
|
|
|
|
|
<Input5Or4Component
|
|
|
|
|
type={CheckObjectType.BR}
|
|
|
|
|
showDirectionIcon={true}
|
|
|
|
|
hasCenter={false}
|
|
|
|
|
optKey=""
|
|
|
|
|
upKey="lbSealedUp"
|
|
|
|
|
downKey="lbSealedDown"
|
|
|
|
|
leftKey="lbSealedLeft"
|
|
|
|
|
rightKey="lbSealedRight"
|
|
|
|
|
option={store.m_Option}
|
|
|
|
|
uiOption={store.UIOption}
|
|
|
|
|
isShowEditor={true}
|
|
|
|
|
highDrillOption={store.m_Option.lbHightDrillOption}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<Divider />
|
|
|
|
|
{this.renderHandle()}
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
UNSAFE_componentWillMount()
|
|
|
|
|
{
|
|
|
|
|
this.uiOption = this.props.store.UIOption as IUiOption<IDoorConfigOption & IDrawerConfigOption>;
|
|
|
|
|
this.isDoor = this.props.store instanceof DoorStore;
|
|
|
|
|
}
|
|
|
|
|
render()
|
|
|
|
|
{
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
{this.isDoor ? this.renderDoor() : this.renderDrawer()}
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
黄诗津
1 year ago
committed by