El calendario dibuja citas, tareas y sus otras filas a su manera: su hora, tema, lugar y repetición en el calendario, una descripción emergente de cuándo y dónde, y un diálogo con los detalles de la cita. Cada uno puede dibujarse a tu manera, una tabla a la vez, y las filas de una tabla pueden escribirse y cambiarse en formas propias. Todo esto se aplica en cualquier diseño.
Un MultiTableTemplate (React: una entrada de templates) dibuja las filas de una tabla en el calendario en lugar de todas las filas del calendario — su icono de hora, asunto, lugar y repetición — como hace en una Línea de Tiempo. Se le asigna la fila, con cada columna leída en su Record; mantenla en una línea, ya que las celdas de un mes son cortas. Como una descripción emergente, muestra lo que el usuario debe leer, no los controles a usar: el calendario sigue abriendo la fila cuando se hace clic.
<Calendar
regarding={account}
templates={{
task: (item) => (
<>
<TaskListLtr16Regular /> {item.title}
</>
),
}}
/><Calendar Regarding="@account">
<MultiTableTemplate Table="task" Context="item">
<FluentIcon Value="@(new Icons.Regular.Size16.TaskListLtr())" /> @item.Title
</MultiTableTemplate>
</Calendar>El calendario lee las columnas que muestra a sí mismo. Para que una plantilla o una descripción emergente muestre otra, nómbrala en el FetchXML de una vista, como hace la demo siguiente para la dirección y el número de una llamada telefónica: el calendario lee las columnas de una vista junto a las suyas.
Apoyar el puntero en una cita muestra su asunto, cuándo y dónde está. Pasa TooltipTemplate (Reaccionar: appointmentTooltip) para mostrar una descripción emergente propia. Se le asigna la cita, que Record contiene todas las columnas leídas de su fila, con su valor formateado, para que pueda mostrar columnas propias que el calendario no dibuja. Una descripción emergente no es interactiva: muestra lo que el usuario debe leer, no los controles que usar.
<Calendar
viewIds={[accountAppointmentsViewId]}
appointmentTooltip={(appointment) => (
<>
<strong>{appointment.subject}</strong>
<div>{appointment.record?.formattedValues?.['ppp_customercode']}</div>
</>
)}
/><Calendar ViewIds="@([accountAppointmentsViewId])">
<TooltipTemplate>
<strong>@context.Subject</strong>
<div>@context.Record?.FormattedValues.GetValueOrDefault("ppp_customercode")</div>
</TooltipTemplate>
</Calendar>Las citas y llamadas de Schmeler and Sons, un mes a la vez. Una llamada telefónica se dibuja con un icono que indica por dónde fue, y su descripción emergente indica el número al que iba o desde donde fue; la descripción emergente de una cita indica dónde está.
Al hacer clic en una cita se abre un diálogo con sus detalles, leído desde Dataverse como una página de registro lee un registro — a través de la misma tabla de acceso y seguridad de columna — y se muestra en modo solo lectura: cuándo está, dónde, a qué se refiere, su estado y su descripción. Pasar AppointmentDetails (Reaccionar: appointmentDetails) para mostrar campos propios en él, vinculados al registro de la cita como en una página de registro, o manejar OnAppointmentClick (Reaccionar: onAppointmentClick) para hacer otra cosa con un clic, como abrir una página propia.
<Calendar
appointmentDetails={
<>
<ColumnEdit columnName="scheduledstart" readOnly />
<ColumnEdit columnName="location" readOnly />
</>
}
/><Calendar>
<AppointmentDetails>
<ColumnEdit ColumnName="scheduledstart" ReadOnly="true" />
<ColumnEdit ColumnName="location" ReadOnly="true" />
</AppointmentDetails>
</Calendar>Las citas de Schmeler and Sons, cada una abriéndose en su inicio, su final, dónde está y sus asistentes requeridos.
En un Editable calendario, se abre una fila de una tabla distinta a las citas en forma de las columnas que muestra su registro. A MultiTableForm dentro del calendario (React: una entrada de forms) da una tabla de formas propias, una para crear sus filas y otra para cambiarlas: componentes de los editores, mostrados dentro de una forma del registro. FormLocation (React: formLocation) indica dónde se abren: un diálogo en el centro, como por defecto, o un panel lateral a la izquierda o derecha.
<Calendar
regarding={account}
editable
formLocation="right"
forms={{ task: { create: TaskForm, edit: TaskForm } }}
/><Calendar Regarding="@account" Editable="true" FormLocation="DialogLocation.Right">
<MultiTableForm Table="task" CreateForm="typeof(TaskForm)" EditForm="typeof(TaskForm)" />
</Calendar>Para un ejemplo más completo — tareas dibujadas con si están hechas y cuán urgentes son, y una descripción emergente para cada tabla — consulta la demo de Calendar Custom Rendering.