Merge branch 'dev' of github.com:jetlinks/jetlinks-ui-vue into dev
This commit is contained in:
easy
commit
f245461c68
|
|
@ -16,6 +16,9 @@ export default {
|
|||
// 删除
|
||||
del: (id: string) => server.remove(`/media/channel/${id}`),
|
||||
|
||||
// 查询树形数据
|
||||
queryTree: (id: string, data?: any) => server.post(`/media/device/${id}/catalog/_query/tree`, data),
|
||||
|
||||
// ========== 视频播放 ==========
|
||||
// 开始直播
|
||||
ptzStart: (deviceId: string, channelId: string, type: string) =>
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
<a-table :columns="columns" :data-source="property" :pagination="false" bordered size="small">
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.key === 'id'">
|
||||
<a-input v-model:value="record.id" size="small"></a-input>
|
||||
<j-auto-complete :options="options" v-model:value="record.id" size="small" width="130px"/>
|
||||
</template>
|
||||
<template v-if="column.key === 'current'">
|
||||
<a-input v-model:value="record.current" size="small"></a-input>
|
||||
|
|
@ -58,8 +58,8 @@
|
|||
</div>
|
||||
<div class="log">
|
||||
<a-descriptions>
|
||||
<a-descriptions-item v-for="item in ruleEditorStore.state.log" :label="moment(item.time).format('HH:mm:ss')" :key="item.time"
|
||||
:span="3">
|
||||
<a-descriptions-item v-for="item in ruleEditorStore.state.log" :label="moment(item.time).format('HH:mm:ss')"
|
||||
:key="item.time" :span="3">
|
||||
<a-tooltip placement="top" :title="item.content">
|
||||
{{ item.content }}
|
||||
</a-tooltip>
|
||||
|
|
@ -78,6 +78,7 @@ import { message } from 'ant-design-vue';
|
|||
import { useRuleEditorStore } from '@/store/ruleEditor';
|
||||
import moment from 'moment';
|
||||
import { getWebSocket } from '@/utils/websocket';
|
||||
import { PropertyMetadata } from '@/views/device/Product/typings';
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
|
|
@ -143,17 +144,17 @@ const runScript = () => {
|
|||
return;
|
||||
}
|
||||
ws.value = getWebSocket(`virtual-property-debug-${props.id}-${new Date().getTime()}`,
|
||||
'/virtual-property-debug',
|
||||
{
|
||||
virtualId: `${virtualIdRef.value}-virtual-id`,
|
||||
property: props.id,
|
||||
virtualRule: {
|
||||
...props.virtualRule,
|
||||
},
|
||||
properties: _properties || [],
|
||||
})
|
||||
'/virtual-property-debug',
|
||||
{
|
||||
virtualId: `${virtualIdRef.value}-virtual-id`,
|
||||
property: props.id,
|
||||
virtualRule: {
|
||||
...props.virtualRule,
|
||||
},
|
||||
properties: _properties || [],
|
||||
})
|
||||
ws.value.subscribe((data: any) => {
|
||||
ruleEditorStore.state.log.push({ time: new Date().getTime(), content: JSON.stringify(data.payload) });
|
||||
ruleEditorStore.state.log.push({ time: new Date().getTime(), content: JSON.stringify(data.payload) });
|
||||
})
|
||||
}
|
||||
const beginAction = () => {
|
||||
|
|
@ -175,6 +176,18 @@ onUnmounted(() => {
|
|||
ws.value.unsubscribe?.();
|
||||
}
|
||||
})
|
||||
|
||||
const options = ref<{ label: string, value: string }[]>()
|
||||
const getProperty = () => {
|
||||
const metadata = productStore.current.metadata || '{}';
|
||||
const _p: PropertyMetadata[] = JSON.parse(metadata).properties || [];
|
||||
options.value = _p.filter((p) => p.id !== props.id).map((item) => ({
|
||||
label: item.name,
|
||||
value: item.id,
|
||||
}));
|
||||
console.log(options.value)
|
||||
}
|
||||
getProperty()
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.debug-container {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,99 @@
|
|||
<template>
|
||||
<div class="channel-tree">
|
||||
<div class="channel-tree-query">
|
||||
<j-input
|
||||
@change="debounce(queryTree, 300)"
|
||||
placeholder="请输入目录名称"
|
||||
>
|
||||
<template #suffix>
|
||||
<AIcon type="SearchOutlined" />
|
||||
</template>
|
||||
</j-input>
|
||||
</div>
|
||||
<div class="channel-tree-content">
|
||||
<j-tree
|
||||
:height="500"
|
||||
:selectedKeys="selectedKeys"
|
||||
:treeData="treeData"
|
||||
:onSelect="(keys:any) => {
|
||||
if (keys.length) {
|
||||
selectedKeys = keys
|
||||
if (props.onSelect) {
|
||||
props.onSelect(keys[0]);
|
||||
}
|
||||
}
|
||||
}"
|
||||
:fieldNames="{ key: 'id', title: 'name' }"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { debounce } from 'lodash';
|
||||
import ChannelApi from '@/api/media/channel';
|
||||
import DeviceApi from '@/api/media/device';
|
||||
|
||||
interface TreeProps {
|
||||
deviceId: string;
|
||||
onSelect: (id: string) => void;
|
||||
onTreeLoad: (type: boolean) => void;
|
||||
}
|
||||
|
||||
const props = defineProps<TreeProps>();
|
||||
|
||||
const treeData = ref<any[]>([]);
|
||||
const selectedKeys = ref<string[]>([]);
|
||||
|
||||
const getTreeData = async (id: string, data?: any) => {
|
||||
const { result } = await ChannelApi.queryTree(id, data);
|
||||
treeData.value[0].children = result || [];
|
||||
props.onTreeLoad(treeData.value[0].children.length > 10);
|
||||
treeData.value = treeData.value;
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取设备详情
|
||||
* @param id
|
||||
*/
|
||||
const getDeviceDetail = async (id: string) => {
|
||||
const deviceResp = await DeviceApi.detail(id);
|
||||
if (deviceResp.status === 200) {
|
||||
treeData.value = [
|
||||
{
|
||||
id,
|
||||
name: deviceResp.result.name,
|
||||
children: [],
|
||||
},
|
||||
];
|
||||
selectedKeys.value = [id];
|
||||
getTreeData(props.deviceId, {});
|
||||
}
|
||||
};
|
||||
|
||||
const queryTree = (e: any) => {
|
||||
getTreeData(props.deviceId, {
|
||||
terms: [
|
||||
{ column: 'name', termType: 'like', value: `%${e.target.value}%` },
|
||||
],
|
||||
});
|
||||
};
|
||||
|
||||
watchEffect(() => {
|
||||
getDeviceDetail(props.deviceId);
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.channel-tree {
|
||||
height: 100%;
|
||||
|
||||
.channel-tree-query {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.channel-tree-content {
|
||||
min-height: calc(100% - 50px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
.device-channel-warp {
|
||||
display: flex;
|
||||
|
||||
.left-warp {
|
||||
position: relative;
|
||||
margin-right: 16px;
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border-radius: 2px;
|
||||
|
||||
.left-content {
|
||||
width: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
&.active {
|
||||
width: 260px;
|
||||
}
|
||||
}
|
||||
|
||||
.left-warp--btn {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
padding: 20px 4px;
|
||||
color: rgba(#000, 0.3);
|
||||
background-color: rgba(#f0f0f0, 6);
|
||||
border-radius: ~'100% 0 0 100% / 50% 0 0 50%';
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: rgba(#000, 0.5);
|
||||
background-color: rgba(#f0f0f0, 8);
|
||||
}
|
||||
|
||||
&.active {
|
||||
right: 50%;
|
||||
background-color: transparent;
|
||||
border-radius: 0;
|
||||
transform: translateX(50%) rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,82 +1,102 @@
|
|||
<!-- 视频设备-通道列表 -->
|
||||
<template>
|
||||
<page-container>
|
||||
<j-advanced-search
|
||||
type="simple"
|
||||
:columns="columns"
|
||||
target="product"
|
||||
@search="handleSearch"
|
||||
/>
|
||||
|
||||
<JProTable
|
||||
ref="listRef"
|
||||
:columns="columns"
|
||||
:request="(e:any) => ChannelApi.list(e, route?.query.id as string)"
|
||||
:defaultParams="{
|
||||
sorts: [{ name: 'notifyTime', order: 'desc' }],
|
||||
}"
|
||||
:params="params"
|
||||
model="table"
|
||||
>
|
||||
<template #headerTitle>
|
||||
<j-tooltip
|
||||
v-if="route?.query.type === 'gb28181-2016'"
|
||||
title="接入方式为GB/T28281时，不支持新增"
|
||||
<div class="device-channel-warp">
|
||||
<div class="left-warp" v-if="route.query.type === 'gb28181-2016'">
|
||||
<div class="left-content" :class="{ active: show }">
|
||||
<Tree
|
||||
:deviceId="deviceId"
|
||||
:on-tree-load="(e) => (show = e)"
|
||||
:on-select="handleSelect"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="left-warp--btn"
|
||||
:class="{ active: !show }"
|
||||
@click="show = !show"
|
||||
>
|
||||
<j-button type="primary" disabled> 新增 </j-button>
|
||||
</j-tooltip>
|
||||
<j-button type="primary" @click="handleAdd" v-else>
|
||||
新增
|
||||
</j-button>
|
||||
</template>
|
||||
<template #status="slotProps">
|
||||
<j-space>
|
||||
<j-badge
|
||||
:status="
|
||||
slotProps.status.value === 'online'
|
||||
? 'success'
|
||||
: 'error'
|
||||
"
|
||||
:text="slotProps.status.text"
|
||||
></j-badge>
|
||||
</j-space>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<j-space :size="16">
|
||||
<j-tooltip
|
||||
v-for="i in getActions(slotProps, 'table')"
|
||||
:key="i.key"
|
||||
v-bind="i.tooltip"
|
||||
>
|
||||
<j-popconfirm
|
||||
v-if="i.popConfirm"
|
||||
v-bind="i.popConfirm"
|
||||
:disabled="i.disabled"
|
||||
<AIcon type="LeftOutlined" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<j-advanced-search
|
||||
type="simple"
|
||||
:columns="columns"
|
||||
target="product"
|
||||
@search="handleSearch"
|
||||
/>
|
||||
|
||||
<JProTable
|
||||
ref="listRef"
|
||||
:columns="columns"
|
||||
:request="(e:any) => ChannelApi.list(e, route?.query.id as string)"
|
||||
:defaultParams="{
|
||||
sorts: [{ name: 'notifyTime', order: 'desc' }],
|
||||
}"
|
||||
:params="params"
|
||||
model="table"
|
||||
>
|
||||
<template #headerTitle>
|
||||
<j-tooltip
|
||||
v-if="route?.query.type === 'gb28181-2016'"
|
||||
title="接入方式为GB/T28281时，不支持新增"
|
||||
>
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></j-button>
|
||||
</j-popconfirm>
|
||||
<j-button
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
v-else
|
||||
@click="i.onClick && i.onClick(slotProps)"
|
||||
>
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></j-button>
|
||||
<j-button type="primary" disabled> 新增 </j-button>
|
||||
</j-tooltip>
|
||||
<j-button type="primary" @click="handleAdd" v-else>
|
||||
新增
|
||||
</j-button>
|
||||
</j-tooltip>
|
||||
</j-space>
|
||||
</template>
|
||||
</JProTable>
|
||||
</template>
|
||||
<template #status="slotProps">
|
||||
<j-space>
|
||||
<j-badge
|
||||
:status="
|
||||
slotProps.status.value === 'online'
|
||||
? 'success'
|
||||
: 'error'
|
||||
"
|
||||
:text="slotProps.status.text"
|
||||
></j-badge>
|
||||
</j-space>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<j-space :size="16">
|
||||
<j-tooltip
|
||||
v-for="i in getActions(slotProps, 'table')"
|
||||
:key="i.key"
|
||||
v-bind="i.tooltip"
|
||||
>
|
||||
<j-popconfirm
|
||||
v-if="i.popConfirm"
|
||||
v-bind="i.popConfirm"
|
||||
:disabled="i.disabled"
|
||||
>
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></j-button>
|
||||
</j-popconfirm>
|
||||
<j-button
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
v-else
|
||||
@click="i.onClick && i.onClick(slotProps)"
|
||||
>
|
||||
<j-button
|
||||
:disabled="i.disabled"
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
><AIcon :type="i.icon"
|
||||
/></j-button>
|
||||
</j-button>
|
||||
</j-tooltip>
|
||||
</j-space>
|
||||
</template>
|
||||
</JProTable>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Save
|
||||
v-model:visible="saveVis"
|
||||
|
|
@ -94,7 +114,9 @@ import { useMenuStore } from 'store/menu';
|
|||
import { message } from 'ant-design-vue';
|
||||
import Save from './Save.vue';
|
||||
import Live from './Live/index.vue';
|
||||
import Tree from './Tree/index.vue';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import { useElementSize } from '@vueuse/core';
|
||||
|
||||
const menuStory = useMenuStore();
|
||||
const route = useRoute();
|
||||
|
|
@ -253,4 +275,25 @@ const getActions = (
|
|||
? actions.filter((f) => f.key !== 'delete')
|
||||
: actions;
|
||||
};
|
||||
|
||||
// 左侧树
|
||||
const show = ref(false);
|
||||
const deviceId = computed(() => route.query.id as string);
|
||||
const handleSelect = (key: string) => {
|
||||
if (key === deviceId.value && listRef.value?.reload) {
|
||||
listRef.value?.reload();
|
||||
} else {
|
||||
params.value = {
|
||||
terms: [
|
||||
{
|
||||
column: 'parentId',
|
||||
value: key,
|
||||
},
|
||||
],
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import './index.less';
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -257,9 +257,7 @@ const columns = [
|
|||
* @param params
|
||||
*/
|
||||
const handleSearch = (e: any) => {
|
||||
console.log('handleSearch:', e);
|
||||
params.value = e;
|
||||
console.log('params.value: ', params.value);
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -1,18 +1,35 @@
|
|||
<template>
|
||||
<div>
|
||||
<Action :thenOptions="data.branches ? data?.branches[0].then : []" :name="0" />
|
||||
<Action
|
||||
:thenOptions="data.branches ? data?.branches[0].then : []"
|
||||
:name="0"
|
||||
@add="onActionAdd"
|
||||
@update="onActionUpdate"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useSceneStore } from '@/store/scene'
|
||||
import Action from '../action/index.vue'
|
||||
import { useSceneStore } from '@/store/scene';
|
||||
import Action from '../action/index.vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { ActionsType } from '@/components/Table';
|
||||
|
||||
const sceneStore = useSceneStore()
|
||||
const { data } = storeToRefs(sceneStore)
|
||||
const sceneStore = useSceneStore();
|
||||
const { data } = storeToRefs(sceneStore);
|
||||
|
||||
const onActionAdd = (_data: ActionsType) => {
|
||||
console.log(_data)
|
||||
// if (data?.branches && _data) {
|
||||
// const newThen = [...data?.branches?.[0].then, data];
|
||||
// data.branches[0].then = newThen;
|
||||
// }
|
||||
};
|
||||
|
||||
const onActionUpdate = (_data: ActionsType, type: boolean) => {
|
||||
console.log(_data, type)
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -8,12 +8,20 @@
|
|||
>
|
||||
<template #bodyCell="{ column, text, record }">
|
||||
<div>
|
||||
<template v-if="['valueType', 'name'].includes(column.dataIndex)">
|
||||
<template
|
||||
v-if="['valueType', 'name'].includes(column.dataIndex)"
|
||||
>
|
||||
<span>{{ text }}</span>
|
||||
</template>
|
||||
<template v-else>
|
||||
<j-input />
|
||||
<!-- TODO -->
|
||||
<ParamsDropdown
|
||||
icon="icon-canshu"
|
||||
placeholder="请选择"
|
||||
:options="[]"
|
||||
:tabsOptions="tabOptions"
|
||||
:metricOption="upperOptions(record.valueType)"
|
||||
v-model:value="record.value"
|
||||
/>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -21,7 +29,8 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { PropType } from "vue";
|
||||
import { PropType } from 'vue';
|
||||
import ParamsDropdown from '../../../components/ParamsDropdown';
|
||||
|
||||
type Emits = {
|
||||
(e: 'update:modelValue', data: Record<string, any>[]): void;
|
||||
|
|
@ -31,9 +40,27 @@ const _emit = defineEmits<Emits>();
|
|||
const _props = defineProps({
|
||||
modelValue: {
|
||||
type: Array as PropType<Record<string, any>[]>,
|
||||
default: '',
|
||||
}
|
||||
default: () => undefined,
|
||||
},
|
||||
builtInList: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
|
||||
const tabOptions = [
|
||||
{
|
||||
label: '手动输入',
|
||||
component: 'string',
|
||||
key: 'fixed',
|
||||
},
|
||||
{
|
||||
label: '内置参数',
|
||||
component: 'tree',
|
||||
key: 'upper',
|
||||
},
|
||||
];
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: '参数名称',
|
||||
|
|
@ -54,11 +81,31 @@ const columns = [
|
|||
|
||||
const dataSource = computed({
|
||||
get: () => {
|
||||
return _props.modelValue || []
|
||||
return _props.modelValue || [];
|
||||
},
|
||||
set: (val: any) => {
|
||||
_emit('update:modelValue', val);
|
||||
}
|
||||
})
|
||||
},
|
||||
});
|
||||
|
||||
const filterParamsData = (type?: string, data?: any[]): any[] => {
|
||||
if (type && data) {
|
||||
return data.filter((item) => {
|
||||
if (item.children) {
|
||||
const _children = filterParamsData(type, item.children);
|
||||
item.children = _children;
|
||||
return _children.length ? true : false;
|
||||
} else if (item.type === type) {
|
||||
// optionMap.current.set(item.id, item);
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
}
|
||||
return data || [];
|
||||
};
|
||||
|
||||
const upperOptions = (_type: string) => {
|
||||
return filterParamsData(_type, _props?.builtInList) || [];
|
||||
};
|
||||
</script>
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-form :layout="'vertical'" ref="formRef" :model="modelRef">
|
||||
<j-row>
|
||||
<j-col :span="11">
|
||||
<j-form-item
|
||||
:name="['message', 'properties']"
|
||||
label="读取属性"
|
||||
:rules="[{ required: true, message: '请选择读取属性' }]"
|
||||
>
|
||||
<j-select
|
||||
showSearch
|
||||
placeholder="请选择属性"
|
||||
v-model:value="modelRef.properties"
|
||||
>
|
||||
<j-select-option
|
||||
v-for="item in metadata?.properties || []"
|
||||
:value="item?.id"
|
||||
:key="item?.id"
|
||||
>{{ item?.name }}</j-select-option
|
||||
>
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="2"></j-col>
|
||||
<j-col :span="11">
|
||||
<j-form-item
|
||||
:name="['message', 'propertiesValue']"
|
||||
label="属性值"
|
||||
:rules="[{ required: true, message: '请选择' }]"
|
||||
>
|
||||
<ParamsDropdown
|
||||
icon="icon-canshu"
|
||||
placeholder="请选择"
|
||||
:options="[]"
|
||||
:tabsOptions="tabOptions"
|
||||
:metricOption="upperOptions(getType)"
|
||||
v-model:value="modelRef.propertiesValue"
|
||||
/>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
</a-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
metadata: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
properties: [],
|
||||
};
|
||||
},
|
||||
},
|
||||
builtInList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
});
|
||||
|
||||
const formRef = ref();
|
||||
|
||||
const modelRef = reactive({
|
||||
properties: '',
|
||||
propertiesValue: '',
|
||||
source: '',
|
||||
});
|
||||
|
||||
const tabOptions = [
|
||||
{
|
||||
label: '手动输入',
|
||||
component: 'string',
|
||||
key: 'fixed',
|
||||
},
|
||||
{
|
||||
label: '内置参数',
|
||||
component: 'tree',
|
||||
key: 'upper',
|
||||
},
|
||||
];
|
||||
const getType = computed(() => {
|
||||
return props.metadata.properties.find((item: any) => item.id === modelRef.properties)?.valueType?.type
|
||||
})
|
||||
|
||||
const filterParamsData = (type?: string, data?: any[]): any[] => {
|
||||
if (type && data) {
|
||||
return data.filter((item) => {
|
||||
if (item.children) {
|
||||
const _children = filterParamsData(type, item.children);
|
||||
item.children = _children;
|
||||
return _children.length ? true : false;
|
||||
} else if (item.type === type) {
|
||||
// optionMap.current.set(item.id, item);
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
}
|
||||
return data || [];
|
||||
};
|
||||
|
||||
const upperOptions = (type: string) => {
|
||||
return filterParamsData(type, props?.builtInList) || []
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.value,
|
||||
(newVal) => {
|
||||
const _keys = Object.keys(newVal)?.[0];
|
||||
if (_keys) {
|
||||
(modelRef.properties = _keys),
|
||||
(modelRef.propertiesValue = newVal[_keys]?.value);
|
||||
modelRef.source = newVal[_keys]?.source;
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true },
|
||||
);
|
||||
|
||||
const onFormSave = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(async (_data: any) => {
|
||||
// 处理回传数据
|
||||
resolve(_data);
|
||||
})
|
||||
.catch((err: any) => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
defineExpose({ onFormSave });
|
||||
</script>
|
||||
|
|
@ -9,6 +9,7 @@
|
|||
<TopCard
|
||||
:typeList="TypeList"
|
||||
v-model:value="modelRef.message.messageType"
|
||||
@change="onMessageTypeChange"
|
||||
/>
|
||||
</j-form-item>
|
||||
<template v-if="deviceMessageType === 'INVOKE_FUNCTION'">
|
||||
|
|
@ -21,7 +22,7 @@
|
|||
showSearch
|
||||
placeholder="请选择功能"
|
||||
v-model:value="modelRef.message.functionId"
|
||||
@change="onFunctionChange"
|
||||
@change="(val) => onFunctionChange(val, [])"
|
||||
>
|
||||
<j-select-option
|
||||
v-for="item in metadata?.functions || []"
|
||||
|
|
@ -36,7 +37,7 @@
|
|||
:name="['message', 'inputs']"
|
||||
:rules="[{ required: true, message: '请输入功能值' }]"
|
||||
>
|
||||
<EditTable v-model="modelRef.message.inputs" />
|
||||
<EditTable v-model:modelValue="modelRef.message.inputs" :builtInList="builtInList" />
|
||||
</j-form-item>
|
||||
</template>
|
||||
<template v-else-if="deviceMessageType === 'READ_PROPERTY'">
|
||||
|
|
@ -60,44 +61,11 @@
|
|||
</j-form-item>
|
||||
</template>
|
||||
<template v-else-if="deviceMessageType === 'WRITE_PROPERTY'">
|
||||
<j-row>
|
||||
<j-col :span="11">
|
||||
<j-form-item
|
||||
:name="['message', 'properties']"
|
||||
label="读取属性"
|
||||
:rules="[
|
||||
{ required: true, message: '请选择读取属性' },
|
||||
]"
|
||||
>
|
||||
<j-select
|
||||
showSearch
|
||||
placeholder="请选择属性"
|
||||
v-model:value="modelRef.message.properties"
|
||||
>
|
||||
<j-select-option
|
||||
v-for="item in metadata?.properties || []"
|
||||
:value="item?.id"
|
||||
:key="item?.id"
|
||||
>{{ item?.name }}</j-select-option
|
||||
>
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
<j-col :span="2"></j-col>
|
||||
<j-col :span="11">
|
||||
<j-form-item
|
||||
:name="['message', 'properties']"
|
||||
label="读取属性"
|
||||
:rules="[
|
||||
{ required: true, message: '请选择读取属性' },
|
||||
]"
|
||||
>
|
||||
<j-select placeholder="请选择">
|
||||
<!-- TODO -->
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</j-col>
|
||||
</j-row>
|
||||
<WriteProperty
|
||||
v-model:value="modelRef.message.properties"
|
||||
:metadata="metadata"
|
||||
:builtInList="builtInList"
|
||||
/>
|
||||
</template>
|
||||
</a-form>
|
||||
</div>
|
||||
|
|
@ -108,6 +76,13 @@ import { getImage } from '@/utils/comm';
|
|||
import TopCard from '../device/TopCard.vue';
|
||||
import { detail } from '@/api/device/instance';
|
||||
import EditTable from './EditTable.vue';
|
||||
import WriteProperty from './WriteProperty.vue';
|
||||
import { queryBuiltInParams } from '@/api/rule-engine/scene';
|
||||
import { useSceneStore } from '@/store/scene';
|
||||
import { storeToRefs } from 'pinia'
|
||||
|
||||
const sceneStore = useSceneStore();
|
||||
const { data } = storeToRefs(sceneStore);
|
||||
|
||||
const TypeList = [
|
||||
{
|
||||
|
|
@ -172,44 +147,93 @@ const deviceMessageType = computed(() => {
|
|||
return modelRef.message.messageType;
|
||||
});
|
||||
|
||||
const onFunctionChange = (val: string) => {
|
||||
const builtInList = ref<any[]>([]);
|
||||
|
||||
const onFunctionChange = (val: string, values?: any[]) => {
|
||||
const _item = (metadata.value?.functions || []).find((item: any) => {
|
||||
return val === item.id;
|
||||
});
|
||||
const list = (_item?.inputs || []).map((item: any) => {
|
||||
const _a = values?.find((i) => i.name === item.id);
|
||||
return {
|
||||
id: item.id,
|
||||
name: item.name,
|
||||
value: undefined,
|
||||
value: _a?.value,
|
||||
valueType: item?.valueType?.type,
|
||||
..._a,
|
||||
name: item.name,
|
||||
};
|
||||
});
|
||||
modelRef.message.inputs = list;
|
||||
};
|
||||
|
||||
watchEffect(() => {
|
||||
// console.log(props.values)
|
||||
// console.log(metadata.value)
|
||||
// Object.assign()
|
||||
});
|
||||
const onMessageTypeChange = (val: string) => {
|
||||
if (['WRITE_PROPERTY', 'INVOKE_FUNCTION'].includes(val)) {
|
||||
const _params = {
|
||||
branch: props.thenName,
|
||||
branchGroup: props.branchGroup,
|
||||
action: props.name - 1,
|
||||
};
|
||||
queryBuiltInParams(unref(data), _params).then((res: any) => {
|
||||
if (res.status === 200) {
|
||||
builtInList.value = res.result
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
watch(
|
||||
() => [props.values?.productDetail, props.values.deviceDetail],
|
||||
([newVal1, newVal2]) => {
|
||||
if (newVal1) {
|
||||
if (props.values?.selector === 'fixed') {
|
||||
detail(newVal2.id).then((resp) => {
|
||||
if (resp.status === 200) {
|
||||
metadata.value = JSON.parse(
|
||||
resp.result?.metadata || '{}',
|
||||
);
|
||||
}
|
||||
});
|
||||
() => [
|
||||
props.values?.productDetail,
|
||||
props.values.selectorValues,
|
||||
props.values?.selector,
|
||||
],
|
||||
([newVal1, newVal2, newVal3]) => {
|
||||
if (newVal1?.id) {
|
||||
if (newVal3?.selector === 'fixed') {
|
||||
const id = newVal2?.[0]?.value;
|
||||
if (id) {
|
||||
detail(id).then((resp) => {
|
||||
if (resp.status === 200) {
|
||||
metadata.value = JSON.parse(
|
||||
resp.result?.metadata || '{}',
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
metadata.value = JSON.parse(newVal1?.metadata || '{}');
|
||||
}
|
||||
}
|
||||
},
|
||||
{ immediate: true, deep: true },
|
||||
);
|
||||
|
||||
watch(
|
||||
() => props.values?.message,
|
||||
(newVal) => {
|
||||
if (newVal?.messageType) {
|
||||
modelRef.message = newVal;
|
||||
if (newVal.messageType === 'INVOKE_FUNCTION' && newVal.functionId) {
|
||||
onFunctionChange(newVal.functionId, newVal?.inputs);
|
||||
}
|
||||
onMessageTypeChange(newVal.messageType)
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true },
|
||||
);
|
||||
|
||||
const onFormSave = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(async (_data: any) => {
|
||||
resolve(_data);
|
||||
})
|
||||
.catch((err: any) => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
defineExpose({ onFormSave });
|
||||
</script>
|
||||
|
|
@ -1,11 +1,11 @@
|
|||
<template>
|
||||
<!-- <j-advanced-search
|
||||
<j-advanced-search
|
||||
:columns="columns"
|
||||
type="simple"
|
||||
@search="handleSearch"
|
||||
class="search"
|
||||
target="scene-trigger-device-device"
|
||||
/> -->
|
||||
/>
|
||||
<a-divider style="margin: 0" />
|
||||
<j-pro-table
|
||||
ref="actionRef"
|
||||
|
|
|
|||
|
|
@ -61,6 +61,7 @@
|
|||
v-model:value="modelRef.selectorValues"
|
||||
placeholder="请选择参数"
|
||||
@select="onVariableChange"
|
||||
:fieldNames="{ label: 'name', value: 'id' }"
|
||||
>
|
||||
<template #title="{ name, description }">
|
||||
<a-space>
|
||||
|
|
@ -108,6 +109,7 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
// save保存deviceDetail
|
||||
const emits = defineEmits(['save', 'cancel']);
|
||||
|
||||
const sceneStore = useSceneStore();
|
||||
|
|
@ -122,6 +124,7 @@ const modelRef = reactive({
|
|||
source: '',
|
||||
relationName: '',
|
||||
upperKey: '',
|
||||
message: undefined,
|
||||
});
|
||||
|
||||
const list = ref<any[]>([]);
|
||||
|
|
@ -160,7 +163,7 @@ const filterTree = (nodes: any[]) => {
|
|||
if (!nodes?.length) {
|
||||
return nodes;
|
||||
}
|
||||
return nodes.filter((it) => {
|
||||
const arr = nodes.filter((it) => {
|
||||
if (
|
||||
it.children.find(
|
||||
(item: any) =>
|
||||
|
|
@ -173,43 +176,16 @@ const filterTree = (nodes: any[]) => {
|
|||
}
|
||||
return false;
|
||||
});
|
||||
};
|
||||
|
||||
const treeDataFilter = (arr: any[]) => {
|
||||
if (Array.isArray(arr) && arr.length) {
|
||||
const list: any[] = [];
|
||||
arr.map((item: any) => {
|
||||
if (item.children) {
|
||||
const children = treeDataFilter(item.children);
|
||||
if (children.length) {
|
||||
list.push({
|
||||
...item,
|
||||
title: item.name,
|
||||
value: item.id,
|
||||
disabled: true,
|
||||
children,
|
||||
});
|
||||
}
|
||||
} else {
|
||||
if (
|
||||
item.children.find(
|
||||
(item: any) =>
|
||||
item.id.indexOf(
|
||||
'deviceId' || 'device_id' || 'device_Id',
|
||||
) > -1,
|
||||
) &&
|
||||
!item.children.find(
|
||||
(item: any) => item.id.indexOf('bolaen') > -1,
|
||||
)
|
||||
) {
|
||||
list.push(item);
|
||||
}
|
||||
}
|
||||
});
|
||||
return list;
|
||||
} else {
|
||||
return [];
|
||||
}
|
||||
return arr.map((item) => {
|
||||
if (item.children) {
|
||||
}
|
||||
return {
|
||||
...item,
|
||||
title: item.name,
|
||||
value: item.id,
|
||||
disabled: !!item.children,
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
const sourceChangeEvent = async () => {
|
||||
|
|
@ -220,11 +196,9 @@ const sourceChangeEvent = async () => {
|
|||
};
|
||||
const resp = await queryBuiltInParams(unref(data), _params);
|
||||
if (resp.status === 200) {
|
||||
// const array = filterTree(resp.result as any[]);
|
||||
const array = filterTree(resp.result as any[]);
|
||||
//判断相同产品才有按变量
|
||||
// if (props.formProductId === DeviceModel.productId)// TODO
|
||||
console.log(array);
|
||||
const arr = treeDataFilter(resp.result as any[]);
|
||||
builtInList.value = array;
|
||||
}
|
||||
};
|
||||
|
|
@ -293,6 +267,7 @@ const filterType = async () => {
|
|||
};
|
||||
|
||||
const onSelectorChange = (val: string) => {
|
||||
modelRef.selectorValues = undefined;
|
||||
if (val === 'relation') {
|
||||
queryRelationList();
|
||||
}
|
||||
|
|
@ -300,7 +275,17 @@ const onSelectorChange = (val: string) => {
|
|||
|
||||
const onDeviceChange = (_detail: any) => {
|
||||
if (_detail) {
|
||||
emits('save', modelRef, _detail);
|
||||
if (_detail.id) {
|
||||
modelRef.deviceId = _detail.id;
|
||||
modelRef.selectorValues = [
|
||||
{ value: _detail.id, name: _detail.name },
|
||||
] as any;
|
||||
modelRef.message = {} as any;
|
||||
} else {
|
||||
modelRef.deviceId = '';
|
||||
modelRef.selectorValues = [] as any;
|
||||
}
|
||||
emits('save', unref(modelRef), _detail);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -310,7 +295,7 @@ const onRelationChange = (val: any, options: any) => {
|
|||
modelRef.selectorValues = val;
|
||||
modelRef.upperKey = 'scene.deviceId';
|
||||
modelRef.relationName = options.label;
|
||||
emits('save', modelRef, {});
|
||||
emits('save', unref(modelRef), {});
|
||||
};
|
||||
|
||||
const onTagChange = (val: any[], arr: any[]) => {
|
||||
|
|
@ -321,11 +306,12 @@ const onTagChange = (val: any[], arr: any[]) => {
|
|||
if (arr) {
|
||||
tagList.value = arr;
|
||||
}
|
||||
emits('save', unref(modelRef), {});
|
||||
};
|
||||
|
||||
const onVariableChange = (val: any, node: any) => {
|
||||
modelRef.deviceId = val;
|
||||
// modelRef.deviceDetail = node;
|
||||
emits('save', unref(modelRef), node);
|
||||
modelRef.selectorValues = [{ value: val, name: node.description }] as any;
|
||||
};
|
||||
|
||||
|
|
@ -348,6 +334,21 @@ watch(
|
|||
deep: true,
|
||||
},
|
||||
);
|
||||
|
||||
const onFormSave = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(async (_data: any) => {
|
||||
resolve(_data);
|
||||
})
|
||||
.catch((err: any) => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
defineExpose({ onFormSave });
|
||||
</script>
|
||||
|
||||
<style scoped lang='less'>
|
||||
|
|
|
|||
|
|
@ -33,13 +33,16 @@
|
|||
:thenName="thenName"
|
||||
:values="DeviceModel"
|
||||
@save="onDeviceSave"
|
||||
ref="deviceRef"
|
||||
/>
|
||||
<Action v-else-if="current === 2"
|
||||
<Action
|
||||
v-else-if="current === 2"
|
||||
:name="name"
|
||||
:branchGroup="branchGroup"
|
||||
:thenName="thenName"
|
||||
:values="DeviceModel"
|
||||
/>
|
||||
ref="actionRef"
|
||||
/>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="steps-action">
|
||||
|
|
@ -62,7 +65,13 @@ import Product from './Product.vue';
|
|||
import Device from './device/index.vue';
|
||||
import Action from './actions/index.vue';
|
||||
import { onlyMessage } from '@/utils/comm';
|
||||
import { detail } from '@/api/device/product'
|
||||
import { detail } from '@/api/device/product';
|
||||
|
||||
import { useSceneStore } from '@/store/scene';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
const sceneStore = useSceneStore();
|
||||
const { data } = storeToRefs(sceneStore);
|
||||
|
||||
type Emit = {
|
||||
(e: 'cancel'): void;
|
||||
|
|
@ -92,6 +101,8 @@ const props = defineProps({
|
|||
});
|
||||
|
||||
const current = ref<number>(0);
|
||||
const deviceRef = ref<any>();
|
||||
const actionRef = ref<any>();
|
||||
|
||||
const DeviceModel = reactive<DeviceModelType>({
|
||||
productId: '',
|
||||
|
|
@ -119,6 +130,71 @@ const onCancel = () => {
|
|||
emit('cancel');
|
||||
};
|
||||
|
||||
const onSave = (_data: any) => {
|
||||
const item: any = {
|
||||
selector: DeviceModel.selector,
|
||||
source: DeviceModel.source,
|
||||
selectorValues: DeviceModel.selectorValues,
|
||||
productId: DeviceModel.productId,
|
||||
message: _data.message,
|
||||
};
|
||||
//处理按变量
|
||||
if (DeviceModel.selector === 'variable') {
|
||||
item.selector = 'fixed';
|
||||
}
|
||||
if (DeviceModel.selector === 'relation') {
|
||||
item.upperKey = 'scene.deviceId';
|
||||
}
|
||||
const _options: any = {
|
||||
name: '-', //设备名称
|
||||
type: '', //类型
|
||||
properties: '', //属性功能
|
||||
propertiesValue: '', //设置功能
|
||||
selector: DeviceModel.selector, //选择器标识
|
||||
productName: DeviceModel.productDetail.name,
|
||||
relationName: DeviceModel.relationName,
|
||||
triggerName: data.value.options?.trigger?.name || '触发设备',
|
||||
taglist: [],
|
||||
columns: [],
|
||||
otherColumns: [],
|
||||
};
|
||||
_options.name = DeviceModel.deviceDetail?.name;
|
||||
const _type = _data.message.messageType;
|
||||
if (_type === 'INVOKE_FUNCTION') {
|
||||
_options.type = '执行';
|
||||
_options.properties = DeviceModel.propertiesName;
|
||||
}
|
||||
if (_type === 'READ_PROPERTY') {
|
||||
_options.type = '读取';
|
||||
_options.properties = DeviceModel.propertiesName;
|
||||
}
|
||||
if (_type === 'WRITE_PROPERTY') {
|
||||
_options.type = '设置';
|
||||
_options.properties = DeviceModel.propertiesName;
|
||||
_options.propertiesValue =
|
||||
typeof DeviceModel.propertiesValue === 'object'
|
||||
? JSON.stringify(DeviceModel.propertiesValue)
|
||||
: `${DeviceModel.propertiesValue}`;
|
||||
_options.columns = DeviceModel.columns;
|
||||
_options.otherColumns = DeviceModel.columns;
|
||||
const cur: any = Object.values(_data.message.properties)?.[0];
|
||||
if (cur?.source === 'upper') {
|
||||
_options.propertiesValue = DeviceModel.actionName;
|
||||
}
|
||||
}
|
||||
if (_options.selector === 'tag') {
|
||||
_options.taglist = DeviceModel.tagList.map((it) => ({
|
||||
name: it.column || it.name,
|
||||
type: it.type ? (it.type === 'and' ? '并且' : '或者') : '',
|
||||
value: it.value,
|
||||
}));
|
||||
}
|
||||
if (_options.selector === 'variable') {
|
||||
_options.name = DeviceModel.selectorValues?.[0]?.name;
|
||||
}
|
||||
emit('save', item, _options);
|
||||
};
|
||||
|
||||
const save = async (step?: number) => {
|
||||
let _step = step !== undefined ? step : current.value;
|
||||
if (_step === 0) {
|
||||
|
|
@ -126,10 +202,15 @@ const save = async (step?: number) => {
|
|||
? (current.value = 1)
|
||||
: onlyMessage('请选择产品', 'error');
|
||||
} else if (_step === 1) {
|
||||
DeviceModel.deviceId
|
||||
? (current.value = 2)
|
||||
: onlyMessage('请选择设备', 'error');
|
||||
if (deviceRef.value) {
|
||||
await deviceRef.value?.onFormSave();
|
||||
current.value = 2;
|
||||
}
|
||||
} else {
|
||||
if (actionRef.value) {
|
||||
const _data = await actionRef.value?.onFormSave();
|
||||
onSave(_data);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -148,24 +229,23 @@ const prev = () => {
|
|||
const saveClick = () => save();
|
||||
|
||||
const onDeviceSave = (_data: any, _detail: any) => {
|
||||
Object.assign(DeviceModel, _data)
|
||||
DeviceModel.deviceId = _detail.id
|
||||
DeviceModel.deviceDetail = _detail
|
||||
}
|
||||
Object.assign(DeviceModel, _data);
|
||||
DeviceModel.deviceDetail = _detail;
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.value,
|
||||
(newValue) => {
|
||||
Object.assign(DeviceModel, newValue);
|
||||
if(newValue?.productId){
|
||||
detail(newValue.productId).then(resp => {
|
||||
if(resp.status === 200){
|
||||
DeviceModel.productDetail = resp.result
|
||||
if (newValue?.productId) {
|
||||
detail(newValue.productId).then((resp) => {
|
||||
if (resp.status === 200) {
|
||||
DeviceModel.productDetail = resp.result;
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
},
|
||||
{ immediate: true, deep: true },
|
||||
{ immediate: true },
|
||||
);
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -18,12 +18,13 @@
|
|||
},
|
||||
]"
|
||||
>
|
||||
<j-card-select
|
||||
<!-- <j-card-select
|
||||
v-model:value="formModel.type"
|
||||
:options="options"
|
||||
type="horizontal"
|
||||
float="right"
|
||||
/>
|
||||
/> -->
|
||||
<a-radio-group v-model:value="formModel.type" :options="options" />
|
||||
</a-form-item>
|
||||
<ActionTypeComponent
|
||||
v-bind="props"
|
||||
|
|
@ -43,10 +44,9 @@ import Notify from '../Notify/index.vue';
|
|||
import Device from '../Device/index.vue';
|
||||
import { PropType } from 'vue';
|
||||
import { ActionsType } from '../../../typings';
|
||||
import ActionTypeComponent from './ActionTypeComponent.vue'
|
||||
import ActionTypeComponent from './ActionTypeComponent.vue';
|
||||
import { randomString } from '@/utils/utils';
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
branchesName: {
|
||||
type: Number,
|
||||
|
|
@ -63,8 +63,8 @@ const props = defineProps({
|
|||
data: {
|
||||
type: Object as PropType<ActionsType>,
|
||||
default: () => ({
|
||||
key: randomString()
|
||||
})
|
||||
key: randomString(),
|
||||
}),
|
||||
},
|
||||
parallel: {
|
||||
type: Boolean,
|
||||
|
|
@ -117,7 +117,11 @@ watch(
|
|||
() => props.data,
|
||||
(newVal) => {
|
||||
if (newVal?.executor) {
|
||||
formModel.type = (newVal?.executor === 'alarm' ? newVal?.alarm?.mode : newVal?.executor) as string
|
||||
formModel.type = (
|
||||
newVal?.executor === 'alarm'
|
||||
? newVal?.alarm?.mode
|
||||
: newVal?.executor
|
||||
) as string;
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -129,7 +133,15 @@ const onOk = () => {
|
|||
actionForm.value.validate().then((values: any) => {
|
||||
actionType.value = values?.type;
|
||||
if (values?.type === 'relieve' || values?.type === 'trigger') {
|
||||
emit('save', { ...props.data, executor: 'alarm', alarm: { mode: values.type } }, {});
|
||||
emit(
|
||||
'save',
|
||||
{
|
||||
...props.data,
|
||||
executor: 'alarm',
|
||||
alarm: { mode: values.type },
|
||||
},
|
||||
{},
|
||||
);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
|
@ -140,10 +152,10 @@ const onCancel = () => {
|
|||
|
||||
const onPropsOk = (data: any, options?: any) => {
|
||||
emit('save', { ...data, executor: data.type }, options);
|
||||
actionType.value = ''
|
||||
actionType.value = '';
|
||||
};
|
||||
|
||||
const onPropsCancel = () => {
|
||||
actionType.value = ''
|
||||
}
|
||||
actionType.value = '';
|
||||
};
|
||||
</script>
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<Search
|
||||
<j-advanced-search
|
||||
:columns="columns"
|
||||
type="simple"
|
||||
target="action-notice-config"
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<Search
|
||||
<j-advanced-search
|
||||
:columns="columns"
|
||||
type="simple"
|
||||
target="action-notice-template"
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<j-card-select
|
||||
<!-- <j-card-select
|
||||
v-model:value="notifyType"
|
||||
:options="options"
|
||||
:icon-size="106"
|
||||
/>
|
||||
/> -->
|
||||
<a-radio-group v-model:value="notifyType" :options="options" @change="onRadioChange" />
|
||||
</a-spin>
|
||||
</template>
|
||||
|
||||
|
|
@ -34,13 +35,17 @@ const notifyType = ref('');
|
|||
const options = ref<any[]>([]);
|
||||
|
||||
watch(
|
||||
() => notifyType,
|
||||
() => props.value,
|
||||
(newVal) => {
|
||||
emit('update:value', newVal)
|
||||
notifyType.value = newVal
|
||||
},
|
||||
{ deep: true, immediate: true },
|
||||
);
|
||||
|
||||
const onRadioChange = (e: any) => {
|
||||
emit('update:value', e.target.value)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loading.value = true
|
||||
notice.queryMessageType().then((resp) => {
|
||||
|
|
|
|||
|
|
@ -122,7 +122,6 @@ const jumpStep = async (val: number) => {
|
|||
if (val === 0) {
|
||||
current.value = val;
|
||||
} else if (val === 1) {
|
||||
console.log(formModel)
|
||||
if (formModel.notifyType) {
|
||||
current.value = val;
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -23,7 +23,11 @@
|
|||
type="serial"
|
||||
:branchesName="props.name"
|
||||
:parallel="false"
|
||||
:actions="serialArray.length ? serialArray[0].actions : []"
|
||||
:actions="
|
||||
serialArray.length ? serialArray[0].actions : []
|
||||
"
|
||||
@add="onAdd"
|
||||
@delete="onDelete"
|
||||
/>
|
||||
</div>
|
||||
</a-collapse-panel>
|
||||
|
|
@ -41,7 +45,11 @@
|
|||
type="parallel"
|
||||
:branchesName="props.name"
|
||||
:parallel="true"
|
||||
:actions="parallelArray.length ? parallelArray[0].actions : []"
|
||||
:actions="
|
||||
parallelArray.length
|
||||
? parallelArray[0].actions
|
||||
: []
|
||||
"
|
||||
@add="onAdd"
|
||||
@delete="onDelete"
|
||||
/>
|
||||
|
|
@ -57,6 +65,7 @@ import ShakeLimit from '../components/ShakeLimit/index.vue';
|
|||
import { List } from './ListItem';
|
||||
import { BranchesThen } from '../../typings';
|
||||
import { PropType } from 'vue';
|
||||
import { randomString } from '@/utils/utils';
|
||||
|
||||
interface ActionsProps {
|
||||
name: number;
|
||||
|
|
@ -73,13 +82,15 @@ const props = defineProps({
|
|||
openShakeLimit: Boolean,
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update', 'add']);
|
||||
|
||||
const shakeLimit = ref({
|
||||
enabled: false
|
||||
enabled: false,
|
||||
});
|
||||
const activeKeys = ref<string[]>(['1']);
|
||||
const parallelArray = ref<BranchesThen[]>([]);
|
||||
const serialArray = ref<BranchesThen[]>([]);
|
||||
const lock = ref<boolean>(false)
|
||||
const lock = ref<boolean>(false);
|
||||
|
||||
watch(
|
||||
() => props.thenOptions,
|
||||
|
|
@ -96,8 +107,8 @@ watch(
|
|||
parallelArray.value.length &&
|
||||
(!serialArray.value.length || !isSerialActions)
|
||||
) {
|
||||
activeKeys.value = ['2']
|
||||
lock.value = true
|
||||
activeKeys.value = ['2'];
|
||||
lock.value = true;
|
||||
}
|
||||
|
||||
//TODO 回传数据
|
||||
|
|
@ -109,11 +120,37 @@ watch(
|
|||
);
|
||||
|
||||
const onDelete = (_key: string) => {
|
||||
console.log(_key)
|
||||
}
|
||||
const onAdd = (data: any) => {
|
||||
console.log(data)
|
||||
}
|
||||
const aIndex = unref(serialArray)[0].actions?.findIndex(
|
||||
(aItem) => aItem.key === _key,
|
||||
);
|
||||
if (aIndex !== -1) {
|
||||
serialArray.value[0].actions?.splice(aIndex, 1);
|
||||
emit('update', serialArray[0], false);
|
||||
}
|
||||
};
|
||||
const onAdd = (actionItem: any) => {
|
||||
const newParallelArray = [...parallelArray.value];
|
||||
if (newParallelArray.length) {
|
||||
const indexOf = newParallelArray[0].actions?.findIndex(
|
||||
(aItem) => aItem.key === actionItem.key,
|
||||
);
|
||||
if (indexOf !== -1) {
|
||||
newParallelArray[0].actions.splice(indexOf, 1, actionItem);
|
||||
} else {
|
||||
newParallelArray[0].actions.push(actionItem);
|
||||
}
|
||||
parallelArray.value = [...newParallelArray];
|
||||
console.log(parallelArray.value);
|
||||
emit('update', newParallelArray[0], true);
|
||||
} else {
|
||||
actionItem.key = randomString();
|
||||
emit('add', {
|
||||
parallel: true,
|
||||
key: randomString(),
|
||||
actions: [actionItem],
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
|
|
|||
Loading…
Reference in New Issue