lihenian
5 years ago
32 changed files with 658 additions and 74 deletions
|
Before Width: | Height: | Size: 126 KiB After Width: | Height: | Size: 53 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
@ -0,0 +1,91 @@ |
|||||
|
Component({ |
||||
|
data: { |
||||
|
visible: false, |
||||
|
textareaValue: '' |
||||
|
}, |
||||
|
properties: { |
||||
|
noticeVerifyVisible: { |
||||
|
type: Boolean, |
||||
|
value: false, |
||||
|
observer: function (newValue) { |
||||
|
this.setData({ |
||||
|
visible: !this.data.visible |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
title: { |
||||
|
type: String, |
||||
|
value: '' |
||||
|
}, |
||||
|
cancelText: { |
||||
|
type: String, |
||||
|
value: '' |
||||
|
}, |
||||
|
confirmText: { |
||||
|
type: String, |
||||
|
value: '' |
||||
|
}, |
||||
|
tipVisible: { |
||||
|
type: Boolean, |
||||
|
value: false |
||||
|
}, |
||||
|
tipValue: { |
||||
|
type: String, |
||||
|
value: '*请输入屏蔽该话题的原因' |
||||
|
} |
||||
|
}, |
||||
|
lifetimes: { |
||||
|
attached () { |
||||
|
console.log('notice-verify') |
||||
|
}, |
||||
|
deattached () { |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
pageLifetimes: { |
||||
|
show () { |
||||
|
|
||||
|
}, |
||||
|
hide () { |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
close () { |
||||
|
this.triggerEvent('close', {data: this.data.textareaValue}) |
||||
|
this.setData({ |
||||
|
// visible: !this.data.visible,
|
||||
|
textareaValue: '' |
||||
|
}) |
||||
|
}, |
||||
|
confirm () { |
||||
|
if (this.data.textareaValue === '') { |
||||
|
wx.showToast({ |
||||
|
title: '原因不能为空', |
||||
|
icon: 'none', |
||||
|
duration: 2000 |
||||
|
}) |
||||
|
return false |
||||
|
} |
||||
|
this.triggerEvent('confirm', {data: this.data.textareaValue}) |
||||
|
this.setData({ |
||||
|
// visible: !this.data.visible,
|
||||
|
textareaValue: '' |
||||
|
}) |
||||
|
}, |
||||
|
textareaInput (e) { |
||||
|
this.setData({ |
||||
|
textareaValue: e.detail.value |
||||
|
}) |
||||
|
// console.log(this.data.textareaValue)
|
||||
|
}, |
||||
|
closeDialog () { |
||||
|
this.setData({ |
||||
|
visible: !this.data.visible |
||||
|
}) |
||||
|
}, |
||||
|
move () { |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,3 @@ |
|||||
|
{ |
||||
|
"component": true |
||||
|
} |
||||
@ -0,0 +1,16 @@ |
|||||
|
<view class="notice-verify" wx:if="{{visible}}" capture-catch:touchmove="move"> |
||||
|
<view class="content"> |
||||
|
<view class="close" bindtap="closeDialog"> |
||||
|
<!-- <image src="../../images/delete.png" /> --> |
||||
|
</view> |
||||
|
<view class="title">{{title}}</view> |
||||
|
<view class="textarea"> |
||||
|
<textarea value="{{textareaValue}}" bindinput="textareaInput" placeholder-class="textarea-placeholder" placeholder="屏蔽原因（必填 100字以内）" maxlength="100"/> |
||||
|
</view> |
||||
|
<view class="note" wx:if="{{tipVisible}}">{{tipValue}}</view> |
||||
|
<view class="footer"> |
||||
|
<view class="unpass" wx:if="{{cancelText != ''}}" bindtap="close">{{cancelText}}</view> |
||||
|
<view class="pass" wx:if="{{confirmText != ''}}" bindtap="confirm">{{confirmText}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
@ -0,0 +1,100 @@ |
|||||
|
.notice-verify { |
||||
|
width: 100%; |
||||
|
height: 100vh; |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
top: 0; |
||||
|
background: rgba(0,0,0,0.3); |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
z-index: 1000; |
||||
|
} |
||||
|
.notice-verify .content { |
||||
|
width: 610rpx; |
||||
|
height: auto; |
||||
|
border-radius: 16rpx; |
||||
|
background: #fff; |
||||
|
box-sizing: border-box; |
||||
|
padding: 0 30rpx; |
||||
|
} |
||||
|
.notice-verify .content .close { |
||||
|
width: 100%; |
||||
|
height: 62rpx; |
||||
|
display: flex; |
||||
|
justify-content: flex-end; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.notice-verify .content .close image { |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
object-fit:cover; |
||||
|
position: relative; |
||||
|
left: 7px; |
||||
|
top: 2px; |
||||
|
} |
||||
|
.notice-verify .content .title { |
||||
|
font-size: 40rpx; |
||||
|
color: #333; |
||||
|
line-height: 57rpx; |
||||
|
height: 57rpx; |
||||
|
width:100%; |
||||
|
text-align:center; |
||||
|
margin-bottom: 26rpx; |
||||
|
} |
||||
|
.notice-verify .content .textarea { |
||||
|
width: 100%; |
||||
|
height: 345rpx; |
||||
|
border-radius: 16rpx; |
||||
|
background: #f7f7f7; |
||||
|
box-sizing: border-box; |
||||
|
padding: 27rpx 17rpx 0; |
||||
|
margin-bottom: 20rpx; |
||||
|
} |
||||
|
.notice-verify .content .textarea textarea { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
font-size: 32rpx; |
||||
|
line-height: 44rpx; |
||||
|
color: #666; |
||||
|
} |
||||
|
.notice-verify .content .textarea .textarea-placeholder { |
||||
|
font-size: 28rpx; |
||||
|
color: #999; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
.notice-verify .content .note { |
||||
|
font-size: 24rpx; |
||||
|
color: #999; |
||||
|
height:58rpx; |
||||
|
line-height: 58rpx; |
||||
|
} |
||||
|
.notice-verify .content .footer { |
||||
|
width: 100%; |
||||
|
height: 107rpx; |
||||
|
box-sizing: border-box; |
||||
|
padding: 15rpx 0; |
||||
|
display: flex; |
||||
|
justify-content: space-around; |
||||
|
align-items: center; |
||||
|
border-top: 1rpx solid #eaeaea; |
||||
|
} |
||||
|
.notice-verify .content .unpass { |
||||
|
height: 100%; |
||||
|
line-height: 77rpx; |
||||
|
font-size: 36rpx; |
||||
|
flex: 1; |
||||
|
color: #999; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.notice-verify .content .unpass + .pass { |
||||
|
border-left: 1rpx solid #eaeaea; |
||||
|
} |
||||
|
.notice-verify .content .pass { |
||||
|
height: 100%; |
||||
|
line-height: 77rpx; |
||||
|
font-size: 36rpx; |
||||
|
flex: 1; |
||||
|
color: #04BCA0; |
||||
|
text-align: center; |
||||
|
} |
||||
|
After Width: | Height: | Size: 485 B |
Loading…
Reference in new issue