<template>
  <div>
    <el-drawer
      title="操作日志"
      size="700px"
      :visible="show"
      @close="handleClose"
      :with-header="true"
    >
      <div style="padding:10px;" v-loading="loading">
        <el-table
          ref="multipleTable"
          :data="tableData"
          tooltip-effect="dark"
          stripe
        >
          <el-table-column prop="operationMsg" label="操作内容" align="center" />
          <el-table-column prop="beforeString" label="修改前总库存" align="center" />
          <el-table-column prop="afterString" label="修改后总库存" align="center" />
          <el-table-column prop="addDate" label="操作时间" align="center" width="140" />
          <el-table-column prop="userName" label="操作人" align="center" />
        </el-table>
        <pagination
          @eventSizeChange="eventSizeChange"
          @eventCurrentChange="eventCurrentChange"
          :total="total"
          :pagerCount="5"
          :pageSize="params.pageSize"
          :pageNum="params.pageNum"
          :layout="'total, prev, pager, next'"
        >
        </pagination>
      </div>
    </el-drawer>
  </div>
</template>
<script>
import pagination from "@/components/common/pagination";
export default {
  name: "dictionarySon",
  data() {
    return {
      tableData: [],
      params: {
        pageSize: 10,
        pageNum: 1
      },
      total: 0,
      loading: false
    };
  },
  components: {
    pagination
  },
  props: {
    show: Boolean,
    id: String
  },
  watch: {
    show(val) {
      val && this.getData();
    }
  },
  methods: {
    handleClose() {
      this.$emit("update:show");
    },
    getData() {
      this.loading = true;
      this.$axios
        .get("/etao-operation-log/listv2", {
          params: { ...this.params, operationMsg: "stockChanged", key: this.id }
        })
        .then(res => {
          let { data, code } = res.data;
          if (code == 200) {
            if (data && data.list && data.list.length > 0) {
              this.total = parseInt(data.total);
              this.tableData = data.list;
            } else {
              this.tableData = [];
              this.total = 0;
            }
          }
          this.loading = false;
        });
    },
    onSearch() {
      this.params.pageNum = 1;
      this.getData();
    },
    eventSizeChange(e) {
      this.params.pageSize = e;
      this.getData();
    },
    eventCurrentChange(e) {
      this.params.pageNum = e;
      this.getData();
    },
    onReset() {
      this.params = {
        pageSize: 10,
        pageNum: 1,
        k1: ""
      };
      this.getData();
    }
  }
};
</script>
<style lang="scss" scoped>
.edit {
  color: #0785dd;

  span {
    cursor: pointer;
    margin: 0 4px;
  }
}

.search-item {
  width: 240px;
}
</style>
