NewZkgj/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" :class="{mustSe: item.level == 1 && item.mustSelected == 0 }"
							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,
					projectId: uni.getStorageSync('buildingID').id,
				}
				let str = []
				try {
					this.allList.forEach(item => {
						if (item.mustSelected == 0) {
							if (item.children.findIndex(item => item.selected == 0) == -1) {
								throw new Error(item.name)
							}
						}
						item.children.map(item1 => {
							if (item1.selected == 0) {
								str.push(item1.keywordsId)
							}
						})
					})
				} catch (e) {
					console.log(e)
					uni.showToast({
						title: `${e.message}为必选项~`,
						icon: 'none',
						duration: 2000
					})
					return
				}

				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 {
				position: relative;
				height: 102rpx;
				display: flex;
				font-size: 30rpx;
				font-weight: 400;
				color: #333333;
				border-bottom: 1px solid #E0E0E0;
				line-height: 102rpx;

				&.mustSe::before {
					content: '*';
					color: red;
					position: absolute;
					left: -10rpx;
					right: -10rpx;
					z-index: 10;
				}

				.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>