Commit dba90c5caa028a88bacb84c859d229f857d1d5d2
Merge branch 'ww' into 'main'
merge: fix some bug && perf some function See merge request huang/thingskit-drawio!28
Showing
2 changed files
with
234 additions
and
131 deletions
| ... | ... | @@ -195,8 +195,7 @@ LocalFile.prototype.saveFile = function (title, revision, success, error, useCur |
| 195 | 195 | this.removeDraft(); |
| 196 | 196 | Editor.defaultContent = savedData; |
| 197 | 197 | var configurationContentList = []; |
| 198 | - const basicAttr = Sidebar.prototype.enumCellBasicAttribute | |
| 199 | - const allCell = (this.ui.editor.graph.getDefaultParent().children || []).filter(item => item.getAttribute(basicAttr.COMPONENT_TYPE)) | |
| 198 | + const allCell = this.ui.editor.graph.getModel().cells || {} | |
| 200 | 199 | const contentId = this.ui.currentPage.node.id |
| 201 | 200 | var configurationContent = { |
| 202 | 201 | name: "第 1 页", |
| ... | ... | @@ -204,12 +203,12 @@ LocalFile.prototype.saveFile = function (title, revision, success, error, useCur |
| 204 | 203 | contentId, |
| 205 | 204 | content: savedData, |
| 206 | 205 | type: 1, |
| 207 | - nodeIds: allCell.map(item => item.id) | |
| 206 | + nodeIds: Object.keys(allCell) | |
| 208 | 207 | }; |
| 209 | 208 | configurationContentList.push(configurationContent); |
| 210 | 209 | var parmam = { configurationId: Editor.configurationId, configurationContentList }; |
| 211 | 210 | defHttp.put("/yt/configuration/content", parmam).then(res => { |
| 212 | - console.log(res) | |
| 211 | + // console.log(res) | |
| 213 | 212 | }) |
| 214 | 213 | } |
| 215 | 214 | catch (e) { | ... | ... |
| ... | ... | @@ -372,6 +372,7 @@ Format.prototype.immediateRefresh = function () { |
| 372 | 372 | div.style.color = "rgb(112, 112, 112)"; |
| 373 | 373 | div.style.textAlign = "left"; |
| 374 | 374 | div.style.cursor = "default"; |
| 375 | + div.style.display = 'flex' | |
| 375 | 376 | |
| 376 | 377 | var label = document.createElement("div"); |
| 377 | 378 | label.className = "geFormatSection"; |
| ... | ... | @@ -385,6 +386,7 @@ Format.prototype.immediateRefresh = function () { |
| 385 | 386 | label.style.height = "25px"; |
| 386 | 387 | label.style.overflow = "hidden"; |
| 387 | 388 | label.style.width = "100%"; |
| 389 | + label.style.flex = 'auto' | |
| 388 | 390 | this.container.appendChild(div); |
| 389 | 391 | |
| 390 | 392 | // Prevents text selection |
| ... | ... | @@ -401,6 +403,24 @@ Format.prototype.immediateRefresh = function () { |
| 401 | 403 | var currentLabel = null; |
| 402 | 404 | var currentPanel = null; |
| 403 | 405 | |
| 406 | + | |
| 407 | + /** | |
| 408 | + * @description 验证是否有数据绑定面板 | |
| 409 | + * @returns {boolean} | |
| 410 | + */ | |
| 411 | + const validateHasDataSourcePanel = () => { | |
| 412 | + const ui = this.editorUi; | |
| 413 | + const ss = ui.getSelectionState(); | |
| 414 | + const vertices = ss.vertices || [] | |
| 415 | + const sidebarInstance = ui.sidebar | |
| 416 | + const cell = vertices[0] | |
| 417 | + if (!cell) return false | |
| 418 | + const basicAttr = sidebarInstance.enumCellBasicAttribute | |
| 419 | + const componentType = cell.getAttribute(basicAttr.COMPONENT_TYPE) | |
| 420 | + const hasPermission = sidebarInstance.getComponentPermission(componentType) | |
| 421 | + return !!hasPermission.length | |
| 422 | + } | |
| 423 | + | |
| 404 | 424 | var addClickHandler = mxUtils.bind( |
| 405 | 425 | this, |
| 406 | 426 | function (elt, panel, index, lastEntry) { |
| ... | ... | @@ -433,6 +453,8 @@ Format.prototype.immediateRefresh = function () { |
| 433 | 453 | currentPanel.style.display = ""; |
| 434 | 454 | } |
| 435 | 455 | } |
| 456 | + | |
| 457 | + if (!validateHasDataSourcePanel()) this.currentIndex = 0 | |
| 436 | 458 | }); |
| 437 | 459 | |
| 438 | 460 | mxEvent.addListener(elt, "click", clickHandler); |
| ... | ... | @@ -584,14 +606,16 @@ Format.prototype.immediateRefresh = function () { |
| 584 | 606 | this.panels.push(new ArrangePanel(this, ui, arrangePanel)); |
| 585 | 607 | this.container.appendChild(arrangePanel); |
| 586 | 608 | |
| 587 | - // bind data | |
| 588 | - mxUtils.write(label4, "数据绑定"); | |
| 589 | - div.appendChild(label4); | |
| 609 | + if (validateHasDataSourcePanel()) { | |
| 610 | + // bind data | |
| 611 | + mxUtils.write(label4, "数据绑定"); | |
| 612 | + div.appendChild(label4); | |
| 590 | 613 | |
| 591 | - var dataPanel = div.cloneNode(false); | |
| 592 | - dataPanel.style.display = "none"; | |
| 593 | - this.panels.push(new DataFormatPanel(this, ui, dataPanel)); | |
| 594 | - this.container.appendChild(dataPanel); | |
| 614 | + var dataPanel = div.cloneNode(false); | |
| 615 | + dataPanel.style.display = "none"; | |
| 616 | + this.panels.push(new DataFormatPanel(this, ui, dataPanel)); | |
| 617 | + this.container.appendChild(dataPanel); | |
| 618 | + } | |
| 595 | 619 | |
| 596 | 620 | if (ss.cells.length > 0) { |
| 597 | 621 | addClickHandler(label2, textPanel, idx++); |
| ... | ... | @@ -5044,11 +5068,18 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 5044 | 5068 | } |
| 5045 | 5069 | |
| 5046 | 5070 | /** |
| 5047 | - * @description 刷新页面 | |
| 5071 | + * @description 刷新页面 用于在其他位置调用更新数据面板的操作,默认是个空函数,在生成数据源面板中进行了拓展 | |
| 5048 | 5072 | */ |
| 5049 | 5073 | function echoRefreshFn() { |
| 5050 | 5074 | } |
| 5051 | 5075 | |
| 5076 | + /** | |
| 5077 | + * @description 用于在其他位置获取数据源绑定的数据,在生成数据源面板中进行了改写 | |
| 5078 | + */ | |
| 5079 | + function getDataSourceBindValue() { | |
| 5080 | + | |
| 5081 | + } | |
| 5082 | + | |
| 5052 | 5083 | |
| 5053 | 5084 | // 获取url的请求参数函数 |
| 5054 | 5085 | function getRequest() { |
| ... | ... | @@ -5130,6 +5161,9 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 5130 | 5161 | await echoActionType() |
| 5131 | 5162 | } |
| 5132 | 5163 | |
| 5164 | + /** | |
| 5165 | + * @description 回显动效类型 | |
| 5166 | + */ | |
| 5133 | 5167 | async function echoActionType() { |
| 5134 | 5168 | const act = currentNodeData.act ?? [] |
| 5135 | 5169 | const event = currentNodeData.event ?? [] |
| ... | ... | @@ -5189,7 +5223,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 5189 | 5223 | |
| 5190 | 5224 | |
| 5191 | 5225 | async function mount() { |
| 5192 | - const { component, echoDataSource } = generatorDataSourceComponent({ validate: false }) | |
| 5226 | + const { component, echoDataSource, getValue } = generatorDataSourceComponent({ validate: false }) | |
| 5193 | 5227 | $(fragment).append(title).append(component) |
| 5194 | 5228 | $(container).append(fragment) |
| 5195 | 5229 | |
| ... | ... | @@ -5204,6 +5238,9 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 5204 | 5238 | echoDataSource(dataSource) |
| 5205 | 5239 | form.render(null, CONTAINER_FILTER) |
| 5206 | 5240 | } |
| 5241 | + | |
| 5242 | + // 改写获取数据源绑定的值 | |
| 5243 | + getDataSourceBindValue = getValue | |
| 5207 | 5244 | } |
| 5208 | 5245 | |
| 5209 | 5246 | mount() |
| ... | ... | @@ -5920,26 +5957,26 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 5920 | 5957 | const content = ` |
| 5921 | 5958 | <tr class="layui-form" lay-filter="${rowFormFilter}"> |
| 5922 | 5959 | <td> |
| 5923 | - <div class="layui-form-item"> | |
| 5924 | - <input class="layui-input ${enumActionEl.MIN_FILTER}" autocomplete="off" type="number" name="${enumConst.MIN}" lay-filter="${enumConst.MIN}" lay-verType="tips" lay-verify="required" /> | |
| 5925 | - </div> | |
| 5960 | + <div class="layui-form-item"> | |
| 5961 | + <input class="layui-input ${enumActionEl.MIN_FILTER}" autocomplete="off" type="number" name="${enumConst.MIN}" lay-filter="${enumConst.MIN}" lay-verType="tips" lay-verify="required" /> | |
| 5962 | + </div> | |
| 5926 | 5963 | </td> |
| 5927 | 5964 | <td> |
| 5928 | - <div class="layui-form-item"> | |
| 5929 | - <input class="layui-input ${enumActionEl.MAX_FILTER}"" autocomplete="off" type="number" name="${enumConst.MAX}" lay-filter="${enumConst.MAX}" lay-verType="tips" lay-verify="required" /> | |
| 5930 | - </div> | |
| 5965 | + <div class="layui-form-item"> | |
| 5966 | + <input class="layui-input ${enumActionEl.MAX_FILTER}"" autocomplete="off" type="number" name="${enumConst.MAX}" lay-filter="${enumConst.MAX}" lay-verType="tips" lay-verify="required" /> | |
| 5967 | + </div> | |
| 5931 | 5968 | </td> |
| 5932 | 5969 | <td> |
| 5933 | - <div class="${enumActionEl.SET_IMG_EL}"> | |
| 5934 | - <input name="${enumConst.IMAGE_GALLERY_CATEGORY}" type="text" style="display: none"> | |
| 5935 | - <input name="${enumConst.IMAGE_GALLERY_IMAGE_PATH}" type="text" style="display: none"> | |
| 5936 | - <input name="${enumConst.IMAGE_ORIGIN}" type="text" style="display: none"> | |
| 5937 | - <div class="${enumActionEl.PREVIEW_IMG_CONTAINER}"> | |
| 5938 | - <img src="" alt=""> | |
| 5939 | - <div class="${enumActionEl.DEL_PREVIEW_IMG}">x</div> | |
| 5940 | - <div class="add__button">+</div> | |
| 5941 | - </div> | |
| 5942 | - </div> | |
| 5970 | + <div class="${enumActionEl.SET_IMG_EL}"> | |
| 5971 | + <input name="${enumConst.IMAGE_GALLERY_CATEGORY}" type="text" style="display: none"> | |
| 5972 | + <input name="${enumConst.IMAGE_GALLERY_IMAGE_PATH}" type="text" style="display: none"> | |
| 5973 | + <input name="${enumConst.IMAGE_ORIGIN}" type="text" style="display: none"> | |
| 5974 | + <div class="${enumActionEl.PREVIEW_IMG_CONTAINER}"> | |
| 5975 | + <img src="" alt=""> | |
| 5976 | + <div class="${enumActionEl.DEL_PREVIEW_IMG}">x</div> | |
| 5977 | + <div class="add__button">+</div> | |
| 5978 | + </div> | |
| 5979 | + </div> | |
| 5943 | 5980 | </td> |
| 5944 | 5981 | <!-- <td>--> |
| 5945 | 5982 | <!-- <div style="display: flex">--> |
| ... | ... | @@ -6164,6 +6201,11 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6164 | 6201 | */ |
| 6165 | 6202 | let orgId = null |
| 6166 | 6203 | |
| 6204 | + const recordData = { | |
| 6205 | + orgId: null, | |
| 6206 | + enabled: false | |
| 6207 | + } | |
| 6208 | + | |
| 6167 | 6209 | const getRowFilter = (rowNumber) => `${enumActionEl.ROW_FILTER}${rowNumber}` |
| 6168 | 6210 | |
| 6169 | 6211 | /** |
| ... | ... | @@ -6208,8 +6250,8 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6208 | 6250 | * @description 创建回显数据 查询出所有网关设备和直连设备 |
| 6209 | 6251 | */ |
| 6210 | 6252 | async function getAllGatewayDeviceAndConnectionDevice() { |
| 6211 | - if (!orgId) return | |
| 6212 | - const [err, res] = await to(ConfigurationNodeApi.getAllGatewayDeviceAndConnectionDevice(orgId)) | |
| 6253 | + if (!recordData.orgId) return | |
| 6254 | + const [err, res] = await to(ConfigurationNodeApi.getAllGatewayDeviceAndConnectionDevice(recordData.orgId)) | |
| 6213 | 6255 | allDeviceOptions = res |
| 6214 | 6256 | mountAllDeviceToSelect() |
| 6215 | 6257 | } |
| ... | ... | @@ -6259,7 +6301,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6259 | 6301 | data: treeList, |
| 6260 | 6302 | onlyIconControl: true, |
| 6261 | 6303 | click(node) { |
| 6262 | - orgId = node.data.id | |
| 6304 | + recordData.orgId = node.data.id | |
| 6263 | 6305 | getAllGatewayDeviceAndConnectionDevice() |
| 6264 | 6306 | }, |
| 6265 | 6307 | }, |
| ... | ... | @@ -6369,7 +6411,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6369 | 6411 | * @description 回显表单数据 |
| 6370 | 6412 | */ |
| 6371 | 6413 | function echoFormData(info) { |
| 6372 | - const { content: { data = [] } = {}, orgId } = info | |
| 6414 | + const { content: { data = [] } = {} } = info | |
| 6373 | 6415 | data.forEach((datum, index) => { |
| 6374 | 6416 | addRecord(datum) |
| 6375 | 6417 | form.val(getRowFilter(index), datum) |
| ... | ... | @@ -6380,9 +6422,11 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6380 | 6422 | * @description 回显组织树 |
| 6381 | 6423 | */ |
| 6382 | 6424 | function echoOrgTree(id) { |
| 6383 | - orgId = id | |
| 6425 | + recordData.orgId = id | |
| 6384 | 6426 | const node = UseLayUi.findTreeObjectByField(treeList, id) |
| 6385 | - UseLayUi.nextTick(() => $(`#${enumActionEl.ORG_EL} input[name="${enumConst.ORG_ID}"]`).val(orgId).parent().find('span').html(node?.name)) | |
| 6427 | + UseLayUi.nextTick(() => { | |
| 6428 | + $(`#${enumActionEl.ORG_EL} input[name="${enumConst.ORG_ID}"]`).val(recordData.orgId).parent().find('span').html(node?.name) | |
| 6429 | + }) | |
| 6386 | 6430 | } |
| 6387 | 6431 | |
| 6388 | 6432 | /** |
| ... | ... | @@ -6426,6 +6470,8 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6426 | 6470 | return validateFlag |
| 6427 | 6471 | } |
| 6428 | 6472 | |
| 6473 | + | |
| 6474 | + | |
| 6429 | 6475 | /** |
| 6430 | 6476 | * @description 保存 |
| 6431 | 6477 | */ |
| ... | ... | @@ -6433,8 +6479,9 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6433 | 6479 | const data = Array.from({ length: addRowNumber }).map((_, row) => form.val(getRowFilter(row))).filter(item => Object.keys(item).length) |
| 6434 | 6480 | if (!validate(data)) return |
| 6435 | 6481 | const formModal = { |
| 6482 | + ...recordData, | |
| 6436 | 6483 | configurationId, |
| 6437 | - orgId, | |
| 6484 | + // orgId, | |
| 6438 | 6485 | contentId: currentPageId.id, |
| 6439 | 6486 | id: graphId, |
| 6440 | 6487 | content: { |
| ... | ... | @@ -6523,10 +6570,10 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6523 | 6570 | 'lay-submit': '', |
| 6524 | 6571 | 'lay-filter': enumActionEl.LAYER_SUBMIT_FILTER, |
| 6525 | 6572 | }) |
| 6526 | - createOrgTreeSelect() | |
| 6573 | + await createOrgTreeSelect() | |
| 6527 | 6574 | const info = getLayerBindInfo('event', type) |
| 6528 | - const { content: { data = [] } = {}, orgId: recordOrgId } = info | |
| 6529 | - orgId = recordOrgId | |
| 6575 | + const { content: { data = [] } = {}, orgId, enabled } = info | |
| 6576 | + Object.assign(recordData, { orgId, enabled }) | |
| 6530 | 6577 | await getAllGatewayDeviceAndConnectionDevice() |
| 6531 | 6578 | if (!info || !data.length) { |
| 6532 | 6579 | addRecord() |
| ... | ... | @@ -6535,7 +6582,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6535 | 6582 | } |
| 6536 | 6583 | generatorEventListen() |
| 6537 | 6584 | form.render() |
| 6538 | - echoOrgTree(recordOrgId) | |
| 6585 | + echoOrgTree(orgId) | |
| 6539 | 6586 | }, |
| 6540 | 6587 | }) |
| 6541 | 6588 | } |
| ... | ... | @@ -6607,6 +6654,13 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6607 | 6654 | } |
| 6608 | 6655 | |
| 6609 | 6656 | /** |
| 6657 | + * @description | |
| 6658 | + */ | |
| 6659 | + const recordData = { | |
| 6660 | + enabled: false | |
| 6661 | + } | |
| 6662 | + | |
| 6663 | + /** | |
| 6610 | 6664 | * @description 回显数据 |
| 6611 | 6665 | */ |
| 6612 | 6666 | function echoFormData(data) { |
| ... | ... | @@ -6633,6 +6687,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6633 | 6687 | contentId: currentPageId.id, |
| 6634 | 6688 | id: graphId, |
| 6635 | 6689 | orgId: 'b4dd6e2b-6e0f-413c-bf5a-70133bd571e8', |
| 6690 | + ...recordData, | |
| 6636 | 6691 | content: { |
| 6637 | 6692 | type: formVal[enumConst.ACTION], |
| 6638 | 6693 | value: formVal[enumGetValue[formVal[enumConst.ACTION]]], |
| ... | ... | @@ -6741,6 +6796,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6741 | 6796 | }) |
| 6742 | 6797 | generatorEventListen() |
| 6743 | 6798 | const info = getLayerBindInfo('event', type) |
| 6799 | + Object.assign(recordData, { enabled: info.enabled }) | |
| 6744 | 6800 | form.render(null, enumActionEl.FORM_FILTER) |
| 6745 | 6801 | if (info) echoFormData(info) |
| 6746 | 6802 | }, |
| ... | ... | @@ -6801,6 +6857,10 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6801 | 6857 | */ |
| 6802 | 6858 | let addRowNumber = 0 |
| 6803 | 6859 | |
| 6860 | + const recordData = { | |
| 6861 | + enabled: false | |
| 6862 | + } | |
| 6863 | + | |
| 6804 | 6864 | function generatorDisplayOptions() { |
| 6805 | 6865 | const options = [ |
| 6806 | 6866 | { name: '显示', id: enumDisplayType.SHOW }, |
| ... | ... | @@ -6959,6 +7019,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 6959 | 7019 | id: graphId, |
| 6960 | 7020 | condition: tableData, |
| 6961 | 7021 | type: event.data.type, |
| 7022 | + ...recordData | |
| 6962 | 7023 | } |
| 6963 | 7024 | await to(autoSaveGraphInfo()) |
| 6964 | 7025 | const [err, res] = await to(ConfigurationNodeApi.updateNodeAct(formModel)) |
| ... | ... | @@ -7024,7 +7085,8 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 7024 | 7085 | $(`#${enumActionEl.DATA_SOURCE_COMP_EL}`).append(component) |
| 7025 | 7086 | form.render() |
| 7026 | 7087 | const info = getLayerBindInfo('act', type) |
| 7027 | - const { condition = [] } = info | |
| 7088 | + const { condition = [], enabled } = info | |
| 7089 | + Object.assign(recordData, { enabled }) | |
| 7028 | 7090 | if (info && condition.length) { |
| 7029 | 7091 | echoDataSource(info) |
| 7030 | 7092 | echoData(info) |
| ... | ... | @@ -7417,17 +7479,16 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 7417 | 7479 | */ |
| 7418 | 7480 | function createLocalFileContainer() { |
| 7419 | 7481 | return ` |
| 7420 | - <div id="${enumActionEl.UPLOAD_LOCAL_FILE_EL}" class="layui-upload"> | |
| 7421 | - <div class="preview__img"> | |
| 7422 | - <img src="" class="layui-upload-img" id="${enumActionEl.IMAGE_PREVIEW_EL}"> | |
| 7423 | - <div class="var_image__add-icon">+</div> | |
| 7424 | - <div class="var-image__del-icon">x</div> | |
| 7425 | - </div> | |
| 7426 | - <div class="layui-upload-list"></div> | |
| 7427 | - </div> | |
| 7428 | - <div id="${enumActionEl.IMAGE_UPLOAD_STATE_EL}"></div> | |
| 7429 | - <div style="margin-top: 30px;">图片格式支持png、jpg(jpeg)、gif, 大小不能超过5M</div> | |
| 7430 | - ` | |
| 7482 | + <div id="${enumActionEl.UPLOAD_LOCAL_FILE_EL}" class="layui-upload"> | |
| 7483 | + <div class="preview__img"> | |
| 7484 | + <img src="" class="layui-upload-img" id="${enumActionEl.IMAGE_PREVIEW_EL}"> | |
| 7485 | + <div class="var_image__add-icon">+</div> | |
| 7486 | + <div class="var-image__del-icon">x</div> | |
| 7487 | + </div> | |
| 7488 | + <div class="layui-upload-list"></div> | |
| 7489 | + </div> | |
| 7490 | + <div style="margin-top: 10px;" id="${enumActionEl.IMAGE_UPLOAD_STATE_EL}"></div> | |
| 7491 | + <div style="margin-top: 10px;">图片格式支持png、jpg(jpeg)、gif, 大小不能超过5M</div>` | |
| 7431 | 7492 | } |
| 7432 | 7493 | |
| 7433 | 7494 | /** |
| ... | ... | @@ -7437,15 +7498,14 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 7437 | 7498 | const category = sidebarInstance.getAllVariableImageLib() |
| 7438 | 7499 | const defaultShow = category[0] || { lib: [] } |
| 7439 | 7500 | return ` |
| 7440 | - <div class="var-image__container--gallery"> | |
| 7441 | - <div id="${enumActionEl.VAR_IMG_CONTAINER_SIDEBAR}"> | |
| 7442 | - ${category.reduce((prev, next) => prev + `<div class="${enumActionEl.VAR_IMG_CATEGORY}" ${enumConst.IMAGE_GALLERY_CATEGORY}="${next.key}">${next.label}</div>`, '')} | |
| 7443 | - </div> | |
| 7444 | - <div id="${enumActionEl.VAR_IMG_CONTAINER_CONTENT}"> | |
| 7445 | - ${defaultShow.lib.reduce((prev, next) => prev + `<div class="${enumActionEl.VAR_IMG_ITEM}" title="${next.name}"><img src="${next.staticPath}" alt=""></div>`, '')} | |
| 7446 | - </div> | |
| 7447 | - </div> | |
| 7448 | - ` | |
| 7501 | + <div class="var-image__container--gallery"> | |
| 7502 | + <div id="${enumActionEl.VAR_IMG_CONTAINER_SIDEBAR}"> | |
| 7503 | + ${category.reduce((prev, next) => prev + `<div class="${enumActionEl.VAR_IMG_CATEGORY}" ${enumConst.IMAGE_GALLERY_CATEGORY}="${next.key}">${next.label}</div>`, '')} | |
| 7504 | + </div> | |
| 7505 | + <div id="${enumActionEl.VAR_IMG_CONTAINER_CONTENT}"> | |
| 7506 | + ${defaultShow.lib.reduce((prev, next) => prev + `<div class="${enumActionEl.VAR_IMG_ITEM}" title="${next.name}"><img src="${next.staticPath}" alt=""></div>`, '')} | |
| 7507 | + </div> | |
| 7508 | + </div>` | |
| 7449 | 7509 | } |
| 7450 | 7510 | |
| 7451 | 7511 | /** |
| ... | ... | @@ -7464,14 +7524,20 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 7464 | 7524 | url: '/yt/oss/upload', |
| 7465 | 7525 | method: 'post', |
| 7466 | 7526 | choose(obj) { |
| 7527 | + console.log('enter choose') | |
| 7467 | 7528 | obj.preview(async function (index, file, result) { |
| 7468 | 7529 | const formData = new FormData() |
| 7469 | 7530 | formData.set('file', file) |
| 7531 | + $(`#${enumActionEl.IMAGE_UPLOAD_STATE_EL}`).html('上传中...') | |
| 7470 | 7532 | const [err, res] = await to(ConfigurationNodeApi.uploadImg(formData)) |
| 7471 | 7533 | if (!err) { |
| 7472 | 7534 | $(`#${enumActionEl.IMAGE_PREVIEW_EL}`).attr('src', result) |
| 7473 | 7535 | const { fileStaticUri = '' } = res |
| 7474 | 7536 | imageState[enumConst.IMAGE_GALLERY_IMAGE_PATH] = fileStaticUri |
| 7537 | + $(`#${enumActionEl.IMAGE_UPLOAD_STATE_EL}`).html('上传成功').css({ color: '#5fb878' }) | |
| 7538 | + } else { | |
| 7539 | + console.log(err) | |
| 7540 | + $(`#${enumActionEl.IMAGE_UPLOAD_STATE_EL}`).html('上传失败').css({ color: 'red' }) | |
| 7475 | 7541 | } |
| 7476 | 7542 | }); |
| 7477 | 7543 | }, |
| ... | ... | @@ -7545,9 +7611,9 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 7545 | 7611 | imageState = {} |
| 7546 | 7612 | layer.close(index) |
| 7547 | 7613 | }, |
| 7548 | - zIndex: layer.zIndex, | |
| 7614 | + // zIndex: layer.zIndex, | |
| 7549 | 7615 | async success(layero, index) { |
| 7550 | - layer.setTop(layero); | |
| 7616 | + // layer.setTop(layero); | |
| 7551 | 7617 | $(layero).addClass('layui-form').find('.layui-layer-btn0').attr({ |
| 7552 | 7618 | 'lay-submit': '', |
| 7553 | 7619 | 'lay-filter': enumActionEl.IMAGE_LAYER_FILTER, |
| ... | ... | @@ -7565,17 +7631,31 @@ DataFormatPanel.prototype.addDataFont = function (container) { |
| 7565 | 7631 | // 异步设置此处才能生效 -- 设置默认select和样式和初始化侧边栏生成组件和事件绑定 |
| 7566 | 7632 | setTimeout(() => { |
| 7567 | 7633 | |
| 7634 | + function proxyFn(fn) { | |
| 7635 | + return (...args) => { | |
| 7636 | + const currentDataSource = getDataSourceBindValue() || {} | |
| 7637 | + | |
| 7638 | + to(ConfigurationNodeApi.updateNodeInfo({ | |
| 7639 | + configurationId, | |
| 7640 | + contentId: currentPageId.id, | |
| 7641 | + nodeId: graphId, | |
| 7642 | + [enumCategory.DATA_SOURCE]: currentDataSource | |
| 7643 | + })) | |
| 7644 | + fn.apply(null, args) | |
| 7645 | + } | |
| 7646 | + } | |
| 7647 | + | |
| 7568 | 7648 | // TODO 数据交互事件 |
| 7569 | - $(`#${enumDynamicEffectType.IMAGE}`).click({ type: enumDynamicEffectType.IMAGE }, handleSettingVarImage); | |
| 7649 | + $(`#${enumDynamicEffectType.IMAGE}`).click({ type: enumDynamicEffectType.IMAGE }, proxyFn(handleSettingVarImage)); | |
| 7570 | 7650 | |
| 7571 | - $(`#${enumInteractionType.DOWN}`).click({ type: enumInteractionType.DOWN }, handleDownOrUpEvent); | |
| 7572 | - $(`#${enumInteractionType.UP}`).click({ type: enumInteractionType.UP }, handleDownOrUpEvent); | |
| 7573 | - $(`#${enumInteractionType.SINGLE}`).click({ type: enumInteractionType.SINGLE }, handleClickOrDbClick); | |
| 7574 | - $(`#${enumInteractionType.DOUBLE}`).click({ type: enumInteractionType.DOUBLE }, handleClickOrDbClick); | |
| 7651 | + $(`#${enumInteractionType.DOWN}`).click({ type: enumInteractionType.DOWN }, proxyFn(handleDownOrUpEvent)); | |
| 7652 | + $(`#${enumInteractionType.UP}`).click({ type: enumInteractionType.UP }, proxyFn(handleDownOrUpEvent)); | |
| 7653 | + $(`#${enumInteractionType.SINGLE}`).click({ type: enumInteractionType.SINGLE }, proxyFn(handleClickOrDbClick)); | |
| 7654 | + $(`#${enumInteractionType.DOUBLE}`).click({ type: enumInteractionType.DOUBLE }, proxyFn(handleClickOrDbClick)); | |
| 7575 | 7655 | // 数据动效事件 |
| 7576 | - $(`#${enumDynamicEffectType.FLASH}`).click({ type: enumDynamicEffectType.FLASH }, handleDataDynamicEffect); | |
| 7577 | - $(`#${enumDynamicEffectType.DISPLAY}`).click({ type: enumDynamicEffectType.DISPLAY }, handleDataDynamicEffect); | |
| 7578 | - $(`#${enumDynamicEffectType.ROTATE}`).click({ type: enumDynamicEffectType.ROTATE }, handleDataDynamicEffect); | |
| 7656 | + $(`#${enumDynamicEffectType.FLASH}`).click({ type: enumDynamicEffectType.FLASH }, proxyFn(handleDataDynamicEffect)); | |
| 7657 | + $(`#${enumDynamicEffectType.DISPLAY}`).click({ type: enumDynamicEffectType.DISPLAY }, proxyFn(handleDataDynamicEffect)); | |
| 7658 | + $(`#${enumDynamicEffectType.ROTATE}`).click({ type: enumDynamicEffectType.ROTATE }, proxyFn(handleDataDynamicEffect)); | |
| 7579 | 7659 | }); |
| 7580 | 7660 | }; |
| 7581 | 7661 | |
| ... | ... | @@ -11566,7 +11646,7 @@ class UseLayUi { |
| 11566 | 11646 | static createTreeSelect(options) { |
| 11567 | 11647 | const CLASS_NAME = 'things-kit-tree-select' |
| 11568 | 11648 | const SELECT_CLS = 'things-kit-tree-select__tree' |
| 11569 | - const { tree, jquery: $ } = layui | |
| 11649 | + const { tree, jquery: $, form } = layui | |
| 11570 | 11650 | |
| 11571 | 11651 | const { |
| 11572 | 11652 | layFilter, |
| ... | ... | @@ -11625,47 +11705,48 @@ class UseLayUi { |
| 11625 | 11705 | $(elem).html(template) |
| 11626 | 11706 | |
| 11627 | 11707 | // mount tree |
| 11628 | - UseLayUi.nextTick(() => { | |
| 11629 | - tree.render({ | |
| 11630 | - ...treeProps, | |
| 11631 | - ...(autoFormatDataSource ? { data: UseLayUi.formatTreeDataSource(data, customSetTree, valueField, labelField, childrenField) } : {}), | |
| 11632 | - elem: $(elem).find('.tree-select__tree-mount'), | |
| 11633 | - click(node) { | |
| 11634 | - setValue(node.data) | |
| 11635 | - if (UseLayUi.isFunction(click)) click(node) | |
| 11636 | - }, | |
| 11637 | - }) | |
| 11708 | + // UseLayUi.nextTick(() => { | |
| 11709 | + tree.render({ | |
| 11710 | + ...treeProps, | |
| 11711 | + ...(autoFormatDataSource ? { data: UseLayUi.formatTreeDataSource(data, customSetTree, valueField, labelField, childrenField) } : {}), | |
| 11712 | + elem: $(elem).find('.tree-select__tree-mount'), | |
| 11713 | + click(node) { | |
| 11714 | + setValue(node.data) | |
| 11715 | + if (UseLayUi.isFunction(click)) click(node) | |
| 11716 | + }, | |
| 11717 | + }) | |
| 11638 | 11718 | |
| 11639 | - // focus | |
| 11640 | - $(`.${SELECT_CLS}`).off('click') | |
| 11641 | - .on("click", ".layui-select-title", function (e) { | |
| 11642 | - $(document).find('.layui-form-select').removeClass('layui-form-selected') | |
| 11643 | - $(this).parents(`.${SELECT_CLS}`).toggleClass("layui-form-selected"); | |
| 11644 | - layui.stope(e); | |
| 11645 | - }) | |
| 11646 | - .on('click', '.layui-anim', (e) => { | |
| 11647 | - layui.stope(e) | |
| 11648 | - }) | |
| 11649 | - .on("click", "dl i", function (e) { | |
| 11650 | - layui.stope(e); | |
| 11651 | - }) | |
| 11719 | + // focus | |
| 11720 | + $(`.${SELECT_CLS}`).off('click') | |
| 11721 | + .on("click", ".layui-select-title", function (e) { | |
| 11722 | + $(document).find('.layui-form-select').removeClass('layui-form-selected') | |
| 11723 | + $(this).parents(`.${SELECT_CLS}`).toggleClass("layui-form-selected"); | |
| 11724 | + layui.stope(e); | |
| 11725 | + }) | |
| 11726 | + .on('click', '.layui-anim', (e) => { | |
| 11727 | + layui.stope(e) | |
| 11728 | + }) | |
| 11729 | + .on("click", "dl i", function (e) { | |
| 11730 | + layui.stope(e); | |
| 11731 | + }) | |
| 11652 | 11732 | |
| 11653 | - // blur | |
| 11654 | - // $(document) | |
| 11655 | - // .on("click", function (e) { | |
| 11656 | - // const target = e.target | |
| 11657 | - // const parentNode = $(`.${CLASS_NAME} .tree-select__tree-mount`) | |
| 11658 | - // if (!parentNode) return | |
| 11659 | - // console.log($.contains(parentNode, target)) | |
| 11660 | - // // const showClose = UseLayUi.isInNode(parentNode, target, true) | |
| 11661 | - // // if (showClose) return | |
| 11662 | - // // $(`.${ SELECT_CLS }`).removeClass("layui-form-selected") | |
| 11663 | - // }); | |
| 11664 | - | |
| 11665 | - if (UseLayUi.isFunction(onReady)) { | |
| 11666 | - onReady(setValue) | |
| 11667 | - } | |
| 11668 | - }) | |
| 11733 | + // blur | |
| 11734 | + // $(document) | |
| 11735 | + // .on("click", function (e) { | |
| 11736 | + // const target = e.target | |
| 11737 | + // const parentNode = $(`.${CLASS_NAME} .tree-select__tree-mount`) | |
| 11738 | + // if (!parentNode) return | |
| 11739 | + // console.log($.contains(parentNode, target)) | |
| 11740 | + // // const showClose = UseLayUi.isInNode(parentNode, target, true) | |
| 11741 | + // // if (showClose) return | |
| 11742 | + // // $(`.${ SELECT_CLS }`).removeClass("layui-form-selected") | |
| 11743 | + // }); | |
| 11744 | + | |
| 11745 | + if (UseLayUi.isFunction(onReady)) { | |
| 11746 | + onReady(setValue) | |
| 11747 | + } | |
| 11748 | + // }) | |
| 11749 | + form.render() | |
| 11669 | 11750 | } |
| 11670 | 11751 | |
| 11671 | 11752 | mount() |
| ... | ... | @@ -11707,13 +11788,13 @@ class UseLayUi { |
| 11707 | 11788 | } |
| 11708 | 11789 | |
| 11709 | 11790 | let template = ` |
| 11710 | - <div class="layui-form-item ${CLASS_NAME}" > | |
| 11711 | - <label class="layui-form-label">${label}</label> | |
| 11712 | - <div class="layui-input-block"> | |
| 11713 | - ${createOptions(dataSource).join('')} | |
| 11714 | - </div> | |
| 11715 | - </div> | |
| 11716 | - ` | |
| 11791 | + <div class="layui-form-item ${CLASS_NAME}" > | |
| 11792 | + <label class="layui-form-label">${label}</label> | |
| 11793 | + <div class="layui-input-block"> | |
| 11794 | + ${createOptions(dataSource).join('')} | |
| 11795 | + </div> | |
| 11796 | + </div>` | |
| 11797 | + | |
| 11717 | 11798 | template = singleUsage ? UseLayUi.createSingleUseFormItem(template) : template |
| 11718 | 11799 | |
| 11719 | 11800 | function mount() { |
| ... | ... | @@ -12673,7 +12754,7 @@ class HandleDataSource { |
| 12673 | 12754 | dataZoom: [ |
| 12674 | 12755 | { |
| 12675 | 12756 | show: true, |
| 12676 | - type: 'slider', | |
| 12757 | + type: 'inside', | |
| 12677 | 12758 | // endValue: showNumberOf |
| 12678 | 12759 | } |
| 12679 | 12760 | ] |
| ... | ... | @@ -12729,7 +12810,7 @@ class HandleDataSource { |
| 12729 | 12810 | dataZoom: [ |
| 12730 | 12811 | { |
| 12731 | 12812 | show: true, |
| 12732 | - type: 'slider', | |
| 12813 | + type: 'inside', | |
| 12733 | 12814 | } |
| 12734 | 12815 | // { |
| 12735 | 12816 | // startValue: seriesValue.length - 1 > showNumberOf |
| ... | ... | @@ -12819,7 +12900,7 @@ class HandleDataSource { |
| 12819 | 12900 | { |
| 12820 | 12901 | // xAxisIndex: 0, |
| 12821 | 12902 | show: true, |
| 12822 | - type: 'slider', | |
| 12903 | + type: 'inside', | |
| 12823 | 12904 | // startValue: 0, |
| 12824 | 12905 | // endValue: showNumberOf |
| 12825 | 12906 | } |
| ... | ... | @@ -12862,6 +12943,9 @@ class HandleDataSource { |
| 12862 | 12943 | } |
| 12863 | 12944 | |
| 12864 | 12945 | instance.setOption(chartOption) |
| 12946 | + instance.on('dataZoom', () => { | |
| 12947 | + console.log(instance.getOption()) | |
| 12948 | + }) | |
| 12865 | 12949 | // instance.on('mouseover', stop) |
| 12866 | 12950 | // instance.on('mouseout', goMove) |
| 12867 | 12951 | // autoMove() |
| ... | ... | @@ -12998,13 +13082,17 @@ class HandleDataInteraction { |
| 12998 | 13082 | graphClick.apply(this.graph, args) |
| 12999 | 13083 | } |
| 13000 | 13084 | |
| 13085 | + const mouseDownEvent = this.throttle(this.handleMouseDownEvent) | |
| 13086 | + const mouseUpEvent = this.throttle(this.handleMouseUpEvent) | |
| 13001 | 13087 | const graphFireMouseEvent = this.graph.fireMouseEvent; |
| 13002 | 13088 | this.graph.fireMouseEvent = (eventName, event, sender) => { |
| 13003 | 13089 | if (eventName === mxEvent.MOUSE_DOWN) { |
| 13004 | - this.handleMouseDownEvent(eventName, event, sender) | |
| 13090 | + // this.handleMouseDownEvent(eventName, event, sender) | |
| 13091 | + mouseDownEvent(eventName, event, sender) | |
| 13005 | 13092 | } |
| 13006 | 13093 | if (eventName === mxEvent.MOUSE_UP) { |
| 13007 | - this.handleMouseUpEvent(eventName, event, sender) | |
| 13094 | + mouseUpEvent(eventName, event, sender) | |
| 13095 | + // this.handleMouseUpEvent(eventName, event, sender) | |
| 13008 | 13096 | } |
| 13009 | 13097 | graphFireMouseEvent.apply(this.graph, [eventName, event, sender]); |
| 13010 | 13098 | }; |
| ... | ... | @@ -13043,7 +13131,7 @@ class HandleDataInteraction { |
| 13043 | 13131 | } |
| 13044 | 13132 | |
| 13045 | 13133 | /** |
| 13046 | - * @description 鼠标双击事件 | |
| 13134 | + * @description 鼠标单击事件事件 | |
| 13047 | 13135 | * @param event |
| 13048 | 13136 | */ |
| 13049 | 13137 | handleClickEvent(event) { |
| ... | ... | @@ -13052,16 +13140,16 @@ class HandleDataInteraction { |
| 13052 | 13140 | if (temp && temp.has(DispatchCenter.enumEventType.SINGLE)) { |
| 13053 | 13141 | const content = temp.get(DispatchCenter.enumEventType.SINGLE) |
| 13054 | 13142 | const { type, value } = content |
| 13055 | - if (type === DispatchCenter.enumPageType.PAGE) { | |
| 13143 | + if (type === DispatchCenter.enumPageType.PAGE && value) { | |
| 13056 | 13144 | this.jumpPage(value) |
| 13057 | - } else if (type === DispatchCenter.enumPageType.LINK) { | |
| 13145 | + } else if (type === DispatchCenter.enumPageType.LINK && value) { | |
| 13058 | 13146 | window.open(value) |
| 13059 | 13147 | } |
| 13060 | 13148 | } |
| 13061 | 13149 | } |
| 13062 | 13150 | |
| 13063 | 13151 | /** |
| 13064 | - * @description 鼠标单击事件 | |
| 13152 | + * @description 鼠标双击事件 | |
| 13065 | 13153 | * @param event |
| 13066 | 13154 | * @param cell |
| 13067 | 13155 | */ |
| ... | ... | @@ -13071,9 +13159,9 @@ class HandleDataInteraction { |
| 13071 | 13159 | if (temp && temp.has(DispatchCenter.enumEventType.DOUBLE)) { |
| 13072 | 13160 | const content = temp.get(DispatchCenter.enumEventType.DOUBLE) |
| 13073 | 13161 | const { type, value } = content |
| 13074 | - if (type === DispatchCenter.enumPageType.PAGE) { | |
| 13162 | + if (type === DispatchCenter.enumPageType.PAGE && value) { | |
| 13075 | 13163 | this.jumpPage(value) |
| 13076 | - } else if (type === DispatchCenter.enumPageType.LINK) { | |
| 13164 | + } else if (type === DispatchCenter.enumPageType.LINK && value) { | |
| 13077 | 13165 | window.open(value) |
| 13078 | 13166 | } |
| 13079 | 13167 | } |
| ... | ... | @@ -13116,11 +13204,27 @@ class HandleDataInteraction { |
| 13116 | 13204 | Promise.all(queue.map(fn => fn())) |
| 13117 | 13205 | } |
| 13118 | 13206 | |
| 13207 | + throttle(fn, time = 1000) { | |
| 13208 | + let now = Date.now | |
| 13209 | + let oldTime = now() | |
| 13210 | + return (...args) => { | |
| 13211 | + let newTime = now() | |
| 13212 | + if (newTime - oldTime > time) { | |
| 13213 | + oldTime = now() | |
| 13214 | + fn.apply(this, args) | |
| 13215 | + } | |
| 13216 | + } | |
| 13217 | + } | |
| 13218 | + | |
| 13119 | 13219 | /** |
| 13120 | 13220 | * @description 跳转页面 |
| 13121 | 13221 | */ |
| 13122 | 13222 | jumpPage(page) { |
| 13123 | - this.editorUi.handleCustomLink(`data:page/id,${page}`) | |
| 13223 | + try { | |
| 13224 | + this.editorUi.handleCustomLink(`data:page/id,${page}`) | |
| 13225 | + } catch (error) { | |
| 13226 | + throw error | |
| 13227 | + } | |
| 13124 | 13228 | } |
| 13125 | 13229 | } |
| 13126 | 13230 | |
| ... | ... | @@ -13480,7 +13584,7 @@ class HandleDynamicEffect { |
| 13480 | 13584 | } |
| 13481 | 13585 | |
| 13482 | 13586 | /** |
| 13483 | - * @description 验证优先级 | |
| 13587 | + * @description 验证数据动效优先级 显示隐藏优先级最高 | |
| 13484 | 13588 | * @param {string} nodeId |
| 13485 | 13589 | * @returns |
| 13486 | 13590 | */ | ... | ... |