R18-1/R18-3: 接入企业微信入口绑定与免登回退

client/src/pages/ProfilePage.tsx

@@ -1,8 +1,22 @@
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { useSearchParams } from "react-router-dom";
+import { fetchWecomConfig, startWecomBind, unbindWecom } from "../api/auth";
 import { PageHeader } from "../components/common/PageHeader";
 import { useAuth } from "../auth/AuthContext";
+import { Button } from "../components/ui/button";
 
 export function ProfilePage() {
   const { me, permissions } = useAuth();
+  const [searchParams] = useSearchParams();
+  const wecomConfigQuery = useQuery({ queryKey: ["auth", "wecom-config"], queryFn: () => fetchWecomConfig(), staleTime: 60_000 });
+  const bindMutation = useMutation({
+    mutationFn: async () => startWecomBind("/settings/profile"),
+    onSuccess: (payload) => { window.location.assign(payload.loginUrl); },
+  });
+  const unbindMutation = useMutation({
+    mutationFn: () => unbindWecom(),
+    onSuccess: () => { window.location.reload(); },
+  });
 
   return (
     <div>
@@ -38,6 +52,21 @@ export function ProfilePage() {
         </dl>
       </section>
 
+      <section className="card-std mt-4">
+        <h3 className="card-title">企业微信绑定</h3>
+        <div className="space-y-3 text-sm text-zinc-700">
+          <div>接入状态：<span className="font-medium text-zinc-900">{wecomConfigQuery.data?.enabled ? "已启用" : "未启用"}</span></div>
+          <div>绑定状态：<span className="font-medium text-zinc-900">{me?.wecomBinding?.externalUserId ?? "未绑定"}</span></div>
+          {searchParams.get("wecomBind") ? (
+            <div className="rounded-lg border border-zinc-200 bg-zinc-50 px-3 py-2">绑定结果：{searchParams.get("wecomBind")}</div>
+          ) : null}
+          <div className="flex flex-wrap gap-2">
+            <Button type="button" variant="secondary" disabled={!wecomConfigQuery.data?.enabled || bindMutation.isPending} onClick={() => bindMutation.mutate()}>绑定企业微信</Button>
+            <Button type="button" variant="secondary" disabled={!me?.wecomBinding || unbindMutation.isPending} onClick={() => unbindMutation.mutate()}>解绑企业微信</Button>
+          </div>
+        </div>
+      </section>
+
       <section className="card-std mt-4">
         <h3 className="card-title">权限列表</h3>
         <div className="flex flex-wrap gap-2">