medical-form-wrapper(
title="Контакты"
:is-check-change="isCheckChange"
:is-loading-data="isLoadingData"
:is-edit="isEdit"
:save="saveChange"
:cancel="cancelEdit"
:open-edit="openEdit"
)
q-form.form-wrap.gap-24.w-full(ref="formContacts")
.flex.flex-col.gap-4(v-for="(contact, key) in contacts")
.font-semibold.text-sm.whitespace-nowrap {{configData[key].title}}
.flex.w-full.justify-between.items-center.gap-4(v-for="(data, index) in contact")
.label-field.font-sm.text-sm.whitespace-nowrap {{`${configData[key].fieldName} ${index+1} :`}}
.input-wrapper.items-center.flex.h-10.gap-10px
.flex(v-if="key === 'networks'")
.flex.rounded-full.cursor-pointer.items-center.gap-10px.py-1.pl-1.pr-2(
v-if="data.id || data.filled"
@click="() => copyLinkNetwork(data.username)"
style="background-color: var(--bg-light-grey)"
)
q-icon.icon(:name="mapNetworks[data.kind].icon" :class="{old: data.id, new: data.filled}")
span.text-sm.font-medium {{ mapNetworks[data.kind].title || data.username }}
.flex.gap-10px(v-else v-click-outside="() => checkNetworksField(index)")
base-select-networks(
:list-data="Object.values(mapNetworks)"
:option-data="data.kind"
:choose-option="(e) => chooseNetwork(e, index)"
:style-border="true"
:size-input="50"
)
base-input.w-full(
v-model="data.username"
type="text"
:name="key"
no-error-icon
:rule="configData[key].rules"
:standout="!isEdit"
:outlined="isEdit"
text-color="black"
)
base-input.w-full(
v-else
:disabled="!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"
)
.delete-contact.icon-cancel.text-xxs.cursor-pointer(
v-if="isEdit"
@click="() => deleteContact(key, index)"
)
base-button.ml-6px(
v-if="isEdit"
left-icon="icon-plus"
added-border-none
:icon-left-size="12"
@click="() => addNewContact(key)"
)
span.font-medium.text-base Добавить