Manage domain and account resources.

frontend/src/components/domains/DomainForm.vue

@@ -133,6 +133,18 @@
         <domain-transport-form ref="transportForm" :domain="editedDomain" />
       </v-expansion-panel-content>
     </v-expansion-panel>
+    <v-expansion-panel v-if="limitsConfig.enable_domain_limits && (authUser.role === 'SuperAdmins' || authUser.role === 'Resellers')">
+      <v-expansion-panel-header>
+        <v-row no-gutters>
+          <v-col cols="4">
+            <translate>Resources</translate>
+          </v-col>
+        </v-row>
+      </v-expansion-panel-header>
+      <v-expansion-panel-content>
+        <resources-form ref="resourcesForm" :resources="domain.resources" />
+      </v-expansion-panel-content>
+    </v-expansion-panel>
   </v-expansion-panels>
   <div class="mt-4 d-flex justify-end">
     <v-btn color="grey lighten-1" @click="$router.go(-1)">
@@ -151,18 +163,28 @@ import DomainDNSForm from './DomainDNSForm'
 import DomainGeneralForm from './DomainGeneralForm'
 import DomainLimitationsForm from './DomainLimitationsForm'
 import DomainTransportForm from './DomainTransportForm'
+import { mapGetters } from 'vuex'
+import parameters from '@/api/parameters'
+import ResourcesForm from '@/components/tools/ResourcesForm'
 
 export default {
   components: {
     'domain-dns-form': DomainDNSForm,
     DomainGeneralForm,
     DomainLimitationsForm,
-    DomainTransportForm
+    DomainTransportForm,
+    ResourcesForm
   },
   props: ['domain'],
+  computed: {
+    ...mapGetters({
+      authUser: 'auth/authUser'
+    })
+  },
   data () {
     return {
       editedDomain: {},
+      limitsConfig: {},
       panel: 0
     }
   },
@@ -174,14 +196,29 @@ export default {
           return
         }
       }
-      if (this.editedDomain.type === 'relaydomain') {
-        this.$refs.transportForm.checkSettingTypes(this.editedDomain)
+      if (this.$refs.resourcesForm !== undefined) {
+        const valid = await this.$refs.resourcesForm.validateForm()
+        if (!valid) {
+          return
+        }
       }
-      this.$store.dispatch('domains/updateDomain', this.editedDomain).then(resp => {
+      const data = { ...this.editedDomain }
+      if (data.transport === null) {
+        delete data.transport
+      }
+      if (data.type === 'relaydomain') {
+        this.$refs.transportForm.checkSettingTypes(data)
+      }
+      this.$store.dispatch('domains/updateDomain', data).then(resp => {
         bus.$emit('notification', { msg: this.$gettext('Domain updated') })
       })
     }
   },
+  created () {
+    parameters.getApplication('limits').then(resp => {
+      this.limitsConfig = resp.data
+    })
+  },
   watch: {
     domain: {
       handler: function (val) {

frontend/src/components/identities/AccountForm.vue

@@ -98,16 +98,16 @@
         <account-mailbox-form ref="mailboxForm" :account="editedAccount" />
       </v-expansion-panel-content>
     </v-expansion-panel>
-    <v-expansion-panel v-if="account.role !== 'SimpleUsers'">
+    <v-expansion-panel v-if="limitsConfig.enable_admin_limits && account.role !== 'SimpleUsers'">
       <v-expansion-panel-header>
         <v-row no-gutters>
           <v-col cols="4">
-            <translate>Limits</translate>
+            <translate>Resources</translate>
           </v-col>
         </v-row>
       </v-expansion-panel-header>
       <v-expansion-panel-content>
-        <account-resources-form ref="resourcesForm" :account="editedAccount" />
+        <resources-form ref="resourcesForm" :resources="editedAccount.resources" />
       </v-expansion-panel-content>
     </v-expansion-panel>
   </v-expansion-panels>
@@ -128,15 +128,16 @@ import { bus } from '@/main'
 import accounts from '@/api/accounts'
 import AccountGeneralForm from './AccountGeneralForm'
 import AccountMailboxForm from './AccountMailboxForm'
-import AccountResourcesForm from './AccountResourcesForm'
 import AccountRoleForm from './AccountRoleForm'
+import ResourcesForm from '@/components/tools/ResourcesForm'
+import parameters from '@/api/parameters'
 
 export default {
   components: {
     AccountGeneralForm,
     AccountMailboxForm,
-    AccountResourcesForm,
-    AccountRoleForm
+    AccountRoleForm,
+    ResourcesForm
   },
   props: ['account'],
   computed: {
@@ -147,6 +148,7 @@ export default {
   data () {
     return {
       editedAccount: {},
+      limitsConfig: {},
       panel: 0
     }
   },
@@ -197,6 +199,11 @@ export default {
       }
     }
   },
+  created () {
+    parameters.getApplication('limits').then(resp => {
+      this.limitsConfig = resp.data
+    })
+  },
   mounted () {
     this.$store.dispatch('identities/fetchDomains')
   },

frontend/src/components/tools/Resources.vue

@@ -5,7 +5,7 @@
   </v-card-title>
   <v-card-text>
     <div
-      v-for="resource in account.resources"
+      v-for="resource in resources"
       :key="resource.name"
       class="mt-4"
       >
@@ -22,7 +22,7 @@
 <script>
 export default {
   props: {
-    account: Object
+    resources: Array
   },
   methods: {
     getProgressColor (value) {

frontend/src/components/tools/ResourcesForm.vue

@@ -0,0 +1,37 @@
+<template>
+<validation-observer ref="observer">
+  <validation-provider
+    v-for="resource in resources"
+    :key="resource.name"
+    v-slot="{ errors }"
+    rules="required"
+    >
+    <label class="m-label">{{ resource.label }}</label>
+    <v-text-field
+      v-model="resource.max_value"
+      type="number"
+      outlined
+      dense
+      :error-messages="errors"
+      />
+  </validation-provider>
+</validation-observer>
+</template>
+
+<script>
+export default {
+  props: {
+    resources: Array
+  },
+  methods: {
+    async validateForm () {
+      return await this.$refs.observer.validate()
+    },
+    getPayload () {
+      return this.resources.map(r => {
+        return { name: r.name, max_value: r.max_value }
+      })
+    }
+  }
+}
+</script>