Skip to content

C
CFFP-HB
Commit 76785289 by sunchao
Options

搜索栏组件化&课程搜索接口对接

parent 8fda25ff
Showing with 131 additions and 70 deletions
components/search/search.vue 0 → 100644
<template>
<view class="search">
<input class="searchInput" type="text" name="" id="" v-model="queryName"/>
<text class="iconfont icon-sousuo" @click="searchBtn()"></text>
<text class="iconfont icon-xiaoxi"></text>
<text class="system_msg" @click="jumpToSystemMsg()">{{messageUnreadCount}}</text>
</view>
</template>
<script>
import api from "../../api/api";
import common from '../../common/common';
export default{
props:['isSearch'],
data(){
return {
messageUnreadCount:null,
queryName:null
}
},
name:'search',
components:{},
onLoad(){
},
methods:{
jumpToSystemMsg(){
uni.navigateTo({
url:'../systemMsg/system_msg'
})
},
querySystemMessage(){
api.querySystemMessage({systemType:1,userId:uni.getStorageSync('cffp_userId')}).then((res)=>{
if(res['success']){
this.messageUnreadCount = res['data']['unReadcount'];
if(Number(this.messageUnreadCount) > 99){
this.messageUnreadCount = '99+';
}
}else{
this.messageUnreadCount = null;
}
})
},
searchBtn(){
if(this.isSearch == 1){
//掉查询
this.$emit("send",this.queryName)
}else{
//有参数就掉查询否则直接跳转到课程列表页
if(this.queryName){
this.$emit("send",this.queryName)
}else{
uni.navigateTo({
url:'/pages/courselist/courselist'
})
}
}
}
},
mounted() {
this.querySystemMessage();
this.queryName = common.getQueryString('queryName');
}
}
</script>
<style lang="scss">
.search{
position: relative;
display: flex;
margin: 30rpx auto;
align-items: center;
.searchInput{
border-radius: 60rpx;
width: 95%;
background: linear-gradient(to right,#E6F5FC,#FDE9F2);
margin-right: 20rpx;
padding: 15rpx;
}
.icon-sousuo{
font-size: 60rpx;
position: absolute;
right: 80rpx;
top: 10rpx;
opacity: .7;
}
.icon-xiaoxi{
font-size: 50rpx;
}
.system_msg{
position: absolute;
color: #fff;
background: #fb4e40;
width: 40rpx;
height: 40rpx;
line-height: 40rpx;
border-radius: 50%;
text-align: center;
font-size: 16rpx;
right: -20rpx;
top: -5rpx;
}
}
</style>
\ No newline at end of file
pages/courselist/courselist.vue
<template> <template>
<view :class="{pad:onlyShowList!=0}"> <view :class="{pad:onlyShowList!=0}">
<!--搜索组件-->
<search :isSearch="1" v-if="onlyShowList!=0" @send="getCourseList"></search>
<!--轮播组件-->
<carousel :carouselList="fileUploadItemCFFPList" v-if="onlyShowList!=0"></carousel> <carousel :carouselList="fileUploadItemCFFPList" v-if="onlyShowList!=0"></carousel>
<h4 v-if="cffpCourseInfos.length<=0" class="noListTip">暂无课程列表</h4> <h4 v-if="cffpCourseInfos.length<=0" class="noListTip">暂无课程列表</h4>
<view class="ulBox" v-if="cffpCourseInfos.length>0"> <view class="ulBox" v-if="cffpCourseInfos.length>0">
...@@ -15,21 +18,24 @@ ...@@ -15,21 +18,24 @@
import api from "../../api/api"; import api from "../../api/api";
import courseItem from "@/components/courseItem/courseItem.vue"; import courseItem from "@/components/courseItem/courseItem.vue";
import tabBar from '../../components/tabBar/tabBar.vue'; import tabBar from '../../components/tabBar/tabBar.vue';
import carousel from '@/components/carousel/carousel.vue' import carousel from '@/components/carousel/carousel.vue';
import search from '@/components/search/search.vue';
export default{ export default{
props:['tagIds','onlyShowList'], props:['tagIds','onlyShowList'],
data(){ data(){
return{ return{
cffpCourseInfos:[], cffpCourseInfos:[],
currentPage:'courselist', currentPage:'courselist',
fileUploadItemCFFPList:[] fileUploadItemCFFPList:[],
queryName:null
} }
}, },
name:'courselist', name:'courselist',
components:{ components:{
courseItem, courseItem,
tabBar, tabBar,
carousel carousel,
search
}, },
onLoad(){ onLoad(){
this.fileUploadItemCFFPList = uni.getStorageSync('fileUploadItemCFFPList'); this.fileUploadItemCFFPList = uni.getStorageSync('fileUploadItemCFFPList');
...@@ -41,7 +47,10 @@ ...@@ -41,7 +47,10 @@
}); });
}, },
courseList(){ courseList(){
api.courseList().then(res=>{ const param = {
queryName:this.queryName
}
api.courseList(param).then(res=>{
if(res['success']){ if(res['success']){
this.cffpCourseInfos = res['data']['data']; this.cffpCourseInfos = res['data']['data'];
}else{ }else{
...@@ -59,7 +68,12 @@ ...@@ -59,7 +68,12 @@
}else{ }else{
return [].concat(v2,val) return [].concat(v2,val)
} }
} },
getCourseList: function(res){
console.log("res=========",res)
this.queryName = res;
this.courseList()
}
}, },
mounted() { mounted() {
this.courseList(); this.courseList();
......
pages/index/index.vue
...@@ -6,12 +6,8 @@ ...@@ -6,12 +6,8 @@
<text class="name">{{cffpUserInfo.name}}</text> <text class="name">{{cffpUserInfo.name}}</text>
<text class="iconfont icon-31tishi" @click="getIntroduce('center')"></text> <text class="iconfont icon-31tishi" @click="getIntroduce('center')"></text>
</view> </view>
<view class="search"> <!--搜索组件-->
<input class="searchInput" type="text" name="" id="" /> <search :isSearch="0"></search>
<text class="iconfont icon-sousuo" @click="searchBtn()"></text>
<text class="iconfont icon-xiaoxi"></text>
<text class="system_msg" @click="jumpToSystemMsg()">{{messageUnreadCount}}</text>
</view>
<!--轮播组件--> <!--轮播组件-->
<carousel :carouselList="cffpUserInfo.fileUploadItemList"></carousel> <carousel :carouselList="cffpUserInfo.fileUploadItemList"></carousel>
</view> </view>
...@@ -56,6 +52,7 @@ ...@@ -56,6 +52,7 @@
import api from "../../api/api"; import api from "../../api/api";
import tabBar from '../../components/tabBar/tabBar.vue'; import tabBar from '../../components/tabBar/tabBar.vue';
import carousel from '@/components/carousel/carousel.vue'; import carousel from '@/components/carousel/carousel.vue';
import search from '@/components/search/search.vue';
export default { export default {
data() { data() {
return { return {
...@@ -78,7 +75,6 @@ ...@@ -78,7 +75,6 @@
type:''//类型1,区域中心，2工作室 type:''//类型1,区域中心，2工作室
}, },
announcementInfo:null, announcementInfo:null,
messageUnreadCount:null,
tagIds:123, tagIds:123,
currentPage:'index', currentPage:'index',
carouselList:[] carouselList:[]
...@@ -87,12 +83,12 @@ ...@@ -87,12 +83,12 @@
components:{ components:{
courselist, courselist,
tabBar, tabBar,
carousel carousel,
search
}, },
onLoad() { onLoad() {
this.queryAreaCenterInfo(); this.queryAreaCenterInfo();
this.announcementQuery(); this.announcementQuery();
this.querySystemMessage();
}, },
methods: { methods: {
featureSelect(featureItem){ featureSelect(featureItem){
...@@ -140,31 +136,11 @@ ...@@ -140,31 +136,11 @@
url:`../announcement/announcement` url:`../announcement/announcement`
}) })
}, },
jumpToSystemMsg(){
uni.navigateTo({
url:'../systemMsg/system_msg'
})
},
querySystemMessage(){
api.querySystemMessage({systemType:1,userId:uni.getStorageSync('cffp_userId')}).then((res)=>{
if(res['success']){
this.messageUnreadCount = res['data']['unReadcount'];
if(Number(this.messageUnreadCount) > 99){
this.messageUnreadCount = '99+';
}
}else{
this.messageUnreadCount = null;
}
})
},
goToCourselist(){ goToCourselist(){
uni.navigateTo({ uni.navigateTo({
url:'../../pages/courselist/courselist' url:'../../pages/courselist/courselist'
}) })
}, },
searchBtn(){
}
}, },
onShow() { onShow() {
if(!uni.getStorageSync('isLogin')){ if(!uni.getStorageSync('isLogin')){
...@@ -198,42 +174,6 @@ ...@@ -198,42 +174,6 @@
border-radius: 20rpx; border-radius: 20rpx;
overflow: hidden; overflow: hidden;
} }
.search{
position: relative;
display: flex;
margin: 30rpx auto;
align-items: center;
.searchInput{
border-radius: 60rpx;
width: 95%;
background: linear-gradient(to right,#E6F5FC,#FDE9F2);
margin-right: 20rpx;
padding: 15rpx;
}
.icon-sousuo{
font-size: 60rpx;
position: absolute;
right: 80rpx;
top: 10rpx;
opacity: .7;
}
.icon-xiaoxi{
font-size: 50rpx;
}
.system_msg{
position: absolute;
color: #fff;
background: #fb4e40;
width: 40rpx;
height: 40rpx;
line-height: 40rpx;
border-radius: 50%;
text-align: center;
font-size: 16rpx;
right: -20rpx;
top: -5rpx;
}
}
} }
.message{ .message{
display: flex; display: flex;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment