建议反馈页面

app.json

@@ -9,7 +9,8 @@
     "pages/welfareMall/personal/personal",
     "pages/welfareMall/historical/historical",
     "pages/welfareMall/order/orderCompletion",
-    "pages/welfareMall/refund/refund"
+    "pages/welfareMall/refund/refund",
+    "pages/welfareMall/feedback/feedback"
   ],
   "window": {
     "backgroundTextStyle": "light",

pages/welfareMall/feedback/feedback.js

@@ -0,0 +1,75 @@
+// pages/welfareMall/feedback/feedback.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    t_length: 0,
+
+  },
+
+  bindText: function (e) {
+    var t_text = e.detail.value.length;
+    // console.log(t_text)
+    this.setData({
+      t_length: t_text
+    }) 
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/welfareMall/feedback/feedback.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "意见反馈"
+}

pages/welfareMall/feedback/feedback.wxml

@@ -0,0 +1,18 @@
+<!--pages/welfareMall/feedback/feedback.wxml-->
+<view class="feedback flex-column">
+  <view class="feedback-style flex-column">
+    <view class="feedback-title">建议</view>
+    <view class="feedback-text flex-column">
+      <view class='suggest_box'>
+        <textarea class='suggest_text' bindinput="bindText" maxlength='200' placeholder='请输入您的建议' placeholder-class='sug_p'>
+          <text class="suggest_text-num flex-column">{{t_length}}/500</text>
+        </textarea>
+      </view>
+    </view>
+    <view class="feedback-exp flex-row">
+      <view class="feedback-explain">图片（选项）（最多添加4张）</view>
+      <view></view>
+    </view>
+    <view class="explain-img"></view>
+  </view>
+</view>

pages/welfareMall/feedback/feedback.wxss

@@ -0,0 +1,49 @@
+/* pages/welfareMall/feedback/feedback.wxss */
+.feedback{
+  width: 750rpx;
+  height: auto;
+  padding-bottom: 119rpx; 
+  background: #F7F7F7;
+}
+
+/* 垂直方向布局，水平居中 **/
+.flex-column{
+  display: flex;
+  flex-flow: column nowrap;
+  align-items: center;
+  justify-content: left;
+}
+
+/* 水平方向布局，垂直居中 **/
+.flex-row{
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  justify-content: center;
+}
+
+textarea{
+  width: 659rpx;
+  height: 320rpx;
+  background: #FFFFFF;
+  border: 1rpx solid #3E3E3E;
+  border-radius: 10rpx;
+}
+
+.suggest_text-num{
+  align-items: flex-end;
+}
+
+.feedback-exp{
+  width: 659rpx;
+  height: 120rpx;
+  justify-content: space-between;
+}
+
+.feedback-explain{
+  width: 350rpx;
+  height: 40rpx;
+  font-size: 24rpx;
+  font-weight: 500;
+  color: #444444;
+}

pages/welfareMall/personal/personal.js

@@ -31,8 +31,15 @@ Page({
     })
 },
 
-getHistorical(e) {
-    const url = "../historical/historical?id=" + e.currentTarget.dataset.id
+  toHistorical(e) {
+      const url = "../historical/historical?id=" + e.currentTarget.dataset.id
+      wx.redirectTo({
+          url
+      })
+  },
+
+  toFeedback(e) {
+    const url = "../feedback/feedback?id=" + e.currentTarget.dataset.id
     wx.redirectTo({
         url
     })

pages/welfareMall/personal/personal.wxml

@@ -56,7 +56,7 @@
       </view>
       <view class="content-lower"></view>
       <!-- 历史订单 -->
-      <view class="historical-order content-style flex-row" catchtap="getHistorical">
+      <view class="historical-order content-style flex-row" catchtap="toHistorical">
         <view class="content-img-text flex-row">
           <image class="content-img" src="/images/welfareMall/historical-order.png" />
           <view class="content-text">历史订单</view>
@@ -65,7 +65,7 @@
       </view>
       <view class="content-lower"></view>
       <!-- 意见反馈 -->
-      <view class="feedback content-style flex-row">
+      <view class="feedback content-style flex-row" catchtap="toFeedback">
         <view class="content-img-text flex-row">
           <image class="content-img" src="/images/welfareMall/feedback.png" />
           <view class="content-text">意见反馈</view>