Viewing File: /home/ubuntu/misabloom-backend-base/resources/views/admin/sub_categories/_form.blade.php

<div class="card card-flush py-4">
	<div class="card-header">
		<div class="card-title m-0">
			<h3 class="fw-bolder m-0"> {{ request()->sub_category_id ? tr('edit_sub_category') : tr('add_sub_category') }} </h3> </div>
		<div class="card-toolbar">
			<div class="d-flex justify-content-end" data-kt-sub_category-table-toolbar="base">
				<a href="{{ route('admin.sub_categories.index') }}" class="btn btn-primary me-3" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end"> <span class="svg-icon svg-icon-2"> <i class="las la-list fs-2x"> </i> {{ tr('view_sub_categories')}} </span> </a>
			</div>
		</div>
	</div>
	<hr class="text-gray-500">
	<div class="card-body">
		<div class="d-flex flex-column gap-5 gap-md-7">
			<form class="form" method="POST" action="{{ route('admin.sub_categories.save') }}" enctype="multipart/form-data">
				<input type="hidden" name="sub_category_id" value="{{ $sub_category->id }}"> 
				@csrf
				<div class="d-flex flex-column flex-md-row gap-5">
					<div class="flex-row-fluid">
						<label class="required form-label">{{ tr('name') }}</label>
						<input class="form-control" type="text" name="name" placeholder="{{ tr('name') }}" value="{{ old('name', $sub_category->name) }}" required title="{{ tr('name') }}" />
					</div>

					<div class="fv-row flex-row-fluid">
						<label class="required form-label">{{ tr('category') }}</label>
		                <select class="form-select form-select-solid" data-control="select2" name="category_id" required>
		                    <option value="" selected disabled> {{ tr('select_category') }} </option>
		                    @foreach($categories as $category)
		                    	<option value="{{ $category->id }}" @if(old('category_id') == $category->id || $sub_category->category_id == $category->id || request()->category_id == $category->id) selected @endif> {{ $category->name }} </option>
		                    @endforeach
		                </select>
					</div>
				
				</div>

				<div class="d-flex flex-column flex-md-row gap-5 mt-10">
					<div class="flex-row-fluid w-310">
						<label class="form-label">{{ tr('picture') }}</label>
						<label class="text-muted">{{ tr('default_image_note') }}</label>
						<input class="form-control" type="file" name="picture" accept=".png, .jpg, .jpeg" id="mainFile"/>
						@if($sub_category->picture)
                        	<img class="category-picture" src="{{$sub_category->picture}}" alt="{{$sub_category->name}}" id="imgPreview" />
                        @else
                        	<img class="category-picture" src="" id="imgPreview" />
                        @endif
					</div>
				</div>

				<div class="d-flex flex-column flex-md-row gap-5">
					<div class="flex-row-fluid">
						<label class="form-label required">{{ tr('description') }}</label>
						<textarea id="ckeditor_classic" rows="10" class="form-control" name="description" placeholder="{{ tr('description') }}" required title="{{ tr('description') }}" /> {{ old('description', $sub_category->description) }} </textarea>
					</div>
				</div>

				<div class="d-flex justify-content-end mt-10">
					<a href="{{ route('admin.sub_categories.index') }}" class="btn btn-warning btn-active-light-primary me-2 fs-4"><i class="las la-times-circle fs-2x"></i>{{ tr('cancel') }}</a>
					<button type="submit" class="btn btn-primary fs-4"  {{ Setting::get( 'is_demo_control_enabled') ? 'disabled' : ''}}><i class="las la-check-circle fs-2x"></i>{{ tr('submit') }}</button>
				</div>
			</form>
		</div>
	</div>
</div>
</div>
</div>
</div>

<script type="text/javascript">
    mainFile.onchange = e => {
        const [file] = mainFile.files;
        if(file) {
            imgPreview.src = URL.createObjectURL(file)
        }
    }
</script>