From e23a1db0b60437f17d09d65c65f8fd0c8a5d88c7 Mon Sep 17 00:00:00 2001
From: jiangping <jp@doumee.com>
Date: 星期一, 26 八月 2024 18:11:07 +0800
Subject: [PATCH] 最新版本
---
h5/pages/staff/vehicle/applePeo.vue | 172 ++++++++++++++++++++++++++++++++++++--------------------
1 files changed, 110 insertions(+), 62 deletions(-)
diff --git a/h5/pages/staff/vehicle/applePeo.vue b/h5/pages/staff/vehicle/applePeo.vue
index 2f62cce..ec74350 100644
--- a/h5/pages/staff/vehicle/applePeo.vue
+++ b/h5/pages/staff/vehicle/applePeo.vue
@@ -1,5 +1,5 @@
<template>
- <view class="main_app">
+ <view class="main_app" :class="{ popupShow: isShowSelMem }">
<view class="search_inp df_ac">
<image
class="mr12 search"
@@ -15,30 +15,38 @@
/>
</view>
<view class="member_list">
- <checkbox-group v-model="selList" @change="changeMem">
- <view v-for="item in memberList" :key="item.id" class="line">
- <image
- :src="
- item.faceImgFull
- ? item.faceImgFull
- : require('@/static/logo@2x.png')
- "
- class="avatar"
- mode=""
- ></image>
- <view class="content">
- <view class="info">
- <text class="name">{{ item.name }}</text>
- <!-- <text class="tag">tag</text> -->
- </view>
- <view class="depart">{{ item.companyName }}</view>
+ <view v-for="(item, index) in memberList" :key="item.id" class="line">
+ <image
+ v-if="item.faceImgFull"
+ :src="item.faceImgFull"
+ class="avatar"
+ mode=""
+ ></image>
+ <view v-else class="avatar">{{ item.name.slice(0, 1) }}</view>
+ <view class="content">
+ <view class="info">
+ <text class="name">{{ item.name }}</text>
+ <!-- <text class="tag">tag</text> -->
</view>
- <label>
- <checkbox :checked="item.checked" :value="String(item.id)" class="checkbox" />
- </label>
- <text></text>
+ <view class="depart">{{ item.companyName }}</view>
</view>
- </checkbox-group>
+ <image
+ @click="changeMem(item, index)"
+ v-if="item.checked"
+ src="@/static/checkbox_sel@2x.png"
+ mode="widthFix"
+ class="checked"
+ ></image>
+ <image
+ @click="changeMem(item, index)"
+ v-if="!item.checked"
+ src="@/static/meeting/icon/ic_choose@2x.png"
+ mode="widthFix"
+ class="checked"
+ ></image>
+ <text></text>
+ </view>
+
<view class="empty"></view>
</view>
<!-- -->
@@ -55,19 +63,19 @@
mode=""
></image>
</view>
- <view class="btn" @click="onSubmit">纭({{selList.length}}/20)</view>
+ <view class="btn" @click="onSubmit">纭</view>
</view>
<!-- -->
<u-popup
:show="isShowSelMem"
:round="12"
mode="bottom"
- @close="isShowSelMem = false"
+ @close="closeModal"
>
<view class="modal">
<view class="modal_header">
<text class="status">宸查�夋嫨锛歿{ selList.length }}浜�</text>
- <text class="btn" @click="isShowSelMem = false">纭</text>
+ <text class="btn" @click="subSelMem">纭</text>
</view>
<view class="modal_mem_list">
<view class="line" v-for="(item, i) in selList" :key="i">
@@ -86,7 +94,7 @@
</view>
<view class="depart">{{ item.componey }}</view>
</view>
- <view class="btn" @click="handleRemove(item)">绉婚櫎</view>
+ <view class="btn" @click="handleRemove(i)">绉婚櫎</view>
</view>
</view>
</view>
@@ -100,59 +108,92 @@
data() {
return {
memberList: [],
- selList: [],
param: {},
+ selList: [],
- isShowSelMem: false
+ isShowSelMem: false,
+ pagination: {
+ capacity: 20,
+ page: 1
+ },
}
},
onLoad() {
this.initData()
},
- methods: {
- onSubmit() {
- this.$eventBus.$emit('applePeo', this.selList)
- uni.navigateBack()
- },
- changeMem(e) {
- const arr = e.detail.value
- let arrTemp = arr.map(item => {
- let obj = {}
- this.memberList.forEach(ite => {
- if (item == ite.id) {
- obj.name = ite.name.split('-')[0]
- obj.componey = ite.name.split('-')[1] || ''
- obj.id = ite.id
+ onReachBottom() {
+ // if(){}
+ },
+ mounted() {
+ this.$eventBus.$on('applePeoDetail', (res) => {
+ res.forEach(item => {
+ this.memberList.forEach(mem => {
+ if (item.id === mem.id) {
+ mem.checked = !mem.checked
}
})
- return obj
})
- this.selList = arrTemp
- // this.$forceUpdate()
- },
- handleRemove(item) {
- const selIndex = this.selList.findIndex(i => i.id === item.id)
- this.selList.splice(selIndex, 1)
- this.memberList.forEach(ite => {
- if(item.id === ite.id){
- ite.checked = false
- }
+ this.selList = this.memberList.filter(i => i.checked)
+ this.$nextTick(() => {
+ this.$forceUpdate()
})
- // console.log(this.memberList);
- this.$forceUpdate()
- },
+ })
+ },
+ methods: {
initData() {
const { param } = this
findTypeMemberInfo({
+ // model: {
name: param.name,
- type: '2'
+ // },
+ type: '2',
+ companyType: 1,
}).then(res => {
this.memberList = res.data || []
this.memberList.forEach(i => {
i.checked = false
})
})
- }
+ },
+ onSubmit() {
+ if (this.selList.length === 0) return uni.showToast({
+ title: '璇峰厛閫夋嫨浜哄憳',
+ icon: 'none'
+ })
+ this.$eventBus.$emit('applePeo', this.selList)
+ uni.navigateBack()
+ },
+ closeModal() {
+ this.selList = this.memberList.filter(i => i.checked)
+ this.isShowSelMem = false
+ },
+ subSelMem() {
+ const { selList, memberList } = this
+ memberList.forEach(ite => {
+ ite.checked = false
+ selList.forEach(item => {
+ if (ite.id === item.id) {
+ ite.checked = true
+ } else { }
+ })
+ })
+ this.isShowSelMem = false
+ this.$forceUpdate()
+ },
+ changeMem(item, index) {
+ // this.memberList.forEach(mem => {
+ // if(item.id === mem.id){
+ // item.checked = !item.checked
+ // }
+ // })
+ item.checked = !item.checked
+ this.selList = this.memberList.filter(i => i.checked)
+ this.$forceUpdate()
+ },
+ handleRemove(i) {
+ this.selList.splice(i, 1)
+ this.$forceUpdate()
+ },
}
};
</script>
@@ -160,18 +201,22 @@
<style lang="scss">
.modal {
padding: 40rpx 30rpx;
+ max-height: 1000rpx;
.modal_header {
display: flex;
justify-content: space-between;
align-items: center;
+ padding-bottom: 20rpx;
.status {
font-weight: 600;
}
.btn {
- color: #279baa;
+ color: $uni-color-primary;
}
}
.modal_mem_list {
+ max-height: 860rpx;
+ overflow: auto;
.line {
display: flex;
align-items: center;
@@ -225,7 +270,7 @@
align-items: center;
.members {
width: 500rpx;
- color: #4d98a7;
+ color: $uni-color-primary;
white-space: nowrap;
overflow: hidden; //鏂囨湰瓒呭嚭闅愯棌
text-overflow: ellipsis;
@@ -240,7 +285,7 @@
width: 690rpx;
height: 88rpx;
line-height: 88rpx;
- background: #279baa;
+ background: $uni-color-primary;
border-radius: 44rpx;
color: #fff;
text-align: center;
@@ -282,6 +327,9 @@
}
}
}
+ .checked {
+ width: 48rpx;
+ }
}
.empty {
width: 100%;
--
Gitblit v1.9.3