jude-cehua/templates/login.html

<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>登录 - 聚德AI短视频脚本撰写</title>
	<meta name="description" content="登录聚德AI短视频脚本撰写器">
	<meta name="theme-color" content="#6366f1">
	<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
	<link rel="stylesheet" href="{{ url_for('static', filename='css/login.css') }}">
	<link rel="icon" href="{{ url_for('static', filename='logo.png') }}">
	<link rel="stylesheet" href="{{ url_for('static', filename='css/fonts.css') }}">
</head>

<body>
	<!-- 背景动画元素 -->
	<div class="animated-background">
		<div class="floating-shapes">
			<div class="shape shape-1"></div>
			<div class="shape shape-2"></div>
			<div class="shape shape-3"></div>
			<div class="shape shape-4"></div>
			<div class="shape shape-5"></div>
		</div>
		<div class="gradient-overlay"></div>
	</div>

	<div class="login-container">
		<div class="login-card glass-panel">
			<!-- 装饰性元素 -->
			<div class="card-decoration">
				<div class="decoration-line"></div>
				<div class="decoration-dot"></div>
				<div class="decoration-line"></div>
			</div>

			<div class="login-header">
				<div class="logo-container">
					<div class="logo-glow"></div>
					<img src="{{ url_for('static', filename='logo.png') }}" alt="聚德AI" class="login-logo">
				</div>
				<h1>聚德AI短视频脚本撰写</h1>
				<p class="login-subtitle">智能创作，高效输出</p>
				<div class="header-underline"></div>
			</div>

			<div class="login-methods">
				<!-- 钉钉登录 -->
				<div class="login-method">
					<div class="method-icon">
						<div class="icon-bg"></div>
						<img src="{{ url_for('static', filename='img/dingding.svg') }}" alt="钉钉" class="method-svg">
					</div>
					<div class="method-info">
						<h3>钉钉登录</h3>
						<p>钉钉账号快速登录</p>
					</div>
					<button class="login-btn dingtalk-btn" id="dingtalk-login">
						<span class="btn-text">钉钉登录</span>
						<span class="btn-icon">→</span>
					</button>
				</div>

				<!-- 企业微信登录 -->
				<div class="login-method">
					<div class="method-icon">
						<!-- <div class="icon-bg"></div> -->
						<img style="width: 50px;height: 50px;" src="{{ url_for('static', filename='img/wx.svg') }}" alt="企业微信"
							class="method-svg">
					</div>
					<div class="method-info">
						<h3>企业微信登录</h3>
						<p>企业微信账号快速登录</p>
					</div>
					<button class="login-btn dingtalk-btn" id="wx-login">
						<span class="btn-text">企业微信登录</span>
						<span class="btn-icon">→</span>
					</button>
				</div>
			</div>

			<div class="login-footer">
				<p>©2025 成都聚德鼎盛文化传播有限公司</p>
			</div>
		</div>

		<!-- 登录状态提示 -->
		<div id="login-status" class="login-status" style="display: none;">
			<div class="status-content glass-panel">
				<div class="status-icon">⏳</div>
				<div class="status-text">正在处理登录...</div>
			</div>
		</div>
	</div>

	<script src="{{ url_for('static', filename='js/login.js') }}"></script>
</body>

</html>