jazz
2024-01-09 f6ea728ea50706b1dfa75bc0d266fb6b5f13ef7f
src/components/xio_room_guest_box/index.vue
New file
@@ -0,0 +1,142 @@
<template>
  <div class="guest_box">
    <div class="guest_title flex flex-center">等待诊疗</div>
    <div class="guest_block flex-1">
      <div v-if="assignTreatListViewCom && assignTreatListViewCom.length" class="guest_list">
        <div v-for="(item, index) in assignTreatListViewCom" :key="index" class="guest_list__row flex flex-ver" @click="selectCustomer(item)">
          <div class="guest_list__td">
            <div class="tx flex flex-ver">
              <div class="flex-1 flex-1-w1 ell">{{ item.userName }}</div>
            </div>
            <div class="tx" style="font-size: 14px;line-height: 20px;">{{ item.ciq || '' }}</div>
          </div>
          <div class="guest_list__td flex flex-center">
            <span class="tx">{{ item.startTime?item.startTime+'开始':'' }}</span>
          </div>
          <div class="guest_list__td flex flex-center">
            <span class="tx flex-1 flex-1-w1 ell">{{ item.aDoctorName?item.aDoctorName+'(医生)、':'' }}{{ item.aNurseName?item.aNurseName+'(护士)':'' }}</span>
          </div>
          <div class="guest_list__td flex flex-center">
            <div v-if="!item.act" class="tx" style="text-decoration: underline;color: #227beb;">加入</div>
            <!-- <div class="icon">
                    <img class="img" src="static/imgs/choose.png">
                  </div> -->
          </div>
        </div>
      </div>
      <div v-if="!assignTreatListViewCom || !assignTreatListViewCom.length" class="guest_list">
        <div class="guest_list__row flex flex-center rowtip">暂无数据</div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'XioRoomGuestBox',
  props: {
    assignTreatListViewCom: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  data() {
    return {
      isShow: false
    }
  },
  methods: {
    noop() {
      return
    },
    // 确认
    selectCustomer(item) {
      this.$emit('selectCustomer', item)
    },
    // 显示弹窗
    showDialog() {
      this.isShow = true
    },
    // 关闭弹窗
    hideDialog() {
      this.isShow = false
      this.$emit('confirm', { })
    }
  }
}
</script>
<style scoped>
.guest_title {
  height: 60px;
  line-height: 28px;
  border-radius: 10px 10px 0px 0px;
  background-color: rgba(255,255,255,1);
  color: rgba(34,123,235,1);
  font-size: 20px;
  text-align: center;
  font-family: Roboto;
  font-weight: bold;
}
.guest_block {
  background-color: #fff;
  overflow: auto;
}
.guest_list {
  background-color: #fff;
  padding-bottom: 23px;
}
.guest_list__row {
  min-height: 75px;
  background-color: rgba(34,123,235,0.1);
}
.guest_list__row:nth-child(2n) {
  background-color: #fff;
}
.guest_list__row.rowtip {
  background-color: #fff;
  line-height: 30px;
  color: rgba(0,0,0,.5);
  font-size: 22px;
}
.guest_list__td {}
.guest_list__td .tx {
  line-height: 30px;
  color: rgba(16,16,16,1);
  font-size: 22px;
  text-align: center;
  font-family: PingFangSC-regular;
  box-sizing: border-box;
  padding: 0 5px;
}
.guest_list__td .icon {
  width: 20px;
  height: 20px;
  display: block;
}
.guest_list__td .icon .img {
  width: 100%;
  height: 100%;
}
.guest_list__td:nth-child(1) {
  width: 19.54%;
}
.guest_list__td:nth-child(2) {
  width: 21.86%;
}
.guest_list__td:nth-child(3) {
  width: 46.06%;
}
.guest_list__td:nth-child(4) {
  width: 12.54%;
}
.guest_box {
  margin-top: 65px;
  width: 100%;
  height: 345px;
  background-color: #fff;
  overflow: hidden;
}
</style>