mirror of https://github.com/4xmen/xshop.git
added simple comment theme part
added safe form added comment submit methodpull/49/head
parent
14cc7005dd
commit
9cd2f7521a
@ -0,0 +1,8 @@
|
||||
window.addEventListener('load',function () {
|
||||
setTimeout(()=>{
|
||||
document.querySelectorAll('.safe-from')?.forEach(function (el) {
|
||||
const url = el.querySelector('.safe-url').getAttribute('data-url');
|
||||
el.setAttribute('action',url);
|
||||
})
|
||||
},1220);
|
||||
})
|
||||
@ -0,0 +1,65 @@
|
||||
<section class='SimpleComments'>
|
||||
<div class="{{gfx()['container']}}">
|
||||
<h5>
|
||||
{{__("Comments")}}
|
||||
</h5>
|
||||
@foreach($data['comments'] as $comment)
|
||||
@include('segments.post.SimplePost.inc.comment-detail',$comment)
|
||||
@endforeach
|
||||
<h5>
|
||||
{{__("Post your comment")}}
|
||||
</h5>
|
||||
@include('components.err')
|
||||
<form id="comment-form" class="safe-from" method="post">
|
||||
<div class="safe-url" data-url="{{route('client.comment.submit')}}"></div>
|
||||
@csrf
|
||||
|
||||
<input type="hidden" name="commentable_type" value="{{$data['commentable_type']}}">
|
||||
<input type="hidden" name="commentable_id" value="{{$data['commentable_id']}}">
|
||||
<input type="hidden" name="parent_id" id="parent_id" >
|
||||
<div class="row">
|
||||
|
||||
@if(auth()->check())
|
||||
<div class="col-12">
|
||||
<span class="comment-as">
|
||||
{{auth()->user()->name}}
|
||||
</span>
|
||||
</div>
|
||||
@elseif(auth('customer')->check())
|
||||
<div class="col-12">
|
||||
<span class="comment-as">
|
||||
{{auth('customer')->user()->name}}
|
||||
</span>
|
||||
</div>
|
||||
@else
|
||||
<div class="col-md-6">
|
||||
<label for="name">
|
||||
{{__("Name")}}
|
||||
</label>
|
||||
<input type="text" name="name" class="form-control" placeholder="{{__("Name")}}" id="name">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="name">
|
||||
{{__("Email")}}
|
||||
</label>
|
||||
<input type="email" name="email" class="form-control" placeholder="{{__("Email")}}" id="email">
|
||||
</div>
|
||||
@endif
|
||||
<div class="col-12 mt-2">
|
||||
<label>
|
||||
{{__("Message")}}
|
||||
</label>
|
||||
<textarea name="message" placeholder="{{__("Message...")}}" class="form-control"
|
||||
rows="3"></textarea>
|
||||
<div class="text-center">
|
||||
|
||||
<button class="btn btn-primary w-25 my-3 ">
|
||||
<i class="ri-send-plane-2-line"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
@ -0,0 +1,12 @@
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
document.querySelectorAll('.comment-reply')?.forEach(function (el) {
|
||||
el.addEventListener('click', function () {
|
||||
const id = this.getAttribute('data-id');
|
||||
document.querySelector('#parent_id').value = id;
|
||||
document.querySelectorAll('.simple-single-comment')?.forEach(function (el2) {
|
||||
el2.classList.remove('on-reply');
|
||||
});
|
||||
el.closest('.simple-single-comment').classList.add('on-reply')
|
||||
});
|
||||
})
|
||||
});
|
||||
@ -0,0 +1,10 @@
|
||||
{
|
||||
"name": "SimpleComments",
|
||||
"version": "1.0",
|
||||
"author": "xStack",
|
||||
"email": "xshop@xstack.ir",
|
||||
"license": "GPL-3.0-or-later",
|
||||
"url": "https:\/\/xstack.ir",
|
||||
"author_url": "https:\/\/4xmen.ir",
|
||||
"packages": []
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
<?php
|
||||
|
||||
namespace Resources\Views\Segments;
|
||||
|
||||
use App\Models\Part;
|
||||
|
||||
class SimpleComments
|
||||
{
|
||||
public static function onAdd(Part $part = null)
|
||||
{
|
||||
|
||||
}
|
||||
public static function onRemove(Part $part = null)
|
||||
{
|
||||
|
||||
}
|
||||
public static function onMount(Part $part = null, $model = null)
|
||||
{
|
||||
if ($model == null){
|
||||
return $part;
|
||||
}
|
||||
$part->comments = $model->approvedComments()->whereNull('parent_id')->orderBy('id','desc')->get();
|
||||
$part->commentable_type = get_class($model);
|
||||
$part->commentable_id = $model->id;
|
||||
return $part;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,50 @@
|
||||
.SimpleComments {
|
||||
.simple-single-comment{
|
||||
margin-bottom: 3px;
|
||||
padding: 10px 1rem;
|
||||
p{
|
||||
padding: 1rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.tag{
|
||||
background: var(--xshop-secondary);
|
||||
color: var(--xshop-diff);
|
||||
border-radius: var(--xshop-border-radius);
|
||||
display: inline-block;
|
||||
padding: 2px 1rem;
|
||||
opacity: .2;
|
||||
transition: 470ms;
|
||||
}
|
||||
border: 1px solid rgba($xshop-text,.3);
|
||||
border-radius: var(--xshop-border-radius);
|
||||
|
||||
&:hover{
|
||||
.tag{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-reply{
|
||||
margin: -5px -.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
#comment-form{
|
||||
border-radius: var(--xshop-border-radius);
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
background: #ffffff44;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.comment-as{
|
||||
font-weight: 700;
|
||||
color: var(--xshop-primary);
|
||||
}
|
||||
|
||||
.on-reply{
|
||||
background: var(--xshop-secondary);
|
||||
color: var(--xshop-diff);
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 137 KiB |
@ -1,5 +1,36 @@
|
||||
<div>
|
||||
<h1>
|
||||
comment
|
||||
</h1>
|
||||
<div class="simple-single-comment">
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
@if($comment->commentator()['url'] == null)
|
||||
<span class="tag float-end">
|
||||
{{__("Guest")}}
|
||||
</span>
|
||||
{{$comment->commentator()['name']}}
|
||||
@else
|
||||
@if($comment->commentator_type == \App\Models\User::class)
|
||||
<span class="tag float-end">
|
||||
{{__("Admin")}}
|
||||
</span>
|
||||
@else
|
||||
<span class="tag float-end">
|
||||
{{__("Customer")}}
|
||||
</span>
|
||||
@endif
|
||||
{{$comment->commentator()['name']}}
|
||||
@endif
|
||||
</div>
|
||||
<div class="col-9">
|
||||
<button type="button" class="btn btn-primary btn-sm float-end comment-reply" data-id="{{$comment->id}}">
|
||||
<i class="ri-reply-line"></i>
|
||||
</button>
|
||||
<p class="pe-4">
|
||||
{{$comment->body}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@if($comment->children->count() > 0)
|
||||
@foreach($comment->children as $comment)
|
||||
@include('segments.post.SimplePost.inc.comment-detail',$comment)
|
||||
@endforeach
|
||||
@endif
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue