Commit 2abf7e034a89237a393f2905bde135feb4078633

Authored by ww
1 parent 8bad255a

perf: mount select option to body

@@ -36,6 +36,15 @@ class ConfigurationNodeApi { @@ -36,6 +36,15 @@ class ConfigurationNodeApi {
36 } 36 }
37 37
38 /** 38 /**
  39 + * @description 获取所有的网关设备和直连设备
  40 + * @param {string} orgId
  41 + * @returns
  42 + */
  43 + static getAllGatewayDeviceAndConnectionDevice(orgId) {
  44 + return defHttp.get(`/yt/device/list/master/${orgId}`)
  45 + }
  46 +
  47 + /**
39 * @description 查询设备的子设备 48 * @description 查询设备的子设备
40 * @param deviceId 设备ID 49 * @param deviceId 设备ID
41 * @returns {Promise<*>} 50 * @returns {Promise<*>}
@@ -6021,9 +6021,9 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6021,9 +6021,9 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6021 /** 6021 /**
6022 * @description 创建回显数据 查询出所有网关设备和直连设备 6022 * @description 创建回显数据 查询出所有网关设备和直连设备
6023 */ 6023 */
6024 - async function getMaterDevice() { 6024 + async function getAllGatewayDeviceAndConnectionDevice() {
6025 if (!orgId) return 6025 if (!orgId) return
6026 - const [err, res] = await to(ConfigurationNodeApi.getMasterDevice(orgId)) 6026 + const [err, res] = await to(ConfigurationNodeApi.getAllGatewayDeviceAndConnectionDevice(orgId))
6027 allDeviceOptions = res 6027 allDeviceOptions = res
6028 const generateOption = UseLayUi.generateOptionTemplate({ dataSource: res }) 6028 const generateOption = UseLayUi.generateOptionTemplate({ dataSource: res })
6029 $(`#${enumActionEl.DEVICE_DATA_BODY_EL}`).find(`select[name="${enumConst.DEVICE}"]`).html(generateOption) 6029 $(`#${enumActionEl.DEVICE_DATA_BODY_EL}`).find(`select[name="${enumConst.DEVICE}"]`).html(generateOption)
@@ -6065,7 +6065,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6065,7 +6065,7 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6065 onlyIconControl: true, 6065 onlyIconControl: true,
6066 click(node) { 6066 click(node) {
6067 orgId = node.data.id 6067 orgId = node.data.id
6068 - getMaterDevice() 6068 + getAllGatewayDeviceAndConnectionDevice()
6069 }, 6069 },
6070 }, 6070 },
6071 }) 6071 })
@@ -6082,9 +6082,6 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6082,9 +6082,6 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6082 <select name="${enumConst.DEVICE}" lay-filter="${enumConst.DEVICE}" lay-verType="tips" lay-verify="required"></select> 6082 <select name="${enumConst.DEVICE}" lay-filter="${enumConst.DEVICE}" lay-verType="tips" lay-verify="required"></select>
6083 </td> 6083 </td>
6084 <td> 6084 <td>
6085 - <select name="${enumConst.SLAVE_DEVICE}" lay-filter="${enumConst.SLAVE_DEVICE}" lay-verType="tips"></select>  
6086 - </td>  
6087 - <td>  
6088 <form action="" style="display: flex"> 6085 <form action="" style="display: flex">
6089 <div class="override__radio-default"> 6086 <div class="override__radio-default">
6090 <input id="${getRowFilter(addRowNumber)}${sendInstructionWay.ONE_WAR}" type="radio" name="${enumConst.WAY}" lay-ignore value="${sendInstructionWay.ONE_WAR}" title="单向" checked=""> 6087 <input id="${getRowFilter(addRowNumber)}${sendInstructionWay.ONE_WAR}" type="radio" name="${enumConst.WAY}" lay-ignore value="${sendInstructionWay.ONE_WAR}" title="单向" checked="">
@@ -6114,50 +6111,12 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6114,50 +6111,12 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6114 addRowNumber++ 6111 addRowNumber++
6115 } 6112 }
6116 6113
6117 - /**  
6118 - * @description 更新变量选项  
6119 - */  
6120 - async function updateVariableOptions(data) {  
6121 - if (!data.value) return  
6122 - const [err, res] = await to(ConfigurationNodeApi.getDeviceAttr(data.value))  
6123 - if (!res) return  
6124 - const generateOption = UseLayUi.generateOptionTemplate({ dataSource: res })  
6125 - $(data.elem).parents('tr').find(`select[name="${enumConst.ATTR}"]`).html(generateOption)  
6126 - form.render('select')  
6127 - }  
6128 -  
6129 - /**  
6130 - * @description 选择设备监听事件  
6131 - */  
6132 - function createSelectDeviceListenEvent() {  
6133 - form.on(`select(${enumConst.DEVICE})`, async (data) => {  
6134 - const filter = $(data.elem).parents('tr').attr('lay-filter')  
6135 - form.val(filter, {  
6136 - [enumConst.SLAVE_DEVICE]: null,  
6137 - })  
6138 - const isGATEWAY = allDeviceOptions.find(item => item.id === data.value)?.deviceType === "GATEWAY"  
6139 - // 网关设备请求子设备  
6140 - if (orgId && isGATEWAY && data.value) {  
6141 - const [err, res] = await to(ConfigurationNodeApi.getSlaveDevice(orgId, data.value))  
6142 - if (!res) return  
6143 - const generateOption = UseLayUi.generateOptionTemplate({ dataSource: res })  
6144 - $(data.elem).parents('tr').find(`select[name="${enumConst.SLAVE_DEVICE}"]`).html(generateOption)  
6145 - }  
6146 - // else {  
6147 - // updateVariableOptions(data)  
6148 - // }  
6149 - UseLayUi.nextTick(() => form.render(`select`, filter))  
6150 - })  
6151 - // form.on(`select(${ enumConst.SLAVE_DEVICE })`, (data) => {  
6152 - // updateVariableOptions(data)  
6153 - // })  
6154 - }  
6155 6114
6156 /** 6115 /**
6157 * @description 删除行 6116 * @description 删除行
6158 */ 6117 */
6159 function createDeleteRowListenEvent() { 6118 function createDeleteRowListenEvent() {
6160 - $(`.${enumActionEl.DEL_ROW_EL}`).on('click', (event) => { 6119 + $(`#${enumActionEl.DEVICE_DATA_BODY_EL}`).on('click', `.${enumActionEl.DEL_ROW_EL}`, (event) => {
6161 // $(event.target).parents('tr').find('editor') 6120 // $(event.target).parents('tr').find('editor')
6162 $(event.target).parents('tr').remove() 6121 $(event.target).parents('tr').remove()
6163 }) 6122 })
@@ -6171,7 +6130,6 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6171,7 +6130,6 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6171 addRecord() 6130 addRecord()
6172 const generateOption = UseLayUi.generateOptionTemplate({ dataSource: allDeviceOptions }) 6131 const generateOption = UseLayUi.generateOptionTemplate({ dataSource: allDeviceOptions })
6173 $(`#${enumActionEl.DEVICE_DATA_BODY_EL} tr`).last().find(`select[name="${enumConst.DEVICE}"]`).html(generateOption) 6132 $(`#${enumActionEl.DEVICE_DATA_BODY_EL} tr`).last().find(`select[name="${enumConst.DEVICE}"]`).html(generateOption)
6174 - createDeleteRowListenEvent()  
6175 form.render('select') 6133 form.render('select')
6176 }) 6134 })
6177 } 6135 }
@@ -6185,39 +6143,30 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6185,39 +6143,30 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6185 } 6143 }
6186 6144
6187 /** 6145 /**
6188 - * @description 生成事件监听  
6189 - */  
6190 - function generatorEventListen() {  
6191 - createSelectDeviceListenEvent()  
6192 - createDeleteRowListenEvent()  
6193 - createAddRowListenEvent()  
6194 - }  
6195 -  
6196 - /**  
6197 - * @description 挂载选项 根据行号 key 挂载option  
6198 - * @param row 行号  
6199 - * @param key select name  
6200 - * @param data 数据源 6146 + * @description 下拉选项挂载
6201 */ 6147 */
6202 - function mountSelectOptions(row, key, data) {  
6203 - const generateOption = UseLayUi.generateOptionTemplate({ dataSource: data })  
6204 - $(`#${enumActionEl.DEVICE_DATA_BODY_EL}`).find(`tr[lay-filter="${getRowFilter(row)}"] select[name="${key}"]`).html(generateOption)  
6205 - }  
6206 -  
6207 - /**  
6208 - * @description 根据主设备ID获取从设备  
6209 - */  
6210 - async function getSlaveDeviceByMasterDevice(deviceId, row) {  
6211 - const res = await ConfigurationNodeApi.getSlaveDevice(orgId, deviceId)  
6212 - mountSelectOptions(row, enumConst.SLAVE_DEVICE, res) 6148 + function createSelectOptionMountEvent(params) {
  6149 + $(`#${enumActionEl.DEVICE_DATA_BODY_EL}`).on('click', '.layui-form-select', event => {
  6150 + console.log(event)
  6151 + const width = event.currentTarget.offsetWidth || 200
  6152 + const height = event.currentTarget.offsetHeight || 38
  6153 + const offset = $(event.currentTarget).offset()
  6154 + $(event.currentTarget).find('dl').css({
  6155 + position: 'fixed',
  6156 + 'min-width': width + 'px',
  6157 + top: offset.top + height + 'px',
  6158 + left: offset.left + 'px'
  6159 + })
  6160 + })
6213 } 6161 }
6214 6162
6215 /** 6163 /**
6216 - * @description 根据设备ID获取设备属性 6164 + * @description 生成事件监听
6217 */ 6165 */
6218 - async function getDeviceAttrByDeviceId(deviceId, row) {  
6219 - const res = await ConfigurationNodeApi.getDeviceAttr(deviceId)  
6220 - mountSelectOptions(row, enumConst.ATTR, res) 6166 + function generatorEventListen() {
  6167 + createDeleteRowListenEvent()
  6168 + createAddRowListenEvent()
  6169 + createSelectOptionMountEvent()
6221 } 6170 }
6222 6171
6223 /** 6172 /**
@@ -6225,8 +6174,10 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6225,8 +6174,10 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6225 */ 6174 */
6226 function echoFormData(info) { 6175 function echoFormData(info) {
6227 const { content: { data = [] } = {}, orgId } = info 6176 const { content: { data = [] } = {}, orgId } = info
6228 - echoOrgTree(orgId)  
6229 - data.forEach((datum, index) => echoEachData(datum, index)) 6177 + data.forEach((datum, index) => {
  6178 + addRecord(datum)
  6179 + form.val(getRowFilter(index), datum)
  6180 + })
6230 } 6181 }
6231 6182
6232 /** 6183 /**
@@ -6234,33 +6185,17 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6234,33 +6185,17 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6234 */ 6185 */
6235 function echoOrgTree(id) { 6186 function echoOrgTree(id) {
6236 const node = UseLayUi.findTreeObjectByField(treeList, id) 6187 const node = UseLayUi.findTreeObjectByField(treeList, id)
6237 - $(`#${enumActionEl.ORG_EL}`).find(`input[name="${enumConst.ORG_ID}"]`).parent().find('span').html(node?.name) 6188 + orgId = id
  6189 + $(`#${enumActionEl.ORG_EL}`)
  6190 + .find(`input[name="${enumConst.ORG_ID}"]`).val(orgId).parent()
  6191 + .find('span').html(node?.name)
6238 } 6192 }
6239 6193
6240 /** 6194 /**
6241 - * @description 回显每条数据 6195 + * @description 判断是否为正确的JSON结构
  6196 + * @param {string} string
  6197 + * @returns
6242 */ 6198 */
6243 - function echoEachData(datum = {}, row) {  
6244 - addRecord(datum)  
6245 - const deviceId = datum[enumConst.DEVICE]  
6246 - const slaveDeviceId = datum[enumConst.SLAVE_DEVICE]  
6247 - const queue = []  
6248 -  
6249 - if (slaveDeviceId) {  
6250 - queue.push(() => getSlaveDeviceByMasterDevice(deviceId, row))  
6251 - // queue.push(() => getDeviceAttrByDeviceId(slaveDeviceId, row))  
6252 - }  
6253 - // else {  
6254 - // queue.push(() => getDeviceAttrByDeviceId(deviceId, row))  
6255 - // }  
6256 -  
6257 - Promise  
6258 - .all(queue.map(item => item()))  
6259 - .finally(() => {  
6260 - form.val(getRowFilter(row), datum)  
6261 - })  
6262 - }  
6263 -  
6264 function isJson(string) { 6199 function isJson(string) {
6265 if (typeof string === 'string') { 6200 if (typeof string === 'string') {
6266 try { 6201 try {
@@ -6357,7 +6292,6 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6357,7 +6292,6 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6357 <thead> 6292 <thead>
6358 <tr> 6293 <tr>
6359 <th style="text-align:center">选择设备</th> 6294 <th style="text-align:center">选择设备</th>
6360 - <th style="text-align:center">选择子设备</th>  
6361 <th style="text-align:center">单向 / 双向</th> 6295 <th style="text-align:center">单向 / 双向</th>
6362 <th style="text-align:center">下发值</th> 6296 <th style="text-align:center">下发值</th>
6363 <th style="text-align:center">操作</th> 6297 <th style="text-align:center">操作</th>
@@ -6397,11 +6331,12 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6397,11 +6331,12 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6397 }) 6331 })
6398 createOrgTreeSelect() 6332 createOrgTreeSelect()
6399 const info = getLayerBindInfo('event', type) 6333 const info = getLayerBindInfo('event', type)
6400 - const { content: { data = [] } = {} } = info 6334 + const { content: { data = [] } = {}, orgId } = info
  6335 + echoOrgTree(orgId)
  6336 + await getAllGatewayDeviceAndConnectionDevice()
6401 if (!info || !data.length) { 6337 if (!info || !data.length) {
6402 addRecord() 6338 addRecord()
6403 } else { 6339 } else {
6404 - await getMaterDevice()  
6405 echoFormData(info) 6340 echoFormData(info)
6406 } 6341 }
6407 generatorEventListen() 6342 generatorEventListen()
@@ -6716,7 +6651,6 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6716,7 +6651,6 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6716 function createAddRowListenEvent() { 6651 function createAddRowListenEvent() {
6717 $(`#${enumActionEl.ADD_BTN_EL}`).on('click', () => { 6652 $(`#${enumActionEl.ADD_BTN_EL}`).on('click', () => {
6718 addRecord() 6653 addRecord()
6719 - createDeleteRowListenEvent()  
6720 }) 6654 })
6721 } 6655 }
6722 6656
@@ -6724,7 +6658,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -6724,7 +6658,7 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6724 * @description 创建删除行事件 6658 * @description 创建删除行事件
6725 */ 6659 */
6726 function createDeleteRowListenEvent() { 6660 function createDeleteRowListenEvent() {
6727 - $(`.${enumActionEl.DEL_BTN_EL}`).on('click', (event) => { 6661 + $(`#${enumActionEl.TABLE_BODY_EL}`).on('click', `.${enumActionEl.DEL_BTN_EL}`, (event) => {
6728 $(event.target).parents('tr').remove() 6662 $(event.target).parents('tr').remove()
6729 }) 6663 })
6730 } 6664 }