model-view-controller - 在剑道调度程序 MVC 上设置颜色
问题描述
我在这里有一个网格,它显示了 Db 中状态为“打开”的所有项目。现在我想在调度程序上为每个项目显示不同的颜色。目前,它以相同的颜色显示项目,这可能会使用户感到困惑。请参阅屏幕下方的图像和代码。
@(Html.Kendo().Scheduler<Website.Models.ResourcePlanner.ResourcePlannerGridModel>()
.Name("scheduler")
.Date(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day))
.StartTime(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, DateTime.Now.Hour, DateTime.Now.Minute, DateTime.Now.Second))
.Height(600)
.Views(views =>
{
views.WeekView(weekView => weekView.Selected(false));
views.MonthView(monthView => monthView.Selected(true));
views.AgendaView();
views.TimelineView();
views.TimelineMonthView();
})
.Resources(resource =>
{
resource.Add(m => m.Title)
.Title("Room")
.DataTextField("Text")
.DataValueField("Value")
.DataColorField("Color")
.BindTo(new[]
{
new { Text = "Venue 101", Value = 1, Color = "#6eb4fa" },
new { Text = "Venue 201", Value = 2, Color = "#f58a8a" }
});
})
.DataSource(d => d
.Model(m =>
{
})
.Read(read => read.Action("Read", "ResourcePlanner"))
.Destroy(delete => delete.Action("Delete", "ResourcePlanner"))
)
)
先感谢您。
解决方案
我遇到了同样的问题,并通过在我的事件模板中分配一个特殊的类并在DataBound
触发 -event 后做一些额外的魔法来解决它。
// The template
<script type="text/x-kendo-template" id="event-template">
<span class="customEvent eventAction#=Action#">
<span class="title">#=title#</span><br />
<span class="description">#=!description ? "" : description#</span>
</span>
</script>
// The CSS
.pageScheduler .k-scheduler-content .eventAction1Applied,
.pageScheduler .k-scheduler-content .eventAction2Applied,
.pageScheduler .k-scheduler-content .eventAction3Applied {
color: white;
}
.pageScheduler .k-scheduler-content .eventAction1Applied {
background-color: rgb(0, 159, 227);
border-color: rgb(0, 159, 227);
}
// The method to call on DataBound
function scheduledTasksDataBound() {
var events = $(".customEvent");
for (var i = 0; i < events.length; i++) {
var event = $(events[i]);
var bgClass = null;
if (event.hasClass("eventAction1")) {
bgClass = "eventAction1Applied";
}
else if (event.hasClass("eventAction2")) {
bgClass = "eventAction2Applied";
}
else if (event.hasClass("eventAction3")) {
bgClass = "eventAction3Applied";
}
event.parent().addClass(bgClass);
}
}
如果我没记错的话,里面的东西scheduledTasksDataBound
是必要的,因为样式没有以其他方式应用。
推荐阅读
- apache-kafka - 重试逻辑在等待春季重试时阻塞主要消费者
- python - MacOS:ModuleNotFoundError:没有名为“osmnx”的模块
- networking - 另一个慢速 rpc 进程导致 rpc 进程超时
- apollo - 合并策略控制 Apollo Client
- python - 通过子进程运行java应用程序时如何在k8s容器中打印python语句
- android - 从 roomdb 表中获取所有消息时出现 IllegalStateException
- c# - SQL 按日期时间过滤
- c# - 构建表达式树重构getter属性的return语句
- python - 使用 Python 将 JSON 转换为 CSV
- asp.net-core - 文件名中没有文化的 ASP.NET Core 资源文件,为什么不呢?