UPD: BCDRequest submission

src/api-services/bcd_request.service.js

+import Axios from 'axios'
+
 export default {
-  send_bcd_request(config, request) {
-    return null
+  send_bcd_request(config, data) {
+    return Axios.post('/api/bcd_request', data, ('netdb_axios_config' in (config || {})) ? config.netdb_axios_config : config)
   }
 }

src/components/BCDRequestForm.vue

 <template>
-  <b-modal id="bcd-request-form" size="xl" @shown="update">
+  <b-modal id="bcd-request-form" size="xl" @shown="update" @ok="sendBCDRequest">
     <template #modal-title>
       {{ $t('components.bcd_request_form.title') }}
     </template>
+    <b-alert :show="error_message !== null" variant="danger" dismissible>
+      {{ error_message }}
+    </b-alert>
     <b-overlay rounded="sm">
       <b-form>
         <b-form-group :label="$tc('system.organizational_unit', 1)" label-for="oe-select">
@@ -164,7 +167,8 @@
         </b-alert>
         <b-form-group :label="$t('components.bcd_request_form.ipv4_subnet_size_explanation')"
                       :disabled="subnet_size_select !== 24">
-          <b-form-textarea :placeholder="$t('components.bcd_request_form.placeholder_text')"/>
+          <b-form-textarea :placeholder="$t('components.bcd_request_form.placeholder_text')"
+                           v-model="subnet_size_explanation_text"/>
         </b-form-group>
         <b-form-group :label="$t('system.dhcp')" :description="$t('components.bcd_request_form.dhcp_wish_note')">
           <b-form-checkbox v-model="dhcp_wish_value" :disabled="!types_of_subnets_select || loading_edit_action">
@@ -194,28 +198,46 @@
         </b-form-group>
         <b-form-group :label="$t('components.bcd_request_form.device_location')"
                       :disabled="!types_of_subnets_select || loading_edit_action">
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.cs') }}</b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.cn') }}</b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.vm_cluster_unknown') }}</b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.vm_cluster_cs') }}</b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.vm_cluster_cn') }}</b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.scc_server_room_cs') }}</b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.scc_server_room_cn') }}</b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.device_locations.vpn_wifi_to_vlan') }}</b-form-checkbox>
+          <b-form-checkbox v-model="location_cs_value">
+            {{ $t('components.bcd_request_form.device_locations.cs') }}
+          </b-form-checkbox>
+          <b-form-checkbox v-model="location_cn_value">
+            {{ $t('components.bcd_request_form.device_locations.cn') }}
+          </b-form-checkbox>
+          <b-form-checkbox v-model="location_vm_cluster_unknown_value">
+            {{ $t('components.bcd_request_form.device_locations.vm_cluster_unknown') }}
+          </b-form-checkbox>
+          <b-form-checkbox v-model="location_vm_cluster_cs">
+            {{ $t('components.bcd_request_form.device_locations.vm_cluster_cs') }}
+          </b-form-checkbox>
+          <b-form-checkbox v-model="location_vm_cluster_cn">
+            {{ $t('components.bcd_request_form.device_locations.vm_cluster_cn') }}
+          </b-form-checkbox>
+          <b-form-checkbox v-model="location_scc_server_room_cs_value">
+            {{ $t('components.bcd_request_form.device_locations.scc_server_room_cs') }}
+          </b-form-checkbox>
+          <b-form-checkbox v-model="location_scc_server_room_cn_value">
+            {{ $t('components.bcd_request_form.device_locations.scc_server_room_cn') }}
+          </b-form-checkbox>
+          <b-form-checkbox v-model="location_vpn_wifi_to_vlan_value">
+            {{ $t('components.bcd_request_form.device_locations.vpn_wifi_to_vlan') }}
+          </b-form-checkbox>
         </b-form-group>
         <b-form-group :label="$t('components.bcd_request_form.realized_services')"
                       :disabled="!types_of_subnets_select || loading_edit_action">
-          <b-form-checkbox>{{ $t('components.bcd_request_form.realizable_services.vpn2vlan') }} <a
+          <b-form-checkbox v-model="vpn2vlan_value">
+            {{ $t('components.bcd_request_form.realizable_services.vpn2vlan') }} <a
             href="https://www.scc.kit.edu/ts-vpn2vlan" target="_blank">
             <netvs-icon icon="external_link"></netvs-icon>
           </a></b-form-checkbox>
-          <b-form-checkbox>{{ $t('components.bcd_request_form.realizable_services.wifi2vlan') }} <a
+          <b-form-checkbox v-model="wifi2vlan_value">{{ $t('components.bcd_request_form.realizable_services.wifi2vlan') }} <a
             href="https://www.scc.kit.edu/ts-wifi2vlan" target="_blank">
             <netvs-icon icon="external_link"></netvs-icon>
           </a></b-form-checkbox>
         </b-form-group>
         <b-form-group :label="$t('components.bcd_request_form.additional_comments')">
-          <b-form-textarea :placeholder="$t('components.bcd_request_form.placeholder_text')"/>
+          <b-form-textarea :placeholder="$t('components.bcd_request_form.placeholder_text')"
+                           v-model="additional_comments_text"/>
         </b-form-group>
       </b-form>
     </b-overlay>
@@ -236,12 +258,14 @@
 import Typeahead from '@/components/Typeahead.vue'
 import OUService from '@/api-services/ou.service'
 import ipaddress from '@/util/ipaddress'
+import BCDRequestService from '@/api-services/bcd_request.service'
 
 export default {
   name: 'BCDRequestForm',
   components: { Typeahead },
   data() {
     return {
+      error_message: null,
       oes: null,
       oe_search: '',
       selected_oe: null,
@@ -251,15 +275,24 @@ export default {
       selected_group: null,
       serialize_group: group => group.name,
       loading_edit_action: false,
+      additional_comments_text: null,
       bcd_name: null,
-      load_balancing_value: null,
-      access_to_internet_value: null,
-      access_from_internet_value: null,
+      load_balancing_value: false,
+      access_to_internet_value: false,
+      access_from_internet_value: false,
       access_from_internet_explanation_value: null,
-      dhcp_pool_wish_value: null,
+      dhcp_pool_wish_value: false,
       dhcp_pool_size_value: '2',
-      dhcp_own_server_value: null,
-      dhcp_wish_value: null,
+      dhcp_own_server_value: false,
+      dhcp_wish_value: false,
+      location_cs_value: false,
+      location_cn_value: false,
+      location_vm_cluster_unknown_value: false,
+      location_vm_cluster_cs: false,
+      location_vm_cluster_cn: false,
+      location_scc_server_room_cs_value: false,
+      location_scc_server_room_cn_value: false,
+      location_vpn_wifi_to_vlan_value: false,
       protection_requirements_select: null,
       protection_requirements_explanation_text: null,
       protection_requirements_options: [
@@ -291,6 +324,9 @@ export default {
         { value: 25, translation_key: 'components.bcd_request_form.ipv4_subnet_sizes.size_25' },
         { value: 24, translation_key: 'components.bcd_request_form.ipv4_subnet_sizes.size_24' }
       ],
+      subnet_size_explanation_text: null,
+      vpn2vlan_value: false,
+      wifi2vlan_value: false,
       sending: false,
       status_icon: null
     }
@@ -382,10 +418,10 @@ export default {
       this.load_balancing_value = null
     },
     clearAccessToInternet() {
-      this.access_to_internet_value = null
+      this.access_to_internet_value = false
     },
     clearAccessFromInternet() {
-      this.access_from_internet_value = null
+      this.access_from_internet_value = false
     },
     translateOptions(items) {
       // Iterate over the list of options
@@ -405,6 +441,59 @@ export default {
         }
       }
       return copy_items
+    },
+    sendBCDRequest(e) {
+      e.preventDefault()
+      this.status_icon = null
+      this.sending = true
+      this.error_message = null
+      BCDRequestService.send_bcd_request(this.$store.state, {
+        oe: this.selected_oe.short_name,
+        group: this.selected_group.name,
+        protection_requirement: this.protection_requirements_select,
+        protection_requirement_note: this.protection_requirements_explanation_text,
+        type_of_system: this.types_of_systems_select,
+        type_of_system_note: this.types_of_systems_other_explanation_text,
+        load_balancer: this.load_balancing_value,
+        bcd_name: this.bcd_name,
+        access_to_internet: this.access_to_internet_value,
+        access_from_internet: this.access_from_internet_value,
+        access_from_internet_explanation: this.access_from_internet_explanation_value,
+        type_of_subnet: this.types_of_subnets_select,
+        ipv4_subnet_size: this.subnet_size_select,
+        ipv4_subnet_size_explanation: this.subnet_size_explanation_text,
+        dhcp: this.dhcp_wish_value,
+        dhcp_pool: this.dhcp_pool_wish_value,
+        dhcp_pool_size: this.dhcp_pool_size_value,
+        own_dhcp_server: this.dhcp_own_server_value,
+        location_cs: this.location_cs_value,
+        location_cn: this.location_cn_value,
+        location_vm_cluster_unknown: this.location_vm_cluster_unknown_value,
+        location_vm_cluster_cs: this.location_vm_cluster_cs,
+        location_vm_cluster_cn: this.location_vm_cluster_cn,
+        location_scc_server_room_cs: this.location_scc_server_room_cs_value,
+        location_scc_server_room_cn: this.location_scc_server_room_cn_value,
+        location_vpn_wifi_to_vlan: this.location_vpn_wifi_to_vlan_value,
+        vpn2vlan: this.vpn2vlan_value,
+        wifi2vlan: this.wifi2vlan_value,
+        additional_comments: this.additional_comments_text
+      }).then(response => {
+        console.log(response)
+        this.sending = false
+        this.status_icon = 'request_sent'
+        this.clear()
+        // close modal after 1 second
+        setTimeout(() => {
+          this.$bvModal.hide('bcd-request-form')
+        }, 1000)
+      }).catch(error => {
+        window.console.log(error)
+        this.sending = false
+        this.status_icon = 'transaction_error'
+        if (error.response.status >= 400 && error.response.status < 500) {
+          this.error_message = error.response.data.detail
+        }
+      })
     }
   }
 }