feat: 意见反馈的实现

2025-09-06 11:34:48 +08:00
parent 613a2be148
commit d83cdba468
7 changed files with 250 additions and 17 deletions
--- a/components/Feedback/index.vue
+++ b/components/Feedback/index.vue
@@ -0,0 +1,140 @@
+<template>
+  <view class="create-service-order">
+    <view class="create-service-wrapper">
+      <view class="order-header">
+        <text>反馈意见</text>
+      </view>
+      <view class="order-content">
+        <view class="detail-item">
+          <text class="detail-label">联系电话：</text>
+          <input
+            v-if="!isCallSuccess"
+            class="detail-input"
+            placeholder="请填写联系电话"
+            v-model="contactPhone"
+          />
+          <text v-else class="detail-value">{{ contactPhone }}</text>
+        </view>
+        <view class="detail-item">
+          <text class="detail-label">意见内容：</text>
+          <textarea
+            v-if="!isCallSuccess"
+            class="detail-textarea"
+            placeholder="请输入反馈意见"
+            v-model="contactText"
+          />
+          <text v-else class="detail-value">{{ contactText }}</text>
+        </view>
+
+        <button
+          v-if="!isCallSuccess"
+          class="order-button submit-button"
+          @click="handleCall"
+        >
+          立即提交
+        </button>
+
+        <button v-else class="order-button look-button" @click="viewWorkOrder">
+          查看意见
+        </button>
+      </view>
+    </view>
+
+    <view class="footer-help">
+      <image src="./images/icon_volume.png" class="help-icon"></image>
+      <text class="help-text">朵朵收到您的意见将第一时间为您处理!</text>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, onMounted, nextTick } from "vue";
+import { SCROLL_TO_BOTTOM } from "@/constant/constant";
+import { createWorkOrder } from "@/request/api/OrderApi";
+const workOrderTypeId = ref("");
+const contactPhone = ref("");
+const contactText = ref("");
+const isCallSuccess = ref(false); // 呼叫成功状态
+const workOrderId = ref(0); // 工单ID
+
+const handleCall = async () => {
+  if (!contactPhone.value.trim()) {
+    uni.showToast({
+      title: "请填写联系电话",
+      icon: "none",
+      duration: 2000,
+    });
+    return;
+  }
+
+  if (!contactText.value.trim()) {
+    uni.showToast({
+      title: "请填写意见内容",
+      icon: "none",
+      duration: 2000,
+    });
+    return;
+  }
+
+  sendCreateWorkOrder();
+};
+
+/// 创建工单
+const sendCreateWorkOrder = async () => {
+  try {
+    const res = await createWorkOrder({
+      contactName: contactText.value,
+      contactPhone: contactPhone.value,
+      workOrderTypeId: workOrderTypeId.value,
+    });
+
+    if (res.code === 0) {
+      // 保存工单ID
+      workOrderId.value = res.data?.id || "";
+
+      // 设置呼叫成功状态
+      isCallSuccess.value = true;
+
+      uni.showToast({
+        title: "工单创建成功",
+        icon: "success",
+        duration: 2000,
+      });
+    } else {
+      uni.showToast({
+        title: res.message || "创建工单失败",
+        icon: "none",
+        duration: 2000,
+      });
+    }
+  } catch (error) {
+    console.error("创建工单失败:", error);
+    uni.showToast({
+      title: "网络错误，请重试",
+      icon: "none",
+      duration: 2000,
+    });
+  }
+};
+
+// 查看工单
+const viewWorkOrder = () => {
+  console.log("查看工单:", workOrderId.value);
+  // 这里可以跳转到工单详情页面
+  uni.navigateTo({
+    url: `/pages/order/list?id=${workOrderId.value}`,
+  });
+};
+
+onMounted(() => {
+  nextTick(() => {
+    setTimeout(() => {
+      uni.$emit(SCROLL_TO_BOTTOM, true);
+    }, 200);
+  });
+});
+</script>
+
+<style scoped lang="scss">
+@import "./styles/index.scss";
+</style>