wl gantt
1.0.0
Gantt Chart también se conoce como diagrama horizontal, gráfico de barras y horario del plan de producción. Muestra las relaciones inherentes de proyectos, progreso y otros sistemas relacionados con el tiempo a través de diagramas de rayas. Nombrado por el nombre del Sr. Henry Laurence Gantt.
En la actualidad, el Gantt Plug -Iin más famoso del mercado ha ocupado mucho tiempo para los ríos y lagos, y son viejos y poderosos. Pero sin excepción: se les cobra o es extremadamente difícil de usar y dependen de la tecnología muy antigua.
[JQueryGantt] [Plusgantt] [dhtmlx] Es innegable que sean muy poderosos, ya sea rendimiento o funcional. Pero la mayoría de las necesidades comerciales no requieren que tal gigante satisfaga la demanda. Por otro lado, la escasa documentación de la escasez técnica antigua hace que los desarrolladores no puedan comenzar (la versión de carga ni siquiera proporciona documentos, y su jefe definitivamente no proporcionará dinero para autorizar).
El trasfondo de wl-gantt es el enorme daño al uso del autor del complemento B *** Gantt en el proyecto VUE de la compañía: basado en extjs (durante 17 años que no he oído), no proporcione documentos de desarrollo, no hay chinos sin La información china y el código fuente están encriptados. wl-gantt es un complemento Gantt Gantt Based en Vue y Elementui.
Las funciones proporcionadas por TI son: datos de fuente de inspección automática se ajustan a las reglas de disposición de la tarea del proyecto, las reglas de la tarea delantera que comienzan después del final, el año de la tarea final del final de la tarea, el administrador de tareas frontal construido es encendió el hoyo diurno en la fecha del día.
Sus ventajas: muy simples y fáciles de usar, y altamente configurados, suavizan automáticamente los datos no calificados y dan un aviso, no habrá anormalidades sin ninguna razón.
Gradalmente está creciendo en la siguiente etapa, aprenderá:
1.
2. Built -en el selector de tareas frontal [completado]
3. Integre la función de selección completa de la tabla de árboles [completado]
4. Agregue y elimine la recuperación de la tarea [completado]
4. Conexión de tareas
5. Tarea Solicitud de suspensión personalizada
6. Y todas las necesidades que crees que necesitas usar
La apariencia de WL-Gantt es simple y refrescante, muy simple y fácil de usar, la altura se puede configurar
jQuery Gantt es voluminoso, viejo, feo, pero el documento es bastante claro
JS Gantt no quiere decir más
Dhtmlxgantt tiene una función poderosa e integral;
La función frappe-gantt es muy pequeña
Bryntum es el único más hermoso, pero la configuración es pobre y no se puede combinar con el componente; Solo imprima la consola
2020-04-03 Carga perezosa 2020-02-20 Actualización Gantt, consulte las instrucciones de versión 1.0.1 2019-12-14 Actualización Gantt, aumente la tarea frontal incorporada, admite el frente de la selección múltiple y la selección de una sola selección , automáticamente, la legitimidad de los datos de la fuente de verificación es pre -tarea. Actualización de 2019-12-3 Gantt. La Tabla
nameFormatteradmite la mayoría de losAttributesyEventsde EL-Tablas.
Actualización 2019-12-2版本记录1La fecha contiene el tipo deyearAndMonth、monthAndDay、yearAndWeek.
:fit="fit"
:size="size"
:border="border"
:data="selfData"
:stripe="stripe"
:height="height"
:row-key="rowKey"
:row-style="rowStyle"
:class="dateTypeClass"
:cell-style="cellStyle"
:max-height="maxHeight"
:tree-props="selfProps"
:current-row-key="rowKey"
:row-class-name="rowClassName"
:cell-class-name="cellClassName"
:expand-row-keys="expandRowKeys"
:header-row-style="headerRowStyle"
:header-cell-style="headerCellStyle"
:default-expand-all="defaultExpandAll"
:header-row-class-name="headerRowClassName"
:highlight-current-row="highlightCurrentRow"
:header-cell-class-name="headerCellClassName"
@header-contextmenu="handleHeaderContextMenu"
@selection-change="handleSelectionChange"
@row-contextmenu="handleRowContextMenu"
@current-change="handleCurrentChange"
@cell-mouse-enter="handleMouseEnter"
@cell-mouse-leave="handleMouseLeave"
@expand-change="handleExpandChange"
@filter-change="handleFilterChange"
@cell-dblclick="handleCellDbClick"
@header-click="handleHeaderClick"
@row-dblclick="handleRowDbClick"
@sort-change="handleSortChange"
@cell-click="handleCellClick"
@select-all="handleSelectAll"
@row-click="handleRowClick"
@select="handleSelect"
npm i wl-gantt --save
o
npm i wl-gantt -S
import wlGantt from 'wl-gantt'
import "wl-gantt/lib/wl-gantt.css"
Vue.use(wlGantt)
| Número de serie | parámetro | ilustrar | tipo | Valor opcional | valor predeterminado | Aviso |
|---|---|---|---|---|---|---|
| 1 | Datos | datos | Formación | - | [] | - |
| 2 | tipo de datos | Tipo de encabezado de la fecha del área del mapa de Gantt | Cadena | Messandday, Yeandmonth, año y día | Anhelendmonth | - |
| 3 | treeps | Elemento de configuración de la superficie del árbol | Objeto | - | - | Ver accesorios a continuación |
| 4 | iniciar | Hora de inicio del proyecto | Cadena, objeto | Debe tener | - | Nota: No requiera la línea de tiempo de la tarea dentro de la hora de inicio del proyecto, y cuando el tiempo de tarea exceda el tiempo del proyecto, el tiempo del proyecto se actualizará |
| 5 | endscar | Tiempo de finalización del proyecto | Cadena, objeto | Debe tener | - | Nota: No requiera la línea de tiempo de la tarea dentro de la hora de inicio del proyecto, y cuando el tiempo de tarea exceda el tiempo del proyecto, el tiempo del proyecto se actualizará |
| 6 | Revisión | Si verificar los datos de origen para cumplir con las reglas | Booleano | - | - | Verifique los datos de origen para modificar automáticamente el tiempo que no cumple con la especificación, ya que el valor esperado que cumple con las reglas |
| 7 | Treatidasidentityid | Si usar la identificación como una identificación de auto aumento auto | Booleano | - | FALSO | Si es así, asegúrese de que la identificación sea un tipo digital corto en lugar de una cadena larga o GUID |
| 8 | AutoganttdateType | Ajuste automáticamente el tipo de tramo de tiempo Gantt, consulte版本记录1 | Booleano | - | verdadero | - |
| 9 | nameFormatter | Función de contenido de formato de columna de nombre | Función | - | - | Función (Row, Colorn, CellValue, Index) |
| 10 | Otros atributos de tabla | Dirección de documento | - | - | - | - |
| 11 | Usar Precolumn | Si usar tareas frontales construidas | Booleano | - | FALSO | - |
| 12 | premedición | ¿Se puede seleccionar más la tarea frontal | Booleano | - | verdadero | Si enciende las opciones múltiples, el campo previo debe ser una matriz, de lo contrario puede ser el número String |
| 13 | Preformar | Función de formulación de la columna de contenido frontal | Función | - | - | Si no lo pasa, puede coser de acuerdo con prop name字段+， |
| 14 | Capacle -CellText | Ocupa la celda del valor del aire | Cadena | - | '-' | - |
| 15 | usecheckcolumn | Si usar la casilla de verificación Built -In | Booleano | - | FALSO | - |
| 16 | UserIndexColumn | Si usar el número de serie construido en | Booleano | - | FALSO | - |
| 17 | editar | Si editar | Booleano | - | verdadero | - |
| 18 | Matriz | Al usar la casilla de verificación, si el padre y el hijo están asociados | Booleano | - | verdadero | Debe configurar la identificación, el campo de los accesorios para niños |
| 19 | gantal | Si solo se muestra el gráfico | Booleano | - | FALSO | - |
| 20 | perezoso | Igual que El-Table | Booleano | - | FALSO | - |
| veintiuno | carga | Igual que El-Table | Función | - | - | - |
| Veintidós | ContextMenuOptions | Right Haga clic en el elemento de configuración de la ventana flotante, si existe, haga clic en Gantt Right -Haga clic para mostrar la información de la ventana flotante de configuración | Formación | - | - | Los atributos del objeto en la matriz son:* @param {String} Nombre de pantalla de etiqueta* @param {String} Prop Field* @param {String} Icon Clase de icono de fuente opcional |
| veintitrés | Userealtime | Si utiliza la hora de inicio real y la hora de finalización real, abra la tira roja marrón en tiempo real en la hora planificada de la tira azul | Booleano | - | FALSO | - |
| veinticuatro | barro | Si usar la ventana de flota de la tabla | Booleano | - | FALSO | - |
| Número de serie | parámetro | ilustrar | valor predeterminado |
|---|---|---|---|
| 1 | niños | Campo de niños subconjunto de datos, que indica como una tabla de árboles | niños |
| 2 | nombre | Campos utilizados para mostrar nombres | nombre |
| 3 | IDENTIFICACIÓN | La identificación de cada pieza de datos debe ser única | IDENTIFICACIÓN |
| 4 | Pid | Campo de ID de nodo principal de cada datos | Pid |
| 5 | iniciar | El campo de tiempo de inicio de cada datos | iniciar |
| 6 | endscar | Campo de tiempo final de cada datos | endscar |
| 7 | Identityid | ID de mayor aumento de datos de datos | Identityid |
| 8 | padres | Árbol de identificación de padres autocribante, separación de coma | padres |
| 9 | PRE | El campo de la tarea frontal, el valor del campo debe ser la identificación de la tarea frontal | PRE |
| 10 | Perseguidores | ¿Qué líneas especifican son subnodos? | Perseguidores |
| 11 | RealStartDate | Campo de tiempo de inicio real | Reiniciar |
| 12 | Reiniciar | Campo de tiempo final real | Reiniciar |
| Número de serie | Nombre de incidente | ilustrar | Parámetro de devolución de llamada |
|---|---|---|---|
| 1 | Timechengange | Activado cuando se cambia el tiempo de tarea | La función (fila) es actualmente datos de línea en orden |
| 2 | Otros eventos de mesa | Dirección de documento | - |
| 3 | prelajarse | Evento de modificación previa a la tarea | La función (fila) es actualmente datos de línea en orden |
| 4 | anular | Evento de modificación de nombre | La función (fila) es actualmente datos de línea en orden |
| 5 | tarea | Agregar evento de tareas | La función (fila) es actualmente datos de línea en orden |
| 6 | Taskremove | Evento de tareas de eliminación | La función (fila) es actualmente datos de línea en orden |
| Número de serie | Nombre del método | ilustrar | Parámetro de devolución de llamada |
|---|---|---|---|
| 1 | carga | Llamar manualmente la mesa de la mesa del árbol | Función (fila) en orden es la información de línea que se expandirá |
| 2 | loadtreeadd | Actualizar el subnodo después del reloj Tree Watch | Función (ID, Lista) Para actualizar la ID de nodo, la lista de nodos infantiles que se agregará. |
| 3 | loadtreremove | Eliminar el subnodo de los datos de carga perezoso | Función (id, lista) para actualizar la ID del nodo y la tecla Row del sub -byte para eliminar |
| Número de serie | nombre | ilustrar |
|---|---|---|
| 1 | PRV | Para las columnas antes de insertar el nombre en la lista, si no entra en vigencia, debe agregar fixed |
| 2 | - | Entre la columna predeterminada y Gantu |
1.0.6 Cuando se cambia el final de la tarea de reparación, el gráfico Gantt no se planifica dinámicamente cuando se cambia el rango de tiempo del proyecto;
1.0.5 Agregue la lista a la ventana de ciervo
1.0.3 Versión, repare el período de tiempo para más de un año;
1.0.2 Versión, agregue parámetros perezosos y de carga, soporte la carga perezosa y proporcione un método cuando la carga perezosa: Métodos: 1,2,3;
1.0.1 Edición agrega la casilla de verificación Built -In. ;
La versión 1.0.0 agrega la lista de tareas delantera construida, admite el frente de la selección múltiple y la selección única, y verifica automáticamente la legalidad de la tarea previa del frente de datos.
Actualizar la versión Gantt Versión 0.1.6. La Tabla 1 admite la mayoría de los
AttributesyEventsde EL-TablasnameFormatterTenga en cuenta que los parámetrosrowKeydeben pasar durante la tabla de árboles, y el valor predeterminado esid.
La versión 0.1.5 actualiza la fecha de Gantt para admitir el tipo de
yearAndMonth、monthAndDay、yearAndWeek, y ajustar automáticamente las reglas son: ajuste automático de ajuste automático alyearAndMonth-12 meses, entre 3 y 12 mesesyearAndWeekAjuste automático del mes y dentro delmonthAndDay. Los parámetros agregadosautoGanttDateTypepueden administrar si se ajusta automáticamente. Arregle el problema de cambiar la situación en algún tiempo.
