|
|
@@ -0,0 +1,63 @@
|
|
|
+import { useAjax } from "@/Hook/useAjax"
|
|
|
+import { getRelationGroupListApi } from "@/services/adqV3/global"
|
|
|
+import { LinkOutlined } from "@ant-design/icons"
|
|
|
+import { Button, Modal, Table } from "antd"
|
|
|
+import React, { useState } from "react"
|
|
|
+
|
|
|
+
|
|
|
+const AssociateCSG: React.FC<{ localCorpCsgroupId: number }> = ({ localCorpCsgroupId }) => {
|
|
|
+
|
|
|
+ /****************************************/
|
|
|
+ const [visible, setVisible] = useState<boolean>(false)
|
|
|
+
|
|
|
+ const getRelationGroupList = useAjax((params) => getRelationGroupListApi(params))
|
|
|
+ /****************************************/
|
|
|
+
|
|
|
+ const getList = () => {
|
|
|
+ setVisible(true)
|
|
|
+ getRelationGroupList.run({ localCorpCsgroupId })
|
|
|
+ }
|
|
|
+
|
|
|
+ return <>
|
|
|
+ <Button icon={<LinkOutlined />} style={{ border: 'none', fontSize: 12, padding: 0 }} size='small' onClick={getList}>已关联客服组</Button>
|
|
|
+
|
|
|
+ {visible && <Modal
|
|
|
+ title={<strong>已关联腾讯客服组</strong>}
|
|
|
+ open={visible}
|
|
|
+ onCancel={() => setVisible(false)}
|
|
|
+ footer={null}
|
|
|
+ width={650}
|
|
|
+ >
|
|
|
+ <Table
|
|
|
+ columns={[
|
|
|
+ {
|
|
|
+ title: '客服组名称',
|
|
|
+ dataIndex: 'groupName',
|
|
|
+ key: 'groupName',
|
|
|
+ width: 220,
|
|
|
+ ellipsis: true,
|
|
|
+ render(value, records) {
|
|
|
+ return <span style={{ fontSize: 12 }}>{value}({records.groupId})</span>
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'AccountId',
|
|
|
+ dataIndex: 'accountId',
|
|
|
+ key: 'accountId',
|
|
|
+ render(value) {
|
|
|
+ return <span style={{ fontSize: 12 }}>{value}</span>
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ dataSource={getRelationGroupList.data}
|
|
|
+ size="small"
|
|
|
+ loading={getRelationGroupList?.loading}
|
|
|
+ scroll={{ y: 500 }}
|
|
|
+ rowKey={'groupId'}
|
|
|
+ />
|
|
|
+ </Modal>}
|
|
|
+ </>
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+export default React.memo(AssociateCSG)
|