<template>
    <div class="trainpage">
        <!-- <div class="ijaiorenwu" @click="openSubmit">
            <img class="ijaoricon" src="/assets/home/fbrwicon.png" alt="" />
            <div>校企合作培训班报名入口</div>
        </div> -->
        <!-- <div class="ijaiorenwu22">
            <div class="ijaiorenwu22it" @click="pcBaoming">可靠性人才评测班报名</div>
            <div class="ijaiorenwu22it ijaiorenwu22itb" @click="pcBaoming">线下进阶培训班报名</div>
            <div class="ijaiorenwu22it ijaiorenwu22itb" @click="openSubmit">校企合作培训班报名</div>
        </div> -->
        <div class="ijaiorenwu22">
            <div class="ijaiorenwu22it">
                <a href="#kekaoxing">可靠性人才评测班报名</a>
            </div>
            <div class="ijaiorenwu22it ijaiorenwu22itb">
                <a href="#unline">线下进阶培训班报名</a>
            </div>
            <div class="ijaiorenwu22it ijaiorenwu22itb">
                <a href="#schhol">校企合作培训班报名</a>
            </div>
        </div>
        <div class="zxzx" @click="zixunClick">报名咨询</div>
        <!-- 背景图 -->
        <el-carousel :interval="3000" arrow="never" height="450px" class="wheelplanting" trigger="click">
            <el-carousel-item v-for="item in indexbanner" :key="item.imgurl">
                <img
                    ref="bannerHeight"
                    :src="item.imgurl"
                    alt=""
                    style="width: 100%; height: 450px; object-fit: cover; cursor: pointer"
                />
            </el-carousel-item>
        </el-carousel>
        <!-- <img src="/assets/newtrain/peixun2.png" class="bannertop" alt="" /> -->
        <!-- 模块1-软件可靠性 -->
        <div class="model1 container">
            <div class="model_title">
                <div class="model_title_top">
                    <img src="/assets/homepage/rihhj.png" alt="" />
                    <p>四大培训方向+就业 一站式服务</p>
                    <img src="/assets/homepage/lesftt.png" alt="" />
                </div>
                <div class="model_title_text">培养专业测试专项人才</div>
            </div>
            <div class="moedel1_content">
                <div class="moedel1_contentitem" @click="openModel3(it)" v-for="it in model1Data" :key="it.img">
                    <img class="moedel1_contentitem_arrow" src="/assets/train/downarrow.png" alt="" />
                    <div class="moedel1_contentitem_imgbox">
                        <img class="moedel1_contentitem_img" :src="it.img" alt="" />
                    </div>
                    <div class="moedel1_contentitem_text">
                        <div class="moedel1_contentitem_text1">{{ it.title }}</div>
                        <div class="moedel1_contentitem_text2">
                            {{ it.con }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 模块3-课程计划 -->
        <div class="model3 container" v-show="isShowModel3">
            <div class="model_title">
                <div class="model_title_top">
                    <img src="/assets/homepage/rihhj.png" alt="" />
                    <p>课程计划</p>
                    <img src="/assets/homepage/lesftt.png" alt="" />
                </div>
                <div class="model_title_text">针对企业用人需求进行课程培训</div>
            </div>
            <div class="moedel3_content">
                <div class="moedel3_content_r">
                    <!-- 表头 -->
                    <div class="moedel3_content_r_griditem moedel3_content_r_griditemtop">序号</div>
                    <div class="moedel3_content_r_griditem moedel3_content_r_griditemtop moedel3_content_r_griditemmi">
                        课程名称
                    </div>
                    <div class="moedel3_content_r_griditem moedel3_content_r_griditemtop">课时</div>
                    <!-- 表格内容 -->
                    <template v-for="(it, index) in model34Data">
                        <div class="moedel3_content_r_griditem">{{ index + 1 }}</div>
                        <div class="moedel3_content_r_griditem moedel3_content_r_griditemmi">
                            {{ it.con }}
                        </div>
                        <div class="moedel3_content_r_griditem">{{ it.num }}</div>
                    </template>
                </div>
            </div>
            <!-- 掌握的测试技能 -->
            <div class="model3_skill_title">
                <div class="model_title_top2">
                    <img src="/assets/train/linexie.png" alt="" />
                    <p>掌握的测试技能</p>
                    <img src="/assets/train/linexie.png" alt="" />
                </div>
            </div>
            <div class="model3_skill_itembox">
                <div class="model3_skill_item" v-for="it in model32Data" :key="it.img">
                    <img class="model3_skill_item_img" :src="it.img" alt="" />
                    <div class="model3_skill_item_text">{{ it.title }}</div>
                </div>
            </div>
            <!-- 企业机会 -->
            <div class="model3_skill_title">
                <div class="model_title_top2">
                    <img src="/assets/train/linexie.png" alt="" />
                    <p>企业机会</p>
                    <img src="/assets/train/linexie.png" alt="" />
                </div>
            </div>
            <div class="model32_skill_itembox">
                <div class="model32_skill_item" v-for="it in model33Data" :key="it">
                    <img class="model32_skill_item_img" :src="it" alt="" />
                </div>
            </div>

            <!-- 收起标志 -->
            <div class="flagUp">
                <img class="flagUp_img" @click="closeModel3" src="/assets/train/downarrow.png" alt="" />
            </div>
        </div>
        <!-- 新增模块--可靠性人才培训班 -->

        <div class="newmodel1" id="kekaoxing">
            <div class="container">
                <div class="model_title">
                    <div class="model_title_top">
                        <img src="/assets/homepage/rihhj.png" alt="" />
                        <p>可靠性人才评测班</p>
                        <img src="/assets/homepage/lesftt.png" alt="" />
                    </div>
                    <div class="model_title_text">专业评测安全测试人才</div>
                </div>
                <div class="newmodel1Con">
                    <div class="newmodel1Conl">
                        <div class="newmodel1Conlt1">{{ activezcList.tiaojian }}</div>
                        <div class="newmodel1Conlc1">
                            <div v-for="(it, index) in activezcList.skill.split('&')" :key="index">
                                {{ it }}
                            </div>
                        </div>

                        <div class="newmodel1Conlt1" style="margin-top: 10px">评测内容</div>
                        <div class="newmodel1Conlc1">
                            <div v-for="(it, index) in activezcList.content.split('&')" :key="index">
                                {{ it }}
                            </div>
                        </div>
                    </div>
                    <div class="newmodel1Conr">
                        <div class="newmodel1Conrt">
                            <img src="/assets/newtrain/kkxtime.png" alt="" />
                            每月线上定时开班
                        </div>
                        <div class="newmodel1Conrc">
                            <div
                                @click="rowClick(it)"
                                class="newmodel1Conrcitem"
                                v-for="it in topClassList"
                                :key="it.classId"
                                style="cursor: pointer"
                            >
                                <div class="newmodel1Conrcitem1">
                                    {{ it.registrationEndTime.slice(0, 4) }}年{{ it.registrationEndTime.slice(6, 7) }}月
                                </div>
                                <div class="newmodel1Conrcitem1">
                                    {{ it.className }}({{
                                        it.classLevel == 0 ? '初级' : it.classLevel == 1 ? '中级' : '高级'
                                    }})
                                </div>
                                <div class="newmodel1Conrcitem3right" @click="pcBaoming(it)" v-if="it.status == 2">
                                    <img src="/assets/newtrain/hoticon.png" alt="" />
                                    <div class="newmodel1Conrcitem4">报名进行中</div>
                                </div>
                                <div class="newmodel1Conrcitem3right" v-else-if="it.status == 1">
                                    <div class="newmodel1Conrcitem3">即将开放报名</div>
                                </div>
                                <div class="newmodel1Conrcitem3right" v-else>
                                    <div class="newmodel1Conrcitem5">报名已结束</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="model_title_top2" style="margin: 40px 0">
                    <img src="/assets/train/linexie.png" alt="" />
                    <p>专家级讲师亲授</p>
                    <img src="/assets/train/linexie.png" alt="" />
                </div>
                <div class="zhuanjiabox">
                    <div
                        @mouseenter="mouseenterFn(index)"
                        :class="{ zhuanjiaboxitemac: activeVal == index }"
                        class="zhuanjiaboxitem"
                        v-for="(it, index) in zhuanjiaList.slice(0,3)"
                        :key="index"
                    >
                        <div class="zhuanjiaboxitemlittleP">
                            <img :src="it.img" alt="" />
                            <div class="zhuanjiaboxitemlittlePname">{{ it.name }}</div>
                            <div class="zhuanjiaboxitemlittlePzc">{{ it.zw }}</div>
                        </div>
                        <div class="zhujialine"></div>
                        <div class="zhuanjiaboxitemlittleC">
                            <div class="zhuanjiaboxitemlittleCzc">职称：{{ it.zc }}</div>
                            <div class="zhuanjiaboxitemlittleCbox"></div>
                            <div class="zhuanjiaboxitemlittleCc">
                                {{ it.content }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 模块10工信部颁发证书 -->
        <div class="model10" id="unline">
            <div class="container">
                <div class="model_title">
                    <div class="model_title_top">
                        <img src="/assets/homepage/rihhj.png" alt="" />
                        <p>线下培训进阶班，高效助力就业</p>
                        <img src="/assets/homepage/lesftt.png" alt="" />
                    </div>
                    <div class="model_title_text">专门针对1-3年工作经验的测试人才，系统进阶提升</div>
                </div>
                <div class="unlineCon1">
                    <div
                        :style="{ border: `1px solid ${it.color}` }"
                        class="unlineCon1item"
                        v-for="it in unlineData"
                        :key="it.color"
                    >
                        <div class="unlineCon1itemt">
                            <div class="cricle" :style="{ border: `2px solid ${it.color}` }"></div>
                            {{ it.title }}
                        </div>
                        <div class="unlineCon1itemc">
                            <div class="unlineCon1itemclist" v-for="item in it.list" :key="item">*{{ item }}</div>
                        </div>
                    </div>
                </div>
                <div class="unlineCon2">
                    <div class="unlineCon2t">
                        <img src="/assets/newtrain/unlineclass.png" alt="" />
                        【线下班名额有限，先到先得】
                    </div>
                    <div class="newmodel1Conrc" style="height: 200px">
                        <div class="newmodel1Conrcitem" v-for="it in bottomClassList" :key="it.classId">
                            <div class="newmodel1Conrcitem1">
                                {{ it.registrationEndTime.slice(0, 4) }}年{{ it.registrationEndTime.slice(6, 7) }}月
                            </div>
                            <div class="newmodel1Conrcitem1">
                                {{ it.className }}({{
                                    it.classLevel == 0 ? '初级' : it.classLevel == 1 ? '中级' : '高级'
                                }})
                            </div>
                            <div class="newmodel1Conrcitem3right" @click="pcBaoming(it)" v-if="it.status == 2">
                                <img src="/assets/newtrain/hoticon.png" alt="" />
                                <div class="newmodel1Conrcitem4">报名进行中</div>
                            </div>
                            <div class="newmodel1Conrcitem3right" v-else-if="it.status == 1">
                                <div class="newmodel1Conrcitem3">即将开放报名</div>
                            </div>
                            <div class="newmodel1Conrcitem3right" v-else>
                                <div class="newmodel1Conrcitem5">报名已结束</div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="model_title">
                    <div class="model_title_top">
                        <img src="/assets/homepage/rihhj.png" alt="" />
                        <p>工信部颁发证书</p>
                        <img src="/assets/homepage/lesftt.png" alt="" />
                    </div>
                    <div class="model_title_text">所学技术实际应用率高，证书含金量高</div>
                </div>
                <div class="model10Con">
                    <div class="model10Con_item" v-for="it in model10Data" :key="it.id">
                        <img class="model10Con_item_img" :src="it.img" alt="" />
                        <div class="model10Con_item_mask">
                            <div class="context">
                                {{ it.con }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 模块5-校企合作创新 -->
        <div class="model5" id="schhol">
            <div class="contanerbox container">
                <div class="model_title">
                    <div class="model_title_top">
                        <img src="/assets/homepage/rihhj.png" alt="" />
                        <p>校企合作培训</p>
                        <img src="/assets/homepage/lesftt.png" alt="" />
                    </div>
                    <div class="model_title_text">促进学生在校理论学习，增加就业机会</div>
                </div>
                <div class="moedel5_content">
                    <!-- <div class="moedel5_content_tag">
                        <div
                            class="moedel5_content_tag_item"
                            :class="{ moedel5_content_tag_itemactive: it.id == activeModel2.id }"
                            v-for="it in model2Data.slice(0, 6)"
                            :key="it.img"
                            @click="modelSchool(it)"
                        >
                            {{ it.title }}
                        </div>
                    </div> -->
                    <div class="moedel5_content_con">
                        <div class="moedel5_content_con_l">
                            <img :src="activeModel2.img" class="moedel5_content_con_limg" />
                            <div class="moedel5_content_con_lcon">
                                {{ activeModel2.con }}
                            </div>
                        </div>
                        <div class="moedel5_content_con_r">
                            <div class="moedel5_content_con_r_title">
                                <div class="moedel5_content_con_r_titleline"></div>
                                报名条件
                            </div>
                            <div class="moedel5_content_con_r_con">
                                {{ activeModel2.bmtj }}
                            </div>
                            <div class="moedel5_content_con_r_title">
                                <div class="moedel5_content_con_r_titleline"></div>
                                培训内容
                            </div>
                            <div class="moedel5_content_con_r_con">
                                {{ activeModel2.pxnr }}
                            </div>
                            <div class="moedel5_content_con_r_title">
                                <div class="moedel5_content_con_r_titleline"></div>
                                经考核合格后收获
                            </div>
                            <div class="moedel5_content_con_r_con">{{ activeModel2.sh }}</div>
                            <div class="moedel5_content_con_r_con">{{ activeModel2.sh1 }}</div>
                            <div class="moedel5_content_con_r_con">{{ activeModel2.sh2 }}</div>
                            <div class="moedel5_content_con_r_con">{{ activeModel2.sh3 }}</div>
                            <div class="moedel5_content_con_r_btn" @click="openSubmit">报名入口</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 弹层 -->
        <div class="maskdialogS" v-if="isshowSubmitDialog">
            <div class="maskdialogSClose" @click="coloeDialog">×</div>
            <div class="maskdialogSTitle">校企合作创新班</div>
            <div class="maskdialogSContent">
                <el-form ref="form" :model="form" :rules="rules" label-width="35px">
                    <el-form-item label="" prop="trainClassCode">
                        <div class="rowboxi">
                            <span class="rowboxis">*</span>
                            <el-input v-model="form.trainClassCode" placeholder="请输入培训班代号"></el-input>
                        </div>
                    </el-form-item>
                    <div v-if="calltext" class="infoadad" style="color: #e9941aff">{{ calltext }}</div>
                    <div v-else class="infoadad">培训班代号由校企合作老师统一发送，请联系培训老师</div>
                    <el-form-item label="" prop="homeCollege">
                        <div class="rowboxi">
                            <span class="rowboxis">*</span>
                            <el-input v-model="form.homeCollege" placeholder="请输入您的学院名称"></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="" prop="majorName">
                        <div class="rowboxi">
                            <span class="rowboxis">*</span>
                            <el-input v-model="form.majorName" placeholder="请输入您的专业名称"></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="" prop="studentName">
                        <div class="rowboxi">
                            <span class="rowboxis">*</span>
                            <el-input v-model="form.studentName" placeholder="请输入您的姓名"></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="">
                        <div class="rowboxi">
                            <span class="rowboxis"></span>
                            <el-input v-model="form.studentCode" placeholder="请输入您的学号"></el-input>
                        </div>
                    </el-form-item>
                </el-form>
            </div>
            <div class="rowitembtn" @click="subobtain">提交报名</div>
        </div>

        <!-- 评测弹层 -->
        <div class="maskdialogS maskdialogS1" v-if="isPcshow">
            <div class="maskdialogSClose" @click="coloeDialog1">×</div>
            <div class="maskdialogSTitle">报名</div>
            <div class="maskdialogSContent">
                <el-form ref="formjj1" :model="formjj" :rules="rulesjj" label-width="35px">
                    <el-form-item label="" prop="studentName">
                        <div class="rowboxi">
                            <span class="rowboxis">*</span>
                            <el-input v-model="formjj.studentName" placeholder="请输入您的姓名"></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="" prop="mobile">
                        <div class="rowboxi">
                            <span class="rowboxis">*</span>
                            <el-input v-model="formjj.mobile" placeholder="请输入您的手机号"></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item label="" prop="code" v-if="!userinform.userId">
                        <div class="rowboxi">
                            <span class="rowboxis">*</span>
                            <el-input
                                style="width: 390px; margin-right: 10px"
                                v-model="formjj.code"
                                placeholder="请输入验证码"
                            ></el-input>
                            <el-button @click="sendCode" :disabled="isSending || countdown > 0">
                                {{ isSending ? '发送中...' : countdown > 0 ? `${countdown}秒后重试` : '发送验证码' }}
                            </el-button>
                        </div>
                    </el-form-item>
                </el-form>
            </div>
            <div class="rowitembtn" @click="pcbaomingFn">提交报名</div>
        </div>
    </div>
</template>
<script>
import { postBaoming, postBaomingNoToken, getSignUpList, getClassList } from '@/api/train/index.js'
import { mapGetters } from 'vuex'
import { getCodeUserLogin } from '@/api/system/login'
export default {
    data() {
        // 自定义校验规则
        var validateId = (rule, value, callback) => {
            getSignUpList({ trainClassCode: value }).then((res) => {
                if (res.total == 1) {
                    let schooldata = res.rows[0]
                    this.calltext = schooldata.schoolName + '-' + schooldata.trainClassName
                    // console.log('calltext',calltext)
                    // callback(calltext)
                    callback()
                } else {
                    this.calltext = ''
                    callback(new Error('代号不存在，请线下联系培训老师'))
                }
            })
        }
        var checkPhone = (rule, value, callback) => {
            if (!/^1[34578]\d{9}$/.test(value)) {
                callback(new Error('请输入正确的手机号码!'))
            } else {
                callback()
            }
        }

        return {
            activeVal: 0,
            calltext: '',
            isshowSubmitDialog: false,
            unlineData: [
                {
                    color: '#0066EB',
                    title: '入学阶段',
                    list: ['确定就业目标', '制定学习计划'],
                },
                {
                    color: '#FB9423',
                    title: '学习阶段',
                    list: ['大牛亲自带队', '名企驻场项目实战'],
                },
                {
                    color: '#11A9CB',
                    title: '实训阶段',
                    list: ['独立项目研发', '团队项目研发', '作品合集整理'],
                },
                {
                    color: '#8541F6',
                    title: '就业阶段',
                    list: ['关键科技内部优推', '名企岗位推荐', '云平台灵活就业'],
                },
                {
                    color: '#FE2020',
                    title: '发展阶段',
                    list: ['终身人才服务', '终身就业指导'],
                },
            ],
            model1Data: [
                {
                    id: 1,
                    img: '/assets/newtrain/model1_1.png',
                    title: '单元测试工程师',
                    con: '负责对软件单元以及单元之间的功能、接口、数据结构和逻辑等进行动态测试',
                },
                {
                    id: 2,
                    img: '/assets/newtrain/model1_2.png',
                    title: '配置项测试工程师',
                    con: '负责对独立软件配置项的功能、性能和接口等各项需求进行动态测试',
                },
                {
                    id: 3,
                    img: '/assets/newtrain/model1_3.png',
                    title: '安全性测试工程师',
                    con: '负责对软件（系统）功能和信息安全性进行测试，包括故障处理模式、异常事件容错、信息保密与防护等',
                },
                {
                    id: 4,
                    img: '/assets/newtrain/model1_4.png',
                    title: 'FPGA测试工程师',
                    con: '负责对完整集成的软硬件系统的任务能力、功能、性能和接口等各项需求进行动态测试',
                },
            ],
            model2Data: [
                {
                    id: 1,
                    img: '/assets/newtrain/model2_1.png',
                    title: '西安科技大学',
                    con: '2023年11月15日上午，智能软件测试协同创新实验室成立仪式在西安科技大学计算机学院隆重举行，该实验室由北京关键科技股份有限公司与西安科技大学共同成立。关键科技董事长焦华春女士、总经理张怀珠、总经理助理牛中东、工业和信息化部人才交流中心人才发展处程宇处长、西安科技大学副校长黄英维等领导和嘉宾出席会议。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 2,
                    img: '/assets/newtrain/model2_2.png',
                    title: '重庆工程学院',
                    con: '      2023年12月21日上午，软件测试创新中心成立仪式暨软件可靠性测试创新班开班仪式在重庆工程学院行政楼隆重举行，该创新中心在工业和信息化部人才交流中心指导下，由北京关键科技股份有限公司与重庆工程学院共同成立。工业和信息化部人才交流中心人才发展处副处长唐林、人才发展处干部慕雅竹，重庆工程学院党委副书记常务副校长张业平,关键科技董事长焦华春、总经理张怀珠、副总经理郭克成、总经理助理校企合作负责人牛中东等领导和嘉宾出席会议。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 3,
                    img: '/assets/newtrain/model2_3.png',
                    title: '阜阳师范大学',
                    con: ' 2024年1月17日上午，阜阳师范大学计算机与信息工程学院与北京关键科技股份有限公司共建“信创测试实验室”揭牌仪式在阜师大西湖校区举行，标志着北京关键科技与阜师大校企合作模式的开启。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 4,
                    img: '/assets/newtrain/model2_4.png',
                    title: '淮南师范学院',
                    con: '2024年1月18日，关键科技公司董事长焦华春、副总经理郭克成等一行人前往淮南师范学院电子工程学院举行“新能源汽车软件测试实验室” 签约授牌仪式。淮南师范学院教务处处长鲁先文、计算机学院院长陈磊、机械与电气工程学院院长伍龙与电子工程学院党委书记岳德良、院长余海军、党委副书记、纪委书记匡熠、工科系主任参加了校企合作洽谈。  ',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 5,
                    img: '/assets/newtrain/model2_5.png',
                    title: '安徽理工大学',
                    con: ' 2024年1月19日，关键科技公司副总经理郭克成一行人率队前往安徽理工大学计算机科学与工程学院举行“可信软件测试与安全实验室”签约授牌仪式。安理工计算机科学与工程学院院长方贤进、副院长徐辉、软件工程系主任夏晨星、计算机科学与技术系副主任杨高明以及部分在校本科生、研究生参加会议。 ',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 6,
                    img: '/assets/newtrain/model2_6.png',
                    title: '河南科技大学',
                    con: '2014年1月25日，北京关键科技股份有限公司与河南科技大学软件学院举行了“教学实习基地”授牌仪式。河南科技大学软件学院院长孙士保、产教融合办公室主任裴亚辉、就业科长徐慧、实验室主任张虎，关键科技董事长焦华春、总经理张怀珠、校企合作负责人牛中东出席了签约与授牌仪式。仪式由河南科技大学软件学院就业科科长许慧主持。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 7,
                    img: '/assets/newtrain/model2_6.png',
                    title: '安徽师范大学',
                    con: '2024年3月20日，安徽师范大学计算机与信息学院和北京关键科技股份有限公司举行战略合作洽谈会，共同研究推进校企合作高质量发展、助力软件测试行业生态建设。北京关键科技副总经理郭克成、总经理助理牛中东等同志，计算机与信息学院党委书记袁兴龙、院长罗永龙、副院长接标、副书记张园园等领导参加洽谈会。会议由学院软件工程系主任郭良敏主持。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 8,
                    img: '/assets/newtrain/model2_6.png',
                    title: '安徽工程大学',
                    con: ' 2024年3月19日，安徽工程大学和北京关键科技股份有限公司举行战略合作洽谈会，共同研究推进校企合作高质量发展、助力软件测试行业生态建设。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 9,
                    img: '/assets/newtrain/model2_6.png',
                    title: '重庆邮电大学',
                    con: '  2024年3月28日，北京关键科技股份有限公司郭克成、牛中东拜访重庆邮电大学，与重庆邮电大学张力生副院长、吴朝峰实验中心副主任，洽谈关于4月份软件开发综合实训内容，最终达成合作意向。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 10,
                    img: '/assets/newtrain/model2_6.png',
                    title: '辽宁工业大学',
                    con: ' 2024年3月14日，辽宁工业大学和北京关键科技股份有限公司举行战略合作洽谈会，共同研究推进校企合作高质量发展、助力软件测试行业生态建设。北京关键科技总经理张元军、副总经理郭克成，辽工大电子与信息工程学院张兴副院长、褚治广领导参加洽谈会。',
                    bmtj: '计算机科学、软件工程、信息技术等相关专业的学生，或者对软件测试感兴趣并希望在这个领域发展的学生。',
                    pxnr: '单元测试、配置项测试、安全性测试、可编程逻辑器件测试课程学习。',
                    sh: '1.进入北京关键科技股份有限公司人才库且获得工业和信息化人才岗位能力评价证书。',
                    sh1: '2.考核成绩优秀者可推荐进入北京关键科技股份有限公司或者合作单位实习。',
                    sh2: '3.可以在北京关键科技股份有限公司的关键测试宝平台承接测试任务。',
                    sh3: '4.可以去学校配合讲师当助教，进一步加强自身学习。',
                },
                {
                    id: 7,
                    img: '/assets/newtrain/model2_7.png',
                    title: '创新班开课',
                },
                {
                    id: 8,
                    img: '/assets/newtrain/model2_8.png',
                    title: '项目实操',
                },
            ],
            activeModel2: {
                // id: 1,
                // img: '/assets/newtrain/model2_1.png',
                // title: '西安科技大学',
                // con: '      11月15日上午，智能软件测试协同创新实验室成立仪式在西安科技大学计算机学院隆重举行，该实验室由北京关键科技股份有',
                // bmtj: '西安科技大学计算机学院在读学生，热爱计算机、向往软件测试技术的同学均可报名（软件工程专业优先）。',
                // pxnr: '学员将参加静态测试、单元测试、配置项测试、测试管理等课程学习。（注：详见课程计划，不占用正常上课时间，学员不需要承担任何费用.',
                // sh: '1.进入北京关键科技股份有限公司测试人才库且获得创新实验室颁发的培训证书。 2.在校期间获得带薪实习机会，丰富真实项目开发履历',
            },
            isShowModel3: false,
            model3Data: ['单元测试', '配置项测试', '测试管理', '更多课程'],
            model3Active: '单元测试',
            model32Data: [
                {
                    id: 1,
                    img: '/assets/newtrain/model4_1.png',
                    title: '静态测试',
                },
                {
                    id: 2,
                    img: '/assets/newtrain/model4_2.png',
                    title: '单元测试',
                },
                {
                    id: 3,
                    img: '/assets/newtrain/model4_3.png',
                    title: '配置项测试',
                },
                {
                    id: 4,
                    img: '/assets/newtrain/model4_4.png',
                    title: '系统测试',
                },
                {
                    id: 5,
                    img: '/assets/newtrain/model4_5.png',
                    title: '功能测试',
                },
                {
                    id: 6,
                    img: '/assets/newtrain/model4_6.png',
                    title: '性能测试',
                },
                {
                    id: 7,
                    img: '/assets/newtrain/model4_7.png',
                    title: '接口测试',
                },
                {
                    id: 8,
                    img: '/assets/newtrain/model4_8.png',
                    title: '安全测试',
                },
                {
                    id: 9,
                    img: '/assets/newtrain/model4_9.png',
                    title: '器件测试',
                },
            ],
            model33Data: [
                '/assets/ability/pater1.png',
                '/assets/ability/pater2.png',
                '/assets/ability/pater3.png',
                '/assets/ability/pater4.png',
                '/assets/ability/pater5.png',
                '/assets/ability/pater6.png',
                '/assets/ability/pater7.png',
                '/assets/ability/pater8.png',
            ],
            model34Data: [
                {
                    con: '什么是单元测试，单元测试内容',
                    num: '1课时',
                },
                {
                    con: '典型单元测试流程典型单元测试流程典型单元测试流程典型单元测试流程',
                    num: '1课时',
                },
                {
                    con: '单元测试依据的标准介绍',
                    num: '1课时',
                },
                {
                    con: '单元测试的测试类型单元测试的测试类型单元测试的测试类型单元测试的测试类型',
                    num: '1课时',
                },
                {
                    con: '单元测试工具介绍',
                    num: '1课时',
                },

                {
                    con: '单元测试用例如何编写，单元测试总结及评审',
                    num: '1课时',
                },
            ],
            model4Data: ['单元测试', '配置项测试', '接口测试', '安全性测试', '性能测试', '其他课程'],
            model7Data: [
                {
                    id: 1,
                    img: '/assets/newtrain/model8_1.png',
                    title: '精品课程',
                    con: '理论＋实际， 持续更新最前沿实用技术',
                },
                {
                    id: 2,
                    img: '/assets/newtrain/model8_2.png',
                    title: '专家讲师',
                    con: '一线工程师＋项目负责人 ＋领域专家 ',
                },
                {
                    id: 3,
                    img: '/assets/newtrain/model8_3.png',
                    title: '线下课程',
                    con: '专家线下授课 一线工程师手把手项目实操',
                },
                {
                    id: 4,
                    img: '/assets/newtrain/model8_4.png',
                    title: '技术认证',
                    con: '国家工信部人才交流中心 可靠性测试领域唯一合作伙伴',
                },
                {
                    id: 5,
                    img: '/assets/newtrain/model8_5.png',
                    title: '多元就业',
                    con: '关键科技内聘，客户企业推荐 云测平台灵活就业，自主择业 ',
                },
            ],
            model9Data: [
                {
                    id: 1,
                    img: '/assets/newtrain/model10_1.png',
                    title: '发展方向广',
                    con: '各行各业都需要，尤其是 互联网、军工、能源、汽车 ',
                },
                {
                    id: 2,
                    img: '/assets/newtrain/model10_2.png',
                    title: '人才缺口大',
                    con: '国内测试人才缺口超过 30万，且逐年递增',
                },
                {
                    id: 3,
                    img: '/assets/newtrain/model10_3.png',
                    title: '入学门槛低',
                    con: '0专业基础入门 经验不限',
                },
                {
                    id: 4,
                    img: '/assets/newtrain/model10_4.png',
                    title: '技术上手快',
                    con: '2个月起，快速学 习、系统掌握 ',
                },
                {
                    id: 5,
                    img: '/assets/newtrain/model10_5.png',
                    title: '薪资待遇好',
                    con: '起步月薪6-10K，优秀 学员年薪可达20万',
                },
            ],
            model10Data: [
                {
                    id: 1,
                    img: '/assets/train/zs1.png',
                    con: '工业和信息化重点领域人才能力评价体系建设支撑机构',
                },
                {
                    id: 2,
                    img: '/assets/train/zs2.png',
                    title: '配置项测试工程师',
                    con: '工业和信息化重点领域人才能力评价培训辅导支撑机构',
                },
                {
                    id: 3,
                    img: '/assets/train/zs3.png',
                    title: '安全性测试工程师',
                    con: '工业和信息化人才岗位能力评价证书',
                },
            ],
            // 表单
            form: { mobile: '' },
            allschool: [], //全部学校信息
            rules: {
                trainClassCode: [
                    { required: true, message: '请输入培训班代号', trigger: 'blur' },
                    { validator: validateId, trigger: 'blur' },
                ],
                homeCollege: [{ required: true, message: '请输入您的学院名称', trigger: 'blur' }],
                majorNamec: [{ required: true, message: '请输入您的专业名称', trigger: 'blur' }],
                studentName: [{ required: true, message: '请输入您的姓名', trigger: 'blur' }],
            },
            // 评测报名
            isPcshow: false,
            formjj: {
                studentName: '',
                mobile: '',
                code: '',
                uuid: '',
            },
            rulesjj: {
                studentName: [{ required: true, message: '请输入您的姓名', trigger: 'blur' }],
                mobile: [
                    { required: true, message: '请输入您的手机', trigger: 'blur' },

                    {
                        validator: checkPhone,
                        trigger: 'blur',
                    },
                ],
                code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
            },
            isSending: false,
            countdown: 0,
            indexbanner: [
                { id: 1, imgurl: '/assets/newtrain/peixun2.png' },
                { id: 2, imgurl: '/assets/newtrain/peixun3.png' },
            ],
            // 新模块
            topClassList: [],
            bottomClassList: [],
            classInfo: null,
            // 职称数据
            activezcList: {
                type: 0,
                tiaojian: '具备下列条件的可申请参与初级评价',
                skill: '1.遵守中华人民共和国宪法和各项法律，恪守职业道德，具备一定的岗位专业知识和应用实践能力的人员，均可申请参与初级评价;&2.经中心认可的全国性行业赛事，获得省赛奖项的可直接申请认定;&3.经中心认可的其他评价项目，取得初级证书的可直接申请认定',
                content:
                    '1.安全测试基本理论、安全测试方法、安全测试工具使用介绍。&2.GJB9433-2018标准下可编程逻辑器件软件测试级别、测试过程、测试类型、测试方法讲解，以及在工程项目中的应用。',
            },
            zcList: [
                {
                    type: 0,
                    tiaojian: '具备下列条件的可申请参与初级评价',
                    skill: '1.遵守中华人民共和国宪法和各项法律，恪守职业道德，具备一定的岗位专业知识和应用实践能力的人员，均可申请参与初级评价;&2.经中心认可的全国性行业赛事，获得省赛奖项的可直接申请认定;&3.经中心认可的其他评价项目，取得初级证书的可直接申请认定',
                    content:
                        '1.安全测试基本理论、安全测试方法、安全测试工具使用介绍。&2.GJB9433-2018标准下可编程逻辑器件软件测试级别、测试过程、测试类型、测试方法讲解，以及在工程项目中的应用。',
                },
                {
                    type: 1,
                    tiaojian: '具备下列条件之一者，可申请参与中级评价',
                    skill: '1.硕士及以上学历，并从事相关岗位工作3年(含)以上;&2.本科或同等学历，并从事相关岗位工作5年(含)以上;&3.大专或同等学历，并从事相关岗位工作6年(含)以上;&4.经中心认可的全国性行业赛事，获得决赛奖项的可直接申请认定;&5.经中心认可的其他评价项目，取得等同中级证书的可直接申请认定，取得等同初级证书的可参与中级评价。',
                    content:
                        '1.安全测试基本理论、安全测试方法、安全测试工具使用介绍。&2.GJB9433-2018标准下可编程逻辑器件软件测试级别、测试过程、测试类型、测试方法讲解，以及在工程项目中的应用。',
                },
                {
                    type: 2,
                    tiaojian: '具备下列条件之一者，可申请参与高级评价',
                    skill: '1. 拥有硕士及以上学历，且从事相关岗位工作5年(含)以上;&2. 拥有大学本科学历，且从事相关岗位工作8年(含)以上;&3. 拥有大学专科学历，且从事相关岗位工作10年(含)以上。&4. 经中心认可的其他评价项目，取得等同高级证书的可直接申请认定，取得等同中级证书的可参与高级评价。',
                    content:
                        '1.安全测试基本理论、安全测试方法、安全测试工具使用介绍。&2.GJB9433-2018标准下可编程逻辑器件软件测试级别、测试过程、测试类型、测试方法讲解，以及在工程项目中的应用。',
                },
            ],
            zhuanjiaList: [
                {
                    name: '王晶',
                    zw: '配置项测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people2.png',
                    content: '自2019年起从事软件测试工作，先后参加多种军用软件测试，目前主要从事配置项、系统测试',
                },
                {
                    name: '石颢',
                    zw: '可编程逻辑器件测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people1.png',
                    content:
                        '从业15年来，始终致力于FPGA软件验证与测试技术研究，尤其在数字化仿真、静态缺陷检查、形式化验证等方面有一定深耕，主持完成了多个重要型号的可编程逻辑器件软件的验证与测试项目，涉及领域包括航天/航空/航海/电子/兵器等，发表相关论文十余篇，撰写专利3项。',
                },
                {
                    name: '袁居莲',
                    zw: '单元测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people3.png',
                    content:
                        '自2020年起从事软件测试工作，先后参加单元、系统多种类型的军用软件测试，目前主要从事单元测试工作。',
                },
                {
                    name: '李晰昀',
                    zw: '安全测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people3.png',
                    content: '自2020年起从事网络安全、网络攻防对抗、渗透测试、云计算及安全和信息系统安全合规性的工作。',
                },
                {
                    name: '顾珊珊',
                    zw: '白盒测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people3.png',
                    content:
                        '自2020年起从事软件开发工作，先后参加多种测试软件开发，目前主要从事配置项测试、单元测试工具的开发。',
                },
                {
                    name: '王博洋',
                    zw: '功能测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people3.png',
                    content:
                        '自2018年起从事软件测试工作，对软件（系统）的功能需求逐项进行测试，包括正常/异常场景、功能控制流程、状态转换、模式切换、超负荷/饱和/最坏情况和合法/非法边界等。',
                },
                {
                    name: '陈梦晖',
                    zw: '接口测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people3.png',
                    content:
                        '从业15年来，负责对软件（系统）的接口需求进行逐项测试，包括信息格式、信息内容、时间特性、丢帧、错帧和误码等',
                },
                {
                    name: '郭鑫',
                    zw: '静态测试工程师',
                    zc: '高工',
                    img: '/assets/newtrain/people3.png',
                    content:
                        '自2020年负责利用文档审查、代码审查和静态分析，对文档的一致性进行审查，对软件源码进行控制流、数据流、接口和质量度量等分析。',
                },
            ],
        }
    },
    computed: {
        ...mapGetters(['token', 'userinform']),
    },
    mounted() {
        this.form.mobile = this.userinform.phonenumber
        this.activeModel2 = this.model2Data[0]
        this.getClassList()
    },
    methods: {
        // new
        // 行点击
        rowClick(it) {
            if (it.classLevel == 0) {
                this.activezcList = this.zcList[0]
            } else if (it.classLevel == 1) {
                this.activezcList = this.zcList[1]
            } else if (it.classLevel == 2) {
                this.activezcList = this.zcList[2]
            }
        },
        getClassList() {
            getClassList().then((res) => {
                // classType  2可靠性 1线下进阶 0校企合作
                // classLevel  0初级1中级2高级
                // status  1报名未开始 2报名中 345 结束
                this.topClassList = res.filter((it) => it.classType == 2)
                this.bottomClassList = res.filter((it) => it.classType == 1)
                if (this.topClassList.length) {
                    this.rowClick(this.topClassList[0])
                }
            })
        },

        mouseenterFn(i) {
            this.activeVal = i
        },
        // 模块3点击
        // model3Click(val) {
        //     this.model3Active = val
        // },
        // 学校点击
        modelSchool(item) {
            this.activeModel2 = item
        },
        // 咨询点击
        zixunClick() {
            const bigbox = document.querySelector('#minidialog')
            const x = document.querySelector('.closeX')
            x.style.display = 'block'
            bigbox.style.width = '300px'
            bigbox.style.height = 'auto'
            bigbox.style.display = 'block'
            bigbox.style.bottom = '0'
            bigbox.style.right = '0'
        },
        // 打开模块3
        openModel3(it) {
            if (it.id == 1) {
                this.model34Data = [
                    { con: '静态分析的概念介绍。', num: '1课时' },
                    { con: '静态分析工具介绍。', num: '1课时' },
                    { con: '静态分析的基本流程。', num: '1课时' },
                    { con: '单元测试的概念介绍。', num: '1课时' },
                    { con: '单元测试依据的标准介绍。', num: '1课时' },
                    { con: '介绍单元测试的测试类型。', num: '1课时' },
                    { con: '单元测试的基本流程。', num: '1课时' },
                    { con: '单元测试工具的安装和使用。', num: '2课时' },
                    { con: '单元测试环境配置。', num: '2课时' },
                    { con: '单元测试工具静态分析操作流程。', num: '2课时' },
                    { con: '单元测试操作流程。', num: '2课时' },
                    { con: '单元测试工具的测试报告导出。', num: '1课时' },
                    { con: '静态测试工具的安装和使用。', num: '2课时' },
                    { con: '通过项目进行代码行数、圈复杂度、扇入扇出、注释率进行测试。', num: '4课时' },
                    {
                        con: '通过项目进行文档审查、代码审查、静态分析、测试用例的设计、单元测试的执行、单元测试的记录填写、单元测试的测试用例的自动生成、单元测试的问题记录方法、单元测试文档编写。',
                        num: '4课时',
                    },
                ]
                this.isShowModel3 = true
            } else if (it.id == 2) {
                this.model34Data = [
                    { con: '配置项测试概念。', num: '1课时' },
                    { con: '配置项测试对象。', num: '1课时' },
                    { con: '配置项测试目的。', num: '1课时' },
                    { con: '配置项测试方法。', num: '1课时' },
                    { con: '配置项测试依据。', num: '1课时' },
                    { con: '针对《军用软件测试指南》、《军用软件开发文档通用要求》的标准进行解读。', num: '1课时' },
                    { con: '讲解测试用例的设计方法以及测试用例编写的要求。', num: '1课时' },
                    { con: '讲解整套测试文档编写的先后顺序以及编写规范。', num: '1课时' },
                    { con: '自动化测试平台工具的安装和使用。', num: '1课时' },
                    { con: '结合项目，使用自动化测试平台工具，编写测试脚本进行功能、性能测试。', num: '3课时' },
                    { con: '系统级白盒测试工具的安装和使用。', num: '1课时' },
                    {
                        con: '结合项目，使用系统级白盒测试工具进行覆盖率、性能、内存测试，分析函数调用关系，跟踪程序执行过程。',
                        num: '3课时',
                    },
                    { con: '接口测试工具安装和使用。', num: '1课时' },
                    { con: '结合项目，使用接口测试工具进行基于串口的接口协议测试。', num: '3课时' },
                    {
                        con: '结合项目，进行文档审查、代码审查、静态分析、功能测试、性能测试、安全性测试、人机交互界面测试、余量测试、恢复性测试、接口测试、边界测试、安装性测试、强度测试、逻辑测试、自动化测试、问题的记录和处理、测试计划、测试说明、测试报告编写。',
                        num: '4课时',
                    },
                ]
                this.isShowModel3 = true
            } else if (it.id == 3) {
                this.model34Data = [
                    { con: '什么是软件安全性测试。', num: '1课时' },
                    { con: '安全性测试与功能性测试的不同。', num: '1课时' },
                    { con: '软件安全需求。', num: '1课时' },
                    { con: '软件应用安全现状及常见攻击方式。', num: '1课时' },
                    { con: '软件应用安全测试的方式及原理。', num: '1课时' },
                    { con: '安全测试的十大原则及安全性测试的目标。', num: '1课时' },
                    { con: '软件安全性测试的范围。', num: '1课时' },
                    { con: '安全性测试方法：安全静态测试技术、安全动态测试技术、渗透测试。', num: '1课时' },
                    { con: '软件安全标准：安全规范、安全测试标准、安全编码标准、安全等级标准等。', num: '1课时' },
                    {
                        con: '深度了解APPSCAN：原理、攻击样本、使用方法、专家分析及解决方案使用、生成报告。',
                        num: '2课时',
                    },
                    { con: 'Buresuite/ZAP，两个开源综合性安全测试工具的使用方法、原理及测试结果分析。', num: '2课时' },
                    { con: '静态代码安全审计方法及工具详解：Lapse/fortify。', num: '2课时' },
                    { con: '安全测试工具发现的问题的归类及修改顺序、修改优先级。', num: '2课时' },
                    { con: '常见的安全性检测工具介绍。', num: '1课时' },
                    { con: '根据项目，进行渗透测试过程讲解。', num: '1课时' },
                    { con: 'OWASP安全测试指南。', num: '1课时' },
                    { con: '深度详细讲解符合实际应用的7大类91个安全测试用例的设计与执行方法。', num: '2课时' },
                    { con: 'web渗透测试举例演示。', num: '3课时' },
                ]
                this.isShowModel3 = true
            } else if (it.id == 4) {
                this.model34Data = [
                    { con: '可编程逻辑器件简介', num: '1课时' },
                    { con: '数字电路中的组合电路与时序电路', num: '1课时' },
                    { con: '组合逻辑与时序逻辑实例', num: '1课时' },
                    { con: 'VHDL语法、VHDL实例。', num: '2课时' },
                    { con: 'verilog语法、verilog经典电路、verilog的FSM实现、verilog实例。', num: '2课时' },
                    { con: 'systemverilog语法、systemverilog实例。', num: '2课时' },
                    { con: '可编程逻辑器件软件开发过程。', num: '1课时' },
                    { con: '可编程逻辑器件软件测试过程。', num: '1课时' },
                    { con: '可编程逻辑器件软件测试方法简介。', num: '1课时' },
                    { con: '编码规则检查与操作演示。', num: '1课时' },
                    { con: '常见verilog编码问题。', num: '1课时' },
                    { con: '人工代码审查实例', num: '2课时' },
                    { con: '静态时序分析原理、静态时序分析实例。', num: '2课时' },
                    { con: '跨时钟域信号分析、跨时钟域信号实例。', num: '2课时' },
                    { con: '功能仿真、功能仿真实例。', num: '2课时' },
                    { con: '时序仿真与实例。', num: '2课时' },
                    { con: '可编程逻辑器件软件开发与测试的关系。', num: '1课时' },
                    { con: '可编程逻辑器件软件测试级别。', num: '1课时' },
                    { con: '可编程逻辑器件软件测试过程及输出文档。', num: '1课时' },
                    { con: '可编程逻辑器件软件测试类型。', num: '1课时' },
                    { con: '可编程逻辑器件软件测试方法。', num: '1课时' },
                ]
                this.isShowModel3 = true
            }
        },
        // 关闭模块3
        closeModel3() {
            this.isShowModel3 = false
        },
        // 打开弹层
        openSubmit() {
            if (!this.token) {
                this.$confirm('您未登录,请您先去登录', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                })
                    .then(() => {
                        this.$router.push('/login?type=log')
                    })
                    .catch(() => {
                        // console.log('取消')
                    })
            } else {
                getSignUpList().then((res) => {
                    this.allschool = res.rows
                })
                this.isshowSubmitDialog = true
            }
        },
        // 弹层提交
        subobtain() {
            this.$refs['form'].validate(async (valid) => {
                if (valid) {
                    let trainClassId = this.allschool.find(
                        (item) => item.trainClassCode == this.form.trainClassCode,
                    ).trainClassId
                    let data = {
                        trainClassCode: this.form.trainClassCode,
                        mobile: this.userinform.phonenumber,
                        homeCollege: this.form.homeCollege,
                        majorName: this.form.majorName,
                        studentName: this.form.studentName,
                        trainClassId,
                        studentCode: this.form.studentCode,
                    }
                    console.log('data---', data)
                    // return;
                    await postBaoming(data).then((res) => {
                        console.log('res---', res)
                        if (res.data.code == 200) {
                            this.$message.success('报名成功')
                            this.form = {}
                            this.$refs['form'].resetFields()
                            this.calltext = ''
                            this.isshowSubmitDialog = false
                        } else {
                            this.$message.warning(res.data.msg)
                            this.isshowSubmitDialog = false
                        }
                    })
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        // 弹层x
        coloeDialog() {
            this.$refs['form'].resetFields()
            this.isshowSubmitDialog = false
            this.calltext = ''
            this.form = {}
        },
        // 评测报名提交
        pcbaomingFn() {
            console.log('点击事件')
            this.$refs['formjj1'].validate(async (valid) => {
                if (valid) {
                    if (this.userinform.userId) {
                        // 登录了
                        let data = {
                            mobile: this.formjj.mobile,
                            studentName: this.formjj.studentName,
                            trainClassId: this.classInfo.classId,
                            classType: this.classInfo.classType,
                        }
                        await postBaoming(data).then((res) => {
                            if (res.data.code == 200) {
                                this.$message.success('报名成功')
                                this.isPcshow = false
                                this.formjj = {
                                    studentName: '',
                                    mobile: '',
                                    code: '',
                                    uuid: '',
                                }
                            } else {
                                this.$message.warning(res.data.msg)
                            }
                        })
                    } else {
                        // 没登录
                        let data = {
                            mobile: this.formjj.mobile,
                            studentName: this.formjj.studentName,
                            trainClassId: this.classInfo.classId,
                            classType: this.classInfo.classType,
                            code: this.formjj.code,
                            uuid: this.formjj.uuid,
                        }
                        await postBaomingNoToken(data).then((res) => {
                            if (res.data.code == 200) {
                                this.$message.success('报名成功')
                                this.isPcshow = false
                                this.formjj = {
                                    studentName: '',
                                    mobile: '',
                                    code: '',
                                    uuid: '',
                                }
                            } else {
                                this.$message.warning(res.data.msg)
                            }
                        })
                    }
                } else {
                }
            })
        },
        coloeDialog1() {
            this.$refs['formjj1'].resetFields()
            this.isPcshow = false
        },
        // 评测报名
        pcBaoming(item) {
            // if (!this.token) {
            //     this.$confirm('您未登录,请您先去登录', '提示', {
            //         confirmButtonText: '确定',
            //         cancelButtonText: '取消',
            //         type: 'warning',
            //     })
            //         .then(() => {
            //             this.$router.push('/login?type=log')
            //         })
            //         .catch(() => {
            //             // console.log('取消')
            //         })
            // } else {
            //     this.isPcshow = true
            //     this.classInfo = item
            // }
            this.isPcshow = true
            this.classInfo = item
        },
        sendCode() {
            if (!/^1[34578]\d{9}$/.test(this.formjj.mobile)) {
                return this.$message.error('请输入正确的手机号码')
            }
            if (this.countdown > 0 || this.isSending) {
                return // 防止重复点击发送
            }
            this.isSending = true
            this.startCountdown()

            setTimeout(() => {
                // 假设发送成功后将isSending重置为false
                this.isSending = false
            }, 100) // 这里使用2秒的延迟来模拟发送过程，你需要替换为实际的发送逻辑
            // 验证码接口
            getCodeUserLogin(this.formjj.mobile).then((res) => {
                this.isSending = false
                if (res.code == 200) {
                    this.formjj.uuid = res.uuid
                    this.$message.success('短信发送成功，请注意查收')
                }
            })
        },
        startCountdown() {
            this.countdown = 60
            const timer = setInterval(() => {
                this.countdown--
                if (this.countdown <= 0) {
                    clearInterval(timer)
                }
            }, 1000)
        },
    },
}
</script>
<style scoped>
.ijaiorenwu22 {
    position: fixed;
    z-index: 2147483639;
    right: 25px;
    top: 440px;
    width: 160px;
    height: 150px;
    background: linear-gradient(0deg, #5ea6fd, #1a81f9);
    box-shadow: 0px 1px 20px 1px rgba(13, 92, 187, 0.4);
    border-radius: 4px;
    display: flex;
    flex-direction: column;
}
.ijaiorenwu22it {
    flex: 1;
    font-weight: 500;
    font-size: 14px;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.ijaiorenwu22it a {
    color: #ffffff;
    text-decoration: none;
}
.ijaiorenwu22itb {
    border-top: 1px solid rgba(255, 255, 255, 0.352);
}
/* 咨询 */
.zxzx {
    z-index: 2147483639;
    width: 180px;
    height: 68px;
    position: fixed;
    right: 16px;
    top: 600px;
    font-weight: 500;
    font-size: 17px;
    color: #ffffff;
    background: url('/assets/ability/zixun.gif');
    background-size: 100% 100%;
    line-height: 68px;
    text-indent: 2em;
    cursor: pointer;
}
/* 弹层 */

.maskdialogS {
    width: 592px;
    height: 503px;
    background: #ffffff;
    box-shadow: 0px 4px 21px 4px rgba(19, 106, 189, 0.15);
    z-index: 2000;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.maskdialogS1 {
    height: auto;
    padding-bottom: 30px;
}
.maskdialogSClose {
    position: absolute;
    top: 15px;
    right: 30px;
    font-weight: 400;
    font-size: 25px;
    color: #858994;
    cursor: pointer;
}
.maskdialogSTitle {
    height: 59px;
    font-weight: bold;
    font-size: 22px;
    color: #1a1a1a;
    line-height: 59px;
    text-align: center;
    background: #f3f5fb;
}
.maskdialogSContent {
    box-sizing: border-box;
    padding: 20px 40px 0 0;
    box-sizing: border-box;
}
.rowitembtn {
    width: 520px;
    height: 48px;
    background: #2084f9;
    box-shadow: 0px 1px 20px 1px rgba(13, 92, 187, 0.3);
    border-radius: 6px;
    font-weight: 500;
    font-size: 16px;
    color: #ffffff;
    text-align: center;
    line-height: 44px;
    cursor: pointer;
    margin: auto;
}
.infoadad {
    font-weight: 500;
    font-size: 14px;
    color: #0066eb;
    margin: -5px 0 15px 35px;
}
.rowboxi {
    display: flex;
    align-items: center;
}
.rowboxis {
    font-size: 20px;
    color: red;
    width: 20px;
}
.maskdialogSContent >>> .el-form-item__error {
    left: 20px;
}
.maskdialogSContent >>> .el-form-item__content {
    margin-left: 18px !important;
}
/* 页面整体样式 */
.container {
    width: 1200px;
    margin: auto;
}
.model_title {
    margin-top: 50px;
    margin-bottom: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.model_title_top {
    display: flex;
    justify-content: center;
    align-items: center;
}
.model_title_top p {
    font-weight: bold !important;
    font-size: 32px !important;
    color: #1a1a1a;
    margin: 0 15px;
}
.model_title_top2 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 15px 0;
}
.model_title_top2 p {
    font-weight: bold !important;
    font-size: 25px !important;
    color: #1a1a1a;
    margin: 0 13px 0 15px;
}
.model_title_img {
    width: 526px;
    height: 28px;
}
.model_title_text {
    font-weight: 500;
    font-size: 16px;
    color: #595959;
    margin-top: 20px;
}
.trainpage {
    width: 100%;
    box-sizing: border-box;
}
.bannertop {
    width: 100%;
    height: 450px;
    object-fit: cover;
}
/* 页面整体样式 */
/* 模块1 */
.moedel1_content {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
    height: 310px;
    box-sizing: border-box;
}
.moedel1_contentitem {
    width: 280px;
    height: 280px;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    transition: all 0.1s linear;
    overflow: hidden;
    box-shadow: 0px 4px 34px 6px rgba(14, 97, 205, 0.1);
    cursor: pointer;
}
.moedel1_contentitem:hover {
    height: 308px;
}
.moedel1_contentitem:hover .moedel1_contentitem_arrow {
    bottom: 10px;
}
.moedel1_contentitem_arrow {
    width: 18px;
    height: 18px;
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translate(-50%, 0);
}
.moedel1_contentitem_imgbox {
    width: 100%;
    height: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.moedel1_contentitem_img {
    width: 75px;
    height: 75px;
}
.moedel1_contentitem_text {
    width: 100%;
    flex: 1;

    border-top: 1px solid #ebebeb;
    padding: 20px;
    box-sizing: border-box;
}
.moedel1_contentitem_text1 {
    line-height: 34px;
    text-align: center;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 18px;
    color: #1a1a1a;
}
.moedel1_contentitem_text2 {
    font-weight: 500;
    font-size: 15px;
    color: #808080;
    line-height: 25px;
}
/* 模块1 */
/* 模块2 */
.model2 {
    width: 100%;
    height: 797px;
    background-image: url('/assets/newtrain/model2_banner.png');
    background-size: 100% 100%;
}
.model2_middle {
    overflow: hidden;
    height: 100%;
}
.model2_content {
    width: 100%;
    height: 598px;
    background: #ffffff;
    border-radius: 10px;
    box-sizing: border-box;
    padding: 20px;
}
.model2_content_title {
    font-weight: 500;
    font-size: 16px;
    color: #808080;
    width: 806px;
    text-align: center;
    margin: 25px auto;
}
.model2_content_itemcontent {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    justify-content: space-between;
}
.model2_content_item {
    width: 275px;
}
.model2_content_item_img {
    width: 100%;
    height: 190px;
}
.model2_content_item_text {
    font-weight: 500;
    font-size: 18px;
    color: #333333;
    margin: 10px 0;
    text-align: center;
}
/* 模块2 */

/* 模块3 */
.flagUp {
    display: flex;
    justify-content: center;
}
.flagUp_img {
    width: 27px;
    height: 27px;
    transform: rotate(180deg);
    margin: 20px 0;
    cursor: pointer;
}
.moedel3_content {
    width: 100%;
    /* height: 326px; */
    background: #ffffff;
    box-shadow: 0px 2px 10px 0px rgba(58, 59, 72, 0.15);
    border-radius: 6px 0px 0px 6px;
    display: flex;
    padding: 25px;
    box-sizing: border-box;
}
.moedel3_content_l {
    width: 257px;
    height: 100%;
    border-right: 1px solid rgba(180, 180, 180, 0.1);
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}
.moedel3_content_l_item {
    width: 190px;
    height: 50px;
    border: 1px solid #0066eb;
    font-weight: 500;
    font-size: 18px;
    color: #0066eb;
    text-align: center;
    line-height: 50px;
    cursor: pointer;
}
.moedel3_content_l_itemactive {
    background: #0066eb;
    color: #ffffff;
}

.moedel3_content_r {
    width: 100%;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 65px auto 95px;
    border-top: 1px solid #e8eaed;
    border-left: 1px solid #e8eaed;
}
.moedel3_content_r_griditem {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #e8eaed;
    border-right: 1px solid #e8eaed;
    box-sizing: border-box;
    color: #666666;
}
.moedel3_content_r_griditemmi {
    justify-content: flex-start;
    padding-left: 20px;
}
.moedel3_content_r_griditemtop {
    background: #e9f0fa;
    font-weight: bold;
    font-size: 16px;
    color: #333333;
}

.model3_skill_title {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 30px 0;
}
.model3_skill_img {
    width: 284px;
    height: 32px;
}
.model3_skill_itembox {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.model3_skill_item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100px;
    height: 100px;
    background: #ffffff;
    box-shadow: 0px 1px 19px 1px rgba(53, 53, 57, 0.08);
    border-radius: 6px;
    transition: all 0.1s linear;
}
.model3_skill_item:hover {
    transform: scale(1.05);
}
.model3_skill_item_img {
    width: 35px;
    height: 34px;
}
.model3_skill_item_text {
    margin-top: 15px;
    font-weight: 500;
    font-size: 15px;
    color: #4d4d4d;
}

.model32_skill_itembox {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.model32_skill_item {
    width: 280px;
    height: 80px;
    box-shadow: 0px 4px 34px 6px rgba(14, 97, 205, 0.1);
    margin-bottom: 20px;
    transition: all 0.1s linear;
}
.model32_skill_item:hover {
    transform: scale(1.05);
}
.model32_skill_item_img {
    width: 100%;
    height: 100%;
}

/* 模块3 */

/* 模块4 */

.moedel4_content_tag {
    display: flex;
    margin-bottom: 40px;
}
.moedel4_content_tag_item {
    width: 112px;
    height: 36px;
    background: #eef2f7;
    border-radius: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 12px;
    font-size: 14px;
}
.moedel4_content_tag_itemactive {
    background: #0066eb;
    color: #ffffff;
}
.moedel4_content_video {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.moedel4_content_video_item {
    width: 280px;
    height: 250px;
    background: #ffffff;
    box-shadow: 1px 1px 8px 0px rgba(43, 34, 34, 0.1);
    border-radius: 4px;
    box-sizing: border-box;
    padding: 13px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.moedel4_content_video_item_top {
    position: relative;
    font-weight: 500;
    font-size: 14px;
    color: #ffffff;
}
.moedel4_content_video_item_top_l {
    position: absolute;
    bottom: 10px;
    left: 10px;
}
.moedel4_content_video_item_top_r {
    position: absolute;
    bottom: 10px;
    right: 10px;
}
.moedel4_content_video_item_top_limg {
    width: 11px;
    height: 12px;
}
.moedel4_content_video_item_top_rimg {
    width: 17px;
    height: 12px;
}
.moedel4_content_video_item_topimg {
    width: 100%;
    height: 132px;
}
.moedel4_content_video_item_middel {
    font-weight: 500;
    font-size: 16px;
    color: #1a1a1a;
    margin-top: -20px;
}
.moedel4_content_video_item_bottom {
    display: flex;
    justify-content: space-between;
    font-weight: 500;
    font-size: 14px;
    color: #808080;
}
/* .moedel4_content_video_item_bl {
} */
.moedel4_content_video_item_blimg {
    width: 14px;
    height: 15px;
}
.moedel4_content_video_item_br {
    font-weight: 400;
}

/* 模块4 */

/* 模块5 */
.model5 {
    width: 100%;
    background: #f7f7fa;
    overflow: hidden;
    padding-top: 20px;
}
.moedel5_content_tag {
    display: flex;
    margin-bottom: 40px;
}
.moedel5_content_tag_item {
    width: 112px;
    height: 36px;
    background: #ffffff;
    border-radius: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 12px;
    font-size: 14px;
    color: #333333;
    font-weight: 500;
    cursor: pointer;
}
.moedel5_content_tag_itemactive {
    background: #0066eb;
    color: #ffffff;
}
.moedel5_content_con {
    width: 100%;
    /* height: 570px; */
    background: #ffffff;
    border-radius: 8px;
    display: flex;
    margin-bottom: 50px;
}
.moedel5_content_con_l {
    height: 100%;
    width: 544px;
    border-right: 1px solid rgba(180, 180, 180, 0.1);
    padding: 30px 40px 30px 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}
.moedel5_content_con_limg {
    width: 100%;
    height: 276px;
    margin-bottom: 20px;
}
.moedel5_content_con_lcon {
    flex: 1;
    line-height: 30px;
    text-indent: 2em;
    overflow: hidden;
    font-weight: 500;
    font-size: 15px;
    color: #333333;
}
.moedel5_content_con_r {
    flex: 1;
    padding: 30px 40px;
    box-sizing: border-box;
    overflow: auto;
}
.moedel5_content_con_r_title {
    display: flex;
    align-items: center;
    font-weight: bold;
    font-size: 18px;
    color: #333333;
    margin: 10px 0;
}
.moedel5_content_con_r_titleline {
    width: 4px;
    height: 16px;
    background: #1a7aed;
    margin-right: 10px;
}
.moedel5_content_con_r_con {
    line-height: 28px;
    font-weight: 500;
    font-size: 15px;
    color: #737373;
}
.moedel5_content_con_r_btn {
    width: 200px;
    height: 42px;
    background: linear-gradient(90deg, #5ea6fd, #1a81f9);
    border-radius: 21px;
    font-weight: 500;
    font-size: 18px;
    color: #ffffff;
    line-height: 42px;
    text-align: center;
    margin-top: 50px;
    cursor: pointer;
}
.moedel5_content_con_r_btn:hover {
    background: linear-gradient(90deg, #1a81f9, #5ea6fd);
}

/* 模块5 */

/* 模块6 */
.moedel6_content {
    background: #f7f7fa;
    border-top: 1px solid #e8eaed;
    border-left: 1px solid #e8eaed;
    display: grid;
    grid-template-columns: 106px 125px auto;
}
.moedel6_content_griditem {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #e8eaed;
    border-right: 1px solid #e8eaed;
    box-sizing: border-box;
    /* padding-left: 20px; */
}
.moedel6_content_griditemtop {
    font-weight: bold;
    font-size: 18px;
    color: #1a1a1a;
    background: #cadaf1;
}
.moedel6_content_griditemleft {
    justify-content: flex-start;
    padding-left: 20px;
}
.moedel6_content_griditemspan2 {
    grid-row: span 2;
    height: 100px;
}

/* 模块6 */
/* 模块7 */
.moedel7_content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.moedel7_content_item {
    width: 220px;
    height: 260px;
    background: #ffffff;
    box-shadow: 0px 1px 10px 0px rgba(41, 46, 52, 0.1);
    border-radius: 6px;
    border: 1px solid #dcd8ef;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}
.moedel7_content_item_img {
    width: 100px;
    height: 100px;
}
.moedel7_content_item_title {
    font-weight: bold;
    font-size: 20px;
    color: #1a1a1a;
}
.moedel7_content_item_con {
    padding: 0 10px;
    box-sizing: border-box;
    text-align: center;
    font-weight: 500;
    font-size: 14px;
    color: #808080;
    line-height: 24px;
}

/* 模块7 */
/* 模块8 */
.moedel8_content {
    height: 390px;
    background: #ffffff;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    display: flex;
}
.moedel8_content_l {
    flex: 1;
    box-sizing: border-box;
    padding: 50px 16px 45px 37px;
}
.moedel8_content_limg {
    width: 100%;
    height: 100%;
}
.moedel8_content_r {
    width: 731px;
    height: 100%;
    background: #f5f5f7;
    box-sizing: border-box;
    padding: 0 47px 0 103px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}
.moedel8_content_sanjiao {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-width: 195px 50px 195px 50px;
    border-style: solid;
    border-color: #ffffff transparent transparent #ffffff;
}
.moedel8_content_rtop {
    font-weight: bold;
    font-size: 28px;
    color: #1a1a1a;
}
.moedel8_content_rline {
    width: 40px;
    height: 4px;
    background: #0066eb;
    border-radius: 2px;
    margin: 20px 0;
}
.moedel8_content_rcon {
    font-weight: 500;
    font-size: 16px;
    color: #666666;
    line-height: 34px;
}
/* 模块8 */

/* 模块9 */
.model9 {
    margin-bottom: 60px;
}
.moedel9_content {
    display: flex;
    justify-content: space-between;
}
.moedel9_content_item {
    width: 212px;
    height: 260px;
    background: #ffffff;
    box-shadow: 0px 1px 12px 0px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    box-sizing: border-box;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.moedel9_content_item_top {
    width: 100%;
    height: 104px;
}
.moedel9_content_item_middle {
    font-weight: bold;
    font-size: 20px;
    color: #1a1a1a;
}
.moedel9_content_item_bottom {
    height: 50px;
    font-weight: 500;
    font-size: 16px;
    color: #808080;
    text-align: center;
}
/* 模块9 */
/* 模块10 */
.model10Con {
    display: flex;
    justify-content: space-between;
    padding-bottom: 60px;
}
.model10Con_item {
    width: 383px;
    height: 279px;
    box-shadow: 0px 4px 34px 6px rgba(14, 97, 205, 0.1);
    position: relative;
}
.model10Con_item:hover .model10Con_item_mask {
    opacity: 1;
}
.model10Con_item_img {
    width: 100%;
    height: 100%;
}
.model10Con_item_mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 383px;
    height: 279px;
    background: rgba(23, 24, 27, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
}
.model10Con_item_mask .context {
    width: 260px;
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    color: #ffffff;
    line-height: 29px;
}

/* 模块10 */
.ijaiorenwu {
    position: fixed;
    z-index: 2147483639;
    right: 25px;
    top: 490px;
    width: 110px;
    height: 90px;
    background: #2084f9;
    box-shadow: 0px 1px 20px 1px rgba(13, 92, 187, 0.3);
    border-radius: 4px;
    font-weight: 500;
    font-size: 16px;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    text-align: center;
}
.ijaoricon {
    width: 31px;
    height: 31px;
    margin-bottom: 7px;
}
.newmodel1 {
    width: 100%;
    background: #f7f7fa;
    overflow: hidden;
    padding: 20px 0 40px 0;
}
.newmodel1Con {
    display: flex;
    justify-content: space-between;
}
.newmodel1Conl {
    width: 320px;
    height: 430px;
    background: linear-gradient(0deg, #4296fb, #127cf8);
    border-radius: 6px;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
}
.newmodel1Conl::-webkit-scrollbar {
    width: 2px;
    height: 1px;
}
.newmodel1Conl::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: transparent;
}
.newmodel1Conl::-webkit-scrollbar-track {
    border-radius: 10px;
    background: transparent;
}
.newmodel1Conlt1 {
    height: 30px;
    background: #ffffff;
    border-radius: 2px;
    font-weight: bold;
    font-size: 14px;
    color: #0066eb;
    opacity: 0.9;
    line-height: 30px;
    padding-left: 10px;
    box-sizing: border-box;
    margin-bottom: 10px;
}
.newmodel1Conlc1 {
    font-weight: 500;
    font-size: 14px;
    color: #f2f2f2;
    line-height: 22px;
}

.newmodel1Conr {
    width: 860px;
    height: 430px;
    background: #ffffff;
    border-radius: 6px;
    padding: 23px 30px;
    box-sizing: border-box;
}
.newmodel1Conrt {
    background: #e9f0fa;
    border-radius: 4px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 18px;
    color: #000000;
}
.newmodel1Conrt img {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}
.newmodel1Conrc {
    height: 317px;
    border-top: 1px solid #edeff2;
    margin-top: 20px;
    overflow-y: auto;
}
.newmodel1Conrcitem {
    height: 63px;
    border-bottom: 1px solid #edeff2;
    padding: 0 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.newmodel1Conrcitem1 {
    font-weight: 500;
    font-size: 15px;
    color: #595959;
}
.newmodel1Conrcitem3right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 140px;
}
.newmodel1Conrcitem3right img {
    width: 17px;
    height: 23px;
    margin-right: 10px;
}
.newmodel1Conrcitem3 {
    width: 110px;
    height: 34px;
    background: linear-gradient(90deg, #5ea6fd, #1a81f9);
    border-radius: 4px;
    font-weight: 500;
    font-size: 15px;
    color: #ffffff;
    line-height: 34px;
    text-align: center;
    cursor: pointer;
}
.newmodel1Conrcitem4 {
    width: 110px;
    height: 34px;
    background: linear-gradient(90deg, #fb8c16, #fec36e);
    border-radius: 4px;
    font-weight: 500;
    font-size: 15px;
    color: #ffffff;
    line-height: 34px;
    text-align: center;
    cursor: pointer;
}
.newmodel1Conrcitem5 {
    background: linear-gradient(90deg, #8e9aa7, #c1c7ce);
    width: 110px;
    height: 34px;
    border-radius: 4px;
    font-weight: 500;
    font-size: 15px;
    color: #ffffff;
    line-height: 34px;
    text-align: center;
    cursor: pointer;
}
/* 专家 */
.zhuanjiabox {
    display: flex;
    justify-content: space-between;
}
.zhuanjiaboxitem {
    width: 220px;
    height: 278px;
    background: #ffffff;
    border-radius: 6px;
    transition: all 0.1s linear;
    padding: 24px 25px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    overflow: hidden;
}
.zhuanjiaboxitemac {
    width: 712px;
}
.zhuanjiaboxitemac .zhujialine {
    display: block;
}
.zhuanjiaboxitemac .zhuanjiaboxitemlittleC {
    display: block;
}
.zhujialine {
    width: 1px;
    height: 100%;
    background: #f2f2f2;
    display: none;
}
.zhuanjiaboxitemlittleP {
    width: 150px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.zhuanjiaboxitemlittleP img {
    width: 150px;
    height: 170px;
}
.zhuanjiaboxitemlittlePname {
    font-weight: bold;
    font-size: 18px;
    color: #000000;
}
.zhuanjiaboxitemlittlePzc {
    font-weight: 500;
    font-size: 15px;
    color: #666666;
    text-align: center;
}
.zhuanjiaboxitemlittleC {
    width: 446px;
    height: 100%;
    display: none;
}
.zhuanjiaboxitemlittleCzc {
    font-weight: bold;
    font-size: 17px;
    color: #1a1a1a;
}
.zhuanjiaboxitemlittleCbox {
    width: 29px;
    height: 4px;
    background: #0066eb;
    margin: 18px 0 20px 0;
}
.zhuanjiaboxitemlittleCc {
    font-weight: 500;
    font-size: 15px;
    color: #666666;
}

.unlineCon1 {
    display: flex;
    justify-content: space-between;
}
.unlineCon1item {
    width: 220px;
    height: 180px;
    background: #ffffff;
    box-shadow: 0px 4px 34px 6px rgba(14, 97, 205, 0.1);
    border-radius: 6px;
}
.unlineCon1itemt {
    height: 50px;
    background: #e9f0fa;
    border-radius: 6px;
    font-weight: bold;
    font-size: 18px;
    color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.unlineCon1itemt .cricle {
    width: 10px;
    height: 10px;
    border-radius: 50%;

    margin-right: 5px;
}
.unlineCon1itemc {
    font-weight: 500;
    font-size: 15px;
    color: #666666;
}
.unlineCon1itemclist {
    margin-top: 15px;
    padding-left: 55px;
    box-sizing: border-box;
}
.unlineCon2 {
    height: 280px;
    background: #ffffff;
    box-shadow: 0px 4px 34px 6px rgba(14, 97, 205, 0.1);
    border-radius: 6px;
    margin-top: 30px;
    padding: 25px;
    box-sizing: border-box;
}
.unlineCon2t {
    font-weight: bold;
    font-size: 18px;
    color: #1a1a1a;
    display: flex;
    align-items: center;
}
.wheelplanting {
    z-index: 0;
    position: relative;
}
.el-carousel--horizontal {
    overflow: hidden;
}
.wheelplanting >>> .el-carousel__indicators--horizontal {
    bottom: 60px;
}
.wheelplanting >>> .el-carousel__button {
    width: 44px;
    height: 5px;
    border-radius: 2px 2px 2px 3px;
}
</style>