<template>
    <el-dialog
        v-model="data.dialogVisible"
        :title="data.isDetail ? '进仓详情' : (data.editId ? '编辑进仓记录' : '新增进仓记录')"
        :before-close="handleClose"
        width="900px"
        :close-on-click-modal="false"
    >
        <el-form ref="formDataRef" :model="ruleForm" :rules="rules" label-width="120px" :disabled="data.isDetail">
            <el-row :gutter="20">
                <el-col :span="12">
                    <el-form-item label="中转仓" prop="warehouseId">
                        <el-select 
                            v-model="ruleForm.warehouseId" 
                            placeholder="请选择中转仓" 
                            clearable 
                            filterable 
                            style="width: 100%"
                            @change="handleWarehouseChange"
                        >
                            <el-option
                                v-for="item in warehouseList"
                                :key="item.id"
                                :label="item.warehouseName"
                                :value="item.id"
                            />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="运送清单" prop="deliveryId">
                        <el-select 
                            v-model="ruleForm.deliveryId" 
                            placeholder="请选择运送清单" 
                            clearable 
                            filterable 
                            style="width: 100%"
                            @change="handleDeliveryChange"
                        >
                            <el-option
                                v-for="item in deliveryList"
                                :key="item.id"
                                :label="`${item.deliveryNumber || '--'} - ${item.licensePlate || '--'}`"
                                :value="item.id"
                            />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="12">
                    <el-form-item label="订单" prop="orderId">
                        <el-select 
                            v-model="ruleForm.orderId" 
                            placeholder="请选择订单（可多选）" 
                            multiple
                            clearable 
                            filterable 
                            style="width: 100%"
                        >
                            <el-option
                                v-for="item in orderList"
                                :key="item.id"
                                :label="`订单${item.id} - 单价: ${item.firmPrice || '--'}元/斤`"
                                :value="item.id"
                            />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="进仓时间" prop="inTime">
                        <el-date-picker
                            v-model="ruleForm.inTime"
                            type="datetime"
                            placeholder="请选择进仓时间"
                            style="width: 100%"
                            value-format="YYYY-MM-DD HH:mm:ss"
                        />
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="24">
                    <el-form-item label="来源地" prop="sourceLocation">
                        <el-input 
                            v-model="ruleForm.sourceLocation" 
                            placeholder="请输入来源地" 
                            maxlength="255"
                            style="width: calc(100% - 100px); margin-right: 10px;"
                        />
                        <el-button type="primary" @click="openSourceLocationMap">选择位置</el-button>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="12">
                    <el-form-item label="来源地经度">
                        <el-input v-model="ruleForm.sourceLon" placeholder="经度" disabled />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="来源地纬度">
                        <el-input v-model="ruleForm.sourceLat" placeholder="纬度" disabled />
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="12">
                    <el-form-item label="牛只数量(头)" prop="cattleCount">
                        <el-input-number
                            v-model="ruleForm.cattleCount"
                            :min="1"
                            :max="9999"
                            placeholder="请输入牛只数量"
                            style="width: 100%"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="重量(公斤)" prop="weight">
                        <el-input-number
                            v-model="ruleForm.weight"
                            :min="0"
                            :precision="2"
                            placeholder="请输入重量"
                            style="width: 100%"
                        >
                            <template #append>kg</template>
                        </el-input-number>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="12">
                    <el-form-item label="状态" prop="status">
                        <el-select v-model="ruleForm.status" placeholder="请选择状态" style="width: 100%">
                            <el-option label="待进仓" :value="1" />
                            <el-option label="已进仓" :value="2" />
                            <el-option label="已出仓" :value="3" />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="24">
                    <el-form-item label="照片">
                        <div style="display: flex; flex-direction: column; gap: 10px;">
                            <!-- 拖拽上传区域 -->
                            <el-upload
                                drag
                                action="#"
                                :auto-upload="false"
                                :before-upload="beforePhotoUpload"
                                :limit="9"
                                accept="image/*"
                                :on-change="handlePhotoChange"
                                :show-file-list="false"
                                style="width: 100%"
                            >
                                <el-icon class="el-icon--upload"><UploadFilled /></el-icon>
                                <div class="el-upload__text">将图片文件拖到此处，或<em>点击上传</em></div>
                                <template #tip>
                                    <div class="el-upload__tip">支持 jpg/png/gif 格式，单个文件不超过 10MB，最多上传 9 张</div>
                                </template>
                            </el-upload>
                            <!-- 图片预览列表 -->
                            <div v-if="photoFileList.length > 0" class="photo-preview-list">
                                <div 
                                    v-for="(file, index) in photoFileList" 
                                    :key="index"
                                    class="photo-preview-item"
                                >
                                    <el-image
                                        :src="file.url || file.response?.data?.url || ''"
                                        fit="cover"
                                        class="photo-preview-image"
                                        :preview-src-list="photoFileList.map(f => f.url || f.response?.data?.url || '').filter(Boolean)"
                                        :initial-index="index"
                                    />
                                    <el-button
                                        type="danger"
                                        :icon="Delete"
                                        circle
                                        size="small"
                                        class="photo-delete-btn"
                                        @click="handlePhotoRemove(file)"
                                    />
                                </div>
                            </div>
                        </div>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="24">
                    <el-form-item label="视频">
                        <el-upload
                            drag
                            action="#"
                            :auto-upload="false"
                            :on-change="handleVideoChange"
                            :on-remove="handleVideoRemove"
                            :before-upload="beforeVideoUpload"
                            :limit="3"
                            accept="video/*"
                            :show-file-list="false"
                            style="width: 100%"
                        >
                            <el-icon class="el-icon--upload"><UploadFilled /></el-icon>
                            <div class="el-upload__text">将视频文件拖到此处，或<em>点击上传</em></div>
                            <template #tip>
                                <div class="el-upload__tip">支持 mp4/avi/rmvb/mkv 格式，单个文件不超过 100MB，最多上传 3 个</div>
                            </template>
                        </el-upload>
                        <!-- 视频预览列表 -->
                        <div v-if="videoFileList.length > 0" class="video-preview-list">
                            <div 
                                v-for="(file, index) in videoFileList" 
                                :key="index"
                                class="video-preview-item"
                            >
                                <video 
                                    :src="file.url || file.response?.data?.url || ''" 
                                    controls 
                                    class="video-preview-player"
                                ></video>
                                <div class="video-name">{{ file.name || '视频' }}</div>
                                <el-button
                                    type="danger"
                                    :icon="Delete"
                                    circle
                                    size="small"
                                    class="video-delete-btn"
                                    @click="handleVideoRemove(file)"
                                />
                            </div>
                        </div>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="24">
                    <el-form-item label="备注">
                        <el-input
                            v-model="ruleForm.remark"
                            type="textarea"
                            :rows="3"
                            placeholder="请输入备注"
                            maxlength="500"
                            show-word-limit
                        />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>

        <template #footer>
            <span class="dialog-footer">
                <el-button v-if="!data.isDetail" :loading="data.saveLoading" type="primary" @click="onClickSave">
                    保存
                </el-button>
                <el-button @click="handleClose">{{ data.isDetail ? '关闭' : '取消' }}</el-button>
            </span>
        </template>
    </el-dialog>

    <!-- 来源地地址选择地图 -->
    <el-dialog v-model="showSourceLocationMap" title="选择来源地地址" width="900px">
        <baidu-map 
            class="map" 
            :center="ruleForm.sourceLon && ruleForm.sourceLat ? {lng: parseFloat(ruleForm.sourceLon), lat: parseFloat(ruleForm.sourceLat)} : {lng: 116.404, lat: 39.915}" 
            :zoom="15" 
            :scroll-wheel-zoom="true"
            @click="handleSourceLocationClick"
            style="height: 500px"
        >
            <bm-marker 
                v-if="ruleForm.sourceLon && ruleForm.sourceLat" 
                :position="{lng: parseFloat(ruleForm.sourceLon), lat: parseFloat(ruleForm.sourceLat)}" 
                :dragging="true" 
                @dragging="handleSourceMarkerDrag" 
            />
            <bm-map-type :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"></bm-map-type>
        </baidu-map>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="showSourceLocationMap = false">取消</el-button>
                <el-button type="primary" @click="showSourceLocationMap = false">确定</el-button>
            </span>
        </template>
    </el-dialog>

    <!-- 图片预览 -->
    <el-dialog v-model="showImageViewer" title="图片预览" width="800px">
        <el-image :src="imageViewerUrl" style="width: 100%" fit="contain" />
    </el-dialog>
</template>

<script setup>
import { ref, reactive, watch } from 'vue';
import { ElMessage } from 'element-plus';
import { Plus, UploadFilled, Delete } from '@element-plus/icons-vue';
import { BaiduMap, BmMapType, BmMarker } from 'vue-baidu-map-3x';
import { warehouseInAdd, warehouseInEdit, warehouseInDetail } from '@/api/warehouseIn.js';
import { warehouseAll } from '@/api/warehouse.js';
import { orderPageQuery, shippingList } from '@/api/shipping.js';

const emits = defineEmits(['success']);
const formDataRef = ref(null);
const showSourceLocationMap = ref(false);
const showImageViewer = ref(false);
const imageViewerUrl = ref('');
const photoFileList = ref([]);
const videoFileList = ref([]);

const warehouseList = ref([]);
const orderList = ref([]);
const deliveryList = ref([]);

const data = reactive({
    dialogVisible: false,
    saveLoading: false,
    editId: null,
    isDetail: false,
});

const ruleForm = reactive({
    id: null,
    warehouseId: null,
    orderId: [],
    deliveryId: null,
    sourceLocation: '',
    sourceLon: '',
    sourceLat: '',
    cattleCount: null,
    weight: null,
    inTime: '',
    photos: '',
    videos: '',
    remark: '',
    status: 1,
});

const rules = reactive({
    warehouseId: [
        { required: true, message: '请选择中转仓', trigger: 'change' },
    ],
    deliveryId: [
        { required: true, message: '请选择运送清单', trigger: 'change' },
    ],
    cattleCount: [
        { required: true, message: '请输入牛只数量', trigger: 'blur' },
        { type: 'number', min: 1, message: '牛只数量必须大于0', trigger: 'blur' },
    ],
    inTime: [
        { required: true, message: '请选择进仓时间', trigger: 'change' },
    ],
});

// 加载中转仓列表
const loadWarehouseList = async () => {
    try {
        const res = await warehouseAll();
        if (res.code === 200) {
            warehouseList.value = res.data || [];
        }
    } catch (error) {
        console.error('加载中转仓列表失败', error);
    }
};

// 加载订单列表
const loadOrderList = async () => {
    try {
        const res = await orderPageQuery({ pageNum: 1, pageSize: 1000 });
        if (res.code === 200) {
            const responseData = res.data || res;
            if (responseData && typeof responseData === 'object' && 'rows' in responseData) {
                orderList.value = responseData.rows || [];
            } else if (responseData && responseData.data && 'rows' in responseData.data) {
                orderList.value = responseData.data.rows || [];
            } else {
                orderList.value = [];
            }
        }
    } catch (error) {
        console.error('加载订单列表失败', error);
    }
};

// 加载运送清单列表
const loadDeliveryList = async () => {
    try {
        const res = await shippingList({ pageNum: 1, pageSize: 1000 });
        if (res.code === 200) {
            const responseData = res.data || res;
            if (responseData && typeof responseData === 'object' && 'rows' in responseData) {
                deliveryList.value = responseData.rows || [];
            } else if (responseData && responseData.data && 'rows' in responseData.data) {
                deliveryList.value = responseData.data.rows || [];
            } else {
                deliveryList.value = [];
            }
        }
    } catch (error) {
        console.error('加载运送清单列表失败', error);
    }
};

const handleClose = () => {
    if (formDataRef.value) {
        formDataRef.value.resetFields();
    }
    Object.assign(ruleForm, {
        id: null,
        warehouseId: null,
        orderId: [],
        deliveryId: null,
        sourceLocation: '',
        sourceLon: '',
        sourceLat: '',
        cattleCount: null,
        weight: null,
        inTime: '',
        photos: '',
        videos: '',
        remark: '',
        status: 1,
    });
    photoFileList.value = [];
    videoFileList.value = [];
    data.editId = null;
    data.isDetail = false;
    data.dialogVisible = false;
};

const onClickSave = () => {
    if (!formDataRef.value) {
        return;
    }

    formDataRef.value.validate((valid) => {
        if (!valid) {
            return false;
        }

        data.saveLoading = true;

        // 处理订单ID（多个订单用逗号分隔）
        const orderIdStr = ruleForm.orderId && ruleForm.orderId.length > 0 
            ? ruleForm.orderId.join(',') 
            : null;

        // 处理照片和视频URL（多个用逗号分隔）
        const photosStr = photoFileList.value.map(file => file.url || file.response?.data?.url || '').filter(url => url).join(',');
        const videosStr = videoFileList.value.map(file => file.url || file.response?.data?.url || '').filter(url => url).join(',');

        const params = {
            warehouseId: ruleForm.warehouseId,
            orderId: orderIdStr,
            deliveryId: ruleForm.deliveryId,
            sourceLocation: ruleForm.sourceLocation,
            sourceLon: ruleForm.sourceLon,
            sourceLat: ruleForm.sourceLat,
            cattleCount: ruleForm.cattleCount,
            weight: ruleForm.weight,
            inTime: ruleForm.inTime,
            photos: photosStr,
            videos: videosStr,
            remark: ruleForm.remark,
        };

        if (data.editId) {
            // 编辑
            params.id = data.editId;
            params.status = ruleForm.status;
            warehouseInEdit(params)
                .then((res) => {
                    if (res.code === 200) {
                        ElMessage.success('编辑成功');
                        handleClose();
                        emits('success');
                    } else {
                        ElMessage.error(res.msg || '编辑失败');
                    }
                })
                .catch((error) => {
                    ElMessage.error('编辑失败：' + (error.message || '未知错误'));
                })
                .finally(() => {
                    data.saveLoading = false;
                });
        } else {
            // 新增
            warehouseInAdd(params)
                .then((res) => {
                    if (res.code === 200) {
                        ElMessage.success('新增成功');
                        handleClose();
                        emits('success');
                    } else {
                        ElMessage.error(res.msg || '新增失败');
                    }
                })
                .catch((error) => {
                    ElMessage.error('新增失败：' + (error.message || '未知错误'));
                })
                .finally(() => {
                    data.saveLoading = false;
                });
        }
    });
};

const onShowDialog = (row, isDetail = false) => {
    data.isDetail = isDetail || false;
    data.editId = null;
    
    if (row) {
        data.editId = row.id;
        // 如果是详情模式，先获取详情数据
        if (isDetail) {
            warehouseInDetail(row.id)
                .then((res) => {
                    if (res.code === 200 && res.data) {
                        const detailData = res.data;
                        Object.assign(ruleForm, {
                            id: detailData.id,
                            warehouseId: detailData.warehouseId,
                            orderId: detailData.orderId ? detailData.orderId.split(',').map(id => parseInt(id)) : [],
                            deliveryId: detailData.deliveryId,
                            sourceLocation: detailData.sourceLocation || '',
                            sourceLon: detailData.sourceLon || '',
                            sourceLat: detailData.sourceLat || '',
                            cattleCount: detailData.cattleCount,
                            weight: detailData.weight,
                            inTime: detailData.inTime || '',
                            photos: detailData.photos || '',
                            videos: detailData.videos || '',
                            remark: detailData.remark || '',
                            status: detailData.status !== undefined ? detailData.status : 1,
                        });
                        // 处理照片和视频文件列表
                        if (detailData.photos) {
                            photoFileList.value = detailData.photos.split(',').map(url => ({ url, name: 'photo' }));
                        }
                        if (detailData.videos) {
                            videoFileList.value = detailData.videos.split(',').map(url => ({ url, name: 'video' }));
                        }
                    }
                })
                .catch((error) => {
                    ElMessage.error('获取详情失败：' + (error.message || '未知错误'));
                });
        } else {
            // 编辑模式，直接使用传入的数据
            Object.assign(ruleForm, {
                id: row.id,
                warehouseId: row.warehouseId,
                orderId: row.orderId ? row.orderId.split(',').map(id => parseInt(id)) : [],
                deliveryId: row.deliveryId,
                sourceLocation: row.sourceLocation || '',
                sourceLon: row.sourceLon || '',
                sourceLat: row.sourceLat || '',
                cattleCount: row.cattleCount,
                weight: row.weight,
                inTime: row.inTime || '',
                photos: row.photos || '',
                videos: row.videos || '',
                remark: row.remark || '',
                status: row.status !== undefined ? row.status : 1,
            });
            // 处理照片和视频文件列表
            if (row.photos) {
                photoFileList.value = row.photos.split(',').map(url => ({ url, name: 'photo' }));
            }
            if (row.videos) {
                videoFileList.value = row.videos.split(',').map(url => ({ url, name: 'video' }));
            }
        }
    } else {
        // 新增模式，重置表单
        Object.assign(ruleForm, {
            id: null,
            warehouseId: null,
            orderId: [],
            deliveryId: null,
            sourceLocation: '',
            sourceLon: '',
            sourceLat: '',
            cattleCount: null,
            weight: null,
            inTime: '',
            photos: '',
            videos: '',
            remark: '',
            status: 1,
        });
        photoFileList.value = [];
        videoFileList.value = [];
    }
    
    data.dialogVisible = true;
};

// 中转仓选择变化
const handleWarehouseChange = (warehouseId) => {
    // 可以在这里添加逻辑
};

// 运送清单选择变化
const handleDeliveryChange = (deliveryId) => {
    if (!deliveryId) {
        // 清空相关字段
        ruleForm.sourceLocation = '';
        ruleForm.sourceLon = '';
        ruleForm.sourceLat = '';
        ruleForm.cattleCount = null;
        ruleForm.weight = null;
        return;
    }
    
    // 从 deliveryList 中找到对应的运送清单
    const selectedDelivery = deliveryList.value.find(item => item.id === deliveryId);
    if (selectedDelivery) {
        // 自动填充来源地信息
        if (selectedDelivery.startLocation) {
            ruleForm.sourceLocation = selectedDelivery.startLocation;
        }
        if (selectedDelivery.startLon) {
            ruleForm.sourceLon = selectedDelivery.startLon;
        }
        if (selectedDelivery.startLat) {
            ruleForm.sourceLat = selectedDelivery.startLat;
        }
        
        // 自动填充牛只数量
        if (selectedDelivery.ratedQuantity) {
            ruleForm.cattleCount = selectedDelivery.ratedQuantity;
        }
        
        // 自动计算重量：entruckWeight - emptyWeight
        if (selectedDelivery.entruckWeight && selectedDelivery.emptyWeight) {
            const entruckWeight = parseFloat(selectedDelivery.entruckWeight) || 0;
            const emptyWeight = parseFloat(selectedDelivery.emptyWeight) || 0;
            const calculatedWeight = entruckWeight - emptyWeight;
            if (calculatedWeight > 0) {
                ruleForm.weight = parseFloat(calculatedWeight.toFixed(2));
            }
        } else if (selectedDelivery.entruckWeight) {
            // 如果只有装车重量，也可以填充
            ruleForm.weight = parseFloat(selectedDelivery.entruckWeight) || null;
        }
    }
};

// 打开来源地地图选择地址
const openSourceLocationMap = () => {
    if (ruleForm.sourceLocation && ruleForm.sourceLocation.trim()) {
        showSourceLocationMap.value = true;
        setTimeout(() => {
            if (window.BMap && window.BMap.Geocoder) {
                const geocoder = new window.BMap.Geocoder();
                geocoder.getPoint(ruleForm.sourceLocation, (point) => {
                    if (point) {
                        ruleForm.sourceLon = point.lng;
                        ruleForm.sourceLat = point.lat;
                        ElMessage.success('已定位到该地址');
                    } else {
                        ElMessage.warning('未找到该地址，请在地图上手动选择');
                    }
                });
            }
        }, 500);
    } else {
        showSourceLocationMap.value = true;
    }
};

// 地图点击事件
const handleSourceLocationClick = (e) => {
    ruleForm.sourceLon = e.point.lng;
    ruleForm.sourceLat = e.point.lat;
    if (window.BMap && window.BMap.Geocoder) {
        const geocoder = new window.BMap.Geocoder();
        geocoder.getLocation(e.point, (res) => {
            if (res) {
                ruleForm.sourceLocation = res.address;
                ElMessage.success('已设置来源地地址');
            }
        });
    }
};

// 标记拖拽事件
const handleSourceMarkerDrag = (e) => {
    ruleForm.sourceLon = e.point.lng;
    ruleForm.sourceLat = e.point.lat;
    if (window.BMap && window.BMap.Geocoder) {
        const geocoder = new window.BMap.Geocoder();
        geocoder.getLocation(e.point, (res) => {
            if (res) {
                ruleForm.sourceLocation = res.address;
            }
        });
    }
};

// 图片预览（保留用于兼容）
const handlePictureCardPreview = (file) => {
    imageViewerUrl.value = file.url || file.response?.data?.url || '';
    showImageViewer.value = true;
};

// 照片文件变化处理（拖拽上传时触发）
const handlePhotoChange = (file, fileList) => {
    // 验证文件
    if (!beforePhotoUpload(file)) {
        return;
    }
    
    // 手动上传文件
    uploadPhotoFile(file);
};

// 手动上传照片文件
const uploadPhotoFile = async (file) => {
    const formData = new FormData();
    formData.append('file', file.raw || file);
    
    try {
        // 获取 token
        let token = '';
        const userStore = localStorage.getItem('userStore');
        if (userStore) {
            const us = JSON.parse(userStore);
            token = us.token || '';
        }
        
        const response = await fetch('/api/common/upload', {
            method: 'POST',
            headers: {
                'Authorization': token,
            },
            body: formData,
        });
        
        const result = await response.json();
        if (result.code === 200) {
            const photoUrl = result.data?.url || result.data;
            photoFileList.value.push({
                url: photoUrl,
                name: file.name,
                uid: file.uid || Date.now(),
            });
            ElMessage.success('照片上传成功');
        } else {
            ElMessage.error(result.msg || '照片上传失败');
        }
    } catch (error) {
        console.error('照片上传失败:', error);
        ElMessage.error('照片上传失败');
    }
};

// 删除照片
const handlePhotoRemove = (file) => {
    const index = photoFileList.value.findIndex(item => item.uid === file.uid || item.url === file.url);
    if (index > -1) {
        photoFileList.value.splice(index, 1);
    }
};

// 视频文件变化处理（拖拽上传时触发）
const handleVideoChange = (file, fileList) => {
    // 验证文件
    if (!beforeVideoUpload(file)) {
        return;
    }
    
    // 手动上传文件
    uploadVideoFile(file);
};

// 手动上传视频文件
const uploadVideoFile = async (file) => {
    const formData = new FormData();
    formData.append('file', file.raw || file);
    
    try {
        // 获取 token
        let token = '';
        const userStore = localStorage.getItem('userStore');
        if (userStore) {
            const us = JSON.parse(userStore);
            token = us.token || '';
        }
        
        const response = await fetch('/api/common/upload', {
            method: 'POST',
            headers: {
                'Authorization': token,
            },
            body: formData,
        });
        
        const result = await response.json();
        if (result.code === 200) {
            const videoUrl = result.data?.url || result.data;
            videoFileList.value.push({
                url: videoUrl,
                name: file.name,
                uid: file.uid || Date.now(),
            });
            ElMessage.success('视频上传成功');
        } else {
            ElMessage.error(result.msg || '视频上传失败');
        }
    } catch (error) {
        console.error('视频上传失败:', error);
        ElMessage.error('视频上传失败');
    }
};

// 删除视频
const handleVideoRemove = (file) => {
    const index = videoFileList.value.findIndex(item => item.uid === file.uid || item.url === file.url);
    if (index > -1) {
        videoFileList.value.splice(index, 1);
    }
};

// 上传前验证照片
const beforePhotoUpload = (file) => {
    const isImage = file.type.startsWith('image/');
    const isLt10M = file.size / 1024 / 1024 < 10;

    if (!isImage) {
        ElMessage.error('只能上传图片文件!');
        return false;
    }
    if (!isLt10M) {
        ElMessage.error('图片大小不能超过 10MB!');
        return false;
    }
    
    // 检查数量限制
    if (photoFileList.value.length >= 9) {
        ElMessage.error('最多只能上传 9 张照片!');
        return false;
    }
    
    return true; // 允许继续处理
};

// 上传前验证视频
const beforeVideoUpload = (file) => {
    const isVideo = file.type.startsWith('video/');
    const isLt100M = file.size / 1024 / 1024 < 100;

    if (!isVideo) {
        ElMessage.error('只能上传视频文件!');
        return false;
    }
    if (!isLt100M) {
        ElMessage.error('视频大小不能超过 100MB!');
        return false;
    }
    
    // 检查数量限制
    if (videoFileList.value.length >= 3) {
        ElMessage.error('最多只能上传 3 个视频!');
        return false;
    }
    
    return true; // 允许继续处理
};

// 监听对话框打开，加载数据
watch(() => data.dialogVisible, (newVal) => {
    if (newVal) {
        loadWarehouseList();
        loadOrderList();
        loadDeliveryList();
    }
});

// 暴露方法给父组件调用
defineExpose({
    onShowDialog,
});
</script>

<style scoped lang="scss">
.map {
    width: 100%;
    height: 500px;
}

/* 照片预览列表样式 */
.photo-preview-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.photo-preview-item {
    position: relative;
    width: 120px;
    height: 120px;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    overflow: hidden;
}

.photo-preview-image {
    width: 100%;
    height: 100%;
}

.photo-delete-btn {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* 视频预览列表样式 */
.video-preview-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 15px;
}

.video-preview-item {
    position: relative;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    padding: 10px;
    background-color: #f5f7fa;
}

.video-preview-player {
    width: 100%;
    max-height: 300px;
    border-radius: 4px;
}

.video-name {
    margin-top: 8px;
    font-size: 12px;
    color: #606266;
    text-align: center;
}

.video-delete-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
</style>

