提交 368de114 编写于 作者: 杨广俊's avatar 杨广俊

代码优化

上级 f5c896da
无法预览此类型文件
...@@ -235,7 +235,7 @@ export default { ...@@ -235,7 +235,7 @@ export default {
sortFun(){ sortFun(){
this.dir = this.dir == 2 ? 1 : 2; this.dir = this.dir == 2 ? 1 : 2;
this.getCourse(); // this.getCourse();
}, },
//课程教学 //课程教学
......
<template>
<section>
<GroupTitle groupTitle="讲师" :groupNum="groupNum" />
<div class="font-style">
<div class="teach-opt">
<div class="teach-list">
<div :class="index%2==1?'list-item mr0':'list-item'"
v-for="(item, index) in parmData" :key="index"
@click="goToDetail(item)">
<div class="tea-img" :style="'background:'+ item.bgColor">
<img :src="item.doctorImg">
<span class="learn-p">{{item.joinNum}}人已学</span>
<!-- <span class="learn-p">{{item.joinNum | yLocalString}}人已学</span> -->
</div>
<div class="tea-txt">
<div class="tea-name">{{item.doctorName}}</div>
<div class="tea-position">
{{item.doctorHospital}}
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</template>
<script>
// import teacherTop from '../../components/teachers/teach-top-new';
// import {
// teacher_back,
// fast_sicon,
// hot_teacher,
// screen,
// teacher,
// teacherother
// } from '../../utils/buryingPoint';
import GroupTitle from '@/components/business/group-title';
export default {
components: {
GroupTitle
},
data() {
return {
topTitle: '讲师集',
isScroll: false,
token: '',
list: [],
isShowCount: true,
followCount: 0,
studyCount: 0,
col: 1, //0综合,1人气,2资源数,3姓名首字母
dir: 2, //1:正序 2:逆序
}
},
props: {
parmData: {
type: Array,
default: () => []
},
groupNum: {
type: String,
default: '0'
}
},
mounted() {
let _this = this
this.token = this.$route.query.userToken || this.$route.query.token
// this.getUserInfo()
// this.getData();
// window.__getUserInfo = function(parm){
// // alert('in __getUserInfo')
// _this.token = parm.userToken || _this.$route.query.token;
// this.getData();
// }
window.__refresh = function (parm) {
_this.getData();
}
window.addEventListener('scroll', this.handleScroll)
},
computed: {
// groupNum() {
// return this.parmData.length + ''
// }
},
methods: {
handleScroll: function () {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
if (scrollTop > 25) {
this.isScroll = true;
} else {
this.isScroll = false;
}
},
//获取版本号
getUserInfo() {
rocNative.getUserInfo({
__funcName: '__getUserInfo'
})
},
goToDetail(item) {
let _this = this;
this.$router.push({
path: '/details',
query: {
id: item.doctorId,
token: _this.token
}
})
// this.appBuryingPointEntrust({
// ...teacher,
// labelId: item.doctorId,
// labelValue: item.doctorName
// })
},
// 埋点
appBuryingPointEntrust(val) {
rocNative.appBuryingPointEntrust(val)
},
//排序
sortFun() {
this.dir = this.dir == 1 ? 2 : 1;
this.getData()
},
randomBg(d) {
for (let i = 0; i < d.length; i++) {
if (i % 4 == 0) {
d[i].bgColor = '#EBF6F1'
} else if (i % 4 == 1) {
d[i].bgColor = '#EDF3FA'
} else if (i % 4 == 2) {
d[i].bgColor = '#F0F0FA'
} else if (i % 4 == 3) {
d[i].bgColor = '#F6EFE6'
}
}
/// console.log(d);
},
getData() {
let _this = this,
para = {
token: _this.token,
setEntry: 'headers'
}
let url = 'contents/courseDoctor/getAllTeacher/orderby/' + _this.col + '/dir/' + _this.dir
this.GET(url, para).then(res => {
if (res.code == '000000') {
_this.list = res.data.teacherList || [];
_this.followCount = res.data.followCount || 0;
_this.studyCount = res.data.studyCount || 0;
if (_this.list.length > 0) {
_this.randomBg(_this.list);
}
}
})
// this.appBuryingPointEntrust({
// ...teacher,
// labelId: _this.dir,
// labelValue: _this.dir === 1 ? '升序' : '降序'
// })
}
}
}
</script>
<style>
body {
background: #fff
}
</style>
<style lang="scss" scoped>
body {
background: #fff
}
@import '../../style/mixin';
.mint-header {
background-color: rgba($color: #000000, $alpha: 0)
}
.font-style {
width: 100%;
overflow: hidden;
@include sc(0.6rem, #666);
}
.teach-opt {
padding: 0 px2rem(15px) px2rem(15px) px2rem(15px);
.teach-title {
font-size: px2rem(18px);
// padding-bottom: px2rem(0px);
color: #333;
}
.teach-list {
margin-top: px2rem(-14px);
overflow: hidden;
}
.opt-span {
span {
color: #449284;
font-size: px2rem(13px);
display: inline-block;
vertical-align: middle;
height: px2rem(10px);
line-height: px2rem(10px);
img {
display: inline-block;
width: px2rem(15px);
height: px2rem(15px);
vertical-align: middle;
}
}
}
.list-item {
width: px2rem(170px);
margin-right: px2rem(5px);
margin-top: px2rem(15px);
border-radius: 0 0 px2rem(3px) px2rem(3px);
float: left;
box-shadow: 0 px2rem(4px) px2rem(6px) RGBA(0, 0, 0, 0.06);
}
.mr0 {
margin-right: 0
}
.tea-txt {
padding: px2rem(5px) px2rem(7px);
}
.tea-img {
width: px2rem(170px);
height: px2rem(83px);
position: relative;
border-radius: px2rem(3px) px2rem(3px) 0 0;
img {
width: 100%;
height: 100%;
display: block;
border-radius: px2rem(3px) px2rem(3px) 0 0;
}
.learn-p {
padding-left: px2rem(5px);
position: absolute;
width: 100%;
left: 0;
bottom: 0;
background: #333;
background: -webkit-linear-gradient(left, RGBA(0, 0, 0, 0.2), RGBA(0, 0, 0, 0));
background: -o-linear-gradient(right, RGBA(0, 0, 0, 0.2), RGBA(0, 0, 0, 0));
background: -moz-linear-gradient(right, RGBA(0, 0, 0, 0.2), RGBA(0, 0, 0, 0));
background: linear-gradient(to right, RGBA(0, 0, 0, 0.2), RGBA(0, 0, 0, 0));
color: #fff;
font-size: px2rem(11px);
height: px2rem(20px);
line-height: px2rem(20px);
}
}
.tea-name {
padding: 0;
color: #333;
font-size: px2rem(14px);
font-weight: 500;
}
.tea-position {
height: px2rem(30px);
font-size: px2rem(12px);
line-height: px2rem(15px);
color: #666;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
}
}
.home-header {
height: px2rem(185px);
@include bis('../../images/headerTop.png');
.logo_img {
height: px2rem(85px);
width: px2rem(345px);
text-align: center;
}
}
</style>
...@@ -26,7 +26,6 @@ ...@@ -26,7 +26,6 @@
</template> </template>
<script> <script>
// import teacherTop from '../../components/teachers/teach-top-new';
// import { // import {
// teacher_back, // teacher_back,
// fast_sicon, // fast_sicon,
...@@ -67,7 +66,7 @@ export default { ...@@ -67,7 +66,7 @@ export default {
let _this = this let _this = this
this.token = this.$route.query.userToken || this.$route.query.token this.token = this.$route.query.userToken || this.$route.query.token
// this.getUserInfo() // this.getUserInfo()
this.getData(); // this.getData();
// window.__getUserInfo = function(parm){ // window.__getUserInfo = function(parm){
// // alert('in __getUserInfo') // // alert('in __getUserInfo')
// _this.token = parm.userToken || _this.$route.query.token; // _this.token = parm.userToken || _this.$route.query.token;
...@@ -146,7 +145,7 @@ export default { ...@@ -146,7 +145,7 @@ export default {
token: _this.token, token: _this.token,
setEntry: 'headers' setEntry: 'headers'
} }
let url = '/contents/courseDoctor/getAllTeacher/orderby/' + _this.col + '/dir/' + _this.dir let url = 'contents/courseDoctor/getAllTeacher/orderby/' + _this.col + '/dir/' + _this.dir
this.GET(url, para).then(res => { this.GET(url, para).then(res => {
if (res.code == '000000') { if (res.code == '000000') {
_this.list = res.data.teacherList || []; _this.list = res.data.teacherList || [];
......
<template> <template>
<div class="up-maps-loading" v-show="lock"> <div class="loader loader--style3" title="2">
<img src="../../images/loading-new.png">&nbsp;正在加载 <div class="loader-mask"></div>
<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="40px" height="40px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve">
<path fill="#000" d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z">
<animateTransform attributeType="xml"
attributeName="transform"
type="rotate"
from="0 25 25"
to="360 25 25"
dur="0.6s"
repeatCount="indefinite"/>
</path>
</svg>
</div> </div>
</template>
<script> </template>
export default {
data(){
return{
positionY: 0,
timer: null,
lock:true
}
},
mounted(){
// this.timer = setInterval(() => {
// this.positionY ++;
// }, 600)
},
// beforeDestroy(){
// clearInterval(this.timer);
// }
}
</script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../style/mixin'; @import '../../style/mixin';
.up-maps-loading{ .loader {
margin: 10px 0; margin: 0 0 2em;
height: 100px;
width: 20%;
text-align: center; text-align: center;
line-height: 20px; padding: 1em;
} margin: 0 auto 1em;
.up-maps-loading>img{
display: inline-block; display: inline-block;
margin: 0 auto; vertical-align: top;
width: 20px; &-mask {
height: auto; position: fixed;
animation: circle 1s infinite linear; top: 0;
-webkit-animation: circle 1s infinite linear; left: 0;
bottom: 0;
right: 0;
z-index: 100;
background: rgba(205,205,205, 0.8);
}
svg {
position: absolute;
top: px2rem(280px);
left: px2rem(166px);
z-index: 101;
}
} }
svg path, svg rect{
fill: #449284;
}
</style> </style>
...@@ -48,7 +48,8 @@ ...@@ -48,7 +48,8 @@
} }
.load_img{ .load_img{
@include wh(100%, 100%); @include wh(100%, 100%);
background: url(../../images/icon_loading.png) no-repeat 0 0; // background: url(../../images/icon_loading.png) no-repeat 0 0;
background: url(../../images/loading-new.png) no-repeat 0 0;
background-size: 2.5rem auto; background-size: 2.5rem auto;
transform: translateY(0px); transform: translateY(0px);
animation: load .6s infinite ease-in-out; animation: load .6s infinite ease-in-out;
......
此差异已折叠。
此差异已折叠。
<template>
<div>
<!-- <SearchHeader @search="search" :searchText="searchText"/> -->
<form @submit.prevent="search">
<mt-search v-model="searchText" ></mt-search>
<button v-show="false" type="submit" />
</form>
<!-- <SplitLine /> -->
<div class="mt-100"></div>
<HistoryLabels/>
<HotLabels/>
</div>
</template>
<script>
import SearchHeader from '../components/business/search-header';
import SplitLine from '../components/business/split-line';
import HistoryLabels from '../components/business/history-labels';
import HotLabels from '../components/business/hot-labels';
// import { Search } from 'mint-ui';
export default {
data() {
return {
searchText: ''
}
},
components: {
SearchHeader,
SplitLine,
HistoryLabels,
HotLabels
},
created(){
},
mounted(){
this.getData()
},
methods: {
// 跳转到结果页面,并
search() {
if(!this.searchText) return;
this.$router.push({
path: '/result',
query: {
searchText: this.searchText
}
})
},
// 获取历史搜索
getData() {
let _this = this,
para = {
type: 1,
token: _this.token,
setEntry: 'headers'
}
let url = '/contents/searchKeyword/listKeywords'
this.GET(url, para).then(res => {
if (res.code == '000000') {
if (res.data && res.data.length) {
let index = Math.floor(Math.random() * res.data.length)
this.searchText = res.data[index].keyword
}
}
})
}
},
}
</script>
<style >
.mint-search {
position: fixed;
top: 0px;
z-index: 2;
height: 66px;
width: 100%;
border-bottom: 1px solid #E7E7E7 !important;
}
.mint-searchbar {
position: relative;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #fff;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 30px 10px 8px;
z-index: 1;
}
.mint-searchbar-cancel {
margin-left: 10px;
font-size: 14px ;
color: #999;
text-decoration: none;
}
.mint-searchbar-inner {
background: #F5F6F6;
}
.mint-searchbar-core {
background: #F5F6F6;
}
</style>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
@import '../style/mixin.scss';
@import '../style/global.scss';
.mt-100 {
padding-top: px2rem(63px) !important;
}
</style>
<template>
<div>
<!-- <SearchHeader @search="search" :searchText="searchText"/> -->
<form @submit.prevent="search">
<mt-search v-model="searchText" ></mt-search>
<button v-show="false" type="submit" />
</form>
<!-- <SplitLine /> -->
<div class="mt-100"></div>
<HistoryLabels/>
<HotLabels/>
</div>
</template>
<script>
import SearchHeader from '../components/business/search-header';
import SplitLine from '../components/business/split-line';
import HistoryLabels from '../components/business/history-labels';
import HotLabels from '../components/business/hot-labels';
// import { Search } from 'mint-ui';
export default {
data() {
return {
searchText: ''
}
},
components: {
SearchHeader,
SplitLine,
HistoryLabels,
HotLabels
},
created(){
},
mounted(){
this.getData()
},
methods: {
// 跳转到结果页面,并
search() {
if(!this.searchText) return;
this.$router.push({
path: '/result',
query: {
searchText: this.searchText
}
})
},
// 获取历史搜索
getData() {
let _this = this,
para = {
type: 1,
token: _this.token,
setEntry: 'headers'
}
let url = '/contents/searchKeyword/listKeywords'
this.GET(url, para).then(res => {
if (res.code == '000000') {
if (res.data && res.data.length) {
let index = Math.floor(Math.random() * res.data.length)
this.searchText = res.data[index].keyword
}
}
})
}
},
}
</script>
<style >
.mint-search {
position: fixed;
top: 0px;
z-index: 2;
height: 66px;
width: 100%;
border-bottom: 1px solid #E7E7E7 !important;
}
.mint-searchbar {
position: relative;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #fff;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 30px 10px 8px;
z-index: 1;
}
.mint-searchbar-cancel {
margin-left: 10px;
font-size: 14px ;
color: #999;
text-decoration: none;
}
.mint-searchbar-inner {
background: #F5F6F6;
}
.mint-searchbar-core {
background: #F5F6F6;
}
</style>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
@import '../style/mixin.scss';
@import '../style/global.scss';
.mt-100 {
padding-top: px2rem(63px) !important;
}
</style>
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册