根据列值动态更改图标
Dynamically change an icon based on a column value
我正在研究 Oracle Apex v21.1。我正在尝试为管理员创建一个小的“仪表板”table。
用例:当部门准备好提交他们的库存时,他们可以点击“验证库存”按钮,然后将显示他们的库存已准备好给table 管理员的仪表板。然后管理员可以检查仪表板,看看谁完成了,谁没有完成。仪表板将以两种不同的颜色(绿色 = 就绪 / 红色 = 未就绪)显示部门名称、验证日期、库存状态(就绪/未就绪)。如果库存未准备好,#LINK 列中会出现一个电子邮件图标,使管理员可以向部门发送电子邮件。如果准备就绪,将显示一个简单的“检查”。
这是 what I already have 以及我能做的:
- 验证按钮有效,部门可以通过按下它来更改其库存状态,代码如下:
UPDATE inv_tb_dashboard SET etat_dashboard = 1, date_dashboard = SYSDATE WHERE fk_service_dashboard IN (SELECT pk_service FROM inv_tb_service WHERE UPPER(code_service) = v('APP_USER'));
- 我可以根据状态值动态更改 table 行的颜色(0 表示假,1 表示真)这是 JS 代码:
$(document).ready(function() {
$("td:nth-child(3)").each(function() {
if ($(this).text() === "Non validé") {
$(this).parent().children().css({'background-color': '#d88882'});
}
else if($(this).text() === "Validé"){
$(this).parent().children().css({'background-color': 'lightgreen'});
}
});
});
- 我可以更改图标,但这是我不满意的部分,我想改进并使其更清洁。实际上,我的 table 有一个
icon_dashboard
列,这是显示我上面提到的两个图标的列。我在 Page Load 上有一个 Dynamic Action,它执行以下代码:
UPDATE inv_tb_dashboard
SET
icone_dashboard =
'<a href="mailto:'||email_dashboard||'?Subject=RAPPEL - Inventaire communal"><span aria-label="Mail"><span class="fa fa-envelope-o" aria-hidden="true" title="Mail"></span></span></a>'
WHERE etat_dashboard = 0;
UPDATE inv_tb_dashboard
SET
icone_dashboard =
'<span aria-label="Mail"><span class="fa fa-check-circle-o" aria-hidden="true" title="Mail"></span></span>'
WHERE etat_dashboard = 1;
是的。如您所见,我在静态文本的列中插入 HTML 标记,基于 etat_dashboard
的值,即上述状态(0 假/1 真)。这真的不是一个干净的方法,我想让一些东西工作得更好。
Instaed,我想知道是否可以使用 JavaScript 或 jQuery 表达式动态更改 #LINK# 列的值,并设置我在页面加载时在我的 DA 上做了图标吗?这可以让我摆脱 icon_dashboard
列。
如需了解更多详情,请随时提问。
提前谢谢你,
托马斯
您可以在 select 中添加 CASE
语句,而不是在您的 table 中使用“icon_dashboard”列并将其值更新为所需的值。这样就不需要更新 table 的动态操作。 Select 类似于:
SELECT
<standard_columns>,
CASE
WHEN etat_dashboard = 0 THEN '<a href="mailto:'||email_dashboard||'?Subject=RAPPEL - Inventaire communal"><span aria-label="Mail"><span class="fa fa-envelope-o" aria-hidden="true" title="Mail"></span></span></a>'
WHEN etat_dashboard = 1 THEN '<span aria-label="Mail"><span class="fa fa-check-circle-o" aria-hidden="true" title="Mail"></span></span>'
END as icone_dashboard
FROM inv_tb_dashboard
它并没有从查询中删除 html,但它大大简化了过程。最后你必须问问自己 - 将来维护最少的是什么,向查询或自定义 javascript 操作添加一行。
我正在研究 Oracle Apex v21.1。我正在尝试为管理员创建一个小的“仪表板”table。
用例:当部门准备好提交他们的库存时,他们可以点击“验证库存”按钮,然后将显示他们的库存已准备好给table 管理员的仪表板。然后管理员可以检查仪表板,看看谁完成了,谁没有完成。仪表板将以两种不同的颜色(绿色 = 就绪 / 红色 = 未就绪)显示部门名称、验证日期、库存状态(就绪/未就绪)。如果库存未准备好,#LINK 列中会出现一个电子邮件图标,使管理员可以向部门发送电子邮件。如果准备就绪,将显示一个简单的“检查”。
这是 what I already have 以及我能做的:
- 验证按钮有效,部门可以通过按下它来更改其库存状态,代码如下:
UPDATE inv_tb_dashboard SET etat_dashboard = 1, date_dashboard = SYSDATE WHERE fk_service_dashboard IN (SELECT pk_service FROM inv_tb_service WHERE UPPER(code_service) = v('APP_USER'));
- 我可以根据状态值动态更改 table 行的颜色(0 表示假,1 表示真)这是 JS 代码:
$(document).ready(function() {
$("td:nth-child(3)").each(function() {
if ($(this).text() === "Non validé") {
$(this).parent().children().css({'background-color': '#d88882'});
}
else if($(this).text() === "Validé"){
$(this).parent().children().css({'background-color': 'lightgreen'});
}
});
});
- 我可以更改图标,但这是我不满意的部分,我想改进并使其更清洁。实际上,我的 table 有一个
icon_dashboard
列,这是显示我上面提到的两个图标的列。我在 Page Load 上有一个 Dynamic Action,它执行以下代码:
UPDATE inv_tb_dashboard
SET
icone_dashboard =
'<a href="mailto:'||email_dashboard||'?Subject=RAPPEL - Inventaire communal"><span aria-label="Mail"><span class="fa fa-envelope-o" aria-hidden="true" title="Mail"></span></span></a>'
WHERE etat_dashboard = 0;
UPDATE inv_tb_dashboard
SET
icone_dashboard =
'<span aria-label="Mail"><span class="fa fa-check-circle-o" aria-hidden="true" title="Mail"></span></span>'
WHERE etat_dashboard = 1;
是的。如您所见,我在静态文本的列中插入 HTML 标记,基于 etat_dashboard
的值,即上述状态(0 假/1 真)。这真的不是一个干净的方法,我想让一些东西工作得更好。
Instaed,我想知道是否可以使用 JavaScript 或 jQuery 表达式动态更改 #LINK# 列的值,并设置我在页面加载时在我的 DA 上做了图标吗?这可以让我摆脱 icon_dashboard
列。
如需了解更多详情,请随时提问。
提前谢谢你,
托马斯
您可以在 select 中添加 CASE
语句,而不是在您的 table 中使用“icon_dashboard”列并将其值更新为所需的值。这样就不需要更新 table 的动态操作。 Select 类似于:
SELECT
<standard_columns>,
CASE
WHEN etat_dashboard = 0 THEN '<a href="mailto:'||email_dashboard||'?Subject=RAPPEL - Inventaire communal"><span aria-label="Mail"><span class="fa fa-envelope-o" aria-hidden="true" title="Mail"></span></span></a>'
WHEN etat_dashboard = 1 THEN '<span aria-label="Mail"><span class="fa fa-check-circle-o" aria-hidden="true" title="Mail"></span></span>'
END as icone_dashboard
FROM inv_tb_dashboard
它并没有从查询中删除 html,但它大大简化了过程。最后你必须问问自己 - 将来维护最少的是什么,向查询或自定义 javascript 操作添加一行。