# PHP - 用php製作一個小系統
### 主題
因個人興趣，製作一個紀錄看過的小說、動漫&聽過喜歡的歌曲的小網頁。
#### 製作方式
用php執行後端程式，前端主要用bootstrap製作大致框架，css和些許js套件讓網頁前端更美觀。
#### 預想功能
- 首頁index.php： 包含兩大主題：小說類以及音樂類，還有可登入的通道
- 文章編輯頁面： 要記錄文章名稱、作者、簡介、心得讀後感，一個文章編輯頁面是必須的！
- mysql： 將撰寫的文章儲存在資料庫，資料庫使用的是mysql。
- 關於音樂：預想做一個串聯Spotify的api，紀錄喜歡的音樂並儲存在網站裡
- 關於動漫：目前是比照小說類的模式辦理，不過設想可以做做看爬蟲到影音平台，將影片用iframe做到本網站中觀看
- php後端，資料的傳輸動作
- 本次[bootstrap](https://getbootstrap.com/docs/5.0/layout/containers/)採用v5.0.2樣式

### 用Figma拉樣式

| 描述 | 圖片 |
|:---------------------------------------- |:------------------------------------------------------------:|
| index.php |  |
| index.php有login時||

### 實施紀錄
- [x] 24/02/26 index.php完成頁面navbar設計，還有登入login modal的樣式

- [x] 24/02/27 註冊頁面的樣式模板(signup.php)

- [x] 24/02/27 建立資料庫接收會員資訊
- - [x] 建立資料庫(**==postms.sql==**)
- - [x] 建立資料表(user)，專門儲存使用者會員
- - [x] 連結資料庫的程式碼 **==portcon.php==**
- - [x] 建立「禁止按enter」的script，和設定「密碼與重新設定密碼」的判斷

    <!---password define--->
<script>
    function on_submit(){
        var pwd = document.getElementById('inputPass');
        var repwd = document.getElementById('inputRePass');
        if(pwd.value != repwd.value){
            alert('密碼不一致');
            pwd.value = "";
            repwd.value = "";
            pwd.focus();
            return false;
        }
    }
</script>  
    
<script language="javascript" type="text/javascript">  
 //禁用Enter 
        document.onkeydown = function(event) {  
            var target, code, tag;  
            if (!event) {  
                event = window.event; //for ie  
                target = event.srcElement;  
                code = event.keyCode;  
                if (code == 13) {  
                    tag = target.tagName;  
                    if (tag == "TEXTAREA") { return true; }  
                    else { return false; }  
                }  
            }  
            else {  
                target = event.target; //for w3c
                code = event.keyCode;  
                if (code == 13) {  
                    tag = target.tagName;  
                    if (tag == "INPUT") { return false; }  
                    else { return true; }  
                }  
            }  
        };  
</script>

- - [x] 在signup.php 的 form action連結到user_update.php中，user_update.php將form的每個value insert進資料庫裡。

st=>start: include_once "portcon.php"
e=>end: 登出
op=>operation: 接收POST資料
op2=>operation: SQL INSERT
op3=>operation: 判斷是否成功

st->op->op2->op3->e

- [x] 24/02/27 完成登入的動作。登入後，「會員登入」會根據存好的session變化。將$_SESSION['mail']設定為user指標。

<?php
session_start();
include_once "portcon.php";
$ch_mail = addslashes($_POST["checkMail"]);

//從db找出帳號
$sql = "SELECT * FROM `user` WHERE Mail = '$ch_mail'";

$result = $conn->query($sql);
$row = $result->fetch_assoc();

//判斷帳號是否存在
if(!isset($row)){
    //若是帳號不存在，case設定為0
    $case = 0;
    //echo '無此帳號';
    //exit(header("Refresh:2;url=index.php"));
}else{
//比對密碼，解密
    if(addslashes($_POST['checkPass'] == $row['Password']))
    {
        //echo '密碼正確';
        $_SESSION['mail'] = $row['Mail'];
        $case = 1;
        //exit(header("Refresh:2;url=pspace.php"));
    
    }else{
        //echo '密碼錯誤';
        $case = 2;
    }

}

?>

- [x] 24/02/26 完成了首頁登入前後，「會員資料」顯示方式的對比。

session_start();
$sess_mail = $_SESSION['mail'];
//echo $sess_mail;

include_once"portcon.php";

$user_sql = "SELECT * FROM `user` WHERE Mail = '$sess_mail'";
$result = $conn->query($user_sql);
$user_row = $result->fetch_assoc();
$user = $user_row['Name'];


/*--------------------------------------------------*/
    <nav class="nav" id="nav-header">
        <a class="nav-link" href="">原創小說</a>
        <a class="nav-link" href="">衍生小說</a>
        <a class="nav-link" href="">Spotify音樂</a>
        <a class="nav-link" href="">動漫類</a>
        <?php
        if(empty($sess_mail)){
            echo'
            <a class="nav-link" type="button" data-bs-toggle="modal" data-bs-target="#loginModalArea"><i class="fa-regular fa-circle-user"></i>會員登入</a>
            ';
        }else{
            echo'
            <a class="nav-link" href=""><i class="fa-regular fa-circle-user"></i>歡迎 '.$user.' ！</a>
            ';
        }
        ?>
    </nav>

- [ ] 24/02/28 研究Spotify之類的爬蟲或者api相關資訊
- [ ] 24/02/28 先生出幾篇可以貼上的文章
- [x] 24/02/29 接著是製作個人空間頁面
- [x] 24/02/29 logout.php完成

<?php
session_start();

date_default_timezone_set("Asia/Taipei");

//清除session
unset($_SESSION["mail"]);

//echo '登出中......';

?>

- [x] ckEditer的工具
- [x] userEdit，USER可以發表文章的地方
- [x] mysql建立新的資料表，用來存放這個頁面的資料
- [ ] 我要做「排定時程發表」，預設構想是三個資料表，一個是發表的**portms**，另一個是未發表的草稿匣 **portmsdraft**，還有排定時程的**portmsschedule**
- 當按下「送出」的時候，日期在明日之後，都會先暫存在**portmsschedule**，若是按下「儲存」，會存在**portmsdraft**裡
-