<template>
	<view class="content">
			<view class="form-box">
				<!-- 设为默认地址 -->
				<view class="form-item">
					<text class="label">指标类型</text>
					<view class="switch align-center justify-center">
						<view v-for="(item,index) in tags" :key="index" :class="aIndex==index?'item active':'item'" @click="changeTag(item,index)">
							{{item.name}}
						</view>
					</view>
				</view>
				<view class="form-item">
					<text class="label">指标名称</text>
					<input type="text" v-model="form.indicatorName" placeholder="请输入名称" placeholder-class="form-input"/>
				</view>
				<view class="form-item">
					<text class="label">指标分类</text>
					<picker  class="birth-picker"  mode="selector" :range="list" range-key="dictLabel" @change="bindTagsChange($event,list)">
						<view class="right-box">
							<view class="input-box">
								<input type="text" :value="indicatorCategory" placeholder="请选择指标分类" placeholder-class="form-input" disabled="disabled" />
							</view>
							<image class="w48 h48" src="/static/images/health/right_arrow_right_icon24.png" mode=""></image>
						</view>
					</picker>
				</view>
				<view class="form-item">
					<text class="label">指标单位</text>
					<picker  class="birth-picker"  mode="selector" :range="cates" range-key="unitSymbol" @change="bindUnitChange($event,cates)">
						<view class="right-box">
							<view class="input-box">
								<input type="text" :value="unitName" placeholder="请选择指标单位" placeholder-class="form-input" disabled="disabled" />
							</view>
							<image class="w48 h48" src="/static/images/health/right_arrow_right_icon24.png" mode=""></image>
						</view>
					</picker>
				</view>
				<view class="form-item">
					<text class="label">参考值范围</text>
					<view class="align-center">
						<input type="digit" v-model="form.referenceMin" placeholder="数值下限" placeholder-class="form-input" class="input-width"/>
						<view class="to">-</view>
						<input type="digit" v-model="form.referenceMax" placeholder="数值上限"  placeholder-class="form-input" class="input-width"/>
					</view>
					
				</view>
				<view class="note">
					备注：若无参考值可不埌写,若该指标无上(下)限时可只填写其中一项
				</view>
			</view>
			
		<view class="btn-box2">
			<view  class="sub-btn" @click="submit()">
				确认
			</view>
		</view>
	</view>
</template>

<script>
	import {getDictByKey} from '@/api/common.js'
	import {addIndicator,updateIndicator,getListAll,getIndicatorById} from '@/api/companyUser.js'
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	export default {
		mixins: [MescrollMixin], 
		data() {
			return {
				orderStatus:[
					{name:"电话记录",val:1},
					{name:"短信记录",val:2},
				],
				unitName:null,
				indicatorCategory:null,
				aIndex:0,
				cates:[],
				tags:[{
					name:'数值',
					value:0
				},{
					name:'二元',
					value:1
				}],
				list:[],
				showType:1,
				mescroll:null,
				// 上拉加载的配置
				upOption: {
					onScroll:true,
					use: true, // 是否启用上拉加载; 默认true
					page: {
						num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
						size: 10 // 每页数据的数量,默认10
					},
					noMoreSize: 10, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
					empty: {
						icon:'/static/images/no_data.png',
						tip: '暂无数据'
					}
				},
				// 列表数据
				dataList: [
					{orderId:1, name:'今日 11:22',time:'4分16秒'},
					{orderId:2, name:'昨天 09:16',time:'4分16秒'},
					{orderId:3, name:'1月12 13:06',time:'4分16秒'}
				],
				dataList2: [
					{orderId:1,content:'服用胰岛素口服液 规格20mg*20 每次1片1日一次 用法口服',state:'已送达',time:'2025-2-20 10:29',},
					{orderId:2,content:'服用胰岛素口服液 规格20mg*20 每次1片1日一次 用法口服',state:'已送达',time:'2025-2-20 10:29',},
					{orderId:3,content:'服用胰岛素口服液 规格20mg*20 每次1片1日一次 用法口服',state:'已送达',time:'2025-2-20 10:29',}
				],
				form:{
					status:1,
				 // "indicatorCategory": "0",
				 type:0
				}
			}
		},
		onLoad(options) {
			this.type=options.type
			this.getDictByKey('user_custom_type')
			this.getListAll()
			if(this.type=='edit'){
				this.indicatorId=options.id;
				this.getIndicatorById();
				uni.setNavigationBarTitle({
				title:'编辑指标'
				})
			}
			
			// uni.$on('refreshDoctorOrder', () => {
			// 	this.mescroll.resetUpScroll()
			// })
		},
		methods: {
			changeTag(item,index){
				this.aIndex=index
				this.form.type=item.value
			},
			bindTagsChange:function(e,list) {
				this.indicatorCategory=list[e.target.value].dictLabel
				this.form.indicatorCategory = list[e.target.value].dictValue
				},
			bindUnitChange:function(e,list) {
				this.unitName=list[e.target.value].unitSymbol
				this.form.unitId = list[e.target.value].unitId
				},
			getListAll(){
								  getListAll().then(
								  	res => {
								  		if(res.code==200){
								  			  this.cates=res.data;
								  		}else{
								  			uni.showToast({
								  				title: res.msg,
								  			});
								  		}
								  	},
								  	rej => {}
								  );
			},
			getDictByKey(key) {
				var data = {
					key: key
				}
				getDictByKey(data).then(
					res => {
						if (res.code == 200) {
							
								this.list = res.data;
						}
					},
					err => {}
				);
			
			},
			getIndicatorById(){
								 getIndicatorById(this.indicatorId).then(
								  	res => {
								  		if(res.code==200){
								  			  this.form=res.data;
											 const unit = this.cates.find(item => item.unitId ==this.form.unitId);
											 // 安全地获取单位名称，避免空数组错误
											 this.unitName = unit ? unit.unitSymbol : '';
											 const indicatorCategory = this.list.find(item => item.dictValue ==this.form.indicatorCategory);
											 this.indicatorCategory= indicatorCategory ? indicatorCategory.dictLabel : '';
								  		}else{
								  			uni.showToast({
								  				title: res.msg,
								  			});
								  		}
								  	},
								  	rej => {}
								  );
			},
			submit(){
				if(this.form.indicatorName==null){
					uni.showToast({
						icon:'none',
						title: "指标名称不能为空",
					});
					return;
				}
				if(this.form.unitId==null){
					uni.showToast({
						icon:'none',
						title: "单位不能为空",
					});
					return;
				}
				if(this.form.indicatorCategory==null){
					uni.showToast({
						icon:'none',
						title: "指标分类不能为空",
					});
					return;
				}
				// if(this.form.referenceMax==null){
				// 	uni.showToast({
				// 		icon:'none',
				// 		title: "参考值最大值不能为空",
				// 	});
				// 	return;
				// }
				
				if(this.type=="add"){
					this.addIndicator()
				}
				else if(this.type=="edit"){
					this.updateIndicator()
				}
				
			},
			updateIndicator(){
				updateIndicator(this.form).then(
					res => {
						if(res.code==200){
							 uni.showToast({
							 	icon:'success',
							 	title: "更新成功",
							 });
							 setTimeout(function() {
								 uni.$emit('refreshEditIndicator');
								 uni.navigateBack({
									 delta: 1
								 })
							 }, 500);
						}else{
							uni.showToast({
								icon:'none',
								title: res.msg,
							});
						}
					},
					rej => {}
				);
			},
			addIndicator(){
				addIndicator(this.form).then(
					res => {
						if(res.code==200){
							 uni.showToast({
							 	icon:'success',
							 	title: "操作成功",
							 });
							 setTimeout(function() {
								uni.$emit('refreshEditIndicator');
								 uni.navigateBack({
									 delta: 1
								 })
							 }, 500);
						}else{
							uni.showToast({
								icon:'none',
								title: res.msg,
							});
						}
					},
					rej => {}
				);
			},
			cancel(item){
				var that=this;
				uni.showModal({
				    title: '提示',
				    content: '确定取消订单吗',
				    success: function (res) {
				        if (res.confirm) {
							var data = {
								orderId:item.orderId
							};
							cancelOrder(data).then(res => {
								if(res.code==200){
									uni.showToast({
										icon:'success',
										title: '订单已取消',
									});
									 that.mescroll.resetUpScroll()
								}else{
									uni.showToast({
										icon:'none',
										title: res.msg,
									});
								}
							});
				        } 
						else if (res.cancel) {
				        }
				    }
				});
			},
			// tab切换
			orderStatusChange(item) {
				this.showType = item.val
				this.mescroll.resetUpScroll()
			},
			mescrollInit(mescroll) {
				this.mescroll = mescroll;
			},
			/*下拉刷新的回调 */
			downCallback(mescroll) {
				mescroll.resetUpScroll()
			},
			
			showDetail(item) {
				if(item.orderType==1){
					uni.navigateTo({
						url: '/pages_doctor/doctorOrderIM?orderId='+item.orderId
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	.content{
		padding: 20upx;
		.form-box{
			// padding: 0 30upx;
			// background: #FFFFFF;
			// border-radius: 16upx;
			.form-item{
				padding: 30upx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				background: #FFFFFF;
				border-radius: 16rpx 16rpx 16rpx 16rpx;
				margin-bottom: 20rpx;
				// border-bottom: 1px solid #F1F1F1;
				&:last-child{
					margin-bottom:0;
				}
				.label{
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 32rpx;
					color: #222426;
					line-height: 34rpx;
					text-align: left;
				}
				input{
					text-align: right;
				}
				.to{
					color: #626468;
					margin: 0 20rpx;
				}
				.switch{
					width: 232rpx;
					height: 72rpx;
					background: #FFFFFF;
					border-radius: 36rpx 36rpx 36rpx 36rpx;
					border: 2rpx solid #008FD3;
					.item{
						width: 112rpx;
						height: 64rpx;
						line-height: 63rpx;
						font-weight: 400;
						font-size: 24rpx;
						color: #008FD3;
						text-align: center;
						&.active{
							color: #FFFFFF;
							background: #008FD3;
							border-radius: 32rpx 32rpx 32rpx 32rpx;
						}
					}
				}
				
				.form-input{
					font-size: 32upx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #999999;
					text-align: right;
				}
				// .form-input2{
				// 	font-size: 32upx;
				// 	font-family: PingFang SC;
				// 	font-weight: 400;
				// 	color: #999999;
				// 	text-align: right;
				// }
				.input-width{
					width: 150rpx;
					// font-size: 32upx;
					// font-family: PingFang SC;
					// font-weight: 400;
					// color: #999999;
					text-align:center;
				}
				.birth-picker {
					flex: 1;
					display: flex;
					align-items: center;
					
					.right-box{
						width: 100%;
						display: flex;
						align-items: center;
						.input-box{
							width: 470upx;
						}
						.arrow{
							width: 13upx;
							height: 23upx;
							margin-left: 20upx;
						}
					}
				}
			}
			.note{
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #898E91;
				text-align: left;
			}
		}
	
		.btn-box2{
			z-index: 9999;
			width: 100%;
			padding: 30upx;
			// position: fixed;
			bottom: 0;
			left: 0;
			box-sizing: border-box;
			// background: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: space-between;
			 padding-bottom: 40rpx;
			.sub-btn{
				flex:1;
				// width: 100%;
				height: 88upx;
				line-height: 88upx;
				text-align: center;
				font-size: 32upx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
				background: #008FD3;
				border-radius: 44upx;
				display: flex;
				align-items: center;
				 border: 2rpx solid #008FD3;
				justify-content: center;
				image{
					margin-right: 16rpx;
				}
			}
			.sub-btn2{
					flex:1;
					height: 88upx;
					line-height: 88upx;
					text-align: center;
					font-size: 32rpx;
					color: #008FD3;
					font-family: PingFang SC;
					font-weight: bold;
					background: #FFFFFF;
						 border-radius: 44rpx 44rpx 44rpx 44rpx;
						 border: 2rpx solid #008FD3;
						 margin-right: 20rpx;
			}
		}
	   .phone-list{
		   // padding: 30rpx;
		  
		   .item{
			   display: flex;
			   align-items: center;
			   justify-content: space-between;
			   background: #FFFFFF;
			   border-radius: 16rpx 16rpx 16rpx 16rpx;
			   // border-bottom: 1rpx solid #ECECEC;
			   padding: 20rpx;
			   margin-bottom: 20rpx;
			   &:last-child{
				    margin-bottom: 0;
					
			   }
			   .phone-name{
				   display: flex;
				   flex-direction: column;
				   align-items: flex-start;
				   // justify-content: flex-start;
				   // padding-left: 24rpx;
				       flex: 1;
				   .name{
				   				   font-family: PingFang SC, PingFang SC;
				   				   font-weight: 500;
				   				   font-size: 32rpx;
				   				   color: #222426;
				   				   text-align: left;
				   }
				   .type{
					   font-family: PingFang SC;
					   font-weight: 400;
					   font-size: 28rpx;
					   color: #626468;
					   text-align: right;
				   }
				   .time{
					   font-family: PingFang SC;
					   font-weight: 400;
					   font-size: 24rpx;
					   color: #898E91;
					   text-align: left;
					   margin-top: 14rpx;
				   }
			   }
			   
		   }
	   }
	   .sms-list{
		   .item{
			   padding: 30rpx;
			   background: #FFFFFF;
			   border-radius: 16rpx 16rpx 16rpx 16rpx;
			   margin-bottom: 20rpx;
			   .title{
				   font-family: PingFang SC;
				   font-weight: 500;
				   font-size: 32rpx;
				   color: #222426;
				   text-align: left;
			   }
			   .box{
				   display: flex;
				   align-items: center;
				   justify-content: space-between;
				   padding-top: 22rpx;
				   .time{
					   font-family: PingFang SC;
					   font-weight: 400;
					   font-size: 24rpx;
					   color: #898E91;
					   text-align: left;
				   }
				   .state{
					   font-family: PingFang SC;
					   font-weight: 400;
					   font-size: 24rpx;
					   color: #2CAE5C;
					   text-align: right;
				   }
			   }
		   }
	   }
		
	}
</style>
