839 lines
23 KiB
Vue
839 lines
23 KiB
Vue
|
<template>
|
|||
|
|
<page-meta>
|
|||
|
|
<navigation-bar :title="$tt('navBar.sceneDetail')" background-color="#007AFF">
|
|||
|
|
</navigation-bar>
|
|||
|
|
</page-meta>
|
|||
|
|
<view class="scene-detail-wrap">
|
|||
|
|
<view class="name-wrap">
|
|||
|
|
<u--input clearable border="false" :placeholder="$tt('sceneDetail.inputName')"
|
|||
|
|
:customStyle="{ backgroundColor: '#fff', padding: '12px 30rpx', borderRadius: '10rpx' }" fontSize="16"
|
|||
|
|
v-model="sceneData.sceneName"></u--input>
|
|||
|
|
</view>
|
|||
|
|
<view class="container-wrap">
|
|||
|
|
<view class="cell-group-wrap">
|
|||
|
|
<u-cell-group :border="false">
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell size="large" :border="false" :title="$tt('sceneDetail.sceneState')">
|
|||
|
|
<u-switch v-model="sceneData.enable" slot="value" :activeValue="1" :inactiveValue="2"
|
|||
|
|
activeColor="#3C9CFF" inactiveColor="#dbdbdb" size="18"></u-switch>
|
|||
|
|
</u-cell>
|
|||
|
|
</view>
|
|||
|
|
</u-cell-group>
|
|||
|
|
</view>
|
|||
|
|
<view class="condition-wrap">
|
|||
|
|
<view class="title-wrap">
|
|||
|
|
<view class="left-wrap">
|
|||
|
|
<u-row>
|
|||
|
|
<u-col span="2.5">
|
|||
|
|
<text class="title">{{$tt('sceneDetail.trigger')}}</text>
|
|||
|
|
</u-col>
|
|||
|
|
<u--text suffixIcon="arrow-down" iconStyle="font-size: 10px; margin-left: 10rpx"
|
|||
|
|
:text="getCondName(sceneData.cond)" color="#868686" size="12"
|
|||
|
|
@click="isCond = true"></u--text>
|
|||
|
|
</u-row>
|
|||
|
|
<u--form labelWidth="60" :labelStyle="{ color: '#868686',fontSize: '12px' }"
|
|||
|
|
style="margin:10rpx 0 0">
|
|||
|
|
<u-form-item label="延时匹配 :">
|
|||
|
|
<view style="width:240rpx">
|
|||
|
|
<u-input placeholder="请输入延时时间" clearable @input="onInput" type="number"
|
|||
|
|
v-model="checkDelay" placeholder-style="font-size:10px;width:80px;"
|
|||
|
|
:maxlength="3" style="height:30rpx;">
|
|||
|
|
<u--text text="秒钟" slot="suffix" type="tips" margin="0 0 0 5px"
|
|||
|
|
size="10"></u--text>
|
|||
|
|
</u-input>
|
|||
|
|
</view>
|
|||
|
|
</u-form-item>
|
|||
|
|
</u--form>
|
|||
|
|
</view>
|
|||
|
|
<view class="right-wrap">
|
|||
|
|
<u-icon name="plus-circle-fill" size="24" color='#3c9cff' bold
|
|||
|
|
@click="handleAddTrigger"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-if="sceneData.triggers.length === 0" class="empty-cell" @click="handleAddTrigger">
|
|||
|
|
<view class="text">{{$tt('sceneDetail.addConditions')}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-else class="swipe-action-wrap">
|
|||
|
|
<u-swipe-action autoClose>
|
|||
|
|
<u-cell-group :border="false">
|
|||
|
|
<!-- 设置key为不同id是为了解决uview的SwipeAction 滑动单元格 关闭事件 ，删除当前项，下一项自动弹出删除选择bug -->
|
|||
|
|
<view class="action-item-wrap" v-for="(item,index) in sceneData.triggers"
|
|||
|
|
:key="getKey(index, item)">
|
|||
|
|
<u-swipe-action-item :options="swipeOptions"
|
|||
|
|
@click="handleDeleteSceneItem('trigger', index)">
|
|||
|
|
<u-cell :border="false" isLink
|
|||
|
|
@click="handleEditSceneItem({type:'trigger', item:item, index:index})">
|
|||
|
|
<view slot="title" class="slot-title">
|
|||
|
|
<u--image :src="getImageUrl(item)" radius="4" width="33"
|
|||
|
|
height="33"></u--image>
|
|||
|
|
<view class="cell-text">
|
|||
|
|
<view class="title">
|
|||
|
|
{{item.productName}}{{item.cronExpression ? 'CRON' : ''}}
|
|||
|
|
</view>
|
|||
|
|
<view v-if="item.deviceCount > 0" class="des">
|
|||
|
|
{{$tt('sceneDetail.deviceNumber')}}：{{item.deviceCount}}
|
|||
|
|
个
|
|||
|
|
</view>
|
|||
|
|
<view class="des">
|
|||
|
|
<template v-if="item.parentName && item.parentName !== item.name">
|
|||
|
|
{{item.parentName}} >>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="item.arrayIndexName">
|
|||
|
|
{{item.arrayIndexName}} >>
|
|||
|
|
</template>
|
|||
|
|
{{item.name}}
|
|||
|
|
{{item.value !== '' ? item.operator ? `${item.operator} ${item.value}` : item.value : ''}}
|
|||
|
|
<!-- 定时触发事件 -->
|
|||
|
|
{{item.cronExpression ? item.cronExpression : ''}}
|
|||
|
|
<!-- 触发条件为上下线设备 -->
|
|||
|
|
{{item.type === 5 ? $tt('sceneDetail.deviceOnline') : item.type === 6 ? $tt('sceneDetail.Equipment') : ''}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</u-cell>
|
|||
|
|
</u-swipe-action-item>
|
|||
|
|
</view>
|
|||
|
|
</u-cell-group>
|
|||
|
|
</u-swipe-action>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="execute-wrap">
|
|||
|
|
<view class="title-wrap">
|
|||
|
|
<view class="left-wrap">
|
|||
|
|
<text class="title">{{$tt('sceneDetail.action')}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="right-wrap">
|
|||
|
|
<u-icon name="plus-circle-fill" size="24" color='#3c9cff' bold
|
|||
|
|
@click="handleAddAction"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-if="sceneData.actions.length === 0" class="empty-cell" @click="handleAddAction">
|
|||
|
|
<view class="text">{{$tt('sceneDetail.addTask')}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-else class="swipe-action-wrap">
|
|||
|
|
<u-swipe-action autoClose>
|
|||
|
|
<u-cell-group :border="false">
|
|||
|
|
<view class="action-item-wrap" v-for="(item,index) in sceneData.actions"
|
|||
|
|
:key="getKey(index, item)">
|
|||
|
|
<!-- 设置key为不同id是为了解决uview的SwipeAction 滑动单元格 关闭事件 ，删除当前项，下一项自动弹出删除选择bug -->
|
|||
|
|
<u-swipe-action-item :options="swipeOptions"
|
|||
|
|
@click="handleDeleteSceneItem('action', index)">
|
|||
|
|
<u-cell :border="false" isLink
|
|||
|
|
@click="handleEditSceneItem({type:'action', item:item, index:index})">
|
|||
|
|
<view slot="title" class="slot-title">
|
|||
|
|
<u--image :src="getImageUrl(item)" radius="4" width="33"
|
|||
|
|
height="33"></u--image>
|
|||
|
|
<view class="cell-text">
|
|||
|
|
<!-- 告警执行 -->
|
|||
|
|
<view class="title">
|
|||
|
|
{{item.productName}}{{item.source ? $tt('sceneDetail.alertExecute') : ''}}
|
|||
|
|
</view>
|
|||
|
|
<view v-if="item.deviceCount > 0" class="des">
|
|||
|
|
{{$tt('sceneDetail.deviceNumber')}}：{{item.deviceCount}}
|
|||
|
|
个
|
|||
|
|
</view>
|
|||
|
|
<view class="des">
|
|||
|
|
<template v-if="item.parentName && item.parentName !== item.name">
|
|||
|
|
{{item.parentName}} >>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="item.arrayIndexName">
|
|||
|
|
{{item.arrayIndexName}} >>
|
|||
|
|
</template>
|
|||
|
|
{{item.name}}
|
|||
|
|
{{item.value !== '' ? item.value : ''}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</u-cell>
|
|||
|
|
</u-swipe-action-item>
|
|||
|
|
</view>
|
|||
|
|
</u-cell-group>
|
|||
|
|
</u-swipe-action>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="cell-group-wrap">
|
|||
|
|
<u-cell-group :border="false">
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell size="large" :border="false" :title="$tt('sceneDetail.moreSetting')" isLink
|
|||
|
|
@click="handleMore"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
</u-cell-group>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="btn-save-wrap">
|
|||
|
|
<u-button type="primary" :customStyle="{ height: '96rpx' }" size="normal" :text="$tt('common.save')"
|
|||
|
|
@click="handleSave"></u-button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="other">
|
|||
|
|
<u-popup :show="isCond" :round="5" mode="bottom" :closeOnClickOverlay="true" @close="isCond = false">
|
|||
|
|
<view class="cond-popup-wrap">
|
|||
|
|
<view class="cell-group-wrap">
|
|||
|
|
<u-cell-group :border="false">
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('scene.anyCondition')" :name="1"
|
|||
|
|
@click="handleConfirmCond"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('scene.allCondition')" :name="2"
|
|||
|
|
@click="handleConfirmCond"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('scene.notConditions')" :name="3"
|
|||
|
|
@click="handleConfirmCond"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('common.cancel')" name="cancel" :border="false"
|
|||
|
|
@click="handleConfirmCond"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
</u-cell-group>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</u-popup>
|
|||
|
|
<u-popup :show="isMore" :round="5" mode="bottom" bgColor="#eef3f7" :closeOnClickOverlay="true"
|
|||
|
|
@close="isMore = false">
|
|||
|
|
<view class="more-popup-wrap">
|
|||
|
|
<view class="remark">{{$tt('sceneDetail.moreSetting')}}</view>
|
|||
|
|
<view class="form-wrap">
|
|||
|
|
<u--form :model="more" labelPosition="left" labelWidth="80">
|
|||
|
|
<view class="form-item-wrap">
|
|||
|
|
<u-form-item :label="$tt('sceneDetail.silentTime')" prop="more.silentPeriod">
|
|||
|
|
<u-input v-model="more.silentPeriod" border="none" type="number" inputAlign="right"
|
|||
|
|
:placeholder="$tt('sceneDetail.inputTime')" clearable>
|
|||
|
|
<u--text :text="$tt('sceneDetail.minute')" slot="suffix" margin="0 0 0 6rpx"
|
|||
|
|
type="tips"></u--text>
|
|||
|
|
</u-input>
|
|||
|
|
</u-form-item>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item-wrap">
|
|||
|
|
<u-form-item :label="$tt('sceneDetail.executionMethod')" prop="more.executeMode">
|
|||
|
|
<template slot="right">
|
|||
|
|
<u-radio-group v-model="more.executeMode">
|
|||
|
|
<u-radio :label="$tt('sceneDetail.serial')" :name="1"
|
|||
|
|
:customStyle="{marginRight: '30rpx'}">
|
|||
|
|
</u-radio>
|
|||
|
|
<u-radio :label="$tt('sceneDetail.parallel')" :name="2">
|
|||
|
|
</u-radio>
|
|||
|
|
</u-radio-group>
|
|||
|
|
</template>
|
|||
|
|
</u-form-item>
|
|||
|
|
</view>
|
|||
|
|
<view class="form-item-wrap">
|
|||
|
|
<u-form-item :label="$tt('sceneDetail.delayed ')" prop="more.executeDelay">
|
|||
|
|
<u-input v-model="more.executeDelay" border="none" type="number" inputAlign="right"
|
|||
|
|
:placeholder="$tt('sceneDetail.inputExtensionTime')" clearable>
|
|||
|
|
<u--text :text="$tt('sceneDetail.seconds')" slot="suffix" margin="0 0 0 6rpx"
|
|||
|
|
type="tips"></u--text>
|
|||
|
|
</u-input>
|
|||
|
|
</u-form-item>
|
|||
|
|
</view>
|
|||
|
|
</u--form>
|
|||
|
|
</view>
|
|||
|
|
<u-button type="primary" @click="handleConfirmMore">{{$tt('sceneDetail.complete')}}</u-button>
|
|||
|
|
</view>
|
|||
|
|
</u-popup>
|
|||
|
|
|
|||
|
|
<u-popup :show="isTrigger" :round="5" mode="bottom" :closeOnClickOverlay="true" @close="isTrigger = false">
|
|||
|
|
<view class="trigger-popup-wrap">
|
|||
|
|
<view class="title">{{$tt('sceneDetail.addConditions')}}</view>
|
|||
|
|
<view class="cell-group-wrap">
|
|||
|
|
<u-cell-group :border="false">
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('sceneDetail.deviceTriggered')" icon="/static/scene/device.png"
|
|||
|
|
:iconStyle="{ marginRight: '10rpx' }" :border="false" isLink
|
|||
|
|
@click="goToDeviceList('trigger')"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell-wrap" v-if="deptId!=null">
|
|||
|
|
<u-cell :title="$tt('sceneDetail.productTriggering')" icon="/static/scene/product.png"
|
|||
|
|
:iconStyle="{ marginRight: '10rpx' }" :border="false" isLink
|
|||
|
|
@click="goToProductList('trigger')"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('sceneDetail.timedTrigger')" icon="/static/scene/timing.png"
|
|||
|
|
:iconStyle="{ marginRight: '10rpx' }" :border="false" isLink
|
|||
|
|
@click="goToTimingList('trigger')"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
</u-cell-group>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</u-popup>
|
|||
|
|
|
|||
|
|
<u-popup :show="isAction" :round="5" mode="bottom" :closeOnClickOverlay="true" @close="isAction = false">
|
|||
|
|
<view class="trigger-popup-wrap">
|
|||
|
|
<view class="title">{{$tt('sceneDetail.addTask')}}</view>
|
|||
|
|
<view class="cell-group-wrap">
|
|||
|
|
<u-cell-group :border="false">
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('sceneDetail.deviceExecution')" icon="/static/scene/device.png"
|
|||
|
|
:iconStyle="{ marginRight: '10rpx' }" :border="false" isLink
|
|||
|
|
@click="goToDeviceList('action')"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell-wrap" v-if="deptId!=null">
|
|||
|
|
<u-cell :title="$tt('sceneDetail.productExecution')" icon="/static/scene/product.png"
|
|||
|
|
:iconStyle="{ marginRight: '10rpx' }" :border="false" isLink
|
|||
|
|
@click="goToProductList('action')"></u-cell>
|
|||
|
|
</view>
|
|||
|
|
<view class="cell-wrap">
|
|||
|
|
<u-cell :title="$tt('sceneDetail.alertExecute')" icon="/static/scene/alarm.png"
|
|||
|
|
:iconStyle="{ marginRight: '10rpx' }" :border="false"
|
|||
|
|
@click="goToWarningList('action')" isLink></u-cell>
|
|||
|
|
</view>
|
|||
|
|
</u-cell-group>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</u-popup>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
getScene,
|
|||
|
|
addScene,
|
|||
|
|
updateScene
|
|||
|
|
} from '@/apis/modules/scene.js';
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
sceneId: null,
|
|||
|
|
isCond: false,
|
|||
|
|
isMore: false,
|
|||
|
|
isTrigger: false,
|
|||
|
|
isAction: false,
|
|||
|
|
deptId: null,
|
|||
|
|
// 更多设置
|
|||
|
|
more: {
|
|||
|
|
silentPeriod: 0,
|
|||
|
|
executeMode: 1,
|
|||
|
|
executeDelay: 0
|
|||
|
|
},
|
|||
|
|
swipeOptions: [{
|
|||
|
|
text: this.$tt('common.delete'),
|
|||
|
|
style: {
|
|||
|
|
backgroundColor: '#f56c6c'
|
|||
|
|
}
|
|||
|
|
}],
|
|||
|
|
checkDelay:0,
|
|||
|
|
sceneData: {
|
|||
|
|
triggers: [],
|
|||
|
|
actions: [],
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
onLoad(option) {
|
|||
|
|
this.deptId = this.profile.deptId;
|
|||
|
|
this.sceneId = Number(option.sceneId);
|
|||
|
|
if (this.sceneId) {
|
|||
|
|
this.getDetail();
|
|||
|
|
} else {
|
|||
|
|
this.sceneData = uni.getStorageSync('sceneData');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
const callback = uni.getStorageSync('callback');
|
|||
|
|
if (callback) {
|
|||
|
|
this.sceneData = uni.getStorageSync('sceneData');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onHide() {
|
|||
|
|
// 页面隐藏时关闭弹框
|
|||
|
|
this.isTrigger = false;
|
|||
|
|
this.isAction = false;
|
|||
|
|
// 保存当前页面数据
|
|||
|
|
uni.setStorageSync('sceneData', this.sceneData);
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
// 获取一键任务详情
|
|||
|
|
getDetail() {
|
|||
|
|
getScene(this.sceneId).then(res => {
|
|||
|
|
if (res.code === 200) {
|
|||
|
|
this.sceneData = {
|
|||
|
|
...res.data
|
|||
|
|
};
|
|||
|
|
uni.setStorageSync('sceneData', this.sceneData);
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: res.msg
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}).catch(err => {
|
|||
|
|
console.log('场景详情:', err);
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 获取条件
|
|||
|
|
getCondName(cond) {
|
|||
|
|
if (cond === 1) {
|
|||
|
|
return this.$tt('scene.anyCondition')
|
|||
|
|
} else if (cond === 2) {
|
|||
|
|
return this.$tt('scene.allCondition')
|
|||
|
|
} else if (cond === 3) {
|
|||
|
|
return this.$tt('scene.notConditions')
|
|||
|
|
} else {
|
|||
|
|
return this.$tt('scene.unknown')
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//判断输入延时匹配条件
|
|||
|
|
onInput(event) {
|
|||
|
|
let value = event;
|
|||
|
|
if (value > 600) {
|
|||
|
|
this.checkDelay = '600';
|
|||
|
|
} else if (value < 0) {
|
|||
|
|
this.checkDelay = '0';
|
|||
|
|
}
|
|||
|
|
this.sceneData.checkDelay=this.checkDelay;
|
|||
|
|
},
|
|||
|
|
// 确认选择条件
|
|||
|
|
handleConfirmCond({
|
|||
|
|
name
|
|||
|
|
}) {
|
|||
|
|
if (name !== 'cancel') {
|
|||
|
|
this.sceneData.cond = name;
|
|||
|
|
}
|
|||
|
|
this.isCond = false;
|
|||
|
|
},
|
|||
|
|
// 更多设置
|
|||
|
|
handleMore() {
|
|||
|
|
const sceneData = uni.getStorageSync('sceneData');
|
|||
|
|
const {
|
|||
|
|
silentPeriod,
|
|||
|
|
executeMode,
|
|||
|
|
executeDelay
|
|||
|
|
} = sceneData;
|
|||
|
|
this.more = {
|
|||
|
|
silentPeriod,
|
|||
|
|
executeMode,
|
|||
|
|
executeDelay
|
|||
|
|
};
|
|||
|
|
this.isMore = true;
|
|||
|
|
},
|
|||
|
|
// 确认选择更多
|
|||
|
|
handleConfirmMore() {
|
|||
|
|
const {
|
|||
|
|
silentPeriod,
|
|||
|
|
executeMode,
|
|||
|
|
executeDelay
|
|||
|
|
} = this.more;
|
|||
|
|
let sceneData = uni.getStorageSync('sceneData');
|
|||
|
|
sceneData = {
|
|||
|
|
...sceneData,
|
|||
|
|
silentPeriod,
|
|||
|
|
executeMode,
|
|||
|
|
executeDelay
|
|||
|
|
};
|
|||
|
|
uni.setStorageSync('sceneData', sceneData);
|
|||
|
|
this.sceneData = {
|
|||
|
|
...sceneData
|
|||
|
|
};
|
|||
|
|
this.isMore = false;
|
|||
|
|
},
|
|||
|
|
// 添加条件触发器
|
|||
|
|
handleAddTrigger() {
|
|||
|
|
this.isTrigger = true;
|
|||
|
|
},
|
|||
|
|
// 添加执行动作
|
|||
|
|
handleAddAction() {
|
|||
|
|
this.isAction = true;
|
|||
|
|
},
|
|||
|
|
// 设备触发，租户
|
|||
|
|
goToDeviceList(type) {
|
|||
|
|
this.setSourceData(type, 1);
|
|||
|
|
uni.$u.route('/pagesA/scene/product/index', {
|
|||
|
|
type: type
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 设备触发，终端用户
|
|||
|
|
goToDeviceListTerminal(type) {
|
|||
|
|
this.setSourceData(type, 1);
|
|||
|
|
uni.$u.route('/pagesA/scene/product/device', {
|
|||
|
|
type: type
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 产品触发
|
|||
|
|
goToProductList(type) {
|
|||
|
|
this.setSourceData(type, 3);
|
|||
|
|
uni.$u.route('/pagesA/scene/product/index', {
|
|||
|
|
type: type
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 定时
|
|||
|
|
goToTimingList(type) {
|
|||
|
|
this.setSourceData(type, 2);
|
|||
|
|
uni.$u.route('/pagesA/scene/timing/index', {
|
|||
|
|
type: type
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 告警列表
|
|||
|
|
goToWarningList(type) {
|
|||
|
|
this.setSourceData(type, 4);
|
|||
|
|
uni.$u.route('/pagesA/scene/warning/index');
|
|||
|
|
},
|
|||
|
|
// 获取设备图片
|
|||
|
|
getImageUrl(item) {
|
|||
|
|
if (item.source === 1) {
|
|||
|
|
return '/static/scene/device.png';
|
|||
|
|
} else if (item.source === 2) {
|
|||
|
|
return '/static/scene/timing.png';
|
|||
|
|
} else if (item.source === 3) {
|
|||
|
|
return '/static/scene/product.png';
|
|||
|
|
} else if (item.source === 4) {
|
|||
|
|
return '/static/scene/alarm.png';
|
|||
|
|
} else {
|
|||
|
|
return '';
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 删除触发、执行项
|
|||
|
|
handleDeleteSceneItem(type, index) {
|
|||
|
|
const {
|
|||
|
|
triggers,
|
|||
|
|
actions
|
|||
|
|
} = this.sceneData;
|
|||
|
|
if (type === 'trigger') {
|
|||
|
|
const list = triggers.filter((item, i) => i !== index);
|
|||
|
|
this.sceneData = {
|
|||
|
|
...this.sceneData,
|
|||
|
|
triggers: [...list]
|
|||
|
|
};
|
|||
|
|
} else {
|
|||
|
|
const list = actions.filter((item, i) => i !== index);
|
|||
|
|
this.sceneData = {
|
|||
|
|
...this.sceneData,
|
|||
|
|
actions: [...list]
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 编辑触发、执行项, 小程序转换问题，所以用对象传进来
|
|||
|
|
handleEditSceneItem(val) {
|
|||
|
|
const storage = uni.getStorageSync(val.type);
|
|||
|
|
if (storage) {
|
|||
|
|
uni.removeStorageSync(val.type);
|
|||
|
|
}
|
|||
|
|
uni.setStorageSync(val.type, val.item);
|
|||
|
|
uni.removeStorageSync('callback');
|
|||
|
|
if (val.item.type === 5 || val.item.type === 6) {
|
|||
|
|
if (val.item.source === 1) {
|
|||
|
|
uni.$u.route('/pagesA/scene/product/device', {
|
|||
|
|
type: val.type,
|
|||
|
|
editIndex: val.index
|
|||
|
|
});
|
|||
|
|
} else if (val.item.source === 3) {
|
|||
|
|
uni.$u.route('/pagesA/scene/product/index', {
|
|||
|
|
type: val.type,
|
|||
|
|
editIndex: val.index
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
if (val.item.source === 1 || val.item.source === 3) {
|
|||
|
|
uni.$u.route('/pagesA/scene/product/model', {
|
|||
|
|
type: val.type,
|
|||
|
|
editIndex: val.index
|
|||
|
|
});
|
|||
|
|
} else if (val.item.source === 2) {
|
|||
|
|
uni.$u.route('/pagesA/scene/timing/index', {
|
|||
|
|
type: val.type,
|
|||
|
|
editIndex: val.index
|
|||
|
|
});
|
|||
|
|
} else if (val.item.source === 4) {
|
|||
|
|
uni.$u.route('/pagesA/scene/warning/index', {
|
|||
|
|
editIndex: val.index
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 保存
|
|||
|
|
handleSave() {
|
|||
|
|
const {
|
|||
|
|
sceneId,
|
|||
|
|
sceneName,
|
|||
|
|
triggers,
|
|||
|
|
actions
|
|||
|
|
} = this.sceneData;
|
|||
|
|
this.sceneData.checkDelay=this.checkDelay;
|
|||
|
|
if (!sceneName) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: this.$tt('sceneDetail.sceneValidate'),
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
};
|
|||
|
|
if (triggers.length === 0) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: this.$tt('sceneDetail.triggerValidate'),
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
};
|
|||
|
|
if (actions.length === 0) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: this.$tt('sceneDetail.taskValidate'),
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
};
|
|||
|
|
if (sceneId) {
|
|||
|
|
updateScene(this.sceneData).then(res => {
|
|||
|
|
if (res.code === 200) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: this.$tt('common.updateSuccessful'),
|
|||
|
|
});
|
|||
|
|
uni.reLaunch({
|
|||
|
|
url: '/pages/tabBar/scene/index'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
addScene(this.sceneData).then(res => {
|
|||
|
|
if (res.code === 200) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: this.$tt('common.addSuccessful'),
|
|||
|
|
});
|
|||
|
|
uni.reLaunch({
|
|||
|
|
url: '/pages/tabBar/scene/index'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
getKey(index, item) {
|
|||
|
|
return `${index}-${item.id}`
|
|||
|
|
},
|
|||
|
|
// 存储条件、动作来源
|
|||
|
|
setSourceData(type, source) {
|
|||
|
|
let trigger = {
|
|||
|
|
id: '',
|
|||
|
|
name: '',
|
|||
|
|
operator: '',
|
|||
|
|
value: '',
|
|||
|
|
parentId: '', // 父类id
|
|||
|
|
parentName: '', // 父类名称
|
|||
|
|
arrayIndex: '', // 索引
|
|||
|
|
arrayIndexName: '', // 索引名称
|
|||
|
|
productId: null,
|
|||
|
|
productName: '',
|
|||
|
|
deviceCount: 0, // 设备数量
|
|||
|
|
deviceNums: [], // 设备编号
|
|||
|
|
isAdvance: 0, // 自定义cron
|
|||
|
|
cronExpression: '', // cron表达式
|
|||
|
|
source: 1, // 1=设备，2=定时，3=产品
|
|||
|
|
type: 1, // 1=属性，2=功能，3=事件
|
|||
|
|
scriptPurpose: 2, // 脚本用途（1=数据流，2=触发器，3=执行动作）
|
|||
|
|
};
|
|||
|
|
let action = {
|
|||
|
|
id: '',
|
|||
|
|
name: '',
|
|||
|
|
value: '',
|
|||
|
|
parentId: '',
|
|||
|
|
parentName: '',
|
|||
|
|
arrayIndex: '',
|
|||
|
|
arrayIndexName: '',
|
|||
|
|
productId: '',
|
|||
|
|
productName: '',
|
|||
|
|
deviceCount: 0,
|
|||
|
|
deviceNums: [],
|
|||
|
|
source: 1,
|
|||
|
|
type: 1,
|
|||
|
|
scriptPurpose: 3,
|
|||
|
|
};
|
|||
|
|
const storage = uni.getStorageSync(type);
|
|||
|
|
if (storage) {
|
|||
|
|
uni.removeStorageSync(type);
|
|||
|
|
}
|
|||
|
|
if (type === 'trigger') {
|
|||
|
|
trigger = {
|
|||
|
|
...trigger,
|
|||
|
|
source
|
|||
|
|
};
|
|||
|
|
uni.setStorageSync('trigger', trigger);
|
|||
|
|
} else {
|
|||
|
|
action = {
|
|||
|
|
...action,
|
|||
|
|
source
|
|||
|
|
};
|
|||
|
|
uni.setStorageSync('action', action);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
page {
|
|||
|
|
height: 100%;
|
|||
|
|
background: #eef3f7;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.scene-detail-wrap {
|
|||
|
|
height: 100%;
|
|||
|
|
width: 100%;
|
|||
|
|
position: relative;
|
|||
|
|
|
|||
|
|
.name-wrap {
|
|||
|
|
margin: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.container-wrap {
|
|||
|
|
padding-bottom: 140rpx;
|
|||
|
|
|
|||
|
|
.cell-group-wrap {
|
|||
|
|
margin: 30rpx;
|
|||
|
|
|
|||
|
|
.cell-wrap {
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.condition-wrap,
|
|||
|
|
.execute-wrap {
|
|||
|
|
margin: 30rpx;
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
padding-bottom: 12rpx;
|
|||
|
|
|
|||
|
|
.title-wrap {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
padding: 30rpx;
|
|||
|
|
|
|||
|
|
.left-wrap {
|
|||
|
|
flex: 1;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
font-size: 18px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.right-wrap {}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.empty-cell {
|
|||
|
|
padding: 30rpx;
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
height: 92rpx;
|
|||
|
|
border: 2rpx dashed #8686862e;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.swipe-action-wrap {
|
|||
|
|
.action-item-wrap {
|
|||
|
|
|
|||
|
|
&:not(:last-child) {
|
|||
|
|
border-bottom: 2rpx solid #eaeefb;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.slot-title {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.cell-text {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-left: 24rpx;
|
|||
|
|
min-height: 124rpx;
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.des {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #868686;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn-wrap {
|
|||
|
|
padding: 0 28rpx;
|
|||
|
|
margin-top: 30rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn-save-wrap {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
z-index: 999;
|
|||
|
|
padding: 30rpx 26rpx 40rpx;
|
|||
|
|
background: #eef3f7f7;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.other {
|
|||
|
|
.cond-popup-wrap {
|
|||
|
|
padding: 10rpx 0 20rpx;
|
|||
|
|
|
|||
|
|
.cell-group-wrap {
|
|||
|
|
background: #eef3f7;
|
|||
|
|
|
|||
|
|
.cell-wrap {
|
|||
|
|
text-align: center;
|
|||
|
|
background: #fff;
|
|||
|
|
|
|||
|
|
&:last-child {
|
|||
|
|
margin-top: 15rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.more-popup-wrap {
|
|||
|
|
margin: 30rpx;
|
|||
|
|
|
|||
|
|
.remark {
|
|||
|
|
color: #868686;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.form-wrap {
|
|||
|
|
margin: 30rpx 0;
|
|||
|
|
|
|||
|
|
.form-item-wrap {
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
padding: 4rpx 30rpx;
|
|||
|
|
margin: 20rpx 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.trigger-popup-wrap {
|
|||
|
|
padding: 30rpx;
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
margin-bottom: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cell-group-wrap {
|
|||
|
|
.cell-wrap {
|
|||
|
|
padding: 6rpx 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|