1
MrShi
2025-03-18 a836f03a5d1fbfa81e147d09ffdfa87ba3975c13
admin/src/views/combo/components/OrderDetail.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,177 @@
<template>
  <GlobalWindow :title="title" width="1100px" :visible.sync="visible" :confirm-working="isWorking">
    <div class="title">订单信息</div>
    <div class="info_warp">
      <div class="item">
        <div class="la">订单编号:</div>
        <div class="val">{{ info.id }}</div>
      </div>
      <div class="item">
        <div class="la">订单状态:</div>
        <div class="val">{{ info.status == 1 ? '已支付' : '未支付' }}</div>
      </div>
      <div class="item">
        <div class="la">下单时间:</div>
        <div class="val">{{ info.createDate }}</div>
      </div>
      <div class="item">
        <div class="la">支付时间:</div>
        <div class="val">{{ info.payDate }}</div>
      </div>
      <div class="item">
        <div class="la">订单金额:</div>
        <div class="val">{{ info.money }}</div>
      </div>
      <div class="item">
        <div class="la">支付方式:</div>
        <div class="val">{{ info.payWay == 0 ? '微信' : '支付宝' }}</div>
      </div>
      <div class="item">
        <div class="la">支付单号:</div>
        <div class="val">{{ info.onlineOrderid }}</div>
      </div>
      <div class="item">
        <div class="la">完成时间:</div>
        <div class="val">{{ info.payDate }}</div>
      </div>
      <div class="item">
        <div class="la">备注:</div>
        <div class="val">{{ info.closeInfo }}</div>
      </div>
    </div>
    <div class="title">买家信息</div>
    <div class="info_warp">
      <div class="item">
        <div class="la">呢称:</div>
        <div class="val">{{ form.member.name }}</div>
      </div>
      <div class="item">
        <div class="la">手机号:</div>
        <div class="val">{{ form.member.phone }}</div>
      </div>
      <div class="item">
        <div class="la">openId:</div>
        <div class="val">{{ form.member.openid }}</div>
      </div>
    </div>
    <div class="title">商品信息</div>
    <el-table :data="[goods]" stripe border>
      <el-table-column prop="name" min-width="100px" label="套餐卡" show-overflow-tooltip align="center"></el-table-column>
      <el-table-column prop="refundType" label="有效期" min-width="160px" align="center">
        <template slot-scope="{row}">
          {{ row.useStartDate }} è‡³ {{ row.useEndDate }}
        </template>
      </el-table-column>
      <el-table-column label="数量" width="80px" align="center">
        <template slot-scope="{row}">
          <span>1</span>
        </template>
      </el-table-column>
      <el-table-column prop="price" label="ä»·æ ¼" width="100px" align="center"></el-table-column>
      <el-table-column prop="payWay" label="状态" width="100px" align="center">
        <template slot-scope="{row}">
          {{ info.status == 1 ? '已支付' : '未支付' }}
        </template>
      </el-table-column>
    </el-table>
    <div v-if="form.refundList && form.refundList.length > 0" class="title">退款信息</div>
    <el-table v-if="form.refundList && form.refundList.length > 0" :data="form.refundList" stripe border>
      <el-table-column prop="createDate" label="退款时间" min-width="180px" show-overflow-tooltip align="center"></el-table-column>
      <el-table-column prop="money" label="退款金额" min-width="100px" align="center"></el-table-column>
      <el-table-column label="状态" min-width="100px" align="center">
        <template v-slot="{row}">
          <span v-if="row.status == 0">预退款</span>
          <span v-if="row.status == 1">退款失败</span>
          <span v-if="row.status == 2">退款完成</span>
        </template>
      </el-table-column>
      <el-table-column prop="reason" label="退款备注" min-width="100px" align="center"></el-table-column>
      <el-table-column prop="creatorName" label="操作人" min-width="100px" align="center"></el-table-column>
    </el-table>
    <div slot="footer">
      <el-button @click="visible = false">返回</el-button>
    </div>
  </GlobalWindow>
</template>
<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalWindow from '@/components/common/GlobalWindow'
// import GoodsOrderList from './goodsOrderList.vue'
export default {
  name: 'OperaSitesWindow',
  extends: BaseOpera,
  components: { GlobalWindow },
  data() {
    return {
      // è¡¨å•数据
      form: {
        member: {}
      },
      info: {},
      goods: {},
      list: [],
      memberRidesList: [],
      // 0结算退款 1强制结算退款 2结算后退款 [99: è™šæ‹Ÿtype æ”¯ä»˜æŠ¼é‡‘]
      type: [
        { label: '结算退款', id: 0 },
        { label: '平台自动结算退款', id: 1 },
        { label: '强制结算退款', id: 2 },
        { label: '结算后退款', id: 3 },
        { label: '支付押金', id: 99 },
      ],
    }
  },
  created() {
  },
  methods: {
    open(title, target) {
      debugger
      this.title = title
      this.visible = true
      // æ–°å»º
      console.log('target', target)
      this.form = target
      this.info = target.goodsOrder
      this.goods = target.discountMember
      this.$nextTick(() => {
        this.list = target.payOrderDTOList
        this.memberRidesList = target.memberRidesList
        // this.$refs.goodsOrderList.reload(target.model)
      })
    },
    typeToStr(type) {
      let temp = this.type.find(item => item.id == type)
      return temp ? temp.label : '-'
    }
  },
}
</script>
<style scoped lang="scss">
.info_warp {
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
  .item {
    display: flex;
    width: 33.3%;
    margin-bottom: 6px;
    .val {
      color: #666666;
    }
  }
}
.title {
  font-size: 18px;
  font-weight: 600;
  color: #333;
  margin-bottom: 20px;
  margin-top: 20px;
}
</style>