perf: 优化分享进入页面的访问令牌弹窗

 <script lang="ts" setup>
 <script lang="ts" setup>
   import { onMounted } from 'vue';
   import { onMounted } from 'vue';
-  import { BasicModal, useModal } from '/@/components/Modal';
-  import { Spin } from 'ant-design-vue';
+  import { Spin, Modal, Button, Input, Row, Col } from 'ant-design-vue';
   import { ref } from 'vue';
   import { ref } from 'vue';
   import { useRoute } from 'vue-router';
   import { useRoute } from 'vue-router';
   import { checkShareAccessToken, sharePageLogin, getShareContent } from '/@/api/sys/share';
   import { checkShareAccessToken, sharePageLogin, getShareContent } from '/@/api/sys/share';
@@ -16,7 +15,9 @@
   const contentData = ref<any>();
   const contentData = ref<any>();
   const canLoadComponent = ref(false);
   const canLoadComponent = ref(false);
 
 
-  const [register, { openModal }] = useModal();
+  const modelVisable = ref(false);
+
+  // const [register, { openModal }] = useModal();
 
 
   const [registerForm, { getFieldsValue }] = useForm({
   const [registerForm, { getFieldsValue }] = useForm({
     schemas: [
     schemas: [
@@ -24,11 +25,15 @@
         field: FieldsEnum.ACCESS_CREDENTIALS,
         field: FieldsEnum.ACCESS_CREDENTIALS,
         component: 'Input',
         component: 'Input',
         label: '访问令牌',
         label: '访问令牌',
+        slot: 'tokenInput',
+        componentProps: {
+          placeholder: '请输入访问令牌',
+        },
       },
       },
     ],
     ],
     showActionButtonGroup: false,
     showActionButtonGroup: false,
-    layout: 'inline',
-    labelWidth: 100,
+    layout: 'vertical',
+    baseColProps: { span: 24 },
   });
   });
 
 
   const userStore = useUserStore();
   const userStore = useUserStore();
@@ -45,7 +50,7 @@
     loading.value = true;
     loading.value = true;
     const { viewType, id } = params as Partial<ShareRouteParams>;
     const { viewType, id } = params as Partial<ShareRouteParams>;
     const { data } = await checkShareAccessToken(viewType!, id!);
     const { data } = await checkShareAccessToken(viewType!, id!);
-    data ? openModal(data) : await getContentData();
+    data ? (modelVisable.value = true) : await getContentData();
   };
   };
 
 
   const getContentLoading = ref(false);
   const getContentLoading = ref(false);
@@ -59,7 +64,8 @@
       contentData.value = result;
       contentData.value = result;
       loading.value = false;
       loading.value = false;
       canLoadComponent.value = true;
       canLoadComponent.value = true;
-      openModal(false);
+      // openModal(false);
+      modelVisable.value = false;
     } catch (error) {
     } catch (error) {
     } finally {
     } finally {
       getContentLoading.value = false;
       getContentLoading.value = false;
@@ -77,15 +83,64 @@
 </script>
 </script>
 
 
 <template>
 <template>
-  <BasicModal
-    @register="register"
-    title="公开"
-    @ok="handleSubmit"
-    :showCancelBtn="false"
-    :okButtonProps="{ loading: getContentLoading }"
+  <Modal
+    v-model:visible="modelVisable"
+    centered
+    :title="null"
+    :close-icon="null"
+    width="350px"
+    :footer="null"
+    wrapClassName="share-page-token-modal"
   >
   >
-    <BasicForm @register="registerForm" />
-  </BasicModal>
+    <section class="w-full h-full flex flex-col p-8 justify-center items-center">
+      <BasicForm @register="registerForm" class="w-full" @keyup.enter="handleSubmit">
+        <template #tokenInput="{ field, model }">
+          <Input.Group>
+            <Row>
+              <Col :span="18">
+                <Input v-model:value="model[field]" placeholder="请输入访问令牌" />
+              </Col>
+              <Col :span="6">
+                <Button
+                  class="w-full !flex justify-center items-center"
+                  :loading="getContentLoading"
+                  type="primary"
+                  @click="handleSubmit"
+                >
+                  <svg
+                    t="1682068997810"
+                    class="icon"
+                    viewBox="0 0 1024 1024"
+                    version="1.1"
+                    xmlns="http://www.w3.org/2000/svg"
+                    p-id="79416"
+                    width="24"
+                    height="24"
+                  >
+                    <path
+                      d="M512 928H128c-19.2 0-32-12.8-32-32V128c0-19.2 12.8-32 32-32h384c19.2 0 32 12.8 32 32s-12.8 32-32 32H160v704h352c19.2 0 32 12.8 32 32s-12.8 32-32 32z"
+                      fill="#fff"
+                      p-id="79417"
+                    />
+                    <path
+                      d="M534.4 736c-9.6 0-16-3.2-22.4-9.6l-192-192c-12.8-12.8-12.8-32 0-44.8l192-192c12.8-12.8 32-12.8 44.8 0 12.8 12.8 12.8 32 0 44.8L387.2 512l169.6 169.6c12.8 12.8 12.8 32 0 44.8-6.4 6.4-16 9.6-22.4 9.6z"
+                      fill="#fff"
+                      p-id="79418"
+                    />
+                    <path
+                      d="M896 544H342.4c-19.2 0-32-12.8-32-32s12.8-32 32-32H896c19.2 0 32 12.8 32 32s-12.8 32-32 32z"
+                      fill="#fff"
+                      p-id="79419"
+                    />
+                  </svg>
+                </Button>
+              </Col>
+            </Row>
+          </Input.Group>
+        </template>
+      </BasicForm>
+    </section>
+  </Modal>
   <Spin
   <Spin
     :spinning="loading"
     :spinning="loading"
     tip="正在加载中..."
     tip="正在加载中..."
@@ -96,4 +151,10 @@
   </Spin>
   </Spin>
 </template>
 </template>
 
 
-<style lang="less" scoped></style>
+<style lang="less">
+  .share-page-token-modal {
+    .ant-modal-close {
+      display: none;
+    }
+  }
+</style>