Просмотр исходного кода

app2.0 人员多选组件

长阳分支推送专用
杨晓琪 2 лет назад
Родитель
Сommit
fd52f2e123
5 измененных файлов: 86 добавлений и 16 удалений
  1. +6
    -1
      Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-app/organize-picker.vue
  2. +52
    -4
      Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-app/organize-single-item.vue
  3. +1
    -1
      Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-app/organize-tree.vue
  4. +2
    -1
      Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/PersonnelManagement/MeetingManagement/single.vue
  5. +25
    -9
      Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/common/select-organize-multiple.vue

+ 6
- 1
Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-app/organize-picker.vue Просмотреть файл

@@ -7,7 +7,12 @@

<!-- #ifndef MP-DINGTALK -->
<l-label @click="click" :arrow="!readonly" :required="required" :title="title">
{{ display || displayPlaceholder }}
<!-- {{ display || displayPlaceholder }} -->
<view style="white-space: normal;min-height: 54px;display: flex;align-items: center;justify-content: right;">
<view style="line-height: 24px;">
{{ display || displayPlaceholder }}
</view>
</view>
</l-label>
<!-- #endif -->
</template>


+ 52
- 4
Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-app/organize-single-item.vue Просмотреть файл

@@ -10,32 +10,80 @@
></image>

<!-- 名称 -->
<text class="tree-item-title">{{ item.name }}</text>
<text class="tree-item-title">{{ item.name + (item.mobile ? '(' +item.mobile + ')' : "") }}</text>

<!-- 用户标签 -->
<l-tag :line="tagColor" size="sm" class="margin-left-sm">{{ tagName }}</l-tag>
<uni-view v-if="item.type === 'user' && item.mobile" class="margin-left-sm sm line-gray cu-tag" style="z-index: 1;" @tap="copy(item.mobile)">复制</uni-view>

<!-- 如果开启选择按钮显示,并且级别符合,则显示按钮 -->
<view v-if="button" class="tree-item-action">
<l-button @click="$emit('buttonClick', item)" line="green" size="sm">选择</l-button>
<l-button v-if="!selectIds.includes(item.id)" @click="itemClick(item)" line="green" size="sm">选择</l-button>
<l-button v-else @click="itemClick(item)" line="blue" size="sm">取消选择</l-button>
</view>
</view>
</template>

<script>
import uniCopy from "@/common/js/uni-copy.js"
export default {
name: 'l-organize-single-item',

props: {
item: {},
button: {}
button: {},
value:{},
},
data(){
return{
selectIds:[],
}
},
created() {
this.init()
},

methods: {
init(){
if(this.value){
this.selectIds = this.value.split(",")
}
},
// 点击事件
click(e) {
this.$emit('click', e)
}
},
itemClick(root){
if(this.selectIds.indexOf(root.id) !== -1){
this.selectIds.splice(this.selectIds.indexOf(root.id),1)
}else{
this.selectIds.push(root.id)
}
this.$emit('buttonClick', root)
},
copy(mobile){
uniCopy({
content:mobile,
success:(res)=>{
uni.showToast({
title: "复制手机号成功~",
icon: 'none',
duration:3000,
})
},
error:(e)=>{
uni.showToast({
title: e,
icon: 'none',
duration:3000,
})
}
})
}
},

computed: {


+ 1
- 1
Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-app/organize-tree.vue Просмотреть файл

@@ -29,7 +29,7 @@
{{ tagName }}
</l-tag>
<!-- <uni-view v-if="root.type === 'user' && mobile" class="margin-left-sm sm line-gray cu-tag" style="z-index: 1;" @tap="copy(mobile)">复制</uni-view> -->
<uni-view v-if="root.type === 'user' && mobile" class="margin-left-sm sm line-gray cu-tag" style="z-index: 1;" @tap="copy(mobile)">复制</uni-view>

<!-- 开启按钮显示且级别对应,则显示按钮 -->
<view v-if="button && root.type === level" class="tree-item-action">


+ 2
- 1
Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/PersonnelManagement/MeetingManagement/single.vue Просмотреть файл

@@ -1,4 +1,4 @@
<template>
<template>
<view class="page">
<view v-if="ready">
<l-input
@@ -32,6 +32,7 @@
:readonly="!edit"
type="user"
title="会议记录者"
multiple
/>
<l-textarea
@input="setValue('MeetingManagement.Content', $event)"


+ 25
- 9
Learun.Framework.Ultimate V7/LearunApp-2.2.0/pages/common/select-organize-multiple.vue Просмотреть файл

@@ -2,24 +2,28 @@
<view id="contact" class="page">
<!-- 顶部搜索栏 -->
<view class="topSearch">
<l-banner v-model="searchText" :placeholder="placeholder" type="search" noSearchButton fill fixed />
<view class="">
<!-- <view style="padding-top: 54px;"> -->
<l-banner v-model="searchText" :placeholder="placeholder" type="search" noSearchButton fill />
<!-- </view> -->
<view>
<view class="pearson">
已选择人员:{{names||'暂无'}}
</view>
<view style="display: flex;justify-content: center;">
<view class="cu-btn sm line-green" @tap="itemConfirm" style="font-size: 16px;">
<view class="cu-btn sm line-red" @tap="itemClear" style="font-size: 16px;margin: 4px;">
清空选择
</view>
<view class="cu-btn sm line-green" @tap="itemConfirm" style="font-size: 16px;margin: 4px;">
确定选择
</view>
</view>
</view>
</view>

<!-- 树形列表 -->
<l-organize-tree v-if="type && !searchText" @buttonClick="itemClick" :level="type" :root="root" button :value="ids" />
<l-organize-tree v-if="type && !searchText && refreshFlag" @buttonClick="itemClick" :level="type" :root="root" button :value="ids" />
<!-- 如果用户输入了搜索关键字,只列出用户 -->
<view v-else-if="type" class="user-item-list">
<view v-else-if="type && refreshFlag" class="user-item-list">
<l-organize-single-item v-for="item of searchList" @buttonClick="itemClick" :key="item.id" :item="item" button :value="ids" />
</view>
</view>
@@ -36,6 +40,7 @@ export default {
root: { type: 'company', id: '0' },
items:[],
ids:'',
refreshFlag:true,
}
},

@@ -89,10 +94,20 @@ export default {
}
return arr
},
itemClear(){
this.items = []
this.ids = ''
this.refreshFlag = false
this.$nextTick(()=>{
this.refreshFlag = true
})
},

// 某一项被点击,触发事件
itemClick(item) {
this.items = this.findItem(this.items,item)
this.ids = this.items.map(t=>t.id).toString()
// this.EMIT('select-organize', item)
// this.NAV_BACK()
},
@@ -129,13 +144,14 @@ export default {
</script>

<style lang="scss">
page {
padding-top: 100rpx;
}
// page {
// padding-top: 100rpx;
// }
.topSearch{
.pearson{
color: #606266;
line-height: 32px;
padding: 6px 8px;
}
}
</style>

Загрузка…
Отмена
Сохранить