feat: 上传图片的逻辑处理

src/components/CreateServiceOrder/index.vue

@@ -35,11 +35,25 @@
         >
           <view class="font-500 line-height-22 mb-12">需求信息描述</view>
           <textarea
+            class="h-80"
             placeholder="请输入需求信息描述"
+            placeholder-class="font-size-14 font-400"
             maxlength="100"
             v-model="contactText"
           />
         </view>
+
+        <view
+          class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12"
+        >
+          <view class="font-500 line-height-22 mb-12">照片上传</view>
+          <view
+            class="bg-white p-24 rounded-5 inline-block"
+            @click="handleChooseImage"
+          >
+            <uni-icons type="closeempty" size="24" color="#6A717F" />
+          </view>
+        </view>
       </view>
 
       <view v-else class="border-box card-content flex flex-items-center p-12">
@@ -76,6 +90,7 @@
 import { ref, onMounted, nextTick } from "vue";
 import { SCROLL_TO_BOTTOM } from "@/constant/constant";
 import { createWorkOrder } from "@/request/api/OrderApi";
+import { updateImageFile } from "@/request/api/UpdateFile";
 
 const workOrderTypeId = ref("");
 const roomId = ref("");
@@ -85,6 +100,35 @@ const contentImgUrl = ref("");
 const isCallSuccess = ref(false); // 呼叫成功状态
 const workOrderId = ref(0); // 工单ID
 
+// 处理图片上传
+const handleChooseImage = () => {
+  console.log("选择图片");
+  uni.chooseImage({
+    count: 1,
+    success: (res) => {
+      const file = res.tempFilePaths[0];
+      updateImagehandle(file);
+    },
+    fail: (err) => {
+      console.error("选择图片失败:", err);
+      uni.showToast({
+        title: "选择图片失败",
+        icon: "none",
+        duration: 2000,
+      });
+    },
+  });
+};
+
+const updateImagehandle = (file) => {
+  if (!file) {
+    return;
+  }
+  updateImageFile(file).then((res) => {
+    contentImgUrl.value = res.data?.url || "";
+  });
+};
+
 const handleCall = async () => {
   if (isCallSuccess.value) {
     // 查看工单

src/components/Feedback/index.vue

@@ -27,7 +27,9 @@
         >
           <view class="font-500 line-height-22 mb-12">意见内容</view>
           <textarea
+            class="h-80"
             placeholder="请输入反馈意见"
+            placeholder-class="font-size-14 font-400"
             maxlength="100"
             v-model="contactText"
           />

src/request/api/UpdateFile.js

@@ -0,0 +1,32 @@
+import { BASE_URL } from "@/request/base/baseUrl";
+import { getCurrentConfig } from "@/constant/base";
+
+export const updateImageFile = (file) => {
+  const url = BASE_URL + "/common/upload";
+  const token = uni.getStorageSync("token");
+  const clientId = getCurrentConfig().clientId;
+
+  return new Promise((resolve, reject) => {
+    uni.uploadFile({
+      url,
+      filePath: file,
+      name: "file",
+      header: {
+        "Content-Type": "multipart/form-data",
+        Authorization: `Bearer ${token}`,
+        clientId: clientId,
+      },
+      formData: {
+        file: "file",
+      },
+      success: (uploadFileRes) => {
+        console.log(uploadFileRes.data);
+        resolve(uploadFileRes.data);
+      },
+      fail: (err) => {
+        console.error("上传图片失败:", err);
+        reject(err);
+      },
+    });
+  });
+};

src/static/scss/height.scss

@@ -1,3 +1,7 @@
 .h-screen {
   height: 100vh;
 }
+
+.h-80 {
+  height: 80px;
+}

src/static/scss/padding.scss

@@ -99,6 +99,10 @@
   padding-bottom: 20px;
 }
 
+.p-24 {
+  padding: 24px;
+}
+
 .pb-safe-area {
   padding-bottom: Max(env(safe-area-inset-bottom), 12px);
 }

src/static/scss/rounded.scss

@@ -3,6 +3,10 @@
   border-radius: 4px;
 }
 
+.rounded-5 {
+  border-radius: 5px;
+}
+
 .rounded-6 {
   border-radius: 6px;
 }