Nueva estructura (435097c7) · Commits · Alfonso Rafael Solis Rangel / AgendaGobernador

resources/views/adminGen/catalogos/dependencias.blade.php

0 → 100644

+17 −0

Original line number	Diff line number	Diff line
		<x-layout.default>

		<script defer src="/assets/js/apexcharts.js"></script>
		<div x-data="analytics">
		<ul class="flex space-x-2 rtl:space-x-reverse">
		<li>
		<a href="javascript:;" class="text-primary hover:underline">Dashboard</a>
		</li>
		<li class="before:content-['/'] before:mr-1 rtl:before:ml-1">
		<span>Analytics</span>
		</li>
		</ul>
		<div class="pt-5">

		</div>
		</div>
		</x-layout.default>

resources/views/components/layout/default.blade.php

+432 −0

Original line number	Diff line number	Diff line
		@@ -113,6 +113,438 @@ class="btn btn-outline-primary rounded-full p-2 animate-pulse bg-[#fafafa] dark:
		<script defer src="/assets/js/alpine-focus.min.js"></script>
		<script defer src="/assets/js/alpine.min.js"></script>
		<script src="/assets/js/custom.js"></script>
		<script>
		document.addEventListener("alpine:init", () => {
		// total-visit
		Alpine.data("analytics", () => ({
		init() {
		isDark = this.$store.app.theme === "dark" \|\| this.$store.app.isDarkMode ? true :
		false;
		isRtl = this.$store.app.rtlClass === "rtl" ? true : false;

		const totalVisit = null;
		const paidVisit = null;
		const uniqueVisitorSeries = null;
		const followers = null;
		const referral = null;
		const engagement = null;

		// statistics
		setTimeout(() => {
		this.totalVisit = new ApexCharts(this.$refs.totalVisit, this
		.totalVisitOptions);
		this.totalVisit.render();

		this.paidVisit = new ApexCharts(this.$refs.paidVisit, this
		.paidVisitOptions);
		this.paidVisit.render();

		// unique visitors
		this.uniqueVisitorSeries = new ApexCharts(this.$refs
		.uniqueVisitorSeries, this.uniqueVisitorSeriesOptions);
		this.$refs.uniqueVisitorSeries.innerHTML = "";
		this.uniqueVisitorSeries.render();

		// followers
		this.followers = new ApexCharts(this.$refs.followers, this
		.followersOptions);
		this.followers.render();

		// referral
		this.referral = new ApexCharts(this.$refs.referral, this
		.referralOptions);
		this.referral.render();

		// engagement
		this.engagement = new ApexCharts(this.$refs.engagement, this
		.engagementOptions);
		this.engagement.render();
		}, 300);

		this.$watch('$store.app.theme', () => {
		isDark = this.$store.app.theme === "dark" \|\| this.$store.app
		.isDarkMode ? true : false;
		this.totalVisit.updateOptions(this.totalVisitOptions);
		this.paidVisit.updateOptions(this.paidVisitOptions);
		this.uniqueVisitorSeries.updateOptions(this.uniqueVisitorSeriesOptions);
		this.followers.updateOptions(this.followersOptions);
		this.referral.updateOptions(this.referralOptions);
		this.engagement.updateOptions(this.engagementOptions);
		});

		this.$watch('$store.app.rtlClass', () => {
		isRtl = this.$store.app.rtlClass === "rtl" ? true : false;
		this.uniqueVisitorSeries.updateOptions(this.uniqueVisitorSeriesOptions);
		});
		},

		// statistics
		get totalVisitOptions() {
		return {
		series: [{
		data: [21, 9, 36, 12, 44, 25, 59, 41, 66, 25]
		}],
		chart: {
		height: 58,
		type: 'line',
		fontFamily: 'Nunito, sans-serif',
		sparkline: {
		enabled: true
		},
		dropShadow: {
		enabled: true,
		blur: 3,
		color: '#009688',
		opacity: 0.4
		}
		},
		stroke: {
		curve: 'smooth',
		width: 2
		},
		colors: ['#009688'],
		grid: {
		padding: {
		top: 5,
		bottom: 5,
		left: 5,
		right: 5
		}
		},
		tooltip: {
		x: {
		show: false
		},
		y: {
		title: {
		formatter: formatter = () => {
		return '';
		},
		},
		},
		},
		}
		},

		//paid visit
		get paidVisitOptions() {
		return {
		series: [{
		data: [22, 19, 30, 47, 32, 44, 34, 55, 41, 69]
		}],
		chart: {
		height: 58,
		type: 'line',
		fontFamily: 'Nunito, sans-serif',
		sparkline: {
		enabled: true
		},
		dropShadow: {
		enabled: true,
		blur: 3,
		color: '#e2a03f',
		opacity: 0.4
		}
		},
		stroke: {
		curve: 'smooth',
		width: 2
		},
		colors: ['#e2a03f'],
		grid: {
		padding: {
		top: 5,
		bottom: 5,
		left: 5,
		right: 5
		}
		},
		tooltip: {
		x: {
		show: false
		},
		y: {
		title: {
		formatter: formatter = () => {
		return '';
		},
		},
		},
		},

		}
		},

		// unique visitors
		get uniqueVisitorSeriesOptions() {
		return {
		series: [{
		name: 'Direct',
		data: [58, 44, 55, 57, 56, 61, 58, 63, 60, 66, 56, 63]
		},
		{
		name: 'Organic',
		data: [91, 76, 85, 101, 98, 87, 105, 91, 114, 94, 66, 70]
		},
		],
		chart: {
		height: 360,
		type: 'bar',
		fontFamily: 'Nunito, sans-serif',
		toolbar: {
		show: false
		}
		},
		dataLabels: {
		enabled: false
		},
		stroke: {
		width: 2,
		colors: ['transparent']
		},
		colors: ['#5c1ac3', '#ffbb44'],
		dropShadow: {
		enabled: true,
		blur: 3,
		color: '#515365',
		opacity: 0.4,
		},
		plotOptions: {
		bar: {
		horizontal: false,
		columnWidth: '55%',
		borderRadius: 10
		}
		},
		legend: {
		position: 'bottom',
		horizontalAlign: 'center',
		fontSize: '14px',
		itemMargin: {
		horizontal: 8,
		vertical: 8
		}
		},
		grid: {
		borderColor: isDark ? '#191e3a' : '#e0e6ed',
		padding: {
		left: 20,
		right: 20
		}
		},
		xaxis: {
		categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug',
		'Sep', 'Oct', 'Nov', 'Dec'
		],
		axisBorder: {
		show: true,
		color: isDark ? '#3b3f5c' : '#e0e6ed'
		},
		},
		yaxis: {
		tickAmount: 6,
		opposite: isRtl ? true : false,
		labels: {
		offsetX: isRtl ? -10 : 0,
		}
		},
		fill: {
		type: 'gradient',
		gradient: {
		shade: isDark ? 'dark' : 'light',
		type: 'vertical',
		shadeIntensity: 0.3,
		inverseColors: false,
		opacityFrom: 1,
		opacityTo: 0.8,
		stops: [0, 100]
		},
		},
		tooltip: {
		marker: {
		show: true,
		},
		y: {
		formatter: (val) => {
		return val;
		},
		},
		},
		}
		},

		// followers
		get followersOptions() {
		return {
		series: [{
		data: [38, 60, 38, 52, 36, 40, 28]
		}],
		chart: {
		height: 160,
		type: 'area',
		fontFamily: 'Nunito, sans-serif',
		sparkline: {
		enabled: true
		}
		},
		stroke: {
		curve: 'smooth',
		width: 2
		},
		colors: ['#4361ee'],
		grid: {
		padding: {
		top: 5,
		}
		},
		yaxis: {
		show: false
		},
		tooltip: {
		x: {
		show: false
		},
		y: {
		title: {
		formatter: formatter = () => {
		return '';
		},
		},
		},
		},

		if (isDark) {
		option['fill'] = {
		type: 'gradient',
		gradient: {
		type: 'vertical',
		shadeIntensity: 1,
		inverseColors: !1,
		opacityFrom: 0.3,
		opacityTo: 0.05,
		stops: [100, 100]
		}
		};

		}
		}
		},

		// referral
		get referralOptions() {
		return {
		series: [{
		data: [60, 28, 52, 38, 40, 36, 38]
		}],
		chart: {
		height: 160,
		type: 'area',
		fontFamily: 'Nunito, sans-serif',
		sparkline: {
		enabled: true
		}
		},
		stroke: {
		curve: 'smooth',
		width: 2
		},
		colors: ['#e7515a'],
		grid: {
		padding: {
		top: 5,
		}
		},
		yaxis: {
		show: false
		},
		tooltip: {
		x: {
		show: false
		},
		y: {
		title: {
		formatter: formatter = () => {
		return '';
		},
		},
		},
		},

		if (isDark) {
		option['fill'] = {
		type: 'gradient',
		gradient: {
		type: 'vertical',
		shadeIntensity: 1,
		inverseColors: !1,
		opacityFrom: 0.3,
		opacityTo: 0.05,
		stops: [100, 100]
		}
		};
		}
		}
		},

		// engagement
		get engagementOptions() {
		return {
		series: [{
		name: 'Sales',
		data: [28, 50, 36, 60, 38, 52, 38]
		}],
		chart: {
		height: 160,
		type: 'area',
		fontFamily: 'Nunito, sans-serif',
		sparkline: {
		enabled: true
		}
		},
		stroke: {
		curve: 'smooth',
		width: 2
		},
		colors: ['#1abc9c'],
		grid: {
		padding: {
		top: 5,
		}
		},
		yaxis: {
		show: false
		},
		tooltip: {
		x: {
		show: false
		},
		y: {
		title: {
		formatter: formatter = () => {
		return '';
		},
		},
		},
		},

		if (isDark) {
		option['fill'] = {
		type: 'gradient',
		gradient: {
		type: 'vertical',
		shadeIntensity: 1,
		inverseColors: !1,
		opacityFrom: 0.3,
		opacityTo: 0.05,
		stops: [100, 100]
		}
		};
		}
		}
		}
		}));
		});
		</script>
		</body>

		</html>