feat: 工单服务数据回显

src/components/CreateServiceOrder/index.vue

@@ -27,7 +27,11 @@
           class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12"
         >
           <text class="font-500 line-height-22 mr-20">联系电话</text>
-          <input placeholder="请填写联系电话" v-model="contactPhone" />
+          <input
+            placeholder="请填写联系电话"
+            v-model="contactPhone"
+            @input="handleContactPhoneInput"
+          />
         </view>
 
         <view
@@ -115,19 +119,57 @@
 </template>
 
 <script setup>
-import { ref, onMounted, nextTick } from "vue";
+import { ref, computed, onMounted, nextTick, defineProps, watch } from "vue";
 import { SCROLL_TO_BOTTOM } from "@/constant/constant";
 import { createWorkOrder } from "@/request/api/WorkOrderApi";
 import { updateImageFile } from "@/request/api/UpdateFile";
 import { zniconsMap } from "@/static/fonts/znicons.js";
 
+const props = defineProps({
+  toolCall: {
+    type: Object,
+    default: () => ({}),
+  },
+});
 const workOrderTypeId = ref("");
 const roomId = ref("");
-const contactPhone = ref("");
-const contactText = ref("");
 const contentImgUrl = ref("");
 const isCallSuccess = ref(false); // 呼叫成功状态
 const workOrderId = ref(0); // 工单ID
+const toolResult = computed(() => {
+  if (props.toolCall?.toolResult) {
+    return JSON.parse(props.toolCall?.toolResult);
+  } else {
+    return {};
+  }
+});
+// 原始手机号（未脱敏）
+const originalPhone = ref("");
+// 展示与输入绑定的手机号（初始为脱敏）
+const contactPhone = ref("");
+// 是否用户已编辑过手机号（一旦编辑则不再脱敏）
+const hasEditedPhone = ref(false);
+
+// 手机号脱敏：138****1234（仅对11位数字进行处理）
+const maskPhone = (phone) => {
+  if (!phone) return "";
+  return String(phone).replace(/(\d{3})\d{4}(\d{4})/, "$1****$2");
+};
+
+// 监听工具返回结果，初始化原始与脱敏显示
+watch(
+  toolResult,
+  (val) => {
+    originalPhone.value = val?.userPhone || "";
+    hasEditedPhone.value = false;
+    contactPhone.value = maskPhone(originalPhone.value);
+  },
+  { immediate: true }
+);
+const contactText = computed({
+  get: () => toolResult.value?.callServiceContent || "",
+  set: (val) => (contactText.value = val),
+});
 
 // 处理图片上传
 const handleChooseImage = () => {
@@ -143,6 +185,11 @@ const handleChooseImage = () => {
   });
 };
 
+// 标记用户已编辑手机号
+const handleContactPhoneInput = () => {
+  hasEditedPhone.value = true;
+};
+
 const handleDeleteImage = () => {
   contentImgUrl.value = "";
 };
@@ -168,7 +215,10 @@ const handleCall = async () => {
     return;
   }
 
-  if (!contactPhone.value.trim()) {
+  const phoneToSubmit = hasEditedPhone.value
+    ? contactPhone.value
+    : originalPhone.value;
+  if (!phoneToSubmit.trim()) {
     uni.showToast({ title: "请填写联系电话", icon: "none" });
     return;
   }
@@ -178,19 +228,22 @@ const handleCall = async () => {
     return;
   }
 
-  sendCreateWorkOrder();
+  sendCreateWorkOrder(phoneToSubmit);
 };
 
 /// 创建工单
-const sendCreateWorkOrder = async () => {
+const sendCreateWorkOrder = async (phoneToSubmit) => {
   try {
-    const res = await createWorkOrder({
+    const params = {
       workOrderTypeId: workOrderTypeId.value,
       roomNo: roomId.value,
-      userPhone: contactPhone.value,
+      userPhone: phoneToSubmit,
       content: contactText.value,
       contentImgUrl: contentImgUrl.value,
-    });
+    };
+    console.log("🚀 ~ sendCreateWorkOrder ~ params:", params);
+
+    const res = await createWorkOrder(params);
 
     if (res.code === 0) {
       // 保存工单ID

src/pages/index/components/chat/ChatMainList/index.vue

@@ -46,6 +46,7 @@
                 v-else-if="
                   item.toolCall.componentName === CompName.callServiceCard
                 "
+                :toolCall="item.toolCall"
               />
               <Feedback
                 v-else-if="