Question

我的SharePoint页面中有一个“优先级指示器”列，其中显示了绿色，黄色或红色的项目符号。我似乎在任何地方都找不到关于如何编写代码以与“到期日期”列链接的帮助。

目前，我的状态指示器仅在选择“优先级”时显示为高，正常或低。

对于“优先级指示器”，我的代码是;

Priority Indicator

有关我的JavaScript代码，请参见下文；

JavaScript Code

我希望显示优先级指标；红色指示灯显示一周内的到期日期黄色指示器显示是否在2周内到期绿色指示器会显示到期日期是否在3周以上。

Answer 1

查询列不会自动刷新，因此我建议您使用CSR满足此要求。

将脚本编辑器Webpart插入列表视图Webpart页面，并将下面的脚本插入脚本编辑器Webpart。

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script type="text/javascript">
        (function () {

            // Create object that have the context information about the field that we want to change it's output render
            var priorityFiledContext = {};
            priorityFiledContext.Templates = {};
            priorityFiledContext.Templates.Fields = {
                // Apply the new rendering for Priority field on List View
                "Priority_x0020_Indicators": { "View": priorityFiledTemplate }
            };

            SPClientTemplates.TemplateManager.RegisterTemplateOverrides(priorityFiledContext);

        })();

        // This function provides the rendering logic for list view
        function priorityFiledTemplate(ctx) {

            // get today's date
            var today = new Date();
            // zero out the time portion so we will only compare days
            today.setHours(0, 0, 0, 0);

            // get the date set in your date YourDateField
            var itemDate = new Date(ctx.CurrentItem["Due_x0020_Date"]);
            // zero out the time portion so we only compare days
            itemDate.setHours(0, 0, 0, 0);
            // Return html element with appropriate color based on priority value

            var oneDay = 24 * 60 * 60 * 1000; // hours*minutes*seconds*milliseconds

            var diffDays = Math.round(Math.abs((itemDate.getTime() - today.getTime()) / (oneDay)));
            if (diffDays < 7) {
                return "<span style='color:red'>&bull;</span>";
            } else if (diffDays < 14) {
                return "<span style='color:yellow'>&bull;</span>";
            } else {
                return "<span style='color:green'>&bull;</span>";
            }
        }
    </script>

通过开发人员工具检查字段静态名称（以列表的新/编辑形式）。

基于到期日的状态指示器

1 个答案: