Merge remote-tracking branch 'origin/master'

k94314517

2024-09-20 cd2d3c65b9af62cbafa57a835b237a9f193148f2

 h5/pages/staff/meetingSel.vue

@@ -1,27 +1,13 @@
<template>
  <view class="main_app" :class="{ popupShow: isShowSelMem }">
    <view class="search_inp df_ac">
      <image
        class="mr12 search"
        src="../../static/ic_search@2x.png"
        mode="widthFix"
      ></image>
      <input
        v-model="param.keyword"
        @blur="initData()"
        type="text"
        placeholder="搜索"
        placeholder-style="color: #999999;"
      />
         <image class="mr12 search" src="../../static/ic_search@2x.png" mode="widthFix"></image>

         <input v-model="param.keyword" @blur="initData()" type="text" placeholder="搜索"

            placeholder-style="color: #999999;" />

    </view>
    <view class="member_list">
      <view v-for="(item, index) in memberList" :key="item.id" class="line">
        <image
          v-if="item.avatar"
          :src="item.prefixUrl + item.avatar"
          class="avatar"
          mode=""
        ></image>
            <image v-if="item.avatar" :src="item.prefixUrl + item.avatar" class="avatar" mode=""></image>

        <view v-else class="avatar">{{ item.realname.slice(0, 1) }}</view>
        <view class="content">
          <view class="info">
@@ -30,20 +16,10 @@
          </view>
          <view class="depart">{{ item.departmentName }}</view>
        </view>
        <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>
            <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>
@@ -53,42 +29,23 @@
      <view class="sel_mem">
        <text>已选择：</text>
        <view class="members">
          <text v-for="(item, i) in selList" :key="i"
            >{{ item.realname }}；</text
          >
               <text v-for="(item, i) in selList" :key="i">{{ item.realname }}；</text>

        </view>
        <image
          @click="isShowSelMem = true"
          class="open_icon"
          src="../../static/staff/renyuan_ic_open.png"
          mode=""
        ></image>
            <image @click="openSeleter" class="open_icon" src="../../static/staff/renyuan_ic_open.png" mode=""></image>

      </view>
      <view class="btn" @click="onSubmit"
        >确认({{ selList.length }}/{{ param.limitNum }})</view
      >
         <view class="btn" @click="onSubmit">确认({{ selList.length }}/{{ param.limitNum }})</view>

    </view>
    <!--  -->
    <u-popup
      catchtouchmove
      :show="isShowSelMem"
      :round="12"
      mode="bottom"
      @close="closeModal"
    >
      <u-popup catchtouchmove :show="isShowSelMem" :round="12" mode="bottom" @close="closeModal">

      <view class="modal">
        <view class="modal_header">
          <text class="status">已选择：{{ selList.length }}人</text>
               <text class="status">已选择：{{ selList.filter(i => i.checkedTemp).length }}人</text>

          <text class="btn" @click="subSelMem">确认</text>
        </view>
        <view class="modal_mem_list">
          <view class="line" v-for="(item, i) in selList" :key="i">
            <image
              v-if="item.avatar"
              :src="item.prefixUrl + item.avatar"
              class="avatar"
              mode=""
            ></image>
               <template v-for="(item, i) in selList">

                  <view class="line" v-if="item.checkedTemp">

                     <image v-if="item.avatar" :src="item.prefixUrl + item.avatar" class="avatar" mode=""></image>

            <view v-else class="avatar">{{ item.realname.slice(0, 1) }}</view>
            <view class="content">
              <view class="info">
@@ -98,6 +55,7 @@
            </view>
            <view class="btn" @click="handleRemove(i)">移除</view>
          </view>
               </template>

        </view>
      </view>
    </u-popup>
@@ -105,7 +63,9 @@
</template>

<script>
import { userPagePost } from '@/api'
   import {

      userPagePost

   } from '@/api'

import dayjs from 'dayjs'
export default {
  data() {
@@ -155,62 +115,69 @@
      uni.navigateBack()
    },
    changeMem(item, index) {
      const { selList, param } = this
      if (this.selList.length == param.limitNum && !item.checked) return uni.showToast({
        title: `该会议可容纳${param.limitNum}人`,
        icon: 'none'
      })
            // const { selList, param } = this

            // if (this.selList.length == param.limitNum && !item.checked) return uni.showToast({

            //   title: `该会议可容纳${param.limitNum}人`,

            //   icon: 'none'

            // })

            // item.checked = !item.checked

            // this.selList = this.memberList.filter(i => i.checked)

            // // 
      item.checked = !item.checked
      this.selList = this.memberList.filter(i => i.checked)
      // 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
      //     }
      //   })
      //   return obj
      // })
      // this.selList = arrTemp
            const i = this.selList.findIndex(a => a.id === item.id)

            if (item.checked && i === -1) {

               this.selList.push(item)

            } else {

               this.selList.splice(i, 1)

            }

            this.$forceUpdate()

         },

         openSeleter() {

            this.isShowSelMem = true

            this.selList.forEach(item => {

               item.checkedTemp = true

            })

      this.$forceUpdate()
    },
    initData() {
      const { param, pagination } = this
            const {

               param,

               pagination

            } = this

      userPagePost({
        model: { ...param },
               model: {

                  ...param

               },

        ...pagination,

      }).then(res => {
        this.memberList = res.data.records || []
        this.memberList.map(i => {
          i.checked = false
               this.memberList.forEach(i => {

                  const index = this.selList.findIndex(ite => ite.id === i.id)

                  i.checked = index > -1

        })
      })
    },
    closeModal() {
      this.selList = this.memberList.filter(i => i.checked)
            this.selList.forEach(item => {

               item.checkedTemp = true

            })

      this.isShowSelMem = false
    },
    subSelMem() {
      const { selList, memberList } = this
            const {

               memberList

            } = this

            this.selList = this.selList.filter(i => i.checkedTemp)

      memberList.forEach(ite => {
        ite.checked = false
        selList.forEach(item => {
          if (ite.id === item.id) {
            ite.checked = true
          } else { }
        })
               const index = this.selList.findIndex(i => i.id === ite.id)

               ite.checked = index > -1

      })
      this.isShowSelMem = false
      this.$forceUpdate()
    },
    handleRemove(i) {
      this.selList.splice(i, 1)

      // console.log(this.memberList);
            this.selList[i].checkedTemp = false

      this.$forceUpdate()
    },
  }
@@ -221,26 +188,32 @@
.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: $uni-color-primary;
    }
  }


  .modal_mem_list {
    max-height: 860rpx;
    overflow: auto;


    .line {
      display: flex;
      align-items: center;
      border-bottom: 1rpx solid #e5e5e5;
      padding: 30rpx 0;


      .avatar {
        width: 64rpx;
        height: 64rpx;
@@ -253,20 +226,25 @@
        background-color: $uni-color-primary;
        color: #fff;
      }


      .content {
        flex: 1;


        .depart {
          font-size: 24rpx;
          color: #666666;
        }


        .info {
          display: flex;
          margin-bottom: 16rpx;


          .name {
            font-size: 30rpx;
          }
        }
      }


      .btn {
        width: 80rpx;
        height: 48rpx;
@@ -280,6 +258,7 @@
    }
  }
}


.sub_wrap {
  position: fixed;
  bottom: 0;
@@ -288,9 +267,11 @@
  width: 100%;
  box-shadow: 0rpx 0rpx 6rpx 0rpx #b2b2b2;
  padding: 30rpx 30rpx 64rpx;


  .sel_mem {
    display: flex;
    align-items: center;


    .members {
      width: 500rpx;
      color: $uni-color-primary;
@@ -299,11 +280,13 @@
      text-overflow: ellipsis;
      margin-right: 20rpx;
    }


    .open_icon {
      width: 44rpx;
      height: 44rpx;
    }
  }


  .btn {
    width: 690rpx;
    height: 88rpx;
@@ -315,12 +298,14 @@
    margin-top: 22rpx;
  }
}


.member_list {
  .line {
    display: flex;
    align-items: center;
    border-bottom: 1rpx solid #e5e5e5;
    padding: 30rpx 0;


    .avatar {
      width: 64rpx;
      height: 64rpx;
@@ -328,18 +313,23 @@
      overflow: hidden;
      margin-right: 20rpx;
    }


    .content {
      flex: 1;


      .depart {
        font-size: 24rpx;
        color: #666666;
      }


      .info {
        display: flex;
        margin-bottom: 16rpx;


        .name {
          font-size: 30rpx;
        }


        .tag {
          font-size: 24rpx;
          border-radius: 4rpx;
@@ -352,23 +342,28 @@
        }
      }
    }


    .checked {
      width: 48rpx;
    }
  }


  .empty {
    width: 100%;
    height: 280rpx;
  }
}


.search_inp {
  height: 72rpx;
  background: #f7f7f7;
  border-radius: 4rpx;
  padding-left: 16rpx;


  .search {
    width: 28rpx;
  }


  input {
    flex: 1;
    font-size: 28rpx;