-
Notifications
You must be signed in to change notification settings - Fork 15
/
Copy pathindex.html
104 lines (97 loc) · 4.71 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>InvoiceTOP v1.0</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="license" href="http://www.opensource.org/licenses/mit-license/">
<script type="text/javascript" src="js/vendor/angular.js"></script>
<script src="js/app.js"></script>
</head>
<body ng-app="invoiceapp" ng-controller="InvoiceCtrl" style="margin-top:25px; ">
<!--<div style="position: absolute; top: 2px;margin: auto;">
<button id="editorBtn" type="button" ng-click="toggleEditMode()">Clear</button>
<button id="printBtn" type="button" ng-click="togglePrintMode()">Save</button>
</div>-->
<header>
<h1 >Invoice</h1>
<address>
<p contenteditable="true" ng-model="invoice.customer.name" ng-attr-contenteditable="{{ editMode }}"></p>
<p contenteditable="true" ng-model="invoice.customer.address" ng-attr-contenteditable="{{ editMode }}"></p>
<p contenteditable="true" ng-model="invoice.customer.phone" ng-attr-contenteditable="{{ editMode }}"></p>
<p contenteditable="true" ng-model="invoice.customer.email" ng-attr-contenteditable="{{ editMode }}"></p>
</address>
<span><img alt="" id="logo" ng-src="{{ invoice.logo }}"><input style="width:20px;height:10px;" type="file" id="logoInput" accept="image/*" /></span>
</header>
<article>
<h1>Recipient</h1>
<address>
<p contenteditable="true" ng-model="invoice.company.name" ng-attr-contenteditable="{{ editMode }}"></p>
<p contenteditable="true" ng-model="invoice.company.address" ng-attr-contenteditable="{{ editMode }}"></p>
<p contenteditable="true" ng-model="invoice.company.phone" ng-attr-contenteditable="{{ editMode }}"></p>
<p contenteditable="true" ng-model="invoice.company.email" ng-attr-contenteditable="{{ editMode }}"></p>
</address>
<table class="meta">
<tr>
<th><span>Invoice #</span></th>
<td><span contenteditable="true" ng-model="invoice.no" ng-attr-contenteditable="{{ editMode }}"></span></td>
</tr>
<tr>
<th><span >Date</span></th>
<td><input type="date" ng-model="invoice.date"/></span></td>
</tr>
<tr>
<th><span >Amount Due</span></th>
<td><span id="prefix" contenteditable="true" ng-model="invoice.currencySymbol" ng-attr-contenteditable="{{ editMode }}">$</span><span>{{ calculateTotal() - invoice.paid }}</span></td>
</tr>
</table>
<table class="inventory">
<thead>
<tr>
<th><span >Item</span></th>
<th><span >Description</span></th>
<th><span >Rate</span></th>
<th><span >Quantity</span></th>
<th><span >Price</span></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in invoice.items">
<td><a class="cut" ng-click="removeItem(item)">-</a><span contenteditable="true" ng-model="item.name">{{item.name}}</span></td>
<td><span contenteditable="true" ng-model="item.description" ng-attr-contenteditable="{{ editMode }}">{{item.description}}</span></td>
<td><span data-prefix>$</span><span contenteditable="true" ng-model="item.rate" ng-attr-contenteditable="{{ editMode }}">{{item.rate}}</span></td>
<td><span contenteditable="true" ng-model="item.quantity" ng-attr-contenteditable="{{ editMode }}">{{item.quantity}}</span></td>
<td><span data-prefix>$</span><span>{{ item.rate * item.quantity }}</span></td>
</tr>
</tbody>
</table>
<a class="add" ng-click="addItem()">+</a>
<table class="balance">
<tr>
<th><span >SubTotal</span></th>
<td><span data-prefix>$</span><span>{{ calculateSubTotal() }}</span></td>
</tr>
<tr>
<th><span >Tax</span></th>
<td>
<span contenteditable="true" ng-model="invoice.tax" ng-attr-contenteditable="{{ editMode }}">20%</span
</td>
</tr>
<tr>
<th><span>Amount Paid</span></th>
<td><span data-prefix>$</span><span contenteditable="true" ng-model="invoice.paid" ng-attr-contenteditable="{{ editMode }}">0.00</span></td>
</tr>
<tr>
<th><span >Balance Due</span></th>
<td><span data-prefix>{{ invoice.currencySymbol }}</span><span>{{ calculateTotal() - invoice.paid }}</span></td>
</tr>
</table>
</article>
<aside>
<h1><span >Additional Notes</span></h1>
<div contenteditable="true" ng-model="invoice.notes" ng-attr-contenteditable="{{ editMode }}">
<p>A finance charge of 1.5% will be made on unpaid balances after 30 days.</p>
</div>
</aside>
</body>
</html>