第八章作业——留言板

app.js代码

var Bmob =require('utils/bmob.js');
Bmob.initialize("fd55881003710fea60b93c55d99863ef","8ee81f55de0cda758360336113ce33cd");

app.json代码

{
  "pages": [
    "pages/qi/qi",
    "pages/xq/xq"
  ],
  "window": {
   "backgroundTextStyle":"light",
   "navigationBarBackgroundColor": "#3891f8",
   "navigationBarTitleText": "小小留言板",
   "navigationBarTextStyle":"white"
  },
  "tabBar": {
    "color": "pink",
    "list": [
      {
        "pagePath": "pages/qi/qi",
        "iconPath": "images/xx.jpg",
        "selectedIconPath": "images/xx.jpg",
        "text":"首页"
      },
      {
        "pagePath": "pages/xq/xq",
        "iconPath": "images/hh.jpg",
        "selectedIconPath": "images/hh.jpg",
        "text":"详情"
      }
    ]
  },
 
  "style": "v2",
  "componentFramework": "glass-easel",
  "sitemapLocation": "sitemap.json",
  "lazyCodeLoading": "requiredComponents"
}
 

qi.js代码

var Bmob=require('../../utils/bmob.js');
 //var common =require('../../untils/common.js');
var app=getApp();
var that;
var url=''
Page({
  data:{
    writeDiary:false,
    loading:false,
    windowHeight:0,
    windowWidth:0,
    limit:10,
    diaryList:[],
    modifyDiarys:false
  },
  // 获取并显示留言数据
  onShow:function () {
    getList(this);
    wx.getSystemInfo({
      success:(res)=>{
        that.setData({
          windowHeight:res.windowHeight,
          windowWidth:res.windowWidth
        })
      }
    })
    // 获取数据
    function getList(t,k) {
      that =t;
      var Diary=Bmob.Object.extend("test");
      var query=new Bmob.Query(Diary);
      var query1=new Bmob.Query(Diary);
      query.descending('createdAt');
      query.include("own");
      query.limit(that.data.limit);
      var mainQurey=Bmob.Query.or(query,query1);
      mainQurey.find({
        success:function (results) {
          console.log(results);
          that.setData({
          diaryList:results
          })
        },
        error:function (error) {
          console.log("查询失败："+error.code+" "+error.message);
        }
      });
    }
  },
    // 添加数据
    toAddDiary:function () {
      that.setData({
        writeDiary:true
      })
    },
    uppic:function () {
      var that=this;
      wx.chooseImage({
        count: 1,
        sizeType: ['compressed'],
        sourceType: ['album','camera'],
        success:function(res){
          var tempFilePaths=res.tempFilePaths;
          if(tempFilePaths.length>0){
            var newDate=new Date();
            var newDateStr=newDate.toLocaleDateString();
            var tempFileePath=[tempFilePaths[0]];
            var extension = /\.([^.]*)$/.exec( tempFilePath[0]);
            if(extension){
              extension=extension[1].toLowerCase();
            }
            var name=newDateStr + "." +extension;
            var file=new Bmob.File(naem,tempFilePaths);
            file.save().then(function(res){
              console.log(res.rul());
              url=res.url();
              that.setData({
                url:url
              })
            },function(error){
              console.log(error);
            })
          }
        }  
      })
    },
    // 添加留言数据
    addDiary:function(event){
      var title=event.detail.value.title;
      var content=event.detail.value.content;
      var formId=event.detail.formId;
      console.log("event",event)
      if(!title){
        common.showTip("标题不能为空","loading");
      }
      else if(!content){
        common.showTip("内容不能为空","loading");
      }
      else{
        that.setData({
          loading:true
        })
        var currentUser=Bmob.User.current();
        var User=Bmob.Object.extend("_User");
        var UserModel=new User();
        // 添加留言
        var Diary=Bmob.Object.extend("test");
        var Diary=new Diary();
        diary.set("title",title);
        diary.set("formId",formId);
        diary.set("content",content);
        diary.set("image",url);
        diary.set("count",1);
        if(currentUser){
          UserModel.id=currentUser.id;
          diary.set("own",UserModel);
        }
        diary.save(null,{
          success:function(result){
            common.showTip('添加日记成功');
            that.setData({
              writeDiary:false,
              loading:false
            })
            var currentUser=Bmob.User.current();
            that.onShow();
          },
        error:function(result,error){
          common.showTip('添加留言失败，请重新发布','loading');
        }
        });
      }
    },
    deleteDiary:function(event){
      var that=this;
      var objectId=event.target.dataset.id;
      wx.showModal({
        title: '操作提示',
        content: '确定要删除要留言？',
        success:function(res){
          if(res.confirm){
            var Diary=Bmob.Object.extend("test");
            var query=new Bmob.Query(Diary);
            query.get(objectId,{
              success:function(object){
                object.destroy({
                  success:function(deleteObject){
                    console.log('删除留言成功');
                    getList(that)
                  },
                  error:function(object,error){
                    console.log('删除留言失败');
                  }
                });
              },
              error:function(object,error){
                console.log("query object fail");
              }
            });
          }
        }
        })
    },
    toModifyDiary:function(event){
      var nowTitle=event.target.dataset.title;
      var nowContent=event.target.dataset.content;
      var nowId=event.target.dataset.id;
      that.setData({
        modifyDiarys:true,
        nowTitle:nowTitle,
        nowContent:nowContent,
        nowId:nowId
      })
    },
    modifyDiarys:function(e){
      var t=this;
      this.modifyDiarys(t,e)
    function modify(t,e){
      var that=t;
      var modyTitle=e.detail.value.title;
      var modyContent=e.detail.value.content;
      var objectId=e.detail.value.content;
      var thatTitle=that.data.nowTitle;
      var thatContent=that.data.nowContent;
      if((modyTitle!=thatTitle||modyContent!=thatContent)){
        if(modyTitle==""||modyContent==""){
          common.showTip('标题或内容不能为空','loading');
        }
        else{
          console.log(modyContent)
          var Diary=Bmob.Object.extend("test");
          var query=new Bmob.Query(Diary);
          query.get(that.data.nowId,{
            success:function(result){
              result.set('title',modyTitle);
              result.set('content',modyContent);
              result.save();
              common.showTip('留言修改成功','success',function(){
                that.onShow();
                that.setData({
                  modifyDiarys:false
                })
              });
            },
            erroe:function(object,error){
 
            }
          });
        }
      }
      else if(modyTitle==""||modyContent==""){
        common.showTip('标题或内容不能为空','loading');
      }
      else{
        that.setData({
          modifyDiarys:false
        })
        common.showTip('修改成功','loading');
      }
    }
    }
})
 

qi.wxml代码

<!-- 显示留言 -->
<image class="toWrite"bindtap="toAddDiary"src="/images/1.jpg"/>
<view class="page">
<scroll-view lower-threshold="800"bindscrolltolower="pullUpLoad"upper-threshold="0"scroll-y="true"style="height:{{windowHeight}}px;">
<view class="page_bd">
<view class="weui-panel_hd">留言板</view>
<view>
<block wx:if="{{diaryList.length>0}}">
<navigator class="weui-media-box weui-nedia-box_text"wx:for="{{diaryList}}"wx:key="diaryItem"url="/pages/xq/xq? objectId={{item.objectId}}&count={{item.count}}">
<view class="title">
主题：{{item.title}}
</view>
<view class="content">留言内容：</view>
<view class="info">
<view class="time">时间：{{item.updatedAt}}</view>
<view class="count">浏览：{{item.count}}</view>
<view class="operate">
<icon type="cancel dels"size="16"></icon>
<text class="del"catchtap="deleteDiary"data-id="{{item.objectId}}">删除</text>
<icon type="success deits"size="16"></icon>
<text catchtap="toModifyDiary"data-id="{{item.objectId}}"data-content="{{item.content}}"data-title="{{item.tilte}}">编辑</text>
</view>
</view>
</navigator>
</block>
</view>
</view>
</scroll-view>
</view>
<!-- 添加留言 -->
<view class="js_dialog"id="androidDialog1"style="opacity:1;"wx:if="{{writeDiary}}">
<view class="weui-mask"></view>
<view class="weui-dialog weui-skin_android">
<view class="weui-dialog_hd">
<strong class="weui-dialog_title">添加留言</strong>
</view>
<form bindsubmit="addDiary"report-submit="true">
<view class="weui-dialog_bd">
<view class="weui-cells_title">标题</view>
<view class="weui-cells weui-cells_after-title">
<view class="weui-cell weui-cell_input">
<view class="weui-cell_bd">
<input class="weui-input"name="title"placeholder="请输入标题"/>
</view>
</view>
</view>
<view class="weui-cells_title">留言内容</view>
<view class="weui-cells weui-cells_after-title">
<view class="weui-cell">
<view class="weui-cell_bd">
<textarea class="weui-textarea"name="content"placeholder="请输入留言内容"style="height:3.3em"/>
<view class="weui-textarea-content">0/200</view>
</view>
</view>
</view>
<view class="pic">
<view class="pictext"bindtap="uppic">添加图片</view>
<block wx:if="{{isTypeof(url)}}">
<image src="/images/1.jpg"/>
</block>
<block wx:else>
<image src="{{url}}"/>
</block>
</view>
</view>
<view class="weui-dialog_ft">
<view class="weui-dialog_btn weui-dialog_btn_default"bindtap="noneWindows">取消</view>
<button loading="{{loading}}"class="weui-dialog_btn weui-dialog_btn_primary"formType="submit">提交</button>
</view>
</form>
</view>
</view>
<!-- 修改留言板 -->
<view class="js_dialog"id="androidDialog2"style="opacity:1;"wx:if="{{moidfyDiarys}}">
<view class="weui-mask"></view>
<view class="weui-dialog weui-skin_android">
<view class="weui-dialog_hd">
<strong class="weui-dialog_title">修改留言</strong>
</view>
<form bindsubmit="modifyDiary">
<view class="weui-dialog_bd">
<view class="weui-cells_title">标题</view>
<input class="weui-input"name="title"value="{{nowTitle}}"placeholder="请输入标题"/>
<view class="weui-cells_title">留言内容</view>
<view class="weui-cells weui-cells_after-title">
<view class="weui-cell">
<view class="weui-cell_bd">
<textarea class="weui-textarea"name="content"value="{{nowContent}}"placeholder="请输入留言内容"style="height:3.3em"/>
<view class="weui-textarea-counter">0/200</view>
</view>
</view>
</view>
</view>
<view class="weui-dialog_ft">
<view class="weui-dialog_btn weui-dialog_btn_default"bindtap="noneWindows">取消</view>
<button loading="{{loading}}"class="weui-dialog_btn weui-dialog_btn_primary"formType="submit">提交</button>
</view>
</form>
</view>
</view>

xq.js代码

var Bmob=require('../../utils/bmob.js');
Page({
  data:{
    rows:{}//留言详情
  },
onLoad:function(e){
  //页面初始花
  console.log(e.objectId)
  var objectId=e.objectId;
  var newcount=e.count;
  var that=this;
  var Diary=Bmob.Object.extend("text");
  var query=new Bmob.Query(Diary);
 
  query.get(objectId,{
    success:function(result){
      console.log(result);
 
      that.setData({
        rows:result,
      })
      newcount=parseInt(new count)+1//浏览次数
      result.set("count",new count)//保存次数
      result.save()
    },
    error:function(result,error){
      console.log("查询失败");
    }
  })
}
})

xq.wxml代码 

<view class="page">
  <view>
    <view>
      <view>留言主题：</view>
      <view>{{row.title}}</view>
      <view>
        <view>留言内容：</view>
        <view>{{row.content}}</view>
        <view class="pic">
          <image src="../../images/1.jpg" />
        </view>
        浏览次数：{{rows.count}}
      </view>
      <view>创建时间：{{rows.createdAt}}</view>
    </view>
  </view>
  <view class="footer">
  <text>Copyright @2017-2019 www.smartbull.cn</text>
  </view>
  </view>