Pad_New/src/pages/doctorAdvice/components/Scheduling.vue

<template>
  <div class="scheduling">
    <div>
      <div class="toolBox">
        <div class="toolOne" @click="typeShow = true">
          <div style="display: flex;align-items: center;">
            {{ type }}
            <van-icon name="arrow-down" />
          </div>
        </div>
        <div class="toolOne" @click="startShow = true">
          <div style="display: flex;align-items: center;">
            {{ startTime }}
            <van-icon name="arrow-down" />
          </div>
        </div>
        <div class="toolOne" @click="endShow = true">
          <div style="display: flex;align-items: center;">
            {{ endTime }}
            <van-icon name="arrow-down" />
          </div>
        </div>
      </div>
      <div class="adviceBox" v-if="scheduLing.length > 0">
        <van-list
          v-model="loading"
          :finished="finished"
          finished-text="没有更多了"
          @load="onLoad"
          :immediate-check="immediateCheck"
        >
        <div class="adviceMain">
          <div class="adviceOne" v-for="(item,index) in scheduLing" :key="index">
            <div class="adviceTitle">
              <p>{{getTime(item.schedule_date)}}</p>
              <van-icon
                class="ellipsis"
                name="ellipsis"
                @click="toDelete(item.id,index)"
              />
            </div>
            <div class="orderContent">
              <p>班次：
                <span>{{item.schedule_type}}</span>
              </p>
              <p>分区：{{item.name}}</p>
              <p>机号：{{item.number}}</p>
              <p>治疗模式：{{item.mode_id}}</p>
            </div>
            <div class="all" @click="toEditSchduling(item.id)">全部</div>
          </div>
        </div>
        </van-list>
      </div>
      <div class="noimgBox" v-else>
        <img src="../../../assets/images/none.png" alt />
      </div>
    </div>
    <!-- <div class="add">
      <div style="display: flex;align-items: center;">
        <van-icon class="addIcon" name="add" />新增
      </div>
    </div> -->

    <!-- 弹出层 -->
    <div>
      <van-popup
        v-model="typeShow"
        position="bottom"
        :style="{ height: '40%' }"
      >
        <van-picker
          show-toolbar
          :columns="columns"
          @cancel="onCancel"
          @confirm="onConfirm"
        />
      </van-popup>
      <van-popup
        v-model="startShow"
        position="bottom"
        :style="{ height: '40%' }"
      >
        <van-datetime-picker
          v-model="currentDate"
          type="date"
          :min-date="minDate"
          :max-date="maxDate"
          @confirm="getstartTime"
          @cancel="startShow = false"
        />
      </van-popup>
      <van-popup v-model="endShow" position="bottom" :style="{ height: '40%' }">
        <van-datetime-picker
          v-model="currentDate"
          type="date"
          :min-date="minDate"
          :max-date="maxDate"
          @confirm="getstartTime2"
          @cancel="endShow = false"
        />
      </van-popup>
      <van-action-sheet
        v-model="newShow"
        :actions="actions"
        cancel-text="取消"
        @select="onCancelOne"
      />
      </div>
    </div>
</template>

<script>
import {
  getPatientDetail,
  getScheduling,
  DeleteScheduling
} from "@/api/patient/patient";
import { uParseTime } from "@/utils/tools";
import Vue from "vue";
import { Dialog } from "vant";
const moment = require("moment");
export default {
  props: {
    active: Number,
    schedulingId: String
  },
  data() {
    return {
      newShow: false,
      typeShow: false,
      startShow: false,
      endShow: false,
      type: "全部",
      types: 0,
      columns: [
        "HD",
        "HDF",
        "HD+HP",
        "HP",
        "HF",
        "SCUF",
        "IUF",
        "HFHD",
        "HFHD+HP",
        "PHF",
        "HFR",
        "HDF+HP",
        "CRRT",
        "腹水回输"
      ],
      startTime: "请选择",
      endTime: "请选择",
      minDate: new Date(1970, 0, 1),
      maxDate: new Date(2025, 10, 1),
      currentDate: new Date(),
      actions: [{ name: "删除" }],
      showOne: true,
      showTwo: false,
      limit: 10,
      page: 1,
      total: 0,
      loading: false,
      finished: false,
      list: [],
      patient_id: "",
      scheduLing: [],
      list: [],
      id: 0,
      index: 0,
      immediateCheck: false,
      flag: true
    };
  },
  methods: {
    onCancel() {
      this.typeShow = false;
    },
    onConfirm(value) {
      this.page = 1;
      if (value === "全部") {
        this.types = 0;
      }
      if (value === "HD") {
        this.types = 1;
      }
      if (value === "HDF") {
        this.types = 2;
      }
      if (value === "HD+HP") {
        this.types = 3;
      }
      if (value === "HP") {
        this.types = 4;
      }
      if (value === "HF") {
        this.types = 5;
      }
      if (value === "SCUF") {
        this.types = 6;
      }
      if (value === "IUF") {
        this.types = 7;
      }
      if (value === "HFHD") {
        this.types = 8;
      }
      if (value === "HFHD+HP") {
        this.types = 9;
      }
      if (value === "PHF") {
        this.types = 10;
      }
      if (value === "HFR") {
        this.types = 11;
      }

      if (value === "HDF+HP") {
        this.types = 12;
      }
      if (value === "CRRT") {
        this.types = 13;
      }
      if (value === "腹水回输") {
        this.types = 14;
      }
      this.type = value;
      this.typeShow = false;
      this.scheduLing = [];
      this.getScheduling(
        this.patient_id,
        this.limit,
        this.page,
        this.startTime,
        this.endTime,
        this.types
      );
    },
    getstartTime(value) {
      this.page = 1;
      let year = value.getFullYear();
      let month = value.getMonth() + 1;
      let day = value.getDate();
      if (month >= 1 && month <= 9) {
        month = `0${month}`;
      }
      if (day >= 1 && day <= 9) {
        day = `0${day}`;
      }

      this.startTime = `${year}-${month}-${day}`;
      this.scheduLing = [];
      this.getScheduling(
        this.patient_id,
        this.limit,
        this.page,
        this.startTime,
        this.endTime,
        this.types
      );
      this.startShow = false;
    },
    getstartTime2(value) {
      this.page = 1;
      let year = value.getFullYear();
      let month = value.getMonth() + 1;
      let day = value.getDate();
      if (month >= 1 && month <= 9) {
        month = `0${month}`;
      }
      if (day >= 1 && day <= 9) {
        day = `0${day}`;
      }

      this.endTime = `${year}-${month}-${day}`;
      this.scheduLing = [];
      this.getScheduling(
        this.patient_id,
        this.limit,
        this.page,
        this.startTime,
        this.endTime,
        this.types
      );
      this.endShow = false;
    },
    getPatientDetail(patientid) {
      getPatientDetail(patientid).then(response => {
        if (response.data.state === 1) {
          var patientDetail = response.data.data.patientDetail;
          if (patientDetail.blood_patients == 0) {
            this.showOne = false;
            this.showTwo = true;
          }
          if (patientDetail.blood_patients == 1) {
            this.showOne = true;
            this.showTwo = false;
          }
          // console.log('病人详情', patientDetail)
          this.patientName = patientDetail.name;
        }
      });
    },
    getScheduling(id) {
      getScheduling(
        id,
        this.limit,
        this.page,
        this.startTime,
        this.endTime,
        this.types
      ).then(response => {
        if (response.data.state === 1) {
          var scheduling = response.data.data.scheduling;
          for (let i = 0; i < scheduling.length; i++) {
            if (scheduling[i].schedule_type === 1) {
              scheduling[i].schedule_type = "上午";
            }
            if (scheduling[i].schedule_type === 2) {
              scheduling[i].schedule_type = "中午";
            }
            if (scheduling[i].schedule_type === 3) {
              scheduling[i].schedule_type = "下午";
            }

            if (scheduling[i].mode_id === 1) {
              scheduling[i].mode_id = "HD";
            }
            if (scheduling[i].mode_id === 2) {
              scheduling[i].mode_id = "HDF";
            }
            if (scheduling[i].mode_id === 3) {
              scheduling[i].mode_id = "HD+HP";
            }
            if (scheduling[i].mode_id === 4) {
              scheduling[i].mode_id = "HP";
            }
            if (scheduling[i].mode_id === 5) {
              scheduling[i].mode_id = "HF";
            }
            if (scheduling[i].mode_id === 6) {
              scheduling[i].mode_id = "SCUF";
            }
            if (scheduling[i].mode_id === 7) {
              scheduling[i].mode_id = "IUF";
            }
            if (scheduling[i].mode_id === 8) {
              scheduling[i].mode_id = "HFHD";
            }
            if (scheduling[i].mode_id === 9) {
              scheduling[i].mode_id = "HFHD+HP";
            }
            if (scheduling[i].mode_id === 10) {
              scheduling[i].mode_id = "PHF";
            }
            if (scheduling[i].mode_id === 11) {
              scheduling[i].mode_id = "HFR";
            }
            if (scheduling[i].mode_id === 12) {
              scheduling[i].mode_id = "HDF+HP";
            }
            if (scheduling[i].mode_id === 13) {
              scheduling[i].mode_id = "CRRT";
            }
            if (scheduling[i].mode_id === 14) {
              scheduling[i].mode_id = "腹水回输";
            }
          }
          let arr = this.scheduLing;
          arr.push(...scheduling);
          // console.log('班次', scheduling)
          this.scheduLing = arr;
          var total = response.data.data.total;
          // console.log('total', total)
          this.total = total;
          this.loading = false;
          // console.log('1823792742736487362847623876执行这里')
        }
      });
    },
    getScheduling1(id) {
      getScheduling(
        id,
        this.limit,
        this.page,
        this.startTime,
        this.endTime,
        this.types
      ).then(response => {
        if (response.data.state === 1) {
          var scheduling = response.data.data.scheduling;
          for (let i = 0; i < scheduling.length; i++) {
            if (scheduling[i].schedule_type === 1) {
              scheduling[i].schedule_type = "上午";
            }
            if (scheduling[i].schedule_type === 2) {
              scheduling[i].schedule_type = "中午";
            }
            if (scheduling[i].schedule_type === 3) {
              scheduling[i].schedule_type = "下午";
            }

            if (scheduling[i].mode_id === 1) {
              scheduling[i].mode_id = "HD";
            }
            if (scheduling[i].mode_id === 2) {
              scheduling[i].mode_id = "HDF";
            }
            if (scheduling[i].mode_id === 3) {
              scheduling[i].mode_id = "HD+HP";
            }
            if (scheduling[i].mode_id === 4) {
              scheduling[i].mode_id = "HP";
            }
            if (scheduling[i].mode_id === 5) {
              scheduling[i].mode_id = "HF";
            }
            if (scheduling[i].mode_id === 6) {
              scheduling[i].mode_id = "SCUF";
            }
            if (scheduling[i].mode_id === 7) {
              scheduling[i].mode_id = "IUF";
            }
            if (scheduling[i].mode_id === 8) {
              scheduling[i].mode_id = "HFHD";
            }
            if (scheduling[i].mode_id === 9) {
              scheduling[i].mode_id = "HFHD+HP";
            }
            if (scheduling[i].mode_id === 10) {
              scheduling[i].mode_id = "PHF";
            }
            if (scheduling[i].mode_id === 11) {
              scheduling[i].mode_id = "HFR";
            }
            if (scheduling[i].mode_id === 12) {
              scheduling[i].mode_id = "HDF+HP";
            }
            if (scheduling[i].mode_id === 13) {
              scheduling[i].mode_id = "CRRT";
            }
            if (scheduling[i].mode_id === 14) {
              scheduling[i].mode_id = "腹水回输";
            }
          }

          this.scheduLing = scheduling;
          var total = response.data.data.total;
          this.total = total;
          this.loading = false;
        }
      });
    },
    getTime(time) {
      // return uParseTime(time, "{y}-{m}-{d} {h}:{i}:{s}");
      return uParseTime(time, "{y}-{m}-{d}");
    },
    onLoad() {
      setTimeout(() => {
        this.page++;
        // console.log(this.page)
        if (this.page <= Math.ceil(this.total / 10)) {
          this.getScheduling(
            this.patient_id,
            this.startTime,
            this.endTimes,
            this.limit,
            this.page,
            this.types
          );
        } else {
          this.loading = false;
          this.finished = true;
        }
      }, 3000);
    },
    toEditSchduling(id) {
      var patientid = this.$route.query.patientid;
      this.$router.push(
        "/editScheduling?id=" +
          id +
          "&patientid=" +
          patientid +
          "&active=" +
          this.active
      );
    },
    toDelete(id, index) {
      this.id = id;
      this.index = index;
      this.newShow = true;
    },
    onCancelOne(value) {
      if (value.name == "删除") {
        this.DeleteScheduling(this.id, this.index);
      }
    },
    DeleteScheduling(id, index) {
      Dialog.confirm({
        title: "删除提示!",
        message: "确认删除该条信息吗?,删除后将无法恢复!"
      }).then(() => {
        DeleteScheduling(id).then(response => {
          if (response.data.state === 1) {
            var msg = response.data.data.msg;
            console.log("msg", msg);
            this.scheduLing.splice(index, 1);
            this.newShow = false;
          }
        });
      });
    }
  },
  created() {
    var patientid = this.$route.query.patientid;
    this.getPatientDetail(patientid);
    this.getScheduling(patientid);
    this.patient_id = patientid;
  }
};
</script>

<style lang="scss" scoped>
.scheduling {
  height: 100%;
  // overflow-y: auto;
  .toolBox {
    display: flex;
    height: 3.125rem;
    justify-content: space-around;
    align-items: center;
    .toolOne {
      width: 6.25rem;
      height: 1.875rem;
      background: rgba(246, 246, 246, 1);
      border-radius: 5px;
      text-align: center;
      font-size: 0.8125rem;
      color: #8d8d8d;
      display: flex;
      align-items: center;
      justify-content: space-around;
    }
  }
  .adviceBox {
    padding: 0 1.125rem;
    margin-bottom: 3.125rem;
  }
  .adviceMain{
    >div:last-child{
      border: none;
    }
  }
  .adviceOne {
    // box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 0.625rem;
  }
  .adviceTitle {
    padding-top: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    p {
      color: #000000;
      font-weight: bold;
      font-size: 0.9375rem;
    }
    .ellipsis {
      font-size: 1.25rem;
      color: #cccccc;
    }
  }
  .orderContent {
    font-size: 0.875rem;
    color: rgba(49, 50, 52, 1);
    margin-top: 0.625rem;
    display: flex;
    flex-wrap: wrap;
    p {
      line-height: 1.5rem;
      width: 50%;
    }
  }
  .doctorBox {
    font-size: 0.75rem;
    color: rgba(152, 152, 152, 1);
    line-height: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.625rem;
  }
  .all {
    font-size: 0.8125rem;
    color: #5b98ff;
    margin-top: 0.625rem;
  }
  .noimgBox {
    margin-top: 40%;
    img {
      width: 9.375rem;
      height: 9.375rem;
      margin: 0 auto;
      display: block;
    }
  }
  .add {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2.75rem;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: 0.9375rem;
    color: #979798;
    .addIcon {
      color: #5b98ff;
      font-size: 1.25rem;
      margin-right: 0.25rem;
    }
  }
}
::-webkit-scrollbar {
  width: 0;
}
</style>