小程序弹框之Dialog

<view class='mask' bindtap='closeTk' wx:if="{{showTk}}"></view>
<view class="mask_model" wx:if="{{showTk}}">
  <view class="mask_tit">
    <image bindtap='closeTk' src="../../../imgs/del.png"></image>
  </view>
  <view class="mask_content">
    <input value="{{sms_text}}" bindblur="inputText" type="text" placeholder="请输入活动文案"></input>
    <view class="btn_save" bindtap='saveTem'>确定</view>
  </view>
</view>

/* 蒙层 */
.mask {
  position: fixed;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 100;
}

.mask_model {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 650rpx;
  height: 278rpx;
  margin: auto;
  background: #fff;
  border-radius: 10rpx;
  z-index: 101;
  box-sizing: border-box;
}

.mask_tit {
  height: 60rpx;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

.mask_tit image {
  width: 30rpx;
  height: 30rpx;
  padding: 15rpx 30rpx;
}

.mask_content {
  color: #666;
  line-height: 38rpx;
  font-size: 26rpx;
  text-align: center;
  padding: 0 35rpx;
}

.mask_content input {
  width: 580rpx;
  height: 88rpx;
  text-align: center;
  border-radius: 10rpx;
  border: 1rpx solid #d7d7d7;
}

.btn_save {
  width: 220rpx;
  height: 66rpx;
  background: rgba(252, 192, 46, 1);
  border-radius: 33rpx;
  text-align: center;
  line-height: 66rpx;
  color: #fff;
  margin: 28rpx auto 0;
  font-size: 30rpx;
}