|
|
@@ -1,6 +1,21 @@
|
|
|
<template>
|
|
|
<view class="content">
|
|
|
-
|
|
|
+ <view class="main">
|
|
|
+ <view v-for="(item, index) in 10">
|
|
|
+ <view class="first" v-if="index == 0">
|
|
|
+ <view class="title">【鼎立足行】鼎立足行足垫走姿矫正器研发相关 纪录大揭秘</view>
|
|
|
+ <view class="image"></view>
|
|
|
+ <view class="time">更新时间:2021-12-06</view>
|
|
|
+ </view>
|
|
|
+ <view class="item flex" v-else>
|
|
|
+ <view class="item-left"></view>
|
|
|
+ <view class="item-right">
|
|
|
+ <view class="item-font clamp">信愿行如三足鼎立，缺一不可</view>
|
|
|
+ <view class="item-time">更新时间:2021-12-06</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -9,6 +24,7 @@ import { getCategoryList } from '@/api/product.js';
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ list: []
|
|
|
};
|
|
|
},
|
|
|
onLoad() {
|
|
|
@@ -22,7 +38,7 @@ export default {
|
|
|
navToList(sid, tid) {
|
|
|
// 点击导航跳转到详细页面
|
|
|
uni.navigateTo({
|
|
|
- url: '/pages/product/list?fid='+this.currentId+'&sid='+sid+'&tid='+tid
|
|
|
+ url: '/pages/product/list?fid=' + this.currentId + '&sid=' + sid + '&tid=' + tid
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
@@ -32,11 +48,76 @@ export default {
|
|
|
<style lang="scss">
|
|
|
page,
|
|
|
.content {
|
|
|
- height: 100%;
|
|
|
- background-color: #f8f8f8;
|
|
|
+ height: auto;
|
|
|
+ min-height: 100%;
|
|
|
+ background: #f5f5f5;
|
|
|
}
|
|
|
-
|
|
|
-.content {
|
|
|
- display: flex;
|
|
|
+.main {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ background: #ffffff;
|
|
|
+ .first {
|
|
|
+ padding: 50rpx 0 18rpx;
|
|
|
+ margin: 0 22rpx;
|
|
|
+ border-bottom: 1px solid #e0e0e0;
|
|
|
+ .title {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ .image {
|
|
|
+ width: 710rpx;
|
|
|
+ height: 400rpx;
|
|
|
+ background: #4cd964;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .time {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .item {
|
|
|
+ padding: 26rpx 0 18rpx;
|
|
|
+ margin: 0 22rpx;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: flex-start;
|
|
|
+ border-bottom: 1px solid #e0e0e0;
|
|
|
+ .item-left {
|
|
|
+ width: 224rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ background: #DC4D46;
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .item-right {
|
|
|
+ height: 160rpx;
|
|
|
+ margin-left: 24rpx;
|
|
|
+ padding: 18rpx 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ .item-font {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ .item-time {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
