ywana-core8 0.0.781 → 0.0.783

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.781",
+  "version": "0.0.783",
   "description": "ywana-core8",
   "homepage": "https://ywana.github.io/workspace",
   "author": "Ernesto Roldan Garcia",

package/src/html/table.js

@@ -174,7 +174,7 @@ const DataTableRow = (props) => {
 const DataTableCell = ({ index, row, column, cell, editable }) => {
 
     const render = (type) => {
-        const { id, disabled = false, min, max, onChange, format, options, item, action } = column
+        const { id, disabled = false, min, max, onChange, format, options, item, action, maxDecimals } = column
 
 
         if (id === "checked") {
@@ -198,7 +198,7 @@ const DataTableCell = ({ index, row, column, cell, editable }) => {
                 case "ICON": return <Icon icon={cell} />
                 case "Boolean": return <BooleanCellViewer id={id} value={cell} />
                 case "String": return <StringCellViewer id={id} value={cell} format={format} options={options} action={action} />
-                case "Number": return <NumberCellViewer id={id} value={cell} format={format} />
+                case "Number": return <NumberCellViewer id={id} value={cell} format={format} maxDecimals={maxDecimals} />
                 default: return cell
             }
         }
@@ -260,7 +260,7 @@ const BooleanCellViewer = ({ id, value = false }) => {
  * NumberCellViewer
  */
 const NumberCellViewer = ({ id, value, format, maxDecimals }) => {
-
+/*
     function formatNumber(number) {
         // convert number to numeric
         if (number === null) return "null"
@@ -273,6 +273,20 @@ const NumberCellViewer = ({ id, value, format, maxDecimals }) => {
         const thousands = /\B(?=(\d{3})+(?!\d))/g;
         return numberPart.replace(thousands, ".") + (decimalPart ? "," + decimalPart : "");
     }
+*/
+    function formatNumber(number, maxDecimals = 0) {
+        if (number === null) return "null"
+        let result = number.toLocaleString('es-ES', { minimumFractionDigits: 2, maximumFractionDigits: 2 })
+        // thousands separator is a dot
+        var parts = result.toString().split(",");
+        const numberPart = parts[0];
+        const decimalPart = parts[1];
+        const thousands = /\B(?=(\d{3})+(?!\d))/g;
+    
+        // limit decimal part to maxdecimals
+        const decimal = decimalPart ? decimalPart.substring(0, maxDecimals) : null;
+        return numberPart.replace(thousands, ".") + (decimal ? "," + decimal : "");
+    }
 
     if (format) {
         switch (format) {
@@ -288,11 +302,8 @@ const NumberCellViewer = ({ id, value, format, maxDecimals }) => {
                 // if value is not a number, return value
                 if (isNaN(number)) return value
 
-                // if maxDecimals is defined, round number
-                if (maxDecimals) number = number.toFixed(maxDecimals)
-
                 // format number
-                return <span>{formatNumber(number)}</span>
+                return <span>{formatNumber(number, maxDecimals)}</span>
 
             default:
                 return <span>{value}</span>
@@ -370,7 +381,6 @@ export const StringCellEditor = ({ id, value = '', options, onChange }) => {
  */
 const SortIcon = (props) => {
     const { sortDir, onChange } = props
-    console.log("sortDir", sortDir)
     const icon = sortDir ? sortDir > 0 ? "arrow_upward" : "arrow_downward" : "swap_vert"
     return <Icon icon={icon} size="small" clickable action={onChange} />
 }

package/src/html/table.test.js

@@ -6,15 +6,15 @@ export const TableTest = (prop) => {
 
     const [rows, setRows] = useState(
         [
-            { id: 1, checked: false, name: "John Smith"    , description: "lorem ipsum 9", color: "#CACAFF", num: 25, thumb: "https://w7.pngwing.com/pngs/881/826/png-transparent-pikachu-ash-ketchum-pokemon-vrste-pikachu-leaf-flower-meme-thumbnail.png" },
-            { id: 2, checked: false, name: "Ann Martin"    , description: "lorem ipsum 2", color: "#CCFFFF", num: 1234567890.1234567890 },
-            { id: 3, checked: false, name: "Ann Martin"    , description: "lorem ipsum 8", color: "#CCFFFF", num: 12340.1234567890 },
-            { id: 4, checked: false, name: "Zack McCracken", description: "lorem ipsum 4", color: "#CCFFFF", num: 567890.1234567890 },
-            { id: 5, checked: false, name: "Ann Martin"    , description: "lorem ipsum 1", color: "#CCFFFF", num: 23670.190 },
-            { id: 6, checked: false, name: "John Smith"    , description: "lorem ipsum 2", color: "#CCFFFF", num: 71230.10 },
-            { id: 7, checked: false, name: "Ann Martin"    , description: "lorem ipsum 1", color: "#CCFFFF", num: 3490.23 },
-            { id: 8, checked: false, name: "Martin Freeman", description: "lorem ipsum 4", color: "#CCFFFF" , num: 890.1234567890 },
-            { id: 9, checked: false, name: "Ann Martin"    , description: "lorem ipsum 5", color: "#CCFFFF", date: new Date().toString() },
+            { id: 1, checked: false, name: "John Smith"    , description: "lorem ipsum 9", color: "#CACAFF", num: "25", thumb: "https://w7.pngwing.com/pngs/881/826/png-transparent-pikachu-ash-ketchum-pokemon-vrste-pikachu-leaf-flower-meme-thumbnail.png" },
+            { id: 2, checked: false, name: "Ann Martin"    , description: "lorem ipsum 2", color: "#CCFFFF", num: "1234567890.1234567890" },
+            { id: 3, checked: false, name: "Ann Martin"    , description: "lorem ipsum 8", color: "#CCFFFF", num: "12340.1234567890" },
+            { id: 4, checked: false, name: "Zack McCracken", description: "lorem ipsum 4", color: "#CCFFFF", num: "567890.1234567890" },
+            { id: 5, checked: false, name: "Ann Martin"    , description: "lorem ipsum 1", color: "#CCFFFF", num: "23670.190" },
+            { id: 6, checked: false, name: "John Smith"    , description: "lorem ipsum 2", color: "#CCFFFF", num: "71230.10" },
+            { id: 7, checked: false, name: "Ann Martin"    , description: "lorem ipsum 1", color: "#CCFFFF", num: "3490.23" },
+            { id: 8, checked: false, name: "Martin Freeman", description: "lorem ipsum 4", color: "#CCFFFF" , num: "890.1234567890" },
+            { id: 9, checked: false, name: "Ann Martin"    , description: "lorem ipsum 5", color: "#CCFFFF", num: "365", date: new Date().toString() },
         ]
     )
 
@@ -55,7 +55,7 @@ export const TableTest = (prop) => {
     return (
         <>
             <div style={{ maxHeight: "20rem", overflow: "auto", margin: "2rem", display: "flex" }}>
-                x<DataTable {...table1} onRowSelection={select} outlined multisort={true}/>
+                z<DataTable {...table1} onRowSelection={select} outlined multisort={true}/>
             </div>
             <div style={{ maxHeight: "20rem", overflow: "auto", margin: "2rem" }}>
                 <DataTable {...table1} onRowSelection={select} onCheckAll={checkAll} />

package/src/incubator/task.js

@@ -167,7 +167,6 @@ export const TaskMonitor = (props) => {
     }
 
     async function remove(task) {
-        console.log("remove", task)
         await context.removeTask(task)
         refresh()
     }
@@ -175,30 +174,39 @@ export const TaskMonitor = (props) => {
     const table = {
         columns: [
             { id: "state", label: "Estado" },
+            { id: "init", label: "Inicio", type: TYPES.STRING, format: FORMATS.DATE},
+            { id: "end", label: "Fin", type: TYPES.STRING, format: FORMATS.DATE },
             { id: "description", label: "Descripcion" },
             { id: "progress", label: "%" },
             { id: "percentage", label: "" },
-            { id: "init", label: "Inicio", type: TYPES.STRING, format: FORMATS.DATE },
-            { id: "end", label: "Fin", type: TYPES.STRING, format: FORMATS.DATE },
-            { id: "resourceID", label: "Recurso" },
-            { id: "owner", label: "Propietario" },
+            //            { id: "resourceID", label: "Recurso" },
+            //            { id: "owner", label: "Propietario" },
             { id: "actions", label: "" }
         ],
-        rows: tasks.map(task => {
-            return {
-                id: task.id,
-                state: task.state,
-                description: task.description,
-                progress: <LinearProgress progress={task.percentage} />,
-                percentage: task.percentage,
-                init: task.init,
-                end: task.end,
-                resourceID: task.resourceID,
-                owner: task.owner,
-                actions: <Icon size="small" icon="cancel" clickable action={() => remove(task)} />,
-                info: editors && task.result ? <TaskInfo task={task} editors={editors} /> : null
-            }
-        })
+        rows: tasks
+
+            // sort by init date from recent to old
+            .sort((a, b) => {
+                if (a.init > b.init) return -1
+                if (a.init < b.init) return 1
+                return 0
+            })
+
+            .map(task => {
+                return {
+                    id: task.id,
+                    state: task.state,
+                    description: task.description,
+                    progress: <LinearProgress progress={task.percentage} />,
+                    percentage: task.percentage,
+                    init: task.init,
+                    end: task.end,
+                    resourceID: task.resourceID,
+                    owner: task.owner,
+                    actions: <Icon size="small" icon="cancel" clickable action={() => remove(task)} />,
+                    info: editors && task.result ? <TaskInfo task={task} editors={editors} /> : null
+                }
+            })
     }
 
     return (