2 Commits 7b498750ae ... 93153e41e5

Author SHA1 Message Date
  xiaohuan 93153e41e5 Merge branch 'master' of http://39.106.8.246:3003/web/ibms 5 years ago
  xiaohuan bd34b2e964 11 5 years ago

+ 11 - 8
package.json

@@ -10,16 +10,19 @@
         "build": "node build/build.js"
     },
     "dependencies": {
+        "@handsontable-pro/vue": "^3.1.1",
+        "@handsontable/vue": "^4.0.0",
         "axios": "^0.18.0",
-        "echarts": "^4.1.0",
-        "element-ui": "^2.6.1",
+        "echarts": "^4.2.1",
+        "element-ui": "^2.8.2",
         "font-awesome": "^4.7.0",
+        "handsontable": "^7.0.3",
         "handsontable-pro": "^3.0.0",
         "jquery": "^3.3.1",
         "vue": "^2.5.2",
         "vue-axios": "^2.1.4",
         "vue-router": "^3.0.1",
-        "vuex": "^3.1.0"
+        "vuex": "^3.1.1"
     },
     "devDependencies": {
         "ajv": "^6.9.1",
@@ -34,7 +37,7 @@
         "babel-preset-stage-2": "^6.22.0",
         "chalk": "^2.0.1",
         "copy-webpack-plugin": "^4.0.1",
-        "css-loader": "^0.28.0",
+        "css-loader": "^2.1.1",
         "extract-text-webpack-plugin": "^3.0.0",
         "file-loader": "^1.1.4",
         "friendly-errors-webpack-plugin": "^1.6.1",
@@ -42,8 +45,8 @@
         "less": "^3.9.0",
         "less-loader": "^4.1.0",
         "node-notifier": "^5.1.2",
-        "node-sass": "^4.11.0",
-        "optimize-css-assets-webpack-plugin": "^3.2.0",
+        "node-sass": "^4.12.0",
+        "optimize-css-assets-webpack-plugin": "^5.0.1",
         "ora": "^1.2.0",
         "portfinder": "^1.0.13",
         "postcss-import": "^11.0.0",
@@ -55,12 +58,12 @@
         "shelljs": "^0.7.6",
         "swiper": "^4.0.0",
         "uglifyjs-webpack-plugin": "^1.1.1",
-        "url-loader": "^0.5.8",
+        "url-loader": "^1.1.2",
         "vue-loader": "^13.3.0",
         "vue-style-loader": "^3.0.1",
         "vue-template-compiler": "^2.5.2",
         "webpack": "^3.6.0",
-        "webpack-bundle-analyzer": "^2.9.0",
+        "webpack-bundle-analyzer": "^3.3.2",
         "webpack-dev-server": "^2.9.1",
         "webpack-merge": "^4.1.0"
     },

+ 9 - 1
src/router/system.js

@@ -35,6 +35,7 @@ import dialogAssets from '@/views/ledger/system/addsystem'
 import facilityLedger from '@/views/ledger/facility/index'
 import partsLedger from '@/views/ledger/facility/parts/index'
 import partsmanageLedger from '@/views/ledger/facility/partsmanage/index'
+import addparts from '@/views/ledger/facility/partsmanage/addparts/index'
 import dialogDevice from '@/views/ledger/facility/addfacility'
 import propertyLedger from '@/views/ledger/property/index'
 import dialogSystem from '@/views/ledger/property/addproperty'
@@ -163,9 +164,16 @@ export default [
                 path: 'partsmanage',
                 name: 'partsmanageLedger',
                 component: partsmanageLedger,
-                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '设备清单 / 管理部件' }] }
+                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '设备清单 / 管理部件' }] },
             },
             {
+                path: 'addparts',
+                name: 'addparts',
+                component: addparts,
+                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility/partsmanage' }, { label: '设备清单 / 管理部件 / 添加部件' }] },
+            },
+            
+            {
                 path: 'facility/addfacility',
                 name: 'dialogDevice',
                 component: dialogDevice,

+ 692 - 0
src/views/ledger/facility/partsmanage/addparts/index.vue

@@ -0,0 +1,692 @@
+<template>
+  <div class="container">
+    <!-- 头部 -->
+    <div class="table-top">
+      <div class="table-top-left">
+        当前选择的部件类型:
+        <span>xxx</span>
+      </div>
+      <div class="table-top-right">
+        <div class="table-top-right-none">
+           <el-checkbox v-model="checked">隐藏自动填充的信息</el-checkbox>
+        </div>
+        <div class="table-top-right-add">
+          增加
+          <span>1</span>个水泵
+          <el-button type="primary" style="width:80px" plain>增加</el-button>
+        </div>
+      </div>
+    </div>
+    <!-- 表格 -->
+    <div class="table-center">
+      <div class="tableBox">
+        <handson-table ref="tablemain"></handson-table>
+      </div>
+      <el-button type="info">创建部件</el-button>
+    </div>
+    <!-- 底部 -->
+    <div class="table-bottom">
+      <el-pagination
+        class="center"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="page.pageNumber"
+        :page-sizes="page.pageSizes"
+        :page-size="page.pageSize"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="page.total"
+      ></el-pagination>
+    </div>
+  </div>
+</template>
+<script>
+import tools from "@/utils/scan/tools";
+import handsonUtils from "@/utils/hasontableUtils";
+import showTools from "@/utils/handsontable/notShow";
+import text from "@/utils/handsontable/mainText";
+import handsonTable from "@/components/common/handsontable";
+import { mapGetters, mapActions } from "vuex";
+export default {
+  components:{
+    handsonTable
+  },
+  data() {
+    return {
+       checked: true, //显示信息点
+      partsId: "",
+      tableExample: null,
+      page: {
+        pageSize: 20,
+        pageSizes: [10, 20, 50, 100],
+        pageNumber: 1,
+        total: 400
+      },
+      tableData: [
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },{
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        },
+        {
+          operation: "查看详情",
+          demo1: "小龙",
+          demo2: "三娘",
+          info1: "阿党",
+          info2: "阿腾",
+          info3: "王靖",
+          info4: "文强",
+          info5: "小白"
+        }
+      ],
+      tableHeader: ["信息1", "信息2", "信息3", "信息4", "信息5"],
+      tableHeaderName: [
+        {
+          data: "info1"
+        },
+        {
+          data: "info2"
+        },
+        {
+          data: "info3"
+        },
+        {
+          data: "info4"
+        },
+        {
+          data: "info5"
+        }
+      ],
+      partsTypeList: [
+        {
+          id: "011A",
+          name: "部件A",
+          num: 12
+        },
+        {
+          id: "011B",
+          name: "部件B",
+          num: 5
+        },
+        {
+          id: "011C",
+          name: "部件C",
+          num: 8
+        },
+        {
+          id: "011AD",
+          name: "部件D",
+          num: 7
+        }
+      ]
+    };
+  },
+  mounted() {
+    this.createTable();
+    this.partsId = this.partsTypeList[0].id;
+  },
+  methods: {
+    //获取表头
+    getHeaderData() {
+      this.changeCader();
+      if (this.mess.deviceId) {
+        getTableHeader({
+          code: this.mess.deviceId,
+          ProjId: this.projectId
+        }).then(res => {
+          this.headers = res.data.Content;
+          this.getMain();
+        });
+      }
+    },
+    createTable() {
+      const params = {
+        Filters: `id=${this.partsId}`,
+        Orders: "",
+        PageNumber: this.page.pageNumber,
+        PageSize: this.page.pageSize,
+        Projection: []
+      };
+      let settings = {
+        data: this.tableData,
+        colHeaders: this.header,
+        columns: this.type,
+        rowHeights: 30,
+        maxRows: this.tableData.length,
+        fixedRowsTop: 1,
+        fixedColumnsLeft: 4,
+        contextMenu: {
+          items: {
+            remove_row: {
+              name: "删除设备"
+            }
+          }
+        },
+        // 事件
+        afterChange: this.tdChange, //修改后
+        afterFilter: this.trimmedRows, //排序前
+        afterRemoveRow: this.romoveFm, //右键删除
+        afterOnCellMouseDown: this.handleTdClick //鼠标点击
+      };
+      this.$nextTick(() => {
+        console.log(this.$refs.tablemain);
+        this.tableExample = this.$refs.tablemain.init(settings);
+      });
+    },
+    handleTdClick(el, rowArr) {
+      //点击表格的操作
+      //点击的是表头
+      if (rowArr.row < 0) {
+        return;
+      }
+      //被筛选过后的数组
+      let trimmedArr = this.trimmedRows();
+      //是否启用了排序
+      let isSort = this.tableExample.getPlugin("columnSorting").isSorted();
+      if (trimmedArr.length && isSort) {
+        let sortArr = this.myHotArr.getPlugin("columnSorting").rowsMapper
+          .__arrayMap;
+        let infos = this.tableData[trimmedArr[sortArr[rowArr.row]]];
+        this.getInfors(infos, { row: sortArr[rowArr.row], col: rowArr.col });
+      } else if (isSort) {
+        //排序后的数组
+        let sortArr = this.tableExample.getPlugin("columnSorting").rowsMapper
+          .__arrayMap;
+        let infos = this.tableData[sortArr[rowArr.row]];
+        this.getInfors(infos, { row: sortArr[rowArr.row], col: rowArr.col });
+      } else if (trimmedArr.length) {
+        let infos = this.tableData[trimmedArr[rowArr.row]];
+        this.getInfors(infos, { row: trimmedArr[rowArr.row], col: rowArr.col });
+      } else {
+        let infos = this.tableData[rowArr.row];
+        this.getInfors(infos, rowArr);
+      }
+    },
+    //获取到了正确的信息
+    getInfors(infos, row) {
+      //其他的开始判断
+      let val = this.tableExample.colToProp(row.col);
+      this.row = row.row;
+      this.messKey = val;
+      this.systemId = infos.id;
+      debugger;
+      if (val == "operation") {
+        window.open(
+          `http://47.94.89.44:8058/spread?id=${infos.id}&pid=${
+            this.projectId
+          }&secret=${this.secret}`,
+          "_blank"
+        );
+        // this.iframeSrc =
+        //   process.env.BASE_URL +
+        //   ":8889/#/details?perjectId=" +
+        //   this.projectId +
+        //   "&secret=" +
+        //   this.secret +
+        //   "&FmId=" +
+        //   infos.id +
+        //   "&type=1&code=" +
+        //   infos.category.substring(2, 6);
+        // this.dialog.details = true
+      }
+
+      //图片弹窗
+      if (
+        val == "infos.InstallPic" ||
+        val == "infos.InstallDrawing" ||
+        val == "infos.Nameplate" ||
+        val == "infos.Drawing"
+      ) {
+        if (this.onlyRead) {
+          this.dialog.lookPic = true;
+          this.picsArr = this.tableData[row.row].infos
+            ? this.tableData[row.row].infos[val.split(".")[1]]
+              ? this.tableData[row.row].infos[val.split(".")[1]]
+              : []
+            : [];
+        } else {
+          this.imgsArr = this.tableData[row.row].infos
+            ? this.tableData[row.row].infos[val.split(".")[1]]
+              ? this.tableData[row.row].infos[val.split(".")[1]]
+              : []
+            : [];
+          this.dialog.uploadImgs = true;
+        }
+      }
+
+      if (val == "linkSystem") {
+        this.dialog.systemType = true;
+      }
+
+      if (val == "linkName" && this.onlyRead) {
+        this.$router.push({ name: "partsLedger" });
+      } else if (val == "linkName" && !this.onlyRead) {
+        this.$router.push({ name: "partsLedger" });
+      }
+
+      if (val == "infos.Pic") {
+        this.picsArr = this.tableData[row.row].infos
+          ? this.tableData[row.row].infos[val.split(".")[1]]
+            ? this.tableData[row.row].infos[val.split(".")[1]]
+            : []
+          : [];
+        if (this.onlyRead) {
+          this.dialog.lookPic = true;
+        } else {
+          this.dialog.pic = true;
+        }
+      }
+      if (
+        val == "infos.InsuranceFile" ||
+        val == "infos.Archive" ||
+        val == "infos.CheckReport"
+      ) {
+        this.filesArr = this.tableData[row.row].infos
+          ? this.tableData[row.row].infos[val.split(".")[1]]
+            ? this.tableData[row.row].infos[val.split(".")[1]]
+            : []
+          : [];
+        this.dialog.uploadFiles = true;
+      }
+      if (val == "linkName" && this.linkNameFalg) {
+        this.category = this.tableData[row.row];
+        this.dialog.changeRea = true;
+      }
+      if (val == "infos.EquipQRCode") {
+        this.qrcodeUrl = this.tableData[row.row].infos.EquipQRCode;
+        if (!!this.qrcodeUrl) {
+          this.dialog.qrcode = true;
+        } else {
+          this.$message("此设备没有设备二维码");
+        }
+      }
+
+      if (this.onlyRead) {
+        return;
+      }
+
+      if (val == "infos.DPManufacturerID") {
+        this.dialog.firm = true;
+      }
+
+      if (val == "infos.SupplierContractID") {
+        let falg = null;
+        if (!!this.tableData[row.row].infos) {
+          if (!!this.tableData[row.row].infos.DPSupplierID) {
+            falg = this.tableData[row.row].infos.DPSupplierID.split("-")[0];
+          }
+        }
+        if (!!falg) {
+          this.id = falg;
+          this.dialog.supply = true;
+        } else {
+          this.$message("请先选择供应商");
+        }
+      }
+
+      if (val == "infos.InsuranceNum") {
+        //选择保单
+        let falg = null;
+        if (!!this.tableData[row.row].infos) {
+          if (!!this.tableData[row.row].infos.DPInsurerID) {
+            falg = this.tableData[row.row].infos.DPInsurerID.split("-")[0];
+          }
+        }
+        if (!!falg) {
+          this.id = falg;
+          this.dialog.guarantee = true;
+        } else {
+          this.$message("请先选择保险商");
+        }
+      }
+
+      if (val == "infos.DPSupplierID") {
+        if (!!infos.linkId) {
+          this.dialog.supplier = true;
+        } else {
+          this.$message("该设备无关联资产");
+        }
+      }
+
+      if (val == "infos.DPMaintainerID") {
+        if (!!infos.linkId) {
+          this.dialog.maintainer = true;
+        } else {
+          this.$message("该设备无关联资产");
+        }
+      }
+
+      if (val == "infos.DPInsurerID") {
+        if (!!infos.linkId) {
+          this.dialog.insurer = true;
+        } else {
+          this.$message("该设备无关联资产");
+        }
+      }
+    },
+    //获取被筛选掉的行号
+    trimmedRows() {
+      // var plugin = hot.getPlugin('trimRows').trimmedRows;//获取被筛选掉的行号
+      var plugin = this.tableExample.getPlugin("trimRows").trimmedRows;
+      let dataLength = this.tableData.length;
+      let dataArr = new Array();
+      for (let i = 0; i < dataLength; i++) {
+        dataArr.push(i);
+      }
+      if (plugin.length <= 0) {
+        dataArr = undefined;
+      } else {
+        dataArr = this.array_diff(dataArr, plugin);
+      }
+      return dataArr || [];
+      // var DataArray = new Array();
+
+      // for (var i = 0; i < plugin.length; i++) {
+      //     // 通过行号获取数据
+      //     DataArray.push(this.hot.getSourceDataAtRow(plugin[i]));
+      // }
+    },
+    //去除数组中相同的元素
+    array_diff(a, b) {
+      for (var i = 0; i < b.length; i++) {
+        for (var j = 0; j < a.length; j++) {
+          if (a[j] == b[i]) {
+            a.splice(j, 1);
+            j = j - 1;
+          }
+        }
+      }
+      return a;
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+    }
+  },
+  computed: {
+    ...mapGetters("layout", ["projectId", "secret", "userId"]),
+    header() {
+      this.tableHeader.unshift(...["操作", "关联的资产", "部件本地名称"]);
+      return this.tableHeader;
+    },
+    type() {
+      this.tableHeaderName.unshift(
+        ...[
+          {
+            data: "operation",
+            renderer: tools.lookDetails,
+            readOnly: true
+          },
+          {
+            data: "demo1"
+          },
+          {
+            data: "demo2"
+          }
+        ]
+      );
+      return this.tableHeaderName;
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.container {
+  border: 1px solid #333333;
+  padding: 15px;
+  position: relative;
+  .table-top {
+    display: flex;
+    justify-content: space-between;
+    .table-top-right-none {
+      display: inline-block;
+      border-right: 1px solid #333333;
+      margin-right: 20px;
+      padding-right: 20px;
+    }
+    .table-top-right-add {
+      display: inline-block;
+      span {
+        display: inline-block;
+        border: 1px solid #333333;
+        padding: 0 10px;
+        margin: 0 5px;
+        height: 20px;
+        line-height: 20px;
+        vertical-align: middle;
+        cursor: pointer;
+      }
+      .el-button {
+        margin-left: 15px;
+      }
+    }
+  }
+  .table-center {
+    height: 100%;
+    margin: 20px 0;
+    overflow: hidden;
+    .tableBox {
+      height: calc(100% - 130px);
+    }
+    .el-button{
+      display: block;
+      margin: 10px auto 0 auto;
+    }
+  }
+  .table-bottom {
+    overflow: hidden;
+    width: 99%;
+    position: absolute;
+    bottom: 15px;
+    left: 0;
+    .el-pagination{
+      float: right;
+    }
+  }
+}
+</style>

+ 5 - 1
src/views/ledger/facility/partsmanage/index.vue

@@ -12,7 +12,7 @@
     </div>
     <el-row class="right">
       <el-checkbox v-model="checked">隐藏自动填充的信息</el-checkbox>
-      <el-button>添加部件</el-button>
+      <el-button @click="addparts">添加部件</el-button>
       <el-button>刷新</el-button>
       <el-button>撤销</el-button>
     </el-row>
@@ -304,6 +304,10 @@ export default {
       }
       
     },
+    addparts(){
+       this.$router.push({ name: 'addparts', params: { facilityId: 1 }});
+       console.log("dianjile")
+    },
     createTable() {
       const params = {
         Filters: `id=${this.partsId}`,