<template>
  <div class="home">
    <div class="record_date">
      <el-row>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                总用户数
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="所有状态为正常的用户数"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ tableData.allCount ? tableData.allCount : 0 }}</span
                >人
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                今日新增
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="创建时间为今日的用户数"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  tableData.dayAddUser ? tableData.dayAddUser : 0
                }}</span
                >人
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                本月新增
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="创建时间为本月的用户数"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  tableData.monthAddUser ? tableData.monthAddUser : 0
                }}</span
                >人
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                本年新增
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="创建时间为本年的用户数"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  tableData.yearAddUser ? tableData.yearAddUser : 0
                }}</span
                >人
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                今日外卖收入
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(派送中+待取餐+已完成 的已支付订单)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>

              <div class="text_color">
                <span>{{ tableData.dayIncome ? tableData.dayIncome : 0 }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                本月外卖收入
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(派送中+待取餐+已完成 的已支付订单)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  tableData.monthIncome ? tableData.monthIncome : 0
                }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                本年外卖收入
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(派送中+待取餐+已完成 的已支付订单)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  tableData.yearIncome ? tableData.yearIncome : 0
                }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                今日外卖接单数量
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(派送中+待取餐+已完成 的已支付订单)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  tableData.indentCount ? tableData.indentCount : 0
                }}</span
                >笔
              </div>
            </div>
          </div>
        </el-col>
      </el-row>
      <div style="display: flex;align-items: center;">
        <el-select
          v-model="flag"
          style="width:150px;margin-left: 10px;"
          @change="orderfenxi"
        >
          <el-option
            v-for="item in flags"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option> </el-select
        >&nbsp;&nbsp;&nbsp;

        <el-date-picker
          v-show="flag == 'hour'"
          style="margin-left: 20px;"
          type="datetimerange"
          v-model="hour"
          format="yyyy-MM-dd HH:mm:ss"
          value-format="yyyy-MM-dd HH:mm:ss"
          range-separator="-"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
          unlink-panels
          @change="animeOrder"
        >
        </el-date-picker>
        <el-date-picker
          v-show="flag != 'hour'"
          style="width: 200px;margin-left: 10px;"
          v-model="info.stockDate"
          align="right"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择开始时间"
          @change="animeOrder"
        >
        </el-date-picker>
      </div>
      <el-tabs
        v-model="activeName"
        @tab-click="handleClick"
        style="margin-left: 10px;"
      >
        <el-tab-pane label="外卖分析" name="first">
          <el-row v-loading="tableDataLoading1">
            <!-- <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    今日微信商户号实时金额
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(今日微信商户号实时金额)(按支付时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ taskStat.sumMoney ? taskStat.sumMoney : 0 }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col> -->
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    订单总金额
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(待接单+待结算+待取餐+派送中+已完成+商家待接单+制作中 状态的已支付订单)(按支付时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ taskStat.sumMoney ? taskStat.sumMoney : 0 }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    订单数量
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(待接单+待结算+待取餐+派送中+已完成+商家待接单+制作中 状态的已支付订单)(按支付时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{
                      taskStat.countOrder ? taskStat.countOrder : 0
                    }}</span
                    >单
                  </div>
                </div>
              </div>
            </el-col>

            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    到店订单数
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(待接单+待结算+待取餐+派送中+已完成+商家待接单+制作中 状态的到店已支付订单)(按支付时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{
                      taskStat.takeCount ? taskStat.takeCount : 0
                    }}</span
                    >单
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    外卖订单数
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(待接单+待结算+待取餐+派送中+已完成+商家待接单+制作中 状态的外卖已支付订单)(按支付时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>

                  <div class="text_color">
                    <span>{{
                      taskStat.takeCount2 ? taskStat.takeCount2 : 0
                    }}</span
                    >单
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    到店订单金额
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(待接单+待结算+待取餐+派送中+已完成+商家待接单+制作中 状态的到店已支付订单)(按支付时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>

                  <div class="text_color">
                    <span>{{
                      taskStat.takeMoney ? taskStat.takeMoney : 0
                    }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    外卖订单金额
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(待接单+待结算+待取餐+派送中+已完成+商家待接单+制作中 状态的外卖已支付订单)(按支付时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>

                  <div class="text_color">
                    <span>{{
                      taskStat.takeMoney1 ? taskStat.takeMoney1 : 0
                    }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    退款订单数
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(商家拒单+已取消 状态的订单)(按订单创建时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>

                  <div class="text_color">
                    <span>{{
                      taskStat.cancelOrderCount ? taskStat.cancelOrderCount : 0
                    }}</span
                    >单
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    退款金额
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(商家拒单+已取消 状态的订单)(按订单创建时间)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>

                  <div class="text_color">
                    <span>{{
                      taskStat.cancelOrderMoney ? taskStat.cancelOrderMoney : 0
                    }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="用户分析" name="yonghu">
          <el-row v-loading="tableDataLoading2">
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">总用户</div>
                  <div class="text_color">
                    <span>{{
                      tableDataNew.allUserCount ? tableDataNew.allUserCount : 0
                    }}</span
                    >人
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">手机号用户</div>
                  <div class="text_color">
                    <span>{{
                      tableDataNew.phoneUserCount
                        ? tableDataNew.phoneUserCount
                        : 0
                    }}</span
                    >人
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="商铺统计" name="mendian">
          <el-row v-loading="tableDataLoading3">
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">新增商铺</div>
                  <div class="text_color">
                    <span>{{
                      tableData4.newShopCount ? tableData4.newShopCount : 0
                    }}</span
                    >个
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="外卖收入分析" name="fourth">
          <el-table v-loading="tableDataLoading" :data="tableData2.list">
            <el-table-column prop="shopName" label="商户名"> </el-table-column>

            <el-table-column prop="userName" label="下单用户">
              <template slot-scope="scope">
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  @click="updates2(scope.row)"
                  >{{ scope.row.userName ? scope.row.userName : "null" }}</span
                >
              </template>
            </el-table-column>
            <el-table-column prop="payMoney" label="支付金额">
            </el-table-column>
            <el-table-column prop="payTime" label="创建时间"> </el-table-column>
          </el-table>
          <div style="text-align: center;margin-top: 10px;float:right">
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :page-sizes="[10, 20, 30, 50, 100]"
              :page-size="limit"
              :current-page="page"
              layout="total,sizes, prev, pager, next"
              :total="tableData2.totalCount"
            >
            </el-pagination>
          </div>
        </el-tab-pane>
        <el-tab-pane label="商铺收益排行" name="mendianTop">
          <div style="display: flex;align-items: center;">
            <el-select
              v-model="spEarningTypeId"
              style="width:200px;"
              @change="spEarningClick"
              :clearable="true"
            >
              <el-option
                v-for="item in spEarnings"
                :key="item.id"
                :label="item.shopTypeName"
                :value="item.id"
              >
              </el-option>
            </el-select>
            <el-button
              style="margin: 0 20px 0 15px;"
              size="medium"
              type="primary"
              icon="document"
              @click="exportList"
            >
              导出
            </el-button>
            <span style="font-size: 18px;margin-right: 20px;">总收益 : {{ shopEarnings }}</span>
            <span style="font-size: 18px">实际总收入 : {{ shopIncomeMoney }}</span>
          </div>
          <el-table v-loading="tableDataLoading" :data="tableData3.list">
            <el-table-column prop="shopId" label="编号" width="80">
            </el-table-column>
            <el-table-column prop="shopName" label="商铺名称">
            </el-table-column>
            <el-table-column prop="rank" label="排名"> </el-table-column>
            <el-table-column prop="shopMoney" label="收益" width="200">
            </el-table-column>
            <el-table-column prop="shopIncomeMoney" label="实际收入" width="200">
            </el-table-column>
            <el-table-column prop="payTime" label="操作">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="primary"
                  @click="updates3(scope.row)"
                  style="margin: 5px 0;"
                  >商品列表</el-button
                >
                <el-button
                  size="mini"
                  type="primary"
                  @click="updates4(scope.row)"
                  style="margin: 5px 0;"
                  >订单列表</el-button
                >
                <el-button
                  size="mini"
                  type="primary"
                  @click="updates(scope.row)"
                  style="margin: 5px 0;"
                  >收入统计</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <div style="text-align: center;margin-top: 10px;float:right">
            <el-pagination
              @size-change="handleSizeChange1"
              @current-change="handleCurrentChange1"
              :page-sizes="[10, 20, 30, 50, 100]"
              :page-size="limit"
              :current-page="page"
              layout="total,sizes, prev, pager, next"
              :total="tableData3.totalCount"
            >
            </el-pagination>
          </div>
        </el-tab-pane>
        <el-tab-pane label="跑腿订单分析" name="dingdan">
          <el-row v-loading="tableDataLoading4">
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    累计订单
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(跑腿订单总数)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ orderStat.i ? orderStat.i : 0 }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    付款订单
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(已支付的跑腿订单总数)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ orderStat.i1 ? orderStat.i1 : 0 }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    接单订单
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(骑手已接单的跑腿订单总数)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ orderStat.i2 ? orderStat.i2 : 0 }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    进行中订单
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(骑手已取货/购买的跑腿订单总数)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ orderStat.i3 ? orderStat.i3 : 0 }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    已完成订单
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(已完成的跑腿订单总数)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ orderStat.i4 ? orderStat.i4 : 0 }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    已取消订单
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(已取消的跑腿订单总数)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ orderStat.i5 ? orderStat.i5 : 0 }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="跑腿任务分析" name="renwu">
          <el-row v-loading="tableDataLoading5">
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    发单总金额
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(已支付+已接单+已取货+已完成 跑腿订单总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{
                      taskStatPt.billMoney ? taskStatPt.billMoney : 0
                    }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    接单总金额
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(已接单+已取货+已完成 跑腿订单总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{
                      taskStatPt.receivingMoney ? taskStatPt.receivingMoney : 0
                    }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    发单数量
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(已支付+已接单+已取货+已完成 跑腿订单总数量)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{
                      taskStatPt.billCount ? taskStatPt.billCount : 0
                    }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    接单数量
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(已接单+已取货+已完成 跑腿订单总数量)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{
                      taskStatPt.reveivingCount ? taskStatPt.reveivingCount : 0
                    }}</span
                    >笔
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="跑腿任务收入分析" name="ptfourth">
          <el-table v-loading="tableDataLoading" :data="tableData5.list">
            <el-table-column prop="title" label="任务类型">
              <template slot-scope="scope">
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  v-if="scope.row.indentType == 1"
                  >帮我送</span
                >
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  v-if="scope.row.indentType == 2"
                  >帮我取</span
                >
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  v-if="scope.row.indentType == 3"
                  >同城帮买</span
                >
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  v-if="scope.row.indentType == 4"
                  >同城服务</span
                >
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  v-if="scope.row.indentType == 5"
                  >同城外卖</span
                >
              </template>
            </el-table-column>
            <el-table-column prop="shipUserName" label="派单人姓名">
              <template slot-scope="scope">
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  @click="updates1(scope.row.userId)"
                  >{{ scope.row.nickName ? scope.row.nickName : "null" }}</span
                >
              </template>
            </el-table-column>
            <el-table-column prop="nickName2" label="接单人姓名">
              <template slot-scope="scope">
                <span
                  style="color: #4f9dec;cursor: pointer;"
                  @click="updates1(scope.row.riderUserId)"
                  >{{
                    scope.row.riderNickName ? scope.row.riderNickName : "null"
                  }}</span
                >
              </template>
            </el-table-column>
            <el-table-column prop="platformMoney" label="平台收入">
            </el-table-column>
            <el-table-column prop="createTime" label="创建时间">
            </el-table-column>
          </el-table>
          <div style="text-align: center;margin-top: 10px;float:right">
            <el-pagination
              @size-change="handleSizeChange2"
              @current-change="handleCurrentChange2"
              :page-sizes="[5, 10, 15, 20]"
              :page-size="limit"
              :current-page="page"
              layout="total,sizes, prev, pager, next,jumper"
              :total="tableData5.totalCount"
            >
            </el-pagination>
          </div>
        </el-tab-pane>
        <el-tab-pane label="跑腿平台收入统计" name="pingtai">
          <el-row v-loading="tableDataLoading6">
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    总收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(总收入=服务费+保价费+扣除骑手保证金)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.allMoneySum }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    服务费收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(服务费=帮我取+帮我买+同城外卖+同城服务)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.serviceMoneySum }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    同城外卖收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(跑腿订单状态为已完成的跑腿订单平台收入总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{
                      platformData.tcwmMoneySum ? platformData.tcwmMoneySum : 0
                    }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    保价费收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(跑腿订单状态为已完成的跑腿订单保价费总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.cargoInsurance }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    扣除骑手保证金收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(申诉未通过的骑手投诉订单总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.deductMoneySum }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>

            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    同城服务收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(跑腿订单状态为已完成的跑腿订单平台收入总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.fourthMoneySum }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    帮我送收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(跑腿订单状态为已完成的跑腿订单平台收入总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.firstMoneySum }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    帮我取收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(跑腿订单状态为已完成的跑腿订单平台收入总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.secondMoneySum }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    同城帮买收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(跑腿订单状态为已完成的跑腿订单平台收入总金额)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.thirdMoneySum }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>

            <el-col :span="6" class="cards">
              <div class="box">
                <div class="box_num">
                  <div class="box_color">
                    骑手保证金收入
                    <el-tooltip
                      class="item"
                      effect="dark"
                      placement="top"
                      content="(骑手成功缴纳的保证金)(按时间筛选)"
                      :open-delay="500"
                    >
                      <img class="help" src="~@/assets/img/help.png" alt="" />
                    </el-tooltip>
                  </div>
                  <div class="text_color">
                    <span>{{ platformData.cashDepositMoney }}</span
                    >元
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
      </el-tabs>
    </div>
    <!-- 导出限制 -->
    <el-dialog
    custom-class="export"
    :visible.sync="exportVisible"
    center
    :title="exportTitle"
    :close-on-click-modal="false"
  >
    <div class="con" v-show="exportFlag == 1">
      <img src="../../assets/img/error.png" alt="" />
      <span
        style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
        >当前导出条数超过50000条，暂不支持导出</span
      >
      <span style="font-size:14px;color: #808080;"
        >（注：数据中的图片、附件只能以链接的形式导出）</span
      >
    </div>
    <div class="con" v-show="exportFlag == 2">
      <img class="gundong" src="../../assets/img/loading.png" alt="" />
      <span
        style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
        >导出中...</span
      >
      <span style="font-size:14px;color: #808080;"
        >（注：请到个人导出记录查看并下载）</span
      >
    </div>
    <div class="con" v-show="exportFlag == 3">
      <img src="../../assets/img/success.png" alt="" />
      <span
        style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
        >导出成功</span
      >
      <span style="font-size:14px;color: #808080;"
        >（注：请到个人导出记录查看并下载）</span
      >
    </div>
    <div class="con" v-show="exportFlag == 4">
      <img class="gundong" src="../../assets/img/loading.png" alt="" />
      <span
        style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
        >版本迭代中，导出暂时无法使用</span
      >
    </div>
    <div class="btn">
      <el-button type="primary" @click="exportAffirm">确定</el-button>
    </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      limit: 10,
      page: 1,
      tableData: {},
      tableDataNew: {},
      tableData2: [],
      tableData3: {},
      tableData5: {},
      tableData4: {},
      colonelData: [],
      commodityData: [],
      userjfData: [],
      incomeData: [],
      activeName: "first",
      tableDataLoading: true,
      tableDataLoading1: true,
      tableDataLoading2: true,
      tableDataLoading3: true,
      tableDataLoading4: true,
      tableDataLoading5: true,
      tableDataLoading6: true,
      flag: "day",
      usersumData: {},
      taskStat: {},
      mendianStat: {},
      data: "",
      time: "",
      platform: "",
      type: "",
      balance: -1,
      flag: "day",
      info: {
        stockDate: this.getNowTime() //日期
      },
      hour: [], // 时间段
      flags: [
        {
          value: "day",
          label: "按天查询"
        },
        {
          value: "month",
          label: "按月查询"
        },
        {
          value: "year",
          label: "按年查询"
        },
        {
          value: "hour",
          label: "按时间段查询"
        }
      ],
      orderStat: {},
      taskStatPt: {},
      tableData2: {},
      platformData: {},
      spEarnings:[],// 商铺类型
      spEarningTypeId:"",
      shopEarnings:"",// 商铺收益排行总收益
      shopIncomeMoney:"",// 商铺收益排行实际总收入

      exportVisible: false,
      exportTitle:"",
      exportFlag:"",
    };
  },
  mounted() {
    this.colonel();
    this.taskData();
    this._getData(); //用户统计
    this._getData2();
    this.colonel1();
  },

  methods: {
    // 收益详情跳转
    updates(row) {
      this.$router.push({
        path: "/shopDatas",
        query: {
          shopId: row.shopId
        }
      });
    },
    // 商品列表跳转
    updates3(row) {
      this.$router.push({
        path: "/shopsListAdmin",
        query: {
          shopId: row.shopId
        }
      });
    },
    // 订单列表跳转
    updates4(row) {
      this.$router.push({
        path: "/shopsOrder",
        query: {
          shopId: row.shopId
        }
      });
    },
    //
    updates1(row) {
      this.$router.push({
        path: "/userDetail",
        query: {
          userId: row.userId1
        }
      });
    },
    updates2(row) {
      this.$router.push({
        path: "/userDetail",
        query: {
          userId: row.userId
        }
      });
    },
    handleSizeChange(val) {
      this.limit = val;
      this.colonel();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.colonel();
    },
    handleSizeChange1(val) {
      this.limit = val;
      this.colonel1();
    },
    handleCurrentChange1(val) {
      this.page = val;
      this.colonel1();
    },
    handleSizeChange2(val) {
      this.limit = val;
      this.taskData1();
    },
    handleCurrentChange2(val) {
      this.page = val;
      this.taskData1();
    },
    // 用户分析选择日期
    animeDat() {
      this._getData();
    },
    // 订单分析选择日期
    animeOrder() {
      this.taskData();
      // this.mendianData()
      this._getData2();
      this.colonel();
      this.colonel1();
      this.orderData();
      this.taskData1();
      this.platformSelect();
    },
    // 订单分析年月日
    orderfenxi(value) {
      let vanumber = value;
      this.hour=[]
      this.info.stockDate=""
      if (vanumber === "day") {
        this.flag = "day";
        this.info.stockDate=this.getNowTime()
        this.taskData();
        this.colonel();
        // this.mendianData()
        this.colonel1();
        this._getData2();
        this.orderData();
        this.taskData1();
        this.platformSelect();
      }
      if (vanumber === "month") {
        this.flag = "month";
        this.info.stockDate=this.getNowTime()
        this.taskData();
        this.colonel();
        // this.mendianData()
        this.colonel1();
        this._getData2();
        this.orderData();
        this.taskData1();
        this.platformSelect();
      }
      if (vanumber === "year") {
        this.flag = "year";
        this.info.stockDate=this.getNowTime()
        this.taskData();
        this.colonel();
        // this.mendianData()
        this.colonel1();
        this._getData2();
        this.orderData();
        this.taskData1();
        this.platformSelect();
      }
      if (vanumber === "hour") {
        this.flag = "hour";
        this.taskData();
        // this.mendianData()
        this._getData2();
        this.colonel();
        this.colonel1();
        this.orderData();
        this.taskData1();
        this.platformSelect();
      }
    },
    // Tabs点击事件
    handleClick(tab, event) {
      this.page = 1;
      this.limit = 10;
      if (tab._props.label == "外卖分析") {
        this.taskData();
      }
      if (tab._props.label == "外卖收入分析") {
        this.colonel();
      }
      if (tab._props.label == "商铺统计") {
        this.colonel1();
      }
      if (tab._props.label == "商铺收益排行") {
        this.colonel1();
        this.dataSelect()
      }
      if (tab._props.label == "用户分析") {
        this._getData2();
      }
      if (tab._props.label == "跑腿订单分析") {
        this.orderData();
      }
      if (tab._props.label == "跑腿任务分析") {
        this.taskData1();
      }
      if (tab._props.label == "跑腿任务收入分析") {
        this.taskData1();
      }
      if (tab._props.label == "跑腿平台收入统计") {
        this.platformSelect();
      }
    },
    //处理默认选中当前日期
    getNowTime() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth(); //得到月份
      var date = now.getDate(); //得到日期
      var hh = now.getHours() < 10 ? "0" + now.getHours() : now.getHours();
      var mm =
        now.getMinutes() < 10 ? "0" + now.getMinutes() : now.getMinutes();
      var ss =
        now.getSeconds() < 10 ? "0" + now.getSeconds() : now.getSeconds();
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date}`;
      return defaultDate;
      this.$set(this.info, "stockDate", defaultDate);
    },
    // 用户统计
    _getData() {
      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/dataCentre"),
        method: "get",
        params: this.$http.adornParams({})
      }).then(({ data }) => {
        if (data.code == 0) {
          console.log(data.data);

          let returnData = data.data;
          this.tableData = returnData;
        }
      });
    },
    // 新增统计
    _getData2() {
      this.tableDataLoading2 = true;
      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/selectUserCenter"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info.stockDate,
          dateType: this.flag,
          startTime:this.hour?this.hour[0]:'',
          endTime:this.hour?this.hour[1]:''
        })
      }).then(({ data }) => {
        if (data.code == 0) {
          let returnData = data.data;
          this.tableDataNew = returnData;
        }
        this.tableDataLoading2 = false;
      });
    },
    // 收入统计
    incomeSelect() {
      this.$http({
        url: this.$http.adornUrl("statistical/income"),
        method: "get",
        params: this.$http.adornParams({})
      }).then(({ data }) => {
        if (data.code == 0) {
          let returnData = data.data;
          this.incomeData = returnData;
        }
      });
    },
    //订单分析
    taskData() {
      this.tableDataLoading1 = true;
      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/selectOrderData"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info.stockDate,
          dateType: this.flag,
          startTime:this.hour?this.hour[0]:'',
          endTime:this.hour?this.hour[1]:''
        })
      }).then(({ data }) => {
        let returnData = data.data;
        this.taskStat = returnData;
        this.tableDataLoading1 = false;
      });
    },
    // 商铺统计
    mendianData() {
      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/selectShopCenter"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info.stockDate,
          dateType: this.flag
        })
      }).then(({ data }) => {
        let returnData = data.data;
        this.mendianStat = returnData;
      });
    },
    // 订单收入分析
    colonel() {
      this.tableDataLoading = true;
      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/selectOrderAnalyze"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          date: this.info.stockDate,
          dateType: this.flag,
          startTime:this.hour?this.hour[0]:'',
          endTime:this.hour?this.hour[1]:''
        })
      }).then(({ data }) => {
        if (data.code == 0) {
          this.tableDataLoading = false;
          let returnData = data.data;
          this.tableData2 = returnData;
        }
      });
    },
    // 商铺收益排行  start（----------------------------------------）
    colonel1() {
      this.tableDataLoading = true;
      this.tableDataLoading3 = true;

      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/selectShopCenter"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          date: this.info.stockDate,
          dateType: this.flag,
          shopType:this.spEarningTypeId,
          startTime:this.hour?this.hour[0]:'',
          endTime:this.hour?this.hour[1]:''
        })
      }).then(({ data }) => {
        console.log(data,'商铺收益排行');
        if (data.code == 0) {
          this.tableDataLoading = false;
          this.tableDataLoading3 = false;
          let returnData = data.data.pageUtils;
          this.tableData3 = returnData;
          this.tableData4 = data.data;
          this.shopEarnings=data.data.moneyAmount
          this.shopIncomeMoney=data.data.shopIncomeMoney
        }
      });
    },
    // 获取商铺类型数据
    dataSelect() {
      this.$http({
        url: this.$http.adornUrl("admin/shoptype/selectShopTypeList"),
        method: "get",
        params: this.$http.adornParams({
          page: 1,
          limit: 1000
        })
      }).then(({ data }) => {
        console.log(data,'商铺类型');

        let returnData = data.data.list;
        this.spEarnings = returnData;
      });
    },
    // 切换商铺类型
    spEarningClick(val){
      console.log(val);
      this.colonel1()
    },
    // 商铺收益排行  end（----------------------------------------）

    //跑腿订单分析
    orderData() {
      this.tableDataLoading4 = true;
      this.$http({
        url: this.$http.adornUrl("admin/tbindent/selectOrderByStatus"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info.stockDate,
          dateType: this.flag,
          startTime:this.hour?this.hour[0]:'',
          endTime:this.hour?this.hour[1]:''
        })
      }).then(({ data }) => {
        this.tableDataLoading4 = false;
        let returnData = data.data;
        this.orderStat = returnData;
      });
    },
    //跑腿任务分析
    taskData1() {
      this.tableDataLoading5 = true;
      this.$http({
        url: this.$http.adornUrl("admin/tbindent/taskAnalysis"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info.stockDate,
          dateType: this.flag,
          page: this.page,
          limit: this.limit,
          startTime:this.hour?this.hour[0]:'',
          endTime:this.hour?this.hour[1]:''
        })
      }).then(({ data }) => {
        console.log(data,'跑腿任务分析');

        this.tableDataLoading5 = false;
        let returnData = data.data;
        this.taskStatPt = returnData;
        this.tableData5 = returnData.taskAnalysisMoney;
      });
    },
    // 跑腿平台收入统计
    platformSelect() {
      this.tableDataLoading6 = true;
      this.$http({
        url: this.$http.adornUrl("cash/incomeStatistics"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info.stockDate,
          dateType: this.flag,
          startTime:this.hour?this.hour[0]:'',
          endTime:this.hour?this.hour[1]:''
        })
      }).then(({ data }) => {
        this.tableDataLoading6 = false;
        let returnData = data.data;
        this.platformData = returnData;
        // this.totalnum2 = returnData.totalCount
      });
    },

    // 导出
    exportList() {
      console.log(this.tableData3.totalCount, "导出条数");
      this.exportTitle = "导出";
      // this.exportFlag = 4;
      this.exportVisible = true;
      if (this.tableData3.totalCount >= 50000) {
        this.exportTitle = "导出错误";
        this.exportFlag = 1;
      } else {
        this.exportTitle = "导出";
        this.exportFlag = 2;
        this.exportVisible = true;
        var userId = this.$cookie.get("userId");
        this.$http({
          url: this.$http.adornUrl("admin/export/excelShopCenter"),
          method: "get",
          // responseType: "blob",
          params: this.$http.adornParams({
            // 'page': page,
            // 'size': this.size,
            userId: userId,
            date: this.info.stockDate,
            dateType: this.flag,
            shopType:this.spEarningTypeId,
            startTime:this.hour?this.hour[0]:'',
            endTime:this.hour?this.hour[1]:''
          })
        }).then(({ data }) => {
          console.log(data, "导出");
          if (data.code == 0) {
            this.exportTitle = "导出成功";
            this.exportFlag = 3;
          }
          // let blob = new Blob([data], {
          //   type:
          //     "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
          // });
          // if (window.navigator.msSaveOrOpenBlob) {
          //   navigator.msSaveBlob(blob);
          // } else {
          //   let url = window.URL.createObjectURL(blob);
          //   let elink = document.createElement("a");
          //   elink.download = "订单列表.xlsx";
          //   elink.style.display = "none";
          //   elink.href = url;
          //   document.body.appendChild(elink);
          //   elink.click();
          //   document.body.removeChild(elink);
          // }
        });
      }
    },
    exportAffirm() {
      this.exportVisible = false;
    },
  }
};
</script>

<style scoped>
.box {
  padding: 44px;
  border: 1px solid #eee;
  margin: 15px 10px;
}

.box_num {
  font-size: 14px;
  color: #66b1ff;
}

.box_num .box_color {
  color: #333;
  font-size: 14px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}

.box_num .box_color .help {
  width: 16px;
  height: 16px;
  cursor: pointer;
  margin: 0 2px;
}

.box_num div span {
  font-size: 20px;
  margin-left: 5px;
}

.text_color {
  color: #4f9dec;
}

.text_color span {
  margin-right: 5px;
}

/* 导出限制 */
.home >>> .export {
  width: 500px;
}
.home >>> .export .con {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
}
.home >>> .export .con .gundong {
  animation: gundong 3s linear infinite;
}
@keyframes gundong {
  /* from表示动画的开始位置，也可以使用0%来表示。 */
  from {
    transform: rotate(0deg);
  }
  /* to表示动画的结束位置，也可以使用100%来表示。 */
  to {
    transform: rotate(360deg);
  }
}
.home >>> .export img {
  width: 70px;
}
.home >>> .export .btn {
  display: flex;
  flex-direction: row-reverse;
}
</style>
