<?php
include("db_connection.php");
$Mainclass=new DB_Controller();

$SLN = $_REQUEST['i'];

$result = $Mainclass->Fetch_individual_data("gold_temp_product_master","Diamond_Creation_Type,DiamondQuality,DiamondColor,DiamondType,No_Diamond,Diamond_Value,Diamond_Carat","SLN='".$SLN."'"); 

?>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@4.0/dist/fancybox.css">
  <!-- Google Font: Source Sans Pro -->
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css"  />

  <!-- -=---- searchable dropdown link css ------ -->
  <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
   <!-- -=---- searchable dropdown link css ------ -->


  <!-- DataTables -->
  <link rel="stylesheet" href="plugins/datatables-bs4/css/dataTables.bootstrap4.min.css">
  <link rel="stylesheet" href="plugins/datatables-responsive/css/responsive.bootstrap4.min.css">
  <link rel="stylesheet" href="plugins/datatables-buttons/css/buttons.bootstrap4.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="dist/css/adminlte.min.css">
  <link rel="stylesheet" href="dist/css/custom.css">
  <style>
#tooltip
{
    text-align: center;
    color: #FFF;
    background: #777777;
    position: absolute;
    z-index: 100;
    padding: 8px 15px;
    font-size:12px;
    font-family: 'Roboto', sans-serif;
}
 
    #tooltip:after /* triangle decoration */
    {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #777777;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }
 
        #tooltip.top:after
        {
            border-top-color: transparent;
            border-bottom: 10px solid #777777;
            top: -20px;
            bottom: auto;
        }
 
        #tooltip.left:after
        {
            left: 10px;
            margin: 0;
        }
 
        #tooltip.right:after
        {
            right: 10px;
            left: auto;
            margin: 0;
        }
.fulldiv {
    float: left;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    background-color: rgba(38, 53, 68, 0.80);
    background: rgba(38, 53, 68, 0.80);
    z-index: 1500;
    position: fixed;
}
      .message_maindiv_new {
    width: 430px;
    height: auto;
    margin: 0px auto;
}
      .message_div_new {
    float: left;
    width: 100%;
    height: auto;
    padding: 3%;
    background-color: #FFFFFF;
    margin-top: 300px;
}
      .message_title {
    float: left;
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 20px;
    color: #000000;
    margin-bottom: 20px;
    text-transform: capitalize;
      }


      body{
        overflow-x: hidden;
      }
      
      .bg-maroon{
      background-color:#cf2c65 !important;
      }
      
      div.dataTables_wrapper div.dataTables_paginate{
        display:none;
      }
      div.dataTables_wrapper div.dataTables_info{
        display:none;  
      }

.wrapper{
float:left;
width:100%;
}


.header{
float:left;
width:90%;
padding:7px 5%;
text-align:left;
font-size:13px;
color:#fff;
font-weight:600;
background-color:#135480;
margin-bottom:10px;
font-family: serif;
}
label{
    margin: 5px;
}
p{
    margin-left: 15px;
}


#form_select{

font-size: 14px;
margin-bottom : 2px;

}

.form-group{


    margin-bottom : 2px;
}

</style>
<script>
$( function()
{
    var targets = $( '[rel~=tooltip]' ),
        target  = false,
        tooltip = false,
        title   = false;
 
    targets.bind( 'mouseenter', function()
    {
        target  = $( this );
        tip     = target.attr( 'title' );
        tooltip = $( '<div id="tooltip"></div>' );
 
        if( !tip || tip == '' )
            return false;
 
        target.removeAttr( 'title' );
        tooltip.css( 'opacity', 0 )
               .html( tip )
               .appendTo( 'body' );
 
        var init_tooltip = function()
        {
            if( $( window ).width() < tooltip.outerWidth() * 1.5 )
                tooltip.css( 'max-width', $( window ).width() / 2 );
            else
                tooltip.css( 'max-width', 340 );
 
            var pos_left = target.offset().left + ( target.outerWidth() / 2 ) - ( tooltip.outerWidth() / 2 ),
                pos_top  = target.offset().top - tooltip.outerHeight() - 20;
 
            if( pos_left < 0 )
            {
                pos_left = target.offset().left + target.outerWidth() / 2 - 20;
                tooltip.addClass( 'left' );
            }
            else
                tooltip.removeClass( 'left' );
 
            if( pos_left + tooltip.outerWidth() > $( window ).width() )
            {
                pos_left = target.offset().left - tooltip.outerWidth() + target.outerWidth() / 2 + 20;
                tooltip.addClass( 'right' );
            }
            else
                tooltip.removeClass( 'right' );
 
            if( pos_top < 0 )
            {
                var pos_top  = target.offset().top + target.outerHeight();
                tooltip.addClass( 'top' );
            }
            else
                tooltip.removeClass( 'top' );
 
            tooltip.css( { left: pos_left, top: pos_top } )
                   .animate( { top: '+=10', opacity: 1 }, 50 );
        };
 
        init_tooltip();
        $( window ).resize( init_tooltip );
 
        var remove_tooltip = function()
        {
            tooltip.animate( { top: '-=10', opacity: 0 }, 50, function()
            {
                $( this ).remove();
            });
 
            target.attr( 'title', tip );
        };
 
        target.bind( 'mouseleave', remove_tooltip );
        tooltip.bind( 'click', remove_tooltip );
    });
});
</script>

    
<link rel="stylesheet" href="dist/css/alertify.css" />
<link rel="stylesheet" href="dist/css/semantic.css" />
<script src="dist/js/alertify.js"></script>


    </head>
    <body class="hold-transition sidebar-mini" onload="get_color_select(),get_size_select()">
        
        
        <!----View Modal------>




<div class="wrapper">
        
<input type="hidden" name="SLN" id="SLN" value="<?php echo $SLN ?>">


<div id="heading" class="header" style="width:100%;"><h4>DIAMOND DETAILS</h4></div>



<div class="row">


	
<?php

if($result['No_Diamond']==0){

$dqty =""; 
$dval =""; 

}

else{

$dqty =$result['No_Diamond']; 
$dval =$result['Diamond_Value']; 

}


?>

<!-- <input type="hidden" id="dia_quility" value="<?php echo $result['DiamondQuality'] ?>">
<input type="hidden" id="dia_color" value="<?php echo $result['DiamondColor'] ?>">
<input type="hidden" id="dia_type" value="<?php echo $result['DiamondType'] ?>"> -->


<div class="col-12" id="form_select">
<div class="form-group">
<label>Diamond Type <span style="color:crimson;font-weight:bold;">*</span></label>
            <select class="form-control" id="diamond_type" name="diamond_type" onchange="clearall()">
        <option value="">--- please select---</option>
              <option value="Lab Grown"  <?php if($result['Diamond_Creation_Type']=='Lab Grown') echo "selected"; ?>>Lab Grown</option>
              <option value="Natural"    <?php if($result['Diamond_Creation_Type']=='Natural') echo "selected"; ?>>Natural</option>

        </select>   
</div>
</div>

<div class="col-12" id="form_select">
<div class="form-group">
<label>Diamond Quality <span style="color:crimson;font-weight:bold;">*</span></label>
            <select class="form-control err" id="quality" name="quality" onchange="get_value(),get_color()">
        <option value="">--- please select---</option>
        <?php
        $Get_Karat=$Mainclass->Fetch_multiple_data('diamond_rate_master',"*","SLN!='' GROUP BY Quality");
        foreach($Get_Karat as $karat)
        {
          ?>
        <option value="<?php echo $karat['Quality'];?>" <?php if($karat['Quality']==$result['DiamondQuality']) echo "selected"; ?> ><?php echo $karat['Quality'];?></option>        
        <?php
        }
        ?>

        </select>   
</div>
</div>

<div class="col-12" id="form_select">
<div class="form-group">
<label>Diamond Color <span style="color:crimson;font-weight:bold;">*</span></label>
            <select class="form-control err" id="color" name="color" onchange="get_value(),get_size()">
              <option value="">--- please select---</option>


              </select>    
</div>
</div>


<div class="col-12" id="form_select">
<div class="form-group">
<label>Diamond Size <span style="color:crimson;font-weight:bold;">*</span></label>
            <select class="form-control err" id="type" name="type" onchange="get_value()">
              <option value="">--- please select---</option>

              </select>    
</div>
</div>



<?php

if($result['No_Diamond']==0){

$dqty =""; 
$dval =""; 
$dcat ="";
}

else{

$dqty =$result['No_Diamond']; 
$dval =$result['Diamond_Value']; 
$dcat =$result['Diamond_Carat']; 

}


?>

<input type="hidden" id="dia_quility" value="<?php echo $result['DiamondQuality'] ?>">
<input type="hidden" id="dia_color" value="<?php echo $result['DiamondColor'] ?>">
<input type="hidden" id="dia_type" value="<?php echo $result['DiamondType'] ?>">

<div class="col-12" id="form_select">
<div class="form-group">
<label>No of Diamond <span style="color:crimson;font-weight:bold;">*</span></label>
<input type="text" name="no_diamonds" id="no_diamonds" placeholder=" Enter no of diamonds " class="form-control err"  oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');"  autocomplete="off" value="<?php echo $dqty ?>">
</div>
</div>

<div class="col-12" id="form_select">
<div class="form-group">
<label>Diamond Value (Per Carat)<span style="color:crimson;font-weight:bold;">*</span></label>
<input type="text" name="diamond_value" id="diamond_value" placeholder=" Enter Diamond Value (Per Carat)" class="form-control err" oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');"   autocomplete="off" readonly value="<?php echo $dval ?>">
</div>
</div>

<div class="col-12" id="form_select">
<div class="form-group">
<label>Diamond Carat<span style="color:crimson;font-weight:bold;">*</span></label>
<input type="text" name="diamond_carat" id="diamond_carat" placeholder=" Enter Diamond Carat" class="form-control err"  oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');"   autocomplete="off"  value="<?php echo $dcat ?>">
</div>
</div>

<div class="col-12" id="error_sms" style="margin-top : 7px !important;display: none;text-align: center;">
<span  style="color: #e85c5c;text-align: center;font-size: 15px;font-weight: bold;" >* Please provide information in all the required fields </span>
</div>

<div class="col-12" id="form_select" style="margin-top : 7px !important;">
<div class="form-group">
<button style="background:#135480;color:white;font-size:15px;" class="btn btn-block" onclick="insert_product_size()">Update</button>
</div>
</div>

</div>
</div>




</div>

















</div>  


</div>

        
        <!----View Modal Ends---->      
    

  <!-- Control Sidebar -->
  
  <!-- /.control-sidebar -->

<!-- ./wrapper -->
<!-- jQuery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- DataTables  & Plugins -->
<script src="plugins/datatables/jquery.dataTables.min.js"></script>
<script src="plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
<script src="plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
<script src="plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
<script src="plugins/datatables-buttons/js/dataTables.buttons.min.js"></script>
<script src="plugins/datatables-buttons/js/buttons.bootstrap4.min.js"></script>
<script src="plugins/jszip/jszip.min.js"></script>
<script src="plugins/pdfmake/pdfmake.min.js"></script>
<script src="plugins/pdfmake/vfs_fonts.js"></script>
<script src="plugins/datatables-buttons/js/buttons.html5.min.js"></script>
<script src="plugins/datatables-buttons/js/buttons.print.min.js"></script>
<script src="plugins/datatables-buttons/js/buttons.colVis.min.js"></script>
<!-- AdminLTE App -->
<script src="dist/js/adminlte.min.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="dist/js/demo.js"></script>
<!-- Page specific script -->
<script>
  $(function () {
    $("#example1").DataTable({
      "responsive": true,
        "lengthChange": false,
        "autoWidth": false,
        "searching": false,
     // "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
    }).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
    $('#example2').DataTable({
      "paging": true,
      "lengthChange": false,
      "searching": false,
      "ordering": true,
      "info": true,
      "autoWidth": false,
      "responsive": true,
    });
  });
</script>
    <script>
    /*ClassicEditor
        .create( document.querySelector( '#responsibility' ) )
        .catch( error => {
            console.error( error );
        } );*/
        var myEditor;

    ClassicEditor
        .create( document.querySelector( '#responsibility' ) )
        .then( editor => {
            console.log( 'Editor was initialized', editor );
            myEditor = editor;
        } )
        .catch( err => {
            console.error( err.stack );
        } );
    
</script>
<script type="text/javascript" src="lib/jquery.mousewheel.pack.js"></script>
<script type="text/javascript" src="source/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css" media="screen" />
<script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@4.0/dist/fancybox.umd.js"></script>
<style type="text/css">
    .fancybox-custom .fancybox-skin {
        box-shadow: 0 0 50px #222;
    }
</style> 
<script>
$(document).ready(function() {

  
    $("#various1").fancybox({
        maxWidth    : 1550,
        maxHeight   : 720,
        fitToView   : true,
        width       : '100%',
        height      : '100%',
        autoSize    : false,
        closeClick  : false,
        openEffect  : 'none',
        closeEffect : 'none',
         
    }); 


});

</script>

<script>
        function insert_product_size()
    {


        var SLN=$('#SLN').val();
        var diamond_type=$('#diamond_type').val();
        var quality=$('#quality').val();
        var color=$('#color').val();
        var type=$('#type').val();
        var no_diamonds=$('#no_diamonds').val();
        var diamond_value=$('#diamond_value').val();
        var diamond_carat=$('#diamond_carat').val();

        var form_type = "Diamond";



        if(diamond_type=="" || quality=="" || color=="" || type=="" || no_diamonds=="" || diamond_value=="" || diamond_carat==""){

        $('#error_sms').show();

        return false;

        }

        else{

        $('#error_sms').hide();



    var data = {
    SLN: SLN,
    diamond_type: diamond_type,
    quality: quality,
    color: color,
    type: type,
    no_diamonds: no_diamonds,
    diamond_value: diamond_value,
    diamond_carat: diamond_carat,
    form_type: form_type,
    };

$.ajax({
url:'ajax-update-temp-product-details.php',
type:'POST',
data: data,
success:function(f){

window.parent.location.href="add_products_to_master.php";

}

});


    }


    }
        
        </script>       

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
  function formatState (state) {
  if (!state.id) {
    return state.text;
  }

  var baseUrl = "/user/pages/images/flags";
  var $state = $(
    '<span><img class="img-flag" /> <span></span></span>'
  );

  // Use .text() instead of HTML string concatenation to avoid script injection issues
  $state.find("span").text(state.text);
  // $state.find("img").attr("src", baseUrl + "/" + state.element.value.toLowerCase() + ".png");

  return $state;
};


$("#p_cate").select2({
  templateSelection: formatState
});

function get_value(){

var quality = $('#quality').val();
var color = $('#color').val();
var type = $('#type').val();
var diamond_type = $('#diamond_type').val();


$.ajax({
url:'ajax-get-value.php',
type:'POST',
data:{quality:quality,color:color,type:type,diamond_type:diamond_type},
success:function(f){


$('#diamond_value').val(f);

}

});


}

function clearall() {
$('#quality').val('');
$('#color').val('');
$('#type').val('');
$('#no_diamonds').val('');
$('#diamond_value').val('');
}

function get_color(){
var diamond_type = $('#diamond_type').val();
var quality = $('#quality').val();  
var SLN = $('#SLN').val();    
$('#color').val('');
$('#type').val('');
$.ajax({
url:'ajax-get-diamond-color.php',
type:'POST',
data:{quality:quality,diamond_type:diamond_type},
success:function(f){
  
$('#color').html(f);
  
}
}); 
  
} 
  
function get_size(){
  var diamond_type = $('#diamond_type').val();  
var quality = $('#quality').val();  
var color = $('#color').val();    

$('#type').val('');
$.ajax({
url:'ajax-get-diamond-size.php',
type:'POST',
data:{quality:quality,color:color,diamond_type:diamond_type},
success:function(f){
//alert(f);
  
$('#type').html(f);
  
}
}); 
  
    
}
  

function get_color_select(){
  
var SLN = $('#SLN').val();     
$.ajax({
url:'ajax-get-diamond-color-select-igi.php',
type:'POST',
data:{barcode:SLN},
success:function(f){
  
$('#color').html(f);
  
}
}); 
  
} 
  
function get_size_select(){
  

var SLN = $('#SLN').val();    

$('#type').val('');
$.ajax({
url:'ajax-get-diamond-size-select-igi.php',
type:'POST',
data:{barcode:SLN},
success:function(f){
//alert(f);
  
$('#type').html(f);
  
}
}); 
  
    
}


</script>



</body>
</html>