0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 优化物模型-功能定义-输出

This commit is contained in:
XieYongHong 2023-07-07 17:22:46 +08:00
parent e103369689
commit 4d995d98ed
8 changed files with 258 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/device/components/Metadata/Base/Base.vue
View File

@ -1,7 +1,7 @@
<template>
<j-data-table
ref="tableRef"
v-model:data-source="dataSource"
:data-source="dataSource"
:columns="columns"
:height="560"
:searchProps="{
@ -246,7 +246,7 @@ const dataSource = ref<MetadataItem[]>(metadata.value || []);
const tableRef = ref();
// const columns = computed(() => MetadataMapping.get(props.type!));
const {columns} = useColumns(props.type, target, dataSource, noEdit)
const {columns} = useColumns(props.type, target, noEdit)
const detailData = reactive({
data: {},

13
src/views/device/components/Metadata/Base/columns.tsx
View File

@ -73,7 +73,7 @@ export const typeSelectChange = (type: string) => {
return obj
}
export const useColumns = (type?: MetadataType, target?: 'device' | 'product', dataSource?: Ref<any[]>, noEdit?: Ref<any>) => {
export const useColumns = (type?: MetadataType, target?: 'device' | 'product', noEdit?: Ref<any>) => {
const BaseColumns: DataTableColumnProps[] = [
{
@ -83,12 +83,11 @@ export const useColumns = (type?: MetadataType, target?: 'device' | 'product', d
form: {
required: true,
rules: [{
validator(va:any,value: any) {
const fieldIndex = va.field.split('.')[1]
const oldValue = (dataSource!.value || []).filter((_, index) => index != fieldIndex)
console.log(oldValue)
const hasId = oldValue.some((item) => item.id === value)
callback(rule:any,value: any, dataSource: any[]) {
if (value) {
const field = rule.field.split('.')
const fieldIndex = Number(field[1])
const hasId = dataSource.some((item, index) => item.id === value && fieldIndex !== index)
if (hasId) {
return Promise.reject('该标识存在')
}
@ -302,7 +301,7 @@ export const useColumns = (type?: MetadataType, target?: 'device' | 'product', d
const columns = ref<any[]>([])
watch(() => JSON.stringify(dataSource!.value), () => {
watch(() => JSON.stringify(noEdit!.value), () => {
console.log(noEdit!.value)
switch(type) {
case 'properties':

205
src/views/device/components/Metadata/Base/components/ConfigModal.vue Normal file
View File

@ -0,0 +1,205 @@
<template>
<DataTableArray
v-if="type === 'array'"
v-model:value="myValue.elementType"
:unitOptions="options"
placement="topRight"
@confirm="valueChange"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableArray>
<DataTableObject
v-else-if="type === 'object'"
:value="myValue.properties"
placement="topRight"
:onAdd="objectAdd"
:columns="[
{ title: '参数标识', dataIndex: 'id', type: 'text', width: 100 },
{ title: '参数名称', dataIndex: 'name', type: 'text', width: 100 },
{
title: '数据类型',
type: 'components',
dataIndex: 'valueType',
components: {
name: ValueObject,
props: {
filter: ['object']
}
},
width: 100
},
{
title: '其他配置',
type: 'components',
dataIndex: 'config',
components: {
name: DataTypeObjectChild
},
width: 100
},
{
title: '操作',
dataIndex: 'action',
width: 60
}
]"
@confirm="valueChange"
>
<template #valueType="{ data }">
{{ data.record.valueType?.type }}
</template>
<template #config="{ data }">
<OtherConfigInfo :value="data.record.valueType"></OtherConfigInfo>
</template>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableObject>
<DataTableEnum
v-else-if="type === 'enum'"
v-model:value="myValue"
placement="topRight"
@confirm="valueChange"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableEnum>
<DataTableBoolean
v-else-if="type === 'boolean'"
v-model:value="myValue"
placement="topRight"
@confirm="valueChange"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableBoolean>
<DataTableDouble
v-else-if="['float', 'double'].includes(type)"
:options="options"
v-model:value="myValue"
placement="topRight"
@confirm="valueChange"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableDouble>
<DataTableInteger
v-else-if="['int', 'long'].includes(type)"
:options="options"
v-model:value="myValue.unit"
placement="topRight"
@confirm="valueChange"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableInteger>
<DataTableFile
v-else-if="type === 'file'"
v-model:value="myValue.fileType"
placement="topRight"
@confirm="valueChange"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableFile>
<DataTableDate
v-else-if="type === 'date'"
v-model:value="myValue.format"
placement="topRight"
@confirm="valueChange"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableDate>
<DataTableString
v-else-if="['string', 'password'].includes(type)"
v-model:value="myValue.maxLength"
placement="topRight"
>
<j-button>
<AIcon type="SettingOutlined" />
配置
</j-button>
</DataTableString>
<span v-else>
无
</span>
</template>
<script setup lang="ts" name="ConfigModal">
import {
DataTableTypeSelect,
DataTableArray,
DataTableString,
DataTableInteger,
DataTableDouble,
DataTableBoolean,
DataTableEnum,
DataTableFile,
DataTableDate,
DataTableObject,
} from 'jetlinks-ui-components';
import ValueObject from '@/views/device/components/Metadata/Base/components/Events/ValueObject.vue'
import DataTypeObjectChild from '@/views/device/components/Metadata/Base/components/DataTypeObjectChild.vue'
import OtherConfigInfo from './Events/OtherConfigInfo.vue'
const props = defineProps({
value: {
type: Object,
default: () => ({})
},
valueKey: {
type: String,
default: 'valueType'
}
})
const emit = defineEmits(['update:value'])
const objectAdd = () => {
return {
id: undefined,
name: undefined,
valueType: {
type: undefined
}
}
}
const options = ref([])
const type = ref(props.value?.[props.valueKey]?.type)
const myValue = ref(props.value?.[props.valueKey])
const valueChange = () => {
}
watch(() => JSON.stringify(props.value), () => {
console.log(props.value)
type.value = props.value?.[props.valueKey]?.type
myValue.value = props.value?.[props.valueKey]
})
</script>
<style scoped>
</style>

47
src/views/device/components/Metadata/Base/components/DataType.vue
View File

@ -12,27 +12,51 @@
/>
<DataTableObject
v-else-if="type === 'object'"
v-model:value="_valueType.properties"
:value="_valueType.properties"
placement="topRight"
:columns="[
{ title: '参数标识', dataIndex: 'id', type: 'text', width: 100 },
{ title: '参数名称', dataIndex: 'name', type: 'text', width: 100 },
{
title: '参数标识',
dataIndex: 'id',
type: 'text',
width: 100,
form: {
required: true,
rules: [{
callback() {
}
}]
}
},
{
title: '参数名称',
dataIndex: 'name',
type: 'text',
width: 100,
form: {
required: true,
rules: [{
required: true,
message: '请输入参数名称'
}]
}
},
{
title: '数据类型',
type: 'components',
dataIndex: 'valueType',
components: {
name: ValueObject,
props: {
filter: ['object']
}
},
width: 100
},
{
title: '其他配置',
type: 'components',
dataIndex: 'config',
components: {
name: DataTypeObjectChild
},
width: 100
},
{
@ -47,7 +71,8 @@
{{ data.record.valueType?.type }}
</template>
<template #config="{ data }">
<OtherConfigInfo :value="data.record.valueType"></OtherConfigInfo>
<!-- <OtherConfigInfo :value="data.record.valueType"></OtherConfigInfo>-->
<ConfigModal v-model:value="data.record" />
</template>
</DataTableObject>
<DataTableEnum v-else-if="type === 'enum'" v-model:value="_valueType" placement="topRight" @confirm="valueChange"/>
@ -78,7 +103,7 @@
<script setup lang="ts" name="MetadataDataType">
import { getUnit } from '@/api/device/instance';
import {InputParams, ValueObject, OtherConfigInfo, ConstraintSelect} from '../components'
import { ValueObject } from '../components'
import {
DataTableTypeSelect,
DataTableArray,
@ -91,9 +116,9 @@ import {
DataTableDate,
DataTableObject,
} from 'jetlinks-ui-components';
import DataTypeObjectChild from './DataTypeObjectChild.vue';
import { cloneDeep } from 'lodash-es';
import { typeSelectChange } from '../columns'
import ConfigModal from './ConfigModal.vue'
const props = defineProps({
value: {
@ -143,7 +168,7 @@ watch(
});
}
},
{ immediate: true, deep: true },
{ immediate: true },
);
</script>

4
src/views/device/components/Metadata/Base/components/DataTypeObjectChild.vue
View File

@ -21,7 +21,7 @@
<DataTableDate v-else-if="formData.type === 'date'" v-model:value="formData.date" placement="topRight"/>
<DataTableString
v-else-if="['string', 'password'].includes(formData.type)"
v-model:value="formData.expands.maxLength"
v-model:value="formData.maxLength"
placement="topRight"
/>
</div>
@ -103,7 +103,7 @@ const text = computed(() => {
return value?.trueText ? `${ value?.trueText }-${ value.trueValue }; ${ value.falseText }-${ value.falseValue }` : '';
case 'string':
case 'password':
return value?.expands?.maxLength;
return value?.maxLength;
case 'int':
case 'long':
return '无'

6
src/views/device/components/Metadata/Base/components/Events/ValueObject.vue
View File

@ -1,5 +1,5 @@
<template>
<DataTableTypeSelect v-model:value="type" :filter="['object']" @change="change">
<DataTableTypeSelect v-model:value="type" @change="change" :filter="filter">
</DataTableTypeSelect>
</template>
@ -33,6 +33,10 @@ const props = defineProps({
type: Array as PropType<{ label: string; value: string }[]>,
default: () => [],
},
filter: {
type: Array,
default: undefined
}
});

3
src/views/device/components/Metadata/Base/components/Function/InputParams.vue
View File

@ -111,9 +111,6 @@ watch(() => JSON.stringify(dataSource.value), () => {
width: 100,
components: {
name: ConstraintSelect,
props: {
name: ['expands', 'required']
}
}
},
{

4
yarn.lock
View File

@ -3825,8 +3825,8 @@ jetlinks-store@^0.0.3:
jetlinks-ui-components@^1.0.23, jetlinks-ui-components@^1.0.24:
version "1.0.24"
resolved "http://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.24.tgz#4fed08d639873b642911b808d94ef64856c62cd1"
integrity sha512-bFdN1VdrOR8bmHlE81h5MoTSSwpXPS/qjW0ppDZU55qm8GtNszZfGBi8VeWD2Kvn1oTM43ldyVcGVqipl2DtMQ==
resolved "http://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.24.tgz#552bad6c9ef733c941168c01fcfe594317add9e2"
integrity sha512-34a8yGQpOHy3DsdRO+pc9Qn5HoeLSGhc2wJhVd22/EbyG5X08EENOsIu+Jg6o/ELmSB2gKnvvhpR4rxawN28hQ==
dependencies:
"@vueuse/core" "^9.12.0"
"@vueuse/router" "^9.13.0"