<?php 
include getenv("DOCUMENT_ROOT")."/include/session_include.php";
require_once getenv("DOCUMENT_ROOT")."/assets/dbCon.php";

$c_uid = $_GET['c_uid'];
$goStr = $_GET['goStr'];

//Load driver list
if ($_SESSION['ss_LEVEL'] == 9) {
    $qrySTR = " AND (m_uid = '".$_SESSION['ss_UID']."') ";
} else {
    $qrySTR = "";
}

$drivers = array();
$sqDriver = qry("SELECT
                    *
                FROM
                    tbl_member
                WHERE 
                    m_level = 9 AND m_status = 'A' ".$qrySTR."
                ORDER BY 
                    m_initial ASC ");
while($rstDriver = fetch_array($sqDriver)){
    $drivers[] = array(
        "id" => $rstDriver['m_uid'],
        "name" => $rstDriver['m_initial']
    );
}

?>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Upload Image</title>
</head>
<body>

<div class="upload-box">

    <div class="title-row">
        <span>UPLOAD IMAGE</span>
    </div>

    <form method="POST" action="/lib/user_process.php" enctype="multipart/form-data">

        <input type="hidden" name="actionStr" value="ADDIMAGE">
        <input type="hidden" name="i_customeruid" value="<?=$c_uid?>">
        <input type="hidden" name="i_memberuid" value="<?=$_SESSION['ss_UID']?>">
        <input type="hidden" name="goStr" value="<?=$goStr?>">
        <input type="hidden" name="mode" value="create">

        <div class="tb-info">

            <label>Created By</label>
            <select name="i_createdby" id="driver" class="custom-select-map-orderby" required>
                <option value="">Select</option>
                <?php
                    $defaultValue = 43; // E.X
                    foreach($drivers as $driver) {
                        $selected = ($driver['id'] == $defaultValue) ? 'selected' : '';
                        echo '<option value="'.$driver['id'].'" '.$selected.'>'.$driver['name'].'</option>';
                    }
                ?>
            </select>


            <label>Type</label>
            <select name="i_type" id="i_type" required>
                <option value="install">Install</option>
                <!-- <option value="container">Container</option> -->
            </select>

            <label>Image</label>
            <p style="font-size:12px; color:#666; margin-top:4px;">※ 기존 이미지가 있을 경우 삭제됩니다.</p>
            <p style="font-size:12px; color:#666; margin-top:-6px;">※ Install 이미지는 1개만 업로드 가능합니다.</p>
            <input type="file" id="uploadFileInput" name="upload_file[]" accept="image/*" required>

            <img id="previewImg" class="preview-img">

            <label>Note</label>
            <textarea name="i_note" rows="3"></textarea>

        </div>

        <button type="submit" class="btn-save">UPLOAD</button>

    </form>

</div>

<script>
$(window).ready(function() {

<?php if ($_SESSION['ss_LEVEL'] == 9) { ?>
    $("#driver").val("<?= $_SESSION['ss_UID'] ?>").change();
<?php } ?>

});

document.getElementById("uploadFileInput").addEventListener("change", function () {
    const preview = document.getElementById("previewImg");
    const file = this.files[0];

    if (!file) return;

    const reader = new FileReader();
    reader.onload = () => {
        preview.src = reader.result;
        preview.style.display = "block";
    };
    reader.readAsDataURL(file);
});
</script>

</body>
</html>


<style>
    body {
        background: #f5f7fb;
        font-family: Arial, Helvetica, sans-serif;
        padding: 40px;
    }

    .upload-box {
        width: 450px;
        margin: 0 auto;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 6px 18px rgba(0,0,0,0.1);
        padding: 25px 30px;
    }

    .title-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 17px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .clear-btn {
        background: #ccc;
        border: none;
        padding: 4px 12px;
        border-radius: 6px;
        cursor: pointer;
        font-size: 13px;
        color: #333;
    }

    .tb-info label {
        display: block;
        font-size: 14px;
        margin-top: 12px;
        font-weight: bold;
    }

    .tb-info select, 
    .tb-info input[type=file],
    .tb-info textarea {
        width: 100%;
        padding: 8px;
        border: 1px solid #ccc;
        border-radius: 6px;
        margin-top: 6px;
        font-size: 14px;
    }

    .preview-img {
        margin-top: 12px;
        width: 200px;
        border: 1px solid #ccc;
        border-radius: 6px;
        display: none;
    }

    .btn-save {
        background: #76c06b;
        color: #fff;
        width: 100%;
        padding: 14px 0;
        margin-top: 18px;
        border: none;
        border-radius: 8px;
        font-size: 16px;
        font-weight: bold;
        cursor: pointer;
    }

    .btn-save:hover {
        background: #69ad60;
    }

    .btn-close {
        width: 100%;
        margin-top: 10px;
        padding: 12px 0;
        background: #8e8e8e;
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 15px;
        cursor: pointer;
    }
</style>
