mes-zs-admin-backend-ui/src/view/yunyin/shengchanguanli/gongdanziliao.vue

<template>
  <div>
    <layout>
      <layout-header>
        <div class="">
          <!--按钮部分-->
          <el-form ref="elSearchFormRef"  class="demo-form-inline"  >
            <el-form-item>
              <el-input v-model="searchInfo"  placeholder="搜索订单编号" style="width: 180px;" @keyup.enter="onSubmit()"></el-input>
              <el-button type="primary" icon="search" @click="onSubmit" title="搜索"  ></el-button>
			  <el-button type="primary" icon="edit"   @click="cp_gdprintonClick" class="bt" title="打印生产订单" >订单打印</el-button>
              <el-button type="primary" class="bt" icon="edit"  @click="jsfjClick">附件上传</el-button> 
              <el-button type="primary" icon="edit"   @click="addgd_onclick"   class="bt"   title="新增工单资料">新增订单资料</el-button>
              <el-button type="primary" icon="edit"   @click="addgdyj_onclick"   class="bt" title="新增颜色资料">新增颜色资料</el-button>
              <el-button type="primary" icon="edit"   @click="addgdgy_onclick"   class="bt" title="新增工序资料" >新增工序资料</el-button>
			  <el-button type="primary" icon="edit"   @click="BOMclick"   class="bt"   title="BOM面料">批量修改BOM资料</el-button>
              <el-button type="primary" icon="edit"   @click="del_ddzlClick" 	v-if="table_del=== true" :disabled="table_Selection === ''"  class="bt" title="删除订单资料"  >删除订单资料</el-button>
              <el-button type="primary" icon="edit"   @click="delgd_delclick" 	v-if="delall=== true" :disabled="ysSelection === '' && gySelection === ''"  class="bt"   >删除颜色工艺资料</el-button>
			  <el-button type="primary" icon="edit"   @click="delbom_delclick" 	v-if="del_bom=== true" :disabled="bom_Selection === '' "  class="bt"   >删除bom资料</el-button>
			  
              <!-- <el-button type="primary" icon="edit"   @click="CSclick"   class="bt"   title="库存测试">库存测试</el-button> -->
			</el-form-item>
          </el-form>
        </div> 
      </layout-header>
      <layout>

        <!-- 左侧树形结构 -->
        <layout-sider :resize-directions="['right']" :width="190" style="margin: 0px;">
          <div class="JKWTree-tree" style="height: 200px">
            <h3>客户编号</h3>
            <el-tree :data="treeData" class="treecolor" @node-click="handleNodeClick"></el-tree>
          </div>
        </layout-sider>

        <!-- 右侧内容区域 -->
        <layout-content >
          <el-main>
            <!-- 订单表格列表 -->
            <div class="gva-table-box">
              <el-table ref="multipleTable" style="width: 100%;height: 28vh"
                        :row-style="{ height: '20px' }" :header-cell-style="{ padding: '0px' }"
                        :cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
                        border tooltip-effect="dark" :data="tableData" row-key="ID"
                        highlight-current-row="true"
                        :cell-class-name="tableDataCellClass"
						@row-click="tableRowClick" @row-dblclick="updateCompanyFunc"
                        @selection-change="ddzlSelectionChange" :show-overflow-tooltip="true">
                <el-table-column align="center" type="selection" width="30"/>
				<el-table-column align="center"  label="附件状态"     	prop="status" 	width="100" />
                <el-table-column align="left" sortable label="订单编号"     	prop="订单编号" 	width="105" />
				<el-table-column align="left" sortable label="客户"      	prop="客户编号" 		width="80" />
                <el-table-column align="left" sortable label="生产款号"   	prop="生产款号"  width="110" />
                <el-table-column align="left" sortable label="款式"       	prop="款式"   	width="100"/>
				<el-table-column align="left" sortable label="订单数量"    	prop="订单数量" 	width="105" />
				<el-table-column align="left" sortable label="落货日期"   	prop="落货日期" 	width="120" />
				<el-table-column align="left" sortable label="船样合计"    	prop="船样合计" 	width="105" />
				<el-table-column align="left" sortable label="船样描述"    	prop="船样描述" 	width="140" />
				<el-table-column align="left" sortable label="单位"    		prop="单位" 		width="80" />
                <el-table-column align="left" sortable label="面料"       	prop="面料" 		width="130" />
                <el-table-column align="left" sortable label="备注"       	prop="要求" 		width="130" />
                <el-table-column align="left" sortable label="粘衬"        	prop="粘衬"		width="80" />
				<el-table-column align="left" sortable label="箱唛要求"   	prop="箱唛要求" 	width="110" />
				<el-table-column align="left" sortable label="制单人"    	prop="Sys_id" 	width="160" />
				<el-table-column align="left" sortable label="制单日期"    	prop="Sys_rq" 	width="160" />
              </el-table>
              <!-- 分页 -->
				<div class="gva-pagination" style='height: 30px;margin-right: 10px;'>
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="page"
                    :page-sizes="[10, 30, 50, 100]"
                    layout="total"
                    :total="total">
                </el-pagination>
              </div>
            </div>

            <!-- 颜色资料列表、工艺资料列表、BOM资料列表  -->
            <el-tabs v-model="activeName" @tab-click="handleClick">
              <el-tab-pane label="颜色资料"  @click="showTable('颜色资料')"  name="first">
                <el-table ref="multipleTable"
                          :row-style="{ height: '20px' }"
                          :cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
                          :header-cell-style="{ padding: '0px' }"
                          :show-overflow-tooltip="true"
                          highlight-current-row="true"
						  @row-click="ystableclick"
                          @row-dblclick="ysupdateCompanyFunc"
                          @selection-change="selectionChange($event, '颜色资料')"
                          style="width: 100%;height: 36vh" border show-summary
                          :summary-method="getSummaries" tooltip-effect="dark" :data="ystableData" row-key="ID" >
                  <el-table-column type="selection" width="30" />
                  <el-table-column align="left" sortable label="子订单编号" prop="子订单编号"  width="140"/>
				  <el-table-column align="left" sortable label="PO号	" prop="款号"  width="180"/>
				  <el-table-column align="left" sortable label="颜色备注" prop="颜色备注"  width="105"/>
                  <el-table-column align="left" sortable label="色系名称" prop="颜色"  width="105"/>
                  <el-table-column align="left" sortable label="船样" prop="船样"  width="80"/>
				  <!-- 尺码列表 -->
                  <template v-for="item in sizeDatas">
                    <el-table-column align="left" sortable :label=item :prop=item  width="80"/> 
                  </template>
                  <el-table-column align="left" sortable label="制单总数" prop="zdtotal"  width="110"/>
                  <el-table-column align="left" sortable label="建档用户" prop="Sys_id"  width="160"/>
                  <el-table-column align="left" sortable label="建档时间" prop="Sys_rq"  width="160"/>
                  <el-table-column align="left" sortable label="更新时间" prop="更新时间"  width="110"/>
                </el-table>
              </el-tab-pane>

              <el-tab-pane label="工艺资料" @click="showTable('工艺资料')" name="second">
                <el-table ref="multipleTable"
                          :row-style="{ height: '20px' }"
                          :cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
                          :header-cell-style="{ padding: '0px' }"
                          highlight-current-row="true"
                          :show-overflow-tooltip="true"
                          size="small"
                          :cell-class-name="gysatusCellClass"
                          @row-dblclick="gdgyupdateCompanyFunc"
                          @row-click="clickybupdate2"
                          :row-class-name="rowClassStyle2"
                          @selection-change="selectionChange($event, '工艺资料')"
                          style="width: 100%;height: 36vh" border tooltip-effect="dark" :data="gytableData" row-key="ID">
                  <el-table-column type="selection" width="30" />
                  <el-table-column align="left" label="完工状态" prop="完工状态"  width="75"/>
                  <el-table-column align="left" label="工序名称" prop="工序名称"  width="280"/>
                  <el-table-column align="left" label="计划产量" prop="计划产量"  width="80"/>
                  <el-table-column align="left" label="建档用户" prop="建档用户"  width="90"/>
                  <el-table-column align="left" label="建档日期" prop="建档日期"  width="150"/> 
                </el-table>
              </el-tab-pane>

              <el-tab-pane label="订单资料附件" name="third">
                <el-table ref="multipleTable"
                          :row-style="{ height: '30px' }"
                          :cell-style="{ padding: '0px' }" :header-row-style="{ height: '30px' }"
                          :header-cell-style="{ padding: '0px' }"
                          :show-overflow-tooltip="true"
                          :cell-class-name="planUsageCellClass"
                          highlight-current-row="true"
                          @row-dblclick="gdbomupdateCompanyFunc"
                          style="width: 100%;height: 36vh" border tooltip-effect="dark" :data="ddtableData" row-key="ID"
						   @selection-change="fjSelectionChange">
                 <el-table-column align="left" label="关联编号" prop="关联编号"  width="115"/>
                 <el-table-column align="left" label="备注" 	prop="附件备注"  width="110"/>
                 <el-table-column align="left" label="文件类型" prop="附件类型"  width="100"/>
                 <el-table-column align="left" label="建档时间" prop="sys_rq"  width="160"/>
                 <el-table-column align="left" label="建档用户" prop="sys_id"  width="200"/>
				 <el-table-column align="left" label="操作"width="100"fixed="right">
				   <template #default="scope">
				     <el-button type="success" size="small" :data="ddtableData" @click="showPdf(scope.row)" >PDF预览</el-button> 
				   </template>
				 </el-table-column>
                </el-table>
              </el-tab-pane> 
			  
              

			  <el-tab-pane label="技术附件" @click="showTable('技术附件')" name="fourth">
			  	<el-table ref="multipleTable"
					  :row-style="{ height: '30px' }"
					  :cell-style="{ padding: '0px' }" :header-row-style="{ height: '30px' }"
					  :header-cell-style="{ padding: '0px' }"
					  :show-overflow-tooltip="true"
					  :cell-class-name="planUsageCellClass"
					  highlight-current-row="true"
					  @row-dblclick="ExcelShow"
					  style="width: 100%;height: 36vh" border tooltip-effect="dark" :data="jstableData" row-key="ID" @selection-change="fjSelectionChange">
				  <el-table-column align="left" label="关联编号" prop="关联编号"  width="115"/>
				  <el-table-column align="left" label="备注" 	prop="附件备注"  width="110"/>
				  <el-table-column align="left" label="文件类型" prop="附件类型"  width="100"/>
				  <el-table-column align="left" label="建档时间" prop="sys_rq"  width="160"/>
				  <el-table-column align="left" label="建档用户" prop="sys_id"  width="200"/>
				  <el-table-column align="left" label="操作"width="100"fixed="right">
				    <template #default="scope">
				      <el-button type="success" size="small" :data="ddtableData" @click="showPdf(scope.row)" >PDF预览</el-button> 
				    </template>
				  </el-table-column>
			      </el-table>
			    </el-tab-pane>

          <el-tab-pane label="BOM资料" @click="showTable('BOM资料')" name="six">
                <el-table ref="multipleTable"
                          :row-style="{ height: '20px' }"
                          :cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
                          :header-cell-style="{ padding: '0px' }"
                          :show-overflow-tooltip="true"
                          :cell-class-name="planUsageCellClass"
                          highlight-current-row="true"
                          @row-dblclick="bombomupdateCompanyFunc"
						  @selection-change="bomSelectionChange"
                          style="width: 100%;height: 36vh" border tooltip-effect="dark" :data="bomtableData" row-key="ID">
                 <el-table-column type="selection" width="30" />
                  <el-table-column align="left" label="订单编号" prop="订单编号"  width="105"/>
                  <el-table-column align="left" label="物料名称" prop="物料名称"  width="170"/>
                  <el-table-column align="left" label="计划用料" prop="计划用料"  width="100" />
                  <el-table-column align="left" label="定额用料" prop="定额用料"  width="90"/>
				  <el-table-column align="left" label="门封" prop="门封"  width="80"/>
				  <el-table-column align="left" label="单位" prop="投料单位"  width="60"/>
				  <el-table-column align="left" label="备注" prop="备注"  width="180"/>
				  <el-table-column align="left" label="更新用户" prop="ID"  width="160"/>
				  <el-table-column align="left" label="更新日期" prop="日期"  width="160"/>
				  <!-- <el-table-column align="left" label="UNIQID" prop="UNIQID"  width="80"/> -->
                </el-table>
              </el-tab-pane>

              <el-tab-pane label="面料库存" @click="showTable('面料库存')" name="seven">
                <el-table ref="multipleTable"
                          :row-style="{ height: '20px' }"
                          :cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
                          :header-cell-style="{ padding: '0px' }"
                          :show-overflow-tooltip="true"
                          :cell-class-name="planUsageCellClass"
                          highlight-current-row="true"
                          @row-dblclick="mlupdateCompanyFunc"
						  :summary-method="mlgetSummaries" 
                          style="width: 100%;height: 36vh" border tooltip-effect="dark" :data="mltableData" row-key="ID" @selection-change="handleSelectionChange">
<!--                  <el-table-column type="selection" width="30" />-->
				  <el-table-column type="selection" width="30" />
                  <el-table-column align="left" label="订单编号" prop="订单编号"  width="105"/>
                  <el-table-column align="left" label="物料名称" prop="物料名称"  width="170"/>
                  <el-table-column align="left" label="计划用料" prop="计划用料"  width="100" />
                  <el-table-column align="left" label="定额用料" prop="定额用料"  width="90"/>
				  <el-table-column align="left" label="门封" prop="门封"  width="80"/>
                  <el-table-column align="left" label="裁床实际用料" prop="裁床实际用料"  width="120"/>
                  <el-table-column align="left" label="裁床领用面料" prop="裁床领用面料"  width="120"/>
				  <el-table-column align="left" label="裁床退回仓库面料" prop="裁床退回仓库面料"  width="140"/>
				  <el-table-column align="left" label="入库总量" prop="入库总量"  width="90"/>
				  <el-table-column align="left" label="面料结余" prop="面料结余"  width="90"/>
				  <el-table-column align="left" label="单位" prop="投料单位"  width="60"/>
				  <el-table-column align="left" label="备注" prop="备注"  width="180"/>
				  <el-table-column align="left" label="更新用户" prop="ID"  width="160"/>
				  <el-table-column align="left" label="更新日期" prop="日期"  width="160"/>
                </el-table>
              </el-tab-pane>
            </el-tabs>


              
         <!-- 修改颜色资料弹窗 -->
         <el-dialog v-model="dialogFormVisible" :before-close="edit_closeDialog" 
		 style="width: 80%; max-height: 80%; overflow-y: auto; margin-top: 4%;"
		 title="颜色资料修改" destroy-on-close >
             <el-row :gutter="20" class="form-row">
                 <el-col :span="10">
                     <div style="display: flex; gap: 0px;">
                         <h3 style="color:red;font-size: 24px;margin:-5px 0px 8px 12px;">订单编号&nbsp;&nbsp;&nbsp;{{_ddhval}}</h3>
                     </div>
                 </el-col>
                 <el-col :span="10">
                     <div style="display: flex; gap: 0px;">
                         <el-form-item label="订单子编号:" class="mab" prop="keyOrder" label-width='110'>
                             <el-input v-model="edit_formData['子订单编号']" disabled style="width: 250px;" id="订单子编号" />
                         </el-form-item>
                     </div>
                 </el-col>
             </el-row>
         
             <el-row :gutter="20">
                <el-col :span="10">
                     <div style="display: flex; gap: 0px;">
                         <el-form-item label="色系名称:" class="mab" prop="keyOrder" label-width='110'>
							<el-select
							v-model=" edit_formData['颜色']" style="width: 150px;" id="色系名称" 
							@keydown="add_gdzlent($event, '', '色系名称', '款号:')">
							<el-option 
							  v-for="color in getSuborderscolor.colorlist" 
							  :key="color.id" 
							  :label="color.colorname" 
							  :value="color.colorname"  
							  @click="xg_sxhandleSizeChange(color.colorname,color.colorcode)">
							</el-option>
							</el-select>
                         </el-form-item>
                     </div>
                 </el-col>
				 
                 <el-col :span="10">
                     <el-form-item label="PO号:" prop="deliveryDate" class="mab" label-width="110px" style="">
                         <el-input v-model="edit_formData['款号']" style="width: 250px;" id="生产款号" />
                     </el-form-item>
                 </el-col>
             </el-row>
         
             <el-row :gutter="20">
				 <el-col :span="8">
				   <el-form-item label="颜色备注:" prop="joinDate" label-width='110'>
				     <el-input v-model="edit_formData['颜色备注']" style="width: 250px;" id ='颜色备注' @keydown="add_gdzlent($event, '款号:', '颜色备注', '是否船样')"/>
				   </el-form-item>
				 </el-col>
                <el-col :span="10">
                     <div style="display: flex; gap: 0px;">
                        <el-form-item label="是否船样:" prop="joinDate" label-width='200'>
                             <el-select v-model="edit_formData['船样']" style="width: 150px;" id="是否船样" @keydown="add_gdzlent($event, '尺码规格', '是否船样', 'zds1')">
								 <el-option label="是" value="是" @click="edit_cyChange('是')"></el-option>
								 <el-option label="否" value="否" @click="edit_cyChange('否')"></el-option>
                             </el-select>
                         </el-form-item>
                     </div>
                 </el-col>
             </el-row>
         
             <el-row class="form-row">
                 <el-col :span="20">
                     <div style="display: flex; gap: 0px;">
                         <el-form-item label="尺码:" class="mab" prop="keyOrder" label-width='110'>
                             <el-input v-model="edit_cmformdata.cm1" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm2" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm3" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm4" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm5" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm6" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm7" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm8" readonly style="width: 80px;" />
                             <el-input v-model="edit_cmformdata.cm9" readonly style="width: 80px;" />
							 <el-input v-model="edit_cmformdata.cm10" readonly style="width: 80px;" />
                         </el-form-item>
                     </div>
                 </el-col>
             </el-row>
         
             <el-row class="form-row">
                 <el-col :span="20">
                     <div style="display: flex; gap: 0px;">
                         <el-form-item label="制单数:" class="mab" prop="keyOrder" label-width='110'>
                             <el-input v-model="edit_zdsformdata.zds1" @input="updateTotal" style="width: 80px;" id="zds1" @keydown="add_gdzlent($event, '是否船样', 'zds1', 'zds2')" />
                             <el-input v-model="edit_zdsformdata.zds2" @input="updateTotal" style="width: 80px;" id="zds2" @keydown="add_gdzlent($event, 'zds1', 'zds2', 'zds3')" />
                             <el-input v-model="edit_zdsformdata.zds3" @input="updateTotal" style="width: 80px;" id="zds3" @keydown="add_gdzlent($event, 'zds2', 'zds3', 'zds4')" />
                             <el-input v-model="edit_zdsformdata.zds4" @input="updateTotal" style="width: 80px;" id="zds4" @keydown="add_gdzlent($event, 'zds3', 'zds4', 'zds5')" />
                             <el-input v-model="edit_zdsformdata.zds5" @input="updateTotal" style="width: 80px;" id="zds5" @keydown="add_gdzlent($event, 'zds4', 'zds5', 'zds6')" />
                             <el-input v-model="edit_zdsformdata.zds6" @input="updateTotal" style="width: 80px;" id="zds6" @keydown="add_gdzlent($event, 'zds5', 'zds6', 'zds7')" />
                             <el-input v-model="edit_zdsformdata.zds7" @input="updateTotal" style="width: 80px;" id="zds7" @keydown="add_gdzlent($event, 'zds6', 'zds7', 'zds8')" />
                             <el-input v-model="edit_zdsformdata.zds8" @input="updateTotal" style="width: 80px;" id="zds8" @keydown="add_gdzlent($event, 'zds7', 'zds8', 'zds9')" />
							 <el-input v-model="edit_zdsformdata.zds9" @input="updateTotal" style="width: 80px;" id="zds9" @keydown="add_gdzlent($event, 'zds8', 'zds9', '色系名称')" />
                             <el-input v-model="edit_zdsformdata.zds10" readonly style="width: 80px;" />
                         </el-form-item>
                     </div>
                 </el-col>
             </el-row>
             
             <template #footer>
                 <div class="dialog-footer" style="display: flex; justify-content: flex-end; margin-top: 20px;">
                     <el-button @click="ys_edit_closeDialog" style="margin-left: 10px;">取消</el-button>
                     <el-button type="primary" @click="ys_edit_Dialog" style="margin-left: 10px;">确认</el-button>
                 </div>
             </template>

         </el-dialog>
      
			
			<!-- 新增订单资料弹窗 -->
		<el-dialog v-model="add_gddialogFormVisible" :before-close="add_gdcloseDialog"
		          title="新增订单资料" width="70%" top="3%" destroy-on-close>
		  
		  <div style="display: flex; justify-content: space-between;">
		    <div style="flex: 2;">
		      <el-form :model="add_gdscgdformData">
		        <div style="display: flex;">
		          <div style="flex: 1; margin-right: 20px;">
		            <el-form-item label="订单编号" label-width="100px">
		              <el-input v-model="add_gdscgdformData.订单编号" disabled />
		            </el-form-item>
		            <el-form-item label="生产款号" label-width="100px">
		              <el-input
		                v-model="add_gdscgdformData['生产款号']" id="生产款号"
		                @keydown="add_gdzlent($event, '粘衬', '生产款号', '订单数量')" 
		              />
		            </el-form-item>
		            <el-form-item label="款式" label-width="100px">
		              <el-input
		                v-model="add_gdscgdformData['款式']" id="款式"
		                @keydown="add_gdzlent($event, '订单数量', '款式', '落货日期')"
		              />
		            </el-form-item>
		          </div>
		          <div style="flex: 1;">
		            <el-form-item label="客户编号" label-width="100px">
		              <el-input v-model="add_gdscgdformData.客户编号" disabled />
		            </el-form-item>
		            <el-form-item label="订单数量" label-width="100px">
		              <el-input v-model="add_gdscgdformData.订单数量" id="订单数量"
		               @keydown="add_gdzlent($event, '生产款号', '订单数量', '款式')" 
		              />
		            </el-form-item>
		            <el-form-item label="落货日期" label-width="100px">
		              <el-date-picker
		                v-model="add_gdscgdformData['落货日期']" id="落货日期"
		                type="date"
		                @keydown="add_gdzlent($event, '款式', '落货日期', '面料')"
		              />
		            </el-form-item>
		          </div>
		        </div>
		
		        <!-- 面料部分 -->
		        <el-form-item label="面料" label-width="100px">
		          <el-input
		            type="textarea"
		            v-model="add_gdscgdformData['面料']" id="面料"
		            rows="2"
		            resize="none"
		            @keydown="add_gdzlent($event, '落货日期', '面料', '箱唛要求')" 
		          />
		        </el-form-item>
		
		        <!-- 箱唛要求 -->
		        <el-form-item label="箱唛要求" label-width="100px">
		          <el-input
		            type="textarea"
		            v-model="add_gdscgdformData['箱唛要求']" id="箱唛要求"
		            @keydown="add_gdzlent($event, '面料', '箱唛要求', '备注')"
		            rows="2"
		            resize="none"
		          />
		        </el-form-item>
		
		        <!-- 备注 -->
		        <el-form-item label="备注" label-width="100px">
		          <el-input
		            type="textarea"
		            v-model="add_gdscgdformData['备注']" id="备注"
		            @keydown="add_gdzlent($event, '箱唛要求', '备注', '船样描述')"
		            rows="2"
		            resize="none"
		          />
		        </el-form-item>
		
		        <!-- 船样描述 -->
		        <el-form-item label="船样描述" label-width="100px">
		          <el-input
		            type="textarea"
		            v-model="add_gdscgdformData['船样描述']" id="船样描述"
		            rows="2"
		            resize="none"
		            @keydown="add_gdzlent($event, '备注', '船样描述', '船样合计')"
		          />
		        </el-form-item>
		      </el-form>
		    </div>
		
		    <!-- 右侧部分 -->
		    <div style="flex: 1; margin-left: 20px;">
		      <div style="display: flex; align-items: center;">
		        <el-upload
		          ref="uploadRef"
		          class="upload-demo"
		          :action="uploadUrl"
		          :http-request="customUpload"
		          :headers="uploadHeaders"
		          list-type="picture-card"
		          :on-preview="handlePreview"
		          :on-remove="handleRemove"
		          :before-upload="beforeUpload"
		          :on-success="handleSuccess"
		          :on-error="handleError"
		          :file-list="fileList"
		          :limit="1"
		          accept="image/jpeg,image/png"
		          style="margin-left: 20px;"
		        >
		          <i class="el-icon-plus"></i>
		        </el-upload>
		      </div>
			<h4 style="font-size: 18px; margin-left: 150px;">上传图片</h4>
		      <el-form>
		        <el-form-item label="制单人" label-width="120px">
		          <el-input v-model="add_gdscgdformData['Sys_id']" disabled />
		        </el-form-item>
		        <el-form-item label="制单日期" label-width="120px">
		          <el-date-picker
		            v-model="add_gdscgdformData['制单日期']"
		            disabled
		            type="date"
		          />
		        </el-form-item>
		      </el-form>
		    </div>
		  </div>
		
		  <!-- 底部部分 -->
		  <div style="display: flex; justify-content: space-between; margin-top: 10px;">
		    <el-form :model="add_gdscgdformData" style="flex: 1;">
		      <div style="display: flex;">
		        <div style="flex: 0.5; margin-right: 10px;">
		          <el-form-item label="船样合计" label-width="100px">
		            <el-input v-model="add_gdscgdformData['船样合计']" id="船样合计"
		              @keydown="add_gdzlent($event, '船样描述', '船样合计', '粘衬')"
		            />
		          </el-form-item>
		        </div>
		        <div style="flex: 0.9;">
		          <el-form-item label="粘衬" label-width="60px">
		            <el-input v-model="add_gdscgdformData['粘衬']" id="粘衬"
		              @keydown="add_gdzlent($event, '船样合计', '粘衬', '单位')"
		            />
		          </el-form-item>
		        </div>
		        <div style="flex: 0.4;">
		          <el-form-item label="单位" label-width="70px">
		            <el-input v-model="add_gdscgdformData['单位']" id="单位"
		              @keydown="add_gdzlent($event, '粘衬', '单位', '生产款号')"
		            />
		          </el-form-item>
		        </div>
				<div style="flex: 1;">
				  <el-form-item label="" class="mab" prop="isBanciSelected" label-width="90">
				    <el-checkbox 
				      v-model="add_gdscgdformData['合并']" 
				      class="custom-checkbox"
				    >
				      <span style="color: red;">需要将订单数据合并请勾选</span>
				    </el-checkbox>
				  </el-form-item>
				</div>
		      </div>
		    </el-form>
		  </div>
		
		  <!-- 底部操作按钮 -->
		  <template #footer>
		    <div class="dialog-footer" style="text-align: right;">
		      <el-button @click="add_gdcloseDialog">取消</el-button>
		      <el-button type="primary" @click="add_gdenterDialog">确定</el-button>
		    </div>
		  </template>
		</el-dialog>
		
		<!-- 修改BOM资料 -->
		<el-dialog v-model="edit_bomdialogFormVisible" :before-close="edit_bomcloseDialog" title="修改BOM资料" width="80%" top="2%" destroy-on-close>
			<el-descriptions class="margin-top" :column="4"  :size="size" border>
				<el-descriptions-item label="订单编号" class="ddh">{{ ddhformData['ddh'] }}</el-descriptions-item>
				<el-descriptions-item label="客户">{{ ddhformData['kh'] }}</el-descriptions-item>
				<el-descriptions-item label="生产款号">{{ ddhformData['sckh'] }}</el-descriptions-item>
				<el-descriptions-item label="款式">{{ ddhformData['ks'] }}</el-descriptions-item>
			</el-descriptions>
			<el-divider content-position="left">
				<span style="font-size: 18px;color:red;font-weight: bold;margin-left: 20px;">绿色部分可进行修改</span>
			</el-divider>
			<div style="margin-top: 5px;">
				<el-table ref="paichengRef"
				          :show-overflow-tooltip="true"
						  highlight-current-row="true"
				          :row-style="{ height: '0px' }"
				          :cell-style="{ padding: '0px' }" :header-row-style="{ height: '0px' }"
				          :header-cell-style="{ padding: '0px' }"
				          style="width: 100%;height: 60vh" border tooltip-effect="dark"
				          :data="edit_resbomtableData" row-key="ID"
				          :cell-class-name="scfjfpxsCellClass">
				  <template v-for="(item, idx) in edit_resbom_tableColumns">
				    <el-table-column #default="{ row, column, $index }" align="left" :label="item.label" :width="item.width" >
				      <div v-if="['物料名称', '计划用料', '定额用料', '门封', '备注'].includes(item.prop)">
				        <el-input v-model="row[item.prop]" :clearable="false"
				                  :id="`input${idx}${$index}`" @keyup="resbom_handleKeyDown($event, idx, $index, item.prop)" @input="handleInput($event, row, item.prop)"/>
				      </div>
				      <div v-else>{{ row[item.prop] }}</div>
				    </el-table-column>
				  </template>
				</el-table>
			</div>
			<div class="dialog-footer" style="text-align: right;margin-top: 5px;">
			  <el-button @click="editres_bomcloseDialog">取 消</el-button>
			  <el-button type="primary"  @click="editres_bomenterDialog">修改</el-button>
			</div>
		</el-dialog>
		
		<!-- 批量修改BOM资料弹窗 -->
		<el-dialog v-model="res_bomdialogFormVisible" :before-close="res_bomcloseDialog" title="批量修改BOM资料" width="70%" top="1%" destroy-on-close>
		  
		   <el-descriptions class="margin-top" :column="4"  :size="size" border>
			<el-descriptions-item label="订单编号" class="ddh">{{ ddhformData['ddh'] }}</el-descriptions-item>
			<el-descriptions-item label="客户">{{ ddhformData['kh'] }}</el-descriptions-item>
			<el-descriptions-item label="生产款号">{{ ddhformData['sckh'] }}</el-descriptions-item>
			<el-descriptions-item label="款式">{{ ddhformData['ks'] }}</el-descriptions-item>
		   </el-descriptions>
		  	
			<el-divider content-position="left">
				<el-button type="primary" icon="plus" @click="add_bomenterDialog">新增一行</el-button>
				<span style="font-size: 18px;color:red;font-weight: bold;margin-left: 20px;">绿色部分可进行修改</span>
			</el-divider>
			<div style="margin-top: 5px;">
				<el-table ref="paichengRef"
				          :show-overflow-tooltip="true"
						  highlight-current-row="true"
				          :row-style="{ height: '0px' }"
				          :cell-style="{ padding: '0px' }" :header-row-style="{ height: '0px' }"
				          :header-cell-style="{ padding: '0px' }"
				          style="width: 100%;height: 58vh" border tooltip-effect="dark"
				          :data="resbomtableData" row-key="ID"
				          :cell-class-name="scfjfpxsCellClass">
				  <template v-for="(item, idx) in resbom_tableColumns">
				    <el-table-column #default="{ row, column, $index }" align="left" :label="item.label" :width="item.width" >
				      <div v-if="['物料名称', '计划用料', '定额用料','门封', '备注'].includes(item.prop)">
							<el-input
							v-model="row[item.prop]"
							:clearable="false"
							:id="`input${idx}${$index}`"
							@input="handleInput($event, row, item.prop)"
							/>
				      </div>
				      <div v-else>{{ row[item.prop] }}</div>
				    </el-table-column>
				  </template>
				</el-table>
			</div>
			<div class="dialog-footer" style="text-align: right;margin-top: 5px;">
			  <el-button @click="res_bomcloseDialog" style="width: 100px;height: 40px;">关闭</el-button>
			  <el-button type="primary"  @click="res_bomenterDialog" style="width: 100px;height: 40px;">确认修改</el-button>
			</div>
		</el-dialog>
		
		
		<el-dialog v-model="ddzl_dialogFormVisible" :before-close="dd_closeDialog" title="修改订单资料"
		  width="70%" top="3%" destroy-on-close >
		  <!-- 主布局，分为左右两部分 -->
		  <el-row>
		    <!-- 左侧部分，包括第一列和第二列 -->
		    <el-col :span="16">
		      <el-row>
		        <!-- 第一列 -->
		        <el-col :span="12">
		          <el-form :model="edit_ddformData">
		            <el-form-item label="订单编号" label-width="100px">
		              <el-input v-model="edit_ddformData['订单编号']" disabled />
		            </el-form-item>
		
		            <el-form-item label="生产款号" label-width="100px">
		              <el-input
		                v-model="edit_ddformData['生产款号']" id='生产款号'
		                @keydown="add_gdzlent($event, '单位', '生产款号', '订单数量')"
		              />
		            </el-form-item>
		
		            <el-form-item label="款式" label-width="100px">
		              <el-input
		                v-model="edit_ddformData['款式']"id='款式'
		                @keydown="add_gdzlent($event, '订单数量', '款式', '落货日期')"
		              />
		            </el-form-item>
		          </el-form>
		        </el-col>
		
		        <!-- 第二列 -->
		        <el-col :span="12">
		          <el-form>
		            <el-form-item label="客户编号" label-width="100px">
		              <el-input v-model="edit_ddformData['客户编号']" disabled />
		            </el-form-item>
					<el-form-item label="订单数量" label-width="100px">
					  <el-input v-model="edit_ddformData['订单数量']" id='订单数量'
		                @keydown="add_gdzlent($event, '生产款号', '订单数量', '款式')"
		              />
					</el-form-item>
		            <el-form-item label="落货日期" label-width="100px">
		              <el-date-picker
		                v-model="edit_ddformData['落货日期']"
		                type="date"id='落货日期'
		                 @keydown="add_gdzlent($event, '款式', '落货日期', '面料')"
		               />
		            </el-form-item>
		          </el-form>
		        </el-col>
		      </el-row>
		
		      <!-- 面料，独占两列宽度，继续在左侧布局 -->
		      <el-row>
		        <el-col :span="24">
		          <el-form-item label="面料" label-width="100px">
		            <el-input
		              type="textarea"
		              v-model="edit_ddformData['面料']"
		              rows="2"
		              resize="none" id='面料'
		                 @keydown="add_gdzlent($event, '落货日期', '面料', '箱唛要求')"
		               />
		          </el-form-item>
		        </el-col>
		      </el-row>
		
		      <!-- 其他表单项 -->
		      <el-row>
		        <el-col :span="24">
		          <el-form-item label="箱唛要求" label-width="100px">
		            <el-input
		              type="textarea" id='箱唛要求'
					  v-model="edit_ddformData['箱唛要求']"
		                 @keydown="add_gdzlent($event, '面料', '箱唛要求', '要求')"
		              rows="2"
		              resize="none"
		            />
		          </el-form-item>
		        </el-col>
		      </el-row>
		
		      <el-row>
		        <el-col :span="24">
		          <el-form-item label="备注" label-width="100px">
		            <el-input
		              type="textarea"
		              v-model="edit_ddformData['要求']" id='要求'
		                 @keydown="add_gdzlent($event, '箱唛要求', '要求', '船样描述')"
		              rows="2"
		              resize="none"
		            />
		          </el-form-item>
		        </el-col>
		      </el-row>
			  
			  <el-row>
			    <el-col :span="24">
			      <el-form-item label="船样描述" label-width="100px">
			        <el-input
			          type="textarea" id='船样描述'
		                 @keydown="add_gdzlent($event, '要求', '船样描述', '船样合计')"
			          v-model="edit_ddformData['船样描述']"
			          rows="2"
			          resize="none"
			        />
			      </el-form-item>
			    </el-col>
			  </el-row>
		    </el-col>
		
		    <!-- 右侧部分，第三列 -->
		    <el-col :span="8">
		      <el-form>
		      <div style="display: flex; align-items: center;">
		        <el-upload
		          ref="uploadRef"
		          class="upload-demo"
		          :action="uploadUrl"
		          :http-request="customUpload"
		          :headers="uploadHeaders"
		          list-type="picture-card"
		          :on-preview="handlePreview"
		          :on-remove="handleRemove"
		          :before-upload="beforeUpload"
		          :on-success="handleSuccess"
		          :on-error="handleError"
		          :file-list="fileList"
		          :limit="1"
		          accept="image/jpeg,image/png"
		          style="margin-left: 20px;"
		        >
		          <i class="el-icon-plus"></i>
		        </el-upload>
		      </div>
			<h4 style="font-size: 18px; margin-left: 150px;">上传图片</h4>
		
		        <!-- 独立的制单信息 -->
		        <el-form-item label="制单人" label-width="120px">
		          <el-input v-model="edit_ddformData['Sys_id']" disabled />
		        </el-form-item>
		
		        <el-form-item label="制单日期" label-width="120px">
		          <el-date-picker
		            v-model="edit_ddformData['Sys_rq']" id='制单日期'
		            disabled
		            type="date"
		          />
		        </el-form-item>
		      </el-form>
		    </el-col>
		  </el-row>
		
		  <!-- 底部其他表单项 -->

		<div style="display: flex; justify-content: space-between; margin-top: 10px;">
		  <el-form :model="edit_ddformData" style="flex: 1;">
		    <div style="display: flex;">
		      <div style="flex:0.5; margin-right: 10px;">
		        <el-form-item label="船样合计" label-width="100px">
		          <el-input v-model="edit_ddformData['船样合计']" id="船样合计"
		            @keydown="add_gdzlent($event, '船样描述', '船样合计', '粘衬')"
		          />
		        </el-form-item>
		      </div>
		      <div style="flex: 0.9;">
		        <el-form-item label="粘衬" label-width="60px">
		          <el-input v-model="edit_ddformData['粘衬']" id="粘衬"
		            @keydown="add_gdzlent($event, '船样合计', '粘衬', '单位')"
		          />
		        </el-form-item>
		      </div>
		      <div style="flex: 0.4;">
		        <el-form-item label="单位" label-width="70px">
		          <el-input v-model="edit_ddformData['单位']" id="单位"
		            @keydown="add_gdzlent($event, '粘衬', '单位', '生产款号')"
		          />
		        </el-form-item>
		      </div>
			  <div style="flex: 1;">
				 
			    <el-form-item label="" class="mab" prop="isBanciSelected" label-width="90">
			      <el-checkbox 
			        v-model="edit_ddformData['合并']" 
			        class="custom-checkbox"
			      >
			        <span style="color: red;">需要将订单数据合并请勾选</span>
			      </el-checkbox>
			    </el-form-item>
			  </div>
		    </div>
		  </el-form>
		</div>
		  <!-- 底部操作按钮 -->
		  <template #footer>
		    <div class="dialog-footer" style="text-align: right;">
		      <el-button @click="dd_closeDialog">取消</el-button>
		      <el-button type="primary" @click="dd_edit_Dialog">确定</el-button>
		    </div>
		  </template>
		</el-dialog>
			
			
			<!-- 新增颜色资料弹窗 -->
         <el-dialog
            v-model="add_gdyjdialogFormVisible"
            :before-close="add_gdyjcloseDialog"
            style="width: 66%; max-height: 80%; overflow-y: auto; margin-top: 4%;"
            :title="'新增颜色资料'"
            destroy-on-close>
            <el-form label-width="100px" :model="add_yszlformdata">
              <el-row :gutter="24" class="form-row">
                <el-col :span="10">
                  <div style="display: flex; gap: 0px;">
                    <h3 style="color:red;font-size: 24px;margin:-5px 0px 8px 12px;" >订单编号&nbsp;&nbsp;&nbsp;{{_ddhval}}</h3>
                  </div>
                </el-col>
                <el-col :span="10">
                  <el-form-item label="订单子编号:" class="mab" prop="keyOrder" id ='订单子编号' label-width='110'>
                    <el-input v-model="add_yszlformdata.ddzbh" disabled style="width: 250px;" />
                  </el-form-item>
                </el-col>
              </el-row>
        
              <el-row :gutter="24" class="form-row">
                <el-col :span="10">
                  <el-form-item label="色系名称:" class="mab" prop="keyOrder" label-width='110'>
					  <el-select
						v-model="add_yszlformdata.sxmc" style="width: 150px;" id="色系名称" 
						@keydown="add_gdzlent($event, '', '色系名称', '款号:')">
						<el-option 
						  v-for="color in getSuborderscolor.colorlist" 
						  :key="color.id" 
						  :label="color.colorname" 
						  :value="color.colorname"  
						  @click="xz_sxhandleSizeChange(color.colorname,color.colorcode)">
						</el-option>
					  </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="10">
                  <el-form-item label="PO号:" class="mab" prop="keyOrder" label-width="110">
                    <el-input v-model="add_yszlformdata.kh" style="width: 250px;" id ='款号:' @keydown="add_gdzlent($event, '色系名称', '款号:', '颜色备注')"/>
                  </el-form-item>
                </el-col>
              </el-row>
        
              <el-row :gutter="24" class="form-row">
				  <el-col :span="8">
				    <el-form-item label="颜色备注:" prop="joinDate" label-width='110'>
				      <el-input v-model="add_yszlformdata.ysbz" style="width: 250px;" id ='颜色备注' @keydown="add_gdzlent($event, '款号:', '颜色备注', '是否船样')"/>
				    </el-form-item>
				  </el-col>
    
                <el-col :span="8">
                  <el-form-item label="是否船样:" prop="joinDate" label-width='200'>
                    <el-select v-model="add_yszlformdata.sfcy" style="width: 150px;" id ='是否船样'  @keydown="add_gdzlent($event, '颜色备注', '是否船样', 'cm1')">
                      <el-option label="是" value="是" @click="cyChange('是')"></el-option>
                      <el-option label="否" value="否" @click="cyChange('否')"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
        
              <el-row :gutter="24" class="form-row">
                <el-col :span="24">
                  <el-form-item label="尺码:" class="mab" prop="keyOrder" label-width='110'>
                    <el-input v-model="cmformdata.cm1"  style="width: 80px;" id ='cm1'  @keydown="add_gdzlent($event, '是否船样', 'cm1', 'cm2')"/>
                    <el-input v-model="cmformdata.cm2"  style="width: 80px;" id ='cm2'  @keydown="add_gdzlent($event, 'cm1', 'cm2', 'cm3')"/>
                    <el-input v-model="cmformdata.cm3"  style="width: 80px;" id ='cm3'  @keydown="add_gdzlent($event, 'cm2', 'cm3', 'cm4')"/>
                    <el-input v-model="cmformdata.cm4"  style="width: 80px;" id ='cm4'  @keydown="add_gdzlent($event, 'cm3', 'cm4', 'cm5')"/>
                    <el-input v-model="cmformdata.cm5"  style="width: 80px;" id ='cm5'  @keydown="add_gdzlent($event, 'cm4', 'cm5', 'cm6')"/>
                    <el-input v-model="cmformdata.cm6"  style="width: 80px;" id ='cm6'  @keydown="add_gdzlent($event, 'cm5', 'cm6', 'cm7')"/>
                    <el-input v-model="cmformdata.cm7"  style="width: 80px;" id ='cm7'  @keydown="add_gdzlent($event, 'cm6', 'cm7', 'cm8')"/>
                    <el-input v-model="cmformdata.cm8"  style="width: 80px;" id ='cm8'  @keydown="add_gdzlent($event, 'cm7', 'cm8', 'cm9')"/>
					<el-input v-model="cmformdata.cm9"  style="width: 80px;" id ='cm9'  @keydown="add_gdzlent($event, 'cm8', 'cm9', 'zds1')"/>
                    <el-input v-model="cmformdata.cm10"  style="width: 80px;"/>
                  </el-form-item>
                </el-col>
              </el-row>
        
              <el-row :gutter="24" class="form-row">
                <el-col :span="24">
                  <el-form-item label="制单数:" class="mab" prop="keyOrder" label-width='110'>
                    <el-input v-model="zdsformdata.zds1" @input="updateTotal" style="width: 80px;" id ='zds1'  @keydown="add_gdzlent($event, 'cm9', 'zds1', 'zds2')"/>
                    <el-input v-model="zdsformdata.zds2" @input="updateTotal" style="width: 80px;" id ='zds2'  @keydown="add_gdzlent($event, 'zds1', 'zds2', 'zds3')"/>
                    <el-input v-model="zdsformdata.zds3" @input="updateTotal" style="width: 80px;" id ='zds3'  @keydown="add_gdzlent($event, 'zds2', 'zds3', 'zds4')"/>
                    <el-input v-model="zdsformdata.zds4" @input="updateTotal" style="width: 80px;" id ='zds4'  @keydown="add_gdzlent($event, 'zds3', 'zds4', 'zds5')"/>
                    <el-input v-model="zdsformdata.zds5" @input="updateTotal" style="width: 80px;" id ='zds5'  @keydown="add_gdzlent($event, 'zds4', 'zds5', 'zds6')"/>
                    <el-input v-model="zdsformdata.zds6" @input="updateTotal" style="width: 80px;" id ='zds6'  @keydown="add_gdzlent($event, 'zds5', 'zds6', 'zds7')"/>
                    <el-input v-model="zdsformdata.zds7" @input="updateTotal" style="width: 80px;" id ='zds7'  @keydown="add_gdzlent($event, 'zds6', 'zds7', 'zds8')"/>
                    <el-input v-model="zdsformdata.zds8" @input="updateTotal" style="width: 80px;" id ='zds8'  @keydown="add_gdzlent($event, 'zds7', 'zds8', 'zds9')"/>
					<el-input v-model="zdsformdata.zds9" @input="updateTotal" style="width: 80px;" id ='zds9'  @keydown="add_gdzlent($event, 'zds8', 'zds9', '色系名称')"/>
                    <el-input v-model="zdsformdata.zds10" readonly style="width: 80px;" />
                  </el-form-item>
                </el-col>
              </el-row>

        
            </el-form>
        
            <template #footer>
              <div class="dialog-footer" style="display: flex; justify-content: flex-end; padding: 10px;">
                <el-button type="primary" @click="add_dyjcloseDialog">取消</el-button>
                <el-button type="primary" @click="add_gdyjenterDialog">确定</el-button>
              </div>
            </template>
            
          </el-dialog>
            
        <!-- 新增工序资料-->
        <el-dialog v-model="visible" :before-close="()=> visible = false" style="width: 25%;margin: 10% auto" :title="'新增工序资料'" destroy-on-close>
    <el-form>
      <div>
        <div style="display: flex; gap: 0px;">
          <h3 style="color:red;font-size: 24px;margin:0px 0px 0px 15px;">订单号&nbsp;&nbsp;&nbsp;{{_ddhval}}</h3>
        </div>

        <div style="display: flex; gap: 0px;">
          <el-form-item label="仓库出库："  class="mab" prop="isBanciSelected" label-width="110">
        <el-checkbox v-model="form['仓库出库']"></el-checkbox>
          </el-form-item>
        </div>

        <div style="display: flex; gap: 0px;">
          <el-form-item label="裁切："  class="mab" prop="isBanciSelected" label-width="110">
          <el-checkbox v-model="form['裁切']"></el-checkbox>
          </el-form-item>
        </div>

        <div style="display: flex; gap: 0px;">
          <el-form-item label="车缝："  class="mab" prop="isBanciSelected" label-width="110">
          <el-checkbox v-model="form['车缝']"></el-checkbox>
          </el-form-item>
        </div>

        <div style="display: flex; gap: 0px;">
          <el-form-item label="后道收样："  class="mab" prop="isBanciSelected" label-width="110">
          <el-checkbox v-model="form['后道收样']"></el-checkbox>
          </el-form-item>
        </div>

        <div style="display: flex; gap: 0px;">
          <el-form-item label="大烫："  class="mab" prop="isBanciSelected" label-width="110">
          <el-checkbox v-model="form['大烫']"></el-checkbox>
          </el-form-item>
        </div>

        <div style="display: flex; gap: 0px;">
          <el-form-item label="总检："  class="mab" prop="isBanciSelected" label-width="110">
          <el-checkbox v-model="form['总检']"></el-checkbox>
          </el-form-item>
        </div>

        <div style="display: flex; gap: 0px;">
          <el-form-item label="包装："  class="mab" prop="isBanciSelected" label-width="110">
          <el-checkbox v-model="form['包装']"></el-checkbox>
          </el-form-item>
        </div>
      </div>
    </el-form>
    <template #footer>
      <div class="dialog-footer" style="text-align: right;top: auto;">
      <el-button @click="add_gxcloseDialog">取 消</el-button>
      <el-button type="primary"  @click="add_gxenterDialog">确 定</el-button>
      </div>
    </template>
        </el-dialog>

        <!-- 技术附件 -->
        <el-dialog v-model="jsfjdialogFormVisible" :before-close="jsfjcloseDialog" :title="产品技术附件资料" 
					style="margin-top: 40px" height="500px" width="700px" destroy-on-close>
			  <el-form :model="jsfjformdata" label-position="right" ref="elFormRef" :rules="rule" label-width="90px">
				<el-row :gutter="24">
					<el-col :span="10">
					 <div style="display: flex; gap: 0px;">
					   <h3 style="color:red;font-size: 24px;margin:-5px 0px 8px 12px;" >订单编号&nbsp;&nbsp;&nbsp;{{_ddhval}}</h3>
					 </div>
					</el-col>
				</el-row>
				<br />
				<el-row :gutter="24">  
				  <el-col :span="16">  
					<el-form-item label="附件备注:" prop="address" class="mab">  
					  <el-select v-model="jsfjformdata.附件备注" placeholder="请选择附件类型" id="附件备注">  
						<el-option label="订单附件" value="订单资料附件"></el-option>
						<el-option label="技术附件" value="技术附件"></el-option>
					  </el-select>  
					</el-form-item>  
				  </el-col>  
				</el-row> 
				<br>
				<el-row :gutter="24">
					<!-- <el-col :span="8">
						<br>
						<p>s</p>
					</el-col> -->
					<el-col :span="12">
						<!-- <br> -->
						<el-form-item label="附件备注:" prop="address" class="mab">  
						<input style="font-size:16px;" type="file" @change="uploadExcel" >
						</el-form-item>  
					</el-col>
				<!-- 	<el-col :span="4">
						<br>
						<el-button @click="yulan">预览</el-button>
					</el-col> -->
				</el-row>
			  </el-form>
			  <template #footer>
				  <br>
				<div class="dialog-footer">
				  <el-button @click="jsfjcloseDialog">取 消</el-button>
				  <el-button type="primary"  @click="jsfjenterDialog">确 定</el-button>
				</div>
			  </template>
			</el-dialog>

      <!-- 面料库存弹窗 -->
      <el-dialog v-model="mlinventoryVisible" :before-close="mlcloseDialog" title="面料库存出入库记录" 
					style="margin-top: 40px" height="300px" width="1000px" destroy-on-close>
			  <el-form :model="mlformdata" label-position="right" ref="elFormRef" :rules="rule" label-width="90px">
          <el-table
			  ref="table"
			  highlight-current-row
			  show-overflow-tooltip
			  border
			  :data="historytableData"
			  :row-style="{ height: '25px' }"
			  :cell-style="{ padding: '0px' }"
			  :header-row-style="{ height: '20px' }"
			  :header-cell-style="{ padding: '0px' }"
			  style="width: 100%;height: 75vh;" >
		
		  <el-table-column label="订单编号" prop="订单编号"width="110" ></el-table-column>
		  <el-table-column label="面料" prop="面料" width="110"></el-table-column>
		  <el-table-column label="颜色" prop="颜色" width="110"></el-table-column>
		  <el-table-column label="入库数量" prop="入库数量" width="110"></el-table-column>
		  <el-table-column label="出库数量" prop="出库数量" width="110"></el-table-column>
		  <el-table-column label="领料部门" prop="领料部门" width="110"></el-table-column>
		  <el-table-column label="领料时间" prop="领料时间" width="110"></el-table-column>
		</el-table>
				<br>
			  </el-form>
			  <template #footer>
				  <br>
				<div class="dialog-footer">
				  <el-button @click="mlcloseDialog">取 消</el-button>
				  <el-button type="primary"  @click="mlenterDialog">确 定</el-button>
				</div>
			  </template>
			</el-dialog>

          </el-main>
        </layout-content>
      </layout>
    </layout>
	
	<!-- 打印订单表预览 -->
    <PrintPage ref="printPageRef" />
	<!-- 子订单详情页 -->
	<luckyexcelPage ref="luckyexcelPageRef" />
	
	
  </div>
</template>
<script>
//点击按钮显示下方表格
export default {
  data() {
    return {
      currentTable: '', // 当前展示的表格
      activeName: 'first',
      _ddhval:'',
	   size: '',
	  add_gddialogFormVisible: true,
    };
  },
  methods: {
    
  }
};
</script>

<script setup> 
// 全量引入格式化工具 请按需保留
import $script from 'scriptjs'
import $ from 'jquery';
import LuckyExcel from 'luckyexcel';
import { Layout, LayoutSider, LayoutContent } from '@arco-design/web-vue';
import { ElMessage, ElMessageBox,ElUpload, ElButton } from 'element-plus'
import { ref, reactive, computed, nextTick, watch,onMounted,onBeforeUnmount } from 'vue'
import axios from 'axios';
import * as XLSX from 'xlsx';
import jsPDF from 'jspdf';
import {Datalist,WorkOrderList,WorkOrderAdd,PrintListData,
printDetailAdd,PrintDetailDel,orderDataDel,getWorkOrder,
getSuborder,PrintDataEdit,WorkOrderEdit,gdAnnexAdd,upload,OrderAttachments,getPonumber,FabricEdit,orderBomList,FabricDetail,fabricList,Bomdel} from '@/api/mes/job'
import PrintPage from './components/print.vue'
import luckyexcelPage from './components/luckyexcel.vue'
import AddGongYi from './components/addGongYi.vue'  
import { useUserStore } from '@/pinia/modules/user';
defineOptions({name: 'Company'})
//定义打印跳转页面
const printPageRef = ref()
const luckyexcelPageRef = ref()
//获取登录用户信息
const userStore = useUserStore()
const _username = ref('')
_username.value = userStore.userInfo.userName + '/' + userStore.userInfo.nickName
console.log('获取用户名称',_username.value)
//全局获取当前日期
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 uploadUrl = ref('http://mes-dacheng-api:8083/index.php/api/work_order/ImgUpload') 

// 获取环境变量
const basePath = import.meta.env.VITE_BASE_PATH;
const uploadsPort = import.meta.env.VITE_UPLOADS_PORT;
// 动态生成路径
let path = basePath && uploadsPort ? `${basePath}:${uploadsPort}` : undefined;
// 如果 path 是 undefined，则使用默认地址
if (!path || path.includes("undefined")) {
    console.log("第一路径获取失败，尝试使用备用地址 http://192.168.28.22:8082");
    path = "http://192.168.28.22:8082";
}
// 如果还是 undefined，再降级到本地地址
if (path.includes("undefined")) {
    console.log("备用地址获取失败，使用本地地址 http://127.0.0.1:58082");
    path = "http://127.0.0.1:58082";
}
console.log("最终获取地址：", path);

// 上传的URL
const uploadUrl = ref(`${path}/api/work_order/ImgUpload`);
// const uploadUrl = ref("http://192.168.28.22:8082/api/work_order/ImgUpload");
const uploadHeaders = { 'Content-Type': 'multipart/form-data' };
const fileList = reactive([]);
const uploadRef = ref(null);
// 预览图片
const handlePreview = (file) => {
  console.log('预览文件:', file);
};
// 移除图片
const handleRemove = (file, fileList) => {
  console.log('移除文件:', file, '剩余文件:', fileList);
};
// 上传错误处理
const handleError = (err, file, fileList) => {
  console.error('上传失败:', err);
  ElMessage.error(`图片上传失败: ${err.message || '未知错误'}`);
};
// 上传前的检查与图片压缩
const beforeUpload = (file) => {
  const isJPGOrPNG = file.type === 'image/jpeg' || file.type === 'image/png';
  const isLt500K = file.size / 1024 < 500;
  if (!isJPGOrPNG) {
    ElMessage.error('上传图片只能是 JPG 或 PNG 格式!');
    return false;
  }
  if (!isLt500K) {
    ElMessage.error('上传图片大小不能超过 500KB!');
    return false;
  }
  // 图片格式和大小符合，压缩图片
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => {
      const img = new Image();
      img.src = reader.result;
      img.onload = () => {
        const canvas = document.createElement('canvas');
        const ctx = canvas.getContext('2d');
        const fixedWidth = 300;
        const fixedHeight = 300;
        canvas.width = fixedWidth;
        canvas.height = fixedHeight;
        ctx.drawImage(img, 0, 0, fixedWidth, fixedHeight);
        canvas.toBlob((blob) => {
          const compressedFile = new File([blob], file.name, { type: file.type });
          resolve(compressedFile);
        }, file.type);
      };
    };
    reader.onerror = (error) => {
      ElMessage.error('图片处理失败');
      reject(error);
    };
  });
};
// 上传成功处理
const handleSuccess = (response, file, fileList) => {
  console.log('上传成功:', response, file, fileList);
};
// 自定义上传逻辑
const customUpload = async (options) => {
  try {
    const formData = new FormData();
    formData.append('image', options.file);
    const response = await axios.post(uploadUrl.value, formData, {
      headers: uploadHeaders,
      onUploadProgress: (progressEvent) => {
        options.onProgress({
          percent: Math.round((progressEvent.loaded * 100) / progressEvent.total),
        });
      },
    });
    if (response.data.code === 0) {
      options.onSuccess(response.data);
      ElMessage.success('图片上传成功');
      add_gdscgdformData.img = response.data.data.url;
	  edit_ddformData.img = response.data.data.url;
    } else {
      throw new Error(response.data.msg);
    }
  } catch (error) {
    console.error('上传失败:', error);
    options.onError(error);
    ElMessage.error(`上传失败: ${error.message}`);
  }
};

// =========== 左侧树侧形结构 =========== 
const treeData = ref([])
const tableData = ref([])
const _Gd_khdh = ref(null)
const defaultProps = {  
      children: 'children',  
      label: 'label'  
    };  
const Datalistdata = async () => {
  try {
    const Datalists = await Datalist();
	console.log(Datalists)
  Datalists.data.forEach(id => {  
    treeData.value.push({  
      label: id,
    });  
  }); 
  } catch (error) {
    console.error(error);
  }
};
Datalistdata();

//点击左侧树形获取编号
const handleNodeClick = async (node) => {
	ystableData.splice(0, ystableData.length);
	gytableData.splice(0, gytableData.length);
	ddtableData.splice(0, ddtableData.length);
	jstableData.splice(0, jstableData.length);
	// 取消所有节点的颜色
	const allNodes = document.querySelectorAll('.treecolor .el-tree-node');
		allNodes.forEach(node => {
		node.querySelector('.el-tree-node__label').style.color = '';
	});
	// 获取点击的节点 给当前点击的节点改变颜色【红色】
	const clickedNodeId = node['$treeNodeId'];
	const clickedNode = document.querySelector(`.treecolor .el-tree-node[data-key="${clickedNodeId}"]`);
	if (clickedNode) {
		clickedNode.querySelector('.el-tree-node__label').style.color = 'red';
	}
	ystableData.length = 0
	searchInfo.value = '';
	_Gd_khdh.value = node.label.split('【')[0];
	_WorkList_page();
};


const showPdf = async (row) => {
	luckyexcelPageRef.value.open(row)
};
//调用订单资料列表
const _WorkList_page = async () => {
	console.log("page",page.value)
	console.log("pageSize",pageSize.value)
  try {
	//通过客户编号获取
    const WorkListdata = await WorkOrderList({search:_Gd_khdh.value,page:1,limit:100});
    tableData.value = WorkListdata.data.data
    total.value = WorkListdata.data.total
  } catch (error) {
    console.error(error);
  }
};

//调用订单资料列表
const page_WorkList_page = async () => {
	console.log("page",page.value)
	console.log("pageSize",pageSize.value)
  try {
	//通过客户编号获取
	const WorkListdata = await WorkOrderList({search:_Gd_khdh.value,page:page.value,limit:pageSize.value});
    tableData.value = WorkListdata.data.data
    total.value = WorkListdata.data.total
  } catch (error) {
    console.error(error);
  }
};

//============订单资料============
//订单资料修改
const ddzl_dialogFormVisible = ref(false)
const edit_ddformData = ref({
	 合并: false,
})
// 双击订单表格
const updateCompanyFunc = async (row) => {
	ddzl_dialogFormVisible.value = true;
	if(row.water === '1'){
		edit_ddformData.value = {
			合并: true
		}
	}else{
		edit_ddformData.value = {
			合并: false
		}
	}
  Object.assign(edit_ddformData.value,row);

}

//订单资料修改确认
const dd_edit_Dialog = async () => {
	//日期转换
	let lhrq_formattedDeliveryDate = '';  
	if (edit_ddformData.value.落货日期) {  
		const date = new Date(edit_ddformData.value.落货日期);  
		lhrq_formattedDeliveryDate = `${date.getFullYear()}-${('0' + (date.getMonth() + 1)).slice(-2)}-${('0' + date.getDate()).slice(-2)}`;  
	}  
	let params = {};
	params.订单编号 = edit_ddformData.value.订单编号
	params.生产款号 = edit_ddformData.value.生产款号
	params.客户编号 = edit_ddformData.value.客户编号
	params.款式 = edit_ddformData.value.款式
	params.箱唛要求 = edit_ddformData.value.箱唛要求
	params.面料 = edit_ddformData.value.面料
	params.要求 = edit_ddformData.value.要求
	params.船样描述 = edit_ddformData.value.船样描述  
	params.船样合计 = edit_ddformData.value.船样合计
	params.粘衬 = edit_ddformData.value.粘衬
	params.订单数量 = edit_ddformData.value.订单数量
	params.单位 = edit_ddformData.value.单位
	params.接单日期 = edit_ddformData.value.接单日期
	params.落货日期 = lhrq_formattedDeliveryDate
	params.Sys_id = edit_ddformData.value.Sys_id
	params.id = edit_ddformData.value.Uniqid
	params.img = edit_ddformData.img
	console.log(params)
	// return;
	//订单资料修改接口
	const WorkOrderEdit_list = await WorkOrderEdit(params);
	if(WorkOrderEdit_list.code === 0){
		ddzl_dialogFormVisible.value = false;
		//修改成功调用接口更新表格数据
		_WorkList_page()
		ElMessage({type: 'success',message: '修改成功'})
	}else{
		ElMessage({type: 'error',message: '修改失败'})
	}
}

//订单资料修改取消
const dd_closeDialog = async () => {
  ddzl_dialogFormVisible.value = false;
}


//=============颜色资料============
//颜色资料修改
const dialogFormVisible = ref(false)
//尺码
const edit_cmformdata = reactive({
  cm1:'',
  cm2:'',
  cm3:'',
  cm4:'',
  cm5:'',
  cm6:'',
  cm7:'',
  cm8:'',
  cm9:'',
  cm10:'总计',
});
//制单数
const edit_zdsformdata = reactive({
  zds1:'',
  zds2:'',
  zds3:'',
  zds4:'',
  zds5:'',
  zds6:'',
  zds7:'',
  zds8:'',
  zds9:'',
  zds10:'',
});
const Uniqid = ref('')//颜色资料Uniqid



//颜色资料表格双击
const ysupdateCompanyFunc = async (row) => {
	dialogFormVisible.value = true;
	edit_formData.value = { ...row };
	console.log(row)
	edit_formData['子订单编号'] = row['子订单编号']
	edit_formData['颜色备注'] = row['颜色备注']
	edit_formData['款号'] = row['款号']
	edit_formData['船样'] = row['船样']
	edit_formData['颜色'] = row['颜色']
	edit_colorcode.value =row['color_id']
	Uniqid.value = row['Uniqid']
	//获取色系名称列表
	const getSuborders = await getSuborder({order:_Gd_gdbh.value,cy:'否',colorname:edit_formData['颜色']});
	getSuborderscolor.colorlist = getSuborders.data.colorlist;
	let index = 1;  
	// 创建一个函数来构建尺码和数量的映射  
	function buildSizeQuantitiesMap(sizes, formData) {  
		const sizeQuantitiesMap = {};  
		sizes.forEach(size => {  
			// 使用逻辑或操作符确保所有尺码都有数量（默认为0，但如果有值则使用那个值）  
			const quantity = formData[size] || 0;  
			sizeQuantitiesMap[size] = quantity;  
		});  
		return sizeQuantitiesMap;  
	}  
	// 使用函数构建映射  
	let sizeQuantitiesMap = buildSizeQuantitiesMap(sizeDatas, edit_formData.value);  
	let edit_params = {};
	for (const [size, quantity] of Object.entries(sizeQuantitiesMap)) {  
		edit_params[`cm${index}`] = size;  
		edit_params[`cmsl${index++}`] = quantity;  
	}  
	for (let i = 1; i <= 9; i++) {
		edit_cmformdata[`cm${i}`] = edit_params[`cm${i}`] || '';
		edit_zdsformdata[`zds${i}`] = (edit_params[`cmsl${i}`] === 0 || edit_params[`cmsl${i}`] === null) ? '' : edit_params[`cmsl${i}`];
	}
	//计算尺码数量总数合计
    updateTotal()
};

//自动计算制单数总计
function updateTotal() {  
  // 直接指定要累加的属性名  
  const relevantKeys = ['zds1', 'zds2', 'zds3', 'zds4', 'zds5', 'zds6', 'zds7', 'zds8', 'zds9'];  
  const values = relevantKeys.map(key => parseInt(zdsformdata[key], 10) || 0); // 使用 || 0 来处理可能的 NaN 或 undefined/null  
  zdsformdata.zds10 = values.reduce((sum, value) => sum + value, 0);  
  const valuess = relevantKeys.map(key => parseInt(edit_zdsformdata[key], 10) || 0); // 使用 || 0 来处理可能的 NaN 或 undefined/null  
  edit_zdsformdata.zds10 = valuess.reduce((sum, value) => sum + value, 0);  
}  

//点击是否船样 改变子订单编号
const edit_cyChange = async (value) => {
  if (value === '是') {
		const getSuborders = await getSuborder({order:_Gd_gdbh.value,cy:'是',colorname:edit_formData['颜色']});
		edit_formData['子订单编号'] = getSuborders.data;
	}else if(value === '否'){
		const getSuborders = await getSuborder({order:_Gd_gdbh.value,cy:'否',colorname:edit_formData['颜色']});
		edit_formData['子订单编号'] = getSuborders.data.order;
  }
};

//修改颜色资料确认
const ys_edit_Dialog = async () => {
if (!edit_formData.value) return;

function buildSizeQuantitiesMap(sizes, formData) {  
    const sizeQuantitiesMap = {};  
    sizes.forEach(size => {  
      const quantity = formData[size] || 0; // 使用逻辑或操作符确保所有尺码的数量  
      sizeQuantitiesMap[size] = quantity;  
    });  
    return sizeQuantitiesMap;  
  }  
  // 使用函数构建映射  
  const sizeQuantitiesMap = buildSizeQuantitiesMap(sizeDatas, edit_formData.value);  
  let index = 1;  
  const params = {  
    订单编号: edit_formData.value.订单编号,  
    子订单编号: edit_formData.子订单编号,  
    款号: edit_formData.款号,  
	颜色备注: edit_formData.颜色备注,
    船样: edit_formData.船样 === '是' ? '1' : '0', // 转换船样字段  
    颜色: edit_formData.颜色,  
	color_id:edit_colorcode.value,
    zdtotal: edit_zdsformdata.zds10,  
    Sys_id: edit_formData.value.Sys_id,  
    id: Uniqid.value,  
  };  
  for (const [size, quantity] of Object.entries(sizeQuantitiesMap)) {  
    params[`cm${index}`] = size;  
     const cmslValue = +edit_zdsformdata[`zds${index}`]; // 获取对应的数量
     params[`cmsl${index++}`] = cmslValue === 0 ? "" : cmslValue; // 如果为0，赋值为空字符串 
  }  
  const PrintDataEdit_list = await PrintDataEdit(params);
  if(PrintDataEdit_list.code === 0){
	  dialogFormVisible.value = false;
    ElMessage({type: 'success',message: '修改成功'})
	
	//数据列表显示
	const PrintListDatas = await PrintListData({order:_Gd_gdbh.value})
	const jsOrderAttachments = await OrderAttachments({order:_Gd_gdbh.value,desc:'技术附件'})
	const ddOrderAttachments = await OrderAttachments({order:_Gd_gdbh.value,desc:'订单资料附件'})
	
	//颜色资料
	if(PrintListDatas.data.列表.length === 0 ){
	  ystableData.length = 0
	}else{
	  sizeDatas.splice(0,PrintListDatas.data.型号.length,...PrintListDatas.data.型号);//型号数据
	  ystableData.splice(0,PrintListDatas.data.列表.length,...PrintListDatas.data.列表);//表格数据
	  // 使用 map 方法创建一个新数组，并转换船样字段  
	  const newData = PrintListDatas.data.列表.map(item => ({  
	      ...item,  
	      船样: item.船样 === 1 ? '是' : '否'  
	  }));  
	  // 将新数组赋值给 ystableData，这会触发视图更新，清空旧数据（可选，如果不需要保留旧数据的话）  
	  ystableData.length = 0;  
	  ystableData.push(...newData);
	}
    tableRowClick(params)
  }else{
    ElMessage({type: 'error',message: '修改失败'})
  }
};
//颜色资料修改取消
const ys_edit_closeDialog = async (row) => {
	dialogFormVisible.value = false;
};
const mlinventoryVisible = ref(false)
const historytableData = ref([])
// //双击面料库存
// const mlupdateCompanyFunc = async (row) => {
//   mlinventoryVisible.value = true;
// }

//库存测试
const CSclick = async (row) => {
  mlinventoryVisible.value = true;
}

//技术附件弹窗取消
const mlcloseDialog = () => {
  mlinventoryVisible.value = false
}
// 分页
const page = ref(1)
const total = ref(0)
const pageSize = ref(10)
const handleCurrentChange = (val) => {
  page.value = val;
};

// 修改页面容量 点击多少条/页
const handleSizeChange = (val) => {
  pageSize.value = val;
};

// =========== 新增订单资料 ===========
const add_gdscgdformData = reactive({
  订单编号: '',
  生产款号: '',
  款式: '',
  客户编号: '',
  落货日期: '',
  箱唛要求: '',
  面料: '',
  要求: '',
  船样描述: '',
  船样合计: '',
  粘衬: '',
  订单数量: '',
  单位: '件',
  Sys_id: '',
  制单日期: '',
  审核日期: '',
  合并: false,
});

const add_gddialogFormVisible = ref(false)
//点击新增订单资料按钮
const addgd_onclick = async () => {
  console.log("用户信息", _username.value);
  // 判断客户代号是否为空
  if (!_Gd_khdh.value) {
    ElMessage({ type: 'warning', message: '请选择具体的订单后，再操作此功能' });
    return false;
  }
	add_gddialogFormVisible.value = true
	//获取订单编号接口
	const getWorkOrder_list = await getWorkOrder();
	add_gdscgdformData['订单编号'] = getWorkOrder_list.data;
	add_gdscgdformData['客户编号'] = _Gd_khdh.value
	add_gdscgdformData['Sys_id'] = _username.value 
	add_gdscgdformData['制单日期'] = currentDates
	add_gdscgdformData['生产款号'] = ''
	add_gdscgdformData['款式'] = ''
	add_gdscgdformData['落货日期'] = ''
	add_gdscgdformData['面料'] = ''
	add_gdscgdformData['要求'] = ''
	add_gdscgdformData['船样描述'] = ''
	add_gdscgdformData['船样合计'] = ''
	add_gdscgdformData['箱唛要求'] = ''
	add_gdscgdformData['粘衬'] = ''
	add_gdscgdformData['订单数量'] = ''
	add_gdscgdformData['合并'] = false
}

//新增工单资料确定
const add_gdenterDialog = async ()=>{
	// 定义需要校验的字段和对应的提示信息
	const fields = [
	  { key: '款式', message: '款式不能为空' },
	  { key: '订单编号', message: '网络异常, 请重新打开' },
	  { key: '客户编号', message: '网络异常, 请重新打开' },
	  { key: '落货日期', message: '落货日期不能为空' },
	  { key: '订单数量', message: '订单数量不能为空' }
	];
	// 遍历每个字段，进行非空或未定义校验
	for (const field of fields) {
	  if (!add_gdscgdformData[field.key]) {
	    ElMessage({ type: 'warning', message: field.message });
	    return false;
	  }
	}
	// 校验制单日期
	if (!add_gdscgdformData['制单日期']) {
	  ElMessage({ type: 'warning', message: '制单日期不能为空' });
	  return false;
	}
	
  //日期转换
  let lhrq_formattedDeliveryDate = '';  
  if (add_gdscgdformData['落货日期']) {  
    const date = new Date(add_gdscgdformData['落货日期']);  
    lhrq_formattedDeliveryDate = `${date.getFullYear()}-${('0' + (date.getMonth() + 1)).slice(-2)}-${('0' + date.getDate()).slice(-2)}`;  
  }  
	const formattedData = {
		订单编号: add_gdscgdformData['订单编号'],
		生产款号: add_gdscgdformData['生产款号'],
		款式: add_gdscgdformData['款式'],
		客户编号: add_gdscgdformData['客户编号'],
		落货日期: lhrq_formattedDeliveryDate,
		箱唛要求: add_gdscgdformData['箱唛要求'],
		面料: add_gdscgdformData['面料'],
		要求: add_gdscgdformData['备注'],
		船样描述: add_gdscgdformData['船样描述'],
		船样合计: add_gdscgdformData['船样合计'],
		粘衬: add_gdscgdformData['粘衬'],
		订单数量: add_gdscgdformData['订单数量'],
		单位: add_gdscgdformData['单位'],
		water: add_gdscgdformData['合并'] ? 1 : null,
		Sys_id: _username.value,
		接单日期: currentDates,
		img: add_gdscgdformData.img,
	};
	console.log(formattedData)
	const edit_gdformdata_list = await WorkOrderAdd(formattedData);
	if (edit_gdformdata_list.code === 0) {
		add_gddialogFormVisible.value = false;
		ElMessage({type: 'success',message: '新增成功'})
    const WorkListdata = await WorkOrderList({search:_Gd_khdh.value,page:1,limit:1});
		tableData.value=WorkListdata.data.data
	} else {
		ElMessage({ type: 'error',message: '新增失败'})
	}
 
}
//新增工单资料取消
const add_gdcloseDialog = () => {
  add_gddialogFormVisible.value = false
}

// =========== 新增颜色资料 ===========
const add_gdyjdialogFormVisible = ref(false)
const add_yszlformdata = reactive({
  ddh: '',
  ddzbh: '',
  sxmc: '',
  cmgg: '',
  sfcy: '',
  ysbz: '',
});
const cmformdata = reactive({
  cm1:'32',
  cm2:'34',
  cm3:'36',
  cm4:'38',
  cm5:'40',
  cm6:'42',
  cm7:'44',
  cm8:'46',
  cm9:'48',
  cm10:'总计',
});
const zdsformdata = reactive({
  zds1:'',
  zds2:'',
  zds3:'',
  zds4:'',
  zds5:'',
  zds6:'',
  zds7:'',
  zds8:'',
  zds9:'',
  zds10:'',
});
//记录色系编号
const add_colorcode = ref('')

//选择色系名称获取子订单编号
const xz_sxhandleSizeChange =  async  (value,color_id) => {
	
	//获取子订单编号
	const getPonumberdata = await getSuborder({colorname:value,order:_ddhval.value,cy:add_yszlformdata.sfcy});
	console.log("获取子订单编号",getPonumberdata)
	add_yszlformdata.ddzbh = getPonumberdata.data.order ? getPonumberdata.data.order : getPonumberdata.data;
	
  if (value === '红色系') {
    add_yszlformdata.sxmc = value
	add_colorcode.value = color_id
  } else if(value === '黄色系'){
   add_yszlformdata.sxmc = value
   add_colorcode.value = color_id
  }else if(value === '蓝色系'){
  add_yszlformdata.sxmc = value
  add_colorcode.value = color_id
  }else if(value === '绿色系'){
   add_yszlformdata.sxmc = value
   add_colorcode.value = color_id
  }else if(value === '紫色系'){
   add_yszlformdata.sxmc = value
   add_colorcode.value = color_id
  }else if(value === '灰色系'){
 add_yszlformdata.sxmc = value
 add_colorcode.value = color_id
  }else if(value === '咖啡色系'){
  add_yszlformdata.sxmc = value
	add_colorcode.value = color_id
  }else if(value === '黑色系'){
  add_yszlformdata.sxmc = value
	add_colorcode.value = color_id
  }else if(value === '经典色系'){
  add_yszlformdata.sxmc = value
	add_colorcode.value = color_id
  }else if(value === '白色系'){
  add_yszlformdata.sxmc = value
	add_colorcode.value = color_id
  }
};

const edit_formData = reactive({
  '颜色': ''
});

//记录色系编号
const edit_colorcode = ref('')
const xg_sxhandleSizeChange =  async (value,color_id) => {
	
	const getPonumberdata = await getSuborder({colorname:value,order:_ddhval.value,cy:edit_formData['船样']});
	console.log(edit_formData.value)	
	if(edit_formData.value['颜色'] === edit_formData['颜色']){
		edit_formData['子订单编号'] = edit_formData.value['子订单编号']
	}else{
		edit_formData['子订单编号'] = getPonumberdata.data.order ? getPonumberdata.data.order : getPonumberdata.data;
	}
  if (value === '红色系') {
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  } else if(value === '黄色系'){
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  }else if(value === '蓝色系'){
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  }else if(value === '绿色系'){
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  }else if(value === '紫色系'){
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  }else if(value === '灰色系'){
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  }else if(value === '咖啡色系'){
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  }else if(value === '黑色系'){
  edit_formData['颜色'] = value
	edit_colorcode.value = color_id
  }else if(value === '经典色系'){
  edit_formData['颜色'] = value
  }else if(value === '白色系'){
  edit_formData['颜色'] = value
  }
};

//清空对象的属性值
const gdyj_clearFormData = () => {
  Object.keys(zdsformdata).forEach(key => {
    zdsformdata[key] = '';
  });
};


//点击是否船样 改变子订单编号
const cyChange = async (value) => {
  if (value === '是') {
		add_yszlformdata.ddzbh = _Gd_gdbh.value + '-99'
		const getSuborders = await getSuborder({order:_Gd_gdbh.value,cy:'是',colorname:add_yszlformdata['sxmc']});
		add_yszlformdata['ddzbh'] = getSuborders.data;
	}else if(value === '否'){
		const getSuborders = await getSuborder({order:_Gd_gdbh.value,cy:'否',colorname:add_yszlformdata['sxmc']});
		add_yszlformdata['ddzbh'] = getSuborders.data.order;
  }
};

const getSuborderscolor = reactive({
      colorlist: []
});
	
//新增颜色资料按钮
const addgdyj_onclick = async  () => {
  if(_Gd_gdbh.value === '' || _Gd_gdbh.value === null){
    ElMessage({type: 'warning',message: '请选择具体的工单后，再操作此功能'})
    return false;
  }else{
	add_gdyjdialogFormVisible.value = true
	add_yszlformdata['sxmc'] = '红色系';
    const getSuborders = await getSuborder({order:_Gd_gdbh.value,cy:'否',colorname:'红色系'});
	console.log(getSuborders)
	
	
	getSuborderscolor.colorlist = getSuborders.data.colorlist;
			
	add_yszlformdata['ddzbh'] = getSuborders.data.order;
	// 假设获取的数据是 getSuborders.data
	if (getSuborders.data.cm) {
	  // 判断并赋值
	  cmformdata.cm1 = getSuborders.data.cm.cm1 || '';
	  cmformdata.cm2 = getSuborders.data.cm.cm2 || '';
	  cmformdata.cm3 = getSuborders.data.cm.cm3 || '';
	  cmformdata.cm4 = getSuborders.data.cm.cm4 || '';
	  cmformdata.cm5 = getSuborders.data.cm.cm5 || '';
	  cmformdata.cm6 = getSuborders.data.cm.cm6 || '';
	  cmformdata.cm7 = getSuborders.data.cm.cm7 || '';
	  cmformdata.cm8 = getSuborders.data.cm.cm8 || '';
	  cmformdata.cm9 = getSuborders.data.cm.cm9 || '';
	  cmformdata.cm10 = '合计';
	}

    add_yszlformdata['ddh'] = _Gd_gdbh.value;
    add_yszlformdata['ys'] = '';
	add_yszlformdata['kh'] = '';
	// add_yszlformdata['sxmc'] = '';
    // add_yszlformdata['cmgg'] = '32~46';
    add_yszlformdata['sfcy'] = '否';
	add_yszlformdata['颜色备注'] = '否';
    add_yszlformdata['kdy'] = _username.value;
    gdyj_clearFormData();
  }
}



const child_order = ref('')
//单机颜色资料表格
const ystableclick =  async  (row) => {
	console.log(row.子订单编号)
	child_order.value = row.子订单编号
}



//新增颜色资料确定
const add_gdyjenterDialog =  async  () => {
	//必填
	if(add_yszlformdata['kh'] === ''){
		ElMessage({type: 'warning',message: '款号不能为空'})
		return false;
	}
	if(add_yszlformdata['ysbz'] === ''){
		ElMessage({type: 'warning',message: '颜色备注不能为空'})
		return false;
	}
	if(add_yszlformdata['sxmc'] === ''){
		ElMessage({type: 'warning',message: '色系名称不能为空'})
		return false;
	}

	let cy = '';
	if(add_yszlformdata['sfcy'] === '是'){
		cy = '1'
	}else if(add_yszlformdata['sfcy'] === '否'){
		cy = '0'
	}
	
  const addyszltable = {
    订单编号: add_yszlformdata['ddh'],
	子订单编号: add_yszlformdata['ddzbh'],
	颜色: add_yszlformdata['sxmc'],
    款号: add_yszlformdata['kh'],
	颜色备注:add_yszlformdata.ysbz,
	船样: cy,
    Sys_id:add_yszlformdata['kdy'],
	color_id:add_colorcode.value,
	//尺码
    cm1: cmformdata['cm1'],
    cm2: cmformdata['cm2'],
    cm3: cmformdata['cm3'],
    cm4: cmformdata['cm4'],
    cm5: cmformdata['cm5'],
    cm6: cmformdata['cm6'],
    cm7: cmformdata['cm7'],
    cm8: cmformdata['cm8'],
	cm9: cmformdata['cm9'],
	//尺码数量
	cmsl1: zdsformdata['zds1'],
    cmsl2: zdsformdata['zds2'],
    cmsl3: zdsformdata['zds3'],
    cmsl4: zdsformdata['zds4'],
    cmsl5: zdsformdata['zds5'],
    cmsl6: zdsformdata['zds6'],
    cmsl7: zdsformdata['zds7'],
    cmsl8: zdsformdata['zds8'],
	cmsl9: zdsformdata['zds9'],
    zdtotal: zdsformdata['zds10'],
	};
	console.log(addyszltable)
	// return;
  const printDetailAdds = await printDetailAdd(addyszltable);
  if (printDetailAdds.code === 0) {
		add_gdyjdialogFormVisible.value = false;
		ElMessage({type: 'success',message: '新增成功'})
  }
  const PrintListDatas = await PrintListData({order:_Gd_gdbh.value})
	if(PrintListDatas.data.列表.length === 0){
		ystableData.length = 0
	}else{
		sizeDatas.splice(0,PrintListDatas.data.型号.length,...PrintListDatas.data.型号);
		ystableData.splice(0,PrintListDatas.data.列表.length,...PrintListDatas.data.列表);
	}
  
}  


  

//新增颜色资料取消
const add_dyjcloseDialog = () => {
  add_gdyjdialogFormVisible.value = false
}
//键盘input框跳转
const add_gdzlent = async (event,id1,id2,id3,idx) => {
  if(event.keyCode === 40){
    if(id3!=''){
      document.getElementById(id3).focus()
    }
  }else if (event.keyCode === 13) { // 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()
    }
  }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 visible = ref(false)
const form = reactive({
  '仓库出库':true,
  '裁剪':true,
  '车缝':true,
  '手工':true,
  '大烫':true,
  '总检':true,
  '包装':true,
})

//新增工序资料按钮
const addgdgy_onclick = () => {
  if(_Gd_gdbh.value === '' || _Gd_gdbh.value === null){
    ElMessage({type: 'warning',message: '请选择具体的工单后，再操作此功能'})
    return false;
  }else{
    visible.value = true;
  }
}

//新增工序资料确定按钮
const add_gxenterDialog = () => {
	console.log(form)
	const formattedData = {
		ckck: form['仓库出库'],
		cq: form['裁剪'],
		cf: form['车缝'],
		hdsy: form['手工'],
		dt: form['大烫'],
		zj: form['总检'],
		bz: form['包装']
	};
	// true 选择 fasle 未选择
	for (let key in formattedData) {
	    if (formattedData[key] === true) {
	        formattedData[key] = 1;
	    } else if (formattedData[key] === false) {
	        formattedData[key] = 2;
	    }
	}
  	console.log(formattedData)
}

//新增工序资料取消按钮
const add_gxcloseDialog = () => {
    visible.value = false;
}


// =========== 订单打印 ===========
const cp_gdprintonClick = () => {
	console.log(_Gd_gdbh.value)
	
  if(_Gd_gdbh.value === '' || _Gd_gdbh.value === null){
    ElMessage({type: 'warning',message: '请选择具体的工单后，再操作此功能'})
    return false;
  }else{
    if(ystableData.length >=1){
      printPageRef.value.open(_Gd_gdbh.value) 
    }else{
      ElMessage({type: 'warning',message: '请新增颜色资料，再操作此功能'})
      return false;
    }
  }
}

// =========== BOM资料 ===========
const res_bomdialogFormVisible = ref(false)
const resbomtableData = ref([]);
const ddhformData = reactive({
  ddh: '',
  kh: '',
  sckh: '',
  ks: '',
});
const resbom_tableColumns = ref(
    [
      { label: '物料名称', prop: '物料名称', width: '170' },
      { label: '计划用料', prop: '计划用料', width: '130' },
	  { label: '定额用料', prop: '定额用料', width: '130' },
	  { label: '门封', prop: '门封', width: '170' },
	  { label: '裁床实际用料', prop: '裁床实际用料', width: '130' },
	  { label: '裁床领用面料', prop: '裁床领用面料', width: '130' },
	  { label: '裁床退回仓库面料', prop: '裁床退回仓库面料', width: '170' },
	  { label: '备注', prop: '备注', width: '170' },
	  { label: '投料单位', prop: '投料单位', width: '100' },
    ]
)
//批量修改BOM资料
const BOMclick = () => {
	if(bomtableData.value === ''){
		ElMessage({type: 'warning',message: 'BOM数据为空'})
		return;
	}
	if(_Gd_gdbh.value === '' || _Gd_gdbh.value === null){
		ElMessage({type: 'warning',message: '请选择订单后，再操作此功能'})
		return;
	}else{
		res_bomdialogFormVisible.value = true
		ddhformData.ddh = _Gd_gdbh.value
		ddhformData.kh = _Gd_kh.value
		ddhformData.sckh = _Gd_sckh.value
		ddhformData.ks = _Gd_ks.value
		_TestCoefficient();
	}
}

const handleInput = (value, row, prop) => {
	if(prop != "物料名称" && prop != "备注" ){
		// 使用正则表达式过滤非数字和小数点的字符
		let filteredValue = value.replace(/[^\d.]/g, '');

		// 不允许以 . 开头
		if (filteredValue.startsWith('.')) {
		filteredValue = filteredValue.slice(1); // 去掉开头的 .
		}

		// 确保只有一个小数点
		const parts = filteredValue.split('.');
		if (parts.length > 2) {
		// 如果超过一个小数点，只保留第一个
		row[prop] = `${parts[0]}.${parts.slice(1).join('')}`;
		} else {
		// 否则直接赋值
		row[prop] = filteredValue;
		}
		}

};


//bom数据获取
const _TestCoefficient = async ()=>{
  try {
    const orderBomListdata = await orderBomList({order:_Gd_gdbh.value});
	console.log(orderBomListdata)
	resbomtableData.value = orderBomListdata.data;
    const formattedData = orderBomListdata.data.map(item=>{
      item.物料名称 = item.物料名称;
      item.计划用料 = item.计划用料;
	  item.定额用料 = item.定额用料;
	  item.裁床实际用料 = item.裁床实际用料;
	  item.裁床领用面料 = item.裁床领用面料;
	  item.裁床退回仓库面料 = item.裁床退回仓库面料;
	  item.备注 = item.备注;
	  item.投料单位 = "米";
	  // item.UNIQID = item.UNIQID;
      return item
    });
  } catch (error) {
    console.error(error);
  }
}
const resbom_handleKeyDown = (event, x, y, prop) => {
  const currentElement = document.getElementById(`input${x}${y}`);
  if (currentElement === null && currentElement === undefined) return
  let move = 0
  switch (event.keyCode) {
    case 13: // Enter
    case 40: // 向下箭头
      if (y < resbomtableData.value.length )
        document.getElementById(`input${x}${y + 1}`).focus();
      break;
    case 38: // 向上箭头
      if ( y > 0) {
        document.getElementById(`input${x}${y - 1}`).focus();
      }
      break;
    case 39: // 向左箭头
      if (x >= 0 && x <=6) {
        move = x + 1
      }
      document.getElementById(`input${move}${y}`).focus();
      break;
    case 37: // 向右箭头
      if (x = 0  && x <=6) {
        move = x - 1
      }
      document.getElementById(`input${move}${y}`).focus();
      break;
    default:
      break;
  }
}
//质检废品系数颜色
const scfjfpxsCellClass = ({row, column, rowIndex, columnIndex}) =>{
  if (
		column.label === '门封' ||
		column.label === '计划用料' || 
		column.label === '备注' || 
		column.label === '物料名称' || 
		column.label === '计划用量' || 
		column.label === '定额用料' ) {
    return 'background-plan-usage-low';
  }
}

//新增
const add_bomenterDialog = async() => {
	// 创建一行空数据，字段值可以根据需求初始化
	  const newRow = {
	    '物料名称': '',
	    '计划用料': '',
	    '定额用料': '',
	    '裁床实际用料': '',
	    '裁床领用面料': '',
	    '裁床退回仓库面料': '',
	    '备注': '',
	    '投料单位': '米'
	  };
	  
	  // 将新增的行数据推入到表格数据中
	  resbomtableData.value.push(newRow);
}


//修改
const res_bomenterDialog = async () => {
	const rawValueArray = resbomtableData._rawValue;
	const formattedData = rawValueArray
	.filter(item => item.物料名称 !== null && item.物料名称 !== "")  // 过滤掉物料名称为空的行
	.map(item => {
	  return {
		UNIQID: item.UNIQID !== undefined ? item.UNIQID : "",
		BOM_物料名称: item.物料名称 !== null ? item.物料名称 : "",
		BOM_计划用量: item.计划用料 !== null ? item.计划用料 : "",
		BOM_标准用量: item.定额用料 !== null ? item.定额用料 : "",
		BOM_实际用量: item.裁床实际用料 !== null ? item.裁床实际用料 : "",
		Bom_领用数量: item.裁床领用面料 !== null ? item.裁床领用面料 : "",
		BOM_退还数量: item.裁床退回仓库面料 !== null ? item.裁床退回仓库面料 : "",
		BOM_desc: item.备注 !== null ? item.备注 : "",
		BOM_门封: item.门封 !== null ? item.门封 : "",
		BOM_投料单位: "米",
		Sys_ID: userStore.userInfo.nickName,
		Sys_rq: currentDate
	  }
	});
	console.log(formattedData);

	const add_FabricEditdata = await FabricEdit(formattedData);
	if (add_FabricEditdata.code === 0) {
		res_bomdialogFormVisible.value = false;
		ElMessage({type: 'success',message: '修改成功'})
		const orderBomListdata = await orderBomList({order:_Gd_gdbh.value});
		bomtableData.splice(0,orderBomListdata.data.length,...orderBomListdata.data);//bom表格数据
	} else {
		ElMessage({ type: 'error',message: '修改失败'})
	}
	
}

// 取消
const 
res_bomcloseDialog = () => {
	res_bomdialogFormVisible.value = false;
}


//BOM资料表格双击
const edit_bomdialogFormVisible = ref(false)
const edit_resbomtableData = ref([]);
const edit_resbom_tableColumns = ref(
    [
      { label: '物料名称', prop: '物料名称', width: '170' },
      { label: '计划用料', prop: '计划用料', width: '130' },
	  { label: '定额用料', prop: '定额用料', width: '130' },
	  { label: '门封', prop: '门封', width: '170' },
	  { label: '裁床实际用料', prop: '裁床实际用料', width: '130' },
	  { label: '裁床领用面料', prop: '裁床领用面料', width: '130' },
	  { label: '裁床退回仓库面料', prop: '裁床退回仓库面料', width: '170' },
	  { label: '备注', prop: '备注', width: '170' },
	  { label: '投料单位', prop: '投料单位', width: '100' },
    ]
)

const UNIQID = ref('')
const bombomupdateCompanyFunc = async (row) => {
	edit_bomdialogFormVisible.value = true
	ddhformData.ddh = _Gd_gdbh.value
	ddhformData.kh = _Gd_kh.value
	ddhformData.sckh = _Gd_sckh.value
	ddhformData.ks = _Gd_ks.value
	UNIQID.value = row.UNIQID
	_editTestCoefficient()
}


// BOM数据获取
const _editTestCoefficient = async () => {
  try {
    // 获取 BOM 数据
    const orderBomListdata = await orderBomList({ order: _Gd_gdbh.value });
    console.log(orderBomListdata);

    // 过滤数据，只保留 UNIQID 相同的项
    const filteredData = orderBomListdata.data.filter(item => item.UNIQID === UNIQID.value);

    // 处理数据
    edit_resbomtableData.value = filteredData.map(item => ({
      物料名称: item.物料名称,
      计划用料: item.计划用料,
      定额用料: item.定额用料,
      裁床实际用料: item.裁床实际用料,
      裁床领用面料: item.裁床领用面料,
      裁床退回仓库面料: item.裁床退回仓库面料,
      备注: item.备注,
	  门封: item.门封,
	  投料单位 : "米",
      UNIQID: item.UNIQID // 保留 UNIQID 以便后续使用
    }));

  } catch (error) {
    console.error(error);
  }
};


//一键修改
const editres_bomenterDialog = async () => {
	const rawValueArray = edit_resbomtableData._rawValue;
	const formattedData = rawValueArray
	.filter(item => item.物料名称 !== null && item.物料名称 !== "")  // 过滤掉物料名称为空的行
	.map(item => {
	  return {
		UNIQID: item.UNIQID !== undefined ? item.UNIQID : "",
		BOM_物料名称: item.物料名称 !== null ? item.物料名称 : "",
		BOM_计划用量: item.计划用料 !== null ? item.计划用料 : "",
		BOM_标准用量: item.定额用料 !== null ? item.定额用料 : "",
		BOM_实际用量: item.裁床实际用料 !== null ? item.裁床实际用料 : "",
		Bom_领用数量: item.裁床领用面料 !== null ? item.裁床领用面料 : "",
		BOM_退还数量: item.裁床退回仓库面料 !== null ? item.裁床退回仓库面料 : "",
		BOM_desc: item.备注 !== null ? item.备注 : "",
		BOM_门封: item.门封 !== null ? item.门封 : "",
		BOM_投料单位: "米",
		Sys_ID: userStore.userInfo.nickName,
		Sys_rq: currentDate
	  }
	});
	console.log(formattedData);
	
	const add_FabricEditdata = await FabricEdit(formattedData);
	if (add_FabricEditdata.code === 0) {
		edit_bomdialogFormVisible.value = false;
		ElMessage({type: 'success',message: '修改成功'})
		const orderBomListdata = await orderBomList({order:_Gd_gdbh.value});
		bomtableData.splice(0,orderBomListdata.data.length,...orderBomListdata.data);//bom表格数据
	} else {
		ElMessage({ type: 'error',message: '修改失败'})
	}
}
// 取消
const editres_bomcloseDialog = () => {
	edit_bomdialogFormVisible.value = false;
}
//点击表格行获取下方表格数据列表
// =========== 颜色资料、工艺资料、技术资料附件 ===========
//全局调用订单号编号
const _Gd_gdbh = ref('')
const _ddhval = ref('')
const _Gd_kh = ref('')
const _Gd_sckh = ref('')
const _Gd_ks = ref('')
//颜色资料
const ystableData = reactive([])
//尺寸列表
const sizeDatas = reactive([])
//工艺资料
const gytableData = reactive([])
//订单资料表
const ddtableData = reactive([])
//技术附件
const jstableData = reactive([])
//BOM附件
const bomtableData = reactive([])
//面料附件
const mltableData = reactive([])

//点击订单资料行
const tableRowClick = async (row) => {
	//清空尺寸列表、颜色资料、工艺资料、订单资料附件、技术附件
	sizeDatas.length = 0
	ystableData.splice(0, ystableData.length);
	gytableData.splice(0, gytableData.length);
	ddtableData.splice(0, ddtableData.length);
	jstableData.splice(0, jstableData.length);
	bomtableData.splice(0, bomtableData.length);
	mltableData.splice(0, mltableData.length);
    _Gd_gdbh.value = row.订单编号
    _ddhval.value = row.订单编号
	_Gd_kh.value = row.客户编号
	_Gd_sckh.value = row.生产款号
	_Gd_ks.value = row.款式
    try {
		//数据列表显示
        const PrintListDatas = await PrintListData({order:_Gd_gdbh.value})
        const jsOrderAttachments = await OrderAttachments({order:_Gd_gdbh.value,desc:'技术附件'})
        const ddOrderAttachments = await OrderAttachments({order:_Gd_gdbh.value,desc:'订单资料附件'})
		
		const orderBomListdata = await orderBomList({order:_Gd_gdbh.value});
		bomtableData.value = orderBomListdata.data
		bomtableData.splice(0,orderBomListdata.data.length,...orderBomListdata.data);//bom表格数据
		
		const fabricListdata = await fabricList({order:_Gd_gdbh.value});
		mltableData.splice(0,fabricListdata.data.length,...fabricListdata.data);//bom表格数据
		//颜色资料
        if(PrintListDatas.data.列表.length === 0 ){
          ystableData.length = 0
        }else{
          sizeDatas.splice(0,PrintListDatas.data.型号.length,...PrintListDatas.data.型号);//表格尺码投数据
          ystableData.splice(0,PrintListDatas.data.列表.length,...PrintListDatas.data.列表);//表格数据
          const newData = PrintListDatas.data.列表.map(item => ({  
              ...item,  
              船样: item.船样 === 1 ? '是' : '否'  
          }));  
          ystableData.length = 0;  
          ystableData.push(...newData);
        }
		//技术附件
		if(jsOrderAttachments.data === ''){
		  const WorkListdata = [];
		  jstableData.splice(0,jstableData.length,...WorkListdata);
		}
        if(jsOrderAttachments.code === 0 && ddOrderAttachments.code === 0){
          jstableData.splice(0,jsOrderAttachments.data.length,...jsOrderAttachments.data);
          ddtableData.splice(0,ddOrderAttachments.data.length,...ddOrderAttachments.data);
        }
    //BOM资料

    //面料库存
      } catch (error) {
        console.error(error);
    }
}

// //pdf
// const showPdfModal = ref(false);
// const pdfContainer = ref(null);

// const closeModal = () => {
//   showPdfModal.value = false;
// };

// const fetchAndConvertFile = async () => {
//   try {
//     // 从后端获取 Base64 编码的 XLSX 文件数据
//     const responses = await OrderAttachments({order:_Gd_gdbh.value,desc:'技术附件'});
//     const response= responses.data[0].附件内容
//     const base64Data = response.match(/base64,(.*)$/)?.[1]; 

// if (!base64Data) {
//   throw new Error('Invalid Base64 data');
// }

// const binaryString = atob(base64Data);
// const binaryLen = binaryString.length;
// const bytes = new Uint8Array(binaryLen);

// for (let i = 0; i < binaryLen; i++) {
//   bytes[i] = binaryString.charCodeAt(i);
// }

//        // 解析 XLSX 文件
//        const workbook = XLSX.read(bytes, { type: 'array' });
//     const worksheet = workbook.Sheets[workbook.SheetNames[0]];
//     console.log(121212,worksheet)
//     const jsonData = XLSX.utils.sheet_to_json(worksheet);
	
// 	let base64 = XLSX.write(worksheet, { type: 'base64' });
	
//     generatePdf(base64);
//   } catch (error) {
//     console.error('Error fetching and converting file:', error);
//   }
// };

// const generatePdf = (data) => {
//  console/log('pdf data', data)
//  const pdfDoc = new jsPDF()
//  pdfDoc.text(data)
//  pdfDoc.save(a4.pdf)
// };

// const previewPdf = (blob) => {
//   const fileURL = URL.createObjectURL(blob);

//   // 通过 ref 引用 pdfContainer 来在指定容器中显示 PDF
//   const iframe = document.createElement('iframe');
//   iframe.src = fileURL;
//   iframe.width = '100%';
//   iframe.height = '600px';

//   if (pdfContainer.value) {
//     pdfContainer.value.innerHTML = ''; // 清空之前的内容
//     pdfContainer.value.appendChild(iframe);
//   }
// };

//表格复选框
const table_del = ref(true)//删除订单资料
const table_Selection = ref('')//存储选中Uniqid
const ddzlSelectionChange = (selection, type) => {
  const ids = selection.map(item => {
    return item.Uniqid
  })
  table_Selection.value = ids.join(',')
}

//删除按钮
const del_ddzlClick = async () => {
  let params = {};  
  params.Uniqid = table_Selection._value; 
  console.log(params)
  const res1 = await orderDataDel(params)
  res1.code === 0 && ElMessage.success('删除成功')
    const WorkListdata = await WorkOrderList({search:_Gd_khdh.value,page:"1",limit:"10"});
   tableData.value= WorkListdata.data.data
   ystableData.splice(0, ystableData.length);//颜色资料清空
   gytableData.splice(0, gytableData.length);//工艺资料情空
   ddtableData.splice(0, ddtableData.length);//订单资料附件清空
   jstableData.splice(0, jstableData.length);//技术附件清空
}


const delall = ref(true)
//颜色复选框
const ysSelection = ref('')
//工艺复选框
const gySelection = ref('')
// 颜色资料多选、工艺资料多选
const selectionChange = (selection, type) => {
  console.log(selection)
  const ids = selection.map(item => {
	  if(type === '颜色资料'){
		return type === '颜色资料' ? item.Uniqid: item.Uniqid
	  }
	  if(type === '工艺资料'){
	  return type === '工艺资料' ? item.Uniqid: item.Uniqid
	  } 
  })
  
  if (type === '颜色资料') {
    ysSelection.value = ids.join(',')
  }
  if (type === '工艺资料') {
    gySelection.value = ids.join(',')
  }
}

// ===========删除颜色资料、工艺资料 ===========
const delgd_delclick = async () => {
  if (ysSelection.value !== '') {
    try {
      const res1 = await PrintDetailDel({UniqId: ysSelection.value})
      res1.code === 0 && ElMessage.success('颜色资料删除成功')
    } catch(err) {
      ElMessage.error(err)
    }
  }
  if (gySelection.value !== ''){
    try {
      const res2 = await PrintDetailDel({UniqId: gySelection.value})
      if(res2.code === 0){
        ElMessage.success('工艺资料删除成功')
        const PrintListDatas = await PrintListData({order:_Gd_gdbh.value})
        sizeDatas.splice(0,PrintListDatas.data.型号.length,...PrintListDatas.data.型号);
        ystableData.splice(0,PrintListDatas.data.列表.length,...PrintListDatas.data.列表);
      }else{
        console.log('?')
      }
    } catch(err) {
      ElMessage.error(err)
    }
  } 
}

const fj_Selection = ref('')//存储选中Uniqid
const fjSelection = ref('')
const fjdelall = ref(true)
const fjSelectionChange = (selection, type) => {
	// console.log(selection)
  const ids = selection.map(item => {
    return item.UniqId
  })
  fj_Selection.value = ids.join(',')
  console.log("附件复选框",fj_Selection.value)
}

// //删除附件按钮
const fj_delclick = async () => {
  let params = {};  
  params.UniqId = fj_Selection._value; 
  res1.code === 0 && ElMessage.success('删除成功')
}

//BOM表格复选框
const del_bom = ref(true)//删除BOM资料
const bom_Selection = ref('')//存储选中Uniqid
const bomSelectionChange = (selection, type) => {
  const ids = selection.map(item => {
    return item.UNIQID
  })
  bom_Selection.value = ids.join(',')
  console.log("bom复选框",bom_Selection.value)
}

// 删除BOM资料按钮
const delbom_delclick = async () => {
  try {
    // 弹出确认框
    await ElMessageBox.confirm('此操作将永久删除该文件, 是否继续?', '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    });
    // 用户点击“确定”后执行以下逻辑
    const params = {
		UNIQID: bom_Selection._value,
    };
    console.log('删除参数:', params);
    // 调用删除接口
    const res1 = await Bomdel(params);
    if (res1.code === 0) {
      ElMessage.success('删除成功');
    } else {
      ElMessage.error('删除失败');
      return; // 如果删除失败，直接返回
    }
    // 重新获取BOM列表数据
    const orderBomListdata = await orderBomList({ order: _Gd_gdbh.value });
    bomtableData.splice(0, bomtableData.length, ...orderBomListdata.data);
  } catch (error) {
    // 用户点击“取消”或弹框关闭
    console.log('用户取消删除操作');
  }
};

  //合计
  const getSummaries = (param) => {  
    const { columns, data } = param;  
    const sums = {};  
	//选择你希望合计的列
    const summableLabels = [...sizeDatas, "制单总数"];
    columns.forEach((column, index) => {  
        if (index === 1) {  
            sums[index] = '总数量合计';  
            return;  
        }  
  
        if (summableLabels.includes(column.label)) {  
            const values = data.map(item => Number(item[column.property]));  
  
            // 检查数组中是否所有值都是 NaN  
            if (!values.every(value => isNaN(value))) {  
                sums[index] = values.reduce((prev, curr) => {  
                    const value = Number(curr);  
                    if (!isNaN(value)) {  
                        return prev + value; 
                    }  
                    return prev;  
                }, 0);  
                // 如果需要，可以在这里添加单位  
                // sums[index] += ' 件';  
            } else {  
                 sums[index] = 'N/A';  
            }  
        }  
    });  
  
    return sums;  
};  

// 面料合计
// const mlgetSummaries = (param) => {  
//     const { columns, data } = param;  
//     const sums = {};  
// 	//选择你希望合计的列
//     const summableLabels = ["库存总量"];
//     columns.forEach((column, index) => {  
//         if (index === 0) {  
//             sums[index] = '总数量合计';  
//             return;  
//         }  
//         if (summableLabels.includes(column.label)) {  
//             const values = data.map(item => Number(item[column.property]));  
//             if (!values.every(value => isNaN(value))) {  
//                 sums[index] = values.reduce((prev, curr) => {  
//                     const value = Number(curr);  
//                     if (!isNaN(value)) {  
//                         return prev + value; 
//                     }  
//                     return prev;  
//                 }, 0);  
//             } else {  
//                  sums[index] = 'N/A';  
//             }  
//         }  
//     });  
//     return sums;  
// };  



//=========查询========
const searchInfo = ref('')

//查询按钮
const onSubmit = async () => {
  if(searchInfo.value === ''){
    ElMessage({type: 'warning',message: '请输入搜索的订单编号'})
    return false;
  }else{
  const WorkListdata = await WorkOrderList({search:searchInfo.value,page:"1",limit:"1"});
   tableData.value= WorkListdata.data.data
   ystableData.splice(0, ystableData.length);//颜色资料清空
   gytableData.splice(0, gytableData.length);//工艺资料情空
   ddtableData.splice(0, ddtableData.length);//订单资料附件清空
   jstableData.splice(0, jstableData.length);//技术附件清空
  }
};


// 调用查询数据接口
const _cha_WorkList = async (node) => {
  if(searchInfo.value === ''){
    ElMessage({type: 'warning',message: '请输入搜索的信息'})
    return false;
  }
  const search = searchInfo.value;
  var regex = /^[a-zA-Z0-9]+$/;
  try {
    if (regex.test(search)) {
      // 符合条件，执行搜索操作
      console.log('搜索内容为纯数字加字母');
      // const WorkListdata = await WorkList({search:search,limit:100,page:1});//接口调用函数
      if(WorkListdata.data.total === 0){
        ElMessage({type: 'warning',message: '未搜索具体查询条件'})
      }
      tableData.splice(0,tableData.length,...WorkListdata.data.data);//表格数据
      total.value = WorkListdata.data.total;//共多少条
    } else {
      // 不符合条件，给出提示
      console.log('搜索内容包含非字母和数字的字符');
      // const WorkListdata = await WorkList({Gd_khdh:'',search:search,limit:100,page:1});//接口调用函数
      if(WorkListdata.data.total === 0){
        ElMessage({type: 'warning',message: '未搜索具体查询条件'})
      }
      tableData.splice(0,tableData.length,...WorkListdata.data.data);//表格数据
      total.value = WorkListdata.data.total;//共多少条
    }
  } catch (error) {
    console.error(error);
  }
};


//===============附件上传===============
//附件上传按钮
const jsfjClick = () => {
  if(_Gd_gdbh.value === '' || _Gd_gdbh.value === null){
	  ElMessage({type: 'warning',message: '请选择具体的工单后，再操作此功能'})
	}else{
		jsfjdialogFormVisible.value = true
		initJsfjformdata();
		jsfjformdata.value.关联编号 = _Gd_gdbh.value
	}
}
//技术附件弹窗
const jsfjdialogFormVisible = ref(false)
const jsfjformdata = ref({
	sys_id: _username.value,
	附件备注: '',
	附件内容: '',
	附件类型: '',
	关联编号: '',
});
//技术附件弹窗取消
const initJsfjformdata = () => {
  jsfjformdata.value = {
	sys_id: _username.value,
	附件备注: '',
	附件内容: '',
	附件类型: '',
	关联编号: '',
  }
}
//技术附件弹窗取消
const jsfjcloseDialog = () => {
  jsfjdialogFormVisible.value = false
}
const uploadExcel = (event) =>{
	const files = event.target.files;
	console.log(files)
	let suffixArr = name.split("."), suffix = suffixArr[suffixArr.length-1];
	jsfjformdata.value.附件内容 = files[0]
	jsfjformdata.value.附件类型 = files[0].name.split('.')[1]
}

//技术附件弹窗确定
const jsfjenterDialog = () => {
	if(jsfjformdata.value.附件备注==''){
		ElMessage({type: 'error',message: '请选择附件备注'});
		return;
	}
	if(jsfjformdata.value.附件内容==''){
		ElMessage({type: 'error',message: '请上传文件'});
		return;
	}
	if(jsfjformdata.value.关联编号==''){
		ElMessage({type: 'error',message: '请关闭重新打开'});
		return;
	}
	let fr = new FileReader();
	fr.readAsDataURL(jsfjformdata.value.附件内容);
	fr.onload = function () {
	  const restoredData = new FormData();
	  restoredData.append('附件备注', jsfjformdata.value.附件备注);
	  restoredData.append('附件内容', fr.result);
	  restoredData.append('附件类型', jsfjformdata.value.附件类型);
	  restoredData.append('关联编号', jsfjformdata.value.关联编号);
	  restoredData.append('sys_id', jsfjformdata.value.sys_id);
	  
       //将restoredDta数据新增到接口
	   gdAnnexAdd(restoredData).then(response => {
		 if(response.code==0){
			 ElMessage({type: 'success',message: '新增成功',})
			 jsfjdialogFormVisible.value = false
			 let row = {
				 '订单编号':_Gd_gdbh.value,
				//  '产品代号':_Gd_cpdh.value,
				//  '产品名称':_Gd_cpmc.value,
			 }
			 tableRowClick (row)
		 }
	   })
	}
}


</script>
<style scoped>
/* 在样式表中使用媒体查询 */
@media (max-width: 768px) {
  /* 在小屏幕下的样式设置 */
  .dialog-footer {
    text-align: center;
  }
}
/*背景颜色*/
/*印件背景颜色变黄*/
:deep(.el-table__body .warning-row) {
  background: #FFFF80 !important;
}
/*bom参数背景*/
:deep(.el-table__body .background-plan-usage-low div div div) {
  background: #80FA80 !important;
}
/* 选中某行时的背景色 */
:deep(.el-table__body tr.current-row) > td {
  background: #ff80ff !important;
}
:deep(.statusy-plan-usage-low div) {
  color: #8c939d !important;
}
/* 在样式表中添加以下样式 */
.el-input__textarea {
  resize: none; /* 禁止调整大小 */
}
.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-textarea textarea {
  resize: none !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;
}
.el-pagination{
  margin-top: 0px !important;
}
/* .upload-demo .el-upload {  
  border: 1px dashed #d9d9d9;  
  border-radius: 6px;  
  cursor: pointer;  
  position: relative;  
  overflow: hidden;  
}  
.upload-demo .el-upload:hover {  
  border-color: #409EFF;  
}   */

.mab{
  margin-bottom: 5px;
}
::v-deep(.input_style .el-input__inner) {  
  font-size: 18px; 
}  
::v-deep(.el-form-item__label) {  
  font-size: 18px; 
}

::v-deep(.el-upload-list--picture-card) {  
	margin-left: 100px;
}
::v-deep(.el-checkbox__inner) {  
	width: 20px;
	height: 20px;
}
::v-deep(.el-checkbox__input.is-checked .el-checkbox__inner::after) {  
  top: 30%; 
  left: 30%;
}
::v-deep(.el-descriptions__table tbody tr .is-bordered-label){
	width: 40px;
}
::v-deep(.el-descriptions__table tbody tr .el-descriptions__content){
	width: 120px;
}

</style>