Browse Source

新增资源模块

master
xuxu 5 years ago
parent
commit
32bd6d9f46
  1. 123
      pages/resource/detail/index.js
  2. 3
      pages/resource/detail/index.json
  3. 20
      pages/resource/detail/index.wxml
  4. 61
      pages/resource/detail/index.wxss
  5. 86
      pages/resource/index.js
  6. 5
      pages/resource/index.json
  7. 31
      pages/resource/index.wxml
  8. 76
      pages/resource/index.wxss

123
pages/resource/detail/index.js

@ -0,0 +1,123 @@
// pages/resource/detail/index.js
import { TopicModel } from '../../../models/topic.js'
let topicModel = new TopicModel()
Page({
/**
* 页面的初始数据
*/
data: {
titlePic:"/images/temp_1.png",
unStar: '/images/common/star.png',
star: '/images/common/star_light.png',
detail:{},
isCollect:false
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var id = options.id;
topicModel.getResourceDetail(id,res=>{
if(res.result.isCollection == 1){
this.setData({
isCollect:true,
})
}else{
this.setData({
isCollect:false,
})
}
this.setData({
detail:res.result,
})
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
previewImage:function(e){
// var current = e.target.dataset.src;
var th = this;
if(th.data.detail.titlePic){
var urls = [th.data.detail.titlePic];
wx.previewImage({
urls:urls// 需要预览的图片http链接列表
})
}else{
return;
}
},
onClickCollect:function(){
this.setData({
isCollect: !this.data.isCollect
})
this.fetchTopicCollect();
},
fetchTopicCollect(){
let id = this.data.detail.id
topicModel.resourceCollect(id,res =>{
//console.log('收藏')
if(res.code === 200){
wx.showToast({
title: '收藏成功',
icon: 'none'
})
}
})
},
})

3
pages/resource/detail/index.json

@ -0,0 +1,3 @@
{
"usingComponents": {}
}

20
pages/resource/detail/index.wxml

@ -0,0 +1,20 @@
<!--pages/resource/detail/index.wxml-->
<view class="title">
<view class="left">
<view class="articleImg">
<image src="{{detail.titlePic ? detail.titlePic : titlePic}}" bindtap="previewImage" mode="widthFix" style="width:100%;"></image>
</view>
<!-- <image class="articleImg" src="{{detail.titlePic ? detail.titlePic : titlePic}}" bindtap="previewImage"></image> -->
<view class="content">
<view class="tit">{{detail.title}}</view>
<view class="r_type">{{detail.typeName}}</view>
</view>
</view>
<view class="right">
<image class="artice_collect" src="{{isCollect ? star : unStar}}" bindtap="onClickCollect"></image>
</view>
</view>
<view class="text">
<rich-text nodes="{{detail.content}}"></rich-text>
</view>

61
pages/resource/detail/index.wxss

@ -0,0 +1,61 @@
/* pages/resource/detail/index.wxss */
/* @import '../../style/font.wxss'; */
page{
width: 100%;
display: flex;
align-items: center;
flex-direction: column;
}
.title{
display: flex;
align-items: center;
justify-content: space-between;
width: 90%;
min-height: 90px;
border-bottom: 2px solid whitesmoke;
margin-top:5px;
}
.left{
display: flex;
align-items: center;
flex: 1;
}
.right{
width: 15px;
text-align:right;
}
.articleImg{
width: 55px;
height: 55px;
display: flex;
align-items: center;
/* border-radius: 50%; */
}
.content{
margin-left: 15px;
margin-right: 20px;
flex: 1;
}
.tit{
width: 100%;
font-weight:1000;
}
.r_type{
font-size: 13px;
}
.artice_collect {
width: 20px;
height: 20px;
}
.text{
width: 90%;
}

86
pages/resource/index.js

@ -0,0 +1,86 @@
// pages/resource/index.js
import { TopicModel } from '../../models/topic.js'
let topicModel = new TopicModel()
Page({
/**
* 页面的初始数据
*/
data: {
titlePic:"/images/temp_1.png",
page:1,
list:[],
show:true
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var typeCode = options.typeCode;
topicModel.getResourceList(typeCode,1,res=>{
this.setData({
list:res.result.records
})
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
detail:function(e){
if (!e.currentTarget.dataset.id){
return;
}
wx.navigateTo({
url: 'detail/index?id=' + e.currentTarget.dataset.id
})
}
})

5
pages/resource/index.json

@ -0,0 +1,5 @@
{
"usingComponents": {
"van-popup": "/components/vant/popup/index"
}
}

31
pages/resource/index.wxml

@ -0,0 +1,31 @@
<!--pages/resource/index.wxml-->
<view class="container">
<view class="column" wx:for="{{ list }}" bindtap="detail" data-id="{{item.id}}">
<view class="left">
<view class="articleImg">
<image src="{{item.titlePic ? item.titlePic : titlePic}}" mode="widthFix" style="width:100%;"></image>
</view>
<view class="content">
<view class="title">{{item.title}}</view>
<view class="r_type">{{item.typeName}}</view>
</view>
</view>
<view class="right"><text class="fa fa-angle-right fa-lg"></text></view>
</view>
</view>
<van-popup
show="{{ show }}"
bind:close="onClose"
custom-style="height: 80%;width:80%"
>
<view class="tips">
<view class="tips-con">
内容内容内容内容内容内容内容
</view>
</view>
</van-popup>

76
pages/resource/index.wxss

@ -0,0 +1,76 @@
/* pages/resource/index.wxss */
@import '../../style/font.wxss';
page{
width: 100%;
display: flex;
background-color: whitesmoke;
}
.container{
display: flex;
width: 100%;
flex-direction: column;
align-items: center;
background-color: white;
margin-top:10px;
}
.column{
display: flex;
align-items: center;
justify-content: space-between;
width: 90%;
height: 90px;
border-bottom: 2px solid whitesmoke;
}
.left{
display: flex;
align-items: center;
flex: 1;
}
.right{
width: 15px;
text-align:right;
}
.articleImg{
width: 55px;
height: 55px;
display: flex;
align-items: center;
/* border-radius: 50%; */
}
.content{
margin-left: 15px;
margin-right: 20px;
flex: 1;
}
.title{
width: 100%;
display: -webkit-box;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
word-break: break-all;
font-weight:1000;
}
.r_type{
font-size: 13px;
}
.tips{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.tips-con{
width: 90%;
height: 90;
}
Loading…
Cancel
Save