Trenutno dejavna stran: start » sl » Interna dokumentacija » Razširitve DokuWikija (WvdS) » FluentUI (knjižnica oblikovalskega sistema) » Navodila: dodajanje posameznih gradnikov

Navodila: dodajanje posameznih gradnikov

Nazaj: FluentUI (knjižnica oblikovalskega sistema)


Za koga: za razvijalce, ki že imajo obstoječ skrbniški zaslon (lasten vtičnik ali wksqliteds kot vzor) in želijo dodati natanko en gradnik, ne da bi ponavljali celotno pot vodnika od začetka. Vsak recept je kratek in ciljno usmerjen; pogodbe metod so izključno v FluentUI: javni API pomočnika — ta recept jih ne ponavlja, temveč nanje povezuje.

Recept: dodajanje orodne vrstice

Cilj: razpršene gumbe nad seznamom/mrežo nadomestiti s tipkovnično dostopno ukazno vrstico.

  1. Naložite pomočnika (če tega še niste storili): $widgets = plugin_load('helper', 'wkfluentui_widgets');.
  2. Vsak gumb zgradite kot dokončan fragment HTML (lastna barvna semantika, glej Styles Contract (--wk-*)).
  3. Fragmente predajte v $widgets→toolbar($items, $opts); gumbi z isto vrednostjo group se združijo drug ob drugem z ločilno črto (npr. group' => 'danger' za dejanja brisanja skrajno desno).
  4. Rezultat izpišite neposredno nad seznamom/mrežo — lasten razred CSS ni potreben, toolbar() že zagotavlja role=„toolbar“ + tipkovninsko navigacijo (scripts/toolbar.js).

Popolna pogodba parametrov: Toolbar → osnove, metoda „toolbar()". Živ vzor: orodna vrstica Table Designerja v wksqliteds/dbadmin/DbAdmin.php.

Recept: dodajanje podokna lastnosti

Cilj: desna pomožna vrstica, ki prikazuje lastnosti trenutne izbire v drevesu/mreži (vzorec ADS „properties panel„).

  1. Rezervirajte območje <div class=„wk-shell-auxbar“> v mreži .wkq-shell (glej FluentUI: osnovna postavitev podrobno za sestavo mreže).
  2. Izbiro prenesite prek lastnega parametra poizvedbe (prvi poskus: povezava za klik, brez JS-a v živo — preverjena konvencija, ni je treba znova izumljati). Pazite na trk imen: ne izberite imena parametra, ki ga že uporablja lastno usmerjanje DokuWiki (do/page sta rezervirana za do=admin&page=<vtičnik>; prav na ta trk je naletel wksqliteds, glej spodaj).
  3. Izbiro razrešite na strani strežnika (naložite zapis) in jo izrišite z $widgets→propertyGrid($rows); zagotovite nadomestno besedilo, kadar ni nič izbrano ali referencirani zapis ne obstaja več.

Popolna pogodba vrstice: Property Grid → osnove, metoda „propertyGrid()". Živ vzor (dve popolni izvedbi): wksqliteds/dbadmin/DbAdmin.php::renderStructureAuxbar()/ renderBrowseAuxbar().

Recept: dodajanje zavihkov

Cilj: ponuditi več podpogledov istega zapisa/območja kot vrstico zavihkov (npr. stolpci/indeksi/tuji ključi/sprožilci zaslona Table Designer, ali rezultati/sporočila rezultata poizvedbe).

  1. Vsak zavihek modelirajte kot ['key' => string, 'label' => string, 'href' => string]href nosi popolno ciljno povezavo, vključno z vsemi potrebnimi parametri poizvedbe.
  2. Povezav, ki so že HTML-kodirane prek url()/wl() (&amp; namesto &), ne pošiljajte znova skozi hsc() — to povzroči dvojno ubežanje in pokvarjene povezave (v wksqliteds se je zgodilo dvakrat; oba primera je bil simptom: klik pristane na splošni začetni strani namesto na pričakovanem zavihku). Uveljavljena konvencija: zasebna metoda ovojnica xyzUrl($raw = false), kot je DbAdmin::rtabUrl()/dselUrl(), ki po potrebi posreduje $raw = true v url().
  3. Pokličite $widgets→tabs($tabs, $active); $active se primerja z key po enakosti niza.

Popolna pogodba parametrov: Tab Control → osnove, metoda „tabs()". Živ vzor: zavihki rezultatov/sporočil v SQL Workbenchu, wksqliteds/dbadmin/DbAdmin.php::renderResultsMessagesTabs().

Omejitve in odpravljanje težav

  • Trk imena parametra poizvedbe z usmerjanjem: lastno usmerjanje do=admin zaseda page (ime vtičnika). Lasten parameter seznama/mreže z enakim imenom prevzame array_merge() funkcije url() in tiho povozi vrednost usmerjanja — vsaka generirana povezava na zaslonu tedaj vodi nazaj na splošni skrbniški pregled namesto na pričakovano stanje. Najdeno in odpravljeno pri straneh v pregledovalniku (Browse) wksqliteds (parameter preimenovan iz page v bpage) — vsak nov parameter poizvedbe vnaprej preverite glede na rezervirana imena DokuWiki (do, page, id, rev, sectok).
  • Pasti prevajalnika CSS (usodne za celotno spletno mesto): min()/calc() z mešanimi enotami ter zaporedje znakov */ v besedilu komentarja prekineta prevajanje CSS za celotno spletno mesto — glej omejitve_in_odpravljanje_tezav.
  • Polja z besedilom CodeMirror v testih Playwright: page.fill() ne doseže več osnovnega <textarea>, ko ga CodeMirror nadomesti — uporabite page.evaluate() z ta.nextSibling.CodeMirror.setValue(…).

Naprej


Preverjeno glede na: wkfluentui@a477094, wk-dw-msqlite-plugin@240c064

sl/wiki/dwe/wkfluentui/howto.txt · Zadnja sprememba: uporabnika 0.0.0.0