wjx 13 小时之前
父节点
当前提交
d5b8d3ff84

+ 36 - 0
src/pages/weComTask/API/logs/index.tsx

@@ -146,4 +146,40 @@ export function getSendRobotLogListApi(data: GetSendRobotLogListProps) {
         method: 'POST',
         data
     })
+}
+
+export interface GetSendMomentLogListProps {
+    pageNum?: number
+    pageSize?: number
+    projectName?: string
+    taskId?: any
+    startDay?: string,
+    endDay?: string
+    projectGroupIds?: number[]
+}
+
+/**
+ * 朋友圈下发企微号
+ * @param data 
+ * @returns 
+ */
+export function getMomentCorpUserLogListApi(data: GetSendMomentLogListProps) {
+    return request({
+        url: api + `/corpOperation/corp/stats/listOfPage/momentCorpUser/log`,
+        method: 'POST',
+        data
+    })
+}
+
+/**
+ * 朋友圈 群发记录
+ * @param data 
+ * @returns 
+ */
+export function getMomentJobLogListApi(data: GetSendMomentLogListProps) {
+    return request({
+        url: api + `/corpOperation/corp/stats/listOfPage/momentJob/log`,
+        method: 'POST',
+        data
+    })
 }

+ 8 - 15
src/pages/weComTask/page/home/index.tsx

@@ -13,6 +13,7 @@ import { getTotalModelApi, getTotalTaslApi } from "../../API/logs";
 import CalendarItem from "./calendarItem";
 import PullGroup from "./pullGroup";
 import GroupItem from "./groupItem";
+import MomentItem from "./momentItem";
 
 const weekMap = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
 const taskTypeMap = {
@@ -310,21 +311,13 @@ const Logs: React.FC = () => {
                                             projectType={2}
                                         />
                                     case 'TASK_STAT_MOMENT': // 朋友圈
-                                        return <div className={style.moduleCard} key={index}>
-                                            <div className={style.moduleCard_header}>
-                                                <Avatar style={{ backgroundColor: '#dcfce7', color: '#16a34a' }} size={30}>
-                                                    <FontAwesomeIcon icon={faCommentDots} />
-                                                </Avatar>
-                                                朋友圈
-                                            </div>
-                                            <div className={style.moduleCard_center}>
-                                                总任务数:{item?.taskTotal || 0} | 今日新增:{item?.todayAddTask || 0}
-                                            </div>
-                                            <div className={style.moduleCard_footer}>
-                                                <span>今日完成率:{((item?.todayFinishTaskRate || 0) * 100).toFixed(2)} %</span>
-                                                <span className={style.error}>今日异常:{item?.todayFailTask}</span>
-                                            </div>
-                                        </div>
+                                        return <MomentItem
+                                            key={index}
+                                            taskTotal={item?.taskTotal}
+                                            todayAddTask={item?.todayAddTask}
+                                            todayFinishTaskRate={item?.todayFinishTaskRate}
+                                            todayFailTask={item?.todayFailTask}
+                                        />
                                     case 'TASK_STAT_PULL_GROUP': // 群聊创建 - 拉群
                                         return <PullGroup
                                             key={index}

+ 558 - 0
src/pages/weComTask/page/home/momentItem.tsx

@@ -0,0 +1,558 @@
+import React, { useEffect, useState } from "react"
+import style from './index.less';
+import { Avatar, Badge, Button, DatePicker, Drawer, Input, Modal, Select, Space, Table, Tabs, Tag } from "antd";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faCommentDots } from "@fortawesome/free-solid-svg-icons";
+import { useAjax } from "@/Hook/useAjax";
+import { getProjectGroupsAllListApi } from "../../API/groupManage";
+import { ExclamationCircleOutlined, SearchOutlined } from "@ant-design/icons";
+import { getMomentCorpUserLogListApi, getMomentJobLogListApi, GetSendMomentLogListProps } from "../../API/logs";
+import useNewToken from "@/Hook/useNewToken";
+import SearchBox from "../../components/searchBox";
+import dayJs from "dayjs";
+import { copy } from "@/utils/utils";
+
+interface Props {
+    taskTotal: number
+    todayAddTask: number
+    todayFinishTaskRate: number
+    todayFailTask: number
+}
+
+/**
+ * 朋友圈
+ * @returns 
+ */
+const MomentItem: React.FC<Props> = ({ taskTotal, todayAddTask, todayFinishTaskRate, todayFailTask }) => {
+
+    /*************************************************/
+    const [visible, setVisible] = useState<boolean>(false)
+    const [activeKey, setActiveKey] = useState<string>('2')
+    const [groupList, setGroupList] = useState<{ label: string, value: number }[]>([]);
+
+    const getProjectGroupsAllList = useAjax(() => getProjectGroupsAllListApi())
+    /*************************************************/
+
+    useEffect(() => {
+        if (visible) {
+            getProjectGroupsAllList.run().then(res => {
+                setGroupList([{ label: '空项目组', value: 0 }, ...res?.data?.map(item => ({ label: item.name, value: item.id })) || []])
+            })
+        }
+    }, [visible])
+
+    return <>
+        <div className={style.moduleCard} onClick={() => setVisible(true)}>
+            <div className={style.moduleCard_header}>
+                <Avatar style={{ backgroundColor: '#dcfce7', color: '#16a34a' }} size={30}>
+                    <FontAwesomeIcon icon={faCommentDots} />
+                </Avatar>
+                朋友圈
+            </div>
+            <div className={style.moduleCard_center}>
+                总任务数:{taskTotal || 0} | 今日新增:{todayAddTask || 0}
+            </div>
+            <div className={style.moduleCard_footer}>
+                <span>今日完成率:{((todayFinishTaskRate || 0) * 100).toFixed(2)} %</span>
+                <span className={style.error}>今日异常:{todayFailTask}</span>
+            </div>
+        </div>
+
+        <Drawer
+            title={'朋友圈'}
+            onClose={() => setVisible(false)}
+            open={visible}
+            width={'70%'}
+        >
+            <Tabs
+                destroyOnHidden={false}
+                onChange={(key) => {
+                    setActiveKey(key)
+                }}
+                activeKey={activeKey}
+                type="card"
+                items={[
+                    {
+                        key: '2',
+                        label: '下发企微号',
+                        children: <>
+                            {activeKey == '2' && <GroupXfCorpTabls groupList={groupList} />}
+                        </>
+                    },
+                    {
+                        key: '4',
+                        label: '群发记录',
+                        children: <>
+                            {activeKey == '4' && <GroupTaskNotes groupList={groupList} />}
+                        </>
+                    }
+                ]}
+            />
+
+        </Drawer>
+    </>
+}
+
+
+/**
+ * 下发企微号
+ * @param param0 
+ * @returns 
+ */
+const GroupXfCorpTabls: React.FC<{ groupList: { label: string, value: number }[] }> = ({ groupList }) => {
+
+    /***********************************/
+    const [queryParams, setQueryParams] = useState<GetSendMomentLogListProps>({ pageNum: 1, pageSize: 20 })
+    const [oldQueryParams, setOldQueryParams] = useState<GetSendMomentLogListProps>({ pageNum: 1, pageSize: 20 })
+    const { token } = useNewToken()
+    const [modal, contextHolder] = Modal.useModal();
+
+    const getMomentCorpUserLogList = useAjax((params) => getMomentCorpUserLogListApi(params))
+    /***********************************/
+
+    useEffect(() => {
+        getMomentCorpUserLogList.run(queryParams)
+    }, [queryParams])
+
+    return <div>
+        {contextHolder}
+        <SearchBox
+            bodyPadding={`0 0 10px`}
+            buttons={<>
+                <Button type="primary" onClick={() => {
+                    setQueryParams({ ...oldQueryParams, pageNum: 1, pageSize: queryParams.pageSize })
+                }} loading={getMomentCorpUserLogList.loading} icon={<SearchOutlined />}>搜索</Button>
+            </>}
+        >
+            <>
+                <Input
+                    placeholder="任务名称"
+                    style={{ width: 120 }}
+                    allowClear
+                    onChange={(e) => setOldQueryParams({ ...oldQueryParams, projectName: e.target.value })}
+                    value={oldQueryParams?.projectName}
+                />
+                <Input
+                    placeholder="子任务ID"
+                    style={{ width: 120 }}
+                    allowClear
+                    onChange={(e) => setOldQueryParams({ ...oldQueryParams, taskId: e.target.value })}
+                    value={oldQueryParams?.taskId}
+                />
+                <Select
+                    placeholder='请选择项目组'
+                    allowClear
+                    options={groupList}
+                    showSearch
+                    maxTagCount={1}
+                    style={{ minWidth: 150 }}
+                    filterOption={(input, option) =>
+                        (option?.label ?? '').toLowerCase().includes(input.toLowerCase())
+                    }
+                    mode="multiple"
+                    value={oldQueryParams?.projectGroupIds}
+                    onChange={(value) => setOldQueryParams({ ...oldQueryParams, projectGroupIds: value })}
+                />
+                <DatePicker
+                    placeholder="发送开始时间"
+                    onChange={(e, date) => { setOldQueryParams({ ...oldQueryParams, startDay: date as string }) }}
+                    allowClear
+                    value={oldQueryParams?.startDay ? dayJs(oldQueryParams?.startDay) : undefined}
+                />
+                <DatePicker
+                    placeholder="发送结束时间"
+                    onChange={(e, date) => { setOldQueryParams({ ...oldQueryParams, endDay: date as string }) }}
+                    allowClear
+                    value={oldQueryParams?.endDay ? dayJs(oldQueryParams?.endDay) : undefined}
+                />
+            </>
+        </SearchBox>
+
+        {/* 表 */}
+        <Table
+            style={{ marginTop: 10 }}
+            dataSource={getMomentCorpUserLogList?.data?.data?.records}
+            loading={getMomentCorpUserLogList?.loading}
+            bordered
+            columns={[
+                {
+                    title: '操作',
+                    dataIndex: 'cz',
+                    key: 'cz',
+                    width: 100,
+                    align: 'center',
+                    render: (_, record: any) => {
+                        return <Space>
+                            <a onClick={() => {
+                                modal.confirm({
+                                    title: '确认',
+                                    icon: <ExclamationCircleOutlined />,
+                                    content: '是否跳转到日志详情?',
+                                    okText: '确认',
+                                    cancelText: '复制',
+                                    onCancel: () => {
+                                        copy(record.projectName + '任务Id:' + record.taskId)
+                                    },
+                                    onOk: () => {
+                                        localStorage.setItem('OPENTASK', JSON.stringify({
+                                            id: record.projectId,
+                                            projectName: record.projectName,
+                                            taskType: 'TASK_STAT_MOMENT',
+                                            taskId: record.taskId,
+                                            msg: '跳转日志详情'
+                                        }))
+                                        window.open(`/weComTask#/weComTask/moments/taskList`)
+                                    },
+                                });
+                            }}>任务跳转</a>
+                        </Space>
+                    }
+                },
+                {
+                    title: '任务名称',
+                    dataIndex: 'projectName',
+                    key: 'projectName',
+                    width: 180,
+                    ellipsis: true,
+                    render: (text) => <a onClick={() => copy(text)}>{text}</a>
+                },
+                {
+                    title: '子任务ID',
+                    dataIndex: 'taskId',
+                    key: 'taskId',
+                    width: 70,
+                    align: 'center'
+                },
+                {
+                    title: '项目组名称',
+                    dataIndex: 'projectGroupName',
+                    key: 'projectGroupName',
+                    width: 100,
+                    ellipsis: true,
+                    align: 'center',
+                    render: (text) => text ? <a onClick={() => copy(text)}>{text}</a> : '--'
+                },
+                {
+                    title: '项目组ID',
+                    dataIndex: 'projectGroupId',
+                    key: 'projectGroupId',
+                    width: 70,
+                    align: 'center'
+                },
+                {
+                    title: '所属企业',
+                    dataIndex: 'corpName',
+                    key: 'corpName',
+                    align: 'center',
+                    width: 120,
+                    ellipsis: true
+                },
+                {
+                    title: '企微号',
+                    dataIndex: 'corpUserName',
+                    key: 'corpUserName',
+                    align: 'center',
+                    width: 120,
+                    ellipsis: true,
+                    render: (a: string, b: any) => {
+                        return a + `(${b?.corpUserId})`
+                    }
+                },
+                {
+                    title: '发送状态',
+                    dataIndex: 'sendStatus',
+                    key: 'sendStatus',
+                    align: 'center',
+                    width: 80,
+                    render: (a) => {
+                        return <Badge text={a === 1 ? '已确认发送' : '未确认发送'} status={a === 1 ? 'success' : 'error'} />
+                    }
+                },
+                {
+                    title: '预计送达数',
+                    dataIndex: 'sendCount',
+                    key: 'sendCount',
+                    align: 'center',
+                    width: 75,
+                    ellipsis: true,
+                    render: (a) => {
+                        return a > 0 ? a : 0
+                    }
+                },
+                {
+                    title: '消息ID',
+                    dataIndex: 'jobId',
+                    key: 'jobId',
+                    align: 'center',
+                    width: 65,
+                    ellipsis: true,
+                },
+                {
+                    title: '发送成功',
+                    dataIndex: 'sendSuccessCount',
+                    key: 'sendSuccessCount',
+                    align: 'center',
+                    width: 75,
+                    render: (a) => {
+                        return a > 0 ? a : 0
+                    }
+                },
+                {
+                    title: '发送失败',
+                    dataIndex: 'sendFailedCount',
+                    key: 'sendFailedCount',
+                    align: 'center',
+                    width: 75,
+                    render: (a) => {
+                        return a > 0 ? a : 0
+                    }
+                },
+                {
+                    title: '评论数',
+                    dataIndex: 'commentCount',
+                    key: 'commentCount',
+                    align: 'center',
+                    width: 65,
+                    ellipsis: true,
+                },
+                {
+                    title: '点赞数',
+                    dataIndex: 'likeCount',
+                    key: 'likeCount',
+                    align: 'center',
+                    width: 65,
+                    ellipsis: true,
+                },
+                {
+                    title: '发送时间',
+                    dataIndex: 'sendTime',
+                    key: 'sendTime',
+                    align: 'center',
+                    width: 135,
+                    ellipsis: true
+                }
+            ]}
+            scroll={{ x: 1000 }}
+            rowKey={'id'}
+            size='small'
+            onRow={(row: any) => {
+                return !row?.status ? {
+                    style: { background: token.colorPrimaryBgHover }
+                } : {}
+            }}
+            pagination={{
+                total: getMomentCorpUserLogList?.data?.data?.total,
+                showTotal: (total) => <Tag color="cyan">总共{total}数据</Tag>,
+                showSizeChanger: true,
+                showLessItems: true,
+                defaultCurrent: 1,
+                defaultPageSize: 200,//默认初始的每页条数
+                current: getMomentCorpUserLogList?.data?.data?.current || 1,
+                pageSize: getMomentCorpUserLogList?.data?.data?.size || 20,
+                onChange: (page, pageSize) => {
+                    setQueryParams({ ...queryParams, pageNum: page, pageSize })
+                    setOldQueryParams({ ...oldQueryParams, pageNum: page, pageSize })
+                }
+            }}
+        />
+    </div>
+}
+
+
+/**
+ * 群发记录
+ * @param param0 
+ * @returns 
+ */
+const GroupTaskNotes: React.FC<{ groupList: { label: string, value: number }[] }> = ({ groupList }) => {
+
+    /***********************************/
+    const [queryParams, setQueryParams] = useState<GetSendMomentLogListProps>({ pageNum: 1, pageSize: 20 })
+    const [oldQueryParams, setOldQueryParams] = useState<GetSendMomentLogListProps>({ pageNum: 1, pageSize: 20 })
+    const { token } = useNewToken()
+    const [modal, contextHolder] = Modal.useModal();
+
+    const getMomentJobLogList = useAjax((params) => getMomentJobLogListApi(params))
+    /***********************************/
+
+    useEffect(() => {
+        getMomentJobLogList.run(queryParams)
+    }, [queryParams])
+
+
+    return <div>
+        {contextHolder}
+        <SearchBox
+            bodyPadding={`0 0 10px`}
+            buttons={<>
+                <Button type="primary" onClick={() => {
+                    setQueryParams({ ...oldQueryParams, pageNum: 1, pageSize: queryParams.pageSize })
+                }} loading={getMomentJobLogList.loading} icon={<SearchOutlined />}>搜索</Button>
+            </>}
+        >
+            <>
+                <Input
+                    placeholder="任务名称"
+                    style={{ width: 120 }}
+                    allowClear
+                    onChange={(e) => setOldQueryParams({ ...oldQueryParams, projectName: e.target.value })}
+                    value={oldQueryParams?.projectName}
+                />
+                <Input
+                    placeholder="子任务ID"
+                    style={{ width: 120 }}
+                    allowClear
+                    onChange={(e) => setOldQueryParams({ ...oldQueryParams, taskId: e.target.value })}
+                    value={oldQueryParams?.taskId}
+                />
+                <Select
+                    placeholder='请选择项目组'
+                    allowClear
+                    options={groupList}
+                    showSearch
+                    maxTagCount={1}
+                    style={{ minWidth: 150 }}
+                    filterOption={(input, option) =>
+                        (option?.label ?? '').toLowerCase().includes(input.toLowerCase())
+                    }
+                    mode="multiple"
+                    value={oldQueryParams?.projectGroupIds}
+                    onChange={(value) => setOldQueryParams({ ...oldQueryParams, projectGroupIds: value })}
+                />
+                <DatePicker
+                    placeholder="发送开始时间"
+                    onChange={(e, date) => { setOldQueryParams({ ...oldQueryParams, startDay: date as string }) }}
+                    allowClear
+                    value={oldQueryParams?.startDay ? dayJs(oldQueryParams?.startDay) : undefined}
+                />
+                <DatePicker
+                    placeholder="发送结束时间"
+                    onChange={(e, date) => { setOldQueryParams({ ...oldQueryParams, endDay: date as string }) }}
+                    allowClear
+                    value={oldQueryParams?.endDay ? dayJs(oldQueryParams?.endDay) : undefined}
+                />
+            </>
+        </SearchBox>
+
+        <Table
+            style={{ marginTop: 10 }}
+            dataSource={getMomentJobLogList?.data?.data?.records}
+            loading={getMomentJobLogList?.loading}
+            bordered
+            columns={[
+                {
+                    title: '操作',
+                    dataIndex: 'cz',
+                    key: 'cz',
+                    width: 100,
+                    align: 'center',
+                    render: (_, record: any) => {
+                        return <Space>
+                            <a onClick={() => {
+                                modal.confirm({
+                                    title: '确认',
+                                    icon: <ExclamationCircleOutlined />,
+                                    content: '是否跳转到日志详情?',
+                                    okText: '确认',
+                                    cancelText: '复制',
+                                    onCancel: () => {
+                                        copy(record.projectName + '任务Id:' + record.taskId)
+                                    },
+                                    onOk: () => {
+                                        localStorage.setItem('OPENTASK', JSON.stringify({
+                                            id: record.projectId,
+                                            projectName: record.projectName,
+                                            taskType: 'TASK_STAT_MOMENT',
+                                            taskId: record.taskId,
+                                            msg: '跳转日志详情'
+                                        }))
+                                        window.open(`/weComTask#/weComTask/moments/taskList`)
+                                    },
+                                });
+                            }}>任务跳转</a>
+                        </Space>
+                    }
+                },
+                {
+                    title: '任务名称',
+                    dataIndex: 'projectName',
+                    key: 'projectName',
+                    width: 180,
+                    ellipsis: true,
+                    render: (text) => <a onClick={() => copy(text)}>{text}</a>
+                },
+                {
+                    title: '子任务ID',
+                    dataIndex: 'taskId',
+                    key: 'taskId',
+                    width: 70,
+                    align: 'center'
+                },
+                {
+                    title: '项目组名称',
+                    dataIndex: 'projectGroupName',
+                    key: 'projectGroupName',
+                    width: 100,
+                    ellipsis: true,
+                    align: 'center',
+                    render: (text) => text ? <a onClick={() => copy(text)}>{text}</a> : '--'
+                },
+                {
+                    title: '项目组ID',
+                    dataIndex: 'projectGroupId',
+                    key: 'projectGroupId',
+                    width: 70,
+                    align: 'center'
+                },
+                {
+                    title: '消息ID',
+                    dataIndex: 'jobId',
+                    key: 'jobId',
+                    width: 70,
+                    ellipsis: true
+                },
+                {
+                    title: '发送时间',
+                    dataIndex: 'createTime',
+                    key: 'createTime',
+                    width: 110
+                },
+                {
+                    title: '任务日志',
+                    dataIndex: 'jobLog',
+                    key: 'jobLog',
+                    width: 250,
+                    ellipsis: true
+                },
+                {
+                    title: '任务状态',
+                    dataIndex: 'jobStatus',
+                    key: 'jobStatus',
+                    width: 110,
+                    ellipsis: true
+                }
+            ]}
+            scroll={{ x: 1000 }}
+            rowKey={(s) => {
+                return s.id
+            }}
+            size='small'
+            pagination={{
+                total: getMomentJobLogList?.data?.data?.total,
+                showTotal: (total) => <Tag color="cyan">总共{total}数据</Tag>,
+                showSizeChanger: true,
+                showLessItems: true,
+                defaultCurrent: 1,
+                defaultPageSize: 200,//默认初始的每页条数
+                current: getMomentJobLogList?.data?.data?.current || 1,
+                pageSize: getMomentJobLogList?.data?.data?.size || 20,
+                onChange: (page, pageSize) => {
+                    setQueryParams({ ...queryParams, pageNum: page, pageSize })
+                    setOldQueryParams({ ...oldQueryParams, pageNum: page, pageSize })
+                }
+            }}
+        />
+    </div>
+}
+
+export default React.memo(MomentItem)