index.vue 31 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046
  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="address1">{{storeInfo.distanceDesc}}</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':'280rpx'}"></view>
  139. <view class="flex-col group2 ">
  140. <view v-if="recommendActivity" class="btnTitle1 flex-row justify-between">
  141. <view>
  142. <text>推荐活动:{{recommendActivity.title}}</text>
  143. <text style="margin-left: 10rpx;color: #999999" >({{recommendActivity.description}})</text>
  144. </view>
  145. <view class="btnRight1" @click="goDetail(recommendActivity)">购买({{recommendActivity.salePrice}})</view>
  146. </view>
  147. <view class="btnTitle flex-row">
  148. <u-icon v-if="selectIcon" name="checkmark-circle-fill" color="#FFE52C" size="18"
  149. @click="selectChange"></u-icon>
  150. <u-icon v-else name="/static/order/ud9.png" color="#FFE52C" size="18" @click="selectChange"></u-icon>
  151. <text :style="{'margin-left':'10rpx'}">请阅读并同意</text>
  152. <text :style="{'color':'red'}" @click="goTermsOfService">《预约需知》</text>
  153. </view>
  154. <view class="btn flex-row justify-between">
  155. <view>
  156. <text class="title">待支付</text>
  157. <text class="num">{{price}}</text>
  158. </view>
  159. <view class="btnRight" @click="openSetting">
  160. <text>提交</text>
  161. </view>
  162. </view>
  163. </view>
  164. <myPay ref="myPay" :selectBlPay="userInfo.balance *1 >= price *1" :balance="userInfo.balance" :totalAmount="price" :storeId="store.storeId"
  165. :orderNo="subOrderNo" @payResult="payResult" @improperClose="improperClose"></myPay>
  166. <uni-popup ref="reservationQueuePopup">
  167. <uni-popup-dialog :type="msgType" cancelText="不再提示" confirmText="已知晓" title="提示" :content="configContent" @confirm="dialogConfirm"
  168. @close="dialogClose"></uni-popup-dialog>
  169. </uni-popup>
  170. <uni-popup ref="showExpireEquityCard">
  171. <view class="flex-col justify-start expirePopup" >
  172. <view class="flex-row justify-center">
  173. <text class="popupTitle">到期提醒</text>
  174. </view>
  175. <scroll-view scroll-y class="flex-col justify-start" :class="[ expireEquityCard.length > 1 ? 'scroll-y1':'scroll-y']" >
  176. <view class="flex-row listView" v-for="(item,index) in expireEquityCard">
  177. <view class="h-text flex-col justify-center ">
  178. <view class="money">
  179. <text>{{ item.faceValue }}</text>
  180. </view>
  181. </view>
  182. <view class="h-center-content flex-col justify-around">
  183. <view class="h-value">
  184. <text>{{ item.title }}</text>
  185. </view>
  186. <view class="title1">
  187. 服务对象:{{ item.serviceObjectName || '' }}
  188. </view>
  189. <view class="title1">
  190. 适用门店:{{ item.useStoreDesc || '' }} {{ item.use_store_desc || '' }} {{ item.useStoreDesc || '' }} {{ item.useStoreDesc || '' }}
  191. </view>
  192. <view class="title1">
  193. 到期时间:{{ item.effectiveEndTime.slice(0,10) }}
  194. </view>
  195. </view>
  196. <view class="h-right-content flex-col justify-center ">
  197. <view class="btn1" @click="navigateTo(item)">
  198. <text>续费</text>
  199. </view>
  200. </view>
  201. </view>
  202. </scroll-view>
  203. </view>
  204. </uni-popup>
  205. </view>
  206. </template>
  207. <script>
  208. import myPay from '../../components/pay/pay';
  209. export default {
  210. components: {
  211. myPay
  212. },
  213. data() {
  214. return {
  215. recommendActivity:null,
  216. msgType:null,
  217. configContent:'',
  218. timeoutId:null,
  219. templateId:[],
  220. //服务对象列表
  221. serviceObjectList:[],
  222. //服务人员列表
  223. serviceTeacherList:[],
  224. userInfo: {},
  225. //服务门店
  226. store: {},
  227. //服务日期列表
  228. periodDateList:[],
  229. //当前选择的服务日期
  230. periodDate: {},
  231. //当前选择的日期下标
  232. periodDateIndex:0,
  233. //预约费用
  234. price: '0',
  235. //订单编号
  236. subOrderNo:'',
  237. selectIcon: true,
  238. orderParam:{
  239. orderType: 1,
  240. serviceAttribute: 2,
  241. serviceStoreId: '',
  242. remark: '',
  243. serviceDate:'',
  244. childService:[
  245. // {
  246. // serviceObjectId: '',
  247. // facePhotoUrl:'', //回显需要,不做参数
  248. // nickName:'', //回显需要,不做参数
  249. // serviceUserId: '',
  250. // personName:'',//回显需要,不做参数
  251. // fee:'',//回显需要,不做参数
  252. // serviceStartTime: '',
  253. // serviceTeacherList:[],//服务人员列表,回显需要,不做参数
  254. // serviceTimeList:[]//服务时段列表,回显需要,不做参数
  255. // }
  256. ]
  257. },
  258. takeNumberData:{
  259. pageNum:1,
  260. pageSize:10,
  261. dictType:'tomorrow_make_rule'
  262. },
  263. takeNumberRules:[],
  264. storeInfo: {},
  265. expireEquityCard:[], //过期的权益卡
  266. }
  267. },
  268. onLoad() {
  269. this.store = uni.getStorageSync('storeInfo')
  270. this.orderParam.serviceStoreId = this.store.storeId
  271. this.timeoutId = setTimeout(()=>{
  272. uni.showModal({
  273. title:'温馨提示',
  274. content:'您在下单页面停留太久,请重新进入!',
  275. showCancel:false,
  276. success:res=>{
  277. if (res.confirm){
  278. uni.switchTab({
  279. url: '/pages/index/index',
  280. })
  281. }
  282. }
  283. })
  284. },1000*60*5)
  285. this.getExpireEquityCard();
  286. this.getRecommendActivity();
  287. },
  288. onShow() {
  289. //获取弹窗设置
  290. let reservationQueueContent = uni.getStorageSync('reservation_queue_content');
  291. if (!reservationQueueContent){
  292. this.getConfigKey('reservation_queue_content')
  293. }
  294. this.userInfo = uni.getStorageSync('userInfo')
  295. // 查询门店信息
  296. const data = uni.getStorageSync('storeInfo');
  297. this.store = uni.getStorageSync('storeInfo')
  298. if (!data) {
  299. // 获取位置信息查询门店列表数据
  300. this.getLocation();
  301. } else {
  302. this.storeInfo = data;
  303. }
  304. this.orderParam.childService = []
  305. this.price = 0
  306. //获取排班日期
  307. this.selectDate()
  308. this.getTemplateList()
  309. this.getSelectionRules(this.takeNumberData)
  310. },
  311. onUnload(){
  312. clearTimeout(this.timeoutId);
  313. },
  314. methods: {
  315. goDetail(e){
  316. uni.navigateTo({
  317. url:'/orderPages/activityDetail/activityDetail?id=' + e.id
  318. })
  319. },
  320. getRecommendActivity(){
  321. this.$api.getRecommendActivity().then(res=>{
  322. this.recommendActivity = res.data.data
  323. })
  324. },
  325. navigateTo(item){
  326. if(item.activityId){
  327. let list = item.activityId.split(',')
  328. if (list.length == 1){
  329. uni.navigateTo({
  330. url:'/orderPages/activityDetail/activityDetail?id=' + item.activityId +'&renewServiceObjectId=' + item.serviceObjectId
  331. })
  332. }else {
  333. uni.navigateTo({
  334. url:'/orderPages/activityList/activityList?renewServiceObjectId=' + item.serviceObjectId + '&equityCardId=' + item.equityCardId
  335. })
  336. }
  337. }else{
  338. uni.navigateTo({
  339. url:'/orderPages/activityList/activityList'
  340. })
  341. }
  342. },
  343. getExpireEquityCard(){
  344. this.$api.getExpireEquityCard({
  345. serviceObjectId:0
  346. }).then((res)=>{
  347. this.expireEquityCard = res.data.data;
  348. // if (this.expireEquityCard.length > 0){
  349. // uni.showModal({
  350. // title:'温馨提示',
  351. // content:'您有' + this.expireEquityCard.length + '张权益卡即将到期',
  352. // confirmText:'立即续费',
  353. // success:(res)=>{
  354. // if (res.confirm) {
  355. // console.log('用户点击确定');
  356. // uni.navigateTo({
  357. // url:'/storePages/myRights/index'
  358. // })
  359. // } else if (res.cancel) {
  360. // console.log('用户点击取消');
  361. // }
  362. // }
  363. // })
  364. // }
  365. if (this.expireEquityCard.length > 0){
  366. this.$refs.showExpireEquityCard.open()
  367. }
  368. })
  369. },
  370. dialogConfirm(){
  371. this.configContent = '';
  372. },
  373. dialogClose(){
  374. uni.setStorageSync('reservation_queue_content',true);
  375. this.configContent = '';
  376. },
  377. getConfigKey(key){
  378. this.$api.getConfigKey({key:key}).then(res=>{
  379. console.log('获取到的配置信息',res.data.msg)
  380. if (res.data.msg){
  381. //打开弹窗
  382. this.configContent = res.data.msg
  383. this.$refs.reservationQueuePopup.open()
  384. }
  385. })
  386. },
  387. // 获取门店列表数据
  388. getStoreListData(data) {
  389. let that = this;
  390. // 用户绑定门店
  391. this.$api.storeList(data).then((res) => {
  392. that.storeInfo = res.data.data[0]
  393. // 更新用户选择的门店信息
  394. uni.setStorageSync('storeInfo', res.data.data[0])
  395. })
  396. },
  397. // 获取经纬度信息
  398. getLocation() {
  399. let that = this
  400. uni.getLocation({
  401. type: 'gcj02',
  402. success: function (res) {
  403. let latitude = res.latitude; // 纬度
  404. let longitude = res.longitude; // 经度
  405. let speed = res.speed; // 速度
  406. let accuracy = res.accuracy; // 精确度
  407. // 在这里可以对位置信息进行处理
  408. console.log("纬度:" + latitude + ";经度" + longitude)
  409. that.reqParm.latitude = latitude
  410. that.reqParm.longitude = longitude
  411. uni.setStorageSync('location', that.reqParm)
  412. that.getStoreListData(that.reqParm)
  413. },
  414. fail:function (fail) {
  415. that.getStoreListData(that.reqParm)
  416. },
  417. complete:function (complete) {
  418. console.log('获取用户地址失败or成功==》',complete)
  419. }
  420. });
  421. },
  422. // 去选择门店
  423. gotoStoreChoose() {
  424. uni.setStorageSync('router','2')
  425. uni.navigateTo({
  426. url: '/storePages/store/store-choose?type=1',
  427. })
  428. },
  429. back(){
  430. uni.switchTab({
  431. url: '/pages/index/index',
  432. })
  433. },
  434. clickPeriodDateList(e){
  435. this.periodDateIndex = e.index
  436. this.periodDate = e
  437. this.orderParam.serviceDate=this.periodDate.label
  438. //对所有子订单的服务人员及服务时段重新赋值
  439. this.getServicePerson(this.periodDate.label,true)
  440. },
  441. openSetting(){
  442. if (!this.userInfo.phone){
  443. uni.showModal({
  444. title:'温馨提示',
  445. content:'预约叫号是通过手机尾号进行查询,是否确认绑定手机号',
  446. success:res=>{
  447. if (res.confirm){
  448. uni.navigateTo({
  449. url: '/myPages/setting/setting-telphone',
  450. })
  451. }
  452. }
  453. })
  454. return
  455. }
  456. let flag = false
  457. this.orderParam.childService.forEach(i=>{
  458. if (!i.serviceStartTime || i.serviceStartTime == ''){
  459. uni.$u.toast('有服务对象没有选择服务时段')
  460. flag=true
  461. return
  462. }
  463. })
  464. if (flag){
  465. return;
  466. }
  467. uni.requestSubscribeMessage({
  468. tmplIds: this.templateId,
  469. success: (res) =>{
  470. let {errMsg,...param} = res
  471. this.$api.updateSubscribe(param).then(res=>{
  472. console.log('+++++++++++++updateSubscribe+++++++++++++',res)
  473. })
  474. },
  475. fail:(err)=>{
  476. console.log('+++++++++++++fail+++++++++++++',err)
  477. },
  478. complete:(complete)=>{
  479. this.commitOrder()
  480. }
  481. })
  482. },
  483. getTemplateList(){
  484. this.$api.getTemplateList({
  485. type:1
  486. }).then(res=>{
  487. this.templateId=res.data.data.data.map(item=>{
  488. return item.priTmplId
  489. })
  490. })
  491. },
  492. improperClose(){
  493. uni.switchTab({
  494. url: '/pages/order/index'
  495. })
  496. },
  497. bindPickerChange(e){
  498. if (e.detail.value == this.periodDateIndex){
  499. return
  500. }
  501. this.periodDateIndex = e.detail.value
  502. this.periodDate = this.periodDateList[e.detail.value]
  503. this.orderParam.serviceDate=this.periodDate.label
  504. //对所有子订单的服务人员及服务时段重新赋值
  505. this.getServicePerson(this.periodDate.label,true)
  506. },
  507. //获取排班日期
  508. selectDate() {
  509. this.$api.selectDate({
  510. organization: this.store.storeId
  511. }).then(res => {
  512. this.periodDate = res.data.data[0]
  513. this.periodDateList = res.data.data
  514. for (const argument of this.periodDateList) {
  515. let month = argument.label.substring(5,6) == 0 ? argument.label.substring(6,7) : argument.label.substring(5,7)
  516. let day = argument.label.substring(8,9) == 0 ? argument.label.substring(9,10) : argument.label.substring(8,10)
  517. argument.name =month + '月' + day +'日'
  518. }
  519. this.orderParam.serviceDate=this.periodDate.label
  520. this.getServicePerson(this.periodDate.label,false)
  521. })
  522. },
  523. // 查询服务工作人员列表
  524. getServicePerson(date,bindPickerChange) {
  525. this.$api.getServicePerson({
  526. storeId:this.store.storeId,
  527. date:date
  528. }).then((res) => {
  529. this.serviceTeacherList = res.data.data;
  530. if (this.serviceTeacherList.length > 0){
  531. this.serviceTeacherList[0].select = true
  532. this.getServicePersonUrl(this.serviceTeacherList);
  533. }
  534. if (bindPickerChange){
  535. if (this.orderParam.childService.length === 0){
  536. // this.selectServiceObject(this.serviceObjectList[0])
  537. }else {
  538. this.serviceObjectList.forEach(i=>{
  539. if (i.select){
  540. this.orderParam.childService=[]
  541. i.select = false
  542. this.selectServiceObject(i)
  543. }
  544. })
  545. }
  546. }else {
  547. this.listServiceObject()
  548. }
  549. })
  550. },
  551. getServicePersonUrl(items){
  552. for (let i = 0; i < items.length; i++) {
  553. if (items[i].facePhoto) {
  554. this.$api.getImgUrlByOssId({
  555. ossId: items[i].facePhoto
  556. }).then(res => {
  557. items[i].facePhotoUrl = res.data.data[0].url.replace(/^http:/, "https:")
  558. this.$set(this.serviceTeacherList, i, items[i])
  559. })
  560. }
  561. }
  562. },
  563. // 查询服务对象信息列表
  564. listServiceObject() {
  565. this.$api.listServiceObject(this.reqParm).then((res) => {
  566. this.serviceObjectList = res.data.data
  567. this.getServiceObjectUrl(this.serviceObjectList);
  568. })
  569. },
  570. // 获取图片
  571. getServiceObjectUrl(items) {
  572. for (let i = 0; i < items.length; i++) {
  573. if (items[i].facePhoto) {
  574. this.$api.getImgUrlByOssId({
  575. ossId: items[i].facePhoto
  576. }).then(res => {
  577. items[i].facePhotoUrl = res.data.data[0].url.replace(/^http:/, "https:")
  578. this.$set(this.serviceObjectList, i, items[i])
  579. })
  580. }
  581. if (i === 0){
  582. // this.selectServiceObject(items[i])
  583. }
  584. }
  585. },
  586. selectServiceObject(item) {
  587. if (!this.serviceTeacherList || this.serviceTeacherList.length==0){
  588. uni.showToast({
  589. icon: 'none',
  590. duration: 2000,
  591. title: '暂无可预约排班'
  592. });
  593. return
  594. }
  595. if (item.select) {
  596. this.orderParam.childService = this.orderParam.childService.filter(selectServiceObject =>
  597. selectServiceObject.serviceObjectId !== item.id)
  598. item.select = !item.select
  599. this.price = 0
  600. for (let childService of this.orderParam.childService) {
  601. this.price = this.price * 1 + childService.fee * 1
  602. this.price = this.price.toFixed(2)
  603. }
  604. } else {
  605. uni.showModal({
  606. title:"温馨提示",
  607. content:"当前默认门店为" + this.storeInfo.storeName + "是否需要更换",
  608. showCancel:false,
  609. confirmText:"知道了"
  610. })
  611. this.$api.getServicePersonTime({
  612. personId: this.serviceTeacherList[0].personId,
  613. date: this.periodDate.label,
  614. storeId:this.store.storeId
  615. }).then(res => {
  616. item.select = !item.select
  617. let selectServiceObjectList = this.orderParam.childService
  618. let periodTimeList = res.data.data
  619. if (!res.data.data || res.data.data.length==0){
  620. //这里只为了断开技师列表的应用关系
  621. let serviceTeacherListStr = JSON.stringify(this.serviceTeacherList)
  622. let serviceTeacherList = JSON.parse(serviceTeacherListStr)
  623. let childService ={
  624. serviceObjectId: item.id,
  625. facePhotoUrl:item.facePhotoUrl, //回显需要,不做参数
  626. nickName:item.nickName, //回显需要,不做参数
  627. serviceUserId: serviceTeacherList[0].personId,
  628. fee:0,//回显需要,不做参数
  629. serviceStartTime: '',
  630. serviceTeacherList:serviceTeacherList,//服务人员列表,回显需要,不做参数
  631. serviceTimeList:periodTimeList//服务时段列表,回显需要,不做参数
  632. }
  633. this.orderParam.childService.push(childService)
  634. this.price = 0
  635. for (let childService of this.orderParam.childService) {
  636. this.price = this.price * 1 + childService.fee * 1
  637. this.price = this.price.toFixed(2)
  638. }
  639. return
  640. }
  641. //选择服务对象时,获取的排班时间为全部技师的排班时间,所以只要某个时段被选过,那么这个时段的数量-1
  642. selectServiceObjectList.forEach(selectServiceObject =>{
  643. periodTimeList.forEach(periodTime =>{
  644. if (selectServiceObject.serviceStartTime == periodTime.label ){
  645. periodTime.total = periodTime.total - 1
  646. }
  647. })
  648. })
  649. let date = null //系统为当前服务对象分配的时间
  650. for (const time of periodTimeList) {
  651. if (time.total>0){
  652. time.select = true
  653. date = time
  654. //为当前服务对象分配时间段成功时,需要将以前的服务对象的可选择的时间段的total -1
  655. selectServiceObjectList.forEach(selectServiceObject =>{
  656. if (selectServiceObject.serviceUserId === -1){
  657. //如果子订单没有指定技师,则对应的时段-1
  658. selectServiceObject.serviceTimeList.forEach(t=>{
  659. if (t.label == date.label){
  660. t.total = t.total -1
  661. }
  662. })
  663. }else {
  664. selectServiceObject.serviceTimeList.forEach(t=>{
  665. //如果子订单指定技师,且该技师的服务时段未被选中,则对应的时段-1
  666. if (t.label == date.label && !t.select){
  667. t.total = t.total -1
  668. }
  669. })
  670. }
  671. })
  672. break
  673. }
  674. }
  675. //这里只为了断开技师列表的应用关系
  676. let serviceTeacherListStr = JSON.stringify(this.serviceTeacherList)
  677. let serviceTeacherList = JSON.parse(serviceTeacherListStr)
  678. //创建子订单项
  679. let childService ={
  680. serviceObjectId: item.id,
  681. facePhotoUrl:item.facePhotoUrl, //回显需要,不做参数
  682. nickName:item.nickName, //回显需要,不做参数
  683. serviceUserId: serviceTeacherList[0].personId,
  684. fee:serviceTeacherList[0].fee,//回显需要,不做参数
  685. serviceStartTime: date.label,
  686. serviceTeacherList:serviceTeacherList,//服务人员列表,回显需要,不做参数
  687. serviceTimeList:periodTimeList//服务时段列表,回显需要,不做参数
  688. }
  689. this.orderParam.childService.push(childService)
  690. this.price = 0
  691. for (let childService of this.orderParam.childService) {
  692. this.price = this.price * 1 + childService.fee * 1
  693. this.price = this.price.toFixed(2)
  694. }
  695. })
  696. }
  697. },
  698. selectServiceTeach(items,index,index1){
  699. items.forEach(e=>{
  700. e.select=false
  701. })
  702. items[index1].select =true
  703. this.orderParam.childService[index].fee = items[index1].fee
  704. this.orderParam.childService[index].serviceUserId = items[index1].personId
  705. this.$api.getServicePersonTime({
  706. personId: items[index1].personId,
  707. date: this.periodDate.label,
  708. storeId:this.store.storeId
  709. }).then(res => {
  710. let serviceTimeList = res.data.data
  711. if (!serviceTimeList || serviceTimeList.length == 0){
  712. this.orderParam.childService[index].serviceStartTime = ''
  713. this.orderParam.childService[index].periodTimeList = []
  714. this.orderParam.childService[index].fee = 0
  715. this.price = 0
  716. for (let childService of this.orderParam.childService) {
  717. this.price = this.price * 1 + childService.fee * 1
  718. this.price = this.price.toFixed(2)
  719. }
  720. this.$forceUpdate()
  721. }else {
  722. let selectServiceObjectList = this.orderParam.childService.filter(selectServiceObject =>
  723. (selectServiceObject.serviceUserId === items[index1].personId
  724. && selectServiceObject.serviceObjectId !== this.orderParam.childService[index].serviceObjectId)
  725. || selectServiceObject.serviceUserId === -1
  726. )
  727. selectServiceObjectList.forEach(selectServiceObject =>{
  728. serviceTimeList.forEach(periodTime =>{
  729. if (selectServiceObject.serviceStartTime === periodTime.label ){
  730. if (selectServiceObject.serviceUserId === -1){
  731. selectServiceObject.serviceTimeList.forEach(t=>{
  732. if (t.label == periodTime.label && t.total === 1){
  733. periodTime.total = periodTime.total - 1
  734. }
  735. })
  736. }else {
  737. periodTime.total = periodTime.total - 1
  738. }
  739. }
  740. })
  741. })
  742. for (const time of serviceTimeList) {
  743. if (time.total>0){
  744. time.select = true
  745. break
  746. }
  747. }
  748. serviceTimeList[0].select = true
  749. this.orderParam.childService[index].serviceStartTime= serviceTimeList[0].label,
  750. this.orderParam.childService[index].serviceTimeList= serviceTimeList
  751. }
  752. })
  753. this.price = 0
  754. for (let childService of this.orderParam.childService) {
  755. this.price = this.price * 1 + childService.fee * 1
  756. this.price = this.price.toFixed(2)
  757. }
  758. this.$forceUpdate()
  759. },
  760. selectServiceTime(items,index,index2){
  761. items.forEach(e=>{
  762. e.select=false
  763. })
  764. items[index2].select =true // 新选中的时间
  765. // let selectServiceObject = this.orderParam.childService[index] //旧的时间
  766. // this.orderParam.childService.forEach(i=>{
  767. // if (selectServiceObject.serviceUserId === -1){
  768. // i.serviceTimeList.forEach(t=>{
  769. // if (t.label == selectServiceObject.serviceStartTime && !t.select ){
  770. // console.log('-1----------加1')
  771. // t.total +=1
  772. // }
  773. // if (t.label == items[index2].serviceStartTime && i.serviceObjectId != selectServiceObject.serviceObjectId){
  774. // console.log('-1----------减1')
  775. // t.total -=1
  776. // }
  777. // })
  778. // }else {
  779. // if (selectServiceObject.serviceUserId == i.serviceUserId){
  780. // i.serviceTimeList.forEach(t=>{
  781. // if (t.label == selectServiceObject.serviceStartTime && !t.select ){
  782. // t.total +=1
  783. // }
  784. // if (t.label == items[index2].serviceStartTime && i.serviceObjectId != selectServiceObject.serviceObjectId){
  785. // t.total -=1
  786. // }
  787. // })
  788. // }
  789. // }
  790. // })
  791. this.orderParam.childService[index].serviceStartTime = items[index2].label
  792. this.$forceUpdate()
  793. },
  794. selectChange() {
  795. this.selectIcon = !this.selectIcon
  796. },
  797. goTermsOfService() {
  798. uni.navigateTo({
  799. url: '/myPages/TermsOfService/index?name=' + '预约需知' + '&type=' + 5
  800. })
  801. },
  802. //支付组件回调
  803. payResult(e){
  804. console.log(e)
  805. if(e.payResult){
  806. uni.showToast({
  807. title: '支付成功!'
  808. });
  809. }else {
  810. uni.showToast({
  811. title: e.res.data.msg,
  812. icon: 'error'
  813. });
  814. }
  815. setTimeout(()=>{
  816. uni.switchTab({
  817. url: '/pages/order/index'
  818. })
  819. },1000)
  820. },
  821. //提交订单
  822. commitOrder() {
  823. if (this.subOrderNo){
  824. this.$refs.myPay.openPopup()
  825. }else {
  826. if (!this.selectIcon) {
  827. uni.$u.toast('请阅读并同意《预约需知》')
  828. return;
  829. }
  830. if (this.orderParam.childService.length === 0) {
  831. uni.$u.toast('请选择服务对象')
  832. return;
  833. }
  834. if (this.requestStatus) {
  835. return;
  836. }
  837. this.requestStatus = true
  838. uni.showLoading({
  839. title: '加载中'
  840. });
  841. this.$api.commonGeneralOrder(this.orderParam).then(res => {
  842. console.log('++++++++++++++++++订单提交+++++++++++', res)
  843. if (res.data.data.subOrderNo) {
  844. uni.hideLoading();
  845. this.subOrderNo = res.data.data.subOrderNo
  846. this.$refs.myPay.openPopup()
  847. } else {
  848. uni.hideLoading();
  849. uni.$u.toast('预约成功')
  850. setTimeout(() => {
  851. uni.switchTab({
  852. url: '/pages/order/index'
  853. })
  854. }, 500)
  855. }
  856. this.requestStatus = false
  857. }).catch(err => {
  858. this.requestStatus = false
  859. })
  860. }
  861. },
  862. getSelectionRules(data){
  863. this.$api.getSelectionRules(data).then(res=>{
  864. this.takeNumberRules = res.data.rows
  865. })
  866. },
  867. }
  868. }
  869. </script>
  870. <style scoped lang="scss">
  871. @import './index.rpx.scss';
  872. .store-wrap {
  873. margin-top: 10rpx;
  874. background-color: white;
  875. .store-info {
  876. display: flex;
  877. .logo {
  878. width: 10%;
  879. text-align: center;
  880. display: flex;
  881. justify-content: center;
  882. align-items: center;
  883. image {
  884. width: 30px;
  885. height: 30px;
  886. }
  887. }
  888. .store-content {
  889. width: 90%;
  890. padding-bottom: 13px;
  891. .h-row {
  892. display: flex;
  893. align-items: center;
  894. justify-content: space-between;
  895. .store-desc {
  896. width: 90%;
  897. display: flex;
  898. line-height: 30px;
  899. font-size: 14px;
  900. .store-name {
  901. }
  902. }
  903. .arrow-right {
  904. text-align: right;
  905. margin: 0 auto;
  906. cursor: pointer;
  907. padding-top: 3px;
  908. width: 100px;
  909. display: flex;
  910. font-size: 14px;
  911. .change-store {
  912. text-align: right;
  913. color: #666;
  914. }
  915. image {
  916. width: 18px;
  917. height: 18px;
  918. }
  919. }
  920. .address {
  921. color: #999999;
  922. width: 450rpx;
  923. font-size: 24rpx;
  924. }
  925. .address1 {
  926. color: #999999;
  927. font-size: 24rpx;
  928. padding-right: 40rpx;
  929. }
  930. }
  931. }
  932. }
  933. .adress {
  934. font-size: 22rpx;
  935. white-space: nowrap;
  936. overflow: hidden;
  937. text-overflow: ellipsis;
  938. padding-left: 80rpx;
  939. color: #666;
  940. }
  941. }
  942. </style>