index.tsx 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. import { Dialog } from 'vant'
  2. import { defineComponent } from 'vue'
  3. import styles from './index.module.less'
  4. export default defineComponent({
  5. name: 'o-dialog',
  6. props: {
  7. show: {
  8. type: Boolean,
  9. default: false
  10. },
  11. message: {
  12. type: String,
  13. default: ''
  14. },
  15. title: {
  16. type: String,
  17. default: '提示'
  18. },
  19. confirmButtonText: {
  20. type: String,
  21. default: '确认'
  22. },
  23. cancelButtonText: {
  24. type: String,
  25. default: '取消'
  26. },
  27. showConfirmButton: {
  28. type: Boolean,
  29. default: true
  30. },
  31. showCancelButton: {
  32. type: Boolean,
  33. default: false
  34. }
  35. },
  36. emits: ['cancel', 'confirm'],
  37. setup(props, { slots, attrs, emit }) {
  38. return () => (
  39. <Dialog
  40. v-model:show={props.show}
  41. message={props.message}
  42. messageAlign="left"
  43. confirmButtonText={props.confirmButtonText}
  44. cancelButtonText={props.cancelButtonText}
  45. showConfirmButton={props.showConfirmButton}
  46. showCancelButton={props.showCancelButton}
  47. onConfirm={() => emit('confirm')}
  48. onCancel={() => emit('cancel')}
  49. >
  50. {{
  51. title: () => (
  52. <div class={styles.dialogTitle}>
  53. <i></i>
  54. {props.title}
  55. </div>
  56. )
  57. }}
  58. </Dialog>
  59. )
  60. }
  61. })