.section-wrapper.flex.flex-col.h-fit.cursor-pointer(
:style="{width: settings[section].width + 'px', 'min-height': settings[section].height + 'px', background: changeBackground}",
)
.section-header.flex.items-center.justify-between.pl-4.pr-3(:class="{small:settings[section].rowFlex}")
span.text-sm.font-semibold.whitespace-nowrap {{settings[section].title}}
.flex.items-center.gap-x-8
base-button(
v-if="isChange && (this.isData || this.isAddress || this.isAttachments || this.isNotes)",
@click.stop="changeDoc",
confirm,
rounded,
outlined,
:size="20"
)
.icon-ok.text-xsm(class="pt-[3px]")
.edit.cursor-pointer(
v-if="!isChange && (this.isData || this.isAddress || this.isAttachments || this.isNotes)",
@click="changeClientData"
)
.icon-edit.text-base.mt-2px
.flex.relative
base-button(
v-if="settings[section].addFile",
@click="openAddingWrap",
:rounded="true",
:outlined="true",
:added="true",
:size="20"
)
.icon-plus.text-sm(class="pt-[2px]")
base-popup.right-3.top-5(
v-if="section === 'docs' && isOpenAddingWrap",
v-click-outside="closePopup",
:width="244"
)
table-choice-adding-doc(
:add-new-doc="addNewDoc",
:save-docs="saveDocs",
:new-docs="docData",
:change-open-add-doc="changeOpenAddDoc",
:change-open-create-doc="changeOpenCreateDoc",
)
base-modal(
v-model="showModal",
:style-content="{padding: isOpenAddDoc ? '16px' : '28px 32px'}",
:showIcon="isOpenAddDoc"
)
table-adding-new-doc(
v-if="isOpenAddDoc",
:add-new-doc="addNewDoc",
:new-docs="docData",
:close-modal="changeShowModal",
v-click-outside="closeAddDocs"
)
//-- table-create-package-doc(v-if="isOpenPackage")
stepper-create-agreement(v-if="isOpenPackage")
base-popup.right-3.top-5(
v-if="section === 'additional' && isOpenAddingWrap",
v-click-outside="closePopup",
:width="485"
)
table-create-note(:create-note="createNote", :close-popup="closePopup")
transition(name="section", mode="out-in")
.flex.justify-center.items-center(
v-if="sectionDataPresence",
:style="{height: settings[section].voidHeight + 'px'}",
)
base-loader(:width="60", :height="60")
.section-body.flex.flex-col.gap-y-4.px-4(
v-else-if="(this.isData || this.isAddress || this.isAttachments || this.isNotes) && !isChange",
:class="{'pt-3 pb-4': isData || isAddress || isAttachments || isNotes}",
:style="{height: settings[section].voidHeight + 'px'}"
)
.flex.flex-col.gap-y-4
.flex.flex-col(v-for="(item, key) in sectionInfo", class="gap-y-1.5")
span.title-section.font-semibold.text-xs(v-if="settings[section].options") {{settings[section].options[key]}}
span.title-section.font-semibold.text-xs(v-if="item.header") {{item.header}}
.flex(v-if="settings[section].options && !isChange")
span.text-sm.w-fit(:style="{fontWeight:key === 'numba'&&600}") {{key === 'issued_by_date' ? formattedDate : item}}
.copy.icon-copy.cursor-pointer.pl-4(
v-if="key === 'numba'",
@click="() => copyValue(item)"
)
.flex(v-if="item.name && !isChange")
span.text-sm.w-fit {{item.title}}
.flex.items-center(v-if="item.title && section !== 'additional'")
.flex.gap-x-2.items-center
img(:src="iconDictionary[item?.document?.substr(item.document.lastIndexOf('.') + 1)]")
span.text-sm {{item.title}}
span.text-sm(v-if="item.document") {{`.${item?.document?.substr(item.document.lastIndexOf(".") + 1)}`}}
.flex.flex-col(v-if="section === 'additional' && !isChange", class="gap-y-1.5")
.title-section.text-xxs.font-semibold {{item.title}}
span.text-smm {{item.description}}
.section-body.flex.flex-col.gap-y-4.px-4(
v-else-if="(this.isData || this.isAddress || this.isAttachments || this.isNotes) && isChange",
:class="{'pt-3 pb-4': isData || isAddress || isAttachments || isNotes}",
)
.flex.flex-col.gap-y-4
.flex.flex-col(v-for="(item, key) in sectionInfo", class="gap-y-1.5")
span.title-section.font-semibold.text-xs(
v-if="settings[section].options",
) {{settings[section].options[key]}}
span.title-section.font-semibold.text-xs(v-if="item.header") {{item.header}}
client-detail-input.text-sm.w-max-fit(
v-if="section!=='docs' && section!=='additional' && isChange && settings[section].options[key] !== 'Дата выдачи'",
:style="{fontWeight:key === 'numba'&&600}",
v-model:value="sectionInfo[key]",
:rows="section ==='pass' ? 2 : 1",
:placeholder="settings[section].placeholder[key] || settings[section].placeholder"
:sharp="settings[section].sharps[key] && section === 'pass' ? settings[section].sharps[key] : ''"
)
base-input-date.input.text-sm(
v-else-if="isChange && section !== 'docs' && section !== 'additional'",
v-model:value="sectionInfo.issued_by_date"
)
.copy.icon-copy.cursor-pointer(
v-if="item.copy",
@click="() => copyValue(item)"
)
.separation.flex.items-center.justify-center.relative.mt-10px.mb(
v-if="section === 'addresses' && isChange",
class="gap-y-1.5"
)
.line.absolute
.text-separation.span.text-sm.separator.px-2 или
.flex.flex-col.gap-y-4(v-if="section === 'addresses' && isChange")
client-detail-section-address(:dope-address="dopeAddress")
.flex.flex-col.gap-y-2(v-if="section === 'additional' && isChange")
.flex.justify-between
.title-section.text-xxs.font-semibold Заголовок
.icon-cancel.cancel.cursor-pointer.pr-3.text-xsm(
v-if="isChange",
:id="item.id",
@click="deleteNote(item.id)"
)
client-detail-input.text-sm.w-max-fit.pr-12.relative(
:maxLength="40",
:style="{fontWeight:key === 'numba'&&600}",
v-model:value="sectionInfo[key].title",
placeholder="Заголовок"
)
.text.flex.absolute.text-xsx.top-18px(
class="right-2.5",
:style="{color: 'var(--font-grey-color)'}"
) {{`${sectionInfo[key].title.length}/40`}}
.title-section.text-xxs.font-semibold Описание
client-detail-input.text-sm.w-max-fit(
:maxLength="40",
:style="{fontWeight:key === 'numba'&&600}",
v-model:value="sectionInfo[key].description",
placeholder="Описание"
)
.flex.items-center(v-if="item.title && section !== 'additional'")
.icon-cancel.cancel.cursor-pointer.pr-3.text-xsm(
v-if="isChange",
:id="item.id",
@click="deleteDoc(item.id)"
)
.flex.gap-x-2.items-center
img(:src="iconDictionary[item?.document?.substr(item.document.lastIndexOf('.') + 1)]")
span.text-sm {{item.title}}
span.text-sm(v-if="item.document") {{`.${item?.document?.substr(item.document.lastIndexOf(".") + 1)}`}}
.section-add.flex.justify-center.items-center.cursor-pointer(
v-else
:style="{height: settings[section].voidHeight + 'px'}"
@click="openAddDoc"
) Добавить данные