Public
/
WebCAD
mirror of https://gitee.com/cf-fz/WebCAD.git
7
1
Fork 0
Code Issues Projects Releases Wiki Activity

!2034 优化:标签栏显示隐藏功能,位置记录

Browse Source
pull/2036/MERGE
黄诗津 2 years ago committed by ChenX
parent 8b7dc73c5b
commit f8ccb2df00
11 changed files with 184 additions and 53 deletions
Show Stats Download Patch File Download Diff File

2
src/Add-on/TemplateSearch.tsx
Unescape View File

@ -110,7 +110,7 @@ export class TemplateSearchDialog extends React.Component<{ url: string; }, {}>{
}
}
//这里单独写了一个自动切割读取和保存(模板管理,模板审核)配置,现将模板管理配置单独分离出来保存,(这里保存了整个option但只引用了roomName和useCabName两个配置?)
export async function ReadAutoCutConfig(key: string, autoCutOption: IDrawBoardAutoCutOption, option?: IGetRoomInfo)
{
let config: IDrawBoardAutoCutOption & IGetRoomInfo;

1
src/UI/Components/Board/BoardModalType.ts
Unescape View File

@ -58,4 +58,5 @@ export enum BoardModalType
BatchCurtail = "curtail", //批量内缩
BatchModifyPanel = "BatchModifyPanel", //批量修改板件
Sealing = "Sealing", //封边
TemplateManage = "TemplateManage",//模板管理界面信息
}

47
src/UI/Components/SourceManage/CommonPanel.tsx
Unescape View File

@ -12,9 +12,11 @@ import { DirectoryId, PostJson, RequestStatus } from '../../../Common/Request';
import { isNum } from '../../../Common/Utils';
import { IFileInfo } from '../../../DatabaseServices/FileServer';
import { EOrderType } from '../../../Editor/OrderType';
import { IDrawerDoorTempInfo } from '../../Store/DoorInterface';
import { userConfigStore } from '../../Store/UserConfigStore';
import { BoardModalType } from "../Board/BoardModalType";
import { AppConfirm } from '../Common/Confirm';
import { TemplateManageUiOption } from '../Template/TemplateComponent';
import { TemplateTag } from '../Template/TemplateTag';
import { AppToaster } from '../Toaster';
import { commonPanelStore, CommonPanelStore } from './CommonPanelStore';
@ -63,7 +65,8 @@ interface ICommonPanelProps
dirNameFilter?: string[];
loadCacheDirKey?: string;
currentTag?: ITempTagProps;
isTemplateTag?: boolean;
currentInfo?: IDrawerDoorTempInfo;
uiOption?: TemplateManageUiOption;
}
interface IDir
@ -254,6 +257,8 @@ export class CommonPanel extends React.Component<ICommonPanelProps, ICommonPanel
this.event.forEach(f => f());
this.event.length = 0;
userConfigStore.SaveConfig(BoardModalType.CommonPanelStore, commonPanelStore, { toaster: false }); //保存配置
}
render()
{
@ -327,7 +332,6 @@ export class CommonPanel extends React.Component<ICommonPanelProps, ICommonPanel
onChange={(e) =>
{
commonPanelStore.m_Option.orderType = e.target.value as EOrderType;
userConfigStore.SaveConfig(BoardModalType.CommonPanelStore, commonPanelStore, { toaster: false }); //保存排序
this.handleGetData();
}}
/>
@ -369,14 +373,20 @@ export class CommonPanel extends React.Component<ICommonPanelProps, ICommonPanel
</Navbar>
<Card>
<div
className='navigation-left'
ref={this.ColResizeEl}>
className="navigation-left"
style={{ width: this.props.uiOption?.navigationWidth ?? "25%" }}
ref={this.ColResizeEl}
>
{
this.props.isTemplateTag &&
<div className='com-tag'>
this.props.uiOption &&
<div
className='com-tag'
style={{ width: this.props.uiOption.showTag ? "50%" : "2px" }}
>
<TemplateTag
FindNode={this.FindNode}
currentTag={this.props.currentTag}
currentInfo={this.props.currentInfo}
/>
</div>
}
@ -400,13 +410,23 @@ export class CommonPanel extends React.Component<ICommonPanelProps, ICommonPanel
/>
</div>
{
//模板添加拽托条,改变目宽度大小
this.props.isTemplateTag &&
//模板添加拽托条,改变导航栏宽度大小
this.props.uiOption &&
<div
className='seekBar'
onPointerDown={(e) => { this.handleResize(e); }}
></div>
}
{
//展示隐藏标签栏按钮
this.props.uiOption &&
<Button
icon={this.props.uiOption.showTag ? "chevron-right" : "double-chevron-right"}
intent={Intent.PRIMARY}
className="tag-btn"
onClick={() => { this.props.uiOption.showTag = !this.props.uiOption.showTag; }}
/>
}
</div>
<div
className="bp3-card img-lib"
@ -482,6 +502,7 @@ export class CommonPanel extends React.Component<ICommonPanelProps, ICommonPanel
target.onmouseup = () =>
{
this.props.uiOption.navigationWidth = this.ColResizeEl.current.offsetWidth + "px";
target.releasePointerCapture(e.pointerId);
target.onmousemove = null;
target.onmouseup = null;
@ -539,13 +560,14 @@ export class CommonPanel extends React.Component<ICommonPanelProps, ICommonPanel
//查找标签对应的节点
FindNode = async (IDir: string) =>
{
//没有节点树就不查找
if (!IDir || !this.tree) return;
if (!IDir) return;
await new Promise(res =>
{
let num = 0;
let timer = setInterval(() =>
{
if (this.state.nodes.length > 0)
num++;
if (this.state.nodes.length > 0 || num >= 10)
{
clearInterval(timer);
res(true);
@ -553,6 +575,9 @@ export class CommonPanel extends React.Component<ICommonPanelProps, ICommonPanel
}, 20);
});
//没有节点树就不查找
if (!this.tree) return;
let hasNode = false;
const findNode = (nodes: ITreeNode<{}>): ITreeNode<{}>[] =>
{

4
src/UI/Components/SourceManage/CommonPanelStore.ts
Unescape View File

@ -1,4 +1,4 @@
import { toJS } from "mobx";
import { observable, toJS } from "mobx";
import { DefaultCommonPanelOption } from "../../../Editor/DefaultConfig";
import { CommonPanelConfigOption } from "../../Store/BoardInterface";
import { IConfigStore } from "../../Store/BoardStore";
@ -15,7 +15,7 @@ export class CommonPanelStore implements IConfigStore
return newConfig;
};
//板数据
m_Option: CommonPanelConfigOption = DefaultCommonPanelOption;
@observable m_Option: CommonPanelConfigOption = DefaultCommonPanelOption;
configsNames: string[] = [];
InitOption()
{

6
src/UI/Components/SourceManage/TexturePanel.less
Unescape View File

@ -84,6 +84,12 @@
padding: 0 3px;
height: 100%;
}
.tag-btn {
position: absolute;
right: 0;
bottom: 0;
}
}
.img-lib {

11
src/UI/Components/Template/Template.less
Unescape View File

@ -10,7 +10,7 @@
#commonModal .template,
#commonModal .template-select,
#modal .template-select{
#modal .template-select {
max-width: 1300px;
width: 90vw;
height: 850px;
@ -20,10 +20,13 @@
}
.bp3-dialog-footer {
justify-content: space-between;
height: 110px;
}
.flex-between {
justify-content: space-between;
}
.bp3-dialog-body > div:first-child {
min-width: 200px;
}
@ -440,7 +443,7 @@
#commonModal .template-select,
#template-select .template-select,
#modal .template-select{
#modal .template-select {
position: absolute;
z-index: 30;
@ -493,6 +496,6 @@
max-height: 70vh;
}
#template-select{
#template-select {
position: absolute;
}

80
src/UI/Components/Template/TemplateComponent.tsx
Unescape View File

@ -5,7 +5,6 @@ import * as React from 'react';
import { AutoCutting } from '../../../Add-on/BoardCutting/AutoCuttingReactor';
import { IsDoor, IsHandle, IsHinge } from '../../../Add-on/HideSelect/HideSelectUtils';
import { ITempTagProps, templateTagCommand } from '../../../Add-on/Template/TemplateTagCommand';
import { ReadAutoCutConfig, UploadAutoCutConfig } from '../../../Add-on/TemplateSearch';
import { R2bReplaceProps } from '../../../Add-on/twoD2threeD/R2bConfigComponent';
import { app } from '../../../ApplicationServices/Application';
import { EBoardKeyList } from '../../../Common/BoardKeyList';
@ -33,11 +32,12 @@ import { Box3Ext } from '../../../Geometry/Box';
import { ISpaceParse } from '../../../Geometry/SpaceParse/ISpaceParse';
import { Point2SpaceParse } from '../../../Geometry/SpaceParse/Point2SpaceParse';
import { PointSelectSpaceClamp } from '../../../Geometry/SpaceParse/PointSelectSpaceClamp';
import { BoardOpenDir, DrillType, IDrawBoardAutoCutOption } from '../../Store/BoardInterface';
import { BoardOpenDir, DrillType, IBaseOption, IDrawBoardAutoCutOption } from '../../Store/BoardInterface';
import { IDrawerDoorTempInfo } from '../../Store/DoorInterface';
import { kuGanStore } from '../../Store/KuGanStore';
import { ITemplateParam } from "../../Store/RightPanelStore/ITemplateParam";
import { TempalteEditorStore } from '../../Store/TemplateEditorStore';
import { tempalteManageStore } from '../../Store/TemplateManageStore';
import { AutoCutCheckbox } from '../Board/BoardCommon';
import { MenuItem } from '../ContextMenu/MenuItem';
import { ModalHeader } from '../Modal/ModalContainer';
@ -63,9 +63,21 @@ export interface ITemplateManage
type: "Administration" | "Collection"; //模板管理和收藏
}
export interface TemplateManageUiOption
{
navigationWidth: string,
showTag: boolean;
};
export interface ITemplateManageOption extends IBaseOption
{
option: IGetRoomInfo;
autoCutOption: IDrawBoardAutoCutOption;
uiOption: TemplateManageUiOption;
}
@observer
export class TemplateManage extends React.Component<ITemplateManage, {}> {
@observable private option: IGetRoomInfo = {
private option: IGetRoomInfo = {
roomName: "",
cabName: "",
originCabName: "",
@ -79,19 +91,27 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
useMaterial: false,
openDir: BoardOpenDir.None,
};
private autoCutOption: IDrawBoardAutoCutOption = { isAutoCut: false, isRelevance: false };
private uiOption = { navigationWidth: "25%", showTag: true };
@observable templateManageOption: ITemplateManageOption = {
version: 1,
option: this.option,
autoCutOption: this.autoCutOption,
uiOption: this.uiOption
};
private canCreateTemplate = observable.box(false);
@observable private currentProps: ITemplateParam[] = [];
@observable private currentTemplateInfo: IDrawerDoorTempInfo = { id: "", name: "", diy_logo: "" };
@observable private autoCutOption: IDrawBoardAutoCutOption = { isAutoCut: false, isRelevance: false };
private TemplateDrawHingeTool: TemplateDrawHingeTool;
commonPanel = React.createRef<CommonPanel>();
constructor(props)
{
super(props);
this.option.roomName = localStorage.getItem(StoreageKeys.RoomName) || "";
this.option.cabName = "标准柜";
this.option.originCabName = "标准柜";
this.templateManageOption.option.roomName = localStorage.getItem(StoreageKeys.RoomName) || "";
this.templateManageOption.option.cabName = "标准柜";
this.templateManageOption.option.originCabName = "标准柜";
}
private renderNav = () =>
{
@ -263,7 +283,7 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
app.Editor.ModalManage.ToggleShow();
app.Editor.MaskManage.Clear();
localStorage.setItem(StoreageKeys.RoomName, this.option.roomName);
localStorage.setItem(StoreageKeys.RoomName, this.templateManageOption.option.roomName);
await CommandWrap(async () =>
{
if (isByBasePt)
@ -271,10 +291,10 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
else
await this.handleInsertBySpace();
if (this.autoCutOption.isAutoCut)
await AutoCutting(this.autoCutOption.isRelevance);
if (this.templateManageOption.autoCutOption.isAutoCut)
await AutoCutting(this.templateManageOption.autoCutOption.isRelevance);
}, "插入模块");
this.option.cabName = this.option.originCabName + (++this.option.cabIndex);
this.templateManageOption.option.cabName = this.templateManageOption.option.originCabName + (++this.templateManageOption.option.cabIndex);
app.Editor.ModalManage.ToggleShow();
app.Editor.MaskManage.ShowMask();
// app.Editor.MaskManage.OnFocusEvent();
@ -287,14 +307,14 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
await template.UpdateTemplateTree();
await InsertTemplateByBasePoint(template, this.option);
await InsertTemplateByBasePoint(template, this.templateManageOption.option);
};
private SetRootCabName = (template: TemplateRecord, parse: ISpaceParse) =>
{
let nents = template.AllEntitys;
//设置房名和柜名
let [roomName, cabName] = [this.option.roomName, this.option.cabName];
let [roomName, cabName] = [this.templateManageOption.option.roomName, this.templateManageOption.option.cabName];
if (!parse.VisualSpaceBox && !(parse instanceof Point2SpaceParse))
{
@ -351,7 +371,7 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
template.WParam.expr = "";
template.HParam.expr = "";
await SetTemplatePositionAndSetParent(parse, template, true, this.option);
await SetTemplatePositionAndSetParent(parse, template, true, this.templateManageOption.option);
}
}
};
@ -512,14 +532,14 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
for (let en of (ens as Board[]))
{
let template = app.Database.WblockCloneObejcts([temp], app.Database.TemplateTable, new Map(), DuplicateRecordCloning.Ignore)[0] as TemplateRecord;
if (this.option.useMaterial)
if (this.templateManageOption.option.useMaterial)
{
this.option.material = en.BoardProcessOption.material;
this.option.color = en.BoardProcessOption.color;
this.option.brMat = en.BoardProcessOption.boardName;
this.templateManageOption.option.material = en.BoardProcessOption.material;
this.templateManageOption.option.color = en.BoardProcessOption.color;
this.templateManageOption.option.brMat = en.BoardProcessOption.boardName;
}
this.option.openDir = en.OpenDir;
followAttribute(this.option, template); //板名、柜名、房名跟随
this.templateManageOption.option.openDir = en.OpenDir;
followAttribute(this.templateManageOption.option, template); //板名、柜名、房名跟随
en.IsChaiDan = false;
en.BoardProcessOption.drillType = DrillType.None; //使替换的模块不排钻
let pos = new PositioningBoardSpace();
@ -582,7 +602,7 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
intent: Intent.SUCCESS
}, "替换空间");
}
await ReplaceTemplate(oldTemp, template, isKeepChildren, true, this.option);
await ReplaceTemplate(oldTemp, template, isKeepChildren, true, this.templateManageOption.option);
//应用用户输入的参数
for (let index = 0; index < this.currentProps.length; index++)
@ -788,7 +808,7 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
return <TemplateCollection
currentProps={this.currentProps}
currentTemplateInfo={this.currentTemplateInfo}
cabOption={this.option}
cabOption={this.templateManageOption.option}
insert={this.handleInsert}
/>;
};
@ -805,7 +825,8 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
deleteUrl={TemplateUrls.delete}
maxDirLength={2}
currentTag={this.props.currentTag}
isTemplateTag={true}
currentInfo={this.currentTemplateInfo}
uiOption={this.templateManageOption.uiOption}
clickTree={() =>
{
this.currentTemplateInfo.id = "";
@ -817,7 +838,7 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
currentProps={this.currentProps}
currentInfo={this.currentTemplateInfo}
editor={this.handleEditor}
cabOption={this.option}
cabOption={this.templateManageOption.option}
insert={this.handleInsert}
isShowDetail={true}
/>
@ -864,13 +885,14 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
};
componentDidMount()
{
ReadAutoCutConfig(TemplateManage.name, this.autoCutOption, this.option);
//分离配置实现,但保持原来的实现方式(通过传参修改),这里的option引用太多了本来只需要保存roomName和useCabName,但他已经把option所有配置都保存了,没办法
tempalteManageStore.UpdateOption(this.templateManageOption);
document.addEventListener('keyup', this.handleHotKey);
}
componentWillUnmount()
{
templateTagCommand.UploadTagList();
UploadAutoCutConfig(TemplateManage.name, this.autoCutOption, this.option);
tempalteManageStore.SaveConfig(this.templateManageOption); //保存模板管理配置
document.removeEventListener('keyup', this.handleHotKey);
}
public render()
@ -891,15 +913,15 @@ export class TemplateManage extends React.Component<ITemplateManage, {}> {
this.renderBody()
}
</div>
<div className={Classes.DIALOG_FOOTER} >
<div className={Classes.DIALOG_FOOTER + ` ${!this.props.R2bReplace && "flex-between"}`} >
{
!this.props.R2bReplace ?
<>
<GetRoomCabName
option={this.option}
option={this.templateManageOption.option}
needBoardName
/>
<AutoCutCheckbox isFlex={false} autoCutOption={this.autoCutOption} />
<AutoCutCheckbox isFlex={false} autoCutOption={this.templateManageOption.autoCutOption} />
<div className={Classes.DIALOG_FOOTER_ACTIONS}>
{
<Button

4
src/UI/Components/Template/TemplateDetail.tsx
Unescape View File

@ -162,8 +162,8 @@ export class TemplateDetail extends React.Component<ITemplateDetailProps> {
<input
type="text"
className={Classes.INPUT}
value={this.props.currentInfo.tagName}
onChange={e => this.props.currentInfo.tagName = e.target.value}
value={this.props.currentInfo.tagName.toUpperCase()}
onChange={e => { this.props.currentInfo.tagName = e.target.value; }}
disabled={!!this.props.currentInfo?.id}
/>
<Button text="附加到标签" intent={Intent.SUCCESS} onClick={this.addTag} />

11
src/UI/Components/Template/TemplateTag.tsx
Unescape View File

@ -1,16 +1,18 @@
import { ContextMenu, Icon, Intent, Menu, MenuItem } from '@blueprintjs/core';
import { observable } from 'mobx';
import { action, observable } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
import { end } from 'xaop';
import { ITempTagProps, templateTagCommand } from '../../../Add-on/Template/TemplateTagCommand';
import { MouseKey } from '../../../Common/KeyEnum';
import { IDrawerDoorTempInfo } from '../../Store/DoorInterface';
import { HandleDirComponent } from '../SourceManage/HandleDirComponent';
export interface ITemplateTagComProps
{
currentTag: ITempTagProps;
FindNode: (IDir: string) => Promise<void>;
currentInfo?: IDrawerDoorTempInfo;
}
@observer
@ -41,7 +43,7 @@ export class TemplateTag extends React.Component<ITemplateTagComProps> {
}
public render()
{
this.currentTag;
let dirId = this.currentTag.dirId; //当标签数为0时无法观察到currentTag属性
return (
<>
<ul className="tag-name-list">
@ -50,7 +52,7 @@ export class TemplateTag extends React.Component<ITemplateTagComProps> {
{
return (
<li
className={tag.dirId === this.currentTag?.dirId ? "active" : ""}
className={tag.dirId === dirId ? "active" : ""}
data-id={tag.tagName}
onMouseDown={this.selectTemplateTag}
key={tag.tagName}
@ -74,6 +76,7 @@ export class TemplateTag extends React.Component<ITemplateTagComProps> {
);
}
@action
private selectTemplateTag = async (e: React.MouseEvent<HTMLLIElement>) =>
{
if (e.button === MouseKey.Right)
@ -133,6 +136,7 @@ export class TemplateTag extends React.Component<ITemplateTagComProps> {
templateTagCommand.RemoveTag(tagName);
}
};
@action
private addTagDesc = (val: string) =>
{
if (this.isDesc)
@ -146,6 +150,7 @@ export class TemplateTag extends React.Component<ITemplateTagComProps> {
{
templateTagCommand.ModifyTagName(this.currentTag.tagName, val.toUpperCase());
this.currentTag.tagName = val.toUpperCase();
this.props.currentInfo.tagName = this.currentTag.tagName;
}
}
this.canInput.set(false);

22
src/UI/Store/BoardInterface.ts
Unescape View File

@ -481,11 +481,31 @@ export interface IKnifeProps
angle: number;
}
export interface CommonPanelConfigOption
export interface CommonPanelConfigOption extends IBaseOption
{
orderType: string;
}
export interface TemplateManageOption extends IBaseOption
{
isAutoCut: boolean,
isRelevance: boolean;
roomName: string;
cabName: string;
useCabName: boolean;
cabIndex?: number;
originCabName: string;
boardName?: string;
useBoardName?: boolean;
material?: string;
color?: string;
brMat?: string;
useMaterial?: boolean;
openDir?: BoardOpenDir | string;
navigationWidth: string;
showTag: boolean;
}
export interface IAutoDimBrsOption extends IBaseOption
{
total: boolean;//整体标注

49
src/UI/Store/TemplateManageStore.ts
Unescape View File

@ -0,0 +1,49 @@
import { toJS } from "mobx";
import { appCache } from "../../Common/AppCache";
import { ConfigUrls } from "../../Common/HostUrl";
import { PostJson, RequestStatus } from "../../Common/Request";
import { Singleton } from "../../Common/Singleton";
import { GetIndexDBID } from "../../Common/Utils";
import { IndexedDbStore, StoreName } from "../../IndexedDb/IndexedDbStore";
import { BoardModalType } from "../Components/Board/BoardModalType";
import { ITemplateManageOption } from "../Components/Template/TemplateComponent";
import { TemplateManageOption } from "./BoardInterface";
import { userConfigStore } from "./UserConfigStore";
export class TempalteManageStore extends Singleton
{
//保持之前更新配置的状态
async UpdateOption(m_Option: ITemplateManageOption)
{
let cof = await userConfigStore.GetAllConfigs(BoardModalType.TemplateManage) as TemplateManageOption;
if (cof)
{
m_Option.autoCutOption = { isAutoCut: cof.isAutoCut, isRelevance: cof.isRelevance };
m_Option.option.roomName = cof.roomName;
m_Option.option.useCabName = cof.useCabName;
if (cof.version === 1)
{
m_Option.uiOption = { navigationWidth: cof.navigationWidth, showTag: cof.showTag };
}
}
}
async SaveConfig(m_Option: ITemplateManageOption)
{
//由于之前保存的数据就是展开的,所以这里也只能跟着展开保存
let opt = { version: m_Option.version, ...m_Option.option, ...m_Option.autoCutOption, ...m_Option.uiOption } as TemplateManageOption;
let newConfig: TemplateManageOption = toJS(opt);
let data = await PostJson(ConfigUrls.Edit, { key: BoardModalType.TemplateManage, value: JSON.stringify(newConfig) });
if (data.err_code === RequestStatus.Ok)
{
let dbStore = await IndexedDbStore.CADStore();
dbStore.Put(StoreName.ConfigData, GetIndexDBID(BoardModalType.TemplateManage), newConfig);
dbStore.Put(StoreName.ConfigVersion, GetIndexDBID(BoardModalType.TemplateManage), data.version);
appCache.set(BoardModalType.TemplateManage, newConfig);
}
};
}
export const tempalteManageStore = TempalteManageStore.GetInstance() as TempalteManageStore;
Write Preview
Loading…
Cancel
Save