DeleteModal.vue 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <template>
  2. <view style="box-sizing: border-box;">
  3. <tui-modal :show="isShow" :custom="true" :fade-in="true">
  4. <view class="Put-box1">
  5. <view class="text-align fs34 fs-bold">
  6. 温馨提示
  7. </view>
  8. <view class="mar-top-40 text-align">
  9. 您确定删除选中的商品吗?
  10. </view>
  11. <view class="flex-display flex-sp-between">
  12. <view class="btn" @click="$emit('update:showTip', false)">
  13. 点错了
  14. </view>
  15. <view class="btn submit" @click="$emit('confirm')">
  16. 确认删除
  17. </view>
  18. </view>
  19. </view>
  20. </tui-modal>
  21. </view>
  22. </template>
  23. <script>
  24. export default {
  25. name: 'DeleteModal',
  26. props: {
  27. showTip: {
  28. type: Boolean
  29. }
  30. },
  31. data() {
  32. return {
  33. isShow: false
  34. }
  35. },
  36. watch: {
  37. showTip(val) {
  38. this.isShow = val
  39. }
  40. },
  41. methods: {}
  42. }
  43. </script>
  44. <style lang="scss" scoped>
  45. .Put-box1 {
  46. .btn {
  47. text-align: center;
  48. margin-top: 40rpx;
  49. border: 1px solid #333333;
  50. height: 80upx;
  51. line-height: 80upx;
  52. width: 240upx;
  53. color: #333333;
  54. }
  55. .submit {
  56. background-color: #333333;
  57. color: #FFEBC4;
  58. }
  59. }
  60. </style>