Viewing file:  code_generate.blade.php (8.84 KB) -rw-r--r--
Select action/file-type:
 (+) |  (+) |  (+) | Code (+) | Session (+) |  (+) | SDB (+) |  (+) |  (+) |  (+) |  (+) |  (+) |
@extends('layouts.customer')
@section('title')
{{trans('customer.create_documents')}}
@endsection
@section('extra-css')
<link rel="stylesheet" href="{{asset('plugins/highlight/styles/default.min.css')}}">
<style>
.use-case-side-color {
background-color: #f7f9ff;
padding: 25px 10px;
border-radius: 5px;
}
.note-editable {
height: 390px;
}
.content-opacity {
opacity: 0.5;
}
.spinner {
width: 56px;
height: 56px;
display: grid;
border: 4.5px solid #0000;
border-radius: 50%;
border-color: #dbdcef #0000;
animation: spinner-e04l1k 1s infinite linear;
}
.spinner::before,
.spinner::after {
content: "";
grid-area: 1/1;
margin: 2.2px;
border: inherit;
border-radius: 50%;
}
.spinner::before {
border-color: #474bff #0000;
animation: inherit;
animation-duration: 0.5s;
animation-direction: reverse;
}
.spinner::after {
margin: 8.9px;
}
@keyframes spinner-e04l1k {
100% {
transform: rotate(1turn);
}
}
.loader {
margin:0 auto;
position: absolute;
z-index: 999;
top: 270px;
width: 0%;
left: 56%;
}
@media(max-width: 700px){
.loader {
margin:0 auto;
position: absolute;
z-index: 999;
top: 270px;
width: 0%;
left: 40% !important;
}
}
</style>
@endsection
@section('content')
<!-- Content Header (Page header) -->
<div class="content-header custom-content-header">
<h5>{{trans('customer.generate_code')}}</h5>
<p class="m-0 section-heading-text">
<i class="fa fa-code mr-1 op-07"></i>
<span class="panel-name op-07">
{{trans('customer.customer_panel')}}
</span>
<i class="fa fa-angle-double-right ml-1 mr-1" aria-hidden="true"></i>
<span class="header-active">{{trans('customer.generate_code')}}</span>
</p>
</div>
<!-- /.content-header -->
<!-- Main content -->
<div class="loader d-none" id="loader">
<div class="spinner"></div>
</div>
<section class="content" id="content-opacity">
<div class="row">
<div class="col-12 col-sm-12 mx-auto">
<div class="card">
<div class="card-header">
<h2 class="card-title">@lang('customer.generate_code')</h2>
<a class="btn btn-info float-right" href="{{route('customer.image.generate.list')}}">@lang('admin.form.button.back')</a>
</div>
<form method="post" role="form">
@csrf
<div class="card-body">
<div class="row">
<div class="col-lg-4">
<div class="row use-case-side-color">
<div class="col-lg-12">
<div class="form-group">
<label for="use_case">{{trans('customer.available_code')}} :
@if(auth()->user()->current_plan->is_code_limit == 'yes')
<span class="text-primary">{{trans('customer.unlimited_code_limit')}}</span>
@else
<span class="text-primary">{{auth()->user()->current_plan->available_code}}</span>
@endif
</label>
</div>
</div>
<div class="col-lg-12">
<div class="form-group">
<label for="name">{{trans('customer.code_name')}} <small class="font-italic">({{trans('customer.optional')}})</small></label>
<input type="text" class="form-control" name="name" id="name" placeholder="{{trans('customer.enter_your_code_name')}}">
</div>
</div>
<div class="col-lg-12">
<div class="form-group">
<label for="keyword">{{trans('customer.description')}}</label>
<textarea type="text" class="form-control" id="keyword" style="height: 160px;" placeholder="An Impressionist oil painting of sunflowers in a purple vase…"></textarea>
<small class="text-danger d-none" id="keyword_text">{{trans('customer.keyword_field_is_required')}}</small>
</div>
</div>
<div class="col-lg-12">
<div class="form-group">
<button type="button" id="write_for_me" class="btn btn-primary w-100"><i class="fas fa-pencil-alt mr-2"></i>@lang('customer.write_for_me')</button>
</div>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="form-group">
<pre><code id="code-write">
$user = auth('customer')->user();
$currentplan = $user->current_plan;
$openAiApiKey = get_settings('open_ai_api_key');
$client = \OpenAI::client($openAiApiKey);
$prompt = $request->keyword;
</code></pre>
</div>
</div>
</div>
</div>
<!-- /.card-body -->
</form>
</div>
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>
<!-- /.content -->
@endsection
@section('extra-scripts')
<script src="{{asset('plugins/highlight/highlight.min.js')}}"></script>
<script>hljs.highlightAll();</script>
<script>
function delay(callback, ms) {
let timer = 0;
return function () {
let context = this, args = arguments;
clearTimeout(timer);
timer = setTimeout(function () {
callback.apply(context, args);
}, ms || 0);
};
}
$(document).on('click', '#write_for_me', delay(function (e) {
e.preventDefault();
$('#content-opacity').addClass('content-opacity');
$('#loader').removeClass('d-none');
const keyword = $('#keyword').val();
const name = $('#name').val();
if (!keyword){
$('#keyword_text').removeClass('d-none');
}else {
$('#keyword_text').addClass('d-none');
}
if (keyword){
$.ajax({
type: 'GET',
url: '{{route('customer.open_ai.get.request.code')}}',
data: {
keyword: keyword,
name: name
},
success: function (res) {
if (res.status == 'success') {
$('#content-opacity').removeClass('content-opacity');
$('#loader').addClass('d-none');
$('#code-write').text(res.data)
} else {
$(document).Toasts('create', {
autohide: true,
delay: 10000,
class: 'bg-danger',
title: 'Notification',
body: res.message,
});
$('#content-opacity').removeClass('content-opacity');
$('#loader').addClass('d-none');
}
}
})
}else {
$('#content-opacity').removeClass('content-opacity');
$('#loader').addClass('d-none');
}
}, 500))
</script>
@endsection
|