step 26 : slicing edit setting mobile, onclick href edit setting mobile set localstorage

This commit is contained in:
sindhu
2025-03-14 06:09:55 +07:00
parent 7a3ec92eaa
commit 192d5ef024
4 changed files with 828 additions and 65 deletions

View File

@@ -1116,72 +1116,29 @@
<!-- 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>
<template x-for="item in dataSetting" :key="item.idSetting">
<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" x-text="item.namaJenis"></h2>
<div class="relative flex h-4 w-4">
<button @click="editMobilePage(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" x-text="item.info"></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" x-text="item.namaInstrument"></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" x-text="item.namaInterface"></p>
</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>
</template>
</div>
</div>