我的、期刊详情页

app.json

@@ -1,8 +1,8 @@
 {
   "pages": [
+    "pages/journalDetail/journalDetail",
     "pages/mine/mine",
     "pages/index/index",
-    
     "pages/learning/index",
     "pages/learning/learning",
     "pages/knowledge/knowledge"

app.wxss

@@ -1,4 +1,7 @@
 /**app.wxss**/
+page{
+  background: #F1F1F1;
+}
 page,view,text,input,scroll-view{
   box-sizing: border-box;
   font-size: 28rpx;

pages/journalDetail/journalDetail.js

@@ -0,0 +1,66 @@
+// pages/journalDetail/journalDetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/journalDetail/journalDetail.json

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

pages/journalDetail/journalDetail.wxss

@@ -0,0 +1,60 @@
+/* pages/journalDetail/journalDetail.wxss */
+.container{
+  margin:30rpx;
+  background: #fff;
+  border-radius: 10rpx;
+  padding:20rpx;
+}
+.baseinfo{
+  display: flex;
+  margin-bottom:30rpx;
+  position: relative;
+}
+.baseinfo .faceimg{
+  margin-right: 20rpx;
+}
+.baseinfo .faceimg image{
+  width:180rpx;
+  height: 236rpx;
+}
+
+.baseinfo .tweo view{
+  margin-bottom:24rpx;
+  font-size: 24rpx;
+  color: #999999;
+}
+.baseinfo .tweo .title{
+  font-size: 32rpx;
+  color:#333333;
+  margin-bottom:40rpx;
+}
+.baseinfo .gzgzh{
+  position: absolute;
+  width: 136rpx;
+  height: 48rpx;
+  background: #298EF9;
+  border-radius: 8rpx;
+  font-size:20rpx;
+  color:#ffffff;
+  right: 20rpx;
+  padding:0px;
+  line-height: 48rpx;
+}
+
+.intro text{
+  font-size: 28rpx;
+  color: #333333;
+  font-weight: 500;
+}
+.intro .desc{
+  margin-top:30rpx;
+  color: #666666;
+  line-height: 45rpx;
+}
+.content{
+  margin-top:48rpx;
+}
+.content view{
+  margin-bottom:28rpx;
+  color: #333333;
+}

pages/mine/mine.json

@@ -1,3 +1,7 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+    "backgroundTextStyle": "light",
+    "navigationBarBackgroundColor": "#fff",
+    "navigationBarTitleText": "我的",
+    "navigationBarTextStyle": "black"
 }

pages/mine/mine.wxml

@@ -1,10 +1,19 @@
 <!--pages/mine/mine.wxml-->
 <view class="avatar">
-  <image src="../images/avatar.jpg"></image>
   <view>
-    <text class="nickname">我好我的祖国</text>
+    <image src="../images/avatar.jpg"></image>
+  </view>
+  <view class="nickname">
+    <text>我好我的祖国</text>
   </view>
 </view>
-<view>
-
+<view class="list">
+  <view class="list-item">
+    <text>我的报名</text>
+    <image src="../images/right.png"></image>
+  </view>
+  <view class="list-item">
+    <text>我的收藏</text>
+    <image src="../images/right.png"></image>
+  </view>
 </view>

pages/mine/mine.wxss

@@ -5,16 +5,46 @@ page{
 }
 .avatar{
   width:50%;
-  margin:33rpx auto;
+  margin:60rpx auto;
   text-align: center;
 }
+.avatar view:first-child{
+  width:100%;
+  height: 140rpx;
+}
 .avatar image{
-  width:77rpx;
-  height: 77rpx;
+  width:140rpx;
+  height: 100%;
   border-radius: 50%;
 }
 .avatar .nickname{
-  font-size: 15rpx;
+  font-size: 28rpx;
+  color: #333333;
+  padding-top:30rpx;
+}
+.avatar .nickname text{
+  padding:0rpx;
+  margin:0rpx;
+}
+.list{
+  padding:0 30rpx;
+}
+.list .list-item{
+  height:88rpx;
+  line-height: 88rpx;
+  background:#ffffff;
+  border-radius: 20rpx;
+  margin-bottom:20rpx;
+  padding:0 30rpx;
+  font-size: 28rpx;
   color: #333333;
-  line-height: 21rpx;
+  position:relative;
+}
+.list .list-item image{
+  width: 14rpx;
+  height: 28rpx;
+  text-align: right;
+  position:absolute;
+  right:30rpx;
+  top:30rpx;
 }