<template> <view> <u-popup v-model="isShow" @close="isShow = false" mode="bottom" safe-area-inset-bottom border-radius="20"> <view class="content flex flex_column"> <view class="con"> <view class="choose-list u-flex u-row-between" v-for="(item, i) in list" :key="item.id"> <view>{{ item.dispName }}</view> <!-- <u-icon v-show="item.isChecked" name="checkbox-mark" color="#2979ff" size="28"></u-icon> --> <u-checkbox v-model="item.checked" :name="item.code" @change="getChooseItem" size="36"></u-checkbox> </view> </view> <view class="btn u-flex"> <view class="cancleStyle" @click="isShow = false">取消</view> <view class="confimStyle" :style="{ background: $config('primaryColor'), color: '#fff' }" @click="submit">确定</view> </view> </view> </u-popup> </view> </template> <script> import { getLookUpDatas } from '@/api/data'; export default { props: { showModal: { type: Boolean, default: false }, code: { type: String, default: '' }, val: { type: String, default: '' }, filtrate:{ type: Boolean, default: false } }, data() { return { isShow: this.showModal, chooseObj: null, chooseFlag: -1, list: [], valInfo:this.val }; }, methods: { getList() { getLookUpDatas({ lookupCode: this.code, pageNo: 1, pageSize: 1000 }).then(result => { if (result && result.status == 200) { if(this.filtrate){//筛选业务状态 // 'WAIT_SUBMIT','WAIT_AUDIT' var selfArr=['WAIT_OUT_WAREHOUSE','FINISH'] result.data.list=result.data.list.filter((item,i)=>{ if(selfArr.includes(item.code)){ return item } }) result.data.list.splice() } if (this.valInfo) {//勾选上次选中值 var valArr = this.valInfo.split(','); result.data.list.forEach(value => { valArr.includes(value.code) ? value.checked=true:value.checked=false }); } this.list = result.data.list; } }); }, submit(index) { let arr = []; this.list.forEach(con => { if (con.checked) { arr.push(con); } }); if(arr.length == 0){ uni.showToast({ title:'参数值不能为空', icon:'none' }) }else{ this.$emit('chooseCon', arr); this.isShow = false; } }, getChooseItem(e) { const row = this.list.find(item => item.code == e.name) if(row){ row.checked = !row.checked this.list.splice() } } }, watch: { // 父页面传过来的弹框状态 showModal(newValue, oldValue) { this.isShow = newValue; }, // 重定义的弹框状态 isShow(newValue, oldValue) { if (!newValue) { this.$emit('close'); } else { this.valInfo= this.val this.getList(); } } } }; </script> <style lang="scss" scoped> .content { width: 100%; height: 100%; .con { flex-grow: 1; overflow: auto; padding: 0 40rpx; .choose-list { border-bottom: 1rpx solid #efefef; padding: 20rpx 0; &:last-child { border-bottom: 0rpx solid #efefef; } .u-checkbox{ display: inline-block !important; } } } .btn { border-top: 1rpx solid #efefef; .cancleStyle, .confimStyle { width: 50%; text-align: center; height: 89rpx; line-height: 89rpx; text-align: center; } } } </style>