shenwu 7 月之前
父節點
當前提交
7a5cb590e8

+ 16 - 0
src/Hook/usePrevious.tsx

@@ -0,0 +1,16 @@
+import { useEffect, useRef } from 'react';
+
+// 自定义 Hook: 记录上次的值
+function usePrevious(value: any) {
+  const ref = useRef(); // 创建一个 ref 来保存上一次的值
+
+  useEffect(() => {
+    // 在每次渲染后将当前值存入 ref
+    ref.current = value;
+  }, [value]); // 仅在 value 改变时更新
+
+  // 返回上一次的值
+  return ref.current;
+}
+
+export default usePrevious;

+ 2 - 2
src/models/global.tsx

@@ -65,12 +65,12 @@ export default (): { state: State, init: () => void, getEnum: (enumName: string,
             case "map":
                 return new Map(arr?.map(({ value, description }: any) => [value, description]))
             case "arr":
-                return arr?.map(({ value, description }: any) => ({ value, key: value, label: description }))
+                return arr?.map(({ value, description }: any) => ({ value, key: value, label: description,disabled:false }))
             case "obj":
                 let obj: any = {}
                 if (arr) {
                     for (let item of arr) {
-                        obj[item?.value] = { text: item?.description }
+                        obj[item?.value] = { text: item?.description,disabled:false }
                     }
                 }
                 return obj

+ 12 - 3
src/pages/Distributor/AppManage/index.tsx

@@ -37,6 +37,7 @@ const Page: React.FC = () => {
             }
         })
     }
+    console.log(getEnum("ADVERTISING_CHANNEL", "arr"))
     return <PageContainer
         tabList={getEnum("APP_TYPE", "arr")}
         tabProps={{
@@ -107,7 +108,7 @@ const Page: React.FC = () => {
                     }
                 }}
             />
-            
+
             <ModalForm
                 title={"批量新增账号"}
                 width="500px"
@@ -140,7 +141,13 @@ const Page: React.FC = () => {
                     width="md"
                     name="advertisingChannels"
                     label="投放渠道"
-                    options={getEnum("ADVERTISING_CHANNEL", "arr")}
+                    options={getEnum("ADVERTISING_CHANNEL", "arr")?.map((item: { value: any }) => {
+                        if (openTable?.advertisingChannels?.includes(item.value)) {
+                            return item
+                        } else {
+                            return { ...item, disabled: true }
+                        }
+                    })}
                 />
                 <ProFormSelect
                     rules={[
@@ -157,7 +164,9 @@ const Page: React.FC = () => {
                     width="md"
                     name="distributorAccountIds"
                     label="投放账号"
-                    options={allList?.data?.data?.map((item: { id: any; nickname: any }) => ({ value: item.id, label: item.nickname }))}
+                    options={allList?.data?.data?.map((item: { id: any; nickname: any }) => ({
+                        value: item.id, label: item.nickname
+                    }))}
                 />
             </ModalForm>
         </Drawer>

+ 6 - 4
src/pages/MiniApp/CompConfig/DrawerBox/compConfig.tsx

@@ -13,6 +13,7 @@ type Props = {
 }
 export function CompConfig(props: Props) {
     let { pageList = [], compName } = props
+    const formRef = useRef<ProFormInstance>();
     let { state, dispatch } = useModel('appPageConifg')
     let QueryCategoryList = useAjax((params) => queryCategoryList(params))
 
@@ -30,9 +31,9 @@ export function CompConfig(props: Props) {
             case "hot_books":
                 return hotBooksConfig();
             case "hot_category":
-                return hotCategoryConfig(QueryCategoryList?.data?.data);
+                return hotCategoryConfig(QueryCategoryList?.data?.data,formRef);
         }
-    }, [compName, pageList, QueryCategoryList?.data?.data])
+    }, [compName, pageList, QueryCategoryList?.data?.data,formRef])
 
     // 获取当前页面配置表
     const list = useMemo(() => {
@@ -53,7 +54,7 @@ export function CompConfig(props: Props) {
         }
         return list
     }, [state])
-    const formRef = useRef<ProFormInstance>();
+ 
     // 提交表单
     const submit = async (values: any) => {
     }
@@ -64,6 +65,7 @@ export function CompConfig(props: Props) {
     }, [list])
     // 值变化
     const handelValues = (values: any, isDel?: boolean) => {
+        console.log("values",values)
         // 处理分类 书籍 需要的完整数据
         if(values){
             for (let config of values?.configs) {
@@ -72,7 +74,7 @@ export function CompConfig(props: Props) {
                     config.bookId = config.bookInfo.id
                 }
                 if (config?.categoryId) {
-                    config.categoryInfo = QueryCategoryList?.data?.data?.find((item: { id: any; })=>item.id === config.categoryId) 
+                    config.categoryInfo = QueryCategoryList?.data?.data?.find((item: { id: any; })=>item.id == config.categoryId) 
                     config.categoryId = config.categoryInfo.id
                 }
                 if (config?.bookIds) {

+ 43 - 29
src/pages/MiniApp/CompConfig/DrawerBox/compFormConfig.tsx

@@ -1,6 +1,6 @@
 import UploadImg from "@/components/uploadImg";
 import { ArrowDownOutlined, ArrowUpOutlined } from "@ant-design/icons";
-import { ProFormColumnsType } from "@ant-design/pro-components";
+import { ProFormColumnsType, ProFormInstance } from "@ant-design/pro-components";
 import styles from './index.less'
 import { Select, Tooltip } from "antd";
 import BookSelect from "@/components/bookSelect";
@@ -229,7 +229,7 @@ export function hotBooksConfig(): ProFormColumnsType<any>[] {
 
     ]
 }
-export function hotCategoryConfig(tags: any[]): ProFormColumnsType<any>[] {
+export function hotCategoryConfig(tags: any[], formRef: React.MutableRefObject<ProFormInstance | undefined>): ProFormColumnsType<any>[] {
     return [
         {
             title: '标题名称',
@@ -279,36 +279,50 @@ export function hotCategoryConfig(tags: any[]): ProFormColumnsType<any>[] {
             },
             columns: [
                 {
-                    valueType: 'group',
-                    colProps: {
-                        span: 24
-                    },
-                    columns: [
-                        {
-                            dataIndex: "categoryId",
-                            title: '标签',
-                            valueType:'select',
+                    valueType: 'dependency',
+                    name: ["configs"],
+                    columns(values) {
+                        let configs = formRef.current?.getFieldValue("configs")
+                        return [{
+                            valueType: 'group',
                             colProps: {
-                                span: 12
+                                span: 24
                             },
-                            formItemProps: {
-                                style: { marginBottom: 10 },
-                                rules: [
-                                    {
-                                        required: true,
-                                        message: '此项为必填项',
+                            columns: [
+                                {
+                                    dataIndex: "categoryId",
+                                    title: '标签',
+                                    valueType: 'select',
+                                    colProps: {
+                                        span: 12
                                     },
-                                ],
-                            },
-                            fieldProps: {
-                                showSearch: true
-                            },
-                            valueEnum: new Map(tags?.map(item => [item.id, item.name]))
-                        },
-                        {
-                            valueType: 'divider',
-                        }
-                    ]
+                                    formItemProps: {
+                                        style: { marginBottom: 10 },
+                                        rules: [
+                                            {
+                                                required: true,
+                                                message: '此项为必填项',
+                                            },
+                                        ],
+                                    },
+                                    fieldProps: {
+                                        showSearch: true
+                                    },
+                                    // valueEnum: new Map(tags?.map(item => [item.id, item.name]))
+                                    valueEnum: () => {
+                                        return tags?.reduce((acc, current) => {
+                                            acc[current.id] = { text: current.name, disabled: configs?.some((item: { categoryId: any; }) => item.categoryId == current.id) ? true : false };//
+                                            return acc;
+                                        }, {});
+                                    }
+                                },
+                                {
+                                    valueType: 'divider',
+                                }
+                            ]
+                        }]
+                    },
+
                 }
             ]
         },

+ 23 - 19
src/pages/MiniApp/CompConfig/components/hot_category.tsx

@@ -7,6 +7,7 @@ import { Config } from "@/models/appPageConifg";
 import { useAjax } from "@/Hook/useAjax";
 import useApi from "@/Hook/useApi";
 import { Empty } from "antd";
+import usePrevious from "@/Hook/usePrevious";
 // 热门书
 export function HotCategory(props: {
     data: {
@@ -20,6 +21,7 @@ export function HotCategory(props: {
 }) {
     const { token } = useToken()
     const [tag, setTag] = useState<any>(null)
+    const prevTag = usePrevious(tag);
     let { initialState } = useModel("@@initialState")
     let { state } = useModel("appPageConifg")
     const { data: { configs, componentName, showRightButton } } = props
@@ -34,41 +36,43 @@ export function HotCategory(props: {
     }, [initialState?.selectApp, initialState?.currentUser?.distributorId, state.index])
     let apiobj = useApi(initialState?.selectApp?.appCategory || 1)
     let getList = useAjax((params) => apiobj.getBookPageList(params))
+
     useEffect(() => {
-        if (!tag) {
-            setTag(configs?.[0]?.categoryId)
-        }
-        if (tag) {
+        if (tag && tag !== prevTag && configs && configs.length > 0 && configs?.[0]?.categoryId) {
+            console.log("tag变化", tag)
             getList.run({ ...publicData, categoryId: tag, pageNum: 1, pageSize: 8 }).then(res => {
                 if (res.code === 200) {
                     setBookData(res?.data?.records)
                 }
             })
         }
-        if (configs) {
+    }, [tag, prevTag, configs, publicData])
+
+    useEffect(() => {
+        if (configs && configs?.length > 0) {
+            if (!tag && configs?.[0]?.categoryId) {
+                console.log("tag不存在", configs)
+                setTag(configs?.[0]?.categoryId)
+            }
             let isExist = configs?.find(i => i.categoryId == tag)
             if (!isExist) {
+                console.log("tag变更")
                 setTag(configs?.[0]?.categoryId)
-                getList.run({ ...publicData, categoryId: configs?.[0]?.categoryId, pageNum: 1, pageSize: 8 }).then(res => {
-                    if (res.code === 200) {
-                        setBookData(res?.data?.records)
-                    }
-                })
             }
             if (configs.length === 0) {
                 setTag(null)
                 setBookData([])
             }
         }
-    }, [tag, configs, publicData])
+    }, [tag, configs])
     return <div className={`${styles.hot_category}`}>
         <Header title={componentName || "热门分类"} btnText={"全部分类"} showBtn={showRightButton} />
         <div className={styles.tags}>
             {
-                configs?.map(item => {
-                    return <div
+                configs?.map((item, index) => {
+                    return item?.categoryId && <div
                         className={`${styles.tag} ${tag === item.categoryId ? styles.tag_ac : ""}`}
-                        key={item.categoryId}
+                        key={item.categoryId || index}
                         onClick={() => {
                             setTag(item.categoryId || "")
                         }}
@@ -80,21 +84,21 @@ export function HotCategory(props: {
         </div>
         <div className={styles.list}>
             {
-                configs?.find(i => i.categoryId == tag)?.bookIds ? configs?.find(i => i.categoryId == tag)?.bookInfos?.map((item: any) => {
-                    return <div key={item.id} className={styles.box}>
+                configs?.find(i => i.categoryId == tag)?.bookIds ? configs?.find(i => i.categoryId == tag)?.bookInfos?.map((item: any, index:any) => {
+                    return <div key={item.id || index} className={styles.box}>
                         <img src={item?.picUrl} onError={(e: any) => {
                             e.target.src = localStorage.getItem("nocover")
                         }} />
                         <span>{item?.bookName}</span>
                     </div>
-                }) : bookData?.length > 0 ? bookData?.map((item: any) => {
-                    return <div key={item} className={styles.box}>
+                }) : bookData?.length > 0 ? bookData?.map((item: any, index) => {
+                    return <div key={item || index} className={styles.box}>
                         <img src={item?.longBookInfo?.picUrl || item?.shortBookInfoVO?.picUrl} onError={(e: any) => {
                             e.target.src = localStorage.getItem("nocover")
                         }} />
                         <span>{item?.longBookInfo?.bookName || item?.shortBookInfoVO?.bookName}</span>
                     </div>
-                }) : <div style={{justifyContent:'center',display:'flex',width:'100%'}}><Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="暂无数据请选中后设置"/></div>
+                }) : <div style={{ justifyContent: 'center', display: 'flex', width: '100%' }}><Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="暂无数据请选中后设置" /></div>
             }
         </div>
     </div>

+ 1 - 1
src/pages/MiniApp/CompConfig/index.tsx

@@ -194,7 +194,7 @@ const Page: React.FC = () => {
                 })
             } */}
             {
-                getList?.data?.data?.length === 0 && <div style={{ width: "100%", height: "100%", marginTop: "10%" }}><Empty description={<Space direction='vertical'><div>暂无模板数据</div><Button type="primary" onClick={() => { closeForm(true) }}><PlusOutlined />新增模板</Button></Space>} /></div>
+                getList?.data?.data?.length === 0 && <div style={{ width: "100%", height: "100%", marginTop: "10%" }}><Empty description={<Space direction='vertical'><div>暂无模板数据</div><Button type="primary" onClick={DrawerBoxRef?.current?.openDrawer}><PlusOutlined />新增模板</Button></Space>} /></div>
             }
         </Row>
         {/* 模板弹窗 */}