<template>
    <!-- <div class="index"> -->
        <!-- 销售数据 -->
        <div class="index-sales">
          <div>
            <div style="margin: 20px; color: #409eff;">基本信息</div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>客户名称：</span>
                <el-input v-model="name" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
              <div style="flex: 1;">
                <span>客户类型：</span>
                <el-select v-model="custom_type" placeholder="请选择" style="width: 60%;">
                  <el-option
                    v-for="item in custom_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="salesperson" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span>签约时间：</span>
                <el-date-picker
                  v-model="sign_time"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期"
                  style="width: 60%;">
                </el-date-picker>
              </div>
              <div style="flex: 1;">
                <span>合同金额：</span>
                <el-input v-model="contract_price" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
              <div style="flex: 1;">
                <span>软件金额：</span>
                <el-input v-model="software_price" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
             
            </div>
            <div class="xinxi">
                <div style="flex: 1;">
                  <span>硬件金额：</span>
                  <el-input v-model="hardware_price" placeholder="请输入内容" style="width: 60%;"></el-input>
                </div>
                <div style="flex: 1;">
                  <span>年费金额：</span>
                  <el-input v-model="year_cost_price" placeholder="请输入内容" style="width: 60%;"></el-input>
                </div>
                <div style="flex: 1;">
                  <span>上线时间：</span>
                  <el-date-picker
                    v-model="topline_time"
                    type="date"
                    value-format="yyyy-MM-dd"
                    placeholder="选择日期"
                    style="width: 60%;">
                  </el-date-picker>
                </div>
            </div>
            <div style="display: flex;">
              <div style="flex: 1;">
                <span>详细地址：</span>
                <el-input v-model="address" placeholder="请输入内容" style="width: 75%;"></el-input>
              </div>
               <div style="flex: 1;">
                <span>&nbsp; &nbsp;备 &nbsp;&nbsp;&nbsp;注：</span>
                <el-input v-model="client_remark" placeholder="请输入内容" style="width: 75%;"></el-input>
              </div>
              <div style="flex: 1;">
                <span>签约结束时间：</span>
                <el-date-picker
                  v-model="sign_end_time"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期"
                  style="width: 60%;">
                </el-date-picker>
              </div>
              
            </div>
          </div>
          <div>
            <div style="margin: 20px; color: #409eff;">实施信息</div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>现场实施：</span>
                <el-select v-model="is_implement" placeholder="请选择" style="width: 60%;">
                  <el-option
                    v-for="item in shishi_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div style="flex: 1;">
                <span>实施时间：</span>
                <el-date-picker
                  v-model="implement_time"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期"
                  style="width: 60%;">
                </el-date-picker>
              </div>
              <div style="flex: 1;">
                <span>实施人员：</span>
                <el-input v-model="implement_person" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="display: inline-block;position: relative;bottom: 20px;left: 0;">实施备注：</span>
                <el-input type="textarea" :row="2" v-model="implement_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>LIS对接：</span>
                <el-select v-model="lis_status" placeholder="请选择" style="width: 60%;">
                  <el-option
                    v-for="item in duijie_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
              <div style="flex: 1;">
                <span>LIS对接人：</span>
                <el-input v-model="lis_contact" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
              <div style="flex: 1;">
                <span>LIS对接时间：</span>
                <el-date-picker
                  v-model="lis_time"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期"
                  style="width: 60%;">
                </el-date-picker>
              </div>
            </div>

            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="display: inline-block;position: relative;bottom: 20px;left: 0;">LIS对接备注：</span>
                <el-input type="textarea" :row="2" v-model="lis_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>质控对接：</span>
                <el-select v-model="qc_status" placeholder="请选择">
                  <el-option
                    v-for="item in duijie_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="qc_contact" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
              <div style="flex: 1;">
                <span>质控对接时间：</span>
                <el-date-picker
                  v-model="qc_time"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期"
                  style="width: 60%;">
                </el-date-picker>
              </div>
            </div>
            <div class="xinxi" style="">
              <div style="flex: 1;">
                <span style="display: inline-block;position: relative;bottom: 20px;left: 0;">质控对接备注：</span>
                <el-input type="textarea" :row="2" v-model="qc_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>医保对接：</span>
                <el-select v-model="yb_status" placeholder="请选择">
                  <el-option
                    v-for="item in duijie_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="yb_contact" placeholder="请输入内容" style="width: 60%;"></el-input>
              </div>
              <div style="flex: 1;">
                <span>医保对接时间：</span>
                <el-date-picker
                  v-model="yb_time"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期"
                  style="width: 60%;">
                </el-date-picker>
              </div>
            </div>
            <div style="">
              <div style="flex: 1;">
                <span style="display: inline-block;position: relative;bottom: 20px;left: 0;">医保对接备注：</span>
                <el-input type="textarea" :row="2" v-model="yb_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
          </div>
          <div>
            <div style="margin: 20px; color: #409eff;">硬件信息</div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>体重秤：</span>
                <el-select v-model="weight_scale_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="weight_scale_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="weight_scale_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>血压计：</span>
                <el-select v-model="sphygmomanometer_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="sphygmomanometer_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="sphygmomanometer_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>扫码器：</span>
                <el-select v-model="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="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="scanner_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>人脸识别：</span>
                <el-select v-model="facial_recognition_device_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="facial_recognition_device_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="facial_recognition_device_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
            <div class="xinxi"  style="">
              <div style="flex: 1;">
                <span>打印机：</span>
                <el-select v-model="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="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="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="hardware_remark" placeholder="请输入内容" style="width: 80%;"></el-input>
              </div>
            </div>
          </div>
        </div>
    <!-- </div> -->
</template>

<script>
import { uParseTime } from "@/utils/tools";
export default {
    data(){
      return{
        name:'',
        custom_type:'',
        salesperson:'',
        sign_time:this.getTime(new Date()),
        contract_price:'',
        software_price:'',
        hardware_price:'',
        year_cost_price:'',

        address:'',
        sign_end_time:this.getTime(new Date()),
        topline_time:this.getTime(new Date()),//上线时间
        client_remark:'',//基础信息备注
        is_implement:'',
        implement_time:this.getTime(new Date()),
        implement_person:'',
        implement_remark:'',
        lis_status:'',
        lis_contact:'',
        lis_time:this.getTime(new Date()),
        lis_remark:'',
        qc_status:'',
        qc_contact:'',
        qc_time:this.getTime(new Date()),
        qc_remark:'',
        yb_status:'',
        yb_contact:'',
        yb_time:this.getTime(new Date()),
        yb_remark:'',
        remark:'',
        weight_scale_status:'',
        weight_scale_brand:'',
        weight_scale_remark:'',
        sphygmomanometer_status:'',
        sphygmomanometer_brand:'',
        sphygmomanometer_remark:'',
        scanner_status:'',
        scanner_brand:'',
        scanner_remark:'',
        facial_recognition_device_status:'',
        facial_recognition_device_brand:'',
        facial_recognition_device_remark:'',
        printer_status:'',
        printer_brand:'',
        printer_remark:'',
        hardware_remark:'',

        input:'',
        textarea:'',
        value:'',
        value1:new Date(),
        options:[],
        custom_options:[{value:1,label:'标准版'},{value:2,label:'尊享版'},{value:3,label:'专业版'}],
        shishi_options:[{value:1,label:'未实施'},{value:2,label:'已实施'}],
        duijie_options:[{value:1,label:'无需求'},{value:2,label:'未对接'},{value:3,label:'对接中'},{value:4,label:'已对接'}],
        tizhong_options:[{value:1,label:'购买全套'},{value:2,label:'购买秤头'},{value:3,label:'未购买'}],
        goum_options:[{value:1,label:'未购买'},{value:2,label:'已购买'}],
      }
    },
    created(){

    },
    methods:{
      getclient(){
        var formobj = {
          xt_org_id:'',
          name:this.name,
          custom_type:this.custom_type,
          salesperson:this.salesperson,
          sign_time:this.sign_time,
          contract_price:this.contract_price,
          software_price:this.software_price,
          hardware_price:this.hardware_price,
          year_cost_price:this.year_cost_price,
          address:this.address,
          sign_end_time:this.sign_end_time,
          topline_time:this.topline_time,
          client_remark:this.client_remark,
          is_implement:this.is_implement,
          implement_time:this.implement_time,
          implement_person:this.implement_person,
          implement_remark:this.implement_remark,
          lis_status:this.lis_status,
          lis_contact:this.lis_contact,
          lis_time:this.lis_time,
          lis_remark:this.lis_remark,
          qc_status:this.qc_status,//质控
          qc_person:this.qc_contact,
          qc_time:this.qc_time,
          qc_remark:this.qc_remark,
          yb_status:this.yb_status,//医保
          yb_person:this.yb_contact,
          yb_time:this.yb_time,
          yb_remark:this.yb_remark,
          remark:this.remark,
          weight_scale_status:this.weight_scale_status,
          weight_scale_brand:this.weight_scale_brand,
          weight_scale_remark:this.weight_scale_remark,
          sphygmomanometer_status:this.sphygmomanometer_status,
          sphygmomanometer_brand:this.sphygmomanometer_brand,
          sphygmomanometer_remark:this.sphygmomanometer_remark,
          scanner_status:this.scanner_status,
          scanner_brand:this.scanner_brand,
          scanner_remark:this.scanner_remark,
          facial_recognition_device_status:this.facial_recognition_device_status,
          facial_recognition_device_brand:this.facial_recognition_device_brand,
          facial_recognition_device_remark:this.facial_recognition_device_remark,
          printer_status:this.printer_status,
          printer_brand:this.printer_brand,
          printer_remark:this.printer_remark,
          hardware_remark:this.hardware_remark,
        }
        console.log('formobj',formobj);
        this.$emit('params',formobj)
      },
      // 转换时间
      getTime(val) {
        if(val < 0){
          return ""
        }
        if(val == ""){
          return ""
        }else {
          return uParseTime(val, '{y}-{m}-{d}')
        }
      },
    },
    mounted(){
      // this.getclient()
    }

}
</script>

<style scoped lang="scss">
.index{
    background: #F5F7F9;
    padding: 15px;
    box-sizing: border-box;
    width: 100%;
    min-height: 100%;
}
.index-sales{
    width: 100%;
    height: auto;
    // padding: 20px 15px;
    box-sizing: border-box;
    border-radius: 5px;
    background: #ffffff;
    margin-bottom: 20px;
    .xinxi{
      display: flex;
      margin-bottom: 15px;
    }
}
.index-sales-box{
    border:  1px solid #E6E6E6;
    width: 100%;
    height: auto;
    position: relative;
    padding: 25px 15px 5px;
    box-sizing: border-box;
    
}
.index-sales-box-name{
    position: absolute;
    width: 130px;
    height: 30px;
    background: #ffffff;
    display: inline-block;
    text-align: center;
    line-height: 30px;
    font-size: 13px;
    color: #000000;
    left: 25px;
    top: -15px;
}
</style>