kamilersz · March 17, 2021 22:53
diff --git a/tutorial-rancangan-koding.tsv b/tutorial-rancangan-koding.tsv
	Fitur	Rancangan
	1. Input barcode	input type text, v-model="form.input_barcode"
	1.2. Ketika tombol enter ditekan, cari produk ke list produk.	tambah event handler @keyup.enter="handleSearchBarcode()"
	1.2.1. Jika produk ditemukan, tambahkan ke list belanjaan	jika searchBarcode() return product, listItems.push(product)
	1.2.2. Jika produk tidak ditemukan, munculkan pesan error "Barcode tidak ditemukan"	jika searchBarcode() return null, munculkan toast error
	2.1. Munculkan looping list belanjaan	v-for="(item,index) in listItems" :key="item.id"
	2.1.1. Munculkan foto produk	binding attribut src ke tag HTML => <img :src="item.image_url">
	2.1.2. Munculkan nama produk	gunakan v-text dengan kurung kurawal {{ item.name }}
	2.1.3. Munculkan harga produk	gunakan v-text dengan kurung kurawal, ditambah simbol RP + Vue Filter untuk format uang {{ item.price \| formatCurrency }}. Buat juga filter formatCurrency
	3. Input kuantitas produk	binding v-model ke input, dengan attribut ke `item` supaya masuk ke looping <input v-model="item.quantity"
	3.1. Angka harus di atas 0	min="1"
	3.2. Default angka 1	di bagian handleSearchBarcode, sebelum push product baru tambahkan kodingan product.quantity = 1
	3.3. Harus numerik	type="number"
	4. Buat tombol "hapus barang" per list belanjaan	<button @click="deleteItem(index)">
	5. Munculkan harga total per produk otomatis	hitung quantity x price, munculkan dengan bind v-text. gunakan Vue Filter untuk format juga Rp {{ item.quantity * item.price \| formatCurrency }}
	6. Munculkan total harga per transaksi otomatis	buat computed countTotalPrice(), menghitung total quantity x price dari semua elemen pada listItems
	7. Simpan transaksi	buat tombol <button @click="saveTransaction()">, fungsi saveTransaction akan menyimpan ke backend. Ketika berhasil, listItems di-kosongkan
	7.1. Jika list belanjaan kosong, tombol "simpan" menjadi tidak bisa di-klik (disabled)	tambah binding :disabled="listItems.length == 0" pada button save
	7.2. Ketika data sedang di-save, munculkan icon loading pada tombol simpan dan tidak boleh di-klik lagi	tambahkan validasi loading pada :disabled="listItems.length == 0 \|\| loading", sehingga tombol menjadi disabled ketika kosong ATAU sedang loading. Tambahkan juga icon loadingnya
No results found