jiangping
2025-02-28 69283b5a4559509187516355602e32e4bdac9d5d
admin/src/views/combo/components/SaleDetail.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,139 @@
<template>
  <GlobalWindow title="套餐卡详情" :visible.sync="isShowModal" width="1000px" @close="close" @confirm="close">
    <div>
      <div class="modal_title">套餐名称:{{ detail.name }}</div>
      <div class="place">
        <span>套餐号:{{ detail.code }}</span>
        <span v-if="detail.useType == 1">有效期:{{ detail.useStartDate }}至{{ detail.useEndDate }}</span>
        <span v-if="detail.useType == 0">有效期:{{ detail.useStartDate }}至{{ detail.useEndDate }}</span>
        <span v-if="detail.useType == 2">有效期:{{ detail.useStartDate }}至{{ detail.useEndDate }}</span>
      </div>
      <div class="df_ac">
        <el-tabs style="flex: 1;" v-model="activeTab" @tab-click="handleClick">
          <el-tab-pane label="套餐使用明细" name="0" />
          <el-tab-pane label="套餐操作记录" name="2" />
        </el-tabs>
        <div style="border-bottom: 2px solid #e5e7ec; margin-top: 1px;">{{ activeTab == 0 ? '使用情况' : '操作情况' }}:{{ pagination.total }}次</div>
      </div>
      <el-table v-if="activeTab == 0" v-loading="loading" :data="list" stripe border>
        <el-table-column prop="createDate" align="center" label="使用时间" min-width="120" show-overflow-tooltip />
        <el-table-column prop="goodsorderId" align="center" label="关联订单" min-width="140" show-overflow-tooltip />
        <el-table-column prop="" align="center" label="骑车时长" min-width="80" show-overflow-tooltip>
          <template v-slot="{ row }">
            {{ row.rideTime }}分钟
          </template>
        </el-table-column>
        <el-table-column prop="ridePrice" align="center" label="抵扣金额" min-width="100" show-overflow-tooltip />
      </el-table>
      <el-table v-if="activeTab == 2" v-loading="loading" :data="list" stripe border>
        <el-table-column prop="createDate" align="center" label="操作时间" min-width="120" show-overflow-tooltip />
        <el-table-column prop="info" align="center" label="操作类型" min-width="100" show-overflow-tooltip>
          <template v-slot="{ row }">
           <span v-if="row.type == 0">用户骑行使用</span>
           <span v-if="row.type == 1">套餐作废</span>
           <span v-if="row.type == 2">套餐调整</span>
          </template>
        </el-table-column>
        <el-table-column prop="editInfo" align="center" label="操作备注" min-width="200" show-overflow-tooltip />
        <el-table-column prop="creatorName" align="center" label="操作人" min-width="80" show-overflow-tooltip />
      </el-table>
      <div class="table_btns">
        <Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" />
      </div>
    </div>
  </GlobalWindow>
</template>
<script>
import { comboSalerDetailPost, discountLogLog } from '@/api/business/combo.js'
import GlobalWindow from '@/components/common/GlobalWindow'
import BasePageTemp from '@/components/base/BasePageTemp'
export default {
  name: 'ComboDetail',
  extends: BasePageTemp,
  components: {
    GlobalWindow
  },
  data() {
    return {
      isShowModal: false,
      activeTab: '0',
      detail: {},
      pagination: {
        page: 1,
        rows: 10
      },
      totalCount: 0,
      list: [],
      loading: false
    }
  },
  created() {
    // this.detail = this.$route.query
    // this.comboDetail()
  },
  methods: {
    getDetail(row) {
      comboSalerDetailPost(row.id).then(res => {
        this.detail = res
        this.activeTab = '0'
        this.getList()
      }, () => {
      })
    },
    handleClick(val) {
      this.getList()
    },
    getList(page) {
      const { pagination, activeTab, detail } = this
      this.loading = true
      if (page) { pagination.page = page }
      discountLogLog({
        model: {
          type: activeTab,
          discountMemberId: detail.id
        },
        capacity: pagination.pageSize,
        page: pagination.page,
      }).then(res => {
        this.loading = false
        this.list = res.records || []
        this.pagination.total = res.total || 0
      }, () => {
        this.loading = false
      })
    },
    close() {
      this.isShowModal = false
      this.$emit('close')
    },
    currentPageChange(val) {
      this.pagination.page = val
      this.comboDetail()
    },
    pageSizeChange(val) {
      this.pagination.rows = val
      this.comboDetail()
    }
  }
}
</script>
<style lang="scss" scoped>
.modal_title {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 6px;
}
.place {
  color: #999999;
  font-size: 13px;
  display: flex;
  margin-bottom: 8px;
  span {
    margin-right: 60px;
  }
}
</style>