Commit 265fc11a authored by Mac's avatar Mac

审批页面

parent 336962d4
<template>
<div class="flexOne">
<div class="query-box" style="border-bottom: none;">
<ul>
<li>
<span><em>公司</em><el-select filterable @change='getUser' v-model='msg.RB_BranchId'>
<el-option label='不限' value='-1'></el-option>
<el-option v-for='item in companyList' :label='item.BName' :value='item.Id' :key='item.Id'></el-option>
</el-select>
</span>
</li>
<li>
<span><em>申请人</em><el-select filterable v-model='msg.CreateBy'>
<el-option label='不限' value='0'></el-option>
<el-option v-for='item in userList' :label='item.name' :value='item.empId' :key='item.empId'></el-option>
</el-select>
</span>
</li>
<li>
<span><em>待审核人</em><el-select filterable v-model='msg.ToAuditId'>
<el-option label='不限' value='0'></el-option>
<el-option v-for='item in userList' :label='item.name' :value='item.empId' :key='item.empId'></el-option>
</el-select>
</span>
</li>
<li>
<span><em>已审核人</em><el-select filterable v-model='msg.AuditedId'>
<el-option label='不限' value='0'></el-option>
<el-option v-for='item in userList' :label='item.name' :value='item.empId' :key='item.empId'></el-option>
</el-select>
</span>
</li>
<li>
<span><em>请假类型</em><el-select v-model='msg.TemplateId'>
<el-option v-for='item in ApplyTypeList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li>
<span><em>申请审核状态</em><el-select v-model='msg.appAuditStatus'>
<el-option v-for='item in appAuditStatusList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li><span><em>申请时间</em><el-date-picker v-model='msg.StartTime' class='w135' value-format="yyyy-MM-dd" type="date"></el-date-picker>
-
<el-date-picker v-model='msg.EndTime' class='w135' value-format="yyyy-MM-dd" type="date"></el-date-picker>
</span>
</li>
<li>
<input type="button" class="hollowFixedBtn" value="查询" @click="resetPageIndex(),getList()" />
</li>
</ul>
</div>
<div style="width: 100%; overflow: auto;">
<table style="min-width: 1400px;" class="singeRowTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<th>公司</th>
<th>申请人</th>
<th>请假类型</th>
<th width="300">待审核人</th>
<th width="300">已审核人</th>
<th>申请时间</th>
<th>{{$t('admin.admin_status')}}</th>
<th width="150">{{$t('system.table_operation')}}</th>
</tr>
<tr v-for='item in list' v-loading='loading'>
<td>{{item.BName}}</td>
<td>{{item.EmName}}</td>
<td>{{item.TemplateName}}</td>
<td>{{item.ToAuditName}}</td>
<td>{{item.AuditedName}}</td>
<td>{{item.CreateTime}}</td>
<td>{{item.Status}}</td>
<td>
<el-tooltip class="item" effect="dark" content="详情" placement="top">
<el-button type="primary" icon="el-icon-tickets" circle @click="getDetail(item.Id,item.TemplateType)"></el-button>
</el-tooltip>
</td>
</tr>
</table>
</div>
<el-pagination background
@current-change="handleCurrentChange"
:current-page.sync="currentPage"
layout="total,prev, pager, next, jumper"
:page-size=msg.pageSize
:total=total>
</el-pagination>
<el-dialog custom-class='w500' :title="dialogTitle" :visible.sync="outerVisible" center >
<div class="approvalStatisticalDialog">
<div class="title">{{detailList.Proposer}}{{detailList.TempleteTypeName}}</div>
<div class="user">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>{{detailList.Proposer}}</p>
<p><span style="color:#257BF1; font-size: 14px;">{{detailList.Status}}</span></p>
</div>
<div class="detail">
<table border="0" cellspacing="0" cellpadding="0" class="myApprovalTable">
<tr v-for="(item,index) in detailList.Details" v-if="(item.formType=='Image' && item.value.length>0) || item.formType!='Image'">
<td width="80" >{{item.title}}</td>
<td v-if="item.formType=='String'">{{item.value}}</td>
<td v-if="item.formType=='Json'">
<div v-for="(i,index) in item.value" style="border-bottom: 1px solid #ccc; padding:10px 0;">
<p style="line-height: 24px;" v-for="o in i">{{o.title}}{{o.value}}</p>
</div>
</td>
<td v-if="item.formType=='Image'">
<img v-if='item.value.length>0' style="width: 50px; height: 50px; border-radius: 4px; margin:0 10px 0 0;" v-for="(img,index) in item.value" :src="img"
@click="getPic(item.value)"/>
</td>
</tr>
</table>
</div>
<div class="audit">
<div class="auditItem">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>
<span>{{detailList.Proposer}}</span>&nbsp;&nbsp;<span>发起申请</span><span class="fr">{{detailList.ProposerTime}}</span>
</p>
</div>
<div class="auditItem" v-for="(item,index) in detailList.arList">
<img v-if='item.AuditRecordList.length==1&&!item.AuditRecordList[0].AuditEmPhoto' src="../../assets/images/administration/litheader.png" />
<img v-if='item.AuditRecordList.length==1&&item.AuditRecordList[0].AuditEmPhoto' :src='item.AuditRecordList[0].AuditEmPhoto' alt="" :onerror="defaultImg" />
<img v-if='item.AuditRecordList.length>1' src="../../assets/images/administration/bg_z1@2x.png" />
<p v-if='item.AuditRecordList.length==1'>
<span>{{item.AuditRecordList[0].AuditEmName}}</span>
<span :style="'color: ' + item.AuditRecordList[0].StatusColor + ' !important'">{{item.AuditRecordList[0].Stauts}}</span>
<span class="fr">{{item.AuditRecordList[0].AuditTime}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{item.AuditRecordList[0].Description}}</span>
<span v-if="item.AuditRecordList[0].CareOfList!=null" style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{item.AuditRecordList[0].CareOfList[0].BeFrom}} <b style="color: red;"></b> {{item.AuditRecordList[0].CareOfList[0].Target}}
<br/>
{{item.AuditRecordList[0].CareOfList[0].Remarks}}
</span>
</p>
<p v-if='item.AuditRecordList.length>1' style="cursor: pointer;">
<span>{{item.AuditDescription}}{{item.AuditWay}}</span>
<i class="el-icon-arrow-right"></i>
</p>
<div v-if='item.AuditRecordList.length>1' style=" width: 300px; height: auto; margin:15px 0; border-radius: 4px; background: #F0F3FA;">
<p v-if='item.AuditWayStatus==2' style="padding: 10px; color: #666;">须以下人员全部审批通过</p>
<p v-if='item.AuditWayStatus==3' style="padding: 10px; color: #666;">以下人员大于等于一人审批通过即可</p>
<div v-for="i in item.AuditRecordList">
<p class="auditItemDetailtitle">
<img width="28" height="28" v-if="!i.AuditEmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img width="28" height="28" v-else :src="i.AuditEmPhoto" alt="" :onerror="defaultImg">
<span>{{i.AuditEmName}}</span>
<span :style="'color: ' + i.StatusColor + ' !important'">{{i.Stauts}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{i.Description}}</span>
<span v-if='i.CareOfList!=null' style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{i.CareOfList[0].BeFrom}} <b style="color: red;"></b> {{i.CareOfList[0].Target}}
<br/>
{{i.CareOfList[0].Remarks}}
</span>
</p>
<div class="auditItemImgList" v-if="toArr(i.Image).length>0">
<img v-for='img in toArr(i.Image)' :src="img" @click="getPic(toArr(i.Image))"/>
</div>
</div>
</div>
</div>
</div> <!--audit end-->
<div class="send" v-if="detailList.AuditStatus==5"> <!--v-if="detailList.AuditStatus==5"-->
<p class="sentTitle">抄送<span>审批通过后,通知抄送人</span></p>
<div class="sendList">
<div v-for="(item,index) in detailList.CopyToPeopleList">
<img v-if="!item.EmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="item.EmPhoto" alt="" :onerror="defaultImg">
<br/>
{{item.EmName}}
</div>
</div>
</div> <!--send end-->
</div>
<div :class="{viewBigPicLayer:true,viewBigPicLayerDisplayNone:dspNone}" @click="closePicLayer">
<i @click="closePicLayer" class="el-icon-circle-close-outline clolseViewBigPicLayer" ></i>
<el-carousel height="600px" :interval="5000" trigger="click">
<el-carousel-item v-for="(item,index) in picObj" :key="index">
<img :src="item" />
</el-carousel-item>
</el-carousel>
</div>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="outerVisible=false">关闭</button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
picObj:[],
dspNone:true,
loading:true,
outerVisible:false,
dialogTitle:"",
total:0,
currentPage: 1,
defaultImg: 'this.src="' + require('../../assets/images/administration/litheader.png') + '"',
//请求数据
msg:{
RB_BranchId:'-1',
Status:'0',
CreateBy:'0',
ToAuditId:'0',
AuditedId:'0',
TemplateId:0,
pageIndex:1,
pageSize:15,
StartTime:'',
EndTime:'',
},
getCompanyMsg:{
RB_Group_Id:'0',
Status:'0',
},
getUserMsg:{
RB_Branch_id:'-1',
},
//返回数据
list:[],
companyList:[],
userList:[],
ApplyTypeList:[],
appAuditStatusList:[],
detailList:{},
}
},
methods: {
getPic(obj){
this.picObj=obj
this.dspNone=false;
},
closePicLayer(){
this.dspNone=true
},
toArr(val){
let arr=[]
if(val!="[]")
{
val.substring(1,val.length-1).split(',').forEach(item=>{
arr.push(item.substring(1,item.length-1))
});
}
return arr;
},
getDetail(id,type){
this.apipost('app_user_workflow_GetAuditInfo',{WorkFlowId:id,TemplateType:type},res=>{
if(res.data.resultCode == 1) {
this.outerVisible=true;
this.dialogTitle='审批详情'
this.detailList=res.data.data
}
},err=>{})
},
getAppAuditStatus(){
this.apipost('app_user_workflow_get_myinitiate_auditstatus',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.appAuditStatusList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
getApplyType(){ //模板类型
this.apipost('app_user_workflow_get_templatetype',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.ApplyTypeList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
getCompany(){
this.apipost('admin_get_BranchGetList',this.getCompanyMsg,res=>{
if(res.data.resultCode==1){
this.companyList=res.data.data;
}else{}
},err=>{})
},
getUser(){
this.msg.CreateBy='0'
this.msg.ToAuditId='0'
this.msg.AuditedId='0'
this.getUserMsg.RB_Branch_id=this.msg.RB_BranchId;
this.apipost('app_get_company_employee',this.getUserMsg,res=>{
if(res.data.resultCode==1){
this.userList=res.data.data;
}else{}
},err=>{})
},
getList(){
this.loading=true;
this.apipost('WorkFlow_get_GetOAPageList',this.msg,res=>{
if(res.data.resultCode==1){
this.list=res.data.data.pageData;
this.total=res.data.data.count;
this.loading=false
}else{}
},err=>{})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
},
mounted() {
let userInfo=this.getLocalStorage();
this.getUserMsg.RB_Group_id=this.getCompanyMsg.RB_Group_Id=userInfo.RB_Group_id; //集团ID
this.getCompany()
this.getUser()
this.getList()
this.getApplyType()
this.getAppAuditStatus()
}
}
</script>
<style>
@import "../financial/css/cssReset.css";
.approvalStatisticalDialog{width: 400px; background: #fff}
.approvalStatisticalDialog .title{height: 48px; background: #EDEEF0; line-height: 48px; font-size:16px; color: #333; text-indent: 30px;}
.approvalStatisticalDialog .user{width: 340px; margin: 0 30px; border-bottom: 1px solid #E6E6E6; height: 60px; padding: 30px 0; box-sizing: content-box}
.approvalStatisticalDialog .user>p{line-height: 28px;}
.approvalStatisticalDialog .user>img{width:58px; height: 58px; border-radius: 29px; float: left; margin:0 12px 0 0;}
.approvalStatisticalDialog .detail{width: 340px; margin: 0 30px; padding: 25px 0; border-bottom: 1px solid #E6E6E6; min-height: 120px;}
.approvalStatisticalDialog .audit{width: 340px; margin: 30px 30px 0; min-height: 120px; border-bottom: 1px solid #E6E6E6;}
.approvalStatisticalDialog .audit .auditItem{min-height: 80px; width: 320px; margin-left: 20px; border-left:1px solid #EDEDED; position: relative; font-size: 14px;}
.approvalStatisticalDialog .audit .auditItem:last-child{border-left: none;}
.approvalStatisticalDialog .audit .auditItem>p{line-height: 40px;text-indent: 40px;}
.approvalStatisticalDialog .audit .auditItem>img{width: 40px; height: 40px; border-radius: 20px; position: absolute; left: -20px;}
.approvalStatisticalDialog .send{width: 340px; margin: 30px 30px 0; min-height: 120px;}
.approvalStatisticalDialog .send .sentTitle{height: 14px; line-height: 14px; text-indent:10px; border-left:3px solid #E95252; font-size: 14px;}
.approvalStatisticalDialog .send .sentTitle span{color: #666; margin-left: 20px;}
.approvalStatisticalDialog .send .sendList>div{float: left; margin: 10px 10px 0 0; font-size: 12px; color: #666; width: 40px; text-align: center;}
.approvalStatisticalDialog .send .sendList>div>img{width: 40px; height: 40px; border-radius: 20px;}
.approvalStatisticalDialog .myApprovalTable tr{height: 40px; font-size: 14px;}
.approvalStatisticalDialog .myApprovalTable tr td:nth-child(1){text-align: right; color: #666; }
</style>
<template>
<div class="flexOne">
<div class="myApprovalMenu">
<li :class="{cked:liCkedIndex==1}" @click="goUrl('myApproval')">发起审批</li>
<li :class="{cked:liCkedIndex==2}">我的审批</li>
<li :class="{cked:liCkedIndex==3}" @click="goUrl('myApprovalList')">我发起的</li>
<li :class="{cked:liCkedIndex==4}" @click="goUrl('sendToMeApproval')">抄送我的</li>
</div>
<div class="query-box" style="border-bottom: none;">
<ul>
<li>
<span><em>关键字</em><el-input class='w210' v-model="msg.searchKey" placeholder="请输入申请人" @keyup.enter.native="getList"></el-input></span>
</li>
<li>
<span><em>审批类型</em><el-select v-model='msg.applyType'>
<el-option v-for='item in ApplyTypeList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li>
<span><em>审批状态</em><el-select v-model='msg.auditType'>
<el-option label='不限' value='0'></el-option>
<el-option label='待审核' value='1'></el-option>
<el-option label='已审核' value='2'></el-option>
</el-select></span>
</li>
<li>
<span><em>申请审核状态</em><el-select v-model='msg.appAuditStatus'>
<el-option v-for='item in appAuditStatusList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li><input type="button" class="hollowFixedBtn" value="查询" @click="resetPageIndex(),getList()"/></li>
</ul>
</div>
<div class="appListparent" v-loading='loading'>
<div class="forMyApprovalTable">
<li>审批标题</li>
<li>搜索简要</li>
<li>发起时间</li>
<li>状态</li>
<li>操作</li>
</div>
<div class="forMyApprovalItem" v-for="(item,index) in list">
<li>
<img v-if="!item.userPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="item.userPhoto" alt="" :onerror="defaultImg">
<span>{{item.title}}</span>
</li>
<li>
<p v-for="item in list[index].detial">{{item}}</p>
</li>
<li>
<p><i class="iconfont icon-img-rili"></i>
{{item.createTime}}</p></li>
<li>{{item.auditStatusStrt}}</li>
<li><input type="button" class="hollowFixedBtn" value="详情" @click="getDetail(item.workFlowId,item.templateType)"></li>
</div>
</div>
<el-pagination background
@current-change="handleCurrentChange"
:current-page.sync="currentPage"
layout="total,prev, pager, next, jumper"
:page-size=msg.pageSize
:total=total>
</el-pagination>
<div :class="{forMyApprovalLayer:showlayer}" @click="closeLayer">
<div :class="{forMyApprovalLayercontentDiv:true,rightZero:isTransition}" @click.stop>
<div class="title">{{detailList.Proposer}}{{detailList.TempleteTypeName}}</div>
<div class="user">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>{{detailList.Proposer}}</p>
<p><span style="color:#257BF1; font-size: 14px;">{{detailList.Status}}</span></p>
</div>
<div class="detail">
<table border="0" cellspacing="0" cellpadding="0" class="myApprovalTable">
<tr v-for="(item,index) in detailList.Details" v-if="(item.formType=='Image' && item.value.length>0) || item.formType!='Image'">
<td width="80" >{{item.title}}</td>
<td v-if="item.formType=='String'">{{item.value}}</td>
<td v-if="item.formType=='Json'">
<div v-for="(i,index) in item.value" style="border-bottom: 1px solid #ccc; padding:10px 0;">
<p style="line-height: 24px;" v-for="o in i">{{o.title}}{{o.value}}</p>
</div>
</td>
<td v-if="item.formType=='Image'">
<img v-if='item.value.length>0' style="width: 50px; height: 50px; border-radius: 4px; margin:0 10px 0 0;" v-for="(img,index) in item.value" :src="img"
@click="getPic(item.value)"/>
</td>
</tr>
</table>
</div>
<div class="audit">
<div class="auditItem">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>
<span>{{detailList.Proposer}}</span>&nbsp;&nbsp;<span>发起申请</span><span class="fr">{{detailList.ProposerTime}}</span>
</p>
</div>
<div class="auditItem" v-for="(item,index) in detailList.arList">
<img v-if='item.AuditRecordList.length==1&&!item.AuditRecordList[0].AuditEmPhoto' src="../../assets/images/administration/litheader.png" />
<img v-if='item.AuditRecordList.length==1&&item.AuditRecordList[0].AuditEmPhoto' :src='item.AuditRecordList[0].AuditEmPhoto' alt="" :onerror="defaultImg" />
<img v-if='item.AuditRecordList.length>1' src="../../assets/images/administration/bg_z1@2x.png" />
<p v-if='item.AuditRecordList.length==1'>
<span>{{item.AuditRecordList[0].AuditEmName}}</span>
<span :style="'color: ' + item.AuditRecordList[0].StatusColor + ' !important'">{{item.AuditRecordList[0].Stauts}}</span>
<span class="fr">{{item.AuditRecordList[0].AuditTime}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{item.AuditRecordList[0].Description}}</span>
<span v-if="item.AuditRecordList[0].CareOfList!=null" style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{item.AuditRecordList[0].CareOfList[0].BeFrom}} <b style="color: red;"></b> {{item.AuditRecordList[0].CareOfList[0].Target}}
<br/>
{{item.AuditRecordList[0].CareOfList[0].Remarks}}
</span>
</p>
<div class="auditItemImgList" style="padding-left: 30px;">
<img v-for='img in toArr(item.AuditRecordList[0].Image)' :src="img" @click="getPic(toArr(item.AuditRecordList[0].Image))"/>
</div>
<p v-if='item.AuditRecordList.length>1' style="cursor: pointer;">
<span>{{item.AuditDescription}}{{item.AuditWay}}</span>
<i class="el-icon-arrow-right"></i>
</p>
<div v-if='item.AuditRecordList.length>1' style=" width: 300px; height: auto; margin:15px 0; border-radius: 4px; background: #F0F3FA;">
<p v-if='item.AuditWayStatus==2' style="padding: 10px; color: #666;">须以下人员全部审批通过</p>
<p v-if='item.AuditWayStatus==3' style="padding: 10px; color: #666;">以下人员大于等于一人审批通过即可</p>
<div v-for="i in item.AuditRecordList">
<p class="auditItemDetailtitle">
<img width="28" height="28" v-if="!i.AuditEmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img width="28" height="28" v-else :src="i.AuditEmPhoto" alt="" :onerror="defaultImg">
<span>{{i.AuditEmName}}</span>
<span :style="'color: ' + i.StatusColor + ' !important'">{{i.Stauts}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{i.Description}}</span>
<span v-if='i.CareOfList!=null' style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{i.CareOfList[0].BeFrom}} <b style="color: red;"></b> {{i.CareOfList[0].Target}}
<br/>
{{i.CareOfList[0].Remarks}}
</span>
</p>
<div class="auditItemImgList" v-if="toArr(i.Image).length>0">
<img v-for='img in toArr(i.Image)' :src="img" @click="getPic(toArr(i.Image))"/>
</div>
</div>
</div>
</div>
</div> <!--audit end-->
<div class="send" v-if="detailList.AuditStatus==5"> <!--v-if="detailList.AuditStatus==5"-->
<p class="sentTitle">抄送<span>审批通过后,通知抄送人</span></p>
<div class="sendList">
<div v-for="(item,index) in detailList.CopyToPeopleList">
<img v-if="!item.EmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="item.EmPhoto" alt="" :onerror="defaultImg">
<br/>
{{item.EmName}}
</div>
</div>
</div> <!--send end-->
<div style="height: 50px; width: 100%;"><!--空白暂位,防止下面漂浮按钮遮挡内容--></div>
<div class="forMyApprovalLayerBtn">
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="同意" @click="openDialog(IsAgree=true,detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="不同意" @click="openDialog(IsAgree=false,detailList.WorkFlowId,detailList.TemplateType)" />
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="转交" @click="transferDialog(detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsCancel==1" type="button" class="hollowbtn" value="撤回" @click="withdrawAapproval(detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsUpdate==1&&detailList.TemplateType!=4" type="button" class="hollowbtn"
value="修改" @click="updateAapproval('leaveApproval',detailList.Cmd,detailList.SubmitCmd,detailList.WorkFlowId,detailList.TempleteId)"/>
</div>
</div>
</div>
<el-dialog custom-class='w500' :title="dialogTitle" :visible.sync="outerVisible" center :before-close="clearDialogMsg">
<table class="layerTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>审批意见</td>
<td>
<el-input type='textarea' v-model='appMsg.Description'></el-input>
</td>
</tr>
<tr>
<td>图片</td>
<td>
<el-upload
:file-list="fileList"
:http-request="uploadTest"
:multiple="true"
:limit="9"
list-type="picture-card"
:on-remove="handleRemove"
:on-exceed="handleExceed"
action="">
<i class="el-icon-plus"></i>
</el-upload>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="btnClearDialogMsg">取 消</button> &nbsp;
<button v-if='agree' class="normalBtn" type="primary" @click="agreeApproval">确定同意</button>
<button v-if='!agree' class="normalBtn" type="primary" @click="rejectApproval">确定不同意</button>
</div>
</el-dialog>
<el-dialog custom-class='w500' :title="dialogTitle1" :visible.sync="outerVisible1" center :before-close="clearTransferDialog">
<table class="layerTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="80" align="right">转交备注:</td>
<td>
<el-input type='textarea' v-model='transferMsg.Description'></el-input>
</td>
</tr>
<tr>
<td width="80" align="right">姓名搜索:</td>
<td >
<el-input class='w200' placeholder="请输入姓名关键字" v-model="filterText"></el-input>
</td>
</tr>
<tr>
<td colspan="2">
<el-tree class='forMyApprovalProcess'
:data="memberList"
:props="defaultProps"
:filter-node-method="filterNode"
show-checkbox
accordion
@check-change="handleNodeChange"
node-key="DepartmentId"
ref="tree"
check-strictly
>
</el-tree>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="btnClearTransferDialog">取 消</button> &nbsp;
<button class="normalBtn" type="primary" @click="transferApproval">确定</button>
</div>
</el-dialog>
<div :class="{viewBigPicLayer:true,viewBigPicLayerDisplayNone:dspNone}" @click="closePicLayer">
<i @click="closePicLayer" class="el-icon-circle-close-outline clolseViewBigPicLayer" ></i>
<el-carousel height="600px" :interval="5000" trigger="click">
<el-carousel-item v-for="(item,index) in picObj" :key="index">
<img :src="item" />
</el-carousel-item>
</el-carousel>
</div>
</div>
</template>
<script>
export default {
data() {
return {
filterText:"",
defaultProps: {
children: 'ChildList',
label: 'DepartmentName',
disabled: "Disabled"
},
fileList:[],
picObj:[],
dspNone:true,
workFlowId:'',
templateType:"",
agree:true,
outerVisible:false,
outerVisible1:false,
dialogTitle:"",
dialogTitle1:"",
IsAudit:'',
IsCancel:'',
IsUpdate:'',
showlayer:false,
isTransition:false,
loading:true,
liCkedIndex:2,
total:0,
defaultImg: 'this.src="' + require('../../assets/images/administration/litheader.png') + '"',
currentPage: 1,
//请求数据
msg:{
auditType:'0',
applyType:0,
pageIndex:1,
pageSize:5,
searchKey:'',
appAuditStatus:0,
},
appMsg:{
WorkFlowId:'',
TemplateType:'',
Description:'',
Image:[],
},
transferMsg:{
WorkFlowId:'',
TemplateType:'',
Description:'',
CareOfEmId:'-1',
},
//返回数据
list:[],
ApplyTypeList:[],
appAuditStatusList:[],
memberList:[],
detailList:{},
arr:[],
}
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
}
},
methods: {
uploadTest(file){ //上传
let newArr=[];
newArr.push(file.file)
let path="/Upload/Temporary/"
this.UploadSelfFileT(path,newArr,x=>{
let url = this.domainManager().ViittoFileUrl + x.data.FilePath
this.appMsg.Image.push(url)
this.fileList.push({url:url})
});
},
handleRemove(file){ //删除
this.fileList.forEach((item,index)=>{
if(item.url==file.url)
{
this.fileList.splice(index,1)
}
})
this.appMsg.Image.forEach((item,index)=>{
if(item==file.url)
{
this.appMsg.Image.splice(index,1)
}
})
},
handleExceed(files, fileList) {
this.$message.warning('最多只能上传9张图片!');
},
clearDialogMsg(done){
done()
this.appMsg.Description=''
// this.appMsg.Image=[]
},
btnClearDialogMsg(){
this.outerVisible=false
this.appMsg.Description=''
},
btnClearTransferDialog(done){
this.outerVisible1=false
this.filterText=''
this.transferMsg.WorkFlowId=''
this.transferMsg.TemplateType=''
this.transferMsg.Description=''
this.transferMsg.CareOfEmId='-1'
this.$refs.tree.setCheckedKeys([]);
},
closePicLayer(){
this.dspNone=true
},
getPic(obj){
this.picObj=obj
this.dspNone=false;
},
filterNode(value, data) {
if (!value) return true;
return data.DepartmentName.indexOf(value) !== -1;
},
openDialog(IsAgree,workFlowId,templateType){
this.agree=IsAgree
this.dialogTitle='审批流程'
this.outerVisible=true;
this.workFlowId=workFlowId;
this.templateType=templateType;
},
transferDialog(workFlowId,templateType){
this.dialogTitle1='转交流程'
this.outerVisible1=true;
this.workFlowId=workFlowId;
this.templateType=templateType;
this.apipost('WorkFlow_get_GetDepartMentEmployee', {}, res => {
if(res.data.resultCode == 1) {
this.memberList = res.data.data
}
}, err => {})
},
clearTransferDialog(done){
done()
this.filterText=''
this.transferMsg.WorkFlowId=''
this.transferMsg.TemplateType=''
this.transferMsg.Description=''
this.transferMsg.CareOfEmId='-1'
this.$refs.tree.setCheckedKeys([]);
},
handleNodeChange(data,checked, node){
if(checked){
if(data.DepartmentId!=0){
this.arr.push(data.DepartmentId)
this.$refs.tree.setCheckedKeys([data.DepartmentId]);
this.transferMsg.CareOfEmId=data.DepartmentId;
}
}else{
if(this.arr.length==1){
this.arr=[]
this.transferMsg.CareOfEmId='-1'
}else{
this.arr=this.arr.slice(this.arr.length-1)
this.transferMsg.CareOfEmId=this.arr[this.arr.length-1]
}
}
},
transferApproval(){
this.transferMsg.WorkFlowId=this.workFlowId
this.transferMsg.TemplateType=this.templateType
if(this.transferMsg.CareOfEmId=='-1')
{
this.$message.warning('请选择转交人!')
return
}
this.apipost('WorkFlow_post_SetCareOf',this.transferMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible1=false;
this.getList()
this.closeLayer()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
agreeApproval(){
this.appMsg.WorkFlowId=this.workFlowId
this.appMsg.TemplateType=this.templateType
this.apipost('WorkFlow_post_SetConsent',this.appMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible=false;
this.getList()
this.btnClearDialogMsg()
this.closeLayer()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
rejectApproval(){
this.appMsg.WorkFlowId=this.workFlowId
this.appMsg.TemplateType=this.templateType
this.apipost('WorkFlow_post_SetNotConsent',this.appMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible=false;
this.getList()
this.btnClearDialogMsg()
this.closeLayer()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
withdrawAapproval(workFlowId,templateType){
this.$confirm('是否撤回?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.apipost('app_user_workflow_wndoaudit',{workFlowId:workFlowId,templateType:templateType},res=>{
if(res.data.resultCode == 1) {
this.$message.success('撤回成功。')
this.getList()
}
},err=>{})
}).catch(() => {
this.$message.info('已取消撤回。')
});
},
updateAapproval(path,cmd,submitCmd,workFlowId,templateId){
this.$router.push({ name: path, query:{cmd:cmd,submitCmd:submitCmd,workFlowId:workFlowId,templateId:templateId}})
},
getBigpic(obj){
},
toArr(val){
let arr=[]
if(val!="[]")
{
val.substring(1,val.length-1).split(',').forEach(item=>{
arr.push(item.substring(1,item.length-1))
});
}
return arr;
},
getDetail(id,type){
this.showLayer();
this.apipost('app_user_workflow_GetAuditInfo',{WorkFlowId:id,TemplateType:type},res=>{
if(res.data.resultCode == 1) {
this.detailList=res.data.data
this.IsAudit=res.data.data.IsAudit
this.IsCancel=res.data.data.IsCancel
this.IsUpdate=res.data.data.IsUpdate
}
},err=>{})
},
getList(){
this.loading=true;
this.apipost('app_user_workflow_my_audit',this.msg,res=>{
if(res.data.resultCode == 1) {
this.list=res.data.data.pageData;
this.total=res.data.data.count;
this.loading=false
}
},err=>{})
},
getApplyType(){ //模板类型
this.apipost('app_user_workflow_get_templatetype',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.ApplyTypeList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
getAppAuditStatus(){
this.apipost('app_user_workflow_get_myinitiate_auditstatus',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.appAuditStatusList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
showLayer() {
this.showlayer = true;
this.isTransition = true;
this.displayNone=false
},
closeLayer() {
let _this = this;
setTimeout(function() {
_this.showlayer = false;
}, 300)
this.isTransition = false;
this.displayNone=true
},
goUrl (path,id) {
this.$router.push({ path: path})
}
},
mounted() {
this.getList()
this.getApplyType()
this.getAppAuditStatus()
}
}
</script>
<style>
@import "../financial/css/cssReset.css";
.appListparent{ overflow-x: auto;}
.appListparent::-webkit-scrollbar{/*滚动条整体样式*/width: 4px;/*高宽分别对应横竖滚动条的尺寸*/height: 8px;}
.appListparent::-webkit-scrollbar-thumb{/*滚动条里面小方块*/border-radius: 4px;-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);background: #c9c9c9;}
.appListparent::-webkit-scrollbar-track{/*滚动条里面轨道*/-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #EDEDED;}
.forMyApprovalProcess {
background: #f8f8f8;
max-height: 400px;
overflow-y: auto;
}
.auditItemImgList{}
.auditItemImgList>img{width: 48px; height: 48px; border-radius: 4px; margin:8px 0 8px 10px;}
.auditItemDetailtitle{}
.auditItemDetailtitle>img{float: left; border-radius: 16px; margin: 0 10px 0 0;}
.auditItemDetailtitle>span{line-height: 32px;}
.forMyApprovalLayer{position: fixed; z-index: 99; background: rgba(0,0,0,.2); width: 100%; height: 100%; left: 0; top: 0;}
.forMyApprovalLayercontentDiv{width: 400px; background: #fff; height: 100%; overflow: auto; top: 0; right:-800px; position: fixed;box-shadow: 4px 0px 10px rgba(0, 0, 0, 0.1);transition: right .5s;}
.forMyApprovalLayer .rightZero{right: 0px;}
.forMyApprovalLayercontentDiv .title{height: 48px; background: #EDEEF0; line-height: 48px; font-size:16px; color: #333; text-indent: 30px;}
.forMyApprovalLayercontentDiv .user{width: 340px; margin: 0 30px; border-bottom: 1px solid #E6E6E6; height: 60px; padding: 30px 0; box-sizing: content-box}
.forMyApprovalLayercontentDiv .user>p{line-height: 28px;}
.forMyApprovalLayercontentDiv .user>img{width:58px; height: 58px; border-radius: 29px; float: left; margin:0 12px 0 0;}
.forMyApprovalLayercontentDiv .detail{width: 340px; margin: 0 30px; padding: 25px 0; border-bottom: 1px solid #E6E6E6; min-height: 120px;}
.forMyApprovalLayercontentDiv .audit{width: 340px; margin: 30px 30px 0; min-height: 120px; border-bottom: 1px solid #E6E6E6;}
.forMyApprovalLayercontentDiv .audit .auditItem{min-height: 80px; width: 320px; margin-left: 20px; border-left:1px solid #EDEDED; position: relative; font-size: 14px;}
.forMyApprovalLayercontentDiv .audit .auditItem:last-child{border-left: none;}
.forMyApprovalLayercontentDiv .audit .auditItem>p{line-height: 40px;text-indent: 40px;}
.forMyApprovalLayercontentDiv .audit .auditItem>img{width: 40px; height: 40px; border-radius: 20px; position: absolute; left: -20px;}
.forMyApprovalLayercontentDiv .send{width: 340px; margin: 30px 30px 0; min-height: 120px;}
.forMyApprovalLayercontentDiv .send .sentTitle{height: 14px; line-height: 14px; text-indent:10px; border-left:3px solid #E95252; font-size: 14px;}
.forMyApprovalLayercontentDiv .send .sentTitle span{color: #666; margin-left: 20px;}
.forMyApprovalLayercontentDiv .send .sendList>div{float: left; margin: 10px 10px 0 0; font-size: 12px; color: #666; width: 40px; text-align: center;}
.forMyApprovalLayercontentDiv .send .sendList>div>img{width: 40px; height: 40px; border-radius: 20px;}
.forMyApprovalLayercontentDiv .myApprovalTable tr{height: 40px; font-size: 14px;}
.forMyApprovalLayercontentDiv .myApprovalTable tr td:nth-child(1){text-align: right; color: #666; }
.forMyApprovalLayerBtn{position: fixed; bottom: 0; background: #fff; width: 100%; height: 40px; line-height: 40px; padding: 0 30px; border-top:1px solid #F0F3FA}
.forMyApprovalLayerBtn input{margin-right: 10px;}
.myApprovalMenu{width: 100%; height: 40px; text-align: center; line-height: 40px; background: #fff; border-radius: 4px; margin: 30px 0;}
.myApprovalMenu li{float: left; width:25%; font-size: 14px; color: #666; cursor: pointer;}
.myApprovalMenu li:hover{border-bottom: 2px solid #E95252;}
.myApprovalMenu li.cked{border-bottom: 2px solid #E95252; font-size: 16px; color:#E95252;}
.forMyApprovalTable{width: 100%; min-width: 1600px; height: 38px;}
.forMyApprovalTable li{float: left; width: 20%; height: 38px; line-height: 38px; font-size: 14px; text-indent: 20px;background: #EDEDED; font-family: PingFangSC-Semibold !important;}
.forMyApprovalItem{width: 100%; min-width: 1600px; min-height:80px; padding: 20px 0; background: #fff; border-bottom:1px solid #f9f9f9; overflow: hidden;}
.forMyApprovalItem li{float:left; width: 20%; height: 100%; font-size: 14px; text-indent: 20px;}
.forMyApprovalItem li>p{line-height: 24px; color: #666;}
.forMyApprovalItem:hover{box-shadow:0px 0px 10px rgba(191,191,191,1);transition: all linear 0.3s; position: relative; z-index: 5;}
.forMyApprovalItem li>img{float: left; width: 40px; height: 40px; border-radius: 20px; margin: 0 10px 20px 30px;}
</style>
<template>
<div class="flexOne">
<div style="padding: 30px 0;" v-loading='loading'>
<div class="leaveApprovalItem" v-for="(item,index) in list">
<span class="fl"><em v-if="item.required"></em>{{item.title}}</span>
<el-select v-if="item.formType=='selectField'" v-model="item.value" @change='isYearLeave(item.value)'>
<el-option v-for='item in newArr(item.category)' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select>
<el-date-picker v-if="item.formType=='dateTimeField'&&!yearLeave" :picker-options="pickerOptions1" :clearable='false' v-model="item.value" value-format='yyyy-MM-dd HH:mm:ss' type="datetime" placeholder="选择日期时间" @change='getDuration(list,index)'></el-date-picker>
<el-date-picker v-if="item.formType=='dateTimeField'&&yearLeave" :picker-options="pickerOptions" :clearable='false' v-model="item.value" value-format='yyyy-MM-dd' type="date" placeholder="选择日期时间" @change='getDuration(list,index)'></el-date-picker>
<el-select class='w80' v-if="item.key=='startTime'&&yearLeave" v-model='startVal' @change='getDuration(list,index)'>
<el-option label='上午' value='1'></el-option>
<el-option label='下午' value='2'></el-option>
</el-select>
<el-select class='w80' v-if="item.key=='endTime'&&yearLeave" v-model='endVal' @change='getDuration(list,index)'>
<el-option label='上午' value='1'></el-option>
<el-option label='下午' value='2'></el-option>
</el-select>
<el-input v-if="item.formType=='durationField'" class='w220' v-model='item.value' :disabled="true"></el-input>
<el-input v-if="item.formType=='textareaField'" type='textarea' :rows="5" maxlength='200' v-model='item.value' class='w300'></el-input>
<el-input v-if="item.formType=='textField'" type='textarea' :rows="5" maxlength='200' v-model='item.value' class='w300'></el-input>
<div v-if="item.formType=='childField'" style=" display: inline-block;">
<div v-for="(i,index) in item.value" style="border-bottom: 1px solid #ccc; margin: 0 0 20px 0;">
<P style="font-size: 12px; height:40px;">行程{{index+1}}
<input type="button" v-if='item.value.length>1' class="hollowbtn fr" @click="deleteItem(item.value,index)" value="删除" />
</P>
<p v-for="(o,index) in i" style="height: 50px;">
<span style="display: inline-block; font-size: 12px; color: #666; width: 80px; "><em class='emMust' v-if="o.required"></em>{{o.title}}</span>
<el-select v-if="o.formType=='selectField'" v-model='o.value'>
<el-option v-for='item in newArr(o.category)' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select>
<el-input v-if="o.formType=='textField'" class='w217' v-model='o.value'></el-input>
<el-date-picker @change='getDuration(i,index)' :clearable='false' v-if="o.formType=='dateTimeField'" v-model="o.value" value-format='yyyy-MM-dd HH:mm:ss' type="datetime" placeholder="选择日期时间"></el-date-picker>
<el-input v-if="o.formType=='durationField'" class='w217' v-model='o.value' :disabled="true"></el-input>
</p>
</div>
<p style="margin-bottom: 15px;"><input type="button" class="normalBtn" value="添加行程" @click="addNode" /></p>
</div>
<el-input v-if="item.formType=='totalDurationField'" v-model='item.value' class='w300' :disabled="true"></el-input>
<el-upload v-if="item.formType=='imageField'" :file-list="fileList" :http-request="uploadTest" :multiple="true" :limit="9" list-type="picture-card" :on-remove="handleRemove" :on-preview="handlePictureCardPreview" :on-exceed="handleExceed" action="">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog custom-class='w800' title='图片详情' :visible.sync="dialogVisible" center>
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
</div>
</div>
<div class="leaveApprovalItem">
<span>&nbsp;</span>
<input type="button" class="hollowFixedBtn" value="取消" @click="goback" /> &nbsp;&nbsp;
<input type="button" class="normalBtn" value="提交" @click="saveLeaveFor" />
</div>
</div>
</template>
<script>
import Vue from 'vue'
import {
UploadSelfFile
} from '../../api/common/common'
export default {
data() {
return {
pickerOptions: {
disabledDate: (time) => { //disabledDate true 为禁止选择
return time.getTime() < Date.now() + 1000 * 60 * 60 * 24 * (this.keyContentBefor - 1)
}
},
pickerOptions1: {
disabledDate: (time) => { //disabledDate true 为禁止选择
return time.getTime() < Date.now() - 1000 * 60 * 60 * 24
}
},
startVal: '1',
endVal: '1',
fileList: [],
submitFileList: [],
dialogImageUrl: '',
dialogVisible: false,
loading: false,
yearLeave: false,
workFlowId: '0',
type: '',
cmd: '',
submitCmd: '',
msg: {},
list: [],
totalList: [],
keyContent: '',
keyContentBefor: '',
lunchTime: '',
}
},
methods: {
getLunchTime() {
this.apipost('dict_post_GetList', {
Key: 'SK_AskForLeaveSet_LunchBreak'
}, res => {
if(res.data.resultCode == 1) {
this.getList()
if(res.data.data[0].Content!=''&&res.data.data[0].Content!=null)
{
this.lunchTime = res.data.data[0].Content
}else{
this.lunchTime='12:00-13:00'
}
}
}, err => {})
},
getKey() {
this.apipost('dict_post_GetList', {
Key: 'SK_AskForLeaveSet_Month'
}, res => {
if(res.data.resultCode == 1) {
this.keyContent = res.data.data[0].Content
}
}, err => {})
},
getKeyBefore() {
this.apipost('dict_post_GetList', {
Key: 'SK_AskForLeaveSet_Befor'
}, res => {
if(res.data.resultCode == 1) {
this.keyContentBefor = res.data.data[0].Content
}
}, err => {})
},
isYearLeave(val) {
if(val == 1) {
this.yearLeave = true
} else {
this.yearLeave = false
}
this.list.forEach(item => {
if(item.formType == 'dateTimeField' || item.formType == 'durationField') {
item.value = ''
}
})
},
uploadTest(file) { //上传11
let newArr = [];
newArr.push(file.file)
UploadSelfFile('Temporary', file.file, x => {
console.log(x)
let url = x.FileUrl
this.submitFileList.push(url)
this.fileList.push({
// url: x.res.requestUrls[0].split("?")[0]
url: x.FileUrl
})
});
},
handleRemove(file) { //删除
this.fileList.forEach((item, index) => {
if(item.url == file.url) {
this.fileList.splice(index, 1)
}
})
this.submitFileList.forEach((item, index) => {
if(item == file.url) {
this.submitFileList.splice(index, 1)
}
})
},
handlePictureCardPreview(file) { //查看大图
this.dialogVisible = true;
this.dialogImageUrl = file.url;
},
handleExceed(files, fileList) {
this.$message.warning('最多只能上传9张图片!');
},
goback() {
history.back(-1)
},
newArr(obj) {
let arr = []
obj.forEach(item => {
for(let key in item) {
if(item.hasOwnProperty(key)) {
arr.push({
label: key,
value: item[key]
})
}
}
})
return arr;
},
addNode() {
let additem = {}
this.list.forEach(item => {
if(item.formType == 'childField') {
additem = JSON.parse(JSON.stringify(item.value[0]))
additem.forEach(item => {
item.value = '';
})
item.value.push(additem)
}
})
},
deleteItem(arr, index) {
this.totalList.splice(index, 1);
let totalDurationField = 0;
this.totalList.forEach(item => {
totalDurationField += item
})
arr.splice(index, 1)
this.list.forEach(item => {
if(item.formType == 'totalDurationField') {
item.value = totalDurationField;
}
})
},
getList() {
this.apipost(this.cmd, {
workFlowId: this.workFlowId
}, res => {
if(res.data.resultCode == 1) {
this.list = res.data.data
this.list.forEach(item => {
if(item.formType == 'selectField' && item.value == 0) {
item.value = '';
}
if(item.formType == 'imageField' && item.value.length > 0) {
item.value.forEach(item => {
this.fileList.push({
url: item
})
this.submitFileList.push(item)
})
}
})
if(this.list[0].value==1)
{
this.yearLeave = true
let _start=this.list[1].value.split(' ')[1]
let _end=this.list[2].value.split(' ')[1]
let _startLunchTime=this.lunchTime.split('-')[0]+':00'
let _endLunchTime=this.lunchTime.split('-')[1]+':00'
this.list[1].value=this.list[1].value.split(' ')[0]
this.list[2].value=this.list[2].value.split(' ')[0]
if(_start<_startLunchTime){
this.startVal='1'
}else{
this.startVal='2'
}
if(_end<_endLunchTime){
this.endVal='1'
}else{
this.endVal='2'
}
}else{
this.yearLeave = false
}
}
}, err => {})
},
getDuration(obj, index) {
let starTime = ''
let endTime = ''
if(!this.yearLeave) {
obj.forEach(item => {
if(item.key == 'startTime') {
starTime = item.value
}
if(item.key == 'endTime') {
endTime = item.value
}
})
} else {
obj.forEach(item => {
if(item.key == 'startTime') {
let _startMonth = item.value.substring(6, 7)
if(_startMonth != '' && (this.keyContent).indexOf(_startMonth) != '-1') {
this.$message.warning("该月份不能请年假!")
item.value = ''
} else {
if(this.startVal === '1') {
starTime = item.value + ' 00:00:00'
}
if(this.startVal === '2') {
starTime = item.value + ' ' + this.lunchTime.split('-')[1]
}
}
}
if(item.key == 'endTime') {
let _endMonth = item.value.substring(6, 7)
if(_endMonth != '' && (this.keyContent).indexOf(_endMonth) != '-1') {
this.$message.warning("该月份不能请年假!")
item.value = ''
} else {
if(this.endVal === '1') {
endTime = item.value + ' ' + this.lunchTime.split('-')[0]
}
if(this.endVal === '2') {
endTime = item.value + ' 23:59:59'
}
}
}
})
}
if(starTime != '' && endTime != '') {
this.apipost('app_user_workflow_calculate_duration', {
startTime: starTime,
endTime: endTime,
templateId: this.type,
LunchTime: this.lunchTime
}, res => {
if(res.data.resultCode == 1) {
this.totalList = [];
obj.forEach(item => {
if(item.formType == 'durationField') {
item.value = res.data.data.duration;
let totalDurationField = 0;
this.list.forEach(item => {
if(item.formType == 'childField') {
item.value.forEach(i => {
i.forEach(o => {
if(o.formType == 'durationField' && o.value != '') {
totalDurationField += parseFloat(o.value);
this.totalList.push(parseFloat(o.value))
}
})
})
}
})
this.list.forEach(item => {
if(item.formType == 'totalDurationField') {
item.value = totalDurationField;
}
})
}
})
}
}, err => {})
}
},
saveLeaveFor() {
let _isOk = true
this.loading = true
this.list.forEach(item => {
if(item.formType == 'imageField') {
Vue.set(this.msg, item.key, this.submitFileList)
}
if(item.formType != "childField" && item.formType != 'imageField') {
Vue.set(this.msg, item.key, item.value)
if(item.required == true) {
if(item.value != '' && item.value != 0) {} else {
_isOk = false
}
}
}
if(item.formType == "childField") {
let insideMsg = []
item.value.forEach(i => {
if(i.formType == "childField") {
insideMsg = item.key
}
let objItem = {}
i.forEach(o => {
Vue.set(objItem, o.key, o.value)
if(o.required == true) {
if(o.value != '') {} else {
_isOk = false
}
}
})
insideMsg.push(objItem)
})
Vue.set(this.msg, item.key, insideMsg)
}
})
if(!_isOk) {
this.$message.error('带红色星号为必填项!')
this.loading = false
return
}
this.msg.Id = this.workFlowId;
this.msg.LunchTime = this.lunchTime;
if(this.msg.askforleaveType == '1') {
if(this.startVal === '1') {
this.msg.startTime = this.msg.startTime + ' 00:00:00'
}
if(this.startVal === '2') {
this.msg.startTime = this.msg.startTime + ' ' + this.lunchTime.split('-')[1]
}
if(this.endVal === '1') {
this.msg.endTime = this.msg.endTime + ' ' + this.lunchTime.split('-')[0]
}
if(this.endVal === '2') {
this.msg.endTime = this.msg.endTime + ' 23:59:59'
}
}
this.apipost(this.submitCmd, this.msg, res => {
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.loading = false
//this.goback()
} else {
this.$message.warning(res.data.message)
this.loading = false
}
}, err => {})
},
},
mounted() {
this.getLunchTime()
this.msg.templateId = this.$route.query.templateId
this.type = this.$route.query.templateId
this.workFlowId = this.$route.query.workFlowId
this.cmd = this.$route.query.cmd
this.submitCmd = this.$route.query.submitCmd
this.getKey()
this.getKeyBefore()
},
}
</script>
<style>
@import "../financial/css/cssReset.css";
.leaveApprovalTitle {
margin: 30px 0;
height: 14px;
line-height: 14px;
text-indent: 10px;
border-left: 3px solid #E95252;
font-size: 14px;
}
.leaveApprovalItem {
min-height: 40px;
margin-bottom: 20px;
}
.emMust:before {
content: "*";
color: red;
margin-right: 5px;
font-style: normal;
font-size: 16px;
}
.leaveApprovalItem>span>em:before {
content: "*";
color: red;
margin-right: 5px;
font-style: normal;
font-size: 16px;
}
.leaveApprovalItem>span {
font-size: 12px;
color: #666;
display: inline-block;
width: 80px;
text-align: right;
margin-right: 20px;
}
</style>
<template>
<div class="flexOne">
<div class="myApprovalMenu">
<li :class="{cked:liCkedIndex==1}">发起审批</li>
<li :class="{cked:liCkedIndex==2}" @click="goUrl('forMyApproval')">我的审批</li>
<li :class="{cked:liCkedIndex==3}" @click="goUrl('myApprovalList')">我发起的</li>
<li :class="{cked:liCkedIndex==4}" @click="goUrl('sendToMeApproval')">抄送我的</li>
</div>
<!--<p>
<el-input class='w200' prefix-icon="el-icon-search" placeholder="请输入内容"></el-input>
&nbsp;
<input type="button" class="hollowFixedBtn" value="搜索" />
</p>-->
<p class="myApprovalMenuTitle" v-if='typeLength>0'>{{myTitle}}{{typeLength}}</p>
<div class="myApprovalTypeList">
<li v-for="(item,index) in typeList" v-if="item.name!='补卡'" @click="goUrl('leaveApproval',item.cmd,item.submitCmd,item.id)"><img :src="item.icon"> {{item.name}}</li>
<li v-for="(item,index) in typeList" v-if="item.name=='补卡'" @click="outerVisible = true"> <img :src="item.icon"> {{item.name}}</li>
</div>
<el-dialog custom-class='w500' title="补卡申请" :visible.sync="outerVisible" center>
<div style="text-align: center; padding: 20px 0;">
<i class="iconfont icon-buqiashenqing" style="font-size: 50px; color: #666;"></i>
<p style="margin-top: 20px; font-size: 16px; color: #666;">暂只支持在手机上申请补卡!</p>
</div>
<div slot="footer" class="dialog-footer">
<button class="normalBtn" @click="outerVisible = false">我知道了</button> &nbsp;
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
outerVisible:false,
liCkedIndex:1,
//请求数据
msg:{
},
//返回数据
myTitle:'',
typeLength:'',
typeList:[],
}
},
methods: {
getList(){
this.apipost('app_user_workflow_auditworkflow_template',this.msg,res=>{
if(res.data.resultCode == 1) {
this.typeList=res.data.data[0].templateList
this.myTitle=res.data.data[0].groupName
this.typeLength=res.data.data[0].templateList.length
}
},err=>{})
},
goUrl (path,cmd,submitCmd,id) {
this.$router.push({ path: path,query:{"cmd":cmd,"submitCmd":submitCmd,'templateId':id}})
}
},
mounted() {
this.getList()
}
}
</script>
<style>
@import "../financial/css/cssReset.css";
.myApprovalMenu{width: 100%; height: 40px; text-align: center; line-height: 40px; background: #fff; border-radius: 4px; margin: 30px 0;}
.myApprovalMenu li{float: left; width:25%; font-size: 14px; color: #666; cursor: pointer;}
.myApprovalMenu li:hover{border-bottom: 2px solid #E95252;}
.myApprovalMenu li.cked{border-bottom: 2px solid #E95252; font-size: 16px; color:#E95252;}
.myApprovalMenuTitle{height: 14px; line-height: 14px; font-size: 14px; color: #333; text-indent: 20px; border-left:3px solid #E95252; margin:40px 0 20px 0;}
.myApprovalTypeList li{float: left; height:160px; background: #fff; box-shadow: 1px 1px 1px rgba(0,0,0,.1); cursor:pointer; border-radius: 4px; width: 360px; line-height: 160px;margin: 0 40px 20px 0;}
.myApprovalTypeList li>img{float: left; margin: 36px 20px 38px 22px; width: 86px;}
</style>
<template>
<div class="flexOne">
<div class="myApprovalMenu">
<li :class="{cked:liCkedIndex==1}" @click="goUrl('myApproval')">发起审批</li>
<li :class="{cked:liCkedIndex==2}" @click="goUrl('forMyApproval')">我的审批</li>
<li :class="{cked:liCkedIndex==3}">我发起的</li>
<li :class="{cked:liCkedIndex==4}" @click="goUrl('sendToMeApproval')">抄送我的</li>
</div>
<div class="query-box" style="border-bottom: none;">
<ul>
<li>
<span><em>关键字</em><el-input class='w210' v-model="msg.searchKey" placeholder="请输入申请人" @keyup.enter.native="getList"></el-input></span>
</li>
<li>
<span><em>审批类型</em><el-select v-model='msg.applyType'>
<el-option v-for='item in ApplyTypeList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li>
<span><em>申请审核状态</em><el-select v-model='msg.appAuditStatus'>
<el-option v-for='item in appAuditStatusList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li><input type="button" class="hollowFixedBtn" value="查询" @click="resetPageIndex(),getList()"/></li>
</ul>
</div>
<div class="appListparent" v-loading='loading'>
<div class="forMyApprovalTable">
<li>审批标题</li>
<li>搜索简要</li>
<li>发起时间</li>
<li>状态</li>
<li>操作</li>
</div>
<div class="forMyApprovalItem" v-for="(item,index) in list">
<li>
<img v-if="!item.userPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="item.userPhoto" alt="" :onerror="defaultImg">
<span>{{item.title}}</span>
</li>
<li>
<p v-for="item in list[index].detial">{{item}}</p>
</li>
<li>
<p><i class="iconfont icon-img-rili"></i>
{{item.createTime}}</p></li>
<li>{{item.auditStatusStrt}}</li>
<li><input type="button" class="hollowFixedBtn" value="详情" @click="getDetail(item.workFlowId,item.templateType)"></li>
</div>
<el-pagination background
@current-change="handleCurrentChange"
:current-page.sync="currentPage"
layout="total,prev, pager, next, jumper"
:page-size=msg.pageSize
:total=total>
</el-pagination>
</div>
<div :class="{forMyApprovalLayer:showlayer}" @click="closeLayer">
<div :class="{forMyApprovalLayercontentDiv:true,rightZero:isTransition}" @click.stop>
<div class="title">{{detailList.Proposer}}{{detailList.TempleteTypeName}}</div>
<div class="user">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>{{detailList.Proposer}}</p>
<p><span style="color:#257BF1; font-size: 14px;">{{detailList.Status}}</span></p>
</div>
<div class="detail">
<table border="0" cellspacing="0" cellpadding="0" class="myApprovalTable">
<tr v-for="(item,index) in detailList.Details" v-if="(item.formType=='Image' && item.value.length>0) || item.formType!='Image'">
<td width="80" >{{item.title}}</td>
<td v-if="item.formType=='String'">{{item.value}}</td>
<td v-if="item.formType=='Json'">
<div v-for="(i,index) in item.value" style="border-bottom: 1px solid #ccc; padding:10px 0;">
<p style="line-height: 24px;" v-for="o in i">{{o.title}}{{o.value}}</p>
</div>
</td>
<td v-if="item.formType=='Image'">
<img v-if='item.value.length>0' style="width: 50px; height: 50px; border-radius: 4px; margin:0 10px 0 0;" v-for="(img,index) in item.value" :src="img"
@click="getPic(item.value)"/>
</td>
</tr>
</table>
</div>
<div class="audit">
<div class="auditItem">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>
<span>{{detailList.Proposer}}</span>&nbsp;&nbsp;<span>发起申请</span><span class="fr">{{detailList.ProposerTime}}</span>
</p>
</div>
<div class="auditItem" v-for="(item,index) in detailList.arList">
<img v-if='item.AuditRecordList.length==1&&!item.AuditRecordList[0].AuditEmPhoto' src="../../assets/images/administration/litheader.png" />
<img v-if='item.AuditRecordList.length==1&&item.AuditRecordList[0].AuditEmPhoto' :src='item.AuditRecordList[0].AuditEmPhoto' alt="" :onerror="defaultImg" />
<img v-if='item.AuditRecordList.length>1' src="../../assets/images/administration/bg_z1@2x.png" />
<p v-if='item.AuditRecordList.length==1'>
<span>{{item.AuditRecordList[0].AuditEmName}}</span>
<span :style="'color: ' + item.AuditRecordList[0].StatusColor + ' !important'">{{item.AuditRecordList[0].Stauts}}</span>
<span class="fr">{{item.AuditRecordList[0].AuditTime}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{item.AuditRecordList[0].Description}}</span>
<span v-if="item.AuditRecordList[0].CareOfList!=null" style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{item.AuditRecordList[0].CareOfList[0].BeFrom}} <b style="color: red;"></b> {{item.AuditRecordList[0].CareOfList[0].Target}}
<br/>
{{item.AuditRecordList[0].CareOfList[0].Remarks}}
</span>
</p>
<div class="auditItemImgList" style="padding-left: 30px;">
<img v-for='img in toArr(item.AuditRecordList[0].Image)' :src="img" @click="getPic(toArr(item.AuditRecordList[0].Image))"/>
</div>
<p v-if='item.AuditRecordList.length>1' style="cursor: pointer;">
<span>{{item.AuditDescription}}{{item.AuditWay}}</span>
<i class="el-icon-arrow-right"></i>
</p>
<div v-if='item.AuditRecordList.length>1' style=" width: 300px; height: auto; margin:15px 0; border-radius: 4px; background: #F0F3FA;">
<p v-if='item.AuditWayStatus==2' style="padding: 10px; color: #666;">须以下人员全部审批通过</p>
<p v-if='item.AuditWayStatus==3' style="padding: 10px; color: #666;">以下人员大于等于一人审批通过即可</p>
<div v-for="i in item.AuditRecordList">
<p class="auditItemDetailtitle">
<img width="28" height="28" v-if="!i.AuditEmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img width="28" height="28" v-else :src="i.AuditEmPhoto" alt="" :onerror="defaultImg">
<span>{{i.AuditEmName}}</span>
<span :style="'color: ' + i.StatusColor + ' !important'">{{i.Stauts}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{i.Description}}</span>
<span v-if='i.CareOfList!=null' style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{i.CareOfList[0].BeFrom}} <b style="color: red;"></b> {{i.CareOfList[0].Target}}
<br/>
{{i.CareOfList[0].Remarks}}
</span>
</p>
<div class="auditItemImgList" v-if="toArr(i.Image).length>0">
<img v-for='img in toArr(i.Image)' :src="img" @click="getPic(toArr(i.Image))"/>
</div>
</div>
</div>
</div>
</div> <!--audit end-->
<div class="send" v-if="detailList.AuditStatus==5"> <!--v-if="detailList.AuditStatus==5"-->
<p class="sentTitle">抄送<span>审批通过后,通知抄送人</span></p>
<div class="sendList">
<div v-for="(item,index) in detailList.CopyToPeopleList">
<img v-if="!item.EmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="item.EmPhoto" alt="" :onerror="defaultImg">
<br/>
{{item.EmName}}
</div>
</div>
</div> <!--send end-->
<div style="height: 50px; width: 100%;"><!--空白暂位,防止下面漂浮按钮遮挡内容--></div>
<div class="forMyApprovalLayerBtn">
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="同意" @click="openDialog(IsAgree=true,detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="不同意" @click="openDialog(IsAgree=false,detailList.WorkFlowId,detailList.TemplateType)" />
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="转交" @click="transferDialog(detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsCancel==1" type="button" class="hollowbtn" value="撤回" @click="withdrawAapproval(detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsUpdate==1&&detailList.TemplateType!=4" type="button" class="hollowbtn"
value="修改" @click="updateAapproval('leaveApproval',detailList.Cmd,detailList.SubmitCmd,detailList.WorkFlowId,detailList.TempleteId)"/>
</div>
</div>
</div>
<el-dialog custom-class='w500' :title="dialogTitle" :visible.sync="outerVisible" center :before-close="clearDialogMsg">
<table class="layerTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>审批意见</td>
<td>
<el-input type='textarea' v-model='appMsg.Description'></el-input>
</td>
</tr>
<tr>
<td>图片</td>
<td>
<el-upload
:file-list="fileList"
:http-request="uploadTest"
:multiple="true"
:limit="9"
list-type="picture-card"
:on-remove="handleRemove"
:on-exceed="handleExceed"
action="">
<i class="el-icon-plus"></i>
</el-upload>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="btnClearDialogMsg">取 消</button> &nbsp;
<button v-if='agree' class="normalBtn" type="primary" @click="agreeApproval">同意</button>
<button v-if='!agree' class="normalBtn" type="primary" @click="rejectApproval">拒绝</button>
</div>
</el-dialog>
<el-dialog custom-class='w500' :title="dialogTitle1" :visible.sync="outerVisible1" center :before-close="clearTransferDialog">
<table class="layerTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="80" align="right">转交备注:</td>
<td>
<el-input type='textarea' v-model='transferMsg.Description' maxlength='50'></el-input>
</td>
</tr>
<tr>
<td width="80" align="right">姓名搜索:</td>
<td >
<el-input class='w200' placeholder="请输入姓名关键字" v-model="filterText"></el-input>
</td>
</tr>
<tr>
<td colspan="2">
<el-tree class='forMyApprovalProcess'
:data="memberList"
:props="defaultProps"
:filter-node-method="filterNode"
show-checkbox
accordion
@check-change="handleNodeChange"
node-key="DepartmentId"
ref="tree"
check-strictly
>
</el-tree>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="btnClearTransferDialog">取 消</button> &nbsp;
<button class="normalBtn" type="primary" @click="transferApproval">确定</button>
</div>
</el-dialog>
<div :class="{viewBigPicLayer:true,viewBigPicLayerDisplayNone:dspNone}" @click="closePicLayer">
<i @click="closePicLayer" class="el-icon-circle-close-outline clolseViewBigPicLayer" ></i>
<el-carousel height="600px" :interval="5000" trigger="click">
<el-carousel-item v-for="(item,index) in picObj" :key="index">
<img :src="item" />
</el-carousel-item>
</el-carousel>
</div>
</div>
</template>
<script>
export default {
data() {
return {
filterText:"",
defaultProps: {
children: 'ChildList',
label: 'DepartmentName',
disabled: "Disabled"
},
fileList:[],
picObj:[],
dspNone:true,
workFlowId:'',
templateType:"",
agree:true,
outerVisible:false,
outerVisible1:false,
dialogTitle:"",
dialogTitle1:"",
IsAudit:'',
IsCancel:'',
IsUpdate:'',
showlayer:false,
isTransition:false,
loading:true,
liCkedIndex:3,
defaultImg: 'this.src="' + require('../../assets/images/administration/litheader.png') + '"',
total:0,
currentPage: 1,
//请求数据
msg:{
applyType:0,
pageIndex:1,
pageSize:5,
searchKey:'',
appAuditStatus:0,
},
appMsg:{
WorkFlowId:'',
TemplateType:'',
Description:'',
Image:[],
},
transferMsg:{
WorkFlowId:'',
TemplateType:'',
Description:'',
CareOfEmId:'-1',
},
//返回数据
list:[],
ApplyTypeList:[],
appAuditStatusList:[],
memberList:[],
detailList:{},
arr:[],
}
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
}
},
methods: {
uploadTest(file){ //上传
let newArr=[];
newArr.push(file.file)
let path="/Upload/Temporary/"
this.UploadSelfFileT(path,newArr,x=>{
let url = this.domainManager().ViittoFileUrl + x.data.FilePath
this.appMsg.Image.push(url)
this.fileList.push({url: url})
});
},
handleRemove(file){ //删除
this.fileList.forEach((item,index)=>{
if(item.url==file.url)
{
this.fileList.splice(index,1)
}
})
this.appMsg.Image.forEach((item,index)=>{
if(item==file.url)
{
this.appMsg.Image.splice(index,1)
}
})
},
handleExceed(files, fileList) {
this.$message.warning('最多只能上传9张图片!');
},
clearDialogMsg(done){
done()
this.appMsg.Description=''
// this.appMsg.Image=[]
},
btnClearDialogMsg(){
this.outerVisible=false
this.appMsg.Description=''
},
btnClearTransferDialog(done){
this.outerVisible1=false
this.filterText=''
this.transferMsg.WorkFlowId=''
this.transferMsg.TemplateType=''
this.transferMsg.Description=''
this.transferMsg.CareOfEmId='-1'
this.$refs.tree.setCheckedKeys([]);
},
closePicLayer(){
this.dspNone=true
},
getPic(obj){
this.picObj=obj
this.dspNone=false;
},
filterNode(value, data) {
if (!value) return true;
return data.DepartmentName.indexOf(value) !== -1;
},
openDialog(IsAgree,workFlowId,templateType){
this.agree=IsAgree
this.dialogTitle='审批流程'
this.outerVisible=true;
this.workFlowId=workFlowId;
this.templateType=templateType;
},
transferDialog(workFlowId,templateType){
this.dialogTitle1='转交流程'
this.outerVisible1=true;
this.workFlowId=workFlowId;
this.templateType=templateType;
this.apipost('WorkFlow_get_GetDepartMentEmployee', {}, res => {
if(res.data.resultCode == 1) {
this.memberList = res.data.data
}
}, err => {})
},
clearTransferDialog(){
this.filterText=''
this.transferMsg.WorkFlowId=''
this.transferMsg.TemplateType=''
this.transferMsg.Description=''
this.transferMsg.CareOfEmId='-1'
this.$refs.tree.setCheckedKeys([]);
},
handleNodeChange(data,checked, node){
if(checked){
if(data.DepartmentId!=0){
this.arr.push(data.DepartmentId)
this.$refs.tree.setCheckedKeys([data.DepartmentId]);
this.transferMsg.CareOfEmId=data.DepartmentId;
}
}else{
if(this.arr.length==1){
this.arr=[]
this.transferMsg.CareOfEmId='-1'
}else{
this.arr=this.arr.slice(this.arr.length-1)
this.transferMsg.CareOfEmId=this.arr[this.arr.length-1]
}
}
},
transferApproval(){
this.transferMsg.WorkFlowId=this.workFlowId
this.transferMsg.TemplateType=this.templateType
if(this.transferMsg.CareOfEmId=='-1')
{
this.$message.warning('请选择转交人!')
return
}
this.apipost('WorkFlow_post_SetCareOf',this.transferMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible1=false;
this.getList()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
agreeApproval(){
this.appMsg.WorkFlowId=this.workFlowId
this.appMsg.TemplateType=this.templateType
this.apipost('WorkFlow_post_SetConsent',this.appMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible=false;
this.getList()
this.btnClearDialogMsg()
this.closeLayer()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
rejectApproval(){
this.appMsg.WorkFlowId=this.workFlowId
this.appMsg.TemplateType=this.templateType
this.apipost('WorkFlow_post_SetNotConsent',this.appMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible=false;
this.getList()
this.btnClearDialogMsg()
this.closeLayer()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
withdrawAapproval(workFlowId,templateType){
this.$confirm('是否撤回?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.apipost('app_user_workflow_wndoaudit',{workFlowId:workFlowId,templateType:templateType},res=>{
if(res.data.resultCode == 1) {
this.$message.success('撤回成功。')
this.getList()
}
},err=>{})
}).catch(() => {
this.$message.info('已取消撤回。')
});
},
updateAapproval(path,cmd,submitCmd,workFlowId,templateId){
this.$router.push({ name: path, query:{cmd:cmd,submitCmd:submitCmd,workFlowId:workFlowId,templateId:templateId}})
},
toArr(val){
let arr=[]
if(val!="[]")
{
val.substring(1,val.length-1).split(',').forEach(item=>{
arr.push(item.substring(1,item.length-1))
});
}
return arr;
},
getDetail(id,type){
this.showLayer();
this.apipost('app_user_workflow_GetAuditInfo',{WorkFlowId:id,TemplateType:type},res=>{
if(res.data.resultCode == 1) {
this.detailList=res.data.data
this.IsAudit=res.data.data.IsAudit
this.IsCancel=res.data.data.IsCancel
this.IsUpdate=res.data.data.IsUpdate
}
},err=>{})
},
getList(){
this.loading=true;
this.apipost('app_user_workflow_my_initiateaudit',this.msg,res=>{
if(res.data.resultCode == 1) {
this.list=res.data.data.pageData;
this.total=res.data.data.count;
this.loading=false
}
},err=>{})
},
getApplyType(){ //模板类型
this.apipost('app_user_workflow_get_templatetype',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.ApplyTypeList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
getAppAuditStatus(){
this.apipost('app_user_workflow_get_myinitiate_auditstatus',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.appAuditStatusList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
showLayer() {
this.showlayer = true;
this.isTransition = true;
},
closeLayer() {
let _this = this;
setTimeout(function() {
_this.showlayer = false;
}, 300)
this.isTransition = false;
},
goUrl (path,id) {
this.$router.push({ path: path})
}
},
mounted() {
this.getList()
this.getApplyType()
this.getAppAuditStatus()
}
}
</script>
<style>
@import "../financial/css/cssReset.css";
.appListparent{ overflow-x: auto;}
.appListparent::-webkit-scrollbar{/*滚动条整体样式*/width: 4px;/*高宽分别对应横竖滚动条的尺寸*/height: 8px;}
.appListparent::-webkit-scrollbar-thumb{/*滚动条里面小方块*/border-radius: 4px;-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);background: #c9c9c9;}
.appListparent::-webkit-scrollbar-track{/*滚动条里面轨道*/-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #EDEDED;}
.forMyApprovalProcess {
background: #f8f8f8;
max-height: 400px;
overflow-y: auto;
}
.auditItemImgList{}
.auditItemImgList>img{width: 48px; height: 48px; border-radius: 4px; margin:8px 0 8px 10px;}
.auditItemDetailtitle{}
.auditItemDetailtitle>img{float: left; border-radius: 16px; margin: 0 10px 0 0;}
.auditItemDetailtitle>span{line-height: 32px;}
.forMyApprovalLayer{position: fixed; z-index: 99; background: rgba(0,0,0,.2); width: 100%; height: 100%; left: 0; top: 0;}
.forMyApprovalLayercontentDiv{width: 400px; background: #fff; height: 100%; overflow: auto; top: 0; right:-400px; position: fixed;box-shadow: 4px 0px 10px rgba(0, 0, 0, 0.1);transition: right .5s;}
.forMyApprovalLayer .rightZero{right: 0px;}
.forMyApprovalLayercontentDiv .title{height: 48px; background: #EDEEF0; line-height: 48px; font-size:16px; color: #333; text-indent: 30px;}
.forMyApprovalLayercontentDiv .user{width: 340px; margin: 0 30px; border-bottom: 1px solid #E6E6E6; height: 60px; padding: 30px 0; box-sizing: content-box}
.forMyApprovalLayercontentDiv .user>p{line-height: 28px;}
.forMyApprovalLayercontentDiv .user>img{width:58px; height: 58px; border-radius: 29px; float: left; margin:0 12px 0 0;}
.forMyApprovalLayercontentDiv .detail{width: 340px; margin: 0 30px; padding: 25px 0; border-bottom: 1px solid #E6E6E6; min-height: 120px;}
.forMyApprovalLayercontentDiv .audit{width: 340px; margin: 30px 30px 0; padding-bottom: 10px; min-height: 120px; border-bottom: 1px solid #E6E6E6;}
.forMyApprovalLayercontentDiv .audit .auditItem{min-height: 80px; width: 320px; margin-left: 20px; border-left:1px solid #EDEDED; position: relative; font-size: 14px;}
.forMyApprovalLayercontentDiv .audit .auditItem:last-child{border-left: none;}
.forMyApprovalLayercontentDiv .audit .auditItem>p{line-height: 40px;text-indent: 40px;}
.forMyApprovalLayercontentDiv .audit .auditItem>img{width: 40px; height: 40px; border-radius: 20px; position: absolute; left: -20px;}
.forMyApprovalLayercontentDiv .send{width: 340px; margin: 30px 30px 0; min-height: 120px;}
.forMyApprovalLayercontentDiv .send .sentTitle{height: 14px; line-height: 14px; text-indent:10px; border-left:3px solid #E95252; font-size: 14px;}
.forMyApprovalLayercontentDiv .send .sentTitle span{color: #666; margin-left: 20px;}
.forMyApprovalLayercontentDiv .send .sendList>div{float: left; margin: 10px 10px 0 0; font-size: 12px; color: #666; width: 40px; text-align: center;}
.forMyApprovalLayercontentDiv .send .sendList>div>img{width: 40px; height: 40px; border-radius: 20px;}
.forMyApprovalLayercontentDiv .myApprovalTable tr{height: 40px; font-size: 14px;}
.forMyApprovalLayercontentDiv .myApprovalTable tr td:nth-child(1){text-align: right; color: #666;}
.forMyApprovalLayerBtn{position: fixed; bottom: 0; background: #fff; width: 100%; height: 40px; line-height: 40px; padding: 0 30px; border-top:1px solid #F0F3FA}
.forMyApprovalLayerBtn input{margin-right: 10px;}
.myApprovalMenu{width: 100%; height: 40px; text-align: center; line-height: 40px; background: #fff; border-radius: 4px; margin: 30px 0;}
.myApprovalMenu li{float: left; width:25%; font-size: 14px; color: #666; cursor: pointer;}
.myApprovalMenu li:hover{border-bottom: 2px solid #E95252;}
.myApprovalMenu li.cked{border-bottom: 2px solid #E95252; font-size: 16px; color:#E95252;}
.forMyApprovalTable{width: 100%; min-width: 1600px; height: 38px;}
.forMyApprovalTable li{float: left; width: 20%; height: 38px; line-height: 38px; font-size: 14px; text-indent: 20px;background: #EDEDED; font-family: PingFangSC-Semibold !important;}
.forMyApprovalItem{width: 100%; min-width: 1600px; min-height:80px; padding: 20px 0; background: #fff; border-bottom:1px solid #f9f9f9; overflow: hidden;}
.forMyApprovalItem li{float:left; width: 20%; height: 100%; font-size: 14px; text-indent: 20px;}
.forMyApprovalItem li>p{line-height: 24px; color: #666;}
.forMyApprovalItem:hover{box-shadow:0px 0px 10px rgba(191,191,191,1);transition: all linear 0.3s; position: relative; z-index: 5;}
.forMyApprovalItem li>img{float: left; width: 40px; height: 40px; border-radius: 20px; margin: 0 10px 20px 30px;}
</style>
<template>
<div class="flexOne">
<div class="myApprovalMenu">
<li :class="{cked:liCkedIndex==1}" @click="goUrl('myApproval')">发起审批</li>
<li :class="{cked:liCkedIndex==2}" @click="goUrl('forMyApproval')">我的审批</li>
<li :class="{cked:liCkedIndex==3}" @click="goUrl('myApprovalList')">我发起的</li>
<li :class="{cked:liCkedIndex==4}">抄送我的</li>
</div>
<div class="query-box" style="border-bottom: none;">
<ul>
<li>
<span><em>关键字</em><el-input class='w210' v-model="msg.searchKey" placeholder="请输入申请人" @keyup.enter.native="getList"></el-input></span>
</li>
<li>
<span><em>审批类型</em><el-select v-model='msg.applyType'>
<el-option v-for='item in ApplyTypeList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li>
<span><em>申请审核状态</em><el-select v-model='msg.appAuditStatus'>
<el-option v-for='item in appAuditStatusList' :label='item.label' :value='item.value' :key='item.value'></el-option>
</el-select></span>
</li>
<li>
<span><em>阅读状态</em><el-select v-model='msg.readeType'>
<el-option label='全部' value='0'></el-option>
<el-option label='未读' value='1'></el-option>
</el-select>
</span>
</li>
<li style="top:-155px!important"><input type="button" class="hollowFixedBtn" value="查询" @click="resetPageIndex(),getList()"/></li>
</ul>
</div>
<div class="appListparent" v-loading='loading'>
<div class="forMyApprovalTable">
<li>审批标题</li>
<li>搜索简要</li>
<li>发起时间</li>
<li>状态</li>
<li>操作</li>
</div>
<div class="forMyApprovalItem" v-for="(item,index) in list">
<li><img :src="item.userPhoto">
<span>{{item.title}}</span>
</li>
<li>
<p v-for="item in list[index].detial">{{item}}</p>
</li>
<li>
<p><i class="iconfont icon-img-rili"></i>
{{item.createTime}}</p></li>
<li>{{item.auditStatusStrt}}</li> <!-- 阅读状态{{item.readStaut}}-->
<li><input type="button" class="hollowFixedBtn" value="详情" @click="getDetail(item.workFlowId,item.templateType)"></li>
</div>
<el-pagination background
@current-change="handleCurrentChange"
:current-page.sync="currentPage"
layout="total,prev, pager, next, jumper"
:page-size=msg.pageSize
:total=total>
</el-pagination>
</div>
<div :class="{forMyApprovalLayer:showlayer}" @click="closeLayer">
<div :class="{forMyApprovalLayercontentDiv:true,rightZero:isTransition}" @click.stop>
<div class="title">{{detailList.Proposer}}{{detailList.TempleteTypeName}}</div>
<div class="user">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>{{detailList.Proposer}}</p>
<p><span style="color:#257BF1; font-size: 14px;">{{detailList.Status}}</span></p>
</div>
<div class="detail">
<table border="0" cellspacing="0" cellpadding="0" class="myApprovalTable">
<tr v-for="(item,index) in detailList.Details" v-if="(item.formType=='Image' && item.value.length>0) || item.formType!='Image'">
<td width="80" >{{item.title}}</td>
<td v-if="item.formType=='String'">{{item.value}}</td>
<td v-if="item.formType=='Json'">
<div v-for="(i,index) in item.value" style="border-bottom: 1px solid #ccc; padding:10px 0;">
<p style="line-height: 24px;" v-for="o in i">{{o.title}}{{o.value}}</p>
</div>
</td>
<td v-if="item.formType=='Image'">
<img v-if='item.value.length>0' style="width: 50px; height: 50px; border-radius: 4px; margin:0 10px 0 0;" v-for="(img,index) in item.value" :src="img"
@click="getPic(item.value)"/>
</td>
</tr>
</table>
</div>
<div class="audit">
<div class="auditItem">
<img v-if="!detailList.ProposerPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="detailList.ProposerPhoto" alt="" :onerror="defaultImg">
<p>
<span>{{detailList.Proposer}}</span>&nbsp;&nbsp;<span>发起申请</span><span class="fr">{{detailList.ProposerTime}}</span>
</p>
</div>
<div class="auditItem" v-for="(item,index) in detailList.arList">
<img v-if='item.AuditRecordList.length==1&&!item.AuditRecordList[0].AuditEmPhoto' src="../../assets/images/administration/litheader.png" />
<img v-if='item.AuditRecordList.length==1&&item.AuditRecordList[0].AuditEmPhoto' :src='item.AuditRecordList[0].AuditEmPhoto' alt="" :onerror="defaultImg" />
<img v-if='item.AuditRecordList.length>1' src="../../assets/images/administration/bg_z1@2x.png" />
<p v-if='item.AuditRecordList.length==1'>
<span>{{item.AuditRecordList[0].AuditEmName}}</span>
<span :style="'color: ' + item.AuditRecordList[0].StatusColor + ' !important'">{{item.AuditRecordList[0].Stauts}}</span>
<span class="fr">{{item.AuditRecordList[0].AuditTime}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{item.AuditRecordList[0].Description}}</span>
<span v-if="item.AuditRecordList[0].CareOfList!=null" style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{item.AuditRecordList[0].CareOfList[0].BeFrom}} <b style="color: red;"></b> {{item.AuditRecordList[0].CareOfList[0].Target}}
<br/>
{{item.AuditRecordList[0].CareOfList[0].Remarks}}
</span>
</p>
<div class="auditItemImgList" style="padding-left: 30px;">
<img v-for='img in toArr(item.AuditRecordList[0].Image)' :src="img" @click="getPic(toArr(item.AuditRecordList[0].Image))"/>
</div>
<p v-if='item.AuditRecordList.length>1' style="cursor: pointer;">
<span>{{item.AuditDescription}}{{item.AuditWay}}</span>
<i class="el-icon-arrow-right"></i>
</p>
<div v-if='item.AuditRecordList.length>1' style=" width: 300px; height: auto; margin:15px 0; border-radius: 4px; background: #F0F3FA;">
<p v-if='item.AuditWayStatus==2' style="padding: 10px; color: #666;">须以下人员全部审批通过</p>
<p v-if='item.AuditWayStatus==3' style="padding: 10px; color: #666;">以下人员大于等于一人审批通过即可</p>
<div v-for="i in item.AuditRecordList">
<p class="auditItemDetailtitle">
<img width="28" height="28" v-if="!i.AuditEmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img width="28" height="28" v-else :src="i.AuditEmPhoto" alt="" :onerror="defaultImg">
<span>{{i.AuditEmName}}</span>
<span :style="'color: ' + i.StatusColor + ' !important'">{{i.Stauts}}</span>
<span style="display:block; padding-left: 40px; text-indent: 0; font-size: 12px; line-height: 24px; color: #333;">{{i.Description}}</span>
<span v-if='i.CareOfList!=null' style="display: inline-block; line-height: 24px; font-size: 12px; text-indent: 0; padding-left:40px; color: #666;">
<b style="color: red;"></b>{{i.CareOfList[0].BeFrom}} <b style="color: red;"></b> {{i.CareOfList[0].Target}}
<br/>
{{i.CareOfList[0].Remarks}}
</span>
</p>
<div class="auditItemImgList" v-if="toArr(i.Image).length>0">
<img v-for='img in toArr(i.Image)' :src="img" @click="getPic(toArr(i.Image))"/>
</div>
</div>
</div>
</div>
</div> <!--audit end-->
<div class="send" v-if="detailList.AuditStatus==5"> <!--v-if="detailList.AuditStatus==5"-->
<p class="sentTitle">抄送<span>审批通过后,通知抄送人</span></p>
<div class="sendList">
<div v-for="(item,index) in detailList.CopyToPeopleList">
<img v-if="!item.EmPhoto" src="../../assets/images/administration/litheader.png" alt="">
<img v-else :src="item.EmPhoto" alt="" :onerror="defaultImg">
<br/>
{{item.EmName}}
</div>
</div>
</div> <!--send end-->
<div style="height: 50px; width: 100%;"><!--空白暂位,防止下面漂浮按钮遮挡内容--></div>
<div class="forMyApprovalLayerBtn">
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="同意" @click="openDialog(IsAgree=true,detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="不同意" @click="openDialog(IsAgree=false,detailList.WorkFlowId,detailList.TemplateType)" />
<input v-if="IsAudit==1" type="button" class="hollowbtn" value="转交" @click="transferDialog(detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsCancel==1" type="button" class="hollowbtn" value="撤回" @click="withdrawAapproval(detailList.WorkFlowId,detailList.TemplateType)"/>
<input v-if="IsUpdate==1&&detailList.TemplateType!=4" type="button" class="hollowbtn"
value="修改" @click="updateAapproval('leaveApproval',detailList.Cmd,detailList.SubmitCmd,detailList.WorkFlowId,detailList.TempleteId)"/>
</div>
</div>
</div>
<el-dialog custom-class='w500' :title="dialogTitle" :visible.sync="outerVisible" center before-close="clearDialogMsg">
<table class="layerTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>审批意见</td>
<td>
<el-input type='textarea' v-model='appMsg.Description'></el-input>
</td>
</tr>
<tr>
<td>图片</td>
<td>
<el-upload
:file-list="fileList"
:http-request="uploadTest"
:multiple="true"
:limit="9"
list-type="picture-card"
:on-remove="handleRemove"
:on-exceed="handleExceed"
action="">
<i class="el-icon-plus"></i>
</el-upload>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="btnClearDialogMsg">取 消</button> &nbsp;
<button v-if='agree' class="normalBtn" type="primary" @click="agreeApproval">确定同意</button>
<button v-if='!agree' class="normalBtn" type="primary" @click="rejectApproval">确定不同意</button>
</div>
</el-dialog>
<el-dialog custom-class='w500' :title="dialogTitle1" :visible.sync="outerVisible1" center :before-close="clearTransferDialog">
<table class="layerTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="80" align="right">转交备注:</td>
<td>
<el-input type='textarea' v-model='transferMsg.Description'></el-input>
</td>
</tr>
<tr>
<td width="80" align="right">姓名搜索:</td>
<td >
<el-input class='w200' placeholder="请输入姓名关键字" v-model="filterText"></el-input>
</td>
</tr>
<tr>
<td colspan="2">
<el-tree class='forMyApprovalProcess'
:data="memberList"
:props="defaultProps"
:filter-node-method="filterNode"
show-checkbox
accordion
@check-change="handleNodeChange"
node-key="DepartmentId"
ref="tree"
check-strictly
>
</el-tree>
</td>
</tr>
</table>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="btnClearTransferDialog">取 消</button> &nbsp;
<button v-if='agree' class="normalBtn" type="primary" @click="transferApproval">确定</button>
</div>
</el-dialog>
<div :class="{viewBigPicLayer:true,viewBigPicLayerDisplayNone:dspNone}" @click="closePicLayer">
<i @click="closePicLayer" class="el-icon-circle-close-outline clolseViewBigPicLayer" ></i>
<el-carousel height="600px" :interval="5000" trigger="click">
<el-carousel-item v-for="(item,index) in picObj" :key="index">
<img :src="item" />
</el-carousel-item>
</el-carousel>
</div>
</div>
</template>
<script>
export default {
data() {
return {
filterText:"",
defaultProps: {
children: 'ChildList',
label: 'DepartmentName',
disabled: "Disabled"
},
fileList:[],
picObj:[],
dspNone:true,
workFlowId:'',
templateType:"",
agree:true,
outerVisible:false,
outerVisible1:false,
dialogTitle:"",
dialogTitle1:"",
IsAudit:'',
IsCancel:'',
IsUpdate:'',
showlayer:false,
isTransition:false,
loading:true,
liCkedIndex:4,
defaultImg: 'this.src="' + require('../../assets/images/administration/litheader.png') + '"',
total:0,
currentPage: 1,
//请求数据
msg:{
readeType:'0',
applyType:0,
pageIndex:1,
pageSize:5,
searchKey:'',
appAuditStatus:0,
},
appMsg:{
WorkFlowId:'',
TemplateType:'',
Description:'',
Image:[],
},
transferMsg:{
WorkFlowId:'',
TemplateType:'',
Description:'',
CareOfEmId:'-1',
},
//返回数据
list:[],
ApplyTypeList:[],
appAuditStatusList:[],
memberList:[],
detailList:{},
arr:[],
}
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
}
},
methods: {
uploadTest(file){ //上传
let newArr=[];
newArr.push(file.file)
let path="/Upload/Temporary/"
this.UploadSelfFileT(path,newArr,x=>{
let url = this.domainManager().ViittoFileUrl + x.data.FilePath
this.appMsg.Image.push(url)
this.fileList.push({url: url})
});
},
handleRemove(file){ //删除
this.fileList.forEach((item,index)=>{
if(item.url==file.url)
{
this.fileList.splice(index,1)
}
})
this.appMsg.Image.forEach((item,index)=>{
if(item==file.url)
{
this.appMsg.Image.splice(index,1)
}
})
},
handleExceed(files, fileList) {
this.$message.warning('最多只能上传9张图片!');
},
clearDialogMsg(done){
done()
this.appMsg.Description=''
// this.appMsg.Image=[]
},
btnClearDialogMsg(){
this.outerVisible=false
this.appMsg.Description=''
},
btnClearTransferDialog(done){
this.outerVisible1=false
this.filterText=''
this.transferMsg.WorkFlowId=''
this.transferMsg.TemplateType=''
this.transferMsg.Description=''
this.transferMsg.CareOfEmId='-1'
this.$refs.tree.setCheckedKeys([]);
},
closePicLayer(){
this.dspNone=true
},
getPic(obj){
this.picObj=obj
this.dspNone=false;
},
filterNode(value, data) {
if (!value) return true;
return data.DepartmentName.indexOf(value) !== -1;
},
openDialog(IsAgree,workFlowId,templateType){
this.agree=IsAgree
this.dialogTitle='审批流程'
this.outerVisible=true;
this.workFlowId=workFlowId;
this.templateType=templateType;
},
transferDialog(workFlowId,templateType){
this.dialogTitle1='转交流程'
this.outerVisible1=true;
this.workFlowId=workFlowId;
this.templateType=templateType;
this.apipost('WorkFlow_get_GetDepartMentEmployee', {}, res => {
if(res.data.resultCode == 1) {
this.memberList = res.data.data
}
}, err => {})
},
clearTransferDialog(){
this.filterText=''
this.transferMsg.WorkFlowId=''
this.transferMsg.TemplateType=''
this.transferMsg.Description=''
this.transferMsg.CareOfEmId='-1'
this.$refs.tree.setCheckedKeys([]);
},
handleNodeChange(data,checked, node){
if(checked){
if(data.DepartmentId!=0){
this.arr.push(data.DepartmentId)
this.$refs.tree.setCheckedKeys([data.DepartmentId]);
this.transferMsg.CareOfEmId=data.DepartmentId;
}
}else{
if(this.arr.length==1){
this.arr=[]
this.transferMsg.CareOfEmId='-1'
}else{
this.arr=this.arr.slice(this.arr.length-1)
this.transferMsg.CareOfEmId=this.arr[this.arr.length-1]
}
}
},
transferApproval(){
this.transferMsg.WorkFlowId=this.workFlowId
this.transferMsg.TemplateType=this.templateType
if(this.transferMsg.CareOfEmId=='-1')
{
this.$message.warning('请选择转交人!')
return
}
this.apipost('WorkFlow_post_SetCareOf',this.transferMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible1=false;
this.getList()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
agreeApproval(){
this.appMsg.WorkFlowId=this.workFlowId
this.appMsg.TemplateType=this.templateType
this.apipost('WorkFlow_post_SetConsent',this.appMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible=false;
this.getList()
this.btnClearDialogMsg()
this.closeLayer()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
rejectApproval(){
this.appMsg.WorkFlowId=this.workFlowId
this.appMsg.TemplateType=this.templateType
this.apipost('WorkFlow_post_SetNotConsent',this.appMsg,res=>{
if(res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.outerVisible=false;
this.getList()
this.btnClearDialogMsg()
this.closeLayer()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
withdrawAapproval(workFlowId,templateType){
this.$confirm('是否撤回?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.apipost('app_user_workflow_wndoaudit',{workFlowId:workFlowId,templateType:templateType},res=>{
if(res.data.resultCode == 1) {
this.$message.success('撤回成功。')
this.getList()
}
},err=>{})
}).catch(() => {
this.$message.info('已取消撤回。')
});
},
updateAapproval(path,cmd,submitCmd,workFlowId,templateId){
this.$router.push({ name: path, query:{cmd:cmd,submitCmd:submitCmd,workFlowId:workFlowId,templateId:templateId}})
},
getBigpic(obj){
},
toArr(val){
let arr=[]
if(val!="[]")
{
val.substring(1,val.length-1).split(',').forEach(item=>{
arr.push(item.substring(1,item.length-1))
});
}
return arr;
},
getDetail(id,type){
this.showLayer();
this.apipost('app_user_workflow_GetAuditInfo',{WorkFlowId:id,TemplateType:type},res=>{
if(res.data.resultCode == 1) {
this.detailList=res.data.data
this.IsAudit=res.data.data.IsAudit
this.IsCancel=res.data.data.IsCancel
this.IsUpdate=res.data.data.IsUpdate
}
},err=>{})
},
getList(){
this.loading=true;
this.apipost('app_user_workflow_copy_tomyaudit',this.msg,res=>{
if(res.data.resultCode == 1) {
this.list=res.data.data.pageData;
this.total=res.data.data.count;
this.loading=false
}
},err=>{})
},
getApplyType(){ //模板类型
this.apipost('app_user_workflow_get_templatetype',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.ApplyTypeList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
getAppAuditStatus(){
this.apipost('app_user_workflow_get_myinitiate_auditstatus',{},res=>{
if(res.data.resultCode == 1) {
res.data.data.forEach(item=>{
for(let key in item){
if (item.hasOwnProperty(key)){
this.appAuditStatusList.push({label:key,value:item[key]})
}
}
})
}
},err=>{})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
showLayer() {
this.showlayer = true;
this.isTransition = true;
},
closeLayer() {
let _this = this;
setTimeout(function() {
_this.showlayer = false;
}, 300)
this.isTransition = false;
},
goUrl (path,id) {
this.$router.push({ path: path})
}
},
mounted() {
this.getList()
this.getApplyType()
this.getAppAuditStatus()
}
}
</script>
<style>
@import "../financial/css/cssReset.css";
.appListparent{ overflow-x: auto;}
.appListparent::-webkit-scrollbar{/*滚动条整体样式*/width: 4px;/*高宽分别对应横竖滚动条的尺寸*/height: 8px;}
.appListparent::-webkit-scrollbar-thumb{/*滚动条里面小方块*/border-radius: 4px;-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);background: #c9c9c9;}
.appListparent::-webkit-scrollbar-track{/*滚动条里面轨道*/-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #EDEDED;}
.forMyApprovalProcess {
background: #f8f8f8;
max-height: 400px;
overflow-y: auto;
}
.auditItemImgList{}
.auditItemImgList>img{width: 48px; height: 48px; border-radius: 4px; margin:8px 0 8px 10px;}
.auditItemDetailtitle{}
.auditItemDetailtitle>img{float: left; border-radius: 16px; margin: 0 10px 0 0;}
.auditItemDetailtitle>span{line-height: 32px;}
.forMyApprovalLayer{position: fixed; z-index: 99; background: rgba(0,0,0,.2); width: 100%; height: 100%; left: 0; top: 0;}
.forMyApprovalLayercontentDiv{width: 400px; background: #fff; height: 100%; overflow: auto; top: 0; right:-400px; position: fixed;box-shadow: 4px 0px 10px rgba(0, 0, 0, 0.1);transition: right .5s;}
.forMyApprovalLayer .rightZero{right: 0px;}
.forMyApprovalLayercontentDiv .title{height: 48px; background: #EDEEF0; line-height: 48px; font-size:16px; color: #333; text-indent: 30px;}
.forMyApprovalLayercontentDiv .user{width: 340px; margin: 0 30px; border-bottom: 1px solid #E6E6E6; height: 60px; padding: 30px 0; box-sizing: content-box}
.forMyApprovalLayercontentDiv .user>p{line-height: 28px;}
.forMyApprovalLayercontentDiv .user>img{width:58px; height: 58px; border-radius: 29px; float: left; margin:0 12px 0 0;}
.forMyApprovalLayercontentDiv .detail{width: 340px; margin: 0 30px; padding: 25px 0; border-bottom: 1px solid #E6E6E6; min-height: 120px;}
.forMyApprovalLayercontentDiv .audit{width: 340px; margin: 30px 30px 0; min-height: 120px; border-bottom: 1px solid #E6E6E6;}
.forMyApprovalLayercontentDiv .audit .auditItem{min-height: 80px; width: 320px; margin-left: 20px; border-left:1px solid #EDEDED; position: relative; font-size: 14px;}
.forMyApprovalLayercontentDiv .audit .auditItem:last-child{border-left: none;}
.forMyApprovalLayercontentDiv .audit .auditItem>p{line-height: 40px;text-indent: 40px;}
.forMyApprovalLayercontentDiv .audit .auditItem>img{width: 40px; height: 40px; border-radius: 20px; position: absolute; left: -20px;}
.forMyApprovalLayercontentDiv .send{width: 340px; margin: 30px 30px 0; min-height: 120px;}
.forMyApprovalLayercontentDiv .send .sentTitle{height: 14px; line-height: 14px; text-indent:10px; border-left:3px solid #E95252; font-size: 14px;}
.forMyApprovalLayercontentDiv .send .sentTitle span{color: #666; margin-left: 20px;}
.forMyApprovalLayercontentDiv .send .sendList>div{float: left; margin: 10px 10px 0 0; font-size: 12px; color: #666; width: 40px; text-align: center;}
.forMyApprovalLayercontentDiv .send .sendList>div>img{width: 40px; height: 40px; border-radius: 20px;}
.forMyApprovalLayercontentDiv .myApprovalTable tr{height: 40px; font-size: 14px;}
.forMyApprovalLayercontentDiv .myApprovalTable tr td:nth-child(1){text-align: right; color: #666;}
.forMyApprovalLayerBtn{position: fixed; bottom: 0; background: #fff; width: 100%; height: 40px; line-height: 40px; padding: 0 30px; border-top:1px solid #F0F3FA}
.forMyApprovalLayerBtn input{margin-right: 10px;}
.myApprovalMenu{width: 100%; height: 40px; text-align: center; line-height: 40px; background: #fff; border-radius: 4px; margin: 30px 0;}
.myApprovalMenu li{float: left; width:25%; font-size: 14px; color: #666; cursor: pointer;}
.myApprovalMenu li:hover{border-bottom: 2px solid #E95252;}
.myApprovalMenu li.cked{border-bottom: 2px solid #E95252; font-size: 16px; color:#E95252;}
.forMyApprovalTable{width: 100%; min-width: 1600px; height: 38px;}
.forMyApprovalTable li{float: left; width: 20%; height: 38px; line-height: 38px; font-size: 14px; text-indent: 20px;background: #EDEDED; font-family: PingFangSC-Semibold !important;}
.forMyApprovalItem{width: 100%; min-width: 1600px; min-height:80px; padding: 20px 0; background: #fff; border-bottom:1px solid #f9f9f9; overflow: hidden;}
.forMyApprovalItem li{float:left; width: 20%; height: 100%; font-size: 14px; text-indent: 20px;}
.forMyApprovalItem li>p{line-height: 24px; color: #666;}
.forMyApprovalItem:hover{box-shadow:0px 0px 10px rgba(191,191,191,1);transition: all linear 0.3s; position: relative; z-index: 5;}
.forMyApprovalItem li>img{float: left; width: 40px; height: 40px; border-radius: 20px; margin: 0 10px 20px 30px;}
</style>
......@@ -356,6 +356,35 @@ const routes = [{
component: () =>
import("pages/administration/updateProcessDesign.vue")
},
{
path: "/administration/myApprovalList", //我的审批
component: () =>
import("pages/administration/myApprovalList.vue")
},
{
path: "/administration/myApproval", //我的发起
component: () =>
import("pages/administration/myApproval.vue")
},{
path: "/administration/forMyApproval", //我的审批
component: () =>
import("pages/administration/forMyApproval.vue")
},
{
path: "/administration/ApprovalStatistical", //审批统计
component: () =>
import("pages/administration/ApprovalStatistical.vue")
},
{
path: "/administration/sendToMeApproval", //抄送
component: () =>
import("pages/administration/sendToMeApproval.vue")
},
{
path: "/administration/leaveApproval", //请假
component: () =>
import("pages/administration/leaveApproval.vue")
},
{
path: "/sale/japaneseTrain", //日语培训列表
component: () =>
......
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