TelemedPro/hgh_admin
8
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Inshal
2024-05-29 22:34:28 +05:00
commit e63fc41a20
1470 changed files with 174828 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
resources/js/views/charts/apex-chart/ApexChartAreaChart.vue Normal file
View File

@@ -0,0 +1,73 @@
<script setup>
import { useTheme } from 'vuetify'
import { getAreaChartSplineConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const chartConfig = computed(() => getAreaChartSplineConfig(vuetifyTheme.current.value))
const series = [
{
name: 'Visits',
data: [
100,
120,
90,
170,
130,
160,
140,
240,
220,
180,
270,
280,
375,
],
},
{
name: 'Clicks',
data: [
60,
80,
70,
110,
80,
100,
90,
180,
160,
140,
200,
220,
275,
],
},
{
name: 'Sales',
data: [
20,
40,
30,
70,
40,
60,
50,
140,
120,
100,
140,
180,
220,
],
},
]
</script>
<template>
<VueApexCharts
type="area"
height="400"
:options="chartConfig"
:series="series"
/>
</template>

36
resources/js/views/charts/apex-chart/ApexChartBalance.vue Normal file
View File

@@ -0,0 +1,36 @@
<script setup>
import { useTheme } from 'vuetify'
import { getLineChartSimpleConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const balanceChartConfig = computed(() => getLineChartSimpleConfig(vuetifyTheme.current.value))
const series = [{
data: [
280,
200,
220,
180,
270,
250,
70,
90,
200,
150,
160,
100,
150,
100,
50,
],
}]
</script>
<template>
<VueApexCharts
type="line"
height="400"
:options="balanceChartConfig"
:series="series"
/>
</template>

85
resources/js/views/charts/apex-chart/ApexChartDailySalesStates.vue Normal file
View File

@@ -0,0 +1,85 @@
<script setup>
import { useTheme } from 'vuetify'
import { getHeatMapChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const chartConfig = computed(() => getHeatMapChartConfig(vuetifyTheme.current.value))
const generateDataHeat = (count, yrange) => {
let i = 0
const series = []
while (i < count) {
const x = `w${ (i + 1).toString() }`
const y = Math.floor(Math.random() * (yrange.max - yrange.min + 1)) + yrange.min
series.push({
x,
y,
})
i += 1
}
return series
}
const series = [
{
name: 'SUN',
data: generateDataHeat(24, {
min: 0,
max: 60,
}),
},
{
name: 'MON',
data: generateDataHeat(24, {
min: 0,
max: 60,
}),
},
{
name: 'TUE',
data: generateDataHeat(24, {
min: 0,
max: 60,
}),
},
{
name: 'WED',
data: generateDataHeat(24, {
min: 0,
max: 60,
}),
},
{
name: 'THU',
data: generateDataHeat(24, {
min: 0,
max: 60,
}),
},
{
name: 'FRI',
data: generateDataHeat(24, {
min: 0,
max: 60,
}),
},
{
name: 'SAT',
data: generateDataHeat(24, {
min: 0,
max: 60,
}),
},
]
</script>
<template>
<VueApexCharts
type="heatmap"
height="350"
:options="chartConfig"
:series="series"
/>
</template>

47
resources/js/views/charts/apex-chart/ApexChartDataScience.vue Normal file
View File

@@ -0,0 +1,47 @@
<script setup>
import { useTheme } from 'vuetify'
import { getColumnChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const chartConfig = computed(() => getColumnChartConfig(vuetifyTheme.current.value))
const series = [
{
name: 'Apple',
data: [
90,
120,
55,
100,
80,
125,
175,
70,
88,
],
},
{
name: 'Samsung',
data: [
85,
100,
30,
40,
95,
90,
30,
110,
62,
],
},
]
</script>
<template>
<VueApexCharts
type="bar"
height="400"
:options="chartConfig"
:series="series"
/>
</template>

23
resources/js/views/charts/apex-chart/ApexChartExpenseRatio.vue Normal file
View File

@@ -0,0 +1,23 @@
<script setup>
import { useTheme } from 'vuetify'
import { getDonutChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const expenseRationChartConfig = computed(() => getDonutChartConfig(vuetifyTheme.current.value))
const series = [
85,
16,
50,
50,
]
</script>
<template>
<VueApexCharts
type="donut"
height="410"
:options="expenseRationChartConfig"
:series="series"
/>
</template>

28
resources/js/views/charts/apex-chart/ApexChartHorizontalBar.vue Normal file
View File

@@ -0,0 +1,28 @@
<script setup>
import { useTheme } from 'vuetify'
import { getBarChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const horizontalBarChartConfig = computed(() => getBarChartConfig(vuetifyTheme.current.value))
const series = [{
data: [
700,
350,
480,
600,
210,
550,
150,
],
}]
</script>
<template>
<VueApexCharts
type="bar"
height="400"
:options="horizontalBarChartConfig"
:series="series"
/>
</template>

46
resources/js/views/charts/apex-chart/ApexChartMobileComparison.vue Normal file
View File

@@ -0,0 +1,46 @@
<script setup>
import { useTheme } from 'vuetify'
import { getRadarChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const series = [
{
name: 'iPhone 12',
data: [
41,
64,
81,
60,
42,
42,
33,
23,
],
},
{
name: 'Samsung s20',
data: [
65,
46,
42,
25,
58,
63,
76,
43,
],
},
]
const chartConfig = computed(() => getRadarChartConfig(vuetifyTheme.current.value))
</script>
<template>
<VueApexCharts
type="radar"
height="400"
:options="chartConfig"
:series="series"
/>
</template>

178
resources/js/views/charts/apex-chart/ApexChartNewTechnologiesData.vue Normal file
View File

@@ -0,0 +1,178 @@
<script setup>
import { useTheme } from 'vuetify'
import { getScatterChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const scatterChartConfig = computed(() => getScatterChartConfig(vuetifyTheme.current.value))
const series = [
{
name: 'Angular',
data: [
{
x: 5.4,
y: 170,
},
{
x: 5.4,
y: 100,
},
{
x: 6.3,
y: 170,
},
{
x: 5.7,
y: 140,
},
{
x: 5.9,
y: 130,
},
{
x: 7,
y: 150,
},
{
x: 8,
y: 120,
},
{
x: 9,
y: 170,
},
{
x: 10,
y: 190,
},
{
x: 11,
y: 220,
},
{
x: 12,
y: 170,
},
{
x: 13,
y: 230,
},
],
},
{
name: 'Vue',
data: [
{
x: 14,
y: 220,
},
{
x: 15,
y: 280,
},
{
x: 16,
y: 230,
},
{
x: 18,
y: 320,
},
{
x: 17.5,
y: 280,
},
{
x: 19,
y: 250,
},
{
x: 20,
y: 350,
},
{
x: 20.5,
y: 320,
},
{
x: 20,
y: 320,
},
{
x: 19,
y: 280,
},
{
x: 17,
y: 280,
},
{
x: 22,
y: 300,
},
{
x: 18,
y: 120,
},
],
},
{
name: 'React',
data: [
{
x: 14,
y: 290,
},
{
x: 13,
y: 190,
},
{
x: 20,
y: 220,
},
{
x: 21,
y: 350,
},
{
x: 21.5,
y: 290,
},
{
x: 22,
y: 220,
},
{
x: 23,
y: 140,
},
{
x: 19,
y: 400,
},
{
x: 20,
y: 200,
},
{
x: 22,
y: 90,
},
{
x: 20,
y: 120,
},
],
},
]
</script>
<template>
<VueApexCharts
type="scatter"
height="400"
:options="scatterChartConfig"
:series="series"
/>
</template>

22
resources/js/views/charts/apex-chart/ApexChartStatistics.vue Normal file
View File

@@ -0,0 +1,22 @@
<script setup>
import { useTheme } from 'vuetify'
import { getRadialBarChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const statisticsChartConfig = computed(() => getRadialBarChartConfig(vuetifyTheme.current.value))
const series = [
80,
50,
35,
]
</script>
<template>
<VueApexCharts
type="radialBar"
height="400"
:options="statisticsChartConfig"
:series="series"
/>
</template>

147
resources/js/views/charts/apex-chart/ApexChartStocksPrices.vue Normal file
View File

@@ -0,0 +1,147 @@
<script setup>
import { useTheme } from 'vuetify'
import { getCandlestickChartConfig } from '@core/libs/apex-chart/apexCharConfig'
const vuetifyTheme = useTheme()
const chartConfig = computed(() => getCandlestickChartConfig(vuetifyTheme.current.value))
const series = [{
data: [
{
x: `7/12/${ new Date().getFullYear() }`,
y: [
150,
170,
50,
100,
],
},
{
x: `8/12/${ new Date().getFullYear() }`,
y: [
200,
400,
170,
330,
],
},
{
x: `9/12/${ new Date().getFullYear() }`,
y: [
330,
340,
250,
280,
],
},
{
x: `10/12/${ new Date().getFullYear() }`,
y: [
300,
330,
200,
320,
],
},
{
x: `11/12/${ new Date().getFullYear() }`,
y: [
320,
450,
280,
350,
],
},
{
x: `12/12/${ new Date().getFullYear() }`,
y: [
300,
350,
80,
250,
],
},
{
x: `13/12/${ new Date().getFullYear() }`,
y: [
200,
330,
170,
300,
],
},
{
x: `14/12/${ new Date().getFullYear() }`,
y: [
200,
220,
70,
130,
],
},
{
x: `15/12/${ new Date().getFullYear() }`,
y: [
220,
270,
180,
250,
],
},
{
x: `16/12/${ new Date().getFullYear() }`,
y: [
200,
250,
80,
100,
],
},
{
x: `17/12/${ new Date().getFullYear() }`,
y: [
150,
170,
50,
120,
],
},
{
x: `18/12/${ new Date().getFullYear() }`,
y: [
110,
450,
10,
420,
],
},
{
x: `19/12/${ new Date().getFullYear() }`,
y: [
400,
480,
300,
320,
],
},
{
x: `20/12/${ new Date().getFullYear() }`,
y: [
380,
480,
350,
450,
],
},
],
}]
</script>
<template>
<VueApexCharts
type="candlestick"
height="385"
:options="chartConfig"
:series="series"
/>
</template>