添加前端国际化框架

lms/nladmin-ui/src/views/system/timing/index.vue

@@ -8,7 +8,7 @@
           v-model="query.job_name"
           clearable
           size="mini"
-          placeholder="输入任务名称搜索"
+          :placeholder="$t('Timing.msg.select_msg')"
           style="width: 200px;"
           class="filter-item"
           @keyup.enter.native="toQuery"
@@ -24,7 +24,7 @@
           type="info"
           icon="el-icon-tickets"
           @click="doLog"
-        >日志
+        >{{ $t('Timing.DB.log') }}
         </el-button>
       </crudOperation>
       <Log ref="log" />
@@ -39,60 +39,57 @@
       width="730px"
     >
       <el-form ref="form" :inline="true" :model="form" :rules="rules" size="mini" label-width="100px">
-        <el-form-item label="任务名称" prop="job_name">
+        <el-form-item :label="$t('Timing.DB.job_name')" prop="job_name">
           <el-input v-model="form.job_name" style="width: 220px;" />
         </el-form-item>
-        <el-form-item label="任务描述" prop="description">
+        <el-form-item :label="$t('Timing.DB.description')" prop="description">
           <el-input v-model="form.description" style="width: 220px;" />
         </el-form-item>
-        <el-form-item label="Bean名称" prop="bean_name">
+        <el-form-item :label="$t('Timing.DB.bean_name')" prop="bean_name">
           <el-input v-model="form.bean_name" style="width: 220px;" />
         </el-form-item>
-        <el-form-item label="执行方法" prop="method_name">
+        <el-form-item :label="$t('Timing.DB.method_name')" prop="method_name">
           <el-input v-model="form.method_name" style="width: 220px;" />
         </el-form-item>
-        <el-form-item label="Cron表达式" prop="cron_expression">
+        <el-form-item :label="$t('Timing.DB.cron_expression')" prop="cron_expression">
           <!--          <el-input v-model="form.cron_expression" style="width: 220px;" />-->
-          <el-input v-model="form.cron_expression" placeholder="请输入CRON 表达式" style="width: 220px;">
+          <el-input v-model="form.cron_expression" :placeholder="$t('Timing.DB.please_enter_cron_expression')" style="width: 220px;">
             <template slot="append">
               <el-button type="primary" @click="handleShowCron">
-                生成表达式
+                {{ $t('Timing.DB.Generate_expressions') }}
                 <i class="el-icon-time el-icon--right" />
               </el-button>
             </template>
           </el-input>
         </el-form-item>
-        <el-form-item label="子任务ID">
+        <el-form-item :label="$t('Timing.DB.job_id')">
           <el-input v-model="form.sub_task" placeholder="多个用逗号隔开，按顺序执行" style="width: 220px;" />
         </el-form-item>
-        <el-form-item label="任务负责人" prop="person_in_charge">
+        <el-form-item :label="$t('Timing.DB.Leader')" prop="person_in_charge">
           <el-input v-model="form.person_in_charge" style="width: 220px;" />
         </el-form-item>
-        <el-form-item label="告警邮箱" prop="email">
-          <el-input v-model="form.email" placeholder="多个邮箱用逗号隔开" style="width: 220px;" />
+        <el-form-item :label="$t('Timing.DB.Alarm_mailbox')" prop="email">
+          <el-input v-model="form.email" :placeholder="$t('Timing.DB.spilt2')" style="width: 220px;" />
         </el-form-item>
-        <el-form-item label="调度IP" prop="email">
-          <el-input v-model="form.job_ip" placeholder="执行定时器的ip地址" style="width: 220px;" />
-        </el-form-item>
-        <el-form-item label="失败后暂停">
+        <el-form-item :label="$t('Timing.DB.Whether_pause')">
           <el-radio-group v-model="form.pause_after_failure" style="width: 220px">
-            <el-radio :label="true">是</el-radio>
-            <el-radio :label="false">否</el-radio>
+            <el-radio :label="true">{{ $t('auto.common.true') }}</el-radio>
+            <el-radio :label="false">{{ $t('auto.common.false') }}</el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item label="任务状态">
+        <el-form-item :label="$t('Timing.DB.thread_state')">
           <el-radio-group v-model="form.is_pause" style="width: 220px">
-            <el-radio :label="false">启用</el-radio>
-            <el-radio :label="true">暂停</el-radio>
+            <el-radio :label="false">{{ $t('auto.common.firing') }}</el-radio>
+            <el-radio :label="true">{{ $t('auto.common.stop') }}</el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item label="参数内容">
+        <el-form-item :label="$t('Timing.DB.Parameter_content')">
           <el-input v-model="form.params" style="width: 556px;" rows="4" type="textarea" />
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="text" @click="crud.cancelCU">取消</el-button>
-        <el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
+        <el-button type="text" @click="crud.cancelCU">{{ $t('auto.common.Cancel') }}</el-button>
+        <el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">{{ $t('auto.common.Confirm') }}</el-button>
       </div>
     </el-dialog>
     <!--表格渲染-->
@@ -104,36 +101,35 @@
       @selection-change="crud.selectionChangeHandler"
     >
       <el-table-column :selectable="checkboxT" type="selection" width="55" />
-      <el-table-column show-overflow-tooltip prop="job_id" label="任务ID" />
-      <el-table-column show-overflow-tooltip prop="job_name" label="任务名称" min-width="120" />
-      <el-table-column show-overflow-tooltip prop="bean_name" label="Bean名称" />
-      <el-table-column show-overflow-tooltip prop="job_ip" label="调度IP" />
-      <el-table-column show-overflow-tooltip prop="method_name" label="执行方法" />
-      <el-table-column show-overflow-tooltip prop="params" label="参数" />
+      <el-table-column show-overflow-tooltip prop="job_id" :label="$t('Timing.DB.job_id')" />
+      <el-table-column show-overflow-tooltip prop="job_name" :label="$t('Timing.DB.job_name')" min-width="120" />
+      <el-table-column show-overflow-tooltip prop="bean_name" :label="$t('Timing.DB.bean_name')" />
+      <el-table-column show-overflow-tooltip prop="method_name" :label="$t('Timing.DB.method_name')" />
+      <el-table-column show-overflow-tooltip prop="params" :label="$t('Timing.DB.params')" />
       <el-table-column
         show-overflow-tooltip
         prop="cron_expression"
-        label="cron表达式"
+        :label="$t('Timing.DB.cron_expression')"
         min-width="100"
         show-tooltip-when-overflow
       />
-      <el-table-column show-overflow-tooltip prop="is_pause" width="90px" label="状态">
+      <el-table-column show-overflow-tooltip prop="is_pause" width="90px" :label="$t('Timing.DB.is_pause')">
         <template slot-scope="scope">
           <el-tag :type="scope.row.is_pause ? 'warning' : 'success'">{{
-            scope.row.is_pause ? '已暂停' : '运行中'
+            scope.row.is_pause ? $t('auto.common.Paused') : $t('auto.common.Running')
           }}
           </el-tag>
         </template>
       </el-table-column>
-      <el-table-column show-overflow-tooltip prop="description" width="150px" label="描述" />
-      <el-table-column show-overflow-tooltip prop="create_time" width="136px" label="创建日期">
+      <el-table-column show-overflow-tooltip prop="description" width="150px" :label="$t('Timing.DB.description')" />
+      <el-table-column show-overflow-tooltip prop="create_time" width="136px" :label="$t('Timing.DB.create_time')">
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.create_time) }}</span>
         </template>
       </el-table-column>
       <el-table-column
         v-permission="['admin','timing:edit','timing:del']"
-        label="操作"
+        :label="$t('auto.common.Operate')"
         width="170px"
         align="center"
         fixed="right"
@@ -145,7 +141,7 @@
             style="margin-right: 3px;"
             type="text"
             @click="crud.toEdit(scope.row)"
-          >编辑
+          >{{ $t('Timing.DB.edit') }}
           </el-button>
           <el-button
             v-permission="['admin','timing:edit']"
@@ -153,16 +149,16 @@
             type="text"
             size="mini"
             @click="execute(scope.row.job_id)"
-          >执行
+          >{{ $t('Timing.DB.execute') }}
           </el-button>
           <el-button
             v-permission="['admin','timing:edit']"
             style="margin-left: 3px"
             type="text"
             size="mini"
-            @click="updateStatus(scope.row.job_id,scope.row.is_pause ? '恢复' : '暂停')"
+            @click="updateStatus(scope.row.job_id,scope.row.is_pause ? $t('Timing.DB.restore') : $t('Timing.DB.suspend'))"
           >
-            {{ scope.row.is_pause ? '恢复' : '暂停' }}
+            {{ scope.row.is_pause ? $t('Timing.DB.restore') : $t('Timing.DB.suspend') }}
           </el-button>
           <el-popover
             :ref="scope.row.job_id"
@@ -170,20 +166,20 @@
             placement="top"
             width="200"
           >
-            <p>确定停止并删除该任务吗？</p>
+            <p>{{ $t('Timing.DB.delete_msg') }}</p>
             <div style="text-align: right; margin: 0">
-              <el-button size="mini" type="text" @click="$refs[scope.row.job_id].doClose()">取消</el-button>
-              <el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.job_id)">确定
+              <el-button size="mini" type="text" @click="$refs[scope.row.job_id].doClose()">{{ $t('auto.common.Cancel') }}</el-button>
+              <el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.job_id)">{{ $t('auto.common.determine') }}
               </el-button>
             </div>
-            <el-button slot="reference" type="text" size="mini">删除</el-button>
+            <el-button slot="reference" type="text" size="mini">{{ $t('auto.common.Cancel') }}</el-button>
           </el-popover>
         </template>
       </el-table-column>
     </el-table>
     <!--分页组件-->
     <pagination />
-    <el-dialog title="Cron表达式生成器" :visible.sync="openCron" append-to-body class="scrollbar" destroy-on-close>
+    <el-dialog :title="$t('Timing.table_title.cron')" :visible.sync="openCron" append-to-body class="scrollbar" destroy-on-close>
       <crontab :expression="expression" @hide="openCron=false" @fill="crontabFill" />
     </el-dialog>
   </div>
@@ -197,6 +193,7 @@ import rrOperation from '@crud/RR.operation'
 import crudOperation from '@crud/CRUD.operation'
 import pagination from '@crud/Pagination'
 import Crontab from './components/crontab'
+import i18n from "@/i18n";
 
 const defaultForm = {
   job_id: null,
@@ -210,14 +207,13 @@ const defaultForm = {
   person_in_charge: null,
   email: null,
   sub_task: null,
-  job_ip: null,
   pause_after_failure: true
 }
 export default {
   name: 'Timing',
   components: { Log, pagination, crudOperation, rrOperation, Crontab },
   cruds() {
-    return CRUD({ title: '定时任务', idField: 'job_id', url: 'api/jobs', crudMethod: { ...crudJob }})
+    return CRUD({ title: i18n.t('Timing.table_title.title'), idField: 'job_id', url: 'api/jobs', crudMethod: { ...crudJob }})
   },
   mixins: [presenter(), header(), form(defaultForm), crud()],
   data() {
@@ -230,22 +226,22 @@ export default {
       },
       rules: {
         job_name: [
-          { required: true, message: '请输入任务名称', trigger: 'blur' }
+          { required: true, message: this.$t('Timing.rules.job_name'), trigger: 'blur' }
         ],
         description: [
-          { required: true, message: '请输入任务描述', trigger: 'blur' }
+          { required: true, message: this.$t('Timing.rules.description'), trigger: 'blur' }
         ],
         bean_name: [
-          { required: true, message: '请输入Bean名称', trigger: 'blur' }
+          { required: true, message: this.$t('Timing.rules.bean_name'), trigger: 'blur' }
         ],
         method_name: [
-          { required: true, message: '请输入方法名称', trigger: 'blur' }
+          { required: true, message: this.$t('Timing.rules.method_name'), trigger: 'blur' }
         ],
         cron_expression: [
-          { required: true, message: '请输入Cron表达式', trigger: 'blur' }
+          { required: true, message: this.$t('Timing.rules.cron_expression'), trigger: 'blur' }
         ],
         person_in_charge: [
-          { required: true, message: '请输入负责人名称', trigger: 'blur' }
+          { required: true, message: this.$t('Timing.rules.person_in_charge'), trigger: 'blur' }
         ]
       },
       // 是否显示Cron表达式弹出层
@@ -258,19 +254,19 @@ export default {
     // 执行
     execute(id) {
       crudJob.execution(id).then(res => {
-        this.crud.notify('执行成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
+        this.crud.notify(i18n.t('Timing.msg.execute_msg'), CRUD.NOTIFICATION_TYPE.SUCCESS)
       }).catch(err => {
         console.log(err.response.data.message)
       })
     },
     // 改变状态
     updateStatus(id, status) {
-      if (status === '恢复') {
+      if (status === i18n.t('Timing.msg.restore')) {
         this.updateParams(id)
       }
       crudJob.updateIsPause(id).then(res => {
         this.crud.toQuery()
-        this.crud.notify(status + '成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
+        this.crud.notify(status + i18n.t('Timing.msg.succeed'), CRUD.NOTIFICATION_TYPE.SUCCESS)
       }).catch(err => {
         console.log(err.response.data.message)
       })