337 lines
6.9 KiB
Vue
337 lines
6.9 KiB
Vue
<template>
|
||
<view :class="['content',{'gray':store.isgray==1}]">
|
||
<uni-data-picker @popupclosed="popclose($event)" :step-searh="false" :map="{text:'departName',value:'id'}"
|
||
:localdata="departList" popup-title="请选择部门" placeholder="请选择部门" @nodeclick="onnodeclick">
|
||
</uni-data-picker>
|
||
<view class="search_box">
|
||
<view class="username f-row aic">
|
||
用户姓名：<input v-model="realname" type="text" placeholder="请输入姓名"
|
||
placeholder-style="color: grey;font-size: 28rpx;">
|
||
</view>
|
||
<view class="username f-row aic">
|
||
用户账号：<input v-model="username" type="text" placeholder="请输入账号"
|
||
placeholder-style="color: grey;font-size: 28rpx;">
|
||
</view>
|
||
<view class="btn f-row aic jca">
|
||
<view class="f-row aic" @click="search">
|
||
<uni-icons type="search" size="15" color="#fff"></uni-icons>
|
||
查询
|
||
</view>
|
||
<view class="f-row aic" @click="refresh">
|
||
<uni-icons type="refreshempty" size="15" color="#fff"></uni-icons>
|
||
重置
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="list">
|
||
<view class="title f-row aic box">
|
||
<view class="">
|
||
|
||
</view>
|
||
<view class="">
|
||
序号
|
||
</view>
|
||
<view class="username">
|
||
用户账号
|
||
</view>
|
||
<view class="">
|
||
用户姓名
|
||
</view>
|
||
</view>
|
||
<view class="item f-row aic box" v-for="item,i in userlist" :key="i">
|
||
<view class="f-row aic img" @click="choose(item.id)">
|
||
<image v-if="chooseArr.includes(item.id)" src="../../static/login/checked.png" mode=""></image>
|
||
<image v-else src="../../static/login/nocheck.png" mode=""></image>
|
||
</view>
|
||
<view class="order">
|
||
{{i+1}}
|
||
</view>
|
||
<view class="username f-col aic">
|
||
<view class="">
|
||
{{item.username}}
|
||
</view>
|
||
</view>
|
||
<view class="realname">
|
||
<view class="">
|
||
{{item.realname}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="confirm f-col aic">
|
||
<view class="" @click="handleprocess">
|
||
确认
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import {
|
||
onLoad
|
||
} from '@dcloudio/uni-app';
|
||
import {
|
||
ref,
|
||
getCurrentInstance
|
||
} from 'vue';
|
||
import {
|
||
queryMyDeptTreeListApi,
|
||
queryUserByDepIdApi,
|
||
taskEntrustApi,
|
||
processCompleteApi
|
||
} from '@/api/api.js';
|
||
import {
|
||
useStore
|
||
} from '@/store';
|
||
const store = useStore()
|
||
const {
|
||
proxy
|
||
} = getCurrentInstance()
|
||
const departList = ref([])
|
||
/**部门列表*/
|
||
const queryMyDeptTreeList = () => {
|
||
queryMyDeptTreeListApi().then((res) => {
|
||
departList.value = res.result
|
||
currentId = res.result[0].id
|
||
queryUserByDepId(res.result[0].id)
|
||
}).catch((err) => {
|
||
console.log(err);
|
||
})
|
||
}
|
||
const userlist = ref([])
|
||
/**根据部门查询人员*/
|
||
const queryUserByDepId = (id, username, realname) => {
|
||
queryUserByDepIdApi({
|
||
id,
|
||
username: username || '',
|
||
realname: realname || ''
|
||
}).then((res) => {
|
||
if (res.success) {
|
||
userlist.value = res.result
|
||
}
|
||
}).catch((err) => {
|
||
console.log(err);
|
||
})
|
||
}
|
||
let currentId = null
|
||
let departArr = []
|
||
const onnodeclick = (e) => {
|
||
queryUserByDepId(e.id)
|
||
currentId = e.id
|
||
if (departArr.indexOf(e.title) != -1) {
|
||
departArr.splice(departArr.indexOf(e.title), 1, e.title)
|
||
} else {
|
||
departArr.push(e.title)
|
||
|
||
}
|
||
}
|
||
const popclose = (e) => {
|
||
}
|
||
const chooseArr = ref([])
|
||
const choose = (id) => {
|
||
if (isradio) { //单选
|
||
if (chooseArr.value.indexOf(id) != -1) return
|
||
chooseArr.value.splice(chooseArr.value.indexOf(id), 1, id)
|
||
} else { //多选
|
||
if (chooseArr.value.indexOf(id) != -1) {
|
||
chooseArr.value.splice(chooseArr.value.indexOf(id), 1)
|
||
} else {
|
||
chooseArr.value.push(id)
|
||
}
|
||
}
|
||
}
|
||
/**0为多选，1单选*/
|
||
let isradio = 0
|
||
/**任务id*/
|
||
let taskId = null
|
||
/**nextnode*/
|
||
let nextnode = null
|
||
/**reason*/
|
||
let reason = null
|
||
onLoad((options) => {
|
||
isradio = options.isradio
|
||
taskId = options.id
|
||
reason = options.reason
|
||
if (options.nextnode) {
|
||
nextnode = JSON.parse(options.nextnode)
|
||
}
|
||
queryMyDeptTreeList()
|
||
|
||
})
|
||
const username = ref('')
|
||
const realname = ref('')
|
||
const search = () => {
|
||
if (username.value.trim() || realname.value.trim()) {
|
||
userlist.value = []
|
||
queryUserByDepId(currentId, username.value, realname.value)
|
||
}
|
||
}
|
||
const refresh = () => {
|
||
username.value = ''
|
||
realname.value = ''
|
||
userlist.value = []
|
||
queryUserByDepId(currentId, username.value, realname.value)
|
||
}
|
||
/**委托*/
|
||
const taskEntrust = () => {
|
||
if (!chooseArr.value.length) return proxy.$toast('请选择被委托人')
|
||
taskEntrustApi({
|
||
taskAssignee: userlist.value.filter(item => item.id == chooseArr.value[0])[0].username,
|
||
taskId
|
||
}).then((res) => {
|
||
if (res.success) {
|
||
proxy.$toast(res.message)
|
||
setTimeout(() => {
|
||
uni.navigateBack()
|
||
}, 2000)
|
||
}
|
||
})
|
||
}
|
||
const handleprocess = () => {
|
||
if (nextnode) {
|
||
processComplete()
|
||
} else {
|
||
taskEntrust()
|
||
}
|
||
}
|
||
/**流程办理接口*/
|
||
const processComplete = () => {
|
||
processCompleteApi({
|
||
taskId,
|
||
reason,
|
||
processModel: 1,
|
||
nextnode: nextnode[0].nextnode,
|
||
nextUserName: userlist.value.filter(item => item.id == chooseArr.value[0])[0].realname,
|
||
nextUserId: chooseArr.value[0],
|
||
}).then((res) => {
|
||
proxy.$toast(res.message)
|
||
setTimeout(() => {
|
||
uni.navigateBack()
|
||
}, 2000)
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.content {
|
||
padding-bottom: 130rpx;
|
||
}
|
||
|
||
.confirm {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
background-color: #fff;
|
||
border-top: 1px solid #efefef;
|
||
width: 100%;
|
||
padding: 20rpx 0;
|
||
|
||
view {
|
||
width: 630rpx;
|
||
height: 88rpx;
|
||
background: #01508B;
|
||
border-radius: 44rpx;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
text-align: center;
|
||
line-height: 88rpx;
|
||
}
|
||
}
|
||
|
||
.search_box {
|
||
|
||
font-size: 28rpx;
|
||
|
||
.username {
|
||
padding: 0 20rpx;
|
||
border-bottom: 1px solid #e5e5e5;
|
||
height: 100rpx;
|
||
|
||
input {
|
||
flex: 1;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.btn {
|
||
color: #fff;
|
||
padding: 20rpx 0;
|
||
|
||
view {
|
||
width: 178rpx;
|
||
height: 80rpx;
|
||
background-color: #01508B;
|
||
border-radius: 40rpx;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
}
|
||
|
||
.list {
|
||
word-break: break-all;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
|
||
.box {
|
||
view:first-child {
|
||
flex: 0.3;
|
||
}
|
||
|
||
view:nth-child(2) {
|
||
flex: 0.3;
|
||
}
|
||
|
||
view:nth-child(3) {
|
||
flex: 1;
|
||
}
|
||
|
||
view:nth-child(4) {
|
||
flex: 1;
|
||
}
|
||
}
|
||
|
||
.title {
|
||
text-align: center;
|
||
border-bottom: 1px solid #e5e5e5;
|
||
background-color: #f8f8f8;
|
||
height: 100rpx;
|
||
}
|
||
|
||
.item {
|
||
text-align: center;
|
||
border-bottom: 1px solid #e5e5e5;
|
||
|
||
.order {
|
||
border-right: 1px solid #e5e5e5;
|
||
height: 100rpx;
|
||
line-height: 100rpx;
|
||
}
|
||
|
||
.username {
|
||
border-right: 1px solid #e5e5e5;
|
||
height: 100rpx;
|
||
justify-content: center;
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.realname {
|
||
height: 100rpx;
|
||
line-height: 100rpx;
|
||
overflow-y: auto;
|
||
justify-content: center;
|
||
}
|
||
|
||
.img {
|
||
border-right: 1px solid #e5e5e5;
|
||
height: 100rpx;
|
||
justify-content: center;
|
||
}
|
||
|
||
image {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
</style> |