main update

主界面改进，还差card图片调整和tag的编写
下面的导航栏图片还没替换

miniprogram/app.json

@@ -1,64 +1,64 @@
-{
-  "pages": [
-    "pages/main/main",
-    "pages/setting/setting",
-    "pages/activity/activity",
-    "pages/myFollow/myFollow",
-    "pages/publisher/publisher",
-    "pages/publisherPage/publisherPage",
-    "pages/publisherLogin/publisherLogin",
-    "pages/activityPublish/activityPublish",
-    "pages/user/user",
-    "pages/message/message",
-    "pages/search/search",
-    "pages/myQuestion/myQuestion",
-    "pages/receivedQuestion/receivedQuestion",
-    "pages/publisherInfoChange/publisherInfoChange",
-    "pages/aboutUs/aboutUs",
-    "pages/opinion/opinion",
-    "pages/myPublish/myPublish",
-    "pages/administratorSetting/administratorSetting",
-    "pages/myColor/myColor",
-    "pages/myFavor/myFavor"
-  ],
-  "window": {
-    "backgroundTextStyle": "light",
-    "navigationBarBackgroundColor": "#303f9f",
-    "navigationBarTitleText": "汇听",
-    "navigationBarTextStyle": "white"
-  },
-  "style": "v2",
-  "sitemapLocation": "sitemap.json",
-  "tabBar": {
-    "selectedColor": "#303f9f",
-    "backgroundColor": "#F5F5F5",
-    "color": "#707070",
-    "borderStyle": "white",
-    "list": [
-      {
-        "pagePath": "pages/main/main",
-        "text": "首页",
-        "iconPath": "images/tabbar/1.1.png",
-        "selectedIconPath": "images/tabbar/1.2.png"
-      },
-      {
-        "pagePath": "pages/search/search",
-        "text": "搜索",
-        "iconPath": "images/tabbar/2.1.png",
-        "selectedIconPath": "images/tabbar/2.2.png"
-      },
-      {
-        "pagePath": "pages/message/message",
-        "text": "消息",
-        "iconPath": "images/tabbar/3.1.png",
-        "selectedIconPath": "images/tabbar/3.2.png"
-      },
-      {
-        "pagePath": "pages/user/user",
-        "text": "我的",
-        "iconPath": "images/tabbar/4.1.png",
-        "selectedIconPath": "images/tabbar/4.2.png"
-      }
-    ]
-  }
+{
+  "pages": [
+    "pages/main/main",
+    "pages/setting/setting",
+    "pages/activity/activity",
+    "pages/myFollow/myFollow",
+    "pages/publisher/publisher",
+    "pages/publisherPage/publisherPage",
+    "pages/publisherLogin/publisherLogin",
+    "pages/activityPublish/activityPublish",
+    "pages/user/user",
+    "pages/message/message",
+    "pages/search/search",
+    "pages/myQuestion/myQuestion",
+    "pages/receivedQuestion/receivedQuestion",
+    "pages/publisherInfoChange/publisherInfoChange",
+    "pages/aboutUs/aboutUs",
+    "pages/opinion/opinion",
+    "pages/myPublish/myPublish",
+    "pages/administratorSetting/administratorSetting",
+    "pages/myColor/myColor",
+    "pages/myFavor/myFavor"
+  ],
+  "window": {
+    "backgroundTextStyle": "light",
+    "navigationBarBackgroundColor": "#469298",
+    "navigationBarTitleText": "汇听",
+    "navigationBarTextStyle": "white"
+  },
+  "style": "v2",
+  "sitemapLocation": "sitemap.json",
+  "tabBar": {
+    "selectedColor": "#469298",
+    "backgroundColor": "#ffffff",
+    "color": "#9E9E9E",
+    "borderStyle": "white",
+    "list": [
+      {
+        "pagePath": "pages/main/main",
+        "text": "首页",
+        "iconPath": "images/tabbar/1.1.png",
+        "selectedIconPath": "images/tabbar/1.2.png"
+      },
+      {
+        "pagePath": "pages/search/search",
+        "text": "搜索",
+        "iconPath": "images/tabbar/2.1.png",
+        "selectedIconPath": "images/tabbar/2.2.png"
+      },
+      {
+        "pagePath": "pages/message/message",
+        "text": "消息",
+        "iconPath": "images/tabbar/3.1.png",
+        "selectedIconPath": "images/tabbar/3.2.png"
+      },
+      {
+        "pagePath": "pages/user/user",
+        "text": "我的",
+        "iconPath": "images/tabbar/4.1.png",
+        "selectedIconPath": "images/tabbar/4.2.png"
+      }
+    ]
+  }
 }

miniprogram/app.wxss

@@ -1,23 +1,30 @@
-/**app.wxss**/
-.container {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-between;
-  padding: 200rpx 0;
-  box-sizing: border-box;
-} 
-
-.dark-primary-color    { background: #303F9F; }
-.default-primary-color { background: #3F51B5; }
-.dark-primary-color-font { color: #303F9F; }
-.default-primary-color-font { color: #3F51B5; }
-.light-primary-color   { background: #C5CAE9; }
-.text-primary-color    { color: #FFFFFF; }
-.accent-color          { background: #FF4081; }
-.primary-text-color    { color: #212121; }
-.secondary-text-color  { color: #DADADA; }
-.divider-color         { background: #BDBDBD; }
-.block-background-color{ background:#F0F0F0;}
-
+/**app.wxss**/
+.container {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  padding: 200rpx 0;
+  box-sizing: border-box;
+} 
+
+.dark-primary-color    { background: #303F9F; }
+.default-primary-color { background: #3F51B5; }
+.dark-primary-color-font { color: #303F9F; }
+.default-primary-color-font { color: #3F51B5; }
+.light-primary-color   { background: #C5CAE9; }
+.text-primary-color    { color: #FFFFFF; }
+.accent-color          { background: #FF4081; }
+.primary-text-color    { color: #212121; }
+
+.divider-color         { background: #BDBDBD; }
+.block-background-color{ background:#F0F0F0;}
+.primary-color-fg { color: #469298; }
+.primary-color-bg { background: #469298; }
+.secondary-text-color  { color: #707070; }
+
+page {
+  background: #ededed;
+}
+

miniprogram/components/itemCard/itemCard.wxml

@@ -1,16 +1,25 @@
 <!-- 为首页消息通知的组件，数据在mainData.js -->
 <view class="card" bindtap="getActivityInfo">
   <view class="profile">
-    <view style="display: flex;" catchtap="getPublisherInfo">
+    <view class="avatar-name" catchtap="getPublisherInfo">
       <image class="publisher-avatar" src="{{item.publisherAvatar}}" mode="aspectFill"></image>
-      <view class="publisher-name dark-primary-color-font">{{item.publisherName}}</view>
-      <view class="time">{{item.time}}</view>
+      <view class="publisher-name">{{item.publisherName}}</view>
     </view>
-    <view class="activity-attribute accent-color text-primary-color" catchtap="filterMsgType">{{item.attribute[0]}}</view>
+    <view class="activity-attribute primary-color-bg text-primary-color" catchtap="filterMsgType">{{item.attribute[0]}}</view>
+  </view>
+  <view class="title-time">
+    <view class="title">{{item.title}}</view>
+    <view class="time primary-color-fg">{{item.time}}</view>
   </view>
-  <view class="title">{{item.title}}</view>
   <view class="sub-title">{{item.subTitle}}</view>
   <imagePicker wx:if="{{item.poster != ''}}" images="{{[item.poster]}}" max="1" image-width="700" image-height="365" readonly />
   <imagePicker wx:if="{{item.poster == '' && item.photo.length != 0}}" images="{{item.photo}}" max="1" image-width="{{item.photo.length == 1 ? 700 : item.photo.length <= 4 ? 330 : 220}}" image-height="{{item.photo.length == 1 ? 700 : item.photo.length <= 4 ? 330 : 220}}" readonly />
-  <view class="line divider-color"></view>
+  <view class="bottom-line">
+  <view class="tags primary-color-fg"></view>
+  <view class="to-detail">
+    <text class="primary-color-fg" style="font-size:20rpx;">查看详情</text>
+    <image class="arrow" src="/images/hollow_arrow.png" mode="aspectFill"></image>
+  </view>
+</view>
 </view>
+

miniprogram/components/itemCard/itemCard.wxss

@@ -2,7 +2,15 @@
   display: flex;
   flex-direction: column;
   width: 700rpx;
-  margin-top: 20rpx;
+  margin-top: 60rpx;
+  background-color: #ffffff;
+  border-radius: 28rpx;
+  box-shadow: 5rpx 5rpx 8rpx 0rpx rgba(0,0,0,0.16);
+}
+
+.avatar-name{
+  display: flex;
+  flex-direction: row;
 }
 
 .publisher-avatar{
@@ -10,53 +18,84 @@
   height: 50rpx;
   border-radius: 30rpx;
   margin-left: 10rpx;
-  margin-right: 10rpx;
+  z-index: 2;
+  border-color: #9E9E9E;
+  border-style: solid;
+  border-width: 2rpx;
+  background-color: #ffffff;
 }
 
 .profile{
   display: flex;
   flex-direction: row;
   justify-content: space-between;
-  padding-right: 30rpx;
+  position: relative;
+  top: -20rpx;
+  margin-right: 10rpx;
 }
 
 .publisher-name{
-  font-size: 30rpx;
+  font-size: 24rpx;
   align-self: center;
-  margin-right: 10rpx;
-  font-weight: 800;
+  background-color: #ffffff;
+  padding:5rpx 20rpx 5rpx 30rpx;
+  margin-left: -20rpx;
+  border-radius: 22rpx;
+  box-shadow: 5rpx 5rpx 8rpx 0rpx rgba(0,0,0,0.16);
+  z-index: 1;
 }
 
 .time{
-  font-size: 20rpx;
-  align-self: center;
+  font-size: 16rpx;
 }
 
 .activity-attribute{
-  font-size: 20rpx;
+  font-size: 24rpx;
   align-self: center;
   padding-top: 5rpx;
   padding-bottom: 5rpx;
   padding-right: 20rpx;
   padding-left: 20rpx;
+  border-radius: 28rpx;
+  box-shadow: 5rpx 5rpx 8rpx 0rpx rgba(0,0,0,0.16);
 }
 
 .title{
-  font-size: 30rpx;
-  margin-left: 68rpx;
-  margin-bottom: 10rpx;
-  font-weight: 800;
+  font-size: 28rpx;
+}
+
+.title-time{
+  margin-left: 50rpx;
+  margin-right: 30rpx;
+  margin-bottom: 20rpx;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: flex-end;
 }
 
 .sub-title{
-  font-size: 30rpx;
-  margin-left: 68rpx;
+  font-size: 24rpx;
+  margin-left: 50rpx;
   margin-bottom: 20rpx;
   margin-right: 20rpx;
 }
 
-.line{
-  width: 700rpx;
-  height: 1rpx;
-  margin-top: 20rpx;
-}
+.bottom-line{
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  margin: 10rpx 10rpx 30rpx 10rpx;
+}
+
+.to-detail{
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.arrow{
+  height: 20rpx;
+  width: 20rpx;
+  margin: 0rpx 20rpx 0rpx 20rpx;
+}

miniprogram/pages/main/main.wxml

@@ -1,46 +1,46 @@
-<!-- 为首页，含component：itemCard；data:mainData.js -->
-<!-- 更新了filter中的活动内容，但是由于有二级标题、还未给出页面美化需求，因此仅在js文件中更新，wxml未更新完全-->
-<view class="page primary-text-color">
-  <view class="filter default-primary-color">
-    <view class="filter-item {{filterList == 1 || filterItem[1] != 0 ? 'text-primary-color' : ' secondary-text-color'}}" data-filter-list="1" bindtap="toggleFilterList">
-      <text>{{filterItem[1] == "" ? filterName[1].type : filterItem[1]}}</text>
-      <image class="filter-arrow" id="arrow1" mode="aspectFit" src="/images/arrow.png"></image>
-    </view>
-    <view class="filter-line dark-primary-color"></view>
-    <view class="filter-item {{filterList == 2 || filterItem[2] != 0 ? 'text-primary-color' : ' secondary-text-color'}}" data-filter-list="2" bindtap="toggleFilterList">
-      <text>{{filterItem[2] == "" ? filterName[2].type : filterItem[2]}}</text>
-      <image class="filter-arrow" id="arrow2" mode="aspectFit" src="/images/arrow.png"></image>
-    </view>
-    <view class="filter-line dark-primary-color"></view>
-    <view class="filter-item {{filterList == 3 || filterItem[3] != 0 ? 'text-primary-color' : ' secondary-text-color'}}" data-filter-list="3" bindtap="toggleFilterList">
-      <text>{{filterItem[3] == "" ? filterName[3].type : filterItem[3]}}</text>
-      <image class="filter-arrow" id="arrow3" mode="aspectFit" src="/images/arrow.png"></image>
-    </view>
-  </view>
-  <view class="filter-lists">
-    <view wx:if="{{filterList == 1}}" class="filter-list1" id="list1">
-      <view wx:for="{{filterName[1].list}}" wx:for-item="item" wx:key="type">
-        <view class="filter-list-title default-primary-color-font">{{item.sub}}</view>
-        <view class="filter-list-subtitle default-primary-color-font">{{item.item[0].secondSub}}</view>
-        <view class="filter-list-item" wx:for="{{item.item[0].subitem}}" wx:for-item="name" wx:key="*this" data-filter-list="1" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[1] == name}}">✔</view></view>
-        <view class="filter-list-subtitle default-primary-color-font">{{item.item[1].secondSub}}</view>
-        <view class="filter-list-item" wx:for="{{item.item[1].subitem}}" wx:for-item="name" wx:key="*this" data-filter-list="1" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[1] == name}}">✔</view></view>
-        <view class="filter-list-subtitle default-primary-color-font">{{item.item[2].secondSub}}</view>
-        <view class="filter-list-item" wx:for="{{item.item[2].subitem}}" wx:for-item="name" wx:key="*this" data-filter-list="1" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[1] == name}}">✔</view></view>
-      </view>
-    </view>
-    <view class="filter-list"></view>
-    <view wx:if="{{filterList == 2}}" class="filter-list" id="list2">
-      <view class="filter-list-item" wx:for="{{filterName[2].item}}" wx:for-item="name" wx:key="*this" data-filter-list="2" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[2] == name}}">✔</view></view>
-    </view>
-    <view class="filter-list"></view>
-    <view wx:if="{{filterList == 3}}" class="filter-list" id="list3">
-      <view class="filter-list-item" wx:for="{{filterName[3].item}}" wx:for-item="name" wx:key="*this" data-filter-list="3" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[3] == name}}">✔</view></view>
-    </view>
-  </view>
-  <view style="margin-top: 75rpx;">
-    <view wx:for="{{mainDatas}}" wx:for-item="item" wx:for-index="index" wx:key="_id">
-      <itemCard wx:if="{{(filterItem[1] == '' || filterItem[1] == item.attribute[0]) && (filterItem[2] == '' || filterItem[2] == item.publisherAttribute[0]) && (filterItem[3] == '' || filterItem[3] == item.supply[0])}}" item="{{item}}" bindfiltermsgtype="filterMsgType"/>
-    </view>
-  </view>
-</view>
+<!-- 为首页，含component：itemCard；data:mainData.js -->
+<!-- 更新了filter中的活动内容，但是由于有二级标题、还未给出页面美化需求，因此仅在js文件中更新，wxml未更新完全-->
+<view class="page">
+  <view class="filter">
+    <view class="filter-item secondary-text-color" data-filter-list="1" bindtap="toggleFilterList">
+      <text>{{filterItem[1] == "" ? filterName[1].type : filterItem[1]}}</text>
+      <image class="filter-arrow" id="arrow1" mode="aspectFit" src="/images/arrow.png"></image>
+    </view>
+    <view class="filter-line"></view>
+    <view class="filter-item secondary-text-color" data-filter-list="2" bindtap="toggleFilterList">
+      <text>{{filterItem[2] == "" ? filterName[2].type : filterItem[2]}}</text>
+      <image class="filter-arrow" id="arrow2" mode="aspectFit" src="/images/arrow.png"></image>
+    </view>
+    <view class="filter-line"></view>
+    <view class="filter-item secondary-text-color" data-filter-list="3" bindtap="toggleFilterList">
+      <text>{{filterItem[3] == "" ? filterName[3].type : filterItem[3]}}</text>
+      <image class="filter-arrow" id="arrow3" mode="aspectFit" src="/images/arrow.png"></image>
+    </view>
+  </view>
+  <view class="filter-lists">
+    <view wx:if="{{filterList == 1}}" class="filter-list1" id="list1">
+      <view wx:for="{{filterName[1].list}}" wx:for-item="item" wx:key="type">
+        <view class="filter-list-title default-primary-color-font">{{item.sub}}</view>
+        <view class="filter-list-subtitle default-primary-color-font">{{item.item[0].secondSub}}</view>
+        <view class="filter-list-item" wx:for="{{item.item[0].subitem}}" wx:for-item="name" wx:key="*this" data-filter-list="1" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[1] == name}}">✔</view></view>
+        <view class="filter-list-subtitle default-primary-color-font">{{item.item[1].secondSub}}</view>
+        <view class="filter-list-item" wx:for="{{item.item[1].subitem}}" wx:for-item="name" wx:key="*this" data-filter-list="1" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[1] == name}}">✔</view></view>
+        <view class="filter-list-subtitle default-primary-color-font">{{item.item[2].secondSub}}</view>
+        <view class="filter-list-item" wx:for="{{item.item[2].subitem}}" wx:for-item="name" wx:key="*this" data-filter-list="1" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[1] == name}}">✔</view></view>
+      </view>
+    </view>
+    <view class="filter-list"></view>
+    <view wx:if="{{filterList == 2}}" class="filter-list" id="list2">
+      <view class="filter-list-item" wx:for="{{filterName[2].item}}" wx:for-item="name" wx:key="*this" data-filter-list="2" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[2] == name}}">✔</view></view>
+    </view>
+    <view class="filter-list"></view>
+    <view wx:if="{{filterList == 3}}" class="filter-list" id="list3">
+      <view class="filter-list-item" wx:for="{{filterName[3].item}}" wx:for-item="name" wx:key="*this" data-filter-list="3" data-filter-item="{{name}}" bindtap="toggleFilterItem">{{name}}<view wx:if="{{filterItem[3] == name}}">✔</view></view>
+    </view>
+  </view>
+  <view style="margin-top: 60rpx;">
+    <view wx:for="{{mainDatas}}" wx:for-item="item" wx:for-index="index" wx:key="_id">
+      <itemCard wx:if="{{(filterItem[1] == '' || filterItem[1] == item.attribute[0]) && (filterItem[2] == '' || filterItem[2] == item.publisherAttribute[0]) && (filterItem[3] == '' || filterItem[3] == item.supply[0])}}" item="{{item}}" bindfiltermsgtype="filterMsgType"/>
+    </view>
+  </view>
+</view>

miniprogram/pages/main/main.wxss

@@ -11,9 +11,11 @@
   display: flex;
   justify-content: space-around;
   align-items: center;
-  height: 75rpx;
+  height: 60rpx;
   width: 100%;
   z-index: 100;
+  background-color: #ffffff;
+  box-shadow: 0rpx 0rpx 15rpx 0rpx rgba(0,0,0,0.16);
 }
 
 .filter-item {
@@ -22,7 +24,7 @@
   align-items: center;
   height: 100%;
   width: 33%;
-  font-size: 30rpx;
+  font-size: 24rpx;
 }
 
 .filter-arrow {
@@ -32,8 +34,10 @@
 }
 
 .filter-line {
-  height: 60%;
+  height: 100%;
   width: 4rpx;
+  background-color: rgba(0,0,0,0.05);
+  box-shadow: 0rpx 0rpx 15rpx 0rpx rgba(0,0,0,0.16);
 }
 
 .filter-lists {