Bläddra i källkod

[ADD] Pagination, popover & progress spanish translations.

Rubén Salvador García San Juan 7 år sedan
förälder
incheckning
e4bef2f494
3 ändrade filer med 76 tillägg och 80 borttagningar
  1. 29 30
      examples/docs/es/pagination.md
  2. 30 31
      examples/docs/es/popover.md
  3. 17 19
      examples/docs/es/progress.md

+ 29 - 30
examples/docs/es/pagination.md

@@ -48,13 +48,12 @@
   }
 </style>
 
-## Pagination
+## Paginación
+Si tiene que mostrar muchos datos en una página, utiliza la paginación.
 
-If you have too much data to display in one page, use pagination.
+### Uso básico
 
-### Basic usage
-
-:::demo Set `layout` with different pagination elements you wish to display separated with a comma. Pagination elements are: `prev` (a button navigating to the previous page), `next` (a button navigating to the next page), `pager` (page list), `jumper` (a jump-to input), `total` (total item count), `size` (a select to determine page size) and `->`(every element after this symbol will be pulled to the right).
+:::**Demo** Asigna en el atributo `layout` los diferentes elementos que quieres utilizar separados por coma. Los elementos de paginación son: `prev` (un botón para navegar a la página anterior), `next` (un botón para navegar a la siguiente página), `pager` (lista de página), `jumper` (un `input` para saltar a una página determinada), `total` (total de elementos), `size` (un `select` para seleccionar el tamanho de la página ) y `->`(todo elemento situado luego de este símbolo será halado a la derecha).
 ```html
 <div class="block">
   <span class="demonstration">When you have few pages</span>
@@ -73,11 +72,11 @@ If you have too much data to display in one page, use pagination.
 ```
 :::
 
-### Small Pagination
+### Paginación pequenha
 
-Use small pagination in the case of limited space.
+Usa una paginación pequenha en caso de espacio limitado.
 
-:::demo Just set the `small` attribute to `true` and the Pagination becomes smaller.
+:::**Demo** Solo pon el atributo `small` como `true` y la Paginación se volverá pequenha.
 ```html
 <el-pagination
   small
@@ -87,11 +86,11 @@ Use small pagination in the case of limited space.
 ```
 :::
 
-### More elements
+### Más elementos
 
-Add more modules based on your scenario.
+Agrega más modulos basados en tu escenario.
 
-:::demo This example is a complete use case. It uses `size-change` and `current-change` event to handle page size changes and current page changes. `page-sizes` accepts an array of integers, each of which represents a different page size in the `sizes` select options, e.g. `[100, 200, 300, 400]` indicates that the select will have four options: 100, 200, 300 or 400 items per page.
+:::**Demo** Este ejemplo es un completo caso de uso. Este utiliza los eventos `size-change` y `current-change` para manejar el tamanho de página y el cambio de página. El atributo `page-sizes` acepta un arrelgo de enteros, cada uno representa un diferente valor del atributo `sizes` que es un `select`, ejemplo `[100, 200, 300, 400]` indicará que el `select` tendrá las opciones: 100, 200, 300 o 400 elementos por página.
 
 ```html
 <template>
@@ -195,27 +194,27 @@ Add more modules based on your scenario.
   }
 </script>
 
-### Attributes
-| Attribute      | Description          | Type      | Accepted Values       | Default  |
+### Atributos
+| Atributo      | Descripción          | Tipo      | Valores aceptados       | Valores por defecto  |
 |--------------------|----------------------------------------------------------|-------------------|-------------|--------|
-| small              |   whether to use small pagination    | boolean |      —       | false |
-| page-size              | item count of each page  | number |      —       | 10 |
-| total | total item count | number | — | — |
-| page-count | total page count. Set either `total` or `page-count` and pages will be displayed; if you need `page-sizes`, `total` is required | number | — | — |
-| current-page | current page number, supports the .sync modifier | number | — | 1 |
-| layout | layout of Pagination, elements separated with a comma | string | `sizes`, `prev`, `pager`, `next`, `jumper`, `->`, `total`, `slot` | 'prev, pager, next, jumper, ->, total'  |
-| page-sizes | options of item count per page | number[] | — |  [10, 20, 30, 40, 50, 100] |
-| popper-class | custom class name for the page size Select's dropdown | string | — | — |
-| prev-text | text for the prev button | string | — | — |
-| next-text | text for the next button | string | — | — |
-
-### Events
-| Event Name | Description | Parameters |
+| small              |   usar paginación pequenha    | boolean |      —       | false |
+| page-size              | cantidad de elementos por página  | number |      —       | 10 |
+| total | total de elementos | number | — | — |
+| page-count | total de páginas. Asigna `total` o `page-count` y las páginas serán mostradas; si necesitas `page-sizes`, `total` es **requerido** | number | — | — |
+| current-page | número actual de la página, soporta el modificador .sync | number | — | 1 |
+| layout | layout de la paginación, elementos separados por coma | string | `sizes`, `prev`, `pager`, `next`, `jumper`, `->`, `total`, `slot` | 'prev, pager, next, jumper, ->, total'  |
+| page-sizes | opciones para la cantidad de elementos por página | number[] | — |  [10, 20, 30, 40, 50, 100] |
+| popper-class | clase propia para el `dropdown` del `select` del número de páginas | string | — | — |
+| prev-text | texto para el botón `prev` | string | — | — |
+| next-text | texto para el botón `next` | string | — | — |
+
+### Eventos
+| Nombre del evento | Descripción | Parámetros |
 |---------|--------|---------|
-| size-change | triggers when `page-size` changes | the new `page-size` |
-| current-change | triggers when `current-page` changes | the new `current-page` |
+| size-change | se dispara cuando `page-size` cambia | nuevo valor de `page-size` |
+| current-change | se dispara cuando `current-page` cambia | nuevo valor de `current-page` |
 
 ### Slot
-| Name | Description |
+| Nombre | Descripción |
 | --- | --- |
-| — | custom content. To use this, you need to declare `slot` in `layout` |
+| — | Elemento propio. Para utilizar esto necesitas declarar `slot` en el `layout` |

+ 30 - 31
examples/docs/es/popover.md

@@ -99,11 +99,11 @@
 
 ## Popover
 
-### Basic usage
+### Uso básico
 
-Similar to Tooltip, Popover is also built with `Vue-popper`. So for some duplicated attributes, please refer to the documentation of Tooltip.
+Similar a un Tooltip, Popover está construido con `Vue-popper`. Así que para atributos duplicados, por favor refiérase a la documentación de Tooltip.
 
-:::demo Add `ref` in your popover, then in your button, use `v-popover` directive to link the button and the popover. The attribute `trigger` is used to define how popover is triggered: `hover`, `click` or `focus`. Alternatively, you can specify reference using a named `slot`.
+:::**Demo** Agrega `ref` al popover, luego en el botón usa la directiva `v-popover` para asociar el botón y el popover. El atributo `trigger` es usado para definir como el popover se dispara: `hover`, `click` o `focus`. De manera alternatica puedes especificar la referencia utilizando un `[named slot](https://vuejs.org/v2/guide/components.html#Named-Slots).
 
 ```html
 <el-popover
@@ -137,11 +137,10 @@ Similar to Tooltip, Popover is also built with `Vue-popper`. So for some duplica
 ```
 :::
 
-### Nested information
+### Información anidada
+Otros componentes pueden anidarse dentro de popover. A continuación un ejemplo de una tabla anidada.
 
-Other components can be nested in popover. Following is an example of nested table.
-
-:::demo replace the `content` attribute with a default `slot`.
+:::**Demo** Reemplaza el atributo `content` con un `slot`.
 
 ```html
 <el-popover
@@ -186,11 +185,11 @@ Other components can be nested in popover. Following is an example of nested tab
 ```
 :::
 
-### Nested operation
+### Operación anidada
 
-Of course, you can nest other operations. It's more light-weight than using a dialog.
+Por supuesto, puedes anidar otras operaciones. Es más ligero que utilizar un `dialog`.
 
-:::demo
+:::**Demo**
 ```html
 <el-popover
   ref="popover5"
@@ -216,33 +215,33 @@ Of course, you can nest other operations. It's more light-weight than using a di
   }
 </script>
 ```
-:::
 
-### Attributes
-| Attribute      | Description          | Type      | Accepted Values       | Default  |
+
+### Atributos
+| Atributo      | Descripción          | Tipo      | Valores aceptados       | Valores por defecto  |
 |--------------------|----------------------------------------------------------|-------------------|-------------|--------|
-| trigger | how the popover is triggered | string  | click/focus/hover/manual |    click    |
-|  title              | popover title | string | — | — |
-|  content        |  popover content, can be replaced with a default `slot`    | string            | — | — |
-|  width        |  popover width  | string, number            | — | Min width 150px |
-|  placement        |  popover placement  | string | top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end |  bottom |
-|  disabled       |  whether Popover is disabled  | boolean    | — |  false |
-|  value(v-model)        |  whether popover is visible  | Boolean           | — |  false |
+| trigger | cómo se dispara el popover | string  | click/focus/hover/manual |    click    |
+|  title              | título del popover  | string | — | — |
+|  content        |  contenido del popover, puede ser sustituido por un `slot`  | string            | — | — |
+|  width        |  ancho del popover   | string, number            | — | Min width 150px |
+|  placement        |  posición del popover en la pantalla   | string | top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end |  bottom |
+|  disabled       |  si el popover está deshabilitado  | boolean    | — |  false |
+|  value(v-model)        |  si el popover está visible  | Boolean           | — |  false |
 |  offset        |  popover offset  | number           | — |  0 |
 |  transition     |  popover transition animation      | string             | — | el-fade-in-linear |
-|  visible-arrow   |  whether a tooltip arrow is displayed or not. For more info, please refer to [Vue-popper](https://github.com/element-component/vue-popper) | boolean | — | true |
-|  popper-options        | parameters for [popper.js](https://popper.js.org/documentation.html) | object            | please refer to [popper.js](https://popper.js.org/documentation.html) | `{ boundariesElement: 'body', gpuAcceleration: false }` |
-|  popper-class        |  custom class name for popover | string | — | — |
-|  open-delay        | delay of appearance when `trigger` is hover, in milliseconds | number | — | — |
+|  visible-arrow   |  si una flecha del tooltip is mostrada o no. Para más información, por favor refiérase a [Vue-popper](https://github.com/element-component/vue-popper) | boolean | — | true |
+|  popper-options        | parámetros para [popper.js](https://popper.js.org/documentation.html) | object            | por favor, refiérase a [popper.js](https://popper.js.org/documentation.html) | `{ boundariesElement: 'body', gpuAcceleration: false }` |
+|  popper-class        |  clase propia para popover | string | — | — |
+|  open-delay        | retraso de la aparición cuando `trigger` es hover, en milisegundos | number | — | — |
 
 ### Slot
-| Name | Description |
+| Nombre | Descripción |
 | --- | --- |
-| — | text content of popover |
-| reference | HTML element that triggers popover |
+| — | texto contenido en popover |
+| reference | elemento HTML que dispara el popover |
 
-### Events
-| Event Name | Description | 回调参数 |
+### Eventos
+| Nombre del evento | Descripción | Parámetros |
 |---------|--------|---------|
-| show | triggers when popover shows | — |
-| hide | triggers when popover hides | — |
+| show | se dispara cuando se muestra el popover | — |
+| hide | se dispara cuando se oculta el popover | — |

+ 17 - 19
examples/docs/es/progress.md

@@ -9,13 +9,12 @@
     }
   }
 </style>
-## Progress
+## Progreso
+Progreso es usado para mostrar el estado de la operación actual e informar al usuario acerca de ésta.
 
-Progress is used to show the progress of current operation, and inform the user the current status.
+### Barra de progreso lineal (porcentage externo)
 
-### Linear progress bar (external percentage)
-
-:::demo Use `percentage` attribute to set the percentage. It's **required** and must be between `0-100`.
+:::**Demo** Usa el atributo `percentage` para asignar el porcentage. Este es **requerido** y tiene que ser un valor entre `0-100`.
 ```html
 <el-progress :percentage="0"></el-progress>
 <el-progress :percentage="70"></el-progress>
@@ -24,11 +23,10 @@ Progress is used to show the progress of current operation, and inform the user
 ```
 :::
 
-### Linear progress bar (internal percentage)
-
-In this case the percentage takes no additional space.
+### Barra de progreso lineal (porcentage interno)
+En este caso el porcentage no toma espacio adicional.
 
-:::demo `stroke-width` attribute decides the `width` of progress bar, and use `text-inside` attribute to put description inside the progress bar.
+:::**Demo** El atributo `stroke-width` decide el ancho de la barra de progreso, y usa el atributo `text-inside` para poner la descripción dentro de la misma.
 ```html
 <el-progress :text-inside="true" :stroke-width="18" :percentage="0"></el-progress>
 <el-progress :text-inside="true" :stroke-width="18" :percentage="70"></el-progress>
@@ -37,9 +35,9 @@ In this case the percentage takes no additional space.
 ```
 :::
 
-### Circular progress bar
+### Barra de progreso circular
 
-:::demo You can specify `type` attribute to `circle` to use circular progress bar, and use `width` attribute to change the size of circle.
+:::**Demo** Puedes asignar el atributo `type` como `circle` para usar la barra circular de progreso, y usar el atributo `width` para cambiar el tamanho del círculo.
 ```html
 <el-progress type="circle" :percentage="0"></el-progress>
 <el-progress type="circle" :percentage="25"></el-progress>
@@ -49,13 +47,13 @@ In this case the percentage takes no additional space.
 :::
 
 ### Attributes
-| Attribute      | Description          | Type      | Accepted Values       | Default  |
+| Atributo      | Descripción          | Tipo      | Valores aceptado       | Valores por defecto  |
 | --- | ---- | ---- | ---- | ---- |
-| **percentage** | percentage, **required** | number | 0-100 | 0 |
-| type | the type of progress bar | string | line/circle | line |
-| stroke-width | the width of progress bar | number | — | 6 |
-| text-inside | whether to place the percentage inside progress bar, only works when `type` is 'line' | boolean | — | false |
-| status | the current status of progress bar | string | success/exception | — |
-| width | the canvas width of circle progress bar | number | — | 126 |
-| show-text | whether to show percentage | boolean | — | true |
+| **percentage** | porcenteage, **requerido** | number | 0-100 | 0 |
+| type | tipo de barra de progreso | string | line/circle | line |
+| stroke-width | ancho de la barra de progreso | number | — | 6 |
+| text-inside | mostrar el porcentage dentro de la barra de progreso, solo funciona cuando `type` es 'line' | boolean | — | false |
+| status | estado actual de la barra de progreso | string | success/exception | — |
+| width | ancho del canvas que contiene la barra de progreso circula | number | — | 126 |
+| show-text | mostrar porcentage | boolean | — | true |