MrKBear/living-together
2
2
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Show confim popup when delete objects

Browse Source
This commit is contained in:
MrKBear
2022-03-24 17:23:01 +08:00
parent 1f4c6feafa
commit 50f1cb0562
14 changed files with 129 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
source/Panel/GroupDetails/GroupDetails.tsx
+14 -4
View File
@@ -10,6 +10,7 @@ import { Group, GenMod } from "@Model/Group";
import { AllI18nKeys } from "@Component/Localization/Localization";
import { ComboInput, IDisplayItem } from "@Component/ComboInput/ComboInput";
import { ObjectPicker } from "@Component/ObjectPicker/ObjectPicker";
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
import "./GroupDetails.scss";
interface IGroupDetailsProps {}
@@ -88,12 +89,21 @@ class GroupDetails extends Component<IGroupDetailsProps & IMixinStatusProps> {
/>
<TogglesInput
keyI18n="Common.Attr.Key.Delete"
keyI18n="Common.Attr.Key.Delete" red
onIconName="delete" offIconName="delete"
valueChange={() => {
if (this.props.status) {
this.props.status.model.deleteObject([group]);
this.props.status.setFocusObject(new Set());
const status = this.props.status;
status.popup.showPopup(ConfirmPopup, {
infoI18n: "Popup.Delete.Objects.Confirm",
titleI18N: "Popup.Action.Objects.Confirm.Title",
yesI18n: "Popup.Action.Objects.Confirm.Delete",
red: "yes",
yes: () => {
status.model.deleteObject([group]);
status.setFocusObject(new Set());
}
})
}
}}
/>
@@ -147,7 +157,7 @@ class GroupDetails extends Component<IGroupDetailsProps & IMixinStatusProps> {
/>
<TogglesInput
keyI18n="Common.Attr.Key.Generation"
keyI18n="Common.Attr.Key.Kill.Random"
onIconName="RemoveFilter" offIconName="RemoveFilter"
valueChange={() => {
group.killIndividuals()
source/Panel/LabelDetails/LabelDetails.tsx
+15 -3
View File
@@ -5,6 +5,7 @@ import { Message } from "@Component/Message/Message";
import { ColorInput } from "@Component/ColorInput/ColorInput";
import { Label } from "@Model/Label";
import { TogglesInput } from "@Component/TogglesInput/TogglesInput";
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
import "./LabelDetails.scss";
@useStatusWithEvent("focusLabelChange", "labelAttrChange", "labelChange")
@@ -27,10 +28,21 @@ class LabelDetails extends Component<IMixinStatusProps> {
}
}}/>
<TogglesInput keyI18n="Common.Attr.Key.Delete" onIconName="delete" offIconName="delete" valueChange={() => {
<TogglesInput
keyI18n="Common.Attr.Key.Delete" onIconName="delete" red
offIconName="delete" valueChange={() => {
if (this.props.status) {
this.props.status.model.deleteLabel(label);
this.props.status.setLabelObject();
const status = this.props.status;
status.popup.showPopup(ConfirmPopup, {
infoI18n: "Popup.Delete.Objects.Confirm",
titleI18N: "Popup.Action.Objects.Confirm.Title",
yesI18n: "Popup.Action.Objects.Confirm.Delete",
red: "yes",
yes: () => {
status.model.deleteLabel(label);
status.setLabelObject();
}
})
}
}}/>
source/Panel/LabelList/LabelList.tsx
+12 -2
View File
@@ -4,6 +4,7 @@ import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
import { useSetting, IMixinSettingProps } from "@Context/Setting";
import { Label } from "@Model/Label";
import { Message } from "@Component/Message/Message";
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
import "./LabelList.scss";
interface ILabelListProps {
@@ -47,8 +48,17 @@ class LabelList extends Component<ILabelListProps & IMixinStatusProps & IMixinSe
}}
deleteLabel={(label) => {
if (this.props.status) {
this.props.status.model.deleteLabel(label);
this.props.status.setLabelObject();
const status = this.props.status;
status.popup.showPopup(ConfirmPopup, {
infoI18n: "Popup.Delete.Objects.Confirm",
titleI18N: "Popup.Action.Objects.Confirm.Title",
yesI18n: "Popup.Action.Objects.Confirm.Delete",
red: "yes",
yes: () => {
status.model.deleteLabel(label);
status.setLabelObject();
}
})
}
this.labelInnerClick = true;
}}
source/Panel/ObjectList/ObjectCommand.tsx
+17 -7
View File
@@ -1,5 +1,6 @@
import { BackgroundLevel, FontLevel, Theme } from "@Component/Theme/Theme";
import { useStatus, IMixinStatusProps } from "../../Context/Status";
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
import { Icon } from "@fluentui/react";
import { Component, ReactNode } from "react";
import { ObjectID } from "@Model/Renderer";
@@ -54,15 +55,24 @@ class ObjectCommand extends Component<IMixinStatusProps> {
<Icon iconName="CubeShape"></Icon>
</div>
<div
className="command-item"
className="command-item red"
onClick={() => {
if (this.props.status) {
let deleteId: ObjectID[] = [];
this.props.status.focusObject.forEach((obj) => {
deleteId.push(obj);
if (this.props.status && this.props.status.focusObject.size > 0) {
const status = this.props.status;
status.popup.showPopup(ConfirmPopup, {
infoI18n: "Popup.Delete.Objects.Confirm",
titleI18N: "Popup.Action.Objects.Confirm.Title",
yesI18n: "Popup.Action.Objects.Confirm.Delete",
red: "yes",
yes: () => {
let deleteId: ObjectID[] = [];
status.focusObject.forEach((obj) => {
deleteId.push(obj);
})
status.model.deleteObject(deleteId);
status.setFocusObject(new Set<ObjectID>());
}
})
this.props.status.model.deleteObject(deleteId);
this.props.status.setFocusObject(new Set<ObjectID>());
}
}}
>
source/Panel/ObjectList/ObjectList.scss
+4
View File
@@ -59,6 +59,10 @@ div.object-list-command-bar {
user-select: none;
cursor: pointer;
}
div.command-item.red:hover {
color: $lt-red;
}
}
div.dark.object-list-command-bar {
source/Panel/RangeDetails/RangeDetails.tsx
+14 -5
View File
@@ -1,13 +1,13 @@
import { Component, ReactNode } from "react";
import { AttrInput } from "@Component/AttrInput/AttrInput";
import { useStatusWithEvent, IMixinStatusProps, Status } from "@Context/Status";
import { AllI18nKeys } from "@Component/Localization/Localization";
import { Message } from "@Component/Message/Message";
import { Range } from "@Model/Range";
import { ObjectID } from "@Model/Renderer";
import { ColorInput } from "@Component/ColorInput/ColorInput";
import { TogglesInput } from "@Component/TogglesInput/TogglesInput";
import { LabelPicker } from "@Component/LabelPicker/LabelPicker";
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
import "./RangeDetails.scss";
@useStatusWithEvent("rangeAttrChange", "focusObjectChange", "rangeLabelChange")
@@ -53,12 +53,21 @@ class RangeDetails extends Component<IMixinStatusProps> {
/>
<TogglesInput
keyI18n="Common.Attr.Key.Delete"
keyI18n="Common.Attr.Key.Delete" red
onIconName="delete" offIconName="delete"
valueChange={() => {
if (this.props.status) {
this.props.status.model.deleteObject([range]);
this.props.status.setFocusObject(new Set());
if (this.props.status) {
const status = this.props.status;
status.popup.showPopup(ConfirmPopup, {
infoI18n: "Popup.Delete.Objects.Confirm",
titleI18N: "Popup.Action.Objects.Confirm.Title",
yesI18n: "Popup.Action.Objects.Confirm.Delete",
red: "yes",
yes: () => {
status.model.deleteObject([range]);
status.setFocusObject(new Set());
}
})
}
}}
/>