index.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883
  1. <template>
  2. <view class="page">
  3. <!-- <view class="flex-row periodDate">-->
  4. <!-- <view class="flex-row">-->
  5. <!-- <text>服务日期:</text>-->
  6. <!-- </view>-->
  7. <!-- <picker @change="bindPickerChange" mode='selector' range-key="label" :value="periodDateIndex" :range="periodDateList">-->
  8. <!-- <view class="flex-row justify-between" :style="{width:'550rpx'}">-->
  9. <!-- <text>{{periodDate.label || '请选择服务日期' }}</text>-->
  10. <!-- <u-icon name="arrow-right" color="#666" size="18"></u-icon>-->
  11. <!-- </view>-->
  12. <!-- </picker>-->
  13. <!-- </view>-->
  14. <view class="dateTabs">
  15. <u-tabs :list="periodDateList" lineColor="#FFE05C" lineWidth="40" lineHeight="4" :activeStyle="{
  16. color: '#FFE05C',
  17. fontWeight: 'bold',
  18. transform: 'scale(1.05)'
  19. }" @click="clickPeriodDateList"></u-tabs>
  20. </view>
  21. <view class="store-wrap">
  22. <view class="store-info">
  23. <view class="logo">
  24. <image src="../../static/index/u55.png" mode=""></image>
  25. </view>
  26. <view @click="gotoStoreChoose()" class="store-content">
  27. <view class="h-row">
  28. <view class="store-desc">
  29. <view class="store-name">
  30. <view class="">{{ storeInfo.storeName }}</view>
  31. </view>
  32. </view>
  33. <view class="arrow-right">
  34. <view class="change-store">更换门店</view>
  35. <u-icon name="arrow-right" color="#333" size="16"></u-icon>
  36. </view>
  37. </view>
  38. <view class="h-row">
  39. <text class="address">地址:{{ storeInfo.address }}</text>
  40. <!-- <text class="address">距你1.8km</text> -->
  41. </view>
  42. </view>
  43. </view>
  44. </view>
  45. <view class="flex-col group">
  46. <view class="serob"><text>服务对象</text></view>
  47. <u-grid :border="false" col="4">
  48. <u-grid-item v-for="(item,index) in serviceObjectList" :key="index">
  49. <view class="serobItem flex-col" >
  50. <view class="serobImgView" @click="selectServiceObject(item)">
  51. <image class="serobImg" mode="aspectFill" :src="item.facePhotoUrl || '/static/me/ud4.png'"></image>
  52. </view>
  53. <text class="serobName">{{item.nickName || '未填写'}}</text>
  54. <view class="serobV" v-if="item.select === true">
  55. <image class="serobVicon" src="/static/order/ud20.png"></image>
  56. </view>
  57. </view>
  58. </u-grid-item>
  59. </u-grid>
  60. <!-- <view class="serobReminder">-->
  61. <!-- <text>请注意,一人一号</text>-->
  62. <!-- </view>-->
  63. </view>
  64. <view class="flex-col group " v-for="(item, index) in orderParam.childService">
  65. <view class="flex-row " v-if="serviceObjectList.length>1">
  66. <image class="selectSerobImg" mode="aspectFill" :src="item.facePhotoUrl || '/static/me/ud4.png'"></image>
  67. <text class="selectSerobName">{{item.nickName || '未填写'}}</text>
  68. </view>
  69. <view class="serob">
  70. <text>服务人员以及预约费用</text>
  71. </view>
  72. <view>
  73. <u-grid col="4">
  74. <u-grid-item v-for="(item1,index1) in item.serviceTeacherList" :key="index1">
  75. <view class="serobItem flex-col" @click="selectServiceTeach(item.serviceTeacherList,index,index1)">
  76. <view class="serobImgView">
  77. <image class="serobImg" mode="aspectFill" :src="item1.facePhotoUrl || '/static/me/ud4.png'"></image>
  78. </view>
  79. <text class="serobName ">{{item1.personName || '未填写'}}</text>
  80. <view class="flex-row justify-center ">
  81. <!-- <u-icon name="rmb-circle" size="14"></u-icon>-->
  82. <text class="teachPrice">{{item1.fee}}</text>
  83. </view>
  84. <view class="serobV " v-if="item1.select">
  85. <image class="serobVicon" src="/static/order/ud20.png"></image>
  86. </view>
  87. </view>
  88. </u-grid-item>
  89. </u-grid>
  90. </view>
  91. <view class="serob" :style="{'marginTop':'32rpx'}">
  92. <text>服务时段</text>
  93. </view>
  94. <view v-if="!item.serviceStartTime" class="noTime flex-row justify-center">
  95. <text>暂无可用的服务时段</text>
  96. </view>
  97. <view v-else>
  98. <u-grid :border="false" col="5">
  99. <u-grid-item v-if="item2.total > 0" v-for="(item2,index2) in item.serviceTimeList" :key="index2">
  100. <view class="timeItemView">
  101. <view class="flex-col justify-center timeItem " :class="{selectBack: item2.select}" @click="selectServiceTime(item.serviceTimeList,index,index2)">
  102. <view class="flex-row justify-center">
  103. <text class="time">{{item2.label}}</text>
  104. </view>
  105. <!-- <view class="flex-row justify-center">-->
  106. <!-- <text class="price">¥{{item2.price}}</text>-->
  107. <!-- </view>-->
  108. </view>
  109. </view>
  110. </u-grid-item>
  111. </u-grid>
  112. </view>
  113. </view>
  114. <view class="flex-col group ">
  115. <view class="groupItemKey">
  116. <text>取号规则</text>
  117. </view>
  118. <view class="textareaView ">
  119. <view v-for=" (item,index) in takeNumberRules " class="serobReminder">
  120. <text>{{index+1}}.{{item.dictValue}}。</text>
  121. </view>
  122. <!-- <textarea v-model="orderParam.remark" placeholder-style="color:#999999;fontSize:28rpx"-->
  123. <!-- placeholder="如有其它特殊需求,请在此输入您的需求" />-->
  124. <!-- <view class="serobReminder">-->
  125. <!-- <text>1.预约需要一人一号。</text>-->
  126. <!-- </view>-->
  127. <!-- <view class="serobReminder">-->
  128. <!-- <text>2.目前支付费用为时段预约占位费。</text>-->
  129. <!-- </view>-->
  130. <!-- <view class="serobReminder">-->
  131. <!-- <text>3.服务费用到店享受相应服务以后在另行收取。</text>-->
  132. <!-- </view>-->
  133. <!-- <view class="serobReminder">-->
  134. <!-- <text>4.到门店先签到,过时没有签到占位时段失效。</text>-->
  135. <!-- </view>-->
  136. </view>
  137. </view>
  138. <view :style="{'height':'236rpx'}"></view>
  139. <view class="flex-col group2 ">
  140. <view class="btnTitle flex-row">
  141. <u-icon v-if="selectIcon" name="checkmark-circle-fill" color="#FFE52C" size="18"
  142. @click="selectChange"></u-icon>
  143. <u-icon v-else name="/static/order/ud9.png" color="#FFE52C" size="18" @click="selectChange"></u-icon>
  144. <text :style="{'margin-left':'10rpx'}">请阅读并同意</text>
  145. <text :style="{'color':'red'}" @click="goTermsOfService">《预约需知》</text>
  146. </view>
  147. <view class="btn flex-row justify-between">
  148. <view>
  149. <text class="title">待支付</text>
  150. <text class="num">{{price}}</text>
  151. </view>
  152. <view class="btnRight" @click="openSetting">
  153. <text>提交</text>
  154. </view>
  155. </view>
  156. </view>
  157. <myPay ref="myPay" :selectBlPay="userInfo.balance *1 >= price *1" :balance="userInfo.balance" :totalAmount="price"
  158. :orderNo="subOrderNo" @payResult="payResult" @improperClose="improperClose"></myPay>
  159. </view>
  160. </template>
  161. <script>
  162. import myPay from '../../components/pay/pay';
  163. export default {
  164. components: {
  165. myPay
  166. },
  167. data() {
  168. return {
  169. timeoutId:null,
  170. templateId:[],
  171. //服务对象列表
  172. serviceObjectList:[],
  173. //服务人员列表
  174. serviceTeacherList:[],
  175. userInfo: {},
  176. //服务门店
  177. store: {},
  178. //服务日期列表
  179. periodDateList:[],
  180. //当前选择的服务日期
  181. periodDate: {},
  182. //当前选择的日期下标
  183. periodDateIndex:0,
  184. //预约费用
  185. price: '0',
  186. //订单编号
  187. subOrderNo:'',
  188. selectIcon: true,
  189. orderParam:{
  190. orderType: 1,
  191. serviceAttribute: 2,
  192. serviceStoreId: '',
  193. remark: '',
  194. serviceDate:'',
  195. childService:[
  196. // {
  197. // serviceObjectId: '',
  198. // facePhotoUrl:'', //回显需要,不做参数
  199. // nickName:'', //回显需要,不做参数
  200. // serviceUserId: '',
  201. // personName:'',//回显需要,不做参数
  202. // fee:'',//回显需要,不做参数
  203. // serviceStartTime: '',
  204. // serviceTeacherList:[],//服务人员列表,回显需要,不做参数
  205. // serviceTimeList:[]//服务时段列表,回显需要,不做参数
  206. // }
  207. ]
  208. },
  209. takeNumberData:{
  210. pageNum:1,
  211. pageSize:10,
  212. dictType:'tomorrow_make_rule'
  213. },
  214. takeNumberRules:[],
  215. storeInfo: {},
  216. }
  217. },
  218. onLoad() {
  219. this.store = uni.getStorageSync('storeInfo')
  220. this.orderParam.serviceStoreId = this.store.storeId
  221. this.timeoutId = setTimeout(()=>{
  222. uni.showModal({
  223. title:'温馨提示',
  224. content:'您在下单页面停留太久,请重新进入!',
  225. showCancel:false,
  226. success:res=>{
  227. if (res.confirm){
  228. uni.switchTab({
  229. url: '/pages/index/index',
  230. })
  231. }
  232. }
  233. })
  234. },1000*60*5)
  235. },
  236. onShow() {
  237. this.userInfo = uni.getStorageSync('userInfo')
  238. // 查询门店信息
  239. const data = uni.getStorageSync('storeInfo');
  240. this.store = uni.getStorageSync('storeInfo')
  241. if (!data) {
  242. // 获取位置信息查询门店列表数据
  243. this.getLocation();
  244. } else {
  245. this.storeInfo = data;
  246. }
  247. //获取排班日期
  248. this.selectDate()
  249. this.getTemplateList()
  250. this.getSelectionRules(this.takeNumberData)
  251. },
  252. onUnload(){
  253. clearTimeout(this.timeoutId);
  254. },
  255. methods: {
  256. // 获取门店列表数据
  257. getStoreListData(data) {
  258. let that = this;
  259. // 用户绑定门店
  260. this.$api.storeList(data).then((res) => {
  261. console.log(res.data.data[0])
  262. that.storeInfo = res.data.data[0]
  263. // 更新用户选择的门店信息
  264. uni.setStorageSync('storeInfo', res.data.data[0])
  265. })
  266. },
  267. // 获取经纬度信息
  268. getLocation() {
  269. let that = this
  270. console.log('+++++++++++++开始获取位置信息++++++++++++++++')
  271. uni.getLocation({
  272. type: 'gcj02',
  273. success: function (res) {
  274. console.log(res)
  275. let latitude = res.latitude; // 纬度
  276. let longitude = res.longitude; // 经度
  277. let speed = res.speed; // 速度
  278. let accuracy = res.accuracy; // 精确度
  279. // 在这里可以对位置信息进行处理
  280. console.log("纬度:" + latitude + ";经度" + longitude)
  281. that.reqParm.latitude = latitude
  282. that.reqParm.longitude = longitude
  283. uni.setStorageSync('location', that.reqParm)
  284. that.getStoreListData(that.reqParm)
  285. },
  286. fail:function (fail) {
  287. console.log('获取用户地址失败==》',fail)
  288. that.getStoreListData(that.reqParm)
  289. },
  290. complete:function (complete) {
  291. console.log('获取用户地址失败or成功==》',complete)
  292. }
  293. });
  294. },
  295. // 去选择门店
  296. gotoStoreChoose() {
  297. uni.setStorageSync('router','1')
  298. uni.redirectTo({
  299. url: '/storePages/store/store-choose?type=1',
  300. })
  301. },
  302. back(){
  303. uni.switchTab({
  304. url: '/pages/index/index',
  305. })
  306. },
  307. clickPeriodDateList(e){
  308. console.log("666666666666666",e)
  309. this.periodDateIndex = e.index
  310. this.periodDate = e
  311. this.orderParam.serviceDate=this.periodDate.label
  312. //对所有子订单的服务人员及服务时段重新赋值
  313. this.getServicePerson(this.periodDate.label,true)
  314. },
  315. openSetting(){
  316. if (!this.userInfo.phone){
  317. uni.showModal({
  318. title:'温馨提示',
  319. content:'预约叫号是通过手机尾号进行查询,是否确认绑定手机号',
  320. success:res=>{
  321. if (res.confirm){
  322. uni.navigateTo({
  323. url: '/myPages/setting/setting-telphone',
  324. })
  325. }
  326. }
  327. })
  328. return
  329. }
  330. let flag = false
  331. this.orderParam.childService.forEach(i=>{
  332. if (!i.serviceStartTime || i.serviceStartTime == ''){
  333. uni.$u.toast('有服务对象没有选择服务时段')
  334. flag=true
  335. return
  336. }
  337. })
  338. if (flag){
  339. return;
  340. }
  341. uni.requestSubscribeMessage({
  342. tmplIds: this.templateId,
  343. success: (res) =>{
  344. let {errMsg,...param} = res
  345. console.log('+++++++++++++success+++++++++++++',param)
  346. this.$api.updateSubscribe(param).then(res=>{
  347. console.log('+++++++++++++updateSubscribe+++++++++++++',res)
  348. })
  349. },
  350. fail:(err)=>{
  351. console.log('+++++++++++++fail+++++++++++++',err)
  352. },
  353. complete:(complete)=>{
  354. console.log('+++++++++++++complete+++++++++++++',complete)
  355. this.commitOrder()
  356. }
  357. })
  358. },
  359. getTemplateList(){
  360. this.$api.getTemplateList().then(res=>{
  361. this.templateId=res.data.data.data.map(item=>{
  362. return item.priTmplId
  363. })
  364. })
  365. },
  366. improperClose(){
  367. uni.switchTab({
  368. url: '/pages/order/index'
  369. })
  370. },
  371. bindPickerChange(e){
  372. console.log(e)
  373. if (e.detail.value == this.periodDateIndex){
  374. return
  375. }
  376. console.log('++++++++++++++')
  377. this.periodDateIndex = e.detail.value
  378. this.periodDate = this.periodDateList[e.detail.value]
  379. this.orderParam.serviceDate=this.periodDate.label
  380. //对所有子订单的服务人员及服务时段重新赋值
  381. this.getServicePerson(this.periodDate.label,true)
  382. },
  383. //获取排班日期
  384. selectDate() {
  385. console.log(this.store)
  386. this.$api.selectDate({
  387. organization: this.store.storeId
  388. }).then(res => {
  389. this.periodDate = res.data.data[0]
  390. this.periodDateList = res.data.data
  391. for (const argument of this.periodDateList) {
  392. let month = argument.label.substring(5,6) == 0 ? argument.label.substring(6,7) : argument.label.substring(5,7)
  393. let day = argument.label.substring(8,9) == 0 ? argument.label.substring(9,10) : argument.label.substring(8,10)
  394. argument.name =month + '月' + day +'日'
  395. }
  396. this.orderParam.serviceDate=this.periodDate.label
  397. this.getServicePerson(this.periodDate.label,false)
  398. })
  399. },
  400. // 查询服务工作人员列表
  401. getServicePerson(date,bindPickerChange) {
  402. this.$api.getServicePerson({
  403. storeId:this.store.storeId,
  404. date:date
  405. }).then((res) => {
  406. this.serviceTeacherList = res.data.data;
  407. if (this.serviceTeacherList.length > 0){
  408. this.serviceTeacherList[0].select = true
  409. this.getServicePersonUrl(this.serviceTeacherList);
  410. }
  411. if (bindPickerChange){
  412. if (this.orderParam.childService.length === 0){
  413. // this.selectServiceObject(this.serviceObjectList[0])
  414. }else {
  415. this.serviceObjectList.forEach(i=>{
  416. if (i.select){
  417. this.orderParam.childService=[]
  418. i.select = false
  419. this.selectServiceObject(i)
  420. }
  421. })
  422. }
  423. }else {
  424. this.listServiceObject()
  425. }
  426. })
  427. },
  428. getServicePersonUrl(items){
  429. for (let i = 0; i < items.length; i++) {
  430. if (items[i].facePhoto) {
  431. this.$api.getImgUrlByOssId({
  432. ossId: items[i].facePhoto
  433. }).then(res => {
  434. items[i].facePhotoUrl = res.data.data[0].url.replace(/^http:/, "https:")
  435. this.$set(this.serviceTeacherList, i, items[i])
  436. })
  437. }
  438. }
  439. },
  440. // 查询服务对象信息列表
  441. listServiceObject() {
  442. this.$api.listServiceObject(this.reqParm).then((res) => {
  443. console.log(res)
  444. this.serviceObjectList = res.data.data
  445. this.getServiceObjectUrl(this.serviceObjectList);
  446. })
  447. },
  448. // 获取图片
  449. getServiceObjectUrl(items) {
  450. for (let i = 0; i < items.length; i++) {
  451. if (items[i].facePhoto) {
  452. this.$api.getImgUrlByOssId({
  453. ossId: items[i].facePhoto
  454. }).then(res => {
  455. items[i].facePhotoUrl = res.data.data[0].url.replace(/^http:/, "https:")
  456. this.$set(this.serviceObjectList, i, items[i])
  457. })
  458. }
  459. if (i === 0){
  460. // this.selectServiceObject(items[i])
  461. }
  462. }
  463. },
  464. selectServiceObject(item) {
  465. if (!this.serviceTeacherList || this.serviceTeacherList.length==0){
  466. uni.showToast({
  467. icon: 'none',
  468. duration: 2000,
  469. title: '暂无可预约排班'
  470. });
  471. return
  472. }
  473. if (item.select) {
  474. this.orderParam.childService = this.orderParam.childService.filter(selectServiceObject =>
  475. selectServiceObject.serviceObjectId !== item.id)
  476. item.select = !item.select
  477. } else {
  478. this.$api.getServicePersonTime({
  479. personId: this.serviceTeacherList[0].personId,
  480. date: this.periodDate.label,
  481. storeId:this.store.storeId
  482. }).then(res => {
  483. item.select = !item.select
  484. let selectServiceObjectList = this.orderParam.childService
  485. let periodTimeList = res.data.data
  486. if (!res.data.data || res.data.data.length==0){
  487. //这里只为了断开技师列表的应用关系
  488. let serviceTeacherListStr = JSON.stringify(this.serviceTeacherList)
  489. let serviceTeacherList = JSON.parse(serviceTeacherListStr)
  490. let childService ={
  491. serviceObjectId: item.id,
  492. facePhotoUrl:item.facePhotoUrl, //回显需要,不做参数
  493. nickName:item.nickName, //回显需要,不做参数
  494. serviceUserId: serviceTeacherList[0].personId,
  495. fee:0,//回显需要,不做参数
  496. serviceStartTime: '',
  497. serviceTeacherList:serviceTeacherList,//服务人员列表,回显需要,不做参数
  498. serviceTimeList:periodTimeList//服务时段列表,回显需要,不做参数
  499. }
  500. this.orderParam.childService.push(childService)
  501. this.price = 0
  502. for (let childService of this.orderParam.childService) {
  503. this.price = this.price * 1 + childService.fee * 1
  504. this.price = this.price.toFixed(2)
  505. }
  506. return
  507. }
  508. //选择服务对象时,获取的排班时间为全部技师的排班时间,所以只要某个时段被选过,那么这个时段的数量-1
  509. selectServiceObjectList.forEach(selectServiceObject =>{
  510. periodTimeList.forEach(periodTime =>{
  511. if (selectServiceObject.serviceStartTime == periodTime.label ){
  512. periodTime.total = periodTime.total - 1
  513. }
  514. })
  515. })
  516. let date = null //系统为当前服务对象分配的时间
  517. for (const time of periodTimeList) {
  518. if (time.total>0){
  519. time.select = true
  520. date = time
  521. //为当前服务对象分配时间段成功时,需要将以前的服务对象的可选择的时间段的total -1
  522. selectServiceObjectList.forEach(selectServiceObject =>{
  523. if (selectServiceObject.serviceUserId === -1){
  524. //如果子订单没有指定技师,则对应的时段-1
  525. selectServiceObject.serviceTimeList.forEach(t=>{
  526. if (t.label == date.label){
  527. t.total = t.total -1
  528. }
  529. })
  530. }else {
  531. selectServiceObject.serviceTimeList.forEach(t=>{
  532. //如果子订单指定技师,且该技师的服务时段未被选中,则对应的时段-1
  533. if (t.label == date.label && !t.select){
  534. t.total = t.total -1
  535. }
  536. })
  537. }
  538. })
  539. break
  540. }
  541. }
  542. console.log(periodTimeList)
  543. //这里只为了断开技师列表的应用关系
  544. let serviceTeacherListStr = JSON.stringify(this.serviceTeacherList)
  545. let serviceTeacherList = JSON.parse(serviceTeacherListStr)
  546. //创建子订单项
  547. let childService ={
  548. serviceObjectId: item.id,
  549. facePhotoUrl:item.facePhotoUrl, //回显需要,不做参数
  550. nickName:item.nickName, //回显需要,不做参数
  551. serviceUserId: serviceTeacherList[0].personId,
  552. fee:serviceTeacherList[0].fee,//回显需要,不做参数
  553. serviceStartTime: date.label,
  554. serviceTeacherList:serviceTeacherList,//服务人员列表,回显需要,不做参数
  555. serviceTimeList:periodTimeList//服务时段列表,回显需要,不做参数
  556. }
  557. this.orderParam.childService.push(childService)
  558. this.price = 0
  559. for (let childService of this.orderParam.childService) {
  560. this.price = this.price * 1 + childService.fee * 1
  561. this.price = this.price.toFixed(2)
  562. }
  563. })
  564. }
  565. },
  566. selectServiceTeach(items,index,index1){
  567. items.forEach(e=>{
  568. e.select=false
  569. })
  570. items[index1].select =true
  571. this.orderParam.childService[index].fee = items[index1].fee
  572. this.orderParam.childService[index].serviceUserId = items[index1].personId
  573. this.$api.getServicePersonTime({
  574. personId: items[index1].personId,
  575. date: this.periodDate.label,
  576. storeId:this.store.storeId
  577. }).then(res => {
  578. let serviceTimeList = res.data.data
  579. if (!serviceTimeList || serviceTimeList.length == 0){
  580. this.orderParam.childService[index].serviceStartTime = ''
  581. this.orderParam.childService[index].periodTimeList = []
  582. this.orderParam.childService[index].fee = 0
  583. this.price = 0
  584. for (let childService of this.orderParam.childService) {
  585. this.price = this.price * 1 + childService.fee * 1
  586. this.price = this.price.toFixed(2)
  587. }
  588. console.log(this.price)
  589. this.$forceUpdate()
  590. }else {
  591. let selectServiceObjectList = this.orderParam.childService.filter(selectServiceObject =>
  592. (selectServiceObject.serviceUserId === items[index1].personId
  593. && selectServiceObject.serviceObjectId !== this.orderParam.childService[index].serviceObjectId)
  594. || selectServiceObject.serviceUserId === -1
  595. )
  596. selectServiceObjectList.forEach(selectServiceObject =>{
  597. serviceTimeList.forEach(periodTime =>{
  598. if (selectServiceObject.serviceStartTime === periodTime.label ){
  599. if (selectServiceObject.serviceUserId === -1){
  600. selectServiceObject.serviceTimeList.forEach(t=>{
  601. if (t.label == periodTime.label && t.total === 1){
  602. periodTime.total = periodTime.total - 1
  603. }
  604. })
  605. }else {
  606. periodTime.total = periodTime.total - 1
  607. }
  608. }
  609. })
  610. })
  611. for (const time of serviceTimeList) {
  612. if (time.total>0){
  613. time.select = true
  614. break
  615. }
  616. }
  617. serviceTimeList[0].select = true
  618. this.orderParam.childService[index].serviceStartTime= serviceTimeList[0].label,
  619. this.orderParam.childService[index].serviceTimeList= serviceTimeList
  620. }
  621. })
  622. this.price = 0
  623. for (let childService of this.orderParam.childService) {
  624. this.price = this.price * 1 + childService.fee * 1
  625. this.price = this.price.toFixed(2)
  626. }
  627. console.log(this.price)
  628. this.$forceUpdate()
  629. },
  630. selectServiceTime(items,index,index2){
  631. console.log(items,index,index2)
  632. items.forEach(e=>{
  633. e.select=false
  634. })
  635. items[index2].select =true // 新选中的时间
  636. // let selectServiceObject = this.orderParam.childService[index] //旧的时间
  637. // this.orderParam.childService.forEach(i=>{
  638. // if (selectServiceObject.serviceUserId === -1){
  639. // i.serviceTimeList.forEach(t=>{
  640. // if (t.label == selectServiceObject.serviceStartTime && !t.select ){
  641. // console.log('-1----------加1')
  642. // t.total +=1
  643. // }
  644. // if (t.label == items[index2].serviceStartTime && i.serviceObjectId != selectServiceObject.serviceObjectId){
  645. // console.log('-1----------减1')
  646. // t.total -=1
  647. // }
  648. // })
  649. // }else {
  650. // if (selectServiceObject.serviceUserId == i.serviceUserId){
  651. // i.serviceTimeList.forEach(t=>{
  652. // if (t.label == selectServiceObject.serviceStartTime && !t.select ){
  653. // t.total +=1
  654. // }
  655. // if (t.label == items[index2].serviceStartTime && i.serviceObjectId != selectServiceObject.serviceObjectId){
  656. // t.total -=1
  657. // }
  658. // })
  659. // }
  660. // }
  661. // })
  662. this.orderParam.childService[index].serviceStartTime = items[index2].label
  663. this.$forceUpdate()
  664. },
  665. selectChange() {
  666. this.selectIcon = !this.selectIcon
  667. },
  668. goTermsOfService() {
  669. uni.navigateTo({
  670. url: '/myPages/TermsOfService/index?name=' + '预约需知' + '&type=' + 5
  671. })
  672. },
  673. //支付组件回调
  674. payResult(e){
  675. console.log(e)
  676. if(e.payResult){
  677. uni.showToast({
  678. title: '支付成功!'
  679. });
  680. }else {
  681. uni.showToast({
  682. title: '支付失败',
  683. icon: 'error'
  684. });
  685. }
  686. setTimeout(()=>{
  687. uni.switchTab({
  688. url: '/pages/order/index'
  689. })
  690. },1000)
  691. },
  692. //提交订单
  693. commitOrder() {
  694. if (this.subOrderNo){
  695. this.$refs.myPay.openPopup()
  696. }else {
  697. if (!this.selectIcon) {
  698. uni.$u.toast('请阅读并同意《预约需知》')
  699. return;
  700. }
  701. if (this.orderParam.childService.length === 0) {
  702. uni.$u.toast('请选择服务对象')
  703. return;
  704. }
  705. if (this.requestStatus) {
  706. return;
  707. }
  708. this.requestStatus = true
  709. uni.showLoading({
  710. title: '加载中'
  711. });
  712. this.$api.commonGeneralOrder(this.orderParam).then(res => {
  713. console.log('++++++++++++++++++订单提交+++++++++++', res)
  714. if (res.data.data.subOrderNo) {
  715. uni.hideLoading();
  716. this.subOrderNo = res.data.data.subOrderNo
  717. this.$refs.myPay.openPopup()
  718. } else {
  719. uni.hideLoading();
  720. uni.$u.toast('预约成功')
  721. setTimeout(() => {
  722. uni.switchTab({
  723. url: '/pages/order/index'
  724. })
  725. }, 500)
  726. }
  727. this.requestStatus = false
  728. }).catch(err => {
  729. this.requestStatus = false
  730. })
  731. }
  732. },
  733. getSelectionRules(data){
  734. this.$api.getSelectionRules(data).then(res=>{
  735. console.log(res.data.rows,'222222222222')
  736. this.takeNumberRules = res.data.rows
  737. })
  738. },
  739. }
  740. }
  741. </script>
  742. <style scoped lang="scss">
  743. @import './index.rpx.scss';
  744. .store-wrap {
  745. margin-top: 10rpx;
  746. background-color: white;
  747. .store-info {
  748. display: flex;
  749. .logo {
  750. width: 10%;
  751. text-align: center;
  752. display: flex;
  753. justify-content: center;
  754. align-items: center;
  755. image {
  756. width: 30px;
  757. height: 30px;
  758. }
  759. }
  760. .store-content {
  761. width: 90%;
  762. padding-bottom: 13px;
  763. .h-row {
  764. display: flex;
  765. align-items: center;
  766. justify-content: space-between;
  767. .store-desc {
  768. width: 90%;
  769. display: flex;
  770. line-height: 30px;
  771. font-size: 14px;
  772. .store-name {
  773. }
  774. }
  775. .arrow-right {
  776. text-align: right;
  777. margin: 0 auto;
  778. cursor: pointer;
  779. padding-top: 3px;
  780. width: 100px;
  781. display: flex;
  782. font-size: 14px;
  783. .change-store {
  784. text-align: right;
  785. color: #666;
  786. }
  787. image {
  788. width: 18px;
  789. height: 18px;
  790. }
  791. }
  792. .address {
  793. color: #999999;
  794. font-size: 12px;
  795. padding-right: 12px;
  796. }
  797. }
  798. }
  799. }
  800. .adress {
  801. font-size: 22rpx;
  802. white-space: nowrap;
  803. overflow: hidden;
  804. text-overflow: ellipsis;
  805. padding-left: 80rpx;
  806. color: #666;
  807. }
  808. }
  809. </style>