xt_pad/src/pages/main/index.vue

<template>

  <div class="mainBox">
    <div>
    <side-bar :active_index="0" :total_read_dot="readNum"></side-bar>
    <div class="mainContent">
      <record-page :un_read_wait_num="unReadWaitNum" :un_read_dialysis_num="unReadDialysisNum"></record-page>
    </div>
    </div>

  </div>
</template>


<script>
  import RecordPage from './RecordPage'
  import SideBar from '@/pages/layout/SideBar'
  import {getDialysisScheduals, getWaitingScheduals} from '@/api/dialysis'
  import {parseTime} from '@/utils/index'

  export default {
    name: 'Main',
    data () {
      return {
        timer:null,
        scheduals: [],
        advice_groups: [],
        unReadWaitNum: 0,
        unReadDialysisNum: 0,
      }
    },
    components: {
      RecordPage,
      SideBar,
    },
    created () {
      this.requestScheduals()
      this.requestDialysisScheduals()

    },
    methods: {

      requestScheduals () {
        var storedata = this.$store.getters.waitscheduals
        var scheduals = storedata.waitscheduals
        if (Object.keys(storedata).length > 0){
              this.scheduals = scheduals
              console.log(this.scheduals)
              let doctorAdvice = []
              for (let i = 0; i < this.scheduals.length; i++) {
                for (let y = 0; y < this.scheduals[i].doctor_advice.length; y++) {
                  if(this.scheduals[i].dialysis_order == null ){
                    if (this.scheduals[i].doctor_advice[y].execution_state == 2) {
                      doctorAdvice.push(this.scheduals[i].doctor_advice[y])
                    }
                  }
                }
              }

              const sorted = this.groupBy(doctorAdvice, function (item) {
                return [item.groupno]
              })
              this.unReadWaitNum = sorted.length

        } else {
          var date = parseTime(Date.parse(new Date()), '{y}-{m}-{d}')
          getWaitingScheduals({date: date}).then(rs => {
            var resp = rs.data
             this.$store.dispatch("SetRequestScheduals",{resp})
            // console.log(resp);
            if (resp.state == 1) {
              var scheduals = resp.data.scheduals
              this.scheduals = scheduals
              console.log(this.scheduals)
              let doctorAdvice = []
              for (let i = 0; i < this.scheduals.length; i++) {
                for (let y = 0; y < this.scheduals[i].doctor_advice.length; y++) {
                  if(this.scheduals[i].dialysis_order == null ){
                    if (this.scheduals[i].doctor_advice[y].execution_state == 2) {
                      doctorAdvice.push(this.scheduals[i].doctor_advice[y])
                    }
                  }
                }
              }

              const sorted = this.groupBy(doctorAdvice, function (item) {
                return [item.groupno]
              })


              this.unReadWaitNum = sorted.length

            } else {
              this.$toast({
                message: resp.msg
              })
            }
          })
        }
      },
      requestDialysisScheduals () {
        var storedata = this.$store.getters.scheduals
        var scheduals = storedata.scheduals
        if (Object.keys(storedata).length > 0){
          let doctorAdvice = []
          for (let index = 0; index < scheduals.length; index++) {
            const schedual = scheduals[index]
            if (schedual.dialysis_order == null) {
              continue
            }
            for (let y = 0; y < schedual.doctor_advice.length; y++) {
              if (schedual.doctor_advice[y].execution_state == 2) {
                doctorAdvice.push(schedual.doctor_advice[y])
              }
            }
          }

          const sorted = this.groupBy(doctorAdvice, function (item) {
            return [item.groupno]
          })

          this.unReadDialysisNum = sorted.length
        }else {
          var date = this.$store.getters.app.dialysis_area.schedule_date
          var type = 0
          getDialysisScheduals({type: type, date: parseTime(date, '{y}-{m}-{d}')})
            .then(rs => {
              var resp = rs.data
              this.$store.dispatch("SetRequestDialysisScheduals",{resp})
              if (resp.state == 1) {
                var scheduals = resp.data.scheduals
                let doctorAdvice = []
                for (let index = 0; index < scheduals.length; index++) {
                  const schedual = scheduals[index]
                  if (schedual.dialysis_order == null) {
                    continue
                  }
                  for (let y = 0; y < schedual.doctor_advice.length; y++) {
                    if (schedual.doctor_advice[y].execution_state == 2) {
                      doctorAdvice.push(schedual.doctor_advice[y])
                    }
                  }
                }

                const sorted = this.groupBy(doctorAdvice, function (item) {
                  return [item.groupno]
                })

                this.unReadDialysisNum = sorted.length

              } else {
                this.$toast({
                  message: resp.msg
                })
              }
            })
            .catch(v => {
            })
          }
      }, groupBy (array, f) {
        const groups = {}
        array.forEach(function (o) {
          const group = JSON.stringify(f(o))
          groups[group] = groups[group] || []
          groups[group].push(o)
        })
        return Object.keys(groups).map(function (group) {
          return groups[group]
        })
      },getData(){
        console.log("111111")
        // this.requestScheduals()
        // this.requestDialysisScheduals()
      }

    },
    computed: {
      readNum: function () {
        return this.unReadWaitNum + this.unReadDialysisNum

      }

    }, mounted(){
      this.timer =   window.setInterval(() => {
        setTimeout(this.getData(), 0)
      }, 30000)


    },beforeDestroy() {
      clearInterval(this.timer);
      this.timer = null;
    },

  }
</script>

<style style="stylesheet/scss" lang="scss" scoped>
  html,
  body {
  height: 100%;
  }
  .mainBox {
  height: 100%;
  font-size:0.3rem;
  .sideColumn {
  .column {
  .head {
  @include display-flex;
  @include align-items-center;
  @include flex-direction;
  @include text-align;
  @include justify-content-center;
  margin: 0.5rem 0 0.5rem 0;
  img {
  width: 100%;
  height: 100%;
  border-radius: 0.5rem;
  width: 0.7rem;
  height: 0.7rem;
  }
  }
  .sidebar {
  @include display-flex;
  @include align-items-center;
  @include flex-direction;
  @include text-align;
  padding: 0;
  li {
  padding: 0 0 0.8rem 0;
  a {
  color: #a8b3ba;
  display: inline-block;
  padding: 0;
  margin: 0;
  p {
  font-size: 0.24rem;
  margin-top: 0.2rem;
  }
  .iconfont {
  font-size: 0.5rem;
  display: inline-block;
  }
  }
  &.active {
  a {
  color: #409eff;
  }
  }
  }
  }
  }
  }
  }
  .mainContent{
  margin: 0 0 0 1.58rem;
  }

</style>