detail.blade.php 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  1. <!-- 拼团订单详情页 -->
  2. @extends('layouts.base')
  3. @section('title', '拼团订单详情')
  4. @section('content')
  5. <style>
  6. .el-form-item {
  7. margin-bottom: 0px
  8. }
  9. </style>
  10. <div id="app-order" style="padding-top: 1%" xmlns:v-bind="http://www.w3.org/1999/xhtml">
  11. <template>
  12. <el-container>
  13. <el-header>
  14. 拼团订单详情
  15. </el-header>
  16. <el-main>
  17. <order-operation :order="order"></order-operation>
  18. <el-collapse v-model="collapseActiveName">
  19. <el-collapse-item title="基本信息" name="1">
  20. <el-form ref="order" :model="order" label-width="17%">
  21. <el-form-item label="粉丝 :">
  22. <div style="padding-left:20px">
  23. <a v-bind:href="'{{ yzWebUrl('member.member.detail', array('id' => '')) }}'+[[order.uid]]"
  24. target="_blank"><img
  25. v-bind:src="order.belongs_to_member.avatar_image"
  26. style='width:100px;height:100px;padding:1px;border:1px solid #ccc'>
  27. [[order.belongs_to_member.nickname]]</a>
  28. </div>
  29. </el-form-item>
  30. <el-form-item label="会员信息 :">
  31. <div style="padding-left:20px">
  32. ID: [[order.belongs_to_member.uid]]
  33. 姓名: [[order.belongs_to_member.realname]] /
  34. 手机号: [[order.belongs_to_member.mobile]]
  35. </div>
  36. </el-form-item>
  37. <el-form-item label="订单编号 :">
  38. <div style="padding-left:20px">
  39. [[order.order_sn]]
  40. </div>
  41. </el-form-item>
  42. <el-form-item label="订单金额 :">
  43. <div style="padding-left:20px">
  44. <el-row type="flex">
  45. <el-col :span="2" style="text-align:right;">
  46. 商品小计 :
  47. </el-col>
  48. <el-col :span="22">
  49. ¥[[order.order_goods_price]]
  50. </el-col>
  51. </el-row>
  52. <el-row type="flex">
  53. <el-col>
  54. <el-col :span="2" style="text-align:right;">
  55. 应收款 :
  56. </el-col>
  57. <el-col :span="22">
  58. <span style="color:green">¥[[order.price]]</span>
  59. </el-col>
  60. </el-col>
  61. </el-row>
  62. </div>
  63. </el-form-item>
  64. <el-form-item label="支付状态 :">
  65. <div style="padding-left:20px">
  66. <label class='label label-info'>[[order.status_name]]</label>
  67. </div>
  68. </el-form-item>
  69. <el-form-item label="下单时间 :">
  70. <div style="padding-left:20px">
  71. [[order.create_time]]
  72. </div>
  73. </el-form-item>
  74. <el-form-item label="支付时间 :">
  75. <div style="padding-left:20px">
  76. [[order.pay_time]]
  77. </div>
  78. </el-form-item>
  79. </el-form>
  80. </el-collapse-item>
  81. <el-collapse-item v-if="order.address" title="收货地址 :" name="3">
  82. <el-form label-width="17%">
  83. <el-form-item label="收件人 :">
  84. <div style="padding-left:20px">
  85. [[order.address.realname]]
  86. </div>
  87. </el-form-item>
  88. <el-form-item label="联系电话 :">
  89. <div style="padding-left:20px">
  90. [[order.address.mobile]]
  91. </div>
  92. </el-form-item>
  93. <el-form-item label="收货地址 :">
  94. <div style="padding-left:20px">
  95. [[order.address.address]]
  96. </div>
  97. </el-form-item>
  98. <el-form-item label="物流信息" v-if="order.express">
  99. <div style="padding-left:20px">
  100. [[order.express.company_name]]
  101. </div>
  102. <el-row type="flex">
  103. <el-col :span="2" style="text-align:right;">
  104. [[order.express.express_company_name]] :
  105. </el-col>
  106. <el-col :span="22">
  107. [[order.express.express_sn]]
  108. </el-col>
  109. </el-row>
  110. <el-row type="flex">
  111. <el-col :span="2" style="text-align:right;">
  112. 官方电话 :
  113. </el-col>
  114. <el-col :span="22">
  115. [[order.express.tel]]
  116. </el-col>
  117. </el-row>
  118. </el-form-item>
  119. </el-form>
  120. </el-collapse-item>
  121. <el-collapse-item title="商品信息 :" name="4">
  122. <el-table
  123. :data="order.has_many_order_goods"
  124. style="width: 100%">
  125. <el-table-column
  126. prop="id"
  127. label="ID" width="50%"></el-table-column>
  128. <el-table-column
  129. label="商品标题">
  130. <template slot-scope="scope">
  131. <a v-bind:href="'{{ yzWebUrl('goods.goods.edit', array('id' => '')) }}'+[[scope.row.goods_id]]"
  132. target="_blank">
  133. <img v-bind:src="scope.row.thumb"
  134. style='width:30px;height:30px;padding:1px;border:1px solid #ccc'>
  135. [[scope.row.title]]
  136. </a>
  137. </template>
  138. </el-table-column>
  139. <el-table-column
  140. prop="goods_option_title"
  141. label="商品规格"></el-table-column>
  142. <el-table-column
  143. label="现价/原价/成本价">
  144. <template slot-scope="scope">
  145. ¥[[scope.row.goods_price]]/ ¥[[scope.row.goods_market_price]]/
  146. ¥[[scope.row.goods_cost_price]]
  147. </template>
  148. </el-table-column>
  149. <el-table-column
  150. prop="total"
  151. label="数量" width="50%"></el-table-column>
  152. <el-table-column
  153. prop="goods.status_name"
  154. label="状态" width="50%">
  155. </el-table-column>
  156. </el-table>
  157. </el-collapse-item>
  158. </el-collapse>
  159. </el-main>
  160. </el-container>
  161. </template>
  162. </div>
  163. @endsection('content')
  164. @section('js')
  165. @include('Yunshop\FightGroups::admin.order.orderOperation')
  166. <script>
  167. var app = new Vue({
  168. el: '#app-order',
  169. delimiters: ['[[', ']]'],
  170. components: {
  171. 'order-operation': orderOperation
  172. },
  173. data() {
  174. let data =eval({!! $data !!});
  175. console.log(data)
  176. return {
  177. rules: {},
  178. order: data,
  179. // order:{
  180. // belongs_to_member:{avatar_image:""},
  181. // provider_platform_order:{tripartite_retailer:{name:''},tripartite_provider:{name:""}},
  182. // express:{name:"",company_name:"",}
  183. // },
  184. name:"",
  185. collapseActiveName: ['1', '2', '3', '4']
  186. }
  187. },
  188. mounted: function () {
  189. },
  190. methods: {}
  191. });
  192. </script>
  193. @endsection('js')