Skip to content

Commit 60f5bd1

Browse files
shabbirbharmalshabbirbharmal
committed
ticket - in progress
1 parent a172030 commit 60f5bd1

File tree

4 files changed

+213
-35
lines changed

4 files changed

+213
-35
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"chart.js": "^2.7.2",
2424
"core-js": "^2.5.7",
2525
"css-vars-ponyfill": "^1.9.0",
26-
"flag-icon-css": "^3.0.0",
26+
"flag-icon-css": "^3.2.0",
2727
"font-awesome": "^4.7.0",
2828
"nestable2": "^1.6.0",
2929
"perfect-scrollbar": "^1.4.0",

‎src/assets/scss/_custom.scss

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1040,4 +1040,39 @@ table.fc-header{
10401040

10411041

10421042

1043-
// form wizard
1043+
// cart
1044+
1045+
.table>tbody>tr>td, .table>tfoot>tr>td{
1046+
vertical-align: middle;
1047+
}
1048+
@media screen and (max-width: 600px) {
1049+
table#cart tbody td .form-control{
1050+
width:20%;
1051+
display: inline !important;
1052+
}
1053+
.actions .btn{
1054+
width:36%;
1055+
margin:1.5em 0;
1056+
}
1057+
1058+
.actions .btn-info{
1059+
float:left;
1060+
}
1061+
.actions .btn-danger{
1062+
float:right;
1063+
}
1064+
1065+
table#cart thead { display: none; }
1066+
table#cart tbody td { display: block; padding: .6rem; min-width:320px;}
1067+
table#cart tbody tr td:first-child { background: #333; color: #fff; }
1068+
table#cart tbody td:before {
1069+
content: attr(data-th); font-weight: bold;
1070+
display: inline-block; width: 8rem;
1071+
}
1072+
1073+
1074+
1075+
table#cart tfoot td{display:block; }
1076+
table#cart tfoot td .btn{display:block;}
1077+
1078+
}

‎src/views/tickets/Create.vue

Lines changed: 83 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -182,10 +182,73 @@
182182

183183
</b-card>
184184

185+
<b-card header="Notes & Attachment">
186+
187+
<b-row>
188+
<b-col sm="6">
189+
<textarea class="form-control" rows="3"></textarea>
190+
</b-col>
191+
192+
<b-col sm="6">
193+
<div class="custom-file">
194+
<input type="file" class="custom-file-input" id="customFile">
195+
<label class="custom-file-label" for="customFile">Choose file</label>
196+
</div>
197+
</b-col>
198+
</b-row>
199+
200+
201+
</b-card>
202+
185203
</tab-content>
186204
<tab-content title="Review Items"
187205
icon="fa fa-cart-arrow-down">
188-
My second tab content
206+
<table id="cart" class="table table-hover table-condensed">
207+
<thead>
208+
<tr>
209+
<th style="width:50%">Product</th>
210+
<th style="width:10%">Price</th>
211+
<th style="width:8%">Quantity</th>
212+
<th style="width:22%" class="text-right">Subtotal</th>
213+
<th style="width:10%"></th>
214+
</tr>
215+
</thead>
216+
<tbody>
217+
<tr>
218+
<td data-th="Product">
219+
<div class="row">
220+
<div class="col-sm-2 hidden-xs"><img src="http://placehold.it/100x100" alt="..." class="img-responsive"/></div>
221+
<div class="col-sm-10">
222+
<h4 class="nomargin">Banner 1</h4>
223+
<p>
224+
<strong>Size:</strong> 100x120<br/>
225+
<strong>Finishing:</strong> Framed<br/>
226+
<strong>Sides:</strong> Single Sided<br/>
227+
<strong>Lit:</strong> Frontlit<br/>
228+
</p>
229+
</div>
230+
</div>
231+
</td>
232+
<td data-th="Price">$1.99</td>
233+
<td data-th="Quantity">
234+
<input type="number" class="form-control text-center" value="1">
235+
</td>
236+
<td data-th="Subtotal" class="text-right">$1.99</td>
237+
<td class="actions" data-th="">
238+
<button class="btn btn-info btn-sm"><i class="fa fa-copy" title="Clone item"></i></button>
239+
<button class="btn btn-info btn-sm"><i class="fa fa-edit"></i></button>
240+
<button class="btn btn-danger btn-sm"><i class="fa fa-trash-o"></i></button>
241+
</td>
242+
</tr>
243+
<tr>
244+
<td colspan="3" class="hidden-xs"></td>
245+
<td class="hidden-xs text-right"><strong>Total $1.99</strong></td>
246+
<td></td>
247+
</tr>
248+
</tbody>
249+
250+
251+
</table>
189252
</tab-content>
190253
<tab-content title="Other Information"
191254
icon="fa fa-info">
@@ -202,35 +265,28 @@
202265
</b-card>
203266
</b-col>
204267
</b-row>
268+
<b-card header="Notes & Attachment">
269+
270+
<b-row>
271+
<b-col sm="6">
272+
<textarea class="form-control" rows="3"></textarea>
273+
</b-col>
274+
275+
<b-col sm="6">
276+
<div class="custom-file">
277+
<input type="file" class="custom-file-input" id="customFile">
278+
<label class="custom-file-label" for="customFile">Choose file</label>
279+
</div>
280+
</b-col>
281+
</b-row>
282+
283+
284+
</b-card>
205285
</tab-content>
206286
<tab-content title="Confirmation"
207287
icon="fa fa-check">
208288

209-
210-
<div class="dd">
211-
<ol class="dd-list">
212-
<li class="dd-item" data-id="1">
213-
<div class="dd-handle">Item 1</div>
214-
</li>
215-
<li class="dd-item" data-id="2">
216-
<div class="dd-handle">Item 2</div>
217-
</li>
218-
<li class="dd-item" data-id="3">
219-
<div class="dd-handle">Item 3</div>
220-
<ol class="dd-list">
221-
<li class="dd-item" data-id="4">
222-
<div class="dd-handle">Item 4</div>
223-
</li>
224-
<li class="dd-item" data-id="5" data-foo="bar">
225-
<div class="dd-handle">Item 5</div>
226-
</li>
227-
<li class="dd-item" data-id="5" data-foo="bar">
228-
<div class="dd-handle">Item 5</div>
229-
</li>
230-
</ol>
231-
</li>
232-
</ol>
233-
</div>
289+
<h4>Job ticket #1234 is successfully created! It's due on Feb 15th 2019. </h4>
234290

235291

236292
</tab-content>
@@ -249,9 +305,6 @@
249305
import {FormWizard, TabContent} from 'vue-form-wizard'
250306
import 'vue-form-wizard/dist/vue-form-wizard.min.css'
251307
import 'nestable2/dist/jquery.nestable.min.css'
252-
253-
window.jQuery = require('jquery')
254-
require('nestable2')
255308
//component code
256309
257310
@@ -297,9 +350,7 @@
297350
},
298351
299352
mounted: function () {
300-
jQuery('.dd').nestable({
301-
maxDepth: 10000
302-
});
353+
303354
304355
}
305356
}

‎src/views/tickets/View.vue

Lines changed: 93 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,9 @@
4848
<b-col md="10">
4949
<table class="table">
5050
<tbody>
51+
<tr>
52+
<td><strong>Product:</strong> Banner </td>
53+
</tr>
5154
<tr>
5255
<td><strong>Size:</strong> 23x12 </td>
5356
</tr>
@@ -75,6 +78,10 @@
7578

7679
<td><strong>Sides:</strong> Single Sides</td>
7780
</tr>
81+
<tr>
82+
83+
<td><strong>Notes:</strong> This is item note</td>
84+
</tr>
7885

7986
</tbody>
8087
</table>
@@ -177,16 +184,58 @@
177184

178185
</div>
179186
</b-tab>
187+
<b-tab>
188+
<template slot="title">
189+
<i class="icon-layers"></i>Attachments
190+
</template>
191+
192+
<table class="table table-responsive-sm">
193+
<thead>
194+
<tr>
195+
<th>Type</th>
196+
<th>Date </th>
197+
<th>File</th>
198+
</tr>
199+
</thead>
200+
<tbody>
201+
<tr>
202+
<td><span class="badge badge-primary">PDF</span></td>
203+
<td>2012/01/01</td>
204+
<td><a href="#">Spider Man Poster.pdf</a> </td>
205+
206+
</tr>
207+
<tr>
208+
<td><span class="badge badge-primary">PDF</span></td>
209+
<td>2012/01/01</td>
210+
<td><a href="#">Spider Man Poster.jpg</a> </td>
211+
</tr>
212+
<tr>
213+
<td><span class="badge badge-primary">JPG</span></td>
214+
<td>2012/01/01</td>
215+
<td><a href="#">Hulk Smash Poster.jpg</a> </td>
216+
</tr>
217+
218+
</tbody>
219+
</table>
220+
<div class="custom-file">
221+
<input type="file" class="custom-file-input" id="customFile">
222+
<label class="custom-file-label" for="customFile">Choose file</label>
223+
</div>
224+
</b-tab>
225+
180226
</b-tabs>
181227
<b-tabs class="mt-4">
182228
<b-tab title="Item info" active>
183229
<b-row>
184230
<b-col md="2">
185-
<img src="https://via.placeholder.com/200x200" class="rounded float-left">
231+
<img src="https://via.placeholder.com/200x200" class="rounded">
186232
</b-col>
187233
<b-col md="10">
188234
<table class="table">
189235
<tbody>
236+
<tr>
237+
<td><strong>Product:</strong> Banner </td>
238+
</tr>
190239
<tr>
191240
<td><strong>Size:</strong> 23x12 </td>
192241
</tr>
@@ -214,6 +263,10 @@
214263

215264
<td><strong>Sides:</strong> Single Sides</td>
216265
</tr>
266+
<tr>
267+
268+
<td><strong>Notes:</strong> This is item note</td>
269+
</tr>
217270

218271
</tbody>
219272
</table>
@@ -316,6 +369,45 @@
316369

317370
</div>
318371
</b-tab>
372+
<b-tab>
373+
<template slot="title">
374+
<i class="icon-layers"></i>Attachments
375+
</template>
376+
377+
<table class="table table-responsive-sm">
378+
<thead>
379+
<tr>
380+
<th>Type</th>
381+
<th>Date </th>
382+
<th>File</th>
383+
</tr>
384+
</thead>
385+
<tbody>
386+
<tr>
387+
<td><span class="badge badge-primary">PDF</span></td>
388+
<td>2012/01/01</td>
389+
<td><a href="#">Spider Man Poster.pdf</a> </td>
390+
391+
</tr>
392+
<tr>
393+
<td><span class="badge badge-primary">PDF</span></td>
394+
<td>2012/01/01</td>
395+
<td><a href="#">Spider Man Poster.jpg</a> </td>
396+
</tr>
397+
<tr>
398+
<td><span class="badge badge-primary">JPG</span></td>
399+
<td>2012/01/01</td>
400+
<td><a href="#">Hulk Smash Poster.jpg</a> </td>
401+
</tr>
402+
403+
</tbody>
404+
</table>
405+
<div class="custom-file">
406+
<input type="file" class="custom-file-input" id="customFile">
407+
<label class="custom-file-label" for="customFile">Choose file</label>
408+
</div>
409+
</b-tab>
410+
319411
</b-tabs>
320412
<b-row class="mt-4">
321413
<b-col md="12">

0 commit comments

Comments
 (0)