@ozdao/martyrs 0.2.423

package/dist/martyrs/src/modules/rents/views/components/pages/GanttChart.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GanttChart.vue.js","sources":["../../../../../../../../src/modules/rents/views/components/pages/GanttChart.vue"],"sourcesContent":["<template>\n  <div class=\"gantt-chart-container\">\n     \n\n    <div class=\"flex-nowrap  w-100 flex bg-light pd-small radius-small mn-b-small\">\n      <div class=\"flex w-100 gap-thin flex-v-center flex-nowrap\">\n        <Tab\n          :tabs=\"viewOptions\"\n          @tab-click=\"switchView($event.tab.value)\"\n          class=\"mn-r-auto h-100 flex-child-default o-hidden p-small pd-nano radius-small bg-white\"\n          tabClass=\" pd-thin radius-thin\"\n        />\n\n        <button @click=\"navigatePrevious\" class=\"h-100 bg-white aspect-1x1 pd-x-small radius-small bg-light mn-r-x-small\">\n          <IconChevronLeft class=\"i-small\"/>\n        </button>\n        \n        <div class=\"month-year-selector flex-v-center\">\n\n         <!--  <Select \n            v-model:select=\"currentMonth\"\n            :options=\"months\"\n            class=\"pos-relative w-100 bg-white radius-small pd-thin \"\n          /> -->\n          <select v-model=\"currentMonth\" style=\"border: 0\" class=\"pd-thin h-100 t-black radius-small bg-white mn-r-micro\">\n            <option v-for=\"(month, index) in months\" :key=\"index\" :value=\"index\">\n              {{ month }}\n            </option>\n          </select>\n\n           <Select \n            v-model:select=\"currentYear\"\n            :options=\"yearOptions\"\n            class=\"pos-relative w-100 bg-white radius-small pd-thin \"\n          />\n        </div>\n        \n        <button @click=\"navigateNext\" class=\"h-100 bg-white aspect-1x1 pd-x-small radius-small bg-light mn-r-x-small\">\n          <IconChevronRight class=\"i-small\"/>\n        </button>\n        \n        <button @click=\"goToToday\" class=\"h-100 pd-r-small p-small pd-l-small radius-small bg-second t-white mn-l-small\">\n          Today\n        </button>\n      </div>\n    </div>\n\n    <!-- Gantt Chart View -->\n    <div \n      class=\"gantt-chart scroller o-scroll\nscroll-snap-type-x-mandatory  scroll-pd-regular  bg-white radius-small\" \n      ref=\"ganttContainer\"\n      @scroll=\"handleScroll\"\n    >\n      <!-- Header with dates -->\n      <div class=\"gantt-header\">\n        <div class=\"gantt-header-row\">\n          <div class=\"gantt-header-item product-column z-index-2\">Product</div>\n          <div class=\"gantt-timeline-header bg-white br-b br-solid br-black-transp\" ref=\"timelineHeader\">\n            <!-- Hours view -->\n            <template v-if=\"currentView === 'hours'\">\n              <div \n                v-for=\"(hour, index) in visibleHours\" \n                :key=\"`hour-${index}`\"\n                class=\"gantt-header-cell\"\n                :class=\"{ \n                  'is-current-hour': isCurrentHour(hour.date, hour.hour),\n                  'is-today': isToday(hour.date)\n                }\"\n              >\n                <div class=\"date-label\">\n                  <div v-if=\"hour.hour === 0 || index === 0\" class=\"day-month-label\">\n                    {{ formatShortDate(hour.date) }}\n                  </div>\n                  <div class=\"hour-number\">{{ formatHour(hour.hour) }}</div>\n                </div>\n              </div>\n            </template>\n            \n            <!-- Days view -->\n            <template v-else-if=\"currentView === 'days'\">\n              <div \n                v-for=\"(date, index) in visibleDates\" \n                :key=\"`day-${index}`\"\n                class=\"gantt-header-cell\"\n                :class=\"{ \n                  'is-weekend': isWeekend(date),\n                  'is-today': isToday(date),\n                  'is-month-start': date.getDate() === 1\n                }\"\n              >\n                <div class=\"date-label\">\n                  <div v-if=\"date.getDate() === 1 || index === 0\" class=\"month-label\">\n                    {{ formatMonth(date) }}\n                  </div>\n                  <div class=\"day-number\">{{ date.getDate() }}</div>\n                  <div class=\"day-name\">{{ formatDay(date) }}</div>\n                </div>\n              </div>\n            </template>\n            \n            <!-- Weeks view -->\n            <template v-else-if=\"currentView === 'weeks'\">\n              <div \n                v-for=\"(week, index) in visibleWeeks\" \n                :key=\"`week-${index}`\"\n                class=\"gantt-header-cell gantt-week-cell\"\n                :class=\"{ \n                  'is-current-week': isCurrentWeek(week.start),\n                  'is-month-start': week.start.getDate() <= 7 && week.start.getDay() === 0\n                }\"\n              >\n                <div class=\"date-label\">\n                  <div v-if=\"week.isMonthStart || index === 0\" class=\"month-label\">\n                    {{ formatMonth(week.start) }}\n                  </div>\n                  <div class=\"week-range\">\n                    {{ formatDateRange(week.start, week.end) }}\n                  </div>\n                  <div class=\"week-number\">W{{ getWeekNumber(week.start) }}</div>\n                </div>\n              </div>\n            </template>\n          </div>\n        </div>\n      </div>\n\n      <!-- Body with products and rentals -->\n      <div class=\"gantt-body\">\n  <div \n    v-for=\"(group, index) in groupedItems\" \n    :key=\"group.title\" \n    class=\"gantt-row\"\n    :class=\"{ 'is-even': index % 2 === 0 }\"\n  >\n    <div class=\"gantt-row-item product-column z-index-2\">\n      <div class=\"product-title\">{{ group.title }}</div>\n      <div class=\"product-status\" :class=\"getStatusClass(group)\">\n        {{ group.status }}\n      </div>\n    </div>\n    \n    <div class=\"gantt-timeline-row\">\n      <!-- Hours cells -->\n      <template v-if=\"currentView === 'hours'\">\n        <div \n          v-for=\"(hour, hourIndex) in visibleHours\" \n          :key=\"`hour-cell-${hourIndex}`\"\n          class=\"gantt-cell\"\n          :class=\"{ \n            'is-current-hour': isCurrentHour(hour.date, hour.hour),\n            'is-today': isToday(hour.date) \n          }\"\n        ></div>\n      </template>\n      \n      <!-- Days cells -->\n      <template v-else-if=\"currentView === 'days'\">\n        <div \n          v-for=\"(date, dateIndex) in visibleDates\" \n          :key=\"`day-cell-${dateIndex}`\"\n          class=\"gantt-cell\"\n          :class=\"{ \n            'is-weekend': isWeekend(date),\n            'is-today': isToday(date) \n          }\"\n        ></div>\n      </template>\n      \n      <!-- Weeks cells -->\n      <template v-else-if=\"currentView === 'weeks'\">\n        <div \n          v-for=\"(week, weekIndex) in visibleWeeks\" \n          :key=\"`week-cell-${weekIndex}`\"\n          class=\"gantt-cell gantt-week-cell\"\n          :class=\"{ \n            'is-current-week': isCurrentWeek(week.start)\n          }\"\n        ></div>\n      </template>\n      \n      <div \n        v-for=\"bar in getItemBars(group)\"\n        :key=\"`${group.title}-${bar.start}-${bar.item[idKey]}`\"\n        class=\"gantt-bar\"\n        :class=\"getBarStatusClass(bar.item)\"\n        :style=\"{\n          left: `${bar.left}px`,\n          width: `${bar.width}px`,\n          top: `${bar.rowIndex * rowHeight.value}px`,\n          zIndex: 10 - bar.rowIndex // Ensure bars in front rows appear above those in back rows\n        }\"\n        @click=\"$emit('item-click', bar.item)\"\n      >\n        <div class=\"gantt-bar-label\">{{ getItemTitle(bar.item) }}</div>\n      </div>\n    </div>\n  </div>\n</div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, watch, nextTick } from 'vue';\n\nimport Tab from '@martyrs/src/components/Tab/Tab.vue';\nimport Select from \"@martyrs/src/components/Select/Select.vue\";\n\n\nimport IconChevronRight from '@martyrs/src/modules/icons/navigation/IconChevronRight.vue';\nimport IconChevronLeft from '@martyrs/src/modules/icons/navigation/IconChevronLeft.vue';\n\nconst props = defineProps({\n  items: {\n    type: Array,\n    required: true\n  },\n  startDate: {\n    type: Date,\n    required: true\n  },\n  endDate: {\n    type: Date,\n    required: true\n  },\n  startDateKey: {\n    type: String,\n    default: 'startDate'\n  },\n  endDateKey: {\n    type: String,\n    default: 'endDate'\n  },\n  titleKey: {\n    type: String,\n    default: 'title'\n  },\n  statusKey: {\n    type: String,\n    default: 'status'\n  },\n  idKey: {\n    type: String,\n    default: 'id'\n  }\n});\n\nconst emit = defineEmits(['load-more', 'item-click']);\n\n// References\nconst ganttContainer = ref(null);\nconst timelineHeader = ref(null);\n\n// State\nconst months = [\n  'January', 'February', 'March', 'April', 'May', 'June', \n  'July', 'August', 'September', 'October', 'November', 'December'\n];\n\nconst weekdays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\n\nconst viewOptions = [\n  { name: 'Hours',label: 'Hours', value: 'hours' },\n  { name: 'Days',label: 'Days', value: 'days' },\n  { name: 'Weeks',label: 'Weeks', value: 'weeks' }\n];\n\nconst currentView = ref('days');\nconst displayStartDate = ref(new Date(props.startDate));\nconst displayEndDate = ref(new Date(props.endDate));\nconst currentMonth = ref(months[new Date().getMonth()]);\nconst currentYear = ref(new Date().getFullYear());\nconst cellWidth = ref(60); \n\n// Calculate years to display in the dropdown (current year ±5 years)\nconst currentYearValue = new Date().getFullYear();\nconst yearOptions = computed(() => {\n  const years = [];\n  for (let i = currentYearValue - 5; i <= currentYearValue + 5; i++) {\n    years.push(i);\n  }\n  return years;\n});\n\n// Calculate visible dates based on current view (for days view)\nconst visibleDates = computed(() => {\n  const dates = [];\n  const start = new Date(displayStartDate.value);\n  const end = new Date(displayEndDate.value);\n  \n  // For days view\n  for (let current = new Date(start); current <= end; current.setDate(current.getDate() + 1)) {\n    dates.push(new Date(current));\n  }\n  \n  return dates;\n});\n\n// Calculate visible hours for hours view\nconst visibleHours = computed(() => {\n  const hours = [];\n  const start = new Date(displayStartDate.value);\n  const end = new Date(displayEndDate.value);\n  \n  // Set hours to cover a full day (24 hours per day)\n  for (let current = new Date(start); current <= end;) {\n    for (let hour = 0; hour < 24; hour += 2) { // Show every 2 hours to fit more on screen\n      hours.push({\n        date: new Date(current),\n        hour: hour\n      });\n    }\n    current.setDate(current.getDate() + 1);\n  }\n  \n  return hours;\n});\n\n// Calculate visible weeks for weeks view\nconst visibleWeeks = computed(() => {\n  const weeks = [];\n  const start = new Date(displayStartDate.value);\n  const end = new Date(displayEndDate.value);\n  \n  // Start from the beginning of the week\n  const weekStart = new Date(start);\n  weekStart.setDate(start.getDate() - start.getDay()); // Move to Sunday\n  \n  for (let current = new Date(weekStart); current <= end;) {\n    const weekEnd = new Date(current);\n    weekEnd.setDate(current.getDate() + 6); // Saturday\n    \n    weeks.push({\n      start: new Date(current),\n      end: new Date(weekEnd),\n      isMonthStart: current.getDate() <= 7 && current.getDay() === 0\n    });\n    \n    current.setDate(current.getDate() + 7); // Move to next week\n  }\n  \n  return weeks;\n});\n\n// Function to switch between views\nconst switchView = (viewType) => {\n  currentView.value = viewType;\n  \n  // Adjust date range based on the view\n  updateDateRangeForView();\n  \n  // Reset scrolling\n  nextTick(() => {\n    if (ganttContainer.value) {\n      ganttContainer.value.scrollLeft = 0;\n    }\n  });\n};\n\n// Update date range based on selected view\nconst isInitialLoad = ref(true);\nconst updateDateRangeForView = () => {\n  // If it's the initial load and we have props, use those values instead\n  if (isInitialLoad.value) {\n    isInitialLoad.value = false;\n    // Keep the props dates, don't modify them\n    return;\n  }\n\n  const currentDate = new Date(currentYear.value, currentMonth.value, 1);\n  \n  switch (currentView.value) {\n    case 'hours':\n      // For hours, show 3 days centered on the selected date\n      displayStartDate.value = new Date(currentDate);\n      displayEndDate.value = new Date(currentDate);\n      displayEndDate.value.setDate(displayStartDate.value.getDate() + 2);\n      cellWidth.value = 30; // Narrower cells for hours\n      break;\n      \n    case 'days':\n      // For days, show the whole month plus some padding\n      displayStartDate.value = new Date(currentDate);\n      displayEndDate.value = new Date(currentDate);\n      displayEndDate.value.setMonth(displayEndDate.value.getMonth() + 1);\n      displayEndDate.value.setDate(0); // Last day of the month\n      cellWidth.value = 60; // Default cell width for days\n      break;\n      \n    case 'weeks':\n      // For weeks, show around 8 weeks\n      displayStartDate.value = new Date(currentDate);\n      // Move to the start of the first week of the month\n      displayStartDate.value.setDate(1);\n      displayStartDate.value.setDate(displayStartDate.value.getDate() - displayStartDate.value.getDay());\n      \n      displayEndDate.value = new Date(displayStartDate.value);\n      displayEndDate.value.setDate(displayStartDate.value.getDate() + 7 * 8); // 8 weeks\n      cellWidth.value = 140; // Wider cells for weeks\n      break;\n  }\n};\n\n// Watch for changes in month/year to update displayed dates\nwatch([currentMonth, currentYear], () => {\n  updateDateRangeForView();\n});\n\n// Watch for changes in view to adjust the cell width and date range\nwatch(currentView, () => {\n  updateDateRangeForView();\n});\n\n// Navigation functions\n// Добавляем переменные для отслеживания состояния загрузки\n\n\nconst navigatePrevious = () => {\n  switch (currentView.value) {\n    case 'hours':\n      // Navigate back 3 days in hours view\n      displayStartDate.value.setDate(displayStartDate.value.getDate() - 3);\n      displayEndDate.value.setDate(displayEndDate.value.getDate() - 3);\n      updateMonthYearFromDates();\n      break;\n      \n    case 'days':\n      // Navigate back 1 month in days view\n      if (currentMonth.value === 0) {\n        currentMonth.value = 11;\n        currentYear.value--;\n      } else {\n        currentMonth.value--;\n      }\n      break;\n      \n    case 'weeks':\n      // Navigate back 4 weeks in weeks view\n      displayStartDate.value.setDate(displayStartDate.value.getDate() - 28);\n      displayEndDate.value.setDate(displayEndDate.value.getDate() - 28);\n      updateMonthYearFromDates();\n      break;\n  }\n};\n\nconst navigateNext = () => {\n  switch (currentView.value) {\n    case 'hours':\n      // Navigate forward 3 days in hours view\n      displayStartDate.value.setDate(displayStartDate.value.getDate() + 3);\n      displayEndDate.value.setDate(displayEndDate.value.getDate() + 3);\n      updateMonthYearFromDates();\n      break;\n      \n    case 'days':\n      // Navigate forward 1 month in days view\n      if (currentMonth.value === 11) {\n        currentMonth.value = 0;\n        currentYear.value++;\n      } else {\n        currentMonth.value++;\n      }\n      break;\n      \n    case 'weeks':\n      // Navigate forward 4 weeks in weeks view\n      displayStartDate.value.setDate(displayStartDate.value.getDate() + 28);\n      displayEndDate.value.setDate(displayEndDate.value.getDate() + 28);\n      updateMonthYearFromDates();\n      break;\n  }\n};\nconst goToToday = () => {\n  const today = new Date();\n  currentMonth.value = today.getMonth();\n  currentYear.value = today.getFullYear();\n  \n  // Ensure the view updates to show today\n  nextTick(() => {\n    // Center the view on today\n    if (ganttContainer.value) {\n      centerViewOnDate(today);\n    }\n  });\n};\n\nconst centerViewOnDate = (date) => {\n  if (!ganttContainer.value) return;\n  \n  setTimeout(() => {\n    let scrollPos = 0;\n    const clientWidth = ganttContainer.value.clientWidth;\n    \n    if (currentView.value === 'hours') {\n      // For hours view, find the hour that corresponds to the current time\n      const hourIndex = visibleHours.value.findIndex(h => \n        h.date.getDate() === date.getDate() && \n        h.date.getMonth() === date.getMonth() && \n        h.date.getFullYear() === date.getFullYear() &&\n        h.hour === Math.floor(date.getHours() / 2) * 2 // Round to nearest 2-hour slot\n      );\n      \n      if (hourIndex >= 0) {\n        scrollPos = hourIndex * cellWidth.value - clientWidth / 2;\n      }\n    } else if (currentView.value === 'days') {\n      // For days view, find the index of today\n      const dayIndex = visibleDates.value.findIndex(d => \n        d.getDate() === date.getDate() && \n        d.getMonth() === date.getMonth() && \n        d.getFullYear() === date.getFullYear()\n      );\n      \n      if (dayIndex >= 0) {\n        scrollPos = dayIndex * cellWidth.value - clientWidth / 2;\n      }\n    } else if (currentView.value === 'weeks') {\n      // For weeks view, find the index of the week containing today\n      const weekIndex = visibleWeeks.value.findIndex(w => {\n        const weekStart = new Date(w.start);\n        const weekEnd = new Date(w.end);\n        return date >= weekStart && date <= weekEnd;\n      });\n      \n      if (weekIndex >= 0) {\n        scrollPos = weekIndex * cellWidth.value - clientWidth / 2;\n      }\n    }\n    \n    ganttContainer.value.scrollLeft = Math.max(0, scrollPos);\n  }, 100);\n};\n\nconst updateMonthYearFromDates = () => {\n  // Update month/year based on middle date of current view\n  const middleDate = new Date(displayStartDate.value);\n  \n  if (currentView.value === 'weeks') {\n    middleDate.setDate(middleDate.getDate() + 14);\n  } else if (currentView.value === 'hours') {\n    middleDate.setDate(middleDate.getDate() + 1);\n  }\n  \n  currentMonth.value = middleDate.getMonth();\n  currentYear.value = middleDate.getFullYear();\n};\n\n// Date formatting utilities\nconst formatMonth = (date) => {\n  return months[date.getMonth()].substring(0, 3) + ' ' + date.getFullYear();\n};\n\nconst formatDay = (date) => {\n  return weekdays[date.getDay()];\n};\n\nconst formatHour = (hour) => {\n  return `${hour}:00`;\n};\n\nconst formatShortDate = (date) => {\n  return `${date.getDate()}/${date.getMonth() + 1}`;\n};\n\nconst formatDateRange = (start, end) => {\n  return `${start.getDate()}-${end.getDate()}`;\n};\n\nconst getWeekNumber = (date) => {\n  const firstDayOfYear = new Date(date.getFullYear(), 0, 1);\n  const pastDaysOfYear = (date - firstDayOfYear) / 86400000;\n  return Math.ceil((pastDaysOfYear + firstDayOfYear.getDay() + 1) / 7);\n};\n\n// Date checks\nconst isWeekend = (date) => {\n  const day = date.getDay();\n  return day === 0 || day === 6;\n};\n\nconst isToday = (date) => {\n  const today = new Date();\n  return date.getDate() === today.getDate() && \n         date.getMonth() === today.getMonth() && \n         date.getFullYear() === today.getFullYear();\n};\n\nconst isCurrentHour = (date, hour) => {\n  const now = new Date();\n  return isToday(date) && now.getHours() === hour;\n};\n\nconst isCurrentWeek = (weekStart) => {\n  const today = new Date();\n  const weekEnd = new Date(weekStart);\n  weekEnd.setDate(weekStart.getDate() + 6);\n  \n  return today >= weekStart && today <= weekEnd;\n};\n\n// Item data retrieval\nconst getItemTitle = (item) => {\n  // If using the product field from your data\n  if (item.productDetails && item.productDetails.name) {\n    return item.productDetails.name;\n  }\n  \n  // Fallback to the standard title property\n  return item[props.titleKey] || 'Unnamed Item';\n};\n\nconst getStatusClass = (item) => {\n  // If it's a group object\n  if (item.status) {\n    return `status-${item.status.toLowerCase()}`;\n  }\n  \n  // If it's an individual item\n  const status = item[props.statusKey] || 'default';\n  return `status-${status.toLowerCase()}`;\n};\n\nconst getBarStatusClass = (item) => {\n  const status = item[props.statusKey] || 'default';\n  return `gantt-bar-${status.toLowerCase()}`;\n};\n\n// Calculate bar positions for each item\n// Add this computed property to group items by product name\nconst groupedItems = computed(() => {\n  const groups = {};\n  \n  props.items.forEach(item => {\n    const title = getItemTitle(item);\n    if (!groups[title]) {\n      groups[title] = {\n        title,\n        items: [],\n        status: item[props.statusKey] || 'default' // Use the status from the first item with this title\n      };\n    }\n    groups[title].items.push(item);\n  });\n  \n  return Object.values(groups);\n});\n\nconst organizeBarsIntoRows = (bars) => {\n  if (!bars.length) return [];\n  \n  // Sort bars by start date\n  bars.sort((a, b) => a.start - b.start);\n  \n  const rows = [];\n  \n  // Place each bar in the first row where it doesn't overlap\n  bars.forEach(bar => {\n    let rowIndex = 0;\n    let placed = false;\n    \n    while (!placed) {\n      if (!rows[rowIndex]) {\n        rows[rowIndex] = [];\n        rows[rowIndex].push({...bar, rowIndex});\n        placed = true;\n      } else {\n        // Check if this bar overlaps with any bar in this row\n        const overlaps = rows[rowIndex].some(existingBar => {\n          return (\n            (bar.start <= existingBar.end && bar.end >= existingBar.start)\n          );\n        });\n        \n        if (!overlaps) {\n          rows[rowIndex].push({...bar, rowIndex});\n          placed = true;\n        } else {\n          rowIndex++;\n        }\n      }\n    }\n  });\n  \n  // Flatten the rows into a single array\n  return rows.flat();\n};\n\n// Replace the current getItemBars function with this updated version\nconst getItemBars = (groupData) => {\n  const bars = [];\n  \n  // Process all items in the group\n  groupData.items.forEach(item => {\n    const startDateStr = item[props.startDateKey];\n    const endDateStr = item[props.endDateKey];\n    \n    if (!startDateStr || !endDateStr) return;\n    \n    // Parse dates (handle both ISO strings and Date objects)\n    let startDate = startDateStr instanceof Date ? new Date(startDateStr) : new Date(startDateStr);\n    let endDate = endDateStr instanceof Date ? new Date(endDateStr) : new Date(endDateStr);\n    \n    // Check if dates are valid\n    if (isNaN(startDate.getTime()) || isNaN(endDate.getTime())) return;\n    \n    // Fix dates if endDate is before startDate\n    if (endDate < startDate) {\n      [startDate, endDate] = [endDate, startDate];\n    }\n    \n    // Check if item is within visible range\n    if (endDate < displayStartDate.value || startDate > displayEndDate.value) return;\n    \n    let left, width;\n    \n    // Calculate position and width based on the current view\n    if (currentView.value === 'hours') {\n      const hourMilliseconds = 60 * 60 * 1000;\n      const firstVisibleDate = new Date(visibleHours.value[0].date);\n      firstVisibleDate.setHours(visibleHours.value[0].hour, 0, 0, 0);\n      \n      // Clamp dates to visible range\n      const visibleStartDate = startDate < displayStartDate.value ? displayStartDate.value : startDate;\n      const visibleEndDate = endDate > displayEndDate.value ? displayEndDate.value : endDate;\n      \n      // Calculate hours difference (for 2-hour slots)\n      const startHoursDiff = Math.max(0, (visibleStartDate - firstVisibleDate) / hourMilliseconds) / 2;\n      const endHoursDiff = Math.max(0, (visibleEndDate - firstVisibleDate) / hourMilliseconds) / 2;\n      \n      left = startHoursDiff * cellWidth.value;\n      width = Math.max((endHoursDiff - startHoursDiff) * cellWidth.value, cellWidth.value);\n    } \n    else if (currentView.value === 'days') {\n      const dayMilliseconds = 24 * 60 * 60 * 1000;\n      const firstVisibleDate = new Date(visibleDates.value[0]);\n      firstVisibleDate.setHours(0, 0, 0, 0);\n      \n      // Clamp dates to visible range\n      const visibleStartDate = startDate < displayStartDate.value ? displayStartDate.value : startDate;\n      const visibleEndDate = endDate > displayEndDate.value ? displayEndDate.value : endDate;\n      \n      const startDaysDiff = Math.max(0, Math.floor((visibleStartDate - firstVisibleDate) / dayMilliseconds));\n      const endDaysDiff = Math.max(0, Math.floor((visibleEndDate - firstVisibleDate) / dayMilliseconds));\n      \n      left = startDaysDiff * cellWidth.value;\n      width = Math.max((endDaysDiff - startDaysDiff + 1) * cellWidth.value, cellWidth.value);\n    }\n    else if (currentView.value === 'weeks') {\n      const dayMilliseconds = 24 * 60 * 60 * 1000;\n      const firstVisibleWeekStart = new Date(visibleWeeks.value[0].start);\n      \n      // Clamp dates to visible range\n      const visibleStartDate = startDate < displayStartDate.value ? displayStartDate.value : startDate;\n      const visibleEndDate = endDate > displayEndDate.value ? displayEndDate.value : endDate;\n      \n      // Calculate week index\n      const startWeekIndex = Math.floor((visibleStartDate - firstVisibleWeekStart) / (7 * dayMilliseconds));\n      const endWeekIndex = Math.floor((visibleEndDate - firstVisibleWeekStart) / (7 * dayMilliseconds));\n      \n      left = startWeekIndex * cellWidth.value;\n      width = Math.max((endWeekIndex - startWeekIndex + 1) * cellWidth.value, cellWidth.value);\n    }\n    \n    bars.push({\n      item,\n      start: startDate,\n      end: endDate,\n      left,\n      width\n    });\n  });\n  \n  // Organize bars into rows to prevent overlapping\n  return organizeBarsIntoRows(bars);\n};\n\n// Add a new CSS variable for the height of each bar\nconst rowHeight = ref(22); // Height in pixels for each bar\n\n// Scroll handling for infinite loading\nlet isLoadingLeft = false;\nlet isLoadingRight = false;\nlet scrollThrottle = null;\n\nconst handleScroll = () => {\n  if (!ganttContainer.value) return;\n  \n  // Отменяем предыдущий отложенный вызов, если он есть\n  if (scrollThrottle) {\n    clearTimeout(scrollThrottle);\n  }\n  \n  // Используем throttle для ограничения частоты вызовов\n  scrollThrottle = setTimeout(() => {\n    const container = ganttContainer.value;\n    const scrollLeft = container.scrollLeft;\n    const scrollWidth = container.scrollWidth;\n    const clientWidth = container.clientWidth;\n    \n    // Sync timeline header with body scroll\n    if (timelineHeader.value) {\n      // timelineHeader.value.style.transform = `translateX(-${scrollLeft}px)`;\n    }\n    \n    // Load more data when scrolling near the edges\n    if (scrollLeft < 10 && !isLoadingLeft) {\n      // Near left edge, load earlier dates\n      isLoadingLeft = true;\n      \n      let newStartDate;\n      \n      if (currentView.value === 'hours') {\n        newStartDate = new Date(displayStartDate.value);\n        newStartDate.setDate(newStartDate.getDate() - 3);\n      } else if (currentView.value === 'days') {\n        newStartDate = new Date(displayStartDate.value);\n        newStartDate.setMonth(newStartDate.getMonth() - 1);\n      } else if (currentView.value === 'weeks') {\n        newStartDate = new Date(displayStartDate.value);\n        newStartDate.setDate(newStartDate.getDate() - 28);\n      }\n      \n      // navigatePrevious();\n      emit('load-more', { direction: 'backward', date: newStartDate });\n      \n      // Сбросить флаг загрузки после задержки\n      setTimeout(() => {\n        isLoadingLeft = false;\n      }, 500); // Предотвращаем повторную загрузку в течение 500 мс\n      \n    } else if (scrollWidth - (scrollLeft + clientWidth) < 10 && !isLoadingRight) {\n      // Near right edge, load later dates\n      isLoadingRight = true;\n      \n      let newEndDate;\n      \n      if (currentView.value === 'hours') {\n        newEndDate = new Date(displayEndDate.value);\n        newEndDate.setDate(newEndDate.getDate() + 3);\n      } else if (currentView.value === 'days') {\n        newEndDate = new Date(displayEndDate.value);\n        newEndDate.setMonth(newEndDate.getMonth() + 1);\n      } else if (currentView.value === 'weeks') {\n        newEndDate = new Date(displayEndDate.value);\n        newEndDate.setDate(newEndDate.getDate() + 28);\n      }\n      \n      // navigateNext();\n      emit('load-more', { direction: 'forward', date: newEndDate });\n      \n      // Сбросить флаг загрузки после задержки\n      setTimeout(() => {\n        isLoadingRight = false;\n      }, 500); // Предотвращаем повторную загрузку в течение 500 мс\n    }\n  }, 100); // Задержка в 100 мс перед обработкой скролла\n};\n\n// Initialize component\nonMounted(() => {\n  // Set initial view\n  switchView('days');\n  \n  // Center timeline on current month\n  goToToday();\n  \n  // Set initial scroll position to today\n  nextTick(() => {\n    if (ganttContainer.value) {\n      const today = new Date();\n      centerViewOnDate(today);\n    }\n  });\n});\n</script>\n\n<style scoped>\n.gantt-chart-container {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  font-size: 14px;\n}\n\n\n.gantt-chart {\n  position: relative;\n  height: 500px;\n  overflow: auto;\n  border: 1px solid #eee;\n}\n\n.gantt-header {\n  position: sticky;\n  top: 0;\n  z-index: 2;\n/*  background-color: #f8f9fa;*/\n/*  box-shadow: 0 2px 4px rgba(0,0,0,0.05);*/\n}\n\n.gantt-header-row {\n  display: flex;\n  position: relative;\n}\n\n.gantt-timeline-header {\n  display: flex;\n  position: sticky;\n  left: 200px;\n}\n\n.product-column {\n  width: 200px;\n  min-width: 200px;\n  position: sticky;\n  left: 0;\n/*  z-index: 1;*/\n  background-color: #f8f9fa;\n  border-right: 1px solid #eee;\n  padding: 8px;\n}\n\n.gantt-header-cell {\n  min-width: var(--cell-width, 60px);\n  width: var(--cell-width, 60px);\n  border-right: 1px solid #eee;\n  text-align: center;\n  padding: 8px 4px;\n  overflow: hidden;\n}\n\n.gantt-header-cell.is-weekend {\n  background-color: #f1f3f5;\n}\n\n.gantt-header-cell.is-today {\n  background-color: #e3f2fd;\n}\n\n.gantt-header-cell.is-month-start {\n  border-left: 2px solid #adb5bd;\n}\n\n.date-label {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n\n.month-label {\n  font-weight: bold;\n  font-size: 12px;\n  width: 100%;\n}\n\n.day-number {\n  font-weight: bold;\n  font-size: 16px;\n}\n\n.day-name {\n  font-size: 12px;\n  color: #6c757d;\n}\n\n.gantt-body {\n  position: relative;\n}\n\n.gantt-row {\n  display: flex;\n  border-bottom: 1px solid #eee;\n}\n\n\n\n.gantt-row.is-even .gantt-timeline-row {\n   background-color: #f8f9fa;\n}\n\n.gantt-row-item {\n  padding: 8px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n\n.product-title {\n  font-weight: bold;\n  margin-bottom: 4px;\n  text-wrap-mode: nowrap;\n  width: 100%;\n  overflow: hidden;\n}\n\n.product-status {\n  font-size: 12px;\n  padding: 2px 6px;\n  border-radius: 4px;\n  display: inline-block;\n}\n\n.status-active {\n  background-color: #d1e7dd;\n  color: #0f5132;\n}\n\n.status-completed {\n  background-color: #cff4fc;\n  color: #055160;\n}\n\n.status-canceled {\n  background-color: #f8d7da;\n  color: #842029;\n}\n\n.status-default {\n  background-color: #e2e3e5;\n  color: #41464b;\n}\n\n.gantt-timeline-row {\n  display: flex;\n  position: relative;\n  height: 60px;\n  flex-grow: 1;\n}\n\n.gantt-cell {\n  min-width: var(--cell-width, 60px);\n  width: var(--cell-width, 60px);\n  border-right: 1px solid #eee;\n  height: 100%;\n}\n\n.gantt-cell.is-weekend {\n  background-color: #f1f3f5;\n}\n\n.gantt-cell.is-today {\n  background-color: #e3f2fd;\n}\n\n.gantt-bar {\n  position: absolute;\n  height: 40px;\n  top: 10px;\n  border-radius: 4px;\n  background-color: #4dabf7;\n  color: white;\n  cursor: pointer;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  padding: 4px 8px;\n  box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n  transition: box-shadow 0.2s, transform 0.1s;\n}\n\n.gantt-bar:hover {\n  box-shadow: 0 4px 8px rgba(0,0,0,0.15);\n  transform: translateY(-2px);\n}\n\n.gantt-bar-active {\n  background-color: #4dabf7;\n}\n\n.gantt-bar-completed {\n  background-color: #20c997;\n}\n\n.gantt-bar-canceled {\n  background-color: #fa5252;\n  text-decoration: line-through;\n}\n\n.gantt-bar-label {\n  font-size: 12px;\n  font-weight: bold;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.view-controls button, \n.date-controls button,\n.date-controls select {\n  border: 1px solid #dee2e6;\n  background-color: white;\n  cursor: pointer;\n  transition: background-color 0.2s;\n}\n\n.view-controls button:hover, \n.date-controls button:hover,\n.date-controls select:hover {\n  background-color: #e9ecef;\n}\n\n.flex-v-center {\n  display: flex;\n  align-items: center;\n}\n\n/* Set cell width based on current view */\n:root {\n  --cell-width: v-bind('cellWidth.value + \"px\"');\n}\n</style>"],"names":[],"mappings":"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"}

package/dist/martyrs/src/modules/rents/views/components/pages/Rents.vue.cjs

@@ -0,0 +1,117 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const Tab = require("../../../../../components/Tab/Tab.vue.cjs");
+const Feed = require("../../../../../components/Feed/Feed.vue.cjs");
+;/* empty css                        */
+const GanttChart = require("./GanttChart.vue.cjs");
+const vueRouter = require("vue-router");
+const rents_store = require("../../store/rents.store.cjs");
+const _hoisted_1 = { class: "pd-medium mobile:pd-thin bg-white" };
+const _hoisted_2 = { class: "mn-b-medium flex-v-center flex-nowrap flex" };
+const _hoisted_3 = { class: "mn-l-auto flex-v-center" };
+const _sfc_main = {
+  __name: "Rents",
+  setup(__props) {
+    const route = vueRouter.useRoute();
+    const router = vueRouter.useRouter();
+    const tab = vue.ref((route == null ? void 0 : route.query) ? route.query.tab : "all");
+    const isCalendarView = vue.ref(true);
+    const today = /* @__PURE__ */ new Date();
+    const calendarStartDate = vue.ref(new Date(today));
+    calendarStartDate.value.setDate(today.getDate() - 30);
+    const calendarEndDate = vue.ref(new Date(today));
+    calendarEndDate.value.setDate(today.getDate() + 30);
+    const toggleView = () => {
+      isCalendarView.value = !isCalendarView.value;
+    };
+    const viewRentDetails = (rent) => {
+      router.push({ name: "Rent Details", params: { _id: rent._id } });
+    };
+    const loadMoreData = async ({ direction, date }) => {
+      console.log("scroll direction is", direction);
+      console.log("current date is", date);
+      if (direction === "forward") {
+        calendarEndDate.value = date;
+      } else {
+        calendarStartDate.value = date;
+      }
+      try {
+        const startDateParam = new Date(calendarStartDate.value);
+        startDateParam.setDate(startDateParam.getDate() - 30);
+        const endDateParam = new Date(calendarEndDate.value);
+        endDateParam.setDate(endDateParam.getDate() + 30);
+        await rents_store.actions.read({
+          owner: route.params._id,
+          startDate: startDateParam.toISOString(),
+          endDate: endDateParam.toISOString(),
+          ...tab.value !== "all" && { status: tab.value }
+        });
+      } catch (error) {
+        console.error("Error loading additional rent data:", error);
+      }
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("header", _hoisted_2, [
+          _cache[2] || (_cache[2] = vue.createElementVNode("h2", { class: "mn-r-medium" }, "Rents", -1)),
+          vue.createElementVNode("button", {
+            onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$router.push({ name: "Organization_Create Rent", params: { _id: vue.unref(route).params._id } })),
+            class: "radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second"
+          }, " + "),
+          vue.createElementVNode("div", _hoisted_3, [
+            vue.createElementVNode("button", {
+              onClick: toggleView,
+              class: "pd-small radius-small bg-light mn-r-small"
+            }, vue.toDisplayString(isCalendarView.value ? "List View" : "Calendar View"), 1)
+          ])
+        ]),
+        vue.createVNode(Tab.default, {
+          selected: tab.value,
+          "onUpdate:selected": _cache[1] || (_cache[1] = ($event) => tab.value = $event),
+          tabs: [
+            { name: "All", value: "all" },
+            { name: "Active", value: "active" },
+            { name: "Completed", value: "completed" },
+            { name: "Canceled", value: "canceled" }
+          ],
+          class: "mn-b-small o-hidden h5 radius-big bg-light"
+        }, null, 8, ["selected"]),
+        vue.createVNode(Feed.default, {
+          search: true,
+          states: {
+            empty: {
+              title: "No Rents Found",
+              description: "Currently, there are no rents available."
+            }
+          },
+          store: { read: (options) => rents_store.actions.read(options) },
+          options: {
+            limit: 15,
+            owner: vue.unref(route).params._id,
+            ...tab.value !== "all" && { status: tab.value }
+          }
+        }, {
+          default: vue.withCtx(({ items }) => [
+            vue.createVNode(GanttChart.default, {
+              items,
+              startDate: calendarStartDate.value,
+              endDate: calendarEndDate.value,
+              startDateKey: "startDate",
+              endDateKey: "endDate",
+              titleKey: "title",
+              statusKey: "status",
+              idKey: "_id",
+              class: "mn-b-small",
+              onItemClick: viewRentDetails,
+              onLoadMore: loadMoreData
+            }, null, 8, ["items", "startDate", "endDate"])
+          ]),
+          _: 1
+        }, 8, ["store", "options"])
+      ]);
+    };
+  }
+};
+exports.default = _sfc_main;
+//# sourceMappingURL=Rents.vue.cjs.map

package/dist/martyrs/src/modules/rents/views/components/pages/Rents.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Rents.vue.cjs","sources":["../../../../../../../../src/modules/rents/views/components/pages/Rents.vue"],"sourcesContent":["<template>\n  <div class=\"pd-medium mobile:pd-thin bg-white\">\n    <header class=\"mn-b-medium flex-v-center flex-nowrap flex\">\n      <h2 class=\"mn-r-medium\">Rents</h2>\n      <button \n        @click=\"$router.push({ name: 'Organization_Create Rent', params: {_id: route.params._id}})\" \n        class=\"radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second\"\n      >\n        +\n      </button>\n      <div class=\"mn-l-auto flex-v-center\">\n        <button \n          @click=\"toggleView\" \n          class=\"pd-small radius-small bg-light mn-r-small\"\n        >\n          {{ isCalendarView ? 'List View' : 'Calendar View' }}\n        </button>\n      </div>\n    </header>\n\n    <Tab\n      v-model:selected=\"tab\"\n      :tabs=\"[\n        { name: 'All', value: 'all' },\n        { name: 'Active', value: 'active' },\n        { name: 'Completed', value: 'completed' },\n        { name: 'Canceled', value: 'canceled' }\n      ]\"\n      class=\"mn-b-small o-hidden h5 radius-big bg-light\"\n    />\n\n    <Feed\n      :search=\"true\"\n      :states=\"{\n        empty: {\n          title: 'No Rents Found',\n          description: 'Currently, there are no rents available.'\n        }\n      }\"\n      :store=\"{ read: (options) => rents.actions.read(options) }\"\n      :options=\"{\n        limit: 15,\n        owner: route.params._id,\n        ...(tab !== 'all' && { status: tab })\n      }\"\n      v-slot=\"{ items }\"\n    >\n      <GanttChart\n        :items=\"items\"\n        :startDate=\"calendarStartDate\"\n        :endDate=\"calendarEndDate\"\n        startDateKey=\"startDate\"\n        endDateKey=\"endDate\"\n        titleKey=\"title\"\n        statusKey=\"status\"\n        idKey=\"_id\"\n        class=\"mn-b-small\"\n        @item-click=\"viewRentDetails\"\n        @load-more=\"loadMoreData\"\n      >\n      </GanttChart>\n\n     <!--  <CardRent\n        v-else\n        v-for=\"rent in items\"\n        :key=\"rent._id\"\n        :rent=\"rent\"\n        class=\"bg-light pd-small mn-b-thin radius-small\"\n      /> -->\n    </Feed>\n  </div>\n</template>\n\n<script setup>\nimport Tab from '@martyrs/src/components/Tab/Tab.vue';\nimport Feed from '@martyrs/src/components/Feed/Feed.vue';\n\nimport CardRent from '@martyrs/src/modules/rents/views/components/blocks/CardRent.vue';\nimport GanttChart from '@martyrs/src/modules/rents/views/components/pages/GanttChart.vue';\n\nimport { computed, onMounted, ref, watch } from 'vue';\nimport { useRoute, useRouter } from 'vue-router';\n\nimport * as rents from '@martyrs/src/modules/rents/views/store/rents.store';\n\nconst route = useRoute();\nconst router = useRouter();\n\nconst tab = ref(route?.query ? route.query.tab : 'all');\nconst isCalendarView = ref(true);\n\n// Set initial date range - current month plus 15 days before and 45 days after\nconst today = new Date();\nconst calendarStartDate = ref(new Date(today));\ncalendarStartDate.value.setDate(today.getDate() - 30);\n\nconst calendarEndDate = ref(new Date(today));\ncalendarEndDate.value.setDate(today.getDate() + 30);\n\n// Toggle between calendar and list view\nconst toggleView = () => {\n  isCalendarView.value = !isCalendarView.value;\n};\n\n// Navigate to rent details page\nconst viewRentDetails = (rent) => {\n  router.push({ name: 'Rent Details', params: { _id: rent._id } });\n};\n\n// Load more data when scrolling the Gantt chart\nconst loadMoreData = async ({ direction, date }) => {\n  // alert(direction)\n  console.log('scroll direction is', direction)\n  console.log('current date is', date)\n  // Update the visible range\n  if (direction === 'forward') {\n    calendarEndDate.value = date;\n  } else {\n    calendarStartDate.value = date;\n  }\n  // Here you can add logic to fetch more rents if they fall within the new date range\n  try {\n    // You might need to adjust this depending on your API and data structure\n    const startDateParam = new Date(calendarStartDate.value);\n    startDateParam.setDate(startDateParam.getDate() - 30); // Fetch a bit more to cover edge cases\n    \n    const endDateParam = new Date(calendarEndDate.value);\n    endDateParam.setDate(endDateParam.getDate() + 30);\n    \n    await rents.actions.read({\n      owner: route.params._id,\n      startDate: startDateParam.toISOString(),\n      endDate: endDateParam.toISOString(),\n      ...(tab.value !== 'all' && { status: tab.value })\n    });\n  } catch (error) {\n    console.error('Error loading additional rent data:', error);\n  }\n};\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":["useRoute","useRouter","ref","rents.actions"],"mappings":";;;;;;;;;;;;;;;AAqFA,UAAM,QAAQA,UAAAA,SAAU;AACxB,UAAM,SAASC,UAAAA,UAAW;AAE1B,UAAM,MAAMC,IAAG,KAAC,+BAAO,SAAQ,MAAM,MAAM,MAAM,KAAK;AACtD,UAAM,iBAAiBA,IAAG,IAAC,IAAI;AAG/B,UAAM,QAAQ,oBAAI,KAAM;AACxB,UAAM,oBAAoBA,IAAG,IAAC,IAAI,KAAK,KAAK,CAAC;AAC7C,sBAAkB,MAAM,QAAQ,MAAM,QAAO,IAAK,EAAE;AAEpD,UAAM,kBAAkBA,IAAG,IAAC,IAAI,KAAK,KAAK,CAAC;AAC3C,oBAAgB,MAAM,QAAQ,MAAM,QAAO,IAAK,EAAE;AAGlD,UAAM,aAAa,MAAM;AACvB,qBAAe,QAAQ,CAAC,eAAe;AAAA,IACzC;AAGA,UAAM,kBAAkB,CAAC,SAAS;AAChC,aAAO,KAAK,EAAE,MAAM,gBAAgB,QAAQ,EAAE,KAAK,KAAK,IAAG,GAAI;AAAA,IACjE;AAGA,UAAM,eAAe,OAAO,EAAE,WAAW,WAAW;AAElD,cAAQ,IAAI,uBAAuB,SAAS;AAC5C,cAAQ,IAAI,mBAAmB,IAAI;AAEnC,UAAI,cAAc,WAAW;AAC3B,wBAAgB,QAAQ;AAAA,MAC5B,OAAS;AACL,0BAAkB,QAAQ;AAAA,MAC9B;AAEE,UAAI;AAEF,cAAM,iBAAiB,IAAI,KAAK,kBAAkB,KAAK;AACvD,uBAAe,QAAQ,eAAe,QAAS,IAAG,EAAE;AAEpD,cAAM,eAAe,IAAI,KAAK,gBAAgB,KAAK;AACnD,qBAAa,QAAQ,aAAa,QAAO,IAAK,EAAE;AAEhD,cAAMC,YAAAA,QAAc,KAAK;AAAA,UACvB,OAAO,MAAM,OAAO;AAAA,UACpB,WAAW,eAAe,YAAa;AAAA,UACvC,SAAS,aAAa,YAAa;AAAA,UACnC,GAAI,IAAI,UAAU,SAAS,EAAE,QAAQ,IAAI,MAAO;AAAA,QACtD,CAAK;AAAA,MACF,SAAQ,OAAO;AACd,gBAAQ,MAAM,uCAAuC,KAAK;AAAA,MAC9D;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/rents/views/components/pages/Rents.vue.js

@@ -0,0 +1,117 @@
+import { ref, createElementBlock, openBlock, createElementVNode, createVNode, unref, toDisplayString, withCtx } from "vue";
+import _sfc_main$1 from "../../../../../components/Tab/Tab.vue.js";
+import _sfc_main$2 from "../../../../../components/Feed/Feed.vue.js";
+/* empty css                      */
+import GanttChart from "./GanttChart.vue.js";
+import { useRoute, useRouter } from "vue-router";
+import { actions } from "../../store/rents.store.js";
+const _hoisted_1 = { class: "pd-medium mobile:pd-thin bg-white" };
+const _hoisted_2 = { class: "mn-b-medium flex-v-center flex-nowrap flex" };
+const _hoisted_3 = { class: "mn-l-auto flex-v-center" };
+const _sfc_main = {
+  __name: "Rents",
+  setup(__props) {
+    const route = useRoute();
+    const router = useRouter();
+    const tab = ref((route == null ? void 0 : route.query) ? route.query.tab : "all");
+    const isCalendarView = ref(true);
+    const today = /* @__PURE__ */ new Date();
+    const calendarStartDate = ref(new Date(today));
+    calendarStartDate.value.setDate(today.getDate() - 30);
+    const calendarEndDate = ref(new Date(today));
+    calendarEndDate.value.setDate(today.getDate() + 30);
+    const toggleView = () => {
+      isCalendarView.value = !isCalendarView.value;
+    };
+    const viewRentDetails = (rent) => {
+      router.push({ name: "Rent Details", params: { _id: rent._id } });
+    };
+    const loadMoreData = async ({ direction, date }) => {
+      console.log("scroll direction is", direction);
+      console.log("current date is", date);
+      if (direction === "forward") {
+        calendarEndDate.value = date;
+      } else {
+        calendarStartDate.value = date;
+      }
+      try {
+        const startDateParam = new Date(calendarStartDate.value);
+        startDateParam.setDate(startDateParam.getDate() - 30);
+        const endDateParam = new Date(calendarEndDate.value);
+        endDateParam.setDate(endDateParam.getDate() + 30);
+        await actions.read({
+          owner: route.params._id,
+          startDate: startDateParam.toISOString(),
+          endDate: endDateParam.toISOString(),
+          ...tab.value !== "all" && { status: tab.value }
+        });
+      } catch (error) {
+        console.error("Error loading additional rent data:", error);
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("header", _hoisted_2, [
+          _cache[2] || (_cache[2] = createElementVNode("h2", { class: "mn-r-medium" }, "Rents", -1)),
+          createElementVNode("button", {
+            onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$router.push({ name: "Organization_Create Rent", params: { _id: unref(route).params._id } })),
+            class: "radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second"
+          }, " + "),
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode("button", {
+              onClick: toggleView,
+              class: "pd-small radius-small bg-light mn-r-small"
+            }, toDisplayString(isCalendarView.value ? "List View" : "Calendar View"), 1)
+          ])
+        ]),
+        createVNode(_sfc_main$1, {
+          selected: tab.value,
+          "onUpdate:selected": _cache[1] || (_cache[1] = ($event) => tab.value = $event),
+          tabs: [
+            { name: "All", value: "all" },
+            { name: "Active", value: "active" },
+            { name: "Completed", value: "completed" },
+            { name: "Canceled", value: "canceled" }
+          ],
+          class: "mn-b-small o-hidden h5 radius-big bg-light"
+        }, null, 8, ["selected"]),
+        createVNode(_sfc_main$2, {
+          search: true,
+          states: {
+            empty: {
+              title: "No Rents Found",
+              description: "Currently, there are no rents available."
+            }
+          },
+          store: { read: (options) => actions.read(options) },
+          options: {
+            limit: 15,
+            owner: unref(route).params._id,
+            ...tab.value !== "all" && { status: tab.value }
+          }
+        }, {
+          default: withCtx(({ items }) => [
+            createVNode(GanttChart, {
+              items,
+              startDate: calendarStartDate.value,
+              endDate: calendarEndDate.value,
+              startDateKey: "startDate",
+              endDateKey: "endDate",
+              titleKey: "title",
+              statusKey: "status",
+              idKey: "_id",
+              class: "mn-b-small",
+              onItemClick: viewRentDetails,
+              onLoadMore: loadMoreData
+            }, null, 8, ["items", "startDate", "endDate"])
+          ]),
+          _: 1
+        }, 8, ["store", "options"])
+      ]);
+    };
+  }
+};
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=Rents.vue.js.map

package/dist/martyrs/src/modules/rents/views/components/pages/Rents.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Rents.vue.js","sources":["../../../../../../../../src/modules/rents/views/components/pages/Rents.vue"],"sourcesContent":["<template>\n  <div class=\"pd-medium mobile:pd-thin bg-white\">\n    <header class=\"mn-b-medium flex-v-center flex-nowrap flex\">\n      <h2 class=\"mn-r-medium\">Rents</h2>\n      <button \n        @click=\"$router.push({ name: 'Organization_Create Rent', params: {_id: route.params._id}})\" \n        class=\"radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second\"\n      >\n        +\n      </button>\n      <div class=\"mn-l-auto flex-v-center\">\n        <button \n          @click=\"toggleView\" \n          class=\"pd-small radius-small bg-light mn-r-small\"\n        >\n          {{ isCalendarView ? 'List View' : 'Calendar View' }}\n        </button>\n      </div>\n    </header>\n\n    <Tab\n      v-model:selected=\"tab\"\n      :tabs=\"[\n        { name: 'All', value: 'all' },\n        { name: 'Active', value: 'active' },\n        { name: 'Completed', value: 'completed' },\n        { name: 'Canceled', value: 'canceled' }\n      ]\"\n      class=\"mn-b-small o-hidden h5 radius-big bg-light\"\n    />\n\n    <Feed\n      :search=\"true\"\n      :states=\"{\n        empty: {\n          title: 'No Rents Found',\n          description: 'Currently, there are no rents available.'\n        }\n      }\"\n      :store=\"{ read: (options) => rents.actions.read(options) }\"\n      :options=\"{\n        limit: 15,\n        owner: route.params._id,\n        ...(tab !== 'all' && { status: tab })\n      }\"\n      v-slot=\"{ items }\"\n    >\n      <GanttChart\n        :items=\"items\"\n        :startDate=\"calendarStartDate\"\n        :endDate=\"calendarEndDate\"\n        startDateKey=\"startDate\"\n        endDateKey=\"endDate\"\n        titleKey=\"title\"\n        statusKey=\"status\"\n        idKey=\"_id\"\n        class=\"mn-b-small\"\n        @item-click=\"viewRentDetails\"\n        @load-more=\"loadMoreData\"\n      >\n      </GanttChart>\n\n     <!--  <CardRent\n        v-else\n        v-for=\"rent in items\"\n        :key=\"rent._id\"\n        :rent=\"rent\"\n        class=\"bg-light pd-small mn-b-thin radius-small\"\n      /> -->\n    </Feed>\n  </div>\n</template>\n\n<script setup>\nimport Tab from '@martyrs/src/components/Tab/Tab.vue';\nimport Feed from '@martyrs/src/components/Feed/Feed.vue';\n\nimport CardRent from '@martyrs/src/modules/rents/views/components/blocks/CardRent.vue';\nimport GanttChart from '@martyrs/src/modules/rents/views/components/pages/GanttChart.vue';\n\nimport { computed, onMounted, ref, watch } from 'vue';\nimport { useRoute, useRouter } from 'vue-router';\n\nimport * as rents from '@martyrs/src/modules/rents/views/store/rents.store';\n\nconst route = useRoute();\nconst router = useRouter();\n\nconst tab = ref(route?.query ? route.query.tab : 'all');\nconst isCalendarView = ref(true);\n\n// Set initial date range - current month plus 15 days before and 45 days after\nconst today = new Date();\nconst calendarStartDate = ref(new Date(today));\ncalendarStartDate.value.setDate(today.getDate() - 30);\n\nconst calendarEndDate = ref(new Date(today));\ncalendarEndDate.value.setDate(today.getDate() + 30);\n\n// Toggle between calendar and list view\nconst toggleView = () => {\n  isCalendarView.value = !isCalendarView.value;\n};\n\n// Navigate to rent details page\nconst viewRentDetails = (rent) => {\n  router.push({ name: 'Rent Details', params: { _id: rent._id } });\n};\n\n// Load more data when scrolling the Gantt chart\nconst loadMoreData = async ({ direction, date }) => {\n  // alert(direction)\n  console.log('scroll direction is', direction)\n  console.log('current date is', date)\n  // Update the visible range\n  if (direction === 'forward') {\n    calendarEndDate.value = date;\n  } else {\n    calendarStartDate.value = date;\n  }\n  // Here you can add logic to fetch more rents if they fall within the new date range\n  try {\n    // You might need to adjust this depending on your API and data structure\n    const startDateParam = new Date(calendarStartDate.value);\n    startDateParam.setDate(startDateParam.getDate() - 30); // Fetch a bit more to cover edge cases\n    \n    const endDateParam = new Date(calendarEndDate.value);\n    endDateParam.setDate(endDateParam.getDate() + 30);\n    \n    await rents.actions.read({\n      owner: route.params._id,\n      startDate: startDateParam.toISOString(),\n      endDate: endDateParam.toISOString(),\n      ...(tab.value !== 'all' && { status: tab.value })\n    });\n  } catch (error) {\n    console.error('Error loading additional rent data:', error);\n  }\n};\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":["rents.actions"],"mappings":";;;;;;;;;;;;;AAqFA,UAAM,QAAQ,SAAU;AACxB,UAAM,SAAS,UAAW;AAE1B,UAAM,MAAM,KAAI,+BAAO,SAAQ,MAAM,MAAM,MAAM,KAAK;AACtD,UAAM,iBAAiB,IAAI,IAAI;AAG/B,UAAM,QAAQ,oBAAI,KAAM;AACxB,UAAM,oBAAoB,IAAI,IAAI,KAAK,KAAK,CAAC;AAC7C,sBAAkB,MAAM,QAAQ,MAAM,QAAO,IAAK,EAAE;AAEpD,UAAM,kBAAkB,IAAI,IAAI,KAAK,KAAK,CAAC;AAC3C,oBAAgB,MAAM,QAAQ,MAAM,QAAO,IAAK,EAAE;AAGlD,UAAM,aAAa,MAAM;AACvB,qBAAe,QAAQ,CAAC,eAAe;AAAA,IACzC;AAGA,UAAM,kBAAkB,CAAC,SAAS;AAChC,aAAO,KAAK,EAAE,MAAM,gBAAgB,QAAQ,EAAE,KAAK,KAAK,IAAG,GAAI;AAAA,IACjE;AAGA,UAAM,eAAe,OAAO,EAAE,WAAW,WAAW;AAElD,cAAQ,IAAI,uBAAuB,SAAS;AAC5C,cAAQ,IAAI,mBAAmB,IAAI;AAEnC,UAAI,cAAc,WAAW;AAC3B,wBAAgB,QAAQ;AAAA,MAC5B,OAAS;AACL,0BAAkB,QAAQ;AAAA,MAC9B;AAEE,UAAI;AAEF,cAAM,iBAAiB,IAAI,KAAK,kBAAkB,KAAK;AACvD,uBAAe,QAAQ,eAAe,QAAS,IAAG,EAAE;AAEpD,cAAM,eAAe,IAAI,KAAK,gBAAgB,KAAK;AACnD,qBAAa,QAAQ,aAAa,QAAO,IAAK,EAAE;AAEhD,cAAMA,QAAc,KAAK;AAAA,UACvB,OAAO,MAAM,OAAO;AAAA,UACpB,WAAW,eAAe,YAAa;AAAA,UACvC,SAAS,aAAa,YAAa;AAAA,UACnC,GAAI,IAAI,UAAU,SAAS,EAAE,QAAQ,IAAI,MAAO;AAAA,QACtD,CAAK;AAAA,MACF,SAAQ,OAAO;AACd,gBAAQ,MAAM,uCAAuC,KAAK;AAAA,MAC9D;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/rents/views/components/pages/RentsEdit.vue.cjs

@@ -0,0 +1,218 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const Block = require("../../../../../components/Block/Block.vue.cjs");
+const Field = require("../../../../../components/Field/Field.vue.cjs");
+const Feed = require("../../../../../components/Feed/Feed.vue.cjs");
+const Popup = require("../../../../../components/Popup/Popup.vue.cjs");
+;/* empty css                                                      */
+;/* empty css                                             */
+const CardOrderItem = require("../../../../orders/components/blocks/CardOrderItem.vue.cjs");
+const vueRouter = require("vue-router");
+const auth = require("../../../../auth/views/store/auth.cjs");
+const rents_store = require("../../store/rents.store.cjs");
+const products = require("../../../../products/store/products.cjs");
+;/* empty css                 */
+const _hoisted_1 = { class: "pd-thin" };
+const _hoisted_2 = { class: "mn-b-medium gap-small flex-v-center flex-nowrap flex" };
+const _hoisted_3 = { class: "bg-light mn-b-thin h-min-20r h-max-20r o-scroll pd-medium radius-big" };
+const _hoisted_4 = { class: "flex gap-small" };
+const _hoisted_5 = { class: "gap-thin flex-v-center flex-nojustify flex" };
+const _hoisted_6 = { class: "mn-r-auto" };
+const _sfc_main = {
+  __name: "RentsEdit",
+  setup(__props) {
+    const route = vueRouter.useRoute();
+    const router = vueRouter.useRouter();
+    const Products = vue.ref(products.state.all);
+    const isOpenProductsPopup = vue.ref(false);
+    const totalDays = vue.computed(() => {
+      const start = new Date(rents_store.state.current.startDate);
+      const end = new Date(rents_store.state.current.endDate);
+      if (!start || !end) return 0;
+      const diffTime = Math.abs(end - start);
+      return Math.ceil(diffTime / (1e3 * 60 * 60 * 24));
+    });
+    function openProductsPopup() {
+      isOpenProductsPopup.value = true;
+    }
+    function closeProductsPopup() {
+      isOpenProductsPopup.value = false;
+    }
+    function addProduct(product) {
+      rents_store.state.current.product = product;
+      closeProductsPopup();
+    }
+    vue.onMounted(async () => {
+      try {
+        if (route.params.rent) {
+          await rents_store.actions.read({ _id: route.params.rent });
+        } else {
+          rents_store.mutations.clean();
+        }
+        await products.actions.read({ organization: route.params._id, listing: "rent", limit: 100 });
+        Products.value = products.state.all;
+      } catch (error) {
+        console.error("Ошибка при загрузке данных:", error);
+      }
+    });
+    async function onSubmit() {
+      try {
+        if (route.params.rent) {
+          let newProduct = rents_store.state.current;
+          newProduct.product = rents_store.state.current.product._id;
+          newProduct.startDate = new Date(rents_store.state.current.startDate);
+          newProduct.endDate = new Date(rents_store.state.current.endDate);
+          await rents_store.actions.update(newProduct);
+        } else {
+          rents_store.state.current.creator = { type: "user", target: auth.state.user._id };
+          rents_store.state.current.owner = { type: "organization", target: route.params._id };
+          rents_store.state.current.owner = { type: "organization", target: route.params._id };
+          let newProduct = rents_store.state.current;
+          newProduct.product = rents_store.state.current.product._id;
+          newProduct.startDate = new Date(rents_store.state.current.startDate);
+          newProduct.endDate = new Date(rents_store.state.current.endDate);
+          await rents_store.actions.create(newProduct);
+        }
+      } catch (error) {
+        console.error("Ошибка при отправке данных:", error);
+      }
+    }
+    async function onReset() {
+      try {
+        if (route.params._id) {
+          await rents_store.actions.read({ _id: route.params._id });
+        } else {
+          rents_store.mutations.clean();
+        }
+      } catch (error) {
+        console.error("Ошибка при сбросе данных:", error);
+      }
+    }
+    async function onDelete() {
+      try {
+        await rents_store.actions.delete(route.params._id);
+        router.push({ name: "Rents", params: { _id: route.params._id } });
+      } catch (error) {
+        console.error("Ошибка при удалении:", error);
+      }
+    }
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("header", _hoisted_2, [
+          vue.createElementVNode("h2", null, vue.toDisplayString(vue.unref(route).params._id ? "Edit" : "Add") + " Rent", 1)
+        ]),
+        vue.createVNode(Popup.default, {
+          title: "Add Product to Rent",
+          onClosePopup: closeProductsPopup,
+          isPopupOpen: isOpenProductsPopup.value,
+          class: "bg-white w-min-30r w-max-30r radius-big pd-medium"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createElementVNode("div", _hoisted_3, [
+              vue.createVNode(Feed.default, {
+                search: true,
+                states: { empty: { title: "No Products Found", description: "No products available for rent." } },
+                store: { read: (options) => products.actions.read(options) },
+                options: { organization: vue.unref(route).params._id, listing: "rent" }
+              }, {
+                default: vue.withCtx(({ items }) => [
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(items, (product) => {
+                    return vue.openBlock(), vue.createBlock(CardOrderItem.default, {
+                      key: product._id,
+                      editable: false,
+                      product,
+                      onClick: ($event) => addProduct(product),
+                      class: "bg-white pd-thin radius-medium w-100 mn-b-thin"
+                    }, null, 8, ["product", "onClick"]);
+                  }), 128))
+                ]),
+                _: 1
+              }, 8, ["store", "options"])
+            ])
+          ]),
+          _: 1
+        }, 8, ["isPopupOpen"]),
+        vue.createVNode(Block.default, {
+          title: "Rent Period",
+          class: "mn-b-semi"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createElementVNode("div", _hoisted_4, [
+              vue.createVNode(Field.default, {
+                field: rents_store.state.current.startDate,
+                "onUpdate:field": _cache[0] || (_cache[0] = ($event) => rents_store.state.current.startDate = $event),
+                label: "Start Date",
+                type: "date",
+                class: "w-100 bg-white radius-small pd-medium"
+              }, null, 8, ["field"]),
+              vue.createVNode(Field.default, {
+                field: rents_store.state.current.endDate,
+                "onUpdate:field": _cache[1] || (_cache[1] = ($event) => rents_store.state.current.endDate = $event),
+                label: "End Date",
+                type: "date",
+                class: "w-100 bg-white radius-small pd-medium"
+              }, null, 8, ["field"])
+            ])
+          ]),
+          _: 1
+        }),
+        vue.createVNode(Block.default, {
+          title: "Rented Products",
+          actions: [{ label: "+", function: openProductsPopup }],
+          placeholder: "No products added yet",
+          class: "mn-b-semi"
+        }, {
+          default: vue.withCtx(() => [
+            rents_store.state.current.product ? (vue.openBlock(), vue.createBlock(CardOrderItem.default, {
+              key: rents_store.state.current.product,
+              product: rents_store.state.current.product,
+              editable: false,
+              onClick: _cache[2] || (_cache[2] = () => rents_store.state.current.product = null),
+              class: "mn-b-small radius-medium bg-white pd-small"
+            }, null, 8, ["product"])) : vue.createCommentVNode("", true)
+          ]),
+          _: 1
+        }, 8, ["actions"]),
+        vue.createVNode(Block.default, {
+          title: "Comment",
+          class: "mn-b-semi"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(Field.default, {
+              field: rents_store.state.current.comment,
+              "onUpdate:field": _cache[3] || (_cache[3] = ($event) => rents_store.state.current.comment = $event),
+              label: "Comment",
+              type: "textarea",
+              class: "w-100 bg-white radius-small pd-medium"
+            }, null, 8, ["field"])
+          ]),
+          _: 1
+        }),
+        vue.createVNode(Block.default, null, {
+          default: vue.withCtx(() => [
+            vue.createElementVNode("section", _hoisted_5, [
+              vue.createElementVNode("h3", _hoisted_6, "Total Days: " + vue.toDisplayString(totalDays.value), 1),
+              vue.createElementVNode("a", {
+                onClick: onSubmit,
+                class: "bg-main button"
+              }, "Save"),
+              vue.createElementVNode("a", {
+                onClick: onReset,
+                class: "t-white bg-second button"
+              }, "Reset"),
+              vue.unref(route).params._id ? (vue.openBlock(), vue.createElementBlock("a", {
+                key: 0,
+                onClick: onDelete,
+                class: "t-white bg-red button"
+              }, "Delete")) : vue.createCommentVNode("", true)
+            ])
+          ]),
+          _: 1
+        })
+      ]);
+    };
+  }
+};
+exports.default = _sfc_main;
+//# sourceMappingURL=RentsEdit.vue.cjs.map

package/dist/martyrs/src/modules/rents/views/components/pages/RentsEdit.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RentsEdit.vue.cjs","sources":["../../../../../../../../src/modules/rents/views/components/pages/RentsEdit.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin\">\n    <header class=\"mn-b-medium gap-small flex-v-center flex-nowrap flex\">\n      <h2>{{ route.params._id ? 'Edit' : 'Add' }} Rent</h2>\n    </header>\n\n    <Popup \n      title=\"Add Product to Rent\" \n      @close-popup=\"closeProductsPopup\" \n      :isPopupOpen=\"isOpenProductsPopup\"\n      class=\"bg-white w-min-30r w-max-30r radius-big pd-medium\"\n    >\n      <div class=\"bg-light mn-b-thin h-min-20r h-max-20r o-scroll pd-medium radius-big\">\n        <Feed\n          :search=\"true\"\n          :states=\"{ empty: { title: 'No Products Found', description: 'No products available for rent.' } }\"\n          :store=\"{ read: (options) => products.actions.read(options) }\"\n          :options=\"{ organization: route.params._id, listing: 'rent' }\"\n          v-slot=\"{ items }\"\n        >\n          <CardOrderItem\n            v-for=\"product in items\" \n            :key=\"product._id\"\n            :editable=\"false\" \n            :product=\"product\" \n            @click=\"addProduct(product)\"\n            class=\"bg-white pd-thin radius-medium w-100 mn-b-thin\"\n          />\n        </Feed>\n      </div>\n    </Popup>\n\n    <Block title=\"Rent Period\" class=\"mn-b-semi\">\n      <div class=\"flex gap-small\">\n        <Field v-model:field=\"rents.state.current.startDate\" label=\"Start Date\" type=\"date\" class=\"w-100 bg-white radius-small pd-medium\" />\n        <Field v-model:field=\"rents.state.current.endDate\" label=\"End Date\" type=\"date\" class=\"w-100 bg-white radius-small pd-medium\" />\n      </div>\n    </Block>\n\n    <Block\n      title=\"Rented Products\"\n      :actions=\"[{ label: '+', function: openProductsPopup }]\"\n      placeholder=\"No products added yet\"\n      class=\"mn-b-semi\"\n    >\n      <CardOrderItem\n        v-if=\"rents.state.current.product\"\n        :key=\"rents.state.current.product\" \n        :product=\"rents.state.current.product\"\n        :editable=\"false\" \n        @click=\"() => rents.state.current.product = null\"\n        class=\"mn-b-small radius-medium bg-white pd-small\"\n      />\n    </Block>\n\n    <Block title=\"Comment\" class=\"mn-b-semi\">\n      <Field v-model:field=\"rents.state.current.comment\" label=\"Comment\" type=\"textarea\" class=\"w-100 bg-white radius-small pd-medium\" />  \n    </Block>\n\n    <Block>\n      <section class=\"gap-thin flex-v-center flex-nojustify flex\">\n        <h3 class=\"mn-r-auto\">Total Days: {{ totalDays }}</h3>\n        <a @click=\"onSubmit\" class=\"bg-main button\">Save</a> \n        <a @click=\"onReset\" class=\"t-white bg-second button\">Reset</a>\n        <a v-if=\"route.params._id\" @click=\"onDelete\" class=\"t-white bg-red button\">Delete</a>\n      </section>\n    </Block>\n  </div>\n</template>\n\n<script setup>\nimport Block from '@martyrs/src/components/Block/Block.vue';\nimport Field from '@martyrs/src/components/Field/Field.vue';\nimport Feed from '@martyrs/src/components/Feed/Feed.vue';\nimport Popup from '@martyrs/src/components/Popup/Popup.vue';\nimport CardPosition from '@martyrs/src/modules/products/components/blocks/CardPosition.vue';\nimport CardOrderItem from '@martyrs/src/modules/orders/components/blocks/CardOrderItem.vue';\n\nimport { computed, onMounted, ref } from 'vue';\nimport { useRoute, useRouter } from 'vue-router';\nimport * as auth from '@martyrs/src/modules/auth/views/store/auth';\nimport * as rents from '@martyrs/src/modules/rents/views/store/rents.store';\nimport * as products from '@martyrs/src/modules/products/store/products';\n\nconst route = useRoute();\nconst router = useRouter();\n\nconst Products = ref(products.state.all);\nconst isOpenProductsPopup = ref(false);\n\nconst totalDays = computed(() => {\n  const start = new Date(rents.state.current.startDate);\n  const end = new Date(rents.state.current.endDate);\n  if (!start || !end) return 0;\n  const diffTime = Math.abs(end - start);\n  return Math.ceil(diffTime / (1000 * 60 * 60 * 24));\n});\n\nfunction openProductsPopup() { isOpenProductsPopup.value = true; }\nfunction closeProductsPopup() { isOpenProductsPopup.value = false; }\n\nfunction addProduct(product) {\n  rents.state.current.product = product\n  closeProductsPopup();\n}\n\nfunction updateItem(index, updatedItem) {\n  rents.state.current.items[index] = { product: updatedItem.product._id || updatedItem.product, quantity: updatedItem.quantity || 1 };\n}\n\nfunction deleteItem(index) {\n  try {\n    rents.state.current.items.splice(index, 1);\n  } catch (error) {\n    console.error('Ошибка при удалении элемента:', error);\n  }\n}\n\nonMounted(async () => {\n  try {\n    if (route.params.rent) {\n      await rents.actions.read({ _id: route.params.rent });\n    } else {\n      rents.mutations.clean();\n    }\n\n    await products.actions.read({ organization: route.params._id, listing: 'rent', limit: 100 });\n    Products.value = products.state.all;\n  } catch (error) {\n    console.error('Ошибка при загрузке данных:', error);\n  }\n});\n\nasync function onSubmit() {\n  try {\n    if (route.params.rent) {\n      let newProduct = rents.state.current\n      newProduct.product = rents.state.current.product._id\n      newProduct.startDate = new Date(rents.state.current.startDate);\n      newProduct.endDate = new Date(rents.state.current.endDate);\n      await rents.actions.update(newProduct);\n    } else {\n      rents.state.current.creator = { type: 'user', target: auth.state.user._id };\n      rents.state.current.owner = { type: 'organization', target: route.params._id };\n      rents.state.current.owner = { type: 'organization', target: route.params._id };\n      let newProduct = rents.state.current\n      newProduct.product = rents.state.current.product._id\n      newProduct.startDate = new Date(rents.state.current.startDate);\n      newProduct.endDate = new Date(rents.state.current.endDate);\n      await rents.actions.create(newProduct);\n    }\n    // router.push({ name: 'Rents', params: { _id: route.params._id } });\n  } catch (error) {\n    console.error('Ошибка при отправке данных:', error);\n  }\n}\n\nasync function onReset() {\n  try {\n    if (route.params._id) {\n      await rents.actions.read({ _id: route.params._id });\n    } else {\n      rents.mutations.clean();\n    }\n  } catch (error) {\n    console.error('Ошибка при сбросе данных:', error);\n  }\n}\n\nasync function onDelete() {\n  try {\n    await rents.actions.delete(route.params._id);\n    router.push({ name: 'Rents', params: { _id: route.params._id } });\n  } catch (error) {\n    console.error('Ошибка при удалении:', error);\n  }\n}\n\n</script>\n\n<style lang=\"scss\">\n.round-stat {\n  padding: 1rem;\n  border-radius: 5rem;\n  width: 3rem;\n  height: 3rem;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 1px solid rgba(0,0,0,0.1);\n}\n</style>"],"names":["useRoute","useRouter","ref","products.state","computed","rents.state","onMounted","rents.actions","rents.mutations","products.actions","auth.state"],"mappings":"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"}