|
@@ -0,0 +1,852 @@
|
|
|
+<template>
|
|
|
+ <div style="height: calc(100% - 44.5px); padding: 0px 10px 10px; box-sizing: border-box">
|
|
|
+ <div class="hanson-bar">
|
|
|
+ <div style="float: right; overflow: hidden">
|
|
|
+ <el-checkbox v-model="isShowDelivered" @change="getHeaderData(mess)">显示有值信息点</el-checkbox>
|
|
|
+ <span style="margin-left: 10px">当前筛选条件下共{{ page.total || "--" }}系统</span>
|
|
|
+ </div>
|
|
|
+ <el-select v-model="onlyRead" @change="getHeaderData(mess)" style="width: 100px; margin-right: 20px; vertical-align: bottom">
|
|
|
+ <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="showType" @change="handleChangeShowType" style="width: 100px; margin-right: 10px; vertical-align: bottom">
|
|
|
+ <el-option v-for="item in showTypes" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-select
|
|
|
+ v-show="mess.deviceId"
|
|
|
+ v-model="showInfoList"
|
|
|
+ filterable
|
|
|
+ clearable
|
|
|
+ multiple
|
|
|
+ collapse-tags
|
|
|
+ @change="initTable"
|
|
|
+ style="width: 200px; margin-right: 8px; vertical-align: bottom"
|
|
|
+ placeholder="请选择信息点"
|
|
|
+ >
|
|
|
+ <el-option v-for="item in headerOptions" :key="item.code" :label="item.name" :value="item.code"> </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-button size="small" style="width: 80px" @click="addDevice" icon="iconfont icon-tianjia">添加系统</el-button>
|
|
|
+ <el-button size="small" style="width: 80px" @click="reset" icon="iconfont icon-shuaxin">刷新</el-button>
|
|
|
+ <el-button v-show="!onlyRead" size="small" style="width: 80px" @click="undo" icon="iconfont icon-undo">撤销</el-button>
|
|
|
+ </div>
|
|
|
+ <qrcode :dialog="myDialog" :addBody="true" ref="qrcode"></qrcode>
|
|
|
+ <upload-files-dialog ref="upload" @changeFile="fileChange" :keysArr="filesArr" firmDataType="row" :dialog="myDialog"></upload-files-dialog>
|
|
|
+ <upload-img-dialog
|
|
|
+ :read="onlyRead ? true : false"
|
|
|
+ @changeFile="imgChange"
|
|
|
+ :keysArr="imgsArr"
|
|
|
+ firmDataType="row"
|
|
|
+ :dialog="myDialog"
|
|
|
+ ></upload-img-dialog>
|
|
|
+ <pic-dialog :dialog="myDialog" :keysArr="picsArr" @change="changePics"></pic-dialog>
|
|
|
+ <div class="center middle_sty" style="height: 91%" v-show="!mess.deviceId && (!tableData || !tableData.length)">
|
|
|
+ <p><i class="icon-wushuju iconfont"></i>请选择系统类型</p>
|
|
|
+ </div>
|
|
|
+ <div class="center middle_sty" style="height: 91%" v-show="mess.deviceId && (!tableData || !tableData.length)">
|
|
|
+ <p><i class="icon-wushuju iconfont"></i>暂无数据</p>
|
|
|
+ </div>
|
|
|
+ <div v-show="mess.deviceId && tableData && tableData.length" v-loading="loading" id="handsontable" ref="handsontable"></div>
|
|
|
+ <div v-show="mess.deviceId && tableData && tableData.length" class="right">
|
|
|
+ <my-pagination @change="getTableData" :page="page"></my-pagination>
|
|
|
+ </div>
|
|
|
+ <!-- <dialog-assets :assetType="[this.mess.deviceId]" @close="getClose" v-if="myDialog.addDevice" ref="assets" :dialog="myDialog"></dialog-assets> -->
|
|
|
+ <details-dialog :iframeSrc="iframeSrc" v-if="myDialog.details" :dialog="myDialog"></details-dialog>
|
|
|
+ <system-relevance @close="reset" :id="systemId" :dialog="myDialog"></system-relevance>
|
|
|
+ <!-- 多选枚举类型维护 -->
|
|
|
+ <menum :dialog="myDialog" :updateInfoData="updateInfoData" :updateInput="updateInput" @change="handleChangeMenum"></menum>
|
|
|
+ <!-- 不支持的输入方式 -->
|
|
|
+ <el-dialog title="临时维护信息点" :visible.sync="myDialog.update" @close="handleCloseUpdate" width="670px">
|
|
|
+ <el-row>
|
|
|
+ 该信息点未定义对应组件,现在维护数据不确定后续是否可用。如确实需要维护,请点击
|
|
|
+ <el-link @click="updateInputShow = true" type="primary" :underline="false">继续维护</el-link>
|
|
|
+ 。
|
|
|
+ </el-row>
|
|
|
+ <el-row style="margin-top: 20px" v-show="updateInputShow">
|
|
|
+ <el-input type="textarea" :autosize="{ minRows: 4, maxRows: 8 }" placeholder="请输入内容" v-model="updateInput"></el-input>
|
|
|
+ </el-row>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="myDialog.update = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="handleClickUpdate">确 认</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- 关联楼层 -->
|
|
|
+ <editSysfloor ref="editFloor" @relateSuccess="relateSuccess"></editSysfloor>
|
|
|
+ <!-- 新增系统 -->
|
|
|
+ <el-dialog title="确定新增系统的类型" :visible.sync="myDialog.addDevice" width="30%">
|
|
|
+ <el-row>
|
|
|
+ <my-cascader ref="cascader" @change="changeAddType" :all="true"></my-cascader>
|
|
|
+ </el-row>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="toAddDevice">下 一 步</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { BeatchQueryParam, deleteGeneralSys, querySysLinkBuild, updateGeneralSys } from "@/api/scan/request";
|
|
|
+import { getDataDictionary, deliveredInfos } from "@/api/dict";
|
|
|
+
|
|
|
+import myCascader from "@/components/ledger/lib/system";
|
|
|
+import tools from "@/utils/scan/tools";
|
|
|
+import handsonUtils from "@/utils/scan/hasontableUtils";
|
|
|
+import showTools from "@/utils/handsontable/notShow";
|
|
|
+import qrcode from "@/components/business_space/lib/qrcode";
|
|
|
+import uploadFilesDialog from "@/components/dialogs/list/filesDialog";
|
|
|
+import uploadImgDialog from "@/components/dialogs/list/uploadImgDialog";
|
|
|
+import picDialog from "@/components/business_space/dialogs/list/picDialog";
|
|
|
+import myPagination from "@/components/common/myPagination";
|
|
|
+import detailsDialog from "@/components/business_space/lib/detailsDia";
|
|
|
+import systemRelevance from "@/components/ledger/tableTransfers";
|
|
|
+import Handsontable from "handsontable-pro";
|
|
|
+import text from "@/utils/handsontable/mainText";
|
|
|
+import "handsontable-pro/dist/handsontable.full.css";
|
|
|
+import editSysfloor from "@/components/ledger/lib/editSysFloor";
|
|
|
+import menum from "@/components/dialogs/list/menum";
|
|
|
+
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ qrcode, //二维码页面
|
|
|
+ uploadFilesDialog,
|
|
|
+ uploadImgDialog,
|
|
|
+ picDialog,
|
|
|
+ myPagination,
|
|
|
+ detailsDialog,
|
|
|
+ systemRelevance,
|
|
|
+ myCascader,
|
|
|
+ editSysfloor,
|
|
|
+ menum,
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters("layout", ["projectId", "secret", "userId", "group_code"]),
|
|
|
+ showTypes() {
|
|
|
+ return this.onlyRead
|
|
|
+ ? [
|
|
|
+ { value: "Visible", label: "只看采集信息" },
|
|
|
+ { value: "all", label: "全部" },
|
|
|
+ ]
|
|
|
+ : [
|
|
|
+ { value: "Visible", label: "只看采集信息" },
|
|
|
+ { value: "all", label: "全部" },
|
|
|
+ ];
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ options: [
|
|
|
+ {
|
|
|
+ value: true,
|
|
|
+ label: "只读模式",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: false,
|
|
|
+ label: "编辑模式",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ tableData: [],
|
|
|
+ mess: {},
|
|
|
+ tableHeader: null,
|
|
|
+ page: {
|
|
|
+ size: 50,
|
|
|
+ sizes: [10, 30, 50, 100, 150, 200],
|
|
|
+ total: 0,
|
|
|
+ currentPage: 1,
|
|
|
+ },
|
|
|
+ myDialog: {
|
|
|
+ qrcode: false, //二维码弹窗
|
|
|
+ uploadFiles: false, //上传文件
|
|
|
+ uploadImgs: false, //上传单个图片
|
|
|
+ pic: false, //多个图片
|
|
|
+ addDevice: false,
|
|
|
+ details: false, //详情页
|
|
|
+ relevance: false, //关联设备
|
|
|
+ update: false, //临时维护信息点
|
|
|
+ menum: false, //临时多选枚举类型信息点
|
|
|
+ },
|
|
|
+ row: null, //被修改的row
|
|
|
+ filesArr: [], //保存临时的文件key
|
|
|
+ messKey: null,
|
|
|
+ imgsArr: [], //临时保存的图片key数组
|
|
|
+ picsArr: [], //临时设备图片keys数组
|
|
|
+ noShowList: ["SysID", "SysName"],
|
|
|
+ copyMain: null,
|
|
|
+ iframeSrc: "",
|
|
|
+ systemId: "",
|
|
|
+ onlyRead: true,
|
|
|
+ showType: "Visible",
|
|
|
+ linkNameFalg: false,
|
|
|
+ qrcodeUrl: "", //二维码图片地址
|
|
|
+ loading: false,
|
|
|
+ addData: {}, //添加设备选择的设备类型
|
|
|
+ inputMap: {
|
|
|
+ flowBuild: {
|
|
|
+ editable: true,
|
|
|
+ code: "flowBuild",
|
|
|
+ name: "建筑楼层",
|
|
|
+ path: "flowBuild",
|
|
|
+ category: "STATIC",
|
|
|
+ dataType: "ENUM",
|
|
|
+ },
|
|
|
+ }, //信息点和输入方式映射表
|
|
|
+ updateInputShow: false, //是否显示临时维护输入框
|
|
|
+ updateInfoData: {}, //当前信息点信息
|
|
|
+ updateInfoPoint: "", //临时维护信息点
|
|
|
+ updateInput: "", //临时维护信息点值
|
|
|
+ headerOptions: [], // 信息点选项列表
|
|
|
+ showInfoList: [], // 筛选的信息点列表
|
|
|
+ isShowDelivered: false, // 是否显示已交付的信息点
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {},
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ //触发父组件change
|
|
|
+ getClose(val) {
|
|
|
+ this.$emit("close", val);
|
|
|
+ },
|
|
|
+ //获取表头
|
|
|
+ getHeaderData(code) {
|
|
|
+ this.mess = code;
|
|
|
+
|
|
|
+ if (this.mess.deviceId) {
|
|
|
+ // 清空筛选的信息点列表
|
|
|
+ this.showInfoList = [];
|
|
|
+ // 查询已交付的信息点
|
|
|
+ if (this.isShowDelivered) {
|
|
|
+ this.getDeliveredInfos(this.mess.deviceId);
|
|
|
+ } else {
|
|
|
+ // 查询全部信息点
|
|
|
+ this.getDataDictionary(this.mess.deviceId);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 查询已交付的信息点
|
|
|
+ * @param classCode 设备类型
|
|
|
+ */
|
|
|
+ getDeliveredInfos(classCode) {
|
|
|
+ let params = {
|
|
|
+ classCode: classCode,
|
|
|
+ objType: "system",
|
|
|
+ };
|
|
|
+ if (this.mess.buildId == "noKnow") {
|
|
|
+ params.buildingId = `isNull`;
|
|
|
+ } else if (this.mess.buildId && this.mess.buildId != "all") {
|
|
|
+ params.buildingId = `${this.mess.buildId}`;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.mess.floorId == "noKnow") {
|
|
|
+ params.floorId = `isNull`;
|
|
|
+ } else if (this.mess.floorId && this.mess.floorId != "all") {
|
|
|
+ params.floorId = `${this.mess.floorId}`;
|
|
|
+ }
|
|
|
+ deliveredInfos(params, (res) => {
|
|
|
+ this.tableHeader = res.content;
|
|
|
+ this.codeToDataSource = {};
|
|
|
+ this.tableHeader.forEach((item) => {
|
|
|
+ if (item.path) {
|
|
|
+ this.inputMap[item.path] = item;
|
|
|
+ }
|
|
|
+ if (item.dataSource) {
|
|
|
+ try {
|
|
|
+ this.codeToDataSource[item.code] = {};
|
|
|
+ item.dataSource.forEach((dic) => {
|
|
|
+ this.codeToDataSource[item.code][dic.code] = dic.name;
|
|
|
+ });
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.getTableData();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 查询全部信息点
|
|
|
+ * @param classCode 设备类型
|
|
|
+ */
|
|
|
+ getDataDictionary(classCode) {
|
|
|
+ let params = {
|
|
|
+ type: classCode,
|
|
|
+ orders: "sort asc, name desc",
|
|
|
+ };
|
|
|
+ getDataDictionary(params, (res) => {
|
|
|
+ this.tableHeader = res.content;
|
|
|
+ this.codeToDataSource = {};
|
|
|
+ this.tableHeader.forEach((item) => {
|
|
|
+ if (item.path) {
|
|
|
+ this.inputMap[item.path] = item;
|
|
|
+ }
|
|
|
+ if (item.dataSource) {
|
|
|
+ try {
|
|
|
+ this.codeToDataSource[item.code] = {};
|
|
|
+ item.dataSource.forEach((dic) => {
|
|
|
+ this.codeToDataSource[item.code][dic.code] = dic.name;
|
|
|
+ });
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.getTableData();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ changeWatch() {
|
|
|
+ this.reset();
|
|
|
+ },
|
|
|
+ //获取主体数据
|
|
|
+ getTableData() {
|
|
|
+ let _this = this;
|
|
|
+ this.loading = true;
|
|
|
+ if (!!this.mess.deviceId) {
|
|
|
+ let param = {
|
|
|
+ data: {
|
|
|
+ pageSize: this.page.size,
|
|
|
+ orders: "createTime desc, localName desc, localId desc, id desc",
|
|
|
+ pageNumber: this.page.currentPage,
|
|
|
+ filters: `classCode='${this.mess.deviceId}'`,
|
|
|
+ },
|
|
|
+ };
|
|
|
+ if (this.mess.buildId == "noKnow") {
|
|
|
+ param.buildingId = 1;
|
|
|
+ } else if (this.mess.buildId && this.mess.buildId != "all") {
|
|
|
+ param.buildingId = this.mess.buildId;
|
|
|
+ }
|
|
|
+ if (this.mess.floorId == "noKnow") {
|
|
|
+ param.floorId = 1;
|
|
|
+ } else if (this.mess.floorId && this.mess.floorId != "all") {
|
|
|
+ param.floorId = this.mess.floorId;
|
|
|
+ }
|
|
|
+ querySysLinkBuild(param, (res) => {
|
|
|
+ this.loading = false;
|
|
|
+ _this.tableData = res.content;
|
|
|
+ _this.copyMain = tools.deepCopy(res.content);
|
|
|
+ _this.page.total = res.total;
|
|
|
+ if (res.content && res.content.length) {
|
|
|
+ if (this.onlyRead) {
|
|
|
+ this.getBatch(res.content);
|
|
|
+ }
|
|
|
+ _this.initTable();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //撤回
|
|
|
+ undo() {
|
|
|
+ if (this.tableData.length) {
|
|
|
+ this.hot.undo();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //刷新
|
|
|
+ reset() {
|
|
|
+ if (this.mess.deviceId) {
|
|
|
+ this.getTableData();
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: "请选择系统类型",
|
|
|
+ type: "warning",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //添加设备
|
|
|
+ addDevice() {
|
|
|
+ this.myDialog.addDevice = true;
|
|
|
+ if (this.mess.deviceId) {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.cascader.setValue(this.mess.deviceId);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //下一步
|
|
|
+ toAddDevice() {
|
|
|
+ if (this.addData.category) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/ledger/systemadd",
|
|
|
+ query: this.addData,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //选择设备类型-添加设备
|
|
|
+ changeAddType(val) {
|
|
|
+ this.addData.category = val.classCode;
|
|
|
+ this.addData.categoryName = val.categoryName;
|
|
|
+ this.addData.showType = this.showType;
|
|
|
+ console.log("val", val, this.addData);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 切换信息点查看类型
|
|
|
+ */
|
|
|
+ handleChangeShowType() {
|
|
|
+ this.showInfoList = [];
|
|
|
+ this.initTable();
|
|
|
+ },
|
|
|
+ //格式化表头
|
|
|
+ formatHeaderData(list) {
|
|
|
+ let arr = tools.copyArr(list);
|
|
|
+ let data = showTools.headerTextFilter(arr, "system", this.onlyRead, this.showType);
|
|
|
+ data.unshift("操作");
|
|
|
+ if (this.showType == "all") {
|
|
|
+ data.splice(3, 0, "所属建筑楼层");
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ },
|
|
|
+ //格式化表内容
|
|
|
+ formatHeaderType(list) {
|
|
|
+ let arr = tools.copyArr(list);
|
|
|
+ let data = showTools.headerTypeFilter(arr, "system", this.onlyRead, this.showType);
|
|
|
+ this.headerOptions = this.showType === "all" ? tools.copyArr(this.tableHeader) : this.tableHeader.filter((item) => item.visible);
|
|
|
+ data.unshift(
|
|
|
+ {
|
|
|
+ data: "caozuo",
|
|
|
+ renderer: tools.lookDetails,
|
|
|
+ readOnly: true,
|
|
|
+ }
|
|
|
+ // {
|
|
|
+ // data: "Count",
|
|
|
+ // renderer: tools.num,
|
|
|
+ // readOnly: true
|
|
|
+ // }
|
|
|
+ );
|
|
|
+ if (this.onlyRead) {
|
|
|
+ data.map((item) => {
|
|
|
+ item.readOnly = true;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (this.showType == "all") {
|
|
|
+ data.splice(3, 0, {
|
|
|
+ data: "buildingFloorInfoList",
|
|
|
+ renderer: text.sysInBuildFloor,
|
|
|
+ readOnly: this.onlyRead,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ },
|
|
|
+ //获取动态参数
|
|
|
+ getBatch(data) {
|
|
|
+ let param = {
|
|
|
+ groupCode: this.group_code,
|
|
|
+ appId: "datacenter",
|
|
|
+ projectId: this.projectId,
|
|
|
+ data: [],
|
|
|
+ };
|
|
|
+ //一级遍历list
|
|
|
+ this.tableHeader.map((head) => {
|
|
|
+ //如果一级标签为动态参数或者设定参数放入数据等待请求
|
|
|
+ if (head.category != "STATIC") {
|
|
|
+ data.map((item) => {
|
|
|
+ let cur = tools.dataForKey(item, head.path);
|
|
|
+ if (cur) {
|
|
|
+ param.data.push({
|
|
|
+ objectId: item.id,
|
|
|
+ infoCode: head.code,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (param.data.length) {
|
|
|
+ BeatchQueryParam(param, (res) => {
|
|
|
+ if (!this.onlyRead) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ this.tableData = data.map((item) => {
|
|
|
+ res.data.map((child) => {
|
|
|
+ if (item.id == child.objectId) {
|
|
|
+ if (!!child.data || child.data == 0) {
|
|
|
+ this.tableHeader.map((head) => {
|
|
|
+ if (head.code == child.infoCode) {
|
|
|
+ let contentVal = child.data;
|
|
|
+ if (this.codeToDataSource[child.infoCode]) {
|
|
|
+ contentVal = this.codeToDataSource[child.infoCode][child.data];
|
|
|
+ }
|
|
|
+ tools.setDataForKey(item, head.path, contentVal);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.tableHeader.map((head) => {
|
|
|
+ if (head.code == child.infoCode) {
|
|
|
+ tools.setDataForKey(
|
|
|
+ item,
|
|
|
+ head.path,
|
|
|
+ child.error ? (child.value ? "表号功能号格式错误" : "表号功能号不存在") : "暂未采集到实时数据"
|
|
|
+ );
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return item;
|
|
|
+ });
|
|
|
+ this.hot.loadData(this.tableData);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 筛选要展示的表头函数
|
|
|
+ */
|
|
|
+ filterShowInfo(list) {
|
|
|
+ let arr = this.tableHeader.filter((item) => {
|
|
|
+ return item.code === "localId" || item.code === "localName" || list.includes(item.code);
|
|
|
+ });
|
|
|
+ return arr;
|
|
|
+ },
|
|
|
+ //初始化插件
|
|
|
+ initTable() {
|
|
|
+ var container = document.getElementById("handsontable");
|
|
|
+ let winHeight = document.documentElement.clientHeight;
|
|
|
+ if (this.hot) {
|
|
|
+ this.hot.destroy();
|
|
|
+ this.hot = null;
|
|
|
+ }
|
|
|
+ this.hot = new Handsontable(container, {
|
|
|
+ data: this.tableData,
|
|
|
+ fixedColumnsLeft: 3,
|
|
|
+ colHeaders: this.formatHeaderData(this.showInfoList.length ? this.filterShowInfo(this.showInfoList) : this.tableHeader), //表头文案
|
|
|
+ columns: this.formatHeaderType(this.showInfoList.length ? this.filterShowInfo(this.showInfoList) : this.tableHeader), //数据显示格式
|
|
|
+ filters: true,
|
|
|
+ maxRows: this.tableData.length,
|
|
|
+ height: winHeight - 335,
|
|
|
+ columnSorting: true, //添加排序
|
|
|
+ sortIndicator: true, //添加排序
|
|
|
+ renderAllRows: true,
|
|
|
+ // observeChanges: false, //启用observeChanges插件
|
|
|
+ // colWidths: 200,
|
|
|
+ autoColumnSize: true,
|
|
|
+ language: "zh-CN",
|
|
|
+ fillHandle: "vertical", //允许纵向填充
|
|
|
+ manualColumnResize: true,
|
|
|
+ manualColumnMove: true,
|
|
|
+ dropdownMenu: ["filter_by_condition", "filter_by_value", "filter_action_bar"],
|
|
|
+ contextMenu: this.onlyRead
|
|
|
+ ? false
|
|
|
+ : {
|
|
|
+ items: {
|
|
|
+ remove_row: {
|
|
|
+ name: "删除该系统",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ // 事件
|
|
|
+ afterChange: this.handleUpdataTable, //修改后
|
|
|
+ afterFilter: this.trimmedRows, //排序前
|
|
|
+ afterRemoveRow: this.handleDeleteTableRow, //右键删除
|
|
|
+ afterOnCellMouseDown: this.eventClick, //鼠标点击
|
|
|
+ });
|
|
|
+ let pro = document.getElementById("hot-display-license-info");
|
|
|
+ if (!!pro) {
|
|
|
+ pro.parentNode.removeChild(pro);
|
|
|
+ }
|
|
|
+ this.isLoading = false;
|
|
|
+ },
|
|
|
+ //表格中的点击
|
|
|
+ eventClick(el, rowArr) {
|
|
|
+ //点击的是表头
|
|
|
+ if (rowArr.row < 0) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ //被筛选过后的数组
|
|
|
+ let trimmedArr = this.trimmedRows();
|
|
|
+ //是否启用了排序
|
|
|
+ let isSort = this.hot.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.hot.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);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleUpdataTable(changeData, source) {
|
|
|
+ if (!this.onlyRead && source != "ObserveChanges.change") {
|
|
|
+ if (changeData) {
|
|
|
+ let trimmedArr = this.trimmedRows();
|
|
|
+ let param = handsonUtils.getParam(changeData, source, this.hot, trimmedArr);
|
|
|
+ let data = [];
|
|
|
+ for (let i = 0; i < param.length; i++) {
|
|
|
+ data.push(param[i]);
|
|
|
+ }
|
|
|
+ //如果data中包含/且data长度为1,将其转换成.
|
|
|
+ if (changeData.length == 1 && changeData[0][1].indexOf("/") > 0) {
|
|
|
+ changeData[0][1] = changeData[0][1].split("/").join(".");
|
|
|
+ }
|
|
|
+
|
|
|
+ //存在data进行修改请求
|
|
|
+ if (data && data.length) {
|
|
|
+ this.updateBusiness(data, changeData);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //删除资产
|
|
|
+ async handleDeleteTableRow() {
|
|
|
+ this.$confirm("此操作将删除该系统, 是否继续?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ let params = tools.differenceArr(this.tableData, this.copyMain);
|
|
|
+ let param = [];
|
|
|
+ params.map((item) => {
|
|
|
+ param.push({ id: item.id });
|
|
|
+ });
|
|
|
+ this.removeSys(param);
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.getTableData();
|
|
|
+ this.$message("取消删除");
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async removeSys(param) {
|
|
|
+ await deleteGeneralSys(param, (res) => {
|
|
|
+ this.$message.success("删除成功");
|
|
|
+ this.$emit("close", "");
|
|
|
+ this.getTableData();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 修改
|
|
|
+ updateBusiness(data, change) {
|
|
|
+ let param = {
|
|
|
+ content: [],
|
|
|
+ },
|
|
|
+ keyList = [];
|
|
|
+ //生成要修改字段列表
|
|
|
+ change.map((item) => {
|
|
|
+ // let key = item[1].split(".")[0]
|
|
|
+ // if (item[1] && keyList.indexOf(key) == -1) {
|
|
|
+ // keyList.push(key);
|
|
|
+ // }
|
|
|
+ if (item[1] && keyList.indexOf(item[1]) == -1) {
|
|
|
+ keyList.push(item[1]);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //生成对应修改数据
|
|
|
+ data.map((item, index) => {
|
|
|
+ let nullList = [];
|
|
|
+ keyList.map((value) => {
|
|
|
+ let itemData = tools.dataForKey(item, value);
|
|
|
+ tools.setDataForKey(item, value, itemData == "" ? null : itemData);
|
|
|
+ // 数据为空加入置空列表(空数据类型包含: undefind / "" / null )
|
|
|
+ itemData || nullList.push(value);
|
|
|
+ });
|
|
|
+ // 置空列表不为空
|
|
|
+ if (nullList.length) {
|
|
|
+ // 深拷贝需更新的对象,并添加置空列表
|
|
|
+ const updateItem = JSON.parse(JSON.stringify(item));
|
|
|
+ updateItem.nullList = nullList;
|
|
|
+ param.content.push(updateItem);
|
|
|
+ } else {
|
|
|
+ // 无置空内容
|
|
|
+ param.content.push(item);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ updateGeneralSys(param, (res) => {});
|
|
|
+ },
|
|
|
+ //获取到了正确的信息
|
|
|
+ getInfors(infos, row) {
|
|
|
+ //其他的开始判断
|
|
|
+ let val = this.hot.colToProp(row.col);
|
|
|
+ let inputData = this.inputMap[val];
|
|
|
+ this.systemId = infos.SysID;
|
|
|
+ this.row = row.row;
|
|
|
+ this.messKey = val;
|
|
|
+ switch (val) {
|
|
|
+ //操作
|
|
|
+ case "caozuo":
|
|
|
+ // window.open(`http://adm.sagacloud.cn:8058/system?id=${infos.id}&pid=${this.projectId}&secret=${this.secret}`,"_blank")
|
|
|
+ // this.$message("开发中...")
|
|
|
+ console.log(infos);
|
|
|
+ this.$router.push({
|
|
|
+ path: "/ledger/systemDetail",
|
|
|
+ query: { SysID: infos.id, Name: infos.localName || infos.name, SysType: infos.classCode },
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ //设备二维码图片
|
|
|
+ // case 'EquipQRCode':
|
|
|
+ case "defaultQRCode":
|
|
|
+ this.qrcodeUrl = this.tableData[row.row].EquipQRCode;
|
|
|
+ if (!!this.qrcodeUrl) {
|
|
|
+ this.myDialog.qrcode = true;
|
|
|
+ } else {
|
|
|
+ this.$message("此设备没有设备二维码");
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ //关联设备数量
|
|
|
+ case "count":
|
|
|
+ if (!this.onlyRead) {
|
|
|
+ this.myDialog.relevance = true;
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ case "buildingFloorInfoList":
|
|
|
+ if (!this.onlyRead) {
|
|
|
+ this.$refs.editFloor.showDialog(this.tableData[row.row]);
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ //系统图(F2)
|
|
|
+ case "infos.systemChart":
|
|
|
+ let SSPPdata = tools.dataForKey(this.tableData[row.row], val);
|
|
|
+ this.imgsArr = SSPPdata ? SSPPdata : [];
|
|
|
+ if (!this.onlyRead || this.imgsArr.length) {
|
|
|
+ this.myDialog.uploadImgs = true;
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ if (!this.onlyRead && !inputData.editable) {
|
|
|
+ this.$confirm("该信息点的值为自动生成,不可人工维护!", "提示", {
|
|
|
+ confirmButtonText: "我知道了",
|
|
|
+ showCancelButton: false,
|
|
|
+ type: "warning",
|
|
|
+ center: true,
|
|
|
+ }).then(() => {
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // 维护多选枚举值
|
|
|
+ if (!this.onlyRead && inputData.dataType == "MENUM") {
|
|
|
+ this.updateInfoData = inputData;
|
|
|
+ this.updateInfoPoint = val;
|
|
|
+ this.updateInput = tools.dataForKey(this.tableData[row.row], val);
|
|
|
+ this.myDialog.menum = true;
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (!this.onlyRead && showTools.inputModeArr.indexOf(inputData.dataType) == "-1") {
|
|
|
+ this.updateInfoPoint = val;
|
|
|
+ this.updateInput = tools.dataForKey(this.tableData[row.row], val);
|
|
|
+ this.myDialog.update = true;
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //关闭临时维护弹窗回调
|
|
|
+ handleCloseUpdate() {
|
|
|
+ this.updateInputShow = false;
|
|
|
+ this.updateInfoPoint = "";
|
|
|
+ this.updateInput = "";
|
|
|
+ },
|
|
|
+ //更新临时维护信息点
|
|
|
+ handleClickUpdate() {
|
|
|
+ // this.$message("更新成功");
|
|
|
+ tools.setDataForKey(this.tableData[this.row], this.updateInfoPoint, this.updateInput);
|
|
|
+ this.handleUpdataTable([[this.row, this.updateInfoPoint, null, this.updateInput]], "edit");
|
|
|
+ this.updateInputShow = false;
|
|
|
+ this.myDialog.update = false;
|
|
|
+ this.updateInput = "";
|
|
|
+ },
|
|
|
+ //多选枚举类型值修改
|
|
|
+ handleChangeMenum(newValue) {
|
|
|
+ tools.setDataForKey(this.tableData[this.row], this.updateInfoPoint, newValue);
|
|
|
+ this.handleUpdataTable([[this.row, this.updateInfoPoint, null, newValue]], "edit");
|
|
|
+ this.myDialog.menum = false;
|
|
|
+ this.updateInput = "";
|
|
|
+ },
|
|
|
+ //关联建筑楼层成功
|
|
|
+ relateSuccess(data) {
|
|
|
+ this.getTableData();
|
|
|
+ // tools.setDataForKey(this.tableData[this.row], "BuildingFloorInfoList", data)
|
|
|
+ },
|
|
|
+ //获取被筛选掉的行号
|
|
|
+ trimmedRows() {
|
|
|
+ // var plugin = hot.getPlugin('trimRows').trimmedRows;//获取被筛选掉的行号
|
|
|
+ var plugin = this.hot.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]));
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ //上传文件弹窗触发事件
|
|
|
+ fileChange(keys) {
|
|
|
+ this.setDataToMain(keys, this.messKey, this.row);
|
|
|
+ },
|
|
|
+ //上传图片弹窗触发事件
|
|
|
+ imgChange(keys) {
|
|
|
+ this.setDataToMain(keys, this.messKey, this.row);
|
|
|
+ },
|
|
|
+ //设备图片弹窗改变事件
|
|
|
+ changePics(keys) {
|
|
|
+ this.setDataToMain(keys, this.messKey, this.row);
|
|
|
+ },
|
|
|
+ //判断是否有值,有值赋值
|
|
|
+ setDataToMain(data, key, row) {
|
|
|
+ if (!!data && data != "--") {
|
|
|
+ if (!!this.tableData[row]) {
|
|
|
+ tools.setDataForKey(this.tableData[row], key, data);
|
|
|
+ this.handleUpdataTable([[row, key, null, data]], "edit");
|
|
|
+ } else {
|
|
|
+ this.tableData[row] = {};
|
|
|
+ tools.setDataForKey(this.tableData[row], key, data);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ tools.setDataForKey(this.tableData[row], key, "");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ projectId() {
|
|
|
+ this.tableData = [];
|
|
|
+ this.mess.deviceId = null;
|
|
|
+ this.page.total = 0;
|
|
|
+ },
|
|
|
+ showTypes: {
|
|
|
+ handler(newName, oldName) {
|
|
|
+ if (newName && newName[0] && newName[0].value) {
|
|
|
+ this.showType = newName[0].value;
|
|
|
+ } else {
|
|
|
+ this.showType = "Visible";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ deep: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+/deep/ .el-select__tags-text {
|
|
|
+ display: inline-block;
|
|
|
+ max-width: 80px;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+/deep/ .el-select .el-tag__close.el-icon-close {
|
|
|
+ right: -4px;
|
|
|
+ top: -6px;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="less">
|
|
|
+.hanson-bar {
|
|
|
+ height: 40px;
|
|
|
+ padding: 5px 0;
|
|
|
+ font-size: 14px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-top: 0;
|
|
|
+ line-height: 40px;
|
|
|
+
|
|
|
+ .iconfont {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|