LT-MES-VUE/src/views/modules/pallet/palletAdmin.vue

<template>
  <div class="mod-config">
    <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 3px;margin-left: 2px" >
      <el-form-item label="栈板编码">
        <el-input v-model="searchData.palletNo" style="width: 120px"></el-input>
      </el-form-item>
      <el-form-item label="录入日期">
        <el-date-picker
          style="width: 120px"
          v-model="searchData.date1"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="至">
        <el-date-picker
          style="width: 120px"
          v-model="searchData.date2"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item >
        <span slot="label" style="" @click="getBaseList(22)"><a herf="#">当前位置：</a></span>
        <el-input v-model="searchData.locationName"  style="width: 120px"></el-input>
      </el-form-item>
      <el-form-item label="是否可用">
        <el-select filterable v-model="searchData.status"  style="width: 120px">
          <el-option label="是" value="('空置','已装货')"></el-option>
          <el-option label="否" value="('已入库','已出库','报废')"></el-option>
          <el-option label="全部" value=""></el-option>
        </el-select>
        <el-button type="primary" @click="getPalletData()">查询</el-button>
<!--        <el-button type="primary" @click="newPallet()">新增</el-button>-->
<!--        <el-button type="primary" @click="prints()">批量打印</el-button>-->
      </el-form-item>
    </el-form>
    <el-table
      :height="height"
      :data="palletList"
      border
      @selection-change="selectionChangeHandle"
      style="width: 100%">
      <el-table-column
        prop=""
        header-align="center"
        align="center"
        width="120"
        label="操作">
        <template slot-scope="scope" class="foo_container">
          <a type="text" size="small" @click="editModal(scope.row)">编辑</a>
        </template>
      </el-table-column>
      <el-table-column
        type="selection"
        align="center"
        width="30">
      </el-table-column>
      <el-table-column
        prop="palletNo"
        header-align="center"
        align="left"
        min-width="100"
        label="栈板编码">
      </el-table-column>
      <el-table-column
        prop="palletDesc"
        header-align="center"
        align="left"
        min-width="100"
        label="栈板名称">
      </el-table-column>
      <el-table-column
        prop="status"
        header-align="center"
        align="left"
        min-width="100"
        label="状态">
      </el-table-column>
      <el-table-column
        prop="area"
        header-align="center"
        align="left"
        min-width="100"
        label="所属区域">
      </el-table-column>
      <el-table-column
        prop="currentLocation"
        header-align="center"
        align="left"
        min-width="100"
        label="当前位置">
      </el-table-column>
      <el-table-column
        prop="createdDate"
        header-align="center"
        align="left"
        min-width="100"
        label="录入日期">
      </el-table-column>
      <el-table-column
        prop="createdBy"
        header-align="center"
        align="left"
        min-width="100"
        label="录入人">
      </el-table-column>
    </el-table>
    <el-dialog title="维护栈板" :close-on-click-modal="false" v-drag :visible.sync="palletModalFlag" width="300px">
      <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="栈板编码">
          <el-input v-model="palletData.palletNo" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="栈板名称">
          <el-input v-model="palletData.palletDesc"  style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="栈板状态">
          <el-select filterable v-model="palletData.status" :disabled="palletSelectFlag" style="width: 120px">
            <el-option label="空置" value="空置"></el-option>
            <el-option label="已装货" value="已装货"></el-option>
            <el-option label="已入库" value="已入库"></el-option>
            <el-option label="已出库" value="已出库"></el-option>
            <el-option label="报废" value="报废"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="区域">
          <el-input v-model="palletData.area"  style="width: 120px"></el-input>
        </el-form-item>
      </el-form>
      <el-footer style="height:40px;margin-top: 10px;text-align:center">
        <el-button type="primary" @click="savePallet">保存</el-button>
        <el-button type="primary" @click="addsModal" v-if="palletSelectFlag">批量新增</el-button>
        <el-button type="primary" @click="palletModalFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>
    <el-dialog title="新增数量" :close-on-click-modal="false" v-drag :visible.sync="addsModalFlag" width="200px">
      <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item style="margin-left: 16px;margin-top: 15px">
          <el-input v-model="addQty" type="number"  style="width: 120px" onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')"></el-input>
        </el-form-item>
      </el-form>
      <el-footer style="height:40px;margin-top: 10px;text-align:center">
        <el-button type="primary" @click="saveAdds">保存</el-button>
        <el-button type="primary" @click="addsModalFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>
    <Chooselist ref="baseList"  @getBaseData="getBaseData"></Chooselist>
  </div>
</template>

<script>
  import {savePallet,
    getPalletData,
    savePalletAdds,
    printPallet,
  } from '@/api/production/pallet.js'
  /*打印标签专用的js*/
  import Chooselist from '@/views/modules/common/Chooselist'
  import {
    printMaterialLabel,
  } from "@/views/modules/pallet/print_pallet_label.js"
  export default {
    name: "palletAdmin",
    components: {
      Chooselist
    },
    data() {
      return {
        height: 200,
        searchData:{
          palletNo:'',
          status:"('空置','已装货')",
          date1:'',
          date2:'',
          locationName:'',
        },
        dataListSelections:'',
        addStatus:'',
        palletData:{
          palletNo:'',
          palletDesc:'',
          status:'',
          id:'',
          site:'',
          area:'',
          createdBy:'',
          updateBy:'',
        },
        palletList:[],
        palletSelectFlag:false,
        palletInputFlag:false,
        palletModalFlag:false,
        addsModalFlag:false,
        addQty:'',
      }
    },
    mounted() {
      this.$nextTick(() => {
        this.height = window.innerHeight - 240;
      })
    },
    methods: {
      getBaseData(val){
        if (this.tagNo === 22){
          this.searchData.locationName = val.LocationName
        }

      },
      // 获取基础数据列表
      getBaseList(val){
        this.tagNo = val
        this.$nextTick(() => {
          let strVal = "";
          if (val === 22){
            strVal =  this.searchData.locationName
          }
          this.$refs.baseList.init(val,strVal)
        })
      },
      selectionChangeHandle (val) {
        this.dataListSelections = val
      },
      newPallet(){
        this.palletData.palletNo='系统自动生成';
        this.palletData.palletDesc='';
        this.palletData.status='空置';
        this.palletData.id=0;
        this.palletData.site=this.$store.state.user.site;
        this.palletData.area='';
        this.palletData.createdBy=this.$store.state.user.name;
        this.palletSelectFlag=true;
        this.palletInputFlag=false;
        this.palletModalFlag=true;
      },
      editModal(row){
        this.palletData.palletNo=row.palletNo;
        this.palletData.palletDesc=row.palletDesc;
        this.palletData.status=row.status;
        this.palletData.id=row.id;
        this.palletData.site=this.$store.state.user.site;
        this.palletData.updateBy=this.$store.state.user.name;
        this.palletData.area=row.area;
        if(row.status!='报废'){
          this.addStatus=row.status;
        }else {
          this.addStatus='空置';
        }
        this.palletSelectFlag=false;
        this.palletInputFlag=true;
        this.palletModalFlag=true;
      },
      savePallet(){
        if(this.palletData.palletDesc==""||this.palletData.palletDesc==null){
          this.$alert('栈板名称不能为空！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        savePallet(this.palletData).then(({data}) => {
          if(data.code===0){
            this.getPalletData();
            this.palletModalFlag=false;
            this.$message({
              message: '保存成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          }else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      getPalletData(){
        getPalletData(this.searchData).then(({data}) => {
          if(data.code===0){
            this.palletList=data.rows;
          }else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      addsModal(){
        if(this.palletData.palletDesc==""||this.palletData.palletDesc==null){
          this.$alert('栈板名称不能为空！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }

        this.addQty='';
        this.addsModalFlag=true;
      },
      saveAdds(){
        if(this.addQty==""||this.addQty==null){
          this.$alert('请输入数量！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if(this.addQty>200){
          this.$alert('批量新增数量上限为200！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        let inData={
          qty:this.addQty,
          area:this.palletData.area,
          palletDesc:this.palletData.palletDesc,
          status:this.palletData.status,
          id:this.palletData.id,
          site:this.palletData.site,
          createdBy:this.palletData.createdBy,

        }
        savePalletAdds(inData).then(({data}) => {
          if(data.code===0){
            this.getPalletData();
            this.addsModalFlag=false;
            this.palletModalFlag=false;
            this.$message({
              message: '保存成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          }else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      print(row){
        let array=[];
        let data={palletNo:row.palletNo}
        array.push(data);
        printMaterialLabel(array);
      },
      prints(){
        if(this.dataListSelections.length==0){
          this.$alert('请勾选需要打印的栈板！','错误',{
            confirmButtonText: '确定'
          })
          return false;
        }
        let array=[];
        for (let i = 0; i <this.dataListSelections.length ; i++) {
          let data={palletNo:this.dataListSelections[i].palletNo}
          array.push(data);
        }
        printMaterialLabel(array);
      }
    },
    created() {
      this.getPalletData();
    }
  }
</script>

<style scoped>

</style>