yunzhupaas/yunzhupaas-app-vue3
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

初始代码

Browse Source
This commit is contained in:
wangmingwei
2026-04-21 16:55:00 +08:00
parent be9f1657b9
commit 35101db700
1335 changed files with 211213 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

294
pages/my/entrustAgent/components/flowSelect/Select.vue Normal file
View File

@@ -0,0 +1,294 @@
<template>
<u-popup class="yunzhupaas-tree-select-popup" :maskCloseAble="maskCloseAble" mode="right" :popup="false"
v-model="showPopup" :safeAreaInsetBottom="safeAreaInsetBottom" :z-index="uZIndex" width="100%">
<view class="yunzhupaas-tree-select-body">
<view class="yunzhupaas-tree-select-title">
<text class="icon-ym icon-ym-report-icon-preview-pagePre u-font-40 backIcon"
@click.stop="handleConfirm"></text>
<view class="title">{{$t('app.my.flowSelect')}}</view>
</view>
<view class="yunzhupaas-tree-select-search">
<u-search :placeholder="$t('app.apply.pleaseKeyword')" v-model="keyword" height="72"
:show-action="false" @change="search(swiperCurrent)" bg-color="#f0f2f6" shape="square">
</u-search>
</view>
<view class="yunzhupaas-tree-selected">
<view class="yunzhupaas-tree-selected-head">
<view>{{$t('component.yunzhupaas.common.selected')}}</view>
<view v-if="multiple" class="clear-btn" @click="cleanAll">{{$t('component.yunzhupaas.common.clearAll')}}
</view>
</view>
<view class="yunzhupaas-tree-selected-box">
<scroll-view scroll-y="true" style="max-height: 240rpx;">
<view class="yunzhupaas-tree-selected-list">
<view class="u-selectTag u-selectTag-flow" v-for="(list,index) in selectList" :key="index">
<view class="yunzhupaas-tree-selected-content">
<view class="name-box">
<view class="name">{{list.fullName}}</view>
<u-icon name="close" class="close" @click='delSelect(index)'></u-icon>
</view>
<view class="organize">{{list.organize}}</view>
</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view class="sticky-tabs">
<u-tabs ref="tabs" :list="tabsList" :current="tabIndex" @change="tabChange" :is-scroll="true"
name="fullName">
</u-tabs>
</view>
<view class="yunzhupaas-tree-select-tree">
<scroll-view :style="{height: '100%'}" :refresher-enabled="false" :refresher-threshold="100"
:scroll-with-animation='true' :refresher-triggered="triggered" @scrolltolower="handleScrollToLower"
:scroll-y="true">
<view class="lists_box list_top">
<view class="list-cell-txt" v-for="(list,index) in list" :key="index"
@click="handleNodeClick(list)">
<view class="u-font-30 content">
<view class="nameSty">{{list.fullName}}
</view>
</view>
</view>
<view v-if="list.length<1" class="nodata u-flex-col">
<image :src="noDataIcon" mode="widthFix" class="noDataIcon"></image>
{{$t('common.noData')}}
</view>
</view>
</scroll-view>
</view>
<!-- 底部按钮 -->
<view class="yunzhupaas-tree-select-actions">
<u-button class="buttom-btn" @click.stop="handleConfirm">{{$t('common.cancelText')}}</u-button>
<u-button class="buttom-btn" type="primary"
@click.stop="handleConfirm">{{$t('common.okText')}}</u-button>
</view>
</view>
</u-popup>
</template>
<script>
const defaultProps = {
label: 'fullName',
value: 'id',
}
import resources from '@/libs/resources.js'
import {
getFlowSelector
} from '@/api/workFlow/flowEngine.js'
import {
useBaseStore
} from '@/store/modules/base'
const baseStore = useBaseStore()
export default {
props: {
selectType: {
type: String,
default: 'all'
},
selectedData: {
type: Array,
default () {
return [];
}
},
// 通过双向绑定控制组件的弹出与收起
modelValue: {
type: Boolean,
default: false
},
// 弹出的z-index值
zIndex: {
type: [String, Number],
default: 0
},
safeAreaInsetBottom: {
type: Boolean,
default: false
},
// 是否允许通过点击遮罩关闭Picker
maskCloseAble: {
type: Boolean,
default: true
},
//多选
multiple: {
type: Boolean,
default: false
},
// 顶部标题
title: {
type: String,
default: ''
},
isAuthority: {
type: [String, Number],
default: 0
}
},
data() {
return {
noDataIcon: resources.message.nodata,
tabWidth: 150,
tabIndex: 0,
tabsList: [],
keyword: '',
selectList: [],
list: [],
// 因为内部的滑动机制限制，请将tabs组件和swiper组件的current用不同变量赋值
current: 0, // tabs组件的current值，表示当前活动的tab选项
swiperCurrent: 0, // swiper组件的current值，表示当前那个swiper-item是活动的
pagination: {
currentPage: 1,
pageSize: 20
},
total: 0,
categoryId: '',
triggered: false,
moving: false,
showPopup: false
};
},
watch: {
// 在select弹起的时候，重新初始化所有数据
modelValue: {
immediate: true,
handler(val) {
this.showPopup = val
if (val) setTimeout(() => this.init(), 10);
}
},
},
computed: {
uZIndex() {
// 如果用户有传递z-index值，优先使用
return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
},
},
created() {
setTimeout(() => {
this.triggered = true;
}, 1000)
baseStore.getDictionaryData({
sort: 'businessType'
}).then(res => {
this.tabsList.push({
id: 0,
encode: "all",
fullName: "全部流程",
})
this.tabsList.push(...res)
})
},
methods: {
init() {
this.upCallback()
this.selectList = JSON.parse(JSON.stringify(this.selectedData)) || []
// #ifdef MP-WEIXIN
this.$nextTick(() => {
this.$refs.tabs.init()
})
// #endif
},
delSelect(index) {
this.selectList.splice(index, 1);
},
cleanAll() {
this.selectList = [];
},
handleNodeClick(obj) {
if (!this.multiple) this.selectList = []
var isExist = false;
for (var i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].id == obj.id) {
isExist = true;
break;
}
};
!isExist && this.selectList.push(obj);
},
//父组件调用
resetData() {
this.list = []
this.pagination = {
currentPage: 1,
pageSize: 20
}
},
search(index) {
this.pagination.currentPage = 1
this.searchTimer && clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => {
this.list = [];
this.upCallback()
}, 300)
},
// 切换菜单
tabChange(index) {
this.tabIndex = index
this.pagination.currentPage = 1
this.fullName = this.tabsList[this.tabIndex].fullName
this.categoryId = !this.tabsList[this.tabIndex].id ? '' : this.tabsList[this.tabIndex].id
this.list = [];
this.upCallback()
},
handleScrollToLower() {
if (this.pagination.pageSize * this.pagination.currentPage < this.total) {
this.pagination.currentPage = this.pagination.currentPage + 1;
this.upCallback()
} else {
uni.showToast({
title: '没有更多信息啦！',
icon: 'none'
});
}
},
upCallback() {
let query = {
currentPage: this.pagination.currentPage,
pageSize: this.pagination.pageSize,
keyword: this.keyword,
category: this.categoryId ? this.categoryId : "",
isAuthority: this.isAuthority == 2 ? 0 : 1,
isDelegate: 1
}
this.loading = false
getFlowSelector(query).then(res => {
const list = res.data.list || [];
list.map((o) => {
o.fullName = o.fullName + '/' + o.enCode
})
this.list = this.list.concat(list);
this.pagination = res.data.pagination
this.total = this.pagination.total
})
},
handleConfirm() {
// #ifdef MP-WEIXIN
if (this.moving) return;
// #endif
this.keyword = '';
this.$emit('confirm', this.selectList);
}
}
};
</script>
<style scoped lang="scss">
.lists_box {
height: 100%;
.list-cell-txt {
display: flex;
box-sizing: border-box;
width: 100%;
padding: 20rpx 32rpx;
overflow: hidden;
color: $u-content-color;
font-size: 28rpx;
line-height: 48rpx;
background-color: #fff;
}
}
</style>

116
pages/my/entrustAgent/components/flowSelect/index.vue Normal file
View File

@@ -0,0 +1,116 @@
<template>
<view class="yunzhupaas-tree-select">
<u-input input-align='right' type="select" :select-open="selectShow" v-model="innerValue"
:placeholder="placeholder" @click="openSelect"></u-input>
<flowSelect v-model="selectShow" @confirm="selectConfirm" :multiple="multiple" :selectedData="selectedData"
:clearable="clearable" ref="flowSelect" :toUserId="toUserId" :isAuthority='current'>
</flowSelect>
</view>
</template>
<script>
import flowSelect from './Select.vue';
import {
getFlowEngineListByIds
} from '@/api/workFlow/flowEngine.js'
export default {
components: {
flowSelect
},
props: {
modelValue: {
default: ''
},
placeholder: {
type: String,
default: '请选择'
},
disabled: {
type: Boolean,
default: false
},
clearable: {
type: Boolean,
default: false
},
multiple: {
type: Boolean,
default: false
},
toUserId: {
type: [String, Array],
default: ''
},
current: {
type: [String, Number],
default: ''
},
},
data() {
return {
selectShow: false,
innerValue: '',
selectedData: [],
selectedIds: [],
delegateUser: '',
}
},
watch: {
modelValue: {
handler(val) {
if (!val || !val.length) return this.innerValue = ''
this.setDefault(val)
},
immediate: true
}
},
methods: {
setDefault(id) {
if (!id || !id.length) return this.innerValue = ''
getFlowEngineListByIds(id).then(res => {
let data = res.data || []
this.innerValue = data.map(o => o.fullName).join()
this.selectedData = data.map(o => {
return {
...o,
fullName: o.fullName + '/' + o.enCode,
};
});
})
},
openSelect() {
if (this.disabled) return
if (!this.toUserId.length) return this.$u.toast('请先选择受委托人');
this.selectShow = true
this.$refs.flowSelect.resetData()
this.setDefault()
},
selectConfirm(e) {
this.selectShow = false
this.selectedData = e;
let label = ''
let value = []
this.defaultValue = []
for (let i = 0; i < e.length; i++) {
label += (i ? ',' : '') + e[i].fullName
value.push(e[i].id)
}
this.defaultValue = value
this.innerValue = label
if (!this.multiple) {
this.$emit('update:modelValue', value)
this.$emit('change', value.join(), e[0])
return
}
this.$emit('update:modelValue', value)
this.$emit('change', value, e)
}
}
}
</script>
<style lang="scss" scoped>
.yunzhupaas-tree-select {
width: 100%;
}
</style>

512
pages/my/entrustAgent/components/userSelect/Tree.vue Normal file
View File

@@ -0,0 +1,512 @@
<template>
<u-popup class="yunzhupaas-tree-select-popup" :maskCloseAble="maskCloseAble" mode="right" v-model="showPopup"
:safeAreaInsetBottom="safeAreaInsetBottom" @close="close" :z-index="uZIndex" width="100%">
<view class="yunzhupaas-tree-select-body">
<view class="yunzhupaas-tree-select-title">
<text class="icon-ym icon-ym-report-icon-preview-pagePre u-font-40 backIcon" @tap="close"></text>
<view class="title">选择用户</view>
</view>
<view class="yunzhupaas-tree-select-search">
<u-search :placeholder="$t('app.apply.pleaseKeyword')" v-model="keyword" height="72"
:show-action="false" @change="search(swiperCurrent)" bg-color="#f0f2f6" shape="square">
</u-search>
</view>
<view class="yunzhupaas-tree-selected">
<view class="yunzhupaas-tree-selected-head">
<view>{{$t('component.yunzhupaas.common.selected')}}</view>
<view v-if="multiple" class="clear-btn" @click="cleanAll">
{{$t('component.yunzhupaas.common.clearAll')}}
</view>
</view>
<view class="yunzhupaas-tree-selected-box">
<scroll-view scroll-y="true" style="max-height: 240rpx;">
<view class="yunzhupaas-tree-selected-list">
<view class="u-selectTag" v-for="(list,index) in selectList" :key="index">
<u-avatar class="avatar" :src="baseURL+list.headIcon" mode="circle"
size="mini"></u-avatar>
<view class="yunzhupaas-tree-selected-content">
<view class="name-box">
<view class="name">{{list.fullName}}</view>
<u-icon name="close" class="close" @click='delSelect(index)'></u-icon>
</view>
<view class="organize">{{list.organize}}</view>
</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view class="listTitle" v-if="scope != '1'">全部数据</view>
<view class="yunzhupaas-user-content" v-if="scope == '1'">
<!-- #ifdef MP-WEIXIN -->
<u-tabs-swiper activeColor="#1890ff" ref="tabs" :list="tabsList" :current="current" @change="change"
:is-scroll="false" :show-bar="false"></u-tabs-swiper>
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<u-tabs-swiper activeColor="#1890ff" ref="tabs" :list="tabsList" :current="current" @change="change"
:is-scroll="false"></u-tabs-swiper>
<!-- #endif -->
<swiper :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish"
class="swiper-box">
<swiper-item>
<scroll-view :scroll-y="true" class="scroll-view">
<ly-tree ref="tree" :node-key="realProps.value" :expand-on-click-node="true"
:tree-data="options0" check-on-click-node :show-checkbox="false"
:default-expand-all="false" :highlight-current="true" @node-click="handleNodeClick"
:props="realProps" :show-node-icon="true" :show-radio="false" :load="loadNode" lazy />
</scroll-view>
</swiper-item>
<swiper-item>
<scroll-view :scroll-y="true" class="scroll-view">
<ly-tree ref="tree" :node-key="realProps.value" :expand-on-click-node="true"
check-on-click-node :show-checkbox="false" :default-expand-all="false"
:highlight-current="true" @node-click="handleNodeClick" :props="realProps"
:show-node-icon="true" :show-radio="false" :tree-data="options" />
</scroll-view>
</swiper-item>
<swiper-item>
<scroll-view :scroll-y="true" class="scroll-view">
<ly-tree ref="tree" :node-key="realProps.value" :expand-on-click-node="true"
check-on-click-node :show-checkbox="false" :default-expand-all="false"
:highlight-current="true" @node-click="handleNodeClick" :props="realProps"
:show-node-icon="true" :show-radio="false" :tree-data="options" />
</scroll-view>
</swiper-item>
</swiper>
</view>
<view v-else class="yunzhupaas-tree-select-tree">
<scroll-view class="scroll-view" :refresher-enabled="false" :refresher-threshold="100"
:scroll-with-animation='true' :refresher-triggered="triggered" @scrolltolower="handleScrollToLower"
:scroll-y="true">
<view class="lists_box">
<view class="list-cell-txt u-border-bottom" v-for="(list,index) in list" :key="index"
@click="onSelect(list)">
<u-avatar class="avatar" :src="baseURL+list.headIcon" mode="circle"
size="default"></u-avatar>
<view class="u-font-30 content">
<view>{{list.fullName}}</view>
<view class="organize">{{list.organize}}</view>
</view>
</view>
<view v-if="list.length<1" class="nodata u-flex-col">
<image :src="noDataIcon" mode="widthFix" class="noDataIcon"></image>
{{$t('common.noData')}}
</view>
</view>
</scroll-view>
</view>
<!-- 底部按钮 -->
<view class="yunzhupaas-tree-select-actions">
<u-button class="buttom-btn" @click="close()">{{$t('common.cancelText')}}</u-button>
<u-button class="buttom-btn" type="primary"
@click.stop="handleConfirm">{{$t('common.okText')}}</u-button>
</view>
</view>
</u-popup>
</template>
<script>
/**
* tree-select 树形选择器
* @property {Boolean} v-model 布尔值变量，用于控制选择器的弹出与收起
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
* @property {String} cancel-color 取消按钮的颜色（默认#606266）
* @property {String} confirm-color 确认按钮的颜色(默认#2979ff)
* @property {String} confirm-text 确认按钮的文字
* @property {String} cancel-text 取消按钮的文字
* @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭Picker(默认true)
* @property {String Number} z-index 弹出时的z-index值(默认10075)
* @event {Function} confirm 点击确定按钮，返回当前选择的值
*/
const defaultProps = {
label: 'fullName',
value: 'id',
icon: 'icon',
children: 'children'
}
import {
getUserSelectorNew,
getSubordinates,
getOrganization,
getSelectedUserList,
getReceiveUserList
} from '@/api/common.js'
import resources from '@/libs/resources.js'
import LyTree from '@/components/ly-tree/ly-tree.vue'
export default {
name: "tree-select",
components: {
LyTree
},
props: {
clearable: {
type: Boolean,
default: false
},
selectedData: {
type: Array,
default () {
return [];
}
},
// 是否显示边框
border: {
type: Boolean,
default: true
},
// 通过双向绑定控制组件的弹出与收起
modelValue: {
type: Boolean,
default: false
},
// "取消"按钮的颜色
cancelColor: {
type: String,
default: '#606266'
},
// "确定"按钮的颜色
confirmColor: {
type: String,
default: '#2979ff'
},
// 弹出的z-index值
zIndex: {
type: [String, Number],
default: 999
},
safeAreaInsetBottom: {
type: Boolean,
default: false
},
// 是否允许通过点击遮罩关闭Picker
maskCloseAble: {
type: Boolean,
default: true
},
props: {
type: Object,
default: () => ({
label: 'fullName',
value: 'id',
icon: 'icon',
children: 'children',
isLeaf: 'isLeaf'
})
},
//多选
multiple: {
type: Boolean,
default: false
},
// 顶部标题
title: {
type: String,
default: ''
},
// 取消按钮的文字
cancelText: {
type: String,
default: '取消'
},
// 确认按钮的文字
confirmText: {
type: String,
default: '确认'
},
scope: {
type: Number,
default: 1
},
entrustType: {
type: [String, Number],
default: 0
}
},
data() {
return {
noDataIcon: resources.message.nodata,
triggered: false,
moving: false,
selectList: [],
keyword: '',
tabsList: [{
name: '全部数据'
},
{
name: '当前组织'
},
{
name: '我的下属'
}
],
current: 0,
swiperCurrent: 0,
options: [],
options0: [],
list: [],
pagination: {
currentPage: 1,
pageSize: 20
},
total: 0,
height: 0,
showPopup: false,
query: {}
};
},
watch: {
// 在select弹起的时候，重新初始化所有数据
modelValue: {
immediate: true,
handler(val) {
this.showPopup = val
this.resetData()
if (val) setTimeout(() => this.init(), 10);
}
},
selectedData: {
immediate: true,
handler(val) {
this.selectList = val
}
},
},
computed: {
baseURL() {
return this.define.baseURL
},
uZIndex() {
// 如果用户有传递z-index值，优先使用
return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
},
realProps() {
return {
...defaultProps,
...this.props
}
}
},
created() {
this.sysConfigInfo = uni.getStorageSync('sysConfigInfo') || {}
this._freshing = false;
setTimeout(() => {
this.triggered = true;
}, 1000)
this.resetData()
},
methods: {
handleScrollToLower() {
this.getInfoList()
},
getInfoList() {
this.query = {
...this.pagination,
type: this.sysConfigInfo[this.entrustType === 0 ? 'delegateScope' : 'proxyScope'],
keyword: this.keyword
}
getReceiveUserList(this.query).then(res => {
const list = res.data.list;
if (!list.length && this.pagination.currentPage != 1) return uni.showToast({
title: '没有更多信息啦！',
icon: 'none'
})
this.list = this.list.concat(list);
this.pagination.currentPage++
})
},
init() {
if (this.scope != '1') this.getInfoList()
},
onSelect(list) {
if (!this.multiple) this.selectList = []
let flag = false;
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].id === list.id) {
flag = true;
return
}
};
!flag && this.selectList.push(list)
},
loadNode(node, resolve) {
if (node.level === 0) {
getUserSelectorNew(node.level).then(res => {
resolve(res.data.list)
})
} else {
getUserSelectorNew(node.data.id).then(res => {
const data = res.data.list
resolve(data)
})
}
},
change(index) {
this.swiperCurrent = index;
this.keyword = ''
if (this.swiperCurrent !== 0) this.handOff(this.swiperCurrent)
},
handOff(swiperCurrent) {
let method = swiperCurrent == 1 ? getOrganization : getSubordinates;
method(this.keyword).then(res => {
this.options = res.data
})
},
search(index) {
this.searchTimer && clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => {
this.pagination = {
currentPage: 1,
pageSize: 20
}
if (this.scope == 1) {
if (index !== 0) this.handOff(index)
getUserSelectorNew(0, this.keyword).then(res => {
this.options0 = res.data.list
})
} else {
this.list = []
this.getInfoList()
}
}, 300)
},
transition({
detail: {
dx
}
}) {
this.$refs.tabs.setDx(dx);
},
animationfinish({
detail: {
current
}
}) {
this.$refs.tabs.setFinishCurrent(current);
this.swiperCurrent = current;
this.current = current;
if (this.swiperCurrent !== 0) this.handOff(this.swiperCurrent)
},
handleNodeClick(obj) {
if (this.swiperCurrent === 0 && obj.data.type !== 'user') return
if (!this.multiple) this.selectList = []
var isExist = false;
for (var i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].id == obj.data.id) {
isExist = true;
break;
}
};
!isExist && this.selectList.push(obj.data);
},
delSelect(index) {
this.selectList.splice(index, 1);
},
cleanAll() {
this.selectList = [];
},
handleConfirm() {
// #ifdef MP-WEIXIN
if (this.moving) return;
// #endif
this.keyword = '';
this.current = 0
this.swiperCurrent = 0
this.$emit('confirm', this.selectList);
this.close();
},
// 标识滑动开始，只有微信小程序才有这样的事件
pickstart() {
// #ifdef MP-WEIXIN
this.moving = true;
// #endif
},
// 标识滑动结束
pickend() {
// #ifdef MP-WEIXIN
this.moving = false;
// #endif
},
filterNode(value, data) {
if (!value) return true;
return data[this.realProps.label].indexOf(value) !== -1;
},
close() {
this.$emit('close');
},
resetData() {
this.list = [];
this.keyword = ''
this.pagination = {
currentPage: 1,
pageSize: 20
}
}
}
};
</script>
<style scoped lang="scss">
.yunzhupaas-user-content {
flex: 1;
display: flex;
flex-direction: column;
.swiper-box {
flex: 1;
}
}
.listTitle {
padding: 10rpx 30rpx;
font-size: 32rpx;
}
.scroll-view {
height: 100%;
}
.lists_box {
height: 100%;
.nodata {
height: 100%;
margin: auto;
align-items: center;
justify-content: center;
color: #909399;
.noDataIcon {
width: 300rpx;
height: 210rpx;
}
}
.list-cell-txt {
display: flex;
box-sizing: border-box;
width: 100%;
padding: 20rpx 32rpx;
overflow: hidden;
color: $u-content-color;
font-size: 28rpx;
line-height: 24px;
background-color: #fff;
.content {
width: 85%;
margin-left: 15rpx;
.organize {
white-space: nowrap;
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis
}
}
.department {
color: #9A9A9A;
}
}
}
</style>

121
pages/my/entrustAgent/components/userSelect/index.vue Normal file
View File

@@ -0,0 +1,121 @@
<template>
<view class="yunzhupaas-tree-select">
<u-input input-align='right' type="select" :select-open="selectShow" v-model="innerValue"
:placeholder="placeholder" @click="openSelect" v-if="isInput" />
<Tree v-model="selectShow" :options="options" :multiple="multiple" :selectedData="selectedData"
:clearable="clearable" ref="userTree" @close="handleClose" @confirm="handleConfirm" :scope="scope"
:entrustType="entrustType" />
</view>
</template>
<script>
import Tree from './Tree.vue';
import {
getUserInfoList
} from '@/api/common.js'
export default {
components: {
Tree
},
props: {
modelValue: {
default: ''
},
isInput: {
type: Boolean,
default: true
},
options: {
type: Array,
default: () => []
},
placeholder: {
type: String,
default: '请选择'
},
disabled: {
type: Boolean,
default: false
},
clearable: {
type: Boolean,
default: false
},
multiple: {
type: Boolean,
default: false
},
entrustType: {
type: [String, Number],
default: 0
},
scope: {
type: Number,
default: 1
}
},
data() {
return {
selectShow: false,
innerValue: '',
selectedData: []
}
},
watch: {
modelValue: {
handler(val) {
this.setDefault()
},
immediate: true
}
},
methods: {
setDefault() {
if (!this.modelValue || !this.modelValue.length) return this.setNullValue();
this.selectedData = []
const ids = this.multiple ? this.modelValue : [this.modelValue];
if (!Array.isArray(ids)) return;
getUserInfoList(ids).then(res => {
if (!this.modelValue || !this.modelValue.length) return this.setNullValue();
const list = res.data.list
this.selectedData = list
this.innerValue = this.selectedData.map(o => o.fullName).join();
})
},
setNullValue() {
this.innerValue = '';
this.selectedData = [];
},
openSelect() {
if (this.disabled) return
this.selectShow = true
},
handleClose() {
this.selectShow = false
},
handleConfirm(e) {
this.selectedData = e;
let label = ''
let value = []
for (let i = 0; i < e.length; i++) {
label += (!label ? '' : ',') + e[i].fullName
value.push(e[i].id)
}
this.defaultValue = value
this.innerValue = label
if (!this.multiple) {
this.$emit('update:modelValue', value[0])
this.$emit('change', value[0], e[0])
} else {
this.$emit('update:modelValue', value)
this.$emit('change', value, e)
}
}
}
}
</script>
<style lang="scss" scoped>
.yunzhupaas-tree-select {
width: 100%;
}
</style>

198
pages/my/entrustAgent/detail.vue Normal file
View File

@@ -0,0 +1,198 @@
<template>
<view class="yunzhupaas-wrap personalData">
<view class="u-p-l-20 u-p-r-20 content">
<u-form :model="dataForm" :errorType="['toast']" label-width="180" label-align="left" ref="dataForm">
<u-form-item :label="titleList[config?.current]" prop='toUserId' required>
<view class="txt">
{{dataForm.userName}}
</view>
</u-form-item>
<u-form-item v-if="config.current == 0 || config.current == 2">
<view class="u-flex tag-box">
<view v-for="(item,index) in infoList" :key="index" size="mini">{{item.toUserName}}<u-tag
class="u-m-l-8" size="mini"
:type="item.status=== 0?'info':item.status=== 1?'success':'error'"
:text="item.status === 0 ? '待确认' : item.status === 1 ? '已接受' : '已拒绝'" /></view>
</view>
</u-form-item>
<u-form-item :label="config.current == 2 ? '代理流程' : '委托流程'">
<view class="txt">{{dataForm.flowName}}</view>
</u-form-item>
<u-form-item label="开始时间" prop='startTime' required>
<view class="txt">
{{$u.timeFormat(dataForm.startTime,'yyyy-mm-dd hh:MM:ss')}}
</view>
</u-form-item>
<u-form-item label="结束时间" prop='endTime' required>
<view class="txt">
{{$u.timeFormat(dataForm.endTime,'yyyy-mm-dd hh:MM:ss')}}
</view>
</u-form-item>
<u-form-item label="委托说明">
<u-input input-align='right' v-model="dataForm.description" type="textarea" placeholder="请输入"
disabled />
</u-form-item>
</u-form>
</view>
<view class="flowBefore-actions" v-if="config.confirmStatus != 1 && config.status != 2">
<u-button class="buttom-btn" type="primary" @click.stop="jumpForm"
v-if="isEdit">{{$t('common.editText')}}</u-button>
<template v-if='isAccept'>
<u-button class="buttom-btn" type="primary" @click.stop="getResult('accept')">接受</u-button>
<u-button class="buttom-btn" @click="getResult('refuse')" type="error">拒绝</u-button>
</template>
<u-button class="buttom-btn" type="primary" @click.stop="entrustStop" v-if="isStop">终止</u-button>
</view>
</view>
</template>
<script>
import {
entrustStop,
getPrincipalDetails,
entrustHandle,
FlowDelegateInfo
} from '@/api/workFlow/entrust.js'
export default {
data() {
const data = {
dataForm: {
id: '',
userId: '',
toUserId: [],
flowId: [],
description: '',
startTime: '',
endTime: '',
flowName: '',
toUserName: '',
type: undefined,
},
config: {},
infoList: [],
titleList: ['受委托人', '委托人', '代理人', '被代理人'],
}
return data
},
computed: {
isAccept() {
if (this.config.current == 1 && this.config.confirmStatus == 2) return false
if (this.config.current == 0 || this.config.current == 2) return false
if (this.config.status == 0 || this.config.status == 1) return true
return false
},
isStop() {
return (this.config.current == 0 || this.config.current == 2) && this.config.status == 1
},
isEdit() {
return (this.config.current == 0 || this.config.current == 2) && this.config.status == 0
}
},
onShow() {
uni.$on('refreshDetail', () => {
this.flowDelegateInfo()
})
},
onUnload() {
uni.$emit('refresh')
uni.$off('refreshDetail')
},
onLoad(e) {
this.config = JSON.parse(decodeURIComponent(e.data));
if (this.config) this.init()
},
methods: {
flowDelegateInfo() {
FlowDelegateInfo(this.config.id).then(res => {
this.dataForm = res.data || {}
this.dataForm.flowId = this.dataForm.flowId ? this.dataForm.flowId.split(",") : [];
this.config = {
...this.config,
...this.dataForm
}
if (this.dataForm.id) {
if (this.config.current == 0 || this.config.current == 2) this.getPrincipalDetails()
}
})
},
init() {
this.dataForm.id = this.config.id || ''
this.dataForm.userName = this.config.userName
this.dataForm.flowName = this.config.flowName
this.dataForm.description = this.config.description
this.dataForm.startTime = this.config.startTime
this.dataForm.endTime = this.config.endTime
if (this.dataForm.id) {
if (this.config.current == 1) this.dataForm = this.config || {}
if (this.config.current == 0 || this.config.current == 2) this.getPrincipalDetails()
}
},
getPrincipalDetails() {
getPrincipalDetails(this.dataForm.id).then(res => {
this.infoList = res.data || []
this.dataForm.userName = this.infoList.map(o => o.toUserName).join()
})
},
entrustStop() {
let currTime = Math.round(new Date())
uni.showModal({
title: '提示',
content: '结束后,流程不再进行委托!',
success: (res) => {
if (res.confirm) {
entrustStop(this.dataForm.id).then(res => {
this.dataForm.endTime = currTime
uni.$emit('refresh')
uni.navigateBack()
})
}
}
})
},
getResult(entrustType) {
let data = {
'type': entrustType === 'accept' ? 1 : 2
}
entrustHandle(this.dataForm.id, data).then(res => {
uni.$emit('refresh')
uni.navigateBack()
})
},
jumpForm() {
let isEdit = this.infoList.some(o => o.status == 1)
if (isEdit) return this.$u.toast("已有人接受，不可编辑");
uni.navigateTo({
url: `/pages/my/entrustAgent/form?data=${encodeURIComponent(JSON.stringify(this.config))}`
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #f0f2f6;
}
.content {
background-color: #fff;
:deep(.u-form-item) {
min-height: 112rpx;
}
.u-form {
padding: 0;
}
.tag-box {
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
}
.txt {
text-align: right;
width: 100%;
}
}
</style>

268
pages/my/entrustAgent/form.vue Normal file
View File

@@ -0,0 +1,268 @@
<template>
<view class="yunzhupaas-wrap personalData">
<view class="u-p-l-20 u-p-r-20 content">
<u-form :model="dataForm" :errorType="['toast']" label-width="180" label-align="left" ref="dataForm">
<u-form-item :label="titleList[current]" prop='toUserId' required>
<userSelect v-model="dataForm.toUserId" @change="toChangeUser" :disabled="disabled" multiple
:placeholder="$t('common.chooseText')" :scope="scope" :entrustType="type" />
</u-form-item>
<u-form-item :label="current == 2 ? '代理流程' : '委托流程'">
<flowSelect v-model="dataForm.flowId" :toUserId="dataForm.toUserId"
:placeholder="$t('app.my.allFlow')" multiple @change="onChange" :disabled="disabled" clearable
:current="current" />
</u-form-item>
<u-form-item label="开始时间" prop='startTime' required>
<YunzhupaasDatePicker v-model="dataForm.startTime" :placeholder="$t('common.chooseTextPrefix')"
:disabled="disabled" @change="change" format="yyyy-MM-dd HH:mm:ss" />
</u-form-item>
<u-form-item label="结束时间" prop='endTime' required>
<YunzhupaasDatePicker v-model="dataForm.endTime" :placeholder="$t('common.chooseTextPrefix')"
@change="change" :disabled="disabled" format="yyyy-MM-dd HH:mm:ss" />
</u-form-item>
<u-form-item label="委托说明">
<u-input input-align='right' v-model="dataForm.description" type="textarea"
:placeholder="$t('common.inputTextPrefix')" :disabled="disabled" />
</u-form-item>
</u-form>
</view>
<view class="flowBefore-actions">
<u-button class="buttom-btn" type="primary" @click.stop="entrustStop"
v-if="config.status == 1">{{$t('app.my.stop')}}</u-button>
<template v-else>
<u-button class="buttom-btn" @click="getResult('cancel')">{{$t('common.cancelText')}}</u-button>
<u-button class="buttom-btn" type="primary"
@click.stop="getResult('confirm')">{{$t('common.okText')}}</u-button>
</template>
</view>
</view>
</template>
<script>
import {
UpdateUser
} from '@/api/common'
import {
Create,
Update,
FlowDelegateInfo
} from '@/api/workFlow/entrust.js'
import flowSelect from './components/flowSelect/index.vue'
import userSelect from './components/userSelect/index.vue'
export default {
components: {
flowSelect,
userSelect
},
data() {
return {
showBtn: false,
showctionSheet: false,
show: false,
props: {
label: 'fullName',
value: 'enCode'
},
dataForm: {
id: '',
toUserId: [],
flowId: [],
description: '',
startTime: '',
endTime: '',
flowName: '',
toUserName: '',
type: 0,
},
typeOptions: [{
enCode: "0",
fullName: '发起委托'
}, {
enCode: "1",
fullName: '审批委托'
}],
userInfo: {},
current: '1',
rules: {
toUserId: [{
required: true,
message: `受委托人不能为空`,
trigger: ['change', 'blur'],
type: 'array'
}],
endTime: [{
required: true,
message: '结束时间不能为空',
trigger: 'blur',
type: 'number'
}],
startTime: [{
required: true,
message: '开始时间不能为空',
trigger: 'blur',
type: 'number'
}]
},
myNameAccount: '',
actionList: [],
disabled: false,
config: {},
scope: 1,
titleList: ['受委托人', '委托人', '代理人', '被代理人'],
type: 0
}
},
computed: {
baseURL() {
return this.define.baseURL
}
},
onLoad(e) {
this.userInfo = uni.getStorageSync('userInfo') || {}
if (e.data) this.config = JSON.parse(decodeURIComponent(e?.data));
if (this.config) this.init()
},
methods: {
init() {
this.current = this.config.current || 0
this.type = this.config.type
this.config.status = this.config.status || 0
this.disabled =
this.config.status == 1 ? true : false
this.dataForm.id = this.config.id || ''
let {
delegateScope,
proxyScope
} = uni.getStorageSync('sysConfigInfo') || {}
this.scope = this.config.type == '0' ? delegateScope : proxyScope
uni.setNavigationBarTitle({
title: this.dataForm.id ? this.$t('common.editText') : this.$t('common.addText')
})
this.rules.toUserId[0].message = `${this.type == 1 ? '代理人' : '受委托人'}不能为空`;
if (this.current != 2) {
this.rules.type = [{
required: true,
message: '委托类型不能为空',
trigger: ['change', 'blur'],
type: 'number'
}]
}
this.$nextTick(() => {
this.$refs.dataForm.setRules(this.rules);
})
//初始化数据
if (this.dataForm.id) {
this.$nextTick(() => {
FlowDelegateInfo(this.dataForm.id).then(res => {
this.dataForm = res.data || {}
this.dataForm.flowId = this.dataForm.flowId ? this.dataForm.flowId.split(",") :
[]
})
})
}
},
entrustStop() {
let currTime = Math.round(new Date())
uni.showModal({
title: '提示',
content: '结束后,流程不再进行委托!',
success: (res) => {
if (res.confirm) {
entrustStop(this.dataForm.id).then(res => {
this.dataForm.endTime = currTime
uni.$emit('refresh')
uni.navigateBack()
})
}
}
})
},
onChange(id, listData) {
if (listData && listData.length) {
let arr = []
listData.forEach(item => {
arr.push(item.fullName)
})
this.dataForm.flowName = arr.join(",")
} else {
this.dataForm.flowName = "全部流程"
}
},
change(val, list) {
this.$nextTick(() => {
this.$emit('change', this.dataForm)
})
},
toChangeUser(id, selectedData) {
this.dataForm.toUserName = selectedData.map(user => user.fullName).join(',');
return this.dataForm.toUserName
},
// 点击确定或者取消
getResult(event = null) {
// #ifdef MP-WEIXIN
if (this.moving) return;
// #endif
this.keyword = '';
if (event === 'cancel') return this.close();
this.submit()
},
close() {
uni.navigateBack();
},
submit() {
let startTime = this.dataForm.startTime;
let endTime = this.dataForm.endTime;
this.dataForm.type = this.config.type || 0
this.$refs.dataForm.validate(valid => {
if (valid) {
if (startTime > endTime) return this.$u.toast('开始时间不能大于等于结束时间')
const formMethod = this.dataForm.id ? Update : Create
let params = {
...this.dataForm
}
params.flowId = this.dataForm.flowId ? this.dataForm.flowId.join(",") : ""
if (!params.flowId) params.flowName = "全部流程"
formMethod(params).then(res => {
uni.showToast({
title: res.msg,
complete: () => {
setTimeout(() => {
uni.$emit('refreshDetail')
uni.navigateBack()
}, 1500)
}
});
}).catch()
}
});
},
onTypeChange() {
this.dataForm.flowId = []
}
}
}
</script>
<style lang="scss">
page {
background-color: #f0f2f6;
}
.content {
background-color: #fff;
:deep(.u-form-item) {
min-height: 112rpx;
}
.u-form {
padding: 0;
}
.tag-box {
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
}
}
</style>

336
pages/my/entrustAgent/index.vue Normal file
View File

@@ -0,0 +1,336 @@
<template>
<view class="flowLaunch-v">
<view class="notice-warp">
<view class="search-box">
<u-search :placeholder="$t('app.apply.pleaseKeyword')" v-model="keyword" height="72"
:show-action="false" @change="search" bg-color="#f0f2f6" shape="square" />
</view>
<u-tabs :list="entrustList" v-model="current" @change="change" :is-scroll='false' name="fullName">
</u-tabs>
</view>
<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :down="downOption"
:up="upOption" :bottombar="false" top="200">
<view class="flow-list">
<view class="flow-list-box">
<uni-swipe-action ref="swipeAction">
<uni-swipe-action-item v-for="(item, index) in list" :key="item.id" :threshold="0"
:right-options="options" @click="handleClick(index)" :disabled="actionItemDisabled(item)">
<view class="item" :id="'item'+index" ref="mydom" @click="goDetail(item)">
<view class="item-left">
<text class="title u-line-1 u-font-24 u-m-b-18">
{{titleList[current]}}：
<text
class="titInner">{{current == '0' || current == '2' ? item.toUserName : item.userName }}</text>
</text>
<text class="title u-line-1 u-font-24 u-m-b-18">
{{current == 2 ? '代理流程：' :'委托流程：' }}
<text class="titInner">{{item.flowName ? item.flowName : ''}}</text>
</text>
<text class="time title u-font-24 u-m-b-18">
开始时间：
<text
class="titInner">{{item.startTime?$u.timeFormat(item.startTime, 'yyyy-mm-dd hh:MM:ss'):''}}</text>
</text>
<text class="time title u-font-24 "
:class="current == 1 || current == 3 ?'u-m-b-18': ''">
结束时间：
<text
class="titInner">{{item.endTime?$u.timeFormat(item.endTime, 'yyyy-mm-dd hh:MM:ss'):''}}</text>
</text>
<view class="time title u-font-24" v-if="current == 1 || current == 3 ">
确认状态：
<u-tag
:type="item.confirmStatus == 0 ? 'info' : item.confirmStatus == 1 ? 'success' : 'error'"
:text="item.confirmStatus == 0 ? '待确认' : item.confirmStatus == 1 ? '已接受' : '已拒绝'"
size="mini" />
</view>
</view>
<view class="item-right">
<image :src="item.entrustStatus.flowStatus" mode="widthFix"
class="item-right-img" />
</view>
</view>
</uni-swipe-action-item>
</uni-swipe-action>
</view>
</view>
</mescroll-body>
<view class="com-addBtn" v-if="current == 0 || current == 2" @click="addPage()">
<u-icon name="plus" size="48" color="#fff" />
</view>
</view>
</template>
<script>
import resources from '@/libs/resources.js'
import {
FlowDelegateList,
DeleteDelagate,
getDelegateUser
} from '@/api/workFlow/entrust.js'
import {
getFlowLaunchList,
delFlowLaunch
} from '@/api/workFlow/template'
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
import flowlist from '../../workFlow/flowTodo/flowList.vue'
export default {
components: {
flowlist
},
mixins: [MescrollMixin],
data() {
return {
keyword: '',
list: [],
downOption: {
use: true,
auto: true
},
upOption: {
page: {
num: 0,
size: 20,
time: null
},
empty: {
use: true,
icon: resources.message.nodata,
tip: this.$t('common.noData'),
fixed: true,
top: "450rpx",
},
textNoMore: this.$t('app.apply.noMoreData'),
},
entrustList: [{
fullName: this.$t('app.my.myEntrust')
},
{
fullName: this.$t('app.my.entrustMe')
},
{
fullName: this.$t('app.my.myAgency')
},
{
fullName: this.$t('app.my.agencyMe')
}
],
titleList: ['受委托人', '委托人', '代理人', '被代理人'],
current: 0,
options: [{
text: '删除',
style: {
backgroundColor: '#dd524d'
}
}]
}
},
onLoad(e) {
uni.$on('refresh', () => {
this.list = [];
this.mescroll.resetUpScroll();
})
if (e.index) this.current = Number(e.index)
},
onShow() {
uni.$on('refreshDetail', () => {
this.list = [];
this.mescroll.resetUpScroll();
})
},
methods: {
actionItemDisabled(item) {
if (this.current == 1 || this.current == 3) return true
return !(item.status == 0 || item.status == 2)
},
addPage() {
let url = '/entrustAgent/form'
const data = {
current: this.current,
type: this.current == 0 ? 0 : 1
}
uni.navigateTo({
url: `/pages/my${url}?data=${encodeURIComponent(JSON.stringify(data))}`
})
},
handleClick(index) {
const item = this.list[index]
DeleteDelagate(item.id).then(res => {
this.$u.toast(res.msg)
this.mescroll.resetUpScroll()
})
},
upCallback(page) {
let query = {
currentPage: page.num,
pageSize: page.size,
keyword: this.keyword,
type: this.current + 1
}
FlowDelegateList(query, {
load: page.num == 1
}).then(res => {
this.mescroll.endSuccess(res.data.list.length);
if (page.num == 1) this.list = [];
// #ifndef APP-HARMONY
const list = res.data.list.map(o => ({
'entrustStatus': this.getEntrustStatus(o),
...o
}))
// #endif
// #ifdef APP-HARMONY
const list = res.data.list.map(o =>
Object.assign({}, {
'entrustStatus': this.getEntrustStatus(o)
}, o)
);
// #endif
this.list = this.list.concat(list);
}).catch(() => {
this.mescroll.endErr();
})
},
// 状态
getEntrustStatus(o) {
let status = o.status;
let flowStatus;
switch (status) {
case 0: //未生效
flowStatus = resources.status.notEffective
break;
case 1: //生效中
flowStatus = resources.status.effectuate
break;
default: //已失效
flowStatus = resources.status.expired
break;
}
return {
flowStatus,
status
}
},
search() {
// 节流,避免输入过快多次请求
this.searchTimer && clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => {
this.list = [];
this.mescroll.resetUpScroll();
}, 300)
},
change(index) {
this.keyword = ''
this.current = index;
this.list = [];
this.search()
},
// 详情
goDetail(item) {
const data = {
...item,
current: this.current,
type: this.current == 0 ? 0 : 1
};
uni.navigateTo({
url: `/pages/my/entrustAgent/detail?data=${encodeURIComponent(JSON.stringify(data))}`
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #f0f2f6;
}
.search_sticky {
z-index: 990;
position: sticky;
background-color: #fff;
}
.flowLaunch-v {
width: 100%;
.flow-list-box {
width: 95%;
.item {
display: flex;
width: 100%;
height: 100%;
.common-lable {
font-size: 24rpx;
border-radius: 8rpx;
color: #409EFF;
border: 1px solid #409EFF;
background-color: #e5f3fe;
}
.urgent-lable {
color: #E6A23C;
border: 1px solid #E6A23C;
background-color: #fef6e5;
}
.important-lable {
color: #F56C6C;
border: 1px solid #F56C6C;
background-color: #fee5e5;
}
.item-right {
display: flex;
justify-content: flex-end;
height: 88rpx;
.item-right-img {
width: 102rpx;
}
}
}
}
.item-left-top {
display: flex;
width: 100%;
align-items: baseline;
.common-lable {
font-size: 24rpx;
padding: 2rpx 8rpx;
border-radius: 8rpx;
color: #409EFF;
border: 1px solid #409EFF;
background-color: #e5f3fe;
// margin-bottom: 16rpx;
}
.urgent-lable {
color: #E6A23C;
border: 1px solid #E6A23C;
background-color: #fef6e5;
}
.important-lable {
color: #F56C6C;
border: 1px solid #F56C6C;
background-color: #fee5e5;
}
.title {
width: unset;
flex: 1;
min-width: 0;
}
}
}
</style>