diff --git a/web/.gitignore b/web/.gitignore index c9b45b70..121d8eb4 100644 --- a/web/.gitignore +++ b/web/.gitignore @@ -13,6 +13,7 @@ dist dist-ssr coverage *.local +package-lock.json # Editor directories and files diff --git a/web/src/views/website/BulkCreateModal.vue b/web/src/views/website/BulkCreateModal.vue index 42c8848e..2a3f8dcf 100644 --- a/web/src/views/website/BulkCreateModal.vue +++ b/web/src/views/website/BulkCreateModal.vue @@ -5,11 +5,73 @@ import { useGettext } from 'vue3-gettext' import website from '@/api/panel/website' const show = defineModel('show', { type: Boolean, required: true }) +const type = defineModel('type', { type: String, required: true }) const { $gettext } = useGettext() const bulkCreate = ref('') +// 内部选择的类型(当外部 type 为 'all' 时使用) +const selectedType = ref('proxy') + +// 实际使用的网站类型 +const effectiveType = computed(() => { + if (type.value === 'all') { + return selectedType.value + } + return type.value +}) + +// 批量创建网站请求模型 +interface BulkCreateModel { + type: string + name: string + listens: Array + domains: Array + path: string + proxy: string + remark: string +} + +// 类型选项 +const typeOptions = computed(() => [ + { label: $gettext('Reverse Proxy'), value: 'proxy' }, + { label: $gettext('PHP'), value: 'php' }, + { label: $gettext('Pure Static'), value: 'static' } +]) + +// 获取模态框标题 +const modalTitle = computed(() => { + switch (effectiveType.value) { + case 'proxy': + return $gettext('Bulk Create Reverse Proxy Website') + case 'php': + return $gettext('Bulk Create PHP Website') + case 'static': + return $gettext('Bulk Create Pure Static Website') + default: + return $gettext('Bulk Create Website') + } +}) + +// 获取占位符文本(根据类型不同显示不同格式) +const placeholderText = computed(() => { + if (effectiveType.value === 'proxy') { + return $gettext('name|domain|port|proxy_target|remark') + } + return $gettext('name|domain|port|path|remark') +}) + +// 获取第四列的说明文本 +const fourthColumnHelp = computed(() => { + if (effectiveType.value === 'proxy') { + return $gettext( + 'Proxy Target: The target address for reverse proxy (e.g., http://127.0.0.1:3000).' + ) + } + return $gettext('Path: The path of the website, can be empty to use the default path.') +}) + const handleCreate = async () => { // 按行分割 const lines = bulkCreate.value.split('\n') @@ -32,20 +94,20 @@ const handleCreate = async () => { .trim() .split(',') .map((item) => item.trim()) - const path = (parts[3] ?? '').trim() + const fourthColumn = (parts[3] ?? '').trim() const remark = parts[4] ? parts[4].trim() : '' - let model = { - name: '', - listens: [] as Array, - domains: [] as Array, - path: '', - remark: '' + + // 构建请求模型 + const model: BulkCreateModel = { + type: effectiveType.value, + name: name, + listens: listens, + domains: domains, + path: effectiveType.value === 'proxy' ? '' : fourthColumn, + proxy: effectiveType.value === 'proxy' ? fourthColumn : '', + remark: remark } - model.name = name - model.domains = domains - model.listens = listens - model.path = path - model.remark = remark + // 去除空的域名和端口 model.domains = model.domains.filter((item) => item !== '') model.listens = model.listens.filter((item) => item !== '') @@ -59,13 +121,6 @@ const handleCreate = async () => { window.$message.success( $gettext('Website %{ name } created successfully', { name: model.name }) ) - model = { - name: '', - domains: [] as Array, - listens: [] as Array, - path: '', - remark: '' - } window.$bus.emit('website:refresh') }) } @@ -75,7 +130,7 @@ const handleCreate = async () => {