sd-vue/src/views/shengde/productionSystem/purchase/contract/WarehousingDetails.vue

<template>
  <el-card v-loading="loadingStatus" element-loading-text="生成Excel文件中,请稍后" element-loading-background="rgba(0, 0, 0, 0.2)">
    <el-table :data="tableList" :cell-style="{ padding: '0' }" :row-style="{ height: '35px' }" v-loading="loading" header-row-class-name="tableHeader">
      <el-table-column label="出入库单号" prop="code" width="180" />
      <el-table-column label="采购单号" prop="purchaseCode" width="160" />
      <el-table-column label="归属事业部" width="140">
        <template slot-scope="scope">
          <span v-if="scope.row.subsidiaryName">{{ scope.row.subsidiaryName }}</span>
          <span v-else>胜德体育</span>
        </template>
      </el-table-column>
      <el-table-column label="仓库类型" width="120">
        <template slot-scope="scope">
          <span>{{ getWarehouseName(scope.row.warehouseId) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="仓库" prop="warehouseName" width="120" />
      <el-table-column label="出入库类型" width="120" :formatter="statusFormat" />
      <el-table-column label="品号" prop="colorCode" width="120" />
      <el-table-column label="品名" prop="colorName" min-width="300" />
      <el-table-column label="数量" width="120">
        <template slot-scope="scope">
          <span v-if="scope.row.quantity">{{ Number(scope.row.quantity) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="出入库时间" align="center" prop="createTime" width="140" />
      <el-table-column label="出入库申请人" prop="proposer" width="120" />
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
  </el-card>
</template>

<script>
import * as API from '@/api/shengde/warehouse/outAndInWarehouse'
import { mapGetters } from 'vuex'
import { warehouseList } from '@/api/shengde/warehouse/management'
import { getList } from '@/api/shengde/group/subcompany/subcompanyManagement/index.js'

export default {
  props: {
    rowData: Object,
  },
  data() {
    return {
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        subsidiaryId: '',
        warehouseName: '',
        code: '',
        type: '',
        strTime: '',
        endTime: '',
        colorCode: '',
        colorName: '',
        purchaseCode: '',
      },
      loading: false,
      tableList: [],
      total: 0,
      warehouseList: [],
      stockType: [],
      stockTypeTwo: [],
      companyList: [{ id: '0', name: '胜德体育' }],
      pwd: '',
      openCheckPWD: false,
      loadingStatus: false,
    }
  },
  created() {
    if (this.rowData && this.rowData.purchaseCode) {
      this.queryParams.purchaseCode = this.rowData.purchaseCode
    }
    this.stockType = this.dictData.filter((item) => item.code === 'put_stock_type')[0].children
    this.stockTypeTwo = this.dictData.filter((item) => item.code === 'come_stock_type')[0].children
    warehouseList({ pageNum: 1, pageSize: 9999 }).then((res) => {
      this.warehouseList = res.data.data.list
      this.loading = false
    })
    getList({ pageNum: 1, pageSize: 9999 }).then((res) => {
      this.companyList = this.companyList.concat(res.data.data.records)
    })
  },
  mounted() {
    this.getList()
  },
  computed: mapGetters(['dictData']),
  methods: {
    getList() {
      this.loading = true
      API.purchaseDetailsList(this.queryParams).then(
        (res) => {
          this.tableList = res.data.data.list
          this.loading = false
        },
        (err) => {
          console.log('purchaseDetailsList: ' + err)
          this.loading = false
        }
      )
      API.purchaseDetailsListCount(this.queryParams).then((res) => {
        this.total = res.data.data.count
      })
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm('queryForm')
      this.queryParams.strTime = ''
      this.queryParams.endTime = ''
      this.handleQuery()
    },
    getWarehouseName(id) {
      if (this.warehouseList && this.warehouseList.length > 0 && id) {
        let data = this.warehouseList.filter((item) => item.id === id)
        if (data && data.length > 0) {
          return data[0].name
        }
      }
      return ''
    },
    statusFormat(row) {
      if (row.type) {
        if (row.status === 1) {
          return this.selectConstantsLabel(this.stockType, row.type + '')
        } else {
          return this.selectConstantsLabel(this.stockTypeTwo, row.type + '')
        }
      } else {
        return ''
      }
    },
  },
}
</script>

<style lang="scss" scoped>
* {
  font-size: 12px;
}
::v-deep {
  .el-input__inner {
    border-radius: 1px;
  }
  .el-button--mini {
    border-radius: 1px;
  }
  .tableHeader th {
    background-color: #edf0f5;
    height: 35px;
    padding: 0;
  }
}
</style>