<template>
	<view v-if="isSlider" class="wrapper">
		<view class="bg" @click="onTap">
			<view class="edit" @click.stop>
				<view class="title">分数占比设置</view>
				<view class="editem">
					<view class="left">身体指数</view>
					<view class="right">
						<slider @change="sliderChange" value="10" show-value block-size="12" block-color="#007aff">
						</slider>
					</view>
				</view>
				<view class="editem">
					<view class="left">1分钟跳绳</view>
					<view class="right">
						<slider @change="sliderChange($event,2)" value="40" show-value block-size="12"
							block-color="#007aff"></slider>
					</view>
				</view>
				<view class="editem">
					<view class="left">肺活量</view>
					<view class="right">
						<slider @change="sliderChange" value="60" show-value block-size="12" block-color="#007aff">
						</slider>
					</view>
				</view>
				<view class="tips">
					*所有项目评分占比和为100%
				</view>
				<view class="btn close" @click="onTap()">取消</view>
				<view class="btn" @click="handleTarget">确定</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from "vuex";
	export default {
		data() {
			return {
				regTime: "",
				number1: '',
				number2: "",
				number3: ""
			}
		},
		computed: {
			...mapState(["user", "isSlider"]),
		},
		methods: {
			// 手动记录
			handleTarget() {
				let that = this
				if (!that.regTime) {
					that.$tools.msg("请选择测量日期")
					return
				}
				if (!that.weight) {
					that.$tools.msg("请输入测量体重")
					return
				}
				that.$model.getinsertmeasure({
					familyid: that.user.familyid,
					time: that.regTime,
					weight: that.weight,
				}).then(res => {
					if (res.code != 0) return
					that.$tools.msg(res.msg)
					that.$store.commit("changeSlider", false);
					that.$store.dispatch("getResult", {
						birthday: that.user.birthday,
						familyid: that.user.familyid,
						height: that.user.height,
						sex: that.user.sex,
					})
					that.$store.dispatch("getUserInfo", {
						familyid: that.user.familyid,
					})
					that.$emit("getList", this.startDate, this.endDate)
					that.regTime = ""
					that.weight = ""
				})
			},
			//
			sliderChange(event, ind) {
				console.log('value 发生变化：', e.detail.value, ind)
			},
			onTap() {
				this.regTime = ""
				this.number1 = ""
				this.number2 = ""
				this.number3 = ""
				this.$store.commit("changeSlider", false);
			},
		}
	}
</script>

<style scoped lang="scss">
	.edit {
		width: 75%;
		padding: 15px;

		.editem {
			padding: 0 !important;
			background: #fff !important;

			.right {
				width: 72% !important;
			}

			/deep/slider {
				width: 100%;
				padding: 0 !important;
				margin: 0 !important;
			}
		}
	}

	.btn {
		width: 40%;
		float: right;
		margin-top: 15px;
		background: $maincolor !important;
	}

	.edit {
		top: 20%
	}

	.close {
		background: #dfdfdf !important;
		float: left;
	}
</style>