✨ 售后日志：完成

pages/order/aftersale/apply.vue

@@ -1,4 +1,4 @@
-<!-- 订单详情 -->
+<!-- 售后申请 -->
 <template>
   <s-layout title="申请售后">
     <!-- 售后商品 -->

pages/order/aftersale/log-item.vue

@@ -1,57 +1,35 @@
+<!-- 售后日志的每一项展示 -->
 <template>
   <view class="log-item ss-flex">
     <view class="log-icon ss-flex-col ss-col-center ss-m-r-20">
-      <text class="cicon-title" :class="index === 0 ? 'activity-color' : ''"></text>
+      <text class="cicon-title" :class="index === 0 ? 'activity-color' : ''" />
-      <view v-if="data.length - 1 != index" class="line"></view>
+      <view v-if="data.length - 1 !== index" class="line" />
     </view>
     <view>
-      <view class="text">{{ item.log_type_text }}</view>
+      <view class="text">{{ item.content }}</view>
-      <mp-html class="richtext" :content="item.content"></mp-html>
+      <view class="date">
-      <view class="" v-if="item.images?.length">
+        {{ sheep.$helper.timeFormat(item.createTime, 'yyyy-mm-dd hh:MM:ss') }}
-        <scroll-view class="scroll-box" scroll-x scroll-anchoring>
-          <view class="ss-flex">
-            <view v-for="i in item.images" :key="i" class="ss-m-r-20">
-              <su-image
-                class="content-img"
-                isPreview
-                :previewList="state.commentImages"
-                :current="index"
-                :src="i"
-                :height="120"
-                :width="120"
-                mode="aspectFit"
-              ></su-image>
-            </view>
-          </view>
-        </scroll-view>
       </view>
-      <view class="date">{{ item.create_time }}</view>
     </view>
   </view>
 </template>
 <script setup>
   import sheep from '@/sheep';
-  import { reactive } from 'vue';
+
   const props = defineProps({
     item: {
-      type: Object,
+      type: Object, // 当前日志
       default() {},
     },
     index: {
-      type: Number,
+      type: Number, // item 在 data 的下标
       default: 0,
     },
     data: {
-      type: Object,
+      type: Object, // 日志列表
       default() {},
     },
   });
-  const state = reactive({
-    commentImages: [],
-  });
-  props.item.images?.forEach((i) => {
-    state.commentImages.push(sheep.$url.cdn(i));
-  });
 </script>
 <style lang="scss" scoped>
   .log-item {

pages/order/aftersale/log.vue

@@ -1,45 +1,29 @@
-<!-- 售后进度  -->
+<!-- 售后日志列表  -->
 <template>
   <s-layout title="售后进度">
     <view class="log-box">
-      <view  v-for="(item, index) in state.info" :key="item.title">
+      <view v-for="(item, index) in state.list" :key="item.id">
-        <log-item :item="item" :index="index" :data="state.info"></log-item>
+        <log-item :item="item" :index="index" :data="state.list" />
       </view>
     </view>
   </s-layout>
 </template>
 
 <script setup>
-  import sheep from '@/sheep';
   import { onLoad } from '@dcloudio/uni-app';
-  import { computed, reactive } from 'vue';
+  import { reactive } from 'vue';
   import logItem from './log-item.vue';
+  import AfterSaleApi from '@/sheep/api/trade/afterSale';
 
   const state = reactive({
-    active: 1,
+    list: [],
-    list: [
-      {
-        title: '买家下单',
-        desc: '2018-11-11',
-      },
-      {
-        title: '卖家发货',
-        desc: '2018-11-12',
-      },
-      {
-        title: '买家签收',
-        desc: '2018-11-13',
-      },
-      {
-        title: '交易完成',
-        desc: '2018-11-14',
-      },
-    ],
   });
+
   async function getDetail(id) {
-    const { data } = await sheep.$api.order.aftersale.detail(id);
+    const { data } = await AfterSaleApi.getAfterSaleLogList(id);
-    state.info = data.logs;
+    state.list = data;
   }
+
   onLoad((options) => {
     state.aftersaleId = options.id;
     getDetail(options.id);

sheep/api/trade/afterSale.js

@@ -29,6 +29,16 @@ const AfterSaleApi = {
         id,
       },
     });
+  },
+  // 获得售后日志列表
+  getAfterSaleLogList: (afterSaleId) => {
+    return request2({
+      url: `/app-api/trade/after-sale-log/list`,
+      method: 'GET',
+      params: {
+        afterSaleId,
+      },
+    });
   }
 };