<template>
  <div class="main">

    <div>
      Загруженные акты {{ date_query }} :
    </div>


  <div  v-if="data">

            <div  class="result_downloads">
              <div>
                Код акта
              </div>
              <div>
                Кол.п
              </div>
              <div>
                Выбор
              </div>

            </div>


            <div class="result_downloads" v-for="item in data"  >
              <div>
                {{ item.idoper || 0 }}
              </div>
              <div>
                {{ infoBarcodes(item) }}

              </div>
              <div>
                <my-button @click="selectAct(item.idoper)" class="btn">В сборку</my-button>

              </div>
              <div>{{ result }}</div>


            </div>

  </div>




  </div>
</template>

<script>


export default {
  name:"resultDownloads",
  components: {},
  data() {
     return {
result:'',


     }
  },
  props:{
    data:[Object,Array],
    date_query:String,

  },

  methods:{
    selectAct(id){
      localStorage.id = id;
      console.log("выбор id "+localStorage.id);
      this.result='акт загружен, перейдите в сборку';
    },

    infoBarcodes(item){

      if(!item.data_json || !item.data_json.barcodes.length){
        return 0;
      }

      return item.data_json.barcodes.length;

    },


  },

}


</script>

<style  scoped>
.main{
  display: flex;
  flex-direction: column;
  gap: 10px;

}


.result_downloads{
  display: grid;
  grid-template-columns: 120px 60px 1fr ;
  gap:10px;

}

.btn{
  border: 1px solid #9d9d9d;
  border-radius: 5px;
}


</style>