<template>
	<!-- 问诊信息 -->
	<view>
		<view style="padding: 20rpx;">
			<x-steps :current="1" :list="tionList"></x-steps>
		</view>
		<view class="card_head_hint">
			<view class="circle_icon">
				<u-icon name="info-circle" size="20"></u-icon>
			</view>
			<view class="message_circle">您的信息将严格保密，仅开方使用，处方药需凭方购买，补充信息后医生将为您开具处方</view>
		</view>
		<x-commodity :commodityData="commodityData"></x-commodity>
		<!-- <view class="btn_subsequent">去复诊开方</view> -->
		<x-bottomBtn title="去复诊开方" :writtenConsent="true" @buttonClick="buttonClick"></x-bottomBtn>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tionList: [{
					id: 1,
					title: '填写信息',
				}, {
					id: 2,
					title: '医生开方',
				}, {
					id: 3,
					title: '提单购买',
				}],
				commodityData: [{
					shopName: '国药控股大药房',
					drugData: [{
						title: '维生素c片',
						specification: '0.3gx24粒',
						price: 45,
						num: 4,
					}, {
						title: '布洛芬缓释胶囊',
						specification: '0.3gx24粒',
						price: 45,
						num: 4,
					}]
				}]
			}
		},
		methods: {
			// 开方
			buttonClick() {
				uni.navigateTo({
					url: '/pages/medicine/extractionRoot'
				});
			}
		}
	}
</script>

<style lang="scss">
	.card_head_hint {
		display: flex;
		align-items: flex-start;
		padding: 0rpx 20rpx 0rpx 20rpx;
	}

	.circle_icon {
		margin-top: 4rpx;
	}

	.message_circle {
		color: #909399;
		font-size: 28rpx;
		margin-left: 8rpx;
	}

	.btn_subsequent {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}
</style>