wjt
2024-06-27 69a74309ed12cc13f0fa9fb90c5bffad17ade360
policy/policyApply/perPage.vue
@@ -2,12 +2,23 @@
   <u-popup mode="button" :safeAreaInsetBottom="false" :show="show" @close="close" @open="open" z-index="8000" bgColor="#fff">
      <view class="bg-box">
         <view class="title">选择随行人员</view>
         <u-checkbox-group     iconPlacement="right"  v-model="checkboxValue1" placement="column" @change="checkboxChange">
            <u-checkbox :customStyle="{marginBottom: '40rpx', }" v-for="(item, index) in checkboxList1" :key="index"
                :name="item.userId" :label="`${item.dept.deptName}--${item.nickName}`">
            </u-checkbox>
         </u-checkbox-group>
         <view class="set-flex set-flex-content-between">
         <u-search v-model="nickName" @search="enforceList" @clear="clearContent" @confirm="enforceList" @custom="enforceList()"></u-search>
         <scroll-view scroll-y="true" style="height: 600rpx;margin-top: 20rpx;">
            <view v-if="checkboxList1.length">
               <u-checkbox-group     iconPlacement="right"  v-model="checkboxValue1" placement="column" @change="checkboxChange">
                  <u-checkbox :customStyle="{marginBottom: '40rpx', }" v-for="(item, index) in checkboxList1" :key="index"
                      :name="item.userId" :label="`${item.dept.deptName}--${item.nickName}`">
                  </u-checkbox>
               </u-checkbox-group>
            </view>
            <view class="set-color" v-else>
               <view class="set-center">
                  <u-icon name="file-text" size="30" color="gray"></u-icon>
                  <view style="width: 100%;margin-top: 20rpx;">暂无数据</view>
               </view>
            </view>
         </scroll-view>
         <view class="set-flex set-flex-content-between down-options">
            <view class="button-per">
               <u-button @click="close">取消</u-button>
            </view>
@@ -20,13 +31,14 @@
</template>
<script>
   import { enforceList } from '@/api/policy.js'
   export default {
      props: {
         list: {
            type: Array,
            default: () => []
         }
      },
      // props: {
      //    list: {
      //       type: Array,
      //       default: () => []
      //    }
      // },
      data() {
         return {
            show: false,
@@ -34,18 +46,23 @@
            // 基本案列数据
            checkboxList1: [
            ],
            nickName: ""
         }
      },
      watch: {
         list: {
            handler(n) {
            this.checkboxList1 = n
            },
            immediate: true
         }
         // list: {
         //    handler(n) {
         //       this.checkboxList1 = n
         //    },
         //    immediate: true
         // }
      },
      methods: {
         clearContent() {
            this.companyName = ""
            this.enforceList()
         },
         checkboxChange(n) {
            // console.log('change', n);
         },
@@ -53,13 +70,30 @@
            this.show = false
         },
         open(list) {
            this.show = true
            this.enforceList()
         },
         enteryResult() {
            this.$emit('selectValue', this.checkboxValue1)
            let list = []
            this.checkboxList1.forEach(item => {
               if(this.checkboxValue1.includes(item.userId)) {
                  list.push({
                     peerDeptId: item.dept.deptId,
                     peerDeptName: item.dept.deptName,
                     peerId: item.userId,
                     peerPhone: item.phonenumber,
                     peerType: 2,
                     peerUser: item.nickName
                  })
               }
            })
            this.$emit('selectValue', list)
            this.close()
            console.log(44)
         },
         enforceList() {
            enforceList({nickName: this.nickName}).then(val => {
               this.checkboxList1 = val.data.data
            })
         }
      }
   }
@@ -71,10 +105,12 @@
      bottom: 0;
      background-color: white;
      border-radius: 20rpx 20rpx 0 0;
      padding: 20rpx 32rpx;
      padding: 20rpx 32rpx 240rpx;
      z-index: 1000000;
      width: 100%;
      box-sizing: border-box;
      min-height: 400rpx;
      max-height: 800rpx;
   }
   .title{
      font-size: 36rpx;
@@ -84,4 +120,26 @@
   .button-per{
      width: 48%;
   }
   .down-options{
      position: fixed;
      bottom: 40rpx;
      width: 100%;
      box-sizing: border-box;
      padding: 0 32rpx;
      left: 0;
   }
   .set-color{
      color: gray;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 300rpx;
   }
   .set-center{
      display: flex;
      justify-content: center;
      align-items: center;
      flex-wrap: wrap;
   }
</style>