dmEditedSuccess.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. <template>
  2. <dm-pop-view ref='popView' :isShowTitle="false" :isShowClose="false" :isShowConfirm="false" :maskTapHide='maskTapHide'>
  3. <view class="content" v-if="false">
  4. <view class="content_success">
  5. <image class="img_success" src="../../static/icons/complete_success.png" mode=""></image>
  6. </view>
  7. <view class="content-des">保存完成!</view>
  8. <view class="goBtn" :style="`background-color: ${themeColor};`" @click="confirmAction">好的</view>
  9. </view>
  10. <view class="content" v-if="false">
  11. <view class="content_success">
  12. <image class="img_success" src="../../static/icons/complete_failure.png" mode=""></image>
  13. </view>
  14. <view class="content-des">保存失败!</view>
  15. <view class="goBtn" :style="`background-color: ${themeColor};`" @click="confirmAction">重新编辑</view>
  16. </view>
  17. <view class="content">
  18. <view class="content_success">
  19. <view style="position: relative;margin-top: 100rpx;width: 118rpx;height: 118rpx;">
  20. <image class="img_success" src="../../static/icons/icon_info_bt_bg.png" mode="" style="margin-top: 0rpx;"></image>
  21. <image style="width: 54rpx;height: 10rpx;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);" src="../../static/icons/diandiandian.png" mode=""></image>
  22. </view>
  23. </view>
  24. <view class="content-des">填写完必填项后,方可保存</view>
  25. <view class="goBtn" :style="`background-color: ${themeColor};`" @click="confirmAction">继续填写</view>
  26. </view>
  27. </dm-pop-view>
  28. </template>
  29. <script>
  30. import dmPopView from './dmPopView.vue'
  31. let app = getApp();
  32. export default {
  33. props: {
  34. maskTapHide: {
  35. type: Boolean,
  36. default: true
  37. }
  38. },
  39. data() {
  40. return {
  41. themeColor: null,
  42. fuzhuColor: null,
  43. themeColor50: null,
  44. themeColor25: null,
  45. fuzhuColor50: null,
  46. }
  47. },
  48. mounted() {
  49. this.themeColor = app.globalData.themeColor
  50. this.themeColor50 = app.globalData.themeColor50
  51. this.themeColor25 = app.globalData.themeColor25
  52. this.fuzhuColor = app.globalData.fuzhuColor
  53. this.fuzhuColor50 = app.globalData.fuzhuColor50
  54. },
  55. methods: {
  56. show() {
  57. this.$refs.popView.show()
  58. },
  59. knowAction(){
  60. this.$refs.popView.hide()
  61. },
  62. confirmAction() {
  63. this.$refs.popView.hide()
  64. this.$emit('confirmAction')
  65. }
  66. },
  67. components: {
  68. dmPopView
  69. }
  70. }
  71. </script>
  72. <style scoped lang="scss">
  73. .content {
  74. width: 100%;
  75. height: 520rpx;
  76. font-family: Verdana;
  77. .content_success{
  78. width: 100%;
  79. height: 118rpx;
  80. border-radius: 50%;
  81. display: flex;
  82. justify-content: center;
  83. .img_success{
  84. width: 118rpx;
  85. height: 118rpx;
  86. border-radius: 50%;
  87. margin-top: 100rpx;
  88. }
  89. }
  90. .content-des {
  91. color: #333333;
  92. font-size: 32rpx;
  93. font-weight: bold;
  94. margin-top: 125rpx;
  95. text-align: center;
  96. }
  97. .goBtn {
  98. width: 260rpx;
  99. height: 84rpx;
  100. border-radius: 42rpx;
  101. margin-left: calc((100% - 260rpx) / 2);
  102. margin-top: 90rpx;
  103. font-size: 32rpx;
  104. color: #FFFFFF;
  105. line-height: 84rpx;
  106. text-align: center;
  107. }
  108. }
  109. </style>