代码同步

src/views/iot/scene/manage/component/actionItem.vue

@@ -11,7 +11,7 @@
         <div class="icon"></div>串行动作
       </div>
       <div class="product flex flex-warp">
-        <ActionSerialItem :seriallist="item.seriallist" :sourceData="sourceData"></ActionSerialItem>
+        <ActionSerialItem :serial="item.serial" :sourceData="sourceData" @saveData="saveData" ></ActionSerialItem>
 
       
       </div>
@@ -20,7 +20,7 @@
         <div class="icon"></div>并行动作
       </div>
       <div class="product flex flex-warp">
-            <ActionParallelItem :parallellist="item.parallellist"></ActionParallelItem>
+            <ActionParallelItem :parallel="item.parallel"></ActionParallelItem>
       
       </div>
     </div>
@@ -29,10 +29,6 @@
         <el-button type="primary" :icon="DocumentAdd" @click="addAction()">新增场景动作</el-button>
       </div>
     </div>
-
-
-
-
  
   </div>
 </template>
@@ -42,49 +38,100 @@ import { PropType, ref  } from 'vue'
 import { DocumentAdd, CircleClose } from '@element-plus/icons-vue';
 import ActionSerialItem from './actionSerialItem.vue';
 import ActionParallelItem from './actionParallelItem.vue';
-
-
-interface IConditionItem {
-  param?: string;
-  operator?: string;
-  value?: string;
-}
+import api from '/@/api/scene';
+
+
+//初始化数据
+const actionList_temp=ref([{
+  serial:[{}],
+  parallel:[{}],
+}]);
+const actionList=ref([{
+  serial:[{}],
+  parallel:[{}],
+}]);
+const originalSceneList = ref([{
+	id: 0
+}]);
 interface testIValueType {
   id: string;
   key: string;
   name?: string;
 }
-interface IValueType {
-  seriallist?:IConditionItem[] ;
-  parallellist?:IConditionItem[] ;
-}
 
 const props = defineProps({
-
-  actionList: {
-    type: Array as PropType<IValueType[]>,
-    default: () => []
-  },
-
   sourceData: {
     type: Array as PropType<testIValueType[]>,
     default: () => []
   },
+  scene_id:{
+    type:String,
+    default: () => ''
+  }
 })
 
+const getOneDetail = () => {
+			api.manage.getOneDetail({ "sceneId": props.scene_id, 'group': 'action' }).then((res: any) => {
+				if (!res) {
+					addActionDetail();
+					// getOneDetail();
+				}
+       	originalSceneList.value = res;
+
+				const action = res.map((scene: any) => {
+					const parsedBodyJson = JSON.parse(scene.bodyjson);
+					return {
+						...parsedBodyJson
+					};
+				});
+
+        
+        // actionList.value=action;
+        console.log(action);
+
+
+			})
+		};
+getOneDetail();    
+
+//新增一条场景动作
+const addActionDetail = () => {
+		let data = {
+			sceneId: props.scene_id,
+			group: 'action',
+			bodyjson: actionList_temp.value,
+		}
+		api.manage.addDetail(data).then((res: any) => {
+			getOneDetail();
+		});
+}
+//删除一条场景
+const delScenesDetail = (index: number) => {
+			let ids =props.scene_id;
+			api.manage.delDetail(ids).then((res: any) => {
+				// getOneDetail();
+			});
+}
 
-const addAction = () => {
-  props.actionList.push({
-    'seriallist':[{
+//修改一条场景
+const saveData = (data: any) => {
+  console.log(actionList.value,"111111111111111111");
+			let ids = props.scene_id;
+			api.manage.editDetail({ id: ids, bodyjson:actionList.value }).then((res: any) => {
+				  getOneDetail();
+			});
 
-    }],
-    'parallellist':[{
-      
-    }],
+}
+
+
+const addAction = () => {
+  actionList.value.push({
+    'serial':[],
+    'parallel':[],
   });
 };
 const delAction = (index: number) => {
-  props.actionList.splice(index, 1);
+  actionList.value.splice(index, 1);
 }
 
 </script>

src/views/iot/scene/manage/component/actionSerialItem.vue

@@ -1,7 +1,7 @@
 
 <template>
   <div class="type-item">
-    <div v-for="(item, index) in seriallist" :key="index" class="item " :class="index > 0 ? 'biankang' : ''">
+    <div v-for="(item, index) in serial" :key="index" class="item " :class="index > 0 ? 'biankang' : ''">
       <div class="conicon" style="width: 100%; text-align: right; position: relative; right: -8px; top: -8px; color: red"
         v-if="index > 0">
         <el-icon @click="delScene(index)">
@@ -10,16 +10,19 @@
       </div>
       <div class="product flex flex-warp">
         <el-form-item label="动作类型：" prop="actionType">
-          <el-select v-model="item.actionType" filterable placeholder="请选择动作类型">
+          <el-select v-model="item.actionType" filterable placeholder="请选择动作类型" @change="saveData">
             <el-option v-for="it in sourceActionTypeData" :key="it.key" :label="it.name" :value="it.key">
               <span style="float: left">{{ it.name }}</span>
               <span style="float: right; font-size: 13px">{{ it.key }}</span>
             </el-option>
           </el-select>
         </el-form-item>
-        <DeviceOut :sourceData="sourceData" v-if="item.actionType=='deviceOutput'"></DeviceOut>
-        <SendNotice  v-if="item.actionType=='sendNotice'"></SendNotice>
-        <CallWebService  v-if="item.actionType=='callWebService'"></CallWebService>
+        <DeviceOut :index="index" :sourceData="sourceData" v-if="item.actionType==='deviceOutput'" @SetSaveData="SetSaveData"></DeviceOut>
+        <SendNotice  v-if="item.actionType==='sendNotice'"  @saveData="saveData"></SendNotice>
+        <CallWebService  v-if="item.actionType==='callWebService'"  @saveData="saveData"></CallWebService>
+        <TriggerAlarm  v-if="item.actionType==='triggerAlarm'"  @saveData="saveData"></TriggerAlarm>
+        <DelayExecution  v-if="item.actionType==='delayExecution'"  @saveData="saveData"></DelayExecution>
+        <TriggerCustomEvent  v-if="item.actionType==='triggerCustomEvent'"  @saveData="saveData"></TriggerCustomEvent>
       </div>
     </div>
     <div>
@@ -37,35 +40,24 @@ import { DocumentAdd, CircleClose } from '@element-plus/icons-vue';
 import DeviceOut from './actionType/deviceOut.vue';
 import SendNotice from './actionType/sendNotice.vue';
 import CallWebService from './actionType/callWebService.vue';
-
-let product_key = "";
-
+import TriggerAlarm from './actionType/triggerAlarm.vue';
+import DelayExecution from './actionType/delayExecution.vue';
+import TriggerCustomEvent from './actionType/triggerCustomEvent.vue';
 const deviceListData = ref<testIValueType[]>([]);
-
-interface IConditionItem {
-  param?: string;
-  operator?: string;
-  value?: string;
-}
+const emit = defineEmits(['addScenesDetail','delScenesDetail','saveData']);
 
 interface IValueType {
-  actionType:'';
-  productKey:'';
-  deviceKey:'';
-  seriallist?: IConditionItem[];
+  actionType?:string;
 }
-
-
-
 interface testIValueType {
-  key: string;
+  key?: string;
   name?: string;
 
 }
 
 const props = defineProps({
 
-  seriallist: {
+  serial: {
     type: Array as PropType<IValueType[]>,
     default: () => []
   },
@@ -96,16 +88,27 @@ const props = defineProps({
     }]
   }
 })
+const serialValue = ref(props.serial);
 
+const saveData=()=>{
+  emit('saveData',props.serial);
+}
 
-const addScene = () => {
-  props.seriallist.push({
-    'product_key': '',
+const SetSaveData=(data:any,index:number)=>{
 
+  // serialValue.value[index]=data;  
+  console.log(serialValue.value,55555555555);
+  //  props.serial.push(data);
+  // emit('saveData',serialValue.value);
+
+}
+const addScene = () => {
+  props.serial.push({
+    'actionType': '',
   });
 };
 const delScene = (index: number) => {
-  props.seriallist.splice(index, 1);
+  props.serial.splice(index, 1);
 }
 </script>
 <style scoped lang="scss">

src/views/iot/scene/manage/component/actionType/callWebService.vue

@@ -1,33 +1,29 @@
 <template>
   <el-form-item label="请求方式" prop="productKey" class="form-item" style="margin-left: 50px;">
-    <el-select v-model="fromData.callWebService.method" filterable placeholder="请选择请求方式" @change="seletChange">
+    <el-select v-model="fromData.callWebService.method" filterable placeholder="请选择请求方式" @change="saveData">
       <el-option label="POST" value="POST" />
       <el-option label="GET" value="GET" />
     </el-select>
   </el-form-item>
-
-  <el-form-item label="服务地址：" prop="deviceKey" class="form-item">
-    <el-input v-model="fromData.callWebService.url" placeholder="请输入服务地址：" @input="saveData" />
-  </el-form-item>
-
   <el-form-item label="编码：" prop="executeAction" class="form-item">
-    <el-select v-model="fromData.callWebService.encoding" filterable placeholder="请选择触发类型">
+    <el-select v-model="fromData.callWebService.encoding" filterable placeholder="请选择触发类型"  @change="saveData">
       <el-option label="UTF-8" value="UTF-8" />
       <el-option label="GBK" value="GBK" />
     </el-select>
   </el-form-item>
+  <el-form-item label="服务地址：" prop="deviceKey" class="form-item">
+    <el-input v-model="fromData.callWebService.url" placeholder="请输入服务地址：" @input="saveData" />
+  </el-form-item>
   <el-form-item label="设置请求头：" prop="executeAction" class="form-item">
-      <el-input v-model="fromData.callWebService.headers" type="textarea" />
+      <el-input v-model="fromData.callWebService.headers" type="textarea" @input="saveData" />
   </el-form-item>
-  <el-form-item label="参数编写：" prop="executeAction" class="form-item">
-      <el-input v-model="fromData.callWebService.parameter" type="textarea" />
+  <el-form-item label="参数编写：" prop="executeAction" class="form-item" style="margin-left: 30px;">
+      <el-input v-model="fromData.callWebService.parameter" type="textarea" @input="saveData" />
   </el-form-item>
 </template>
 
 <script lang="ts" setup>
-import { PropType, ref } from 'vue'
-
-
+import {  ref } from 'vue'
 
 const fromData = ref({
   actionType: "callWebService",
@@ -41,11 +37,12 @@ const fromData = ref({
   }
 })
 
+const emit = defineEmits(['saveData']);
 
 const saveData = () => {
-  console.log(fromData);
+  emit('saveData',fromData);
+
 }
-saveData();
 
 
 </script>

src/views/iot/scene/manage/component/actionType/delayExecution.vue

@@ -0,0 +1,30 @@
+<template>
+  
+  <el-form-item label="延时执行：" prop="delayTime" class="form-item">
+    <el-input v-model="fromData.delayTime" placeholder="请输入延时执行,单位秒" @input="saveData" />
+  </el-form-item>
+  
+</template>
+
+<script lang="ts" setup>
+import {  ref } from 'vue'
+const fromData = ref({
+  actionType: "delayExecution",
+  delayTime:''
+})
+
+const emit = defineEmits(['saveData']);
+
+const saveData = () => {
+  emit('saveData',fromData);
+
+}
+
+
+</script>
+<style scoped lang="scss">
+.form-item {
+  flex: 0 0 25%;
+
+}
+</style>

src/views/iot/scene/manage/component/actionType/deviceOut.vue

@@ -10,7 +10,7 @@
           </el-form-item>
 
           <el-form-item label="设备：" prop="deviceKey" class="form-item">
-            <el-select v-model="fromData.deviceKey" filterable placeholder="请选择设备">
+            <el-select v-model="fromData.deviceKey" filterable placeholder="请选择设备" @change="saveData">
               <el-option v-for="it in deviceListData" :key="it.key" :label="it.name" :value="it.key">
                 <span style="float: left">{{ it.name }}</span>
                 <span style="float: right; font-size: 13px">{{ it.key }}</span>
@@ -28,7 +28,7 @@
           </el-form-item>
 
           <el-form-item label="功能调用" prop="type" class="form-item" v-if="fromData.executeAction=='functionCall'">
-            <el-select v-model="fromData.functionCall.functionName" filterable placeholder="请选择触发类型">
+            <el-select v-model="fromData.functionCall.functionName" filterable placeholder="请选择触发类型" @change="saveData">
               <el-option v-for="it in functionCallList" :key="it.key" :label="it.name" :value="it.key">
                 <span style="float: left">{{ it.name }}</span>
                 <span style="float: right; font-size: 13px">{{ it.key }}</span>
@@ -81,6 +81,8 @@
 import { PropType, ref  } from 'vue'
 import product from '/@/api/device';
 import datahub from '/@/api/datahub';
+const emit = defineEmits(['SetSaveData']);
+
 interface testIValueType {
   id?: string;
   key?: string;
@@ -91,6 +93,10 @@ const props = defineProps({
     type: Array as PropType<testIValueType[]>,
     default: () => []
   },
+  index:{
+    type: Number,
+    default: () => 0
+  },
   sourceActionTypeData: {
     type: Array as PropType<testIValueType[]>,
     default: () => [{
@@ -144,11 +150,12 @@ const getAction=(val:string)=>{
         });
       break;
     }
+    saveData();
 }
 
 const saveSetData=()=>{
   fromData.value.setProperties = setPropertiesItem.value; 
-  console.log(fromData);
+  saveData();  
 
 }
 const setProperties=(val:any)=>{
@@ -160,10 +167,11 @@ const setProperties=(val:any)=>{
       });
 
        fromData.value.setProperties = setPropertiesItem.value;
-       console.log(fromData);
+       saveData();  
 }
-const saveData=()=>{
-  console.log(fromData.value);
+
+const saveData = () => {
+  emit('SetSaveData',fromData.value,props.index);
 }
 
 const getDeviceList = (_id: any) => {
@@ -180,6 +188,7 @@ const seletChange = (val:string) => {
     fromData.value.deviceKey = '';
     getDeviceList(info.id)
   }
+  saveData();
 }
 </script>
 <style scoped lang="scss">

src/views/iot/scene/manage/component/actionType/triggerAlarm.vue

@@ -0,0 +1,34 @@
+<template>
+  
+  <el-form-item label="告警级别：" prop="delayTime" class="form-item ml20">
+    <el-input v-model="fromData.delayTime" placeholder="请输入告警级别" @input="saveData" class="w100 " />
+  </el-form-item>
+  <el-form-item label="告警信息：" prop="delayTime" class="form-item ml20">
+    <el-input v-model="fromData.delayTime" placeholder="请输入告警信息" @input="saveData" class="w100 " />
+  </el-form-item>
+</template>
+
+<script lang="ts" setup>
+import {  ref } from 'vue'
+const fromData = ref({
+  actionType: "triggerAlarm",
+  alarm:{
+    alarmLevel:'',
+    info:'',
+  }
+})
+
+
+const saveData = () => {
+  console.log(fromData);
+}
+saveData();
+
+
+</script>
+<style scoped lang="scss">
+.form-item {
+  flex: 0 0 25%;
+
+}
+</style>

src/views/iot/scene/manage/component/actionType/triggerCustomEvent.vue

@@ -0,0 +1,42 @@
+<template>
+  <el-form-item label="自定义场景：" prop="executeAction" class="form-item">
+    <el-select v-model="fromData.executeAction" filterable placeholder="请选择自定义场景" @change="getTemplist">
+      <el-option v-for="item in sceneList" :key="item.id" :label="item.name" :value="item.id" />
+    </el-select>
+  </el-form-item>
+</template>
+
+<script lang="ts" setup>
+import {ref} from 'vue';
+import api from '/@/api/scene';
+
+const fromData = ref({
+  actionType: "triggerCustomEvent",
+  executeAction:''
+})
+interface testIValueType {
+  id?: string;
+  key?: string;
+  name?: string;
+}
+
+const sceneList=ref(<testIValueType[]>[]);
+
+const getsceneList=()=>{
+  let param={
+					pageNum: 1,
+					pageSize: 50,
+					sceneType: 'manual',
+		};
+    api.manage.getList(param).then((res: any) => {
+      sceneList.value=res.Data;
+    });
+}
+getsceneList();
+
+const saveData = () => {
+  console.log(fromData);
+}
+saveData();
+</script>
+

src/views/iot/scene/manage/detail.vue

@@ -21,7 +21,7 @@
 	</el-card>
 	<el-card style="  margin-top: 15px;">
 		<div class="font20">场景动作</div>
-		<ActionItem :actionList="actionList"  :sourceData="sourceData"></ActionItem>
+		<ActionItem v-if="detail.id" :scene_id="detail.id"  :sourceData="sourceData"></ActionItem>
 	</el-card>
 
 	<EditForm ref="editFormRef" @getList="getDetail()"></EditForm>
@@ -64,6 +64,7 @@ export default defineComponent({
 			showstatus: false,
 			sourceData: [],
 			detail: {
+				id: '',
 				name: '',
 				status: 0,
 				description: '',
@@ -108,6 +109,7 @@ export default defineComponent({
 
 		const getOneDetail = () => {
 			const id = route.params && route.params.id;
+
 			api.manage.getOneDetail({ "sceneId": id, 'group': 'definition' }).then((res: any) => {
 				if (!res) {
 					addScenesDetail('definition');