mes-sdai-admin-backend-ui/src/view/yunyin/shengchanguanli/chengpinrucang.vue

<template>
  <div>
    <!-- 左侧树形结构 -->
    <el-container>
      <el-aside width="250px">
        <div class="JKWTree-tree">
          <h3>成品入仓管理</h3>
          <el-tree :data="treeData" :props="defaultProps" highlight-current="true"
            @node-click="handleNodeClick"></el-tree>
        </div>
      </el-aside>

      <el-container>
        <el-main>
          <!-- 按钮区域 -->
          <div class="gva-table-box">
            <el-form-item>
              <el-input v-model="positionvalue" placeholder="输入工单编号或产品名称" style="width: 180px;"/>
              <el-button type="primary" class="search" icon="search" @click="onSearch"></el-button>
              <el-button type="primary" class="bt" @click="onDel">删除</el-button>
			  <el-button type="primary" class="bt" @click="onSMB">入仓末板数据统计</el-button>
			  <el-button type="primary" class="bt" @click="onDay">各日统计</el-button>
			  <el-button type="primary" class="bt" @click="onAdd">新增</el-button>
			  
              <div style="margin-left: auto;">			
                <el-button type="primary" class="bt" icon="Download" @click="exportExcel">导出到Excel</el-button>
              </div>
            </el-form-item>
            <!-- 数据展示 -->
            <el-table ref="multipleTable" style="width: 100%" tooltip-effect="dark" :data="tableData" row-key="ID" @row-click="Click"
              highlight-current-row="true" border @selection-change="handleSelectionChange" :show-overflow-tooltip="true" @row-dblclick="doubleClick">
              <el-table-column type="selection" width="55" />
			  <el-table-column align="left" sortable  label="入仓类型" prop="入仓类型" width="120"/>
              <el-table-column align="left" sortable  label="仓库编号" prop="仓库编号" width="120"/>
              <el-table-column align="left"  sortable label="仓库名称" prop="仓库名称" width="120"/>
              <el-table-column align="left" sortable  label="入仓单号" prop="jjcp_num" width="120"/>
              <el-table-column align="left" sortable  label="工单编号" prop="jjcp_gdbh" width="160"/>
              <el-table-column align="left" sortable  label="印件号" prop="jjcp_yjno" width="160"/>
              <el-table-column align="left" sortable  label="入仓数量" prop="jjcp_sl" width="120"/>
			  <el-table-column align="left" sortable  label="累计入仓数量" prop="jjcp_sls" width="140"/>
			  <el-table-column align="left" sortable label="订单数量" prop="订单数量" width="120"/>
			  <el-table-column align="left" sortable label="完成率" prop="完成率" width="120"/>
			  <el-table-column align="left" sortable label="单位" prop="jjcp_dw" width="120"/>
			  <el-table-column align="left" sortable label="入仓日期" prop="jjcp_sj" width="160"/>
			  <el-table-column align="left" sortable label="首末版" prop="jjcp_smb" width="160"/>
			  <el-table-column align="left" sortable label="印件代号" prop="jjcp_cpdh" width="120"/>
			  <el-table-column align="left" sortable label="印件名称" prop="jjcp_cpmc" width="120"/>
			  <el-table-column align="left" sortable label="产品编号" prop="成品编码" width="120"/>
			  <el-table-column align="left" sortable label="产品名称" prop="成品名称" width="120"/>
			  <el-table-column align="left" sortable label="客户料号" prop="客户料号" width="120"/>
			  <el-table-column align="left" sortable label="备注" prop="jjcp_desc" width="160"/>
			  <el-table-column align="left" sortable label="客户编号" prop="客户编号" width="160"/>
			  <el-table-column align="left" sortable label="客户名称" prop="Gd_客户名称" width="120"/>
			  <el-table-column align="left" sortable label="最近入仓日期" prop="最近入仓日期" width="140"/>
			  <el-table-column align="left" sortable label="机型备注" prop="机型备注" width="120"/>
			  <el-table-column align="left" sortable label="创建用户" prop="Sys_id" width="120"/>
			  <el-table-column align="left" sortable label="创建时间" prop="sys_rq" width="160"/>
			  <el-table-column align="left" sortable label="修改时间" prop="mod_rq" width="160"/>
			  <el-table-column align="left" sortable label="UNIQID" prop="UniqId" width="120"/>
            </el-table>
            <!-- 分页 -->
            <div class="gva-pagination">
              <el-pagination layout="total, sizes, prev, pager, next, jumper" v-model:current-page="page"
                v-model:page-size="limit"
                :page-sizes="[10, 30, 50, 100]" :total="total" @current-change="handleCurrentChange"
                @size-change="handleSizeChange" />
            </div>
          </div>
          <!-- 弹出框 -->
          <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="type === 'create' ? '添加' : '详情'"
            destroy-on-close width="800px">
            <!-- <el-scrollbar height="500px"> -->
            <el-form :model="formData" label-position="right" label-width="75px" ref="elFormRef" :rules="rule">

              <el-row :gutter="24">
			 <el-col :span="7">
			   <el-form-item label="入仓类型" prop="id">
				 <el-input v-model="formData.入仓类型" id="入仓类型"  @keydown="ent($event, '入仓备注', '入仓类型', '仓库编号')" :clearable="true" style="width: 120px;" />
			   </el-form-item>
			 </el-col>
			 <el-col :span="17">
			   <el-form-item label="仓库" prop="name" label-width="40px">
					 <el-input v-model="formData.仓库编号" id="仓库编号"  @keydown="ent($event, '入仓类型', '仓库编号', '仓库名称')"   :clearable="true" style="width: 120px;" />
					 <el-input v-model="formData.仓库名称" id="仓库名称"  @keydown="ent($event, '仓库编号', '仓库名称', '单据编号')" :clearable="true" style="width: 120px;" />
			   </el-form-item>
			 </el-col>
		   </el-row> 
		   
		   
		   <el-row :gutter="24">
			 <el-col :span="7">
			   <el-form-item label="单据编号" prop="id">
				 <el-input v-model="formData.jjcp_num"  id="单据编号"  @keydown="ent($event, '仓库名称', '单据编号', '工单编号')" :clearable="true"  style="width: 120px;"  />
			   </el-form-item>
			 </el-col>
		   </el-row> 
		   
		   
		   
		   <el-row :gutter="24">
			 <el-col :span="7">
			   <el-form-item label="工单编号" prop="id">
				 <el-input v-model="formData.jjcp_gdbh" id="工单编号"  @keydown="ent($event, '单据编号', '工单编号', '客户料号')" :clearable="true"  style="width: 120px;"  />
			   </el-form-item>
			 </el-col>
			 <el-col :span="5">
			   <el-form-item label="印件号" prop="name" label-width="55px">
					<el-input v-model="formData.jjcp_yjno" id="印件号" disabled :clearable="true"   style="width: 50px;" />
			   </el-form-item>	   
			 </el-col>
			 <el-col :span="12">
			   <el-form-item label="订单编号" prop="name">
					 <el-input v-model="formData.订单编号" id="订单编号" disabled :clearable="true"  style="width: 120px;"  />
			   </el-form-item>
			 </el-col>
		   </el-row> 
		   
           <el-row :gutter="24">
			 <el-col :span="24">
			   <el-form-item label="印件编号" prop="id">
				 <el-input v-model="formData.jjcp_cpdh" id="印件编号" disabled :clearable="true"  style="width: 120px;"  />
				<el-input v-model="formData.jjcp_cpmc"  id="jjcp_cpmc" disabled :clearable="true"  style="width: 500px; margin-left: 10px;" />
			   </el-form-item>
			 </el-col>
           </el-row> 
            
			
			<el-row :gutter="24">
			 <el-col :span="24">
			   <el-form-item label="产品编号" prop="id">
				 <el-input v-model="formData.成品编码" id="产品编号" disabled :clearable="true"   style="width: 120px;" />
					<el-input v-model="formData.成品名称" id="成品名称" disabled :clearable="true"   style="width: 500px; margin-left: 10px;" />
			   </el-form-item>
			 </el-col>
			</el-row> 

            <el-row :gutter="24">
			 <el-col :span="7">
			   <el-form-item label="客户料号" prop="id">
				 <el-input v-model="formData.客户料号" id="客户料号"  @keydown="ent($event, '工单编号', '客户料号', '首末板')" :clearable="true"  style="width: 120px;" />
			   </el-form-item>
			 </el-col>
            </el-row> 
			  
			  <el-row :gutter="24">
			   <el-col :span="7">
			     <el-form-item label="首末板" prop="id">
					 <el-input v-model="formData.jjcp_smb" id="首末板"  @keydown="ent($event, '客户料号', '首末板', '入仓时间')" :clearable="true"   style="width: 120px;" />
			     </el-form-item>
			   </el-col>
			   <el-col :span="17">
				    <el-form-item label="入仓时间" prop="id">
						<el-date-picker v-model="formData.jjcp_sj" type="datetime"  format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"id="入仓时间"   @keydown="ent($event, '首末板', '入仓时间', '入仓数量')"  style="width: 200px;"/>
						
						<!-- <el-input type="datetime" v-model="formData.jjcp_sj"  id="入仓时间"   @keydown="ent($event, '首末板', '入仓时间', '入仓数量')" :clearable="true" style="width: 120px;" />	 -->
					</el-form-item>
			   </el-col>
			  </el-row> 
			  
			  
			  <el-row :gutter="24">
			   <el-col :span="7">
			     <el-form-item label="入仓数量" prop="id">
			  	 <el-input v-model="formData.jjcp_sl" id="入仓数量"  @keydown="ent($event, '入仓时间', '入仓数量', '入仓单位')" :clearable="true" style="width: 120px;" />
			     </el-form-item>
			   </el-col>
			   <el-col :span="17">
			  	<el-form-item label="入仓单位" prop="id">
			   <el-input v-model="formData.jjcp_dw" id="入仓单位"  @keydown="ent($event, '入仓数量', '入仓单位', '订单数量')" :clearable="true" style="width: 120px;" />	
			    </el-form-item>
			   </el-col>
			  </el-row> 
			  
			  
			  <el-row :gutter="24">
			   <el-col :span="7">
			     <el-form-item label="订单数量" prop="id">
			  	 <el-input v-model="formData.订单数量" id="订单数量" @blur="" @keydown="ent($event, '入仓单位', '订单数量', '已完工')" :clearable="true" style="width: 120px;" />
			     </el-form-item>
			   </el-col>
			   <el-col :span="7">
			  	<el-form-item label="已完工" prop="id">
			   <el-input v-model="formData.jjcp_sls" id="已完工"  @keydown="ent($event, '订单数量', '已完工', '机型备注')" :clearable="true" style="width: 120px;" />	
			    </el-form-item>
			   </el-col>
			   <el-col :span="8">
			   			  	<el-form-item label="机型备注" prop="id">
			   <el-input v-model="formData.机型备注" id="机型备注"  @keydown="ent($event, '已完工', '机型备注', '入仓备注')" :clearable="true"  style="width: 300px;"/>	
			    </el-form-item>
			   </el-col>
			  </el-row> 
			  
			  
			  <el-row :gutter="24">
				 <el-col :span="22">
				   <el-form-item label="入仓备注" prop="id">
					 <el-input v-model="formData.jjcp_desc"  id="入仓备注"  @keydown="ent($event, '机型备注', '入仓备注', '入仓类型')":clearable="true"  />
				   </el-form-item>
				 </el-col>
			  </el-row> 
			  
            </el-form>
            <!-- </el-scrollbar> -->
            <template #footer>
              <div class="dialog-footer">
                <el-button @click="closeDialog">取 消</el-button>
                <el-button type="primary" @click="enterDialog">确 定</el-button>
              </div>
            </template>
          </el-dialog>


		<!-- 仓库编号选择 -->
          <el-dialog v-model="CKVisible" title="选择"
            destroy-on-close width="600px" @keydown="selectCK($event)" >
            <el-table tooltip-effect="dark"
              :data="CKselectData" row-key="ID"
              highlight-current-row="true" border style="width:100%"
              @row-dblclick="CKSelectClick"
			  ref="table2"
            >
              <el-table-column prop="编号" label="编号" width="200" />
			  <el-table-column prop="名称" label="名称" width="200" />		      	 
            </el-table>
          </el-dialog>
		  
		  <!-- 入仓类型选择 -->
		  <el-dialog v-model="RCVisible" title="选择"
		    destroy-on-close width="400px" @keydown="selectRC($event)" >
		    <el-table tooltip-effect="dark"
		      :data="RCselectData" row-key="ID"
		      highlight-current-row="true" border style="width:100%"
		      @row-dblclick="RCSelectClick"
		  			  ref="tableRC"
		    >
		      <el-table-column prop="入仓类型" label="入仓类型" width="360" />		      	 
		    </el-table>
		  </el-dialog>
		  
		  <!-- 首末板选择 -->
		  <el-dialog v-model="SMBVisible" title="选择"
		    destroy-on-close width="200px" @keydown="selectSMB($event)" >
		    <el-table tooltip-effect="dark" :data="SMBselectData" row-key="ID"
		      highlight-current-row="true" border style="width:100%"
		      :row-style="{ height: '30px' }"
		      @row-dblclick="SMBSelectClick"
		  			  ref="tableSMB"
		    >
		      <el-table-column prop="jjcp_smb" label="" width="160" />		      	 
		    </el-table>
		  </el-dialog>
		  
		  <el-dialog v-model="GDVisible" title="选择" destroy-on-close width="600px" @keydown="selectGD($event)" >
		    <el-table tooltip-effect="dark" :data="GDselectData"
		      row-key="ID" highlight-current-row="true" border
		      style="width:100%" @row-dblclick="GDSelectClick"
			  ref="table3"
		    >
			<el-table-column prop="gdyj" label="工单印件" width="560" />
		    </el-table>
		  </el-dialog>
		  
		  
		  <el-dialog
		    v-model="TJVisible"
		    title="各日统计"
		    destroy-on-close
		    width="80%px;"
			style="height: 80%;"
			
		  			>
			<el-row :gutter="20">
			<el-col :span="41">
			  <el-form-item label="关键字" prop="id">
			  <el-input v-model="keywords" :clearable="true" placeholder="2023.12.14" />
			  </el-form-item>
			</el-col>
			 </el-row> 
		    <el-table
		      tooltip-effect="dark"
		      :data="TJselectData"
		      row-key="ID"
		      highlight-current-row="true"
		      border
		      style="width:100%"
			  height="300px"
		      @row-dblclick="TJSelectClick"
		    >
		      <el-table-column
		        prop="jjcp_sj"
		        label="完工日期"
		        width="200"
		      />
			  <el-table-column
				prop="jjcp_gdbh"
				label="工单编号"
				width="200"
			  />
			  <el-table-column
			    prop="jjcp_cpmc"
			    label="印件(产品名称)"
			    width="200"
			  />
			  <el-table-column
				prop="实际投料"
				label="实际投料"
				width="200"
			  />
			  <el-table-column
			    prop="入仓数量"
			    label="入仓数量"
			    width="200"
			  />
			  <el-table-column
				prop="投入产出率"
				label="投入产出率"
				width="200"
			  />
		    </el-table>
		  </el-dialog>
		  
		  
		  <el-dialog
		    v-model="SMVisible"
		    title="选择"
		    destroy-on-close
		    width="1200px"
			
		  			>
		    <el-table
		      tooltip-effect="dark"
		      :data="SMselectData"
		      row-key="ID"
		      highlight-current-row="true"
		      border
		      style="width:180%"
			  height="500px"
		      @row-dblclick="SMSelectClick"
		    >
				<el-table-column
				  prop="Yj_Gdbh"
				  label="工单编号"
				  width="180"
				/>
		      <el-table-column
		        prop="yj_Yjno"
		        label="印件号"
		        width="200"
		      />
			  <el-table-column
				prop="yj_yjmc"
				label="印件名称"
				width="200"
			  />
			  <el-table-column
				prop="yj_成品数量"
				label="计划交货数量"
				width="200"
			  />
			  <el-table-column
				prop="yj_实际投料"
				label="印件投料"
				width="200"
			  />
			  <el-table-column
				prop="jjcp_sls"
				label="包装产量"
				width="200"
			  />
			  <el-table-column
				prop="sczl_cls"
				label="入仓数量"
				width="200"
			  />
			  <el-table-column
				prop="jjcp_smb"
				label="缺数"
				width="200"
			  />
			  <el-table-column
				prop="客户料号"
				label="完工"
				width="200"
			  />
			  <el-table-column
				prop="jjcp_sj"
				label="最近入仓时间"
				width="200"
			  />
		    </el-table>
		  </el-dialog>
		  
        </el-main>
      </el-container>
    </el-container>

  </div>
</template>

<script setup>
import {
  finishedTab,
  finishedTabByGdbh,
  finishedList,
  finishedlocate,
  finishedInfo,
  finishedgetCk,
  finishedgetGd,
  finishedgetGdsl,
  finisheddel,
  getDayList,
  mbList,
  finishedadd,
  finishedEdit
} from '@/api/jixiaoguanli/jitairibaobiao'

// 全量引入格式化工具 请按需保留
import { getDictFunc, formatDate, formatBoolean, filterDict, ReturnArrImg, onDownloadFile } from '@/utils/format'
import { ElMessage, ElMessageBox } from 'element-plus'
import { Search, Refresh, Download } from '@element-plus/icons-vue'
import { ref, reactive, onMounted, onBeforeMount } from 'vue'
import { getPackingSideTable, getPackingTable } from '@/api/mes_api_gty/myapi'
import { TRUE } from 'sass'
import { useUserStore } from '@/pinia/modules/user'
const userStore = useUserStore() 
const sys_id='['+userStore.userInfo.userName+'/'+userStore.userInfo.nickName+']'
defineOptions({
  name: '06-packingDocuments'
})

// 侧边栏数据请求
const treeData = reactive([]);

const getTabdata = async () => {
    //接口调用函数
    const response  = await finishedTab();
	console.log(response)
	
	
	const transformedData = response.data.map(item => ({
	      label: `${item.date.replace(/-/g, '.')}【单据数: ${item.counts}张】`,
	      children: item.sys.map(sysItem => ({
	        label: `${sysItem.sys_id} 【记录数: ${sysItem.count}张】`,
	        params: {
	          date: item.date.replace(/\./g, '-'),
	          sys_id: sysItem.sys_id,
	          total: sysItem.count,
	        },
	      })),
	    }));
	    treeData.splice(0, treeData.length, ...transformedData);

	
	}
	const rqHandleFocus = () =>{
		if(formData.value.jjcp_sj==''){
			formData.value.jjcp_sj = new Date(new Date().getTime() + 8 * 60 * 60 * 1000).toISOString().slice(0, 19).replace('T', ' ');
			
		}
	}

getTabdata();

// 自动化生成的字典（可能为空）以及字段
const formData = ref({
	入仓类型: "",
	仓库编号: "",
	仓库名称: "",
	jjcp_num: "",
	jjcp_gdbh: "",
	jjcp_yjno: "",
	订单编号: "",
	jjcp_cpdh: "",
	jjcp_cpmc: "",
	成品编码: "",
	成品名称: "",
	客户料号: "",
	jjcp_smb: "",
	jjcp_sj: "",
	jjcp_sl: "",
	jjcp_dw: "",
	订单数量: "",
	jjcp_sls: "",
	机型备注: "",
	jjcp_desc: "",
	
})

const initFormData = () => {
	formData.value = {
		入仓类型: "",
		仓库编号: "",
		仓库名称: "",
		jjcp_num: "",
		jjcp_gdbh: "",
		jjcp_yjno: "",
		订单编号: "",
		jjcp_cpdh: "",
		jjcp_cpmc: "",
		成品编码: "",
		成品名称: "",
		客户料号: "",
		jjcp_smb: "",
		jjcp_sj: "",
		jjcp_sl: "",
		jjcp_dw: "",
		订单数量: "",
		jjcp_sls: "",
		机型备注: "",
		jjcp_desc: "",
	}
}
// 验证规则
const rule = reactive({
})

const elFormRef = ref()
const elSearchFormRef = ref()

// =========== 表格控制部分 ===========
const tableData = reactive([])
const detailData = reactive([
])
const total = ref(0)
const page = ref(1)
const limit = ref(10)
const searchInfo = ref('')
const params = {
  type: '',
  date: '',
  sys_id: '',
  gdbh: '',
}

// 分页设置
const handleSizeChange = (val) => {
  switch (params.type) {
    case 'getTableData':
      getTableData()
      break
    case 'getLocateTable':
      GetmachineLocate()
      break
    default:
      break
  }
}

// 页面跳转
const handleCurrentChange = (val) => {
  switch (params.type) {
    case 'getTableData':
      getTableData()
      break
    case 'getLocateTable':
      GetmachineLocate()
      break
    default:
      break
  }
}

// 查询
const getTableData = async () => {
	
	
  const response = await finishedList(params);
  console.log(response)
  if (response.code === 0) {
    tableData.splice(0, tableData.length, ...response.data.rows);
  }
}

const handleNodeClick = (node, check) => {
  //存放当前节点的nodeId
  if (node.params) {
    params.date = node.params.date;
    params.sys_id = node.params.sys_id;
    total.value = node.params.total;
    getTableData();
  }
}
let positionvalue=ref()
let keywords=ref()
// 搜索
function onSearch() {
  params.gdbh = positionvalue.value
  params.type = 'getLocateTable'
  page.value = 1
  GetmachineLocate()
}
const ADD=ref('0')
//新增
function onAdd() {
	// GetInfo(lastCellValue)
	initFormData()
	formData.value.jjcp_sj = new Date(new Date().getTime() + 8 * 60 * 60 * 1000).toISOString().slice(0, 19).replace('T', ' ');
	type.value='create'
	dialogFormVisible.value = true
}
//删除
function onDel() {
	Del()
}
//删除
const Del = async () => {
  const response = await finisheddel({UniqId:lastCellValue});
  if (response.code === 0) {
	ElMessage({
	  type: 'success',
	  message: '删除成功',
	})
  }
  getTableData()
}
const TJVisible = ref(false)
const TJselectData = ref([]);
//每日统计
function onDay() {
	GetDayList()
	TJVisible.value=true
}
const GetDayList = async (value) => {
  const response = await getDayList({key_word:'',page:page.value,limit:limit.value});
  console.log(response.data) 
  if (response.code === 0) {
	 TJselectData.value=response.data.rows
	 console.log(TJselectData)
  }
}
const SMVisible = ref(false)
const SMselectData = ref([]);
//首末版统计
function onSMB() {
	MbList()
	SMVisible.value=true
}
const MbList = async (value) => {
  const response = await mbList();
  console.log(response.data) 
  if (response.code === 0) {
	 SMselectData.value=response.data.rows
	 console.log(TJselectData)
  }
}
//定位
const GetmachineLocate = async () => {
  const response = await finishedlocate({
    gdbh: params.gdbh,
    page: page.value.toString(), limit: limit.value.toString(),
  })
  console.log(response)
  if (response.code === 0) {
    const processedData = response.data.rows.map(item => {
      return {
        ...item,
        combinedProp: item.sczl_gdbh + '--'+item.yj_yjmc,
        combinedProp2: item.sczl_yjgx + '-'+item.sczl_gxmc
      };
    });
	  total.value = response.data.total
    tableData.splice(0, tableData.length, ...processedData);
  }
}

//入仓类型回车事件
const getRCsubmit = (event) => {
	GetRC()
}
const RCVisible = ref(false)
const RCselectData = reactive([])
//获取仓库信息
const GetRC = async () => {
  const data = [{'入仓类型':'产品入库'},{'入仓类型':'委外入库'},{'入仓类型':'采购入库'}]
  RCselectData.splice(0, RCselectData.length, ...data)
  setRCCurrent(RCselectData[0])
  RCVisible.value=true
}
//选择
const RCSelectClick = (row, column, event) => {
  const { 入仓类型 } = row
  formData.value.入仓类型=入仓类型
  RCVisible.value = false
}
const tableRC=ref()
const setRCCurrent = (row) => {
  setTimeout(()=>{
	  tableRC.value?.setCurrentRow(row) 
	  const { 入仓类型 } = row
	  formData.value.入仓类型=入仓类型
  })
}
const RCIndex = ref(0);
const RCCurrent = ref(0);
const selectRC = (event) => {
    if (event.keyCode === 40) { // 向下箭头
        if (RCIndex.value < RCselectData.length - 1) {
            RCIndex.value++;
            setRCCurrent(RCselectData[RCIndex.value]);
        } else {
            RCIndex.value = 0;
            setRCCurrent(RCselectData[RCIndex.value]); // 到达最后一行时回到第一行			
        }
    } else if (event.keyCode === 38) { // 向上箭头
        if (RCIndex.value > 0) {
            RCIndex.value--;
            setRCCurrent(RCselectData[RCIndex.value]);
        } else {
            RCIndex.value = RCselectData.length - 1;
            setRCCurrent(RCselectData[RCIndex.value]); // 到达第一行时回到最后一行
        }
    } else if (event.keyCode === 13) { // 回车键
        RCVisible.value = false
    }
}


//仓库编号回车事件
const getCKsubmit = (event) => {
	GetCK()
}
const CKVisible = ref(false)
const CKselectData = reactive([])
//获取仓库信息
const GetCK = async () => {
  const response = await finishedgetCk();
  if (response.code === 0) {
  CKselectData.splice(0, CKselectData.length, ...response.data)
  setCKCurrent(CKselectData[0])
  CKVisible.value=true
  }
}
//选择
const CKSelectClick = (row, column, event) => {
  const { 编号,名称 } = row
  formData.value.仓库编号=编号
  formData.value.仓库名称=名称
  CKVisible.value = false
}
const table2=ref()
const setCKCurrent = (row) => {
  setTimeout(()=>{
	  table2.value?.setCurrentRow(row) 
	  const { 编号,名称 } = row
	  formData.value.仓库编号=编号
	  formData.value.仓库名称=名称
  })
}
const CKIndex = ref(0);
const JYCurrent = ref(0);
const selectCK = (event) => {
    if (event.keyCode === 40) { // 向下箭头
        if (CKIndex.value < CKselectData.length - 1) {
            CKIndex.value++;
            setCKCurrent(CKselectData[CKIndex.value]);
        } else {
            CKIndex.value = 0;
            setCKCurrent(CKselectData[CKIndex.value]); // 到达最后一行时回到第一行			
        }
    } else if (event.keyCode === 38) { // 向上箭头
        if (CKIndex.value > 0) {
            CKIndex.value--;
            setCKCurrent(CKselectData[CKIndex.value]);
        } else {
            CKIndex.value = CKselectData.length - 1;
            setCKCurrent(CKselectData[CKIndex.value]); // 到达第一行时回到最后一行
        }
    } else if (event.keyCode === 13) { // 回车键
        CKVisible.value = false
    }
}
  
//工单编号回车事件
const getGDsubmit = (event) => {
	if(formData.value.jjcp_gdbh==''){
		ElMessage({type: 'warning',message: '请填写工单编号'});
		return
	}
	GetGD()
}
const GDVisible = ref(false)
const GDselectData = reactive([])
//获取工单信息
const GetGD = async () => {
  const response = await finishedgetGd({gdbh:formData.value.jjcp_gdbh});
  if (response.code === 0) {
  GDselectData.splice(0, GDselectData.length, ...response.data)
  setGDCurrent(GDselectData[0])
  GDVisible.value=true
  }
}
//选择
const GDSelectClick = (row, column, event) => {
	console.log(111)
  const { Gd_gdbh,yj_yjno,销售订单号,yj_Yjdh,yj_yjmc,成品代号,成品名称,客户料号,gdyj } = row
  formData.value.jjcp_gdbh=Gd_gdbh
  formData.value.jjcp_yjno=yj_yjno
  formData.value.订单编号=销售订单号
  formData.value.jjcp_cpdh=yj_Yjdh
  formData.value.jjcp_cpmc=yj_yjmc
  formData.value.成品编码=成品代号
  formData.value.成品名称=成品名称
  formData.value.客户料号=客户料号
  finishedgetGdsl({gdbh:formData.value.jjcp_gdbh,cpdh:formData.value.jjcp_cpdh}).then(res =>{
	  if (res.code === 0) {
		  formData.value.订单数量 = res.data.订单数量
		  formData.value.jjcp_sls = res.data.jjcp_sls
	   }
  });
  GDVisible.value = false
}
const table3=ref()
const setGDCurrent = (row) => {
  setTimeout(()=>{
	  table3.value?.setCurrentRow(row) 
	  console.log(222)
	  const { Gd_gdbh,yj_yjno,销售订单号,yj_Yjdh,yj_yjmc,成品代号,成品名称,客户料号,gdyj } = row
	  formData.value.jjcp_gdbh=Gd_gdbh
	  formData.value.jjcp_yjno=yj_yjno
	  formData.value.订单编号=销售订单号
	  formData.value.jjcp_cpdh=yj_Yjdh
	  formData.value.jjcp_cpmc=yj_yjmc
	  formData.value.成品编码=成品代号
	  formData.value.成品名称=成品名称
	  formData.value.客户料号=客户料号	
		finishedgetGdsl({gdbh:formData.value.jjcp_gdbh,cpdh:formData.value.jjcp_cpdh}).then(res =>{
			  if (res.code === 0) {
				  formData.value.订单数量 = res.data.订单数量
				  formData.value.jjcp_sls = res.data.jjcp_sls
			   }
		});
  })
}
const GDIndex = ref(0);
const selectGD = (event) => {
    if (event.keyCode === 40) { // 向下箭头
        if (GDIndex.value < GDselectData.length - 1) {
            GDIndex.value++;
            setGDCurrent(GDselectData[GDIndex.value]);
        } else {
            GDIndex.value = 0;
            setGDCurrent(GDselectData[GDIndex.value]); // 到达最后一行时回到第一行			
        }
    } else if (event.keyCode === 38) { // 向上箭头
        if (GDIndex.value > 0) {
            GDIndex.value--;
            setGDCurrent(GDselectData[GDIndex.value]);
        } else {
            GDIndex.value = GDselectData.length - 1;
            setGDCurrent(GDselectData[GDIndex.value]); // 到达第一行时回到最后一行
        }
    } else if (event.keyCode === 13) { // 回车键
        GDVisible.value = false
    }
}

//获取订单资料
const getSLsubmit = (event) => {
	GetSL()
}
//获取工单数量信息
const GetSL = async () => {
	if(formData.value.jjcp_cpdh){
		
	}
  const response = await finishedgetGdsl({gdbh:formData.value.jjcp_gdbh,cpdh:formData.value.jjcp_cpdh});
  console.log(response) 
  if (response.code === 0) {
 formData.value.订单数量=response.data.订单数量
 formData.value.jjcp_sls=response.data.jjcp_sls
  }
}

//入仓类型回车事件
const getSMBsubmit = (event) => {
	GetSMB()
}
const SMBVisible = ref(false)
const SMBselectData = reactive([])
//获取仓库信息
const GetSMB = async () => {
  const data = [{'jjcp_smb':''},{'jjcp_smb':'首 板'},{'jjcp_smb':'末 板'},{'jjcp_smb':'首末板'}]
  SMBselectData.splice(0, SMBselectData.length, ...data)
  setSMBCurrent(SMBselectData[0])
  SMBVisible.value=true
}
//选择
const SMBSelectClick = (row, column, event) => {
  const { jjcp_smb } = row
  formData.value.jjcp_smb=jjcp_smb
  SMBVisible.value = false
}
const tableSMB=ref()
const setSMBCurrent = (row) => {
  setTimeout(()=>{
	  tableSMB.value?.setCurrentRow(row) 
	  const { jjcp_smb } = row
	  formData.value.jjcp_smb=jjcp_smb
  })
}
const SMBIndex = ref(0);
const SMBCurrent = ref(0);
const selectSMB = (event) => {
    if (event.keyCode === 40) { // 向下箭头
        if (SMBIndex.value < SMBselectData.length - 1) {
            SMBIndex.value++;
            setSMBCurrent(SMBselectData[SMBIndex.value]);
        } else {
            SMBIndex.value = 0;
            setSMBCurrent(SMBselectData[SMBIndex.value]); // 到达最后一行时回到第一行			
        }
    } else if (event.keyCode === 38) { // 向上箭头
        if (SMBIndex.value > 0) {
            SMBIndex.value--;
            setSMBCurrent(SMBselectData[SMBIndex.value]);
        } else {
            SMBIndex.value = SMBselectData.length - 1;
            setSMBCurrent(SMBselectData[SMBIndex.value]); // 到达第一行时回到最后一行
        }
    } else if (event.keyCode === 13) { // 回车键
        SMBVisible.value = false
    }
}


// ============== 表格控制部分结束 ===============

// 获取需要的字典 可能为空 按需保留
const setOptions = async () => {}


// 获取需要的字典 可能为空 按需保留
setOptions()

// 多选数据
const multipleSelection = ref([])
// 多选
const handleSelectionChange = (val) => {
  if(val.length>0){
  	// multipleSelection.value = val
  	const lenth=val.length
  	// ScrapFactor.gdbh=val[lenth-1].combinedProp.split('-')[0];
  	// const parts = val[lenth-1].combinedProp2.split('-')
  	// ScrapFactor.yjno=parts[0];
  	// ScrapFactor.gxh=parts[1];
  	// ScrapFactor.type=val[lenth-1].sczl_检验类别
  	// console.log(ScrapFactor)
  	lastCellValue=val[lenth-1].UniqId
  	console.log(val)
  	val.splice(0, val.length);  // 清空 val 数组	
  	console.log(lastCellValue)
  }
}

// 批量删除控制标记
const deleteVisible = ref(false)

// 多选删除
const onDelete = async () => {
  const ids = []
  if (multipleSelection.value.length === 0) {
    ElMessage({
      type: 'warning',
      message: '请选择要删除的数据'
    })
    return
  }
  multipleSelection.value &&
    multipleSelection.value.map(item => {
      ids.push(item.ID)
    })
  const res = await deleteCompanyByIds({ ids })
  if (res.code === 0) {
    ElMessage({
      type: 'success',
      message: '删除成功'
    })
    if (tableData.value.length === ids.length && page.value > 1) {
      page.value--
    }
    deleteVisible.value = false
    getTableData()
  }
}

// 行为控制标记（弹窗内部需要增还是改）
const type = ref('')

// 更新行
const updateCompanyFunc = async (row) => {
  const res = await findCompany({ ID: row.ID })
  type.value = 'update'
  if (res.code === 0) {
    formData.value = res.data.recompany
    dialogFormVisible.value = true
  }
}

// 弹窗控制标记
const dialogFormVisible = ref(false)

// 打开弹窗
const openDialog = () => {
  type.value = 'create'
  dialogFormVisible.value = true
}

// 关闭弹窗
const closeDialog = () => {
  dialogFormVisible.value = false
  formData.value = {
    address: '',
    image: '',
    name: '',
  }
}
// 弹窗确定
const enterDialog = async () => {
	if(formData.value.入仓类型==''){
		ElMessage({type: 'warning',message: '请选择入仓类型'});
		return;
	}
	if(formData.value.仓库编号==''){
		ElMessage({type: 'warning',message: '请选择仓库'});
		return;
	}
	if(formData.value.jjcp_gdbh==''){
		ElMessage({type: 'warning',message: '请填写工单编号'});
		return;
	}
	if(formData.value.jjcp_cpdh==''){
		ElMessage({type: 'warning',message: '请选择印件'});
		return;
	}
	if(formData.value.jjcp_sl==''){
		ElMessage({type: 'warning',message: '请填写入仓数量'});
		return;
	}
	
	const restoredData = {
		 Sys_id:sys_id,
		 入仓类型:formData.value.入仓类型,
		 仓库编号:formData.value.仓库编号,
		 仓库名称:formData.value.仓库名称,
		 jjcp_num:formData.value.jjcp_num,
		 jjcp_gdbh:formData.value.jjcp_gdbh,
		 jjcp_yjno:formData.value.jjcp_yjno,
		 订单编号:formData.value.订单编号,
		 jjcp_cpdh:formData.value.jjcp_cpdh,
		 jjcp_cpmc:formData.value.jjcp_cpmc,
		 成品编码:formData.value.成品编码,
		 成品名称:formData.value.成品名称,
		 客户料号:formData.value.客户料号,
		 jjcp_smb:formData.value.jjcp_smb,
		 jjcp_sj:formData.value.jjcp_sj,
		 jjcp_sl:formData.value.jjcp_sl,
		 jjcp_dw:formData.value.jjcp_dw,
		 机型备注:formData.value.机型备注,
		 jjcp_desc:formData.value.jjcp_desc,
	}
	console.log(lastCellValue)
    let res
    switch (type.value) {
      case 'create':
        res = await finishedadd(restoredData)
        break
      case 'update':
		restoredData.UniqId = lastCellValue;
        res = await finishedEdit(restoredData)
        break
      default:
        // res = await createCompany(formData.value)
        break
    }
    if (res.code === 0) {
      ElMessage({
        type: 'success',
        message: '创建/更改成功'
      })
      closeDialog()
      getTableData()
    }
  dialogFormVisible.value=false
}

//键盘 input框跳转
const ent = (event,id1,id2,id3) => {

  if (event.keyCode === 13 || event.keyCode === 40) { // Enter 或向下箭头
    if(id2=='入仓类型'){
    	getRCsubmit()
    }
	if(id2=='仓库编号'){
		getCKsubmit()
	}
	if(id2=='工单编号'){
		getGDsubmit()
	}
	if(id2=='首末板'){
		console.log(1111)
		getSMBsubmit()
	}
	if(id3!=''){
      document.getElementById(id3).focus()
    }
  } else if (event.keyCode === 38) { // 向上箭头
    if(id1!=''){
      document.getElementById(id1).focus()
    }
  }else if (event.keyCode === 8) { // 删除箭头
    if(id1!='' && document.getElementById(id2).value==''){
      document.getElementById(id1).focus()
    }
    console.log(document.getElementById(id2).value)
  }else if (event.keyCode === 37) { // 向左箭头
    if(id1!='' && document.getElementById(id2).selectionStart==0){
      document.getElementById(id1).focus()
    }
  }else if (event.keyCode === 39) { // 向右箭头
    if(id3!='' && document.getElementById(id2).selectionStart == document.getElementById(id2).value.length){
      document.getElementById(id3).focus()
    }
  }
}
let table=ref(5);
let lastCellValue=ref()
// 双击表格操作
function doubleClick(row, column, event) {
  type.value = 'update';
	  lastCellValue= row['UniqId'];
	table.value=lastCellValue
	 dialogFormVisible.value = true
  GetInfo(table.value)
}
// 单击表格操作
function Click(row, column, event) {
    lastCellValue= row['UniqId'];
   console.log(lastCellValue)
  
}
//获取详细信息
const GetInfo = async (value) => {
  const response = await finishedInfo({UniqId:value});
  if (response.code === 0) {
	formData.value=response.data;
  }
}
// 导出excel
function exportExcel() {
  console.log('导出到excel');
}


function openFolderDialog() {
  console.log('导出到excel');
}



// 生命周期钩子
onMounted(async () => {
});
</script>

<style>
.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;
}

/* 选中某行时的背景色*/
.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: 5px !important;
  padding: 5px !important;
  font-size: 15px;
}
.el-tabs__header{
  margin: 0px !important;
}
.gva-table-box{
  padding: 0px !important;
}
.mab{
  margin-bottom: 5px;
}
</style>