refactir

front/js/svelte/content/Table.svelte

@@ -4,6 +4,7 @@
     import {usernameById} from "../account/users";
     import {getContext} from "svelte";
     import Avatar from "../account/Avatar.svelte";
+    import {selectRecord, toggleAll} from "./functions/recordSelect.js";
 
     const channel = getContext("channel");
 
@@ -18,24 +19,12 @@
     export let isWritable;
     export let selected = [];
 
-    function toggleAll(e) {
-        // e.preventDefault();
-        if (selected.length === records.length) {
-            selected = [];
-        } else {
-            selected = records;
-        }
-        e.currentTarget.checked = selected.length > 0;
+    function eventToggleAll(e) {
+        selected = toggleAll(e,records,selected)
     }
 
-    function selectRecord(e, record) {
-        let recordExists = selected.find((r) => r.id == record.id);
-
-        if (recordExists) {
-            selected = selected.filter((r) => r.id !== record.id);
-        } else {
-            selected = [...selected, record];
-        }
+    function select(record) {
+        selected = selectRecord(record, selected)
     }
 
     $: visibleColumns = schema.fields.filter(c => schema.visible.includes(c.name))
@@ -49,7 +38,7 @@
             {#if isWritable}
                 <th>
                     <input
-                            on:change|preventDefault={toggleAll}
+                            on:change|preventDefault={eventToggleAll}
                             indeterminate={selected.length > 0 &&
                             selected.length < records.length}
                             checked={selected.length == records.length}
@@ -61,7 +50,7 @@
 
             {#each visibleColumns as field}
                 <th
-                        class="field-ui-{field.ui}"
+                        class="field-ui-{field.info.name ?? field.ui}"
                         class:is-sort={field.name === sortField.name}
                         scope="col"
                         title={field.help}
@@ -85,8 +74,7 @@
                             {#if isWritable}
                                 <div class="form-check">
                                     <input
-                                            on:change={(e) =>
-                                            selectRecord(e, record)}
+                                            on:change={() => select(record)}
                                             class="form-check-input "
                                             type="checkbox"
                                             checked={selected.find(
@@ -127,7 +115,6 @@
                         {visibleColumns}
                         {sortParam}
                         {sortField}
-                        {inModal}
                         {users}
                 />
             </tr>
@@ -136,15 +123,3 @@
     </table>
 </div>
 
-<style>
-    /* .title-td:hover {
-        overflow: visible;
-    }
-
-    .title-td:hover .title-td-contents a {
-        z-index: 1;
-        box-shadow: inset 0em 0em 0em 10em rgba(0, 0, 0, 0.1);
-        width: 100%;
-        max-width: 100%;
-    } */
-</style>