grouporderinfo.html 9.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245
  1. {template 'public/header'}
  2. {template 'public/comhead'}
  3. <style type="text/css">
  4. .info{padding: 30px;}
  5. .progress{height: 5px;}
  6. .infoul>li{padding: 0px;position: relative;}
  7. .infoul>li>div:nth-child(1){margin-bottom: 15px;margin-left: -15px;}
  8. .info_gou{width: 20px;height: 20px;color: white;border-radius: 50%;text-align: center;line-height: 20px;position: absolute;top: 27px;left: 0px;}
  9. .info_grey{background-color: #e6e6e6;}
  10. .info_green{background-color: #44ABF7;}
  11. .progress-bar-yg{background-color: #44ABF7;}
  12. .info_left{border-right: 1px solid #ccc;}
  13. .info_right{padding: 15px;}
  14. .info_left_title{font-size: 14px;font-weight: bold;}
  15. .info_left_content>p>span:nth-child(1),.info_left_content2>p>span:nth-child(1){color: #999999;margin-right: 10px;}
  16. .info_left_content{border-bottom: 1px dashed #ccc;padding-left: 100px;padding-top: 15px;}
  17. .info_left_content2{padding-left: 100px;padding-top: 15px;padding-bottom: 5px;}
  18. .info_right_top{border-bottom: 1px dashed #ccc;height: 238px;line-height: 30px;padding-bottom: 15px;}
  19. .info_right_type{font-size: 14px;font-weight: bold;margin-left: 15px;}
  20. .info_right_type>span{font-size: 18px;}
  21. .gantan{color: #0077DD;border: 1px solid #0077DD;width: 30px;height: 30px;border-radius: 50%;text-align: center;line-height: 30px;font-size: 22px;font-weight: bold;}
  22. .info1{height: 32px;}
  23. .info1>div{float: left;}
  24. .font1{color: #FF6600;font-size: 16px;font-weight: bold;}
  25. .beizhu{margin: 10px 0px;}
  26. .content1>div{float: left;}
  27. .content1>div:nth-child(1){width: 90px;text-align: right;color: #999;margin-right: 10px;}
  28. .content_inp{width: 122px;height: 32px;border:1px solid #ccc;padding: 0px 10px;}
  29. .info_right_bot{padding: 10px 0px;}
  30. .content_font{text-align: right;color: #999;}
  31. .store_td1{height: 45px;}
  32. .store_list_img{width: 60px;height: 60px;}
  33. .yg5_tabel{border-color: #e5e5e5;outline: 1px solid #e5e5e5;text-align: center;}
  34. .yg5_tr1{width: 100%;}
  35. .yg5_tr2>td{padding: 15px;border: 1px solid #e5e5e5;}
  36. .yg5_tr1>td{
  37. border: 1px solid #e5e5e5;
  38. padding-left: 15px;
  39. background-color: #FAFAFA;
  40. font-weight: bold;
  41. }
  42. .yg5_tr3>td{font-weight: bold;height: 45px;}
  43. .yg5_tr3>td:nth-child(1){text-align: right;padding-right: 50px;}
  44. .rizhi{margin-top: 20px;}
  45. .rizhi>li{width: 100%;border-top: 1px solid #ccc;height: 80px;padding:15px 20px 10px 20px;}
  46. .rizhip{font-size: 13px;font-weight: bold;}
  47. .rizhip>span:nth-child(1){margin-right: 10px;}
  48. .rizhip2{margin-left: 20px;}
  49. .label-orderinfo{background-color: #44ABF7;color: white;}
  50. .ygmain{font-size: 12px;}
  51. .progess>text{
  52. display: inline-block;
  53. vertical-align: middle;
  54. }
  55. .line{
  56. width: 35%;
  57. height: 4px;
  58. background: #f7f7f7;
  59. animation: two 2s;
  60. }
  61. .line_0{
  62. width: 35%;
  63. height: 4px;
  64. animation: first 2s;
  65. background:rgb(68,171,247);
  66. }
  67. .circular{
  68. width: 70px;
  69. height: 70px;
  70. line-height: 70px;
  71. color: #fff;
  72. font-size: 12px;
  73. border-radius: 50%;
  74. background: rgb(68,171,247);
  75. }
  76. .t_c{
  77. text-align: center;
  78. }
  79. @keyframes first
  80. {
  81. from {width : 0;}
  82. to {width: 35%;background:rgb(68,171,247);}
  83. }
  84. @keyframes two
  85. {
  86. from {width : 0;}
  87. to {width: 35%;background:#f7f7f7;}
  88. }
  89. </style>
  90. <div class="main ygmain">
  91. <div class="panel panel-default">
  92. <div class="panel-body">
  93. <a class="btn label-orderinfo" href="{php echo $this->createWebUrl('grouporder');}"><i class="fa fa-refresh"></i>返回订单管理</a>
  94. </div>
  95. </div>
  96. <div class="panel panel-default">
  97. <div class="panel-heading">
  98. 订单号:{$item['order_num']}
  99. </div>
  100. <div class="panel-body" style="padding: 0px 15px;">
  101. <div class="row info">
  102. <!-- 交易完成状态 -->
  103. {if $item['state']==3}
  104. <div class="t_c progess">
  105. <text class="circular">买家下单</text><text class="line line_0"></text><text class="circular">买家付款</text><text class="line_0"></text><text class="circular">交易完成</text>
  106. </div>
  107. {/if}
  108. <!-- 交易完成状态 -->
  109. <!-- 商家发货 -->
  110. {if $item['state']==4}
  111. <div class="t_c progess">
  112. <text class="circular">买家下单</text><text class=" line_0"></text><text class="circular">买家付款</text><text class="line_0"></text><text class="circular">交易关闭</text>
  113. </div>
  114. {/if}
  115. {if $item['state']==5}
  116. <div class="t_c progess">
  117. <text class="circular">买家下单</text><text class=" line_0"></text><text class="circular">买家付款</text><text class="line_0"></text><text class="circular">交易失效</text>
  118. </div>
  119. {/if}
  120. <!-- 商家发货 -->
  121. <!-- 买家付款 -->
  122. {if $item['state']==2}
  123. <div class="t_c progess">
  124. <text class="circular">买家下单</text><text class="line line_0"></text><text class="circular">买家付款</text><text class="line"></text><text class="circular">交易完成</text>
  125. </div>
  126. {/if}
  127. <!-- 买家付款 -->
  128. <!-- 下单 -->
  129. {if $item['state']==1}
  130. <div class="t_c progess">
  131. <text class="circular">买家下单</text><text class=" line"></text><text class="circular">买家付款</text><text class="line"></text><text class="circular">交易完成</text>
  132. </div>
  133. {/if}
  134. <!-- 下单 -->
  135. </div>
  136. </div>
  137. </div>
  138. <div class="panel panel-default">
  139. <div class="panel-body" style="padding: 15px 30px;">
  140. <div class="row">
  141. <div class="col-md-6 info_left">
  142. <div class="info_left_title">订单信息</div>
  143. <div class="info_left_content">
  144. {if $item['group_id']>0}
  145. <p><span>团ID</span>{$item['group_id']}</p>
  146. {/if}
  147. <p><span>订单编号:</span>{$item['order_num']}</p>
  148. {if $item['pay_type']==1}
  149. <p><span>支付流水:</span>{$item['code']}</p>
  150. {/if}
  151. <p><span>付款类型</span>
  152. {if $item['pay_type']==1}
  153. <span class="label label-orderinfo"> 微信支付</span>
  154. {elseif $item['pay_type']==2}
  155. <span class="label label-orderinfo"> 余额支付</span>
  156. {/if}
  157. {if $item['state']==1}(<span style="color: #B22222;">未付款</span>){/if}</p>
  158. </div>
  159. <div class="info_left_content">
  160. <p><span>下单时间:</span>{php echo date('Y-m-d H:i:s',$item['time'])}</p>
  161. <p><span>买家信息:</span>{$item['nick_name']}</p>
  162. <p><span>收货信息:</span>{$item['receive_name']}--{$item['receive_tel']}--{$item['receive_address']}</p>
  163. {if $item['pay_time']}
  164. <p><span>付款时间:</span>{php echo date('Y-m-d H:i:s',$item['pay_time'])}</p>
  165. {/if}
  166. </div>
  167. <div class="info_left_content2">
  168. <p><span>买家留言:</span>{if $item['note']}{$item['note']}{else}无{/if}</p>
  169. </div>
  170. </div>
  171. <div class="col-md-6 info_right">
  172. <div class="info_right_top">
  173. <div class="col-md-12 info1">
  174. <div class="gantan"><span class="fa fa-exclamation"></span></div>
  175. <div class="info_right_type">订单状态:{if $item['state']==1}
  176. <span style="color:red" >待付款</span>
  177. {elseif $item['state']==2}
  178. <span style="color:orange" >已付款</span>
  179. {elseif $item['state']==3}
  180. <span style="color:orange" >已完成</span>
  181. {elseif $item['state']==4}
  182. <span style="color:green" >已关闭</span>
  183. {elseif $item['state']==5}
  184. <span style="color:gray" >已失效</span>
  185. {/if}</div>
  186. </div>
  187. <div class="content1 col-md-12">
  188. <div>总金额:</div>
  189. <div class="font1">¥{$item['money']}</div>
  190. </div>
  191. <div class="content1 col-md-12">
  192. <div>&nbsp;</div>
  193. <div>(货价{$item['price']}*{$item['goods_num']})</div>
  194. </div>
  195. {if $item['state']==4}
  196. <a class="btn label-orderinfo" href="{php echo $this->createWebUrl('grouporderinfo',array('op'=>'refund','order_id'=>$item['id']));}">退款</a>
  197. {/if}
  198. </div>
  199. </div>
  200. </div>
  201. </div>
  202. </div>
  203. <!-- 商品清单部分 -->
  204. <div class="panel panel-default">
  205. <div class="panel-heading">
  206. 商品清单
  207. </div>
  208. <div class="panel-body" style="padding: 0px 15px;">
  209. <div class="row">
  210. <table class="yg5_tabel col-md-12">
  211. <tr class="yg5_tr1">
  212. <td class="col-md-2 store_td1">菜品名称</td>
  213. <td class="col-md-2 store_td1">菜品类型</td>
  214. <td class="col-md-2">图片</td>
  215. <td class="col-md-2">单价</td>
  216. <td class="col-md-2">数量</td>
  217. <td class="col-md-2">小计(元)</td>
  218. </tr>
  219. <tr class="yg5_tr2">
  220. <td>{$item['goods_name']}</td>
  221. <td>{$item['goods_type']}</td>
  222. <td><img height="40" src="{media $item['logo']}"></td>
  223. <td>¥{$item['price']}</td>
  224. <td>{$item['goods_num']}</td>
  225. <td>¥{php echo number_format($item['price']*$item['goods_num'],2)}</td>
  226. </tr>
  227. <tr class="yg5_tr3">
  228. <td colspan="5">合计:</td>
  229. <td colspan="1">¥{$item['money']}</td>
  230. </tr>
  231. </table>
  232. </div>
  233. </div>
  234. </div>
  235. </div>
  236. <script type="text/javascript">
  237. $(function(){
  238. // $("#frame-1").addClass("in");
  239. $("#frame-22").show();
  240. $("#yframe-22").addClass("wyactive");
  241. })
  242. </script>{template 'common/footer'}