perf: new redis view
parent
4ee3977f80
commit
f4cd4fbb52
|
@ -6,36 +6,3 @@ import { defHttp } from '@/utils/http/axios'
|
|||
export function getCache() {
|
||||
return defHttp.get({ url: '/infra/redis/get-monitor-info' })
|
||||
}
|
||||
// 获取模块
|
||||
export function getKeyDefineList() {
|
||||
return defHttp.get({ url: '/infra/redis/get-key-define-list' })
|
||||
}
|
||||
/**
|
||||
* 获取redis key列表
|
||||
*/
|
||||
export function getKeyList(keyTemplate: string) {
|
||||
return defHttp.get({
|
||||
url: '/infra/redis/get-key-list',
|
||||
params: {
|
||||
keyTemplate,
|
||||
},
|
||||
})
|
||||
}
|
||||
// 获取缓存内容
|
||||
export function getKeyValue(key: string) {
|
||||
return defHttp.get({ url: `/infra/redis/get-key-value?key=${key}` })
|
||||
}
|
||||
|
||||
// 根据键名删除缓存
|
||||
export function deleteKey(key: string) {
|
||||
return defHttp.delete({ url: `/infra/redis/delete-key?key=${key}` })
|
||||
}
|
||||
|
||||
export function deleteKeys(keyTemplate: string) {
|
||||
return defHttp.delete({
|
||||
url: '/infra/redis/delete-keys?',
|
||||
params: {
|
||||
keyTemplate,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
|
|
@ -12,8 +12,6 @@ import { useMessage } from '@/hooks/web/useMessage'
|
|||
|
||||
defineOptions({ name: 'InfraPreviewModal' })
|
||||
|
||||
const TabPane = Tabs.TabPane
|
||||
|
||||
const { createMessage } = useMessage()
|
||||
|
||||
const fileTree = ref([])
|
||||
|
@ -123,24 +121,22 @@ async function copy(text: string) {
|
|||
<div class="flex">
|
||||
<Card class="w-1/4 min-w-130">
|
||||
<BasicTree
|
||||
title="文件夹列表"
|
||||
toolbar
|
||||
:default-expand-all="true"
|
||||
tree-wrapper-class-name="h-[800px] overflow-auto"
|
||||
:click-row-to-expand="false"
|
||||
:tree-data="fileTree"
|
||||
:field-names="{ key: 'id', title: 'label' }"
|
||||
title="文件夹列表" toolbar :default-expand-all="true" tree-wrapper-class-name="h-[800px] overflow-auto"
|
||||
:click-row-to-expand="false" :tree-data="fileTree" :field-names="{ key: 'id', title: 'label' }"
|
||||
@select="handleSelect"
|
||||
/>
|
||||
</Card>
|
||||
<Card class="w-3/4">
|
||||
<Tabs v-model:activeKey="activeKey">
|
||||
<TabPane v-for="item in previewCodes" :key="item.filePath" :tab="item.filePath.substring(item.filePath.lastIndexOf('/') + 1)">
|
||||
<a-button type="link" style="float: right" @click="copy(item.code)">
|
||||
<Tabs.TabPane
|
||||
v-for="item in previewCodes" :key="item.filePath"
|
||||
:tab="item.filePath.substring(item.filePath.lastIndexOf('/') + 1)"
|
||||
>
|
||||
<a-button type="link" style="float: right; padding: 4px 60px;" @click="copy(item.code)">
|
||||
复制
|
||||
</a-button>
|
||||
<CodeEditor class="max-h-200" :value="item.code as any" :mode="modeValue" :readonly="true" />
|
||||
</TabPane>
|
||||
<CodeEditor class="max-h-200" :value="item.code" :mode="modeValue" :readonly="true" />
|
||||
</Tabs.TabPane>
|
||||
</Tabs>
|
||||
</Card>
|
||||
</div>
|
||||
|
|
|
@ -6,8 +6,8 @@ import { useECharts } from '@/hooks/web/useECharts'
|
|||
import { propTypes } from '@/utils/propTypes'
|
||||
|
||||
const props = defineProps({
|
||||
loading: Boolean,
|
||||
commandStats: propTypes.array,
|
||||
loading: propTypes.bool.def(true),
|
||||
commandStats: propTypes.array.def([]),
|
||||
width: propTypes.string.def('100%'),
|
||||
height: propTypes.string.def('300px'),
|
||||
})
|
||||
|
|
|
@ -6,8 +6,8 @@ import { useECharts } from '@/hooks/web/useECharts'
|
|||
import { propTypes } from '@/utils/propTypes'
|
||||
|
||||
const props = defineProps({
|
||||
loading: Boolean,
|
||||
memoryHuman: String,
|
||||
loading: propTypes.bool.def(true),
|
||||
memoryHuman: propTypes.string.def('0'),
|
||||
width: propTypes.string.def('100%'),
|
||||
height: propTypes.string.def('300px'),
|
||||
})
|
||||
|
@ -36,7 +36,7 @@ watch(
|
|||
},
|
||||
data: [
|
||||
{
|
||||
value: Number.parseFloat(props.memoryHuman as unknown as number),
|
||||
value: Number.parseFloat(props.memoryHuman),
|
||||
name: '内存消耗',
|
||||
},
|
||||
],
|
||||
|
|
|
@ -2,14 +2,14 @@
|
|||
import { ref } from 'vue'
|
||||
import { List } from 'ant-design-vue'
|
||||
import { formSchema } from '../redis.data'
|
||||
import { useI18n } from '@/hooks/web/useI18n'
|
||||
import { BasicForm, useForm } from '@/components/Form'
|
||||
import { BasicModal, useModalInner } from '@/components/Modal'
|
||||
import { deleteKey, getKeyList } from '@/api/infra/redis'
|
||||
|
||||
defineOptions({ name: 'RedisModal' })
|
||||
const ListItem = List.Item
|
||||
const ListItemMeta = List.Item.Meta
|
||||
|
||||
const { t } = useI18n()
|
||||
const listData = ref<any[]>([])
|
||||
|
||||
const [registerForm, { setFieldsValue, resetFields }] = useForm({
|
||||
|
@ -41,16 +41,16 @@ function handleDeleteKey(item) {
|
|||
<BasicModal v-bind="$attrs" title="缓存模块" @register="registerModal">
|
||||
<List :data-source="listData">
|
||||
<template #renderItem="{ item }">
|
||||
<ListItem>
|
||||
<ListItemMeta>
|
||||
<List.Item>
|
||||
<template #actions>
|
||||
<a @click="handleDeleteKey(item)">{{ t('action.delete') }}</a>
|
||||
</template>
|
||||
<List.Item.Meta>
|
||||
<template #title>
|
||||
<a @click="handleKeyValue(item)">{{ item }}</a>
|
||||
</template>
|
||||
<template #actions>
|
||||
<a @click="handleDeleteKey(item)">删除</a>
|
||||
</template>
|
||||
</ListItemMeta>
|
||||
</ListItem>
|
||||
</List.Item.Meta>
|
||||
</List.Item>
|
||||
</template>
|
||||
</List>
|
||||
<BasicForm @register="registerForm" />
|
||||
|
|
|
@ -1,11 +1,8 @@
|
|||
<script lang="ts" setup>
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { baseInfoSchema, tableSchema } from './redis.data'
|
||||
import RedisModal from './components/RedisModal.vue'
|
||||
import { useModal } from '@/components/Modal'
|
||||
import { baseInfoSchema } from './redis.data'
|
||||
import { Description } from '@/components/Description'
|
||||
import { BasicTable, useTable } from '@/components/Table'
|
||||
import { getCache, getKeyDefineList } from '@/api/infra/redis'
|
||||
import { getCache } from '@/api/infra/redis'
|
||||
import { createAsyncComponent } from '@/utils/factory/createAsyncComponent'
|
||||
|
||||
defineOptions({ name: 'InfraRedis' })
|
||||
|
@ -27,25 +24,6 @@ async function getList() {
|
|||
loading.value = false
|
||||
}
|
||||
|
||||
const [registerTable] = useTable({
|
||||
loading,
|
||||
maxHeight: 400,
|
||||
title: '缓存列表',
|
||||
api: getKeyDefineList,
|
||||
rowKey: 'id',
|
||||
columns: tableSchema,
|
||||
pagination: false,
|
||||
useSearchForm: false,
|
||||
showTableSetting: false,
|
||||
showIndexColumn: false,
|
||||
})
|
||||
|
||||
const [registerModal, { openModal }] = useModal()
|
||||
|
||||
function openKeyTemplate(keyDefine) {
|
||||
openModal(true, { record: keyDefine.keyTemplate })
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await getList()
|
||||
})
|
||||
|
@ -64,9 +42,5 @@ onMounted(async () => {
|
|||
<CommandStats class="md:w-1/2 w-full" :loading="loading" :command-stats="commandStats" />
|
||||
<Memory class="md:w-1/2 w-full" :loading="loading" :memory-human="memoryHuman" />
|
||||
</div>
|
||||
<div class="md:flex enter-y mt-4">
|
||||
<BasicTable @register="registerTable" @row-click="openKeyTemplate" />
|
||||
</div>
|
||||
<RedisModal @register="registerModal" />
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -1,7 +1,4 @@
|
|||
import type { DescItem } from '@/components/Description'
|
||||
import type { BasicColumn, FormSchema } from '@/components/Table'
|
||||
import { useRender } from '@/components/Table'
|
||||
import { DICT_TYPE } from '@/utils/dict'
|
||||
|
||||
export const baseInfoSchema: DescItem[] = [
|
||||
{
|
||||
|
@ -65,52 +62,3 @@ export const baseInfoSchema: DescItem[] = [
|
|||
},
|
||||
},
|
||||
]
|
||||
|
||||
export const tableSchema: BasicColumn[] = [
|
||||
{
|
||||
title: 'Key 模板',
|
||||
dataIndex: 'keyTemplate',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: 'Key 类型',
|
||||
dataIndex: 'keyType',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: 'Value 类型',
|
||||
dataIndex: 'valueType',
|
||||
width: 300,
|
||||
},
|
||||
{
|
||||
title: '超时类型',
|
||||
dataIndex: 'timeoutType',
|
||||
width: 180,
|
||||
customRender: ({ text }) => {
|
||||
return useRender.renderDict(text, DICT_TYPE.INFRA_REDIS_TIMEOUT_TYPE)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '超时时间',
|
||||
dataIndex: 'timeout',
|
||||
width: 100,
|
||||
customRender: ({ text }) => {
|
||||
return useRender.renderText(text === 0 ? 0 : text / 1000, '秒')
|
||||
},
|
||||
},
|
||||
]
|
||||
|
||||
export const formSchema: FormSchema[] = [
|
||||
{
|
||||
label: '缓存键名',
|
||||
field: 'cacheForm.key',
|
||||
dynamicDisabled: true,
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
label: '缓存内容',
|
||||
field: 'cacheForm.value',
|
||||
dynamicDisabled: true,
|
||||
component: 'InputTextArea',
|
||||
},
|
||||
]
|
||||
|
|
Loading…
Reference in New Issue