<style scoped>
  .LineReceiver .el-form-item{
      display: inline-block;
  }

</style>

<template>
  <div class="LineReceiver">
      <div>
          <el-form>
              <el-form-item :label="$t('objFill.v101.FinancialModule.shoukeriqi')">
                    <el-date-picker size="small"
                        @change="timeAdd"
                        v-model="productionDate"
                        type="daterange"
                        value-format="yyyy-MM-dd"
                        :range-separator="$t('restaurant.res_To')">
                    </el-date-picker>
                </el-form-item>
                <el-form-item>
                    <input type="button" class="normalBtn" :value="$t('pub.searchBtn')" @click="getList()"/>
                    <input type="button" class="hollowFixedBtn" :value="$t('visa.v_daochu')" @click="Export"/>

               </el-form-item>

          </el-form>
      </div>
      <div v-loading="loading">
          <el-table :data="List" border>
			<el-table-column fixed prop="BranchName" :label="$t('admin.admin_company')" min-width="100">
			</el-table-column>
			<el-table-column min-width="130" @sort-by="SortBy" sortable v-for='(item,index) in newArr' :prop='item.Rank' :label="item.title" :key='index'>
				<template slot-scope="scope">
					<p>{{scope.row[item.Rank]}} ({{scope.row[item.value]}})</p>
				</template>
			</el-table-column>
		</el-table>
      </div>

  </div>
</template>

<script>
	import moment from "moment"
	export default {
		data (){
            return{
                productionDate:[],
                msg:{
                    StartTime:"",
                    EndTime:"",
                },
                ColList:[],
                List:[],
                newArr:[],
                loading:false,
                userId:0,
            }
        },
        created(){
            let mon1=moment().format("YYYY-MM-DD");
            let mon2=moment().subtract(1, "months").format("YYYY-MM-DD");
            this.productionDate=[mon2,mon1];
            this.msg.StartTime=this.productionDate[0];
            this.msg.EndTime=this.productionDate[1];
            let userInfo = this.getLocalStorage();
            this.userId = userInfo.EmployeeId;
        },
		mounted(){
			this.getList();
		},
		methods:{
            Export(){
                this.msg.EmployeeId = this.userId;
                let msg = JSON.parse(JSON.stringify(this.msg));
                this.GetLocalFile(
                    "financestatistics_post_OutToExcelGetCompanyLineGuestList",
                    msg,
                    this.$t('objFill.v101.FinancialModule.xianlusktj')+".xls"
                );
            },
            SortBy(){

            },
            timeAdd(){
                if(!this.productionDate){
                    this.msg.StartTime="";
                    this.msg.EndTime="";
                }else{
                    this.msg.StartTime=this.productionDate[0];
                    this.msg.EndTime=this.productionDate[1];
                }
            },
            getList(){
                this.loading=true;
                this.apipost('financestatistics_post_GetCompanyLineGuestList',this.msg, res => {
                    this.loading=false;

                    if(res.data.resultCode == 1) {
                        this.ColList=res.data.data.ColList;
                        this.List=res.data.data.List;
                        for(let i = 1; i < this.ColList.length; i++) {
							this.newArr.push({
                                "Rank":this.ColList[i].Sort,
								'value': this.ColList[i].Col,
								"title": this.ColList[i].Name,
							})
                        }

                    }else{
                        this.Error(res.data.message);
                    }
                }, err => {})
            },
		}
	}




</script>