vi.foquz.ru
Open in
urlscan Pro
51.250.123.36
Public Scan
Submitted URL: https://foquz.link.sendsay.ru/foquz/00,=0Q7EcKw0xzz1sC2I_bP3qrg/1379,8985069,1629458,?aHR0cHM6Ly92aS5mb3F1ei5ydS9wLzgyMmQxNTcw...
Effective URL: https://vi.foquz.ru/p/822d15708ed70d2cf9481a95e54d35f4
Submission: On June 26 via manual from RU — Scanned from DE
Effective URL: https://vi.foquz.ru/p/822d15708ed70d2cf9481a95e54d35f4
Submission: On June 26 via manual from RU — Scanned from DE
Form analysis 22 forms found in the DOM
<form data-bind="attr: { id: 'answer-form-' + questionId }" id="answer-form-2514379">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<div class="row">
<div class="col-12">
<div class="survey-questions__preview survey-question-media-variants__preview survey-questions__preview_almost_transparent" data-bind="css: {
'survey-questions__preview_almost_transparent':$component.type !== 0
}">
<!-- ko if: $component.galleryEnabled --><!-- /ko -->
</div>
</div>
</div>
<!-- ko if: question.isVariants --><!-- /ko -->
<!-- ko ifnot: question.isVariants -->
<div class="mx-auto">
<!-- ko template: {
name: 'nps-rating-controller-template',
data: {
controller: question.ratingController,
fromOne: question.fromOne,
texts: texts
}
} -->
<div class="text-center" data-bind="let: {
npsValue: $data.npsValue ? $data.npsValue : $data.controller.value
}">
<div class="nps-scale nps-scale--colored nps-scale--from-one" data-bind="css: {
'nps-scale--colored': controller.design != 2,
'nps-scale--inited': npsValue() >= 0,
'nps-scale--from-one': $data.fromOne
}">
<div class="nps-scale__list">
<!-- ko foreach: {
data: controller.scale,
} -->
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(249, 98, 97);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">0</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(247, 100, 100);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">1</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(238, 109, 109);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">2</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(223, 123, 125);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">3</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(205, 140, 146);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">4</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(187, 158, 166);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">5</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(172, 172, 182);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">6</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(175, 159, 168);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">7</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(186, 115, 122);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">8</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(201, 53, 58);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">9</span>
</div>
<div class="nps-scale__item cursor-pointer" data-bind="
style: {
'background-color': $data
},
css: {
'active': npsValue() >= 0 && $index() == npsValue()
},
click: function() {
if (npsValue() === $index()) {
npsValue(-1);
return;
}
npsValue($index());
},
" style="background-color: rgb(214, 0, 3);">
<div class="nps-scale__item-bg"></div>
<span data-bind="text: $index()">10</span>
</div>
<!-- /ko -->
</div>
<!-- ko if: controller.startLabel || controller.endLabel --><!-- /ko -->
<!-- ko if: npsValue -->
<input type="hidden" name="rating" data-bind="value: npsValue()" value="-1">
<!-- /ko -->
</div>
</div>
<!-- /ko -->
</div>
<div class="d-block text-center">
<!-- ko template: {
foreach: templateIf(formControlErrorStateMatcher(question.ratingController)(), $data),
afterAdd: fadeAfterAddFactory(450),
beforeRemove: fadeBeforeRemoveFactory(450)
} --><!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.commentEnabled --><!-- /ko -->
<!-- ko if: question.skip --><!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre" data-bind="css: {
'no-margin': mediaTypeName == 'text' && question.text.length <= 1 }">
<div class="row rate-row">
<!-- ko if: question.questionContent.length -->
<div class="col-12" data-bind="css: {
'col-lg-12 central': assessmentTypeName == 'items',
'col-lg-7 col-md-7': assessmentTypeName != 'items',
}">
<!-- ko template: { name: 'survey-new-types-rate-gallery-template' } -->
<!-- /ko -->
<!-- ko if: (question.checkAll===true) -->
<div class="align-items-center justify-content-center" data-bind="css: {
'd-flex': assessmentTypeName == 'items' && question.questionGallery.length
}">
<!-- ko template: { name: 'survey-new-types-rate-check-all-template' } -->
<!-- /ko -->
</div>
<!-- /ko -->
</div>
<!-- /ko -->
<div class="col-12" data-bind="css: {
'col-lg-5 col-md-5': assessmentTypeName != 'items' && question.questionContent.length,
'col-lg-12': assessmentTypeName == 'items' && question.questionGallery.length,
'survey-questions__all-width-column': assessmentTypeName == 'items'
}">
<!-- ko if: (assessmentTypeName == 'stars') -->
<!-- ko template: { name: 'survey-new-types-rate-template-stars' } -->
<!-- /ko -->
<!-- /ko -->
<!-- ko if: (assessmentTypeName == 'variants') -->
<!-- ko template: { name: 'survey-new-types-rate-template-variants' } -->
<!-- /ko -->
<!-- /ko -->
<!-- ko if: (assessmentTypeName == 'items') -->
<!-- ko template: { name: 'survey-new-types-rate-template-items' } -->
<!-- /ko -->
<!-- /ko -->
</div>
</div>
</div>
<!-- ko template: {
foreach: templateIf(question.isClarifyingQuestionVisible(), $data),
name: 'survey-new-types-rate-clarifying-question-template',
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }, element: element">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2" data-bind="css: {
'has-gallery': question.galleryController.gallery.length
}">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
</div>
<!-- ko template: {
name: 'variants-controller-template',
data: {
controller: question.variantsController,
formControlErrorStateMatcher: formControlErrorStateMatcher,
texts: texts
}
} -->
<!-- /ko -->
<!-- ko template: {
foreach: templateIf(!question.skip || !question.skipped(), $data),
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<!-- ko template: {
foreach: templateIf(question.commentEnabled && !question.skipped(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200),
} -->
<div class="form-group survey-comment mobile-wide mt-4">
<div class="form-label" data-bind="text: texts().commentLabel"></div>
<textarea name="answer" class="survey-questions__form-textarea form-control" data-bind="
textInput: question.comment,
attr: {
maxlength: question.commentFieldParam.max,
minlength: question.commentFieldParam.min,
placeholder: texts().commentPlaceholderText
},
css: {
'is-invalid': formControlErrorStateMatcher(question.comment)
}"></textarea>
<!-- ko template: {
foreach: formControlErrorStateMatcher(question.comment),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $parent.question.comment.error"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip mt-4 mobile-wide">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }, event: {
submit: function(_, e) {
e.preventDefault();
e.stopPropagation();
question.submit();
return false;
}
}">
<div class="d-flex justify-content-center">
<masked-field class="d-inline-block text-question-config" params="maskedField: question.maskedField,
formControlErrorStateMatcher: formControlErrorStateMatcher, modal: isTablet, translation: texts"></masked-field>
</div>
</form><form data-bind="attr: { id: 'answer-form-'+questionId }" class="date-question">
<!-- ko template: { afterRender: onInit } -->
<div class="form-group">
<div class="d-flex justify-content-center m-n3">
<div class="date-question-wrapper">
<!-- ko if: question.hasDate && question.hasTime -->
<div class="date-question__date">
<!-- ko template: {
name: 'survey-new-types-date-template-datepicker'
} -->
<!-- /ko -->
</div>
<div class="date-question__time">
<!-- ko template: {
name: 'survey-new-types-date-template-timepicker'
} -->
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.hasDate && !question.hasTime -->
<div class="date-question__date">
<!-- ko template: {
name: 'survey-new-types-date-template-datepicker'
} -->
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: !question.hasDate && question.hasTime -->
<div class="date-question__time">
<!-- ko template: {
name: 'survey-new-types-date-template-timepicker'
} -->
<!-- /ko -->
</div>
<!-- /ko -->
</div>
</div>
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="form-group">
<div data-bind="component: { name: 'survey-questions__search',params: {root:$component,value: $component.customTextInput, check: $component.formControlErrorStateMatcher, data: $component.data} }"></div>
<!-- ko template: {
foreach: templateIf($component.formControlErrorStateMatcher($component.customTextInput) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formControlErrorStateMatcher($component.customTextInput)"></div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }, dnd: function(files) {
if ($component.maxLength <= $component.images().length) {
$component.showLimitMessage(true);
return;
}
$component.loader.loadFiles(files);
}">
<dnd-cover class="foquz-dnd-cover--xs" style="margin: -15px -40px -21px;" params="type: $component.mediaType, mode: 'multiple'"></dnd-cover>
<!-- ko template: { afterRender: onInit } -->
<div class="form-group">
<div class="survey-question__media-form-control mx-n4 my-n3 p-0" style="width: calc(100% + 2rem)">
<div class="survey-question__media-form-control-list m-0 p-0">
<div class="survey-question__media-form-control-list-content survey-question__media-form-control-list-content_flex m-0" style="max-width: 100%">
<!-- ko foreach: { data: $component.images, beforeRemove: fadeBeforeRemoveFactory(200), afterAdd: fadeAfterAddFactory(200, 200) } -->
<div>
<file-loader-preview class="file-loader-preview--lg my-2 mx-2" params="loading: $data.loading, file: $data.url, preview: $data.preview, gallery: $component.gallery, index: $index(),
onRemove: function() { $component.removeImage($data); }">
</file-loader-preview>
<div class="mx-2 file-loader-preview__name" data-bind="text: $data.name"></div>
</div>
<!-- /ko -->
<div class="survey-question__media-form-control-actions my-2 mx-2" data-bind="css:{
'disabled':$component.maxLength <= $component.images().length
}">
<!-- ko let: { fileInput: ko.observable(null) } -->
<div class="survey__images-form-control-content m-0">
<div data-bind="click: function (_,e) {
if ($component.maxLength <= $component.images().length) {
$component.showLimitMessage(true);
return;
}
$component.loader.open();
}" class="survey__images-form-control-add-button survey__images-form-control-add-button_big m-0">
<svg width="19" height="20" viewBox="0 0 19 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M18 9.43839L9.96279 17.4644C8.97817 18.4476 7.64274 19 6.25028 19C4.85782 19 3.52239 18.4476 2.53777 17.4644C1.55315 16.4811 1 15.1476 1 13.7571C1 12.3665 1.55315 11.033 2.53777 10.0497L10.575 2.02375C11.2314 1.36825 12.1217 1 13.05 1C13.9783 1 14.8686 1.36825 15.525 2.02375C16.1814 2.67924 16.5502 3.56829 16.5502 4.4953C16.5502 5.42231 16.1814 6.31135 15.525 6.96685L7.47904 14.9928C7.15083 15.3206 6.70569 15.5047 6.24154 15.5047C5.77738 15.5047 5.33224 15.3206 5.00403 14.9928C4.67583 14.6651 4.49144 14.2206 4.49144 13.7571C4.49144 13.2935 4.67583 12.849 5.00403 12.5213L12.429 5.11537"
stroke="#73808D" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
<span class="survey__images-form-control-add-button-label" data-bind="text: $component.label">
</span>
</div>
</div>
<!-- /ko -->
</div>
</div>
</div>
<div class="error-wrapper">
<!-- ko foreach: $component.loader.errors -->
<file-loader-error params="error: $data"></file-loader-error>
<!-- /ko -->
<!-- ko template: {
foreach: templateIf($component.showLimitMessage(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.limitMessage"></div>
<!-- /ko -->
<!-- ko template: {
foreach: templateIf($component.root.isSubmitted() && $component.isRequired && !$component.images().length, $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.translator.t('Загрузите файл')"></div>
<!-- /ko -->
<!-- ko template: {
foreach: templateIf($component.uploadApiError(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="html: $component.uploadApiError"></div>
<!-- /ko -->
</div>
</div>
</div>
<!-- ko template: {
foreach: templateIf($component.isHaveCustomField, $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-group form-group_file_comment survey-comment">
<label class="form-label" data-bind="text: $component.texts().commentLabel"></label>
<textarea name="answer" class="form-control" data-bind="attr: {
'data-min':$component.textFieldParams.min,
'data-max':$component.textFieldParams.max,
'maxlength':$component.textFieldParams.max,
placeholder: $component.texts().placeholderText,
},
css: {
'is-invalid': $component.formControlErrorStateMatcher(customTextInput) && $component.root.isSubmitted()
},
textInput: customTextInput"></textarea>
<!-- ko template: {
foreach: templateIf($component.formControlErrorStateMatcher(customTextInput) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formControlErrorStateMatcher(customTextInput)"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }">
<!-- ko template: { afterRender: onInit } -->
<!-- ko foreach: { data: question.quizzes, as: 'quiz' } -->
<masked-field params="maskedField: quiz,
formControlErrorStateMatcher: $parent.formControlErrorStateMatcher, modal: $parent.isTablet,
translation: $parent.texts()[quiz.id]"></masked-field>
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+ questionId }" class="priority-question-form">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__priority" data-bind="sortable, sortableItem: '.survey-questions__priority-item', onSort: function(e) { onSort(e) },
css: {
'with-comment':question.commentEnabled
}">
<!-- ko foreach: { data: variants } -->
<div class="survey-questions__priority-item">
<span class="survey-questions__priority-item-drag hide-on-dragging sortable-handle">
<i class="icon icon-drag-arrow"></i>
</span>
<!-- ko if: $parent.question.touched() -->
<span class="bold mr-2 hide-on-dragging " data-bind="text: $data.index() + 1"></span>
<!-- /ko -->
<span class="survey-questions__priority-item-text hide-on-dragging" data-bind="text: $parent.texts().variants[$data.id]"></span>
</div>
<!-- /ko -->
<validation-feedback params="show: $component.formControlErrorStateMatcher(question.variants), text: question.variants.error">
</validation-feedback>
</div>
<!-- ko if: question.commentEnabled -->
<div class="comment-card">
<label class="form-label" data-bind="text: $component.texts().commentLabel"></label>
<textarea name="answer" class="form-control" data-bind="attr: {
'data-min':question.textFieldParam.min,
'data-max':question.textFieldParam.max,
'maxlength':question.textFieldParam.max,
placeholder: $component.texts().placeholderText,
},
css: {
'is-invalid': $component.formCommentState(customTextInput) && $component.root.isSubmitted()
},
textInput: customTextInput"></textarea>
<!-- ko template: {
foreach: templateIf($component.formCommentState(customTextInput) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formCommentState(customTextInput) || ''"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }">
<!-- ko template: { afterRender: $component.onInit.bind($component) } -->
<div class="survey-questions__wrapper_pre px-2" data-bind="descendantsComplete: function() {
setTimeout(window.dispatchEvent(new Event('resize')));
}">
<div class="row">
<div class="col-12 central">
<div class="survey-questions__preview survey-question-media-variants__preview" data-bind="css: {
'survey-questions__preview_almost_transparent':$component.type !== 0
}">
<div class="survey-new-types-media-variants-slider" data-bind="mediaVariantsSwiperSlider, swiperInstance: $component.slider, event: {
'change.slide': function() {
}
}, attr: { 'data-slides': $component.variants.length }">
<!-- ko if: $component.showSliderArrows -->
<div class="js-slider-prev-btn swiper-slider-control swiper-slider-control--prev">
<i class="far fa-long-arrow-left"></i>
</div>
<div class="js-slider-next-btn swiper-slider-control swiper-slider-control--next">
<i class="far fa-long-arrow-right"></i>
</div>
<!-- /ko -->
<div class="survey-questions__slider swiper-container">
<div class="swiper-wrapper">
<!-- ko ifnot: $component.variants.length -->
<div class="swiper-slide swiper-slide--empty">
<div class="swiper-slide__media">
<i data-bind="css: {
'i-icon-photo': $component.mediaType == 'image',
'i-icon-video': $component.mediaType == 'video',
}"></i>
</div>
</div>
<!-- /ko -->
<!-- ko foreach: { data: $component.variants, as: 'variant' } -->
<div class="swiper-slide" data-bind="css: { 'swiper-slide--empty': !variant.url,
'checked': variant.checked }, let: { inputId: 'check_'+ variant.id +'_'+$index() }">
<div class="swiper-slide__media">
<!-- ko if: $component.variantsData()[variant.id].url -->
<input class="swiper-slide__input" data-bind="attr: {
id: inputId,
name: 'answer[]',
type: variantsType,
}, checked: variant.checked,
disable: $component.blocked() && !variant.checked(),
event: {
change: function(_, e) {
console.log('toggle', e.target.checked, $data);
$component.question.toggleVariant($data, e.target.checked);
}
}
" hidden="">
<label class="swiper-slide__check" data-bind="attr: {
'for': inputId
}">
<i class="i-check-icon"></i>
<span data-bind="text: $component.translator.t('Выбрать')"></span>
</label>
<label class="swiper-slide__checked-curtain" data-bind="click: function(_, e) {
e.stopPropagation();
checked(false);
}"></label>
<img class="survey-questions__question-object-content-img" data-bind="attr:{'src': $component.variantsData()[variant.id].poster},
fancyboxGalleryItem: {
gallery: $component.fancyGallery,
index: $index(),
}">
<!-- ko if: $component.mediaType == 'video' -->
<i class="icon icon-play-button"></i>
<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: variant.url -->
<i data-bind="css: {
'i-icon-photo': $component.mediaType == 'image',
'i-icon-video': $component.mediaType == 'video',
}"></i>
<!-- /ko -->
</div>
<!-- ko if: variant.description -->
<div class="swiper-slide__description" data-bind="text: $component.variantsData()[variant.id].description"></div>
<!-- /ko -->
</div>
<!-- /ko -->
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-block text-center">
<!-- ko template: {
foreach: templateIf($component.formControlErrorStateMatcher($component.question.variantsValidation)(), $data),
afterAdd: fadeAfterAddFactory(450),
beforeRemove: fadeBeforeRemoveFactory(450)
} -->
<div class="form-error" data-bind="text: $component.question.variantsValidation.error()"></div>
<!-- /ko -->
</div>
<!-- ko template: {
foreach: templateIf($component.hasComment, $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<!-- ko template: {
foreach: templateIf(!question.skip || !question.skipped(), $data),
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<div class="">
<div class="form-group survey-questions__media-variants-comment survey-comment px-0">
<label class="form-label" data-bind="text: $component.texts().commentLabel"></label>
<textarea name="comment" class="survey-questions__form-textarea form-control my-0" data-bind="attr: {
'data-min':$component.textFieldParams.min,
'data-max':$component.textFieldParams.max,
'maxlength':$component.textFieldParams.max,
'placeholder': $component.texts().placeholderText
},css: {
'is-invalid': formControlErrorStateMatcher(question.comment)
}, textInput: $component.comment"></textarea>
<!-- ko template: {
foreach: $component.formControlErrorStateMatcher($component.comment),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.comment.error"></div>
<!-- /ko -->
</div>
</div>
<!-- /ko -->
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip survey-questions__skip-answer mb-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2" data-bind="descendantsComplete: function() {
setTimeout(window.dispatchEvent(new Event('resize')));
}">
<div class="row">
<div class="col-12 central">
<div class="survey-questions__preview survey-question-media-variants__preview" data-bind="css: {
'survey-questions__preview_almost_transparent':$component.type !== 0
}">
<div class="survey-new-types-media-variants-slider" data-bind="mediaVariantsSwiperSlider, swiperInstance: $component.slider, event: {
'change.slide': function() {
}
}, attr: { 'data-slides': $component.variants.length }">
<!-- ko if: $component.showSliderArrows -->
<div class="js-slider-prev-btn swiper-slider-control swiper-slider-control--prev">
<i class="far fa-long-arrow-left"></i>
</div>
<div class="js-slider-next-btn swiper-slider-control swiper-slider-control--next">
<i class="far fa-long-arrow-right"></i>
</div>
<!-- /ko -->
<div class="survey-questions__slider swiper-container">
<div class="swiper-wrapper" data-bind="css: {
'justify-content-center': $component.variants.length == 1
}">
<!-- ko ifnot: $component.variants.length -->
<div class="swiper-slide swiper-slide--empty">
<div class="swiper-slide__media">
<i class="i-icon-photovideo"></i>
</div>
<div class="">
<div class="survey-question__assessment-type-selector-rating" data-bind="component: { name: 'rating', params: { value: ko.observable(4), isCanChange: true } }">
</div>
<input type="hidden" data-bind="value: 4">
</div>
</div>
<!-- /ko -->
<!-- ko foreach: { data: $component.variants, as: 'variant' } -->
<div class="swiper-slide" data-bind="css: { 'swiper-slide--empty': !variant.url,}, let: { inputId: 'check_'+ variant.id +'_'+$index() }">
<div class="swiper-slide__media">
<!-- ko if: $component.texts().gallery[variant.id].url -->
<img class="survey-questions__question-object-content-img" data-bind="attr:{'src': $component.texts().gallery[variant.id].poster},
fancyboxGalleryItem: {
gallery: $component.variants.map(function(v) {
return {
src: $component.texts().gallery[v.id].url,
opts: {
caption: $component.texts().gallery[v.id].description || '',
}
};
}),
index: $index(),
}">
<!-- ko if: $component.isVideo(variant) -->
<i class="icon icon-play-button"></i>
<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: $component.texts().gallery[variant.id].url -->
<i class="i-icon-photovideo"></i>
<!-- /ko -->
</div>
<!-- ko if: $component.texts().gallery[variant.id].description -->
<div class="swiper-slide__description text-center" style="font-size: 15px;" data-bind="text: $component.texts().gallery[variant.id].description"></div>
<!-- /ko -->
<div class="">
<div class="survey-question__assessment-type-selector-rating" data-bind="component: {
name: 'rating',
params: {
value: $component.stars[variant.id],
isCanChange: true,
onChange: function() {
$component.scrollToNext(variant.id);
}
}
}">
</div>
<!-- ko if: $component.hasValue -->
<input type="hidden" data-bind="attr: { name: 'answer[' + variant.id + ']' }, value: $component.stars[variant.id]()">
<!-- /ko -->
</div>
</div>
<!-- /ko -->
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-block text-center">
<!-- ko template: {
foreach: templateIf(!question.skipped() && $component.isRequired && !$component.isValid() && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(450),
beforeRemove: fadeBeforeRemoveFactory(450)
} -->
<div class="form-error" data-bind="text: $component.translator.t('Нужно поставить оценку')"></div>
<!-- /ko -->
</div>
<!-- ko template: {
foreach: templateIf((!question.skip || !question.skipped()) && $component.isHaveComment, $data),
afterAdd: slideAfterAddFactory(200),
beforeRemove: slideBeforeRemoveFactory(200),
} -->
<div class="survey-questions__collapse-textarea">
<label class="form-label mb-0" data-bind="text: $component.texts().commentLabel"></label>
<div class="form-group survey-questions__media-variants-comment survey-comment px-0">
<textarea name="answer" class="form-control" data-bind="attr: {
'data-min':question.textFieldParam.min,
'data-max':question.textFieldParam.max,
'maxlength':question.textFieldParam.max,
placeholder: $component.texts().placeholderText,
},
css: {
'is-invalid': $component.formCommentState(customTextInput) && $component.root.isSubmitted()
},
textInput: customTextInput"></textarea>
<!-- ko template: {
foreach: templateIf(formCommentState(customTextInput) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formCommentState(customTextInput) || 'hhhhh'"></div>
<!-- /ko -->
</div>
</div>
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip survey-questions__skip-answer mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2" data-bind="css: {
'with-comment': $component.commentController.enabled
}">
<div class="row">
<div class="col-12">
<div class="survey-questions__preview survey-question-media-variants__preview" data-bind="css: {
'survey-questions__preview_almost_transparent':$component.type !== 0
}">
<!-- ko if: $component.galleryEnabled -->
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
<!-- /ko -->
</div>
</div>
</div>
<div class="mx-auto mt-1">
<!-- ko template: {
name: 'smile-rating-controller-template',
data: {
controller: $component.ratingController,
isSmall: question.galleryController.gallery.length > 0,
showLabels: question.showLabels,
labels: $component.texts().labels
}
} -->
<!-- /ko -->
</div>
<div class="d-block text-center">
<!-- ko template: {
foreach: templateIf(formControlErrorStateMatcher($component.ratingController)(), $data),
afterAdd: fadeAfterAddFactory(450),
beforeRemove: fadeBeforeRemoveFactory(450)
} -->
<div class="form-error" data-bind="text: $component.ratingController.error"></div>
<!-- /ko -->
</div>
<!-- ko if: question.commentEnabled -->
<div class="comment-card">
<label class="form-label" data-bind="text: $component.texts().commentLabel"></label>
<textarea name="answer" class="form-control" data-bind="attr: {
'data-min':question.textFieldParam.min,
'data-max':question.textFieldParam.max,
'maxlength':question.textFieldParam.max,
placeholder: $component.texts().placeholderText,
},
css: {
'is-invalid': $component.formCommentState(customTextInput) && $component.root.isSubmitted()
},
textInput: customTextInput"></textarea>
<!-- ko template: {
foreach: templateIf($component.formCommentState(customTextInput) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formCommentState(customTextInput) || ''"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<div class="row">
<div class="col-12">
<div class="survey-questions__preview survey-question-media-variants__preview" data-bind="css: {
'survey-questions__preview_almost_transparent':$component.type !== 0
}">
<!-- ko if: $component.galleryEnabled -->
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
<!-- /ko -->
</div>
</div>
</div>
<!-- ko if: question.isVariants -->
<div class="nps-variants mb-10p">
<!-- ko foreach: { data: question.variantsList, as: 'variant' } -->
<div class="nps-variant">
<div class="nps-variant__label text-center mb-15p" data-bind="text: $parent.texts().variants[variant.id]"></div>
<div class="nps-variant__rating">
<!-- ko template: {
name: 'nps-rating-controller-template',
data: {
controller: question.ratingController,
fromOne: question.fromOne,
texts: $component.texts,
npsValue: variant.stars
}
} -->
<!-- /ko -->
</div>
</div>
<!-- /ko -->
</div>
<!-- ko template: {
foreach: templateIf(formControlErrorStateMatcher(question.variantsList)(), $data),
afterAdd: fadeAfterAddFactory(450),
beforeRemove: fadeBeforeRemoveFactory(450)
} -->
<div class="form-error text-center w-100" style="margin-top: 16px;" data-bind="text: question.variantsList.error"></div>
<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: question.isVariants -->
<div class="mx-auto">
<!-- ko template: {
name: 'nps-rating-controller-template',
data: {
controller: question.ratingController,
fromOne: question.fromOne,
texts: texts
}
} -->
<!-- /ko -->
</div>
<div class="d-block text-center">
<!-- ko template: {
foreach: templateIf(formControlErrorStateMatcher(question.ratingController)(), $data),
afterAdd: fadeAfterAddFactory(450),
beforeRemove: fadeBeforeRemoveFactory(450)
} -->
<div class="form-error" style="margin-top: 16px;" data-bind="text: question.ratingController.error"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.commentEnabled -->
<div class="comment-card pt-4">
<label class="form-label" data-bind="text: $component.texts().commentLabel"></label>
<textarea name="answer" class="form-control" data-bind="attr: {
'data-min':question.textFieldParam.min,
'data-max':question.textFieldParam.max,
'maxlength':question.textFieldParam.max,
placeholder: $component.texts().placeholderText,
},
css: {
'is-invalid': $component.formCommentState(customTextInput) && $component.root.isSubmitted()
},
textInput: customTextInput"></textarea>
<!-- ko template: {
foreach: templateIf($component.formCommentState(customTextInput) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formCommentState(customTextInput) || ''"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko if: question.initing --> Loading... <!-- /ko -->
<!-- ko ifnot: question.initing -->
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<div class="row">
<div class="col-12">
<div class="survey-questions__preview survey-question-media-variants__preview" data-bind="
css: {
'survey-questions__preview_almost_transparent': $component.type !== 0,
},
">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
</div>
</div>
</div>
<!-- ko template: {
name: 'matrix-controller-template',
data: {
controller: $component.matrixController,
texts: texts,
translation: translation,
},
} -->
<!-- /ko -->
<!-- ko template: {
foreach: templateIf(!question.skip || !question.skipped(), $data),
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400),
} -->
<!-- ko template: {
name: 'comment-controller-template',
data: {
controller: $component.commentController,
texts: texts,
},
} -->
<!-- /ko -->
<!-- /ko -->
<!-- ko if: question.skip && !question.skipVariant -->
<div class="stars-skip mt-4">
<fc-check params="checked: question.skipped, label: $component.texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko if: question.initing --> Loading... <!-- /ko -->
<!-- ko ifnot: question.initing -->
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<div class="row">
<div class="col-12">
<div class="survey-questions__preview survey-question-media-variants__preview" data-bind="
css: {
'survey-questions__preview_almost_transparent': $component.type !== 0,
},
">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
</div>
</div>
</div>
<!-- ko template: {
name: 'matrix-3d-controller-template',
data: {
controller: $component.matrixController,
texts: texts,
translation: translation,
},
} -->
<!-- /ko -->
<!-- ko template: {
foreach: templateIf(!question.skip || !question.skipped(), $data),
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400),
} -->
<!-- ko template: {
name: 'comment-controller-template',
data: {
controller: $component.commentController,
texts: texts,
},
} -->
<!-- /ko -->
<!-- /ko -->
<!-- ko if: question.skip && !question.skipVariant -->
<div class="stars-skip mt-4 matrix-3d__skip-check">
<fc-check params="checked: question.skipped, label: $component.texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
<!-- ko component: {
name: 'diff-controller-view',
params: {
controller: question.diffController,
formControlErrorStateMatcher: $component.formControlErrorStateMatcher,
texts: texts
}
} -->
<!-- /ko -->
<!-- ko if: question.commentEnabled -->
<div class="comment-card pt-4">
<label class="form-label" data-bind="text: $component.texts().commentLabel"></label>
<textarea name="answer" class="form-control" data-bind="
attr: {
'data-min':question.textFieldParam.min,
'data-max':question.textFieldParam.max,
'maxlength':question.textFieldParam.max,
placeholder: $component.texts().placeholderText,
},
css: {
'is-invalid': $component.formCommentState(question.commentValue) && $component.root.isSubmitted(),
},
textInput: question.commentValue,
"></textarea>
<!-- ko template: {
foreach: templateIf($component.formCommentState(question.commentValue) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200),
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formCommentState(question.commentValue) || ''"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
<!-- ko template: {
name: 'survey-new-types-stars-template-stars',
data: {
question: question,
showLabels: question.showLabels,
showNumbers: question.showNumbers,
formControlErrorStateMatcher: formControlErrorStateMatcher,
labels: texts().labels
}
} -->
<!-- /ko -->
<!-- ko template: {
foreach: templateIf(!question.skip || !question.skipped(), $data),
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<!-- ko template: {
foreach: templateIf(question.hasComment, $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="survey-questions__collapse-textarea">
<!-- ko template: {
name: 'survey-new-types-stars-comment-template',
texts: texts
} -->
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko template: {
foreach: templateIf(question.isClarifyingQuestionVisible(), $data),
name: 'survey-new-types-stars-clarifying-question-template',
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<!-- /ko -->
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }, element: element">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2" data-bind="
css: {
'has-gallery': question.galleryController.gallery.length
}
">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
</div>
<!-- /ko -->
<div class="star-variants mb-10p">
<!-- ko foreach: { data: question.variantsList, as: 'variant' } -->
<div class="star-variant">
<div class="star-variant__label text-center mb-15p" data-bind="
text: variant.id == -1 || !$parent.texts().variants[variant.id].length ? $data.value : $parent.texts().variants[variant.id],
css: {
'star-variant-element--disabled': variant.skipped,
},
"></div>
<div class="star-variant__rating" data-bind="
css: {
'star-variant-element--disabled': variant.skipped,
},
">
<!-- ko template: {
name: 'survey-new-types-star-variants-template-stars',
data: {
variant: variant,
question: question,
formControlErrorStateMatcher: $component.formControlErrorStateMatcher,
texts: $parent.texts
}
} -->
<!-- /ko -->
</div>
<!-- ko template: {
foreach: templateIf('isClarifyingQuestionVisible' in variant && variant.isClarifyingQuestionVisible(), $parent),
name: 'survey-new-types-star-variants-clarifying-question-template',
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<!-- /ko -->
<!-- ko if: question.skipVariant -->
<div style="color:#73808D" class="scale-skip mt-4">
<fc-check params="checked: variant.skipped, label: $parent.texts().skipText"></fc-check>
</div>
<!-- /ko -->
<!-- ko if: variant.skipped -->
<div class="star-variant__cloak" data-bind="
click: function(e) { question.disableVariantSkip(e, question) },
"></div>
<!-- /ko -->
</div>
<!-- /ko -->
</div>
<!-- ko template: {
foreach: templateIf(question.hasComment, $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="survey-questions__collapse-textarea">
<!-- ko template: {
name: 'survey-new-types-star-variants-comment-template'
} -->
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.skip && !question.skipVariant -->
<div class="stars-skip mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
<div class="rating-scale" data-bind="style: {
'--fc-rating-scale-color': question.color
}">
<div class="rating-scale__wrapper">
<!-- ko foreach: { data: Array(question.count), as: 'star' } -->
<div class="rating-scale__item" data-bind="
click: function() {
if (question.stars() === starIndex() + 1) {
question.stars(0);
return;
}
question.stars(starIndex() + 1);
},
css: {
active: question.stars() === starIndex() + 1
},
">
<span data-bind="text: starIndex() + 1"></span>
</div>
<!-- /ko -->
</div>
<!-- ko if: label -->
<div class="rating-scale__label" data-bind="text: label"></div>
<!-- /ko -->
<!-- ko template: {
foreach: templateIf(formControlErrorStateMatcher(question.stars)(), $data),
afterAdd: fadeAfterAddFactory(450),
beforeRemove: fadeBeforeRemoveFactory(450)
} -->
<div class="text-center">
<div class="form-error" data-bind="text: question.stars.error"></div>
</div>
<!-- /ko -->
</div>
<!-- ko template: {
foreach: templateIf(!question.skip || !question.skipped(), $data),
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<!-- ko template: {
foreach: templateIf(question.hasComment, $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="survey-questions__collapse-textarea">
<!-- ko template: {
name: 'survey-new-types-rating-comment-template',
texts: texts
} -->
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko template: {
foreach: templateIf(question.isClarifyingQuestionVisible(), $data),
name: 'survey-new-types-rating-clarifying-question-template',
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<!-- /ko -->
<!-- /ko -->
<!-- ko if: question.skip -->
<div class="stars-skip mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-'+questionId }, element: element">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2" data-bind="css: {
'has-gallery': question.galleryController.gallery.length
}">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
</div>
<!-- ko if: question.dropdownVariants -->
<!-- ko if: question.loading -->
<fc-spinner class="f-color-primary"></fc-spinner>
<!-- /ko -->
<!-- ko ifnot: question.loading -->
<fc-select class="categorized" params="options: question.firstLevel, value: question.selectedFirstLevel, searchable: true,
invalid: formControlErrorStateMatcher(question.selectedFilial)() && !question.selectedFirstLevel()
">
<template data-slot="option">
<span data-bind="text: $data.text, css: {
bold: $data.isCategory
}"></span>
</template>
<template data-slot="result">
<span data-bind="text: $data.text, css: {
bold: $data.isCategory
}"></span>
</template>
</fc-select>
<!-- ko template: {
foreach: templateIf(question.hasSecondLevel(), $data),
afterAdd: slideAfterAddFactory(400),
beforeRemove: slideBeforeRemoveFactory(400)
} -->
<div class="mt-4">
<fc-select class="categorized" params="options: question.secondLevel, value: question.selectedSecondLevel, searchable: true,
invalid: formControlErrorStateMatcher(question.selectedFilial)"></fc-select>
</div>
<!-- /ko -->
<fc-error params="show: formControlErrorStateMatcher(question.selectedFilial),
text: question.selectedFilial.error"></fc-error>
<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: question.dropdownVariants -->
<!-- ko template: {
name: 'variants-controller-template',
data: {
controller: question.variantsController,
formControlErrorStateMatcher: formControlErrorStateMatcher,
texts: texts
}
} -->
<!-- /ko -->
<!-- /ko -->
<!-- /ko -->
<div class="mobile-wide">
<!-- ko template: {
name: 'comment-controller-template',
data: {
controller: $component.commentController,
texts: $component.texts
}
} -->
<!-- /ko -->
</div>
</form><form data-bind="attr: { id: 'answer-form-'+questionId }, element: element">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2" data-bind="css: {
'has-gallery': question.galleryController.gallery.length
}">
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
</div>
<div class="classifier-wrapper" data-bind="css: {
'skipped': question.skipped
}">
<!-- ko if: question.loading -->
<fc-spinner class="f-color-primary"></fc-spinner>
<!-- /ko -->
<!-- ko if: !question.loading() && question.empty() -->
<div></div>
<!-- /ko -->
<!-- ko if: !question.loading() && !question.empty() -->
<!-- ko if: !question.dropdown && question.listType !== 'tree' -->
<div data-bind="template: {
name: 'classifier-plain-list-template'
}"></div>
<!-- /ko -->
<!-- ko if: !question.dropdown && question.listType === 'tree' -->
<div data-bind="template: {
name: 'classifier-tree-template'
}"></div>
<!-- /ko -->
<!-- ko if: question.dropdown && question.listType !== 'tree' -->
<div data-bind="template: {
name: 'classifier-select-template'
}"></div>
<!-- /ko -->
<!-- ko if: question.dropdown && question.listType === 'tree' -->
<div data-bind="template: {
name: 'classifier-tree-select-template'
}"></div>
<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: question.dropdown && question.listType === 'tree' -->
<fc-error params="show: root.isSubmitted() && !question._isValid(), text: validationTranslator.t('Нужно выбрать хотя бы один вариант ответа')"></fc-error>
<!-- /ko -->
</div>
<div class="mobile-wide">
<!-- ko template: {
foreach: templateIf(!question.skip || !question.skipped(), $data),
afterAdd: slideAfterAddFactory(200),
beforeRemove: slideBeforeRemoveFactory(200),
} -->
<!-- ko template: {
name: 'comment-controller-template',
data: {
controller: $component.commentController,
texts: $component.texts
}
} -->
<!-- /ko -->
<!-- /ko -->
</div>
<!-- ko if: question.skip -->
<div class="stars-skip mt-4 mobile-wide">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
<!-- /ko -->
</form><form data-bind="attr: { id: 'answer-form-' + questionId }">
<!-- ko template: { afterRender: onInit } -->
<div class="survey-questions__wrapper_pre px-2">
<div class="row">
<div class="col-12">
<!-- ko if: $component.galleryEnabled -->
<!-- ko component: {
name: 'gallery-controller-view',
params: {
controller: question.galleryController,
translation: translation
}
} -->
<!-- /ko -->
<!-- /ko -->
</div>
</div>
<div class="scale-variants">
<!-- ko if: question.isVariants -->
<!-- ko foreach: { data: question.variantsList, as: 'variant' } -->
<div class="scale-variant">
<div class="scale-wrapper" style="position: relative" data-bind="
let: {
scaleValue: variant.scales ? variant.scales : question.ratingController.value
},
">
<div class="scale-variant__label text-center mb-15p" data-bind="text: $parent.texts().variants[variant.id]"></div>
<div class="form-group">
<div data-bind="class: 'scale-slider__skipped-'+question.skipped()">
<fc-range params="
value: scaleValue,
min: question.minValue,
max: question.maxValue,
tooltips: true,
step: question.stepValue,
disabled: variant.skipped,
"></fc-range>
</div>
</div>
<div class="current-value-display text-center">
<input type="number" class="form-control form-control_scale" style="text-align:center; cursor:default" maxlength="7" data-bind="
selectOnFocus,
numeric,
value: scaleValue,
attr: {
disabled: variant.skipped,
},
">
</div>
<!-- ko if: variant.skipped -->
<div class="scale-variant__cloak" data-bind="
click: function(e) { question.disableVariantSkip(e, question) },
"></div>
<!-- /ko -->
</div>
<!-- ko if: question.skipVariant -->
<div style="color:#73808D" class="scale-skip mt-4">
<fc-check params="checked: variant.skipped, label: $parent.texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: question.isVariants -->
<div class="scale-wrapper" data-bind="let: { scaleValue: question.ratingController.value }">
<div class="form-group">
<div data-bind="class: 'scale-slider__skipped-'+question.skipped()">
<fc-range params="
value: scaleValue,
min: question.minValue,
max: question.maxValue,
tooltips: true,
step: question.stepValue
"></fc-range>
</div>
</div>
<div class="current-value-display text-center">
<input class="form-control" type="number" maxlength="7" style="text-align:center; cursor:default" data-bind="selectOnFocus, numeric, value: scaleValue">
</div>
</div>
<!-- /ko -->
</div>
<div class="scale-table-size">
<!-- ko if: $component.commentController.enabled -->
<div class="comment-card pt-4">
<label class="form-label" data-bind="text: $component.texts().commentLabel"></label>
<textarea name="answer" class="form-control" data-bind="attr: {
'data-min':question.textFieldParam.min,
'data-max':question.textFieldParam.max,
'maxlength':question.textFieldParam.max,
placeholder: $component.texts().placeholderText,
},
css: {
'is-invalid': $component.formCommentState(customTextInput) && $component.root.isSubmitted()
},
textInput: customTextInput"></textarea>
<!-- ko template: {
foreach: templateIf($component.formCommentState(customTextInput) && $component.root.isSubmitted(), $data),
afterAdd: fadeAfterAddFactory(200),
beforeRemove: fadeBeforeRemoveFactory(200)
} -->
<div class="form-error form-error_inner js-textarea-error" data-bind="text: $component.formCommentState(customTextInput) || ''"></div>
<!-- /ko -->
</div>
<!-- /ko -->
<!-- ko if: question.skip && !question.skipVariant -->
<div style="color:#73808D" class="scale-skip mt-4">
<fc-check params="checked: question.skipped, label: texts().skipText"></fc-check>
</div>
<!-- /ko -->
</div>
</div>
<!-- /ko -->
</form>Text Content
Заголовок Текст раздела Отправлена жалоба № Будете ли вы советовать наш магазин знакомым? 0 1 2 3 4 5 6 7 8 9 10 Далее Заголовок Текст раздела Отправлена жалоба № Опрос успешно пройден! Вы будете отписаны от рассылки Отписаться Я хочу остаться Вы отписаны от рассылки -------------------------------------------------------------------------------- : : Loading... Loading...