<template>
  <view class="main">
    <div class="mainTop" :style="{ paddingTop: menu.top + 'px' }">
      <view class="headerTop" :style="{ height: menu.height + 'px' }">
        <image class="backArrow" src="/static/images/home/backArrowblack.svg" @click="handleBackHome" />
        <view class="pageName">{{
          bigPageType === "UnionMall" ? "工会之家" : "购物车"
        }}</view>
        <view class="backArrow"></view>
      </view>

      <div style="
          width: 100%;
          height: 60px;
          display: flex;
          align-items: center;
          justify-content: flex-end;
          padding-top: 20px;
          box-sizing: border-box;
        ">
        <div class="topLeft" @click="handleShowAddress">
          <view style="display: flex; align-items: center">
            <image class="topIcon" src="/static/images/home/fixed.svg" />
            <text class="name">{{
              showAddressObj.DOORPLATE || "点击添加地址"
            }}</text>
          </view>
          <view class="phone" style="margin-top: 8rpx" v-if="showAddressObj.MEMBERADDRESS_ID">
            <text style="margin-right: 8rpx">{{
              showAddressObj.USER_NAME || ""
            }}</text>
            {{ showAddressObj.MOBILEPHONE || "" }}
          </view>
          <!-- <picker :value="siteValue" :range="siteList" range-key="ServerpartShop_Address" @change="handleSiteChange">
          <view style="display: flex;align-items: center">
            <image class="topIcon" src="/static/images/home/fixed.svg" />
            <text class="name">{{ siteName }}</text>
          </view>
        </picker> -->
        </div>
        <div v-if="pageType === 'normal'" class="topRight" @click="handleChangePageType">
          <image class="editIcon" src="/static/images/home/edit.svg" />
          <text class="editText">编辑</text>
        </div>
        <div v-else class="topRight" @click="handleChangePageType">
          <text class="editText">完成</text>
        </div>
      </div>
    </div>

    <scroll-view class="shopList" scroll-y :style="{
      height: `calc(100vh - ${50 + safeHeight + 60 + menu.top + 32 + 80 + 16
        }px)`,
    }">
      <div class="shopBox">
        <div class="shopItem" v-for="(item, index) in shopList" :key="index">
          <!-- :style="{ height: (item.rows - 1) * 28 + 210 + 'rpx' }" -->

          <!--                    @touchmove="moveTouch" -->
          <view class="shopUp" :style="{ height: (item.rows - 1) * 28 + 210 + 'rpx' }">
            <div class="detail" :style="selectIndex === index
              ? selectStyle
              : (item.rows - 1) * 28 + 210 + 'rpx'
              " @touchstart="startTouch($event, index)" @touchmove="moveTouch" @touchend="endTouch" :key="index">
              <div class="detailLeft">
                <view style="display: flex">
                  <radio v-if="pageType === 'normal'" :checked="item.select" color="#1890FF"
                    @click="handleChangeSelect(item)"></radio>
                  <radio v-else :checked="item.selectDelete" color="#1890FF" @click="handleChangeDelete(item)"></radio>
                  <image class="leftIcon" :src="item.IMAGE_PATH ||
                    item.DEFAULT_IMG ||
                    '/static/images/home/defultImg.png'
                    " />
                </view>
                <view class="simPriceBox">
                  <text class="sumPriceUnit">￥</text>{{
                    $utils.handleFormatNumber(
                      item.COMMODITY_MEMBERPRICE * item.count
                    )
                  }}
                </view>
              </div>
              <div class="detailRight">
                <div class="title">
                  <div class="pingnuo" v-if="item.DATAFORMAT === 2">
                    <div class="pingnuoItem">品诺</div>
                  </div>
                  {{ item.COMMODITY_RULE ? `（${item.COMMODITY_RULE}）` : "" }}
                  {{ item.COMMODITY_NAME }}
                </div>
                <div class="otherBox">
                  <div class="priceBox">
                    <view>
                      <text class="priceIcon">￥</text>
                      <text class="priceNumber">{{
                        item.COMMODITY_MEMBERPRICE
                      }}</text>
                      <text class="priceUnit">/{{ item.COMMODITY_UNIT }}</text>
                    </view>
                  </div>
                  <div class="cartcontrol">
                    <div class="subtract" @click="decreaseGoodToCartFn($event, item)" :id="'decrease_' +
                      item.SELLERCOMMODITY_ID +
                      '_' +
                      item.SELLERCOMMODITYTYPE_ID
                      ">
                      <image class="img" src="/static/images/home/subtract.svg"></image>
                    </div>
                    <!--                                        -->
                    <!--                            confirm-type="search" @confirm="getList"-->
                    <input class="cart-count" confirm-type="done" type="digit" :maxlength="7"
                      style="background: #fff; text-align: center" placeholder="0" @blur="haveFocus($event, item)"
                      @focus="haveFocus($event, item)" v-model="item.count" />
                    <!--                                        @change="changInput($event, item)"-->
                    <div class="subtract" @click="touchOnGoods($event, item)" :id="'add_' +
                      item.SELLERCOMMODITY_ID +
                      '_' +
                      item.SELLERCOMMODITYTYPE_ID
                      ">
                      <image class="img" src="/static/images/home/addIcon.svg"></image>
                    </div>
                  </div>
                </div>
                <!--                                <div class="descBox">{{item.SALEDETAIL_DESC}}</div>-->
                <div class="descBox">
                  <input class="desc" v-model="item.SALEDETAIL_DESC" placeholder="请填写商品备注" />
                </div>
              </div>
            </div>
            <div class="shopDown" @click="handleDeleteItem(item)">删除</div>
          </view>
        </div>
      </div>
    </scroll-view>

    <div class="bottom" :style="{ bottom: `${50 + safeHeight}px` }">
      <div class="bottomLeft" v-if="pageType === 'normal'">
        <radio :checked="isAllSelect" color="#1890FF" @click="handleAllSelect" />全选
      </div>
      <div class="bottomLeft" v-else>
        <radio :checked="isAllDelete" color="#1890FF" @click="handleAllDelete" />全选
      </div>
      <div class="bottomRight" v-if="pageType === 'normal'">
        <text class="sum">合计</text>
        <text class="sumPrice">￥</text>
        <text class="sunNumber">{{ totalPay }}</text>
        <div class="submitBtn" @click="goPayFn">立即下单</div>
      </div>
      <div v-else class="deleteBtn" @click="handleDelete">删除</div>
    </div>

    <uni-popup ref="addressPopup" :safe-area="false">
      <view class="addressPopupBox">
        <view class="addressPopupTitle">选择收货地址</view>
        <view class="addressList">
          <view class="addressItem" v-for="(item, index) in addressList" :key="index"
            @click="handleClickAddressItem(item)">
            <view class="addressItemTop">
              <view class="itemTopLeft">
                <radio :checked="item.MEMBERADDRESS_ID === selectAddressId" color="#1890FF"
                  @click="handleChangeAddress(item.MEMBERADDRESS_ID)" :disabled="!item.MEMBERADDRESS_CODE"></radio>
                <text class="addressText">{{ item.ADDRESS || "" }}{{ item.DOORPLATE || "" }}</text>
              </view>
              <view class="itemTopRight" @click="checkOrEdit(item.MEMBERADDRESS_ID)">
                <img class="pickerImg" src="https://eshangtech.com/ShopICO/ahyd-mall/editIcon.svg" />
              </view>
            </view>

            <view class="addressItemBottom">
              <text class="bigName" style="margin-right: 8rpx">{{
                item.USER_NAME || ""
              }}</text>
              <text class="name" style="margin-right: 8rpx">{{
                item.USER_SEX_TEXT || ""
              }}</text>
              <text class="phone">{{ item.MOBILEPHONE || "" }}</text>
            </view>
          </view>
        </view>

        <navigator url="/pages/myAddress/newAdd/index" class="btn">新增收货地址</navigator>
      </view>
    </uni-popup>

    <shop-tabbar :page="'/pages/shopMallPage/shopCar/index'" :pageType="bigPageType" :shopCarLength="shopCarListCount"
      :zIndex="popupShow ? 98 : 99" />
  </view>
</template>

<script>
import { mapGetters } from "vuex";
import shopTabbar from "../../../components/shopTabbar.vue";
export default {
  components: { shopTabbar },
  data() {
    return {
      menu: {}, // 手机基本信息
      pageType: "normal", // 是否启用购物车管理功能  normal 时为正常
      shopList: [], // 购物车数据
      shopCarListCount: 0, // 购物车商品数量
      isAllDelete: false, // 删除的全选
      startX: 0, // 左滑出现删除需要的参数
      selectIndex: undefined, // 左滑出现删除需要的参数
      disX: 0, //
      selectStyle: "", // 左滑出现删除需要的参数
      delBtnWidth: 72, // 左滑出现删除需要的参数
      isAllSelect: false, // 是否选中全选
      totalPay: 0, // 根据选中的商品需要支付的钱
      inputMaxLength: -1,
      pageOut: false, // 是不是从立即下单离开页面的
      storeId: "",
      systemInfo: {},
      bigPageType: "", // 页面类型 是不是进来查工会之家的
      userInfo: {}, // 最新的用户数据
      addressList: [], // 地址列表
      showAddressObj: {}, // 当前选中的地址
      popupShow: false, // 悬浮框显示
      selectAddressId: 0, // 选中的地址id
      goChangeAddress: false, // 跳转去修改地址的地方
      safeHeight: 0,
    };
  },
  watch: {
    // 深度监听数组变化
    shopList: {
      handler(newVal, oldVal) {
        if (newVal && newVal.length > 0) {
          let count = 0;
          newVal.forEach((item) => {
            count += item.count;
          });
          this.shopCarListCount = count;
        } else {
          this.shopCarListCount = 0;
        }
      },
      deep: true,
    },
  },
  computed: {
    ...mapGetters({
      user: "user",
    }),
  },
  async onLoad(query) {
    console.log("query", query);

    let height = uni.getStorageSync("safeHeight");
    this.safeHeight = Number(height);

    let systemInfo = uni.getSystemInfoSync();
    this.menu = uni.getMenuButtonBoundingClientRect();
    this.systemInfo = systemInfo;
    console.log("systemInfo", systemInfo);

    if (query.pageType) {
      this.bigPageType = query.pageType;
    }

    // 获取最新的用户余额
    if (this.bigPageType === "UnionMall") {
      await this.handleGetUserBalance();
    }

    // 获得用户地址数据
    this.handleGetAddressList();

    this.handleGetNowShopCarList();
    this.handleSum();
    this.$utils.addUserBehaviorNew();
  },
  onShow() {
    console.log("this.bigPageType", this.bigPageType);
    console.log("this.$store.state", this.$store.state);
    // 判断当前的购物车里面是否有东西
    let shopCarList = [];
    if (this.bigPageType === "UnionMall") {
      shopCarList = this.$store.state.unionMyShopCar;
    } else {
      shopCarList = this.$store.state.myShopCar;
    }
    console.log("shopCarList", shopCarList);
    this.shopList = shopCarList;
    let count = 0;
    if (shopCarList && shopCarList.length > 0) {
      shopCarList.forEach((item) => {
        count += item.count;
      });
    }
    this.shopCarListCount = count;
    this.handleSum();

    this.handleGetAddressList();
  },
  methods: {
    // 点击地址
    handleClickAddressItem(obj) {
      if (!obj.MEMBERADDRESS_CODE) {
        uni.showToast({
          title: "请完善地址！",
          icon: "none",
        });
      }
    },
    // 显示选择地址的悬浮框
    handleShowAddress() {
      this.$refs.addressPopup.open("bottom");
      this.popupShow = true;
    },
    // 切换选中的地址
    handleChangeAddress(id) {
      console.log("this.selectAddressId", this.selectAddressId);

      this.addressList.forEach((item) => {
        if (item.MEMBERADDRESS_ID === id) {
          this.showAddressObj = item;
          this.selectAddressId = item.MEMBERADDRESS_ID;
        }
      });
      this.$forceUpdate();
      this.$refs.addressPopup.close();
      this.popupShow = false;
    },
    // 编辑地址
    checkOrEdit(id) {
      this.goChangeAddress = true;
      uni.navigateTo({ url: "/pages/myAddress/newAdd/index?id=" + id });
    },
    // 选择地址列表
    async handleGetAddressList() {
      const data = await this.$api.getCoop({ action_type: "GetAddressList" });
      let list = data.Data.List;
      let haveMEMBERADDRESSCODEList = [];
      let defaultAddress = {};
      if (list && list.length > 0) {
        list.forEach((item) => {
          if (item.ISDEFAULT === 1 && item.MEMBERADDRESS_CODE) {
            defaultAddress = item;
          }
          if (item.MEMBERADDRESS_CODE) {
            haveMEMBERADDRESSCODEList.push(item);
          }
        });
      }
      console.log("defaultAddress", defaultAddress);
      console.log("address", list);
      if (!defaultAddress.MEMBERADDRESS_ID) {
        if (haveMEMBERADDRESSCODEList && haveMEMBERADDRESSCODEList.length > 0) {
          defaultAddress = haveMEMBERADDRESSCODEList[0];
        }
      }
      if (defaultAddress) {
        this.showAddressObj = defaultAddress;
        this.selectAddressId = defaultAddress.MEMBERADDRESS_ID;
      } else {
        this.showAddressObj = {};
        this.selectAddressId = 0;
      }
      this.addressList = list;
      this.$forceUpdate();
    },
    // 获取最新的用户余额
    async handleGetUserBalance() {
      uni.showLoading({
        title: "获取用户余额...",
      });
      const data = await this.$api.getCoop({
        action_type: "GetMembershipInfo",
        WechatUserId: this.user.WechatUserId,
      });
      this.userInfo = data.Data;
      console.log("this.userInfo", this.userInfo);
      uni.hideLoading();
    },
    // 判断当前购物车是否有内容 有内容的话 处理
    handleGetNowShopCarList() {
      let shopCarList = [];
      if (this.bigPageType === "UnionMall") {
        shopCarList = this.$store.state.unionMyShopCar;
      } else {
        shopCarList = this.$store.state.myShopCar;
      }
      console.log("shopCarList", shopCarList);
      if (shopCarList && shopCarList.length > 0) {
        shopCarList.forEach((item) => {
          item.rows =
            item.COMMODITY_NAME && item.COMMODITY_NAME.length / 14 > 1
              ? Math.ceil(item.COMMODITY_NAME.length / 14)
              : 1;
        });
      }
      this.shopList = shopCarList;
    },
    // 改变当前的编辑状态
    handleChangePageType() {
      if (this.pageType === "normal") {
        this.pageType = "edit";
        this.isAllDelete = false;
      } else {
        this.pageType = "normal";
      }
    },
    // 左滑删除的接触到屏幕
    startTouch(e, index) {
      console.log("e", e);
      if (e.touches.length === 1) {
        this.startX = e.touches[0].clientX;
        this.selectIndex = index;
        // this.selectIndex = Number(e.currentTarget.dataset.eventid.split('_')[1])
      }
    },
    // 左滑删除的接触到屏幕并且不松手移动
    moveTouch(e) {
      let _this = this;
      if (e.touches.length === 1) {
        let moveX = e.touches[0].clientX;
        let disX = _this.startX - moveX;
        let delBtnWidth = _this.delBtnWidth;
        let txtStyle = "";
        if (disX === 0 || disX < 0) {
          txtStyle = "left:0px";
        } else if (disX > 0 && disX >= delBtnWidth / 3) {
          txtStyle = "left:-" + disX + "px";
          if (disX >= (delBtnWidth / 10) * 9) {
            txtStyle = "left:-" + delBtnWidth + "px";
          }
        }
        let index = e.currentTarget.dataset.index;
        this.disX = disX;
        this.selectIndex = index;
        this.selectStyle = txtStyle;
      }
    },
    // 左滑的离开屏幕
    endTouch(e) {
      if (this.disX < this.delBtnWidth) {
        this.selectStyle = "right:0px";
      }
    },
    // 拿到合计金额
    handleSum() {
      this.totalPay = 0;
      this.shopList.forEach((u) => {
        if (u.select === true) {
          let goodNum = Number(u.count);
          this.totalPay += Number(u.COMMODITY_MEMBERPRICE) * goodNum;
          this.totalPay = Number(this.totalPay.toFixed(2));
        }
      });
    },
    // 修改商品前面的单选框选中效果
    handleChangeSelect(item) {
      if (item.select) {
        item.select = false;
      } else {
        item.select = true;
      }
      let isSelect = 0;
      this.shopList.forEach((item) => {
        if (item.select) {
          isSelect += 1;
        }
      });
      this.isAllSelect = isSelect === this.shopList.length;
      this.handleSum();
      this.$forceUpdate();
    },
    // 取消选中商品的方法
    handleChangeDelete(item) {
      console.log("item", item);
      if (item.selectDelete) {
        item.selectDelete = false;
      } else {
        item.selectDelete = true;
      }
      let isSelect = 0;
      this.shopList.forEach((item) => {
        if (item.selectDelete) {
          isSelect += 1;
        }
      });
      this.isAllDelete = isSelect === this.shopList.length;
      this.$forceUpdate();
    },
    // 商品数量减少
    decreaseGoodToCartFn(e, item) {
      if (item.count > 0) {
        // item.count -= 1;
        if (item.count - 1 <= 0) {
          let _this = this;
          uni.showModal({
            title: "确定移除该商品？",
            success: function (res) {
              if (res.confirm) {
                item.count -= 1;
                // 这里重复了先这样
                console.log('item', JSON.parse(JSON.stringify(item)));

                if (item.count === 0) {
                  let list = [];
                  _this.shopList.forEach((i) => {
                    // 判断有没有多规格
                    if (item.RTCOMMODITY_MULTI_ID) {
                      if (i.RTCOMMODITY_MULTI_ID !== item.RTCOMMODITY_MULTI_ID) {
                        list.push(i);
                      }
                    } else {
                      if (i.COMMODITY_ID !== item.COMMODITY_ID) {
                        list.push(i);
                      }
                    }
                  });
                  _this.shopList = list;
                }
                _this.handleSum();
                if (_this.bigPageType === "UnionMall") {
                  _this.$store.commit("unionMyShopCar", _this.shopList);
                } else {
                  _this.$store.commit("myShopCar", _this.shopList);
                }
                _this.$forceUpdate();
              }
            },
          });
        } else {
          item.count -= 1;
        }
      }
      if (item.count === 0) {
        let list = [];
        this.shopList.forEach((i) => {
          if (item.RTCOMMODITY_MULTI_ID) {
            if (i.RTCOMMODITY_MULTI_ID !== item.RTCOMMODITY_MULTI_ID) {
              list.push(i);
            }
          } else {
            if (i.COMMODITY_ID !== item.COMMODITY_ID) {
              list.push(i);
            }
          }
        });
        this.shopList = list;
      }
      this.handleSum();

      console.log(' this.shopList', this.shopList);

      if (this.bigPageType === "UnionMall") {
        this.$store.commit("unionMyShopCar", this.shopList);
      } else {
        this.$store.commit("myShopCar", this.shopList);
      }
      this.$forceUpdate();
    },
    // 输入框里面的数量
    haveFocus(e, item) {
      console.log("e", e);
      let value = e.detail.value;
      let number = 0;
      if (value.indexOf(".") === -1) {
        number = Number(value);
      } else {
        let bigNumber = value.split(".")[0];
        number = Number(bigNumber);
      }
      console.log("number2", number);
      let oldCount = item.count;

      if (number < 0) {
        item.count = 1;
        return;
      }

      if (number === 0) {
        let _this = this;
        uni.showModal({
          title: "确定移除该商品？",
          success: function (res) {
            if (res.confirm) {
              item.count = number;
              let list = [];
              _this.shopList.forEach((subItem) => {
                if (
                  subItem.COMMODITY_CODE !== item.COMMODITY_CODE &&
                  item.count > 0
                ) {
                  list.push(subItem);
                }
              });
              _this.shopList = list;
              console.log("this.dataList1111", _this.shopList);
              if (_this.bigPageType === "UnionMall") {
                _this.$store.commit("unionMyShopCar", _this.shopList);
              } else {
                _this.$store.commit("myShopCar", _this.shopList);
              }
              _this.handleSum();
              _this.$forceUpdate();
            } else if (res.cancel) {
              item.count = Number(oldCount);
            }
          },
        });
      } else {
        item.count = number;
      }
      console.log("this.dataList1111", this.shopList);
      if (this.bigPageType === "UnionMall") {
        this.$store.commit("unionMyShopCar", this.shopList);
      } else {
        this.$store.commit("myShopCar", this.shopList);
      }
      this.handleSum();
      this.$forceUpdate();
    },
    // 数量增加
    touchOnGoods(e, item) {
      item.count += 1;
      this.handleSum();
      if (this.bigPageType === "UnionMall") {
        this.$store.commit("unionMyShopCar", this.shopList);
      } else {
        this.$store.commit("myShopCar", this.shopList);
      }
    },
    // 左滑出现的删除
    handleDeleteItem(obj) {
      console.log('obj', obj)
      console.log('this.shopList', this.shopList)
      let list = [];
      this.shopList.forEach((item) => {
        if (item.COMMODITY_ID !== obj.COMMODITY_ID) {
          list.push(item);
        } else {
          if (obj.RTCOMMODITY_MULTI_ID) {
            // 规格都一样 说明确实是同一个了 可以删除
            if (item.RTCOMMODITY_MULTI_ID === obj.RTCOMMODITY_MULTI_ID) {

            } else {
              list.push(item);
            }
          } else {
            // list.push(item); 
          }
        }
      });

      this.shopList = list;
      if (this.bigPageType === "UnionMall") {
        this.$store.commit("unionMyShopCar", this.shopList);
      } else {
        this.$store.commit("myShopCar", this.shopList);
      }
      this.selectStyle = "";
      this.handleSum();
    },
    // 全选
    handleAllSelect() {
      this.isAllSelect = !this.isAllSelect;
      if (this.isAllSelect) {
        this.shopList.forEach((item) => {
          item.select = true;
        });
      } else {
        this.shopList.forEach((item) => {
          item.select = false;
        });
      }
      this.handleSum();
    },
    // 删除的全选
    handleAllDelete() {
      this.isAllDelete = !this.isAllDelete;
      if (this.isAllDelete) {
        this.shopList.forEach((item) => {
          item.selectDelete = true;
        });
      } else {
        this.shopList.forEach((item) => {
          item.selectDelete = false;
        });
      }
      this.$forceUpdate();
    },
    // 多选的删除
    handleDelete() {
      let list = [];
      this.shopList.forEach((item) => {
        if (!item.selectDelete) {
          list.push(item);
        }
      });
      this.shopList = list;
      this.handleSum();
      if (this.bigPageType === "UnionMall") {
        this.$store.commit("unionMyShopCar", this.shopList);
      } else {
        this.$store.commit("myShopCar", this.shopList);
      }
      this.pageType = "normal";
      this.$forceUpdate();
    },
    // 立即下单
    goPayFn() {
      // 先检查选中的商品列表里面有没有预售商品
      let isPresale = false;
      if (this.shopList && this.shopList.length > 0) {
        this.shopList.forEach((item) => {
          if (item.USERDEFINEDTYPE_PID === 1355 && item.select) {
            if (
              new Date().getTime() < new Date(item.UPPER_DATE).getTime() ||
              new Date().getTime() > new Date(item.OFF_DATE).getTime()
            ) {
              isPresale = true;
              //             UPPER_DATE
              // OFF_DATE
            }
          }
        });
      }

      console.log("this.shopList", this.shopList);

      if (isPresale) {
        uni.showToast({
          title: "选中的商品中有未售商品，无法下单！",
          icon: "none",
        });
        return;
      }

      // 判断是不是在工会之家下单 下单的话 就要查询用户余额  余额有的  才能下单
      if (this.bigPageType === "UnionMall") {
        if (!(this.userInfo.ACCOUNT_BALANCE > 0)) {
          uni.showToast({
            title: "工会之家余额为0，无法下单！",
            icon: "none",
          });
          return;
        } else if (this.totalPay > Number(this.userInfo.ACCOUNT_BALANCE)) {
          // uni.showToast({
          //   title: "账户余额不足！",
          //   icon: "none",
          // });
          // return;
        }
      }

      // 判断当前勾选的商品 中 DATAFORMAT 是不是单一的 若有 2 有 1  则不能去下单页面 都1 都2 可以去
      if (
        this.shopList &&
        this.shopList.length > 0 &&
        this.bigPageType !== "UnionMall"
      ) {
        let DATAFORMATTypeList = [];

        this.shopList.forEach((item) => {
          if (item.select) {
            if (DATAFORMATTypeList.indexOf(item.DATAFORMAT) === -1) {
              DATAFORMATTypeList.push(item.DATAFORMAT);
            }
          }
        });
        console.log("DATAFORMATTypeList", DATAFORMATTypeList);

        if (DATAFORMATTypeList && DATAFORMATTypeList.length > 1) {
          uni.showToast({
            title: "订单中含有品诺商城商品，请去除后下单！",
            icon: "none",
          });
          return;
        }
      }
      console.log("this.shopList", this.shopList);
      if (this.shopList.length > 0) {
        this.pageOut = true;
        let orderList = [];
        let noSelectList = [];
        this.shopList.forEach((item) => {
          item.COMMODITY_INTRO = "";
          // 老东西 不理解 但是尊重
          if (item.select === true) {
            item.ORDER_COUNT = item.count;
            item.AVERAGE_PRICE = item.COMMODITY_MEMBERPRICE;
            item.cartItemAoumt = Number(
              (item.AVERAGE_PRICE * item.ORDER_COUNT).toFixed(2)
            );
            item.ORDER_AMOUNT = Number(
              (item.AVERAGE_PRICE * item.ORDER_COUNT).toFixed(2)
            );
            orderList.push(item);
          } else {
            item.ORDER_COUNT = item.count;
            item.AVERAGE_PRICE = item.COMMODITY_MEMBERPRICE;
            item.cartItemAoumt = Number(
              (item.AVERAGE_PRICE * item.ORDER_COUNT).toFixed(2)
            );
            item.ORDER_AMOUNT = Number(
              (item.AVERAGE_PRICE * item.ORDER_COUNT).toFixed(2)
            );
            noSelectList.push(item);
          }
        });
        // this.$store.commit('shopcartOrder', orderList)
        // 购物车改了后有些id不一样了 统一一下
        if (orderList && orderList.length > 0) {
          orderList.forEach((item) => {
            let [big, small] = item.COMMODITY_MEMBERPRICE.toString().split(".");
            item.COMMODITY_INYEGER = big;
            item.COMMODITY_DECIMAL = small;
            // item.COMMODITY_ID = item.SELLERCOMMODITY_ID
          });
        }
        console.log("noSelectList", noSelectList);
        console.log("orderList", orderList);
        let id = Number(
          Math.random().toString().substr(3, 5) + Date.now()
        ).toString(36);
        if (orderList.length > 0) {
          uni.navigateTo({
            url: `/pages/shopPages/settlement/index?pageType=shopCar&shopCarList=${JSON.stringify(
              orderList
            )}&pageType=${this.bigPageType}&addressId=${this.selectAddressId}`,
          });
        } else {
          uni.showToast({ title: "购物车内无勾选商品", icon: "none" });
        }
      }
    },
    // 返回首页
    handleBackHome() {
      if (this.bigPageType === "UnionMall") {
        uni.redirectTo({
          url: `/pages/shopMallPage/index/index?pageType=${this.bigPageType}`,
        });
      } else {
        uni.redirectTo({
          url: "/pages/shopMallPage/index/index",
        });
      }
    },
  },
};
</script>

<style lang="less" scoped>
.main {
  width: 100%;
  height: 100vh;
  background: #f2f4f5;

  .mainTop {
    width: 100%;
    box-sizing: border-box;
    padding: 14px 16px;
    background: #ffffff;

    .headerTop {
      width: 100%;
      display: flex;
      align-items: center;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: space-between;

      .backArrow {
        width: 48rpx;
        height: 48rpx;
      }

      .pageName {
        font-size: 32rpx;
        font-weight: 600;
        color: #000;
      }
    }

    .topLeft {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: flex-start;

      .topIcon {
        width: 16px;
        height: 16px;
        margin-right: 4px;
      }

      .name {
        width: calc(100% - 20px);
        font-size: 32rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        line-height: 20px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
      }

      .phone {
        font-size: 28rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        line-height: 20px;
        color: #786b6c;
      }
    }

    .topRight {
      width: 250rpx;
      display: flex;
      align-items: center;
      justify-content: flex-end;

      .editIcon {
        width: 16px;
        height: 16px;
        margin-right: 4px;
      }

      .editText {
        font-size: 14px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #020e1a;
        line-height: 20px;
      }
    }
  }

  .shopList {
    width: calc(100% - 32px);
    margin: 12px 0 0 16px;
    background: #fff;
    border-radius: 10px;

    .shopBox {
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      padding: 12px;

      .shopItem {
        margin-bottom: 4px;
        border-bottom: 1px solid #f5f7f7;
        padding-bottom: 12rpx;

        //position: relative;
        .shopUp {
          width: 100%;
          //min-height: 100px;
          //display: flex;
          //align-items: center;
          background: #fff;
          position: relative;
          z-index: 2;

          .detail {
            flex: 1;
            display: flex;
            align-items: flex-start;
            padding: 8px 0;
            z-index: 2;
            width: 100%;
            position: absolute;

            //width: calc(100% - 60rpx);
            //right: 0!important;
            .detailLeft {
              z-index: 2;
              border-radius: 8px;
              margin-right: 8px;
              display: flex;
              flex-direction: column;
              align-items: center;
              justify-content: flex-end;

              .leftIcon {
                width: 72px;
                height: 72px;
                overflow: hidden;
              }

              .simPriceBox {
                height: 20px;
                font-size: 18px;
                font-family: DINAlternate-Bold, DINAlternate;
                font-weight: bold;
                color: #ff6219;
                line-height: 18px;
                width: 100%;
                margin-top: 24rpx;
                text-align: center;

                .sumPriceUnit {
                  font-size: 12px;
                  font-family: DINAlternate-Bold, DINAlternate;
                  font-weight: bold;
                  // color: #ff6219;
                  color: #ff6219;
                  line-height: 18px;
                }
              }
            }

            .detailRight {
              width: 100%;
              height: 104px;
              z-index: 2;
              background: #fff;

              .title {
                width: 100%;
                font-size: 14px;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #020e1a;
                line-height: 18px;
                overflow: hidden;
                display: -webkit-box;
                text-overflow: ellipsis;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                margin-bottom: 8rpx;

                .pingnuo {
                  display: inline-block;
                  margin-right: 8rpx;

                  .pingnuoItem {
                    padding: 4rpx 12rpx;
                    border-radius: 28rpx;
                    background: linear-gradient(90deg,
                        #ffebe5 0%,
                        #ffedd8 100%);
                    font-family: "PingFangSC";
                    font-weight: 400;
                    font-size: 22rpx;
                    color: #ff7040;
                    line-height: 30rpx;
                    text-align: left;
                    font-style: normal;
                  }
                }
              }

              .otherBox {
                width: 100%;
                display: flex;
                justify-content: space-between;
                align-items: center;

                .priceBox {
                  display: flex;
                  flex-direction: column;
                  align-items: flex-start;

                  .priceIcon {
                    font-size: 12px;
                    font-family: DINAlternate-Bold, DINAlternate;
                    font-weight: bold;
                    // color: #ff6219;
                    color: #9fa3a8;
                    line-height: 18px;
                  }

                  .priceNumber {
                    font-size: 12px;
                    font-family: DINAlternate-Bold, DINAlternate;
                    font-weight: bold;
                    // color: #ff6219;
                    color: #9fa3a8;
                    line-height: 18px;
                  }

                  .priceUnit {
                    font-size: 12px;
                    font-family: PingFangSC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #9fa3a8;
                    line-height: 18px;
                  }

                  .sumPrice {
                    font-size: 18px;
                    font-family: DINAlternate-Bold, DINAlternate;
                    font-weight: bold;
                    color: #ff6219;
                    line-height: 18px;
                    width: 100%;

                    .sumPriceUnit {
                      font-size: 12px;
                      font-family: DINAlternate-Bold, DINAlternate;
                      font-weight: bold;
                      // color: #ff6219;
                      color: #ff6219;
                      line-height: 18px;
                    }
                  }
                }

                .cartcontrol {
                  width: 120px;
                  height: 30px;
                  line-height: 30px;
                  display: flex;
                  justify-content: flex-start;
                  border: 1px solid rgba(2, 14, 26, 0.06);
                  border-radius: 2px;

                  .subtract {
                    width: 30px;
                    height: 30px;
                    background: #f2f4f5;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    border-radius: 2px 0 0 2px;
                    font-size: 8px;
                    color: #9fa3a8;

                    .img {
                      width: 16px;
                      height: 16px;
                    }
                  }

                  .cart-count {
                    height: 30px !important;
                    line-height: 30px;
                    font-size: 14px;
                    flex: 1;
                  }
                }
              }

              .descBox {
                width: 100%;
                box-sizing: border-box;
                background: #f2f4f5;
                border-radius: 4px;
                margin-top: 9px;
                padding-left: 6px;

                .desc {
                  font-size: 12px;
                  font-family: PingFangSC-Regular, PingFang SC;
                  font-weight: 400;
                  color: #020e1a;
                  line-height: 16px;
                }
              }
            }
          }

          .shopDown {
            width: 72px;
            background: red;
            min-height: 88px;
            font-size: 14px;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: #fefffe;
            line-height: 20px;
            display: flex;
            justify-content: center;
            position: absolute;
            right: 0;
            top: 16rpx;
            align-items: center;
            z-index: 1;
          }
        }
      }
    }
  }

  .bottom {
    position: fixed;
    left: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    width: 100%;
    height: 60px;
    box-sizing: border-box;
    padding: 8px 16px;

    .bottomLeft {
      font-size: 14px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #020e1a;
      line-height: 20px;
    }

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

      .sum {
        font-size: 14px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #6c737a;
        line-height: 20px;
      }

      .sumPrice {
        font-size: 12px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #ff6219;
        line-height: 20px;
      }

      .sunNumber {
        font-size: 20px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #ff6219;
        line-height: 20px;
      }

      .submitBtn {
        font-size: 16px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #ffffff;
        line-height: 22px;
        padding: 9px 28px;
        background: #1890ff;
        border-radius: 4px;
        margin-left: 4px;
      }
    }

    .deleteBtn {
      font-size: 16px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #1890ff;
      line-height: 22px;
      padding: 9px 38px;
      background: #e7f3ff;
      border-radius: 4px;
    }
  }

  .addressPopupBox {
    width: 100%;
    height: 60vh;
    background-color: #fff;
    box-sizing: border-box;
    padding: 16rpx;
    z-index: 999999;

    .addressPopupTitle {
      font-family: PingFangSC, PingFang SC;
      font-weight: 600;
      font-size: 32rpx;
      color: #020e1a;
      line-height: 40rpx;
      text-align: left;
      font-style: normal;
      display: block;
      text-align: center;
    }

    .addressList {
      margin-top: 24rpx;
      width: 100%;
      height: calc(60vh - 250rpx);
      overflow-y: auto;

      .addressItem {
        width: 100%;
        padding: 16rpx 0;
        box-sizing: border-box;
        border-bottom: 1px solid #f6f6f6;

        .addressItemTop {
          width: 100%;
          display: flex;
          align-items: center;
          justify-content: space-between;

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

            .addressText {
              font-size: 28rpx;
              display: inline-block;
              width: 70vw;
              text-overflow: ellipsis;
              white-space: nowrap;
              overflow: hidden;
            }
          }

          .itemTopRight {
            .pickerImg {
              width: 18px;
              height: 18px;
            }
          }
        }

        .addressItemBottom {
          width: 100%;
          margin-top: 8rpx;
          box-sizing: border-box;
          padding-left: 64rpx;
          color: #9fa3a8;
          font-size: 24rpx;
        }
      }
    }

    .addressList::-webkit-scrollbar {
      display: none;
    }

    .btn {
      height: 88rpx;
      width: 90%;
      line-height: 88rpx;
      background: linear-gradient(to right, #1f1f1f, #62605f);
      color: #f0dccf;
      text-align: center;
      font-size: 30rpx;
      position: fixed;
      bottom: 32rpx;
      transform: translateX(-50%);
      left: 50%;
      border-radius: 12rpx;
    }
  }
}
</style>
