<template>
<v-container mt-4 style="padding-bottom:120px;">
<v-card v-if="orderSuccess">
    <form @submit.prevent="purchase">
        <v-text-field v-model="phone" light class="pl-5 pr-5" label="ফোন নম্বর " required />
        <v-btn type="submit" color="success"> অর্ডার </v-btn>
    </form>
</v-card>

<v-card v-else>
   <div>  অর্ডার দেওয়া হয়েছে, {{phone}} নম্বর এ যোগাযোগ করে ডেলিভারি করা হবে | </div>
</v-card>

    
</v-container>
</template>

<script>
export default {
  data() {
    return {
      pageContent: {},
      namecustomer: "",
      phone: "",
      address: "",
      cart:[],
      totalPrice:0,
      orderSuccess:true
      // apiLink:process.env.apiLink
    };
  },
    computed: {
    // loaded() {
    //   return this.$store.state.shoppingCart.status ,this.$store.state.localStorage.status , this.$store.state.sessionStorage.status
    // }
  },
    mounted() {
    /// Retrieves cart from local storage when user first loads

    // this.shoppingCart = JSON.parse(
    //   localStorage.getItem('shoppingCart') || "[]")
    if (localStorage && localStorage.cart) {
      const cart = JSON.parse(localStorage.cart);
      this.cart = cart;
      cart.forEach(element => {
            // ...use `element`...
            this.totalPrice +=element.product.price
            
        });
        // console.log(this.totalPrice)
    //   this.countTotals(cart);
    }

  },
  methods: {
    calTotal(){

    },
    purchase() {
          const rawResponse = fetch('https://api7.siliconpin.com/items/sm_cart', {
            method: 'POST',
            headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
            },
            body: JSON.stringify({"amount": this.totalPrice, "phone": this.phone, "cart": this.cart})
        })  
        .then(function(res){ 
            console.log(res)
            localStorage.cart=[]
            
            })
        .catch(function(res){ console.log(res) }) ;
        this.orderSuccess=false

        // const content = rawResponse.json();
        // console.log("kk")
        // console.log(rawResponse)

    //   const cartLocal = localStorage.cart || '[]';
    //   const cart = JSON.parse(cartLocal)
    //   let product={}
    //   product["slug"]=slug
    //   product["name"]=name
    //   product["price"]=price
    //   // const product=[slug, name, price]
    //   if(process.client){
    //             cart.push({
    //     // ...this.selectedCard,
    //     product:product
    //   });
    //   localStorage.cart = JSON.stringify(cart);
    //   this.$router.push('/bag');
    //   }
      // let exists = false

      // for (const cartItem of this.shoppingCart) {
      //   if (cartItem.slug === product.slug) {
      //     cartItem.amount = cartItem.amount + 1
      //     exists = true
      //     break
      //   }
      // }
      // if (!exists) {
        
        // this.shoppingCart.push({
        //   ...product,
        //   amount: 1,
        // })
        // console.log(product)
      // }
    },
  },
  // async asyncData({ $axios, route }) {
  //   const product = await $axios.$get(`/swarnamaths/?slug=`+route.params.slug)
  //   // $route.fullPath
  //   //    console.log(route.params.slug);
  //   // console.log(product)
  //   const url=route.params.slug
  //   return { product}
  // },
//   async fetch() {
//     this.pageContent = await fetch(
//       'https://api7.siliconpin.com/items/swarnamath?filter[slug]=' + this.$route.params.slug
//     ).then(res => res.json())
//     this.name = this.pageContent.data[0].name
//     this.slug = this.pageContent.data[0].slug
//     if (this.pageContent.data[0].img) this.img = this.pageContent.data[0].img
//   },
//   head() {
//     return {
//       title: this.name,
//       meta: [
//         // hid is used as unique identifier. Do not use `vmid` for it as it will not work
//         {
//           hid: 'description',
//           name: 'description',
//           content: this.name
//         },
//         {
//           hid: 'og:description',
//           name: 'og:description',
//           content: this.name
//         },
//         {
//           hid: 'og:title',
//           name: 'og:title',
//           content: this.name
//         },
//         {
//           hid: 'og:url',
//           name: 'og:url',
//           content: 'https://swarnamath.com/' + this.slug
//         },
//         {
//           hid: 'og:image',
//           name: 'og:image',
//           content: 'https://api7.siliconpin.com' + this.img
//         },
//         {
//           hid: 'og:image:secure_url',
//           name: 'og:image:secure_url',
//           content: 'https://api7.siliconpin.com' + this.img
//         },
//         {
//           hid: 'og:type',
//           name: 'og:type',
//           content: 'News'
//         }
//       ]
//     }
//   }
}
</script>