<template>
  <div class="tenant">
    <div class="content">
      <byTable
        :source="sourceList.data"
        :pagination="sourceList.pagination"
        :config="config"
        :loading="loading"
        :selectConfig="selectConfig"
        highlight-current-row
        :action-list="[
          {
            text: '导出Excel',
            action: () => deriveExcel(),
          },
        ]"
        @get-list="getList">
      </byTable>
    </div>
  </div>
</template>

<script setup>
import { computed, ref } from "vue";
import byTable from "@/components/byTable/index";

const { proxy } = getCurrentInstance();
const route = useRoute();
const typeList = ref([
  {
    label: "手动入库",
    value: "1",
  },
  {
    label: "手动出库",
    value: "2",
  },
  {
    label: "调仓",
    value: "3",
  },
  {
    label: "待入库入库",
    value: "4",
  },
  {
    label: "待出库出库",
    value: "5",
  },
]);
const warehouseList = ref([]);
const sourceList = ref({
  data: [],
  pagination: {
    total: 0,
    pageNum: 1,
    pageSize: 10,
    keyword: "",
    type: "",
    productId: "",
  },
});
const loading = ref(false);
const selectConfig = computed(() => {
  return [
    {
      label: "操作类型",
      prop: "type",
      data: typeList.value,
    },
  ];
});
const config = computed(() => {
  return [
    {
      attrs: {
        label: "操作类型",
        prop: "type",
        width: 140,
      },
      render(type) {
        return proxy.dictValueLabel(type, typeList.value);
      },
    },
    {
      attrs: {
        label: "出入库类型",
        prop: "type",
        width: 140,
      },
      render(type) {
        return proxy.dictValueLabel(type, typeList.value);
      },
    },
    {
      attrs: {
        label: "仓库名称",
        prop: "warehouseId",
        width: 220,
      },
      render(type) {
        return proxy.dictValueLabel(type, warehouseList.value);
      },
    },
    {
      attrs: {
        label: "物品编码",
        prop: "productCode",
        width: 160,
      },
    },
    {
      attrs: {
        label: "物品名称",
        slot: "productName",
        "min-width": 220,
      },
    },
    {
      attrs: {
        label: "规格型号",
        prop: "productModel",
        width: 160,
      },
    },
    {
      attrs: {
        label: "单位",
        prop: "unit",
        width: 120,
      },
    },
    {
      attrs: {
        label: "操作数量",
        prop: "quantity",
        width: 120,
      },
    },
    {
      attrs: {
        label: "操作人",
        prop: "userName",
        width: 120,
      },
    },
    {
      attrs: {
        label: "操作时间",
        prop: "createTime",
        width: 160,
      },
    },
  ];
});
const getDict = () => {
  proxy.post("/warehouse/page", { pageNum: 1, pageSize: 999 }).then((res) => {
    if (res.rows && res.rows.length > 0) {
      warehouseList.value = res.rows.map((item) => {
        return {
          label: item.name,
          value: item.id,
        };
      });
    }
  });
};
const getList = async (req) => {
  sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
  loading.value = true;
  proxy.post("/stockJournalDetails/page", sourceList.value.pagination).then((res) => {
    sourceList.value.data = res.rows;
    sourceList.value.pagination.total = res.total;
    setTimeout(() => {
      loading.value = false;
    }, 200);
  });
};
getDict();

onMounted(() => {
  if (route.query.productId) {
    sourceList.value.pagination.productId = route.query.productId;
  }
  getList();
});
const deriveExcel = () => {
  console.log("deriveExcel");
};
</script>

<style lang="scss" scoped>
.tenant {
  padding: 20px;
}
::v-deep(.el-input-number .el-input__inner) {
  text-align: left;
}
</style>
