fix: 优化物模型-功能定义-(输入、输出)

2023-07-07 18:21:17 +08:00 · 2023-07-07 18:21:17 +08:00 · 9eacdb2687
parent 7c2f4c410c
commit 9eacdb2687
6 changed files with 179 additions and 146 deletions
--- a/src/views/device/components/Metadata/Base/DetailModal/PropertiesModal.vue
+++ b/src/views/device/components/Metadata/Base/DetailModal/PropertiesModal.vue
@ -135,7 +135,7 @@ const handleDataTable = (type: string) => {
          break;
    case 'boolean':
      dataTypeTable.dataSource = {
-        ...props.data.valueType
+        ...omit(props.data.valueType, ['type'])
      }
      break;
    case 'array':
--- a/src/views/device/components/Metadata/Base/columns.tsx
+++ b/src/views/device/components/Metadata/Base/columns.tsx
@ -32,6 +32,36 @@ const type = {
  report: '上报',
 };

+export const handleTypeValue = (type:string, value: any = {}) => {
+  let obj: any = {}
+  switch (type) {
+    case 'array':
+      obj.elementType = value
+      break;
+    case 'object':
+      obj.properties = value
+      break;
+    case 'int':
+    case 'long':
+      obj.unit = value
+      break;
+    case 'file':
+      obj.fileType = value
+      break;
+    case 'date':
+      obj.format = value
+      break;
+    case 'string':
+    case 'password':
+      obj.maxLength = value
+      break;
+    default:
+      obj = value
+      break;
+  }
+  return obj
+}
+
 export const typeSelectChange = (type: string) => {
  let obj: any = {}
  switch (type) {
--- a/src/views/device/components/Metadata/Base/components/Constraint.vue
+++ b/src/views/device/components/Metadata/Base/components/Constraint.vue
@ -20,7 +20,7 @@ const props = defineProps({
  },
  name: {
    type: [String, Array],
-    default: 'required'
+    default: ['expands','required']
  }
 })

@ -28,10 +28,10 @@ const emit = defineEmits(['update:value'])

 const myValue = ref()

-const change = () => {
+const change = (e) => {
  const newData = { ...props.value }
  set(newData, props.name, myValue.value)
-  console.log(newData);
+  console.log(newData, e);
  emit('update:value', newData)
 }

--- a/src/views/device/components/Metadata/Base/components/DataType.vue
+++ b/src/views/device/components/Metadata/Base/components/DataType.vue
@ -8,14 +8,77 @@
            v-model:value="_valueType.elementType"
            :unitOptions="options"
            placement="topRight"
-            @confirm="valueChange"
+            @confirm="(data) => {valueChange(data, 'array')}"
        />
        <DataTableObject
            v-else-if="type === 'object'"
            :value="_valueType.properties"
            placement="topRight"
-            :columns="[
-                {
+            :columns="columns"
+            @confirm="(data) => {valueChange(data, 'object')}"
+        >
+            <template #valueType="{ data }">
+                {{ data.record.valueType?.type }}
+            </template>
+            <template #config="{ data }">
+<!--                <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="(data) => {valueChange(data, 'enum')}"/>
+        <DataTableBoolean v-else-if="type === 'boolean'" v-model:value="_valueType" placement="topRight" @confirm="(data) => {valueChange(data, 'boolean')}" />
+        <DataTableDouble
+            v-else-if="['float', 'double'].includes(type)"
+            :options="options"
+            v-model:value="_valueType"
+            placement="topRight"
+            @confirm="(data) => {valueChange(data, 'float')}"
+        />
+        <DataTableInteger
+            v-else-if="['int', 'long'].includes(type)"
+            :options="options"
+            v-model:value="_valueType.unit"
+            placement="topRight"
+            @confirm="(data) => {valueChange(data, 'int')}"
+        />
+        <DataTableFile v-else-if="type === 'file'" v-model:value="_valueType.fileType" placement="topRight" @confirm="(data) => {valueChange(data, 'file')}"/>
+        <DataTableDate v-else-if="type === 'date'" v-model:value="_valueType.format" placement="topRight" @confirm="(data) => {valueChange(data, 'date')}"/>
+        <DataTableString
+            v-else-if="['string', 'password'].includes(type)"
+            v-model:value="_valueType.maxLength"
+            placement="topRight"
+            @confirm="(data) => {valueChange(data, 'string')}"
+        />
+    </div>
+</template>
+
+<script setup lang="ts" name="MetadataDataType">
+import { getUnit } from '@/api/device/instance';
+import { ValueObject } from '../components'
+import {
+    DataTableTypeSelect,
+    DataTableArray,
+    DataTableString,
+    DataTableInteger,
+    DataTableDouble,
+    DataTableBoolean,
+    DataTableEnum,
+    DataTableFile,
+    DataTableDate,
+    DataTableObject,
+} from 'jetlinks-ui-components';
+import { cloneDeep } from 'lodash-es';
+import {handleTypeValue, typeSelectChange} from '../columns'
+import ConfigModal from './ConfigModal.vue'
+
+const props = defineProps({
+    value: {
+        type: Object,
+        default: () => ({}),
+    },
+});
+
+const columns = [{
  title: '参数标识',
  dataIndex: 'id',
  type: 'text',
@ -24,11 +87,11 @@
    required: true,
    rules: [{
      callback() {
-
+        return Promise.resolve()
      }
    }]
  }
-                },
+},
  {
    title: '参数名称',
    dataIndex: 'name',
@ -63,69 +126,7 @@
    title: '操作',
    dataIndex: 'action',
    width: 60
-                }
-            ]"
-            @confirm="valueChange"
-        >
-            <template #valueType="{ data }">
-                {{ data.record.valueType?.type }}
-            </template>
-            <template #config="{ data }">
-<!--                <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"/>
-        <DataTableBoolean v-else-if="type === 'boolean'" v-model:value="_valueType" placement="topRight" @confirm="valueChange"/>
-        <DataTableDouble
-            v-else-if="['float', 'double'].includes(type)"
-            :options="options"
-            v-model:value="_valueType"
-            placement="topRight"
-            @confirm="valueChange"
-        />
-        <DataTableInteger
-            v-else-if="['int', 'long'].includes(type)"
-            :options="options"
-            v-model:value="_valueType.unit"
-            placement="topRight"
-            @confirm="valueChange"
-        />
-        <DataTableFile v-else-if="type === 'file'" v-model:value="_valueType.fileType" placement="topRight" @confirm="valueChange"/>
-        <DataTableDate v-else-if="type === 'date'" v-model:value="_valueType.format" placement="topRight" @confirm="valueChange"/>
-        <DataTableString
-            v-else-if="['string', 'password'].includes(type)"
-            v-model:value="_valueType.maxLength"
-            placement="topRight"
-        />
-    </div>
-</template>
-
-<script setup lang="ts" name="MetadataDataType">
-import { getUnit } from '@/api/device/instance';
-import { ValueObject } from '../components'
-import {
-    DataTableTypeSelect,
-    DataTableArray,
-    DataTableString,
-    DataTableInteger,
-    DataTableDouble,
-    DataTableBoolean,
-    DataTableEnum,
-    DataTableFile,
-    DataTableDate,
-    DataTableObject,
-} from 'jetlinks-ui-components';
-import { cloneDeep } from 'lodash-es';
-import { typeSelectChange } from '../columns'
-import ConfigModal from './ConfigModal.vue'
-
-const props = defineProps({
-    value: {
-        type: Object,
-        default: () => ({}),
-    },
-});
+  }]

 const options = ref<{ label: string; value: string }[]>([]);
 const emit = defineEmits(['update:value']);
@ -144,10 +145,13 @@ const typeChange = (e: string) => {
    });
 };

-const valueChange = () => {
+const valueChange = (_data: any, _type: string) => {
+  console.log(_type, _data)
+  const newData = handleTypeValue(_type, _data)
+  console.log('dataType',{...newData, type: type.value})
  emit('update:value', {
    ...props.value,
-    valueType: {...(_valueType.value || {}), type: type.value},
+    valueType: {...newData, type: type.value},
  });
 }

--- a/src/views/device/components/Metadata/Base/components/Function/InputParams.vue
+++ b/src/views/device/components/Metadata/Base/components/Function/InputParams.vue
@ -1,5 +1,5 @@
 <template>
-  <DataTableObject v-model:value="dataSource" :columns="columns" :onAdd="addItem" width="700px" @confirm="confirm">
+  <DataTableObject :value="dataSource" :columns="columns" :onAdd="addItem" width="700px" @confirm="confirm">
    <template #valueType="{ data }">
      <span>{{ data.record.valueType?.type }}</span>
    </template>
@ -7,7 +7,7 @@
      <span>{{ data.record.expands?.required ? "是": '否' }}</span>
    </template>
    <template #config="{ data }">
-      <OtherConfigInfo :value="data.record.valueType"></OtherConfigInfo>
+      <ConfigModal v-model:value="data.record" />
    </template>
    <j-button>
      <AIcon type="SettingOutlined" />
@ -18,26 +18,12 @@

 <script setup lang="ts" name="InputParams">
 import type { PropType } from 'vue';
-import DataTypeObjectChild from '../DataTypeObjectChild.vue'
+import ConfigModal from '@/views/device/components/Metadata/Base/components/ConfigModal.vue'
 import {
    DataTableObject,
 } from 'jetlinks-ui-components';
 import { ConstraintSelect, OtherConfigInfo, ValueObject } from '../index'

-const addItem = () => {
-  return {
-    id: undefined,
-    name: undefined,
-    valueType: {
-
-    },
-    expands: {
-      required: false
-    }
-  }
-}
-
-const columns = ref()

 type Emits = {
    (e: 'update:value', data: Record<string, any>): void;
@ -60,23 +46,21 @@ const props = defineProps({
    },
 });

-const dataSource = ref(props.value);

-const change = (v: string) => {
-    emit('update:value', { ...props.value, async: dataSource.value });
-    emit('change', v);
-};
+const addItem = () => {
+  return {
+    id: undefined,
+    name: undefined,
+    valueType: {

-watch(
-    () => props.value,
-    (newV) => {
-      dataSource.value = props.value.inputs;
    },
-    { immediate: true },
-);
+    expands: {
+      required: false
+    }
+  }
+}

-watch(() => JSON.stringify(dataSource.value), () => {
-  columns.value = [
+const columns = ref([
  {
    title: '参数标识',
    dataIndex: 'id',
@ -130,14 +114,29 @@ watch(() => JSON.stringify(dataSource.value), () => {
    dataIndex: 'action',
    width: 60
  },
-  ]
-}, { immediate: true})
+])
+
+const dataSource = ref(props.value);
+
+const change = (v: string) => {
+    emit('update:value', { ...props.value, async: dataSource.value });
+    emit('change', v);
+};
+
+watch(
+    () => JSON.stringify(props.value),
+    (newV) => {
+      console.log('inputParams-change')
+      dataSource.value = props.value.inputs;
+    },
+    { immediate: true },
+);

 const confirm = (v: any) => {
-  console.log(v)
+  console.log('inputParams',v)
  emit('update:value', {
    ...props.value,
-    inputs: dataSource.value
+    inputs: v
  })
 }
 </script>
--- a/yarn.lock
+++ b/yarn.lock
@ -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#552bad6c9ef733c941168c01fcfe594317add9e2"
-  integrity sha512-34a8yGQpOHy3DsdRO+pc9Qn5HoeLSGhc2wJhVd22/EbyG5X08EENOsIu+Jg6o/ELmSB2gKnvvhpR4rxawN28hQ==
+  resolved "http://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.24.tgz#7d651f3d333ad52154f5dbbbcba7f6ed8e85e442"
+  integrity sha512-MtIwdFA2kq3s1rGLExYjjjuit05pjoIURDelUIE4swN3q9qh8QgHcjAOtwEor+UNp333LT2FnSQbMkfXctrqUQ==
  dependencies:
    "@vueuse/core" "^9.12.0"
    "@vueuse/router" "^9.13.0"