<template>
  <view class="homeMain">
    <view class="minTopBox" v-if="loginType === 'min'" :style="{
      height: menu.bottom + 8 + 'px',
    }">
      <view class="topContent" :style="{ paddingTop: menu.top + 'px', height: menu.height + 'px' }">
        <image class="fixedIcon" src="/static/home/newFixed.svg" />
        <view class="selectServiceBox" @click="handleGoServiceList(1)">
          <span class="serviceName">{{
            serverPart.SERVERPART_NAME || ""
          }}</span>
          <image class="serviceIcon" src="/static/home/newExpendIcon.svg" />
        </view>

        <view class="searchBox" @click="handleGoServiceList(2)">
          <image class="searchIcon" src="/static/home/newSearch.svg" />
          <span class="searchText">搜索周边</span>
        </view>
      </view>
    </view>
    <view class="appTopBox" v-else :style="{
      height: menu.top + 50 + 'px',
    }">
      <view class="topContent" :style="{ paddingTop: menu.top + 'px' }">
        <image class="fixedIcon" src="/static/home/newFixed.svg" />
        <view class="selectServiceBox" @click="handleGoServiceList(1)">
          <span class="serviceName">{{
            serverPart.SERVERPART_NAME || ""
          }}</span>
          <image class="serviceIcon" src="/static/home/newExpendIcon.svg" />
        </view>

        <view class="searchBox" @click="handleGoServiceList(2)">
          <image class="searchIcon" src="/static/home/newSearch.svg" />
          <span class="searchText">搜索周边</span>
        </view>
      </view>
    </view>

    <view class="newContent">
      <view class="topBanner">
        <image class="bannerImg" src="https://eshangtech.com/wanmeiyizhanImg/home/wanmeiyizhanNewIndex.png" />
      </view>

      <view style="box-sizing: border-box; padding: 0 32rpx">
        <!-- :style="{ marginTop: menu.bottom + 8 + 'px' }" -->
        <view class="funBox">
          <view class="funItem" v-for="(item, index) in funList" :key="index"
            :style="{ marginBottom: index <= 3 ? '32rpx' : '' }" @click="handleGoFun(item)">
            <image class="funItemIcon" :src="item.src" />
            <span class="funItemText">{{ item.label || "" }}</span>
          </view>
        </view>

        <scroll-view :scroll-x="true" class="tabBox">
          <view class="tabList">
            <view class="tabItem" v-for="(item, index) in tabList" :key="index" @click="handleChangeTab(item)">
              <view :class="selectTab === item.value ? 'title selectTitle' : 'title'
                ">{{ item.label || "" }}
              </view>
              <view :class="selectTab === item.value ? 'desc selectDesc' : 'desc'">{{ item.desc || "" }}
              </view>
            </view>
          </view>
        </scroll-view>

        <view v-if="chaegeBoxList && chaegeBoxList.length > 0" style="background-color: #fff; margin-top: 24rpx">
          <ChargeBox :showType="'horizontal'" :serviceAreaList="chaegeBoxList" pageType="scanCode" :showStore="true"
            :comeForm="'home'" :showPadding="true" />
        </view>

        <view class="carouselBox" @click="handleGoDiscovery" v-if="showBanner">
          <swiper class="swiperBox" scroll-x="true" autoplay="true" circular="true" interval="3000"
            @change="swiperChange($event, 'currentBan')" :current="currentBan">
            <swiper-item v-for="(image, i) in bannerList" :key="i">
              <image class="swiperImg" :src="image"></image>
            </swiper-item>
          </swiper>
        </view>

        <!-- 驿站美食 -->
        <view class="foodBox">
          <view class="foodTop">
            <view class="topLeft">
              <!-- <image class="foodTopIcon" /> -->
              <span class="stationFood">驿站美食</span>
              <span class="foodDesc">提前点餐 无需排队</span>
            </view>
            <view class="topRight" @click="handleGoFoodOrder">
              <span class="moreText">查看更多</span>
              <image class="rightArrow" src="/static/home/newRightRow.svg" />
            </view>
          </view>

          <scroll-view :scroll-x="true" class="foodContent">
            <view class="foodList">
              <view class="foodItemNew" v-for="(item, index) in foodList" :key="index" @click="handleGoFoodShop(item)">
                <view class="shopName">{{ item.MERCHANTS_NAME || "" }}</view>
                <!-- <view class="foodSrc" :style="{ backgroundImage: `url(${item.IMAGE_URL})` }"></view> -->
                <view class="foodSrcBox">
                  <image class="foodSrc" lazy-load="true" :src="item.IMAGE_URL" />
                  <!-- mode="aspectFit" -->
                </view>

                <view class="foodDetail">
                  <view class="foodName">{{ item.COMMODITY_NAME }}</view>
                  <!-- <view class="foodInfo">月售249 仅剩13份</view> -->
                  <view class="priceBox">
                    <view class="priceLeft">
                      <span class="price">
                        <span class="priceUnit">￥</span>
                        {{ item.COMMODITY_RETAILPRICE }}
                      </span>
                      <!-- <span class="priceOld">￥20.5</span> -->
                    </view>
                    <view class="priceRight">
                      进店
                      <!-- <image
                        class="addBtn"
                        src="/static/home/addShopButton.svg"
                      /> -->
                    </view>
                  </view>
                </view>
              </view>
            </view>
          </scroll-view>
        </view>

        <!-- 皖美特产 -->
        <view class="productBox">
          <view class="foodTop">
            <view class="topLeft">
              <!-- <image class="foodTopIcon" /> -->
              <span class="stationFood">皖美农品</span>
              <span class="foodDesc">本地特产 特色农品</span>
            </view>
            <view class="topRight" @click="handleGoFoodOrder">
              <span class="moreText">查看更多</span>
              <image class="rightArrow" src="/static/home/newRightRow.svg" />
            </view>
          </view>

          <scroll-view :scroll-x="true" class="foodContent">
            <view class="foodList">
              <!-- AllProductsList -->
              <view class="foodItemNew" v-for="(item, index) in mallList" :key="index" @click="goMall(item)">
                <!-- @click="handleGoFoodShop(item)" -->
                <!-- <view class="foodSrc" :style="{ backgroundImage: `url(${item.IMAGE_URL})` }"></view> -->
                <view class="foodSrcBox">
                  <image class="foodSrc" lazy-load="true" :src="item.IMAGE_URL" />
                  <!-- mode="aspectFit" -->
                </view>

                <view class="foodDetail">
                  <view class="foodName">{{ item.COMMODITY_NAME }}</view>
                  <!-- <view class="foodInfo">月售249 仅剩13份</view> -->
                  <view class="priceBox">
                    <view class="priceLeft">
                      <span class="price">
                        <span class="priceUnit">￥</span>
                        {{ item.COMMODITY_MEMBERPRICE }}
                      </span>
                      <!-- <span class="priceOld">￥20.5</span> -->
                    </view>
                    <view class="priceRight">
                      进店
                      <!-- <image
                        class="addBtn"
                        src="/static/home/addShopButton.svg"
                      /> -->
                    </view>
                  </view>
                </view>
              </view>
            </view>
          </scroll-view>
        </view>
      </view>

      <!-- 附近景点 -->
      <!-- <view class="nearBox">
                <view class="nearTabBox">
                    <view :class="selectNear === item.value ? 'nearTabItem selectNearTab' : 'nearTabItem'"
                        v-for="(item, index) in nearTabBox" :key="index">
                        {{ item.label || "" }}
                    </view>
                </view>
            </view> -->
    </view>
    <view class="bigPopupBox" v-if="isShowPrivacyPopup">
      <view class="privacyPopupBox">
        <view class="contentTitle">用户隐私保护政策确认</view>
        <view class="contentWord">
          感谢您使用本产品，您使用本产品前应当仔细阅读并同意<text class="tips" @click="handleOpenPrivacyContract">《驿达隐私保护指引》</text>
          当您点击同意并开始使用产品服务时，即表示您已理解并同意该条款内容，该条款将对您产生法律约束。如您拒绝，将无法更好的体验产品。
        </view>

        <view class="btnList">
          <button class="btns noAgree" @click="handleRefuse">拒绝</button>
          <button class="btns agree" id="agree-btn3" open-type="agreePrivacyAuthorization"
            @click="handleAgreePrivacyAuthorization">
            同意
          </button>
        </view>
      </view>
    </view>

    <uni-popup ref="nearCouponRef" :show="isShow" :safe-area="false">
      <view class="nearCouponBox">
        <scroll-view :scroll-y="true" class="couponList">
          <div class="couponItem" v-for="(item, i) in nearCouponList" :key="i">
            <div class="itemleft">
              <div>
                <span class="leftUnit">¥</span>
                <span class="money">{{ item.UseAmount }}</span>
              </div>
              <div v-if="!item.CouponSendId && item.CouponPoint" class="condition">
                {{ item.CouponPoint }}积分兑换
              </div>
              <div v-else class="condition">
                {{
                  item.WithAmount > 0
                    ? "满" + item.WithAmount + "可用"
                    : "无门槛使用"
                }}
              </div>
            </div>
            <div class="itemRight">
              <div>
                <div class="couponName">{{ item.CouponName }}</div>
                <div class="timeText">
                  <span class="coupon-date" v-if="item.CouponSendId">有效期至{{ item.EndTime }}</span>
                  <span class="coupon-date" v-else>活动至{{ item.EndTime }}</span>
                </div>
              </div>

              <div class="useBtn">
                <span class="useBtnText" v-if="!item.takeState" @click="handleDistributeCoupons(item)">去兑换</span>
                <span class="useBtnText" @click="handleGoCouponsList" v-else-if="item.takeState">查看</span>
                <!-- <span class="useBtnText" v-else>{{
                  item.CouponStateText
                }}</span> -->
              </div>
            </div>
          </div>
        </scroll-view>
      </view>
    </uni-popup>


    <tabbar :page="'/pages/home/newIndex'" />
    <CustomLoading :visible="isLoading" v-if="isLoading" @update:visible="(val) => (isLoading = val)" />
  </view>
</template>

<script>
import { mapGetters, mapMutations } from "vuex";
import tabbar from "../../components/tabbar.vue";
import CustomLoading from "../../components/customLoading.vue";
import ChargeBox from "../../components/chargeBox.vue";
import {
  handleGetUserPointInfo,
  handleGetNearThreeService,
} from "../../utils/publicMethods";

export default {
  components: { tabbar, CustomLoading, ChargeBox },
  data() {
    return {
      menu: {}, // 拿到用户手机尺寸
      loginType: "", // 登录平台
      funList: [
        { label: "扫码充电", value: 1, src: "/static/home/scanCode.png" },
        { label: "我要加油", value: 2, src: "/static/home/getOil.png" },
        { label: "线上点餐", value: 3, src: "/static/home/onlineFood.png" },
        { label: "出行导航", value: 4, src: "/static/home/mapHelp.png" },
        { label: "道路救援", value: 5, src: "/static/home/roadHelp.png" },
        {
          label: "失物招领",
          value: 6,
          src: "/static/home/newLostAndFound.png",
        },
        { label: "我要修车", value: 7, src: "/static/home/helpCar.png" },
        { label: "投诉建议", value: 8, src: "/static/home/NewSuggestIcon.png" },
      ], // 可以跳转的功能列表
      tabList: [
        { label: "驿达推荐", desc: "推荐精选", value: 1 },
        { label: "皖美地图", desc: "请跟我走", value: 2 },
        { label: "皖美会员", desc: "会员特权", value: 3 },
      ], // tab的功能列表
      selectTab: 1, // 选中的功能列表
      chaegeBoxList: [], // 服务区名称列表
      bannerList: [
        // "https://eshangtech.com/ShopICO/yifu/banner/banner1.png",
        // "https://eshangtech.com/ShopICO/yifu/banner/banner2.png",
        // "https://eshangtech.com/ShopICO/yifu/banner/banner3.png",
        "https://eshangtech.com/wanmeiyizhanImg/home/activityNo1.png",
        "https://eshangtech.com/wanmeiyizhanImg/home/activityNo2.png",
        "https://eshangtech.com/wanmeiyizhanImg/home/activityNo3.png",
      ], // 轮播框内容
      currentBan: 1, // 当前的轮播框 显示内容
      nearTabBox: [{ label: "玩乐推荐", value: 1 }],
      selectNear: 1, //附近景点的tab选择
      seatInfo: {}, // 经纬度信息
      isLoading: false, // 加载效果
      nearPart: {}, // 最近的服务区
      serverPart: {}, // 当前的服务区
      foodList: [], // 当前服务区的食品详情
      AllProductsList: [], // 农品内容
      showBanner: false,
      isShowPrivacyPopup: false,
      mallList: [],
      nearCouponList: [],// 附近服务区的优惠券列表
    };
  },
  computed: {
    ...mapGetters({
      user: "user",
      canIuse: "canIuse",
      provinceCode: "provinceCode",
      severList: "severList",
    }),
  },
  async onLoad() {
    // await getApp().globalData.initReady;
    // 获取手机参数对页面进行适配 主要是用于拿到胶囊的位置
    let systemInfo = uni.getSystemInfoSync();
    let type = uni.getStorageSync("loginType");
    this.loginType = type;
    console.log("this.loginTypethis.loginType", this.loginType);
    if (type === "min") {
      this.menu = uni.getMenuButtonBoundingClientRect();
    } else {
      this.menu = systemInfo.safeArea;
    }


    if (type === 'android') {
      const hasAgreed = uni.getStorageSync('hasAgreedToPrivacyPolicy');
      console.log('hasAgreed', hasAgreed);
      if (!hasAgreed) {
        // 显示隐私政策弹窗
        this.showPrivacyPopup();
      } else {
        // 已同意，初始化SDK和权限
        await this.handleOnLoad();
      }

    } else {
      await this.handleOnLoad();
    }

    this.$utils.addUserBehaviorNew();
  },
  async onShow() {
    this.showBanner = true;
    // await getApp().globalData.initReady;
    let type = uni.getStorageSync("loginType");
    if (type !== "min") {
      uni.hideTabBar({
        animation: false,
      });
    }
    // 当前服务区
    let currentService = uni.getStorageSync("currentService");
    if (this.serverPart && currentService) {
      if (this.serverPart.ServerPart_Name !== currentService.SERVERPART_NAME) {
        this.handleOnShowUpdate(currentService);
      }
    }
    this.isLoading = false;
  },
  onHide() {
    this.showBanner = true;
  },
  // 下拉刷新
  async onPullDownRefresh() {
    this.isLoading = true;
    uni.setStorageSync("seatInfo", null);
    uni.setStorageSync("currentService", null);
    uni.setStorageSync("nearService", null);
    uni.setStorageSync("nearThreeList", null);
    uni.setStorageSync("allServiceList", null);
    await this.handleOnLoad();

    let allServiceList = uni.getStorageSync("allServiceList");
    let currentService = uni.getStorageSync("currentService");
    this.chaegeBoxList = [];
    this.$forceUpdate();
    console.log("allServiceListallServiceListallServiceList", allServiceList);
    if (allServiceList && allServiceList.length > 0) {
      allServiceList.forEach((item) => {
        if (item.SERVERPART_NAME === currentService.SERVERPART_NAME) {
          this.serverPart = item;
        }
      });
    }

    let _this = this;
    setTimeout(() => {
      _this.chaegeBoxList = [_this.serverPart.SERVERPART_NAME];
      uni.stopPullDownRefresh();
    }, 500);
    this.isLoading = false;
  },
  onHide() {
    this.isLoading = false;
    this.$forceUpdate();
  },
  methods: {
    ...mapMutations({
      setArea: "setHomeServer",
      setServerPart: "discoveryServerPart",
      setSeverList: "severList",
      setprovinceCode: "setprovinceCode",
      setInvitedCode: "setInvitedCode",
      setOwnerUnitId: "setOwnerUnitId",
    }),

    goMall(item) {
      if (!this.user.MEMBERSHIP_ID) {
        uni.showModal({
          title: "温馨提示",
          content: "请您授权登录后再操作。",
          success(res) {
            if (res.confirm) {
              uni.redirectTo({ url: "/pages/register/index" });
            }
          },
        });
        return;
      }
      if (this.user.MEMBERSHIP_MOBILEPHONE) {
        uni.navigateTo({
          url: "/pages/product/productDetail/index?id=" + item.ITEM_ID,
        });
      } else {
        this.isLogin = true;
      }
    },
    handleRefuse() {
      this.isShowPrivacyPopup = false
    },
    async handleAgreePrivacyAuthorization() {
      this.isShowPrivacyPopup = false
      uni.setStorageSync("hasAgreedToPrivacyPolicy", true);
      await this.handleOnLoad();
      await this.handleOnShowUpdate(this.serverPart)
    },
    // 显示底部悬浮框
    showPrivacyPopup() {
      this.isShowPrivacyPopup = true
    },
    // onshow需要更新得内容
    async handleOnShowUpdate(currentService) {
      this.isLoading = true;
      let allServiceList = uni.getStorageSync("allServiceList");
      this.chaegeBoxList = [];
      this.$forceUpdate();
      console.log("allServiceListallServiceListallServiceList", allServiceList);
      if (allServiceList && allServiceList.length > 0) {
        allServiceList.forEach((item) => {
          if (item.SERVERPART_NAME === currentService.SERVERPART_NAME) {
            this.serverPart = item;
          }
        });
      }
      // 拿到当前服务区的点餐数据
      await this.handleGetCurrentService();

      let _this = this;
      setTimeout(() => {
        _this.chaegeBoxList = [_this.serverPart.SERVERPART_NAME];
      }, 500);

      this.isLoading = false;
      this.$forceUpdate();
    },
    // 跳转精选活动
    handleGoDiscovery() {
      uni.switchTab({
        url: "/pages/discovery/index",
      });
    },
    // 跳转到对应的食品门店  点餐页面
    handleGoFoodShop(item) {
      console.log("item", item);

      if (this.user.MEMBERSHIP_MOBILEPHONE) {
        let id = item.SERVERPARTSHOP_IDS.split(",")[0];
        uni.navigateTo({
          url: `/pages/shopPages/shop/index?id=${id}&mid=${item.MERCHANTS_ID}&province=${item.PROVINCE_CODE}&buyType=${item.SCANCODE_ORDER}`,
        });
      } else {
        let id = item.SERVERPARTSHOP_IDS.split(",")[0];
        uni.navigateTo({
          url: `/pages/shopPages/shop/index?id=${id}&mid=${item.MERCHANTS_ID}&province=${item.PROVINCE_CODE}&buyType=${item.SCANCODE_ORDER}`,
        });
        this.isLogin = true;
      }
    },
    // 轮播框的图片切换
    swiperChange(e, name) {
      // this[name] = e.mp.detail.current;
      this.currentBan = e.mp.detail.current;
    },
    // 切换tab
    handleChangeTab(obj) {
      // this.selectTab = obj.value
      if (obj.value === 2) {
        // 出行导航
        uni.navigateTo({
          url: "/pages/scanCodeCharge/travelNavigation",
        });
      } else if (obj.value === 3) {
        // 跳转会员权益页面
        uni.navigateTo({
          url: "/pages/memberBenefits/index",
        });
      }
    },
    async handleOnLoad() {
      this.isLoading = true;
      // 拿到经纬度信息
      let seatInfo = await handleGetUserPointInfo();
      this.seatInfo = seatInfo;
      // 拿到几个需要的服务区的数据
      let serviceInfo = await handleGetNearThreeService();
      console.log("serviceInfo", serviceInfo);

      this.nearPart = serviceInfo.currentService;
      this.serverPart = serviceInfo.currentService;
      if (this.chaegeBoxList && this.chaegeBoxList.length > 0) {

      } else {
        this.chaegeBoxList = [serviceInfo.nearThreeList[0]]
      }
      console.log("this.serverPart", this.serverPart);
      // 拿到当前服务区的点餐数据
      await this.handleGetCurrentService();
      await this.getMall()

      // this.handleDistributeCoupons(serviceInfo.nearThreeList[0])
      this.handleGetNearCouponList()
      this.isLoading = false;
      this.$forceUpdate();
    },
    // 拿到就近服务区的优惠券列表
    async handleGetNearCouponList() {
      const data = await this.$api.$javaGet2("/third-party/getCouponList", {});
      let list = data.Result_Data.List
      this.nearCouponList = list
      console.log('this.nearCouponListthis.nearCouponListthis.nearCouponListthis.nearCouponList', this.nearCouponList);
      if (this.nearCouponList && this.nearCouponList.length > 0) {
        this.$refs.nearCouponRef.open('center')
      }
    },
    // 拿当前距离最近的服务区 去发放优惠券
    async handleDistributeCoupons(obj) {
      console.log('objobj', obj);
      console.log('this.chaegeBoxList[0]this.chaegeBoxList[0]', this.chaegeBoxList[0]);

      const req = {
        serverpartName: this.chaegeBoxList[0],
        couponId: obj.CouponId
      }
      const data = await this.$api.$javaGet2("/third-party/sendCoupon", req);

      if (data.Result_Data === '领取成功!') {
        await this.handleGetNearCouponList()
        uni.showToast({
          title: '已为你领取优惠券，请到券包查看！',
          icon: "none",
          duration: 5000
        })
      }
    },
    // 跳转卡包
    handleGoCouponsList() {
      uni.navigateTo({
        url: '/pages/homeFn/myCoupon/index'
      })
    },
    // 拿到当前服务区的点餐数据
    async handleGetCurrentService() {
      //   const data = await this.$api.getCoop({
      //     action_type: "GetSellerList",
      //     showSales: 1,
      //     showCoupon: 1,
      //     showComment: 1,
      //     serverpartId: this.serverPart.SERVERPART_ID,
      //     provinceCode: this.serverPart.ProvinceCode || "340000",
      //     showGoods: 1,
      //     pageSize: 9999,
      //     pageIndex: 1,
      //   });
      //   let list = data.Data.List;

      const data = await this.$api.$javaGet2("/third-party/getMerchantsList", {
        serverpartId: this.serverPart.SERVERPART_ID,
      });
      let list = data.Result_Data.List;
      console.log("首页点餐数据", list);
      // 因为要显示具体商品 但是商品的内容 又在item的 GoodsList 里面 是一个数据 那么就将要显示的商品拆出来
      let shopList = [];
      let productsList = [];
      if (list && list.length > 0) {
        list.forEach((item) => {
          if (item.GOODSLIST && item.GOODSLIST.length > 0) {
            item.GOODSLIST.forEach((subItem) => {
              let obj = JSON.parse(JSON.stringify(item));
              obj = {
                ...obj,
                ...subItem,
              };
              shopList.push(obj);
            });
          }
          if (item.MERCHANTS_ID === 927) {
            if (item.GOODSLIST && item.GOODSLIST.length > 0) {
              item.GOODSLIST.forEach((subItem) => {
                let obj = JSON.parse(JSON.stringify(item));
                obj = {
                  ...obj,
                  ...subItem,
                };
                productsList.push(obj);
              });
            }
          }
        });
      }
      this.foodList = shopList;
      this.AllProductsList = productsList;
      console.log('this.AllProductsList', this.AllProductsList);

    },
    async getMall() {
      let _this = this;
      console.log("_this.serverPart", _this.serverPart);

      const data = await _this.$api
        .getCoop({
          action_type: "GetRcmContent",
          rcmtagKey: "HOME_MALL",
          serverpartId: _this.serverPart.ServerPart_Id,
          provinceCode: _this.provinceCode || "340000",
          showThird: 0,
        })
      if (data.ResultCode === "100") {
        let list = data.Data.List
        let res = []
        if (list && list.length > 0) {
          list.forEach((item) => {
            if (item.RCMCONTENT_INDEX <= 9) {
              res.push(item)
            }
          })
        }
        _this.mallList = res;
        console.log("_this.mallList", _this.mallList);
      }
    },
    // 跳转点餐页面
    handleGoFoodOrder() {
      // 线上点餐
      uni.navigateTo({
        url: "/pages/reservationOrder/index",
      });
    },
    // 跳转修改服务区的列表页面
    handleGoServiceList(value) {
      // 当value为1 的时候 表示会回到该页面
      if (value === 1) {
        uni.navigateTo({ url: "/pages/newMap/index/index" });
      } else {
        uni.navigateTo({ url: "/pages/newMap/index/index?comeForm=home" });
      }
    },
    // 中间的八个功能点击的跳转
    handleGoFun(obj) {
      let _this = this;
      if (obj.value === 1) {
        // 扫码充电
        if (this.loginType === "min") {
          uni.navigateTo({ url: "/pages/scanCodeCharge/mapIndex" });
        } else {
          uni.navigateTo({ url: "/pages/scanCodeCharge/mapIndexAPP" });
        }
      } else if (obj.value === 2) {
        // 我要加油
        uni.navigateTo({ url: "/pages/scanCodeCharge/oilIndex" });
      } else if (obj.value === 3) {
        // 线上点餐
        uni.navigateTo({
          url: "/pages/reservationOrder/index",
        });
      } else if (obj.value === 4) {
        // 出行导航
        uni.navigateTo({
          url: "/pages/scanCodeCharge/travelNavigation",
        });
      } else if (obj.value === 5) {
        // 道路救援
        if (_this.loginType === "min") {
          uni.navigateTo({ url: "/pages/clickRescue/index" });
        } else {
          uni.navigateTo({ url: "/pages/clickRescue/index" });
        }
      } else if (obj.value === 6) {
        // 失物招领
        uni.navigateTo({
          url: "/pages/contact/index",
        });
      } else if (obj.value === 7) {
        // 我要修车
        uni.navigateTo({
          url: "/pages/clickRescue/carMaintenance",
        });
      } else if (obj.value === 8) {
        // 投诉建议
        if (!this.user.MEMBERSHIP_ID) {
          let _this = this;
          uni.showModal({
            title: "温馨提示",
            content: "请您授权登录后再操作。",
            success(res) {
              if (res.confirm) {
                if (_this.loginType === "min") {
                  uni.navigateTo({ url: "/pages/register/index" });
                } else {
                  uni.navigateTo({ url: "/pages/login/index" });
                }
              }
            },
          });
          return;
        }
        if (_this.loginType === "min") {
          uni.navigateTo({
            url: "/pages/complaintFeedback/index",
          });
        } else {
          uni.navigateTo({
            url: "/pages/complaintFeedback/index",
          });
        }
      }
    },
  },
};
</script>

<style lang="less" scoped>
.homeMain {
  width: 100vw;
  min-height: 100vh;
  box-sizing: border-box;
  padding-bottom: env(safe-area-inset-bottom);
  padding-bottom: constant(safe-area-inset-bottom);
  position: relative;

  .minTopBox {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 3;
    background-image: url("https://eshangtech.com/wanmeiyizhanImg/home/wanmeiyizhanNewIndex.png");
    background-repeat: no-repeat;
    background-size: 100% 400rpx;

    .topContent {
      width: 100%;
      display: flex;
      align-items: center;
      padding: 0 32rpx;

      .fixedIcon {
        width: 36rpx;
        height: 36rpx;
        margin-right: 8rpx;
      }

      .selectServiceBox {
        width: 180rpx;
        height: 100%;
        display: flex;
        align-items: center;

        .serviceName {
          max-width: 150rpx;
          display: inline-block;
          white-space: noWrap;
          text-overflow: ellipsis;
          overflow: hidden;
          font-family: "PingFang SC";
          font-weight: 400;
          font-size: 30rpx;
          color: #ffffff;
          line-height: 42rpx;
          text-align: left;
          font-style: normal;
          text-transform: none;
        }

        .serviceIcon {
          width: 20rpx;
          height: 10rpx;
          margin-left: 8rpx;
        }
      }

      .searchBox {
        width: 274rpx;
        height: 60rpx;
        background-color: rgba(255, 255, 255, 0.7);
        border-radius: 14rpx 14rpx 14rpx 14rpx;
        border: 1rpx solid rgba(0, 0, 0, 0);
        display: flex;
        align-items: center;
        box-sizing: border-box;
        padding: 9rpx 20rpx;
        margin-left: 14rpx;

        .searchIcon {
          width: 32rpx;
          height: 32rpx;
          margin-right: 6rpx;
        }

        .searchText {
          font-family: "PingFang SC";
          font-weight: 400;
          font-size: 30rpx;
          color: #959fb0;
          line-height: 42rpx;
          text-align: left;
          font-style: normal;
          text-transform: none;
        }
      }
    }
  }

  .appTopBox {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 3;
    background-image: url("https://eshangtech.com/wanmeiyizhanImg/home/wanmeiyizhanNewIndex.png");
    background-repeat: no-repeat;
    background-size: 100% 400rpx;

    .topContent {
      width: 100%;
      display: flex;
      align-items: center;
      padding: 0 32rpx;

      .fixedIcon {
        width: 36rpx;
        height: 36rpx;
        margin-right: 8rpx;
      }

      .selectServiceBox {
        width: 180rpx;
        display: flex;
        align-items: center;

        .serviceName {
          max-width: 150rpx;
          display: inline-block;
          white-space: noWrap;
          text-overflow: ellipsis;
          overflow: hidden;
          font-family: "PingFang SC";
          font-weight: 400;
          font-size: 30rpx;
          color: #ffffff;
          line-height: 42rpx;
          text-align: left;
          font-style: normal;
          text-transform: none;
        }

        .serviceIcon {
          width: 20rpx;
          height: 10rpx;
          margin-left: 8rpx;
        }
      }

      .searchBox {
        width: 274rpx;
        height: 60rpx;
        background-color: rgba(255, 255, 255, 0.7);
        border-radius: 14rpx 14rpx 14rpx 14rpx;
        border: 1rpx solid rgba(0, 0, 0, 0);
        display: flex;
        align-items: center;
        box-sizing: border-box;
        padding: 9rpx 20rpx;
        margin-left: 14rpx;

        .searchIcon {
          width: 32rpx;
          height: 32rpx;
          margin-right: 6rpx;
        }

        .searchText {
          font-family: "PingFang SC";
          font-weight: 400;
          font-size: 30rpx;
          color: #959fb0;
          line-height: 42rpx;
          text-align: left;
          font-style: normal;
          text-transform: none;
        }
      }
    }
  }

  .newContent {
    width: 100vw;
    box-sizing: border-box;
    // padding: 0 32rpx 180rpx;
    padding: 0 0 140rpx;
    // position: absolute;
    background-color: #f5f6f8;
    // z-index: 2;
    // top: 0;
    // left: 0;

    .topBanner {
      width: 100%;
      height: 400rpx;
      // position: absolute;
      // z-index: 1;
      // top: 0;
      // left: 0;

      .bannerImg {
        width: 100%;
        height: 100%;
      }
    }

    .funBox {
      width: 100%;
      box-sizing: border-box;
      margin-top: 32rpx;
      padding: 32rpx;
      background-color: rgba(255, 255, 255, 0.8);
      box-shadow: 0rpx 3rpx 8rpx 1rpx rgba(67, 29, 0, 0.15);
      border-radius: 24rpx;
      // margin-top: 360rpx;
      display: flex;
      flex-wrap: wrap;
      // position: relative;
      // z-index: 2;

      .funItem {
        width: 25%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        .funItemIcon {
          width: 80rpx;
          height: 80rpx;
          margin-bottom: 12rpx;
        }

        .funItemText {
          font-family: "PingFang SC";
          font-weight: 500;
          font-size: 24rpx;
          color: #2f3339;
          line-height: 33rpx;
          text-align: left;
          font-style: normal;
          text-transform: none;
        }
      }
    }

    .tabBox {
      width: 100%;
      margin-top: 32rpx;

      .tabList {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        flex-wrap: nowrap;

        .tabItem {
          display: inline-block;
          width: 160rpx;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;

          .title {
            font-family: "PingFang SC";
            font-weight: bold;
            font-size: 28rpx;
            color: #333333;
            line-height: 40rpx;
            text-align: left;
            font-style: normal;
            text-transform: none;
          }

          .desc {
            font-family: "PingFang SC";
            font-weight: 500;
            font-size: 22rpx;
            color: #9299a7;
            line-height: 30rpx;
            text-align: center;
            font-style: normal;
            text-transform: none;
            margin-top: 6rpx;
          }

          .selectTitle {
            font-family: "PingFang SC";
            font-weight: bold;
            font-size: 32rpx;
            color: #333333;
            line-height: 45rpx;
            text-align: left;
            font-style: normal;
            text-transform: none;
          }

          .selectDesc {
            font-family: "PingFang SC";
            font-weight: 500;
            font-size: 22rpx;
            color: #ffffff;
            line-height: 30rpx;
            text-align: center;
            font-style: normal;
            text-transform: none;
            padding: 6rpx 16rpx;
            background: linear-gradient(269deg, #3a82fd 0%, #80aeff 100%);
            border-radius: 20rpx 20rpx 20rpx 20rpx;
          }
        }
      }
    }

    .carouselBox {
      width: 100%;
      height: 300rpx;
      margin-top: 20rpx;

      .swiperBox {
        width: 100%;
        height: 100%;

        .swiperImg {
          width: 100%;
          height: 100%;
        }
      }
    }

    .foodBox {
      width: 100%;
      box-sizing: border-box;
      background-color: #fff;
      border-radius: 16rpx;
      margin-top: 32rpx;

      .foodTop {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: linear-gradient(180deg, #d7effd 0%, #ffffff 100%);
        box-shadow: 0rpx 8rpx 12rpx 1rpx rgba(176, 223, 238, 0.07),
          inset 0rpx 3rpx 6rpx 1rpx #ffffff;
        box-sizing: border-box;
        padding: 16rpx 16rpx 8rpx;

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

          .foodTopIcon {
            width: 200rpx;
            height: 70rpx;
          }

          .stationFood {
            font-family: "PingFang SC";
            font-weight: 600;
            font-size: 30rpx;
            color: #000;
            margin-left: 16rpx;
          }

          .foodDesc {
            font-family: "PingFang SC";
            font-weight: 400;
            font-size: 24rpx;
            color: #7ba3fd;
            line-height: 42rpx;
            text-align: center;
            font-style: normal;
            text-transform: none;
            padding: 4rpx 14rpx;
            border-radius: 22rpx 22rpx 22rpx 0rpx;
            border: 1rpx solid #7799fd;
            margin-left: 16rpx;
          }
        }

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

          .moreText {
            font-family: "PingFang SC";
            font-weight: 400;
            font-size: 24rpx;
            color: #9299a7;
            line-height: 33rpx;
            text-align: right;
            font-style: normal;
            text-transform: none;
          }

          .rightArrow {
            width: 30rpx;
            height: 30rpx;
          }
        }
      }

      .foodContent {
        width: 100%;

        .foodList {
          width: 100%;
          //   height: 370rpx;
          display: flex;
          align-items: center;
          flex-wrap: nowrap;
          box-sizing: border-box;
          padding: 10rpx 0 22rpx;

          .foodItem {
            width: 280rpx;
            // height: 370rpx;
            box-sizing: border-box;
            padding: 24rpx;

            .foodSrcBox {
              width: 200rpx;
              height: 200rpx;
              background-color: #f5f5f5;
              border-radius: 8rpx;
              overflow: hidden;

              .foodSrc {
                width: 200rpx;
                height: 200rpx;
                background-repeat: no-repeat;
                // margin-bottom: 16rpx;
              }
            }

            .foodSrc {
              width: 200rpx;
              height: 200rpx;
              background-repeat: no-repeat;

              // margin-bottom: 16rpx;
            }

            .foodDetail {
              width: 100%;
              margin-top: 16rpx;

              .foodName {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                font-family: "PingFang SC";
                font-weight: 400;
                font-size: 28rpx;
                color: #050505;
                line-height: 30rpx;
                text-align: left;
                font-style: normal;
                margin-bottom: 8rpx;
              }

              .foodInfo {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                font-family: "PingFang SC";
                font-weight: 400;
                font-size: 24rpx;
                color: #a8aab0;
                line-height: 30rpx;
                text-align: left;
                font-style: normal;
              }

              .priceBox {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-top: 16rpx;

                .priceLeft {
                  .price {
                    font-family: "DINAlternate";
                    font-weight: 500;
                    font-size: 35rpx;
                    color: #ff790d;
                    line-height: 52rpx;
                    text-align: center;
                    font-style: normal;
                    text-transform: none;

                    .priceUnit {
                      font-family: "PingFang SC";
                      font-weight: 500;
                      font-size: 22rpx;
                      color: #ff790d;
                      line-height: 30rpx;
                      text-align: center;
                      font-style: normal;
                      text-transform: none;
                    }
                  }

                  .priceOld {
                    font-family: "PingFang SC";
                    font-weight: 400;
                    font-size: 20rpx;
                    color: #a8aab0;
                    line-height: 30rpx;
                    text-align: center;
                    font-style: normal;
                    text-decoration-line: line-through;
                    margin-left: 8rpx;
                  }
                }

                .priceRight {
                  width: 40rpx;
                  height: 40rpx;

                  .addBtn {
                    width: 40rpx;
                    height: 40rpx;
                  }
                }
              }
            }
          }

          .foodItemNew {
            box-sizing: border-box;
            padding: 16rpx 26rpx;
            box-shadow: 0rpx 0rpx 5rpx 0rpx rgba(0, 0, 0, 0.1);
            border-radius: 16rpx;
            margin-right: 16rpx;

            .shopName {
              font-family: "PingFang SC";
              font-weight: 500;
              font-size: 28rpx;
              color: #000c04;
              line-height: 30rpx;
              display: inline-block;
              width: 240rpx;
              white-space: nowrap;
              overflow: hidden;
              text-overflow: ellipsis;
            }

            .foodSrcBox {
              margin-top: 16rpx;
              width: 218rpx;
              height: 218rpx;
              border-radius: 12rpx;
              overflow: hidden;

              .foodSrc {
                width: 100%;
                height: 100%;
              }
            }

            .foodDetail {
              margin-top: 20rpx;

              .foodName {
                font-family: "PingFang SC";
                font-weight: 500;
                font-size: 28rpx;
                color: #000c04;
                line-height: 30rpx;
                display: inline-block;
                width: 240rpx;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
              }

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

                .priceLeft {
                  .price {
                    font-family: "PingFang SC";
                    font-weight: 600;
                    font-size: 30rpx;
                    color: #ff6800;
                    line-height: 30rpx;

                    .priceUnit {
                      font-family: "PingFang SC";
                      font-weight: 500;
                      font-size: 20rpx;
                      color: #ff6800;
                      line-height: 30rpx;
                    }
                  }
                }

                .priceRight {
                  font-family: "PingFang SC";
                  font-weight: 500;
                  font-size: 24rpx;
                  color: #ffffff;
                  line-height: 30rpx;
                  padding: 6rpx 16rpx;
                  background-color: #01c553;
                  border-radius: 32rpx;
                }
              }
            }
          }
        }
      }
    }

    .productBox {
      width: 100%;
      box-sizing: border-box;
      background-color: #fff;
      border-radius: 16rpx;
      margin-top: 32rpx;

      .foodTop {
        width: 100%;
        // height: 70rpx;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: linear-gradient(#e9ecff 0%, #f9faff 100%);
        box-shadow: 0rpx 8rpx 12rpx 1rpx rgba(176, 223, 238, 0.07),
          inset 0rpx 3rpx 6rpx 1rpx #ffffff;
        box-sizing: border-box;
        padding: 16rpx 16rpx 8rpx;

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

          .foodTopIcon {
            width: 200rpx;
            height: 70rpx;
          }

          .stationFood {
            font-family: "PingFang SC";
            font-weight: 600;
            font-size: 30rpx;
            color: #000;
            margin-left: 16rpx;
          }

          .foodDesc {
            font-family: "PingFang SC";
            font-weight: 400;
            font-size: 24rpx;
            color: #998cea;
            line-height: 42rpx;
            text-align: center;
            font-style: normal;
            text-transform: none;
            padding: 4rpx 14rpx;
            border-radius: 22rpx 22rpx 22rpx 0rpx;
            border: 1rpx solid #998cea;
            margin-left: 16rpx;
          }
        }

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

          .moreText {
            font-family: "PingFang SC";
            font-weight: 400;
            font-size: 24rpx;
            color: #9299a7;
            line-height: 33rpx;
            text-align: right;
            font-style: normal;
            text-transform: none;
          }

          .rightArrow {
            width: 30rpx;
            height: 30rpx;
          }
        }
      }

      .foodContent {
        width: 100%;

        .foodList {
          width: 100%;
          //   height: 370rpx;
          display: flex;
          align-items: center;
          flex-wrap: nowrap;
          padding: 10rpx 0 22rpx;

          .foodItem {
            width: 280rpx;
            box-sizing: border-box;
            padding: 24rpx;

            .foodSrc {
              width: 200rpx;
              height: 200rpx;
              margin-bottom: 16rpx;
            }

            .foodDetail {
              width: 100%;
              margin-top: 16rpx;

              .foodName {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                font-family: "PingFang SC";
                font-weight: 400;
                font-size: 28rpx;
                color: #050505;
                line-height: 30rpx;
                text-align: left;
                font-style: normal;
                margin-bottom: 8rpx;
              }

              .foodInfo {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                font-family: "PingFang SC";
                font-weight: 400;
                font-size: 24rpx;
                color: #a8aab0;
                line-height: 30rpx;
                text-align: left;
                font-style: normal;
              }

              .priceBox {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-top: 16rpx;

                .priceLeft {
                  .price {
                    font-family: "DINAlternate";
                    font-weight: 500;
                    font-size: 35rpx;
                    color: #ff790d;
                    line-height: 52rpx;
                    text-align: center;
                    font-style: normal;
                    text-transform: none;

                    .priceUnit {
                      font-family: "PingFang SC";
                      font-weight: 500;
                      font-size: 22rpx;
                      color: #ff790d;
                      line-height: 30rpx;
                      text-align: center;
                      font-style: normal;
                      text-transform: none;
                    }
                  }

                  .priceOld {
                    font-family: "PingFang SC";
                    font-weight: 400;
                    font-size: 20rpx;
                    color: #a8aab0;
                    line-height: 30rpx;
                    text-align: center;
                    font-style: normal;
                    text-decoration-line: line-through;
                    margin-left: 8rpx;
                  }
                }

                .priceRight {
                  width: 40rpx;
                  height: 40rpx;

                  .addBtn {
                    width: 40rpx;
                    height: 40rpx;
                  }
                }
              }
            }
          }

          .foodItemNew {
            box-sizing: border-box;
            padding: 16rpx 26rpx;
            box-shadow: 0rpx 0rpx 5rpx 0rpx rgba(0, 0, 0, 0.1);
            border-radius: 16rpx;
            margin-right: 16rpx;

            .shopName {
              font-family: "PingFang SC";
              font-weight: 500;
              font-size: 28rpx;
              color: #000c04;
              line-height: 30rpx;
              display: inline-block;
              width: 240rpx;
              white-space: nowrap;
              overflow: hidden;
              text-overflow: ellipsis;
            }

            .foodSrcBox {
              margin-top: 16rpx;
              width: 218rpx;
              height: 218rpx;
              border-radius: 12rpx;
              overflow: hidden;

              .foodSrc {
                width: 100%;
                height: 100%;
              }
            }

            .foodDetail {
              margin-top: 20rpx;

              .foodName {
                font-family: "PingFang SC";
                font-weight: 500;
                font-size: 28rpx;
                color: #000c04;
                line-height: 30rpx;
                display: inline-block;
                width: 240rpx;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
              }

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

                .priceLeft {
                  .price {
                    font-family: "PingFang SC";
                    font-weight: 600;
                    font-size: 30rpx;
                    color: #ff6800;
                    line-height: 30rpx;

                    .priceUnit {
                      font-family: "PingFang SC";
                      font-weight: 500;
                      font-size: 20rpx;
                      color: #ff6800;
                      line-height: 30rpx;
                    }
                  }
                }

                .priceRight {
                  font-family: "PingFang SC";
                  font-weight: 500;
                  font-size: 24rpx;
                  color: #ffffff;
                  line-height: 30rpx;
                  padding: 6rpx 16rpx;
                  background-color: #01c553;
                  border-radius: 32rpx;
                }
              }
            }
          }
        }
      }
    }

    .nearBox {
      width: 100%;
      box-sizing: border-box;
      padding: 25rpx 32rpx;
      background-color: #fff;
      border-radius: 16rpx 16rpx 16rpx 16rpx;
      margin-top: 20rpx;

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

        .nearTabItem {
          font-family: "PingFang SC";
          font-weight: 500;
          font-size: 34rpx;
          color: #5f5f5f;
          line-height: 45rpx;
          text-align: center;
          font-style: normal;
          text-transform: none;
        }

        .selectNearTab {
          font-family: "PingFang SC";
          font-weight: bold;
          font-size: 34rpx;
          color: #141b1a;
          line-height: 45rpx;
          text-align: center;
          font-style: normal;
          text-transform: none;
          position: relative;
          z-index: 2;
        }
      }
    }
  }

  .bigPopupBox {
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 999999;
    position: fixed;
    bottom: 0;
    left: 0;


    .privacyPopupBox {
      width: 100%;
      height: 300px;
      border-top-left-radius: 64rpx;
      border-top-right-radius: 64rpx;
      background-color: #fff;
      box-sizing: border-box;
      padding: 32rpx;
      z-index: 999999;
      position: fixed;
      bottom: 0;
      left: 0;

      .contentTitle {
        font-family: PingFangSC, PingFang SC;
        font-weight: 600;
        font-size: 36rpx;
        color: #130f05;
        line-height: 52rpx;
        text-align: left;
        font-style: normal;
        text-align: center;
      }

      .contentWord {
        margin-top: 32rpx;
        text-indent: 2em;

        .tips {
          font-size: 28rpx;
          font-family: Source Han Sans CN-Normal, Source Han Sans CN;
          font-weight: 400;
          color: #8bc21f;
          line-height: 33rpx;
        }
      }

      .btnList {
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        margin-top: 48rpx;

        .btns {
          display: inline-block;
          padding: 0 90rpx;
          border-radius: 15rpx;
        }

        .noAgree {
          background: rgb(242, 242, 242);
          color: rgb(26, 187, 107);
          font-weight: 600;
        }

        .agree {
          background: rgb(26, 187, 107);
          color: #fff;
          font-weight: 600;
        }
      }
    }
  }

  .nearCouponBox {
    width: 90vw;
    height: 600rpx;
    background-color: #fff;
    border-radius: 32rpx;
    box-sizing: border-box;
    padding: 24rpx;

    .couponList {
      width: 100%;
      height: 562rpx;
      box-sizing: border-box;

      .couponItem {
        width: 100%;
        height: 144rpx;
        background: url('https://eshangtech.com/wanmeiyizhanImg/home/validCoupons.png') no-repeat center;
        background-size: contain;
        box-sizing: border-box;
        padding: 32rpx 0;
        display: flex;
        align-items: center;
        margin-bottom: 32rpx;

        .itemleft {
          width: 195rpx;
          display: flex;
          flex-direction: column;
          align-items: center;
          border-right: 2rpx dashed #E5CD92;

          .leftUnit {
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 34rpx;
            color: #BA922F;
            line-height: 48rpx;
            text-align: left;
            font-style: normal;
            margin-right: 4rpx;
          }

          .money {
            font-family: DINAlternate, DINAlternate;
            font-weight: bold;
            font-size: 48rpx;
            color: #BA922F;
            line-height: 56rpx;
            text-align: left;
            font-style: normal;
          }

          .condition {
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 20rpx;
            color: #BA922F;
            line-height: 28rpx;
            text-align: justify;
            font-style: normal;
          }
        }

        .itemRight {
          flex: 1;
          width: 100%;
          box-sizing: border-box;
          padding: 0 32rpx;
          display: flex;
          align-items: center;
          justify-content: space-between;

          .couponName {
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 28rpx;
            color: #130F05;
            line-height: 40rpx;
            text-align: left;
            font-style: normal;
          }

          .timeText {
            .coupon-date {
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 22rpx;
              color: #716F69;
              line-height: 32rpx;
              text-align: justify;
              font-style: normal;
            }
          }

          .useBtn {
            .useBtnText {
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #FFFFFF;
              line-height: 36rpx;
              text-align: center;
              font-style: normal;
              padding: 8rpx 20rpx;
              background: #BA922F;
              border-radius: 4rpx;
            }
          }
        }
      }
    }



  }

}
</style>