Skip to content

S
SuperMan
Commit 30be9636 authored by 黄奎's avatar 黄奎
Browse files
Options

酒店信息修改

parent fe87c6d5
Hide whitespace changes
Inline Side-by-side
Showing with 1166 additions and 1221 deletions
src/components/Hotel/ChangeHotel.vue
View file @ 30be9636
<template>
<div>
<div class="query-box" style="border-bottom: none;">
<ul>
<li v-if="isShowBtn==1">
<input type="button" class="fr normalBtn mb30" value="批量同意" @click="ChangeHotelInfo(2)"/>
<input type="button" class="fr normalBtn mb30" value="批量拒绝" @click="ChangeHotelInfo(3)"/>
</li>
</ul>
</div>
<div style="width: 100%; overflow-x: auto;padding-bottom: 10px; " class="ownScrollbarStyle">
<table border="0" cellspacing="1" cellpadding="0" class="changeHotelDetailsTalbe">
<tr>
<th class="fz14" colspan="14">酒店信息</th>
<!-- <th class="fz14" colspan="12">地接操作信息</th> -->
</tr>
<tr>
<th width="120">公司团号</th>
<th width="200">原酒店名称</th>
<th width="120">入住时间</th>
<th width="120">机位总数/(Y/E/F)</th>
<th width="120">占床/不占床</th>
<th width="80">实际用房数</th>
<th width="150">房间类型</th>
<th width="80">房间数</th>
<th width="80">房间人数</th>
<th width="200">新酒店名称</th>
<th width="150">房间预定数</th>
<th width="120">尚差房间数</th>
<th width="80">单价/每人</th>
<!--<th width="80">免减人数</th>
<th width="80">金额小计</th> -->
<th width="80">操作</th>
<!-- <th width="80">付款方式</th>
<th width="80">联系电话</th>
<th width="80">地址</th>
<th width="80">订团号</th>
<th width="80">备注</th> -->
</tr>
<tr v-for="(item,index) in list">
<td :rowspan="list.length" v-if="index==0">
<div class="w120">
<p class="link" @click="goUrlT('productQuery',TCNUM,'产品查询')">{{TCNUM}}</p>
</div>
</td>
<td><div class="w200 padding10">
<p class="link" style="word-break: normal;" @click="goUrlR('HotelManagement',item.HotelId,'酒店管理')">{{item.HotelName}}</p>
</div>
</td>
<td><div class="w100">{{item.CheckInDateStr}}</div></td>
<td>
<div class="w120">
<p class="link" @click="goUrlT('RegistrationList',item.TCID,'报名清单')">{{flightTotal}}/{{item.HouseStatistics.RealityYSeatNum}}/{{item.HouseStatistics.RealityESeatNum}}/{{item.HouseStatistics.RealityFSeatNum}}</p>
</div>
</td>
<td><div class="w120">
<p class="link" @click="goUrlT('passengerHouse',item.TCIDS,'房间分配')">{{item.HouseStatistics.NeedBed}}/{{item.HouseStatistics.NoNeedBed}}</p>
</div></td>
<td><div class="w120">{{item.HouseStatistics.RealityRoomNum}}</div></td>
<td><div class="w150">
<p class="pHouseStyle" v-for="o in item.HouseStatistics.HouseTypeList">
{{o.HouseTypeName}}
</p>
</div></td>
<td><div class="w80">
<p class="pHouseStyle" v-for="o in item.HouseStatistics.HouseTypeList">
{{o.HouseTypeCount}}
</p>
</div></td>
<td><div class="w80">
<p class="pHouseStyle" v-for="o in item.HouseStatistics.HouseTypeList">
{{o.HouseGuestNum}}
</p>
</div></td>
<td><div class="w150">
{{item.NewHotelName}}
</div></td>
<td>
<div class="w120">
<p class="pHouseStyle" v-for="o in item.OrderDetailsList">
{{o.HouseTypeCount}}
</p>
</div>
</td>
<td>
<div class="w120">
<p class="pHouseStyle" :class="{colorRed:o.HouseTypeCount-item.HouseStatistics.HouseTypeList[index].HouseTypeCount<0}" v-for="(o,index) in item.OrderDetailsList">
{{o.HouseTypeCount-item.HouseStatistics.HouseTypeList[index].HouseTypeCount}}
</p>
</div>
</td>
<td>
<div class="w120">
<p class="pHouseStyle" v-for="(o,index) in item.OrderDetailsList" @input="calculationPrice(item)">
{{o.UnitPrice}}
</p>
</div>
</td>
<!-- <td>
<div class="w80">
<p class="pHouseStyle" v-for="(o,index) in item.OrderDetailsList" @input="calculationPrice(item)">
{{o.HotelDiscount}}
</p>
</div>
</td>
<td>
<div class="w80">
<p class="pHouseStyle" v-for="(o,index) in item.OrderDetailsList">
{{o.UnitPrice*(o.HouseGuestNum-o.HotelDiscount)}}
</p>
</div>
</td> -->
<td>
<div class="w120">
<span v-if="item.HotelChangeState==1">
<input type="button" class="normalBtn" value="同意" @click="HotelChangeState(item,2)"/>
<input type="button" class="normalBtn" value="拒绝" @click="HotelChangeState(item,3)"/>
</span>
</div>
</td>
<!-- <td><div class="w120">
<el-select class='w100 sel' v-model='item.PayStyle' :placeholder="$t('pub.pleaseSel')">
<el-option label='请选择' value='0' ></el-option>
<el-option label='现付' value='1' ></el-option>
<el-option label='签单' value='2' ></el-option>
<el-option label='实物抵扣' value='5' ></el-option>
<el-option label='预付' value='4' ></el-option>
</el-select>
</div></td>
<td><div class="w120">{{item.Tel}}</div></td>
<td><div class="w200 padding10">{{item.Address}}</div></td>
<td>
<div class="w150">
<el-input class='w120' v-model='item.ReserveNo'></el-input>
</div>
</td>
<td>
<div class="w150">
<el-input type='textarea' class='w120' v-model='item.Remarks'></el-input>
</div>
</td> -->
</tr>
</table>
</div>
</div>
<div>
<div style="width: 100%; overflow-x: auto;padding-bottom: 10px; " class="ownScrollbarStyle">
<table border="0" cellspacing="1" cellpadding="0" class="changeHotelDetailsTalbe">
<tr>
<th colspan="14">酒店信息</th>
</tr>
<tr>
<th>
公司团号
</th>
<th colspan="12" class="tdLeft">
<a class="link" @click="goUrlT('productQuery',TCNUM,'产品查询')">{{TCNUM}}</a>
</th>
<th>
<input type="button" class="fr normalBtn mb30" value="确认" @click="ChangeHotelInfo()" />
</th>
</tr>
<tr>
<th width="120">入住时间</th>
<th width="80">选择酒店</th>
<th width="200">原酒店名称</th>
<th width="120">机位数(Y/E/F)</th>
<th width="120">占床/不占床</th>
<th width="80">实际用房数</th>
<th width="150">房间类型</th>
<th width="80">房间数</th>
<th width="80">房间人数</th>
<th width="200">新酒店名称</th>
<th width="150">房间预定数</th>
<th width="120">尚差房间数</th>
<th width="80">单价/每人</th>
<th width="100">状态</th>
</tr>
<template v-for="(item,index) in DataList">
<template v-for="(subItem,subIndex) in item.HotelOrderList">
<tr v-for="(childItem,childIndex) in subItem.OrderDetailsList">
<td v-if="childIndex==0&&subIndex==0" :rowspan="5*item.HotelOrderList.length" class="tdCenter">
{{item.UseTimeStr}}
</td>
<td v-if="childIndex==0" :rowspan="5" class="tdCenter">
<el-checkbox v-model='subItem.IsChecked'></el-checkbox>
</td>
<td v-if="childIndex==0" :rowspan="5" class="tdLeft">
<p class="link" style="word-break: normal;" @click="goUrlR('HotelManagement',HotelId.HotelId,'酒店管理')">
{{subItem.HotelName}}</p>
</td>
<td v-if="childIndex==0" :rowspan="5" class="tdCenter">
<p class="link" @click="goUrlT('RegistrationList',item.TCID,'报名清单')">
{{subItem.HouseStatistics.RealityYSeatNum}}/{{subItem.HouseStatistics.RealityESeatNum}}/{{subItem.HouseStatistics.RealityFSeatNum}}
</p>
</td>
<td v-if="childIndex==0" :rowspan="5" class="tdCenter">
<p class="link" @click="goUrlT('passengerHouse',item.TCIDS,'房间分配')">
{{subItem.HouseStatistics.NeedBed}}/{{subItem.HouseStatistics.NoNeedBed}}</p>
</td>
<td v-if="childIndex==0" :rowspan="5" class="tdCenter">
{{subItem.HouseStatistics.RealityRoomNum}}
</td>
<td class="tdCenter">
{{subItem.HouseStatistics.HouseTypeList[childIndex].HouseTypeName}}
</td>
<td class="tdCenter">
{{subItem.HouseStatistics.HouseTypeList[childIndex].HouseTypeCount}}
</td>
<td class="tdCenter">
{{subItem.HouseStatistics.HouseTypeList[childIndex].HouseGuestNum}}
</td>
<td v-if="childIndex==0" :rowspan="5" class="tdLeft">
{{subItem.NewHotelName}}
</td>
<td class="tdCenter">
{{childItem.HouseTypeCount}}
</td>
<td class="tdCenter">
{{childItem.HouseTypeCount-subItem.HouseStatistics.HouseTypeList[childIndex].HouseTypeCount}}
</td>
<td class="tdCenter">
{{childItem.UnitPrice}}
</td>
<td class="tdCenter" v-if="childIndex==0" :rowspan="5">
<template v-if="subItem.OPState==1">
OP-OK
</template>
<template v-else>
{{subItem.DMCState==1?"地接-OK":(subItem.DMCState==2?"地接-暂定":"地接-未操作")}}
</template>
</td>
</tr>
</template>
</template>
</table>
</div>
</div>
</template>
<script>
export default {
data () {
return {
defaultSelectValue:0,
list:[],
roomList:[],
TCNUM:'',
flightTotal:0,
GuestNum:0,
hotelList:[],
isShowBtn:0,
}
},
methods: {
goUrl(path, obj, name) {
this.$router.push({
path: path,
query: {
id: obj.HotelId,
blank: "y",
tab: name
}
});
},
goUrlR(path,obj,title){
this.$router.push({ name:path,query:{"ID":obj,blank:'y',tab:title}})
},
goUrlT(path,obj,title){
this.$router.push({ name:path,query:{"id":obj,blank:'y',tab:title}})
},
getList(){
this.apipost('dmcstatistics_get_GetHotelStaticsDetail',{TCIDs:this.$route.query.id,NewCombinationNum:this.$route.query.TCNUM},res=>{
if(res.data.resultCode==1){
this.list=res.data.data.HotelList;
this.list.forEach(item=>{
if(item.HotelChangeState>0){
this.isShowBtn=1;
}
item.PayStyle=item.PayStyle.toString()
})
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
getHotelList(obj){
this.apipost('hotel_post_GetLineHotelList',{IsGetPic: 0,IsGetRemark: 0,QCity:obj.QCity},res=>{
if(res.data.resultCode==1){
obj.hotelList=res.data.data
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
sendValue(obj){
if(obj.hotelList.length>0)
{
let ckedObj=obj.hotelList.find(item=>item.ID==obj.NewHotelId)
obj.Address=ckedObj.Address
obj.Tel=ckedObj.Tel
obj.NewHotelName=ckedObj.Name
}else{
obj.Address=''
obj.Tel=''
}
},
HotelChangeState(obj,State){
if(State==2){//给出提示
obj.HotelChangeState=State;
this.$confirm('是否同意？同意后将覆盖之前的信息！', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.saveList(0);
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
else{
this.saveList(0);
}
},
ChangeHotelInfo(type){
if (type==2){
this.$confirm('是否同意？同意后将覆盖之前的信息！', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.list.forEach(item=>{
if(item.HotelChangeState>0){
item.HotelChangeState=2
}
});
this.saveList();
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
else if (type==3){
this.list.forEach(item=>{
if(item.HotelChangeState>0){item.HotelChangeState=3}
});
this.saveList();
}
},
saveList(){
//暂时不开放此功能，测试通过后再开放
this.apipost('dmcstatistics_post_SetUpdateHotelOrder',this.list,res=>{
if(res.data.resultCode==1){
this.$message.success(res.data.message)
this.getList()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
export default {
data() {
return {
DataList: [],
TCNUM: '',
TCIDs: "",
isShowBtn: 0,
}
},
created() {
methods: {
goUrl(path, obj, name) {
this.$router.push({
path: path,
query: {
id: obj.HotelId,
blank: "y",
tab: name
}
});
},
goUrlR(path, obj, title) {
this.$router.push({
name: path,
query: {
"ID": obj,
blank: 'y',
tab: title
}
})
},
goUrlT(path, obj, title) {
this.$router.push({
name: path,
query: {
"id": obj,
blank: 'y',
tab: title
}
})
},
getList() {
this.apipost('dmcstatistics_get_GetHotelStaticsDetail', {
TCIDs: this.TCIDs,
NewCombinationNum: this.TCNUM
}, res => {
if (res.data.resultCode == 1) {
this.DataList = res.data.data.HotelOrderListReport;
} else {
this.Error(res.data.message);
}
}, err => {})
},
//更换酒店
ChangeHotelInfo() {
var that = this;
this.Confirm("是否同意替换选中酒店？同意后将覆盖之前的行程酒店信息！", function () {
that.saveList();
});
},
//保存酒店修改信息
saveList() {
this.apipost('dmcstatistics_post_SetUpdateHotelOrder', this.DataList, res => {
if (res.data.resultCode == 1) {
this.Success(res.data.message);
this.getList();
} else {
this.Error(res.data.message);
}
}, err => {})
},
},
mounted() {
this.TCNUM=this.$route.query.TCNUM
this.flightTotal=this.$route.query.flightTotal
this.GuestNum=this.$route.query.GuestNum
this.getList()
// this.getHotelList()
},
}
this.TCNUM = this.$route.query.TCNUM;
this.TCIDs = this.$route.query.id;
this.getList();
},
}
</script>
<style>
.changeHotelDetailsTalbe{ background: #ddd;}
.changeHotelDetailsTalbe tr th{background: #eee;height:40px; font-size: 12px; color: #333;}
.changeHotelDetailsTalbe tr{background: #fff;text-align: center; height: 40px;}
.changeHotelDetailsTalbe tr td{font-size: 12px;}
.changeHotelDetailsTalbe tr td .pHouseStyle{border-bottom: 1px solid #ccc; height:28px; line-height: 28px;}
.changeHotelDetailsTalbe tr td .colorRed{color: #E95252;}
.changeHotelDetailsTalbe tr td .pHouseStyle:last-child{border-bottom: none;}
.changeHotelDetailsTalbe tr td .sel input{height: 34px!important; padding-right: 20px!important; padding-left: 5px!important; font-size: 12px!important;}
.changeHotelDetailsTalbe tr td .link:hover{text-decoration: underline; cursor: pointer;}
.changeHotelDetailsTalbe {
border-collapse: collapse;
}
.changeHotelDetailsTalbe tr th {
background: #eee;
height: 40px;
font-size: 12px;
color: #333;
border: 1px solid #d1d1d1;
}
.changeHotelDetailsTalbe tr td {
font-size: 12px;
border: 1px solid #d1d1d1;
height: 25px;
line-height: 25px;
padding-left: 5px;
}
.changeHotelDetailsTalbe tr td .link:hover {
text-decoration: underline;
cursor: pointer;
}
.changeHotelDetailsTalbe .tdLeft {
text-align: left;
padding-left: 5px;
}
.changeHotelDetailsTalbe .tdCenter {
text-align: center;
}
</style>
\ No newline at end of file
src/components/administrative/AttendanceRules.vue
View file @ 30be9636
<template>
<div class="flexOne">
<div class="att_title">工作日设置</div>
<table class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>工作日</th>
<th>上班时间</th>
<th>下班时间</th>
<th>操作</th>
</tr>
<tr v-for="(item,index) in listArr">
<td>
<el-checkbox @change='activateOrDisabled(index)' v-model='item.IsCheck'>{{item.Workday}}</el-checkbox>
</td>
<td>
<el-time-select v-model='item.BeOnDutyTime' :picker-options="{start: '08:00',step: '00:05',end: '22:00', maxTime: item.OffDutyTime}" :disabled='!item.IsCheck'></el-time-select>
</td>
<td>
<el-time-select v-model='item.OffDutyTime' :picker-options="{start: '08:00',step: '00:05',end: '22:00', minTime: item.BeOnDutyTime}" :disabled='!item.IsCheck'></el-time-select>
</td>
<td>
<el-tooltip v-if='index>0' class="item" effect="dark" content="同上" placement="right">
<el-button type="primary" icon="el-icon-circle-plus-outline" @click='copyPrev(index)' circle></el-button>
</el-tooltip>
</td>
</tr>
</table>
<div class="att_title">特殊日期</div>
<div class="att_special_dates">必须打卡的日期 <input class="att_addBtn" type="button" value="添加" @click="addSignIn"></div>
<table v-if='this.signInDates.length>=1' class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>日期</th>
<th>考勤时间</th>
<th width="80">操作</th>
</tr>
<tr v-for="(item,index) in signInDates">
<td>{{item.Date}}</td>
<td>{{item.BeOnDutyTime}}~{{item.OffDutyTime}}</td>
<td>
<el-row>
<!--<el-tooltip class="item" effect="dark" content="修改" placement="right">
<el-button type="primary" icon="el-icon-edit" @click='updateSignIn(index)' circle></el-button>
</el-tooltip>-->
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteSignIn(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
<div class="att_special_dates">不用打卡的日期 <input class="att_addBtn" type="button" value="添加" @click="addSignOut"></div>
<table v-if='this.signOutDates.length>=1' class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>日期</th>
<th width="80">操作</th>
</tr>
<tr v-for="(item,index) in signOutDates">
<td>{{item.Date}}</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteSignOut(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
<div class="att_title">考勤方式<span>以下方式满足一项，考勤组成员即可完成考勤</span></div>
<div class="att_type_item">
<p>1.根据地点考勤<span>(可添加多个考勤地点)</span></p>
<p>有效范围
<el-select v-model='addressRange' @change='setAddressRange'>
<el-option label='100米' value='100'></el-option>
<el-option label='200米' value='200'></el-option>
<el-option label='300米' value='300'></el-option>
<el-option label='400米' value='400'></el-option>
<el-option label='500米' value='500'></el-option>
</el-select>
</p>
<table class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th align="left" style="text-indent: 30px;">考勤地址</th>
<th width="80">操作</th>
</tr>
<tr v-if="awListData.length==0">
<td colspan="2">未添加办公地点！</td>
</tr>
<tr v-for="(item,index) in awListData">
<td align="left">
<p class="awName">
{{item.Name}}
</p>
<p class="awAddress">
{{item.Address}}
</p>
</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteAddress(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
</div>
<input class="att_addBtn" type="button" value="添加地点" @click="addAddress()">
<div class="att_type_item">
<p>2.根据Wifi考勤<span>(可添加多个办公wifi)</span></p>
<table class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>名称</th>
<th>MAC地址</th>
<th width="80">操作</th>
</tr>
<tr v-if="awWifiListDates.length==0">
<td colspan="3">未添加办公Wifi！</td>
</tr>
<tr v-for="(item,index) in awWifiListDates">
<td>{{item.Name}}</td>
<td>{{item.TargetAddress}}</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteWifi(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
</div>
<input class="att_addBtn" type="button" value="添加WIFI" @click="addWifi">
<div class="att_saveDiv">
<input type="button" class="normalBtn" value="保存设置" @click="addAttendance" />
<input type="button" class="hollowFixedBtn" value="取消" @click="goBack()" />
</div>
<el-dialog custom-class='att_addDates' :title="dialogTitle" :visible.sync="outerVisible" center>
<table class="layerTable" v-if='this.signDateType==1'>
<tr>
<td>
<span>添加方式</span>
<label><input type="radio" value="one" v-model="picked">单天</label>
<label><input type="radio" value="two" v-model="picked">范围</label>
</td>
</tr>
<tr v-if="picked=='one'">
<td><span><em></em>日期</span>
<el-date-picker class='w275' v-model='newSignIn.Date' type="date" :picker-options="pickerOptions" value-format="yyyy-MM-dd"></el-date-picker>
</td>
</tr>
<tr v-if="picked=='two'">
<td><span><em></em>日期</span>
<el-date-picker class='w135' v-model='fwStartTime' type="date" :picker-options="pickerOptions" value-format="yyyy-MM-dd" @change='getDateArr'></el-date-picker>
<el-date-picker class='w135' v-model='fwEndTime' type="date" :picker-options="pickerOptions" value-format="yyyy-MM-dd" @change='getDateArr'></el-date-picker>
</td>
</tr>
<tr>
<td><span><em></em>上班时间</span>
<el-time-select class='w275' v-model='newSignIn.BeOnDutyTime' :picker-options="{start: '08:00',step: '00:05',end: '22:00', maxTime:this.newSignIn.OffDutyTime}"></el-time-select>
</td>
</tr>
<tr>
<td><span><em></em>下班时间</span>
<el-time-select class='w275' v-model='newSignIn.OffDutyTime' :picker-options="{start: '08:00',step: '00:05',end: '22:00', minTime:this.newSignIn.BeOnDutyTime}"></el-time-select>
</td>
</tr>
</table>
<table class="layerTable" v-if='this.signDateType==2'>
<tr>
<td>
<span>添加方式</span>
<label><input type="radio" value="one" v-model="picked1">单天</label>
<label><input type="radio" value="two" v-model="picked1">范围</label>
</td>
</tr>
<tr v-if="picked1=='one'">
<td><span><em></em>日期</span>
<el-date-picker class='w275' v-model='newSignOut.Date' :picker-options="pickerOptions" type="date" value-format="yyyy-MM-dd"></el-date-picker>
</td>
</tr>
<tr v-if="picked1=='two'">
<td><span><em></em>日期</span>
<el-date-picker class='w135' v-model='fwStartTime1' type="date" :picker-options="pickerOptions" value-format="yyyy-MM-dd" @change='getDateArr1'></el-date-picker>
<el-date-picker class='w135' v-model='fwEndTime1' type="date" :picker-options="pickerOptions" value-format="yyyy-MM-dd" @change='getDateArr1'></el-date-picker>
</td>
</tr>
</table>
<div v-if='this.signDateType==3' class="amap-page-container">
<el-amap-search-box class="search-box" :search-option="searchOption" :on-search-result="onSearchResult"></el-amap-search-box>
<el-amap vid="amapDemo" :center="center" :zoom="12" style='width: 744px;height: 450px; border:1px solid #ccc;'>
<el-amap-marker v-for="(marker, index) in markers" :key='index' :position="marker.position" :radius="marker.radius" :fill-color="marker.fillColor" :fill-opacity="marker.fillOpacity" :events="marker.events"></el-amap-marker>
</el-amap>
<table style="width: 100%;">
<tr height="45">
<td align="right">名称：</td>
<td><input class="att_map_input" type="text" v-model="newAwlist.Name" /></td>
<td align="right">详细地址：</td>
<td><input class="att_map_input" type="text" v-model="newAwlist.Address" /></td>
</tr>
<tr height="45">
<td align="right">经纬度：</td>
<td><input class="att_map_input" type="text" v-model="newAwlist.TargetAddress" readonly="" /></td>
</tr>
</table>
</div>
<table class="layerTable" v-if='this.signDateType==4'>
<tr>
<td>
<span><em></em>名称</span>
<el-input class='w200' v-model='newAwWiFi.Name'></el-input>
</td>
</tr>
<tr>
<td>
<span><em></em>MAC地址</span>
<el-input class='w200' v-model='newAwWiFi.TargetAddress'></el-input>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="cancel">取 消</button> &nbsp;
<button v-if='saveBtnType==1' class="normalBtn" type="primary" @click="saveSignIn()">保存</button>
<button v-if='saveBtnType==3' class="normalBtn" type="primary" @click="saveSignOut()">保存</button>
<button v-if='saveBtnType==4' class="normalBtn" type="primary" @click="saveWifi()">保存</button>
<button v-if='saveBtnType==5' class="normalBtn" type="primary" @click="saveAddress()">保存</button>
</div>
</el-dialog>
</div>
<div class="flexOne">
<div class="att_title">工作日设置</div>
<table class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>工作日</th>
<th>上班时间</th>
<th>下班时间</th>
<th>操作</th>
</tr>
<tr v-for="(item,index) in listArr">
<td>
<el-checkbox @change='activateOrDisabled(index)' v-model='item.IsCheck'>{{item.Workday}}</el-checkbox>
</td>
<td>
<el-time-select v-model='item.BeOnDutyTime'
:picker-options="{start: '08:00',step: '00:05',end: '22:00', maxTime: item.OffDutyTime}"
:disabled='!item.IsCheck'></el-time-select>
</td>
<td>
<el-time-select v-model='item.OffDutyTime'
:picker-options="{start: '08:00',step: '00:05',end: '22:00', minTime: item.BeOnDutyTime}"
:disabled='!item.IsCheck'></el-time-select>
</td>
<td>
<el-tooltip v-if='index>0' class="item" effect="dark" content="同上" placement="right">
<el-button type="primary" icon="el-icon-circle-plus-outline" @click='copyPrev(index)' circle></el-button>
</el-tooltip>
</td>
</tr>
</table>
<div class="att_title">特殊日期</div>
<div class="att_special_dates">必须打卡的日期 <input class="att_addBtn" type="button" value="添加" @click="addSignIn"></div>
<table v-if='this.signInDates.length>=1' class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>日期</th>
<th>考勤时间</th>
<th width="80">操作</th>
</tr>
<tr v-for="(item,index) in signInDates">
<td>{{item.Date}}</td>
<td>{{item.BeOnDutyTime}}~{{item.OffDutyTime}}</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteSignIn(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
<div class="att_special_dates">不用打卡的日期 <input class="att_addBtn" type="button" value="添加" @click="addSignOut"></div>
<table v-if='this.signOutDates.length>=1' class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>日期</th>
<th width="80">操作</th>
</tr>
<tr v-for="(item,index) in signOutDates">
<td>{{item.Date}}</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteSignOut(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
<div class="att_title">考勤方式<span>以下方式满足一项，考勤组成员即可完成考勤</span></div>
<div class="att_type_item">
<p>1.根据地点考勤<span>(可添加多个考勤地点)</span></p>
<p>有效范围
<el-select v-model='addressRange' @change='setAddressRange'>
<el-option label='100米' value='100'></el-option>
<el-option label='200米' value='200'></el-option>
<el-option label='300米' value='300'></el-option>
<el-option label='400米' value='400'></el-option>
<el-option label='500米' value='500'></el-option>
</el-select>
</p>
<table class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th align="left" style="text-indent: 30px;">考勤地址</th>
<th width="80">操作</th>
</tr>
<tr v-if="awListData.length==0">
<td colspan="2">未添加办公地点！</td>
</tr>
<tr v-for="(item,index) in awListData">
<td align="left">
<p class="awName">
{{item.Name}}
</p>
<p class="awAddress">
{{item.Address}}
</p>
</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteAddress(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
</div>
<input class="att_addBtn" type="button" value="添加地点" @click="addAddress()">
<div class="att_type_item">
<p>2.根据Wifi考勤<span>(可添加多个办公wifi)</span></p>
<table class="att_table" cellspacing="0" cellpadding="0">
<tr>
<th>名称</th>
<th>MAC地址</th>
<th width="80">操作</th>
</tr>
<tr v-if="awWifiListDates.length==0">
<td colspan="3">未添加办公Wifi！</td>
</tr>
<tr v-for="(item,index) in awWifiListDates">
<td>{{item.Name}}</td>
<td>{{item.TargetAddress}}</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" content="删除" placement="right">
<el-button type="danger" icon="el-icon-delete" @click='deleteWifi(index)' circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
</div>
<input class="att_addBtn" type="button" value="添加WIFI" @click="addWifi">
<div class="att_saveDiv">
<input type="button" class="normalBtn" value="保存设置" @click="addAttendance" />
<input type="button" class="hollowFixedBtn" value="取消" @click="goBack()" />
</div>
<el-dialog custom-class='att_addDates' :title="dialogTitle" :visible.sync="outerVisible" center>
<table class="layerTable" v-if='this.signDateType==1'>
<tr>
<td>
<span>添加方式</span>
<label><input type="radio" value="one" v-model="picked">单天</label>
<label><input type="radio" value="two" v-model="picked">范围</label>
</td>
</tr>
<tr v-if="picked=='one'">
<td><span><em></em>日期</span>
<el-date-picker class='w275' v-model='newSignIn.Date' type="date" :picker-options="pickerOptions"
value-format="yyyy-MM-dd"></el-date-picker>
</td>
</tr>
<tr v-if="picked=='two'">
<td><span><em></em>日期</span>
<el-date-picker class='w135' v-model='fwStartTime' type="date" :picker-options="pickerOptions"
value-format="yyyy-MM-dd" @change='getDateArr'></el-date-picker>
<el-date-picker class='w135' v-model='fwEndTime' type="date" :picker-options="pickerOptions"
value-format="yyyy-MM-dd" @change='getDateArr'></el-date-picker>
</td>
</tr>
<tr>
<td><span><em></em>上班时间</span>
<el-time-select class='w275' v-model='newSignIn.BeOnDutyTime'
:picker-options="{start: '08:00',step: '00:05',end: '22:00', maxTime:this.newSignIn.OffDutyTime}">
</el-time-select>
</td>
</tr>
<tr>
<td><span><em></em>下班时间</span>
<el-time-select class='w275' v-model='newSignIn.OffDutyTime'
:picker-options="{start: '08:00',step: '00:05',end: '22:00', minTime:this.newSignIn.BeOnDutyTime}">
</el-time-select>
</td>
</tr>
</table>
<table class="layerTable" v-if='this.signDateType==2'>
<tr>
<td>
<span>添加方式</span>
<label><input type="radio" value="one" v-model="picked1">单天</label>
<label><input type="radio" value="two" v-model="picked1">范围</label>
</td>
</tr>
<tr v-if="picked1=='one'">
<td><span><em></em>日期</span>
<el-date-picker class='w275' v-model='newSignOut.Date' :picker-options="pickerOptions" type="date"
value-format="yyyy-MM-dd"></el-date-picker>
</td>
</tr>
<tr v-if="picked1=='two'">
<td><span><em></em>日期</span>
<el-date-picker class='w135' v-model='fwStartTime1' type="date" :picker-options="pickerOptions"
value-format="yyyy-MM-dd" @change='getDateArr1'></el-date-picker>
<el-date-picker class='w135' v-model='fwEndTime1' type="date" :picker-options="pickerOptions"
value-format="yyyy-MM-dd" @change='getDateArr1'></el-date-picker>
</td>
</tr>
</table>
<div v-if='this.signDateType==3' class="amap-page-container">
<el-amap-search-box class="search-box" :search-option="searchOption" :on-search-result="onSearchResult">
</el-amap-search-box>
<el-amap vid="amapDemo" :center="center" :zoom="12" style='width: 744px;height: 450px; border:1px solid #ccc;'>
<el-amap-marker v-for="(marker, index) in markers" :key='index' :position="marker.position"
:radius="marker.radius" :fill-color="marker.fillColor" :fill-opacity="marker.fillOpacity"
:events="marker.events"></el-amap-marker>
</el-amap>
<table style="width: 100%;">
<tr height="45">
<td align="right">名称：</td>
<td><input class="att_map_input" type="text" v-model="newAwlist.Name" /></td>
<td align="right">详细地址：</td>
<td><input class="att_map_input" type="text" v-model="newAwlist.Address" /></td>
</tr>
<tr height="45">
<td align="right">经纬度：</td>
<td><input class="att_map_input" type="text" v-model="newAwlist.TargetAddress" readonly="" /></td>
</tr>
</table>
</div>
<table class="layerTable" v-if='this.signDateType==4'>
<tr>
<td>
<span><em></em>名称</span>
<el-input class='w200' v-model='newAwWiFi.Name'></el-input>
</td>
</tr>
<tr>
<td>
<span><em></em>MAC地址</span>
<el-input class='w200' v-model='newAwWiFi.TargetAddress'></el-input>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="cancel">取 消</button> &nbsp;
<button v-if='saveBtnType==1' class="normalBtn" type="primary" @click="saveSignIn()">保存</button>
<button v-if='saveBtnType==3' class="normalBtn" type="primary" @click="saveSignOut()">保存</button>
<button v-if='saveBtnType==4' class="normalBtn" type="primary" @click="saveWifi()">保存</button>
<button v-if='saveBtnType==5' class="normalBtn" type="primary" @click="saveAddress()">保存</button>
</div>
</el-dialog>
</div>
</template>
<script>
import VueAMap from 'vue-amap'
let amapManager = new VueAMap.AMapManager();
export default {
data() {
return {
fwStartTime:'',
fwEndTime:'',
fwStartTime1:'',
fwEndTime1:'',
fwdateArr:[],
fwdateArr1:[],
picked:'one',
picked1:'one',
searchOption: {},
markers: [],
center: [104.090588, 30.643365],
pickerOptions: {
disabledDate(time) {
return time.getTime() < Date.now() - 8.64e7;
}
},
zoom: 12,
amapManager,
events: {},
searchData: [],
lnglatXY: [],
addMapStyle: false,
outerVisible: false,
innerVisible: false,
isRight: true,
dialogTitle: '',
specialDatesIsShow: true,
wdListArr: [],
signInDates: [],
newSignIn: {
'Date': '',
'BeOnDutyTime': '',
'OffDutyTime': ''
},
signOutDates: [],
newSignOut: {
'Date': ''
},
awWifiListDates: [],
newAwWiFi: {
'Name': '',
'TargetAddress': ''
},
awListData: [],
newAwlist: {
'Name': '',
'Address': '',
'TargetAddress': '',
'Scope': ''
},
SpecialDates: [],
signDateType: 0,
saveBtnType: 1,
isRepetition: false,
awListDates: [],
addressRange: '300',
listArr: [{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周一",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周二",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周三",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周四",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周五",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周六",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周日",
"BeOnDutyTime": "",
"OffDutyTime": ""
}
],
//请求数据
addMsg: {
attendanceId: '-1',
RB_BranchId: '0',
Status: '0',
wdList: [], //[{'Workday'：周一,'BeOnDutyTime':'09:30:00','OffDutyTime':'09:30:00'}，{}，{}]
tdList: [], //特殊打卡 [{'Date':'2018-04-15',BeOnDutyTime':'09:30:00','OffDutyTime':'09:30:00'},{}]
NottdList: [], //[{Date:'2018-04-15'}] //特殊不打卡
awList: [], //Name，Address，TargetAddress，Scope awList：[{'Name'：'xxx',Address:'xxx',TargetAddress:'xxx',Scope：'xxx'},{}]
awWifiList: [] //awWifiList:[{'Name':'xxxx',TargetAddress:'12.51.42.32'}]
},
}
},
methods: {
getDateArr(){
if(this.fwStartTime!=''&&this.fwEndTime!=''){
this.apipost('User_get_AttendanceGetTimeSpanValue',{StartTime:this.fwStartTime,EndTime:this.fwEndTime},res=>{
this.fwdateArr=res.data.data
},err=>{})
}
},
getDateArr1(){
if(this.fwStartTime1!=''&&this.fwEndTime1!=''){
this.apipost('User_get_AttendanceGetTimeSpanValue',{StartTime:this.fwStartTime1,EndTime:this.fwEndTime1},res=>{
this.fwdateArr1=res.data.data
},err=>{})
}
},
onSearchResult(pois) {
let latSum = 0;
let lngSum = 0;
this.markers.length = 0
if(pois.length > 0) {
pois.forEach(poi => {
let {
lng,
lat
} = poi;
lngSum += lng;
latSum += lat;
let markerItem = {
position: [poi.lng, poi.lat],
radius: 20,
fillOpacity: 1,
fillColor: 'rgba(0,0,255,1)',
events: {
click: (e) => {
this.newAwlist.Name = e.target.Uh.events.name;
this.newAwlist.Address = e.target.Uh.events.address;
this.newAwlist.TargetAddress = e.lnglat.lat + ',' + e.lnglat.lng;
},
address: poi.address,
name: poi.name,
},
}
this.markers.push(markerItem);
});
let center = {
lng: lngSum / pois.length,
lat: latSum / pois.length
};
this.center = [center.lng, center.lat];
}
},
activateOrDisabled(index) {
if(this.listArr[index].IsCheck == false) {
this.listArr[index].BeOnDutyTime = '';
this.listArr[index].OffDutyTime = '';
}
},
copyPrev(index) {
if(this.listArr[index].IsCheck == true) {
this.listArr[index].BeOnDutyTime = this.listArr[index - 1].BeOnDutyTime;
this.listArr[index].OffDutyTime = this.listArr[index - 1].OffDutyTime;
}
},
addSignIn() {
this.saveBtnType = 1;
this.dialogTitle = '添加必须打卡日期';
this.newSignIn = {
'Date': '',
'BeOnDutyTime': '',
'OffDutyTime': ''
};
this.outerVisible = true;
this.signDateType = 1;
},
updateSignIn(index) {
this.dialogTitle = '修改必须打卡日期';
this.outerVisible = true;
this.signDateType = 1;
this.saveBtnType = 2;
this.newSignIn.Date = this.signInDates[index].Date;
this.newSignIn.BeOnDutyTime = this.signInDates[index].BeOnDutyTime;
this.newSignIn.OffDutyTime = this.signInDates[index].OffDutyTime;
},
deleteSignIn(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.signInDates.splice(index, 1)
this.getSpecialDates()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
saveSignIn() {
if(this.picked=='one'){ // 单天设置
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if(this.newSignIn.Date == item) {
this.isRepetition = true;
}
})
if(this.newSignIn.Date != '' && this.newSignIn.BeOnDutyTime != '' && this.newSignIn.OffDutyTime != '') {
if(!this.isRepetition) {
this.signInDates.unshift(this.newSignIn);
this.newSignIn = {
'Date': '',
'BeOnDutyTime': '',
'OffDutyTime': ''
};
this.getSpecialDates()
this.outerVisible=false;
this.$message.success('添加成功！');
} else {
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
}
} else {
this.$message.warning('请填写完整信息！')
}
}
if(this.picked=='two'){ //范围设置
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if(this.fwdateArr.findIndex(x=>x==item)!=-1){
this.isRepetition = true; //存在重复
}
})
if(this.isRepetition){
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
}else{
this.fwdateArr.forEach(item=>{
this.signInDates.push({'Date':item,'BeOnDutyTime':this.newSignIn.BeOnDutyTime,'OffDutyTime':this.newSignIn.OffDutyTime})
this.getSpecialDates()
this.outerVisible=false;
this.$message.success('添加成功！');
this.fwStartTime=''
this.fwEndTime=''
})
}
}
},
addSignOut() {
this.newSignOut.Date = '',
this.signDateType = 2;
this.dialogTitle = '添加不用打卡日期';
this.saveBtnType = 3;
this.outerVisible = true;
},
saveSignOut() {
if(this.picked1=='one'){ // 单天设置
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if(this.newSignOut.Date == item) {
this.isRepetition = true;
}
})
if(!this.isRepetition) {
this.signOutDates.unshift(this.newSignOut);
this.newSignOut = {
'Date': ''
};
this.getSpecialDates()
this.outerVisible=false;
this.$message.success('添加成功!');
} else {
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
}
}
if(this.picked1=='two'){
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if(this.fwdateArr1.findIndex(x=>x==item)!=-1){
this.isRepetition = true; //存在重复
}
})
if(this.isRepetition){
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
}else{
this.fwdateArr1.forEach(item=>{
this.signOutDates.push({'Date':item})
this.getSpecialDates()
this.outerVisible=false;
this.$message.success('添加成功！');
this.fwStartTime1=''
this.fwEndTime1=''
})
}
}
},
deleteSignOut(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.signOutDates.splice(index, 1)
this.getSpecialDates()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
getSpecialDates() { //特殊天数集合
this.SpecialDates=[]
this.signInDates.forEach(item => {
if(item.Date && item.Date != '')
this.SpecialDates.push(item.Date)
})
this.signOutDates.forEach(item => {
if(item.Date && item.Date != '')
this.SpecialDates.push(item.Date)
})
},
addAddress() {
document.getElementsByClassName("att_addDates")[0].style.width = '800px';
this.searchData = null;
this.newAwlist.Name = '';
this.newAwlist.Address = '';
this.newAwlist.TargetAddress = '';
this.saveBtnType = 5;
this.dialogTitle = '添加办公地点';
this.outerVisible = true;
this.signDateType = 3;
},
saveAddress() {
this.newAwlist.Scope = this.addressRange;
if(this.newAwlist.Name!=''&&this.newAwlist.Address!=''&&this.newAwlist.TargetAddress!=''){
this.awListData.unshift(this.newAwlist);
this.newAwlist = {
'Name': '',
'Address': '',
'TargetAddress': '',
'Scope': ''
};
this.outerVisible = false;
this.$alert('添加成功！', '提示');
}else{
this.$alert('请填写完整信息！', '提示')
}
},
deleteAddress(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.awListData.splice(index, 1)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
setAddressRange() {
this.awListData.forEach(item => {
item.Scope = this.addressRange
})
},
addWifi() {
this.dialogTitle = '添加WIFI';
this.outerVisible = true;
this.signDateType = 4;
this.saveBtnType = 4;
},
saveWifi() {
if(this.newAwWiFi.Name != '' && this.newAwWiFi.TargetAddress != '') {
this.awWifiListDates.unshift(this.newAwWiFi);
this.newAwWiFi = {
'Name': '',
'TargetAddress': ''
};
} else {
this.$alert('请填写完整信息！', '提示')
}
},
deleteWifi(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.awWifiListDates.splice(index, 1)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
cancel() {
document.getElementsByClassName("att_addDates")[0].style.width = '500px';
this.outerVisible = false;
},
addAttendance() {
this.wdListArr=[]
this.listArr.forEach(item => {
if(item.IsCheck == true && item.BeOnDutyTime != '' && item.OffDutyTime != '') {
this.wdListArr.push({
'Workday': item.Workday,
"BeOnDutyTime": item.BeOnDutyTime,
"OffDutyTime": item.OffDutyTime
})
}
})
this.addMsg.wdList = this.wdListArr; //工作日设置
this.addMsg.tdList = this.signInDates; //必须打卡的日期
this.addMsg.NottdList = this.signOutDates; //不用打卡的日期
this.addMsg.awList = this.awListData; //根据地点考勤
this.addMsg.awWifiList = this.awWifiListDates; //根据Wifi考勤
this.apipost('User_post_AttendanceSet', this.addMsg, res => {
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.goBack()
}else{
this.$message.error(res.data.message)
}
}, err => {})
},
getUpdateList() { //获取修改数据
this.apipost('User_get_AttendanceGet', {
attendanceId: this.addMsg.attendanceId
}, res => {
this.listArr = res.data.data.WdList;
this.listArr.forEach((item, index) => {
item.IsCheck = res.data.data.WdList[index].IsCheck == '1' ? true : false
})
this.signInDates = res.data.data.TdList;
this.signInDates.forEach(item => {
item.Date = item.Date.substring(0, 10)
})
this.signOutDates = res.data.data.NottdList;
this.signOutDates.forEach(item => {
item.Date = item.Date.substring(0, 10)
})
this.getSpecialDates();
this.awListData = res.data.data.AwList;
this.awWifiListDates = res.data.data.AwWifiList;
if(res.data.data.AwList.length > 0) {
this.addressRange = res.data.data.AwList[0].Scope.toString();
}
}, err => {})
},
goBack() {
history.back(-1)
},
},
mounted() {
this.addMsg.RB_BranchId = this.$route.query.bId;
if(this.$route.query.id != undefined) {
this.addMsg.attendanceId = this.$route.query.id;
this.getUpdateList();
}
}
}
import VueAMap from 'vue-amap'
let amapManager = new VueAMap.AMapManager();
export default {
data() {
return {
fwStartTime: '',
fwEndTime: '',
fwStartTime1: '',
fwEndTime1: '',
fwdateArr: [],
fwdateArr1: [],
picked: 'one',
picked1: 'one',
searchOption: {},
markers: [],
center: [104.090588, 30.643365],
pickerOptions: {
disabledDate(time) {
return time.getTime() < Date.now() - 8.64e7;
}
},
zoom: 12,
amapManager,
events: {},
searchData: [],
lnglatXY: [],
addMapStyle: false,
outerVisible: false,
innerVisible: false,
isRight: true,
dialogTitle: '',
specialDatesIsShow: true,
wdListArr: [],
signInDates: [],
newSignIn: {
'Date': '',
'BeOnDutyTime': '',
'OffDutyTime': ''
},
signOutDates: [],
newSignOut: {
'Date': ''
},
awWifiListDates: [],
newAwWiFi: {
'Name': '',
'TargetAddress': ''
},
awListData: [],
newAwlist: {
'Name': '',
'Address': '',
'TargetAddress': '',
'Scope': ''
},
SpecialDates: [],
signDateType: 0,
saveBtnType: 1,
isRepetition: false,
awListDates: [],
addressRange: '300',
listArr: [{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周一",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周二",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周三",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周四",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周五",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周六",
"BeOnDutyTime": "",
"OffDutyTime": ""
},
{
'AttendanceId': '0',
"Id": '0',
'IsCheck': false,
"Workday": "周日",
"BeOnDutyTime": "",
"OffDutyTime": ""
}
],
//请求数据
addMsg: {
attendanceId: '-1',
RB_BranchId: '0',
Status: '0',
wdList: [], //[{'Workday'：周一,'BeOnDutyTime':'09:30:00','OffDutyTime':'09:30:00'}，{}，{}]
tdList: [], //特殊打卡 [{'Date':'2018-04-15',BeOnDutyTime':'09:30:00','OffDutyTime':'09:30:00'},{}]
NottdList: [], //[{Date:'2018-04-15'}] //特殊不打卡
awList: [], //Name，Address，TargetAddress，Scope awList：[{'Name'：'xxx',Address:'xxx',TargetAddress:'xxx',Scope：'xxx'},{}]
awWifiList: [] //awWifiList:[{'Name':'xxxx',TargetAddress:'12.51.42.32'}]
},
}
},
methods: {
getDateArr() {
if (this.fwStartTime != '' && this.fwEndTime != '') {
this.apipost('User_get_AttendanceGetTimeSpanValue', {
StartTime: this.fwStartTime,
EndTime: this.fwEndTime
}, res => {
this.fwdateArr = res.data.data
}, err => {})
}
},
getDateArr1() {
if (this.fwStartTime1 != '' && this.fwEndTime1 != '') {
this.apipost('User_get_AttendanceGetTimeSpanValue', {
StartTime: this.fwStartTime1,
EndTime: this.fwEndTime1
}, res => {
this.fwdateArr1 = res.data.data
}, err => {})
}
},
onSearchResult(pois) {
let latSum = 0;
let lngSum = 0;
this.markers.length = 0
if (pois.length > 0) {
pois.forEach(poi => {
let {
lng,
lat
} = poi;
lngSum += lng;
latSum += lat;
let markerItem = {
position: [poi.lng, poi.lat],
radius: 20,
fillOpacity: 1,
fillColor: 'rgba(0,0,255,1)',
events: {
click: (e) => {
this.newAwlist.Name = e.target.Uh.events.name;
this.newAwlist.Address = e.target.Uh.events.address;
this.newAwlist.TargetAddress = e.lnglat.lat + ',' + e.lnglat.lng;
},
address: poi.address,
name: poi.name,
},
}
this.markers.push(markerItem);
});
let center = {
lng: lngSum / pois.length,
lat: latSum / pois.length
};
this.center = [center.lng, center.lat];
}
},
activateOrDisabled(index) {
if (this.listArr[index].IsCheck == false) {
this.listArr[index].BeOnDutyTime = '';
this.listArr[index].OffDutyTime = '';
}
},
copyPrev(index) {
if (this.listArr[index].IsCheck == true) {
this.listArr[index].BeOnDutyTime = this.listArr[index - 1].BeOnDutyTime;
this.listArr[index].OffDutyTime = this.listArr[index - 1].OffDutyTime;
}
},
addSignIn() {
this.saveBtnType = 1;
this.dialogTitle = '添加必须打卡日期';
this.newSignIn = {
'Date': '',
'BeOnDutyTime': '',
'OffDutyTime': ''
};
this.outerVisible = true;
this.signDateType = 1;
},
updateSignIn(index) {
this.dialogTitle = '修改必须打卡日期';
this.outerVisible = true;
this.signDateType = 1;
this.saveBtnType = 2;
this.newSignIn.Date = this.signInDates[index].Date;
this.newSignIn.BeOnDutyTime = this.signInDates[index].BeOnDutyTime;
this.newSignIn.OffDutyTime = this.signInDates[index].OffDutyTime;
},
deleteSignIn(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.signInDates.splice(index, 1)
this.getSpecialDates()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
saveSignIn() {
if (this.picked == 'one') { // 单天设置
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if (this.newSignIn.Date == item) {
this.isRepetition = true;
}
})
if (this.newSignIn.Date != '' && this.newSignIn.BeOnDutyTime != '' && this.newSignIn.OffDutyTime != '') {
if (!this.isRepetition) {
this.signInDates.unshift(this.newSignIn);
this.newSignIn = {
'Date': '',
'BeOnDutyTime': '',
'OffDutyTime': ''
};
this.getSpecialDates()
this.outerVisible = false;
this.$message.success('添加成功！');
} else {
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
}
} else {
this.$message.warning('请填写完整信息！')
}
}
if (this.picked == 'two') { //范围设置
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if (this.fwdateArr.findIndex(x => x == item) != -1) {
this.isRepetition = true; //存在重复
}
})
if (this.isRepetition) {
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
} else {
this.fwdateArr.forEach(item => {
this.signInDates.push({
'Date': item,
'BeOnDutyTime': this.newSignIn.BeOnDutyTime,
'OffDutyTime': this.newSignIn.OffDutyTime
})
this.getSpecialDates()
this.outerVisible = false;
this.$message.success('添加成功！');
this.fwStartTime = ''
this.fwEndTime = ''
})
}
}
},
addSignOut() {
this.newSignOut.Date = '',
this.signDateType = 2;
this.dialogTitle = '添加不用打卡日期';
this.saveBtnType = 3;
this.outerVisible = true;
},
saveSignOut() {
if (this.picked1 == 'one') { // 单天设置
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if (this.newSignOut.Date == item) {
this.isRepetition = true;
}
})
if (!this.isRepetition) {
this.signOutDates.unshift(this.newSignOut);
this.newSignOut = {
'Date': ''
};
this.getSpecialDates()
this.outerVisible = false;
this.$message.success('添加成功!');
} else {
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
}
}
if (this.picked1 == 'two') {
this.isRepetition = false;
this.SpecialDates.forEach(item => {
if (this.fwdateArr1.findIndex(x => x == item) != -1) {
this.isRepetition = true; //存在重复
}
})
if (this.isRepetition) {
this.$message.warning('必须打卡日期或不用打卡日期存在重复！')
} else {
this.fwdateArr1.forEach(item => {
this.signOutDates.push({
'Date': item
})
this.getSpecialDates()
this.outerVisible = false;
this.$message.success('添加成功！');
this.fwStartTime1 = ''
this.fwEndTime1 = ''
})
}
}
},
deleteSignOut(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.signOutDates.splice(index, 1)
this.getSpecialDates()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
getSpecialDates() { //特殊天数集合
this.SpecialDates = []
this.signInDates.forEach(item => {
if (item.Date && item.Date != '')
this.SpecialDates.push(item.Date)
})
this.signOutDates.forEach(item => {
if (item.Date && item.Date != '')
this.SpecialDates.push(item.Date)
})
},
addAddress() {
document.getElementsByClassName("att_addDates")[0].style.width = '800px';
this.searchData = null;
this.newAwlist.Name = '';
this.newAwlist.Address = '';
this.newAwlist.TargetAddress = '';
this.saveBtnType = 5;
this.dialogTitle = '添加办公地点';
this.outerVisible = true;
this.signDateType = 3;
},
saveAddress() {
this.newAwlist.Scope = this.addressRange;
if (this.newAwlist.Name != '' && this.newAwlist.Address != '' && this.newAwlist.TargetAddress != '') {
this.awListData.unshift(this.newAwlist);
this.newAwlist = {
'Name': '',
'Address': '',
'TargetAddress': '',
'Scope': ''
};
this.outerVisible = false;
this.$alert('添加成功！', '提示');
} else {
this.$alert('请填写完整信息！', '提示')
}
},
deleteAddress(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.awListData.splice(index, 1)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
setAddressRange() {
this.awListData.forEach(item => {
item.Scope = this.addressRange
})
},
addWifi() {
this.dialogTitle = '添加WIFI';
this.outerVisible = true;
this.signDateType = 4;
this.saveBtnType = 4;
},
saveWifi() {
if (this.newAwWiFi.Name != '' && this.newAwWiFi.TargetAddress != '') {
this.awWifiListDates.unshift(this.newAwWiFi);
this.newAwWiFi = {
'Name': '',
'TargetAddress': ''
};
} else {
this.$alert('请填写完整信息！', '提示')
}
},
deleteWifi(index) {
this.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.awWifiListDates.splice(index, 1)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
cancel() {
document.getElementsByClassName("att_addDates")[0].style.width = '500px';
this.outerVisible = false;
},
addAttendance() {
this.wdListArr = []
this.listArr.forEach(item => {
if (item.IsCheck == true && item.BeOnDutyTime != '' && item.OffDutyTime != '') {
this.wdListArr.push({
'Workday': item.Workday,
"BeOnDutyTime": item.BeOnDutyTime,
"OffDutyTime": item.OffDutyTime
})
}
})
this.addMsg.wdList = this.wdListArr; //工作日设置
this.addMsg.tdList = this.signInDates; //必须打卡的日期
this.addMsg.NottdList = this.signOutDates; //不用打卡的日期
this.addMsg.awList = this.awListData; //根据地点考勤
this.addMsg.awWifiList = this.awWifiListDates; //根据Wifi考勤
this.apipost('User_post_AttendanceSet', this.addMsg, res => {
if (res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.goBack()
} else {
this.$message.error(res.data.message)
}
}, err => {})
},
getUpdateList() { //获取修改数据
this.apipost('User_get_AttendanceGet', {
attendanceId: this.addMsg.attendanceId
}, res => {
this.listArr = res.data.data.WdList;
this.listArr.forEach((item, index) => {
item.IsCheck = res.data.data.WdList[index].IsCheck == '1' ? true : false
})
this.signInDates = res.data.data.TdList;
this.signInDates.forEach(item => {
item.Date = item.Date.substring(0, 10)
})
this.signOutDates = res.data.data.NottdList;
this.signOutDates.forEach(item => {
item.Date = item.Date.substring(0, 10)
})
this.getSpecialDates();
this.awListData = res.data.data.AwList;
this.awWifiListDates = res.data.data.AwWifiList;
if (res.data.data.AwList.length > 0) {
this.addressRange = res.data.data.AwList[0].Scope.toString();
}
}, err => {})
},
goBack() {
history.back(-1)
},
},
mounted() {
this.addMsg.RB_BranchId = this.$route.query.bId;
if (this.$route.query.id != undefined) {
this.addMsg.attendanceId = this.$route.query.id;
this.getUpdateList();
}
}
}
</script>
<style>
.search-box {
top: 46px;
left: 1px;
}
.amap-page-container {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.att .el-select .el-input.is-disabled .el-input__inner {
height: 34px!important;
}
.att_mapitem {
border-bottom: 1px solid #DCDFE6;
cursor: pointer;
}
.att_mapitem:last-child {
border-bottom: none;
}
.awName {
height: 34px!important;
font-size: 14px!important;
line-height: 34px!important;
}
.awAddress {
height: 34px!important;
}
.att_addDates {
width: 500px;
}
.att_map_input {width: 200px;height: 34px;border-radius: 17px;padding: 0 10px;border: 1px solid #DCDFE6;}
.att_addDates .el-input__inner {
padding-left: 30px!important;
}
.att_addDates .el-input__icon {
line-height: 34px!important;
}
.att_amap {
width: 800px;
height: 300px;
}
.att_search_box {
position: absolute;
top: 25px;
left: 20px;
}
.att_title>span {
color: #999;
font-size: 12px;
padding-left: 15px;
}
.att_title {
height: 14px;
line-height: 14px;
padding-left: 15px;
border-left: 3px solid #E95252;
margin: 30px 0;
}
.att_table {
width: 800px;
border: none;
text-align: center;
font-size: 12px;
margin: 20px 0;
}
.att_table tr {
height: 38px;
text-align: center;
}
.att_table tr th:first-child {
border-radius: 4px 0 0 0;
}
.att_table tr th:last-child {
border-radius: 0 4px 0 0;
}
.att_table tr th {
background: #EAEAEA;
color: #333;
}
.att_table tr td {
background: #fff;
}
.att_table tr td .el-date-editor.el-input {
width: 120px;
height: 28px;
}
.att_table tr td .el-input--prefix .el-input__inner {
padding-left: 30px;
height: 28px;
}
.att_table tr td .el-input--prefix .el-input__icon {
line-height: 28px;
}
.att_special_dates {
font-size: 12px;
color: #666;
text-indent: 30px;
height: 50px;
}
.att_addBtn {
width: 90px;
height: 30px;
border: 1px solid #DCDFE6;
background: #fff;
margin: 20px 0;
border-radius: 15px;
margin-left: 30px;
cursor: pointer;
}
.att_addBtn:hover {
box-shadow: 2px 2px 1px rgba(0, 0, 0, .1)
}
.att_addBtn:active {
background: #f9f9f9;
}
.att_saveDiv {
margin: 30px 0;
}
.att_type_item .el-select .el-input {
width: 120px;
margin-left: 20px;
}
.att_type_item {}
.att_type_item p {
height: 40px;
font-size: 12px;
color: #333;
padding-left: 30px;
}
.att_type_item p>span {
color: #999;
}
</style>
\ No newline at end of file
.search-box {
top: 46px;
left: 1px;
}
.amap-page-container {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.att .el-select .el-input.is-disabled .el-input__inner {
height: 34px !important;
}
.att_mapitem {
border-bottom: 1px solid #DCDFE6;
cursor: pointer;
}
.att_mapitem:last-child {
border-bottom: none;
}
.awName {
height: 34px !important;
font-size: 14px !important;
line-height: 34px !important;
}
.awAddress {
height: 34px !important;
}
.att_addDates {
width: 500px;
}
.att_map_input {
width: 200px;
height: 34px;
border-radius: 17px;
padding: 0 10px;
border: 1px solid #DCDFE6;
}
.att_addDates .el-input__inner {
padding-left: 30px !important;
}
.att_addDates .el-input__icon {
line-height: 34px !important;
}
.att_amap {
width: 800px;
height: 300px;
}
.att_search_box {
position: absolute;
top: 25px;
left: 20px;
}
.att_title>span {
color: #999;
font-size: 12px;
padding-left: 15px;
}
.att_title {
height: 14px;
line-height: 14px;
padding-left: 15px;
border-left: 3px solid #E95252;
margin: 30px 0;
}
.att_table {
width: 800px;
border: none;
text-align: center;
font-size: 12px;
margin: 20px 0;
}
.att_table tr {
height: 38px;
text-align: center;
}
.att_table tr th:first-child {
border-radius: 4px 0 0 0;
}
.att_table tr th:last-child {
border-radius: 0 4px 0 0;
}
.att_table tr th {
background: #EAEAEA;
color: #333;
}
.att_table tr td {
background: #fff;
}
.att_table tr td .el-date-editor.el-input {
width: 120px;
height: 28px;
}
.att_table tr td .el-input--prefix .el-input__inner {
padding-left: 30px;
height: 28px;
}
.att_table tr td .el-input--prefix .el-input__icon {
line-height: 28px;
}
.att_special_dates {
font-size: 12px;
color: #666;
text-indent: 30px;
height: 50px;
}
.att_addBtn {
width: 90px;
height: 30px;
border: 1px solid #DCDFE6;
background: #fff;
margin: 20px 0;
border-radius: 15px;
margin-left: 30px;
cursor: pointer;
}
.att_addBtn:hover {
box-shadow: 2px 2px 1px rgba(0, 0, 0, .1)
}
.att_addBtn:active {
background: #f9f9f9;
}
.att_saveDiv {
margin: 30px 0;
}
.att_type_item .el-select .el-input {
width: 120px;
margin-left: 20px;
}
.att_type_item {}
.att_type_item p {
height: 40px;
font-size: 12px;
color: #333;
padding-left: 30px;
}
.att_type_item p>span {
color: #999;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment