|
|
@@ -1,27 +1,48 @@
|
|
|
+<!--
|
|
|
+ * @Author: vera_min vera_min@163.com
|
|
|
+ * @Date: 2025-08-28 16:18:16
|
|
|
+ * @LastEditors: vera_min vera_min@163.com
|
|
|
+ * @LastEditTime: 2025-08-30 12:44:29
|
|
|
+ * @FilePath: /sagoo-admin-ui-dev/src/views/iot/configuration/screen/edit.vue
|
|
|
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
|
|
+-->
|
|
|
<template>
|
|
|
- <el-dialog class="api-edit" v-model="showDialog" :title="`${formData.id ? '编辑大屏' : '新增大屏'}`" width="600px" :close-on-click-modal="false" :close-on-press-escape="false">
|
|
|
- <el-form ref="formRef" :model="formData" :rules="ruleForm" label-width="80px">
|
|
|
- <el-form-item label="大屏名称" prop="projectName">
|
|
|
- <el-input v-model.trim="formData.projectName" placeholder="输入大屏名称" />
|
|
|
+ <!-- 编辑大屏/新增大屏 -->
|
|
|
+ <el-dialog class="api-edit" v-model="showDialog" :title="`${formData.id ? $t('message.configuration.designScreen.editScreen') : $t('message.configuration.designScreen.addScreen')}`" width="600px" :close-on-click-modal="false" :close-on-press-escape="false">
|
|
|
+ <el-form ref="formRef" :model="formData" :rules="ruleForm" :label-width="currentLocale == 'en' ? '120px' : '80px'">
|
|
|
+ <!-- 大屏名称 -->
|
|
|
+ <el-form-item :label="$t('message.configuration.designScreen.screenName')" prop="projectName">
|
|
|
+ <!-- 输入大屏名称 -->
|
|
|
+ <el-input v-model.trim="formData.projectName" :placeholder="$t('message.configuration.designScreen.screenNamePlaceholder')" />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="说明" prop="remarks">
|
|
|
+ <!-- 说明 -->
|
|
|
+ <el-form-item :label="$t('message.configuration.designScreen.remarks')" prop="remarks">
|
|
|
<el-input v-model="formData.remarks" type="textarea" :rows="3" />
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<template #footer>
|
|
|
<div class="dialog-footer">
|
|
|
- <el-button @click="showDialog = false">取消</el-button>
|
|
|
- <el-button type="primary" @click="onSubmit">确定</el-button>
|
|
|
+ <!-- 取消 -->
|
|
|
+ <el-button @click="showDialog = false">{{ $t('message.tableI18nAction.cancel') }}</el-button>
|
|
|
+ <!-- 编辑/新增 -->
|
|
|
+ <el-button type="primary" @click="onSubmit">{{ formData.id ? $t('message.tableI18nAction.edit') : $t('message.tableI18nAction.add') }}</el-button>
|
|
|
+ <!-- <el-button type="primary" @click="onSubmit">确定</el-button> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { ref, reactive, nextTick } from 'vue';
|
|
|
+import { ref, reactive, nextTick, computed } from 'vue';
|
|
|
import api from '/@/api/screen';
|
|
|
import { ruleRequired } from '/@/utils/validator';
|
|
|
import { ElMessage } from 'element-plus';
|
|
|
+import { useI18n } from 'vue-i18n';
|
|
|
+
|
|
|
+// 国际化
|
|
|
+const { locale, t } = useI18n();
|
|
|
+
|
|
|
+const currentLocale = computed(() => locale.value);
|
|
|
|
|
|
const emit = defineEmits(['getList']);
|
|
|
|
|
|
@@ -40,7 +61,8 @@ const formData = reactive({
|
|
|
});
|
|
|
|
|
|
const ruleForm = {
|
|
|
- projectName: [ruleRequired('规则名称不能为空')],
|
|
|
+ // 规则名称不能为空
|
|
|
+ projectName: [ruleRequired(t('message.configuration.designScreen.screenNameValidator'))],
|
|
|
};
|
|
|
|
|
|
const onSubmit = async () => {
|
|
|
@@ -49,8 +71,8 @@ const onSubmit = async () => {
|
|
|
const theApi = formData.id ? api.edit : api.add;
|
|
|
|
|
|
await theApi(formData);
|
|
|
-
|
|
|
- ElMessage.success('操作成功');
|
|
|
+ // editSuccess / addSuccess
|
|
|
+ ElMessage.success(formData.id ? t('message.tableI18nConfirm.editSuccess') : t('message.tableI18nConfirm.addSuccess'));
|
|
|
resetForm();
|
|
|
showDialog.value = false;
|
|
|
emit('getList');
|
