Skip to content

Commit

Permalink
fix: 备份账号 bucket 支持手动输入 (#6381)
Browse files Browse the repository at this point in the history
Refs #6378
  • Loading branch information
ssongliu committed Sep 5, 2024
1 parent 7561287 commit e87fb7b
Show file tree
Hide file tree
Showing 6 changed files with 148 additions and 185 deletions.
1 change: 1 addition & 0 deletions frontend/src/api/interface/backup.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ export namespace Backup {
type: string;
accessKey: string;
bucket: string;
bucketInput: boolean;
credential: string;
backupPath: string;
vars: string;
Expand Down
66 changes: 28 additions & 38 deletions frontend/src/views/setting/backup-account/cos/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -54,18 +54,17 @@
</template>
</el-input>
</el-form-item>
<el-form-item label="Bucket" prop="bucket">
<el-select
@change="errBuckets = false"
style="width: 80%"
v-model="cosData.rowData!.bucket"
>
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets(formRef)">
{{ $t('setting.loadBucket') }}
</el-button>
<span v-if="errBuckets" class="input-error">{{ $t('commons.rule.requiredSelect') }}</span>
<el-form-item label="Bucket" prop="bucket" :rules="Rules.requiredInput">
<el-checkbox v-model="cosData.rowData!.bucketInput" :label="$t('container.input')" />
<el-input clearable v-if="cosData.rowData!.bucketInput" v-model="cosData.rowData!.bucket" />
<div v-else class="w-full">
<el-select style="width: 80%" v-model="cosData.rowData!.bucket">
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets()">
{{ $t('setting.loadBucket') }}
</el-button>
</div>
</el-form-item>
<el-form-item
:label="$t('setting.scType')"
Expand Down Expand Up @@ -122,7 +121,6 @@ type FormInstance = InstanceType<typeof ElForm>;
const formRef = ref<FormInstance>();
const buckets = ref();
const regionInput = ref();
const errBuckets = ref();
const endpointProto = ref('http');
const emit = defineEmits(['search']);
Expand Down Expand Up @@ -181,35 +179,27 @@ const handleClose = () => {
drawerVisible.value = false;
};
const getBuckets = async (formEl: FormInstance | undefined) => {
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
loading.value = true;
let item = deepCopy(cosData.value.rowData!.varsJson);
item['endpoint'] = spliceHttp(endpointProto.value, cosData.value.rowData!.varsJson['endpointItem']);
listBucket({
type: cosData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: cosData.value.rowData!.accessKey,
credential: cosData.value.rowData!.credential,
const getBuckets = async () => {
loading.value = true;
let item = deepCopy(cosData.value.rowData!.varsJson);
item['endpoint'] = spliceHttp(endpointProto.value, cosData.value.rowData!.varsJson['endpointItem']);
listBucket({
type: cosData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: cosData.value.rowData!.accessKey,
credential: cosData.value.rowData!.credential,
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.catch(() => {
buckets.value = [];
loading.value = false;
});
});
.catch(() => {
buckets.value = [];
loading.value = false;
});
};
const onSubmit = async (formEl: FormInstance | undefined) => {
if (!cosData.value.rowData.bucket) {
errBuckets.value = true;
return;
}
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
Expand Down
68 changes: 31 additions & 37 deletions frontend/src/views/setting/backup-account/kodo/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -36,18 +36,21 @@
</template>
</el-input>
</el-form-item>
<el-form-item label="Bucket" prop="bucket">
<el-select
@change="errBuckets = false"
style="width: 80%"
<el-form-item label="Bucket" prop="bucket" :rules="Rules.requiredInput">
<el-checkbox v-model="kodoData.rowData!.bucketInput" :label="$t('container.input')" />
<el-input
clearable
v-if="kodoData.rowData!.bucketInput"
v-model="kodoData.rowData!.bucket"
>
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets(formRef)">
{{ $t('setting.loadBucket') }}
</el-button>
<span v-if="errBuckets" class="input-error">{{ $t('commons.rule.requiredSelect') }}</span>
/>
<div v-else class="w-full">
<el-select style="width: 80%" v-model="kodoData.rowData!.bucket">
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets()">
{{ $t('setting.loadBucket') }}
</el-button>
</div>
</el-form-item>

<el-form-item :label="$t('cronjob.requestExpirationTime')" prop="varsJson.timeout">
Expand Down Expand Up @@ -95,7 +98,6 @@ const loading = ref(false);
type FormInstance = InstanceType<typeof ElForm>;
const formRef = ref<FormInstance>();
const buckets = ref();
const errBuckets = ref();
const domainProto = ref('http');
const emit = defineEmits(['search']);
Expand Down Expand Up @@ -129,35 +131,27 @@ const handleClose = () => {
drawerVisible.value = false;
};
const getBuckets = async (formEl: FormInstance | undefined) => {
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
loading.value = true;
let item = deepCopy(kodoData.value.rowData!.varsJson);
item['domain'] = spliceHttp(domainProto.value, kodoData.value.rowData!.varsJson['domainItem']);
listBucket({
type: kodoData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: kodoData.value.rowData!.accessKey,
credential: kodoData.value.rowData!.credential,
const getBuckets = async () => {
loading.value = true;
let item = deepCopy(kodoData.value.rowData!.varsJson);
item['domain'] = spliceHttp(domainProto.value, kodoData.value.rowData!.varsJson['domainItem']);
listBucket({
type: kodoData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: kodoData.value.rowData!.accessKey,
credential: kodoData.value.rowData!.credential,
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.catch(() => {
buckets.value = [];
loading.value = false;
});
});
.catch(() => {
buckets.value = [];
loading.value = false;
});
};
const onSubmit = async (formEl: FormInstance | undefined) => {
if (!kodoData.value.rowData.bucket) {
errBuckets.value = true;
return;
}
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
Expand Down
70 changes: 32 additions & 38 deletions frontend/src/views/setting/backup-account/minio/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -32,18 +32,21 @@
</template>
</el-input>
</el-form-item>
<el-form-item label="Bucket" prop="bucket">
<el-select
style="width: 80%"
@change="errBuckets = false"
<el-form-item label="Bucket" prop="bucket" :rules="Rules.requiredInput">
<el-checkbox v-model="minioData.rowData!.bucketInput" :label="$t('container.input')" />
<el-input
clearable
v-if="minioData.rowData!.bucketInput"
v-model="minioData.rowData!.bucket"
>
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets(formRef)">
{{ $t('setting.loadBucket') }}
</el-button>
<span v-if="errBuckets" class="input-error">{{ $t('commons.rule.requiredSelect') }}</span>
/>
<div v-else class="w-full">
<el-select style="width: 80%" v-model="minioData.rowData!.bucket">
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets()">
{{ $t('setting.loadBucket') }}
</el-button>
</div>
</el-form-item>
<el-form-item :label="$t('setting.backupDir')" prop="backupPath">
<el-input clearable v-model.trim="minioData.rowData!.backupPath" placeholder="/1panel" />
Expand Down Expand Up @@ -80,7 +83,6 @@ const loading = ref(false);
type FormInstance = InstanceType<typeof ElForm>;
const formRef = ref<FormInstance>();
const buckets = ref();
const errBuckets = ref();
const endpointProto = ref('http');
const emit = defineEmits(['search']);
Expand Down Expand Up @@ -111,36 +113,28 @@ const handleClose = () => {
drawerVisible.value = false;
};
const getBuckets = async (formEl: FormInstance | undefined) => {
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
loading.value = true;
let item = deepCopy(minioData.value.rowData!.varsJson);
item['endpoint'] = spliceHttp(endpointProto.value, minioData.value.rowData!.varsJson['endpointItem']);
item['endpointItem'] = undefined;
listBucket({
type: minioData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: minioData.value.rowData!.accessKey,
credential: minioData.value.rowData!.credential,
const getBuckets = async () => {
loading.value = true;
let item = deepCopy(minioData.value.rowData!.varsJson);
item['endpoint'] = spliceHttp(endpointProto.value, minioData.value.rowData!.varsJson['endpointItem']);
item['endpointItem'] = undefined;
listBucket({
type: minioData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: minioData.value.rowData!.accessKey,
credential: minioData.value.rowData!.credential,
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.catch(() => {
buckets.value = [];
loading.value = false;
});
});
.catch(() => {
buckets.value = [];
loading.value = false;
});
};
const onSubmit = async (formEl: FormInstance | undefined) => {
if (!minioData.value.rowData.bucket) {
errBuckets.value = true;
return;
}
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
Expand Down
66 changes: 28 additions & 38 deletions frontend/src/views/setting/backup-account/oss/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -32,18 +32,17 @@
</template>
</el-input>
</el-form-item>
<el-form-item label="Bucket" prop="bucket">
<el-select
@change="errBuckets = false"
style="width: 80%"
v-model="ossData.rowData!.bucket"
>
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets(formRef)">
{{ $t('setting.loadBucket') }}
</el-button>
<span v-if="errBuckets" class="input-error">{{ $t('commons.rule.requiredSelect') }}</span>
<el-form-item label="Bucket" prop="bucket" :rules="Rules.requiredInput">
<el-checkbox v-model="ossData.rowData!.bucketInput" :label="$t('container.input')" />
<el-input clearable v-if="ossData.rowData!.bucketInput" v-model="ossData.rowData!.bucket" />
<div v-else class="w-full">
<el-select style="width: 80%" v-model="ossData.rowData!.bucket">
<el-option v-for="item in buckets" :key="item" :value="item" />
</el-select>
<el-button style="width: 20%" plain @click="getBuckets()">
{{ $t('setting.loadBucket') }}
</el-button>
</div>
</el-form-item>
<el-form-item
:label="$t('setting.scType')"
Expand Down Expand Up @@ -99,7 +98,6 @@ const loading = ref(false);
type FormInstance = InstanceType<typeof ElForm>;
const formRef = ref<FormInstance>();
const buckets = ref();
const errBuckets = ref();
const endpointProto = ref('http');
const emit = defineEmits(['search']);
Expand Down Expand Up @@ -133,35 +131,27 @@ const handleClose = () => {
drawerVisible.value = false;
};
const getBuckets = async (formEl: FormInstance | undefined) => {
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
loading.value = true;
let item = deepCopy(ossData.value.rowData!.varsJson);
item['endpoint'] = spliceHttp(endpointProto.value, ossData.value.rowData!.varsJson['endpointItem']);
listBucket({
type: ossData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: ossData.value.rowData!.accessKey,
credential: ossData.value.rowData!.credential,
const getBuckets = async () => {
loading.value = true;
let item = deepCopy(ossData.value.rowData!.varsJson);
item['endpoint'] = spliceHttp(endpointProto.value, ossData.value.rowData!.varsJson['endpointItem']);
listBucket({
type: ossData.value.rowData!.type,
vars: JSON.stringify(item),
accessKey: ossData.value.rowData!.accessKey,
credential: ossData.value.rowData!.credential,
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.then((res) => {
loading.value = false;
buckets.value = res.data;
})
.catch(() => {
buckets.value = [];
loading.value = false;
});
});
.catch(() => {
buckets.value = [];
loading.value = false;
});
};
const onSubmit = async (formEl: FormInstance | undefined) => {
if (!ossData.value.rowData.bucket) {
errBuckets.value = true;
return;
}
if (!formEl) return;
formEl.validate(async (valid) => {
if (!valid) return;
Expand Down
Loading

0 comments on commit e87fb7b

Please sign in to comment.