refactor: note/task modal

(cherry picked from commit f4551a92c553a8c26d9bcd36b1ae21d6a69c53d7)

frontend/src/components/Modals/CallLogModal.vue

@@ -36,7 +36,7 @@
         </div>
       </div>
       <div class="px-4 pt-4 pb-7 sm:px-6">
-        <div class="space-y-2">
+        <div class="flex justify-end gap-2">
           <Button
             class="w-full"
             v-for="action in dialogOptions.actions"
@@ -60,7 +60,7 @@ import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { getRandom } from '@/utils'
 import { capture } from '@/telemetry'
 import { useDocument } from '@/data/document'
-import { FeatherIcon, createResource, ErrorMessage, Badge } from 'frappe-ui'
+import { createResource, ErrorMessage, Badge } from 'frappe-ui'
 import { ref, nextTick, computed, onMounted } from 'vue'
 
 const props = defineProps({

frontend/src/components/Modals/NoteModal.vue

@@ -1,17 +1,5 @@
 <template>
-  <Dialog
-    v-model="show"
-    :options="{
-      size: 'xl',
-      actions: [
-        {
-          label: editMode ? __('Update') : __('Create'),
-          variant: 'solid',
-          onClick: () => updateNote(),
-        },
-      ],
-    }"
-  >
+  <Dialog v-model="show" :options="{ size: 'xl' }">
     <template #body-title>
       <div class="flex items-center gap-3">
         <h3 class="text-2xl font-semibold leading-6 text-ink-gray-9">
@@ -58,6 +46,15 @@
         <ErrorMessage class="mt-4" v-if="error" :message="__(error)" />
       </div>
     </template>
+    <template #actions>
+      <div class="flex justify-end">
+        <Button
+          :label="editMode ? __('Update') : __('Create')"
+          variant="solid"
+          @click="updateNote"
+        />
+      </div>
+    </template>
   </Dialog>
 </template>
 

frontend/src/components/Modals/TaskModal.vue

@@ -1,17 +1,5 @@
 <template>
-  <Dialog
-    v-model="show"
-    :options="{
-      size: 'xl',
-      actions: [
-        {
-          label: editMode ? __('Update') : __('Create'),
-          variant: 'solid',
-          onClick: () => updateTask(),
-        },
-      ],
-    }"
-  >
+  <Dialog v-model="show" :options="{ size: 'xl' }">
     <template #body-title>
       <div class="flex items-center gap-3">
         <h3 class="text-2xl font-semibold leading-6 text-ink-gray-9">
@@ -90,13 +78,15 @@
               </Tooltip>
             </template>
           </Link>
-          <DateTimePicker
-            class="datepicker w-36"
-            v-model="_task.due_date"
-            :placeholder="__('01/04/2024 11:30 PM')"
-            :formatter="(date) => getFormat(date, '', true, true)"
-            input-class="border-none"
-          />
+          <div class="w-36">
+            <DateTimePicker
+              class="datepicker"
+              v-model="_task.due_date"
+              :placeholder="__('01/04/2024 11:30 PM')"
+              :formatter="(date) => getFormat(date, '', true, true)"
+              input-class="border-none"
+            />
+          </div>
           <Dropdown :options="taskPriorityOptions(updateTaskPriority)">
             <Button :label="_task.priority" class="justify-between w-full">
               <template #prefix>
@@ -108,6 +98,15 @@
         <ErrorMessage class="mt-4" v-if="error" :message="__(error)" />
       </div>
     </template>
+    <template #actions>
+      <div class="flex justify-end">
+        <Button
+          :label="editMode ? __('Update') : __('Create')"
+          variant="solid"
+          @click="updateTask"
+        />
+      </div>
+    </template>
   </Dialog>
 </template>