登录 根据 firstLogin 状态 弹出修改密码

src/pages/index/components/ChangePasswordModal.tsx

@@ -0,0 +1,85 @@
+import React, { useEffect }  from 'react';
+import { Modal, Form, Input } from 'antd';
+// props: visible, onOk, onCancel
+const ChangePasswordModal: React.FC<{
+  visible: boolean;
+  onOk: (values: { userId: string; newPassword: string; confirmPassword: string }) => Promise<void>;
+  onCancel: () => void;
+}> = ({ visible, onOk, onCancel }) => {
+  const [form] = Form.useForm();
+
+  useEffect(() => {
+    const userinfo = JSON.parse(sessionStorage.getItem('Userinfo') ?? '{}');
+    form.setFieldsValue({
+        userId: userinfo.userId,
+        userName:  userinfo.loginName
+    })
+
+  },[form])
+
+  const handleOk = async () => {
+    try {
+      const values = await form.validateFields();
+      await onOk({ ...values });
+      form.resetFields();
+    } catch (err) {}
+  };
+
+  return (
+    <Modal
+      title="首次登录请修改密码"
+      visible={visible}
+      onOk={handleOk}
+      onCancel={onCancel}
+      okText="确认修改"
+      cancelText="取消"
+      maskClosable={false}
+      closable={false}
+      destroyOnClose
+    >
+      <Form
+        form={form}
+        labelCol={{ flex: '100px' }}
+        initialValues={{ newPassword: '', confirmPassword: '' }}
+      >
+        <Form.Item name="userId" noStyle>
+            <Input type="hidden" />
+        </Form.Item>
+        <Form.Item
+          label="用户"
+          name="userName"
+        >
+          <Input readOnly />
+        </Form.Item>
+      
+        <Form.Item
+          label="新密码"
+          name="newPassword"
+          rules={[
+            { required: true, message: '请输入新密码' },
+          ]}
+        >
+          <Input.Password />
+        </Form.Item>
+        <Form.Item
+          label="确认新密码"
+          name="confirmPassword"
+          dependencies={['newPassword']}
+          rules={[
+            { required: true, message: '请确认新密码' },
+            ({ getFieldValue }) => ({
+              validator(_, value) {
+                if (!value || getFieldValue('newPassword') === value) return Promise.resolve();
+                return Promise.reject('两次输入密码不一致');
+              },
+            }),
+          ]}
+        >
+          <Input.Password />
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+
+export default ChangePasswordModal;

src/pages/index/index.tsx

@@ -1,7 +1,10 @@
 import React, { useEffect, useState } from 'react';
 import { Card, Row, Col, Spin, message } from 'antd';
 import { Column, Pie, Bar } from '@ant-design/charts';
+import ChangePasswordModal from './components/ChangePasswordModal';
+
 import {
+  changePasswordOnFirstLogin,
   getYearcountNum,
   getAccessTypeCountNum,
   getSupplierTypeCountNum,
@@ -19,6 +22,39 @@ const HomeDashboard: React.FC = () => {
   const [supplierAuditData, setSupplierAuditData] = useState<any[]>([]);
   const [loading, setLoading] = useState(false);
 
+  // ======= 新增部分：弹窗控制 =======
+  const [showChangePwd, setShowChangePwd] = useState(false);
+  useEffect(() => {
+    // 检查 firstLogin
+    const userStr = sessionStorage.getItem('currentUser');
+    if (userStr) {
+      try {
+        const userObj = JSON.parse(userStr);
+        if (userObj?.supplierUser?.firstLogin === 0) {
+          setShowChangePwd(true);
+        }
+      } catch (e) { }
+    }
+  }, []);
+  // 修改密码确认回调
+  const handleChangePwd = async (values: { userId: string; newPassword: string; confirmPassword: string; }) => {
+    try {
+      await changePasswordOnFirstLogin({ ...values });
+      message.success('密码修改成功，请重新登录');
+      // 更新缓存 firstLogin=1
+      const userStr = sessionStorage.getItem('currentUser');
+      if (userStr) {
+        const userObj = JSON.parse(userStr);
+        if (userObj?.supplierUser) userObj.supplierUser.firstLogin = 1;
+        sessionStorage.setItem('currentUser', JSON.stringify(userObj));
+      }
+      setShowChangePwd(false);
+
+    } catch (e: any) {
+      message.error(e?.message || '修改密码失败');
+    }
+  };
+
   useEffect(() => {
     setLoading(true);
     Promise.all([
@@ -156,6 +192,12 @@ const HomeDashboard: React.FC = () => {
   };
 
   return (
+    <>
+      <ChangePasswordModal
+        visible={showChangePwd}
+        onOk={handleChangePwd}
+        onCancel={() => { }}
+      />
       <Spin spinning={loading}>
         <Row gutter={[24, 24]}>
           {/* 第一行：3图 */}
@@ -187,6 +229,8 @@ const HomeDashboard: React.FC = () => {
           </Col>
         </Row>
       </Spin>
+    </>
+
   );
 };
 

src/pages/index/servers.ts

@@ -1,5 +1,18 @@
 import request from '@/utils/request';
 
+/**
+ * 
+ * @param params 
+ * @returns 
+ *  
+ */
+interface PasswordOnFirstLogin {
+    userId:string;
+    newPassword:string;
+    confirmPassword:string;
+}
+export const changePasswordOnFirstLogin = (data:PasswordOnFirstLogin) => request.post(`/v1/login/supplier/changePasswordOnFirstLogin`, { data});
+
 /**
  * 
  * @param params