logo

pleroma-fe

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