logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe git clone https://anongit.hacktivis.me/git/pleroma-fe.git/

user_reporting_modal.js (2922B)


  1. import Status from '../status/status.vue'
  2. import List from '../list/list.vue'
  3. import Checkbox from '../checkbox/checkbox.vue'
  4. import Modal from '../modal/modal.vue'
  5. import UserLink from '../user_link/user_link.vue'
  6. const UserReportingModal = {
  7. components: {
  8. Status,
  9. List,
  10. Checkbox,
  11. Modal,
  12. UserLink
  13. },
  14. data () {
  15. return {
  16. comment: '',
  17. forward: false,
  18. statusIdsToReport: [],
  19. processing: false,
  20. error: false
  21. }
  22. },
  23. computed: {
  24. reportModal () {
  25. return this.$store.state.reports.reportModal
  26. },
  27. isLoggedIn () {
  28. return !!this.$store.state.users.currentUser
  29. },
  30. isOpen () {
  31. return this.isLoggedIn && this.reportModal.activated
  32. },
  33. userId () {
  34. return this.reportModal.userId
  35. },
  36. user () {
  37. return this.$store.getters.findUser(this.userId)
  38. },
  39. remoteInstance () {
  40. return !this.user.is_local && this.user.screen_name.substr(this.user.screen_name.indexOf('@') + 1)
  41. },
  42. statuses () {
  43. return this.reportModal.statuses
  44. },
  45. preTickedIds () {
  46. return this.reportModal.preTickedIds
  47. }
  48. },
  49. watch: {
  50. userId: 'resetState',
  51. preTickedIds (newValue) {
  52. this.statusIdsToReport = newValue
  53. }
  54. },
  55. methods: {
  56. resetState () {
  57. // Reset state
  58. this.comment = ''
  59. this.forward = false
  60. this.statusIdsToReport = this.preTickedIds
  61. this.processing = false
  62. this.error = false
  63. },
  64. closeModal () {
  65. this.$store.dispatch('closeUserReportingModal')
  66. },
  67. reportUser () {
  68. this.processing = true
  69. this.error = false
  70. const params = {
  71. userId: this.userId,
  72. comment: this.comment,
  73. forward: this.forward,
  74. statusIds: this.statusIdsToReport
  75. }
  76. this.$store.state.api.backendInteractor.reportUser({ ...params })
  77. .then(() => {
  78. this.processing = false
  79. this.resetState()
  80. this.closeModal()
  81. })
  82. .catch(() => {
  83. this.processing = false
  84. this.error = true
  85. })
  86. },
  87. clearError () {
  88. this.error = false
  89. },
  90. isChecked (statusId) {
  91. return this.statusIdsToReport.indexOf(statusId) !== -1
  92. },
  93. toggleStatus (checked, statusId) {
  94. if (checked === this.isChecked(statusId)) {
  95. return
  96. }
  97. if (checked) {
  98. this.statusIdsToReport.push(statusId)
  99. } else {
  100. this.statusIdsToReport.splice(this.statusIdsToReport.indexOf(statusId), 1)
  101. }
  102. },
  103. resize (e) {
  104. const target = e.target || e
  105. if (!(target instanceof window.Element)) { return }
  106. // Auto is needed to make textbox shrink when removing lines
  107. target.style.height = 'auto'
  108. target.style.height = `${target.scrollHeight}px`
  109. if (target.value === '') {
  110. target.style.height = null
  111. }
  112. }
  113. }
  114. }
  115. export default UserReportingModal