数据库模板列进度条来啦！

突发奇想，有一种可以简单实现数据库中进度条的方式！
就是用 🟩 和 ⬜ 按照比例来堆砌。当然，这只能粗略地体现百分比中十位的数字，个位的数字是体现不出来的。

后来经过 D 大和评论区大神的帮助，又有了完善的进度条显示方式（即进度条 3）！

效果如下：

• 建立两个数字类型的列，分别命名为“总数”和“已完成”

• 建立 2 个模板列，分别命名为“进度”和“进度条”

• “进度”列代码

  .action{$a:= index . "已完成" }
  .action{$b:= index . "总数" }
  .action{$c:= mul $a 100}
  .action{$d:= div $c $b}
  .action{$d}%
  ​

• “进度条”列代码

  • 第一种是向下取整，即只看十位数

    .action{$a:= index . "已完成" }
    .action{$b:= index . "总数" }
    .action{$c:= mul $a 10}
    .action{$d:= div $c $b}
    .action{if eq $d 0}
    ⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜
    .action{else if eq $d 1}
    🟩⬜⬜⬜⬜⬜⬜⬜⬜⬜
    .action{else if eq $d 2}
    🟩🟩⬜⬜⬜⬜⬜⬜⬜⬜
    .action{else if eq $d 3}
    🟩🟩🟩⬜⬜⬜⬜⬜⬜⬜
    .action{else if eq $d 4}
    🟩🟩🟩🟩⬜⬜⬜⬜⬜⬜
    .action{else if eq $d 5}
    🟩🟩🟩🟩🟩⬜⬜⬜⬜⬜
    .action{else if eq $d 6}
    🟩🟩🟩🟩🟩🟩⬜⬜⬜⬜
    .action{else if eq $d 7}
    🟩🟩🟩🟩🟩🟩🟩⬜⬜⬜
    .action{else if eq $d 8}
    🟩🟩🟩🟩🟩🟩🟩🟩⬜⬜
    .action{else if eq $d 9}
    🟩🟩🟩🟩🟩🟩🟩🟩🟩⬜
    .action{else if eq $d 10}
    🟩🟩🟩🟩🟩🟩🟩🟩🟩🟩
    .action{end}
    ​

  • 第二种是四舍五入，就不解释了

    .action{$a:= index . "已完成" }
    .action{$b:= index . "总数" }
    .action{$c:= mul $a 100}
    .action{$d:= div $c $b}
    .action{if lt $d 5}
    ⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜
    .action{else if lt $d 15}
    🟩⬜⬜⬜⬜⬜⬜⬜⬜⬜
    .action{else if lt $d 25}
    🟩🟩⬜⬜⬜⬜⬜⬜⬜⬜
    .action{else if lt $d 35}
    🟩🟩🟩⬜⬜⬜⬜⬜⬜⬜
    .action{else if lt $d 45}
    🟩🟩🟩🟩⬜⬜⬜⬜⬜⬜
    .action{else if lt $d 55}
    🟩🟩🟩🟩🟩⬜⬜⬜⬜⬜
    .action{else if lt $d 65}
    🟩🟩🟩🟩🟩🟩⬜⬜⬜⬜
    .action{else if lt $d 75}
    🟩🟩🟩🟩🟩🟩🟩⬜⬜⬜
    .action{else if lt $d 85}
    🟩🟩🟩🟩🟩🟩🟩🟩⬜⬜
    .action{else if lt $d 95}
    🟩🟩🟩🟩🟩🟩🟩🟩🟩⬜
    .action{else}
    🟩🟩🟩🟩🟩🟩🟩🟩🟩🟩
    .action{end}
    ​

  • 第三种是评论区大神的方法，可以精确到个位数

    .action{$a:= index . "已完成" }
    .action{$b:= index . "总数" }
    .action{$c:= mul $a 100}
    .action{$d:= div $c $b}
    <span style="background-color: rgba(175,184,193,0.2); width: 100%; display: inline-block;height: 12px;border-radius: 6px;align-self: center;overflow: hidden;">
        <span style="text-align: right; font-size: 12px; width: .action{$d}%; background-color: rgb(45,164,78); display: inline-block;height: inherit;vertical-align: top;"></span>
    </span>
    ​

世上还是大神多呀！

如果你还有更好的方式，欢迎和我交流 ～