[Vuejs]-How to assign cell value depending on row and column header in vue js table

0👍

You should make getTotalWork to return value and place it in output:

<tbody style="border-bottom:#dbb100 1px"  v-for="(item,itm_index) in itemList" :key="itm_index.id" >
  <tr class="left-align">
       <td>{{item.name}}</td>
       <td v-for="(day, day_index) in days" :key="day_index.id">{{getTotalWork(itm_index, day_index)}}</td>
  </tr>
</tbody>

So your function will be something like this:

getTotalWork(item_index, day_index) {
    let item = this.itemList[item_index];
    let day = this.days[day_index];
    let getDate = this.template.date;
    item = item.name;

    //MAX SINEV's answer  
    if(this.costList.length > 0){
        if(day < 10) day = '0'+day;
        var searchItem = this.costList.find(emp => emp.name === item);

            if(searchItem.name == item && searchItem.date ==this.monthYear+'-'+day){
                return searchItem.total_work;
            }else{
                return 0;
            }
    }
    return 0;
}

OP’s REVISION:

if(this.costList.length > 0){

    if(day < 10){
        day = '0'+day;
    }
    //this.monthYear contains year and date in yyyy-mm format
    var searchItem = this.costList.find(emp => emp.name === item.name && emp.date == this.monthYear+'-'+day);

    if(typeof searchItem != 'undefined'){
        return searchItem.total_work;
    }
}
return 0;

Leave a comment