<template>
	<!-- 页面元信息，用于控制页面滚动（小程序和App） -->
	<page-meta :page-style="pageScrollDisabled ? 'overflow: hidden;' : ''"></page-meta>
	<view class="refund-container">
		<view class="form-card">
			<view class="form-content">
				<form @submit="handleFormSubmit">
					<!-- 门店选择 -->
					<!-- <view class="form-group">
						<text class="form-label">门店</text>
						<view class="custom-select" @tap="openSelectModal('md')">
							<text class="select-text">{{ formData.mdmc || '请选择门店' }}</text>
							<text class="select-arrow">▼</text>
						</view>
					</view> -->
					
					<!-- 会员选择 -->
					<view class="form-group">
						<text class="form-label">会员</text>
						<view class="custom-select" @tap="openSelectModal('hy')">
							<text class="select-text">{{ formData.hymc || '请选择会员' }}</text>
							<text class="select-arrow">▼</text>
						</view>
					</view>

					<!-- 退卡日期 - 只有新增退卡时且为授权用户才显示 -->
					<view class="form-group" v-if="canEditDate">
						<text class="form-label">退卡日期</text>
						<view class="input-wrapper">
							<picker :disabled="istime" mode="date" :value="formData.tksj" @change="onDateChange">
								<view class="custom-select">
									<text class="select-text">{{ formData.tksj || '请选择退卡日期' }}</text>
									<text class="select-arrow">▼</text>
								</view>
							</picker>
						</view>
					</view>
					
					<!-- 品项明细 -->
					<view class="form-group">
						<text class="form-label">品项明细</text>
						<view class="px-container">
							<view v-for="(px, index) in pxList" :key="index" class="px-row">
								<!-- 品项选择区域 -->
								<view v-if="px.px && px.pxmc" class="px-info">
									<view class="px-info-title">{{ px.pxmc }}</view>
									<view class="px-info-details">
										<view class="px-info-item">
											<text class="px-info-label">单价:</text>
											<text class="px-info-value">¥{{ px.pxjg || 0 }}</text>
										</view>
										<view class="px-info-item">
											<text class="px-info-label">已消费:</text>
											<text class="px-info-value">{{ px.yxf || 0 }}</text>
										</view>
										<view class="px-info-item">
											<text class="px-info-label">总购买:</text>
											<text class="px-info-value">{{ px.zgm || 1 }}</text>
										</view>
										<view class="px-info-item">
											<text class="px-info-label">剩余:</text>
											<text class="px-info-value">{{ (px.zgm || 1) - (px.yxf || 0) }}</text>
										</view>
										<view class="px-info-item">
											<text class="px-info-label">类型:</text>
											<text class="px-info-value">{{ px.ly || '-' }}</text>
										</view>
										<view class="px-info-item">
											<text class="px-info-label">手工费:</text>
											<text class="px-info-value">{{ px.sgf || '0' }}</text>
										</view>
										<view class="px-info-item">
											<text class="px-info-label">总业绩:</text>
											<text class="px-info-value">{{ px.pxjg * px.projectNumber || '0' }}</text>
										</view>
									</view>
								</view>
								<view v-else class="px-select" @tap="selectPx(index)">
									选择品项
								</view>
								
								<!-- 退卡次数输入框 -->
								<input type="number" class="px-number" placeholder="退卡次数" min="1" :max="getRemainingCount(px)" step="1" 
									   v-model="px.projectNumber" @input="updatePxNumber(index, $event)">
								
								<!-- 删除按钮 -->
								<button type="button" class="px-delete" @tap="deletePxRow(index)">删除</button>
								
								<!-- 健康师和科技部老师区域 -->
								<view class="px-row-third">
									<!-- 健康师选择 -->
									<view class="px-staff-section">
										<view class="px-jks-select" @tap="selectPxJks(index)">
											添加健康师
										</view>
										<view class="px-jks-list" v-if="px.lqHytkJksyjList && px.lqHytkJksyjList.length > 0">
											<view v-for="(jks, jksIndex) in px.lqHytkJksyjList" :key="jksIndex" class="px-staff-item">
												<view class="px-staff-header">
													<text class="px-staff-name">{{ jks.jksxm }}</text>
													<button class="px-staff-remove" @tap="removePxJks(index, jksIndex)">删除</button>
												</view>
												<view class="px-staff-fields">
													<view class="px-staff-row">
														<view class="px-staff-field">
															<text class="px-staff-field-label">业绩</text>
															<input type="text" v-model="jks.jksyj" placeholder="请输入业绩" 
																   @change="updateJksField(index, jksIndex, 'jksyj', $event)" @blur="blurJksYj(index, jksIndex)">
														</view>
														<view class="px-staff-field">
															<text class="px-staff-field-label">次数</text>
															<input type="number" v-model="jks.kdpxNumber" placeholder="次数" 
																   min="0" step="1" @change="updateJksField(index, jksIndex, 'kdpxNumber', $event)">
														</view>
													</view>
												</view>
											</view>
										</view>
									</view>
									
									<!-- 科技部老师选择 -->
									<view class="px-staff-section">
										<view class="px-kjb-select" @tap="selectPxKjb(index)" 
											  :style="{display: px.qt2 === '科美' ? 'block' : 'none'}">
											添加科技部老师
										</view>
										<view class="px-kjb-list" v-if="px.lqHytkKjbsyjList && px.lqHytkKjbsyjList.length > 0">
											<view v-for="(kjb, kjbIndex) in px.lqHytkKjbsyjList" :key="kjbIndex" class="px-staff-item">
												<view class="px-staff-header">
													<text class="px-staff-name">{{ kjb.kjblsxm }}</text>
													<button class="px-staff-remove" @tap="removePxKjb(index, kjbIndex)">删除</button>
												</view>
												<view class="px-staff-fields">
													<view class="px-staff-row">
														<view class="px-staff-field">
															<text class="px-staff-field-label">业绩</text>
															<input type="text" v-model="kjb.kjblsyj" placeholder="请输入业绩" 
																   @change="updateKjbField(index, kjbIndex, 'kjblsyj', $event)">
														</view>
														<view class="px-staff-field">
															<text class="px-staff-field-label">次数</text>
															<input  type="number" v-model="kjb.hdpxNumber" placeholder="次数" 
																   min="0" step="1" @change="updateKjbField(index, kjbIndex, 'hdpxNumber', $event)">
														</view>
													</view>
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
						<button type="button" class="btn-add-px" @tap="addPxRow">添加品项</button>
					</view>
					
					<!-- 退款金额 -->
					<view class="form-group">
						<text class="form-label">退款金额</text>
						<view class="input-wrapper">
							<input type="number" v-model="formData.tkje" placeholder="自动计算" min="0" step="0.01" disabled>
						</view>
					</view>
					<!-- 实际退款金额 -->
					<view class="form-group">
						<text class="form-label">实际退款金额</text>
						<view class="input-wrapper">
							<input type="digit" v-model="formData.actualRefundAmount" placeholder="自动计算" min="0" step="0.01" disabled>
						</view>
					</view>
					<!-- 手工费用 -->
			<!-- 		<view class="form-group">
						<text class="form-label">手工费用</text>
						<view class="input-wrapper">
							<input type="number" v-model="formData.sgfy" placeholder="自动计算" min="0" step="0.01" disabled>
						</view>
					</view> -->
					
					<!-- 上传文件 -->
					<view class="form-group">
						<text class="form-label">上传文件</text>
						<view class="input-wrapper">
							<view class="file-upload-area" @tap.stop="chooseFile">
								<view class="file-upload-text">
									<text class="file-upload-icon">📁</text>
									<text>点击选择文件</text>
								</view>
								<view class="file-list">
									<view v-for="(file, index) in fileUrl" :key="file.id || index" class="file-item">
										<view class="file-info">
											<text class="file-icon">{{ getFileIcon(file.type) }}</text>
											<text class="file-name">{{ file.name }}</text>
											<text class="file-size">{{ formatFileSize(file.size) }}</text>
										</view>
										<view class="file-actions">
											<text v-if="file.status === 'uploading'" class="file-status uploading">上传中...</text>
											<text v-else-if="file.status === 'success'" class="file-status success">✓ 已上传</text>
											<text v-else-if="file.status === 'error'" class="file-status error">✗ 上传失败</text>
											<button v-if="file.status === 'success'" type="error" size="mini" @click.stop="removeFile(index)">
												删除
											</button>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
					
					<!-- 会员签字 -->
					<view class="form-group">
						<text class="form-label">会员签字</text>
						<view class="input-wrapper">
							<view v-if="!memberSignature" class="signature-placeholder">
								<button @click="openSignatureModal" class="btn-signature-placeholder">
									<text class="signature-placeholder-text">点击进行签字</text>
								</button>
							</view>
							<view v-if="memberSignature" class="signature-preview">
								<text class="preview-label">签字预览：</text>
								<image @tap="previewSignature(memberSignature)" :src="memberSignature"
									class="signature-image" mode="aspectFit" />
								<view class="signature-actions">
									<button @click="openSignatureModal" class="btn-re-signature">重新签字</button>
									<button @click="clearMemberSignature" class="btn-clear-signature">清除签字</button>
								</view>
							</view>
						</view>
					</view>
					
					<!-- 备注 -->
					<view class="form-group">
						<text class="form-label">备注</text>
						<view class="input-wrapper">
							<textarea v-model="formData.bz" placeholder="请输入备注" class="textarea-input"></textarea>
						</view>
					</view>
					
					<!-- 提交按钮 -->
					<view class="btn-group">
						<button type="submit" class="btn btn-primary" :style="{opacity: issubmitOrder?1:0.5}" @tap="issubmitOrder?submitRefund():null">{{ issubmitOrder?'提交退卡':'提交中...' }}</button>
					</view>
				</form>
			</view>
		</view>
		
		<!-- 选择弹窗 -->
		<SearchSelectModal
			:show="showModal"
			:title="modalTitle"
			:options="currentOptions"
			:loading="modalLoading"
			:has-more="hasMoreData"
			:search-param="searchParam"
			:show-cross-store="currentSelectField === 'hy' || currentSelectField === 'jks'"
			:is-cross-store="currentSelectField === 'jks' ? !filterByStore : isCrossStore"
			@confirm="handleModalConfirm"
			@close="closeModal"
			@load-more="handleLoadMore"
			@refresh="handleRefresh"
			@search="handleSearch"
			@cross-store-change="onCrossStoreChange"
		/>
		
		<!-- 消息提示 -->
		<u-toast ref="uToast"></u-toast>
		
		<!-- 全屏签字弹窗 -->
		<view v-if="showSignatureModal" class="signature-modal-overlay" @tap="closeSignatureModal">
			<view class="signature-modal" @tap.stop>
				<view class="signature-modal-header">
					<text class="signature-modal-title"></text>
					<button @click="closeSignatureModal" class="btn-close-modal">×</button>
				</view>
				<view class="signature-modal-content">
					<SignaturePad :width="800" :height="500" :line-width="4" stroke-color="#2e7d32"
						:px-info="signaturePxInfo" signature-type="refund"
						@confirm="handleSignatureConfirm" @clear="handleSignatureClear" ref="signaturePadModal" />
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import SearchSelectModal from '@/components/SearchSelectModal.vue'
	import SignaturePad from '@/components/SignaturePad.vue'
	import refundApi from '@/apis/modules/refund.js'
	import memberApi from '@/apis/modules/member.js'
	import lxApi from '@/apis/modules/lx.js'
	import appointmentApi from '@/apis/modules/appointment.js'
	
	export default {
		components: {
			SearchSelectModal,
			SignaturePad
		},
		data() {
			return {
				istime:true,
				issubmitOrder: true,
				// 表单数据
				formData: {
					id: '',
					md: '',
					mdbh: '',
					mdmc: '',
					hy: '',
					hyzh: '',
					hymc: '',
					tksj: '', // 退卡日期
					tkje: '',
					sgfy: '',
					bz: '',
					tkr: '',
					fileUrl: [],
					actualRefundAmount:null
				},
				
				// 会员签字
				memberSignature: '',
				showSignatureModal: false,
				scrollTop: 0,
				// 页面滚动禁止状态（用于小程序和App）
				pageScrollDisabled: false,
				
				// 选中的值
				selectedValues: {
					md: null,
					hy: null
				},
				
				// 品项列表
				pxList: [],
				
				// 签字时显示的品项信息
				signaturePxInfo: null,
				
				// 文件列表
				fileUrl: [],
				
				// 弹窗相关
				showModal: false,
				modalTitle: '',
				currentSelectField: '',
				currentOptions: [],
				modalLoading: false,
				hasMoreData: true,
				currentPage: 1,
				pageSize: 20,
				searchKeyword: '',
				searchParam: '',
				
				// 用户信息
				userInfo: null,

				// 跨店相关
				isCrossStore: false,
				// 健康师门店筛选（默认筛选本门店）
				filterByStore: true,

				// 选项数据
				mdOptions: [],
				hyOptions: [],
				jksOptions: [],
				kjbOptions: [],
				
				// 当前选择的行索引
				currentRowIndex: -1,
				currentJksIndex: -1,
				currentKjbIndex: -1
			}
		},
		onLoad() {
			this.initializePage();
		},
		onShow() {
			this.getistime()
		},
		onUnload() {
			// 页面卸载时恢复页面滚动
			this.enablePageScroll();
		},
		computed: {
			// 检查当前用户是否可以修改退卡日期
			canEditDate() {
				return this.userInfo 
			}
		},
		methods: {
			getistime(){
				this.istime = true
				const menuData = uni.getStorageSync('appMenuData') || []
				if (Array.isArray(menuData) && menuData.length > 0) {
					const rootNode = menuData.find(item => item.fullName == 'app时间选择开关按钮')
					// console.error(rootNode)
					if (rootNode) {
						console.error('时间选择开关按钮')
						this.istime = false
					}
				}
			},
			// 处理日期变化
			onDateChange(e) {
				this.formData.tksj = e.detail.value;
			},
			
			// 跨店开关变化
			onCrossStoreChange(value) {
				if (this.currentSelectField === 'jks') {
					// 健康师选择：filterByStore 与 value 相反（value=true 表示跨店，filterByStore=false 表示不筛选门店）
					this.filterByStore = !value;
					// 重新加载健康师数据
					if (this.showModal) {
						this.currentPage = 1;
						this.hasMoreData = true;
						this.loadOptionsData('jks', 1, this.searchKeyword);
					}
				} else {
					this.isCrossStore = value;
					// 如果弹窗已打开且正在选择会员，重新加载数据
					if (this.showModal && this.currentSelectField === 'hy') {
						this.currentPage = 1;
						this.hasMoreData = true;
						this.loadOptionsData('hy', 1, this.searchKeyword);
					}
				}
			},
			
			// 签字相关方法
			async newUploadBase64Image() {
				let info = null;
				await lxApi.UploadBase64Image({
					"base64Data": this.memberSignature,
					"imageType": "png",
					"fileName": "memberSignature.png"
				}).then(res => {
					console.log('UploadBase64Image', res);
					if (res.code == 200) {
						info = res.data;
					}
				})
				return info
			},

			previewSignature(e) {
				console.log('previewSignature', e);
				uni.previewImage({
					urls: [e]
				});
			},

			// 签字确认
			handleSignatureConfirm(signatureData) {
				this.memberSignature = signatureData.dataUrl;
				// 延迟关闭，让用户看到提示信息
				// setTimeout(() => {
				// 	this.showSignatureModal = false;
				// 	// 恢复页面滚动
				// 	this.enablePageScroll();
				// 	uni.showToast({
				// 		title: '签字确认成功',
				// 		icon: 'success'
				// 	});
				// }, 2000);
			},

			handleSignatureClear() {
				this.memberSignature = '';
			},

			clearMemberSignature() {
				this.memberSignature = '';
				if (this.$refs.signaturePad) {
					this.$refs.signaturePad.clearSignature();
				}
				uni.showToast({
					title: '签字已清除',
					icon: 'success'
				});
			},

		// 全屏签字相关方法
		openSignatureModal() {
			// 隐藏键盘，防止点击签字时弹出键盘
			uni.hideKeyboard();
			this.calculateSignaturePxInfo();
			this.showSignatureModal = true;
			// 禁止页面滚动
			this.disablePageScroll();
		},
			
			// 计算签字时显示的品项信息
			calculateSignaturePxInfo() {
				if (!this.pxList || this.pxList.length === 0) {
					this.signaturePxInfo = {
						items: [],
						actualPrice: '0.00'
					};
					return;
				}
				
				// 收集所有品项信息，每条包含品项名、类型和数量
				const items = [];
				
				this.pxList.forEach(px => {
					if (px.pxmc) {
						items.push({
							name: px.pxmc,
							count: parseInt(px.projectNumber) || 0,
							type: px.ly || '无'
						});
					}
				});
				
				// 实际退款金额
				const actualPrice = parseFloat(this.formData.actualRefundAmount) || parseFloat(this.formData.tkje) || 0;
				
				this.signaturePxInfo = {
					items: items,
					actualPrice: actualPrice.toFixed(2)
				};
			},

			closeSignatureModal() {
				this.showSignatureModal = false;
				// 恢复页面滚动
				this.enablePageScroll();
			},

		// 禁止页面滚动
		disablePageScroll() {
			// #ifdef H5
			// 获取当前滚动位置
			this.scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
			// 设置页面不可滚动
			document.body.style.overflow = 'hidden';
			document.body.style.position = 'fixed';
			document.body.style.width = '100%';
			document.body.style.top = `-${this.scrollTop}px`;
			// #endif
			// #ifdef APP-PLUS || MP
			// App 和小程序中，通过 page-meta 组件禁止页面滚动
			this.pageScrollDisabled = true;
			// #endif
		},

		// 恢复页面滚动
		enablePageScroll() {
			// #ifdef H5
			// 恢复页面滚动
			document.body.style.overflow = '';
			document.body.style.position = '';
			document.body.style.width = '';
			document.body.style.top = '';
			// 恢复滚动位置
			if (this.scrollTop !== undefined) {
				window.scrollTo(0, this.scrollTop);
			}
			// #endif
			// #ifdef APP-PLUS || MP
			// App 和小程序中，恢复页面滚动
			this.pageScrollDisabled = false;
			// #endif
		},

			clearSignatureModal() {
				if (this.$refs.signaturePadModal) {
					this.$refs.signaturePadModal.clearSignature();
				}
			},

			confirmSignatureModal() {
				if (this.$refs.signaturePadModal) {
					this.$refs.signaturePadModal.confirmSignature();
				}
			},
			// 初始化页面
			async initializePage() {
				this.formData.tksj = this.utils.gettime().substring(0, 10);
				try {
					// 获取用户信息
					this.userInfo = uni.getStorageSync('userInfo');
					if (!this.userInfo || Object.keys(this.userInfo).length === 0) {
						uni.showToast({
							title: '请先登录',
							icon: 'none'
						});
						setTimeout(() => {
							uni.reLaunch({
								url: '/pages/login/login'
							});
						}, 1500);
						return;
					}
					
					// 初始化数据
					await this.loadInitialOptions();
					
					// 设置默认日期为当前日期
				
					
					// 添加默认的品项行
					this.addPxRow();
				} catch (error) {
					console.error('页面初始化失败:', error);
					uni.showToast({
						title: '页面初始化失败',
						icon: 'none'
					});
				}
			},
			
			// 加载初始选项数据
			async loadInitialOptions() {
				try {
					// 并行加载数据
					const [mdResult, hyResult, jksResult, kjbResult] = await Promise.all([
						this.getMdOptions(1, ''),
						this.getHyOptions(1, ''),
						this.getJksOptions(1, ''),
						this.getKjbOptions(1, '')
					]);
					
					console.log('数据加载完成:', {
						md: this.mdOptions.length,
						hy: this.hyOptions.length,
						jks: this.jksOptions.length,
						kjb: this.kjbOptions.length
					});
					
					// 设置默认门店
					if (this.userInfo.mdid && this.mdOptions.length > 0) {
						const defaultMd = this.mdOptions.find(md => md.id === this.userInfo.mdid);
						if (defaultMd) {
							this.formData.md = defaultMd.id;
							this.formData.mdbh = defaultMd.id;
							this.formData.mdmc = defaultMd.fullName;
							this.selectedValues.md = defaultMd.id;
						}
					}
				} catch (error) {
					console.error('加载初始选项数据失败:', error);
				}
			},
			
			// 打开选择弹窗
			async openSelectModal(fieldId) {
				this.currentSelectField = fieldId;
				this.showModal = true;
				this.modalTitle = '加载中...';
				this.modalLoading = true;
				this.currentPage = 1;
				this.hasMoreData = true;
				this.searchKeyword = '';
				this.currentOptions = [];
				
				try {
					// 设置搜索参数
					switch (fieldId) {
						case 'md':
							this.searchParam = 'fullName';
							this.modalTitle = '选择门店';
							break;
						case 'hy':
							this.searchParam = 'khmc';
							this.modalTitle = '选择会员';
							break;
						case 'px':
							this.searchParam = 'pxmc';
							this.modalTitle = '选择品项';
							break;
						case 'jks':
							this.searchParam = 'jksxm';
							this.modalTitle = '选择健康师';
							break;
						case 'kjb':
							this.searchParam = 'kjblsxm';
							this.modalTitle = '选择科技部人员';
							break;
					}
					
					await this.loadOptionsData(fieldId, 1);
				} catch (error) {
					console.error('获取选项数据失败:', error);
					this.modalTitle = '加载失败';
					this.currentOptions = [];
					uni.showToast({
						title: '数据加载失败，请检查网络连接',
						icon: 'none'
					});
				} finally {
					this.modalLoading = false;
				}
			},
			
			// 关闭弹窗
			closeModal() {
				this.showModal = false;
				this.currentSelectField = '';
				this.currentOptions = [];
				this.modalLoading = false;
				this.hasMoreData = true;
				this.currentPage = 1;
				this.searchKeyword = '';
			},
			
			// 加载选项数据
			async loadOptionsData(fieldId, page = 1, searchKeyword = '') {
				let options = [];
				
				switch(fieldId) {
					case 'md':
						options = await this.getMdOptions(page, searchKeyword);
						break;
					case 'hy':
						options = await this.getHyOptions(page, searchKeyword);
						break;
					case 'px':
						options = await this.getPxOptions(page, searchKeyword);
						this.hasMoreData = false;
						break;
					case 'jks':
						options = await this.getJksOptions(page, searchKeyword);
						break;
					case 'kjb':
						options = await this.getKjbOptions(page, searchKeyword);
						break;
				}
				
				// 为每个选项添加全局唯一的 key
				options = options.map((option, index) => ({
					...option,
					uniqueKey: `${fieldId}_${page}_${index}_${Date.now()}`
				}));
				
				if (page === 1) {
					this.currentOptions = options;
				} else {
					this.currentOptions = [...this.currentOptions, ...options];
				}
				
				// 检查是否还有更多数据
				if (options.length < this.pageSize) {
					this.hasMoreData = false;
				}
			},
			
			// 处理弹窗确认
			handleModalConfirm(selectedOption) {
				if (this.currentSelectField && selectedOption) {
					if (this.currentSelectField === 'md') {
						// 处理门店选择
						this.formData.md = selectedOption.value;
						this.formData.mdbh = selectedOption.value;
						this.formData.mdmc = selectedOption.label;
						this.selectedValues.md = selectedOption.value;
					} else if (this.currentSelectField === 'hy') {
						// 处理会员选择
						this.formData.hy = selectedOption.value;
						this.formData.hyzh = selectedOption.value;
						this.formData.hymc = selectedOption.label;
						this.selectedValues.hy = selectedOption.value;
						this.formData.gklx = selectedOption.khlx;
						
						// 清空已选择的品项列表
						this.pxList = [];
						this.addPxRow();
					} else if (this.currentSelectField === 'px') {
						// 处理品项选择
						this.handlePxSelection(selectedOption);
					} else if (this.currentSelectField === 'jks') {
						// 处理健康师选择
						this.handleJksSelection(selectedOption);
					} else if (this.currentSelectField === 'kjb') {
						// 处理科技部老师选择
						this.handleKjbSelection(selectedOption);
					}
				}
				this.closeModal();
			},
			
			// 获取门店选项
			async getMdOptions(page = 1, searchKeyword = '') {
				try {
					const result = await refundApi.getStoreList();
					if (result.code === 200 && result.data) {
						const options = result.data.map((item, index) => ({
							value: item.id,
							label: item.fullName,
							fullName: item.fullName,
							id: item.id
						}));
						
						if (page === 1 && !searchKeyword) {
							this.mdOptions = options;
						}
						
						return options;
					}
					return [];
				} catch (error) {
					console.error('获取门店列表出错:', error);
					return [];
				}
			},
			
			// 获取会员选项
			async getHyOptions(page = 1, searchKeyword = '') {
				try {
					const params = {
						currentPage: page,
						pageSize: this.pageSize,
					};
					
					if (searchKeyword) {
						params.keyword = searchKeyword;
					}

					// 添加跨店参数
					if (!this.isCrossStore) {
						if(this.userInfo && this.userInfo.mdid) {
							params.gsmd = this.userInfo.mdid;
						} else{
							params.gsmd = '暂无';
						}
					}

					const result = await memberApi.getMemberList(params);
					if (result.code === 200 && result.data) {
						const options = result.data.list.map((item, index) => ({
							value: item.id,
							label: item.khmc,
							sjh: item.sjh,
							khlx: item.khlx,
							subtitle:'客户类型：'+(item.khlxName||'无')+'；手机号：'+(item.sjh||'无')+'；健康师：' +(item.mrsName || '无')+'；门店：'+ (item.gsmdName || '无')+'；',
						}));
						
						if (page === 1 && !searchKeyword) {
							this.hyOptions = options;
						}
						
						return options;
					}
					return [];
				} catch (error) {
					console.error('获取会员列表出错:', error);
					return [];
				}
			},
			
			// 获取品项选项（从会员剩余品项API获取）
			async getPxOptions(page = 1, searchKeyword = '') {
				if (!this.selectedValues.hy) {
					console.warn("请先选择会员");
					return [];
				}

				try {
					const params = {
						memberId: this.selectedValues.hy
					};
					
					if (searchKeyword) {
						params.xmmc = searchKeyword;
					}

					const result = await lxApi.getMemberRemainingItems(params);
					if (result.code === 200 && result.data && result.data.RemainingItems) {
						return result.data.RemainingItems.map(item => ({
							value: item.BillingItemId,
							label: item.ItemName,
							px: item.ItemId,
							pxmc: item.ItemName,
							pxjg: item.ItemPrice || 0,
							qt2: item.qt2 || "",
							RemainingCount: item.RemainingCount || 0,
							ItemPrice: item.ItemPrice || 0,
							sgf: 0,
							sourceType: item.SourceType || "购买",
							TotalPurchased: item.TotalPurchased || 0,
							ConsumedCount: item.ConsumedCount || 0,
							BillingItemId: item.BillingItemId,
							subtitle: '剩余: ' + (item.RemainingCount || 0) + '；类型：' + item.SourceType +
								';单价：' + item.ItemPrice +';备注：' + (item.Remark || '无')+ ';'
						}));
					}
					return [];
				} catch (error) {
					console.error('获取会员剩余品项出错:', error);
					return [];
				}
			},
			
			// 获取健康师选项
			async getJksOptions(page = 1, searchKeyword = '') {
				try {
					const params = {
						currentPage: page,
						pageSize: this.pageSize,
						gw: '健康师'
					};
					// 如果 filterByStore 为 true，则筛选门店
					if (this.filterByStore) {
						params.mdid = this.selectedValues.md || (this.userInfo && this.userInfo.mdid);
					}
					
					if (searchKeyword) {
						params.realName = searchKeyword;
					}

					const result = await appointmentApi.getHealthWorkerList(params);
					if (result.code === 200 && result.data) {
						const options = result.data.list.map((item, index) => ({
							value: item.id,
							label: item.realName || `健康师${index + 1}`,
							fullName: item.realName || `健康师${index + 1}`,
							id: item.id,
							jks: item.id,
							jkszh: item.id,
							jksxm: item.realName || `健康师${index + 1}`,
							userName: item.userName || item.account || item.id,
							account: item.account || item.userName || item.id,
							subtitle: item.department || item.role || ''
						}));
						
						if (page === 1 && !searchKeyword) {
							this.jksOptions = options;
						}
						
						return options;
					}
					return [];
				} catch (error) {
					console.error('获取健康师列表出错:', error);
					return [];
				}
			},
			
			// 获取科技部人员选项
			async getKjbOptions(page = 1, searchKeyword = '') {
				try {
					const params = {
						currentPage: page,
						pageSize: this.pageSize,
						gw: '科技老师'
					};
					
					if (searchKeyword) {
						params.kjblsxm = searchKeyword;
					}

					const result = await appointmentApi.getHealthWorkerList(params);
					if (result.code === 200 && result.data) {
						const options = result.data.list.map((item, index) => ({
							value: item.id,
							label: item.realName || `科技部人员${index + 1}`,
							fullName: item.realName || `科技部人员${index + 1}`,
							id: item.id,
							kjbls: item.id,
							kjblszh: item.id,
							kjblsxm: item.realName || `科技部人员${index + 1}`,
							userName: item.userName || item.account || item.id,
							account: item.account || item.userName || item.id,
							subtitle: item.department || item.role || ''
						}));
						
						if (page === 1 && !searchKeyword) {
							this.kjbOptions = options;
						}
						
						return options;
					}
					return [];
				} catch (error) {
					console.error('获取科技部人员列表出错:', error);
					return [];
				}
			},
			
			// 添加品项行
			addPxRow() {
				this.pxList.push({
					id: undefined,
					glkdbh: undefined,
					px: undefined,
					pxmc: undefined,
					pxjg: undefined,
					xfzs: undefined,
					yxf: 0, // 已消费
					zgm: 1, // 总购买
					ly: '无', // 来源
					projectNumber: 1, // 退卡数量
					qt2: undefined, // 品项类型
					sgf: 0, // 手工费
					lqHytkJksyjList: [], // 健康师业绩列表
					lqHytkKjbsyjList: [], // 科技部老师业绩列表
				});
			},
			
			// 删除品项行
			deletePxRow(rowIndex) {
				if (this.pxList.length > 1) {
					this.pxList.splice(rowIndex, 1);
					this.calculateTotalAmounts();
				} else {
					uni.showToast({
						title: '至少需要保留一个品项',
						icon: 'none'
					});
				}
			},
			
			// 选择品项
			async selectPx(rowIndex) {
				this.currentRowIndex = rowIndex;
				this.openSelectModal('px');
			},
			
			// 处理品项选择
			async handlePxSelection(selectedOption) {
				if (this.currentRowIndex >= 0) {
					try {
						console.error(selectedOption)
						// 先校验已经选择的品项有没有这个
						const existingIndex = this.pxList.findIndex((item, index) => 
							index !== this.currentRowIndex && item.BillingItemId === selectedOption.BillingItemId
						);
						if (existingIndex !== -1) {
							uni.showToast({
								title: '该品项已存在，请勿重复添加',
								icon: 'none',
								duration: 2000
							});
							this.closeModal();
							return;
						}
						// 请求品项详细信息
						const detailResult = await refundApi.getProjectDetail(selectedOption.px);
						let qt2 = "";
						let sgf = 0;
						
						if (detailResult.code === 200 && detailResult.data) {
							qt2 = detailResult.data.qt2 || "";
							sgf = detailResult.data.sgf || 0;
						}
						
						this.pxList[this.currentRowIndex] = {
							...this.pxList[this.currentRowIndex],
							px: selectedOption.px,
							pxmc: selectedOption.pxmc,
							pxjg: selectedOption.ItemPrice || 0,
							qt2: qt2,
							yxf: selectedOption.ConsumedCount || 0, // 已消费
							zgm: selectedOption.TotalPurchased || 1, // 总购买
							ly: selectedOption.sourceType || "无", // 来源
							projectNumber: 1, // 默认退卡数量为1
							sgf: sgf,
							RemainingCount: selectedOption.RemainingCount || 0,
							BillingItemId: selectedOption.BillingItemId
						};
						
						// 品项切换时，清空所有人员列表
						this.pxList[this.currentRowIndex].lqHytkJksyjList = [];
						this.pxList[this.currentRowIndex].lqHytkKjbsyjList = [];
						
						this.calculateTotalAmounts();
						
					} catch (error) {
						console.error('获取品项详情失败:', error);
						uni.showToast({
							title: '获取品项详情失败，请重试',
							icon: 'none'
						});
					}
				}
			},
			
			// 更新品项次数
			updatePxNumber(rowIndex, event) {
				const value = event.detail.value;
				if (this.pxList[rowIndex]) {
					let inputNumber = parseInt(value) || 1;
					
					// 验证不能超过剩余次数
					if (inputNumber > this.pxList[rowIndex].RemainingCount) {
						inputNumber = this.pxList[rowIndex].RemainingCount;
						// 更新输入框显示的值
						this.$nextTick(() => {
							const inputElement = event.target;
							if (inputElement) {
								inputElement.value = inputNumber;
							}
						});
					}
					
					this.pxList[rowIndex].projectNumber = inputNumber;
					this.calculateTotalAmounts();
					
					// 重新分配健康师和科技部老师的次数和手工费
					this.redistributeJksNumbersAndLaborCost(rowIndex);
					this.redistributeKjbNumbersAndLaborCost(rowIndex);
				}
			},
			
			// 计算总退款金额和手工费用
			calculateTotalAmounts() {
				let totalTkje = 0;
				let totalSgfy = 0;
				
				this.pxList.forEach(px => {
					if (px.px && px.pxmc && px.pxjg && px.projectNumber) {
						const pxTotal = px.pxjg * px.projectNumber;
						totalTkje += pxTotal;
					}
					if (px.px && px.pxmc && px.sgf  && px.projectNumber) {
						totalSgfy += px.sgf * px.projectNumber;
					}
				});
				
				this.formData.tkje = totalTkje.toFixed(2);
				this.formData.sgfy = totalSgfy.toFixed(2);
				
				// 计算实际退款金额（健康师业绩之和）
				this.calculateActualRefundAmount();
			},
			
			// 计算实际退款金额（基于健康师业绩之和）
			calculateActualRefundAmount() {
				let totalActualRefund = 0;
				
				this.pxList.forEach(px => {
					if (px.lqHytkJksyjList && px.lqHytkJksyjList.length > 0) {
						px.lqHytkJksyjList.forEach(jks => {
							const jksYj = parseFloat(jks.jksyj) || 0;
							totalActualRefund += jksYj;
						});
					}
				});
				
				this.formData.actualRefundAmount = totalActualRefund.toFixed(2);
			},
			
			// 获取品项剩余数量
			getRemainingCount(px) {
				if (px.RemainingCount !== undefined) {
					return px.RemainingCount;
				}
				return (px.zgm || 1) - (px.yxf || 0);
			},
			
			// 选择品项健康师
			async selectPxJks(rowIndex) {
				this.currentRowIndex = rowIndex;
				this.currentJksIndex = this.pxList[rowIndex].lqHytkJksyjList.length;
				this.openSelectModal('jks');
			},
			
			// 选择品项科技部老师
			async selectPxKjb(rowIndex) {
				this.currentRowIndex = rowIndex;
				this.currentKjbIndex = this.pxList[rowIndex].lqHytkKjbsyjList.length;
				this.openSelectModal('kjb');
			},
			
			// 提交退卡
			async submitRefund() {
				// 验证表单
				if (!this.selectedValues.md) {
					uni.showToast({
						title: '请选择门店',
						icon: 'none'
					});
					return;
				}
				
				if (!this.selectedValues.hy) {
					uni.showToast({
						title: '请选择会员',
						icon: 'none'
					});
					return;
				}
				
				if (this.pxList.length === 0) {
					uni.showToast({
						title: '请至少添加一个品项',
						icon: 'none'
					});
					return;
				}
				// 验证品项数据
				if (!this.validatePxList()) {
					return;
				}
				
				try {
					// 检查是否有科美品项
					const hasKemei = this.pxList.some(px => px.qt2 === '科美');
					
					// 处理品项列表，转换为指定格式
					const processedPxList = this.pxList.map(px => {
						// 计算退卡金额和总价
						const tkje = parseFloat(px.pxjg) * parseInt(px.projectNumber) || 0;
						const f_TotalPrice = tkje;
						
						// 处理健康师列表
						const lqHytkJksyjList = (px.lqHytkJksyjList || []).map(jks => ({
							jks: jks.jks || '',
							jksxm: jks.jksxm || '',
							jkszh: jks.jkszh || '',
							jksyj: parseFloat(jks.jksyj) || 0,
							f_jsjid: jks.jsjId || '',
							f_tkpxid: px.px || '',
							f_LaborCost: parseFloat(jks.laborCost) || 0,
							f_tkpxNumber: parseFloat(jks.kdpxNumber) || 0
						}));
						
						// 处理科技部老师列表
						const lqHytkKjbsyjList = (px.lqHytkKjbsyjList || []).map(kjb => ({
							kjbls: kjb.kjbls || '',
							kjblsxm: kjb.kjblsxm || '',
							kjblszh: kjb.kjblszh || '',
							kjblsyj: parseFloat(kjb.kjblsyj) || 0,
							f_tkpxid: px.px || '',
							f_LaborCost: parseFloat(kjb.laborCost) || 0,
							f_tkpxNumber: parseFloat(kjb.hdpxNumber) || 0
						}));
						console.error(px)
						return {
							px: px.px || '',
							pxmc: px.pxmc || '',
							pxjg: parseFloat(px.pxjg) || 0,
							tkje: tkje,
							f_ProjectNumber: parseInt(px.projectNumber) || 0,
							f_SourceType: px.ly || '',
							billingItemId: px.BillingItemId,
							f_TotalPrice: f_TotalPrice,
							lqHytkJksyjList: lqHytkJksyjList,
							lqHytkKjbsyjList: lqHytkKjbsyjList
						};
					});
					
					// 处理会员签字
					let hyqz = []
					if (this.memberSignature) {
						let memberinfo = await this.newUploadBase64Image()
						console.error(memberinfo)
						if (memberinfo) {
							hyqz.push({
								name: memberinfo.name,
								fileId: memberinfo.name,
								url: memberinfo.url
							});
						}
					}

					// 收集表单数据
					// 处理退卡日期：如果用户设置了日期则使用设置的日期，否则使用当前时间
					let tksjValue = this.utils.gettime();
					if (this.formData.tksj) {
						// 如果设置了日期，则添加时分秒
						console.error('【【【【【[[[]]]')
						tksjValue = this.formData.tksj + ' ' + new Date().toTimeString().substring(0, 8);
					}
					
					const formData = {
						id: this.formData.id,
						md: this.selectedValues.md,
						mdbh: this.formData.mdbh,
						mdmc: this.formData.mdmc,
						hy: this.selectedValues.hy,
						hyzh: this.formData.hyzh,
						gklx: this.formData.gklx,
						hymc: this.formData.hymc,
						tksj: tksjValue,
						tkje: this.formData.tkje,
						sgfy: this.formData.sgfy,
						bz: this.formData.bz,
						tkr: this.userInfo.realName || this.userInfo.name || '',
						fileUrl: JSON.stringify(this.fileUrl),
						signatureFile: JSON.stringify(hyqz),
						sfykjb: hasKemei ? "是" : "否", // 是否有科技部
						lqHytkMxList: processedPxList.filter(px => px.px && px.pxmc),
						actualRefundAmount:this.formData.actualRefundAmount || 0
					};
					
					console.log("退卡数据:", formData);
					// return
					uni.showLoading({
						title: '正在提交...'
					});
					this.issubmitOrder = false;
					// 调用实际的API
					const result = await refundApi.submitRefund(formData);
					
					uni.hideLoading();
					
					if (result.code === 200) {
						uni.showToast({
							title: '退卡成功！',
							icon: 'success'
						});
						this.clearForm();
					} else {
						uni.showToast({
							title: result.msg || '提交失败，请重试',
							icon: 'none'
						});
					}
					this.issubmitOrder = true;
				} catch (error) {
					uni.hideLoading();
					console.error('提交失败:', error);
					uni.showToast({
						title: '网络错误，请稍后重试',
						icon: 'none'
					});
					this.issubmitOrder = true;
				}
			},
			validatePxList(){
				const pxList = this.pxList;
				
				// 1. 验证是否有品项
				if (!pxList || pxList.length === 0) {
					uni.showToast({
						title: '请至少添加一个品项',
						icon: 'none'
					});
					return false;
				}
				
				// 2. 验证每个品项的信息
				for (let i = 0; i < pxList.length; i++) {
					const px = pxList[i];
					
					// 验证品项基本信息
					if (!px.px || !px.pxmc) {
						uni.showToast({
							title: `第${i + 1}个品项信息不完整，请重新选择`,
							icon: 'none'
						});
						return false;
					}
					// if (!px.pxjg || parseFloat(px.pxjg) <= 0) {
					// 	uni.showToast({
					// 		title: `第${i + 1}个品项的价格必须大于0`,
					// 		icon: 'none'
					// 	});
					// 	return false;
					// }
					
					// 验证退卡次数不能超过剩余次数
					if (px.RemainingCount && px.projectNumber > px.RemainingCount) {
						uni.showToast({
							title: `第${i + 1}个品项的退卡次数(${px.projectNumber})不能超过剩余次数(${px.RemainingCount})`,
							icon: 'none'
						});
						return false;
					}
					
					// 验证健康师
					if (!px.lqHytkJksyjList || px.lqHytkJksyjList.length === 0) {
						uni.showToast({
							title: `第${i + 1}个品项必须至少选择一个健康师`,
							icon: 'none'
						});
						return false;
					}
					
					// 计算健康师业绩总和
					let jksTotalYj = 0;
					let jksTotalLaborCost = 0;
					let jksTotalNumber = 0;
					
					for (let j = 0; j < px.lqHytkJksyjList.length; j++) {
						const jks = px.lqHytkJksyjList[j];
						
						// 验证健康师是否选择
						if (!jks.jks || !jks.jksxm) {
							uni.showToast({
								title: `第${i + 1}个品项的第${j + 1}个健康师必须选择`,
								icon: 'none'
							});
							return false;
						}
						
						// 验证健康师业绩必须填写
						if (!jks.jksyj || jks.jksyj.trim() === "") {
							uni.showToast({
								title: `第${i + 1}个品项的第${j + 1}个健康师业绩必须填写`,
								icon: 'none'
							});
							return false;
						}
						
						// 验证业绩为数字
						const yj = parseFloat(jks.jksyj);
						if (isNaN(yj) || yj < 0) {
							uni.showToast({
								title: `第${i + 1}个品项的第${j + 1}个健康师业绩必须为有效数字`,
								icon: 'none'
							});
							return false;
						}
						
						jksTotalYj += yj;
						jksTotalLaborCost += parseFloat(jks.laborCost) || 0;
						jksTotalNumber += parseFloat(jks.kdpxNumber) || 0;
					}
					
					// 验证健康师业绩总和等于品项金额
					// const pxTotalAmount = px.pxjg * px.projectNumber;
					// if (Math.abs(jksTotalYj - pxTotalAmount) > 0.01) {
					// 	uni.showToast({
					// 		title: `第${i + 1}个品项的健康师业绩总和(${jksTotalYj.toFixed(2)})必须等于品项金额(${pxTotalAmount.toFixed(2)})`,
					// 		icon: 'none'
					// 	});
					// 	return false;
					// }
					
					// 验证健康师手工费总和等于品项手工费
					const pxTotalLaborCost = (px.sgf || 0) * px.projectNumber;
					if (Math.abs(jksTotalLaborCost - pxTotalLaborCost) > 0.01) {
						uni.showToast({
							title: `第${i + 1}个品项的健康师手工费总和(${jksTotalLaborCost.toFixed(2)})必须等于品项手工费(${pxTotalLaborCost.toFixed(2)})`,
							icon: 'none'
						});
						return false;
					}
					
					// 验证健康师次数总和等于品项次数
					// if (jksTotalNumber !== px.projectNumber) {
					// 	uni.showToast({
					// 		title: `第${i + 1}个品项的健康师次数总和(${jksTotalNumber})必须等于品项次数(${px.projectNumber})`,
					// 		icon: 'none'
					// 	});
					// 	return false;
					// }
					
					// 如果是科美品项，验证科技部老师
					if (px.qt2 === '科美') {
						if (!px.lqHytkKjbsyjList || px.lqHytkKjbsyjList.length === 0) {
							uni.showToast({
								title: `第${i + 1}个品项是科美品项，必须至少选择一个科技部老师`,
								icon: 'none'
							});
							return false;
						}
						
						// 计算科技部老师业绩总和
						let kjbTotalYj = 0;
						let kjbTotalLaborCost = 0;
						let kjbTotalNumber = 0;
						
						for (let k = 0; k < px.lqHytkKjbsyjList.length; k++) {
							const kjb = px.lqHytkKjbsyjList[k];
							
							// 验证科技部老师是否选择
							if (!kjb.kjbls || !kjb.kjblsxm) {
								uni.showToast({
									title: `第${i + 1}个品项的第${k + 1}个科技部老师必须选择`,
									icon: 'none'
								});
								return false;
							}
							
							// 验证科技部老师业绩必须填写
							if (!kjb.kjblsyj || kjb.kjblsyj.trim() === "") {
								uni.showToast({
									title: `第${i + 1}个品项的第${k + 1}个科技部老师业绩必须填写`,
									icon: 'none'
								});
								return false;
							}
							
							// 验证业绩为数字
							const yj = parseFloat(kjb.kjblsyj);
							if (isNaN(yj) || yj < 0) {
								uni.showToast({
									title: `第${i + 1}个品项的第${k + 1}个科技部老师业绩必须为有效数字`,
									icon: 'none'
								});
								return false;
							}
							
							kjbTotalYj += yj;
							kjbTotalLaborCost += parseFloat(kjb.laborCost) || 0;
							kjbTotalNumber += parseInt(kjb.hdpxNumber) || 0;
						}
						
						// 验证科技部老师业绩总和等于品项金额
						// if (Math.abs(kjbTotalYj - pxTotalAmount) > 0.01) {
						// 	uni.showToast({
						// 		title: `第${i + 1}个品项的科技部老师业绩总和(${kjbTotalYj.toFixed(2)})必须等于品项金额(${pxTotalAmount.toFixed(2)})`,
						// 		icon: 'none'
						// 	});
						// 	return false;
						// }
						
						// 验证科技部老师手工费总和等于品项手工费
						if (Math.abs(kjbTotalLaborCost - pxTotalLaborCost) > 0.01) {
							uni.showToast({
								title: `第${i + 1}个品项的科技部老师手工费总和(${kjbTotalLaborCost.toFixed(2)})必须等于品项手工费(${pxTotalLaborCost.toFixed(2)})`,
								icon: 'none'
							});
							return false;
						}
						
						// 验证科技部老师次数总和等于品项次数
						// if (kjbTotalNumber !== px.projectNumber) {
						// 	uni.showToast({
						// 		title: `第${i + 1}个品项的科技部老师次数总和(${kjbTotalNumber})必须等于品项次数(${px.projectNumber})`,
						// 		icon: 'none'
						// 	});
						// 	return false;
						// }
					}
				}
				
				return true;
			},
			// 清空表单
			clearForm() {
				this.formData = {
					id: '',
					md: '',
					mdbh: '',
					mdmc: '',
					hy: '',
					hyzh: '',
					hymc: '',
					tksj: this.utils.gettime().substring(0, 10),
					tkje: '',
					sgfy: '',
					bz: '',
					tkr: '',
					fileUrl: [],
					actualRefundAmount:null
				};
				
				this.selectedValues = {
					md: null,
					hy: null
				};
				
				this.pxList = [];
				this.fileUrl = [];
				this.memberSignature = '';
				if (this.$refs.signaturePad) {
					this.$refs.signaturePad.clearSignature();
				}
				this.addPxRow();
				
				// 重新计算实际退款金额
				this.calculateActualRefundAmount();
			},
			
			// 处理健康师选择
			async handleJksSelection(selectedOption) {
				if (this.currentRowIndex >= 0) {
					if (!this.pxList[this.currentRowIndex].lqHytkJksyjList) {
						this.pxList[this.currentRowIndex].lqHytkJksyjList = [];
					}
					
					const px = this.pxList[this.currentRowIndex];
					const jksItem = {
						jks: selectedOption.jks,
						jksxm: selectedOption.jksxm,
						jkszh: selectedOption.jkszh,
						jksyj: "",
						jsjId: "",
						kdpxid: px.BillingItemId || px.px,
						laborCost: 0,
						kdpxNumber: 1
					};
					
					this.pxList[this.currentRowIndex].lqHytkJksyjList.push(jksItem);
					
					// 重新分配健康师的次数和手工费
					this.redistributeJksNumbersAndLaborCost(this.currentRowIndex);
					
					// 重新计算实际退款金额
					this.calculateActualRefundAmount();
					
					// 异步获取金三角信息
					this.getJsjInfoByUserId(selectedOption.value, (jsjId, jsjName) => {
						jksItem.jsjId = jsjId;
					});
				}
			},
			
			// 处理科技部老师选择
			handleKjbSelection(selectedOption) {
				if (this.currentRowIndex >= 0) {
					if (!this.pxList[this.currentRowIndex].lqHytkKjbsyjList) {
						this.pxList[this.currentRowIndex].lqHytkKjbsyjList = [];
					}
					
					const px = this.pxList[this.currentRowIndex];
					const kjbItem = {
						kjbls: selectedOption.kjbls,
						kjblsxm: selectedOption.kjblsxm,
						kjblszh: selectedOption.kjblszh,
						kjblsyj: "",
						hkpxid: px.BillingItemId || px.px,
						laborCost: 0,
						hdpxNumber: 1
					};
					
					this.pxList[this.currentRowIndex].lqHytkKjbsyjList.push(kjbItem);
					
					// 重新分配科技部老师的次数和手工费
					this.redistributeKjbNumbersAndLaborCost(this.currentRowIndex);
				}
			},
			
			// 删除品项健康师
			removePxJks(rowIndex, jksIndex) {
				console.log('删除健康师:', rowIndex, jksIndex);
				if (this.pxList[rowIndex].lqHytkJksyjList) {
					this.pxList[rowIndex].lqHytkJksyjList.splice(jksIndex, 1);
					this.redistributeJksNumbersAndLaborCost(rowIndex);
					// 重新计算实际退款金额
					this.calculateActualRefundAmount();
					// 强制更新视图
					this.$forceUpdate();
				}
			},
			
			// 删除品项科技部老师
			removePxKjb(rowIndex, kjbIndex) {
				console.log('删除科技部老师:', rowIndex, kjbIndex);
				if (this.pxList[rowIndex].lqHytkKjbsyjList) {
					this.pxList[rowIndex].lqHytkKjbsyjList.splice(kjbIndex, 1);
					this.redistributeKjbNumbersAndLaborCost(rowIndex);
					// 强制更新视图
					this.$forceUpdate();
				}
			},
			
			// 更新健康师字段
			updateJksField(rowIndex, jksIndex, field, event) {
				const value = event.detail.value;
				if (this.pxList[rowIndex].lqHytkJksyjList && this.pxList[rowIndex].lqHytkJksyjList[jksIndex]) {
					if (field === 'laborCost' || field === 'kdpxNumber') {
						this.pxList[rowIndex].lqHytkJksyjList[jksIndex][field] = parseFloat(value) || 0;
					} else {
						this.pxList[rowIndex].lqHytkJksyjList[jksIndex][field] = value;
					}
					
					// 当健康师业绩更新时，重新计算实际退款金额
					if (field === 'jksyj') {
						this.calculateActualRefundAmount();
					}
				}
			},
			blurJksYj(rowIndex, jksIndex) {
				const value = this.pxList[rowIndex].lqHytkJksyjList[jksIndex].jksyj;
				if (value) {
					this.calculateActualRefundAmount();
				}
			},
			// 更新科技部老师字段
			updateKjbField(rowIndex, kjbIndex, field, event) {
				const value = event.detail.value;
				if (this.pxList[rowIndex].lqHytkKjbsyjList && this.pxList[rowIndex].lqHytkKjbsyjList[kjbIndex]) {
					if (field === 'laborCost' || field === 'hdpxNumber') {
						this.pxList[rowIndex].lqHytkKjbsyjList[kjbIndex][field] = parseFloat(value) || 0;
					} else {
						this.pxList[rowIndex].lqHytkKjbsyjList[kjbIndex][field] = value;
					}
				}
			},
			
			// 重新分配健康师的次数和手工费
			redistributeJksNumbersAndLaborCost(pxIndex) {
				const px = this.pxList[pxIndex];
				if (!px.lqHytkJksyjList || px.lqHytkJksyjList.length === 0) {
					return;
				}

				// 计算品项总次数和总手工费
				const totalNumber = px.projectNumber || 0;
				const totalLaborCost = (px.sgf || 0) * totalNumber;
				
				// 健康师数量
				const jksCount = px.lqHytkJksyjList.length;
				
				if (jksCount > 0) {
					// 次数和手工费都小数均分，保留两位小数
					const avgNumber = totalNumber / jksCount;
					const avgLaborCost = totalLaborCost / jksCount;
					
					px.lqHytkJksyjList.forEach((jks, index) => {
						this.$set(jks, 'kdpxNumber', parseFloat(avgNumber.toFixed(2)));
						this.$set(jks, 'laborCost', avgLaborCost.toFixed(2));
					});
				}
				
				// 强制更新视图
				this.$forceUpdate();
			},
			
			// 重新分配科技部老师的次数和手工费
			redistributeKjbNumbersAndLaborCost(pxIndex) {
				const px = this.pxList[pxIndex];
				if (!px.lqHytkKjbsyjList || px.lqHytkKjbsyjList.length === 0) {
					return;
				}

				// 计算品项总次数和总手工费
				const totalNumber = px.projectNumber || 0;
				const totalLaborCost = (px.sgf || 0) * totalNumber;
				
				// 科技部老师数量
				const kjbCount = px.lqHytkKjbsyjList.length;
				
				if (kjbCount > 0) {
					// 次数和手工费都小数均分，保留两位小数
					const avgNumber = totalNumber / kjbCount;
					const avgLaborCost = totalLaborCost / kjbCount;
					
					px.lqHytkKjbsyjList.forEach((kjb, index) => {
						this.$set(kjb, 'hdpxNumber', parseFloat(avgNumber.toFixed(2)));
						this.$set(kjb, 'laborCost', avgLaborCost.toFixed(2));
					});
				}
				
				// 强制更新视图
				this.$forceUpdate();
			},
			
			// 根据用户ID获取金三角信息
			getJsjInfoByUserId(userId, callback) {
				let formattedDate = this.formData.tksj
				refundApi.getJsjInfo(userId, formattedDate).then((res) => {
					if (res.code === 200 && res.data) {
						const jsjId = res.data.jsjId;
						const jsjName = res.data.jsjName;
						if (callback) {
							callback(jsjId, jsjName);
						}
					} else {
						if (callback) {
							callback('');
						}
					}
				}).catch((err) => {
					console.error('获取金三角信息出错:', err);
					if (callback) {
						callback('');
					}
				});
			},
			
			
			// 处理表单提交
			handleFormSubmit(event) {
				event.preventDefault();
				this.submitRefund();
			},
			
			// 处理加载更多
			async handleLoadMore(page) {
				if (this.currentSelectField && this.hasMoreData && !this.modalLoading) {
					this.modalLoading = true;
					try {
						await this.loadOptionsData(this.currentSelectField, page, this.searchKeyword);
					} catch (error) {
						console.error('加载更多数据失败:', error);
						uni.showToast({
							title: '加载失败',
							icon: 'none'
						});
					} finally {
						this.modalLoading = false;
					}
				}
			},
			
			// 处理刷新
			async handleRefresh() {
				if (this.currentSelectField) {
					this.currentPage = 1;
					this.hasMoreData = true;
					this.searchKeyword = '';
					await this.loadOptionsData(this.currentSelectField, 1);
				}
			},
			
			// 处理搜索
			async handleSearch(searchKeyword) {
				if (this.currentSelectField) {
					this.searchKeyword = searchKeyword;
					this.currentPage = 1;
					this.hasMoreData = true;
					this.modalLoading = true;
					
					try {
						await this.loadOptionsData(this.currentSelectField, 1, searchKeyword);
					} catch (error) {
						console.error('搜索失败:', error);
						uni.showToast({
							title: '搜索失败',
							icon: 'none'
						});
					} finally {
						this.modalLoading = false;
					}
				}
			},
			
			// 文件上传相关
			chooseFile() {
				uni.chooseImage({
					count: 9,
					type: 'file',
					success: (res) => {
						this.handleFileSelect(res.tempFiles);
					}
				});
			},

			// 处理文件选择
			async handleFileSelect(files) {
				for (let i = 0; i < files.length; i++) {
					const file = files[i];
					
					// 验证文件类型
					// if (!this.validateFileType(file)) {
					// 	uni.showToast({
					// 		title: `文件 ${file.name} 类型不支持`,
					// 		icon: 'none'
					// 	});
					// 	continue;
					// }
					
					// 验证文件大小 (限制为10MB)
					if (file.size > 10 * 1024 * 1024) {
						uni.showToast({
							title: `文件 ${file.name} 大小超过10MB限制`,
							icon: 'none'
						});
						continue;
					}
					
					// 上传文件
					await this.uploadSingleFile(file);
				}
			},

			// 验证文件类型
			validateFileType(file) {
				const allowedTypes = [
					'image/jpeg', 'image/jpg', 'image/png', 'image/gif', 'image/webp',
					'application/pdf',
					'application/msword',
					'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
				];
				return allowedTypes.includes(file.type);
			},

			// 上传单个文件
			async uploadSingleFile(file) {
				const fileId = `file_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
				
				// 添加到文件列表显示
				this.addFileToList(file, fileId, 'uploading');
				
				try {
					const result = await lxApi.uploadFile(file);
					
					if (result.code === 200 && result.data) {
						// 更新文件状态为成功
						this.updateFileStatus(fileId, 'success', result.data);
						
						uni.showToast({
							title: '文件上传成功',
							icon: 'success'
						});
					} else {
						throw new Error(result.msg || '上传失败');
					}
				} catch (error) {
					console.error('文件上传失败:', error);
					this.updateFileStatus(fileId, 'error');
					uni.showToast({
						title: `文件 ${file.name} 上传失败`,
						icon: 'none'
					});
				}
			},

			// 添加文件到列表显示
			addFileToList(file, fileId, status) {
				const fileItem = {
					id: fileId,
					name: file.name,
					size: file.size,
					type: file.type,
					status: status,
					url: '',
					fileId: ''
				};
				
				this.fileUrl.push(fileItem);
			},

			// 更新文件状态
			updateFileStatus(fileId, status, uploadData = null) {
				const fileIndex = this.fileUrl.findIndex(file => file.id === fileId);
				
				if (fileIndex !== -1) {
					this.fileUrl[fileIndex].status = status;
					if (uploadData) {
						this.fileUrl[fileIndex].url = uploadData.url;
						this.fileUrl[fileIndex].fileId = uploadData.name;
					}
				}
			},

			// 获取文件图标
			getFileIcon(fileType) {
				return '🖼️';
				// if (fileType.startsWith('image/')) {
				// 	return '🖼️';
				// } else if (fileType === 'application/pdf') {
				// 	return '📄';
				// } else if (fileType.includes('word')) {
				// 	return '📝';
				// } else {
				// 	return '📁';
				// }
			},

			removeFile(index) {
				this.fileUrl.splice(index, 1);
			},

			formatFileSize(size) {
				if (size < 1024) return size + 'B';
				if (size < 1024 * 1024) return (size / 1024).toFixed(1) + 'KB';
				return (size / (1024 * 1024)).toFixed(1) + 'MB';
			}
		}
	}
</script>

<style lang="scss" scoped>
	.refund-container {
		min-height: 100vh;
		background: linear-gradient(135deg, #e8f5e9 0%, #b2dfdb 100%);
		padding: 20rpx;
	}

	.form-card {
		background: #fff;
		border-radius: 36rpx;
		box-shadow: 0 8rpx 48rpx 0 rgba(76, 175, 80, 0.10);
		border: 3rpx solid #c8e6c9;
		overflow: hidden;
	}

	.form-content {
		padding: 48rpx;
	}

	.form-group {
		margin-bottom: 40rpx;
	}

	.form-group:last-child {
		margin-bottom: 0;
	}

	.form-label {
		display: block;
		margin-bottom: 16rpx;
		font-weight: bold;
		color: #388e3c;
		letter-spacing: 2rpx;
		font-size: 28rpx;
	}

	.custom-select {
		position: relative;
		background: #f9fff9;
		border: 3rpx solid #c8e6c9;
		border-radius: 20rpx;
		padding: 28rpx 24rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		cursor: pointer;
		z-index: 10;
		min-height: 80rpx;
		height: 80rpx;
		box-sizing: border-box;
	}

	.select-text {
		font-size: 28rpx;
		color: #2e7d32;
		flex: 1;
	}

	.select-arrow {
		position: absolute;
		right: 24rpx;
		top: 50%;
		transform: translateY(-50%);
		color: #6a9c6a;
		font-size: 24rpx;
		pointer-events: none;
	}

	.input-wrapper {
		position: relative;
	}

	input, textarea {
		width: 100%;
		padding: 0 24rpx;
		border: 3rpx solid #c8e6c9;
		border-radius: 20rpx;
		font-size: 28rpx;
		background: #f9fff9;
		color: #2e7d32;
		box-sizing: border-box;
		min-height: 80rpx;
		height: 80rpx;
	}

	.textarea-input {
		min-height: 120rpx;
		height: 120rpx;
		padding: 20rpx 24rpx;
		resize: none;
	}

	input:focus, textarea:focus {
		outline: none;
		border-color: #43a047;
		box-shadow: 0 0 0 6rpx rgba(76, 175, 80, 0.1);
		background: #fff;
	}

	input:disabled {
		background: #f5f5f5;
		color: #666;
		cursor: not-allowed;
	}

	/* 品项相关样式 */
	.px-container {
		margin-bottom: 32rpx;
	}

	.px-row {
		display: flex;
		gap: 24rpx;
		margin-bottom: 24rpx;
		align-items: center;
		flex-wrap: wrap;
		padding: 32rpx;
		border: 2rpx solid #e0e0e0;
		border-radius: 20rpx;
		background: #fafafa;
	}

	.px-select {
		flex: 2;
		padding: 24rpx;
		border: 3rpx solid #c8e6c9;
		border-radius: 20rpx;
		font-size: 28rpx;
		background: #f9fff9;
		color: #2e7d32;
		cursor: pointer;
		position: relative;
		min-width: 400rpx;
		text-align: center;
	}

	.px-select:focus {
		outline: none;
		border-color: #43a047;
		box-shadow: 0 0 0 6rpx rgba(76, 175, 80, 0.1);
		background: #fff;
	}

	.px-info {
		flex: 2;
		padding: 24rpx;
		border: 3rpx solid #e0e0e0;
		border-radius: 20rpx;
		font-size: 24rpx;
		background: #f8f9fa;
		color: #495057;
		min-width: 400rpx;
	}

	.px-info-title {
		font-weight: bold;
		color: #2e7d32;
		margin-bottom: 12rpx;
		font-size: 28rpx;
	}

	.px-info-details {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8rpx;
		font-size: 24rpx;
	}

	.px-info-item {
		display: flex;
		align-items: center;
	}

	.px-info-label {
		color: #6c757d;
		font-weight: 500;
		margin-right: 20rpx;
	}

	.px-info-value {
		color: #495057;
		font-weight: 600;
	}

	.px-number {
		flex: 1;
		// padding: 24rpx;
		border: 3rpx solid #c8e6c9;
		border-radius: 20rpx;
		font-size: 28rpx;
		background: #f9fff9;
		color: #2e7d32;
		min-width: 160rpx;
	}

	.px-delete {
		padding: 24rpx 32rpx;
		// border: 3rpx solid #ddd;
		border-radius: 20rpx;
		background: #f5f5f5;
		color: #666;
		cursor: pointer;
		font-size: 24rpx;
		transition: all 0.2s ease;
	}

	.px-delete:hover {
		background: #e8e8e8;
		border-color: #ccc;
	}

	.btn-add-px {
		width: 100%;
		padding: 0 40rpx;
		border: 3rpx solid #43a047;
		border-radius: 20rpx;
		background: #e8f5e9;
		color: #2e7d32;
		font-size: 28rpx;
		font-weight: bold;
	}

	/* 品项第三行样式（健康师和科技部老师选择） */
	.px-row-third {
		display: block;
		margin-top: 16rpx;
		width: 100%;
	}

	.px-staff-section {
		width: 100%;
		margin-bottom: 24rpx;
	}

	.px-staff-section:last-child {
		margin-bottom: 0;
	}

	.px-jks-select, .px-kjb-select {
		padding: 16rpx 24rpx;
		border: 3rpx solid #c8e6c9;
		border-radius: 16rpx;
		background: #f9fff9;
		color: #2e7d32;
		cursor: pointer;
		font-size: 24rpx;
		text-align: center;
		transition: all 0.2s ease;
	}

	.px-jks-select:hover, .px-kjb-select:hover {
		background: #e8f5e9;
		border-color: #43a047;
	}

	.px-jks-list, .px-kjb-list {
		margin-top: 16rpx;
		border: 2rpx solid #e0e0e0;
		border-radius: 12rpx;
		background: #fff;
	}

	.px-staff-item {
		padding: 16rpx;
		border-bottom: 2rpx solid #f0f0f0;
		font-size: 24rpx;
	}

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

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

	.px-staff-name {
		flex: 1;
		color: #2e7d32;
		font-weight: bold;
	}

	.px-staff-remove {
		background: #f44336;
		color: #fff;
		border: none;
		border-radius: 8rpx;
		padding: 4rpx 12rpx;
		font-size: 20rpx;
		cursor: pointer;
	}

	.px-staff-remove:hover {
		background: #d32f2f;
	}

	.px-staff-fields {
		display: flex;
		flex-direction: column;
		gap: 16rpx;
	}

	.px-staff-row {
		display: flex;
		gap: 16rpx;
		align-items: center;
	}

	.px-staff-field {
		flex: 1;
		min-width: 200rpx;
	}

	.px-staff-field input {
		width: 100%;
		// padding: 12rpx 16rpx;
		border: 2rpx solid #ddd;
		border-radius: 8rpx;
		font-size: 24rpx;
		background: #f9f9f9;
	}

	.px-staff-field input:focus {
		outline: none;
		border-color: #43a047;
		background: #fff;
	}

	.px-staff-field-label {
		display: block;
		font-size: 20rpx;
		color: #666;
		margin-bottom: 8rpx;
		font-weight: 500;
	}

	.btn-group {
		display: flex;
		gap: 24rpx;
		margin-top: 48rpx;
	}

	.btn {
		flex: 1;
		padding: 10rpx 40rpx;
		border: none;
		border-radius: 20rpx;
		font-size: 28rpx;
		font-weight: bold;
		cursor: pointer;
		transition: all 0.2s ease;
		letter-spacing: 2rpx;
	}

	.btn-primary {
		background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
		color: #fff;
		box-shadow: 0 4rpx 16rpx rgba(67, 233, 123, 0.3);
	}

	.btn-primary:hover {
		box-shadow: 0 8rpx 32rpx rgba(67, 233, 123, 0.4);
		transform: translateY(-2rpx);
	}

	/* 签字相关样式 */
	.signature-preview {
		margin-top: 24rpx;
		padding: 24rpx;
		background: #f9fff9;
		border: 2rpx solid #c8e6c9;
		border-radius: 16rpx;
	}

	.preview-label {
		display: block;
		font-size: 26rpx;
		color: #2e7d32;
		font-weight: bold;
		margin-bottom: 16rpx;
	}

	.signature-image {
		width: 100%;
		max-width: 300rpx;
		height: 120rpx;
		border: 2rpx solid #e0e0e0;
		border-radius: 12rpx;
		background: #fff;
		margin-bottom: 16rpx;
	}

	.btn-clear-signature {
		padding: 12rpx 24rpx;
		background: #f5f5f5;
		color: #666;
		border: 2rpx solid #ddd;
		border-radius: 12rpx;
		font-size: 24rpx;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.2s ease;
	}

	.btn-clear-signature:hover {
		background: #e0e0e0;
	}

	/* 全屏签字弹窗样式 */
	.signature-modal-overlay {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.7);
		z-index: 9999;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
	}

	.signature-modal {
		width: 100%;
		background: #fff;
		overflow: hidden;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.signature-modal-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30rpx 40rpx;
		background: #f8f9fa;
		border-bottom: 2rpx solid #e9ecef;
	}

	.signature-modal-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #2e7d32;
	}

	.btn-close-modal {
		width: 60rpx;
		height: 60rpx;
		background: #f5f5f5;
		border: none;
		border-radius: 50%;
		font-size: 36rpx;
		color: #666;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: all 0.2s ease;
		margin: 0;
	}

	.btn-close-modal:hover {
		background: #e0e0e0;
		color: #333;
	}

	.signature-modal-content {
		background: #fff;
		flex: 1;
		width: 100%;
	}

	/* 全屏模式下SignaturePad组件样式调整 */
	.signature-modal-content .signature-container {
		height: 100%;
		border: none;
		border-radius: 0;
		box-shadow: none;
	}

	.signature-modal-content .signature-header {
		padding: 20rpx 30rpx;
		background: #f8f9fa;
		border-bottom: 2rpx solid #e9ecef;
	}

	.signature-modal-content .signature-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #2e7d32;
	}

	.signature-modal-content .btn-clear,
	.signature-modal-content .btn-confirm {
		padding: 16rpx 32rpx;
		font-size: 28rpx;
		font-weight: 500;
		border-radius: 12rpx;
	}

	.signature-modal-content .btn-clear {
		background: #f5f5f5;
		color: #666;
		border: 2rpx solid #ddd;
	}

	.signature-modal-content .btn-clear:hover {
		background: #e0e0e0;
		color: #333;
	}

	.signature-modal-content .btn-confirm {
		background: #2e7d32;
		color: #fff;
		border: none;
	}

	.signature-modal-content .btn-confirm:hover {
		background: #1b5e20;
		transform: translateY(-2rpx);
	}

	.signature-modal-content .signature-pad {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 20rpx;
	}

	.signature-modal-content .signature-tips {
		padding: 20rpx;
		text-align: center;
		background: #f8f9fa;
		border-top: 2rpx solid #e9ecef;
	}

	.signature-modal-content .tips-text {
		font-size: 24rpx;
		color: #666;
	}

	/* 签字占位符样式 */
	.signature-placeholder {
		display: flex;
		justify-content: center;
		align-items: center;
		min-height: 200rpx;
		border: 2rpx dashed #c8e6c9;
		border-radius: 16rpx;
		background: #f9fff9;
	}

	.btn-signature-placeholder {
		background: #2e7d32;
		color: #fff;
		border: none;
		border-radius: 16rpx;
		font-size: 28rpx;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.2s ease;
		box-shadow: 0 4rpx 16rpx rgba(46, 125, 50, 0.3);
	}

	.btn-signature-placeholder:hover {
		background: #1b5e20;
		transform: translateY(-2rpx);
		box-shadow: 0 8rpx 32rpx rgba(46, 125, 50, 0.4);
	}

	.signature-placeholder-text {
		color: #fff;
	}

	/* 签字操作按钮样式 */
	.signature-actions {
		display: flex;
		gap: 16rpx;
		margin-top: 16rpx;
	}

	.btn-re-signature {
		flex: 1;
		padding: 12rpx 24rpx;
		background: #2e7d32;
		color: #fff;
		border: none;
		border-radius: 12rpx;
		font-size: 24rpx;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.2s ease;
	}

	.btn-re-signature:hover {
		background: #1b5e20;
	}

	/* 文件上传样式 */
	.file-upload-area {
		border: 4rpx dashed #c8e6c9;
		border-radius: 24rpx;
		padding: 48rpx;
		text-align: center;
		background: linear-gradient(135deg, #f9fff9 0%, #e8f5e9 100%);
		cursor: pointer;
		min-height: 240rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: relative;
		overflow: hidden;
	}

	.file-upload-text {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 24rpx;
		color: #6a9c6a;
		font-size: 19rpx;
		position: relative;
		z-index: 1;
	}

	.file-upload-icon {
		font-size: 50rpx;
		opacity: 0.8;
	}

	.file-list {
		margin-top: 32rpx;
		text-align: left;
		max-height: 400rpx;
		overflow-y: auto;
	}

	.file-item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx 24rpx;
		background: #fff;
		border: 1rpx solid #e8f5e9;
		border-radius: 12rpx;
		margin-bottom: 12rpx;
		font-size: 26rpx;
		box-shadow: 0 2rpx 8rpx rgba(67, 233, 123, 0.08);
		transition: all 0.3s ease;
	}

	.file-info {
		display: flex;
		align-items: center;
		gap: 20rpx;
		flex: 1;
		min-width: 0;
		overflow: hidden;
	}

	.file-icon {
		font-size: 32rpx;
		width: 56rpx;
		height: 56rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background: linear-gradient(135deg, #f9fff9 0%, #e8f5e9 100%);
		border-radius: 10rpx;
		flex-shrink: 0;
		border: 1rpx solid #c8e6c9;
	}

	.file-name {
		flex: 1;
		font-size: 28rpx;
		color: #333;
		font-weight: 500;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		min-width: 0;
		line-height: 1.4;
	}

	.file-size {
		font-size: 22rpx;
		color: #666;
		background: #f8f9fa;
		padding: 6rpx 12rpx;
		border-radius: 6rpx;
		flex-shrink: 0;
		border: 1rpx solid #e9ecef;
	}

	.file-actions {
		display: flex;
		align-items: center;
		gap: 12rpx;
		flex-shrink: 0;
	}

	.file-status {
		font-size: 22rpx;
		padding: 6rpx 12rpx;
		border-radius: 6rpx;
		font-weight: 500;
		white-space: nowrap;
	}

	.file-status.success {
		color: #2e7d32;
		background: #e8f5e9;
		border: 1rpx solid #c8e6c9;
	}

	.file-status.error {
		color: #c62828;
		background: #ffebee;
		border: 1rpx solid #ffcdd2;
	}

	.file-status.uploading {
		color: #ef6c00;
		background: #fff3e0;
		border: 1rpx solid #ffe0b2;
	}

	// @media (max-width: 750rpx) {
	// 	.form-content {
	// 		padding: 40rpx;
	// 	}
	// }
</style>
