除了静态样式外，MisShop还提供了类似Excel的条件格式，方便的根据各种状态，显示不同的样子。

MisShop选中一个单元格后，右方会出现 基本属性 高级属性，控件属性，控件动作 四组属性。

单元格属性

第一列是列名，表示这个属性做什么的。
第二列是静态值，表示填的是什么，属性值就是什么，例如填写1+3，那么表示这个属性的值是字符串“1+3”。
第三列是公式，表示用这个公式来计算属性值，例如填写的1+3，那么表示这个属性的值是整数4.

下面我们用客户列表为例，来说明一下条件样式的用法。

---

1.条件前景色，背景色，宽度，高度等。

*需求：客户列表，如果一个客户是非常重要，那么把 重要度 这一列的字体颜色显示为红色，否则是绿色。

选中值为 =ds.重要度 的重要度格， 在右边的 基本属性(栏) -> 显示(组) 中找到属性 前景色，双击第三列公式列，会弹出表达式输入框。

前景色的表达式编辑.png
ifv 是条件判断函数， 第一个参数是判断条件，如果条件为真，那么返回第二个参数，否则返回第三个参数作为结果。
ds.重要度==Dict.重要度.非常重要 表示如果ds的重要度字段的值是字典项非常重要的时候，返回真（true），否则返回假（false）。
-3407872（红色） 和 -16735232（绿色） 是用 rgba模型表示的颜色。一般颜色是在 函数编辑窗口 右边，点击 颜色输入 后用各种颜色输入器选择得到的。
重要度条件颜色的界面效果

常见条件格式：

显示组：

• 前景色
• 背景色
• 控件背景色
• 宽度
• 高度
• 内边距（上， 下，左，右）

字体组：

• 字体
• 字号
• 加粗
• 斜体
• 下划线

---

2.条件样式 （复杂样式）

有的时候，希望显示的条件样式不是简单的颜色大小之类的，而是某种复杂效果。

例如我们可以在样式配置里，把删除按钮 设置位为 警告色的外边框按钮 （ btn-outline-warning）。这个样式除了前景色不同之外，鼠标悬浮在按钮上的时候，背景色也会发生改变。
如果需要用条件控制复杂样式，需要先了解复杂样式对应的网页中的class值。
可以先找个格子配置为这个样式，然后鼠标移动到设计器右上的 配置样式 按钮上看到。

查看格子配置的样式
如图，我们可以看到 这个格子具有图标样式 oi oi-pencil ，以及按钮样式 btn-secondary btn-sm。

如果我们希望当客户为重要客户的时候，删除按钮 显示为这个样式，不能简单的用前景色，背景色的条件表达式来控制，而是要用公式来控制 控件样式。

可以在 基本属性 -> 显示控制(组）-> 控件样式 的公式中，输入

ifv(ds.重要度==Dict.重要度.非常重要,"btn-outline-warning","btn-secondary")

这个函数表示，当重要度为非常重要的时候，按钮的样式为btn-outline-warning（警告色的外边框按钮）,否则按钮的样式为 btn-secondary（次要颜色普通按钮）

显示效果

鼠标移动到黄色的删除按钮上，会有底色变黄的效果。

复杂样式中，在控件样式生成的值，会被填写到html页面的控件对应的元素的class属性中。所以可以通过条件复杂样式，来实现各种特殊效果，只要预先导入那些复杂样式就可以。

复杂样式可以控制的属性包括：

• 控件样式（控件的class属性）
• 控件style（控件的style属性）
• 控件自由属性（生成的字符串 放到控件属性里面，可以是任意字符串）
• 单元格样式（对应控件外层的div或者td的class属性）
• 单元格style（控件的style属性）
• 单元格自由属性（生成的字符串 放到控件属性里面，可以是任意字符串）

---

3.条件可视和条件可用

需求：隐藏非常重要的客户的手机号。

找到手机号的格子 =ds.手机号 ，在可视属性的公式里，输入 ds.重要度!=Dict.重要度.非常重要，那么可以看到效果。

非常重要的客户的手机号不显示.png

基本属性 -> 可视 控制单元格是否可以被用户看到。如果直接去掉勾，那么这个格子的内容将不会显示。

如果需求变化为管理员之外的其他人无法看到非常重要的客户的手机号，那么只需要把可视公式改为： me.角色.名称=="admin" || ds.重要度!=Dict.重要度.非常重要

如果角色的名称是admin 或者 不是非常重要， 那么可以看到。

可用 和可视的用法类似。控件属性 ->可用 是用来控制是否可以编辑，或者链接是否可以点击等情况的。

例如编辑按钮，可用 设置为否，或者公式返回为假false，点击的时候就会提示该链接不可用。

例如编辑页面里，可用 的静态属性为否，那么这个属性就无法编辑；在可用属性里填写了公式，那么就只有当公式返回真true的时候，才可以编辑。

---

4.行可视和列可视

除了隐藏格子之外，还可以彻底的隐藏某行或者某列

点击面板左边的行头 1,2,3,4...可以选中页面的行。
点击面板上方的列头 A，B，C，D...可以选中页面的列。
在区域的某个格子里，鼠标右键菜单中点击 选择区域行 可以选中区域的行（或者直接按快捷键 Ctrl + 2 ）；点击 选择区域列 可以选中区域的列(快捷键Ctrl + 3)

选中页面行列或者区域行列

可以看到面板右侧的基本属性栏里多了一些属性，这些就是行属性/列属性。

行属性

可以控制 列表页面中表格中的某些行列不显示，或者编辑页面中某些行，列不显示。

---

5.条件图标 和 条件角标。

条件图标和条件角标的实现和条件复杂样式的实现思路相同。都是用公式去控制 图标或者 角标的 class。

需求： 如果客户是男性，那么客户名 使用 向上 的图标，如果是女性，那么客户名 使用 向下 的图标。 并且如果重要度是非常重要，名称 的文字显示为红色。

实现：
在 客户名称的格子 =ds.名称 中，设置格子的 控件属性 -> 图标样式 的公式为：
ifv(ds.性别==Dict.性别.男,"fa fa-chevron-up ","fa fa-chevron-down ")

"fa fa-chevron-up " 是向上箭头的图标样式。可以在样式配置，图标里配置看看。
"fa fa-chevron-down " 是向下箭头的图标样式。
把之前配置在 重要度 格子中的 前景色的公式 ifv(ds.重要度==Dict.重要度.非常重要,-3407872,-16735232) 复制下来，粘贴到 名称格 的 前景色公式中。

条件图标显示效果

条件角标也是类似
控制图标，角标的颜色，内边距，位置等也是类似控制。