<template>
  <view>
    <choosebaoyangTop :carlist="carlist" @cheming="cheming" @input="input"></choosebaoyangTop>
    <view v-for="(i,j) in baoyanglist" :key="j">
      <choosebaoyangTitle :title0="i.name"></choosebaoyangTitle>
      <view v-for="(m,n) in i.erji" :key="n" @click="showshops(j,n)">
        <choosebaoyangService
          :ifxz="ifshop[j][n]"
          :pri="m.money"
          :serveName="m.name"
          serveDesc="5000km或6个月/次"
        ></choosebaoyangService>
         <view v-if="ifshop[j][n]">
            <view v-if="m.goods.length==0">
            <choosebaoyangServedetail class="servedetail"></choosebaoyangServedetail>
          </view>
            <shopserviceShop
            v-for="(item,index) in m.goods" :key="index"
              :shoppic="item.imgpaththumb"
              :shopname="item.goods_name"
              :pri="item.price"
              :num="item.goods_num"
              v-else
            ></shopserviceShop>
           
           
          </view>
         
          <view class="line"></view>
      </view>
    </view>
    <!-- <choosebaoyangTitle title0="常规保养项目(1/5)"></choosebaoyangTitle>
   <view @click="showshops(0)">
       <choosebaoyangService :ifxz="ifshop[0]" pri="78.04" serveName="小保养服务" serveDesc="5000km或6个月/次"></choosebaoyangService>
    </view>
     <view v-if="ifshop[0]">
    <choosebaoyangServedetail class="servedetail"></choosebaoyangServedetail>
     </view>
    <view class="line"></view>-->
    <!-- <view @click="showshops(0)">
       <choosebaoyangService :ifxz="ifshop[0]" pri="78.04" serveName="小保养服务" serveDesc="5000km或6个月/次"></choosebaoyangService>
    </view>
    <view class="line"></view>
    <view v-if="ifshop[0]">
      <shopserviceShop shoppic="../../static/img/serviceshop.png" shopname="轮胎/汽车轮胎 205/55R16 91V 韧悦 ENERGY XM2 " pri=65 num=2></shopserviceShop>
    </view>
    <view class="line"></view>
    <view @click="showshops(1)">
       <choosebaoyangService  :ifxz="ifshop[1]" pri="78.04" serveName="小保养服务" serveDesc="5000km或6个月/次"></choosebaoyangService>
    </view>
      <view v-if="ifshop[1]">
      <shopserviceShop shoppic="../../static/img/serviceshop.png" shopname="轮胎/汽车轮胎 205/55R16 91V 韧悦 ENERGY XM2 " pri=65 num=2></shopserviceShop>
    </view>
    <view class="line"></view>
  <view @click="showshops(2)">
       <choosebaoyangService :ifxz="ifshop[2]" pri="78.04" serveName="小保养服务" serveDesc="5000km或6个月/次"></choosebaoyangService>
    </view>
      <view v-if="ifshop[2]">
      <shopserviceShop shoppic="../../static/img/serviceshop.png" shopname="轮胎/汽车轮胎 205/55R16 91V 韧悦 ENERGY XM2 " pri=65 num=2></shopserviceShop>
    </view>
    <view class="line"></view>
   <view @click="showshops(3)">
       <choosebaoyangService :ifxz="ifshop[3]" pri="78.04" serveName="小保养服务" serveDesc="5000km或6个月/次"></choosebaoyangService>
    </view>
      <view v-if="ifshop[3]">
      <shopserviceShop shoppic="../../static/img/serviceshop.png" shopname="轮胎/汽车轮胎 205/55R16 91V 韧悦 ENERGY XM2 " pri=65 num=2></shopserviceShop>
    </view>
    <view class="line"></view>
    <choosebaoyangService pri="78.04" serveName="前雨刷" serveDesc="1个月/次"></choosebaoyangService>-->

    <!-- <choosebaoyangTitle title0="空调系统养护(0/2)"></choosebaoyangTitle>

    <choosebaoyangService pri="78.04" serveName="空调管路杀菌" serveDesc="10000km或12个月/次"></choosebaoyangService>
    <view class="line"></view>
        <choosebaoyangService pri="78.04" serveName="蒸发箱清洗" serveDesc="10000km或12个月/次"></choosebaoyangService>
    <choosebaoyangTitle title0="冷却系统养护(0/1)"></choosebaoyangTitle>
    <choosebaoyangService pri="78.04" serveName="水箱防锈保护" serveDesc="24个月/次"></choosebaoyangService>
    <choosebaoyangTitle title0="引擎深度养护(0/1)"></choosebaoyangTitle>
    <choosebaoyangService pri="78.04" serveName="喷油嘴清洗" serveDesc="20000km或24个月/次"></choosebaoyangService>
    <view class="line"></view>
    <choosebaoyangService pri="78.04" serveName="进气系统清洗" serveDesc="20000km或24个月/次"></choosebaoyangService>
    <view class="line"></view>
    <choosebaoyangService pri="78.04" serveName="三元催化清洗" serveDesc="20000km或24个月/次"></choosebaoyangService>
    <view class="line"></view>-->
    <view>
      <choosebaoyangBottom :price="money" class="bottom" @jiesuan="jiesuan"></choosebaoyangBottom>
    </view>
    <!-- <view class="tabbar">
			<tabbar page=2></tabbar>
    </view>-->
  </view>
</template>

<script>
import choosebaoyangTop from "../../components/choosebaoyang/choosebaoyang-top";
import choosebaoyangTitle from "../../components/choosebaoyang/choosebaoyang-title";
import choosebaoyangService from "../../components/choosebaoyang/choosebaoyang-service";
import choosebaoyangServedetail from "../../components/choosebaoyang/choosebaoyang-servedetail";
import choosebaoyangBottom from "../../components/choosebaoyang/choosebaoyang-bottom";
import shopserviceShop from "../../components/shopservice/shopservice-shop";
import { requestP } from "../../static/js/request";
import tabbar from "../../components/tabbar/tabbar";
export default {
  components: {
    choosebaoyangTop,
    choosebaoyangTitle,
    choosebaoyangService,
    choosebaoyangServedetail,
    choosebaoyangBottom,
    shopserviceShop,
    tabbar
  },
  data() {
    return {
      ifshop: [[]],
      carlist: [],
      form: {},
      carid: 0,
      baoyanglist: [],
      money:0
    };
  },
  onLoad() {
    requestP({
      url: "user_car/get_car_list"
    }).then(res => {
      let carlist = [];
      for (let i in res.data.data) {
        carlist.push(res.data.data[i].car_name);
      }
      console.log(carlist);
      // console.log(this.ifshop)
      this.carlist = res.data.data;
      this.carid = this.carlist[0].car_id
      this.input("")
    });
  },
  methods: {
    jiesuan() {
      // uni.navigateTo({
      //   url: "/pages/order-sub/order-sub"
      // });\
      var d = []
      for(let a in this.ifshop){
        for(let b in this.ifshop[a]){
          if(this.ifshop[a][b] == true){
            for(let c in this.baoyanglist[a].erji[b].goods){
              d.push(this.baoyanglist[a].erji[b].goods[c].baoyang_car_goods_id)
            }
          }
        }
      }
      requestP({
        url:"shop_cart/add_baoyang_goods_in_cart",
        data:{
          baoyang_car_goods_id:d.join(",")
        }
      }).then((res)=>{
        uni.showToast({
              title: "添加成功",
              icon: "success",
              duration: 2000
            });
      })
      console.log(d.join(",get_baoyang_list"))
    },
    showshops(j, e) {
      console.log(j, e, "qwsfd");
      // this.ifshop[e]=this.ifshop[e]==false?true:false
      this.$set(this.ifshop[j], e, this.ifshop[j][e] == false ? true : false);
      console.log(this.ifshop);
      if(this.ifshop[j][e]==true){
        this.money=this.money+Number(this.baoyanglist[j].erji[e].money)
      }else{
         this.money=this.money-Number(this.baoyanglist[j].erji[e].money)
      }
      console.log(this.money+this.baoyanglist[j].erji[e].money,"llkkniok")
      // this.money=this.money+this.baoyanglist[j][e].money
      // for(let i in this.baoyanglist){
      //   for(let m in this.baoyanglist[i].erji){
      //     for(let n in this.ifshop){
            
      //     }
      //      console.log(this.baoyanglist[i].erji[m].money,"pklolo")
      //   }
      
      // }
    },
    cheming(e) {
      console.log(e, 66699);
      this.carid = e;
    },
    input(e) {
      console.log(e, 4613);
      this.licheng = e;
      if (this.cheming) {
        requestP({
          url: "baoyang/get_baoyang_list",
          data: {
            car_id: this.carid,
            licheng: e
          }
        }).then(res => {
          console.log(res);
          for (let i = 0; i < res.data.data.length; i++) {
            this.ifshop.push([]);
            for (let m in res.data.data[i].erji) {
              this.ifshop[i].push(false);
            }
          }
          this.baoyanglist = res.data.data;
          console.log(this.ifshop);
        });
      }
    }
  }
};
</script>

<style lang="scss">
page {
  background-color: #eeeeee;
}
.servedetail {
  position: relative;
  top: 1upx;
}
.line {
  height: 8upx;
  background-color: #eeeeee;
}
.bottom {
  width: 100%;
  position: fixed;
  bottom: 0;
}
.tabbar {
  width: 100%;
  background-color: white;
  position: fixed;
  bottom: 0;
}
</style>