<!--医生注册模块-->
<template>
  <div class="ReMain" style=" display: flex;border-top: blue;border-top-style: solid">
    <div class="box-for-user" style="padding-left: 100px; padding-right: 0px;min: calc(100vh-50px)">
      <div class="div"><h3>用户名：</h3></div>
      <el-icon></el-icon>
      <el-input placeholder="请输入用户名" class="form-input" v-model="username" @input="change($event)"></el-input>
      <div class="div"><h3>密码：</h3></div>
      <el-icon></el-icon>
      <el-input type="password" show-password placeholder="请输入密码" class="form-input" v-model="password" @input="change($event)"></el-input>
      <div class="div"><h3>确认密码：</h3></div>
      <el-icon></el-icon>
      <el-input type="password" show-password placeholder="请确认密码" class="form-input" v-model="confirm" @input="change($event)"></el-input>
      <div class="div"><h3>手机号：</h3></div>
      <el-icon></el-icon>
      <el-input placeholder="请输入手机号" class="form-input" v-model="phonenumber" @input="change($event)"></el-input>
      <div class="div"><h3>身份证号：</h3></div>
      <el-icon></el-icon>
      <el-input placeholder="请输入身份证号" class="form-input" v-model="userid" @input="change($event)"></el-input>
      <div class="div"><h3>所属医院：</h3></div>
      <el-icon></el-icon>
      <el-input placeholder="请输入地址" class="form-input" v-model="hospital" @input="change($event)"></el-input>
      <div class="selectfile"><h3>请上传您的医师资格证：</h3></div>
      <el-icon></el-icon>
      <input type="file" @change="addpic($event)">
<!--      <input accept=".png, .jpg" type="file" ref="file" @change="selectFile" />-->
<!--      <el-icon></el-icon>-->
<!--      <el-upload-->
<!--          class="upload-demo"-->
<!--          action=""-->
<!--          :on-preview="handlePreview"-->
<!--          :on-remove="handleRemove"-->
<!--          :before-remove="beforeRemove"-->
<!--          multiple-->
<!--          :limit="1"-->
<!--          :on-exceed="handleExceed"-->
<!--          :file-list="fileList"-->
<!--          v-model="qualification"-->
<!--      >-->
<!--        <el-button type="primary">Click to upload</el-button>-->
<!--        <template #tip>-->
<!--          <div class="el-upload__tip">-->
<!--            jpg/png files with a size less than 500KB.-->
<!--          </div>-->
<!--        </template>-->
<!--      </el-upload>-->
      <el-icon></el-icon>
      <div>
        <el-button plain="true" @click="submitReg">确认注册</el-button>
      </div>
    </div>
    <div style="flex: 1"></div>
    <div class="image" style="padding-left: 100px; padding-right: 50px">
      <el-image src='https://s.cn.bing.net/th?id=OIP-C.Ra20o1vEX0BmVk9kx-lbngHaFd&w=290&h=214&c=8&rs=1&qlt=90&o=6&dpr=1.38&pid=3.1&rm=2' fit="contain"></el-image>
    </div>
  </div>

</template>

<script>
import request from "@/utils/request";
import {ElMessage} from "element-plus";
var formData = new FormData() // 声明一个FormData对象
const axios = require('axios');
export default {

  name: "ReDoctor",
  data(){
    return {
      username: "",
      password: "",
      confirm: "",
      phonenumber: "",
      userid: "",
      hospital: "",
      qualification:""
    }
  },
  methods: {
      addpic(event){
        this.qualification = event.target.files[0];
        event.preventDefault();//取消默认行为
        //创建 formData 对象
      },
    change(e) {
      this.$forceUpdate()
    },
    doctor:function (){
      this.$router.replace({path: '/doctor'});
    },
    user:function (){
      this.$router.replace({path: '/user'});
    },
    worker:function (){
      this.$router.replace({path: '/worker'});
    },
    submitReg(){
      let formData = new FormData();
      // 向 formData 对象中添加文件
      formData.append('qualification',this.qualification);
      axios({
        method: 'post',
        url: '/api/uploadImg',
        data:{qualification:formData,userid:this.userid},
//              data:{appkey: "njssdjtkj",sign:sign,sign_method:"MD5",timestamp:time,mobile:"15951971791",engine_no:"070939",plate_type:"02",plate_no:"苏EXW365"},
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      }).then(res=>{console.log(res.msg)});
      // request.post('/uploadImg',{qualification:formData,userid:this.userid}).then(res=>{console.log(res.msg)});
      if(this.password == this.confirm){request.post('/regDoctor',{
        username:this.username,password:this.password,phonenumber:this.phonenumber,userid:this.userid,hospitalname:this.hospital}).
      then(res=>{if(res.status!="success"){
        ElMessage(res.msg);
      }else {
        let formData = new FormData();
        // 向 formData 对象中添加文件
        formData.append('file',this.qualification);
        request.post('/uploadImg',{userid:this.userid,file:formData}).then(res=>{console.log(res.msg)});
        this.$router.replace({path: '/'});
        ElMessage("注册成功跳转至登录页面")
      }})
      }
      else {
        ElMessage("前后密码不一致，请检查");
      }
    }
  },
  components: { "form-input": async () => FormInput }
}
</script>
<style scoped>
.box-for-user {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 900px;
  width: 600px;
}
.image{
  height: 800px;
}
.div {
  margin-top: 10px;
  height: 30px;
  margin-left: 10px;
}
.form-input {
  margin-top: 10px;
  height: 50px;
  margin-left: 10px;
  margin-right: 20px;
}
</style>
