aiot-app/pages/salesServiceManagement/demandList/add.vue

<template>
	<view class="">
		<uni-nav-bar background-color="#157A2C" color="#fff" fixed="true" statusBar="true" left-icon="back"
			:title="title" @clickLeft="back">
		</uni-nav-bar>
		<u-subsection :list="list" :current="current" @change="sectionChange"></u-subsection>
		<u-cell-group v-show="current == 0">
			<!-- 售后对象 -->
			<u-cell title="需求编码" arrow-direction="down">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input disabled style="flex:1" border="surround" v-model="form.code">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="关联类型" arrow-direction="down" class="required-mark-new">
				<uni-data-picker :readonly="!isDisable" v-model="form.associationType" slot="value" placeholder="请选择"
					:localdata="associationTypeList" @change="associationTypeOnchange">
				</uni-data-picker>
			</u-cell>
			<u-cell title="需求名称" arrow-direction="down" class="required-mark-new">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input style="flex:1" :disabled="!isDisable" placeholder="请输入" border="surround"
						v-model="form.name">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="客户名称" arrow-direction="down" class="required-mark-new">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" style="flex:1" placeholder="请选择" border="surround"
						@click.native="selectContactShow" v-model="form.contactName">
					</u--input>
				</view>
			</u-cell>
			<u-cell v-if="form.associationType" :title="orderCodeName" arrow-direction="down" class="required-mark-new">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" style="flex:1" placeholder="请选择" border="surround"
						@click.native="invoiceDialogOpen" v-model="form.orderCode">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="报修地址" arrow-direction="down" class="required-mark-new">
				<view slot="value" style="display: flex;align-items: center;width: 100%;">
					<u--input :disabled="!isDisable" style="flex:1" placeholder="请输入" border="surround"
						v-model="form.contactAddress">
					</u--input>
				</view>
			</u-cell>
			<u-cell title="故障等级" arrow-direction="down" class="required-mark-new">
				<uni-data-picker :readonly="!isDisable" v-model="form.faultLevel" slot="value" placeholder="请选择"
					:localdata="fault_level" @change="sourceCodeOnchange">
				</uni-data-picker>
			</u-cell>
			<u-cell title="期望解决时间" arrow-direction="down">
				<uni-datetime-picker :disabled="!isDisable" type="date" slot="value" v-model="form.expectedTime">
				</uni-datetime-picker>
			</u-cell>
			<u-cell title="售后类型" arrow-direction="down" class="required-mark-new">
				<uni-data-picker :readonly="!isDisable" v-model="form.afterSalesType" slot="value" placeholder="请选择"
					:localdata="after_sales_type">
				</uni-data-picker>
			</u-cell>
			<u-cell title="是否收费" arrow-direction="down" class="required-mark-new">
				<uni-data-picker v-if="isDisable" v-model="form.isFee" slot="value" placeholder="请选择"
					:localdata="chargeList">
				</uni-data-picker>
				<u--input v-else slot="value" style="flex:1" placeholder="请输入" disabled border="surround"
					:value="form.isFee==1?'是':'否'">

				</u--input>

			</u-cell>
			<u-cell title="是否带配件" arrow-direction="down" class="required-mark-new">
				<uni-data-picker v-if="isDisable" v-model="form.isWithAccessories" slot="value" placeholder="请选择"
					:localdata="chargeList">
				</uni-data-picker>
				<u--input v-else slot="value" style="flex:1" placeholder="请输入" disabled border="surround"
					:value="form.isWithAccessories==1?'是':'否'">

				</u--input>
			</u-cell>
			<u-cell title="是否派车" arrow-direction="down" class="required-mark-new">
				<uni-data-picker v-if="isDisable" v-model="form.isPieCar" slot="value" placeholder="请选择"
					:localdata="chargeList">
				</uni-data-picker>
				<u--input v-else slot="value" style="flex:1" placeholder="请输入" disabled border="surround"
					:value="form.isPieCar==1?'是':'否'">

				</u--input>
			</u-cell>
			<u-cell title="派车类型" arrow-direction="down" class="required-mark-new" v-if="form.isPieCar==1">
				<uni-data-picker v-if="isDisable" v-model="form.pieCarType" slot="value" placeholder="请选择"
					:localdata="pie_car_type">
				</uni-data-picker>
				<u--input v-else slot="value" style="flex:1" placeholder="请输入" disabled border="surround"
					:value="getTetx(form.pieCarType)">

				</u--input>
			</u-cell>
			<u-cell title="是否外包" arrow-direction="down" class="required-mark-new">
				<uni-data-picker v-if="isDisable" v-model="form.isOutsource" slot="value" placeholder="请选择"
					:localdata="chargeList">
				</uni-data-picker>
				<u--input v-else slot="value" style="flex:1" placeholder="请输入" disabled border="surround"
					:value="form.isOutsource==1?'是':'否'">

				</u--input>
			</u-cell>
			<u-cell title="是否生成采购订单" arrow-direction="down" class="required-mark-new">
				<uni-data-picker v-if="isDisable" v-model="form.isCreatePurchaseOrder" slot="value" placeholder="请选择"
					:localdata="chargeList">
				</uni-data-picker>
				<u--input v-else slot="value" style="flex:1" placeholder="请输入" disabled border="surround"
					:value="form.isCreatePurchaseOrder==1?'是':'否'">

				</u--input>
			</u-cell>
			<u-cell title="涉及事业部门" arrow-direction="down" class="required-mark-new" @click.native="salesDeptShow">
				<u--input slot="value" :disabled="!isDisable" style="pointer-events: none;" placeholder="请选择"
					border="surround" v-model="form.involveDeptName"></u--input>
			</u-cell>
			<u-cell title="备注说明" arrow-direction="down">
				<u--textarea border="surround" :disabled="!isDisable" placeholder=" " slot="value" v-model="form.remark"
					autoHeight></u--textarea>
			</u-cell>
		</u-cell-group>
		<AfterSales ref="salesRef" :type="type" v-show="current == 1" :afterSalesType="form.afterSalesType"
			:itemList="form.productDetail" />
		<!-- 方案列表 -->
		<SchemeList ref="schemeRef" v-show="current == 2" :type='type' :itemList="costListVOS" />
		<!-- 联系人 -->
		<ContactList ref="contactRef" :type="type" v-show="current == 3" :itemList="form.contactInfoVOS" />
		<view class="footerButton" v-if="isDisable">
			<u-button type="default" text="返回" @click="back"></u-button>
			<u-button type="primary" @click="save" text="保存"></u-button>
		</view>
		<view style="height:84rpx;width:100%">

		</view>
		<u-toast ref="uToast"></u-toast>
		<ba-tree-picker ref="treePicker" :multiple="false" @select-change="confirm" :localdata="listData" valueKey="id"
			textKey="name" childrenKey="children" />
	</view>
</template>

<script>
	import {
		getByCode
	} from '@/api/pda/common.js'
	import {
		contactDetail
	} from '@/api/saleManage/contact/index.js'
	import {
		saveSalesDemand,
		updateSalesDemand,
		getSalesDemandById
	} from '@/api/salesServiceManagement/demandList/index.js'
	import AfterSales from './components/AfterSales.vue'
	import ContactList from './components/contactList.vue'
	import SchemeList from '@/pages/salesServiceManagement/workOrder/components/schemeList.vue';
	import baTreePicker from '@/components/ba-tree-picker/ba-tree-picker.vue'
	import {
		listOrganizations,
	} from '@/api/myTicket/index.js'
	export default {
		components: {
			AfterSales,
			ContactList,
			SchemeList
		},
		computed: {
			isDisable() {
				let flag = this.type != 'view'
				return flag;
			},
			orderCodeName() {
				let name = this.associationTypeList.find(item => item.value === this.form.associationType)?.text || ''
				if (name === '客户') {
					return '产品'
				}
				return name
			}
		},
		data() {
			return {
				form: {
					tableList: [],
					contactInfoVOS: [],
					faultDetailList: [],
					associationType: '1',
					aftertype: '',
					salespersonName: '',
					salespersonId: '',
					isWithAccessories: 0,
					isFee: 0,
					isPieCar: 0,
					pieCarType: '',
					isOutsource: 0,
					isCreatePurchaseOrder: 0,
					supplierName: '',
					supplierId: '',
					supplierCode: '',
					involveDeptId: '',
					involveDeptName: '',
					remark: '',
					processInstanceId: '' // 新增流程实例ID字段
				},
				costListVOS: [],
				associationTypeList: [{
						value: '1',
						text: '发货单'
					},
					{
						value: '2',
						text: '销售订单'
					},
					{
						value: '3',
						text: '客户'
					}
				],
				createUserName: '',
				list: ['基本信息', '售后对象', '方案', '联系人'],
				current: 0,
				fault_level: [],
				after_sales_type: [],
				chargeList: [{
						text: '是',
						value: 1
					},
					{
						text: '否',
						value: 0
					}
				],
				partList: [{
						text: '是',
						value: 1
					},
					{
						text: '否',
						value: 0
					}
				],
				carList: [{
						text: '是',
						value: 1
					},
					{
						text: '否',
						value: 0
					}
				],
				title: '新增需求',
				type: 'add',
				listData: [],
				pie_car_type: []
			}
		},
		created() {

		},
		onLoad(params) {
			this.type = params.type;
			console.log(params.type, 'params.type')
			if (params.id) {
				this.title = params.type == 'view' ? '需求详情' : '修改需求'
				this.getDetails(params.id);
			} else {
				const userInfo = uni.getStorageSync('userInfo');
				this.createUserName = userInfo.name;
				this.getByCode();
			}
			// 客户数据
			uni.$off('setSelectList')
			uni.$on('setSelectList', (data) => {
				if (data && data.length > 0) {
					let res = data[0]
					this.$set(this.form, 'contactId', res.id);
					this.$set(this.form, 'contactName', res.name);
					this.contactDetail(res.id)
					// this.$forceUpdate();
				}
			})
			// 售后对象数据
			uni.$on('goosData', (data) => {
				this.$set(this.form, 'orderCode', data.orderCode);
				this.$set(this.form, 'orderId', data.orderId);
				console.log(data, 'data');
				let list = JSON.parse(JSON.stringify(data.tableList));
				console.log(list);
				// 如果计量数量没有的话默认是 1
				list.map(
					(el) =>
					(el.measureQuantity = el.measureQuantity ? el.measureQuantity : 1)
				);
				this.$set(this.form, 'productDetail', list);
			})
			listOrganizations(1).then(data => {
				this.listData = data
			})
			uni.$off('setProduceList')
			uni.$on('setProduceList', (data) => {
				console.log('data', data)
				let list = data.map((el) => {
					el.categoryCode = el.code;
					el.categoryName = el.name;
					el.categoryModel = el.modelType;
					el.productCategoryName = el.categoryLevelPath
					return el;
				});
				let params = {
					orderCode: list[0].categoryCode,
					orderId: list[0].id,
					tableList: list,
				};
				// this.tableList.push(...data)
				this.$set(this.form, 'orderCode', params.orderCode);
				this.$set(this.form, 'orderId', params.orderId);
				console.log(params, 'params');
				let listnew = JSON.parse(JSON.stringify(params.tableList));
				console.log(listnew);
				// 如果计量数量没有的话默认是 1
				listnew.map(
					(el) =>
					(el.measureQuantity = el.measureQuantity ? el.measureQuantity : 1)
				);
				this.$set(this.form, 'productDetail', listnew);
			})
		},
		onUnload() {
			uni.$off('setSelectList');
			uni.$off('goosData');
			uni.$off('setProduceList');
		},
		mounted() {

		},
		methods: {
			getTetx(val) {
				return this.pie_car_type.find(data => data.value == val)?.text
			},
			//选择部门
			salesDeptShow() {
				if (!this.isDisable) {
					return
				}
				this.$refs.treePicker._show()
			},
			// 查询详情
			async getDetails(id) {
				this.getByCode();
				const res = await getSalesDemandById(id);
				console.log('res', res.orderCode)
				let data = JSON.parse(JSON.stringify(res));
				console.log('data111', data.orderCode)
				data.pieCarType = data.pieCarType?.toString() || '';
				this.form = data;
				['afterSalesType'].forEach(key => {
					this.$set(
						this.form,
						key,
						res[key].toString()
					);
				})
				this.costListVOS = this.form.costListVOS


				this.createUserName = data.createUserName;
				console.log(this.form, 'this.form')
				let obj = this.fault_level.find(el => el.value == res.faultLevel)
				let associationTypeObj = this.associationTypeList.find(el => el.value == res.associationType)
				this.form.associationType = associationTypeObj.value;
				if (res.faultLevel) {
					this.sourceCodeOnchange({
						"detail": {
							"value": [obj]
						}
					});
				}
			},

			sectionChange(index) {
				this.current = index;
			},
			selectContactShow() {
				if (!this.isDisable) {
					return
				}
				uni.navigateTo({
					url: `/pages/saleManage/components/selectContact?isAll=2&type=需求`
				})
			},
			//客户回调
			async contactDetail(id) {
				let {
					base,
					other,
					linkList
				} = await contactDetail(id);
				base.contactName = base.name;
				let addressName = '';
				if (other.addressName) {
					addressName += other.addressName;
				}
				if (other.address) {
					addressName += other.address;
				}
				this.form.contactCode = base.code;
				if (this.type != 'view') {
					this.$set(this.form, 'contactAddress', addressName);
					this.$set(
						this.form,
						'contactInfoVOS',
						linkList.map((item) => {
							item['contactName'] = item.linkName;
							item['contactPhone'] = item.mobilePhone;
							item['telephone'] = item.phone;
							return item;
						})
					);
					// 清空发货单的数据 *** 初次进来不清空
					this.$set(this.form, 'orderCode', '');
					this.$set(this.form, 'orderId', '');
					this.$set(this.form, 'productDetail', []);
				}
			},
			sourceCodeOnchange(e) {
				const value = e.detail.value;
				this.form.faultLevel = value[0].value;
			},
			associationTypeOnchange(e) {
				const value = e.detail.value;
				this.form.associationType = value[0].value;
				this.form.orderCode = ''
			},
			invoiceDialogOpen() {
				if (!this.isDisable) {
					return
				}
				if (!this.form.contactId && this.form.associationType !== '3') {
					this.$refs.uToast.show({
						type: "warning",
						message: "请先选择客户",
					})
					return;
				}
				console.log(this.form.associationType)
				if (this.form.associationType === '3') {
					// uni.navigateTo({
					// 	url: '/pages/salesServiceManagement/demandList/components/product?contactId=' + this.form
					// 		.contactId + '&associationType=' + this.form.associationType
					// })
					uni.navigateTo({
						url: '/pages/saleManage/components/selectProduce?isAll=' + 0
					})
				} else {
					uni.navigateTo({
						url: '/pages/salesServiceManagement/demandList/components/Invoice?contactId=' + this.form
							.contactId + '&associationType=' + this.form.associationType
					})
				}

			},
			//部门回调
			confirm(data, name) {
				this.form.involveDeptName = name || ''
				this.form.involveDeptId = data[0] || ''
				console.log(this.form, 'this.form')
			},
			getByCode() {
				const codeS = ['fault_level', 'after_sales_type', 'pie_car_type']
				codeS.forEach(async (code) => {
					const codeValue = await getByCode(code);
					this[code] = codeValue.map(item => {
						const key = Object.keys(item)[0]
						return {
							value: key,
							text: item[key]
						}
					})
				})

			},
			save() {
				let data = JSON.parse(JSON.stringify(this.form));
				delete data.productDetail;
				try {
					if (!data.name) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请输入需求名称",
						})
						return
					}
					if (!data.contactName) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请选择客户名称",
						})
						return
					}
					if (!data.associationType) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请选择关联类型",
						})
						return
					}

					if (data.isPieCar==1 && !data.pieCarType) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请选择派车类型",
						})
						return
					}

					if (!data.orderCode && this.form.associationType !== '3') {
						const message = this.form.associationType === "1" ? "请选择发货单" : "请选择销售订单"
						this.$refs.uToast.show({
							type: "warning",
							message: message,
						})
						return
					}
					if (!data.contactAddress) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请输入报修地址",
						})
						return
					}
					if (!data.faultLevel) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请选择故障等级",
						})
						return
					}
					if (!data.afterSalesType) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请选择售后类型",
						})
						return
					}
					if (!data.involveDeptName) {
						this.$refs.uToast.show({
							type: "warning",
							message: "请选择涉及事业部门",
						})
						return
					}

					let isMessage = [];
					[{
						name: '请选择是否收费',
						key: 'isFee'
					}, {
						name: '请选择是否带配件',
						key: 'isWithAccessories'
					}, {
						name: '请选择是否派车',
						key: 'isPieCar'
					}, {
						name: '请选择是否外包',
						key: 'isOutsource'
					}, {
						name: '请选择是否生成采购订单',
						key: 'isCreatePurchaseOrder'
					}].forEach(item => {
						if (data[item.key] != 1 && data[item.key] !== 0 && !isMessage.length) {
							console.log(item, 'item')
							isMessage.push(item)
						}
					})
					if (isMessage.length) {
						this.$refs.uToast.show({
							type: "warning",
							message: isMessage[0].name,
						})
						return
					}


					// 联系人数据
					let contactInfoVOS = this.$refs.contactRef.getTabData();
					if (contactInfoVOS.length == 0) {
						this.$refs.uToast.show({
							type: "warning",
							message: "至少需要存在一条联系人数据",
						})
						this.current = 2
						return
					}
					data.contactInfoVOS = this.$refs.contactRef.getTabData();
					// 售后对象数据
					let productDetail = this.$refs.salesRef.getTabData();
					data.productDetail = productDetail.map((item) => {
						item['produceTime'] = item['produceTime'] || null;
						return item;
					})
					data.costListVOS = this.$refs.schemeRef.getTabData()

					uni.showLoading({
						title: '加载中'
					})

					let requestname =
						this.type === 'add' ? saveSalesDemand : updateSalesDemand;
					requestname(data).then((res) => {
						uni.hideLoading()
						this.back()
						this.$refs.uToast.show({
							type: "success",
							message: "操作成功",
						})
					}).catch((e) => {
						uni.hideLoading()
					})
				} catch (error) {
					uni.hideLoading();
				}
			}
		},
	}
</script>

<style lang="scss" scoped>
	/deep/.u-subsection__item__text {
		font-size: 28rpx !important;
	}

	/deep/.u-cell__body__content {
		flex: none;
		margin-right: 16rpx;
	}

	/deep/.uni-textarea-textarea {
		color: red;
	}

	.footerButton {
		width: 100%;
		height: 84rpx;
		display: flex;
		position: fixed;
		bottom: 0;
		z-index: 10;
		background: #fff;

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

		>view {
			flex: 1;

		}
	}
</style>