print template color feature added
This commit is contained in:
parent
e547ee7dbe
commit
49630ae8e9
@ -11,7 +11,6 @@ use App\Traits\Media;
|
||||
use App\Traits\Recurring;
|
||||
use App\Traits\Sales;
|
||||
use Bkwld\Cloner\Cloneable;
|
||||
use Date;
|
||||
|
||||
class Invoice extends Model
|
||||
{
|
||||
|
2
public/css/custom.css
vendored
2
public/css/custom.css
vendored
@ -678,7 +678,7 @@ table .align-items-center td span.badge {
|
||||
|
||||
.print-edge
|
||||
{
|
||||
width: 147px;
|
||||
width: 140px;
|
||||
}
|
||||
/*--------Print Template Finish--------*/
|
||||
|
||||
|
4
public/css/element.css
vendored
4
public/css/element.css
vendored
@ -15326,8 +15326,7 @@
|
||||
|
||||
.el-color-dropdown.el-color-picker__panel
|
||||
{
|
||||
top: 360px !important;
|
||||
left: 580px !important;
|
||||
left: 341px !important;
|
||||
}
|
||||
|
||||
.el-color-picker__color
|
||||
@ -15394,7 +15393,6 @@
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
|
||||
|
||||
/*--------El Select Icon--------*/
|
||||
.select-icon-position
|
||||
{
|
||||
|
@ -41,7 +41,7 @@ const app = new Vue({
|
||||
return {
|
||||
form: new Form('category'),
|
||||
bulk_action: new BulkAction('categories'),
|
||||
color: '#6DA252',
|
||||
color: '#55588b',
|
||||
predefineColors: [
|
||||
'#3c3f72',
|
||||
'#55588b',
|
||||
|
44
resources/assets/js/views/settings/settings.js
vendored
44
resources/assets/js/views/settings/settings.js
vendored
@ -15,9 +15,10 @@ import Global from './../../mixins/global';
|
||||
import Form from './../../plugins/form';
|
||||
import BulkAction from './../../plugins/bulk-action';
|
||||
import HtmlEditor from './../../components/Inputs/HtmlEditor';
|
||||
import {ColorPicker} from 'element-ui';
|
||||
|
||||
// plugin setup
|
||||
Vue.use(DashboardPlugin);
|
||||
Vue.use(DashboardPlugin, ColorPicker);
|
||||
|
||||
const app = new Vue({
|
||||
el: '#app',
|
||||
@ -27,7 +28,13 @@ const app = new Vue({
|
||||
],
|
||||
|
||||
components: {
|
||||
HtmlEditor
|
||||
HtmlEditor,
|
||||
[ColorPicker.name]: ColorPicker,
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.onChangeProtocol(this.form.protocol);
|
||||
this.color = this.form.color;
|
||||
},
|
||||
|
||||
data: function () {
|
||||
@ -42,6 +49,7 @@ const app = new Vue({
|
||||
smtpPassword:true,
|
||||
smtpEncryption:true,
|
||||
},
|
||||
|
||||
invoice_form: new Form('template'),
|
||||
template: {
|
||||
modal: false,
|
||||
@ -49,17 +57,24 @@ const app = new Vue({
|
||||
message: '',
|
||||
html: '',
|
||||
errors: new Error()
|
||||
}
|
||||
},
|
||||
|
||||
color: '#55588b',
|
||||
predefineColors:[
|
||||
'#3c3f72',
|
||||
'#55588b',
|
||||
'#e5e5e5',
|
||||
'#328aef',
|
||||
'#efad32',
|
||||
'#ef3232',
|
||||
'#efef32'
|
||||
],
|
||||
}
|
||||
},
|
||||
|
||||
mounted(){
|
||||
this.onChangeProtocol(this.form.protocol);
|
||||
},
|
||||
|
||||
methods:{
|
||||
onChangeProtocol(protocol){
|
||||
switch(protocol){
|
||||
onChangeProtocol(protocol) {
|
||||
switch(protocol) {
|
||||
case "smtp":
|
||||
this.email.sendmailPath = true;
|
||||
this.email.smtpHost = false;
|
||||
@ -68,6 +83,7 @@ const app = new Vue({
|
||||
this.email.smtpPassword = false;
|
||||
this.email.smtpEncryption = false;
|
||||
break;
|
||||
|
||||
case "sendmail":
|
||||
this.email.sendmailPath = false;
|
||||
this.email.smtpHost = true;
|
||||
@ -76,6 +92,7 @@ const app = new Vue({
|
||||
this.email.smtpPassword = true;
|
||||
this.email.smtpEncryption = true;
|
||||
break;
|
||||
|
||||
default:
|
||||
this.email.sendmailPath = true;
|
||||
this.email.smtpHost = true;
|
||||
@ -97,6 +114,7 @@ const app = new Vue({
|
||||
|
||||
addTemplate() {
|
||||
if (this.invoice_form.template != 1) {
|
||||
|
||||
this.invoice_form.submit();
|
||||
|
||||
this.template.errors = this.invoice_form.errors;
|
||||
@ -111,5 +129,13 @@ const app = new Vue({
|
||||
errors: this.invoice_form.errors
|
||||
};
|
||||
},
|
||||
|
||||
onChangeColor() {
|
||||
this.form.color = this.color;
|
||||
},
|
||||
|
||||
onChangeColorInput() {
|
||||
this.color = this.form.color;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
@ -11,7 +11,7 @@
|
||||
'novalidate' => true
|
||||
]) !!}
|
||||
<div class="row">
|
||||
<div class="col-md-4 text-center px-0">
|
||||
<div class="col-md-4 text-center">
|
||||
<div class="bg-print border-radius-default print-edge choose" @click="invoice_form.template='default'">
|
||||
<img src="{{ asset('public/img/invoice_templates/default.png') }}" class="mb-1 mt-3" height="200" alt="Default"/>
|
||||
<label>
|
||||
@ -21,7 +21,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 text-center px-0">
|
||||
<div class="col-md-4 text-center px-2">
|
||||
<div class="bg-print border-radius-default print-edge choose" @click="invoice_form.template='classic'">
|
||||
<img src="{{ asset('public/img/invoice_templates/classic.png') }}" class="mb-1 mt-3" height="200" alt="Classic"/>
|
||||
<label>
|
||||
@ -42,6 +42,24 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-4">
|
||||
@stack('color_input_start')
|
||||
<div class="form-group col-md-12 {{ $errors->has('color') ? 'has-error' : ''}}">
|
||||
{!! Form::label('color', trans('general.color'), ['class' => 'form-control-label']) !!}
|
||||
<div class="input-group input-group-merge" id="invoice-color-picker">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">
|
||||
<el-color-picker v-model="invoice_form.color" size="mini" :predefine="predefineColors" @change="onChangeColor"></el-color-picker>
|
||||
</span>
|
||||
</div>
|
||||
{!! Form::text('color', $setting['color'], ['v-model' => 'invoice_form.color', '@input' => 'onChangeColorInput', 'id' => 'color', 'class' => 'form-control color-hex', 'required' => 'required']) !!}
|
||||
</div>
|
||||
{!! $errors->first('color', '<p class="help-block">:message</p>') !!}
|
||||
</div>
|
||||
@stack('color_input_end')
|
||||
</div>
|
||||
|
||||
|
||||
{!! Form::hidden('_template', $setting['template']) !!}
|
||||
{!! Form::hidden('_prefix', 'invoice') !!}
|
||||
{!! Form::close() !!}
|
||||
|
@ -35,8 +35,8 @@
|
||||
|
||||
<div class="row mt-2">
|
||||
<div class="col-33">
|
||||
<hr class="bg-default invoice-classic-line mb-1 mt-4">
|
||||
<hr class="bg-default invoice-classic-line">
|
||||
<hr class="invoice-classic-line mb-1 mt-4" style="background-color:{{ setting('invoice.color') }};">
|
||||
<hr class="invoice-classic-line" style="background-color:{{ setting('invoice.color') }};">
|
||||
</div>
|
||||
|
||||
<div class="col-33">
|
||||
@ -53,8 +53,8 @@
|
||||
</div>
|
||||
|
||||
<div class="col-33">
|
||||
<hr class="bg-default invoice-classic-line mb-1 mt-4">
|
||||
<hr class="bg-default invoice-classic-line">
|
||||
<hr class="invoice-classic-line mb-1 mt-4" style="background-color:{{ setting('invoice.color') }};">
|
||||
<hr class="invoice-classic-line" style="background-color:{{ setting('invoice.color') }};">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -114,7 +114,9 @@
|
||||
<div class="col-100">
|
||||
<div class="text">
|
||||
<table class="lines">
|
||||
<thead class="bg-default">
|
||||
@foreach($invoice as $item)
|
||||
<thead style="background-color:{{ setting('invoice.color') }};">
|
||||
@endforeach
|
||||
<tr>
|
||||
@stack('name_th_start')
|
||||
<th class="item text-white">{{ trans_choice($text_override['items'], 2) }}</th>
|
||||
|
@ -3,7 +3,7 @@
|
||||
@section('title', trans_choice('general.invoices', 1) . ': ' . $invoice->invoice_number)
|
||||
|
||||
@section('content')
|
||||
<div class="row bg-primary">
|
||||
<div class="row" style="background-color:{{ setting('invoice.color') }};">
|
||||
<div class="col-58 m-first-column">
|
||||
<div class="text company pl-2 m-fc-left">
|
||||
<img src="{{ $logo }}" class="m-logo" alt="{{ setting('company.name') }}"/>
|
||||
@ -12,7 +12,7 @@
|
||||
<strong class="text-white">{{ setting('company.name') }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-42">
|
||||
<div class="text company">
|
||||
<br>
|
||||
@ -43,7 +43,7 @@
|
||||
@stack('name_input_start')
|
||||
<strong>{{ $invoice->contact_name }}</strong><br><br>
|
||||
@stack('name_input_end')
|
||||
|
||||
|
||||
@stack('address_input_start')
|
||||
{!! nl2br($invoice->contact_address) !!}<br><br>
|
||||
@stack('address_input_end')
|
||||
@ -53,7 +53,7 @@
|
||||
{{ trans('general.tax_number') }}: {{ $invoice->contact_tax_number }}<br><br>
|
||||
@endif
|
||||
@stack('tax_number_input_end')
|
||||
|
||||
|
||||
@stack('phone_input_start')
|
||||
@if ($invoice->contact_phone)
|
||||
{{ $invoice->contact_phone }}<br><br>
|
||||
@ -105,7 +105,7 @@
|
||||
<div class="col-100">
|
||||
<div class="text">
|
||||
<table class="m-lines">
|
||||
<thead class="bg-default">
|
||||
<thead style="background-color:{{ setting('invoice.color') }};">
|
||||
<tr>
|
||||
@stack('name_th_start')
|
||||
<th class="item text-white">{{ trans_choice($text_override['items'], 2) }}</th>
|
||||
@ -168,7 +168,7 @@
|
||||
@stack('notes_input_end')
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-42 text-right">
|
||||
<div class="text company pr-2">
|
||||
@foreach ($invoice->totals as $total)
|
||||
@ -194,7 +194,7 @@
|
||||
|
||||
@if ($invoice->footer)
|
||||
<div class="row mt-7">
|
||||
<div class="col-100 bg-default py-2">
|
||||
<div class="col-100 py-2" style="background-color:{{ setting('invoice.color') }};">
|
||||
<div class="text company pl-2">
|
||||
<strong class="text-white">{!! $invoice->footer !!}</strong>
|
||||
</div>
|
||||
|
@ -30,7 +30,7 @@
|
||||
<el-color-picker v-model="color" size="mini" :predefine="predefineColors" @change="onChangeColor"></el-color-picker>
|
||||
</span>
|
||||
</div>
|
||||
{!! Form::text('color', '#6DA252', ['v-model' => 'form.color', '@input' => 'onChangeColorInput', 'id' => 'color', 'class' => 'form-control color-hex', 'required' => 'required']) !!}
|
||||
{!! Form::text('color', '#55588b', ['v-model' => 'form.color', '@input' => 'onChangeColorInput', 'id' => 'color', 'class' => 'form-control color-hex', 'required' => 'required']) !!}
|
||||
</div>
|
||||
{!! $errors->first('color', '<p class="help-block">:message</p>') !!}
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user