Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory :  /home/corals/ts.corals.io/frontend/components/ProjectStatistics/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

<template>
  <b-card class="h-100" title="Internal costs">
    <template v-if="isReadyTotalInternalCostsCard">
      <b-card-text class="text-bold">Total Cost : {{ total_time }}</b-card-text>
      <b-card-text class="text-bold">Billable Cost : {{ billable_time }}</b-card-text>
      <b-card-text class="text-bold">Non Billable Cost : {{ non_billable_time }}</b-card-text>
    </template>
    <template v-else>
      <b-skeleton width="100px"></b-skeleton>
      <b-skeleton width="150px"></b-skeleton>
      <b-skeleton width="150px"></b-skeleton>
    </template>
  </b-card>
</template>
<script>

export default {
  name: "InternalCostProjectCard",

  components: {},
  props: {
    form: {
      required: true
    },
  },
  data() {
    return {
      total_time: '',
      billable_time: '',
      non_billable_time: '',
      isReadyTotalInternalCostsCard: false,
    }
  },
  mounted() {
    this.totalInternalCost();
  },
  methods: {
    totalInternalCost() {
      let url = `/timesheet/clientProjects/get-total-internal-cost-for-project`;
      this.form.post(url).then(({data}) => {
        this.total_time = data.data.total_hours;
        this.billable_time = data.data.billable_time;
        this.non_billable_time = data.data.non_billable_time;
        this.isReadyTotalInternalCostsCard = true;
      });
    },
  },
}
</script>

<style scoped>

</style>