mes-zs-admin-backend-ui/src/view/performance/Packagingoutput.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">
            <div class="gva-btn-list">
              <el-row :span="6">
                <el-input v-model="positionvalue" placeholder="输入工单编号或产品名称" />
              </el-row>
              <el-button type="primary" :icon="Search" @click="onSearch">搜索</el-button>
              <el-button type="primary" :icon="Refresh">重置</el-button>
			  <el-button type="primary" :icon="Search" @click="positioningVisible">定位</el-button>
			  <el-button type="primary" :icon="Search" @click="onAdd">新增</el-button>
			  <el-button type="primary" :icon="Delete" @click="Del">删除</el-button>
              <div style="margin-left: auto;">
                <el-button type="primary" :icon="Download" @click="exportExcel">导出到Excel</el-button>
              </div>
            </div>
            <!-- 数据展示 -->
            <el-table ref="multipleTable" style="width: 100%" tooltip-effect="dark" :data="tableData" row-key="ID"
              highlight-current-row="true"  :cell-style="cellStyle" border @selection-change="handleSelectionChange" 
			  :show-overflow-tooltip="true" @row-click="Click" @row-dblclick="doubleClick">
              <el-table-column type="selection" width="55" />
<!-- 			  <el-table-column align="left" label="创建用户" prop="sys_id" width="120" />
              <el-table-column align="left" label="日期" prop="sczl_rq" width="120"/>
              <el-table-column align="left" label="包装产量" prop="sczl_cl" width="120"/>
              <el-table-column align="left" label="包装数量" prop="sczl_PgCl" width="120"/>
              <el-table-column align="left" label="创建时间" prop="sys_rq" width="160"/>
              <el-table-column align="left" label="修改时间" prop="mod_rq" width="160"/>
              <el-table-column align="left" label="UNIQID" prop="UniqId" width="120"/> -->
			 <!-- 循环渲染列 -->
				<el-table-column
				  v-for=" column in tableColumns "
				  :key="column.prop"
				  :prop="column.prop"
				  :label="column.label"
				  :width="column.width"
				  show-overflow-tooltip="true"
				/>
            </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="1200px">
            <!-- <el-scrollbar height="500px"> -->
            <el-form :model="gdbhformData" label-position="left" ref="elFormRef" :rules="rule">

              <el-row :gutter="20">

                <el-col :span="6">
                  <el-form-item label="日期" prop="name">
                    <el-row :gutter="20">
                      <el-col :span="12">
                        <el-input v-model="sczl_rqValue" :clearable="true" placeholder="" />
                      </el-col>
                    </el-row>
                  </el-form-item>
                </el-col>
              </el-row>


								<el-table
                               :data="detailData.table"
                               border
                               tooltip-effect="dark"
                               :row-style="{ height: '20px' }"
                               :cell-style="{ padding: '0px' }"
                               :header-row-style="{ height: '20px' }"
                               :header-cell-style="{ padding: '0px' }"
                             >
                               <el-table-column
                                 label="工单编号"
                                 width="100"
                               >
                                 <template #default="{ row, $index }">
                                   <el-input
                                     v-model="row.sczl_gdbh"
									 id="工单编号"  @keydown="ent($event, '零头', '工单编号', '印件工序')"
                                     @keyup.enter="handleEnter($index, row)"
                                   />
                                 </template>
                               </el-table-column>
                               <el-table-column
                                 label="印件工序"
                                 width="100"
                               >
                                 <template #default="{ row }">
                                   <el-input v-model="row.sczl_yjGx" id="印件工序"  @keydown="ent($event, '工单编号', '印件工序', '工序名称')" />
                                 </template>
                               </el-table-column>
                               <el-table-column
                                 label="工序名称"
                                 width="100"
                               >
                                 <template #default="{ row }">
                                   <el-input v-model="row.sczl_gxmc"  id="工序名称"  @keydown="ent($event, '印件工序', '工序名称', '印件名称')"/>
                                 </template>
                               </el-table-column>
                               <el-table-column label="印件名称">
                                 <template #default="{ row }">
                                   <el-input v-model="row.Gd_cpmc"  id="印件名称"  @keydown="ent($event, '工序名称', '印件名称', '包装产量')" />
                                 </template>
                               </el-table-column>
                               <el-table-column
                                 label="包装产量"
                                 width="100"
                               >
                                 <template #default="{ row }">
                                   <el-input v-model="row.sczl_cl" id="包装产量"  @keydown="ent($event, '印件名称', '包装产量', '每箱数量')"  />
                                 </template>
                               </el-table-column>
                               <el-table-column
                                 label="每箱数量"
                                 width="100"
                               >
                                 <template #default="{ row }">
                                   <el-input v-model="row.sczl_PgCl" id="每箱数量"  @keydown="ent($event, '包装产量', '每箱数量', '零头')" />
                                 </template>
                               </el-table-column>
                               <el-table-column
                                 label="零头"
                                 width="100"
                               >
							   <template #default="{ row }">
							     <el-input v-model="row.sczl_clAdd" id="零头"  @keydown="ent($event, '每箱数量', '零头', '工单编号')" />
							   </template>
                               </el-table-column>
                             </el-table>
                            <!-- 标题栏 -->
                            <!-- <el-row :gutter="10">
                              <el-col :span="3">
                                <span>工单编号</span>
                              </el-col>
                              <el-col :span="3">
                                <span>印件工序</span>
                              </el-col>
                              <el-col :span="3">
                                <span>工序名称</span>
                              </el-col>
                              <el-col :span="9">
                                <span>印件名称</span>
                              </el-col>
                              <el-col :span="2">
                                <span>包装产量</span>
                              </el-col>
							  <el-col :span="2">
							    <span>每箱数量</span>
							  </el-col>
							  <el-col :span="2">
							    <span>零头</span>
							  </el-col>
                            </el-row> -->
              
                            <!-- 员工1 -->
                            <!-- <el-row :gutter="5" style="margin-top: 10px;">
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gdbh1" :clearable="true" @keyup.enter.native="getGxMcsubmit($event, '1')" placeholder="ZI00401" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_yjGx1" :clearable="true" placeholder="瞿春生" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gxmc1" :clearable="true" placeholder="11.0" />
                              </el-col>
                              <el-col :span="9">
                                <el-input v-model="formData.Gd_cpmc1" :clearable="true" placeholder="打包废纸" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_cl1" :clearable="true" placeholder="是" />
                              </el-col>
							  <el-col :span="2">
							    <el-input v-model="formData.sczl_PgCl1" :clearable="true" placeholder="是" />
							  </el-col>
							  <el-col :span="2">
							    <el-input v-model="formData.sczl_clAdd1" :clearable="true" placeholder="是" />
							  </el-col>
                            </el-row> -->
              
                            <!-- 员工2 -->
  <!--                          <el-row :gutter="5" style="margin-top: 10px;">
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gdbh2" :clearable="true" @keyup.enter.native="getGxMcsubmit($event, '2')" placeholder="ZI00401" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_yjGx2" :clearable="true" placeholder="瞿春生" data-="" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gxmc2" :clearable="true" placeholder="11.0" />
                              </el-col>
                              <el-col :span="9">
                                <el-input v-model="formData.Gd_cpmc2" :clearable="true" placeholder="打包废纸" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_cl2" :clearable="true" placeholder="是" />
                              </el-col>
							  <el-col :span="2">
							    <el-input v-model="formData.sczl_PgCl2" :clearable="true" placeholder="是" />
							  </el-col>
							  <el-col :span="2">
							    <el-input v-model="formData.sczl_clAdd2" :clearable="true" placeholder="是" />
							  </el-col>
                            </el-row> -->
              
                            <!-- 员工3 -->
                            <!-- <el-row :gutter="5" style="margin-top: 10px;">
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gdbh3" :clearable="true" @keyup.enter.native="getGxMcsubmit($event, '3')" placeholder="ZI00401" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_yjGx3" :clearable="true" placeholder="瞿春生" data-="" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gxmc3" :clearable="true" placeholder="11.0" />
                              </el-col>
                              <el-col :span="9">
                                <el-input v-model="formData.Gd_cpmc3" :clearable="true" placeholder="打包废纸" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_cl3" :clearable="true" placeholder="是" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_PgCl3" :clearable="true" placeholder="是" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_clAdd3" :clearable="true" placeholder="是" />
                              </el-col>
                            </el-row> -->
              
                            <!-- 员工4 -->
                           <!-- <el-row :gutter="5" style="margin-top: 10px;">
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gdbh4" :clearable="true" @keyup.enter.native="getGxMcsubmit($event, '4')" placeholder="ZI00401" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_yjGx4" :clearable="true" placeholder="瞿春生" data-="" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gxmc4" :clearable="true" placeholder="11.0" />
                              </el-col>
                              <el-col :span="9">
                                <el-input v-model="formData.Gd_cpmc4" :clearable="true" placeholder="打包废纸" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_cl4" :clearable="true" placeholder="是" />
                              </el-col>
							  <el-col :span="2">
							    <el-input v-model="formData.sczl_PgCl4" :clearable="true" placeholder="是" />
							  </el-col>
							  <el-col :span="2">
							    <el-input v-model="formData.sczl_clAdd4" :clearable="true" placeholder="是" />
							  </el-col>
                            </el-row>
              -->
                            <!-- 员工5 -->
                           <!-- <el-row :gutter="5" style="margin-top: 10px;">
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gdbh5"  @keyup.enter.native="getGxMcsubmit($event, '5')" :clearable="true" placeholder="ZI00401" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_yjGx5" :clearable="true" placeholder="瞿春生" data-="" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gxmc5" :clearable="true" placeholder="11.0" />
                              </el-col>
                              <el-col :span="9">
                                <el-input v-model="formData.Gd_cpmc5" :clearable="true" placeholder="打包废纸" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_cl5" :clearable="true" placeholder="是" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_PgCl5" :clearable="true" placeholder="是" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_clAdd5" :clearable="true" placeholder="是" />
                              </el-col>
                            </el-row> -->
              
                            <!-- 员工6 -->
                           <!-- <el-row :gutter="5" style="margin-top: 10px;">
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gdbh6" :clearable="true"  @keyup.enter.native="getGxMcsubmit($event, '6')" placeholder="ZI00401" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_yjGx6" :clearable="true" placeholder="瞿春生" data-="" />
                              </el-col>
                              <el-col :span="3">
                                <el-input v-model="formData.sczl_gxmc6" :clearable="true" placeholder="11.0" />
                              </el-col>
                              <el-col :span="9">
                                <el-input v-model="formData.Gd_cpmc6" :clearable="true" placeholder="打包废纸" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_cl6" :clearable="true" placeholder="是" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_PgCl6" :clearable="true" placeholder="是" />
                              </el-col>
                              <el-col :span="2">
                                <el-input v-model="formData.sczl_clAdd6" :clearable="true" placeholder="是" />
                              </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="positioningVisibleshow" :before-close="closepositioningVisible" :title="type==='create'?'添加':'修改'" destroy-on-close>
            <el-card>
				<el-form-item label="工单编号" prop="name">
				  <el-row :gutter="20">
				    <el-col :span="12">
				      <el-input v-model="positionvalue" :clearable="true" placeholder="ZT01733" />
				    </el-col>                      
				  </el-row>
				</el-form-item>
			</el-card>
			<el-button type="primary" @click="enterpositioning">确 定</el-button>
          </el-dialog>


          <el-dialog v-model="getGxMcshow" :before-close="closegetGxMcshow" :title="type==='create'?'添加':'修改'" destroy-on-close>
                
					<el-table
					              tooltip-effect="dark"
					              :data="selectData"
					              row-key="ID"
					              highlight-current-row="true"
					              border
					              style="width:100%"
					              @row-dblclick="handleSelectClick"
					            >
					              <el-table-column
					                prop="Gd_cpmc"
					                label="产品名称"
					                width="300"
					              />
					              <el-table-column
					                prop="Gy0_gxmc"
					                label="产品名称"
					                width="100"
					              />
					              <el-table-column
					                prop="jyGx"
					                label="产品名称"
					                width="100"
					              />
					            </el-table>
		
			<template #footer>
			  <div class="dialog-footer">
			    <el-button @click="closegetGxMcshow">取 消</el-button>
			  </div>
			</template>
          </el-dialog>

        </el-main>
      </el-container>
    </el-container>

  </div>
</template>

<script setup>
import {
  getList,
  getTab,
  locate,
  getInfo,
  getGxMc,
  edit,
  del,
  packagingAdd
} from '@/api/jixiaoguanli/jitairibaobiao'

// 全量引入格式化工具 请按需保留
import { getDictFunc, formatDate, formatBoolean, filterDict, ReturnArrImg, onDownloadFile } from '@/utils/format'
import { ElMessage, ElMessageBox, LAST_KEYS } 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'

defineOptions({
  name: '06-packingDocuments'
})

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

const getTabdata = async () => {
    //接口调用函数
    const response  = await getTab();
	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);

	
	}
	

getTabdata();

// 自动化生成的字典（可能为空）以及字段
const formData = ref({
		  sczl_rq: '',
          sczl_gdbh1: '',
          sczl_gdbh2: '',
          sczl_gdbh3: '',
          sczl_gdbh4: '',
          sczl_gdbh5: '',
          sczl_gdbh6: '',
          sczl_yjGx1: '',
          sczl_yjGx2: '',
          sczl_yjGx3: '',
          sczl_yjGx4: '',
          sczl_yjGx5: '',
          sczl_yjGx6: '',
          sczl_cl1: '',
          sczl_cl2: '',
          sczl_cl3: '',
          sczl_cl4: '',
          sczl_cl5: '',
          sczl_cl6: '',
          sczl_PgCl1:'',
          sczl_PgCl2: '',
          sczl_PgCl3: '',
          sczl_PgCl4: '',
          sczl_PgCl5: '',
          sczl_PgCl6: '',
          Gd_cpmc1: '',
          Gd_cpmc2: '',
          Gd_cpmc3: '',
          Gd_cpmc4: '',
          Gd_cpmc5: '',
          Gd_cpmc6: '',
		  sczl_clAdd1: '',
		  sczl_clAdd2: '',
		  sczl_clAdd3: '',
		  sczl_clAdd4: '',
		  sczl_clAdd5:'',
		  sczl_clAdd6: '',
		  UniqId:'000',
})


const formData2 = ref({
	      UniqId:'0',
		  sczl_rq: '2025-01-01 00:00:00',
          sczl_gdbh1: '2311232',
          sczl_gdbh2: '2311232',
          sczl_gdbh3: '2311232',
          sczl_gdbh4: '2311232',
          sczl_gdbh5: '2311232',
          sczl_gdbh6: '2311232',
          sczl_yjGx1: '01-71',
          sczl_yjGx2: '01-71',
          sczl_yjGx3: '01-71',
          sczl_yjGx4: '01-71',
          sczl_yjGx5: '01-71',
          sczl_yjGx6: '01-71',
		  sczl_gxmc1: '包装',
		  sczl_gxmc2: '包装',
		  sczl_gxmc3: '包装',
		  sczl_gxmc4: '包装',
		  sczl_gxmc5: '包装',
		  sczl_gxmc6: '包装',
          sczl_cl1: '6.00',
          sczl_cl2: '6.00',
          sczl_cl3: '6.00',
          sczl_cl4: '6.00',
          sczl_cl5: '6.00',
          sczl_cl6: '6.00',
          sczl_PgCl1:'500',
          sczl_PgCl2: '500',
          sczl_PgCl3: '500',
          sczl_PgCl4: '500',
          sczl_PgCl5: '500',
          sczl_PgCl6: '500',
		  sczl_clAdd1: '500',
		  sczl_clAdd2: '500',
		  sczl_clAdd3: '500',
		  sczl_clAdd4: '500',
		  sczl_clAdd5:'500',
		  sczl_clAdd6: '500',  
})

// 验证规则
const rule = reactive({
})

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

// =========== 表格控制部分 ===========
const tableData = reactive([])
const GxMctableData = reactive([])

const tableColumns = [
  { label: '创建用户', prop: 'sys_id', width: '240' },
  { label: '日期', prop: 'sczl_rq', width: '100' },
  { label: '包装产量', prop: 'sczl_cl', width: '100' },
  { label: '包装数量', prop: 'sczl_PgCl', width: '100' },
  { label: '创建时间', prop: 'sys_rq', width: '180' },
  { label: '修改时间', prop: 'mod_rq', width: '180' },
  { label: 'UNIQID', prop: 'UniqId', width: '100' },
]

const detailData = reactive([])
const total=ref(0)
const inputname=ref(0)
const page = ref(1)
const limit = ref(10)
const searchInfo = ref('')
const params = {
  type: '',
  date: '',
  sys_id: '',
  gdbh: '',
}
const locatevalue={
	gdbh:'',
	cpmc:'',
	page:page.value.toString(),
	limit:limit.value.toString(),  
}
let table=ref(5);
let positionvalue=ref()
let GxMcvalue=ref()

// 分页设置
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 getList(params);
  console.log(response.data.rows)
  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();
  }
}
const Getlocate = async () => {
  
  // const response = await locate(locatevalue);
  // console.log(locatevalue)
  // console.log(response)
  // if (response.code === 0) {
  //   tableData.splice(0, tableData.length, ...response.data.rows);
  // }
  const response = await locate({
    gdbh: params.gdbh,
    page: page.value.toString(), limit: limit.value.toString(),
  })
  if (response.code === 0) {
    total.value = response.data.total
    tableData.splice(0, tableData.length, ...response.data.rows)
  }
}

const enterpositioning = async () => {
 locatevalue.gdbh=positionvalue.value;

 console.log(locatevalue.gdbh)
 Getlocate()
 closepositioningVisible()
}


// 处理回车
const handleEnter = (index, row) => {
  GetGxMc(index, row)
}
let sczl_rqValue=ref()
const getpickInfo = async (value) => {
	
  const response = await getInfo({UniqId:value});
 if (response.code === 0) {
    const { sczl_rq,...rest } = response.data
    // 直接赋值基础属性
	sczl_rqValue.value=response.data.sczl_rq
	console.log(response.data.sczl_rq)
    Object.assign(detailData, { sczl_rq,})
    // 生成表格数据
    detailData.table = Array.from({ length: 6 }, (_, i) => i + 1) // 创建一个长度为6的数组 [1, 2, 3, 4, 5, 6]
      .map(num => {
        return {
          sczl_gdbh: rest[`sczl_gdbh${num}`],
          sczl_yjGx: rest[`sczl_yjGx${num}`],
          sczl_gxmc: rest[`sczl_gxmc${num}`],
          Gd_cpmc: rest[`Gd_cpmc${num}`],
          sczl_cl: rest[`sczl_cl${num}`],
          sczl_PgCl: rest[`sczl_PgCl${num}`],
          sczl_clAdd: rest[`sczl_clAdd${num}`],
        }
      })
      // .filter(item => item.sczl_gdbh !== '') // 过滤掉空的工单编号
    dialogFormVisible.value = true
  }
}

// 更新数据
const updateDetailData = async() => {
  const restoredData = {
    UniqId: lastCellValue,
    sczl_rq: detailData.sczl_rq,
    sczl_gdbh: detailData.sczl_gdbh,
    sczl_yjGx: detailData.sczl_yjGx,
    sczl_gxmc: detailData.sczl_gxmc,
    sczl_cl: detailData.sczl_cl,
    sczl_PgCl: detailData.sczl_PgCl,
    sczl_clAdd: detailData.sczl_clAdd,
	sys_id:'[1084/胡庆司]',
  }
  detailData.table.forEach((item, index, array) => {
    const num = index + 1
    restoredData[`sczl_gdbh${num}`] = item.sczl_gdbh
    restoredData[`sczl_yjGx${num}`] = item.sczl_yjGx
    restoredData[`sczl_gxmc${num}`] = item.sczl_gxmc
    // restoredData[`Gd_cpmc${num}`] = item.Gd_cpmc
    restoredData[`sczl_cl${num}`] = item.sczl_cl
    restoredData[`sczl_PgCl${num}`] = item.sczl_PgCl
    restoredData[`sczl_clAdd${num}`] = item.sczl_clAdd
  })
  
  if(ADD.value=='新增'){
  	 // console.log('新增')
	 // 生成表格数据
  	 console.log('新增')
  	 console.log(ADD.value)
  	 console.log(restoredData)
  	 const response = await packagingAdd(restoredData);
  	 // ADD.value='1'
  	 // console.log(ADD.value)
  	 ADD.value='0'
  	 console.log(response)
	 if(response.code==0){
	 		 ElMessage({
	 		   type: 'success',
	 		   message: '新增成功',
	 		 })
	 }
	 dialogFormVisible.value = false
  	 
  }else{
  	 // restoredData.UniqId = 1
  	  const res = await edit(restoredData)
  	 console.log(restoredData)
  	 console.log(res)
	 if(res.code==0){
	 		 ElMessage({
	 		   type: 'success',
	 		   message: '更新成功',
	 		 })
	 }
	 dialogFormVisible.value = false
  	 // ADD.value='0'
  	 // console.log(ADD.value)
  }
  
  
}


const GxMcdel = async () => {
  const response = await del({UniqId:lastCellValue});
  if (response.code === 0) {
	ElMessage({
	  type: 'success',
	  message: '删除成功',
	})
  }
  getTableData()
}

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

  if (event.keyCode === 13 || event.keyCode === 40) { // Enter 或向下箭头
    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()
    }
  }
}

const selectData = reactive([
  {
    Gd_cpmc: '黄金叶（乐途硬）小盒（二维码改版）',
    Gy0_gxmc: '包装',
    jyGx: '01-71',
  },
])
let tableIndex = 0
// 处理选择框
const handleSelectClick = (row, column, event) => {
  const { Gd_cpmc, Gy0_gxmc, jyGx } = row
  detailData.table[tableIndex].Gd_cpmc = Gd_cpmc
  detailData.table[tableIndex].sczl_yjGx = jyGx
  detailData.table[tableIndex].sczl_gxmc = Gy0_gxmc
  getGxMcshow.value = false
}
const GetGxMc = async (index, row) => {
	
	console.log(row)
	  const response = await getGxMc({gdbh: row.sczl_gdbh })
	  if (response.code === 0) {
	    const { Gd_cpmc, Gy0_gxmc, jyGx } = response.data[0]
	    if (response.data.length === 1) {
	      detailData.table[index].Gd_cpmc = Gd_cpmc
	      detailData.table[index].sczl_yjGx = jyGx
	      detailData.table[index].sczl_gxmc = Gy0_gxmc
	    } else {
	      selectData.splice(0, selectData.length, ...response.data)
	      tableIndex = index
	      getGxMcshow.value = true
	    }
	  }
	
 //  const response = await getGxMc({gdbh: value});
 //  console.log(response);
 //  if (response.code === 0) {
 //    if (response.data.length > 1) {		
	// GxMctableData.splice(0, GxMctableData.length, ...response.data);
 //    getGxMcshow.value = true; 
 //    }
    
 //    // 取出 data 中的第一个元素
 //    const item = response.data[0];
    
 //    // 将数据拆分成变量名和内容
 //    const variableName = Object.keys(item)[0]; // 变量名
 //    const variableContent = item[variableName]; // 变量内容
    
 //    const variableName1 = Object.keys(item)[1]; // 变量名
 //    const variableContent1 = item[variableName1]; // 变量内容
    
 //    const variableName2 = Object.keys(item)[2]; // 变量名
 //    const variableContent2 = item[variableName2]; // 变量内容
    
 //    console.log(variableContent2); // 输出生成的 Vue 代码
    
 //    // 根据 response.data.length 的值动态给 formData 中的变量赋值
 //    let Bname = 'Gd_cpmc' + num;
 //    let Bname2= 'sczl_gxmc' + num;
 //    let Bname3 = 'sczl_yjGx' + num;
 //    formData.value[Bname] = variableContent; // 假设要赋的值是 123
 //    formData.value[Bname2] = variableContent1;
 //    formData.value[Bname3] = variableContent2;
 //    console.log(formData.value[Bname]);
 //  }
}




const getGxMcsubmit = (event, inputName) => {
 if(formData.value.sczl_gdbh6.length!=7||formData.value.sczl_gdbh5.length!=7||formData.value.sczl_gdbh3.length!=7||formData.value.sczl_gdbh4.length!=7||formData.value.sczl_gdbh2.length!=7||formData.value.sczl_gdbh1.length!=7){
	  	return false
	  }
	   // console.log(inputName);
	   inputname.value=inputName
	   console.log(inputname.value)
	  let combinedString = 'formData.value.sczl_gdbh' + inputName;
	  // console.log(combinedString)
	  let variableName = 'sczl_gdbh'+inputName;
	  let variableValue = eval('formData.value.' + variableName);
	 console.log(variableValue)
	  GetGxMc(variableValue,inputName)
}


// 搜索
function onSearch() {
  params.gdbh = positionvalue.value
  params.type = 'getLocateTable'
  page.value = 1
  Getlocate()
}
// ============== 表格控制部分结束 ===============

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

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

// 多选数据
const multipleSelection = ref([])
// 多选
const handleSelectionChange = (val) => {
	if(val.length>0){		
		multipleSelection.value = val
		const lenth=val.length
		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 dialogFormVisible = ref(false)

// 行为控制标记（弹窗内部需要增还是改）
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 positioningVisibleshow = ref(false)
const getGxMcshow = ref(false)

const positioningVisible = () => {
    type.value = 'create'
    positioningVisibleshow.value = true
}

const ADD=ref('0')
//新增
function onAdd() {
	ADD.value='新增'
	console.log(ADD.value)
	getpickInfo(lastCellValue)
	dialogFormVisible.value = true
	// Productionadd()
}

const Del = () => {
   GxMcdel()
}

const closepositioningVisible = () => {
  positioningVisibleshow.value = false
  formData.value = {
    address: '',
    image: '',
    name: '',
  }
}

const closegetGxMcshow = () => {
  getGxMcshow.value = false
}

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

// 关闭弹窗
const closeDialog = () => {
  dialogFormVisible.value = false
  formData.value = {
    address: '',
    image: '',
    name: '',
  }
}
// 弹窗确定
const enterDialog = async () => {
      
	  // formData.value.UniqId=lastCellValue
      updateDetailData()
   //    GxMcedit(lastCellValue)
	 // closeDialog()
	 // getTableData()
}

let lastCellValue=ref()
// 双击表格操作
function doubleClick(row) {
  
     // console.log(row, column, event);
       // updateCompanyFunc(row);
       type.value = 'update';     
	   lastCellValue= row['UniqId'];
		 console.log(lastCellValue)
		 table.value=lastCellValue
       getpickInfo(table.value)
}
// 单击表格操作
function Click(row, column, event) {
    lastCellValue= row['UniqId'];
   console.log(lastCellValue)
  // if(row['table_type']=='db_sczl'){
  // 	 dialogFormVisible.value = true
  // 	 GetInfo(table.value)
  // }else{
	 //  console.log('此数据不展示详细信息')
  // }  
}

function GxMcdoubleClick(row) {

   GxMcvalue=row
   closegetGxMcshow()
   console.log(GxMcvalue.Gd_cpmc)
   
   
   
   // 根据 response.data.length 的值动态给 formData 中的变量赋值
   let Bname = 'Gd_cpmc' + inputname.value;
   let Bname2= 'sczl_gxmc' + inputname.value;
   let Bname3 = 'sczl_yjGx' + inputname.value;
   formData.value[Bname] =GxMcvalue.Gd_cpmc; // 假设要赋的值是 123
   formData.value[Bname2] = GxMcvalue.Gy0_gxmc;
   formData.value[Bname3] = GxMcvalue.jyGx;
   
}

// 导出excel
function exportExcel() {
  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>