ha-mes-vue/src/views/modules/production/scheduleForSOTask.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-input v-model="searchData.orderRef1" style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item :label="'工序号：'">
          <el-input v-model="searchData.itemNo" style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item :label="'计划日期：'">
          <el-date-picker
            style="width: 130px"
            v-model="searchData.startDate1"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item style="margin-top: 23px;">
          <laber style="margin-left: -9px;font-size: 19px">&#10142</laber>
        </el-form-item>
        <el-form-item :label="' '">
          <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>
      <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-input v-model="searchData.partNo" style="width: 120px"></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="ROUND(a.OrderQty,3) >ROUND(ISNULL(SL.scheduledQty,0),3)"></el-option>
            <el-option label="已派工完" value="ROUND(ISNULL(SL.scheduledQty,0),3) >=ROUND(a.OrderQty,3)"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item :label="' '">
          <el-button @click="search()" style="margin-left: 24px" type="primary">查询</el-button>
          <download-excel
            :fields="exportDataStandard"
            :data="tableData"
            type="xlsx"
            :name="exportName"
            :header="exportHeader"
            :footer="exportFooter"
            :defaultValue="exportDefaultValue"
            :fetch="createExportData"
            :before-generate="startDownload"
            :before-finish="finishDownload"
            worksheet="导出信息"
            class="el-button el-button--primary el-button--medium">
            {{'导出'}}
          </download-excel>
        </el-form-item>
      </el-form>
    </el-form>
    <el-table
      :height="height"
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column
        prop=""
        fixed="left"
        header-align="center"
        align="center"
        width="60"
        label="操作">
        <template slot-scope="scope">
          <a type="text" size="small" @click="openScheduleModel(scope.row)">派工</a>
        </template>
      </el-table-column>
      <el-table-column
        prop="orderNo"
        header-align="center"
        align="left"
        width="120"
        label="日计划号">
      </el-table-column>
      <el-table-column
        prop="itemNo"
        header-align="center"
        align="left"
        width="60"
        label="工序号">
      </el-table-column>
      <el-table-column
        prop="operationDesc"
        header-align="center"
        align="left"
        width="160"
        label="工序名称">
      </el-table-column>
      <el-table-column
        prop="partNo"
        header-align="center"
        align="left"
        width="120"
        label="物料编码">
      </el-table-column>
      <el-table-column
        prop="partDescription"
        header-align="center"
        align="left"
        width="200"
        label="物料名称">
      </el-table-column>
      <el-table-column
        prop="workCenterNo"
        header-align="center"
        align="left"
        width="100"
        label="加工中心">
      </el-table-column>
      <el-table-column
        prop="status"
        header-align="center"
        align="left"
        width="60"
        label="状态">
      </el-table-column>
      <el-table-column
        prop="orderDate"
        header-align="center"
        align="left"
        width="130"
        label="计划日期">
      </el-table-column>
      <el-table-column
        prop="orderRef1"
        header-align="center"
        align="left"
        width="130"
        label="生产订单号">
      </el-table-column>
      <el-table-column
        prop="lotSize"
        header-align="center"
        align="right"
        width="80"
        label="订单数量">
      </el-table-column>
      <el-table-column
        prop="scheduledQty"
        header-align="center"
        align="right"
        width="80"
        label="已派工数量">
      </el-table-column>
      <el-table-column
        prop="qtyReported"
        header-align="center"
        align="right"
        width="80"
        label="已报工数量">
      </el-table-column>
      <el-table-column
        prop="qtyApprove"
        header-align="center"
        align="right"
        width="80"
        label="已入库数量">
      </el-table-column>
      <el-table-column
        prop="machSetupTime"
        header-align="center"
        align="right"
        width="80"
        label="调机时间">
      </el-table-column>
      <el-table-column
        prop="machRunFactor"
        header-align="center"
        align="right"
        width="80"
        label="单位产出量">
      </el-table-column>
      <el-table-column
        prop="factorUnit"
        header-align="center"
        align="left"
        width="80"
        label="产出单位">
      </el-table-column>
    </el-table>
    <el-dialog title="派工" :close-on-click-modal="false" v-drag :visible.sync="scheduledModalFlag" width="720px">
      <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="日计划号:">
          <el-input v-model="schedulingModalData.orderNo" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="工厂编号:">
          <el-input v-model="schedulingModalData.site" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="计划日期:">
          <el-input v-model="schedulingModalData.orderDate" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="订单数量:">
          <el-input v-model="schedulingModalData.lotSize" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="待派工数:">
          <el-input v-model="schedulingModalData.qtyToSchedule" disabled style="width: 120px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="产品编码:">
          <el-input v-model="schedulingModalData.partNo" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="产品名称:">
          <el-input v-model="schedulingModalData.partDescription" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="工序号:">
          <el-input v-model="schedulingModalData.itemNo" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="工序名称:">
          <el-input v-model="schedulingModalData.operationDesc" disabled style="width: 120px"></el-input>
        </el-form-item>
        <el-form-item label="加工中心:">
          <el-input v-model="schedulingModalData.workCenterNo" disabled style="width: 120px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="派工机台:">
          <el-select v-model="schedulingModalData.resourceId" style="width: 120px"
                     placeholder="请选择">
            <el-option v-for="item in availableResourceList " :key="index" :label="item.ResouceDesc"
                       :value="item.ResourceID">

            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="派工班次:">
          <el-select v-model="schedulingModalData.shiftNo" style="width: 120px"
                     placeholder="请选择">
            <el-option label="白班" value="白班"></el-option>
            <el-option label="晚班" value="晚班"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="派工人员:">
          <el-select v-model="schedulingModalData.operatorId" style="width: 120px"
                     placeholder="请选择">
            <el-option v-for="item in operatorIdList " :key="index" :label="item.operatorName"
                       :value="item.operatorID">

            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="本次累计派工数量:">
          <el-input v-model="schedulingModalData.sumQty" type="number" disabled style="width: 120px"></el-input>
          <el-button type="primary" @click="addPlans()" style="margin-left: 10px;">添加</el-button>
          <el-button type="primary" @click="savePlans()">保存</el-button>
        </el-form-item>
      </el-form>
      <div class="inputTable ">
        <el-table
          height="200"
          :data="schedulingModalTableData"
          border
          style="width: 100%">
          <el-table-column
            prop="scheduleDate"
            header-align="center"
            align="left"
            min-width="100"
            label="派工日期">
            <template slot-scope="scope">
              <el-date-picker
                style="width: 95%"
                class="sl-input"
                v-model="scope.row.scheduleDate"
                type="date"
                value-format="yyyy-MM-dd"
                @change="getTodayShiftNo2(scope.$index)"
                placeholder="选择日期">
              </el-date-picker>
            </template>
          </el-table-column>
          <el-table-column
            prop="scheduleQty"
            header-align="center"
            align="right"
            min-width="80"
            label="派工数量">
            <template slot-scope="scope">
              <el-input v-model="scope.row.scheduleQty" type="number" @change="changeSum" placeholder="请输入数量"
                        style="width:98%"></el-input>
            </template>
          </el-table-column>
          <el-table-column
            prop="resourceId"
            header-align="center"
            align="left"
            min-width="80"
            label="派工机台">
            <template slot-scope="scope">
              <el-select v-model="scope.row.resourceId" placeholder="请选择" style="height: 12px;padding: 0px " filterable
                         allow-create>
                <el-option v-for="item in availableResourceList " :key="index" :label="item.ResouceDesc"
                           :value="item.ResourceID">

                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="shiftNo"
            header-align="center"
            align="left"
            min-width="80"
            label="派工班次">
            <template slot-scope="scope">
              <el-select v-model="scope.row.shiftNo" placeholder="请选择" style="height: 12px;padding: 0px " filterable
                         allow-create>
                <el-option label="白班" value="白班"></el-option>
                <el-option label="晚班" value="晚班"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="operatorId"
            header-align="center"
            align="right"
            min-width="80"
            label="派工人员">
            <template slot-scope="scope">
              <el-select v-model="scope.row.operatorId" placeholder="请选择" style="height: 12px;padding: 0px " filterable
                         allow-create>
                <el-option v-for="item in operatorIdList " :key="index" :label="item.operatorName"
                           :value="item.operatorID">

                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop=""
            header-align="center"
            align="center"
            width="60"
            label="操作">
            <template slot-scope="scope" class="foo_container">
              <a type="text" size="small" @click="splitScheduleTable(scope.$index)">删除</a>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="scheduledModalFlag = false">关闭</el-button>
        <!--        <el-button type="primary" :disabled="bannersBut" @click="saveBanners()">确定</el-button>-->
      </el-footer>
    </el-dialog>
  </div>
</template>

<script>
  import {
    getSOTastRoutingData,
    getWorkCenterOperatorList,
    getAvailableResourceList,
  } from "@/api/production.js"

  export default {
    name: 'scheduleForSOTask',
    data () {
      return {
        // 导出 start
        exportData: [],
        exportDataStandard: {
          "日计划号": "orderNo",
          "工序号": "itemNo",
          "工序名称": "operationDesc",
          "物料编码": "partNo",
          "物料名称": "partDescription",
          "加工中心": "workCenterNo",
          "状态": "status",
          "计划日期": "orderDate",
          "日计划数量": "lotSize",
          "已派工数量": "scheduledQty",
          "已报工数量": "qtyReported",
          "已入库数量": "qtyApprove",
          "生产订单号": "orderRef1",
          "调机时间": "machSetupTime",
          "单位产出量": "machRunFactor",
          "产出单位": "factorUnit",
        },
        exportName: "日计划工序列表"+this.getStrDate(),
        exportHeader: ["日计划工序列表"],
        exportFooter: [],
        exportDefaultValue: "这一行这一列没有数据",
        // 导出 end
        height:200,
        tableData:[],
        date1:'',
        searchData: {
          orderNo: '',
          startDate1: new Date(),
          endDate1: '',
          status: '(\'已计划\')',
          partNo: '',
          orderRef1:'',
          site: this.$store.state.user.site,
          planStatus: 'ROUND(a.OrderQty,3) >ROUND(ISNULL(SL.scheduledQty,0),3)',
          itemNo:'',
        },
        schedulingModalData: {
          orderNo: '',
          site: '',
          orderRef1: '',
          lotSize: '',
          qtyToSchedule: '',
          partNo: '',
          partDescription: '',
          itemNo: '',
          operationDesc: '',
          workCenterNo: '',
          scheduleDate: '',
          scheduleQty: '',
          resourceId: '',
          shiftNo: '',
          sumQty: '',
          orderDate:'',
          operatorId:'',
        },
        scheduledModalFlag: false,
        availableResourceList: [],
        schedulingModalTableData: [],
        operatorIdList:[],
      }
    },
    mounted() {
      this.$nextTick(()=>{
        this.height = window.innerHeight - 220;
      })
    },
    methods: {
      search(){
        getSOTastRoutingData(this.searchData).then(({data}) => {
          this.tableData = data.rows;
        })
      },
      createExportData() {

        return this.tableData;
      },
      startDownload() {
        //  this.exportData = this.dataList

      },
      finishDownload() {

      },
      getStrDate() {
        let dd = new Date();
        let Y = dd.getFullYear();
        let M = (dd.getMonth() + 1) < 10 ? "0" + (dd.getMonth() + 1) : (dd.getMonth() + 1);//获取当前月份的日期，不足10补0
        let D = dd.getDate() < 10 ? "0" + dd.getDate() : dd.getDate();//获取当前几号，不足10补0
        let H = dd.getHours() < 10 ? "0" + dd.getHours() : dd.getHours();
        let MM = dd.getMinutes() < 10 ? "0" + dd.getMinutes() : dd.getMinutes();
        let S = dd.getSeconds() < 10 ? "0" + dd.getSeconds() : dd.getSeconds();
        return Y + M + D + H + MM + S;

      },
      openScheduleModel(row){
        if (row.lotSize-row.scheduledQty == 0) {
          this.$alert('该订单已派工完毕！', '错误', {
            confirmButtonText: '确定'
          })
          return false
        }
        this.schedulingModalData = {
          orderNo: row.orderNo,
          site: row.site,
          orderRef1: row.orderRef1,
          lotSize: row.lotSize,
          qtyToSchedule: row.lotSize-row.scheduledQty,
          partNo: row.partNo,
          partDescription: row.partDescription,
          itemNo: row.itemNo,
          operationDesc: row.operationDesc,
          workCenterNo: row.workCenterNo,
          orderDate: row.orderDate,
          scheduleDate: '',
          scheduleQty: '',
          resourceId: '',
          shiftNo: '',
          sumQty: 0,
          operatorId: '',
        }
        this.schedulingModalTableData = []
        this.getAvailableResourceList(row);
        this.getWorkCenterOperatorList(row);
        this.scheduledModalFlag = true
      },
      addPlans () {

        // if (this.schedulingModalData.resourceId == '') {
        //   this.$alert('请选择机台！', '错误', {
        //     confirmButtonText: '确定'
        //   })
        //   return false
        // }
        // if (this.schedulingModalData.shiftNo == '') {
        //   this.$alert('请选择派工班次！', '错误', {
        //     confirmButtonText: '确定'
        //   })
        //   return false
        // }
        this.schedulingModalTableData.push({
          scheduleQty: '',
          resourceId: this.schedulingModalData.resourceId,
          shiftNo: this.schedulingModalData.shiftNo,
          scheduleDate: null,
          operatorId:this.schedulingModalData.operatorId,
          selectList: []
        })
        this.sumQty += this.schedulingModalData.scheduleQty
      },
      changeSum () {
        let sum = 0
        if (this.schedulingModalTableData.length > 0) {
          for (let i = 0; i < this.schedulingModalTableData.length; i++) {
            if (this.schedulingModalTableData[i].scheduleQty != '' && this.schedulingModalTableData[i].scheduleQty != null) {
              sum += Number(this.schedulingModalTableData[i].scheduleQty)
            }
          }
        }
        this.schedulingModalData.sumQty = sum
      },
      splitScheduleTable (index) {
        this.schedulingModalTableData.splice(index, 1)
        this.changeSum()
      },
      getWorkCenterOperatorList(row){
        let inData={
          site:row.site,
          workCenterNo:row.workCenterNo,
        }
        getWorkCenterOperatorList(inData).then(({data}) => {
          this.operatorIdList = data.rows;
        })
      },
      getAvailableResourceList(row){
        let inData={
          site:row.site,
          orderNo:row.orderRef1,
          itemNo:row.itemNo,
        }
        getAvailableResourceList(inData).then(({data}) => {
          this.availableResourceList = data.rows;
        })
      },
    },
    created() {
    }
  }
</script>

<style scoped>

</style>