<template>
<div>
<DxDataGrid
id="gridContainer"
:data-source="dataSource"
:show-row-lines="true"
:show-column-lines="false"
:show-borders="true"
>
<DxSorting mode="none"/>
<DxPaging :page-size="10"/>
<DxColumn
:width="110"
data-field="date"
data-type="date"
/>
<DxColumn
caption="Open"
cell-template="diff-cell-template"
/>
<DxColumn
caption="Close"
cell-template="diff-cell-template"
/>
<DxColumn
:min-width="320"
caption="Dynamics"
cell-template="chart-cell-template"
/>
<DxColumn
caption="High"
cell-template="diff-cell-template"
/>
<DxColumn
caption="Low"
cell-template="diff-cell-template"
/>
<template #chart-cell-template="{ data }">
<ChartCell :cell-data="data.data.dayClose"/>
</template>
<template #diff-cell-template="{ data }">
<DiffCell :cell-data="data"/>
</template>
</DxDataGrid>
</div>
</template>
<script>
import {
DxDataGrid,
DxColumn,
DxSorting,
DxPaging
} from 'devextreme-vue/data-grid';
import service from './data.js';
import DiffCell from './DiffCell.vue';
import ChartCell from './ChartCell.vue';
export default {
components: {
DxDataGrid,
DxColumn,
DxSorting,
DxPaging,
DiffCell,
ChartCell
},
data() {
return {
dataSource: service.getWeekData()
};
}
};
</script>
<style scoped>
#gridContainer td {
vertical-align: middle;
}
#gridContainer .chart-cell {
overflow: visible;
}
#gridContainer .current-value {
display: inline-block;
}
#gridContainer .diff {
position: relative;
display: table-cell;
font-size: 16px;
}
#gridContainer .inc .diff {
color: #2ab71b;
}
#gridContainer .inc .diff:before {
content: '+';
}
#gridContainer .dec .diff:before {
content: '-';
}
#gridContainer .dec .diff {
color: #f00;
}
#gridContainer .inc .diff:after,
#gridContainer .dec .diff:after {
content: '';
display: block;
height: 10px;
width: 10px;
position: absolute;
right: -12px;
top: 6px;
background-repeat: no-repeat;
background-size: 10px 10px;
}
#gridContainer .inc .diff:after {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADKSURBVHjaYtTaLs1ABEiG0nPRJa56PEHhsxBhmCUQT4OyrwHxcXyKmQgYJgHE64CYDYrXQcXIMhCbAcgWkGzgNKh38QUB0QamIUUErkhKI9ZAGyCeTERkTYaqxWsgKA2txhdG6GGsvUNGGpeBRMUiGhCFGsqGzUBQQJsxkA5AemaiG5hDIBIIgQSgK0FmMDACs549kN5FZLjhA7+A2A2U9YSAOBeLAk4gnoBDczoOcSFGPIUDPxB/wCHHiKtwYGKgMhg1cBAaCBBgAJTUIL3ToPZfAAAAAElFTkSuQmCC');
}
#gridContainer .dec .diff:after {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADJSURBVHjaYvzPgBfgkhYA4o8QFahKmBioDEYNHIQGsgBxIBCLkqgvAYi/g1mMjMjir0EJzR6If/6HpChKMMgMe3DKBeIcKhiY8x/MYoDj+RQYNgdkGLqBbEB8kgzDToL1YjEQhKWB+BUJhj0H64Eahs1AELYhMpJ+gtUiGYbLQBBOI8LANLBaIg1kAAc0vkiAqSPBQFAkHcNi2DGoHMkGgrAENOCRI0ECRQ2JBoKwJTQCfkLZDPgMZPxPXN5NhtJzMSsJVBMAAgwAyWSY2svfmrwAAAAASUVORK5CYII=');
}
</style>
<template>
<div class="chart-cell">
<DxSparkline
:data-source="cellData"
:show-min-max="true"
:point-size="6"
argument-field="date"
value-field="close"
type="line"
min-color="#f00"
max-color="#2ab71b"
>
<DxSize
:width="290"
:height="40"
/>
<DxTooltip :enabled="false"/>
</DxSparkline>
</div>
</template>
<script>
import {
DxSparkline,
DxSize,
DxTooltip
} from 'devextreme-vue/sparkline';
export default {
components: {
DxSparkline,
DxSize,
DxTooltip
},
props: {
cellData: {
type: Array,
default: () => []
}
}
};
</script>
<template>
<div :class="className(cellData)">
<div class="current-value">{{ formatCurrency(cellData) }}</div>
<div class="diff">{{ fixed(abs(cellData), 2) }}</div>
</div>
</template>
<script>
import {
DxSparkline,
DxSize,
DxTooltip
} from 'devextreme-vue/sparkline';
import { formatNumber } from 'devextreme/localization';
const gridCellData = function(value) {
return value.data[value.column.caption.toLowerCase()];
};
export default {
components: {
DxSparkline,
DxSize,
DxTooltip
},
props: {
cellData: {
type: Object,
default: () => {}
}
},
methods: {
className(value) {
return gridCellData(value).diff > 0 ? 'inc' : 'dec';
},
formatCurrency(value) {
return formatNumber(gridCellData(value).value, { type: 'currency', currency: 'USD', precision: 2 });
},
abs(value) {
return Math.abs(gridCellData(value).diff);
},
fixed(value, precision) {
return value.toFixed(precision);
}
}
};
</script>
import { createApp } from 'vue';
import App from './App.vue';
createApp(App).mount('#app');
<!DOCTYPE html>
<html>
<head>
<title>DevExtreme Demo</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/20.2.5/css/dx.common.css" />
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/20.2.5/css/dx.light.css" />
<script src="https://unpkg.com/core-js@2.4.1/client/shim.min.js"></script>
<script src="https://unpkg.com/systemjs@0.21.3/dist/system.js"></script>
<script type="text/javascript" src="config.js"></script>
<script type="text/javascript">
System.import('./index.js');
</script>
</head>
<body class="dx-viewport">
<div class="demo-container">
<div id="app">
</div>
</div>
</body>
</html>
const weekData = [{
'date': new Date('2013/12/23'),
'open': {
'value': 3563.19,
'diff': 92.76
},
'high': {
'value': 3591.31,
'diff': 50.34
},
'low': {
'value': 3552.3,
'diff': 129.44
},
'close': {
'value': 3574.02,
'diff': 42.83
},
'volume': 1254340000,
'adjClose': 3574.02,
'dayClose': [{
'close': 3569.4,
'date': new Date('2013/12/23')
}, {
'close': 3572.8,
'date': new Date('2013/12/24')
}, {
'close': 3584.58,
'date': new Date('2013/12/26')
}, {
'close': 3574.02,
'date': new Date('2013/12/27')
}]
}, {
'date': new Date('2013/12/16'),
'open': {
'value': 3470.43,
'diff': -45.24
},
'high': {
'value': 3540.97,
'diff': 16.96
},
'low': {
'value': 3422.86,
'diff': -26.88
},
'close': {
'value': 3531.19,
'diff': 74.79
},
'volume': 2261352000,
'adjClose': 3531.19,
'dayClose': [{
'close': 3475.79,
'date': new Date('2013/12/16')
}, {
'close': 3469.32,
'date': new Date('2013/12/17')
}, {
'close': 3509.63,
'date': new Date('2013/12/18')
}, {
'close': 3498.63,
'date': new Date('2013/12/19')
}, {
'close': 3531.19,
'date': new Date('2013/12/20')
}]
}, {
'date': new Date('2013/12/09'),
'open': {
'value': 3515.67,
'diff': 19.48
},
'high': {
'value': 3524.01,
'diff': 12.91
},
'low': {
'value': 3449.74,
'diff': -3.48
},
'close': {
'value': 3456.4,
'diff': -47.86
},
'volume': 1802822000,
'adjClose': 3456.4,
'dayClose': [{
'close': 3516.17,
'date': new Date('2013/12/09')
}, {
'close': 3514.2,
'date': new Date('2013/12/10')
}, {
'close': 3468.99,
'date': new Date('2013/12/11')
}, {
'close': 3460.29,
'date': new Date('2013/12/12')
}, {
'close': 3456.4,
'date': new Date('2013/12/13')
}]
}, {
'date': new Date('2013/12/02'),
'open': {
'value': 3496.19,
'diff': 62.27
},
'high': {
'value': 3511.1,
'diff': 15.13
},
'low': {
'value': 3453.22,
'diff': 32.86
},
'close': {
'value': 3504.26,
'diff': 16.44
},
'volume': 1810088000,
'adjClose': 3504.26,
'dayClose': [{
'close': 3481.15,
'date': new Date('2013/12/02')
}, {
'close': 3479.34,
'date': new Date('2013/12/03')
}, {
'close': 3483.01,
'date': new Date('2013/12/04')
}, {
'close': 3477.73,
'date': new Date('2013/12/05')
}, {
'close': 3504.26,
'date': new Date('2013/12/06')
}]
}, {
'date': new Date('2013/11/25'),
'open': {
'value': 3433.92,
'diff': 10.45
},
'high': {
'value': 3495.97,
'diff': 66.77
},
'low': {
'value': 3420.36,
'diff': 61.05
},
'close': {
'value': 3487.82,
'diff': 65.8
},
'volume': 1508490000,
'adjClose': 3487.82,
'dayClose': [{
'close': 3427.49,
'date': new Date('2013/11/25')
}, {
'close': 3445.76,
'date': new Date('2013/11/26')
}, {
'close': 3470.48,
'date': new Date('2013/11/27')
}, {
'close': 3487.82,
'date': new Date('2013/11/29')
}]
}, {
'date': new Date('2013/11/18'),
'open': {
'value': 3423.47,
'diff': 63.64
},
'high': {
'value': 3429.2,
'diff': 6.62
},
'low': {
'value': 3359.31,
'diff': 12.9
},
'close': {
'value': 3422.02,
'diff': -0.56
},
'volume': 1742680000,
'adjClose': 3422.02,
'dayClose': [{
'close': 3388.87,
'date': new Date('2013/11/18')
}, {
'close': 3378.13,
'date': new Date('2013/11/19')
}, {
'close': 3367.17,
'date': new Date('2013/11/20')
}, {
'close': 3402.74,
'date': new Date('2013/11/21')
}, {
'close': 3422.02,
'date': new Date('2013/11/22')
}]
}, {
'date': new Date('2013/11/11'),
'open': {
'value': 3359.83,
'diff': -28.87
},
'high': {
'value': 3422.58,
'diff': 21.31
},
'low': {
'value': 3346.41,
'diff': 28.01
},
'close': {
'value': 3422.58,
'diff': 55.74
},
'volume': 1812784000,
'adjClose': 3422.58,
'dayClose': [{
'close': 3362.98,
'date': new Date('2013/11/11')
}, {
'close': 3365.23,
'date': new Date('2013/11/12')
}, {
'close': 3405.56,
'date': new Date('2013/11/13')
}, {
'close': 3415.14,
'date': new Date('2013/11/14')
}, {
'close': 3422.58,
'date': new Date('2013/11/15')
}]
}, {
'date': new Date('2013/11/04'),
'open': {
'value': 3388.7,
'diff': 6.52
},
'high': {
'value': 3401.27,
'diff': -7.01
},
'low': {
'value': 3318.4,
'diff': -46.25
},
'close': {
'value': 3366.84,
'diff': -12.92
},
'volume': 2011546000,
'adjClose': 3366.84,
'dayClose': [{
'close': 3384.75,
'date': new Date('2013/11/04')
}, {
'close': 3388.82,
'date': new Date('2013/11/05')
}, {
'close': 3385.38,
'date': new Date('2013/11/06')
}, {
'close': 3321.41,
'date': new Date('2013/11/07')
}, {
'close': 3366.84,
'date': new Date('2013/11/08')
}]
}, {
'date': new Date('2013/10/28'),
'open': {
'value': 3382.18,
'diff': 20.42
},
'high': {
'value': 3408.28,
'diff': 8.24
},
'low': {
'value': 3364.65,
'diff': 34.45
},
'close': {
'value': 3379.76,
'diff': -4.07
},
'volume': 1962860000,
'adjClose': 3379.76,
'dayClose': [{
'close': 3382.68,
'date': new Date('2013/10/28')
}, {
'close': 3391.75,
'date': new Date('2013/10/29')
}, {
'close': 3385.38,
'date': new Date('2013/10/30')
}, {
'close': 3377.73,
'date': new Date('2013/10/31')
}, {
'close': 3379.76,
'date': new Date('2013/11/01')
}]
}, {
'date': new Date('2013/10/21'),
'open': {
'value': 3361.76,
'diff': 148.38
},
'high': {
'value': 3400.04,
'diff': 44.41
},
'low': {
'value': 3330.2,
'diff': 118.15
},
'close': {
'value': 3383.83,
'diff': 29.95
},
'volume': 1952026000,
'adjClose': 3383.83,
'dayClose': [{
'close': 3361.18,
'date': new Date('2013/10/21')
}, {
'close': 3366.93,
'date': new Date('2013/10/22')
}, {
'close': 3346.05,
'date': new Date('2013/10/23')
}, {
'close': 3362.38,
'date': new Date('2013/10/24')
}, {
'close': 3383.83,
'date': new Date('2013/10/25')
}]
}, {
'date': new Date('2013/10/14'),
'open': {
'value': 3213.38,
'diff': -2.39
},
'high': {
'value': 3355.63,
'diff': 115.52
},
'low': {
'value': 3212.05,
'diff': 94.36
},
'close': {
'value': 3353.88,
'diff': 120.05
},
'volume': 1772590000,
'adjClose': 3353.88,
'dayClose': [{
'close': 3256.02,
'date': new Date('2013/10/14')
}, {
'close': 3244.66,
'date': new Date('2013/10/15')
}, {
'close': 3281.67,
'date': new Date('2013/10/16')
}, {
'close': 3301.28,
'date': new Date('2013/10/17')
}, {
'close': 3353.88,
'date': new Date('2013/10/18')
}]
}, {
'date': new Date('2013/10/07'),
'open': {
'value': 3215.77,
'diff': 25.37
},
'high': {
'value': 3240.11,
'diff': -16.6
},
'low': {
'value': 3117.69,
'diff': -69.17
},
'close': {
'value': 3233.83,
'diff': -8.74
},
'volume': 1891806000,
'adjClose': 3233.83,
'dayClose': [{
'close': 3215.69,
'date': new Date('2013/10/07')
}, {
'close': 3153.87,
'date': new Date('2013/10/08')
}, {
'close': 3142.54,
'date': new Date('2013/10/09')
}, {
'close': 3210.84,
'date': new Date('2013/10/10')
}, {
'close': 3233.83,
'date': new Date('2013/10/11')
}]
}, {
'date': new Date('2013/09/30'),
'open': {
'value': 3190.4,
'diff': -51.92
},
'high': {
'value': 3256.71,
'diff': 13.28
},
'low': {
'value': 3186.86,
'diff': -15.89
},
'close': {
'value': 3242.57,
'diff': 12.27
},
'volume': 1793200000,
'adjClose': 3242.57,
'dayClose': [{
'close': 3218.2,
'date': new Date('2013/09/30')
}, {
'close': 3253.05,
'date': new Date('2013/10/01')
}, {
'close': 3253.26,
'date': new Date('2013/10/02')
}, {
'close': 3213.83,
'date': new Date('2013/10/03')
}, {
'close': 3242.57,
'date': new Date('2013/10/04')
}]
}, {
'date': new Date('2013/09/23'),
'open': {
'value': 3242.32,
'diff': 39.13
},
'high': {
'value': 3243.43,
'diff': -5.09
},
'low': {
'value': 3202.75,
'diff': 39.62
},
'close': {
'value': 3230.3,
'diff': 5.57
},
'volume': 1775808000,
'adjClose': 3230.3,
'dayClose': [{
'close': 3219.34,
'date': new Date('2013/09/23')
}, {
'close': 3218.66,
'date': new Date('2013/09/24')
}, {
'close': 3208.55,
'date': new Date('2013/09/25')
}, {
'close': 3234.04,
'date': new Date('2013/09/26')
}, {
'close': 3230.3,
'date': new Date('2013/09/27')
}]
}, {
'date': new Date('2013/09/16'),
'open': {
'value': 3203.19,
'diff': 57.17
},
'high': {
'value': 3248.52,
'diff': 59.28
},
'low': {
'value': 3163.13,
'diff': 17.11
},
'close': {
'value': 3224.73,
'diff': 46.45
},
'volume': 1839474000,
'adjClose': 3224.73,
'dayClose': [{
'close': 3168.69,
'date': new Date('2013/09/16')
}, {
'close': 3190.83,
'date': new Date('2013/09/17')
}, {
'close': 3231.31,
'date': new Date('2013/09/18')
}, {
'close': 3237.61,
'date': new Date('2013/09/19')
}, {
'close': 3224.73,
'date': new Date('2013/09/20')
}]
}, {
'date': new Date('2013/09/09'),
'open': {
'value': 3146.02,
'diff': 48.37
},
'high': {
'value': 3189.24,
'diff': 40.25
},
'low': {
'value': 3146.02,
'diff': 68.89
},
'close': {
'value': 3178.28,
'diff': 44.9
},
'volume': 1668658000,
'adjClose': 3178.28,
'dayClose': [{
'close': 3169.93,
'date': new Date('2013/09/09')
}, {
'close': 3185.07,
'date': new Date('2013/09/10')
}, {
'close': 3179.86,
'date': new Date('2013/09/11')
}, {
'close': 3175.57,
'date': new Date('2013/09/12')
}, {
'close': 3178.28,
'date': new Date('2013/09/13')
}]
}, {
'date': new Date('2013/09/03'),
'open': {
'value': 3097.65,
'diff': -29.36
},
'high': {
'value': 3148.99,
'diff': 1.12
},
'low': {
'value': 3077.13,
'diff': 23.87
},
'close': {
'value': 3133.38,
'diff': 59.57
},
'volume': 1670570000,
'adjClose': 3133.38,
'dayClose': [{
'close': 3091.76,
'date': new Date('2013/09/03')
}, {
'close': 3124.54,
'date': new Date('2013/09/04')
}, {
'close': 3129.94,
'date': new Date('2013/09/05')
}, {
'close': 3133.38,
'date': new Date('2013/09/06')
}]
}, {
'date': new Date('2013/08/26'),
'open': {
'value': 3127.01,
'diff': 52.63
},
'high': {
'value': 3147.87,
'diff': 20.82
},
'low': {
'value': 3053.26,
'diff': -8.16
},
'close': {
'value': 3073.81,
'diff': -50.46
},
'volume': 1417628000,
'adjClose': 3073.81,
'dayClose': [{
'close': 3122.67,
'date': new Date('2013/08/26')
}, {
'close': 3059.58,
'date': new Date('2013/08/27')
}, {
'close': 3072.17,
'date': new Date('2013/08/28')
}, {
'close': 3093.36,
'date': new Date('2013/08/29')
}, {
'close': 3073.81,
'date': new Date('2013/08/30')
}]
}, {
'date': new Date('2013/08/19'),
'open': {
'value': 3074.38,
'diff': -32.68
},
'high': {
'value': 3127.05,
'diff': -22.19
},
'low': {
'value': 3061.42,
'diff': -6.65
},
'close': {
'value': 3124.27,
'diff': 50.36
},
'volume': 1305026000,
'adjClose': 3124.27,
'dayClose': [{
'close': 3069.76,
'date': new Date('2013/08/19')
}, {
'close': 3082.17,
'date': new Date('2013/08/20')
}, {
'close': 3071.47,
'date': new Date('2013/08/21')
}, {
'close': 3101.82,
'date': new Date('2013/08/22')
}, {
'close': 3124.27,
'date': new Date('2013/08/23')
}]
}, {
'date': new Date('2013/08/12'),
'open': {
'value': 3107.06,
'diff': -29.71
},
'high': {
'value': 3149.24,
'diff': 3.99
},
'low': {
'value': 3068.07,
'diff': -28.34
},
'close': {
'value': 3073.91,
'diff': -44.66
},
'volume': 1563892000,
'adjClose': 3073.91,
'dayClose': [{
'close': 3125.93,
'date': new Date('2013/08/12')
}, {
'close': 3141.06,
'date': new Date('2013/08/13')
}, {
'close': 3129.45,
'date': new Date('2013/08/14')
}, {
'close': 3076.23,
'date': new Date('2013/08/15')
}, {
'close': 3073.91,
'date': new Date('2013/08/16')
}]
}, {
'date': new Date('2013/08/05'),
'open': {
'value': 3136.77,
'diff': 69.29
},
'high': {
'value': 3145.25,
'diff': 1.73
},
'low': {
'value': 3096.41,
'diff': 33.5
},
'close': {
'value': 3118.57,
'diff': -24.95
},
'volume': 1565072000,
'adjClose': 3118.57,
'dayClose': [{
'close': 3143.19,
'date': new Date('2013/08/05')
}, {
'close': 3122.2,
'date': new Date('2013/08/06')
}, {
'close': 3118.69,
'date': new Date('2013/08/07')
}, {
'close': 3130.13,
'date': new Date('2013/08/08')
}, {
'close': 3118.57,
'date': new Date('2013/08/09')
}]
}, {
'date': new Date('2013/07/29'),
'open': {
'value': 3067.48,
'diff': 5.98
},
'high': {
'value': 3143.52,
'diff': 67.29
},
'low': {
'value': 3062.91,
'diff': 33.84
},
'close': {
'value': 3143.52,
'diff': 67.29
},
'volume': 1759648000,
'adjClose': 3143.52,
'dayClose': [{
'close': 3068.95,
'date': new Date('2013/07/29')
}, {
'close': 3085.33,
'date': new Date('2013/07/30')
}, {
'close': 3090.19,
'date': new Date('2013/07/31')
}, {
'close': 3126.3,
'date': new Date('2013/08/01')
}, {
'close': 3143.52,
'date': new Date('2013/08/02')
}]
}, {
'date': new Date('2013/07/22'),
'open': {
'value': 3061.5,
'diff': -15.52
},
'high': {
'value': 3076.23,
'diff': -14.98
},
'low': {
'value': 3029.07,
'diff': -6.92
},
'close': {
'value': 3076.23,
'diff': 31.3
},
'volume': 1796810000,
'adjClose': 3076.23,
'dayClose': [{
'close': 3055.23,
'date': new Date('2013/07/22')
}, {
'close': 3031.4,
'date': new Date('2013/07/23')
}, {
'close': 3041.16,
'date': new Date('2013/07/24')
}, {
'close': 3061.67,
'date': new Date('2013/07/25')
}, {
'close': 3076.23,
'date': new Date('2013/07/26')
}]
}, {
'date': new Date('2013/07/15'),
'open': {
'value': 3077.02,
'diff': 100.41
},
'high': {
'value': 3091.21,
'diff': 12.14
},
'low': {
'value': 3035.99,
'diff': 80.62
},
'close': {
'value': 3044.93,
'diff': -34.14
},
'volume': 1621772000,
'adjClose': 3044.93,
'dayClose': [{
'close': 3079.85,
'date': new Date('2013/07/15')
}, {
'close': 3077.47,
'date': new Date('2013/07/16')
}, {
'close': 3085.28,
'date': new Date('2013/07/17')
}, {
'close': 3077.82,
'date': new Date('2013/07/18')
}, {
'close': 3044.93,
'date': new Date('2013/07/19')
}]
}, {
'date': new Date('2013/07/08'),
'open': {
'value': 2976.61,
'diff': 43.13
},
'high': {
'value': 3079.07,
'diff': 115.25
},
'low': {
'value': 2955.37,
'diff': 41.89
},
'close': {
'value': 3079.07,
'diff': 115.85
},
'volume': 1616522000,
'adjClose': 3079.07,
'dayClose': [{
'close': 2966.13,
'date': new Date('2013/07/08')
}, {
'close': 2984.32,
'date': new Date('2013/07/09')
}, {
'close': 3000.66,
'date': new Date('2013/07/10')
}, {
'close': 3059.46,
'date': new Date('2013/07/11')
}, {
'close': 3079.07,
'date': new Date('2013/07/12')
}]
}, {
'date': new Date('2013/07/01'),
'open': {
'value': 2933.48,
'diff': 80.83
},
'high': {
'value': 2963.82,
'diff': 36.33
},
'low': {
'value': 2913.48,
'diff': 88.3
},
'close': {
'value': 2963.22,
'diff': 53.62
},
'volume': 1365580000,
'adjClose': 2963.22,
'dayClose': [{
'close': 2927.35,
'date': new Date('2013/07/01')
}, {
'close': 2929.63,
'date': new Date('2013/07/02')
}, {
'close': 2941.41,
'date': new Date('2013/07/03')
}, {
'close': 2963.22,
'date': new Date('2013/07/05')
}]
}, {
'date': new Date('2013/06/24'),
'open': {
'value': 2852.65,
'diff': -114.68
},
'high': {
'value': 2927.49,
'diff': -74.4
},
'low': {
'value': 2825.18,
'diff': -28.51
},
'close': {
'value': 2909.6,
'diff': 31.66
},
'volume': 2135946000,
'adjClose': 2909.6,
'dayClose': [{
'close': 2848.2,
'date': new Date('2013/06/24')
}, {
'close': 2866.5,
'date': new Date('2013/06/25')
}, {
'close': 2893.85,
'date': new Date('2013/06/26')
}, {
'close': 2906.84,
'date': new Date('2013/06/27')
}, {
'close': 2909.6,
'date': new Date('2013/06/28')
}]
}, {
'date': new Date('2013/06/17'),
'open': {
'value': 2967.33,
'diff': -27.7
},
'high': {
'value': 3001.89,
'diff': -2.78
},
'low': {
'value': 2853.69,
'diff': -60.51
},
'close': {
'value': 2877.94,
'diff': -65.92
},
'volume': 1973904000,
'adjClose': 2877.94,
'dayClose': [{
'close': 2971.26,
'date': new Date('2013/06/17')
}, {
'close': 2996.09,
'date': new Date('2013/06/18')
}, {
'close': 2959.5,
'date': new Date('2013/06/19')
}, {
'close': 2890.33,
'date': new Date('2013/06/20')
}, {
'close': 2877.94,
'date': new Date('2013/06/21')
}]
}, {
'date': new Date('2013/06/10'),
'open': {
'value': 2995.03,
'diff': 10.44
},
'high': {
'value': 3004.67,
'diff': -2.63
},
'low': {
'value': 2914.2,
'diff': 2.26
},
'close': {
'value': 2943.86,
'diff': -47.01
},
'volume': 1557972000,
'adjClose': 2943.86,
'dayClose': [{
'close': 2990.49,
'date': new Date('2013/06/10')
}, {
'close': 2959.84,
'date': new Date('2013/06/11')
}, {
'close': 2926.14,
'date': new Date('2013/06/12')
}, {
'close': 2962.9,
'date': new Date('2013/06/13')
}, {
'close': 2943.86,
'date': new Date('2013/06/14')
}]
}, {
'date': new Date('2013/06/03'),
'open': {
'value': 2984.59,
'diff': -39.79
},
'high': {
'value': 3007.3,
'diff': -29.7
},
'low': {
'value': 2911.94,
'diff': -67.96
},
'close': {
'value': 2990.87,
'diff': 9.11
},
'volume': 1837828000,
'adjClose': 2990.87,
'dayClose': [{
'close': 2990.79,
'date': new Date('2013/06/03')
}, {
'close': 2973.69,
'date': new Date('2013/06/04')
}, {
'close': 2937.14,
'date': new Date('2013/06/05')
}, {
'close': 2950.3,
'date': new Date('2013/06/06')
}, {
'close': 2990.87,
'date': new Date('2013/06/07')
}]
}, {
'date': new Date('2013/05/28'),
'open': {
'value': 3024.38,
'diff': 5.1
},
'high': {
'value': 3037,
'diff': -16.51
},
'low': {
'value': 2979.9,
'diff': 14.6
},
'close': {
'value': 2981.76,
'diff': -9.26
},
'volume': 1812077500,
'adjClose': 2981.76,
'dayClose': [{
'close': 3011.94,
'date': new Date('2013/05/28')
}, {
'close': 2994.82,
'date': new Date('2013/05/29')
}, {
'close': 3011.83,
'date': new Date('2013/05/30')
}, {
'close': 2981.76,
'date': new Date('2013/05/31')
}]
}, {
'date': new Date('2013/05/20'),
'open': {
'value': 3019.28,
'diff': 46.32
},
'high': {
'value': 3053.51,
'diff': 24.55
},
'low': {
'value': 2965.3,
'diff': -6.43
},
'close': {
'value': 2991.02,
'diff': -37.94
},
'volume': 1794250000,
'adjClose': 2991.02,
'dayClose': [{
'close': 3020.97,
'date': new Date('2013/05/20')
}, {
'close': 3026.45,
'date': new Date('2013/05/21')
}, {
'close': 2999.13,
'date': new Date('2013/05/22')
}, {
'close': 2991.45,
'date': new Date('2013/05/23')
}, {
'close': 2991.02,
'date': new Date('2013/05/24')
}]
}, {
'date': new Date('2013/05/13'),
'open': {
'value': 2972.96,
'diff': 24.06
},
'high': {
'value': 3028.96,
'diff': 47.94
},
'low': {
'value': 2971.73,
'diff': 29.48
},
'close': {
'value': 3028.96,
'diff': 47.94
},
'volume': 1810862000,
'adjClose': 3028.96,
'dayClose': [{
'close': 2982.09,
'date': new Date('2013/05/13')
}, {
'close': 2996.05,
'date': new Date('2013/05/14')
}, {
'close': 3002.62,
'date': new Date('2013/05/15')
}, {
'close': 2999.34,
'date': new Date('2013/05/16')
}, {
'close': 3028.96,
'date': new Date('2013/05/17')
}]
}, {
'date': new Date('2013/05/06'),
'open': {
'value': 2948.9,
'diff': 99.36
},
'high': {
'value': 2981.02,
'diff': 28.8
},
'low': {
'value': 2942.25,
'diff': 93.21
},
'close': {
'value': 2981.02,
'diff': 36.43
},
'volume': 1696512000,
'adjClose': 2981.02,
'dayClose': [{
'close': 2955.36,
'date': new Date('2013/05/06')
}, {
'close': 2952.88,
'date': new Date('2013/05/07')
}, {
'close': 2968.24,
'date': new Date('2013/05/08')
}, {
'close': 2961.12,
'date': new Date('2013/05/09')
}, {
'close': 2981.02,
'date': new Date('2013/05/10')
}]
}, {
'date': new Date('2013/04/29'),
'open': {
'value': 2849.54,
'diff': 57.77
},
'high': {
'value': 2952.22,
'diff': 91.53
},
'low': {
'value': 2849.04,
'diff': 68.22
},
'close': {
'value': 2944.59,
'diff': 104.04
},
'volume': 1793206000,
'adjClose': 2944.59,
'dayClose': [{
'close': 2866.95,
'date': new Date('2013/04/29')
}, {
'close': 2887.44,
'date': new Date('2013/04/30')
}, {
'close': 2873.35,
'date': new Date('2013/05/01')
}, {
'close': 2911.14,
'date': new Date('2013/05/02')
}, {
'close': 2944.59,
'date': new Date('2013/05/03')
}]
}, {
'date': new Date('2013/04/22'),
'open': {
'value': 2791.77,
'diff': -49.49
},
'high': {
'value': 2860.69,
'diff': 11.53
},
'low': {
'value': 2780.82,
'diff': 49.85
},
'close': {
'value': 2840.55,
'diff': 60.09
},
'volume': 1757180000,
'adjClose': 2840.55,
'dayClose': [{
'close': 2810.07,
'date': new Date('2013/04/22')
}, {
'close': 2835.37,
'date': new Date('2013/04/23')
}, {
'close': 2834.12,
'date': new Date('2013/04/24')
}, {
'close': 2848.66,
'date': new Date('2013/04/25')
}, {
'close': 2840.55,
'date': new Date('2013/04/26')
}]
}, {
'date': new Date('2013/04/15'),
'open': {
'value': 2841.26,
'diff': 68.96
},
'high': {
'value': 2849.16,
'diff': -14.5
},
'low': {
'value': 2730.97,
'diff': -33.37
},
'close': {
'value': 2780.46,
'diff': -76.02
},
'volume': 1740460000,
'adjClose': 2780.46,
'dayClose': [{
'close': 2797.47,
'date': new Date('2013/04/15')
}, {
'close': 2838.41,
'date': new Date('2013/04/16')
}, {
'close': 2781.98,
'date': new Date('2013/04/17')
}, {
'close': 2741.95,
'date': new Date('2013/04/18')
}, {
'close': 2780.46,
'date': new Date('2013/04/19')
}]
}, {
'date': new Date('2013/04/08'),
'open': {
'value': 2772.3,
'diff': -47.48
},
'high': {
'value': 2863.66,
'diff': 35.02
},
'low': {
'value': 2764.34,
'diff': 20.08
},
'close': {
'value': 2856.48,
'diff': 84.73
},
'volume': 1578374000,
'adjClose': 2856.48,
'dayClose': [{
'close': 2786.13,
'date': new Date('2013/04/08')
}, {
'close': 2804.67,
'date': new Date('2013/04/09')
}, {
'close': 2859.21,
'date': new Date('2013/04/10')
}, {
'close': 2859.07,
'date': new Date('2013/04/11')
}, {
'close': 2856.48,
'date': new Date('2013/04/12')
}]
}, {
'date': new Date('2013/04/01'),
'open': {
'value': 2819.78,
'diff': 9.03
},
'high': {
'value': 2828.64,
'diff': 7.97
},
'low': {
'value': 2744.26,
'diff': -34.52
},
'close': {
'value': 2771.75,
'diff': -46.94
},
'volume': 1589176000,
'adjClose': 2771.75,
'dayClose': [{
'close': 2797.07,
'date': new Date('2013/04/01')
}, {
'close': 2820.62,
'date': new Date('2013/04/02')
}, {
'close': 2795.04,
'date': new Date('2013/04/03')
}, {
'close': 2794.92,
'date': new Date('2013/04/04')
}, {
'close': 2771.75,
'date': new Date('2013/04/05')
}]
}, {
'date': new Date('2013/03/25'),
'open': {
'value': 2810.75,
'diff': 39.22
},
'high': {
'value': 2820.67,
'diff': 9.19
},
'low': {
'value': 2778.78,
'diff': 15.66
},
'close': {
'value': 2818.69,
'diff': 17.88
},
'volume': 1541860000,
'adjClose': 2818.69,
'dayClose': [{
'close': 2789.45,
'date': new Date('2013/03/25')
}, {
'close': 2806.5,
'date': new Date('2013/03/26')
}, {
'close': 2809.98,
'date': new Date('2013/03/27')
}, {
'close': 2818.69,
'date': new Date('2013/03/28')
}]
}, {
'date': new Date('2013/03/18'),
'open': {
'value': 2771.53,
'diff': -26.6
},
'high': {
'value': 2811.48,
'diff': -0.81
},
'low': {
'value': 2763.12,
'diff': -24.6
},
'close': {
'value': 2800.81,
'diff': 1.4
},
'volume': 1642786000,
'adjClose': 2800.81,
'dayClose': [{
'close': 2792.3,
'date': new Date('2013/03/18')
}, {
'close': 2787.27,
'date': new Date('2013/03/19')
}, {
'close': 2805.91,
'date': new Date('2013/03/20')
}, {
'close': 2774.85,
'date': new Date('2013/03/21')
}, {
'close': 2800.81,
'date': new Date('2013/03/22')
}]
}, {
'date': new Date('2013/03/11'),
'open': {
'value': 2798.13,
'diff': 59.92
},
'high': {
'value': 2812.29,
'diff': -0.44
},
'low': {
'value': 2787.72,
'diff': 52.8
},
'close': {
'value': 2799.41,
'diff': -4.7
},
'volume': 1767280000,
'adjClose': 2799.41,
'dayClose': [{
'close': 2811.86,
'date': new Date('2013/03/11')
}, {
'close': 2800.81,
'date': new Date('2013/03/12')
}, {
'close': 2798.68,
'date': new Date('2013/03/13')
}, {
'close': 2807.3,
'date': new Date('2013/03/14')
}, {
'close': 2799.41,
'date': new Date('2013/03/15')
}]
}, {
'date': new Date('2013/03/04'),
'open': {
'value': 2738.21,
'diff': -17.98
},
'high': {
'value': 2812.73,
'diff': 48.77
},
'low': {
'value': 2734.92,
'diff': 45.09
},
'close': {
'value': 2804.11,
'diff': 56.36
},
'volume': 1732232000,
'adjClose': 2804.11,
'dayClose': [{
'close': 2759.53,
'date': new Date('2013/03/04')
}, {
'close': 2799.25,
'date': new Date('2013/03/05')
}, {
'close': 2792.56,
'date': new Date('2013/03/06')
}, {
'close': 2799.49,
'date': new Date('2013/03/07')
}, {
'close': 2804.11,
'date': new Date('2013/03/08')
}]
}, {
'date': new Date('2013/02/25'),
'open': {
'value': 2756.19,
'diff': -14.51
},
'high': {
'value': 2763.96,
'diff': -18.9
},
'low': {
'value': 2689.83,
'diff': -10.49
},
'close': {
'value': 2747.75,
'diff': 10.47
},
'volume': 1879756000,
'adjClose': 2747.75,
'dayClose': [{
'close': 2700.97,
'date': new Date('2013/02/25')
}, {
'close': 2713.02,
'date': new Date('2013/02/26')
}, {
'close': 2741.26,
'date': new Date('2013/02/27')
}, {
'close': 2738.58,
'date': new Date('2013/02/28')
}, {
'close': 2747.75,
'date': new Date('2013/03/01')
}]
}, {
'date': new Date('2013/02/19'),
'open': {
'value': 2770.7,
'diff': -3.74
},
'high': {
'value': 2782.86,
'diff': -0.33
},
'low': {
'value': 2700.32,
'diff': -56.11
},
'close': {
'value': 2737.28,
'diff': -27.39
},
'volume': 1869942500,
'adjClose': 2737.28,
'dayClose': [{
'close': 2782.86,
'date': new Date('2013/02/19')
}, {
'close': 2739.99,
'date': new Date('2013/02/20')
}, {
'close': 2711.51,
'date': new Date('2013/02/21')
}, {
'close': 2737.28,
'date': new Date('2013/02/22')
}]
}, {
'date': new Date('2013/02/11'),
'open': {
'value': 2774.44,
'diff': 25.04
},
'high': {
'value': 2783.19,
'diff': 3.06
},
'low': {
'value': 2756.43,
'diff': 40.92
},
'close': {
'value': 2764.67,
'diff': -10.89
},
'volume': 1788838000,
'adjClose': 2764.67,
'dayClose': [{
'close': 2774.64,
'date': new Date('2013/02/11')
}, {
'close': 2762.62,
'date': new Date('2013/02/12')
}, {
'close': 2773.77,
'date': new Date('2013/02/13')
}, {
'close': 2771.43,
'date': new Date('2013/02/14')
}, {
'close': 2764.67,
'date': new Date('2013/02/15')
}]
}, {
'date': new Date('2013/02/04'),
'open': {
'value': 2749.4,
'diff': 11.78
},
'high': {
'value': 2780.13,
'diff': 11.5
},
'low': {
'value': 2715.51,
'diff': -7.01
},
'close': {
'value': 2775.56,
'diff': 11.6
},
'volume': 1960002000,
'adjClose': 2775.56,
'dayClose': [{
'close': 2715.68,
'date': new Date('2013/02/04')
}, {
'close': 2754.99,
'date': new Date('2013/02/05')
}, {
'close': 2746.35,
'date': new Date('2013/02/06')
}, {
'close': 2746.5,
'date': new Date('2013/02/07')
}, {
'close': 2775.56,
'date': new Date('2013/02/08')
}]
}, {
'date': new Date('2013/01/28'),
'open': {
'value': 2737.62,
'diff': -6.65
},
'high': {
'value': 2768.63,
'diff': -0.68
},
'low': {
'value': 2722.52,
'diff': 2.69
},
'close': {
'value': 2763.96,
'diff': 27.23
},
'volume': 2040876000,
'adjClose': 2763.96,
'dayClose': [{
'close': 2742.43,
'date': new Date('2013/01/28')
}, {
'close': 2743.58,
'date': new Date('2013/01/29')
}, {
'close': 2738.71,
'date': new Date('2013/01/30')
}, {
'close': 2731.53,
'date': new Date('2013/01/31')
}, {
'close': 2763.96,
'date': new Date('2013/02/01')
}]
}, {
'date': new Date('2013/01/22'),
'open': {
'value': 2744.27,
'diff': 10.81
},
'high': {
'value': 2769.31,
'diff': 12.63
},
'low': {
'value': 2719.83,
'diff': 9.03
},
'close': {
'value': 2736.73,
'diff': -6.51
},
'volume': 1864040000,
'adjClose': 2736.73,
'dayClose': [{
'close': 2746.19,
'date': new Date('2013/01/22')
}, {
'close': 2762.17,
'date': new Date('2013/01/23')
}, {
'close': 2723.53,
'date': new Date('2013/01/24')
}, {
'close': 2736.73,
'date': new Date('2013/01/25')
}]
}, {
'date': new Date('2013/01/14'),
'open': {
'value': 2733.46,
'diff': 20.02
},
'high': {
'value': 2756.68,
'diff': 7.32
},
'low': {
'value': 2710.8,
'diff': 7.05
},
'close': {
'value': 2743.24,
'diff': -5.02
},
'volume': 1809576000,
'adjClose': 2743.24,
'dayClose': [{
'close': 2735.7,
'date': new Date('2013/01/14')
}, {
'close': 2722.98,
'date': new Date('2013/01/15')
}, {
'close': 2734.73,
'date': new Date('2013/01/16')
}, {
'close': 2747.15,
'date': new Date('2013/01/17')
}, {
'close': 2743.24,
'date': new Date('2013/01/18')
}]
}, {
'date': new Date('2013/01/07'),
'open': {
'value': 2713.44,
'diff': -14.23
},
'high': {
'value': 2749.36,
'diff': -1.46
},
'low': {
'value': 2703.75,
'diff': -12.29
},
'close': {
'value': 2748.26,
'diff': 23.77
},
'volume': 1741254000,
'adjClose': 2748.26,
'dayClose': [{
'close': 2724.22,
'date': new Date('2013/01/07')
}, {
'close': 2718.72,
'date': new Date('2013/01/08')
}, {
'close': 2727.65,
'date': new Date('2013/01/09')
}, {
'close': 2744.18,
'date': new Date('2013/01/10')
}, {
'close': 2748.26,
'date': new Date('2013/01/11')
}]
}];
export default {
getWeekData() {
return weekData;
}
};
System.config({
transpiler: 'plugin-babel',
meta: {
'*.vue': {
loader: 'vue-loader'
},
'devextreme/localization.js': {
"esModule": true
},
},
paths: {
'npm:': 'https://unpkg.com/'
},
map: {
'vue': 'npm:vue@3.0.0/dist/vue.esm-browser.js',
'vue-loader': 'npm:dx-systemjs-vue-browser@1.0.15/index.js',
'globalize': 'npm:globalize@1.1.1/dist/globalize',
'json': 'npm:systemjs-plugin-json@0.3.0/json.js',
'cldr': 'npm:cldrjs@0.4.4/dist/cldr',
'mitt': 'npm:mitt/dist/mitt.umd.js',
'rrule': 'npm:rrule@2.6.6/dist/es5/rrule.js',
'luxon': 'npm:luxon@1.25.0/build/global/luxon.min.js',
'es6-object-assign': 'npm:es6-object-assign@1.1.0',
'devextreme': 'npm:devextreme@20.2.5',
'devextreme-vue': 'npm:devextreme-vue@20.2.5',
'jszip': 'npm:jszip@3.5.0/dist/jszip.min.js',
'devextreme-quill': 'npm:devextreme-quill@0.9.8/dist/dx-quill.min.js',
'devexpress-diagram': 'npm:devexpress-diagram@2.0.11/dist/dx-diagram.js',
'devexpress-gantt': 'npm:devexpress-gantt@2.0.18/dist/dx-gantt.js',
'preact': 'npm:preact@10.5.11/dist/preact.js',
'preact/hooks': 'npm:preact@10.5.11/hooks/dist/hooks.js',
'plugin-babel': 'npm:systemjs-plugin-babel@0.0.25/plugin-babel.js',
'systemjs-babel-build': 'npm:systemjs-plugin-babel@0.0.25/systemjs-babel-browser.js'
},
packages: {
'devextreme-vue': {
main: 'index.js'
},
'devextreme': {
defaultExtension: 'js'
},
'devextreme/events/utils': {
main: 'index'
},
'devextreme/events': {
main: 'index'
},
'globalize': {
main: '../globalize.js',
defaultExtension: 'js'
},
'cldr': {
main: '../cldr.js',
defaultExtension: 'js'
},
'es6-object-assign': {
main: './index.js',
defaultExtension: 'js'
}
},
babelOptions: {
sourceMaps: false,
stage0: true
}
});