TheCloneArmy/crater
1
0
Fork 1
mirror of https://github.com/crater-invoice/crater.git synced 2025-12-15 01:42:54 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'pdf-templates' into 'master'

Browse Source 
Refactor invoice, estimate create and all base modal style

See merge request mohit.panjvani/crater-web!38
This commit is contained in:
Mohit Panjwani
2019-11-17 06:02:58 +00:00
parent cb2fc18d55 9d12f3162e
commit 65222a5af4
13 changed files with 127 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
resources/assets/js/components/base/BaseInput.vue
View File

@@ -20,7 +20,7 @@
@blur="handleFocusOut"
>
<div v-if="showPassword && isAlignLeftIcon" style="cursor: pointer" @click="showPass = !showPass" >
<font-awesome-icon :icon="!showPass ?'eye-slash': 'eye'" class="right-icon" />
<font-awesome-icon :icon="!showPass ?'eye': 'eye-slash'" class="right-icon" />
</div>
<font-awesome-icon v-if="icon && !isAlignLeftIcon" :icon="icon" class="right-icon" />
</div>

4
resources/assets/js/components/base/modal/BaseModal.vue
View File

@@ -2,8 +2,8 @@
<transition name="fade">
<div v-if="modalActive" :class="'size-' + modalSize" class="base-modal">
<div class="modal-body">
<div class="close-icon">
<font-awesome-icon class="mr-2" icon="times" @click="closeModal"/>
<div class="close-icon" @click="closeModal">
<font-awesome-icon icon="times" />
</div>
<div class="modal-header p-3">
<h5 class="modal-heading">{{ modalTitle }}</h5>

13
resources/assets/js/views/estimates/Create.vue
View File

@@ -11,13 +11,14 @@
<li v-else class="breadcrumb-item">{{ $t('estimates.new_estimate') }}</li>
</ol>
<div class="page-actions row">
<a v-if="$route.name === 'estimates.edit'" :href="`/estimates/pdf/${newEstimate.unique_hash}`" target="_blank" class="mr-3 base-button btn btn-outline-primary default-size" outline color="theme">
<a v-if="$route.name === 'estimates.edit'" :href="`/estimates/pdf/${newEstimate.unique_hash}`" target="_blank" class="mr-3 base-button btn btn-outline-primary default-size invoice-action-btn" outline color="theme">
{{ $t('general.view_pdf') }}
</a>
<base-button
:loading="isLoading"
:disabled="isLoading"
icon="save"
class="invoice-action-btn"
color="theme"
type="submit">
{{ $t('estimates.save_estimate') }}
@@ -25,7 +26,7 @@
</div>
</div>
<div class="row estimate-input-group">
<div class="col-md-5">
<div class="col-md-5 estimate-customer-container">
<div
v-if="selectedCustomer"
class="show-customer"
@@ -101,7 +102,7 @@
</div>
<div class="col estimate-input">
<div class="row mb-3">
<div class="col">
<div class="col collapse-input">
<label>{{ $t('reports.estimates.estimate_date') }}<span class="text-danger"> * </span></label>
<base-date-picker
v-model="newEstimate.estimate_date"
@@ -111,7 +112,7 @@
/>
<span v-if="$v.newEstimate.estimate_date.$error && !$v.newEstimate.estimate_date.required" class="text-danger"> {{ $t('validation.required') }} </span>
</div>
<div class="col">
<div class="col collapse-input">
<label>{{ $t('estimates.due_date') }}<span class="text-danger"> * </span></label>
<base-date-picker
v-model="newEstimate.expiry_date"
@@ -124,7 +125,7 @@
</div>
</div>
<div class="row mt-4">
<div class="col">
<div class="col collapse-input">
<label>{{ $t('estimates.estimate_number') }}<span class="text-danger"> * </span></label>
<base-input
:invalid="$v.newEstimate.estimate_number.$error"
@@ -135,7 +136,7 @@
/>
<span v-show="$v.newEstimate.estimate_number.$error && !$v.newEstimate.estimate_number.required" class="text-danger mt-1"> {{ $tc('estimates.errors.required') }} </span>
</div>
<div class="col">
<div class="col collapse-input">
<label>{{ $t('estimates.ref_number') }}</label>
<base-input
v-model="newEstimate.reference_number"

1
resources/assets/js/views/expenses/Index.vue
View File

@@ -171,6 +171,7 @@
sort-as="expense_date"
>
<template slot-scope="row">
<span>{{ $t('expenses.note') }}</span>
<div class="notes">
<div class="note">{{ row.notes }}</div>
</div>

14
resources/assets/js/views/invoices/Create.vue
View File

@@ -11,7 +11,7 @@
<li v-else class="breadcrumb-item">{{ $t('invoices.new_invoice') }}</li>
</ol>
<div class="page-actions row">
<a v-if="$route.name === 'invoices.edit'" :href="`/invoices/pdf/${newInvoice.unique_hash}`" target="_blank" class="mr-3 base-button btn btn-outline-primary default-size" outline color="theme">
<a v-if="$route.name === 'invoices.edit'" :href="`/invoices/pdf/${newInvoice.unique_hash}`" target="_blank" class="mr-3 invoice-action-btn base-button btn btn-outline-primary default-size" outline color="theme">
{{ $t('general.view_pdf') }}
</a>
<base-button
@@ -19,13 +19,14 @@
:disabled="isLoading"
icon="save"
color="theme"
class="invoice-action-btn"
type="submit">
{{ $t('invoices.save_invoice') }}
</base-button>
</div>
</div>
<div class="row invoice-input-group">
<div class="col-md-5">
<div class="col-md-5 invoice-customer-container">
<div
v-if="selectedCustomer" class="show-customer">
<div class="row px-2 mt-1">
@@ -101,7 +102,7 @@
</div>
<div class="col invoice-input">
<div class="row mb-3">
<div class="col">
<div class="col collapse-input">
<label>{{ $tc('invoices.invoice',1) }} {{ $t('invoices.date') }}<span class="text-danger"> * </span></label>
<base-date-picker
v-model="newInvoice.invoice_date"
@@ -111,7 +112,7 @@
/>
<span v-if="$v.newInvoice.invoice_date.$error && !$v.newInvoice.invoice_date.required" class="text-danger"> {{ $t('validation.required') }} </span>
</div>
<div class="col">
<div class="col collapse-input">
<label>{{ $t('invoices.due_date') }}<span class="text-danger"> * </span></label>
<base-date-picker
v-model="newInvoice.due_date"
@@ -124,7 +125,7 @@
</div>
</div>
<div class="row mt-4">
<div class="col">
<div class="col collapse-input">
<label>{{ $t('invoices.invoice_number') }}<span class="text-danger"> * </span></label>
<base-input
:invalid="$v.newInvoice.invoice_number.$error"
@@ -135,7 +136,7 @@
/>
<span v-show="$v.newInvoice.invoice_number.$error && !$v.newInvoice.invoice_number.required" class="text-danger mt-1"> {{ $tc('validation.required') }} </span>
</div>
<div class="col">
<div class="col collapse-input">
<label>{{ $t('invoices.ref_number') }}</label>
<base-input
v-model="newInvoice.reference_number"
@@ -148,7 +149,6 @@
</div>
</div>
</div>
<table class="item-table">
<colgroup>
<col style="width: 40%;">

21
resources/assets/sass/components/base-modal.scss vendored
View File

@@ -55,10 +55,29 @@
.close-icon {
position: absolute;
padding: 6px 0 0 0;
padding: 6px;
top: 23px;
right: 15px;
display: flex;
justify-content: center;
align-content: center;
width: 20px;
cursor: pointer;
}
}
@media (max-width: $x-small-breakpoint) {
.base-modal {
.modal-body {
height: 100%;
overflow: scroll;
border-radius: 0px;
}
}
}

9
resources/assets/sass/components/customer-modal.scss vendored
View File

@@ -36,11 +36,16 @@
}
@media(max-width: $x-small-breakpoint ) {
@media (max-width: $x-small-breakpoint) {
.base-modal {
.customer-modal {
width: 100vw;
.required {
position: relative;
}
.input-label {
text-align: left;
@@ -50,4 +55,4 @@
}
}
}

18
resources/assets/sass/components/item-modal.scss vendored
View File

@@ -1,7 +1,7 @@
.base-modal .modal-body {
overflow: visible !important;
}
.item-modal {
.card-footer {
@@ -29,6 +29,22 @@
.base-modal .item-modal .input-label{
.item-modal {
width: 100vw;
.input-label {
text-align: left;
}
}
.required {
position: absolute;
right: auto;
margin-left: 5px;
color: #FB7178;
}
text-align: left;
}

1
resources/assets/sass/components/tax-type-modal.scss vendored
View File

@@ -31,6 +31,7 @@
.base-modal {
.tax-type-modal {
width: 100vw;
.input-label {
text-align: left;

17
resources/assets/sass/components/template-modal.scss vendored
View File

@@ -38,3 +38,20 @@
}
}
}
@media (max-width: $x-small-breakpoint) {
.base-modal {
.template-modal {
width: 100vw;
.template-container {
justify-content: center;
}
}
}
}

22
resources/assets/sass/pages/estimates/create.scss vendored
View File

@@ -545,6 +545,27 @@
}
@media (max-width: $x-small-breakpoint) {
.page-header {
margin-bottom: 13px;
.invoice-action-btn {
width: 100%;
display: flex;
justify-content: center;
margin-top: 15px;
margin-right: 0px !important;
}
}
.estimate-customer-container {
padding-right: 0px;
}
.collapse-input {
padding-right: 0px;
}
.page-actions {
position: relative;
-webkit-transform: none;
@@ -582,6 +603,7 @@
}
.estimate-total {
min-width: 384px;
margin-top: 25px;
}

24
resources/assets/sass/pages/invoices/create.scss vendored
View File

@@ -25,6 +25,7 @@
margin: 0 0 0 14px;
}
}
}
.invoice-input {
@@ -549,6 +550,28 @@
}
@media (max-width: $x-small-breakpoint) {
.page-header {
margin-bottom: 13px;
.invoice-action-btn {
width: 100%;
display: flex;
justify-content: center;
margin-top: 15px;
margin-right: 0px !important;
}
}
.invoice-customer-container {
padding-right: 0px;
}
.collapse-input {
padding-right: 0px;
}
.page-actions {
position: relative;
-webkit-transform: none;
@@ -586,6 +609,7 @@
}
.invoice-total {
min-width: 384px;
margin-top: 25px;
}

2
resources/assets/sass/pages/invoices/view.scss vendored
View File

@@ -13,7 +13,7 @@
position: fixed;
top: 0;
width: 300px;
z-index: 30;
z-index: 25;
background: #FFFFFF;
}