|
|
@@ -0,0 +1,2888 @@
|
|
|
+<template>
|
|
|
+ <div class="home">
|
|
|
+ <header class="header">
|
|
|
+ <div class="header__header">
|
|
|
+ <div class="container">
|
|
|
+ <div class="text-list" v-if="!userInfo">
|
|
|
+ <a @click="go('/login', { state: 1 })">登录</a>
|
|
|
+ <a @click="go('/login', { state: 2 })">注册</a>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="icon-list" v-else>
|
|
|
+ <!-- <a @click="go('/person-center/my-message')">
|
|
|
+ <i class="el-icon-message-solid icon"></i>
|
|
|
+ </a> -->
|
|
|
+ <el-badge
|
|
|
+ :is-dot="msgCount > 0 ? true : false"
|
|
|
+ class="item"
|
|
|
+ style="vertical-align: baseline"
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ style="font-size: 20px; padding: 0px"
|
|
|
+ icon="el-icon-message-solid"
|
|
|
+ type="text"
|
|
|
+ @click="go('/person-center/my-message')"
|
|
|
+ ></el-button>
|
|
|
+ </el-badge>
|
|
|
+ <!-- <el-tooltip placement="bottom-end" v-model="msgShow" :hide-after="0" manual popper-class="tooltipStyle">
|
|
|
+ <el-badge :is-dot="msgCount > 0 ? true : false" class="item" style="vertical-align: baseline">
|
|
|
+ <el-button style="font-size: 20px; padding: 0px" icon="el-icon-message-solid" type="text"
|
|
|
+ @click="go('/person-center/my-message')"></el-button>
|
|
|
+ </el-badge>
|
|
|
+ <div slot="content" class="dis_plays">
|
|
|
+ <p style="max-width: 247px">{{ msgData.text }}</p>
|
|
|
+ <div class="toolbth" @click="newGoToStudy">立即学习</div>
|
|
|
+ <i style="font-size: 18px;cursor:pointer;" class="el-icon-close" @click="clearMsg"></i>
|
|
|
+ </div>
|
|
|
+ </el-tooltip> -->
|
|
|
+ <el-dropdown @command="handleCommand">
|
|
|
+ <span class="el-dropdown-link">
|
|
|
+ <i
|
|
|
+ class="el-icon-user-solid"
|
|
|
+ style="
|
|
|
+ font-size: 20px;
|
|
|
+ color: #3f8dfd;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-left: 20px;
|
|
|
+ "
|
|
|
+ @click="go('/person-center/my-course')"
|
|
|
+ ></i>
|
|
|
+ </span>
|
|
|
+ <el-dropdown-menu slot="dropdown">
|
|
|
+ <el-dropdown-item command="1">我的课程</el-dropdown-item>
|
|
|
+ <el-dropdown-item command="2">我的题库</el-dropdown-item>
|
|
|
+ <el-dropdown-item command="3">个人中心</el-dropdown-item>
|
|
|
+ <!-- <el-dropdown-item command="5">跳小程序</el-dropdown-item> -->
|
|
|
+ <el-dropdown-item command="4">退出登录</el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </el-dropdown>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="header__body">
|
|
|
+ <div class="container clearfix topBoxy">
|
|
|
+ <a class="logo" style="margin-left: 0px;">
|
|
|
+ <img
|
|
|
+ v-if="header.routinelogo"
|
|
|
+ :src="$tools.splitImgHost(header.routinelogo)"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ <!-- <img
|
|
|
+ v-if="header.routinelogo"
|
|
|
+ src="https://file.gdzckj.net/cos/images/tupain/1744698764810.png"
|
|
|
+ alt=""
|
|
|
+ /> -->
|
|
|
+ <h1 v-else></h1>
|
|
|
+ </a>
|
|
|
+ <div class="search">
|
|
|
+ <div class="search__select">
|
|
|
+ <select v-model="type">
|
|
|
+ <option value="1">课程</option>
|
|
|
+ <option value="2">题库</option>
|
|
|
+ <option value="6">直播</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <div class="search__input">
|
|
|
+ <input
|
|
|
+ v-model="searchKey"
|
|
|
+ type="text"
|
|
|
+ autocomplete="new-password"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <el-button type="primary" @click="search" class="search__btn"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </header>
|
|
|
+
|
|
|
+ <section class="section">
|
|
|
+ <div class="container">
|
|
|
+ <div class="tabs">
|
|
|
+ <template v-for="(item, index) in showNav(nav)">
|
|
|
+ <a class="tab" @click="go(item.path)" :key="index">{{
|
|
|
+ item.name
|
|
|
+ }}</a>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="swiper-wrap" :style="{ background: color }">
|
|
|
+ <div class="container" style="width:1280px;">
|
|
|
+ <div v-if="$store.state.TENANT_NANE == '680980002459417532'">
|
|
|
+ <div class="left-box">
|
|
|
+ <div class="left-box__header">课程导航</div>
|
|
|
+ <div class="left-box__body">
|
|
|
+ <div class="bg"></div>
|
|
|
+ <div class="slide-list">
|
|
|
+ <div
|
|
|
+ class="slide-list__item"
|
|
|
+ v-for="(type, typeItem) in typeList"
|
|
|
+ :key="'type' + typeItem"
|
|
|
+ >
|
|
|
+ <div class="title" @click="goCourse(type)">
|
|
|
+ {{ type.educationName }}
|
|
|
+ </div>
|
|
|
+ <ul class="nav">
|
|
|
+ <li
|
|
|
+ v-for="(slideItem, slideIndex) in slideList[typeItem]"
|
|
|
+ :key="'item' + slideIndex"
|
|
|
+ @click="goCourse(slideItem)"
|
|
|
+ >
|
|
|
+ <div class="text">
|
|
|
+ <!-- {{ slideItem.projectName }}-{{ slideItem.businessName }} -->
|
|
|
+ {{ slideItem.aliasName }}
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li
|
|
|
+ v-if="$store.state.TENANT_NANE == '680980002459417532'"
|
|
|
+ @click="goLink('https://cranesystem.gdcic.net:8080/')"
|
|
|
+ >
|
|
|
+ <span class="text"
|
|
|
+ >建筑施工特种作业人员
|
|
|
+ <span v-if="type.educationName == '考前培训'"
|
|
|
+ >（建筑电工、司索工、施工升降机）</span
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <ul class="list">
|
|
|
+ <li v-for="(item, index) in typeList" :key="index">
|
|
|
+ <div class="text">
|
|
|
+ <div class="text__title" @click="goCourse(item)">
|
|
|
+ <span>{{ item.educationName }}</span>
|
|
|
+ <i
|
|
|
+ class="el-icon-arrow-right"
|
|
|
+ style="float: right;margin-right: 10px;"
|
|
|
+ ></i>
|
|
|
+ </div>
|
|
|
+ <div class="text__desc">
|
|
|
+ <a
|
|
|
+ @click="goCourse(aItem)"
|
|
|
+ class="item"
|
|
|
+ v-for="(aItem, aIndex) in item.list"
|
|
|
+ :key="'aItem' + aIndex"
|
|
|
+ >
|
|
|
+ <!-- {{ aItem.projectName }}-{{ aItem.businessName }} -->
|
|
|
+ {{ aItem.aliasName }}
|
|
|
+ </a>
|
|
|
+ <a
|
|
|
+ v-if="$store.state.TENANT_NANE == '680980002459417532'"
|
|
|
+ @click="goLink('https://cranesystem.gdcic.net:8080/')"
|
|
|
+ class="item"
|
|
|
+ >建筑施工特种作业人员<span
|
|
|
+ v-if="item.educationName == '考前培训'"
|
|
|
+ >（建筑电工、司索工、施工升降机）</span
|
|
|
+ ></a
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <template v-else>
|
|
|
+ <div class="left-box">
|
|
|
+ <div class="left-box__header">课程导航</div>
|
|
|
+ <div class="left-box__body">
|
|
|
+ <div class="bg"></div>
|
|
|
+ <div class="slide-list">
|
|
|
+ <div
|
|
|
+ class="slide-list__item"
|
|
|
+ v-for="(type, typeItem) in typeList"
|
|
|
+ :key="'type' + typeItem"
|
|
|
+ >
|
|
|
+ <div class="title" @click="goCourse(type)">
|
|
|
+ {{ type.educationName }}
|
|
|
+ </div>
|
|
|
+ <ul class="nav">
|
|
|
+ <li
|
|
|
+ v-for="(slideItem, slideIndex) in slideList[typeItem]"
|
|
|
+ :key="'item' + slideIndex"
|
|
|
+ @click="goCourse(slideItem)"
|
|
|
+ >
|
|
|
+ <div class="text">
|
|
|
+ <!-- {{ slideItem.projectName }}-{{ slideItem.businessName }} -->
|
|
|
+ {{ slideItem.aliasName }}
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li
|
|
|
+ v-if="$store.state.TENANT_NANE == '680980002459417532'"
|
|
|
+ @click="goLink('https://cranesystem.gdcic.net:8080/')"
|
|
|
+ >
|
|
|
+ <span class="text"
|
|
|
+ >建筑施工特种作业人员
|
|
|
+ <span v-if="type.educationName == '考前培训'"
|
|
|
+ >（建筑电工、司索工、施工升降机）</span
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <ul class="list">
|
|
|
+ <li v-for="(item, index) in typeList" :key="index">
|
|
|
+ <div class="text">
|
|
|
+ <div class="text__title" @click="goCourse(item)">
|
|
|
+ <span>{{ item.educationName }}</span>
|
|
|
+ <i
|
|
|
+ class="el-icon-arrow-right"
|
|
|
+ style="float: right;margin-right: 10px;"
|
|
|
+ ></i>
|
|
|
+ </div>
|
|
|
+ <div class="text__desc">
|
|
|
+ <a
|
|
|
+ @click="goCourse(aItem)"
|
|
|
+ class="item"
|
|
|
+ v-for="(aItem, aIndex) in item.list"
|
|
|
+ :key="'aItem' + aIndex"
|
|
|
+ >
|
|
|
+ <!-- {{ aItem.projectName }}-{{ aItem.businessName }} -->
|
|
|
+ {{ aItem.aliasName }}
|
|
|
+ </a>
|
|
|
+ <a
|
|
|
+ v-if="$store.state.TENANT_NANE == '680980002459417532'"
|
|
|
+ @click="goLink('https://cranesystem.gdcic.net:8080/')"
|
|
|
+ class="item"
|
|
|
+ >建筑施工特种作业人员<span
|
|
|
+ v-if="item.educationName == '考前培训'"
|
|
|
+ >（建筑电工、司索工、施工升降机）</span
|
|
|
+ ></a
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="swiper" style="width:980px;">
|
|
|
+ <swiper
|
|
|
+ v-if="bannerList.length > 0"
|
|
|
+ ref="mySwiper"
|
|
|
+ @slideChangeTransitionStart="slideChangeTransitionStart($event)"
|
|
|
+ class=""
|
|
|
+ v-bind:options="swiperOptions"
|
|
|
+ >
|
|
|
+ <swiper-slide
|
|
|
+ v-for="(item, index) in bannerList"
|
|
|
+ v-bind:key="index"
|
|
|
+ @click.native="swiperJump(item)"
|
|
|
+ >
|
|
|
+ <img :src="$tools.splitImgHost(item.adverUrl)" alt="" />
|
|
|
+ </swiper-slide>
|
|
|
+
|
|
|
+ <div class="swiper-pagination" slot="pagination"></div>
|
|
|
+ <!-- <div class="swiper-button-prev" slot="button-prev"></div>
|
|
|
+ <div class="swiper-button-next" slot="button-next"></div> -->
|
|
|
+ </swiper>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="right-box">
|
|
|
+ <div class="bg"></div>
|
|
|
+ <div class="no-login" v-if="!userInfo">
|
|
|
+ <template v-if="loginType == 1">
|
|
|
+ <el-form :model="loginForm" ref="loginForm" :rules="loginRules">
|
|
|
+ <div class="input">
|
|
|
+ <el-form-item prop="account">
|
|
|
+ <el-input
|
|
|
+ autocomplete="new-password"
|
|
|
+ v-model="loginForm.account"
|
|
|
+ @keyup.enter.native="login"
|
|
|
+ :placeholder="
|
|
|
+ dualStatus ? '请输入手机号' : '请输入手机号或身份证号'
|
|
|
+ "
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div class="input">
|
|
|
+ <el-form-item prop="pwd">
|
|
|
+ <el-input
|
|
|
+ autocomplete="new-password"
|
|
|
+ type="password"
|
|
|
+ v-model="loginForm.pwd"
|
|
|
+ placeholder="请输入密码"
|
|
|
+ @keyup.enter.native="login"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div class="input" v-if="dualStatus">
|
|
|
+ <el-form-item prop="code">
|
|
|
+ <el-input
|
|
|
+ autocomplete="new-password"
|
|
|
+ v-model="loginForm.code"
|
|
|
+ placeholder="请输入验证码"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ slot="suffix"
|
|
|
+ @click="getLoginSms(1)"
|
|
|
+ class="btn"
|
|
|
+ >{{
|
|
|
+ countDown == 0
|
|
|
+ ? "获取验证码"
|
|
|
+ : `${countDown}秒重新获取`
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ class="submit"
|
|
|
+ @click="login()"
|
|
|
+ :loading="isLogin"
|
|
|
+ >登录</el-button
|
|
|
+ >
|
|
|
+ <div class="bottom-text">
|
|
|
+ <!-- <a class="text" @click="loginType = 2">手机验证码登录</a>
|
|
|
+ <a class="text" @click="go('/login?state=2')">注册</a> -->
|
|
|
+ </div>
|
|
|
+ <div class="dis_flex" v-if="false">
|
|
|
+ <div class="dis_flex_wxloginImg">
|
|
|
+ <img src="@/assets/wx.png" alt="" @click="wxLoginFunc" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="loginType == 2">
|
|
|
+ <el-form
|
|
|
+ :model="loginSmsForm"
|
|
|
+ ref="loginSmsForm"
|
|
|
+ :rules="loginSmsRules"
|
|
|
+ >
|
|
|
+ <div class="input">
|
|
|
+ <el-form-item prop="tel">
|
|
|
+ <el-input
|
|
|
+ autocomplete="new-password"
|
|
|
+ v-model="loginSmsForm.tel"
|
|
|
+ placeholder="请输入手机号"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div class="input">
|
|
|
+ <el-form-item prop="code">
|
|
|
+ <el-input
|
|
|
+ autocomplete="new-password"
|
|
|
+ v-model="loginSmsForm.code"
|
|
|
+ placeholder="请输入验证码"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ slot="suffix"
|
|
|
+ @click="getLoginSms(2)"
|
|
|
+ class="btn"
|
|
|
+ >{{
|
|
|
+ countDown == 0
|
|
|
+ ? "获取验证码"
|
|
|
+ : `${countDown}秒重新获取`
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ class="submit"
|
|
|
+ :loading="isloginSms"
|
|
|
+ @click="loginSms()"
|
|
|
+ >登录</el-button
|
|
|
+ >
|
|
|
+ <div class="bottom-text">
|
|
|
+ <a class="text" @click="loginType = 1">账号密码登录</a>
|
|
|
+ <a class="text" @click="go('/login?state=2')">注册</a>
|
|
|
+ </div>
|
|
|
+ <div class="dis_flex" v-if="false">
|
|
|
+ <div class="dis_flex_wxloginImg">
|
|
|
+ <img src="@/assets/wx.png" alt="" @click="wxLoginFunc" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="has-login" v-else>
|
|
|
+ <div class="userinfo">
|
|
|
+ <img src="@/assets/ava.png" class="avatar" alt="" />
|
|
|
+ <div class="nickname">{{ userInfo && userInfo.realname }}</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="type-list">
|
|
|
+ <div
|
|
|
+ class="type-list__item"
|
|
|
+ @click="go('/person-center/my-course')"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ src="@/assets/kc.png"
|
|
|
+ alt=""
|
|
|
+ style="width:64px;height:64px;"
|
|
|
+ />
|
|
|
+ <div class="text">课程</div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="type-list__item"
|
|
|
+ @click="go('/person-center/my-bank')"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ src="@/assets/tk.png"
|
|
|
+ alt=""
|
|
|
+ style="width:64px;height:64px;"
|
|
|
+ />
|
|
|
+ <div class="text">题库</div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="type-list__item"
|
|
|
+ @click="go('/person-center/my-order')"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ src="@/assets/dd.png"
|
|
|
+ alt=""
|
|
|
+ style="width:64px;height:64px;"
|
|
|
+ />
|
|
|
+ <div class="text">订单</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="history">
|
|
|
+ <div class="btn">上次播放</div>
|
|
|
+ <div class="title" @click="goLast">
|
|
|
+ {{ recordList.goodsName }}
|
|
|
+ </div>
|
|
|
+ <div class="progress">
|
|
|
+ <span
|
|
|
+ >已学{{
|
|
|
+ toFixed(
|
|
|
+ (recordList.videoCurrentTime /
|
|
|
+ recordList.durationTime) *
|
|
|
+ 100
|
|
|
+ )
|
|
|
+ }}%</span
|
|
|
+ >
|
|
|
+ <span>{{ recordList.date }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+ <setion class="course">
|
|
|
+
|
|
|
+ <div class="tabs_box container" style="margin-top:30px;">
|
|
|
+ <ul class="tabs_ul">
|
|
|
+ <li
|
|
|
+ v-for="(item, index) in tab"
|
|
|
+ :key="index"
|
|
|
+ @click="handleClick(item)"
|
|
|
+ :class="activeName == item.value ? 'active' : null"
|
|
|
+ >
|
|
|
+ {{ item.label }}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <el-main class="tab_content container" style="display: flex;padding: 20px 0px;font-size: 18px;">
|
|
|
+ <template v-if="apiList[activeName].length > 0">
|
|
|
+ <ul class="c">
|
|
|
+ <li
|
|
|
+ v-for="(item, index) in apiList[activeName].slice(0, 5)"
|
|
|
+ :key="index"
|
|
|
+ @click="jumpInfo(item)"
|
|
|
+ >
|
|
|
+ <div class="tit" :title="item.title">
|
|
|
+ {{ item.title }}
|
|
|
+ </div>
|
|
|
+ <div class="time">
|
|
|
+ {{ $tools.timestampToTime(item.createTime, false, false) }}
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="center"></div>
|
|
|
+ <ul class="c">
|
|
|
+ <li
|
|
|
+ v-for="(item, index) in apiList[activeName].slice(5, 10)"
|
|
|
+ :key="index"
|
|
|
+ @click="jumpInfo(item)"
|
|
|
+ >
|
|
|
+ <div class="tit" :title="item.title">
|
|
|
+ {{ item.title }}
|
|
|
+ </div>
|
|
|
+ <div class="time">
|
|
|
+ {{ $tools.timestampToTime(item.createTime, false, false) }}
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </template>
|
|
|
+ <el-empty
|
|
|
+ :image-size="100"
|
|
|
+ description="暂无数据"
|
|
|
+ style="margin: 0 auto"
|
|
|
+ v-else
|
|
|
+ ></el-empty>
|
|
|
+ </el-main>
|
|
|
+ <el-pagination
|
|
|
+ v-if="apiList[activeName].length > 0"
|
|
|
+ :pager-count="5"
|
|
|
+ class="paginations"
|
|
|
+ style="text-align: center"
|
|
|
+ @current-change="handleCurrentChanges"
|
|
|
+ :current-page.sync="formData.pageindex"
|
|
|
+ :page-size="formData.pagesize"
|
|
|
+ layout="total, prev, pager, next"
|
|
|
+ :total="total"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </setion>
|
|
|
+ <section
|
|
|
+ class="course"
|
|
|
+ v-if="$store.state.other.course == 1 && courseName.length > 0"
|
|
|
+ >
|
|
|
+ <div class="container">
|
|
|
+ <div class="course__header">
|
|
|
+ <div class="lefts">
|
|
|
+ <div class="title">推荐课程</div>
|
|
|
+ <div class="tabs">
|
|
|
+ <template v-for="(item, index) in courseName">
|
|
|
+ <div
|
|
|
+ v-if="index <= 7"
|
|
|
+ :key="index"
|
|
|
+ class="tab"
|
|
|
+ :class="couIndex === index ? 'active' : ''"
|
|
|
+ @click="changeCou(item.recommendId, index)"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="course__footer">
|
|
|
+ <div class="btn" @click="go('/course-list')">查看<br />更多</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <div class="tabs">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in goodsList1"
|
|
|
+ :key="index"
|
|
|
+ class="tab"
|
|
|
+ :class="active1 === index ? 'active' : ''"
|
|
|
+ @click="active1 = index"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="course__body">
|
|
|
+ <p
|
|
|
+ v-if="
|
|
|
+ !goodsList1[active1] ||
|
|
|
+ !goodsList1[active1].goodsList ||
|
|
|
+ goodsList1[active1].goodsList.length === 0
|
|
|
+ "
|
|
|
+ class="text_align"
|
|
|
+ >
|
|
|
+ 该培训项目无推荐课程
|
|
|
+ </p>
|
|
|
+ <ul v-else class="list clearfix">
|
|
|
+ <template v-for="(item, index) in goodsList1[active1].goodsList">
|
|
|
+ <li class="course-item" :key="index" v-if="index < 15">
|
|
|
+ <GoodsItem :item="item"></GoodsItem>
|
|
|
+ </li>
|
|
|
+ </template>
|
|
|
+ </ul>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <div class="course__body">
|
|
|
+ <p v-if="!goodsList1.length" class="text_align">
|
|
|
+ 该培训项目无推荐课程
|
|
|
+ </p>
|
|
|
+ <ul v-else class="list clearfix">
|
|
|
+ <template v-for="(item, index) in goodsList1">
|
|
|
+ <li class="course-item" :key="index">
|
|
|
+ <GoodsItem :item="item"></GoodsItem>
|
|
|
+ </li>
|
|
|
+ </template>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="pagination">
|
|
|
+ <el-pagination
|
|
|
+ @current-change="currentChangeCou"
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="paramList[0].total"
|
|
|
+ :current-page.sync="paramList[0].currentPage"
|
|
|
+ :page-size="paramList[0].pageSize"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- <div class="course__footer">
|
|
|
+ <div class="btn" @click="go('/course-list')">查看更多</div>
|
|
|
+ </div> -->
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ class="bank"
|
|
|
+ v-if="$store.state.other.bank == 1 && bankName.length > 0"
|
|
|
+ >
|
|
|
+ <div class="container">
|
|
|
+ <div class="bank__header">
|
|
|
+ <div class="lefts">
|
|
|
+ <div class="title">推荐题库</div>
|
|
|
+ <div class="tabs">
|
|
|
+ <template v-for="(item, index) in bankName">
|
|
|
+ <div
|
|
|
+ v-if="index <= 7"
|
|
|
+ :key="index"
|
|
|
+ class="tab"
|
|
|
+ :class="bankIndex === index ? 'active' : ''"
|
|
|
+ @click="changebank(item.recommendId, index)"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div></template
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="bank__footer">
|
|
|
+ <div class="btn" @click="go('/bank-list')">查看<br />更多</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <div class="tabs">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in goodsList2"
|
|
|
+ :key="index"
|
|
|
+ class="tab"
|
|
|
+ :class="active2 === index ? 'active' : ''"
|
|
|
+ @click="active2 = index"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="bank__body">
|
|
|
+ <p
|
|
|
+ v-if="
|
|
|
+ !goodsList2[active2] ||
|
|
|
+ !goodsList2[active2].goodsList ||
|
|
|
+ goodsList2[active2].goodsList.length === 0
|
|
|
+ "
|
|
|
+ class="text_align"
|
|
|
+ >
|
|
|
+ 该培训项目无推荐题库
|
|
|
+ </p>
|
|
|
+ <ul v-else class="list clearfix">
|
|
|
+ <template v-for="(item, index) in goodsList2[active2].goodsList">
|
|
|
+ <li
|
|
|
+ class="bank-item"
|
|
|
+ v-if="index < 15"
|
|
|
+ :key="index"
|
|
|
+ @click="goodsDetail(item, 2)"
|
|
|
+ >
|
|
|
+ <GoodsItem :item="item"></GoodsItem>
|
|
|
+ </li>
|
|
|
+ </template>
|
|
|
+ </ul>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <div class="bank__body">
|
|
|
+ <p v-if="!goodsList2.length" class="text_align">
|
|
|
+ 该培训项目无推荐题库
|
|
|
+ </p>
|
|
|
+ <ul v-else class="list clearfix">
|
|
|
+ <template v-for="(item, index) in goodsList2">
|
|
|
+ <!-- @click="goodsDetail(item, 2)" -->
|
|
|
+ <li class="bank-item" :key="index">
|
|
|
+ <GoodsItem :item="item"></GoodsItem>
|
|
|
+ </li>
|
|
|
+ </template>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="pagination">
|
|
|
+ <el-pagination
|
|
|
+ @current-change="currentChangeBank"
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="paramList[1].total"
|
|
|
+ :current-page.sync="paramList[1].currentPage"
|
|
|
+ :page-size="paramList[1].pageSize"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="bindShow"
|
|
|
+ width="348px"
|
|
|
+ center
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :close-on-press-escape="false"
|
|
|
+ class="bind"
|
|
|
+ >
|
|
|
+ <a class="bind__close" @click="bindNext">X</a>
|
|
|
+ <div class="bind__header">关联学员身份</div>
|
|
|
+ <div class="bind__body">
|
|
|
+ <el-form
|
|
|
+ class="bind-form"
|
|
|
+ ref="bindForm"
|
|
|
+ :model="bindForm"
|
|
|
+ :rules="bindForm"
|
|
|
+ >
|
|
|
+ <el-form-item prop="realname"
|
|
|
+ ><el-input placeholder="真实姓名" v-model="bindForm.realname">
|
|
|
+ </el-input
|
|
|
+ ></el-form-item>
|
|
|
+ <el-form-item prop="idCard">
|
|
|
+ <el-input
|
|
|
+ placeholder="身份证号码"
|
|
|
+ v-model="bindForm.idCard"
|
|
|
+ maxlength="18"
|
|
|
+ >
|
|
|
+ </el-input
|
|
|
+ ></el-form-item>
|
|
|
+ <el-button
|
|
|
+ class="submit"
|
|
|
+ type="primary"
|
|
|
+ :loading="isBind"
|
|
|
+ round
|
|
|
+ @click="bind()"
|
|
|
+ >确定</el-button
|
|
|
+ >
|
|
|
+ <div class="bind-next" @click="bindNext">下次再关联</div>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <ToolBar></ToolBar>
|
|
|
+ <Footer></Footer>
|
|
|
+ <wx-login ref="wxLogin" @wxLoginBack="wxLoginBack"></wx-login>
|
|
|
+
|
|
|
+ <RebuildModal
|
|
|
+ ref="rebuildModal"
|
|
|
+ @rebuildSubmit="rebuildSubmit($event)"
|
|
|
+ ></RebuildModal>
|
|
|
+ <div id="packPageDialog" v-if="packPageStatus">
|
|
|
+ <div class="img-box">
|
|
|
+ <img
|
|
|
+ src="@/assets/img/tcs.png"
|
|
|
+ alt=""
|
|
|
+ @click="swiperJump({ jumpType: 2, jumpUrl: '/packPage' })"
|
|
|
+ />
|
|
|
+ <i class="el-icon-circle-close" @click="closePackPage"></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <script>
|
|
|
+ import RebuildModal from "@/components/rebuildModal";
|
|
|
+ import wxLogin from "@/components/wxLogin/index";
|
|
|
+ import Footer from "@/components/footer/index";
|
|
|
+ import ToolBar from "@/components/toolbar/index";
|
|
|
+ import GoodsItem from "@/components/goodsItem/index";
|
|
|
+ import { swiper, swiperSlide } from "vue-awesome-swiper";
|
|
|
+ import { mapGetters, mapMutations } from "vuex";
|
|
|
+ import { checkFunc } from "@/router";
|
|
|
+ import "swiper/swiper-bundle.css";
|
|
|
+ export default {
|
|
|
+ name: "Home",
|
|
|
+ components: {
|
|
|
+ swiper,
|
|
|
+ swiperSlide,
|
|
|
+ Footer,
|
|
|
+ GoodsItem,
|
|
|
+ ToolBar,
|
|
|
+ wxLogin,
|
|
|
+ RebuildModal
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["userInfo", "token", "header", "nav", "msgCount", "mobile"]),
|
|
|
+
|
|
|
+ showNav: function() {
|
|
|
+ return function(list) {
|
|
|
+ var newList = [];
|
|
|
+ if (list) {
|
|
|
+ newList = list.filter(item => {
|
|
|
+ return item.status === 1;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return newList;
|
|
|
+ };
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dualStatus: false, //是否双重校验
|
|
|
+ msgShow: false,
|
|
|
+ msgData: {},
|
|
|
+ showBox: false,
|
|
|
+ indexToken: "",
|
|
|
+ indexUserAccount: "",
|
|
|
+ colors: [],
|
|
|
+ color: "",
|
|
|
+ countDown: 0,
|
|
|
+ countDownTimer: null,
|
|
|
+ loginRules: {
|
|
|
+ account: [
|
|
|
+ { required: true, trigger: "blur", message: "请输入手机号/身份证号" }
|
|
|
+ ],
|
|
|
+ pwd: [{ required: true, trigger: "blur", message: "请输入密码" }]
|
|
|
+ },
|
|
|
+ loginSmsRules: {
|
|
|
+ code: [{ required: true, trigger: "blur", message: "请输入验证码" }],
|
|
|
+ tel: [{ required: true, trigger: "blur", message: "请输入手机号" }]
|
|
|
+ },
|
|
|
+ bindRules: {
|
|
|
+ code: [{ required: true, trigger: "blur", message: "请输入验证码" }],
|
|
|
+ tel: [{ required: true, trigger: "blur", message: "请输入手机号" }],
|
|
|
+ pwd: [{ required: true, trigger: "blur", message: "请输入密码" }],
|
|
|
+ read: [{ required: true, trigger: "blur", message: "请勾选服务协议" }]
|
|
|
+ },
|
|
|
+ bindShow: false,
|
|
|
+ loginType: 1,
|
|
|
+ loginForm: {},
|
|
|
+ loginSmsForm: {},
|
|
|
+ bindForm: {},
|
|
|
+ isLogin: false,
|
|
|
+ isLoginSms: false,
|
|
|
+ isBind: false,
|
|
|
+ getLoginCodeLock: false,
|
|
|
+
|
|
|
+ isloginSms: false,
|
|
|
+ swiperOptions: {
|
|
|
+ loop: true,
|
|
|
+ observer: true,
|
|
|
+ observeParents: true,
|
|
|
+ speed: 300,
|
|
|
+ autoplayDisableOnInteraction: false,
|
|
|
+ autoplayStopOnLast: false,
|
|
|
+ autoplay: {
|
|
|
+ delay: 1000,
|
|
|
+ disableOnInteraction: false
|
|
|
+ },
|
|
|
+ // 显示分页
|
|
|
+ pagination: {
|
|
|
+ el: ".swiper-pagination",
|
|
|
+ clickable: true //允许分页点击跳转
|
|
|
+ },
|
|
|
+ // 设置点击箭头
|
|
|
+ navigation: {
|
|
|
+ nextEl: ".swiper-button-next",
|
|
|
+ prevEl: ".swiper-button-prev"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ bannerList: [],
|
|
|
+ goodsList1: [{}], //推荐课程列表
|
|
|
+ goodsList2: [{}], //推荐题库列表
|
|
|
+ typeList: [],
|
|
|
+ slideList: [],
|
|
|
+ active1: 0, //推荐课程index
|
|
|
+ active2: 0, //推荐题库index
|
|
|
+ searchKey: "",
|
|
|
+ type: "1",
|
|
|
+ recordList: {},
|
|
|
+ params: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10
|
|
|
+ },
|
|
|
+ paramList: [
|
|
|
+ {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 15,
|
|
|
+ total: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 15,
|
|
|
+ total: 0
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ total1: 0,
|
|
|
+ total2: 0,
|
|
|
+ courseName: [],
|
|
|
+ bankName: [],
|
|
|
+ couIndex: 0,
|
|
|
+ bankIndex: 0,
|
|
|
+ courseId: "",
|
|
|
+ bankId: "",
|
|
|
+ packPageStatus: false,
|
|
|
+ activeName: "d1",
|
|
|
+ tab: [
|
|
|
+ { label: "开班消息", value: "d1" },
|
|
|
+ { label: "最新消息", value: "d2" },
|
|
|
+ { label: "政策法规", value: "d3" },
|
|
|
+ { label: "通知公告", value: "d4" },
|
|
|
+ ],
|
|
|
+ apiList: {
|
|
|
+ d1: [],
|
|
|
+ d2: [],
|
|
|
+ d3: [],
|
|
|
+ d4: [],
|
|
|
+ },
|
|
|
+ d0Total: 0,
|
|
|
+ total: 0,
|
|
|
+ formData: {
|
|
|
+ pagesize: 10,
|
|
|
+ pageindex: 1,
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.goodsList1 = [];
|
|
|
+ this.goodsList2 = [];
|
|
|
+ this.courseLists();
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ //双重校验
|
|
|
+ this.$request.dualAuth().then(res => {
|
|
|
+ this.dualStatus = res.data === "1" ? true : false;
|
|
|
+ if (this.dualStatus) {
|
|
|
+ this.loginRules["account"][0].message = "请输入手机号";
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (this.userInfo) {
|
|
|
+ this.getRecord();
|
|
|
+ // this.getmsg();
|
|
|
+ this.getMsgCount();
|
|
|
+ }
|
|
|
+ // this.getActivityList();
|
|
|
+ // this.color = this.colors[0];
|
|
|
+ this.advertisingList();
|
|
|
+ this.educationTypeList();
|
|
|
+ this.getd1();
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ userInfo(val) {
|
|
|
+ if (val) {
|
|
|
+ this.getRecord();
|
|
|
+ // this.getmsg();
|
|
|
+ this.getMsgCount();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ closePackPage() {
|
|
|
+ this.packPageStatus = false;
|
|
|
+ this.$store.state.packPageStatus = false;
|
|
|
+ },
|
|
|
+ //课程
|
|
|
+ courseLists() {
|
|
|
+ this.$request
|
|
|
+ .appCommonActivityRecommendList({ platform: 2, status: 1 })
|
|
|
+ .then(async res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ let list = res.rows || [];
|
|
|
+ //课程
|
|
|
+ this.courseName = list
|
|
|
+ .filter(x => x.type == 1)
|
|
|
+ .sort((a, b) => a.sort - b.sort)
|
|
|
+ .map(x => {
|
|
|
+ return {
|
|
|
+ name: x.name,
|
|
|
+ recommendId: x.recommendId
|
|
|
+ };
|
|
|
+ });
|
|
|
+ console.log("couIndex", this.couIndex, this.courseName);
|
|
|
+ //题库
|
|
|
+ this.bankName = list
|
|
|
+ .filter(x => x.type == 2)
|
|
|
+ .sort((a, b) => a.sort - b.sort)
|
|
|
+ .map(x => {
|
|
|
+ return {
|
|
|
+ name: x.name,
|
|
|
+ recommendId: x.recommendId
|
|
|
+ };
|
|
|
+ });
|
|
|
+ if (this.courseName.length) {
|
|
|
+ this.courseId = this.courseName[0].recommendId;
|
|
|
+ let list1 = await this.getGoodsList(
|
|
|
+ this.courseName[0].recommendId,
|
|
|
+ 0
|
|
|
+ );
|
|
|
+ console.log(list1, "list1");
|
|
|
+ this.goodsList1.push(...list1);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.bankName.length) {
|
|
|
+ this.bankId = this.bankName[0].recommendId;
|
|
|
+ let list2 = await this.getGoodsList(
|
|
|
+ this.bankName[0].recommendId,
|
|
|
+ 1
|
|
|
+ );
|
|
|
+ this.goodsList2.push(...list2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getGoodsList(recommendId, num) {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ this.$axios({
|
|
|
+ url: `/app/common/activity/recommend/goodsList`,
|
|
|
+ method: "get",
|
|
|
+ params: {
|
|
|
+ pageNum: this.paramList[num].pageNum,
|
|
|
+ pageSize: this.paramList[num].pageSize,
|
|
|
+ recommendId: recommendId
|
|
|
+ },
|
|
|
+ noToken: true
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.paramList[num].total = res.total;
|
|
|
+ resolve(res.rows);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async currentChangeCou(val) {
|
|
|
+ console.log("vallll", val);
|
|
|
+ this.paramList[0].pageNum = val;
|
|
|
+ this.goodsList1 = [];
|
|
|
+ let list1 = await this.getGoodsList(this.courseId, 0);
|
|
|
+ this.goodsList1.push(...list1);
|
|
|
+ },
|
|
|
+ async changeCou(recommendId, index) {
|
|
|
+ this.couIndex = index;
|
|
|
+ this.courseId = recommendId;
|
|
|
+ this.paramList[0].pageNum = 1;
|
|
|
+ this.paramList[0].currentPage = 1;
|
|
|
+ this.goodsList1 = [];
|
|
|
+ let list1 = await this.getGoodsList(recommendId, 0);
|
|
|
+ this.goodsList1.push(...list1);
|
|
|
+ },
|
|
|
+ async currentChangeBank(val) {
|
|
|
+ console.log("val--", val);
|
|
|
+ this.paramList[1].pageNum = val;
|
|
|
+ this.goodsList2 = [];
|
|
|
+ let list2 = await this.getGoodsList(this.bankId, 1);
|
|
|
+ this.goodsList2.push(...list2);
|
|
|
+ },
|
|
|
+ async changebank(recommendId, index) {
|
|
|
+ this.bankIndex = index;
|
|
|
+ this.bankId = recommendId;
|
|
|
+ this.paramList[1].pageNum = 1;
|
|
|
+ this.paramList[1].currentPage = 1;
|
|
|
+ this.goodsList2 = [];
|
|
|
+ let list2 = await this.getGoodsList(recommendId, 1);
|
|
|
+ this.goodsList2.push(...list2);
|
|
|
+ },
|
|
|
+ getd1() {
|
|
|
+ console.log('d1')
|
|
|
+ this.$request
|
|
|
+ .consultationlist({ type: 3, ...this.formData })
|
|
|
+ .then((res) => {
|
|
|
+ // console.log('d1',res)
|
|
|
+ this.apiList["d1"] = res.rows || [];
|
|
|
+ this.total = res.total;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getd2() {
|
|
|
+ this.$request
|
|
|
+ .consultationlist(this.formData)
|
|
|
+ .then((res) => {
|
|
|
+ this.apiList["d2"] = res.rows || [];
|
|
|
+ this.total = res.total;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getd3() {
|
|
|
+ this.$request
|
|
|
+ .consultationlist({ type: 1, ...this.formData })
|
|
|
+ .then((res) => {
|
|
|
+ this.apiList["d3"] = res.rows || [];
|
|
|
+ this.total = res.total;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getd4() {
|
|
|
+ this.$request
|
|
|
+ .consultationlist({ type: 2, ...this.formData })
|
|
|
+ .then((res) => {
|
|
|
+ this.apiList["d4"] = res.rows || [];
|
|
|
+ this.total = res.total;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleCurrentChanges(e) {
|
|
|
+ this.formData.pageindex = e;
|
|
|
+ this[`get${this.activeName}`]();
|
|
|
+ },
|
|
|
+ handleClick(tab) {
|
|
|
+ this.activeName = tab.value;
|
|
|
+ this.formData.pageindex = 1;
|
|
|
+ this[`get${tab.value}`]();
|
|
|
+ },
|
|
|
+ jumpInfo(item) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/notice-detail",
|
|
|
+ query: {
|
|
|
+ id: item.id
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 关闭消息
|
|
|
+ */
|
|
|
+ clearMsg() {
|
|
|
+ let ary = {
|
|
|
+ userId: this.msgData.userId,
|
|
|
+ msgId: this.msgData.id,
|
|
|
+ updateTime: new Date(new Date().toLocaleDateString()).getTime()
|
|
|
+ };
|
|
|
+ localStorage.setItem("msg", JSON.stringify(ary));
|
|
|
+ this.msgShow = false;
|
|
|
+ },
|
|
|
+ rebuildSubmit(item) {
|
|
|
+ this.$router.push({
|
|
|
+ path: `/my-course-detail/${item.goodsId}`,
|
|
|
+ query: {
|
|
|
+ gradeId: item.gradeId,
|
|
|
+ orderGoodsId: item.orderGoodsId,
|
|
|
+ rebuild: 1
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getGoodsData() {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ this.$request.goodsDetail(this.msgData.goodsId).then(res => {
|
|
|
+ resolve(res.data);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 前往学习
|
|
|
+ */
|
|
|
+ async newGoToStudy() {
|
|
|
+ let item = await this.getGoodsData();
|
|
|
+ if (item.goodsType == 1) {
|
|
|
+ this.sysTime = this.$tools.timest();
|
|
|
+ item.orderGoodsId = this.msgData.orderGoodsId;
|
|
|
+ this.canJump(item).then(res => {
|
|
|
+ this.clearMsg();
|
|
|
+ this.$router.push({
|
|
|
+ path: `/my-course-detail/${item.goodsId}`,
|
|
|
+ query: {
|
|
|
+ gradeId: item.gradeId,
|
|
|
+ orderGoodsId: item.orderGoodsId,
|
|
|
+ courseId: res.rows[0].courseId || ""
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ // arsty = '立刻学习';
|
|
|
+
|
|
|
+ //题库
|
|
|
+ } else if (item.goodsType == 2) {
|
|
|
+ this.clearMsg();
|
|
|
+ this.$router.push({
|
|
|
+ path: "/person-center/my-bank/bank-detail/" + item.goodsId,
|
|
|
+ query: {
|
|
|
+ orderGoodsId: item.orderGoodsId
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ canJump(item) {
|
|
|
+ return new Promise(resolve => {
|
|
|
+ this.$request
|
|
|
+ .orderInfo({
|
|
|
+ orderGoodsId: item.orderGoodsId
|
|
|
+ })
|
|
|
+ .then(async res => {
|
|
|
+ let items = res.data;
|
|
|
+ let currentTime = this.$tools.timest();
|
|
|
+ if (items.interfaceAccountId > 0) {
|
|
|
+ //学习账号已开通
|
|
|
+
|
|
|
+ if (items.learnStatus == 1) {
|
|
|
+ //跳转第三方h5
|
|
|
+
|
|
|
+ const confirmText = [
|
|
|
+ "您的学习账号已经开通，请按照步骤操作，进行学习。",
|
|
|
+ "1.点击【跳转学习网址】按钮",
|
|
|
+ "2.打开学习网址后，选择【个人用户】进行登录",
|
|
|
+ "(1)账号：您个人的身份证号码",
|
|
|
+ "(2)密码：身份证号码，再加111111"
|
|
|
+ ];
|
|
|
+ const newDatas = [];
|
|
|
+ const h = this.$createElement;
|
|
|
+ for (const i in confirmText) {
|
|
|
+ newDatas.push(h("p", null, confirmText[i]));
|
|
|
+ }
|
|
|
+ this.$confirm(h("div", null, newDatas), "温馨提示", {
|
|
|
+ confirmButtonText: "跳转学习网址",
|
|
|
+ cancelButtonText: "关闭",
|
|
|
+ closeOnClickModal: false,
|
|
|
+ closeOnPressEscape: false,
|
|
|
+ distinguishCancelAndClose: false,
|
|
|
+ showClose: false
|
|
|
+ })
|
|
|
+ .then(_ => {
|
|
|
+ window.open("http://admin.zhujianpeixun.com/", "_blank");
|
|
|
+ })
|
|
|
+ .catch(_ => {});
|
|
|
+
|
|
|
+ return;
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message:
|
|
|
+ "您的学习账号未开通，请稍后再尝试，有疑问，请联系020-87085982！"
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // //内部系统
|
|
|
+ // if (items.interfacePushId > 0 && items.officialStatus != 1) {
|
|
|
+ // this.$message({
|
|
|
+ // type: "warning",
|
|
|
+ // message:
|
|
|
+ // "机构正在为您报名中，请耐心等待，有疑问请联系020-87085982！",
|
|
|
+ // });
|
|
|
+ // return;
|
|
|
+ // }
|
|
|
+ if (items.goodsType !== 6) {
|
|
|
+ if (
|
|
|
+ this.sysTime <= items.serviceStartTime ||
|
|
|
+ this.sysTime >= items.serviceEndTime
|
|
|
+ ) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "不在学习服务期，不能进入学习"
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (
|
|
|
+ (items.classStartTime &&
|
|
|
+ this.sysTime <= items.classStartTime) ||
|
|
|
+ (items.classEndTime && this.sysTime >= items.classEndTime)
|
|
|
+ ) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "不在班级有效期，不能进入学习"
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (items.learningStatus == 2) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "开放学习时间待定，不能进入学习"
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (items.classStatus == 0) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "尚未开班，不能进入学习"
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (
|
|
|
+ items.learningStatus == 3 &&
|
|
|
+ this.sysTime < items.learningTimeStart
|
|
|
+ ) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "不在开放学习时间,不能进入学习"
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ let rebuildStatus = await this.courseGoodsRebuildStatus(
|
|
|
+ items.goodsId,
|
|
|
+ items.gradeId
|
|
|
+ );
|
|
|
+
|
|
|
+ if (rebuildStatus == 0) {
|
|
|
+ this.$refs.rebuildModal.showModal(items);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // if (item.educationName == "继续教育") {
|
|
|
+ this.$request
|
|
|
+ .lockLockStatus({
|
|
|
+ action: "jxjy"
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ //有其他端在操作，不能学习
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: res.msg
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ //可以学习
|
|
|
+ this.$request
|
|
|
+ .courseCourseList({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 1,
|
|
|
+ goodsId: items.goodsId,
|
|
|
+ gradeId: items.gradeId
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.rows.length) {
|
|
|
+ resolve(res);
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "课程内暂无可以学习的科目"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ // } else {
|
|
|
+ // this.$request
|
|
|
+ // .courseCourseList({
|
|
|
+ // pageNum: 1,
|
|
|
+ // pageSize: 1,
|
|
|
+ // goodsId: items.goodsId,
|
|
|
+ // gradeId: items.gradeId,
|
|
|
+ // })
|
|
|
+ // .then((res) => {
|
|
|
+ // if (res.rows.length) {
|
|
|
+ // resolve(res);
|
|
|
+ // } else {
|
|
|
+ // this.$message({
|
|
|
+ // type: "warning",
|
|
|
+ // message: "课程内暂无可以学习的科目",
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * @param {Object} goodsId 商品id
|
|
|
+ * 查询商品重修状态
|
|
|
+ */
|
|
|
+ courseGoodsRebuildStatus(goodsId, gradeId) {
|
|
|
+ return new Promise(resolve => {
|
|
|
+ this.$request
|
|
|
+ .courseGoodsRebuildStatus({
|
|
|
+ goodsId: goodsId,
|
|
|
+ gradeId: gradeId
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ resolve(res.data);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 微信登入
|
|
|
+ */
|
|
|
+ wxLoginFunc() {
|
|
|
+ this.$refs.wxLogin.openBoxs();
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 微信登入—返回数据
|
|
|
+ */
|
|
|
+ wxLoginBack(res) {
|
|
|
+ localStorage.setItem("user_account", res.data.user_account);
|
|
|
+ localStorage.setItem("token", res.data.token);
|
|
|
+ if (res.data.full_info) {
|
|
|
+ this.getInfo();
|
|
|
+ } else {
|
|
|
+ this.indexUserAccount = res.data.user_account;
|
|
|
+ this.indexToken = res.data.token;
|
|
|
+ this.isLogin = false;
|
|
|
+ // 弹窗
|
|
|
+ this.bindShow = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ goLast() {
|
|
|
+ if (this.recordList.goodsType == 6) {
|
|
|
+ this.go("/my-live-detail/" + this.recordList.goodsId, {
|
|
|
+ gradeId: this.recordList.gradeId,
|
|
|
+ orderGoodsId: this.recordList.orderGoodsId,
|
|
|
+ courseId: this.recordList.courseId
|
|
|
+ });
|
|
|
+ } else if (this.recordList.goodsType == 1) {
|
|
|
+ this.$router.push({
|
|
|
+ path: `/my-course-detail/${this.recordList.goodsId}`,
|
|
|
+ query: {
|
|
|
+ gradeId: this.recordList.gradeId,
|
|
|
+ orderGoodsId: this.recordList.orderGoodsId,
|
|
|
+ courseId: this.recordList.courseId,
|
|
|
+ chapterId: this.recordList.chapterId,
|
|
|
+ moduleId: this.recordList.moduleId,
|
|
|
+ sectionId: this.recordList.sectionId,
|
|
|
+ recordingUrl: this.recordList.recordingUrl,
|
|
|
+ liveUrl: this.recordList.liveUrl,
|
|
|
+ sectionType: this.recordList.sectionType,
|
|
|
+ liveStartTime: this.recordList.liveStartTime,
|
|
|
+ liveEndTime: this.recordList.liveEndTime
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ swiperJump(swiper) {
|
|
|
+ if (swiper.jumpType == 1) {
|
|
|
+ //无跳转
|
|
|
+ return;
|
|
|
+ } else if (swiper.jumpType == 2) {
|
|
|
+ //url
|
|
|
+ window.open(swiper.jumpUrl, "_blank");
|
|
|
+ } else if (swiper.jumpType == 3) {
|
|
|
+ //内部接口
|
|
|
+ this.$router.push({
|
|
|
+ path: swiper.jumpUrl
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleCommand(command) {
|
|
|
+ switch (command) {
|
|
|
+ case "1":
|
|
|
+ this.go("/person-center/my-course");
|
|
|
+ break;
|
|
|
+ case "2":
|
|
|
+ this.go("/person-center/my-bank");
|
|
|
+ break;
|
|
|
+
|
|
|
+ case "3":
|
|
|
+ this.go("/person-center/my-info");
|
|
|
+ break;
|
|
|
+ case "4":
|
|
|
+ this.$tools.exit();
|
|
|
+ break;
|
|
|
+ case "5":
|
|
|
+ console.log("------command:", command);
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ toFixed(num) {
|
|
|
+ if (num) {
|
|
|
+ let str = String(num).indexOf(".");
|
|
|
+
|
|
|
+ if (str != -1) {
|
|
|
+ return +num.toFixed(2);
|
|
|
+ } else {
|
|
|
+ return num;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ ...mapMutations(["setUserInfo", "getMsgCount"]),
|
|
|
+ /**
|
|
|
+ * 播放记录
|
|
|
+ */
|
|
|
+ getRecord() {
|
|
|
+ this.$request
|
|
|
+ .studRrecordListUserRecord({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 1
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.rows.length) {
|
|
|
+ this.recordList = res.rows[0];
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ search() {
|
|
|
+ if (!this.searchKey.trim()) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ duration: 2000,
|
|
|
+ message: "请输入搜索内容"
|
|
|
+ });
|
|
|
+
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let type = this.type;
|
|
|
+
|
|
|
+ //根据类型跳转题库或者列表页面
|
|
|
+ if (type == "1") {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/course-list",
|
|
|
+ query: {
|
|
|
+ searchKey: this.searchKey
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else if (type == "6") {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/live-list",
|
|
|
+ query: {
|
|
|
+ searchKey: this.searchKey
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/bank-list",
|
|
|
+ query: {
|
|
|
+ searchKey: this.searchKey
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 查看商品详情
|
|
|
+ */
|
|
|
+ goodsDetail(item, type) {
|
|
|
+ if (type === 1) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/course-detail/" + item.goodsId
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (type === 2) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/bank-detail/" + item.goodsId
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ educationTypeList() {
|
|
|
+ this.$request.educationTypeList().then(res => {
|
|
|
+ this.typeList = res.rows.slice(0, 5);
|
|
|
+ this.typeList.forEach((typeItem, index) => {
|
|
|
+ this.businessList(typeItem.id, index);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ businessList(educationId, index) {
|
|
|
+ this.$request
|
|
|
+ .businessList({ educationId })
|
|
|
+ .then(res => {
|
|
|
+ let rows = res.rows.filter(item => item.aliasName);
|
|
|
+ this.$set(this.slideList, index, rows);
|
|
|
+ if (rows.length >= 2) {
|
|
|
+ let newRows = rows.slice(0, 2);
|
|
|
+ let length = 0;
|
|
|
+ newRows.forEach(row => {
|
|
|
+ let str = row.projectName + "-" + row.businessName;
|
|
|
+ length = length + str.length;
|
|
|
+ });
|
|
|
+
|
|
|
+ if (length >= 7) {
|
|
|
+ this.$set(this.typeList[index], "list", rows.slice(0, 5));
|
|
|
+ } else {
|
|
|
+ this.$set(this.typeList[index], "list", rows.slice(0, length));
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$set(this.typeList[index], "list", rows);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ console.log(err, "err");
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 加入购物车
|
|
|
+ */
|
|
|
+ addCart(item) {
|
|
|
+ this.$request
|
|
|
+ .addCart({ goodsId: item.goodsId })
|
|
|
+ .then(res => {
|
|
|
+ if (res) {
|
|
|
+ this.getCartCount();
|
|
|
+ this.$message({
|
|
|
+ message: "加入购物车成功",
|
|
|
+ type: "success"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ if (err.code == 500) {
|
|
|
+ this.$message({
|
|
|
+ message: err.msg,
|
|
|
+ type: "warning"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取推荐商品
|
|
|
+ */
|
|
|
+ getActivityList() {
|
|
|
+ this.$request
|
|
|
+ .appCommonActivityRecommendList({ platform: 2, status: 1 })
|
|
|
+ .then(res => {
|
|
|
+ let goodsList1 = []; //推荐视频商品
|
|
|
+ let goodsList2 = []; //推荐题库商品
|
|
|
+ res.rows.forEach(item => {
|
|
|
+ if (item.type === 1) {
|
|
|
+ goodsList1.push(item);
|
|
|
+ }
|
|
|
+ if (item.type === 2) {
|
|
|
+ goodsList2.push(item);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.goodsList1 = goodsList1.sort((a, b) => a.sort - b.sort);
|
|
|
+ this.goodsList2 = goodsList2.sort((a, b) => a.sort - b.sort);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ goCourse(item) {
|
|
|
+ console.log("sdsf", item);
|
|
|
+ if (item.topicId) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/goodsTopic",
|
|
|
+ query: {
|
|
|
+ topicId: item.topicId
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$router.push({
|
|
|
+ path: "/course-list",
|
|
|
+ query: {
|
|
|
+ educationId: item.educationId ? item.educationId : item.id || "",
|
|
|
+ projectId: item.projectId || "",
|
|
|
+ businessId: item.educationId ? item.id : ""
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ slideChangeTransitionStart(e) {
|
|
|
+ this.color = this.colors[this.$refs.mySwiper.swiper.realIndex];
|
|
|
+ },
|
|
|
+ advertisingList() {
|
|
|
+ this.$request
|
|
|
+ .advertisinghomeLocationList({
|
|
|
+ platform: 2, //1小程序2PC网站
|
|
|
+ status: 1,
|
|
|
+ locationKey: "home-banner" //首页轮播KEY
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.swiperOptions.autoplay.delay = res.data[0].intervalTime * 1000;
|
|
|
+ /**
|
|
|
+ * 如果存在-调用轮播图列表
|
|
|
+ */
|
|
|
+ if (res.data.length) {
|
|
|
+ this.$request
|
|
|
+ .advertisingList({ locationId: res.data[0].locationId })
|
|
|
+ .then(res => {
|
|
|
+ if (res.rows.length < 2) {
|
|
|
+ this.swiperOptions.loop = false;
|
|
|
+ }
|
|
|
+ this.bannerList = res.rows;
|
|
|
+ this.colors = res.rows.map(item => {
|
|
|
+ if (
|
|
|
+ item.jumpUrl == "/packPage" &&
|
|
|
+ this.$store.state.packPageStatus
|
|
|
+ ) {
|
|
|
+ this.packPageStatus = true;
|
|
|
+ }
|
|
|
+ return item.color ? item.color : "rgba(225,225,225,0.1)";
|
|
|
+ });
|
|
|
+ this.color = this.colors[0];
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ go(path, query) {
|
|
|
+ this.$router.push({
|
|
|
+ path,
|
|
|
+ query
|
|
|
+ });
|
|
|
+ },
|
|
|
+ goLink(path) {
|
|
|
+ window.open(path);
|
|
|
+ },
|
|
|
+ mouseover() {
|
|
|
+ clearTimeout(this.timer);
|
|
|
+ this.showBox = true;
|
|
|
+ },
|
|
|
+
|
|
|
+ mouseLeave() {
|
|
|
+ clearTimeout(this.timer);
|
|
|
+ this.timer = setTimeout(() => {
|
|
|
+ this.showBox = false;
|
|
|
+ }, 500);
|
|
|
+ },
|
|
|
+ login() {
|
|
|
+ this.$refs.loginForm.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.isLogin = true;
|
|
|
+ let loginForm = JSON.parse(JSON.stringify(this.loginForm));
|
|
|
+ loginForm.pwd = this.$tools.encryptor(loginForm.pwd);
|
|
|
+ console.log(this.loginForm);
|
|
|
+ if (this.dualStatus) {
|
|
|
+ loginForm.tel = loginForm.account;
|
|
|
+ }
|
|
|
+ this.$request
|
|
|
+ .login(loginForm)
|
|
|
+ .then(res => {
|
|
|
+ localStorage.setItem("user_account", res.data.user_account);
|
|
|
+ localStorage.setItem("token", res.data.token);
|
|
|
+ if (res.data.full_info) {
|
|
|
+ // localStorage.setItem("user_account", res.data.user_account);
|
|
|
+ // localStorage.setItem("token", res.data.token);
|
|
|
+
|
|
|
+ this.getInfo();
|
|
|
+ } else {
|
|
|
+ this.indexUserAccount = res.data.user_account;
|
|
|
+ this.indexToken = res.data.token;
|
|
|
+ this.isLogin = false;
|
|
|
+ // 弹窗
|
|
|
+ this.bindShow = true;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ this.isLogin = false;
|
|
|
+ this.$message({
|
|
|
+ message: err.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取登录短信
|
|
|
+ */
|
|
|
+ getLoginSms(int) {
|
|
|
+ this.$refs[int === 1 ? "loginForm" : "loginSmsForm"].validateField(
|
|
|
+ int === 1 ? "account" : "tel",
|
|
|
+ valid => {
|
|
|
+ if (!valid) {
|
|
|
+ if (this.countDown == 0) {
|
|
|
+ if (this.getLoginCodeLock) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.getLoginCodeLock = true;
|
|
|
+ this.$request
|
|
|
+ .getLoginSms({
|
|
|
+ tel:
|
|
|
+ int === 1 ? this.loginForm.account : this.loginSmsForm.tel
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.getLoginCodeLock = false;
|
|
|
+ this.$message({
|
|
|
+ message: `验证码已发送`,
|
|
|
+ type: "success"
|
|
|
+ });
|
|
|
+ this.countDown = 60;
|
|
|
+ this.countDownTimer = setInterval(() => {
|
|
|
+ if (this.countDown == 0) {
|
|
|
+ clearInterval(this.countDownTimer);
|
|
|
+ } else {
|
|
|
+ this.countDown--;
|
|
|
+ }
|
|
|
+ }, 1000);
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ this.$message.error(err.msg);
|
|
|
+ this.getLoginCodeLock = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ );
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 手机号登录
|
|
|
+ */
|
|
|
+ loginSms() {
|
|
|
+ this.$refs.loginSmsForm.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.isloginSms = true;
|
|
|
+ this.$request
|
|
|
+ .loginSms(this.loginSmsForm)
|
|
|
+ .then(res => {
|
|
|
+ this.isloginSms = false;
|
|
|
+ localStorage.setItem("user_account", res.data.user_account);
|
|
|
+ localStorage.setItem("token", res.data.token);
|
|
|
+ this.$tools.setUuid(new Date().valueOf() + "");
|
|
|
+ if (res.data.full_info) {
|
|
|
+ this.getInfo();
|
|
|
+ } else {
|
|
|
+ this.indexUserAccount = res.data.user_account;
|
|
|
+ this.indexToken = res.data.token;
|
|
|
+ this.bindShow = true;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ this.isloginSms = false;
|
|
|
+ this.$message({
|
|
|
+ message: err.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 消息提示
|
|
|
+ */
|
|
|
+ getmsg() {
|
|
|
+ this.$request.informUserselectLastUnStudyMsg().then(res => {
|
|
|
+ if (res.data && res.data.id) {
|
|
|
+ let today = new Date(new Date().toLocaleDateString()).getTime();
|
|
|
+ if (localStorage.getItem("msg")) {
|
|
|
+ let ary = JSON.parse(localStorage.getItem("msg"));
|
|
|
+ if (ary.updateTime === today) {
|
|
|
+ this.msgShow = false;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.msgData = res.data;
|
|
|
+ this.msgShow = true;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.msgShow = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取用户登录信息
|
|
|
+ */
|
|
|
+ getInfo() {
|
|
|
+ this.$request
|
|
|
+ .getInfo({ fromPlat: 2 })
|
|
|
+ .then(res => {
|
|
|
+ this.loginForm = {};
|
|
|
+ this.loginSmsForm = {};
|
|
|
+ this.isLogin = false;
|
|
|
+ this.isloginSms = false;
|
|
|
+ this.setUserInfo(res.data);
|
|
|
+ checkFunc();
|
|
|
+ // this.getmsg();
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ this.isLogin = false;
|
|
|
+ this.isloginSms = false;
|
|
|
+ this.$message({
|
|
|
+ message: err.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ bind() {
|
|
|
+ this.$refs.bindForm.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.isBind = true;
|
|
|
+ let bindForm = JSON.parse(JSON.stringify(this.bindForm));
|
|
|
+ bindForm.token = this.indexToken;
|
|
|
+ this.$request
|
|
|
+ .bindIdCard(bindForm)
|
|
|
+ .then(res => {
|
|
|
+ this.isBind = false;
|
|
|
+ this.bindShow = false;
|
|
|
+ this.$message({
|
|
|
+ message: "关联成功",
|
|
|
+ type: "success"
|
|
|
+ });
|
|
|
+ localStorage.setItem("user_account", this.indexUserAccount);
|
|
|
+ localStorage.setItem("token", this.indexToken);
|
|
|
+ this.$tools.setUuid(new Date().valueOf() + "");
|
|
|
+ this.getInfo();
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ this.isBind = false;
|
|
|
+ this.$message({
|
|
|
+ message: err.msg,
|
|
|
+ type: "error"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ bindNext() {
|
|
|
+ this.bindShow = false;
|
|
|
+ this.indexToken = "";
|
|
|
+ this.indexUserAccount = "";
|
|
|
+ this.getInfo();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+ </script>
|
|
|
+
|
|
|
+ <!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
|
+ <style scoped lang="scss">
|
|
|
+ /deep/ .el-input__inner::placeholder {
|
|
|
+ color: #777 !important;
|
|
|
+ }
|
|
|
+ .text_align {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ margin: 40px 0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .home {
|
|
|
+ .header {
|
|
|
+ background: #ffffff;
|
|
|
+
|
|
|
+ &__header {
|
|
|
+ box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.04);
|
|
|
+
|
|
|
+ .text-list {
|
|
|
+ height: 26px;
|
|
|
+ line-height: 26px;
|
|
|
+ text-align: right;
|
|
|
+ font-size: 0;
|
|
|
+
|
|
|
+ a {
|
|
|
+ color: #3f8dfd;
|
|
|
+ font-size: 14px;
|
|
|
+ padding: 0 14px;
|
|
|
+
|
|
|
+ &:nth-last-of-type(1) {
|
|
|
+ padding-right: 0;
|
|
|
+ border-left: 1px solid #3f8dfd;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon-list {
|
|
|
+ height: 26px;
|
|
|
+ line-height: 26px;
|
|
|
+ text-align: right;
|
|
|
+ font-size: 0;
|
|
|
+
|
|
|
+ a {
|
|
|
+ color: #3f8dfd;
|
|
|
+ font-size: 14px;
|
|
|
+ padding: 0 14px;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .modal-box {
|
|
|
+ width: 162px;
|
|
|
+ background: #ffffff;
|
|
|
+ box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);
|
|
|
+ border-radius: 8px;
|
|
|
+ position: absolute;
|
|
|
+ top: 34px;
|
|
|
+ left: -40px;
|
|
|
+
|
|
|
+ li {
|
|
|
+ margin-left: 10px;
|
|
|
+ border-bottom: 1px solid #eeeeee;
|
|
|
+ height: 26px;
|
|
|
+ line-height: 26px;
|
|
|
+ cursor: pointer;
|
|
|
+ padding-left: 5px;
|
|
|
+ color: #666666;
|
|
|
+ text-align: left;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ background: #eeeeee;
|
|
|
+ color: #3f8dfd;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:nth-last-of-type(1) {
|
|
|
+ border: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &__body {
|
|
|
+ margin-top: 16px;
|
|
|
+ .topBoxy {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ .logo {
|
|
|
+ width: 300px;
|
|
|
+ // float: left;
|
|
|
+
|
|
|
+ img {
|
|
|
+ max-width: 300px;
|
|
|
+ // height: 33px;
|
|
|
+ }
|
|
|
+
|
|
|
+ h1 {
|
|
|
+ background: url("~@/assets/logo.png") no-repeat center;
|
|
|
+ width: 162px;
|
|
|
+ height: 33px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .search {
|
|
|
+ flex-shrink: 0;
|
|
|
+ // float: left;
|
|
|
+ margin-left: 30px;
|
|
|
+ width: 648px;
|
|
|
+ background: #fafbfc;
|
|
|
+ border: 1px solid #3f8dfd;
|
|
|
+ border-radius: 8px;
|
|
|
+ display: flex;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ &__select {
|
|
|
+ width: 76px;
|
|
|
+ border-right: 1px solid #fff;
|
|
|
+
|
|
|
+ select {
|
|
|
+ text-align: center;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border: 0;
|
|
|
+ outline: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &__input {
|
|
|
+ flex: 1;
|
|
|
+
|
|
|
+ input {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &__btn {
|
|
|
+ padding: 0;
|
|
|
+ text-align: center;
|
|
|
+ width: 80px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ border-radius: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .contact {
|
|
|
+ // float: right;
|
|
|
+ padding-left: 45px;
|
|
|
+ background: url("~@/assets/cus.png") no-repeat left top;
|
|
|
+
|
|
|
+ &__phone {
|
|
|
+ font-size: 18px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__time {
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .section {
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .tabs {
|
|
|
+ margin-left: 324px;
|
|
|
+
|
|
|
+ .tab {
|
|
|
+ display: inline-block;
|
|
|
+ width: 135px;
|
|
|
+ height: 40px;
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40px;
|
|
|
+ color: #333;
|
|
|
+
|
|
|
+ &.active {
|
|
|
+ color: #3f8dfd;
|
|
|
+ background: #f0f5fc;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper-wrap {
|
|
|
+ transition: background 0.3s;
|
|
|
+ height: 400px;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .container {
|
|
|
+ position: relative;
|
|
|
+ height: 400px;
|
|
|
+
|
|
|
+ .left-box {
|
|
|
+ position: absolute;
|
|
|
+ top: -40px;
|
|
|
+ left: 0;
|
|
|
+ height: 440px;
|
|
|
+ width: 300px;
|
|
|
+ z-index: 10;
|
|
|
+
|
|
|
+ &__header {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+ background: #3f8dfd;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__body {
|
|
|
+ position: relative;
|
|
|
+ height: 400px;
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ overflow: visible;
|
|
|
+
|
|
|
+ .slide-list {
|
|
|
+ opacity: 1;
|
|
|
+ left: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .slide-list {
|
|
|
+ height: 100%;
|
|
|
+ opacity: 0;
|
|
|
+ transition: all 0.3s;
|
|
|
+ width: 580px;
|
|
|
+ padding: 0;
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ padding-left: 24px;
|
|
|
+ z-index: 10;
|
|
|
+
|
|
|
+ &__item {
|
|
|
+ min-height: 80px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-bottom: 1px solid #ddd;
|
|
|
+
|
|
|
+ &:nth-last-of-type(1) {
|
|
|
+ border: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #fff;
|
|
|
+ width: 120px;
|
|
|
+ height: 28px;
|
|
|
+ border: 1px solid #ffffff;
|
|
|
+ border-radius: 14px;
|
|
|
+ background: #3f8dfd;
|
|
|
+ line-height: 26px;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 15px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nav {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ li {
|
|
|
+ margin: 9px 24px 9px 0;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .text {
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .bg {
|
|
|
+ backdrop-filter: blur(10px);
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ z-index: 12;
|
|
|
+ }
|
|
|
+
|
|
|
+ .list {
|
|
|
+ position: relative;
|
|
|
+ z-index: 22;
|
|
|
+ padding-left: 16px;
|
|
|
+ height: 100%;
|
|
|
+ overflow-y: auto;
|
|
|
+ &::-webkit-scrollbar {
|
|
|
+ width: 5px;
|
|
|
+ height: 9px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /*定义滚动条轨道 内阴影+圆角*/
|
|
|
+ &::-webkit-scrollbar-track {
|
|
|
+ background-color: inherit;
|
|
|
+ border: none;
|
|
|
+ /* margin: 6px; */
|
|
|
+ border-radius: 10px;
|
|
|
+ /* -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
|
|
+ background-color: #F5F5F5; */
|
|
|
+ }
|
|
|
+
|
|
|
+ /*定义滑块 内阴影+圆角*/
|
|
|
+ &::-webkit-scrollbar-thumb {
|
|
|
+ border-radius: 10px;
|
|
|
+ position: relative;
|
|
|
+ right: 2px;
|
|
|
+ /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);*/
|
|
|
+ background-color: #c6c6cd;
|
|
|
+ width: 6px;
|
|
|
+ }
|
|
|
+ li {
|
|
|
+ padding: 12px 0;
|
|
|
+ min-height: 80px;
|
|
|
+ max-height: 200px;
|
|
|
+ // overflow-y: auto;
|
|
|
+ border-bottom: 1px solid rgba(255, 255, 255, 0.6);
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ &:nth-last-of-type(1) {
|
|
|
+ border: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text {
|
|
|
+ flex: 1;
|
|
|
+
|
|
|
+ &__title {
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__desc {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ margin-top: 16px;
|
|
|
+
|
|
|
+ .item {
|
|
|
+ // flex-shrink: 0;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: rgba(225, 225, 225, 0.8);
|
|
|
+ margin-right: 30px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ &:hover {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper {
|
|
|
+ .swiper-slide {
|
|
|
+ cursor: pointer;
|
|
|
+ height: 400px;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper-pagination {
|
|
|
+ text-align: right;
|
|
|
+ padding-right: 324px;
|
|
|
+
|
|
|
+ /deep/ .swiper-pagination-bullet {
|
|
|
+ background: rgba(255, 255, 255, 0.4);
|
|
|
+
|
|
|
+ &-active {
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-box {
|
|
|
+ width: 300px;
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ top: 0;
|
|
|
+ z-index: 10;
|
|
|
+
|
|
|
+ .bg {
|
|
|
+ backdrop-filter: blur(10px);
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ z-index: 2;
|
|
|
+ }
|
|
|
+
|
|
|
+ .no-login {
|
|
|
+ position: relative;
|
|
|
+ z-index: 10;
|
|
|
+
|
|
|
+ .input {
|
|
|
+ margin: 16px;
|
|
|
+ height: 40px;
|
|
|
+ background: #ffffff;
|
|
|
+ border-radius: 8px;
|
|
|
+
|
|
|
+ input {
|
|
|
+ padding: 0 16px;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333;
|
|
|
+
|
|
|
+ &::placeholder {
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn {
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #3f8dfd;
|
|
|
+ white-space: nowrap;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .submit {
|
|
|
+ margin: 16px;
|
|
|
+ font-size: 16px;
|
|
|
+ margin-top: 16px;
|
|
|
+ box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
|
|
|
+ display: block;
|
|
|
+ width: 268px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-text {
|
|
|
+ margin: 16px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .text {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .has-login {
|
|
|
+ position: relative;
|
|
|
+ z-index: 10;
|
|
|
+ padding: 14px 0 0 14px;
|
|
|
+
|
|
|
+ .userinfo {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .avatar {
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nickname {
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #ffffff;
|
|
|
+ margin-left: 7px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .type-list {
|
|
|
+ display: flex;
|
|
|
+ margin-top: 28px;
|
|
|
+ padding-bottom: 14px;
|
|
|
+ border-bottom: 1px solid #fff;
|
|
|
+
|
|
|
+ &__item {
|
|
|
+ cursor: pointer;
|
|
|
+ margin-right: 38px;
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 64px;
|
|
|
+ height: 64px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text {
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:nth-last-of-type(1) {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .history {
|
|
|
+ border-bottom: 1px solid #fff;
|
|
|
+ padding-bottom: 15px;
|
|
|
+
|
|
|
+ .btn {
|
|
|
+ margin-top: 15px;
|
|
|
+ width: 64px;
|
|
|
+ height: 24px;
|
|
|
+ border: 1px solid #ffffff;
|
|
|
+ border-radius: 8px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 24px;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ cursor: pointer;
|
|
|
+ margin-top: 15px;
|
|
|
+ padding-right: 15px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .progress {
|
|
|
+ margin-top: 15px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding-right: 15px;
|
|
|
+
|
|
|
+ span {
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .course {
|
|
|
+ background: #f5f7fa;
|
|
|
+ padding-top: 40px;
|
|
|
+
|
|
|
+ &__header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding-bottom: 15px;
|
|
|
+ border-bottom: 1px solid #dcdcdc;
|
|
|
+
|
|
|
+ .lefts {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ background: url("~@/assets/video.png") no-repeat left center;
|
|
|
+ padding-left: 36px;
|
|
|
+ font-size: 24px;
|
|
|
+ font-family: YouSheBiaoTiHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #333333;
|
|
|
+ text-shadow: 0px 6px 6px rgba(249, 113, 13, 0.08);
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabs {
|
|
|
+ margin-left: 28px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .tab {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #888888;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-right: 32px;
|
|
|
+ overflow: hidden;
|
|
|
+ word-break: break-all;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 1;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+
|
|
|
+ &.active {
|
|
|
+ font-weight: 600;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .pagination {
|
|
|
+ padding: 30px 0;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__body {
|
|
|
+ .list {
|
|
|
+ width: 100%;
|
|
|
+
|
|
|
+ .course-item {
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &__footer {
|
|
|
+ overflow: hidden;
|
|
|
+ flex-shrink: 0;
|
|
|
+
|
|
|
+ .btn {
|
|
|
+ cursor: pointer;
|
|
|
+ width: 72px;
|
|
|
+ // height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
+ background: #d5e4ff;
|
|
|
+ border-radius: 4px;
|
|
|
+ // margin: 20px auto 40px;
|
|
|
+ color: #3f8dfd;
|
|
|
+ text-align: center;
|
|
|
+ transition: all 0.2s;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ color: #fff;
|
|
|
+ box-shadow: 0px 8px 4px 0px rgba(7, 82, 208, 0.08);
|
|
|
+ background: #3f8dfd;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .bank {
|
|
|
+ background: #fff;
|
|
|
+ padding-top: 40px;
|
|
|
+
|
|
|
+ &__header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding-bottom: 15px;
|
|
|
+ border-bottom: 1px solid #dcdcdc;
|
|
|
+
|
|
|
+ .lefts {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ background: url("~@/assets/exercise.png") no-repeat left center;
|
|
|
+ padding-left: 36px;
|
|
|
+ font-size: 24px;
|
|
|
+ font-family: YouSheBiaoTiHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #333333;
|
|
|
+ text-shadow: 0px 6px 6px rgba(249, 113, 13, 0.08);
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tabs {
|
|
|
+ margin-left: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .tab {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #888888;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-right: 32px;
|
|
|
+ overflow: hidden;
|
|
|
+ word-break: break-all;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 1;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ &.active {
|
|
|
+ font-weight: 600;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .pagination {
|
|
|
+ padding: 30px 0;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__body {
|
|
|
+ .list {
|
|
|
+ width: 100%;
|
|
|
+
|
|
|
+ .bank-item {
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &__footer {
|
|
|
+ overflow: hidden;
|
|
|
+ flex-shrink: 0;
|
|
|
+ .btn {
|
|
|
+ cursor: pointer;
|
|
|
+ width: 72px;
|
|
|
+ // height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
+ background: #d5e4ff;
|
|
|
+ border-radius: 4px;
|
|
|
+ // margin: 20px auto 40px;
|
|
|
+ color: #3f8dfd;
|
|
|
+ text-align: center;
|
|
|
+ transition: all 0.2s;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ color: #fff;
|
|
|
+ box-shadow: 0px 8px 4px 0px rgba(7, 82, 208, 0.08);
|
|
|
+ background: #3f8dfd;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .bind {
|
|
|
+ /deep/ .el-dialog__header {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-dialog__body {
|
|
|
+ padding: 0;
|
|
|
+ overflow: unset;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__close {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: -28px;
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ line-height: 24px;
|
|
|
+ text-align: center;
|
|
|
+ color: #eee;
|
|
|
+ border: 1px solid #eee;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__header {
|
|
|
+ height: 40px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40px;
|
|
|
+ border-bottom: 1px solid #eeeeee;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__body {
|
|
|
+ height: 248px;
|
|
|
+ padding: 24px;
|
|
|
+ position: relative;
|
|
|
+ box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.04);
|
|
|
+ border-radius: 8px;
|
|
|
+
|
|
|
+ .submit {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bind-next {
|
|
|
+ font-size: 14px;
|
|
|
+ text-align: center;
|
|
|
+ color: #999;
|
|
|
+ margin-top: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .fade-enter,
|
|
|
+ .fade-leave-to {
|
|
|
+ opacity: 0;
|
|
|
+ height: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fade-enter-to,
|
|
|
+ .fade-leave {
|
|
|
+ opacity: 1;
|
|
|
+ height: 122px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fade-enter-active,
|
|
|
+ .fade-leave-active {
|
|
|
+ transition: all 0.3s;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dis_flex {
|
|
|
+ user-select: none;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+
|
|
|
+ .dis_flex_wxloginImg {
|
|
|
+ cursor: pointer;
|
|
|
+ width: 76px;
|
|
|
+ height: 76px;
|
|
|
+ border-radius: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: #fff;
|
|
|
+ line-height: 76px;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ img {
|
|
|
+ vertical-align: middle;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-badge__content.is-fixed {
|
|
|
+ top: 7px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dis_plays {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .toolbth {
|
|
|
+ border-radius: 55px;
|
|
|
+ background-color: #fff;
|
|
|
+ color: #3f8dfd;
|
|
|
+ font-size: 14px;
|
|
|
+ padding: 5px 14px;
|
|
|
+ margin-right: 16px;
|
|
|
+ user-select: none;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+ <style lang="scss">
|
|
|
+ .tooltipStyle {
|
|
|
+ background-color: #3f8dfd !important;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tooltipStyle .popper__arrow {
|
|
|
+ border-bottom-color: #3f8dfd !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tooltipStyle .popper__arrow::after {
|
|
|
+ border-bottom-color: #3f8dfd !important;
|
|
|
+ }
|
|
|
+ #packPageDialog {
|
|
|
+ z-index: 9999;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background-color: rgba(0, 0, 0, 0.5);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ & > .img-box {
|
|
|
+ position: relative;
|
|
|
+ text-align: center;
|
|
|
+ & > img {
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ & > i {
|
|
|
+ vertical-align: top;
|
|
|
+ color: #fff;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tabs_box {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-bottom: 1px solid #409eff;
|
|
|
+ justify-content: space-between;
|
|
|
+ .tabs_ul {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ li {
|
|
|
+ font-size: 18px;
|
|
|
+ &:first-child {
|
|
|
+ border-top-left-radius: 8px;
|
|
|
+ }
|
|
|
+ width: 150px;
|
|
|
+ text-align: center;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ cursor: pointer;
|
|
|
+ user-select: none;
|
|
|
+ &:hover {
|
|
|
+ color: #409eff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ & > .active {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #409eff;
|
|
|
+ &:hover {
|
|
|
+ color: #fff !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tab_more {
|
|
|
+ float: right;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #7f7f7f;
|
|
|
+ }
|
|
|
+}
|
|
|
+.tab_content {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ height: 210px;
|
|
|
+ padding: 20px 0px;
|
|
|
+ .c {
|
|
|
+ width: 620px;
|
|
|
+ & > li {
|
|
|
+ cursor: pointer;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333;
|
|
|
+ & > .tit {
|
|
|
+ flex: 1;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ & > .time {
|
|
|
+ margin-left: 10px;
|
|
|
+ flex-shrink: 0;
|
|
|
+ color: #7f7f7f;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ color: #409eff;
|
|
|
+ .time {
|
|
|
+ color: #409eff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &::before {
|
|
|
+ font-size: 12px;
|
|
|
+ content: "●";
|
|
|
+ margin-right: 4px;
|
|
|
+ color: rgb(215, 215, 215);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .center {
|
|
|
+ width: 1px;
|
|
|
+ background-color: #eee;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+ </style>
|
|
|
+
|
caichengyu
