<template>
  <div>
    <div class="Dialog" v-if="visibility">
      <div class="DialogTit">
        <span class="iconfont" @click="closeDialog()"
          >&#xe720; <span class="newBack">返回</span>
        </span>
        <h1 class="name">干体重调整</h1>
        <span class="success" @click="commitDryWeight()">提交</span>
      </div>

      <div class="DialogContent">
        <div class="item">
          <label class="name" for="xll">干体重</label>
          <div class="content">
            <input
              autofocus
              placeholder="请输入干体重"
              type="number"
              id="xll"
              v-model="dry_weight"
            />
          </div>
        </div>

        <div class="item" @click="select_nurse">
          <h2 class="name">医生</h2>
          <div class="content">
            <span class="text" style="width: 100px">{{
              getDoctorName(this.creator)
            }}</span>
            <span class="iconfont">&#xe6f9;</span>
          </div>
        </div>

        <div class="item">
          <h2 class="name">备注</h2>
          <div class="content">
            <input type="text" id="xll" v-model="remark" />
          </div>
        </div>
        <div style="margin: 10px; font-size: 14px;font-weight: bold;color: black"><span>近六次干体重调整记录</span></div>
        <div class="gantizhong" style="margin: ;">
          <el-table
            :data="tableData"
            stripe
            style="width: 95%;text-align:center;margin: auto;">
            <el-table-column prop="" label="时间" width="120" align="center">
               <template slot-scope="scope">
                  {{getTime(scope.row.ctime)}}
               </template>
            </el-table-column>
            <el-table-column prop=""  label="干体重" width="80" align="center">
              <template slot-scope="scope">
                  {{ scope.row.dry_weight }}
               </template>
            </el-table-column>
            <el-table-column prop="" label="医生"  width="70" align="center">
              <template slot-scope="scope">
                  {{getDoctorName(scope.row.creator)}}
               </template>

            </el-table-column>
            <el-table-column prop="" label="备注" align="center">
              <template slot-scope="scope">
                  {{ scope.row.remakes }}
               </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </div>
    <two-menu ref="selector"></two-menu>
    
  </div>
</template>

<script>
import TwoMenu from "../TwoMenu";
import { CreateDryWeight } from "@/api/dialysis";
import { Toast } from 'vant'
import { uParseTime } from '@/utils/tools'
export default {
  name: "dryWeightMenu",
  components: { TwoMenu },
  data() {
    return {
      dry_weight: 0,
      remark: "",
      creator: 0,
      visibility: false,
      tableData:[]
    };
  },
  props: {
    propsForm: {
      type: Object
    },
    dry_weight_list:{
      type:Array
    }
  },
  methods: {
    open() {
      this.creator = this.$store.getters.user.admin.id;
      this.dry_weight = this.propsForm.weight;
      this.remark = this.propsForm.remark
      this.visibility = true;
      this.tableData = this.dry_weight_list
      console.log("表格",this.tableData)
    },
    close() {
      this.visibility = false;
    },
    closeDialog() {
      this.$emit("menu-cancle-two");
    },
    commitDryWeight() {
      let params = {
        id: this.$route.query.patient_id,
        dry_weight: this.dry_weight,
        remark: this.remark,
        doctor_id: this.creator,
        mode: "1",
      };
      CreateDryWeight(params).then(rs => {
        var res = rs.data;
        if (res.state == 1) {
          Toast("提交成功");
          this.$emit("menu-comfirm-two", res.data.weight);
        }else {
          // this.$message.success("提交成功");

          Toast(rs.data.msg)
        }
      });
    
    },
    select_nurse() {
      this.close();
      var _this = this;
      if ((this.$store.getters.user.user.user_type = 2)) {
        this.$refs.selector.showSingleSelect(
          this.propsForm.doctor,
          _this.creator,
          "选择医生",
          "name",
          "id",
          function(select_id) {
            _this.visibility = true;
            _this.creator = select_id;
          },
          function() {
            _this.visibility = true;
          }
        );
      }
    },
    getDoctorName(id) {
      for (let i = 0; i < this.propsForm.doctor.length; i++) {
        if (this.propsForm.doctor[i].id == id) {
          return this.propsForm.doctor[i].name;
        }
      }
    },
    getTime(time) {
      // return uParseTime(time, "{y}-{m}-{d} {h}:{i}:{s}");
      return uParseTime(time, "{y}-{m}-{d}");
    },
  }
};
</script>

<style style="stylesheet/scss" lang="scss" scoped>
.optionsBox {
  background: #fff;
  max-height: 10.6rem;
  min-height: 5rem;
  overflow-y: scroll;
  @media only screen and (max-width: 812px) {
    min-height: 8rem !important;
  }
  ul {
    li {
      height: 1rem;
      line-height: 1rem;
      border-bottom: 1px #e5e5e5 solid;
      padding: 0 0.38rem;
    }
    .tick {
      position: relative;
      &::before {
        content: "";
        display: inline-block;
        border: 2px solid $main-color;
        border-top-width: 0;
        border-right-width: 0;
        width: 0.3rem;
        height: 0.15rem;
        -webkit-transform: rotate(-50deg);
        position: absolute;
        top: 0.38rem;
        right: 0.44rem;
      }
    }
  }
}
.CheckBox {
  background: #fff;
  max-height: 10.6rem;
  min-height: 5rem;
  overflow-y: scroll;
  ul {
    li {
      line-height: 1rem;
    }
  }
}
.newBack {
  font-size: 0.45rem;
}
.gantizhong{

}
</style>
