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.
343 lines
7.2 KiB
343 lines
7.2 KiB
10 months ago
|
<template>
|
||
|
<view class="recommend-question">
|
||
|
<view>
|
||
|
{{ obj.title }}
|
||
|
<navigator hover-class="none" url="/pages/topic/question_category?type=2">
|
||
|
查看更多<text class="iconfont iconxiangyou"></text>
|
||
|
</navigator>
|
||
|
</view>
|
||
|
<view v-if="obj.typesetting === 4" id="swiper6" class="swiper-container">
|
||
|
<view class="swiper-wrapper">
|
||
|
<view v-for="item in obj.list" :key="item.id" class="swiper-slide ques-view" style="margin-right: 20rpx;margin-top: 0;">
|
||
|
<navigator hover-class="none" style="width: 620rpx;" url="" @click="jumpProblem(item)">
|
||
|
<view>
|
||
|
<image class="figure" mode="aspectFill" :src="item.image" />
|
||
|
</view>
|
||
|
<view class="attr">
|
||
|
<view class="title">{{ item.title }}</view>
|
||
|
<view class="people">{{ item.count }}人已答题</view>
|
||
|
<view class="group">
|
||
|
<view v-if="item.pay_type" class="money">
|
||
|
¥<text>{{ item.money }}</text>
|
||
|
</view>
|
||
|
<view v-else class="money free">免费</view>
|
||
|
<view class="link">
|
||
|
<image :src="getImgPath( '/wap/first/zsff/images/question08.png')" />答题
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</navigator>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view v-else :class="{ gird: obj.typesetting === 2, small: obj.typesetting === 3 }" style="padding: 30rpx 20rpx;">
|
||
|
<view v-for="item in obj.list" :key="item.id" class="ques-view">
|
||
|
<navigator hover-class="none" class="navigator" url="" @click="jumpProblem(item)" >
|
||
|
<view >
|
||
|
<image class="figure" mode="aspectFill" :src="item.image" />
|
||
|
</view>
|
||
|
<view class="attr">
|
||
|
<view class="title">{{ item.title }}</view>
|
||
|
<view v-if="obj.typesetting === 2" class="people">
|
||
|
{{ item.answer }}人已答题
|
||
|
</view>
|
||
|
<view v-if="obj.typesetting === 3 && item.pay_type" class="money">
|
||
|
¥<text>{{ item.money }}</text>
|
||
|
</view>
|
||
|
<view v-if="obj.typesetting === 3 && !item.pay_type" class="money free">
|
||
|
免费
|
||
|
</view>
|
||
|
<view class="group">
|
||
|
<view v-if="obj.typesetting !== 3 && item.pay_type" class="money">
|
||
|
¥<text>{{ item.money }}</text>
|
||
|
</view>
|
||
|
<view v-if="obj.typesetting !== 3 && !item.pay_type" class="money free">
|
||
|
免费
|
||
|
</view>
|
||
|
<view v-if="obj.typesetting !== 2" class="people">
|
||
|
{{ item.answer }}人已答题
|
||
|
</view>
|
||
|
<view class="link">
|
||
|
<image :src="getImgPath( '/wap/first/zsff/images/question08.png')" />答题
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</navigator>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
export default {
|
||
|
props: {
|
||
|
obj: {
|
||
|
type: Object,
|
||
|
default: function () {
|
||
|
return {};
|
||
|
},
|
||
|
},
|
||
|
},
|
||
|
data: function () {
|
||
|
return {
|
||
|
|
||
|
};
|
||
|
},
|
||
|
mounted: function () {
|
||
|
},
|
||
|
methods: {
|
||
|
jumpProblem(item) {
|
||
|
this.$util.checkLogin(() => {
|
||
|
uni.navigateTo({
|
||
|
url: `/pages/special/question_index?id=${item.id}`
|
||
|
})
|
||
|
}, true);
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style scoped>
|
||
|
.recommend-question {
|
||
|
margin-top: 14rpx;
|
||
|
/* background-color: #ffffff; */
|
||
|
}
|
||
|
|
||
|
.recommend-question > view:first-child {
|
||
|
|
||
|
display: flex;
|
||
|
|
||
|
justify-content: space-between;
|
||
|
|
||
|
align-items: center;
|
||
|
padding-top: 15rpx;
|
||
|
padding-right: 20rpx;
|
||
|
padding-left: 20rpx;
|
||
|
font-weight: bold;
|
||
|
font-size: 32rpx;
|
||
|
color: #333;
|
||
|
margin-left: 20rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question > view:first-child navigator {
|
||
|
font-weight: normal;
|
||
|
font-size: 22rpx;
|
||
|
color: #999999;
|
||
|
margin-right: 25rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .iconxiangyou {
|
||
|
margin-left: 9rpx;
|
||
|
font-size: 18rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .swiper-container {
|
||
|
padding: 30rpx 20rpx 50rpx;
|
||
|
background: #ffffff;
|
||
|
width: 686rpx;
|
||
|
margin: auto;
|
||
|
border-radius: 24rpx;
|
||
|
}
|
||
|
|
||
|
/* .recommend-question .swiper-slide > navigator {
|
||
|
|
||
|
display: flex;
|
||
|
|
||
|
|
||
|
flex-direction: column;
|
||
|
|
||
|
justify-content: space-between;
|
||
|
width: 520rpx;
|
||
|
height: 490rpx;
|
||
|
border-radius: 10rpx;
|
||
|
overflow: hidden;
|
||
|
|
||
|
box-shadow: 0 3rpx 2rpx rgba(0, 0, 0, .07);
|
||
|
} */
|
||
|
|
||
|
.recommend-question .swiper-slide {
|
||
|
width: 620rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .swiper-slide navigator {
|
||
|
|
||
|
display: flex;
|
||
|
padding: 20rpx;
|
||
|
border-radius: 12rpx;
|
||
|
/* box-shadow: 0 3rpx 20rpx rgba(0, 0, 0, 0.07); */
|
||
|
}
|
||
|
|
||
|
.recommend-question .swiper-slide .figure {
|
||
|
width: 300rpx;
|
||
|
height: 169rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .swiper-slide .attr {
|
||
|
|
||
|
flex: 1;
|
||
|
|
||
|
display: flex;
|
||
|
|
||
|
|
||
|
flex-direction: column;
|
||
|
|
||
|
justify-content: space-between;
|
||
|
min-width: 0;
|
||
|
height: auto;
|
||
|
padding-top: 0;
|
||
|
margin-left: 20rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .swiper-slide .group {
|
||
|
|
||
|
justify-content: space-between;
|
||
|
}
|
||
|
|
||
|
/* .recommend-question .gird{
|
||
|
margin-top: 30rpx;
|
||
|
} */
|
||
|
|
||
|
.recommend-question .ques-view~.ques-view {
|
||
|
margin-top: 30rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .figure {
|
||
|
display: block;
|
||
|
width: 100%;
|
||
|
height: 380rpx;
|
||
|
border-radius: 10rpx;
|
||
|
object-fit: cover;
|
||
|
-webkit-touch-callout: none;
|
||
|
pointer-events: none;
|
||
|
}
|
||
|
|
||
|
.recommend-question .title {
|
||
|
overflow: hidden;
|
||
|
white-space: nowrap;
|
||
|
text-overflow: ellipsis;
|
||
|
font-size: 28rpx;
|
||
|
color: #333;
|
||
|
}
|
||
|
|
||
|
.recommend-question .people {
|
||
|
font-size: 22rpx;
|
||
|
color: #999999;
|
||
|
}
|
||
|
|
||
|
.recommend-question .money {
|
||
|
font-weight: bold;
|
||
|
font-size: 22rpx;
|
||
|
color: #ff6b00;
|
||
|
}
|
||
|
|
||
|
.recommend-question .money text {
|
||
|
font-size: 32rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .free {
|
||
|
font-size: 28rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .link {
|
||
|
height: 38rpx;
|
||
|
padding-right: 17rpx;
|
||
|
padding-left: 17rpx;
|
||
|
border-radius: 19rpx;
|
||
|
background-color: #f2f8ff;
|
||
|
font-size: 22rpx;
|
||
|
line-height: 38rpx;
|
||
|
color: #2c8eff;
|
||
|
}
|
||
|
|
||
|
.recommend-question .link image {
|
||
|
width: 17rpx;
|
||
|
height: 19rpx;
|
||
|
margin-right: 10rpx;
|
||
|
-webkit-touch-callout: none;
|
||
|
pointer-events: none;
|
||
|
}
|
||
|
|
||
|
.recommend-question .attr {
|
||
|
|
||
|
display: flex;
|
||
|
-webkit-box-orient: vertical;
|
||
|
-webkit-box-direction: normal;
|
||
|
flex-direction: column;
|
||
|
-webkit-box-pack: justify;
|
||
|
justify-content: space-between;
|
||
|
height: 112rpx;
|
||
|
padding-top: 13rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .group {
|
||
|
|
||
|
display: flex;
|
||
|
|
||
|
align-items: center;
|
||
|
}
|
||
|
|
||
|
.recommend-question .group .people {
|
||
|
|
||
|
flex: 1;
|
||
|
margin-left: 22rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .small view > .navigator {
|
||
|
|
||
|
display: flex;
|
||
|
}
|
||
|
|
||
|
.recommend-question .small .figure {
|
||
|
width: 250rpx;
|
||
|
height: 141rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .small .attr {
|
||
|
|
||
|
flex: 1;
|
||
|
min-width: 0;
|
||
|
height: auto;
|
||
|
padding-top: 0;
|
||
|
margin-left: 24rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .small .people {
|
||
|
margin-left: 0;
|
||
|
}
|
||
|
|
||
|
.recommend-question .gird {
|
||
|
|
||
|
display: flex;
|
||
|
flex-wrap: wrap;
|
||
|
|
||
|
justify-content: space-between;
|
||
|
|
||
|
align-items: center;
|
||
|
padding-top: 0;
|
||
|
}
|
||
|
|
||
|
/* .recommend-question .gird view {
|
||
|
width: 345rpx;
|
||
|
margin-top: 30rpx;
|
||
|
} */
|
||
|
|
||
|
.recommend-question .gird .figure {
|
||
|
width: 345rpx;
|
||
|
height: 192rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .gird .attr {
|
||
|
height: 151rpx;
|
||
|
}
|
||
|
|
||
|
.recommend-question .gird .group {
|
||
|
|
||
|
justify-content: space-between;
|
||
|
}
|
||
|
.swiper-wrapper{
|
||
|
overflow:auto;
|
||
|
background: #fbfbfb;
|
||
|
border-radius: 24rpx;
|
||
|
}
|
||
|
</style>
|