boss/components/drawer/freework_level.vue

<template>
    <el-drawer
      title="技术认证审核"
      size="80%"
      v-loading="loading"
      :visible.sync="drawer"
      @close="close"
      :wrapperClosable='true'
      :direction="direction">
      <div :style="`height: 100vh;opacity: `+opacity+`;overflow:scroll;margin-left:20px;margin-right:20px`">
        <el-row style="border-bottom: 1px solid red">
          <el-col :span="12">
            <div class="title">申请信息</div>
            <div>
              <span class="sub-title">认证费用：</span>
              <span class="i-content">
            <span>{{form.pay_money}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">付款日期：</span>
              <span class="i-content">
            <span>{{form.addtime}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">认证领域：</span>
              <span class="i-content">
            <span>{{form.occupation_name}}  / {{form.direction_name}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">认证等级：</span>
              <span class="i-content">
            <span>{{form.item_id}}
            <el-select  size="small" style="width:120px" v-model="form.confirm_item_id" placeholder="请选择用户最终的面试等级">
                <el-option
                  v-for="item in freeworklevel"
                  :key="item.item_id"
                  :label="item.name"
                  :value="item.item_id">
                </el-option>
              </el-select>
              <el-button  v-if="form.order_status==2 || form.order_status==3 || form.order_status==4 || form.order_status==5" @click="confirm_item_id"  size="small" type="success">确定</el-button>
            </span>
          </span>
            </div>
            <div>
              <span class="sub-title">面试时间：</span>
              <span class="i-content">
            <span><a :href="form.apply_info.url" target="_blank">{{form.memo}}</a></span>
          </span>
            </div>

            <div>
              <span class="sub-title">认证文件：</span>
              <span class="i-content">
            <span><a :href="form.apply_info.url" target="_blank">{{form.memo}}</a></span>
          </span>
            </div>

            <div>
              <span class="sub-title">审核日期：</span>
              <span class="i-content">
            <span><a :href="form.apply_info.url" target="_blank">{{form.checktime}}</a></span>
          </span>
            </div>

            <div>
              <span class="sub-title">审核人：</span>
              <span class="i-content">
            <span><a :href="form.apply_info.url" target="_blank">{{form.check_name}}</a></span>
          </span>
            </div>

          </el-col>

          <el-col :span="12">
            <div class="title">用户基本信息</div>
            <el-image style="width: 60px;height: 60px;border-radius: 50%;margin-left: 32px;" :src="form.apply_info.icon_url"></el-image>
            <div>
              <span class="sub-title">申请人昵称：</span>
              <span class="i-content">
            <span>{{form.apply_info.nickname}}({{form.uid}})</span>
          </span>
            </div>
            <div>
              <span class="sub-title">申请人真名：</span>
              <span class="i-content">
            <span>{{form.apply_info.realname}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">申请人手机：</span>
              <span class="i-content">
            <span>{{form.apply_info.login_mobile}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">申请人微信：</span>
              <span class="i-content">
            <span>{{form.apply_info.weixin}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">申请人主页：</span>
              <span class="i-content">
            <span><a :href="form.apply_info.url" target="_blank">{{form.apply_info.url}}</a></span>
          </span>
            </div>
          </el-col>
        </el-row>
        <el-row v-if="form.order_status==2 || form.order_status==3 || form.order_status==4 || form.order_status==5" style="border-bottom: 1px solid red;padding: 20px">
          <el-col :span="24">
            <el-input size="small" style="width: 220px"  v-model="form.interview_uid" placeholder="UID"></el-input>
            <el-button size="small" @click="appoint"  type="success">对接面试官</el-button>
            <el-button size="small" @click="refuse"  type="danger">拒绝申请</el-button>
            <el-button size="small" @click="end" type="success">完成审核</el-button>
          </el-col>
        </el-row>

        <el-row v-for="item in form.interview_list" style="border-bottom: 1px solid red;">
          <el-col :span="8">
            <div style="margin-top: 20px">
              <span class="sub-title">面试官工资：</span>
              <span class="i-content">
            <span>
              <el-input  size="small" v-model="item.pay_money" style="width:100px"  placeholder="面试官工资"></el-input>
              <el-button size="small"  @click="set_item(item)" v-if="form.order_status==2 || form.order_status==3 || form.order_status==4 || form.order_status==5" type="success">设置工资</el-button>
              <el-button size="small"  @click="pay(item)" v-if="form.order_status==7 && form.interview_status==1" type="success">结算工资</el-button>
               <el-button size="small" @click="del_invite(item)" v-if="form.order_status==2 || form.order_status==3 || form.order_status==4 || form.order_status==5" type="success">删除</el-button>
            </span>
          </span>
            </div>
            <div>
              <span class="sub-title">面试官昵称：</span>
              <span class="i-content">
            <span>{{item.userInfo.nickname}}({{item.userInfo.uid}})</span>
          </span>
            </div>
            <div>
              <span class="sub-title">面试官真名：</span>
              <span class="i-content">
            <span>{{item.userInfo.realname}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">面试官电话：</span>
              <span class="i-content">
            <span>{{item.userInfo.login_mobile}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">面试官主页：</span>
              <span class="i-content">
            <span><a :href="item.userInfo.url" target="_blank">{{item.userInfo.url}}</a></span>
          </span>
            </div>
            <div>
              <span class="sub-title">面试时间：</span>
              <span class="i-content">
                  <el-date-picker
                    v-model="item.interview_time"
                    size="small"
                    style="width:190px"
                    align="right"
                    value-format="yyyy-MM-dd HH:mm:ss"
                  type="datetime"
                  placeholder="选择日期"
                  :picker-options="pickerOptions">
                  </el-date-picker>
                <el-button size="small"  @click="set_item(item)" v-if="form.order_status==2 || form.order_status==3 || form.order_status==4 || form.order_status==5" type="success">设置</el-button>
                <el-button size="small"  @click="end_invite(item)" v-if="item.interview_status!=2" type="success">完成面试</el-button>
              </span>
            </div>
            <div>
              <span class="sub-title">面试录屏：</span>
              <span class="i-content">
              <span>
                 <upload_file style="padding: 20px"  @click="save_file" :id="item.id"  :fileList="item.fileList"></upload_file>
                 <a v-if="item.inter_video" target="_blank" :href="item.inter_video">浏览上传文件</a>
              </span>
          </span>
            </div>
          </el-col>
          <el-col :span="8" style="padding-right: 20px">
            <div class="title">面试官评价<span><a :href="item.invite_comment_url" style="color:#409EFF" target="_blank">（点击查看评价链接）</a></span></div>





            <div>
              <span class="sub-title">技术栈评分：</span>
              <span class="i-content">
                <span>{{item.dev_study?item.dev_study:"暂无"}}</span>
            </span>
            </div>
            <div>
              <span class="sub-title">项目能力评分：</span>
              <span class="i-content">
              <span>{{item.dev_skill_base?item.dev_skill_base:"暂无"}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">非技术能力评分：</span>
              <span class="i-content">
                <span>{{item.dev_experience?item.dev_experience:"暂无"}}</span>
             </span>
            </div>
            <div>
              <span class="sub-title">面试评价：</span>
              <span class="i-content"><span>{{item.dev_memo?item.dev_memo:"暂无"}}</span></span>
            </div>


          </el-col>
          <el-col :span="8">
            <div class="title">开发者评价<span><a :href="item.dev_comment_url" target="_blank" style="color:#409EFF" >（点击查看评价链接）</a></span></div>



            <div>
              <span class="sub-title">面试定级：</span>
              <span class="i-content"><span style="color: red">{{item.level?item.level:"暂无"}}</span></span>
            </div>
            <div>
              <span class="sub-title">面试水平：</span>
              <span class="i-content"><span>{{item.invite_experience?item.invite_experience:"暂无"}}</span></span>
            </div>
            <div>
              <span class="sub-title">技术专业度：</span>
              <span class="i-content">
            <span>{{item.invite_skill?item.invite_skill:"暂无"}}</span>
          </span>
            </div>
            <div>
              <span class="sub-title">面试评价：</span>
              <span class="i-content"><span>{{item.inter_memo?item.inter_memo:"暂无"}}</span></span>
            </div>

          </el-col>
        </el-row>


        <el-row style="border-bottom: 1px solid red;padding-bottom: 20px">
          <el-col :span="8">
            <div v-for="(item,index) in form.skill" style="margin-top: 20px">
              <span class="sub-title">{{item.skill_name}}：</span>
              <span class="i-content">
               <span>
                 {{item.skill_level}}分
              </span>
          </span>
            </div>

          </el-col>
        </el-row>
      </div>
    </el-drawer>
</template>


<script>
  import upload_file from "@/components/public/upload_file"
  export default {
    components: {
      upload_file
    },
    data() {
      return {
        loading:false,
        opacity:"0",
        // id:0,
        // drawer_state: false,
        direction: 'rtl',
        freeworklevel:[],
        form:{
          apply_info:{},
          interview_info:{},
          skill:[],
        }
      }
    },
    props: {
      'id': {
        type: Number,
      },
      'drawer': {
        type: Boolean,
      }
    },

    computed: {

    },
    watch: {
      'drawer': {
        handler: function () {
          this.$nextTick(() => {
            if(this.drawer)
            {
              this.get_freeworklevel();
              this.getDetail()
            }
          })
        }
      }
    },
    methods: {
      close() {
        this.$parent.getList();
        this.$parent.setDrawer(false);
      },
      async get_freeworklevel(){
        let res = await this.$post("/uapi/pub/freeworklevel");
        if (res && res.status === 1) {
          this.freeworklevel=res.data.list;
        }
      },
      async del_invite(item){
        var invite_id=item.id;
        let res = await this.$post("/uapi/cert/del_invite",{invite_id:invite_id,id:this.form.id});
        if (res && res.status === 1) {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          this.getDetail(this.form.id);
          this.$parent.getList();
        }
      },
      async end_invite(item){
        var invite_id=item.id;
        let res = await this.$post("/uapi/cert/end_invite",{invite_id:invite_id,id:this.form.id});
        if (res && res.status === 1) {
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
          this.getDetail(this.form.id);
          this.$parent.getList();
        }
      },
      async appoint(){
        let res = await this.$post("/uapi/cert/agree",{id:this.form.id,interview_uid:this.form.interview_uid});
        if (res && res.status === 1) {
          this.$message({
            type: 'success',
            message: '面试官对接成功!'
          });
          this.getDetail(this.form.id);
          this.$parent.getList();
        }
      },
      async confirm_item_id(){
        let res = await this.$post("/uapi/cert/confirm_item_id",{id:this.form.id,confirm_item_id:this.form.confirm_item_id});
        if (res && res.status === 1) {
          this.$message({
            type: 'success',
            message: '定级成功!'
          });
          this.$parent.getList();
        }
      },
      async end(){
        let res = await this.$post("/uapi/cert/end",{id:this.form.id});
        if (res && res.status === 1) {
          this.$message({
            type: 'success',
            message: '已完成审核'
          });
          this.getDetail(this.form.id);
          this.$parent.getList();
        }
      },
      async refuse(){
        let res = await this.$post("/uapi/cert/refuse",{id:this.form.id});
        if (res && res.status === 1) {
          this.$message({
            type: 'success',
            message: '拒绝成功，购买资金已经退回到申请人余额账户!'
          });
          this.getDetail(this.form.id);
          this.$parent.getList();
        }
      },
      async pay(item){
        var invite_id=item.id;
        let res = await this.$post("/uapi/cert/pay",{invite_id:invite_id,id:this.form.id});
        if (res && res.status === 1) {
          this.$message({
            type: 'success',
            message: '结算成功!'
          });
          this.getDetail(this.form.id);
          this.$parent.getList();
        }
      },
      async save_file(interview_id,file){//保存文件
        let item={};
        item.inter_video=file;
        item.id=interview_id;
        this.set_item(item);
        this.getDetail(this.form.id)
      },
      async set_item(item){
        let value=JSON.stringify(item);
        let data={item:value,order_id:this.form.id,interview_id:item.id}
        let res = await this.$post("/uapi/cert/cert.freework.level.interview.update",data);
        if (res && res.status === 1) this.$message({type: 'success', message: '设置成功!'});
        this.$parent.getList();
      },
      async getDetail(){
        this.opacity="0";
        this.loading=true;
        let id=this.id;
        if(!id) return false;
        let res = await this.$post("/uapi/cert/info_admin",{id:id});
        this.opacity="1";
        if (res && res.status === 1) {
          this.form=res.data;
        }
        this.loading=false;
      },
    }
  };
</script>

<style scoped>
.container{
  height: 100%;
}

.title {
  font-size: 18px;
  font-weight: 700;
  line-height: 64px;
}

.sub-title {
  font-size: 14px;
  font-weight: 700;
  line-height: 35px;
  padding-left: 32px;
}
.i-content{
  line-height: 25px;
}

.content {
  padding-left: 32px;
  font-size: 12px;
}
.i-head-content div{
  height: 22px;
}
.i-content{
  font-size: 12px;
}
</style>