~yxh/smartor-web.git

<template>
  <el-dialog
    :title="title"
    :visible.sync="dialogVisible"
    width="80%"
    :close-on-click-modal="false"
    append-to-body
    @close="handleClose"
  >
    <div class="topic-patient-dialog">
      <div class="query-bar">
        <span class="label">患者姓名查询:</span>
        <el-input
          v-model="searchName"
          placeholder="请输入患者姓名进行筛选"
          clearable
          style="width: 300px"
          @input="handleSearch"
          @clear="handleSearch"
        />
        <span class="count">共 {{ filteredList.length }} 条记录</span>
      </div>
 
      <el-table
        v-loading="loading"
        :data="filteredList"
        style="width: 100%"
        :border="true"
        max-height="560"
      >
        <el-table-column
          prop="sendname"
          label="姓名"
          align="center"
          width="100"
        />
        <el-table-column
          prop="phone"
          label="联系电话"
          align="center"
          width="130"
        />
        <el-table-column
          prop="taskName"
          label="任务名称"
          align="center"
          width="200"
          show-overflow-tooltip
        />
        <el-table-column
          prop="sendstate"
          label="任务状态"
          align="center"
          width="110"
        >
          <template slot-scope="{ row }">
            <el-tag :type="getStateTagType(row.sendstate)" size="small">
              {{ getStateText(row.sendstate) }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column
          prop="visitTime"
          label="应随访时间"
          align="center"
          width="170"
          show-overflow-tooltip
        />
        <el-table-column
          prop="finishtime"
          label="随访完成时间"
          align="center"
          width="170"
          show-overflow-tooltip
        />
        <el-table-column
          prop="endtime"
          label="出院日期"
          align="center"
          width="120"
        >
          <template slot-scope="{ row }">
            <span>{{ formatTime(row.endtime) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="nurseName"
          label="责任护士"
          align="center"
          width="110"
        />
        <el-table-column
          prop="drname"
          label="主治医生"
          align="center"
          width="110"
        />
        <el-table-column
          prop="excep"
          label="结果状态"
          align="center"
          width="110"
        >
          <template slot-scope="{ row }">
            <dict-tag :options="dict.type.sys_yujing" :value="row.excep" />
          </template>
        </el-table-column>
        <el-table-column
          prop="suggest"
          label="处理意见"
          align="center"
          width="110"
        >
          <template slot-scope="{ row }">
            <dict-tag :options="dict.type.sys_suggest" :value="row.suggest" />
          </template>
        </el-table-column>
        <el-table-column
          prop="templatename"
          label="服务模板"
          align="center"
          width="160"
          show-overflow-tooltip
        />
        <el-table-column
          prop="remark"
          label="服务记录"
          align="center"
          width="160"
          show-overflow-tooltip
        />
        <el-table-column
          label="操作"
          fixed="right"
          align="center"
          width="90"
        >
          <template slot-scope="{ row }">
            <el-button type="text" size="small" @click="handleViewDetail(row)">
              <i class="el-icon-view"></i> 查看
            </el-button>
          </template>
        </el-table-column>
      </el-table>
 
      <div v-if="hasMore" class="load-more">
        <el-button type="text" :loading="loading" @click="loadMore">
          加载更多
        </el-button>
      </div>
    </div>
  </el-dialog>
</template>
 
<script>
import { getSfStatisticsCountDetailsHyperLink } from "@/api/system/user";
 
export default {
  name: "TopicPatientListDialog",
  dicts: ["sys_yujing", "sys_suggest"],
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: "患者服务列表",
    },
    // 下钻请求参数（不含分页），由父组件构建
    drillParams: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {
      pageSize: 200,
      offset: 0,
      hasMore: false,
      loading: false,
      allList: [],
      searchName: "",
    };
  },
  computed: {
    dialogVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:visible", val);
      },
    },
    filteredList() {
      const keyword = this.searchName.trim();
      if (!keyword) return this.allList;
      return this.allList.filter(
        (item) => item.sendname && item.sendname.indexOf(keyword) !== -1
      );
    },
  },
  watch: {
    visible(newVal) {
      if (newVal) {
        this.resetAndLoad();
      }
    },
  },
  methods: {
    resetAndLoad() {
      this.offset = 0;
      this.allList = [];
      this.searchName = "";
      this.hasMore = false;
      this.fetchPage(false);
    },
    async fetchPage(isLoadMore) {
      this.loading = true;
      try {
        const params = {
          ...this.drillParams,
          pageNum: this.offset,
          pageSize: this.pageSize,
        };
        const response = await getSfStatisticsCountDetailsHyperLink(params);
        const batch = response.data || [];
        this.allList = isLoadMore ? this.allList.concat(batch) : batch;
        this.offset += batch.length;
        this.hasMore = batch.length >= this.pageSize;
      } catch (error) {
        console.error("获取患者服务列表失败:", error);
        this.$message.error("获取患者服务列表失败");
      } finally {
        this.loading = false;
      }
    },
    loadMore() {
      this.fetchPage(true);
    },
    handleSearch() {
      // 姓名筛选为前端本地过滤，无需重新请求
    },
    getStateTagType(state) {
      const map = {
        1: "primary",
        2: "primary",
        3: "success",
        4: "info",
        5: "danger",
        6: "success",
        7: "danger",
      };
      return map[state] || "info";
    },
    getStateText(state) {
      const map = {
        1: "表单已领取",
        2: "待随访",
        3: "表单已发送",
        4: "不执行",
        5: "发送失败",
        6: "已完成",
        7: "超时",
      };
      return map[state] || "未知状态";
    },
    formatTime(time) {
      if (!time) return "-";
      return time;
    },
    handleViewDetail(row) {
      this.$emit("update:visible", false);
 
      let type = "";
      if (row.preachform && row.preachform.includes("3")) {
        type = 1;
      }
      setTimeout(() => {
        this.$router.push({
          path: "/followvisit/record/detailpage/",
          query: {
            taskid: row.taskid,
            patid: row.patid,
            id: row.id,
            Voicetype: type,
          },
        });
      }, 300);
    },
    handleClose() {
      this.$emit("close");
    },
  },
};
</script>
 
<style lang="scss" scoped>
.topic-patient-dialog {
  .query-bar {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
 
    .label {
      margin-right: 10px;
      font-weight: bold;
    }
 
    .count {
      margin-left: 16px;
      color: rgb(35, 81, 233);
      font-size: 15px;
    }
  }
 
  .load-more {
    text-align: center;
    padding-top: 12px;
  }
}
</style>