antissoft / lvqianmeiye_ERP

<template>
	<el-dialog :title="!dataForm.id ? '新建开单记录' : isDetail ? '开单记录详情' : '编辑开单记录'" :close-on-click-modal="false"
		:visible.sync="visible" class="NCC-dialog NCC-dialog_center" lock-scroll width="1200px">
		<el-row :gutter="20" class="form-layout">
			<el-form ref="elForm" :model="dataForm" size="mini" label-width="100px" label-position="right"
				:disabled="!!isDetail" :rules="rules">
				<el-col :span="8">
					<el-form-item label="整单业绩" prop="zdyj" required>
						<el-input v-model="dataForm.zdyj" placeholder="请输入" clearable :style='{"width":"100%"}' @input="formatNumber('zdyj')">
							<template slot="append">元</template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="实付业绩" prop="sfyj" required>
						<el-input v-model="dataForm.sfyj" placeholder="自动计算" clearable readonly :style='{"width":"100%"}' @input="formatNumber('sfyj')">
							<template slot="append">元</template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="欠款" prop="qk">
						<el-input v-model="dataForm.qk" placeholder="自动计算" clearable readonly :style='{"width":"100%"}' >
							<template slot="append">元</template>
						</el-input>
					</el-form-item>
				</el-col>

				<!-- 业绩明细 -->
				<el-col :span="24">
					<el-form-item label-width="0">
						<div class="table-header">
							<span class="table-title">品项明细</span>
							<!-- <el-button type="warning" size="mini" icon="el-icon-plus" @click="addHandleLqKdPxmxEntityList()">新增品项</el-button> -->
						</div>
						
						<!-- 品项列表 -->
						<div class="px-list-container">
							<div v-for="(px, pxIndex) in dataForm.lqKdPxmxList" :key="pxIndex" class="px-item">
								<!-- 品项基本信息行 -->
								<div class="px-basic-info">
									<div class="px-item-header">
										<span class="px-item-title">品项 {{ pxIndex + 1 }}</span>
										<!-- <el-button size="mini" type="danger" icon="el-icon-delete" @click="handleDelLqKdPxmxEntityList(pxIndex)">删除品项</el-button> -->
									</div>
									<div class="px-basic-fields">
										<div class="px-field">
											<label>品项</label>
											<el-select v-model="px.px" placeholder="请选择品项" clearable filterable @change="handlePxChange(pxIndex, px)" style="width: 200px;">
												<el-option v-for="(item, index) in pxOptions" :key="index" :label="item.fullName" :value="item.id" :disabled="item.disabled"></el-option>
											</el-select>
										</div>
										<div class="px-field">
											<label>品项名称</label>
											<el-input v-model="px.pxmc" placeholder="请输入品项名称" clearable style="width: 200px;"></el-input>
										</div>
										<div class="px-field">
											<label>总价</label>
											<el-input v-model="px.actualPrice" placeholder="总价" clearable @input="handleActualPriceChange(pxIndex, px)" style="width: 160px;">
												<template slot="append">元</template>
											</el-input>
										</div>
										<div class="px-field">
											<label>数量</label>
											<el-input-number disabled v-model="px.projectNumber" :min="1" :max="999" placeholder="数量" size="mini" style="width: 160px;" @change="handlePxQuantityChange(pxIndex, px)"></el-input-number>
										</div>
										<div class="px-field">
											<label>单价</label>
											<el-input v-model="px.pxjg" placeholder="单价" clearable @input="handlePxJgChange(pxIndex, px)" style="width: 160px;">
												<template slot="append">元</template>
											</el-input>
										</div>
										<div class="px-field">
											<label>类型</label>
											<el-select disabled v-model="px.sourceType" placeholder="类型" clearable size="mini" style="width: 160px;">
												<el-option label="购买" value="购买"></el-option>
												<el-option label="体验" value="体验"></el-option>
												<el-option label="赠送" value="赠送"></el-option>
											</el-select>
										</div>
										<div class="px-field" style="min-width: 300px;">
											<label>备注</label>
											<el-input v-model="px.remark" placeholder="请输入备注" clearable type="textarea" :rows="2" style="width: 100%;"></el-input>
										</div>
									</div>
								</div>

							</div>
						</div>
					</el-form-item>
				</el-col>
			</el-form>
		</el-row>
		<span slot="footer" class="dialog-footer">
			<el-button @click="visible = false">取 消</el-button>
			<!-- <el-button @click="resetForm" v-if="!isDetail">重 置</el-button> -->
			<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail">确 定</el-button>
		</span>
	</el-dialog>
</template>
<script>
import request from '@/utils/request'
import { getDictionaryDataSelector } from '@/api/systemData/dictionary'
import { previewDataInterface } from '@/api/systemData/dataInterface'
import { getInfo } from '@/api/user'
export default {
	components: {},
	props: [],
	data() {
		return {
			loading: false,
			visible: false,
			isDetail: false,
			dataForm: {
				id: '',
				id: undefined,
				kdhy: undefined,
				kdhyc: undefined,
				kdhysjh: undefined,
				djmd: undefined,
				jsj: undefined,
				kdrq: new Date(),
				gjlx: undefined,
				hgjg: undefined,
				zdyj: undefined,
				sfyj: undefined,
				qk: undefined,
				ckfs: undefined,
				ckmx: undefined,
				fkfs: undefined,
				fkyy: undefined,
				fkpd: undefined,
				khly: undefined,
				tjr: undefined,
				sfskdd: undefined,
				sfck: '否',
				jj: undefined,
				scwj: [],
				hyqz: [],
				bz: undefined,
				// lqKdJksyjList: [],
				// lqKdKjbsyjList: [],
				lqKdPxmxList: [],
				jksyj: undefined,
				kjblsyj: undefined,
				pxxx: undefined,
				lqKdKdjlbDeductList: [],
			},
			rules: {
				kdhy: [
					{ required: true, message: '请选择开单会员', trigger: 'change' }
				],
				djmd: [
					{ required: true, message: '请选择单据门店', trigger: 'change' }
				],
				jsj: [
					{ required: true, message: '请选择金三角', trigger: 'change' }
				],
				gjlx: [
					{ required: true, message: '请选择顾客类型', trigger: 'change' }
				],
				kdrq: [
					{ required: true, message: '请选择开单日期', trigger: 'change' }
				],
				zdyj: [
					{ required: true, message: '请输入整单业绩', trigger: 'blur' },
					{ pattern: /^\d+(\.\d{1,2})?$/, message: '请输入正确的金额格式', trigger: 'blur' }
				],
				sfyj: [
					{ required: true, message: '请输入实付业绩', trigger: 'blur' },
					{ pattern: /^\d+(\.\d{1,2})?$/, message: '请输入正确的金额格式', trigger: 'blur' }
				],
				fkfs: [
					{ required: true, message: '请选择付款方式', trigger: 'change' }
				]
			},
			kdhyOptions: [],
			djmdOptions: [],
			jsjOptions: [],
			gjlxOptions: [{ "fullName": "会员", "id": "会员" }, { "fullName": "非会员", "id": "非会员" }],
			hgjgOptions: [],
			ckfsOptions: [{ "fullName": "储值卡", "id": "储值卡" }, { "fullName": "扣项", "id": "扣项" }, { "fullName": "套餐", "id": "套餐" }],
			fkfsOptions: [{ "fullName": "现金", "id": "现金" }, { "fullName": "微信", "id": "微信" }, { "fullName": "支付宝", "id": "支付宝" }, { "fullName": "银行卡", "id": "银行卡" }, { "fullName": "医院", "id": "医院" }, { "fullName": "合作", "id": "合作" }],
			fkyyOptions: [],
			khlyOptions: [{ "fullName": "自然到店", "id": "自然到店" }, { "fullName": "会员推广", "id": "会员推广" }, { "fullName": "网络推广", "id": "网络推广" }],
			sfskddOptions: [{ "fullName": "是", "id": "是" }, { "fullName": "否", "id": "否" }],
			sfckOptions: [{ "fullName": "是", "id": "是" }, { "fullName": "否", "id": "否" }],
			pxOptions: [],
			jksOptions: [],
			kjbOptions: [],
		}
	},
	computed: {},
	watch: {
		'dataForm.zdyj': {
			handler(newVal) {
				this.calculateQk();
			}
		},
		'dataForm.sfyj': {
			handler(newVal) {
				this.calculateQk();
			}
		},
		'dataForm.djmd': {
			handler(newVal) {
				// 当门店改变时，重新获取健康师和科技部老师列表
				if (newVal) {
					this.getjksOptions();
					this.getkjbOptions();
				}
			}
		},
		// 监听品项列表变化，自动计算实付业绩
		'dataForm.lqKdPxmxList': {
			handler(newVal) {
				this.calculateSfyj();
			},
			deep: true
		}
	},
		created() {
			this.getkdhyOptions();
			this.getdjmdOptions();
			this.getjsjOptions();
			this.gethgjgOptions();
			this.getfkyyOptions();
			this.getpxOptions();
			// this.getjksOptions();
			// this.getkjbOptions(); // 移到门店选择后调用
		},
	mounted() {
	},
	methods: {
		// 格式化日期方法
		formatDate(date, format) {
			if (!date) return '';
			const d = new Date(date);
			const year = d.getFullYear();
			const month = String(d.getMonth() + 1).padStart(2, '0');
			const day = String(d.getDate()).padStart(2, '0');
			const hours = String(d.getHours()).padStart(2, '0');
			const minutes = String(d.getMinutes()).padStart(2, '0');
			const seconds = String(d.getSeconds()).padStart(2, '0');
			
			return format
				.replace('yyyy', year)
				.replace('MM', month)
				.replace('dd', day)
				.replace('HH', hours)
				.replace('mm', minutes)
				.replace('ss', seconds);
		},
		handleKdhyChange(val) {
			// 根据选择的会员ID获取会员信息
			const selectedMember = this.kdhyOptions.find(item => item.id === val);
			if (selectedMember) {
				this.dataForm.kdhyc = selectedMember.fullName;
				this.dataForm.kdhysjh = selectedMember.sjh;
				this.dataForm.gjlx = selectedMember.khlx;
				console.log('选择会员:', selectedMember);
				request({
					url: '/api/Extend/lqkhxx/order-type/'+selectedMember.id,
					method: 'GET',
				}).then((res) => {
					if (res.code == 200 ) {
						if(res.data.HasOrderRecord){
							this.dataForm.sfskdd = '否';
						} else {
							this.dataForm.sfskdd = '是';
						}
					} else {
					}
				})
			} else {
				// 清空相关字段
				this.dataForm.kdhyc = '';
				this.dataForm.kdhysjh = '';
				this.dataForm.gjlx = '';
			}
		},
		// 付款方式变化处理
		handleFkfsChange(val) {
			console.log('付款方式变化:', val);
			// 清空相关字段
			this.dataForm.fkyy = '';
			this.dataForm.hgjg = '';
			
			// 根据付款方式更新验证规则
			this.updateFkfsRules(val);
		},
		// 更新付款方式相关的验证规则
		updateFkfsRules(fkfs) {
			// 移除现有的付款相关验证规则
			delete this.rules.fkyy;
			delete this.rules.hgjg;
			
			// 根据付款方式添加相应的验证规则
			if (fkfs === '医院') {
				this.rules.fkyy = [
					{ required: true, message: '请选择结算机构', trigger: 'change' }
				];
			} else if (fkfs === '合作') {
				this.rules.hgjg = [
					{ required: true, message: '请选择合作机构', trigger: 'change' }
				];
			}
		},
		// 初始化品项的qt2字段（编辑时使用）
		initPxQt2Fields() {
			if (this.dataForm.lqKdPxmxList && this.dataForm.lqKdPxmxList.length > 0) {
				this.dataForm.lqKdPxmxList.forEach((px, index) => {
					if (px.px && !px.qt2) {
						// 根据品项ID查找对应的qt2值
						const selectedPx = this.pxOptions.find(item => item.id === px.px);
						if (selectedPx) {
							px.qt2 = selectedPx.qt2;
							console.log(`初始化第${index + 1}个品项的qt2字段:`, selectedPx.qt2);
						}
					}
				});
			}
		},
		// 验证品项列表
		validatePxList() {
			const pxList = this.dataForm.lqKdPxmxList;
			
			// 1. 验证是否有品项
			if (!pxList || pxList.length === 0) {
				this.$message.error('请至少添加一个品项');
				return false;
			}
			
			// 2. 验证每个品项的基本信息
			for (let i = 0; i < pxList.length; i++) {
				const px = pxList[i];
				
				// 验证品项是否选择
				if (!px.px) {
					this.$message.error(`第${i + 1}个品项请选择品项`);
					return false;
				}
				
				// 验证品项总价（赠送和体验类型可以为0）
				if (px.actualPrice === undefined || px.actualPrice === null || px.actualPrice === '' || parseFloat(px.actualPrice) < 0) {
					this.$message.error(`第${i + 1}个品项总价不能为负数`);
					return false;
				}
				
				// 购买类型的品项总价必须大于0
				if (px.sourceType === '购买' && parseFloat(px.actualPrice) <= 0) {
					this.$message.error(`第${i + 1}个品项是购买类型，总价必须大于0`);
					return false;
				}
				
				// 验证品项数量
				if (!px.projectNumber || parseInt(px.projectNumber) <= 0) {
					this.$message.error(`第${i + 1}个品项数量必须大于0`);
					return false;
				}
				
				// 验证健康师业绩
				if (!px.lqKdJksyjList || px.lqKdJksyjList.length === 0) {
					this.$message.error(`第${i + 1}个品项请至少添加一个健康师业绩`);
					return false;
				}
				
				// 验证每个健康师是否选择
				for (let j = 0; j < px.lqKdJksyjList.length; j++) {
					const jks = px.lqKdJksyjList[j];
					if (!jks.jks || !jks.jksxm) {
						this.$message.error(`第${i + 1}个品项的第${j + 1}个健康师必须选择`);
						return false;
					}
					if (jks.jksyj === undefined || jks.jksyj === null || jks.jksyj === '' || jks.jksyj.trim() === "") {
						this.$message.error(`第${i + 1}个品项的第${j + 1}个健康师业绩必须填写`);
						return false;
					}
					const yj = parseFloat(jks.jksyj);
					if (isNaN(yj) || yj < 0) {
						this.$message.error(`第${i + 1}个品项的第${j + 1}个健康师业绩必须为有效数字`);
						return false;
					}
				}
				
				// 如果是科美品项，验证科技部老师
				if (px.qt2 === '科美') {
					if (!px.lqKdKjbsyjList || px.lqKdKjbsyjList.length === 0) {
						this.$message.error(`第${i + 1}个品项是科美品项，必须至少选择一个科技部老师`);
						return false;
					}
					
					// 验证每个科技部老师是否选择
					for (let k = 0; k < px.lqKdKjbsyjList.length; k++) {
						const kjb = px.lqKdKjbsyjList[k];
						if (!kjb.kjbls || !kjb.kjblsxm) {
							this.$message.error(`第${i + 1}个品项的第${k + 1}个科技部老师必须选择`);
							return false;
						}
						if (kjb.kjblsyj === undefined || kjb.kjblsyj === null || kjb.kjblsyj === '' || kjb.kjblsyj.trim() === "") {
							this.$message.error(`第${i + 1}个品项的第${k + 1}个科技部老师业绩必须填写`);
							return false;
						}
						const yj = parseFloat(kjb.kjblsyj);
						if (isNaN(yj) || yj < 0) {
							this.$message.error(`第${i + 1}个品项的第${k + 1}个科技部老师业绩必须为有效数字`);
							return false;
						}
					}
				}
			}
			
			// 3. 验证每个品项总价等于该品项健康师业绩之和
			for (let i = 0; i < pxList.length; i++) {
				const px = pxList[i];
				const pxAmount = parseFloat(px.actualPrice) || 0;
				
				// 计算当前品项的健康师业绩之和
				let jksAmount = 0;
				if (px.lqKdJksyjList) {
					jksAmount = px.lqKdJksyjList.reduce((sum, jks) => sum + (parseFloat(jks.jksyj) || 0), 0);
				}
				
				// 验证当前品项总价等于健康师业绩之和（赠送和体验类型总价可以为0）
				if (Math.abs(pxAmount - jksAmount) > 0.01) {
					this.$message.error(`第${i + 1}个品项总价(${pxAmount.toFixed(2)})必须等于该品项健康师业绩之和(${jksAmount.toFixed(2)})`);
					return false;
				}
				
				// 如果是科美品项，验证科美品项总价等于科技部业绩之和
				if (px.qt2 === '科美') {
					let kjbAmount = 0;
					if (px.lqKdKjbsyjList) {
						kjbAmount = px.lqKdKjbsyjList.reduce((sum, kjb) => sum + (parseFloat(kjb.kjblsyj) || 0), 0);
					}
					
					if (Math.abs(pxAmount - kjbAmount) > 0.01) {
						this.$message.error(`第${i + 1}个科美品项总价(${pxAmount.toFixed(2)})必须等于该品项科技部业绩之和(${kjbAmount.toFixed(2)})`);
						return false;
					}
				}
			}
			
			return true;
		},
		getkdhyOptions() {
			request({
				url: '/api/Extend/LqKhxx?page=1&pageSize=20',
				method: 'GET',
			}).then((res) => {
				if (res.code == 200 && res.data.list.length > 0) {
					this.kdhyOptions = res.data.list.map(item => ({
						fullName: item.khmc,
						id: item.id,
						value: item.id,
						label: `${item.khmc}`,
						sjh: item.sjh, // 会员手机号
						khlx: item.khlx || '未知' // 客户来源/类型，默认为会员
					}));
				} else {
					this.kdhyOptions = [];
				}
				console.error(this.kdhyOptions)
			})
		},
		getdjmdOptions() {
			previewDataInterface('730960205902251269').then(res => {
				this.djmdOptions = res.data
			});
		},
		getjsjOptions() {
			previewDataInterface('733894897408410885').then(res => {
				this.jsjOptions = res.data
			});
		},
		gethgjgOptions() {
			previewDataInterface('733896629660157189').then(res => {
				this.hgjgOptions = res.data
			});
		},
		getfkyyOptions() {
			previewDataInterface('733898797075137797').then(res => {
				this.fkyyOptions = res.data
			});
		},
		getpxOptions() {
			request({
				url: '/api/Extend/LqXmzl?page=1&pageSize=1000',
				method: 'GET',
			}).then((res) => {
				if (res.code == 200 && res.data.list.length > 0) {
					this.pxOptions = res.data.list.map(item => ({
						fullName: item.xmmc,
						id: item.id,
						value: item.id,
						label: item.xmmc,
						px: item.id,
						pxmc: item.xmmc,
						pxjg: item.pxjg || 0, // 添加价格字段
						qt2: item.qt2,
					}));
				} else {
					this.pxOptions = [];
				}
				console.error(this.pxOptions)
			})
		},
		getjksOptions() {
			console.error('-----------')
			request({
				url: `/api/Extend/user?page=1&pageSize=1000&mdid=${this.dataForm.djmd}&gw=健康师`,
				method: 'GET',
			}).then((res) => {
				if (res.code == 200 && res.data.list.length > 0) {
					this.jksOptions = res.data.list.map(item => ({
						fullName: item.realName || item.name || item.userName,
						id: item.id,
						value: item.id,
						label: item.realName || item.name || item.userName,
						jks: item.id,
						jksxm: item.realName || item.name || item.userName,
						jkszh: item.mobilePhone || item.account || item.userName
					}));
				} else {
					this.jksOptions = [];
				}
				console.error(this.jksOptions)
			})
		},
		getkjbOptions() {
			// 获取科技部老师选项数据 - 参考lx.html的实现
			this.getKjbOptionsByOrganizeId();
		},
		// 根据门店ID获取科技部组织ID，再获取科技部老师列表
		async getKjbOptionsByOrganizeId() {
			const userResponse = await request({
				url: `/api/Extend/user?page=1&pageSize=1000&gw=科技老师`,
				method: 'GET',
			});
			
			if (userResponse.code == 200 && userResponse.data && userResponse.data.list.length > 0) {
				this.kjbOptions = userResponse.data.list.map(item => ({
					fullName: item.realName || item.name || item.userName,
					id: item.id,
					value: item.id,
					label: item.realName || item.name || item.userName,
					kjbls: item.id,
					kjblsxm: item.realName || item.name || item.userName,
					kjblszh: item.mobilePhone || item.account || item.userName
				}));
				console.log('科技部老师列表:', this.kjbOptions);
			} else {
				console.warn('获取科技部老师列表失败');
				this.kjbOptions = [];
			}
		},
		goBack() {
			this.$emit('refresh')
		},
		init(id, isDetail) {
			this.dataForm.id = id || 0;
			this.visible = true;
			this.isDetail = isDetail || false;
			this.dataForm.lqKdPxmxList = [];
			this.$nextTick(() => {
				this.$refs['elForm'].resetFields();
				if (this.dataForm.id) {
					request({
						url: '/api/Extend/LqKdKdjlb/' + this.dataForm.id,
						method: 'get'
					}).then(res => {
						this.dataForm = res.data;
						// if (!this.dataForm.scwj) this.dataForm.scwj = [];
						// if (!this.dataForm.hyqz) this.dataForm.hyqz = [];
						
						// // 编辑时，根据门店ID加载健康师和科技部老师选项
						// if (this.dataForm.djmd) {
						// 	this.getjksOptions();
						// 	this.getkjbOptions();
						// }
						
						// // 编辑时，初始化品项的qt2字段（延迟执行确保pxOptions已加载）
						// this.$nextTick(() => {
						// 	this.initPxQt2Fields();
						// });
						// this.dataForm.f_FileUrl = this.dataForm.F_FIleUrl?JSON.parse(this.dataForm.F_FIleUrl):[];
					})
				} else {
					// 新增时先加载门店数据，再获取用户门店
					this.loadStoreDataAndSetDefault();
				}
			})
		},
		loadStoreDataAndSetDefault() {
			console.log('开始加载门店数据和用户信息...');
			// 先加载门店数据
			this.loadStoreDataPromise().then(() => {
				// 门店数据加载完成后，获取用户信息
				return this.getCurrentUserStorePromise();
			}).then((userData) => {
				if (userData && userData.mdid) {
					const userStoreId = userData.mdid;
					console.log('用户门店ID:', userStoreId);
					console.log('门店选项列表:', this.djmdOptions);

					// 检查用户门店ID是否在门店列表中
					const matchingStore = this.djmdOptions.find(store => store.id === userStoreId);
					if (matchingStore) {
						this.dataForm.djmd = userStoreId;
						console.log('找到匹配的门店，设置默认门店ID:', userStoreId);
						console.log('匹配的门店信息:', matchingStore);
					} else {
						console.warn('用户门店ID在门店列表中未找到匹配项');
						console.log('用户门店ID:', userStoreId);
						console.log('可用门店ID列表:', this.djmdOptions.map(s => s.id));
					}

				} else {
					console.warn('用户数据中没有门店ID，无法设置默认值');
				}
				this.getjksOptions();
				this.getkjbOptions(); // 在门店数据加载完成后获取科技部老师
			}).catch(err => {
				console.error('加载数据失败:', err);
			});
		},
		loadStoreDataPromise() {
			// 使用原来的数据接口方式
			return previewDataInterface('730960205902251269').then(res => {
				console.log('门店API原始响应:', res);
				if (res.data && res.data.length > 0) {
					this.djmdOptions = res.data;
					console.log('门店数据加载成功:', this.djmdOptions);
					return res.data;
				} else {
					console.warn('门店数据为空');
					return [];
				}
			}).catch(err => {
				console.error('门店数据加载失败:', err);
				return [];
			});
		},
		getCurrentUserStorePromise() {
			return new Promise((resolve, reject) => {
				getInfo().then(res => {
					resolve(res.data.userInfo);
				}).catch(err => {
					console.error('获取当前用户信息失败:', err);
					reject(err);
				});
			});
		},
		getCurrentUserStore() {
			getInfo().then(res => {
				if (res.data && res.data.mdid) {
					// 使用mdid字段作为门店ID
					this.dataForm.djmd = res.data.mdid;
					console.log('当前用户门店ID:', res.data.mdid);
				} else {
					console.warn('当前用户没有门店ID信息');
				}
			}).catch(err => {
				console.error('获取当前用户信息失败:', err);
			});
		},
		calculateQk() {
			const zdyj = parseFloat(this.dataForm.zdyj) || 0;
			const sfyj = parseFloat(this.dataForm.sfyj) || 0;
			this.dataForm.qk = (zdyj - sfyj).toFixed(2);
		},
		// 计算实付业绩 - 根据品项总价自动计算
		calculateSfyj() {
			let totalSfyj = 0;
			
			// 遍历所有品项，计算总实付业绩
			this.dataForm.lqKdPxmxList.forEach(px => {
				const actualPrice = parseFloat(px.actualPrice) || 0;
				totalSfyj += actualPrice;
			});
			
			// 更新实付业绩
			this.dataForm.sfyj = totalSfyj.toFixed(2);
			console.log('计算实付业绩:', totalSfyj);
			
			// 重新计算欠款
			this.calculateQk();
		},
		formatNumber(field) {
			// 移除千分位分隔符，只保留数字和小数点
			let value = this.dataForm[field].toString().replace(/,/g, '');
			// 确保是有效的数字格式
			if (!/^\d*\.?\d*$/.test(value)) {
				value = value.replace(/[^\d.]/g, '');
			}
			// 更新原始值
			this.dataForm[field] = value;
			// 重新计算欠款
			this.calculateQk();
		},
		formatTableNumber(index, field, listName) {
			// 表格中数字格式化
			let value = this.dataForm[listName][index][field].toString().replace(/,/g, '');
			if (!/^\d*\.?\d*$/.test(value)) {
				value = value.replace(/[^\d.]/g, '');
			}
			this.dataForm[listName][index][field] = value;
		},
		handleJksChange(index, row) {
			// 当选择健康师时，自动填充姓名和账号
			if (row.jks) {
				// 这里可以根据用户ID获取用户信息
				// 暂时手动输入
				this.$message.info('请手动输入健康师姓名和账号');
			}
		},
		handleKjblsChange(index, row) {
			// 当选择科技部老师时，自动填充姓名和账号
			if (row.kjbls) {
				// 这里可以根据用户ID获取用户信息
				// 暂时手动输入
				this.$message.info('请手动输入科技部老师姓名和账号');
			}
		},
		resetForm() {
			this.$confirm('确定要重置表单吗？', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.$refs['elForm'].resetFields();
				// 重置表格数据
				this.dataForm.lqKdJksyjList = [];
				this.dataForm.lqKdKjbsyjList = [];
				this.dataForm.lqKdPxmxList = [];
				// 重新获取当前用户门店
				if (!this.dataForm.id) {
					this.getCurrentUserStore();
				}
				this.$message.success('表单已重置');
			}).catch(() => {
				// 用户取消
			});
		},
		dataFormSubmit() {
			console.log(this.dataForm);
			
			// 创建新的格式化对象
			const formattedData = this.createFormattedData();
			console.log('格式化后的数据:', formattedData);

			// let jsj = '';
			// // 使用 Set 来去重，同时过滤掉空值
			// // 从所有品项的健康师列表中提取 jsjName
			// const allJksNames = [];
			// this.dataForm.lqKdPxmxList.forEach(px => {
			// 	if (px.lqKdJksyjList && px.lqKdJksyjList.length > 0) {
			// 		px.lqKdJksyjList.forEach(jks => {
			// 			if (jks.jsjName && jks.jsjName.trim() !== '') {
			// 				allJksNames.push(jks.jsjName);
			// 			}
			// 		});
			// 	}
			// });

			// const uniqueNames = [...new Set(allJksNames)];

			// // 拼接结果，如果没有有效名称则显示"暂无"
			// jsj = uniqueNames.length > 0 ? uniqueNames.join(',') : '暂无';
			// console.log('从品项健康师提取的jsjName:', uniqueNames, jsj);
			// this.dataForm.jsj = jsj;
		
			this.$refs['elForm'].validate((valid) => {
				if (valid) {
					// 验证品项
					// if (!this.validatePxList()) {
					// 	return;
					// }
					request({
						url: '/api/Extend/lqkdkdjlb/UpdateBillingAmount',
						method: 'PUT',
						data: formattedData
					}).then((res) => {
						this.$message({
							message: res.msg,
							type: 'success',
							duration: 1000,
							onClose: () => {
								this.visible = false
								this.$emit('refresh', true)
							}
						})
					})
						return;
					this.dataForm.f_FileUrl = JSON.stringify(this.dataForm.f_FileUrl);
					if (!this.dataForm.id) {
						request({
							url: `/api/Extend/LqKdKdjlb`,
							method: 'post',
							data: this.dataForm,
						}).then((res) => {
							this.$message({
								message: res.msg,
								type: 'success',
								duration: 1000,
								onClose: () => {
									this.visible = false,
										this.$emit('refresh', true)
								}
							})
						})
					} else {
						request({
							url: '/api/Extend/LqKdKdjlb/' + this.dataForm.id,
							method: 'PUT',
							data: this.dataForm
						}).then((res) => {
							this.$message({
								message: res.msg,
								type: 'success',
								duration: 1000,
								onClose: () => {
									this.visible = false
									this.$emit('refresh', true)
								}
							})
						})
					}
				}
			})
		},
		addHandleLqKdJksyjEntityList() {
			let item = {
				id: undefined,
				glkdbh: undefined,
				jks: undefined,
				jksxm: undefined,
				jkszh: undefined,
				jksyj: undefined,
				yjsj: undefined,
			}
			this.dataForm.lqKdJksyjList.push(item)
		},
		handleDelLqKdJksyjEntityList(index) {
			this.dataForm.lqKdJksyjList.splice(index, 1);
		},
		addHandleLqKdKjbsyjEntityList() {
			let item = {
				id: undefined,
				glkdbh: undefined,
				kjbls: undefined,
				kjblsxm: undefined,
				kjblszh: undefined,
				kjblsyj: undefined,
				yjsj: undefined,
			}
			this.dataForm.lqKdKjbsyjList.push(item)
		},
		handleDelLqKdKjbsyjEntityList(index) {
			this.dataForm.lqKdKjbsyjList.splice(index, 1);
		},
		addHandleLqKdPxmxEntityList() {
			let item = {
				id: undefined,
				glkdbh: undefined,
				px: undefined,
				pxmc: undefined,
				pxjg: undefined,
				actualPrice: undefined, // 添加总价字段
				projectNumber: 1,
				sourceType: '购买',
				qt2: undefined, // 添加qt2字段
				remark: undefined, // 添加备注字段
				lqKdJksyjList: [],
				lqKdKjbsyjList: [],
			}
			this.dataForm.lqKdPxmxList.push(item)
		},
		handlePxChange(index, row) {
			// 当选择品项时，自动填充品项名称和qt2字段
			if (row.px) {
				const selectedPx = this.pxOptions.find(item => item.id === row.px);
				if (selectedPx) {
					row.pxmc = selectedPx.fullName;
					row.qt2 = selectedPx.qt2; // 设置qt2字段
					// 如果品项有价格，设置到总价字段
					if (selectedPx.pxjg && selectedPx.pxjg > 0) {
						row.actualPrice = selectedPx.pxjg;
						// 计算单价
						this.calculateUnitPrice(index, row);
					}
					// 同步更新新字段名
					row.projectNumber = row.projectNumber || 1; // 确保数量有默认值
					row.sourceType = row.sourceType || '购买'; // 确保类型有默认值
					console.log('选择品项:', selectedPx.fullName, 'qt2:', selectedPx.qt2);
					// 重新计算实付业绩
					this.calculateSfyj();
				}
			}
		},
		handleDelLqKdPxmxEntityList(index) {
			this.dataForm.lqKdPxmxList.splice(index, 1);
			// 删除品项后重新计算实付业绩
			this.calculateSfyj();
		},
		// 总价变化处理
		handleActualPriceChange(pxIndex, row) {
			// 格式化总价输入
			let value = row.actualPrice.toString().replace(/,/g, '');
			if (!/^\d*\.?\d*$/.test(value)) {
				value = value.replace(/[^\d.]/g, '');
			}
			row.actualPrice = value;
			
			// 计算单价 = 总价 / 数量（允许总价为0）
			this.calculateUnitPrice(pxIndex, row);
			
			// 重新计算实付业绩
			this.calculateSfyj();
		},
		// 品项单价变化处理
		handlePxJgChange(pxIndex, px) {
			console.log('品项单价变化:', px);
			this.calculateActualPrice(pxIndex, px);
			// 重新计算实付业绩
			this.calculateSfyj();
		},
		// 计算总价
		calculateActualPrice(pxIndex, px) {
			console.log('品项总价变化:', px);
			const pxjg = parseFloat(px.pxjg) || 0;
			const quantity = parseInt(px.projectNumber) || 1;
			px.actualPrice = (pxjg * quantity).toFixed(2);
		},
		// 计算单价
		calculateUnitPrice(pxIndex, row) {
			const actualPrice = parseFloat(row.actualPrice) || 0;
			const quantity = parseInt(row.projectNumber) || 1;
			row.pxjg = (actualPrice / quantity).toFixed(2);
		},
		// 品项价格变化处理（保留但不再使用）
		handlePxPriceChange(pxIndex, row) {
			// 格式化价格输入
			let value = row.pxjg.toString().replace(/,/g, '');
			if (!/^\d*\.?\d*$/.test(value)) {
				value = value.replace(/[^\d.]/g, '');
			}
			row.pxjg = value;
			// 重新计算实付业绩
			this.calculateSfyj();
		},
		// 品项数量变化处理
		handlePxQuantityChange(pxIndex, row) {
			// 重新计算单价
			this.calculateUnitPrice(pxIndex, row);
			// 重新计算实付业绩
			this.calculateSfyj();
		},
		// 品项健康师选择
		handleJksChange(pxIndex, jksIndex, row) {
			console.log('品项健康师选择:', row);
			if (row.jks) {
				// 根据选择的健康师ID获取用户信息
				const selectedJks = this.jksOptions.find(item => item.id === row.jks);
				if (selectedJks) {
					// 填充姓名和账号
					row.jksxm = selectedJks.fullName;
					row.jkszh = selectedJks.userName || selectedJks.account || selectedJks.id;
					
					// 获取金三角信息
					this.getJsjInfoByUserId(row.jks, (jsjId, jsjName) => {
						row.jsjName = jsjName;
						row.jsj_id = jsjId;
					});
				}
			} else {
				// 清空相关字段
				row.jksxm = '';
				row.jkszh = '';
				row.jsj_id = '';
			}
		},
		// 根据用户ID获取金三角信息
		getJsjInfoByUserId(userId, callback) {
			let date = new Date(this.dataForm.kdrq);
			let formattedDate = this.formatDate(date, 'yyyy-MM-dd HH:mm:ss');
			console.log('formattedDate:', formattedDate);
			request({
				url: `/api/Extend/lqycsdjsj/GetJsjInfoByUserMonth?UserId=${userId}&DateTime=${formattedDate}`,
				method: 'GET',
			}).then((res) => {
				if (res.code === 200 && res.data) {
					// 假设返回的数据结构中有jsj_id字段
					const jsjId = res.data.jsjId;
					const jsjName = res.data.jsjName;

					if (callback) {
						callback(jsjId, jsjName);
					}
					console.log('获取金三角信息成功:', res.data);
				} else {
					console.warn('获取金三角信息失败:', res.msg);
					if (callback) {
						callback('');
					}
				}
			}).catch((err) => {
				console.error('获取金三角信息出错:', err);
				if (callback) {
					callback('');
				}
			});
		},
		// 品项健康师相关方法
		addPxJks(pxIndex) {
			if (!this.dataForm.lqKdPxmxList[pxIndex].lqKdJksyjList) {
				this.$set(this.dataForm.lqKdPxmxList[pxIndex], 'lqKdJksyjList', []);
			}
			let item = {
				"jks": "",
				"jksyj": "",
				"jsj_id": "",
				"jksxm": "",
				"jkszh": "",
			}
			this.dataForm.lqKdPxmxList[pxIndex].lqKdJksyjList.push(item);
		},
		removePxJks(pxIndex, jksIndex) {
			this.dataForm.lqKdPxmxList[pxIndex].lqKdJksyjList.splice(jksIndex, 1);
		},
		// 品项科技部老师选择
		handleKjbChange(pxIndex, kjbIndex, row) {
			console.log('品项科技部老师选择:', row);
			if (row.kjbls) {
				// 根据选择的科技部老师ID获取用户信息
				const selectedKjb = this.kjbOptions.find(item => item.id === row.kjbls);
				if (selectedKjb) {
					// 填充姓名和账号
					row.kjblsxm = selectedKjb.fullName;
					row.kjblszh = selectedKjb.userName || selectedKjb.account || selectedKjb.id;
				}
			} else {
				// 清空相关字段
				row.kjblsxm = '';
				row.kjblszh = '';
			}
		},
		// 品项科技部老师相关方法
		addPxKjb(pxIndex) {
			if (!this.dataForm.lqKdPxmxList[pxIndex].lqKdKjbsyjList) {
				this.$set(this.dataForm.lqKdPxmxList[pxIndex], 'lqKdKjbsyjList', []);
			}
			let item = {
				"kjbls": "",
				"kjblsxm": "",
				"kjblszh": "",
				"kjblsyj": "",
			}
			this.dataForm.lqKdPxmxList[pxIndex].lqKdKjbsyjList.push(item);
		},
		removePxKjb(pxIndex, kjbIndex) {
			this.dataForm.lqKdPxmxList[pxIndex].lqKdKjbsyjList.splice(kjbIndex, 1);
		},
		// 更新格式化数字方法，支持品项内的业绩输入
		formatTableNumber(index, field, listName, pxIndex = null) {
			let value;
			if (pxIndex !== null) {
				// 品项内的业绩格式化
				const targetList = this.dataForm.lqKdPxmxList[pxIndex][listName];
				if (targetList && targetList[index] && targetList[index][field] !== undefined) {
					value = targetList[index][field].toString().replace(/,/g, '');
					
					if (!/^\d*\.?\d*$/.test(value)) {
						value = value.replace(/[^\d.]/g, '');
					}
					
					targetList[index][field] = value;
				}
			} else {
				// 原有的表格格式化
				if (this.dataForm[listName] && this.dataForm[listName][index] && this.dataForm[listName][index][field] !== undefined) {
					value = this.dataForm[listName][index][field].toString().replace(/,/g, '');
					
					if (!/^\d*\.?\d*$/.test(value)) {
						value = value.replace(/[^\d.]/g, '');
					}
					
					this.dataForm[listName][index][field] = value;
				}
			}
		},
		// 创建格式化数据对象
		createFormattedData() {
			// 生成新的ID
			const billingId = this.dataForm.id || '';
			

			// 处理品项明细
			const itemDetails = this.processItemDetails();
			
			// 创建格式化对象
			const formattedData = {
				billingId: billingId,
				zdyj: this.parseFloatValue(this.dataForm.zdyj) || 0.00,
				sfyj: this.parseFloatValue(this.dataForm.sfyj) || 0.00,
				deductAmount: 0,
				qk: this.parseFloatValue(this.dataForm.qk) || 0.00,
				itemDetails: itemDetails,
				remark: "金额调整"
			};
			
			return formattedData;
		},
		// 处理品项明细
		processItemDetails() {
			if (!this.dataForm.lqKdPxmxList || this.dataForm.lqKdPxmxList.length === 0) {
				return [];
			}
			
			return this.dataForm.lqKdPxmxList.map((px, index) => {
				console.log('px:', px);
				const pxjg = Number(px.pxjg) || 0;
				const totalPrice = Number(px.actualPrice) || 0;
				const actualPrice = Number(px.actualPrice) || 0;
				
				return {
					itemDetailId: px.id,
					pxjg: pxjg,
					totalPrice: totalPrice,
					actualPrice: actualPrice,
					remark: px.remark || '' // 添加备注字段
				};
			});
		},
		
		// 解析浮点数值
		parseFloatValue(value) {
			return isNaN(value) ? 0 : Number(value);
		}
	}
}
</script>

<style scoped>
.form-section-title {
	display: flex;
	align-items: center;
	margin: 15px 0 10px 0;
	padding: 8px 12px;
	background: #409EFF;
	color: white;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	box-shadow: 0 2px 4px rgba(64, 158, 255, 0.2);
}

.form-section-title i {
	margin-right: 8px;
	font-size: 18px;
}

.table-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
	padding: 12px 16px;
	background: #f5f7fa;
	border-radius: 6px;
	border-left: 4px solid #409EFF;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.table-title {
	font-size: 15px;
	font-weight: 600;
	color: #303133;
}

.table-actions {
	margin-top: 10px;
	text-align: right;
}

.el-table {
	border-radius: 6px;
	overflow: hidden;
}

.el-table th {
	background: #f5f7fa;
	color: #606266;
	font-weight: 600;
}

.el-form-item {
	margin-bottom: 0;
}

.form-layout .el-form-item {
	margin-bottom: 0;
}

/* 表单项高度统一 */
.form-layout .el-form-item__content {
	line-height: 32px;
}

/* 表单项标签样式 */
.form-layout .el-form-item__label {
	line-height: 32px;
	padding-right: 12px;
	font-weight: 500;
}

/* 输入框高度统一 */
.form-layout .el-input__inner,
.form-layout .el-select .el-input__inner {
	height: 32px;
	line-height: 32px;
}

/* 日期选择器高度统一 */
.form-layout .el-date-editor.el-input {
	width: 100%;
}

.form-layout .el-date-editor .el-input__inner {
	height: 32px;
	line-height: 32px;
}

/* 单选框组样式 */
.form-layout .el-radio-group {
	line-height: 32px;
}

.form-layout .el-radio {
	margin-right: 20px;
	line-height: 32px;
}

.el-input-group__append {
	background: #f5f7fa;
	border-color: #dcdfe6;
	color: #606266;
}

.dialog-footer {
	text-align: right;
	padding: 20px 0;
}

.dialog-footer .el-button {
	margin-left: 10px;
}

/* 必填字段标识 */
.el-form-item.is-required .el-form-item__label::before {
	content: '*';
	color: #f56c6c;
	margin-right: 4px;
}

/* 数字输入框样式 */
.el-input-number {
	width: 100%;
}

/* 表格操作按钮样式 */
.el-button--mini {
	padding: 5px 10px;
	font-size: 12px;
}

/* 表单布局优化 */
.form-layout {
	margin: 0;
}

.form-layout .el-col {
	margin-bottom: 18px;
}

/* 表单分组间距 */
.form-layout .el-col:nth-child(4n+1) {
	margin-right: 0;
}

/* 品项明细区域特殊间距 */
.form-layout .el-col:last-child {
	margin-bottom: 0;
}

/* 表单行间距优化 */
.form-layout .el-form-item {
	margin-bottom: 0;
}

/* 确保每行4个字段的整齐排列 */
.form-layout .el-col[class*="el-col-6"] {
	width: 25%;
	padding-left: 10px;
	padding-right: 10px;
}

.form-layout .el-col[class*="el-col-6"]:first-child {
	padding-left: 0;
}

.form-layout .el-col[class*="el-col-6"]:last-child {
	padding-right: 0;
}

/* 品项列表容器 */
.px-list-container {
	width: 100%;
	margin-top: 8px;
	max-height: 300px;
	overflow-y: scroll;
}

/* 品项项 */
.px-item {
	margin-bottom: 24px;
	border: 1px solid #e4e7ed;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	overflow: hidden;
	transition: all 0.3s ease;
}

.px-item:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

/* 品项基本信息 */
.px-basic-info {
	background: #f8f9fa;
	padding: 20px;
	border-bottom: 1px solid #e4e7ed;
}

.px-item-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 18px;
}

.px-item-title {
	font-size: 16px;
	font-weight: 600;
	color: #303133;
}

.px-basic-fields {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: flex-end;
}

.px-field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 140px;
}

.px-field label {
	font-size: 13px;
	color: #606266;
	font-weight: 500;
	white-space: nowrap;
	margin-bottom: 2px;
}

/* 人员业绩区域 */
.px-staff-section {
	padding: 18px 20px;
	border-bottom: 1px solid #e4e7ed;
}

.px-staff-section:last-child {
	border-bottom: none;
}

.px-staff-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
}

.px-staff-title {
	font-size: 14px;
	font-weight: 600;
	color: #409EFF;
}

.px-staff-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.px-staff-row {
	width: 100%;
}

.px-staff-item {
	display: flex;
	align-items: center;
	padding: 12px 16px;
	border: 1px solid #e4e7ed;
	border-radius: 6px;
	background: #fafafa;
	gap: 16px;
	width: 100%;
	transition: all 0.2s ease;
}

.px-staff-item:hover {
	background: #f5f7fa;
	border-color: #c0c4cc;
}

.px-staff-item .el-select,
.px-staff-item .el-input {
	margin-right: 0;
}

.px-staff-item .el-button {
	margin-left: 0;
}

/* 响应式布局 */
@media (max-width: 1200px) {
	.form-layout .el-col[class*="el-col-6"] {
		/* width: 50%; */
		margin-bottom: 16px;
	}
}

@media (max-width: 768px) {
	.form-layout .el-col {
		margin-bottom: 12px;
	}

	.form-layout .el-col[class*="el-col-6"] {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
		margin-bottom: 16px;
	}

	.form-section-title {
		font-size: 14px;
		padding: 8px 12px;
	}

	.table-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		padding: 10px 14px;
	}

	.px-basic-fields {
		flex-direction: column;
		align-items: stretch;
		gap: 16px;
	}

	.px-field {
		width: 100%;
		min-width: auto;
	}

	.px-staff-list {
		flex-direction: column;
		gap: 12px;
	}

	.px-staff-item {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		padding: 14px;
	}

	.px-staff-item .el-select,
	.px-staff-item .el-input {
		width: 100% !important;
	}

	/* 品项项在移动端的间距 */
	.px-item {
		margin-bottom: 20px;
	}

	.px-basic-info {
		padding: 16px;
	}

	.px-staff-section {
		padding: 16px;
	}
}
</style>