wzp
2025-05-04 45e02578775f7e05e41923af4294c3617e26bd13
ruoyi-ui/src/views/system/order/detail.vue
@@ -45,10 +45,10 @@
            <div slot="header"><b>服务要求</b></div>
            <el-descriptions :column="1" border>
              <el-descriptions-item label="出发地">{{ serviceInfo.startAddress }}</el-descriptions-item>
              <el-descriptions-item label="出发地位置">{{ serviceInfo.startLocation }}</el-descriptions-item>
              <!-- <el-descriptions-item label="出发地位置">{{ serviceInfo.startLocation }}</el-descriptions-item> -->
              <el-descriptions-item label="目的地">{{ serviceInfo.endAddress }}</el-descriptions-item>
              <el-descriptions-item label="目的地位置">{{ serviceInfo.endLocation }}</el-descriptions-item>
              <el-descriptions-item label="转运里程">{{ serviceInfo.distance }}</el-descriptions-item>
              <!-- <el-descriptions-item label="目的地位置">{{ serviceInfo.endLocation }}</el-descriptions-item> -->
              <el-descriptions-item label="转运里程">{{ serviceInfo.distance }} 公里</el-descriptions-item>
              <el-descriptions-item label="搬抬服务">{{ serviceInfo.liftService }}</el-descriptions-item>
              <el-descriptions-item label="搬抬楼层">{{ serviceInfo.liftFloor }}</el-descriptions-item>
              <el-descriptions-item label="医护要求">{{ serviceInfo.medicalStaff }}</el-descriptions-item>
@@ -98,9 +98,9 @@
              :size="isMobile ? 'mini' : 'medium'"
              class="responsive-table">
              <el-table-column prop="id" label="收款流水" min-width="120" />
              <el-table-column
                prop="paidMoneyTime"
                label="收款时间"
              <el-table-column
                prop="paidMoneyTime"
                label="收款时间"
                min-width="140"
                :formatter="(row, column, cellValue) => formatDateTime(cellValue)"
              />
@@ -112,7 +112,7 @@
        </el-col>
      </el-row>
      <!-- 订单情况 -->
      <el-row :gutter="20">
        <!-- 调度信息 -->
@@ -122,6 +122,18 @@
            <el-descriptions :column="isMobile ? 1 : 2" border>
              <el-descriptions-item label="服务评价">{{ otherInfo.serviceOrdVisit }}</el-descriptions-item>
              <el-descriptions-item label="发票状态">{{ otherInfo.invoiceStatus }}</el-descriptions-item>
              <el-descriptions-item label="知情同意书">
                <div v-if="otherInfo.imageUrls && otherInfo.imageUrls.length > 0" class="image-container">
                  <el-image
                    v-for="image in otherInfo.imageUrls"
                    :key="image"
                    :src="image"
                    :preview-src-list="otherInfo.imageUrls"
                    class="preview-image"
                  />
                </div>
                <span v-else>暂无图片</span>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
@@ -156,8 +168,19 @@
    }
  },
  created() {
    // 获取路由参数中的订单ID
    const orderId = this.$route.params.id
    this.getDetail(orderId)
    // 获取URL查询参数
    const urlParams = new URLSearchParams(window.location.search)
    const params = {
      appId: urlParams.get('appId'),
      timestamp: urlParams.get('timestamp'),
      sign: urlParams.get('sign')
    }
    // 调用获取详情方法,传入所有参数
    this.getDetail(orderId, params)
    // 监听窗口大小变化
    window.addEventListener('resize', this.handleResize)
  },
@@ -167,8 +190,8 @@
  },
  methods: {
    /** 获取订单详情 */
    getDetail(orderId) {
      getOrderDetail(orderId).then(response => {
    getDetail(orderId, params) {
      getOrderDetail(orderId, params).then(response => {
        const { data } = response
        // 根据后端返回的数据结构设置各个对象的值
        this.orderInfo = data.orderInfo || {}
@@ -225,4 +248,15 @@
  .el-descriptions-item { padding: 8px !important; }
  .el-descriptions-item__label { width: 100px !important; }
}
.image-container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.preview-image {
  width: 100px;
  height: 100px;
  object-fit: cover;
  cursor: pointer;
}
</style>