WIP Исправлен баг на категориях льгот

This commit is contained in:
Daria Golova
2023-07-17 18:21:26 +03:00
parent a939097488
commit f86be1b187
11 changed files with 136 additions and 72 deletions

View File

@@ -5,7 +5,7 @@
:name="name",
:multiple="multiple",
:class="{'circle': circle, 'font-input': true, 'doc': doc}",
:input-style="{resize: resize,}",
:input-style="{resize: resize}",
:borderless="borderless",
:placeholder="placeholder",
outlined,
@@ -23,7 +23,7 @@
:debounce="debounce",
:shadow-text="shadowText",
:autofocus="autofocus",
hide-bottom-space,
hide-bottom-space
)
template(v-slot:prepend, v-if="iconLeft")
slot(name="iconLeft")
@@ -131,6 +131,14 @@ export default {
"--px": "0 16px",
"--py": "8px 0",
};
case "auto":
return {
"--input-height": "auto",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
default:
return {
"--input-height": "56px",

View File

@@ -4,21 +4,18 @@
.flex.flex-col.gap-y-4.h-full
.flex.flex-col.gap-y-6
.flex.font-bold.text-xl Категории
base-input.input(
base-input.search(
placeholder="Поиск",
@keyup.enter="searchCategory",
@input="searchCategory",
v-model="searchBenefit",
debounce="10",
outlined,
:width="300",
size="M",
iconLeft
)
q-icon(
name="app:icon-search",
size="20px",
style="color: var(--font-grey-color)"
)
template(v-slot:iconLeft)
q-icon(name="app:icon-search", size="20px", style="color: var(--font-grey-color)")
.field.flex.flex-col.overflow-y-scroll(:class="{'filed-category': findSelected(selected?.id)}")
.flex.items-center(v-for="benefit in benefitData", :key="benefit.id")
q-item(tag="label", :style="{alignItems: benefit.name.length > 28 ? 'start' : 'center'}")
@@ -43,7 +40,7 @@
base-button(
label="Сохранить",
width="146px",
@click="saveCategories(selected[0])"
@click="saveCategories(selected)"
)
.right-side.flex.px-10.font-bold.relative
q-icon(name="app:icon-cancel").text-sm.absolute.top-4.right-4.cursor-pointer(@click="closeModalCategories")
@@ -66,8 +63,8 @@
</template>
<script>
import BaseInput from "@/components/base/BaseInput.vue";
import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue";
export default {
name: "BaseCategorySelection",
@@ -218,4 +215,7 @@ export default {
.radio :deep(.q-radio__inner)
height: 24px
.search :deep(.q-field__prepend)
padding-right: 6px
</style>

View File

@@ -18,19 +18,19 @@
hide-bottom-space,
lazy-rules
)
template(v-slot:append)
template(v-slot:append, v-if="!readonly && !disabled")
q-icon(
name="app:calendar",
class="cursor-pointer",
size="18px"
)
q-menu(
:style="{'margin-top': '8px !important'}",
:style="{'margin-top': '6px !important'}",
v-model="calendarVisibility",
transition-show="scale",
transition-hide="scale",
self="top middle",
:offset="[118, 14]"
:offset="[118, 14]",
)
base-calendar(
v-model="internalDate",

View File

@@ -18,7 +18,7 @@
hide-bottom-space,
no-error-icon
)
template(v-slot:append)
template(v-slot:append, v-if="!readonly && !disabled")
q-icon(
name="app:time",
class="cursor-pointer",

View File

@@ -38,25 +38,29 @@
:items="genderOptions"
bg-color="#e9e9f6"
)
base-input-date(
v-else-if="field.type === 'date'",
v-model="basic[data.dataKey][field.key]",
size="M",
:readonly="!isEdit",
@update:model-value="checkChangeInput",
:width="302"
)
base-input(
v-else
v-else,
:readonly="!isEdit"
v-model="basic[data.dataKey][field.key]"
@update:model-value="checkChangeInput"
:type="field.type"
:name="field.key"
:width="302"
:standout="!isEdit"
:outlined="isEdit"
no-error-icon
:width="302",
size="M",
:rule="field.rules"
text-color="black"
)
)
</template>
<script>
import BaseSelect from "@/components/base/BaseSelect.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseAvatar from "@/components/base/BaseAvatar.vue";
import BaseModal from "@/components/base/BaseModal.vue";
import BaseUploadPhoto from "@/components/base/BaseUploadPhoto.vue";
@@ -74,6 +78,8 @@ import {
errorMap,
} from "@/pages/newMedicalCard/utils/medicalConfig.js";
import { mapGetters, mapState } from "vuex";
import BaseInput from "@/components/BaseInput.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue";
export default {
name: "BasicDataForm",
@@ -85,6 +91,7 @@ export default {
BaseModal,
BaseUploadPhoto,
TheNotificationProvider,
BaseInputDate,
},
data() {
return {

View File

@@ -31,29 +31,21 @@
:size-input="50"
)
base-input.w-full(
v-model="data.username"
type="text"
no-error-icon
:name="key"
:rule="configData[key].rules"
:standout="!isEdit"
:outlined="isEdit"
text-color="black"
)
v-model="data.username",
:name="key",
:rule="configData[key].rules",
size="M"
)
base-input.w-full(
v-else
:readonly="!isEdit"
v-model="data.username"
:name="key"
:mask="configData[key].inputMask"
:rule="configData[key].rules"
no-error-icon
@update:model-value="checkChangeInput"
type="text"
:standout="!isEdit"
:outlined="isEdit"
text-color="black"
)
v-else,
:readonly="!isEdit",
v-model="data.username",
:name="key",
:mask="configData[key].inputMask",
:rule="configData[key].rules",
@update:model-value="checkChangeInput",
size="M"
)
.delete-contact.icon-cancel.text-xxs.cursor-pointer(
v-if="isEdit"
@click="() => deleteContact(key, index)"
@@ -73,7 +65,6 @@
<script>
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseSelectNetworks from "@/components/base/BaseSelectNetworks.vue";
import { mapNetworks } from "@/pages/newMedicalCard/utils/medicalConfig";
import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider.vue";
@@ -85,6 +76,7 @@ import {
import { contactsDataForm } from "@/pages/newMedicalCard/utils/medicalConfig";
import { getRequestArrayData } from "@/shared/utils/wrapperRequestChangeData";
import { mapState, mapGetters } from "vuex";
import BaseInput from "@/components/BaseInput.vue";
export default {
name: "ContactsForm",

View File

@@ -41,20 +41,30 @@
v-model="docData[photoId][field.key]",
:confirm-upload="confirmChangePhoto",
)
base-input-date(
v-if="field.type === 'date'",
v-model="docData[data.dataKey][field.key]",
:name="field.key",
@update:model-value="checkChangeDocData",
:readonly="!isEdit",
:width="302",
:mask="field?.inputMask",
:rule="[(val) => !personDataField.includes(field.key) ? checkPassportFields(val, field.rules) : field.rules(val)]",
:autogrow="field.key === 'issued_by_org'",
size="M"
)
base-input(
v-else,
v-if="field.type === 'text'",
v-model="docData[data.dataKey][field.key]",
:name="field.key",
@update:model-value="checkChangeDocData",
:readonly="!isEdit",
:type="field.type",
textColor="var(--font-dark-blue-color)",
:width="302",
:standout="!isEdit",
:outlined="isEdit",
:mask="field?.inputMask",
:rule="[(val) => !personDataField.includes(field.key) ? checkPassportFields(val, field.rules) : field.rules(val)]",
:autogrow="field.key === 'issued_by_org'"
:autogrow="field.key === 'issued_by_org'",
:size="field.key !== 'issued_by_org' ? 'M' : 'auto'"
)
.icon-copy.my-auto.text-lg.label-field.cursor-pointer(
v-if="checkCopiedFields(field.key) && !!docData[data.dataKey][field.key]",
@@ -65,7 +75,6 @@
<script>
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import { documentForm } from "@/pages/newMedicalCard/utils/medicalConfig";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseAvatar from "@/components/base/BaseAvatar.vue";
import BaseModal from "@/components/base/BaseModal.vue";
import BaseUploadPhoto from "@/components/base/BaseUploadPhoto.vue";
@@ -76,6 +85,8 @@ import {
import { fetchWrapper } from "@/shared/fetchWrapper.js";
import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider";
import { addNotification } from "@/components/Notifications/notificationContext";
import BaseInput from "@/components/BaseInput.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue";
export default {
name: "DocumentsForm",
components: {
@@ -85,6 +96,7 @@ export default {
BaseModal,
BaseUploadPhoto,
TheNotificationProvider,
BaseInputDate,
},
data() {
return {
@@ -200,7 +212,12 @@ export default {
let documentsFormData = new FormData();
form.getValidationComponents().forEach((elem) => {
if (!this.personDataField.includes(elem.name)) {
passportFormData.append(elem.name, elem.modelValue ?? "");
if (elem.name === "issued_by_date") {
passportFormData.append(
elem.name,
this.convertFormat(elem.modelValue) ?? ""
);
} else passportFormData.append(elem.name, elem.modelValue ?? "");
} else documentsFormData.append(elem.name, elem.modelValue ?? "");
});
this.checkChangePhoto("passport", "photo", passportFormData);
@@ -299,6 +316,9 @@ export default {
addErrorNotification(title, message) {
addNotification(title + message, title, message, "error", 5000);
},
convertFormat(date) {
return date ? date.split(".").reverse().join("-") : null;
},
},
watch: {
initialDocData: {

View File

@@ -48,7 +48,7 @@
v-else-if="field.type === 'select'",
@click="openModalCategories"
)
q-field.items-center(
q-field.items-center.categories(
:style="{cursor: isEdit ? 'pointer' : 'default'}",
standout,
:readonly="!isEdit",
@@ -82,10 +82,8 @@
@update:model-value="checkChangeInput",
:mask="field?.inputMask",
:readonly="!isEdit",
:standout="!isEdit",
:outlined="isEdit",
:type="field.type",
text-color="black"
size="M"
)
q-icon.my-auto.text-lg.label-field.cursor-pointer(
size="18px",
@@ -101,12 +99,12 @@ import { mapGetters, mapState } from "vuex";
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseAvatar from "@/components/base/BaseAvatar.vue";
import { fetchWrapper } from "@/shared/fetchWrapper";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseModal from "@/components/base/BaseModal.vue";
import BaseUploadPhoto from "@/components/base/BaseUploadPhoto.vue";
import BaseCategorySelection from "@/components/base/BaseCategorySelection.vue";
import { checkChangeData } from "@/shared/utils/changesObjects";
import { addNotification } from "@/components/Notifications/notificationContext";
import BaseInput from "@/components/BaseInput.vue";
export default {
name: "InsuranceForm",
@@ -421,4 +419,24 @@ export default {
.delete
background-color: var(--btn-red-color)
.categories :deep(.q-field__control)
height: 40px
color: var(--font-dark-blue-color)
padding: 0 16px
&:before
border: none !important
transition: none
&:after
border: none !important
transition: none
transform: none !important
.categories :deep(.q-field__native)
font-weight: 500
font-size: 16px
line-height: normal
color: var(--font-dark-blue-color)
padding: 8px 0
</style>

View File

@@ -24,8 +24,7 @@
base-input.w-full(
v-model="dataValue.result",
label="Результат",
outlined,
text-color="black",
size="M",
placeholder="Введите диагноз...",
)
.results-wrapper.flex.flex-col.rounded.w-full.px-4.py-2
@@ -66,11 +65,11 @@
<script>
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseInputNumber from "@/components/base/BaseInputNumber.vue";
import { thermometryResultsMap } from "@/pages/newMedicalCard/utils/medicalConfig";
import { mapState } from "vuex";
import { mapActions } from "vuex";
import BaseInput from "@/components/BaseInput.vue";
export default {
name: "ThermometryForm",

View File

@@ -15,15 +15,17 @@
:key="tag.id"
:class="{'pointer': change || fillInspection}"
) {{tag}}
base-input.px-3(v-if="change || fillInspection", type="textarea", autogrow, borderless, placeholder="Введите жалобу...")
q-input.input.px-3(v-if="change || fillInspection", type="textarea", autogrow, borderless, placeholder="Введите жалобу...")
.filter.flex.flex-col.gap-y-4.relative(v-if="change || fillInspection")
.flex.gap-x-2
base-input(placeholder="Поиск", outlined, :width="232", iconLeft)
q-icon(
name="app:icon-search",
size="20px",
style="color: var(--font-grey-color)"
)
base-input.search(
placeholder="Поиск",
:width="232",
iconLeft
size="M"
)
template(v-slot:iconLeft)
q-icon(name="app:search", size="20px", style="color: var(--font-grey-color)")
.button
q-btn(
icon="filter_alt",
@@ -63,11 +65,11 @@
<script>
import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import TagCreationForm from "@/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/TagCreationForm.vue";
import BaseModal from "@/components/base/BaseModal.vue";
import { mapState } from "vuex";
import BaseInput from "@/components/BaseInput.vue";
export default {
name: "MedicalFormTag",
@@ -213,4 +215,17 @@ export default {
display: none
.on-left
margin-right: 8px
.input :deep(.q-field__native)
font-weight: 500
font-size: 14px
line-height: 135%
color: var(--font-dark-blue-color)
padding: 4px 0
&::placeholder
color: var(--font-grey-color)
opacity: 1
.search :deep(.q-field__prepend)
padding-right: 6px
</style>

View File

@@ -29,7 +29,12 @@
q-icon(name="app:icon-plus", size="10px",)
span Добавить категорию
.flex.flex-col(class="gap-x-1.5")
base-input(v-model="model.tag", label="Текст тега", placeholder="Введите тег", outlined)
new-base-input(
v-model="model.tag",
label="Текст тега",
placeholder="Введите тег",
size="M"
)
.buttons-group.flex
base-button(
type="secondary",
@@ -47,8 +52,8 @@
</template>
<script>
import BaseInput from "@/components/base/BaseInput.vue";
import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue";
export default {
name: "TagCreationForm",