Add system-language interface, add field translations widget

app/src/interfaces/system-language/index.ts

@@ -0,0 +1,12 @@
+import InterfaceSystemLanguage from './system-language.vue';
+import { defineInterface } from '@/interfaces/define';
+
+export default defineInterface(({ i18n }) => ({
+	id: 'system-language',
+	name: i18n.t('language'),
+	icon: 'translate',
+	component: InterfaceSystemLanguage,
+	system: true,
+	types: ['string'],
+	options: [],
+}));

app/src/interfaces/system-language/system-language.vue

@@ -0,0 +1,29 @@
+<template>
+	<v-select @input="$listeners.input" :value="value" :items="languages" :disabled="disabled" />
+</template>
+
+<script lang="ts">
+import { defineComponent } from '@vue/composition-api';
+import { availableLanguages } from '@/lang';
+
+export default defineComponent({
+	props: {
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
+		value: {
+			type: String,
+			default: null,
+		},
+	},
+	setup(props) {
+		const languages = Object.entries(availableLanguages).map(([key, value]) => ({
+			text: value,
+			value: key,
+		}));
+
+		return { languages };
+	},
+});
+</script>

app/src/modules/settings/routes/data-model/field-detail/components/schema.vue

@@ -64,6 +64,34 @@
 				<v-checkbox v-model="fieldData.schema.is_nullable" :label="$t('allow_null_label')" block />
 			</div>
 
+			<div class="field full">
+				<div class="label type-label">{{ $t('translation') }}</div>
+				<interface-repeater
+					v-model="fieldData.meta.translation"
+					:template="'{{ locale }}'"
+					:fields="[
+						{
+							field: 'locale',
+							type: 'string',
+							name: $t('language'),
+							meta: {
+								interface: 'system-language',
+								width: 'half',
+							},
+						},
+						{
+							field: 'translation',
+							type: 'string',
+							name: $t('translation'),
+							meta: {
+								interface: 'text-input',
+								width: 'half',
+							},
+						},
+					]"
+				/>
+			</div>
+
 			<!--
 			@todo add unique when the API supports it