diff --git a/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.story.vue b/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.story.vue index cd6f1d49b..20ab38d58 100644 --- a/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.story.vue +++ b/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.story.vue @@ -39,7 +39,6 @@ const policyA = withCount({ description: 'Distributes conversations evenly among available agents', assignmentOrder: 'round_robin', conversationPriority: 'high', - enabled: true, inboxes: [mockInboxes[0], mockInboxes[1]], isFetchingInboxes: false, }); @@ -50,7 +49,6 @@ const policyB = withCount({ description: 'Assigns based on capacity and workload', assignmentOrder: 'capacity_based', conversationPriority: 'medium', - enabled: true, inboxes: [mockInboxes[2], mockInboxes[3]], isFetchingInboxes: false, }); @@ -61,7 +59,6 @@ const emptyPolicy = withCount({ description: 'Policy with no assigned inboxes', assignmentOrder: 'manual', conversationPriority: 'low', - enabled: false, inboxes: [], isFetchingInboxes: false, }); diff --git a/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.vue b/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.vue index fe9965777..cedfb0009 100644 --- a/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.vue +++ b/app/javascript/dashboard/components-next/AssignmentPolicy/AssignmentPolicyCard/AssignmentPolicyCard.vue @@ -15,7 +15,6 @@ const props = defineProps({ assignmentOrder: { type: String, default: '' }, conversationPriority: { type: String, default: '' }, assignedInboxCount: { type: Number, default: 0 }, - enabled: { type: Boolean, default: false }, inboxes: { type: Array, default: () => [] }, isFetchingInboxes: { type: Boolean, default: false }, }); @@ -65,22 +64,6 @@ const handleFetchInboxes = () => { {{ name }}
-
- - {{ - enabled - ? t( - 'ASSIGNMENT_POLICY.AGENT_ASSIGNMENT_POLICY.INDEX.CARD.ACTIVE' - ) - : t( - 'ASSIGNMENT_POLICY.AGENT_ASSIGNMENT_POLICY.INDEX.CARD.INACTIVE' - ) - }} - -
-
+
+ +
-import { ref, onMounted } from 'vue'; +import { ref, computed, onMounted } from 'vue'; import { useI18n } from 'vue-i18n'; import Input from 'dashboard/components-next/input/Input.vue'; import DurationInput from 'dashboard/components-next/input/DurationInput.vue'; @@ -15,6 +15,9 @@ const fairDistributionLimit = defineModel('fairDistributionLimit', { }, }); +// The model value is in seconds (for the backend/DB) +// DurationInput works in minutes internally +// We need to convert between seconds and minutes const fairDistributionWindow = defineModel('fairDistributionWindow', { type: Number, default: 3600, @@ -25,6 +28,17 @@ const fairDistributionWindow = defineModel('fairDistributionWindow', { const windowUnit = ref(DURATION_UNITS.MINUTES); +// Convert seconds to minutes for DurationInput +const windowInMinutes = computed({ + get() { + return Math.floor((fairDistributionWindow.value || 0) / 60); + }, + set(minutes) { + fairDistributionWindow.value = minutes * 60; + }, +}); + +// Detect unit based on minutes (converted from seconds) const detectUnit = minutes => { const m = Number(minutes) || 0; if (m === 0) return DURATION_UNITS.MINUTES; @@ -34,7 +48,7 @@ const detectUnit = minutes => { }; onMounted(() => { - windowUnit.value = detectUnit(fairDistributionWindow.value); + windowUnit.value = detectUnit(windowInMinutes.value); }); @@ -73,9 +87,9 @@ onMounted(() => {
- + +import { useI18n } from 'vue-i18n'; + const props = defineProps({ id: { type: String, @@ -16,12 +18,22 @@ const props = defineProps({ type: Boolean, default: false, }, + disabled: { + type: Boolean, + default: false, + }, + disabledMessage: { + type: String, + default: '', + }, }); const emit = defineEmits(['select']); +const { t } = useI18n(); + const handleChange = () => { - if (!props.isActive) { + if (!props.isActive && !props.disabled) { emit('select', props.id); } }; @@ -29,9 +41,11 @@ const handleChange = () => {