clx部件信息模块

src/main.js

@@ -30,6 +30,7 @@ Vue.use(dataV);
 Vue.prototype.$qs = qs;
 // Vue.prototype.$tinymce = tinymce;
 
+// dialog拖拽全屏
 import dialogDrag from './views/health/dialogDrag';
 Vue.directive('dialogDrag', dialogDrag);
 

src/views/ledger/componentBJ/chilunxiang.vue

@@ -26,6 +26,43 @@
         ></el-select>
       </div>
     </div>
+    <!-- LLS -->
+    <p class="locationP">
+      <i @click="addLSS" class="el-icon-plus"></i>
+      <i v-if="lssList.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 lssList" :key="index" class="message-BOX">
+        <div class="message-DIV">
+          <p>{{ index === 0 ? "低速轴承品牌：" : "低速轴承2/品牌：" }}</p>
+          <el-select clearable v-model="item.lssPPvalue" placeholder="请选择">
+            <el-option
+              v-for="option in lssPPoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>{{ index === 0 ? "低速轴承型号：" : "低速轴承2/型号：" }}</p>
+          <el-select clearable v-model="item.lssXXvalue" placeholder="请选择">
+            <el-option
+              v-for="option in lssXXoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+    </div>
+
     <!-- 行星轮 -->
     <p class="locationP">
       <i @click="addPlanet" class="el-icon-plus"></i>
@@ -35,6 +72,48 @@
       <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="xxlPPvalue" placeholder="请选择">
+            <el-option
+              v-for="item in lssPPoptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option
+          ></el-select>
+        </div>
+        <div class="message-DIV">
+          <p>行星轮轴承型号：</p>
+          <el-select clearable v-model="xxlxhvalue" placeholder="请选择">
+            <el-option
+              v-for="item in xxlxhoptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option
+          ></el-select>
+        </div>
+      </div>
+
+      <div class="message-DIV">
+        <p>齿圈齿数：</p>
+        <el-input
+          v-model="item.gearring"
+          @input="validateInput($event, index, 'gearring')"
+        ></el-input>
+      </div>
+      <div class="message-DIV">
+        <p>太阳轮齿数：</p>
+        <el-input
+          v-model="item.suntooth"
+          @input="validateInput($event, index, 'suntooth')"
+        ></el-input>
+      </div>
+
       <div class="message-DIV">
         <p>行星轮个数：</p>
         <el-input
@@ -49,12 +128,32 @@
           @input="validateInput($event, index, 'planetooth')"
         ></el-input>
       </div>
-      <div class="message-DIV">
-        <p>太阳轮齿数：</p>
-        <el-input
-          v-model="item.suntooth"
-          @input="validateInput($event, index, 'suntooth')"
-        ></el-input>
+
+      <div class="message-BOX">
+        <div class="message-DIV">
+          <p>太阳轮轴承品牌：</p>
+          <el-select clearable v-model="tyPPvalue" placeholder="请选择">
+            <el-option
+              v-for="item in tyPPoptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option
+          ></el-select>
+        </div>
+        <div class="message-DIV">
+          <p>太阳轮轴承型号：</p>
+          <el-select clearable v-model="tyxhvalue" placeholder="请选择">
+            <el-option
+              v-for="item in tyxhoptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option
+          ></el-select>
+        </div>
       </div>
     </div>
     <!-- 平行轮 -->
@@ -89,18 +188,146 @@
         ></el-input>
       </div>
     </div>
-    <!-- 轴承 -->
+    <!-- 低速中间轴 -->
+    <p class="locationP">
+      <i @click="addslowly" class="el-icon-plus"></i>
+      <i
+        v-if="slowly.length > 1"
+        @click="delslowly"
+        class="el-icon-minus"
+      ></i>
+    </p>
     <div class="message">
       <p class="caption">
-        <span class="capSpan1">轴承</span>
+        <span class="capSpan1">低速中间轴</span>
       </p>
       <div class="message-DIV">
-        <p>太阳轮轴承</p>
-        <el-input v-bind="sunbearing"></el-input>
+        <p>齿圈齿数：</p>
+        <el-input
+          v-model="gearring"
+          @input="validateInput($event, 'gearring')"
+        ></el-input>
+      </div>
+      <div v-for="(item, index) in slowly" :key="index" class="message-BOX">
+        <div class="message-DIV">
+          <p>轴承-RS品牌：</p>
+          <el-select clearable v-model="item.rsBrand" placeholder="请选择">
+            <el-option
+              v-for="option in lssPPoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-RS型号：</p>
+          <el-select clearable v-model="item.rsModel" placeholder="请选择">
+            <el-option
+              v-for="option in xxlxhoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS品牌：</p>
+          <el-select clearable v-model="item.gsBrand" placeholder="请选择">
+            <el-option
+              v-for="option in lssPPoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS型号：</p>
+          <el-select clearable v-model="item.gsModel" placeholder="请选择">
+            <el-option
+              v-for="option in xxlxhoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
       </div>
+    </div>
+      <!-- 高速轴 -->
+      <p class="locationP">
+      <i @click="addhigh " class="el-icon-plus"></i>
+      <i
+        v-if="high.length > 1"
+        @click="delhigh "
+        class="el-icon-minus"
+      ></i>
+    </p>
+    <div class="message">
+      <p class="caption">
+        <span class="capSpan1">高速轴</span>
+      </p>
       <div class="message-DIV">
-        <p>行星轮轴承</p>
-        <el-input v-model="planetbearing"></el-input>
+        <p>齿圈齿数：</p>
+        <el-input
+          v-model="gearring"
+          @input="validateInput($event, 'gearring')"
+        ></el-input>
+      </div>
+      <div v-for="(item, index) in high " :key="index" class="message-BOX">
+        <div class="message-DIV">
+          <p>轴承-RS品牌：</p>
+          <el-select clearable v-model="item.rsBrand" placeholder="请选择">
+            <el-option
+              v-for="option in lssPPoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-RS型号：</p>
+          <el-select clearable v-model="item.rsModel" placeholder="请选择">
+            <el-option
+              v-for="option in xxlxhoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS品牌：</p>
+          <el-select clearable v-model="item.gsBrand" placeholder="请选择">
+            <el-option
+              v-for="option in lssPPoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="message-DIV">
+          <p>轴承-GS型号：</p>
+          <el-select clearable v-model="item.gsModel" placeholder="请选择">
+            <el-option
+              v-for="option in xxlxhoptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
       </div>
     </div>
   </div>
@@ -114,17 +341,45 @@ export default {
       brandoptions: [],
       modelvalue: "",
       modeloptions: [],
-      planets: [{ planetnumber: "", planetooth: "", suntooth: "" }],
+      lssList: [
+        { lssPPvalue: "", lssXXvalue: "" },
+        { lssPPvalue: "", lssXXvalue: "" },
+      ],
+      lssPPoptions: [],
+      lssXXoptions: [],
+
+      xxlPPvalue: "",
+      xxlPPoptions: [],
+      xxlxhvalue: "",
+      xxlxhoptions: [],
+
+      tyPPvalue: "",
+      tyPPoptions: [],
+      tyxhvalue: "",
+      tyxhoptions: [],
+
+      planets: [
+        { planetnumber: "", planetooth: "", suntooth: "", gearring: "" },
+      ],
       levelNames: ["一级", "二级", "三级"],
       parallel: [{ big: "", little: "" }],
       sunbearing: "",
       planetbearing: "",
+
+      slowly: [{ rsBrand: null, rsModel: null, gsBrand: null, gsModel: null }],
+      gearring: "",
+      high :[{ rsBrand: null, rsModel: null, gsBrand: null, gsModel: null }],
     };
   },
   methods: {
     addPlanet() {
       if (this.planets.length < 3) {
-        this.planets.push({ planetnumber: "", planetooth: "", suntooth: "" });
+        this.planets.push({
+          planetnumber: "",
+          planetooth: "",
+          suntooth: "",
+          gearring: "",
+        });
       }
     },
     delPlanet() {
@@ -154,6 +409,50 @@ export default {
       }
     },
 
+    addLSS() {
+      if (this.lssList.length < 2) {
+        this.lssList.push({ brandvalue: "", modelvalue: "" });
+      }
+    },
+    delLSS() {
+      if (this.lssList.length > 1) {
+        this.lssList.pop();
+      }
+    },
+    addslowly() {
+      if (this.slowly.length < 2) {
+        this.slowly.push({
+          rsBrand: null,
+          rsModel: null,
+          gsBrand: null,
+          gsModel: null,
+        });
+      }
+    },
+    delslowly() {
+      if (this.slowly.length > 1) {
+        this.slowly.pop();
+      }
+  },
+
+  
+  addhigh() {
+      if (this.high.length < 2) {
+        this.high.push({
+          rsBrand: null,
+          rsModel: null,
+          gsBrand: null,
+          gsModel: null,
+        });
+      }
+    },
+    delhigh() {
+      if (this.high.length > 1) {
+        this.high.pop();
+      }
+  },
+
+
     submitForm() {
       console.log(this.planets);
     },
@@ -165,6 +464,27 @@ export default {
 .message {
   display: flex;
   flex-wrap: wrap;
+  .message-BOX {
+    width: 100%;
+    display: flex;
+
+    .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;