feat: add international language support for basicForm page; :star2: 新增：標準表...

iczer

2020-06-24 9eeb53f4ff6c86ac4bfa05ede90adad255a22a58

feat: add international language support for basicForm page; :star2:
新增：標準表單页面增加国际化语言支持；

 src/pages/form/BasicForm.vue

File was deleted

 src/pages/form/advance/AdvancedForm.vue

 src/pages/form/advance/RepositoryForm.vue

 src/pages/form/advance/TaskForm.vue

 src/pages/form/advance/UserForm.vue

 src/pages/form/advance/i18n-repository.js

 src/pages/form/advance/i18n-task.js

 src/pages/form/advance/i18n-user.js

 src/pages/form/advance/i18n.js

 src/pages/form/basic/BasicForm.vue

New file
@@ -0,0 +1,102 @@
<template>
  <a-card :body-style="{padding: '24px 32px'}" :bordered="false">
    <a-form>
      <a-form-item
        :label="$t('title')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
      >
        <a-input :placeholder="$t('titleInput')" />
      </a-form-item>
      <a-form-item
        :label="$t('date')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
      >
        <a-range-picker style="width: 100%" />
      </a-form-item>
      <a-form-item
        :label="$t('describe')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
      >
        <a-textarea rows="4" :placeholder="$t('describeInput')"/>
      </a-form-item>
      <a-form-item
        :label="$t('metrics')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
      >
        <a-textarea rows="4" :placeholder="$t('metricsInput')"/>
      </a-form-item>
      <a-form-item
        :label="$t('customer')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
        :required="false"
      >
        <a-input :placeholder="$t('customerInput')"/>
      </a-form-item>
      <a-form-item
        :label="$t('critics')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
        :required="false"
      >
        <a-input :placeholder="$t('criticsInput')"/>
      </a-form-item>
      <a-form-item
        :label="$t('weight')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
        :required="false"
      >
        <a-input-number :min="0" :max="100"/>
        <span>%</span>
      </a-form-item>
      <a-form-item
        :label="$t('disclosure')"
        :labelCol="{span: 7}"
        :wrapperCol="{span: 10}"
        :required="false"
        :help="$t('disclosureDesc')"
      >
        <a-radio-group v-model="value">
          <a-radio :value="1">{{$t('public')}}</a-radio>
          <a-radio :value="2">{{$t('partially')}}</a-radio>
          <a-radio :value="3">{{$t('private')}}</a-radio>
        </a-radio-group>
        <a-select mode="multiple" v-if="value === 2">
          <a-select-option value="4">{{$t('colleague1')}}</a-select-option>
          <a-select-option value="5">{{$t('colleague2')}}</a-select-option>
          <a-select-option value="6">{{$t('colleague3')}}</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item style="margin-top: 24px" :wrapperCol="{span: 10, offset: 7}">
        <a-button type="primary">{{$t('submit')}}</a-button>
        <a-button style="margin-left: 8px">{{$t('save')}}</a-button>
      </a-form-item>
    </a-form>
  </a-card>
</template>

<script>
export default {
  name: 'BasicForm',
  i18n: require('./i18n'),
  data () {
    return {
      value: 1
    }
  },
  computed: {
    desc() {
      return this.$t('pageDesc')
    }
  }
}
</script>

<style scoped>

</style>

 src/pages/form/basic/i18n.js

New file
@@ -0,0 +1,79 @@
module.exports = {
  messages: {
    CN: {
      pageDesc: '表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。',
      title: '标题',
      titleInput: '给目标起个名字',
      date: '起止日期',
      describe: '目标描述',
      describeInput: '请输入你阶段性工作目标',
      metrics: '衡量标准',
      metricsInput: '请输入衡量标准',
      customer: '客户',
      customerInput: '请描述你服务的客户，内部客户直接 @姓名／工号',
      critics: '邀评人',
      criticsInput: '请直接 @姓名／工号，最多可邀请 5 人',
      weight: '权重',
      disclosure: '目标公开',
      disclosureDesc: '客户、邀评人默认被分享',
      public: '公开',
      partially: '部分公开',
      private: '不公开',
      submit: '提交',
      save: '保存',
      colleague1: '同事甲',
      colleague2: '同事乙',
      colleague3: '同事丙'
    },
    HK: {
      pageDesc: '表單頁用於向用戶收集或驗證信息，基礎表單常見於數據項較少的表單場景。',
      title: '標題',
      titleInput: '給目標起個名字',
      date: '起止日期',
      describe: '目標描述',
      describeInput: '請輸入你階段性的工作目標',
      metrics: '衡量標準',
      metricsInput: '請輸入衡量標準',
      customer: '客戶',
      customerInput: '請描述你服務的客戶，內部客戶直接 @姓名／工號',
      critics: '邀評人',
      criticsInput: '請直接 @姓名／工號，最多可邀請 5 人',
      weight: '圈中人',
      disclosure: '目標公開',
      disclosureDesc: '客戶、邀評人默認被分享',
      public: '公開',
      partially: '部分公開',
      private: '不公開',
      submit: '提交',
      save: '保存',
      colleague1: '同事甲',
      colleague2: '同事乙',
      colleague3: '同事丙'
    },
    US: {
      pageDesc: 'Form pages are used to collect or verify information to users, and basic forms are common in scenarios where there are fewer data items.',
      title: 'Title',
      titleInput: 'Give the target a name',
      date: 'Start and end date',
      describe: 'Goal description',
      describeInput: 'Please enter your work goals',
      metrics: 'Metrics',
      metricsInput: 'Please enter a metric',
      customer: 'Customer',
      customerInput: 'Please describe your customer service, internal customers directly @ Name / job number',
      critics: 'Inviting critics',
      criticsInput: 'Please direct @ Name / job number, you can invite up to 5 people',
      weight: 'Weight',
      disclosure: 'Target disclosure',
      disclosureDesc: 'Customers and invitees are shared by default',
      public: 'Public',
      partially: 'Partially public',
      private: 'Private',
      submit: 'Submit',
      save: 'Save',
      colleague1: 'Colleague A',
      colleague2: 'Colleague B',
      colleague3: 'Colleague C'
    }
  }
}

 src/pages/form/step/Step1.vue

 src/pages/form/step/Step2.vue

 src/pages/form/step/Step3.vue

 src/pages/form/step/StepForm.vue

 src/router/index.js

@@ -7,9 +7,9 @@
import PageView from '@/layouts/PageView'
import RouteView from '@/layouts/RouteView'
import MenuView from '@/layouts/MenuView'
import BasicForm from '@/pages/form/BasicForm'
import StepForm from '@/pages/form/stepForm/StepForm'
import AdvancedForm from '@/pages/form/advancedForm/AdvancedForm'
import BasicForm from '@/pages/form/basic/BasicForm'
import StepForm from '@/pages/form/step/StepForm'
import AdvancedForm from '@/pages/form/advance/AdvancedForm'
import Success from '@/pages/result/Success'
import Error from '@/pages/result/Error'
import QueryList from '@/pages/list/QueryList'

 src/router/lazy.js

@@ -52,17 +52,17 @@
            {
              path: 'basic',
              name: '基础表单',
              component: () => import('@/pages/form/BasicForm'),
              component: () => import('@/pages/form/basic/BasicForm'),
            },
            {
              path: 'step',
              name: '分步表单',
              component: () => import('@/pages/form/stepForm/StepForm'),
              component: () => import('@/pages/form/step/StepForm'),
            },
            {
              path: 'advance',
              name: '高级表单',
              component: () => import('@/pages/form/advancedForm/AdvancedForm'),
              component: () => import('@/pages/form/advance/AdvancedForm'),
            }
          ]
        },