<template>
  <!--批量删除-->
  <div class="main-contain">
    <div class="app-container">
      <div class="bannar_list">
        <div class="banner_left">
          <div>
            透析模式:
            <el-select
              v-model="modeOptions_value"
              placeholder="请选择"
            >
              <el-option
                v-for="item in modeOptions"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
          <div>
            删除类型:
            <el-select v-model="new_type" placeholder="请选择" @change="changetype">
              <el-option
                v-for="item in options"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
          <div v-if="new_type == 1">
            请输入需要删除的药品:
            <el-select
              filterable
              v-model="id"
              placeholder="请选择"
              @change="getUsername"
            >
              <el-option
                v-for="item in druglist"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
          <div v-if="new_type == 2">
            请输入需要删除的项目:
            <el-select
              filterable
              v-model="id"
              placeholder="请选择"
              @change="getUsername"
            >
              <el-option
                v-for="item in projectlist"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
        </div>

<!--        <button @click="lili">调试</button>-->
        <el-button @click="save">保存</el-button>
      </div>

      <el-container>
        <div style="width: 211px">
          <el-table
            border
            ref="multipleTable"
            :data="tableData"
            tooltip-effect="dark"
            style="width: 100%"
            @selection-change="handleSelectionChange"
            @current-change="test"
            :row-style="{ color: '#303133' }"
            :header-cell-style="{
              backgroundColor: 'rgb(245, 247, 250)',
              color: '#606266',
            }"
          >
            <el-table-column type="selection" width="55"> </el-table-column>
            <el-table-column label="患者姓名" width="155">
              <template slot-scope="scope" >{{ scope.row.name }}</template>
            </el-table-column>
          </el-table>
        </div>

        <el-tabs type="border-card" v-if="isshow == 1 && list.length > 0">
          <el-tab-pane
            v-for="(item,index) in list"
            :key="index"
            :label="'处方'+(index+1)"
            :name="index"
          >
            <el-table
              v-if="item.advices.length > 0"
              :data="item.advices"
              style="width: 100%"
              max-height="250"
              border
              :row-style="{ color: '#303133' }"
              :header-cell-style="{
                  backgroundColor: 'rgb(245, 247, 250)',
                  color: '#606266',
                }"
            >
              <el-table-column fixed label="药品名称" width="230">
                <template slot-scope="scope">
                  {{scope.row.advice_name}}
                </template>
              </el-table-column>
              <el-table-column label="单次用量" width="200">
                <template slot-scope="scope">
                  {{scope.row.single_dose}}{{scope.row.single_dose_unit}}
                </template>
              </el-table-column>
              <el-table-column label="用法" width="120">
                <template slot-scope="scope">
                  {{scope.row.delivery_way}}
                </template>
              </el-table-column>
              <el-table-column label="频率" width="120">
                <template slot-scope="scope">
                  {{scope.row.execution_frequency}}
                </template>
              </el-table-column>
              <el-table-column label="天数" width="110">
                <template slot-scope="scope">
                  {{scope.row.day}}天
                </template>
              </el-table-column>
              <el-table-column label="总量" width="200">
                <template slot-scope="scope">
                  {{scope.row.prescribing_number}}{{scope.row.prescribing_number_unit}}
                </template>
              </el-table-column>
              <el-table-column label="单价" width="120">
                <template slot-scope="scope">
                  {{scope.row.price}}元
                </template>
              </el-table-column>
              <el-table-column label="备注" width="120">
                <template slot-scope="scope">
                  {{scope.row.remark}}
                </template>
              </el-table-column>
              <el-table-column label="操作" width="120">
                <template slot-scope="scope">
                  <el-button
                    @click.native.prevent="delects(scope.$index,scope,item)"
                    type="text"
                    size="small">
                    删除
                  </el-button>
                </template>
              </el-table-column>
            </el-table>

            <el-table
              v-if="item.project.length > 0"
              :data="item.project"
              style="width: 100%"
              max-height="250"
              border
              :row-style="{ color: '#303133' }"
              :header-cell-style="{
                  backgroundColor: 'rgb(245, 247, 250)',
                  color: '#606266',
                }"
            >
              <el-table-column fixed label="项目名称" width="230">
                <template slot-scope="scope">
                  <div v-if="scope.row.type == 2">{{scope.row.project.project_name}}</div>
                  <div v-if="scope.row.type == 3">{{scope.row.good_info.good_name}}</div>
                </template>
              </el-table-column>
              <el-table-column label="组" width="120">
                <template slot-scope="scope">
                  <div v-if="scope.row.type == 2">{{scope.row.project.translate}}</div>
                  <div v-if="scope.row.type == 3">{{scope.row.good_info.translate}}</div>
                </template>
              </el-table-column>
              <el-table-column label="单次用量" width="120">
                <template slot-scope="scope">
                  {{scope.row.single_dose}}
                  {{ scope.row.unit }}
                </template>
              </el-table-column>
              <el-table-column label="用法" width="120">
                <template slot-scope="scope">
                  {{scope.row.delivery_way}}
                </template>
              </el-table-column>
              <el-table-column label="频率" width="120">
                <template slot-scope="scope">
                  {{scope.row.execution_frequency}}
                </template>
              </el-table-column>
              <el-table-column label="天数" width="110">
                <template slot-scope="scope">
                  {{scope.row.day}}天
                </template>
              </el-table-column>
              <el-table-column label="总量" width="100">
                <template slot-scope="scope">
                  {{scope.row.count}}
                  {{ scope.row.unit }}
                </template>
              </el-table-column>
              <el-table-column label="单价" width="120">
                <template slot-scope="scope">
                  {{scope.row.price}}元
                </template>
              </el-table-column>
              <el-table-column label="备注" width="120">
                <template slot-scope="scope">
                  {{scope.row.remark}}
                </template>
              </el-table-column>
              <el-table-column label="推送频率" width="120">
                <template slot-scope="scope">
                  <div v-if="scope.row.frequency_type == 1">{{'每次必推'}}</div>
                  <div v-if="scope.row.frequency_type == 2">{{scope.row.day_count}}天/次</div>
                  <div v-if="scope.row.frequency_type == 3">{{scope.row.week_days}}</div>
                </template>
              </el-table-column>
              <el-table-column fixed="right" label="操作" width="102">
                <template slot-scope="scope">
                  <el-button
                    @click.native.prevent="delects(scope.$index,scope,item)"
                    type="text"
                    size="small">
                    删除
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>



      </el-container>
    </div>
  </div>
</template>
<script>
import { gethisusertoalive } from "@/api/deposit";
import {
  getdrugsinformation,
  replacepeoplename,
  replaceconfig,
  deletedrugsbatch,
  batchdeleteitems,
  getmodeconfigs,
  ptemplateinformation,
  deleteone
} from "@/api/batch/batch";

export default {
  data() {
    return {
      dialogVisible: false,
      tableList: [],
      editableTabsValue: "1",
      modeOptions: {},
      tableDatas:[{
        id: "",
        drug_name: "",
        single_dose: "",
        single_dose_unit: "",
        delivery_way: "",
        execution_frequency: "",
        day: "",
        prescribing_number: "",
        prescribing_number_unit: "",
        price: "",
        remark: "",
      },],//药品
      project:[ {
        id: "",
        drug_name: "",
        translate:"",
        single_dose: "",
        unit: "",
        delivery_way: "",
        execution_frequency: "",
        day: "",
        prescribing_number: "",
        price: "",
        remark: "",
        frequency_type:1,
        day_count:"",
        week_days:"",
      },],//项目
      tabIndex: 2,
      modeOptions_value: 1, //透析模式
      multipleSelection: [],//选中的患者
      tableData:[],
      options:[{id:1,name:"药品"},{id:2,name:"项目"}],
      options_patient:[{id:1,name:"是"},{id:2,name:"否"}],
      options_2:[{id:1,name:"普通门诊"},{id:2,name:"门诊特殊病"}],
      new_type:1,//新增类型
      druglist:[],//药品列表
      projectlist:[],//项目列表
      id:"",//药品、项目、耗材
      tmplist:[],//临时
      unit:[{id:1,name:"g"},{id:2,name:"mg"},{id:3,name:"u"},{id:4,name:"ml"},{id:5,name:"万U"},{id:6,name:"枚"},{id:7,name:"粒"},
        {id:8,name:"片"},{id:9,name:"支"},{id:10,name:"μg"},{id:11,name:"iu"},{id:12,name:"包"},{id:13,name:"袋"},{id:14,name:"万"},
        {id:15,name:"万iu"},{id:16,name:"丸"},{id:17,name:"盒"},{id:18,name:"瓶"},{id:19,name:"瓶（袋）"},{id:20,name:"次"}],
      usage:[],//用法
      frequency:[],//频率
      frequency_type:"",//周期提醒
      day_count:"",//周期提醒天
      week_days:[],//周期提醒星期
      tabhang:0,//tab的下标
      hang:0,//行数
      list:[],
      isshow:0,//是否显示处方
      tmpid:0,

    }
  },
  created() {
    // console.log("this.$store.getters.treatment_mode",this.$store.getters.treatment_mode)
    for (let key in this.$store.getters.treatment_mode) {
      this.modeOptions[key] = this.$store.getters.treatment_mode[key]
    }
    // console.log("this.modeOptions",this.modeOptions)
    this.getdrugconfigs();
    this.isshow = 0
    this.tmpid = 0;
  },
  methods: {
    save() {
      var tmp = this.modeOptions[this.modeOptions_value].name
      var tmp2 = ""
      if (this.druglist != null){
        for(let i = 0;i < this.druglist.length;i++){
          if (this.id == this.druglist[i].id){
            tmp2 = this.druglist[i].name
          }
        }
      }
      if(this.projectlist != null){
        for (let j = 0;j < this.projectlist.length;j++){
          if (this.id == this.projectlist[j].id){
            tmp2 = this.projectlist[j].name
          }
        }
      }
      this.$confirm(
        "注：该操作将会把所选患者的"+tmp+"透析模式中的"+tmp2+"进行删除，请确定是否删除?",
        "",
        {
          confirmButtonText: "确 定",
          cancelButtonText: "取 消",
          type: "warning",
        }
      ).then(() => {
        if (this.multipleSelection.length == 0){
          this.$message.error('没有选中有效信息')
          return
        }
        let st = ""
        for (let i = 0;i < this.multipleSelection.length;i++){
          st = st + this.multipleSelection[i].id + ","
        }
        console.log("string",st)
        let params = {
          mode_id:this.modeOptions_value,
          patient_id: st,
          type:this.new_type,
          replaced: this.id,
        }
        if (this.new_type == 1){
          deletedrugsbatch(params).then((res) =>{
            if (res.data.state == 1){
              this.$message.success('删除成功')
              this.getUsername()
            }else{
              this.$message.error(res.data.msg)
            }
          })
        }else{
          batchdeleteitems(params).then((res) =>{
            if (res.data.state == 1){
              this.$message.success('删除成功')
              this.getUsername()
            }else{
              this.$message.error(res.data.msg)
            }
          })
        }
      });
    },
    test(val){
      console.log("val?:",val);
      this.tmpid = val.id
      var params = {
        mode_id:this.modeOptions_value,
        patient_id:val.id,
      }
      ptemplateinformation(params).then((res) =>{
        if (res.data.state == 1){
          this.list = res.data.data.list
          this.isshow = 1
        }
      })
    },
    lili() {
      console.log("this.list",this.list);
      console.log("this.multipleSelection",this.multipleSelection)
      // console.log("this.mode",this.modeOptions_value)
      // console.log("this.projectlist2",this.projectlist2)
      // console.log("patient_value",this.patient_value)
    },
    delects(hang,sc,item){
      console.log("hang",hang)
      console.log("sc",sc)
      console.log("item",item)
      var params ={
        type:item.type,//1药品2项目
        id:sc.row.id,
      }
      var params2 = {
        mode_id:this.modeOptions_value,
        patient_id:this.tmpid,
      }
      deleteone(params).then((res) =>{
        if (res.data.state == 1){
          this.$message.success('删除成功')
          ptemplateinformation(params2).then((res) =>{
            if (res.data.state == 1){
              this.list = res.data.data.list
              this.isshow = 1
            }
          })
        }
      })


    },
    changetype(){
      console.log(">>>>>>>",this.new_type)
      this.id = ""
      this.tableData = []
    },
    changeid(item,index){
      item.id = item.drug_name
      var params = {
        id:item.id
      }
      getdrugsinformation(params).then((res) =>{
        if (res.data.state == 1){
          console.log("res??",res)
          this.tableDatas[0].single_dose = res.data.data.list[0].single_dose;
          this.tableDatas[0].single_dose_unit = res.data.data.list[0].single_dose_unit;
          this.tableDatas[0].delivery_way = res.data.data.list[0].delivery_way;
          this.tableDatas[0].execution_frequency = res.data.data.list[0].execution_frequency;
          this.tableDatas[0].day = res.data.data.list[0].drug_day;
          this.tableDatas[0].prescribing_number = res.data.data.list[0].prescribing_number;
          this.tableDatas[0].prescribing_number_unit = res.data.data.list[0].prescribing_number_unit;
          this.tableDatas[0].price = res.data.data.list[0].retail_price;
          this.tableDatas[0].remark = res.data.data.list[0].remark;
        }
      })
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    changeid2(item,index){
      item.id = item.drug_name
      var params = {
        id:item.id
      }
      getdrugsinformation(params).then((res) =>{
        if (res.data.state == 1){
          console.log("res??",res)
          this.project[0].single_dose = res.data.data.list[0].single_dose;
          this.project[0].translate = res.data.data.list[0].translate;
          this.project[0].delivery_way = res.data.data.list[0].delivery_way;
          this.project[0].execution_frequency = res.data.data.list[0].execution_frequency;
          this.project[0].day = res.data.data.list[0].day;
          this.project[0].prescribing_number = res.data.data.list[0].prescribing_number;
          this.project[0].unit = res.data.data.list[0].unit;
          this.project[0].price = res.data.data.list[0].retail_price;
          this.project[0].remark = res.data.data.list[0].remark;
        }
      })
    },
    //获取配置
    getdrugconfigs(){
      var params = {}
      replaceconfig(params).then((res) =>{
        if (res.data.state == 1){
          this.druglist = res.data.data.list
          this.projectlist = res.data.data.list2
        }
      })
      getmodeconfigs(params).then((res) =>{
        if (res.data.state == 1){
          this.frequency = res.data.data.efs
          this.usage = res.data.data.drugways
        }
      })
    },
    getUsername(){
      var params = {
        id: this.id,
        mode: this.modeOptions_value
      }
      replacepeoplename(params).then((res) =>{
        if (res.data.state == 1){
          this.tableData = res.data.data.list
        }
      })
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done();
        })
        .catch(_ => {});
    }
  }

}
</script>



<style lang="scss" scoped>
.bannar_list {
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
.banner_left {
  width: 1000px;
  display: flex;
  justify-content: space-around;
div {
  white-space: nowrap;
}
}
}
.zone {
//  margin-left: 30px;
//  text-align: left;
  width: 70px;
  display: inline-block;
  color: #606266;
}
.disinfect {
  position: relative;
.newButton {
// position: absolute;
// right: 2%;
// top:4px;
// z-index: 9;
  margin-bottom: 10px;
  margin-left: 90%;
}
}
.disinfectOne {
  position: relative;
.newButtonOne {
  position: absolute;
  right: 0;
  top: -10;
  z-index: 18;
}
}
.but {
  width: 200px;
  height: 50px;
// border: solid 1px red;
  margin-left: 77%;
}
.clearn {
  width: 460px;
  height: 50px;
// border:solid 1px red;
  margin-left: 650px;
}

.zClass {
  width: 200px;
  height: 200px;
// border:solid 1px red;
  margin-left: 450px;
  margin-top: 200px;
}
.warn {
  color: red;
  font-size: 14px;
  width: 100%;
  display: inline-block;
  margin-left: 96px;
}

.userbutton {
  margin-bottom: 10px;
  margin-left: 82%;
}
</style>
<style lang="scss" >
.a {
  margin-bottom: 10px;
  margin-top: 6px;
}

.b {
.el-button {
  margin-left: 90%;
  margin-bottom: 10px;
}
}

.stoppage {
.el-form-item__label {
  width: 190px;
}
}
.st {
.el-form-item__label {
  width: -10px;
}
}
.main {
  position: relative;
.newButtonOne {
  position: absolute;
  right: 0;
  z-index: 2;
}
}

.elbutton {
// border: solid 1px red;
  height: 50px;
  width: 400px;
  margin-left: 650px;
}
// .el-form-item__label {
   //   width: 130px;
   //   font-size: 14px;
   // }
.el-form-item__error {
  margin-left: 130px;
}

.el-upload-list__item-name {
  color: #606266;
  display: block;
  margin-right: 40px;
  overflow: hidden;
  padding-left: 4px;
  text-overflow: ellipsis;
  transition: color 0.3s;
  white-space: nowrap;
}
.el-main {
  padding-top: 0px;
}
.newMain {
.el-form-item__label {
  width: 104px;
}
}
.newDisinfectOne {
.el-input--prefix .el-input__inner {
  padding-left: 15px;
}
}
.stoppage {
.el-form-item__label {
  width: 18%;
}
}
.newItem {
.el-form-item__label {
  width: 130px;
}
}
.formItem {
.el-form-item__label {
  width: 104px;
  line-height: 30px;
}
}
.newname {
.el-form-item__label {
  width: 60px;
}
}
::-webkit-scrollbar {
  height: 20px;
}

.el-button {
  color: #fff;
  background-color: #409eff;
  border-color: #409eff;
}
.el-table td .cell {
  padding: 0 10px;
}
</style>
