fastadmin 自定义status数据颜色

洪、

已于 2023-08-14 14:23:32 修改

阅读量3.5k

点赞数 1

分类专栏：学习经验 fastadmin 文章标签： php

于 2021-08-03 11:20:43 首次发布

本文链接：https://blog.csdn.net/t_hong/article/details/119346149

版权

学习经验同时被 2 个专栏收录

23 篇文章 0 订阅

订阅专栏

fastadmin

3 篇文章 1 订阅

订阅专栏

fastadmin 自定义status数据颜色

fastadmin根据不同数据自定义颜色，看以下代码：

   {
                            field: 'status',
                            title: __('Status'),
                            custom: {"1": "green", "2": "red"},
                            searchList: {"1": __('Status 1'), "2": __('Status 2')},
                            formatter: Table.api.formatter.status
                        },

只需要在里面加上： custom:{0:‘success’,1:‘red’}就行了，不影响筛选功能
在这里插入图片描述

可添加的颜色：

“primary”,
“success”,
“danger”,
“warning”,
“info”,
“gray”,
“red”,
“yellow”,
“aqua”,
“blue”,
“navy”,
“teal”,
“olive”,
“lime”,
“fuchsia”,
“purple”,
“maroon”

方法二：自定义颜色
在这里插入图片描述
在对应表格列灵活定义即可：


formatter:function (value, row, index) {
    // console.log(row);
    if (row.typedata == 'income') {
        return '<span style="color:green">' + value + '</span>';
    } else {
        return '<span style="color:red">' + value + '</span>';
    }
}

最终效果如下
在这里插入图片描述
第三种方式：

代码：

    {
                            field: 'status',
                            title: __('巡检进度'),
                            searchList: {"1": __('待巡检'), "2": __('已巡检'), "3": __('漏检')},
                            formatter: Controller.api.formatter.status
                        },

然后再api中设置status颜色：
在这里插入图片描述代码：

      api: {
            formatter: {

                //设置status颜色
                status: function (value, row, index) {
                    switch (value) {
                        case 1:
                            return "<span style='color: #ff3300'>待巡检</span>";
                        case 2:
                            return "<span style='color: #008800'>已巡检</span>";
                        case 3:
                            return "<span style='color: #f39c12'>漏检</span>";
                    }
                },
            },
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        }