Merge branch 'main' of https://gitlab.guxuan.icu/Leo_Ding/JinShan_uniapp

pages/index/index.vue

@@ -96,7 +96,7 @@
 							<text class="card-desc">维修方便便捷</text>
 							<view class="card-bg"></view>
 						</view>
-						<image class="card-icon" src="/static/imgs/index/weixiu.png"></image>
+						<image class="card-icon" src="/static/imgs/index/weixiu.png" style="width: 80rpx;height: 80rpx;bottom: 32rpx;"></image>
 					</view>
 
 					<!-- <view class="service-card large card-3" @click="goDetail('neighborList')" hover-class="card-hover">
@@ -522,13 +522,13 @@
 
 					&.card-2 {
 						.card-bg {
-							background: #ff7e7e;
+							background: #5b9cf8;
-							top: -30rpx;
+							top: -50rpx;
 							right: -30rpx;
 						}
 
 						.card-icon {
-							filter: drop-shadow(0 4rpx 8rpx rgba(255, 126, 126, 0.3));
+							filter: drop-shadow(0 4rpx 8rpx rgba(91, 156, 248, 0.3));
 						}
 					}
 

pages/mine/index.vue

@@ -6,7 +6,7 @@
                 <view class="avatar-section">
                     <view class="avatar-wrapper">
                         <image class="avatar" :src="userInfo.avatarUrl || '/static/imgs/index/nav.png'"
-							mode="aspectFill"></image>
+                            mode="aspectFill" @click="onAvatarClick"></image>
                         <view class="edit-icon" @click="handleEditClick">
                             <u-icon name="edit-pen" color="#fff" size="24"></u-icon>
                         </view>
@@ -23,7 +23,6 @@
                 </view>
             </view>
         </view>
-
         <!-- 功能按钮区域 -->
         <view class="function-card">
             <view class="button-item" v-for="(item, index) in choseList" :key="index" @click="goPage(item)">
@@ -34,7 +33,6 @@
                 <u-icon name="arrow-right" color="#c8c9cc" size="28"></u-icon>
             </view>
         </view>
-
         <!-- 修改用户信息弹窗 -->
         <u-modal :show="showEditModal" :title="isLogin ? '修改用户信息' : '微信授权登录'" :show-confirm-button="isLogin"
             :show-cancel-button="isLogin" @confirm="handleSubmit" @cancel="handleCancel" confirm-color="#2979ff"
@@ -55,25 +53,33 @@
                     </button>
                     <view class="auth-tip">登录即表示同意《用户协议》和《隐私政策》</view>
                 </view>
-
                 <!-- 已登录时显示编辑表单 -->
                 <view v-else class="edit-section">
                     <view class="form-item">
                         <text class="form-label">头像：</text>
-						<u-upload :file-list="avatarList" :max-count="1" @afterRead="handleAvatarUpload"
+                        <view class="avatar-upload-container" @click="onAvatarClick">
-							@delete="handleAvatarDelete" width="160" height="160" preview-full-image>
+                            <view class="avatar-preview">
-							<view slot="delete" class="custom-delete">
+                                <image 
-								<u-icon name="close" color="#fff" size="24"></u-icon>
+                                    v-if="avatarList.length > 0" 
+                                    :src="avatarList[0].url" 
+                                    mode="aspectFill" 
+                                    class="avatar-img">
+                                </image>
+                                <view v-else class="avatar-placeholder">
+                                    <u-icon name="plus" color="#c0c4cc" size="28"></u-icon>
+                                    <text class="placeholder-text">点击上传</text>
                                 </view>
-						</u-upload>
+                                <view v-if="avatarList.length > 0" class="avatar-delete" @click.stop="handleAvatarDelete">
-						<view class="upload-tip">点击上传，建议尺寸1:1</view>
+                                    <u-icon name="close" color="#fff" size="26"></u-icon>
+                                </view>
+                            </view>
+                        </view>
+                        <view class="upload-tip">点击上传，支持拍照或从相册选择</view>
                     </view>
-
                     <view class="form-item">
                         <text class="form-label">姓名：</text>
                         <u-input v-model="formData.name" placeholder="请输入姓名" border="bottom" clearable></u-input>
                     </view>
-
                     <view class="form-item">
                         <text class="form-label">简介：</text>
                         <u-input v-model="formData.bio" type="textarea" placeholder="请输入简介" :maxlength="200"
@@ -84,7 +90,6 @@
                 </view>
             </view>
         </u-modal>
-
         <u-modal 
             :show="showPhoneDialog" 
             title="联系社区" 
@@ -98,7 +103,6 @@
                 <text class="phone-number">{{communityPhone}}</text>
             </view>
         </u-modal>
-
         <Footer></Footer>
     </view>
 </template>
@@ -113,7 +117,6 @@
         IMAGE_BASE_URL,
         BASE_URL
     } from '@/utils/config';
-import { navigateTo } from '@/utils/router';
     export default {
         components: {
             Footer
@@ -179,6 +182,44 @@ import { navigateTo } from '@/utils/router';
             this.initData();
         },
         methods: {
+            // 新增：点击头像触发上传
+            onAvatarClick() {
+                if (!this.isLogin) {
+                    this.showEditModal = true;
+                    return;
+                }
+                
+                // 如果正在上传，则不处理
+                if (this.uploading) return;
+                
+                // 调用选择图片方法
+                uni.chooseImage({
+                    count: 1, // 只选一张
+                    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
+                    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
+                    success: (res) => {
+                        // 选择成功后，获取临时文件路径
+                        const tempFilePaths = res.tempFilePaths;
+                        if (tempFilePaths && tempFilePaths.length > 0) {
+                            // 构造一个类似file对象的结构，用于handleAvatarUpload
+                            const file = {
+                                url: tempFilePaths[0]
+                            };
+                            // 调用上传方法
+                            this.handleAvatarUpload({ file });
+                        }
+                    },
+                    fail: (err) => {
+                        console.error('选择图片失败', err);
+                        uni.showToast({
+                            title: '选择图片失败',
+                            icon: 'none'
+                        });
+                    }
+                });
+            },
+            
+            // 其他方法保持不变...
             handleCloseModal() {
                 this.showPhoneDialog = false;
             },
@@ -203,34 +244,28 @@ import { navigateTo } from '@/utils/router';
                     this.clearUserData();
                 }
             },
-
             // 更新用户信息
             updateUserInfo(data) {
                 // 显示时拼接IMAGE_BASE_URL
                 const avatarUrl = data.avatar ? `${IMAGE_BASE_URL}${data.avatar}` : '/static/imgs/index/nav.png';
-
                 this.userInfo = {
                     nickName: data.name || data.nickName || '未命名用户',
                     avatarUrl: avatarUrl,
                     bio: data.introduce || data.bio || '这家伙很懒，什么都没有写~',
                     phone: data.phone || ''
                 };
-
                 // 更新显示头像
                 this.displayAvatar = this.userInfo.avatarUrl;
-
                 this.formData = {
                     name: this.userInfo.nickName,
                     bio: this.userInfo.bio
                 };
-
                 if (this.userInfo.avatarUrl) {
                     this.avatarList = [{
                         url: this.userInfo.avatarUrl
                     }];
                 }
             },
-
             // 清除用户数据
             clearUserData() {
                 this.isLogin = false;
@@ -247,20 +282,17 @@ import { navigateTo } from '@/utils/router';
                 uni.removeStorageSync('token');
                 uni.removeStorageSync('userInfo');
             },
-
             // 处理编辑点击
             handleEditClick() {
                 if (!this.isLogin) {
                     this.showEditModal = true;
                     return;
                 }
-
                 // 已登录时填充表单数据
                 this.formData = {
                     name: this.userInfo.nickName,
                     bio: this.userInfo.bio
                 };
-
                 if (this.userInfo.avatarUrl) {
                     this.avatarList = [{
                         url: this.userInfo.avatarUrl
@@ -268,10 +300,8 @@ import { navigateTo } from '@/utils/router';
                 } else {
                     this.avatarList = [];
                 }
-
                 this.showEditModal = true;
             },
-
             // 获取用户信息
             onGetUserInfo(e) {
                 if (e.detail.userInfo) {
@@ -286,13 +316,12 @@ import { navigateTo } from '@/utils/router';
                     this.showEditModal = false;
                 }
             },
-
             // 微信登录获取code
             wxLogin() {
                 uni.showLoading({
                     title: '登录中...'
                 });
-
+                this.showEditModal = false;
                 uni.login({
                     provider: 'weixin',
                     success: (loginRes) => {
@@ -308,17 +337,14 @@ import { navigateTo } from '@/utils/router';
                     }
                 });
             },
-
             // 发送登录请求
             async sendLoginRequest(code) {
                 try {
                     const res = await post('/api/v1/apps/login/weixins', {
                         code: code
                     });
-
                     if (res.success) {
                         uni.setStorageSync('token', res.data.access_token);
-
                         if (!res.data.phone) {
                             this.showPhoneButton = true;
                             uni.showToast({
@@ -340,7 +366,6 @@ import { navigateTo } from '@/utils/router';
                     console.error('登录接口错误:', err);
                 }
             },
-
             // 获取手机号
             async getPhoneNumber(e) {
                 if (e.detail.errMsg !== "getPhoneNumber:ok") {
@@ -350,16 +375,13 @@ import { navigateTo } from '@/utils/router';
                     });
                     return;
                 }
-
                 uni.showLoading({
                     title: '获取手机号中...'
                 });
-
                 try {
                     const res = await post('/api/v1/app_auth/weixin/bind_phone', {
                         code: e.detail.code
                     });
-
                     if (res.success) {
                         await this.loginComplete(res.data);
                     } else {
@@ -374,7 +396,6 @@ import { navigateTo } from '@/utils/router';
                     console.error('绑定手机号失败:', err);
                 }
             },
-
             // 登录完成处理
             async loginComplete(data) {
                 try {
@@ -385,7 +406,6 @@ import { navigateTo } from '@/utils/router';
                         uni.setStorageSync('userInfo', res.data);
                         this.updateUserInfo(res.data);
                         this.isLogin = true;
-						// this.showEditModal = false;
                         this.showPhoneButton = false;
                         uni.showToast({
                             title: '登录成功'
@@ -401,21 +421,17 @@ import { navigateTo } from '@/utils/router';
                     console.error('登录完成处理失败:', err);
                 }
             },
-
             // 上传头像
             async handleAvatarUpload(event) {
                 if (!this.isLogin) {
                     this.showEditModal = true;
                     return;
                 }
-
                 const {
                     file
                 } = event;
                 if (!file || !file.url) return;
-
                 this.uploading = true;
-
                 try {
                     // 检查文件大小
                     const fileInfo = await new Promise((resolve, reject) => {
@@ -425,17 +441,13 @@ import { navigateTo } from '@/utils/router';
                             fail: reject
                         });
                     });
-
                     if (fileInfo.size > 3 * 1024 * 1024) {
-						throw new Error('图片大小不能超过2MB');
+                        throw new Error('图片大小不能超过3MB');
                     }
-
                     // 上传到服务器
                     const avatarUrl = await this.uploadAvatar(file.url);
-
                     // 更新用户信息
                     await this.updateUserAvatar(avatarUrl);
-
                     uni.showToast({
                         title: '头像上传成功'
                     });
@@ -449,7 +461,6 @@ import { navigateTo } from '@/utils/router';
                     this.uploading = false;
                 }
             },
-
             // 上传头像到服务器
             uploadAvatar(filePath) {
                 return new Promise((resolve, reject) => {
@@ -478,7 +489,6 @@ import { navigateTo } from '@/utils/router';
                     });
                 });
             },
-
             // 上传头像到服务器
             async updateUserAvatar(avatarUrl) {
                 try {
@@ -488,7 +498,6 @@ import { navigateTo } from '@/utils/router';
                         introduce: this.formData.bio,
                         name: this.formData.name
                     });
-
                     // 2. 获取最新用户信息
                     const res = await get('/api/v1/app_auth/mine');
                     if (res && res.success) {
@@ -503,29 +512,38 @@ import { navigateTo } from '@/utils/router';
                     throw err;
                 }
             },
-
+            // 删除头像 - 新增确认提示
-			// 删除头像
             handleAvatarDelete() {
+                uni.showModal({
+                    title: '提示',
+                    content: '确定要删除当前头像吗？',
+                    confirmText: '删除',
+                    cancelText: '取消',
+                    success: (res) => {
+                        if (res.confirm) {
                             this.avatarList = [];
                             this.displayAvatar = '/static/imgs/index/nav.png';
                             this.userInfo.avatarUrl = '';
+                            uni.showToast({
+                                title: '已删除',
+                                icon: 'none'
+                            });
+                        }
+                    }
+                });
             },
-
             // 提交表单
             async handleSubmit() {
                 if (!this.isLogin) return;
-
                 const {
                     name,
                     bio
                 } = this.formData;
-				console.log("====", this.avatarList)
-				let avatarUrl = this.avatarList.length > 0 ? this.avatarList[0].url : "";
                 
+                let avatarUrl = this.avatarList.length > 0 ? this.avatarList[0].url : "";
                 if (avatarUrl && avatarUrl.includes(IMAGE_BASE_URL)) {
                     avatarUrl = avatarUrl.replace(IMAGE_BASE_URL, '');
                 }
-
                 if (!name) {
                     uni.showToast({
                         title: '请输入姓名',
@@ -533,11 +551,9 @@ import { navigateTo } from '@/utils/router';
                     });
                     return;
                 }
-
                 uni.showLoading({
                     title: '提交中...'
                 });
-
                 try {
                     // 1. 提交修改请求
                     await post('/api/v1/app_auth/bind', {
@@ -545,7 +561,6 @@ import { navigateTo } from '@/utils/router';
                         introduce: bio,
                         name: name
                     });
-
                     // 2. 获取最新用户信息
                     const res = await get('/api/v1/app_auth/mine');
                     if (res && res.success) {
@@ -553,12 +568,10 @@ import { navigateTo } from '@/utils/router';
                         uni.setStorageSync('userInfo', res.data);
                         this.updateUserInfo(res.data);
                         this.showEditModal = false;
-
                         uni.hideLoading();
                         uni.showToast({
                             title: '修改成功'
                         });
-
                     } else {
                         throw new Error(res.message || '获取用户信息失败');
                     }
@@ -571,13 +584,10 @@ import { navigateTo } from '@/utils/router';
                     console.error('修改失败:', err);
                 }
             },
-
             // 取消修改
             handleCancel() {
                 this.showEditModal = false;
             },
-
-			// 跳转页面
             // 跳转页面
             goPage(item) {
                 if (item.key === 6) { // 联系社区的特殊处理
@@ -588,19 +598,16 @@ import { navigateTo } from '@/utils/router';
                     this.handleEditClick(); // 调用编辑用户信息的方法
                     return;
                 }
-
+                if (!this.checkLogin()) {
-				// if (!this.checkLogin()) {
+                    this.showEditModal = true;
-				// 	this.showEditModal = true;
+                    return;
-				// 	return;
+                }
-				// }
-
                 if (item.pageUrl) {
-					navigateTo({
+                    uni.navigateTo({
                         url: `/pages/${item.pageUrl}/index`
-					},false);
+                    });
                 }
             },
-
             // 处理联系社区点击
             handleContactCommunity() {
                 if (!this.checkLogin()) {
@@ -620,7 +627,6 @@ import { navigateTo } from '@/utils/router';
                     }
                 });
             },
-
             // 拨打社区电话
             callCommunityPhone() {
                 uni.makePhoneCall({
@@ -638,7 +644,6 @@ import { navigateTo } from '@/utils/router';
                 });
                 this.showPhoneDialog = false;
             },
-
             // 检查登录状态
             checkLogin() {
                 const token = uni.getStorageSync('token');
@@ -663,29 +668,24 @@ import { navigateTo } from '@/utils/router';
         box-sizing: border-box;
         padding-bottom: 120rpx;
     }
-
     .user-info-card {
         background: #fff;
         border-radius: 16rpx;
         padding: 40rpx 30rpx;
         margin-bottom: 24rpx;
         box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.04);
-
         .user-info {
             display: flex;
             flex-direction: column;
             align-items: center;
         }
     }
-
     .avatar-section {
         margin-bottom: 20rpx;
-
         .avatar-wrapper {
             position: relative;
             width: 140rpx;
             height: 140rpx;
-
             .avatar {
                 width: 100%;
                 height: 100%;
@@ -693,7 +693,6 @@ import { navigateTo } from '@/utils/router';
                 border: 4rpx solid #fff;
                 box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.1);
             }
-
             .edit-icon {
                 position: absolute;
                 right: 0;
@@ -707,7 +706,6 @@ import { navigateTo } from '@/utils/router';
                 justify-content: center;
                 box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
             }
-
             .u-loading-icon {
                 position: absolute;
                 top: 0;
@@ -723,79 +721,66 @@ import { navigateTo } from '@/utils/router';
             }
         }
     }
-
     .name-section {
         width: 100%;
         align-items: center;
         text-align: center;
         margin-bottom: 30rpx;
-
         .name {
             font-size: 36rpx;
             font-weight: 600;
             color: #333;
         }
-
         .phone {
             color: #999;
             font-size: 24rpx;
         }
     }
-
     .description-card {
         background: #f8f9fa;
         border-radius: 12rpx;
         padding: 24rpx;
         width: 100%;
         text-align: center;
-
         .title {
             font-size: 28rpx;
             color: #666;
             margin-bottom: 12rpx;
             display: block;
         }
-
         .content {
             font-size: 26rpx;
             color: #999;
             line-height: 1.5;
         }
     }
-
     .function-card {
         background: #fff;
         border-radius: 16rpx;
         padding: 0 30rpx;
         box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.04);
-
         .button-item {
             display: flex;
             align-items: center;
             justify-content: space-between;
             padding: 28rpx 0;
             border-bottom: 1rpx solid #f2f3f5;
-
             &:active {
                 background-color: #f8f8f8;
             }
-
             &:last-child {
                 border-bottom: none;
             }
-
             .button-content {
                 display: flex;
                 align-items: center;
                 flex: 1;
             }
-
             .icon {
                 width: 48rpx;
                 height: 48rpx;
                 margin-right: 24rpx;
             }
-
             .label {
                 font-size: 30rpx;
                 color: #333;
@@ -803,21 +788,17 @@ import { navigateTo } from '@/utils/router';
             }
         }
     }
-
     .modal-content {
         padding: 0 30rpx;
         width: 90%;
         margin: 0 auto;
         max-height: 70vh;
         overflow-y: auto;
-
         /* 编辑表单区域 */
         .edit-section {
             padding: 20rpx 0;
-
             .form-item {
                 margin-bottom: 40rpx;
-
                 .form-label {
                     display: block;
                     font-size: 28rpx;
@@ -825,14 +806,12 @@ import { navigateTo } from '@/utils/router';
                     margin-bottom: 16rpx;
                     font-weight: 500;
                 }
-
                 .upload-tip {
                     font-size: 24rpx;
                     color: #999;
                     margin-top: 10rpx;
                     text-align: center;
                 }
-
                 .word-count {
                     text-align: right;
                     font-size: 24rpx;
@@ -840,31 +819,13 @@ import { navigateTo } from '@/utils/router';
                     margin-top: 10rpx;
                 }
             }
-
-			/* 自定义删除按钮样式 */
-			.custom-delete {
-				position: absolute;
-				top: -10rpx;
-				right: -10rpx;
-				width: 40rpx;
-				height: 40rpx;
-				background: #f56c6c;
-				border-radius: 50%;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				z-index: 10;
-				box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
         }
-		}
-
         /* 授权登录区域 */
         .auth-section {
             display: flex;
             flex-direction: column;
             align-items: center;
             padding: 40rpx 0;
-
             .auth-title {
                 font-size: 32rpx;
                 color: #333;
@@ -872,7 +833,6 @@ import { navigateTo } from '@/utils/router';
                 text-align: center;
                 font-weight: 500;
             }
-
             .auth-button {
                 width: 100%;
                 height: 90rpx;
@@ -887,20 +847,16 @@ import { navigateTo } from '@/utils/router';
                 justify-content: center;
                 position: relative;
                 box-shadow: 0 4rpx 12rpx rgba(7, 193, 96, 0.3);
-
                 &::after {
                     border: none;
                 }
-
                 &.phone-button {
                     background: #2979ff;
                     box-shadow: 0 4rpx 12rpx rgba(41, 121, 255, 0.3);
                 }
-
                 &:active {
                     opacity: 0.9;
                 }
-
                 .wechat-icon,
                 .phone-icon {
                     width: 40rpx;
@@ -908,7 +864,6 @@ import { navigateTo } from '@/utils/router';
                     margin-right: 15rpx;
                 }
             }
-
             .auth-tip {
                 font-size: 24rpx;
                 color: #999;
@@ -916,12 +871,10 @@ import { navigateTo } from '@/utils/router';
                 text-align: center;
             }
         }
-
         .phone-dialog-content {
             padding: 40rpx;
             text-align: center;
             font-size: 32rpx;
-
             .phone-number {
                 font-weight: bold;
                 color: #2979ff;
@@ -929,4 +882,61 @@ import { navigateTo } from '@/utils/router';
             }
         }
     }
+    
+    // 头像上传容器
+    .avatar-upload-container {
+        width: 160rpx;
+        height: 160rpx;
+        margin: 0 auto;
+        position: relative;
+        border-radius: 8rpx;
+        overflow: hidden;
+    }
+    
+    // 头像预览区域
+    .avatar-preview {
+        width: 100%;
+        height: 100%;
+        position: relative;
+        border-radius: 8rpx;
+        overflow: hidden;
+        background-color: #f5f7fa;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        
+        .avatar-img {
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+        }
+        
+        .avatar-placeholder {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            color: #c0c4cc;
+            
+            .placeholder-text {
+                font-size: 24rpx;
+                margin-top: 10rpx;
+            }
+        }
+        
+        .avatar-delete {
+            position: absolute;
+            top: -10rpx;
+            right: -10rpx;
+            width: 40rpx;
+            height: 40rpx;
+            background-color: #f56c6c;
+            border-radius: 50%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            z-index: 10;
+            box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
+        }
+    }
 </style>

pages/myTickets/index.vue

@@ -42,7 +42,7 @@
 						 <view class="date">{{ formatTime(order.createdAt,"YYYY-MM-DD") }}</view>
 					</view>
 					<view class="order-description">{{ order.title }}</view>
-					<button @click="handleAction(order)" class="order-action" v-if="order.status == 1 || order.status == 2 || order.status == 99">撤回</button>
+					<button @click.stop="handleAction(order, $event)" class="order-action" v-if="order.status == 1 || order.status == 2 || order.status == 99">撤回</button>
 				</view>
 			</view>
 			<!-- 空状态提示 -->
@@ -73,7 +73,7 @@
 <script>
 	// import Header from '@/components/header_common.vue';
 	import Footer from '@/components/footer_common.vue';
-	import { get, post } from '@/utils/request';
+	import { get, post,put } from '@/utils/request';
 	import { IMAGE_BASE_URL,BASE_URL } from '@/utils/config';
 	import { formatTime, formatRelativeTime } from '@/utils/timeFormat';
 	export default {
@@ -116,7 +116,7 @@
 					2: '进行中',
 					3: '已完成',
 					99:'驳回',
-					98:'已删除'
+					98:'已撤回'
 				};
 				return statusMap[status] || '未知状态';
 			},
@@ -153,20 +153,39 @@
 				uni.navigateTo({ url: '/pages/serviceTickets/index' });
 			},
 			// 工单操作处理
-			handleAction(order) {
+			handleAction(order, e) {
-				if (order.actionText === '撤回') {
+			  // 阻止事件冒泡
+			  e.stopPropagation();
+			  
+			  if (order.status == 1 || order.status == 2 || order.status == 99) {
 			    uni.showModal({
 			      title: '提示',
 			      content: '确定要撤回这个工单吗？',
 			      success: (res) => {
 			        if (res.confirm) {
 			          // 执行撤回逻辑
+			          this.withdrawOrder(order.id);
+			        }
+			      }
+			    });
+			  }
+			},
+			async withdrawOrder(orderId) {
+			  try {
+			   const res = await put(`/api/v1/app_auth/work-order/${orderId}`, {status:98});
+			    if (res?.success) {
 			      uni.showToast({
 			        title: '工单已撤回',
 			        icon: 'success'
 			      });
+			      // 刷新列表
+			      this.getWorkOrderList();
 			    }
-						}
+			  } catch (err) {
+			    console.error('撤回工单失败:', err);
+			    uni.showToast({
+			      title: '撤回失败',
+			      icon: 'none'
 			    });
 			  }
 			},

pages/myTicketsDetail/index.vue

@@ -1,22 +1,5 @@
 <template>
 	<view class="work-order-detail">
-		
-		<!-- 图片区域 - 编辑状态下可修改 -->
-		<view class="image-area card">
-			<view class="img-container">
-				<image 
-					class="work-order-img" 
-					:src="!isEditing ? `${IMAGE_BASE_URL}${detailObj.images[0] || ''}` : workOrderImg" 
-					mode="widthFix"
-					:lazy-load="true"
-				></image>
-				<view class="upload-btn" @click="uploadImage" v-if="isEditing">
-					<u-icon name="camera" size="28" color="#fff"></u-icon>
-					<text class="upload-text">更换图片</text>
-				</view>
-			</view>
-		</view>
-		
 		<!-- 标题与日期 -->
 		<view class="title-area card">
 			<view class="title-wrap">
@@ -31,7 +14,6 @@
 		<view class="content card">
 			<view class="label">
 				<view class="label-name">
-					<!-- <u-icon name="map-marker" size="24" color="#409EFF"></u-icon> -->
 					<text>工单地点：</text>
 				</view>
 				<text v-if="!isEditing" style="font-weight: normal;" :class="{empty: !detailObj.address}">{{detailObj.address || '未填写'}}</text>
@@ -39,7 +21,6 @@
 			</view>
 			<view class="label">
 				<view class="label-name">
-					<!-- <u-icon name="user" size="24" color="#409EFF"></u-icon> -->
 					<text>联系人：</text>
 				</view>
 				<text v-if="!isEditing" style="font-weight: normal;" :class="{empty: !detailObj.concatName}">{{detailObj.concatName || '未填写'}}</text>
@@ -47,7 +28,6 @@
 			</view>
 			<view class="label">
 				<view class="label-name">
-					<!-- <u-icon name="phone" size="24" color="#409EFF"></u-icon> -->
 					<text>联系电话：</text>
 				</view>
 				<text v-if="!isEditing" style="font-weight: normal;" :class="{empty: !detailObj.customerPhone}">{{detailObj.customerPhone || '未填写'}}</text>
@@ -55,7 +35,6 @@
 			</view>
 			<view class="label label-content">
 				<view class="label-name">
-					<!-- <u-icon name="file-text" size="24" color="#409EFF"></u-icon> -->
 					<text>工单内容：</text>
 				</view>
 				<text v-if="!isEditing" style="font-weight: normal; white-space: pre-line;" :class="{empty: !detailObj.title}">{{detailObj.title || '未填写'}}</text>
@@ -68,6 +47,65 @@
 				/>
 			</view>
 		</view>
+		<!-- 图片区域 - 支持多张展示和编辑 -->
+		<view class="image-area card">
+		  <view class="img-container">
+		    <!-- 非编辑状态显示服务器图片 -->
+		    <scroll-view 
+		      class="image-scroll" 
+		      scroll-x="true" 
+		      v-if="!isEditing && detailObj.images && detailObj.images.length > 0"
+		    >
+		      <view class="image-list">
+		        <image 
+		          class="work-order-img" 
+		          v-for="(img, index) in detailObj.images" 
+		          :key="index"
+		          :src="`${IMAGE_BASE_URL}${img}`" 
+		          mode="aspectFill"
+		          lazy-load="true"
+		          @click="previewImage(index)"
+		        ></image>
+		      </view>
+		    </scroll-view>
+		    
+		    <!-- 编辑状态显示本地选择的图片 -->
+		    <scroll-view 
+		      class="image-scroll" 
+		      scroll-x="true" 
+		      v-if="isEditing && localImages.length > 0"
+		    >
+		      <view class="image-list">
+		        <view class="image-item" v-for="(img, index) in localImages" :key="index">
+		          <image 
+		            class="work-order-img" 
+		            :src="img" 
+		            mode="aspectFill"
+		            lazy-load="true"
+		          ></image>
+		          <view class="delete-btn" @click="removeImage(index)">
+		            <u-icon name="close" size="20" color="#fff"></u-icon>
+		          </view>
+		        </view>
+		      </view>
+		    </scroll-view>
+		    
+		    <!-- 没有图片时的占位 -->
+		    <view class="empty-placeholder" v-if="(!detailObj.images || detailObj.images.length === 0) && !isEditing">
+		      <u-icon name="photo" size="48" color="#c0c4cc"></u-icon>
+		      <text class="empty-text">暂无图片</text>
+		    </view>
+		    
+		    <!-- 编辑状态的上传按钮 -->
+		    <view class="upload-btn-container" v-if="isEditing">
+		      <view class="upload-btn" @click="uploadImage">
+		        <u-icon name="camera" size="28" color="#fff"></u-icon>
+		        <text class="upload-text">{{ localImages.length > 0 ? '添加更多' : '上传图片' }}</text>
+		      </view>
+		      <text class="upload-tip" v-if="localImages.length > 0">最多可上传9张</text>
+		    </view>
+		  </view>
+		</view>
 		
 		<!-- 操作按钮 -->
 		<view class="btn-group">
@@ -105,44 +143,85 @@
 				formatTime,
 				isEditing: false,  // 编辑状态
 				isLoading: false,  // 加载状态
-				workOrderImg: '',  // 编辑时的图片
+				localImages: [],   // 本地选择的图片数组
 				// 编辑状态下的临时数据
 				editLabel: '',
 				editAddress: '',
 				editTitle: '',
-				editContactName: '', // 新增：联系人
+				editContactName: '',
-				editContactPhone: '', // 新增：联系电话
+				editContactPhone: '',
 				detailObj: {},
-				tempImagePath: ''  // 临时存储上传的图片路径
+				tempImagePaths: []  // 临时存储上传的图片路径
 			};
 		},
 		mounted() {
 			let obj = uni.getStorageSync("Detail");
 			this.detailObj = {...obj};
-			this.workOrderImg = `${IMAGE_BASE_URL}${this.detailObj.images[0]}`;
+			// 初始化本地图片数组
+			if (this.detailObj.images && this.detailObj.images.length > 0) {
+				this.localImages = this.detailObj.images.map(img => `${IMAGE_BASE_URL}${img}`);
+			}
 			// 初始化新增字段
 			this.editContactName = this.detailObj.concatName || '';
 			this.editContactPhone = this.detailObj.customerPhone || '';
 		},
 		methods: {
-			// 上传图片到服务器
+			// 预览图片
-			uploadImage() {
+			previewImage(index) {
-				uni.chooseImage({
+				uni.previewImage({
-					count: 1,
+					current: index,
-					success: async (res) => {
+					urls: this.detailObj.images.map(img => `${IMAGE_BASE_URL}${img}`)
-						const tempFilePaths = res.tempFilePaths[0];
-						this.tempImagePath = tempFilePaths;
-						this.workOrderImg = tempFilePaths;
-						uni.showToast({
-							title: '图片已更换',
-							icon: 'success'
 				});
+			},
+			
+			// 上传图片
+			uploadImage() {
+				const maxCount = 9 - this.localImages.length;
+				if (maxCount <= 0) {
+					uni.showToast({
+						title: '最多只能上传9张图片',
+						icon: 'none'
+					});
+					return;
+				}
+				
+				uni.chooseImage({
+					count: maxCount,
+					sizeType: ['original', 'compressed'],
+					sourceType: ['album', 'camera'],
+					success: (res) => {
+						this.tempImagePaths = [...this.tempImagePaths, ...res.tempFilePaths];
+						this.localImages = [...this.localImages, ...res.tempFilePaths];
 					}
 				});
 			},
 			
+			// 删除图片
+			removeImage(index) {
+				this.localImages.splice(index, 1);
+				// 如果是新上传的图片，也从tempImagePaths中移除
+				if (index >= this.localImages.length - this.tempImagePaths.length) {
+					this.tempImagePaths.splice(index - (this.localImages.length - this.tempImagePaths.length), 1);
+				}
+			},
+			
 			// 上传图片到服务器
-			async uploadImageToServer(filePath) {
+			async uploadImagesToServer() {
+				const uploadedPaths = [];
+				for (const filePath of this.tempImagePaths) {
+					try {
+						const path = await this.uploadSingleImage(filePath);
+						uploadedPaths.push(path);
+					} catch (error) {
+						console.error('图片上传失败:', error);
+						throw error;
+					}
+				}
+				return uploadedPaths;
+			},
+			
+			// 上传单张图片
+			uploadSingleImage(filePath) {
 				return new Promise((resolve, reject) => {
 					uni.uploadFile({
 						url: `${BASE_URL}/api/v1/upload`,
@@ -155,7 +234,7 @@
 							try {
 								const res = JSON.parse(uploadRes.data);
 								if (res && res.success) {
-									resolve(res.data); // 只返回路径部分
+									resolve(res.data);
 								} else {
 									reject(new Error(res.message || '上传失败'));
 								}
@@ -188,9 +267,16 @@
 						let images = this.detailObj.images;
 						
 						// 如果有新图片上传
-						if (this.tempImagePath) {
+						if (this.tempImagePaths.length > 0) {
-							const uploadedPath = await this.uploadImageToServer(this.tempImagePath);
+							const uploadedPaths = await this.uploadImagesToServer();
-							images = [uploadedPath]; // 替换为新的图片
+							// 合并原有图片和新上传的图片
+							const originalPaths = this.localImages
+								.filter(img => img.startsWith(IMAGE_BASE_URL))
+								.map(img => img.replace(IMAGE_BASE_URL, ''));
+							images = [...originalPaths, ...uploadedPaths];
+						} else if (this.localImages.length === 0) {
+							// 用户删除了所有图片
+							images = [];
 						}
 						
 						const requestData = {
@@ -199,8 +285,8 @@
 							title: this.editTitle,
 							images: images,
 							status: 1,
-							concatName: this.editContactName, // 新增：联系人
+							concatName: this.editContactName,
-							customerPhone: this.editContactPhone // 新增：联系电话
+							customerPhone: this.editContactPhone
 						};
 						
 						const res = await put(`/api/v1/app_auth/work-order/${this.detailObj.id}`, requestData);
@@ -218,7 +304,7 @@
 							});
 							
 							this.isEditing = false;
-							this.tempImagePath = ''; // 清空临时图片路径
+							this.tempImagePaths = []; // 清空临时图片路径
 						} else {
 							uni.showToast({
 								title: res.message || '修改失败',
@@ -240,9 +326,14 @@
 			// 撤回/取消操作
 			async handleWithdraw() {
 				if (this.isEditing) {
-					// 取消编辑状态，不发送请求
+					// 取消编辑状态，恢复原始数据
 					this.isEditing = false;
-					this.tempImagePath = '';
+					this.tempImagePaths = [];
+					if (this.detailObj.images && this.detailObj.images.length > 0) {
+						this.localImages = this.detailObj.images.map(img => `${IMAGE_BASE_URL}${img}`);
+					} else {
+						this.localImages = [];
+					}
 					return;
 				}
 				
@@ -267,7 +358,7 @@
 
 <style lang="scss" scoped>
 	/* 基础变量优化 */
-	$primary-color: #409EFF; // 更舒适的蓝色
+	$primary-color: #409EFF;
 	$success-color: #67C23A;
 	$warning-color: #F56C6C;
 	$text-color: #303133;
@@ -299,87 +390,6 @@
 		}
 	}
 	
-	/* 页面容器 */
-	.work-order-detail {
-		background-color: $bg-color;
-		min-height: 100vh;
-		padding: 0 30rpx 40rpx;
-	}
-	
-	/* 导航栏 */
-	.navbar {
-		@include flex-center;
-		height: 100rpx;
-		width: 100%;
-		padding: 0 10rpx;
-		background: $card-bg;
-		border-bottom: 1px solid $border-color;
-		position: sticky;
-		top: 0;
-		z-index: 10;
-		margin-bottom: 24rpx;
-		
-		.nav-title {
-			font-size: 36rpx;
-			color: $text-color;
-			font-weight: 500;
-			flex: 1;
-			text-align: center;
-			margin-left: -36rpx; // 抵消图标宽度
-		}
-	}
-	
-	/* 头部用户信息 */
-	.header {
-		@include card;
-		display: flex;
-		align-items: center;
-		padding: 24rpx 30rpx;
-		
-		.avatar {
-			width: 100rpx;
-			height: 100rpx;
-			border-radius: 50%;
-			background-color: $bg-color;
-			border: 2rpx solid #F0F2F5;
-		}
-		
-		.user-info {
-			margin-left: 24rpx;
-			flex: 1;
-		}
-		
-		.user-name-wrap {
-			@include flex-center;
-			margin-bottom: 8rpx;
-		}
-		
-		.username {
-			font-size: 34rpx;
-			color: $text-color;
-			font-weight: 500;
-		}
-		
-		.status-tag {
-			margin-left: 12rpx;
-			height: 40rpx;
-			line-height: 40rpx;
-		}
-		
-		.contact-info {
-			@include flex-center;
-			font-size: 28rpx;
-		}
-		
-		.info-icon {
-			margin-right: 6rpx;
-		}
-		
-		.user-phone {
-			color: $subtext-color;
-		}
-	}
-	
 	/* 图片区域优化 */
 	.image-area {
 		@include card;
@@ -391,37 +401,76 @@
 			border-radius: 8rpx;
 			overflow: hidden;
 			background-color: $bg-color;
+			min-height: 200rpx;
+		}
+		
+		.image-scroll {
+			width: 100%;
+			white-space: nowrap;
+		}
+		
+		.image-list {
+			display: inline-flex;
+			gap: 16rpx;
+		}
+		
+		.image-item {
+			position: relative;
+			width: 200rpx;
+			height: 200rpx;
+			border-radius: 8rpx;
+			overflow: hidden;
 		}
 		
 		.work-order-img {
-			width: 100%;
+			width: 200rpx;
+			height: 200rpx;
 			border-radius: 8rpx;
-			transition: $transition;
-			// 加载占位效果
-			&:empty {
-				height: 300rpx;
-				background-color: $bg-color;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				color: $light-text;
 		}
+		
+		.delete-btn {
+			position: absolute;
+			right: 8rpx;
+			top: 8rpx;
+			width: 36rpx;
+			height: 36rpx;
+			background: rgba(0, 0, 0, 0.5);
+			border-radius: 50%;
+			@include flex-center;
+			justify-content: center;
+		}
+		
+		.empty-placeholder {
+			width: 100%;
+			height: 300rpx;
+			display: flex;
+			flex-direction: column;
+			justify-content: center;
+			align-items: center;
+			background-color: #f5f7fa;
+			border-radius: 8rpx;
+			
+			.empty-text {
+				margin-top: 16rpx;
+				font-size: 28rpx;
+				color: #909399;
+			}
+		}
+		
+		.upload-btn-container {
+			margin-top: 20rpx;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			gap: 10rpx;
 		}
 		
 		.upload-btn {
-			position: absolute;
+			background: $primary-color;
-			right: 16rpx;
+			padding: 12rpx 24rpx;
-			bottom: 16rpx;
-			background: rgba(0, 0, 0, 0.5);
-			padding: 8rpx 16rpx;
 			border-radius: 24rpx;
 			@include flex-center;
 			transition: $transition;
-			cursor: pointer;
-			
-			&:hover {
-				background: rgba(0, 0, 0, 0.7);
-			}
 			
 			.upload-text {
 				color: #fff;
@@ -429,9 +478,20 @@
 				margin-left: 6rpx;
 			}
 		}
+		
+		.upload-tip {
+			font-size: 24rpx;
+			color: $light-text;
+		}
+	}
+	
+	/* 其他样式保持不变 */
+	.work-order-detail {
+		background-color: $bg-color;
+		min-height: 100vh;
+		padding: 0 30rpx 40rpx;
 	}
 	
-	/* 标题区域优化 */
 	.title-area {
 		@include card;
 		display: flex;
@@ -443,11 +503,6 @@
 			width: 100%;
 		}
 		
-		.title-icon {
-			margin-right: 12rpx;
-			flex-shrink: 0;
-		}
-		
 		.title {
 			font-size: 34rpx;
 			color: $text-color;
@@ -461,17 +516,12 @@
 			padding-top: 4rpx;
 		}
 		
-		.date-icon {
-			margin-right: 6rpx;
-		}
-		
 		.date {
 			font-size: 26rpx;
 			color: $light-text;
 		}
 	}
 	
-	/* 内容区域优化 */
 	.content {
 		@include card;
 		
@@ -498,10 +548,6 @@
 				flex-shrink: 0;
 			}
 			
-			.label-name u-icon {
-				margin-right: 8rpx;
-			}
-			
 			& > text {
 				font-size: 28rpx;
 				color: $text-color;
@@ -549,7 +595,6 @@
 		}
 	}
 	
-	/* 按钮区域优化 */
 	.btn-group {
 		display: flex;
 		gap: 24rpx;
@@ -574,28 +619,4 @@
 			}
 		}
 	}
-	
-	/* 适配小屏幕 */
-	@media (max-width: 375px) {
-		$font-base: 28rpx;
-		
-		.header {
-			padding: 18rpx;
-			
-			.avatar {
-				width: 80rpx;
-				height: 80rpx;
-			}
-		}
-		
-		.btn-group {
-			padding: 20rpx 5rpx;
-			
-			.action-btn {
-				height: 80rpx;
-				line-height: 80rpx;
-				font-size: 28rpx;
-			}
-		}
-	}
 </style>

pages/serviceTickets/index.vue

@@ -11,11 +11,7 @@
             <u-icon name="arrow-down" color="#999" size="30"></u-icon>
           </view>
         </view>
-				<u-picker 
+        <u-picker :show="showTypeSelect" :columns="areaList" keyName="title" @confirm="handleTypeConfirm"
-				     :show="showTypeSelect" 
-					 :columns="areaList" 
-					 keyName="title"
-					 @confirm="handleTypeConfirm"
           @cancel="showTypeSelect = false">
         </u-picker>
       </view>
@@ -35,7 +31,6 @@
         </u-picker>
       </view>
 
-			
       <view class="form-item">
         <view class="label">
           <u-icon name="order" color="#3B8CFF" size="38"></u-icon>
@@ -65,21 +60,29 @@
         </view>
       </view>
 
-			<!-- 上传照片/视频 -->
+      <!-- 上传照片/视频 - 完全重写的上传组件 -->
       <view class="form-item">
         <view class="label">
           <u-icon name="photo" color="#3B8CFF" size="38"></u-icon>
           上传照片/视频
         </view>
         <view class="upload-area">
-					<u-upload :fileList="fileList" @afterRead="handleAfterRead" @delete="handleDelete" :maxCount="8"
+          <view class="upload-list">
-						width="160" height="160" accept="image/*,video/*" :previewFullImage="true">
+            <view class="upload-item" v-for="(item, index) in fileList" :key="index">
-					</u-upload>
+              <image v-if="!item.isVideo" :src="item.url" mode="aspectFill" @click="previewImage(index)"></image>
+              <video v-else :src="item.url" controls></video>
+              <view class="delete-btn" @click="handleDelete(index)">
+                <u-icon name="close" color="#fff" size="24"></u-icon>
+              </view>
+            </view>
+            <view class="upload-btn" @click="showUploadAction" v-if="fileList.length < 8">
+              <u-icon name="plus" size="40" color="#c0c4cc"></u-icon>
+            </view>
+          </view>
         </view>
         <text class="note">注：照片可识别工单内容，支持分批上传，但最大数量为8</text>
       </view>
 
-			
       <!-- 工单地点 -->
       <view class="form-item">
         <view class="label">
@@ -95,42 +98,52 @@
       </view>
     </view>
     <Footer></Footer>
+
+    <!-- 上传操作菜单 -->
+    <u-action-sheet 
+      :list="actionList" 
+      v-model="showActionSheet" 
+      @click="handleActionClick"
+    ></u-action-sheet>
   </view>
 </template>
 
 <script>
-	import Footer from '@/components/footer_common.vue';
+import Footer from '@/components/footer_common.vue';
-	import {
+import { get, post } from '@/utils/request';
-		get,
+import { IMAGE_BASE_URL, BASE_URL } from '@/utils/config';
-		post
+import uActionSheet from 'uview-ui/components/u-action-sheet/u-action-sheet';
-	} from '@/utils/request';
+
-	import {
+export default {
-		IMAGE_BASE_URL,
-		BASE_URL
-	} from '@/utils/config';
-	export default {
   components: {
-			Footer
+    Footer,uActionSheet
   },
   data() {
     return {
       workOrderContent: '',
-				concatName: '',  // 新增联系人姓名字段
+      concatName: '',
-				customerPhone: '',  // 新增联系人电话字段
+      customerPhone: '',
       fileList: [],
       workOrderCategory: '',
       workOrderCategoryID: '',
-				workOrderArea:'',
+      workOrderArea: '',
-				workOrderAreaID:'',
+      workOrderAreaID: '',
       showSelect: false,
-				showTypeSelect:false,
+      showTypeSelect: false,
       categoryList: [],
       workOrderLocation: '',
       expectedTime: '',
       uploadedImages: [],
       uploadedVideos: [],
       videoFormats: ['mp4', 'mov', 'avi', 'wmv', 'mpeg', '3gp', 'flv', 'mkv'],
-				areaList:[],
+      areaList: [],
+      
+      // 上传相关
+      showActionSheet: false,
+      actionList: [
+        { text: '拍照', value: 'camera' },
+        { text: '从相册选择', value: 'album' }
+      ]
     };
   },
   mounted() {
@@ -138,129 +151,206 @@
     this.getOrderTypeList();
   },
   methods: {
-			handleBack() {
+    // 显示上传选项
-				uni.navigateBack({
+    showUploadAction() {
-					delta: 1
+      uni.showActionSheet({
+        itemList: ['拍照', '从相册选择'],
+        success: (res) => {
+          if (res.tapIndex === 0) {
+            this.chooseMedia('camera');
+          } else {
+            this.chooseMedia('album');
+          }
+        }
       });
     },
     
-			// 文件上传相关方法
+    // 处理上传选项选择
-			handleAfterRead(event) {
+    handleActionClick(index) {
-				const {
+      const action = this.actionList[index].value;
-					file
+      if (action === 'camera') {
-				} = event;
+        this.chooseMedia('camera');
-				let files = [].concat(file);
+      } else {
+        this.chooseMedia('album');
+      }
+    },
     
-				if (this.fileList.length + files.length > 8) {
+    // 选择媒体文件
-					uni.showToast({
+	async chooseMedia(sourceType) {
-						title: '最多只能上传8个文件',
+	  try {
-						icon: 'none'
+	    // 1. 选择图片
+	    const res = await new Promise((resolve, reject) => {
+	      uni.chooseImage({
+	        count: 8 - this.fileList.length,
+	        sourceType: [sourceType === 'camera' ? 'camera' : 'album'],
+	        success: resolve,
+	        fail: reject
 	      });
-					return;
+	    });
+	    
+	    // 2. 添加到预览列表
+	    const newFiles = res.tempFilePaths.map(url => ({
+	      url,
+	      isVideo: false,
+	      status: 'uploading'
+	    }));
+	    this.fileList = [...this.fileList, ...newFiles];
+	    
+	    // 3. 逐个上传文件
+	    for (const file of newFiles) {
+	      await this.uploadFile(file);
 	    }
 	    
-				files.forEach(item => {
+	  } catch (err) {
-					const extension = this.getFileExtension(item.url);
+	    console.error('选择图片失败:', err);
-					const isVideo = this.videoFormats.includes(extension.toLowerCase());
+	    uni.showToast({ title: '选择图片失败', icon: 'none' });
+	  }
+	},
+	_chooseMedia(sourceType) {
+	  uni.chooseMedia({
+	    count: 8 - this.fileList.length,
+	    mediaType: ['image', 'video'],
+	    sourceType: [sourceType],
+	    success: async (res) => {
+	      // 添加到预览列表
+	      const newFiles = res.tempFiles.map(file => ({
+	        url: file.tempFilePath,
+	        isVideo: file.fileType === 'video',
+	        status: 'uploading' // 新增上传状态
+	      }));
+	      this.fileList = [...this.fileList, ...newFiles];
 	      
-					this.fileList.push({
+	      // 逐个上传文件
-						...item,
+	      for (const file of newFiles) {
-						status: 'uploading',
+	        await this.uploadFile(file); // 等待上传完成
-						message: '上传中...',
+	      }
-						isVideo: isVideo
+	    }
-					});
-
-					this.uploadFile(item, isVideo);
 	  });
 	},
     
-			getFileExtension(filename) {
+    // 上传文件
-				return filename.split('.').pop().split('?')[0];
+    uploadFiles(files) {
-			},
+      files.forEach(file => {
-
+        this.uploadFile(file).then(res => {
-			handleDelete(event) {
+          const index = this.fileList.findIndex(item => item.url === file.url);
-				const {
+          if (index !== -1) {
-					index
+            this.$set(this.fileList, index, {
-				} = event;
+              ...file,
-				const file = this.fileList[index];
+              status: 'success',
+              serverUrl: res
+            });
             
             if (file.isVideo) {
-					const videoIndex = this.uploadedVideos.indexOf(file.url);
+              this.uploadedVideos.push(res.replace(BASE_URL, ''));
+            } else {
+              this.uploadedImages.push(res.replace(BASE_URL, ''));
+            }
+          }
+        }).catch(err => {
+          const index = this.fileList.findIndex(item => item.url === file.url);
+          if (index !== -1) {
+            this.$set(this.fileList, index, {
+              ...file,
+              status: 'failed'
+            });
+          }
+          console.error('上传失败:', err);
+        });
+      });
+    },
+    
+    // 单个文件上传
+	async uploadFile(file) {
+	  try {
+		const res = await new Promise((resolve, reject) => {
+		  uni.uploadFile({
+			url: `${BASE_URL}/api/v1/upload`,
+			filePath: file.url,
+			name: 'file',
+			header: { 
+			  'Authorization': `Bearer ${uni.getStorageSync('token')}`,
+			  'Content-Type': 'multipart/form-data'
+			},
+			success: (uploadRes) => {
+			  try {
+				const data = JSON.parse(uploadRes.data);
+				if (data.success) {
+				  resolve(data.data); // 使用服务器返回的完整URL
+				} else {
+				  reject(data.message || '上传失败');
+				}
+			  } catch (e) {
+				reject('解析响应失败');
+			  }
+			},
+			fail: (err) => reject(err)
+		  });
+		});
+
+		// 更新文件状态
+		const index = this.fileList.findIndex(f => f.url === file.url);
+		if (index !== -1) {
+		  this.$set(this.fileList, index, {
+			...file,
+			status: 'success',
+			serverUrl: res // 存储服务器返回的URL
+		  });
+		  
+		  // 添加到提交数组
+		  if (file.isVideo) {
+			this.uploadedVideos.push(res);
+		  } else {
+			this.uploadedImages.push(res);
+		  }
+		}
+		
+	  } catch (err) {
+		console.error('上传失败:', err);
+		const index = this.fileList.findIndex(f => f.url === file.url);
+		if (index !== -1) {
+		  this.$set(this.fileList, index, { 
+			...file, 
+			status: 'failed',
+			error: err.message || err 
+		  });
+		}
+		uni.showToast({ 
+		  title: `上传失败: ${err.message || err}`, 
+		  icon: 'none' 
+		});
+	  }
+	},
+    
+    // 预览图片
+    previewImage(index) {
+      const images = this.fileList
+        .filter(item => !item.isVideo)
+        .map(item => item.url);
+      
+      uni.previewImage({
+        current: index,
+        urls: images
+      });
+    },
+    
+    // 删除文件
+    handleDelete(index) {
+      const file = this.fileList[index];
+      
+      if (file.serverUrl) {
+        if (file.isVideo) {
+          const videoIndex = this.uploadedVideos.indexOf(file.serverUrl.replace(BASE_URL, ''));
           if (videoIndex !== -1) this.uploadedVideos.splice(videoIndex, 1);
         } else {
-					const imageIndex = this.uploadedImages.indexOf(file.url);
+          const imageIndex = this.uploadedImages.indexOf(file.serverUrl.replace(BASE_URL, ''));
           if (imageIndex !== -1) this.uploadedImages.splice(imageIndex, 1);
         }
+      }
       
       this.fileList.splice(index, 1);
     },
 
-			async uploadFile(file, isVideo) {
+    // 其他原有方法保持不变...
-				try {
-					const fullUrl = await this.uploadAvatar(file.url);
-					const relativePath = fullUrl.replace(BASE_URL, '');
-
-					const fileIndex = this.fileList.findIndex(item => item.url === file.url);
-					if (fileIndex !== -1) {
-						this.fileList[fileIndex] = {
-							...this.fileList[fileIndex],
-							status: 'success',
-							message: '上传成功',
-							url: fullUrl,
-							relativeUrl: relativePath,
-							isVideo: isVideo
-						};
-
-						if (isVideo) {
-							this.uploadedVideos.push(relativePath);
-						} else {
-							this.uploadedImages.push(relativePath);
-						}
-					}
-				} catch (error) {
-					const fileIndex = this.fileList.findIndex(item => item.url === file.url);
-					if (fileIndex !== -1) {
-						this.fileList[fileIndex] = {
-							...this.fileList[fileIndex],
-							status: 'failed',
-							message: '上传失败'
-						};
-					}
-					uni.showToast({
-						title: `${isVideo ? '视频' : '图片'}上传失败: ${error.message}`,
-						icon: 'none'
-					});
-				}
-			},
-
-			uploadAvatar(filePath) {
-				return new Promise((resolve, reject) => {
-					uni.uploadFile({
-						url: `${BASE_URL}/api/v1/upload`,
-						filePath: filePath,
-						name: 'file',
-						header: {
-							'Authorization': `Bearer ${uni.getStorageSync('token')}`
-						},
-						success: (uploadRes) => {
-							try {
-								const res = JSON.parse(uploadRes.data);
-								if (res && res.success) {
-									resolve(`${IMAGE_BASE_URL}${res.data}`);
-								} else {
-									reject(new Error(res.message || '上传失败'));
-								}
-							} catch (e) {
-								reject(new Error('解析响应失败'));
-							}
-						},
-						fail: (err) => {
-							reject(new Error('上传失败: ' + JSON.stringify(err)));
-						}
-					});
-				});
-			},
-
     async handleSubmit() {
       if (!this.workOrderContent) {
         uni.showToast({
@@ -304,10 +394,10 @@
 
       const submitData = {
         title: this.workOrderContent,
-					concatName: this.concatName,  // 新增联系人姓名
+        concatName: this.concatName,
-					customerPhone: this.customerPhone,  // 新增联系人电话
+        customerPhone: this.customerPhone,
         orderTypeId: this.workOrderCategoryID,
-					orderAreaId:this.workOrderAreaID,
+        orderAreaId: this.workOrderAreaID,
         address: this.workOrderLocation,
         images: this.uploadedImages,
         videos: this.uploadedVideos,
@@ -315,7 +405,6 @@
 
       console.log('提交数据:', submitData);
 
-				// 调用API保存信息
       const res = await post('/api/v1/app_auth/work-order', submitData);
 
       uni.hideLoading();
@@ -327,11 +416,11 @@
           duration: 2000
         });
         this.resetForm();
-					setTimeout(()=>{
+        setTimeout(() => {
           uni.navigateTo({
             url: `/pages/myTickets/index`,
           });
-					},1000)
+        }, 1000)
       } else {
         uni.showToast({
           title: res?.message || '提交失败',
@@ -387,8 +476,7 @@
       }
     },
 
-			// 获取工作区域
+    async getOrderTypeList() {
-			async getOrderTypeList(){
       try {
         const res = await get('/api/v1/apps/work-order-area');
         if (res?.success) {
@@ -405,11 +493,11 @@
       }
     }
   }
-	};
+};
 </script>
 
 <style lang="scss" scoped>
-	.container {
+.container {
   width: 100%;
   min-height: 100vh;
   background: #f5f7fa;
@@ -467,6 +555,47 @@
 
       .upload-area {
         margin-top: 16rpx;
+        
+        .upload-list {
+          display: flex;
+          flex-wrap: wrap;
+          margin: -5rpx;
+          
+          .upload-item, .upload-btn {
+            width: 160rpx;
+            height: 160rpx;
+            margin: 5rpx;
+            position: relative;
+            background: #f8f8f8;
+            border-radius: 8rpx;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            overflow: hidden;
+            
+            image, video {
+              width: 100%;
+              height: 100%;
+            }
+            
+            .delete-btn {
+              position: absolute;
+              right: 0;
+              top: 0;
+              width: 40rpx;
+              height: 40rpx;
+              background: rgba(0, 0, 0, 0.5);
+              border-radius: 0 0 0 8rpx;
+              display: flex;
+              justify-content: center;
+              align-items: center;
+            }
+          }
+          
+          .upload-btn {
+            border: 1rpx dashed #c0c4cc;
+          }
+        }
       }
 
       .note {
@@ -512,5 +641,5 @@
       }
     }
   }
-	}
+}
 </style>