chenrui 2 年之前
父節點
當前提交
99316aa746
共有 1 個文件被更改,包括 100 次插入95 次删除
  1. 100 95
      components/customPicker/redioPicker.vue

+ 100 - 95
components/customPicker/redioPicker.vue

@@ -1,16 +1,19 @@
 <template>
 	<view>
-		<u-popup v-model="isShow" @close="isShow = false" mode="bottom" safe-area-inset-bottom border-radius="20" >
+		<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" v-if="dataList.length>0">
-					<view class="choose-list u-flex u-row-between" v-for="(item,i) in dataList" :key="item.id" @click="getChooseItem(i)">
-						<view>{{item.dispName}}</view>
-						<u-icon v-show="chooseFlag==i" name="checkbox-mark" color="#2979ff" size="28"></u-icon>
+				<view class="con" v-if="dataList.length > 0">
+					<view class="choose-list u-flex u-row-between" v-for="(item, i) in dataList" :key="item.id">
+						<view>{{ item.dispName }}</view>
+						<!-- <u-icon v-show="chooseFlag==i" name="checkbox-mark" color="#2979ff" size="28"></u-icon> -->
+						<u-radio-group v-model="chooseVal">
+							<u-radio :name="item.code" @change="getChooseItem"></u-radio>
+						</u-radio-group>
 					</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 class="confimStyle" :style="{ background: $config('primaryColor'), color: '#fff' }" @click="submit">确定</view>
 				</view>
 			</view>
 		</u-popup>
@@ -18,109 +21,111 @@
 </template>
 
 <script>
-	import { getLookUpDatas } from '@/api/data';
-	export default{
-		props:{
-			showModal:{
-				type: Boolean,
-				default: false
-			},
-			code:{
-				type: String,
-				default: ''
-			},
-			val:{
-				type: String,
-				default: ''
-			}
+import { getLookUpDatas } from '@/api/data';
+export default {
+	props: {
+		showModal: {
+			type: Boolean,
+			default: false
 		},
-		data(){
-			return{
-				isShow:this.showModal,
-				chooseObj:null,
-				chooseFlag:-1,
-				dataList:[]
-			}
+		code: {
+			type: String,
+			default: ''
 		},
-		methods:{
-			getList(){
-				getLookUpDatas({
-				  lookupCode: this.code,pageNo:1,pageSize:1000
-				}).then(result => {
-				  if (result && result.status + '' === '200') {
-				    this.dataList = result.data.list
+		val: {
+			type: String,
+			default: ''
+		}
+	},
+	data() {
+		return {
+			isShow: this.showModal,
+			chooseObj: null,
+			chooseVal: null,
+			dataList: []
+		};
+	},
+	methods: {
+		getList() {
+			getLookUpDatas({
+				lookupCode: this.code,
+				pageNo: 1,
+				pageSize: 1000
+			}).then(result => {
+				if (result && result.status + '' === '200') {
+					this.dataList = result.data.list;
 					//勾选上次选中值
-					if(this.val){
-						let pos=result.data.list.findIndex(item=>{
-							return item.code == this.val
-						})
-						if(pos != -1){
-							this.chooseFlag = pos
-						}
+					if (this.val) {
+						this.chooseVal = this.val;
 					}
-				  }
-				})
-			},
-			submit(index){
-				if(this.chooseFlag == -1){
-					this.chooseObj = null
-				}
-				this.$emit('chooseItem',this.chooseObj)
-				this.isShow = false
-			},
-			getChooseItem(index){
-				if(this.chooseFlag == index){
-					this.chooseFlag = -1
-				}else{
-					this.chooseFlag = index
 				}
-				this.chooseObj=this.dataList[index]
+			});
+		},
+		submit(index) {
+			if (!this.chooseVal) {
+				this.chooseObj = null;
 			}
+			this.$emit('chooseItem', this.chooseObj);
+			this.isShow = false;
 		},
-		watch:{
-			//  父页面传过来的弹框状态
-			showModal (newValue, oldValue) {
-				this.isShow = newValue
-			},
-			//  重定义的弹框状态
-			isShow (newValue, oldValue) {
-				if (!newValue) {
-					this.$emit('close')
-				}else{
-					this.getList();
-				}
+		getChooseItem(e) {
+			if (this.chooseVal == e) {
+				this.chooseVal ='';
+			} else {
+				this.chooseVal = e;
+			}
+			const index = this.dataList.findIndex(item => {
+				return item.code == e;
+			});
+			this.chooseObj = this.dataList[index];
+		}
+	},
+	watch: {
+		//  父页面传过来的弹框状态
+		showModal(newValue, oldValue) {
+			this.isShow = newValue;
+		},
+		//  重定义的弹框状态
+		isShow(newValue, oldValue) {
+			if (!newValue) {
+				this.$emit('close');
+			} else {
+				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;
-				}
+.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;
 			}
-		}
-		.btn{
-			border-top: 1rpx solid #efefef;
-			.cancleStyle,.confimStyle{
-				width: 50%;
-				text-align: center;
-				height: 89rpx;
-				line-height: 89rpx;
-				text-align: center;
+			.u-radio{
+				display: inline-block !important;
 			}
-			
 		}
-		
 	}
-</style>
+	.btn {
+		border-top: 1rpx solid #efefef;
+		.cancleStyle,
+		.confimStyle {
+			width: 50%;
+			text-align: center;
+			height: 89rpx;
+			line-height: 89rpx;
+			text-align: center;
+		}
+	}
+}
+</style>