offering: fix translation in compute and disk offering (#325)

Fixes #321
diff --git a/src/locales/en.json b/src/locales/en.json
index 86d80d7..ae303d1 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1157,6 +1157,9 @@
 "message.desc.secondary.storage": "Each zone must have at least one NFS or secondary storage server, and we will add the first one now. Secondary storage stores VM templates, ISO images, and VM disk volume snapshots. This server must be available to all hosts in the zone.<br/><br/>Provide the IP address and exported path.",
 "message.error.required.input": "Please enter input",
 "message.error.invalid.range": "Please enter values from {min} to {max}",
+"message.error.number": "Please enter a valid number",
+"message.error.select": "Please select option",
+"message.disk.offering.created": "Disk offering created: {name}",
 "label.name": "Name",
 "label.ipv4.dns1": "IPv4 DNS1",
 "label.ipv4.dns2": "IPv4 DNS2",
@@ -1288,6 +1291,11 @@
 "diskbyteswriterate": "Disk Write Rate (BPS)",
 "diskiopsreadrate": "Disk Read Rate (IOPS)",
 "diskiopswriterate": "Disk Write Rate (IOPS)",
+"customdisksize": "Custom Disk Size",
+"writecachetype": "Write-cache Type",
+"nodiskcache": "No disk cache",
+"writeback": "Write-back disk caching",
+"writethrough": "Write-through",
 "none": "None",
 "maxcpunumber": "Max CPU Cores"
 }
diff --git a/src/views/offering/AddComputeOffering.vue b/src/views/offering/AddComputeOffering.vue
index a77bfac..0db7cd6 100644
--- a/src/views/offering/AddComputeOffering.vue
+++ b/src/views/offering/AddComputeOffering.vue
@@ -25,16 +25,16 @@
         <a-form-item :label="$t('name')">
           <a-input
             v-decorator="['name', {
-              rules: [{ required: true, message: 'Please enter name' }]
+              rules: [{ required: true, message: $t('message.error.required.input') }]
             }]"
             :placeholder="this.$t('Name')"/>
         </a-form-item>
         <a-form-item :label="$t('displaytext')">
           <a-input
             v-decorator="['displaytext', {
-              rules: [{ required: true, message: 'Please enter description' }]
+              rules: [{ required: true, message: $t('message.error.required.input') }]
             }]"
-            :placeholder="this.$t('displaytext  ')"/>
+            :placeholder="this.$t('displaytext')"/>
         </a-form-item>
         <a-form-item :label="$t('systemvmtype')" v-if="this.isSystem">
           <a-select
@@ -93,13 +93,13 @@
             buttonStyle="solid"
             @change="selected => { this.handleCacheModeChange(selected.target.value) }">
             <a-radio-button value="none">
-              {{ $t('No disk cache') }}
+              {{ $t('nodiskcache') }}
             </a-radio-button>
             <a-radio-button value="writeback">
-              {{ $t('Write-back disk caching') }}
+              {{ $t('writeback') }}
             </a-radio-button>
             <a-radio-button value="writethrough">
-              {{ $t('Write-through') }}
+              {{ $t('writethrough') }}
             </a-radio-button>
           </a-radio-group>
         </a-form-item>
@@ -124,11 +124,11 @@
         <a-form-item :label="$t('cpunumber')" v-if="this.offeringType === 'fixed'">
           <a-input
             v-decorator="['cpunumber', {
-              rules: [{ required: true, message: 'Please enter value' },
+              rules: [{ required: true, message: $t('message.error.required.input') },
                       {
                         validator: (rule, value, callback) => {
                           if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
+                            callback(this.$t('message.error.number'))
                           }
                           callback()
                         }
@@ -140,11 +140,11 @@
         <a-form-item :label="$t('cpuspeed')" v-if="this.offeringType !== 'customunconstrained'">
           <a-input
             v-decorator="['cpuspeed', {
-              rules: [{ required: true, message: 'Please enter value' },
+              rules: [{ required: true, message: $t('message.error.required.input') },
                       {
                         validator: (rule, value, callback) => {
                           if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
+                            callback(this.$t('message.error.number'))
                           }
                           callback()
                         }
@@ -156,11 +156,11 @@
         <a-form-item :label="$t('mincpunumber')" v-if="this.offeringType === 'customconstrained'">
           <a-input
             v-decorator="['mincpunumber', {
-              rules: [{ required: true, message: 'Please enter value' },
+              rules: [{ required: true, message: $t('message.error.required.input') },
                       {
                         validator: (rule, value, callback) => {
                           if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
+                            callback(this.$t('message.error.number'))
                           }
                           callback()
                         }
@@ -172,11 +172,11 @@
         <a-form-item :label="$t('maxcpunumber')" v-if="this.offeringType === 'customconstrained'">
           <a-input
             v-decorator="['maxcpunumber', {
-              rules: [{ required: true, message: 'Please enter value' },
+              rules: [{ required: true, message: $t('message.error.required.input') },
                       {
                         validator: (rule, value, callback) => {
                           if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
+                            callback(this.$t('message.error.number'))
                           }
                           callback()
                         }
@@ -188,11 +188,11 @@
         <a-form-item :label="$t('memory')" v-if="this.offeringType === 'fixed'">
           <a-input
             v-decorator="['memory', {
-              rules: [{ required: true, message: 'Please enter value' },
+              rules: [{ required: true, message: $t('message.error.required.input') },
                       {
                         validator: (rule, value, callback) => {
                           if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
+                            callback(this.$t('message.error.number'))
                           }
                           callback()
                         }
@@ -204,11 +204,11 @@
         <a-form-item :label="$t('minmemory')" v-if="this.offeringType === 'customconstrained'">
           <a-input
             v-decorator="['minmemory', {
-              rules: [{ required: true, message: 'Please enter value' },
+              rules: [{ required: true, message: $t('message.error.required.input') },
                       {
                         validator: (rule, value, callback) => {
                           if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
+                            callback(this.$t('message.error.number'))
                           }
                           callback()
                         }
@@ -220,11 +220,11 @@
         <a-form-item :label="$t('maxmemory')" v-if="this.offeringType === 'customconstrained'">
           <a-input
             v-decorator="['maxmemory', {
-              rules: [{ required: true, message: 'Please enter value' },
+              rules: [{ required: true, message: $t('message.error.required.input') },
                       {
                         validator: (rule, value, callback) => {
                           if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
+                            callback(this.$t('message.error.number'))
                           }
                           callback()
                         }
@@ -240,7 +240,7 @@
                 {
                   validator: (rule, value, callback) => {
                     if (value && (isNaN(value) || value <= 0)) {
-                      callback('Please enter a valid number')
+                      callback(this.$t('message.error.number'))
                     }
                     callback()
                   }
@@ -273,7 +273,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -287,7 +287,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -301,7 +301,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -315,7 +315,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -332,7 +332,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -346,7 +346,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -360,7 +360,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -471,7 +471,7 @@
               rules: [
                 {
                   required: true,
-                  message: 'Please select option'
+                  message: $t('message.error.select')
                 }
               ]
             }]"
@@ -496,7 +496,7 @@
                 {
                   validator: (rule, value, callback) => {
                     if (value && value.length > 1 && value.indexOf(0) !== -1) {
-                      callback('All Zones cannot be combined with any other zone')
+                      callback(this.$t('label.error.zone.combined'))
                     }
                     callback()
                   }
diff --git a/src/views/offering/AddDiskOffering.vue b/src/views/offering/AddDiskOffering.vue
index d850773..9c138e2 100644
--- a/src/views/offering/AddDiskOffering.vue
+++ b/src/views/offering/AddDiskOffering.vue
@@ -25,14 +25,14 @@
         <a-form-item :label="$t('name')">
           <a-input
             v-decorator="['name', {
-              rules: [{ required: true, message: 'Please enter name' }]
+              rules: [{ required: true, message: $t('message.error.required.input') }]
             }]"
             :placeholder="this.$t('Name')"/>
         </a-form-item>
         <a-form-item :label="$t('displaytext')">
           <a-input
             v-decorator="['displaytext', {
-              rules: [{ required: true, message: 'Please enter description' }]
+              rules: [{ required: true, message: $t('message.error.required.input') }]
             }]"
             :placeholder="this.$t('displaytext')"/>
         </a-form-item>
@@ -75,15 +75,16 @@
         <a-form-item :label="$t('disksize')" v-if="!this.isCustomDiskSize">
           <a-input
             v-decorator="['disksize', {
-              rules: [{ required: true, message: 'Please enter disk size' },
-                      {
-                        validator: (rule, value, callback) => {
-                          if (value && (isNaN(value) || value <= 0)) {
-                            callback('Please enter a valid number')
-                          }
-                          callback()
-                        }
-                      }
+              rules: [
+                { required: true, message: $t('message.error.required.input') },
+                {
+                  validator: (rule, value, callback) => {
+                    if (value && (isNaN(value) || value <= 0)) {
+                      callback(this.$t('message.error.number'))
+                    }
+                    callback()
+                  }
+                }
               ]
             }]"
             :placeholder="this.$t('disksize')"/>
@@ -112,7 +113,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -126,7 +127,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -140,7 +141,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -154,7 +155,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -171,7 +172,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -185,7 +186,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -199,7 +200,7 @@
               rules: [{
                 validator: (rule, value, callback) => {
                   if (value && (isNaN(value) || value <= 0)) {
-                    callback('Please enter a valid number')
+                    callback(this.$t('message.error.number'))
                   }
                   callback()
                 }
@@ -215,7 +216,7 @@
             buttonStyle="solid"
             @change="selected => { this.handleWriteCacheTypeChange(selected.target.value) }">
             <a-radio-button value="none">
-              {{ $t('none') }}
+              {{ $t('nodiskcache') }}
             </a-radio-button>
             <a-radio-button value="writeback">
               {{ $t('writeback') }}
@@ -252,7 +253,7 @@
               rules: [
                 {
                   required: true,
-                  message: 'Please select option'
+                  message: $t('message.error.select')
                 }
               ]
             }]"
@@ -277,7 +278,7 @@
                 {
                   validator: (rule, value, callback) => {
                     if (value && value.length > 1 && value.indexOf(0) !== -1) {
-                      callback('All Zones cannot be combined with any other zone')
+                      callback(this.$t('label.error.zone.combined'))
                     }
                     callback()
                   }
@@ -492,7 +493,7 @@
           params.zoneid = zoneId
         }
         api('createDiskOffering', params).then(json => {
-          this.$message.success('Disk offering created: ' + values.name)
+          this.$message.success(this.$t('message.disk.offering.created', { name: values.name }))
         }).catch(error => {
           this.$notification.error({
             message: 'Request Failed',
@@ -515,8 +516,9 @@
 <style scoped lang="scss">
   .form-layout {
     width: 80vw;
+
     @media (min-width: 800px) {
-      width: 400px;
+      width: 430px;
     }
   }