root/rax-medical
1
0
Fork 0
mirror of https://gitee.com/xiongmao1988/rax-medical.git synced 2025-08-24 13:04:57 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

🎨 添加table功能，优化显示

This commit is contained in:
gaofy 2023-12-27 16:49:37 +08:00
parent 2cefe72878
commit 93e3e859cf
18 changed files with 373 additions and 214 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/assets/css/global.scss
View File

@ -178,6 +178,8 @@ body {
.table-page {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.search-part {
width: 100%;
height: 40px;
@ -208,6 +210,7 @@ body {
.table-part {
width: 100%;
height: calc(100% - 170px);
flex-grow: 1;
margin-top: 10px;
.el-table {
color: $text1-color;
@ -218,7 +221,7 @@ body {
font-size: 16px;
}
th {
background: rgba($main-color, .05);
background: #f2f3f5;
}
}
.el-table__row.disable {

4
src/components/page-tabs.vue
View File

@ -51,12 +51,12 @@ const tabClick = (e: MenuItem) => {
transition: background .6s;
&:hover {
color: $main-color;
background: rgba($main-color, .05);
background: #f2f3f5;
transition: background .6s;
}
&.active {
color: $main-color;
background: rgba($main-color, .1);
background: #f2f3f5;
font-weight: 600;
transition: background .6s;
}

38
src/components/table-ability.vue Normal file
View File

@ -0,0 +1,38 @@
<template>
<div>
<el-button v-if="isSearch" icon="Search" @click="searchBtn"></el-button>
<el-button v-if="isRefresh" icon="Refresh" @click="refreshBtn" style="margin-left: 10px;"></el-button>
<el-button v-if="isDownload" icon="Download" @click="downloadBtn" style="margin-left: 10px;"></el-button>
</div>
</template>
<script lang='ts' setup>
import { onMounted, reactive, ref, toRefs, watch } from 'vue'
const emit = defineEmits(['searchBtn', 'refreshBtn', 'downloadBtn'])
interface Props {
isSearch: Boolean
isRefresh: Boolean
isDownload: Boolean
}
const props = withDefaults(defineProps<Props>(), {
isSearch: () => true,
isRefresh: () => true,
isDownload: () => true
})
const searchBtn = () => {
emit('searchBtn')
}
const refreshBtn = () => {
emit('refreshBtn')
}
const downloadBtn = () => {
emit('downloadBtn')
}
</script>
<style lang='scss' scoped>
</style>

2
src/main.ts
View File

@ -5,6 +5,7 @@ import router from './router'
import { createPinia } from 'pinia'
import ElementPlus from 'element-plus';
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import TableAbility from '@/components/table-ability.vue'
import SliderVerify from 'slider-verify-v3'
import 'slider-verify-v3/lib/SliderVerify.css'
@ -26,6 +27,7 @@ app.use(SliderVerify)
app.use(router)
.use(ElementPlus) // ElementPlus 全局引入
app.component('TableAbility', TableAbility)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}

1
src/router/index.ts
View File

@ -134,7 +134,6 @@ const router = createRouter({
router.beforeEach((to, from, next) => {
const loginInfo = useLoginStore().getlogin()
const isLogin = loginInfo.isLogin
console.log(from)
// 普通用户
const commonUser = [
'/login',

16
src/views/index.vue
View File

@ -102,8 +102,6 @@ switch (userInfo.permissions) {
break;
}
const isShowUserInfoDrawer = ref(false)
const menuActive = ref('/')
@ -166,6 +164,7 @@ const userCommand = (e: string) => {
height: 100%;
.head-box {
position: relative;
width: 100%;
height: 70px;
padding: 0 24px;
@ -173,6 +172,7 @@ const userCommand = (e: string) => {
display: flex;
justify-content: space-between;
align-items: center;
padding-right: 460px;
.logo-box {
height: 50px;
@ -185,6 +185,7 @@ const userCommand = (e: string) => {
.menu-box {
display: flex;
align-items: center;
flex-shrink: 0;
.menu-item {
cursor: pointer;
@ -200,13 +201,13 @@ const userCommand = (e: string) => {
-webkit-transition: all .5s;
&:hover {
background: #F5F7FA;
background: #f2f3f5;
transition: all .5s;
-webkit-transition: all .5s;
}
&.active {
background: rgba($main-color, .1);
background: #f2f3f5;
transition: all .5s;
-webkit-transition: all .5s;
}
@ -218,8 +219,15 @@ const userCommand = (e: string) => {
}
.user-box {
position: absolute;
width: 440px;
height: 100%;
top: 0;
right: 20px;
display: flex;
justify-content: flex-end;
align-items: center;
background: white;
.select-hospital {
margin-right: 20px;

1
src/views/logs-manage/chart/login-chart.vue
View File

@ -27,7 +27,6 @@ function initChart(chartData: any) {
tooltip: {
trigger: 'axis',
formatter: (params: any) => {
console.log(params)
return dateFormater('yyyy-MM-dd', params[0].axisValue) + '<br>登录记录：' + params[0].value + '条'
}
},

17
src/views/logs-manage/logs-manage.vue
View File

@ -4,7 +4,7 @@
<div style="width: 100%;height: 35%;">
<LoginChart />
</div>
<div class="search-part ">
<div class="search-part" v-show="isSearch">
<div class="search-cell">
<span class="label">类型</span>
<el-select v-model="queryParams.type" placeholder="请选择类型">
@ -21,10 +21,10 @@
</div>
<div class="button-part" style="justify-content: space-between;">
<el-button icon="Delete" @click="removeData()">删除</el-button>
<el-button icon="Download" @click="exportData('日志数据', tableData)">下载</el-button>
<TableAbility @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})" @downloadBtn="exportData('日志数据', tableData)"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip
@row-click="tableRowClick">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="#" width="55" align="center" />
@ -71,6 +71,8 @@ const route = useRoute()
const tableRef = ref()
const logFormRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({} as any)
@ -79,18 +81,21 @@ const tableData = ref([] as any)
queryData({ type: '正常' })
function queryData(e: any) {
console.log(e)
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
type: e.type,
title: e.title,
type: e.type || '正常',
title: e.title || '测试',
ip: '127.0.0.1',
requestMethod: 'post',
requestTime: new Date(),
operator: 'admin'
})
}
loading.value = false
}, 200);
}
const viewData = (e: any) => {

31
src/views/logs-manage/message-manage.vue
View File

@ -1,12 +1,11 @@
<template>
<div class="table-page custom-table-table">
<h3 class="main-color" style="font-size: 24px;line-height: 1;padding: 28px 0;">消息管理</h3>
<div class="search-part ">
<div class="search-part " v-show="isSearch">
<div class="search-cell">
<span class="label">消息类型</span>
<el-select v-model="queryParams.type" placeholder="请选择消息类型">
<el-option v-for="item in getMessageType()" :key="item.value" :label="item.label"
:value="item.value" />
<el-option v-for="item in getMessageType()" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<div class="search-cell">
@ -18,9 +17,10 @@
</div>
<div class="button-part" style="justify-content: space-between;">
<el-button type="primary" icon="FirstAidKit" @click="addData">新增</el-button>
<TableAbility :isDownload="false" @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip>
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip>
<el-table-column property="type" label="消息类型" width="120" align="center" />
<el-table-column property="content" label="消息内容" width="120" align="center" />
<el-table-column property="creator" label="创建人" width="120" align="center" />
@ -45,7 +45,10 @@
<CommonPagination :total="100" @paginationChange="paginationChange" />
</div>
</div>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="40%"><MessageForm ref="messageFormRef" :type="formDialogTitle === '新增消息' ? 'add' : 'edit'" @close="isFormDialog = false" /></el-dialog>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="40%">
<MessageForm ref="messageFormRef" :type="formDialogTitle === '新增消息' ? 'add' : 'edit'"
@close="isFormDialog = false" />
</el-dialog>
</template>
<script lang='ts' setup>
@ -63,6 +66,8 @@ const route = useRoute()
const tableRef = ref()
const messageFormRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({} as any)
@ -71,11 +76,13 @@ const tableData = ref([] as any)
queryData({ type: '公告', content: '测试测试测试' })
function queryData(e: any) {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
type: e.type,
content: e.content,
type: e.type || '公告',
content: e.content || '测试测试测试',
creator: 'admin',
creatTime: new Date(),
editor: 'admin',
@ -87,6 +94,8 @@ function queryData (e: any) {
isHot: true,
})
}
loading.value = false
}, 200);
}
const addData = () => {
@ -122,19 +131,21 @@ const paginationChange = (page: number, size: number) => {
.search-part {
padding: 40px 30px;
border: 1px solid $border-color;
&>.search-cell~.search-cell {
margin-left: 50px;
}
.search-cell {
flex-grow: 1;
}
&>.el-button {
margin-left: 100px;
}
}
.table-part {
height: calc(100% - 292px);
}
}
</style>
}</style>

22
src/views/patients-manage/form/patients-form.vue
View File

@ -1,5 +1,5 @@
<template>
<el-form ref="formRef" :model="formData" :rules="rules" label-width="60">
<el-form ref="formRef" :model="formData" :rules="rules" label-width="60" :disabled="type === 'view'">
<el-row :gutter="gutter">
<el-col :span="12">
<el-form-item label="姓名" prop="name">
@ -65,7 +65,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="过敏史名称" prop="allergyHistoryName" :label-width="rightWidth">
<el-input v-model="formData.medicalHistoryName" placeholder="请输入过敏史"></el-input>
<el-input v-model="formData.allergyHistoryName" placeholder="请输入过敏史"></el-input>
</el-form-item>
</el-col>
</el-row>
@ -82,11 +82,11 @@
</el-col>
</el-row>
<div v-if="type !== 'edit'" style="text-align: right;">
<div v-if="type === 'add'" style="text-align: right;">
<el-button class="f18" @click="close">取消</el-button>
<el-button class="f18" type="primary" @click="saveData">确认</el-button>
</div>
<div v-else style="text-align: right;">
<div v-else-if="type === 'edit'" style="text-align: right;">
<el-button class="f18" @click="saveData">修改</el-button>
<el-button class="f18" type="primary" @click="saveData">更新</el-button>
</div>
@ -148,12 +148,18 @@ function resetData() {
formRef.value.resetFields()
formData.value = {
id: '',
userName: '',
name: '',
role: '',
mailbox: '',
code: '',
sex: '',
dept: '',
bodyHeight: '',
isMedicalHistory: '',
bodyWeight: '',
medicalHistoryName: '',
age: '',
allergyHistoryName: '',
phone: '',
enable: true,
hospitalTime: ''
}
}
const saveData = async () => {

36
src/views/patients-manage/patients-manage.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="table-page">
<div class="search-part">
<div class="search-part" v-show="isSearch">
<div class="search-cell">
<span class="label">患者姓名</span>
<el-input v-model="queryParams.name" placeholder="请输入患者姓名"></el-input>
@ -8,8 +8,7 @@
<div class="search-cell">
<span class="label">科室名</span>
<el-select v-model="queryParams.dept" placeholder="请选择科室名">
<el-option v-for="item in getDeptData()" :key="item.value" :label="item.label"
:value="item.value" />
<el-option v-for="item in getDeptData()" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<el-button type="primary" icon="Search" @click="queryData(queryParams)">查询</el-button>
@ -21,10 +20,11 @@
<el-button icon="FirstAidKit" @click="importData">导入</el-button>
<el-button icon="Delete" @click="removeData()">删除</el-button>
</div>
<el-button icon="Download" @click="exportData('患者信息', tableData)">下载</el-button>
<TableAbility @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})"
@downloadBtn="exportData('患者信息', tableData)"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip
@row-click="tableRowClick">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="#" width="55" align="center" />
@ -39,8 +39,10 @@
<el-table-column label="手术数据" header-align="center">
<template #default="scope">
<span @click.stop style="padding: 0 50px;">
<el-button v-if="scope.row.userInfo" type="primary" round @click="viewUserInfo(scope.row)">个人信息</el-button>
<el-button v-if="scope.row.surgeryInfo" type="primary" round @click="viewSurgeryInfo(scope.row)">手术信息</el-button>
<el-button v-if="scope.row.userInfo" type="primary" round
@click="viewUserInfo(scope.row)">个人信息</el-button>
<el-button v-if="scope.row.surgeryInfo" type="primary" round
@click="viewSurgeryInfo(scope.row)">手术信息</el-button>
</span>
</template>
</el-table-column>
@ -50,7 +52,10 @@
<CommonPagination :total="100" @paginationChange="paginationChange" />
</div>
</div>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="40%"><PatientsForm ref="patientsFormRef" :type="formDialogTitle === '增加患者' ? 'add' : 'edit'" @close="isFormDialog = false" /></el-dialog>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="40%">
<PatientsForm ref="patientsFormRef" :type="formDialogTitle === '增加患者' ? 'add' : 'edit'"
@close="isFormDialog = false" />
</el-dialog>
<ImportDialog ref="importDialogRef" title="患者导入" templateUrl="#" importUrl="#" />
</template>
@ -70,6 +75,8 @@ const route = useRoute()
const tableRef = ref()
const patientsFormRef = ref()
const importDialogRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({
@ -81,19 +88,23 @@ const tableData = ref([] as any)
queryData({ name: '测试', dept: getDeptData()[0].label })
function queryData(e: any) {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
code: '123456', // 住院号
name: e.name,
name: e.name || '测试',
phone: '12312345678',
dept: e.dept,
dept: e.dept || '测试',
doctor: '张医生',
userInfo: Boolean(tableData.value.length < 2),
surgeryInfo: Boolean(tableData.value.length < 1)
})
}
loading.value = false
}, 200);
}
const addData = () => {
@ -138,7 +149,4 @@ const paginationChange = (page: number, size: number) => {
}
</script>
<style lang='scss' scoped>
</style>
<style lang='scss' scoped></style>

35
src/views/permissions-manage/doctor-manage.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="table-page">
<div class="search-part">
<div class="search-part" v-show="isSearch">
<div class="search-cell">
<span class="label">用户名</span>
<el-input v-model="queryParams.userName" placeholder="请输入用户名"></el-input>
@ -14,11 +14,12 @@
<el-button icon="FirstAidKit" @click="importData">导入</el-button>
<el-button icon="Delete" @click="removeData()">删除</el-button>
</div>
<el-button icon="Download" @click="exportData('医生数据', tableData)">导出</el-button>
<TableAbility @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})"
@downloadBtn="exportData('医生数据', tableData)"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip :row-class-name="({row}: any) => !row.enable && 'disable'"
@row-click="tableRowClick">
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip
:row-class-name="({ row }: any) => !row.enable && 'disable'" @row-click="tableRowClick">
<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" />
@ -35,9 +36,12 @@
<el-table-column label="操作" align="center">
<template #default="scope">
<span @click.stop>
<el-button link icon="RefreshLeft" @click="resetPassword(scope.row)" :disabled="!scope.row.enable">密码</el-button>
<el-button link icon="EditPen" @click="editData(scope.row)" :disabled="!scope.row.enable">修改</el-button>
<el-button link icon="Delete" @click="removeData(scope.row)" :disabled="!scope.row.enable">删除</el-button>
<el-button link icon="RefreshLeft" @click="resetPassword(scope.row)"
:disabled="!scope.row.enable">密码</el-button>
<el-button link icon="EditPen" @click="editData(scope.row)"
:disabled="!scope.row.enable">修改</el-button>
<el-button link icon="Delete" @click="removeData(scope.row)"
:disabled="!scope.row.enable">删除</el-button>
</span>
</template>
</el-table-column>
@ -47,7 +51,9 @@
<CommonPagination :total="100" @paginationChange="paginationChange" />
</div>
</div>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="750px"><DoctorForm ref="doctorFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" /></el-dialog>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="750px">
<DoctorForm ref="doctorFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" />
</el-dialog>
<ImportDialog ref="importDialogRef" title="用户导入" templateUrl="#" importUrl="#" />
</template>
@ -62,6 +68,8 @@ import ImportDialog from '@/components/import-dialog.vue'
const tableRef = ref()
const doctorFormRef = ref()
const importDialogRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({
@ -72,16 +80,20 @@ const tableData = ref([] as any)
queryData({ userName: '测试' })
function queryData(e: any) {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
userName: 'cscs',
name: e.userName,
name: e.userName || '测试',
phone: '12312345678',
role: '高级管理员',
enable: true,
})
}
loading.value = false
}, 200);
}
const addData = () => {
isFormDialog.value = true
@ -127,7 +139,4 @@ const paginationChange = (page: number, size: number) => {
}
</script>
<style lang='scss' scoped>
</style>
<style lang='scss' scoped></style>

2
src/views/permissions-manage/form/empower-dialog.vue
View File

@ -5,8 +5,10 @@
<el-checkbox v-model="toggleExpand" @change="toggleExpandChange">展开 / 折叠</el-checkbox>
<el-checkbox v-model="toggleSelectAll" @change="toggleSelectAllChange">全选 / 全不选</el-checkbox>
</template>
<div style="min-height: 200px;max-height: 500px;overflow-y: auto;">
<el-tree ref="treeRef" :key="treeKey" :props="props" :data="treeData" :default-expanded-keys="expandedKey" node-key="id"
show-checkbox @check-change="checkChange" />
</div>
<div style="text-align: right;margin-top: 20px;">
<el-button class="f18" @click="dialogVisible = false">取消</el-button>
<el-button class="f18" type="primary" @click="updateData">更新</el-button>

28
src/views/permissions-manage/menu-manage.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="table-page">
<div class="search-part">
<div class="search-part" v-show="isSearch">
<div class="search-cell">
<span class="label">菜单名称</span>
<el-input v-model="queryParams.menuName" placeholder="请输入菜单名称"></el-input>
@ -13,7 +13,7 @@
<el-button type="primary" icon="FirstAidKit" @click="addData">新增</el-button>
<el-button @click="expandTable">展开/折叠</el-button>
</div>
<!-- <el-button icon="Download" @click="exportData('角色数据', tableData)">导出</el-button> -->
<TableAbility :isDownload="false" @searchBtn="isSearch = !isSearch" @refreshBtn="initData()"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" row-key="id" height="100%" border show-overflow-tooltip
@ -39,7 +39,9 @@
<CommonPagination :total="100" @paginationChange="paginationChange" />
</div>
</div>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%"><MenuForm ref="doctorFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" /></el-dialog>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%">
<MenuForm ref="doctorFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" />
</el-dialog>
</template>
<script lang='ts' setup>
@ -53,6 +55,8 @@ let isExpand = false // 表格展开状态
const tableRef = ref()
const doctorFormRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({
@ -60,6 +64,12 @@ const queryParams = ref({
} as any)
const tableData = ref([] as any)
initData()
function initData() {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
id: tableData.value.length,
@ -80,9 +90,14 @@ while (tableData.value.length < 10) {
]
})
}
loading.value = false
}, 200);
}
const queryData = (e: any) => {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
id: tableData.value.length,
@ -93,6 +108,8 @@ const queryData = (e: any) => {
type: '菜单',
})
}
loading.value = false
}, 200);
}
const addData = () => {
isFormDialog.value = true
@ -131,7 +148,4 @@ const paginationChange = (page: number, size: number) => {
}
</script>
<style lang='scss' scoped>
</style>
<style lang='scss' scoped></style>

25
src/views/permissions-manage/role-manage.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="table-page">
<div class="search-part">
<div class="search-part" v-show="isSearch">
<div class="search-cell">
<span class="label">角色名称</span>
<el-input v-model="queryParams.roleName" placeholder="请输入角色名称"></el-input>
@ -14,10 +14,10 @@
<el-button icon="FirstAidKit" @click="importData">导入</el-button>
<el-button icon="Delete" @click="removeData()">删除</el-button>
</div>
<el-button icon="Download" @click="exportData('角色数据', tableData)">导出</el-button>
<TableAbility @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})" @downloadBtn="exportData('角色数据', tableData)"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip
@row-click="tableRowClick">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="#" width="55" align="center" />
@ -26,7 +26,7 @@
<el-table-column property="roleRemark" label="角色描述" width="120" align="center" />
<el-table-column property="dataPermissions" label="数据权限" width="120" align="center" />
<el-table-column label="创建时间" width="220" align="center">
<template #default="scope"><b>{{ scope.row.createdTime }}</b></template>
<template #default="scope">{{ scope.row.createdTime }}</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template #default="scope">
@ -43,7 +43,9 @@
<CommonPagination :total="100" @paginationChange="paginationChange" />
</div>
</div>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%"><RoleForm ref="RoleFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" /></el-dialog>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%">
<RoleForm ref="RoleFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" />
</el-dialog>
<ImportDialog ref="importDialogRef" title="角色导入" templateUrl="#" importUrl="#" />
<EmpowerDialog ref="empowerDialogRef" />
</template>
@ -62,6 +64,8 @@ const tableRef = ref()
const RoleFormRef = ref()
const importDialogRef = ref()
const empowerDialogRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({
@ -72,16 +76,20 @@ const tableData = ref([] as any)
queryData({ roleName: '测试' })
function queryData(e: any) {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
roleName: e.roleName,
roleName: e.roleName || '测试',
roleMark: 'ROLE_ADMIN',
roleRemark: '超级管理员',
dataPermissions: '全部',
createdTime: dateFormater('yyyy-MM-dd HH:mm:ss'),
})
}
loading.value = false
}, 200);
}
const addData = () => {
isFormDialog.value = true
@ -124,7 +132,4 @@ const paginationChange = (page: number, size: number) => {
}
</script>
<style lang='scss' scoped>
</style>
<style lang='scss' scoped></style>

50
src/views/remote-manage/remote-control.vue
View File

@ -40,7 +40,7 @@
<el-option v-for="item in databaseOptions" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>
<el-button color="#C77000">患者信息</el-button>
<el-button color="#C77000" @click="viewPatientInfo">患者信息</el-button>
<el-button color="#C77000">已连接</el-button>
<el-button color="#C77000">机器人运行正常</el-button>
</div>
@ -126,6 +126,7 @@
</span>
</template>
</el-dialog>
<el-dialog v-model="isPatientDialog" title="患者信息" width="40%"><PatientsForm ref="patientsFormRef" type="view" @close="isPatientDialog = false" /></el-dialog>
</div>
</template>
@ -138,6 +139,7 @@ import { dateFormater } from '@/utils/date-util';
import { post } from "@/axios/index";
import chartLine from './chart/chart-line.vue';
import chartEcg from './chart/chart-ecg.vue';
import PatientsForm from '@/views/patients-manage/form/patients-form.vue'
import imgLung from '@/assets/imgs/lung.png';
import imgHeart from '@/assets/imgs/heart.png';
import imgLungAlarm from '@/assets/imgs/lung_alarm.png';
@ -170,8 +172,10 @@ const chartDom1 = ref(),
chartDom4 = ref(),
liveVideo = ref(),
msgLog = ref(),
unusualMsg = ref();
unusualMsg = ref(),
patientsFormRef = ref();
const isPatientDialog = ref(false)
const database = ref('');
const databaseOptions = ref([] as { value: string, label: string }[]);
const messageSum = ref(10);
@ -415,11 +419,13 @@ function getTableData(e: boolean) {
}
function keepFit(designWidth: number, designHeight: number, renderDomId: string) {
let width = designWidth || 1920,
height = designHeight || 1030;
height = designHeight || 1010;
let clientHeight = document.documentElement.clientHeight - 50;
let clientWidth = document.documentElement.clientWidth;
let scale = 1;
scale = clientHeight / height;
scale = (clientHeight / clientWidth) < (height / width) ? clientHeight / height : clientWidth / width;
// scale = clientHeight / height;
// scale = clientWidth / width;
const renderDom = document.getElementById(renderDomId);
if (renderDom) {
renderDom.style.height = clientHeight / scale + 'px';
@ -429,7 +435,7 @@ function keepFit(designWidth: number, designHeight: number, renderDomId: string)
}
function initScale() {
let w = 1920,
h = 1030;
h = 1010;
keepFit(w, h, 'screenBox');
window.addEventListener('resize', () => {
keepFit(w, h, 'screenBox');
@ -443,6 +449,27 @@ const setDatabase = () => {
initData();
setDatabaseDialog.value = false;
};
const viewPatientInfo = () => {
isPatientDialog.value = true;
setTimeout(() => {
patientsFormRef.value.resetData()
patientsFormRef.value.formData = JSON.parse(JSON.stringify({
id: '',
name: '测试',
code: 'afasf',
sex: '男',
dept: '测试',
bodyHeight: '170',
isMedicalHistory: '无',
bodyWeight: '80',
medicalHistoryName: '无',
age: '22',
allergyHistoryName: '无',
phone: '123456',
hospitalTime: new Date()
}))
}, 0)
}
const backRemote = () => {
router.back()
}
@ -525,9 +552,9 @@ const tableItemCancel = (e: any) => {
<style lang="scss" scoped>
.remote-box {
width: 1920px;
height: 1020px;
height: 1010px;
background: #f1f3f5;
padding-top: 10px;
padding: 10px 0 20px 0;
transform-origin: top left;
overflow-y: auto;
.el-button {
@ -536,7 +563,6 @@ const tableItemCancel = (e: any) => {
.main-box {
width: 100%;
height: 100%;
// min-height: 1080px;
background: white;
padding: 20px;
box-sizing: border-box;
@ -557,7 +583,7 @@ const tableItemCancel = (e: any) => {
.chart-line {
width: 100%;
height: calc(25% - 15px - 12.5px);
height: calc(25% - 30px);
margin-bottom: 20px;
background: #e8f5f8;
border-top-left-radius: 20px;
@ -567,7 +593,7 @@ const tableItemCancel = (e: any) => {
.chart-ecg {
width: 100%;
height: calc(25% - 15px - 12.5px);
height: calc(25% - 50px);
border-left: 1px solid #92b3c1;
border-bottom: 1px solid #92b3c1;
@ -689,7 +715,8 @@ const tableItemCancel = (e: any) => {
.right-box {
width: 670px;
height: 100%;
display: flex;
flex-direction: column;
.top-btn-box {
width: 100%;
height: 34px;
@ -869,6 +896,7 @@ const tableItemCancel = (e: any) => {
.table-box {
width: 100%;
height: calc(100% - 589px);
flex-grow: 1;
:deep(.el-table__inner-wrapper) {
.el-table__cell {

22
src/views/system-manage/hospitals.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="table-page">
<div class="search-part">
<div class="search-part" v-show="isSearch">
<div class="search-cell">
<span class="label">医院名称</span>
<el-input v-model="queryParams.userName" placeholder="请输入医院名称"></el-input>
@ -13,10 +13,11 @@
<el-button type="primary" icon="FirstAidKit" @click="addData">新增</el-button>
<el-button icon="Delete" @click="removeData()">删除</el-button>
</div>
<el-button icon="Download" @click="exportData('医生数据', tableData)">导出</el-button>
<TableAbility @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})"
@downloadBtn="exportData('医生数据', tableData)"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip
@row-click="tableRowClick">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="#" width="55" align="center" />
@ -52,7 +53,9 @@
<template #header>
<h3 class="main-color f20" style="padding: 20px 20px 0 20px;">{{ formDialogTitle }}</h3>
</template>
<HospitalForm ref="hospitalFormRef" :type="formDialogTitle === '添加' ? 'add' : formDialogTitle === '修改' ? 'edit' : 'view'" @close="isFormDialog = false" />
<HospitalForm ref="hospitalFormRef"
:type="formDialogTitle === '添加' ? 'add' : formDialogTitle === '修改' ? 'edit' : 'view'"
@close="isFormDialog = false" />
</el-drawer>
</template>
@ -66,6 +69,8 @@ import { dateFormater } from '@/utils/date-util'
const tableRef = ref()
const hospitalFormRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({
@ -76,10 +81,12 @@ const tableData = ref([] as any)
queryData({ name: '测试' })
function queryData(e: any) {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
name: e.name,
name: e.name || '测试',
code: '',
admin: {
userName: 'admin',
@ -92,6 +99,8 @@ function queryData(e: any) {
state: '正常'
})
}
loading.value = false
}, 200);
}
const addData = () => {
isFormDialog.value = true
@ -132,5 +141,4 @@ const paginationChange = (page: number, size: number) => {
}
</script>
<style lang='scss' scoped>
</style>
<style lang='scss' scoped></style>

34
src/views/system-manage/user-list.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="table-page custom-table-page">
<div class="search-part">
<div class="search-part" v-show="isSearch">
<div class="search-cell">
<span class="label">用户名</span>
<el-input v-model="queryParams.userName" placeholder="请输入用户名"></el-input>
@ -8,9 +8,13 @@
<el-button type="primary" icon="Search" @click="queryData(queryParams)">查询</el-button>
<el-button icon="Refresh" @click="queryParams = {}">重置</el-button>
</div>
<div class="button-part" style="justify-content: space-between;">
<div></div>
<TableAbility :isDownload="false" @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})"></TableAbility>
</div>
<div class="table-part">
<el-table ref="tableRef" :data="tableData" height="100%" border show-overflow-tooltip :row-class-name="({row}: any) => !row.enable && 'disable'"
@row-click="tableRowClick">
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip
:row-class-name="({ row }: any) => !row.enable && 'disable'" @row-click="tableRowClick">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="#" width="55" align="center" />
<el-table-column property="hospital" label="医院名称" width="200" align="center" />
@ -28,9 +32,12 @@
<el-table-column label="操作" align="center">
<template #default="scope">
<span @click.stop>
<el-button link icon="RefreshLeft" @click="resetPassword(scope.row)" :disabled="!scope.row.enable">密码</el-button>
<el-button link icon="EditPen" @click="editData(scope.row)" :disabled="!scope.row.enable">修改</el-button>
<el-button link icon="Delete" @click="removeData(scope.row)" :disabled="!scope.row.enable">删除</el-button>
<el-button link icon="RefreshLeft" @click="resetPassword(scope.row)"
:disabled="!scope.row.enable">密码</el-button>
<el-button link icon="EditPen" @click="editData(scope.row)"
:disabled="!scope.row.enable">修改</el-button>
<el-button link icon="Delete" @click="removeData(scope.row)"
:disabled="!scope.row.enable">删除</el-button>
</span>
</template>
</el-table-column>
@ -40,7 +47,9 @@
<CommonPagination :total="100" @paginationChange="paginationChange" />
</div>
</div>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="750px"><UserForm ref="userFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" /></el-dialog>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="750px">
<UserForm ref="userFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" />
</el-dialog>
</template>
<script lang='ts' setup>
@ -52,6 +61,8 @@ import UserForm from './form/user-form.vue'
const tableRef = ref()
const userFormRef = ref()
const isSearch = ref(true)
const loading = ref(true)
const isFormDialog = ref(false)
const formDialogTitle = ref('')
const queryParams = ref({
@ -62,17 +73,21 @@ const tableData = ref([] as any)
queryData({ userName: '测试' })
function queryData(e: any) {
loading.value = true
tableData.value = []
setTimeout(() => {
while (tableData.value.length < 10) {
tableData.value.push({
hospital: '北京朝阳医院',
userName: 'cscs',
name: e.userName,
name: e.userName || '测试',
phone: '12312345678',
role: '高级管理员',
enable: true,
})
}
loading.value = false
}, 200);
}
const removeData = (e?: any) => {
const selectRow = e || tableRef.value.getSelectionRows()
@ -109,8 +124,7 @@ const paginationChange = (page: number, size: number) => {
<style lang='scss' scoped>
.table-page.custom-table-page {
.table-part {
height: calc(100% - 110px);
height: calc(100% - 180px);
}
}
</style>