index.vue 2.73 KB
<template>
  <div>
    <a-form
      ref="formRef"
      :model="scriptForm"
      name="basic"
      :label-col="{ span: 4 }"
      :wrapper-col="{ span: 16 }"
      autocomplete="off"
      style="margin-left: 2.4rem"
    >
      <a-form-item
        v-if="deviceTypeStr !== TypeEnum.SENSOR"
        label="鉴权脚本"
        name="authScriptId"
        :rules="[{ required: true, message: '请选择鉴权脚本' }]"
      >
        <ScriptSelectItem
          ref="scriptSelectItemAuthRef"
          v-model:value="scriptForm.authScriptId"
          :scriptType="ScriptTypeEnum.TRANSPORT_TCP_AUTH"
        />
      </a-form-item>
      <a-form-item
        label="上行脚本"
        name="upScriptId"
        :rules="[{ required: true, message: '请选择上行脚本' }]"
      >
        <ScriptSelectItem
          ref="scriptSelectItemUpRef"
          v-model:value="scriptForm.upScriptId"
          :scriptType="ScriptTypeEnum.TRANSPORT_TCP_UP"
        />
      </a-form-item>
    </a-form>
  </div>
</template>
<script lang="ts" setup name="index">
  import { reactive, ref } from 'vue';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { ScriptSelectItem } from './components';
  import { ScriptTypeEnum } from '/@/views/rule/script/TcpConversionScript/config';
  import { TypeEnum } from '/@/views/device/list/config/data';

  const props = defineProps({
    deviceTypeStr: { type: String, default: '' },
  });

  const scriptForm = reactive({
    authScriptId: '',
    upScriptId: '',
  });

  const { createMessage } = useMessage();

  const scriptSelectItemAuthRef = ref<InstanceType<typeof ScriptSelectItem>>();

  const scriptSelectItemUpRef = ref<InstanceType<typeof ScriptSelectItem>>();

  const getFormData = async () => {
    scriptForm.authScriptId = scriptSelectItemAuthRef.value?.getValue();
    scriptForm.upScriptId = scriptSelectItemUpRef.value?.getValue();
    //业务 网关子设备没有鉴权脚本
    if (props.deviceTypeStr === TypeEnum.SENSOR) Reflect.deleteProperty(scriptForm, 'authScriptId');
    if (Object.values(scriptForm).some((item) => !item)) {
      createMessage.error('请先选择对应脚本');
      throw new Error('请先选择对应脚本');
    }
    return {
      ...scriptForm,
      type: 'TCP',
    };
  };

  const resetFormData = () => {};

  const setFormData = (data) => {
    scriptForm.authScriptId = data?.authScriptId;
    scriptForm.upScriptId = data?.upScriptId;
    scriptSelectItemAuthRef.value?.setValue(data?.authScriptId);
    scriptSelectItemUpRef.value?.setValue(data?.upScriptId);
  };
  defineExpose({
    getFormData,
    resetFormData,
    setFormData,
  });
</script>
<style lang="less" scoped></style>