popup.nvue 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <template>
  2. <view class="videos">
  3. <view class="videos_e">
  4. <view class="videos_title">
  5. <view class="videos_titles">
  6. <text class="videos_titles_one">提示</text>
  7. </view>
  8. <view class="videos_titless">
  9. <text class="videos_titless_one">是否保存为草稿?</text>
  10. </view>
  11. </view>
  12. <view class="videos_operation">
  13. <view class="videos_operations">
  14. <text class="videos_operations_one" >取消</text>
  15. </view>
  16. <view class="videos_operationss">
  17. <text class="videos_operationss_one">确认</text>
  18. </view>
  19. </view>
  20. </view>
  21. </view>
  22. </template>
  23. <script>
  24. export default {
  25. data() {
  26. return {
  27. }
  28. },
  29. onLoad() {
  30. },
  31. onShow() {
  32. },
  33. methods: {
  34. // 默认给父级加一个定时器就不会出现点击关闭子窗体的问题了
  35. onEvents() {
  36. },
  37. // 取消
  38. onCancel() {
  39. //向原生子窗体传递数据
  40. uni.$emit('page-popup', {
  41. msg: "取消"
  42. });
  43. },
  44. // 确定
  45. onDetermine() {
  46. //向原生子窗体传递数据
  47. uni.$emit('page-popup', {
  48. msg: "确定"
  49. });
  50. }
  51. }
  52. }
  53. </script>
  54. <style>
  55. .videos {
  56. background-color: rgba(0, 0, 0, 0);
  57. align-items: center;
  58. justify-content: center;
  59. }
  60. .videos_e {
  61. background-color: #FFFFFF;
  62. height: 299rpx;
  63. width: 560rpx;
  64. border-radius: 30rpx;
  65. }
  66. .videos_title {
  67. width: 560rpx;
  68. height: 200rpx;
  69. align-items: center;
  70. justify-content: center;
  71. border-bottom-width: 1rpx;
  72. border-color: #E5E5E5;
  73. border-style: solid;
  74. }
  75. .videos_titles_one {
  76. font-size: 38rpx;
  77. font-weight: 700;
  78. }
  79. .videos_titless {
  80. margin-top: 15rpx;
  81. }
  82. .videos_titless_one {
  83. font-size: 32rpx;
  84. }
  85. .videos_operation {
  86. width: 560rpx;
  87. height: 99rpx;
  88. flex-direction: row;
  89. }
  90. .videos_operationss {
  91. border-left-width: 1rpx;
  92. border-color: #E5E5E5;
  93. border-style: solid;
  94. }
  95. .videos_operations,
  96. .videos_operationss {
  97. width: 280rpx;
  98. height: 99rpx;
  99. align-items: center;
  100. justify-content: center;
  101. }
  102. .videos_operations_one {
  103. font-size: 36rpx;
  104. color: #343434;
  105. }
  106. .videos_operationss_one {
  107. font-size: 36rpx;
  108. color: #FF0423;
  109. }
  110. </style>