From e6b10a75f2491dd437c250a8e54a51ff3ee36de6 Mon Sep 17 00:00:00 2001
From: XieYongHong <18010623010@163.com>
Date: Wed, 5 Jul 2023 15:06:27 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=89=A9=E6=A8=A1?=
=?UTF-8?q?=E5=9E=8B-=E7=BC=96=E8=BE=91=E8=A1=A8=E6=A0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
plugin/jetlinks.ts | 4 +-
.../device/components/Metadata/Base/Base.vue | 23 +-
.../components/Metadata/Base/columns.tsx | 397 ++++++++++--------
.../Metadata/Base/components/Constraint.vue | 45 ++
.../Metadata/Base/components/DataType.vue | 21 +-
.../Base/components/DataTypeObjectChild.vue | 2 +-
.../Base/components/Events/ValueObject.vue | 2 +-
.../Base/components/Function/InputParams.vue | 14 +-
.../Base/components/Function/OutputParams.vue | 2 +
.../components/Properties/OtherSetting.vue | 5 +-
.../Metadata/Base/components/index.ts | 1 +
.../device/components/Metadata/Base/index.vue | 5 +-
yarn.lock | 21 +-
13 files changed, 338 insertions(+), 204 deletions(-)
create mode 100644 src/views/device/components/Metadata/Base/components/Constraint.vue
diff --git a/plugin/jetlinks.ts b/plugin/jetlinks.ts
index f650f4e1..c5811a95 100644
--- a/plugin/jetlinks.ts
+++ b/plugin/jetlinks.ts
@@ -136,7 +136,7 @@ const matchComponents: IMatcher[] = [
},
{
- pattern: /^Select/,
+ pattern: /^Select|^SelectBoolean/,
styleDir: 'Select'
},
{
@@ -306,7 +306,7 @@ function getSideEffects(compName: string, options: JetlinksVueResolverOptions, _
}
const filterName = ['message', 'Notification']
-const primitiveNames = ['AIcon','Affix', 'Anchor', 'AnchorLink', 'message', 'Notification', 'AutoComplete', 'AutoCompleteOptGroup', 'AutoCompleteOption', 'Alert', 'Avatar', 'AvatarGroup', 'BackTop', 'Badge', 'BadgeRibbon', 'Breadcrumb', 'BreadcrumbItem', 'BreadcrumbSeparator', 'Button', 'ButtonGroup', 'Calendar', 'Card', 'CardGrid', 'CardMeta', 'Collapse', 'CollapsePanel', 'Carousel', 'Cascader', 'Checkbox', 'CheckboxGroup', 'Col', 'Comment', 'ConfigProvider', 'DatePicker', 'MonthPicker', 'WeekPicker', 'RangePicker', 'QuarterPicker', 'Descriptions', 'DescriptionsItem', 'Divider', 'Dropdown', 'DropdownButton', 'Drawer', 'Empty', 'Form', 'FormItem', 'FormItemRest', 'Grid', 'Input', 'InputGroup', 'InputPassword', 'InputSearch', 'Textarea', 'Image', 'ImagePreviewGroup', 'InputNumber', 'Layout', 'LayoutHeader', 'LayoutSider', 'LayoutFooter', 'LayoutContent', 'List', 'ListItem', 'ListItemMeta', 'Menu', 'MenuDivider', 'MenuItem', 'MenuItemGroup', 'SubMenu', 'Mentions', 'MentionsOption', 'Modal', 'Statistic', 'StatisticCountdown', 'PageHeader', 'Pagination', 'Popconfirm', 'Popover', 'Progress', 'Radio', 'RadioButton', 'RadioGroup', 'Rate', 'Result', 'Row', 'Select', 'SelectOptGroup', 'SelectOption', 'Skeleton', 'SkeletonButton', 'SkeletonAvatar', 'SkeletonInput', 'SkeletonImage', 'Slider', 'Space', 'Spin', 'Steps', 'Step', 'Switch', 'Table', 'TableColumn', 'TableColumnGroup', 'TableSummary', 'TableSummaryRow', 'TableSummaryCell', 'Transfer', 'Tree', 'TreeNode', 'DirectoryTree', 'TreeSelect', 'TreeSelectNode', 'Tabs', 'TabPane', 'Tag', 'CheckableTag', 'TimePicker', 'TimeRangePicker', 'Timeline', 'TimelineItem', 'Tooltip', 'Typography', 'TypographyLink', 'TypographyParagraph', 'TypographyText', 'TypographyTitle', 'Upload', 'UploadDragger', 'LocaleProvider', 'ProTable', 'Search', 'AdvancedSearch', 'Ellipsis', 'MonacoEditor', 'ProLayout', 'ScrollTable', 'TableCard', 'Scrollbar', 'CardSelect', 'ColorPicker', 'PopconfirmModal', 'DataTable',
+const primitiveNames = ['AIcon','Affix', 'Anchor', 'AnchorLink', 'message', 'Notification', 'AutoComplete', 'AutoCompleteOptGroup', 'AutoCompleteOption', 'Alert', 'Avatar', 'AvatarGroup', 'BackTop', 'Badge', 'BadgeRibbon', 'Breadcrumb', 'BreadcrumbItem', 'BreadcrumbSeparator', 'Button', 'ButtonGroup', 'Calendar', 'Card', 'CardGrid', 'CardMeta', 'Collapse', 'CollapsePanel', 'Carousel', 'Cascader', 'Checkbox', 'CheckboxGroup', 'Col', 'Comment', 'ConfigProvider', 'DatePicker', 'MonthPicker', 'WeekPicker', 'RangePicker', 'QuarterPicker', 'Descriptions', 'DescriptionsItem', 'Divider', 'Dropdown', 'DropdownButton', 'Drawer', 'Empty', 'Form', 'FormItem', 'FormItemRest', 'Grid', 'Input', 'InputGroup', 'InputPassword', 'InputSearch', 'Textarea', 'Image', 'ImagePreviewGroup', 'InputNumber', 'Layout', 'LayoutHeader', 'LayoutSider', 'LayoutFooter', 'LayoutContent', 'List', 'ListItem', 'ListItemMeta', 'Menu', 'MenuDivider', 'MenuItem', 'MenuItemGroup', 'SubMenu', 'Mentions', 'MentionsOption', 'Modal', 'Statistic', 'StatisticCountdown', 'PageHeader', 'Pagination', 'Popconfirm', 'Popover', 'Progress', 'Radio', 'RadioButton', 'RadioGroup', 'Rate', 'Result', 'Row', 'Select', 'SelectOptGroup', 'SelectOption', 'SelectBoolean', 'Skeleton', 'SkeletonButton', 'SkeletonAvatar', 'SkeletonInput', 'SkeletonImage', 'Slider', 'Space', 'Spin', 'Steps', 'Step', 'Switch', 'Table', 'TableColumn', 'TableColumnGroup', 'TableSummary', 'TableSummaryRow', 'TableSummaryCell', 'Transfer', 'Tree', 'TreeNode', 'DirectoryTree', 'TreeSelect', 'TreeSelectNode', 'Tabs', 'TabPane', 'Tag', 'CheckableTag', 'TimePicker', 'TimeRangePicker', 'Timeline', 'TimelineItem', 'Tooltip', 'Typography', 'TypographyLink', 'TypographyParagraph', 'TypographyText', 'TypographyTitle', 'Upload', 'UploadDragger', 'LocaleProvider', 'ProTable', 'Search', 'AdvancedSearch', 'Ellipsis', 'MonacoEditor', 'ProLayout', 'ScrollTable', 'TableCard', 'Scrollbar', 'CardSelect', 'ColorPicker', 'PopconfirmModal', 'DataTable',
'DataTableArray',
'DataTableString',
'DataTableInteger',
diff --git a/src/views/device/components/Metadata/Base/Base.vue b/src/views/device/components/Metadata/Base/Base.vue
index 288252b8..7e688a98 100644
--- a/src/views/device/components/Metadata/Base/Base.vue
+++ b/src/views/device/components/Metadata/Base/Base.vue
@@ -1,7 +1,7 @@
- 配置
+
@@ -196,7 +196,7 @@ import type {
} from '@/views/device/Product/typings';
import type { PropType } from 'vue';
import { useMetadata, useOperateLimits } from './hooks';
-import MetadataMapping from './columns';
+import { useColumns } from './columns';
import { levelMap, sourceMap, expandsType, limitsMap } from './utils';
import Rule from '@/components/Metadata/Rule';
import { Source, OtherSetting } from './components';
@@ -238,7 +238,9 @@ const productStore = useProductStore()
const dataSource = ref(metadata.value || []);
const tableRef = ref();
-const columns = computed(() => MetadataMapping.get(props.type!));
+
+// const columns = computed(() => MetadataMapping.get(props.type!));
+const {columns} = useColumns(props.type, target, dataSource.value, metadata.value)
const detailData = reactive({
data: {},
@@ -325,18 +327,23 @@ const getDataByType = () => {
return _data
}
-const handleAddClick = (_data?: any, index?: number) => {
+const handleAddClick = async (_data?: any, index?: number) => {
const newObject = _data || getDataByType()
- tableRef.value?.addItem?.(newObject, index)
+ // tableRef.value?.addItem?.(newObject, index)
const data = [...dataSource.value];
if (index !== undefined) {
- data.splice(index + 1, 0, newObject);
+ // 校验
+ const _data = await tableRef.value.getData()
+ console.log(_data)
+ if (_data) {
+ data.splice(index + 1, 0, newObject);
+ }
} else {
- data.push(newObject);
+ data.push(newObject);
}
dataSource.value = data
};
diff --git a/src/views/device/components/Metadata/Base/columns.tsx b/src/views/device/components/Metadata/Base/columns.tsx
index 9cc766ba..a90aa12b 100644
--- a/src/views/device/components/Metadata/Base/columns.tsx
+++ b/src/views/device/components/Metadata/Base/columns.tsx
@@ -3,6 +3,7 @@ import { DataType, Source, InputParams, OtherSetting, OutputParams, ConfigParams
import SelectColumn from './components/Events/SelectColumn.vue';
import AsyncSelect from './components/Function/AsyncSelect.vue';
import { EventLevel } from "@/views/device/data";
+import {MetadataType} from "@/views/device/Product/typings";
interface DataTableColumnProps extends ColumnProps {
type?: string,
components?: {
@@ -10,10 +11,11 @@ interface DataTableColumnProps extends ColumnProps {
[key: string]: any
}
form?: {
- rules: any[]
+ rules?: any[]
[key: string]: any
},
options?: any[]
+ doubleClick?: (record: any, index: number, dataIndex: string) => boolean
}
const SourceMap = {
@@ -28,198 +30,235 @@ const type = {
report: '上报',
};
-const BaseColumns: DataTableColumnProps[] = [
- {
- title: '标识',
- dataIndex: 'id',
- type: 'text'
- },
- {
- title: '名称',
- dataIndex: 'name',
- width: 300,
- type: 'text'
- },
-];
+export const useColumns = (type?: MetadataType, target?: 'device' | 'product', dataSource?: any[], noEditor?: any[]) => {
-const EventColumns: DataTableColumnProps[] = BaseColumns.concat([
- {
- title: '事件级别',
- dataIndex: 'expands',
- type: 'components',
- components: {
- name: SelectColumn,
- props: {
- options: EventLevel
+ const BaseColumns: DataTableColumnProps[] = [
+ {
+ title: '标识',
+ dataIndex: 'id',
+ type: 'text',
+ form: {
+ rules: [{
+ validator(_:any,value: any) {
+ const hasId = dataSource?.find?.((item) => item.id === value)
+ if (value) {
+ if (hasId) {
+ return Promise.reject('标识重复')
+ }
+ return Promise.resolve()
+ }
+ return Promise.reject('请输入标识')
+ }
+ }]
}
- }
- },
- {
- title: '输出参数',
- dataIndex: 'outInput',
- },
- {
- title: '配置参数',
- dataIndex: 'properties',
- type: 'components',
- components: {
- name: ConfigParams,
- }
- },
- {
- title: '说明',
- dataIndex: 'description',
- type: 'text',
- },
- {
- title: '操作',
- dataIndex: 'action',
- width: 120
- }
-]);
-
-const FunctionColumns: DataTableColumnProps[] = BaseColumns.concat([
- {
- title: '是否异步',
- dataIndex: 'async',
- type: 'components',
- components: {
- name: AsyncSelect,
- props: {
- options: [
- { label: '是', value: true },
- { label: '否', value: false }
- ]
+ },
+ {
+ title: '名称',
+ dataIndex: 'name',
+ width: 300,
+ type: 'text',
+ form: {
+ rules: [{
+ required: true,
+ message: '请输入名称'
+ }]
}
- }
- },
- {
- title: '输入参数',
- dataIndex: 'inputs',
- type: 'components',
- components: {
- name: InputParams,
- }
- },
- {
- title: '输出参数',
- dataIndex: 'output',
- type: 'components',
- components: {
- name: OutputParams
- }
- },
- {
- title: '说明',
- dataIndex: 'description',
- type: 'text',
- },
- {
- title: '操作',
- dataIndex: 'action',
- width: 120
- }
- // {
- // title: '读写类型',
- // dataIndex: 'expands',
- // render: (text: any) => (text?.type || []).map((item: string | number) => {type[item]}),
- // },
-]);
+ },
+ ];
-const PropertyColumns: DataTableColumnProps[] = BaseColumns.concat([
- {
- title: '数据类型',
- dataIndex: 'valueType',
- type: 'components',
- components: {
- name: DataType
+ const EventColumns: DataTableColumnProps[] = BaseColumns.concat([
+ {
+ title: '事件级别',
+ dataIndex: 'expands',
+ type: 'components',
+ components: {
+ name: SelectColumn,
+ props: {
+ options: EventLevel
+ }
+ }
},
- width: 230
- },
- {
- title: '属性来源',
- dataIndex: 'expands',
- type: 'components',
- components: {
- name: Source
+ {
+ title: '输出参数',
+ dataIndex: 'outInput',
},
- form: {
- required: true,
- rules: [
- {
- validator: async (_: Record, value: any) => {
- if (value.source) {
- if(value.source !== 'rule') {
- if(value.type?.length) {
- return Promise.resolve();
+ {
+ title: '配置参数',
+ dataIndex: 'properties',
+ type: 'components',
+ components: {
+ name: ConfigParams,
+ }
+ },
+ {
+ title: '说明',
+ dataIndex: 'description',
+ type: 'text',
+ },
+ {
+ title: '操作',
+ dataIndex: 'action',
+ width: 120
+ }
+ ]);
+
+ const FunctionColumns: DataTableColumnProps[] = BaseColumns.concat([
+ {
+ title: '是否异步',
+ dataIndex: 'async',
+ type: 'components',
+ components: {
+ name: AsyncSelect,
+ props: {
+ options: [
+ { label: '是', value: true },
+ { label: '否', value: false }
+ ]
+ }
+ }
+ },
+ {
+ title: '输入参数',
+ dataIndex: 'inputs',
+ type: 'components',
+ components: {
+ name: InputParams,
+ }
+ },
+ {
+ title: '输出参数',
+ dataIndex: 'output',
+ type: 'components',
+ components: {
+ name: OutputParams
+ }
+ },
+ {
+ title: '说明',
+ dataIndex: 'description',
+ type: 'text',
+ },
+ {
+ title: '操作',
+ dataIndex: 'action',
+ width: 120
+ }
+ // {
+ // title: '读写类型',
+ // dataIndex: 'expands',
+ // render: (text: any) => (text?.type || []).map((item: string | number) => {type[item]}),
+ // },
+ ]);
+
+ const PropertyColumns: DataTableColumnProps[] = BaseColumns.concat([
+ {
+ title: '数据类型',
+ dataIndex: 'valueType',
+ type: 'components',
+ components: {
+ name: DataType
+ },
+ width: 230
+ },
+ {
+ title: '属性来源',
+ dataIndex: 'expands',
+ type: 'components',
+ components: {
+ name: Source
+ },
+ doubleClick(){
+ return target !== 'device'
+ },
+ form: {
+ required: true,
+ rules: [
+ {
+ validator: async (_: Record, value: any) => {
+ if (value.source) {
+ if(value.source !== 'rule') {
+ if(value.type?.length) {
+ return Promise.resolve();
+ } else {
+ return Promise.reject('请选择读写类型');
+ }
} else {
- return Promise.reject('请选择读写类型');
+ if(value.virtualRule?.rule?.script) {
+ return Promise.resolve();
+ }else {
+ return Promise.reject('请配置规则');
+ }
}
} else {
- if(value.virtualRule?.rule?.script) {
- return Promise.resolve();
- }else {
- return Promise.reject('请配置规则');
- }
+ return Promise.reject('请选择属性来源');
}
- } else {
- return Promise.reject('请选择属性来源');
}
- }
- },
- ]
+ },
+ ]
+ },
+ width: 150
},
- width: 150
- },
- {
- title: '其它配置',
- dataIndex: 'other',
- type: 'components',
- width: 100,
- components: {
- name: OtherSetting
+ {
+ title: '其它配置',
+ dataIndex: 'other',
+ width: 100,
},
- },
- {
- title: '操作',
- dataIndex: 'action',
- width: 120
- }
-]);
-
-const TagColumns: DataTableColumnProps[] = BaseColumns.concat([
- {
- title: '数据类型',
- dataIndex: 'valueType',
- type: 'components',
- components: {
- name: DataType,
+ {
+ title: '操作',
+ dataIndex: 'action',
+ width: 120
}
- },
- {
- title: '读写类型',
- dataIndex: 'readType',
- type: 'components',
- components: {
- name: TagsType
+ ]);
+
+ const TagColumns: DataTableColumnProps[] = BaseColumns.concat([
+ {
+ title: '数据类型',
+ dataIndex: 'valueType',
+ type: 'components',
+ components: {
+ name: DataType,
+ }
+ },
+ {
+ title: '读写类型',
+ dataIndex: 'readType',
+ type: 'components',
+ components: {
+ name: TagsType
+ }
+ },
+ {
+ title: '说明',
+ dataIndex: 'description',
+ type: 'text',
+ },
+ {
+ title: '操作',
+ dataIndex: 'action',
+ width: 120
}
- },
- {
- title: '说明',
- dataIndex: 'description',
- type: 'text',
- },
- {
- title: '操作',
- dataIndex: 'action',
- width: 120
- }
-]);
+ ]);
-const MetadataMapping = new Map();
-MetadataMapping.set('properties', PropertyColumns);
-MetadataMapping.set('events', EventColumns);
-MetadataMapping.set('tags', TagColumns);
-MetadataMapping.set('functions', FunctionColumns);
+ const columns = computed(() => {
+ switch(type) {
+ case 'properties':
+ return PropertyColumns;
+ case 'events':
+ return EventColumns
+ case 'tags':
+ return TagColumns
+ case 'functions':
+ return FunctionColumns
+ }
+ })
+ return {columns}
+}
-export default MetadataMapping;
\ No newline at end of file
+
+// const MetadataMapping = new Map();
+// MetadataMapping.set('properties', PropertyColumns);
+// MetadataMapping.set('events', EventColumns);
+// MetadataMapping.set('tags', TagColumns);
+// MetadataMapping.set('functions', FunctionColumns);
+//
+// export default MetadataMapping;
\ No newline at end of file
diff --git a/src/views/device/components/Metadata/Base/components/Constraint.vue b/src/views/device/components/Metadata/Base/components/Constraint.vue
new file mode 100644
index 00000000..7aac1b7a
--- /dev/null
+++ b/src/views/device/components/Metadata/Base/components/Constraint.vue
@@ -0,0 +1,45 @@
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/views/device/components/Metadata/Base/components/DataType.vue b/src/views/device/components/Metadata/Base/components/DataType.vue
index f10b0120..0aefdafc 100644
--- a/src/views/device/components/Metadata/Base/components/DataType.vue
+++ b/src/views/device/components/Metadata/Base/components/DataType.vue
@@ -15,7 +15,18 @@
:columns="[
{ title: '参数标识', dataIndex: 'id', type: 'text', width: 100 },
{ title: '参数名称', dataIndex: 'name', type: 'text', width: 100 },
- { title: '填写约束', dataIndex: 'required', type: 'booleanSelect', width: 100, components: { props: { tureTitle: '必填', falseTitle: '不必填' }} },
+ {
+ title: '填写约束',
+ dataIndex: 'required',
+ type: 'components',
+ width: 100,
+ components: {
+ name: ConstraintSelect,
+ props: {
+ name: ['expands', 'required']
+ }
+ }
+ },
{
title: '数据类型',
type: 'components',
@@ -65,16 +76,16 @@
/>
-
+ v-model:value="_valueType.maxLength"
+ />