Cloud Vision Api

 Download: Link Here

lấy giá trị form - code php ajax

 <form id="#send-supplier-fast">

<a id="tensanpham" href="'.$link.'" target="_blank" class="link">'.$title.'</a>            

<input type="text" placeholder="Số lượng"  name="soluong" oninput="this.value = this.value.replace(/[^0-9]/g, \'\')" required>

<textarea class="input-textarea" id="content" name="content" required></textarea> 

<button type="submit" id="inquirySend"></button>    

</form>

$(document).on('submit', '#send-supplier-fast', function (e) {

    e.preventDefault();

    const form = $(this);

    const btn  = $('#inquirySend');

    let formData = new FormData();

    // lấy data thường

    formData.append('soluong', $('input[name=soluong]').val());

    formData.append('donvitinh', $('select[name=donvitinh]').val());

    formData.append('content', $('#content').val());

    formData.append('senderMail', $('#senderMail').val());

    formData.append('pid', $('input[name=pid]').val());

    // formData.append('title', $('input[name=title]').val());

    formData.append('title', $('#tensanpham').text().trim());

    formData.append('userid', $('input[name=userid]').val());

    // chỉ append file từ selectedFiles

    selectedFiles.forEach(function(file) {

        if (file && file.size > 0) {

            formData.append('files[]', file);

        }

    });

    btn.prop('disabled', true).text('Đang gửi...');

    $.ajax({

        url: '/send-supplier-product',

        type: 'POST',

        data: formData,

        processData: false,

        contentType: false,

        dataType: 'json',

        success: function (res) {

            // console.log(res);

            if (res && res.status === 'success') {

                showNotify('✅ Gửi yêu cầu thành công!');

                form[0].reset();            

                window.location.href = '/?sendmail=' + res.mail_data.mail_id+ '&token=' + res.mail_data.token;

            } else {

                showNotify('❌ ' + (res.message || 'Có lỗi xảy ra'), 'error');

            }

        },

        error: function () {

            showNotify('❌ Lỗi server', 'error');

        },

        complete: function () {

            btn.prop('disabled', false).text('Gửi yêu cầu');

        }

    });

});

Chỉ cho nhập số vào - code php

 <input type="text" name="khoahoc" class="form-control" oninput="this.value = this.value.replace(/[^0-9]/g, \'\')" required>

SEND EMAIL SMTP - KEIEIJUKU - send supplier

 require_once 'classes/class.phpmailer.php';

require_once 'classes/class.smtp.php';

<!-- take include/data/mail_config.php 

$SuppEmail = email_mail

$mailHost

$mailUsername

$mailPassword

$mailsetFrom 

-->

===== MAIL GỬI CHO SUPPLIER =====

$mail = new PHPMailer();

$mail->CharSet = 'UTF-8';

$mail->isSMTP();

$mail->SMTPKeepAlive = true;

$mail->SMTPDebug = 0;

// $mail->Timeout = 10;

$mail->Host       = $mailHost;

$mail->SMTPAuth   = true;

$mail->Username   = $mailUsername;

$mail->Password   = $mailPassword;

$mail->SMTPSecure = 'ssl';

$mail->Port       = 465;

$mail->setFrom($mailsetFrom, 'KEIEIJUKU KBN');

$mail->addAddress($supplier);

$mail->addReplyTo($customer);

$mail->isHTML(true);

$mail->Subject = $subject;

$mail->Body    = $body;

// ===== MAIL GỬI CHO KHÁCH (NGAY LẬP TỨC) =====

$mail2 = new PHPMailer();

$mail2->CharSet = 'UTF-8';

$mail2->isSMTP();

$mail2->SMTPKeepAlive = true;

$mail2->SMTPDebug = 0;

// $mail2->Timeout = 3;

$mail2->Host       = $mailHost;

$mail2->SMTPAuth   = true;

$mail2->Username   = $mailUsername;

$mail2->Password   = $mailPassword;

$mail2->SMTPSecure = 'ssl';

$mail2->Port       = 465;

$mail2->setFrom($mailsetFrom, 'KEIEIJUKU KBN');

$mail2->addAddress($customer);

$mail2->isHTML(true);

$mail2->Subject = 'Xác nhận đã gửi yêu cầu từ website KEIEIJUKU KBN';

$mail2->Body    = $body;

## Send-Mail

$start = microtime(true);

// gửi mail supplier trước

$ok1 = $mail->send();

$time1 = microtime(true);

// chỉ gửi mail khách nếu mail 1 OK

$ok2 = false;

if($ok1){

    $ok2 = $mail2->send();

}

$time2 = microtime(true);

## ------------------------- ##

// tính thời gian

$time_supplier = round($time1 - $start, 3);

$time_customer = round($time2 - $time1, 3);

$total_time    = round($time2 - $start, 3);

// ghi log

file_put_contents('debug_time.txt',

    "Supplier: {$time_supplier}s\n" .

    "Customer: {$time_customer}s\n" .

    "Total: {$total_time}s\n\n",

    FILE_APPEND

);

Accept - nhận đuôi file trong upload-file-input

 <input type="file" name="pic_ncc" accept=".jpeg,.jpg,.png">

OR

 <input type="file" name="pic_ncc" accept="image/*">

--> post - action - save

$image_nlh = null;

if (isset($_FILES['pic_ncc']) && $_FILES['pic_ncc']['error'] == 0) {

    $ext = strtolower(pathinfo($_FILES['pic_ncc']['name'], PATHINFO_EXTENSION));

    $allow_ext = array('jpg','png','jpeg');

    if (in_array($ext, $allow_ext)) {

        $new_name = 'picncc_'.time().'.'.$ext;

        if (move_uploaded_file($_FILES['pic_ncc']['tmp_name'], $upload_dir . $new_name)) {

            $image_nlh = $new_name;

        }

    }

}

/**************************/

<input type="file" id="images-file"  accept=".jpeg,.jpg,.png" name="images_file[]" multiple>

--> post - action - save

if (isset($_FILES['images_file']) && !empty($_FILES['images_file']['name'][0])) {

    for ($i = 0; $i < count($_FILES['images_file']['name']); $i++) {

        if ($_FILES['images_file']['error'][$i] == 0) {

            $name = $_FILES['images_file']['name'][$i];

            $tmp  = $_FILES['images_file']['tmp_name'][$i];

            $ext  = strtolower(pathinfo($name, PATHINFO_EXTENSION));

            $allow_ext = array('jpg','png');

            if (!in_array($ext, $allow_ext)) continue;

            $new_name = 'img_' . time() . '_' . $i . '.' . $ext;

            if (move_uploaded_file($tmp, $upload_banner . $new_name)) {

                $images_saved[] = $new_name;

            }

        }

    }

}

$images_db = !empty($images_saved) ? implode('**', $images_saved) : null;

Menu Mobi - CSS+JS

 

**** HTML

$data = admin_catalog_module_data($xmid);

echo'<div class="catelog-list">';

    foreach ($data as $key => $value) {

        $title = $value["title"];

        $mid = $value["mid"];

        echo'<div class="catelog-item-more-wrap">

            <h2 class="catelog-item">

                <a href="javascript:void(0)"><i class="fa fa-angle-down" aria-hidden="true"></i>'.$title.'</a>

            </h2>';

            $data2 = admin_catalog_module_data($mid);

            foreach ($data2 as $key => $value2) {

                $title2 = $value2["title"];

                $mid2   = $value2["mid"];

                $link2  = "link_den_nhomsp";

                echo'<div class="catelog-item-more">

                    <h3 class="catelog-item">

                        <a href="'.$link2.'">'.$title2.'</a>

                    </h3>

                </div>';

            }    

        echo'</div>';

    }

echo'</div>';

**** CSS

.catelog-list .catelog-item {

    position: relative;

    border-bottom: 1px solid #dae0e5;

    font-size: 1.9rem;

    font-weight: normal;

    margin: 0;

    padding: 20px 0;

    margin-left: 1.75rem;

}

.catelog-list .catelog-item a {

    display: inline-block;

    color: #222;

    width: 100%;

    height: 100%;

    padding-right: 2.25rem;

    color: rgba(34, 34, 34, .9);

    box-sizing: border-box;

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

    /* font-size: 14px; */

}

.catelog-list .catelog-item a:active,

.catelog-list .catelog-item a:focus{

    text-decoration: none;

}

.catelog-list .catelog-item i {

    margin: 0;

    position: absolute;

    right: 0;

    color: #b3b3b3;

    font-size: .9rem;

    font-size: 2.5rem;

    padding: 0 1.75rem;

}

.Hotcat {

    font-size: 2em;

    margin-left: 1.75rem;

}

.catelog-list .catelog-more {

    background-color: #edf0f2;

}

.catelog-list .catelog-item-more {

    display: none;

}

.catelog-list .catelog-more .catelog-item-more {

    display: block;

}

.main-container.padd0 {

    padding: 0;

}

**** JS

<script>

$(document).ready(function(){

    $('.catelog-item-more-wrap > h2').click(function(e){

        e.stopPropagation();

        let parent = $(this).parent();

        // Nếu đang mở → đóng lại

        if(parent.hasClass('catelog-more')){

            parent.removeClass('catelog-more');

            parent.find('i').removeClass('fa-angle-up').addClass('fa-angle-down');

        } 

        // Nếu đang đóng → mở và đóng cái khác

        else {

            $('.catelog-item-more-wrap')

                .removeClass('catelog-more')

                .find('i')

                .removeClass('fa-angle-up')

                .addClass('fa-angle-down');

            parent.addClass('catelog-more');

            $(this).find('i').removeClass('fa-angle-down').addClass('fa-angle-up');

        }

    });

});

</script>

Click show div search mới - mobi

 

**** HTML

<input type="text" placeholder="Tìm kiếm sản phẩm" class="mbipro-search form-control" id="openSearch">

-> click show qua div mới

<div id="searchOverlay">

    <div class="flex mbiflex">

        <div class="search-header" id="closeSearch">

            <i class="fa fa-angle-left" aria-hidden="true"></i>

        </div>

        <div class="search-body">

            <input type="text" placeholder="Nhập từ khóa..." class="search-input">

            <button class="btn-search">

                <i class="fa fa-search"></i>

            </button>

        </div>

    </div>    

</div>

**** JS

<script>

  $(document).ready(function(){

      $("#openSearch").focus(function(){

          $("#searchOverlay").addClass("active");

          setTimeout(function(){

              $("#searchInput").focus();

          },100);

      });

      $("#closeSearch").click(function(){

          $("#searchOverlay").removeClass("active");

      });

  });

</script>

**** CSS

#searchOverlay {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: #fff;

    z-index: 9999;

    display: none;

    flex-direction: column;

}

#searchOverlay.active {

    display: flex;

}

.search-header {

    color: #888;

    font-size: 25px;

}

#closeSearch {

    background: none;

    border: none;

    font-size: 30px;

    cursor: pointer;

}

.mbiflex {

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 10px;

}

.search-body {

    position: relative;

    flex: 1;

}

.search-input {

    width: 100%;

    height: 45px;

    padding: 0 15px;

    border: 1px solid #ddd;

    border-radius: 30px;

    font-size: 16px;

}

#searchOverlay {

    opacity: 0;

    transition: 0.3s;

}

#searchOverlay.active {

    display: flex;

    opacity: 1;

}

.btn-search {

    position: absolute;

    top: 50%;

    right: 10px;

    transform: translateY(-50%);

    border: none;

    background: none;

    cursor: pointer;

    color: #888;

    font-size: 18px;

}