Не могу разобраться, помогите пожалуйста, если у вас есть время
нужно придумать как можно удалять существующие картинки, загрузка новых картинок и вывод из базы картинок при редактировании
Добавление сделал по аналогии добавления товара. Осталось удаление и показ картинок данного товара. Вывод товара примерно набросал
public function edit($id)
{
$categories = Product::whereNull('category_id')->with('childrenCategories')->get();
$product = Product::where('id',$id)->first();
return view('product.edit', compact('categories','product'));
}
public function edit_store(Request $request, $id)
{
$this->validate($request, [
'title' => 'required',
'slug' => 'required|unique:products',
'text' => 'required',
'path.*' => 'nullable|image',
]);
$product = Product::find($id);
$product->title = $request->input('title');
$product->slug = $request->input('slug');
$product->text = $request->input('text');
$product->keywords = $request->input('keywords');
$product->description = $request->input('description');
$product->published = $request->input('published');
$product->category_id = $request->input('category_id');
$product->price = $request->input('price');
$product->authorized_price = $request->input('authorized_price');
$product->short_description = $request->input('short_description');
$product->save();
$path =public_path().'/uploads/product_images/';
$file = $request->file('path');
foreach ($file as $f) {
$filename = Str::random(20) .'.' . $f->getClientOriginalExtension() ?: 'png';
$img = ImageInt::make($f);
$img->resize(500,500)->save($path . $filename);
$image = new Image();
$image->path = '/uploads/product_images/'.$filename;
$image->title = $request->input('title');
$image->product_id = $product->id;
$image->save();
}
return redirect('/product/edit/'.$product->id)->with('info', 'Данные сохранены');
}
<input type="file" name="path[]" id="path[]" multiple accept="image/*">
<div id="for_preview_uploads">
</div>
<script>
function resizeImage(img) {
const W = parseInt(img.width / 4);
const H = parseInt(img.height / 4);
const canvas = document.createElement("canvas");
canvas.width = W;
canvas.height = H;
const ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, W, H);
const resizedImg = new Image();
resizedImg.src = canvas.toDataURL('image/jpeg', 1);
document.querySelector("#for_preview_uploads").append(resizedImg);
}
function handleFiles(e) {
for (const file of this.files) {
const img = document.createElement("img");
const reader = new FileReader();
reader.addEventListener("load", (e) => {
img.addEventListener("load", (e) => {
resizeImage(img);
});
img.src = e.target.result;
});
reader.readAsDataURL(file);
}
}
const fileInput = document.getElementById("path[]");
fileInput.addEventListener("change", handleFiles, false);
</script>
@forelse ($products as $product)
<div class="products card" style="width: 18rem;">
<div class="card-body">
<p class="card-images">
@forelse ($product->images as $image)
<img src="{{$image->path }} " alt="{{$image->title}}">
@empty
Нет фотографий
@endforelse
</p>
</div>
</div>
@empty
<div>Нет товаров</div>
@endforelse
