瀏覽代碼

localStorage

nieyuge 2 周之前
父節點
當前提交
a3313ffc60
共有 2 個文件被更改,包括 52 次插入2 次删除
  1. 51 2
      src/views/publishContent/videos/index.tsx
  2. 1 0
      src/views/setting/setting.tsx

+ 51 - 2
src/views/publishContent/videos/index.tsx

@@ -1,4 +1,4 @@
-import { Button, Input, Select, Table, Spin, Popconfirm, message, Popover } from 'antd';
+import { Button, Input, Select, Table, Spin, Popconfirm, message, Popover, Modal } from 'antd';
 import React, { useState, useEffect } from 'react';
 import styles from './index.module.css';
 import http from '@src/http/index';
@@ -8,6 +8,7 @@ import { enumToOptions } from '@src/utils/helper';
 import { UploadContentResponse } from './type';
 import dayjs from 'dayjs';
 import VideoPlayModal from '../weCom/components/videoPlayModal';
+import { UserInfo } from '../../setting/type';
 // Define a type for the expected API response (adjust if needed based on actual API)
 const TableHeight = window.innerHeight - 380;
 
@@ -33,12 +34,31 @@ const MyVideos: React.FC = () => {
 	const [playVideoTitle, setPlayVideoTitle] = useState('');
 	const [isAddPlanLoading] = useState(false);
 	const [editingVideo, setEditingVideo] = useState<any>(null);
+	const [pqUserInfo, setPqUserInfo] = useState<UserInfo | null>(null);
+	const [showLoginModal, setShowLoginModal] = useState(false);
 	
-	// 页面加载时调用getTableData
+	// 页面加载时调用getTableData和检查用户登录状态
 	useEffect(() => {
 		getTableData();
+		checkUserLoginStatus();
 	}, []);
 
+	// 检查用户登录状态
+	const checkUserLoginStatus = () => {
+		const userInfoStr = localStorage.getItem('pq_userInfo');
+		if (userInfoStr) {
+			try {
+				const userInfo = JSON.parse(userInfoStr) as UserInfo;
+				setPqUserInfo(userInfo);
+			} catch (error) {
+				console.error('解析用户信息失败', error);
+				setPqUserInfo(null);
+			}
+		} else {
+			setPqUserInfo(null);
+		}
+	};
+
 	const getTableData = async (_pageNum?: number, _pageSize?: number) => {
 		setIsLoading(true);
 		http.post<UploadContentResponse>(uploadContentList, {
@@ -111,12 +131,22 @@ const MyVideos: React.FC = () => {
 	]
 
 	const handleUploadVideo = () => {
+		// 检查用户是否已登录
+		if (!pqUserInfo) {
+			setShowLoginModal(true);
+			return;
+		}
 		setEditingVideo(null);
 		setIsShowUploadVideoModal(true);
 		getTableData(pageNum, pageSize)
 	}
 
 	const handleEditVideo = (record: any) => {
+		// 检查用户是否已登录
+		if (!pqUserInfo) {
+			setShowLoginModal(true);
+			return;
+		}
 		setEditingVideo(record);
 		setIsShowUploadVideoModal(true);
 	}
@@ -147,6 +177,12 @@ const MyVideos: React.FC = () => {
 		return location.href = '/publishContent/wegzh/' + record.videoId;
 	}
 
+	// 引导用户去登录
+	const goToLogin = () => {
+		setShowLoginModal(false);
+		window.location.href = '/setting';
+	}
+
 	return (
 		<Spin spinning={isLoading}>
 			<div className="rounded-lg">
@@ -214,6 +250,19 @@ const MyVideos: React.FC = () => {
 					videoUrl={playVideoUrl}
 					title={playVideoTitle}
 				/>
+				<Modal
+					visible={showLoginModal}
+					title="请先登录"
+					onCancel={() => setShowLoginModal(false)}
+					footer={null}
+				>
+					<div className="text-center py-6">
+						<p className="mb-4">您需要先登录才能上传或编辑视频</p>
+						<Button type="primary" onClick={goToLogin}>
+							去登录
+						</Button>
+					</div>
+				</Modal>
 			</div>
 		</Spin>
 	);

+ 1 - 0
src/views/setting/setting.tsx

@@ -32,6 +32,7 @@ const Setting = () => {
 				const { code, data } = res;
 				if (code === 0 && data) {
 					setPqUserInfo(data as UserInfo)
+					localStorage.setItem('pq_userInfo', JSON.stringify(data as UserInfo))
 				} else {
 					renderQrcode()
 				}