condition.vue 3.3 KB
<template>
  <CollapseContainer style="background-color: #eeeeee">
    <div style="position: relative">
      <BasicForm
        :labelWidth="100"
        :emptySpan="10"
        :showResetButton="false"
        :showSubmitButton="false"
        @register="registerCondition"
      />
    </div>
  </CollapseContainer>
</template>
<script lang="ts">
  import { defineComponent, ref } from 'vue';
  import { CollapseContainer } from '/@/components/Container/index';
  import { BasicForm, useForm } from '/@/components/Form/index';
  import { Input } from 'ant-design-vue';
  import { useConditionDrawerSchema } from '../config';
  // import { screenLinkPageByDeptIdGetDevice } from '/@/api/ruleengine/ruleengineApi';

  export default defineComponent({
    components: { CollapseContainer, BasicForm, [Input.name]: Input },
    props: ['deviceInfo1', 'editConditionFather', 'newConditionMapFather'],

    setup(props) {
      const fieldValue: any = ref({});
      const [registerCondition, { setFieldsValue, getFieldsValue, updateSchema, resetFields }] =
        useForm({
          labelWidth: 100,
          schemas: useConditionDrawerSchema,
          actionColOptions: { span: 24 },
        });
      const getFieldsValueFunc = () => {
        fieldValue.value = getFieldsValue();
        return fieldValue.value;
      };
      const resetFieldsValueFunc = () => {
        resetFields();
      };
      // watch(
      //   () => props.deviceInfo1,
      //   async (newV) => {
      //     const options = await screenLinkPageByDeptIdGetDevice({ organizationId: newV });
      //     options.items.forEach((v) => {
      //       return (v.value = v.id), (v.label = v.name);
      //     });
      //     updateSchema({
      //       field: 'entityId',
      //       componentProps: {
      //         options: options.items,
      //       },
      //     });
      //   }
      // );
      const updateFieldDeviceId = (v) => {
        setTimeout(() => {
          updateSchema({
            field: 'entityId',
            componentProps: {
              options: v,
            },
          });
        }, 10);
      };

      //回显数据
      const setFieldsFormValueFun = () => {
        if (props.editConditionFather !== 1) {
          setTimeout(() => {
            setFieldsValue(props.editConditionFather);
          }, 100);
        }
      };
      setFieldsFormValueFun();
      const editSelectDevice = () => {
        if (props.newConditionMapFather !== 1) {
          setTimeout(() => {
            updateSchema({
              field: 'entityId',
              componentProps: {
                options: props.newConditionMapFather,
              },
            });
          }, 100);
        }
      };
      editSelectDevice();
      //新增清空设备选择
      const clearSelectDevice = () => {
        updateSchema({
          field: 'entityId',
          componentProps: {
            options: [],
          },
        });
      };
      // const editSelectDevice = (v) => {
      //   updateSchema({
      //     field: 'entityId',
      //     componentProps: {
      //       options: v,
      //     },
      //   });
      // };
      return {
        updateFieldDeviceId,
        resetFieldsValueFunc,
        clearSelectDevice,
        editSelectDevice,
        getFieldsValueFunc,
        registerCondition,
      };
    },
  });
</script>