|
@@ -20,8 +20,8 @@
|
|
|
<i class="iconfont firerock-iconbaoxiaodan"></i>
|
|
|
<span>{{user.role == 0?"我的请假单":"请假单列表"}}</span>
|
|
|
</template>
|
|
|
- <el-menu-item index="2-1" ><p @click="bills(false)" >全部</p></el-menu-item>
|
|
|
- <el-menu-item index="2-2" ><p @click="bills(true)">待核审</p></el-menu-item>
|
|
|
+ <el-menu-item index="2-1" ><p @click="bills(false, 2)" >全部</p></el-menu-item>
|
|
|
+ <el-menu-item index="2-2" ><p @click="bills(true, 1)">待核审</p></el-menu-item>
|
|
|
</el-submenu>
|
|
|
<el-menu-item index="3" @select="bills" @click="bills(false)" v-if="user.role == 0">
|
|
|
<i class="iconfont firerock-iconbaoxiaodan"></i>
|
|
@@ -44,7 +44,7 @@
|
|
|
<div class="contents">
|
|
|
<div v-if="!displayTable" class="headine" ref="headine">
|
|
|
<h3 ref="headHe" style="padding-left: 220px">{{shuz[ins]}}</h3>
|
|
|
- <p style="float: right;margin-right: 25px;"><el-button type="primary" @click="submits('addFormRules')" size="mini">提交</el-button></p>
|
|
|
+ <!-- <p style="float: right;margin-right: 25px;"><el-button type="primary" @click="submits('addFormRules')" size="mini">提交</el-button></p> -->
|
|
|
</div>
|
|
|
<!-- 上面部分 -->
|
|
|
<div v-if="!displayTable && apk == false" class="tops">
|
|
@@ -53,9 +53,9 @@
|
|
|
<!-- 表单 -->
|
|
|
<el-form ref="addForm" :model="addForm" label-width="80px" :rules="addFormRules">
|
|
|
<!-- 请假人 -->
|
|
|
- <el-form-item label="请假人" prop="ownerId" >
|
|
|
+ <el-form-item label="请假人" prop="ownerId" style="width: 300px">
|
|
|
<!--普通员工只能自己填报自己的 -->
|
|
|
- <el-select v-model="addForm.ownerId" @change="selts()" placeholder="请选择请假人" style="width: 150px" :disabled="user.role == 0" filterable="true">
|
|
|
+ <el-select v-model="addForm.ownerId" @change="selts()" placeholder="请选择请假人" style="width: 240px" :disabled="user.role == 0" filterable="true">
|
|
|
<span v-for="(item, index) in users" :key="index">
|
|
|
<el-option :label="item.name" :value="item.id"></el-option>
|
|
|
</span>
|
|
@@ -63,10 +63,10 @@
|
|
|
</el-form-item>
|
|
|
<!-- 电话 -->
|
|
|
<el-form-item label="电话" prop="tel">
|
|
|
- <el-input v-model="addForm.tel" style="width: 250px" placeholder="请输入手机号"></el-input>
|
|
|
+ <el-input ref="ipts" v-model="addForm.tel" placeholder="请输入手机号" style="width: 250px"></el-input>
|
|
|
</el-form-item>
|
|
|
<!-- 单选 -->
|
|
|
- <el-form-item>
|
|
|
+ <el-form-item style="display: block">
|
|
|
<el-radio-group v-model="addForm.timeType" @change="chanRadio()">
|
|
|
<el-radio label="0">按天请假</el-radio>
|
|
|
<el-radio label="1">按小时请假</el-radio>
|
|
@@ -74,26 +74,28 @@
|
|
|
</el-form-item>
|
|
|
<!-- 时间选择 -->
|
|
|
<el-form-item :label="flg ? '选择日期' : '选择时间'" style="width: 60%;margin-right:500px">
|
|
|
- <el-col :span="11">
|
|
|
- <el-date-picker v-if="flg" type="date" placeholder="开始日期" value-format="yyyy-MM-dd" :picker-options="pickerOptionsStart" v-model="addForm.startDate" style="width: 100%;" @blur="datas()"></el-date-picker>
|
|
|
- <el-date-picker v-else type="date" placeholder="开始日期" value-format="yyyy-MM-dd" v-model="addForm.startDate" style="width: 100%;" @change="datasss()"></el-date-picker>
|
|
|
+ <el-col :span="9">
|
|
|
+ <el-date-picker v-if="flg" type="date" placeholder="开始日期" value-format="yyyy-MM-dd" :picker-options="pickerOptionsStart" v-model="addForm.startDate" style="width: 240px;" @blur="datas()"></el-date-picker>
|
|
|
+ <el-date-picker v-else type="date" placeholder="开始日期" value-format="yyyy-MM-dd" v-model="addForm.startDate" style="width: 240px;" @change="datasss()"></el-date-picker>
|
|
|
</el-col>
|
|
|
- <el-col class="line" :span="2">-</el-col>
|
|
|
- <el-col :span="11">
|
|
|
- <el-date-picker v-if="flg" type="date" placeholder="结束日期" value-format="yyyy-MM-dd" :picker-options="pickerOptionsEnd" v-model="addForm.endDate" style="width: 100%;" @blur="datas()"></el-date-picker>
|
|
|
+ <el-col class="line" v-if="flg" :span="2">-</el-col>
|
|
|
+ <el-col :span="9">
|
|
|
+ <el-date-picker v-if="flg" type="date" placeholder="结束日期" value-format="yyyy-MM-dd" :picker-options="pickerOptionsEnd" v-model="addForm.endDate" style="width: 250px;" @blur="datas()"></el-date-picker>
|
|
|
<!-- <el-select v-else v-model="addForm.timeHours" placeholder="请假时长" @change="chanSele()">
|
|
|
<el-option v-for="(item, index) in options" :key="index" :label="item" :value="item"></el-option>
|
|
|
</el-select> -->
|
|
|
</el-col>
|
|
|
</el-form-item>
|
|
|
<!-- 请假天数 -->
|
|
|
- <el-form-item :label="flg ? '请假天数' : '请假时长'" style="margin-right: 500px">
|
|
|
+ <el-form-item :label="flg ? '请假天数' : '请假时长'" prop="timeDays" style="margin-right: 500px">
|
|
|
<!-- {{flg ? addForm.timeDays : addForm.timeHours}}{{flg ? '天' : '小时'}} -->
|
|
|
- <div v-if="flg">{{addForm.timeDays}} 天</div>
|
|
|
+ <!-- <div v-if="flg">{{addForm.timeDays}} 天</div> -->
|
|
|
+ <div v-if="flg"> <el-input v-model="addForm.timeDays" @blur="inputs()" @input="addForm.timeDays=addForm.timeDays.replace(/[^\d.]/g,'')" style="width: 100px; margin-right: 20px;"></el-input> 天</div>
|
|
|
<div v-else>
|
|
|
- <el-select v-model="addForm.timeHours" placeholder="请假时长" @change="chanSele()">
|
|
|
+ <!-- <el-select v-model="addForm.timeHours" placeholder="请假时长" @change="chanSele()">
|
|
|
<el-option v-for="(item, index) in options" :key="index" :label="item" :value="item"></el-option>
|
|
|
- </el-select>小时
|
|
|
+ </el-select>小时 -->
|
|
|
+ <el-input v-model="addForm.timeHours" @blur="inputss()" @input="addForm.timeDays=addForm.timeDays.replace(/[^\d.]/g,'')" style="width: 100px; margin-right: 20px;"></el-input> 小时
|
|
|
</div>
|
|
|
</el-form-item>
|
|
|
<!-- 备注 -->
|
|
@@ -101,6 +103,10 @@
|
|
|
<el-input type="textarea" v-model="addForm.remark" :rows="5" style="width: 50%"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
+
|
|
|
+ <div>
|
|
|
+ <p style="margin-left: 75px"><el-button type="primary" @click="submits('addFormRules')" size="mini">提交</el-button></p>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -108,7 +114,42 @@
|
|
|
<div v-if="displayTable && apk == false" class="tops">
|
|
|
<!-- 公共 -->
|
|
|
<div class="ctons">
|
|
|
- <el-table v-loading="loading" :data="tableData" style="width: 100%" height="100%">
|
|
|
+ <div class="flex">
|
|
|
+ <div>
|
|
|
+ <el-select v-model="ownerIds" placeholder="请选择请假人" @change="chufas()" style="width: 180px" :disabled="user.role == 0" filterable="true">
|
|
|
+ <span v-for="(item, index) in users" :key="index">
|
|
|
+ <el-option :label="item.name" :value="item.id"></el-option>
|
|
|
+ </span>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>请假类型</span>
|
|
|
+ <el-select v-model="type" placeholder="请选择请假类型" @change="chufas()" style="width: 180px" filterable="true">
|
|
|
+ <span v-for="(item, index) in typess" :key="index">
|
|
|
+ <el-option :label="item.name" :value="item.id"></el-option>
|
|
|
+ </span>
|
|
|
+ </el-select>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>请假状态</span>
|
|
|
+ <el-select v-if="falg == 0" v-model="code" placeholder="请选择请假状态" @change="chufas()" style="width: 180px" :disabled="user.role == 0" filterable="true">
|
|
|
+ <span v-for="(item, index) in statuss" :key="index">
|
|
|
+ <el-option :label="item.name" :value="item.id"></el-option>
|
|
|
+ </span>
|
|
|
+ </el-select>
|
|
|
+ <el-select v-if="falg == 1" disabled v-model="code" placeholder="请选择请假类型" @change="chufas()" style="width: 180px" filterable="true">
|
|
|
+ <span v-for="(item, index) in statuss" :key="index">
|
|
|
+ <el-option :label="item.name" :value="item.id"></el-option>
|
|
|
+ </span>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>请假时间</span>
|
|
|
+ <el-date-picker v-model="createDate" type="date" @change="chufas()" :value-format = "YYYY-MM-DD" placeholder="选择日期"> </el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-table v-loading="loading" :data="tableData" style="width: 100%" height="90%">
|
|
|
<el-table-column prop="ownerName" label="请假人" width="180"></el-table-column>
|
|
|
<el-table-column prop="tel" label="电话" width="180"></el-table-column>
|
|
|
<el-table-column prop="leaveType" label="请假类型" width="180">
|
|
@@ -206,7 +247,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="margin-top: 30px">
|
|
|
- <el-table v-loading="loading" :data="statisticalList" height="100%" style="width: 100%">
|
|
|
+ <el-table v-loading="loading" :data="statisticalList" height="780px" style="width: 100%">
|
|
|
<el-table-column prop="ownerName" label="姓名" width="300">
|
|
|
<template slot-scope="scope">
|
|
|
<div v-if="scope.row.ownerName">
|
|
@@ -237,6 +278,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { config } from 'dingtalk-jsapi';
|
|
|
export default {
|
|
|
name: "expense",
|
|
|
components: {},
|
|
@@ -255,10 +297,22 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
+ var checks = (rule, value, callback) => {
|
|
|
+ if (!value) {
|
|
|
+ return callback(new Error('请假天数不能为空'));
|
|
|
+ } else {
|
|
|
+ if (value > this.timeChoose) {
|
|
|
+ return callback(new Error('不能超过当前选择的日期'));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
return {
|
|
|
addFormRules: {
|
|
|
ownerId: [{ required: true, message: "请选择报销人", trigger: "blur" }],
|
|
|
- tel: [{required: true, validator: checkTel, trigger: 'blur'}]
|
|
|
+ tel: [{required: true, validator: checkTel, trigger: 'blur'}],
|
|
|
+ timeDays: [{required: true, validator: checks, trigger: 'blur'}]
|
|
|
},
|
|
|
user: JSON.parse(sessionStorage.getItem("user")),
|
|
|
shuz: ['事假填报', '病假填报', '年假填报', '产假填报'],
|
|
@@ -270,7 +324,8 @@ export default {
|
|
|
timeDays: 1,
|
|
|
leaveType: 0,
|
|
|
// indate: this.getCurrentTime(),
|
|
|
- timeHours: '8'
|
|
|
+ timeHours: '8',
|
|
|
+ tel: ''
|
|
|
},
|
|
|
displayTable: false,
|
|
|
users: [], // 人员信息
|
|
@@ -300,10 +355,43 @@ export default {
|
|
|
total:0,
|
|
|
apk: false,
|
|
|
keyword: '',
|
|
|
- statData: this.getCurrentTime(),
|
|
|
+ statData: this.getCurrentTimes(),
|
|
|
endData: this.getCurrentTime(),
|
|
|
statisticalList: [],
|
|
|
- loading: false
|
|
|
+ loading: false,
|
|
|
+ timeChoose: 1,
|
|
|
+ typess: [{
|
|
|
+ name: '事假',
|
|
|
+ id: 0
|
|
|
+ },{
|
|
|
+ name: '病假',
|
|
|
+ id: 1
|
|
|
+ },{
|
|
|
+ name: '年假',
|
|
|
+ id: 2
|
|
|
+ },{
|
|
|
+ name: '产假',
|
|
|
+ id: 3
|
|
|
+ }],
|
|
|
+ statuss: [{
|
|
|
+ name: '核审通过',
|
|
|
+ id: 0
|
|
|
+ },{
|
|
|
+ name: '待核审',
|
|
|
+ id: 1
|
|
|
+ },{
|
|
|
+ name: '驳回',
|
|
|
+ id: 2
|
|
|
+ },{
|
|
|
+ name: '已撤销',
|
|
|
+ id: 3
|
|
|
+ }],
|
|
|
+ createDatelis: '',
|
|
|
+ ownerIds: '',
|
|
|
+ type: '',
|
|
|
+ code: '',
|
|
|
+ createDate: '',
|
|
|
+ falg: 0
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
@@ -403,17 +491,34 @@ export default {
|
|
|
this.statistical()
|
|
|
}
|
|
|
},
|
|
|
- bills(audit){
|
|
|
+ bills(audit, tr){
|
|
|
+ if(tr) {
|
|
|
+ this.code = ''
|
|
|
+ this.createDate = ''
|
|
|
+ this.ownerIds = ''
|
|
|
+ this.type = ''
|
|
|
+ if(tr == 1) {
|
|
|
+ this.falg = 1
|
|
|
+ this.code = 1
|
|
|
+ } else if(tr == 2) {
|
|
|
+ this.code = ''
|
|
|
+ this.falg = 0
|
|
|
+ } else {
|
|
|
+ this.falg = 0
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.falg = false
|
|
|
+ }
|
|
|
this.tableData = []
|
|
|
this.displayTable = true;
|
|
|
this.isAuditList = audit;
|
|
|
this.loading = true
|
|
|
var param = {pageIndex: this.page,
|
|
|
pageSize: this.size,
|
|
|
- code: '',
|
|
|
- createDate: '',
|
|
|
- ownerId:'',
|
|
|
- type:'',
|
|
|
+ status: this.code,
|
|
|
+ createDate: this.createDate,
|
|
|
+ ownerId: this.ownerIds,
|
|
|
+ leaveType: this.type,
|
|
|
};
|
|
|
if (this.isAuditList) {
|
|
|
param.status = 1;
|
|
@@ -471,8 +576,6 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
selts() {
|
|
|
- console.log(this.addForm.ownerId)
|
|
|
- console.log(this.users)
|
|
|
for(var i in this.users) {
|
|
|
if(this.users[i].id == this.addForm.ownerId) {
|
|
|
this.addForm.tel = this.users[i].phone
|
|
@@ -499,7 +602,9 @@ export default {
|
|
|
},
|
|
|
// 计算日期
|
|
|
datas() {
|
|
|
- this.addForm.timeDays = this.DateDiff(this.addForm.startDate, this.addForm.endDate)
|
|
|
+ // this.addForm.timeDays = this.DateDiff(this.addForm.startDate, this.addForm.endDate)
|
|
|
+ this.addForm.timeDays = this.countWorkDay(this.addForm.startDate, this.addForm.endDate)
|
|
|
+ this.timeChoose = this.addForm.timeDays
|
|
|
this.addForm.timeHours = this.addForm.timeDays * 8
|
|
|
},
|
|
|
datasss() {
|
|
@@ -515,6 +620,26 @@ export default {
|
|
|
iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 /24)
|
|
|
return iDays + 1
|
|
|
},
|
|
|
+ stringToDate(dateString){
|
|
|
+ dateString = dateString.split('-');
|
|
|
+ return new Date(dateString[0], dateString[1] - 1, dateString[2]);
|
|
|
+ },
|
|
|
+ countWorkDay(date1, date2){
|
|
|
+ date1 = this.stringToDate(date1);
|
|
|
+ date2 = this.stringToDate(date2);
|
|
|
+ var delta = (date2 - date1) / (1000 * 60 * 60 * 24) + 1; // 计算出总时间
|
|
|
+ var weeks = 0;
|
|
|
+ for(var i = 0; i < delta; i++){
|
|
|
+ if(date1.getDay() == 0 || date1.getDay() == 6) weeks ++; // 若为周六或周天则加1
|
|
|
+ date1 = date1.valueOf();
|
|
|
+ date1 += 1000 * 60 * 60 * 24;
|
|
|
+ date1 = new Date(date1);
|
|
|
+ }
|
|
|
+ return delta - weeks;
|
|
|
+ },
|
|
|
+ chufas() {
|
|
|
+ this.bills(true, 0)
|
|
|
+ },
|
|
|
// 时间
|
|
|
getTadeTime() {
|
|
|
var time = new Date();
|
|
@@ -526,7 +651,15 @@ export default {
|
|
|
let yy = new Date().getFullYear();
|
|
|
let mm = new Date().getMonth()+1;
|
|
|
let dd = new Date().getDate();
|
|
|
- _this.gettime = yy+'-'+mm+'-'+dd;
|
|
|
+ _this.gettime = yy +'-'+ mm +'-'+ dd;
|
|
|
+ return _this.gettime
|
|
|
+ },
|
|
|
+ getCurrentTimes() {
|
|
|
+ var _this = this;
|
|
|
+ let yy = new Date().getFullYear();
|
|
|
+ let mm = new Date().getMonth()+1;
|
|
|
+ let dd = new Date().getDate();
|
|
|
+ _this.gettime = yy+'-'+mm+'-'+'01';
|
|
|
return _this.gettime
|
|
|
},
|
|
|
chanSele() {
|
|
@@ -536,7 +669,7 @@ export default {
|
|
|
this.size = val;
|
|
|
this.bills()
|
|
|
},
|
|
|
- handleCurrentChange(val){
|
|
|
+ handleCurrentChange(val) {
|
|
|
console.log(val, 1, '1')
|
|
|
this.page = val;
|
|
|
this.bills()
|
|
@@ -566,7 +699,33 @@ export default {
|
|
|
type: "error"
|
|
|
});
|
|
|
});
|
|
|
- }
|
|
|
+ },
|
|
|
+ //
|
|
|
+ inputs() {
|
|
|
+ var str = this.addForm.timeDays + ''
|
|
|
+ if(str.indexOf('.') != '-1') {
|
|
|
+ var s = str.split('.')[0]
|
|
|
+ var st = str.split('.')[1]
|
|
|
+ var sts = st.split('')
|
|
|
+ this.addForm.timeDays = s + '.' + sts[0]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ inputss() {
|
|
|
+ if(this.addForm.timeHours < 0) {
|
|
|
+ this.addForm.timeHours = 1
|
|
|
+ } else if(this.addForm.timeHours > 8) {
|
|
|
+ this.addForm.timeHours = 8
|
|
|
+ } else {
|
|
|
+ var str = this.addForm.timeHours
|
|
|
+ console.log(str)
|
|
|
+ if(str.indexOf('.') != '-1') {
|
|
|
+ var s = str.split('.')[0]
|
|
|
+ var st = str.split('.')[1]
|
|
|
+ var sts = st.split('')
|
|
|
+ this.addForm.timeHours = s + '.' + sts[0]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
@@ -785,6 +944,7 @@ export default {
|
|
|
}
|
|
|
.line {
|
|
|
text-align: center;
|
|
|
+ margin: 0 6px
|
|
|
}
|
|
|
.poss {
|
|
|
position: fixed;
|
|
@@ -792,4 +952,12 @@ export default {
|
|
|
right: 1%;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
+.flex {
|
|
|
+ display: flex;
|
|
|
+ margin: 0 0 20px 0;
|
|
|
+}
|
|
|
+.flex span {
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 10px 0 20px;
|
|
|
+}
|
|
|
</style>
|