94 lines
2.3 KiB
Vue
94 lines
2.3 KiB
Vue
<template>
|
|
<el-form ref="ruleFormRef" :model="newFormInline" label-width="82px">
|
|
<el-row :gutter="30">
|
|
<re-col :value="24" :xm="24" :sm="24">
|
|
<el-form-item label="国际化key" prop="key">
|
|
<el-input
|
|
v-model="newFormInline.key"
|
|
placeholder="请输入国际化关键词~"
|
|
clearable
|
|
class="w-full"
|
|
/>
|
|
</el-form-item>
|
|
</re-col>
|
|
<re-col :value="24" :xm="24" :sm="24">
|
|
<el-form-item label="语言类型" prop="locale_id">
|
|
<el-select
|
|
v-model="newFormInline.locale_id"
|
|
placeholder="请选择语言类型~"
|
|
clearable
|
|
class="w-full"
|
|
>
|
|
<el-option
|
|
v-for="item in localeList"
|
|
:key="item.id"
|
|
:label="item.name"
|
|
:value="item.id"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</re-col>
|
|
<re-col :value="24" :xm="24" :sm="24">
|
|
<el-form-item label="国际化值" prop="translation">
|
|
<el-input
|
|
v-model="newFormInline.translation"
|
|
placeholder="请输入国际化值~"
|
|
clearable
|
|
class="w-full"
|
|
/>
|
|
</el-form-item>
|
|
</re-col>
|
|
</el-row>
|
|
</el-form>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted } from "vue";
|
|
import ReCol from "@/components/ReCol";
|
|
import { LanguageInfo } from "types/system";
|
|
import { getLocaleListAPI } from "@/api/i18n";
|
|
import { message } from "@/utils/message";
|
|
const ruleFormRef = ref();
|
|
interface PropsInfo {
|
|
title: string;
|
|
key: string;
|
|
locale_id: string;
|
|
translation: string;
|
|
}
|
|
|
|
type ProsData = {
|
|
formInline: PropsInfo;
|
|
};
|
|
const props = withDefaults(defineProps<ProsData>(), {
|
|
formInline: () => ({
|
|
title: "新增",
|
|
key: "",
|
|
locale_id: "",
|
|
translation: ""
|
|
})
|
|
});
|
|
const newFormInline = ref<PropsInfo>(props.formInline);
|
|
defineExpose({ newFormInline });
|
|
/**语言类型 */
|
|
const localeList = ref<LanguageInfo[]>([]);
|
|
|
|
/**
|
|
* 获取语言类型
|
|
*/
|
|
const getLocaleList = async () => {
|
|
const res = await getLocaleListAPI({
|
|
page: 1,
|
|
pageSize: 9999
|
|
});
|
|
if (res.success) {
|
|
localeList.value = res.data.result;
|
|
}
|
|
message(res.msg, {
|
|
type: res.success ? "success" : "error"
|
|
});
|
|
};
|
|
onMounted(async () => {
|
|
await getLocaleList();
|
|
});
|
|
</script>
|