fix(gui-v2): SmartsheetColumnEditOrAdd overlay issue

packages/nc-gui-v2/components/smartsheet/Form.vue

@@ -401,6 +401,7 @@ onMounted(async () => {
             <!-- Drag and drop fields here to hide -->
             {{ $t('msg.info.dragDropHide') }}
           </div>
+          <a-dropdown v-model:visible="showColumnDropdown" :trigger="['click']">
             <a-button type="link" class="w-full caption mt-2" size="large" @click="showColumnDropdown = true">
               <div class="flex items-center prose-sm justify-center text-gray-400">
                 <MdiPlusIcon />
@@ -408,12 +409,10 @@ onMounted(async () => {
                 {{ $t('activity.addField') }}
               </div>
             </a-button>
-          <SmartsheetColumnEditOrAdd
+            <template #overlay>
-            v-show="showColumnDropdown"
+              <SmartsheetColumnEditOrAdd ref="editOrAddRef" @submit="submitCallback" @cancel="showColumnDropdown = false" />
-            ref="editOrAddRef"
+            </template>
-            @submit="submitCallback"
+          </a-dropdown>
-            @cancel="showColumnDropdown = false"
-          />
         </template>
       </draggable>
     </a-col>