简柏林 / thingskit-scada · Commits

Commit 3d86f998056052eb9fe24df64760f194a98dc74d

Authored by xp.Huang
2 parents 1ff6ddf0 48b516e3

Merge branch 'sqy_dev' into 'main' 

fix:更改右侧数据绑定的内容

See merge request huang/thingskit-drawio!6
Inline Side-by-side
Showing 6 changed files with 510 additions and 394 deletions
@@ -2,22 +2,21 @@ @@ -2,22 +2,21 @@
2 <!DOCTYPE html> 2 <!DOCTYPE html>
3 <html> 3 <html>
4 <head> 4 <head>
5 - <title>Flowchart Maker &amp; Online Diagram Software</title>  
6 - <meta charset="utf-8">  
7 - <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
8 - <meta name="Description" content="diagrams.net is free online diagram software for making flowcharts, process diagrams, org charts, UML, ER and network diagrams">  
9 - <meta name="Keywords" content="diagram, online, flow chart, flowchart maker, uml, erd">  
10 - <meta itemprop="name" content="diagrams.net - free flowchart maker and diagrams online"> 5 + <title>Flowchart Maker &amp; Online Diagram Software</title>
  6 + <meta charset="utf-8">
  7 + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  8 + <meta name="Description" content="diagrams.net is free online diagram software for making flowcharts, process diagrams, org charts, UML, ER and network diagrams">
  9 + <meta name="Keywords" content="diagram, online, flow chart, flowchart maker, uml, erd">
  10 + <meta itemprop="name" content="diagrams.net - free flowchart maker and diagrams online">
11 <meta itemprop="description" content="diagrams.net is a free online diagramming application and flowchart maker . You can use it to create UML, entity relationship, 11 <meta itemprop="description" content="diagrams.net is a free online diagramming application and flowchart maker . You can use it to create UML, entity relationship,
12 org charts, BPMN and BPM, database schema and networks. Also possible are telecommunication network, workflow, flowcharts, maps overlays and GIS, electronic 12 org charts, BPMN and BPM, database schema and networks. Also possible are telecommunication network, workflow, flowcharts, maps overlays and GIS, electronic
13 circuit and social network diagrams."> 13 circuit and social network diagrams.">
14 <meta itemprop="image" content="https://lh4.googleusercontent.com/-cLKEldMbT_E/Tx8qXDuw6eI/AAAAAAAAAAs/Ke0pnlk8Gpg/w500-h344-k/BPMN%2Bdiagram%2Brc2f.png"> 14 <meta itemprop="image" content="https://lh4.googleusercontent.com/-cLKEldMbT_E/Tx8qXDuw6eI/AAAAAAAAAAs/Ke0pnlk8Gpg/w500-h344-k/BPMN%2Bdiagram%2Brc2f.png">
15 - <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 15 + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
16 <meta name="msapplication-config" content="images/browserconfig.xml"> 16 <meta name="msapplication-config" content="images/browserconfig.xml">
17 - <meta name="mobile-web-app-capable" content="yes"> 17 + <meta name="mobile-web-app-capable" content="yes">
18 <meta name="theme-color" content="#d89000"> 18 <meta name="theme-color" content="#d89000">
19 <script src="./plugins/axios.min.js"></script> 19 <script src="./plugins/axios.min.js"></script>
20 - <script src="./plugins/DefHttp.js"></script>  
21 <script src="./js/jquery/jquery-3.3.1.min.js"></script> 20 <script src="./js/jquery/jquery-3.3.1.min.js"></script>
22 <script src="./js/jquery.easyui.min.js"></script> 21 <script src="./js/jquery.easyui.min.js"></script>
23 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/layui/2.6.8/css/layui.min.css" integrity="sha512-iQBJbsNHXUcgEIgWThd2dr8tOdKPvICwqjPEZYY81z3eMya44A5MiAqfWSCh+Ee1YzNYkdrI982Qhwgr8LEYOQ==" crossorigin="anonymous" referrerpolicy="no-referrer" /> 22 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/layui/2.6.8/css/layui.min.css" integrity="sha512-iQBJbsNHXUcgEIgWThd2dr8tOdKPvICwqjPEZYY81z3eMya44A5MiAqfWSCh+Ee1YzNYkdrI982Qhwgr8LEYOQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
@@ -29,6 +28,7 @@ @@ -29,6 +28,7 @@
29 <script type="text/javascript" src="./js/jquery.ztree.core.min.js"></script> 28 <script type="text/javascript" src="./js/jquery.ztree.core.min.js"></script>
30 <script type="text/javascript" src="./js/jquery.ztree.exhide.min.js"></script> 29 <script type="text/javascript" src="./js/jquery.ztree.exhide.min.js"></script>
31 <script type="text/javascript" src="./js/jquery.select.zTree.v1.5.min.js"></script> 30 <script type="text/javascript" src="./js/jquery.select.zTree.v1.5.min.js"></script>
  31 + <script src="./plugins/defHttp.js"></script>
32 32
33 <script type="text/javascript"> 33 <script type="text/javascript">
34 /** 34 /**
@@ -587,12 +587,18 @@ App.clearServiceWorker = function(success) @@ -587,12 +587,18 @@ App.clearServiceWorker = function(success)
587 * 587 *
588 * Optional callback is called with the app instance. 588 * Optional callback is called with the app instance.
589 */ 589 */
  590 +let defHttp;
590 App.main = function(callback, createUi) 591 App.main = function(callback, createUi)
591 { 592 {
  593 +
592 Editor.configurationId = urlParams.configurationId; 594 Editor.configurationId = urlParams.configurationId;
593 const localStorageInfo = localStorage.getItem("UNDEFINED__DEVELOPMENT__2.7.1__COMMON__LOCAL__KEY__"); 595 const localStorageInfo = localStorage.getItem("UNDEFINED__DEVELOPMENT__2.7.1__COMMON__LOCAL__KEY__");
594 - DefHttp.token = JSON.parse(localStorageInfo).value.JWT_TOKEN.value;  
595 - 596 + // 应用启动入口时创建一个axios实例，供全局使用
  597 + defHttp = createAxios({
  598 + timeout:10*1000,
  599 + baseURL:'/api',
  600 + token: JSON.parse(localStorageInfo).value.JWT_TOKEN.value
  601 + })
596 // Logs uncaught errors 602 // Logs uncaught errors
597 window.onerror = function(message, url, linenumber, colno, err) 603 window.onerror = function(message, url, linenumber, colno, err)
598 { 604 {
@@ -4983,11 +4989,11 @@ App.prototype.loadFile = function (id, sameWindow, file, success, force) { @@ -4983,11 +4989,11 @@ App.prototype.loadFile = function (id, sameWindow, file, success, force) {
4983 sameWindow = true; 4989 sameWindow = true;
4984 } 4990 }
4985 //调用API,获取保存的内容 4991 //调用API,获取保存的内容
4986 - DefHttp().get('/yt/configuration/center/getConfigurationInfo/'+Editor.configurationId) 4992 + defHttp.get('/yt/configuration/center/getConfigurationInfo/'+Editor.configurationId)
4987 .then(function (response) { 4993 .then(function (response) {
4988 - Editor.configurationName = response.data.configurationName + ".drawio";  
4989 - if(response.data.configurationContentList.length > 0){  
4990 - response.data.configurationContentList.forEach((item)=>{ 4994 + Editor.configurationName = response.configurationName + ".drawio";
  4995 + if(response.configurationContentList.length > 0){
  4996 + response.configurationContentList.forEach((item)=>{
4991 Editor.configurationContentId = item.id; 4997 Editor.configurationContentId = item.id;
4992 if(item.content){ 4998 if(item.content){
4993 Editor.defaultContent = item.content; 4999 Editor.defaultContent = item.content;
@@ -222,7 +222,7 @@ LocalFile.prototype.saveFile = function(title, revision, success, error, useCurr @@ -222,7 +222,7 @@ LocalFile.prototype.saveFile = function(title, revision, success, error, useCurr
222 "id":Editor.configurationContentId,"content":savedData,"type":1}; 222 "id":Editor.configurationContentId,"content":savedData,"type":1};
223 configurationContentList.push(configurationContent); 223 configurationContentList.push(configurationContent);
224 var parmam = {"configurationId":Editor.configurationId,"configurationContentList":configurationContentList}; 224 var parmam = {"configurationId":Editor.configurationId,"configurationContentList":configurationContentList};
225 - DefHttp().put("/yt/configuration/content",parmam).then(res=>{ 225 + defHttp.put("/yt/configuration/content",parmam).then(res=>{
226 console.log(res) 226 console.log(res)
227 }) 227 })
228 } 228 }
@@ -4880,17 +4880,17 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -4880,17 +4880,17 @@ DataFormatPanel.prototype.addDataFont = function (container) {
4880 4880
4881 // 获取url的请求参数函数 4881 // 获取url的请求参数函数
4882 function getRequest() { 4882 function getRequest() {
4883 - var url = location.search; //获取url中"?"符后的字串  
4884 - var theRequest = new Object();  
4885 - if (url.indexOf("?") != -1) {  
4886 - var str = url.substring(1);  
4887 - strs = str.split("&");  
4888 - for(var i = 0; i < strs.length; i ++) {  
4889 - theRequest[strs[i].split("=")[0]]=decodeURI(strs[i].split("=")[1]);  
4890 - } 4883 + var url = location.search; //获取url中"?"符后的字串
  4884 + var theRequest = new Object();
  4885 + if (url.indexOf("?") != -1) {
  4886 + var str = url.substring(1);
  4887 + strs = str.split("&");
  4888 + for (var i = 0; i < strs.length; i++) {
  4889 + theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
  4890 + }
4891 } 4891 }
4892 - return theRequest;  
4893 - } 4892 + return theRequest;
  4893 + }
4894 4894
4895 var dataSourceTitle = this.createTitle("数据源"); 4895 var dataSourceTitle = this.createTitle("数据源");
4896 dataSourceTitle.style.padding = "6px 0px 6px 6px"; 4896 dataSourceTitle.style.padding = "6px 0px 6px 6px";
@@ -4916,26 +4916,25 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -4916,26 +4916,25 @@ DataFormatPanel.prototype.addDataFont = function (container) {
4916 treeUl.setAttribute("id", "organizationTree"); 4916 treeUl.setAttribute("id", "organizationTree");
4917 organizationTree.appendChild(treeUl); 4917 organizationTree.appendChild(treeUl);
4918 container.appendChild(organizationTree); 4918 container.appendChild(organizationTree);
4919 - 4919 + let treeList = [];
4920 // 获取组织数据 4920 // 获取组织数据
4921 (function getTreeList() { 4921 (function getTreeList() {
4922 //调用API,获取保存的内容 4922 //调用API,获取保存的内容
4923 - DefHttp()  
4924 - .get("/yt/organization/me/list")  
4925 - .then(function (response) {  
4926 - //实例化树形菜单  
4927 - $("#organizationTree").tree({  
4928 - data: response.data,  
4929 - lines: true,  
4930 - formatter(node) {  
4931 - return node.name;  
4932 - },  
4933 - onClick(node) {  
4934 - // 获取组织下的设备  
4935 - getDevicesByOrganizationId(node.id);  
4936 - },  
4937 - }); 4923 + defHttp.get("/yt/organization/me/list").then(function (res) {
  4924 + //实例化树形菜单
  4925 + treeList = res;
  4926 + $("#organizationTree").tree({
  4927 + data: res,
  4928 + lines: true,
  4929 + formatter(node) {
  4930 + return node.name;
  4931 + },
  4932 + onClick(node) {
  4933 + // 获取组织下的设备
  4934 + getDevicesByOrganizationId(node.id);
  4935 + },
4938 }); 4936 });
  4937 + });
4939 })(); 4938 })();
4940 4939
4941 // 选择设备 4940 // 选择设备
@@ -4949,21 +4948,33 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -4949,21 +4948,33 @@ DataFormatPanel.prototype.addDataFont = function (container) {
4949 deviceSelect.setAttribute("id", "device"); 4948 deviceSelect.setAttribute("id", "device");
4950 deviceStylePanel.appendChild(deviceSelect); 4949 deviceStylePanel.appendChild(deviceSelect);
4951 4950
  4951 + // 获取组织下的所有直连设备和网关子设备
  4952 + async function getDevicesByOrganizationId_DIRECT_CONNECTIONAndSENSOR(
  4953 + organizationId
  4954 + ) {
  4955 + const res1 = await defHttp.get(
  4956 + `/yt/device/list/DIRECT_CONNECTION?organizationId=${organizationId}`
  4957 + );
  4958 + const res2 = await defHttp.get(
  4959 + `/yt/device/list/SENSOR?organizationId=${organizationId}`
  4960 + );
  4961 + return [...res1, ...res2];
  4962 + }
  4963 +
4952 // 根据组织id获取组织下的设备列表--在点击组织时调用 4964 // 根据组织id获取组织下的设备列表--在点击组织时调用
4953 - function getDevicesByOrganizationId(organizationId) { 4965 + async function getDevicesByOrganizationId(organizationId) {
4954 if (organizationId) { 4966 if (organizationId) {
4955 - DefHttp()  
4956 - .get(`/yt/device?page=1&pageSize=20&organizationId=${organizationId}`)  
4957 - .then(function (response) {  
4958 - $("#device").combobox({  
4959 - data: response.data.items,  
4960 - valueField: "tbDeviceId",  
4961 - textField: "name",  
4962 - onChange(newValue) {  
4963 - getDeviceAttribute(newValue);  
4964 - },  
4965 - });  
4966 - }); 4967 + const items = await getDevicesByOrganizationId_DIRECT_CONNECTIONAndSENSOR(
  4968 + organizationId
  4969 + );
  4970 + $("#device").combobox({
  4971 + data: items,
  4972 + valueField: "tbDeviceId",
  4973 + textField: "name",
  4974 + onChange(newValue) {
  4975 + getDeviceAttribute(newValue);
  4976 + },
  4977 + });
4967 } 4978 }
4968 } 4979 }
4969 4980
@@ -4981,10 +4992,10 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -4981,10 +4992,10 @@ DataFormatPanel.prototype.addDataFont = function (container) {
4981 // 获取设备下的属性-key--在改变设备时调用 4992 // 获取设备下的属性-key--在改变设备时调用
4982 function getDeviceAttribute(tbDeviceId) { 4993 function getDeviceAttribute(tbDeviceId) {
4983 if (tbDeviceId) { 4994 if (tbDeviceId) {
4984 - DefHttp() 4995 + defHttp
4985 .get(`/plugins/telemetry/DEVICE/${tbDeviceId}/keys/timeseries`) 4996 .get(`/plugins/telemetry/DEVICE/${tbDeviceId}/keys/timeseries`)
4986 .then(function (response) { 4997 .then(function (response) {
4987 - const mapRes = response.data.map((item) => { 4998 + const mapRes = response.map((item) => {
4988 return { 4999 return {
4989 value: item, 5000 value: item,
4990 text: item, 5001 text: item,
@@ -5080,7 +5091,6 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5080,7 +5091,6 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5080 5091
5081 genarateCheckbox(dynamicEffect); 5092 genarateCheckbox(dynamicEffect);
5082 5093
5083 -  
5084 // 解构全局属性layui要用到的模块 5094 // 解构全局属性layui要用到的模块
5085 const { layer, form } = layui; 5095 const { layer, form } = layui;
5086 5096
@@ -5110,260 +5120,178 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5110,260 +5120,178 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5110 let currentPageId = ui.currentPage.node; 5120 let currentPageId = ui.currentPage.node;
5111 // 图形的id 5121 // 图形的id
5112 let graphId = ss.vertices[0].id; 5122 let graphId = ss.vertices[0].id;
5113 - console.log('需要的值',configurationId,currentPageId.id,graphId,) 5123 + // 事件类型
5114 const eventType = { 5124 const eventType = {
5115 - 'DOWN':'按下',  
5116 - 'UP':'抬起',  
5117 - 'SINGLE':'单击',  
5118 - 'DOUBLE':'双击',  
5119 - } 5125 + DOWN: "按下",
  5126 + UP: "抬起",
  5127 + SINGLE: "单击",
  5128 + DOUBLE: "双击",
  5129 + };
  5130 + // 动画类型
  5131 + const animType = {
  5132 + FLASH: "闪烁",
  5133 + DISPLAY: "显示/隐藏",
  5134 + ROTATE: "旋转",
  5135 + };
5120 5136
5121 //按下和抬起的事件处理函数 5137 //按下和抬起的事件处理函数
5122 - function handlePressANDupliftEvent(event) { 5138 + async function handlePressANDupliftEvent(event) {
  5139 + // 获取当前节点（图形）的信息
  5140 + const res = await defHttp.get(`/yt/configuration/node/NODE/${graphId}`);
  5141 + // 查找节点内容
  5142 + const findContent = res.event?.find((item) => {
  5143 + if (item.content.title === event.data.type) return item;
  5144 + });
  5145 + console.log(findContent);
  5146 + // 当前租户的根组织id
  5147 + const rootOrgId = treeList[0].id;
  5148 + console.log(rootOrgId);
  5149 + // 获取根组织下的所有设备
  5150 + async function getOrgAllDevices() {
  5151 + return Promise.all([
  5152 + defHttp.get(
  5153 + `/yt/device/list/DIRECT_CONNECTION?organizationId=${rootOrgId}`
  5154 + ),
  5155 + defHttp.get(`/yt/device/list/GATEWAY?organizationId=${rootOrgId}`),
  5156 + defHttp.get(`/yt/device/list/SENSOR?organizationId=${rootOrgId}`),
  5157 + ]);
  5158 + }
  5159 + const deviceList = await getOrgAllDevices();
  5160 + console.log(deviceList.flat(1))
5123 // 打开弹窗 5161 // 打开弹窗
5124 layer.open({ 5162 layer.open({
5125 title: "创建交互", 5163 title: "创建交互",
5126 content: ` 5164 content: `
5127 - <form class="layui-form">  
5128 - <div style="width:400px">  
5129 - <div class="layui-form-item">  
5130 - <label class="layui-form-label">事件</label>  
5131 - <div class="layui-input-block">  
5132 - <input type="text" name="title" disabled class="layui-input" value="${event.data.type}">  
5133 - </div>  
5134 - </div>  
5135 - <div class="layui-form-item">  
5136 - <label class="layui-form-label">动作</label>  
5137 - <div class="layui-input-block">  
5138 - <select name="city" lay-verify="required">  
5139 - <option value="0" selected>给变量赋值</option>  
5140 - </select>  
5141 - </div>  
5142 - </div>  
5143 - <div class="layui-form-item">  
5144 - <label class="layui-form-label">类型</label>  
5145 - <div class="layui-input-block">  
5146 - <input type="radio" name="type" value="1" title="联网设备" checked>  
5147 - <input type="radio" name="type" value="2" title="产品/场景" disabled >  
5148 - </div>  
5149 - </div>  
5150 - </div>  
5151 - <div style="height:200px;overflow-y:scroll" id="tableContent">  
5152 -  
5153 - <div style="display:flex;justify-content:center;">  
5154 - <button type="button" class="layui-btn layui-btn-primary layui-border-blue" id="addData">添加一条</button>  
5155 - </div>  
5156 - </div>  
5157 - </form>  
5158 - `,  
5159 - area: ["800px", "500px"], 5165 + <form class="layui-form" lay-filter="formModal">
  5166 + <div style="width:400px">
  5167 + <div class="layui-form-item">
  5168 + <label class="layui-form-label">事件</label>
  5169 + <div class="layui-input-block">
  5170 + <input type="text" name="event" class="layui-input" value="${event.data.type}" disabled>
  5171 + </div>
  5172 + </div>
  5173 + <div class="layui-form-item">
  5174 + <label class="layui-form-label">动作</label>
  5175 + <div class="layui-input-block">
  5176 + <select name="action" lay-verify="required">
  5177 + <option value="0" selected>给变量赋值</option>
  5178 + </select>
  5179 + </div>
  5180 + </div>
  5181 + <div class="layui-form-item">
  5182 + <label class="layui-form-label">类型</label>
  5183 + <div class="layui-input-block">
  5184 + <input type="radio" name="type" value="1" title="联网设备" checked>
  5185 + <input type="radio" name="type" value="2" title="产品/场景" disabled>
  5186 + </div>
  5187 + </div>
  5188 + </div>
  5189 + <div style="height:255px;overflow-y:scroll" id="tableContent">
  5190 + <div style="display:flex;justify-content:center;">
  5191 + <button type="button" class="layui-btn layui-btn-primary layui-border-blue" id="addData">添加一条</button>
  5192 + </div>
  5193 + </div>
  5194 + </form>
  5195 + `,
  5196 + area: ["800px", "600px"],
5160 btn: ["保存", "取消"], 5197 btn: ["保存", "取消"],
5161 - yes(index) { 5198 + shade: ["0.7", "#fafafa"],
  5199 + async yes(index) {
  5200 + // 遍历表格数据
  5201 + const content = [];
  5202 + for (let item of $("#tableBody tr")) {
  5203 + content.push({
  5204 + min: item.children[0].children[0].value,
  5205 + max: item.children[1].children[0].value,
  5206 + });
  5207 + }
  5208 + // 获取其他数据
  5209 + const formModal = {
  5210 + ...form.val("formModal"),
  5211 + configurationId,
  5212 + contentId: currentPageId.id,
  5213 + id: graphId,
  5214 + condition: {
  5215 + content,
  5216 + },
  5217 + };
  5218 + await defHttp.post("/yt/configuration/node/act", formModal);
5162 layer.close(index); 5219 layer.close(index);
5163 }, 5220 },
5164 btn2(index) { 5221 btn2(index) {
5165 layer.close(index); 5222 layer.close(index);
5166 }, 5223 },
5167 - shade: ["0.7", "#fafafa"],  
5168 }); 5224 });
5169 5225
5170 // 在tableContent最前面添加元素 5226 // 在tableContent最前面添加元素
5171 $("#tableContent").prepend(` 5227 $("#tableContent").prepend(`
5172 - <table class="layui-table">  
5173 - <colgroup>  
5174 - <col width="210">  
5175 - <col width="210">  
5176 - <col width="210">  
5177 - <col width="60">  
5178 - </colgroup>  
5179 - <thead>  
5180 - <tr>  
5181 - <th style="text-align:center">选择设备</th>  
5182 - <th style="text-align:center">变量</th>  
5183 - <th style="text-align:center">下发值</th>  
5184 - <th style="text-align:center">操作</th>  
5185 - </tr>  
5186 - </thead>  
5187 - <tbody id="tableBody">  
5188 - <tr>  
5189 - <td>  
5190 - <select name="city" lay-verify="required">  
5191 - <option value="0">上海</option>  
5192 - <option value="1">北京</option>  
5193 - </select>  
5194 - </td>  
5195 - <td>  
5196 - <select name="city" lay-verify="required">  
5197 - <option value="3">深圳</option>  
5198 - <option value="4">杭州</option>  
5199 - </select>  
5200 - </td>  
5201 - <td>  
5202 - <input type="text" name="title" class="layui-input">  
5203 - </td>  
5204 - <td>  
5205 - <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>  
5206 - </td>  
5207 - </tr>  
5208 - </tbody>  
5209 - </table>  
5210 - `);  
5211 - form.render();  
5212 - let typeRadio = "1";  
5213 - // 监听的表单radio事件  
5214 - form.on("radio", function (data) {  
5215 - typeRadio = data.value;  
5216 - if (data.value === "1") {  
5217 - $("#tableContent").children().first().remove();  
5218 - $("#tableContent").prepend(`  
5219 - <table class="layui-table"> 5228 + <table class="layui-table">
5220 <colgroup> 5229 <colgroup>
5221 - <col width="210">  
5222 - <col width="210">  
5223 - <col width="210"> 5230 + <col>
  5231 + <col>
  5232 + <col>
  5233 + <col width="240">
5224 <col width="60"> 5234 <col width="60">
5225 </colgroup> 5235 </colgroup>
5226 <thead> 5236 <thead>
5227 <tr> 5237 <tr>
5228 <th style="text-align:center">选择设备</th> 5238 <th style="text-align:center">选择设备</th>
  5239 + <th style="text-align:center">选择子设备</th>
5229 <th style="text-align:center">变量</th> 5240 <th style="text-align:center">变量</th>
5230 <th style="text-align:center">下发值</th> 5241 <th style="text-align:center">下发值</th>
5231 <th style="text-align:center">操作</th> 5242 <th style="text-align:center">操作</th>
5232 </tr> 5243 </tr>
5233 </thead> 5244 </thead>
5234 - <tbody id="tableBody">  
5235 - <tr>  
5236 - <td>  
5237 - <select name="city" lay-verify="required">  
5238 - <option value="0">上海</option>  
5239 - <option value="1">北京</option>  
5240 - </select>  
5241 - </td>  
5242 - <td>  
5243 - <select name="city" lay-verify="required">  
5244 - <option value="3">深圳</option>  
5245 - <option value="4">杭州</option>  
5246 - </select>  
5247 - </td>  
5248 - <td>  
5249 - <input type="text" name="title" class="layui-input">  
5250 - </td>  
5251 - <td>  
5252 - <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>  
5253 - </td>  
5254 - </tr>  
5255 - </tbody>  
5256 - </table>  
5257 - `);  
5258 - } else {  
5259 - $("#tableContent").children().first().remove();  
5260 - $("#tableContent").prepend(` 5245 + <tbody id="tableBody"></tbody>
  5246 + </table>
  5247 + `);
  5248 +
  5249 + // 监听的表单radio事件 （暂不实现）
  5250 + form.on("radio", function (data) {
  5251 + $("#tableContent").children().first().remove();
  5252 + $("#tableContent").prepend(`
5261 <table class="layui-table"> 5253 <table class="layui-table">
5262 - <colgroup>  
5263 - <col width="175">  
5264 - <col width="175">  
5265 - <col width="175">  
5266 - <col width="175">  
5267 - <col width="60">  
5268 - </colgroup>  
5269 - <thead>  
5270 - <tr>  
5271 - <th style="text-align:center">产品/场景</th>  
5272 - <th style="text-align:center">数据源</th>  
5273 - <th style="text-align:center">变量</th>  
5274 - <th style="text-align:center">下发值</th>  
5275 - <th style="text-align:center">操作</th>  
5276 - </tr>  
5277 - </thead>  
5278 - <tbody id="tableBody"> 5254 + <colgroup>
  5255 + <col>
  5256 + <col>
  5257 + <col width="60">
  5258 + </colgroup>
  5259 + <thead>
  5260 + <tr>
  5261 + <th style="text-align:center">最小值(>=)</th>
  5262 + <th style="text-align:center">最大值(<=)</th>
  5263 + <th style="text-align:center">操作</th>
  5264 + </tr>
  5265 + </thead>
  5266 + <tbody id="tableBody"></tbody>
  5267 + </table>
  5268 + `);
  5269 + form.render();
  5270 + });
  5271 + // 添加一条
  5272 + $("#addData").click(() => {
  5273 + $("#tableBody").append(`
5279 <tr> 5274 <tr>
5280 <td> 5275 <td>
5281 - <select name="city" lay-verify="required">  
5282 - <option value="0">上海</option>  
5283 - <option value="1">北京</option> 5276 + <select name="device" lay-verify="required" id="deviceSelect">
5284 </select> 5277 </select>
5285 </td> 5278 </td>
5286 <td> 5279 <td>
5287 - <select name="city" lay-verify="required">  
5288 - <option value="3">深圳</option>  
5289 - <option value="4">杭州</option> 5280 + <select name="childDevice" lay-verify="required" id="childSelect">
5290 </select> 5281 </select>
5291 </td> 5282 </td>
5292 <td> 5283 <td>
5293 - <select name="city" lay-verify="required">  
5294 - <option value="0">上海</option>  
5295 - <option value="1">北京</option> 5284 + <select name="veriable" lay-verify="required" id="veriableSelect">
5296 </select> 5285 </select>
5297 </td> 5286 </td>
5298 <td> 5287 <td>
5299 - <input type="text" name="title" class="layui-input"> 5288 + <textarea placeholder="请输入命令" class="layui-textarea" name="value"></textarea>
5300 </td> 5289 </td>
5301 <td> 5290 <td>
5302 <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button> 5291 <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>
5303 </td> 5292 </td>
5304 </tr> 5293 </tr>
5305 - </tbody>  
5306 - </table>  
5307 - `);  
5308 - }  
5309 - form.render();  
5310 - });  
5311 - // 添加一条  
5312 - $("#addData").click(() => {  
5313 -  
5314 - if (typeRadio === "1") {  
5315 - $("#tableBody").append(`  
5316 - <tr>  
5317 - <td>  
5318 - <select name="city" lay-verify="required">  
5319 - <option value="0">上海</option>  
5320 - <option value="1">北京</option>  
5321 - </select>  
5322 - </td>  
5323 - <td>  
5324 - <select name="city" lay-verify="required">  
5325 - <option value="3">深圳</option>  
5326 - <option value="4">杭州</option>  
5327 - </select>  
5328 - </td>  
5329 - <td>  
5330 - <input type="text" name="title" class="layui-input">  
5331 - </td>  
5332 - <td>  
5333 - <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>  
5334 - </td>  
5335 - </tr>  
5336 - `);  
5337 - } else {  
5338 - $("#tableBody").append(`  
5339 - <tr>  
5340 - <td>  
5341 - <select name="city" lay-verify="required">  
5342 - <option value="0">上海</option>  
5343 - <option value="1">北京</option>  
5344 - </select>  
5345 - </td>  
5346 - <td>  
5347 - <select name="city" lay-verify="required">  
5348 - <option value="3">深圳</option>  
5349 - <option value="4">杭州</option>  
5350 - </select>  
5351 - </td>  
5352 - <td>  
5353 - <select name="city" lay-verify="required">  
5354 - <option value="3">深圳</option>  
5355 - <option value="4">杭州</option>  
5356 - </select>  
5357 - </td>  
5358 - <td>  
5359 - <input type="text" name="title" class="layui-input">  
5360 - </td>  
5361 - <td>  
5362 - <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>  
5363 - </td>  
5364 - </tr>  
5365 - `);  
5366 - } 5294 + `);
5367 form.render(); 5295 form.render();
5368 // 为添加的每一行绑定删除当前行的事件 5296 // 为添加的每一行绑定删除当前行的事件
5369 $(".deleteData").click(function () { 5297 $(".deleteData").click(function () {
@@ -5375,10 +5303,89 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5375,10 +5303,89 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5375 $(".deleteData").click(function () { 5303 $(".deleteData").click(function () {
5376 this.parentNode.parentNode.remove(); 5304 this.parentNode.parentNode.remove();
5377 }); 5305 });
  5306 + setTimeout(async () => {
  5307 + const len = findContent?.condition?.content?.length;
  5308 + if (!len) {
  5309 + $("#tableBody").prepend(`
  5310 + <tr>
  5311 + <td>
  5312 + <select name="device" lay-verify="required" id="deviceSelect">
  5313 + </select>
  5314 + </td>
  5315 + <td>
  5316 + <select name="childDevice" lay-verify="required" id="childSelect">
  5317 + </select>
  5318 + </td>
  5319 + <td>
  5320 + <select name="veriable" lay-verify="required" id="veriableSelect">
  5321 + </select>
  5322 + </td>
  5323 + <td>
  5324 + <textarea placeholder="请输入命令" class="layui-textarea" name="value"></textarea>
  5325 + </td>
  5326 + <td>
  5327 + <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>
  5328 + </td>
  5329 + </tr>
  5330 + `);
  5331 +
  5332 + $(".deleteData").click(function () {
  5333 + this.parentNode.parentNode.remove();
  5334 + });
  5335 + form.render();
  5336 + return;
  5337 + }
  5338 +
  5339 +
  5340 + // form.val("formModal", { deviceId: findAnim?.deviceId });
  5341 + // if (!findAnim?.deviceId) return;
  5342 + // const res = await defHttp.get(
  5343 + // `/plugins/telemetry/DEVICE/${findAnim?.deviceId}/keys/timeseries`
  5344 + // );
  5345 + // // 先清空子元素
  5346 + // $("#attrSelect").empty();
  5347 + // $("#attrSelect").append(`<option value="">请选择属性</option>`);
  5348 + // for (let item of res) {
  5349 + // // 在追加
  5350 + // $("#attrSelect").append(`<option value="${item}">${item}</option>`);
  5351 + // }
  5352 + // form.val("formModal", { attr: findAnim?.attr });
  5353 + // for (let i = 0; i < len; i++) {
  5354 + // $("#tableBody").append(`
  5355 + // <tr>
  5356 + // <td>
  5357 + // <select name="device" lay-verify="required" id="deviceSelect">
  5358 + // </select>
  5359 + // </td>
  5360 + // <td>
  5361 + // <select name="veriable" lay-verify="required" id="veriableSelect">
  5362 + // </select>
  5363 + // </td>
  5364 + // <td>
  5365 + // <textarea placeholder="请输入命令" class="layui-textarea" name="value"></textarea>
  5366 + // </td>
  5367 + // <td>
  5368 + // <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>
  5369 + // </td>
  5370 + // </tr>
  5371 + // `);
  5372 + // }
  5373 +
  5374 + // $(".deleteData").click(function () {
  5375 + // this.parentNode.parentNode.remove();
  5376 + // });
  5377 + // form.render();
  5378 + }, 500);
5378 } 5379 }
5379 5380
5380 //单击和双击的事件处理函数 5381 //单击和双击的事件处理函数
5381 - function handleClickANDdbClickEvent(event) { 5382 + async function handleClickANDdbClickEvent(event) {
  5383 + // 查询节点内容
  5384 + const res = await defHttp.get(`/yt/configuration/node/NODE/${graphId}`);
  5385 +
  5386 + const findContent = res.event?.find((item) => {
  5387 + if (item.content.title === event.data.type) return item;
  5388 + });
5382 // 打开弹窗 5389 // 打开弹窗
5383 layer.open({ 5390 layer.open({
5384 title: "创建交互", 5391 title: "创建交互",
@@ -5395,41 +5402,47 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5395,41 +5402,47 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5395 <label class="layui-form-label">动作</label> 5402 <label class="layui-form-label">动作</label>
5396 <div class="layui-input-block"> 5403 <div class="layui-input-block">
5397 <select name="action" lay-verify="required" lay-filter="actionSelectChange"> 5404 <select name="action" lay-verify="required" lay-filter="actionSelectChange">
5398 - <option value="0" selected>打开链接</option> 5405 + <option value="0">打开链接</option>
5399 <option value="1">打开页面</option> 5406 <option value="1">打开页面</option>
5400 - <option value="2">给变量赋值</option> 5407 + <option value="2" disabled>给变量赋值</option>
5401 </select> 5408 </select>
5402 </div> 5409 </div>
5403 </div> 5410 </div>
5404 - <div class="layui-form-item" id="dynamicInput"> 5411 + <div class="layui-form-item" id="dynamicInputLink">
5405 <label class="layui-form-label">链接</label> 5412 <label class="layui-form-label">链接</label>
5406 <div class="layui-input-block"> 5413 <div class="layui-input-block">
5407 <input type="text" name="link" class="layui-input"> 5414 <input type="text" name="link" class="layui-input">
5408 </div> 5415 </div>
5409 </div> 5416 </div>
  5417 + <div class="layui-form-item" id="dynamicInputPage" style="display:none">
  5418 + <label class="layui-form-label">页面</label>
  5419 + <div class="layui-input-block">
  5420 + <select name="page" lay-verify="required" id="pageSelect">
  5421 + </select>
  5422 + </div>
  5423 + </div>
5410 </div> 5424 </div>
5411 <div style="height:200px;overflow-y:scroll" id="tableContent"> 5425 <div style="height:200px;overflow-y:scroll" id="tableContent">
5412 -  
5413 </div> 5426 </div>
5414 </form> 5427 </form>
5415 `, 5428 `,
5416 area: ["800px", "500px"], 5429 area: ["800px", "500px"],
5417 btn: ["保存", "取消"], 5430 btn: ["保存", "取消"],
5418 - yes(index) { 5431 + async yes(index) {
5419 // 获取事件类型的key 5432 // 获取事件类型的key
5420 let type = null; 5433 let type = null;
5421 - for(let key in eventType){  
5422 - if(eventType[key] === event.data.type){ 5434 + for (let key in eventType) {
  5435 + if (eventType[key] === event.data.type) {
5423 type = key; 5436 type = key;
5424 } 5437 }
5425 } 5438 }
5426 - DefHttp().post('/yt/configuration/node/event',{ 5439 + await defHttp.post("/yt/configuration/node/event", {
5427 configurationId, 5440 configurationId,
5428 - contentId:currentPageId.id,  
5429 - id:graphId, 5441 + contentId: currentPageId.id,
  5442 + id: graphId,
5430 type, 5443 type,
5431 - content:form.val('formModal')  
5432 - }) 5444 + content: form.val("formModal"),
  5445 + });
5433 layer.close(index); 5446 layer.close(index);
5434 }, 5447 },
5435 btn2(index) { 5448 btn2(index) {
@@ -5437,9 +5450,27 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5437,9 +5450,27 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5437 }, 5450 },
5438 shade: ["0.7", "#fafafa"], 5451 shade: ["0.7", "#fafafa"],
5439 }); 5452 });
  5453 +
  5454 + // 获取页面数组->转换为option
  5455 + for (let item of ui.pages) {
  5456 + const option = `<option value="${
  5457 + "data:page/id," + item.getId()
  5458 + }">${item.getName()}</option>`;
  5459 + $("#pageSelect").append(option);
  5460 + }
  5461 + if (findContent?.content.action === "1") {
  5462 + $("#dynamicInputLink").css({ display: "none" });
  5463 + $("#dynamicInputPage").css({ display: "block" });
  5464 + }
  5465 +
  5466 + form.val("formModal", {
  5467 + action: findContent?.content.action || "0",
  5468 + link: findContent?.content.link,
  5469 + page: findContent?.content.page,
  5470 + });
5440 form.render(); 5471 form.render();
5441 let typeRadio = "1"; 5472 let typeRadio = "1";
5442 - // 监听的表单radio事件 5473 + // 监听的表单radio事件 （暂不实现）
5443 form.on("radio", function (data) { 5474 form.on("radio", function (data) {
5444 typeRadio = data.value; 5475 typeRadio = data.value;
5445 if (data.value === "1") { 5476 if (data.value === "1") {
@@ -5539,32 +5570,17 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5539,32 +5570,17 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5539 }); 5570 });
5540 5571
5541 // 监听动作选择框的变化 5572 // 监听动作选择框的变化
5542 - form.on("select(actionSelectChange)", function (data) {  
5543 - if (data.value === "0") {  
5544 - $("#dynamicInput")  
5545 - .empty()  
5546 - .append(  
5547 - `  
5548 - <label class="layui-form-label">链接</label>  
5549 - <div class="layui-input-block">  
5550 - <input type="text" name="title" class="layui-input">  
5551 - </div>  
5552 - `  
5553 - ); 5573 + form.on("select(actionSelectChange)", function ({ value }) {
  5574 + if (value === "0") {
  5575 + $("#dynamicInputPage").css({ display: "none" });
  5576 + $("#dynamicInputLink").css({ display: "block" });
  5577 +
5554 $("#tableContent").empty(); 5578 $("#tableContent").empty();
5555 - } else if (data.value === "1") {  
5556 - $("#dynamicInput")  
5557 - .empty()  
5558 - .append(  
5559 - `  
5560 - <label class="layui-form-label">页面</label>  
5561 - <div class="layui-input-block">  
5562 - <input type="text" name="title" class="layui-input">  
5563 - </div>  
5564 - `  
5565 - ); 5579 + } else if (value === "1") {
  5580 + $("#dynamicInputLink").css({ display: "none" });
  5581 + $("#dynamicInputPage").css({ display: "block" });
5566 $("#tableContent").empty(); 5582 $("#tableContent").empty();
5567 - } else if (data.value === "2") { 5583 + } else if (value === "2") {
5568 $("#dynamicInput") 5584 $("#dynamicInput")
5569 .empty() 5585 .empty()
5570 .append( 5586 .append(
@@ -5629,7 +5645,6 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5629,7 +5645,6 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5629 }); 5645 });
5630 // 添加一条 5646 // 添加一条
5631 $("#addData").click(() => { 5647 $("#addData").click(() => {
5632 -  
5633 if (typeRadio === "1") { 5648 if (typeRadio === "1") {
5634 $("#tableBody").append(` 5649 $("#tableBody").append(`
5635 <tr> 5650 <tr>
@@ -5694,41 +5709,46 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5694,41 +5709,46 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5694 } 5709 }
5695 5710
5696 //数据动效的事件处理函数 5711 //数据动效的事件处理函数
5697 - function handleSoundEffectEvent(event) {  
5698 - var zNodes = [  
5699 - { id: 1, pId: 0, name: "父1 - 展开", open: true },  
5700 - { id: 11, pId: 1, name: "父11 - 折叠" },  
5701 - { id: 111, pId: 11, name: "叶子节点节点节点111" },  
5702 - { id: 113, pId: 11, name: "叶子节点节点节点113" },  
5703 - { id: 1131, pId: 113, name: "叶子节点节点节点1131" },  
5704 - { id: 1132, pId: 113, name: "叶子节点节点节点1132" },  
5705 - { id: 1133, pId: 113, name: "叶子节点节点节点1133" },  
5706 - { id: 114, pId: 11, name: "叶子节点节点节点114" },  
5707 - { id: 12, pId: 1, name: "父12 - 折叠" },  
5708 - { id: 121, pId: 12, name: "叶子节点节点节点121" },  
5709 - { id: 122, pId: 12, name: "叶子节点节点节点122" },  
5710 - { id: 123, pId: 12, name: "叶子节点节点节点123" },  
5711 - { id: 124, pId: 12, name: "叶子节点节点节点124" },  
5712 - { id: 13, pId: 1, name: "父13" },  
5713 - { id: 2, pId: 0, name: "父2 - 折叠" },  
5714 - { id: 21, pId: 2, name: "父21 - 展开", open: true },  
5715 - { id: 211, pId: 21, name: "叶子节点节点节点211" },  
5716 - { id: 212, pId: 21, name: "叶子节点节点节点212" },  
5717 - { id: 213, pId: 21, name: "叶子节点节点节点213" },  
5718 - { id: 214, pId: 21, name: "叶子节点节点节点214" },  
5719 - ]; 5712 + async function handleSoundEffectEvent(event) {
  5713 + const { act } = await defHttp.get(
  5714 + `/yt/configuration/node/NODE/${graphId}`
  5715 + );
  5716 + // 获取动画类型
  5717 + let type = null;
  5718 + for (let key in animType) {
  5719 + if (animType[key] === event.data.title) {
  5720 + type = key;
  5721 + }
  5722 + }
  5723 + // 查找对应的动画
  5724 + const findAnim = act?.find((item) => {
  5725 + if (item.type === type) return item;
  5726 + });
  5727 +
  5728 + // 树结构转为数组list
  5729 + function treeToArr(data, pId = 0, res = []) {
  5730 + data.forEach((item) => {
  5731 + res.push({ pId, id: item.id, name: item.name });
  5732 + if (item.children && item.children.length) {
  5733 + treeToArr(item.children, item.id, res);
  5734 + }
  5735 + });
  5736 + return res;
  5737 + }
  5738 + // 深拷贝一下数据并且拍平这个树形结构数据
  5739 + const flatTreeList = treeToArr(JSON.parse(JSON.stringify(treeList)));
5720 5740
5721 // 打开弹窗 5741 // 打开弹窗
5722 layer.open({ 5742 layer.open({
5723 title: event.data.title, 5743 title: event.data.title,
5724 content: ` 5744 content: `
5725 - <form class="layui-form"> 5745 + <form class="layui-form" lay-filter="formModal">
5726 <div style="width:400px"> 5746 <div style="width:400px">
5727 <div class="layui-form-item"> 5747 <div class="layui-form-item">
5728 <label class="layui-form-label">类型</label> 5748 <label class="layui-form-label">类型</label>
5729 <div class="layui-input-block"> 5749 <div class="layui-input-block">
5730 <input type="radio" name="type" value="1" title="联网设备" checked> 5750 <input type="radio" name="type" value="1" title="联网设备" checked>
5731 - <input type="radio" name="type" value="2" title="产品/场景" > 5751 + <input type="radio" name="type" value="2" title="产品/场景" disabled>
5732 </div> 5752 </div>
5733 </div> 5753 </div>
5734 <div class="layui-form-item"> 5754 <div class="layui-form-item">
@@ -5741,10 +5761,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5741,10 +5761,7 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5741 <div class="layui-form-item"> 5761 <div class="layui-form-item">
5742 <label class="layui-form-label">设备</label> 5762 <label class="layui-form-label">设备</label>
5743 <div class="layui-input-block"> 5763 <div class="layui-input-block">
5744 - <select name="city" lay-verify="required">  
5745 - <option value="0" selected>设备1</option>  
5746 - <option value="0">设备2</option>  
5747 - <option value="0">设备3</option> 5764 + <select name="deviceId" lay-verify="required" id="deviceSelect" lay-filter="deviceSelect">
5748 </select> 5765 </select>
5749 </div> 5766 </div>
5750 </div> 5767 </div>
@@ -5752,11 +5769,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5752,11 +5769,7 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5752 <div class="layui-form-item"> 5769 <div class="layui-form-item">
5753 <label class="layui-form-label">属性</label> 5770 <label class="layui-form-label">属性</label>
5754 <div class="layui-input-block"> 5771 <div class="layui-input-block">
5755 - <select name="city" lay-verify="required">  
5756 - <option value="0" selected>属性1</option>  
5757 - <option value="0">属性2</option>  
5758 - <option value="0">属性3</option>  
5759 - </select> 5772 + <select name="attr" lay-verify="required" id="attrSelect"></select>
5760 </div> 5773 </div>
5761 </div> 5774 </div>
5762 </div> 5775 </div>
@@ -5770,7 +5783,35 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5770,7 +5783,35 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5770 area: ["800px", "500px"], 5783 area: ["800px", "500px"],
5771 btn: ["保存", "取消"], 5784 btn: ["保存", "取消"],
5772 shade: ["0.7", "#fafafa"], 5785 shade: ["0.7", "#fafafa"],
5773 - yes(index) { 5786 + async yes(index) {
  5787 + // 获取动画类型
  5788 + let type = null;
  5789 + for (let key in animType) {
  5790 + if (animType[key] === event.data.title) {
  5791 + type = key;
  5792 + }
  5793 + }
  5794 + // 遍历表格数据
  5795 + const content = [];
  5796 + for (let item of $("#tableBody tr")) {
  5797 + content.push({
  5798 + min: item.children[0].children[0].value,
  5799 + max: item.children[1].children[0].value,
  5800 + });
  5801 + }
  5802 + // 获取其他数据
  5803 + const formModal = {
  5804 + ...form.val("formModal"),
  5805 + orgId: $("#select").selectZTreeGet().id,
  5806 + configurationId,
  5807 + contentId: currentPageId.id,
  5808 + id: graphId,
  5809 + condition: {
  5810 + content,
  5811 + },
  5812 + type,
  5813 + };
  5814 + await defHttp.post("/yt/configuration/node/act", formModal);
5774 layer.close(index); 5815 layer.close(index);
5775 }, 5816 },
5776 btn2(index) { 5817 btn2(index) {
@@ -5780,16 +5821,59 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5780,16 +5821,59 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5780 5821
5781 $("#select") 5822 $("#select")
5782 .selectZTree({ 5823 .selectZTree({
5783 - data: zNodes, 5824 + data: flatTreeList,
5784 width: 290, 5825 width: 290,
5785 showSearch: false, 5826 showSearch: false,
5786 placeholder: "请选择组织", 5827 placeholder: "请选择组织",
5787 - onSelected(ele, value) {  
5788 - console.log(value);  
5789 - console.log("onSelected"); 5828 + async onReady() {
  5829 + if (findAnim?.orgId) {
  5830 + $("#select").selectZTreeSet(findAnim?.orgId);
  5831 + const items =
  5832 + await getDevicesByOrganizationId_DIRECT_CONNECTIONAndSENSOR(
  5833 + findAnim?.orgId
  5834 + );
  5835 + $("#deviceSelect").empty();
  5836 + $("#deviceSelect").append(`<option value="">请选择设备</option>`);
  5837 + for (let item of items) {
  5838 + // 在追加
  5839 + $("#deviceSelect").append(
  5840 + `<option value="${item.tbDeviceId}">${item.name}</option>`
  5841 + );
  5842 + }
  5843 + form.render();
  5844 + }
5790 }, 5845 },
5791 }) 5846 })
5792 - 5847 + .on("change", async (ele, { id }) => {
  5848 + const items =
  5849 + await getDevicesByOrganizationId_DIRECT_CONNECTIONAndSENSOR(id);
  5850 + // 先清空子元素
  5851 + $("#deviceSelect").empty();
  5852 + $("#deviceSelect").append(`<option value="">请选择设备</option>`);
  5853 + for (let item of items) {
  5854 + // 在追加
  5855 + $("#deviceSelect").append(
  5856 + `<option value="${item.tbDeviceId}">${item.name}</option>`
  5857 + );
  5858 + }
  5859 + form.render();
  5860 + });
  5861 +
  5862 + form.on("select(deviceSelect)", async ({ value }) => {
  5863 + if (!value) return;
  5864 + const res = await defHttp.get(
  5865 + `/plugins/telemetry/DEVICE/${value}/keys/timeseries`
  5866 + );
  5867 + // 先清空子元素
  5868 + $("#attrSelect").empty();
  5869 + $("#attrSelect").append(`<option value="">请选择属性</option>`);
  5870 + for (let item of res) {
  5871 + // 在追加
  5872 + $("#attrSelect").append(`<option value="${item}">${item}</option>`);
  5873 + }
  5874 + form.render();
  5875 + });
  5876 +
5793 // 在tableContent最前面添加元素 5877 // 在tableContent最前面添加元素
5794 $("#tableContent").prepend(` 5878 $("#tableContent").prepend(`
5795 <table class="layui-table"> 5879 <table class="layui-table">
@@ -5800,28 +5884,16 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5800,28 +5884,16 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5800 </colgroup> 5884 </colgroup>
5801 <thead> 5885 <thead>
5802 <tr> 5886 <tr>
5803 - <th style="text-align:center">最小值(<=)</th>  
5804 - <th style="text-align:center">最大值(>=)</th> 5887 + <th style="text-align:center">最小值(>=)</th>
  5888 + <th style="text-align:center">最大值(<=)</th>
5805 <th style="text-align:center">操作</th> 5889 <th style="text-align:center">操作</th>
5806 </tr> 5890 </tr>
5807 </thead> 5891 </thead>
5808 - <tbody id="tableBody">  
5809 - <tr>  
5810 - <td>  
5811 - <input type="text" name="title" class="layui-input">  
5812 - </td>  
5813 - <td>  
5814 - <input type="text" name="title" class="layui-input">  
5815 - </td>  
5816 - <td>  
5817 - <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>  
5818 - </td>  
5819 - </tr>  
5820 - </tbody> 5892 + <tbody id="tableBody"></tbody>
5821 </table> 5893 </table>
5822 `); 5894 `);
5823 - form.render();  
5824 - // 监听的表单radio事件 5895 +
  5896 + // 监听的表单radio事件 （暂不实现）
5825 form.on("radio", function (data) { 5897 form.on("radio", function (data) {
5826 $("#tableContent").children().first().remove(); 5898 $("#tableContent").children().first().remove();
5827 $("#tableContent").prepend(` 5899 $("#tableContent").prepend(`
@@ -5838,19 +5910,7 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5838,19 +5910,7 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5838 <th style="text-align:center">操作</th> 5910 <th style="text-align:center">操作</th>
5839 </tr> 5911 </tr>
5840 </thead> 5912 </thead>
5841 - <tbody id="tableBody">  
5842 - <tr>  
5843 - <td>  
5844 - <input type="text" name="title" class="layui-input">  
5845 - </td>  
5846 - <td>  
5847 - <input type="text" name="title" class="layui-input">  
5848 - </td>  
5849 - <td>  
5850 - <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>  
5851 - </td>  
5852 - </tr>  
5853 - </tbody> 5913 + <tbody id="tableBody"></tbody>
5854 </table> 5914 </table>
5855 `); 5915 `);
5856 form.render(); 5916 form.render();
@@ -5860,10 +5920,10 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5860,10 +5920,10 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5860 $("#tableBody").append(` 5920 $("#tableBody").append(`
5861 <tr> 5921 <tr>
5862 <td> 5922 <td>
5863 - <input type="text" name="title" class="layui-input"> 5923 + <input type="text" name="min" class="layui-input">
5864 </td> 5924 </td>
5865 <td> 5925 <td>
5866 - <input type="text" name="title" class="layui-input"> 5926 + <input type="text" name="max" class="layui-input">
5867 </td> 5927 </td>
5868 <td> 5928 <td>
5869 <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button> 5929 <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>
@@ -5881,6 +5941,65 @@ DataFormatPanel.prototype.addDataFont = function (container) { @@ -5881,6 +5941,65 @@ DataFormatPanel.prototype.addDataFont = function (container) {
5881 $(".deleteData").click(function () { 5941 $(".deleteData").click(function () {
5882 this.parentNode.parentNode.remove(); 5942 this.parentNode.parentNode.remove();
5883 }); 5943 });
  5944 +
  5945 + // 回显数据
  5946 + // $("#select").selectZTreeSet(findAnim?.orgId)
  5947 + setTimeout(async () => {
  5948 + form.val("formModal", { deviceId: findAnim?.deviceId });
  5949 + if (!findAnim?.deviceId) return;
  5950 + const res = await defHttp.get(
  5951 + `/plugins/telemetry/DEVICE/${findAnim?.deviceId}/keys/timeseries`
  5952 + );
  5953 + // 先清空子元素
  5954 + $("#attrSelect").empty();
  5955 + $("#attrSelect").append(`<option value="">请选择属性</option>`);
  5956 + for (let item of res) {
  5957 + // 在追加
  5958 + $("#attrSelect").append(`<option value="${item}">${item}</option>`);
  5959 + }
  5960 + form.val("formModal", { attr: findAnim?.attr });
  5961 +
  5962 + const len = findAnim?.condition?.content?.length;
  5963 + if (!len) {
  5964 + $("#tableBody").prepend(`
  5965 + <tr>
  5966 + <td>
  5967 + <input type="text" name="min" class="layui-input">
  5968 + </td>
  5969 + <td>
  5970 + <input type="text" name="max" class="layui-input">
  5971 + </td>
  5972 + <td>
  5973 + <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>
  5974 + </td>
  5975 + </tr>
  5976 + `);
  5977 + $(".deleteData").click(function () {
  5978 + this.parentNode.parentNode.remove();
  5979 + });
  5980 + return;
  5981 + }
  5982 + for (let i = 0; i < len; i++) {
  5983 + $("#tableBody").append(`
  5984 + <tr>
  5985 + <td>
  5986 + <input type="text" name="min" class="layui-input" value="${findAnim.condition.content[i].min}">
  5987 + </td>
  5988 + <td>
  5989 + <input type="text" name="max" class="layui-input" value="${findAnim.condition.content[i].max}">
  5990 + </td>
  5991 + <td>
  5992 + <button type="button" class="layui-btn layui-btn-primary layui-border-red deleteData">删除</button>
  5993 + </td>
  5994 + </tr>
  5995 + `);
  5996 + }
  5997 +
  5998 + $(".deleteData").click(function () {
  5999 + this.parentNode.parentNode.remove();
  6000 + });
  6001 + form.render();
  6002 + }, 500);
5884 } 6003 }
5885 6004
5886 // 数据交互事件 6005 // 数据交互事件
1 /** 1 /**
2 * custom http request 2 * custom http request
3 */ 3 */
4 -function DefHttp() { 4 +function createAxios(options) {
5 /** 5 /**
6 * 创建实例 6 * 创建实例
7 */ 7 */
8 const instance = axios.create({ 8 const instance = axios.create({
9 - baseURL: DefHttp.baseURL,  
10 - timeout: DefHttp.timeout, 9 + baseURL: options.baseURL,
  10 + timeout: options.timeout,
11 headers: { 11 headers: {
12 "content-type": "application/json; charset=UTF-8", 12 "content-type": "application/json; charset=UTF-8",
13 - "X-Authorization": "Bearer " + DefHttp.token, 13 + "X-Authorization": "Bearer " + options.token,
14 }, 14 },
15 }); 15 });
16 /** 16 /**
@@ -18,17 +18,14 @@ function DefHttp() { @@ -18,17 +18,14 @@ function DefHttp() {
18 */ 18 */
19 instance.interceptors.response.use( 19 instance.interceptors.response.use(
20 function (response) { 20 function (response) {
21 - return response; 21 + return response.data;
22 }, 22 },
23 function (error) { 23 function (error) {
24 if (error.response.status == 401) { 24 if (error.response.status == 401) {
25 - alert(error.response.data.message); 25 + layer.alert('登录超时,请重新登录');
26 } 26 }
27 return Promise.reject(error); 27 return Promise.reject(error);
28 } 28 }
29 ); 29 );
30 return instance; 30 return instance;
31 } 31 }
32 -DefHttp.timeout = 10 * 1000;  
33 -DefHttp.token = "";  
34 -DefHttp.baseURL = "/api/";  
@@ -50,13 +50,7 @@ @@ -50,13 +50,7 @@
50 -moz-align-items: center; 50 -moz-align-items: center;
51 align-items: center; 51 align-items: center;
52 } 52 }
53 -* {  
54 - -moz-box-sizing: border-box;  
55 - -webkit-box-sizing: border-box;  
56 - -o-box-sizing: border-box;  
57 - -ms-box-sizing: border-box;  
58 - box-sizing: border-box;  
59 -} 53 +
60 .panel { 54 .panel {
61 overflow: hidden; 55 overflow: hidden;
62 text-align: left; 56 text-align: left;