提交

src/assets/less/task.less

@@ -1,90 +1,91 @@
-.task-page{
+.task-page {
+  flex-direction: column;
+  background-color: #f7f7f7;
+  .task-banner {
+    width: 100%;
+    height: 300px;
+    .swipe-item {
+      height: 300px;
+      width: 100%;
+    }
+  }
+  .sign-section {
+    width: 690px;
+    height: 466px;
+    border-radius: 12px;
+    background-color: #fff;
+    box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.05);
+    margin: -30px auto;
+    padding: 38px 18px;
+    justify-content: flex-start;
+    align-items: flex-start;
     flex-direction: column;
-    background-color: #F7F7F7;
-    .task-banner{
-			width:100%;
-			height:300px;
-			.swipe-item{
-				height:300px;
-				width:100%;
-			}
+    line-height: 150%;
+    .sign-title {
+      align-items: center;
+      text {
+        font-size: 28px;
+        font-weight: 800;
+      }
+      image {
+        width: 22px;
+        height: 22px;
+        margin-left: 5px;
+      }
     }
-    .sign-section{
-			width: 690px;
-			height: 466px;
-			border-radius:12px;
-			background-color: #fff;
-			box-shadow:0px 0px 9px 0px rgba(0,0,0,0.05);
-			margin: -30px auto;
-			padding: 38px 18px;
-			justify-content: flex-start;
-			align-items: flex-start;
-			flex-direction: column;
-			line-height: 150%;
-			.sign-title{
-				align-items: center;
-				text{
-					font-size: 28px;
-					font-weight: 800;
-				}
-				image{
-					width:22px;
-					height:22px;
-					margin-left:5px;
-				}
-			}
-			.sign-desc{
-				font-size:24px;
-				color:#999;
-				margin-top:10px;
-			}
+    .sign-desc {
+      font-size: 24px;
+      color: #999;
+      margin-top: 10px;
     }
+  }
 }
 
-.reader-leaver{
-	width:690px;
-	margin:60px auto 0;
-	border-radius: 12px;
-	background-color: #fff;
-	padding:30px;
-	flex-direction: column;
-	.l-top{
-		justify-content: space-between;
-		flex:1;
-	}
-	.l-title{
-		font-size: 30px;
-		color:#333;
-		font-weight: bold;
-	}
-	.l-more{
-		font-size: 24px;
-		color: #999;
-	}
-	.recent-list{
-		margin-top: 30px;
-		justify-content: space-between;
-	}
-	.read-recent{
-		margin-top:-20px;
-		text{
-			font-size:24px;
-		color:#999;
-		margin-bottom: 30px;
-		}
-		
-	}
+.reader-leaver {
+  width: 690px;
+  margin: 60px auto 0;
+  border-radius: 12px;
+  background-color: #fff;
+  padding: 30px;
+  flex-direction: column;
+  .l-top {
+    justify-content: space-between;
+    flex: 1;
+  }
+  .l-title {
+    font-size: 30px;
+    color: #333;
+    font-weight: bold;
+  }
+  .l-more {
+    font-size: 24px;
+    color: #999;
+  }
+  .recent-list {
+    margin-top: 30px;
+    justify-content: space-between;
+  }
+  .read-recent {
+    margin-top: -20px;
+    text {
+      font-size: 24px;
+      color: #999;
+      margin-bottom: 30px;
+    }
+  }
 }
-.sign{
-	&-line {
-    margin:50px auto 20px;
-		height: 140px;
-		width: 100%;
+.sign {
+  &-line {
+    margin: 50px auto 20px;
+    height: 140px;
+    width: 100%;
+
     &__item {
       flex: 1;
       flex-direction: column;
       align-items: center;
       justify-content: space-around;
+      border: 1px #fbb11b solid;
     }
     &__day {
       color: #999;
@@ -96,157 +97,161 @@
     }
     &__fee {
       font-size: 22px;
-		}
-	}
-	&-button{
-		width:424px;
-		height:72px;
-		line-height: 72px;
-		background-color:#EF5952;
-		border-radius: 36px;
-		font-size:34px;
-		margin: 15px auto 0;
-		color:#fff;
-		text-align: center;
-	}
-	&-button-disabled{
-		width:424px;
-		height:72px;
-		line-height: 72px;
-		background-color:#FCDEDC;
-		border-radius: 36px;
-		font-size:34px;
-		margin: 15px auto 0;
-		color:#EF5952;
-		text-align: center;
-	}
+      color: #fbb11b;
+    }
+  }
+  &-button {
+    width: 424px;
+    height: 72px;
+    line-height: 72px;
+    background-color: #ef5952;
+    border-radius: 36px;
+    font-size: 34px;
+    margin: 15px auto 0;
+    color: #fff;
+    text-align: center;
+  }
+  &-button-disabled {
+    width: 424px;
+    height: 72px;
+    line-height: 72px;
+    background-color: #fcdedc;
+    border-radius: 36px;
+    font-size: 34px;
+    margin: 15px auto 0;
+    color: #ef5952;
+    text-align: center;
+  }
 }
 
-.task{
-	&-section{
-		flex-direction: column;
-		padding:34px 30px;
-		width:690px;
-		box-shadow:0px 0px 18px 0px rgba(0,0,0,0.06);
-		border-radius: 12px;
-		margin: 30px auto 0;
-		background-color: #fff;
-		.banner{
-			width:630px;
-			height:120px;
-			margin-top:20px;
-		}
-		&__tab{
-			justify-content: space-around;
-			text{
-				font-size:32px;
-				padding: 10px 0;
-				border-bottom: 4px solid transparent;
-			}
-			.on{
-				color: #EF5952;
-				border-bottom:4px solid #EF5952;
-				font-weight: bold;
-			}
-		}
-		&__list{
-			flex-direction: column;
-			.list-item{
-				margin:24px 0;
-				height:76px;
-				align-items: center;
-				.icon{
-					width:54px;
-					height:54px;
-				}
-				.content{
-					flex-direction: column;
-					flex:1;
-					margin-left:10px;
-					.content-desc{
-						color: #999;
-						margin-top:5px;
-						font-size:22px;
-					}
-				}
-				.task-award{
-					align-items: flex-end;
-					padding-left:20px;
-					image{
-						width:26px;
-						height:26px;
-					}
-					text{
-						color: #999;
-						font-size:22px;
-					}
-				}
-				.button-status{
-					width:108px;
-					height:40px;
-					border-radius:20px;
-					text-align: center;
-					font-size: 22px;
-				}
-				.wait{
-					border:1px solid #EF5952;
-					background-color: #fff;
-					color:#EF5952;
-				}
-				.disabled{
-					background-color:#eee;
-					color:#999
-				}
-				.get{
-					background-color: #EF5952;
-					color:#fff;
-				}
-			}
-		}
-	}
+.task {
+  &-section {
+    flex-direction: column;
+    padding: 34px 30px;
+    width: 690px;
+    box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.06);
+    border-radius: 12px;
+    margin: 30px auto 0;
+    background-color: #fff;
+    .banner {
+      width: 630px;
+      height: 120px;
+      margin-top: 20px;
+    }
+    &__tab {
+      justify-content: space-around;
+      text {
+        font-size: 32px;
+        padding: 10px 0;
+        border-bottom: 4px solid transparent;
+      }
+      .on {
+        color: #ef5952;
+        border-bottom: 4px solid #ef5952;
+        font-weight: bold;
+      }
+    }
+    &__list {
+      flex-direction: column;
+      font-weight: 600;
+      padding: 20px 0;
+      margin-top: 30px;
+      .list-item {
+        margin: 24px 0;
+        height: 76px;
+        align-items: center;
+        .icon {
+          width: 54px;
+          height: 54px;
+        }
+        .content {
+          flex-direction: column;
+          flex: 1;
+          margin-left: 10px;
+          .content-desc {
+            color: #999;
+            margin-top: 5px;
+            font-size: 22px;
+          }
+        }
+        .task-award {
+          align-items: flex-end;
+          padding-left: 20px;
+          image {
+            width: 26px;
+            height: 26px;
+          }
+          text {
+            color: #999;
+            font-size: 22px;
+          }
+        }
+        .button-status {
+          width: 108px;
+          height: 40px;
+          border-radius: 20px;
+          text-align: center;
+          font-size: 22px;
+        }
+        .wait {
+          border: 1px solid #ef5952;
+          background-color: #fff;
+          color: #ef5952;
+        }
+        .disabled {
+          background-color: #eee;
+          color: #999;
+        }
+        .get {
+          background-color: #ef5952;
+          color: #fff;
+        }
+      }
+    }
+  }
 }
-.mask{
-	position: fixed;
-	top: 0;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	background-color: rgba(0, 0, 0, 0.56);
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	z-index: 2;
-	.rule{
-		width:600px;
-		height:384px;
-		padding: 34px 30px;
-		border-radius: 12px;
-		background-color:#fff;
-		margin:-100px auto 0;
-		align-items: flex-start;
-		justify-content: flex-start;
-		flex-direction: column;
-		.rule-title{
-			width: 100%;
-			text-align: center;
-			font-size: 32px;
-			color: #333;
-			margin-bottom: 40px;
-		}
-		.detail{
-			color:#999;
-			margin-top:30px;
-			font-size: 26px;
-		}
-	}
-	.close-icon{
-		width: 60px;
-		height: 60px;
-		margin-top:40px;
-	}
+.mask {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: rgba(0, 0, 0, 0.56);
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  z-index: 2;
+  .rule {
+    width: 600px;
+    height: 384px;
+    padding: 34px 30px;
+    border-radius: 12px;
+    background-color: #fff;
+    margin: -100px auto 0;
+    align-items: flex-start;
+    justify-content: flex-start;
+    flex-direction: column;
+    .rule-title {
+      width: 100%;
+      text-align: center;
+      font-size: 32px;
+      color: #333;
+      margin-bottom: 40px;
+    }
+    .detail {
+      color: #999;
+      margin-top: 30px;
+      font-size: 26px;
+    }
+  }
+  .close-icon {
+    width: 60px;
+    height: 60px;
+    margin-top: 40px;
+  }
 }
-.sign{
-	&-banner {
+.sign {
+  &-banner {
     background-image: url(../../assets/imgs/sign_bg.jpg);
     background-size: cover;
     background-repeat: no-repeat;
@@ -267,3 +272,13 @@
     }
   }
 }
+.line__item_wrap {
+  color: #fbb11b;
+  flex-direction: column;
+  border-radius: 8px;
+  align-items: center;
+}
+.task-section__list_new {
+  font-weight: 600;
+  font-size: 32px;
+}

src/views/Shelf/index.ux

@@ -71,38 +71,45 @@
                 <text>删除</text>
               </div>
             </stack>
-          </list-item> -->
-        <div class="shelf-books__wrap">
-          <block for="mockList">
-            <div class="book-item__wrap {{(($idx + 1)%3 === 0) ? 'm0' : ''}}">
-              <stack>
-                <x-book book="{{$item}}" read="{{true}}" isshowtext="{{false}}">
-                  <div class="item_wrap">
-                    <text class="name">{{ $item.book_name }}</text>
-                    <text class="last-read">读到 {{ $item.chapter_name }}</text>
+          </list-item> --><list-item type="recent-item" class="recent-item">
+          <div class="shelf-books__wrap">
+            <block for="mockList">
+              <div class="book-item__wrap {{(($idx + 1)%3 === 0) ? 'm0' : ''}}">
+                <stack>
+                  <x-book
+                    book="{{$item}}"
+                    read="{{true}}"
+                    isshowtext="{{false}}"
+                  >
+                    <div class="item_wrap">
+                      <text class="name">{{ $item.book_name }}</text>
+                      <text class="last-read"
+                        >读到 {{ $item.chapter_name }}</text
+                      >
+                    </div>
+                  </x-book>
+                  <div
+                    class="book-del__wrap"
+                    show="{{isDelMode}}"
+                    @click="deleteBook($item)"
+                  >
+                    <image
+                      src="../../assets/imgs/delete_recent.png"
+                    ></image>
+                    <text>删除</text>
                   </div>
-                </x-book>
-                <div
-                  class="book-del__wrap"
-                  show="{{isDelMode}}"
-                  @click="deleteBook($item)"
-                >
-                  <image
-                    src="https://yueduyun.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/img/delete.png"
-                  ></image>
-                  <text>删除</text>
-                </div>
-              </stack>
+                </stack>
+              </div>
+            </block>
+            <div class="book-item__wrap book-item__add m0" @click="toCategory">
+              <image
+                class="add-cover"
+                src="https://yueduyun.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/img/bookstory.png"
+              ></image>
+              <text>添加书籍</text>
             </div>
-          </block>
-          <div class="book-item__wrap book-item__add m0" @click="toCategory">
-            <image
-              class="add-cover"
-              src="https://yueduyun.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/img/bookstory.png"
-            ></image>
-            <text>添加书籍</text>
           </div>
-        </div>
+        </list-item>
       </list>
     </block>
   </div>

src/views/Task/index.ux

@@ -19,19 +19,22 @@
 			<text class="sign-desc">连续签到可持续获得高额奖励</text>
 			<div class="sign-line">
 				<div class="sign-line__item" for="{{signList}}">
+					<div class="line__item_wrap">
+							<text class="sign-line__fee">+{{$item.fee}}</text>
+							<image src="../../assets/imgs/sign_{{$item.iconType}}.jpg"></image>
+					</div>
+				
 					<text class="sign-line__day">{{$item.day}}天</text>
-					<image src="../../assets/imgs/sign_{{$item.iconType}}.jpg"></image>
-					<text class="sign-line__fee">{{$item.fee}}书币</text>
 				</div>
 			</div>
 			<text class="sign-button" @click="signToday" if="{{!signData.is_sign}}">
-				签到
+				立即签到
 			</text>
 			<text class="sign-button-disabled" if="{{signData.is_sign}}">
 				已签到
 			</text>
 		</div>
-		<div class="reader-leaver">
+		<!-- <div class="reader-leaver">
 			<div class="l-top"><text class="l-title">最近阅读</text><text class="l-more" @click="goMore">查看更多记录></text></div>
 			<div class="recent-list">
 				<block for="book in mockList">
@@ -41,19 +44,38 @@
 
 				</block>
 			</div>
-		</div>
+		</div> -->
 		<div class="task-section">
-			<div class="task-section__tab">
+			<!-- <div class="task-section__tab">
 				<text class="{{type=='new'?'on':''}}" @click="changeTab('new')">新手任务</text>
 				<text class="{{type=='day'?'on':''}}" @click="changeTab('day')">日常福利</text>
 			</div>
 			<div class="banner">
 				<image src="https://cdn-novel.iycdm.com/quickapp/task/day_task.png" show="{{type=='day'}}"></image>
 				<image src="https://cdn-novel.iycdm.com/quickapp/task/new_task.png" show="{{type=='new'}}"></image>
+			</div> -->
+		
+			<div class="task-section__list">
+				<text class="task-section__list_new" >新手必做任务</text>
+				<div class="list-item" for="{{newList}}" @click="compeletTask($item.status,$item.type,$item.id,$item.path)">
+					<image src="{{$item.icon}}" class="icon" />
+					</image>
+					<div class="content">
+						<div><text>{{$item.name}}</text>
+							<div class="task-award">
+								<image src="{{$item.icon}}"></image><text>{{$item.value}}<text>
+							</div>
+						</div>
+						<text class="content-desc">{{$item.desc}}</text>
+					</div>
+					<text class="button-status {{ $item.status==0 ? 'wait': ($item.status==1 ? 'get' : 'disabled') }}">
+						{{$item.status==0?'去完成':$item.status==1?'领取':'已领取'}}
+					</text>
+				</div>
 			</div>
-
 			<div class="task-section__list">
-				<div class="list-item" for="{{currentList}}" @click="compeletTask($item.status,$item.type,$item.id,$item.path)">
+				<text class="task-section__list_new" >日常福利</text>
+				<div class="list-item" for="{{dayList}}" @click="compeletTask($item.status,$item.type,$item.id,$item.path)">
 					<image src="{{$item.icon}}" class="icon" />
 					</image>
 					<div class="content">
@@ -95,7 +117,7 @@ import prompt from '@system.prompt';
 export default {
 	public: {
 		push_id: '',
-		send_order_id:''
+		send_order_id: ''
 	},
 	protected: {
 		signList: [
@@ -131,17 +153,17 @@ export default {
 	onShow() {
 		this.getTaskList();
 	},
-	async getRordList() {
-		getReadrecord().then(r => {
-			r.map(m => {
-				m.cover_url = m.cover
-				m.recent_cid = m.cid
-				delete m.cover
-				delete m.cid
-			})
-			r.length > 3 ? this.mockList = r.slice(0, 3) : this.mockList = r;
-		})
-	},
+	// async getRordList() {
+	// 	getReadrecord().then(r => {
+	// 		r.map(m => {
+	// 			m.cover_url = m.cover
+	// 			m.recent_cid = m.cid
+	// 			delete m.cover
+	// 			delete m.cid
+	// 		})
+	// 		r.length > 3 ? this.mockList = r.slice(0, 3) : this.mockList = r;
+	// 	})
+	// },
 	async getBook() {
 		let bookList = await taskBook();
 		this.bannerList = bookList;
@@ -166,9 +188,9 @@ export default {
 		this.dayList = dayList;
 		this.newList = newList;
 	},
-	changeTab(type) {
-		this.type = type;
-	},
+	// changeTab(type) {
+	// 	this.type = type;
+	// },
 	closeRule() {
 		this.showRule = false;
 	},