合并

src/views/etl/compile copy.vue

@@ -0,0 +1,521 @@
+<template>
+  <div class="global-variable">
+    <div class="parcel">
+      <div class="controlling">
+        <div class="hade">
+          <p>
+            执行器组名称：<el-input v-model="zxqName" size="small"></el-input>
+          </p>
+          <el-button size="small" type="text" @click="addGroup"
+            >添加执行器</el-button
+          >
+        </div>
+
+        <div
+          class="group"
+          v-for="(group, groupIndex) in groups"
+          :key="groupIndex"
+          @click="changeCurrentGroup(groupIndex)"
+        >
+          <p class="SP1">
+            <span>
+              执行器{{ groupIndex + 1 }}
+              <el-input
+                style="margin: 0 10px"
+                size="small"
+                v-model="group.inputValue"
+              ></el-input>
+              <el-button size="small" type="text" @click="dialogVisible = true">
+                上传附件
+              </el-button>
+            </span>
+          </p>
+
+          <div
+            v-for="(table, tableIndex) in group.tables"
+            :key="tableIndex"
+            class="table-container"
+          >
+            <div>
+              <el-button
+                size="small"
+                type="text"
+                @click="ondel(groupIndex, tableIndex)"
+              >
+                删除
+              </el-button>
+            </div>
+            <el-table
+              :data="table.data"
+              border
+              style="width: 100%"
+              tooltip-effect="dark"
+              ref="multipleTable"
+              @selection-change="
+                handleSelectionChange($event, groupIndex, tableIndex)
+              "
+            >
+              <el-table-column type="selection" width="55"> </el-table-column>
+              <el-table-column
+                v-for="(key, colIndex) in table.columnKeys"
+                :key="colIndex"
+                :label="'Item ' + (parseInt(key) + 1)"
+                :prop="key.toString()"
+              ></el-table-column>
+            </el-table>
+          </div>
+        </div>
+      </div>
+      <div class="database">
+        <el-tabs type="border-card">
+          <!-- 动态生成标签页 -->
+          <el-tab-pane
+            v-for="(group, groupIndex) in groups"
+            :key="groupIndex"
+            :label="'执行器组 ' + (groupIndex + 1)"
+          >
+            <div class="pair">
+              <p v-for="(item, index) in modelList" :key="index">
+                <span>{{ item.name }}</span>
+                <el-select
+                  size="small"
+                  v-model="item.val"
+                  multiple
+                  collapse-tags
+                  placeholder="请选择"
+                >
+                  <el-option
+                    v-for="item in selectoptions"
+                    :key="item"
+                    :label="item"
+                    :value="item"
+                  >
+                  </el-option>
+                </el-select>
+              </p>
+            </div>
+
+            <div class="combination">
+              <p>添加数据字段</p>
+              <div class="search">
+                <el-input size="small" v-model="field"></el-input>
+                <el-button size="small" type="text" @click="newVisible = true"
+                  >自定义</el-button
+                >
+              </div>
+              
+              <el-checkbox-group v-model="checkList" @change="duoxuan" class="repetition">
+                <el-checkbox
+                  v-for="(item, index) in checkOptions"
+                  :key="index"
+                  :label="item"
+                >
+                  {{ item }}
+                </el-checkbox>
+              </el-checkbox-group>
+            </div>
+   
+          </el-tab-pane>
+        </el-tabs>
+        <el-button class="fixed-button" type="primary" > 保存 </el-button>
+      </div>
+
+      <!-- 弹窗 -->
+      <el-dialog
+        title="上传"
+        :visible.sync="dialogVisible"
+        width="20%"
+        :before-close="handleClose"
+      >
+        <el-form ref="form" :model="form" label-width="100px">
+          <el-form-item label="上传附件：">
+            <el-upload
+              class="upload-demo"
+              action="https://jsonplaceholder.typicode.com/posts/"
+              :on-preview="handlePreview"
+              :on-remove="handleRemove"
+              :before-remove="beforeRemove"
+              multiple
+              :limit="3"
+              :on-exceed="handleExceed"
+              :file-list="fileList"
+            >
+              <el-button @click="onUpload" size="small">上传</el-button>
+            </el-upload>
+          </el-form-item>
+          <el-form-item label="是否有列名：">
+            <el-radio-group v-model="form.resource">
+              <el-radio label="是"></el-radio>
+              <el-radio label="否"></el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="列名所在行：">
+            <el-input v-model="form.name"></el-input>
+          </el-form-item>
+
+          <el-form-item label="范围最小值：">
+            <el-input v-model="form.name"></el-input>
+          </el-form-item>
+          <el-form-item label="范围最大值：">
+            <el-input v-model="form.name"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="onSubmit()">立即创建</el-button>
+          </el-form-item>
+        </el-form>
+      </el-dialog>
+
+      <el-dialog
+        title="新增"
+        :visible.sync="newVisible"
+        width="15%"
+        :before-close="handleClose"
+      >
+        <div>
+          <i class="el-icon-plus" @click="addInput"></i>
+          <i
+            class="el-icon-minus"
+            @click="removeInput(index)"
+            v-if="inputList.length > 1"
+          ></i>
+        </div>
+        <div
+          v-for="(item, index) in inputList"
+          :key="index"
+          class="input-group"
+        >
+          <el-input
+            size="small"
+            v-model="item.value"
+            placeholder="请输入"
+            style="margin-bottom: 10px"
+          ></el-input>
+
+          <!-- 加号按钮 -->
+        </div>
+        <div style="display: flex; justify-content: center">
+          <el-button size="small" type="primary" @click="confirm"
+            >确 定</el-button
+          >
+        </div>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      newVisible: false,
+      zxqName: "",
+      tableData: [
+        { 0: "2023-12-01", 1: "2023-12-02", 2: "2023-12-03", 3: "2023-12-04" },
+        { 0: "2023-12-01", 1: "2023-12-02", 2: "2023-12-03", 3: "2023-12-04" },
+        { 0: "2023-12-01", 1: "2023-12-02", 2: "2023-12-03", 3: "2023-12-04" },
+      ],
+      columnKeys: [],
+      form: {},
+      fileList: [],
+      tables: [],
+      groups: [
+        {
+          inputValue: "", // 输入框默认值
+          tables: [
+            {
+              columnKeys: ["0", "1", "2", "3"], // 默认的列
+              data: [
+                {
+                  0: "2023-12-01",
+                  1: "2023-12-02",
+                  2: "2023-12-03",
+                  3: "2023-12-04",
+                },
+                {
+                  0: "2023-12-05",
+                  1: "2023-12-06",
+                  2: "2023-12-07",
+                  3: "2023-12-08",
+                },
+                {
+                  0: "2023-12-09",
+                  1: "2023-12-10",
+                  2: "2023-12-11",
+                  3: "2023-12-12",
+                },
+              ],
+            },
+          ],
+        },
+      ],
+      currentGroupIndex: 0, // 当前操作的执行器索引
+      selectoptions: [],
+      selectvalue: [],
+      field: "",
+      checkList: [],
+      multipleSelection: [],
+      checkOptions: [], // 循环的选项
+      modelList: [
+        { name: "模板1", val: [] },
+        { name: "模板2", val: [] },
+
+      ],
+      inputList: [
+        { value: "" }, // 默认有一个输入框
+      ],
+    };
+  },
+  watch: {
+    // 监听 checkList 数组的变化，并更新 selectOptions
+    // checkList(newValue) {
+    //   this.selectOptions = [...newValue]; // 将选中的复选框值复制到 selectOptions
+    // },
+  },
+  mounted() {
+    if (this.tableData.length > 0) {
+      this.columnKeys = Object.keys(this.tableData[0]); // 动态提取列名
+    }
+  },
+  methods: {
+    // 获取默认表格模板
+    getDefaultTable() {
+      return {
+        columnKeys: ["0", "1", "2", "3"],
+        data: [
+          {
+            0: "2023-12-01",
+            1: "2023-12-02",
+            2: "2023-12-03",
+            3: "2023-12-04",
+          },
+          {
+            0: "2023-12-05",
+            1: "2023-12-06",
+            2: "2023-12-07",
+            3: "2023-12-08",
+          },
+          {
+            0: "2023-12-09",
+            1: "2023-12-10",
+            2: "2023-12-11",
+            3: "2023-12-12",
+          },
+        ],
+      };
+    },
+
+    // 上传操作
+    onUpload() {
+      this.dialogVisible = true;
+    },
+
+    // 仅在当前 group 下新增表格
+    onSubmit() {
+      const newTable = {
+        columnKeys: ["0", "1", "2", "3"], // 默认列
+        data: [
+          {
+            0: "2023-12-01",
+            1: "2023-12-02",
+            2: "2023-12-03",
+            3: "2023-12-04",
+          },
+          {
+            0: "2023-12-01",
+            1: "2023-12-02",
+            2: "2023-12-03",
+            3: "2023-12-04",
+          },
+          {
+            0: "2023-12-01",
+            1: "2023-12-02",
+            2: "2023-12-03",
+            3: "2023-12-04",
+          },
+        ],
+      };
+
+      // 只在当前 group 的 tables 数组中新增表格
+      this.groups[this.currentGroupIndex].tables.push(newTable);
+
+      console.log("新增后的 groups 数据：", this.groups);
+      this.dialogVisible = false;
+    },
+
+    // 切换当前 group
+    changeCurrentGroup(groupIndex) {
+      this.currentGroupIndex = groupIndex;
+    },
+
+    // 删除表格
+    ondel(groupIndex, tableIndex) {
+      this.groups[groupIndex].tables.splice(tableIndex, 1);
+    },
+
+    // 新增执行器组
+    addGroup() {
+      this.groups.push({
+        inputValue: "",
+        tables: [this.getDefaultTable()],
+      });
+    },
+
+    handleSelectionChange(val, groupIndex, tableIndex) {
+      const currentTable = this.groups[groupIndex].tables[tableIndex]; // 获取当前表格
+      // 提取每行所有字段的值（不管字段名是什么）
+      currentTable.selectedValues = val.flatMap((item) => Object.values(item)); // 获取每一行的所有值
+
+      // 计算新增和移除的选项
+      const added = currentTable.selectedValues.filter(
+        (item) =>
+          !this.checkOptions.includes(item) &&
+          !this.inputList.some((input) => input.value === item) // 排除掉 confirm 添加的值
+      );
+
+      const removed = this.checkOptions.filter(
+        (item) =>
+          !currentTable.selectedValues.includes(item) &&
+          !this.inputList.some((input) => input.value === item) // 排除掉 confirm 添加的值
+      );
+
+      // 更新 checkOptions
+      if (added.length) {
+        this.checkOptions.push(...added);
+      }
+      if (removed.length) {
+        this.checkOptions = this.checkOptions.filter(
+          (item) => !removed.includes(item)
+        );
+      }
+
+      // 重新计算 checkOptions，包含所有选中行的所有字段值
+      this.checkOptions = this.groups
+        .flatMap((group) => group.tables) // 遍历所有组的所有表格
+        .flatMap((table) => table.selectedValues || []); // 合并所有表格的选中行的字段值
+    },
+    duoxuan(val) {
+      console.log(val);
+
+      this.selectoptions = val;
+    },
+
+    addInput() {
+      this.$set(this.inputList, this.inputList.length, { value: "" });
+    },
+    // 删除指定的输入框
+    removeInput(index) {
+      if (this.inputList.length > 1) {
+        this.inputList.splice(index, 1); // 从 inputList 中删除指定的输入框
+      }
+    },
+    confirm() {
+      this.newVisible = false;
+      this.inputList.forEach((item) => {
+        if (item.value) {
+          // 如果有值才添加
+          this.checkOptions.push(item.value);
+        }
+      });
+      console.log(this.selectoptions);
+    },
+
+    handleClose(done) {
+      done();
+    },
+
+    handleRemove(file, fileList) {
+      console.log(file, fileList);
+    },
+
+    handlePreview(file) {
+      console.log(file);
+    },
+
+    handleExceed(files, fileList) {
+      this.$message.warning(
+        `当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
+          files.length + fileList.length
+        } 个文件`
+      );
+    },
+
+    beforeRemove(file, fileList) {
+      return this.$confirm(`确定移除 ${file.name}？`);
+    },
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+.parcel {
+  display: flex;
+  justify-content: space-between;
+  .controlling {
+    .hade {
+      display: flex;
+      justify-content: space-between;
+    }
+    .SP1 {
+      display: flex;
+      justify-content: space-between;
+      margin: 10px 0;
+    }
+    width: 75.5%;
+    height: 760px;
+    overflow: hidden;
+    overflow-y: auto;
+   
+    // border: 1px solid #aaaaaa;
+    padding: 10px;
+  }
+  .database {
+
+    width: 24%;
+
+    // border: 1px solid #aaaaaa;
+  }
+}
+
+.el-input {
+  width: 200px;
+}
+
+.pair {
+  height: 350px;
+  overflow: hidden;
+  overflow: auto;
+  p {
+    margin-bottom: 10px;
+    display: flex;
+    span {
+      display: inline-block;
+      width: 150px;
+    }
+    .el-select {
+      width: 180px;
+    }
+  }
+}
+.pair::-webkit-scrollbar {
+  display: none;
+}
+.repetition {
+  height: 240px;
+  overflow: hidden;
+  overflow: auto;
+}
+.repetition::-webkit-scrollbar {
+  display: none;
+}
+.fixed-button {
+
+  width: 100%;
+}
+
+.el-checkbox {
+  margin-right: 10px;
+  margin-bottom: 5px;
+}
+</style>

src/views/etl/compile.vue

@@ -25,9 +25,9 @@
                 size="small"
                 v-model="group.inputValue"
               ></el-input>
-              <el-button size="small" type="text" @click="dialogVisible = true">
-                上传附件
-              </el-button>
+              <el-button size="small" type="text" @click="dialogVisible = true"
+                >上传附件</el-button
+              >
             </span>
           </p>
 
@@ -36,22 +36,21 @@
             :key="tableIndex"
             class="table-container"
           >
-            <div>
-              <el-button
-                size="small"
-                type="text"
-                @click="ondel(groupIndex, tableIndex)"
-              >
-                删除
-              </el-button>
-            </div>
+            <el-button
+              size="small"
+              type="text"
+              @click="ondel(groupIndex, tableIndex)"
+              >删除</el-button
+            >
             <el-table
               :data="table.data"
               border
               style="width: 100%"
               tooltip-effect="dark"
               ref="multipleTable"
-              @selection-change="handleSelectionChange"
+              @selection-change="
+                handleSelectionChange($event, groupIndex, tableIndex)
+              "
             >
               <el-table-column type="selection" width="55"> </el-table-column>
               <el-table-column
@@ -64,6 +63,7 @@
           </div>
         </div>
       </div>
+
       <div class="database">
         <el-tabs type="border-card">
           <!-- 动态生成标签页 -->
@@ -101,7 +101,12 @@
                   >自定义</el-button
                 >
               </div>
-              <el-checkbox-group v-model="checkList" @change="duoxuan">
+
+              <el-checkbox-group
+                v-model="checkList"
+                @change="duoxuan"
+                class="repetition"
+              >
                 <el-checkbox
                   v-for="(item, index) in checkOptions"
                   :key="index"
@@ -113,6 +118,7 @@
             </div>
           </el-tab-pane>
         </el-tabs>
+        <el-button class="fixed-button" type="primary" @click="submitData"> 保存 </el-button>
       </div>
 
       <!-- 弹窗 -->
@@ -254,25 +260,24 @@ export default {
       modelList: [
         { name: "模板1", val: [] },
         { name: "模板2", val: [] },
-        { name: "模板2", val: [] },
       ],
       inputList: [
         { value: "" }, // 默认有一个输入框
       ],
     };
   },
-  watch: {
-    // 监听 checkList 数组的变化，并更新 selectOptions
-    // checkList(newValue) {
-    //   this.selectOptions = [...newValue]; // 将选中的复选框值复制到 selectOptions
-    // },
-  },
+
   mounted() {
     if (this.tableData.length > 0) {
       this.columnKeys = Object.keys(this.tableData[0]); // 动态提取列名
     }
   },
   methods: {
+
+    submitData(){
+console.log(this.groups,'groups');
+
+    },
     // 获取默认表格模板
     getDefaultTable() {
       return {
@@ -356,40 +361,39 @@ export default {
       });
     },
 
-    handleSelectionChange(val) {
-      this.multipleSelection = val;
-      // 获取新选中的值
-      const newCheckOptions = this.multipleSelection.flatMap((item) =>
-        Object.values(item)
-   
-      );
-      console.log(  newCheckOptions);
-        
-      // 找到当前选中的与之前的选中值之间的差异
-      const added = newCheckOptions.filter(
-        (item) => !this.checkOptions.includes(item)
+    handleSelectionChange(val, groupIndex, tableIndex) {
+      const currentTable = this.groups[groupIndex].tables[tableIndex]; // 获取当前表格
+      // 提取每行所有字段的值（不管字段名是什么）
+      currentTable.selectedValues = val.flatMap((item) => Object.values(item)); // 获取每一行的所有值
+
+      // 计算新增和移除的选项
+      const added = currentTable.selectedValues.filter(
+        (item) =>
+          !this.checkOptions.includes(item) &&
+          !this.inputList.some((input) => input.value === item) // 排除掉 confirm 添加的值
       );
 
-      
       const removed = this.checkOptions.filter(
-        (item) => !newCheckOptions.includes(item)
+        (item) =>
+          !currentTable.selectedValues.includes(item) &&
+          !this.inputList.some((input) => input.value === item) // 排除掉 confirm 添加的值
       );
 
       // 更新 checkOptions
       if (added.length) {
-        this.checkOptions.push(...added); 
- 
-        
+        this.checkOptions.push(...added);
       }
       if (removed.length) {
         this.checkOptions = this.checkOptions.filter(
           (item) => !removed.includes(item)
-          
-        ); 
-
+        );
       }
-    },
 
+      // 重新计算 checkOptions，包含所有选中行的所有字段值
+      this.checkOptions = this.groups
+        .flatMap((group) => group.tables) // 遍历所有组的所有表格
+        .flatMap((table) => table.selectedValues || []); // 合并所有表格的选中行的字段值
+    },
     duoxuan(val) {
       console.log(val);
 
@@ -443,28 +447,36 @@ export default {
 };
 </script>
 
-
 <style lang="scss" scoped>
 .parcel {
   display: flex;
   justify-content: space-between;
+
   .controlling {
     .hade {
       display: flex;
       justify-content: space-between;
     }
+
     .SP1 {
       display: flex;
       justify-content: space-between;
       margin: 10px 0;
     }
+
     width: 75.5%;
-    border: 1px solid #aaaaaa;
+    height: 760px;
+    overflow: hidden;
+    overflow-y: auto;
+
+    // border: 1px solid #aaaaaa;
     padding: 10px;
   }
+
   .database {
     width: 24%;
-    border: 1px solid #aaaaaa;
+
+    // border: 1px solid #aaaaaa;
   }
 }
 
@@ -473,22 +485,45 @@ export default {
 }
 
 .pair {
-  height: 400px;
+  height: 350px;
+  overflow: hidden;
+  overflow: auto;
+
   p {
     margin-bottom: 10px;
+    display: flex;
+
     span {
       display: inline-block;
       width: 150px;
     }
+
     .el-select {
       width: 180px;
     }
   }
 }
-.combination {
+
+.pair::-webkit-scrollbar {
+  display: none;
 }
+
+.repetition {
+  height: 240px;
+  overflow: hidden;
+  overflow: auto;
+}
+
+.repetition::-webkit-scrollbar {
+  display: none;
+}
+
+.fixed-button {
+  width: 100%;
+}
+
 .el-checkbox {
   margin-right: 10px;
   margin-bottom: 5px;
 }
-</style>
+</style>

src/views/etl/index.vue

@@ -1,9 +1,7 @@
 <template>
   <div class="global-variable">
     <div class="button-container">
-      <el-button type="primary" plain size="small" @click="drawer = true"
-        >数据模板</el-button
-      >
+      <el-button type="primary" plain size="small" @click="drawer = true">数据模板</el-button>
     </div>
     <el-table :data="tableData" border style="width: 100%">
       <el-table-column type="index" label="排序" width="60"> </el-table-column>
@@ -15,12 +13,7 @@
       </el-table-column>
       <el-table-column label="操作" width="180" align="center">
         <template slot-scope="scope">
-          <el-button
-            size="small"
-            type="text"
-            @click="Newprocess(scope.$index, scope.row)"
-            >新增流程</el-button
-          >
+          <el-button size="small" type="text" @click="Newprocess(scope.$index, scope.row)">新增流程</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -29,12 +22,7 @@
       <p>
         流程名称:
         <el-select v-model="valueLC" placeholder="请选择" size="small">
-          <el-option
-            v-for="item in optionsLC"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
+          <el-option v-for="item in optionsLC" :key="item.value" :label="item.label" :value="item.value">
           </el-option>
         </el-select>
       </p>
@@ -42,24 +30,14 @@
       <p>
         业务类型:
         <el-select v-model="valueYW" placeholder="请选择" size="small">
-          <el-option
-            v-for="item in optionsYW"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
+          <el-option v-for="item in optionsYW" :key="item.value" :label="item.label" :value="item.value">
           </el-option>
         </el-select>
       </p>
       <p>
         状态:
         <el-select v-model="valueZT" placeholder="请选择" size="small">
-          <el-option
-            v-for="item in optionsZT"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
+          <el-option v-for="item in optionsZT" :key="item.value" :label="item.label" :value="item.value">
           </el-option>
         </el-select>
       </p>
@@ -91,47 +69,21 @@
 
       <el-table-column label="操作" width="180" align="center">
         <template slot-scope="scope">
-          <el-button
-            size="small"
-            type="text"
-            @click="handleEdit(scope.$index, scope.row)"
-            >设计流程</el-button
-          >
-          <el-button
-            size="small"
-            type="text"
-            @click="handleEdit(scope.$index, scope.row)"
-            >复制流程</el-button
-          >
-          <el-button
-            size="small"
-            type="text"
-            @click="handleEdit(scope.$index, scope.row)"
-            >删除</el-button
-          >
+          <el-button size="small" type="text" @click="handleEdit(scope.$index, scope.row)">设计流程</el-button>
+          <el-button size="small" type="text" @click="handleEdit(scope.$index, scope.row)">复制流程</el-button>
+          <el-button size="small" type="text" @click="handleEdit(scope.$index, scope.row)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
-    <el-pagination
-      class="fenye"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-      :page-size="5"
-      layout="total, prev, pager, next"
-      :total="20"
-    >
+    <el-pagination class="fenye" @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-size="5"
+      layout="total, prev, pager, next" :total="20">
     </el-pagination>
 
     <!-- 抽屉 -->
     <el-drawer title="标准数据模板" :visible.sync="drawer">
       <div class="titleText">
-        <el-input size="small"></el-input>
-        <el-button
-          style="margin-left: 10px"
-          size="small"
-          @click="newdrawer = true"
-          >新建</el-button
-        >
+        <el-input v-model="designation" @input="GETinquire" size="small"></el-input>
+        <el-button style="margin-left: 10px" size="small" @click="newdrawer = true">新建</el-button>
       </div>
       <el-table :data="templateData" border style="width: 100%">
         <el-table-column prop="name" label="流程名称" align="center">
@@ -139,18 +91,8 @@
 
         <el-table-column label="操作" width="120" align="center">
           <template slot-scope="scope">
-            <el-button
-              size="small"
-              type="text"
-              @click="handleEdit(scope.$index, scope.row)"
-              >编辑</el-button
-            >
-            <el-button
-              size="small"
-              type="text"
-              @click="handleEdit(scope.$index, scope.row)"
-              >删除</el-button
-            >
+            <el-button size="small" type="text" @click="compile(scope.$index, scope.row)">编辑</el-button>
+            <el-button size="small" type="text" @click="Deletion(scope.$index, scope.row)">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -159,11 +101,7 @@
     <el-drawer :with-header="false" :visible.sync="newdrawer">
       <div class="drawer-content">
         <div class="tou">
-          <el-input
-            v-model="templateName"
-            placeholder="请输入模板名称"
-            size="small"
-          ></el-input>
+          <el-input v-model="templateName" placeholder="请输入模板名称" size="small"></el-input>
           <div>
             <i class="el-icon-plus" @click="addCirculation"></i>
             <i class="el-icon-minus" @click="removeCirculation"></i>
@@ -171,79 +109,55 @@
         </div>
 
         <div class="templatedata">
-          <div
-            class="circulation"
-            v-for="(item, index) in circulations"
-            :key="index"
-          >
-            <el-input
-              v-model="item.priceName"
-              placeholder="请输入字段名"
-              size="small"
-            ></el-input>
-            <el-checkbox v-model="item.checked1">索引</el-checkbox>
-            <el-checkbox v-model="item.checked2">切割</el-checkbox>
+          <div class="circulation" v-for="(item, index) in circulations" :key="index">
+            <el-input v-model="item.priceName" placeholder="请输入字段名" size="small"></el-input>
+            <el-checkbox v-model="item.isCutCol">索引</el-checkbox>
+            <el-checkbox v-model="item.isIndex">切割</el-checkbox>
           </div>
         </div>
-        <el-button class="fixed-button" type="primary" @click="saveData"
-          >保存</el-button
-        >
+        <el-button class="fixed-button" type="primary" @click="saveData">保存</el-button>
       </div>
 
       <!-- Fixed button at the bottom of the drawer -->
     </el-drawer>
 
     <!-- 弹窗 -->
-    <el-dialog
-      title="新增"
-      :visible.sync="dialogVisible"
-      width="25%"
-      :before-close="handleClose"
-    >
+    <el-dialog title="新增" :visible.sync="dialogVisible" width="25%" :before-close="handleClose">
       选择：
-      <el-select v-model="value" size="small" placeholder="请选择">
-        <el-option
-          v-for="item in options"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-        >
+      <el-select v-model="newvalue" size="small" placeholder="请选择">
+        <el-option v-for="item in newoptions" :key="item.id" :label="item.name" :value="item.id">
         </el-option>
       </el-select>
-      <el-button
-        type="primary"
-        style="margin-left: 20px"
-        @click="skip"
-        size="small"
-        >确 定</el-button
-      >
+      <el-button type="primary" style="margin-left: 20px" @click="skip" size="small">确 定</el-button>
     </el-dialog>
   </div>
 </template>
 
 <script>
+import axios from "axios";
 export default {
   data() {
     return {
       drawer: false,
       newdrawer: false,
       dialogVisible: false,
-      templateData: [{}],
+      templateData: [],
       tableflow: [{}, {}, {}, {}, {}],
       tableData: [
         {
           name: "ETL横向清洗执行器",
-          descr: "",
+          descr: "ETL 横向清洗执行器用于将多个数据源在“列”维度上进行合并。",
           type: "合并",
         },
         {
           name: "ETL纵向清洗执行器",
-          descr: "",
+          descr: "ETL 纵向清洗执行器用于将多个数据源在“行”维度上进行拼接。",
           type: "拼接",
         },
         {
           name: "ETL清洗执行器",
-          descr: "",
+          descr:
+            " ETL 清洗执行器的自定义模式允许用户根据自己的需求进行灵活的数据清洗操作。用户可以定义自己的清洗规则。",
           type: "自定义",
         },
       ],
@@ -289,64 +203,186 @@ export default {
           label: "失败",
         },
       ],
+      designation: "",
       valueLC: "",
       valueZXC: "",
       valueYW: "",
       valueZT: "",
       templateName: "",
       priceName: "",
-      checked1: false,
-      checked2: false,
+      isCutCol: false,
+      isIndex: false,
       circulations: [
         {
           priceName: "",
-          checked1: false,
-          checked2: false,
+          isCutCol: false,
+          isIndex: false,
         },
       ],
+      newvalue: "",
+      newoptions: [],
+      templateId: "",
     };
   },
+  created() {
+    this.GETinquire();
+  },
   methods: {
-    handleSizeChange(val) {
-      console.log(`每页 ${val} 条`);
+    // 查询模板
+    
+    GETinquire() {
+  const name = this.designation; // 假设你有一个变量 name，可以根据实际情况赋值
+  axios
+    .get(`/ETLapi/baseTemplate/getAllEnabled`, { params: { name } }) // 使用 params 传递查询参数
+    .then((res) => {
+      this.templateData = res.data.datas;
+      this.newoptions = res.data.datas;
+      console.log(this.optionsLC);
+    })
+    .catch((error) => {
+      console.error(error); // 可加入错误处理
+    });
+},
+
+    // 新增编辑
+    saveData() {
+      const params = {
+        name: this.templateName, // 获取模板名称
+        templateFieldsInDataList: this.circulations
+          .map((item) => {
+            if (!item.priceName) {
+              this.$message({
+                message: "字段名不能为空",
+                type: "warning",
+              });
+              return; // 如果字段名为空，跳过当前项
+            }
+            return {
+              standardizedName: item.priceName, // 字段名
+              isIndex: item.isCutCol ? 1 : 0, // 转换为 1 或 0
+              isCutCol: item.isIndex ? 1 : 0, // 转换为 1 或 0
+            };
+          })
+          .filter((item) => item), // 过滤掉无效项
+      };
+
+      // 如果没有有效的字段数据，返回
+      if (!params.templateFieldsInDataList.length) {
+        return;
+      }
+
+      // 判断是编辑还是新增
+      const requestData = this.templateId
+        ? { ...params, id: this.templateId } // 编辑时传递 id
+        : { ...params }; // 新增时不传递 id
+      // 编辑操作
+      if (this.templateId) {
+        axios
+          .post("/ETLapi/baseTemplate/editTemplate", requestData)
+          .then((res) => {
+            this.$message({
+              message: "编辑成功",
+              type: "success",
+            });
+            this.newdrawer = false;
+
+            this.GETinquire();
+          })
+          .catch((error) => {
+            this.$message({
+              message: "编辑失败",
+              type: "error",
+            });
+          });
+      } else {
+        // 新增操作
+        axios
+          .post("/ETLapi/baseTemplate/addTemplate", requestData)
+          .then((res) => {
+            this.$message({
+              message: "新增成功",
+              type: "success",
+            });
+            this.newdrawer = false;
+            this.circulations = [
+              {
+                priceName: "",
+                isCutCol: false,
+                isIndex: false,
+              },
+            ];
+            this.templateName = "";
+            this.GETinquire();
+          })
+          .catch((error) => {
+            this.$message({
+              message: "新增失败",
+              type: "error",
+            });
+          });
+      }
     },
-    handleCurrentChange(val) {
-      console.log(`当前页: ${val}`);
+
+    // 删除模板
+    Deletion(index, row) {
+      const id = row.id;
+      axios
+        .post(`/ETLapi/baseTemplate/del/${id}`)
+        .then((res) => {
+          this.$message({
+            message: "删除成功",
+            type: "success",
+          });
+          this.templateData.splice(index, 1); // 根据 index 删除对应的行
+        })
+        .catch((error) => {
+          this.$message({
+            message: "删除失败",
+            type: "error",
+          });
+        });
     },
-    handleClose(done) {
-      done();
+    // 编辑回显
+    compile(index, row) {
+      const id = row.id;
+      axios.get(`/ETLapi/baseTemplate/get/${id}`).then((res) => {
+        this.newdrawer = true;
+        this.templateName = res.data.datas.baseTemplate.name;
+        this.templateId = res.data.datas.baseTemplate.id;
+        this.circulations = res.data.datas.fieldList.map((item) => ({
+          id: item.id,
+          priceName: item.standardizedName,
+          isIndex: !!item.isIndex,
+          isCutCol: !!item.isCutCol,
+        }));
+      });
     },
+
+    // 增加一行
     addCirculation() {
       this.circulations.push({
         priceName: "",
-        checked1: false,
-        checked2: false,
+        isCutCol: false,
+        isIndex: false,
       });
     },
+    // 删除一行
     removeCirculation() {
       if (this.circulations.length > 1) {
         this.circulations.pop();
       }
     },
-    saveData() {
-      const params = {
-        templateName: this.templateName, // Access templateName correctly
-        circulations: this.circulations.map((item) => ({
-          priceName: item.priceName, // Ensure these values are populated
-          checked1: item.checked1,
-          checked2: item.checked2,
-        })),
-      };
-      this.newdrawer = false;
-      this.circulations = [
-        {
-          priceName: "",
-          checked1: false,
-          checked2: false,
-        },
-      ];
-      this.templateName = "";
+
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    },
+    handleClose(done) {
+      done();
     },
+
     Newprocess(row) {
       this.dialogVisible = true;
     },
@@ -368,10 +404,12 @@ export default {
   flex-grow: 1;
   margin-top: 10px;
   overflow-y: auto;
+
   .circulation {
     margin-bottom: 10px;
   }
 }
+
 .fixed-button {
   margin-top: 10px;
   z-index: 99;
@@ -384,38 +422,48 @@ export default {
 
   div {
     margin-right: 40px;
+
     i {
       font-size: 26px;
       line-height: 34px;
     }
   }
 }
+
 .titleText {
   margin-bottom: 10px;
 }
+
 .button-container {
   display: flex;
   justify-content: flex-end;
-  margin: 5px 0; /* Optional, if you want a top margin */
+  margin: 5px 0;
+  /* Optional, if you want a top margin */
 }
+
 .fenye {
   display: flex;
   justify-content: center;
   margin-top: 20px;
 }
+
 .process {
   display: flex;
   margin-bottom: 10px;
+
   p {
     margin-right: 20px;
   }
 }
+
 .el-select {
   width: 200px;
 }
+
 .el-input {
   width: 200px;
 }
+
 h2 {
   font-size: 30px;
   font-weight: 600;
@@ -426,10 +474,12 @@ h2 {
   width: 22% !important;
   padding: 5px;
 }
+
 .el-checkbox {
   margin: 0 5px;
 }
+
 .el-checkbox__label {
   padding-left: 5px;
 }
-</style>
+</style>

src/views/ledger/componentBJ/chilunxiang copy.vue

@@ -0,0 +1,1414 @@
+<template>
+  <div class="CLX">
+    <div class="message">
+      <div class="message-DIV">
+        <p>润滑油品牌：</p>
+        <el-select
+          clearable
+          v-model="lubricantBrand"
+          placeholder="请选择"
+          @change="handleBrandChange"
+        >
+          <el-option
+            v-for="item in clxPP"
+            :key="item"
+            :label="item"
+            :value="item"
+          >
+          </el-option>
+        </el-select>
+      </div>
+
+      <div class="message-DIV">
+        <p>润滑油型号：</p>
+        <el-select
+          clearable
+          v-model="lubricantModel"
+          placeholder="请选择"
+          :disabled="!lubricantBrand"
+          @change="lube"
+        >
+          <el-option
+            v-for="item in lubricatingXXoptions"
+            :key="item"
+            :label="item"
+            :value="item"
+          >
+          </el-option>
+        </el-select>
+      </div>
+    </div>
+    <!-- LLS -->
+    <!-- <p class="locationP">
+      <i @click="addLSS" class="el-icon-plus"></i>
+      <i v-if="lowSpeedList.length > 1" @click="delLSS" class="el-icon-minus"></i>
+    </p> -->
+    <div class="message">
+      <p class="caption">
+        <span class="capSpan1">LSS低速轴</span>
+      </p>
+      <div
+        v-for="(item, index) in lowSpeedList.length > 0 ? lowSpeedList : [{}]"
+        :key="index"
+        class="message-BOX"
+      >
+        <div class="message-DIV">
+          <p>{{ index === 0 ? "低速轴承品牌：" : "低速轴承2/品牌：" }}</p>
+          <el-select
+            clearable
+            v-model="item.bearingBrand"
+            placeholder="请选择"
+            @change="LSSslow(item)"
+          >
+            <el-option
+              v-for="option in clxZC"
+              :key="option"
+              :label="option"
+              :value="option"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>{{ index === 0 ? "低速轴承型号：" : "低速轴承2/型号：" }}</p>
+          <el-select
+            clearable
+            v-model="item.bearingModel"
+            placeholder="请选择"
+            :disabled="!item.bearingBrand"
+          >
+            <el-option
+              v-for="option in LSSbearingXXoptions"
+              :key="option"
+              :label="option"
+              :value="option"
+            >
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+    </div>
+
+    <!-- 行星轮 -->
+    <p class="locationP">
+      <i @click="addPlanet" class="el-icon-plus"></i>
+      <i v-if="planets.length > 1" @click="delPlanet" class="el-icon-minus"></i>
+    </p>
+    <div
+      v-for="(item, index) in planets.length > 0 ? planets : [{}]"
+      :key="index"
+      class="message"
+    >
+      <p class="caption">
+        <span class="capSpan1">{{ `${levelNames[index]}行星轮结构` }}</span>
+      </p>
+      <div class="message-BOX">
+        <div class="message-DIV">
+          <p>行星轮轴承品牌：</p>
+          <el-select
+            clearable
+            v-model="item.bearingBrand"
+            placeholder="请选择"
+            @change="XXLzhoucheng(item)"
+          >
+            <el-option
+              v-for="item in clxZC"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option
+          ></el-select>
+        </div>
+        <div class="message-DIV">
+          <p>行星轮轴承型号：</p>
+          <el-select
+            clearable
+            @change="handleUnitGearboxStructureDtoList('planets')"
+            v-model="item.bearingModel"
+            :disabled="!item.bearingBrand"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in bearingXXoptions"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option
+          ></el-select>
+        </div>
+      </div>
+
+      <div class="message-DIV">
+        <p>齿圈齿数：</p>
+        <el-input
+          v-model="item.gearRingTeethCount"
+          @input="
+            validateInput(
+              $event,
+              index,
+              'gearRingTeethCount',
+              'handleUnitGearboxStructureDtoList',
+              'planets'
+            )
+          "
+        ></el-input>
+      </div>
+      <div class="message-DIV">
+        <p>太阳轮齿数：</p>
+        <el-input
+          v-model="item.sunWheelTeethCount"
+          @input="
+            validateInput(
+              $event,
+              index,
+              'sunWheelTeethCount',
+              'handleUnitGearboxStructureDtoList',
+              'planets'
+            )
+          "
+        ></el-input>
+      </div>
+
+      <div class="message-DIV">
+        <p>行星轮个数：</p>
+        <el-input
+          v-model="item.planetWheelCount"
+          @input="
+            validateInput(
+              $event,
+              index,
+              'planetWheelCount',
+              'handleUnitGearboxStructureDtoList',
+              'planets'
+            )
+          "
+        ></el-input>
+      </div>
+      <div class="message-DIV">
+        <p>行星轮齿数：</p>
+        <el-input
+          v-model="item.planetWheelTeethCount"
+          @input="
+            validateInput(
+              $event,
+              index,
+              'planetWheelTeethCount',
+              'handleUnitGearboxStructureDtoList',
+              'planets'
+            )
+          "
+        ></el-input>
+      </div>
+
+      <div class="message-BOX">
+        <div class="message-DIV">
+          <p>太阳轮轴承品牌：</p>
+          <el-select
+            clearable
+            v-model="item.sunWheelBearingBrand"
+            placeholder="请选择"
+            @change="TYLzhoucheng(item)"
+          >
+            <el-option
+              v-for="item in clxZC"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option
+          ></el-select>
+        </div>
+        <div class="message-DIV">
+          <p>太阳轮轴承型号：</p>
+          <el-select
+            clearable
+            @change="handleUnitGearboxStructureDtoList('planets')"
+            v-model="item.sunWheelBearingModel"
+            :disabled="!item.sunWheelBearingBrand"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in bearingXXoptions"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option
+          ></el-select>
+        </div>
+      </div>
+    </div>
+
+    <!-- 平行轮 -->
+    <p class="locationP">
+      <i @click="addparallel" class="el-icon-plus"></i>
+      <i
+        v-if="parallel.length > 1"
+        @click="delparallel"
+        class="el-icon-minus"
+      ></i>
+    </p>
+    <div
+      v-for="(item, index) in parallel.length > 0 ? parallel : [{}]"
+      :key="`parallel-${index}`"
+      class="message"
+    >
+      <p class="caption">
+        <span class="capSpan1">{{ `${levelNames[index]}平行轮结构` }}</span>
+      </p>
+      <div class="message-DIV">
+        <p>大齿轮齿数</p>
+        <el-input
+          v-model="item.largeGearTeethCount"
+          @change="handleUnitGearboxStructureDtoList('parallel')"
+          @input="
+            validateInput(
+              $event,
+              index,
+              'largeGearTeethCount',
+              'handleUnitGearboxStructureDtoList',
+              'parallel'
+            )
+          "
+        ></el-input>
+      </div>
+      <div class="message-DIV">
+        <p>小齿轮齿数</p>
+        <el-input
+          @change="handleUnitGearboxStructureDtoList('parallel')"
+          v-model="item.smallGearTeethCount"
+          @input="
+            validateInput(
+              $event,
+              index,
+              'smallGearTeethCount',
+              'handleUnitGearboxStructureDtoList',
+              'parallel'
+            )
+          "
+        ></el-input>
+      </div>
+    </div>
+
+    <!-- 低速中间轴 -->
+    <p class="locationP">
+      <i @click="addslowly" class="el-icon-plus"></i>
+      <i
+        v-if="lowSpeedIntermediateShaftList.length > 1"
+        @click="delslowly"
+        class="el-icon-minus"
+      ></i>
+    </p>
+    <div class="message">
+      <p class="caption">
+        <span class="capSpan1">低速中间轴</span>
+      </p>
+
+      <div
+        v-for="(item, index) in lowSpeedIntermediateShaftList.length > 0
+          ? lowSpeedIntermediateShaftList
+          : [{}]"
+        :key="index"
+        class="message-BOX"
+      >
+        <div class="message-DIV">
+          <p>轴承-RS品牌：</p>
+          <el-select
+            clearable
+            @change="DSrs(item)"
+            v-model="item.bearingRsBrand"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in clxZC"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-RS型号：</p>
+          <el-select
+            clearable
+            :disabled="!item.bearingRsBrand"
+            v-model="item.bearingRsModel"
+            placeholder="请选择"
+            @change="handleLowSpeedIntermediateBearingsDtoList"
+          >
+            <el-option
+              v-for="item in RSbearingXXoptionsDS"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS品牌：</p>
+          <el-select
+            clearable
+            @change="DSgs(item)"
+            v-model="item.bearingGsBrand"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in clxZC"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS型号：</p>
+          <el-select
+            clearable
+            :disabled="!item.bearingGsBrand"
+            v-model="item.bearingGsModel"
+            placeholder="请选择"
+            @change="handleLowSpeedIntermediateBearingsDtoList"
+          >
+            <el-option
+              v-for="item in GSbearingXXoptions"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>齿圈齿数：</p>
+          <el-input
+            v-model="item.gearRingTeethCount"
+            @input="
+              (event) =>
+                validateInput(
+                  event,
+                  index,
+                  'gearRingTeethCount',
+                  'handleLowSpeedIntermediateBearingsDtoList',
+                  'lowSpeedIntermediateShaftList'
+                )
+            "
+          ></el-input>
+        </div>
+      </div>
+    </div>
+
+    <!-- 高速轴 -->
+    <!-- <p class="locationP">
+      <i @click="addhigh" class="el-icon-plus"></i>
+      <i v-if="highSpeedShaftList.length > 1" @click="delhigh" class="el-icon-minus"></i>
+    </p> -->
+    <div class="message">
+      <p class="caption">
+        <span class="capSpan1">高速轴</span>
+      </p>
+
+      <div
+        v-for="(item, index) in highSpeedShaftList.length > 0
+          ? highSpeedShaftList
+          : [{}]"
+        :key="index"
+        class="message-BOX"
+      >
+        <div class="message-DIV">
+          <p>轴承-RS品牌：</p>
+          <el-select
+            clearable
+            @change="GSrs(item)"
+            v-model="item.bearingRsBrand"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in clxZC"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-RS型号：</p>
+          <el-select
+            clearable
+            :disabled="!item.bearingRsBrand"
+            v-model="item.bearingRsModel"
+            placeholder="请选择"
+            @change="handleHighSpeedBearingsDtoList"
+          >
+            <el-option
+              v-for="item in RSbearingXXoptions"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS品牌：</p>
+          <el-select
+            clearable
+            @change="GSgs(item)"
+            v-model="item.bearingGsBrand"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in clxZC"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS型号：</p>
+          <el-select
+            clearable
+            :disabled="!item.bearingGsBrand"
+            v-model="item.bearingGsModel"
+            placeholder="请选择"
+            @change="handleHighSpeedBearingsDtoList"
+          >
+            <el-option
+              v-for="item in GSbearingXXoptions"
+              :key="item"
+              :label="item"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>齿圈齿数：</p>
+          <el-input
+            v-model="item.gearRingTeethCount"
+            @input="
+              (event) =>
+                validateInput(
+                  event,
+                  index,
+                  'gearRingTeethCount',
+                  'handleHighSpeedBearingsDtoList',
+                  'highSpeedShaftList'
+                )
+            "
+          ></el-input>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getBrandModelNameOrModelNumber } from "@/api/maintain";
+import { log } from "plotly.js-dist";
+export default {
+  props: {
+    clxPP: {
+      type: Array,
+      required: true,
+    },
+    clxZC: {
+      type: Array,
+      required: true,
+    },
+    unitGearDto: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+
+  data() {
+    return {
+      lubricantBrand: "",
+      lubricantModel: "",
+      // 低速轴
+      lowSpeedList: [
+        {
+          bearingBrand: "",
+          bearingModel: "",
+          parallelWheelGrade: 1,
+        },
+      ],
+      bearingBrand: "",
+      bearingModel: "",
+      sunWheelBearingBrand: "",
+      sunWheelBearingModel: "",
+      // 行星轮
+      planets: [
+        {
+          planetWheelCount: "",
+          planetWheelTeethCount: "",
+          sunWheelTeethCount: "",
+          gearRingTeethCount: "",
+          bearingBrand: "",
+          bearingModel: "",
+          sunWheelBearingBrand: "",
+          sunWheelBearingModel: "",
+          gearboxStructure: 1,
+          planetaryGearGrade: 1,
+        },
+      ],
+      levelNames: ["一级", "二级", "三级"],
+      //
+      parallel: [
+        {
+          largeGearTeethCount: "",
+          smallGearTeethCount: "",
+          gearboxStructure: 2,
+          planetaryGearGrade: 1,
+        },
+      ],
+      // 低速中间轴
+      lowSpeedIntermediateShaftList: [
+        {
+          gearRingTeethCount: "",
+          bearingRsBrand: "",
+          bearingRsModel: "",
+          bearingGsBrand: "",
+          bearingGsModel: "",
+          gearboxBearingLevel: 1,
+          parallelWheelGrade: 2,
+        },
+      ],
+      // 高速轴
+      highSpeedShaftList: [
+        {
+          gearRingTeethCount: "",
+          bearingRsBrand: "",
+          bearingRsModel: "",
+          bearingGsBrand: "",
+          bearingGsModel: "",
+          parallelWheelGrade: 3,
+        },
+      ],
+      lubricatingXXoptions: [],
+
+      bearingXXoptions: [],
+      unitGearboxBearingsDtoList: [],
+      unitGearboxStructureDtoList: [],
+
+      LSSbearingXXoptions: [],
+      RSbearingXXoptions: [],
+      GSbearingXXoptions: [],
+      RSbearingXXoptionsDS: [],
+      GSbearingXXoptions: [],
+    };
+  },
+  watch: {
+    // 高速轴
+    highSpeedShaftList: {
+      handler(newValue) {
+        newValue.forEach((item) => {
+          if (item.bearingRsBrand) {
+          } else {
+            item.bearingRsModel = "";
+          }
+          if (item.bearingGsBrand) {
+          } else {
+            item.bearingGsModel = "";
+          }
+        });
+      },
+      deep: true, // 启用深度监听
+    },
+
+    unitGearboxBearingsDtoList: function (newValue, oldValue) {
+      console.log("unitGearboxBearingsDtoList changed:", newValue);
+      // 在这里可以调用你需要处理的逻辑，比如调用 handleLowSpeedBearingsDtoList 方法
+    },
+    unitGearDto: {
+      immediate: true, // 初始化时触发
+      deep: true, // 深度监听
+      handler(newVal) {
+        if (newVal && typeof newVal === "object") {
+          this.initializeData(newVal);
+        } else {
+          console.warn("unitGearDto 为空或无效:", newVal);
+        }
+      },
+    },
+  },
+
+  mounted() {
+    this.highSpeedShaftList.forEach((item) => {
+      // 如果 bearingRsBrand 有值，调用接口获取型号
+      if (item.bearingRsBrand) {
+        this.GSrs(item);
+      }
+
+      // 如果 bearingGsBrand 有值，调用接口获取型号
+      if (item.bearingGsBrand) {
+        this.GSgs(item);
+      }
+    });
+  },
+
+  created() {
+    if (this.unitGearDto && typeof this.unitGearDto === "object") {
+      this.initializeData(this.unitGearDto);
+    }
+  },
+  methods: {
+    initializeData(newVal = {}) {
+      if (!newVal || typeof newVal !== "object" || Array.isArray(newVal)) {
+        console.warn("传入的数据无效，跳过初始化:", newVal);
+        return;
+      }
+      this.lubricantBrand = newVal?.lubricantBrand || "";
+      this.lubricantModel = newVal?.lubricantModel || "";
+      this.distributeByParallelWheelGrade(newVal.unitGearboxBearingsList);
+      this.distributeDataByStructureAndGrade(newVal.unitGearboxStructureList);
+    },
+    distributeByParallelWheelGrade(data) {
+      this.lowSpeedList = [];
+      this.lowSpeedIntermediateShaftList = [];
+      this.highSpeedShaftList = [];
+
+      data.forEach((item) => {
+        switch (item.parallelWheelGrade) {
+          case 1:
+            this.lowSpeedList.push(item);
+            break;
+          case 2:
+            this.lowSpeedIntermediateShaftList.push(item);
+            break;
+          case 3:
+            this.highSpeedShaftList.push(item);
+            break;
+          default:
+            break;
+        }
+      });
+
+      // return {
+      //   lowSpeedList,
+      //   lowSpeedIntermediateShaftList,
+      //   highSpeedShaftList,
+      // };
+    },
+    distributeDataByStructureAndGrade(data) {
+      this.planets = [];
+      this.parallel = [];
+      console.log(data, "-=-==-=");
+      const planets = [];
+      const parallel = [];
+      // 分配数据到planets和parallel
+      // 分配数据到planets和parallel
+      data.forEach((item) => {
+        if (item.gearboxStructure === 1) {
+          planets.push(item);
+        } else if (item.gearboxStructure === 2) {
+          parallel.push(item);
+        }
+      });
+
+      // 对planets和parallel数组按planetaryGearGrade排序
+      planets.sort((a, b) => a.planetaryGearGrade - b.planetaryGearGrade);
+      parallel.sort((a, b) => a.planetaryGearGrade - b.planetaryGearGrade);
+      console.log(planets, "-=-==-=", parallel);
+      this.planets = planets;
+      this.parallel = parallel;
+      // return {
+      //   planets,
+      //   parallel,
+      // };
+    },
+    // 润滑油
+    handleBrandChange() {
+      const params = {
+        unitType: 2,
+        manufacture: this.lubricantBrand,
+      };
+      if (this.lubricantBrand == "") {
+        this.lubricantModel = "";
+      }
+
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.lubricatingXXoptions = res.data;
+
+        this.$emit("update", {
+          key: "lubricantBrand",
+          value: this.lubricantBrand,
+        });
+      });
+    },
+    lube() {
+      this.$emit("update", {
+        key: "lubricantModel",
+        value: this.lubricantModel,
+      });
+    },
+
+    // 低速轴
+    LSSslow(item) {
+      console.log("lowSpeedList====", this.lowSpeedList);
+      const params = {
+        unitType: 1,
+        manufacture: item.bearingBrand,
+      };
+      console.log(params);
+      // 异步获取品牌和型号数据
+  
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.LSSbearingXXoptions = res.data;
+
+        // this.handleLowSpeedBearingsDtoList(); // 在数据更新后再调用方法
+      });
+    },
+
+    // 行星轮
+    XXLzhoucheng(item) {
+      console.log(item, this.planets);
+      const params = {
+        unitType: 1,
+        manufacture: item.bearingBrand,
+      };
+      console.log(this.planets);
+      this.handleUnitGearboxStructureDtoList("planets");
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.bearingXXoptions = res.data;
+        // item.bearingModel = "";
+      });
+    },
+    TYLzhoucheng(item) {
+      const params = {
+        unitType: 1,
+        manufacture: item.sunWheelBearingBrand,
+      };
+      console.log(params);
+      this.handleUnitGearboxStructureDtoList("planets");
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.bearingXXoptions = res.data;
+        item.sunWheelBearingModel = "";
+      });
+    },
+    // 结构
+    handleUnitGearboxStructureDtoList(listName) {
+      if (!listName) {
+        return false;
+      }
+      console.log(this[listName]);
+
+      const requiredFields = [
+        "gearboxStructure",
+        "planetaryGearGrade",
+        "uniqueKey",
+      ];
+
+      this[listName].forEach((item, index) => {
+        // 过滤掉空值属性（空字符串、null、undefined）
+        const plainItem = { ...item };
+        const sanitizedItem = {};
+        for (const key in plainItem) {
+          if (
+            plainItem[key] !== "" &&
+            plainItem[key] !== null &&
+            plainItem[key] !== undefined
+          ) {
+            sanitizedItem[key] = plainItem[key];
+          }
+        }
+
+        // 检查是否还有有效属性值
+        if (Object.keys(sanitizedItem).length === 0) {
+          console.log("Skipping empty sanitizedItem:", sanitizedItem);
+          return;
+        }
+
+        // 检查 sanitizedItem 是否只包含这三个字段
+        const isOnlyRequiredFields = Object.keys(sanitizedItem).every((field) =>
+          requiredFields.includes(field)
+        );
+
+        // 如果 sanitizedItem 只包含这三个字段，跳过当前项
+        if (isOnlyRequiredFields) {
+          console.log(
+            "Skipping sanitizedItem with only required fields:",
+            sanitizedItem
+          );
+          // 过滤掉 uniqueKey 为 "gearboxStructure-22" 的对象
+          const updatedArray = this.unitGearboxStructureDtoList.filter(
+            (item) =>
+              item.uniqueKey !==
+              `gearboxStructure-${sanitizedItem.gearboxStructure}${sanitizedItem.planetaryGearGrade}`
+          );
+          this.unitGearboxStructureDtoList = updatedArray;
+          console.log(this.unitGearboxStructureDtoList);
+          return false;
+        }
+
+        // 生成唯一标识符
+        const uniqueKey = `gearboxStructure-${sanitizedItem.gearboxStructure}${sanitizedItem.planetaryGearGrade}`;
+        console.log("Generated uniqueKey:", uniqueKey);
+
+        // 确保 uniqueKey 没有空格或意外字符，进行清理
+        const cleanedUniqueKey = uniqueKey.trim();
+
+        // 检查目标数组中是否已存在此唯一标识
+
+        // if (!exists) {
+        //   console.log("Adding new uniqueKey:", cleanedUniqueKey);
+        //   // 使用 Vue.set 来确保响应式更新，或者替换数组
+        //   this.unitGearboxStructureDtoList.push({
+        //     ...sanitizedItem,
+        //     uniqueKey: cleanedUniqueKey,
+        //   });
+        // } else {
+        //   console.log("Skipping existing uniqueKey:", cleanedUniqueKey);
+        // }
+        if (Array.isArray(this.unitGearboxStructureDtoList)) {
+          const exists = this.unitGearboxStructureDtoList.some(
+            (entry) => entry.uniqueKey === cleanedUniqueKey
+          );
+          console.log(sanitizedItem, plainItem, sanitizedItem.bearingModel);
+          if (exists) {
+            // 找到对应的项并更新
+            const index = this.unitGearboxStructureDtoList.findIndex(
+              (entry) => entry.uniqueKey === uniqueKey
+            );
+            this.unitGearboxStructureDtoList[index] = {
+              ...sanitizedItem,
+              uniqueKey,
+            };
+          } else {
+            // 如果不存在，直接 push 新对象
+            this.unitGearboxStructureDtoList.push({
+              ...sanitizedItem,
+              uniqueKey,
+            });
+          }
+        } else {
+          console.error(
+            "unitGearboxBearingsDtoList is not an array",
+            this.unitGearboxBearingsDtoList
+          );
+        }
+      });
+
+      console.log(
+        "Updated unitGearboxStructureDtoList (CHILUN):",
+        this.unitGearboxStructureDtoList
+      );
+
+      // Emit the updated data to parent component or to store
+      this.$emit("update", {
+        key: "unitGearboxStructureDtoList",
+        value: this.unitGearboxStructureDtoList,
+      });
+    },
+
+    DSrs(item) {
+      console.log(
+        "lowSpeedIntermediateShaftList====",
+        this.lowSpeedIntermediateShaftList,
+        item
+      );
+      const params = {
+        unitType: 1,
+        manufacture: item.bearingRsBrand,
+      };
+      console.log(params);
+      this.handleLowSpeedIntermediateBearingsDtoList();
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.RSbearingXXoptionsDS = res.data;
+        item.bearingRsModel = "";
+      });
+    },
+    filterEmptyValues(obj) {
+      return Object.fromEntries(
+        Object.entries(obj).filter(
+          ([_, value]) =>
+            !(value === "" || value === null || value === undefined)
+        )
+      );
+    },
+
+    // 结构化低速轴
+    handleLowSpeedBearingsDtoList(a) {
+      const lowSpeedList = JSON.parse(JSON.stringify(this[a]));
+      lowSpeedList.forEach((lowSpeedItem) => {
+        // 使用深拷贝转为普通对象
+        const plainItem = JSON.parse(JSON.stringify(lowSpeedItem));
+        // 过滤掉空值属性（空字符串、null、undefined）
+        const sanitizedItem = Object.entries(plainItem).reduce(
+          (acc, [key, value]) => {
+            if (value !== "" && value !== null && value !== undefined) {
+              acc[key] = value;
+            }
+            return acc;
+          },
+          {}
+        );
+        console.log(sanitizedItem, plainItem);
+
+        // 检查是否还有有效属性值
+        if (Object.keys(sanitizedItem).length === 0) {
+          console.log("Skipping empty sanitizedItem:", sanitizedItem);
+          return;
+        }
+
+        // 生成唯一标识符
+        const uniqueKey = `parallelWheelGrade-${sanitizedItem.parallelWheelGrade}`;
+        // 检查目标数组中是否已存在此唯一标识
+        if (Array.isArray(this.unitGearboxBearingsDtoList)) {
+          const exists = this.unitGearboxBearingsDtoList.some(
+            (entry) => entry.uniqueKey === uniqueKey
+          );
+          console.log(sanitizedItem, plainItem, sanitizedItem.bearingModel);
+          if (exists) {
+            // 找到对应的项并更新
+            const index = this.unitGearboxBearingsDtoList.findIndex(
+              (entry) => entry.uniqueKey === uniqueKey
+            );
+            this.unitGearboxBearingsDtoList[index] = {
+              ...sanitizedItem,
+              uniqueKey,
+            };
+          } else {
+            // 如果不存在，直接 push 新对象
+            this.unitGearboxBearingsDtoList.push({
+              ...sanitizedItem,
+              uniqueKey,
+            });
+          }
+        } else {
+          console.error(
+            "unitGearboxBearingsDtoList is not an array",
+            this.unitGearboxBearingsDtoList
+          );
+        }
+      });
+
+      console.log(
+        "Updated unitGearboxBearingsDtoList (LSSslow):",
+        this.unitGearboxBearingsDtoList
+      );
+      this.$emit("update", {
+        key: "unitGearboxBearingsDtoList",
+        value: this.unitGearboxBearingsDtoList,
+      });
+    },
+
+    // 结构化低速中间轴
+    handleLowSpeedIntermediateBearingsDtoList() {
+      const requiredFields = [
+        "gearboxBearingLevel",
+        "parallelWheelGrade",
+        "uniqueKey",
+      ];
+
+      this.lowSpeedIntermediateShaftList.forEach((shaftItem, index) => {
+        // 过滤掉空值属性（空字符串、null、undefined）
+        const plainItem = { ...shaftItem };
+        const sanitizedItem = {};
+        for (const key in plainItem) {
+          if (
+            plainItem[key] !== "" &&
+            plainItem[key] !== null &&
+            plainItem[key] !== undefined
+          ) {
+            sanitizedItem[key] = plainItem[key];
+          }
+        }
+        console.log("1111111111111111:", shaftItem);
+        console.log("2222222222222222:", sanitizedItem);
+        // 检查是否还有有效属性值
+        if (Object.keys(sanitizedItem).length === 0) {
+          console.log("Skipping empty sanitizedItem:", sanitizedItem);
+          return;
+        }
+
+        // 检查 sanitizedItem 是否只包含这三个字段: gearboxBearingLevel, parallelWheelGrade, uniqueKey
+        const isOnlyRequiredFields = Object.keys(sanitizedItem).every((field) =>
+          requiredFields.includes(field)
+        );
+
+        // 如果 sanitizedItem 只包含这三个字段，跳过当前项
+        if (isOnlyRequiredFields) {
+          console.log(
+            "Skipping sanitizedItem with only required fields:",
+            sanitizedItem
+          );
+          const updatedArray = this.unitGearboxStructureDtoList.filter(
+            (item) =>
+              item.uniqueKey !==
+              `parallelWheelGrade-${sanitizedItem.parallelWheelGrade}${sanitizedItem.gearboxBearingLevel}`
+          );
+          this.unitGearboxBearingsDtoList = updatedArray;
+          console.log(this.unitGearboxBearingsDtoList);
+          return;
+        }
+
+        // 生成唯一标识符
+        const uniqueKey = `parallelWheelGrade-${sanitizedItem.parallelWheelGrade}${sanitizedItem.gearboxBearingLevel}`;
+
+        // 检查目标数组中是否已存在此唯一标识
+        // 检查目标数组中是否已存在此唯一标识
+        if (Array.isArray(this.unitGearboxBearingsDtoList)) {
+          const exists = this.unitGearboxBearingsDtoList.some(
+            (entry) => entry.uniqueKey === uniqueKey
+          );
+          console.log(sanitizedItem, plainItem, sanitizedItem.bearingModel);
+          if (exists) {
+            // 找到对应的项并更新
+            const index = this.unitGearboxBearingsDtoList.findIndex(
+              (entry) => entry.uniqueKey === uniqueKey
+            );
+            this.unitGearboxBearingsDtoList[index] = {
+              ...sanitizedItem,
+              uniqueKey,
+            };
+          } else {
+            // 如果不存在，直接 push 新对象
+            this.unitGearboxBearingsDtoList.push({
+              ...sanitizedItem,
+              uniqueKey,
+            });
+          }
+        } else {
+          console.error(
+            "unitGearboxBearingsDtoList is not an array",
+            this.unitGearboxBearingsDtoList
+          );
+        }
+      });
+
+      console.log(
+        "Updated unitGearboxBearingsDtoList (DSrs):",
+        this.unitGearboxBearingsDtoList
+      );
+      this.$emit("update", {
+        key: "unitGearboxBearingsDtoList",
+        value: this.unitGearboxBearingsDtoList,
+      });
+    },
+    // 结构化高速轴
+    handleHighSpeedBearingsDtoList() {
+      this.highSpeedShaftList.forEach((lowSpeedItem) => {
+        // 过滤掉空值属性（空字符串、null、undefined）
+        const plainItem = { ...lowSpeedItem };
+        const sanitizedItem = {};
+        for (const key in plainItem) {
+          if (
+            plainItem[key] !== "" &&
+            plainItem[key] !== null &&
+            plainItem[key] !== undefined
+          ) {
+            sanitizedItem[key] = plainItem[key];
+          }
+        }
+
+        // 检查是否还有有效属性值
+        if (Object.keys(sanitizedItem).length === 0) {
+          console.log("Skipping empty sanitizedItem:", sanitizedItem);
+          return;
+        }
+
+        // 生成唯一标识符
+        const uniqueKey = `parallelWheelGrade-${sanitizedItem.parallelWheelGrade}`;
+
+        // 检查目标数组中是否已存在此唯一标识
+        // 检查目标数组中是否已存在此唯一标识
+        if (Array.isArray(this.unitGearboxBearingsDtoList)) {
+          const exists = this.unitGearboxBearingsDtoList.some(
+            (entry) => entry.uniqueKey === uniqueKey
+          );
+          console.log(sanitizedItem, plainItem, sanitizedItem.bearingModel);
+          if (exists) {
+            // 找到对应的项并更新
+            const index = this.unitGearboxBearingsDtoList.findIndex(
+              (entry) => entry.uniqueKey === uniqueKey
+            );
+            this.unitGearboxBearingsDtoList[index] = {
+              ...sanitizedItem,
+              uniqueKey,
+            };
+          } else {
+            // 如果不存在，直接 push 新对象
+            this.unitGearboxBearingsDtoList.push({
+              ...sanitizedItem,
+              uniqueKey,
+            });
+          }
+        } else {
+          console.error(
+            "unitGearboxBearingsDtoList is not an array",
+            this.unitGearboxBearingsDtoList
+          );
+        }
+      });
+
+      console.log(
+        "Updated unitGearboxBearingsDtoList (High):",
+        this.unitGearboxBearingsDtoList
+      );
+      this.$emit("update", {
+        key: "unitGearboxBearingsDtoList",
+        value: this.unitGearboxBearingsDtoList,
+      });
+    },
+    DSgs(item) {
+      const params = {
+        unitType: 1,
+        manufacture: item.bearingGsBrand,
+      };
+      console.log(params);
+      this.handleLowSpeedIntermediateBearingsDtoList();
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.GSbearingXXoptions = res.data;
+
+        item.bearingGsModel = "";
+      });
+    },
+    GSrs(item) {
+      const params = {
+        unitType: 1,
+        manufacture: item.bearingRsBrand,
+      };
+      console.log(params);
+      this.handleHighSpeedBearingsDtoList();
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.RSbearingXXoptions = res.data;
+      });
+    },
+
+    GSgs(item) {
+      const params = {
+        unitType: 1,
+        manufacture: item.bearingGsBrand,
+      };
+      console.log(params);
+      this.handleHighSpeedBearingsDtoList();
+      getBrandModelNameOrModelNumber(params).then((res) => {
+        this.GSbearingXXoptions = res.data;
+
+        // item.bearingGsModel = "";
+      });
+    },
+    addPlanet() {
+      const newPlanetaryGearGrade = this.planets.length + 1;
+      if (this.planets.length < 3) {
+        // 深拷贝默认值并推入 planets 数组
+        const defaultPlanet = {
+          planetWheelCount: "",
+          planetWheelTeethCount: "",
+          sunWheelTeethCount: "",
+          gearRingTeethCount: "",
+          bearingBrand: "", // 行星轮轴承品牌
+          bearingModel: "", // 行星轮轴承型号
+          sunWheelBearingBrand: "", // 太阳轮轴承品牌
+          sunWheelBearingModel: "", // 太阳轮轴承型号
+          gearboxStructure: 1,
+          planetaryGearGrade: newPlanetaryGearGrade,
+        };
+        this.planets.push({ ...defaultPlanet });
+      }
+    },
+
+    delPlanet() {
+      if (this.planets.length > 1) {
+        this.planets.pop();
+      }
+      // 过滤掉 uniqueKey 为 "gearboxStructure-22" 的对象
+      const updatedArray = this.unitGearboxStructureDtoList.filter(
+        (item) =>
+          item.uniqueKey !== `gearboxStructure-1${this.planets.length + 1}`
+      );
+      this.unitGearboxStructureDtoList = updatedArray;
+      this.$emit("update", {
+        key: "unitGearboxStructureDtoList",
+        value: this.unitGearboxStructureDtoList,
+      });
+      console.log(this.unitGearboxStructureDtoList);
+    },
+    validateInput(value, index, field, structureName, listName) {
+      const validValue = value.replace(/[^0-9]/g, "");
+      if (validValue !== value) {
+        this.$message({
+          message: "只能输入数字",
+          type: "warning",
+          duration: 2000,
+        });
+      }
+      this[listName][index][field] = Number(validValue) || "";
+      structureName && this[structureName](listName);
+    },
+
+    addparallel() {
+      const newPlanetaryGearGrade = this.parallel.length + 1;
+      if (this.parallel.length < 3) {
+        this.parallel.push({
+          largeGearTeethCount: "",
+          smallGearTeethCount: "",
+          gearboxStructure: 2,
+          planetaryGearGrade: newPlanetaryGearGrade,
+        });
+      }
+    },
+    delparallel() {
+      if (this.parallel.length > 1) {
+        this.parallel.pop();
+      }
+      // 过滤掉 uniqueKey 为 "gearboxStructure-22" 的对象
+      const updatedArray = this.unitGearboxStructureDtoList.filter(
+        (item) =>
+          item.uniqueKey !== `gearboxStructure-2${this.parallel.length + 1}`
+      );
+      this.unitGearboxStructureDtoList = updatedArray;
+      this.$emit("update", {
+        key: "unitGearboxStructureDtoList",
+        value: this.unitGearboxStructureDtoList,
+      });
+      console.log(this.unitGearboxStructureDtoList);
+    },
+
+    addLSS() {
+      if (this.lowSpeedList.length < 2) {
+        this.lowSpeedList.push({ lubricantBrand: "", lubricantModel: "" });
+      }
+    },
+    delLSS() {
+      if (this.lowSpeedList.length > 1) {
+        this.lowSpeedList.pop();
+      }
+    },
+    addslowly() {
+      if (this.lowSpeedIntermediateShaftList.length >= 2) {
+        this.$message({
+          type: "warning",
+          message: "只能添加最多两项!",
+        });
+        return;
+      }
+
+      const newGearboxBearingLevel =
+        this.lowSpeedIntermediateShaftList.length + 1;
+      // 添加新项到数组
+      this.lowSpeedIntermediateShaftList.push({
+        gearRingTeethCount: "",
+        bearingRsBrand: "",
+        bearingRsModel: "",
+        bearingGsBrand: "",
+        bearingGsModel: "",
+        gearboxBearingLevel: newGearboxBearingLevel, // 动态增加的字段
+        parallelWheelGrade: 2,
+      });
+    },
+
+    delslowly() {
+      if (this.lowSpeedIntermediateShaftList.length > 1) {
+        this.lowSpeedIntermediateShaftList.pop();
+      }
+      // 过滤掉 uniqueKey 为 "gearboxStructure-22" 的对象
+      const updatedArray = this.unitGearboxBearingsDtoList.filter(
+        (item) =>
+          item.uniqueKey !==
+          `parallelWheelGrade-${sanitizedItem.parallelWheelGrade}${this.lowSpeedIntermediateShaftList.length.gearboxBearingLevel}`
+      );
+      this.unitGearboxBearingsDtoList = updatedArray;
+      this.$emit("update", {
+        key: "unitGearboxBearingsDtoList",
+        value: this.unitGearboxBearingsDtoList,
+      });
+      console.log(this.unitGearboxBearingsDtoList);
+    },
+    addhigh() {
+      if (this.highSpeedShaftList.length < 2) {
+        this.highSpeedShaftList.push({
+          gearRingTeethCount: "",
+          bearingRsBrand: null,
+          bearingRsModel: null,
+          bearingGsBrand: null,
+          bearingGsModel: null,
+        });
+      }
+    },
+    delhigh() {
+      if (this.highSpeedShaftList.length > 1) {
+        this.highSpeedShaftList.pop();
+      }
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.CLX {
+  .message {
+    display: flex;
+    flex-wrap: wrap;
+    .message-BOX {
+      width: 100%;
+      display: flex;
+      flex-wrap: wrap;
+      .message-DIV {
+        width: 25%;
+        display: flex;
+
+        margin-bottom: 20px;
+        justify-content: space-between;
+        p {
+          //   margin-right: 10px;
+          width: 140px;
+          line-height: 40px;
+          height: 40px;
+          text-align: right;
+        }
+        .el-input {
+          width: 223px;
+        }
+      }
+    }
+    .message-DIV {
+      width: 25%;
+      display: flex;
+      margin-bottom: 20px;
+      justify-content: space-between;
+      p {
+        //   margin-right: 10px;
+        width: 140px;
+        line-height: 40px;
+        height: 40px;
+        text-align: right;
+      }
+      .el-input {
+        width: 223px;
+      }
+    }
+    .caption {
+      width: 100%;
+      display: flex;
+      justify-content: space-between;
+      padding: 0 10px;
+      height: 30px;
+      line-height: 30px;
+      color: #ffffff;
+      margin-bottom: 20px;
+      .el-icon-plus:before {
+        font-size: 20px;
+      }
+      .capSpan1 {
+        background: rgb(101, 101, 101);
+        width: 140px;
+        padding-left: 10px;
+      }
+    }
+  }
+  .locationP {
+    text-align: right;
+    font-size: 24px;
+    font-weight: 600;
+  }
+}
+</style>

src/views/ledger/componentBJ/chilunxiang.vue

@@ -47,8 +47,9 @@
       <p class="caption">
         <span class="capSpan1">LSS低速轴</span>
       </p>
+      <!-- {{ lowSpeedList }}{{ clxZC }} -->
       <div
-        v-for="(item, index) in lowSpeedList .length > 0 ? lowSpeedList : [{}]"
+        v-for="(item, index) in lowSpeedList"
         :key="index"
         class="message-BOX"
       >
@@ -75,6 +76,7 @@
             clearable
             v-model="item.bearingModel"
             placeholder="请选择"
+            @change="handleLowSpeedBearingsDtoList('lowSpeedList')"
             :disabled="!item.bearingBrand"
           >
             <el-option
@@ -94,7 +96,11 @@
       <i @click="addPlanet" class="el-icon-plus"></i>
       <i v-if="planets.length > 1" @click="delPlanet" class="el-icon-minus"></i>
     </p>
-    <div v-for="(item, index) in planets.length > 0 ? planets : [{}] " :key="index" class="message">
+    <div
+      v-for="(item, index) in planets.length > 0 ? planets : [{}]"
+      :key="index"
+      class="message"
+    >
       <p class="caption">
         <span class="capSpan1">{{ `${levelNames[index]}行星轮结构` }}</span>
       </p>
@@ -126,7 +132,7 @@
             placeholder="请选择"
           >
             <el-option
-              v-for="item in bearingXXoptions"
+              v-for="item in item.XXLbearingXXoptions"
               :key="item"
               :label="item"
               :value="item"
@@ -154,12 +160,12 @@
       <div class="message-DIV">
         <p>太阳轮齿数：</p>
         <el-input
-          v-model="item.suntooth"
+          v-model="item.sunWheelTeethCount"
           @input="
             validateInput(
               $event,
               index,
-              'suntooth',
+              'sunWheelTeethCount',
               'handleUnitGearboxStructureDtoList',
               'planets'
             )
@@ -226,7 +232,7 @@
             placeholder="请选择"
           >
             <el-option
-              v-for="item in bearingXXoptions"
+              v-for="item in item.TYLbearingXXoptions"
               :key="item"
               :label="item"
               :value="item"
@@ -247,7 +253,7 @@
       ></i>
     </p>
     <div
-      v-for="(item, index) in parallel.length > 0 ? parallel : [{}]"
+      v-for="(item, index) in parallel"
       :key="`parallel-${index}`"
       class="message"
     >
@@ -303,7 +309,9 @@
       </p>
 
       <div
-        v-for="(item, index) in lowSpeedIntermediateShaftList.length > 0 ? lowSpeedIntermediateShaftList : [{}]"
+        v-for="(item, index) in lowSpeedIntermediateShaftList.length > 0
+          ? lowSpeedIntermediateShaftList
+          : [{}]"
         :key="index"
         class="message-BOX"
       >
@@ -334,7 +342,7 @@
             @change="handleLowSpeedIntermediateBearingsDtoList"
           >
             <el-option
-              v-for="item in bearingXXoptions"
+              v-for="item in item.DSRSbearingXXoptions"
               :key="item"
               :label="item"
               :value="item"
@@ -369,7 +377,7 @@
             @change="handleLowSpeedIntermediateBearingsDtoList"
           >
             <el-option
-              v-for="item in bearingXXoptions"
+              v-for="item in item.DSGSbearingXXoptions"
               :key="item"
               :label="item"
               :value="item"
@@ -407,7 +415,9 @@
       </p>
 
       <div
-        v-for="(item, index) in highSpeedShaftList.length > 0 ? highSpeedShaftList : [{}]"
+        v-for="(item, index) in highSpeedShaftList.length > 0
+          ? highSpeedShaftList
+          : [{}]"
         :key="index"
         class="message-BOX"
       >
@@ -438,7 +448,7 @@
             @change="handleHighSpeedBearingsDtoList"
           >
             <el-option
-              v-for="item in bearingXXoptions"
+              v-for="item in GSbearingXXoptionsRS"
               :key="item"
               :label="item"
               :value="item"
@@ -473,7 +483,7 @@
             @change="handleHighSpeedBearingsDtoList"
           >
             <el-option
-              v-for="item in bearingXXoptions"
+              v-for="item in GSbearingXXoptionsGS"
               :key="item"
               :label="item"
               :value="item"
@@ -542,7 +552,7 @@ export default {
         {
           planetWheelCount: "",
           planetWheelTeethCount: "",
-          suntooth: "",
+          sunWheelTeethCount: "",
           gearRingTeethCount: "",
           bearingBrand: "",
           bearingModel: "",
@@ -556,8 +566,8 @@ export default {
       //
       parallel: [
         {
-          largeGearTeethCount: "",
-          smallGearTeethCount: "",
+          largeGearTeethCount: undefined,
+          smallGearTeethCount: undefined,
           gearboxStructure: 2,
           planetaryGearGrade: 1,
         },
@@ -585,43 +595,168 @@ export default {
           parallelWheelGrade: 3,
         },
       ],
+      initialParallel: [],
+
+      initialPlanets: [],
+
+      initialLowSpeedIntermediateShaftList: [],
+
+      initialHighSpeedShaftList: [],
+
+      initialLowSpeedList: [],
+
       lubricatingXXoptions: [],
       bearingXXoptions: [],
+
+      DiShubearingXXoptions: [],
+
+      GSbearingXXoptionsGS: [],
+      GSbearingXXoptionsRS: [],
+
+      DSRSbearingXXoptions: [],
+      DSGSbearingXXoptions: [],
+
       unitGearboxBearingsDtoList: [],
       unitGearboxStructureDtoList: [],
+
+      XXLbearingXXoptions: [],
+      TYLbearingXXoptions: [],
+
+      lastBearingRsBrand: null,
+      lastBearingGsBrand: null,
+
+      dishuRsBrand: null,
+      dishuGsBrand: null,
+
+      XXLBrand: null,
+      TYLBrand: null,
     };
   },
   watch: {
-    lowSpeedList: {
+    // 监听 unitGearDto 对象的变化
+    unitGearDto(newVal, oldVal) {
+      console.log("unitGearDto 发生变化:", newVal, oldVal);
+      if (newVal && typeof newVal === "object") {
+        this.initializeData(newVal);
+      } else {
+        console.warn("unitGearDto 为空或无效:", newVal);
+      }
+      // 处理变化逻辑
+    },
+    lubricantBrand(newValue) {
+      // 只有当 lubricantBrand 有值时才触发接口请求
+      if (newValue) {
+        this.handleBrandChange(newValue);
+      }
+    },
+
+    // 行星轮
+    planets: {
       handler(newValue, oldValue) {
-        console.log("lowSpeedList======== changed:", newValue);
-        // 当 lowSpeedList 变化时调用相应的逻辑
-        this.$nextTick(() => {
-          this.handleLowSpeedBearingsDtoList("lowSpeedList");
+        newValue.forEach((item) => {
+          if (item.bearingBrand) {
+          } else {
+            item.bearingModel = "";
+          }
+          if (item.sunWheelBearingBrand) {
+          } else {
+            item.sunWheelBearingModel = "";
+          }
         });
       },
       deep: true, // 启用深度监听
     },
-    unitGearboxBearingsDtoList: function (newValue, oldValue) {
-      console.log("unitGearboxBearingsDtoList changed:", newValue);
-      // 在这里可以调用你需要处理的逻辑，比如调用 handleLowSpeedBearingsDtoList 方法
+
+    // 高速轴
+    highSpeedShaftList: {
+      handler(newValue, oldValue) {
+        newValue.forEach((item) => {
+          if (item.bearingRsBrand) {
+          } else {
+            item.bearingRsModel = "";
+          }
+          if (item.bearingGsBrand) {
+          } else {
+            item.bearingGsModel = "";
+          }
+        });
+      },
+      deep: true, // 启用深度监听
     },
-    unitGearDto: {
-      immediate: true, // 初始化时触发
-      deep: true, // 深度监听
-      handler(newVal) {
-        if (newVal && typeof newVal === "object") {
-          this.initializeData(newVal);
-        } else {
-          console.warn("unitGearDto 为空或无效:", newVal);
-        }
+    // 低速中间
+    lowSpeedIntermediateShaftList: {
+      handler(newValue, oldValue) {
+        newValue.forEach((item) => {
+          if (item.bearingRsBrand) {
+          } else {
+            item.bearingRsModel = "";
+          }
+          if (item.bearingGsBrand) {
+          } else {
+            item.bearingGsModel = "";
+          }
+        });
       },
+      deep: true, // 启用深度监听
     },
+
+    // 行星轮
   },
+
+  mounted() {
+    // 编辑回显时，如果有值，自动触发接口调用
+    if (this.lubricantBrand) {
+      this.handleBrandChange(this.lubricantBrand); // 触发接口调用，保留原值
+    }
+    // 高速轴
+    this.highSpeedShaftList.forEach((item) => {
+      // 如果 bearingRsBrand 有值，调用接口获取型号
+      if (item.bearingRsBrand) {
+        this.GSrs(item);
+      } // 如果 bearingGsBrand 有值，调用接口获取型号
+
+      if (item.bearingGsBrand) {
+        this.GSgs(item);
+      }
+    });
+    // 低速中速
+    this.lowSpeedIntermediateShaftList.forEach((item) => {
+      // 如果 bearingRsBrand 有值，调用接口获取型号
+      if (item.bearingRsBrand) {
+        this.DSrs(item);
+      } // 如果 bearingGsBrand 有值，调用接口获取型号
+
+      if (item.bearingGsBrand) {
+        this.DSgs(item);
+      }
+    });
+    // 行星轮
+    this.planets.forEach((item) => {
+      // 如果 bearingRsBrand 有值，调用接口获取型号
+      if (item.bearingBrand) {
+        this.XXLzhoucheng(item);
+      } // 如果 bearingGsBrand 有值，调用接口获取型号
+
+      if (item.sunWheelBearingBrand) {
+        this.TYLzhoucheng(item);
+      }
+    });
+  },
+
   created() {
     if (this.unitGearDto && typeof this.unitGearDto === "object") {
       this.initializeData(this.unitGearDto);
     }
+    // 使用深拷贝保存初始化数据
+    this.initialParallel = JSON.parse(JSON.stringify(this.parallel)); // 深拷贝
+    this.initialPlanets = JSON.parse(JSON.stringify(this.planets)); // 深拷贝
+    this.initialLowSpeedIntermediateShaftList = JSON.parse(
+      JSON.stringify(this.lowSpeedIntermediateShaftList)
+    ); // 深拷贝
+    this.initialHighSpeedShaftList = JSON.parse(
+      JSON.stringify(this.highSpeedShaftList)
+    ); // 深拷贝
+    this.initialLowSpeedList = JSON.parse(JSON.stringify(this.lowSpeedList)); // 深拷贝
   },
   methods: {
     initializeData(newVal = {}) {
@@ -631,8 +766,23 @@ export default {
       }
       this.lubricantBrand = newVal?.lubricantBrand || "";
       this.lubricantModel = newVal?.lubricantModel || "";
-      this.distributeByParallelWheelGrade(newVal.unitGearboxBearingsList);
-      this.distributeDataByStructureAndGrade(newVal.unitGearboxStructureList);
+      if (
+        Array.isArray(newVal.unitGearboxBearingsList) &&
+        newVal.unitGearboxBearingsList.length > 0
+      ) {
+        this.distributeByParallelWheelGrade(newVal.unitGearboxBearingsList);
+      } else {
+        console.warn("unitGearboxBearingsList 为空或不是数组");
+      }
+
+      if (
+        Array.isArray(newVal.unitGearboxStructureList) &&
+        newVal.unitGearboxStructureList.length > 0
+      ) {
+        this.distributeDataByStructureAndGrade(newVal.unitGearboxStructureList);
+      } else {
+        console.warn("unitGearboxStructureList 为空或不是数组");
+      }
     },
     distributeByParallelWheelGrade(data) {
       this.lowSpeedList = [];
@@ -655,38 +805,97 @@ export default {
         }
       });
 
-      // return {
-      //   lowSpeedList,
-      //   lowSpeedIntermediateShaftList,
-      //   highSpeedShaftList,
-      // };
+      // 如果对应的数组没有数据，则赋予默认值
+      if (this.lowSpeedList.length === 0) {
+        this.lowSpeedList = [
+          {
+            gearRingTeethCount: "",
+            bearingRsBrand: "",
+            bearingRsModel: "",
+            bearingGsBrand: "",
+            bearingGsModel: "",
+            gearboxBearingLevel: 1,
+            parallelWheelGrade: 2,
+          },
+        ];
+      }
+
+      if (this.lowSpeedIntermediateShaftList.length === 0) {
+        this.lowSpeedIntermediateShaftList = [
+          {
+            gearRingTeethCount: "",
+            bearingRsBrand: "",
+            bearingRsModel: "",
+            bearingGsBrand: "",
+            bearingGsModel: "",
+            gearboxBearingLevel: 1,
+            parallelWheelGrade: 2,
+          },
+        ];
+      }
+
+      if (this.highSpeedShaftList.length === 0) {
+        this.highSpeedShaftList = [
+          {
+            gearRingTeethCount: "",
+            bearingRsBrand: "",
+            bearingRsModel: "",
+            bearingGsBrand: "",
+            bearingGsModel: "",
+            parallelWheelGrade: 3,
+          },
+        ];
+      }
     },
     distributeDataByStructureAndGrade(data) {
       this.planets = [];
       this.parallel = [];
-      console.log(data, "-=-==-=");
-      const planets = [];
-      const parallel = [];
-      // 分配数据到planets和parallel
-      // 分配数据到planets和parallel
       data.forEach((item) => {
-        if (item.gearboxStructure === 1) {
-          planets.push(item);
-        } else if (item.gearboxStructure === 2) {
-          parallel.push(item);
+        switch (item.gearboxStructure) {
+          case 1:
+            this.planets.push(item);
+            break;
+          case 2:
+            this.parallel.push(item);
+            break;
+          default:
+            break;
         }
       });
+      console.log(this.planets, "-=-==-=", this.parallel.length === 0);
+
+      // 如果对应的数组没有数据，则赋予默认值
+      if (this.planets.length === 0) {
+        this.planets = [
+          {
+            planetWheelCount: "",
+            planetWheelTeethCount: "",
+            sunWheelTeethCount: "",
+            gearRingTeethCount: "",
+            bearingBrand: "",
+            bearingModel: "",
+            sunWheelBearingBrand: "",
+            sunWheelBearingModel: "",
+            gearboxStructure: 1,
+            planetaryGearGrade: 1,
+          },
+        ];
+      }
+
+      if (this.parallel.length === 0) {
+        this.parallel = [
+          {
+            largeGearTeethCount: undefined,
+            smallGearTeethCount: undefined,
+            gearboxStructure: 2,
+            planetaryGearGrade: 1,
+          },
+        ];
+      }
 
       // 对planets和parallel数组按planetaryGearGrade排序
-      planets.sort((a, b) => a.planetaryGearGrade - b.planetaryGearGrade);
-      parallel.sort((a, b) => a.planetaryGearGrade - b.planetaryGearGrade);
-      console.log(planets, "-=-==-=", parallel);
-      this.planets = planets;
-      this.parallel = parallel;
-      // return {
-      //   planets,
-      //   parallel,
-      // };
+      this.planets.sort((a, b) => a.planetaryGearGrade - b.planetaryGearGrade);
+      this.parallel.sort((a, b) => a.planetaryGearGrade - b.planetaryGearGrade);
     },
     // 润滑油
     handleBrandChange() {
@@ -694,7 +903,10 @@ export default {
         unitType: 2,
         manufacture: this.lubricantBrand,
       };
-      this.lubricantModel = "";
+      if (this.lubricantBrand == "") {
+        this.lubricantModel = "";
+      }
+
       getBrandModelNameOrModelNumber(params).then((res) => {
         this.lubricatingXXoptions = res.data;
         this.$emit("update", {
@@ -712,34 +924,38 @@ export default {
 
     // 低速轴
     LSSslow(item) {
-      console.log("lowSpeedList====", this.lowSpeedList);
       const params = {
         unitType: 1,
         manufacture: item.bearingBrand,
       };
-
-      console.log(params);
-
       // 异步获取品牌和型号数据
       getBrandModelNameOrModelNumber(params).then((res) => {
         this.bearingXXoptions = res.data;
-        item.bearingModel = ""; // 先清空模型
-        // this.handleLowSpeedBearingsDtoList(); // 在数据更新后再调用方法
+        this.handleLowSpeedBearingsDtoList("lowSpeedList"); // 在数据更新后再调用方法
       });
     },
-
     // 行星轮
     XXLzhoucheng(item) {
-      console.log(item, this.planets);
       const params = {
         unitType: 1,
         manufacture: item.bearingBrand,
       };
-      console.log(this.planets);
+
       this.handleUnitGearboxStructureDtoList("planets");
       getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        item.bearingModel = "";
+        this.$set(item, "XXLbearingXXoptions", res.data);
+        if (this.XXLBrand !== null && item.bearingBrand !== this.XXLBrand) {
+          // 如果 bearingRsBrand 改变了，触发清空操作
+          this.clearBearingGsModel(
+            this.planets,
+            "planets",
+            item.bearingBrand, // 传递当前项的 bearingRsBrand
+            "bearingBrand",
+            "bearingModel"
+          );
+        }
+
+        this.XXLBrand = item.bearingBrand;
       });
     },
     TYLzhoucheng(item) {
@@ -750,8 +966,22 @@ export default {
       console.log(params);
       this.handleUnitGearboxStructureDtoList("planets");
       getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        item.sunWheelBearingModel = "";
+        this.$set(item, "TYLbearingXXoptions", res.data);
+        if (
+          this.TYLBrand !== null &&
+          item.sunWheelBearingBrand !== this.TYLBrand
+        ) {
+          // 如果 bearingRsBrand 改变了，触发清空操作
+          this.clearBearingGsModel(
+            this.planets,
+            "planets",
+            item.sunWheelBearingBrand, // 传递当前项的 bearingRsBrand
+            "sunWheelBearingBrand",
+            "sunWheelBearingModel"
+          );
+        }
+
+        this.TYLBrand = item.sunWheelBearingBrand;
       });
     },
     // 结构
@@ -870,21 +1100,39 @@ export default {
     },
 
     DSrs(item) {
-      console.log(
-        "lowSpeedIntermediateShaftList====",
-        this.lowSpeedIntermediateShaftList,
-        item
-      );
       const params = {
         unitType: 1,
         manufacture: item.bearingRsBrand,
       };
-      console.log(params);
+      // 处理低速中间轴承列表
       this.handleLowSpeedIntermediateBearingsDtoList();
-      getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        item.bearingRsModel = "";
-      });
+      // 发起接口请求
+      getBrandModelNameOrModelNumber(params)
+        .then((res) => {
+          // item.DSRSbearingXXoptions = res.data; // 更新品牌选择项
+
+          this.$set(item, "DSRSbearingXXoptions", res.data);
+          // 判断 bearingRsBrand 是否发生变化，且 lastBearingRsBrand 不为 null
+          if (
+            this.dishuRsBrand !== null &&
+            item.bearingRsBrand !== this.dishuRsBrand
+          ) {
+            // 如果 bearingRsBrand 改变了，触发清空操作
+            this.clearBearingGsModel(
+              this.lowSpeedIntermediateShaftList,
+              "lowSpeedIntermediateShaftList",
+              item.bearingRsBrand, // 传递当前项的 bearingRsBrand
+              "bearingRsBrand",
+              "bearingRsModel"
+            );
+          }
+
+          // 更新 lastBearingRsBrand 为当前值
+          this.dishuRsBrand = item.bearingRsBrand;
+        })
+        .catch((error) => {
+          console.error("请求失败:", error); // 错误处理
+        });
     },
     filterEmptyValues(obj) {
       return Object.fromEntries(
@@ -951,10 +1199,6 @@ export default {
         }
       });
 
-      console.log(
-        "Updated unitGearboxBearingsDtoList (LSSslow):",
-        this.unitGearboxBearingsDtoList
-      );
       this.$emit("update", {
         key: "unitGearboxBearingsDtoList",
         value: this.unitGearboxBearingsDtoList,
@@ -1124,26 +1368,74 @@ export default {
         unitType: 1,
         manufacture: item.bearingGsBrand,
       };
-      console.log(params);
+
       this.handleLowSpeedIntermediateBearingsDtoList();
       getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        item.bearingGsModel = "";
+        // item.DSGSbearingXXoptions = res.data;
+        this.$set(item, "DSGSbearingXXoptions", res.data);
+        // 判断 bearingRsBrand 是否发生变化，且 lastBearingRsBrand 不为 null
+        if (
+          this.dishuGsBrand !== null &&
+          item.bearingGsBrand !== this.dishuGsBrand
+        ) {
+          // 如果 bearingRsBrand 改变了，触发清空操作
+          this.clearBearingGsModel(
+            this.lowSpeedIntermediateShaftList,
+            "lowSpeedIntermediateShaftList",
+            item.bearingGsBrand, // 传递当前项的 bearingRsBrand
+            "bearingGsBrand",
+            "bearingGsModel"
+          );
+        }
+
+        // 更新 lastBearingRsBrand 为当前值
+        this.dishuGsBrand = item.bearingGsBrand;
       });
     },
+    // 第一级下拉改变时 清空二级回显
+    clearBearingGsModel(
+      list,
+      updataListName,
+      changeValue,
+      brandName,
+      brandModel
+    ) {
+      console.log(changeValue);
+      list.forEach((item) => {
+        if (item[brandName] === changeValue) {
+          item[brandModel] = ""; // 清空 bearingRsModel
+        }
+      });
+
+      // 将修改后的 list 重新赋值给 this.highSpeedShaftList
+      this[updataListName] = [...list]; // 使用展开运算符来创建新数组，以触发 Vue 响应式更新
+      console.log("this.highSpeedShaftList===", this.highSpeedShaftList);
+    },
     GSrs(item) {
       const params = {
         unitType: 1,
         manufacture: item.bearingRsBrand,
       };
-      console.log(params);
       this.handleHighSpeedBearingsDtoList();
+      // 发起接口请求
       getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        item.bearingRsModel = "";
+        this.GSbearingXXoptionsRS = res.data;
+        if (
+          this.lastBearingRsBrand !== null &&
+          item.bearingRsBrand !== this.lastBearingRsBrand
+        ) {
+          // 如果 bearingRsBrand 改变了，触发清空操作
+          this.clearBearingGsModel(
+            this.highSpeedShaftList,
+            "highSpeedShaftList",
+            item.bearingRsBrand,
+            "bearingRsBrand",
+            "bearingRsModel"
+          );
+        }
+        this.lastBearingRsBrand = item.bearingRsBrand;
       });
     },
-
     GSgs(item) {
       const params = {
         unitType: 1,
@@ -1152,8 +1444,20 @@ export default {
       console.log(params);
       this.handleHighSpeedBearingsDtoList();
       getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        item.bearingGsModel = "";
+        this.GSbearingXXoptionsGS = res.data;
+        if (
+          this.lastBearingGsBrand !== null &&
+          item.bearingGsBrand !== this.lastBearingGsBrand
+        ) {
+          this.clearBearingGsModel(
+            this.highSpeedShaftList,
+            "highSpeedShaftList",
+            item.bearingGsBrand,
+            "bearingGsBrand",
+            "bearingGsModel"
+          );
+        }
+        this.lastBearingGsBrand = item.bearingGsBrand;
       });
     },
     addPlanet() {
@@ -1163,7 +1467,7 @@ export default {
         const defaultPlanet = {
           planetWheelCount: "",
           planetWheelTeethCount: "",
-          suntooth: "",
+          sunWheelTeethCount: "",
           gearRingTeethCount: "",
           bearingBrand: "", // 行星轮轴承品牌
           bearingModel: "", // 行星轮轴承型号
@@ -1193,6 +1497,7 @@ export default {
       console.log(this.unitGearboxStructureDtoList);
     },
     validateInput(value, index, field, structureName, listName) {
+      console.log(value, index, field, structureName, listName);
       const validValue = value.replace(/[^0-9]/g, "");
       if (validValue !== value) {
         this.$message({

src/views/ledger/componentBJ/fadianji.vue

@@ -126,7 +126,7 @@
           placeholder="请选择"
         >
           <el-option
-            v-for="item in bearingXXoptions"
+            v-for="item in notbearingXXoptions"
             :key="item"
             :label="item"
             :value="item"
@@ -161,19 +161,19 @@ export default {
   },
   data() {
     return {
-      
       form: {},
       lubricantBrand: "",
       lubricantModel: "",
       polePairs: "",
-      coolingMethod: "",
-      driveEndBearingBrand: "", 
+      coolingMethod: null,
+      driveEndBearingBrand: "",
       driveEndBearingModel: "",
       nonDriveEndBearingBrand: "",
       nonDriveEndBearingModel: "",
       coolingoptions: [],
       lubricatingXXoptions: [],
       bearingXXoptions: [],
+      notbearingXXoptions: [],
     };
   },
   created() {
@@ -193,7 +193,77 @@ export default {
         }
       },
     },
+
+    lubricantBrand(newValue, oldValue) {
+      // 只有当 lubricantBrand 有值时才触发接口请求
+
+      if (newValue !== oldValue) {
+        if (newValue) {
+          this.lubricantModel = "";
+          this.dynamo(newValue); // 调用方法
+        } else {
+          // 如果新值为空，可以执行其他操作，比如清空 lubricantModel
+          this.lubricantModel = "";
+        }
+      }
+    },
+    driveEndBearingBrand(newValue, oldValue) {
+      // 只有当 lubricantBrand 有值时才触发接口请求
+
+      if (newValue !== oldValue) {
+        if (newValue) {
+          this.driveEndBearingModel = "";
+          this.drive(newValue); // 调用方法
+        } else {
+          // 如果新值为空，可以执行其他操作，比如清空 lubricantModel
+          this.driveEndBearingModel = "";
+        }
+      }
+    },
+    nonDriveEndBearingBrand(newValue) {
+      // 只有当 lubricantBrand 有值时才触发接口请求
+      if (newValue !== oldValue) {
+        if (newValue) {
+          this.nonDriveEndBearingModel = "";
+          this.undriven(newValue); // 调用方法
+        } else {
+          // 如果新值为空，可以执行其他操作，比如清空 lubricantModel
+          this.nonDriveEndBearingModel = "";
+        }
+      }
+    },
+    polePairs(newValue) {
+      // 确保 polePairs 始终有值
+      this.polePairs = newValue || null;
+    },
+  },
+
+  mounted() {
+    // 编辑回显时，如果有值，自动触发接口调用
+    if (this.lubricantBrand) {
+      this.dynamo(this.lubricantBrand); // 触发接口调用，保留原值
+    }
+    if (this.lubricantModel) {
+      this.Rhyxinhao(this.lubricantModel); // 触发接口调用，保留原值
+    }
+    if (this.coolingMethod) {
+      this.ONcooling(this.coolingMethod); // 触发接口调用，保留原值
+    }
+    if (this.driveEndBearingBrand) {
+      this.drive(this.driveEndBearingBrand); // 触发接口调用，保留原值
+    }
+    if (this.driveEndBearingModel) {
+      this.drivemodel(this.driveEndBearingModel); // 触发接口调用，保留原值
+    }
+    if (this.nonDriveEndBearingBrand) {
+      this.undriven(this.nonDriveEndBearingBrand); // 触发接口调用，保留原值
+    }
+    if (this.nonDriveEndBearingModel) {
+      this.NOdrivemodel(this.nonDriveEndBearingModel); // 触发接口调用，保留原值
+    }
+    this.$emit("update", { key: "polePairs", value: this.polePairs || null });
   },
+
   methods: {
     initializeData(newVal = {}) {
       console.log("发电机-unitDynamoDto:", newVal);
@@ -236,21 +306,20 @@ export default {
       }
       this.polePairs = newValue;
 
-      this.$emit("update", { key: "polePairs", value: this.polePairs });
+      this.polePairs = this.polePairs || null;
+      this.$emit("update", { key: "polePairs", value: this.polePairs || null });
     },
     dynamo() {
       const params = {
         unitType: 2,
         manufacture: this.lubricantBrand,
       };
-
+      this.$emit("update", {
+        key: "lubricantBrand",
+        value: this.lubricantBrand || null,
+      });
       getBrandModelNameOrModelNumber(params).then((res) => {
         this.lubricatingXXoptions = res.data;
-        this.lubricantModel = "";
-        this.$emit("update", {
-          key: "lubricantBrand",
-          value: this.lubricantBrand,
-        });
       });
     },
     drive() {
@@ -258,14 +327,12 @@ export default {
         unitType: 1,
         manufacture: this.driveEndBearingBrand,
       };
-
+      this.$emit("update", {
+        key: "driveEndBearingBrand",
+        value: this.driveEndBearingBrand || null,
+      });
       getBrandModelNameOrModelNumber(params).then((res) => {
         this.bearingXXoptions = res.data;
-        this.driveEndBearingModel = "";
-        this.$emit("update", {
-          key: "driveEndBearingBrand",
-          value: this.driveEndBearingBrand,
-        });
       });
     },
     undriven() {
@@ -273,36 +340,37 @@ export default {
         unitType: 1,
         manufacture: this.nonDriveEndBearingBrand,
       };
-
+      this.$emit("update", {
+        key: "nonDriveEndBearingBrand",
+        value: this.nonDriveEndBearingBrand || null,
+      });
       getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        this.nonDriveEndBearingModel = "";
-        this.$emit("update", {
-          key: "nonDriveEndBearingBrand",
-          value: this.nonDriveEndBearingBrand,
-        });
+        this.notbearingXXoptions = res.data;
       });
     },
     // 润滑油型号变更时通知父组件
     Rhyxinhao() {
       this.$emit("update", {
         key: "lubricantModel",
-        value: this.lubricantModel,
+        value: this.lubricantModel || null,
       });
     },
     ONcooling() {
-      this.$emit("update", { key: "coolingMethod", value: this.coolingMethod });
+      this.$emit("update", {
+        key: "coolingMethod",
+        value: this.coolingMethod || null,
+      });
     },
     drivemodel() {
       this.$emit("update", {
         key: "driveEndBearingModel",
-        value: this.driveEndBearingModel,
+        value: this.driveEndBearingModel || null,
       });
     },
     NOdrivemodel() {
       this.$emit("update", {
         key: "nonDriveEndBearingModel",
-        value: this.nonDriveEndBearingModel,
+        value: this.nonDriveEndBearingModel || null,
       });
     },
   },

src/views/ledger/componentBJ/zhuzhou copy.vue

@@ -1,183 +0,0 @@
-<template>
-  <div>
-    <div class="message">
-      <div class="message-DIV">
-        <p>润滑油品牌：</p>
-        <el-select
-          clearable
-          v-model="lubricantBrand"
-          placeholder="请选择"
-          @change="linkage"
-        >
-          <el-option
-            v-for="item in lubricatingPPoptions"
-            :key="item"
-            :label="item"
-            :value="item"
-          >
-          </el-option
-        ></el-select>
-      </div>
-      <div class="message-DIV">
-        <p>润滑油型号：</p>
-        <el-select
-          clearable
-          :disabled="!lubricantBrand"
-          v-model="lubricantModel"
-          placeholder="请选择"
-        >
-          <el-option
-            v-for="item in lubricatingXXoptions"
-            :key="item"
-            :label="item"
-            :value="item"
-          >
-          </el-option
-        ></el-select>
-      </div>
-      <div class="message-DIV">
-        <p>前轴承品牌：</p>
-        <el-select
-          clearable
-          @change="ZQqian"
-          v-model="frontPingPaiValue"
-          placeholder="请选择"
-        >
-          <el-option
-            v-for="item in bearingPPoptions"
-            :key="item"
-            :label="item"
-            :value="item"
-          >
-          </el-option
-        ></el-select>
-      </div>
-      <div class="message-DIV">
-        <p>前轴承型号：</p>
-        <el-select
-          clearable
-          filterable
-          :disabled="!frontPingPaiValue"
-          v-model="frontBearingModel"
-          placeholder="请选择"
-        >
-          <el-option
-            v-for="item in bearingXXoptions"
-            :key="item"
-            :label="item"
-            :value="item"
-          >
-          </el-option
-        ></el-select>
-      </div>
-      <div class="message-DIV">
-        <p>后轴承品牌：</p>
-        <el-select
-          clearable
-          @change="ZQhou"
-          v-model="rearBearingBrand"
-          placeholder="请选择"
-        >
-          <el-option
-            v-for="item in bearingPPoptions"
-            :key="item"
-            :label="item"
-            :value="item"
-          >
-          </el-option
-        ></el-select>
-      </div>
-      <div class="message-DIV">
-        <p>后轴承型号：</p>
-        <el-select
-          clearable
-          filterable
-          :disabled="!rearBearingBrand"
-          v-model="rearBearingModel"
-          placeholder="请选择"
-        >
-          <el-option
-            v-for="item in bearingXXoptions"
-            :key="item"
-            :label="item"
-            :value="item"
-          >
-          </el-option
-        ></el-select>
-      </div>
-    </div>
-  </div>
-</template>
-  
-  <script>
-export default {
-  data() {
-    return {
-      lubricantBrand: "",
-      lubricantModel: "",
-      frontPingPaiValue: "",
-      frontBearingModel: "",
-      rearBearingBrand: "",
-      rearBearingModel: "",
-      // 润滑油
-      lubricatingPPoptions: [],
-      lubricatingXXoptions: [],
-      // 轴承
-      bearingPPoptions: [],
-      bearingXXoptions: [],
-    };
-  },
-  methods: {
-    linkage() {
-      const params = {
-        unitType: 2,
-        manufacture: this.lubricantBrand,
-      };
-      getBrandModelNameOrModelNumber(params).then((res) => {
-        this.lubricatingXXoptions = res.data;
-        this.lubricantModel = "";
-      });
-    },
-    ZQqian() {
-      const params = {
-        unitType: 1,
-        manufacture: this.frontPingPaiValue,
-      };
-      getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        this.frontBearingModel = "";
-      });
-    },
-    ZQhou() {
-      const params = {
-        unitType: 1,
-        manufacture: this.rearBearingBrand,
-      };
-      getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingXXoptions = res.data;
-        this.rearBearingModel = "";
-      });
-    },
-  },
-};
-</script>
-  
-  <style lang="scss" scoped>
-.message {
-  display: flex;
-  flex-wrap: wrap;
-  .message-DIV {
-    width: 25%;
-    display: flex;
-    margin-bottom: 20px;
-    justify-content: space-between;
-    p {
-      //   margin-right: 10px;
-      width: 140px;
-      line-height: 40px;
-      height: 40px;
-      text-align: right;
-    }
-  }
-}
-</style>

src/views/ledger/componentBJ/zhuzhou.vue

@@ -106,7 +106,7 @@
           @change="onRearBearingModelChange"
         >
           <el-option
-            v-for="item in bearingModelOptions"
+            v-for="item in laterbearingModelOptions"
             :key="item"
             :label="item"
             :value="item"
@@ -152,6 +152,7 @@ export default {
       rearBearingModel: "",
       lubricantModelOptions: [], // 润滑油型号选项
       bearingModelOptions: [], // 轴承型号选项
+      laterbearingModelOptions: [],
     };
   },
   created() {
@@ -171,6 +172,64 @@ export default {
         }
       },
     },
+    lubricantBrand(newValue, oldValue) {
+      // 只有当新值和旧值不一样时才触发接口请求
+      if (newValue !== oldValue) {
+        if (newValue) {
+          this.lubricantModel = "";
+          this.onLubricantBrandChange(newValue); // 调用方法
+        } else {
+          // 如果新值为空，可以执行其他操作，比如清空 lubricantModel
+          this.lubricantModel = "";
+        }
+      }
+    },
+    frontBearingBrand(newValue, oldValue) {
+      // 只有当新值和旧值不一样时触发接口请求
+      if (newValue !== oldValue) {
+        if (newValue) {
+          this.frontBearingModel = ""; // 清空模型
+          this.onFrontBearingBrandChange(newValue); // 调用相关方法
+        } else {
+          // 如果没有值时执行其他逻辑
+          this.frontBearingModel = ""; // 根据需求可清空模型
+        }
+      }
+    },
+
+    rearBearingBrand(newValue, oldValue) {
+      // 只有当新值和旧值不一样时触发接口请求
+      if (newValue !== oldValue) {
+        if (newValue) {
+          this.rearBearingModel = ""; // 清空模型
+          this.onRearBearingBrandChange(newValue); // 调用相关方法
+        } else {
+          // 如果没有值时执行其他逻辑
+          this.rearBearingModel = ""; // 根据需求可清空模型
+        }
+      }
+    },
+  },
+  mounted() {
+    // 编辑回显时，如果有值，自动触发接口调用
+    if (this.lubricantBrand) {
+      this.onLubricantBrandChange(this.lubricantBrand); // 触发接口调用，保留原值
+    }
+    if (this.frontBearingBrand) {
+      this.onFrontBearingBrandChange(this.frontBearingBrand); // 触发接口调用，保留原值
+    }
+    if (this.rearBearingBrand) {
+      this.onRearBearingBrandChange(this.rearBearingBrand); // 触发接口调用，保留原值
+    }
+    if (this.lubricantModel) {
+    this.onLubricantModelChange(this.lubricantModel); // 触发接口调用，保留原值
+  }
+  if (this.frontBearingModel) {
+    this.onFrontBearingModelChange(this.frontBearingModel); // 触发接口调用，保留原值
+  }
+  if (this.rearBearingModel) {
+    this.onRearBearingModelChange(this.rearBearingModel); // 触发接口调用，保留原值
+  }
   },
   methods: {
     initializeData(newVal = {}) {
@@ -198,7 +257,7 @@ export default {
           this.$set(this.form, key, value);
         }
       });
-      console.log(this.$data);
+      console.log(this.$data,"123132132");
     },
 
     /**
@@ -210,13 +269,13 @@ export default {
         manufacture: this.lubricantBrand,
       };
 
+      this.$emit("update", {
+        key: "lubricantBrand",
+        value: this.lubricantBrand,
+      });
       getBrandModelNameOrModelNumber(params).then((res) => {
         this.lubricantModelOptions = res.data;
-        this.lubricantModel = ""; // 清空已选择的润滑油型号
-        this.$emit("update", {
-          key: "lubricantBrand",
-          value: this.lubricantBrand,
-        });
+        // this.lubricantModel = ""; // 清空已选择的润滑油型号
       });
     },
 
@@ -226,7 +285,7 @@ export default {
     onLubricantModelChange() {
       this.$emit("update", {
         key: "lubricantModel",
-        value: this.lubricantModel,
+        value: this.lubricantModel || null,
       });
     },
 
@@ -238,14 +297,13 @@ export default {
         unitType: 1,
         manufacture: this.frontBearingBrand,
       };
-
+      this.$emit("update", {
+        key: "frontBearingBrand",
+        value: this.frontBearingBrand,
+      });
       getBrandModelNameOrModelNumber(params).then((res) => {
         this.bearingModelOptions = res.data;
-        this.frontBearingModel = ""; // 清空已选择的前轴承型号
-        this.$emit("update", {
-          key: "frontBearingBrand",
-          value: this.frontBearingBrand,
-        });
+        // this.frontBearingModel = ""; // 清空已选择的前轴承型号
       });
     },
 
@@ -255,7 +313,7 @@ export default {
     onFrontBearingModelChange() {
       this.$emit("update", {
         key: "frontBearingModel",
-        value: this.frontBearingModel,
+        value: this.frontBearingModel || null,
       });
     },
 
@@ -268,23 +326,23 @@ export default {
         manufacture: this.rearBearingBrand,
       };
 
+      this.$emit("update", {
+        key: "rearBearingBrand",
+        value: this.rearBearingBrand,
+      });
       getBrandModelNameOrModelNumber(params).then((res) => {
-        this.bearingModelOptions = res.data;
-        this.rearBearingModel = ""; // 清空已选择的后轴承型号
-        this.$emit("update", {
-          key: "rearBearingBrand",
-          value: this.rearBearingBrand,
-        });
+        this.laterbearingModelOptions = res.data;
+        // this.rearBearingModel = ""; // 清空已选择的后轴承型号
       });
     },
 
     /**
      * 后轴承型号变更时通知父组件
      */
-    onRearBearingModelChange() {
+     onRearBearingModelChange() {
       this.$emit("update", {
         key: "rearBearingModel",
-        value: this.rearBearingModel,
+        value: this.rearBearingModel || null,
       });
     },
   },

src/views/ledger/modules.vue

@@ -126,7 +126,9 @@ export default {
         .then((res) => {
           // 确保数据有效
           if (res && res.data) {
-            this.lubricantBrandOptions = res.data;
+            setTimeout(() => {
+              this.lubricantBrandOptions = res.data;
+            }, 500);
           } else {
             console.error("获取润滑油品牌失败:", res);
           }
@@ -257,7 +259,38 @@ export default {
      * 模拟发送数据到后端
      * @param {Object} params 提交的所有参数
      */
+
     submitToBackend(params) {
+      const fieldsToDelete = [
+        "TYLbearingXXoptions",
+        "XXLbearingXXoptions",
+        "DSGSbearingXXoptions",
+        "DSRSbearingXXoptions",
+      ];
+      const deleteFields = (obj) => {
+        if (Array.isArray(obj)) {
+          // 如果是数组，递归遍历每一项
+          obj.forEach((item) => deleteFields(item));
+        } else if (obj !== null && typeof obj === "object") {
+          // 如果是对象，遍历它的每个属性
+          fieldsToDelete.forEach((field) => {
+            if (obj.hasOwnProperty(field)) {
+              delete obj[field];
+            }
+          });
+          // 遍历对象的所有键，递归处理
+          Object.keys(obj).forEach((key) => {
+            deleteFields(obj[key]);
+          });
+        }
+      };
+
+      // 调用删除字段的递归方法
+      deleteFields(params);
+
+      console.log("提交的数据（删除不需要的字段后）:", params);
+
+      // return
       modificationUnit(params).then((res) => {
         if (res.code == 200)
           this.$router.push({

vue.config.js

@@ -64,9 +64,9 @@ module.exports = {
     proxy: {
       "/api": {
         // target: "http://192.168.5.4:16200", // 石月
-        target: "http://192.168.50.235:16200", // 内网 开发
+        target: "http://192.168.50.235:16200", // 内网
         // target: "http://192.168.5.15:16200",
-        // target: "http://106.120.102.238:16700", // 外网   16600   16700
+        // target: "http://106.120.102.238:16700", // 外网  16600   16700
         // target: "http://10.96.137.5",
         changeOrigin: true,
         pathRewrite: {