Remove no longer used js components
This commit is contained in:
parent
95f2126881
commit
d3e6b7fbab
@ -1,86 +0,0 @@
|
||||
import { shallowMount } from '@vue/test-utils'
|
||||
|
||||
import RequestsList from '../requests_list'
|
||||
|
||||
describe('RequestsList', () => {
|
||||
describe('isExtended', () => {
|
||||
it('should disallow sorting if not extended', () => {
|
||||
const wrapper = shallowMount(RequestsList, {
|
||||
propsData: { isExtended: false },
|
||||
})
|
||||
expect(wrapper.vm.sort.columnName).toEqual('')
|
||||
wrapper.vm.updateSortValue('full_name')
|
||||
expect(wrapper.vm.sort.columnName).toEqual('')
|
||||
})
|
||||
|
||||
it('should allow sorting when in extended mode', () => {
|
||||
const wrapper = shallowMount(RequestsList, {
|
||||
propsData: { isExtended: true },
|
||||
})
|
||||
expect(wrapper.vm.sort.columnName).toEqual('last_submission_timestamp')
|
||||
wrapper.vm.updateSortValue('full_name')
|
||||
expect(wrapper.vm.sort.columnName).toEqual('full_name')
|
||||
})
|
||||
})
|
||||
|
||||
describe('sorting', () => {
|
||||
const requests = [
|
||||
{
|
||||
name: 'X Wing',
|
||||
last_edited_timestamp: 'Mon, 2 Jan 2017 12:34:56 GMT',
|
||||
last_submission_timestamp: 'Mon, 2 Jan 2017 12:34:56 GMT',
|
||||
full_name: 'Luke Skywalker',
|
||||
annual_usage: '80000',
|
||||
status: 'Approved',
|
||||
dod_component: 'Rebels',
|
||||
},
|
||||
{
|
||||
name: 'TIE Fighter',
|
||||
last_edited_timestamp: 'Mon, 12 Nov 2018 12:34:56 GMT',
|
||||
last_submission_timestamp: 'Mon, 12 Nov 2018 12:34:56 GMT',
|
||||
full_name: 'Darth Vader',
|
||||
annual_usage: '999999',
|
||||
status: 'Approved',
|
||||
dod_component: 'Empire',
|
||||
},
|
||||
]
|
||||
|
||||
const mountWrapper = () =>
|
||||
shallowMount(RequestsList, { propsData: { requests, isExtended: true } })
|
||||
|
||||
it('should default to sorting by submission recency', () => {
|
||||
const wrapper = mountWrapper()
|
||||
const displayedRequests = wrapper.vm.filteredRequests
|
||||
const requestNames = displayedRequests.map(req => req.name)
|
||||
expect(requestNames).toEqual(['TIE Fighter', 'X Wing'])
|
||||
})
|
||||
|
||||
it('should reverse sort by submission time when selected', () => {
|
||||
const wrapper = mountWrapper()
|
||||
wrapper.vm.updateSortValue('last_submission_timestamp')
|
||||
const displayedRequests = wrapper.vm.filteredRequests
|
||||
const requestNames = displayedRequests.map(req => req.name)
|
||||
expect(requestNames).toEqual(['X Wing', 'TIE Fighter'])
|
||||
})
|
||||
|
||||
it('handles sorting with un-submitted requests', () => {
|
||||
const unsubmittedRequest = {
|
||||
name: 'Death Star',
|
||||
status: 'Started',
|
||||
last_submission_timestamp: null,
|
||||
}
|
||||
const wrapper = shallowMount(RequestsList, {
|
||||
propsData: {
|
||||
requests: [unsubmittedRequest, ...requests],
|
||||
isExtended: true,
|
||||
},
|
||||
})
|
||||
const displayedRequests = wrapper.vm.filteredRequests
|
||||
expect(displayedRequests).toEqual([
|
||||
requests[1],
|
||||
requests[0],
|
||||
unsubmittedRequest,
|
||||
])
|
||||
})
|
||||
})
|
||||
})
|
@ -1,34 +0,0 @@
|
||||
import textinput from '../text_input'
|
||||
import LocalDatetime from '../local_datetime'
|
||||
|
||||
export default {
|
||||
name: 'ccpo-approval',
|
||||
|
||||
components: {
|
||||
textinput,
|
||||
LocalDatetime,
|
||||
},
|
||||
|
||||
props: {
|
||||
initialState: String,
|
||||
},
|
||||
|
||||
data: function() {
|
||||
return {
|
||||
approving: this.initialState === 'approving',
|
||||
denying: this.initialState === 'denying',
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
setReview: function(e) {
|
||||
if (e.target.value === 'approving') {
|
||||
this.approving = true
|
||||
this.denying = false
|
||||
} else {
|
||||
this.approving = false
|
||||
this.denying = true
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
@ -1,64 +0,0 @@
|
||||
import createNumberMask from 'text-mask-addons/dist/createNumberMask'
|
||||
import { conformToMask } from 'vue-text-mask'
|
||||
|
||||
import FormMixin from '../../mixins/form'
|
||||
import textinput from '../text_input'
|
||||
import optionsinput from '../options_input'
|
||||
|
||||
export default {
|
||||
name: 'details-of-use',
|
||||
|
||||
mixins: [FormMixin],
|
||||
|
||||
components: {
|
||||
textinput,
|
||||
optionsinput,
|
||||
},
|
||||
|
||||
props: {
|
||||
initialData: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
},
|
||||
|
||||
data: function() {
|
||||
const {
|
||||
estimated_monthly_spend = 0,
|
||||
jedi_migration = '',
|
||||
technical_support_team = '',
|
||||
} = this.initialData
|
||||
|
||||
return {
|
||||
estimated_monthly_spend,
|
||||
jedi_migration,
|
||||
technical_support_team,
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
annualSpend: function() {
|
||||
const monthlySpend = this.estimated_monthly_spend || 0
|
||||
return monthlySpend * 12
|
||||
},
|
||||
annualSpendStr: function() {
|
||||
return this.formatDollars(this.annualSpend)
|
||||
},
|
||||
jediMigrationOptionSelected: function() {
|
||||
return this.jedi_migration !== ''
|
||||
},
|
||||
isJediMigration: function() {
|
||||
return this.jedi_migration === 'yes'
|
||||
},
|
||||
hasTechnicalSupportTeam: function() {
|
||||
return this.technical_support_team === 'yes'
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
formatDollars: function(intValue) {
|
||||
const mask = createNumberMask({ prefix: '$', allowDecimal: true })
|
||||
return conformToMask(intValue.toString(), mask).conformedValue
|
||||
},
|
||||
},
|
||||
}
|
@ -1,48 +0,0 @@
|
||||
import FormMixin from '../../mixins/form'
|
||||
import optionsinput from '../options_input'
|
||||
import textinput from '../text_input'
|
||||
import localdatetime from '../local_datetime'
|
||||
|
||||
export default {
|
||||
name: 'financial',
|
||||
|
||||
mixins: [FormMixin],
|
||||
|
||||
components: {
|
||||
optionsinput,
|
||||
textinput,
|
||||
localdatetime,
|
||||
},
|
||||
|
||||
props: {
|
||||
initialData: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
},
|
||||
|
||||
data: function() {
|
||||
const { funding_type = '' } = this.initialData
|
||||
|
||||
return {
|
||||
funding_type,
|
||||
shouldForceShowTaskOrder: false,
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
showTaskOrderUpload: function() {
|
||||
return (
|
||||
!this.initialData.legacy_task_order.pdf || this.shouldForceShowTaskOrder
|
||||
)
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
forceShowTaskOrderUpload: function(e) {
|
||||
console.log('forceShowTaskOrder', e)
|
||||
e.preventDefault()
|
||||
this.shouldForceShowTaskOrder = true
|
||||
},
|
||||
},
|
||||
}
|
@ -1,161 +0,0 @@
|
||||
import LocalDatetime from '../components/local_datetime'
|
||||
import { formatDollars } from '../lib/dollars'
|
||||
import { parse } from 'date-fns'
|
||||
import {
|
||||
compose,
|
||||
partial,
|
||||
indexBy,
|
||||
prop,
|
||||
propOr,
|
||||
sortBy,
|
||||
reverse,
|
||||
pipe,
|
||||
} from 'ramda'
|
||||
|
||||
export default {
|
||||
name: 'requests-list',
|
||||
|
||||
components: {
|
||||
LocalDatetime,
|
||||
},
|
||||
|
||||
props: {
|
||||
requests: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
isExtended: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
statuses: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
dodComponents: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
},
|
||||
|
||||
data: function() {
|
||||
const defaultSort = (sort, requests) =>
|
||||
sortBy(prop(sort.columnName), requests)
|
||||
const dateSort = (sort, requests) => {
|
||||
const parseDate = compose(
|
||||
partial(parse),
|
||||
propOr(sort.columnName, '')
|
||||
)
|
||||
return sortBy(parseDate, requests)
|
||||
}
|
||||
|
||||
const columnList = [
|
||||
{
|
||||
displayName: 'JEDI Cloud Request Name',
|
||||
attr: 'name',
|
||||
sortFunc: defaultSort,
|
||||
},
|
||||
{
|
||||
displayName: 'Date Request Submitted',
|
||||
attr: 'last_submission_timestamp',
|
||||
sortFunc: dateSort,
|
||||
},
|
||||
{
|
||||
displayName: 'Date Request Last Edited',
|
||||
attr: 'last_edited_timestamp',
|
||||
extendedOnly: true,
|
||||
sortFunc: dateSort,
|
||||
},
|
||||
{
|
||||
displayName: 'Requester',
|
||||
attr: 'full_name',
|
||||
extendedOnly: true,
|
||||
sortFunc: defaultSort,
|
||||
},
|
||||
{
|
||||
displayName: 'Applicationed Annual Usage ($)',
|
||||
attr: 'annual_usage',
|
||||
sortFunc: defaultSort,
|
||||
},
|
||||
{
|
||||
displayName: 'Request Status',
|
||||
attr: 'status',
|
||||
sortFunc: defaultSort,
|
||||
},
|
||||
{
|
||||
displayName: 'DOD Component',
|
||||
attr: 'dod_component',
|
||||
extendedOnly: true,
|
||||
sortFunc: defaultSort,
|
||||
},
|
||||
]
|
||||
|
||||
const defaultSortColumn = this.isExtended ? 'last_submission_timestamp' : ''
|
||||
return {
|
||||
searchValue: '',
|
||||
statusValue: '',
|
||||
dodComponentValue: '',
|
||||
sort: {
|
||||
columnName: defaultSortColumn,
|
||||
isAscending: false,
|
||||
},
|
||||
columns: indexBy(prop('attr'), columnList),
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
filteredRequests: function() {
|
||||
return pipe(
|
||||
partial(this.applySearch, [this.searchValue]),
|
||||
partial(this.applyFilters, [this.statusValue, this.dodComponentValue]),
|
||||
partial(this.applySort, [this.sort])
|
||||
)(this.requests)
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
getColumns: function() {
|
||||
return Object.values(this.columns).filter(
|
||||
column => !column.extendedOnly || this.isExtended
|
||||
)
|
||||
},
|
||||
applySearch: (query, requests) => {
|
||||
return requests.filter(request =>
|
||||
query !== ''
|
||||
? request.name.toLowerCase().includes(query.toLowerCase())
|
||||
: true
|
||||
)
|
||||
},
|
||||
applyFilters: (status, dodComponent, requests) => {
|
||||
return requests
|
||||
.filter(request => (status !== '' ? request.status === status : true))
|
||||
.filter(request =>
|
||||
dodComponent !== '' ? request.dod_component === dodComponent : true
|
||||
)
|
||||
},
|
||||
applySort: function(sort, requests) {
|
||||
if (sort.columnName === '') {
|
||||
return requests
|
||||
} else {
|
||||
const { sortFunc } = this.columns[sort.columnName]
|
||||
const sorted = sortFunc(sort, requests)
|
||||
return sort.isAscending ? sorted : reverse(sorted)
|
||||
}
|
||||
},
|
||||
dollars: value => formatDollars(value, false),
|
||||
updateSortValue: function(columnName) {
|
||||
if (!this.isExtended) {
|
||||
return
|
||||
}
|
||||
|
||||
// toggle ascending / descending if column is clicked twice
|
||||
if (columnName === this.sort.columnName) {
|
||||
this.sort.isAscending = !this.sort.isAscending
|
||||
}
|
||||
|
||||
this.sort.columnName = columnName
|
||||
},
|
||||
},
|
||||
|
||||
template: '<div></div>',
|
||||
}
|
@ -11,11 +11,9 @@ import optionsinput from './components/options_input'
|
||||
import multicheckboxinput from './components/multi_checkbox_input'
|
||||
import textinput from './components/text_input'
|
||||
import checkboxinput from './components/checkbox_input'
|
||||
import DetailsOfUse from './components/forms/details_of_use'
|
||||
import EditOfficerForm from './components/forms/edit_officer_form'
|
||||
import poc from './components/forms/poc'
|
||||
import oversight from './components/forms/oversight'
|
||||
import financial from './components/forms/financial'
|
||||
import toggler from './components/toggler'
|
||||
import NewApplication from './components/forms/new_application'
|
||||
import EditEnvironmentRole from './components/forms/edit_environment_role'
|
||||
@ -27,10 +25,8 @@ import selector from './components/selector'
|
||||
import BudgetChart from './components/charts/budget_chart'
|
||||
import SpendTable from './components/tables/spend_table'
|
||||
import TaskOrderList from './components/tables/task_order_list.js'
|
||||
import CcpoApproval from './components/forms/ccpo_approval'
|
||||
import MembersList from './components/members_list'
|
||||
import LocalDatetime from './components/local_datetime'
|
||||
import RequestsList from './components/requests_list'
|
||||
import ConfirmationPopover from './components/confirmation_popover'
|
||||
import { isNotInVerticalViewport } from './lib/viewport'
|
||||
import DateSelector from './components/date_selector'
|
||||
@ -51,21 +47,17 @@ const app = new Vue({
|
||||
multicheckboxinput,
|
||||
textinput,
|
||||
checkboxinput,
|
||||
DetailsOfUse,
|
||||
poc,
|
||||
oversight,
|
||||
financial,
|
||||
NewApplication,
|
||||
selector,
|
||||
BudgetChart,
|
||||
SpendTable,
|
||||
TaskOrderList,
|
||||
CcpoApproval,
|
||||
MembersList,
|
||||
LocalDatetime,
|
||||
EditEnvironmentRole,
|
||||
EditApplicationRoles,
|
||||
RequestsList,
|
||||
ConfirmationPopover,
|
||||
funding,
|
||||
uploadinput,
|
||||
|
Loading…
x
Reference in New Issue
Block a user