icore-pass/src/views/inward/components/inwardBillet/addInwardBillet.vue

// 新增内转钢坯需求
<template>
  <div class="inwardRequirement">
    <!-- 用车单位 -->
    <div class="requireUnit">
      <el-form class="demo-form-inline" label-width="80px" :inline="true">
        <div class="top1">
          <el-form-item label="用车单位" v-show="false">
            <el-input class="inline-input" v-model="requireUnitName" disabled>
            </el-input>
          </el-form-item>
          <el-form-item label="需求类型" v-show="false">
            <el-input class="inline-input" v-model="requirementType" disabled>
            </el-input>
          </el-form-item>
          <el-form-item label="炉号">
            <el-input
              class="inline-input"
              v-model.number="heatNo"
              style="width:150px"
            >
            </el-input>
          </el-form-item>
          <el-form-item label="选择钢种">
            <el-select
              class="inline-select"
              v-model="type"
              filterable
              style="width:150px"
            >
              <el-option
                v-for="(item, index) in options1"
                :key="index"
                :label="item.value"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="选择规格">
            <el-select
              class="inline-select"
              v-model="model"
              filterable
              style="width:150px"
            >
              <el-option
                v-for="(item, index) in options2"
                :key="index"
                :label="item.value"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="选择班别">
            <el-select
              class="inline-select"
              v-model="clazz"
              style="width:150px"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.value"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </div>
        <div class="top3">
          <el-form-item label="选择车辆">
            <el-select
              class="inline-select"
              v-model="capacityId"
              style="width:150px"
            >
              <el-option
                v-for="item in optionsCapacity"
                :label="item.capacityNumber"
                :value="item.capacityId"
                :key="item.capacityId"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="当车支数">
            <el-input class="inline-input" v-model="count" style="width:150px">
            </el-input>
          </el-form-item>
          <el-form-item label="选择装货点" v-show="false">
            <el-select
              class="inline-select"
              v-model="loadPoint"
              style="width:150px"
            >
              <el-option
                v-for="item in optionsLoad"
                :key="item.warehouseId"
                :label="item.warehouseName"
                :value="item.warehouseId"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="选择卸货点">
            <el-select
              class="inline-select"
              v-model="unloadPoint"
              style="width:150px"
            >
              <el-option
                v-for="item in optionsUnload"
                :key="item.warehouseId"
                :label="item.warehouseName"
                :value="item.warehouseId"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="选择班次">
            <el-select
              class="inline-select"
              v-model="shift"
              style="width:150px"
            >
              <el-option
                v-for="item in optionShift"
                :key="item.value"
                :label="item.value"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </div>
        <div class="button-box">
          <el-switch
            v-model="isMeter"
            active-text="需要过磅"
            inactive-text="不需要过磅"
          >
          </el-switch>
          <el-button type="primary" @click="makeSure">保存</el-button>
        </div>
      </el-form>
      <div class="checkBox">
        <div class="checkTitle">
          <span>抽取区</span>
        </div>
        <div class="checkArea">
          <el-form class="demo-form-inline" label-width="80px" :inline="true">
            <el-form-item label="炉号">
              <el-input
                class="inline-input"
                v-model.number="checkHeatNo"
                style="width:150px"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="抽取支数">
              <el-input
                class="inline-input"
                v-model.number.lazy="checkCount"
                style="width:150px"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="抽取重量">
              <el-input
                class="inline-input"
                v-model.lazy="checkWeight"
                style="width:150px"
              >
              </el-input>
            </el-form-item>
          </el-form>
          <div class="checkButton">
            <el-button type="primary" @click="checkBillet">抽取</el-button>
          </div>
        </div>
      </div>
    </div>
    <div class="query">
      <el-divider></el-divider>
      <el-form :inline="true">
        <el-form-item>
          <label class="el-form-item__label" style="width: auto;"
            >发坯日期：</label
          >
          <el-date-picker
            v-model="startTime"
            type="date"
            placeholder="选择日期"
            style="width:150px"
          >
          </el-date-picker>
          <span>至</span>
          <el-date-picker
            v-model="endTime"
            type="date"
            placeholder="选择日期"
            style="width:150px"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="选择班别" style="margin-left:10px">
          <el-select
            class="inline-select"
            v-model="clazz"
            style="width:150px"
            clearable
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.value"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="选择班次" style="margin-left:10px">
          <el-select
            class="inline-select"
            v-model="shift"
            style="width:150px"
            clearable
          >
            <el-option
              v-for="item in optionShift"
              :key="item.value"
              :label="item.value"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          ><el-button type="primary" class="btn" @click="onclick">
            <i class="el-icon-search"></i> </el-button
        ></el-form-item>
      </el-form>
    </div>
    <div class="table">
      <mergeRowTable v-bind.sync="first" ref="table" :isShowGroup="false">
        <el-table-column label="操作" width="80px" fixed="right">
          <template slot-scope="scope">
            <el-button
              type="text"
              @click="deleteOrder(scope)"
              size="mini"
              v-if="scope.row.orderStatus != '已收货'"
            >
              删除
            </el-button>
          </template>
        </el-table-column>
      </mergeRowTable>
    </div>
  </div>
</template>

<script>
import PageTitle from '@/components/Page/Title'
import { sjTime } from '@/utils/sharedJsFile'
import { getCookie } from '@/utils/util.js'
import { isNumber } from '../../../ADMINISTRATORS/app'
export default {
  components: { PageTitle },
  data() {
    return {
      startTime: null,
      endTime: null,
      checkWeight: null,
      checkCount: null,
      checkHeatNo: null,
      requireUnitId: null,
      requireUnitName: null,
      heatNo: null,
      requirementType: '计重',
      clazz: null,
      type: null,
      model: null,
      capacityId: null,
      capacityNumber: null,
      loadPoint: null,
      unloadPoint: null,
      count: null,
      shift: null,
      optionShift: [
        {
          value: '早'
        },
        {
          value: '中'
        },
        {
          value: '夜'
        }
      ],
      options: [
        {
          value: '甲'
        },
        {
          value: '乙'
        },
        {
          value: '丙'
        },
        {
          value: '丁'
        }
      ],
      options1: [
        {
          value: 'Q215'
        },
        {
          value: 'HPB300'
        },
        {
          value: 'HRB400E'
        },
        {
          value: 'HRB400'
        },
        {
          value: 'HRB500'
        },
        {
          value: 'HRB500E'
        },
        {
          value: 'HRB600'
        }
      ],
      options2: [
        {
          value: 'Φ16'
        },
        {
          value: 'Φ6.5'
        },
        {
          value: 'Φ6'
        },
        {
          value: 'Φ8'
        },
        {
          value: 'Φ10'
        },
        {
          value: 'Φ12'
        },
        {
          value: 'Φ14'
        },
        {
          value: 'Φ36'
        },
        {
          value: 'Φ40'
        }
      ],
      optionsCapacity: [],
      optionsLoad: [],
      optionsUnload: [],
      capacityIds: [],
      first: {
        // first请求数据的地址
        requestUrl: '',
        requestQuery: {}
      },
      isMeter: '需要过磅'
    }
  },
  mounted() {
    this.getRequireUnit()
    this.getLoadPoint()
    this.getUnloadPoint()
    this.getCapacity()
  },
  watch: {
    heatNo() {
      this.checkHeatNo = this.heatNo
    },
    checkHeatNo() {
      this.heatNo = this.checkHeatNo
    },
    count() {
      this.computeWeight()
    },
    singleWeight() {
      this.computeWeight()
    },
    checkCount() {
      if (
        !(this.checkCount < 7 && this.checkCount > 3) &&
        isNumber(this.checkCount)
      ) {
        this.$message.error('抽取支数不能大于7支小于4支')
        this.checkCount = null
      }
    }
  },
  created() {
    if (
      getCookie('orgCode') == 'dagangadmin' ||
      getCookie('orgCode') == 'zidonghuabu'
    ) {
      this.first.requestUrl = '/api/v1/ams/getBilletRequirementList?apiId=518'
    } else {
      this.first.requestUrl =
        '/api/v1/ams/getBilletRequirementList?apiId=518&orgCode=' +
        getCookie('orgCode')
    }
  },
  methods: {
    onclick() {
      let startTime = null
      let endTime = null
      let obj = {}
      if (this.startTime && this.endTime) {
        startTime = sjTime(this.startTime)
        endTime = sjTime(this.endTime)
      }
      if (this.clazz) {
        obj.clazz = this.clazz
      }
      if (this.shift) {
        obj.shift = this.shift
      }
      this.first.requestQuery = obj
      this.first.requestUrl =
        '/api/v1/ams/getBilletRequirementList?apiId=518&startTime=' +
        startTime +
        '&endTime=' +
        endTime +
        '&i=' +
        new Date()
    },
    getRequestUrl() {
      if (
        getCookie('orgCode') == 'dagangadmin' ||
        getCookie('orgCode') == 'zidonghuabu'
      ) {
        this.first.requestUrl =
          '/api/v1/ams/getBilletRequirementList?apiId=518&i=' + new Date()
      } else {
        this.first.requestUrl =
          '/api/v1/ams/getBilletRequirementList?apiId=518&orgCode=' +
          getCookie('orgCode') +
          '&i=' +
          new Date()
      }
    },
    deleteOrder(scope) {
      let map = {
        orderId: scope.row.orderId,
        userId: getCookie('userId')
      }
      this.$confirm('是否删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.axios.post('/api/v1/oms/closeOmstruckOrder', map).then(res => {
            if (res.data.code == 200) {
              this.$message({
                type: 'success',
                message: '删除成功!'
              })
              this.getRequestUrl()
            } else {
              this.$message({
                message: '删除失败',
                type: 'warning'
              })
            }
          })
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    },
    checkBillet() {
      if (this.checkWeight && this.checkCount && this.checkHeatNo) {
        if (this.checkWeight > 25 || this.checkWeight < 8) {
          this.$message.error('抽取重量不能大于25t或者小于8t')
          this.checkWeight = null
          return
        } else {
          let map = {
            checkWeight: this.checkWeight,
            checkCount: this.checkCount,
            checkHeatNo: this.checkHeatNo,
            orgCode: getCookie('orgCode')
          }
          this.axios.post('/api/v1/ams/checkBillet', map).then(res => {
            if (res.data.code == 200) {
              this.$message.success('抽取成功')
              this.getRequestUrl()
              this.checkWeight = null
              this.checkCount = null
              this.checkHeatNo = null
            } else if (res.data.code == '201') {
              this.$message.error('该炉号已抽取,不能重复抽取')
              this.checkWeight = null
              this.checkCount = null
              this.checkHeatNo = null
            } else {
              this.$message.error('抽取失败,请联系管理员')
            }
          })
        }
      }
    },
    resetCapacity() {
      this.getCapacity()
    },
    deleteRow(index) {
      this.selectionList.splice(index, 1)
    },
    //获取炼钢厂连铸车间
    getRequireUnit() {
      this.axios
        .post('/api/v1/uc/getRequireUnitName?index=炼钢厂连铸车间')
        .then(res => {
          if (res.data.code == '200') {
            this.requireUnitId = res.data.data[0].shipperId
            this.requireUnitName = res.data.data[0].shipperName
          }
        })
    },
    //查询装货点
    getLoadPoint() {
      this.axios
        .post('/api/v1/uc/getUnloadingMesByLike?apiId=374&index=连铸车间')
        .then(res => {
          if (res.data.code == '200') {
            this.optionsLoad = res.data.data.list
            this.loadPoint = parseInt(this.optionsLoad[0].warehouseId)
          }
        })
    },
    //查询卸货点
    getUnloadPoint() {
      this.axios
        .post('/api/v1/uc/getUnloadingMesByLike?apiId=374', {
          warehouseName: ['一棒车间', '高线车间']
        })
        .then(res => {
          if (res.data.code == '200') {
            this.optionsUnload = res.data.data.list
          }
        })
    },
    //查询车牌号
    getCapacity() {
      this.axios
        .post(
          '/api/v1/uc/getAllCapacityByCarrierLike?apiId=429&con=钢坯&carrierSsoId=1024042523359842304'
        )
        .then(res => {
          if (res.data.code == '200') {
            //过滤
            let arr = []
            // this.selectionList = res.data.data.list
            res.data.data.list.forEach(e => {
              let map = {}
              map.capacityNumber = e.capacityNumber
              map.capacityId = e.capacityId
              arr.push(map)
            })
            this.optionsCapacity = Array.from(arr)
            console.log(this.optionsCapacity)
            // console.log(Array.from(this.optionsCapacity))
            // console.log(res.data.data.list)
          }
        })
    },
    // 新增
    makeSure() {
      let capacityList = []
      let e = {
        capacityId: this.capacityId
      }
      capacityList.push(e)
      let map = {
        requirementShipperId: this.requireUnitId,
        heatNo: this.heatNo,
        requirementType: '计重',
        clazz: this.clazz,
        shift: this.shift,
        type: this.type,
        model: this.model,
        requirementPlatformId: this.loadPoint,
        requirementUnloadUnitId: this.unloadPoint,
        capacityList: capacityList,
        count: this.count,
        orgCode: getCookie('orgCode'),
        isMeter: this.isMeter
      }
      console.log('map:', map)
      if (
        !map.requirementShipperId ||
        !map.heatNo ||
        !map.requirementType ||
        !map.clazz ||
        !map.type ||
        !map.model ||
        !map.requirementPlatformId ||
        !map.requirementUnloadUnitId ||
        !map.count ||
        map.capacityList.length <= 0
      ) {
        this.$message.warning('每项都为必填！')
        return
      }
      if (!isNumber(map.count)) {
        this.$message.error('支数不为整数！')
        return
      } else if (map.count > 25) {
        this.$message.error('支数必须小于等于25支')
        return
      }
      //提交
      this.axios.post('/api/v1/ams/addBilletRequirement', map).then(res => {
        if (res.data.code == '200') {
          this.$message({
            type: 'success',
            message: '派发成功!',
            duration: 1000,
            offset: '250'
          })
          this.getRequestUrl()
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.inwardRequirement {
  .requireUnit {
    display: flex;
    justify-content: start;
    align-items: flex-start;
    margin-top: 20px;
    .text {
      display: inline-block;
      width: 170px;
      text-align: right;
      .input {
        width: 250px;
        margin-right: 90px;
      }
    }
    .top1 {
      margin-right: 100px;
    }
    .top4 {
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: 20px;
      margin-bottom: 10px;
    }
    .checkBox {
      height: 250px;
      width: 300px;
      background-color: aqua;
      border-radius: 20px;
      margin-bottom: 20px;
      .checkTitle {
        border: 1px solid #ffff;
        font-size: 20px;
        height: 40px;
        font-weight: 600;
        line-height: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 5px;
      }
      .checkArea {
        // display: flex;
        // justify-content: center;
        // align-items: center;
        .checkButton {
          display: flex;
          justify-content: center;
          align-items: flex-start;
        }
      }
    }
    .button-box {
      margin-top: 20px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      .el-button {
        margin-top: 20px;
      }
    }
  }
  .query {
    margin-left: 10px;
  }
  .table {
    margin-left: 10px;
  }
}
</style>
<style>
.el-drawer__body {
  overflow: auto;
}
.el-drawer__container ::-webkit-scrollbar {
  display: none;
}
</style>