始宁农业小程序：农事天地-新增

htmldev/shiningWxMini/pages/addNews/addNews.js

@@ -1,9 +1,18 @@
+const uploadJS = require('../../mixin/upload.js')
+const { postAddNews } = require('./api/index')
+
 Page({
 
   /**
    * 页面的初始数据
    */
-  data: {},
+  data: {
+    form: {
+      'track_content': '',
+      'track_img_url': []
+    },
+    track_img_url_max: 6
+  },
 
   /**
    * 生命周期函数--监听页面加载
@@ -39,25 +48,89 @@ Page({
   onUnload() {
 
   },
-
-  /**
-   * 页面相关事件处理函数--监听用户下拉动作
-   */
-  onPullDownRefresh() {
-
+  ...uploadJS,
+  uploadCallBack(res) {
+    const temp = res.map(item => {
+      return {
+        'url': item.url,
+        'formkey': item.formkey
+      }
+    })
+    let tempForm = {}
+    let formkey = ''
+    if (temp.length > 0) {
+      formkey = temp[0].formkey
+    }
+
+    switch (formkey) {
+      case 'track_img_url':
+        const formkeyData = this.data.form[formkey]
+        tempForm[`form.${formkey}`] = formkeyData.concat(...temp)
+        break
+      default:
+    }
+
+    if (Object.keys(tempForm).length > 0) {
+      this.setData(tempForm)
+    }
   },
+  handleInput(e) {
+    const { value } = e.detail
 
-  /**
-   * 页面上拉触底事件的处理函数
-   */
-  onReachBottom() {
+    this.setData({
+      'form.track_content': value.trim()
+    })
+  },
+  handleCancel() {
+    wx.navigateBack({
+      delta: 1
+    })
+  },
+  getForm() {
+    const { track_content, track_img_url } = this.data.form
 
+    return {
+      track_content: track_content,
+      track_img_url: track_img_url.map(item => item.url)
+    }
   },
+  verify() {
+    let errorList = []
+    const { track_content, track_img_url } = this.data.form
 
-  /**
-   * 用户点击右上角分享
-   */
-  onShareAppMessage() {
+    if (!track_content) {
+      errorList.push('请写下此刻的想法')
+    }
+
+    if (track_img_url.length < 1) {
+      errorList.push('请上传图片')
+    }
 
+    return errorList
+  },
+  async onSubmit() {
+    const temp = this.getForm()
+    const verifyList = this.verify()
+
+    if (verifyList.length >= 2) {
+      wx.showToast({
+        title: verifyList[0],
+        icon: 'none'
+      })
+      return
+    }
+    try {
+      const { status, msg } = await postAddNews(temp)
+      if (status) {
+        wx.redirectTo({
+          url: '/pages/news/news'
+        })
+      } else {
+        wx.showToast({
+          title: msg,
+          icon: 'none'
+        })
+      }
+    } catch (err) {}
   }
 })

htmldev/shiningWxMini/pages/addNews/addNews.json

@@ -1,3 +1,5 @@
 {
-  "usingComponents": {}
-}
+  "usingComponents": {
+    "van-uploader": "@vant/weapp/uploader/index"
+  }
+}

htmldev/shiningWxMini/pages/addNews/addNews.scss

@@ -26,7 +26,7 @@
 }
 
 .form-wrap {
-  width: 678rpx;
+  width: 690rpx;
 }
 
 textarea {
@@ -43,28 +43,10 @@ textarea {
   color: rgba(29, 29, 31, 1);
 }
 
-.photo-wrap {
-  display: flex;
-  flex-flow: row wrap;
-  width: 100%;
-
-  .box {
-    width: 150rpx;
-    height: 150rpx;
-    border-radius: 8rpx;
-    margin-left: 26rpx;
-    margin-bottom: 26rpx;
-    overflow: hidden;
-
-    &:nth-of-type(4n +1) {
-      margin-left: 0;
+.van-uploader__wrapper {
+  .van-uploader__preview {
+    &:nth-of-type(4n) {
+      margin: 0 0 8px 0;
     }
   }
-
-  image {
-    display: block;
-    width: 100%;
-    height: 100%;
-    background: pink;
-  }
 }

htmldev/shiningWxMini/pages/addNews/addNews.wxml

@@ -1,8 +1,8 @@
 <view class="wrapper">
   <view
     class="btns">
-    <view class="cancel">取消</view>
-    <view class="add">发布</view>
+    <view class="cancel" bind:tap="handleCancel">取消</view>
+    <view class="add" bind:tap="onSubmit">发布</view>
   </view>
   <view class="form-wrap">
     <textarea
@@ -11,14 +11,19 @@
       placeholder-class="placeholder-class"
       maxlength="-1"
       auto-height="{{true}}"
-      cursor-spacing="{{60}}"></textarea>
-    <view class="photo-wrap">
-      <view
-        class="box"
-        wx:for="{{2}}"
-        wx:key="index">
-        <image src=""></image>
-      </view>
+      cursor-spacing="{{60}}"
+      bind:input="handleInput"></textarea>
+    <view
+      class="van-uploader-wrap">
+      <van-uploader
+        file-list="{{ form.track_img_url }}"
+        max-count="{{track_img_url_max}}"
+        multiple="{{true}}"
+        accept="image"
+        data-formkey="track_img_url"
+        bind:click-preview="uploadImg"
+        bind:after-read="afterRead"
+        bind:delete="delete"/>
     </view>
   </view>
 </view>

htmldev/shiningWxMini/pages/addNews/api/index.js

@@ -0,0 +1,15 @@
+const { request } = require('../../../api/request')
+
+/**
+ * 发布动态
+ * @param obj
+ * @returns {Promise<*>}
+ */
+export const postAddNews = (obj) => request({
+  url: '/api/user/track/add',
+  method: 'POST',
+  data: {
+    ...obj
+  },
+  showLoading: true
+})

htmldev/shiningWxMini/pages/home/home.wxml

@@ -1,6 +1,6 @@
 <view class="home-wrapper">
   <view class="app_page-header-search">
-    <view class="app_page-header-search-warp">
+    <view class="app_page-header-search-warp app_width-690">
       <label for="header-search">
         <image src="../../image/common/search@2x.png"></image>
       </label>
@@ -11,7 +11,7 @@
         data-formkey="key_words"
         bind:input="handleKeyWords"></input>
     </view>
-    <view class="leaving-a-message" bind:tap="jumpLeavingAMessage">
+    <view class="leaving-a-message" bind:tap="jumpLeavingAMessage" wx:if="{{false}}">
       <image src="../../image/common/message@2x.png"></image>
       <view>8</view>
     </view>

htmldev/shiningWxMini/pages/news/news.scss

@@ -12,7 +12,6 @@
   display: block;
   width: 40rpx;
   height: 50rpx;
-  background: pink;
 }
 
 .leaving-a-message view {
@@ -49,7 +48,6 @@
     display: block;
     width: 134rpx;
     height: 134rpx;
-    background: pink;
   }
 }
 
@@ -78,7 +76,6 @@
     display: block;
     width: 100%;
     height: 100%;
-    background: pink;
   }
 }
 
@@ -157,7 +154,6 @@
     display: block;
     width: 100%;
     height: 100%;
-    background: pink;
   }
 }
 
@@ -171,7 +167,6 @@
     display: block;
     width: 48rpx;
     height: 48rpx;
-    background: pink;
   }
 
   .collection-favorite {

htmldev/shiningWxMini/pages/news/news.wxml

@@ -1,13 +1,13 @@
 <view class="wrapper">
   <view class="app_page-header-search">
-    <view class="app_page-header-search-warp">
+    <view class="app_page-header-search-warp app_width-690">
       <label for="header-search">
         <image src=""></image>
       </label>
       <input placeholder-class="app_header-search-placeholder" value="" placeholder="搜索"></input>
     </view>
-    <view class="leaving-a-message" bind:tap="jumpLeavingAMessage">
-      <image src=""></image>
+    <view class="leaving-a-message" bind:tap="jumpLeavingAMessage" wx:if="{{false}}">
+      <image src="../../image/common/message@2x.png"></image>
       <view>8</view>
     </view>
   </view>
@@ -38,14 +38,16 @@
       </view>
       <view class="tools-wrap">
         <view>
-          <image src=""></image>
+          <image src="../../image/news/Chat.png"></image>
         </view>
         <view class="collection-favorite">
           <view>
-            <image src=""></image>
+            <image src="../../image/news/collection_0.png" wx:if="{{true}}"></image>
+            <image src="../../image/news/collection_1.png" wx:if="{{false}}"></image>
           </view>
           <view class="favorite">
-            <image src=""></image>
+            <image src="../../image/news/like_0.png" wx:if="{{true}}"></image>
+            <image src="../../image/news/like_1.png" wx:if="{{false}}"></image>
           </view>
         </view>
       </view>
@@ -64,7 +66,7 @@
   class="btn-send"
   bind:tap="jumpAddNews">
   <image
-    src=""></image>
+    src="../../image/news/add.png"></image>
 </view>
   <!--自定义tabbar页面被遮挡-->
 <view style="padding-bottom:25%;"></view>

htmldev/shiningWxMini/pages/partner/partner.wxml

@@ -1,6 +1,6 @@
 <view class="wrapper">
   <view class="app_page-header-search">
-    <view class="app_page-header-search-warp">
+    <view class="app_page-header-search-warp app_width-690">
       <label for="header-search">
         <image src="../../image/common/search@2x.png"></image>
       </label>
@@ -13,7 +13,7 @@
     </view>
     <view
       class="leaving-a-message"
-      bind:tap="jumpLeavingAMessage">
+      bind:tap="jumpLeavingAMessage" wx:if="{{false}}">
       <image src="../../image/common/message@2x.png"></image>
       <view>8</view>
     </view>