jje_uniapp/orderPages/storeService/index.vue

<template>
  <view class="content">
    <view>
      <view class="box_4">
        <view class="flex-col justify-around groupItem1">
          <view class="groupItemKey">
            <text>请选择服务对象</text>
          </view>
          <view class="flex-row justify-between groupItemContent" @click="getServiceObject">
            <text>{{serviceObject.nickName || '请选择服务对象' }}</text>
            <u-icon name="arrow-right" color="#666" size="18"></u-icon>
          </view>
          <text class="text_5">娇宝，此排队提交后只针对一个服务对象，服务对象指接受娇骄儿理发服务的儿童</text>
        </view>
        <view class="group_1">
          <picker @change="bindPickerChange" mode='selector' range-key="typeName" :value="index"
                  :range="storeServiceList">
            <view>
              <text class="groupItemKey ">请选择服务类型</text>
              <view class="text-group_3 ">
                <view class="text_4">{{ storeServiceList[index].typeName || '111111' }}</view>
                <u-icon name="arrow-right" color="#666" size="18"></u-icon>
              </view>
            </view>
          </picker>
        </view>
        <view class="group_2"></view>
      </view>
      <view class="tabBarLineHeight"></view>
      <view class="tabBarView">
        <view class="submitButton" @click="commonGeneralOrder">提交</view>
      </view>
    </view>
  </view>
</template>

<script>
import tabBar from "../../components/tabBar/tabBar";

export default {
  components: {
    tabBar
  },
  data() {
    return {
      userInfo:{},
      serviceObject: {},
      store: {},
      storeServiceList: [],
      index: 0


    }
  },
  onLoad() {
    // this.listServiceObject()
    this.userInfo = uni.getStorageSync('userInfo')
  },
  onShow() {
    // 服务对象
    uni.$off()
    uni.$on('selectedServiceObject', this.selectedServiceObject);

    this.store = uni.getStorageSync('storeInfo')
    // this.storeAllServiceList()
    this.category()
  },
  methods: {

    getServiceObject() {
      uni.navigateTo({
        url: '/orderPages/serviceObject/index'
      })
    },

    // storeAllServiceList(){
    //     this.$api.storeAllServiceList({storeId:this.store.storeId}).then(res=>{
    //         this.storeServiceList= res.data.data
    //     })
    // },

    // 查询服务对像信息列表
    listServiceObject(){
      this.$api.listServiceObject(this.reqParm).then((res)=>{
        this.serviceObject = res.data.data[0]
      }).catch((err) =>{
        uni.showToast({
          title: "操作失败"
        })
      });
    },

    selectedServiceObject(e) {
      this.serviceObject = e
      console.log('++++++++++++selectedServiceObject++++++++++++++', e)
    },

    category() {
      this.$api.category({storeId: this.store.storeId}).then(res => {
        this.storeServiceList = res.data.data
        console.log('+++++++++++++++category+++++++++++++++++', res)
      })

    },
    bindPickerChange(e) {
      this.index = e.detail.value
      console.log(e)
    },

    commonGeneralOrder() {


      if(!this.serviceObject){
        uni.$u.toast('请选择服务对象')
        return
      }

      this.$api.commonGeneralOrder({
        orderType: 1,
        serviceObjectId: this.serviceObject.id,
        serviceAttribute: 1,
        serviceStoreId: this.store.storeId,
        serviceTypeId: this.storeServiceList[this.index].id
      }).then(res => {
        uni.switchTab({
          url: '/pages/order/index'
        })

      })
    }

  }
}
</script>

<style scoped lang="scss">
@import '../../common/css/common.css';
@import './index.rpx.scss';
</style>