github.com/e154/smart-home@v0.17.2-0.20240311175135-e530a6e5cd45/static_source/admin/src/views/Automation/Conditions/new.vue (about)

     1  <script setup lang="ts">
     2  import {ref, unref} from 'vue'
     3  import {useI18n} from '@/hooks/web/useI18n'
     4  import {ElButton, ElMessage} from 'element-plus'
     5  import {useForm} from '@/hooks/web/useForm'
     6  import {useCache} from '@/hooks/web/useCache'
     7  import {useRoute, useRouter} from 'vue-router'
     8  import {useValidator} from '@/hooks/web/useValidator'
     9  import api from "@/api/api";
    10  import Form from './components/Form.vue'
    11  import {ApiCondition, ApiNewConditionRequest} from "@/api/stub";
    12  import {ContentWrap} from "@/components/ContentWrap";
    13  import ConditionForm from "@/views/Automation/components/ConditionForm.vue";
    14  
    15  const {register, elFormRef, methods} = useForm()
    16  const {required} = useValidator()
    17  const {currentRoute, addRoute, push} = useRouter()
    18  const route = useRoute();
    19  const {wsCache} = useCache()
    20  const {t} = useI18n()
    21  
    22  const writeRef = ref<ComponentRef<typeof Form>>()
    23  const loading = ref(false)
    24  const currentRow = ref<Nullable<ApiCondition>>(null)
    25  
    26  const save = async () => {
    27    const write = unref(writeRef)
    28    const validate = await write?.elFormRef?.validate()?.catch(() => {
    29    })
    30    if (validate) {
    31      loading.value = true
    32      const tr = (await write?.getFormData()) as ApiCondition;
    33      const data = {
    34        name: tr.name,
    35        description: tr.description,
    36        scriptId: tr.script?.id,
    37        areaId: tr.area?.id,
    38      } as ApiNewConditionRequest
    39      const res = await api.v1.conditionServiceAddCondition(data)
    40          .catch(() => {
    41          })
    42          .finally(() => {
    43            loading.value = false
    44          })
    45      if (res) {
    46        ElMessage({
    47          title: t('Success'),
    48          message: t('message.createdSuccessfully'),
    49          type: 'success',
    50          duration: 2000
    51        })
    52  
    53        cancel()
    54      }
    55    }
    56  }
    57  
    58  const cancel = () => {
    59    push('/automation/conditions')
    60  }
    61  
    62  </script>
    63  
    64  <template>
    65    <ContentWrap>
    66      <ConditionForm ref="writeRef" :condition="currentRow"/>
    67  
    68      <div style="text-align: right">
    69  
    70        <ElButton type="primary" @click="save()">
    71          {{ t('main.save') }}
    72        </ElButton>
    73  
    74        <ElButton type="default" @click="cancel()">
    75          {{ t('main.cancel') }}
    76        </ElButton>
    77  
    78      </div>
    79    </ContentWrap>
    80  
    81  </template>
    82  
    83  <style lang="less" scoped>
    84  
    85  </style>