xiaojincai
/
yrxinterview


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>面试题</title>
    <link rel="stylesheet" href="css/index.css">
    <script src="js/axios.min.js"></script>
    <script src="js/vue.js"></script>
</head>
<style>
    .record li{
        width: 95%;
        line-height: 30px;
        border-bottom: 1px solid #d9d9d9;
        padding-bottom: 20px;
        margin-top: 20px;
    }
    .record li span{
        color: #999;
        font-size: 12px;
    }
</style>
<body>
<section id="app">
    <div style="background-color: #FDC606;box-shadow: 0px 0px 4px 0 rgba(0,0,0,.5);">
        <header>
            <div class="left_nav">
                <img @click="show=!show" class="phone" width="30" src="img/menu.png" alt="">
                <a href="/index.html"><img class="logo" src="img/logo.png" alt="logo"></a>
            </div>
            <div class="nav">
                <a class="act" href="/index.html">主页</a>
                <a href="https://match.yuanrenxue.cn/" target="_blank">爬虫逆向比赛</a>
                <a href="https://match.yuanrenxue.cn/" target="_blank">采集进阶课程</a>
                <a href="https://tool.yuanrenxue.cn/" target="_blank">采集分析工具</a>
                <a href="https://appmatch.yuanrenxue.cn/" target="_blank">APP题目</a>
                <a href="https://www.yuanrenxue.cn/" target="_blank">关于猿人学</a>
            </div>
            <div class="login">
                <div class="pc">
                    <!-- <img width="30px" src="img/logo.jpg" alt="logo"> -->
                    <div v-if="userInfo" class="menu">
                        <span class="user_avatar">{{userInfo.name[0]}}</span>
                        {{userInfo.name}}
                        <ul>
                            <li><a href="/record.html">我的刷题记录</a></li>
                            <li @click="logout"><a>退出登录</a></li>
                        </ul>
                    </div>
                    <a v-else href="/login.html">请先登录</a>
                </div>
                <div class="phone">
                    <span v-if="userInfo">{{userInfo.name}}</span>
                    <a v-else href="/login.html">请先登录</a>
                </div>
            </div>
        </header>
    </div>
    <transition name="slide">
        <div class="slide" v-if="show">
            <a class="act" href="/index.html">主页</a>
            <a href="https://match.yuanrenxue.cn/" target="_blank">爬虫逆向比赛</a>
            <a href="https://match.yuanrenxue.cn/" target="_blank">采集进阶课程</a>
            <a href="https://tool.yuanrenxue.cn/" target="_blank">采集分析工具</a>
            <a href="https://appmatch.yuanrenxue.cn/" target="_blank">APP题目</a>
            <a href="https://www.yuanrenxue.cn/" target="_blank">关于猿人学</a>
            <a v-if="userInfo" href="/record.html">我的刷题记录</a>
            <a v-if="userInfo" @click="logout">退出登录</a>
        </div>
    </transition>
    <div class="content">
        <p class="navtation"><a href="/index.html">首页</a> - 刷题记录</p>
        <div class="left"  style="min-height: 68vh;">
            <div class="part">
                <p><b style="font-size: 15px;">{{userInfo.name}}</b>的面试刷题</p>
                <ul class="list record">
                    <li v-for="(item,i) in list"><a :href="'/detail.html?cat='+item.category+'&id='+item.interviewId">
                        {{i+1}}.{{item.name}} <br>
                        <span>{{item.ctime}}</span>
                    </a></li>
                </ul>
                <p class="page" v-show="pages>0">
                    <button :disabled="parm.page==1?'disabled':false" @click="parm.page--,getData()">上一页</button>
                    <span><b>{{parm.page}}</b>/{{pages}}</span>
                    <button :disabled="parm.page==pages?'disabled':false" @click="parm.page++,getData()">下一页</button>
                </p>
            </div>
        </div>
        <div class="right">
            <div class="part">
                <h2 class="sec_title"><span>贡献面试题</span></h2>
                <form class="form">
                    <input v-model="name" type="text" placeholder="面试题目">
                    <textarea v-model="content"></textarea>
                    <button type="button" @click="post">提交</button>
                </form>
            </div>
        </div>
    </div>
    <footer>
        <ul>
            <li>
                <b>爬虫比赛</b> <br>
                <a href="https://appmatch.yuanrenxue.cn/"  target="_blank">APP题目</a>
                <a href="https://match.yuanrenxue.cn/"  target="_blank">爬虫逆向比赛</a>
                <a href="https://tool.yuanrenxue.cn/"  target="_blank">采集分析工具</a>
            </li>
            <li>
                <b>爬虫课程</b> <br>
                <a href="https://shop45147253.m.youzan.com/wscgoods/detail/2okabph85ypv1?banner_id=f.86209928~goods.2~1~rVebiaQ5&alg_id=0&slg=0&components_style_layout=0&reft=1744878857227&spm=f.86209928&sf=wx_sm"  target="_blank">爬虫逆向进阶课</a>
                <a href="https://shop45147253.m.youzan.com/wscgoods/detail/2xli2kj7ku3a5zk?banner_id=f.86209928~goods.2~2~lWrtebiJ&alg_id=0&slg=0&components_style_layout=0&reft=1744878880491&spm=f.86209928&sf=wx_sm"  target="_blank">反爬&风控对抗课</a>
                <a href="https://shop45147253.m.youzan.com/wscgoods/detail/361rmliyhfwr184?banner_id=f.86209928~goods.2~3~25r4gDL2&alg_id=0&slg=0&components_style_layout=0&reft=1744878921640&spm=f.86209928&sf=wx_sm"  target="_blank">0基础+爬虫逆向课</a>
            </li>
            <li>
                <b>关于猿人学</b> <br>
                <a href="https://www.yuanrenxue.cn/tricks"  target="_blank">Python技术杂谈</a>
                <a href="https://www.yuanrenxue.cn/earn-money"  target="_blank">Python爬虫挣钱</a>
            </li>
            <li class="contact" style="display: flex;line-height: 30px;">
                <img style="margin-right: 10px;" width="100" height="100" src="img/wx.jpg" alt="">
                扫一扫加我微信 <br>
                备注面试题 <br>
                拉你进面试交流群
            </li>
        </ul>
        <p>成都老猿智能科技有限公司Copyright @ 2025 猿人学面试 蜀ICP备2022000052号-2</p>
    </footer>
</section>
<script src="js/public.js"></script>
<script>
    const { createApp } = Vue;
    createApp({
        data() {
            return {
                list:[],
                parm:{
                    cid:'',
                    page:1,
                    page_size:20
                },
                total:0,
                name: '',
                content: '',
                userInfo:{},
                show: 0 // 添加 show 变量
            }
        },
        computed:{
            pages(){
                return Math.ceil(this.total/20);
            }
        },
        created(){
            // 获取本地存储的用户ID并赋值给cid
            const userInfo = JSON.parse(localStorage.getItem('userInfo'));
            if (!userInfo) {
                window.location.href = 'login.html';
            }
            this.userInfo = userInfo;
            this.parm.cid = userInfo ? userInfo.id : '';
            const curCid = new URLSearchParams(window.location.search).get('cid');
            if(curCid){
                this.parm.cid = curCid;
            }
            this.getData();
        },
        methods:{
            getData(){
                // 列表
                axios.get(url+'/api/yrx/que/user/records', { params: this.parm }).then(res=>{
                    this.list = res.data.data.list;
                    this.total = res.data.data.total;
                })
            },
            post(){ // 添加post方法
                if (!this.name || !this.content) {
                    alert('面试题目和内容不能为空');
                    return;
                }
                const token = localStorage.getItem('token'); // 获取token
                axios.post(url+'/api/yrx/que/user/post', { name: this.name, content: this.content }, {
                    headers: {
                        'Authorization': `${token}` // 添加token到header
                    }
                })
                .then(res => {
                    if(res.data.code === 0){
                        alert('提交成功');
                        this.name = '';
                        this.content = '';
                    }
                })
                .catch(err => {
                    alert('提交失败，请重试');
                    console.error(err);
                });
            },
            logout() { // 添加 logout 方法
                localStorage.removeItem('userInfo');
                localStorage.removeItem('token');
                this.userInfo = null;
            }
        }
    }).mount('#app');
</script>
</body>
</html>