You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
347 lines
9.1 KiB
347 lines
9.1 KiB
<template> |
|
<view> |
|
<mescroll-body :sticky="true" ref="mescrollRef" @init="mescrollInit" @down="downCallback"> |
|
<!-- sticky吸顶悬浮的菜单, 父元素必须是 mescroll --> |
|
<view class="sticky-tabs"> |
|
<me-tabs v-model="tabIndex" :tabs="tabs" @change="tabChange"></me-tabs> |
|
</view> |
|
|
|
<view class="flex-around mat15 pick-border"> |
|
<view> |
|
<picker @change="searchDaysChange" :value="createFixedTimeVal" :range="searchDays" :range-key="'name'"> |
|
<view class=""> |
|
<text>{{createFixedTimeVal ? searchDays[createFixedTimeVal].name : '请选择时间'}}</text> |
|
</view> |
|
</picker> |
|
</view> |
|
<view> |
|
<!-- <picker mode="date" :value="flowDatesSelect" @change="relatedtimeChange"> |
|
<view class=""> |
|
<text>{{flowDatesSelect ? flowDatesSelect : '请选择时间范围'}}</text> |
|
|
|
</view> |
|
</picker> --> |
|
<text v-if="startTime == ''" type="primary" @click="onShowDatePicker('range')">选择日期范围</text> |
|
<text v-else @click="onShowDatePicker('range')">{{startTime}} — {{endTime}}</text> |
|
</view> |
|
<view> |
|
<picker @change="departmentChange" :value="departmentIdVal" :range="departmentList" :range-key="'name'"> |
|
<view class=""> |
|
<text>{{departmentIdVal ? departmentList[departmentIdVal].name : '请选择部门'}}</text> |
|
</view> |
|
</picker> |
|
</view> |
|
</view> |
|
|
|
<view> |
|
<view v-for="(item,index) in list" :key="index"> |
|
<view class="good-list"> |
|
<view class="charge" :id="'index-' + item.name" :data-index="item.name"> |
|
<view class="charge-title flex-between"> |
|
<text>{{item.name}}</text> |
|
</view> |
|
<view class="charge-text" v-for="(item,index) in item.nodeList" :key="index"> |
|
<view> |
|
<text class="label-text">节点：</text> |
|
<text class="mgl30">{{item.depName}}</text> |
|
</view> |
|
<view> |
|
<text class="label-text">累计耗时/天：</text> |
|
<text class="mgl30">{{item.name}}</text> |
|
</view> |
|
<view> |
|
<text class="label-text">审批次数：</text> |
|
<text class="mgl30">{{item.number}}次</text> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</mescroll-body> |
|
<mx-date-picker :show="showPicker" :type="type" |
|
:value="value" :show-tips="true" :begin-text="'开始'" :end-text="'结束'" |
|
:show-seconds="true" @confirm="onSelected" @cancel="onSelected" @reset="onReset"/> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"; |
|
import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue"; |
|
export default { |
|
mixins: [MescrollMixin], // 使用mixin |
|
components: { |
|
MxDatePicker |
|
}, |
|
data() { |
|
return { |
|
showPicker: false, |
|
date: '2019/01/01', |
|
time: '15:00:12', |
|
datetime: '2019/01/01 15:00:12', |
|
range: [], |
|
type: 'rangetime', |
|
value: '', |
|
|
|
tabs:[ |
|
{name:'全部', value: ''}, |
|
{name:'已撤销', value: 0}, |
|
{name:'进行中', value: 1}, |
|
{name:'已完成', value: 2}, |
|
{name:'已否决', value: 3} |
|
], |
|
tabIndex: 0, // 当前菜单下标 |
|
totals: 0, |
|
page: { |
|
num: 1, |
|
size: 10, |
|
}, |
|
|
|
searchDays:[ |
|
{ value: '', name: '不限' }, |
|
{ value: 0, name: '今天' }, |
|
{ value: 1, name: '昨天' }, |
|
{ value: 2, name: '本周' }, |
|
{ value: 3, name: '本月' }, |
|
{ value: 4, name: '本年' }, |
|
], |
|
list: [], |
|
departmentList: [], |
|
depMatching: [], |
|
chartsData: [], |
|
chartsName: [], |
|
|
|
createFixedTimeVal: '', |
|
createFixedTime:'', |
|
departmentIdVal: '', |
|
departmentId:'', |
|
startTime:'', |
|
endTime:'', |
|
flowStatus:'' |
|
}; |
|
}, |
|
mounted() { |
|
this.listDepartment() |
|
this.businessCount() |
|
}, |
|
methods: { |
|
onShowDatePicker(type){//显示 |
|
this.type = type; |
|
this.showPicker = true; |
|
this.value = this[type]; |
|
}, |
|
onSelected(e) {//选择 |
|
this.showPicker = false; |
|
if(e) { |
|
this[this.type] = e.value; |
|
//选择的值 |
|
this.startTime = this.range[0].replace(/\//g, "-") |
|
this.endTime = this.range[1].replace(/\//g, "-") |
|
this.getData() |
|
} |
|
}, |
|
onReset(){ |
|
this.showPicker = false; |
|
this.range = [] |
|
this.startTime = '' |
|
this.endTime = '' |
|
this.getData() |
|
}, |
|
searchDaysChange(e){ |
|
this.createFixedTimeVal = e.detail.value |
|
this.createFixedTime = this.searchDays[e.detail.value].value |
|
this.getData() |
|
}, |
|
|
|
relatedtimeChange(e) { |
|
this.startTime = e.detail.value |
|
this.getData() |
|
}, |
|
|
|
departmentChange(e){ |
|
this.departmentIdVal = e.detail.value |
|
this.departmentId = this.departmentList[+e.detail.value].id |
|
this.getData() |
|
}, |
|
|
|
// 部门数据 |
|
async listDepartment(){ |
|
let res= await this.$http.get('/api-hrms/hrms/dept/listDepartment') |
|
this.departmentList = res.data |
|
this.getData() |
|
}, |
|
// 状态数量 |
|
async businessCount(){ |
|
let res= await this.$http.get('/api-guarantee/guarantee/efficiency/businessCount') |
|
this.teamStatus = [] |
|
if(res.data && res.data.length !== 0){ |
|
this.teamStatus = res.data |
|
} |
|
}, |
|
getData(){ |
|
this.$http.post('/api-guarantee/guarantee/efficiency/team',{ |
|
createFixedTime: this.createFixedTime, |
|
departmentId: this.departmentId, |
|
startTime: this.startTime, |
|
endTime: this.endTime, |
|
flowStatus: this.flowStatus |
|
}).then(res => { |
|
let obj = Object.keys(res.data); |
|
if(obj.length != 0){ |
|
let valArr = [] |
|
for(let i in res.data){ |
|
if(res.data.length===0) return |
|
let arr = [{ |
|
depName: '业务申请', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '担保部调查', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '资产部调查', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '信息部调查', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '合规调查', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '工作会', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '贷审会', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '担保函', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '回款确认', |
|
number: 0, |
|
name: '0' |
|
}, |
|
{ |
|
depName: '放款通知', |
|
number: 0, |
|
name: '0' |
|
}] |
|
|
|
// 分离出来第几个数组有数据 |
|
// 循环子级，分离数据 |
|
for(let e in res.data[i]){ |
|
// 时间的处理 |
|
arr[e-1].name = this.getDuration(res.data[i][e].slice(0,res.data[i][e].indexOf(','))) |
|
arr[e-1].number = res.data[i][e].slice(res.data[i][e].indexOf(',')+1,res.data[i][e].length) |
|
arr[e-1].depName = this.core.processNode(e) |
|
} |
|
valArr.push(arr) |
|
} |
|
let keyArr = [] |
|
keyArr = Object.keys(res.data) |
|
let newArr = keyArr.map(item => ({id:item})) |
|
for(let i=0;i<newArr.length;i++){ |
|
newArr[i].nodeList = valArr[i] |
|
} |
|
this.departmentList.map(e =>{ |
|
newArr.map(r =>{ |
|
if(e.id == r.id){ |
|
r.name = e.name |
|
} |
|
}) |
|
}) |
|
this.list = newArr |
|
this.mescroll.endErr(); |
|
}else{ |
|
this.mescroll.endErr(); |
|
} |
|
}).catch(()=>{ |
|
}) |
|
}, |
|
/*下拉刷新的回调 */ |
|
downCallback() { |
|
// this.mescroll.resetUpScroll() |
|
this.getData() |
|
}, |
|
// 切换菜单 |
|
tabChange (index) { |
|
this.flowStatus = this.tabs[index].value;//当前下标的值 |
|
this.list = []; // 置空列表,显示加载进度条 |
|
this.getData() |
|
}, |
|
getDuration(my_time) { |
|
let days = my_time / 1000 / 60 / 60 / 24; |
|
let daysRound = Math.floor(days); |
|
let hours = my_time / 1000 / 60 / 60 - (24 * daysRound); |
|
let hoursRound = Math.floor(hours); |
|
let minutes = my_time / 1000 / 60 - (24 * 60 * daysRound) - (60 * hoursRound); |
|
let minutesRound = Math.floor(minutes); |
|
let seconds = my_time / 1000 - (24 * 60 * 60 * daysRound) - (60 * 60 * hoursRound) - (60 * minutesRound); |
|
let timeStr = daysRound + '天'+ hoursRound + '时'+ minutesRound + '分' |
|
// let time = hoursRound + ':' + minutesRound + ':' + seconds // 生成 标准时间格式 |
|
return timeStr; |
|
}, |
|
getTimeNum(my_time){ |
|
let days = my_time / 1000 / 60 / 60 / 24; |
|
let daysRound = Math.floor(days); |
|
let hours = my_time / 1000 / 60 / 60 - (24 * daysRound); |
|
let hoursRound = Math.floor(hours); |
|
let minutes = my_time / 1000 / 60 - (24 * 60 * daysRound) - (60 * hoursRound); |
|
let minutesRound = Math.floor(minutes); |
|
let time = daysRound+(hoursRound / 24)+(minutesRound/60/24) |
|
time.toFixed(2) |
|
// if(time === 0) time = 0.1 |
|
return time |
|
}, |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.cu-bar .search-form{ |
|
border: 2rpx solid #00B9FF; |
|
border-radius: 20rpx; |
|
background-color: #fff; |
|
margin: 0 50rpx; |
|
height: 72rpx; |
|
line-height: 72rpx; |
|
margin-top: 20rpx; |
|
input{ |
|
height: 72rpx; |
|
line-height: 72rpx; |
|
padding: 0 40rpx; |
|
} |
|
.cuIcon-search{ |
|
margin: 0 20rpx; |
|
} |
|
} |
|
.add-customer{ |
|
padding: 0 50rpx; |
|
button{ |
|
background-color: #00B9FF; |
|
border-radius: 30rpx; |
|
.mar-icon{ |
|
margin-right: 10rpx; |
|
} |
|
} |
|
} |
|
.pick-border{ |
|
border-bottom: 8rpx solid #00B9FF; |
|
padding-bottom: 30rpx; |
|
} |
|
</style>
|
|
|