Minggu, 10 Desember 2017

projek jenis kacamata

Project kacamata
pembelian kacamata frame, lensa dan kacamata minus

penjelasan codingnya
<html>
<head>
      <title>Project kacamata</title>
</head>        
<style>
        .center
        {
            margin: auto;
            width: 74%;
            border: 7px solid black;
            padding: 90px;
            text-align: center;
            background-color: red;
        }
        label
        {
            width: 80 px;
            display: inline-block;
        }
    </style>
<body>
<center class="center">
<div>
<font color="gren" size="7">
<h5>pembelian kacamata frame, lensa dan kacamata minus</h5>
</div>
</div>
<div>
<font color="black">
<label>frame kacamata</label>
<Select id="jenis1">
<option value="">pilih</option>
<option value="Nike Yellow">Nike Yellow</option>
<option value="Clip Black ">Clip Black</option> 
<option value="Sport Red">Sport Red</option>
<option value="005 TORTOIS">005 TORTOIS</option>
<option value="006 BLACK">006 BLACK</option>
</select>
</div>
<div>
<label>lensa kacamata</label>
<Select id="jenis2">
<option value="">pilih</option>
<option value="MIKA STANDAR">MIKA STANDAR</option>
<option value="ESSILOR Alize">ESSILOR Alize</option>
<option value="OMEGA EVOLIQ">OMEGA EVOLIQ</option>
<option value="Essilor UV">Essilor UV</option>
<option value="FLANO (TIDAK MINUS)">FLANO (TIDAK MINUS)</option>
</select>
</div>
<div>
<label>pembersih kacamata</label>
<Select id="jenis3">
<option value="">pilih</option>
<option value="vortex">vortex</option>
<option value="expo">expo</option>
<option value="ao">ao</option>
<option value="gj">gj</option>
<option value="lens">lens</option>
</select>
</div>
<div>
<label>jumlah</label>
<input type="number" id="kali">
</div>
<div>
<input type="button" value="jenis" onclick="jenis()"/>
<input type="button" value="tampilkan_omset_omset" onclick="tampilkan_omset()"/>
<input type="button" value="simpan_omset" onclick="simpan_omset()"/>
<input type="button" value="totalkan_omset" onclick="totalkan_omset()"/>
<input type="button" value="diskon" onclick="diskon()"/>
</div>
<div style="background-color:blue; padding:20px;">
<label>jenis</label>
<label style="background-color:cyan;" id="lbl_output"></label>

</div>
<div style="background-color:FireBrick; padding:20px; widt:10px;">
<label>diskon</label>
<label style="background-color:cyan;" id="harga_hasil_diskon"></label>
</div>
<div style="background-color:gold; padding:20px;">
<label>hasil tampilan omset dan total omset</label><br>
<label style="background-color:cyan;" id="tampil_omset"></label>
<label style="background-color:cyan;" id="tampilkan_totalkan_omset"></label>

</div>
</body>
</center>
 
<script type="text/javascript">
   
//function untuk input
function jenis()
{

//dekralasi variabel
var proses= new Array();
var input1= new Array();
var input2= new Array();
var input3= new Array();
var input4= new Array();
var frame= new Array();
var lensa= new Array();
var pembersih= new Array();
var hasil= new Array();

var indeks = 0;

//Input
input1[indeks]=document.getElementById("jenis1").value;
if(input1[indeks]=='Nike Yellow'){
frame[indeks]=255000;
}else if(input1[indeks]=='Clip Black '){
frame[indeks]=325000;
}else if(input1[indeks]=='Sport Red'){
frame[indeks]=272000;
}else if(input1[indeks]=='005 TORTOIS'){
frame[indeks]=95000;
}else if(input1[indeks]=='006 BLACK'){
frame[indeks]=175000;
}

input2[indeks]=document.getElementById("jenis2").value;
if(input2[indeks]=='MIKA STANDAR'){
lensa[indeks]=90000;
}else if(input2[indeks]=='ESSILOR Alize'){
lensa[indeks]=27500;
}else if(input2[indeks]=='OMEGA EVOLIQ'){
lensa[indeks]=175000;
}else if(input2[indeks]=='Essilor UV'){
lensa[indeks]=325000;
}else if(input2[indeks]=='FLANO (TIDAK MINUS)'){
lensa[indeks]=75000;
}

input3[indeks]=document.getElementById("jenis3").value;
if(input3[indeks]=='vortex'){
pembersih[indeks]=4000;
}else if(input3[indeks]=='expo'){
pembersih[indeks]=60000;
}else if(input3[indeks]=='ao'){
pembersih[indeks]=15000;
}else if(input3[indeks]=='gj'){
pembersih[indeks]=9500;
}else if(input3[indeks]=='lens'){
pembersih[indeks]=7500;
}

input4[indeks]=parseInt(document.getElementById('kali').value);
//proses
hasil[indeks]=frame[indeks]+lensa[indeks]+pembersih[indeks]*input4[indeks];
//output
indeks++;
document.getElementById("lbl_output").innerHTML=hasil;
}
var omset=new Array();
function simpan_omset(){
var hasil_penjualan=document.getElementById('lbl_output').innerHTML;
omset.push(hasil_penjualan);
}

function tampilkan_omset(){
var i;
var text='';
for(i=0; i<omset.length; i++){
text += omset[i] +"<br>";
}
document.getElementById('tampil_omset').innerHTML=text;
}

function totalkan_omset(){
var i;
var total=0;
for(i=0; i<omset.length; i++){
total=parseInt(total)+parseInt(omset[i]);
}
document.getElementById('tampilkan_totalkan_omset').innerHTML=total;
}

function diskon(){
var harga_awal=document.getElementById('lbl_output').innerHTML;
var hasil;
if( harga_awal <= 100000){
hasil=harga_awal;
}else if(harga_awal >=100000){
var harga_diskon=harga_awal*10/100;
hasil=harga_awal-harga_diskon;
}
document.getElementById('harga_hasil_diskon').innerHTML=hasil;
}

</script>  

</html>

Tidak ada komentar:

Posting Komentar