orderDet.vue 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877
  1. <template>
  2. <view class="pages">
  3. <!-- 余额 -->
  4. <view class="tosend">
  5. <view class="tosend_text" v-if="dataDet.status == 6">制作中...</view>
  6. <view class="tosend_text" v-if="dataDet.status == 3 && dataDet.orderType == 1">待取餐</view>
  7. <view class="tosend_text" v-if="dataDet.status == 3 && dataDet.orderType == 2 && dataDet.riderUserId">配送中
  8. </view>
  9. <view class="tosend_text" v-if="dataDet.status == 3 && dataDet.orderType == 2 && dataDet.riderUserId==null">
  10. 待配送</view>
  11. <view class="tosend_text" v-if="dataDet.status == 4">已完成</view>
  12. <view class="tosend_text" v-if="dataDet.status == 5">已取消</view>
  13. <view class="tosend_text" v-if="dataDet.status == 7">待接单</view>
  14. <!-- <view class="btnCm" v-if="item.riderUserId">配送中</view>
  15. <view class="btnCm" v-else>待派送</view> -->
  16. <view style="padding:0 30rpx;font-size: 20px;" v-if="dataDet.orderSequence">#{{dataDet.orderSequence}}</view>
  17. <view class="tosend_cont" style="position: relative;margin-top: 20upx;" v-if="dataDet.orderType==2">
  18. <image src="../../static/images/order/dizhi.png"
  19. style="position: absolute;width: 32rpx;height: 40rpx;top: 50rpx;left: 32rpx;"></image>
  20. <view class="tosend_header_text" style="margin-left: 64rpx;"
  21. @tap="bindGps(address.lat,address.lng,address.addressDetail)">{{address.province}}{{address.city}}{{address.district}}{{address.addressDetail}}
  22. </view>
  23. <view class="tosend_cont_infor" style="margin-top: 0;margin-left: 64rpx;">
  24. <view class="tosend_cont_infor_le" @click="bindphone(address.userPhone)">
  25. {{address.userName}}&nbsp;&nbsp;{{address.userPhone}}
  26. </view>
  27. <!-- <view class="tosend_cont_infor_ri">{{dataDet.orderCode}}</view> -->
  28. </view>
  29. </view>
  30. <view class="tosend_header" style="margin-top: 20upx;">
  31. <!-- 排序 -->
  32. <view class="cont_two_top">
  33. <view class="cont_two_top_le" v-if="dataDet.status == 3">取餐号码</view>
  34. <!-- <view class="cont_two_top_ri" v-if="dataDet.status == 6">制作中</view> -->
  35. </view>
  36. <view v-if="dataDet.status == 3 && dataDet.orderType == 1" class="cont_two_text">{{dataDet.orderCode}}
  37. </view>
  38. <view v-if="dataDet.status == 3 && dataDet.orderType == 1" class="cont_two_text2">
  39. 前面还有<text>{{dataDet.countOrder?dataDet.countOrder:0}}</text>个人排队
  40. </view>
  41. <view v-if="dataDet.status != 3">
  42. <view class="flex justify-between">
  43. <view>取餐号码</view>
  44. <!-- <view class="cont_two_top_ri">制作中</view> -->
  45. </view>
  46. <view style="font-size:58upx;" class="text-center text-bold padding-tb">{{dataDet.orderCode}}</view>
  47. </view>
  48. <!-- 商品列表 -->
  49. <view class="tosend_header_food" v-for="(item,index) in dataDet.orderGoodsList" :key='index'>
  50. <view class="tosend_header_food_le">
  51. <image :src="item.goodsPicture" alt="加载失败" style="border-radius: 10rpx;"></image>
  52. </view>
  53. <view class="tosend_header_food_ce justify-between">
  54. <view class="tosend_header_food_text">{{item.goodsName}}</view>
  55. <view class="tosend_header_food_text2" v-if="item.skuMessage">{{item.skuMessage}}</view>
  56. <view class="tosend_header_food_text2">打包费</view>
  57. </view>
  58. <view class="tosend_header_food_ri">
  59. <view class="tosend_header_food_text"><text>¥</text>{{item.goodsPrice}}</view>
  60. <view class="tosend_header_food_text2">×{{item.goodsNum}}</view>
  61. <view class="tosend_header_food_text2"><text>¥</text>{{item.goodsPack}}/份</view>
  62. </view>
  63. </view>
  64. <view class="tosend_header_do do_bot" v-if="dataDet.errandMoney>0&&dataDet.orderType==2 && dataDet.errandMoneyIsShop=='本单未达到商家满减金额,跑腿费由用户承担'">
  65. <view>跑腿费</view>
  66. <view class="tosend_header_do_ri">¥{{dataDet.errandMoney}}</view>
  67. </view>
  68. <view class="tosend_header_do do_bot" v-if="dataDet.errandMoney>0&&dataDet.orderType==2 && dataDet.errandMoneyIsShop=='商家未开启配送费满减,跑腿费由用户承担'">
  69. <view>跑腿费</view>
  70. <view class="tosend_header_do_ri">¥{{dataDet.errandMoney}}</view>
  71. </view>
  72. <!-- <view class="tosend_header_do" v-if="dataDet.packMoney>0&& dataDet.orderType == 2">
  73. <view>打包费</view>
  74. <view class="tosend_header_do_ri">¥{{dataDet.packMoney}}</view>
  75. </view> -->
  76. <view class="tosend_header_do do_bot" v-if="dataDet.couponMoney>0">
  77. <view>优惠券</view>
  78. <view class="tosend_header_do_ri">-¥{{dataDet.couponMoney}}</view>
  79. </view>
  80. <view class="tosend_header_do margin-top">
  81. <view class="tosend_header_do_le2">实付</view>
  82. <view class="tosend_header_do_ri2"><text>¥</text>{{dataDet.payMoney}}</view>
  83. </view>
  84. </view>
  85. <!-- #ifdef APP -->
  86. <map v-if="dataDet.riderUserId != null && latitude && longitude&& dataDet.status == 3" id="map" @tap="goMap"
  87. style="width: 95%; height: 300rpx;margin-top: 20rpx;margin-left: 20rpx;" :markers="markers"
  88. :latitude="latitude" :longitude="longitude"></map>
  89. <!-- #endif -->
  90. <!-- #ifndef APP -->
  91. <map v-if="dataDet.riderUserId != null && latitude && longitude&& dataDet.status == 3" id="map" @tap="goMap"
  92. style="width: 95%; height: 300rpx;margin: 20rpx auto 0;" :markers="markers" :latitude="latitude"
  93. :longitude="longitude"></map>
  94. <!-- #endif -->
  95. <!-- 联系骑手 -->
  96. <view class="rider_box" v-if="dataDet.riderUserId!= null">
  97. <view class="flex justify-between align-center padding">
  98. <view style="font-size: 31rpx;color: black;">联系骑手...</view>
  99. <image @click="gotousu()" src="../../static/images/my/tousu.png" style="width: 43rpx;height: 39rpx;"
  100. mode=""></image>
  101. </view>
  102. <view>
  103. <u-line color="#F2F2F2" />
  104. </view>
  105. <view style="padding: 20rpx 25rpx;display: flex;justify-content: space-between;align-items: center;">
  106. <view style="display: flex;">
  107. <view class="rider_left">
  108. <image :src="dataDet.riderAvatar"></image>
  109. </view>
  110. <view style="margin-left: 10rpx;color: #333333;">
  111. <view>{{dataDet.riderUserName}}</view>
  112. <view>{{riderPhone}}</view>
  113. </view>
  114. </view>
  115. <view class="phone" @click="bindphone(dataDet.riderPhone)">联系TA</view>
  116. </view>
  117. </view>
  118. <!-- 评论信息 -->
  119. <view class="tosend_cont" v-if="dataDet.evaluateMessage">
  120. <view class="tosend_header_text">评论信息</view>
  121. <view>
  122. <view class="flex align-center">
  123. <image :src="dataDet.avatar?dataDet.avatar:'../../static/logo.png'"
  124. style="width: 40px;height: 40px;border-radius: 50%;"></image>
  125. <view class="flex justify-between align-center" style="width: 100%;margin-left: 5upx;">
  126. <view class="text-bold text-df">{{dataDet.userNickName}}</view>
  127. <view style="color: #999999;font-size: 24rpx;" v-if="dataDet.ecreateTime">
  128. {{dataDet.ecreateTime}}
  129. </view>
  130. </view>
  131. </view>
  132. <view class=" padding-left margin-left-xl" style="font-size: 30upx;">{{dataDet.evaluateMessage}}
  133. </view>
  134. <view class="flex justify-end padding-top-sm margin-right" @click="show = true"
  135. v-if="!dataDet.shopReplyMessage">
  136. <image src="../../static/images/order/pinglun.png" style="width: 20px;height: 20px;"></image>
  137. </view>
  138. <view class="padding-left margin-left-xl margin-top-sm" v-else>
  139. <view class="flex align-center">
  140. <view class=" flex align-center text-df" style="color: #999999;">
  141. <view class="text-df">商家回复:</view>{{dataDet.shopReplyMessage}}
  142. </view>
  143. </view>
  144. <!-- <view class="text-lg padding-left margin-left-xl">{{dataDet.shopReplyMessage}}</view> -->
  145. </view>
  146. </view>
  147. </view>
  148. <!-- 其他信息 -->
  149. <view class="tosend_cont ">
  150. <view class="tosend_header_text">其他信息</view>
  151. <view class="tosend_cont_infor" v-if="dataDet.remark">
  152. <view class="tosend_cont_infor_le">订单备注</view>
  153. <view class="tosend_cont_infor_ri">{{dataDet.remark}}</view>
  154. </view>
  155. <view class="tosend_cont_infor">
  156. <view class="tosend_cont_infor_le">取餐号码</view>
  157. <view class="tosend_cont_infor_ri">{{dataDet.orderCode}}</view>
  158. </view>
  159. <view class="tosend_cont_infor" v-if="dataDet.phone" @tap="call(dataDet.phone)">
  160. <view class="tosend_cont_infor_le">取餐电话</view>
  161. <image src="../../static/images/my/phone.png" style="width: 40upx;height: 40upx;"></image>
  162. <!-- <view class="tosend_cont_infor_ri">{{dataDet.phone}}</view> -->
  163. </view>
  164. <view class="tosend_cont_infor">
  165. <view class="tosend_cont_infor_le">下单时间</view>
  166. <view class="tosend_cont_infor_ri">{{dataDet.payTime}}</view>
  167. </view>
  168. <view class="flex justify-between align-center" style="margin-top: 3%;">
  169. <view class="tosend_cont_infor_le">订单编号</view>
  170. <view class="tosend_cont_infor_ri">{{dataDet.orderNumber}}</view>
  171. <view class="text-orange margin-left-lg" @click="copy(dataDet.orderNumber)">复制</view>
  172. </view>
  173. <view class="tosend_cont_infor padding-bottom-sm">
  174. <view class="tosend_cont_infor_le">支付方式</view>
  175. <view class="tosend_cont_infor_ri" v-if="dataDet.payType==1">微信支付</view>
  176. <view class="tosend_cont_infor_ri" v-if="dataDet.payType==2">余额支付</view>
  177. </view>
  178. </view>
  179. <view class="addgood" @click="refund()" v-if="dataDet.status == 6">退款</view>
  180. <view class="addgood" @click="finish()" v-if="dataDet.status == 6">制作完成</view>
  181. <view class="addgood" @click.stop="xiaoPiao()"
  182. v-if="dataDet.status == 6||dataDet.status == 3||dataDet.status == 4">补打小票</view>
  183. <view class="addgood" @click="refund()" v-if="dataDet.status == 3&&dataDet.orderType==2">退款</view>
  184. <view class="addgood" @click="peisong()" v-if="dataDet.status == 3&&dataDet.orderType==1">制作已完成</view>
  185. <view class="addgood" v-if="dataDet.status == 3&&dataDet.orderType==2&&dataDet.autoSendOrder == 1"
  186. @click.stop="succOrder(dataDet)">完成送达</view>
  187. <!-- <view class="addgood" @click="peisong()" v-if="dataDet.status == 3&&dataDet.orderType==2">餐品已完成,等待配送</view> -->
  188. <!-- 聊天室 -->
  189. <view class="chats" @click.stop="chat(dataDet)">
  190. <image src="../../static/images/img/chats.png"></image>
  191. <view class="shopxiaoix" v-if="ShopUnreadCount">{{ShopUnreadCount}}</view>
  192. </view>
  193. </view>
  194. <!-- 评论弹框 -->
  195. <u-popup v-model="show" mode="bottom" border-radius="14" :closeable="closeable">
  196. <view>
  197. <view class="margin padding-tb">
  198. <u-input v-model="pinglun" type="textarea" height="200" placeholder="请填写回复的内容" maxlengt="200"
  199. :clearable="false" style="background:#F5F5F5;" />
  200. </view>
  201. <view class="btn" @click="bindEvaluate()">提交</view>
  202. </view>
  203. </u-popup>
  204. </view>
  205. </template>
  206. <script>
  207. export default {
  208. data() {
  209. return {
  210. orderNumber: '',
  211. dataDet: {},
  212. orderType: '',
  213. latitude: '',
  214. longitude: '',
  215. markers: [], //标记点
  216. orderId: '',
  217. address: {},
  218. riderPhone: '',
  219. ShopUnreadCount: 0,
  220. pinglun: '',
  221. show: false,
  222. closeable: true,
  223. first: false
  224. }
  225. },
  226. onLoad(option) {
  227. uni.showLoading({
  228. title: '加载中...'
  229. })
  230. console.log(option)
  231. this.orderNumber = option.orderNumber
  232. this.orderId = option.orderId
  233. this.first = false
  234. this.getDataDet()
  235. let that = this
  236. setInterval(function() {
  237. that.getShopUnreadCount()
  238. }, 10000)
  239. },
  240. onShow() {
  241. this.first = false
  242. },
  243. methods: {
  244. //评论
  245. bindEvaluate() {
  246. let data = {
  247. shopReplyMessage: this.pinglun,
  248. orderNumber: this.orderNumber
  249. }
  250. this.$Request.postT("/admin/order/shopReplyEvaluate", data).then(res => {
  251. uni.hideLoading()
  252. if (res.code == 0) {
  253. this.show = false
  254. this.getDataDet()
  255. }
  256. });
  257. },
  258. goMap() {
  259. uni.navigateTo({
  260. url: '/pages/order/orderMap?indentNumber=' + this.orderNumber+'&orderId='+this.orderId
  261. })
  262. },
  263. //投诉
  264. gotousu() {
  265. console.log(this.orderNumber)
  266. uni.navigateTo({
  267. url: '/pages/my/comments?indentNumber=' + this.orderNumber
  268. })
  269. },
  270. // 拨打电话
  271. bindphone(e) {
  272. uni.makePhoneCall({
  273. phoneNumber: e
  274. });
  275. },
  276. // 一键导航
  277. bindGps(latitude, longitude, name, detailsadd) {
  278. console.log(latitude, longitude, name, detailsadd)
  279. uni.openLocation({
  280. latitude: latitude - 0, //要去的纬度-地址
  281. longitude: longitude - 0, //要去的经度-地址
  282. name: name, //地址名称
  283. address: detailsadd, //详细地址名称
  284. success: function() {
  285. console.log('导航成功');
  286. },
  287. fail: function(error) {
  288. console.log(error)
  289. }
  290. });
  291. },
  292. //聊天室
  293. chat(e) {
  294. // console.log(e)
  295. uni.navigateTo({
  296. url: '/pages/my/im?orderId=' + e.orderId
  297. })
  298. },
  299. //获取骑手位置
  300. getaddress(addressId, riderUserId) {
  301. console.log(addressId)
  302. let data = {
  303. addressId: addressId
  304. }
  305. this.$Request.getA("/app/address/selectAddressById", data).then(res => {
  306. // uni.hideLoading()
  307. console.log(res)
  308. if (res.code == 0) {
  309. this.address = res.data
  310. this.getRider(res.data.lat, res.data.lng, riderUserId)
  311. }
  312. });
  313. },
  314. //获取骑手信息
  315. getRider(lat, lng, riderUserId) {
  316. console.log(lat, lng, riderUserId, '111111')
  317. let data = {
  318. lat: lat,
  319. lng: lng,
  320. riderUserId: riderUserId
  321. }
  322. this.$Request.getA("/timedtask/selectRiderLocation", data).then(res => {
  323. if (res.code == 0) {
  324. console.log(res.data, '经纬度')
  325. this.latitude = res.data.riderLocation.lat;
  326. this.longitude = res.data.riderLocation.lng;
  327. this.markers = [{
  328. id: 1,
  329. latitude: res.data.riderLocation.lat,
  330. longitude: res.data.riderLocation.lng,
  331. iconPath: '../../static/images/order/rider.png',
  332. width: '40',
  333. height: '40'
  334. }]
  335. uni.hideLoading()
  336. }
  337. });
  338. },
  339. getDataDet() {
  340. let data = {
  341. // page: 1,
  342. // limit: 10,
  343. orderId: this.orderId
  344. }
  345. this.$Request.getA("/app/order/selectOrderById", data).then(res => {
  346. uni.hideLoading()
  347. if (res.code == 0) {
  348. this.dataDet = res.data
  349. let start = res.data.orderCode.length - 3;
  350. this.dataDet.orderCode = res.data.orderCode.substring(start, res.data.orderCode.length)
  351. this.getaddress(res.data.addressId, res.data.riderUserId)
  352. this.dataDet.orderGoodsList.forEach(res => {
  353. res.goodsPicture = res.goodsPicture.split(',')
  354. })
  355. this.dataDet.address = JSON.parse(this.dataDet.address)
  356. this.riderPhone = this.dataDet.riderPhone
  357. this.riderPhone = this.riderPhone.replace(this.dataDet.riderPhone.substr(3, 4), "****")
  358. // console.log(this.dataDet);
  359. // let phone = this.dataDet.riderPhone;
  360. // let result = phone.substring(0, 3) + "****" + phone.substring(7, 11);
  361. // // console.log(this.dataDet.riderPhone,result);
  362. // this.dataDet.riderPhone = result
  363. this.orderType = res.data.orderType
  364. console.log(this.dataDet, '2222222')
  365. }
  366. });
  367. },
  368. copy(value) {
  369. uni.setClipboardData({
  370. data: value, //要被复制的内容
  371. success: () => { //复制成功的回调函数
  372. uni.showToast({ //提示
  373. title: '复制成功'
  374. })
  375. }
  376. });
  377. },
  378. // 打电话
  379. call(phone) {
  380. uni.makePhoneCall({
  381. phoneNumber: phone
  382. });
  383. },
  384. // 打开地图
  385. openMap(e) {
  386. let latitude = e.latitude;
  387. let longitude = e.longitude;
  388. uni.openLocation({
  389. latitude: Number(latitude),
  390. longitude: Number(longitude),
  391. name: e.address,
  392. success: function() {
  393. console.log('success');
  394. }
  395. });
  396. },
  397. // 完成送达
  398. succOrder(e) {
  399. let that = this
  400. uni.showModal({
  401. title: '提示',
  402. content: '确认完成送达吗?',
  403. success: function(res) {
  404. if (res.confirm) {
  405. console.log('用户点击确定');
  406. let data = {
  407. orderId: e.orderId,
  408. sendSmsFlag:0
  409. // orderNumber: e.orderNumber,
  410. // shopId: that.shopId,
  411. // addressId: e.addressId,
  412. // status: 3
  413. }
  414. that.$Request.postT("/admin/order/accomplishOrder", data).then(res => {
  415. if (res.code == 0) {
  416. uni.navigateBack()
  417. }
  418. });
  419. } else if (res.cancel) {
  420. console.log('用户点击取消');
  421. }
  422. }
  423. });
  424. },
  425. refund() {
  426. let that = this
  427. uni.showModal({
  428. title: '提示',
  429. content: '确认退款吗?',
  430. success: function(res) {
  431. if (res.confirm) {
  432. console.log('用户点击确定');
  433. let data = {
  434. orderId: that.dataDet.orderId
  435. }
  436. that.$Request.postA("/admin/order/adminCancelOrder", data).then(res => {
  437. if (res.code == 0) {
  438. let pages = getCurrentPages(); // 当前页面
  439. let beforePage = pages[pages.length - 2]; // 上一页
  440. uni.navigateBack({
  441. success: function() {
  442. beforePage.onLoad(); // 执行上一页的onLoad方法
  443. }
  444. });
  445. }
  446. });
  447. } else if (res.cancel) {
  448. console.log('用户点击取消');
  449. }
  450. }
  451. });
  452. },
  453. // 补打小票
  454. xiaoPiao() {
  455. let that = this
  456. uni.showModal({
  457. title: '提示',
  458. content: '确认补打小票吗?',
  459. success: function(re) {
  460. if (re.confirm) {
  461. console.log('用户点击确定');
  462. let data = {
  463. orderId: that.dataDet.orderId,
  464. // orderNumber: e.orderNumber,
  465. // status: 8
  466. }
  467. that.$Request.post("/admin/order/print", data).then(res => {
  468. if (res.code == 0) {
  469. // that.page = 1
  470. // that.getOrderList()
  471. } else {
  472. that.$queue.showToast(res.msg)
  473. }
  474. });
  475. } else if (re.cancel) {
  476. console.log('用户点击取消');
  477. }
  478. }
  479. });
  480. },
  481. finish(e) {
  482. let that = this
  483. uni.showModal({
  484. title: '提示',
  485. content: '确认订单完成吗?',
  486. success: function(res) {
  487. if (res.confirm) {
  488. console.log('用户点击确定');
  489. let data = {
  490. orderId: that.dataDet.orderId,
  491. orderNumber: that.dataDet.orderNumber,
  492. status: 3
  493. }
  494. that.$Request.postJsonA("/admin/order/updateOrder", data).then(res => {
  495. if (res.code == 0) {
  496. let pages = getCurrentPages(); // 当前页面
  497. let beforePage = pages[pages.length - 2]; // 上一页
  498. uni.navigateBack({
  499. success: function() {
  500. beforePage.onLoad(); // 执行上一页的onLoad方法
  501. }
  502. });
  503. }
  504. });
  505. } else if (res.cancel) {
  506. console.log('用户点击取消');
  507. }
  508. }
  509. });
  510. },
  511. peisong(e) {
  512. let that = this
  513. uni.showModal({
  514. title: '提示',
  515. content: '确认开始配送吗?',
  516. success: function(res) {
  517. if (res.confirm) {
  518. console.log('用户点击确定');
  519. let data = {
  520. orderId: that.dataDet.orderId,
  521. orderNumber: that.dataDet.orderNumber,
  522. status: 4
  523. }
  524. that.$Request.postJsonA("/admin/order/updateOrder", data).then(res => {
  525. if (res.code == 0) {
  526. let pages = getCurrentPages(); // 当前页面
  527. let beforePage = pages[pages.length - 2]; // 上一页
  528. uni.navigateBack({
  529. success: function() {
  530. beforePage.onLoad(); // 执行上一页的onLoad方法
  531. }
  532. });
  533. }
  534. });
  535. } else if (res.cancel) {
  536. console.log('用户点击取消');
  537. }
  538. }
  539. });
  540. },
  541. //获取用户聊天消息
  542. getShopUnreadCount() {
  543. let that = this
  544. let data = {
  545. ordersId: that.orderId
  546. }
  547. that.$Request.getT("/shop/ordersChat/selectShopUnreadCount", data).then(res => {
  548. if (res.code == 0) {
  549. // that.ShopUnreadCount = res.data
  550. if (res.data > 0) {
  551. if (this.ShopUnreadCount != res.data && !this.first) {
  552. that.aplayAudio()
  553. this.ShopUnreadCount = res.data
  554. uni.showModal({
  555. title: '消息',
  556. content: '有' + res.data + '条消息,请前往聊天列表处理。',
  557. success: (ret) => {
  558. if (ret.confirm) {
  559. uni.redirectTo({
  560. url: '/pages/my/liaotian'
  561. })
  562. this.first = true
  563. } else {
  564. console.log('else', ret)
  565. that.defineCallBack()
  566. }
  567. }
  568. });
  569. // this.chatNum = data.data
  570. }
  571. } else {
  572. that.ShopUnreadCount = 0
  573. }
  574. }
  575. });
  576. },
  577. //消息提示
  578. aplayAudio() {
  579. // console.log('语音提示')
  580. const innerAudioContext = uni.createInnerAudioContext();
  581. innerAudioContext.autoplay = true;
  582. innerAudioContext.src =
  583. 'https://pw.xianmxkj.com/file/uploadPath/2022/01/19/0753211f78d718d44ee6372e33eae9ee.mp3';
  584. innerAudioContext.onPlay(() => {
  585. console.log('开始播放');
  586. });
  587. innerAudioContext.onError((res) => {
  588. console.log(res.errMsg);
  589. console.log(res.errCode);
  590. });
  591. },
  592. }
  593. }
  594. </script>
  595. <style scoped>
  596. /* 余额 */
  597. .tosend {
  598. width: 100%;
  599. height: 280rpx;
  600. /* background: -webkit-linear-gradient(top, #FCD202, #F5F5F5); */
  601. }
  602. .tosend_text {
  603. padding: 3% 3% 0%;
  604. font-size: 38upx;
  605. font-weight: 800;
  606. color: #333333;
  607. }
  608. .tosend_header {
  609. width: 94%;
  610. background-color: #FFFFFF;
  611. margin: 0 auto;
  612. border-radius: 18rpx;
  613. padding: 3%;
  614. }
  615. /* 排序 */
  616. .cont_two_top {
  617. width: 100%;
  618. display: flex;
  619. justify-content: space-between;
  620. }
  621. .cont_two_top_le {
  622. font-size: 30rpx;
  623. font-weight: 500;
  624. color: #333333;
  625. }
  626. .cont_two_top_ri {
  627. padding: 6rpx 10rpx;
  628. text-align: center;
  629. background: rgba(255, 19, 10, 0.2);
  630. font-size: 24rpx;
  631. border: 2rpx solid #FF130A;
  632. color: #FF130A;
  633. opacity: 0.6;
  634. border-radius: 8rpx;
  635. }
  636. .cont_two_text {
  637. font-size: 56rpx;
  638. text-align: center;
  639. font-weight: bold;
  640. color: #333333;
  641. margin: 5% 0;
  642. line-height: 32rpx;
  643. }
  644. .cont_two_text2 {
  645. font-size: 30rpx;
  646. width: 100%;
  647. font-weight: 500;
  648. color: #333333;
  649. text-align: center;
  650. padding-bottom: 4%;
  651. line-height: 32rpx;
  652. border-bottom: 1rpx solid #E6E6E6;
  653. }
  654. .cont_two_text2 text {
  655. color: #FF130A;
  656. }
  657. /* 商品列表 */
  658. .tosend_header_text {
  659. font-family: PingFang SC;
  660. font-weight: 800;
  661. color: #333333;
  662. line-height: 2;
  663. font-size: 30rpx;
  664. }
  665. .tosend_header_food {
  666. width: 100%;
  667. display: flex;
  668. margin-top: 35rpx;
  669. justify-content: space-between;
  670. }
  671. .tosend_header_food_le {
  672. /* width: 15%; */
  673. }
  674. .tosend_header_food_le image {
  675. width: 135rpx;
  676. height: 135rpx;
  677. }
  678. .tosend_header_food_ce {
  679. /* margin: 0 0 0 4%; */
  680. width: 57%;
  681. margin-left: 10upx;
  682. }
  683. .tosend_header_food_ri {
  684. text-align: right;
  685. width: 25%;
  686. }
  687. .tosend_header_food_text {
  688. font-size: 34rpx;
  689. font-weight: 500;
  690. color: #333333;
  691. line-height: 1.8;
  692. overflow: hidden;
  693. text-overflow: ellipsis;
  694. white-space: nowrap;
  695. }
  696. .tosend_header_food_text text {
  697. font-size: 25rpx;
  698. }
  699. .tosend_header_food_text2 {
  700. font-size: 26rpx;
  701. /* font-weight: 500; */
  702. color: #999999;
  703. }
  704. .do_top {
  705. padding-top: 3%;
  706. }
  707. .do_bot {
  708. padding-bottom: 3%;
  709. border-bottom: 2rpx solid #E6E6E6;
  710. }
  711. .tosend_header_do {
  712. width: 100%;
  713. color: #333333;
  714. font-size: 30rpx;
  715. display: flex;
  716. line-height: 1.5;
  717. }
  718. .tosend_header_do view {
  719. flex: 1;
  720. }
  721. .tosend_header_do_ri {
  722. text-align: right;
  723. }
  724. .tosend_header_do_le2 {
  725. font-family: PingFang SC;
  726. font-weight: 500;
  727. color: #999999;
  728. padding-top: 1.5%;
  729. }
  730. .tosend_header_do_ri2 {
  731. text-align: right;
  732. color: #EA0000;
  733. font-size: 40rpx;
  734. }
  735. .tosend_header_do_ri2 text {
  736. font-size: 30rpx;
  737. }
  738. /* 其他信息 */
  739. .tosend_cont {
  740. width: 94%;
  741. background-color: #FFFFFF;
  742. margin: 3% auto;
  743. border-radius: 18rpx;
  744. padding: 3%;
  745. }
  746. .tosend_cont_infor {
  747. display: flex;
  748. margin-top: 30rpx;
  749. }
  750. .tosend_cont_infor_le {
  751. flex: 1;
  752. color: #999999;
  753. }
  754. .tosend_cont_infor_ri {
  755. flex: 2;
  756. text-align: right;
  757. color: #333333;
  758. }
  759. .tosend_cont_text {
  760. text-align: right;
  761. }
  762. .addgood {
  763. width: 685upx;
  764. height: 88upx;
  765. background: #FFCC00;
  766. border-radius: 8upx;
  767. text-align: center;
  768. line-height: 88rpx;
  769. margin: 40rpx auto;
  770. font-size: 32rpx;
  771. font-weight: bold;
  772. color: #FFFFFF;
  773. }
  774. .chats {
  775. position: fixed;
  776. bottom: 70px;
  777. right: 15px;
  778. }
  779. .chats image {
  780. width: 60px;
  781. height: 60px;
  782. }
  783. /* 联系骑手 */
  784. .rider_box {
  785. width: 95%;
  786. margin: 0 auto;
  787. background: #ffffff;
  788. margin-top: 20rpx;
  789. border-radius: 10rpx;
  790. }
  791. .rider_left image {
  792. width: 80rpx;
  793. height: 85rpx;
  794. border-radius: 60%;
  795. }
  796. .phone {
  797. background: #FD6416;
  798. color: #ffffff;
  799. padding: 8rpx 15rpx;
  800. border-radius: 13rpx;
  801. font-size: 24rpx;
  802. }
  803. .shopxiaoix {
  804. background: red;
  805. color: #ffffff;
  806. width: 40rpx;
  807. height: auto;
  808. text-align: center;
  809. border-radius: 30rpx;
  810. position: relative;
  811. top: -66px;
  812. left: 35px;
  813. }
  814. .btn {
  815. width: 690upx;
  816. height: 88upx;
  817. margin: 30upx auto;
  818. background: #FCD202;
  819. box-shadow: 0px 10upx 20upx 0upx #FFD9B3;
  820. border-radius: 16upx;
  821. display: flex;
  822. align-items: center;
  823. justify-content: center;
  824. color: #000000;
  825. }
  826. </style>