shenwu 6 months ago
parent
commit
97025a5fa8
1 changed files with 57 additions and 42 deletions
  1. 57 42
      src/pages/MiniApp/EmsCnpl/Auth/index.tsx

+ 57 - 42
src/pages/MiniApp/EmsCnpl/Auth/index.tsx

@@ -1,21 +1,30 @@
-import { ActionType, PageContainer, ProTable } from "@ant-design/pro-components"
-import { columns } from "./tableConfig"
+import { PageContainer } from "@ant-design/pro-components"
 import { useAjax } from "@/Hook/useAjax"
 import { history, useModel } from "@umijs/max"
-import { Button, message } from "antd"
-import { PlusCircleOutlined } from "@ant-design/icons"
+import { Avatar, Image, Card, Col, message, Row, Space, Badge, Button, Empty } from "antd"
+import {  PlusOutlined, RedoOutlined } from "@ant-design/icons"
 import { authSuccess, getMpAccount, preAuth } from "@/services/miniApp/emsCnpl"
-import { useEffect, useRef } from "react"
+import { useEffect, useState } from "react"
 import { searchToObj } from "@/utils"
-
+import { Typography } from 'antd';
+const { Title, Text } = Typography;
 const Page: React.FC = () => {
     let { initialState } = useModel("@@initialState")
-    const actionRef = useRef<ActionType>();
-    let getList = useAjax((params) => getMpAccount(params), { type: 'table' })
+    let { getEnum } = useModel("global")
+    let [data, setData] = useState<any>(null)
+    let getList = useAjax((params) => getMpAccount(params))
     let PreAuth = useAjax((params) => preAuth(params)) //授权地址
     let AuthSuccess = useAjax((params) => authSuccess(params)) //授权
-    
+
     useEffect(() => {
+        getList.run({
+            appType: initialState?.selectApp?.appType,
+            appId: initialState?.selectApp?.id,
+        }).then(res => {
+            if (res.code === 200) {
+                setData(res.data)
+            }
+        })
         // 授权回调
         if (history.location.search) {
             let obj = searchToObj(history.location.search)
@@ -29,12 +38,11 @@ const Page: React.FC = () => {
                 }).then(res => {
                     if (res.code === 200) {
                         message.success("授权成功")
-                        actionRef?.current?.reload()
+                        history.push("/miniApp/emsCnpl/auth")
                     }
                 })
             }
         }
-        console.log("history.location.search", history.location.search)
     }, [])
     // 授权
     const auth = () => {
@@ -46,37 +54,44 @@ const Page: React.FC = () => {
     }
     return <PageContainer title={false}
     >
-        <ProTable<any, any>
-            actionRef={actionRef}
-            scroll={{ x: true }}
-            toolBarRender={() => {
-                return [
-                    <Button
-                        type="primary"
-                        onClick={auth}
-                    >
-                        <PlusCircleOutlined />
-                        授权
-                    </Button>,
-                ];
-            }}
-            params={{
-                appId: initialState?.selectApp?.id || "",
-                appType: initialState?.selectApp?.appType || "",
-                linkType: 1,
-            }}
-            headerTitle={"已授权公众号列表"}
-            rowKey={(r) => r.linkId}
-            search={{
-                labelWidth: 90,
-                span: 4
-            }}
-            request={async (params) => {
-                return await getList.run(params)
-            }}
-            columns={columns(initialState?.selectApp?.appCategory || 1)}
-        // bordered
-        />
+        {
+            data ? <Card title={<Space> <Avatar shape="square" size={34} src={data?.headImg} />{data?.nickName}</Space>} bordered={false} style={{ width: '100%' }} extra={<Button type="primary" danger onClick={auth}><RedoOutlined />重新授权</Button>}>
+                <Row gutter={[20, 20]}>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>公众号AppId</Title>
+                        <Text type="secondary" copyable>{data?.mpAppId}</Text>
+                    </Col>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>公众号类型</Title>
+                        <Text type="secondary">{["订阅号", "由历史老账号升级后的订阅号", "服务号"][data?.serviceTypeInfo]}</Text>
+                    </Col>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>公众号认证类型</Title>
+                        <Text type="secondary">{getEnum("VERIFYTYPE", "map").get(data?.verifyTypeInfo)}</Text>
+                    </Col>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>主体名称</Title>
+                        <Text type="secondary">{data?.principalName}</Text>
+                    </Col>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>原始ID</Title>
+                        <Text type="secondary" copyable>{data?.userName}</Text>
+                    </Col>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>公众号所设置的微信号</Title>
+                        <Text type="secondary" >{data?.alias}</Text>
+                    </Col>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>二维码</Title>
+                        <Image src={data?.qrcodeUrl} style={{ width: 25 }} />
+                    </Col>
+                    <Col span={6}>
+                        <Title level={5} style={{ marginBottom: 0 }}>授权状态</Title>
+                        <Badge status={data?.authStatus ? "success" : 'error'} text={data?.authStatus ? "已授权" : '未授权'} />
+                    </Col>
+                </Row>
+            </Card> : <div style={{ width: "100%", height: "100%", marginTop: "10%" }}><Empty description={<Space direction='vertical'><div>暂无绑定的公众号</div><Button type="primary" onClick={auth}><PlusOutlined />公众号授权</Button></Space>} /></div>
+        }
     </PageContainer>
 
 }