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)" :key="key+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"
no-error-icon
:name="key"
:rule="configData[key].rules"
:standout="!isEdit"
:outlined="isEdit"
text-color="black"
)
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"
)
.delete-contact.icon-cancel.text-xxs.cursor-pointer(
v-if="isEdit"
@click="() => deleteContact(key, index)"
)
q-btn.ml-2px(
v-if="isEdit",
color="primary",
flat,
:style="{'font-weight': 500, width: '104px', height: '24px'}",
no-caps,
padding="0",
@click="(e) => addNewContact(e, key)"
)
q-icon(name="app:icon-plus", size="12px", left)
span Добавить