Сижу вот и думаю как можно решить вопрос. У меня есть динамическая страница, на которой выводится текст, название страницы, и собственно список, состоящий из нескольких пунктов. 2 последних пункта отличаются от других тем, что у них вместо текста массивом должны выводиться картинки. Вот собственно сами пункты:
<div class="specifications">
<div class="specifications_desc">
<div class="specifications_desc_item">
<div class="specifications_desc_item_title">Срок</div>
<div class="specifications_desc_item_desc">от 15 до 126 дней</div>
</div>
<div class="specifications_desc_item">
<div class="specifications_desc_item_title">Возраст</div>
<div class="specifications_desc_item_desc">от 20 до 70 дней</div>
</div>
<div class="specifications_desc_item">
<div class="specifications_desc_item_title">График работы:</div>
<div class="specifications_desc_item_desc">Круглосуточно</div>
</div>
// Вот 2 пункта с картинками
<div class="specifications_desc_item">
<div class="specifications_desc_item_title">
Способ<br />
выплаты:
</div>
<div class="specifications_desc_item_desc">
<div>
<img
src="~/assets/images/table/deposit-icons/bank.svg"
alt="Иконка здания банка"
/>
<img
src="~/assets/images/table/deposit-icons/cart.svg"
alt="Иконка карточки"
/>
<img
src="~/assets/images/table/deposit-icons/elpayment.svg"
alt="Иконка платежной системы CONTACT "
/>
</div>
</div>
</div>
<div class="specifications_desc_item">
<div class="specifications_desc_item_title">
Способ<br />
погашения:
</div>
<div class="specifications_desc_item_desc">
<div>
<img
src="~/assets/images/table/deposit-icons/bank.svg"
alt="Иконка здания банка"
/>
<img
src="~/assets/images/table/deposit-icons/cart.svg"
alt="Дебетовая карточка"
/>
<img
src="~/assets/images/table/deposit-icons/paymentel.svg"
alt="Иконка сети терминалов Элекснет"
/>
</div>
</div>
</div>
</div>
Делаю запрос на бек, получаю данные из которых, беру массив списка и прогоняю через цикл. Сам массив я получаю с объектами внутри. И этот массив состоит вот так:
data() {
specifications: [
{
name: 'Сумма, руб',
caption: '',
placeholder: '1 000 - 50 000'
},
{
name: 'Срок',
caption: '',
placeholder: 'от 15 до 165 ддней'
},
{
name: 'Ставка в день',
caption: '',
placeholder: '0 %'
},
{
name: 'Документы',
caption: '',
placeholder: 'Паспорт'
},
{
name: 'Возраст',
caption: '',
placeholder: 'от 18 до 45 лет'
},
{
name: 'Идентификация',
caption: '',
placeholder: 'Фото'
},
{
name: 'График работы',
caption: '',
placeholder: 'Круглосуточно'
},
{
name: 'Переплата',
caption: '0 руб'
},
{
name: 'Продление',
caption: 'Да'
},
{
name: 'Плохая КИ',
caption: 'Да'
},
{
name: 'Способ выплаты',
images: // Массив с картинками (названиями)
},
{
name: 'Способ погашения',
images: // Массив с картинками (названиями)
}
],
}
Вывести нет проблем, внутри цикла проверяю у кого из пункта есть свойство images, тогда и вывожу список картинок, а это у двух последних пункта. Вроде бы гуд, но проблема больше в самой обработке данных и правильной загрузке.
Я создал админку, в которой заполняю поля как и сам массив с объектами и потом сохраняю в базу данных и впоследствии вывожу на фронт в саму динамическую страницу.
Но в админке возникают большие вопросы:
1. Вывожу циклом в админке тот массив со списком и заполняю его через v-modal. Все работает, пусты поля заполняются и сохраняются. Но основной вопрос, как мне сохранить картинки по отдельным массивам?
У меня есть компонент, который загружает картинки все в одну папку. При сохранении я возвращаю массив с именами картинок всех. Но мне нужно разделить их на массив картинок для одного пункта и массив картинок для второго пункта. И иметь массив тех картинок, которые нужно вывести просто на странице вместе с текстом.
2. Главное то, что картинки в пунктах будут почти всегда переиспользоваться, соответственно загружать по 500 раз это не вариант. Мне нужно получать массив как и новых картинок так и старых, чтобы потом во фронте по ним проходиться и выводить. Тоесть я должен подгружать имена картинок из сервера, путем чтения самих картинок из папки, а затем при клике добавлять их в массив.
Задумка такая, что в админке при заполнении пунктов я мог выбирать имена картинок, которые сохранялись бы в массив, но если какой-то картинки не хватает, я мог ее загрузить и тоже добавить в этот массив.