<template>
  <view class="main">
    <view class="header">
      <image class="headerBg" src="https://eshangtech.com/ShopICO/ahyd-BID/index/indexBg.png"></image>
      <div class="headerTop" :style="{ height: menu.bottom + 5 + 'px'}">
        <view class="selectTime" :style="{ top: menu.top + (menu.height - 22) / 2 + 'px' }">
          <image class="dateIcon" src="/static/images/index/dateTime.svg"></image>
          <picker mode="date" :value="single" @change="bindDateChange" >
            <view class="time">
              <text class="day">{{ thisDay }}</text>
              <view class="uni-input"  style="background: transparent;padding: 0;height:100%">{{ single }}</view>
              <image class="icon" src="/static/images/index/arrow_bottom.svg"></image>
            </view>
          </picker>
        </view>
      </div>
      <view class="other">
        <view v-if="user.Membership_Id" >
          <p class="title">对客营收<span class="text">(门店上传 {{showHeadMsg.uploadState?showHeadMsg.uploadState:''}})</span></p>
          <view class="box" @click="handlePage"> 
            <p class="allPrice">{{showHeadMsg.totalMoneyShow|| '0.00'}}</p> 
            <image class="start" src="https://ahyd.eshangtech.com/UploadImageDir/ahyd_DIB/index/start.svg"></image>
          </view> 
          <view class="addBox">
            <image class="arrowTop" :src="Number(showHeadMsg.compared)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/arrow_top.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/arrow_reduce.svg'"></image>
            <text class="text">{{showHeadMsg.compared?showHeadMsg.compared + '%':'' + '%'}}</text>
            <text class="compare">(相比昨日)</text>
          </view>
        </view>
        <view v-if="!user.Membership_Id" class="title" style="font-size: 16px"  @click="handleReg">去授权 </view>
        <view class="type"> 
          <view class="item">
            <view class="leftImg">
              <image src="/static/images/index/business.svg"></image>
            </view>
            <view class="right">
              <p class="typeName">客单交易<text class="unit">/笔</text></p>
              <p class="price">{{showHeadMsg.ticketCount || 0}}</p>
            </view>
          </view>

          <view class="item">
            <view class="leftImg">
              <image src="/static/images/index/average.svg"></image>
            </view>
            <view class="right">
              <p class="typeName">客单均价<text class="unit">/元</text></p>
              <p class="price">{{showHeadMsg.averagePrice || '0.00'}}</p>
            </view>
          </view>
        </view>

        <view class="detail">
          <view class="detailItem">
            <p class="itemName">
              长款金额<text class="itemUnit">/元</text>
            </p>
            <p class="price">{{ showHeadMsg.diffMorePrice }}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              短款金额<text class="itemUnit">/元</text>
            </p>
            <p class="price">{{ showHeadMsg.diffLessPrice }}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              优惠金额<text class="itemUnit">/元</text>
            </p>
            <p class="price">{{showHeadMsg.totalOffAmount }}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              移动支付<text class="itemUnit">/元</text>
            </p>
            <p class="price">{{showHeadMsg.mobilePayment }}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              商品出售<text class="itemUnit">/件</text>
            </p>
            <p class="price">{{ showHeadMsg.totalCount }}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              商品均价<text class="itemUnit">/元</text>
            </p>
            <p class="price">{{ showHeadMsg.countave}}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              入区车流<text class="itemUnit">/辆</text>
            </p>
            <p class="price">{{carInfo.Vehicle_Count?carInfo.Vehicle_Count:''}}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              入区率<text class="itemUnit"></text>
            </p>
            <p class="price">{{carInfo.Entry_Rate?carInfo.Entry_Rate + '%':'' }}</p>
          </view>
          <view class="detailItem">
            <p class="itemName">
              停留时长<text class="itemUnit"></text>
            </p>
            <p class="price">{{carInfo.Stay_Times?carInfo.Stay_Times + '分钟':'' }}</p>
          </view>

        </view>
      </view>
    </view>


    <view class="menu">
      <image class="topBg" src="https://eshangtech.com/ShopICO/ahyd-BID/index/menuBg.png"></image>
      <view class="content">
        <div class="tabType">
          <view v-for="(item, index) in tabTypeList" :key="index" class="item">
            <view class="big">
              <image class="img" :src="item.imgUrl"></image>
            </view>
            <text class="name">{{ item.name }}</text>
          </view>
        </div>

        <div class="detailType">
          <view v-for="(item, index) in detailTypeList" :key="index" class="item">
            <view class="box">
              <p class="title">
                {{ item.name }}<text class="unit">{{ item.unit }}</text>
              </p>
              <p class="money">{{ item.value }}</p>
              <view v-if="index === 0 || index === 2" class="active">
                <image class="addIcon" :src="Number(item.add)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
                <text class="add">{{ item.add }}</text>
                <text class="yesterday">(相比昨日)</text>
              </view>
              <view v-else class="other">本月累计</view>
              <image :src="item.imgIcon" class="imgIcon"></image>
            </view>
          </view>
        </div>

        <div class="propOfReven">
          <p class="title">营收占比</p>
          <view class="tabs">
            <view
                v-for="(item, index) in propOfRevenList"
                :key="index"
                :class="selectTab === item.value ? 'active tabItem' : 'tabItem'"
                @click="handleSelectTab(item.value)"
            >
              {{ item.name }}
            </view>
          </view>

          <view class="chart">
            <div v-show="selectTab===1" v-if="modelProgress.length>0&& theRequest.ProvinceCode==340000">
              <div>
                <div class="operation-c-list" v-for="(item,o) in modelProgress" :key="o">
                  <div class="top">
                    <div class="left">
                      <div class="icon">
                        <image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
                        <text>{{o+1}}</text>
                      </div>
                      <p class="name">{{item.name}}</p>
                    </div>
                    <p class="price">{{item.data}}</p>
                  </div>
                  <div class="bottom">
                    <div class="bar">
                      <div class="progress" :style="{width:item.bili+'%'}"></div>
                    </div>
                    <p class="number">{{item.bili+'%'}}</p>
                  </div>
                </div>
              </div>
            </div>
            <div v-show="selectTab===2" v-if="regionProgress.length>0">
              <div>
                <div class="operation-c-list" v-for="(item,o) in regionProgress" :key="o">
                  <div class="top">
                    <div class="left">
                      <div class="icon">
                        <image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
                        <text>{{o+1}}</text>
                      </div>
                      <p class="name">{{item.name}}</p>
                    </div>
                    <p class="price">{{item.data}}</p>
                  </div>
                  <div class="bottom">
                    <div class="bar">
                      <div class="progress" :style="{width:item.bili+'%'}"></div>
                    </div>
                    <p class="number">{{item.bili+'%'}}</p>
                  </div>
                </div>
              </div>
            </div>
            <div v-show="selectTab===3" v-if="areaProgress.length>0">
              <div>
                <div class="operation-c-list" v-for="(item,o) in areaProgress" :key="o">
                  <div class="top">
                    <div class="left">
                      <div class="icon">
                        <image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
                        <text>{{o+1}}</text>
                      </div>
                      <p class="name">{{item.name}}</p>
                    </div>
                    <p class="price">{{item.data}}</p>
                  </div>
                  <div class="bottom">
                    <div class="bar">
                      <div class="progress" :style="{width:item.bili+'%'}"></div>
                    </div>
                    <p class="number">{{item.bili+'%'}}</p>
                  </div>
                </div>
              </div>
            </div>
          </view>
        </div>

        <div class="thisMonth">
          <p class="title">本月计划</p>
          <view class="box">
            <view class="top">
              <view class="big">
                <image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/thisMonth.svg"></image>
              </view>
              <view class="text">
                <view class="textTop">
                  <p class="number">{{plan.percentageMonth?plan.percentageMonth + '%':''}}</p>
                  <p v-if="plan.percentageMonth>=100" class="desc"><image class="success" src="/static/images/index/successMonth.svg"></image>很棒哟,超额完成</p>
                </view>
                <div class="progess">
                  <image class="img" :style="{width: plan.percentageMonth + '%'}"  src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png"></image>
                  <div class=pro :style="{width:(100 - plan.percentageMonth)+ '%'}"></div>
                </div>
              </view>
            </view>
            <view class="bottom">
              <view class="success" style="margin-right: 39px">
                <p class="text">本月已完成<text class="unit">/元</text></p>
                <p class="money">{{plan.RevenueMonth_Amount}}</p>
              </view>
              <view class="success">
                <p class="text">本月计划<text class="unit">/元</text></p>
                <p class="money">{{plan.BudgetMonth_Amount}}</p>
              </view>
            </view>
          </view>
        </div>
        <div class="thisYear" style="margin-top: 0px">
          <p class="title">年度计划</p>
          <view class="box">
            <view class="top">
              <view class="big">
                <image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/planYear.svg"></image>
              </view>
              <view class="text">
                <view class="textTop">
                  <p class="number">{{plan.percentageYear?plan.percentageYear + '%':''}}</p>
                  <p v-if="plan.percentageYear>=100" class="desc" style="color: #4E68FF"><image class="success" src="/static/images/index/yearSuccess.svg"></image>很棒哟,超额完成</p>
                </view>
                <div class="progess">
                  <image class="img" :style="{width: plan.percentageMonth + '%'}"  src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png"></image>
                  <div class=pro :style="{width:(100 - plan.percentageYear)+ '%'}"></div>
                </div>
              </view>
            </view>
            <view class="bottom">
              <view class="success" style="margin-right: 39px">
                <p class="text">年度已完成<text class="unit">/元</text></p>
                <p class="money">{{plan.RevenueYear_Amount}}</p>
              </view>
              <view class="success">
                <p class="text">年度计划<text class="unit">/元</text></p>
                <p class="money">{{plan.BudgetYear_Amount}}</p>
              </view>
            </view>
          </view>
        </div>
      </view>
    </view>
    <div class="notice" v-if="isShow">
        <view class="left">
          <image class="icon" src="/static/images/index/warning.svg"></image>
          <view class="text">
            <p class="name">{{isShowTitle}}个投诉建议</p>
<!--            <p class="desc"></p>-->
          </view>
        </view>
        <view class="right" @click="handleSearch">去查看</view>
    </div>
    <Tabbar ref="tabbar" :page="page"></Tabbar>
  </view>
</template>

<script>
import {getThisDay, handleYesterday, timestampToTime} from "../../util/dateTime";
import {
  mapActions,
  mapGetters,
  mapState
} from 'vuex';
import request from '@/util/index.js'
import uCharts from '@/components/u-charts.js';
import anhuiYestodayRevenueData from '../everdayRenven/components/anhuiYestodayRevenueData'
import Tabbar from "../../components/tabbar/tabbar.vue";
var rincanvas = {};
export default {
  components: {Tabbar},
  data() {
    const lastDay = this.$util.cutDate(new Date(), 'YYYY-MM-DD', -1)

    const nowDay = this.$util.cutDate(new Date(), 'MM月DD日')
    return {
      statusBarHeight:'',
      shopUpload:'',
      page:'/pages/index/index',
      menu:'',
      detailList:[  { name: '长款金额', unit: '/元', price:0 },
        { name: '短款金额', unit: '/元', price: 0 },
        { name: '优惠金额', unit: '/元', price: 0 },
        { name: '移动支付', unit: '', price: 0 },
        { name: '商品出售', unit: '', price: 0 },
        { name: '商品均价', unit: '/元', price: 0 },
        { name: '入区车流', unit: '/辆', price: 0 },
        { name: '入区率', unit: '', price: 0 },
        { name: '停留时长', unit: '', price: 0 },],
      tabTypeList:[ { imgUrl: '/static/images/index/car.svg', path: '', name: '车流画像' },
        { imgUrl: '/static/images/index/guest.svg', path: '', name: '客群画像' },
        { imgUrl: '/static/images/index/business_icon.svg', path: '', name: '经营画像' },
        { imgUrl: '/static/images/index/trade.svg', path: '', name: '交易画像' },
        { imgUrl: '/static/images/index/brand.svg', path: '', name: '业态品牌' },],
      detailTypeList:[{ name: '分润门店', unit: '/个', value: '', add: '', imgIcon: '/static/images/index/store.svg' },
        { name: '驿达分润', unit: '/元', value: '', imgIcon: '/static/images/index/yidaFenrun.svg' },
        { name: '订单配送', unit: '/单', value: '', add: '', imgIcon: '/static/images/index/orderDelivery.svg' },
        { name: '采购金额', unit: '/元', value: '', imgIcon: '/static/images/index/purchaseAmount.svg' },],
      propOfRevenList:[ { name: '经营模式', value: 1 },
        { name: '经营业态', value: 2 },
        { name: '区域经营', value: 3 }],
      selectTab:1,
      single:timestampToTime((new Date(lastDay).getTime())),
      thisDay:'',
      showPage: false,
      opacity: 0, // 背景颜色透明度
      customBarH: this.CustomBar,
      statusBarH: this.StatusBar,
      isLoading: true,
      theRequest: null,
      sevenDate: null,
      lastDay: lastDay, // 该页面的最近有效日期
      nowDay: nowDay,
      headMsg: {},
      showHeadMsg:{},//不变成字符串的headMsg
      today: null, // 今日数据
      regionList: null,
      nowTab: 1,
      carInfo:{},//车流信息
      regionShow1: true,
      regionProgress: null,
      tradeType: null,
      areaProgress: null,
      bayonetProgress: null,
      modelProgress: null,
      isup: true,
      monthPrice:0,//月度累计分润
      yesterdayBillCount:0,//昨日累计配送
      lastDayBillCount:0,//当前日的配送
      buyPriceMonth:0,//月度的采购金额
      totalData:null,
      isInOnLoad:false,
      isShow:false, //投诉建议是否显示
      isShowTitle:0,//投诉建议条数
      plan:{},//月度和年度接口的返回参数 一起的
      ShareShopCountYes:0,//昨日的店铺数
      yesterdayAllPay:0,//前一天的营收总额
      nowDayAllPay:0,//今日营收总额
      wechatPushSalesList: null // 甘肃单品排行数据
    }
  },
  watch:{
    user:{
      handler:function (value){
        console.log('监听user',value)
        this.getData({})
      },
      deep:true
    }
  },
  computed: {
    ...mapState({
      'PushAuthority': (state) => state.userData.PushAuthority,
      'ProvinceCode': (state) => state.userData.ProvinceCode,
      toDoMsg:(state)=>{return state.toDoMsg},
    }),
    hasSeverpartIndexAuthority() {
      let theRequest = this.theRequest
      if (this.theRequest && theRequest.ProvinceCode && this.PushAuthority) {
        return this.PushAuthority.some(n =>
            n.ProvinceCode == theRequest.ProvinceCode && n.ShopAnalysisType == 1
        )
      }
      return false
    },
    ...mapGetters({'user':'getUser'})
  },
   onLoad(option){    // 拿到手机参数
    // if (!this.user.Membership_Id){
    //   uni.login({ // 登录
    //     async success (res) {
    //       console.log('re111s',res)
    //       await this.memberLogin(res.code)
    //     }
    //   })
    // }

    let systemInfo = uni.getSystemInfoSync()
    this.statusBarHeight = Number(systemInfo.statusBarHeight)
    this.menu = uni.getMenuButtonBoundingClientRect()
    const date = new Date(this.lastDay)
    this.thisDay = getThisDay(date.getDay())

    for(let key in this.toDoMsg){
      if (key === 'd405ae13-3388-41c0-a5f6-d11194d0a943' && this.toDoMsg['d405ae13-3388-41c0-a5f6-d11194d0a943']){
        this.isShow = true
        this.isShowTitle = this.toDoMsg['d405ae13-3388-41c0-a5f6-d11194d0a943']
      }
    }
    console.log(1111)
    this.getData(option)
    // if (!this.user.Membership_Id){
    //    this.getLoginCode().then(()=>{
    //      debugger
    //      this.getData(option)
    //    })
    // }else {
    //   this.getData(option)
    // }
  },
  onShow(){
    // if (this.user.Membership_Id && !this.isInOnLoad){
    //   this.onRefresh()
    // }
    uni.hideTabBar()
  },
  onHide(){
    this.isShow = false
  },
  methods:{
    ...mapActions(['memberLogin','getLoginCode']),
    handlePage(){
      this.$util.toNextRoute('navigateTo', '/pages/operatingStatements/index')
    },
    getData(option){
      //老代码
      if (this.user.Membership_Id){
        uni.showLoading({
          title: '正在加载...'
        })
        this.isInOnLoad=true
      }
      console.log('this.user.Membership_Id',this.user.Membership_Id)
      console.log(2222)
      if (option.ProvinceCode) { // 从推送进入
        this.theRequest = option
        option.time = this.$util.cutDate(option.time, 'YYYY-MM-DD')
        option.month = this.$util.cutDate(option.time, 'YYYYMM')

        this.initData()
        this.initYesterdayData()
        //车流分析
        this.getCarInfo()
        //月度计划、年度计划
        this.monthYearPlan()
      } else if (this.user.Membership_Id){ // 默认
        // if (!this.PushAuthority){return}
        // if (this.PushAuthority.length > 0) {
        this.theRequest = this.defaultMsg() || {}
        this.theRequest.time = this.lastDay
        this.theRequest.month = this.$util.cutDate(this.lastDay, 'YYYYMM')
        this.initData()
        this.initYesterdayData()
        //车流分析
        this.getCarInfo()
        //月度计划、年度计划
        this.monthYearPlan()

        // this.bindDateChange(this.lastDay)
        // } else {
        //   uni.hideLoading()
        //   this.theRequest = null
        //   this.isLoading = false
        //   this.showPage = false
        //   this.opacity = 1
        //
        // }
      }
      this.nowTab = this.theRequest.ProvinceCode == 340000 ? 1 : 2
      if (this.theRequest.GroupType == 1010) {
        this.getDetail(this.theRequest)
      }
      // 若省份为甘肃，则加载甘肃单品排行
      if (this.theRequest.ProvinceCode == 620000) {

        this.getRankContent()
      }
    },
    handleReg(){
      this.$util.toNextRoute('redirectTo', '/pages/register/register')
    },
    handleSearch(){
      this.$util.toNextRoute('navigateTo', '/pages/suggestion/suggestion')
    },
    onRefresh(){
      uni.showLoading({
        title: '正在加载...'
      })
      console.log('this.PushAuthority',this.PushAuthority)
      // if (!this.PushAuthority){return}

      // if (this.PushAuthority.length > 0) {
        this.theRequest = this.defaultMsg() || {}
        this.theRequest.time = this.lastDay
        this.theRequest.month = this.$util.cutDate(this.lastDay, 'YYYYMM')
        this.initData()
        this.initYesterdayData()
      // } else {
      //   uni.hideLoading()
      //   this.theRequest = null
      //   this.isLoading = false
      //   this.showPage = false
      //   this.opacity = 1
      // }
      //车流分析
      this.getCarInfo()
      //月度计划、年度计划
      this.monthYearPlan()
      this.nowTab = this.theRequest.ProvinceCode == 340000 ? 1 : 2
      if (this.theRequest.GroupType == 1010) {
        this.getDetail(this.theRequest)
      }
      // 若省份为甘肃，则加载甘肃单品排行
      if (this.theRequest.ProvinceCode == 620000) {

        this.getRankContent()
      }
    },
    monthYearPlan(){
      const monthDate= {
        Province_Code:'340000',
        Statistics_Date:this.lastDay
      }
      request.$webGet('CommercialApi/Revenue/GetRevenueBudget',monthDate).then(res=>{
        this.plan = res.Result_Data
        this.plan.percentageMonth = (res.Result_Data.RevenueMonth_Amount / res.Result_Data.BudgetMonth_Amount*100).toFixed(2)
        this.plan.percentageYear = (res.Result_Data.RevenueYear_Amount / res.Result_Data.BudgetYear_Amount*100).toFixed(2)

        this.plan.RevenueMonth_Amount = this.$util.fmoney(res.Result_Data.RevenueMonth_Amount)
        this.plan.BudgetMonth_Amount = this.$util.fmoney(res.Result_Data.BudgetMonth_Amount)
        this.plan.RevenueYear_Amount = this.$util.fmoney(res.Result_Data.RevenueYear_Amount)
        this.plan.BudgetYear_Amount = this.$util.fmoney(res.Result_Data.BudgetYear_Amount)

      })
    },
    getCarInfo(){
      const data = {
        Statistics_Date:this.lastDay,
        Province_Code:'340000'
      }
      request.$webGet('CommercialApi/Revenue/GetAvgBayonetAnalysis',data).then(res=>{
        this.carInfo = res.Result_Data
        this.carInfo.Vehicle_Count = res.Result_Data.Vehicle_Count
      })
    },
     initYesterdayData(){
      let _this = this
      let yesterday = handleYesterday(this.lastDay)
      const data  = {
        Statistics_Date:yesterday,
        Statistics_Month:this.theRequest.month,
        Province_Code:this.theRequest.ProvinceCode,
        pushProvinceCode:this.theRequest.ProvinceCode,
        Serverpart_ID:this.theRequest.ServerpartIds?this.theRequest.ServerpartIds:'',
        SPRegionType_ID:this.theRequest.GroupType==1020?this.theRequest.ServerpartIds:''
      }
      request.$webGet('CommercialApi/Revenue/GetRevenuePushList',data).then(res=>{
        let cashPay = 0
        res.Result_Data.List.forEach(item=>{
          cashPay= Number(item.CashPay) + cashPay
        })
        _this.yesterdayAllPay = cashPay
      })
      //昨日的分润门店
      request.$webGet('CommercialApi/Revenue/GetMobileShare',data).then(res=>{
        this.ShareShopCountYes = res.Result_Data.ShareShop_Count
      })

       const date = new Date(this.lastDay)
       const y = date.getFullYear()
       let  m = date.getMonth() + 1
       if (m<10){
         m = '0' + m
       }
       //一个月分润门店
       const monthDate={
         Province_Code:'340000',
         StatisticsStartDate:`${y}-${m}-01`,
         StatisticsEndDate:this.lastDay,
       }
       request.$webGet('CommercialApi/Revenue/GetMobileShare',monthDate).then(res=>{
         this.monthPrice = res.Result_Data.Royalty_Price
       })

       //这一日的订单配送
       const todayData = {
         Province_Code:'340000',
         Statistics_Date: this.lastDay
       }
       request.$webGet('CommercialApi/Revenue/GetMallDeliver',todayData).then(res=>{
         this.lastDayBillCount = res.Result_Data.DeliverBill_Count
       })

       //昨日的订单配送
       const deliveData = {
         Province_Code:'340000',
         Statistics_Date: yesterday
       }
       request.$webGet('CommercialApi/Revenue/GetMallDeliver',deliveData).then(res=>{
         this.yesterdayBillCount = res.Result_Data.DeliverBill_Count
       })

       //一个月的采购金额
       const buyPrice = {
         Province_Code:'340000',
         StatisticsStartDate:`${y}-${m}-01`,
         StatisticsEndDate:this.lastDay
       }
       request.$webGet('CommercialApi/Revenue/GetMallDeliver',buyPrice).then(res=>{
         this.buyPriceMonth = res.Result_Data.Deliver_Price
       })
    },
    defaultMsg() {
      let option = null
      let _this = this
      if (this.PushAuthority && this.PushAuthority.length > 1) {
        option = this.PushAuthority.find(n => n.ProvinceCode === _this.ProvinceCode)
      }else if(this.user.Membership_Id){
        option = {GroupType: 1000,
          ProvinceCode: 340000,
          ServerpartIds: "",
          ShopAnalysisType: 1}
      }
      else {

      }
      return {
        ...option
      }
    },
    handleSelectTab(value){
      this.selectTab = value
    },
    bindDateChange(e){
      const date = new Date(e.detail.value).getTime()
      this.single = timestampToTime(date)
      this.lastDay = e.detail.value
      this.thisDay = getThisDay(new Date(e.detail.value).getDay())
      this.onRefresh()
    },
    showPie(obj) {
      let data = {
        series: []
      }
      const ctx = uni.createCanvasContext(obj.id, this);
      data.series = data.series.concat(obj.data)
      rincanvas[obj.id] = new uCharts({
        // 小程序图表工具
        // $this: this,
        // canvasId: obj.id,
        context: ctx,
        color: obj.colors,
        type: 'ring',
        fontSize: 12,
        padding: [15, 15, 25, 15],
        legend: {
          show: false,
          padding: 5,
          lineHeight: 11,
          margin: 0,
        },
        background: '#FFFFFF',
        pixelRatio: 1,
        series: data.series,
        animation: false,
        width: uni.upx2px(686),
        height: uni.upx2px(510),
        dataLabel: true,
        extra: {
          ring: {
            ringWidth: 40,
            labelWidth: 16,
            border: true,
            borderWidth: 1,

            borderColor: '#fff'
          }
        },
      });
    },
    getBayonetData(data) {
      var _data1 = [];
      let _this = this

      data.forEach((n, i) => {
        var childData = [];
        n.spList.forEach((m, i) => {
          // 获取服务区各个方位的入区信息
          var _list = [];
          m.regionList.forEach((o, i) => {
            _list.push({
              name: o.name,
              data: o.Vehicle_Count,
              flow: o.SectionFlow_Count,
              bili: o.SectionFlow_Count == 0 ? 100 : _this.$util.fmoney(
                  (o.Vehicle_Count / o.SectionFlow_Count) * 100, 2),
              MinVehicle_Count: o.MinVehicle_Count,
              MediumVehicle_Count: o.MediumVehicle_Count,
              LargeVehicle_Count: o.LargeVehicle_Count
            });
          });
          _list.sort(function(a, b) {
            return b.bili - a.bili
          })

          childData.push({
            name: m.name,
            data: m.Vehicle_Count, //+Number(data2[n[0]])
            flow: m.SectionFlow_Count,
            bili: m.SectionFlow_Count == 0 ? 0 : _this.$util.fmoney(
                (m.Vehicle_Count / m.SectionFlow_Count) * 100, 2),
            list: _list
          });
        });
        childData.sort(function(a, b) {
          return b.bili - a.bili
        })

        _data1.push({
          name: n.name,
          index: n.index,
          list: childData
        });
      });
      _data1.sort(function(a, b) {
        return a.index - b.index
      })

      return [_data1];
    },
    getProgressData(data, total) {
      var _data1 = [];
      var _data2 = [];
      let _this = this
      data.forEach((n, i) => {

        _data1.push({
          ...n,
          textColor: '#999',
          formatter: function(arg) {

            if (typeof arg === 'number') {
              return [n.name, (arg * 100).toFixed(2) + '%']
            } else {
              return [arg.name, (arg._proportion_ * 100).toFixed(2) + '%']
            }

          }
        });

        _data2.push({
          name: n.name,
          num: n.data,
          data: _this.$util.fmoney(n.data, 2), //+Number(data2[n[0]])
          bili: _this.$util.fmoney((n.data / total) * 100, 2)
        });

      });
      _data1.sort(function(a, b) {
        return b.data - a.data
      })
      _data2.sort(function(a, b) {
        return b.num - a.num
      })
      return [_data2, _data1];
    },
    async initData() { // 初始化营收数据
      let _this = this
      const [reginList, totalData, busniessTypePie, busniessTradePie, busniessAreaPie, bayonetPie] =
          await anhuiYestodayRevenueData.getData(this.theRequest) // 获取实时数据
          this.nowDayAllPay=totalData.cashPay
      console.log('totalData',totalData)


      // yesterdayRequest.time = yesterday
      // //获取昨日的实时数据
      // const [yesterdayReginList, yesterdayTotalData, yesterdayBusniessTypePie, yesterdayBusniessTradePie, yesterdayBusniessAreaPie, yesterdayBayonetPie] =
      //     await anhuiYestodayRevenueData.getData(yesterdayRequest) // 获取实时数据
      // console.log('totalData',totalData)
      // console.log('yesterdayTotalData',yesterdayTotalData)

      if (this.theRequest.GroupType !== 1010) {
        this.regionList = reginList // 营收上传列表 reginListModel[]
      }
      // 组合及格式化 头部卡片总营收数据。
      totalData.tickave = totalData.ticketCount > 0 ? this.$util.fmoney(
          totalData.cashPay / totalData.ticketCount, 2) : 0
      totalData.countave = totalData.totalCount > 0 ? this.$util.fmoney(
          totalData.cashPay / totalData.totalCount, 2) : 0
      totalData.totalMoneyShow = this.$util.fmoney(totalData.cashPay) // 营收总数据格式化
      totalData.dayOfShow = this.$util.cutDate(this.theRequest.time, 'MM月DD日') // 当前日期
      totalData.budgetamoutShow = totalData.budgetAmount ?
          _this.$util.fmoney(totalData.budgetAmount) : 0.00 // 预算总营收

      busniessTypePie.forEach((n, i) => {
        if (n.name === '自营') {
          // 预算和实际差额
          totalData.diffBudgetTotal = Math.abs(totalData.budgetAmount - n.data)
          // 预算和实际增长额比例
          totalData.diffBili = totalData.budgetAmount > 0 ?
              this.$util.fmoney((totalData.diffBudgetTotal /
                  totalData.budgetAmount) * 100, 2) : '100'
        }
      });
      this.headMsg = totalData
      console.log('this.headMsginitData',this.headMsg)
      // 饼图分析及数据条形分析
      const [progressList, pieList] = this.getProgressData(busniessTypePie, totalData.cashPay)
      this.modelProgress = progressList
      // 经营类型分析
      var colors1 = ['#FFAC37', '#6B75B8'];
      // console.log(pieList)
      this.showPie({
        id: 'modelCont',
        data: pieList,
        colors: colors1,
      });
      // 经营业态

      // 饼图分析及数据条形分析
      const [tprogressList, tpieList] = this.getProgressData(busniessTradePie, totalData.cashPay)

      this.regionProgress = tprogressList
      // 经营类型分析
      var colors2 = ['#5E67B4', '#4E5699', '#75B7AD', '#AFB7E6'];
      this.showPie({
        id: 'businessCont',
        data: tpieList,
        colors: colors2,
      });

      // 饼图分析及数据条形分析
      const [aprogressList, apieList] = this.getProgressData(busniessAreaPie, totalData.cashPay)
      this.areaProgress = aprogressList
      // 区域营收分析
      var colors3 = ['#FFAC37', '#d8ece9', '#f7f5f6', '#b2b7e3', '#F4B27A', '#F3B1C9', '#e0e3f7', '#FFE886', '#f7f5f6'];
      this.showPie({
        id: 'areaCont',
        data: apieList,
        colors: colors3,
      });

      // 安徽省本级显示的内容
      if (this.theRequest.GroupType == 1000 && this.theRequest.ProvinceCode == 340000) {
        // 显示片区车流量数据分析
        const [bayonetList] = this.getBayonetData(bayonetPie)
        this.bayonetProgress = bayonetList
      }

      if (reginList.length) {
        this.showPage = true
      }
      this.isLoading = false
      this.todayAmount()
      this.isInOnLoad = true
      uni.hideLoading()
    },
     todayAmount() {
      let _this = this
      // let theRequest = this.theRequest
      //最近日
      // this.$request.$get('getCurRevenue', {
      //   pushProvinceCode: theRequest.ProvinceCode,
      //   serverPartId: theRequest.GroupType == 1000 ? '' : theRequest.ServerpartIds
      // }).then(res => {
      //   if (res.ResultCode != 100) return
      //
      //   let avrticket = (res.Data.TOTALTICKET != 0 && res.Data.TOTALPRICE != 0) ? res.Data.TOTALPRICE /
      //       res.Data
      //           .TOTALTICKET : 0
      //   _this.today = {
      //     timeMoney: this.$util.fmoney(res.Data.TOTALPRICE, 2),
      //     totalTicketCount: res.Data.TOTALTICKET,
      //     avrticketCount: this.$util.fmoney(avrticket, 2),
      //   }
      //   _this.$forceUpdate()
      // })
        //分润门店
        this.detailTypeList[0].value =this.headMsg.shareShopCount
        //驿达分润 由于数据现成 这样写最方便
        this.detailTypeList[1].value = this.$util.fmoney(this.monthPrice)
        this.detailTypeList[0].add = this.headMsg.shareShopCount - this.ShareShopCountYes
        this.detailTypeList[3].value = this.$util.fmoney(this.buyPriceMonth)
        this.detailTypeList[2].value = this.lastDayBillCount
        this.detailTypeList[2].add = this.lastDayBillCount - this.yesterdayBillCount
        this.showHeadMsg = this.headMsg
        this.showHeadMsg.averagePrice = Number(this.nowDayAllPay) / Number(this.headMsg.ticketCount)
        this.showHeadMsg.compared = ((Number(this.nowDayAllPay) - this.yesterdayAllPay) / this.yesterdayAllPay) * 100
        for (let i in this.showHeadMsg) {
          if (i === 'ticketCount' || i === 'uploadState'){
            this.showHeadMsg[i] = this.showHeadMsg[i]
          }else{
            this.showHeadMsg[i] = this.$util.fmoney(this.showHeadMsg[i], 2)
          }
        }
        console.log(this.showHeadMsg)
        _this.$forceUpdate()

    },
    getDetail(obj) {
      let _this = this
      this.$request.$webGet('CommercialApi/Revenue/GetServerpartEndAccountList', {
        Serverpart_ID: obj.ServerpartIds,
        pushProvinceCode: obj.ProvinceCode,
        Statistics_Date: obj.time,

      }).then(res => {
        if (res.Result_Code != 100) return
        res.Result_Data.ShopEndaccountList.map(n => {
          n.show = false
          n.detail = this.getListDetail(n)
        })

        _this.regionList = res.Result_Data.ShopEndaccountList
      })
    },
    async getRankContent() { // 甘肃需要单品排行显示
      const {
        ProvinceCode,
        time
      } = this.theRequest

      const data = await this.$request.$webGet('CommercialApi/Revenue/GetWechatPushSalesList', {
        pushProvinceCode: ProvinceCode,
        Statistics_Date: time
      })

      if (data.Result_Code === 100 && data.Result_Data.TotalCount > 0) {
        this.wechatPushSalesList = {}
        data.Result_Data.List.forEach(n => {
          this.wechatPushSalesList[n.Data_Type]= n.GoodsList
        })

      } else {
        this.wechatPushSalesList = {}
      }
      this.$forceUpdate()
    },
  }
}
</script>

<style scoped lang="scss">
$iphoneHeight: env(safe-area-inset-bottom);
.main {
  min-height: 100vh;
  width: 100%;
  padding-bottom: calc(44px + env(safe-area-inset-bottom));
  .header {
    width: 100%;
    height: 512px;
    box-sizing: border-box;
    padding: 0 16px;
    position: relative;
    .headerBg {
      width: 100%;
      height: 512px;
      position: absolute;
      left: 0;
      top: 0;
    }
    .headerTop{
      width: 100%;
      background: linear-gradient(315deg, #FFAF95 0%, #FFD6A6  100%);
      position: fixed;
      top: 0;left:0;
      box-sizing: border-box;
      padding: 0 15px;
      z-index:9999999;
      .selectTime {
        position: absolute;
        display: flex;
        align-items: center;
        .dateIcon {
          width: 16px;
          height: 16px;
          margin-right: 4px;
        }
        .time {
          display: flex;
          align-items: center;
          margin-right: 4px;
          .day {
            font-size: 32rpx;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #782717;
            line-height: 44rpx;
            margin-right: 4px;
          }
          .uni-input {
            font-size: 24rpx;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #ae664e;
            line-height: 36rpx;
          }
          .icon {
            width: 24px;
            height: 16px;
          }
        }
      }
    }
    .other {
      width: calc(100% - 32px);
      position: absolute;
      top: 104px;
      .title {
        font-size: 28rpx;
        font-family: PingFangSC-Semibold, PingFang SC;
        font-weight: 600;
        color: #782717;
        line-height: 40rpx;
        .text {
          font-size: 28rpx;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: #782717;
          line-height: 40rpx;
          margin-left: 8px;
        }
      }
      .box {
        display: flex;
        align-items: center;
        .allPrice {
          font-size: 56rpx;
          font-family: DINAlternate-Bold, DINAlternate;
          font-weight: bold;
          color: #782717;
          line-height: 64rpx;
          margin-top: 4px;
        }
        .start {
          width: 14px;
          height: 14px;
          margin-left: 8px;
        }
      }

      .addBox {
        margin-top: 5px;
        display: flex;
        align-items: center;
        .arrowTop {
          width: 14px;
          height: 14px;
          margin-right: 4px;
        }
        .text {
          font-size: 28rpx;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: #782717;
          line-height: 40rpx;
          margin-right: 4px;
        }
        .compare {
          font-size: 28rpx;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: #c97e64;
          line-height: 40rpx;
        }
      }
      .type {
        width: 100%;
        height: 45px;
        margin-top: 24px;
        .item {
          width: 50%;
          display: flex;
          align-items: center;
          float: left;
          .leftImg {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            overflow: hidden;
            margin-right: 8px;
            background: #fff;
            image {
              width: 100%;
              height: 100%;
            }
          }
          .right {
            .typeName {
              font-size: 28rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #782717;
              line-height: 40rpx;
              .unit {
                font-size: 28rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #c97a63;
                line-height: 40rpx;
                margin-left: 4px;
              }
            }
            .price {
              font-size: 36rpx;
              font-family: DINAlternate-Bold, DINAlternate;
              font-weight: bold;
              color: #782717;
              line-height: 44rpx;
              margin-top: 2px;
            }
          }
        }
      }
      .detail {
        width: 100%;
        height: 190px;
        box-sizing: border-box;
        padding: 16px 0;
        background: linear-gradient(135deg, #fff2df 0%, #ffe3e5 100%);
        box-shadow: 0rpx 0rpx 40rpx 0rpx rgba(244, 138, 143, 0.21);
        border-radius: 8rpx;
        margin-top: 24px;
        margin-bottom: 16px;
        .detailItem {
          width: 33%;
          box-sizing: border-box;
          padding-left: 16px;
          height: 42px;
          text-align: left;
          float: left;
          margin-bottom: 16px;
          .itemName {
            font-size: 14px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #782717;
            opacity: 0.8;
            line-height: 40rpx;
            margin-bottom: 2px;
            .itemUnit {
              font-size: 28rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #c99f8f;
              line-height: 40rpx;
            }
          }
          .price {
            font-size: 16px;
            font-family: DINAlternate-Bold, DINAlternate;
            font-weight: bold;
            color: #782717;
            line-height: 40rpx;
          }
        }
      }
    }
  }
  .menu {
    width: 100vw;
    position: relative;
    box-sizing: border-box;
    padding-top: 16px;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    overflow: hidden;
    background: #fff;
    top: -16px;
    z-index: 1;
    .topBg {
      position: absolute;
      width: 100vw;
      height: 104px;
      top: 0;
      left: 0;
      z-index: 2;
    }
    .content {
      padding: 0 16px;
      margin: 0 auto;
      z-index: 3;
      .tabType{
        width: 100%;
        display: flex;
        justify-content: space-between;
        .item {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          .big {
            width: 48px;
            height: 48px;
            background: #ffffff;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            margin-bottom: 8px;
            z-index: 10;
            .img {
              width: 30px;
              height: 30px;
            }
          }
          .name {
            font-size: 24rpx;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #160002;
            line-height: 32rpx;
          }
        }
      }
      .detailType{
        width: 100%;
        margin-top: 24px;
        box-sizing: border-box;
        display: flex;
        flex-wrap: wrap;
        .item {
          width: calc((100% - 8px) / 2);
          padding: 12px;
          box-sizing: border-box;
          background: #f9f6f6;
          margin-bottom: 8px;
          border-radius: 8px;
          .box {
            width: 100%;
            height: 100%;
            position: relative;
            .imgIcon {
              width: 30px;
              height: 30px;
              position: absolute;
              top: 0;
              right: 0;
            }
            .other {
              font-size: 24rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #a69e9f;
              line-height: 36rpx;
              margin-left: 2px;
            }
            .title {
              font-size: 28rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #786b6c;
              line-height: 40rpx;
              .unit {
                font-size: 28rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #a69e9f;
                line-height: 40rpx;
                margin-left: 2px;
              }
            }
            .money {
              font-size: 32rpx;
              font-family: DINAlternate-Bold, DINAlternate;
              font-weight: bold;
              color: #160002;
              line-height: 40rpx;
              margin-top: 2px;
              margin-bottom: 12px;
            }
            .active {
              display: flex;
              align-items: center;
              .addIcon {
                width: 16px;
                height: 16px;
                margin-right: 2px;
              }
              .add {
                font-size: 24rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #fa5151;
                line-height: 32rpx;
              }
              .yesterday {
                font-size: 24rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #a69e9f;
                line-height: 36rpx;
                margin-left: 2px;
              }
            }
          }
        }
        .item:nth-of-type(1),
        .item:nth-of-type(3) {
          margin-right: 8px;
        }
        .item:nth-of-type(3),
        .item:nth-of-type(4) {
          margin-bottom: 0px;
        }
      }
      .propOfReven{
        width: 100%;
        margin-top: 28px;
        .title {
          font-size: 32rpx;
          font-family: PingFangSC-Semibold, PingFang SC;
          font-weight: 600;
          color: #160002;
          line-height: 44rpx;
          text-align: left;
          margin-bottom: 12px;
        }
        .tabs {
          width: 100%;
          height: 38px;
          box-sizing: border-box;
          padding: 4px;
          background: #f2f1f1;
          border-radius: 4px;
          display: flex;
          justify-content: space-between;
          .tabItem {
            font-size: 28rpx;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #786b6c;
            padding: 5px 26px;
            line-height: 40rpx;
          }
          .active {
            font-size: 28rpx;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #160002;
            line-height: 40rpx;
            background: #fff;
            border-radius: 4px;
          }
        }
        .chart {
          width: 100%;
          margin-top: 12px;
          .operation-c-list{
            width:100%;
            margin-bottom: 12px;
            .top{
              width: 100%;
              margin-bottom: 2px;
              display: flex;
              justify-content: space-between;
              align-items: center;
              .left{
                display: flex;
                justify-content: space-between;
                .icon{
                  width: 20px;
                  height: 20px;
                  position: relative;
                  margin-right: 8px;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  image{
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 0;left: 0;
                  }
                  text{
                    z-index:99;
                    font-size: 24rpx;
                    font-family: DINAlternate-Bold, DINAlternate;
                    font-weight: bold;
                    color: #FFFFFF;
                  }
                }
                .name{
                  font-size: 28rpx;
                  font-family: PingFangSC-Regular, PingFang SC;
                  font-weight: 400;
                  color: #160002;
                  line-height: 40rpx;
                }
              }
              .price{
                font-size: 28rpx;
                font-family: PingFangSC-Semibold, PingFang SC;
                font-weight: 600;
                color: #160002;
                line-height: 40rpx;
              }
            }
            .bottom{
              width: 100%;
              display: flex;
              justify-content: space-between;
              align-items: center;
              .bar{
                width: 70%;
                height: 8px;
                background: #F5F2F2;
                border-radius: 5px;
                position: relative;
                .progress{
                  height: 100%;
                  background: #1777FF;
                  border-radius: 5px;
                  opacity: 0.9;
                  position: absolute;
                  top: 0;left: 0;
                }
              }
              .number{
                font-size: 28rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #786B6C;
                line-height: 40rpx;
              }
            }
          }
        }
      }
      .thisMonth,.thisYear{
        width: 100%;
        margin-top: 28px;
        padding-bottom: 28px;
        .title {
          font-size: 32rpx;
          font-family: PingFangSC-Semibold, PingFang SC;
          font-weight: 600;
          color: #160002;
          line-height: 44rpx;
        }
        .box {
          width: 100%;
          padding: 12px 16px;
          box-sizing: border-box;
          border-radius: 8px;
          background: #f5f2f2;
          margin-top: 12px;
          .top {
            display: flex;
            .big {
              width: 40px;
              height: 40px;
              background: #ffffff;
              border-radius: 8px;
              border: 1px solid #ebebeb;
              display: flex;
              justify-content: center;
              align-items: center;
              margin-right: 8px;
              .icon {
                width: 20px;
                height: 20px;
              }
            }
            .text {
              flex: 1;
              padding: 2px 0;
              .textTop{
                display: flex;
                align-items: center;
                .number {
                  font-size: 36rpx;
                  font-family: DINAlternate-Bold, DINAlternate;
                  font-weight: bold;
                  color: #150002;
                  line-height: 40rpx;
                }
                .desc{
                  display: flex;
                  align-items: center;
                  margin-left: 8px;
                  font-size: 14px;
                  color: #FF7043;
                  .success{
                    width: 20px;
                    height: 20px;
                    margin-right: 4px;
                  }
                }
              }

              .progess{
                width: 100%;
                height: 8px;
                border-radius: 5px;
                background: #fff;
                margin-top: 8px;
                position: relative;
                overflow: hidden;
                .pro{
                  position: absolute;
                  right: 0;
                  height: 8px;
                  background: #fff;
                }
                .img{
                  height: 100%;
                  border-radius: 5px;
                  overflow: hidden;
                  position: absolute;
                  left: 0;
                }
              }
            }
          }
          .bottom {
            display: flex;
            margin-top: 16px;
            padding-left: 48px;
            .success {
              .text {
                font-size: 28rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #786b6c;
                line-height: 40rpx;
                margin-bottom: 2px;
                .unit {
                  font-size: 28rpx;
                  font-family: PingFangSC-Regular, PingFang SC;
                  font-weight: 400;
                  color: #a69e9f;
                  line-height: 40rpx;
                  margin-left: 2px;
                }
              }
              .money {
                font-size: 28rpx;
                font-family: PingFangSC-Semibold, PingFang SC;
                font-weight: 600;
                color: #160002;
                line-height: 40rpx;
              }
            }
          }
        }
      }
    }
  }
  .notice{
    position: fixed;
    bottom: 120px;
    left: 5%;
    width: 90%;
    padding: 10px 10px;
    box-sizing: border-box;
    border-radius: 10px;
    z-index:999999;
    background: #2c71f9;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .left {
      display: flex;
      align-items: center;
      .icon {
        width: 40px;
        height: 40px;
        margin-right: 10px;
      }
      .text {
        margin-left: 8px;
        .name {
          font-size: 14px;
          font-family: PingFangSC-Semibold, PingFang SC;
          font-weight: 600;
          color: #ffffff;
          line-height: 20px;
        }
        .desc {
          font-size: 12px;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: #B5CDFC;
          line-height: 18px;
        }
      }
    }
    .right {
      border: 1px solid #fff;
      padding: 2px 6px;
      font-size: 14px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      border-radius: 11px;
      color: #ffffff;
    }
  }

}

</style>
