update 议事厅

pages/topics/common/goodIdea/cell/index.js

@@ -0,0 +1,34 @@
+// pages/topics/common/goodIdea/cell/index.js
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    ideaId: String,
+    articleImg: String,
+    userIcon: String,
+    userName: String,
+    time: String,
+    isGoodIdea:Number,
+    detail:{
+      type: Object
+    }
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    onTap() {
+      console.log(this.properties)
+      // this.triggerEvent('clickListItem', { articleId: this.properties.articleId })
+    }
+  }
+})

pages/topics/common/goodIdea/cell/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

pages/topics/common/goodIdea/cell/index.wxml

@@ -0,0 +1,37 @@
+<!--pages/topics/common/goodIdea/cell/index.wxml-->
+<view class="cell" id="cell" bindtap="onTap">
+  <view class="content-left">
+    <image src=""></image>
+  </view>
+  <view class="content-right">
+    <view class="userInfo">
+      <view class="userName">{{userName}}</view>
+      <view class="comment-time">刚刚</view>
+      <view class="goodIdeaIcon" wx:if="{{isGoodIdea === 1}}">
+        <image style="width:100%;height:100%;" src="./images/goodIdea.png"></image>
+      </view>
+    </view>
+    <view style="color:#3B3B3B;font-size:14px;padding: 0 0 5px 0;">评论内容</view>
+    <view class="detail">
+      <view class="detail-title">{{detail.title}}</view>
+      <view class="detail-userInfo">
+    
+      <view class="detail-userInfo-left">
+        <view class="detail-user-icon">
+          <image src="{{userIcon}}"></image>
+        </view>
+        <view class="detail-userName">{{detail.userName}}</view>
+        <view class="detail-time">{{detail.time}}</view>
+      </view>
+
+      <view class="detail-userInfo-right">
+        <view class="detail-comments-icon">
+          <image src=""></image>
+        </view>
+        <view class="detail-commentNum">{{detail.commentNum}}</view>
+      </view>
+      <view class="detail-text">{{detail.text}}</view>
+    </view>
+    </view>
+  </view>
+</view>

pages/topics/common/goodIdea/cell/index.wxss

@@ -0,0 +1,96 @@
+/* pages/topics/common/goodIdea/cell/index.wxss */
+.cell{
+  display: flex;
+  flex-direction: row;
+  padding: 10px;
+}
+.content-left{
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background-color: red;
+}
+.content-right{
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 0 10px 0 10px;
+}
+.userInfo{
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 0 0 5px 0;
+}
+.userName{
+  color: #66708B;
+  font-size: 14px;
+}
+.goodIdeaIcon{
+  width: 30px;
+  height: 15px;
+  line-height: 10px;
+}
+.comment-time{
+  margin: 0 5px 0 5px;
+  font-size: 12px;
+  line-height: 12px;
+  color: #D4D4D4;
+}
+.detail{
+  height: 200px;
+  border-radius: 10px;
+  background-color: #F8F8F8;
+}
+.detail-title{
+  padding: 10px;
+}
+
+.detail-userInfo{
+  display: flex;
+  flex: row;
+  justify-content: space-between;
+  padding: 10px;
+}
+.detail-userInfo-left{
+  display: flex;
+  flex: row;
+  align-items: center;
+}
+.detail-user-icon{
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background-color: red;
+}
+.detail-userName{
+  margin: 0 5px 0 5px;
+  font-size: 12px;
+  color: #3B3B3B;
+}
+.detail-time {
+  font-size: 12px;
+  line-height: 12px;
+  color: #D4D4D4;
+}
+.detail-userInfo-right{
+  display: flex;
+  flex: row;
+  align-items: center;
+  margin-right: 10px;
+}
+.detail-comments-icon{
+  width: 20px;
+  height: 15px;
+  margin-right: 5px;
+  border-radius: 5px;
+  background-color: red;
+}
+.detail-commentNum{
+  font-size: 12px;
+  color: #3B3B3B;
+}
+.detail-text{
+  color: #373737;
+
+}

pages/topics/common/goodIdea/index.js

@@ -5,7 +5,38 @@ Page({
    * 页面的初始数据
    */
   data: {
-
+    list: [
+      {
+        ideaId: '1',
+        userIcon: "",
+        userName: "用户名",
+        time: "刚刚",
+        isGoodIdea:1,
+        detail:{
+          title:"习近平主持政治局第十七次集体... 拷贝",
+          userIcon:"",
+          userName:"用户名",
+          time:"刚刚",
+          commentNum:"33",
+          text:"【内容以实际活动为准】市北区位于青岛市主城区地理位置的中心，西部濒临胶州湾，东部与崂山区为邻，北部与李沧区接壤，南部与市南区毗"
+        }
+      },
+      {
+        ideaId: "2",
+        userIcon: "",
+        userName: "用户名",
+        time: "1分钟前",
+        isGoodIdea: 0,
+        detail: {
+          title: "习近平主持政治局第十七次集体... 拷贝",
+          userIcon: "",
+          userName: "用户名",
+          time: "刚刚",
+          commentNum: "33",
+          text: "市北区位于青岛市主城区地理位置的中心，西部濒临胶州湾，东部与崂山区为邻，北部与李沧区接壤，南部与市南区毗连，东西最大距离11. 拷贝 2"
+        }
+      }
+    ]
   },
 
   /**
@@ -62,5 +93,8 @@ Page({
    */
   onShareAppMessage: function () {
 
+  },
+  clickListItem(e) {
+    console.log(e.detail)
   }
 })

pages/topics/common/goodIdea/index.json

@@ -1,3 +1,5 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "cell": "./cell/index"
+  }
 }

pages/topics/common/goodIdea/index.wxml

@@ -1,2 +1,13 @@
 <!--pages/topics/common/goodIdea/index.wxml-->
-<text>pages/topics/common/goodIdea/index.wxml</text>
+<view class="container">
+  <block wx:for="{{list}}" wx:key="*this">
+    <cell 
+      ideaId="{{item.ideaId}}"
+      userName="{{item.userName}}"
+      time="{{item.time}}"
+      userIcon="{{item.userIcon}}"
+      isGoodIdea="{{item.isGoodIdea}}" 
+      deital="{{item.detail}}"
+      bind:clickListItem="clickListItem"/>
+  </block>
+</view>

pages/topics/common/interactive/cell/index.js

@@ -0,0 +1,36 @@
+// pages/topics/common/interactive/common/imageCell/index.js
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    articleId: String,
+    title: String,
+    articleImg:String,
+    userIcon:String,
+    userName:String,
+    time: String,
+    commentNum: String,
+    showTop: {
+      type: Boolean,
+      value: false,
+    }
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    onTap() {
+      console.log(this.properties)
+      this.triggerEvent('clickListItem', { articleId: this.properties.articleId })
+    }
+  }
+})

pages/topics/common/interactive/cell/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

pages/topics/common/interactive/cell/index.wxml

@@ -0,0 +1,29 @@
+<!--pages/topics/common/interactive/common/imageCell/index.wxml-->
+<view class="cell" id="cell" bindtap="onTap">
+  <view class="left {{articleImg === '' ? 'leftActive' : ''}}">
+    <view class="left-top">
+      <view class="cell_title">{{title}}</view>
+    </view>
+    <view class="left-bottom">
+    
+      <view class="left-bottom-userInfo">
+        <view class="user-icon">
+          <image src="{{userIcon}}"></image>
+        </view>
+        <view class="userName">{{userName}}</view>
+        <view class="cell_info_meta">{{time}}</view>
+      </view>
+
+      <view class="left-bottom-comments">
+        <view class="comments-icon">
+          <image src=""></image>
+        </view>
+        <view class="commentNum">{{commentNum}}</view>
+      </view>
+
+    </view>
+  </view>
+  <view class="right" wx:if="{{articleImg.length > 0}}">
+    <image src="./images/articleImg.png"></image>
+  </view>
+</view>

pages/topics/common/interactive/cell/index.wxss

@@ -0,0 +1,88 @@
+/* pages/topics/common/interactive/common/imageCell/index.wxss */
+.cell {
+  border-bottom: 1px solid #E7E7E7;
+  display: flex;
+  flex-direction: row;
+  padding: 10px 20px;
+  align-items: center;
+}
+.left{
+  display: flex;
+  flex-direction: column;
+  width: 70%;
+}
+.leftActive{
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+.left-bottom{
+  display: flex;
+  flex: row;
+  justify-content: space-between;
+}
+.left-bottom-userInfo{
+  display: flex;
+  flex: row;
+  align-items: center;
+}
+.user-icon{
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background-color: red;
+}
+.userName{
+  margin: 0 5px 0 5px;
+  font-size: 12px;
+  color: #3B3B3B;
+}
+.left-bottom-comments{
+  display: flex;
+  flex: row;
+  align-items: center;
+  margin-right: 10px;
+}
+.comments-icon{
+  width: 20px;
+  height: 15px;
+  margin-right: 5px;
+  border-radius: 5px;
+  background-color: red;
+}
+.commentNum{
+  font-size: 12px;
+  color: #3B3B3B;
+}
+.right{
+  width: 30%;
+  height: 70px;
+  border-radius: 5px;
+}
+image{
+  width: 100%; 
+  height: 100%;
+  border-radius: 5px;
+}
+.cell_title {
+  font-weight: 300;
+  font-size: 17px;
+  color: #000;
+}
+.cell_title_selected {
+  color: #9C9C9C;
+}
+.cell_info_meta {
+  padding-top: 10rpx;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  font-size: 12px;
+  line-height: 12px;
+  color: #D4D4D4;
+}
+.cell_info_top {
+  padding: 0 10px;
+  width: 20px;
+  height: 12px;
+}

pages/topics/common/interactive/index.js

@@ -5,7 +5,35 @@ Page({
    * 页面的初始数据
    */
   data: {
-
+    list:[
+      { 
+        articleId: '1',
+        title:"市北区举行国际航运贸易金融创新中心核心区产业建设",
+        articleImg:"asdsad",
+        userIcon:"",
+        userName:"用户名",
+        time:"刚刚",
+        commentNum:"33",
+      },
+      {
+        articleId: "2",
+        title: "《大众日报》市北区举行国际航运贸易金融创新中心核心区产业建设",
+        articleImg: "",
+        userIcon: "",
+        userName: "用户名",
+        time: "1分钟前",
+        commentNum: "33",
+      },
+      {
+        articleId: "3",
+        title: "青岛医疗人工智能科技创新中心落户市北",
+        articleImg: "asdsadad",
+        userIcon: "",
+        userName: "用户名",
+        time: "1分钟前",
+        commentNum: "33",
+      }
+    ]
   },
 
   /**
@@ -47,7 +75,7 @@ Page({
    * 页面相关事件处理函数--监听用户下拉动作
    */
   onPullDownRefresh: function () {
-
+    wx.showNavigationBarLoading();
   },
 
   /**
@@ -62,5 +90,9 @@ Page({
    */
   onShareAppMessage: function () {
 
+  },
+
+  clickListItem(e){
+    console.log(e.detail)
   }
 })

pages/topics/common/interactive/index.json

@@ -1,3 +1,7 @@
 {
-  "usingComponents": {}
+  "enablePullDownRefresh": true,
+  "backgroundTextStyle": "dark",
+  "usingComponents": {
+    "cell":"./cell/index"
+  }
 }

pages/topics/common/interactive/index.wxml

@@ -1,2 +1,14 @@
 <!--pages/topics/common/interactive/index.wxml-->
-<text>pages/topics/common/interactive/index.wxml</text>
+<view class="container">
+  <block wx:for="{{list}}" wx:key="*this">
+    <cell 
+      articleId="{{item.articleId}}"
+      title="{{item.title}}" 
+      articleImg="{{item.articleImg}}"
+      userName="{{item.userName}}"
+      time="{{item.time}}" 
+      commentNum="{{item.commentNum}}"
+      showTop="{{item.showTop}}" 
+      bind:clickListItem="clickListItem"/>
+  </block>
+</view>

pages/topics/common/message/index.js

@@ -1,75 +1,30 @@
 // pages/topics/common/message/index.js
-Page({
+Component({
-
-  /**
-   * 页面的初始数据
-   */
-  data: {
-    textAreaString:""
-  },
-
-  /**
-   * 生命周期函数--监听页面加载
-   */
-  onLoad: function (options) {
-
-  },
-
-  /**
-   * 生命周期函数--监听页面初次渲染完成
-   */
-  onReady: function () {
-
-  },
-
   /**
-   * 生命周期函数--监听页面显示
+   * 组件的属性列表
    */
-  onShow: function () {
+  properties: {
 
   },
 
   /**
-   * 生命周期函数--监听页面隐藏
+   * 组件的初始数据
    */
-  onHide: function () {
+  data: {
-
+    textAreaString:""
-  },
-
-  /**
-   * 生命周期函数--监听页面卸载
-   */
-  onUnload: function () {
-
-  },
-
-  /**
-   * 页面相关事件处理函数--监听用户下拉动作
-   */
-  onPullDownRefresh: function () {
-
-  },
-
-  /**
-   * 页面上拉触底事件的处理函数
-   */
-  onReachBottom: function () {
-
   },
 
   /**
-   * 用户点击右上角分享
+   * 组件的方法列表
    */
-  onShareAppMessage: function () {
+  methods: {
-
+    bindTextAreaInput(e) {
-  },
-
-  bindTextAreaInput(e){
       this.setData({
-      textAreaString:e.detail.value
+        textAreaString: e.detail.value
       })
     },
-  submit(){
+    submit() {
       console.log(this.data.textAreaString)
     }
+  }
 })

pages/topics/common/message/index.json

@@ -1,3 +1,4 @@
 {
+  "component": true,
   "usingComponents": {}
 }

pages/topics/index.js

@@ -5,8 +5,8 @@ Page({
    * 页面的初始数据
    */
   data: {
-    headerTitles:['互动区','金点子','留言箱','1','2','3','4','5','6'],
+    headerTitles: ['互动区', '金点子', '留言箱', '1', '2', '3', '4', '5', '6'],
-    selectedTitle:2
+    selectedTitle: 1
   },
 
   /**
@@ -65,16 +65,9 @@ Page({
   },
 
   // 定义点击标题的事件处理函数，将选中标题的id赋值给selectedTitle
-  bindtap: function (e) {
+  tapSegment: function (e) {
-    console.log(e)
     this.setData({
-      selectedTitle: e.currentTarget.id
+      selectedTitle: e.detail 
     });
-  },
-  //定义滑块改变的事件处理函数，将current赋值给selectedTitle
-  bindChange: function (e) {
-    this.setData({
-      selectedTitle: e.detail.current
-    })
   }
 })

pages/topics/index.json

@@ -1,8 +1,8 @@
 {
   "usingComponents": {
+    "e-segment":"/components/segment/index",
+    "message": "./common/message/index",
     "interactive": "./common/interactive/index",
-    "goodIdea":"./common/goodIdea/index",
+    "goodIdea": "./common/goodIdea/index"
-    "message": "./common/message/index"
-
   }
 }

pages/topics/index.wxml

@@ -1,18 +1,7 @@
 <!--pages/topics/index.wxml-->
 <view class="mian">
   <view class="content-wrapper">
-    <scroll-view scroll-x scroll-into-view=''>
+    <e-segment bind:tapSegment="tapSegment" headerTitles="{{headerTitles}}" defaultSelectIndex="{{selectedTitle}}"/>
-      <view class="header-titles">
-        <block wx:for="{{headerTitles}}" wx:key="index" >
-          <view class="item-title">
-            <view id="{{index}}" bindtap="bindtap" class="title {{index==selectedTitle ? 'title-selected' : ''}}">
-              {{item}}
-            </view>
-            <view class="select-line" hidden="{{index==selectedTitle ? false : true}}"></view>
-          </view>
-        </block>
-      </view>
-    </scroll-view>
     <interactive wx:if="{{selectedTitle==0}}" />
     <goodIdea wx:if="{{selectedTitle==1}}" />
     <message wx:if="{{selectedTitle==2}}" />

pages/topics/index.wxss

@@ -1,56 +1 @@
 /* pages/topics/index.wxss */
-.header-titles {
-  height: 36px;
-  display: flex;
-  /* justify-content: space-around; */
-  padding: 5px;
-}
-.title {
-  width: 150rpx;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #999999;
-  font-size: 14px;
-  margin-top: 5px;
-}
-.item-title{
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-.title-selected {
-  font-size: 16px;
-  color: #292E3E;
-}
-.select-line{
-  margin-top: 5px;
-  width: 10px;
-  height: 2px;
-  border-radius: 5px;
-  background-color: #FA4646;
-}
-.page {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 90rpx;
-  color: white;
-}
-.bc_Yellow {
-  background-color: yellow;
-}
-.bc_Orange {
-  background-color: orange;
-}
-.bc_Green {
-  background-color: green;
-}
-.bc_Blue {
-  background-color: blue;
-}
-.bc_Purple {
-  background-color: purple;
-}