wms / wms4_changqingjingxia · Files

<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="货位代码">
              <a-input placeholder="请输入货位代码" v-model="queryParam.goodAllocationCode" ></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="货位名称">
              <a-input placeholder="请输入货位名称" v-model="queryParam.goodAllocationName" ></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="货位规格">
              <a-input placeholder="请输入货位规格" v-model="queryParam.goodAllocationSpecs" ></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button id="search" type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <a-button v-has="'SmartCabinetSummary:export'" type="primary" icon="download" @click="handleExportXls('智能柜库存详情')">导出</a-button>

    <!-- table区域-begin -->
    <div>

      <a-table
        ref="table"
        size="middle"
        :scroll="{ x: true }"
        bordered
        rowKey="id"
        class="j-table-force-nowrap"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="false"
        :loading="loading"
        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
        @change="handleTableChange"
      >

        <span slot="action" slot-scope="text, record">
          <a v-has="'material:edit'" @click="updateWaterLevel(record)">修改最低库存</a>
        </span>

        <span slot="qtySum" slot-scope="text, record">
          <a-tag :key="record.id" :color="qtySumColor(record)" style="font-size: 14px;font-weight: normal">
            {{ qtySumStatus(record) }}
          </a-tag>
        </span>
      </a-table>

      <!-- 页面使用分页组件 -->
      <Pagination v-model="ipagination.current" :total="ipagination.total" show-size-changer :page-size="ipagination.pageSize" @onShowSizeChange="onShowSizeChange" :pageSizeOptions="ipagination.pageSizeOptions"/>
    </div>

    <ExpressStorageModal ref="ExpressStorageModal" @ok="modalFormOk"></ExpressStorageModal>
    <ExpressDeliveryModal ref="ExpressDeliveryModal" @ok="modalFormOk"></ExpressDeliveryModal>
    <smart-cabinet-water-level ref="SmartCabinetWaterLevelModal" @ok="modalFormOk"></smart-cabinet-water-level>

  </a-card>
</template>

<script>
import '@/assets/less/TableExpand.less'
import {mixinDevice} from '@/utils/mixin'
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
import {getAction, postAction} from '@/api/manage'
import Pagination from '@/components/jeecgbiz/Pagination'
import ExpressStorageModal from "@views/system/monitor/modules/ExpressStorageModal.vue";
import ExpressDeliveryModal from "@views/system/monitor/modules/ExpressDeliveryModal";
import Vue from "vue";
import {ACCESS_TOKEN} from "@/store/mutation-types";
import store from "@/store";
import EmptyInTaskModal from "@views/system/task/modules/EmptyInTaskModal.vue";
import SmartCabinetWaterLevel from "@views/system/inventory/modules/SmartCabinetWaterLevel.vue";

export default {
  name: 'SmartCabinetSummaryList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    SmartCabinetWaterLevel,
    EmptyInTaskModal,
    ExpressStorageModal,
    ExpressDeliveryModal,
    Pagination
  },
  data() {
    return {
      newArr: [],
      newDataSource: [],
      initDateSource: [],
      initPageSize: 10,
      zoneList: [],
      zoneOptions: [],
      companyList: [],
      firstLoad: 0,
      description: '智能柜详情管理页面',
      // 表头
      columns: [
        {
          title: '货位名称',
          align: 'center',
          dataIndex: 'goodAllocationName'
        },
        {
          title: '货位规格',
          align: 'center',
          dataIndex: 'goodAllocationSpecs'
        },
        {
          title: '货位代码',
          align: 'center',
          dataIndex: 'goodAllocationCode'
        },
        {
          title: '重量',
          align: 'center',
          dataIndex: 'weight'
        },
        {
          title: '库存标记',
          align: "center",
          dataIndex: 'qtySum',
          scopedSlots: {customRender: 'qtySum'}
        },
        {
          title: '最低库存',
          align: 'center',
          dataIndex: 'waterLevel'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          fixed: "right",
          width: 147,
          scopedSlots: {customRender: 'action'},
        }
      ],
      url: {
        list: '/inventory/inventoryHeader/smartCabinetSummaryList',
        importExcelUrl: '/inventory/SmartCabinet/importExcel',
        importPinkuUrl: '/inventory/SmartCabinet/importPinku',
        exportXlsUrl: '/inventory/inventoryHeader/export',
      },
      dictOptions: {},
      superFieldList: [],
      selectRecord: [],
    }
  },
  created() {
    this.initPageSize = this.ipagination.pageSize
    this.loadData()
    this.loadFrom()
    this.getSuperFieldList()
  },
  mounted() {
    if (this.firstLoad == 0) {
      this.firstLoad = 1;
      return;
    }
    //页面没加载完,此时methods里的方法找不到,使用定时器模拟点击
    // let timeSearch = setInterval(() => {
    //   let eleSearch = document.getElementById("search");
    //   if (eleSearch != null) {
    //     //调用成功,清除定时器
    //     clearInterval(timeSearch)
    //     eleSearch.click();
    //   }
    // }, 200)
  },
  computed: {
  },
  methods: {
    updateWaterLevel(record) {
      this.$refs.SmartCabinetWaterLevelModal.edit(record);
      this.$refs.SmartCabinetWaterLevelModal.title = "修改水位";
    },
    qtySumStatus(record) {
      if(record.weight <= record.waterLevel){
        return " 🠋"
      } else {
        return " 🠉"
      }
    },
    qtySumColor(record) {
      if(record.weight <= record.waterLevel){
        return 'red';
      } else {
        return 'blue'
      }
    },
    loadData(arg) {
      if (!this.url.list) {
        this.$message.error('请设置url.list属性!')
        return
      }
      //加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.ipagination.current = 1
      }
      //设置请求的条数为初始值
      this.ipagination.pageSize = this.initPageSize
      var params = this.getQueryParams() //查询条件
      this.loading = true
      getAction(this.url.list, params).then((res) => {
        if (res.success) {
          this.initDateSource = res.result.records || res.result
          this.newDataSource = res.result.records || res.result
          this.dataHandling()
          if (res.result.total) {
            this.ipagination.total = res.result.total
          } else {
            this.ipagination.total = 0
          }
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
        this.loading = false
      })
    },
    /*如果分页走这个方法*/
    dataHandling() {
      //动态新增每页条数
      this.ipagination.pageSize = this.initPageSize + 1
      this.newArr = []
      // var arrs = this.newDataSource
      // if (arrs.length > 0) {
      //   let item = {}
      //   item.id = '合计'
      //   var qty = 0
      //   for (let i = 0; i < arrs.length; i++) {
      //     qty += arrs[i].qty
      //   }
      //   item.qty = qty
      //   this.newDataSource.push(item)
      // }
      this.dataSource = Object.values(this.newDataSource)
    },
    // 分页改变时调用组件里的方法
    onShowSizeChange(current, pageSize) {
      this.ipagination.current = current
      this.ipagination.pageSize = pageSize
      //调整每页请求数值
      this.initPageSize = this.ipagination.pageSize
      this.loadData()
    },

    handleTableChange(pagination, filters, sorter) {
      //分页、排序、筛选变化时触发
      if (Object.keys(sorter).length > 0) {
        this.isorter.column = sorter.field;
        this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
      }
      //这种筛选方式只支持单选
      if (filters && Object.keys(filters).length > 0 && filters.containerStatus_dictText) {
        this.filters.containerStatus = filters.containerStatus_dictText[0];
      }
      if (filters && Object.keys(filters).length > 0 && filters.enable_dictText) {
        this.filters.enable = filters.enable_dictText[0];
      }
      if (filters && Object.keys(filters).length > 0 && filters.inventoryStatus_dictText) {
        this.filters.inventoryStatus = filters.inventoryStatus_dictText.toString();
      }
      if (filters && Object.keys(filters).length > 0 && filters.zoneCode) {
        this.filters.zoneCode = filters.zoneCode.toString();
      }
      this.ipagination = pagination;
      this.loadData();
    },
    loadFrom() {

    },
    onSelectChange(selectedRowKeys, selectionRows) {
      if (selectedRowKeys != null && selectedRowKeys.length > 0) {
        this.selectedMainId = selectedRowKeys[0].toString();
      }
      selectedRowKeys = selectedRowKeys.filter((item) => item !== '合计');
      this.selectedRowKeys = selectedRowKeys;
      this.selectRecord = selectionRows;
    },
    expressStorage() {
      let json = {
        "containerCode": null,
        "locationCode": null
      }
      this.$refs.ExpressStorageModal.edit(json);
    },
    initDictConfig() {
    },
    getSuperFieldList() {
      let fieldList = []
      fieldList.push({type: 'string', value: 'companyCode', text: '货主', dictCode: ''})
      fieldList.push({type: 'string', value: 'zoneCode', text: '库区', dictCode: ''})
      fieldList.push({type: 'string', value: 'containerCode', text: '容器编码', dictCode: ''})
      fieldList.push({type: 'string', value: 'locationCode', text: '库位编码', dictCode: ''})
      fieldList.push({type: 'string', value: 'materialCode', text: '图号', dictCode: ''})
      fieldList.push({type: 'string', value: 'materialName', text: '物料名称', dictCode: ''})
      fieldList.push({type: 'string', value: 'materialSpec', text: '物料规格', dictCode: ''})
      fieldList.push({type: 'string', value: 'materialUnit', text: '物料单位', dictCode: ''})
      fieldList.push({type: 'BigDecimal', value: 'qty', text: '数量', dictCode: ''})
      fieldList.push({type: 'BigDecimal', value: 'taskQty', text: '任务锁定数量', dictCode: ''})
      fieldList.push({type: 'string', value: 'inventoryStatus', text: '库存状态', dictCode: 'inventory_status'})
      fieldList.push({type: 'int', value: 'enable', text: '可用状态', dictCode: 'inventory_enable'})
      fieldList.push({type: 'string', value: 'batch', text: '批次', dictCode: ''})
      // fieldList.push({type:'string',value:'sn',text:'序列号',dictCode:''})
      fieldList.push({type: 'datetime', value: 'receiptDate', text: '入库日期'})
      fieldList.push({type: 'int', value: 'inventoryAge', text: '库龄（天）', dictCode: ''})
      fieldList.push({type: 'string', value: 'createBy', text: '创建人', dictCode: ''})
      fieldList.push({type: 'datetime', value: 'createTime', text: '创建日期'})
      fieldList.push({type: 'string', value: 'updateBy', text: '更新人', dictCode: ''})
      fieldList.push({type: 'datetime', value: 'updateTime', text: '更新日期'})
      this.superFieldList = fieldList
    }
  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>