puqiang/pages/mine/calibration.vue

<template>
	<view class="box">

		<view class="conmsg" v-if="allList.length!=0">
			<view class="conmsg-msg">
				<view v-for="(item,index) in allList" :key="index">
					<view class="">
						<view class="conmsg-msg-lab" style="border: none;">
							<view class="conmsg-msg-lab-1">
								{{item.name}}
							</view>
						</view>
						<view class="con-msg-con"
							:style="{borderBottom:index==allList.length-1?'none':'1px solid #E0E0E0'}">
							<view v-for='(item1,i) in item.children' :key='i' @click="Edittag(item,item1,index,i)"
								:style="{border:item1.selected==0?'1px solid #0A6EE9':'1px solid #E0E0E0'}"
								class="chebox">
								{{item1.label}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view class="submit">
			<view class="btn" @click="submit">
				确定
			</view>
		</view>
		<view class="" style="height: 220rpx;"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				allList:[],
				customerId:''
			}
		},
		onLoad(e) {
			this.customerId=e.id;
			this.getListByType()
		},
		methods: {
			Edittag(item,item1,index,i){
				if(this.allList[index].children[i].selected==0){
					this.allList[index].children[i].selected=1;
				}else{
					this.allList[index].children[i].selected=0;
				}
				this.$forceUpdate()	
			},
			// 字典表接口
			getListByType() {
				this.$u.get("/matchKeywords/findManualCalibration", {
						customerId: this.customerId,
						type:2
					})
					.then(res => {
						res.forEach(item1 => {
							item1.children.map(item => {
								if (item.isInterval == 0) {
									item.label = item.name + item.unit + '-' + item.endName + item
									.unit;
								} else {
									item.label = item.name
								}
								item.value = item.id;
							})
						})
						this.allList = res
					})
			},
			// 提交
			submit() {
				let param = {
					keywordIds:'',
					id: this.customerId,
				}
				let str = []
				this.allList.map(item => {
					item.children.map(item1 => {
						if (item1.selected == 0) {
							str.push(item1.keywordsId)
						}
					})
				})
				
				str = str.join(',')
				param.keywordIds = str	
				this.$u.post("matchKeywords/updateManualCalibration", param).then(res => {
					uni.showToast({
						title: '操作成功',
						icon: 'none',
						success: () => {
							let sdd={
								keywordIds: this.customerId,
								id: this.customerId,
								bg:0,
								speaker:0
							}
							let pages = getCurrentPages()  //获取当前页面栈的信息
							let prevPage = pages[pages.length - 2]   //获取上一个页面
							prevPage.setData({   //把需要回传的值保存到上一个页面
							  info: sdd
							});
							uni.navigateBack()
						}
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		width: 100%;
		height: 100%;
		background: #F8F8F8;
		overflow: hidden;
	}

	.conmsg {
		background: #FFFFFF;
		margin-top: 20rpx;

		.conmsg-title {
			height: 92rpx;
			line-height: 92rpx;
			font-weight: bold;
			padding: 0 30rpx;
			// font-weight: 500;
			color: #303030;
			font-size: 32rpx;
			border-bottom: 1px solid #E0E0E0;
		}

		.conmsg-msg {
			padding: 0 30rpx;

			.conmsg-msg-lab {
				height: 102rpx;
				display: flex;
				font-size: 30rpx;
				font-weight: 400;
				color: #333333;
				border-bottom: 1px solid #E0E0E0;
				line-height: 102rpx;

				.conmsg-msg-lab-1 {
					display: flex;
					min-width: 136rpx;

					.star {
						color: #E7483C;
						line-height: 108rpx;
					}
				}

				.conmsg-msg-lab-inp {
					margin-top: 30rpx;
					margin-left: 44rpx;

				}

				.conmsg-msg-lab-img {
					width: 14rpx;
					height: 30rpx;
					margin-top: 6rpx;
					margin-left: auto;

					image {
						width: 100%;
						height: 100%;
					}
				}
			}
		}
	}

	.submit {
		position: fixed;
		bottom: 20rpx;
		left: 20rpx;
		height: 120rpx;
		background: #FFFFFF;

		.btn {
			// margin: 60rpx auto;
			text-align: center;
			width: 690rpx;
			height: 88rpx;
			background: #2671E2;
			border-radius: 8rpx;
			font-size: 32tpx;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 88rpx;
		}
	}

	.con-msg-con {
		display: flex;
		flex-wrap: wrap;
		// justify-content: space-around;
		border-bottom: 1px solid #E0E0E0;
		padding-bottom: 16rpx;

		.chebox {
			// width: 20%;
			height: 60rpx;
			line-height: 60rpx;
			// margin: 10rpx 0;
			margin-bottom: 25rpx;
			margin-right: 20rpx;
			border: 1px solid #E0E0E0;
			box-sizing: border-box;
			padding: 0 10rpx;
		}
	}

	.sexchose {
		width: 120rpx;
		height: 60rpx;
		background: #FFFFFF;
		border-radius: 4rpx;
		border: 1px solid #E0E0E0;
		text-align: center;
		line-height: 60rpx;
		margin-right: 20rpx;

	}
</style>