boss/pages/main/index/orders.vue

<template>
  <div id="cloud-balance" v-if="hasAuth" style="padding-bottom: 60px;">
    <section class="top">
      <!-- <h3>交易订单中心</h3> -->
      <section>
        <div class="type-boxes">
          <span class="vsub">订单类型:</span>
          <div class="inlineb">
            <el-checkbox-group v-model="productType" @change="changeOrder" size="mini">
              <el-checkbox-button v-for="itm in TypeList" :label="itm.id" :key="itm.id">{{itm.name}}</el-checkbox-button>
            </el-checkbox-group>
          </div>
        </div>
        <div class="type-boxes">
          <span class="vsub">支付方式:</span>
          <div class="inlineb">
            <el-checkbox-group v-model="payType" @change="changePay" size="mini">
              <el-checkbox-button v-for="itm in payList" :label="itm.id" :key="itm.id">{{itm.name}}</el-checkbox-button>
            </el-checkbox-group>
          </div>
          <div class="inlineb checkbox-div">
            <el-checkbox v-model="checked">人工财务</el-checkbox>
          </div>
        </div>
        <div class="type-boxes">
          <div class="inlineb">
            <span class="vsub">时间范围：</span>
            <el-date-picker
              style="width: 260px;"
              v-model="timeRange"
              type="daterange"
              align="right"
              unlink-panels
              range-separator="到"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :picker-options="pickerOptions2"
            ></el-date-picker>
          </div>
          <div class="inlineb">
            <span class="vsub">时间类型:</span>
            <el-select v-model="timeType" placeholder="请选择" style="width: 120px;">
              <el-option
                v-for="item in timeOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </div>
          <div class="inlineb">
            <span class="vsub">状态:</span>
            <div class="inlineb">
              <el-select v-model="orderState" clearable placeholder style="width: 140px;">
                <el-option
                  v-for="item of orderStateOption"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </div>
          </div>
          <div class="inlineb">
            <span class="vsub">交易类型：</span>
            <el-select v-model="orderTypes" placeholder="交易类型" style="width: 100px;">
              <el-option
                v-for="item of orderTypesOption"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </div>
        </div>
        <div class="type-boxes">
          <div class="inlineb">
            <span class="vsub">编号:</span>
            <div class="inlineb">
              <el-input style="width: 230px;" v-model="searchId" placeholder="订单编号/订单名称/支付编号"></el-input>
            </div>
          </div>
          <div class="inlineb">
            <span class="vsub">用户:</span>
            <div class="inlineb">
              <el-input style="width: 180px;" v-model="checkUser" placeholder="uid/昵称/姓名"></el-input>
            </div>
          </div>
          <div class="inlineb">
            <span class="vsub">项目:</span>
            <div class="inlineb">
              <el-input style="width: 100px;" type="number" v-model="productId" placeholder="项目ID"></el-input>
            </div>
          </div>

          <el-button type="primary" @click="getFinanceList">筛选</el-button>
          <el-button @click="downFinanceList" class="export-excel" type="primary">导出报表</el-button>
        </div>
        <div class="type-boxes">
          <el-tabs v-model="activeName" type="border-card" @tab-click="changeTab">
            <el-tab-pane label="全部" name="all">
              <div class="inlineb tab-item">
                <div class="text-title">收入</div>
                <div class="text-num red">+ {{totalSuccess}}元</div>
                <div class="count">共{{incomeCount}}笔</div>
              </div>
              <div class="inlineb tab-item">
                <div class="text-title">支出</div>
                <div class="text-num green">- {{paySuccess}}元</div>
                <div class="count">共{{outcomeCount}}笔</div>
              </div>
              <div class="inlineb tab-item">
                <div class="text-title">内部流转</div>
                <div class="inner-text">+ {{innerIncomeSum}}元</div>
                <div class="inner-text">- {{innerOutcomeSum}}元</div>
                <div class="count">共{{innerCount}}笔</div>
              </div>
              <div class="inlineb tab-item">
                <div class="text-title">冻结订单</div>
                <div class="text-num">{{frozenSuccessSum}}元</div>
                <div class="count">共{{frozenCount}}笔</div>
              </div>
            </el-tab-pane>
            <el-tab-pane label="平台收入" name="income">
              <div class="inlineb tab-item">
                <div class="text-title">收入</div>
                <div class="text-num red">+ {{totalSuccess}}元</div>
                <div class="count">共{{incomeCount}}笔</div>
              </div>
            </el-tab-pane>
            <el-tab-pane label="平台支出" name="outcome">
              <div class="inlineb tab-item">
                <div class="text-title">支出</div>
                <div class="text-num green">- {{paySuccess}}元</div>
                <div class="count">共{{outcomeCount}}笔</div>
              </div>
            </el-tab-pane>
            <el-tab-pane label="内部流转" name="inner">
              <div class="inlineb tab-item">
                <div class="text-title">内部流转</div>
                <div class="inner-text">+ {{innerIncomeSum}}元</div>
                <div class="inner-text">- {{innerOutcomeSum}}元</div>
                <div class="count">共{{innerCount}}笔</div>
              </div>
            </el-tab-pane>
          </el-tabs>
        </div>
      </section>
    </section>

    <div class="trcenter changeheight" width="100%">
      <el-table :data="financeList" border width="100%">
        <el-table-column label="订单名称">
          <template slot-scope="scope">
            <span class="lblue point">
              <nuxt-link
                target="_blank"
                :to="{path:'/main/orders_detail?id='+scope.row.order_no}"
              >{{scope.row.product_title}}</nuxt-link>
            </span>
          </template>
        </el-table-column>
        <el-table-column label="用户">
          <template slot-scope="scope">
            <a
              class="link-type"
              :href="scope.row.user_url"
              target="_blank"
            >{{scope.row.user_info.nickname}}({{scope.row.uid }})</a>
          </template>
        </el-table-column>
        <el-table-column label="实际金额">
          <template slot-scope="scope">
            <template v-if="scope.row.channel != 'admin_confirm'">
<!--            技术信用-->
            <div
              v-if="scope.row.product_type == 13"
            >
              <!--退款-->
              <span
                v-if="scope.row.order_type == 8"
              >{{(scope.row.real_amount/100).toFixed(2)}}
              </span>
              <template  v-else-if="scope.row.order_type == 4">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>
            </div>
<!--            提现-->
            <div v-else-if="scope.row.product_type == 200">
                <span  class="green">
                  {{(scope.row.real_amount/100).toFixed(2)}}
                </span>
            </div>
<!--            充值-->
            <div v-else-if="scope.row.product_type == 3">
              <div v-if="scope.row.operator_uid==41266">
                +{{(scope.row.real_amount/100).toFixed(2)}}
              </div>
              <div v-else>
                <span class="red">+{{(scope.row.real_amount/100).toFixed(2)}}</span>
              </div>
            </div>
<!--            扣款-->
            <div v-else-if="scope.row.product_type == 300">
              <div v-if="scope.row.operator_uid==41266">
                +{{(scope.row.real_amount/100).toFixed(2)}}
              </div>
              <div v-else>
                <span class="red">+{{(scope.row.real_amount/100).toFixed(2)}}</span>
              </div>
            </div>
<!--            云端意向金-->
            <div v-else-if="scope.row.product_type == 8">
              <!--如果不是余额购买-->
              <span v-if="scope.row.channel != 'balance'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
            </div>
<!--            雇佣-->
            <div v-else-if="scope.row.product_type == 4">
              <!--退款-->
              <span v-if="scope.row.order_type == 8" >{{(scope.row.real_amount/100).toFixed(2)}}</span>
              <!--结薪-->
              <span v-else-if="scope.row.order_type == 5" >{{(scope.row.real_amount/100).toFixed(2)}}</span>
              <template  v-else-if="scope.row.order_type == 4 || scope.row.order_type == 1">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>
            </div>
<!--            云端押金-->
            <div v-else-if="scope.row.product_type == 400">
              <!--退款-->
              <span v-if="scope.row.order_type == 8" >{{(scope.row.real_amount/100).toFixed(2)}}</span>
              <template  v-else-if="scope.row.order_type == 1">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>
            </div>
<!--            云端工作-->
            <div v-else-if="scope.row.product_type == 9">
              <!--退款-->
              <span v-if="scope.row.order_type == 8" >{{(scope.row.real_amount/100).toFixed(2)}}</span>
              <!--结薪-->
              <template  v-else-if="scope.row.order_type == 5">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance' && scope.row.channel != 'qingtuanbao'">
                  {{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  {{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <!--托管-->
              <template  v-else-if="scope.row.order_type == 1">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>
            </div>
<!--            整包-->
            <div v-else-if="scope.row.product_type == 2">
              <!--退款-->
              <span v-if="scope.row.order_type == 8" >{{(scope.row.real_amount/100).toFixed(2)}}</span>
              <!--结薪-->
              <template  v-else-if="scope.row.order_type == 5">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance' && scope.row.channel != 'qingtuanbao'">
                  {{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  {{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <!--托管-->
              <template  v-else-if="scope.row.order_type == 1">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance' && scope.row.channel != 'qingtuanbao'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <!--解冻-->
              <template  v-else-if="scope.row.order_type == 7">
                <!--如果不是余额购买-->
                <span v-if="scope.row.channel != 'balance' && scope.row.channel != 'qingtuanbao'" class="green">
                  {{(scope.row.real_amount/100).toFixed(2)}}
                </span>
                <span v-else>
                  {{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              </template>
              <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>
            </div>
<!--            查看机会-->
            <div v-else-if="scope.row.product_type == 1">
              <!--如果不是余额购买-->
              <span v-if="scope.row.channel != 'balance'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
            </div>
<!--            其他-->
            <div v-else>
              <!--如果不是余额购买-->
              <span v-if="scope.row.channel != 'balance'" class="red">
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
              <span v-else>
                  +{{(scope.row.real_amount/100).toFixed(2)}}
                </span>
            </div>
            </template>
            <template v-else>
              <div v-if="scope.row.operator_uid != '41266'">
                  <span
                    v-if="parseInt(scope.row.real_amount)>0"
                    class="red"
                  >+{{(scope.row.real_amount/100).toFixed(2)}}</span>
                  <span v-else-if="parseInt(scope.row.real_amount) == 0">{{(scope.row.real_amount/100).toFixed(2)}}</span>
                  <span v-else class="green">{{(scope.row.real_amount/100).toFixed(2)}}</span>
              </div>
              <div v-else>
                <span
                  v-if="parseInt(scope.row.real_amount)>0"
                >+{{(scope.row.real_amount/100).toFixed(2)}}</span>
                <span v-else-if="parseInt(scope.row.real_amount) == 0">{{(scope.row.real_amount/100).toFixed(2)}}</span>
                <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>
              </div>
            </template>



<!--            <div-->
<!--              v-if="scope.row.order_type!=6 && scope.row.channel != 'balance' && scope.row.channel != 'admin_confirm' && (scope.row.channel!='qingtuanbao')"-->
<!--            >-->
<!--              <span-->
<!--                v-if="parseInt(scope.row.real_amount)>=0"-->
<!--                class="green"-->
<!--              >+{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--              <span v-else class="orange">{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--            </div>-->
<!--            <div v-else-if="scope.row.channel=='qingtuanbao' && scope.row.order_type==5">-->
<!--              <span-->
<!--                v-if="parseInt(scope.row.real_amount)>=0"-->
<!--              >+{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--              <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--            </div>-->
<!--            <div v-else-if="scope.row.channel=='qingtuanbao' && scope.row.order_type!=5">-->
<!--              <span-->
<!--                v-if="parseInt(scope.row.real_amount)>=0"-->
<!--                class="green"-->
<!--              >+{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--              <span v-else class="orange">{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--            </div>-->
<!--            <div v-else-if="scope.row.channel =='admin_confirm'">-->
<!--              <div v-if="scope.row.operator_uid==41266">-->
<!--                <span-->
<!--                  v-if="parseInt(scope.row.real_amount)>=0"-->
<!--                >+{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--                <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--              </div>-->
<!--              <div v-else>-->
<!--                <span-->
<!--                  v-if="parseInt(scope.row.real_amount)>=0"-->
<!--                  class="green"-->
<!--                >+{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--                <span v-else class="orange">{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--              </div>-->
<!--            </div>-->
<!--            <div v-else>-->
<!--              <span-->
<!--                v-if="parseInt(scope.row.real_amount)>=0"-->
<!--              >+{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--              <span v-else>{{(scope.row.real_amount/100).toFixed(2)}}</span>-->
<!--            </div>-->
          </template>
        </el-table-column>
        <el-table-column prop="channel_name" label="支付方式"></el-table-column>
        <el-table-column prop="order_state_name" label="订单状态"></el-table-column>
        <el-table-column prop label="创建时间">
          <template slot-scope="scope">
            <span>{{formatDate(scope.row.created_at)}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="到账时间">
          <template slot-scope="scope">
            <span>{{formatDate(scope.row.pay_time)}}</span>
          </template>
        </el-table-column>
        <el-table-column prop label="订单编号">
          <template slot-scope="scope">
            <nuxt-link
              target="_blank"
              :to="{path:'/main/orders_detail?id='+scope.row.order_no}"
            >{{scope.row.order_no}}</nuxt-link>
          </template>
        </el-table-column>
        <el-table-column prop="out_order_id" label="支付编号"></el-table-column>
        <el-table-column width="100" label="订单类型">
          <template slot-scope="scope">{{scope.row.product_type_name}}</template>
        </el-table-column>
        <el-table-column prop="order_type_name" label="交易类型">
          <template slot-scope="scope">
            <span>{{scope.row.order_type_name}}</span>
          </template>
        </el-table-column>
        <el-table-column label="关联项目">
          <template slot-scope="scope">
            <a
              :href="scope.row.related_project.url?scope.row.related_project.url:'#'"
              target="_blank"
            >
              <span
                class="lblue"
              >{{scope.row.related_project.name?scope.row.related_project.name:"--"}}</span>
            </a>
          </template>
        </el-table-column>
        <el-table-column prop="operator_uid" label="人工">
          <template slot-scope="scope">
            <span v-if="scope.row.operator_info.nickname">{{scope.row.operator_info.nickname}}</span>
            <span>({{scope.row.operator_uid}})</span>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="order-footer">
      <el-pagination
        background
        @current-change="getFinanceList"
        @size-change="changePageSize"
        :current-page.sync="currentPage"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="20"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalCount"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
let firstDayOfThisMonth = new Date();
firstDayOfThisMonth.setDate(1);
firstDayOfThisMonth.setHours(0);
firstDayOfThisMonth.setMinutes(0);
firstDayOfThisMonth.setSeconds(0);
export default {
  data() {
    return {
      tabShow: true,
      innerIncomeSum: 0,
      innerOutcomeSum: 0,
      incomeCount: 0,
      innerCount: 0,
      outcomeCount: 0,
      frozenCount: 0,
      activeName: "all",
      hasAuth: 1,
      frozenSuccessSum: 0,
      frozenSum: 0,
      financeList: [],
      successCount: 0,
      totalHave: 0,
      totalSuccess: 0,
      PayCount: 0,
      paySuccess: 0,
      productId: "",
      productType: [0],
      orderTypes: "",
      orderTypesOption: [],
      orderState: 401,
      orderStateOption: [],
      productTypes: "",
      productTypesOption: [],
      checked: false,
      orderType: [0],
      tradeType: [0],
      payType: [0],
      timeType: 2,
      payListPop: [],
      productTypePop: [],
      timeOptions: [
        {
          value: 1,
          label: "到帐时间"
        },
        {
          value: 2,
          label: "创建时间"
        }
      ],
      TypeList: [],
      tradeList: [],
      payList: [],
      pickerOptions2: {
        shortcuts: [
          {
            text: "全部",
            onClick(picker) {
              this.timeRange = [];
              picker.$emit("pick", []);
            }
          },
          {
            text: "最近7天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近30天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "本周",
            onClick(picker) {
              let week = new Date().getDay() - 1;
              if (week == -1) {
                week = 6;
              }
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * week);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "本月",
            onClick(picker) {
              let month = new Date().getMonth + 1;
              let year = new Date().getFullYear();
              let day = new Date().getDate() - 1;

              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * day);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "本年",
            onClick(picker) {
              let month = new Date().getMonth + 1;
              let year = new Date().getFullYear();
              let day = new Date().getDate() - 1;
              let firstDay = new Date(year, 0, 1);
              let dateDiff = new Date() - firstDay;
              let msPerDay = 1000 * 60 * 60 * 24;
              //计算天数
              let diffDays = Math.ceil(dateDiff / msPerDay) - 1;
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * diffDays);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      timeRange: [firstDayOfThisMonth, new Date()],
      arriveTime: "",
      searchId: "",
      tableData3: [],
      // 下发的总数据
      totalData: {},
      // 项目ID
      jobID: "",
      // 审核人
      period: "",
      status: "",
      // 状态列表数据
      jobStatusList: [],
      // 负责人
      checkUser: "",
      // 审核人列表
      periodStatusList: [],
      // 数据总条目
      totalCount: 0,
      currentPage: 1,
      currentPageSize: 20,
      tableData: [],
      localData: {
        env: "test"
      },
      dateData:{
        start_time:'',
        end_time:''
      }
    };
  },
  computed: {
    isTest() {
      return this.localData.env === "test";
    },
    whole() {
      return this.totalData.whole || {};
    },
    totalDeposit() {
      return this.whole.total_deposit;
    },
    totalFee() {
      return this.whole.total_fee;
    }
  },
  mounted() {
    this.getAllChoice();
    // this.getTableData();
    this.queryDataFormat();
    this.getFinanceList();
  },
  methods: {
    queryDataFormat() {
      let query = this.$route.query;
      if (JSON.stringify(query) === "{}") {
        return ;
      }
      this.productType[0] = query.product_type ? query.product_type * 1 : 0;
      let startDate = new Date(query.start_time);
      let endDate = new Date(query.end_time);
      this.timeRange = [startDate,endDate];
      this.payType[0] = query.channel || 0;
    },
    formatDate(time) {
      if (time === "0") {
        return "--";
      }
      let now = new Date(time * 1000);
      let year = now.getFullYear();
      let month = now.getMonth() + 1;
      let date = now.getDate();
      let hour = now.getHours();
      let minute = now.getMinutes();
      let second = now.getSeconds();
      if (hour < 10) {
        hour = "0" + hour;
      }
      if (minute < 10) {
        minute = "0" + minute;
      }
      if (second < 10) {
        second = "0" + second;
      }
      return (
        year +
        "-" +
        month +
        "-" +
        date +
        " " +
        hour +
        ":" +
        minute +
        ":" +
        second
      );
    },
    // 改变订单类型
    changeOrder() {
      let haveAll = false;
      for (let i = 0; i < this.productType.length; i++) {
        if (this.productType[i] == 0) {
          haveAll = true;
        }
      }

      if (this.productType.indexOf("扩展") > -1) {
        this.productType.pop();
        this.TypeList.pop();
        for (let i = 9; i >= 0; i--) {
          this.TypeList.push(this.productTypePop.pop());
        }
        this.TypeList.push({
          id: "缩进",
          name: "<<"
        });
      }
      if (this.productType.indexOf("缩进") > -1) {
        this.productType.pop();
        this.TypeList.pop();
        for (let i = 0; i < 10; i++) {
          this.productTypePop[i] = this.TypeList.pop();
        }
        this.TypeList.push({
          id: "扩展",
          name: ">>"
        });
      }

      // 选择其他的时候，去掉全部,全部在第一位
      if (
        this.productType[0] == 0 &&
        1 < this.productType.length < this.TypeList.length
      ) {
        let arr = [];
        for (let i = 0; i < this.productType.length; i++) {
          if (this.productType[i] != 0) {
            arr.push(this.productType[i]);
          }
        }

        this.productType = arr;
      }
      // 选择全部的时候去掉其他，全部在最后一位
      if (this.productType[this.productType.length - 1] == 0) {
        this.productType = [0];
      }
      if (!haveAll && this.productType.length == this.TypeList.length - 1) {
        this.productType = [0];
      }
      if (this.productType.length == 0) {
        this.productType = [0];
      }
    },

    // 改变支付方式
    changePay() {
      let haveAll = false;
      for (let i = 0; i < this.payType.length; i++) {
        if (this.payType[i] == 0) {
          haveAll = true;
        }
      }
      if (this.payType.indexOf("扩展") > -1) {
        this.payType.pop();
        this.payList.pop();
        this.payList.push(this.payListPop[0]);
        this.payList.push(this.payListPop[1]);
        this.payList.push(this.payListPop[2]);
        this.payList.push({
          id: "缩进",
          name: "<<"
        });
      }
      if (this.payType.indexOf("缩进") > -1) {
        this.payType.pop();
        this.payList.pop();
        this.payList.pop();
        this.payList.pop();
        this.payList.pop();
        this.payList.push({
          id: "扩展",
          name: ">>"
        });
      }

      // 选择其他的时候，去掉全部,全部在第一位
      if (
        this.payType[0] == 0 &&
        1 < this.payType.length < this.payList.length
      ) {
        let arr = [];
        for (let i = 0; i < this.payType.length; i++) {
          if (this.payType[i] != 0) {
            arr.push(this.payType[i]);
          }
        }

        this.payType = arr;
      }
      // 选择全部的时候去掉其他，全部在最后一位
      if (this.payType[this.payType.length - 1] == 0) {
        this.payType = [0];
      }
      if (!haveAll && this.payType.length == this.payList.length - 1) {
        this.payType = [0];
      }
      if (this.payType.length == 0) {
        this.payType = [0];
      }
    },
    clickExport() {
      window.open("/api/admin/job/get_all_periods?action=export");
    },
    /**
     * 获取筛选值
     */
    async getEnum() {
      let { data } = await this.$get("/api/admin/job/getEnum");
      if (data) {
        let { jobStatusList, periodStatusList } = data;
        this.jobStatusList = jobStatusList;
        this.periodStatusList = periodStatusList;
      }
    },
    // 点击操作
    clickOperate({ job_id, id }) {
      window.open(
        this.$store.state.domainConfig.rooterUrl +
          `/main/wage_settlement?job_id=${job_id}&period_id=${id}`
      );
    },
    // 点击账单
    clickOrder(i) {
      window.open(
        this.$store.state.domainConfig.rooterUrl +
          `/main/wage_details?job_id=${i.job_id}&period_id=${i.id}`
      );
    },
    // 点击开发者
    clickDev(uid) {
      window.open(
        this.$store.state.domainConfig.siteUrl + `/rooter/user/${uid}`
      );
    },
    // 点击企业
    clickCompany(uid) {
      window.open(
        this.$store.state.domainConfig.siteUrl + `/rooter/user/${uid}`
      );
    },
    // 点击账单id
    clickJobID(jobID) {
      window.open(
        this.$store.state.domainConfig.siteUrl + `/rooter/cloudjobitem/${jobID}`
      );
    },
    // 点击重试
    async clickRetry(id) {
      const res = await this.$post("/api/admin/payment/redoDraw", { id });
    },
    // 根据状态显示图表样式
    tableRowClassName({ row, rowIndex }) {
      let className = "";
      if (row.j_status_name === "结束合作") className = "end-row";
      return className;
    },
    // 格式化列表数据
    formatTableData(data) {
      return data.map(i => ({
        ...i,
        payAround: `${i.start_time}<br>${i.end_time}`,
        pre_send_salary_timeShow: new Date(
          i.pre_send_salary_time * 1000
        ).toLocaleDateString()
      }));
    },
    /**
     * 点击筛选确认
     */
    clickSearchConfirm() {
      this.currentPage = 1;
    },
    changePageSize(pageSize) {
      this.currentPageSize = pageSize;
      this.getFinanceList();
    },

    async downFinanceList() {
      let checkedTF = 0;
      if (this.checked) {
        checkedTF = 1;
      }
      let arr1 = [];
      if (this.productType[0] == 0) {
        arr1 = "";
      } else {
        arr1 = this.productType.toString();
      }
      let arr2 = [];
      if (this.payType[0] == 0) {
        arr2 = "";
      } else {
        arr2 = this.payType.toString();
      }

      let time = 1;
      if (this.timeType == "") {
        time = "";
      } else {
        time = this.timeType;
      }
      let starTime = "";
      let endTime = "";
      if (this.timeRange.length > 0) {
        starTime = this.formatDate(this.timeRange[0] / 1000);
        endTime = this.formatDate(this.timeRange[1] / 1000);
      } else {
        starTime = "";
        endTime = "";
      }

      let url =
        window.location.host +
        "/api/admin/order/export?product_type=" +
        arr1 +
        "&order_type=" +
        this.orderTypes +
        "&channel=" +
        arr2 +
        "&start_time=" +
        starTime +
        "&end_time=" +
        endTime +
        "&date_type=" +
        time +
        "&status=" +
        this.orderState +
        "&artificial_mark=" +
        checkedTF +
        "&order=" +
        this.searchId +
        "&user=" +
        this.checkUser +
        "&product_id=" +
        this.productId;
      window.location.href = "https://" + url;
    },

    changeTab() {
      this.orderTypes = "";
      this.getFinanceList();
    },
    getFinanceList() {
      if (this.$router.currentRoute.query.user) {
        this.checkUser = this.$router.currentRoute.query.user;
      }
      let checkedTF = 0;
      if (this.checked) {
        checkedTF = 1;
      }
      let arr1 = [];
      if (this.productType[0] == 0) {
        arr1 = "";
      } else {
        arr1 = this.productType.toString();
      }
      let arr2 = [];
      if (this.payType[0] == 0) {
        arr2 = "";
      } else {
        arr2 = this.payType.toString();
      }

      let time = 1;
      if (this.timeType == "") {
        time = "";
      } else {
        time = this.timeType;
      }
      let starTime = "";
      let endTime = "";
      if (this.timeRange) {
        if (this.timeRange.length > 0) {
          if (
            (this.timeRange[0] / 1000) * 1000 ==
            (this.timeRange[1] / 1000) * 1000
          ) {
            let changeEnd =
              (this.timeRange[1] / 1000) * 1000 + 24 * 60 * 60 * 1000;
            starTime = this.formatDate(this.timeRange[0] / 1000);
            endTime = this.formatDate(changeEnd / 1000);
          } else {
            starTime = this.formatDate(this.timeRange[0] / 1000);
            endTime = this.formatDate(this.timeRange[1] / 1000);
          }
        } else {
          starTime = "";
          endTime = "";
        }
      } else {
        starTime = "";
        endTime = "";
      }
      let body = {
        view: "platform",
        product_type: arr1,
        order_type: this.orderTypes,
        channel: arr2,
        start_time: starTime,
        end_time: endTime,
        date_type: time,
        status: this.orderState,
        artificial_mark: checkedTF,
        order: this.searchId,
        user: this.checkUser,
        product_id: this.productId,
        page: this.currentPage,
        page_size: this.currentPageSize
      };
      if (this.orderTypes == "") {
        body.active_name = this.activeName;
      } else {
        this.activeName = "all";
      }
      this.$post("/api/admin/order/get_orders", body).then(res => {
        let data = res.data;
        if (res.status === 0) this.hasAuth = 0;
        if (res.status === 1) {
          this.financeList = data.orders;
          this.totalCount = data.count;
          this.successCount = data.successCount;
          this.totalHave = data.income_sum;
          this.totalSuccess = data.income_success_sum;
          this.PayCount = data.expense_sum;
          this.paySuccess = data.expense_success_sum;
          this.frozenSum = data.frozen_sum;
          this.frozenSuccessSum = data.frozen_success_sum;
          this.innerOutcomeSum = data.inner_outcome_sum;
          this.innerIncomeSum = data.inner_income_sum;
          this.innerCount = data.inner_count;
          this.incomeCount = data.income_count;
          this.outcomeCount = data.outcome_count;
          this.frozenCount = data.frozen_count;
        }
      });
    },
    async getAllChoice() {
      let body = {};
      const res = await this.$post("/api/admin/order/get_all_choice");
      let data = res.data;
      this.orderTypesOption = data.order_types;
      this.orderTypesOption.unshift({
        id: "",
        name: "全部"
      });
      this.orderStateOption = data.order_state;
      this.payList = data.channels;
      this.payList.unshift({
        id: 0,
        name: "全部"
      });
      this.payListPop[0] = this.payList.pop();
      this.payListPop[1] = this.payList.pop();
      this.payListPop[2] = this.payList.pop();
      this.payList.push({
        id: "扩展",
        name: ">>"
      });
      this.TypeList = data.product_types;
      this.TypeList.unshift({
        id: 0,
        name: "全部"
      });
      for (let i = 0; i < 10; i++) {
        this.productTypePop[i] = this.TypeList.pop();
      }
      this.TypeList.push({
        id: "扩展",
        name: ">>"
      });
    }
  },
  created() {}
};
</script>

<style scoped>
.order-footer {
  position: absolute;
  bottom: 10px;
  left: 10px;
}
#order-wrap {
  width: 100%;
}
#cloud-balance {
  white-space: nowrap;
  overflow-y: hidden;
  overflow-x: hidden;
}
.changeheight {
  height: calc(100%) !important;
}
.top {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 340px;
}
.selector-box {
  /* margin-top: 10px; */
}
.selector-box {
  display: flex;
  justify-content: space-between;
}
/* .selector-box-left {
} */
.table {
  margin-top: 10px;
  height: calc(100% - 320px);
}
.order-table {
  /* height: calc(100% - 300px); */
}
.end-row {
  background: rgba(0, 0, 0, 0.1);
}
.inlineb {
  display: inline-block;
}
.vsub {
  vertical-align: sub;
  font-size: 14px;
}
.type-boxes {
  margin-bottom: 10px;
}
.green {
  color: rgba(37, 155, 36, 1);
}
.orange {
  color: rgba(255, 152, 0, 1);
}
.red{
  color: rgb(255, 2, 30);
}
.state-success {
  display: inline-block;
  padding: 0px 8px;
  text-align: center;
  border: 1px solid rgb(48, 142, 255);
}
.state-wait {
  display: inline-block;
  padding: 0px 8px;
  text-align: center;
  border: 1px solid rgb(134, 130, 130);
}

.state-load {
  display: inline-block;
  padding: 0px 8px;
  text-align: center;
  border: 1px solid rgb(37, 155, 36);
}
.state-faile {
  display: inline-block;
  padding: 0px 8px;
  text-align: center;
  border: 1px solid rgb(229, 28, 35);
}
.tab-item {
  padding: 5px;
  margin-left: 20px;
  margin-right: 20px;
  width: 100px;
}
.text-num {
  padding: 3px;
}

.text-title {
  font-size: 14px;
  font-weight: bold;
}

.inner-text {
  font-size: 10px;
}

.count {
  color: #5a5e66;
}
.export-excel {
  float: right;
}
.el-form-item {
  margin-bottom: 0;
}
.el-form:last-child {
  margin-bottom: 22px;
}
</style>