修复bug

src/views/recycleOrder/detail/index.vue

@@ -1,64 +1,89 @@
 <template>
-    <ele-page class="order-detail">
-        <ele-card class="order-status" header="订单状态">
-            <orderStatus :status="detail.status" :logVoList="detail.logVoList" />
-        </ele-card>
-        <ele-card class="order-base" header="订单基本信息" :body-style="{ paddingTop: '15px' }">
-            <orderBaseInfo :detail="detail"  />
-        </ele-card>
-        <ele-card class="order-book-list" header="图书清单" :body-style="{ paddingTop: '15px' }">
-            <template #extra v-if="detail.status < 8">
-                <el-button type="danger" v-if="!isExpand" @click="handleExpand">展开列表>></el-button>
-                <el-button type="danger" v-else @click="handleCollapse">折叠列表>></el-button>
-            </template>
+  <ele-page class="order-detail">
+    <ele-card class="order-status" header="订单状态">
+      <orderStatus :status="detail.status" :logVoList="detail.logVoList" />
+    </ele-card>
+    <ele-card
+      class="order-base"
+      header="订单基本信息"
+      :body-style="{ paddingTop: '15px' }"
+    >
+      <orderBaseInfo :detail="detail" />
+    </ele-card>
+    <ele-card
+      class="order-book-list"
+      header="图书清单"
+      :body-style="{ paddingTop: '15px' }"
+    >
+      <template #extra v-if="detail.status < 8">
+        <el-button type="danger" v-if="!isExpand" @click="handleExpand"
+          >展开列表>></el-button
+        >
+        <el-button type="danger" v-else @click="handleCollapse"
+          >折叠列表>></el-button
+        >
+      </template>
 
-            <orderBookList :isExpand="isExpand" :detail="detail" @refresh="emit('refresh')" ref="bookListRef"
-                @close="emit('close')" />
-        </ele-card>
+      <orderBookList
+        :isExpand="isExpand"
+        :detail="detail"
+        @refresh="emit('refresh')"
+        ref="bookListRef"
+        @close="emit('close')"
+      />
+    </ele-card>
 
-        <ele-card class="order-service" header="订单服务">
-            <el-tag size="large" style="margin-right: 20px">免费退回</el-tag>
-            <el-tag size="large" style="margin-right: 20px">24小时验</el-tag>
-            <el-tag size="large">急速打款</el-tag>
-        </ele-card>
+    <ele-card class="order-service" header="订单服务">
+      <el-tag size="large" style="margin-right: 20px">免费退回</el-tag>
+      <el-tag size="large" style="margin-right: 20px">24小时验</el-tag>
+      <el-tag size="large">急速打款</el-tag>
+    </ele-card>
 
-        <ele-card class="order-note" header="审核计价说明">
-            品相良好：按原始回收折扣计价；品相一般：按原始回收折扣*0.7计价；品相极差：不收。
-        </ele-card>
-        <ele-card class="order-freight" header="物流动态">
-            <orderFreightStatus :records="detail.trackingVoList" />
-        </ele-card>
-    </ele-page>
+    <ele-card class="order-note" header="审核计价说明">
+      品相良好：按原始回收折扣计价；品相一般：按原始回收折扣*0.7计价；品相极差：不收。
+    </ele-card>
+    <ele-card class="order-freight" header="物流动态">
+      <orderFreightStatus :records="detail.trackingVoList" />
+    </ele-card>
+  </ele-page>
 </template>
 
 <script setup>
-import orderStatus from '@/views/recycleOrder/detail/order-status.vue';
-import orderBaseInfo from '@/views/recycleOrder/detail/order-base-info.vue';
-import orderFreightStatus from '@/views/recycleOrder/detail/order-freight-status.vue';
-import orderBookList from '@/views/recycleOrder/detail/order-book-list.vue'
+  import orderStatus from '@/views/recycleOrder/detail/order-status.vue';
+  import orderBaseInfo from '@/views/recycleOrder/detail/order-base-info.vue';
+  import orderFreightStatus from '@/views/recycleOrder/detail/order-freight-status.vue';
+  import orderBookList from '@/views/recycleOrder/detail/order-book-list.vue';
 
-const emit = defineEmits(['refresh']);
-const props = defineProps({
+  const emit = defineEmits(['refresh']);
+  const props = defineProps({
     detail: {
-        type: Object,
-        default: () => ({}),
-    },
-});
+      type: Object,
+      default: () => ({})
+    }
+  });
 
-const isExpand = ref(false);
-const handleExpand = () => {
+  const isExpand = ref(true);
+  const handleExpand = () => {
     isExpand.value = true;
-};
-const handleCollapse = () => {
+  };
+  const handleCollapse = () => {
     isExpand.value = false;
-};
+  };
+
+  watch(
+    () => props.detail,
+    (newVal) => {
+      isExpand.value = newVal.status >= 8;
+    },
+    { deep: true, immediate: true }
+  );
 
-// 其余审核良好
-const bookListRef = ref(null);
-function handleOtherAuditGood() {
+  // 其余审核良好
+  const bookListRef = ref(null);
+  function handleOtherAuditGood() {
     bookListRef.value?.handleOtherAuditGood();
-}
-defineExpose({
+  }
+  defineExpose({
     handleOtherAuditGood
-});
+  });
 </script>