Browse Source

图表封装、数据关联

liujiejie 8 months ago
parent
commit
23026aa133

+ 54 - 21
package-lock.json

@@ -2324,6 +2324,27 @@
         "whatwg-fetch": "^3.6.2"
       },
       "dependencies": {
+        "@vue/vue-loader-v15": {
+          "version": "npm:vue-loader@15.11.1",
+          "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.11.1.tgz",
+          "integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
+          "dev": true,
+          "requires": {
+            "@vue/component-compiler-utils": "^3.1.0",
+            "hash-sum": "^1.0.2",
+            "loader-utils": "^1.1.0",
+            "vue-hot-reload-api": "^2.3.0",
+            "vue-style-loader": "^4.1.0"
+          },
+          "dependencies": {
+            "hash-sum": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
+              "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
+              "dev": true
+            }
+          }
+        },
         "acorn": {
           "version": "8.14.0",
           "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.14.0.tgz",
@@ -3006,27 +3027,6 @@
       "integrity": "sha512-L2RPSAwUFbgZH20etwrXyVyCBu9OxRSi8T/38QsvnkJyvq2LufW2lDCOzm7t/U9C1mkhJGWYfCuFBCmIuNivrg==",
       "dev": true
     },
-    "@vue/vue-loader-v15": {
-      "version": "npm:vue-loader@15.11.1",
-      "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.11.1.tgz",
-      "integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
-      "dev": true,
-      "requires": {
-        "@vue/component-compiler-utils": "^3.1.0",
-        "hash-sum": "^1.0.2",
-        "loader-utils": "^1.1.0",
-        "vue-hot-reload-api": "^2.3.0",
-        "vue-style-loader": "^4.1.0"
-      },
-      "dependencies": {
-        "hash-sum": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
-          "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
-          "dev": true
-        }
-      }
-    },
     "@vue/web-component-wrapper": {
       "version": "1.3.0",
       "resolved": "https://registry.npmmirror.com/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz",
@@ -5244,6 +5244,11 @@
       "resolved": "https://registry.npmmirror.com/date-fns/-/date-fns-4.1.0.tgz",
       "integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg=="
     },
+    "dayjs": {
+      "version": "1.11.13",
+      "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.13.tgz",
+      "integrity": "sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg=="
+    },
     "de-indent": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/de-indent/-/de-indent-1.0.2.tgz",
@@ -6497,6 +6502,11 @@
       "integrity": "sha512-b6suED+5/3rTpUBdG1gupIl8MPFCAMA0QXwmljLhvCUKcUvdE4gWky9zpuGCcXHOsz4J9wPGNWq6OKpmIzz3hQ==",
       "dev": true
     },
+    "flatpickr": {
+      "version": "4.6.13",
+      "resolved": "https://registry.npmmirror.com/flatpickr/-/flatpickr-4.6.13.tgz",
+      "integrity": "sha512-97PMG/aywoYpB4IvbvUJi0RQi8vearvU0oov1WW3k0WZPBMrTQVqekSX5CjSG/M4Q3i6A/0FKXC7RyAoAUUSPw=="
+    },
     "follow-redirects": {
       "version": "1.15.9",
       "resolved": "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.9.tgz",
@@ -8891,6 +8901,11 @@
         "@sideway/pinpoint": "^2.0.0"
       }
     },
+    "jquery": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmmirror.com/jquery/-/jquery-2.2.4.tgz",
+      "integrity": "sha512-lBHj60ezci2u1v2FqnZIraShGgEXq35qCzMv4lITyHGppTnA13rwR0MgwyNJh9TnDs3aXUvd1xjAotfraMHX/Q=="
+    },
     "js-base64": {
       "version": "2.6.4",
       "resolved": "https://registry.npmmirror.com/js-base64/-/js-base64-2.6.4.tgz",
@@ -9354,6 +9369,19 @@
         "yallist": "^3.0.2"
       }
     },
+    "luckysheet": {
+      "version": "2.1.13",
+      "resolved": "https://registry.npmmirror.com/luckysheet/-/luckysheet-2.1.13.tgz",
+      "integrity": "sha512-ZotItRKh3fxEtYz0GrZxkf97jeQSGsJpFNAu1I0NMDQ6rVrHAWKeggFak5pClGQ3DP62Gi8kd+8rzOpyY/UNZw==",
+      "requires": {
+        "@babel/runtime": "^7.12.1",
+        "dayjs": "^1.9.6",
+        "flatpickr": "^4.6.6",
+        "jquery": "^2.2.4",
+        "numeral": "^2.0.6",
+        "pako": "^1.0.11"
+      }
+    },
     "magic-string": {
       "version": "0.22.5",
       "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.22.5.tgz",
@@ -10267,6 +10295,11 @@
       "integrity": "sha512-Y1wZESM7VUThYY+4W+X4ySH2maqcA+p7UR+w8VWNWVAd6lwuXXWz/w/Cz43J/dI2I+PS6wD5N+bJUF+gjWvIqg==",
       "dev": true
     },
+    "numeral": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmmirror.com/numeral/-/numeral-2.0.6.tgz",
+      "integrity": "sha512-qaKRmtYPZ5qdw4jWJD6bxEf1FJEqllJrwxCLIm0sQU/A7v2/czigzOb+C2uSiFsa9lBUzeH7M1oK+Q+OLxL3kA=="
+    },
     "numeric": {
       "version": "1.2.6",
       "resolved": "https://registry.npmmirror.com/numeric/-/numeric-1.2.6.tgz",

+ 1 - 0
package.json

@@ -22,6 +22,7 @@
     "file-saver": "^2.0.5",
     "happypack": "^5.0.1",
     "jszip": "^3.10.1",
+    "luckysheet": "^2.1.13",
     "ol": "^9.2.3",
     "papaparse": "^5.4.1",
     "plotly.js-dist": "^2.34.0",

BIN
src/assets/analyse/01.png


BIN
src/assets/analyse/02.png


BIN
src/assets/analyse/03.png


BIN
src/assets/analyse/04.png


BIN
src/assets/analyse/05.png


BIN
src/assets/analyse/06.png


BIN
src/assets/analyse/07.png


+ 5 - 0
src/main.js

@@ -31,6 +31,11 @@ Vue.use(dataV);
 Vue.prototype.$qs = qs;
 // Vue.prototype.$tinymce = tinymce;
 
+import dialogDrag from './views/health/dialogDrag';
+Vue.directive('dialogDrag', dialogDrag);
+
+
+
 Vue.use(ElementUI);
 // 引入tailwind
 // https://www.tailwindcss.cn/docs/installation

+ 111 - 0
src/views/health/dialogDrag.js

@@ -0,0 +1,111 @@
+// src/directives/dialogDrag.js
+export default {
+    bind(el) {
+      const minWidth = 400;
+      const minHeight = 300;
+      let isFullScreen = false;
+      let nowWidth = 0;
+      let nowHeight = 0;
+      let nowMarginTop = 0;
+  
+      const dialogHeaderEl = el.querySelector('.el-dialog__header');
+      const dragDom = el.querySelector('.el-dialog');
+      dragDom.style.overflow = "auto";
+      dialogHeaderEl.onselectstart = () => false;
+      dialogHeaderEl.style.cursor = 'move';
+  
+      // 获取当前 dialog 的位置和尺寸
+      const getDialogPosition = () => {
+        const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null);
+        let styL = 0, styT = 0;
+        if (sty.left.includes('%')) {
+          styL = +document.body.clientWidth * (+sty.left.replace(/%/g, '') / 100);
+          styT = +document.body.clientHeight * (+sty.top.replace(/%/g, '') / 100);
+        } else {
+          styL = +sty.left.replace(/px/g, '');
+          styT = +sty.top.replace(/px/g, '');
+        }
+        return { styL, styT };
+      }
+  
+      // 拖动功能
+      const moveDialog = (e) => {
+        const { styL, styT } = getDialogPosition();
+        const disX = e.clientX - dialogHeaderEl.offsetLeft;
+        const disY = e.clientY - dialogHeaderEl.offsetTop;
+  
+        document.onmousemove = (e) => {
+          const l = e.clientX - disX;
+          const t = e.clientY - disY;
+          dragDom.style.left = `${l + styL}px`;
+          dragDom.style.top = `${t + styT}px`;
+        };
+  
+        document.onmouseup = () => {
+          document.onmousemove = null;
+          document.onmouseup = null;
+        };
+      };
+  
+      // 双击全屏切换
+      const toggleFullScreen = () => {
+        if (isFullScreen === false) {
+          nowWidth = dragDom.clientWidth;
+          nowHeight = dragDom.clientHeight;
+          nowMarginTop = dragDom.style.marginTop;
+          dragDom.style.left = 0;
+          dragDom.style.top = 0;
+          dragDom.style.height = "100vh";
+          dragDom.style.width = "100vw";
+          dragDom.style.marginTop = 0;
+          isFullScreen = true;
+          dialogHeaderEl.style.cursor = 'initial';
+          dialogHeaderEl.onmousedown = null;
+        } else {
+          dragDom.style.height = `${nowHeight}px`;
+          dragDom.style.width = `${nowWidth}px`;
+          dragDom.style.marginTop = nowMarginTop;
+          isFullScreen = false;
+          dialogHeaderEl.style.cursor = 'move';
+          dialogHeaderEl.onmousedown = moveDialog;
+        }
+      };
+  
+      // 拉伸功能
+      const resizeDialog = (e, direction) => {
+        let clientX = e.clientX;
+        let clientY = e.clientY;
+        let elW = dragDom.clientWidth;
+        let elH = dragDom.clientHeight;
+        let EloffsetLeft = dragDom.offsetLeft;
+        let EloffsetTop = dragDom.offsetTop;
+  
+        document.onmousemove = (e) => {
+          e.preventDefault();
+          if (direction === 'right') {
+            const newWidth = elW + (e.clientX - clientX) * 2;
+            dragDom.style.width = newWidth > minWidth ? `${newWidth}px` : `${minWidth}px`;
+          } else if (direction === 'bottom') {
+            const newHeight = elH + (e.clientY - clientY) * 2;
+            dragDom.style.height = newHeight > minHeight ? `${newHeight}px` : `${minHeight}px`;
+          } else if (direction === 'left') {
+            const newWidth = elW - (e.clientX - clientX) * 2;
+            dragDom.style.width = newWidth > minWidth ? `${newWidth}px` : `${minWidth}px`;
+          } else if (direction === 'top') {
+            const newHeight = elH - (e.clientY - clientY) * 2;
+            dragDom.style.height = newHeight > minHeight ? `${newHeight}px` : `${minHeight}px`;
+          }
+        };
+  
+        document.onmouseup = () => {
+          document.onmousemove = null;
+          document.onmouseup = null;
+        };
+      };
+  
+      // 监听拖动和双击事件
+      dialogHeaderEl.ondblclick = toggleFullScreen;
+      dialogHeaderEl.onmousedown = moveDialog;
+    }
+  };
+  

+ 0 - 0
src/views/health/index.vue


+ 179 - 0
src/views/health/vibration.vue

@@ -0,0 +1,179 @@
+<template>
+  <div class="global-variable">
+    <div class="head">
+      <div class="headleft">
+        <div class="picture">
+          <img src="@/assets/analyse/03.png" alt="" />
+          <p>时域图</p>
+        </div>
+        <div class="picture">
+          <img src="@/assets/analyse/04.png" alt="" />
+          <p>频谱图</p>
+        </div>
+        <div class="picture">
+          <img src="@/assets/analyse/01.png" alt="" />
+          <p>包络谱图</p>
+        </div>
+        <div class="picture">
+          <img src="@/assets/analyse/02.png" alt="" />
+          <p>趋势图</p>
+        </div>
+      </div>
+      <div class="headright">
+        <img src="@/assets/analyse/05.png" alt="" />
+        <img src="@/assets/analyse/07.png" alt="" />
+        <img src="@/assets/analyse/06.png" alt="" />
+      </div>
+    </div>
+    <div class="searchbox">
+      <p>
+        单位:
+        <el-select v-model="company" size="small" placeholder="请选择">
+          <el-option
+            v-for="item in companyoptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </p>
+      <p>
+        风机:
+        <el-select v-model="unitvalue" size="small" placeholder="请选择">
+          <el-option
+            v-for="item in unitoptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </p>
+      <p>
+        测点:
+        <el-select v-model="monitoringvalue" size="small" placeholder="请选择">
+          <el-option
+            v-for="item in monitoringoptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </p>
+      <p>
+        时间:
+        <el-date-picker
+          size="small"
+          v-model="timevalue"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        >
+        </el-date-picker>
+      </p>
+      <el-button type="primary" size="small">查询</el-button>
+      <el-button size="small">导出</el-button>
+    </div>
+    <div class="main-body">
+      <div class="data-map">
+        
+      </div>
+      <div class="data-origin">
+        <el-table
+          highlight-current-row
+          @current-change="handleCurrentChange"
+          ref="singleTable"
+          :data="tableData"
+          style="width: 100%"
+        >
+          <el-table-column type="index" label="排序"> </el-table-column>
+          <el-table-column prop="name" label="时间"> </el-table-column>
+          <el-table-column prop="address" label="测点名称"> </el-table-column>
+          <el-table-column prop="address" label="场站"> </el-table-column>
+          <el-table-column prop="address" label="风机"> </el-table-column>
+        </el-table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      company: "",
+      companyoptions: [],
+      unitvalue: "",
+      unitoptions: [],
+      monitoringvalue: "",
+      monitoringoptions: [],
+      timevalue: "",
+      tableData: [{}, {}, {}, {}],
+    };
+  },
+  methods: {
+    setCurrent(row) {
+      this.$refs.singleTable.setCurrentRow(row);
+    },
+    handleCurrentChange(val) {
+      this.currentRow = val;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.head {
+  border-top: 5px solid #088080;
+  border-bottom: 5px solid #088080;
+  padding: 5px 0;
+  display: flex;
+  justify-content: space-between;
+  .headleft {
+    display: flex;
+    .picture {
+      display: inline-block;
+      text-align: center;
+      margin: 0 20px;
+      img {
+        width: 80px;
+        height: 30px;
+      }
+    }
+  }
+  .headright {
+    img {
+      width: 20px;
+      height: 20px;
+      margin: 0 10px;
+    }
+  }
+}
+.searchbox {
+  display: flex;
+  margin: 20px 0;
+  p {
+    margin-right: 20px;
+  }
+  .el-select {
+    width: 180px;
+  }
+}
+.main-body {
+  display: flex;
+  justify-content: space-between;
+  .data-map {
+    width: 60%;
+    height: 200px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
+  }
+  .data-origin {
+    width: 39%;
+    height: 200px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
+  }
+}
+</style>

+ 27 - 0
src/views/home/components/mockData.js

@@ -199,6 +199,33 @@ export const orgList = [
   },
 
   {
+    name: "健康管理",
+    iconName: "health",
+    path: "health",
+    meta: {
+      hidden: false,
+    },
+    id: "6",
+    component: () =>
+      import(/*webpackChunkName:'system'*/ "@/views/system/index.vue"),
+    children: [
+      {
+        id: 61,
+        name: "振动分析",
+        path: "vibration",
+        meta: {
+          hidden: false,
+        },
+        component: () =>
+          import(/*webpackChunkName:'Ledger'*/ "@/views/health/vibration.vue"),
+      },
+     
+   
+    ],
+  },
+
+
+  {
     name: "权限管理",
     iconName: "jurisdiction",
     id: "5",

+ 208 - 0
src/views/ledger/componentBJ/chilunxiang.vue

@@ -0,0 +1,208 @@
+<template>
+  <div>
+    <div class="message">
+      <div class="message-DIV">
+        <p>润滑油品牌:</p>
+        <el-select clearable v-model="brandvalue" placeholder="请选择">
+          <el-option
+            v-for="item in brandoptions"
+            :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="modelvalue" placeholder="请选择">
+          <el-option
+            v-for="item in modeloptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option
+        ></el-select>
+      </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" :key="index" class="message">
+      <p class="caption">
+        <span class="capSpan1">{{ `${levelNames[index]}行星轮结构` }}</span>
+      </p>
+      <div class="message-DIV">
+        <p>行星轮个数:</p>
+        <el-input
+          v-model="item.planetnumber"
+          @input="validateInput($event, index, 'planetnumber')"
+        ></el-input>
+      </div>
+      <div class="message-DIV">
+        <p>行星轮齿数:</p>
+        <el-input
+          v-model="item.planetooth"
+          @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>
+    </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"
+      :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.big"
+          @input="validateInput($event, index, 'big')"
+        ></el-input>
+      </div>
+      <div class="message-DIV">
+        <p>小齿轮齿数</p>
+        <el-input
+          v-model="item.little"
+          @input="validateInput($event, index, 'little')"
+        ></el-input>
+      </div>
+    </div>
+    <!-- 轴承 -->
+    <div class="message">
+      <p class="caption">
+        <span class="capSpan1">轴承</span>
+      </p>
+      <div class="message-DIV">
+        <p>太阳轮轴承</p>
+        <el-input v-bind="sunbearing"></el-input>
+      </div>
+      <div class="message-DIV">
+        <p>行星轮轴承</p>
+        <el-input v-model="planetbearing"></el-input>
+      </div>
+    </div>
+  </div>
+</template>
+  
+  <script>
+export default {
+  data() {
+    return {
+      brandvalue: "",
+      brandoptions: [],
+      modelvalue: "",
+      modeloptions: [],
+      planets: [{ planetnumber: "", planetooth: "", suntooth: "" }],
+      levelNames: ["一级", "二级", "三级"],
+      parallel: [{ big: "", little: "" }],
+      sunbearing: "",
+      planetbearing: "",
+    };
+  },
+  methods: {
+    addPlanet() {
+      if (this.planets.length < 3) {
+        this.planets.push({ planetnumber: "", planetooth: "", suntooth: "" });
+      }
+    },
+    delPlanet() {
+      if (this.planets.length > 1) {
+        this.planets.pop();
+      }
+    },
+    validateInput(value, index, field) {
+      const validValue = value.replace(/[^0-9]/g, "");
+      this.planets[index][field] = validValue;
+      if (validValue !== value) {
+        this.$message({
+          message: "只能输入数字",
+          type: "warning",
+          duration: 2000,
+        });
+      }
+    },
+    delparallel() {
+      if (this.parallel.length > 1) {
+        this.parallel.pop();
+      }
+    },
+    addparallel() {
+      if (this.parallel.length < 3) {
+        this.parallel.push({ big: "", little: "" });
+      }
+    },
+
+    submitForm() {
+      console.log(this.planets);
+    },
+  },
+};
+</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;
+    }
+    .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>

+ 158 - 0
src/views/ledger/componentBJ/fadianji.vue

@@ -0,0 +1,158 @@
+<template>
+  <div>
+    <div class="message">
+      <div class="message-DIV">
+        <p>润滑油品牌:</p>
+        <el-select clearable v-model="brandvalue" placeholder="请选择">
+          <el-option
+            v-for="item in brandoptions"
+            :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="modelvalue" placeholder="请选择">
+          <el-option
+            v-for="item in modeloptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option
+        ></el-select>
+      </div>
+
+      <div class="message-DIV">
+        <p>极对数:</p>
+        <el-input v-model="polepair" @input="validateNumericInput"></el-input>
+      </div>
+
+      <div class="message-DIV">
+        <p>冷却方式:</p>
+        <el-select clearable v-model="cooling" placeholder="请选择">
+          <el-option
+            v-for="item in coolingoptions"
+            :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="drivePingPaiValue" placeholder="请选择">
+          <el-option
+            v-for="item in drivePingPaioptions"
+            :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="driveXingHaoValue" placeholder="请选择">
+          <el-option
+            v-for="item in driveXingHaooptions"
+            :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="nodrivePingPaiValue" placeholder="请选择">
+          <el-option
+            v-for="item in nodrivePingPaioptions"
+            :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="nodriveXingHaoValue" placeholder="请选择">
+          <el-option
+            v-for="item in nodriveXingHaooptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option
+        ></el-select>
+      </div>
+    </div>
+  </div>
+</template>
+  
+  <script>
+export default {
+  data() {
+    return {
+      brandvalue: "",
+      brandoptions: [],
+      modelvalue: "",
+      modeloptions: [],
+      polepair: "",
+      cooling: "",
+      coolingoptions: [],
+      drivePingPaiValue: "",
+      drivePingPaioptions: [],
+      driveXingHaoValue: "",
+      driveXingHaooptions: [],
+      nodrivePingPaiValue: "",
+      nodrivePingPaioptions: [],
+      nodriveXingHaoValue: "",
+      nodriveXingHaooptions: [],
+    };
+  },
+  methods: {
+    validateNumericInput(event) {
+      const newValue = this.polepair.replace(/[^0-9]/g, "");
+      if (this.polepair !== newValue) {
+        this.$message({
+          message: "请输入数字!",
+          type: "warning",
+        });
+      }
+      this.polepair = newValue;
+    },
+  },
+};
+</script>
+  
+  <style lang="scss" scoped>
+.message {
+  display: flex;
+  flex-wrap: wrap;
+  .message-DIV {
+    width: 25%;
+    display: flex;
+    margin-bottom: 20px;
+    justify-content: space-between;
+    .el-input {
+      width: 223px;
+    }
+    p {
+      //   margin-right: 10px;
+      width: 140px;
+      line-height: 40px;
+      height: 40px;
+      text-align: right;
+    }
+  }
+}
+</style>

+ 119 - 0
src/views/ledger/componentBJ/zhuzhou.vue

@@ -0,0 +1,119 @@
+<template>
+  <div>
+    <div class="message">
+      <div class="message-DIV">
+        <p>润滑油品牌:</p>
+        <el-select clearable v-model="brandvalue" placeholder="请选择">
+          <el-option
+            v-for="item in brandoptions"
+            :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="modelvalue" placeholder="请选择">
+          <el-option
+            v-for="item in modeloptions"
+            :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="frontPingPaiValue" placeholder="请选择">
+          <el-option
+            v-for="item in frontPingPaioptions"
+            :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="frontXingHaoValue" placeholder="请选择">
+          <el-option
+            v-for="item in frontXingHaooptions"
+            :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="backPingPaiValue" placeholder="请选择">
+          <el-option
+            v-for="item in backPingPaioptions"
+            :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="backXingHaoValue" placeholder="请选择">
+          <el-option
+            v-for="item in backXingHaooptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option
+        ></el-select>
+      </div>
+    </div>
+  </div>
+</template>
+  
+  <script>
+export default {
+  data() {
+    return {
+      brandvalue: "",
+      brandoptions: [],
+      modelvalue: "",
+      modeloptions: [],
+      frontPingPaiValue: "",
+      frontPingPaioptions: [],
+      frontXingHaoValue: "",
+      frontXingHaooptions: [],
+      backXingHaoValue: "",
+      backXingHaooptions: [],
+      backPingPaiValue: "",
+      backPingPaioptions: [],
+    };
+  },
+};
+</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>

+ 293 - 0
src/views/ledger/maintain.vue

@@ -0,0 +1,293 @@
+<template>
+  <div class="global-variable">
+    <div class="inquire">
+      <div class="condition">
+        <p>部件名称:</p>
+        <el-input v-model="nameOfparts" size="small"></el-input>
+        <el-button type="primary" size="small">查询</el-button>
+      </div>
+      <el-button plain size="small" @click="newly">新增</el-button>
+    </div>
+    <div class="assemblyList">
+      <el-table :data="tableData" border style="width: 100%">
+        <el-table-column prop="date" label="部件模块"> </el-table-column>
+        <el-table-column prop="name" label="部件名称"> </el-table-column>
+        <el-table-column prop="name" label="部件编码"> </el-table-column>
+        <el-table-column prop="name" label="维护时间"> </el-table-column>
+        <el-table-column fixed="right" label="操作">
+          <template slot-scope="scope">
+            <el-button @click="handleClick(scope.row)" type="text" size="small"
+              >编辑</el-button
+            >
+            <el-button @click="handleClick(scope.row)" type="text" size="small"
+              >部件配置</el-button
+            >
+            <el-button @click="handleClick(scope.row)" type="text" size="small"
+              >品牌维护</el-button
+            >
+            <el-button @click="handleClick(scope.row)" type="text" size="small"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <el-dialog
+      title="新增部件"
+      :visible.sync="dialogVisible"
+      width="20%"
+      :before-close="handleClose"
+    >
+      <p style="margin-bottom: 20px">
+        部件模块:<el-select v-model="modulevalue" placeholder="请选择">
+          <el-option
+            v-for="item in moduleoptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </p>
+      <p style="margin-bottom: 20px">
+        部件名称:<el-select v-model="namevalue" placeholder="请选择">
+          <el-option
+            v-for="item in nameoptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </p>
+      <el-checkbox
+        style="display: block"
+        v-model="checked"
+        :true-label="1"
+        :false-label="0"
+        >品牌/型号</el-checkbox
+      >
+      <div class="button-container">
+        <el-button
+          class="but"
+          size="small"
+          type="primary"
+          @click="handleConfirm"
+        >
+          确定
+        </el-button>
+      </div>
+    </el-dialog>
+    <!-- 关联 -->
+    <el-drawer
+      title="新增"
+      :visible.sync="drawer"
+      size="22%"
+      :with-header="true"
+      class="drawers"
+    >
+      <div class="drawersDIV">
+        <el-input size="small " v-model="drawervalue"></el-input>
+        <el-button size="small" @click="newtype('1')">新增</el-button>
+        <el-table :data="tableData" border style="width: 100%">
+          <el-table-column prop="date" label="品牌"> </el-table-column>
+          <el-table-column prop="name" label="型号"> </el-table-column>
+          <el-table-column fixed="right" label="操作" width="100">
+            <template slot-scope="scope">
+              <el-button
+                @click="handleClick(scope.row)"
+                type="text"
+                size="small"
+                >编辑</el-button
+              >
+              <el-button type="text" size="small">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-drawer>
+
+    <el-dialog
+      title="新增部件"
+      :visible.sync="relevanceVisible"
+      width="20%"
+      :before-close="handleClose"
+    >
+      <p class="maintain">
+        品牌:<span class="one"
+          ><el-input v-model="brand" size="small"></el-input
+        ></span>
+      </p>
+      <p class="maintain">
+        型号:<span class="one"
+          ><el-input v-model="guige" size="small"></el-input
+        ></span>
+      </p>
+
+      <div class="button-container">
+        <el-button class="but" size="small" type="primary" @click="submit('2')">
+          确定
+        </el-button>
+      </div>
+    </el-dialog>
+    <!-- 非 -->
+    <el-drawer
+      title="新增"
+      :visible.sync="notdrawer"
+      size="22%"
+      :with-header="true"
+      class="drawers"
+    >
+      <div class="drawersDIV">
+        <el-input size="small" v-model="drawervalue"></el-input>
+        <el-button size="small" @click="newtype('2')">新增</el-button>
+        <el-table :data="tableData" border style="width: 100%">
+          <el-table-column prop="name" label="型号"> </el-table-column>
+          <el-table-column fixed="right" label="操作" width="100">
+            <template slot-scope="scope">
+              <el-button
+                @click="handleClick(scope.row)"
+                type="text"
+                size="small"
+                >编辑</el-button
+              >
+              <el-button type="text" size="small">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-drawer>
+
+    <el-dialog
+      title="新增部件"
+      :visible.sync="maintainVisible"
+      width="22%"
+      :before-close="handleClose"
+    >
+      <p class="maintain">
+        类型:<span class="one"><el-input size="small"></el-input></span
+        ><span class="Sptwo">
+          <el-button
+            class="but"
+            size="small"
+            type="primary"
+            @click="submit('1')"
+          >
+            确定
+          </el-button></span
+        >
+      </p>
+    </el-dialog>
+  </div>
+</template>
+  
+  <script>
+export default {
+  data() {
+    return {
+      nameOfparts: "",
+      tableData: [],
+      drawer: false,
+      notdrawer: false,
+      dialogVisible: false,
+      maintainVisible: false,
+      relevanceVisible: false,
+      modulevalue: "",
+      moduleoptions: [],
+      namevalue: "",
+      nameoptions: [],
+      checked: "0",
+      drawervalue: "",
+      brand: "",
+      guige: "",
+    };
+  },
+  methods: {
+    newly() {
+      this.dialogVisible = true;
+    },
+    handleClose() {
+      this.dialogVisible = false;
+    },
+    handleConfirm() {
+      this.dialogVisible = false;
+
+      if (this.checked == "0") {
+        console.log(this.checked);
+        this.notdrawer = true;
+      }
+      if (this.checked == "1") {
+        console.log(this.checked);
+        this.drawer = true;
+      }
+    },
+    handleClick() {},
+    newtype(type) {
+      if (type === "1") {
+        this.relevanceVisible = true;
+      } else if (type === "2") {
+        this.maintainVisible = true;
+      }
+    },
+    submit(type) {
+      if (type === "1") {
+        this.maintainVisible = false;
+      } else if (type === "2") {
+        this.relevanceVisible = false;
+      }
+    },
+  },
+};
+</script>
+  
+  <style lang="scss" scoped>
+.inquire {
+  display: flex;
+  justify-content: space-between;
+  .condition {
+    display: flex;
+    p {
+      width: 80px;
+      line-height: 32px;
+    }
+    .el-input {
+      width: 220px;
+      margin-right: 20px;
+    }
+  }
+}
+
+.assemblyList {
+  margin: 20px 0;
+}
+.button-container {
+  display: flex;
+  justify-content: center; /* Center the button horizontally */
+  margin-top: 20px; /* Add some space above the button */
+  .but {
+    width: 100px;
+  }
+}
+.drawers {
+  .drawersDIV {
+    padding: 0 20px;
+  }
+  .el-input {
+    width: 220px;
+    margin-right: 20px;
+  }
+  .el-button {
+    margin-bottom: 20px;
+  }
+}
+.maintain {
+  margin-bottom: 20px;
+  .el-input {
+    width: 220px;
+  }
+  .Sptwo {
+    margin-left: 10px;
+  }
+}
+</style>

+ 42 - 10
src/views/ledger/modules.vue

@@ -1,23 +1,55 @@
 <template>
-  <div class="global-variable" >
-<div class="condition">
-    <p>所属风场:<el-select ></el-select></p>
-    <p>选择机型:<el-select></el-select></p>
-</div>
+  <div class="global-variable">
+    <div class="condition">
+      <p>
+        支撑形式:<el-select clearable v-model="plankvalue" placeholder="请选择">
+          <el-option
+            v-for="item in plankoptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option
+        ></el-select>
+      </p>
+ 
+    </div>
+    <h2 class="TitleH2">主轴</h2>
+    <zhuzhou></zhuzhou>
+    <h2 class="TitleH2">齿轮箱</h2>
+   <chilunxiang> </chilunxiang>
+   <h2 class="TitleH2">发电机</h2>
+   <fadianji></fadianji>
   </div>
 </template>
 
 <script>
+import Chilunxiang from './componentBJ/chilunxiang.vue';
+import Fadianji from './componentBJ/fadianji.vue';
+import zhuzhou from "./componentBJ/zhuzhou.vue";
 export default {
-
-}
+  components: { zhuzhou ,Chilunxiang, Fadianji},
+  data(){
+    return{
+      plankoptions:[],
+      plankvalue:"",
+ 
+    }
+  }
+};
 </script>
 
 <style lang="scss" scoped>
-.condition{
-display: flex;
-p{
+.condition {
+  display: flex;
+  p {
     margin-right: 20px;
+  }
 }
+
+.TitleH2 {
+  font-weight: 800;
+  font-size: 28px;
+  margin: 20px 0;
 }
 </style>

+ 1 - 0
src/views/performance/components/custonAsCom/luckySheet.vue

@@ -26,6 +26,7 @@
 
 <script>
 import luckysheet from "luckysheet";
+// import LuckyExcel from "luckyexcel";
 import {
   getDataFromIndexedDB,
   storeSetData,