<template>
  <div class="home">
	  <nav-bar/>
    <!--van-cell
      v-for="(item,i) in list"
      :key="i"
      :title="item.DepartName"
      is-link
      @click="handleGuke(item)"
    /-->
    <div class="ksbox">
    <van-tabs class="order_tab" @click="tabClick" line-width="0px" color="#fff">
      <van-tab v-for="item in ksCate" :key="item.id" >
        <template #title>
          {{ item.name }}
        </template>

          <ul>
            <li v-for="li in ksList" :key="li.id">
              <van-cell
                :title="li.name"
                is-link
                @click="handleGuke(li)"
              />
            </li>
          </ul>
      </van-tab>
    </van-tabs>
    </div>
  </div>
</template>

<script>
import {
  apiGetKsList,
  apiGetAppointDeptMark,
  apiGetRegistDeptMark,
  apiGetjksfl, apiGetksLsist

} from "@/request/api.js";
export default {
  data() {
    return {
      title: "",
      list: [],
      yuyue: {
        t: "",//时间
        k: "",//科室编号
        e: "",//科室名称
        z: 1,//类型-1今日/2预约
      },
              // 科室分类
      ksCate: [],
      paramsData: {
        type: "",
        page: 1,
        pagesize: 10,
        name: "",
      },
      //   科室列表
      ksList: [],
    };
  },
  mounted() {

	  /*let that = this;
    var aData = new Date();
    let value =
      aData.getFullYear() +
      "-" +
      ((aData.getMonth() + 1)<10?"0"+(aData.getMonth() + 1):(aData.getMonth() + 1) )+
      "-" +
      (aData.getDate()<10?"0"+aData.getDate():aData.getDate());
    that.yuyue.t = value;
    
    var ksxx="<response><returnresult><returncode>1</returncode><errormsg>查询成功</errormsg></returnresult><data><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010191</DepartCode><DepartName>急诊科</DepartName><Location>门诊一楼</Location><DepartType>3</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010011</DepartCode><DepartName>心血管内科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010021</DepartCode><DepartName>呼吸与危重症医学科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010031</DepartCode><DepartName>神经内科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010041</DepartCode><DepartName>消化内科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010051</DepartCode><DepartName>内分泌科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010061</DepartCode><DepartName>肾内科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010063</DepartCode><DepartName>血液透析室</DepartName><Location>住院二部四楼西</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010261</DepartCode><DepartName>全科医学科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010131</DepartCode><DepartName>血液风湿科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010071</DepartCode><DepartName>肿瘤科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010312</DepartCode><DepartName>发热门诊</DepartName><Location>发热门诊</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010141</DepartCode><DepartName>骨科</DepartName><Location>门诊一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010081</DepartCode><DepartName>普外科</DepartName><Location>门诊一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010221</DepartCode><DepartName>肛肠科</DepartName><Location>一部一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010091</DepartCode><DepartName>神经创伤外科</DepartName><Location>门诊一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010111</DepartCode><DepartName>泌尿外科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010113</DepartCode><DepartName>碎石室</DepartName><Location>住院一部四楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010251</DepartCode><DepartName>疼痛科</DepartName><Location>武警宁夏总队医院</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010201</DepartCode><DepartName>整形创伤美容科</DepartName><Location>门诊四楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010211</DepartCode><DepartName>皮肤科</DepartName><Location>门诊四层</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010151</DepartCode><DepartName>妇科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010161</DepartCode><DepartName>儿科</DepartName><Location>住院一部一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010173</DepartCode><DepartName>耳鼻喉科</DepartName><Location>门诊三楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010171</DepartCode><DepartName>眼科</DepartName><Location>门诊三楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010172</DepartCode><DepartName>口腔科</DepartName><Location>门诊三楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010101</DepartCode><DepartName>中医科</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>20010021</DepartCode><DepartName>CT室</DepartName><Location>住院一部一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>20010023</DepartCode><DepartName>普放室</DepartName><Location>住院一部一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>20010022</DepartCode><DepartName>核磁室</DepartName><Location>住院一部一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>20010041</DepartCode><DepartName>超声科</DepartName><Location>武警宁夏总队医院</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010291</DepartCode><DepartName>伤口造口护理门诊</DepartName><Location>门诊一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>40010027</DepartCode><DepartName>哺乳指导门诊</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010281</DepartCode><DepartName>健康管理中心</DepartName><Location>行政楼一楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010301</DepartCode><DepartName>PICC门诊</DepartName><Location>门诊部二楼</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010102</DepartCode><DepartName>康复医学科</DepartName><Location>住院二部一楼西</Location><DepartType>1</DepartType></data_row><data_row><SubHospitalID>0000</SubHospitalID><DepartCode>10010264</DepartCode><DepartName>老年护理门诊</DepartName><Location>门诊二楼</Location><DepartType>1</DepartType></data_row></data></response>";
    let jsonObj = this.$x2js.xml2js(ksxx);
    this.list = jsonObj.response.data.data_row;
    //console.log(this.list)
    // apiGetAppointDeptMark({ hbDate: value }).then(res => {
    //   let jsonObj = this.$x2js.xml2js(res.data);
    //   console.log(jsonObj);
    //   let jsonObj2 = this.$x2js.xml2js(
    //     jsonObj.Envelope.Body.MOP_OutpRegisterDeptQueryResponse
    //       .MOP_OutpRegisterDeptQueryResult
    //   );
    //    console.log(jsonObj2);
    //   this.list = jsonObj2.response.data.data_row;
    //    console.log(this.list)
    // });

    */

       this.getKscateData();

  },
  methods: {

    getKscateData() {
      apiGetjksfl().then((res) => {
        this.loading = false;
        this.ksCate = res.data;
        console.log(this.ksCate);
        this.paramsData.type = res.data[0].id;
        this.getKslistData();
      });
    },
    // 获取科室列表
    getKslistData() {
      apiGetksLsist(this.paramsData).then((res) => {
        this.loading = false;
        if (res.data.length < this.paramsData.pagesize) {
          this.finished = true;
          //console.log(this.finished);
        }
        this.ksList = res.data;
        console.log(this.ksList);
      });
    },

    tabClick(e) {
      this.paramsData.type = this.ksCate[e].id;
      this.getKslistData();
    },


    getList() {
	  let _this = this;
	  
    //   let data = {
    //   	HB_DATE: this.yuyue.t
    //   }
    //   let xmll = this.$x2js.js2xml(data)
    //   let xmlq = `<Request>`+ xmll+ `</Request>`
    //   apiGetKsList(xmlq).then(res => {
    //   	let jsonObj = this.$x2js.xml2js(res);
    //   	this.list = jsonObj.Response.Result_Data.Record_List.Record_Info;
    //   	console.log(this.list)
    //   });
    //   this.$http.post(this.httpurl+'/temporary/queryAppointDeptMark',xmlq).then((res) => {
    //   	let jsonObj = this.$x2js.xml2js(res.body);
    //   	// console.log(jsonObj)
    //   	this.list = jsonObj.Response.Result_Data.Record_List.Record_Info;
	//   });
      if (_this.yuyue.z == 1) {
        apiGetRegistDeptMark({ hbDate: _this.yuyue.t }).then(res => {
          console.log(res)
          let jsonObj = this.$x2js.xml2js(res.data);
          let jsonObj2 = this.$x2js.xml2js(
            jsonObj.Envelope.Body.queryRegistDeptMarkResponse
              .queryRegistDeptMarkResult
          );
          this.list = jsonObj2.Response.Result_Data.Record_List.Record_Info;
          // console.log(jsonObj2)
        });
        return;
      }
      apiGetAppointDeptMark({ hbDate: _this.yuyue.t }).then(res => {
        // console.log(res)
        let jsonObj = this.$x2js.xml2js(res.data);
        let jsonObj2 = this.$x2js.xml2js(
          jsonObj.Envelope.Body.queryAppointDeptMarkResponse
            .queryAppointDeptMarkResult
        );
        this.list = jsonObj2.Response.Result_Data.Record_List.Record_Info;
        // console.log(this.list)
      });
    },
    handleGuke(val) {
      this.yuyue.DeptCode = val.departcode; 
      this.yuyue.DeptName = val.name; 
      console.log(this.yuyue.DeptCode);
      sessionStorage.setItem("yuyue", JSON.stringify(this.yuyue));
      this.$router.push({ path: "/Guke" });
    }
  }
};
</script>


<style scoped lang="scss">
.ksbox{
  position: absolute;
  top:1.5rem;
  z-index: 1;
}

.van-tabs {
  display: flex;
  color:#fff;

}

::v-deep .van-tabs--line .van-tabs__wrap {
  height: calc(100% - 1rem);
  overflow-y: auto;
  width: 4rem;
  color:#fff;
}
::v-deep .van-tabs__nav--line {
  display: block;
  background: #fff;
}
::v-deep .van-tab {
  height: 1rem;
  flex: inherit;
}
::v-deep .van-tab--active {
  background: #e6e6e6;
  position: relative;
}

::v-deep .van-tab--active::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  width: 0.1rem;
  height: 1rem;
  background: #46c3b0;
}

</style>
