测试完成

WXL (wul)

2 天以前 d3c60e18b95b50751f8088fa2d23cd8ff7f173bc

 src/views/sfstatistics/percentage/components/DetailDialog.vue

@@ -18,7 +18,9 @@
          @input="handleSearch"
          @clear="handleSearch"
        />
        <span style="margin-left: 10px; color: rgb(35, 81, 233); font-size: 16px">
        <span
          style="margin-left: 10px; color: rgb(35, 81, 233); font-size: 16px"
        >
          共 {{ displayList.length }} 条记录
        </span>
      </div>
@@ -26,12 +28,43 @@
      <div class="examine-jic">
        <div class="jic-value">
          <el-row :gutter="20">
            <div class="data-list" ref="dataList" @scroll="handleScroll" v-loading="loading">
              <el-table :data="currentDisplayList" height="660" style="width: 100%">
                <el-table-column prop="sendname" align="center" label="姓名" width="100" />
                <el-table-column prop="taskName" align="center" width="200" show-overflow-tooltip label="任务名称" />
            <div
              class="data-list"
              ref="dataList"
              @scroll="handleScroll"
              v-loading="loading"
            >
              <el-table
                :data="currentDisplayList"
                height="660"
                style="width: 100%"
              >
                <el-table-column
                  prop="sendname"
                  align="center"
                  label="姓名"
                  width="100"
                />
                <el-table-column
                  prop="telcode"
                  align="center"
                  label="联系电话"
                  width="100"
                />
                <el-table-column
                  prop="taskName"
                  align="center"
                  width="200"
                  show-overflow-tooltip
                  label="任务名称"
                />

                <el-table-column prop="sendstate" align="center" width="200" label="任务状态">
                <el-table-column
                  prop="sendstate"
                  align="center"
                  width="200"
                  label="任务状态"
                >
                  <template slot-scope="scope">
                    <el-tag
                      :type="getStateTagType(scope.row.sendstate)"
@@ -51,8 +84,14 @@
                  :show-overflow-tooltip="true"
                >
                  <template slot-scope="scope">
                    <span v-for="(item, index) in scope.row.preachform" :key="index">
                      {{ item }}{{ index < scope.row.preachform.length - 1 ? '、' : '' }}
                    <span
                      v-for="(item, index) in scope.row.preachform"
                      :key="index"
                    >
                      {{ item
                      }}{{
                        index < scope.row.preachform.length - 1 ? "、" : ""
                      }}
                    </span>
                  </template>
                </el-table-column>
@@ -71,35 +110,98 @@
                  width="200"
                  show-overflow-tooltip
                />
                <el-table-column label="出院日期" width="200" align="center" key="endtime" prop="endtime">
                <el-table-column
                  label="出院日期"
                  width="200"
                  align="center"
                  key="endtime"
                  prop="endtime"
                >
                  <template slot-scope="scope">
                    <span>{{ formatTime(scope.row.endtime) }}</span>
                  </template>
                </el-table-column>

                <el-table-column label="责任护士" width="120" align="center" key="nurseName" prop="nurseName" />
                <el-table-column label="主治医生" width="120" align="center" key="drname" prop="drname" />
                <el-table-column
                  label="责任护士"
                  width="120"
                  align="center"
                  key="nurseName"
                  prop="nurseName"
                />
                <el-table-column
                  label="主治医生"
                  width="120"
                  align="center"
                  key="drname"
                  prop="drname"
                />

                <el-table-column label="结果状态" align="center" key="excep" prop="excep" width="120">
                <el-table-column
                  label="结果状态"
                  align="center"
                  key="excep"
                  prop="excep"
                  width="120"
                >
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.sys_yujing" :value="scope.row.excep" />
                    <dict-tag
                      :options="dict.type.sys_yujing"
                      :value="scope.row.excep"
                    />
                  </template>
                </el-table-column>

                <el-table-column label="处理意见" align="center" key="suggest" prop="suggest" width="120">
                <el-table-column
                  label="处理意见"
                  align="center"
                  key="suggest"
                  prop="suggest"
                  width="120"
                >
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.sys_suggest" :value="scope.row.suggest" />
                    <dict-tag
                      :options="dict.type.sys_suggest"
                      :value="scope.row.suggest"
                    />
                  </template>
                </el-table-column>

                <el-table-column prop="templatename" align="center" label="服务模板" width="200" show-overflow-tooltip />
                <el-table-column prop="remark" align="center" label="服务记录" width="200" show-overflow-tooltip />
                <el-table-column
                  prop="templatename"
                  align="center"
                  label="服务模板"
                  width="200"
                  show-overflow-tooltip
                />
                <el-table-column
                  prop="remark"
                  align="center"
                  label="服务记录"
                  width="200"
                  show-overflow-tooltip
                />

                <el-table-column prop="bankcardno" align="center" label="呼叫状态" width="210" />
                <el-table-column
                  prop="bankcardno"
                  align="center"
                  label="呼叫状态"
                  width="210"
                />

                <el-table-column label="操作" fixed="right" align="center" width="200" class-name="small-padding fixed-width">
                <el-table-column
                  label="操作"
                  fixed="right"
                  align="center"
                  width="200"
                  class-name="small-padding fixed-width"
                >
                  <template slot-scope="scope">
                    <el-button size="medium" type="text" @click="handleDetailsGo(scope.row)">
                    <el-button
                      size="medium"
                      type="text"
                      @click="handleDetailsGo(scope.row)"
                    >
                      <span class="button-zx">
                        <i class="el-icon-s-order"></i>查看
                      </span>
@@ -117,175 +219,181 @@

<script>
export default {
  name: 'DetailDialog',
  dicts: ['sys_yujing', 'sys_suggest'],
  name: "DetailDialog",
  dicts: ["sys_yujing", "sys_suggest"],
  props: {
    visible: {
      type: Boolean,
      default: false
      default: false,
    },
    title: {
      type: String,
      default: ''
      default: "",
    },
    data: {
      type: Array,
      default: () => []
      default: () => [],
    },
    searchName: {
      type: String,
      default: ''
      default: "",
    },
    loading: {
      type: Boolean,
      default: false
    }
      default: false,
    },
  },
  data() {
    return {
      localSearchName: '',
      localSearchName: "",
      displayList: [],
      currentDisplayList: [],
      loadIndex: 0,
      pageSize: 100,
      isLoading: false
    }
      isLoading: false,
    };
  },
  watch: {
    data: {
      immediate: true,
      handler(newData) {
        this.initializeData(newData)
      }
        this.initializeData(newData);
      },
    },
    searchName(newVal) {
      this.localSearchName = newVal
      this.handleSearch()
    }
      this.localSearchName = newVal;
      this.handleSearch();
    },
  },
  mounted() {
    if (this.data && this.data.length > 0) {
      this.initializeData(this.data)
      this.initializeData(this.data);
    }
  },
  methods: {
    initializeData(data) {
      this.displayList = [...data]
      this.formatPreachformData()
      this.loadIndex = 0
      this.currentDisplayList = []
      this.displayList = [...data];
      this.formatPreachformData();
      this.loadIndex = 0;
      this.currentDisplayList = [];
      this.$nextTick(() => {
        this.loadMoreData()
      })
        this.loadMoreData();
      });
    },

    formatPreachformData() {
      this.displayList.forEach((item) => {
        if (item.preachform) {
          if (item.endtime) {
            item.preachformson = item.preachform
            const idArray = item.preachform.split(',')
            item.preachformson = item.preachform;
            const idArray = item.preachform.split(",");

            item.preachform = idArray.map((value) => {
              const checkboxlist = this.$store.getters.checkboxlist
              const foundItem = checkboxlist.find((item) => item.value == value)
              return foundItem ? foundItem.label : null
            }).filter(label => label !== null)
            item.preachform = idArray
              .map((value) => {
                const checkboxlist = this.$store.getters.checkboxlist;
                const foundItem = checkboxlist.find(
                  (item) => item.value == value
                );
                return foundItem ? foundItem.label : null;
              })
              .filter((label) => label !== null);
          }
        }
      })
      });
    },

    handleSearch() {
      if (!this.localSearchName.trim()) {
        this.displayList = [...this.data]
        this.formatPreachformData()
        this.displayList = [...this.data];
        this.formatPreachformData();
      } else {
        const keyword = this.localSearchName.toLowerCase()
        const keyword = this.localSearchName.toLowerCase();
        this.displayList = this.data.filter((item) => {
          return item.sendname && item.sendname.toLowerCase().includes(keyword)
        })
        this.formatPreachformData()
          return item.sendname && item.sendname.toLowerCase().includes(keyword);
        });
        this.formatPreachformData();
      }

      this.loadIndex = 0
      this.currentDisplayList = []
      this.loadIndex = 0;
      this.currentDisplayList = [];
      this.$nextTick(() => {
        this.loadMoreData()
      })
        this.loadMoreData();
      });

      this.$emit('search', this.localSearchName)
      this.$emit("search", this.localSearchName);
    },

    loadMoreData() {
      if (this.isLoading || this.loadIndex >= this.displayList.length) return
      if (this.isLoading || this.loadIndex >= this.displayList.length) return;

      this.isLoading = true
      this.isLoading = true;

      setTimeout(() => {
        const nextChunk = this.displayList.slice(
          this.loadIndex,
          this.loadIndex + this.pageSize
        )
        this.currentDisplayList = this.currentDisplayList.concat(nextChunk)
        this.loadIndex += this.pageSize
        this.isLoading = false
      }, 200)
        );
        this.currentDisplayList = this.currentDisplayList.concat(nextChunk);
        this.loadIndex += this.pageSize;
        this.isLoading = false;
      }, 200);
    },

    handleScroll(event) {
      const scrollContainer = event.target
      const scrollContainer = event.target;
      const isAtBottom =
        scrollContainer.scrollTop + scrollContainer.clientHeight >=
        scrollContainer.scrollHeight - 10
        scrollContainer.scrollHeight - 10;

      if (
        isAtBottom &&
        !this.isLoading &&
        this.loadIndex < this.displayList.length
      ) {
        this.loadMoreData()
        this.loadMoreData();
      }
    },

    getStateTagType(state) {
      const stateMap = {
        1: 'primary',  // 表单已领取
        2: 'primary',  // 待随访
        3: 'success',  // 表单已发送
        4: 'info',     // 不执行
        5: 'danger',   // 发送失败
        6: 'success'   // 已完成
      }
      return stateMap[state] || 'info'
        1: "primary", // 表单已领取
        2: "primary", // 待随访
        3: "success", // 表单已发送
        4: "info", // 不执行
        5: "danger", // 发送失败
        6: "success", // 已完成
        7: "danger", // 超时
      };
      return stateMap[state] || "info";
    },

    getStateText(state) {
      const stateTextMap = {
        1: '表单已领取',
        2: '待随访',
        3: '表单已发送',
        4: '不执行',
        5: '发送失败',
        6: '已完成'
      }
      return stateTextMap[state] || '未知状态'
        1: "表单已领取",
        2: "待随访",
        3: "表单已发送",
        4: "不执行",
        5: "发送失败",
        6: "已完成",
        7: "超时",
      };
      return stateTextMap[state] || "未知状态";
    },

    formatTime(time) {
      if (!time) return ''
      return this.parseTime(time)
      if (!time) return "";
      return this.parseTime(time);
    },

    handleDetailsGo(row) {
      this.$emit('details-go', row)
      this.$emit("details-go", row);
    },

    handleClose() {
      this.$emit('close')
    }
  }
}
      this.$emit("close");
    },
  },
};
</script>

<style lang="scss" scoped>