<template>
<view>
<!-- 头部 -->
<view class="head">
<view class="status-bar"></view>
<view class="title-bar">
<view class="title-left" @tap="fnCloseWin">
<text class="quxiao-text">取消</text>
</view>
<view class="title-centre">
<text class="title-text"></text>
</view>
<view class="title-right" @tap="fnFaBu">
<text class="fabu-text">发布</text>
</view>
</view>
</view>
<!-- 占位 -->
<view style="height: 150rpx;"></view>
<!-- 人生格言 -->
<view class="miaoshu-bar">
<textarea class="textarea" @input="fnJiantingLiuyan" @focus="fnDakaiJianpan" maxlength="200" placeholder-style="font-size:15px" placeholder="填写留言内容" focus/>
<view class="hint-wrap">
<text class="hint-text">{{number}}</text>
<text class="hint-text">/200</text>
</view>
</view>
</view>
</template>
<script>
var _self;
import myConn from '../../common/conn.js';
export default {
data(){
return{
liuyan:'',//留言内容
number:0,//输入字符长度
id:0,//相关留言或评论ID
}
},
//初始化
onLoad:function(option){
_self = this;
this.id = option.id;
plus.key.showSoftKeybord();
},
methods:{
//关闭窗口
fnCloseWin:function(){
uni.navigateBack();
},
//监听输入内容
fnJiantingLiuyan:function(event){
//获取textarea输入内容
this.liuyan = event.detail.value;
//输入字符长度重新赋值
this.number = this.liuyan.length;
},
//发布
fnFaBu:function(){
//效验描述输入内容
if(this.liuyan.replace(/\s+/g,"").length < 6){
plus.nativeUI.toast("留言最少6个字");
return;
}
uni.hideKeyboard();
//请求上传数据
const cellphone = uni.getStorageSync('cellphone');
const token = uni.getStorageSync('token');
console.log(this.id);
uni.request({
url: myConn.pinglun,
method:"POST",
header:{'content-type' : 'application/x-www-form-urlencoded'},
data: {
cellphone:cellphone,//手机号
token:token,//token
message:this.liuyan,//评论或留言内容
boardParentId:this.id//发布评论的信息ID
},
success: (res) => {
if(res.data.result){
plus.nativeUI.toast("发布成功");
uni.navigateBack();
}else{
console.log(JSON.stringify(res));
plus.nativeUI.toast("发布失败");
}
}
});
}
}
}
</script>
<style>
/ 头部 /
.head{position: fixed;top:0;left: 0;right: 0;}
.status-bar{height: 50rpx;background-color: #1b1d19;}
.title-bar{height: 100rpx;flex-direction: row;align-items: center;background-color:#FAFAFC;}
.title-left{width: 120rpx;align-items: center;justify-content: center;}
.title-centre{width: 510rpx;align-items: center;justify-content: center;}
.title-right{width: 120rpx;align-items: center;justify-content: center;}
.exit-icon{height: 32rpx;width: 32rpx;}
.title-text{font-size: 34rpx;color: #21252B;}
.quxiao-text{font-size: 32rpx;color: #21252B;}
.fabu-text{font-size: 32rpx;color: #5eabe0;font-weight: 900;}
/ 描述编辑框 /
.miaoshu-bar{border-bottom-color: #eeeeee;border-bottom-width: 1rpx;}
.textarea{height: 400rpx;font-size: 32rpx;color:#21252B;padding:30rpx 30rpx;border-radius: 10rpx;}
.hint-wrap{flex-direction: row;align-items: center;position:absolute;right: 30rpx;top:350rpx;}
.hint-text{color: #ababb9;font-size: 28rpx;}
</style>
0 个回复