aiot-app/pages/salesServiceManagement/workOrder/components/schemeAdd.vue

<template>
	<view class="mainBox">
		<uni-nav-bar background-color="#157A2C" color="#fff" fixed="true" statusBar="true" left-icon="back" title="方案信息"
			@clickLeft="back">
		</uni-nav-bar>
		<u-cell-group>
			<u-cell title="项目" arrow-direction="down">
				<uni-data-picker v-model="form.typeId" slot="value" :clear-icon='false' placeholder="请选择"
					:localdata="typeIdList" @change="typeOnchange">
				</uni-data-picker>
			</u-cell>
			<u-cell title="编码" arrow-direction="down">
				<u--input v-if="form.typeId != '2'" slot="value" placeholder="请输入" border="surround"
					v-model="form.code">
				</u--input>
				<view class="labels" slot="value" v-if="form.typeId == '2'">
					{{ form.code }}
				</view>
			</u-cell>
			<u-cell title="名称" arrow-direction="down">
				<u--input v-if="form.typeId == '2'" @click.native="selectProduct" slot="value" placeholder="请选择" border="surround"
					v-model="form.name">
				</u--input>
				<u--input slot="value" v-if="form.typeId != '2'" placeholder="请输入" border="surround" v-model="form.name"></u--input>
			</u-cell>
			<u-cell title="型号" arrow-direction="down">
				<u--input slot="value" v-if="form.typeId != '2'" placeholder="请输入" border="surround"
					v-model="form.categoryModel"></u--input>
				<view class="labels" slot="value" v-if="form.typeId == '2'">
					{{ form.categoryModel }}
				</view>
			</u-cell>
			<u-cell title="规格" arrow-direction="down">
				<u--input slot="value" v-if="form.typeId != '2'" placeholder="请输入" border="surround"
					v-model="form.specification"></u--input>
				<view class="labels" slot="value" v-if="form.typeId == '2'">
					{{ form.specification }}
				</view>
			</u-cell>
			<u-cell title="仓库" arrow-direction="down">
				<template>
					<uni-data-picker v-if="form.typeId != '2'" v-model="form.warehouseId" slot="value" :clear-icon='false' placeholder="请选择"
						:localdata="warehouseList" @change="warehouseOnchange">
					</uni-data-picker>
					<u--input v-if="form.typeId == '2'" slot="value" placeholder="请输入" border="surround" v-model="form.warehouseName"></u--input>
				</template>
			</u-cell>
			<u-cell title="库存" arrow-direction="down">
				<!-- <u--input slot="value" placeholder="请输入" border="surround" v-model="form.warehouseNum"></u--input> -->
				<view class="labels" slot="value">
					{{ form.warehouseNum }}
				</view>
			</u-cell>
			<u-cell title="单位" arrow-direction="down">
				<u--input slot="value" v-if="form.typeId != '2'" placeholder="请输入" border="surround"
					v-model="form.measureUnit"></u--input>
				<view class="labels" slot="value" v-if="form.typeId == '2'">
					{{ form.measureUnit }}
				</view>
			</u-cell>
			<u-cell title="数量" arrow-direction="down">
				<u--input slot="value" type="number" @input=" (val) =>inputChange(val,'totalCount')" placeholder="请输入"
					border="surround" v-model="form.totalCount"></u--input>
			</u-cell>
			<u-cell title="单价" arrow-direction="down">
				<u--input type="number" slot="value" @input="(val) =>inputChange(val,'singlePrice')" placeholder="请输入"
					border="surround" v-model="form.singlePrice"></u--input>
			</u-cell>
			<u-cell title="合计" arrow-direction="down">
				<view class="labels" slot="value">
					{{ form.settlementPrice }}
				</view>
			</u-cell>
			<u-cell title="详细内容" arrow-direction="down">
				<u--input slot="value" placeholder="请输入" border="surround" v-model="form.content"></u--input>
			</u-cell>
			<view class="footerButton">
				<u-button type="default" text="返回" @click="back"></u-button>
				<u-button type="primary" @click="save" text="保存"></u-button>
			</view>
		</u-cell-group>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					typeId: '2',
					code: '',
					name: '',
					categoryModel: '', // 型号
					specification: '', // 规格
					content: '', // 详细内容
					warehouseId: '', // 仓库
					warehouseNum: '', // 库存
					totalCount: '', // 数量
					measureUnit: '', // 单位
					singlePrice: '', // 单价
					settlementPrice: '', // 合计
				},
				typeIdList: [{
						text: '工时',
						value: '1'
					},
					{
						text: '零配件',
						value: '2'
					},
					{
						text: '差旅费',
						value: '3'
					}
				],
				obtain: '主数据',
				warehouseList: [], // 仓库数据
				oldTypeId: '2', // 旧的项目选择
			}
		},
		onLoad(params) {
			let data = JSON.parse(params.data);
			if(data.code){
				this.form = data;
			}
			console.log(data,'params')
			this.obtain = params.obtain || '主数据'
		},
		created() {
			uni.$off('updateScheme');
			uni.$on('updateScheme', (data) => {
				this.form = {
					...this.form,
					...data
				};
				this.warehouseList = data.warehouseList.map((el) => {
					el.text = el.warehouse_name;
					el.value = el.warehouse_id;
					return el;
				});
			})
		},
		methods: {
			// 如果新的选择跟旧的一样 不做数据更改
			typeOnchange(e) {
				if (this.form.typeId == this.oldTypeId) {
					return;
				}
				this.oldTypeId = this.form.typeId;
				this.form = {
					typeId: e.detail.value[0].text,
					code: '',
					name: '',
					categoryModel: '', // 型号
					specification: '', // 规格
					content: '', // 详细内容
					warehouseId: '', // 仓库
					warehouseNum: '', // 库存
					totalCount: '', // 数量
					measureUnit: '', // 单位
					singlePrice: '', // 单价
					settlementPrice: '', // 合计
				}
			},
			warehouseOnchange(e) {

			},
			selectProduct() {
				uni.navigateTo({
					url: `/pages/salesServiceManagement/workOrder/components/selectProduct?obtain=${this.obtain}`
				})
			},
			save() {
				if(!this.form.name){
					this.$refs.uToast.show({
						type: "warning",
						message: "请填写名称",
					})
					return;
				}
				uni.$emit('updateInfo', this.form);
				this.back();
			},
			inputChange(e, field) {
				let value = e.replace(/[^\d]/g, '');
				if (value.startsWith('0') && value.length > 1) {
					value = value.replace(/^0+/, '');
				}
				this.form[field] = value;
				let num1 = this.form.totalCount ? this.form.totalCount - 0 : 0;
				let num2 = this.form.singlePrice ? this.form.singlePrice - 0 : 0;
				this.form.settlementPrice = num1 * num2;
			},
		}
	}
</script>

<style scoped lang="scss">
	/deep/.u-cell__body__content {
		flex: none;
		margin-right: 16rpx;
	}

	.mainBox {
		padding-bottom: 84rpx;

		.labels {
			padding-left: 18rpx;
		}
	}

	.footerButton {
		width: 100%;
		height: 84rpx;
		display: flex;
		position: fixed;
		bottom: 0;

		/deep/.u-button {
			height: 100%;
		}

		>view {
			flex: 1;

		}
	}
</style>