吉光研途前端代码仓库
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

158 lines
3.4 KiB

<template>
<view class="page__view">
<!-- 导航栏 -->
<navbar :title="title" leftClick @leftClick="$utils.navigateBack" />
<view class="top">
<!-- 搜索栏 -->
<view class="search">
<uv-search v-model="keyword" :showAction="false" placeholder="输入关键词搜索" placeholderColor="#B2B2B2" bgColor="#FFFFFF" @custom="search" @search="search">
<template #prefix>
<view class="flex search-icon">
<image class="img" src="@/static/image/icon-search.png" mode="widthFix"></image>
</view>
</template>
</uv-search>
</view>
</view>
<view class="main">
<template v-if="total">
<view class="card" v-for="item in list" :key="item.id">
<thesisCard :data="item" @jumpToDetail="jumpToDetail(item.id)"></thesisCard>
</view>
</template>
<template v-else>
<view class="flex empty">
<image class="empty-icon" src="@/static/image/icon-empty.png" mode="widthFix"></image>
</view>
</template>
</view>
</view>
</template>
<script>
import mixinsList from '@/mixins/list.js'
import thesisCard from './thesisCard.vue'
export default {
mixins: [mixinsList],
components: {
thesisCard,
},
data() {
return {
title: '搜索',
keyword: '',
queryParams: {
pageNo: 1,
pageSize: 10,
title: '',
},
mixinsListApi: 'queryThesisList',
}
},
onLoad({ search, categoryOne, categoryTwo, title, api }) {
if (search) {
this.keyword = search
this.queryParams.title = search
}
if (categoryTwo) {
this.queryParams.categoryOne = categoryOne
this.queryParams.categoryTwo = categoryTwo
}
if (title) {
this.title = title
}
if (api) {
this.mixinsListApi = api
}
this.getData()
},
methods: {
search() {
this.queryParams.pageNo = 1
this.queryParams.pageSize = 10
this.queryParams.title = this.keyword
this.getData()
},
jumpToDetail(thesisId) {
let path = this.mixinsListApi == 'queryThesisList' ? '/pages_order/thesis/index' : '/pages_order/thesis/indexTwo'
uni.navigateTo({
url: `${path}?thesisId=${thesisId}`
})
},
},
}
</script>
<style scoped lang="scss">
.page__view {
background: $uni-bg-color-grey;
}
.top {
padding: 34rpx 38rpx 28rpx 38rpx;
box-sizing: border-box;
}
.search {
width: 100%;
// width: calc(100% - 38rpx * 2);
height: 48rpx;
background-color: #FFFFFF;
border-radius: 37rpx;
box-sizing: border-box;
display: flex;
align-items: center;
overflow: hidden;
box-shadow: 2rpx 2rpx 9rpx 0 rgba($color: #C5C5C5, $alpha: 0.75);
/deep/ .uv-search__content {
padding: 0;
border: none;
}
/deep/ .uv-search__content__input {
margin-left: 18rpx;
}
&-icon {
padding: 18rpx 10rpx 18rpx 18rpx;
background: rgba($color: #E8DBF3, $alpha: 0.8);
.img {
width: 30rpx;
height: auto;
}
}
}
.main {
padding: 0 38rpx 38rpx 38rpx;
box-sizing: border-box;
}
.card {
background: #FFFFFF;
border-radius: 10rpx;
box-shadow: 4rpx 4rpx 6rpx 0rpx rgba(0,0,0,0.15);
overflow: hidden;
& + & {
margin-top: 26rpx;
}
}
.empty {
margin-top: 165rpx;
}
</style>