#Layout desktop

Di NocoBase, layout desktop adalah antarmuka aplikasi default. Layout ini cocok untuk mengelola data, memasukkan data melalui Form, mengonfigurasi proses bisnis, dan melakukan pekerjaan sehari-hari di komputer. Layout ini juga dapat digunakan di perangkat mobile.

Layout desktop dapat diakses melalui /admin secara default. Jika aplikasi memiliki prefiks akses khusus, alamat sebenarnya akan otomatis menyertakan prefiks tersebut.

#Membuat halaman

#Langkah 1: Masuk ke layout desktop

Akses /admin untuk masuk ke layout desktop. Biasanya, aplikasi juga langsung membuka halaman ini setelah login berhasil.

#Langkah 2: Aktifkan UI Editor

Klik «UI Editor» di sudut kanan atas halaman untuk masuk ke mode interface builder. Setelah aktif, titik konfigurasi akan muncul di sekitar menu, Page, Block, Field, dan Action.

#Langkah 3: Buat menu dan halaman

Kamu dapat menambahkan Group, Page, atau Link di area navigasi, serta mengaktifkan Tab pada sebuah Page. Setelah membuat Page, buka Page tersebut dan tambahkan Block yang diperlukan.

Konten halaman dibuat dengan cara yang sama seperti antarmuka lainnya: tambahkan Block, lalu konfigurasikan Field dan Action sesuai kebutuhan bisnis.

#Langkah 4: Konfigurasikan konten halaman

Tambahkan Block seperti Table, Form, Detail, dan Filter, lalu sesuaikan susunan Field, Action, dan Block. Semua perubahan akan langsung terlihat di halaman saat ini.

#Mengelola route dan menu

Setelah Page atau Link ditambahkan di area navigasi, item terkait juga akan muncul di Routes Manager. Perubahan route di Routes Manager juga akan memperbarui menu.

Layout desktop mendukung beberapa jenis route umum:

• Group — Mengelompokkan beberapa Page dan Link dalam satu grup navigasi.
• Page — Membuka halaman yang dapat diisi dengan Block.
• Link — Membuka alamat internal atau eksternal.
• Tab — Mengelompokkan beberapa konten dalam satu Page.

Di Routes Manager, kamu dapat menambah, mengedit, menghapus, menampilkan, atau menyembunyikan route. Gunakan Routes Manager jika perlu merapikan struktur menu secara terpusat.

#Responsif di layar sempit

Layout desktop dapat langsung digunakan di ponsel atau jendela browser yang sempit. Dalam kondisi ini, layout tetap menggunakan route dan Page desktop yang asli dan tidak otomatis beralih menjadi layout mobile.

#Perubahan layout

Menu navigasi akan menjadi ringkas dan Action di bagian atas dipindahkan ke akses yang lebih padat. Margin halaman serta jarak antar-Block juga mengecil, sedangkan area konten menyesuaikan tinggi tampilan browser mobile.

UI Editor tidak tersedia di layar sempit. Jika perlu mengubah menu atau halaman, kamu harus melakukannya melalui browser komputer.

#Penyesuaian konten halaman

Komponen umum di dalam halaman juga menyesuaikan interaksi untuk layar sempit agar lebih mudah digunakan di ponsel. Sebagai contoh, konten multikolom berubah menjadi satu kolom, Table dapat digulir secara horizontal untuk melihat kolom di luar layar, dan pagination serta akses Action menjadi lebih ringkas. Pemilih nilai, tanggal dan waktu, Filter, serta halaman anak juga menggunakan interaksi yang lebih sesuai untuk ponsel.

#Saran penggunaan

• Gunakan layout desktop sebagai pilihan default untuk pekerjaan yang terutama dilakukan di komputer.
• Selesaikan pembuatan halaman di layar lebar, lalu perkecil jendela untuk memeriksa tampilannya di layar sempit.
• Jika Page memiliki banyak kolom Table atau Action horizontal, pertahankan konten yang diperlukan saja agar penggunaan di layar kecil tetap ringan.
• Jika alur kerja desktop dan mobile sangat berbeda, buat halaman terpisah untuk masing-masing layout.

#Tautan terkait

• Ikhtisar layout UI — Memahami skenario penggunaan layout desktop dan layout mobile
• Layout mobile — Membuat navigasi dan halaman khusus mobile
• Block — Menambahkan dan mengonfigurasi Block di halaman
• Field — Mengonfigurasi Field pada Table, Form, dan Detail
• Action — Mengonfigurasi Action pada Page dan Block
• Routes Manager — Mengelola menu dan route desktop secara terpusat
• Konfigurasi izin — Mengontrol route desktop yang dapat diakses oleh role