nouffer/rogaining_srv
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Release 4-8-6

Browse Source
This commit is contained in:
Akira Miyata
2024-08-02 14:21:50 +00:00
parent 9d0d3ea102
commit d851e7e4ad
9 changed files with 448 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
rog/templates/email/reset_password_email.txt Normal file
View File

@ -0,0 +1,23 @@
件名: 岐阜ロゲのパスワードリセットのお知らせ
{{name}} 様
こちらは岐阜ａｉネットワークのAI担当です。
このメールはパスワードのリセットのご依頼によるリセット確認メールです。
身に覚えのない方は、お手数ですが削除をお願いします。
以下のリンクからパスワードのリセットが行えます。
{{activation_link}}
それでは、今後とも岐阜ロゲをよろしくお願いいたします。
※ 本メールは送信専用のメールアドレスで送信しております。 本メールに返信いただいてもご回答いたしかねますので、あらかじめご了承ください（ご質問等はinfo@gifuai.netまでお願いいたします）。もしこのメールに心当たりがない場合は破棄願います。
NPO岐阜aiネットワーク 担当AI

116
rog/templates/password-reset-component.tsx Normal file
View File

@ -0,0 +1,116 @@
import React, { useState } from 'react';
import { useParams } from 'react-router-dom';
import { Eye, EyeOff } from 'lucide-react';
const PasswordReset = () => {
const [password, setPassword] = useState('');
const [confirmPassword, setConfirmPassword] = useState('');
const [showPassword, setShowPassword] = useState(false);
const [message, setMessage] = useState('');
const { uid, token } = useParams();
const handleSubmit = async (e) => {
e.preventDefault();
if (password !== confirmPassword) {
setMessage('パスワードが一致しません。');
return;
}
try {
const response = await fetch(`/api/reset-password/${uid}/${token}/`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ new_password: password }),
});
const data = await response.json();
if (response.ok) {
setMessage('パスワードが正常にリセットされました。');
} else {
setMessage(data.message || 'パスワードのリセットに失敗しました。');
}
} catch (error) {
setMessage('エラーが発生しました。もう一度お試しください。');
}
};
return (
<div className="min-h-screen bg-gray-100 flex flex-col justify-center py-12 sm:px-6 lg:px-8">
<div className="sm:mx-auto sm:w-full sm:max-w-md">
<h2 className="mt-6 text-center text-3xl font-extrabold text-gray-900">
パスワードのリセット
</h2>
</div>
<div className="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
<div className="bg-white py-8 px-4 shadow sm:rounded-lg sm:px-10">
<form className="space-y-6" onSubmit={handleSubmit}>
<div>
<label htmlFor="password" className="block text-sm font-medium text-gray-700">
新しいパスワード
</label>
<div className="mt-1 relative">
<input
id="password"
name="password"
type={showPassword ? "text" : "password"}
autoComplete="new-password"
required
value={password}
onChange={(e) => setPassword(e.target.value)}
className="appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
/>
<button
type="button"
className="absolute inset-y-0 right-0 pr-3 flex items-center"
onClick={() => setShowPassword(!showPassword)}
>
{showPassword ? (
<EyeOff className="h-5 w-5 text-gray-400" />
) : (
<Eye className="h-5 w-5 text-gray-400" />
)}
</button>
</div>
</div>
<div>
<label htmlFor="confirm-password" className="block text-sm font-medium text-gray-700">
パスワードの確認
</label>
<div className="mt-1">
<input
id="confirm-password"
name="confirm-password"
type="password"
autoComplete="new-password"
required
value={confirmPassword}
onChange={(e) => setConfirmPassword(e.target.value)}
className="appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
/>
</div>
</div>
<div>
<button
type="submit"
className="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
>
パスワードをリセット
</button>
</div>
</form>
{message && (
<div className="mt-6 text-center text-sm text-gray-500">
{message}
</div>
)}
</div>
</div>
</div>
);
};
export default PasswordReset;

156
rog/templates/password_reset.html Normal file
View File

@ -0,0 +1,156 @@
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>パスワードのリセット</title>
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
background-color: #f0f2f5;
margin: 0;
padding: 20px;
line-height: 1.6;
}
.container {
background-color: white;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
padding: 20px;
max-width: 400px;
margin: 0 auto;
}
h1 {
color: #1a1a1a;
text-align: center;
margin-bottom: 20px;
}
.form-group {
margin-bottom: 15px;
}
label {
display: block;
margin-bottom: 5px;
color: #4a4a4a;
}
input[type="password"] {
width: 100%;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
box-sizing: border-box;
}
button {
width: 100%;
padding: 10px;
background-color: #0056b3;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
}
button:hover {
background-color: #003d82;
}
.message {
margin-top: 15px;
padding: 10px;
border-radius: 4px;
text-align: center;
}
.message.error {
background-color: #ffe6e6;
color: #d8000c;
}
.message.success {
background-color: #e6ffe6;
color: #006400;
}
</style>
</head>
<body>
<div class="container">
<h1>岐阜ナビ：パスワードのリセット</h1>
<form id="reset-form">
<div class="form-group">
<label for="password">新しいパスワード</label>
<input type="password" id="password" name="password" required>
</div>
<div class="form-group">
<label for="confirm-password">パスワードの確認</label>
<input type="password" id="confirm-password" name="confirm-password" required>
</div>
<button type="submit">パスワードをリセット</button>
</form>
<div id="message" class="message"></div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const currentUrl = window.location.href;
function extractParams(url) {
const regex = /\/reset-password\/([^\/]+)\/([^\/]+)\/?/;
const match = url.match(regex);
if (match) {
return { uidb64: match[1], token: match[2] };
}
const urlParams = new URLSearchParams(new URL(url).search);
return {
uidb64: urlParams.get('uidb64') || '',
token: urlParams.get('token') || ''
};
}
const { uidb64, token } = extractParams(currentUrl);
document.getElementById('reset-form').addEventListener('submit', async function(e) {
e.preventDefault();
const password = document.getElementById('password').value;
const confirmPassword = document.getElementById('confirm-password').value;
const messageElement = document.getElementById('message');
if (password !== confirmPassword) {
messageElement.textContent = 'パスワードが一致しません。';
messageElement.className = 'message error';
return;
}
if (!uidb64 || !token) {
messageElement.textContent = '無効なリセットリンクです。';
messageElement.className = 'message error';
return;
}
try {
const response = await fetch(`/api/reset-password/${uidb64}/${token}/`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
new_password: password,
confirm_password: confirmPassword
}),
});
const data = await response.json();
if (response.ok) {
messageElement.textContent = 'パスワードが正常にリセットされました。';
messageElement.className = 'message success';
} else {
messageElement.textContent = `パスワードのリセットに失敗しました。エラー: ${data.error || response.statusText}`;
messageElement.className = 'message error';
}
} catch (error) {
console.error('Error:', error);
messageElement.textContent = 'エラーが発生しました。もう一度お試しください。';
messageElement.className = 'message error';
}
});
});
</script>
</body>
</html>

41
rog/templates/password_reset_invalid.html Normal file
View File

@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>無効なパスワードリセットリンク</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f3f4f6;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.container {
background-color: white;
padding: 2rem;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
text-align: center;
}
h1 {
color: #1f2937;
margin-bottom: 1rem;
}
p {
color: #4b5563;
}
</style>
</head>
<body>
<div class="container">
<h1>無効なリンク</h1>
<p>このパスワードリセットリンクは無効です。新しいリセットリンクを要求してください。</p>
</div>
</body>
</html>