fam-archetype-app 0.0.1

package/src/fam-archetype-app/files/src/shared/styles/global/_icons.scss

@@ -0,0 +1,37 @@
+.pi {
+  font-size: 3rem;
+}
+
+.layout-topbar-action {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 50%;
+  width: 2.5rem;
+  height: 2.5rem;
+  color: var(--p-text-color);
+  transition: background-color var(--p-transition-duration);
+  cursor: pointer;
+
+  &:hover {
+    background-color: var(--p-content-hover-background);
+  }
+
+  i {
+    font-size: 1rem;
+  }
+
+  span {
+    font-size: 1rem;
+    display: none;
+  }
+
+  &.layout-topbar-action-highlight {
+    background-color: var(--p-primary-color);
+    color: var(--p-primary-contrast-color);
+  }
+
+  fa-icon {
+    color: var(--p-primary-color);
+  }
+}

package/src/fam-archetype-app/files/src/shared/styles/global/_tooltips.scss

@@ -0,0 +1,14 @@
+.p-tooltip .p-tooltip-text {
+  background-color: var(--p-content-background) !important;
+  color: var(--p-text-color) !important;
+  font-size: .75rem !important;
+  min-width: 14rem;
+}
+
+.p-tooltip .p-tooltip-arrow {
+  border-top-color: var(--p-content-background) !important; // si la posición es 'top'
+}
+
+.p-tooltip-bottom .p-tooltip-arrow {
+  border-bottom-color: var(--p-content-background) !important;
+}

package/src/fam-archetype-app/files/src/shared/styles/global/_typography.scss

@@ -0,0 +1,68 @@
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    margin: 1.5rem 0 1rem 0;
+    font-family: inherit;
+    font-weight: 700;
+    line-height: 1.5;
+    color: var(--p-text-color);
+
+    &:first-child {
+        margin-top: 0;
+    }
+}
+
+h1 {
+    font-size: 2.5rem;
+}
+
+h2 {
+    font-size: 2rem;
+}
+
+h3 {
+    font-size: 1.75rem;
+}
+
+h4 {
+    font-size: 1.5rem;
+}
+
+h5 {
+    font-size: 1.25rem;
+}
+
+h6 {
+    font-size: 1rem;
+}
+
+mark {
+    background: #fff8e1;
+    padding: 0.25rem 0.4rem;
+    border-radius: var(--p-content-border-radius);
+    font-family: monospace;
+}
+
+blockquote {
+    margin: 1rem 0;
+    padding: 0 2rem;
+    border-left: 4px solid #90a4ae;
+}
+
+hr {
+    border-top: solid var(--p-content-border-color);
+    border-width: 1px 0 0 0;
+    margin: 1rem 0;
+}
+
+p {
+    margin: 0 0 1rem 0;
+    line-height: 1.5;
+
+    &:last-child {
+        margin-bottom: 0;
+    }
+}

package/src/fam-archetype-app/files/src/shared/styles/global/_utils.scss

@@ -0,0 +1,24 @@
+.clearfix:after {
+    content: ' ';
+    display: block;
+    clear: both;
+}
+
+.card {
+    background: var(--p-content-background);
+    padding: 2rem;
+    margin-bottom: 2rem;
+    border-radius: var(--p-content-border-radius);
+
+    &:last-child {
+        margin-bottom: 0;
+    }
+}
+
+.p-toast {
+    &.p-toast-top-right,
+    &.p-toast-top-left,
+    &.p-toast-top-center {
+        top: 100px;
+    }
+}

package/src/fam-archetype-app/files/src/shared/styles/global/layout.scss

@@ -0,0 +1,5 @@
+@use './_core';
+@use './_utils';
+@use './_typography';
+@use './icons';
+@use './_tooltips';

package/src/fam-archetype-app/files/src/shared/table/column-visibility-selector/column-visibility-selector.component.html

@@ -0,0 +1,10 @@
+<p-multiselect
+    [options]="availableColumns()"
+    [ngModel]="selectedColumns()"
+    (onChange)="selectedColumns.set($event.value)"
+    [maxSelectedLabels]="maxSelectedLabels()"
+    optionLabel="label"
+    placeholder="Selecciona columnes"
+        fluid
+>
+</p-multiselect>

package/src/fam-archetype-app/files/src/shared/table/diba-table/diba-table.component.html

@@ -0,0 +1,136 @@
+<!-- diba-table.component.html -->
+<div class="diba-table max-w-[95vw]" [class.hidden]="loading">
+  <div class="flex justify-between">
+    <div class="flex justify-start">
+      <div class="select-rows flex justify-start items-center mb-2 mt-2">
+        <label for="rowsPerPage" class="mr-2">{{ 'Mostra' | primengTranslation }}</label>
+        <p-select [options]="rowsPerPageOptions" [(ngModel)]="rows" [style]="{'width':'80px'}" placeholder="Files"
+          inputId="rowsPerPage" />
+        <label for="rowsPerPage" class="ml-2 mr-2">{{ 'registres' | primengTranslation }}</label>
+      </div>
+      <div class ="select-columns mb-2 mt-2">
+        <p-multiSelect
+          [options]="optionsColumns"
+          [(ngModel)]="columnasMostrar"
+          optionLabel="header"
+          placeholder="Choose Columns"
+          (onChange)="onColumnVisibilityChange()"
+          [selectedItemsLabel]="'Columnes visibles'"
+          [showToggleAll]="false"
+          [showClear]="false">
+
+          <!-- Cerrado: hasta 3 con comas; si >3, texto fijo -->
+            <ng-template pTemplate="selectedItems" let-items>
+              <ng-container *ngIf="(items?.length || 0) > 0">
+                <ng-container *ngIf="items.length <= 3; else many">
+                  <span *ngFor="let opt of items; let last = last; trackBy: trackByField">
+                    {{ opt.header | primengTranslation }}<ng-container *ngIf="!last">, </ng-container>
+                  </span>
+                </ng-container>
+                <ng-template #many>
+                  {{ 'Columnes visibles' | primengTranslation }}
+                </ng-template>
+              </ng-container>
+              <ng-container *ngIf="!(items?.length)">
+                {{ 'Columnes visibles' | primengTranslation }}
+              </ng-container>
+            </ng-template>
+
+          <!-- Plantilla para la etiqueta del chip -->
+          <ng-template let-selected pTemplate="selectedItem">
+            {{ selected.header | primengTranslation }}
+          </ng-template>
+        </p-multiSelect>
+      </div>
+    </div>
+    <div class="mt-2 inline-flex">
+      <div>
+        <!-- Navegación normal -->
+        <p-button class="btn-primary-diba mr-2"
+          *ngIf="!embedded"
+          type="button"
+          label="{{ 'Crea' | primengTranslation }}"
+          severity="success"
+          [routerLink]="'new'">
+        <i class="fa-solid fa-plus"></i></p-button>
+        <!-- Modo embebido: abre popup de creación -->
+        <p-button
+          *ngIf="embedded"
+          class="btn-primary-diba mr-2"
+          type="button"
+          label="{{ 'Crea' | primengTranslation }}"
+          severity="success"
+          (onClick)="openCreatePopup($event)">
+          <i class="fa-solid fa-plus"></i>
+        </p-button>
+      </div>
+      <div>
+        <p-confirmdialog />
+        <p-button class="btn-primary-diba"
+          type="button"
+          label="{{ 'Elimina' | primengTranslation }}"
+          severity="success"
+          (onClick)="handleDelete($event)"
+          [disabled]="!selectedItems || selectedItems.length === 0">
+        <i class="fa-solid fa-trash"></i></p-button>
+      </div>
+    </div>
+  </div>
+  <p-table #dt [value]="data" [(selection)]="selectedItems" dataKey="id" [paginator]="true" [rows]="rows"
+    [resizableColumns]="true" [reorderableColumns]="true" [rowsPerPageOptions]="rowsPerPageOptions"
+    [sortMode]="'multiple'" [(multiSortMeta)]="multiSortMeta" [totalRecords]="totalRecords" [lazy]="true"
+    [columns]="columnasMostrar"
+    (onPage)="handlePage($event)" (onSort)="handleSort($event)" class="p-datatable-sm">
+    <ng-template pTemplate="header">
+      <tr>
+        <th style="width: 4rem" class="select-row-header" *ngIf="selectRows" pResizableColum><p-tableHeaderCheckbox /></th>
+        <th *ngFor="let col of columnasMostrar" pSortableColumn="{{col.field}}" pResizableColumn pReorderableColumn>
+          {{ col.header | primengTranslation }}
+          <p-sortIcon field="{{col}}"></p-sortIcon>
+        </th>
+        <th class="header-actions" style="width: 4rem" >
+          {{ 'Accions' | primengTranslation }}
+        </th>
+      </tr>
+    </ng-template>
+    <ng-template pTemplate="body" let-row>
+      <tr>
+        <td *ngIf="selectRows">
+          <p-tableCheckbox [value]="row" /> 
+        </td>
+        <td *ngFor="let col of columnasMostrar" [ngClass]="getAlignmentClass(col)">
+          <!-- Navegación normal -->
+          <a *ngIf="col.field == linkColumn && col.type !== 'file' && !embedded" 
+            [routerLink]="[row.id]" 
+            [innerHTML]="row | renderCell: col.field : col.type : col.pipe">
+          </a>
+          <!-- Modo embebido: abre popup -->
+          <a *ngIf="col.field == linkColumn && col.type !== 'file' && embedded" 
+            href=""
+            (click)="openEditPopup(row.id, $event)"
+            [innerHTML]="row | renderCell: col.field : col.type : col.pipe">
+          </a>
+          <span *ngIf="col.field !== linkColumn && col.type !== 'file'" [innerHTML]="row | renderCell: col.field : col.type : col.pipe"></span>
+          <span *ngIf="col.field !== linkColumn && col.type == 'file'" [innerHTML]="row | renderCell: col.field : col.type : col.pipe" (click)="onTableClick($event)"></span>
+        </td>
+        <td class="actions">
+          <p-button class="btn-primary-diba" type="button" icon="fa-solid fa-trash"
+            (onClick)="handleDeleteRow(row.id)" [disabled]="!row.id"></p-button>
+        </td>
+      </tr>
+    </ng-template>
+    <!-- Paginador izquierda -->
+    <ng-template pTemplate="paginatorleft" let-state>
+      <span class="">
+        {{ 'Mostrant de' | primengTranslation }} {{ state.first + 1 }} {{ 'a' | primengTranslation }} {{ state.first +
+        state.rows < state.totalRecords ? state.first + state.rows : state.totalRecords }} {{ 'de' | primengTranslation }}
+          {{ state.totalRecords }} {{ 'registres' | primengTranslation }} </span>
+    </ng-template>
+  </p-table>
+</div>
+<div class="diba-loading flex items-center justify-center h-64" [class.hidden]="!loading">
+  <button class="btn btn-primary rounded-pill mx-auto w-fit" type="button" disabled="">
+    <span class="spinner-border spinner-border-sm" aria-hidden="true"></span>
+    <span class="ms-1" role="status">Carregant...</span>
+  </button>
+</div>

package/src/fam-archetype-app/files/src/styles.scss

@@ -0,0 +1,109 @@
+/* You can add global styles to this file, and also import other style files */
+@use './tailwind.css';
+@use './shared/styles/global/layout.scss';
+@use 'primeicons/primeicons.css';
+
+@font-face {
+  font-family: 'DiBa';
+  src: url('/assets/fonts/DiBaScreen-Regular.woff2') format('woff2');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap; /* Mejora el rendimiento */
+}
+
+.diba-form {
+  border: 1px solid #d1d1d1;
+  border-radius: 1rem;
+  padding: .75rem;
+  background-color: #f9f8f8;
+
+  @apply grid grid-cols-1 gap-4 w-full;
+
+  .diba-form-field {
+    @apply flex items-start space-x-2;
+
+    label {
+      @apply w-[12.5%] text-left mt-2;
+    }
+
+    input, p-select, textarea, p-inputnumber, p-datepicker, p-checkbox {
+      @apply w-full;
+      max-width: 36%;
+    }
+  }
+
+  .diba-form-field-textarea {
+    align-items: flex-start !important;
+  }
+}
+
+.diba-form-two-column {
+  @apply grid grid-cols-1 md:grid-cols-2 gap-4 w-full !important;
+
+  .diba-form-field {
+    input, p-select, textarea, p-inputnumber, p-datepicker, p-checkbox {
+      max-width: none !important;
+    }
+  }
+}
+
+.diba-form-stacking.diba-form-two-column {
+  .diba-form-field {
+    @apply w-full !important;
+
+    input, p-select, textarea, p-inputnumber, p-datepicker, p-checkbox {
+      max-width: 100% !important;
+    }
+  }
+}
+
+/* NUEVA clase para este comportamiento */
+.diba-form-two-column-flow {
+  /* anula el grid si venía de otra clase */
+  display: block !important;
+  column-count: 2;
+  column-gap: 1.5rem;      /* separación entre columnas */
+  border: 1px solid #d1d1d1;
+  border-radius: 1rem;
+  padding: .75rem;
+  background-color: #f9f8f8;
+}
+
+.diba-form-two-column-flow .diba-form-field {
+  width: 100%;
+  padding: .5rem 0;  /* separación vertical entre campos */
+}
+
+.diba-form-two-column-flow .diba-form-field label {
+  min-width: 25%;
+}
+
+.diba-form-two-column-flow .diba-form-field .p-inputtext, 
+.diba-form-two-column-flow .diba-form-field .p-textarea,
+.diba-form-two-column-flow .diba-form-field .p-select {
+  max-width: 73%;
+  width: 100%;
+}
+
+
+.diba-form-stacking {
+  @apply grid grid-cols-1 gap-4 w-full;
+
+  .diba-form-field {
+    @apply w-1/2;
+
+    label {
+      @apply w-full text-left mb-2;
+    }
+
+    input, p-select {
+      @apply w-full;
+    }
+  }
+
+  .diba-form-field-textarea {
+    textarea {
+      width: 100% !important;
+    }
+  }
+}

package/src/fam-archetype-app/files/src/tailwind.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/src/fam-archetype-app/files/tailwind.config.js

@@ -0,0 +1,36 @@
+/** @type {import('tailwindcss').Config} */
+const primeui = require('tailwindcss-primeui');
+module.exports = {
+    darkMode: ['selector', '[class="app-dark"]'],
+    content: ['./src/**/*.{html,ts,scss,css}', './index.html'],
+    plugins: [primeui],
+    theme: {
+        screens: {
+            sm: '576px',
+            md: '768px',
+            lg: '992px',
+            xl: '1200px',
+            '2xl': '1920px'
+        },
+        extend: {
+            fontFamily: {
+                DiBa: ['DiBa', 'Lato', 'sans-serif'],
+            },
+            colors: {
+                gray: {
+                    0: '#f1f3f5',
+                    50: '#e0e3e7',
+                    100: '#f7f7f7',
+                    200: '#c8cdd2',
+                    300: '#b0b7bd',
+                    400: '#98a1a8',
+                    500: '#828b92',
+                    600: '#6c757d',
+                    700: '#5a6269',
+                    800: '#484f55',
+                    900: '#5c636a',
+                }
+            }
+        },
+    }
+};

package/src/fam-archetype-app/files/tools/cli/TelosysTools/commands/commands.txt

@@ -0,0 +1 @@
+gen * * -y

package/src/fam-archetype-app/files/tools/cli/TelosysTools/commands/db_to_entities.txt

@@ -0,0 +1 @@
+nm PMT oracle

package/src/fam-archetype-app/files/tools/cli/TelosysTools/commands/test_db_connection.txt

@@ -0,0 +1 @@
+cdb oracle

package/src/fam-archetype-app/files/tools/cli/TelosysTools/databases.yaml

@@ -0,0 +1,188 @@
+# Telosys databases configuration
+# 
+#    . id : must be unique (database identifier)
+#
+# "metadata" configuration  :
+#    . catalog          : the catalog where to search the metadata ( "!" means "null" ) 
+#    . schema           : the schema  where to search the metadata ( "!" means "null" )
+#    . tableNamePattern : the pattern used as table name filter ( ex : "%", "A%", ... ) 
+#    . tableTypes       : the types to retrieve, separated by blanks ( ex : "TABLE", "TABLE VIEW", ... ) 
+#    . tableNameExclude : the pattern used to exclude tables
+#    . tableNameInclude : the pattern used to include tables
+# 
+# NB: this a YAML file, don't forget to use QUOTES when a special character is used
+
+databases :
+
+# ============================================ 
+# H2 database identified by "h2" - H2 embedded ( ':jdbc:h2:mem:' = 'in memory' )
+  - id: h2
+    name: my H2 database
+    type: H2 
+    # JDBC connection
+    # H2 embedded file storage : jdbc:h2:[file:][<path>]<databaseName>
+    # H2 embedded in-memory    : jdbc:h2:mem:<databaseName>
+    # H2 remote file storage   : jdbc:h2:tcp://<server>[:<port>]/[<path>]<databaseName>
+    # H2 remote in-memory      : jdbc:h2:tcp://<server>[:<port>]/mem:<databaseName>
+    # H2 remote SSL : replace "tcp" by "ssl"
+    # url: jdbc:h2:mem:mydatabase;DB_CLOSE_DELAY=0
+    url: jdbc:h2:mem:mydatabase;DB_CLOSE_DELAY=0
+    driver: org.h2.Driver
+    user: sa
+    password: 
+    # Metadata parameters
+    catalog: '!'
+    schema: '!'
+    tableNamePattern:
+    tableNameInclude:
+    tableNameExclude:
+    tableTypes:
+
+    #--- Telosys model creation 
+    # what kind of links to define in the model
+    linksManyToOne: true
+    linksOneToMany: false
+    linksManyToMany: false
+    # what kind of database information to define in the model (true for all by default)
+    # dbComment: false # table & column -> entity & attribute
+    # dbCatalog: false   # table -> entity
+    # dbSchema: false    # table -> entity
+    # dbTable: false     # table -> entity
+    # dbView: false      # table -> entity
+    # dbName: false          # column -> attribute
+    # dbType: false          # column -> attribute
+    # dbDefaultValue: false  # column -> attribute
+    
+# ============================================ 
+# PostgreSQL database identified by "pg"
+  - id: pg
+    name: PostgreSQL database 
+    type: POSTGRESQL 
+    # JDBC driver 
+    driver: org.postgresql.Driver 
+    # JDBC url: jdbc:postgresql://{HOST}:{PORT}/{DATABASE}
+    url: jdbc:postgresql://myhost:5432/mydatabase
+    user: bob
+    password: secret
+    # Metadata parameters
+    catalog: '!'
+    # schema: '!' ok to get tables but not to get columns, etc
+    schema: public
+    tableNamePattern:
+    tableNameInclude:
+    tableNameExclude:
+    tableTypes: TABLE
+    #--- Telosys model creation 
+    # what kind of links to define in the model
+    linksManyToOne: true
+    linksOneToMany: false
+    linksManyToMany: false
+    # what kind of database information to define in the model (true for all by default)
+    dbComment: false
+    dbCatalog : true
+    dbSchema : true
+    dbTable : true
+    dbView : false
+    dbName : true    
+    dbType : true    
+    dbDefaultValue: false
+
+# ============================================ 
+# Oracle database identified by "oracle"
+  - id: oracle
+    name: Oracle database
+    type: oracle 
+    # JDBC driver 
+    driver: oracle.jdbc.OracleDriver
+    # JDBC connection
+    #   url for SID:     jdbc:oracle:thin:@[HOST][:PORT]:SID     (older format)
+    #   url for SERVICE: jdbc:oracle:thin:@[HOST][:PORT]/SERVICE (newer format)
+    url: jdbc:oracle:thin:@localhost:1521/MYDBSERVICE
+    user: SCOTT
+    password: TIGER
+    # Metadata parameters
+    catalog: '!'
+    schema: MYSCHEMA
+    tableNamePattern: '%'
+    tableNameInclude:
+    tableNameExclude:
+    tableTypes: TABLE
+    #--- Telosys model creation 
+    # what kind of links to define in the model
+    linksManyToOne: true
+    linksOneToMany: false
+    linksManyToMany: false
+    # what kind of database information to define in the model (true for all by default)
+    dbComment: false
+    dbCatalog : true
+    dbSchema : true
+    dbTable : true
+    dbView : false
+    dbName : true    
+    dbType : true    
+    dbDefaultValue: false
+# ============================================ 
+# Derby database identified by "derby"
+  - id: derby
+    name: my Derby database
+    type: Derby 
+    # JDBC connection
+    driver: org.apache.derby.jdbc.ClientDriver 
+    url: jdbc:derby://localhost:1527/mydatabase;create=true
+    user: root
+    password: admin
+    schema: ROOT
+    # Metadata parameters
+    catalog:
+    schema:
+    tableNamePattern:
+    tableNameInclude:
+    tableNameExclude:
+    tableTypes:
+    #--- Telosys model creation 
+    # what kind of links to define in the model
+    linksManyToOne: true
+    linksOneToMany: false
+    linksManyToMany: false
+
+# ============================================
+# MYSQL (the JDBC Driver is in "mysql-connector-java-x.x.x-bin.jar")
+#   driver: com.mysql.jdbc.Driver 
+#   url: jdbc:mysql://localhost:3306/mydb 
+#   user: root
+#   password:
+
+# ============================================ 
+
+# ============================================ 
+# HSQL-DB 
+#   driver: org.hsqldb.jdbcDriver 
+#   url: jdbc:hsqldb:hsql://localhost:9001/mydb
+#   schema: PUBLIC
+
+# ============================================ 
+# SQLSERVER  (the JDBC Driver is in "sqljdbc.jar" )
+#   driver = "com.microsoft.sqlserver.jdbc.SQLServerDriver" 
+#   url    = "jdbc:sqlserver://10.226.xxx.xxx" 
+#   user: demo
+#   password: demo
+#   catalog: demo
+#   schema: dbo
+
+# ============================================ 
+# ORACLE 
+# JDBC Driver jar files :
+# See https://www.oracle.com/fr/database/technologies/appdev/jdbc-downloads.html
+#   for Oracle versions 21c, 19c, 18c, and 12.2 : 
+#     . ojdbc11.jar ( JDBC 4.3 / JDK11 and JDK17 )
+#     . ojdbc10.jar ( JDBC 4.3 / JDK11 )
+#     . ojdbc8.jar  ( JDBC 4.2 / JDK8  and JDK11 ) 
+#   other old jars examples: ojdbc14.jar, ojdbc6.jar (JDK 1.6), ojdbc5.jar (JDK 1.5) 
+# schema: "HR" to use the demo database provided with Oracle XE
+#---------------- 
+#   driver: oracle.jdbc.driver.OracleDriver 
+#   url for SID:     jdbc:oracle:thin:@[HOST][:PORT]:SID     (older format)
+#   url for SERVICE: jdbc:oracle:thin:@[HOST][:PORT]/SERVICE (newer format)
+#   url example for XE: jdbc:oracle:thin:@localhost:1521/XE
+#   catalog: '!'
+#   schema: HR

package/src/fam-archetype-app/files/tools/cli/TelosysTools/models/app/FamActivitat.entity

@@ -0,0 +1,26 @@
+// ----------------------------------------------------------------------------
+// Outbound infrastructure: Database
+@DbSchema("FAM_API")
+@DbTable("FAM_ACTIVITAT")
+#DbColumnPrefix("FAM_ACT")
+// ----------------------------------------------------------------------------
+// Inbound infrastructure: API Rest
+#ApiResource("activitats")
+// ----------------------------------------------------------------------------
+// Domain Model
+@AggregateRoot
+#AggregateDeletion("logical")
+// ----------------------------------------------------------------------------
+// Tabs in Detail Page
+#DetailTabs("FamActivitatsUbicacio")
+// Model definition
+FamActivitat {
+  famActId : long {
+    @Id @NotNull @MaxLen(10) @DbName("ID") #postable(false) #updatable(false)
+  };
+  famActDescripcio : string {
+    @MaxLen(64) @DbName("DESCRIPCIO")
+    #mandatoryInList(true)
+  };
+  famActivitatsUbicacions : FamActivitatsUbicacio[] { @MappedBy(famActivitat) };
+}