wjx 3 viikkoa sitten
vanhempi
commit
d21c00dd8d

+ 5 - 16
src/pages/weComTask/page/groupChat/create/index.tsx

@@ -19,6 +19,7 @@ import SubmitModal from '../../businessPlan/create/submitModal';
 import { addPullGroupTaskApi, getCreateDetailsApi, updateGroupTaskApi } from '@/pages/weComTask/API/groupChat';
 import { useNavigate } from 'react-router-dom';
 import { getPullGroupData } from './const';
+import SelectGroupLeader from '../../groupLeaderManage/selectGroupLeader';
 
 export const DispatchGroupChatCreate = React.createContext<GROUP_CHAT_CREATE.DispatchGroupChatCreate | null>(null);
 
@@ -43,7 +44,6 @@ const GroupChatCreate: React.FC<{ weComTaskStore: { data: { bookList: TASK_CREAT
 
 
     const welcomeMsgJobType = useAjax(() => welcomeMsgJobTypeApi())//获取业务类型
-    const getCorpUserChatAllList = useAjax((params) => getCorpUserChatAllListApi(params))//获取业务类型
     const getBindMpList = useAjax(() => getBindMpListApi())
     const getCorpAllList = useAjax((params) => getCorpAllListApi(params))
     const addPullGroupTask = useAjax((params) => addPullGroupTaskApi(params))
@@ -117,7 +117,6 @@ const GroupChatCreate: React.FC<{ weComTaskStore: { data: { bookList: TASK_CREAT
                 setMsgJobTypeList(Object.keys(res.data).map(key => ({ value: key, label: res.data[key] })))
             }
         })
-        getCorpUserChatAllList.run({})
         getBindMpList.run().then(res => {
             setMplist(res?.data?.map((item: any) => ({ label: item.name, value: item.id + '' })))
         })
@@ -305,22 +304,12 @@ const GroupChatCreate: React.FC<{ weComTaskStore: { data: { bookList: TASK_CREAT
                 <Space wrap>
                     <Space.Compact>
                         <Button>群主号</Button>
-                        <Select
-                            showSearch
-                            style={{ minWidth: 150 }}
-                            maxTagCount={1}
-                            allowClear
-                            mode='multiple'
-                            placeholder="请选择群主号"
-                            filterOption={(input, option) =>
-                                ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
-                            }
-                            value={settings?.corpUserChat?.map(item => item.value)}
-                            onChange={(_, option) => {
-                                setSettings({ ...settings, corpUserChat: option as any[], corpUsers: undefined, robotCorpUsers: undefined })
+                        <SelectGroupLeader 
+                            value={settings?.corpUserChat}
+                            onChange={(corpUserChat) => {
+                                setSettings({ ...settings, corpUserChat: corpUserChat, corpUsers: undefined, robotCorpUsers: undefined })
                                 onPreviewReset()
                             }}
-                            options={getCorpUserChatAllList?.data?.data?.map(item => ({ label: `${item.name}(${item.corpName})`, value: item.id, name: item.name, corpName: item.corpName, corpId: item.corpId, corpUserId: item.corpUserId }))}
                         />
                     </Space.Compact>
 

+ 3 - 3
src/pages/weComTask/page/groupChatSend/official/create/index.tsx

@@ -273,9 +273,9 @@ const OfficialCreate: React.FC<{ weComTaskStore: { data: { bookList: TASK_CREATE
                 return {
                     ...item,
                     id: id++,
-                    mpAccountId: cur?.mpAccount.value || index,
-                    mpAccountName: cur?.mpAccount.label || `群发组${index + 1}`,
-                    mpAccountAppid: (cur as any)?.mpAccount.appId,
+                    mpAccountId: cur?.mpAccount?.value || index,
+                    mpAccountName: cur?.mpAccount?.label || `群发组${index + 1}`,
+                    mpAccountAppid: (cur as any)?.mpAccount?.appId,
                     corpIds: cur.corp?.map(item => item.value),
                     corpNames: cur.corp?.map(item => item.label),
                     mpIndex: index,

+ 9 - 2
src/pages/weComTask/page/groupLeaderManage/index.tsx

@@ -1,4 +1,4 @@
-import { App, Button, Card, Input, Pagination, Popconfirm, Select, Table } from 'antd';
+import { App, Button, Card, Input, Pagination, Popconfirm, Select, Table, Tag } from 'antd';
 import React, { useEffect, useRef, useState } from 'react';
 import style from '../bookLink/index.less'
 import { useSize } from 'ahooks';
@@ -11,6 +11,13 @@ import { getAdAccountAllOfMember, getCorpAllListApi } from '@/API/global';
 import './global.less'
 import AddGL from './addGL';
 
+export const STATUSENUM = {
+    1: <Tag color="success">已激活</Tag>,
+    2: <Tag color="error">已禁用</Tag>,
+    4: <Tag color="warning">未激活</Tag>,
+    5: <Tag color="error">退出企业</Tag>
+}
+
 /**
  * 群主号管理
  * @returns 
@@ -121,7 +128,7 @@ const GroupLeaderManage: React.FC = () => {
                             ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
                         }
                         allowClear
-                        options={[{ label: '可用', value: 1 }, { label: '禁用', value: 0 }]}
+                        options={[{ label: '已激活', value: 1 }, { label: '已禁用', value: 2 }, { label: '未激活', value: 4 }, { label: '退出企业', value: 5 }]}
                     />
                 </>
             </SearchBox>

+ 334 - 0
src/pages/weComTask/page/groupLeaderManage/selectGroupLeader.tsx

@@ -0,0 +1,334 @@
+import useNewToken from '@/Hook/useNewToken';
+import React, { useEffect, useState } from 'react';
+import { App, Button, Input, Modal, Select, Table, Tag, Tooltip, Typography } from 'antd';
+import { CloseCircleFilled, SearchOutlined } from '@ant-design/icons';
+import '../corpUserManage/global.less'
+import { useAjax } from '@/Hook/useAjax';
+import { getCorpUserChatListApi, getCorpUserChatListProps } from '../../API/groupLeaderManage';
+import { getAdAccountAllOfMember, getCorpAllListApi } from '@/API/global';
+import { STATUSENUM } from '.';
+
+interface SelectCorpUserChatUserProps {
+    value?: { label: string, value: number, name: string, corpName: string, corpId: string, corpUserId: string }[];
+    onChange?: (value: { label: string, value: number, name: string, corpName: string, corpId: string, corpUserId: string }[]) => void;
+    placeholder?: React.ReactNode
+}
+
+/**
+ * 选择群主
+ * @returns 
+ */
+const SelectGroupLeader: React.FC<SelectCorpUserChatUserProps> = ({ value, onChange, placeholder, ...its }) => {
+
+    /************************************************************/
+    const { token } = useNewToken()
+    const [visible, setVisible] = useState<boolean>(false);
+    /************************************************************/
+
+    return <>
+        <div
+            className='selectCorpUser'
+            style={{
+                border: `1px solid ${token.colorBorder}`,
+                padding: `0px ${token.paddingXS}px`,
+                borderRadius: token.borderRadius,
+                height: token.controlHeight,
+            }}
+            onClick={() => setVisible(true)}
+        >
+            <div className='selectCorpUserContent'>
+                {(value && value?.length > 0) ? <>
+                    <Tag
+                        closable
+                        onClick={(e) => e.stopPropagation()}
+                        onClose={(e) => {
+                            e.preventDefault();
+                            onChange(value?.filter(item => item.value !== value?.[0]?.value))
+                        }}
+                    >
+                        {value?.[0]?.label || value?.[0]?.value}
+                    </Tag>
+                    {value?.length > 1 && <Tooltip
+                        color="#FFF"
+                        title={<span style={{ color: '#000' }}>
+                            {value?.filter((_, index) => index !== 0)?.map((item) => <Tag
+                                key={item.value}
+                                closable
+                                onClick={(e) => e.stopPropagation()}
+                                onClose={(e) => {
+                                    e.stopPropagation()
+                                    onChange(value?.filter(item1 => item1.value !== item.value))
+                                }}
+                            >{item.label || item?.value}</Tag>)}</span>
+                        }
+                    >
+                        <Tag>+{value.length - 1} ...</Tag>
+                    </Tooltip>}
+                </> : <span style={{ color: token.colorTextDisabled }}>{placeholder || '请选择群主号'}</span>}
+            </div>
+            {(value && value?.length > 0) && <div className='selectCorpUserIcon'>
+                <CloseCircleFilled
+                    className='selectCorpUserIconClear'
+                    style={{ fontSize: token.fontSizeIcon, color: token.colorTextSecondary }}
+                    onClick={(e) => {
+                        e.stopPropagation()
+                        onChange?.([])
+                    }}
+                />
+            </div>}
+        </div>
+
+        {visible && <SelectCorpUserChatUserModal
+            {...its}
+            value={value}
+            visible={visible}
+            placeholder={placeholder}
+            onClose={() => setVisible(false)}
+            onChange={(values) => {
+                onChange?.(values)
+                setVisible(false)
+            }}
+        />}
+    </>
+};
+
+interface SelectCorpUserChatUserModalProps extends SelectCorpUserChatUserProps {
+    visible?: boolean
+    onClose?: () => void
+}
+
+const SelectCorpUserChatUserModal: React.FC<SelectCorpUserChatUserModalProps> = React.memo(({ placeholder, visible, onClose, onChange, value }) => {
+
+    /**********************************************/
+    const [editSelectedRow, setEditSelectedRow] = useState<any[]>([])
+    const { message } = App.useApp()
+    const [queryParams, setQueryParams] = useState<getCorpUserChatListProps>({ pageNum: 1, pageSize: 20 })
+    const [queryParamsNew, setQueryParamsNew] = useState<getCorpUserChatListProps>({ pageNum: 1, pageSize: 20 })
+
+
+    const getCorpUserChatList = useAjax((params) => getCorpUserChatListApi(params))
+    const allOfMember = useAjax(() => getAdAccountAllOfMember())
+    const getCorpAllList = useAjax((params) => getCorpAllListApi(params))
+    /**********************************************/
+
+    useEffect(() => {
+        allOfMember.run()
+        getCorpAllList.run({})
+    }, [])
+
+    useEffect(() => {
+        getCorpUserChatList.run(queryParamsNew)
+    }, [queryParamsNew])
+
+    useEffect(() => {
+        if (visible) {
+            setEditSelectedRow(value?.length ? value.map(item => ({
+                id: item.value,
+                name: item.name,
+                corpName: item.corpName,
+                corpId: item.corpId,
+                corpUserId: item.corpUserId
+            })) : [])
+        }
+    }, [visible, value])
+
+    const handleOk = () => {
+        if (editSelectedRow.length) {
+            onChange?.(editSelectedRow.map(item => ({
+                label: `${item.name}(${item.corpName})`,
+                value: item.id,
+                name: item.name,
+                corpName: item.corpName,
+                corpId: item.corpId,
+                corpUserId: item.corpUserId
+            })))
+        } else {
+            message.error('请至少选择一条数据')
+        }
+    }
+
+    return <Modal
+        title={<strong>{placeholder}</strong>}
+        open={visible}
+        width={900}
+        onCancel={onClose}
+        onOk={handleOk}
+    >
+        <div className='selectCorpUserBody' style={{ width: '100%' }}>
+            <div className='selectCorpUserBody_search'>
+                <Select
+                    value={queryParams?.corpIds}
+                    onChange={(e) => setQueryParams({ ...queryParams, corpIds: e })}
+                    showSearch
+                    mode='multiple'
+                    style={{ minWidth: 110 }}
+                    maxTagCount={1}
+                    placeholder="主体"
+                    filterOption={(input, option) =>
+                        ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
+                    }
+                    allowClear
+                    options={getCorpAllList?.data?.data?.map((item: any) => ({ label: item.corpName, value: item.corpId }))}
+                />
+                <Input style={{ width: 150 }} onChange={(e) => setQueryParams({ ...queryParams, corpUserName: e.target.value as any })} value={queryParams?.corpUserName} placeholder="客服号名称" allowClear />
+                <Input style={{ width: 150 }} onChange={(e) => setQueryParams({ ...queryParams, corpUserIds: e.target.value as any })} value={queryParams?.corpUserIds} placeholder="客服ID(多个,,空格换行)" allowClear />
+                <Select
+                    value={queryParams?.operUserId}
+                    onChange={(e) => setQueryParams({ ...queryParams, operUserId: e })}
+                    showSearch
+                    style={{ width: 110 }}
+                    placeholder="运营"
+                    filterOption={(input, option) =>
+                        ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
+                    }
+                    allowClear
+                    options={allOfMember?.data?.data?.map((item: any) => ({ label: item.nickname, value: item.userId }))}
+                />
+                <Select
+                    value={queryParams?.putUserId}
+                    onChange={(e) => setQueryParams({ ...queryParams, putUserId: e })}
+                    showSearch
+                    style={{ width: 110 }}
+                    placeholder="投手"
+                    filterOption={(input, option) =>
+                        ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
+                    }
+                    allowClear
+                    options={allOfMember?.data?.data?.map((item: any) => ({ label: item.nickname, value: item.userId }))}
+                />
+                <Select
+                    style={{ width: 90 }}
+                    showSearch
+                    placeholder="状态"
+                    value={queryParams?.status}
+                    onChange={(value) => setQueryParams({ ...queryParams, status: value })}
+                    filterOption={(input, option) =>
+                        ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
+                    }
+                    allowClear
+                    options={[{ label: '已激活', value: 1 }, { label: '已禁用', value: 2 }, { label: '未激活', value: 4 }, { label: '退出企业', value: 5 }]}
+                />
+                <Button type="primary" onClick={() => {
+                    setQueryParamsNew({ ...queryParams, pageNum: 1 })
+                }} loading={getCorpUserChatList.loading} icon={<SearchOutlined />}>搜索</Button>
+            </div>
+            <div className='selectCorpUserBody_content'>
+                <Table
+                    columns={[
+                        {
+                            title: '群主主体',
+                            dataIndex: 'corpName',
+                            key: 'corpName',
+                            align: 'center',
+                            width: 70,
+                            ellipsis: true,
+                        },
+                        {
+                            title: '群主企微主体ID',
+                            dataIndex: 'corpId',
+                            key: 'corpId',
+                            align: 'center',
+                            width: 70,
+                            ellipsis: true,
+                        },
+                        {
+                            title: '群主企微号',
+                            dataIndex: 'name',
+                            key: 'name',
+                            align: 'center',
+                            width: 70,
+                            ellipsis: true,
+                        },
+                        {
+                            title: '群主企微号ID',
+                            dataIndex: 'corpUserId',
+                            key: 'corpUserId',
+                            align: 'center',
+                            width: 70,
+                            ellipsis: true,
+                        },
+                        {
+                            title: '主运营',
+                            dataIndex: 'operUser',
+                            key: 'operUser',
+                            align: 'center',
+                            width: 70,
+                            ellipsis: true,
+                            render: (value) => {
+                                return value?.nickname || '--'
+                            }
+                        },
+                        {
+                            title: '投手',
+                            dataIndex: 'putUser',
+                            key: 'putUser',
+                            align: 'center',
+                            width: 70,
+                            ellipsis: true,
+                            render: (value) => {
+                                return value?.nickname || '--'
+                            }
+                        },
+                        {
+                            title: '运营助理',
+                            dataIndex: 'userList',
+                            key: 'userList',
+                            width: 120,
+                            ellipsis: true,
+                            render: (value) => {
+                                return value?.map(item => item.nickname)?.join('、') || '--'
+                            }
+                        },
+                        {
+                            title: '状态',
+                            dataIndex: 'status',
+                            key: 'status',
+                            width: 70,
+                            align: 'center',
+                            render: (value) => {
+                                return STATUSENUM[value]
+                            }
+                        }
+                    ]}
+                    dataSource={getCorpUserChatList?.data?.data?.records}
+                    scroll={{ y: 350 }}
+                    rowKey={'id'}
+                    size='small'
+                    loading={getCorpUserChatList?.loading}
+                    pagination={{
+                        total: getCorpUserChatList?.data?.data?.total,
+                        showTotal: (total) => `共 ${total} 条数据`,
+                        showQuickJumper: true,
+                        showSizeChanger: true,
+                        pageSizeOptions: ['10', '20', '50', '100'],
+                        onChange: (pageNum, pageSize) => {
+                            setQueryParams({ ...queryParams, pageNum, pageSize })
+                            setQueryParamsNew({ ...queryParamsNew, pageNum, pageSize })
+                        }
+                    }}
+                    rowSelection={{
+                        type: 'checkbox',
+                        selectedRowKeys: editSelectedRow?.map(item => item.id),
+                        onSelect: (record, selected: any) => {
+                            if (selected) {
+                                setEditSelectedRow([...editSelectedRow, record])
+                            } else {
+                                setEditSelectedRow(editSelectedRow?.filter(item => item.id !== record.id))
+                            }
+                        },
+                        onSelectAll: (selected: any, rows: any, changeRows: any[]) => {
+                            if (selected) {
+                                setEditSelectedRow([...editSelectedRow, ...changeRows])
+                            } else {
+                                let newArr = editSelectedRow?.filter(item => changeRows.every(i => i?.id !== item?.id))
+                                setEditSelectedRow(newArr)
+                            }
+                        }
+                    }}
+                />
+            </div>
+        </div>
+    </Modal>
+});
+
+export default SelectGroupLeader;

+ 2 - 1
src/pages/weComTask/page/groupLeaderManage/tableConfig.tsx

@@ -2,6 +2,7 @@ import { copy } from "@/utils/utils"
 import { ColumnsType } from "antd/es/table"
 import { Button, Flex, Popconfirm, Popover, Tag } from "antd"
 import BindDetails from "./bindDetails"
+import { STATUSENUM } from "."
 
 
 export function GroupLeaderTableConfig(): ColumnsType<any> {
@@ -78,7 +79,7 @@ export function GroupLeaderTableConfig(): ColumnsType<any> {
             width: 70,
             align: 'center',
             render: (value) => {
-                return value ? <Tag color="success">可用</Tag> : <Tag color="error">禁用</Tag>
+                return STATUSENUM[value]
             }
         },
         {