Differences

This shows you the differences between two versions of the page.

--- newdevs:code:angular-field-order [2024/06/05 12:59] – tmccanna
+++ newdevs:code:angular-field-order [2024/06/05 13:29] (current) – [Adding Field Row Styling to Modals] tmccanna
@@ Line 8: / Line 8: @@
 ==== Via the Routing Module ====
-When you are working with a basic, dynamically-created interface you can control the field order by modifying the relevant routing.module.ts file.
+When you are working with a basic, dynamically-created interface you can control the field order by modifying the relevant **routing.module.ts** file. Note that you can also specify certain fields as visible but read-only. For example:
+<code>
+     path: 'asset/copy_location',
+     component: BasicAdminPageComponent,
+     data: [{
+         schema: 'asset',
+         table: 'copy_location',
+         readonlyFields: 'deleted',
+         fieldOrder: 'owning_lib,name,opac_visible,circulate,holdable,hold_verify,
+             checkin_alert,deleted,label_prefix,label_suffix,url,id'}]
+</code>
+A good example of this is in /eg2/src/app/staff/admin/local/routing.module.ts
 ==== Via the HTML Template ====
@@ Line 34: / Line 47: @@
 Note that you can also make use of the **hiddenFieldsList** parameter for fields that do not need to show on the form, and of the **readonlyFields** parameter to make specified fields uneditable.
+===== Adding Field Row Styling to Modals =====
+Beginning in Evergreen 3.13 ([[https://git.evergreen-ils.org/?p=Evergreen.git;a=commit;h=290ddfcd6273b0d33ab04e9fef141a2a1ee6c7e5|LP1915464]]), it is now possible to add CSS styling to specific field rows in modals that are generated by the Fieldmapper Editor Component (fm-editor.component.css).
+First, you will need to identify the fieldmapper's class ID (found in **fm_IDL.xml** - for example, 'chmm' is the class ID for the Local Admin > Hold Policies interface that is generated from the config.hold_matrix_matchpoint database table) and the names of the fields you wish to style (for example, 'item_owning_ou').
+Then, modify **eg2/src/app/share/fm-editor/fm-editor.component.css** to add styling to the specific rows. The Local Admin > Hold Policies modal is already styled to break the long list of fields into logical groupings (starting with the fields for Owning Library, User Home Library, Holdable?, and Requestor Permission Group) with space and a dotted line between each group:
+<code>
+.row {
+   --section-border: 2px dotted var(--bs-gray-900);
+   --section-padding: 2.5rem;
+ }
+/* Modal for Local Admin > Hold Policies */
+ .chmm .row.item_owning_ou,
+ .chmm .row.user_home_ou,
+ .chmm .row.holdable,
+ .chmm .row.requestor_grp {
+   border-top: var(--section-border);
+   padding-top: var(--section-padding);
+ }
+</code>