npm eslint --fix .
This commit is contained in:
parent
6bea363b9d
commit
2c2b84d31d
56 changed files with 294 additions and 295 deletions
|
@ -4,39 +4,16 @@ import { getComponentProps } from '../../services/component_utils/component_util
|
|||
import './with_load_more.scss'
|
||||
|
||||
const withLoadMore = ({
|
||||
fetch, // function to fetch entries and return a promise
|
||||
select, // function to select data from store
|
||||
destroy, // function called at "destroyed" lifecycle
|
||||
childPropName = 'entries', // name of the prop to be passed into the wrapped component
|
||||
additionalPropNames = [] // additional prop name list of the wrapper component
|
||||
fetch, // function to fetch entries and return a promise
|
||||
select, // function to select data from store
|
||||
destroy, // function called at "destroyed" lifecycle
|
||||
childPropName = 'entries', // name of the prop to be passed into the wrapped component
|
||||
additionalPropNames = [] // additional prop name list of the wrapper component
|
||||
}) => (WrappedComponent) => {
|
||||
const originalProps = Object.keys(getComponentProps(WrappedComponent))
|
||||
const props = originalProps.filter(v => v !== childPropName).concat(additionalPropNames)
|
||||
|
||||
return Vue.component('withLoadMore', {
|
||||
render (createElement) {
|
||||
const props = {
|
||||
props: {
|
||||
...this.$props,
|
||||
[childPropName]: this.entries
|
||||
},
|
||||
on: this.$listeners,
|
||||
scopedSlots: this.$scopedSlots
|
||||
}
|
||||
const children = Object.entries(this.$slots).map(([key, value]) => createElement('template', { slot: key }, value))
|
||||
return (
|
||||
<div class="with-load-more">
|
||||
<WrappedComponent {...props}>
|
||||
{children}
|
||||
</WrappedComponent>
|
||||
<div class="with-load-more-footer">
|
||||
{this.error && <a onClick={this.fetchEntries} class="alert error">{this.$t('general.generic_error')}</a>}
|
||||
{!this.error && this.loading && <i class="icon-spin3 animate-spin"/>}
|
||||
{!this.error && !this.loading && !this.bottomedOut && <a onClick={this.fetchEntries}>{this.$t('general.more')}</a>}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
props,
|
||||
data () {
|
||||
return {
|
||||
|
@ -87,6 +64,29 @@ const withLoadMore = ({
|
|||
this.fetchEntries()
|
||||
}
|
||||
}
|
||||
},
|
||||
render (createElement) {
|
||||
const props = {
|
||||
props: {
|
||||
...this.$props,
|
||||
[childPropName]: this.entries
|
||||
},
|
||||
on: this.$listeners,
|
||||
scopedSlots: this.$scopedSlots
|
||||
}
|
||||
const children = Object.entries(this.$slots).map(([key, value]) => createElement('template', { slot: key }, value))
|
||||
return (
|
||||
<div class="with-load-more">
|
||||
<WrappedComponent {...props}>
|
||||
{children}
|
||||
</WrappedComponent>
|
||||
<div class="with-load-more-footer">
|
||||
{this.error && <a onClick={this.fetchEntries} class="alert error">{this.$t('general.generic_error')}</a>}
|
||||
{!this.error && this.loading && <i class="icon-spin3 animate-spin"/>}
|
||||
{!this.error && !this.loading && !this.bottomedOut && <a onClick={this.fetchEntries}>{this.$t('general.more')}</a>}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
@ -4,10 +4,10 @@ import { getComponentProps } from '../../services/component_utils/component_util
|
|||
import './with_subscription.scss'
|
||||
|
||||
const withSubscription = ({
|
||||
fetch, // function to fetch entries and return a promise
|
||||
select, // function to select data from store
|
||||
childPropName = 'content', // name of the prop to be passed into the wrapped component
|
||||
additionalPropNames = [] // additional prop name list of the wrapper component
|
||||
fetch, // function to fetch entries and return a promise
|
||||
select, // function to select data from store
|
||||
childPropName = 'content', // name of the prop to be passed into the wrapped component
|
||||
additionalPropNames = [] // additional prop name list of the wrapper component
|
||||
}) => (WrappedComponent) => {
|
||||
const originalProps = Object.keys(getComponentProps(WrappedComponent))
|
||||
const props = originalProps.filter(v => v !== childPropName).concat(additionalPropNames)
|
||||
|
@ -15,37 +15,8 @@ const withSubscription = ({
|
|||
return Vue.component('withSubscription', {
|
||||
props: [
|
||||
...props,
|
||||
'refresh' // boolean saying to force-fetch data whenever created
|
||||
'refresh' // boolean saying to force-fetch data whenever created
|
||||
],
|
||||
render (createElement) {
|
||||
if (!this.error && !this.loading) {
|
||||
const props = {
|
||||
props: {
|
||||
...this.$props,
|
||||
[childPropName]: this.fetchedData
|
||||
},
|
||||
on: this.$listeners,
|
||||
scopedSlots: this.$scopedSlots
|
||||
}
|
||||
const children = Object.entries(this.$slots).map(([key, value]) => createElement('template', { slot: key }, value))
|
||||
return (
|
||||
<div class="with-subscription">
|
||||
<WrappedComponent {...props}>
|
||||
{children}
|
||||
</WrappedComponent>
|
||||
</div>
|
||||
)
|
||||
} else {
|
||||
return (
|
||||
<div class="with-subscription-loading">
|
||||
{this.error
|
||||
? <a onClick={this.fetchData} class="alert error">{this.$t('general.generic_error')}</a>
|
||||
: <i class="icon-spin3 animate-spin"/>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
|
@ -77,6 +48,35 @@ const withSubscription = ({
|
|||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
render (createElement) {
|
||||
if (!this.error && !this.loading) {
|
||||
const props = {
|
||||
props: {
|
||||
...this.$props,
|
||||
[childPropName]: this.fetchedData
|
||||
},
|
||||
on: this.$listeners,
|
||||
scopedSlots: this.$scopedSlots
|
||||
}
|
||||
const children = Object.entries(this.$slots).map(([key, value]) => createElement('template', { slot: key }, value))
|
||||
return (
|
||||
<div class="with-subscription">
|
||||
<WrappedComponent {...props}>
|
||||
{children}
|
||||
</WrappedComponent>
|
||||
</div>
|
||||
)
|
||||
} else {
|
||||
return (
|
||||
<div class="with-subscription-loading">
|
||||
{this.error
|
||||
? <a onClick={this.fetchData} class="alert error">{this.$t('general.generic_error')}</a>
|
||||
: <i class="icon-spin3 animate-spin"/>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue