dy-admin-manager/src/views/businessManager/shopManager/purchase-llist.vue

<template>
  <div class="m-container">
    <h2>
      <el-page-header @back="onCancel"
                      :content="`【${goodsName}】进货清单`"></el-page-header>
    </h2>
    <div class="m-core">
      <el-button v-permission="'goods/addGoodsProcurement'"
                 type="primary"
                 @click="editVisible = true">新增</el-button>
      <save-form inline
               class="searchForm"
               :model="searchForm"
               @submit="search"
               @reset="onReSet"
               style="margin-top: 20px">
        <el-form-item>
          <el-input clearable
                    v-model="searchForm.search"
                    placeholder="备查货号" />
        </el-form-item>
        <el-form-item>
          <el-date-picker style="width:410px;"
                          v-model.trim="orderDate"
                          type="daterange"
                          value-format="yyyy-MM-dd"
                          @change="searchOrderDate"
                          range-separator="至"
                          start-placeholder="开始日期"
                          end-placeholder="结束日期"
                          :picker-options="{ firstDayOfWeek: 1 }">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button native-type="submit" type="danger">搜索</el-button>
          <el-button native-type="reset" type="primary">重置</el-button>
        </el-form-item>
      </save-form>
      <div class="tableWrap">
        <el-table :data="tableList"
                  style="width: 100%"
                  :header-cell-style="{background:'#EDEEF0',color:'#444'}">
          <el-table-column align='center'
                           width="180"
                           prop="batchNo"
                           label="批次号" />
          <el-table-column align='center'
                           width="150"
                           prop="supplyChannel"
                           label="备查货号" />
          <el-table-column align='center'
                           width="150"
                           prop="stockCount"
                           label="内部库存" />
          <el-table-column align='center'
                           width="150"
                           prop="stockSoldNum"
                           label="内部售出数量" />
          <el-table-column align='center'
                           width="150"
                           prop="taxStockCount"
                           label="税务库存" />
          <el-table-column align='center'
                           width="150"
                           prop="taxStockSoldNum"
                           label="税务售出数量" />
          <el-table-column align='center'
                           width="150"
                           prop="discountPrice"
                           label="商品采购价1" />
          <el-table-column align='center'
                           width="150"
                           prop="agreeCostPrice"
                           label="商品采购价2" />
          <el-table-column align='center'
                           prop="createTime"
                           label="入库日期" />
          <!-- <el-table-column
            align='center'
            width="150"
            fixed="right"
            label="操作"
          >
            <template slot-scope="scope">
              <el-button
                v-permission="'sellOrder/update'"
                type="text"
              >修改</el-button>
              <el-button
                @click="edit(scope.row)"
                v-permission="'sellOrder/update'"
                type="text"
              >删除</el-button>
            </template>
          </el-table-column> -->
        </el-table>
      </div>
    </div>
    <el-dialog title="新增进货清单"
               width="500px"
               :visible.sync="editVisible"
               @close="editVisible = false"
               destroy-on-close>
      <purchaseForm @submited="getList"
                    @close="closeEdit"
                    :goodsId="goodsId" />
    </el-dialog>
  </div>
</template>
<script>
import dayjs from 'dayjs'
import purchaseForm from './purchase-form'
import { getGoodsProcurements } from '@/api/businessManager'
const initSearchForm = {
  enterStorageStartTime: null,
  enterStorageEndTime: null,
  search: '',
}

export default {
  components: {
    purchaseForm
  },
  data () {
    let query = this.$route.query
    return {
      goodsName: query.name,
      goodsId: query.goodsId,
      tableList: [],
      detail: null,
      editVisible: false,
      searchForm: {
        ...initSearchForm,
      },
      pageInfo: {
        // 分页规则
        limit: 10, // 限制显示条数
        page: 1, // 当前页
        total: 0, // 总条数
        page_size: [10, 20, 40, 50] // 选择限制显示条数
      },
      orderDate: []
    }
  },
  mounted () {
    this.init()
  },
  methods: {
    init () {
      const searchForm = this.searchForm
      // 判断是否在默认值
      if(!searchForm.enterStorageStartTime) {
        this.orderDate = [
          dayjs().format('YYYY-MM-DD'),
          dayjs().format('YYYY-MM-DD'),
        ]
        searchForm.enterStorageStartTime = this.orderDate[0]
        searchForm.enterStorageEndTime = this.orderDate[1]
      } else {
        this.orderDate = [
          searchForm.enterStorageStartTime,
          searchForm.enterStorageEndTime
        ]
      }
      let query = this.$route.query
      this.goodsId = query.goodsId
      this.goodsName = query.name
      this.getList()
    },
    searchOrderDate (val) {
      this.searchForm.enterStorageStartTime = (val ? val[0] : '')
      this.searchForm.enterStorageEndTime = (val ? val[1] : '')
    },
    getList () {
      const form = {
        ...this.searchForm,
        goodsId: this.goodsId
      }
      getGoodsProcurements({
        rows: this.pageInfo.limit,
        page: this.pageInfo.page,
        ...form
      })
        .then(res => {
          if (res.code == 200 && res.data) {
            this.tableList = res.data.rows
            this.pageInfo.total = res.data.total
          }
        })
    },
    onCancel () {
       this.$store.dispatch('delVisitedViews', this.$route) 
      this.$router.push({
        path: '/shopManager/shopManager'
      })
    },
    onReSet () {
      this.orderDate = []
      this.searchForm = {
        ...initSearchForm,
      }
      this.getList()
    },
    edit (row) {
      this.editVisible = true
      this.detail = row
    },
    closeEdit () {
      this.editVisible = false
      this.detail = null
    },
    search () {
      this.getList()
    },
  },
}
</script>
<style lang="less" scoped>
</style>