mirror of https://github.com/4xmen/xshop.git
added live edit setting
parent
600273e0f6
commit
1d300cd039
@ -0,0 +1,48 @@
|
|||||||
|
var onEdit = '';
|
||||||
|
document.querySelector('#do-edit')?.addEventListener('click', function () {
|
||||||
|
this.style.display = 'none';
|
||||||
|
let editable = document.createElement('div');
|
||||||
|
editable.setAttribute('id', 'customizable');
|
||||||
|
editable.innerHTML = '<i class="ri-edit-2-line"></i> <b></b>';
|
||||||
|
document.body.appendChild(editable);
|
||||||
|
document.querySelectorAll('.live-setting')?.forEach(function (el) {
|
||||||
|
el.addEventListener('mouseenter', function () {
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
let rect = el.getBoundingClientRect();
|
||||||
|
onEdit = this.getAttribute('data-live');
|
||||||
|
document.querySelector('#customizable b').innerText = onEdit;
|
||||||
|
document.querySelector('#customizable').style.top = (window.scrollY + rect.top + 5) + 'px';
|
||||||
|
}, 50);
|
||||||
|
});
|
||||||
|
el.addEventListener('mouseleave', function () {
|
||||||
|
|
||||||
|
console.log(this.getAttribute('data-live'));
|
||||||
|
});
|
||||||
|
});
|
||||||
|
editable.addEventListener('click', function () {
|
||||||
|
if (document.querySelector('#customize-modal') == null) {
|
||||||
|
|
||||||
|
let custModal = document.createElement('div');
|
||||||
|
custModal.setAttribute('id', 'customize-modal');
|
||||||
|
custModal.innerHTML = '<iframe></iframe>';
|
||||||
|
document.body.appendChild(custModal);
|
||||||
|
custModal.addEventListener('click', function (e) {
|
||||||
|
if (e.target == this) {
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
document.querySelector('#customize-modal').style.display = 'block';
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('keyup',function (e) {
|
||||||
|
if (e.code == 'Escape'){
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
document.querySelector('#customize-modal iframe').setAttribute('src', document.querySelector('#live-url').value + onEdit);
|
||||||
|
|
||||||
|
});
|
||||||
|
});
|
@ -0,0 +1,49 @@
|
|||||||
|
@include('components.panel-header')
|
||||||
|
<div id="panel-preloader">
|
||||||
|
<div class="loader"></div>
|
||||||
|
</div>
|
||||||
|
<input type="hidden" id="panel-dir" @if(langIsRTL(config('app.locale'))) value="rtl" @else value="ltr" @endif>
|
||||||
|
<form action="{{route('admin.setting.update')}}" method="post" enctype="multipart/form-data">
|
||||||
|
@csrf
|
||||||
|
<div class="container pt-3" id="app">
|
||||||
|
|
||||||
|
@include('components.err')
|
||||||
|
@if(count($settings) == 0)
|
||||||
|
<h3 class="text-center pt-2">
|
||||||
|
{{__("There is nothing to show!")}}
|
||||||
|
</h3>
|
||||||
|
@else
|
||||||
|
<div class="row">
|
||||||
|
@foreach($settings as $setting)
|
||||||
|
@include('components.setting-field')
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
<button class="action-btn circle-btn"
|
||||||
|
data-bs-toggle="tooltip"
|
||||||
|
data-bs-placement="top"
|
||||||
|
data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Save all settings")}}"
|
||||||
|
>
|
||||||
|
<i class="ri-save-2-line"></i>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
|
||||||
|
@if(config('app.env') == 'production')
|
||||||
|
<button
|
||||||
|
href="{{getRoute('sort')}}"
|
||||||
|
class="action-btn circle-btn"
|
||||||
|
data-bs-toggle="tooltip"
|
||||||
|
data-bs-placement="top"
|
||||||
|
data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Save and build")}}"
|
||||||
|
name="build"
|
||||||
|
value="1"
|
||||||
|
style="inset-inline-end: 1.2rem;inset-inline-start: auto;"
|
||||||
|
>
|
||||||
|
<i class="ri-hammer-line"></i>
|
||||||
|
</button>
|
||||||
|
@endif
|
||||||
|
</form>
|
||||||
|
@include('components.panel-footer')
|
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 139 KiB |
@ -1,3 +1,3 @@
|
|||||||
<section class='GisooVideo'>
|
<section class='GisooVideo live-setting' data-live="{{$data->area_name.'_'.$data->part}}" >
|
||||||
<video src="{{asset('upload/media/'.$data->area_name.'.'.$data->part.'.mp4')}}" autoplay muted ></video>
|
<video src="{{asset('upload/media/'.$data->area_name.'.'.$data->part.'.mp4')}}" autoplay muted ></video>
|
||||||
</section>
|
</section>
|
||||||
|
@ -1,3 +1,3 @@
|
|||||||
<section class='SpliterText'>
|
<section class='SpliterText live-setting' data-live="{{$data->area_name.'_'.$data->part}}">
|
||||||
{!! getSetting($data->area_name.'_'.$data->part.'_text') !!}
|
{!! getSetting($data->area_name.'_'.$data->part.'_text') !!}
|
||||||
</section>
|
</section>
|
||||||
|
Loading…
Reference in New Issue