mirror of
https://gitee.com/xiongmao1988/rax-medical.git
synced 2025-08-24 21:14:57 +08:00
69 lines
2.7 KiB
Vue
69 lines
2.7 KiB
Vue
<template>
|
|
<div class="table-page">
|
|
<div class="search-part">
|
|
<div class="search-cell">
|
|
<span class="label">用户名</span>
|
|
<el-input v-model="queryParams.userName" placeholder="请输入用户名"></el-input>
|
|
</div>
|
|
<el-button type="primary" icon="Search">查询</el-button>
|
|
<el-button icon="Refresh">重置</el-button>
|
|
</div>
|
|
<div class="button-part">
|
|
<el-button type="primary" icon="FirstAidKit">新增</el-button>
|
|
<el-button icon="FirstAidKit">导入</el-button>
|
|
<el-button icon="Delete">删除</el-button>
|
|
<el-button icon="Download">导出</el-button>
|
|
</div>
|
|
<div class="table-part">
|
|
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip>
|
|
<el-table-column type="selection" width="55" />
|
|
<el-table-column type="index" label="#" width="55" align="center" />
|
|
<el-table-column property="name" label="姓名" width="120" align="center" />
|
|
<el-table-column label="手机号" width="220" align="center">
|
|
<template #default="scope">{{ scope.row.phone.slice(0, 3) + '****' + scope.row.phone.slice(7) }}</template>
|
|
</el-table-column>
|
|
<el-table-column property="role" label="角色" width="220" align="center" />
|
|
<el-table-column label="启用" width="120" align="center">
|
|
<template #default="scope"><el-switch v-model="scope.row.enable" /></template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center">
|
|
<template #default="scope">
|
|
<el-button link icon="RefreshLeft">密码</el-button>
|
|
<el-button link icon="EditPen">修改</el-button>
|
|
<el-button link icon="Delete">删除</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
<div class="pagination-part">
|
|
<CommonPagination :total="100" @paginationChange="paginationChange" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang='ts' setup>
|
|
import { onMounted, reactive, ref, toRefs, watch } from 'vue'
|
|
import CommonPagination from '@/components/common-pagination.vue'
|
|
|
|
const queryParams = ref({
|
|
userName: ''
|
|
})
|
|
const tableData = ref([] as any)
|
|
|
|
while (tableData.value.length < 10) {
|
|
tableData.value.push({
|
|
userName: 'cscs',
|
|
name: '测试',
|
|
phone: '12312345678',
|
|
role: '高级管理员',
|
|
enable: true,
|
|
})
|
|
}
|
|
|
|
const paginationChange = (page: number, size: number) => {
|
|
|
|
}
|
|
</script>
|
|
|
|
<style lang='scss' scoped></style>
|