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/pages/clients/_clientid/projects/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

<template>
  <div v-if="isReady(project)">
    <PageHeader :title="project.name"/>
    <b-breadcrumb :items="breadcrumbLinks"></b-breadcrumb>
    <b-tabs class="mt-3" content-class="mt-3" v-model="currentTabIndex">
      <b-tab title="Dashboard" active>
        <div>
          <CoralsReportsDateForm @filter="filter" :form="form"></CoralsReportsDateForm>
          <div class="row" v-if="false">
            <div class="col-md-3">
              <evaluation-time-project-card :form="form" v-if="!dataLoading"/>
            </div>
            <div class="col-md-3">
              <budget-remaining-project-card :form="form" v-if="!dataLoading"/>
            </div>
            <div class="col-md-3">
              <internal-cost-project-card :form="form" v-if="!dataLoading"/>
            </div>
            <div class="col-md-3">
              <UninvoicedAmountProjectCard :form="form" v-if="!dataLoading"/>
            </div>
          </div>
          <b-tabs class="mt-3" content-class="mt-3" v-model="currentSubTabsIndex">
            <b-tab title="Activities" active>
              <activities-report url="timesheet/clientProjects/get-activities-report" :form="form" v-if="!dataLoading"/>
            </b-tab>
            <b-tab title="Users" lazy>
              <user-report url="timesheet/clientProjects/get-users-report" :form="form" v-if="!dataLoading"/>
            </b-tab>
          </b-tabs>
          <div class="row">
            <div class="col-md-3">
              <EntriesHoursLineChart model="project" :params="chartDataParameters"
                                     v-if="!dataLoading"/>
            </div>
            <div class="col-md-3">
              <activities-hours-charts-data v-if="!dataLoading" :params="chartDataParameters" :form="form"
                                            :urlKey="'project-activities'"/>
            </div>
          </div>
        </div>
      </b-tab>
      <b-tab title="Entries">
        <entries-index :entries-resource="entriesResource"/>
      </b-tab>
    </b-tabs>
  </div>
</template>

<script>
import PageHeader from "@/components/layout/PageHeader";
import EntriesIndex from "@/components/Entries/Index";
import EvaluationTimeProjectCard from "@/components/ProjectStatistics/EvaluationTimeProjectCard";
import InternalCostProjectCard from "@/components/ProjectStatistics/InternalCostProjectCard";
import UninvoicedAmountProjectCard from "@/components/ProjectStatistics/UninvoicedAmountProjectCard";
import BudgetRemainingProjectCard from "@/components/ProjectStatistics/BudgetRemainingProjectCard";
import ActivitiesHoursChartsData from "@/components/ChartJS/ActivitiesHoursChartsData";
import EntriesHoursLineChart from "@/components/ChartJS/EntriesHoursLineChart";
import PieChart from "@/components/ChartJS/PieChart";
import ActivitiesReport from "@/components/Reports/ActivitiesReport";
import UserReport from "@/components/Reports/UsersReport";
import CoralsReportsDateForm from "@/components/CoralsForm/CoralsReportsDateForm";


export default {

  name: "projectShow",

  components: {
    EntriesIndex,
    PageHeader,
    EvaluationTimeProjectCard,
    InternalCostProjectCard,
    ActivitiesReport,
    UserReport,
    UninvoicedAmountProjectCard,
    BudgetRemainingProjectCard,
    EntriesHoursLineChart,
    PieChart,
    ActivitiesHoursChartsData,
    CoralsReportsDateForm
  },

  async asyncData({params, $axios, redirect}) {

    let project = await $axios.get(`/timesheet/clients/${params.clientid}/projects/${params.projectid}`)
      .then(({data}) => {
        return data.data;
      }).catch((error) => {
        return redirect('/');
      });

    return {
      project
    }
  },

  data() {
    return {
      pieChartData: {},
      pieChartOptions: {},
      expectedWorkingDays: null,
      dataLoading: false,
      chartDataReady: false,
      form: this.$form({
        period: 'currentMonth',
        is_limited: 0,
        from_date: '',
        to_date: '',
        project_id: this.$route.params.projectid,
        client_name: '',
        project_name: '',
      }, {resetOnSuccess: false}),
      currentTabIndex: 0,
      currentSubTabsIndex: 0
    }
  },
  methods: {
    filter() {
      this.dataLoading = true;
      this.$nextTick(() => {
        this.dataLoading = false;
      });

    },
    isReady(project) {
      if (project) {
        this.form.client_name = project.client;
        this.form.project_name = project.name;
        return true;
      }
      return false;
    },
  },
  computed: {
    chartDataParameters() {
      let fromDate = this.form.from_date,
        toDate = this.form.to_date;

      if (fromDate !== null && typeof fromDate == 'object') {
        fromDate = this.form.from_date.toLocaleDateString();
      }

      if (toDate !== null && typeof toDate == 'object') {
        toDate = this.form.to_date.toLocaleDateString();
      }

      return {
        project_id: this.$route.params.projectid,
        from_date: fromDate,
        to_date: toDate,
        is_limited: 0
      }
    },

    entriesResource() {
      return `timesheet/projects/${this.project.id}/entries`;
    },
    breadcrumbLinks() {
      return [
        {
          text: 'Clients',
          to: '/clients'
        },
        {
          text: this.project.client,
          to: `/clients/${this.project.client_id}`
        },
        {
          text: 'Projects',
          to: `/clients/${this.project.client_id}?tab=projects`
        },
        {
          text: this.project.name,
          active: true
        },

      ]
    },
  },
}
</script>

<style scoped>

</style>