chore: format
This commit is contained in:
parent
ca582dd743
commit
411a3cfd99
|
@ -2,9 +2,9 @@
|
||||||
import {computed, nextTick, ref, watch} from 'vue'
|
import {computed, nextTick, ref, watch} from 'vue'
|
||||||
import {useAutoHeightTextarea} from '@/composables/useAutoHeightTextarea'
|
import {useAutoHeightTextarea} from '@/composables/useAutoHeightTextarea'
|
||||||
import DatepickerWithValues from '@/components/date/datepickerWithValues.vue'
|
import DatepickerWithValues from '@/components/date/datepickerWithValues.vue'
|
||||||
import UserService from "@/services/user";
|
import UserService from '@/services/user'
|
||||||
import {getAvatarUrl, getDisplayName} from "@/models/user";
|
import {getAvatarUrl, getDisplayName} from '@/models/user'
|
||||||
import {createRandomID} from "@/helpers/randomId";
|
import {createRandomID} from '@/helpers/randomId'
|
||||||
|
|
||||||
const {
|
const {
|
||||||
modelValue,
|
modelValue,
|
||||||
|
@ -84,46 +84,46 @@ function unEscapeHtml(unsafe: string): string {
|
||||||
.replace(/</g, '<')
|
.replace(/</g, '<')
|
||||||
.replace(/>/g, '>')
|
.replace(/>/g, '>')
|
||||||
.replace(/"/g, '"')
|
.replace(/"/g, '"')
|
||||||
.replace(/'/g, "'")
|
.replace(/'/g, '\'')
|
||||||
}
|
}
|
||||||
|
|
||||||
const highlightedFilterQuery = computed(() => {
|
const highlightedFilterQuery = computed(() => {
|
||||||
let highlighted = escapeHtml(filterQuery.value)
|
let highlighted = escapeHtml(filterQuery.value)
|
||||||
dateFields
|
dateFields
|
||||||
.forEach(o => {
|
.forEach(o => {
|
||||||
const pattern = new RegExp(o + '(\\s*)(<|>|<=|>=|=|!=)(\\s*)([\'"]?)([^\'"\\s]+\\1?)?', 'ig');
|
const pattern = new RegExp(o + '(\\s*)(<|>|<=|>=|=|!=)(\\s*)([\'"]?)([^\'"\\s]+\\1?)?', 'ig')
|
||||||
highlighted = highlighted.replaceAll(pattern, (match, spacesBefore, token, spacesAfter, start, value, position) => {
|
highlighted = highlighted.replaceAll(pattern, (match, spacesBefore, token, spacesAfter, start, value, position) => {
|
||||||
if (typeof value === 'undefined') {
|
if (typeof value === 'undefined') {
|
||||||
value = ''
|
value = ''
|
||||||
}
|
}
|
||||||
|
|
||||||
return `${o}${spacesBefore}${token}${spacesAfter}<button class="is-primary filter-query__date_value" data-position="${position}">${value}</button><span class="filter-query__date_value_placeholder">${value}</span>`
|
return `${o}${spacesBefore}${token}${spacesAfter}<button class="is-primary filter-query__date_value" data-position="${position}">${value}</button><span class="filter-query__date_value_placeholder">${value}</span>`
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
assigneeFields
|
assigneeFields
|
||||||
.forEach(f => {
|
.forEach(f => {
|
||||||
const pattern = new RegExp(f + '\\s*(<|>|<=|>=|=|!=)\\s*([\'"]?)([^\'"\\s]+\\1?)?', 'ig');
|
const pattern = new RegExp(f + '\\s*(<|>|<=|>=|=|!=)\\s*([\'"]?)([^\'"\\s]+\\1?)?', 'ig')
|
||||||
highlighted = highlighted.replaceAll(pattern, (match, token, start, value) => {
|
highlighted = highlighted.replaceAll(pattern, (match, token, start, value) => {
|
||||||
if (typeof value === 'undefined') {
|
if (typeof value === 'undefined') {
|
||||||
value = ''
|
value = ''
|
||||||
}
|
}
|
||||||
|
|
||||||
const id = createRandomID(32)
|
const id = createRandomID(32)
|
||||||
|
|
||||||
userService.getAll({}, {s: value}).then(users => {
|
userService.getAll({}, {s: value}).then(users => {
|
||||||
if (users.length > 0) {
|
if (users.length > 0) {
|
||||||
const displayName = getDisplayName(users[0])
|
const displayName = getDisplayName(users[0])
|
||||||
const nameTag = document.createElement('span')
|
const nameTag = document.createElement('span')
|
||||||
nameTag.innerText = displayName
|
nameTag.innerText = displayName
|
||||||
|
|
||||||
const avatar = document.createElement('img')
|
const avatar = document.createElement('img')
|
||||||
avatar.src = getAvatarUrl(users[0], 20)
|
avatar.src = getAvatarUrl(users[0], 20)
|
||||||
avatar.height = 20
|
avatar.height = 20
|
||||||
avatar.width = 20
|
avatar.width = 20
|
||||||
avatar.alt = displayName
|
avatar.alt = displayName
|
||||||
|
|
||||||
// TODO: caching
|
// TODO: caching
|
||||||
|
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
const assigneeValue = document.getElementById(id)
|
const assigneeValue = document.getElementById(id)
|
||||||
assigneeValue.innerText = ''
|
assigneeValue.innerText = ''
|
||||||
|
@ -132,7 +132,7 @@ const highlightedFilterQuery = computed(() => {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
return `${f} ${token} <span class="filter-query__assignee_value" id="${id}">${value}<span>`
|
return `${f} ${token} <span class="filter-query__assignee_value" id="${id}">${value}<span>`
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
@ -175,12 +175,12 @@ watch(
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
{immediate: true}
|
{immediate: true},
|
||||||
)
|
)
|
||||||
|
|
||||||
function updateDateInQuery(newDate: string) {
|
function updateDateInQuery(newDate: string) {
|
||||||
// Need to escape and unescape the query because the positions are based on the escaped query
|
// Need to escape and unescape the query because the positions are based on the escaped query
|
||||||
let escaped = escapeHtml(filterQuery.value)
|
let escaped = escapeHtml(filterQuery.value)
|
||||||
escaped = escaped
|
escaped = escaped
|
||||||
.substring(0, currentDatepickerPos.value)
|
.substring(0, currentDatepickerPos.value)
|
||||||
+ escaped
|
+ escaped
|
||||||
|
@ -238,7 +238,7 @@ function updateDateInQuery(newDate: string) {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
color: transparent;
|
color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.filter-query__assignee_value {
|
&.filter-query__assignee_value {
|
||||||
padding: .125rem .25rem;
|
padding: .125rem .25rem;
|
||||||
border-radius: $radius;
|
border-radius: $radius;
|
||||||
|
@ -246,7 +246,7 @@ function updateDateInQuery(newDate: string) {
|
||||||
color: var(--grey-700);
|
color: var(--grey-700);
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
> img {
|
> img {
|
||||||
margin-right: .25rem;
|
margin-right: .25rem;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue