初始提交

2026-01-04 11:09:06 +08:00
commit 8fa31df250
1326 changed files with 213907 additions and 0 deletions
--- a/pages/portal/components/HCharts/charts.vue
+++ b/pages/portal/components/HCharts/charts.vue
@@ -0,0 +1,164 @@
+<template>
+	<view class="charts-v">
+		<view class="qiun-title-bar u-flex" :style="{'justify-content':config.option.chartTitle.titleLeft}"
+			v-if="config.option.chartTitle.titleText || config.option.chartTitle.titleSubtext">
+			<view class="u-flex-col titleBox" :style="{'background-color':config.option.chartTitle.titleBgColor}">
+				<view class="tit"
+					:style="{'margin-bottom':config.option.chartTitle.titleSubtext?'8rpx':0,'font-size':config.option.chartTitle.titleTextStyleFontSize,'font-weight':config.option.chartTitle.titleTextStyleFontWeight,'color':config.option.chartTitle.titleTextStyleColor}">
+					{{config.option.chartTitle.titleText}}
+				</view>
+				<view class="tit2"
+					:style="{'font-size':config.option.chartTitle.titleSubtextStyleFontSize,'font-weight':config.option.chartTitle.titleSubtextStyleFontWeight,'color':config.option.chartTitle.titleSubtextStyleColor}">
+					{{config.option.chartTitle.titleSubtext}}
+				</view>
+			</view>
+		</view>
+		<view class="regionStep" v-if="regionStep.length >1">
+			<text v-for="(item,index) in regionStep" @click="regionStepClick(item,index)" :key="index"
+				:style="{'font-size':config.option.drillDownFontSize*2+'rpx','color':config.option.drillDownColor,'font-weight':config.option.drillDownFontWeight?700:400}">
+				{{item.name}}
+				<u-icon name="arrow-right" v-if="index!=regionStep.length-1" class="icon"></u-icon>
+			</text>
+		</view>
+		<view class="charts-box">
+			<qiun-data-charts v-if="config.option.chartData.series.length" :type="config.option.chartData.type"
+				:chartData="config.option.chartData" :ontouch="true" :opts="config.option.chartData.opts"
+				@complete="complete" @getIndex="getIndex" :style="{'background-color':config.option.bgColor}"
+				:connectNulls="true" />
+			<view class="" v-if="config.jnpfKey==='mapChart' && config.option.chartData.series.length>0 && loading"
+				:key="key">
+				<block v-for="(item, index) in config.option.markPoints" :key="index">
+					<view :class="config.option.styleType == 2?'points-box2':'points-box'"
+						:style="{top:(item.y - 5 ) + 'px',left:(item.x - 5) +'px'}"></view>
+				</block>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	export default {
+		props: {
+			loading: {
+				type: Boolean,
+				default: false
+			},
+			config: {
+				type: Object,
+				default: () => {}
+			},
+			markPoints: {
+				type: Array,
+				default: () => []
+			},
+			regionStep: {
+				type: Array,
+				default: () => []
+			}
+		},
+		data() {
+			return {
+				key: +new Date()
+			}
+		},
+		methods: {
+			complete(e) {
+				this.$emit('complete', e)
+			},
+			getIndex(e) {
+				return this.$emit('getIndex', e)
+			},
+			regionStepClick(item, index) {
+				if (index < this.regionStep.length - 1) return this.$emit('regionStepClick', item, index)
+			}
+		}
+	}
+</script>
+
+
+<style lang="scss">
+	.charts-v {
+		background-color: #fff;
+		box-sizing: border-box;
+		position: relative;
+	}
+
+	.qiun-title-bar {
+		width: 100%;
+		z-index: 9;
+		text-align: center;
+		position: absolute;
+		top: 40rpx;
+		margin: 20rpx 0;
+
+		.titleBox {
+			.tit {
+				// margin-bottom: 10rpx;
+			}
+		}
+	}
+
+	.regionStep {
+		max-width: 100%;
+		max-height: 100%;
+		margin-bottom: 60rpx;
+		position: absolute;
+		top: 0rpx;
+		z-index: 9999;
+
+		.icon {
+			margin: 0 8rpx;
+		}
+	}
+
+	.charts-box {
+		width: 100%;
+		height: 660rpx;
+		// margin: 0px auto 20rpx;
+		position: relative;
+
+		.charts-legend {
+			position: absolute;
+			bottom: 0px;
+			left: 20rpx;
+			font-size: 20rpx;
+
+			.legend-item {
+				display: inline-block;
+				width: 30rpx;
+				height: 20rpx;
+				margin-right: 10rpx;
+				background-color: #0D9FD8;
+			}
+		}
+
+		.points-box {
+			position: absolute;
+			width: 20rpx;
+			height: 20rpx;
+			border-radius: 50%;
+			background-color: #0D9FD8;
+			animation: warn 1.5s ease-out 0s infinite;
+		}
+
+		.points-box2 {
+			position: absolute;
+			box-shadow: 0 0 24rpx 28rpx rgba(13, 159, 261, 0.3);
+		}
+	}
+
+	@keyframes warn {
+		0% {
+			transform: scale(0.5);
+			opacity: 1;
+		}
+
+		30% {
+			opacity: 1;
+		}
+
+		100% {
+			transform: scale(1.4);
+			opacity: 0.3;
+		}
+	}
+</style>