<!-- 硬件 -->
<template>
  <div class="context">
    <div style="text-align: right;">
      <el-button type="primary" @click="open_editor">
        编辑硬件信息
      </el-button> 
    </div>
    <div class="xinxi"  style="">
      <div style="flex: 1;">
        体重秤：{{ getoptions(Message.weight_scale_status) }}
      </div>
      <div style="flex: 1;">
        品牌名称：{{ Message.weight_scale_brand }}
      </div>
      <div style="flex: 1;">
        体重秤说明：{{Message.weight_scale_remark}}
      </div>
    </div>
    <div class="xinxi"  style="">
      <div style="flex: 1;">
        血压计：{{getoptions2(Message.sphygmomanometer_status)}}
      </div>
      <div style="flex: 1;">
        品牌名称：{{Message.sphygmomanometer_brand}}
      </div>
      <div style="flex: 1;">
        血压计说明：{{Message.sphygmomanometer_remark}}
      </div>
    </div>
    <div class="xinxi"  style="">
      <div style="flex: 1;">
        扫码枪：{{ getoptions2(Message.scanner_status) }}
      </div>
      <div style="flex: 1;">
        品牌名称：{{ Message.scanner_brand }}
      </div>
      <div style="flex: 1;">
        扫码器说明：{{Message.scanner_remark}}
      </div>
    </div>
    <div class="xinxi"  style="">
      <div style="flex: 1;">
        人脸识别：{{ getoptions2(Message.facial_recognition_device_status) }}
      </div>
      <div style="flex: 1;">
        品牌名称：{{Message.facial_recognition_device_brand}}
      </div>
      <div style="flex: 1;">
        人脸识别说明：{{Message.facial_recognition_device_remark}}
      </div>
    </div>
    <div class="xinxi"  style="">
      <div style="flex: 1;">
        打印机：{{getoptions2(Message.printer_status)}}
      </div>
      <div style="flex: 1;">
        品牌名称：{{Message.printer_brand}}
      </div>
      <div style="flex: 1;">
        打印机说明：{{Message.printer_remark}}
      </div>
    </div>
    <div class="xinxi"  style="">
      <!-- <div style="flex: 1;">
        其它情况：已购买
      </div> -->
      <!-- <div style="flex: 1;">
        
      </div> -->
    </div>
    <div>
      备注：{{ Message.hardware_remark }}
    </div>

    <!-- 弹窗 -->
    <div>
      <el-dialog
        title="修改硬件信息"
        :visible.sync="hardware"
        width="60%"
        >
          <div style="height: 50vh;overflow: overlay;">
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>客户名称：</span>
                <el-input v-model="hardwareobj.name" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
              <div style="flex: 1;">
                
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>体重秤：</span>
                <el-select v-model="hardwareobj.weight_status" placeholder="请选择">
                  <el-option
                    v-for="item in tizhong_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div style="flex: 1;">
                <span>体重秤品牌：</span>
                <el-input v-model="hardwareobj.weight_brand" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="position: relative;bottom: 20px;left: 0;">
                    体重秤说明：
                </span>
                <el-input type="textarea" :row="2" v-model="hardwareobj.weight_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>血压计：</span>
                <el-select v-model="hardwareobj.xueya_status" placeholder="请选择">
                  <el-option
                    v-for="item in goum_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div style="flex: 1;">
                <span>血压计品牌：</span>
                <el-input v-model="hardwareobj.xueya_brand" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="position: relative;bottom: 20px;left: 0;">
                  血压计说明：
                </span>
                <el-input type="textarea" :row="2" v-model="hardwareobj.xueya_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>扫码器：</span>
                <el-select v-model="hardwareobj.scanner_status" placeholder="请选择">
                  <el-option
                    v-for="item in goum_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div style="flex: 1;">
                <span>扫码器品牌：</span>
                <el-input v-model="hardwareobj.scanner_brand" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="position: relative;bottom: 20px;left: 0;">
                  扫码器说明：
                </span>
                <el-input type="textarea" :row="2" v-model="hardwareobj.scanner_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>人脸识别：</span>
                <el-select v-model="hardwareobj.facial_status" placeholder="请选择">
                  <el-option
                    v-for="item in goum_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div style="flex: 1;">
                <span>人脸识别品牌：</span>
                <el-input v-model="hardwareobj.facial_brand" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="position: relative;bottom: 20px;left: 0;">
                  人脸识别说明：
                </span>
                <el-input type="textarea" :row="2" v-model="hardwareobj.facial_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>打印机：</span>
                <el-select v-model="hardwareobj.printer_status" placeholder="请选择">
                  <el-option
                    v-for="item in goum_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div style="flex: 1;">
                <span>打印机品牌：</span>
                <el-input v-model="hardwareobj.printer_brand" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="position: relative;bottom: 20px;left: 0;">
                  打印机说明：
                </span>
                <el-input type="textarea" :row="2" v-model="hardwareobj.printer_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="position: relative;bottom: 20px;left: 0;">
                    备注：
                </span>
                <el-input type="textarea" :row="2" v-model="hardwareobj.hardware_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
          </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="hardware = false">取 消</el-button>
          <el-button type="primary" @click="hardware_click">确 定</el-button>
        </span>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import {getkehucustomedit,getcustomget,getkehulist} from '../../../api/index'
export default{
  props:{
    // Message:Object
    rowid:String
  },
  data(){
    return{
      input:'',
      textarea:'',
      value:'',
      options:[],
      hardware:false,

      tizhong_options:[{value:1,label:'购买全套'},{value:2,label:'购买秤头'},{value:3,label:'未购买'}],
      goum_options:[{value:1,label:'未购买'},{value:2,label:'已购买'}],

      hardwareobj:{
        name:'',
        weight_status:'',
        weight_brand:'',
        weight_remark:'',
        xueya_status:'',
        xueya_brand:'',
        xueya_remark:'',
        scanner_status:'',
        scanner_brand:'',
        scanner_remark:'',
        facial_status:'',
        facial_brand:'',
        facial_remark:'',
        printer_status:'',
        printer_brand:'',
        printer_remark:'',
        hardware_remark:'',
      },
      Message:{}
    }
  },
  methods:{
    // 对接状态
    getoptions(val){
      const options = this.tizhong_options
      for(let i in options){
        if(val == options[i].value){
          return options[i].label
        }
      }
    }, 
    getoptions2(val){
      const options = this.goum_options
      for(let i in options){
        if(val == options[i].value){
          return options[i].label
        }
      }
    }, 
    // 打开弹窗
    open_editor(){
      this.hardware = true
      this.hardwareobj = {
        name:this.Message.name,
        weight_status:this.Message.weight_scale_status,
        weight_brand : this.Message.weight_scale_brand,
        weight_remark: this.Message.weight_scale_remark,
        xueya_status:this.Message.sphygmomanometer_status,
        xueya_brand:this.Message.sphygmomanometer_brand,
        xueya_remark:this.Message.sphygmomanometer_remark,
        scanner_status:this.Message.scanner_status,
        scanner_brand:this.Message.scanner_brand,
        scanner_remark:this.Message.scanner_remark,
        facial_status:this.Message.facial_recognition_device_status,
        facial_brand:this.Message.facial_recognition_device_brand,
        facial_remark:this.Message.facial_recognition_device_remark,
        printer_status:this.Message.printer_status,
        printer_brand:this.Message.printer_brand,
        printer_remark:this.Message.printer_remark,
        hardware_remark:this.Message.hardware_remark,
      }
    },
    // 确认
    hardware_click(){
      this.hardware = false
      const data={
        name:this.hardwareobj.name,
        weight_scale_status:this.hardwareobj.weight_status,
        weight_scale_brand : this.hardwareobj.weight_brand,
        weight_scale_remark: this.hardwareobj.weight_remark,
        sphygmomanometer_status:this.hardwareobj.xueya_status,
        sphygmomanometer_brand :this.hardwareobj.xueya_brand,
        sphygmomanometer_remark:this.hardwareobj.xueya_remark,
        scanner_status:this.hardwareobj.scanner_status,
        scanner_brand:this.hardwareobj.scanner_brand,
        scanner_remark:this.hardwareobj.scanner_remark,
        facial_recognition_device_status : this.hardwareobj.facial_status,
        facial_recognition_device_brand : this.hardwareobj.facial_brand,
        facial_recognition_device_remark : this.hardwareobj.facial_remark,
        printer_status:this.hardwareobj.printer_status,
        printer_brand:this.hardwareobj.printer_brand,
        printer_remark:this.hardwareobj.printer_remark,
        hardware_remark:this.hardwareobj.hardware_remark,
        module:'7',
        id:this.rowid,
      }
      getkehucustomedit(data).then(res =>{
        this.getdetails()
      })
      
    },
     // 数据源
     getdetails(){
      getcustomget(this.rowid).then(res =>{
        this.Message = res.data.custom
        console.log('usemessage2222222',this.Message);
      })
    },
  },
  created(){
    this.getdetails()
  }
}
</script>
<style lang="scss" scoped>
  .context{
    padding: 20px 0;
    .xinxi{
      display: flex;
      margin-bottom: 15px; 
      /* text-align: center;*/
    }
    
  }
</style>