Halo @kaikcreator ,

terima kasih telah mengajukan permintaan ini, kami pikir ini adalah fitur yang berguna untuk Bidang Filter. Apakah Anda sendiri bersedia berkontribusi?

Untuk yang terpilih untuk membuat fitur ini, inilah yang Anda perlukan untuk melanjutkan.

Pertama, cari tahu Proposal API yang menjelaskan bagaimana Anda akan membangun fitur .
Apa yang Anda perlukan untuk mencapai fitur itu dan apa yang akan berubah pada dasarnya. Bidang filter bukan untuk jiwa yang lemah jadi persiapkan diri Anda untuk mengatasi ini dengan percaya diri berpikir kritis .
Beberapa pertanyaan muncul mengenai beberapa kasus tepi. Apa yang terjadi ketika tidak ada kotak yang dicentang dan ketika banyak kotak dicentang.

CATATAN: Gunakan komponen kotak centang barista kami untuk mengimplementasikan fitur tersebut. Kami tidak suka melihat penyesuaian gaya karena kotak centang di tangkapan layar Anda sudah terlihat berbeda dari milik kami.

Hai @rowa-audil , ya. Mungkin bukan saya, tetapi seseorang di tim kami akan berkontribusi pada fitur ini, pasti.
Kami akan menyediakan API secepatnya, tetapi pertama-tama kami perlu memahami sedikit lebih baik bagaimana opsi jangkauan diterapkan, karena kami pikir kami harus mengikuti pendekatan serupa. Ada saran di sini @tomheller @ffriedl89 ?

@kaikcreator , bidang filter dalam keadaan saat ini tidak terlalu dapat diperpanjang, itu sebabnya rentangnya juga sangat terjalin dengan bidang filter pada umumnya. Ada banyak hal yang menentukan _overlay_ apa yang harus dibuka.
Saya kira Anda harus mengikuti pendekatan jangkauan, tetapi ada beberapa jebakan, yang mungkin perlu diperhitungkan.

Tipe data

Rentang mendefinisikan tipe datanya sendiri dalam definisi sumber data dari bidang filter (termasuk beberapa fungsi pembantu, yang membantu mengidentifikasi apakah node adalah node rentang atau bukan dan juga membandingkan node). Anda pasti akan membutuhkan fungsi serupa seperti itu.

https://github.com/dynatrace-oss/barista/blob/f8a00b33ec830fcf8db65ce16b4809c61b09115b/libs/barista-components/filter-field/src/types.ts#L83 -L151

https://github.com/dynatrace-oss/barista/blob/f8a00b33ec830fcf8db65ce16b4809c61b09115b/libs/barista-components/filter-field/src/filter-field-util.ts#L491 -L502

Representasi visual

Rentang mengimplementasikan versinya sendiri dari perilaku pelengkapan otomatis di dalam component , dan saya pikir ini juga akan menjadi pendekatan yang baik di sini.
Hamparan dan pemicu selalu dibuat saat bidang filter dibuat, _overlay_ dibuka secara terprogram oleh bidang filter. (jika overlay tidak ditampilkan, mereka dinonaktifkan pada pemicu untuk mencegahnya muncul secara visual).

https://github.com/dynatrace-oss/barista/blob/f8a00b33ec830fcf8db65ce16b4809c61b09115b/libs/barista-components/filter-field/src/filter-field.html#L85 -L92

https://github.com/dynatrace-oss/barista/blob/f8a00b33ec830fcf8db65ce16b4809c61b09115b/libs/barista-components/filter-field/src/filter-field.ts#L434 -L474

Berurusan dengan mode edit

Mode edit dalam bidang filter sedikit rumit dalam hal manajemen status, karena Anda perlu mengembalikan filter pengeditan sebagai filter saat ini. Anda mungkin memerlukan beberapa pengeditan dalam fungsi ini untuk melakukan ini dengan benar untuk mutli-select.

https://github.com/dynatrace-oss/barista/blob/f8a00b33ec830fcf8db65ce16b4809c61b09115b/libs/barista-components/filter-field/src/filter-field.ts#L664 -L709

Terima kasih @tomheller , ini pasti akan banyak membantu kami!!!

Memikirkan kemungkinan grup, akan lebih baik untuk mengadopsi opsi dan grup pelengkapan otomatis

ts export interface DtMultiSelectDef<OpGr = unknown> { optionsOrGroups: DtNodeDef<OpGr>[]; }

Perbarui DtNodeFlags dengan tipe baru

ts export enum DtNodeFlags { None = 0, TypeAutocomplete = 1 << 0, TypeFreeText = 1 << 1, TypeOption = 1 << 2, TypeGroup = 1 << 3, TypeRange = 1 << 4, TypeMultiSelect = 1 << 5, RenderTypes = TypeAutocomplete | TypeFreeText | TypeRange | TypeMultiSelect, Types = TypeAutocomplete | TypeFreeText | TypeOption | TypeGroup, }

ts export function isDtMultiSelectDef<D = unknown>( def: DtNodeDef<D> | null, ): def is DtNodeDef<D> & DtMultiSelectDef { return isDtNodeDef(def) && !!(def.nodeFlags & DtNodeFlags.TypeMultiSelect); }

DtFilterFieldMultiPilih

Masukan

|Nama|Jenis|Deskripsi|
|-|-|-|
|optionsOrGroups| DtNodeDef<OpGr>[] | Opsi yang sudah dipilih|

Keluaran

|Nama|Memancarkan|Deskripsi|
|-|-|-|
| dibuka | void | Panel dibuka|
|tutup| void | Panel ditutup|
| pilihanDikirim | DtNodeDef<OpGr>[] | Opsi yang dipilih oleh pengguna|

DtFilterFieldMultiSelectTrigger

Masukan

|Nama|Jenis|Deskripsi|
|-|-|-|
|dtFilterFieldMultiSelect| DtFilterFieldMultiSelect |Panel multi-pilihan bidang filter yang akan dilampirkan ke pemicu ini.|
|dtFilterFieldMultiSelectDisabled| boolean |Apakah panel multi pilih bidang filter harus dinonaktifkan.|

@tomheller Saya akan mulai dengan ini minggu depan

Untuk daftar kotak centang, saya berpikir untuk menggunakan ReactiveFormsModule, tetapi saya melihat bahwa kami tidak menggunakannya di mana pun pada filter. Apakah ada alasan untuk itu sehingga saya harus menghindarinya atau apakah saya dapat menggunakannya? @thomaspink @tomheller

Anda dapat menggunakannya jika Anda mau, atau membuat model pilihan Anda sendiri dari cdk seperti yang dilakukan @dt-mafe di pr-nya tentang baris yang dapat dipilih #1052

Tidak ada di peta jalan kami.