groupon-wx/pages/order_addcart/order_addcart.vue

<template>
  <view class="order_addcart" :style="colorStyle">
    <view class="order_addcart-header-area">
      <view class="received">
        <view class="pictrue">
          <image
            src="http://wine.gzzzyd.com/wx/order_addcart/qiandai.png"
          ></image>
        </view>
        <view class="text-info" @click="goReceived()">
          <view class="received-count">
            {{ moneyObj.receiveItemAmount }}
          </view>
          <view class="received-info"> 已领取红包 </view>
        </view>
      </view>
      <view class="loss" @click="goMissed()">
        <view class="text-info">
          <view class="received-count">
            {{ moneyObj.lossTotalAmount }}
          </view>
          <view class="received-info"> 已错失红包 </view>
        </view>
      </view>
    </view>

    <view class="loop">
      <view class="loop-title"> 当前红包池 </view>
      <view class="loop-count">
        {{ moneyObj.totalRemainItemAmount }}
      </view>
    </view>

    <view class="tab-area">
      <view
        @click="
          isactiveTab = 'todayRank';
          leaderboard();
        "
        :class="{
          'tab-area-active1': isactiveTab === 'todayRank',
          'base-tab': true,
        }"
      >
        <text> 今日红包排行榜</text>
      </view>
      <view
        @click="
          isactiveTab = 'allRank';
          leaderboard();
        "
        :class="{
          'tab-area-active2': isactiveTab === 'allRank',
          'base-tab': true,
        }"
      >
        <text> 红包领取总榜</text>
      </view>
    </view>
    <view class="rank-list">
      <view class="rank-list-item" v-for="(src, i) in rankList" :key="src.id">
        <img
          v-show="i === 0"
          src="http://wine.gzzzyd.com/wx/order_addcart/rank1.png"
          alt=""
        />
        <img
          v-show="i === 1"
          src="http://wine.gzzzyd.com/wx/order_addcart/rank2.png"
          alt=""
        />
        <img
          v-show="i === 2"
          src="http://wine.gzzzyd.com/wx/order_addcart/rank3.png"
          alt=""
        />
        <img v-show="i !== 0 && i !== 1 && i !== 2" :src="src.avatar" alt="" />
        <text class="nuber"> {{ src.userName }}</text>
        <text class="mosaic"> {{ src.phone }}</text>
        <text class="litem-info"> 共领取了</text>
        <text class="balance">{{ src.totalAmount }}</text>
      </view>
    </view>
    <u-overlay :show="show" @click="show = false">
      <view class="warp">
        <view class="rect" @tap.stop>
          <view class="cover-img">
            <img class="avatar" :src="userInfo.avatar" />
          </view>
          <view class="h-info"
            >当前红包
            {{ ["随机红包", "专属红包", "共富红包"][activeRedPer.type] }}
            <view class="paper_list">
              <text
                :class="{
                  acitiveRedper: activeRedPer.type === item.type,
                }"
                @click="activeRedPer = item;grabAmountFlag = false;"
                v-for="item in redPaper"
                :key="item.type"
              >
                {{ ["随机红包", "专属红包", "共富红包"][item.type] }}
              </text>
            </view>
            <view class="grabAmount_count" v-if="grabAmountFlag">
              <text>恭喜您获得</text>
              <text>￥ {{ currentRedpaper.grabAmount }}</text>
            </view>
          </view>
          <img
            class="op-img"
            @click="doGrab"
            src="http://wine.gzzzyd.com/wx/order_addcart/ling.png"
            alt=""
          />
          <!-- <img class="op-img" src="http://wine.gzzzyd.com/wx/order_addcart/kai.png" alt=""> -->
          <view class="b-info">
            今日已领取{{
              redPaper.filter((e) => {
                return e.flag === 0;
              }).length
            }}/3
          </view>
          <view class="b-box">
            <text> 参与共富模式,用户可下单领取红包 </text>
          </view>
        </view>
      </view>
    </u-overlay>
  </view>
</template>

<script>
// #ifdef APP-PLUS
let sysHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
// #endif
// #ifndef APP-PLUS
let sysHeight = 0
// #endif
import {
  grabFlag,
  leaderboard,
  doGrab,
  todayStatistics
} from '@/api/home.js';
import {
  getProductHot,
  collectAll,
  getProductDetail
} from '@/api/store.js';
import {
  toLogin
} from '@/libs/login.js';
import {
  mapGetters
} from "vuex";
import recommend from '@/components/recommend';
import productWindow from '@/components/productWindow';
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import pageFooter from '@/components/pageFooter/index.vue'
import colors from "@/mixins/color";
import {
  HTTP_REQUEST_URL
} from '@/config/app';
const hot_res = require('@/mock/json/hot_res.json')
import {
  getNavigation
} from '@/api/public.js'
import {
  colorChange
} from '../../api/api';
export default {
  components: {
    pageFooter,
    recommend,
    productWindow,
    // #ifdef MP
    authorize
    // #endif
  },
  mixins: [colors],
  data () {
    return {
      isactiveTab: 'todayRank',
      grabFlagisOpen: false,
      grabAmountFlag: false,
      show: false,
      userInfo: {},
      activeRedPer: {
        type: 0
      },
      currentRedpaper: {
        // 抢到的金额
        grabAmount: '0.00'
      },
      moneyObj: {
        lossTotalAmount: "0",
        receiveItemAmount: "0",
        receiveItemCount: 0,
        redEnvelopeItemCount: 0,
        remainItemCount: 0,
        totalReceivedRedEnvelopeAmount: "0",
        totalRedEnvelopeAmount: "0",
        totalRemainItemAmount: "0"
      },
      imgHost: HTTP_REQUEST_URL,
      is_diy: uni.getStorageSync('is_diy'),
      canShow: false,
      cartCount: 0,
      goodsHidden: true,
      footerswitch: true,
      hostProduct: [],
      cartList: {
        valid: [],
        invalid: []
      },
      isAllSelect: false, //全选
      selectValue: [], //选中的数据
      selectCountPrice: 0.00,
      isAuto: false, //没有授权的不会自动授权
      isShowAuth: false, //是否隐藏授权
      hotScroll: false,
      hotPage: 1,
      hotLimit: 10,
      loading: false,
      loadend: false,
      loadTitle: this.$t(`我也是有底线的`), //提示语
      page: 1,
      limit: 20,
      loadingInvalid: false,
      loadendInvalid: false,
      loadTitleInvalid: this.$t(`加载更多`), //提示语
      pageInvalid: 1,
      limitInvalid: 20,
      attr: {
        cartAttr: false,
        productAttr: [],
        productSelect: {}
      },
      rankList: [],
      redPaper: [],
      productValue: [], //系统属性
      storeInfo: {},
      attrValue: '', //已选属性
      attrTxt: this.$t(`请选择`), //属性页面提示
      cartId: 0,
      product_id: 0,
      sysHeight: sysHeight,
      newData: {},
      activeRouter: '',
      is_diy_set: false
    };
  },
  computed: mapGetters(['isLogin']),
  onPullDownRefresh () {
    this.grabFlag()
    console.log('下拉刷新');
  },
  onLoad (options) {
    let that = this;
    if (that.isLogin == false) {
      toLogin();
    }
    let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
    let curRoute = routes[routes.length - 1].route //获取当前页面路由
    this.activeRouter = '/' + curRoute
  },
  onShow () {
    this.canShow = false
    if (this.isLogin == true) {
      this.hotPage = 1;
      this.hostProduct = [],
        this.hotScroll = false,
        this.getHostProduct();
      this.loadend = false;
      this.page = 1;
      this.cartList.valid = [];
      this.getCartList();
      this.loadendInvalid = false;
      this.pageInvalid = 1;
      this.cartList.invalid = [];
      this.getInvalidList();
      this.getCartNum();
      this.goodsHidden = true;
      this.footerswitch = true;
      this.hostProduct = [];
      this.hotScroll = false;
      this.hotPage = 1;
      this.hotLimit = 10;
      this.cartList = {
        valid: [],
        invalid: []
      },
        this.isAllSelect = false; //全选
      this.selectValue = []; //选中的数据
      this.selectCountPrice = 0.00;
      this.cartCount = 0;
      this.isShowAuth = false;
    };
  },
  created () {
    this.userInfo = JSON.parse(this.$Cache.get("USER_INFO"));
    console.log(this.userInfo, this.userInfo.avatar);
    this.grabFlag('created')
    this.leaderboard()
    this.todayStatistics()
  },
  methods: {
    change (e) {
      this.show = e.show
    },
    goReceived () {
      uni.navigateTo({
        url: '/pages/order_addcart/wallet_received/index'
      })
    },
    goMissed () {
      uni.navigateTo({
        url: '/pages/order_addcart/wallet_missed/index'
      })
    },
    doGrab () {
      doGrab({
        type: this.activeRedPer.type
      }).then(res => {
        // if (res.code === 200) {
        //   this.grabFlag('dograbAmountFlag')
        // }
        this.currentRedpaper = res.data
        this.grabAmountFlag = true
      })
    },
    // 授权关闭
    authColse: function (e) {
      this.isShowAuth = e;
    },
    // 修改购物车
    reGoCat: function () {
      let that = this,
        productSelect = that.productValue[this.attrValue];
      //如果有属性,没有选择,提示用户选择
      if (
        that.attr.productAttr.length &&
        productSelect === undefined
      )
        return that.$util.Tips({
          title: that.$t(`产品库存不足，请选择其它`)
        });

      let q = {
        id: that.cartId,
        product_id: that.product_id,
        num: that.attr.productSelect.cart_num,
        unique: that.attr.productSelect !== undefined ?
          that.attr.productSelect.unique : ""
      };
      getResetCart(q)
        .then(function (res) {
          that.attr.cartAttr = false;
          that.$util.Tips({
            title: that.$t(`添加购物车成功`),
            success: () => {
              that.loadend = false;
              that.page = 1;
              that.cartList.valid = [];
              that.getCartList();
              that.getCartNum();
            }
          });
        })
        .catch(res => {
          return that.$util.Tips({
            title: res.msg
          });
        });
    },
    onMyEvent: function () {
      this.$set(this.attr, 'cartAttr', false);
    },
    reElection: function (item) {
      this.getGoodsDetails(item)
    },

    leaderboard () {
      let that = this
      uni.showLoading({
        title: this.$t(`加载中`),
        mask: true
      });
      let postData = {
        flag: this.isactiveTab === 'todayRank' ? 1 : 0
      }
      leaderboard(postData).then(res => {
        if (res.data.length > 0) {
          that.$set(that, "rankList", res.data)
        } else {
          that.$set(that, "rankList", [])
        }
        uni.hideLoading();
      })
    },

    grabFlag (params) {
      grabFlag().then(res => {
        this.redPaper = res.data
        if (!params) {
          this.grabAmountFlag = false
        }
        if (params === 'created') {
          let flag = redPaper.filter((e) => {
            return e.flag === 0;
          }).length
          if (flag === 0) {
            this.show = false
            uni.stopPullDownRefresh();
            return
          }
        }
        this.activeRedPer = res.data[0]
        this.show = true
        uni.stopPullDownRefresh();
      })
    },
    todayStatistics () {
      uni.showLoading({
        title: this.$t(`加载中`),
        mask: true
      });
      let postData = {
        flag: this.isactiveTab === 'todayRank' ? 1 : 0
      }
      todayStatistics().then(res => {
        this.moneyObj = res.data
        uni.hideLoading();
      })
    },
    /**
     * 属性变动赋值
     * 
     */
    ChangeAttr: function (res) {
      let productSelect = this.productValue[res];
      if (productSelect && productSelect.stock > 0) {
        this.$set(this.attr.productSelect, "image", productSelect.image);
        this.$set(this.attr.productSelect, "price", productSelect.price);
        this.$set(this.attr.productSelect, "stock", productSelect.stock);
        this.$set(this.attr.productSelect, "unique", productSelect.unique);
        this.$set(this.attr.productSelect, "cart_num", 1);
        this.$set(this, "attrValue", res);
        this.$set(this, "attrTxt", this.$t(`已选择`));
      } else {
        this.$set(this.attr.productSelect, "image", this.storeInfo.image);
        this.$set(this.attr.productSelect, "price", this.storeInfo.price);
        this.$set(this.attr.productSelect, "stock", 0);
        this.$set(this.attr.productSelect, "unique", "");
        this.$set(this.attr.productSelect, "cart_num", 0);
        this.$set(this, "attrValue", "");
        this.$set(this, "attrTxt", this.$t(`请选择`));
      }
    },
    /**
     * 默认选中属性
     * 
     */
    DefaultSelect: function () {
      let productAttr = this.attr.productAttr;
      let value = [];
      for (var key in this.productValue) {
        if (this.productValue[key].stock > 0) {
          value = this.attr.productAttr.length ? key.split(",") : [];
          break;
        }
      }
      for (let i = 0; i < productAttr.length; i++) {
        this.$set(productAttr[i], "index", value[i]);
      }
      //sort();排序函数:数字-英文-汉字；
      let productSelect = this.productValue[value.sort().join(",")];
      if (productSelect && productAttr.length) {
        this.$set(
          this.attr.productSelect,
          "store_name",
          this.storeInfo.store_name
        );
        this.$set(this.attr.productSelect, "image", productSelect.image);
        this.$set(this.attr.productSelect, "price", productSelect.price);
        this.$set(this.attr.productSelect, "stock", productSelect.stock);
        this.$set(this.attr.productSelect, "unique", productSelect.unique);
        this.$set(this.attr.productSelect, "cart_num", 1);
        this.$set(this, "attrValue", value.sort().join(","));
        this.$set(this, "attrTxt", this.$t(`已选择`));
      } else if (!productSelect && productAttr.length) {
        this.$set(
          this.attr.productSelect,
          "store_name",
          this.storeInfo.store_name
        );
        this.$set(this.attr.productSelect, "image", this.storeInfo.image);
        this.$set(this.attr.productSelect, "price", this.storeInfo.price);
        this.$set(this.attr.productSelect, "stock", 0);
        this.$set(this.attr.productSelect, "unique", "");
        this.$set(this.attr.productSelect, "cart_num", 0);
        this.$set(this, "attrValue", "");
        this.$set(this, "attrTxt", this.$t(`请选择`));
      } else if (!productSelect && !productAttr.length) {
        this.$set(
          this.attr.productSelect,
          "store_name",
          this.storeInfo.store_name
        );
        this.$set(this.attr.productSelect, "image", this.storeInfo.image);
        this.$set(this.attr.productSelect, "price", this.storeInfo.price);
        this.$set(this.attr.productSelect, "stock", this.storeInfo.stock);
        this.$set(
          this.attr.productSelect,
          "unique",
          this.storeInfo.unique || ""
        );
        this.$set(this.attr.productSelect, "cart_num", 1);
        this.$set(this, "attrValue", "");
        this.$set(this, "attrTxt", this.$t(`请选择`));
      }
    },
    attrVal (val) {
      this.$set(this.attr.productAttr[val.indexw], 'index', this.attr.productAttr[val.indexw].attr_values[val
        .indexn]);
    },
    /**
     * 购物车数量加和数量减
     * 
     */
    ChangeCartNum: function (changeValue) {
      //changeValue:是否 加|减
      //获取当前变动属性
      let productSelect = this.productValue[this.attrValue];
      //如果没有属性,赋值给商品默认库存
      if (productSelect === undefined && !this.attr.productAttr.length)
        productSelect = this.attr.productSelect;
      //无属性值即库存为0；不存在加减；
      if (productSelect === undefined) return;
      let stock = productSelect.stock || 0;
      let num = this.attr.productSelect;
      if (changeValue) {
        num.cart_num++;
        if (num.cart_num > stock) {
          this.$set(this.attr.productSelect, "cart_num", stock ? stock : 1);
          this.$set(this, "cart_num", stock ? stock : 1);
        }
      } else {
        num.cart_num--;
        if (num.cart_num < 1) {
          this.$set(this.attr.productSelect, "cart_num", 1);
          this.$set(this, "cart_num", 1);
        }
      }
    },
    /**
     * 购物车手动填写
     * 
     */
    iptCartNum: function (e) {
      this.$set(this.attr.productSelect, 'cart_num', e);
    },
    subDel: function (event) {
      let that = this,
        selectValue = that.selectValue;
      if (selectValue.length > 0)
        cartDel(selectValue).then(res => {
          that.loadend = false;
          that.page = 1;
          that.cartList.valid = [];
          that.getCartList();
          that.getCartNum();
        });
      else
        return that.$util.Tips({
          title: that.$t(`请选择产品`)
        });
    },
    getSelectValueProductId: function () {
      let that = this;
      let validList = that.cartList.valid;
      let selectValue = that.selectValue;
      let productId = [];
      if (selectValue.length > 0) {
        for (let index in validList) {
          if (that.inArray(validList[index].id, selectValue)) {
            productId.push(validList[index].product_id);
          }
        }
      };
      return productId;
    },
    subCollect: function (event) {
      let that = this,
        selectValue = that.selectValue;
      if (selectValue.length > 0) {
        let selectValueProductId = that.getSelectValueProductId();
        collectAll(that.getSelectValueProductId().join(',')).then(res => {
          return that.$util.Tips({
            title: res.msg,
            icon: 'success'
          });
        }).catch(err => {
          return that.$util.Tips({
            title: err
          });
        });
      } else {
        return that.$util.Tips({
          title: that.$t(`请选择产品`)
        });
      }
    },
    subOrder (event) {
      console.log(event)
      let that = this,
        selectValue = that.selectValue;
      if (selectValue.length > 0) {
        uni.navigateTo({
          url: '/pages/goods/order_confirm/index?cartId=' + selectValue.join(',')
        });
      } else {
        return that.$util.Tips({
          title: that.$t(`请选择产品`)
        });
      }
    },
    checkboxAllChange: function (event) {
      let value = event.detail.value;
      if (value.length > 0) {
        this.setAllSelectValue(1)
      } else {
        this.setAllSelectValue(0)
      }
    },
    setAllSelectValue: function (status) {
      let that = this;
      let selectValue = [];
      let valid = that.cartList.valid;
      if (valid.length > 0) {
        let newValid = valid.map(item => {
          if (status) {
            if (that.footerswitch) {
              if (item.attrStatus) {
                item.checked = true;
                selectValue.push(item.id);
              } else {
                item.checked = false;
              }
            } else {
              item.checked = true;
              selectValue.push(item.id);
            }
            that.isAllSelect = true;
          } else {
            item.checked = false;
            that.isAllSelect = false;
          }
          return item;
        });
        that.$set(that.cartList, 'valid', newValid);
        that.selectValue = selectValue;
        that.switchSelect();
      }
    },
    checkboxChange: function (event) {
      let that = this;
      let value = event.detail.value;
      let valid = that.cartList.valid;
      let arr1 = [];
      let arr2 = [];
      let arr3 = [];
      let newValid = valid.map(item => {
        if (that.inArray(item.id, value)) {
          if (that.footerswitch) {
            if (item.attrStatus) {
              item.checked = true;
              arr1.push(item);
            } else {
              item.checked = false;
            }
          } else {
            item.checked = true;
            arr1.push(item);
          }
        } else {
          item.checked = false;
          arr2.push(item);
        }
        return item;
      });
      if (that.footerswitch) {
        arr3 = arr2.filter(item => !item.attrStatus);
      }
      // for (let index in valid) {
      // 	if (that.inArray(valid[index].id, value)){
      // 		if(valid[index].attrStatus){
      // 			valid[index].checked = true;
      // 		}else{
      // 			valid[index].checked = false;
      // 		}
      // 	} else {
      // 		valid[index].checked = false;
      // 	} 
      // }
      that.$set(that.cartList, 'valid', newValid);
      // let newArr = that.cartList.valid.filter(item => item.attrStatus);
      that.isAllSelect = newValid.length === arr1.length + arr3.length;
      that.selectValue = value;
      that.switchSelect();
    },
    inArray: function (search, array) {
      for (let i in array) {
        if (array[i] == search) {
          return true;
        }
      }
      return false;
    },
    switchSelect: function () {
      let that = this;
      let validList = that.cartList.valid;
      let selectValue = that.selectValue;
      let selectCountPrice = 0.00;
      if (selectValue.length < 1) {
        that.selectCountPrice = selectCountPrice;
      } else {
        for (let index in validList) {
          if (that.inArray(validList[index].id, selectValue)) {
            selectCountPrice = that.$util.$h.Add(selectCountPrice, that.$util.$h.Mul(validList[index]
              .cart_num, validList[
                index].truePrice))
          }
        }
        that.selectCountPrice = selectCountPrice;
      }
    },
    /**
     * 购物车手动填写
     * 
     */
    iptCartNum: function (index) {
      let item = this.cartList.valid[index];
      if (item.cart_num) {
        this.setCartNum(item.id, item.cart_num);
      }
      this.switchSelect();
    },
    blurInput: function (index) {
      let item = this.cartList.valid[index];
      console.log(item)
      if (!item.cart_num) {
        item.cart_num = 1;
        this.$set(this.cartList, 'valid', this.cartList.valid)
      }
    },
    subCart: function (index) {
      let that = this;
      let status = false;
      let item = that.cartList.valid[index];
      item.cart_num = Number(item.cart_num) - 1;
      if (item.cart_num < 1) status = true;
      if (item.cart_num <= 1) {
        item.cart_num = 1;
        item.numSub = true;
      } else {
        item.numSub = false;
        item.numAdd = false;
      }
      if (false == status) {
        that.setCartNum(item.id, item.cart_num, function (data) {
          that.cartList.valid[index] = item;
          that.getCartNum();
          that.switchSelect();
        });
      }
    },
    addCart: function (index) {
      let that = this;
      let item = that.cartList.valid[index];
      item.cart_num = Number(item.cart_num) + 1;
      let productInfo = item.productInfo;
      if (productInfo.hasOwnProperty('attrInfo') && item.cart_num >= item.productInfo.attrInfo.stock) {
        item.cart_num = item.productInfo.attrInfo.stock;
        item.numAdd = true;
        item.numSub = false;
      } else {
        item.numAdd = false;
        item.numSub = false;
      }
      that.setCartNum(item.id, item.cart_num, function (data) {
        that.cartList.valid[index] = item;
        that.getCartNum();
        that.switchSelect();
      });
    },
    setCartNum (cartId, cartNum, successCallback) {
      let that = this;
      changeCartNum(cartId, cartNum).then(res => {
        console.log(res)
        successCallback && successCallback(res.data);
      }).catch(err => {
        console.log(err)
        return that.$util.Tips({
          title: err
        });
      })
    },
    getCartNum: function () {
      let that = this;
      // getCartCounts().then(res => {
      that.cartCount = 0;
      this.$store.commit('indexData/setCartNum', that.cartCount > 99 ? '..' : that.cartCount)
      if (that.cartCount > 0) {
        wx.setTabBarBadge({
          index: 2,
          text: that.cartCount + ''
        })
      } else {
        wx.hideTabBarRedDot({
          index: 2
        })
      }

      // });
    },
    getCartData (data) {
      let resData = {
        "valid": [],
        "invalid": [],
        "deduction": {
          "seckill_id": 0,
          "bargain_id": 0,
          "combination_id": 0,
          "discount_id": 0
        }
      }
      this.loading = false;
      this.canShow = true
      return resData;
      // return new Promise((resolve, reject) => {
      // 	getCartList(data).then((res) => {
      // 		resolve(res.data);
      // 	}).catch((err) => {
      // 		this.loading = false;
      // 		this.canShow = true
      // 		this.$util.Tips({
      // 			title: err
      // 		});
      // 	})
      // });
    },
    async getCartList () {
      uni.showLoading({
        title: this.$t(`加载中`),
        mask: true
      });
      let that = this;
      let data = {
        page: that.page,
        limit: that.limit,
        status: 1
      }
      let countResData = {
        "count": 0,
        "ids": [
          9671,
          9670,
          9669
        ],
        "sum_price": "955.00"
      }
      // getCartCounts().then(async c => {
      that.cartCount = countResData.count;
      let n = Math.ceil(countResData.ids.length / that.limit)
      for (let i = 0; i < n; i++) {
        // let cartList = await this.getCartData(data)
        let cartListData = {
          "valid": [{
            "id": 9671,
            "uid": 34391,
            "type": "0",
            "product_id": 97,
            "product_attr_unique": "fd6d98f3",
            "cart_num": 1,
            "add_time": 1666709939,
            "is_pay": 0,
            "is_del": 0,
            "is_new": 0,
            "combination_id": 0,
            "seckill_id": 0,
            "bargain_id": 0,
            "advance_id": 0,
            "status": 1,
            "productInfo": {
              "id": 97,
              "mer_id": 0,
              "image": "https://demo26.crmeb.net/uploads/attach/2021/11/20211113/small_0d407b8541efd8c8f87e5ac581d1421c.png",
              "recommend_image": "",
              "slider_image": [
                "https://demo26.crmeb.net/uploads/attach/2021/11/13/2d97c9bd7abcdb65049c97bbe9ba61d1.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/13/a48cce02122f4046193bdda67d970b55.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/13/5c4754f2b647b9e240e08f48c9889ebf.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/13/e8f6b1235f10f83d8a43bd91def20332.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/13/634a51ad34590eab005063742d086b87.jpg"
              ],
              "store_name": "仟佰家 干花花束真花手工落地高枝装饰摆件招财莲蓬插花居客厅摆设 干花组合6025【不含花瓶】 干花包",
              "store_info": "仟佰家 干花花束真花手工落地高枝装饰摆件招财莲蓬插花居客厅摆设 干花组合6025【不含花瓶】 干花包",
              "keyword": "",
              "bar_code": "",
              "cate_id": "22,24",
              "price": "306.00",
              "vip_price": "0.00",
              "ot_price": "299.00",
              "postage": "0.00",
              "unit_name": "件",
              "sort": 100,
              "sales": 2,
              "stock": 12384,
              "is_show": 1,
              "is_hot": 0,
              "is_benefit": 0,
              "is_best": 0,
              "is_new": 1,
              "is_virtual": 0,
              "virtual_type": 0,
              "add_time": 1636791973,
              "is_postage": 0,
              "is_del": 0,
              "mer_use": 0,
              "give_integral": "0.00",
              "cost": "258.00",
              "is_seckill": 0,
              "is_bargain": null,
              "is_good": 0,
              "is_sub": 0,
              "is_vip": 0,
              "ficti": 0,
              "browse": 0,
              "code_path": "",
              "soure_link": "",
              "temp_id": 57,
              "spec_type": 1,
              "activity": "0,1,2,3",
              "spu": "5310153503736",
              "label_id": "0",
              "video_link": "",
              "command_word": "",
              "recommend_list": "",
              "vip_product": 0,
              "presale": 0,
              "presale_start_time": 0,
              "presale_end_time": 0,
              "presale_day": 0,
              "logistics": "1,2",
              "freight": 2,
              "custom_form": "",
              "is_limit": 0,
              "limit_type": 0,
              "limit_num": 0,
              "express_delivery": true,
              "store_mention": true,
              "attrInfo": {
                "id": 967,
                "product_id": 97,
                "suk": "干花组合6025【不含花瓶】,干花包",
                "stock": 562,
                "sales": 1,
                "price": "306.00",
                "image": "https://demo26.crmeb.net/uploads/attach/2021/11/13/small_634a51ad34590eab005063742d086b87.jpg",
                "bar_code": "",
                "ot_price": "299.00",
                "volume": "0.00",
                "weight": "0.00",
                "brokerage": "0.00",
                "brokerage_two": "0.00",
                "type": 0,
                "unique": "fd6d98f3",
                "cost": "258.00",
                "quota": 0,
                "quota_show": 0,
                "vip_price": "0.00",
                "is_virtual": 0,
                "coupon_id": 0,
                "disk_info": ""
              }
            },
            "attrStatus": true,
            "vip_truePrice": 0,
            "costPrice": "258.00",
            "trueStock": 562,
            "truePrice": 306,
            "sum_price": "306.00",
            "price_type": "level",
            "is_valid": 1
          },
          {
            "id": 9670,
            "uid": 34391,
            "type": "0",
            "product_id": 102,
            "product_attr_unique": "02cce37e",
            "cart_num": 1,
            "add_time": 1666709927,
            "is_pay": 0,
            "is_del": 0,
            "is_new": 0,
            "combination_id": 0,
            "seckill_id": 0,
            "bargain_id": 0,
            "advance_id": 0,
            "status": 1,
            "productInfo": {
              "id": 102,
              "mer_id": 0,
              "image": "https://demo26.crmeb.net/uploads/attach/2021/11/15/small_a79f5d2ea6bf0c3c11b2127332dfe2df.jpg",
              "recommend_image": "",
              "slider_image": [
                "https://demo26.crmeb.net/uploads/attach/2021/11/15/a79f5d2ea6bf0c3c11b2127332dfe2df.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/15/7f46e98ece1920e1a4082dfc72bcd72a.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/15/bfb275263d02ab081b8670a752f2823f.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/15/e499a4dc489cda7b8d472cb3a3b348b7.jpg",
                "https://demo26.crmeb.net/uploads/attach/2021/11/15/06fa150a47163e973bb4806a380afaab.jpg"
              ],
              "store_name": "索尼（SONY）WH-CH510 无线立体声耳机 学生网课 白色",
              "store_info": "索尼（SONY）WH-CH510 无线立体声耳机 学生网课 白色",
              "keyword": "耳机",
              "bar_code": "",
              "cate_id": "18,27,25",
              "price": "299.00",
              "vip_price": "0.00",
              "ot_price": "349.00",
              "postage": "0.00",
              "unit_name": "件",
              "sort": 0,
              "sales": 3,
              "stock": 297,
              "is_show": 1,
              "is_hot": 0,
              "is_benefit": 0,
              "is_best": 0,
              "is_new": 0,
              "is_virtual": 0,
              "virtual_type": 0,
              "add_time": 1636958921,
              "is_postage": 0,
              "is_del": 0,
              "mer_use": 0,
              "give_integral": "0.00",
              "cost": "259.00",
              "is_seckill": 0,
              "is_bargain": null,
              "is_good": 0,
              "is_sub": 0,
              "is_vip": 0,
              "ficti": 0,
              "browse": 0,
              "code_path": "",
              "soure_link": "",
              "temp_id": 57,
              "spec_type": 1,
              "activity": "0,1,2,3",
              "spu": "5757529716664",
              "label_id": "0",
              "video_link": "",
              "command_word": "",
              "recommend_list": "",
              "vip_product": 0,
              "presale": 0,
              "presale_start_time": 0,
              "presale_end_time": 0,
              "presale_day": 0,
              "logistics": "1,2",
              "freight": 2,
              "custom_form": "",
              "is_limit": 0,
              "limit_type": 0,
              "limit_num": 0,
              "express_delivery": true,
              "store_mention": true,
              "attrInfo": {
                "id": 9,
                "product_id": 102,
                "suk": "黑色,CH510",
                "stock": 98,
                "sales": 2,
                "price": "299.00",
                "image": "https://demo26.crmeb.net/uploads/attach/2021/11/15/small_a79f5d2ea6bf0c3c11b2127332dfe2df.jpg",
                "bar_code": "",
                "ot_price": "349.00",
                "volume": "0.00",
                "weight": "0.00",
                "brokerage": "0.00",
                "brokerage_two": "0.00",
                "type": 0,
                "unique": "02cce37e",
                "cost": "259.00",
                "quota": 0,
                "quota_show": 0,
                "vip_price": "0.00",
                "is_virtual": 0,
                "coupon_id": 0,
                "disk_info": ""
              }
            },
            "attrStatus": true,
            "vip_truePrice": 0,
            "costPrice": "259.00",
            "trueStock": 98,
            "truePrice": 299,
            "sum_price": "299.00",
            "price_type": "level",
            "is_valid": 1
          },
          {
            "id": 9669,
            "uid": 34391,
            "type": "0",
            "product_id": 89,
            "product_attr_unique": "89807c67",
            "cart_num": 1,
            "add_time": 1666709911,
            "is_pay": 0,
            "is_del": 0,
            "is_new": 0,
            "combination_id": 0,
            "seckill_id": 0,
            "bargain_id": 0,
            "advance_id": 0,
            "status": 1,
            "productInfo": {
              "id": 89,
              "mer_id": 0,
              "image": "https://demo26.crmeb.net/uploads/attach/2021/11/20211113/small_2fbe723632427b0768df24c4f23c6cad.png",
              "recommend_image": "",
              "slider_image": [
                "https://demo26.crmeb.net/uploads/attach/2021/11/20211113/2fbe723632427b0768df24c4f23c6cad.png",
                "https://demo26.crmeb.net/uploads/attach/2021/11/20211113/64d188477292aa4ae2df8da7e63aca79.png"
              ],
              "store_name": "家居梵高系列联名款饭盒袋大容量手拎保温实用方便 星月夜饭盒袋",
              "store_info": "",
              "keyword": "家居梵高系列联名款饭盒袋大容量手拎保温实用方便 星月夜饭盒袋",
              "bar_code": "",
              "cate_id": "35",
              "price": "350.00",
              "vip_price": "0.00",
              "ot_price": "300.00",
              "postage": "0.00",
              "unit_name": "件",
              "sort": 553,
              "sales": 19,
              "stock": 185,
              "is_show": 1,
              "is_hot": 1,
              "is_benefit": 0,
              "is_best": 0,
              "is_new": 0,
              "is_virtual": 0,
              "virtual_type": 0,
              "add_time": 1636777038,
              "is_postage": 0,
              "is_del": 0,
              "mer_use": 0,
              "give_integral": "0.00",
              "cost": "300.00",
              "is_seckill": 0,
              "is_bargain": null,
              "is_good": 1,
              "is_sub": 0,
              "is_vip": 0,
              "ficti": 0,
              "browse": 0,
              "code_path": "",
              "soure_link": "",
              "temp_id": 0,
              "spec_type": 1,
              "activity": "0,1,2,3",
              "spu": "1015710267816",
              "label_id": "",
              "video_link": "",
              "command_word": "",
              "recommend_list": "",
              "vip_product": 0,
              "presale": 0,
              "presale_start_time": 0,
              "presale_end_time": 0,
              "presale_day": 0,
              "logistics": "1,2",
              "freight": 2,
              "custom_form": "[]",
              "is_limit": 0,
              "limit_type": 0,
              "limit_num": 0,
              "express_delivery": true,
              "store_mention": true,
              "attrInfo": {
                "id": 1017,
                "product_id": 89,
                "suk": "梵高自画像饭盒",
                "stock": 88,
                "sales": 8,
                "price": "350.00",
                "image": "https://demo26.crmeb.net/uploads/attach/2021/11/20211113/small_2fbe723632427b0768df24c4f23c6cad.png",
                "bar_code": "",
                "ot_price": "300.00",
                "volume": "0.00",
                "weight": "0.00",
                "brokerage": "0.00",
                "brokerage_two": "0.00",
                "type": 0,
                "unique": "89807c67",
                "cost": "300.00",
                "quota": 0,
                "quota_show": 0,
                "vip_price": "0.00",
                "is_virtual": 0,
                "coupon_id": 0,
                "disk_info": ""
              }
            },
            "attrStatus": true,
            "vip_truePrice": 0,
            "costPrice": "300.00",
            "trueStock": 88,
            "truePrice": 350,
            "sum_price": "350.00",
            "price_type": "level",
            "is_valid": 1
          }
          ],
          "invalid": [],
          "deduction": {
            "seckill_id": 0,
            "bargain_id": 0,
            "combination_id": 0,
            "discount_id": 0
          }
        }
        let cartList = cartListData
        let valid = cartList.valid
        let validList = that.$util.SplitArray(valid, that.cartList.valid);

        let numSub = [{
          numSub: true
        }, {
          numSub: false
        }];
        let numAdd = [{
          numAdd: true
        }, {
          numAdd: false
        }],
          selectValue = [];
        if (validList.length > 0) {
          for (let index in validList) {
            if (validList[index].cart_num == 1) {
              validList[index].numSub = true;
            } else {
              validList[index].numSub = false;
            }
            let productInfo = validList[index].productInfo;
            if (productInfo.hasOwnProperty('attrInfo') && validList[index].cart_num ==
              validList[index].productInfo.attrInfo
                .stock) {
              validList[index].numAdd = true;
            } else if (validList[index].cart_num == validList[index].productInfo
              .stock) {
              validList[index].numAdd = true;
            } else {
              validList[index].numAdd = false;
            }
            if (validList[index].attrStatus) {
              validList[index].checked = true;
              selectValue.push(validList[index].id);
            } else {
              validList[index].checked = false;
            }
          }
        }
        that.$set(that.cartList, 'valid', validList);
        data.page = that.page + 1;
        // that.goodsHidden = cartList.valid.length <= 0 ? false : true;
        that.selectValue = selectValue;
        let newArr = validList.filter(item => item.attrStatus);
        that.isAllSelect = newArr.length == selectValue.length && newArr.length;
        that.switchSelect();
      }
      that.loading = false;
      this.canShow = true
      uni.hideLoading();
      // });
    },
    getInvalidList: function () {
      let that = this;
      if (this.loadendInvalid) return false;
      if (this.loadingInvalid) return false;
      let data = {
        page: that.pageInvalid,
        limit: that.limitInvalid,
        status: 0
      }
      let resData = {
        "valid": [],
        "invalid": [],
        "deduction": {
          "seckill_id": 0,
          "bargain_id": 0,
          "combination_id": 0,
          "discount_id": 0
        }
      }
      // getCartList(data).then(res => {
      let cartList = resData,
        invalid = cartList.invalid,
        loadendInvalid = invalid.length < that.limitInvalid;
      let invalidList = that.$util.SplitArray(invalid, that.cartList.invalid);
      that.$set(that.cartList, 'invalid', invalidList);
      that.loadendInvalid = loadendInvalid;
      that.loadTitleInvalid = loadendInvalid ? that.$t(`我也是有底线的`) : that.$t(`加载更多`);
      that.pageInvalid = that.pageInvalid + 1;
      that.loadingInvalid = false;
      // }).catch(res => {
      // 	that.loadingInvalid = false;
      // 	that.loadTitleInvalid = that.$t(`加载更多`);
      // })

    },
    getHostProduct: function () {
      let that = this;
      if (that.hotScroll) return
      that.hotPage++
      that.hotScroll = hot_res.length < that.hotLimit
      that.hostProduct = that.hostProduct.concat(hot_res)
      // getProductHot(
      // 	that.hotPage,
      // 	that.hotLimit,
      // ).then(res => {
      // 	that.hotPage++
      // 	that.hotScroll = res.data.length < that.hotLimit
      // 	that.hostProduct = that.hostProduct.concat(res.data)
      // });
    },
    goodsOpen: function () {
      let that = this;
      that.goodsHidden = !that.goodsHidden;
    },
    goRouter (item) {
      var pages = getCurrentPages();
      var page = (pages[pages.length - 1]).$page.fullPath;
      if (item.link == page) return
      uni.switchTab({
        url: item.link,
        fail (err) {
          uni.redirectTo({
            url: item.link
          })
        }
      })
    },
    manage: function () {
      let that = this;
      that.footerswitch = !that.footerswitch;
      let arr1 = [];
      let arr2 = [];
      let newValid = that.cartList.valid.map(item => {
        if (that.footerswitch) {
          if (item.attrStatus) {
            if (item.checked) {
              arr1.push(item.id);
            }
          } else {
            item.checked = false;
            arr2.push(item);
          }
        } else {
          if (item.checked) {
            arr1.push(item.id);
          }
        }
        return item;
      });
      that.cartList.valid = newValid;
      if (that.footerswitch) {
        that.isAllSelect = newValid.length === arr1.length + arr2.length;
      } else {
        that.isAllSelect = newValid.length === arr1.length;
      }
      that.selectValue = arr1;
      that.switchSelect();
    },
    unsetCart: function () {
      let that = this,
        ids = [];
      for (let i = 0, len = that.cartList.invalid.length; i < len; i++) {
        ids.push(that.cartList.invalid[i].id);
      }
      cartDel(ids).then(res => {
        that.$util.Tips({
          title: that.$t(`清除成功`)
        });
        that.$set(that.cartList, 'invalid', []);
        that.getCartNum();
      }).catch(res => {

      });
    }
  },
  onReachBottom () {
    let that = this;
    if (that.loadend) {
      that.getInvalidList();
    }
    if (that.cartList.valid.length == 0 && that.cartList.invalid.length == 0) {
      that.getHostProduct();
    }
  }
}
</script>

<style scoped lang="scss">
.order_addcart {
  padding: 20rpx;
}

.rank-list {
  background: white;
  margin-top: 20rpx;
  padding-top: 20rpx;
  padding-bottom: 10rpx;
  height: 600rpx;
  overflow: auto;

  .rank-list-item {
    margin: 20rpx;
    margin-bottom: 40rpx;
    width: calc(100% - 40rpx);
    height: 50rpx;
    display: flex;

    image {
      width: 50rpx;
      height: 50rpx;
      margin-right: 20rpx;
      margin-left: 10rpx;
    }

    .nuber {
      font-size: 18rpx;
      margin-right: 20rpx;
      line-height: 0rpx;
    }

    .mosaic {
      font-size: 18rpx;
      margin-right: 20rpx;
      color: #999999;
      line-height: 0rpx;
    }

    .litem-info {
      text-align: right;
      flex-grow: 1;
      font-size: 24rpx;
      line-height: 50rpx;
      margin-right: 20rpx;
      color: #666666;
    }

    .balance {
      line-height: 50rpx;
      color: #eb4c63;
    }
  }
}

.loop {
  background: url("http://wine.gzzzyd.com/wx/order_addcart/hongbaochi.png")
    no-repeat;
  width: 100%;
  height: 250rpx;
  background-size: 100% 100%;
  position: relative;

  .loop-title {
    padding: 20rpx;
    padding-left: 35rpx;
    font-size: 32rpx;
  }

  .loop-count {
    text-align: center;
    line-height: 97rpx;
    font-size: 48rpx;
    color: #eb4c63;
    width: 420rpx;
    height: 97rpx;
    background: #ffffff;
    border-radius: 23px;
    border: 1px solid #eb4c63;
    position: absolute;
    left: 50%;
    top: 47%;
    transform: translateX(-50%);
  }

  // image {
  // 	width: 100%;
  // }
}

.tab-area {
  margin-top: 20rpx;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  line-height: 90rpx;
  text-align: center;

  .base-tab {
    width: 48%;
    height: 90rpx;
  }

  .tab-area-active1 {
    background: url("http://wine.gzzzyd.com/wx/order_addcart/tab1.png")
      no-repeat;
    background-size: 340rpx 120rpx;
  }

  .tab-area-active2 {
    background: url("http://wine.gzzzyd.com/wx/order_addcart/tab2.png")
      no-repeat;
    background-size: 340rpx 120rpx;
  }
}

.order_addcart-header-area {
  display: flex;

  .received {
    width: 405rpx;
    height: 175rpx;
    padding: 20rpx;
    margin-bottom: 20rpx;
    margin-right: 20rpx;
    background-color: #fff;
    border-radius: 20rpx;
    overflow: hidden;
    position: relative;
    display: flex;

    .pictrue {
      display: flex;
      align-items: center;

      image {
        width: 98rpx;
        height: 98rpx;
      }

      margin-right: 20rpx;
    }

    .text-info {
      display: flex;
      flex-direction: column;
      justify-content: center;

      color: #6eb03a;

      .received-count {
        font-size: 38rpx;
        margin-bottom: 10rpx;
        letter-spacing: 2px;
      }

      .received-info {
        font-size: 28rpx;
      }
    }
  }

  .loss {
    flex-grow: 1;
    height: 175rpx;
    padding: 20rpx;
    margin-bottom: 20rpx;
    background-color: #fff;
    border-radius: 20rpx;
    overflow: hidden;
    position: relative;
    display: flex;

    .text-info {
      width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
      color: #d08d5b;

      .received-count {
        font-size: 38rpx;
        margin-bottom: 10rpx;
        letter-spacing: 2px;
      }

      .received-info {
        font-size: 28rpx;
      }
    }
  }
}
.warp {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.rect {
  position: relative;
  width: 700rpx;
  height: 950rpx;
  background: url("http://wine.gzzzyd.com/wx/order_addcart/hongbao_bg.png")
    no-repeat;

  background-size: 700rpx 950rpx;
  .cover-img {
    margin-top: 80rpx;
    position: relative;
    left: 50%;
    transform: translate(-50%, 0%);
    width: 120rpx;
    height: 120rpx;
    border-radius: 50%;
    overflow: hidden;
    .avatar {
      position: absolute;
      z-index: 9999;
      width: 120rpx;
      height: 120rpx;
    }
  }
  .h-info {
    position: relative;
    text-align: center;
    padding: 10rpx;
    height: 390rpx;
    color: white;
    .paper_list {
      margin: 20rpx;
      text {
        margin-right: 10rpx;
      }
    }
    .grabAmount_count {
      margin-top: 80rpx;
      color: rgb(244, 180, 53);
      &:nth-child(1) {
        font-size: 32rpx;
      }
    }
  }
  .op-img {
    cursor: pointer;
    position: relative;
    left: 50%;
    transform: translate(-50%, 0rpx);
    width: 150rpx;
    height: 150rpx;
  }
  .b-info {
    font-size: 22rpx;
    width: 100%;
    text-align: center;
    color: rgb(244, 180, 53);
    margin-bottom: 30rpx;
  }
  .b-box {
    margin: 0 auto;
    color: rgb(244, 180, 53);
    border-radius: 50rpx;
    width: 55%;
    font-size: 22rpx;
    height: 40rpx;
    line-height: 40rpx;
    background: rgb(196, 40, 62);
    text-align: center;
  }
}
.acitiveRedper {
  color: rgb(244, 180, 53);
  text-decoration: underline;
}
</style>