mirror of https://gitee.com/cf-fz/WebCAD.git
!1001 修复:根据板名改板件信息问题
ChenX
parent
cf69cd0a0d
commit
b062b9135a
@ -0,0 +1,65 @@
|
||||
import * as React from 'react';
|
||||
import { Checkbox, Classes } from '@blueprintjs/core';
|
||||
import { Rec2BrStore } from './Rec2BrStore';
|
||||
import { observable } from 'mobx';
|
||||
import { observer } from 'mobx-react';
|
||||
import { userConfigStore } from '../../UI/Store/UserConfigStore';
|
||||
import { BoardModalType } from '../../UI/Components/Board/BoardModal';
|
||||
import { arrayRemove } from '../../Common/ArrayExt';
|
||||
|
||||
|
||||
|
||||
|
||||
export interface ISelectBrConfigNameProps
|
||||
{
|
||||
store: Rec2BrStore;
|
||||
}
|
||||
|
||||
@observer
|
||||
export class SelectBrConfigName extends React.Component<ISelectBrConfigNameProps> {
|
||||
@observable private configNames: string[] = [];
|
||||
async componentDidMount()
|
||||
{
|
||||
let configs = await userConfigStore.GetAllConfigs(BoardModalType.UpdateBoardInfo);
|
||||
if (!configs)
|
||||
return;
|
||||
let names = [...Object.keys(configs)];
|
||||
this.configNames.push(...names);
|
||||
if (!names.includes(this.props.store.m_Option.configName))
|
||||
this.configNames.unshift("");
|
||||
}
|
||||
public render()
|
||||
{
|
||||
const store = this.props.store;
|
||||
return (
|
||||
<>
|
||||
<Checkbox
|
||||
label="使用板件名配置"
|
||||
inline
|
||||
checked={store.m_Option.useBrName}
|
||||
onChange={() => store.m_Option.useBrName = !store.m_Option.useBrName}
|
||||
/>
|
||||
<select
|
||||
className={Classes.SELECT}
|
||||
value={store.m_Option.configName}
|
||||
onChange={this.handleChange}
|
||||
style={{ maxWidth: 80 }}
|
||||
>
|
||||
{
|
||||
this.configNames.map(n =>
|
||||
{
|
||||
return <option value={n} key={n} >{n}</option>;
|
||||
})
|
||||
}
|
||||
</select>
|
||||
</>
|
||||
);
|
||||
}
|
||||
private handleChange = (e: React.ChangeEvent<HTMLSelectElement>) =>
|
||||
{
|
||||
const option = this.props.store.m_Option;
|
||||
option.configName = e.target.value;
|
||||
if (e.target.value !== "")
|
||||
arrayRemove(this.configNames, "");
|
||||
};
|
||||
}
|
||||
@ -0,0 +1,164 @@
|
||||
import { Card, Checkbox, Classes, H5, HTMLSelect } from "@blueprintjs/core";
|
||||
import { observable } from 'mobx';
|
||||
import { observer } from 'mobx-react';
|
||||
import * as React from 'react';
|
||||
import { CheckObjectType } from "../../Common/CheckoutVaildValue";
|
||||
import { userConfig } from '../../Editor/UserConfig';
|
||||
import { Input5Or4Component, Notes, SetBoardDataBlock, SetBoardDataItem } from "../../UI/Components/Board/BoardCommon";
|
||||
import { GoodsList, IGoodInfo } from '../../UI/MaterialEditor/GoodsList';
|
||||
import { SelectBrConfigName } from './R2BCommon';
|
||||
import { GetOptionState } from './R2bConfigComponent';
|
||||
import { Rec2BrStore } from './Rec2BrStore';
|
||||
|
||||
export interface IR2BProcessComponentProps
|
||||
{
|
||||
store: Rec2BrStore;
|
||||
getOption: (state: GetOptionState) => void;
|
||||
}
|
||||
|
||||
@observer
|
||||
export class R2BProcessComponent extends React.Component<IR2BProcessComponentProps> {
|
||||
private showShops = observable.box(false);
|
||||
private m_ScaleParameter = [
|
||||
["knifeRadius", "刀半径"],
|
||||
["grooveAddLength", "槽加长"], ["grooveAddWidth", "槽加宽"], ["grooveAddDepth", "槽加深"]
|
||||
];
|
||||
private matPars = [
|
||||
["boardMatName", "板材名"], ["material", "材料"], ["color", "颜色"]
|
||||
];
|
||||
public render()
|
||||
{
|
||||
const store = this.props.store;
|
||||
const selectOptions = userConfig.DrillConfigs.size > 0 ? [...userConfig.DrillConfigs.keys(), "不排"] : [];
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<H5>材料信息</H5>
|
||||
<div>
|
||||
<SetBoardDataBlock
|
||||
type={CheckObjectType.R2B}
|
||||
pars={this.m_ScaleParameter}
|
||||
option={store.m_Option.grooveOption}
|
||||
uiOption={store.UIOption.grooveOption}
|
||||
className="flexWrap"
|
||||
/>
|
||||
<div className="flex br-mat">
|
||||
<div>
|
||||
<SetBoardDataItem
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="roomName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
title="房间名"
|
||||
placeHolder="输入房间名"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
style={{
|
||||
minHeight: 18,
|
||||
height: 18,
|
||||
padding: 0,
|
||||
fontSize: 8
|
||||
}}
|
||||
className="bp3-button bp3-intent-success"
|
||||
onClick={() => this.props.getOption(GetOptionState.GetBoard)}
|
||||
>拾取</button>
|
||||
</div>
|
||||
<div className="flex br-mat">
|
||||
<SetBoardDataBlock
|
||||
type={CheckObjectType.R2B}
|
||||
pars={this.matPars}
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
isInline={true}
|
||||
/>
|
||||
<button
|
||||
style={{ width: "2rem" }}
|
||||
className="bp3-button bp3-intent-success"
|
||||
onClick={() => this.showShops.set(true)}
|
||||
>选择</button>
|
||||
{
|
||||
this.showShops.get() && <GoodsList
|
||||
open={this.showShops}
|
||||
select={this.selectGoods}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
<label className="bp3-label bp3-inline .modifier">
|
||||
<span>排钻</span>
|
||||
<HTMLSelect
|
||||
className="select-drillType"
|
||||
value={store.m_Option.drillType}
|
||||
style={{
|
||||
padding: "0 5px",
|
||||
width: "100%",
|
||||
// outline: this.state.isDanger && "1px red solid"
|
||||
}}
|
||||
options={selectOptions}
|
||||
onChange={(e) =>
|
||||
{
|
||||
store.m_Option.drillType = e.target.value;
|
||||
store.UIOption.drillType = store.m_Option.drillType;
|
||||
}}
|
||||
// onFocus={() => { if (this.props.onFocus) this.props.onFocus(); }}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
<H5>封边</H5>
|
||||
<div>
|
||||
{
|
||||
<Input5Or4Component
|
||||
type={CheckObjectType.R2B}
|
||||
showDirectionIcon={true}
|
||||
hasCenter={false}
|
||||
optKey=""
|
||||
upKey="sealedUp"
|
||||
downKey="sealedDown"
|
||||
leftKey="sealedLeft"
|
||||
rightKey="sealedRight"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
<H5>备注</H5>
|
||||
<div className={Classes.CARD + " note-card"} style={{ height: 250, overflow: "auto", marginBottom: 10 }}>
|
||||
<Notes remarks={store.m_Option.remarks} />
|
||||
</div>
|
||||
<SelectBrConfigName store={store} />
|
||||
<div>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between", paddingTop: 10 }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.backBrUseTemplate}
|
||||
label={"背板使用模板"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.backBrUseTemplate = !store.m_Option.backBrUseTemplate;
|
||||
store.UIOption.backBrUseTemplate = store.m_Option.backBrUseTemplate;
|
||||
}}
|
||||
/>
|
||||
<button
|
||||
style={{
|
||||
minHeight: 18,
|
||||
height: 18,
|
||||
padding: 0,
|
||||
fontSize: 8,
|
||||
width: "8rem"
|
||||
}}
|
||||
className="bp3-button bp3-intent-success"
|
||||
onClick={() => this.props.getOption(GetOptionState.GetTemplate)}
|
||||
>选择模板</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
private selectGoods = (good: IGoodInfo) =>
|
||||
{
|
||||
this.props.store.m_Option.boardMatName = good.name;//是否需要更新UIOption
|
||||
this.props.store.m_Option.material = good.material;
|
||||
this.props.store.m_Option.color = good.color;
|
||||
this.showShops.set(false);
|
||||
};
|
||||
}
|
||||
@ -0,0 +1,262 @@
|
||||
import { Rec2BrStore } from "./Rec2BrStore";
|
||||
import { observer } from "mobx-react";
|
||||
import React from 'react';
|
||||
import { SetBoardDataItem, SetBoardDataBlock } from "../../UI/Components/Board/BoardCommon";
|
||||
import { CheckObjectType } from "../../Common/CheckoutVaildValue";
|
||||
import { Card, H5, Checkbox, RadioGroup, Radio } from "@blueprintjs/core";
|
||||
import { ToasterInput } from "../../UI/Components/Toaster";
|
||||
|
||||
|
||||
export enum GetOptionState
|
||||
{
|
||||
GetDistance = 0,
|
||||
GetBoard = 1,
|
||||
GetTemplate = 2,
|
||||
}
|
||||
|
||||
interface IR2BConfigComponentProps
|
||||
{
|
||||
store: Rec2BrStore;
|
||||
getOption: (state: GetOptionState) => void;
|
||||
}
|
||||
|
||||
|
||||
@observer
|
||||
export class R2BConfigComponent extends React.Component<IR2BConfigComponentProps>
|
||||
{
|
||||
render()
|
||||
{
|
||||
const store = this.props.store;
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<H5>柜体参数</H5>
|
||||
<div>
|
||||
<div className="flex br-mat">
|
||||
<div>
|
||||
<SetBoardDataItem
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="cabinetDeep"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}//style={{ display: "inline-flex", width: "65%" }}
|
||||
title="柜深"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
style={{
|
||||
minHeight: 18,
|
||||
height: 18,
|
||||
padding: 0,
|
||||
fontSize: 8
|
||||
}}
|
||||
className="bp3-button bp3-intent-success"
|
||||
onClick={() => this.props.getOption(GetOptionState.GetDistance)}
|
||||
>拾取</button>
|
||||
</div>
|
||||
<SetBoardDataItem
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="cabinetCurtail"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
title="柜体内缩"
|
||||
/>
|
||||
<SetBoardDataItem
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="maxThickness"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
title="最大板厚"
|
||||
/>
|
||||
</div>
|
||||
<H5>背板规则</H5>
|
||||
<div className="flex" style={{ flexDirection: "column" }}>
|
||||
<SetBoardDataBlock
|
||||
type={CheckObjectType.R2B}
|
||||
className="flexWrap"
|
||||
pars={[["backBrThick", "板厚"]]}
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
/>
|
||||
<SetBoardDataBlock
|
||||
type={CheckObjectType.R2B}
|
||||
className="flexWrap"
|
||||
pars={[["backBrBiggerThanHeight", "大于高"], ["backBrBiggerThanWidth", "大于宽"]]}
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
/>
|
||||
<SetBoardDataItem
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="backBrFrontMove"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
title="背板前移"
|
||||
/>
|
||||
<SetBoardDataBlock
|
||||
type={CheckObjectType.R2B}
|
||||
className="flexWrap"
|
||||
pars={[["backBrLeftExtend", "左延伸"], ["backBrRightExtend", "右延伸"], ["backBrUpExtend", "上延伸"], ["backBrDownExtend", "下延伸"]]}
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
/>
|
||||
</div>
|
||||
<H5>前缩</H5>
|
||||
<div className="flex" style={{}}>
|
||||
<SetBoardDataBlock
|
||||
type={CheckObjectType.R2B}
|
||||
className="flexWrap"
|
||||
pars={[["verticalBrShrink", "立板"], ["layerBrShrink", "层板"], ["topBrShrink", "顶板"], ["bottomBrShrink", "底板"], ["groundLineBrShrink", "地脚"]]}
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
/>
|
||||
</div>
|
||||
<H5>解析板件名称与板件内缩</H5>
|
||||
<div className="flex" style={{ flexDirection: "column" }}>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between" }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.isfarLeftVerticalBrName}
|
||||
label={"最左侧立板"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.isfarLeftVerticalBrName = !store.m_Option.isfarLeftVerticalBrName;
|
||||
store.UIOption.isfarLeftVerticalBrName = store.m_Option.isfarLeftVerticalBrName;
|
||||
}}
|
||||
/>
|
||||
<ToasterInput
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="farLeftVerticalBrName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
inline={true}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between" }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.isfarRightVerticalBrName}
|
||||
label={"最右侧立板"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.isfarRightVerticalBrName = !store.m_Option.isfarRightVerticalBrName;
|
||||
store.UIOption.isfarRightVerticalBrName = store.m_Option.isfarRightVerticalBrName;
|
||||
}}
|
||||
/>
|
||||
<ToasterInput
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="farRightVerticalBrName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
inline={true}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between" }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.istopMostLayerBrName}
|
||||
label={"最顶层板"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.istopMostLayerBrName = !store.m_Option.istopMostLayerBrName;
|
||||
store.UIOption.istopMostLayerBrName = store.m_Option.istopMostLayerBrName;
|
||||
}}
|
||||
/>
|
||||
<ToasterInput
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="topMostLayerBrName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
inline={true}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between" }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.isbottomMostLayerBrName}
|
||||
label={"最底层板"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.isbottomMostLayerBrName = !store.m_Option.isbottomMostLayerBrName;
|
||||
store.UIOption.isbottomMostLayerBrName = store.m_Option.isbottomMostLayerBrName;
|
||||
}}
|
||||
/>
|
||||
<ToasterInput
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="bottomMostLayerBrName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
inline={true}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between" }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.isbottomMostBackBrName}
|
||||
label={"最底背板"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.isbottomMostBackBrName = !store.m_Option.isbottomMostBackBrName;
|
||||
store.UIOption.isbottomMostBackBrName = store.m_Option.isbottomMostBackBrName;
|
||||
}}
|
||||
/>
|
||||
<ToasterInput
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="bottomMostBackBrName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
inline={true}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between" }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.isstripeBrName}
|
||||
label={"收口条"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.isstripeBrName = !store.m_Option.isstripeBrName;
|
||||
store.UIOption.isstripeBrName = store.m_Option.isstripeBrName;
|
||||
}}
|
||||
/>
|
||||
<ToasterInput
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="stripeBrName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
inline={true}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
根据背板区分柜体
|
||||
</div>
|
||||
<RadioGroup
|
||||
inline
|
||||
selectedValue={store.m_Option.isMultiBackBr ? "1" : "0"}
|
||||
onChange={(e) =>
|
||||
{
|
||||
store.m_Option.isMultiBackBr = e.currentTarget.value === "1";
|
||||
store.UIOption.isMultiBackBr = store.m_Option.isMultiBackBr;
|
||||
}}
|
||||
>
|
||||
|
||||
<Radio label="多背板" value={"1"} />
|
||||
<Radio label="单背板" value={"0"} />
|
||||
</RadioGroup>
|
||||
</div>
|
||||
<div style={{ display: "flex", flexDirection: "row", justifyContent: "space-between" }}>
|
||||
<Checkbox
|
||||
checked={store.m_Option.iscabinetName}
|
||||
label={"修改柜名"}
|
||||
onChange={() =>
|
||||
{
|
||||
store.m_Option.iscabinetName = !store.m_Option.iscabinetName;
|
||||
store.UIOption.iscabinetName = store.m_Option.iscabinetName;
|
||||
}}
|
||||
/>
|
||||
<ToasterInput
|
||||
type={CheckObjectType.R2B}
|
||||
optKey="cabinetName"
|
||||
option={store.m_Option}
|
||||
uiOption={store.UIOption}
|
||||
inline={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
}
|
||||
Loading…
Reference in new issue