F

src/pages/member/Edit.jsx

@@ -32,9 +32,9 @@ export default (props) => {
   ];
   const contentList = {
     // 会员基本信息
-    tab1: <MemberInfo memberList={memberList} />,
+    tab1: <MemberInfo key="1" memberList={memberList} />,
     // 会员卡信息
-    tab2: <MemberCardInfo taMemberCardList={memberList?.taMemberCardList} />,
+    tab2: <MemberCardInfo key="2" taMemberCardList={memberList?.taMemberCardList} />,
   };
   return (
     <Page>

src/pages/member/components/MemberCardInfo.jsx

@@ -1,41 +1,37 @@
 import React from "react";
-import { Card } from "antd";
+import { Button, Card, Switch } from "antd";
 export default (props) => {
   const { taMemberCardList } = props;
 
-  const CardAll = () => {
-    return (taMemberCardList || []).map((it) => {
-      return (
-        <Card
-          id={it?.cardId}
-          style={{ width: "100%" }}
-          title={it?.cardType ? it?.cardType : "会员卡"}
-        >
-          <Card.Grid>
-            <Card.Meta title="开卡人姓名" description={it?.memberName} />
-          </Card.Grid>
-          <Card.Grid>
-            <Card.Meta title="手机号" description={it?.memberPhone} />
-          </Card.Grid>
-          <Card.Grid>
-            <Card.Meta title="总次数" description={it?.totalAmount} />
-          </Card.Grid>
-          <Card.Grid>
-            <Card.Meta title="剩余次数" description={it?.leftAmount} />
-          </Card.Grid>
-          <Card.Grid>
-            <Card.Meta title="开卡日期" description={it?.bizDate} />
-          </Card.Grid>
-          <Card.Grid>
-            <Card.Meta title="总时长" description={it?.totalTime} />
-          </Card.Grid>
-          <Card.Grid>
-            <Card.Meta title="截止日期" description={it?.expireTime} />
-          </Card.Grid>
-        </Card>
-      );
-    });
-  };
 
-  return <CardAll />;
+  return (taMemberCardList || []).map((it) => (
+      <Card
+        key={it?.cardId}
+        style={{ width: "100%", marginTop: 16 }}
+        title={it?.cardType ? it?.cardType : "会员卡"}
+        loading={!it}
+      >
+        <Card.Grid>
+          <Card.Meta title="开卡人姓名" description={it?.memberName} />
+        </Card.Grid>
+        <Card.Grid>
+          <Card.Meta title="手机号" description={it?.memberPhone} />
+        </Card.Grid>
+        <Card.Grid>
+          <Card.Meta title="总次数" description={it?.totalAmount} />
+        </Card.Grid>
+        <Card.Grid>
+          <Card.Meta title="剩余次数" description={it?.leftAmount} />
+        </Card.Grid>
+        <Card.Grid>
+          <Card.Meta title="开卡日期" description={it?.bizDate} />
+        </Card.Grid>
+        <Card.Grid>
+          <Card.Meta title="总时长" description={it?.totalTime} />
+        </Card.Grid>
+        <Card.Grid>
+          <Card.Meta title="截止日期" description={it?.expireTime} />
+        </Card.Grid>
+      </Card>
+  ));
 };

src/pages/member/components/MemberInfo.jsx

@@ -3,10 +3,7 @@ import React from "react";
 export default (props) => {
   const { memberList } = props;
   return (
-    <Card
-      style={{ width: "100%" }}
-      title="会员信息"
-    >
+    <Card style={{ width: "100%" }} title="会员信息">
       <Card.Grid>
         <Card.Meta title="会员名称" description={memberList?.memberName} />
       </Card.Grid>
@@ -14,15 +11,22 @@ export default (props) => {
         <Card.Meta title="手机号" description={memberList?.phone} />
       </Card.Grid>
       <Card.Grid>
-        <Card.Meta title="性别" description={memberList?.sex} />
+        <Card.Meta
+          title="性别"
+          description={
+            memberList?.sex == 1 ? "男" : memberList?.sex == 2 ? "女" : "未知"
+          }
+        />
       </Card.Grid>
       <Card.Grid>
-        <Card.Meta title="状态" description={memberList?.status} />
+        <Card.Meta
+          title="状态"
+          description={memberList?.status == 1 ? "正常" : "异常"}
+        />
       </Card.Grid>
       <Card.Grid>
         <Card.Meta title="注册日期" description={memberList?.bizDate} />
       </Card.Grid>
-
     </Card>
   );
 };

src/pages/member/components/SelectCardModal.jsx

@@ -14,11 +14,18 @@ export default (props) => {
       (res.records || []).map((x) => {
         packList[x.packageId] = x.packageName;
       });
+      let disabledNum = 0;
       const data = cardList?.map((x) => {
+        // const dataNum = record.taMemberCardList.reduce((total, item) => {
+        //   return (total += item.leftAmount);
+        // }, 0);
+        disabledNum += x.leftAmount;
+        console.log(disabledNum);
         return {
           ...x,
           value: x.cardId,
           label: packList[x.packageId],
+          disabled: !disabledNum,
         };
       });
       setCardOptions(data);

src/pages/member/index.jsx

@@ -82,18 +82,31 @@ export default (props) => {
       <List
         // actionRef={actionRef}
         rowKey="memberId"
-        onEdit={(record) => navigate(`/member/edit?id=${record.memberId}`)}
-        columnOptionRender={(_, record) => [
-          <Button
-            key="A2"
-            style={{ padding: 0 }}
-            type="link"
-            disabled={!record.taMemberCardList?.length}
-            onClick={() => onModalNewCard("核销卡", record)}
-          >
-            核销卡
-          </Button>,
-        ]}
+        // onEdit={(record) => navigate(`/member/edit?id=${record.memberId}`)}
+        columnOptionRender={(_, record) => {
+          const dataNum = record.taMemberCardList.reduce((total, item) => {
+            return (total += item.leftAmount);
+          }, 0);
+          return [
+            <Button
+              key="A3"
+              style={{ padding: 0 }}
+              type="link"
+              onClick={() => navigate(`/member/edit?id=${record.memberId}`)}
+            >
+              详情
+            </Button>,
+            <Button
+              key="A2"
+              style={{ padding: 0 }}
+              type="link"
+              disabled={!dataNum}
+              onClick={() => onModalNewCard("核销卡", record)}
+            >
+              核销卡
+            </Button>,
+          ];
+        }}
         request={getTaMember}
         columns={columns}
         toolBarRender={(record) => {