manager/orion-visor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改模板.

Browse Source
This commit is contained in:
lijiahang
2023-10-04 15:47:38 +08:00
parent 0514ea0508
commit 27c24a6f5a
15 changed files with 231 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
orion-ops-ui/src/views/asset/host-identity/components/host-identity-table.vue
View File

@@ -58,7 +58,7 @@
:data="tableRenderData"
:pagination="pagination"
@page-change="(page) => fetchTableData(page, pagination.pageSize)"
@page-size-change="(size) => fetchTableData(pagination.current, size)"
@page-size-change="(size) => fetchTableData(1, size)"
:bordered="false">
<!-- 用户名 -->
<template #username="{ record }">

2
orion-ops-ui/src/views/asset/host-key/components/host-key-table.vue
View File

@@ -50,7 +50,7 @@
:data="tableRenderData"
:pagination="pagination"
@page-change="(page) => fetchTableData(page, pagination.pageSize)"
@page-size-change="(size) => fetchTableData(pagination.current, size)"
@page-size-change="(size) => fetchTableData(1, size)"
:bordered="false">
<!-- 操作 -->
<template #handle="{ record }">

79
orion-ops-ui/src/views/asset/host/components/host-card-list.vue
View File

@@ -3,15 +3,17 @@
v-model:searchValue="formModel.name"
create-card-position="head"
:card-height="180"
:loading="loading"
:list="list"
:pagination="pagination"
:card-layout-cols="cardColLayout"
@add="add"
@search="search"
@reset="reset">
@reset="reset"
@search="fetchTableData"
@page-change="fetchTableData">
<!-- 标题 -->
<template #title="{ record }">
{{ record.name }}
{{ record.id }}
</template>
<!-- 标题拓展 -->
<template #extra="{ index }">
@@ -19,10 +21,24 @@
</template>
<!-- 卡片 -->
<template #card="{ record }">
{{ record }}
<a-descriptions class="card-descriptions"
:data="convert(record)"
:column="1">
<template #value="{ data }">
{{ data.field }}
<template v-if="data.field === 'id'">
<a-tag>{{ data.value }}</a-tag>
</template>
<template v-else>
{{ data.value }}
</template>
</template>
</a-descriptions>
</template>
<template #leftHandle>
<span>1</span>
</template>
</card-list>
{{ formModel }}
</template>
<script lang="ts">
@@ -32,36 +48,59 @@
</script>
<script setup lang="ts">
import { useCardPagination, useCardColLayout } from '@/types/table';
import { usePagination, useColLayout } from '@/types/card';
import { reactive, ref } from 'vue';
import useLoading from '@/hooks/loading';
import { resetObject } from '@/utils';
import { convert } from '../types/card.fields';
const formModel = reactive({
name: undefined
});
const cardColLayout = useCardColLayout();
const pagination = useCardPagination();
const { loading, setLoading } = useLoading();
const cardColLayout = useColLayout();
const pagination = usePagination();
const list = ref<Array<any>>([]);
for (let i = 0; i < 5; i++) {
list.value.push({
id: i + 1,
name: `名称 ${i + 1}`,
host: `192.168.1.${i}`,
disabled: i === 0
});
}
pagination.total = 270;
// 切换页码
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
console.log(page, limit, form);
setLoading(true);
setTimeout(() => {
try {
const t = 90;
for (let i = 0; i < t; i++) {
list.value.push({
id: i + 1,
name: `名称 ${i + 1}`,
address: `192.168.1.${i}`,
disabled: i === 0
});
}
pagination.total = t;
pagination.current = page;
pagination.pageSize = limit;
setLoading(false);
} catch (e) {
} finally {
setLoading(false);
}
}, 300);
};
fetchTableData();
const add = () => {
console.log('add');
};
const search = () => {
console.log('search');
};
const reset = () => {
console.log('reset');
resetObject(formModel);
fetchTableData();
};
</script>
<style scoped lang="less">

2
orion-ops-ui/src/views/asset/host/components/host-table.vue
View File

@@ -79,7 +79,7 @@
:data="tableRenderData"
:pagination="pagination"
@page-change="(page) => fetchTableData(page, pagination.pageSize)"
@page-size-change="(size) => fetchTableData(pagination.current, size)"
@page-size-change="(size) => fetchTableData(1, size)"
:bordered="false">
<!-- 编码 -->
<template #code="{ record }">

30
orion-ops-ui/src/views/asset/host/types/card.fields.ts Normal file
View File

@@ -0,0 +1,30 @@
import { CardField, CardRecord, toCardDesc } from '@/types/card';
export const fields = [
{
field: 'id',
label: 'id',
render: r => r.id,
}, {
field: 'name',
label: '主机名称',
render: r => r.name,
}, {
field: 'code',
label: '主机编码',
render: r => 'code',
}, {
field: 'address',
label: '主机地址',
render: r => 'address',
}, {
field: 'tag',
label: '标签',
render: r => 'tag',
},
] as CardField[];
export const convert = (record: CardRecord) => {
return toCardDesc(fields, record);
};

2
orion-ops-ui/src/views/user/role/components/role-table.vue
View File

@@ -54,7 +54,7 @@
:data="tableRenderData"
:pagination="pagination"
@page-change="(page) => fetchTableData(page, pagination.pageSize)"
@page-size-change="(size) => fetchTableData(pagination.current, size)"
@page-size-change="(size) => fetchTableData(1, size)"
:bordered="false">
<!-- 编码 -->
<template #code="{ record }">

2
orion-ops-ui/src/views/user/user/components/user-table.vue
View File

@@ -69,7 +69,7 @@
:data="tableRenderData"
:pagination="pagination"
@page-change="(page) => fetchTableData(page, pagination.pageSize)"
@page-size-change="(size) => fetchTableData(pagination.current, size)"
@page-size-change="(size) => fetchTableData(1, size)"
:bordered="false">
<!-- 状态 -->
<template #status="{ record }">