feat: 多语言批量修改

src/api/v1/i18n.ts

@@ -26,6 +26,11 @@ export const fetchUpdateI18n = (data: any) => {
 	return http.request<BaseResult<object>>('put', 'i18n/updateI18n', { data });
 };
 
+/** 多语言类型管理---用文件更新多语言 */
+export const updateI18nByFile = (data: any) => {
+	return http.request<BaseResult<object>>('put', 'i18n/updateI18nByFile', { data }, { headers: { 'Content-Type': 'multipart/form-data' } });
+};
+
 /** 多语言类型管理---删除多语言 */
 export const fetchDeleteI18n = (data: any) => {
 	return http.request<BaseResult<object>>('delete', 'i18n/deleteI18n', { data });

src/store/i18n/i18n.ts

@@ -1,9 +1,9 @@
-import { defineStore } from 'pinia';
+import { fetchAddI18n, fetchDeleteI18n, fetchDownloadI18nSetting, fetchGetI18n, fetchGetI18nList, fetchUpdateI18n, updateI18nByFile } from '@/api/v1/i18n';
-import { fetchAddI18n, fetchDeleteI18n, fetchDownloadI18nSetting, fetchGetI18n, fetchGetI18nList, fetchUpdateI18n } from '@/api/v1/i18n';
 import { pageSizes } from '@/enums/baseConstant';
-import { storeMessage } from '@/utils/message';
 import { storePagination } from '@/store/useStorePagination';
+import { storeMessage } from '@/utils/message';
 import { download } from '@/utils/sso';
+import { defineStore } from 'pinia';
 
 export const userI18nStore = defineStore('i18nStore', {
 	persist: true,
@@ -71,6 +71,12 @@ export const userI18nStore = defineStore('i18nStore', {
 			return storeMessage(result);
 		},
 
+		/* 用文件更新多语言 */
+		async updateI18nByFile(data: any) {
+			const result = await updateI18nByFile(data);
+			return storeMessage(result);
+		},
+
 		/** 更新多语言 */
 		async updateI18n(data: any) {
 			const result = await fetchUpdateI18n(data);

src/views/i18n/i18n-setting/index.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
 import { userI18nStore } from '@/store/i18n/i18n';
-import { auth, columns, deleteIds, downloadI18nSetting, onAdd, onDelete, onDeleteBatch, onSearch, onUpdate } from '@/views/i18n/i18n-setting/utils';
+import { auth, columns, deleteIds, downloadI18nSetting, onAdd, udateI18nSetting, onDelete, onDeleteBatch, onSearch, onUpdate } from '@/views/i18n/i18n-setting/utils';
 import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
 import AddFill from '@iconify-icons/ri/add-circle-line';
 import EditPen from '@iconify-icons/ep/edit-pen';
@@ -75,6 +75,9 @@ onMounted(() => {
 				<!-- 下载多语言配置 -->
 				<el-button :icon="useRenderIcon(Download)" bg text type="primary" @click="downloadI18nSetting"> 下载配置 </el-button>
 
+				<!-- 下载多语言配置 -->
+				<el-button :icon="useRenderIcon(Download)" bg text type="primary" @click="udateI18nSetting"> 文件更新 </el-button>
+
 				<!-- 添加多语言 -->
 				<el-button v-if="hasAuth(auth.add)" :icon="useRenderIcon(AddFill)" bg text type="primary" @click="onAdd">
 					{{ $t('addNew') }}

src/views/i18n/i18n-setting/utils/hooks.tsx

@@ -1,13 +1,18 @@
-import { h, ref } from 'vue';
-import { userI18nStore } from '@/store/i18n/i18n';
 import { addDialog, closeDialog } from '@/components/BaseDialog/index';
+import { $t } from '@/plugins/i18n';
+import { userI18nStore } from '@/store/i18n/i18n';
+import { userI18nTypeStore } from '@/store/i18n/i18nType';
+import { message, messageBox } from '@/utils/message';
 import I18nDialog from '@/views/i18n/i18n-setting/i18n-dialog.vue';
 import type { FormProps } from '@/views/i18n/i18n-setting/utils/types';
-import { $t } from '@/plugins/i18n';
+import { UploadFilled } from '@element-plus/icons-vue';
-import { messageBox } from '@/utils/message';
+import { ElOption, ElSelect, genFileId, type UploadProps, type UploadRawFile } from 'element-plus';
+import { done } from 'nprogress';
+import { h, reactive, ref } from 'vue';
 
 export const formRef = ref();
 const i18nStore = userI18nStore();
+const i18nTypeStore = userI18nTypeStore();
 export const deleteIds = ref([]);
 
 /* 查询内容 */
@@ -22,6 +27,61 @@ export const downloadI18nSetting = () => {
 	i18nStore.downloadI18nSetting();
 };
 
+/* 下载多语言配置 */
+export const udateI18nSetting = () => {
+	const upload = ref();
+
+	const data = reactive({
+		type: undefined,
+		file: undefined,
+	});
+
+	const handleExceed: UploadProps['onExceed'] = files => {
+		console.log(files);
+		upload.value!.clearFiles();
+		const file = files[0] as UploadRawFile;
+		file.uid = genFileId();
+		upload.value!.handleStart(file);
+	};
+
+	addDialog({
+		title: $t('update_multilingual'),
+		width: '30%',
+		draggable: true,
+		fullscreenIcon: true,
+		closeOnClickModal: false,
+		contentRenderer: () => (
+			<>
+				<ElSelect placeholder={$t('select') + $t('i18n.typeName')} filterable v-model:modelValue={data.type}>
+					{i18nTypeStore.datalist.map(item => (
+						<ElOption key={item.id} label={item.typeName} value={item.typeName} />
+					))}
+				</ElSelect>
+
+				<el-upload ref={upload} auto-upload={false} limit={1} on-exceed={handleExceed} v-model:file-list={data.file} class='w-full mt-2' drag>
+					<el-icon class='el-icon--upload'>
+						<UploadFilled />
+					</el-icon>
+					<div class='el-upload__text'>
+						<em> {`${$t('drop_file_here')} / ${$t('click_to_upload')}`}</em>
+					</div>
+				</el-upload>
+			</>
+		),
+		beforeSure: async (_done, {}) => {
+			const { type, file } = data;
+			if (!type || !file) {
+				message('填写必填项', { type: 'warning', duration: 3666 });
+				return;
+			}
+
+			i18nStore.updateI18nByFile({ type, file: file[0].raw });
+			done();
+			await onSearch();
+		},
+	});
+};
+
 /* 行内容添加 打开添加弹窗 */
 export const onAdd = () => {
 	addDialog({