apBill.html 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288
  1. <style>
  2. .order-table .header>th {
  3. height: 38px;
  4. text-align: center;
  5. background: #f5f5f5;
  6. border-top: 1px solid #e8e8e8;
  7. border-bottom: 1px solid #e8e8e8;
  8. }
  9. .order-table .sep-row {
  10. height: 10px;
  11. }
  12. .order-table .selector {
  13. vertical-align: middle;
  14. margin: 0 0 2px 0;
  15. }
  16. .toolbar label {
  17. margin-right: 10px;
  18. margin-bottom: 0;
  19. }
  20. .toolbar .select_all {
  21. margin: 0 6px 0 10px;
  22. line-height: 20px;
  23. }
  24. .toolbar .btn {
  25. -moz-border-radius: 2px;
  26. margin-right: 5px;
  27. border: 1px solid #dcdcdc;
  28. border-radius: 2px;
  29. -webkit-border-radius: 2px;
  30. }
  31. .order-table .order-hd {
  32. background: #f5f5f5;
  33. height: 40px;
  34. line-height: 40px;
  35. }
  36. .order-table .order-hd td.first {
  37. padding-left: 20px;
  38. }
  39. .order-table .order-hd .order-main span {
  40. margin-right: 8px;
  41. }
  42. .order-table .order-hd .order-code {
  43. font-style: normal;
  44. font-family: verdana;
  45. }
  46. .order-table .order-hd .order-sum {
  47. padding: 0 5px;
  48. font-size: 15px;
  49. font-weight: bold;
  50. color: #CC0000;
  51. }
  52. .order-table>tbody {
  53. border: 1px solid transparent;
  54. }
  55. .order-table>tbody:hover {
  56. border-color: #56a022;
  57. border-width: 2px;
  58. }
  59. .order-table .operates {
  60. display: none;
  61. }
  62. .order-table>tbody:hover .operates {
  63. display: block;
  64. }
  65. .order-table .order-bd {
  66. border-bottom: 1px solid #e6e6e6;
  67. }
  68. .order-table .order-bd>td {
  69. padding: 10px 5px;
  70. vertical-align: top;
  71. position: relative;
  72. }
  73. .order-table .order-bd .product {
  74. padding-left: 20px;
  75. }
  76. .input-xs,.input-group-xs>.form-control,.input-group-xs>.input-group-addon,.input-group-xs>.input-group-btn>.btn
  77. {
  78. height: 26px;
  79. padding: 0 5px;
  80. font-size: 12px;
  81. line-height: 1.5;
  82. border-radius: 3px;
  83. }
  84. .input-group-xs .form-control:last-child,.input-group-addon:last-child,.input-group-btn:first-child>.btn:not(:first-child),.input-group-btn:last-child>.btn {
  85. border-top-left-radius: 0;
  86. border-bottom-left-radius: 0;
  87. }
  88. </style>
  89. <div class="block">
  90. <div class="loading in" ng-class="{'in': loading}">
  91. <i></i>
  92. </div>
  93. <div class="condition block">
  94. <div class="row">
  95. <div class="col-xs-10">
  96. <div class="search">
  97. <div class="form-group form-group-sm has-feedback">
  98. <input type="search" class="form-control input-sm" ng-model="keyword" ng-search="onSearch()" placeholder="输入商品、客户名称或单据流水号搜索" /><span
  99. class="form-control-feedback text-simple"><i
  100. class="fa fa-search"></i></span>
  101. </div>
  102. </div>
  103. </div>
  104. <div class="col-xs-2 toggle">
  105. <a ng-click="condition.$open=!condition.$open" class="text-simple">
  106. <span ng-bind="condition.$open ? '简化筛选条件' : '更多筛选条件'"></span>
  107. <i class="fa fa-fw" ng-class="{'fa-angle-up': condition.$open, 'fa-angle-down': !condition.$open}"></i>
  108. </a>
  109. </div>
  110. </div>
  111. <div class="more" ng-class="{'open': condition.$open}">
  112. <form class="form-inline">
  113. <div class="form-group ">
  114. <label>日期:</label>
  115. <div class="btn-group btn-menu" dropdown is-open="condition.$dateZoneOpen">
  116. <button type="button" style="width: 85px;" class="btn btn-default btn-xs dropdown-toggle">
  117. {{dateZoneText}}<i class="fa fa-fw fa-angle-down icon-right"></i></span>
  118. </button>
  119. <ul class="dropdown-menu">
  120. <li><a ng-click="changeDateZone(1)">一个月内</a></li>
  121. <li><a ng-click="changeDateZone(6)">半年内</a></li>
  122. <li><a ng-click="changeDateZone()">半年前</a></li>
  123. </ul>
  124. </div>
  125. <div class="form-group input-group input-group-xs input-trigger">
  126. <input type="text" ng-model="condition.dateFrom"
  127. class="form-control" placeholder="从"
  128. datepicker-popup="yyyy-MM-dd" is-open="condition.$fromOpened"
  129. ng-required="true"
  130. current-text="今天" clear-text="清除" close-text="关闭"
  131. datepicker-options="{formatDayTitle: 'yyyy年M月', formatMonth: 'M月', showWeeks: false}"
  132. ng-focus="openDatePicker($event, condition, '$fromOpened')">
  133. <span class="input-group-btn">
  134. <button type="button" class="btn btn-default"
  135. ng-click="openDatePicker($event, condition, '$fromOpened')">
  136. <i class="fa fa-calendar"></i>
  137. </button>
  138. </span>
  139. </div>
  140. <div class="form-group input-group input-group-xs input-trigger">
  141. <input type="text" ng-model="condition.dateTo"
  142. class="form-control" placeholder="到"
  143. datepicker-popup="yyyy-MM-dd" is-open="condition.$toOpened"
  144. ng-required="true"
  145. current-text="今天" clear-text="清除" close-text="关闭"
  146. datepicker-options="{formatDayTitle: 'yyyy年M月', formatMonth: 'M月', showWeeks: false}"
  147. ng-focus="openDatePicker($event, condition, '$toOpened')">
  148. <span class="input-group-btn">
  149. <button type="button" class="btn btn-default"
  150. ng-click="openDatePicker($event, condition, '$toOpened')">
  151. <i class="fa fa-calendar"></i>
  152. </button>
  153. </span>
  154. </div>
  155. </div>
  156. </form>
  157. </div>
  158. </div>
  159. <table class="order-table block" ng-table="tableParams">
  160. <thead>
  161. <tr class="header">
  162. <th>商品</th>
  163. <th width="120">单价</th>
  164. <th width="100">发票数量</th>
  165. <th width="120">发票金额</th>
  166. <th width="140">单据信息</th>
  167. <th width="70">操作</th>
  168. </tr>
  169. <tr class="sep-row">
  170. <td colspan="6"></td>
  171. </tr>
  172. <tr class="toolbar toolbar-top">
  173. <td colspan="5">
  174. <div>
  175. <label><input ng-disabled="true" type="checkbox" class="selector select_all"
  176. ng-model="selectAll">全选</label> <a ng-disabled="true" href="javascript:void(0)"
  177. class="btn btn-default btn-xs">批量回复</a>
  178. </div> <!-- 分页 -->
  179. </td>
  180. <td class="text-center">
  181. <a href="sale/apBill/xls?keyword={{keywordXls}}" target="_self" class="text-simple" title="导出Excel表格"><i class="fa fa-file-excel-o fa-fw"></i>导出</a>
  182. </td>
  183. </tr>
  184. <tr class="sep-row">
  185. <td colspan="6"></td>
  186. </tr>
  187. </thead>
  188. <tbody ng-repeat="bill in $data">
  189. <tr class="order-hd">
  190. <td class="first">
  191. <div class="order-main">
  192. <span> <input type="checkbox" class="selector"
  193. ng-model="bill.$selected">
  194. </span> <span class="text-num text-bold" title="{{::bill.date | date: 'yyyy年MM月dd日 hh:mm'}}"
  195. ng-bind="bill.date | date:'yyyy-MM-dd'"></span> <span>流水号:<a
  196. class="text-num" ng-bind="::bill.code"></a></span>
  197. </div>
  198. </td>
  199. <td colspan="3"><a title="客户名称"
  200. ng-bind="::bill.enterprise.enName"></a></td>
  201. <td colspan="1" class="order-sum text-num">
  202. <span title="票据总额">
  203. <span ng-bind="::currency(bill.currency)"></span>
  204. <span ng-bind="::bill.apAmount"></span>
  205. </span>
  206. </td>
  207. <td colspan="1" class="text-center">
  208. <div class="operates">
  209. <!-- <a href="#" class="text-muted" title="打印">
  210. <i class="fa fa-print fa-lg fa-fw"></i>
  211. </a> -->
  212. </div>
  213. </td>
  214. </tr>
  215. <tr class="order-bd" ng-repeat="item in bill.items">
  216. <td class="product">
  217. <div class="text-num text-bold">
  218. <a ng-bind="::item.product.code"></a>
  219. </div>
  220. <div>
  221. <a ng-bind="::item.product.title"></a>
  222. </div>
  223. <div class="text-muted" title="{{::item.product.spec}}"
  224. ng-bind="::item.product.spec"></div>
  225. </td>
  226. <td class="text-center">
  227. <div class="text-num" title="{{::item.price}}">
  228. <span ng-bind="::currency(bill.currency)"></span>
  229. <span ng-bind="::item.price"></span>
  230. </div>
  231. <div>&nbsp;</div>
  232. <div class="text-muted"
  233. title="{{::'税率:' + item.taxrate + '%'}}">
  234. 税率:<span class="text-num" ng-bind="::item.taxrate"></span>%
  235. </div>
  236. </td>
  237. <td class="text-center">
  238. <div class="text-num"
  239. title="{{::item.qty}}" ng-bind="::item.qty"></div>
  240. <div class="text-muted" ng-bind="::item.product.unit"></div>
  241. </td>
  242. <td class="text-center br-l">
  243. <div class="text-num text-bold">
  244. <span ng-bind="::currency(bill.currency)"></span>
  245. <span ng-bind="::item.apAmount"></span>
  246. </div>
  247. <div>&nbsp;</div>
  248. <div class="text-muted">
  249. 税金:
  250. <span class="text-num" ng-bind="::currency(bill.currency)"></span>
  251. <span class="text-num" ng-bind="::item.taxAmount"></span>
  252. </div>
  253. </td>
  254. <td class="br-l" colspan="2">
  255. <div>单据编号:<a ng-bind="::item.orderCode"></a></div>
  256. <div>
  257. 第 <span ng-bind="::item.orderDetno"></span> 行
  258. &nbsp;&nbsp;&nbsp;&nbsp;数量:<span ng-bind="::item.thisvoQty"></span>
  259. </div>
  260. <div class="text-muted">单据金额:
  261. <span class="text-num" ng-bind="::item.amount"></span>
  262. <span class="text-num" ng-bind="::currency(bill.currency)"></span>
  263. </div>
  264. </td>
  265. </tr>
  266. </tbody>
  267. </table>
  268. </div>