<template>
<div class="flexOne">
<div class="query-box" style="border-bottom: none;">
<ul>
<li>
<span><em>{{$t('sm.company')}}</em><el-select filterable @change='getUser' v-model='msg.RB_BranchId'
:disabled="F_Query_SelfBranch"
>
<el-option :label="$t('pub.unlimitedSel')" value='-1'></el-option>
<el-option v-for='item in companyList' :label='item.BName' :value='item.Id' :key='item.Id'></el-option>
</el-select>
</span>
</li>
<li>
<span><em>{{$t('objFill.v101.administrative.qiandaoren')}}</em><el-select filterable v-model='msg.EmployeeId'
:disabled="F_Query_SelfBranch && F_Query_employee">
<el-option :label="$t('pub.unlimitedSel')" value='-1'></el-option>
<el-option v-for='item in userList' :label='item.name' :value='item.empId' :key='item.empId'></el-option>
</el-select>
</span>
</li>
<li><span><em>{{$t('objFill.v101.administrative.qiandaosj')}}</em><el-date-picker v-model='msg.StartTime' class='w135' value-format="yyyy-MM-dd" type="date"></el-date-picker>
-
<el-date-picker v-model='msg.EndTime' 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="resetPageIndex(),getList()" />
</li>
</ul>
</div>
<div style="width: 100%; overflow: auto;">
<table style="min-width: 1400px;" class="singeRowTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<th>{{$t('sm.company')}}</th>
<th>{{$t('system.query_name')}}</th>
<th>{{$t('objFill.v101.administrative.qiandaorqi')}}</th>
<th>{{$t('objFill.v101.administrative.diyicqdsj')}}</th>
<th width="400">{{$t('objFill.v101.administrative.diyicqddd')}}</th>
<th>{{$t('objFill.v101.administrative.zuihouyicqdsj')}}</th>
<th width="300">{{$t('objFill.v101.administrative.zuihyicqddd')}}</th>
<th width="150">{{$t('system.table_operation')}}</th>
</tr>
<tr v-for='item in list' v-loading='loading'>
<td>{{item.BName}}</td>
<td>{{item.EmName}}</td>
<td>{{item.SignTime}}</td>
<td>{{item.StartTime}}</td>
<td>{{item.StartAddress}}</td>
<td>{{item.EndTime}}</td>
<td>{{item.EndAddress}}</td>
<td>
<el-tooltip class="item" effect="dark" :content="$t('fnc.xiangqing')" placement="top">
<el-button type="primary" icon="el-icon-tickets" circle @click='getDetail(item.EmployeeId,item.SignTime)'></el-button>
</el-tooltip>
</td>
</tr>
</table>
</div>
<el-pagination background
@current-change="handleCurrentChange"
:current-page.sync="currentPage"
layout="total,prev, pager, next, jumper"
:page-size='msg.pageSize'
:total='total'>
</el-pagination>
<el-dialog custom-class='w500' :title="dialogTitle" :visible.sync="outerVisible" center >
<div v-for="(item,index) in layerItem" class="outWorkItem" >
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2">{{$t('tips.di')}}{{index+1}}{{$t('objFill.v101.administrative.ciqiand')}}</td>
</tr>
<tr>
<td colspan="2"><i class="el-icon-time"></i>{{item.SignInTime}}</td>
</tr>
<tr>
<td colspan="2"><i class="iconfont icon-tubiao"></i>{{item.Address}}</td>
</tr>
<tr>
<td width="45">{{$t('system.label_img')}}：</td>
<td><img v-for="img in toArr(item.Image)" :src='img' @click="getPic(toArr(item.Image))"></td>
</tr>
<tr>
<td>{{$t('pub.pubRemark')}}:</td>
<td>{{item.Remarks}}</td>
</tr>
</table>
</div>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="outerVisible = false">{{$t('pub.cancelBtn')}}</button>
</div>
</el-dialog>
<div :class="{viewBigPicLayer:true,viewBigPicLayerDisplayNone:dspNone}" @click="colseLayer">
<i @click="colseLayer" class="el-icon-circle-close-outline clolseViewBigPicLayer" ></i>
<el-carousel height="600px" :interval="5000" trigger="click">
<el-carousel-item v-for="(item,index) in picObj" :key="index">
<img :src="item" />
</el-carousel-item>
</el-carousel>
</div>
</div>
</template>
<script>
export default {
data() {
return {
F_Query_SelfBranch: false,
F_Query_employee: false,
picObj:[],
dspNone:true,
loading:true,
outerVisible:false,
dialogTitle:"",
total:0,
currentPage: 1,
//请求数据
msg:{
RB_BranchId:'-1',
EmployeeId:'-1',
StartTime:'',
EndTime:'',
pageIndex:1,
pageSize:15,
},
getCompanyMsg:{
RB_Group_Id:'0',
Status:'0',
},
getUserMsg:{
RB_Branch_id:'-1',
},
getDetailMsg:{
pageIndex:1,
pageSize:999,
RB_BranchId:'-1',
EmployeeId:'0',
StartTime:'',
EndTime:'',
orderBy:'1',
},
//返回数据
list:[],
companyList:[],
userList:[],
layerItem:[],
}
},
methods: {
colseLayer(){
this.dspNone=true
},
getPic(obj){
this.picObj=obj
this.dspNone=false;
},
toArr(val){
let arr=[]
if(val!="[]")
{
val.substring(1,val.length-1).split(',').forEach(item=>{
arr.push(item.substring(1,item.length-1))
});
}
return arr;
},
getDetail(emId,SignTime){
this.outerVisible=true;
this.dialogTitle=this.$t('objFill.v101.administrative.waiqxianq')
this.getDetailMsg.EmployeeId=emId
this.getDetailMsg.StartTime=SignTime
this.getDetailMsg.EndTime=SignTime
this.apipost('app_user_GetSignInPageList',this.getDetailMsg,res=>{
if(res.data.resultCode==1){
this.layerItem=res.data.data.pageData;
}else{}
},err=>{})
},
getCompany(){
this.apipost('admin_get_BranchGetList',this.getCompanyMsg,res=>{
if(res.data.resultCode==1){
this.companyList=res.data.data;
}else{}
},err=>{})
},
getUser(){
if(!this.msg.EmployeeId) this.msg.EmployeeId='-1'
this.getUserMsg.RB_Branch_id=this.msg.RB_BranchId;
this.apipost('app_get_company_employee',this.getUserMsg,res=>{
if(res.data.resultCode==1){
this.userList=res.data.data;
}else{}
},err=>{})
},
getList(){
this.loading=true;
this.apipost('app_user_GetSignInManagementPageList',this.msg,res=>{
if(res.data.resultCode==1){
this.list=res.data.data.pageData;
this.total=res.data.data.count;
this.loading=false
}else{}
},err=>{})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
},
mounted() {
let userInfo=this.getLocalStorage();
let ActionMenuCode = userInfo.ActionMenuCode;
if(ActionMenuCode.indexOf('F_Query_AllIncomPay')!=-1){
this.F_Query_SelfBranch = false
}else if(ActionMenuCode.indexOf('F_Query_SelfBranch')!=-1){
this.F_Query_SelfBranch = true
this.msg.RB_BranchId = userInfo.RB_Branch_id
}else{
this.F_Query_SelfBranch = true
this.F_Query_employee = true;
this.msg.EmployeeId = userInfo.EmployeeId
}
this.getUserMsg.RB_Group_id=this.getCompanyMsg.RB_Group_Id=userInfo.RB_Group_id; //集团ID
this.getCompany()
this.getUser()
this.getList()
}
}
</script>
<style>
.outWorkItem{border-bottom:1px solid #D3D3D3; padding: 10px 0;}
.outWorkItem p {line-height: 24px;}
.outWorkItem table i{color: #bbb; margin-right:5px;}
.outWorkItem table img{width: 50px; height: 50px; margin: 10px 10px 0 0; border-radius: 4px;}
.outWorkItem table tr td{text-align: left;}
</style>