|
|
@@ -0,0 +1,795 @@
|
|
|
+<template>
|
|
|
+ <section>
|
|
|
+ <div class="sidebars" ref="sidebars" style="width: 200px;display: block;background: #fff">
|
|
|
+ <h3><i class="iconfont firerock-iconbaoxiao" style="padding-right: 10px"></i>请假管理</h3>
|
|
|
+ <el-divider ></el-divider>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-menu default-active="1-1" class="el-menu-vertical-demo" @select="staffs" background-color="#ffffff" text-color="#666666" active-text-color="#20A0FF" style="width:100%">
|
|
|
+ <el-submenu index="1">
|
|
|
+ <template slot="title">
|
|
|
+ <i class="iconfont firerock-icontianbao"></i>
|
|
|
+ <span>员工请假填报</span>
|
|
|
+ </template>
|
|
|
+ <el-menu-item index="1-1"><p @click="ssl(0)">请事假</p></el-menu-item>
|
|
|
+ <el-menu-item index="1-2"><p @click="ssl(1)">请病假</p></el-menu-item>
|
|
|
+ <el-menu-item index="1-3"><p @click="ssl(2)">请年假</p></el-menu-item>
|
|
|
+ <el-menu-item index="1-4"><p @click="ssl(3)">请产假</p></el-menu-item>
|
|
|
+ </el-submenu>
|
|
|
+ <el-submenu index="2" v-if="user.role != 0">
|
|
|
+ <template slot="title">
|
|
|
+ <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-submenu>
|
|
|
+ <el-menu-item index="3" @select="bills" @click="bills(false)" v-if="user.role == 0">
|
|
|
+ <i class="iconfont firerock-iconbaoxiaodan"></i>
|
|
|
+ <span slot="title">{{user.role == 0?"我的请假单":"请假单列表"}}</span>
|
|
|
+ </el-menu-item>
|
|
|
+ <el-menu-item index="4">
|
|
|
+ <template slot="title">
|
|
|
+ <i class="iconfont firerock-icontianbao"></i>
|
|
|
+ <span slot="title">请假统计</span>
|
|
|
+ </template>
|
|
|
+ </el-menu-item>
|
|
|
+ </el-menu>
|
|
|
+ </el-col>
|
|
|
+ </div>
|
|
|
+ <!-- 侧边栏点击事件 -->
|
|
|
+ <!-- <div class="side" @click="side" ref="sid" style="left: 430px">
|
|
|
+ <div class="spans" ref="side" style="left: -19px;"><i ref="sideI" class="el-icon-arrow-left"></i></div>
|
|
|
+ </div> -->
|
|
|
+ <!-- 内容主体区域 -->
|
|
|
+ <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>
|
|
|
+ </div>
|
|
|
+ <!-- 上面部分 -->
|
|
|
+ <div v-if="!displayTable && apk == false" class="tops">
|
|
|
+ <!-- 公共 -->
|
|
|
+ <div class="ctons">
|
|
|
+ <!-- 表单 -->
|
|
|
+ <el-form ref="addForm" :model="addForm" label-width="80px" :rules="addFormRules">
|
|
|
+ <!-- 请假人 -->
|
|
|
+ <el-form-item label="请假人" prop="ownerId" >
|
|
|
+ <!--普通员工只能自己填报自己的 -->
|
|
|
+ <el-select v-model="addForm.ownerId" @change="selts()" placeholder="请选择请假人" style="width: 150px" :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>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- 电话 -->
|
|
|
+ <el-form-item label="电话" prop="tel">
|
|
|
+ <el-input v-model="addForm.tel" style="width: 250px" placeholder="请输入手机号"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- 单选 -->
|
|
|
+ <el-form-item>
|
|
|
+ <el-radio-group v-model="addForm.timeType" @change="chanRadio()">
|
|
|
+ <el-radio label="0">按天请假</el-radio>
|
|
|
+ <el-radio label="1">按小时请假</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </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>
|
|
|
+ <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-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">
|
|
|
+ <!-- {{flg ? addForm.timeDays : addForm.timeHours}}{{flg ? '天' : '小时'}} -->
|
|
|
+ <div v-if="flg">{{addForm.timeDays}} 天</div>
|
|
|
+ <div v-else>
|
|
|
+ <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>小时
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- 备注 -->
|
|
|
+ <el-form-item label="备注" style="width: 100%">
|
|
|
+ <el-input type="textarea" v-model="addForm.remark" :rows="5" style="width: 50%"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 下面部分 -->
|
|
|
+ <div v-if="displayTable && apk == false" class="tops">
|
|
|
+ <!-- 公共 -->
|
|
|
+ <div class="ctons">
|
|
|
+ <el-table v-loading="loading" :data="tableData" style="width: 100%" height="100%">
|
|
|
+ <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">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div v-if="scope.row.leaveType == 0">事假</div>
|
|
|
+ <div v-if="scope.row.leaveType == 1">病假</div>
|
|
|
+ <div v-if="scope.row.leaveType == 2">年假</div>
|
|
|
+ <div v-if="scope.row.leaveType == 3">产假</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="startDate" label="请假开始时间" width="180"></el-table-column>
|
|
|
+ <el-table-column prop="endDate" label="请假结束时间" width="180"></el-table-column>
|
|
|
+ <el-table-column label="请假天数" width="120">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{scope.row.timeDays}}天</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="请假时长" width="120">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{scope.row.timeHours}}小时</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="status" label="状态" width="100">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div v-if="scope.row.status == 0 || scope.row.status == 1 || scope.row.status == 2 || scope.row.status == 3 || scope.row.status == 4">
|
|
|
+ <div v-if="scope.row.status == 0" >核审通过</div>
|
|
|
+ <div v-if="scope.row.status == 1" style="color: orange">待核审</div>
|
|
|
+ <div v-if="scope.row.status == 2" style="color: red">驳回</div>
|
|
|
+ <div v-if="scope.row.status == 3" style="color: #666666">撤销</div>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <span>暂无请假单</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="remark" label="备注" width="200">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <!-- <div class="apls">{{scope.row.remark}}</div> -->
|
|
|
+ <el-popover placement="top-start" title="标题" width="200" trigger="hover" :content="scope.row.remark">
|
|
|
+ <div slot="reference" class="apls">{{scope.row.remark}}</div>
|
|
|
+ </el-popover>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="180" fixed="right" v-if="isAuditList">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div v-if="user.role != 0">
|
|
|
+ <el-button type="primary" size="mini" @click.stop.native="approve(scope.row)">通过</el-button>
|
|
|
+ <el-button type="danger" size="mini" @click.stop.native="deny(scope.row)">驳回</el-button>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <el-button type="danger" size="mini">撤销</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="poss">
|
|
|
+ <el-pagination
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage4"
|
|
|
+ :page-sizes="[20, 50, 100, 200]"
|
|
|
+ :page-size="20"
|
|
|
+ layout="total, sizes, prev, pager, next"
|
|
|
+ :total="total">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 统计部分 -->
|
|
|
+ <div v-if="displayTable && apk" class="tops">
|
|
|
+ <!-- 公共 -->
|
|
|
+ <div class="ctons">
|
|
|
+ <div style="display: flex;align-items: center;">
|
|
|
+ <div style="display: inline-block;width: 350px">
|
|
|
+ <el-input style="float:left;" v-model="keyword" class="input-with-select" placeholder="请输入人员搜索" clearable="true">
|
|
|
+ <el-button slot="append" @click="statistical" icon="el-icon-search"></el-button>
|
|
|
+ </el-input>
|
|
|
+ </div>
|
|
|
+ <div style="display: inline-block;width: 340px">
|
|
|
+ <span style="display: inline-block;margin: 0 15px 0 20px">开始日期</span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="statData"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择日期" >
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
+ <div style="display: inline-block;width: 350px">
|
|
|
+ <span style="display: inline-block;margin: 0 15px 0 0">结束日期</span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="endData"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 30px">
|
|
|
+ <el-table v-loading="loading" :data="statisticalList" height="100%" style="width: 100%">
|
|
|
+ <el-table-column prop="ownerName" label="姓名" width="300">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div v-if="scope.row.ownerName">
|
|
|
+ {{scope.row.ownerName}}
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <span>暂无请假统计</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="timeDays" label="请假总天数" width="300">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{scope.row.timeDays}}/天
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="timeHours" label="请假总时长">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{scope.row.timeHours}}/小时
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </section>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: "expense",
|
|
|
+ components: {},
|
|
|
+ props: {},
|
|
|
+ data() {
|
|
|
+ //验证手机号
|
|
|
+ var checkTel = (rule, value, callback) =>{
|
|
|
+ if (!value) {
|
|
|
+ return callback(new Error('手机号不能为空'));
|
|
|
+ } else {
|
|
|
+ const reg = /^1[3|4|5|7|8][0-9]\d{8}$/
|
|
|
+ if (reg.test(value)) {
|
|
|
+ callback();
|
|
|
+ } else {
|
|
|
+ return callback(new Error('请输入正确的手机号'));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+ return {
|
|
|
+ addFormRules: {
|
|
|
+ ownerId: [{ required: true, message: "请选择报销人", trigger: "blur" }],
|
|
|
+ tel: [{required: true, validator: checkTel, trigger: 'blur'}]
|
|
|
+ },
|
|
|
+ user: JSON.parse(sessionStorage.getItem("user")),
|
|
|
+ shuz: ['事假填报', '病假填报', '年假填报', '产假填报'],
|
|
|
+ ins: 0,
|
|
|
+ addForm: {
|
|
|
+ timeType: '0',
|
|
|
+ startDate: this.getCurrentTime(),
|
|
|
+ endDate: this.getCurrentTime(),
|
|
|
+ timeDays: 1,
|
|
|
+ leaveType: 0,
|
|
|
+ // indate: this.getCurrentTime(),
|
|
|
+ timeHours: '8'
|
|
|
+ },
|
|
|
+ displayTable: false,
|
|
|
+ users: [], // 人员信息
|
|
|
+ flg: true,
|
|
|
+ createDate: '2020-01-01',
|
|
|
+ pickerOptionsStart: {
|
|
|
+ disabledDate: (time) => {
|
|
|
+ if (this.addForm.endDate) {
|
|
|
+ return time.getTime() > new Date(this.addForm.endDate).getTime() || time.getTime() <= new Date(this.createDate).getTime() - 86400000;
|
|
|
+ }
|
|
|
+ return time.getTime() <= new Date(this.createDate).getTime() - 86400000;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ pickerOptionsEnd: {
|
|
|
+ disabledDate: (time) => {
|
|
|
+ if (this.addForm.startDate) {
|
|
|
+ return time.getTime() < new Date(this.addForm.startDate).getTime();
|
|
|
+ }
|
|
|
+ return time.getTime() <= new Date(this.createDate).getTime() - 86400000;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ options: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'],
|
|
|
+ tableData: [],
|
|
|
+ page: 1,
|
|
|
+ size: 20,
|
|
|
+ isAuditList: '',
|
|
|
+ total:0,
|
|
|
+ apk: false,
|
|
|
+ keyword: '',
|
|
|
+ statData: this.getCurrentTime(),
|
|
|
+ endData: this.getCurrentTime(),
|
|
|
+ statisticalList: [],
|
|
|
+ loading: false
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ watch: {},
|
|
|
+ created() {},
|
|
|
+
|
|
|
+ mounted() {
|
|
|
+ this.getUsers() // 获取人员信息
|
|
|
+ },
|
|
|
+ filters: {},
|
|
|
+ methods: {
|
|
|
+ approve(item) {
|
|
|
+ //审核通过
|
|
|
+ this.http.post('/leave-sheet/approve', {id:item.id
|
|
|
+ },
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.bills(true);
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ deny(item) {
|
|
|
+ //审核驳回
|
|
|
+ this.http.post('/leave-sheet/deny', {id:item.id
|
|
|
+ },
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.bills(true);
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getUsers() {
|
|
|
+ this.http.post(this.port.manage.list, {
|
|
|
+ departmentId: -1,
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 99999
|
|
|
+ },
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.users = res.data.records;
|
|
|
+ if (this.user.role == 0) {
|
|
|
+ this.addForm.ownerId = this.user.id;
|
|
|
+ this.addForm.status = 1;
|
|
|
+ this.addForm.tel = this.user.phone
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 员工请假填报点击事件
|
|
|
+ ssl(index) {
|
|
|
+ this.ins = index;
|
|
|
+ this.addForm.leaveType = index
|
|
|
+ },
|
|
|
+ staffs(key, keyPath) {
|
|
|
+ if (keyPath[0] == '1') {
|
|
|
+ this.displayTable = false;
|
|
|
+ this.apk = false
|
|
|
+ } else if(keyPath[0] == '2') {
|
|
|
+ this.displayTable = true;
|
|
|
+ this.apk = false
|
|
|
+ } else {
|
|
|
+ this.displayTable = true;
|
|
|
+ this.apk = true
|
|
|
+ this.statistical()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ bills(audit){
|
|
|
+ this.tableData = []
|
|
|
+ this.displayTable = true;
|
|
|
+ this.isAuditList = audit;
|
|
|
+ this.loading = true
|
|
|
+ var param = {pageIndex: this.page,
|
|
|
+ pageSize: this.size,
|
|
|
+ code: '',
|
|
|
+ createDate: '',
|
|
|
+ ownerId:'',
|
|
|
+ type:'',
|
|
|
+ };
|
|
|
+ if (this.isAuditList) {
|
|
|
+ param.status = 1;
|
|
|
+ }
|
|
|
+ this.list = [];
|
|
|
+ // this.total = 0;
|
|
|
+ this.http.post('/leave-sheet/list', param,
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.tableData = res.data.records
|
|
|
+ this.total = res.data.total
|
|
|
+ this.loading = false
|
|
|
+ } else {
|
|
|
+ this.loading = false
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error => {
|
|
|
+ this.loading = false
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ submits(){
|
|
|
+ this.$refs.addForm.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.http.post('/leave-sheet/add', this.addForm,
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.$message({
|
|
|
+ message: '填报成功',
|
|
|
+ type: "success"
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ 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
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ chanRadio() {
|
|
|
+ console.log(1234)
|
|
|
+ console.log(this.addForm.timeType)
|
|
|
+ if(this.addForm.timeType == '0') {
|
|
|
+ this.flg = true
|
|
|
+ this.addForm.startDate = this.getCurrentTime()
|
|
|
+ this.addForm.endDate = this.getCurrentTime()
|
|
|
+ this.addForm.timeType = '0'
|
|
|
+ this.addForm.timeDays = '1'
|
|
|
+ this.addForm.timeHours = '8'
|
|
|
+ } else {
|
|
|
+ this.flg = false
|
|
|
+ this.addForm.startDate = this.getCurrentTime()
|
|
|
+ this.addForm.endDate = this.getCurrentTime()
|
|
|
+ this.addForm.timeType = '1'
|
|
|
+ this.addForm.timeHours = '1'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 计算日期
|
|
|
+ datas() {
|
|
|
+ this.addForm.timeDays = this.DateDiff(this.addForm.startDate, this.addForm.endDate)
|
|
|
+ this.addForm.timeHours = this.addForm.timeDays * 8
|
|
|
+ },
|
|
|
+ datasss() {
|
|
|
+ console.log(123)
|
|
|
+ this.addForm.endDate = this.addForm.startDate
|
|
|
+ },
|
|
|
+ DateDiff(sDate1, sDate2){
|
|
|
+ var aDate, oDate1, oDate2, iDays
|
|
|
+ aDate = sDate1.split("-")
|
|
|
+ oDate1 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0])
|
|
|
+ aDate = sDate2.split("-")
|
|
|
+ oDate2 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0])
|
|
|
+ iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 /24)
|
|
|
+ return iDays + 1
|
|
|
+ },
|
|
|
+ // 时间
|
|
|
+ getTadeTime() {
|
|
|
+ var time = new Date();
|
|
|
+ return time.getHours() +':00:00'
|
|
|
+ },
|
|
|
+ // 日期
|
|
|
+ getCurrentTime() {
|
|
|
+ var _this = this;
|
|
|
+ let yy = new Date().getFullYear();
|
|
|
+ let mm = new Date().getMonth()+1;
|
|
|
+ let dd = new Date().getDate();
|
|
|
+ _this.gettime = yy+'-'+mm+'-'+dd;
|
|
|
+ return _this.gettime
|
|
|
+ },
|
|
|
+ chanSele() {
|
|
|
+ this.addForm.timeHours = parseInt(this.addForm.timeHours)
|
|
|
+ },
|
|
|
+ handleSizeChange(val){
|
|
|
+ this.size = val;
|
|
|
+ this.bills()
|
|
|
+ },
|
|
|
+ handleCurrentChange(val){
|
|
|
+ console.log(val, 1, '1')
|
|
|
+ this.page = val;
|
|
|
+ this.bills()
|
|
|
+ },
|
|
|
+ statistical() {
|
|
|
+ this.loading = true
|
|
|
+ this.http.post('/leave-sheet/summaryData', {
|
|
|
+ keyword: this.keyword,
|
|
|
+ startDate: this.statData,
|
|
|
+ endDate: this.endData
|
|
|
+ },
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.statisticalList = res.data
|
|
|
+ this.loading = false
|
|
|
+ } else {
|
|
|
+ this.loading = false
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+.apls {
|
|
|
+ width: 200px;
|
|
|
+ white-space:nowrap;
|
|
|
+ overflow:hidden;
|
|
|
+ text-overflow:ellipsis;
|
|
|
+}
|
|
|
+.tups {
|
|
|
+ width: 100%;
|
|
|
+ height: 25px;
|
|
|
+ position: relative;
|
|
|
+ z-index: 99;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.tups img {
|
|
|
+ height: 25px !important;
|
|
|
+ position: relative;
|
|
|
+ z-index: 99;
|
|
|
+}
|
|
|
+.viewer-canvas {
|
|
|
+ position: absolute;
|
|
|
+ z-index: 9 !important;
|
|
|
+}
|
|
|
+.icl {
|
|
|
+ margin-top: -25px !important;
|
|
|
+}
|
|
|
+/* 费用报销标题 */
|
|
|
+.headine {
|
|
|
+ width: 100%;
|
|
|
+ height: 46.4px;
|
|
|
+ line-height: 46.4px;
|
|
|
+ background: #fff;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.headine h3 {
|
|
|
+ margin: 0;
|
|
|
+ display: inline-block;
|
|
|
+ box-sizing: border-box;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+.headine p {
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+/* /费用报销标题 */
|
|
|
+.sidebars {
|
|
|
+ height: 100%;
|
|
|
+ position: absolute;
|
|
|
+ border-right: 1px solid #E6E6E6;
|
|
|
+ z-index: 2;
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+.sidebars h3 {
|
|
|
+ margin: 0;
|
|
|
+ line-height: 45px;
|
|
|
+ background: #ffffff;
|
|
|
+ font-weight: normal;
|
|
|
+ color: #666;
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+.sidebars .el-col-12 {
|
|
|
+ width: 100%
|
|
|
+}
|
|
|
+
|
|
|
+.public {
|
|
|
+ height: 230px;
|
|
|
+ border-bottom: 1px solid #ddd;
|
|
|
+}
|
|
|
+.public .el-form-item {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.pu_button {
|
|
|
+ text-align: right;
|
|
|
+ width: 100%;
|
|
|
+ padding: 24px 30px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.pu_bu_x .pu_bu_t {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.pu_bu_x {
|
|
|
+ margin-right: 20px;
|
|
|
+ color: #20A0F7;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.pu_bu_t {
|
|
|
+ color: #20A0F7;
|
|
|
+ cursor: pointer;
|
|
|
+ display: block;
|
|
|
+ float: right;
|
|
|
+ position:
|
|
|
+ relative;
|
|
|
+ top: -20px;
|
|
|
+ right: 63px;
|
|
|
+}
|
|
|
+.pu_table {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+.pu_bu_t:hover {
|
|
|
+ color: #7bbcff;
|
|
|
+}
|
|
|
+.pu_bu_x:hover {
|
|
|
+ color: #7bbcff;
|
|
|
+}
|
|
|
+
|
|
|
+/* 我的单据报销凭证 */
|
|
|
+.staff{
|
|
|
+ border-left: 1px solid #fff;
|
|
|
+ border-top: 1px solid #fff;
|
|
|
+ border-right: 1px solid #fff;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+/* */
|
|
|
+.sdat{
|
|
|
+ display: inline-block;
|
|
|
+ width: 260px;
|
|
|
+ margin-left: 13px;
|
|
|
+}
|
|
|
+.messages .el-form-item{
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.messages .el-date-editor.el-input, .el-date-editor.el-input__inner{
|
|
|
+ width: 190px;
|
|
|
+}
|
|
|
+
|
|
|
+/* 我的报销单据 */
|
|
|
+.search {
|
|
|
+ position: relative;
|
|
|
+ top: 20px;
|
|
|
+ left: 20px;
|
|
|
+}
|
|
|
+.tables {
|
|
|
+ margin-top: 50px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+.informant .el-form-item {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+/* 侧边栏收索 */
|
|
|
+.side {
|
|
|
+ position: absolute;
|
|
|
+ z-index: 2;
|
|
|
+ border-right: 2px solid #DDDDDD;
|
|
|
+ height: 100%;
|
|
|
+ top: 0;
|
|
|
+ width: 0;
|
|
|
+}
|
|
|
+.side .spans {
|
|
|
+ width: 20px;
|
|
|
+ height: 30px;
|
|
|
+ border: 1px solid #DDDDDD;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ margin-top: -50%;
|
|
|
+ text-align: center;
|
|
|
+ z-index: 1;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+.side .spans i{
|
|
|
+ margin-top: 7px;
|
|
|
+ color: #C0BFBF
|
|
|
+}
|
|
|
+.side:hover {
|
|
|
+ border-right: 2px solid #20A0FF;
|
|
|
+}
|
|
|
+.side:hover .spans {
|
|
|
+ border: 1px solid #20A0FF;
|
|
|
+ background: #20A0FF;
|
|
|
+}
|
|
|
+.side:hover .spans i{
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+/* 右边整体页面 */
|
|
|
+.contents {
|
|
|
+ height: 100%;
|
|
|
+ /* padding: 30px; */
|
|
|
+ background: #F7F7F7;
|
|
|
+ /* position: absolute; */
|
|
|
+}
|
|
|
+
|
|
|
+.submits {
|
|
|
+ margin-left: 50%;
|
|
|
+
|
|
|
+}
|
|
|
+.waiting {
|
|
|
+ color:orange;
|
|
|
+}
|
|
|
+.rejected {
|
|
|
+ color:red;
|
|
|
+}
|
|
|
+/* 请假模块 */
|
|
|
+.tops {
|
|
|
+ width: 100%;
|
|
|
+ height:100%;
|
|
|
+ position: absolute;
|
|
|
+ background: #f7f7f7;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 20px 0 0 220px;
|
|
|
+}
|
|
|
+.ctons {
|
|
|
+ width: 86%;
|
|
|
+ height: 92%;
|
|
|
+ background: #fff;
|
|
|
+ padding: 30px 40px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.ctons .el-form-item {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.line {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.poss {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 20px;
|
|
|
+ right: 1%;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+</style>
|
