shexiangDialog.vue 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <template>
  2. <view>
  3. <uni-popup ref="commonPopup" :animation="false" :is-mask-click="false"
  4. mask-background-color="rgba(0, 0, 0, 0.4)">
  5. <view class="phone-common-dialog">
  6. <view class="common-body-box">
  7. <view class="common-title">{{title}}</view>
  8. <view class="common-content" :class="dialogContentClass">
  9. <view>
  10. <view class="content-margin-bottom">请在考试前使用摄像头测试功能,测试摄像头是否可以正常工作,在测试前请先确保摄像头设备可以正常使用,并赋予了小程序摄像头权限。</view>
  11. <view>若摄像头测试中图像显示异常,请及时更换手机,以免影响考试结果。</view>
  12. </view>
  13. </view>
  14. <view class="common-btn-box">
  15. <view class="confirm-btn" @click="confirmBtn">{{okBtn}}</view>
  16. </view>
  17. </view>
  18. </view>
  19. </uni-popup>
  20. </view>
  21. </template>
  22. <script setup>
  23. import { ref } from 'vue';
  24. const props = defineProps({
  25. title: {
  26. type: String,
  27. default: ''
  28. },
  29. content: {
  30. type: String,
  31. require: true,
  32. default: ''
  33. },
  34. dialogContentClass: {
  35. type: String,
  36. require: true,
  37. default: ''
  38. },
  39. notBtn: {
  40. type: String,
  41. require: true,
  42. default: '取消'
  43. },
  44. okBtn: {
  45. type: String,
  46. require: true,
  47. default: '确认'
  48. },
  49. });
  50. const commonPopup = ref(null); // 索引
  51. const $emit = defineEmits(['confirm-btn'])
  52. const platformType = uni.getSystemInfoSync().platform;
  53. // 打开弹窗
  54. function handleShow() {
  55. commonPopup.value.open();
  56. }
  57. // 取消
  58. function handleClose() {
  59. commonPopup.value.close();
  60. }
  61. // 确认
  62. function confirmBtn(){
  63. $emit('confirm-btn');
  64. commonPopup.value.close();
  65. }
  66. defineExpose({
  67. handleShow,
  68. handleClose
  69. })
  70. </script>
  71. <style>
  72. </style>