Storyboard

>Modelo

ID:(1241, 0)

Concepto

>Top

Las componentes se pueden agrupar en tarjetas o cards que se definen según

```

...

...

```

Colores

Las tarjetas pueden tener colores:

```

...

...

```

Secuencia de tarjetas

Las tarjetas también pueden ser listadas secuencialmente con una estructura interna de una zona lateral:

```

Title

Subhead

Title

Subhead

```

Listado de tarjetas

Si se define el ancho también se pueden listar tarjetas independientes de modo que tengan todas el mismo ancho

```

```

Colapsables

Por ultimo se pueden colapsar como se incluye a continuación:

```

Card with Collapsible List

```

ID:(9909, 0)

Concepto

>Top

El formato para los arboles de datos q-tree se define en la sección q-pag mediante

```

:nodes='simple'

node-key='label'

/>

```

Los datos se asignan con el formato:

```

data: () => ({

simple: [

{

label: 'Satisfied customers',

children: [

{

label: 'Good food',

children: [

{ label: 'Quality ingredients' },

{ label: 'Good recipe' }

]

},

{

label: 'Good service (disabled node)',

disabled: true,

children: [

{ label: 'Prompt attention' },

{ label: 'Professional waiter' }

]

},

{

label: 'Pleasant surroundings',

children: [

{ label: 'Happy atmosphere' },

{ label: 'Good table presentation' },

{ label: 'Pleasing decor' }

]

}

]

}

]

})

```

Las propiedades vue del tree son:

Propiedades | Tipo | Descripción

------------|------|---------------

nodes | Array | Modelo vue para el arbol

node-key | String | Propiedad del nodo para usar como clave única.

label-key | String | (v0.17.11 +) Propiedad del nodo a usar como etiqueta.

color | String | Color de las líneas de conexión.

control-color | String | Color de las casillas de verificación.

text-color | String | Color del texto.

dark | Boolean | Al renderizar sobre un fondo oscuro.

icon | String | Ícono de conector para cada nodo.

selected | Any | Utilice .sync. El valor clave único del nodo seleccionado.

tick-strategy | String | Una de 'hoja', 'hoja filtrada', 'estricta', 'ninguna'.

ticked | Array | Utilice .sync. Nodo de claves únicas de los nodos marcados.

expanded | Array | Utilice .sync. Nodo de claves únicas de nodos expandidos.

default-expand-all | Boolean | Expande todos los nodos en el primer render.

accordion | Boolean | La expansión de un nodo cierra a sus hermanos.

filter | String | Texto para ser utilizada al filtrar nodos.

filter-method | Function | Método de filtrado personalizado.

no-nodes-label | String | Texto Reemplace el i18n predeterminado del mensaje cuando no haya nodos disponibles.

no-results-label | String | Texto Reemplace la i18n predeterminada del mensaje cuando no haya nodos disponibles después del filtrado.

duration | Number | (v0.17.13+) Alternar la duración de la animación en milisegundos. Predeterminado: 300

ID:(9902, 0)