diff --git a/src/components/deal/DealModal.vue b/src/components/deal/DealModal.vue
index c8f1910..c23b7d8 100644
--- a/src/components/deal/DealModal.vue
+++ b/src/components/deal/DealModal.vue
@@ -91,6 +91,7 @@
optionValue="id"
placeholder="Выберите заявку"
:filter="true"
+ :class="{ 'p-invalid': errors.req_side_two }"
@filter="filterRequisitionsList"
:virtualScrollerOptions="{ itemSize: 40 }"
>
@@ -98,6 +99,7 @@
+ {{ errorMessages.req_side_two }}
@@ -744,6 +746,7 @@ const errors = ref({
title: false,
side_one: false,
side_two: false,
+ req_side_two: false,
deal_date: false
});
@@ -751,9 +754,45 @@ const errorMessages = ref({
title: '',
side_one: '',
side_two: '',
+ req_side_two: '',
deal_date: ''
});
+watch(() => deal.value.title, () => {
+ if (errors.value.title) {
+ errors.value.title = false;
+ errorMessages.value.title = '';
+ }
+});
+
+watch(() => deal.value.side_one, () => {
+ if (errors.value.side_one) {
+ errors.value.side_one = false;
+ errorMessages.value.side_one = '';
+ }
+});
+
+watch(() => deal.value.side_two, () => {
+ if (errors.value.side_two) {
+ errors.value.side_two = false;
+ errorMessages.value.side_two = '';
+ }
+});
+
+watch(() => deal.value.deal_date, () => {
+ if (errors.value.deal_date) {
+ errors.value.deal_date = false;
+ errorMessages.value.deal_date = '';
+ }
+});
+
+watch(selectedRequisitionSideTwoId, () => {
+ if (errors.value.req_side_two) {
+ errors.value.req_side_two = false;
+ errorMessages.value.req_side_two = '';
+ }
+});
+
const validateForm = () => {
let isValid = true;
@@ -791,6 +830,16 @@ const validateForm = () => {
errorMessages.value.side_two = '';
}
+ // Валидация заявки стороны 2
+ if (!selectedRequisitionSideTwoId.value) {
+ errors.value.req_side_two = true;
+ errorMessages.value.req_side_two = 'Выберите заявку стороны 2';
+ isValid = false;
+ } else {
+ errors.value.req_side_two = false;
+ errorMessages.value.req_side_two = '';
+ }
+
// Валидация даты сделки
if (!deal.value.deal_date) {
errors.value.deal_date = true;
@@ -1539,9 +1588,19 @@ defineExpose({ closeModel });
.form__item {
.p-invalid {
+ border-color: #e24c4c !important;
+ box-shadow: 0 0 0 1px #e24c4c;
+ }
+
+ .p-error {
color: #e24c4c;
}
+ .error-highlight {
+ animation: shake 0.4s ease;
+ box-shadow: 0 0 0 2px #e24c4c;
+ }
+
label {
font-size: 16px;
font-weight: 400;
@@ -1706,4 +1765,12 @@ defineExpose({ closeModel });
background: #f2f2f2;
}
+@keyframes shake {
+ 0%, 100% { transform: translateX(0); }
+ 20% { transform: translateX(-4px); }
+ 40% { transform: translateX(4px); }
+ 60% { transform: translateX(-4px); }
+ 80% { transform: translateX(4px); }
+}
+