<template>
  <div class="app-container" style="padding-top:0">
    <el-table v-loading="loading" border :data="tcmScheduleReportList" @selection-change="handleSelectionChange">
      <el-table-column fixed label="档期" align="center" prop="scheduleName" />
      <el-table-column fixed label="公司名称" width="100px" align="center" prop="companyName" />
      <!-- <el-table-column fixed label="所在部门"  width="100px" align="center" prop="deptName" /> -->
       <!-- <el-table-column label="员工姓名" align="center" prop="userNickName" /> -->
       <el-table-column fixed label="团队总人数" width="90px" align="center" prop="cuCount" />
       <el-table-column fixed label="接线人数" width="80px" align="center" prop="connectionNum" />
      <el-table-column fixed label="总进线"  width="60"  align="center" prop="totalNum" />

      <el-table-column fixed label="人均受线" width="90" align="center" prop="preMoney"   >
          <template slot-scope="scope">
            {{!scope.row.money?0:(scope.row.totalNum/scope.row.cuCount).toFixed(2)}}
          </template>
      </el-table-column>

      <el-table-column fixed label="总消费" width="90" align="center" prop="money"   >
          <template slot-scope="scope">
            {{!scope.row.money?0:(scope.row.money).toFixed(2)}}
          </template>
      </el-table-column>

      <el-table-column  label="注册数"  width="60"  align="center" prop="registerNum" />
      <el-table-column  label="上线数"  width="60"  align="center" prop="onlineNum" />
      <el-table-column  label="完课数"  width="60"  align="center" prop="finishNum" />
      <el-table-column  label="注册率"    align="center" prop="registerRate"   >
            <template slot-scope="scope">
              {{ renderTotalVal(scope.row,0) }}
            </template>
     </el-table-column>
     <el-table-column   label="上线率" align="center" prop="onlineRate"   >
            <template slot-scope="scope">
               {{ renderTotalVal(scope.row,1) }}
            </template>
    </el-table-column>
     <el-table-column   label="完课率"  align="center" prop="finishRate"   >
           <template slot-scope="scope">
              {{ renderTotalVal(scope.row,2) }}
           </template>
    </el-table-column>

    <!-- <el-table-column label="创建时间" align="center" prop="createTime" width="100">
            <template slot-scope="scope">
               <span>{{ parseTime(scope.row.createTime) }}</span>
            </template>
      </el-table-column> -->

      <el-table-column v-for='index in 36' :key='index' :label="renderLabel(index-1)"  :width="(index-1)%4==2?'85':'72'"  :prop="renderLabelProp(index)"  align="center" >
           <template slot-scope="scope">
                {{ runderValue(scope.row,index-1) }}  
           </template>     
      </el-table-column>

      <el-table-column   label="累计总业绩" width="90" align="center" prop="totalMoney"   >
            <template slot-scope="scope">
               {{!scope.row.totalMoney?0:(scope.row.totalMoney).toFixed(2)}}   
            </template>
      </el-table-column>
      <el-table-column   label="累计总单" width="80" align="center" prop="totalOrder"   >
            <template slot-scope="scope">
              {{!scope.row.totalOrder?0:scope.row.totalOrder}}
            </template>
      </el-table-column>

      <el-table-column  label="人均业绩"  width="90" align="center" prop="targetRate"   >
           <template slot-scope="scope">
               {{ renderTotalVal(scope.row,4) }}
           </template>
      </el-table-column>


      <el-table-column   label="目标业绩"  width="80"  align="center" prop="targetMoney"   >
                <template slot-scope="scope">
                {{!scope.row.targetMoney?0:(scope.row.targetMoney).toFixed(2)}}
                </template>
        </el-table-column>
        <el-table-column   label="目标完成率"  width="90" align="center" prop="targetRate"   >
                <template slot-scope="scope">
                    {{ renderTotalVal(scope.row,3) }}
                </template>
        </el-table-column>

        <el-table-column  label="单线R值"  width="90" align="center" prop="targetRate"   >
            <template slot-scope="scope">
                {{ renderTotalVal(scope.row,5) }}
            </template>
        </el-table-column>



    </el-table>
    
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

  </div>
</template>

<script>

import { listTcmStatisticsReport,listAllSchedule,getStatisticsByScheduleId } from "@/api/company/scheduleReport";
export default {
  name: "companyScheduleReport",
  components: {  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 中医档期业绩报表表格数据
      tcmScheduleReportList: [],
      scheduleList:[],
      deptIds:[],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      dateRange: [],
      companyId:undefined,
      companys:[],
      roundArr:["一轮","二轮","三轮","四轮","五轮","六轮","七轮","八轮","九轮"],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        scheduleId: null,
        deptId:null,
        deptIdStr:"",
        userId: null,
        companyId: null,
        totalNum: null,
        registerNum: null,
        onlineNum: null,
        finishNum: null,
        registerRate: null,
        onlineRate: null,
        finishRate: null,
        totalMoney: null,
      },
      users:[],
      singleColumnArrs:[],
      // 部门树选项
      deptOptions: [],
      // 部门名称
      deptName: undefined,
      // 表单参数
      form: {},
      // 表单校验
      rules: { 
         
      }
    };
  },
  created() {
      
  },
  methods: {
     getData(data){
            this.queryParams.companyId=data.companyId;
            this.queryParams.scheduleId=data.scheduleId;
            this.queryParams.pageNum=1;
            this.queryParams.pageSize=10;
            this.dateRange=[];
            this.getList();
    },
    getListSchedule() {
        this.loading = true;
        listAllSchedule().then(response => {
            this.scheduleList = response.rows;
        });
    },
    /** 查询中医档期业绩报表列表 */
    getList() {
      this.loading = true;
      if(!!this.queryParams.deptIdStr){
           console.log("qxj params deptIdStr:"+this.queryParams.deptIdStr);
      }
      getStatisticsByScheduleId(this.queryParams).then(response => {
          this.tcmScheduleReportList = response.rows;
          this.total = response.total;
          this.loading = false;
          this.calcFilterData();
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.$confirm('是否确认导出中医档期业绩报表数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return exportTcmScheduleReport(queryParams);
        }).then(response => {
          this.download(response.msg);
        }).catch(function() {});
    },
    renderLabel(index){
        var colls=parseInt(index/4);
        var cell=parseInt(index%4);
        var str=this.roundArr[colls];
        if(cell==0){
            str+="业绩"
        }
        else if(cell==1){
            str+="单数"
        }
        else if(cell==2){
             str+="转化率"
        }
        else if(cell==3){
             str+="客单"
        }
        return str;
    },
    renderLabelProp(index){  
        var colls=parseInt(index/4)+1;
        var str=this.roundArr[colls];
        if(colls==1){
             str="round"+colls+"Money";
        }
        else if(colls==2){
             str="round"+colls+"Order";
        }
        else if(colls==3){
             str="round"+colls+"Rate";
        }
        else if(colls==4){
             str="round"+colls+"Unit";
        }
        return str;
    },
    runderValue(row,index){    //注册率=注册数/总进线  上线率=上线数/注册数  完课率=完课数/注册数   目标完成率=累计业绩/目标业绩  单线R值=累计业绩/总进线
        var colls=parseInt(index/4)+1;
        var cell=parseInt(index%4);
        var value=0;
        if(cell==0){   //业绩   
            value=!row["round"+colls+"Money"]?0:(row["round"+colls+"Money"]).toFixed(2);
        }
        else if(cell==1){   //订单数
            value=row["round"+colls+"Order"];
        }
        else if(cell==2){    //转化率 =成单数/总进线 
            value=(row["round"+colls+"Order"]/row["totalNum"]*100.0).toFixed(2)+"%";
            //value=(row["round"+colls+"Rate"]*100).toFixed(2)+"%";
        }
        else if(cell==3){    //客单=成交金额/成交单数
            var roundMoney=row["round"+colls+"Money"];
            var roundOrder=row["round"+colls+"Order"];
            if(!!roundMoney && !!roundOrder){
                value=(roundMoney/roundOrder*1.0).toFixed(2);
            }
        }
        return value;
    },
    renderTotalVal(row,index){
       var value=0;
        if(index==0){   //注册率=注册数/总进线
             value=(row["registerNum"]/row["totalNum"]*100.0).toFixed(3)+"%";
        }
        else if(index==1){   //上线率=上线数/注册数
             value=(row["onlineNum"]/row["registerNum"]*100.0).toFixed(3)+"%";
        }
        else if(index==2){   //完课率=完课数/注册数
             value=(row["finishNum"]/row["registerNum"]*100.0).toFixed(3)+"%";
        }
        else if(index==3){   //目标完成率=累计业绩/目标业绩
             value=(row["totalMoney"]/row["targetMoney"]*100.0).toFixed(3)+"%";  
        }
        else if(index==4){   //人均业绩=总业绩/当期部门人数
             value=(row["totalMoney"]/row["cuCount"]*1.0).toFixed(3);  
        }
        else if(index==5){   //单线R值=累计业绩/总进线
             value=(row["targetMoney"]/row["totalNum"]*1.0).toFixed(3);  
        }
        return value;
    },

    calcFilterData(){
       var that=this;
       that.singleColumnArrs=[];
       let arr1 = this.tcmScheduleReportList.map(item => item["companyId"]);
       let arrFilter=arr1.filter(function(id,index){
          if(arr1.indexOf(id)==index){
              that.singleColumnArrs.push(index);
              return true;
          }
          return false
       });
    }
 
   
  }
};
</script>
