Untitled
unknown
javascript
3 years ago
3.4 kB
4
Indexable
import moment from 'moment' import BarChart from './BarChart.js' import mydata from '~/store/data.json' import information from '~/store/information.json' export default { name: 'Header', components: { BarChart }, data () { return { formvalid: true, input: '', prixtexte: '', min: moment().subtract(1, 'd'), text: '1', prix: 'test', link: '', active: false, datacollection: { labels: [], datasets: [] }, barChartOptions: { maintainAspectRatio: false, responsive: true, legend: { display: false }, title: { display: true, fontSize: 24, fontColor: '#6b7280' }, tooltips: { backgroundColor: '#17BF62', mode: 'x-axis', position: 'nearest', yAlign: 'bottom', xAlign: 'center', bodyAlign: 'center', displayColors: false, callbacks: { label (tooltipItems, data) { this.prixtexte = tooltipItems.yLabel return tooltipItems.yLabel + ' €' } } }, scales: { xAxes: [ { display: true, time: { unit: 'Areas' }, gridLines: { display: false }, ticks: { maxTicksLimit: 8, autoSkip: true, maxRotation: 0, autoSkipPadding: 6, display: true // this removed the labels on the x-axis } } ], yAxes: [ { display: true, ticks: { max: 12, min: 0, display: true }, gridLines: { display: false } } ] } } } }, mounted () { this.date() }, methods: { date (value) { if (value === 'day') { this.min = moment().subtract(1, 'd') } else if (value === 'week') { this.min = moment().subtract(1, 'w') } else if (value === 'month') { this.min = moment().subtract(4, 'w') } else if (value === 'all') { this.min = moment().subtract(1, 'y') } const mintobig = information.sort(function (a, b) { return new Date(a.date) - new Date(b.date) }) const priceinfo = mintobig.map(({ floorprice }) => floorprice) const max = moment() const result = information.filter((d) => { const time = new Date(d.date).getTime() return (this.min < time && time < max) }) const resultdate = result.map(({ date }) => moment(date).format('DD MMM')) this.datacollection = { labels: resultdate, datasets: [ { data: priceinfo, backgroundColor: '#8e59cb', pointBackgroundColor: 'white', pointBorderColor: 'white', pointHoverBackgroundColor: 'white', pointHoverBorderColor: 'white', borderColor: 'white', borderWidth: 2 } ] } }, } }
Editor is loading...