邮箱账号，增加详情弹窗

src/views/system/mail/account/index.vue

@@ -39,6 +39,14 @@
         >
           编辑
         </el-button>
+        <el-button
+          link
+          type="primary"
+          @click="openDetail(row.id)"
+          v-hasPermi="['system:mail-account:query']"
+        >
+          详情
+        </el-button>
         <el-button
           link
           type="danger"
@@ -53,11 +61,14 @@
 
   <!-- 表单弹窗：添加/修改 -->
   <MailAccountForm ref="formRef" @success="getList" />
+  <!-- 详情弹窗 -->
+  <MailAccountDetail ref="detailRef" />
 </template>
 <script setup lang="ts" name="MailAccount">
 import { allSchemas } from './account.data'
 import * as MailAccountApi from '@/api/system/mail/account'
 import MailAccountForm from './MailAccountForm.vue'
+import MailAccountDetail from './MailAccountDetail.vue'
 
 // tableObject：表格的属性对象，可获得分页大小、条数等属性
 // tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
@@ -75,6 +86,12 @@ const openForm = (type: string, id?: number) => {
   formRef.value.open(type, id)
 }
 
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (id: number) => {
+  detailRef.value.open(id)
+}
+
 /** 删除按钮操作 */
 const handleDelete = (id: number) => {
   tableMethods.delList(id, false)