diff --git a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.http b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.http
index 4a286f57b..0bf8812b2 100644
--- a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.http
+++ b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.http
@@ -2,3 +2,8 @@
 GET {{baseUrl}}/trade/order/page?pageNo=1&pageSize=10
 Authorization: Bearer {{token}}
 tenant-id: {{adminTenentId}}
+
+### 获得交易订单分页 => 成功
+GET {{baseUrl}}/trade/order/get-detail?id=21
+Authorization: Bearer {{token}}
+tenant-id: {{adminTenentId}}
diff --git a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.java b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.java
index eb75fa014..58f3bf318 100644
--- a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.java
+++ b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/TradeOrderController.java
@@ -3,9 +3,12 @@ package cn.iocoder.yudao.module.trade.controller.admin.order;
 import cn.hutool.core.collection.CollUtil;
 import cn.iocoder.yudao.framework.common.pojo.CommonResult;
 import cn.iocoder.yudao.framework.common.pojo.PageResult;
+import cn.iocoder.yudao.module.member.api.user.MemberUserApi;
+import cn.iocoder.yudao.module.member.api.user.dto.MemberUserRespDTO;
 import cn.iocoder.yudao.module.product.api.property.ProductPropertyValueApi;
 import cn.iocoder.yudao.module.product.api.property.dto.ProductPropertyValueDetailRespDTO;
 import cn.iocoder.yudao.module.trade.controller.admin.order.vo.TradeOrderDeliveryReqVO;
+import cn.iocoder.yudao.module.trade.controller.admin.order.vo.TradeOrderDetailRespVO;
 import cn.iocoder.yudao.module.trade.controller.admin.order.vo.TradeOrderPageItemRespVO;
 import cn.iocoder.yudao.module.trade.controller.admin.order.vo.TradeOrderPageReqVO;
 import cn.iocoder.yudao.module.trade.convert.order.TradeOrderConvert;
@@ -13,6 +16,7 @@ import cn.iocoder.yudao.module.trade.dal.dataobject.order.TradeOrderDO;
 import cn.iocoder.yudao.module.trade.dal.dataobject.order.TradeOrderItemDO;
 import cn.iocoder.yudao.module.trade.service.order.TradeOrderService;
 import io.swagger.annotations.Api;
+import io.swagger.annotations.ApiImplicitParam;
 import io.swagger.annotations.ApiOperation;
 import lombok.extern.slf4j.Slf4j;
 import org.springframework.security.access.prepost.PreAuthorize;
@@ -38,6 +42,8 @@ public class TradeOrderController {
 
     @Resource
     private ProductPropertyValueApi productPropertyValueApi;
+    @Resource
+    private MemberUserApi memberUserApi;
 
     @GetMapping("/page")
     @ApiOperation("获得交易订单分页")
@@ -58,6 +64,24 @@ public class TradeOrderController {
         return success(TradeOrderConvert.INSTANCE.convertPage(pageResult, orderItems, propertyValueDetails));
     }
 
+    @GetMapping("/get-detail")
+    @ApiOperation("获得交易订单详情")
+    @ApiImplicitParam(name = "id", value = "订单编号", required = true, example = "1")
+    @PreAuthorize("@ss.hasPermission('trade:order:query')")
+    public CommonResult<TradeOrderDetailRespVO> getOrderDetail(@RequestParam("id") Long id) {
+        // 查询订单
+        TradeOrderDO order = tradeOrderService.getOrder(id);
+        // 查询订单项
+        List<TradeOrderItemDO> orderItems = tradeOrderService.getOrderItemListByOrderId(id);
+        // 查询商品属性
+        List<ProductPropertyValueDetailRespDTO> propertyValueDetails = productPropertyValueApi
+                .getPropertyValueDetailList(TradeOrderConvert.INSTANCE.convertPropertyValueIds(orderItems));
+        // 查询会员
+        MemberUserRespDTO user = memberUserApi.getUser(order.getUserId());
+        // 最终组合
+        return success(TradeOrderConvert.INSTANCE.convert(order, orderItems, propertyValueDetails, user));
+    }
+
     @PostMapping("/delivery")
     @ApiOperation("发货订单")
     @PreAuthorize("@ss.hasPermission('trade:order:delivery')")
diff --git a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/vo/TradeOrderDetailRespVO.java b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/vo/TradeOrderDetailRespVO.java
new file mode 100644
index 000000000..a5fe26fda
--- /dev/null
+++ b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/controller/admin/order/vo/TradeOrderDetailRespVO.java
@@ -0,0 +1,39 @@
+package cn.iocoder.yudao.module.trade.controller.admin.order.vo;
+
+import cn.iocoder.yudao.module.trade.controller.admin.base.member.user.MemberUserRespVO;
+import cn.iocoder.yudao.module.trade.controller.admin.base.product.property.ProductPropertyValueDetailRespVO;
+import io.swagger.annotations.ApiModel;
+import io.swagger.annotations.ApiModelProperty;
+import lombok.Data;
+
+import java.util.List;
+
+@ApiModel("管理后台 - 交易订单的详情 Response VO")
+@Data
+public class TradeOrderDetailRespVO extends TradeOrderBaseVO {
+
+    @ApiModelProperty(value = "收件人地区名字", required = true, example = "上海 上海市 普陀区")
+    private String receiverAreaName;
+
+    /**
+     * 订单项列表
+     */
+    private List<Item> items;
+
+    /**
+     * 用户信息
+     */
+    private MemberUserRespVO user;
+
+    @ApiModel("管理后台 - 交易订单的详情的订单项目")
+    @Data
+    public static class Item extends TradeOrderItemBaseVO {
+
+        /**
+         * 属性数组
+         */
+        private List<ProductPropertyValueDetailRespVO> properties;
+
+    }
+
+}
diff --git a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/convert/order/TradeOrderConvert.java b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/convert/order/TradeOrderConvert.java
index efd578a4a..31b2ffdad 100644
--- a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/convert/order/TradeOrderConvert.java
+++ b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/convert/order/TradeOrderConvert.java
@@ -5,6 +5,7 @@ import cn.iocoder.yudao.framework.common.pojo.PageResult;
 import cn.iocoder.yudao.framework.common.util.collection.CollectionUtils;
 import cn.iocoder.yudao.framework.ip.core.utils.AreaUtils;
 import cn.iocoder.yudao.module.member.api.address.dto.AddressRespDTO;
+import cn.iocoder.yudao.module.member.api.user.dto.MemberUserRespDTO;
 import cn.iocoder.yudao.module.pay.api.order.dto.PayOrderCreateReqDTO;
 import cn.iocoder.yudao.module.product.api.property.dto.ProductPropertyValueDetailRespDTO;
 import cn.iocoder.yudao.module.product.api.sku.dto.ProductSkuRespDTO;
@@ -12,7 +13,9 @@ import cn.iocoder.yudao.module.product.api.sku.dto.ProductSkuUpdateStockReqDTO;
 import cn.iocoder.yudao.module.product.api.spu.dto.ProductSpuRespDTO;
 import cn.iocoder.yudao.module.promotion.api.price.dto.PriceCalculateReqDTO;
 import cn.iocoder.yudao.module.promotion.api.price.dto.PriceCalculateRespDTO;
+import cn.iocoder.yudao.module.trade.controller.admin.base.member.user.MemberUserRespVO;
 import cn.iocoder.yudao.module.trade.controller.admin.base.product.property.ProductPropertyValueDetailRespVO;
+import cn.iocoder.yudao.module.trade.controller.admin.order.vo.TradeOrderDetailRespVO;
 import cn.iocoder.yudao.module.trade.controller.admin.order.vo.TradeOrderPageItemRespVO;
 import cn.iocoder.yudao.module.trade.controller.app.order.vo.AppTradeOrderCreateReqVO;
 import cn.iocoder.yudao.module.trade.dal.dataobject.order.TradeOrderDO;
@@ -138,9 +141,37 @@ public interface TradeOrderConvert {
         });
         return new PageResult<>(orderVOs, pageResult.getTotal());
     }
-
     TradeOrderPageItemRespVO convert(TradeOrderDO order, List<TradeOrderItemDO> items);
-
     ProductPropertyValueDetailRespVO convert(ProductPropertyValueDetailRespDTO bean);
 
+    default TradeOrderDetailRespVO convert(TradeOrderDO order, List<TradeOrderItemDO> orderItems,
+                                           List<ProductPropertyValueDetailRespDTO> propertyValueDetails, MemberUserRespDTO user) {
+        TradeOrderDetailRespVO orderVO = convert2(order, orderItems);
+        // 处理商品属性
+        Map<Long, ProductPropertyValueDetailRespDTO> propertyValueDetailMap = convertMap(propertyValueDetails, ProductPropertyValueDetailRespDTO::getValueId);
+        for (int i = 0; i < orderItems.size(); i++) {
+            List<TradeOrderItemDO.Property> properties = orderItems.get(i).getProperties();
+            if (CollUtil.isEmpty(properties)) {
+                continue;
+            }
+            TradeOrderDetailRespVO.Item item = orderVO.getItems().get(i);
+            item.setProperties(new ArrayList<>(properties.size()));
+            // 遍历每个 properties，设置到 TradeOrderPageItemRespVO.Item 中
+            properties.forEach(property -> {
+                ProductPropertyValueDetailRespDTO propertyValueDetail = propertyValueDetailMap.get(property.getValueId());
+                if (propertyValueDetail == null) {
+                    return;
+                }
+                item.getProperties().add(convert(propertyValueDetail));
+            });
+        }
+        // 处理收货地址
+        orderVO.setReceiverAreaName(AreaUtils.format(order.getReceiverAreaId()));
+        // 处理用户信息
+        orderVO.setUser(convert(user));
+        return orderVO;
+    }
+    TradeOrderDetailRespVO convert2(TradeOrderDO order, List<TradeOrderItemDO> items);
+    MemberUserRespVO convert(MemberUserRespDTO bean);
+
 }
diff --git a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderService.java b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderService.java
index b7999d834..e53cac433 100644
--- a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderService.java
+++ b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderService.java
@@ -10,6 +10,8 @@ import cn.iocoder.yudao.module.trade.dal.dataobject.order.TradeOrderItemDO;
 import java.util.Collection;
 import java.util.List;
 
+import static java.util.Collections.singleton;
+
 /**
  * 交易订单 Service 接口
  *
@@ -54,6 +56,14 @@ public interface TradeOrderService {
      */
     void receiveOrder(Long userId, Long id);
 
+    /**
+     * 获得指定编号的交易订单
+     *
+     * @param id 交易订单编号
+     * @return 交易订单
+     */
+    TradeOrderDO getOrder(Long id);
+
     /**
      * 获得指定用户，指定的交易订单
      *
@@ -101,6 +111,16 @@ public interface TradeOrderService {
      */
     List<TradeOrderItemDO> getOrderItemList(Collection<Long> ids);
 
+    /**
+     * 根据交易订单编号，查询交易订单项
+     *
+     * @param orderId 交易订单编号
+     * @return 交易订单项数组
+     */
+    default List<TradeOrderItemDO> getOrderItemListByOrderId(Long orderId) {
+        return getOrderItemListByOrderId(singleton(orderId));
+    }
+
     /**
      * 根据交易订单编号数组，查询交易订单项
      *
diff --git a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderServiceImpl.java b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderServiceImpl.java
index 3eef12043..e9b1d93ac 100644
--- a/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderServiceImpl.java
+++ b/yudao-module-mall/yudao-module-trade-biz/src/main/java/cn/iocoder/yudao/module/trade/service/order/TradeOrderServiceImpl.java
@@ -390,6 +390,11 @@ public class TradeOrderServiceImpl implements TradeOrderService {
         // TODO 芋艿：lili 发送商品被购买完成的数据
     }
 
+    @Override
+    public TradeOrderDO getOrder(Long id) {
+        return tradeOrderMapper.selectById(id);
+    }
+
     /**
      * 校验交易订单满足可售货的条件
      *
diff --git a/yudao-ui-admin/src/api/mall/trade/order.js b/yudao-ui-admin/src/api/mall/trade/order.js
new file mode 100644
index 000000000..2251aa430
--- /dev/null
+++ b/yudao-ui-admin/src/api/mall/trade/order.js
@@ -0,0 +1,18 @@
+import request from '@/utils/request'
+
+// 获得交易订单分页
+export function getOrderPage(query) {
+  return request({
+    url: '/trade/order/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得交易订单详情
+export function getOrderDetail(id) {
+  return request({
+    url: '/trade/order/get-detail?id=' + id,
+    method: 'get',
+  })
+}
diff --git a/yudao-ui-admin/src/views/mall/trade/order/detail.vue b/yudao-ui-admin/src/views/mall/trade/order/detail.vue
index 13a6c3dee..524c1e091 100644
--- a/yudao-ui-admin/src/views/mall/trade/order/detail.vue
+++ b/yudao-ui-admin/src/views/mall/trade/order/detail.vue
@@ -1,5 +1,10 @@
 <template>
   <div class="app-container order-detail-page">
+    <!-- 订单信息 -->
+    <el-descriptions title="订单信息">
+      <el-descriptions-item label="支付单号">123</el-descriptions-item>
+    </el-descriptions>
+
     <template v-for="(group, index) in detailGroups">
       <el-descriptions v-bind="group.groupProps" :key="`group_${index}`" :title="group.title">
         <!-- 商品信息 -->
@@ -92,6 +97,9 @@
 </template>
 
 <script>
+import {DICT_TYPE, getDictDatas} from "@/utils/dict";
+import { getOrderDetail } from "@/api/mall/trade/order";
+
 export default {
   name: "detail",
   data () {
@@ -100,7 +108,7 @@ export default {
         {
           title: '订单详情',
           children: [
-            { label: '交易流水号', valueKey: 'jylsh'},
+            { label: '支付单号', valueKey: 'jylsh'},
             { label: '配送方式', valueKey: 'psfs'},
             { label: '营销活动', valueKey: 'yxhd'},
             { label: '订单编号', valueKey: 'ddbh'},
@@ -242,9 +250,17 @@ export default {
           }
         ],
         goodsInfo: [] // 商品详情tableData
-      }
+      },
+      order: {
+        items: [],
+      },
     }
   },
+  created() {
+    getOrderDetail(this.$route.query.id).then(res => {
+      this.order = res.data
+    })
+  },
   methods: {
     clipboardSuccess() {
       this.$modal.msgSuccess("复制成功");
diff --git a/yudao-ui-admin/src/views/mall/trade/order/index.vue b/yudao-ui-admin/src/views/mall/trade/order/index.vue
index 20bd4130b..2289788bc 100644
--- a/yudao-ui-admin/src/views/mall/trade/order/index.vue
+++ b/yudao-ui-admin/src/views/mall/trade/order/index.vue
@@ -8,7 +8,7 @@
           <el-form-item label="搜索方式" prop="searchValue">
             <el-input v-model="queryParams.searchValue" style="width: 240px">
               <el-select v-model="queryParams.searchType" slot="prepend" style="width: 100px">
-                <el-option v-for="dict in dicData.searchType" v-bind="dict" :key="dict.value"/>
+                <el-option v-for="dict in searchTypes" :key="dict.value" :label="dict.label" :value="dict.value"/>
               </el-select>
             </el-input>
           </el-form-item>
@@ -156,103 +156,100 @@ import { getOrderPage } from "@/api/mall/trade/order";
 import { datePickerOptions } from "@/utils/constants";
 import { DICT_TYPE, getDictDatas } from "@/utils/dict";
 
-const dicData = {
-    searchType: [
-      { label: '订单号', value: 'no' },
-      { label: '会员编号', value: 'userId' },
-      { label: '会员昵称', value: 'userNickname' },
-      { label: '会员手机号', value: 'userMobile' },
-      { label: '收货人姓名', value: 'receiverName' },
-      { label: '收货人手机号码', value: 'receiverMobile' },
-    ],
-  }
-  export default {
-    name: "index",
-    data () {
-      return {
-        dicData,
-        // 遮罩层
-        loading: true,
-        // 导出遮罩层
-        exportLoading: false,
-        // 显示搜索条件
-        showSearch: true,
-        // 总条数
-        total: 0,
-        // 交易售后列表
-        list: [],
-        queryParams: {
-          pageNo: 1,
-          pageSize: 10,
-          searchType: 'no',
-          searchValue: '',
-          type: null,
-          status: null,
-          payChannelCode: null,
-          createTime: [],
-        },
-        // Tab 筛选
-        activeTab: 'all',
-        statusTabs: [{
-          label: '全部',
-          value: 'all'
-        }],
-        // 静态变量
-        datePickerOptions: datePickerOptions
-      }
+export default {
+  name: "index",
+  data () {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 交易售后列表
+      list: [],
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10,
+        searchType: 'no',
+        searchValue: '',
+        type: null,
+        status: null,
+        payChannelCode: null,
+        createTime: [],
+      },
+      // Tab 筛选
+      activeTab: 'all',
+      statusTabs: [{
+        label: '全部',
+        value: 'all'
+      }],
+      // 静态变量
+      datePickerOptions: datePickerOptions,
+      searchTypes: [
+        { label: '订单号', value: 'no' },
+        { label: '会员编号', value: 'userId' },
+        { label: '会员昵称', value: 'userNickname' },
+        { label: '会员手机号', value: 'userMobile' },
+        { label: '收货人姓名', value: 'receiverName' },
+        { label: '收货人手机号码', value: 'receiverMobile' },
+      ],
+    }
+  },
+  created() {
+    this.getList();
+    // 设置 statuses 过滤
+    for (const dict of getDictDatas(DICT_TYPE.TRADE_ORDER_STATUS)) {
+      this.statusTabs.push({
+        label: dict.label,
+        value: dict.value
+      })
+    }
+  },
+  methods: {
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      // 执行查询
+      getOrderPage({
+        ...this.queryParams,
+        searchType: undefined,
+        searchValue: undefined,
+        no: this.queryParams.searchType === 'no' ? this.queryParams.searchValue : undefined,
+        userId: this.queryParams.searchType === 'userId' ? this.queryParams.searchValue : undefined,
+        userNickname: this.queryParams.searchType === 'userNickname' ? this.queryParams.searchValue : undefined,
+        userMobile: this.queryParams.searchType === 'userMobile' ? this.queryParams.searchValue : undefined,
+        receiverName: this.queryParams.searchType === 'receiverName' ? this.queryParams.searchValue : undefined,
+        receiverMobile: this.queryParams.searchType === 'receiverMobile' ? this.queryParams.searchValue : undefined,
+      }).then(response => {
+        this.list = response.data.list;
+        this.total = response.data.total;
+        this.loading = false;
+      });
     },
-    created() {
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.activeTab = this.queryParams.status ? this.queryParams.status : 'all'; // 处理 tab
       this.getList();
-      // 设置 statuses 过滤
-      for (const dict of getDictDatas(DICT_TYPE.TRADE_ORDER_STATUS)) {
-        this.statusTabs.push({
-          label: dict.label,
-          value: dict.value
-        })
-      }
     },
-    methods: {
-      /** 查询列表 */
-      getList() {
-        this.loading = true;
-        // 执行查询
-        getOrderPage({
-          ...this.queryParams,
-          searchType: undefined,
-          searchValue: undefined,
-          no: this.queryParams.searchType === 'no' ? this.queryParams.searchValue : undefined,
-          userId: this.queryParams.searchType === 'userId' ? this.queryParams.searchValue : undefined,
-          userNickname: this.queryParams.searchType === 'userNickname' ? this.queryParams.searchValue : undefined,
-          userMobile: this.queryParams.searchType === 'userMobile' ? this.queryParams.searchValue : undefined,
-          receiverName: this.queryParams.searchType === 'receiverName' ? this.queryParams.searchValue : undefined,
-          receiverMobile: this.queryParams.searchType === 'receiverMobile' ? this.queryParams.searchValue : undefined,
-        }).then(response => {
-          this.list = response.data.list;
-          this.total = response.data.total;
-          this.loading = false;
-        });
-      },
-      /** 搜索按钮操作 */
-      handleQuery() {
-        this.queryParams.pageNo = 1;
-        this.activeTab = this.queryParams.status ? this.queryParams.status : 'all'; // 处理 tab
-        this.getList();
-      },
-      /** 重置按钮操作 */
-      resetQuery() {
-        this.resetForm("queryForm");
-        this.handleQuery();
-      },
-      /** tab 切换 */
-      tabClick(tab) {
-        this.queryParams.status = tab.name === 'all' ? undefined : tab.name;
-        this.getList();
-      },
-      goToDetail (row) {
-        this.$router.push({ path: '/mall/trade/order/detail', query: { orderNo: row.orderNo }})
-      }
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** tab 切换 */
+    tabClick(tab) {
+      this.queryParams.status = tab.name === 'all' ? undefined : tab.name;
+      this.getList();
+    },
+    goToDetail (row) {
+      this.$router.push({ path: '/mall/trade/order/detail', query: { id: row.id }})
     }
   }
+}
 </script>
 
 <style lang="scss" scoped>