perf: 优化组态，模板选择，根据组织过滤

@@ -44,7 +44,7 @@ export interface DeviceList {
 
 export type queryPageParams = BasicPageParams & {
   name?: Nullable<string>;
-  organizationId?: Nullable<number>;
+  organizationId?: string;
   isTemplate?: number;
 };
 

@@ -10,6 +10,7 @@
     <BasicForm @register="registerForm">
       <!-- 模板选择 -->
       <template #templateId="{ model }">
+        <span style="display: none">{{ getFieldOrg(model['organizationId']) }}</span>
         <Select
           v-model:value="model['templateId']"
           placeholder="请选择模板"
@@ -35,7 +36,7 @@
   </BasicDrawer>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, computed, unref, Ref, onMounted, nextTick } from 'vue';
+  import { defineComponent, ref, computed, unref, Ref, onMounted, nextTick, watch } from 'vue';
   import { BasicForm, useForm } from '/@/components/Form';
   import { Select } from 'ant-design-vue';
   import { formSchema, PC_DEFAULT_CONTENT, PHONE_DEFAULT_CONTENT, Platform } from './center.data';
@@ -61,11 +62,12 @@
 
       const selectDeviceProfileRef = ref<InstanceType<typeof SelectDeviceProfile>>();
 
-      const [registerForm, { validate, setFieldsValue, resetFields, updateSchema }] = useForm({
-        labelWidth: 120,
-        schemas: formSchema,
-        showActionButtonGroup: false,
-      });
+      const [registerForm, { validate, setFieldsValue, resetFields, updateSchema, clearValidate }] =
+        useForm({
+          labelWidth: 120,
+          schemas: formSchema,
+          showActionButtonGroup: false,
+        });
 
       const updateEnableTemplate = async (enable: number, disabled: boolean) => {
         await setFieldsValue({
@@ -90,6 +92,14 @@
             };
           },
         });
+        await updateSchema({
+          field: 'organizationId',
+          componentProps: () => {
+            return {
+              disabled,
+            };
+          },
+        });
       };
 
       const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
@@ -107,6 +117,7 @@
             ];
           }
           if (data.record.organizationDTO) {
+            organizationIdStr.value = data.record['organizationId'];
             await setFieldsValue(data.record);
           } else {
             Reflect.deleteProperty(data.record, 'organizationId');
@@ -135,16 +146,41 @@
       //新增修改
       const templateDisabled = ref(false);
       onMounted(() => {
-        getTemplate({
-          page: 1,
-          pageSize: 30,
-        });
+        getTemplate(
+          {
+            page: 1,
+            pageSize: 30,
+          },
+          null
+        );
       });
 
       const selectTemplateOptions: Ref<any[]> = ref([]);
 
-      const getTemplate = async (params: queryPageParams) => {
-        const { items } = await getPage({ ...params, isTemplate: 1 });
+      const organizationIdStr = ref('');
+
+      const getFieldOrg = (org: string) => (organizationIdStr.value = org);
+
+      watch(
+        () => organizationIdStr.value,
+        (newValue) => {
+          getTemplate(
+            {
+              page: 1,
+              pageSize: 30,
+            },
+            newValue
+          );
+          if (!isUpdate.value) {
+            setFieldsValue({
+              templateId: null,
+            });
+          }
+        }
+      );
+
+      const getTemplate = async (params: queryPageParams, organizationId) => {
+        const { items } = await getPage({ ...params, isTemplate: 1, organizationId });
         selectTemplateOptions.value = items.map((item) => ({
           ...item,
           label: item.name,
@@ -154,6 +190,7 @@
       const selectOptions: Ref<any[]> = ref([]);
 
       const handleTemplateChange = async (_, option) => {
+        clearValidate('templateId');
         const { productAndDevice } = option;
         setFieldsValue({ platform: option?.platform });
         await nextTick();
@@ -249,6 +286,7 @@
         createPickerSearch,
         selectDeviceProfileRef,
         templateDisabled,
+        getFieldOrg,
       };
     },
   });