byte-sailing-new/src/views/purchaseSales/outAndInWarehouse/record/index.vue

<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"
      >
        <template #warehouseName="{ item }">
          <div>
            <span v-if="item.opType == 1">{{ item.toWarehouseName }}</span>
            <span v-else>{{ item.warehouseName }}</span>
          </div>
        </template>
      </byTable>
    </div>
  </div>
</template>

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

const { proxy } = getCurrentInstance();
const route = useRoute();
const opTypeList = ref([
  {
    label: "入库",
    value: "1",
  },
  {
    label: "出库",
    value: "2",
  },
]);
const typeList = ref([
  {
    label: "手动入库",
    value: "1",
  },
  {
    label: "手动出库",
    value: "2",
  },
  {
    label: "调仓入库",
    value: "3",
  },
  {
    label: "待入库入库",
    value: "4",
  },
  {
    label: "待出库出库",
    value: "5",
  },
  {
    label: "组合入库",
    value: "6",
  },
  {
    label: "组合出库",
    value: "7",
  },
  {
    label: "组合拆分入库",
    value: "8",
  },
  {
    label: "组合拆分出库",
    value: "9",
  },
  {
    label: "京东销售出库",
    value: "10",
  },
  {
    label: "调仓出库",
    value: "11",
  },
  {
    label: "销售订单出库",
    value: "12",
  },
  {
    label: "退货出库",
    value: "13",
  },
  {
    label: "到货入库",
    value: "14",
  },
  {
    label: "京东退货入库",
    value: "15",
  },
  {
    label: "生产任务出库",
    value: "20",
  },
]);
const warehouseList = ref([]);
const sourceList = ref({
  data: [],
  pagination: {
    total: 0,
    pageNum: 1,
    pageSize: 10,
    keyword: "",
    opType: "",
    productId: "",
  },
});
const loading = ref(false);
const selectConfig = computed(() => {
  return [
    {
      label: "操作类型",
      prop: "opType",
      data: opTypeList.value,
    },
    {
      label: "出入库类型",
      prop: "type",
      data: typeList.value,
    },
  ];
});
const config = computed(() => {
  return [
    {
      attrs: {
        label: "操作类型",
        prop: "opType",
        width: 140,
      },
      render(type) {
        return proxy.dictValueLabel(type, opTypeList.value);
      },
    },
    {
      attrs: {
        label: "出入库类型",
        prop: "type",
        width: 140,
      },
      render(type) {
        return proxy.dictValueLabel(type, typeList.value);
      },
    },
    {
      attrs: {
        label: "仓库名称",
        slot: "warehouseName",
        width: 200,
      },
    },
    {
      attrs: {
        label: "物品编码",
        prop: "productCode",
        width: 160,
      },
    },
    {
      attrs: {
        label: "物品名称",
        prop: "productName",
        "min-width": 220,
      },
    },
    {
      attrs: {
        label: "规格型号",
        prop: "productSpec",
        width: 160,
      },
    },
    {
      attrs: {
        label: "单位",
        prop: "productUnit",
        width: 120,
      },
    },
    {
      attrs: {
        label: "操作数量",
        prop: "quantity",
        width: 120,
      },
    },
    {
      attrs: {
        label: "操作人",
        prop: "opUserName",
        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>