!2453 新增:商品选择居中,增加品牌属性

Merge pull request !2453 from 林三/goods_brand
pull/2466/MERGE
林三 11 months ago committed by ChenX
parent 83f85fd816
commit d24ee34780

@ -56,11 +56,6 @@
margin: 10px;
}
.search-shop {
position: fixed;
transform: translate(-55%, 10%);
}
.roomName{
display: flex;

@ -5,7 +5,8 @@ import * as React from 'react';
import { CheckObjectType } from "../../Common/CheckoutVaildValue";
import { userConfig } from '../../Editor/UserConfig';
import { Input5Or4Component, Notes, SetBoardDataBlock } from "../../UI/Components/Board/BoardCommon";
import { GoodsList, IGoodInfo } from '../../UI/MaterialEditor/GoodsList';
import { IGoodInfo } from '../../UI/MaterialEditor/GoodsList';
import { GoodsListDiv } from "../../UI/MaterialEditor/GoodsListDiv";
import { SelectBrConfigName } from './R2BCommon';
import { GetOptionState } from './R2bConfigComponent';
import { Rec2BrStore } from './Rec2BrStore';
@ -45,7 +46,7 @@ export class R2BProcessComponent extends React.Component<IR2BProcessComponentPro
onClick={() => this.showShops.set(true)}
></button>
{
this.showShops.get() && <GoodsList
this.showShops.get() && <GoodsListDiv
open={this.showShops}
select={this.selectGoods}
/>

@ -5,7 +5,8 @@ import * as React from 'react';
import { EBoardKeyList } from '../../../Common/BoardKeyList';
import { CheckObjectType } from '../../../Common/CheckoutVaildValue';
import { safeEval } from '../../../Common/eval';
import { GoodsList, IGoodInfo } from '../../MaterialEditor/GoodsList';
import { IGoodInfo } from '../../MaterialEditor/GoodsList';
import { GoodsListDiv } from '../../MaterialEditor/GoodsListDiv';
import { DRILL_KEYS, ECompareType, IBoardFindOption } from '../../Store/BoardFindInterface';
import { BoardFindStore } from '../../Store/BoardFindModifyStore';
import { AnyObject, IUiOption } from "../../Store/OptionInterface/IOptionInterface";
@ -227,14 +228,14 @@ export class MatColorCom extends React.Component<IMatColorComProps>
</div>
</div>
<div className="flex">
<Button intent={Intent.PRIMARY} onClick={() => this.showShops.set(true)}></Button>
<Button intent={Intent.PRIMARY} onClick={() => this.showShops.set(true)}></Button>
<Button
intent={Intent.PRIMARY}
onClick={() => this.props.getBoardOption()}
></Button>
</div>
{
this.showShops.get() && <GoodsList
this.showShops.get() && <GoodsListDiv
open={this.showShops}
select={this.handleSelectGoods}
/>

@ -18,7 +18,8 @@ import { TemplateWineRackRecord } from '../../../DatabaseServices/Template/Progr
import { CommandWrap } from '../../../Editor/CommandMachine';
import { PromptStatus } from '../../../Editor/PromptResult';
import { TempEditor } from '../../../Editor/TempEditor';
import { GoodsList, IGoodInfo } from '../../MaterialEditor/GoodsList';
import { IGoodInfo } from '../../MaterialEditor/GoodsList';
import { GoodsListDiv } from '../../MaterialEditor/GoodsListDiv';
import { BoardProcessOption } from "../../Store/OptionInterface/BoardProcessOption";
import { IHightDrillOption, IUiOption } from "../../Store/OptionInterface/IOptionInterface";
import { RightPanelStore } from '../../Store/RightPanelStore/RightPanelStore';
@ -252,7 +253,7 @@ export class BoardProcessModal extends React.Component<BoardProcessProps, {}>{
onClick={() => this.showShops.set(true)}
></button>
{
this.showShops.get() && <GoodsList
this.showShops.get() && <GoodsListDiv
open={this.showShops}
select={this.selectGoods}
/>

@ -94,15 +94,6 @@
.mat-color {
position: relative;
.search-shop {
position: fixed;
transform: translate(-55%, -10%);
input {
width: 100%;
}
}
&>div:first-child {
&>div {
display: flex;

@ -254,29 +254,6 @@
input {
width: 6.5rem;
}
.search-shop {
position : fixed;
transform: translate(-45%, -6%);
input {
width: 100%;
}
th{
padding : auto;
text-align : center;
min-width : 55px;
vertical-align: middle;
.th_goods_thick{
display: flex;
align-items: center;
width : 44px;
margin: auto;
}
}
}
}
.br-mat>div>div:last-child {

@ -112,16 +112,5 @@
padding : 0;
text-align: center;
}
.search-shop {
position: absolute;
left : 0;
top : 0;
right : auto;
input {
width: 100%;
}
}
}
}

@ -75,6 +75,11 @@ export class ModalManage
{
return this._List.get(this._currentFocusKey);
}
set CurrentModalKey(key: string)
{
if (key !== this._currentFocusKey)
this._currentFocusKey = key;
}
get CurrentModalKey()
{
return this._currentFocusKey;

@ -1526,3 +1526,52 @@ img {
}
}
}
#GoodsListDiv{
.search-shop {
position : absolute;
z-index : 35;
padding : 10px;
font-size: 16px;
min-width: 1100px;
outline : 1px solid #ccc;
input {
width: 100%;
}
th{
padding : auto;
text-align : center;
min-width : 55px;
vertical-align: middle;
.th_goods_thick{
display: flex;
align-items: center;
width : 44px;
margin: auto;
}
}
.bp3-html-table.bp3-html-table-condensed td {
padding-top : 1.5px;
padding-bottom: 1.5px;
padding-right : 1.5px;
}
table {
margin-top: 5px;
width : 100%;
border : 1px #dbdcdd solid;
}
.bp3-input-action {
top: 3px !important;
right: 3px;
}
.pagination li {
padding-left: 11px;
}
}
}

@ -1,4 +1,4 @@
import { Card, HTMLTable, Icon, InputGroup } from '@blueprintjs/core';
import { Button, Card, HTMLTable, Icon, InputGroup } from '@blueprintjs/core';
import { IObservableValue, observable } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
@ -35,27 +35,38 @@ export class GoodsList extends React.Component<IGoodsListProps> {
{
this.handleSearch();
}
public render()
{
return (
this.props.open.get() &&
<>
<Card className="search-shop"
tabIndex={-1}
onKeyUp={this.handleKeyDown}
>
<InputGroup
placeholder="搜索要关联的商品"
value={this.searchStr}
onChange={this.handleChange}
autoFocus
rightElement={<Icon icon="double-caret-vertical" />} />
<div style={{ display: "flex" }}>
<div style={{ width: "96%" }}>
<InputGroup
placeholder="搜索要关联的商品"
value={this.searchStr}
onChange={this.handleChange}
autoFocus
rightElement={<Icon icon="double-caret-vertical" />}
/>
</div>
<Button
style={{ marginLeft: 15 }}
icon="cross"
onClick={this.handleHideSelect}
/>
</div>
<HTMLTable bordered={true} interactive={true} condensed={true} striped={false}
style={{ lineHeight: 0.7 }}
>
<thead>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th onClick={this.handleOrderGoods}
@ -99,12 +110,16 @@ export class GoodsList extends React.Component<IGoodsListProps> {
specification: goods_spec,
};
//品牌
let brand = v.goods_param.find(p => p.name === "品牌").value;
return <tr
key={v.goods_id}
onClick={() => this.props.select(info)}
style={{ lineHeight: "normal" }}
>
<td>{v.goods_sn}</td>
<td><OneLineText text={brand} /></td>
<td><OneLineText text={v.goods_name} /></td>
<td><OneLineText text={goods_spec} /></td>
<td>{thick ? thick.value : ""}</td>

@ -0,0 +1,86 @@
import { IObservableValue } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
import ReactDOM from 'react-dom';
import { begin } from 'xaop';
import { app } from '../../ApplicationServices/Application';
import { KeyBoard } from '../../Common/KeyEnum';
import { GoodsList, IGoodInfo } from './GoodsList';
const GOODS_LIST_DIV_ID = "GoodsListDiv";
interface IGoodsListProps
{
select: (good: IGoodInfo) => void;
open: IObservableValue<boolean>;
}
@observer
export class GoodsListDiv extends React.Component<IGoodsListProps> {
_Event: Function;
_StateContainer: HTMLElement;
_CurrentModalKey = "";
constructor(props)
{
super(props);
this._StateContainer = document.createElement('div');
this._StateContainer.id = GOODS_LIST_DIV_ID;
this._StateContainer.style.zIndex = "36";
document.getElementById('modal').appendChild(this._StateContainer);
this._StateContainer.style.position = "absolute";
if (window.screen.width <= 1100)
this._StateContainer.style.left = '0px';
else
this._StateContainer.style.left = `calc(50vw - 550px)`;
if (window.screen.height <= 620)
this._StateContainer.style.top = `0px`;
else
this._StateContainer.style.top = `calc(50vh - 300px)`;
ReactDOM.render(<GoodsList
open={this.props.open}
select={this.props.select}
/>, this._StateContainer);
}
componentDidMount()
{
this._CurrentModalKey = app.Editor.ModalManage.CurrentModalKey;
app.Editor.ModalManage.CurrentModalKey = GOODS_LIST_DIV_ID;
this._Event = begin(app.Editor.ModalManage, app.Editor.ModalManage.OnKeyDown, (e: KeyboardEvent) =>
{
if (e.keyCode === KeyBoard.Escape)
{
app.Editor.ModalManage.stopKeyDownEvent = true;
e.stopPropagation();
}
});
}
componentWillUnmount()
{
app.Editor.ModalManage.CurrentModalKey = this._CurrentModalKey;
document.getElementById('modal').removeChild(this._StateContainer);
this._StateContainer = undefined;
this._CurrentModalKey = "";
if (this._Event)
{
this._Event();
this._Event = null;
}
}
public render()
{
return (
<>
</>
);
}
}

@ -134,41 +134,4 @@
height : 22px;
}
}
.search-shop {
position: fixed;
transform: translate(-70%, 55%);
}
}
.search-shop {
z-index : 35;
padding : 10px;
font-size: 16px;
width : 1000px;
outline : 1px solid #ccc;
.bp3-html-table.bp3-html-table-condensed td {
padding-top : 1.5px;
padding-bottom: 1.5px;
padding-right : 1.5px;
}
table {
margin-top: 5px;
width : 100%;
border : 1px #dbdcdd solid;
}
input {
height: 2.5rem !important;
}
.bp3-input-action {
top: 5px !important;
}
.pagination li {
padding-left: 11px;
}
}
}

@ -2,11 +2,12 @@ import { Button, Intent } from "@blueprintjs/core";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import * as React from "react";
import { MaterialStore } from "../Store/MaterialStore";
import { GoodsList, IGoodInfo } from "./GoodsList";
import { SetBoardDataBlock } from "../Components/Board/BoardCommon";
import { CheckObjectType } from "../../Common/CheckoutVaildValue";
import { SetBoardDataBlock } from "../Components/Board/BoardCommon";
import { AppToaster } from "../Components/Toaster";
import { MaterialStore } from "../Store/MaterialStore";
import { IGoodInfo } from "./GoodsList";
import { GoodsListDiv } from "./GoodsListDiv";
@inject('store')
@observer
@ -35,7 +36,7 @@ export class MaterialLinkShopId extends React.Component<{ store?: MaterialStore;
AppToaster.show({
message: "如果你将这个材质赋予到板件,我们会把材质的板材信息拷贝到板件中",
timeout: 2500,
});
}, "MaterialShopSelect");
};
componentDidMount()
{
@ -64,7 +65,7 @@ export class MaterialLinkShopId extends React.Component<{ store?: MaterialStore;
/>
</div>
{
this.showShops.get() && <GoodsList
this.showShops.get() && <GoodsListDiv
open={this.showShops}
select={this.handleSelectGood}
/>

Loading…
Cancel
Save