Bind add behavior function
This commit is contained in:
		
							parent
							
								
									d4cd06196f
								
							
						
					
					
						commit
						5ff6987a4b
					
				@ -5,7 +5,7 @@ div.behavior-popup {
 | 
			
		||||
	height: 100%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
span.behavior-popup-select-counter {
 | 
			
		||||
span.behavior-popup-select-counter, div.behavior-popup-no-data {
 | 
			
		||||
	opacity: .75;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -6,14 +6,14 @@ import { ConfirmContent } from "@Component/ConfirmPopup/ConfirmPopup";
 | 
			
		||||
import { BehaviorList } from "@Component/BehaviorList/BehaviorList";
 | 
			
		||||
import { AllBehaviorsWithCategory, ICategoryBehavior } from "@Behavior/Behavior";
 | 
			
		||||
import { Message } from "@Component/Message/Message";
 | 
			
		||||
import { IRenderBehavior } from "@Model/Behavior";
 | 
			
		||||
import { useStatus, IMixinStatusProps } from "@Context/Status";
 | 
			
		||||
import { IRenderBehavior, BehaviorRecorder } from "@Model/Behavior";
 | 
			
		||||
import { useStatus, IMixinStatusProps, randomColor } from "@Context/Status";
 | 
			
		||||
import { useSettingWithEvent, IMixinSettingProps } from "@Context/Setting";
 | 
			
		||||
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
 | 
			
		||||
import "./BehaviorPopup.scss";
 | 
			
		||||
 | 
			
		||||
interface IBehaviorPopupProps {
 | 
			
		||||
 | 
			
		||||
    onDismiss?: () => void;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
interface IBehaviorPopupState {
 | 
			
		||||
@ -21,7 +21,7 @@ interface IBehaviorPopupState {
 | 
			
		||||
	focusBehavior: Set<IRenderBehavior>;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
class BehaviorPopup extends Popup<IBehaviorPopupProps> {
 | 
			
		||||
class BehaviorPopup extends Popup {
 | 
			
		||||
 | 
			
		||||
	public minWidth: number = 400;
 | 
			
		||||
	public minHeight: number = 300;
 | 
			
		||||
@ -34,7 +34,9 @@ class BehaviorPopup extends Popup<IBehaviorPopupProps> {
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	public render(): ReactNode {
 | 
			
		||||
		return <BehaviorPopupComponent {...this.props}/>
 | 
			
		||||
		return <BehaviorPopupComponent onDismiss={() => {
 | 
			
		||||
            this.close();
 | 
			
		||||
        }}/>
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -125,25 +127,53 @@ class BehaviorPopupComponent extends Component<
 | 
			
		||||
        </Fragment>
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    private addSelectBehavior = () => {
 | 
			
		||||
        this.state.focusBehavior.forEach((recorder) => {
 | 
			
		||||
            if (this.props.status && recorder instanceof BehaviorRecorder) {
 | 
			
		||||
                let newBehavior = this.props.status.model.addBehavior(recorder);
 | 
			
		||||
 | 
			
		||||
                // 初始化名字
 | 
			
		||||
                newBehavior.name = recorder.getTerms(
 | 
			
		||||
                    recorder.behaviorName, this.props.setting?.language
 | 
			
		||||
                ) + " " + (recorder.nameIndex - 1).toString();
 | 
			
		||||
 | 
			
		||||
                // 赋予一个随机颜色
 | 
			
		||||
                let color = randomColor(true);
 | 
			
		||||
                newBehavior.color = `rgb(${color[0]},${color[1]},${color[2]})`;
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
        this.props.onDismiss ? this.props.onDismiss() : undefined;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
	public render(): ReactNode {
 | 
			
		||||
        let first: boolean = true;
 | 
			
		||||
        let behaviorNodes = AllBehaviorsWithCategory.map((behavior) => {
 | 
			
		||||
            let renderItem = this.renderBehaviors(behavior, first);
 | 
			
		||||
            if (renderItem) {
 | 
			
		||||
                first = false;
 | 
			
		||||
            }
 | 
			
		||||
            return renderItem;
 | 
			
		||||
        }).filter((x) => !!x);
 | 
			
		||||
 | 
			
		||||
		return <ConfirmContent
 | 
			
		||||
			className="behavior-popup"
 | 
			
		||||
			actions={[{
 | 
			
		||||
				i18nKey: "Popup.Add.Behavior.Action.Add",
 | 
			
		||||
				disable: this.state.focusBehavior.size <= 0
 | 
			
		||||
				disable: this.state.focusBehavior.size <= 0,
 | 
			
		||||
                onClick: this.addSelectBehavior
 | 
			
		||||
			}]}
 | 
			
		||||
			header={this.renderHeader}
 | 
			
		||||
			customFooter={this.renderActionBar}
 | 
			
		||||
			headerHeight={46}
 | 
			
		||||
		>
 | 
			
		||||
            {AllBehaviorsWithCategory.map((behavior) => {
 | 
			
		||||
                let renderItem = this.renderBehaviors(behavior, first);
 | 
			
		||||
                if (renderItem) {
 | 
			
		||||
                    first = false;
 | 
			
		||||
                }
 | 
			
		||||
                return renderItem;
 | 
			
		||||
            }).filter((x) => !!x)}
 | 
			
		||||
            {
 | 
			
		||||
                behaviorNodes.length ? behaviorNodes :
 | 
			
		||||
                <Message
 | 
			
		||||
                    className="behavior-popup-no-data"
 | 
			
		||||
                    i18nKey="Popup.Add.Behavior.Select.Nodata" first
 | 
			
		||||
                    options={{ name: this.state.searchValue }}
 | 
			
		||||
                />
 | 
			
		||||
            }
 | 
			
		||||
		</ConfirmContent>
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -40,6 +40,7 @@ interface IStatusEvent {
 | 
			
		||||
    labelAttrChange: void;
 | 
			
		||||
    groupAttrChange: void;
 | 
			
		||||
    individualChange: void;
 | 
			
		||||
    behaviorChange: void;
 | 
			
		||||
    popupChange: void;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -102,6 +103,7 @@ class Status extends Emitter<IStatusEvent> {
 | 
			
		||||
        // 对象变化事件
 | 
			
		||||
        this.model.on("objectChange", () => this.emit("objectChange"));
 | 
			
		||||
        this.model.on("labelChange", () => this.emit("labelChange"));
 | 
			
		||||
        this.model.on("behaviorChange", () => this.emit("behaviorChange"));
 | 
			
		||||
 | 
			
		||||
        // 弹窗事件
 | 
			
		||||
        this.popup.on("popupChange", () => this.emit("popupChange"));
 | 
			
		||||
@ -277,6 +279,6 @@ const useStatus = superConnect<Status>(StatusConsumer, "status");
 | 
			
		||||
const useStatusWithEvent = superConnectWithEvent<Status, IStatusEvent>(StatusConsumer, "status");
 | 
			
		||||
 | 
			
		||||
export {
 | 
			
		||||
    Status, StatusContext, useStatus, useStatusWithEvent,
 | 
			
		||||
    Status, StatusContext, useStatus, useStatusWithEvent, randomColor,
 | 
			
		||||
    IMixinStatusProps, StatusProvider, StatusConsumer
 | 
			
		||||
};
 | 
			
		||||
@ -55,6 +55,7 @@ const EN_US = {
 | 
			
		||||
    "Popup.Add.Behavior.Title": "Add behavior",
 | 
			
		||||
    "Popup.Add.Behavior.Action.Add": "Add all select behavior",
 | 
			
		||||
    "Popup.Add.Behavior.Select.Counter": "Selected {count} behavior",
 | 
			
		||||
    "Popup.Add.Behavior.Select.Nodata": "Could not find behavior named \"{name}\"",
 | 
			
		||||
    "Popup.Behavior.Info.Title": "Behavior details: {behavior}",
 | 
			
		||||
    "Popup.Behavior.Info.Confirm": "OK, I know it",
 | 
			
		||||
    "Build.In.Label.Name.All.Group": "All group",
 | 
			
		||||
 | 
			
		||||
@ -54,7 +54,8 @@ const ZH_CN = {
 | 
			
		||||
    "Popup.Setting.Title": "首选项设置",
 | 
			
		||||
    "Popup.Add.Behavior.Title": "添加行为",
 | 
			
		||||
    "Popup.Add.Behavior.Action.Add": "添加全部选中行为",
 | 
			
		||||
    "Popup.Add.Behavior.Select.Counter": "已选择 {count} 个行为",
 | 
			
		||||
    "Popup.Add.Behavior.Select.Counter": "找不到名为 \"{name}\" 的行为",
 | 
			
		||||
    "Popup.Add.Behavior.Select.Nodata": "Could not find behavior named \"{name}\"",
 | 
			
		||||
    "Popup.Behavior.Info.Title": "行为详情: {behavior}",
 | 
			
		||||
    "Popup.Behavior.Info.Confirm": "好的, 我知道了",
 | 
			
		||||
    "Build.In.Label.Name.All.Group": "全部群",
 | 
			
		||||
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user