#!/usr/bin/env ruby
# -*- coding: utf-8 -*- 
require 'cgi'

cgi = CGI.new
cgi.charset = "UTF-8"  # CGIオブジェクトでUTF-8を明示的に設定する

name = cgi["fullname"]
message = cgi["message"]

puts "Content-type: text/html; charset=utf-8\n\n"  # 文字エンコーディングを明示する

puts (<<EOF)
<!DOCTYPE html>
<head lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HELPLIST</title>
    <!-- ここにCSSファイルのリンクを追加する場合 -->
    <!-- <link rel="stylesheet" href="styles.css"> -->
    <!-- ここにJavaScriptファイルのリンクを追加する場合 -->
    <!-- <script src="script.js" defer></script> -->
</head>
<body>
    <header>
        <h1>遊佐中学校_HELPLIST</h1>
        <nav>
            <ul>
                <!--<li><a href="#">ホーム</a></li>-->
                <li><a href="https://yuzatyu.edumap.jp/">ホーム</a></li>
                <li><a href="#">サービス</a></li>
                <li><a href="#">お問い合わせ</a></li>
            </ul>
        </nav>
    </header>

    <main>
        <h2>依頼はこちらへ</h2>
        <p>HELPLIST</p>
        <p>____________________________________________________________</p>
        <p>番号    依頼主    依頼内容    YuzaPoint    完了済み印    備考欄</p>
        <p>------------------------------------------------------------------------------------------</p>
        <p>(ex)0    遊佐太郎    委員会の仕事を手伝ってほしい    10pt    未完</p>
        <p>__________________________________________________________________________________________</p>

        <form method="POST" action="hello_after.rb">
            <p>あなたの名前: <input type="text" name="fullname"></p>
            <p>お問い合わせ内容: <input type="text" message="message"></p>
            <p><input type="submit" value="送信">
            <input type="reset" value="reset"></p>
        </form>
            <h2>こんにちは#{name}さん!</h2>
            <h2>お取り合わせ内容はこちらですね!:#{message}</h2>
    </main>

    <footer>
        <p>© 2024 遊佐中学校_HELPLIST. All rights reserved.</p>
    </footer>
</body>
</html>
EOF
