fix

src/pages/MiniApp/BookManage/Long/index.tsx

@@ -2,13 +2,13 @@ import { ActionType, BetaSchemaForm, PageContainer, ProFormInstance, ProTable }
 import { columns } from "./tableConfig"
 import { useAjax } from "@/Hook/useAjax"
 import { useModel } from "@umijs/max"
-import { longBookInfoList, longBookInfoChapterContent, longBookInfoBookConfig, longBookInfoConfig, longBookInfoChapterAllList, sysRechargeGetInfo, sysRechargeAddOrEdit } from "@/services/miniApp/bookManage"
+import { longBookInfoList, longBookInfoChapterContent, longBookInfoBookConfig, longBookInfoConfig, longBookInfoChapterAllList, sysRechargeGetInfo, sysRechargeAddOrEdit, longBookInfoShelve } from "@/services/miniApp/bookManage"
 import { useCallback, useEffect, useMemo, useRef, useState } from "react"
-import { Drawer, message, Space, Tag } from "antd"
+import { Button, Drawer, message, Popconfirm, Space, Tag } from "antd"
 import ReadText from "../components/readText"
 import formConfig from "./formConfig"
 import ReadBook from "../components/readBook"
-import { EditFilled } from "@ant-design/icons"
+import { ColumnHeightOutlined, EditFilled } from "@ant-design/icons"
 const wordCountRanges: any = {
     "": { start: null, end: null }, // 全部
     "0-2": { start: 0, end: 2 * 10000 },
@@ -46,6 +46,7 @@ const Page: React.FC = (props: Props) => {
     let [isGlobalConfig, setIsGlobalConfig] = useState(false)//
     let [workDirection, setWorkDirection] = useState<any>(null)
     const [openBook, setOpneBook] = useState<any>(null)//阅读小说
+    const [editSelectedRow, setEditSelectedRow] = useState<any[]>([]); //小说列表选择
     let getList = useAjax((params) => longBookInfoList(params), { type: 'table' })//获取书列表
     let getChapterContent = useAjax((params) => longBookInfoChapterContent(params))//获取章节内容信息
     let getChapterAllList = useAjax((params) => longBookInfoChapterAllList(params))//获取全部章节
@@ -53,6 +54,7 @@ const Page: React.FC = (props: Props) => {
     let configInfo = useAjax((params) => longBookInfoConfig(params))//获取配置信息
     let globaleConfig = useAjax((params) => sysRechargeGetInfo(params))//获取全局配置信息
     let globaleAddOrEdit = useAjax((params) => sysRechargeAddOrEdit(params))//全局配置信息修改
+    let LongBookInfoShelve = useAjax((params) => longBookInfoShelve(params))//长篇小说批量上下架
     const formRef = useRef<ProFormInstance>();
     const actionRef = useRef<ActionType>();
     // 获取标签和分类
@@ -151,6 +153,16 @@ const Page: React.FC = (props: Props) => {
             })
         }
     }
+    // 批量上下架
+    const shelveAll = (ids: any[], shelve: 0 | 1) => {
+        LongBookInfoShelve.run({ ...publicData, ids, shelve }).then((res) => {
+            if (res.code === 200) {
+                actionRef?.current?.reload();
+                message.success('批量' + (shelve === 0 ? '上架成功' : '下架成功'));
+                setEditSelectedRow([])
+            }
+        });
+    };
     return <PageContainer title={false}
         tabProps={{ type: 'card' }}
     >
@@ -160,26 +172,48 @@ const Page: React.FC = (props: Props) => {
             headerTitle={"小说列表"}
             rowKey={(r) => r.bookId}
             scroll={{ x: true, y: 500 }}
-            tableAlertRender={!!props?.onChange ? false : () => {
+            tableAlertRender={!!props?.onChange ? false : ({ selectedRowKeys, selectedRows }) => {
                 let { paymentType, paymentOption, paymentCategory, paymentAmount, paymentCoin, beginPayNo } = globaleConfig?.data?.data || {}
                 let enumList: any = state?.enumList
                 let PAYMENT_TYPE_Map: Map<any, any> = new Map(enumList?.PAYMENT_TYPE?.values?.map(({ value, description }: any) => [value, description]))
                 let PAYMENT_OPTION_Map: Map<any, any> = new Map(enumList?.PAYMENT_OPTION?.values?.map(({ value, description }: any) => [value, description]))
-                return <Tag bordered={false} style={{ cursor: 'pointer' }} onClick={closeGlobalForm}>
-                    <Space>
-                        <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_TYPE_Map?.get(paymentType)}</span></Tag>
-                        <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费起始段落/章节：<span style={{ color: "#f64747" }}>{beginPayNo}</span></Tag>
-                        {paymentType === 2 && <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>段落/章节收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_OPTION_Map?.get(paymentOption)}</span></Tag>}
-                        <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费价格：
-                            <span style={{ color: "#f64747" }}>{paymentCategory === 0 && '￥'}{paymentCategory === 0 ? paymentAmount : paymentCoin}</span>
-                            {paymentCategory === 1 && '书币'}</Tag>
-                    </Space>
-                    <EditFilled />
-                </Tag>
-            }}
-            search={{
-                labelWidth: 90,
-                searchGutter: [10, 15],
+                return <div>
+                    <div>
+                        <Tag bordered={false} style={{ cursor: 'pointer' }} onClick={closeGlobalForm}>
+                            <Space>
+                                <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_TYPE_Map?.get(paymentType)}</span></Tag>
+                                <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费起始段落/章节：<span style={{ color: "#f64747" }}>{beginPayNo}</span></Tag>
+                                {paymentType === 2 && <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>段落/章节收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_OPTION_Map?.get(paymentOption)}</span></Tag>}
+                                <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费价格：
+                                    <span style={{ color: "#f64747" }}>{paymentCategory === 0 && '￥'}{paymentCategory === 0 ? paymentAmount : paymentCoin}</span>
+                                    {paymentCategory === 1 && '书币'}</Tag>
+                            </Space>
+                            <EditFilled />
+                        </Tag>
+                    </div>
+                    <div>
+                        {
+                            selectedRows?.length > 0 && <Space size={0} style={{ marginTop: 10 }}>
+                                <span style={{ width: 90, display: 'inline-block' }}>
+                                    已选{selectedRowKeys.length} 项
+                                </span>
+                                <span style={{ color: 'red' }}>
+                                    {selectedRows
+                                        ?.map((item: { shortBookInfoVO?: any, longBookInfo?: any, bookId: any }) => <Tag
+                                            closable
+                                            key={item?.bookId}
+                                            color="red"
+                                            onClose={() => {
+                                                let newArr = selectedRows?.filter((i) => i?.bookId != item?.bookId)
+                                                setEditSelectedRow(newArr)
+                                            }}>{item?.shortBookInfoVO?.bookName || item?.longBookInfo?.bookName}</Tag>)
+                                    }
+                                </span>
+                            </Space>
+                        }
+                    </div>
+                </div>
+
             }}
             //多选
             rowSelection={!!props?.onChange ? {
@@ -192,10 +226,56 @@ const Page: React.FC = (props: Props) => {
                 },
             } : {
                 alwaysShowAlert: true,//总是展示 alert，默认无选择不展示
-                hideSelectAll: true,// 隐藏全选框
-                renderCell: () => null,  // 隐藏选择列中的勾选框
-                columnTitle: '',  // 去掉选择列的表头
-                columnWidth: 0,  // 设置选择列宽度为 0
+                selectedRowKeys: editSelectedRow?.map((item: { bookId: any }) => item.bookId),
+                onSelect: (record, selected) => {
+                    if (selected) {
+                        setEditSelectedRow([...editSelectedRow, record]);
+                    } else {
+                        setEditSelectedRow(
+                            editSelectedRow?.filter((item: { bookId: any }) => item.bookId !== record.bookId),
+                        );
+                    }
+                },
+                onSelectAll: (selected, rows, changeRows) => {
+                    if (selected) {
+                        setEditSelectedRow([...editSelectedRow, ...changeRows]);
+                    } else {
+                        let newArr = editSelectedRow?.filter((item: { bookId: any }) =>
+                            changeRows.every((i) => i?.bookId !== item?.bookId),
+                        );
+                        setEditSelectedRow(newArr);
+                    }
+                },
+            }}
+            // 多选后的按钮操作
+            tableAlertOptionRender={!!props?.onChange ? false : ({ selectedRowKeys }) => {
+                return (
+                    <Space>
+                        <Popconfirm
+                            title={null}
+                            icon={null}
+                            onConfirm={() => {
+                                shelveAll(
+                                    editSelectedRow?.map((item) => item.bookId),
+                                    0,
+                                );
+                            }}
+                            onCancel={() => {
+                                shelveAll(
+                                    editSelectedRow?.map((item) => item.bookId),
+                                    1,
+                                );
+                            }}
+                            okText="全部上架"
+                            cancelText="全部下架"
+                        >
+                            <Button type="primary" disabled={selectedRowKeys.length === 0}>
+                                <ColumnHeightOutlined />
+                                批量上下架
+                            </Button>
+                        </Popconfirm>
+                    </Space>
+                );
             }}
             // 点击行
             onRow={(record) => ({
@@ -204,6 +284,10 @@ const Page: React.FC = (props: Props) => {
                     props?.closeDrawer?.(false)
                 }
             })}
+            search={{
+                labelWidth: 90,
+                searchGutter: [10, 15],
+            }}
             loading={getChapterAllList?.loading || configInfo?.loading || getList.loading}
             // ghost={true}//去除表格的背景一些配置改变ui
             beforeSearchSubmit={(params) => {//处理搜索数据
@@ -222,7 +306,6 @@ const Page: React.FC = (props: Props) => {
                 }, {});
                 return newParams
             }}
-            tableAlertOptionRender={false}
             request={async (params) => {
                 return await getList.run({ ...params, ...publicData }).then(res => {
                     setBookId(null)

src/pages/MiniApp/BookManage/Short/index.tsx

@@ -2,12 +2,12 @@ import { ActionType, BetaSchemaForm, PageContainer, ProFormInstance, ProTable }
 import { columns } from "./tableConfig"
 import { useAjax } from "@/Hook/useAjax"
 import { useModel } from "@umijs/max"
-import { shortBookInfoList, shortBookInfoParagraphList, shortBookInfoBookConfig, shortBookInfoConfig, shortBookInfoParagraphAllList, sysRechargeGetInfo, sysRechargeAddOrEdit } from "@/services/miniApp/bookManage"
+import { shortBookInfoList, shortBookInfoParagraphList, shortBookInfoBookConfig, shortBookInfoConfig, shortBookInfoParagraphAllList, sysRechargeGetInfo, sysRechargeAddOrEdit, shortBookInfoShelve } from "@/services/miniApp/bookManage"
 import { useCallback, useEffect, useMemo, useRef, useState } from "react"
-import { Drawer, message, Space, Tag } from "antd"
+import { Button, Card, Drawer, message, Popconfirm, Space, Tag } from "antd"
 import ReadText from "../components/readText"
 import formConfig from "./formConfig"
-import { EditFilled } from "@ant-design/icons"
+import { ColumnHeightOutlined, EditFilled } from "@ant-design/icons"
 const wordCountRanges: any = {
     "": { start: null, end: null }, // 全部
     "0-2": { start: 0, end: 2 * 10000 },
@@ -45,6 +45,7 @@ const Page: React.FC = (props: Props) => {
     let [isGlobalConfig, setIsGlobalConfig] = useState(false)//
     let [workDirection, setWorkDirection] = useState<any>(null)
     const [openBook, setOpneBook] = useState<any>(null)//阅读小说
+    const [editSelectedRow, setEditSelectedRow] = useState<any[]>([]); //小说列表选择
     let getList = useAjax((params) => shortBookInfoList(params), { type: 'table' })//获取书列表
     let getParagraphList = useAjax((params) => shortBookInfoParagraphList(params))//获取段落内容信息
     let getParagraphAllList = useAjax((params) => shortBookInfoParagraphAllList(params))//获取全部段落
@@ -52,6 +53,7 @@ const Page: React.FC = (props: Props) => {
     let configInfo = useAjax((params) => shortBookInfoConfig(params))//获取配置信息
     let globaleConfig = useAjax((params) => sysRechargeGetInfo(params))//获取全局配置信息
     let globaleAddOrEdit = useAjax((params) => sysRechargeAddOrEdit(params))//全局配置信息修改
+    let ShortBookInfoShelve = useAjax((params) => shortBookInfoShelve(params))//短篇小说批量上下架
     const formRef = useRef<ProFormInstance>();
     const actionRef = useRef<ActionType>();
 
@@ -159,6 +161,16 @@ const Page: React.FC = (props: Props) => {
             })
         }
     }
+    // 批量上下架
+    const shelveAll = (ids: any[], shelve: 0 | 1) => {
+        ShortBookInfoShelve.run({ ...publicData, ids, shelve}).then((res) => {
+            if (res.code === 200) {
+                actionRef?.current?.reload();
+                message.success('批量' + (shelve === 0 ? '上架成功' : '下架成功'));
+                setEditSelectedRow([])
+            }
+        });
+    };
     return <PageContainer title={false}
         tabProps={{ type: 'card' }}
         loading={globaleConfig?.loading}
@@ -178,10 +190,26 @@ const Page: React.FC = (props: Props) => {
                 },
             } : {
                 alwaysShowAlert: true,//总是展示 alert，默认无选择不展示
-                hideSelectAll: true,// 隐藏全选框
-                renderCell: () => null,  // 隐藏选择列中的勾选框
-                columnTitle: '',  // 去掉选择列的表头
-                columnWidth: 0,  // 设置选择列宽度为 0
+                selectedRowKeys: editSelectedRow?.map((item: { bookId: any }) => item.bookId),
+                onSelect: (record, selected) => {
+                    if (selected) {
+                        setEditSelectedRow([...editSelectedRow, record]);
+                    } else {
+                        setEditSelectedRow(
+                            editSelectedRow?.filter((item: { bookId: any }) => item.bookId !== record.bookId),
+                        );
+                    }
+                },
+                onSelectAll: (selected, rows, changeRows) => {
+                    if (selected) {
+                        setEditSelectedRow([...editSelectedRow, ...changeRows]);
+                    } else {
+                        let newArr = editSelectedRow?.filter((item: { bookId: any }) =>
+                            changeRows.every((i) => i?.bookId !== item?.bookId),
+                        );
+                        setEditSelectedRow(newArr);
+                    }
+                },
             }}
             // 点击行
             onRow={(record) => ({
@@ -190,24 +218,76 @@ const Page: React.FC = (props: Props) => {
                     props?.closeDrawer?.(false)
                 }
             })}
-            tableAlertRender={!!props?.onChange ? false : () => {
+            tableAlertRender={!!props?.onChange ? false : ({ selectedRowKeys, selectedRows }) => {
                 let { paymentType, paymentOption, paymentCategory, paymentAmount, paymentCoin, beginPayNo } = globaleConfig?.data?.data || {}
                 let enumList: any = state?.enumList
                 let PAYMENT_TYPE_Map: Map<any, any> = new Map(enumList?.PAYMENT_TYPE?.values?.map(({ value, description }: any) => [value, description]))
                 let PAYMENT_OPTION_Map: Map<any, any> = new Map(enumList?.PAYMENT_OPTION?.values?.map(({ value, description }: any) => [value, description]))
-                return <Tag bordered={false} style={{ cursor: 'pointer' }} onClick={closeGlobalForm}>
+                return <div>
+                    <div>
+                        <Tag bordered={false} style={{ cursor: 'pointer' }} onClick={closeGlobalForm}>
+                            <Space>
+                                <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_TYPE_Map?.get(paymentType)}</span></Tag>
+                                <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费起始段落/章节：<span style={{ color: "#f64747" }}>{beginPayNo}</span></Tag>
+                                {paymentType === 2 && <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>段落/章节收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_OPTION_Map?.get(paymentOption)}</span></Tag>}
+                                <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费价格：
+                                    <span style={{ color: "#f64747" }}>{paymentCategory === 0 && '￥'}{paymentCategory === 0 ? paymentAmount : paymentCoin}</span>
+                                    {paymentCategory === 1 && '书币'}</Tag>
+                            </Space>
+                            <EditFilled />
+                        </Tag>
+                    </div>
+                    {
+                        selectedRows?.length > 0 && <Space size={0} style={{ marginTop: 10 }}>
+                            <span style={{ width: 90, display: 'inline-block' }}>
+                                已选{selectedRowKeys.length} 项
+                            </span>
+                            <span style={{ color: 'red' }}>
+                                {selectedRows
+                                    ?.map((item: { shortBookInfoVO?: any, longBookInfo?: any, bookId: any }) => <Tag
+                                        closable
+                                        key={item?.bookId}
+                                        color="red"
+                                        onClose={() => {
+                                            let newArr = selectedRows?.filter((i) => i?.bookId != item?.bookId)
+                                            setEditSelectedRow(newArr)
+                                        }}>{item?.shortBookInfoVO?.bookName || item?.longBookInfo?.bookName}</Tag>)
+                                }
+                            </span>
+                        </Space>
+                    }
+                </div>
+            }}
+            // 多选后的按钮操作
+            tableAlertOptionRender={!!props?.onChange ? false : ({ selectedRowKeys }) => {
+                return (
                     <Space>
-                        <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_TYPE_Map?.get(paymentType)}</span></Tag>
-                        <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费起始段落/章节：<span style={{ color: "#f64747" }}>{beginPayNo}</span></Tag>
-                        {paymentType === 2 && <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>段落/章节收费类型：<span style={{ color: '#f64747' }}>{PAYMENT_OPTION_Map?.get(paymentOption)}</span></Tag>}
-                        <Tag bordered={false} color="processing" style={{ cursor: 'pointer' }}>付费价格：
-                            <span style={{ color: "#f64747" }}>{paymentCategory === 0 && '￥'}{paymentCategory === 0 ? paymentAmount : paymentCoin}</span>
-                            {paymentCategory === 1 && '书币'}</Tag>
+                        <Popconfirm
+                            title={null}
+                            icon={null}
+                            onConfirm={() => {
+                                shelveAll(
+                                    editSelectedRow?.map((item) => item.bookId),
+                                    0,
+                                );
+                            }}
+                            onCancel={() => {
+                                shelveAll(
+                                    editSelectedRow?.map((item) => item.bookId),
+                                    1,
+                                );
+                            }}
+                            okText="全部上架"
+                            cancelText="全部下架"
+                        >
+                            <Button type="primary" disabled={selectedRowKeys.length === 0}>
+                                <ColumnHeightOutlined />
+                                批量上下架
+                            </Button>
+                        </Popconfirm>
                     </Space>
-                    <EditFilled />
-                </Tag>
+                );
             }}
-            tableAlertOptionRender={false}
             search={{
                 labelWidth: 90,
                 searchGutter: [10, 15],

src/services/miniApp/bookManage/index.tsx

@@ -83,7 +83,15 @@ export async function longBookInfoBookConfig(data: LongConfigParmas) {
     data
   });
 }
-
+/**长篇批量上下架*/
+export async function longBookInfoShelve(data: any) {
+  let { ids, ...params } = data
+  return request(api + `/admin/longBookInfo/shelve/batch`, {
+    method: 'POST',
+    params,
+    data:ids
+  });
+}
 interface ShortConfigParmas extends PublicParams, BookId, ConfigParmas {
   beginPayParagraphNo: number,//付费段落
   paymentAmount: number,//收费金额
@@ -128,7 +136,15 @@ export async function shortBookInfoBookConfig(data: ShortConfigParmas) {
     data
   });
 }
-
+/**短篇批量上下架*/
+export async function shortBookInfoShelve(data: any) {
+  let { ids, ...params } = data
+  return request(api + `/admin/shortBookInfo/shelve/batch`, {
+    method: 'POST',
+    params,
+    data:ids
+  });
+}
 //======================================全局收费配置================================
 
 /**全局付费配置详情 */