linweidong
/
besure_server
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: IFrame

Browse Source
plp
xingyu 3 years ago
parent d604c6c5fb
commit 557f2937f5
6 changed files with 204 additions and 196 deletions
Show Stats Download Patch File Download Diff File

68
yudao-ui-admin-vue3/src/views/infra/dbDoc/index.vue
Unescape Escape View File

@ -1,13 +1,39 @@
<template>
<ContentWrap title="数据库文档">
<!-- 操作工具栏 -->
<div class="mb-10px">
<XButton
type="primary"
preIcon="ep:download"
:title="t('action.export') + ' HTML'"
@click="handleExport('HTML')"
/>
<XButton
type="primary"
preIcon="ep:download"
:title="t('action.export') + ' Word'"
@click="handleExport('Word')"
/>
<XButton
type="primary"
preIcon="ep:download"
:title="t('action.export') + ' Markdown'"
@click="handleExport('Markdown')"
/>
</div>
<IFrame v-if="!loding" v-loading="loding" :src="src" />
</ContentWrap>
</template>
<script setup lang="ts">
import { IFrame } from '@/components/IFrame'
import * as DbDocApi from '@/api/infra/dbDoc'
import { onMounted, ref } from 'vue'
import download from '@/utils/download'
import { useI18n } from '@/hooks/web/useI18n'
import { IFrame } from '@/components/IFrame'
import * as DbDocApi from '@/api/infra/dbDoc'
const { t } = useI18n() // 国际化
const loding = ref(true)
const src = ref('')
const loding = ref(true)
/** 页面加载 */
const init = async () => {
const res = await DbDocApi.exportHtmlApi()
@ -16,40 +42,16 @@ const init = async () => {
src.value = blobUrl
loding.value = false
}
/** 处理导出 HTML */
const handleExportHtml = async () => {
const res = await DbDocApi.exportHtmlApi()
download.html(res, '数据库文档.html')
}
/** 处理导出 Word */
const handleExportWord = async () => {
/** 处理导出 */
const handleExport = async (type: string) => {
const res = await DbDocApi.exportHtmlApi()
download.word(res, '数据库文档.doc')
}
/** 处理导出 Markdown */
const handleExportMarkdown = async () => {
const res = await DbDocApi.exportHtmlApi()
download.markdown(res, '数据库文档.md')
if (type === 'HTML') { download.html(res, '数据库文档.html') }
if (type === 'Word') { download.word(res, '数据库文档.doc') }
if(type === 'Markdown') {download.markdown(res, '数据库文档.md')}
}
onMounted(async () => {
await init()
})
</script>
<template>
<ContentWrap title="数据库文档" message="https://doc.iocoder.cn/db-doc/">
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" @click="handleExportHtml">
<Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') + ' HTML' }}
</el-button>
<el-button type="primary" @click="handleExportWord">
<Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') + ' Word' }}
</el-button>
<el-button type="primary" @click="handleExportMarkdown">
<Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') + ' Markdown' }}
</el-button>
</div>
<IFrame v-if="!loding" v-loading="loding" :src="src" />
</ContentWrap>
</template>

13
yudao-ui-admin-vue3/src/views/infra/druid/index.vue
Unescape Escape View File

@ -1,12 +1,13 @@
<template>
<ContentWrap>
<IFrame :src="src" />
</ContentWrap>
</template>
<script setup lang="ts">
import { IFrame } from '@/components/IFrame'
import { ref } from 'vue'
import { IFrame } from '@/components/IFrame'
const BASE_URL = import.meta.env.VITE_BASE_URL
const src = ref(BASE_URL + '/druid/index.html')
</script>
<template>
<ContentWrap>
<IFrame :src="src" />
</ContentWrap>
</template>

281
yudao-ui-admin-vue3/src/views/infra/redis/index.vue
Unescape Escape View File

@ -1,9 +1,135 @@
<template>
<el-scrollbar height="calc(100vh - 88px - 40px - 50px)">
<el-row>
<el-col :span="24" class="card-box" shadow="hover">
<el-card>
<el-descriptions title="基本信息" :column="6" border>
<el-descriptions-item label="Redis版本 :">
{{ cache?.info?.redis_version }}
</el-descriptions-item>
<el-descriptions-item label="运行模式 :">
{{ cache?.info?.redis_mode == 'standalone' ? '单机' : '集群' }}
</el-descriptions-item>
<el-descriptions-item label="端口 :">
{{ cache?.info?.tcp_port }}
</el-descriptions-item>
<el-descriptions-item label="客户端数 :">
{{ cache?.info?.connected_clients }}
</el-descriptions-item>
<el-descriptions-item label="运行时间(天) :">
{{ cache?.info?.uptime_in_days }}
</el-descriptions-item>
<el-descriptions-item label="使用内存 :">
{{ cache?.info?.used_memory_human }}
</el-descriptions-item>
<el-descriptions-item label="使用CPU :">
{{ cache?.info ? parseFloat(cache?.info?.used_cpu_user_children).toFixed(2) : '' }}
</el-descriptions-item>
<el-descriptions-item label="内存配置 :">
{{ cache?.info?.maxmemory_human }}
</el-descriptions-item>
<el-descriptions-item label="AOF是否开启 :">
{{ cache?.info?.aof_enabled == '0' ? '否' : '是' }}
</el-descriptions-item>
<el-descriptions-item label="RDB是否成功 :">
{{ cache?.info?.rdb_last_bgsave_status }}
</el-descriptions-item>
<el-descriptions-item label="Key数量 :">
{{ cache?.dbSize }}
</el-descriptions-item>
<el-descriptions-item label="网络入口/出口 :">
{{ cache?.info?.instantaneous_input_kbps }}kps/
{{ cache?.info?.instantaneous_output_kbps }}kps
</el-descriptions-item>
</el-descriptions>
</el-card>
</el-col>
<el-col :span="12" style="margin-top: 10px">
<el-card :gutter="12" shadow="hover">
<div ref="commandStatsRef" style="height: 350px"></div>
</el-card>
</el-col>
<el-col :span="12" style="margin-top: 10px">
<el-card style="margin-left: 10px" :gutter="12" shadow="hover">
<div ref="usedmemory" style="height: 350px"></div>
</el-card>
</el-col>
</el-row>
<el-row style="margin-top: 10px">
<el-col :span="24" class="card-box" shadow="hover">
<el-card>
<el-table
v-loading="keyListLoad"
:data="keyList"
row-key="id"
@row-click="openKeyTemplate"
>
<el-table-column prop="keyTemplate" label="Key 模板" width="200" />
<el-table-column prop="keyType" label="Key 类型" width="100" />
<el-table-column prop="valueType" label="Value 类型" />
<el-table-column prop="timeoutType" label="超时时间" width="200">
<template #default="{ row }">
<DictTag :type="DICT_TYPE.INFRA_REDIS_TIMEOUT_TYPE" :value="row?.timeoutType" />
<span v-if="row?.timeout > 0">({{ row?.timeout / 1000 }} 秒)</span>
</template>
</el-table-column>
<el-table-column prop="memo" label="备注" />
</el-table>
</el-card>
</el-col>
</el-row>
</el-scrollbar>
<XModal v-model="dialogVisible" :title="keyTemplate + ' 模板'">
<el-row>
<el-col :span="14" style="margin-top: 10px">
<el-card shadow="always">
<template #header>
<div class="card-header">
<span>键名列表</span>
</div>
</template>
<el-table :data="cacheKeys" style="width: 100%" @row-click="handleKeyValue">
<el-table-column label="缓存键名" align="center" :show-overflow-tooltip="true">
<template #default="{ row }">
{{ row }}
</template>
</el-table-column>
<el-table-column label="操作" align="right" width="60">
<template #default="{ row }">
<el-button link type="primary" @click="handleDeleteKey(row)">
<Icon icon="ep:delete" />
</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
<el-col :span="10" style="margin-top: 10px">
<el-card shadow="always">
<template #header>
<div class="card-header">
<span>缓存内容</span>
<el-button
link
type="primary"
@click="handleDeleteKeys(keyTemplate)"
style="float: right; padding: 3px 0"
>
<Icon icon="ep:refresh" />清理全部
</el-button>
</div>
</template>
<el-descriptions :column="1">
<el-descriptions-item label="缓存键名:">{{ cacheForm.key }}</el-descriptions-item>
<el-descriptions-item label="缓存内容:">{{ cacheForm.value }}</el-descriptions-item>
</el-descriptions>
</el-card>
</el-col>
</el-row>
</XModal>
</template>
<script setup lang="ts">
import { onBeforeMount, ref } from 'vue'
import * as RedisApi from '@/api/infra/redis'
import { DICT_TYPE } from '@/utils/dict'
import * as echarts from 'echarts'
import { RedisKeyInfo, RedisMonitorInfoVO } from '@/api/infra/redis/types'
import {
ElRow,
ElCard,
@ -12,9 +138,17 @@ import {
ElTableColumn,
ElScrollbar,
ElDescriptions,
ElDescriptionsItem,
ElMessage
ElDescriptionsItem
} from 'element-plus'
import * as echarts from 'echarts'
import { DICT_TYPE } from '@/utils/dict'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
import * as RedisApi from '@/api/infra/redis'
import { RedisKeyInfo, RedisMonitorInfoVO } from '@/api/infra/redis/types'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const cache = ref<RedisMonitorInfoVO>()
const keyListLoad = ref(true)
const keyList = ref<RedisKeyInfo[]>([])
@ -29,7 +163,6 @@ const readRedisInfo = async () => {
}
// 图表
const commandStatsRef = ref<HTMLElement>()
const usedmemory = ref<HTMLDivElement>()
const loadEchartOptions = (stats) => {
@ -138,11 +271,11 @@ const openKeyTemplate = async (row: RedisKeyInfo) => {
}
const handleDeleteKey = async (row) => {
RedisApi.deleteKeyApi(row)
ElMessage.success('删除成功')
message.success(t('common.delSuccess'))
}
const handleDeleteKeys = async (row) => {
RedisApi.deleteKeysApi(row)
ElMessage.success('删除成功')
message.success(t('common.delSuccess'))
}
const handleKeyValue = async (row) => {
const res = await RedisApi.getKeyValueApi(row)
@ -152,136 +285,6 @@ onBeforeMount(() => {
readRedisInfo()
})
</script>
<template>
<el-scrollbar height="calc(100vh - 88px - 40px - 50px)">
<el-row>
<el-col :span="24" class="card-box" shadow="hover">
<el-card>
<el-descriptions title="基本信息" :column="6" border>
<el-descriptions-item label="Redis版本 :">
{{ cache?.info?.redis_version }}
</el-descriptions-item>
<el-descriptions-item label="运行模式 :">
{{ cache?.info?.redis_mode == 'standalone' ? '单机' : '集群' }}
</el-descriptions-item>
<el-descriptions-item label="端口 :">
{{ cache?.info?.tcp_port }}
</el-descriptions-item>
<el-descriptions-item label="客户端数 :">
{{ cache?.info?.connected_clients }}
</el-descriptions-item>
<el-descriptions-item label="运行时间(天) :">
{{ cache?.info?.uptime_in_days }}
</el-descriptions-item>
<el-descriptions-item label="使用内存 :">
{{ cache?.info?.used_memory_human }}
</el-descriptions-item>
<el-descriptions-item label="使用CPU :">
{{ cache?.info ? parseFloat(cache?.info?.used_cpu_user_children).toFixed(2) : '' }}
</el-descriptions-item>
<el-descriptions-item label="内存配置 :">
{{ cache?.info?.maxmemory_human }}
</el-descriptions-item>
<el-descriptions-item label="AOF是否开启 :">
{{ cache?.info?.aof_enabled == '0' ? '否' : '是' }}
</el-descriptions-item>
<el-descriptions-item label="RDB是否成功 :">
{{ cache?.info?.rdb_last_bgsave_status }}
</el-descriptions-item>
<el-descriptions-item label="Key数量 :">
{{ cache?.dbSize }}
</el-descriptions-item>
<el-descriptions-item label="网络入口/出口 :">
{{ cache?.info?.instantaneous_input_kbps }}kps/
{{ cache?.info?.instantaneous_output_kbps }}kps
</el-descriptions-item>
</el-descriptions>
</el-card>
</el-col>
<el-col :span="12" style="margin-top: 10px">
<el-card :gutter="12" shadow="hover">
<div ref="commandStatsRef" style="height: 350px"></div>
</el-card>
</el-col>
<el-col :span="12" style="margin-top: 10px">
<el-card style="margin-left: 10px" :gutter="12" shadow="hover">
<div ref="usedmemory" style="height: 350px"></div>
</el-card>
</el-col>
</el-row>
<el-row style="margin-top: 10px">
<el-col :span="24" class="card-box" shadow="hover">
<el-card>
<el-table
v-loading="keyListLoad"
:data="keyList"
row-key="id"
@row-click="openKeyTemplate"
>
<el-table-column prop="keyTemplate" label="Key 模板" width="200" />
<el-table-column prop="keyType" label="Key 类型" width="100" />
<el-table-column prop="valueType" label="Value 类型" />
<el-table-column prop="timeoutType" label="超时时间" width="200">
<template #default="{ row }">
<DictTag :type="DICT_TYPE.INFRA_REDIS_TIMEOUT_TYPE" :value="row?.timeoutType" />
<span v-if="row?.timeout > 0">({{ row?.timeout / 1000 }} 秒)</span>
</template>
</el-table-column>
<el-table-column prop="memo" label="备注" />
</el-table>
</el-card>
</el-col>
</el-row>
</el-scrollbar>
<XModal v-model="dialogVisible" :title="keyTemplate + ' 模板'">
<el-row>
<el-col :span="14" style="margin-top: 10px">
<el-card shadow="always">
<template #header>
<div class="card-header">
<span>键名列表</span>
</div>
</template>
<el-table :data="cacheKeys" style="width: 100%" @row-click="handleKeyValue">
<el-table-column label="缓存键名" align="center" :show-overflow-tooltip="true">
<template #default="{ row }">
{{ row }}
</template>
</el-table-column>
<el-table-column label="操作" align="right" width="60">
<template #default="{ row }">
<el-button link type="primary" @click="handleDeleteKey(row)">
<Icon icon="ep:delete" />
</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
<el-col :span="10" style="margin-top: 10px">
<el-card shadow="always">
<template #header>
<div class="card-header">
<span>缓存内容</span>
<el-button
link
type="primary"
@click="handleDeleteKeys(keyTemplate)"
style="float: right; padding: 3px 0"
>
<Icon icon="ep:refresh" />清理全部
</el-button>
</div>
</template>
<el-descriptions :column="1">
<el-descriptions-item label="缓存键名:">{{ cacheForm.key }}</el-descriptions-item>
<el-descriptions-item label="缓存内容:">{{ cacheForm.value }}</el-descriptions-item>
</el-descriptions>
</el-card>
</el-col>
</el-row>
</XModal>
</template>
<style scoped>
.redis {
height: 600px;

14
yudao-ui-admin-vue3/src/views/infra/server/index.vue
Unescape Escape View File

@ -1,12 +1,12 @@
<script setup lang="ts">
import { IFrame } from '@/components/IFrame'
import { ref } from 'vue'
const BASE_URL = import.meta.env.VITE_BASE_URL
const src = ref(BASE_URL + '/admin/applications')
</script>
<template>
<ContentWrap>
<IFrame :src="src" />
</ContentWrap>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { IFrame } from '@/components/IFrame'
const BASE_URL = import.meta.env.VITE_BASE_URL
const src = ref(BASE_URL + '/admin/applications')
</script>

11
yudao-ui-admin-vue3/src/views/infra/skywalking/index.vue
Unescape Escape View File

@ -1,11 +1,12 @@
<script setup lang="ts">
import { IFrame } from '@/components/IFrame'
import { ref } from 'vue'
const src = ref('http://skywalking.shop.iocoder.cn')
</script>
<template>
<ContentWrap>
<IFrame :src="src" />
</ContentWrap>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { IFrame } from '@/components/IFrame'
const src = ref('http://skywalking.shop.iocoder.cn')
</script>

13
yudao-ui-admin-vue3/src/views/infra/swagger/index.vue
Unescape Escape View File

@ -1,12 +1,13 @@
<template>
<ContentWrap>
<IFrame :src="src" />
</ContentWrap>
</template>
<script setup lang="ts">
import { IFrame } from '@/components/IFrame'
import { ref } from 'vue'
import { IFrame } from '@/components/IFrame'
const BASE_URL = import.meta.env.VITE_BASE_URL
const src = ref(BASE_URL + '/doc.html')
</script>
<template>
<ContentWrap>
<IFrame :src="src" />
</ContentWrap>
</template>

Write Preview
Loading…
Cancel
Save