root/ludu-admin-vue3
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: style

Browse Source
This commit is contained in:
xingyuv 2023-02-14 16:02:01 +08:00
parent 4a1a1ab297
commit 2ebcb72215
1 changed files with 37 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/views/system/notice/index.vue
View File

@ -15,20 +15,22 @@
<el-button type="primary" @click="getList">Query</el-button> <el-button type="primary" @click="getList">Query</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<div style="width: 100%; height: 500px"> <div style="width: 100%; height: 600px">
<el-auto-resizer> <el-auto-resizer>
<template #default="{ height, width }"> <template #default="{ height, width }">
<el-table-v2 :columns="columns" :data="tableData" :width="width" :height="height" fixed /> <el-table-v2 :columns="columns" :data="tableData" :width="width" :height="height" fixed />
</template> </template>
</el-auto-resizer> </el-auto-resizer>
<el-pagination <div class="mt-2">
:current-page="queryParms.pageNo" <el-pagination
:page-size="queryParms.pageSize" :current-page="queryParms.pageNo"
layout="total, prev, pager, next" :page-size="queryParms.pageSize"
:total="tableTotal" layout="total, prev, pager, next"
@size-change="getList" :total="tableTotal"
@current-change="getList" @size-change="getList"
/> @current-change="getList"
/>
</div>
</div> </div>
</ContentWrap> </ContentWrap>
</template> </template>
@ -37,6 +39,7 @@ import dayjs from 'dayjs'
import { Column, ElPagination, ElTableV2, TableV2FixedDir } from 'element-plus' import { Column, ElPagination, ElTableV2, TableV2FixedDir } from 'element-plus'
import * as NoticeApi from '@/api/system/notice' import * as NoticeApi from '@/api/system/notice'
import { XTextButton } from '@/components/XButton' import { XTextButton } from '@/components/XButton'
import { DictTag } from '@/components/DictTag'
const { t } = useI18n() // 国际化 const { t } = useI18n() // 国际化
const columns: Column<any>[] = [ const columns: Column<any>[] = [
@ -57,13 +60,19 @@ const columns: Column<any>[] = [
key: 'type', key: 'type',
dataKey: 'type', dataKey: 'type',
title: '公告类型', title: '公告类型',
width: 180 width: 180,
cellRenderer: ({ cellData: type }) => (
<DictTag type={DICT_TYPE.SYSTEM_NOTICE_TYPE} value={type}></DictTag>
)
}, },
{ {
key: 'status', key: 'status',
dataKey: 'status', dataKey: 'status',
title: t('common.status'), title: t('common.status'),
width: 180 width: 180,
cellRenderer: ({ cellData: status }) => (
<DictTag type={DICT_TYPE.COMMON_STATUS} value={status}></DictTag>
)
}, },
{ {
key: 'content', key: 'content',
@ -85,15 +94,22 @@ const columns: Column<any>[] = [
key: 'actionbtns', key: 'actionbtns',
dataKey: 'actionbtns', //需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id dataKey: 'actionbtns', //需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id
title: '操作', //显示在单元格表头的文本 title: '操作', //显示在单元格表头的文本
width: 80, //当前列的宽度，必须设置 width: 160, //当前列的宽度，必须设置
fixed: TableV2FixedDir.RIGHT, //是否固定列 fixed: TableV2FixedDir.RIGHT, //是否固定列
align: 'center', align: 'center',
cellRenderer: ({ cellData: id }) => ( cellRenderer: ({ cellData: id }) => (
<XTextButton <>
preIcon="ep:delete" <XTextButton
title={t('action.del')} preIcon="ep:delete"
onClick={handleDelete.bind(this, id)} title={t('action.edit')}
></XTextButton> onClick={handleUpdate.bind(this, id)}
></XTextButton>
<XTextButton
preIcon="ep:delete"
title={t('action.del')}
onClick={handleDelete.bind(this, id)}
></XTextButton>
</>
) )
} }
] ]
@ -115,6 +131,10 @@ const getList = async () => {
tableTotal.value = res.total tableTotal.value = res.total
} }
const handleUpdate = (id) => {
console.info(id)
}
const handleDelete = (id) => { const handleDelete = (id) => {
console.info(id) console.info(id)
} }