refactor(流量池): 优化批量加入分组弹窗组件并清理无用代码
将Modal组件替换为Popup组件以改善移动端用户体验,移除调试日志和未使用的类型导入
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Modal, Selector } from "antd-mobile";
|
import { Popup, Selector } from "antd-mobile";
|
||||||
import type { PackageOption } from "./data";
|
import type { PackageOption } from "./data";
|
||||||
|
|
||||||
interface BatchAddModalProps {
|
interface BatchAddModalProps {
|
||||||
@@ -21,14 +21,24 @@ const BatchAddModal: React.FC<BatchAddModalProps> = ({
|
|||||||
selectedCount,
|
selectedCount,
|
||||||
onConfirm,
|
onConfirm,
|
||||||
}) => (
|
}) => (
|
||||||
<Modal
|
// <Modal visible={visible} title="批量加入分组" onConfirm={onConfirm}>
|
||||||
|
// <div style={{ marginBottom: 12 }}>
|
||||||
|
// <div>选择目标分组</div>
|
||||||
|
// <Selector
|
||||||
|
// options={packageOptions.map(p => ({ label: p.name, value: p.id }))}
|
||||||
|
// value={[batchTarget]}
|
||||||
|
// onChange={v => setBatchTarget(v[0])}
|
||||||
|
// />
|
||||||
|
// </div>
|
||||||
|
// <div style={{ color: "#888", fontSize: 13 }}>
|
||||||
|
// 将选中的{selectedCount}个用户加入所选分组
|
||||||
|
// </div>
|
||||||
|
// </Modal>
|
||||||
|
<Popup
|
||||||
visible={visible}
|
visible={visible}
|
||||||
title="批量加入分组"
|
onMaskClick={() => onClose()}
|
||||||
onClose={onClose}
|
position="bottom"
|
||||||
footer={[
|
bodyStyle={{ height: "80vh" }}
|
||||||
{ text: "取消", onClick: onClose },
|
|
||||||
{ text: "确定", onClick: onConfirm },
|
|
||||||
]}
|
|
||||||
>
|
>
|
||||||
<div style={{ marginBottom: 12 }}>
|
<div style={{ marginBottom: 12 }}>
|
||||||
<div>选择目标分组</div>
|
<div>选择目标分组</div>
|
||||||
@@ -41,7 +51,7 @@ const BatchAddModal: React.FC<BatchAddModalProps> = ({
|
|||||||
<div style={{ color: "#888", fontSize: 13 }}>
|
<div style={{ color: "#888", fontSize: 13 }}>
|
||||||
将选中的{selectedCount}个用户加入所选分组
|
将选中的{selectedCount}个用户加入所选分组
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Popup>
|
||||||
);
|
);
|
||||||
|
|
||||||
export default BatchAddModal;
|
export default BatchAddModal;
|
||||||
|
|||||||
@@ -4,14 +4,7 @@ import {
|
|||||||
fetchPackageOptions,
|
fetchPackageOptions,
|
||||||
fetchScenarioOptions,
|
fetchScenarioOptions,
|
||||||
} from "./api";
|
} from "./api";
|
||||||
import type {
|
import type { TrafficPoolUser, PackageOption, ScenarioOption } from "./data";
|
||||||
TrafficPoolUser,
|
|
||||||
DeviceOption,
|
|
||||||
PackageOption,
|
|
||||||
ValueLevel,
|
|
||||||
UserStatus,
|
|
||||||
ScenarioOption,
|
|
||||||
} from "./data";
|
|
||||||
import { Toast } from "antd-mobile";
|
import { Toast } from "antd-mobile";
|
||||||
|
|
||||||
export function useTrafficPoolListLogic() {
|
export function useTrafficPoolListLogic() {
|
||||||
@@ -79,8 +72,6 @@ export function useTrafficPoolListLogic() {
|
|||||||
// 获取筛选项
|
// 获取筛选项
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
fetchPackageOptions().then(res => {
|
fetchPackageOptions().then(res => {
|
||||||
console.log("packageOptions", res);
|
|
||||||
|
|
||||||
setPackageOptions(res.list || []);
|
setPackageOptions(res.list || []);
|
||||||
});
|
});
|
||||||
fetchScenarioOptions().then(res => {
|
fetchScenarioOptions().then(res => {
|
||||||
|
|||||||
Reference in New Issue
Block a user