BIM引入

index.html

@@ -210,6 +210,7 @@
     </div>
   </div>
   <script type="module" src="/src/main.js"></script>
+  <script src="/qmodel/qmodel.js"></script>
 </body>
 
 </html>

src/components/bimjs/QmodelServer.js

@@ -0,0 +1,13 @@
+var QmodelOption = function() {
+    this.API_URL = 'http://www.qmodel.cn:4566/api';
+    this.FILE_SERVE_URL = 'http://www.qmodel.cn:9107/resourceHandle/file/downloadByPath';
+    this.FILE_SERVE_URL_UP = 'http://www.qmodel.cn:9107/resourceHandle/ng/upload?path=';
+    this.FILE_SERVE_URL2 = 'http://www.qmodel.cn/file';
+    this.DemoUser = '15502911230';
+    this.DemoPwd = 'qm123321';
+    // this.DemoUser = '20191205';
+    // this.DemoPwd = '20191205';
+    this.DefaultToken = null;
+}
+
+export { QmodelOption }

src/components/bimjs/app.js

@@ -0,0 +1,439 @@
+function createDOM(tagName, classList) {
+    var rs = document.createElement(tagName);
+    // rs.classList.add(classList);
+    rs.setAttribute("class", classList);
+    return rs;
+};
+
+//funx1(jQuery);
+
+
+
+//通过一个根节点创建。
+var Tree = function(title) {
+    var t = this;
+    t._root = t._tree;
+};
+Tree.prototype = {
+    getRoot: function() {
+        return this.treeDOM;
+    },
+    getChecked: function() {
+        function e(o, a) // 0 = node
+        {
+            var i = o.getCheckedState(),
+                l = o.element.getAttribute("data-filter");
+            switch (i) {
+                case "unchecked":
+                    break;
+                case "checked":
+                    if (o == t) {
+                        n = "all";
+                    } else {
+                        var r = Object.assign({}, a);
+                        r[l] = o.id, n.push(r)
+                    }
+                    break;
+                case "half":
+                    var s = o.getControls(),
+                        c = Object.assign({}, a);
+                    o != t && (c[l] = o.id);
+                    for (var d = 0, u = s.length; d < u; d++) {
+                        e(s[d], c);
+                    }
+            }
+        }
+        var t = this.treeDOM,
+            n = [];
+        return e(t, {}), n;
+    },
+    getSelection: function() {
+        function e(t, n) {
+            var o = t.element.getAttribute("data-filter"),
+                a = t.getParent();
+            if (!a) {
+                return n;
+            }
+            n[o] = t.id, e(a, n)
+        }
+        var t = this._selectionNode,
+            n = {};
+        return !!t && (e(t, n), n);
+    },
+    clear: function(e) {
+        var t = this.getRoot();
+        ! function t(n) {
+            n.setCheckedState(e), n.setIconState("default");
+            var o = n.getControls();
+            if (o && o.length > 0) {
+                for (var a = 0; a < o.length; a++) {
+                    t(o[a]);
+                }
+            }
+        }
+        (t)
+    }
+};
+//type =0，顶级，type=1,楼层。type=2,专业。type=3构件,type=4文档。,coolapse = 折叠
+var TreeNode = function(title, viewer, id, type, coolapse) {
+    this.id = id;
+    this.parent = null;
+    this.parentId = 0;
+    this.type = type;
+    this.viewer = viewer;
+    this.element = createDOM('div', 'qm-tree'); //qm-tree
+    this.element.setAttribute('title', title);
+    var classValue = "qm-tree-node";
+    if (coolapse)
+        classValue = classValue + " qm-collapse";
+    this.treeNodeDOM = createDOM("div", classValue); //默认展开 qm-collapse
+    this.element.appendChild(this.treeNodeDOM);
+    this._opt = { isChecked: true };
+    this._selectionState = "unSelected";
+    this.setData(title);
+    this.subTreeList = [];
+};
+TreeNode.prototype.setData = function(t) {
+    var _this = this;
+    //<span class="qm-icon"></span>  addChildNode
+    // var icon = createDOM("span", "qm-icon ");
+    // this.treeNodeDOM.appendChild(icon);
+
+    /**<span class="qm-label qm-unchecked">
+                                <input type="checkbox" checked="true">
+                                <span  class="qm-checkbox"></span>
+                              </span> */
+    var l = this._opt.isChecked ? "qm-checked" : "";
+    _this.checkDOM = createDOM("span", "qm-label " + l);
+    _this.checkDOM.innerHTML = '<input type="checkbox" checked="' +
+        _this._opt.isChecked + '"><span class="qm-checkbox iconfont icon-duoxuan-xuanzhong"></span>',
+        _this.treeNodeDOM.appendChild(this.checkDOM);
+    _this.checkDOM.addEventListener("click", function(e) {
+        var t = this.getElementsByTagName("input")[0].checked;
+        if (_this.type == 0) { //顶级 
+            _this.viewer.setMeshVisiblityByTree(-1, 0, 0, t);
+        } else if (_this.type == 3) //构件分类
+            _this.viewer.setMeshVisiblityByTree(_this.parent.parentId, _this.parentId, _this.id, t);
+        else if (_this.type == 1) //楼层
+            _this.viewer.setMeshVisiblityByTree(_this.parentId, _this.id, 0, t);
+        else if (_this.type == 4) { //文档
+            _this.viewer.setMeshVisiblityByTree(_this.id, 0, 0, t);
+        } else if (_this.type == 5) { // 专业，其实是多个doc
+            _this.id.data.forEach(docid => {
+                _this.viewer.setMeshVisiblityByTree(docid, 0, 0, t);
+            });
+        } else if (_this.type == 6) { // 楼层，其实是多个doc-level
+            _this.id.data.forEach(e => {
+                _this.viewer.setMeshVisiblityByTree(e.doc, e.level, 0, t);
+            });
+        } else if (_this.type == 6) { // 构件，其实是多个doc-level
+            _this.id.data.forEach(e => {
+                _this.viewer.setMeshVisiblityByTree(e.doc, e.level, e.category, t);
+            });
+        }
+        _this._opt.isChecked = t;
+        _this.OnbfLableClick(e, t);
+        if (_this.parent) {
+            if (!t) //选中
+            {
+                _this.parent.checkDOM.classList.remove("qm-unchecked");
+                _this.parent.checkDOM.classList.add("qm-checked");
+            } else {
+                var add = true;
+                for (var i = 0; i < _this.parent.subTreeList.length; i++) {
+                    if (_this.parent.subTreeList[i].checkDOM.classList.contains("qm_checked")) {
+                        add = false;
+                        break;
+                    }
+                }
+                _this.parent.checkDOM.classList.remove("qm-checked");
+                _this.parent.checkDOM.classList.add("qm-unchecked");
+            }
+        }
+
+        var o = t ? "unchecked" : "checked";
+        console.log(o);
+    });
+
+    //<div class="qm-tree-icon gld-qm-untransparent" title="半透明"></div>
+    this.transDOM = createDOM("div", "qm-tree-icon qmd-untransparent iconfont icon-cube_box_fill");
+    this.transDOM.setAttribute("title", "半透明");
+    this.transDOM.addEventListener("click", function(e) {
+        console.log(e.target);
+        var nodeList = e.target.parentNode.parentNode.getElementsByClassName("qm-tree-icon");
+        if (nodeList.length == 0) return;
+        var check = nodeList[0].classList.contains("qmd-untransparent")
+        var t = 1;
+        if (check) t = 0.5;
+        // var t = this.getElementsByTagName("input")[0].checked;
+        if (_this.type == 0) { //顶级 
+            _this.viewer.setMeshTransparencyByTree(-1, 0, 0, t);
+        } else if (_this.type == 3) //构件分类
+            _this.viewer.setMeshTransparencyByTree(_this.parent.parentId, _this.parentId, _this.id, t);
+        else if (_this.type == 1) //楼层
+            _this.viewer.setMeshTransparencyByTree(_this.parentId, _this.id, 0, t);
+        else if (_this.type == 4) { //文档
+            _this.viewer.setMeshTransparencyByTree(_this.id, 0, 0, t);
+
+        }
+        for (var i = 0; i < nodeList.length; i++) {
+            var elb = nodeList[i];
+            if (check) {
+                elb.classList.remove("qmd-untransparent");
+                elb.classList.remove("icon-cube_box_fill");
+                elb.classList.add("qmd-transparent");
+                elb.classList.add("icon-pouqiehe");
+            } else {
+                elb.classList.add("qmd-untransparent");
+                elb.classList.add("icon-cube_box_fill");
+
+                elb.classList.remove("qmd-transparent");
+
+                elb.classList.remove("icon-pouqiehe");
+
+            }
+        }
+    });
+    this.treeNodeDOM.appendChild(this.transDOM);
+    this.treeNameDOM = createDOM("span", "qm-tree-name");
+    this.treeNameDOM.addEventListener("click", function(e) {
+
+        if ((_this.type != 3) && ((_this.type != 1))) return;
+
+        if (_this.type == 3) //构件分类
+        {
+
+            _this.viewer.setMeshSelectByTree(_this.parent.parentId, _this.parentId, _this.id, 0);
+        } else if (_this.type == 1) //楼层
+        {
+
+            _this.viewer.setMeshSelectByTree(_this.parentId, _this.id, 0, 0);
+        }
+        var elb = e.target;
+        var nodeList = $(".qm-selected");
+        if (nodeList.length > 0)
+            nodeList[0].classList.remove("qm-selected");
+        elb.classList.remove("qm-selected");
+        elb.classList.add("qm-selected");
+
+    });
+    this.treeNameDOM.innerHTML = t;
+    this.treeNodeDOM.appendChild(this.treeNameDOM);
+};
+TreeNode.prototype.addChildNode = function(subnode) {
+    var t = this;
+    if (t.subTreeDOM == null) {
+        t.subTreeDOM = createDOM("div", "qm-sub-tree");
+        var n = createDOM("span", "qm-icon");
+        this.treeNodeDOM.insertBefore(n, this.treeNodeDOM.children[0]);
+        n.addEventListener("click", function(e) {
+            var p = e.target.parentNode;
+            if (p.tagName == "DIV") {
+                if (p.classList.contains("qm-collapse")) {
+                    p.classList.remove("qm-collapse");
+
+                } else {
+                    p.classList.add("qm-collapse");
+
+
+                }
+            }
+        });
+        t.element.appendChild(this.subTreeDOM);
+    }
+    subnode.parentId = t.id;
+    subnode.parent = t;
+    t.subTreeList.push(subnode);
+    t.subTreeDOM.appendChild(subnode.element);
+
+};
+TreeNode.prototype.OnbfLableClick = function(e, t) {
+    var elb = e.target;
+    if (elb.classList.contains("qm-checkbox"))
+        elb = elb.parentNode;
+    var p = elb;
+    var nodeList = p.parentNode.parentNode.getElementsByClassName("qm-label");
+    for (var i = 0; i < nodeList.length; i++) {
+        var elb = nodeList[i];
+        if (!t) {
+            elb.classList.remove("qm-unchecked");
+            elb.classList.add("qm-checked");
+            // elb.classList.add("iconfont");
+            // elb.classList.add("icon-duoxuan-xuanzhong");
+            elb.getElementsByTagName("input")[0].checked = true;
+        } else {
+            elb.classList.add("qm-unchecked");
+            elb.classList.remove("qm-checked");
+            // elb.classList.remove("iconfont");
+            // elb.classList.remove("icon-duoxuan-xuanzhong");
+            elb.getElementsByTagName("input")[0].checked = false;
+        }
+    }
+};
+TreeNode.prototype.doUncheck = function() {
+    this.checkDOM.classList.add("qm-unchecked");
+    this.checkDOM.classList.remove("qm-checked");
+    this.checkDOM.classList.remove("iconfont");
+    this.checkDOM.classList.remove("icon-duoxuan-xuanzhong");
+    this.checkDOM.getElementsByTagName("input")[0].checked = false;
+};
+TreeNode.prototype.removeChildNode = function(e) {
+    var t = this._controls.getObjectByAttribute("id", e);
+    this.subTreeDOM.removeChild(t.element), this._controls.removeObjectByAttribute("id", e);
+};
+TreeNode.prototype.getCheckedState = function() {
+    return this._checkedState;
+};
+TreeNode.prototype.getIconState = function() {
+    return this._iconState;
+};
+TreeNode.prototype.getSelectionState = function() {
+    return this._selectionState;
+};
+TreeNode.prototype.getParent = function() {
+    return !!this._parent && this._parent;
+};
+TreeNode.prototype.setCheckedState = function(e) {
+    var t = this._opt;
+    this._checkedState = e ? "checked" : "unchecked", t.hasCheckbox && this.checkbox && (this.checkbox.getElementsByTagName("input")[0].checked = e,
+            this.checkbox.toggleClass("qm-checked", e), this.checkbox.toggleClass("qm-unchecked", !e), this.checkbox.removeClass("qm-half")),
+        this.setChildrenCheckedState(e);
+};
+TreeNode.prototype.setIconState = function(e) {
+    this.icon && (this.icon.setState(e), this.setChildrenIconState(e), this._iconState = "default" == e);
+};
+TreeNode.prototype.setParentCheckedState = function(e) {
+    var t = this.getControls();
+    if (t && t.length > 0) {
+        for (var n, o = 0, a = t.length; o < a; o++) {
+            var i = t[o].getCheckedState();
+            n ? i != n && (n = "half") : n = i
+        }
+        this._checkedState = n
+    }
+    switch (this._checkedState) {
+        case "checked":
+            this.checkbox.getElementsByTagName("input")[0].checked = !0, this.checkbox.addClass("qm-checked"),
+                this.checkbox.removeClass("qm-unchecked"), this.checkbox.removeClass("qm-half");
+            break;
+        case "unchecked":
+            this.checkbox.getElementsByTagName("input")[0].checked = !1, this.checkbox.addClass("qm-unchecked"),
+                this.checkbox.removeClass("qm-checked"), this.checkbox.removeClass("qm-half");
+            break;
+        case "half":
+            this.checkbox.getElementsByTagName("input")[0].checked = !0, this.checkbox.addClass("qm-half"),
+                this.checkbox.removeClass("qm-unchecked"), this.checkbox.removeClass("qm-checked")
+    }
+};
+TreeNode.prototype.setChildrenCheckedState = function(e) {
+    var t = this.getControls(),
+        n = t.length;
+    if (t && n > 0) {
+        for (var o = 0; o < n; o++) {
+            t[o].setCheckedState(e);
+        }
+    }
+};
+TreeNode.prototype.setParentIconState = function(e) {
+    var t = this.getControls();
+    if (t && t.length > 0) {
+        for (var n = !1, o = 0, a = t.length; o < a; o++) {
+            var i = t[o].getIconState();
+            if (i) {
+                n = i;
+                break
+            }
+        }
+        this._iconState = n
+    }
+    n ? this.icon.setState("default") : this.icon.setState("change");
+};
+TreeNode.prototype.setChildrenIconState = function(e) {
+    var t = this.getControls(),
+        n = t.length;
+    if (t && n > 0) {
+        for (var o = 0; o < n; o++) {
+            t[o].setIconState(e);
+        }
+    }
+};
+TreeNode.prototype.expand = function() {
+    var e = this;
+    this.treeNode.removeClass("qm-collapse"), this.eventManager.fireEvent("Expand", e);
+};
+TreeNode.prototype.collapse = function() {
+    var e = this;
+    this.treeNode.addClass("qm-collapse"), this.eventManager.fireEvent("Collapse", e);
+};
+TreeNode.prototype.toggleExpansion = function(e) {
+    var t = this;
+    this.treeNode.hasClass("qm-collapse") ? t.expand() : t.collapse();
+};
+TreeNode.prototype.select = function() {
+    if (this._selection) {
+        return this.treeName.addClass("qm-selected");
+    }
+};
+TreeNode.prototype.deselect = function() {
+    this.treeName && this.treeName.removeClass("qm-selected");
+};
+TreeNode.prototype.disabled = function() {
+    this._enabled = !1, this.treeName.addClass("qm-disabled");
+};
+TreeNode.prototype.enabled = function() {
+    this._enabled = !0, this.treeName.removeClass("qm-disabled");
+};
+TreeNode.prototype.addNode = function(e) {
+    this.treeNode.appendChild(e);
+};
+TreeNode.prototype.removeNode = function(e) {
+    this.treeNode.appendChild(e);
+};
+
+
+var TreeTableNode = function(bftableDom) {
+    this.element = bftableDom;
+    this.bodyDom = null;
+};
+//{title:xxx,children:[{key:x,value:x}]}
+TreeTableNode.prototype.addtbTale = function(data, fun) {
+
+    this.bodyDom = createDOM('tbody', 'qm-group undefined');
+    this.element.appendChild(this.bodyDom);
+    var title = createDOM('tr', 'qm-group-title');
+    var td = createDOM('td', '');
+    td.setAttribute('colspan', 2);
+    td.innerHTML = data.text;
+    var icon = createDOM('i', 'qm-icon');
+    td.appendChild(icon);
+    title.appendChild(td);
+    icon.addEventListener("click", function(e) {
+        var p = e.target.parentNode;
+        if (p.tagName == "TD") {
+            p = p.parentNode.parentNode;
+            if (p.classList.contains("qm-collapse")) {
+                p.classList.remove("qm-collapse");
+
+            } else {
+                p.classList.add("qm-collapse");
+
+            }
+        }
+    });
+
+    this.bodyDom.appendChild(title);
+    data.children.forEach(e => {
+        var kv = e.split(',');
+        var c = createDOM('tr', 'qm-group-content');
+        if (fun)
+            c.innerHTML = ' <td class="qm-key">' + kv[0] + '</td>' +
+            '<td class="qm-value"><a  onclick=' + fun + '(event)>' + kv[1] + '</td>';
+        else
+            c.innerHTML = ' <td class="qm-key">' + kv[0] + '</td>' +
+            '<td class="qm-value">' + kv[1] + '</td>';
+        this.bodyDom.appendChild(c);
+    });
+
+
+};
+export { TreeNode, TreeTableNode }

src/components/bimjs/contextmenu.js

@@ -0,0 +1,196 @@
+var ContextMenuCreater = function(context) {
+    this.context = context;
+    if (context) {
+        this.ul = context.children[0];
+        this.ul.innerHTML = '';
+    }
+    this.enableMenu = true;
+}
+ContextMenuCreater.prototype.hide = function() {
+    if (!this.ul) return;
+    this.context.style.display = "none";
+}
+ContextMenuCreater.prototype.prepareMenu = function() {
+    if (!this.ul) return;
+    var selected = qmodel.get_selection_ids().length > 0;
+    for (var i = 0; i < this.ul.children.length; i++) {
+        var li = this.ul.children[i];
+        if (li.getAttribute("needselected") == 'true') {
+            li.style.display = selected ? "block" : "none";
+        }
+    }
+}
+ContextMenuCreater.prototype.createMenuItem = function(tagName, needselected, bindEvent) {
+    if (!this.ul) return;
+    var li = document.createElement('li');
+    li.setAttribute("needselected", needselected);
+
+    this.ul.append(li);
+    var a = document.createElement('a');
+    a.innerHTML = tagName;
+    li.append(a);
+    a.onclick = bindEvent;
+};
+ContextMenuCreater.prototype.bindIframeEvent = function(eventName) {
+    window.parent.postMessage({
+        cmd: eventName,
+    }, '*');
+
+};
+
+ContextMenuCreater.prototype.createMenu = function() {
+    let _this = this;
+    if (!this.ul) return;
+    this.createMenuItem('隐藏选中构件', true, function() {
+        var ids = qmodel.get_selection_ids();
+        console.log('当前选择的构件Id：' + ids);
+        qmodel.set_comps_visiblity(ids, false);
+        _this.hide();
+    });
+
+    this.createMenuItem('半透明选中构件', true, function() {
+        var ids = qmodel.get_selection_ids();
+        console.log('当前选择的构件Id：' + ids);
+        qmodel.set_comps_transparency(ids, 0.5);
+        _this.hide();
+    });
+
+    this.createMenuItem('冻结选中构件', true, function() {
+        var ids = qmodel.get_selection_ids();
+        console.log('当前选择的构件Id：' + ids);
+        qmodel.set_comps_transparency(ids, 0.5, null, true);
+        _this.hide();
+    });
+
+    this.createMenuItem('隔离选中构件(隐藏其他)', true, function() {
+        var ids = qmodel.get_selection_ids();
+        qmodel.set_all_comps_visiblity(false, false);
+        qmodel.set_comps_visiblity(ids, true);
+        qmodel.set_comps_selected(ids);
+        _this.hide();
+    });
+
+    this.createMenuItem('隔离选中构件(冻结其他)', true, function() {
+        var ids = qmodel.get_selection_ids();
+
+        qmodel.set_all_comps_transparency(0.5, true, false);
+
+        qmodel.set_comps_transparency(ids, 1);
+
+        //      qmodel.set_comps_transparency(ids, 1);
+
+        _this.hide();
+    });
+
+    this.createMenuItem('显示所有构件', false, function() {
+        qmodel.set_all_comps_transparency(1, false, false);
+        qmodel.set_all_comps_visiblity(true, false);
+        _this.hide();
+
+    });
+
+    this.createMenuItem('聚焦选中构件', true, function() {
+        var ids = qmodel.get_selection_ids();
+        qmodel.lookat_comp(ids[0]);
+        _this.hide();
+    });
+
+    this.createMenuItem('父级窗口事件', true, function() {
+        _this.bindIframeEvent("showVueDiaglog");
+        _this.hide();
+    });
+
+    this.createMenuItem('设备编辑', true, function() {
+        var a = document.getElementById("property-extmodel-dialog");
+        a.style.display = "block";
+        qmodel.debugSetQmTransformOpen(true);
+        var updateExtModelInfo = function() {
+            var tf = qmodel.get_model_transform();
+            if (tf) {
+                document.getElementById("ext-v1").value = tf.x;
+                document.getElementById("ext-v2").value = tf.y;
+                document.getElementById("ext-v3").value = tf.z;
+                document.getElementById("ext-v4").value = tf.anglez;
+                document.getElementById("ext-v5").value = tf.angley;
+                document.getElementById("ext-v6").value = tf.anglex;
+            } else {
+                console.log('未选择设备');
+            }
+        }
+        qmodel.set_ext_model_update_callback(updateExtModelInfo);
+        a.style.left = (document.body.clientWidth / 2 - 150).toString() + 'px';
+        var tf = qmodel.get_model_transform();
+        if (tf) {
+            document.getElementById("ext-v1").value = tf.x;
+            document.getElementById("ext-v2").value = tf.y;
+            document.getElementById("ext-v3").value = tf.z;
+            document.getElementById("ext-v4").value = tf.anglez;
+            document.getElementById("ext-v5").value = tf.angley;
+            document.getElementById("ext-v6").value = tf.anglex;
+        } else {
+            alert("请选择一个设备");
+        }
+        _this.hide();
+    });
+
+    return; //后面的 debug 用户自行选用
+
+    this.createMenuItem('设置选中构件颜色', true, function() {
+        var ids = qmodel.get_selection_ids();
+        console.log('当前选择的构件Id：' + ids);
+        qmodel.set_comps_color(ids, 0xff0000);
+        _this.hide();
+        //如果要还原颜色，颜色传入null,qmodel.setCompsColor(ids, null);
+    });
+
+
+
+    this.createMenuItem('获取相机', false, function() {
+        _this.testJson = qmodel.get_camera_json();
+        console.log(_this.testJson);
+        alert(_this.testJson);
+        _this.hide();
+    });
+    this.createMenuItem('恢复相机', false, function() {
+        var json = _this.testJson;
+        if (!json) {
+            alert('您可以先点击获取相机，我会把相机序列化为JSON缓存下来用于测试。');
+        }
+        qmodel.set_camera_json(json);
+        _this.hide();
+    });
+    this.createMenuItem('获取标记', false, function() {
+        _this.testJson2 = qmodel.get_all_marks();
+        console.log(_this.testJson2);
+        alert(_this.testJson2);
+        _this.hide();
+    });
+    this.createMenuItem('移除标记', false, function() {
+        qmodel.remove_all_marks();
+        _this.hide();
+    });
+    this.createMenuItem('恢复标记', false, function() {
+        var json = _this.testJson2;
+        if (!json) {
+            alert('您可以先点击得到标记，我会把标记序列化为JSON缓存下来用于测试。');
+        }
+        qmodel.reset_marks(json);
+        _this.hide();
+    });
+
+    this.createMenuItem('设备删除', true, function() {
+        qmodel.delete_ext_model(null).then(e => {
+            console.log("删除完成,id:", e);
+        }).catch(e => {
+            alert(e);
+        });
+        _this.hide();
+    });
+    this.createMenuItem('打开材质库', false, function() {
+        document.getElementById("property-material").style.display = "block";
+        qmodel.show_materials();
+        _this.hide();
+    });
+
+};
+export { ContextMenuCreater }

src/components/bimjs/language.js

@@ -0,0 +1,83 @@
+var LanguageEnum = {
+    Chinese: 1,
+    English: 2,
+}
+var Language = function(languageEnum) {
+    var lan = languageEnum ? languageEnum : 1;
+    if (lan == LanguageEnum.English) {
+        this.TREENODE_ROOT = "root";
+        this.ORDERCODE = "roder";
+        this.LENGTH = "length";
+        this.TIP_MOUSE_ZOOM_OPEN = "auto zoom open";
+        this.TIP_MOUSE_ZOOM_CLOSE = "auto zoom close";
+        this.TIP_MOUSE_LOCK_OPEN = "target on mouse";
+        this.TIP_MOUSE_LOCK_CLOSE = "target on center";
+        this.TIP_ENABLEDAMPING = "damping enable";
+        this.TIP_DISABLEDAMPING = "damping disable";
+        this.TIP_ALLOW_ROTATE = "allow rotate";
+        this.TIP_NOT_ALLOW_ROTATE = "not rotate";
+        this.CSS3D_MARK_DEMO = 'hello' + '<br>' + 'world';
+        this.MACHINE_NAME = "machine name";
+        this.OPERATE = "operate";
+        this.QRCODE = "QRCODE";
+        this.VIEW_NAME = "view name";
+        this.TASK_NAME = 'task name';
+        this.FINISH_DATE = 'finish date';
+        this.ALERT_SELECT = "select one,please";
+        this.DOFINISH = "finish";
+        this.HIT_OPEN = "collision open";
+        this.HIT_CLOSE = "collision close";
+        this.INIT_MATERIAL = "materials loading...";
+        this.LOADING = "geometry loading...";
+        this.DOWNLOADING = "downloading...";
+        this.FIRSTTIME_PARSE = "parse for the first time...";
+        this.FIRSTTIME_DOWNLOAD = "downloading for the first time...";
+        this.PARSING = "parsing...";
+        this.STRUCTURE_TREE = "structure tree";
+        this.MODEL_NOT_PREPARED = "model is not preared,please wait a moment";
+        this.FACES_TOP = "TOP";
+        this.FACES_FRONT = "FRONT";
+        this.FACES_RIGHT = "RIGHT";
+        this.FACES_LEFT = "LEFT";
+        this.FACES_BACK = "BACK";
+        this.FACES_BOTTOM = "BOTTOM";
+    } else {
+        this.TREENODE_ROOT = "全部";
+        this.ORDERCODE = "序号";
+        this.LENGTH = "长度";
+        this.TIP_MOUSE_ZOOM_OPEN = "打开鼠标点击自动对焦";
+        this.TIP_MOUSE_ZOOM_CLOSE = "关闭鼠标点击自动对焦";
+        this.TIP_MOUSE_LOCK_OPEN = "已开启鼠标锚定";
+        this.TIP_MOUSE_LOCK_CLOSE = "已关闭鼠标锚定";
+        this.TIP_ENABLEDAMPING = "已开启阻尼动效";
+        this.TIP_DISABLEDAMPING = "已关闭阻尼动效";
+        this.TIP_ALLOW_ROTATE = "允许旋转";
+        this.TIP_NOT_ALLOW_ROTATE = "禁止旋转";
+        this.CSS3D_MARK_DEMO = '您好' + '<br>' + '世界';
+        this.MACHINE_NAME = "设备名称";
+        this.OPERATE = "操作";
+        this.QRCODE = "二维码";
+        this.VIEW_NAME = "视图名称";
+        this.TASK_NAME = '计划名称';
+        this.FINISH_DATE = '完成日期';
+        this.ALERT_SELECT = "请选择构件";
+        this.DOFINISH = "操作完成";
+        this.HIT_OPEN = "已开启碰撞";
+        this.HIT_CLOSE = "已关闭碰撞";
+        this.LOADING = "加载中...";
+        this.INIT_MATERIAL = "材质加载中...";
+        this.DOWNLOADING = "下载中...";
+        this.FIRSTTIME_PARSE = "首次下载解析...";
+        this.FIRSTTIME_DOWNLOAD = "首次打开下载中...";
+        this.PARSING = "解析中...";
+        this.STRUCTURE_TREE = "构件树";
+        this.MODEL_NOT_PREPARED = "服务器正在发布模型。请稍后再试。";
+        this.FACES_TOP = "上";
+        this.FACES_FRONT = "南";
+        this.FACES_RIGHT = "东";
+        this.FACES_LEFT = "西";
+        this.FACES_BACK = "北";
+        this.FACES_BOTTOM = "下";
+    }
+}
+export { LanguageEnum, Language }

src/components/bimjs/qmodel.scene.js

@@ -0,0 +1,63 @@
+var qmodelSceneOption = {
+    //以下参数管理初始化界面
+    opToolbar: false, //显示工具栏
+    opModelSelect: false, //显示模型选择按钮
+    opTree: false, //显示模型目录树按钮
+    opProperty: true, //显示工具栏的查看构件属性按钮
+    opHome: true, //显示工具栏的恢复默认视角
+    opRectSelect: true, //显示工具栏的框选
+    opMeasure: true, //显示工具栏的测量
+    opClip: true, //显示工具栏的剖切
+    opWalk: true, //显示工具栏的漫游
+    opMap: true, //显示工具栏的小地图,有点问题，暂时屏蔽
+    opMark: true, //显示工具栏的标记
+    opMark2D: true, //显示工具栏的2D标记
+    opMark3D: true, //显示工具栏的3D标记
+    opViewpoint: true, //显示工具栏的视口管理
+    opMaterialSet: true, //显示工具栏的材质替换
+    opInfo: true, //显示工具栏的模型信息
+    opSetting: true, //显示工具栏的设置
+    showTree: false, //默认显示目录树子窗口
+    showCube: false, //默认显示视角盒子
+    showPty: false, //是否默认显示属性子窗口
+    showqrcode: false, //显示默认二维码
+    //以下是默认的环境设置参数
+    version: 2,
+    color: '-1', //背景色。RGB,格式举例：'#404048'，也可以输入-1,默认渐变色
+    openLog: true, //是否允许qmodel插件在控制台输出调试日志.不想要日志可以关掉。但是在写脚本时，有日志会更加好用。
+    autotransp: false, //全部透明,白模效果
+    transpvalue: 0.6, //全部透明度
+    shininess: 80, //反光材质的反光度
+    openPone: false, //显示反光材质
+    showShadow: false, //显示阴影
+    skybox: 0, //显示天空盒。0=没有效果。1=大海，2=沙漠，3=天空，4=平原。可以替换page文件夹里面的素材，文件夹格式为:skybox_x,x为数字。GIS模式请设置为0
+    lightlevel: 0.5, //亮度
+    opendrlight: true, //打开直射光
+    lightdrlevel: 0.7, //直射光亮度
+    contrast: 6, //对比度
+    lookSpeed: 0.3, //漫游相机旋转速度
+    movementSpeed: 70, //漫游前进速度
+    transparentBg: false, //背景透明
+    bgImg: "5.jpg", //如果背景透明，呈现哪张图片
+    //以下参数管理初始化设置   
+    setWalk: false, //初始化完成后，直接进度漫游
+    clickCenter: true, //点击模型时，自动lookat焦点击位置,并移到屏幕中心。
+    loadDefaultviews: true, //在加载模型完成后，自动定位到封面视角
+    materialOffer: false, //材质的偏移因子。开启后可以一定程度消除偏移，反复刷新模型可能会造成叠面闪烁。
+    randerType: 0, //真实模式或着色模式（暂不支持）
+    offtype: 2, //=1使用高深度。=2使用材质偏移。可用于调优模型闪烁的情况。
+    keepRender: false, //持续渲染。目前在测试,使用旋转动画时必须开启。
+    openBloom: false, //开Bloom泛光,keepRender必须要开。与skybox冲突，打开后将会关闭掉天空盒，效率降低。
+    autoZoom: false, //点击时，自动缩放到合适的位置   
+    zoomLock: false, //在室外，鼠标缩放时，以鼠标中心为锚点。会消耗算力，模型过大时会增加延迟
+    markCulling: true, //标记如果被遮挡，会从视野中剔除。
+    selectedEdge: true, //选中的时候显示透视效果
+    modelLod: false, //会创建一个模型盒子。用盒子替换模型提升效率。 debugger 
+    modelAutoClear: false, //当显示 盒子的时候，会强行释放掉模型的几何信息，直接下次加载，重新载入回来。//debugger error
+    showExt: true, //显示设备编辑
+    selectOnTop: true, //选中的构件是否在顶层显示。别选太多，选多了效率低。
+    mergeInstance: 2, //请根据每个模型的特性去调优。值越大，内存消耗越大，但是合批越多，带来性能上的提升。不建议超过100。
+    rayByOctree: false, //通过八叉树进行模型检测碰撞。小模型没关系，大模型的点击选中有一点提升。(bug1:合并后的构件，拆解后没有重置树。0607.rvt)
+    enableMenu: true, //启用右键菜单。如果您不想用自带的右键菜单，而要自己实现，可以关闭此项。
+};
+export { qmodelSceneOption }

src/router/index.js

@@ -47,6 +47,11 @@ export const constantRoutes = [
     component: () => import('@/views/register'),
     hidden: true
   },
+  {// 测试新增
+    path: '/bimHome',
+    component: () => import('@/views/bim/home/index'),
+    hidden: true
+  },
   {
     path: "/:pathMatch(.*)*",
     component: () => import('@/views/error/404'),

src/views/bim/home/index.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="app-container">
+    <div id="qmviewer_container">
+      <qmviewer
+        v-bind:modelName="modelName"
+        v-bind:isCompont="isCompont"
+        @callFather_loaded="callFather_loaded"
+      ></qmviewer>
+    </div>
+  </div>
+</template>
+<script setup name="bimHome">
+import Qmviewer from "@/components/Qmviewer";
+const data = reactive({
+  viewerDemo: null,
+  isLocal: true, // 本地为true
+  //你需要打开的模型名称放这里。
+  modelName: "static/gltf/01/revit2018-1.gltf", // 测试模型
+  // modelName: "static/gltf/bw/jz.gltf",
+  isCompont: true,
+  qmodel_container: null,
+});
+
+const { isLocal, modelName, isCompont, viewerDemo } = toRefs(data);
+
+const callFather_loaded = (parm) => {
+  viewerDemo.value = parm;
+  console.log("组件Demo", viewerDemo.value);
+  // 模型点击事件
+  qmodel.set_select_callback(function (id) {
+    var cmps = JSON.parse(id);
+    console.log(cmps);
+  });
+};
+</script>
+<style lang='scss' scoped>
+#qmviewer_container {
+  height: 900px;
+  background: #f8f8f9;
+}
+</style>

static/localmodel/167594419801656/key.txt

@@ -0,0 +1 @@
+167594419801656|0