circulation_ancientCoins_new/components/userCard.vue

<template>
  <view :class="'user-card-com'+(!showuinfo?' popup-user-card':'')">
		<uni-card :title="dataitem.name" extra="身份证：9098******8778" margin="0 10rpx 20rpx 10rpx" shadow="none" :border="false" padding="24rpx 0 0 0">
			<view>
				<uni-data-checkbox mode="button" v-model="type" :localdata="types" @change="changeType"></uni-data-checkbox>
			</view>

			<view class="bed-wrapper" v-show="type == 1">
				<uni-easyinput v-model="value" placeholder="请输入床位位置" placeholderStyle="color: #999999;font-size: 30rpx;" :trim="true"></uni-easyinput>
			</view> 

			<view class="card-cus-txt" v-if="type == 0">
				首次就诊，建议等待医生叫号
			</view>

			<view class="card-cus-txt" v-else>
				没有找到床位，可不填写位置
			</view>

		</uni-card>
  </view>
</template>

<script>
export default {
  name: "visitorList",
  props: {
		add:{
			type:Boolean,
			default:()=>false
		},
		showuinfo:{
			type:Boolean,
			default:()=>true
		},
		dataitem:{
			type:Object,
			default:()=>{}
		},
		index:{
			type:Number,
			default:()=>-1
		},
  },
  data() {
    return {
			cssUrl:this.cssUrl,
			value:'',
			type: 0,
			types: [{
				text: '等医生叫号',
				value: 0
			}, {
				text: '找床位候诊',
				value: 1
			}],
    }
  },
  methods: {
		confirm() {
		},
		changeType(e) {
			var obj = new Object()
			obj.key = this.index
			obj.type = this.type
			this.$emit('clickEvent', obj)
		},
		setType(typeval) {
			this.value = typeval
		}
  }
};

</script>

<style lang="scss" scoped>
	.user-card-com{
		width: 100%;
		height: auto;
		overflow: hidden;

		&.popup-user-card{
			/deep/ {
				.uni-card__header{
					display: none !important;
				}
				.uni-card{
					padding: 0 32rpx 0rpx 32rpx !important;
					margin-bottom: 0rpx !important;
				}
				.uni-card__content{
					padding: 0 !important;
				}
				.checklist-group{
					margin-bottom: 46rpx !important;
				}
				.card-cus-txt{
					margin-bottom: 42rpx;
				}
				.uni-easyinput{
					margin-bottom: 46rpx;
				}
			}
		}

		/deep/ {
				.uni-easyinput{
					margin-bottom: 24rpx;
					.uni-easyinput__content-input{
						padding-left: 24rpx !important;
						color: #333333;
						font-size: 30rpx;
						line-height: 30rpx;
						letter-spacing: 0.22rpx;
						height: 86rpx;
						line-height: 86rpx;
						display: flex;
						align-items: center;
						position: relative;
						top: -2rpx;
					}
					.is-input-border{
						border: 2rpx solid #DCDCDC !important;
					}
					.is-input-border.is-focused{
						border-color: #39D067 !important;
						.uni-icons.content-clear-icon.uniui-clear{
							color: #39D067 !important;
						}
					}
				}
				.uni-card{
					border-radius: 0;
					padding: 32rpx !important;
					.uni-data-checklist .checklist-group {
						column-gap: 24rpx;
						margin-bottom: 24rpx;
						.checklist-box{
							margin: 0;
							width: calc(50% - 14rpx);
							box-sizing: border-box;
							.checklist-content .checklist-text{
								font-size: 30rpx;
								font-weight: normal;
								letter-spacing: 0.22rpx;
								margin-left: 12rpx;
								color: #666666;
							}
							
							.radio__inner{
								width: 36rpx;
								height: 36rpx;
								border: 2rpx solid #BCBCBC;
								border-radius: 36rpx;
							}
							
							&.is--button{
								margin-right: 0rpx;
								padding: 20rpx;
								border: none;
								min-height: 82rpx;
								border-radius: 8rpx;
								transition: border-color 0.2s;
								background: #F8F8F8;
								&.is-checked{
									background: #F5FFF4;
									.radio__inner{
										border-color: #00C160;
									}
									.radio__inner-icon{
										background: #00C160;
									}
									.checklist-text{
											color: #333333;
									}
								}
							}
						}
					}
					.card-cus-txt{
						font-size: 24rpx;
						font-weight: normal;
						line-height: 34rpx;
						height: 34rpx;
						letter-spacing: 1.77rpx;
						color: #666666;
						text-align: center;
					}
					.uni-card__header{
						border: none;
						padding: 0;
						.uni-card__header-extra .uni-card__header-extra-text{
							font-size: 24rpx;
							font-weight: normal;
							line-height: normal;
							letter-spacing: 0.14rpx;
							color: #949699;
						}

						.uni-card__header-content .uni-card__header-content-title{
							font-weight: 600;
							line-height: 42rpx;
							font-size: 32rpx;
							color: #333333;
							&:before{
								content: '';
								display: inline-block;
								width: 8rpx;
								height: 34rpx;
								z-index: 0;
								border-radius: 10rpx;
								background: #58CA7F;
								position: relative;
								top: 5rpx;
								margin-right: 12rpx;
							}
						}
					}
				}
			}
	}

</style>