diff --git a/resources/js/user/pages/contract-template-obligations/FormModal.vue b/resources/js/user/pages/contract-template-obligations/FormModal.vue
index 4f41b11..6a90403 100644
--- a/resources/js/user/pages/contract-template-obligations/FormModal.vue
+++ b/resources/js/user/pages/contract-template-obligations/FormModal.vue
@@ -38,9 +38,18 @@
         <number-input
           :input_name="'complete_day_range'"
           :form="form"
-          :label="'Complete Day Range*'"
+          :label="'Complete 333 Day Range*'"
         ></number-input>
         <!-- ///////////////////////////////////////////////////// -->
+        <select-option-input
+                :input_name="'type'"
+                :form="form"
+                :placeholder="''"
+                :label="'Type'"
+                :list="contract_obligation_type"
+                :array="false"
+        ></select-option-input>
+        <!-- ///////////////////////////////////////////////////// -->
         <switch-input
           :input_name="'must_complete'"
           :form="form"
@@ -76,18 +85,22 @@
   import NumberInput from '../../components/inputs/NumberInput';
   import SwitchInput from '../../components/inputs/SwitchInput';
   import ContractTemplateFormTable from '../contract-templates/FormTable';
+  import SelectOptionInput from '../../components/inputs/SelectOptionInput';
 
   export default {
     props: {
       this_contract_template: Object,
-      mode: String
+      mode: String,
+      selected_contract_template_obligation: Object,
+      this_contract_template_obligation: Object
     },
     components: {
       TextInput,
       TextAreaInput,
       NumberInput,
       SwitchInput,
-      ContractTemplateFormTable
+      ContractTemplateFormTable,
+      SelectOptionInput
     },
     data() {
         let vm = this;
@@ -101,10 +114,11 @@
             must_complete: 1,
             must_accept: 1,
             complete_day_range: '',
-            type: ''
+            type: '1'
           }),
           loader: null,
-          loading: false
+          loading: false,
+          contract_obligation_type : Constants.contract_obligation_type,
         }
     },
     methods: {
diff --git a/resources/js/user/pages/contract-template-obligations/TableModal.vue b/resources/js/user/pages/contract-template-obligations/TableModal.vue
index 2ad4ff4..b07739d 100644
--- a/resources/js/user/pages/contract-template-obligations/TableModal.vue
+++ b/resources/js/user/pages/contract-template-obligations/TableModal.vue
@@ -197,6 +197,7 @@
       contractTemplateObligationEditModalToggle(selected_contract_template_obligation) {
         let vm = this;
         vm.mode = 'edit';
+        vm.selected_contract_template_obligation = selected_contract_template_obligation;
         vm.$bvModal.show('contract-template-obligation-form-modal');
       },
       contractTemplateObligationDeleteModalToggle(selected_contract_template_obligation) {
diff --git a/resources/js/user/utilities/constants.js b/resources/js/user/utilities/constants.js
index cfc6e41..ae0e133 100644
--- a/resources/js/user/utilities/constants.js
+++ b/resources/js/user/utilities/constants.js
@@ -125,5 +125,27 @@ const Constant = {
          'color': 'warning'
       },
    ],
+   'contract_obligation_type':[
+       {
+            'id': 1,
+            'name': 'money'
+       },
+       {
+            'id': 2,
+            'name': 'offer_service'
+       },
+       {
+            'id': 3,
+            'name': 'received_service'
+       },
+       {
+            'id': 4,
+            'name': 'request_service'
+       },
+       {
+            'id': 5,
+            'name': 'accept_service'
+       },
+   ]
 };
 export default Constant;
\ No newline at end of file