step 24 : list setting mobile
This commit is contained in:
@@ -1,5 +1,9 @@
|
|||||||
document.addEventListener('alpine:init', () => {
|
document.addEventListener('alpine:init', () => {
|
||||||
Alpine.data('settingsPage', () => ({
|
Alpine.data('settingsPage', () => ({
|
||||||
|
// 0. Init dijalankan sebelum inisialisasi
|
||||||
|
init(){
|
||||||
|
|
||||||
|
},
|
||||||
// 1. Inisialisasi Start
|
// 1. Inisialisasi Start
|
||||||
showDialogAdd: false,
|
showDialogAdd: false,
|
||||||
objAddForm: {
|
objAddForm: {
|
||||||
|
|||||||
@@ -1045,6 +1045,78 @@
|
|||||||
|
|
||||||
<!-- Bagian Kanan (PORT STATUS) -->
|
<!-- Bagian Kanan (PORT STATUS) -->
|
||||||
<div class="w-full lg:w-1/2 rounded-lg flex flex-col flex-1 overflow-auto">
|
<div class="w-full lg:w-1/2 rounded-lg flex flex-col flex-1 overflow-auto">
|
||||||
|
<!-- table become list in mobile -->
|
||||||
|
<div class="flex flex-row mb-6 lg:hidden lg:mb-0">
|
||||||
|
<div class="flex flex-col w-full lg:flex-row mb-5">
|
||||||
|
<!-- 1 -->
|
||||||
|
<div class="bg-white mr-0 mb-5 rounded-md lg:mr-5 p-2 w-full lg:w-1/2 lg:mb-0 relative">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<h2 class="text-black/87 font-medium text-xl mb-4">TCP Server</h2>
|
||||||
|
<div class="relative flex h-4 w-4">
|
||||||
|
<button @click="openModalEdit(item)"><span
|
||||||
|
class="material-symbols-outlined text-[#2196F3]">edit</span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Info</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> Port 5001</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Instrument</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> Hema 01</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Interface</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> Xn550</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 2 -->
|
||||||
|
<div class="bg-white mr-0 mb-5 rounded-md lg:mr-5 p-2 w-full lg:w-1/2 lg:mb-0 relative">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<h2 class="text-black/87 font-medium text-xl mb-4">TCP Client</h2>
|
||||||
|
<div class="relative flex h-4 w-4">
|
||||||
|
<button @click="openModalEdit(item)"><span
|
||||||
|
class="material-symbols-outlined text-[#2196F3]">edit</span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Info</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> Server 192.168.0.1, Port 4000</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Instrument</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> Axsym</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Interface</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> Axsym</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 3 -->
|
||||||
|
<div class="bg-white mr-0 mb-5 rounded-md lg:mr-5 p-2 w-full lg:w-1/2 lg:mb-0 relative">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<h2 class="text-black/87 font-medium text-xl mb-4">RS232</h2>
|
||||||
|
<div class="relative flex h-4 w-4">
|
||||||
|
<button @click="openModalEdit(item)"><span
|
||||||
|
class="material-symbols-outlined text-[#2196F3]">edit</span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Info</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> ttyS01, 9600, N, 8, 1</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Instrument</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> Cobas C311</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<p class="text-[#00000099] font-normal text-sm mb-2">Interface</p>
|
||||||
|
<p class="text-black/87 font-normal text-sm mb-2"> C311</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="flex flex-row">
|
<div class="flex flex-row">
|
||||||
<div class="flex flex-col w-full lg:flex-row mb-5">
|
<div class="flex flex-col w-full lg:flex-row mb-5">
|
||||||
<!-- 1 -->
|
<!-- 1 -->
|
||||||
|
|||||||
Reference in New Issue
Block a user