ywana-core8 0.0.64 → 0.0.68

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.64",
+  "version": "0.0.68",
   "description": "ywana-core8",
   "author": "Ernesto Roldan Garcia",
   "license": "MIT",

package/src/domain/TablePage.css

@@ -26,4 +26,5 @@ aside.table-page {
 main.table-editor {
     flex: 1;
     overflow: auto;
-}
+}
+

package/src/domain/TablePage.js

@@ -16,7 +16,7 @@ const http = HTTPClient(window.API || process.env.REACT_APP_API, Session);
 export const TablePage = (props) => {
 
     const site = useContext(SiteContext)
-    const { id = "table", icon, title, name = "table 1", schema, url, field, delay = 1000, actions, editable, canAdd = true, dev = false, autosave = true, groupBy, validator, scenario, formFilter, tableFilter, tableActions } = props
+    const { id = "table", icon, title, name = "table 1", schema, url, field, delay = 1000, actions, editable, canAdd = true, canDelete = true, dev = false, autosave = true, groupBy, validator, scenario, formFilter, tableFilter, tableActions } = props
     const [pageContext, setPageContext] = useContext(PageContext)
     const { selected } = pageContext
     const timer = useRef(null)
@@ -46,7 +46,6 @@ export const TablePage = (props) => {
             await pageContext.create(form);
             setPageContext(Object.assign({}, pageContext))
         }
-        //site.openDialog(<EditContentDialog label={`Crear ${name}`} type={schema} onOK={onOK} validator={validator} />);
         site.openDialog(<CreateContentDialog label={`Crear ${name}`} type={schema} onOK={onOK} validator={validator} filter={formFilter}/>);
     }
 
@@ -111,7 +110,7 @@ export const TablePage = (props) => {
                 <TableFilters schema={schema} />
             </menu>
             <main key={id} className="table-page">
-                <TableEditor icon={icon} title={name} schema={schema} delay={delay} editable={editable} groupBy={groupBy} filter={tableFilter} actions={tableActions} />
+                <TableEditor icon={icon} title={name} schema={schema} delay={delay} editable={editable} groupBy={groupBy} filter={tableFilter} actions={tableActions} canDelete={canDelete}/>
             </main>
             {renderAside()}
         </Fragment>
@@ -171,7 +170,7 @@ const TableEditor = (props) => {
 
     const [pageContext, setPageContext] = useContext(PageContext)
     const { all = [], filters } = pageContext
-    const { icon, title, schema, editable, filter, actions } = props
+    const { icon, title, schema, editable, canDelete, filter, actions } = props
     const [groupBy, setGroupBy] = useState(props.groupBy)
 
     function changeGroup(id, value) {
@@ -247,48 +246,24 @@ const TableEditor = (props) => {
                                 action.filter(item) ? <Icon icon={action.icon} clickable size="small" action={() => run(action, item) }/> : null
                                     : <Icon icon={action.icon} clickable size="small" action={() => run(action, item) }/>
                         }) : []
-                        item.actions.push(<Icon icon="delete" size="small" clickable action={() => remove(item.id)} />)
+                        if (canDelete) item.actions.push(<Icon icon="delete" size="small" clickable action={() => remove(item.id)} />)
                         return item
                     })
             }
 
             table.columns.push({ id: "actions" })
-
+            const groupSize = groups[groupName].length
+            
             return (
                 <Fragment key={groupName}>
-                    <Header title={groupName} />
+                    <Header title={groupName} >
+                        <span className="size">{groupSize}</span>
+                    </Header>
                     <DataTable {...table} onRowSelection={select} editable={editable} />
                 </Fragment>
             )
         })
     }
-    
-/*  DUPLIDCADO
-    const table = {
-        columns: Object.values(schema)
-            .filter(field => field.column === true)
-            .map(field => {
-                let options = field.options;
-                if (options && typeof (options) == 'function') {
-                    options = options()
-                }
-                return {
-                    id: field.id,
-                    label: field.label,
-                    type: field.type,
-                    onChange: field.editable ? change : null,
-                    options
-                }
-            }),
-        rows: all
-            .map(item => {
-                item.actions = [<Icon icon="delete" size="small" clickable action={() => remove(item.id)} />]
-                return item
-            })
-    }
-
-    table.columns.push({ id: "actions" })
-*/
 
     function buildGroupOptions(schema) {
         return Object.values(schema)
@@ -401,7 +376,6 @@ const TableAPI = (url) => {
                             param = param.concat(`${key}=${item}&`)
                             return param
                         }, "")
-                        console.log(param)
                         return query.concat(param)
                     } else {
                         return query.concat(`${key}=%${filters[key]}%&`)

package/src/widgets/avatar/Avatar.css

@@ -0,0 +1,10 @@
+.avatar {
+    border-radius: 100%;
+    background-color: rgba(200,200,200,.1);
+    overflow: hidden;
+}
+
+.avatar.small {
+    width: 3rem;
+    height: 3rem;
+}

package/src/widgets/avatar/Avatar.js

@@ -0,0 +1,24 @@
+import React from 'react'
+import './Avatar.css'
+
+/**
+ * Avatar
+ */
+export const Avatar = (props) => {
+
+    const { id, name, src, size="small", clickable=false, action} = props
+
+    function click() {
+        if (clickable) {
+            action(id)
+        }
+    }
+
+    const style = clickable ? 'clickable' : ''
+    const className= `avatar ${size} ${style}`
+    return (
+        <div className={className} onClick={click}>
+            { src ? <img src={src} /> : <span>{name}</span>}
+        </div>
+    )
+}

package/src/widgets/index.js

@@ -1,4 +1,5 @@
 export * from './login/LoginBox'
 export * from './login/ResetPasswordBox'
 export * from './viewer/Viewer'
-export * from './kanban/Kanban'
+export * from './kanban/Kanban'
+export * from './avatar/avatar'