<template>
  <view class="container">
    <view class="top-state u-font24 u-00321E">
      <!--待付款-->
      <view class="obligation" v-if="payment_status == 0">
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">{{
              close_mode == 0 ? "待付款" : "订单已关闭"
            }}</view>
            <view class="u-flex u-font26" v-if="close_mode == 0">
              请在
              <uni-countdown
                class="uni-countdown-class"
                :backgroundColor="'none'"
                :color="'#3775F6'"
                :splitorColor="'#3775F6'"
                :show-day="time2[0] > 0"
                :day="time2[0]"
                :hour="time2[1]"
                :minute="time2[2]"
                :second="time2[3]"
              ></uni-countdown>
              内完成支付，超时订单将自动关闭
            </view>
            <view class="u-flex u-font22" v-if="close_mode == 1"
              >原因：主动取消</view
            >
            <view class="u-flex u-font22" v-if="close_mode == 2"
              >原因：商家撤销关闭</view
            >
            <view class="u-flex u-font22" v-if="close_mode == 3"
              >原因：支付过期关闭</view
            >
          </view>
        </view>
      </view>
      <!-- 待成团 -->
      <view
        class="refund-underway obligation"
        v-if="(status == 0 || status == 1) && payment_status > 0"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-flex-center-sb">
              <view class="u-font32 u-bold">待成团</view>
              <view class="u-font26 u-flex-center-sb">
                <uni-countdown
                  :backgroundColor="'none'"
                  :color="'#3775F6'"
                  :splitorColor="'#3775F6'"
                  :show-day="time1[0] > 0"
                  :day="time1[0]"
                  :hour="time1[1]"
                  :minute="time1[2]"
                  :second="time1[3]"
                >
                </uni-countdown>
                <view>结束拼团</view>
              </view>
            </view>
            <view class="u-flex u-font26">
              还差
              <text class="u-FF0000">{{ groupNumber }}</text>
              人拼团成功
            </view>
          </view>
        </view>
      </view>
      <!-- 建团失败 -->
      <view class="refund-underway obligation" v-if="status == 3">
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">拼团失败</view>
            <view class="u-flex u-font26">失败原因：店长未支付</view>
          </view>
        </view>
      </view>
      <!-- 建团失败 -->
      <view
        class="refund-underway obligation"
        v-if="status == 4 && payment_status == -2"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">拼团失败，已退款</view>
            <view class="u-flex u-font26"
              >退款金额24小时原路退回您的支付账户</view
            >
          </view>
        </view>
      </view>
      <!--等待商家发货-->
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == 1"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">待发货</view>
            <view class="u-flex u-font26"
              >您的订单已经支付完成，正在等待发货</view
            >
          </view>
        </view>
      </view>

      <!--商家已发货-->
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == 2"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">待收货</view>
            <view class="u-flex u-font26">
              您的快递待收货
              <text v-if="receipt_expire_time > 0"
                >，还剩{{ $mUtil.patTime(receipt_expire_time) }}自动确认</text
              >
            </view>
          </view>
        </view>
      </view>

      <!--等待确认提货-->
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == 3"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">待提货</view>
            <view class="u-flex u-font26">
              您的商品可自提
              <text v-if="receipt_expire_time > 0"
                >，还剩{{ $mUtil.patTime(receipt_expire_time) }}过期</text
              >
            </view>
          </view>
        </view>
      </view>
      <!--交易成功-->
      <!-- <view class="refund-underway" v-if="payment_status==4">
				<view class="u-font32 u-bold">交易成功</view>
			</view> -->
      <view
        class="obligation"
        v-if="status == 2 && payment_status == 4 && !end"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">待评价</view>
            <view class="u-flex u-font26"
              >您的订单已签收，请评价一下商品，剩{{
                $mUtil.patTime(last_comment_time)
              }}自动评价
            </view>
          </view>
        </view>
      </view>
      <!--待评价-->
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == 4 && end"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + imgUrl"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">已完成</view>
            <view class="u-flex u-font26">您的订单已完成，祝你购物愉快</view>
          </view>
        </view>
      </view>
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == 5"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font28">已完成</view>
            <view class="u-flex u-font26">您的订单已完成，祝你购物愉快</view>
          </view>
        </view>
      </view>
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == -1"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">退款中</view>
            <view class="u-flex u-font26">您的订单在退款中</view>
          </view>
        </view>
      </view>

      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == -2"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">退款完成</view>
            <view class="u-flex u-font26"
              >您的订单已完成退款，祝您生活愉快</view
            >
          </view>
        </view>
      </view>
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == -3"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">退款退货维权中</view>
            <view class="u-flex u-font26">您的订单在退款退货维权中</view>
          </view>
        </view>
      </view>
      <view
        class="refund-underway obligation"
        v-if="status == 2 && payment_status == -4"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">退款退货完成</view>
            <view class="u-flex u-font26"
              >您的订单已完成退款退货完成，祝您生活愉快</view
            >
          </view>
        </view>
      </view>
      <view
        class="refund-underway obligation"
        v-if="status == 4 && payment_status == 1"
      >
        <view class="u-flex-center u-flex1">
          <image class="timeImg" :src="imgUrl + '/time.png'"></image>
          <view class="u-flex1">
            <view class="u-font32 u-bold">拼团失败,未退款</view>
            <view class="u-flex u-font26">您的订单拼团失败,未退款</view>
          </view>
        </view>
      </view>
    </view>
    <view v-if="address">
      <ldAddress :value="address"></ldAddress>
    </view>
    <view v-else>
      <view
        class="u-flex-column-center u-bg-fff"
        v-if="status == 2 && payment_status == 3"
      >
        <text class="u-font26 u-999 u-mt15">出示数字码向店长核销</text>
        <view class="u-flex-center u-mt15">
          <text class="u-font40 u-333 u-bold">{{ pickCode }}</text>
          <text class="u-font28 u-666 u-ml20" @click="copy(pickCode)"
            >复制</text
          >
        </view>
      </view>
      <ldAddresszt :value="addresszt"></ldAddresszt>
    </view>

    <view
      class="pabox"
      v-show="orderListPay.length > 0"
      v-for="item in orderListPay"
      :key="item.id"
    >
      <ldshop
        :shopStatus="shopStatus"
        :value="item.source_shop_name"
        :proxy="item.proxy"
      ></ldshop>
      <view class="u-border-one-one u-mt20"></view>
      <view v-for="items in item.child_order_list" :key="items.id">
        <ldgoods :value="items"></ldgoods>
      </view>
      <view class="u-font28 u-1A1A1A u-mt30 bg-fff">
        <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view>商品金额</view>
          <view class="u-999 u-font3">¥ {{ item.original_goods_amount }}</view>
        </view>

        <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view>运费</view>
          <view class="u-999 u-font30">+{{ item.real_freight }}元</view>
        </view>
        <view
          class="u-flex-center-sb u-border-one-one pt-pb25"
          v-if="item.first_order_reduced > 0"
        >
          <view>
            首单优惠
            <text class="u-999 u-font24"></text>
          </view>
          <view class="u-999 u-font30">-¥ {{ item.first_order_reduced }}</view>
        </view>
        <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view>拼团折扣</view>
          <view class="u-999 u-font30">-¥ {{ item.discount_amount }}</view>
        </view>
        <!--   <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view class="u-flex-center-sb"><text class="iconfont3 final_consumption_value-icon">&#xe603;</text>消费补贴</view>

          <view class="u-999 u-font30">
              <rich-text :nodes="$mUtil.isToFixed(final_consumption_value, 2)"></rich-text>
          </view>
        </view> -->

        <view
          class="u-flex-center u-border-one-one pt-pb25"
          style="justify-content: flex-end"
        >
          <view class="">共{{ item.goods_number }}件商品，小计</view>
          <view class="u-bold u-FF0000">
            <rich-text
              :nodes="$mUtil.priceBigSmall(item.total_amount)"
            ></rich-text>
          </view>
        </view>
        <view class="u-flex-column-start pt-pb25">
          <view>购买备注</view>
          <view class="boxTextarea">{{
            item.user_remark ? item.user_remark : "无"
          }}</view>
        </view>
      </view>
    </view>

    <view class="pabox" v-if="orderList.length > 0">
      <ldshop :shopStatus="shopStatus" :value="source_shop_name"></ldshop>
      <view class="u-border-one-one u-mt20"></view>
      <view v-for="(item, index) in orderList" :key="item.id">
        <ldgoods
          :value="item"
          @parentevaluation="parentevaluation"
          :keys="index"
        ></ldgoods>
      </view>
      <view class="u-font28 u-1A1A1A u-mt30 bg-fff">
        <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view>商品金额</view>
          <view class="u-999 u-font3">¥ {{ original_goods_amount }}</view>
        </view>

        <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view>运费</view>
          <view class="u-999 u-font30">+{{ real_freight }}元</view>
        </view>

        <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view>拼团折扣</view>

          <view class="u-999 u-font30">-¥ {{ discount_amount }}</view>
        </view>
        <!--  <view class="u-flex-center-sb u-border-one-one pt-pb25">
          <view><text class="iconfont3 final_consumption_value-icon">&#xe603;</text>消费补贴</view>

          <view class="u-999 u-font30">
              <rich-text :nodes="$mUtil.isToFixed(final_consumption_value, 2)"></rich-text>
              </view>
        </view> -->
        <view
          class="u-flex-center-sb u-border-one-one pt-pb25"
          v-if="first_order_reduced > 0"
        >
          <view>
            首单优惠
            <text class="u-999 u-font24"></text>
          </view>
          <view class="u-999 u-font30">-¥ {{ first_order_reduced }}</view>
        </view>
        <view
          class="u-flex-center u-border-one-one pt-pb25"
          style="justify-content: flex-end"
        >
          <view class="">共{{ goodNum }}件商品，小计</view>
          <view class="u-bold u-FF0000">
            <rich-text :nodes="$mUtil.priceBigSmall(total_amount)"></rich-text>
          </view>
        </view>
        <view class="u-flex-column-start pt-pb25">
          <view>购买备注</view>
          <view class="boxTextarea">{{
            user_remark ? user_remark : "无"
          }}</view>
        </view>
      </view>
    </view>

    <view class="upb120">
      <view class="u-font28 u-1A1A1A u-mt30 bg-fff">
        <view class="u-flex-center-sb u-border-one u-plr30 pt-pb25">
          <view>平台优惠</view>
          <view v-if="platform_coupon_sharing != 0" class="u-999"
            >-¥{{ platform_coupon_sharing }}</view
          >
          <view v-else class="u-999">无优惠</view>
        </view>
        <view class="u-flex-center-sb u-plr30 pt-pb25">
          <view>支付金额</view>
          <view class="u-FF0000 u-font32 u-bold">
            <rich-text :nodes="$mUtil.priceBigSmall(total_amount)"></rich-text>
          </view>
        </view>
      </view>
      <view class="u-font28 u-1A1A1A u-mt30 bg-fff">
        <view class="u-flex-center-sb u-plr30 pt-pb25">
          <view>订单编号</view>
          <view class="u-999 u-font3">{{ order_code }}</view>
        </view>
        <view class="u-flex-center-sb u-plr30 pt-pb25">
          <view>下单时间</view>
          <view class="u-999">{{ format_order_time }}</view>
        </view>
        <view
          class="u-flex-center-sb u-plr30 pt-pb25"
          v-if="payment_status >= 1 || payment_status < 0"
        >
          <view>支付时间</view>
          <view class="u-999">{{ format_pay_time || "-" }}</view>
        </view>
        <view
          class="u-flex-center-sb u-plr30 pt-pb25"
          v-if="payment_status >= 1 || payment_status < 0"
        >
          <view>支付方式</view>
          <view class="u-999" v-if="pay_mode == 0">-</view>
          <view class="u-999" v-if="pay_mode == 1">微信</view>
          <view class="u-999" v-if="pay_mode == 2">支付宝</view>
        </view>
        <view
          class="bg-fff u-mt30 u-plr30 pt-pb25 u-flex-center-sb"
          v-if="status < 3 && groupNumber > 0"
          @click="openPopup"
        >
          <view class="u-flex-center">
            <image
              class="u-avatar92"
              v-if="teamInfo.head_photo"
              :src="teamInfo.head_photo"
            ></image>
            <image
              class="u-avatar92"
              v-else
              src="/static/default-avatar.png"
              mode=""
            ></image>
            <view class="u-ml30">
              <view class="u-font28 u-1A1A1A u-text-width-two">
                拼主：{{ teamInfo.nickname || teamInfo.mobile }}</view
              >
              <view class="u-mt5 u-font24 u-999">
                还差
                <text class="u-FF0000">{{ groupNumber }}</text>
                人拼成
              </view>
            </view>
          </view>
          <view class="iconfont u-999">&#xe6c7;</view>
        </view>
        <view
          class="u-flex-center-sb u-plr30 pt-pb25"
          v-if="payment_status >= 2 && address"
        >
          <view>配送方式</view>
          <view class="u-999">{{ freighMoney || "-" }}</view>
        </view>

        <view
          class="u-flex-center-sb u-plr30 pt-pb25"
          v-if="payment_status >= 2"
        >
          <view>发货时间</view>
          <view class="u-999">{{ format_last_ship_time || "-" }}</view>
        </view>

        <view
          class="u-flex-center-sb u-plr30 pt-pb25"
          v-if="payment_status >= 4"
        >
          <view>收货时间</view>
          <view class="u-999">{{ format_last_receipt_time || "-" }}</view>
        </view>
        <!--       <view
          class="u-flex-center-sb u-plr30 pt-pb25"
          v-if="payment_status >= 4"
        >
          <view>获得积分</view>
          <view class="u-999">可获得{{ final_consumption_value }}积分</view>
        </view> -->
      </view>
    </view>
    <!--待付款-->
    <view
      class="bg-fff u-mt30 btn u-flex"
      v-if="payment_status == 0 && close_mode == 0 && !end"
    >
      <button class="cancel-btn u-br-999 u-999" @click="cancelOrder">
        取消订单
      </button>
      <button
        class="pay-btn u-FFF"
        @click="goPay(orderid, total_amount, expired_pay_time)"
      >
        去付款
      </button>
    </view>
    <!-- <view class="bg-fff u-mt30 u-plr30 ptb22 btn u-flex-column-end" v-if="payment_status==0&&close_mode==1">
			<view class="u-flex-center u-mr25">
				<button class="u-order-btn u-br-999 u-999 ">再次购买</button>
			</view>
		</view>
		<view class="bg-fff u-mt30 u-plr30 ptb22 btn u-flex-column-end" v-if="payment_status==0&&close_mode==2">
			<view class="u-flex-center u-mr25">
				<button class="u-order-btn u-br-999 u-999 ">再次购买</button>
			</view>
		</view>
		<view class="bg-fff u-mt30 u-plr30 ptb22 btn u-flex-column-end" v-if="payment_status==0&&close_mode==3">
			<view class="u-flex-center u-mr25">
				<button class="u-order-btn u-br-999 u-999 ">再次购买</button>
			</view>
		</view> -->
    <!--等待商家发货-->
    <view
      class="bg-fff u-mt30 u-plr30 ptb22 btn u-flex-column-end"
      v-if="payment_status == 1 && !end"
    >
      <view class="u-flex-center u-mr25">
        <!-- <button class="u-order-btn u-br-999 u-999 " @click="goRefundType(1)">申请售后</button> -->
        <button class="u-order-btn u-br-999 u-999" @click="goPhone(mobile)">
          联系客服
        </button>
        <!-- <button class="u-order-btn u-br-f00 u-FF0000 " v-if="shipment_mode==0" @click="changeAddress">修改地址</button> -->
      </view>
    </view>
    <!--商家已发货-->
    <view
      class="bg-fff u-mt30 u-plr30 btn ptb22 u-flex-column-end"
      v-if="payment_status == 2 && !end"
    >
      <view class="u-flex-center">
        <button class="u-order-btn u-br-999 u-999" @click="goLogistics">
          查看物流
        </button>
        <button
          class="u-order-btn u-br-f00 u-FF0000 u-mr25"
          @click="sureGetOrder"
        >
          确认收货
        </button>
      </view>
    </view>
    <!-- <view class="bg-fff u-mt30 u-plr30 ptb22 btn u-flex-column-end" v-if="payment_status==5">
			<view class="u-flex-center u-mr25">
				<button class="u-order-btn u-br-999 u-999 " @click="goRefundType(2)">申请售后</button>
			</view>
		</view> -->
    <!--等待确认提货-->
    <!-- <view class="bg-fff u-mt30 u-plr30 ptb22 btn u-flex-column-end"  v-if="payment_status==5">
				<button class="u-order-btn u-br-999 u-999 u-mr30">再次购买</button>
		</view> -->
    <!--已付款，待发货！-->
    <!-- <view class="bg-fff u-mt30 pt28-pb24 btn u-plr30">
				<button class="u-btn-two u-bg-00321E u-FFF">查看物流</button>
		</view> -->
    <!--申请退货，商家同意退货-->
    <!-- <view class="bg-fff u-mt30 u-plr30 ptb22 btn u-flex-column-end"   v-if="payment_status==8||payment_status==10">
				<button class="u-order-btn u-br-999 u-999 u-mr30" @click="logisticsOpen()">填写物流信息</button>
		</view> -->

    <!--邀请拼团-->
    <uniPopup type="top" ref="topUniPopup">
      <view class="u-bg-fff group-booking-popup">
        <view class="u-plr30">
          <view class="time">
            <uni-countdown
              style="text-align: center"
              :backgroundColor="'none'"
              :color="'#3775F6'"
              :splitorColor="'#3775F6'"
              :show-day="time1[0] > 0"
              :day="time1[0]"
              :hour="time1[1]"
              :minute="time1[2]"
              :second="time1[3]"
            ></uni-countdown>
          </view>
          <view class="u-flex-column-center" style="margin-top: 5rpx">
            <view class="u-flex mt42">
              <view class="initiator" v-for="item in team" :key="item.id">
                <image
                  v-if="index < 3 && item.head_photo"
                  class="u-avatar92"
                  :src="item.head_photo"
                >
                </image>
                <image
                  v-else
                  class="u-avatar92"
                  src="/static/default-avatar.png"
                  mode=""
                ></image>
                <view class="tag u-font24" v-if="index < 3 && item.leader"
                  >拼主</view
                >
              </view>
              <view class="tar u-ml10">?</view>
            </view>
          </view>
          <view class="u-mt50 u-font28 u-1A1A1A"
            >还差{{ groupNumber }}人，赶快邀请好友来拼单</view
          >
          <view class="invite" @click="share"
            ><button open-type="share" class="u-btn-two u-FFF">
              邀请好友拼单
            </button></view
          >
        </view>
      </view>
    </uniPopup>

    <!--弹窗评价-->
    <uniPopup type="bottom" ref="uniPopup">
      <view class="popup">
        <view class="u-flex-sb u-plr30">
          <view class="u-flex">
            <image class="pic" :src="choseGoods.goods_img"></image>
            <view class="u-ml30 wt378">
              <view class="u-1A1A1A u-font28">{{
                choseGoods.goods_title
              }}</view>
              <view
                class="u-999 u-font22 u-mt10"
                v-if="choseGoods.sku_set_name"
              >
                规格：{{ choseGoods.sku_set_name }}</view
              >
              <view class="u-mt10 u-flex-center">
                <view class="u-FF0000 u-font32">
                  <rich-text
                    :nodes="$mUtil.priceBigSmall(choseGoods.sale_price)"
                  ></rich-text>
                </view>
                <text class="u-ml10 u-999 u-font24"
                  >x {{ choseGoods.number }}</text
                >
              </view>
            </view>
          </view>
          <view class="iconfont u-999" @click="close">&#xe607;</view>
        </view>
        <view class="u-bg-fff u-plr30 u-mt5">
          <view class="pt-pb25 u-font28 u-flex-center">
            <text>总体评价：</text>
            <view>
              <text
                v-for="(item, index) in 5"
                :key="index"
                @click="startNum(index)"
                class="iconfont u-font34"
                :class="gradeNum > item ? 'grade-active' : 'u-B3B3B3'"
              >
                &#xe60a;
              </text>
            </view>
          </view>
          <view class="u-font26">
            <textarea
              class="u-font26"
              @input="textareaInput"
              :value="textareaVal"
              placeholder="请输入文字评价"
              placeholder-class="cccfont"
            ></textarea>
          </view>
          <view class="u-mt25 u-font30">添加图片</view>
          <view class="u-mt25">
            <uploadImg
              imgCount="6"
              :type="upimgtype"
              :imgArr="imgArray"
              url=""
              @result="resultUrl"
              @delImg="delImg"
            >
            </uploadImg>
          </view>
          <view class="evaluate-submit" @click="submitCom"
            ><button class="u-btn-two">确认提交</button></view
          >
        </view>
      </view>
    </uniPopup>
    <!--页面加载动画-->
    <ldLoading isFullScreen :active="loading"></ldLoading>
  </view>
</template>

<script setup>
import { ref, reactive, onMounted } from 'vue';
import { onLoad, onShareAppMessage } from '@dcloudio/uni-app';

// 响应式数据
const upimgtype = ref("comment");
const final_consumption_value = ref(0);
const payment_status = ref(null);
const expired_pay_time = ref(null);
const time2 = ref([0, 0, 0, 0]);
const total_amount = ref(null);
const orderid = ref(null);
const goods_amount = ref(null);
const first_order_reduced = ref(0);
const real_freight = ref(null);
const discount_amount = ref(null);
const pay_mode = ref(null);
const order_code = ref(null);
const format_order_time = ref(null);
const format_pay_time = ref(null);
const format_last_ship_time = ref(null);
const format_last_receipt_time = ref(null);
const receipt_expire_time = ref("");
const freighMoney = ref(null);
const goodNum = ref(null);
const shipment_mode = ref(0);
const pickCode = ref("");
const original_goods_amount = ref(null);
const total_reduced = ref(null);
const vipcode = ref("");
const shopStatus = ref(false);
const loading = ref(true);
const index = ref(0);
const mobile = ref("");
const end = ref(false);
const logImg = ref("");
const address = ref(null);
const addresszt = ref(null);
const last_ship_time = ref(0);
const last_receipt_time = ref(0);
const orderList = ref([]);
const orderListPay = ref([]);
const source_shop_name = ref("");
const user_remark = ref("");
const payStatus = ref("");
const goodsid = ref(null);
const choseGoods = ref({});
const textareaVal = ref("");
const upimg = ref([]);
const imgArray = ref([]);
const gradeNum = ref(0);
const close_mode = ref(0);
const marketing_type = ref(null);
const team = ref([]);
const teamInfo = ref(null);
const groupNumber = ref(0);
const status = ref(null);
const rights_status = ref(null);
const time1 = ref([0, 0, 0, 0]);
const activity_goods_id = ref(null);
const shop_id = ref(null);
const teamId = ref(null);
const isvisible = ref(false);
const imgUrl = ref(globalThis.$mConfig.staticUrl);
const platform_coupon_sharing = ref("");
const groupId = ref(null);

// 页面生命周期
onLoad((options) => {
  if (options.id) {
    orderid.value = options.id;
    payStatus.value = options.status;
    groupId.value = options.groupId;
  }
  if (payStatus.value == "pay") {
    orderDetail(orderid.value, groupId.value);
  }
  if (payStatus.value == "waitpay") {
    orderDetailPay(orderid.value);
  }
});

onShareAppMessage((res) => {
  if (res.from === "button") {
    // 来自页面内分享按钮
  }
  return {
    title: shareTitle.value,
    imageUrl: shareImg.value,
    path: `/pages/product/goods/puzzleGoods?id=${activity_goods_id.value}&Sshopid=${shop_id.value}&teamId=${teamId.value}`,
  };
});

// 方法定义
const share = () => {
  let user = uni.getStorageSync("personal");
  isvisible.value = true;

};

const openPopup = () => {
  // topUniPopup.value.open();
};

const copy = (code) => {
  uni.setClipboardData({
    data: code,
    success: () => {
      uni.showToast({
        title: "复制成功",
      });
    },
  });
};

const goPhone = (phone) => {
  if (phone) {
    uni.makePhoneCall({
      phoneNumber: phone,
    });
  }
};

const restCom = () => {
  textareaVal.value = "";
  gradeNum.value = 0;
};

const submitCom = () => {
  if (gradeNum.value == 0) {
    globalThis.$mUtil.toast("请评价星星");
  } else if (textareaVal.value == "") {
    globalThis.$mUtil.toast("请输入文字评价");
  } else {
    let imgs = "";
    if (upimg.value.length > 0) {
      imgs = upimg.value.join(",");
    } else {
      imgs = "";
    }
    let data = {
      chlid_order_id: goodsid.value,
      order_id: orderid.value,
      level: gradeNum.value,
      content: textareaVal.value,
      img: imgs,
    };
    globalThis.$http
      .post("/comment/orderGoods/savegeneralgoods", data)
      .then((res) => {
        if (res && res.code == 200) {
          globalThis.$mUtil.toast("评价成功");
          // uniPopup.value.close();
          setTimeout(() => {
            uni.reLaunch({
              url: "/pages/order/orderList/orderList",
            });
          }, 1000);
        }
      });
  }
};

const textareaInput = (e) => {
  textareaVal.value = e.detail.value;
};

const resultUrl = (e) => {
  if (e) {
    upimg.value = e;
  }
};

const delImg = (e) => {
  if (e) {
    upimg.value = e;
  }
};

const startNum = (index) => {
  gradeNum.value = index * 1 + 1;
};

const parentevaluation = (data) => {
  choseGoods.value = orderList.value[data.keys];
  goodsid.value = data.id;
  // uniPopup.value.open();
};

const sureGetOrder = () => {
  uni.showModal({
    title: "提示",
    content: "确定已经收到了该商品？",
    success: (res) => {
      if (res.confirm) {
        globalThis.$http
          .post("/order/receipt", {
            order_id: orderid.value,
          })
          .then((res) => {
            if (res && res.code == 200) {
              globalThis.$mUtil.toast("收货成功");
              setTimeout(() => {
                uni.reLaunch({
                  url: "/pages/order/orderList/orderList",
                });
              }, 1000);
            }
          });
      }
    },
  });
};

const cancelOrder = () => {
  uni.showModal({
    title: "提示",
    content: "确定取消该订单吗？",
    success: (res) => {
      if (res.confirm) {
        globalThis.$http.post("/order/cancel-pay/" + orderid.value).then((res) => {
          if (res && res.code == 200) {
            globalThis.$mUtil.toast("取消成功");
            setTimeout(() => {
              uni.reLaunch({
                url: "/pages/order/orderList/orderList",
              });
            }, 1000);
          }
        });
      }
    },
  });
};

const orderDetail = (id, groupId) => {
  globalThis.$http.get("/groupbuy/team/teamorder/" + groupId).then((res) => {
    if (res && res.code == 200) {
      status.value = res.data.team.status;
      team.value = res.data.member_infos;
      teamInfo.value = team.value.filter((val) => val.leader == true)[0];
      console.log(teamInfo.value);
      groupNumber.value =
        res.data.team.group_person_number - team.value.length;
      teamId.value = res.data.team.id;
      if (res.data.order)
        time1.value = globalThis.$mUtil
          .countDown(Math.floor(res.data.team.end_time / 1000))
          .split(":")
          .map((val) => Number(val));
    }
  }),
    globalThis.$http.get("/order/info/" + id).then((res) => {
      loading.value = false;
      if (res && res.code == 200) {
        let target = res.data;

        mobile.value = target.shop.customer_service_phone;
        final_consumption_value.value = target.final_consumption_value;
        address.value = target.receipt;
        addresszt.value =
          target.shipment_mode == 1
            ? target.self_take.self_pickup_address
            : target.shop;
        orderList.value = target.child_order_list;
        source_shop_name.value = target.source_shop_name;
        user_remark.value = target.user_remark;
        total_amount.value = target.total_amount;
        vipcode.value = target.user_role_name;
        goods_amount.value = target.goods_amount;
        original_goods_amount.value = target.original_goods_amount;
        total_reduced.value = target.total_reduced;
        first_order_reduced.value = target.first_order_reduced;
        real_freight.value = target.real_freight;
        discount_amount.value = target.discount_amount;
        pay_mode.value = target.pay_mode;
        order_code.value = target.order_code;
        format_order_time.value = target.format_order_time;
        format_pay_time.value = target.format_pay_time;
        format_last_ship_time.value = target.format_last_ship_time;
        format_last_receipt_time.value = target.format_last_receipt_time;
        last_ship_time.value = target.last_ship_time;
        last_receipt_time.value = target.last_receipt_time;
        goodNum.value = target.goods_number;
        logImg.value = target.child_order_list[0].goods_img;
        last_comment_time.value =
          target.child_order_list[0].last_comment_time;
        shipment_mode.value = target.shipment_mode;
        end.value = target.end;
        rights_status.value = target.rights_status;
        marketing_type.value = target.marketing_type;
        activity_goods_id.value =
          target.child_order_list[0].activity_goods_id;
        shop_id.value = target.child_order_list[0].shop_id;
        platform_coupon_sharing.value = target.platform_coupon_sharing;
        if (target.order_package) {
          receipt_expire_time.value =
            target.order_package.receipt_expire_time;
          if (target.order_package.express) {
            freighMoney.value = target.order_package.express.express_name;
          }
          if (target.order_package.pickup) {
            pickCode.value = target.order_package.pickup.verification_code;
          }
        }

        if (target.rights_type == 0 && target.rights_status == 0) {
          if (target.transaction_status == 1) {
            payment_status.value = 1;
          }
          if (target.transaction_status == 3) {
            if (target.shipment_mode == 0) {
              payment_status.value = 2;
            } else {
              payment_status.value = 3;
            }
          }

          if (
            target.transaction_status == 5 &&
            target.comment_status == 0
          ) {
            payment_status.value = 4;
          }

          if (target.transaction_status == 5 && !target.end) {
            payment_status.value = 5;
          }
        }

        if (target.transaction_status == 6) {
          payment_status.value = 6;
        }

        if (target.rights_type == 1 && target.rights_status == 1) {
          payment_status.value = -1;
        }
        if (target.rights_type == 1 && target.rights_status == 2) {
          payment_status.value = -2;
        }
        if (target.rights_type == 2 && target.rights_status == 1) {
          payment_status.value = -3;
        }
        if (target.rights_type == 2 && target.rights_status == 2) {
          payment_status.value = -4;
        }
      }
    });
};

const orderDetailPay = (id) => {
  globalThis.$http.get("/pay/order/sale-detail/" + id).then((res) => {
    loading.value = false;
    if (res && res.code == 200) {
      let target = res.page.order_list[0];
      address.value = res.page.receipt;
      addresszt.value =
        res.page.shipment_mode == 1
          ? res.page.self_take.self_pickup_address
          : res.page.self_take_shop;
      orderListPay.value = res.page.order_list;
      if (res.page.pay_order.payment_status != 5) {
        payment_status.value = 0;
      } else {
        payment_status.value = res.page.pay_order.payment_status;
      }

      time2.value = globalThis.$mUtil
        .countDown(
          res.page.pay_order.expired_pay_time / 1000,
          res.page.pay_order.now_millis
        )
        .split(":")
        .map((val) => Number(val));

      total_amount.value = res.page.pay_order.total_amount;
      close_mode.value = res.page.pay_order.close_mode;
      user_remark.value = target.user_remark;
      pay_mode.value = target.pay_mode;
      order_code.value = target.order_code;
      format_order_time.value = target.format_order_time;
      format_pay_time.value = target.format_pay_time;
      format_last_ship_time.value = target.format_last_ship_time;
      format_last_receipt_time.value = target.format_last_receipt_time;
    }
  });
};

const close = () => {
  // uniPopup.value.close();
  restCom();
};

const goPay = (id, total_amount, expired_pay_time) => {
  uni.navigateTo({
    url:
      "../../order/pay?id=" +
      id +
      "&total_amount=" +
      total_amount +
      "&expired_pay_time=" +
      expired_pay_time +
      "&type=group",
  });
};


const goLogistics = () => {
  uni.navigateTo({
    url:
      "../logistics?id=" +
      orderid.value +
      "&num=" +
      goodNum.value +
      "&img=" +
      logImg.value +
      "&type=1",
  });
};

const shareTitle = ref("");
const shareImg = ref("");
const last_comment_time = ref("");
</script>

<style scoped lang="scss">
page {
  background-color: #f5f5f5;
}

.uni-countdown-class {
  height: 32rpx;

  ::v-deep.uni-countdown__splitor {
    margin-top: -6rpx;
  }
}

.cccfont {
  font-size: 26rpx;
  color: #eee;
}

.grade-active {
  color: #ff5112;
}

.u-B3B3B3 {
  color: #b3b3b3;
}

.user_remark {
  background-color: #fff;
  padding: 30rpx;
  border-top: 1px solid #eee;
}

.boxTextarea {
  width: 686rpx;
  border: 1px solid #ededed;
  border-radius: 20rpx;
  background-color: #fafafa;
  padding: 20rpx;
  box-sizing: border-box;
  margin-top: 20rpx;
}

.pabox {
  background-color: #fff;
  padding: 30rpx 30rpx 0;
  margin-top: 30rpx;

  .final_consumption_value {
    color: #ff6600;
  }

  .final_consumption_value-icon {
    font-size: 40rpx;
    color: #ff9651;
  }
}

.upb120 {
  padding-bottom: 140rpx;
}

.bg-fff {
  background-color: #ffffff;
}

.ptb22 {
  padding-top: 22rpx;
  padding-bottom: 22rpx;
}

.pt-pb25 {
  padding-top: 25rpx;
  padding-bottom: 25rpx;
}

.pt28-pb24 {
  padding-top: 28rpx;
  padding-bottom: 24rpx;
}

.iconfont58 {
  font-size: 58rpx;
}

.mt44 {
  margin-top: 44rpx;
}

.ml38 {
  margin-left: 38rpx;
}

.ml82 {
  margin-left: 82rpx;
}

.wt378 {
  width: 378rpx;
}

.wt504 {
  width: 504rpx;
}

.u-br-999 {
  border: 1px solid #999999;
}

.u-br-f00 {
  border: 1px solid #ff0000;
}

.bg-00321e {
  background: #0b844a;
}

.account-paid {
  padding: 44rpx 0rpx;
}

.account-paid image {
  width: 202rpx;
  height: 124rpx;
}

.btn {
  width: 100%;
  position: fixed;
  bottom: 0rpx;
  padding: 22rpx 0rpx;
}

.cancel-btn {
  margin-left: auto;
}

.cancel-btn,
.pay-btn {
  width: 202rpx;
  height: 70rpx;
  line-height: 70rpx;
  border-radius: 35px;
  font-size: 28rpx;
  margin-right: 30rpx;
}

.pay-btn {
  background: #fa6138;
}

.top-state {
  background-color: #f2f5fc;
  color: #fa6138;
  padding: 35rpx 30rpx;

  // 待支付
  .obligation {
    display: flex;
    justify-content: space-between;

    .timeImg {
      display: none;
      width: 70rpx;
      height: 54rpx;
      margin-right: 40rpx;
    }
  }
}

.address {
  background-color: #ffffff;
  padding-top: 72rpx;

  .linkman {
    padding-bottom: 34rpx;
  }

  .remark {
    padding: 35rpx 0rpx 35rpx 50rpx;
  }
}

//弹窗填写物流信息
.logisticsPopup {
  background-color: #ffffff;
  width: 100%;
  border-radius: 20rpx;

  .pd {
    padding: 15rpx 98rpx 68rpx;
  }

  input {
    height: 70rpx;
    line-height: 70rpx;
    border: 1rpx solid #cccccc;
    border-radius: 15rpx;
    padding-left: 8rpx;
    color: #999999;
  }

  .icon {
    margin-top: -65rpx;
  }

  .pl-pr {
    padding-left: 74rpx;
  }

  button {
    margin-top: 66rpx;
    background-color: #01331f;
    width: 345rpx;
  }
}

.group-booking-popup {
  //margin-top: 128rpx;
  padding-top: 40rpx;
  padding-bottom: 65rpx;
  text-align: center;

  .initiator {
    position: relative;

    .tag {
      position: absolute;
      top: -20rpx;
      left: -30rpx;
      right: 0;
      background-color: #fa6138;
      border: 4rpx solid #ffffff;
      border-radius: 20rpx;
      width: 62rpx;
      height: 40rpx;
      line-height: 40rpx;
      text-align: center;
      color: #dac6a1;
    }
  }
}

.tar {
  border: 2rpx dashed #999;
  width: 92rpx;
  height: 92rpx;
  line-height: 92rpx;
  border-radius: 50rpx;
}

.time {
  margin-top: 38rpx;
  width: 148rpx;
  height: 48rpx;
  margin-left: 40%;
  background: #f5f5f5;
  border-radius: 10rpx;
}

.invite {
  margin-top: 38rpx;

  button {
    background-color: #fa6138;
  }
}

// 弹窗评价
.popup {
  background-color: #f5f5f5;
  width: 100%;
  border-radius: 18rpx 18rpx 0px 0px;
}

.u-flex-sb {
  display: flex;
  justify-content: space-between;
  padding-top: 30rpx;
  padding-bottom: 30rpx;
  background-color: #ffffff;
  border-radius: 18rpx 18rpx 0px 0px;

  .pic {
    width: 155rpx;
    height: 155rpx;
  }
}

textarea {
  width: 100%;
  height: 210rpx;
  opacity: 0.66;
  border: 1rpx solid #e6e6e6;
  border-radius: 8rpx;
  padding-left: 22rpx;
  padding-top: 14rpx;
  box-sizing: border-box;
}

.evaluate-submit {
  margin-top: 58rpx;
  padding-bottom: 25rpx;
}

.evaluate-submit button {
  background-color: #fa6138;
  color: #ffffff;
}
</style>