Komponen VDS

VDS adalah singkatan dari Vtiger Design Systems, yang mendefinisikan komponen inti HTML yang ditawarkan oleh platform VTAP. VDS menyediakan komponen yang merupakan blok UI yang dapat digunakan kembali.

Anda dapat menggunakan komponen untuk membangun dan menyesuaikan aplikasi Anda. Mereka dapat digunakan di mana saja - halaman kustom, widget, pop-up, atau di dalam komponen kustom lainnya.

Di bawah ini adalah daftar komponen yang disediakan VTAP:

vds-teks

penggunaan: Digunakan untuk kotak input. Memungkinkan pengguna untuk memasukkan informasi.

Sintaksis:

Detail atribut:

nama untuk menetapkan nama apa pun ke elemen input
cacat benar/salah, untuk menonaktifkannya
pemegang tempat untuk menunjukkan petunjuk apa pun untuk input
tipe masukan Jenis input HTML apa pun yang valid seperti email, nomor, dll. (Baca di bawah untuk detailnya.)
wajib untuk membuat bidang ini wajib 
v-model Ini adalah pengikatan data vue (reaktif), dapat digunakan untuk menyetel atau membaca nilainya.

Selain teks, VDS juga mendukung tipe input lainnya. Misalnya: 

  • vds-email
  • nomor vds
  • vds-persentase
  • vds-desimal
  • vds-telepon
  • vds-tanggal
  • waktu vds
  • vds-url

Semua komponen ini adalah tipe input yang berbeda. Mereka memiliki properti dari tipe teks-vds tetapi datang dengan validasi tipe input mereka sendiri. 

VDS-jatuhkan ke bawah

Gunakan: Untuk menampilkan dropdown dengan daftar item yang diberikan

sintaks:

Atribut yang didukung:

Pilihan Array item drop-down
beberapa benar/salah, untuk menampilkan dropdown multi-pilihan
opsi kosong Jika Anda ingin menampilkan opsi kosong terlebih dahulu
cacat benar salah
wajib benar salah

pemilik vds

Gunakan: Ini adalah komponen interaktif yang akan menampilkan pengguna dan grup sebagai drop-down. Ini akan sama dengan bidang Ditugaskan ke dalam modul apa pun di CRM.

sintaks:

Atribut yang didukung:

hanya-pengguna Jika Anda ingin melihat hanya pengguna di dropdown
hanya-kelompok Jika Anda hanya ingin melihat grup di dropdown

vds-kotak centang

Gunakan: Untuk menampilkan input kotak centang

sintaks:

vds-switch

Gunakan: Untuk menunjukkan toggle

sintaks:

vds-datepicker

Gunakan: Untuk menampilkan pemilih tanggal untuk bidang tanggal apa pun.

sintaks:

Atribut yang didukung:

format tanggal Format tanggal yang akan ditampilkan seperti DD-MM-YYYY, MM-DD-YYYY, YYYY-MM-DD

vds-daterange-picker

Gunakan: Untuk menampilkan pemilih tanggal untuk memilih rentang tanggal

sintaks:

Atribut yang didukung:

format tanggal Format tanggal yang akan ditampilkan seperti DD-MM-YYYY, MM-DD-YYYY, YYYY-MM-DD

vds-timepicker

Gunakan: Untuk menampilkan pemilih waktu

sintaks:

Atribut yang didukung:

format Format 12 atau 24 jam 

vds-rte

Gunakan: Untuk menampilkan CKEditor, UI bidang yang Anda lihat di bidang editor teks kaya 

sintaks:

peringkat vds

Gunakan: Untuk menampilkan bidang bintang peringkat. Ini akan menunjukkan maksimal 5 bintang.

sintaks:

Atribut yang didukung:

jarak Nilai antara 1 sampai 5

vds-iframe

Gunakan: Untuk menampilkan iframe dengan konten HTML yang diberikan

sintaks:

vds-kemajuan

Gunakan: Untuk menunjukkan persentase kemajuan

sintaks:

Atribut yang didukung:

nilai % dari warna
kode-warna-kustom secara default kemajuan akan ditampilkan dengan warna biru, Anda dapat memberikan nama warna yang valid
 
 
 

Kasus penggunaan Pelanggan VTAP

 
 

Salah satu pelanggan kami menggunakan aplikasi berbeda untuk melacak proyek dan kemajuan mereka. 

Mereka ingin mulai menggunakan Proyek Vtiger, tetapi antarmuka pengguna adalah satu-satunya rintangan untuk menggunakan Proyek Vtiger. Antarmuka tidak memberikan detail lengkap tentang pencapaian dan tugas pada satu layar untuk sebuah proyek, seperti yang diinginkan pelanggan.

Untuk mengatasi rintangan ini, kami menyarankan solusi berikut.

Mereka dapat menggunakan Perancang Modul platform kode rendah kami untuk merancang halaman yang akan dibagi menjadi 3 bagian. 

Bagian pertama akan menampilkan Daftar Proyek, bagian selanjutnya akan menampilkan Tonggak Pencapaian yang ditautkan ke Proyek yang dipilih, dan bagian ketiga akan menunjukkan Tugas yang ditautkan ke Proyek dan Pencapaian yang dipilih. Itu akan terlihat mirip dengan kotak surat Outlook, yang menampilkan email dan kontennya di sisi kanan. Dalam hal ini, 3 levelnya menampilkan detail tugas di bagian akhir.

Untuk membangun kemampuan ini, kami akan membuat halaman daftar kustom yang dapat ditambahkan menggunakan 'DAFTAR_ADD_VIEWTYPE' komponen. Melihat di sini sebagai contoh. 

Kemudian fungsi VTAP.API.Get akan digunakan untuk mengambil data Proyek, Pencapaian Proyek, dan Tugas. Mereka akan ditampilkan dalam kolom terpisah tetapi masih terhubung bersama. Anda dapat menyalin kode dari di sini untuk melihatnya beraksi.

 

Salah satu pelanggan kami menggunakan aplikasi berbeda untuk melacak proyek dan kemajuan mereka. 

Mereka ingin mulai menggunakan Proyek Vtiger, tetapi antarmuka pengguna adalah satu-satunya rintangan untuk menggunakan Proyek Vtiger. Antarmuka tidak memberikan detail lengkap tentang pencapaian dan tugas pada satu layar untuk sebuah proyek, seperti yang diinginkan pelanggan.

Untuk mengatasi rintangan ini, kami menyarankan solusi berikut.

Mereka dapat menggunakan Perancang Modul platform kode rendah kami untuk merancang halaman yang akan dibagi menjadi 3 bagian. 

Bagian pertama akan menampilkan Daftar Proyek, bagian selanjutnya akan menampilkan Tonggak Pencapaian yang ditautkan ke Proyek yang dipilih, dan bagian ketiga akan menunjukkan Tugas yang ditautkan ke Proyek dan Pencapaian yang dipilih. Itu akan terlihat mirip dengan kotak surat Outlook, yang menampilkan email dan kontennya di sisi kanan. Dalam hal ini, 3 levelnya menampilkan detail tugas di bagian akhir.

Untuk membangun kemampuan ini, kami akan membuat halaman daftar kustom yang dapat ditambahkan menggunakan 'DAFTAR_ADD_VIEWTYPE' komponen. Melihat di sini sebagai contoh. 

Kemudian fungsi VTAP.API.Get akan digunakan untuk mengambil data Proyek, Pencapaian Proyek, dan Tugas. Mereka akan ditampilkan dalam kolom terpisah tetapi masih terhubung bersama. Anda dapat menyalin kode dari di sini untuk melihatnya beraksi.

 
 

Keberpihakan Vtiger 

 

Alat yang kami sukai

 
 

Elasticsearch adalah proyek sumber terbuka yang bagus untuk berkontribusi jika Anda tertarik dengan ilmu data. Itu dapat menganalisis, mencari, dan menyimpan data dalam volume besar secara real time. Elasticsearch membantu penggunanya membuat data berfungsi dengan berbagai cara.

 

Elasticsearch adalah proyek sumber terbuka yang bagus untuk berkontribusi jika Anda tertarik dengan ilmu data. Itu dapat menganalisis, mencari, dan menyimpan data dalam volume besar secara real time. Elasticsearch membantu penggunanya membuat data berfungsi dengan berbagai cara.

 
 

Coming Soon

 
 

Perancang Aplikasi 

Perancang Aplikasi Vtiger akan membiarkan Anda membuat aplikasi khusus yang mungkin atau mungkin tidak bergantung pada CRM. Ini akan memberi Anda fleksibilitas untuk menulis aplikasi dalam kerangka kerja JavaScript apa pun yang Anda kuasai.

Dengan API JavaScript VTAP yang kuat, Anda juga dapat terhubung ke CRM dan mendorong/menarik data darinya untuk membuat aplikasi khusus dengan mudah.

 

Perancang Aplikasi 

Perancang Aplikasi Vtiger akan membiarkan Anda membuat aplikasi khusus yang mungkin atau mungkin tidak bergantung pada CRM. Ini akan memberi Anda fleksibilitas untuk menulis aplikasi dalam kerangka kerja JavaScript apa pun yang Anda kuasai.

Dengan API JavaScript VTAP yang kuat, Anda juga dapat terhubung ke CRM dan mendorong/menarik data darinya untuk membuat aplikasi khusus dengan mudah.

 
 

Daftar untuk menerima pembaruan terbaru!