boss/components/drawer/freework_level.vue

<template>
<el-drawer title="技术认证审核" size="80%" v-loading="loading" :visible.sync="drawer" :wrapper-closable="true" @close="close" :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>{{form.memo}}</span>
                    </span>
                </div> -->

                <div>
                    <span class="sub-title">认证文件：</span>
                    <span class="i-content">
                        <span><a style="margin-right: 15px" v-for="(item, index) in form.file" :href="item" target="_blank">文件{{index+1}}</a></span>
                    </span>
                </div>

                 <div>
                    <span class="sub-title">薪资现状：</span>
                    <span class="i-content">
                        <span>{{form.extend_memo? form.extend_memo.now_money:'' }}</span>
                    </span>
                </div>

                <div>
                    <span class="sub-title">面试时间\其他补充：</span>
                    <span class="i-content">
                        <span>{{form.extend_memo? form.extend_memo.memo:''}}</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><span class="ma-copy" @click="copy(item.invite_comment_url)">复制</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>

                <div>
                    <span class="sub-title">面试定级：</span>
                    <span class="i-content"><span style="color: red">{{item.level?item.level:"暂无"}}</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><span class="ma-copy" @click="copy(item.dev_comment_url)">复制</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(true);
            }
        },
        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(true);
            }
        },
        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(true);
            }
        },
        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(true);
            }
        },
        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(true);
            }
        },
        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(true);
            }
        },
        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(true);
            }
        },
        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(true);
        },
        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;
        },
        copy(text){
          if (navigator.clipboard) {
              navigator.clipboard.writeText(text);
          } else {
              var textarea = document.createElement('textarea');
              document.body.appendChild(textarea);
              // 隐藏此输入框
              textarea.style.position = 'fixed';
              textarea.style.clip = 'rect(0 0 0 0)';
              textarea.style.top = '10px';
              // 赋值
              textarea.value = text;
              // 选中
              textarea.select();
              // 复制
              document.execCommand('copy', true);
              // 移除输入框
              document.body.removeChild(textarea);
          }
          this.$message.success("复制成功")
        }
    }
};
</script>

<style scoped>
.el-dialog__wrapper {
    overflow: hidden;
}

.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;
}
.ma-copy{
  cursor: pointer;
}
</style>