Merge branch 'master' of http://10.153.19.25:10105/r/ERP_override

廖井涛

91 分钟以前 f7a2fcdda7f1120498c5c5f75c5a99955fc54b43

 north-glass-erp/northglass-erp/src/views/pp/glassOptimize/OptimizeParms.vue

New file
@@ -0,0 +1,870 @@
<script setup>

import { ref, reactive, onMounted, watch } from 'vue';

import { useI18n } from "vue-i18n";

import { ElMessage } from "element-plus";

import request from "@/utils/request";

import useUserInfoStore from "@/stores/userInfo";



const { t } = useI18n();

const userStore = useUserInfoStore()

const username = userStore.user.userName



const currentComponent = ref('optimization');



const settings = reactive({

  optimization: {},

  display: {},

  cutting: {},

  server: {},

  tempering: {}

});



const selectComponent = (component) => {

  currentComponent.value = component;

};



const saveToDatabase = () => {

  if (settings.server.haveOptimaMark === '1' && settings.server.haveQMark === '1') {

    ElMessage.warning('是否生成OPTIMA打标信息和是否生成速刻打标信息不能同时为是');

    return;

  }

  if (settings.server.printLayouts === '0' && settings.server.printReport === '0') {

    ElMessage.warning('版图和报告不能同时不打印，请至少选择一项');

    return;

  }

  console.log(settings)

  request.post(`/glassOptimize/optimizeParms/${username}`, settings).then((res) => {

    if (res.code == 200 && res.data === true) {

      ElMessage.success(t('basicData.msg.saveSuccess'))

    } else {

      ElMessage.warning(res.msg)

    }

  });

};



// 修改 fetchSettings 方法

const fetchSettings = async (username) => {

  try {

    const response = await request.post(`/glassOptimize/selectOptimizeParms/${username}`);

    let parsedData = {};



    if (response.code == 200 && response.data) {

      try {

        parsedData = JSON.parse(response.data);

      } catch (parseError) {

        console.error('解析响应数据失败:', parseError);

        parsedData = {};

      }

    } else {

      console.log('未获取到设置数据或响应失败，使用默认设置');

      parsedData = {};

    }



    // 确保所有模块都存在

    if (!parsedData.optimization) parsedData.optimization = {};

    if (!parsedData.display) parsedData.display = {};

    if (!parsedData.cutting) parsedData.cutting = {};

    if (!parsedData.server) parsedData.server = {};

    if (!parsedData.tempering) parsedData.tempering = {};





    parsedData.optimization.yShapeJoinOptimization = parsedData.optimization.yShapeJoinOptimization !== undefined ? parsedData.optimization.yShapeJoinOptimization : true;

    parsedData.optimization.smallPieceRotationProhibited = parsedData.optimization.smallPieceRotationProhibited !== undefined ? parsedData.optimization.smallPieceRotationProhibited : true;

    // parsedData.optimization.maxFramesOnSite = parsedData.optimization.maxFramesOnSite !== undefined ? parsedData.optimization.maxFramesOnSite : 10;

    parsedData.optimization.bendEdgeDistance = parsedData.optimization.bendEdgeDistance !== undefined ? parsedData.optimization.bendEdgeDistance : 10;

    // parsedData.optimization.positiveTolerance = parsedData.optimization.positiveTolerance !== undefined ? parsedData.optimization.positiveTolerance : 0;

    // parsedData.optimization.negativeTolerance = parsedData.optimization.negativeTolerance !== undefined ? parsedData.optimization.negativeTolerance : 0;

    parsedData.optimization.cutterOriginPosition = parsedData.optimization.cutterOriginPosition !== undefined ? parsedData.optimization.cutterOriginPosition : 1;

    // parsedData.optimization.uniformShapeEdgeTrimAmount = parsedData.optimization.uniformShapeEdgeTrimAmount !== undefined ? parsedData.optimization.uniformShapeEdgeTrimAmount : 0;

    parsedData.optimization.optimizationMethod = parsedData.optimization.optimizationMethod !== undefined ? parsedData.optimization.optimizationMethod : '1';

    parsedData.optimization.travType = parsedData.optimization.travType !== undefined ? parsedData.optimization.travType : 'X';

    parsedData.optimization.rackCycleQty = parsedData.optimization.rackCycleQty !== undefined ? parsedData.optimization.rackCycleQty :5;





    // 为 display 参数添加默认值

    parsedData.display.themeColor = parsedData.display.themeColor !== undefined ? parsedData.display.themeColor : '#5168c8';

    parsedData.display.includeProductEdge = parsedData.display.includeProductEdge !== undefined ? parsedData.display.includeProductEdge : true;

    parsedData.display.includeIrregularEdge = parsedData.display.includeIrregularEdge !== undefined ? parsedData.display.includeIrregularEdge : true;

    // parsedData.display.mergeByFrameNumber = parsedData.display.mergeByFrameNumber !== undefined ? parsedData.display.mergeByFrameNumber : true;

    parsedData.display.frameNumber = parsedData.display.frameNumber !== undefined ? parsedData.display.frameNumber : true;

    parsedData.display.orderNumber = parsedData.display.orderNumber !== undefined ? parsedData.display.orderNumber : true;

    parsedData.display.productName = parsedData.display.productName !== undefined ? parsedData.display.productName : true;

    parsedData.display.processingInfo = parsedData.display.processingInfo !== undefined ? parsedData.display.processingInfo : true;

    parsedData.display.remarks = parsedData.display.remarks !== undefined ? parsedData.display.remarks : true;

    parsedData.display.floorNumber = parsedData.display.floorNumber !== undefined ? parsedData.display.floorNumber : true;

    parsedData.display.edgeLength = parsedData.display.edgeLength !== undefined ? parsedData.display.edgeLength : false;

    parsedData.display.manufacturingProcess = parsedData.display.manufacturingProcess !== undefined ? parsedData.display.manufacturingProcess : false;

    parsedData.display.identifier = parsedData.display.identifier !== undefined ? parsedData.display.identifier : false;



    // 为 cutting 参数添加默认值

    parsedData.cutting.cutting_direction = parsedData.cutting.cutting_direction !== undefined ? parsedData.cutting.cutting_direction : true;

    parsedData.cutting.show_cutting_path = parsedData.cutting.show_cutting_path !== undefined ? parsedData.cutting.show_cutting_path : true;

    parsedData.cutting.force_continuous_cutting = parsedData.cutting.force_continuous_cutting !== undefined ? parsedData.cutting.force_continuous_cutting : true;

    // parsedData.cutting.min_radius = parsedData.cutting.min_radius !== undefined ? parsedData.cutting.min_radius : 0;

    // parsedData.cutting.min_parallel_offset = parsedData.cutting.min_parallel_offset !== undefined ? parsedData.cutting.min_parallel_offset : 0;

    // parsedData.cutting.t_shaped_recess = parsedData.cutting.t_shaped_recess !== undefined ? parsedData.cutting.t_shaped_recess : 0;

    // parsedData.cutting.down_cut_spacing = parsedData.cutting.down_cut_spacing !== undefined ? parsedData.cutting.down_cut_spacing : 0;

    // parsedData.cutting.lift_retract = parsedData.cutting.lift_retract !== undefined ? parsedData.cutting.lift_retract : 0;



    // 为 server 参数添加默认值

    parsedData.server.printLayouts = parsedData.server.printLayouts !== undefined ? parsedData.server.printLayouts : '1';

    parsedData.server.printReport = parsedData.server.printReport !== undefined ? parsedData.server.printReport : '1';

    parsedData.server.layoutRows = parsedData.server.layoutRows !== undefined ? parsedData.server.layoutRows : '2';

    parsedData.server.layoutColumns = parsedData.server.layoutColumns !== undefined ? parsedData.server.layoutColumns : '2';

    parsedData.server.glassInfoShow = parsedData.server.glassInfoShow !== undefined ? parsedData.server.glassInfoShow : '2';

    parsedData.server.cutInfoShow = parsedData.server.cutInfoShow !== undefined ? parsedData.server.cutInfoShow : '1';

    parsedData.server.fileMode = parsedData.server.fileMode !== undefined ? parsedData.server.fileMode : '1';

    parsedData.server.haveMark = parsedData.server.haveMark !== undefined ? parsedData.server.haveMark : '1';

    parsedData.server.haveOptimaMark = parsedData.server.haveOptimaMark !== undefined ? parsedData.server.haveOptimaMark : '1';

    parsedData.server.haveQMark = parsedData.server.haveQMark !== undefined ? parsedData.server.haveQMark : '1';

    parsedData.server.glassIdMode = parsedData.server.glassIdMode !== undefined ? parsedData.server.glassIdMode : '1';

    parsedData.server.optimaMarkPosition = parsedData.server.optimaMarkPosition !== undefined ? parsedData.server.optimaMarkPosition : '1';

    parsedData.server.optimaMarkName = parsedData.server.optimaMarkName !== undefined ? parsedData.server.optimaMarkName : 'erweima_8mm';

    parsedData.server.optimaMarkWidth = parsedData.server.optimaMarkWidth !== undefined ? parsedData.server.optimaMarkWidth : 8;

    parsedData.server.optimaMarkHeight = parsedData.server.optimaMarkHeight !== undefined ? parsedData.server.optimaMarkHeight : 8;

    parsedData.server.output_format = parsedData.server.output_format !== undefined ? parsedData.server.output_format : '';

    parsedData.server.open_folder_after_save = parsedData.server.open_folder_after_save !== undefined ? parsedData.server.open_folder_after_save : '';

    parsedData.server.g_code_file_format = parsedData.server.g_code_file_format !== undefined ? parsedData.server.g_code_file_format : '';

    parsedData.server.btl_file_save_path = parsedData.server.btl_file_save_path !== undefined ? parsedData.server.btl_file_save_path : '';

    parsedData.server.optima_file_save_path = parsedData.server.optima_file_save_path !== undefined ? parsedData.server.optima_file_save_path : '';

    parsedData.server.optimization_depth_limit_enable = parsedData.server.optimization_depth_limit_enable !== undefined ? parsedData.server.optimization_depth_limit_enable : '';



    // 为 tempering 参数添加默认值

    parsedData.tempering.furnaceLength = parsedData.tempering.furnaceLength !== undefined ? parsedData.tempering.furnaceLength : 5000;

    parsedData.tempering.furnaceWidth = parsedData.tempering.furnaceWidth !== undefined ? parsedData.tempering.furnaceWidth : 2800;

    parsedData.tempering.maxLoadingRate = parsedData.tempering.maxLoadingRate !== undefined ? parsedData.tempering.maxLoadingRate : 50;

    parsedData.tempering.chaosLevel = parsedData.tempering.chaosLevel !== undefined ? parsedData.tempering.chaosLevel : 0;

    parsedData.tempering.temperingTime = parsedData.tempering.temperingTime !== undefined ? parsedData.tempering.temperingTime : 160;

    parsedData.tempering.defaultTemperingMode = parsedData.tempering.defaultTemperingMode !== undefined ? parsedData.tempering.defaultTemperingMode : 'auto';

    parsedData.tempering.maxArea = parsedData.tempering.maxArea !== undefined ? parsedData.tempering.maxArea : 0;

    parsedData.tempering.maxPieceCount = parsedData.tempering.maxPieceCount !== undefined ? parsedData.tempering.maxPieceCount : 10;

    parsedData.tempering.xAxisInterval = parsedData.tempering.xAxisInterval !== undefined ? parsedData.tempering.xAxisInterval : 80;

    parsedData.tempering.yAxisInterval = parsedData.tempering.yAxisInterval !== undefined ? parsedData.tempering.yAxisInterval : 80;



    Object.assign(settings, parsedData);

    console.log('设置已更新:', settings);



    // 为 optimization 参数设置默认值

    initializeOptimizationDefaults();

  } catch (error) {

    console.error('请求发生错误:', error);

    // 出现错误时也设置默认值

    setDefaultSettings();

  }

};



onMounted(() => {

  fetchSettings(username);

});



// 参数映射表，用于将英文参数名映射为中文名称和类型

const paramMapping = {

  optimizationMethod: { name: '优化方式', type: 'select' },

  smallPieceRotationProhibited: { name: '小片允许旋转', type: 'checkbox' },

  cutterOriginPosition: { name: '切割机原点位置', type: 'select' },

  travType: { name: '横切', type: 'select' },

  uniformShapeEdgeTrimAmount: { name: '统一设置异形修边量', type: 'text' },

  yShapeJoinOptimization: { name: '异形拼接优化', type: 'checkbox' },

  optimizationIterations: { name: '重复优化次数', type: 'text' },

  maxFramesOnSite: { name: '现场最大可放架子数量', type: 'text' },

  rackCycleQty: { name: '循环落架数', type: 'text' },

  bendEdgeDistance: { name: '掰边距(mm)', type: 'text' },

  positiveTolerance: { name: '正公差(mm)', type: 'text' },

  negativeTolerance: { name: '负公差(mm)', type: 'text' },

};



// 动态生成参数列表

const parameterList = ref(Object.keys(paramMapping).map(key => ({

  key,

  ...paramMapping[key]

})));

</script>



<template>

  <div class="settings-container">

    <div class="sidebar">

      <div

        @click="selectComponent('optimization')"

        :class="{ active: currentComponent === 'optimization' }"

        class="sidebar-item"

      >

        <div class="sidebar-header">优化参数</div>

        <div class="sidebar-content">优化参数设置</div>

      </div>



      <div

        @click="selectComponent('display')"

        :class="{ active: currentComponent === 'display' }"

        class="sidebar-item"

      >

        <div class="sidebar-header">版图显示</div>

        <div class="sidebar-content">版图显示设置</div>

      </div>



      <div

        @click="selectComponent('cutting')"

        :class="{ active: currentComponent === 'cutting' }"

        class="sidebar-item"

      >

        <div class="sidebar-header">刀路</div>

        <div class="sidebar-content">刀路设置</div>

      </div>



      <div

        @click="selectComponent('server')"

        :class="{ active: currentComponent === 'server' }"

        class="sidebar-item"

      >

        <div class="sidebar-header">输出</div>

        <div class="sidebar-content">结果输出设置</div>

      </div>

      <div

          @click="selectComponent('mark')"

          :class="{ active: currentComponent === 'mark' }"

          class="sidebar-item"

      >

        <div class="sidebar-header">打标</div>

        <div class="sidebar-content">打标设置</div>

      </div>



      <div

        @click="selectComponent('tempering')"

        :class="{ active: currentComponent === 'tempering' }"

        class="sidebar-item"

      >

        <div class="sidebar-header">钢化</div>

        <div class="sidebar-content">钢化设置</div>

      </div>

      <div

          @click="selectComponent('print')"

          :class="{ active: currentComponent === 'print' }"

          class="sidebar-item"

      >

        <div class="sidebar-header">打印</div>

        <div class="sidebar-content">打印设置</div>

      </div>

    </div>



    <div class="main-content">

      <template v-if="currentComponent === 'display'">

        <div class="display-settings">

          <h2>版图显示设置</h2>

          <div class="form-group">

            <label>版图显示颜色设置</label>

            <input type="color" v-model="settings.display.themeColor" />

          </div>

          <div class="form-group">

            <label>成品尺寸包含磨边量</label>

            <input type="checkbox" v-model="settings.display.includeProductEdge" />

          </div>

          <div class="form-group">

            <label>异形尺寸包含磨边量</label>

            <input type="checkbox" v-model="settings.display.includeIrregularEdge" />

          </div>

          <div style="border: 1px solid #d2d0d0; margin-top: 20px;">

            <div style="background-color: #D5EAFF;">小片信息</div>

            <div class="form-group">

              <label>架号</label>

              <input type="checkbox" v-model="settings.display.frameNumber" />

            </div>

            <div class="form-group">

              <label>订单编号</label>

              <input type="checkbox" v-model="settings.display.orderNumber" />

            </div>

            <div class="form-group">

              <label>产品名称</label>

              <input type="checkbox" v-model="settings.display.productName" />

            </div>

            <div class="form-group">

              <label>加工信息</label>

              <input type="checkbox" v-model="settings.display.processingInfo" />

            </div>

            <div class="form-group">

              <label>备注</label>

              <input type="checkbox" v-model="settings.display.remarks" />

            </div>

            <div class="form-group">

              <label>楼层编号</label>

              <input type="checkbox" v-model="settings.display.floorNumber" />

            </div>

            <div class="form-group">

              <label>边长</label>

              <input type="checkbox" v-model="settings.display.edgeLength" />

            </div>

            <div class="form-group">

              <label>工艺</label>

              <input type="checkbox" v-model="settings.display.manufacturingProcess" />

            </div>

            <div class="form-group">

              <label>ID</label>

              <input type="checkbox" v-model="settings.display.identifier" />

            </div>

          </div>

        </div>

      </template>



      <template v-else-if="currentComponent === 'cutting'">

        <div class="display-settings">

          <h2>刀路设置</h2>

          <div class="form-group">

            <label>正向切割</label>

            <input type="checkbox" v-model="settings.cutting.cutting_direction" />

          </div>

          <div class="form-group">

            <label>显示切割方向</label>

            <input type="checkbox" v-model="settings.cutting.show_cutting_path" />

          </div>

          <div class="form-group">

            <label>强制弧线和直线连续切割</label>

            <input type="checkbox" v-model="settings.cutting.force_continuous_cutting" />

          </div>

          <div class="form-group">

            <label>孔洞最小切割半径</label>

            <input type="number" v-model="settings.cutting.min_radius" />

          </div>

          <div class="form-group">

            <label>两条平行线最小间隔</label>

            <input type="number" v-model="settings.cutting.min_parallel_offset" />

          </div>

          <div class="form-group">

            <label>T型退缩</label>

            <input type="number" v-model="settings.cutting.t_shaped_recess" />

          </div>

          <div class="form-group">

            <label>下刀间距</label>

            <input type="number" v-model="settings.cutting.down_cut_spacing" />

          </div>

          <div class="form-group">

            <label>抬刀退缩</label>

            <input type="number" v-model="settings.cutting.lift_retract" />

          </div>

        </div>

      </template>

      <template v-else-if="currentComponent === 'print'">

        <div class="display-settings">

          <h2>打印设置</h2>

          <div class="form-group">

            <label>是否打印版图</label>

            <div style="margin-left: 3px;"></div>

            <div class="radio-group">

              <input

                  type="radio"

                  id="printLayouts"

                  value="1"

                  v-model="settings.server.printLayouts"

              />

              <label for="printLayouts">是</label>



              <input

                  type="radio"

                  id="noPrintLayouts"

                  value="0"

                  v-model="settings.server.printLayouts"

                  style="margin-left: 20px;"

              />

              <label for="noPrintLayouts">否</label>

            </div>

          </div>

          <div class="form-group">

            <label>是否打印报告</label>

            <div style="margin-left: 3px;"></div>

            <div class="radio-group">

              <input

                  type="radio"

                  id="printReport"

                  value="1"

                  v-model="settings.server.printReport"

              />

              <label for="printReport">是</label>

              <input

                  type="radio"

                  id="noPrintReport"

                  value="0"

                  v-model="settings.server.printReport"

                  style="margin-left: 20px;"

              />

              <label for="noPrintReport">否</label>

            </div>

          </div>

          <div class="form-group">

            <label>布局选择</label>

            <select v-model="settings.server.layoutRows" class="cs" style="width: 10px; margin-right: 5px;">

              <option value="1">一行</option>

              <option value="2">两行</option>

              <option value="3">三行</option>

              <option value="4">四行</option>

            </select>

            <select v-model="settings.server.layoutColumns" class="cs" style="width: 10px;">

              <option value="1">一列</option>

              <option value="2">两列</option>

            </select>

          </div>

          <div class="form-group">

            <label>小片信息</label>

            <select v-model="settings.server.glassInfoShow" class="cs" style="width: 10px; margin-right: 10px;">

              <option value="0">不显示</option>

              <option value="1">显示在右侧</option>

              <option value="2">显示在下侧</option>

            </select>

          </div>

          <div class="form-group">

            <label>切割信息</label>

            <select v-model="settings.server.cutInfoShow" class="cs" style="width: 10px; margin-right: 10px;">

              <option value="0">不显示</option>

              <option value="1">显示</option>

            </select>

          </div>

        </div>

      </template>



      <template v-else-if="currentComponent === 'server'">

        <div class="display-settings">

          <h2>结果输出设置</h2>

          <div class="form-group">

            <label>切割文件保存模式</label>

            <div style="margin-left: 3px;"></div>

            <div class="radio-group">

              <input

                  type="radio"

                  id="singleFile"

                  value="1"

                  v-model="settings.server.fileMode"

              />

              <label for="singleFile">单文件</label>



              <input

                  type="radio"

                  id="multiFile"

                  value="2"

                  v-model="settings.server.fileMode"

                  style="margin-left: 20px;"

              />

              <label for="multiFile">多文件</label>

            </div>

          </div>



          <div class="form-group">

            <label>工程文件保存路径</label>

            <input type="text" v-model="settings.server.output_format" />

          </div>

<!--          <div class="form-group">-->

<!--            <label>切割代码保存路径</label>-->

<!--            <input type="text" v-model="settings.server.cutting_code_save_path" />-->

<!--          </div>-->

          <div class="form-group">

            <label>保存文件后打开所在文件夹</label>

            <input type="text" v-model="settings.server.open_folder_after_save" />

          </div>

          <div class="form-group">

            <label>G代码文件格式</label>

            <input type="text" v-model="settings.server.g_code_file_format" />

          </div>

<!--          <div class="form-group">-->

<!--            <label>TRF文件保存路径</label>-->

<!--            <input type="text" v-model="settings.server.trf_file_save_path" />-->

<!--          </div>-->

          <div class="form-group">

            <label>保特罗文件保存路径</label>

            <input type="text" v-model="settings.server.btl_file_save_path" />

          </div>

          <div class="form-group">

            <label>OPTIMA文件保存路径</label>

            <input type="text" v-model="settings.server.optima_file_save_path" />

          </div>

          <div class="form-group">

            <label>优化深度限制启用</label>

            <input type="text" v-model="settings.server.optimization_depth_limit_enable" />

          </div>

<!--          <div class="form-group">-->

<!--            <label>原片切材率计算</label>-->

<!--            <input type="text" v-model="settings.server.original_sheet_material_calculation" />-->

<!--          </div>-->

        </div>

      </template>



      <template v-else-if="currentComponent === 'mark'">

        <div class="display-settings">

          <h2>打标设置</h2>

          <div style=" margin-top: 10px;padding: 4px; border-radius: 8px;">

            <div class="form-group">

              <label>是否打标</label>

              <div style="margin-left: 3px;"></div>

              <div class="radio-group">

                <input

                    type="radio"

                    id="singleFile"

                    value="1"

                    v-model="settings.server.haveMark"

                />

                <label for="singleFile">是</label>



                <input

                    type="radio"

                    id="multiFile"

                    value="0"

                    v-model="settings.server.haveMark"

                    style="margin-left: 20px;"

                />

                <label for="multiFile">否</label>

              </div>

            </div>

            <div class="form-group">

              <label>是否生成OPTIMA打标信息</label>

              <div style="margin-left: 3px;"></div>

              <div class="radio-group">

                <input

                    type="radio"

                    id="singleFile"

                    value="1"

                    v-model="settings.server.haveOptimaMark"

                />

                <label for="singleFile">是</label>



                <input

                    type="radio"

                    id="multiFile"

                    value="0"

                    v-model="settings.server.haveOptimaMark"

                    style="margin-left: 20px;"

                />

                <label for="multiFile">否</label>

              </div>

            </div>

            <div class="form-group">

              <label>是否生成速刻打标信息</label>

              <div style="margin-left: 28px;"></div>

              <div class="radio-group">

                <input

                    type="radio"

                    id="singleFile"

                    value="1"

                    v-model="settings.server.haveQMark"

                />

                <label for="singleFile">是</label>



                <input

                    type="radio"

                    id="multiFile"

                    value="0"

                    v-model="settings.server.haveQMark"

                    style="margin-left: 20px;"

                />

                <label for="multiFile">否</label>

              </div>

            </div>

            <div class="form-group">

              <label>玻璃ID模式</label>

              <div style="margin-left: 28px;"></div>

              <div class="radio-group">

                <input

                    type="radio"

                    id="singleFile"

                    value="1"

                    v-model="settings.server.glassIdMode"

                />

                <label for="singleFile">固定长度</label>



                <input

                    type="radio"

                    id="multiFile"

                    value="2"

                    v-model="settings.server.glassIdMode"

                    style="margin-left: 20px;"

                />

                <label for="multiFile">自动长度</label>

              </div>

            </div>

            <div class="form-group">

              <label>默认二维码位置</label>

              <div style="margin-left: 28px;"></div>

              <div class="radio-group">

                <input

                    type="radio"

                    id="singleFile"

                    value="1"

                    v-model="settings.server.optimaMarkPosition"

                />

                <label for="singleFile">长边对角</label>



                <input

                    type="radio"

                    id="multiFile"

                    value="2"

                    v-model="settings.server.optimaMarkPosition"

                    style="margin-left: 20px;"

                />

                <label for="multiFile">长边同边</label>

              </div>

            </div>

            <div class="form-group">

              <label>二维码文件名称(.ez3)</label>

              <input type="text" v-model="settings.server.optimaMarkName" />

            </div>

            <div class="form-group">

              <label>宽(mm)</label>

              <input type="text" v-model="settings.server.optimaMarkWidth" />

            </div>

            <div class="form-group">

              <label>高(mm)</label>

              <input type="text" v-model="settings.server.optimaMarkHeight" />

            </div>

          </div>

        </div>

      </template>



      <template v-else-if="currentComponent === 'tempering'">

        <div class="display-settings">

          <h2>钢化设置</h2>

          <div class="form-group">

            <label>炉长(mm)</label>

            <input type="number" v-model="settings.tempering.furnaceLength" step="1" />

          </div>

          <div class="form-group">

            <label>炉宽(mm)</label>

            <input type="number" v-model="settings.tempering.furnaceWidth" step="1" />

          </div>

          <div class="form-group">

            <label>钢化最大装载率(%)</label>

            <input type="number" v-model="settings.tempering.maxLoadingRate" step="1" />

          </div>

          <div class="form-group">

            <label>工程混排等级(%)</label>

            <input type="number" v-model="settings.tempering.chaosLevel" step="1" />

          </div>

          <div class="form-group">

            <label>钢化加热时间(秒)</label>

            <input type="number" v-model="settings.tempering.temperingTime" step="1" />

          </div>

          <div class="form-group">

            <label>默认钢化推荐模式</label>

            <select v-model="settings.tempering.defaultTemperingMode">

              <option value="auto">自动推荐</option>

              <option value="manual">手动选择</option>

            </select>

          </div>

          <div class="form-group">

            <label>最大面积设置(㎡)</label>

            <input type="number" v-model="settings.tempering.maxArea" step="0.1" />

          </div>

          <div class="form-group">

            <label>最大片数设置(片)</label>

            <input type="number" v-model="settings.tempering.maxPieceCount" step="1" />

          </div>

          <div class="form-group">

            <label>长轴默认间隔(mm)</label>

            <input type="number" v-model="settings.tempering.xAxisInterval" step="1" />

          </div>

          <div class="form-group">

            <label>宽轴默认间隔(mm)</label>

            <input type="number" v-model="settings.tempering.yAxisInterval" step="1" />

          </div>

        </div>

      </template>



      <template v-else>

        <div class="display-settings">

          <h2>优化参数设置</h2>

          <div class="parameter-list">

            <div 
              class="form-group" 
              v-for="(param, index) in parameterList" 
              :key="index"

            >

              <label class="parameter-name">{{ param.name }}</label>

              <div class="parameter-control">

                <input 
                  v-if="param.type === 'checkbox'" 
                  type="checkbox" 
                  :checked="settings.optimization[param.key] === true"

                  @click="() => { settings.optimization[param.key] = settings.optimization[param.key]!==true }"

                >

                <select 
                  v-else-if="param.type === 'select'" 
                  :name="param.key" 
                  class="cs"

                  v-model="settings.optimization[param.key]"

                >

                  <option 
                    v-for="option in getOptions(param.key)" 
                    :key="option.value"

                    :value="option.value"

                    :selected="option.value === settings.optimization[param.key]"

                  >

                    {{ option.label }}

                  </option>

                </select>

                <input 
                  v-else 
                  :type="param.type || 'text'" 
                  :name="param.key" 
                  class="cs" 
                  v-model="settings.optimization[param.key]"

                >

              </div>

            </div>

          </div>

        </div>

      </template>





    </div>



    <button class="button" style="height: 40px;" @click="saveToDatabase">保存</button>

  </div>

</template>



<style>

.settings-container {

  display: flex;

  gap: 20px;

  padding: 20px;

  background-color: #f0f2f5;

}



.sidebar {

  width: 300px;

  background-color: white;

  padding: 15px;

  border-radius: 8px;

  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

}



.sidebar-item {

  cursor: pointer;

  padding: 10px;

  margin-bottom: 5px;

  border-radius: 6px;

  transition: all 0.3s ease;

}



.sidebar-item.active {

  background-color: #f8f9fa;

  transform: translateX(5px);

}



.sidebar-header {

  font-size: 12px;

  color: #666;

  margin-bottom: 5px;

}



.sidebar-content {

  font-size: 14px;

  color:#333;

}



.main-content {

  flex-grow: 1;

  padding: 20px;

}



button {

  padding: 10px 20px;

  background-color: #5cadfe;

  color: white;

  border: none;

  border-radius: 4px;

  cursor: pointer;

  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

}



@media (max-width: 768px) {

  .settings-container {

    flex-direction: column;

  }



  .sidebar {

    order: -1;

  }



  .main-content {

    margin-top: 20px;

  }

}



.form-group {

  margin-bottom: 15px;

  display: flex;

  align-items: center;

  gap: 10px;

}



.form-group label {

  font-weight: normal;

  min-width: 120px;

}



.form-group input,

.form-group select {

  flex: 1;

  padding: 5px;

  border: 1px solid #ddd;

  border-radius: 4px;

}



.form-group select {

  cursor: pointer;

}



.display-settings {

  background-color: white;

  padding: 20px;

  border-radius: 8px;

  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

}



.parameter-list {

  display: flex;

  flex-direction: column;

  gap: 0px;

}



.parameter-item {

  display: flex;

  align-items: center;

  gap: 0px;

}



.parameter-name {

  font-weight: normal;

  min-width: 120px;

}



.parameter-control {

  flex: 1;

}



.button {

  text-align: center;

  width: 70px;

  height: 28px;

  border: none;

  background-color: #5CADFE;

  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0), 0 6px 5px 0 rgba(0, 0, 0, 0.19);

  margin-left: 500px;

}

</style>



<script>

// 辅助函数，根据参数键获取选项

function getOptions(key) {

  const optionsMapping = {

    cutterOriginPosition: [

      { value: 2, label: '左上角' },

      { value: 1, label: '左下角' },

      { value: 4, label: '右上角' },

      { value: 3, label: '右下角' }

    ],

    optimizationMethod: [

      { value: 1, label: 'optima' },

      { value: 2, label: '北玻' }

    ],

    travType: [

      { value: 'X', label: 'X' },

      { value: 'Y', label: 'Y' },

      { value: 'XY', label: 'XY' }

    ]

  };

  return optionsMapping[key] || [];

}

</script>