Fix Bug #562: AI修复

openhis-ui-vue3/src/views/outpatient/doctor/PendingMedicalRecord.vue

@@ -1,98 +1,113 @@
 <template>
-  <div class="pending-record-container">
-    <el-card shadow="never">
-      <template #header>
-        <div class="card-header">
-          <span>待写病历</span>
-          <el-button type="primary" @click="handleQuery" :loading="loading">刷新</el-button>
-        </div>
-      </template>
-      
-      <!-- 修复 #562: 绑定 loading 状态，避免数据未返回时界面假死 -->
-      <el-table :data="recordList" v-loading="loading" border style="width: 100%" empty-text="暂无待写病历">
-        <el-table-column prop="visitNo" label="就诊号" width="120" />
-        <el-table-column prop="patientName" label="患者姓名" width="120" />
-        <el-table-column prop="gender" label="性别" width="80" />
-        <el-table-column prop="age" label="年龄" width="80" />
-        <el-table-column prop="deptName" label="科室" />
-        <el-table-column prop="visitTime" label="就诊时间" width="160" />
-        <el-table-column label="操作" width="120" fixed="right">
-          <template #default="{ row }">
-            <el-button type="primary" link @click="handleWrite(row)">书写病历</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      
-      <!-- 修复 #562: 启用分页组件，默认 pageSize=20，避免一次性拉取全量数据 -->
+  <div class="pending-records-container">
+    <div class="header-bar">
+      <h2>待写病历</h2>
+      <el-date-picker
+        v-model="queryParams.visitDate"
+        type="date"
+        placeholder="选择就诊日期"
+        @change="fetchRecords"
+      />
+    </div>
+
+    <el-table
+      v-loading="loading"
+      :data="recordList"
+      style="width: 100%"
+      row-key="id"
+      @row-click="handleRowClick"
+    >
+      <el-table-column prop="patientName" label="患者姓名" min-width="120" />
+      <el-table-column prop="visitDate" label="就诊日期" min-width="120" />
+      <el-table-column prop="status" label="状态" min-width="100">
+        <template #default="{ row }">
+          <el-tag type="warning">待书写</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="120" fixed="right">
+        <template #default="{ row }">
+          <el-button type="primary" size="small" @click.stop="handleWrite(row)">书写</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div class="pagination-wrapper">
       <el-pagination
         v-model:current-page="queryParams.pageNum"
         v-model:page-size="queryParams.pageSize"
         :total="total"
         :page-sizes="[10, 20, 50]"
-        layout="total, sizes, prev, pager, next"
-        style="margin-top: 16px; justify-content: flex-end;"
-        @current-change="handleQuery"
-        @size-change="handleSizeChange"
+        layout="total, sizes, prev, pager, next, jumper"
+        @current-change="fetchRecords"
+        @size-change="fetchRecords"
       />
-    </el-card>
+    </div>
   </div>
 </template>
 
 <script setup>
-import { ref, reactive, onMounted } from 'vue'
-import { getPendingMedicalRecords } from '@/api/outpatient/medicalRecord'
-import { useUserStore } from '@/store/modules/user'
+import { ref, onMounted } from 'vue';
+import { useRouter } from 'vue-router';
+import { getPendingMedicalRecords } from '@/api/outpatient/medicalRecord';
+import { useUserStore } from '@/store/modules/user';
 
-const loading = ref(false)
-const recordList = ref([])
-const total = ref(0)
-const userStore = useUserStore()
+const router = useRouter();
+const userStore = useUserStore();
 
-const queryParams = reactive({
+const loading = ref(false);
+const recordList = ref([]);
+const total = ref(0);
+const queryParams = ref({
   pageNum: 1,
   pageSize: 20,
-  doctorId: userStore?.id || null
-})
+  doctorId: userStore.userInfo?.id || null,
+  visitDate: null
+});
 
-const handleQuery = async () => {
-  loading.value = true
+const fetchRecords = async () => {
+  loading.value = true;
   try {
-    // 修复 #562: 携带分页参数请求，后端已优化为轻量DTO查询
-    const res = await getPendingMedicalRecords(queryParams)
-    recordList.value = res.data?.list || []
-    total.value = res.data?.total || 0
+    const res = await getPendingMedicalRecords(queryParams.value);
+    if (res.code === 200) {
+      recordList.value = res.data.list || [];
+      total.value = res.data.total || 0;
+    }
   } catch (error) {
-    console.error('加载待写病历失败:', error)
-    recordList.value = []
-    total.value = 0
+    console.error('加载待写病历失败:', error);
   } finally {
-    loading.value = false
+    loading.value = false;
   }
-}
-
-const handleSizeChange = (size) => {
-  queryParams.pageSize = size
-  queryParams.pageNum = 1
-  handleQuery()
-}
+};
 
 const handleWrite = (row) => {
-  // 路由跳转至病历书写页，传递就诊号
-  console.log('跳转书写病历:', row.visitNo)
-}
+  router.push({ name: 'MedicalRecordEditor', params: { id: row.id } });
+};
 
-onMounted(() => {
-  handleQuery()
-})
+const handleRowClick = (row) => {
+  handleWrite(row);
+};
+
+onMounted(fetchRecords);
 </script>
 
 <style scoped>
-.pending-record-container {
-  padding: 16px;
+.pending-records-container {
+  padding: 20px;
+  background: #fff;
+  border-radius: 8px;
 }
-.card-header {
+.header-bar {
   display: flex;
   justify-content: space-between;
   align-items: center;
+  margin-bottom: 16px;
+}
+.pagination-wrapper {
+  margin-top: 16px;
+  display: flex;
+  justify-content: flex-end;
+}
+.el-table__row {
+  cursor: pointer;
 }
 </style>