ha-mes-vue/src/views/modules/production/dailyPlan.vue

<template>
  <div class="mod-config">
    <el-form inline="true" style="margin-top: -25px;" v-model="searchData">
      <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 5px;">
        <el-form-item :label="'订单号：'">
          <el-input v-model="searchData.orderNo" style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item :label="'计划开工日期：'">
          <el-date-picker
            style="width: 130px"
            v-model="searchData.startDate2"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item style="margin-top: 30px;">
          <laber style="margin-left: -9px;font-size: 19px">&#10142</laber>
        </el-form-item>
        <el-form-item style="margin-top: 30px;">
          <el-date-picker
            style="width: 130px"
            v-model="searchData.endDate2"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item :label="'计划完工日期：'">
          <el-date-picker
            style="width: 130px"
            v-model="searchData.startDate3"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item style="margin-top: 30px;">
          <laber style="margin-left: -9px;font-size: 19px">&#10142</laber>
        </el-form-item>
        <el-form-item style="margin-top: 30px;">
          <el-date-picker
            style="width: 130px"
            v-model="searchData.endDate3"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
      </el-form>


      <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 5px;">
        <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-form-item>
        <el-form-item :label="'录入日期：'">
          <el-date-picker
            style="width: 130px"
            v-model="searchData.startDate1"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item style="margin-top: 30px;">
          <laber style="margin-left: -9px;font-size: 19px">&#10142</laber>
        </el-form-item>
        <el-form-item style="margin-top: 30px;">
          <el-date-picker
            style="width: 130px"
            v-model="searchData.endDate1"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item :label="'物料编码：'">
          <el-input v-model="searchData.partNo" style="width: 130px"></el-input>
        </el-form-item>
        <el-form-item :label="'排产情况：'">
          <el-select filterable v-model="searchData.planStatus" style="width: 120px">
            <el-option label="全部" value=""></el-option>
            <el-option label="未排产完" value="a.LotSize >ISNULL(so.scheduling_size,0)"></el-option>
            <el-option label="已排产完" value="ISNULL(so.scheduling_size,0) >=a.LotSize"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item style="margin-top: 30px">
          <el-button @click="search()" style="margin-left: 24px" type="primary">查询</el-button>
        </el-form-item>
      </el-form>
    </el-form>

    <el-table
      :height="height"
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column
        prop="orderNo"
        header-align="center"
        align="left"
        min-width="60"
        label="订单号">
      </el-table-column>
      <el-table-column
        prop="partNo"
        header-align="center"
        align="left"
        min-width="60"
        label="物料编码">
      </el-table-column>
      <el-table-column
        prop="partDescription"
        header-align="center"
        align="left"
        min-width="200"
        label="物料名称">
      </el-table-column>
      <el-table-column
        prop="status"
        header-align="center"
        align="left"
        min-width="40"
        label="状态">
      </el-table-column>
      <el-table-column
        prop="planStartDate"
        header-align="center"
        align="left"
        min-width="50"
        label="计划开工日期">
      </el-table-column>
      <el-table-column
        prop="needDate"
        header-align="center"
        align="left"
        min-width="50"
        label="计划完工日期">
      </el-table-column>
      <el-table-column
        prop="lotSize"
        header-align="center"
        align="right"
        min-width="40"
        label="订单数量">
      </el-table-column>
      <el-table-column
        prop="schedulingSize"
        header-align="center"
        align="right"
        min-width="40"
        label="已排产数量">
      </el-table-column>
      <el-table-column
        prop="enterDate"
        header-align="center"
        align="left"
        min-width="80"
        label="录入时间">
      </el-table-column>
      <el-table-column
        prop="userName"
        header-align="center"
        align="left"
        min-width="40"
        label="录入人">
      </el-table-column>
      <el-table-column
        prop=""
        fixed="right"
        header-align="center"
        align="center"
        min-width="30"
        label="操作">
        <template slot-scope="scope">
          <a type="text" size="small" @click="openScheduleModel(scope.row)">排产</a>
        </template>
      </el-table-column>
    </el-table>

    <el-dialog title="排产信息" :visible.sync="schedulingFlag" :close-on-click-modal="false" v-drag width="840px">
      <el-form :inline="true" label-position="top">
        <el-form-item :label="'订单号：'">
          <el-input v-model="scheduledModelData.orderNo" readonly style="width: 130px"></el-input>
        </el-form-item>
        <el-form-item :label="'计划开工日期：'">
          <el-input v-model="scheduledModelData.planStartDate" readonly style="width: 130px"></el-input>
        </el-form-item>
        <el-form-item :label="'计划完工日期：'">
          <el-input v-model="scheduledModelData.needDate" readonly style="width: 130px"></el-input>
        </el-form-item>
        <el-form-item :label="'已排产数量：'">
          <el-input v-model="scheduledModelData.schedulingSize" readonly style="width: 100px"></el-input>
        </el-form-item>
        <el-form-item :label="'未排产数量：'">
          <el-input v-model="scheduledModelData.unSchedulingSize" readonly style="width: 100px"></el-input>
        </el-form-item>
        <el-button @click="schedulings()" type="primary" style="margin-top: 33px;margin-left: 0px;">批量新增</el-button>
        <el-button @click="schedulingModal()" type="primary" style="margin-top: 33px;">新增</el-button>
      </el-form>
      <el-table
        :height="300"
        :data="scheduleTableData"
        border
        style="width: 100%">
        <el-table-column
          prop="orderDate"
          header-align="center"
          align="left"
          min-width="50"
          label="计划日期">
        </el-table-column>

        <el-table-column
          prop="orderQty"
          header-align="center"
          align="right"
          min-width="40"
          label="排产数量">
        </el-table-column>
        <el-table-column
          prop="userName"
          header-align="center"
          align="left"
          min-width="50"
          label="录入人">
        </el-table-column>
        <el-table-column
          prop="enterDate"
          header-align="center"
          align="center"
          min-width="90"
          label="录入日期">
        </el-table-column>
        <el-table-column
          prop=""
          header-align="center"
          align="center"
          min-width="50"
          label="操作">
          <template slot-scope="scope" class="foo_container">
            <a type="text" size="small" @click="editSchedule(scope.row)">编辑</a>
            <a type="text" size="small" @click="deleteSchedule(scope.row)">取消</a>
          </template>
        </el-table-column>
      </el-table>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="schedulingFlag = false">关闭</el-button>
        <!--        <el-button type="primary" :disabled="bannersBut" @click="saveBanners()">确定</el-button>-->
      </el-footer>
    </el-dialog>
    <el-dialog title="维护日计划" :close-on-click-modal="false" v-drag :visible.sync="schedulingModalFlag" width="341px">
      <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item :label="'订单号：'">
          <el-input v-model="scheduledingData.orderNo" disabled style="width: 130px"></el-input>
        </el-form-item>
        <el-form-item :label="'计划日期：'">
          <el-date-picker
            style="width: 130px"
            v-model="scheduledingData.orderDate"
            type="date"
            value-format="yyyy-MM-dd"
            :disabled="scheduledingDataFlag1"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item :label="'计划数量：'">
          <el-input v-model="scheduledingData.orderQty" style="width: 130px"></el-input>
        </el-form-item>
      </el-form>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" v-if="scheduledingDataFlag3" @click="planSaveOn()">保存并继续</el-button>
        <el-button type="primary" @click="planSave()">保存</el-button>
        <el-button type="primary" @click="schedulingModalFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <el-dialog title="批量排产" :close-on-click-modal="false" v-drag :visible.sync="schedulingsFlag" width="341px">
      <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item :label="'订单号：'">
          <el-input v-model="scheduledingsData.orderNo" disabled style="width: 130px"></el-input>
        </el-form-item>
        <el-form-item :label="'计划开始日期：'">
          <el-date-picker
            style="width: 130px"
            v-model="scheduledingsData.orderDate"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item :label="'排产总数：'">
          <el-input v-model="scheduledingsData.qty"  style="width: 130px" ></el-input>
        </el-form-item>
        <el-form-item :label="'计划天数：'">
          <el-input v-model="scheduledingsData.dayQty"  style="width: 130px"  onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')"></el-input>
        </el-form-item>
      </el-form>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="plansSave()">保存</el-button>
        <el-button type="primary" @click="schedulingsFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>

  </div>

</template>

<script>
  import {
    getShopOrderData,
    getSchedulingSize,
    savePlan,
    getWorkPlanData,
    delPlan,
    savePlans
  } from '@/api/production.js'

  export default {
    name: 'productionDispatch',
    data () {
      return {

        schedulingsFlag: false,
        // 维护日计划界面
        schedulingModalFlag: false,
        scheduleTableData: [],
        scheduledModelData: {
          orderNo: '',
          planStartDate: '',
          needDate: '',
          schedulingSize: '',
          unSchedulingSize: ''
        },
        dataListSelections: [],
        scheduledingData: {
          orderNo: '',
          orderDate: '',
          orderQty: '',
          userName: this.$store.state.user.name,
          lotSize: '',
          planStartDate: '',
          needDate: '',
          site: this.$store.state.user.site,
          productionType: '生产订单',
          planAdd: 0,
          partNo: ''
        },
        scheduledingsData: {
          orderNo: '',
          orderDate: '',
          orderQty: '',
          qty: '',
          dayQty: '',
          userName: this.$store.state.user.name,
          lotSize: '',
          planStartDate: '',
          needDate: '',
          site: this.$store.state.user.site,
          productionType: '生产订单',
          planAdd: 0,
          partNo: ''
        },
        scheduledingDataFlag1: false,
        scheduledingDataFlag3: true,
        schedulingFlag: false,
        tableData: [],
        searchData: {
          orderNo: '',
          startDate1: new Date(),
          endDate1: '',
          startDate2: '',
          endDate2: '',
          status: '(\'已下达\',\'已发料\',\'已入库\',\'已开工\')',
          partNo: '',
          startDate3: '',
          endDate3: '',
          site: this.$store.state.user.site,
          planStatus: 'ISNULL(so.scheduling_size,0) >=a.LotSize'
        },
        // table高度
        height: 200
      }
    },
    mounted () {
      this.$nextTick(() => {
        this.height = window.innerHeight - 270
      })
    },
    methods: {
      search () {
        this.getData()
      },
      // 维护日计划界面
      schedulingModal () {
        if (this.scheduledModelData.unSchedulingSize == 0) {
          this.$alert('该日计划已排产完毕无需新增！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        this.scheduledingDataFlag1 = false
        this.scheduledingDataFlag3 = true
        this.scheduledingData.userName = this.$store.state.user.name
        this.scheduledingData.planStartDate = this.scheduledModelData.planStartDate
        this.scheduledingData.needDate = this.scheduledModelData.needDate
        this.scheduledingData.orderNo = this.scheduledModelData.orderNo
        this.scheduledingData.orderDate = this.scheduledModelData.planStartDate
        this.scheduledingData.planAdd = 0
        this.scheduledingData.orderQty = ''

        this.schedulingModalFlag = true
      },
      schedulings(){
        if (this.scheduledModelData.unSchedulingSize == 0) {
          this.$alert('该日计划已排产完毕无需新增！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        this.scheduledingsData.userName = this.$store.state.user.name
        this.scheduledingsData.planStartDate = this.scheduledModelData.planStartDate
        this.scheduledingsData.needDate = this.scheduledModelData.needDate
        this.scheduledingsData.orderNo = this.scheduledModelData.orderNo
        this.scheduledingsData.orderDate = this.scheduledModelData.planStartDate
        this.scheduledingsData.planAdd = 0
        this.scheduledingsData.orderQty = ''
        this.scheduledingsData.qty=''
        this.scheduledingsData.dayQty=''
        this.scheduledingsData.orderQty=''
        this.schedulingsFlag = true
      },
      // 排产信息界面
      openScheduleModel (row) {
        if (row.status == '已计划' || row.status == '已取消' || row.status == '已关闭') {
          this.$alert('该订单状态为' + row.status + '无法排产', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        let list = {orderNo: row.orderNo}
        getSchedulingSize(list).then(({data}) => {
          this.scheduledModelData.schedulingSize = data.schedulingSize
          this.scheduledModelData.unSchedulingSize = row.lotSize - data.schedulingSize
        })
        this.scheduledingData.lotSize = row.lotSize
        this.scheduledingData.partNo = row.partNo
        this.scheduledingsData.lotSize = row.lotSize
        this.scheduledingsData.partNo = row.partNo
        this.scheduledModelData.needDate = row.needDate
        this.scheduledModelData.planStartDate = row.planStartDate
        this.scheduledModelData.orderNo = row.orderNo
        this.schedulingFlag = true
        let data1 = {orderNo: row.orderNo}
        getWorkPlanData(data1).then(({data}) => {
          this.scheduleTableData = data.rows
        })
      },

      // 查询
      getData () {
        getShopOrderData(JSON.parse(JSON.stringify(this.searchData))).then(({data}) => {
          this.tableData = data.rows
        })
      },
      planSave () {
        if (this.scheduledingData.orderDate == '' || this.scheduledingData.orderDate == null) {
          this.$alert('请选择计划日期！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledingData.orderQty == '' || this.scheduledingData.orderQty == null) {
          this.$alert('请输入排产数量！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledingData.orderQty <= 0) {
          this.$alert('排产数量必须大于0！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }

        savePlan(this.scheduledingData).then(({data}) => {
          if (data && data.code === 0) {
            this.scheduledModelData.schedulingSize = data.schedulingSize
            this.scheduledModelData.unSchedulingSize = this.scheduledingData.lotSize - data.schedulingSize
            this.schedulingModalFlag = false
            let data1 = {orderNo: this.scheduledModelData.orderNo}
            getWorkPlanData(data1).then(({data}) => {
              this.scheduleTableData = data.rows
            })
            this.getData()
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,

              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      plansSave(){
        if (this.scheduledingsData.orderDate == '' || this.scheduledingsData.orderDate == null) {
          this.$alert('请选择计划日期！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledingsData.qty == '' || this.scheduledingsData.qty == null) {
          this.$alert('请输入排产总数！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledingsData.dayQty == '' || this.scheduledingsData.dayQty == null) {
          this.$alert('请输入计划天数！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledingsData.dayQty > 10 ) {
          this.$alert('计划天数不可大于10天！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledingsData.qty <= 0) {
          this.$alert('排产总数量必须大于0！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledModelData.unSchedulingSize<this.scheduledingsData.qty) {
          this.$alert('可排产数量小于计划数量！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        let num=this.scheduledingsData.qty/this.scheduledingsData.dayQty;
        if(Math.round(num)==num){
          this.scheduledingsData.orderQty=num;
        }else{
          this.scheduledingsData.orderQty=num.toFixed(1);
        }
        let scheduledList=[];
        let theOrderDate= this.getLastDay(this.scheduledingsData.orderDate)
        for (let i = 0; i < this.scheduledingsData.dayQty; i++) {
          theOrderDate=this.getNextDay(theOrderDate);
          let listData={
            "orderNo": this.scheduledingsData.orderNo,
            "orderDate":  theOrderDate,
            "orderQty": this.scheduledingsData.orderQty,
            "userName": this.$store.state.user.name,
            "planStartDate": this.scheduledingsData.planStartDate,
            "needDate": this.scheduledingsData.needDate,
            "site": this.$store.state.user.site,
            "productionType": '生产订单',
            "partNo": this.scheduledingsData.partNo,
            "lotSize": this.scheduledingsData.lotSize,
            "planAdd": 0
          }
          scheduledList.push(listData);
        }

        savePlans(JSON.stringify(scheduledList)).then(({data}) => {
          if (data && data.code === 0) {
            this.scheduledModelData.schedulingSize = data.schedulingSize
            this.scheduledModelData.unSchedulingSize = this.scheduledingData.lotSize - data.schedulingSize
            this.schedulingsFlag = false
            let data1 = {orderNo: this.scheduledModelData.orderNo}
            getWorkPlanData(data1).then(({data}) => {
              this.scheduleTableData = data.rows

            })
            this.getData();
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,

              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      planSaveOn () {
        if (this.scheduledingData.orderDate == '' || this.scheduledingData.orderDate == null) {
          this.$alert('请选择计划日期！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        if (this.scheduledingData.orderQty == '' || this.scheduledingData.orderQty == null) {
          this.$alert('请输入排产数量！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }

        if (this.scheduledingData.orderQty <= 0) {
          this.$alert('排产数量必须大于0！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }

        savePlan(this.scheduledingData).then(({data}) => {
          if (data && data.code === 0) {
            this.scheduledModelData.schedulingSize = data.schedulingSize;
            this.scheduledModelData.unSchedulingSize = this.scheduledingData.lotSize - data.schedulingSize;
            let data1 = {orderNo: this.scheduledModelData.orderNo}
            getWorkPlanData(data1).then(({data}) => {
              this.scheduleTableData = data.rows
            })
            this.getData();
            this.scheduledingData.orderDate=this.getNextDay(this.scheduledingData.orderDate);
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,

              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      // 修改日计划
      editSchedule (row) {
        this.scheduledingDataFlag1 = true
        this.scheduledingDataFlag3 = false
        this.scheduledingData.userName = this.$store.state.user.name
        this.scheduledingData.planStartDate = this.scheduledModelData.planStartDate
        this.scheduledingData.needDate = this.scheduledModelData.needDate
        this.scheduledingData.orderNo = this.scheduledModelData.orderNo
        this.scheduledingData.orderDate = row.orderDate
        this.scheduledingData.planAdd = 1
        this.scheduledingData.orderQty = row.orderQty
        this.schedulingModalFlag = true
      },
      // 刪除
      deleteSchedule (row) {
        let delData = {
          orderNo: row.orderNo,
          orderQty: row.orderQty,
          orderRef1: row.orderRef1
        }
        this.$confirm(`是否取消此条日计划?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'

        }).then(() => {
          delPlan(delData).then(({data}) => {
            if (data && data.code === 0) {
              this.scheduledModelData.schedulingSize = data.schedulingSize
              this.scheduledModelData.unSchedulingSize = this.scheduledingData.lotSize - data.schedulingSize
              this.getData()
              let data1 = {orderNo: this.scheduledModelData.orderNo}
              getWorkPlanData(data1).then(({data}) => {
                this.scheduleTableData = data.rows
              })
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                }
              })
            } else {
              this.$alert(data.msg, '错误', {
                confirmButtonText: '确定'
              })
            }
          })
        }).catch(() => {
        })
      },
      getNextDay(dateTime){
        var dd =new Date(dateTime);
        dd.setDate(dd.getDate()+1);//获取1天后的日期
        var y = dd.getFullYear();
        var m = (dd.getMonth()+1)<10?"0"+(dd.getMonth()+1):(dd.getMonth()+1);//获取当前月份的日期，不足10补0
        var d = dd.getDate()<10?"0"+dd.getDate():dd.getDate();//获取当前几号，不足10补0
        // let haha= new Date(y+"-"+m+"-"+d);
        return y+"-"+m+"-"+d;
      },
      getLastDay(dateTime){
        var dd =new Date(dateTime);
        dd.setDate(dd.getDate()-1);//获取1天后的日期
        var y = dd.getFullYear();
        var m = (dd.getMonth()+1)<10?"0"+(dd.getMonth()+1):(dd.getMonth()+1);//获取当前月份的日期，不足10补0
        var d = dd.getDate()<10?"0"+dd.getDate():dd.getDate();//获取当前几号，不足10补0
        // let haha= new Date(y+"-"+m+"-"+d);
        return y+"-"+m+"-"+d;
      },
      getTime (date) {
        if (date == '') {
          return ''
        } else {
          let json_date = new Date(date).toJSON()
          return new Date(new Date(json_date) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '')
        }
      },
    },
    created () {

    }
  }
</script>
<style scoped>

</style>