mes-sdai-admin-backend-ui/src/view/performance/lingliaobaogong.vue

<template>
    <div>
      <layout>
        <!-- <layout-header> -->
          <div class="gva-table-box">
              <h1 style="margin: 0%;margin-bottom: 6px;">领料报工</h1>
              <el-row :gutter="24" style="margin-bottom: 6px;">
                    <el-input v-model="add_searchInfo" placeholder="请扫描子订单编号"
                                  @keyup.enter="add_onSubmit"
                                  id="searchInput" 
                                  style="width: 220px;height: 50px;margin-left: 10px;">
                                  </el-input>
                    <el-button type="primary" icon="search" @click="add_onSubmit" style="height: 50px;">领料报工</el-button>
                    <el-form-item label="机台号:" prop="jitaihao" class="mab" style="font-size: 30px;margin: 10px;" label-width="116px">
					    <el-input v-model="add_formData['机台号']" readonly style="width: 100px; height: 40px;" id="jitaihao" />
					</el-form-item>
					<el-form-item label="工序:" prop="gongxu" class="mab" style="font-size: 30px; margin: 10px;" label-width="81px">
					    <el-input v-model="add_formData['工序']" readonly style="width: 100px; height: 40px;" id="gongxu" />
					</el-form-item>
					<el-form-item label="组别:" prop="zubie" class="mab" style="font-size: 30px; margin: 10px;" label-width="81px">
					    <el-input v-model="add_formData['组别']" readonly style="width: 110px; height: 40px;" id="zubie" />
					</el-form-item>
					<el-form-item label="人员:" prop="renyuan" class="mab" style="font-size: 30px; margin: 10px;" label-width="81px">
					    <el-input v-model="add_formData['人员']" readonly style="width: 110px; height: 40px;" id="renyuan" />
					</el-form-item>
              </el-row>
          </div>
       
      </layout>
    </div>
  </template>
  <script setup>
  // 全量引入格式化工具 请按需保留
  import { Layout, LayoutSider, LayoutContent } from '@arco-design/web-vue';
  import {ref, reactive} from 'vue'
  import {processAdd,getMachineMac} from '@/api/mes/job'
  import {ElMessage} from "element-plus";
  import { get } from 'scriptjs';
  defineOptions({name: 'Company'})
  import { useUserStore } from '@/pinia/modules/user'
  
  const userStore = useUserStore()
  const _username = ref('')
  _username.value = userStore.userInfo.userName + '/' + userStore.userInfo.nickName
  
  //全局调用获取当前日期
  const today = new Date();
  const year = today.getFullYear();
  const month = String(today.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始，需要补零
  const day = String(today.getDate()).padStart(2, '0');
  const hours = String(today.getHours()).padStart(2, '0');
  const minutes = String(today.getMinutes()).padStart(2, '0');
  const seconds = String(today.getSeconds()).padStart(2, '0');
  const currentDate = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
  const currentDates = `${year}-${month}-${day}`;
  

  
  const add_formData = reactive({
	机台号: '',	
	工序: '',
	组别: '',
	人员: '',	
	尺码: '',
	数量: '',
	是否订单尾包: '',
  });

//全局获取code，接口接收code
const _code = '领料'
//全局接口接受的物理地址
const Machine = ref('')
//全局获取UniqId
const UniqId = ref('')

//物理地址获取机台编号
const getMachineMacdata = async () => {
  console.log("本页面获取物理地址",Machine.value)
  try {
    const data  = await getMachineMac({sys_sbID:Machine.value});
	add_formData['机台号'] = data.data['机台号']
	add_formData['工序'] = data.data['生产工序']
	add_formData['组别'] = data.data['组别']
	add_formData['人员'] = data.data['组长']
  setTimeout(() => {
				const inputElement = document.getElementById('searchInput');
				if (inputElement) {
					inputElement.focus();		
				}
			}, 100); // 延迟100毫秒
  } catch (error) {
    console.error(error)
  }
}
//自动获取物理地址
const GetAddr =  () => {
  var xmlhttp = null;
  var res;
  if (window.XMLHttpRequest) {
    xmlhttp = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  // 2. 设置回调函数
  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
      res = eval('('+xmlhttp.response+')');
      let result = ''
      for (let i = 0; i < res.macAddress.length; i++) {
        if (i % 2 === 0 && i !== 0) {
          result += '-' // 根据实际需求修改分隔符
        }
        result += res.macAddress[i]
      }
	  Machine.value = result
    getMachineMacdata(Machine.value)
    }
  }
  // 3. 打开一个连接
  xmlhttp.open("get", "http://127.0.0.1:8090/init")
  // 5. 发送
  xmlhttp.send();
}
GetAddr()

const add_searchInfo = ref('')//搜索

//点击【查询】按钮
const add_onSubmit = async ()=>{
    setTimeout(() => {
        const inputElement = document.querySelector('#searchInput');
        if (inputElement) {
            inputElement.focus();
        }
    }, 100); // 延迟100毫秒
    
  if(add_searchInfo.value === ''){
    ElMessage({type: 'warning',message: '请扫描子订单编号' })
  }else{
    //领料
    let llparams = {};
    llparams.子订单编号 = add_searchInfo.value
    llparams.班组 = add_formData['机台号']
    llparams.订单编号 = add_searchInfo.value.split('-')[0]
    llparams.Sys_id = _username.value
    const processAdd_post = await processAdd(llparams);
    console.log(processAdd_post)
    if (processAdd_post.code === 0) {
      add_searchInfo.value = ''

      ElMessage({type: 'success',message: '领料成功'})
    } else {
      ElMessage({ type: 'error',message: '领料失败'})
    }
  }
};

  // =========== 分页 ===========
  // 分页相关的响应式变量
  const page = ref(1)
  const total = ref(0)
  const pageSize = ref(10)
  // 分页
  const handleCurrentChange = (val) => {
    page.value = val;
    _getStaffList();
  };
  
  // 修改页面容量 点击多少条/页
  const handleSizeChange = (val) => {
    page.value = 10;//默认显示
    pageSize.value = val;
    _getStaffList();
  };
  
  //根据出库状态文字颜色
  const tableDataCellClass = ({row, column, rowIndex, columnIndex}) =>{
    if(row['是否出库'] === '已出库'){
      return 'status-plan-usage-low';
    }
    if(row['是否出库'] === '未出库'){
      return 'statusy-plan-usage-low';
    }
  }
  </script>
  <style scoped>
  /* 根据出库状态文字颜色 */
  :deep(.status-plan-usage-low div) {
    color: #8c939d  !important;
  }
  :deep(.statusy-plan-usage-low div) {
    color: blue !important;
  }
  .form-container {
    display: flex;
    flex-wrap: wrap;
  }
  .form-column {
    /*flex: 1;*/
    margin-right: 15px; /* 调整列之间的间距 */
  }
  /* 左侧输入框宽度调整 */
  .form-column .el-form-item .el-input {
    width: 150px; /* 调整左侧输入框的宽度 */
  }
  /* 媒体查询，根据需要调整断点 */
  @media screen and (max-width: 768px) {
    .form-column {
      flex: 1 0 100%; /* 在小屏幕下变成单列布局 */
      margin-right: 0;
    }
  }
  .JKWTree-container {
    display: flex;
  }
  .JKWTree-tree {
    /*width: 300px;*/
    background-color: #fff;
    padding: 10px;
    margin-right: 20px;
  }
  .JKWTree-tree h3 {
    font-size: 15px;
    font-weight: 700;
    margin: 10px 0;
  }
  .JKWTree-content {
    flex: 1;
  }
  /* 表格复选框大小调整 */
  :deep(.el-checkbox.el-checkbox--small .el-checkbox__inner) {
      width: 45px; /* 复选框宽度 */
      height: 23px; /* 复选框高度 */
  }
  :deep(.el-checkbox.el-checkbox--small.is-checked .el-checkbox__inner::after) {
      transform: scale(1.2) rotate(45deg); /* 调整选中后的对勾大小 */
      top: 5%; /* 调整对勾位置 */
      left: 40%; /* 调整对勾位置 */
      width: 5px; /* 调整对勾宽度 */
      height: 9px; /* 调整对勾高度 */
  }
  /* 选中某行时的背景色 */
  :deep(.el-table__body tr.current-row) > td {
    background: #ff80ff !important;
  }
  </style>
  <style scoped>
  :deep(.el-table td .cell) {
    line-height: 20px !important;
  }
  :deep(.el-tabs__header){
    margin-bottom: 0;
  }
  .search{
    margin-left: 0px !important;
    margin-right: 10px !important;
  }
  .bt{
    margin-left: 2px !important;
    padding: 3px !important;
    font-size: 12px;
  }
  .el-tabs__header{
    margin: 0px !important;
  }
  .gva-table-box{
    padding: 0px !important;
    margin-left: -10px !important;
  }
  .mab{
    margin-bottom: 5px;
  }


/* 搜索样式 */
::v-deep .el-input__wrapper #searchInput {  
  font-size: 16px; 
} 
::v-deep .el-input__wrapper #jitaihao {  
  font-size: 18px; 
}  
::v-deep .el-input__wrapper #gongxu {  
  font-size: 18px; 
}  
::v-deep .el-input__wrapper #zubie {  
  font-size: 18px; 
}  
::v-deep .el-input__wrapper #renyuan {  
  font-size: 18px; 
} 
  </style>