<style>
@import "css/cssReset.css";

.page_EasyReport_set {
  position: relative;
  padding: 15px;
}

.page_EasyReport_set .page_EasyReport_export {
  position: absolute;
  right: 0;
  top: 15px;
}

.page_EasyReport_set button.page_EasyReport_search {
  position: absolute;
  bottom: 27px;
  left: 1020px;
}

.page_EasyReport_form {
  width: 1000px;
  float: left;
}

.page_EasyReport_form .el-date-editor.el-input,
.page_EasyReport_form .el-date-editor.el-input__inner {
  width: 100% !important;
}

.easyUpdateTime {
  position: absolute;
  top: 55px;
  right: 0;
}

.column-cell-class-name-test-lan-s .v-table-body-cell {
  background-color: #9cf;
}

.color-red {
  color: red;
}

.color-green {
  color: green;
}

.color-black {
  color: black !important;
}

.border-b {
  border-bottom: 1px solid #999;
}

td .border-b:last-child {
  border: none;
}

.orderCompleteStatistics td {
  color: #000;
}
</style>
<template>
  <div class="page_EasyReport My_table_tell page-body" v-loading="AALloading">
    <div class="page_EasyReport_set clearfix">
      <el-form class="clearfix" label-width="110px">
        <el-row style="padding:15px 0 0 0; width:100%">
          <el-col :span="6">
            <el-form-item label="订单编号：">
              <div style="width:190px">
                <el-input v-model="msg.OrderId" placeholder="请输入内容" filterable></el-input>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="合同编号：">
              <div style="width:190px">
                <el-input v-model="msg.ContractNo" placeholder="请输入内容" filterable></el-input>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="学生姓名：">
              <div style="width:190px">
                <el-input v-model="msg.StudentName" placeholder="请输入内容" filterable></el-input>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="班级名称：">
              <div style="width:190px">
                <el-input v-model="msg.ClassName" placeholder="请输入内容" filterable></el-input>
              </div>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="课程名称：">
              <div style="width:190px">
                <el-input v-model="msg.CourseName" placeholder="请输入内容" filterable></el-input>
              </div>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="业务员：">
              <el-select v-model="msg.CreateBy" filterable>
                <el-option label="不限" :value="0"></el-option>
                <el-option v-for="item in EmployeeList" :label="item.EmployeeName" :key="item.Id" :value="item.Id">
                  {{item.EmployeeName}}</el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="财务单据：">
              <div style="width:190px">
                <el-input v-model="msg.FinanceId" placeholder="请输入内容" filterable></el-input>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="账户类型：">
              <el-select filterable v-model='msg.AccountType'>
                <el-option :value="0" label="不限"></el-option>
                <el-option v-for='item in AccList' :label='item.Name' :value='item.ID' :key='item.ID'>
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="交易方式：">
              <el-select v-model="msg.TradeWay" filterable @change="getAccountList(msg.AccountType,msg.TradeWay)">
                <el-option label="不限" :value="0"></el-option>
                <el-option v-for='item in BranchAccountList' :label='item.Name' :value='item.ID' :key='item.ID'>
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="账号：">
              <el-select v-model="msg.AccountId" filterable>
                <el-option label="不限" :value="0"></el-option>
                <el-option v-for='item in accountList' :label='item.Name' :value='item.ID' :key='item.ID'></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="下单时间：">
              <el-date-picker class="h34" v-model="datevalue" type="daterange" value-format="yyyy-MM-dd"
                range-separator="至"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="消费课时：">
              <el-date-picker class="h34" v-model="datevalue2" type="daterange" value-format="yyyy-MM-dd"
                range-separator="至"></el-date-picker>
            </el-form-item>
          </el-col>

          <el-col :span="7">
            <el-form-item>
              <!-- <button class="normalBtn " @click="getData()">查询</button> -->
              <q-btn color="primary" size="11px" label="查询" @click="handleCurrentChange(1)" style="marginRight:10px" />
              <!-- <button class="normalBtn " @click="exportExcel">导出EXCEL</button> -->
              <q-btn color="primary" size="11px" label="导出EXCEL" @click="exportExcel" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <!-- <button class="normalBtn page_EasyReport_search" v-if="userId==1" @click="getData(1)">保存损失</button>
      <p class="easyUpdateTime" v-if="UpdateStaus==1">正在更新,更新开始时间 {{UpdateStartTime}}</p>
      <p class="easyUpdateTime" v-if="UpdateStaus==2">上次更新时间 {{UpdateStartTime}}<br />每日8点、12点、19点、22点数据更新~</p> -->
    </div>
    <div style="width:100%; overflow-x:auto">
      <table :boeder="1" class="singeRowTable orderCompleteStatistics" style="width:3000px;border:1px solid #E6E6E6;"
        cellspacing="0" cellpadding="0">
        <tr>
          <th colspan="15" style="border-right:1px solid #999;border-bottom:1px solid #999">合同信息</th>
          <th colspan="6" style="border-right:1px solid #999;border-bottom:1px solid #999">收款信息</th>
          <th colspan="2" style="border-right:1px solid #999;border-bottom:1px solid #999">合同有效金额</th>
          <th colspan="7" style="border-right:1px solid #999;border-bottom:1px solid #999">消费情况</th>
          <th colspan="3" style="border-right:1px solid #999;border-bottom:1px solid #999">剩余情况</th>
          <th rowspan="2" :width='120'>操作</th>
        </tr>
        <tr>
          <!-- -合同信息-- -->
          <th :width='120'>订单号</th>
          <th :width='200'>签订时间</th>
          <th :width='220'>合同编号</th>
          <th :width='400'>产品名称</th>
          <th :width='200'>班号</th>
          <th :width='400'>班级</th>
          <th :width='150'>学员名称</th>
          <th :width='120'>业务员</th>
          <th :width='120'>课时</th>
          <th :width='120'>单价</th>
          <th :width='120'>课程费</th>
          <th :width='120'>教材费</th>
          <th :width='120'>课件费</th>
          <th :width='150'>优惠金额</th>
          <th :width='180' style="border-right:1px solid #999">合同总金额</th>
          <!-- -收款信息（实收金额-- -->
          <th :width='150'>单据号</th>
          <th :width='300'>收款日期</th>
          <th :width='150'>收款金额</th>
          <th :width='150'>收款方式</th>
          <th :width='300'>收款账户</th>
          <th :width='150' style="border-right:1px solid #999">应收金额</th>
          <!-- --合同有效金额-- -->
          <th :width='150'>有效课时</th>
          <th :width='150' style="border-right:1px solid #999">有效金额</th>
          <!-- -消耗情况-- -->
          <th :width='200'>消耗教材费</th>
          <th :width='200'>消耗课件费</th>
          <th :width='150'>上课进度</th>
          <th :width='150'>已上课时</th>
          <th :width='200'>折后单价</th>
          <th :width='200'>已上课金额</th>
          <th :width='200' style="border-right:1px solid #999">退/付款金额</th>
          <!-- -剩余情况-- -->
          <th :width='200'>协调金额</th>
          <th :width='120'>剩余课时</th>
          <th :width='200' style="border-right:1px solid #999">剩余金额</th>
          <!-- <th :width='120'>操作</th> -->
        </tr>
        <template v-for="(item,index) in DataList" v-loading="loading">
          <tr>
            <!-- -合同信息-- -->
            <td @click="goUrl3('/sale/orderStatistics',item.OrderId)">
              <template v-if="item.JoinType==3">
                <el-tooltip class="item" effect="dark" content="续费订单" placement="top-start">
                  <span style="cursor: pointer;text-decoration: underline;color:red">
                    {{item.OrderId}}
                  </span>
                </el-tooltip>
              </template>
              <template v-else-if="item.TargetJoinType==3">
                <el-tooltip class="item" effect="dark" content="已续费" placement="top-start">
                  <span style="cursor: pointer;text-decoration: underline;color:green">
                    {{item.OrderId}}
                  </span>
                </el-tooltip>
              </template>
              <template v-else-if="item.TargetJoinType==4">
                <el-tooltip class="item" effect="dark"
                  :content="`已转班【${item.TargetClassName}】,关联订单号${item.TargetOrderId}`" placement="top-start">
                  <span style="cursor: pointer;text-decoration: underline;color:orange">
                    {{item.OrderId}}
                  </span>
                </el-tooltip>
              </template>
              <template v-else-if="item.TargetJoinType==1">
                <template v-if="item.JoinType==3">
                  <el-tooltip class="item" effect="dark" :content="`原订单${item.SourceOrderId}`" placement="top-start">
                    <span style="cursor: pointer;text-decoration: underline;color:blue">
                      {{item.OrderId}}
                    </span>
                  </el-tooltip>
                </template>
                <template v-else-if="item.JoinType==4">
                  <el-tooltip class="item" effect="dark"
                    :content="`从【${item.SourceClassName}】转入,关联订单号${item.SourceOrderId}`" placement="top-start">
                    <span style="cursor: pointer;text-decoration: underline;color:blue">
                      {{item.OrderId}}
                    </span>
                  </el-tooltip>
                </template>
                <template v-else>
                  <span style="cursor: pointer;text-decoration: underline;">
                    {{item.OrderId}}
                  </span>
                </template>
              </template>
              <template v-else>
                <span style="cursor: pointer;text-decoration: underline;">
                  {{item.OrderId}}
                </span>
              </template>
            </td>
            <td>{{item.CreateTime}}</td>
            <td @click="goUrl('/sale/contractManage',item.ContractNo)"><span
                style="cursor: pointer;text-decoration: underline;">{{item.ContractNo}}</span></td>
            <td @click="goUrl('/course/course',item.CourseName)"><span
                style="cursor: pointer;text-decoration: underline;">{{item.CourseName}}</span></td>
            <td>{{item.ClassNo}}</td>
            <td @click="goUrl2('/course/classManage',item.ClassName)">
              <div style="cursor: pointer;text-decoration: underline;">{{item.ClassName}}</div>
            </td>
            <td>{{item.StudentName}}</td>
            <td>{{item.CreateByName}}</td>
            <td>{{item.TotalClassHours}}</td>
            <td>{{item.TotalUnitPrice}}</td>
            <td>{{item.TotalCourseFee}}</td>
            <td>{{item.TotalBookFee}}</td>
            <!--教材费-->
            <td>{{item.TotalClassFee}}</td>
            <!--课件费-->
            <td>{{item.TotalDiscountMoney}}</td>
            <!--优惠金额-------------------------->
            <td>{{item.TotalMoney}}</td>
            <!--合同总金额-->
            <!-- -收款信息（实收金额-- -->
            <td>
              <div v-for="subitem in item.IncomeList" class="border-b">
                {{ subitem.FrID }}
              </div>
            </td>
            <!--单据号-->
            <td>
              <div v-for="subitem in item.IncomeList" class="border-b">
                {{ subitem.TradeDate }}
              </div>
            </td>
            <!--收款日期-->
            <td>
              <div v-for="subitem in item.IncomeList" class="border-b">
                {{ subitem.Money }}
              </div>
            </td>
            <!--收款金额-->
            <td>
              <div v-for="subitem in item.IncomeList" class="border-b">
                <div v-for="_subitem in subitem.TradeWayList">
                  {{ _subitem.TypeName }}
                </div>
              </div>
            </td>
            <!--收款方式-->
            <td>
              <div v-for="subitem in item.IncomeList" class="border-b">
                <div v-for="_subitem in subitem.TradeWayList">
                  {{ _subitem.Alias||'/' }}
                </div>
              </div>
            </td>
            <!--收款账户-->
            <!-- ---- -->
            <td>{{item.PreferPrice}}</td>
            <!--应收金额-->
            <!-- -合同有效金额--- -->
            <td>{{item.EffectiveClassHours}}</td>
            <!--有效课时-->
            <td>{{item.Income}}</td>
            <!--有效金额-->
            <!-- 消耗情况 -->
            <td>{{item.UseBookFee}}</td>
            <!--教材费-->
            <td>{{item.UseCoursewareFee}}</td>
            <!--课件费-->
            <td>{{item.Progress}}</td>
            <!--上课进度-->
            <td>{{item.UseClassHours}}</td>
            <!--已上课时-->
            <td>{{item.Unit_Price}}</td>
            <!--单价-->
            <td>{{item.UseCourseFee}}</td>
            <!--已上课金额-->
            <td>{{item.Expend}}</td>
            <!--退/付款金额-->
            <!-- -剩余情况-- -->
            <td>{{item.AdjustPrice}}</td>
            <!--协调金额-->
            <td>{{item.SurplusCourseHours}}</td>
            <!--剩余课时-->
            <td
              :class="{'color-red':item.SurplusMoney<0,'color-green':item.SurplusMoney>0&&item.SurplusMoney<500,'color-black':item.SurplusMoney==0||item.SurplusMoney>=500}">
              {{item.SurplusMoney}}</td>
            <!--剩余金额-->
            <td>
              <q-btn color="primary" style="width:80px;font-size:10px" label="协调金额" v-if="from==1"
                @click="show($event),AdjustPriceMsg.ContractId=item.Id,AdjustPriceMsg.AdjustPrice=item.AdjustPrice" />
              <q-btn color="primary" style="width:80px;font-size:10px" label="查看明细" v-if="from==2" @click="seeClassUseDetail(item)" />
            </td>
            <!--操作-->
          </tr>

        </template>
      </table>
      <div class="noDataNotice" v-if="DataList.length<1"><i class="iconfont icon-kong"></i>
        <p>暂无数据</p>
      </div>
    </div>
    <!-- 对话框 -->
    <template>
      <q-dialog ref="dialog" @hide="onDialogHide">
        <q-card class="q-dialog-plugin">
          <div class="q-pa-md" style="max-width: 400px">
            <q-card-section>
              <div class="text-h6" style="textAlign:center">设置协调金额</div>
            </q-card-section>
            <q-form @submit="onSubmit" class="q-gutter-md">
              <q-input filled ref="money" v-model="AdjustPriceMsg.AdjustPrice" label="协调金额" lazy-rules step="0.000001"
                type="number" />
              <div style="display:flex; justify-content:flex-end">
                <q-btn label="确认" type="Submit" color="primary" style="margin-right:10px" />
                <q-btn label="取消" text-color="primary" @click="hide" />
              </div>
            </q-form>
          </div>
        </q-card>
      </q-dialog>
    </template>

    <div v-if="DataList.length>0">
      <el-pagination background @current-change="handleCurrentChange" :current-page.sync="msg.pageIndex"
        layout="total,prev, pager, next, jumper" :page-size='msg.pageSize' :total='total'>
      </el-pagination>
    </div>
  </div>
</template>
<script>
import {
  getSchoolDropdown, //获取校区列表
} from "../../api/school/index";
import { queryEmployee } from "../../api/users/user"; //获取业务员
import {
  getOrderCompleteStatisticsPageList,
  setContractAdjustPrice,
} from "../../api/report/index";
import Vue from "vue";

import {
  getEasyReportList,
  outToExcelEasyReportList,
} from "../../api/finance/index";
import { EduDownLoad } from "../../api/common/common";
export default {
  data() {
    return {
      total: 0,
      msg: {
        pageIndex: 1,
        pageSize: 10,
        OrderId: 0, //	订单编号
        ContractNo: "", //合同编号
        StudentName: "", //学生姓名
        ClassName: "", //班级名称
        CourseName: "", //课程名称
        CreateBy: 0, //业务员
        FinanceId: 0, //财务单据id
        TradeWay: 0, //交易方式
        AccountId: 0, //账号id
        AccountType: 0, //账户类型
        StartTime: "", //下单时间
        EndTime: "",
        XFStartTime: "", //消费课时时间
        XFEndTime: "",
      },
      datevalue: [],
      datevalue2: [],
      data: [],
      DataList: [],
      UpdateStaus: 0,
      UpdateStartTime: "",
      UpdateEndTime: "",
      BranchList: [],
      MonthIndex: 0,
      loading: false,
      AALloading: false,
      userId: -2,

      EmployeeList: [], //业务员列表
      AccList: [], //账户类型列表
      BranchAccountList: [], //交易方式列表
      accountList: [], //账号id列表
      AdjustPriceMsg: {
        ContractId: "", //合同id
        AdjustPrice: "", //协调金额
      },
      from: 1, //来源页
    };
  },
  created() {
    let userInfo = this.getLocalStorage();
    this.userId = userInfo.EmployeeId;
  },
  mounted() {
    if (this.$route.query.from) {
      this.from = this.$route.query.from;
      this.$forceUpdate();
    }
    this.getData();
    this.getCompanyList();
    this.getEmployee(0);
    this.AccountType_post_GetList();
    this.Financial_post_GetBranchAccountList();
  },
  methods: {
    handleCurrentChange: function (val) {
      //翻页
      this.msg.pageIndex = val;
      this.getData();
    },

    exportExcel: function () {
      EduDownLoad(
        "/finance/OutToExcelOrderStudentClassHoursList",
        this.msg,
        "订单完成统计.xls"
      );
    },
    getData() {
      if (this.datevalue && this.datevalue.length > 0) {
        this.msg.StartTime = this.datevalue[0];
        this.msg.EndTime = this.datevalue[1];
      } else {
        this.msg.StartTime = "";
        this.msg.EndTime = "";
      }
      if (this.datevalue2 && this.datevalue2.length > 0) {
        this.msg.XFStartTime = this.datevalue2[0];
        this.msg.XFEndTime = this.datevalue2[1];
      } else {
        this.msg.XFStartTime = "";
        this.msg.XFEndTime = "";
      }
      getOrderCompleteStatisticsPageList(this.msg).then((res) => {
        res.Data.PageData.map((item) => {
          item.Progress = item.Progress + "%";
        });
        this.DataList = res.Data.PageData;
        this.total = res.Data.Count;
      });
    },
    getCompanyList() {
      let userInfo = this.getLocalStorage();
      var RB_Group_id = userInfo.RB_Group_id;
      let msg = {
        Status: 0,
        is_show: 0,
        RB_Group_Id: RB_Group_id,
      };
      getSchoolDropdown({}).then((res) => {
        if (res.Code == 1) {
          var tempArray = res.Data;
          this.BranchList = tempArray;
        }
      });
    },
    //获取业务员
    getEmployee(id) {
      var qMsg = {
        Dept_Id: 0,
      };
      qMsg.Dept_Id = id;
      queryEmployee(qMsg)
        .then((res) => {
          if (res.Code == 1) {
            this.EmployeeList = res.Data;
          }
        })
        .catch(() => {});
    },
    //获取账户类型下拉
    AccountType_post_GetList() {
      this.apipost(
        "AccountType_post_GetList",
        this.queryAccMsg,
        (res) => {
          if (res.data.resultCode == 1) {
            this.AccList = res.data.data;
          } else {
            this.$message.error(res.data.message);
          }
        },
        (err) => {}
      );
    },
    //获取交易方式列表
    Financial_post_GetBranchAccountList() {
      this.apipost(
        "Financial_post_GetBranchAccountList",
        {},
        (res) => {
          if (res.data.resultCode == 1) {
            this.BranchAccountList = res.data.data;
          }
        },
        (err) => {}
      );
    },
    //账户id
    getAccountList(i, t) {
      let accountList = [];
      if (t == 1) {
        // 银行
        this.apipost(
          "bankaccount_post_GetList",
          {
            TypeId: i,
          },
          (res) => {
            if (res.data.resultCode == 1) {
              let data = res.data.data;
              data.forEach((x) => {
                let obj = {
                  ID: x.ID,
                  Name: x.Alias,
                  Nom: 0,
                };
                accountList.push(obj);
              });
              this.accountList = accountList;
            }
          },
          (err) => {}
        );
      }
      if (t == 2) {
        //平台账户
        let msg = {
          BackId: 0,
          TypeId: i,
          BranchId: -1,
          Alias: "",
        };
        this.apipost(
          "BankAccount_post_GetPlatformList",
          msg,
          (res) => {
            if (res.data.resultCode == 1) {
              let data = res.data.data;
              data.forEach((x) => {
                let obj = {
                  ID: x.ID,
                  Name: x.Alias,
                  Nom: x.PlatformNo,
                };
                accountList.push(obj);
              });
              this.accountList = accountList;
            }
          },
          (err) => {}
        );
      }
      if (t == 3) {
        //现金账户
        let msg = {
          TypeId: i,
          BranchId: -1,
          Alias: "",
        };
        this.apipost(
          "BankAccount_post_GetCashAccountList",
          msg,
          (res) => {
            if (res.data.resultCode == 1) {
              let data = res.data.data;
              data.forEach((x) => {
                let obj = {
                  ID: x.ID,
                  Name: x.Alias,
                  Nom: 0,
                };
                accountList.push(obj);
              });
              this.accountList = accountList;
            }
          },
          (err) => {}
        );
      }
      if (t == 4) {
        //资金池账户
        let msg = {
          TypeId: i,
          BranchId: -1,
          Alias: "",
        };
        this.apipost(
          "BankAccount_post_GetCashPoolList",
          msg,
          (res) => {
            if (res.data.resultCode == 1) {
              let data = res.data.data;
              data.forEach((x) => {
                let obj = {
                  ID: x.ID,
                  Name: x.Alias,
                  Nom: 0,
                };
                accountList.push(obj);
              });
              this.accountList = accountList;
            }
          },
          (err) => {}
        );
      }
    },
    bodyCellSpan({ row, column, rowIndex }) {
      if (rowIndex === 1) {
        if (column.field === "date") {
          return {
            rowspan: 1,
            colspan: 2,
          };
        } else if (column.field === "hobby") {
          return {
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
    //对话框
    show() {
      this.$refs.dialog.show();
    },

    hide() {
      this.$refs.dialog.hide();
    },

    onDialogHide() {
      // QDialog发出“hide”事件时
      // 需要发出
      this.$emit("hide");
    },

    onCancelClick() {
      // 我们只需要隐藏对话框
      this.hide();
    },
    onSubmit() {
      this.$refs.money.validate();
      if (this.$refs.money.hasError) {
        this.formHasError = true;
      } else {
        this.AdjustPriceMsg.ContractId =
          this.AdjustPriceMsg.ContractId.toString();
        this.AdjustPriceMsg.AdjustPrice =
          this.AdjustPriceMsg.AdjustPrice.toString();

        if (this.AdjustPriceMsg.AdjustPrice == "") {
          this.AdjustPriceMsg.AdjustPrice = 0;
        }

        setContractAdjustPrice(this.AdjustPriceMsg).then((res) => {
          this.$q.notify({
            type: "positive",
            icon: "done",
            position: "top",
            color: "positive",
            message: res.Message,
          });
          if (res.Code === 1) {
            this.getData();
          }
          this.$refs.dialog.hide();
        });
      }
    },
    goUrl(path, Names) {
      let Name = encodeURI(Names);
      this.OpenNewUrl(path, {
        Name: Name,
      });
    },
    goUrl2(path, Names) {
      //班级
      let Name = encodeURI(Names);
      this.OpenNewUrl(path, {
        ClassName: Name,
      });
    },
    goUrl3(path, ID) {
      //订单跳转
      this.OpenNewUrl(path, {
        OrderId: ID,
      });
    },
    seeClassUseDetail(item) {
      let obj = {
        StudentId: item.GuestId,
        TeacherId: 0,
        // ClassId: 16,
      };
      this.OpenNewUrl("/teacher/studentsClassSee", obj);
    },
  },
};
</script>
