门诊医生排班->科室名称管理页面基础按钮功能、数据渲染OK

2025-12-09 14:17:58 +08:00
parent 19702c25e5
commit b149f7d687
2 changed files with 148 additions and 20 deletions
--- a/openhis-server-new/openhis-application/src/main/java/com/openhis/web/appointmentmanage/controller/DeptController.java
+++ b/openhis-server-new/openhis-application/src/main/java/com/openhis/web/appointmentmanage/controller/DeptController.java
@@ -31,8 +31,8 @@ public class DeptController {
    * */
    @GetMapping("/search")
    public R<?> searchDept(
-            @RequestParam(required = false) Integer pageNo,
-            @RequestParam(required = false) Integer pageSize,
+            @RequestParam(required = false,defaultValue = "1") Integer pageNo,
+            @RequestParam(required = false,defaultValue = "10") Integer pageSize,
            @RequestParam(required = false)String orgName,
            @RequestParam(required = false)String deptName
    ){
--- a/openhis-ui-vue3/src/views/appoinmentmanage/index.vue
+++ b/openhis-ui-vue3/src/views/appoinmentmanage/index.vue
@@ -9,7 +9,7 @@
      <div class="query-condition">
        <el-select v-model="queryParams.orgName" placeholder="全部机构" class="query-select">
          <el-option label="全部机构" value=""></el-option>
-          <el-option label="演示医院" value="演示医院"></el-option>
+          <el-option label="示例医院" value="示例医院"></el-option>
        </el-select>
        
        <el-select v-model="queryParams.deptName" placeholder="全部科室" class="query-select">
@@ -29,14 +29,35 @@
      <!-- 科室列表 -->
      <div class="dept-table-container">
        <el-table :data="deptList" border style="width: 100%" class="centered-table">
+          <!-- 添加空状态提示 -->
+          <template #empty>
+            <div style="padding: 20px 0;">
+              <el-icon><DocumentRemove /></el-icon>
+              <span style="margin-left: 8px;">暂无数据</span>
+            </div>
+          </template>
+          
+          <!-- 适配常见的后端字段名 -->
          <el-table-column prop="id" label="ID" width="150"></el-table-column>
-          <el-table-column prop="orgName" label="卫生机构" width="350"></el-table-column>
-          <el-table-column prop="deptName" label="科室名称" width="350"></el-table-column>
-          <el-table-column prop="remark" label="备注" width="400"></el-table-column>
+          <el-table-column prop="orgName" label="卫生机构" width="350">
+            <template #default="scope">
+              {{ scope.row.orgName || scope.row.organizationName || scope.row.org || '' }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="deptName" label="科室名称" width="350">
+            <template #default="scope">
+              {{ scope.row.deptName || scope.row.departmentName || scope.row.name || '' }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="remark" label="备注" width="400">
+            <template #default="scope">
+              {{ scope.row.remark || scope.row.description || scope.row.note || '' }}
+            </template>
+          </el-table-column>
          <el-table-column prop="status" label="作废标志">
            <template #default="scope">
-              <el-tag :type="scope.row.status ? 'success' : 'danger'">
-                {{ scope.row.status ? '有效' : '无效' }}
+              <el-tag :type="(scope.row.status === 1 || scope.row.status === true || scope.row.status === '1') ? 'success' : 'danger'">
+                {{ (scope.row.status === 1 || scope.row.status === true || scope.row.status === '1') ? '有效' : '无效' }}
              </el-tag>
            </template>
          </el-table-column>
@@ -67,13 +88,49 @@
      </div>
    </div>
  </div>
+  
+  <!-- 预约设置弹窗 -->
+  <el-dialog
+    v-model="appointmentSettingDialog"
+    title="预约设置"
+    width="400px"
+    center
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    top="50%"
+    :before-close="handleAppointmentSettingCancel"
+  >
+    <el-form label-position="top" :model="appointmentSettingForm">
+      <el-form-item label="取消预约时间类型">
+        <el-select v-model="appointmentSettingForm.cancelAppointmentType" placeholder="请选择" style="width: 200px">
+          <el-option label="年" value="年"></el-option>
+          <el-option label="月" value="月"></el-option>
+          <el-option label="日" value="日"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="取消预约次数">
+        <el-input-number
+          v-model="appointmentSettingForm.cancelAppointmentCount"
+          :min="0"
+          :step="1"
+          placeholder="请输入"
+        ></el-input-number>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="handleAppointmentSettingCancel">取消</el-button>
+        <el-button type="primary" @click="handleAppointmentSettingConfirm">确定</el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>

 <script setup name="AppoinmentManage">
 import { ref, onMounted } from 'vue'
-import { ElMessage } from 'element-plus'
-import { EditPen, View } from '@element-plus/icons-vue'
-import { listDept } from '@/api/appoinmentmanage/dept'
+import { ElMessage, ElDialog, ElSelect, ElOption, ElInput, ElForm, ElFormItem } from 'element-plus'
+import { EditPen, View, DocumentRemove } from '@element-plus/icons-vue'
+import { listDept, searchDept } from '@/api/appoinmentmanage/dept'

 // 查询参数
 const queryParams = ref({
@@ -91,18 +148,64 @@ const pagination = ref({
  total: 0
 })

-// 获取科室列表
-const getDeptList = async () => {
+// 预约设置弹窗
+const appointmentSettingDialog = ref(false)
+
+// 预约设置表单数据
+const appointmentSettingForm = ref({
+  cancelAppointmentType: '年',
+  cancelAppointmentCount: 0
+})
+
+// 获取科室列表（通用方法）
+const fetchDeptList = async (apiFunction) => {
  try {
-    const res = await listDept({
+    const res = await apiFunction({
      ...queryParams.value,
      pageNo: pagination.value.currentPage,
      pageSize: pagination.value.pageSize
    })
+    console.log('后端返回的数据:', res)
    if (res.code === 200) {
-      // 修改数据赋值方式，适配后端返回的数据结构
-      deptList.value = res.data
-      pagination.value.total = res.data.length
+      // 适配不同的后端数据结构
+      let dataList = []
+      let totalCount = 0
+      
+      // 首先检查是否存在嵌套的data结构
+      let actualData = res.data
+      // 处理嵌套data结构（用户提供的格式）
+      if (actualData && actualData.code === 200 && actualData.msg) {
+        actualData = actualData.data
+      }
+      
+      // 检查是否是标准分页结构 (Spring Boot Page)
+      if (actualData && actualData.content) {
+        // Spring Boot Page结构使用content字段
+        dataList = actualData.content
+        totalCount = actualData.totalElements || 0
+      } else if (actualData && actualData.records) {
+        // 自定义分页结构使用records字段
+        dataList = actualData.records
+        totalCount = actualData.total || 0
+      } else if (Array.isArray(actualData)) {
+        // 直接返回数组
+        dataList = actualData
+        totalCount = actualData.length
+      } else if (actualData && actualData.list) {
+        // 其他可能的列表字段名
+        dataList = actualData.list
+        totalCount = actualData.total || actualData.list.length
+      } else {
+        // 默认处理
+        dataList = actualData || []
+        totalCount = Array.isArray(actualData) ? actualData.length : 0
+      }
+      
+      deptList.value = dataList
+      pagination.value.total = totalCount
+      
+      console.log('处理后的数据列表:', deptList.value)
+      console.log('总记录数:', pagination.value.total)
    } else {
      ElMessage.error(res.msg || '获取科室列表失败')
    }
@@ -112,10 +215,15 @@ const getDeptList = async () => {
  }
 }

+// 获取科室列表（默认列表）
+const getDeptList = async () => {
+  await fetchDeptList(listDept)
+}
+
 // 查询
 const handleQuery = () => {
  pagination.value.currentPage = 1
-  getDeptList()
+  fetchDeptList(searchDept)
 }

 // 重置
@@ -128,9 +236,22 @@ const handleReset = () => {
  getDeptList()
 }

-// 预约设置
+// 预约设置弹窗显示
 const handleAppointmentSetting = () => {
-  ElMessage.info('预约设置功能待开发')
+  appointmentSettingDialog.value = true
+}
+
+// 预约设置确定
+const handleAppointmentSettingConfirm = () => {
+  // 这里可以添加表单验证和提交逻辑
+  console.log('预约设置提交:', appointmentSettingForm.value)
+  ElMessage.success('预约设置保存成功')
+  appointmentSettingDialog.value = false
+}
+
+// 预约设置取消
+const handleAppointmentSettingCancel = () => {
+  appointmentSettingDialog.value = false
 }

 // 编辑
@@ -219,4 +340,11 @@ onMounted(() => {
    text-align: center;
  }
 }
+</style>
+
+<style scoped>
+/* 确保弹窗内容区占满宽度 */
+:deep(.el-dialog__body) {
+  padding: 20px;
+}
 </style>