yuanqu_ui/work/pages/yyorder/menuput.vue

<template>
	<view :style="'padding-top:'+nvaHeight+'px;'">
		<view class="navbox">
			<uni-nav-bar color="#ffffff" left-icon="left" title="修改食谱" :background-color="backgroundColor"
				:border="false" statusBar='true' fixed="true" @clickLeft='getBack'>
			</uni-nav-bar>
		</view>
		<image :src="navbg" class="navbg"></image>
		<view class="zxmain">
			<uni-forms ref="form" class="ytforms"  :modelValue="datainfo">
				<view class="ytbox" style="padding-bottom: 16rpx;" >
					<view class="yttit flexcj">
						{{datainfo.menuFoodTime}}
					</view>
					<!-- <view class="cooktit">
						<view class="label">早餐：</view>
						<textarea auto-height="true" v-model="datainfo.menuFoodDetailBk" class="textarea" maxlength='-1' placeholder="请输入或粘贴午餐菜品，用“，”隔开…"></textarea>
					</view> -->
					<view class="cooktit">
						<view class="label">午餐：</view>
						<textarea auto-height="true" v-model="datainfo.menuFoodDetailLu" class="textarea" maxlength='-1' placeholder="请输入或粘贴午餐菜品，用“，”隔开…"></textarea>
					</view>
					<view class="cooktit">
						<view class="label">晚餐：</view>
						<textarea auto-height="true" v-model="datainfo.menuFoodDetailDi" class="textarea" maxlength='-1' placeholder="请输入或粘贴晚餐菜品，用“，”隔开…"></textarea>
					</view>
					<view class="cooktita flexc mb10">
						<view class="label" style="flex: 1;">是否启用：</view>
						<switch :checked="datainfo.isUse=='Y'" @change="getChange"/>
						<!-- <uni-data-checkbox :selectedColor="color" :selectedTextColor="color" v-model="datainfo.isUse" :localdata="users" /> -->
					</view>
				</view>	
			</uni-forms>
			<view class="btns">
				<view class="btn btnb" v-if="checkPermi(['system:menuFood:edit'])" @click="getSubmit">确认提交</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	import {checkPermi,checkRole} from "@/utils/permission"; // 权限判断函数
	import {getMenuAdd,getMenuDetail,getMenuPut} from "@/api/mine/order.js"
	import {getDictionaryFn} from "@/api/mine/register.js"
	export default {
		components: {},
		data() {
			return {
				navbg:require("@/static/images/navbg.png"),
				upimg:require("@/work/static/yuy/up.png"),
				delimg:require("@/work/static/yuy/delw.png"),
				addimg:require("@/work/static/yuy/add.png"),
				backgroundColor: "transparent",
				datainfo:{},
				nvaHeight: 44,
				marTop: 0, //距离顶部的距离
				stubarHeight: 0, //
				userId:this.$store.state.user.userId,
				patype:'edit',
				id:'',
				color:'#0391FD',
				users: [{
				  text: '启用',
				  value: "Y"
				}, {
				  text: '禁用',
				  value: "N"
				}],
			}
		},
		onPageScroll(e) {
			var scrollTop = Number(e.scrollTop);
			if (scrollTop > 0) {
				this.backgroundColor = '#0491FD'
			} else {
				this.backgroundColor = 'transparent'
			}
		},
		onUnload() {
			
		},
		onLoad: function(e) {
			if(e.data){
				var data=JSON.parse(decodeURIComponent(e.data))
				this.patype=data.type;
				this.id=data.id;
				this.getMenuDetail()
			}
			uni.getSystemInfo({
				success: (e) => {
					this.stubarHeight = Number(e.statusBarHeight);
					this.nvaHeight = Number(e.statusBarHeight) + 44;
				}
			})
		},
		onShow() {},
		mounted() {
			
		},
		methods: {
			checkPermi,
			checkRole,
			getMenuDetail(){
				getMenuDetail(this.id).then(res=>{
					if(res.code==200){
						this.datainfo=res.data
					}
				})
			},
			getChange(e){
				var val=e.detail.value;
				if(val==false){
					this.datainfo.isUse='N'
				}else{
					this.datainfo.isUse='Y'
				}
			},
			getBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			getSubmit(){
				var that=this;
				var params=JSON.parse(JSON.stringify(this.datainfo));
				getMenuPut(params).then(res=>{
					if(res.code==200){
						that.$toast("修改成功")
						setTimeout(function(){
							uni.$emit('refreshmenulist')
							uni.navigateBack({
								delta:1
							})
						},1200)
					}
				})
				
			},
		},

	}
</script>
<style>
/* 	page {
		background: #ffffff;
	} */
</style>
<style lang="scss" scoped>
.zxmain /deep/	.uni-switch-input.uni-switch-input-checked{background-color: #0391FD !important;}
.zxmain /deep/ uni-switch::before{display: none;}
.zxmain /deep/ .uni-forms .uni-forms-item{padding: 8rpx 26rpx 8rpx;border: 2rpx solid #0391FD;margin-bottom: 24rpx;border-radius: 12rpx;}
.zxmain /deep/ .uni-forms-item__label{flex: 0 0 auto;width: 144rpx !important;font-size: 28rpx;font-weight: bold;position: relative;color: #161616;text-align-last: justify;}
.zxmain /deep/ .uni-forms-item__label text{flex: 1;}
.zxmain /deep/ .uni-forms-item__label .is-required{position: absolute;right: 0;color: #F10C31;margin-top: 16rpx;}
// .zxmain /deep/ uni-textarea{flex: 1;width: auto;text-align: right;}
.zxmain /deep/ .uni-textarea-placeholder{font-size: 28rpx;color: #DDDDDD !important;}
.zxmain /deep/ .uni-easyinput__placeholder-class{font-size: 28rpx;color: #DDDDDD;}
.zxmain /deep/ .uni-forms-item__content{display: flex;align-items: center;flex-direction: row;}
.zxmain /deep/ .uni-easyinput{flex: 1;text-align: right;}
.zxmain /deep/ .uni-easyinput__content-input{font-size: 28rpx;}
 .zxmain /deep/ .uni-forms-item__error{margin-top:20rpx;left: auto;right: 0;}
.navbox{position: fixed;left: 0;right: 0;top: 0;z-index: 4;	}
.navbg{width: 100%;height: 692rpx;position: absolute;left: 0;right: 0;top: 0;z-index: -1;}	
.zxmain{position: relative;padding: 36rpx 32rpx 28rpx;box-sizing: border-box;}
.ytforms{
	.yttit{font-size: 28rpx;font-weight: bold;margin-bottom: 32rpx;line-height: 40rpx;
color: #161616;display: flex;align-items: center;padding: 0rpx 26rpx;box-sizing: border-box;position: relative;
		&::before{content: '';width: 6rpx;height: 34rpx;background: $com-cd3;border-radius: 4rpx;position: absolute;top: 50%;transform: translateY(-50%);left: 0rpx;}
	}
	.ytbox{background-color: #ffffff;padding: 36rpx 28rpx 12rpx;border-radius: 14rpx;box-sizing: border-box;margin-bottom: 18rpx;
		.cooktit{min-height: 152rpx;background: #FFFFFF;border-radius: 6rpx;border: 2rpx solid #0391FD;padding: 24rpx 26rpx;display: flex;margin-bottom: 24rpx;
			.textarea{font-size: 28rpx;}
		}
		.label{font-size: 28rpx;font-weight: bold;color: #161616;flex: 0 0 auto;}
	}
}
.btns{
	padding: 42rpx 28rpx 0;
	.btn{width: 100%;height: 90rpx;border-radius: 14rpx;font-weight: 500;font-size: 28rpx;margin-bottom: 34rpx;display: flex;align-items: center;justify-content: center;box-sizing: border-box;
		.addimg{width: 14rpx;height: 14rpx;flex: 0 0 auto;margin-right: 14rpx;}
		&.btna{background: #DFF1FF;border:2rpx solid #0391FD;color: #0391FD;}
		&.btnb{background: #0391FD;color: #ffffff;}
	}
}
</style>