Ver código fonte

chore: 调整问题详情调试弹窗展示位置

移除首页的接口 JSON 调试弹窗,并在问题详情页增加查看详情接口完整 JSON 的弹窗,便于直接核对返回字段。

Made-with: Cursor
haifeng.zhang 6 dias atrás
pai
commit
bd69820a28
2 arquivos alterados com 53 adições e 45 exclusões
  1. 0 43
      src/pages/home/index.vue
  2. 53 2
      src/subPages/pages/reportProblems/detail.vue

+ 0 - 43
src/pages/home/index.vue

@@ -34,8 +34,6 @@ const stripOAuthCodeFromUrl = () => {
 const externalUserid = ref('');
 const unionidValue = ref('');
 const ownerId = ref('');
-const internalUserGetPopupVisible = ref(false);
-const internalUserGetJsonText = ref('');
 
 const applyVisitorFromSyncResult = (result: Awaited<ReturnType<typeof syncExternalVisitorProfile>>) => {
   externalUserid.value = result.externalUserId
@@ -86,10 +84,6 @@ const bootstrapWithCode = async (code: string) => {
     throw new Error('identity incomplete')
   }
   applyVisitorFromSyncResult(result)
-  if (result.internalUserRaw) {
-    internalUserGetJsonText.value = JSON.stringify(result.internalUserRaw, null, 2)
-    internalUserGetPopupVisible.value = true
-  }
 }
 
 const cacheLooksUsable = (cached: WecomVisitorProfile | null): cached is WecomVisitorProfile =>
@@ -158,12 +152,6 @@ const getQuestionPage = () => {
     </view>
     <img class="box_bg_bottom" src="@/assets/bg_bottom.png" alt="" srcset="">
 
-    <van-popup v-model:show="internalUserGetPopupVisible" round closeable class="user-get-popup">
-      <view class="user-get-popup__header">getuserdetail 返回</view>
-      <scroll-view scroll-y class="user-get-popup__content">
-        <text selectable class="user-get-popup__json">{{ internalUserGetJsonText }}</text>
-      </scroll-view>
-    </van-popup>
   </view>
 
 </template>
@@ -250,35 +238,4 @@ const getQuestionPage = () => {
   }
 }
 
-.user-get-popup {
-  width: 88vw;
-  max-height: 75vh;
-  padding: 20px 16px 16px;
-  box-sizing: border-box;
-
-  &__header {
-    margin-bottom: 12px;
-    padding-right: 24px;
-    font-size: 16px;
-    font-weight: 600;
-    color: #333;
-  }
-
-  &__content {
-    max-height: 60vh;
-    background: #f7f8fa;
-    border-radius: 8px;
-    padding: 12px;
-    box-sizing: border-box;
-  }
-
-  &__json {
-    display: block;
-    white-space: pre-wrap;
-    word-break: break-all;
-    font-size: 12px;
-    line-height: 1.6;
-    color: #333;
-  }
-}
 </style>

+ 53 - 2
src/subPages/pages/reportProblems/detail.vue

@@ -14,6 +14,7 @@ import { computed, ref } from 'vue';
 
 
 const questDetail = ref<QuestionDetailRes>()
+const showRawJsonPopup = ref(false)
 
 const statusText = computed(() => {
   const status = questDetail.value?.status
@@ -30,6 +31,11 @@ const personListText = computed(() => {
     .filter(Boolean)
     .join('、')
 })
+
+const detailRawJson = computed(() => {
+  if (!questDetail.value) return '{}'
+  return JSON.stringify(questDetail.value, null, 2)
+})
 onLoad(async (option) => {
   if (option && option.id) {
     const { id } = option;
@@ -41,6 +47,9 @@ onLoad(async (option) => {
 
 <template>
   <view class="p-[20px]">
+    <view class="mb-[8px]">
+      <van-button size="small" plain type="primary" @click="showRawJsonPopup = true">查看接口原始JSON</van-button>
+    </view>
     <view class="form-item">
       <view class="label">类型:</view>
       <view class="flex value">
@@ -51,10 +60,10 @@ onLoad(async (option) => {
       </view>
     </view>
     <!-- 问题标题 -->
-    <!-- <view class="form-item">
+    <view class="form-item">
       <view class="label">标题:</view>
       <view class="value">{{ questDetail?.questionTitle }}</view>
-    </view> -->
+    </view>
     <!-- 问题内容 -->
     <view class="form-item">
       <view class="label">内容:</view>
@@ -91,6 +100,20 @@ onLoad(async (option) => {
       <view class="value" v-if="questDetail?.questionAnswer">{{ questDetail?.questionAnswer }}</view>
       <view class="value text-[#e3e3e3]" v-else>暂无</view>
     </view>
+
+    <van-popup
+      v-model:show="showRawJsonPopup"
+      round
+      position="bottom"
+      :style="{ height: '75%' }"
+    >
+      <view class="json-popup">
+        <view class="json-title">详情接口完整JSON</view>
+        <scroll-view scroll-y class="json-scroll">
+          <text class="json-text">{{ detailRawJson }}</text>
+        </scroll-view>
+      </view>
+    </van-popup>
   </view>
 </template>
 
@@ -107,4 +130,32 @@ onLoad(async (option) => {
     word-break: break-all;
   }
 }
+
+.json-popup {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 12px;
+}
+
+.json-title {
+  font-size: 16px;
+  font-weight: 500;
+  margin-bottom: 10px;
+}
+
+.json-scroll {
+  flex: 1;
+  overflow: hidden;
+  background: #f7f8fa;
+  border-radius: 8px;
+  padding: 12px;
+}
+
+.json-text {
+  white-space: pre-wrap;
+  word-break: break-all;
+  font-size: 13px;
+  line-height: 20px;
+}
 </style>