index.vue 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <template>
  2. <view class="content">
  3. <view class="text">
  4. <button class="text-item" @click="text">
  5. 测试
  6. </button>
  7. </view>
  8. <view class="installition">
  9. <button class="text-item" @click="installition">
  10. 安装
  11. </button>
  12. </view>
  13. <u-toast ref="uToast"></u-toast>
  14. </view>
  15. </template>
  16. <script>
  17. export default {
  18. data() {
  19. return {
  20. }
  21. },
  22. methods: {
  23. text() {
  24. uni.switchTab({
  25. url: "/pages/bluetooth/bluetooth"
  26. })
  27. },
  28. installition() {
  29. uni.navigateTo({
  30. url:"/pages/tabbar/room/room"
  31. })
  32. this.$refs.uToast.show({
  33. type: 'error',
  34. message: "功能正在完善....",
  35. icon: 'info-circle',
  36. position: "top",
  37. })
  38. }
  39. }
  40. }
  41. </script>
  42. <style lang="scss">
  43. .content {
  44. background-color: #e8e8e8;
  45. width: 100vw;
  46. height: 100vh;
  47. display: flex;
  48. flex-direction: column;
  49. // justify-content: space-between;
  50. .installition,
  51. .text {
  52. flex: 1;
  53. margin: 30rpx;
  54. display: flex;
  55. justify-content: center;
  56. align-items: center;
  57. .text-item {
  58. height: 300rpx;
  59. width: 300rpx;
  60. border-radius: 50%;
  61. background-color: #1296db;
  62. display: flex;
  63. justify-content: center;
  64. align-items: center;
  65. color: #e8e8e8;
  66. font-weight: 600;
  67. letter-spacing: 5px;
  68. box-shadow: 5px 6px 10px #cccac6;
  69. }
  70. }
  71. .installition,
  72. .text {
  73. background-color: white;
  74. }
  75. }
  76. </style>
  77. <!-- <template>
  78. <view>
  79. <u-modal title="标题" :show="show" :content="content" closeOnClickOverlay showCancelButton>
  80. <u-button slot="confirmButton" text="通过" type="success" shape="circle" @click="show = false"></u-button>
  81. <u-button slot="confirmButton" text="不通过" type="error" shape="circle" @click="show = false"></u-button>
  82. </u-modal>
  83. <u-button @click="show = true">打开</u-button>
  84. </view>
  85. </template>
  86. <script>
  87. export default {
  88. data() {
  89. return {
  90. show: false,
  91. title: '标题',
  92. content: '你觉得有问题吗?'
  93. };
  94. },
  95. methods: {
  96. confirm() {
  97. this.show = false
  98. },
  99. cancel() {
  100. this.show = false
  101. }
  102. }
  103. };
  104. </script>
  105. <style lang="scss">
  106. .u-modal__button-group--confirm-button{
  107. flex-direction: revert !important;
  108. }
  109. </style> -->