渲染手动控制设备列表、序号

psdc-ui/src/views/control/manual/index.vue

@@ -24,9 +24,8 @@
                 </span>
               </el-form-item>
 
-              <el-form-item v-for="inputs in item.control_elements" :label="inputs.controlRemark"><el-input v-model="form1.temp"/></el-form-item>
-<!--              <el-form-item label="出水温度："><el-input v-model="form1.outtemp" /></el-form-item>-->
-<!--              <el-form-item label="温度："   ><el-input v-model="form1.temp"    /></el-form-item>-->
+              <el-form-item v-for="inputs in item.control_elements" :label="inputs.controlRemark"><input class="tempInput" v-model="inputs.tempValue"/></el-form-item>
+
               <div class="submit" v-show="item.control_elements.length > 0 ? true : false"  @click="getSetTemperatureFun(item)">确定</div>
 
             </el-form>
@@ -64,14 +63,14 @@
     <el-drawer v-model="drawerIshow">
       <template #header><h4>策略导入</h4></template>
       <template #default>
-          <el-radio v-for="(item,index) in celueList" :key="index" class="celueBox" v-model="radio" :label="item.sceneName" size="large">
+          <el-radio v-for="(item,index) in celueList" :key="index" class="celueBox" v-model="radio" :label="item.sceneName" size="large" @change="selectCeLue(item)">
           <span style="font-weight: bold; display: inline-block; margin-bottom: 20px;">{{ item.sceneName }}</span>
           <div class="celueItem" v-for="items in item.data" :key="items.device_id">
             <span>{{ items.device_name }}</span>
             <div class="itemsValue">
               <span class="txtInput" v-for="itemsValue in items.value" :key="itemsValue.sceneKey">
                 <span class="txt">{{ itemsValue.sceneContext }}：</span>
-                <input type="text" :value="itemsValue.sceneValue" disabled/>
+                <input type="text" :value="`${itemsValue.sceneValue}℃`" disabled/>
               </span>
             </div>
           </div>
@@ -102,7 +101,14 @@ onMounted(()=>{
 const deviceArr = ref([])
 function getDeviceFun(){
   getDevice().then((res)=>{
-    deviceArr.value = res.data
+    deviceArr.value = res.data;
+    //拼接温度单位
+    for(let i = 0;i < res.data.length;i++){
+      for(let j = 0;j < res.data[i].control_elements.length;j++){
+        console.log(res.data[i].control_elements[j].tempValue)
+        res.data[i].control_elements[j].tempValue = res.data[i].control_elements[j].tempValue + '℃'
+      }
+    }
   })
 }
 /** 设备控制处理*/
@@ -167,9 +173,41 @@ function getStrategyListFun(){
     celueList.value = res.data
   })
 }
+//选择策略
+function selectCeLue(item){
+  //拼数组对象
+  //1、
+  let dataArr = [];
+  for(let i = 0;i < item.data.length;i++){
+    //2、
+    let dataObject = {};
+    // deviceId = item.data[i].device_id;
+    dataObject.deviceId = item.data[i].device_id;
+
+    //3、
+    let tempArr = [];
+    for(let j = 0;j < item.data[i].value.length;j++){
+      //4、
+      let tempObject = {};
+      tempObject.controlKey = item.data[i].value[j].sceneKey
+      tempObject.controlValue = item.data[i].value[j].sceneValue
+
+      //5、
+      tempArr.push(tempObject)
+      dataObject.data = tempArr
+    }
+    //6、
+    dataArr.push(dataObject);
+  }
+
+  //最终要传参的格式
+  console.log(JSON.stringify(dataArr, null, 4));
+}
+//执行
 function confirmClick() {
   ElMessageBox.confirm(`确定执行 ${radio.value} ?`).then(() => {
     drawerIshow.value = false;
+
   })
 }
 
@@ -206,21 +244,23 @@ function handleDevChangeFun(id,sta){
 
 /** 设置温度*/
 function getSetTemperatureFun(item){
-  // console.log(item)
-  // getSetTemperature({
-  //   "deviceId":100,
-  //   "data":[
-  //     {
-  //       "controlKey":"intemp",
-  //       "controlValue":"28"
-  //     },
-  //     {
-  //       "controlKey":"outtemp",
-  //       "controlValue":"90"
-  //     }]
-  // }).then((res)=>{
-  //   console.log(res)
-  // })
+  let dataArr = [];
+  for(let i = 0;i < item.control_elements.length;i++){
+    let dataObject = {
+      "controlKey": item.control_elements[i].controlElement,
+      "controlValue": item.control_elements[i].tempValue
+    };
+    dataArr.push(dataObject)
+  }
+  getSetTemperature({
+    "deviceId":item.deviceId,
+    "data": dataArr
+  }).then((res)=>{
+    if(res.code == 200){
+      ElMessage.success('设置温度成功！')
+    }
+  })
+
 }
 
 </script>
@@ -370,7 +410,17 @@ function getSetTemperatureFun(item){
 .failure {
   color: red;
 }
-
+.tempInput{
+  width: 100%;
+  line-height: 28px;
+  padding: 0 5px;
+  color: #F5901A;
+  font-weight: bold;
+  &:focus{
+    border: 0px;
+    outline: none;
+  }
+}
 ::v-deep .el-button{
   border-radius: 2px;
   margin-bottom: 12px;
@@ -384,7 +434,8 @@ function getSetTemperatureFun(item){
   margin-bottom: 3px;
 }
 ::v-deep .el-input__inner{
-  color: #606266;
+  //color: #F5901A;
+  //font-weight: bold;
 }
 ::v-deep .el-pagination{
   position: absolute;