WI/Web.V1.0.git

			@@ -1,80 +1,85 @@
			<!DOCTYPE html>
			<html lang="en">
			<head>
			<meta charset="UTF-8" />
			<meta name="viewport" content="width=device-width, initial-scale=1.0" />
			<title>类型分布</title>
			<script src="/customer_list/ch/static/js/tailwind.js"></script>
			<script src="/customer_list/ch/static/js/vue.global.js"></script>
			<link href="/customer_list/ch/static/fonts/iconfont/iconfont.css" rel="stylesheet" type="text/css"></link>
			<script src="/customer_list/ch/static/js/echarts.min.js"></script>
			</head>
			<body>
			<div class="w-full h-full bg-[#fff] px-10 py-0" id="unionPay">
			<div class="w-full h-[40px] flex items-center">银联缴费类型占比</div>
			<div class="h-full w-full" id="UnionPayChart">

			</div>

			<head>
			<meta charset="UTF-8" />
			<meta name="viewport" content="width=device-width, initial-scale=1.0" />
			<title>类型分布</title>
			<script src="/customer_list/ch/ai_html/views/demo/js/tailwind.js"></script>
			<script src="/customer_list/ch/ai_html/views/demo/js/vue.global.js"></script>
			<script src="/customer_list/ch/ai_html/views/demo/js/iframe-resizer/child-5.1.5.js" async></script>
			<link href="/customer_list/ch/static/fonts/iconfont/iconfont.css" rel="stylesheet" type="text/css">
			</link>
			<script src="/customer_list/ch/static/js/echarts.min.js"></script>
			</head>

			<body>
			<div class="w-full h-full bg-[#fff] px-10 py-0" id="unionPay">
			<div class="w-full h-[40px] flex items-center">银联缴费类型占比</div>
			<div class="w-full h-[370px]" id="UnionPayChart">
			</div>
			</body>
			<script>
			const { createApp, onMounted, ref, reactive } = Vue;
			createApp({
			setup() {
			</div>
			</body>
			<script>
			const { createApp, onMounted, ref, reactive } = Vue;
			createApp({
			setup() {
			const initUnionPayEChart = () => {
			const chartDom = document.getElementById('UnionPayChart');
			const myChart = echarts.init(chartDom);
			var option = {
			dataset: {
			source: [
			['score', 'amount', 'product'],
			[89.3, 58212, 'Matcha Latte'],
			[57.1, 78254, 'Milk Tea'],
			[74.4, 41032, 'Cheese Cocoa'],
			[50.1, 12755, 'Cheese Brownie'],
			[89.7, 20145, 'Matcha Cocoa'],
			[68.1, 79146, 'Tea'],
			[19.6, 91852, 'Orange Juice'],
			[10.6, 101852, 'Lemon Juice'],
			[32.7, 20112, 'Walnut Brownie']
			dataset: {
			source: [
			['score', 'amount', 'product'],
			[89.3, 58212, '票据打印冲正'],
			[57.1, 78254, '票据打印'],
			[74.4, 41032, '变更委托冲正'],
			[50.1, 12755, '变更委托'],
			[89.7, 20145, '取消委托'],
			[68.1, 79146, '委托'],
			[19.6, 91852, '缴费冲正'],
			[10.6, 101852, '缴费'],
			[32.7, 20112, '查询']
			]
			},
			grid: { containLabel: true },
			xAxis: {
			// name: 'amount'
			},
			yAxis: { type: 'category' },
			// visualMap: {
			// orient: 'horizontal',
			// left: 'center',
			// min: 10,
			// max: 100,
			// text: ['High Score', 'Low Score'],
			// // Map the score column to color
			// dimension: 0,
			// inRange: {
			// color: ['#65B581', '#FFCE34', '#FD665F']
			// }
			// },
			series: [
			{
			type: 'bar',
			encode: {
			// Map the "amount" column to X axis.
			x: 'amount',
			// Map the "product" column to Y axis
			y: 'product'
			}
			}
			]
			},
			grid: { containLabel: true },
			xAxis: { name: 'amount' },
			yAxis: { type: 'category' },
			visualMap: {
			orient: 'horizontal',
			left: 'center',
			min: 10,
			max: 100,
			text: ['High Score', 'Low Score'],
			// Map the score column to color
			dimension: 0,
			inRange: {
			color: ['#65B581', '#FFCE34', '#FD665F']
			}
			},
			series: [
			{
			type: 'bar',
			encode: {
			// Map the "amount" column to X axis.
			x: 'amount',
			// Map the "product" column to Y axis
			y: 'product'
			}
			}
			]
			};

			option && myChart.setOption(option);
			option && myChart.setOption(option);
			}
			onMounted(() => {
			initUnionPayEChart();
			});
			onMounted(() => {
			initUnionPayEChart();
			});


			},
			}).mount('#unionPay');
			</script>
			</html>
			},
			}).mount('#unionPay');
			</script>

			</html>