酒店桌布为微信小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

435 lines
9.0 KiB

9 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
7 months ago
7 months ago
7 months ago
8 months ago
8 months ago
8 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
8 months ago
7 months ago
8 months ago
7 months ago
8 months ago
7 months ago
8 months ago
8 months ago
7 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
7 months ago
8 months ago
7 months ago
7 months ago
7 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
7 months ago
8 months ago
9 months ago
8 months ago
9 months ago
9 months ago
8 months ago
7 months ago
9 months ago
7 months ago
9 months ago
8 months ago
9 months ago
9 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
7 months ago
9 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
7 months ago
8 months ago
8 months ago
8 months ago
8 months ago
9 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
9 months ago
9 months ago
9 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
8 months ago
8 months ago
8 months ago
8 months ago
7 months ago
7 months ago
8 months ago
9 months ago
  1. <template>
  2. <view class="page">
  3. <navbar
  4. :title="uid ? '用户订单信息' : '订单中心'"
  5. :leftClick="uid"
  6. @leftClick="$utils.navigateBack"
  7. />
  8. <uv-tabs :list="tabs"
  9. :activeStyle="{color : '#FD5100', fontWeight : 600}"
  10. lineColor="#FD5100"
  11. lineHeight="8rpx"
  12. lineWidth="50rpx"
  13. @click="clickTabs"></uv-tabs>
  14. <view v-if="orderList.records.length > 0" class="list">
  15. <view class="item"
  16. v-for="(item, index) in orderList.records"
  17. @click="toOrderDetail(item.id)"
  18. :key="index">
  19. <view class="top">
  20. <view class="service">
  21. <text>{{ tabs[item.type + 1].name }}</text>
  22. </view>
  23. <view class="status">
  24. <text> {{item.status_dictText}}</text>
  25. </view>
  26. </view>
  27. <view class="content"
  28. v-for="(p, i) in item.orderDetails"
  29. :key="i">
  30. <view class="left">
  31. <image mode="aspectFill" :src="p.pic"></image>
  32. </view>
  33. <view class="right">
  34. <!-- <view class="text-hidden-1">
  35. 客户姓名{{item.userName}}
  36. </view>
  37. <view class="text-hidden-1">
  38. 产品规格{{item.sku}}
  39. </view>
  40. <view class="text-hidden-1">
  41. 租赁地址{{item.userAddress}}
  42. </view>
  43. <view class="text-hidden-1">
  44. 数量{{ item.num }}
  45. </view> -->
  46. <view class="text-hidden-1">
  47. 产品名称{{p.goodsName}}
  48. </view>
  49. <view class="text-hidden-1">
  50. 产品规格{{p.sku}}
  51. </view>
  52. <view class="text-hidden-1">
  53. 数量{{ p.num }}
  54. </view>
  55. </view>
  56. </view>
  57. <view class="userInfo">
  58. <text>{{ item.userName }}</text>
  59. <text>{{ item.userPhone }}</text>
  60. <text>{{ item.userAddress }}</text>
  61. </view>
  62. <view class="userInfo">
  63. <text>下单时间</text>
  64. <text>{{ item.createTime }}</text>
  65. </view>
  66. <!-- 水洗店按钮 -->
  67. <view class="bottom" v-if="userShop">
  68. <view class="pay">
  69. <view
  70. v-if="item.washPay && item.type == 1">
  71. 水洗费用{{ item.washPay }}
  72. </view>
  73. </view>
  74. <!-- 待接单 -->
  75. <view
  76. v-if="[4, 18, 19].includes(item.status)"
  77. @click.stop="orderConfirmAccept(item)" class="b2">
  78. 确认接单
  79. </view>
  80. <!-- 待收货 -->
  81. <template v-if="item.status == 2">
  82. <view @click.stop="confirmReceiveGoods(item)" class="b2">
  83. 确认收货
  84. </view>
  85. <view @click.stop="" class="b1">
  86. 查看物流
  87. </view>
  88. </template>
  89. <!-- 待检查 -->
  90. <template v-if="item.status == 5">
  91. <view @click.stop="orderConfirmedDamage(item, 1)" class="b2"
  92. >
  93. 确认下一步
  94. </view>
  95. <!-- <view @click.stop="$utils.navigateTo
  96. (`/pages_order/order/damageReport?id=${item.id}`)" class="b1"
  97. >
  98. 破损上报
  99. </view> -->
  100. <view @click.stop="$utils.navigateTo
  101. (`/pages_order/order/damageReport?id=${item.id}`)" class="b1"
  102. >
  103. 破损上报
  104. </view>
  105. </template>
  106. <view
  107. v-if="[8, 12].includes(item.status)"
  108. @click.stop="orderId = item.id;$refs.deliverGoods.open()" class="b2">
  109. 发货填写单号
  110. </view>
  111. <view
  112. v-if="[6].includes(item.status)"
  113. @click.stop="orderFinishedWashing(item)" class="b2">
  114. 水洗完成
  115. </view>
  116. </view>
  117. <!-- 酒店按钮 -->
  118. <view class="bottom"
  119. v-else>
  120. <view class="pay">
  121. <!-- <view
  122. v-if="item.washPay">
  123. 水洗费用{{ item.washPay }}
  124. </view>
  125. <view
  126. v-if="item.rentPay">
  127. 租赁费用{{ item.rentPay }}
  128. </view>
  129. <view
  130. v-if="item.deposit">
  131. 押金{{ item.deposit }}
  132. </view> -->
  133. <view class="price"
  134. v-if="item.orderPay">
  135. 合计<text class="num">{{ item.orderPay }}</text>
  136. </view>
  137. </view>
  138. <!-- 待支付 -->
  139. <view class="">
  140. <view
  141. @click.stop="payOrder(item.orderLogId,
  142. item.id, item.status == 10)" class="b2"
  143. v-if="[0, 3, 10].includes(item.status)">
  144. {{ item.status == 10 ? '支付费用' : '立即付款' }}
  145. </view>
  146. </view>
  147. <!-- 待收货 -->
  148. <template v-if="item.status == 2">
  149. <view @click.stop="confirmReceiveGoods(item)" class="b2">
  150. 确认收货
  151. </view>
  152. <view @click.stop="" class="b1">
  153. 查看物流
  154. </view>
  155. </template>
  156. </view>
  157. </view>
  158. </view>
  159. <uv-empty
  160. v-else
  161. text="空空如也"
  162. textSize="30rpx"
  163. iconSize="200rpx"
  164. icon="list"></uv-empty>
  165. <deliverGoods
  166. ref="deliverGoods"
  167. :orderId="orderId"
  168. @getData="getData"/>
  169. <tabber select="2" v-if="!uid"/>
  170. </view>
  171. </template>
  172. <script>
  173. // 状态
  174. // 租赁订单:0待支付 1待发货 2待收货
  175. // 水洗订单:3待支付 4水洗店接单 5水洗店检查
  176. // 6开始清洗
  177. // 换货订单:7待回收 8待发货 9平台待收货
  178. // 10平台检查损失待用户支付 18待接单
  179. // 退货订单:11待回收 12待发货 13平台待收货
  180. // 14平台检查损失并且退还定金 19待接单
  181. // 15 已完成
  182. import tabber from '@/components/base/tabbar.vue'
  183. import { mapGetters } from 'vuex'
  184. import mixinOrder from '@/mixins/order.js'
  185. import deliverGoods from '@/components/userShop/deliverGoods.vue'
  186. export default {
  187. components : {
  188. tabber,
  189. deliverGoods,
  190. },
  191. mixins : [mixinOrder],
  192. computed : {
  193. ...mapGetters(['userShop']),
  194. },
  195. data() {
  196. return {
  197. tabs: [{
  198. name: '全部'
  199. },
  200. {
  201. name: '租赁押金'
  202. },
  203. {
  204. name: '水洗租赁'
  205. },
  206. {
  207. name: '破损换货'
  208. },
  209. {
  210. name: '退货退款'
  211. }
  212. ],
  213. queryParams: {
  214. pageNo: 1,
  215. pageSize: 10
  216. },
  217. // orderList: [
  218. // {
  219. // money : 99.99,
  220. // address : '广东省广州市越秀区城南故事C3栋2802',
  221. // name : '李**',
  222. // phone : '150*****091',
  223. // unit : '120*40*75【桌子尺寸】',
  224. // image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg',
  225. // status_dictText : '已完成',
  226. // }
  227. // ], //订单列表数据
  228. orderList : {
  229. records : [],
  230. total : 0,
  231. },
  232. type : -1,
  233. uid : 0,
  234. orderId : 0,
  235. }
  236. },
  237. onLoad(args) {
  238. this.uid = args.uid || 0
  239. },
  240. onShow() {
  241. this.getData()
  242. if(this.userShop){
  243. this.tabs[1].name = '租赁订单'
  244. this.$forceUpdate()
  245. }
  246. },
  247. onPullDownRefresh() {
  248. this.getData()
  249. },
  250. //滚动到屏幕底部
  251. onReachBottom() {
  252. if(this.queryParams.pageSize < this.orderList.total){
  253. this.queryParams.pageSize += 10
  254. this.getData()
  255. }
  256. },
  257. methods: {
  258. getData(){
  259. let queryParams = {
  260. ...this.queryParams,
  261. }
  262. if(this.type != -1){
  263. queryParams.type = this.type
  264. }
  265. // 水洗店查询用户订单
  266. if(this.uid != 0){
  267. queryParams.uid = this.uid
  268. }
  269. this.$api('orderPage', queryParams, res => {
  270. uni.stopPullDownRefresh()
  271. if(res.code == 200){
  272. this.orderList = res.result
  273. }
  274. })
  275. },
  276. //点击tab栏
  277. clickTabs({ index, name }) {
  278. if (index == 0) {
  279. this.type = -1;
  280. } else {
  281. this.type = index - 1;
  282. }
  283. this.queryParams.pageSize = 10
  284. this.getData()
  285. },
  286. //跳转订单详情页面
  287. toOrderDetail(id) {
  288. uni.navigateTo({
  289. url: '/pages_order/order/orderDetail?id=' + id
  290. })
  291. },
  292. }
  293. }
  294. </script>
  295. <style scoped lang="scss">
  296. .page{
  297. }
  298. .list {
  299. .item {
  300. width: calc(100% - 40rpx);
  301. background-color: #fff;
  302. margin: 20rpx;
  303. box-sizing: border-box;
  304. border-radius: 16rpx;
  305. padding: 30rpx;
  306. .top {
  307. display: flex;
  308. justify-content: space-between;
  309. align-items: center;
  310. font-size: 30rpx;
  311. .service {}
  312. .status {
  313. font-size: 26rpx;
  314. font-weight: 600;
  315. }
  316. }
  317. .content {
  318. display: flex;
  319. margin: 10rpx 0;
  320. .left {
  321. width: 130rpx;
  322. height: 130rpx;
  323. border-radius: 10rpx;
  324. image {
  325. width: 130rpx;
  326. height: 130rpx;
  327. border-radius: 10rpx;
  328. }
  329. }
  330. .right {
  331. width: calc(100% - 160rpx);
  332. color: #777;
  333. font-size: 24rpx;
  334. padding-left: 20rpx;
  335. line-height: 40rpx;
  336. background-color: #F8F8F8;
  337. }
  338. }
  339. .userInfo{
  340. font-size: 24rpx;
  341. margin-bottom: 10rpx;
  342. text{
  343. margin-right: 26rpx;
  344. }
  345. }
  346. .bottom {
  347. display: flex;
  348. justify-content: flex-end;
  349. font-size: 25rpx;
  350. .pay{
  351. margin: 12rpx;
  352. margin-right: auto;
  353. }
  354. .price {
  355. font-weight: 900;
  356. text {
  357. color: #ff780099;
  358. font-size: 30rpx;
  359. }
  360. }
  361. .b1 {
  362. border: 1px solid #777;
  363. color: #777;
  364. box-sizing: border-box;
  365. display: flex;
  366. justify-content: center;
  367. align-items: center;
  368. }
  369. .b2 {
  370. background: $uni-color;
  371. color: #fff;
  372. flex-shrink: 0;
  373. display: flex;
  374. justify-content: center;
  375. align-items: center;
  376. }
  377. .b1,.b2 {
  378. margin: 12rpx;
  379. border-radius: 28rpx;
  380. padding: 8rpx 28rpx;
  381. margin-bottom: 0;
  382. }
  383. }
  384. }
  385. }
  386. </style>