mirror of https://gitee.com/cf-fz/WebCAD.git
parent
ad793b0b24
commit
8ec716ce5c
@ -1,35 +1,188 @@
|
||||
import { inject, observer } from 'mobx-react';
|
||||
import * as React from 'react';
|
||||
import { BehindBoardStore } from '../../Store/BoardStore';
|
||||
import { Radio, RadioGroup } from '../../../../node_modules/@blueprintjs/core';
|
||||
import { BehindBoardStore, BehindHeightPositon, BehindRelativePositon } from '../../Store/BoardStore';
|
||||
import { SetBoardDataItem } from './BoardCommon';
|
||||
|
||||
@inject("store")
|
||||
@observer
|
||||
export class BehindBoardModal extends React.Component<{ store?: BehindBoardStore }, {}>
|
||||
{
|
||||
m_ScaleParameter = new Map([
|
||||
["knifeRad", "刀具半径"],
|
||||
["grooveAddLength", "槽加长"], ["grooveAddWidth", "槽加宽"], ["grooveAddDepth", "槽加深"]
|
||||
]);
|
||||
m_HeightParameter = new Map([
|
||||
["height", "板件高度"], ["bottomExt", "移动"]
|
||||
]);
|
||||
m_PosParameter = new Map([
|
||||
["spaceHeight", "单层空间"], ["count", "板件个数"], ["thickness", "背板厚度"]
|
||||
]);
|
||||
render()
|
||||
{
|
||||
let store = this.props.store;
|
||||
|
||||
return (
|
||||
<>
|
||||
<div id="board">
|
||||
<div className="pt-card">
|
||||
<div className="flex">
|
||||
<div className="process-data">
|
||||
<h6>加工数据</h6>
|
||||
<div className="flexWrap">
|
||||
{
|
||||
Array.from(store.m_Parameter.keys()).map(k =>
|
||||
Array.from(this.m_ScaleParameter.keys()).map(k =>
|
||||
{
|
||||
return (
|
||||
<div key={k}>
|
||||
<label htmlFor="">{store.m_Parameter.get(k)}:</label>
|
||||
<span> {this.m_ScaleParameter.get(k)}:</span>
|
||||
<input
|
||||
className="pt-input"
|
||||
type="number"
|
||||
value={store.behindBoardOption[k]}
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption[k] = e.target.value;
|
||||
}}
|
||||
/>
|
||||
dir="auto" />
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h6>板件尺寸</h6>
|
||||
<div className="boardSize center">
|
||||
<label className="pt-label pt-inline">
|
||||
上延伸
|
||||
<input
|
||||
className="pt-input"
|
||||
type="number"
|
||||
value={store.behindBoardOption.topExt}
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption.topExt = e.target.value;
|
||||
}}
|
||||
dir="auto" />
|
||||
</label>
|
||||
<div>
|
||||
<label className="pt-label pt-inline">
|
||||
左延伸
|
||||
<input
|
||||
className="pt-input"
|
||||
type="number"
|
||||
value={store.behindBoardOption.leftExt}
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption.leftExt = e.target.value;
|
||||
}}
|
||||
dir="auto" />
|
||||
</label>
|
||||
|
||||
<label className="boardModel">
|
||||
<span className="arrow arrowtop"></span>
|
||||
<span className="line"></span>
|
||||
<span className="arrow arrowbottom"></span>
|
||||
</label>
|
||||
<label className="pt-label pt-inline">
|
||||
右延伸
|
||||
<input
|
||||
className="pt-input"
|
||||
type="number"
|
||||
value={store.behindBoardOption.rightExt}
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption.rightExt = e.target.value;
|
||||
}}
|
||||
dir="auto" />
|
||||
</label>
|
||||
|
||||
</div>
|
||||
<label className="pt-label pt-inline">
|
||||
下延伸
|
||||
<input
|
||||
className="pt-input"
|
||||
type="number"
|
||||
value={store.behindBoardOption.bottomExt}
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption.bottomExt = e.target.value;
|
||||
}}
|
||||
dir="auto" />
|
||||
</label>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h6>板件高度</h6>
|
||||
<RadioGroup
|
||||
className="boardRadio"
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption.boardHeight = e.currentTarget.value as BehindHeightPositon;
|
||||
|
||||
}}
|
||||
selectedValue={store.behindBoardOption.boardHeight}
|
||||
>
|
||||
<Radio label="全部高度" value={BehindHeightPositon.AllHeight} />
|
||||
<Radio label="靠上" value={BehindHeightPositon.ForTop} />
|
||||
<Radio label="靠下" value={BehindHeightPositon.ForBottom} />
|
||||
</RadioGroup>
|
||||
<div className="flexWrap">
|
||||
{
|
||||
Array.from(this.m_HeightParameter.keys()).map(k =>
|
||||
{
|
||||
return (
|
||||
<div
|
||||
key={k}>
|
||||
<span>{this.m_HeightParameter.get(k)}:</span>
|
||||
<input
|
||||
className="pt-input"
|
||||
type="number"
|
||||
value={store.behindBoardOption[k]}
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption[k] = e.target.value;
|
||||
}}
|
||||
dir="auto" />
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h6 >配置板块</h6>
|
||||
<RadioGroup
|
||||
className="boardRadio"
|
||||
onChange={e =>
|
||||
{
|
||||
store.behindBoardOption.boardRelative = e.currentTarget.value as BehindRelativePositon;
|
||||
|
||||
}}
|
||||
selectedValue={store.behindBoardOption.boardRelative}
|
||||
>
|
||||
<Radio label="靠前" value={BehindRelativePositon.ForFront} />
|
||||
<Radio label="靠后" value={BehindRelativePositon.ForBack} />
|
||||
<Radio label="等分板" value={BehindRelativePositon.Div} />
|
||||
</RadioGroup>
|
||||
<div className="flexWrap">
|
||||
{
|
||||
Array.from(this.m_PosParameter.keys()).map(k =>
|
||||
{
|
||||
return (
|
||||
<SetBoardDataItem key={k} k={k} behindBoardOption={store.behindBoardOption} title={this.m_PosParameter.get(k)} />
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -0,0 +1,20 @@
|
||||
import { inject, observer } from 'mobx-react';
|
||||
import * as React from 'react';
|
||||
|
||||
export const SetBoardDataItem = observer(({ k, behindBoardOption, title }) =>
|
||||
<div
|
||||
className="pt-label">
|
||||
<span>
|
||||
{title}:
|
||||
</span>
|
||||
<input
|
||||
className="pt-input"
|
||||
type="number"
|
||||
value={behindBoardOption[k]}
|
||||
onChange={e =>
|
||||
{
|
||||
behindBoardOption[k] = e.target.value;
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
@ -1,35 +1,29 @@
|
||||
import { inject, observer } from 'mobx-react';
|
||||
import * as React from 'react';
|
||||
|
||||
import { SideBoardStore } from '../../Store/BoardStore';
|
||||
|
||||
@inject("store")
|
||||
@observer
|
||||
export class LeftRightBoardModal extends React.Component<{ store?: SideBoardStore }, {}>
|
||||
{
|
||||
render()
|
||||
{
|
||||
let store = this.props.store;
|
||||
return (
|
||||
<>
|
||||
export const LeftRightBoardModal =
|
||||
inject("store")
|
||||
(observer((props: { store?: SideBoardStore }) => (
|
||||
<div>
|
||||
{
|
||||
Array.from(store.m_Parameter.keys()).map(k =>
|
||||
Array.from(props.store.m_Parameter.keys()).map(k =>
|
||||
{
|
||||
return (
|
||||
<div key={k}>
|
||||
<label htmlFor="">{store.m_Parameter.get(k)}:</label>
|
||||
<label htmlFor="">{props.store.m_Parameter.get(k)}:</label>
|
||||
<input
|
||||
type="number"
|
||||
value={store.boardOption[k]}
|
||||
value={props.store.boardOption[k]}
|
||||
onChange={e =>
|
||||
{
|
||||
store.boardOption[k] = e.target.value;
|
||||
props.store.boardOption[k] = e.target.value;
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
}
|
||||
</div>
|
||||
)))
|
||||
|
Loading…
Reference in new issue