ylrz_his_scrm_companyUI/src/views/store/components/userIntegralDetails.vue

<!-- UserIntegralLogs.vue -->
<template>
  <div class="integral-logs-container">
    <el-table 
      v-loading="loading" 
      border 
      :data="userIntegralLogsList" 
      @selection-change="handleSelectionChange"
    >
      <el-table-column label="用户id" align="center" prop="userId" />
      <el-table-column label="用户昵称" align="center" prop="nickName" />
      <el-table-column label="用户电话" align="center" prop="phone" />
      <el-table-column label="类别" align="center" prop="logType">
        <template slot-scope="scope">
          <dict-tag :options="intefralLogTypeOptions" :value="scope.row.logType"/>
        </template>
      </el-table-column>
      <el-table-column label="积分" align="center" prop="integral" />
      <el-table-column label="积分余额" align="center" prop="balance" />
      <el-table-column label="订单关联id" align="center" prop="businessId" />
      <el-table-column label="时间" align="center" prop="createTime" />
    </el-table>
    
    <!-- 分页组件 -->
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  </div>
</template>

<script>
import { listUserIntegralLogs} from "@/api/company/userIntegralLogs";

export default {
  name: 'UserIntegralLogs',
  props: {
    fsUserId: {
      type: [String, Number],
      required: false
    }
  },
  data() {
    return {
      loading: false,
      userIntegralLogsList: [],
      total: 0,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        userId: this.fsUserId
      },
      intefralLogTypeOptions: [],
      selections: []
    }
  },
  watch: {
    fsUserId: {
      handler(newVal) {
        this.queryParams.userId = newVal;
        this.getList();
      },
      immediate: true
    }
  },

  created() {
    this.getList();
    this.getDictOptions();
  },
  methods: {
    // 获取积分日志列表
    getList() {

      if (!this.queryParams.userId) return;
      
      this.loading = true;
      listUserIntegralLogs(this.queryParams).then(response => {
        this.userIntegralLogsList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    getIntegralLogs(fsUserId){
        this.queryParams.userId=fsUserId;
        this.getList();
    },
    // 获取字典选项
    getDictOptions() {
      // 获取积分日志类型字典
        this.getDicts("sys_integral_log_type").then(response => {
            this.intefralLogTypeOptions = response.data;
        });
    },
    
    // 处理选择变化
    handleSelectionChange(selection) {
      this.selections = selection;
    }
  }
}
</script>

<style scoped>
.integral-logs-container {
  padding: 20px;
}
</style>