fix:解决弹框问题
Showing
2 changed files
with
6 additions
and
2 deletions
| ... | @@ -547,7 +547,7 @@ defineExpose({ | ... | @@ -547,7 +547,7 @@ defineExpose({ |
| 547 | <template> | 547 | <template> |
| 548 | <el-dialog v-model="dialogVisible" :title="dialogTitle" :width="dialogSize" :show-close="showClose" | 548 | <el-dialog v-model="dialogVisible" :title="dialogTitle" :width="dialogSize" :show-close="showClose" |
| 549 | :modal="dialogModal" :close-on-click-modal="modalClose" :modal-class="dialogModalClass" destroy-on-close | 549 | :modal="dialogModal" :close-on-click-modal="modalClose" :modal-class="dialogModalClass" destroy-on-close |
| 550 | align-center :before-close="beforeClose" @close="dialogClose"> | 550 | align-center :before-close="beforeClose" @close="dialogClose" :append-to-body="dialogInfo?.appendToBody ?? false"> |
| 551 | <template v-if="headerSearchInputVisible" #header="{ titleId, titleClass }"> | 551 | <template v-if="headerSearchInputVisible" #header="{ titleId, titleClass }"> |
| 552 | <span :id="titleId" :class="titleClass">{{ dialogTitle }}</span> | 552 | <span :id="titleId" :class="titleClass">{{ dialogTitle }}</span> |
| 553 | <el-input class="header_search_input" v-model.trim="headerSearchInputValue" | 553 | <el-input class="header_search_input" v-model.trim="headerSearchInputValue" | ... | ... |
| ... | @@ -58,6 +58,7 @@ onMounted(() => { | ... | @@ -58,6 +58,7 @@ onMounted(() => { |
| 58 | 58 | ||
| 59 | const verifyDialogInfo = ref({ | 59 | const verifyDialogInfo = ref({ |
| 60 | visible: false, | 60 | visible: false, |
| 61 | appendToBody: true, | ||
| 61 | size: 600, | 62 | size: 600, |
| 62 | direction: "column", | 63 | direction: "column", |
| 63 | header: { | 64 | header: { |
| ... | @@ -165,7 +166,9 @@ const verifyDialogBtnClick = (btn, info) => { | ... | @@ -165,7 +166,9 @@ const verifyDialogBtnClick = (btn, info) => { |
| 165 | </template> | 166 | </template> |
| 166 | </el-popover> | 167 | </el-popover> |
| 167 | 168 | ||
| 168 | <Dialog :dialogInfo="verifyDialogInfo" @btnClick="verifyDialogBtnClick"> | 169 | |
| 170 | <teleport to="body" v-if="verifyDialogInfo.visible"> | ||
| 171 | <Dialog :dialogInfo="verifyDialogInfo" @btnClick="verifyDialogBtnClick"> | ||
| 169 | <div class="row-main"> | 172 | <div class="row-main"> |
| 170 | <div class="per" :class="selectRole == USERROLE.USE ? 'selected' : ''" @click="selectRole = USERROLE.USE"> | 173 | <div class="per" :class="selectRole == USERROLE.USE ? 'selected' : ''" @click="selectRole = USERROLE.USE"> |
| 171 | <div class="img-use"></div> | 174 | <div class="img-use"></div> |
| ... | @@ -183,6 +186,7 @@ const verifyDialogBtnClick = (btn, info) => { | ... | @@ -183,6 +186,7 @@ const verifyDialogBtnClick = (btn, info) => { |
| 183 | </div> --> | 186 | </div> --> |
| 184 | </div> | 187 | </div> |
| 185 | </Dialog> | 188 | </Dialog> |
| 189 | </teleport> | ||
| 186 | </div> | 190 | </div> |
| 187 | </template> | 191 | </template> |
| 188 | <style lang="scss" scoped> | 192 | <style lang="scss" scoped> | ... | ... |
-
Please register or sign in to post a comment