snowy/snowy-admin-web/src/views/dev/config/fileConfig/localFileForm.vue

87 lines
2.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<a-spin :spinning="loadSpinning">
<a-form
ref="formRef"
:model="formData"
:rules="formRules"
layout="vertical"
:label-col="{ ...layout.labelCol, offset: 0 }"
:wrapper-col="{ ...layout.wrapperCol, offset: 0 }"
>
<a-form-item label="WINDOWS存储位置" name="SNOWY_FILE_LOCAL_FOLDER_FOR_WINDOWS">
<a-input v-model:value="formData.SNOWY_FILE_LOCAL_FOLDER_FOR_WINDOWS" placeholder="请输入WINDOWS存储位置" />
</a-form-item>
<a-form-item label="LINUX存储位置" name="SNOWY_FILE_LOCAL_FOLDER_FOR_UNIX">
<a-input v-model:value="formData.SNOWY_FILE_LOCAL_FOLDER_FOR_UNIX" placeholder="请输入LINUX存储位置" />
</a-form-item>
<a-form-item>
<a-button type="primary" :loading="submitLoading" @click="onSubmit()"></a-button>
<a-button class="xn-ml10" @click="() => formRef.resetFields()">重置</a-button>
</a-form-item>
</a-form>
</a-spin>
</template>
<script setup name="localFileForm">
import { cloneDeep } from 'lodash-es'
import { required } from '@/utils/formRules'
import { message } from 'ant-design-vue'
import configApi from '@/api/dev/configApi'
const formRef = ref()
const formData = ref({})
const submitLoading = ref(false)
const loadSpinning = ref(true)
// 查询此界面的配置项,并转为表单
const param = {
category: 'FILE_LOCAL'
}
configApi.configList(param).then((data) => {
loadSpinning.value = false
if (data) {
data.forEach((item) => {
formData.value[item.configKey] = item.configValue
})
} else {
message.warning('表单项不存在,请初始化数据库')
}
})
// 默认要校验的
const formRules = {
SNOWY_FILE_LOCAL_FOLDER_FOR_WINDOWS: [required('请输入WINDOWS存储位置')],
SNOWY_FILE_LOCAL_FOLDER_FOR_UNIX: [required('请输入LINUX存储位置')]
}
// 验证并提交数据
const onSubmit = () => {
formRef.value
.validate()
.then(() => {
submitLoading.value = true
let submitParam = cloneDeep(formData.value)
const param = Object.entries(submitParam).map((item) => {
return {
configKey: item[0],
configValue: item[1]
}
})
configApi
.configEditForm(param)
.then(() => {})
.finally(() => {
submitLoading.value = false
})
})
.catch(() => {})
}
const layout = {
labelCol: {
span: 4
},
wrapperCol: {
span: 12
}
}
</script>