<template>
  <div>
    <el-container>
      <!--    左侧树侧形结构-->
      <el-aside width="300px">
        <div class="JKWTree-tree" style="height: 746px">
          <h3> 产品管理</h3>
<!--          <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick"></el-tree>-->
          <el-tree :data="treeData"  :props="defaultProps" @node-click="handleNodeClick" @node-expand="handleNodeExpand">
            <template #default="{node,data}">
              {{data['客户编号']}}【{{data['客户名称']}}】
            </template>
          </el-tree>
        </div>
      </el-aside>

      <!--  右侧内容区域 -->
      <el-container>
        <el-main>

          <!--      搜索框 -->
          <div class="gva-search-box">
            <el-form ref="elSearchFormRef" :inline="true" :model="searchInfo" class="demo-form-inline" :rules="searchRule" @keyup.enter="onSubmit">
              <!--          左侧查询输入框 -->
              <el-form-item>
                <el-input v-model="searchInfo.keyword" placeholder="搜索产品编号或产品名称" clearable style="width: 200px;"></el-input>
              </el-form-item>
              <!--        查询和重置按钮 -->
              <el-form-item>
                <el-button type="primary" icon="search" @click="onSubmit">查询</el-button>

                <el-button type="primary" icon="edit" @click="onStatusClick">状态设置</el-button>
                <el-dialog v-model="onstatuslist" title="状态设置" width="20%" style="height: 25%; position: fixed; bottom: 35%; left: 40%">
                  <div style="display: flex; flex-direction: column; align-items: center; height: 100%;">
                    <div style="width: 100%; height: 230px; margin: 0 auto; padding: 0px">
                      <div style="width: 100%; height: 50px;">
                        <el-radio-group v-model="status">
                          <el-radio label="在产">在产</el-radio>
                          <el-radio label="停产">停产</el-radio>
                        </el-radio-group>
                      </div>
                      <div style="width: 100%; display: flex; justify-content: center; align-items: flex-end; height: 35%;">
                        <div slot="footer" class="dialog-footer" style="text-align: center;">
                          <el-button @click="handleCancel">取 消</el-button>
                          <el-button type="primary" @click="handleConfirm">确定</el-button>
                        </div>
                      </div>
                    </div>
                  </div>
                </el-dialog>

                <el-button type="primary" icon="edit" @click="gygmClick" style="margin-left: 10px">工艺方案更名</el-button>
                <el-dialog v-model="gygmlist" title="工艺方案更名" width="40%" style="height: 40%; position: fixed; bottom: 30%; left: 30%">
                  <div style="display: flex; flex-direction: column;  height: 100%;">
                    <el-form-item label="产品代号:" prop="process">
                      <el-input v-model="formData['process']" :clearable="true" placeholder="" style="width: 160px;"/>
                    </el-form-item>
                    <br>
                    <el-form-item label=" " prop="processName">
                      <el-input v-model="formData['processName']" disabled :clearable="true" placeholder="" style="width: 100%;" />
                    </el-form-item>
                    <br>
                    <el-form-item label="工艺方案原名:" prop="originalName">
                      <el-input v-model="formData['originalName']" disabled :clearable="true" placeholder="" style="width: 160px;"/>
                    </el-form-item>
                    <br>
                    <el-form-item label="工艺方案新名:" prop="newName" >
                      <el-input v-model="formData['newName']" :clearable="true" placeholder="" style="width: 160px;"/>
                    </el-form-item>

                    <div class="dialog-footer" style="margin-top: 15px; margin-left: 280px;">
                      <el-button @click="gygmhandleCancel">取 消</el-button>
                      <el-button type="primary" @click="gygmhandleConfirm">确定</el-button>
                    </div>
                  </div>
                </el-dialog>

<!--                <el-button icon="refresh" @click="onReset">重置</el-button>-->
<!--                <el-button type="primary" icon="plus" @click="openDialog">新增</el-button>-->
                <el-button type="primary" disabled icon="Download" @click="cpexportToExcel" style="margin-left: 10px">导出产品资料</el-button>
                <el-dialog v-model="cpdialogexportToExcel" title="导出产品资料" width="50%">
                  <!-- 在这里放入弹出页面的内容 -->

                </el-dialog>


                <el-button type="primary" disabled icon="Download" @click="gyexportToExcel" style="margin-left: 10px">导出工艺流程</el-button>
                <el-dialog v-model="gydialogexportToExcel" title="导出工艺流程" width="50%">
                  <!-- 在这里放入弹出页面的内容 -->
                  <p>这是弹出页面的内容 导出工艺流程</p>

                </el-dialog>
              </el-form-item>
            </el-form>
          </div>

          <!--      表格及操作按钮 -->
          <div class="gva-table-box">
            <!--        数据表格 -->
            <el-table ref="multipleTable"
                      style="width: 100%;height: 580px;"
                      border
                      tooltip-effect="dark"
                      :data="tableData"
                      row-key="ID"
                      highlight-current-row="true"
                      @selection-change="handleSelectionChange"
                      @row-dblclick="updateCompanyFunc"
                      @row-click="tableRowClick"
                      :show-overflow-tooltip="true">
              <el-table-column type="selection" width="55" />
              <el-table-column align="left" label="客户编号" prop="客户编号" width="100" />
              <el-table-column align="left" label="产品编号" prop="产品编号" width="115" />
              <el-table-column align="left" label="产品名称" prop="产品名称" width="340" />
              <el-table-column align="left" label="版本号" prop="版本号" width="100"/>
              <el-table-column align="left" label="成品规格" prop="成品规格" width="100" />
              <el-table-column align="left" label="计量单位" prop="计量单位" width="100"/>
              <el-table-column align="left" label="产品类别" prop="产品类别" width="100" />
              <el-table-column align="left" label="生产类别" prop="生产类别" width="100" />
              <el-table-column align="left" label="产品备注" prop="产品备注" width="100" />
              <el-table-column align="left" label="投产日期" prop="投产日期" width="100" />
              <el-table-column align="left" label="状态" prop="状态"  width="100"/>
              <el-table-column align="left" label="U8UID" prop="U8UID" width="100" />
              <el-table-column align="left" label="最后修改" prop="Sys_id" width="160" />
              <el-table-column align="left" label="建档日期" prop="Sys_rq" width="160" />
              <el-table-column sortable align="left" label="更新日期" prop="Mod_rq" width="160" />
              <el-table-column align="left" label="UniqID" prop="UniqID" width="100" />
              <el-table-column align="left" label="最近接单时间" prop="receiveDate" width="160" />
              <el-table-column align="left" label="工艺" prop="gyData" width="100"/>
              <el-table-column align="left" label="印件数" prop="yjData" width="100" />
            </el-table>
            <div class="gva-pagination">
              <el-pagination layout="total, sizes, prev, pager, next, jumper" :current-page="page"
                             :page-size="pageSize" :page-sizes="[10, 30, 50, 100]" :total="total"
                             @current-change="handleCurrentChange" @size-change="handleSizeChange" />
            </div>

          </div>


          <el-tabs v-model="activeName" type="card" @tab-click="handleClick">

            <el-tab-pane label="印件资料"  @click="showTable('印件资料')"  name="first">
              <el-table ref="multipleTable"
                        :show-overflow-tooltip="true"
                        highlight-current-row="true"
                        @row-dblclick="yjupdateCompanyFunc"
                        style="width: 100%;height: 400px" border tooltip-effect="dark" :data="yjtableData" row-key="ID" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55" />
                <el-table-column align="left" label="印件号" prop="yj_yjno"  width="80"/>
                <el-table-column align="left" label="印件代号" prop="yj_yjdh" width="100" />
                <el-table-column align="left" label="印件名称" prop="yj_yjmc" width="340" />
                <el-table-column align="left" label="纸张单号" prop="yj_zzdh" width="100"/>
                <el-table-column align="left" label="纸张名称" prop="yj_zzmc" width="340"/>
                <el-table-column align="left" label="投料规格" prop="yj_tlgg" width="240"/>
                <el-table-column align="left" label="开料规格" prop="yj_klgg" width="100"/>
                <el-table-column align="left" label="开数" prop="yj_ks" width="80" />
                <el-table-column align="left" label="联数" prop="yj_ls" width="80" />
                <el-table-column align="left" label="备注" prop="yj_desc" width="200" />
                <el-table-column align="left" label="建档用户" prop="sys_id" width="130" />
                <el-table-column align="left" label="建档日期" prop="sys_rq" width="160" />
                <el-table-column align="left" label="更新日期" prop="mod_rq" width="160"/>
              </el-table>
            </el-tab-pane>

            <el-tab-pane label="工艺资料" @click="showTable('工艺资料')" name="second">
              <el-table ref="multipleTable"
                        highlight-current-row="true"
                        :show-overflow-tooltip="true"
                        @row-dblclick="gyupdateCompanyFunc"
                        style="width: 100%;height: 400px" border tooltip-effect="dark" :data="gytableData" row-key="ID" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55" />
                <el-table-column align="left" label="方案" prop="方案"  width="70"/>
                <el-table-column align="left" label="印件" prop="Gy0_yjno" width="70" />
                <el-table-column align="left" label="工序" prop="Gy0_gxh" width="70" />
                <el-table-column align="left" label="工序名称" prop="gy0_gxmc" width="120" />
                <el-table-column align="left" label="工序名称" prop="add_gxmc" width="340" />
                <el-table-column align="left" label="开数" prop="Gy0_Ks" width="70" />
                <el-table-column align="left" label="联数" prop="Gy0_ls" width="70" />
                <el-table-column align="left" label="备注" prop="备注" width="150" />
                <el-table-column align="left" label="工价系数" prop="工价系数" width="100" />
                <el-table-column align="left" label="损耗系数" prop="损耗系数" width="100" />
                <el-table-column align="left" label="计损色数" prop="Gy0_Ms" width="100" />
                <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="120"/>
                <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="120"/>
                <el-table-column align="left" label="设备编号" prop="Gy0_sbmc" width="100"/>
                <el-table-column align="left" label="最后修改" prop="最后修改" width="160"/>
                <el-table-column align="left" label="建档日期" prop="建档日期" width="160"/>
                <el-table-column align="left" label="更新日期" prop="更新日期" width="160"/>
              </el-table>
            </el-tab-pane>

            <el-tab-pane label="印版资料" @click="showTable('印版资料')" name="third">
            <el-table ref="multipleTable"
                      highlight-current-row="true"
                      @row-dblclick="ybupdateCompanyFunc"
                      style="width: 100%;height: 400px" border tooltip-effect="dark" :data="ybtableData" row-key="ID" @selection-change="handleSelectionChange">
              <el-table-column type="selection" width="55" />
              <el-table-column align="left" label="方案" prop="YB_方案"  width="100"/>
              <el-table-column align="left" label="印件号" prop="YB_Yjno" width="100" />
              <el-table-column align="left" label="印版类别" prop="印版类别" width="100" />
              <el-table-column align="left" label="存货编码" prop="存货编码" width="100"/>
              <el-table-column align="left" label="印版名称" prop="印版名称"  width="440"/>
              <el-table-column align="left" label="考核印数" prop="考核印数" width="100"/>
              <el-table-column align="left" label="建档用户" prop="建档用户" width="120" />
              <el-table-column align="left" label="建档日期" prop="建档日期" width="160" />
              <el-table-column align="left" label="更新日期" prop="更新日期" width="160" />
            </el-table>
            </el-tab-pane>


            <el-tab-pane label="技术资料附件" @click="showTable('技术资料附件')" name="fourth">
            <el-table ref="multipleTable"
                      highlight-current-row="true"
                      style="width: 100%;height: 400px" border tooltip-effect="dark" :data="jstableData" row-key="ID" @selection-change="handleSelectionChange">
              <el-table-column type="selection" width="55" />
              <el-table-column align="left" label="序号" prop="序号"  width="100"/>
              <el-table-column align="left" label="适用工序" prop="适用工序" width="100" />
              <el-table-column align="left" label="备注" prop="备注" width="100" />
              <el-table-column align="left" label="文件类型" prop="文件类型" width="100"/>
              <el-table-column align="left" label="关联产品" prop="关联产品"  width="360"/>
              <el-table-column align="left" label="建档用户" prop="建档用户" width="100"/>
              <el-table-column align="left" label="建档日期" prop="建档日期" 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="closeDialog" :title="type==='create'?'添加产品基本资料':'修改产品基本资料'" destroy-on-close>
            <el-row>
              <el-scrollbar height="500px">
                <el-form :model="formDataTest" label-position="right" ref="elFormRef" :rules="rule" label-width="100px">
                  <el-row>
                    <el-col :span="10">
                      <el-form-item label="客户编号:" prop="address">
                        <el-input v-model="formDataTest['客户编号']" :clearable="true" placeholder="" style="width: 120px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="24">
                      <el-form-item label="客户名称:" prop="gender">
                        <el-input v-model="formDataTest['客户名称']" :clearable="true" placeholder=""  />
                      </el-form-item>
                    </el-col>
                    <el-col :span="10">
                      <el-form-item label="印品代号:" prop="address">
                        <el-input v-model="formDataTest['U8UID']" :clearable="true" placeholder="" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="版本号:" prop="gender">
                        <el-input v-model="formDataTest['版本号']" :clearable="true" placeholder=""/>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="客户料号:" prop="idCard">
                        <el-input v-model="formDataTest['客户料号']" :clearable="true" placeholder=""  />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="产品名称:" prop="department">
                        <el-input v-model="formDataTest['产品名称']" :clearable="true" placeholder=""  />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="10">
                      <el-form-item label="产品类别:" prop="department">
                        <el-input v-model="formDataTest['产品类别']" :clearable="true" placeholder="" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="10">
                      <el-form-item label="单位:" prop="department">
                        <el-input v-model="formDataTest['计量单位']" :clearable="true" placeholder=""  />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-col :span="24">
                  <el-form-item label="成品规格:" prop="department">
                    <el-input v-model="formDataTest['成品规格']" :clearable="true" placeholder="" />
                  </el-form-item>
                  </el-col>
                    <el-col :span="24">
                      <el-form-item label="产品备注:" prop="remark">
                        <el-input type="textarea" v-model="formDataTest['产品备注']" :rows="4" :clearable="true" placeholder=""  />
                      </el-form-item>
                    </el-col>
                </el-form>
              </el-scrollbar>

            </el-row>

            <template #footer>
              <div class="dialog-footer">
                <el-button @click="closeDialog">取 消</el-button>
                <el-button type="primary" @click="enterDialog">确 定</el-button>
              </div>
            </template>
          </el-dialog>

          <!-- 印件资料 修改弹窗 -->
          <el-dialog v-model="yjdialogFormVisible" :before-close="yjcloseDialog" :title="type==='create'?'添加产品基本资料':'修改产品基本资料'" destroy-on-close>
            <el-row>
              <el-scrollbar height="500px">
                <el-form :model="yjformDataTest" label-position="right" ref="elFormRef" :rules="rule" label-width="140px">
                  <el-row>
                    <el-form-item label="印件号:" prop="address">
                      <el-input v-model="yjformDataTest['yj_yjno']" clearable placeholder="请输入印件号" style="width: 140px;" />
                    </el-form-item>
                  </el-row>
                  <el-row>
                    <el-form-item label="印件代号:" prop="address">
                      <el-input v-model="yjformDataTest['yj_yjdh']" clearable placeholder="请输入印件代码" style="width: 140px;" />
                    </el-form-item>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                    <el-form-item label="印件名称:" prop="address">
                      <el-input v-model="yjformDataTest['yj_yjmc']" clearable placeholder="请输入印件代码" style="width: 100%;" />
                    </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="纸张:" prop="address">
                        <el-row>
                            <el-input v-model="yjformDataTest['yj_zzdh']" clearable placeholder="" style="width: 120px;" />
                            <el-input v-model="yjformDataTest['yj_zzmc']" clearable placeholder=""  style="width: 460px;" />
                        </el-row>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="投料（mm*mm）:" prop="address">
                        <el-input v-model="yjformDataTest['yj_tlgg']" clearable placeholder="请输入投料规格"  style="width: 140px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="开料（mm*mm）:" prop="address">
                        <el-input v-model="yjformDataTest['yj_klgg']" clearable placeholder="请输入开料规格" style="width: 140px;" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="开数:" prop="address">
                        <el-input v-model="yjformDataTest['yj_ks']" clearable placeholder="请输入开数" style="width: 140px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="联数:" prop="address">
                        <el-input v-model="yjformDataTest['yj_ls']" clearable placeholder="请输入联数"  style="width: 140px;"/>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="备注说明:" prop="remark">
                        <el-input type="textarea" v-model="yjformDataTest['yj_desc']" rows="4" clearable placeholder="请输入备注说明"  />
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-form>
              </el-scrollbar>
            </el-row>
            <template #footer>
              <div class="dialog-footer">
                <el-button @click="yjcloseDialog">取 消</el-button>
                <el-button type="primary" @click="yjenterDialog">确 定</el-button>
              </div>
            </template>
          </el-dialog>

          <!-- 工艺资料 修改弹窗 -->
          <el-dialog v-model="gydialogFormVisible" :before-close="gycloseDialog" :title="type==='create'?'添加工艺产品基本资料':'修改工艺产品基本资料'" destroy-on-close>
            <el-row>
              <el-scrollbar height="500px">
                <el-form :model="gyformDataTest" label-position="right" ref="elFormRef" :rules="rule" label-width="100px" >
                  <el-row>
                    <el-col :span="5">
                      <el-form-item label="工序方案:" prop="address">
                        <el-input v-model="gyformDataTest['方案']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="4">
                      <el-form-item label="印件编号:" prop="address">
                        <el-input v-model="gyformDataTest['Gy0_yjno']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="4">
                      <el-form-item label="工序编号:" prop="address">
                        <el-input v-model="gyformDataTest['Gy0_gxh']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="4">
                      <el-form-item label="加工开数" prop="address">
                        <el-input v-model="gyformDataTest['Gy0_Ks']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="4">
                      <el-form-item label="加工联数:" prop="address">
                        <el-input v-model="gyformDataTest['Gy0_ls']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="6">
                      <el-form-item label="车间名称:" prop="address">
                        <el-input v-model="gyformDataTest['gy0_site']" clearable placeholder="" style="width: 140px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="工艺名称:" prop="address">
                        <el-input v-model="gyformDataTest['gy0_gxmc']" clearable placeholder="" style="width: 140px;" />
                      </el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="工序名称:" prop="address">
                        <el-input v-model="gyformDataTest['add_gxmc']" clearable placeholder="" style="width: 100%;" />
                      </el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="6">
                      <el-form-item label="可用设备:" prop="address">
                        <el-input v-model="gyformDataTest['Gy0_sbbh']" clearable placeholder="" style="width: 140px;" />
                      </el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="5">
                      <el-form-item label="标准损耗:" prop="address">
                        <el-input v-model="gyformDataTest['Gy0_shdh']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="5">
                      <el-form-item label="基础损耗:" prop="address">
                        <el-input v-model="gyformDataTest['基础损耗']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="损耗率" prop="address">
                        <el-input v-model="gyformDataTest['损耗率']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="工价系数:" prop="address">
                        <el-input v-model="gyformDataTest['工价系数']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="损耗系数:" prop="address">
                        <el-input v-model="gyformDataTest['损耗系数']" clearable placeholder="" style="width: 90px;" />
                      </el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="工序备注:" prop="remark">
                        <el-input type="textarea" v-model="gyformDataTest['备注']" rows="4" clearable placeholder="请输入备注说明" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-form>
              </el-scrollbar>
            </el-row>
            <template #footer>
              <div class="dialog-footer">
                <el-button @click="gycloseDialog">取 消</el-button>
                <el-button type="primary" @click="gyenterDialog">确 定</el-button>
              </div>
            </template>
          </el-dialog>

          <!-- 印版资料 修改弹窗 -->
          <el-dialog v-model="ybdialogFormVisible" :before-close="ybcloseDialog" :title="type==='create'?'添加产品印版资料':'修改产品印版资料'" destroy-on-close>
            <el-row>
              <el-scrollbar height="500px">
                <el-form :model="ybformDataTest" label-position="right" ref="elFormRef" :rules="rule" label-width="100px" >
                  <el-row>
                    <el-col :span="8">
                      <el-form-item label="工序方案:" prop="address">
                        <el-input v-model="ybformDataTest['YB_方案']" clearable placeholder="" style="width: 100px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="8">
                      <el-form-item label="印件号:" prop="address">
                        <el-input v-model="ybformDataTest['YB_Yjno']" clearable placeholder="" style="width: 100px;" />
                      </el-form-item>
                    </el-col>
                    <el-col :span="8">
                      <el-form-item label="工序编号:" prop="address">
                        <el-input v-model="ybformDataTest['']" clearable placeholder="" style="width: 100px;" />
                      </el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="工艺名称:" prop="address">
                        <el-input v-model="ybformDataTest['gy0_site']" clearable placeholder="" style="width: 100%;" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="工序名称:" prop="address">
                        <el-input v-model="ybformDataTest['gy0_site']" clearable placeholder="" style="width: 100%;" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="10 ">
                      <el-form-item label="存货编码:" prop="address">
                        <el-input v-model="ybformDataTest['存货编码']" clearable placeholder="" style="width: 140px;" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="存货名称:" prop="address">
                        <el-input v-model="ybformDataTest['印版名称']" clearable placeholder="" style="width: 100%;" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="印版备注:" prop="address">
                        <el-input v-model="ybformDataTest['gy0_site']" clearable placeholder="" style="width: 100%;" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-form>
              </el-scrollbar>
            </el-row>
            <template #footer>
              <div class="dialog-footer">
                <el-button @click="ybcloseDialog">取 消</el-button>
                <el-button type="primary" @click="ybenterDialog">确 定</el-button>
              </div>
            </template>
          </el-dialog>

        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
//点击按钮显示下方表格
export default {
  data() {
    return {
      currentTable: '',
      activeName: 'first',
      // 其他表格数据...
    };
  },
  methods: {
    showTable(tableName) {
      // console.log(tableName)
      // 根据点击的按钮设置当前展示的表格
      this.currentTable = tableName;
    },
    showTableChange() {
      // 处理表格选中事件
    },
    // 其他方法...
  }
};
</script>

<script setup>
// 全量引入格式化工具 请按需保留
import {createCompany, deleteCompany, deleteCompanyByIds, updateCompany, findCompany, getCompanyList} from '@/api/company'
import { getDictFunc, formatDate, formatBoolean, filterDict, ReturnArrImg, onDownloadFile } from '@/utils/format'
import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, reactive } from 'vue'
import {
  getCustom,
  getDepartment,
  getProduct,
  getProductData,
  getProductGy,
  getStaffList,
  setProductStatus
} from "@/api/yunyin/yunying";
defineOptions({   name: 'Company'})

// =========== 导出Excel表格 ===========
//导出产品
const cpdialogexportToExcel = ref(false)
const cpexportToExcel = () => {
  console.log('点击了导出产品按钮')
  cpdialogexportToExcel.value = true;
}

//导出工艺
const gydialogexportToExcel = ref(false)
const gyexportToExcel = () => {
  console.log('点击了导出工艺流程按钮')
  gydialogexportToExcel.value = true;
}

// =========== 状态设置 ===========
const onstatuslist = ref(false);
const status = ref('在产'); // 默认选择在产
const _stacode = ref(null);
const onStatusClick = () => {
  console.log('点击了状态设置');
  if(_product_code.value == null){
    onstatuslist.value = false;
    alert('请选择树形后，再操作此功能');
  }else{
    _stacode.value = _product_code.value;
    onstatuslist.value = true;
  }
};
// 状态设置取消按钮
const handleCancel = () => {
  onstatuslist.value = false;
  console.log('点击了取消');
};
// 状态设置确定按钮
const handleConfirm = async () => {
  onstatuslist.value = false;
  // if(_stacode.value == null){
  //   alert('请选择树形后，再操作此功能');
  // }else{
    let statusCode;
    let code = _stacode.value;
    if (status.value === '在产') {
      statusCode = 1;
    } else if (status.value === '停产') {
      statusCode = 2;
    }
    // console.log(code);console.log(statusCode);
    const data = await setProductStatus({ code: code, status: statusCode });
    console.log(data);
  // }
};
handleCancel(_stacode);

// =========== 工艺方案更名 ===========
const gygmlist = ref(false);
const _gygmstacode = ref(null);
const gygmClick = () => {
  console.log('点击了工艺方案更名');
  // _gygmstacode.value = _product_code.value;
  // console.log(_product_code.value);
  if(_product_code.value == null){
    gygmlist.value = false;
    alert('请选择分类项目，然后在进入操作');
  }else{
    gygmlist.value = true;
    let code = _product_code.value;
    console.log(code);
  }
};
// 状态设置取消按钮
const gygmhandleCancel = () => {
  gygmlist.value = false;
  console.log('点击了取消');
};
// 状态设置确定按钮
const gygmhandleConfirm = async () => {
  gygmlist.value = false;


};
gygmhandleCancel(_gygmstacode);

// =========== 左侧树侧形结构 ===========
const treeData = ref({})
const getCustomdata = async () => {
  try {
    const data  = await getCustom()
    treeData.value = data.data;
  } catch (error) {
    console.error('Error fetching custom data:', error);
  }
}
getCustomdata()

//点击左侧树形获取列表
const tableData = reactive([])
const _custom_code = ref(null)
const handleNodeClick = async (node) => {
  _custom_code.value = node.客户编号;
  _getProduct()
};
//印件资料
const yjtableData = reactive([])
//工艺资料
const gytableData = reactive([])
//印版资料
const ybtableData = reactive([])
//技术资料附件
const jstableData = reactive([])
const _product_code = ref(null)
const tableRowClick = async (row) => {
  const product_code = row.产品编号;
  _product_code.value = row.产品编号;
  const res = await getProductData({product_code:product_code});//接口
  yjtableData.splice(0, yjtableData.length, ...res.data.yjData);//印件资料表格
  gytableData.splice(0, gytableData.length, ...res.data.gyData);//工艺资料表格
  ybtableData.splice(0, ybtableData.length, ...res.data.ybData);//印版资料表格
};

//封装的方法
const _getProduct = async ()=>{
  let params = {}
  params.custom_code = _custom_code.value;
  params.limit = pageSize.value;
  params.page = page.value;
  try {
    const WorkListdata = await getProduct(params);
    tableData.splice(0, tableData.length, ...WorkListdata.data.data);//表格
    total.value = tableData.length;//共多少条
  } catch (error) {
    console.error(error);
  }
}


// ========分页==============
const handleCurrentChange = (val) => {
  page.value = val;
  _getProduct();
};

// 修改页面容量 点击多少条/页
const handleSizeChange = (val) => {
  page.value = 10;//默认显示十条
  pageSize.value = val;
  _getProduct();
};
const page = ref(1)
const total = ref(0)
const pageSize = ref(10)


const elFormRef = ref()
const elSearchFormRef = ref()
const searchInfo = ref({})
// 搜索
const onSubmit = () => {

}

// 查询
const getTableData = async() => {

}
getTableData()

// 重置
const onReset = () => {
  searchInfo.value = {}
  getTableData()
}

// 自动化生成的字典（可能为空）以及字段
const formData = ref({
  address: '',
  image: '',
  name: '',
})

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

const searchRule = reactive({
  createdAt: [
    { validator: (rule, value, callback) => {
        if (searchInfo.value.startCreatedAt && !searchInfo.value.endCreatedAt) {
          callback(new Error('请填写结束日期'))
        } else if (!searchInfo.value.startCreatedAt && searchInfo.value.endCreatedAt) {
          callback(new Error('请填写开始日期'))
        } else if (searchInfo.value.startCreatedAt && searchInfo.value.endCreatedAt && (searchInfo.value.startCreatedAt.getTime() === searchInfo.value.endCreatedAt.getTime() || searchInfo.value.startCreatedAt.getTime() > searchInfo.value.endCreatedAt.getTime())) {
          callback(new Error('开始日期应当早于结束日期'))
        } else {
          callback()
        }
      }, trigger: 'change' }
  ],
})

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

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

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

//=========表格列表修改========
let formDataTest = reactive({})
//修改
const updateCompanyFunc = async (row) => {
  formDataTest = row;
  console.log(row);
  dialogFormVisible.value = true;
};
// 弹窗
const dialogFormVisible = ref(false)
// 打开弹窗
const openDialog = () => {
  type.value = 'create'
  dialogFormVisible.value = true
}

// 关闭弹窗
const closeDialog = () => {
  dialogFormVisible.value = false
  formData.value = {
    address: '',
    image: '',
    name: '',
  }
}

//=========印件修改========
let yjformDataTest = reactive({})
//修改
const yjupdateCompanyFunc = async (row) => {
  yjformDataTest = row;
  console.log(row);
  yjdialogFormVisible.value = true;
};
// 弹窗
const yjdialogFormVisible = ref(false)
// 打开弹窗
const yjopenDialog = () => {
  type.value = 'create'
  yjdialogFormVisible.value = true
}
// 关闭弹窗
const yjcloseDialog = () => {
  yjdialogFormVisible.value = false
  formData.value = {
    address: '',
    image: '',
    name: '',
  }
}
//=========工艺修改========
let gyformDataTest = reactive({})
//修改
const gyupdateCompanyFunc = async (row) => {
  // const product_code = row.产品编号;
  const product_code = _product_code.value;
  console.log(product_code);
  const res = await getProductGy({product_code:product_code});//接口
  console.log(res);
  gyformDataTest = row;
  // console.log(row);
  gydialogFormVisible.value = true;
};
// 弹窗
const gydialogFormVisible = ref(false)
// 打开弹窗
const gyopenDialog = () => {
  type.value = 'create'
  gydialogFormVisible.value = true
}
// 关闭弹窗
const gycloseDialog = () => {
  gydialogFormVisible.value = false
  formData.value = {
    address: '',
    image: '',
    name: '',
  }
}
//=========印版修改========
let ybformDataTest = reactive({})
//修改
const ybupdateCompanyFunc = async (row) => {
  // const product_code = row.产品编号;
  const product_code = _product_code.value;
  console.log(row);
  // const res = await getProductGy({product_code:product_code});//接口
  // console.log(res);
  ybformDataTest = row;
  // console.log(row);
  ybdialogFormVisible.value = true;
};
// 弹窗
const ybdialogFormVisible = ref(false)
// 打开弹窗
const ybopenDialog = () => {
  type.value = 'create'
  ybdialogFormVisible.value = true
}
// 关闭弹窗
const ybcloseDialog = () => {
  ybdialogFormVisible.value = false
  formData.value = {
    address: '',
    image: '',
    name: '',
  }
}

// 弹窗确定
const enterDialog = async () => {
  elFormRef.value?.validate( async (valid) => {
    if (!valid) return
    let res
    switch (type.value) {
      case 'create':
        res = await createCompany(formData.value)
        break
      case 'update':
        res = await updateCompany(formData.value)
        break
      default:
        res = await createCompany(formData.value)
        break
    }
    if (res.code === 0) {
      ElMessage({
        type: 'success',
        message: '创建/更改成功'
      })
      closeDialog()
      getTableData()
    }
  })
}
</script>
<style>
.JKWTree-container {
  display: flex;
}
.JKWTree-tree {
  width: 300px;
  background-color: #fff;
  padding: 10px;
  margin-right: 20px;
}
.JKWTree-tree h3 {
  font-size: 15px;
  font-weight: 700;
  margin: 10px 0;
}
.JKWTree-content {
  flex: 1;
}
.el-table .warning-row {
  background: oldlace;
}
/* 选中某行时的背景色*/
.el-table__body tr.current-row>td {
  background: #ff80ff !important;
}
</style>
