mirror of https://gitee.com/cf-fz/WebCAD.git
parent
ad793b0b24
commit
8ec716ce5c
@ -1,35 +1,188 @@
|
|||||||
import { inject, observer } from 'mobx-react';
|
import { inject, observer } from 'mobx-react';
|
||||||
import * as React from '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")
|
@inject("store")
|
||||||
@observer
|
@observer
|
||||||
export class BehindBoardModal extends React.Component<{ store?: BehindBoardStore }, {}>
|
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()
|
render()
|
||||||
{
|
{
|
||||||
let store = this.props.store;
|
let store = this.props.store;
|
||||||
|
|
||||||
return (
|
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 (
|
return (
|
||||||
<div key={k}>
|
<div key={k}>
|
||||||
<label htmlFor="">{store.m_Parameter.get(k)}:</label>
|
<span> {this.m_ScaleParameter.get(k)}:</span>
|
||||||
<input
|
<input
|
||||||
|
className="pt-input"
|
||||||
type="number"
|
type="number"
|
||||||
value={store.behindBoardOption[k]}
|
value={store.behindBoardOption[k]}
|
||||||
onChange={e =>
|
onChange={e =>
|
||||||
{
|
{
|
||||||
store.behindBoardOption[k] = e.target.value;
|
store.behindBoardOption[k] = e.target.value;
|
||||||
}}
|
}}
|
||||||
/>
|
dir="auto" />
|
||||||
</div>
|
</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 { inject, observer } from 'mobx-react';
|
||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
|
|
||||||
import { SideBoardStore } from '../../Store/BoardStore';
|
import { SideBoardStore } from '../../Store/BoardStore';
|
||||||
|
|
||||||
@inject("store")
|
export const LeftRightBoardModal =
|
||||||
@observer
|
inject("store")
|
||||||
export class LeftRightBoardModal extends React.Component<{ store?: SideBoardStore }, {}>
|
(observer((props: { store?: SideBoardStore }) => (
|
||||||
{
|
<div>
|
||||||
render()
|
|
||||||
{
|
|
||||||
let store = this.props.store;
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{
|
{
|
||||||
Array.from(store.m_Parameter.keys()).map(k =>
|
Array.from(props.store.m_Parameter.keys()).map(k =>
|
||||||
{
|
{
|
||||||
return (
|
return (
|
||||||
<div key={k}>
|
<div key={k}>
|
||||||
<label htmlFor="">{store.m_Parameter.get(k)}:</label>
|
<label htmlFor="">{props.store.m_Parameter.get(k)}:</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
value={store.boardOption[k]}
|
value={props.store.boardOption[k]}
|
||||||
onChange={e =>
|
onChange={e =>
|
||||||
{
|
{
|
||||||
store.boardOption[k] = e.target.value;
|
props.store.boardOption[k] = e.target.value;
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</>
|
</div>
|
||||||
)
|
)))
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|||||||
Loading…
Reference in new issue