首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用activeadmin以彩色显示一行

使用activeadmin以彩色显示一行
EN

Stack Overflow用户
提问于 2012-09-20 20:07:03
回答 4查看 6.3K关注 0票数 7

如果模型满足以下条件,我希望在索引页面上以红色显示一行:updated = true。我如何使用activeadmin来做到这一点?

Thx

EN

回答 4

Stack Overflow用户

发布于 2015-06-27 19:19:55

从Active Admin 1.0.0pre1开始,可以根据该行记录的属性指定行类。要将一个类分配给具有更新记录的行,可以编写以下代码,假设您有一些更新检查函数was_updated?

app/admin/my_model.rb

代码语言:javascript
运行
AI代码解释
复制
ActiveAdmin.register MyModel do

    ...

    index(:row_class => -> record { 'my-class' if record.was_updated? }) do

      # whatever columns you want:
      # selectable_column
      # id_column
      # column :attribute
      # actions
    end

    ...

end

这个新选项在indexing as a table.的源代码中有注释

然而,Active Admin的SCSS在指定表行(或者更确切地说,是表数据)颜色时使用了大量的specificity,这使得它们无法通过在样式表中编写.my-class { background-color: red; }来覆盖自定义颜色。不过,我发现以下方法是可行的:

app/assets/stylesheets/active_admin.css.scss

代码语言:javascript
运行
AI代码解释
复制
...

tr.odd, tr.even {
    &.my-class {
        td.col {
            background-color: red;
        }
    }
}
票数 17
EN

Stack Overflow用户

发布于 2012-09-20 22:06:46

活动管理的表呈现在ActiveAdmin::Views::TableFor中是硬核的,如下所示:

代码语言:javascript
运行
AI代码解释
复制
  def build_table_body
    @tbody = tbody do
      # Build enough rows for our collection
      @collection.each{|_| tr(:class => cycle('odd', 'even'), :id => dom_id(_)) }
    end
  end

因此,最简单的方法可能是使用monkeypatch方法。我看不出子类化是否有帮助。

票数 3
EN

Stack Overflow用户

发布于 2013-09-22 15:39:45

如果你只是想要一些快速的东西,并且不需要monkeypatching Activeadmin,你就不能把div放在你的表里吗?就像f ex

代码语言:javascript
运行
AI代码解释
复制
table_for invoice.ccpayment do
  column 'Payments and payments attempts on this invoice: ' do |p|
    if p.paymentcomplete > 0
      div :class => 'green' do
        'Payment # '+p.id.to_s+' of '+p.currency.iso+' '+p.amount.to_s+' on '+p.created_at.to_s
      end
    else
      div :class => 'red' do
        'FAILED Payment # '+p.id.to_s+' of '+p.currency.iso+' '+p.amount.to_s+' on '+p.created_at.to_s
      end
    end
  end
end 

您可以很容易地在'activeadmin.css.scss‘中定义这些类

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/12520114

复制
相关文章
使用Matlab一行一行描点绘制中国跳棋棋盘。
1、点击[Matlab] 2、点击[命令行窗口] 3、按<Enter>键
裴来凡
2022/05/28
8310
使用Matlab一行一行描点绘制中国跳棋棋盘。
unit8或double灰度图像的伪彩色显示[通俗易懂]
figure,imshow(gray,’Colormap’,jet(255));
全栈程序员站长
2022/09/28
8260
unit8或double灰度图像的伪彩色显示[通俗易懂]
使用VirtualBox实现端口转发,以
先来认识几个概念 (1)IP地址:又称为互联网协议地址,是计算机的物理地址,相当于计算机的编号,是32位的二进制数,通常被分割成4个8位的二进制数; (2)端口:指设备与外界通讯的接口,一台计算机的端口数为65536个,按类型可以分为周知端口、注册端口和动态端口三种; (3)socket:套接字,是一个基于TCP/UDP的接口。网络上的两个程序通过一个双向的通信连接实现数据的交换,连接的一端称为socket服务端,另一端称为socket客户端; (4)socket服务端:接收客户端数据,需要绑定IP与端口,其中IP为允许连接进来的IP地址,设置为"0.0.0.0"表示允许任意IP访问,端口为socket服务端的端口,客户端连接的端口需要与该端口相一致才能访问; socket客户端:向服务端发送数据,需要连接IP与端口,其中IP为客户端IP地址,端口必须与socket服务端绑定的端口一致,否则无法连接,此外客户端的端口是注册端口,由系统随机分配。
py3study
2020/01/17
4.2K0
以更好的方式使用 Vue Mixins
Mixin 组件在项目中经常被用来重用一些业务逻辑,但它们有一些不确定的细微差别,这在项目开发中越来越明显。我偶尔也会遇到这种情况,它们会给代码库的重构或新功能的开发带来困难。
前端小智@大迁世界
2022/05/09
5680
按照第一行代码使用ToolBar报错。
Unable to start activity ComponentInfo{cn.lanol.studykongjian/cn.lanol.studykongjian.MainActivity}: android.view.InflateException: Binary XML file line #11 in cn.lanol.studykongjian:layout/activity_main: Binary XML file line #11 in cn.lanol.studykongjian:l
SingYi
2022/07/13
6460
按照第一行代码使用ToolBar报错。
Python妙用:使用一行代码下载视频
是的,这款下载工具包是基于Python开发的,实际它不只支持视频下载,还支持图片、音乐等。而且,只要视频的地址,一行代码就可,你别不信,我给大伙尝尝鲜。要不,就拿何冰老师《后浪》演讲视频试试?
天道Vax的时间宝藏
2021/08/11
6300
room的使用-以demo为例
前言 本文是以demo为例介绍,所以部分内容和解释会在demo里以注释的形式给出。 下载链接 数据库的构建 环境配置 在app模块的build.gradle添加以下内容: compile 'android.arch.lifecycle:extensions:1.0.0-alpha5' compile 'android.arch.lifecycle:runtime:1.0.0-alpha5' compile 'android.arch.persistence.room:runt
用户1665735
2018/06/20
2.3K0
工具使用 | sqlmap的简单使用--以DVWA为靶场
期间会遇到一些询问,可以自己判断是还是否,也可以一路回车,最后将会显示出靶机的一些相关信息,比如数据库版本、系统类型等
TeamsSix
2019/09/24
1.8K0
工具使用 | sqlmap的简单使用--以DVWA为靶场
HTML怎样使用a标签以post方式提交
在HTML中,a标签的提交默认是get方式提交的,如果在请求链接的参数中带有中文就会出现乱码问题,除了在后台程序中转码外,这里介绍两种简单的方法,可以在客户端让a标签以post方式提交。 一:增加一个form表单
kirin
2021/03/01
1.9K0
“以终为始”的正确使用方式
以终为始是一种思维方式。如果终局确定,那么根据已知的终局就能推演出达到终局的路径,最终形成一个解决方案。举个例子,如果你要盖一栋楼,那么在盖之前的规划的大楼效果就是”终“,通过这个效果图来反推我们的建筑施工图、结构施工图等,最终形成一个完整的解决方案。
石云升
2022/08/25
6540
Debezium的基本使用(以MySQL为例)
简单理解就是Debezium可以捕获数据库中所有行级的数据变化并包装成事件流顺序输出。
GreatSQL社区
2023/02/23
3.4K0
使用一行Python代码从图像读取文本
处理图像不是一项简单的任务。对你来说,作为一个人,很容易看着某样东西然后马上知道你在看什么。但电脑不是这样工作的。
磐创AI
2019/12/23
1.7K0
使用一行Python代码从图像读取文本
使用Python自动生成报表以邮件发送
数据分析师肯定每天都被各种各样的数据数据报表搞得焦头烂额,老板的,运营的、产品的等等。而且大部分报表都是重复性的工作,这篇文章就是帮助大家如何用Python来实现报表的自动发送,解放你的劳动力,可以让你有时间去做更有意思的事情。
Python中文社区
2018/09/21
2.7K0
使用Python自动生成报表以邮件发送
以自动导入方式使用element-plus/icons
vite 3.1 element-plus 2.2 @element-plus/icons 2.0
路过君
2022/10/25
2K0
kali基础教程第二篇(kali下的相关配置)
1.修改用户配置文件/etc/shadow 将第二栏设置为*,如下。那么该用户就无法登录。但是使用这种方式会导致该用户的密码丢失,也就是当你再次允许他登录的时候,你还得让他重新设置密码。[再次启用这个帐号的方法是把*去掉就可以了
逍遥子大表哥
2021/12/19
1.1K0
kali基础教程第二篇(kali下的相关配置)
37个TOP实例命令,超过一半你肯定都没见过
1. Top 命令输出 首先,让我们了解一下输出。top命令会显示系统的很多信息。我们需要理解不同部分输出的意义:默认运行时,top命令会显示如下输出: 前几行水平显示了不同系统参数的概括,接下来是进
BestSDK
2018/03/02
9410
37个TOP实例命令,超过一半你肯定都没见过
Kotlin练手,以登录为例,Anko简单使用
另外,Anko支持动态生成视图,语法简单,结构清晰,但是不能预览,预览插件:
yechaoa
2022/06/10
5020
Kotlin练手,以登录为例,Anko简单使用
以prometheus的pmsql分析Mac的CPU使用
可以看到我配置了三个job分别是prometheus、node、cm_monitor
Bob hadoop
2020/12/24
1.3K0
以prometheus的pmsql分析Mac的CPU使用
【硬核】韦东山:使用freetype显示一行文字
6.6 使用freetype显示一行文字 使用GIT下载所有源码后,本节源码位于如下目录: 01_all_series_quickstart 04_嵌入式Linux应用开发基础知识\source\10_freetype 04_show_line\show_line.c
韦东山
2020/09/30
2K0
如何使用 Python 只删除 csv 中的一行?
我们将使用 drop() 方法从任何 csv 文件中删除该行。在本教程中,我们将说明三个示例,使用相同的方法从 csv 文件中删除行。在本教程结束时,您将熟悉该概念,并能够从任何 csv 文件中删除该行。
很酷的站长
2023/08/11
1.4K0
如何使用 Python 只删除 csv 中的一行?

相似问题

用户字符串输入以彩色显示

11

以彩色显示jquery调色器图标

216

如何在shell屏幕中以彩色显示

23

如何使用jsp、javascript、css以粗体或彩色显示表格数据

20

以彩色显示文件中的内容

13
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
💥开发者 MCP广场重磅上线!
精选全网热门MCP server,让你的AI更好用 🚀
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档