detail.html 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  1. <style type="text/css">
  2. .btn-list {
  3. position: fixed;
  4. right: 40px;
  5. }
  6. .div-flex {
  7. display: flex
  8. }
  9. .div-flex .form-group {
  10. margin-right: 50px;
  11. text-align: center;
  12. line-height: 25px;
  13. margin-bottom: 0;
  14. }
  15. .tab-pane {
  16. border: 1px solid #F6F6F6;
  17. }
  18. .i-color {
  19. font-size: 34px;margin-right: 10px;color: #86C3FF;
  20. }
  21. .thumbnail {
  22. display: flow-root;
  23. width: max-content;
  24. }
  25. .thumbnail img {
  26. width: 50px;
  27. float: left;
  28. padding: 5px;
  29. }
  30. </style>
  31. <div class="panel panel-default panel-intro">
  32. <input type="hidden" name="ids" id="ids" value="{$ids}"/>
  33. <div class="div-flex">
  34. <i class="fa fa-reorder i-color"></i>
  35. <div style="line-height: 35px"><b>{$row.title}</div>
  36. </div>
  37. <div class="div-flex" style="margin-top: 20px">
  38. <div class="form-group">
  39. <span class="text-muted">报销人</span>
  40. <p>{$row.staff.name}</p>
  41. </div>
  42. <div class="form-group">
  43. <span class="text-muted">消费日期</span>
  44. <p>{$row.submit_date}</p>
  45. </div>
  46. <div class="form-group">
  47. <span class="text-muted">报销金额</span>
  48. <p>{$row.money}</p>
  49. </div>
  50. <div class="form-group">
  51. <span class="text-muted">审核状态</span>
  52. <p>{$row.check_status_text}</p>
  53. </div>
  54. </div>
  55. <div>
  56. <ul class="nav nav-tabs" role="tablist">
  57. <li role="presentation" class="active"><a href="#basic" aria-controls="home" role="tab" data-toggle="tab">报销明细</a></li>
  58. <li role="presentation"><a href="#cost" aria-controls="profile" role="tab" data-toggle="tab">审核流程</a></li>
  59. </ul>
  60. <div class="tab-content" style="overflow-y: scroll;height:565px">
  61. <div role="tabpanel" class="tab-pane fade panel-body form-horizontal active in" id="basic">
  62. <div class="form-group">
  63. <div class="col-xs-6 col-sm-10">
  64. <div class="form-group col-sm-10">
  65. <span class="text-muted">报销备注:</span>
  66. {$row.remark}
  67. </div>
  68. </div>
  69. </div>
  70. <div class="form-group">
  71. <div class="alert alert-warning-light no-margin">
  72. 费用明细
  73. </div>
  74. </div>
  75. <div class="form-group">
  76. {foreach name="row.detail" item="val"}
  77. {if condition="$val['consume_type'] == '交通费'"}
  78. <div class="col-xs-6 col-sm-5">
  79. <div class="form-group col-sm-5">
  80. <span class="text-muted">报销类型:</span>
  81. {$val.consume_type}
  82. </div>
  83. </div>
  84. <div class="col-xs-6 col-sm-5">
  85. <div class="form-group col-sm-5">
  86. <span class="text-muted">报销金额:</span>
  87. {$val.consume_money}
  88. </div>
  89. </div>
  90. <div class="col-xs-6 col-sm-5">
  91. <div class="form-group col-sm-5">
  92. <span class="text-muted">消费日期:</span>
  93. {$val.consume_date}
  94. </div>
  95. </div>
  96. <div class="col-xs-6 col-sm-5">
  97. <div class="form-group col-sm-5">
  98. <span class="text-muted">交通工具:</span>
  99. {$val.car_type}
  100. </div>
  101. </div>
  102. <div class="col-xs-6 col-sm-5">
  103. <div class="form-group col-sm-5">
  104. <span class="text-muted">车牌号:</span>
  105. {$val.car_number}
  106. </div>
  107. </div>
  108. <div class="col-xs-6 col-sm-5">
  109. <div class="form-group col-sm-5">
  110. <span class="text-muted">公里数:</span>
  111. {$val.mileage}
  112. </div>
  113. </div>
  114. <div class="col-xs-6 col-sm-10">
  115. <div class="form-group col-sm-10">
  116. <span class="text-muted">备注:</span>
  117. {$val.remark}
  118. </div>
  119. </div>
  120. {present name="val.imgList"}
  121. <div class="col-xs-12 col-sm-10">
  122. <span class="text-muted">报销凭证:</span>
  123. {foreach name="val.imgList" item="value" }
  124. <img src="{$value.url}" data-tips-image style="margin-left: 10px;width:100px;height: 100px;" class="">
  125. {/foreach}
  126. </div>
  127. {/present}
  128. {else/}
  129. <div class="col-xs-6 col-sm-5">
  130. <div class="form-group col-sm-5">
  131. <span class="text-muted">报销类型:</span>
  132. {$val.consume_type}
  133. </div>
  134. </div>
  135. <div class="col-xs-6 col-sm-5">
  136. <div class="form-group col-sm-5">
  137. <span class="text-muted">报销金额:</span>
  138. {$val.consume_money}
  139. </div>
  140. </div>
  141. <div class="col-xs-6 col-sm-5">
  142. <div class="form-group col-sm-5">
  143. <span class="text-muted">消费日期:</span>
  144. {$val.consume_date}
  145. </div>
  146. </div>
  147. <div class="col-xs-6 col-sm-10">
  148. <div class="form-group col-sm-10">
  149. <span class="text-muted">备注:</span>
  150. {$val.remark}
  151. </div>
  152. </div>
  153. {present name="val.imgList"}
  154. <div class="col-xs-12 col-sm-10">
  155. <span class="text-muted">报销凭证:</span>
  156. {foreach name="val.imgList" item="value" }
  157. <img src="{$value.url}" data-tips-image style="margin-left: 10px;width:100px;height: 100px;" class="">
  158. {/foreach}
  159. </div>
  160. {/present}
  161. {/if}
  162. {/foreach}
  163. </div>
  164. </div>
  165. <div role="tabpanel" class="tab-pane fade panel-body form-horizontal" id="cost">
  166. {empty name="operations"}
  167. <div class="center-block">
  168. 暂无相关数据!
  169. </div>
  170. {else/}
  171. {foreach name="operations" item="val" }
  172. <div class="div-record">
  173. <div class="div-flex">
  174. <i class="fa fa-user-circle-o i-color"></i>
  175. <div><b>{$val.check_staff.name}</b>
  176. <p class="text-muted">{$val.check_time}<br/></p></div>
  177. </div>
  178. <div class="well">
  179. 审批状态: {$val.status_text}<br/>
  180. 审批意见: {$val.content}<br/>
  181. </div>
  182. </div>
  183. {/foreach}
  184. {/empty}
  185. </div>
  186. </div>
  187. </div>
  188. </div>