prompting.vue 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <template>
  2. <div id="fade" class="bgColor">
  3. <div class="success" v-if="status">
  4. <i class="iconfont icon-icon_zhengzaijinx"></i>
  5. <span class="conentBox">成功提示:<span class="conent">{{conents}}</span></span>
  6. </div>
  7. <div class="error" v-else>
  8. <i class="iconfont icon-cuowu"></i>
  9. <span class="conentBox">错误提示:<span class="conent">{{conents}}</span></span>
  10. </div>
  11. </div>
  12. </template>
  13. <script>
  14. export default {
  15. data(){
  16. return{
  17. }
  18. },
  19. props:['conents',"status"],
  20. methods:{
  21. },
  22. mounted(){
  23. }
  24. }
  25. </script>
  26. <style scoped>
  27. .bgColor{
  28. background-color: white
  29. }
  30. #fade{
  31. display: none
  32. }
  33. .success{
  34. position: fixed;
  35. top: 0;
  36. left: 0;
  37. width: 100%;
  38. height: .64rem;
  39. line-height: .64rem;
  40. padding: 0 .24rem;
  41. background-color: #bae6b8;
  42. z-index: 99999
  43. }
  44. .success i{
  45. font-size: .35rem;
  46. color: #056b00;
  47. }
  48. .success .conentBox{
  49. display: inline-block;
  50. margin-left: .16rem;
  51. font-size: .28rem;
  52. color: #056b00;
  53. font-weight: bold
  54. }
  55. .success .conentBox .conent{
  56. display: inline-block;
  57. margin-left: .08rem;
  58. color: #056b00;
  59. font-weight: bold
  60. }
  61. .error{
  62. position: fixed;
  63. top: 0;
  64. left: 0;
  65. width: 100%;
  66. height: .64rem;
  67. line-height: .64rem;
  68. padding: 0 .24rem;
  69. background-color: rgb(235,197,188);
  70. z-index: 99998
  71. }
  72. .error i{
  73. font-size: .35rem;
  74. color: rgb(153,31,0)
  75. }
  76. .error .conentBox{
  77. display: inline-block;
  78. margin-left: .16rem;
  79. font-size: .28rem;
  80. color: rgb(153,31,0);
  81. font-weight: bold
  82. }
  83. .error .conentBox .conent{
  84. display: inline-block;
  85. margin-left: .08rem;
  86. color: rgb(153,31,0);
  87. font-weight: bold
  88. }
  89. </style>