iview progress 根据进度显示不同颜色

js:

data:function() {
        return {
          colorful:[],
        }
      },

           { align: 'center',
            key: 'status',
            render: (h, params) => {
              let vm = this;
              let row = params.row;
              if () {
    
                  this.judgeColor(row);
              }
            return ;

             }
          }

                  h('i-progress', {
                    props: {
                      percent: percent_no,
                      // percent: percent_no,
                      'stroke-width': "25",
                      'stroke-color':this.colorful[params.index],
                    },
                  },

        // 進度顏色
        judgeColor(val1){
           console.log(val1);
           var val= ((val1.process_now-1)/(val1.process_now))*100;
           if(val<50 || val==50){
             this.colorful[val1._index]="#ff0000";
           }
           else if(val>50 && val<80){
            this.colorful[val1._index]="#f4f110";
           }else{
            this.colorful[val1._index]="#13cc00";
           }
        },

css:

.ivu-progress-text-inner{
  position: absolute;
  margin-left: -55px;
}
.ivu-progress-inner{
  background-color: #b9e5ff;
  border-radius: 20px;
}