fix:场景联动
This commit is contained in:
parent
2aaa3ae945
commit
0a93cd2926
|
@ -1,5 +1,11 @@
|
||||||
<template>
|
<template>
|
||||||
<pro-search class="device-search" type="simple" :columns="columns" target="device-instance-running-events" @search="handleSearch" />
|
<pro-search
|
||||||
|
class="device-search"
|
||||||
|
type="simple"
|
||||||
|
:columns="columns"
|
||||||
|
target="device-instance-running-events"
|
||||||
|
@search="handleSearch"
|
||||||
|
/>
|
||||||
<JProTable
|
<JProTable
|
||||||
ref="eventsRef"
|
ref="eventsRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
|
@ -17,13 +23,18 @@
|
||||||
</j-button>
|
</j-button>
|
||||||
</template>
|
</template>
|
||||||
</JProTable>
|
</JProTable>
|
||||||
|
<j-modal :width="600" v-model:visible="visible" title="详情" class="device-running-event-modal">
|
||||||
|
<JsonViewer :value="info" />
|
||||||
|
<template #footer>
|
||||||
|
<j-button type="primary" @click="visible = false">关闭</j-button>
|
||||||
|
</template>
|
||||||
|
</j-modal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
import { getEventList } from '@/api/device/instance';
|
import { getEventList } from '@/api/device/instance';
|
||||||
import { useInstanceStore } from '@/store/instance';
|
import { useInstanceStore } from '@/store/instance';
|
||||||
import { Modal } from 'jetlinks-ui-components';
|
|
||||||
import JsonViewer from 'vue-json-viewer';
|
import JsonViewer from 'vue-json-viewer';
|
||||||
|
|
||||||
const events = defineProps({
|
const events = defineProps({
|
||||||
|
@ -52,13 +63,11 @@ const columns = ref<Record<string, any>>([
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
const params = ref<Record<string, any>>({});
|
const params = ref<Record<string, any>>({});
|
||||||
|
const visible = ref<boolean>(false);
|
||||||
|
const info = ref<Record<string, any>>({});
|
||||||
|
|
||||||
const _getEventList = (_params: any) =>
|
const _getEventList = (_params: any) =>
|
||||||
getEventList(
|
getEventList(instanceStore.current.id || '', events.data.id || '', _params);
|
||||||
instanceStore.current.id || '',
|
|
||||||
events.data.id || '',
|
|
||||||
_params
|
|
||||||
);
|
|
||||||
|
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
if (events.data?.valueType?.type === 'object') {
|
if (events.data?.valueType?.type === 'object') {
|
||||||
|
@ -69,7 +78,7 @@ watchEffect(() => {
|
||||||
dataIndex: `${i.id}_format`,
|
dataIndex: `${i.id}_format`,
|
||||||
search: {
|
search: {
|
||||||
type: i?.valueType?.type || 'string',
|
type: i?.valueType?.type || 'string',
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
|
@ -85,20 +94,28 @@ const handleSearch = (_params: any) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const detail = (_info: any) => {
|
const detail = (_info: any) => {
|
||||||
Modal.info({
|
info.value = _info
|
||||||
title: () => '详情',
|
visible.value = true
|
||||||
width: 850,
|
// Modal.info({
|
||||||
content: () => h('JsonViewer', {
|
// title: () => '详情',
|
||||||
'expand-depth': 5,
|
// width: 850,
|
||||||
value: _info
|
// content: () => h('JsonViewer', {
|
||||||
}),
|
// 'expand-depth': 5,
|
||||||
okText: '关闭',
|
// value: _info
|
||||||
});
|
// }),
|
||||||
|
// okText: '关闭',
|
||||||
|
// });
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
.device-search {
|
.device-search {
|
||||||
margin: 0 0 24px 0 ;
|
margin: 0 0 24px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-running-event-modal {
|
||||||
|
.ant-modal-body {
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
|
@ -13,7 +13,7 @@
|
||||||
<j-row type="flex">
|
<j-row type="flex">
|
||||||
<j-col flex="180px">
|
<j-col flex="180px">
|
||||||
<j-form-item name="photoUrl">
|
<j-form-item name="photoUrl">
|
||||||
<JProUpload v-model="modelRef.photoUrl" />
|
<JProUpload accept="image/*" v-model="modelRef.photoUrl" />
|
||||||
</j-form-item>
|
</j-form-item>
|
||||||
</j-col>
|
</j-col>
|
||||||
<j-col flex="auto">
|
<j-col flex="auto">
|
||||||
|
|
|
@ -13,7 +13,7 @@
|
||||||
<j-row type="flex">
|
<j-row type="flex">
|
||||||
<j-col flex="180px">
|
<j-col flex="180px">
|
||||||
<j-form-item name="photoUrl">
|
<j-form-item name="photoUrl">
|
||||||
<JProUpload v-model="modelRef.photoUrl" />
|
<JProUpload accept="image/*" v-model="modelRef.photoUrl" />
|
||||||
</j-form-item>
|
</j-form-item>
|
||||||
</j-col>
|
</j-col>
|
||||||
<j-col flex="auto">
|
<j-col flex="auto">
|
||||||
|
|
|
@ -13,7 +13,7 @@
|
||||||
v-model:value="_value"
|
v-model:value="_value"
|
||||||
:precision="3"
|
:precision="3"
|
||||||
:min="0"
|
:min="0"
|
||||||
:max="6535"
|
:max="65535"
|
||||||
>
|
>
|
||||||
<template #addonAfter>
|
<template #addonAfter>
|
||||||
<j-select
|
<j-select
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
v-model:value="_value"
|
v-model:value="_value"
|
||||||
v-model:source="_source"
|
v-model:source="_source"
|
||||||
@select="onChange"
|
@select="onChange"
|
||||||
|
valueName="id"
|
||||||
>
|
>
|
||||||
<template v-slot="{ label }">
|
<template v-slot="{ label }">
|
||||||
<j-input :value="label" readonly />
|
<j-input :value="label" readonly />
|
||||||
|
@ -15,6 +16,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
import { cloneDeep } from 'lodash-es';
|
||||||
import ParamsDropdown from '../../../components/ParamsDropdown';
|
import ParamsDropdown from '../../../components/ParamsDropdown';
|
||||||
import { handleParamsData } from './index';
|
import { handleParamsData } from './index';
|
||||||
|
|
||||||
|
@ -101,7 +103,7 @@ const filterParamsData = (type?: string, data?: any[]): any[] => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const upperOptions = computed(() => {
|
const upperOptions = computed(() => {
|
||||||
return filterParamsData(props.data.valueType?.type, props?.builtInList);
|
return filterParamsData(props.data.valueType?.type, cloneDeep(props?.builtInList));
|
||||||
});
|
});
|
||||||
|
|
||||||
const onChange = () => {
|
const onChange = () => {
|
||||||
|
|
|
@ -39,6 +39,7 @@
|
||||||
v-model:value="propertyModelRef.propertiesValue"
|
v-model:value="propertyModelRef.propertiesValue"
|
||||||
v-model:source="propertyModelRef.source"
|
v-model:source="propertyModelRef.source"
|
||||||
@select="onValueChange"
|
@select="onValueChange"
|
||||||
|
valueName="id"
|
||||||
>
|
>
|
||||||
<template v-slot="{ label }">
|
<template v-slot="{ label }">
|
||||||
<j-input readonly :value="label" placeholder="请选择" />
|
<j-input readonly :value="label" placeholder="请选择" />
|
||||||
|
@ -51,6 +52,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
import { cloneDeep } from 'lodash-es';
|
||||||
import ParamsDropdown from '../../../components/ParamsDropdown';
|
import ParamsDropdown from '../../../components/ParamsDropdown';
|
||||||
import { handleParamsData } from './index';
|
import { handleParamsData } from './index';
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
@ -122,7 +124,8 @@ const filterParamsData = (type?: string, data?: any[]): any[] => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const upperOptions = computed(() => {
|
const upperOptions = computed(() => {
|
||||||
return filterParamsData(getType.value?.valueType?.type, props?.builtInList);
|
const _data = filterParamsData(getType.value?.valueType?.type, cloneDeep(props?.builtInList))
|
||||||
|
return _data
|
||||||
});
|
});
|
||||||
|
|
||||||
const handleOptions = computed(() => {
|
const handleOptions = computed(() => {
|
||||||
|
@ -162,7 +165,7 @@ const onChange = () => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
const onValueChange = () => {
|
const onValueChange = (val: any) => {
|
||||||
const obj = {
|
const obj = {
|
||||||
[`${propertyModelRef.properties}`]: {
|
[`${propertyModelRef.properties}`]: {
|
||||||
value: propertyModelRef?.propertiesValue,
|
value: propertyModelRef?.propertiesValue,
|
||||||
|
@ -170,7 +173,7 @@ const onValueChange = () => {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
emit('update:value', obj);
|
emit('update:value', obj);
|
||||||
emit('change', propertyModelRef?.propertiesValue)
|
emit('change', val?.name || val)
|
||||||
};
|
};
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
|
|
|
@ -183,7 +183,7 @@ watch(
|
||||||
|
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
.action-search {
|
.action-search {
|
||||||
padding: 0 0 24px 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
|
|
|
@ -183,7 +183,7 @@ watch(
|
||||||
|
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
.action-search {
|
.action-search {
|
||||||
padding: 0 0 24px 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
|
|
|
@ -79,6 +79,7 @@ const formRef = ref();
|
||||||
const modelRef = reactive({});
|
const modelRef = reactive({});
|
||||||
|
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
|
console.log(props?.value)
|
||||||
Object.assign(modelRef, props?.value);
|
Object.assign(modelRef, props?.value);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -91,7 +91,7 @@ const source = computed(() => {
|
||||||
});
|
});
|
||||||
|
|
||||||
const builtInList = ref<any[]>([]);
|
const builtInList = ref<any[]>([]);
|
||||||
const upperKey = ref();
|
const upperKey = ref(props.value?.upperKey);
|
||||||
|
|
||||||
const sourceChange = (val: any) => {
|
const sourceChange = (val: any) => {
|
||||||
emit('update:value', {
|
emit('update:value', {
|
||||||
|
@ -160,6 +160,14 @@ watch(
|
||||||
},
|
},
|
||||||
{ deep: true, immediate: true },
|
{ deep: true, immediate: true },
|
||||||
);
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.value.upperKey,
|
||||||
|
(newVal) => {
|
||||||
|
upperKey.value = newVal
|
||||||
|
},
|
||||||
|
{ immediate: true },
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
|
@ -176,10 +176,10 @@
|
||||||
name="name"
|
name="name"
|
||||||
:required="true"
|
:required="true"
|
||||||
:rules="[
|
:rules="[
|
||||||
// {
|
{
|
||||||
// required: true,
|
required: true,
|
||||||
// message: '请输入名称',
|
message: '请输入名称',
|
||||||
// },
|
},
|
||||||
{
|
{
|
||||||
max: 64,
|
max: 64,
|
||||||
message: '最多可输入64个字符',
|
message: '最多可输入64个字符',
|
||||||
|
@ -467,7 +467,7 @@ const checkName = (_: any, value: any) =>
|
||||||
resolve('');
|
resolve('');
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
reject('请输入名称');
|
resolve('');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in New Issue