aiot-app/pages/warehouse/outHouse/addStock.vue

<template>
	<view class="mainBox">
		<uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="新增出库单" @clickLeft="back">
			<!--右菜单-->
			<template slot="float">
				<!-- <view class="nav-icon-caozuo rightNav" @click="getsure">
					<u-button type="success" size="small" class="u-reset-button" text="确定"></u-button>
				</view> -->
			</template>
		</uni-nav-bar>

		<u-form labelPosition="left" :model="formData" :rules="rules" ref="formRef" labelWidth="200" labelAlign="right"
			class="baseForm">
			<u-form-item label="物品类型" class="required-form" borderBottom prop="assetType">
				<view :style="{ color: assetTypeName ? 'black' : '#c0c4cc' }" class="assetType_box" @click="openPicker">
					{{ assetTypeName ? assetTypeName : '请选择产品类型' }}
				</view>
			</u-form-item>
			<u-form-item label="来源单据" prop="documentSource" borderBottom>
				<u-input type="text" placeholder="请输入" v-model="formData.sourceBizNo" @click.native="goToRequisition" />
			</u-form-item>
			<u-form-item label="出库类型" class="required-form" prop="bizType" borderBottom>
				<uni-data-select v-model="formData.bizType" :localdata="outputSceneState"
					@change="changeType"></uni-data-select>
			</u-form-item>
			<u-form-item label="出库登记人" prop="createUserName" borderBottom>
				<u-input disableColor="#ffffff" v-model="formData.extInfo.createUserName" placeholder="请选择" disabled
					type="text" />
			</u-form-item>
			<u-form-item class="required-form" label="领料部门" prop="deliveryName" borderBottom>
				<view :style="{ color: formData.extInfo.verifyDeptName ? 'black' : '#c0c4cc' }" class="assetType_box"
					@click="openDepartmentPicker">
					{{ formData.extInfo.verifyDeptName ? formData.extInfo.verifyDeptName : '请选择领料部门' }}
				</view>
			</u-form-item>
			<u-form-item class="required-form" label="领料人" prop="deliveryPhone" borderBottom>
				<view :style="{ color: formData.fromUser ? 'black' : '#c0c4cc' }" class="assetType_box"
					@click="openUserPicker">
					{{ formData.fromUser ? formData.fromUser : '请选择领料人' }}
				</view>
			</u-form-item>
			<u-form-item label="备注" prop="remark" borderBottom>
				<u-input disableColor="#ffffff" v-model="formData.remark" placeholder="请输入内容" type="text" />
			</u-form-item>
		</u-form>

		<uni-collapse ref="collapse" v-model="collapseOpen">
			<uni-collapse-item :typeOpen="1" title="" name="collapse1" :open="true" :key="detailOpen"
				:show-animation="true">
				<template v-slot:title>
					<view class="detail-box">
						<view data-v-41027c34="" class="uni-collapse-item__title-wrap">
							<view data-v-41027c34=""
								class="uni-collapse-item__title-box uni-collapse-item__title-box-base">
								<text data-v-41027c34="" class="tag tag-base"><text></text></text>
								<text data-v-41027c34="" class="uni-collapse-item__title-text"><text>出库明细</text></text>
							</view>
						</view>
						<!-- <u-button type="primary" size="small" text="扫码添加" @click.native.stop="selectType"></u-button> -->
						<u-button type="success" size="small" class="selectEnterType" text="手动添加"
							@click.native.stop="selectType"></u-button>
					</view>
				</template>

				<u-form labelPosition="left" :model="{ productList: productList }" ref="lisrFormRef" labelWidth="150"
					:rules="listRules" errorType="none" labelAlign="right" :labelStyle="{
						fontSize: '28rpx'
					}">
					<view class="listContent">
						<view class="listBox" v-for="(item, index) in productList" :key="index">
							<view class="main" :class="{ save: item.isSave }">
								<view class="row">
									<view class="row-item">
										<text class="t1">物品名称</text>
										<text class="t2">{{ item.categoryName }}</text>
									</view>
								</view>
								<view class="row">
									<view class="row-item">
										<text class="t1">物品编码</text>
										<text class="t2">{{ item.categoryCode }}</text>
									</view>
								</view>
								<view class="row">
									<view class="row-item" style="display: flex;width: 100%;">
										<text class="t1">包装规格</text>
										<view style="display: flex;"><u-tag style="display: flex;margin-right: 10px;"
												v-for="ite in item.packingSpecificationLabel" :text="ite"></u-tag>
										</view>
									</view>
								</view>
								<view class="row">
									<view class="row-item">
										<text class="t1">批次号</text>
										<text class="t2">{{ item.batchNo }}</text>
									</view>
									<view class="row-item">
										<text class="t1">是否拆包</text>
										<text class="t2">{{ item.isUnpack ? '是' : '否' }}</text>
									</view>
								</view>
								<view class="row">
									<view class="row-item">
										<text class="t1">数量</text>
										<text class="t2">{{ item.packingQuantity }}</text>
									</view>
									<view class="row-item">
										<text class="t1">包装单位</text>
										<text class="t2">{{ item.packingUnit }}</text>
									</view>
								</view>
								<view class="row">
									<view class="row-item">
										<text class="t1">供应商</text>
										<text class="t2">{{ item.supplierName }}</text>
									</view>
								</view>
								<view class="row">
									<view class="row-item">
										<text class="t1">计量数量</text>
										<text class="t2">{{ item.measureQuantity }}</text>
									</view>
									<view class="row-item">
										<text class="t1">计量单位</text>
										<text class="t2">{{ item.measureUnit }}</text>
									</view>
								</view>
								<view class="row">
									<view class="row-item">
										<text class="t1">重量</text>
										<text class="t2">{{ item.weight }}</text>
									</view>
									<view class="row-item">
										<text class="t1">重量单位</text>
										<text class="t2">{{ item.weightUnit }}</text>
									</view>
								</view>
								<view class="row">
									<view class="row-item">
										<text class="t1">仓库</text>
										<text class="t2">{{ item.warehouseName }}</text>
									</view>
								</view>
							</view>
							<view class="main">
								<view class="selectTime">
									<view class="title">包装列表</view>
								</view>
								<u-list @scrolltolower="scrolltolower" class="z_list" style="height: 100% !important">
									<view class="material rx-ss" v-for="(ite, idx) in item.outInDetailRecordRequestList"
										:key="idx">
										<view class="content_table">
											<view class="item">
												<view class="lable rx-cc">序号</view>
												<view class="content">{{ idx + 1 }}</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">包装编码</view>
												<view class="content">{{ ite.packageNo }}</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">包装数量({{ ite.packingUnit }})</view>
												<view class="content">{{ ite.packingQuantity }}</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">计量数量({{ ite.measureUnit }})</view>
												<view class="content">{{ ite.measureQuantity }}</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">物料代号</view>
												<view class="content">{{ ite.materielDesignation }}</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">客户代号</view>
												<view class="content">{{ ite.clientCode }}</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">刻码</view>
												<view class="content">{{ ite.engrave }}</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">重量({{ ite.weightUnit }})</view>
												<view class="content">
													{{ ite.weight }}
												</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">质检状态</view>
												<view class="content">
													{{ qualityResults[ite.status] }}
												</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">采购日期</view>
												<view class="content">
													{{ ite.purchaseDate }}
												</view>
											</view>
											<view class="item">
												<view class="lable rx-cc">生产日期</view>
												<view class="content">
													{{ ite.productionDate }}
												</view>
											</view>
										</view>
									</view>
								</u-list>
							</view>
						</view>
					</view>
				</u-form>
			</uni-collapse-item>
		</uni-collapse>
		<view class="footBox">
			<view class="reg" @click="submit">
				<uni-icons custom-prefix="iconfont" size="20" color="#fff"></uni-icons>
				提交
			</view>
		</view>
		<!-- 选择出库场景 -->
		<ba-tree-picker ref="treePicker" :multiple="true" @select-change="confirm" title="选择物品类型"
			:localdata="goodsLists" valueKey="id" textKey="name" childrenKey="child" />
		<!-- 选择物品类型 -->
		<ba-tree-picker ref="treePicker" :multiple="true" @select-change="confirm" title="选择物品类型"
			:localdata="goodsLists" valueKey="id" textKey="name" childrenKey="child" />
		<!-- 选择领料部门 -->
		<ba-tree-picker ref="departmentPicker" :multiple="false" @select-change="departmentConfirm" title="选择领料部门"
			:localdata="departmentOption" valueKey="id" textKey="name" childrenKey="children" />
		<!-- 选择领料人 -->
		<ba-tree-picker ref="userPicker" :multiple="false" @select-change="userConfirm" title="选择领料人"
			:localdata="userOption" valueKey="id" textKey="name" childrenKey="children" />
	</view>
</template>

<script>
	// import ScanCode from '@/components/ScanCode.vue'
	import {
		toTreeData
	} from '@/utils/utils.js'
	import {
		getTreeByGroup,
		submitInsideTwo,
		outStorage
	} from '@/api/warehouseManagement'
	import {
		listOrganizations,
		getUserPage
	} from '@/api/common'
	import {
		getByCode
	} from '@/api/pda/common'
	import dayjs from 'dayjs'
	import {
		outputSceneState
	} from '../common'
	import {
		post,
		postJ,
		get,
		getJ
	} from '@/utils/api.js'
	import WarehouseChoose from '@/components/WarehouseChoose'
	import {
		warehousingType,
		inputStatus,
		emergencyState,
		warehousingMaterialListTable,
		getDictName,
		materialType
	} from '../enum.js'
	import baTreePicker from '@/components/ba-tree-picker/ba-tree-picker.vue'
	// import addDetails from '@/components/addDetails'
	import UploadFileNew from '@/components/UploadFileNew'
	// import dictMixins from '@/mixins/dictMixins.js'
	export default {
		components: {
			WarehouseChoose,
			baTreePicker,
			UploadFileNew
		},
		data() {
			return {
				userOption: [], // 用户列表
				departmentOption: [], // 部门列表
				goodsLists: [], // 物品类型
				assetTypeName: '', // 物品类型名称
				timeShow: false,
				packingSpecificationOption: [], // 包装规格
				currentPackingSpecificationOption: [], // 当前包装规格
				currentSupplierListOption: [], // 当前供货商
				warehouseListOption: [], // 仓库列表
				currentTypeTime: Number(new Date()), // 当前时间类型的时间
				storageTime: '', // 入库时间
				currentProductIndex: null, // 当前产品索引
				currentPackingIndex: null, // 当前包装索引
				packingUnitsShow: false,
				typeTimeShow: false,
				suppliersShow: false,
				warehouseShow: false,
				timeTypeShow: false,
				statusShow: false,
				dictCodeList: [], // 字典列表
				curDateType: 'purchaseDate',
				qualityResultsOption: [
					[{
							label: '合格',
							value: 1
						},
						{
							label: '不合格',
							value: 2
						}
					]
				], // 质检状态 0未检 1已检
				qualityResults: {
					1: '合格',
					2: '不合格'
				}, // 质检结果 1合格 2不合格
				curDateTypeLabel: {
					purchaseDate: '采购日期',
					productionDate: '生产日期'
				},
				timeTypeOption: [
					[{
							name: '采购日期',
							prop: 'purchaseDate'
						},
						{
							name: '生产日期',
							prop: 'productionDate'
						}
					]
				], // 时间类型
				collapseOpen: 'collapse1',
				emergencyState,
				warehousingType,
				materialType,
				outputSceneState,
				inputStatus,
				getDictName,
				detailOpen: false,
				codeOpen: false,
				deptList: [], //部门
				supplierList: [], //供应商
				formData: {
					type: 1, // 入库
					bizType: '', // 入库场景
					storageTime: '', // 入库时间
					extInfo: {}, // 扩展信息
					sourceBizNo: '', // 来源单据编号
					fromUser: '', // 送货人
					remark: '' // 备注
				},
				statusList: [{
						id: 1,
						name: '紧急'
					},
					{
						id: 2,
						name: '中等'
					},
					{
						id: 1,
						name: '普通'
					}
				], //紧急状态
				pickerIndex: 0,
				productList: [],
				userList: [],
				rules: {
					assetType: {
						type: 'number',
						required: true,
						message: '请选择入库产品类型',
						trigger: ['blur', 'change']
					},
					bizType: {
						type: 'number',
						required: true,
						message: '请选择入库场景',
						trigger: ['blur', 'change']
					}
					// contentImage: {
					//   type: 'array',
					//   required: true,
					//   message: '请上传附件',
					//   trigger: ['blur', 'change']
					// }
				},
				settingIndex: 0
			}
		},
		onShow() {
			this.collapseOpen = 'collapse1'
		},
		beforeDestroy() {
			uni.$off('setSelectList')
			uni.$off('requisitionSelectC')
		},
		onLoad() {
			this.getListItems() // 物品类型
			this.initDeptData() // 部门列表
			const userInfo = uni.getStorageSync('userInfo')
			this.formData.extInfo.createUserName = userInfo.name
			this.formData.createUserId = userInfo.userId
			uni.$on('setSelectList', async data => {
				if (data?.length) {
					console.log('data------------', data)
					this.formData.sourceBizNo = ''
					this.productList = data.map(item => {
						return {
							...item,
							packingSpecificationLabel: item.extField.packingSpecification ? item
								.extField.packingSpecification.split(',') : []
						}
					})
					this.formData.outInDetailList = data
					setTimeout(() => {
						this.detailOpen = !this.detailOpen
						this.$refs.collapse && this.$refs.collapse.resize()
					}, 0)
				}
			})
			uni.$on('requisitionSelectC', async (data, query) => {
				console.log(data, 'data')
				console.log(query, 'queryqueryqueryqueryqueryqueryqueryqueryquery')
				this.formData.sourceBizNo = query.sourceBizNo
				this.formData.bizType = parseInt(query.bizType)
				this.formData.extInfo.assetType = query.assetType.split(',')
				let filterArray = this.formData.extInfo.assetType.map(item => {
					return this.goodsLists.find(ite => ite.id == item).name
				})
				this.assetTypeName = Array.from(new Set(filterArray)).join('/')
				this.formData.outInDetailList = data
				this.productList = data.map(productItem => {
					return {
						...productItem,
						packingSpecificationLabel: productItem.extField.packingSpecification.split(
							','),
						outInDetailRecordRequestList: productItem.outInDetailRecordRequestList.map(
							packingItem => {
								return {
									...packingItem,
									categoryName: productItem.categoryName,
									categoryCode: productItem.categoryCode,
									materialDetailList: packingItem.materialDetailList.map(
										materialItem => {
											return {
												...materialItem,
												categoryName: productItem.categoryName,
												categoryCode: productItem.categoryCode
											}
										})
								}
							})
					}
				})
				setTimeout(() => {
					this.detailOpen = !this.detailOpen
					this.$refs.collapse && this.$refs.collapse.resize()
				}, 0)
			})
			// 明细信息填写
			uni.$on('batchNumBack', productList => {
				if (productList?.length) {
					this.productList = productList
				}
			})
		},
		mounted() {
			// this.getAddDetails();
		},
		computed: {
			listRules() {
				return this.productList.reduce((cur, pre, index) => {
					return {
						...cur,
						[`productList.${index}.batchNo`]: {
							type: 'string',
							required: true,
							trigger: ['blur', 'change']
						},
						[`productList.${index}.packingQuantity`]: {
							type: 'number',
							required: true,
							trigger: ['blur', 'change']
						},
						[`productList.${index}.packingUnit`]: {
							type: 'string',
							required: true,
							trigger: ['blur', 'change']
						},
						[`productList.${index}.warehouseId`]: {
							type: 'string',
							required: true,
							trigger: ['blur', 'change']
						}
					}
				}, {})
			}
		},
		methods: {
			changeType(e) {
				this.formData.bizType = e
			},
			goToRequisition() {
				uni.navigateTo({
					url: '/pages/warehouse/components/requisitionList?type=' + 2
				})
			},
			scrolltolower() {
				console.log('滑动了~~~')
			},
			async submit() {
				if (this.productList.length <= 0) {
					uni.showToast({
						title: '请添加出库明细',
						icon: 'none'
					})
					return
				}
				if (!this.formData.extInfo.verifyDeptName) {
					uni.showToast({
						title: '请选择领料部门',
						icon: 'none'
					})
					return
				}
				if (!this.formData.fromUser) {
					uni.showToast({
						title: '请选择领料人',
						icon: 'none'
					})
					return
				}
				console.log(this.formData)
				let obj = uni.$u.deepClone({
					...this.formData,
					type: 2
				})
				obj.extInfo.sourceBizNo = obj.sourceBizNo
				obj.fromType = obj.type
				this.saveLoading = true
				// 处理物品类型assetType
				obj.extInfo.assetType = obj.extInfo.assetType.join(',')
				// 处理仓库id
				let warehouseId = []
				let warehouseName = []
				let warehouseIds = this.productList.map(item => item.warehouseId).flat()
				let warehouseNames = this.productList.map(item => item.warehouseName).flat()
				warehouseIds.forEach((item, index) => {
					if (!warehouseId.includes(item)) {
						warehouseId.push(item)
						warehouseName.push(warehouseNames[index])
					}
				})
				obj.warehouseIds = warehouseId
				obj.warehouseNames = warehouseName
				console.log('2222', obj)
				uni.showLoading({
					title: '保存中...'
				})
				try {
					const res = await outStorage(obj)
					if (res.code == 0) {
						await submitInsideTwo({
							outInIds: res.data
						})
						uni.hideLoading()
						uni.showToast({
							icon: 'none',
							title: '出库成功',
							duration: 1500
						})
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							})
						}, 1500)
					}
				} catch (error) {
					console.log('出库失败', err)
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '出库失败',
						duration: 2000
					})
				}
			},
			// 部门列表
			async initDeptData() {
				let deptTreeList = await listOrganizations()
				this.departmentOption = toTreeData({
					data: deptTreeList,
					idField: 'id',
					parentIdField: 'parentId'
				})
			},
			async getStaffList(id) {
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				let res = await getUserPage({
					groupId: id,
					size: 9999,
					page: 1
				})
				uni.hideLoading()
				this.userOption = res.list
			},
			// 打开领料部门选择器
			openDepartmentPicker() {
				this.$refs.departmentPicker._show()
			},
			// 打开领料人选择器
			openUserPicker() {
				this.$refs.userPicker._show()
			},
			sceneStateFilter(bizType) {
				if (bizType) {
					return this.outputSceneState.filter(item => item.value == bizType)[0].text
				}
			},
			formatter(dataTime) {
				return dayjs(dataTime).format('YYYY-MM-DD HH:mm:ss')
			},
			openPicker() {
				this.$refs.treePicker._show()
			},
			// 获取物品列表
			getListItems() {
				getTreeByGroup({
					type: 2
				}).then(res => {
					this.goodsLists = res
				})
			},
			selectType() {
				if (!this.formData.extInfo.assetType) {
					uni.showToast({
						title: '请选择出库类型',
						icon: 'none'
					})
					return
				}
				if (!this.formData.bizType) {
					uni.showToast({
						title: '请选择出库场景',
						icon: 'none'
					})
					return
				}
				// const storageKey = Date.now() + ''
				// uni.setStorageSync(storageKey, this.warehousingMaterialList)
				uni.navigateTo({
					url: '/pages/warehouse/outHouse/selectOutType?assetType=' + this.formData.extInfo.assetType
				})
			},
			userConfirm(data, name) {
				this.formData.fromId = data[0]
				this.formData.fromUser = name
			},
			departmentConfirm(data, name, allList) {
				this.formData.extInfo.verifyDeptCode = data[0]
				this.formData.extInfo.verifyDeptName = name
				this.formData.fromId = ''
				this.formData.fromUser = ''
				this.getStaffList(data[0])
			},
			confirm(data, name, allList) {
				this.assetTypeName = name
				this.formData.extInfo.assetType = allList.map(item => item.id)
			},
			// 抬头下拉信息保存
			handlePicker(e, list, idKey, nameKey) {
				if (idKey) {
					this.formData[idKey] = list[e?.detail.value]?.value
				}
				if (nameKey) {
					this.formData[nameKey] = list[e?.detail.value]?.text
				}
				this.$nextTick(() => {
					if (idKey === 'assetType' || idKey === 'bizType') {
						this.$refs.formRef.validateField(idKey)
					}
				})
			},
			// 部门确认
			deptConfirm(data, name) {
				this.formData.deptName = name
				this.formData.deptCode = data[0]
			},
			// 部门确认
			verifyDeptConfirm(data, name) {
				this.formData.verifyDeptCode = data[0]
				this.formData.verifyDeptName = name
				this.formData.verifyId = ''
				this.formData.verifyName = ''
				this.getUser(data[0])
			}
		}
	}
</script>


<style lang="scss" scoped>
	.mainBox {
		padding-bottom: 120rpx;

		/deep/.required-form .u-form-item__body__left__content__label::before {
			content: '*';
			color: red;
		}
	}

	/deep/.baseForm {
		.u-form-item__body {
			padding: 4px !important;
		}

		.assetType_box {
			padding: 12rpx 18rpx;
			width: 100%;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			font-size: 30rpx;
		}
	}


	.detail-box {
		position: relative;
		display: flex;
		justify-content: space-between;
		align-items: center;

		/deep/uni-button {
			margin: 0 !important;
			width: 180rpx;
		}

		.selectEnterType {
			margin-left: 10rpx !important;
		}
	}

	.footBox {
		position: fixed;
		left: 0px;
		bottom: 0px;
		height: 100rpx;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;

		view {
			width: 100%;
			height: 100%;
			text-align: center;
			color: #fff;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.reg {
			background: $u-success-dark;
		}

		.add {
			background: $uni-color-primary;
		}

		.uni-icons {
			margin-right: 8rpx !important;
		}
	}

	.main {
		padding: 0 30rpx;

		.row {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 20rpx 0;
			border-bottom: 1px dashed #dedede;

			.row-item {
				.t1 {
					font-weight: bold;
					font-size: 28rpx;
					color: #333333;
					margin-right: 20rpx;
				}

				.t2 {
					font-size: 28rpx;
					color: #333333;
				}
			}
		}

		.ckmx {
			color: #70b603;
			font-size: 28rpx;
			font-weight: bold;
			padding: 20rpx;
			display: flex;
			justify-content: flex-end;
		}
	}

	.listBox {
		padding: 20rpx 10rpx;
		border-bottom: 1px #f2f2f2 solid;
		position: relative;



		&.code {
			.label {
				width: 120rpx !important;
			}
		}

		.listTit {
			width: 100%;
			display: flex;
			justify-content: space-between;
			align-items: center;

			/deep/uni-button {
				margin-right: 20rpx;
				width: 100rpx;

				&.assets {
					width: 180rpx;
				}
			}

			.name {
				width: 50%;
				margin-left: 10px;
				overflow: hidden;
				white-space: nowrap;
				-o-text-overflow: ellipsis;
				text-overflow: ellipsis;
				font-size: 24rpx;
			}

			.btn {
				display: flex;
				justify-content: flex-end;
			}

			.weight {
				width: 30%;
				font-size: 24rpx;
				margin-left: auto;
				margin-right: 60rpx;
				position: relative;
				display: flex;

				input {
					margin-right: 10rpx;
					border: 1px solid black;
					width: 40%;
					height: 20rpx;
				}
			}

			.weight::after {
				position: absolute;
				right: -30rpx;
				top: 50%;
				content: '';
				background: #eee;
				width: 1px;
				height: 28rpx;
				margin-top: -14rpx;
			}
		}

		.z_list {
			height: 100% !important;
			max-height: 500rpx;

			.material {
				margin-top: 10rpx;

				.left {
					width: 40rpx;
				}

				.zdy_check {
					width: 30rpx;
					height: 30rpx;
					border: 2rpx solid #c8c9cc;
					border-radius: 4rpx;
				}

				.check_active {
					background: $theme-color;
					border: 2rpx solid $theme-color;

					/deep/ .u-icon__icon {
						color: #fff !important;
					}
				}

				.content_table {
					width: 670rpx;
					border: 2rpx solid $border-color;

					.item {
						display: flex;
						border-bottom: 2rpx solid $border-color;

						.lable {
							width: 200rpx;
							text-align: center;
							background-color: #f7f9fa;
							font-size: 26rpx;
							border-right: 2rpx solid $border-color;
							flex-shrink: 0;
						}

						.ww80 {
							width: 80rpx;
						}

						.content {
							width: 500rpx;
							min-height: 64rpx;
							font-size: 28rpx;
							line-height: 28rpx;
							font-style: normal;
							font-weight: 400;
							padding: 18rpx 8rpx;
							box-sizing: border-box;
							word-wrap: break-word;
							flex-grow: 1 !important;
						}

						.input_box {
							padding: 0 !important;
						}

						.content_num {
							display: flex;
							align-items: center;
							padding: 0 4rpx;

							/deep/ .uni-input-input {
								width: 200rpx;
								border: 2rpx solid #f0f8f2;
								background: #f0f8f2;
								color: $theme-color;
							}

							.unit {
								padding: 0 4rpx;
								font-size: 24rpx;
								color: #404446;
							}
						}

						.ww400 {
							/deep/ .uni-input-input {
								width: 400rpx;
							}
						}

						.pd4 {
							padding: 4rpx 8rpx;
						}

						&:last-child {
							border-bottom: none;
						}
					}

					.ww55 {
						width: 55%;
					}

					.ww45 {
						width: 45%;
					}

					.ww50 {
						width: 50%;
					}

					.ww30 {
						width: 30%;
					}

					.ww70 {
						width: 70%;
					}

					.ww80 {
						width: 80%;
					}

					.ww20 {
						width: 20%;
					}

					.check {
						width: 30rpx;
						height: 30rpx;
					}

					.tag_box {
						padding: 2rpx 10rpx;
						margin-right: 12rpx;
						background: #e6a23c;
						font-size: 22rpx;
						color: #fff;
						border-radius: 4rpx;
					}
				}
			}
		}

		.more {
			position: absolute;
			bottom: 26rpx;
			right: 30rpx;
			font-size: 28rpx;
			color: #666;
		}
	}

	.selectTime {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		margin-top: 10px;

		.title {
			flex: 1;
			font-size: 28rpx;
			font-weight: bold;
		}

		.timeBox {
			display: flex;
			width: 500rpx;

			.firstBtn {
				margin-right: 10rpx;
			}
		}
	}

	.listBox:last-child {
		border: none !important;
	}

	.textBox {
		border: 1px #f2f2f2 solid;
		height: 160px;
		display: block;
		width: auto !important;
	}

	.saveBtn {
		width: 50%;
		margin: 40rpx auto;
	}

	.top-css {
		border-bottom: 1px solid rgb(207, 204, 204);
	}
</style>