<template>
<div class="flexOne">
<div class="workTotalSearch">
<ul>
<li>
<span><em class="fl" style="margin-top: 10px!important;">{{$t('fnc.bmxuanze')}}</em>
<treeselect class='w200 fl'
:options="departmentList"
v-model="RB_Department_Id"
:placeholder="$t('pub.unlimitedSel')"
:normalizer="normalizer"
@select='linkageEmployeeMsg()'
/>
</span>
</li>
<li>
<span><em>{{$t('fnc.ryxuanze')}}</em></span>
<el-select class='w200' v-model="msg.EmployeeId" filterable :placeholder="$t('pub.pleaseSel')" >
<el-option :label="$t('pub.unlimitedSel')" value='-1'></el-option>
<el-option v-for='item in employeeList'
:label='item.name'
:value='item.empId'
:key='item.empId'>
</el-option>
</el-select>
</li>
<li><span><em>{{$t('fnc.bmriqi')}}</em><el-date-picker :picker-options="pickerOptions" v-model='msg.StartDate' class='w135' value-format="yyyy-MM-dd" type="date"></el-date-picker>
-
<el-date-picker :picker-options="pickerOptions" v-model='msg.EndDate' class='w135' value-format="yyyy-MM-dd" type="date"></el-date-picker>
</span>
</li>
<li>
<input type="button" class="hollowFixedBtn" :value="$t('pub.searchBtn')" @click="getList();resetPageIndex()" />
</li>
</ul>
</div>
<div style="clear: both; width: 100%;height: 20px;"></div>
<table class="workTotalSearchTable" border="0" cellspacing="0" cellpadding="0" v-loading='loading'>
<tr>
<th width="15%">{{$t('salesModule.Personnel')}}</th>
<th width="15%">{{$t('salesModule.Visital')}}</th>
<th width="15%">{{$t('salesModule.laxin')}}</th>
<th width="15%">{{$t('salesModule.ShouKe')}}</th>
<th width="10%">{{$t('fnc.shoukuan')}}</th>
<th width="10%">{{$t('salesModule.MakeInquiry')}}</th>
<th width="10%">{{$t('salesModule.Complaints')}}</th>
<th width="10%">{{$t('salesModule.AfterSales')}}</th>
</tr>
<tr>
<td v-show="list.length==0" colspan="11" align="center">{{$t('system.content_noData')}}</td>
</tr>
<tr v-for="item in list">
<td>
<img v-if='!item.EmPhoto' src="../../assets/img/litheader.png"/>
<img v-if='item.EmPhoto' :onerror="defaultImg" :src='item.EmPhoto'/>
{{item.EmName}}
</td>
<td><span @click="goUrl('worksalesApproval',item.EmployeeId,msg.StartDate,msg.EndDate)">{{item.CallOnNum}}</span></td>
<td><span @click="goUrl('worksalesApproval',item.EmployeeId,msg.StartDate,msg.EndDate)">{{item.PullTheNewNum}}</span></td>
<td>
<span @click="goUrlT('enrollTotal',item.EmployeeId,msg.StartDate,msg.EndDate)">{{item.GuestNum}}</span> ￥{{moneyFormat(item.PreferPrice)}}
</td>
<td style="color: #FF9C00;"><span @click="goUrl('saleReceivablesTotal',item.EmployeeId,msg.StartDate,msg.EndDate)">￥{{moneyFormat(item.Income)}}</span></td>
<td><span @click="goUrl('askPriceTotal',item.EmployeeId,msg.StartDate,msg.EndDate)">{{item.DemandNum}}</span></td>
<td>
0
</td>
<td>0</td>
</tr>
</table>
<el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage" layout="total,prev, pager, next, jumper" :page-size=msg.pageSize :total=total></el-pagination>
</div>
</template>
<script>
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: { Treeselect },
data() {
return {
pickerOptions: {
disabledDate: (time) => { //disabledDate true 为禁止选择
return time.getTime()>Date.now()
}
},
defaultImg: 'this.src="' + require("../../assets/img/litheader.png") + '"',
normalizer(node) {
return {
id: node.DepartmentId,
label: node.DepartmentName,
children: node.ChildList,
}
},
currentPage:1,
total:0,
loading:false,
RB_Department_Id:null,
msg:{
RB_Department_Id:null,
EmployeeId:'-1',
StartDate:'',
EndDate:'',
pageIndex:1,
pageSize:10,
},
employeeMsg: {
RB_Group_id:'0',
RB_Branch_id:'-1',
departmentId:'0',
IsLeave:'-1',
},
list: [],
departmentList:[],
employeeList: [],
}
},
methods: {
goUrl(path,id,starTime,endTime) {
this.$router.push({
name: path,
query: {
"id": id,
"starTime": starTime,
"endTime": endTime,
}
})
},
goUrlT(path,id,starTime,endTime) {
this.$router.push({
name: path,
query: {
"EmployeeId": id,
"starTime": starTime,
"endTime": endTime,
}
})
},
linkageEmployeeMsg(){
this.employeeMsg.departmentId=this.RB_Department_Id;
this.msg.EmployeeId='-1';
this.getEmployee();
},
getEmployee() {
this.apipost('app_get_company_employee', this.employeeMsg, res => {
if(res.data.resultCode == 1) {
this.employeeList = res.data.data;
}
}, err => {})
},
getDepartment(){
this.apipost('Advertising_get_GetNowDepartmentAndSubordinate',{},res=>{
if(res.data.resultCode==1){
this.departmentList=res.data.data
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
getList() {
this.loading = true
if(this.RB_Department_Id==null){
this.msg.RB_Department_Id='-1'
}else{
this.msg.RB_Department_Id=this.RB_Department_Id
}
this.apipost('TaskManagemnet_get_GetDepartmentEmpWork', this.msg, res => {
if(res.data.resultCode == 1) {
this.loading = false
this.total = res.data.data.count
this.list = res.data.data.pageData
} else {
this.loading = false
this.$message.error(res.data.message)
}
}, err => {})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList()
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
},
mounted(){
this.getList()
this.getDepartment()
this.getEmployee()
},
}
</script>
<style>
.workTotalSearch{width: 100%; min-height: auto; padding:0 0 20px 0;}
.workTotalSearch li{float: left; font-size: 12px; color: #666; margin:20px 10px 0px 0;}
.workTotalSearch li>span {display: inline-block; }
.workTotalSearch li span>em{display: inline-block; min-width: 60px; text-align: right; font-style: normal; margin:0 12px 0 0;}
.workTotalSearch li:last-child{float: right; position: absolute; top: -15px; right: 20px; z-index: 50;}
.workTotalSearchTable{width: 100%; font-size:14px; color: #333; background: #ccc;}
.workTotalSearchTable tr{border-bottom: 2px solid #333;}
.workTotalSearchTable tr th{background: #BDBDBD;height:30px; font-size: 12px; text-align: left; text-indent: 30px;}
.workTotalSearchTable tr{background: #fff;text-align: left;}
.workTotalSearchTable tr:nth-child(2n+1){background: #E5E5E5;}
.workTotalSearchTable tr td{height: 60px; padding-left:30px; border-right: 1px solid #DCDCDC; border-bottom: 1px solid #DCDCDC;}
.workTotalSearchTable tr td>span{cursor: pointer; text-decoration: underline;}
.workTotalSearchTable tr td>img{width: 32px; height: 32px;border-radius: 16px; vertical-align: middle; margin-right: 15px;}
</style>