<template>
  <user-dashboard-container page-class="guarantee" panel-title="مانده معین مشتری">
    <div v-loading="fetching" class="tableBox">
      <table class="history">
        <thead>
          <tr>
            <th class="index">ردیف</th>
            <th class="date">تاریخ برگه پذیرش</th>
            <th class="transID">شناسه برگه پذیرش</th>
            <th class="itemID">شناسه کالا</th>
            <th class="itemCode">کد کالا</th>
            <th class="itemName">نام کالا</th>
            <th class="quantity">تعداد پذیرش</th>
            <th class="repairCount">تعداد تعمیرات</th>
            <th class="remainCount">مانده</th>
          </tr>
        </thead>
        <tbody>
          <template v-if="history.length">
            <tr v-for="(item, index) in history" :key="item._id" :title="item.ItemName">
              <td class="index">
                <span>{{ index + 1 }}</span>
              </td>

              <td class="date">
                <span>{{ $jDate(item.TransDate_63) }}</span>
              </td>

              <td class="transID">
                <span>{{ item.TransactionID_63 }}</span>
              </td>

              <td class="itemID">
                <span>{{ item.ItemID }}</span>
              </td>

              <td class="itemCode">
                <span>{{ item.ItemCode }}</span>
              </td>

              <td class="itemName">
                <span class="singleLineTxt">{{ item.ItemName }}</span>
              </td>

              <td class="quantity">
                <span>{{ item.NQty_63 }}</span>
              </td>

              <td class="repairCount">
                <span>{{ item.NQty_115 }}</span>
              </td>

              <td class="remainCount">
                <span>{{ item.RemainQty }}</span>
              </td>
            </tr>
          </template>
          <tr v-else>
            <td class="noItem">
              <span>هیچ اطلاعاتی وجود ندارد</span>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
    <table-notice />
  </user-dashboard-container>
</template>

<script>
export default {
  name: 'AccountUserGuaranteeRemainHistory',
  layout: 'user',
  data() {
    return {
      verityHistory: [],
      panatechHistory: [],
      fetching: false
    }
  },
  computed: {
    history() {
      return [...this.verityHistory, ...this.panatechHistory]
    }
  },
  async mounted() {
    try {
      this.fetching = true

      const user = this.$auth.user
      const verityData = {
        url: `/api/GetRemainingReceptionItems?FromBusinessCode=${user.verity_businessCode}&ToBusinessCode=${user.verity_businessCode}`,
        db: 'verity'
        // url: `/api/GetRemainingReceptionItems?ToBusinessCode=${user.arpa_businessCode}`
      }
      const panatechData = {
        url: `/api/GetRemainingReceptionItems?FromBusinessCode=${user.panatech_businessCode}&ToBusinessCode=${user.panatech_businessCode}`,
        db: 'panatech'
        // url: `/api/GetRemainingReceptionItems?ToBusinessCode=${user.arpa_businessCode}`
      }

      const allData = await Promise.all([
        // fetch verity data
        this.$axios.post('/api/cross/getRouteManager', verityData),
        // fetch panatech data
        this.$axios.post('/api/cross/getRouteManager', panatechData)
      ])

      const verityHistory = allData[0]
      const panatechHistory = allData[1]

      this.verityHistory = verityHistory.data.data
      this.panatechHistory = panatechHistory.data.data

      this.fetching = false
    } catch (e) {
      this.$arpaError()
    }
  }
}
</script>
