first commit

pages/index/index.css

@@ -0,0 +1,102 @@
+page{
+	background: #F0F0F0;
+}
+/* 主体开始 */
+.spectrum-block{
+	display: flex;
+	flex-direction: column;
+	justify-content: flex-start;
+}
+.line-block{
+	height: 94rpx;
+	font-size: 30rpx;
+	color: #000000;
+	display: flex;
+	flex-direction: row;
+	justify-content: flex-start;
+	align-items: center;
+	padding: 0 40rpx;
+	box-sizing: border-box;
+	background: #FFFFFF;
+}
+/* tab选项开始 */
+.tab-block{
+	height: 64rpx;
+	display: flex;
+	flex-direction: row;
+	justify-content: space-around;
+	align-items: flex-end;
+	background: #FFFFFF 100%;
+	margin-top: 2rpx;
+}
+.tab{
+	font-size: 28rpx;
+	color: #333333;
+	white-space: nowrap;
+	height: 64rpx;
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	align-items: flex-end;
+}
+.tab-click{
+	font-size: 28rpx;
+	color: #3982FC;
+	white-space: nowrap;
+	border-bottom: solid 2rpx #3982FC;
+}
+/* tab选项结束 */
+/* 画图开始 */
+.echarts-block{
+	display: flex;
+	flex-direction: column;
+	background: #FFFFFF;
+}
+.ec-canvas{
+	display: flex;
+	flex: 1;
+}
+.canvasView{
+}
+.legend-block{
+	height: 30rpx;
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+}
+.legend-block-left{
+	height: 30rpx;
+	display: flex;
+	flex-direction: row;
+	justify-content: flex-start;
+	align-items: center;
+}
+.legend-block-left-color{
+	height: 30rpx;
+	width: 30rpx;
+	background: #DAA520;
+}
+.legend-block-left-text{
+	font-size: 24rpx;
+	margin-left: 10rpx;
+}
+.legend-block-right{
+	height: 30rpx;
+	display: flex;
+	flex-direction: row;
+	justify-content: flex-start;
+	align-items: center;
+	margin-left: 20rpx;
+}
+.legend-block-right-color{
+	height: 30rpx;
+	width: 30rpx;
+	background: #2E8B57;
+}
+.legend-block-right-text{
+	font-size: 24rpx;
+	margin-left: 10rpx;
+}
+/* 画图结束 */
+/* 主体结束 */

pages/index/index.vue

@@ -0,0 +1,56 @@
+<template>
+	<view class="content">
+		<button @click="open()">开始</button>
+		<loading 
+			ref="loading"
+			:custom="false"
+			:shadeClick="true"
+			:type="1"
+			@callback="callback()">
+			<!-- <view class="test">自定义</view> -->
+		</loading>
+	</view>
+</template>
+
+<script>
+	import loading from '../../components/xuan-loading/xuan-loading.vue'
+	export default {
+		components:{
+			loading
+		},
+		data() {
+			return {
+			}
+		},
+		mounted() {
+			this.open();
+			setTimeout(()=>{
+				this.close();
+			},2000)
+		},
+		methods: {
+			close:function(){
+				this.$refs.loading.close();
+			},
+			open:function(){
+				this.$refs.loading.open();
+			},
+			callback(){
+				console.log("关闭后回掉");
+			}
+		}
+	}
+</script>
+
+<style>
+	.test{
+		animation: 1s aaa infinite;
+	}
+	@keyframes aaa{
+		from{transform: rotate(0deg);}
+		to{transform: rotate(360deg);}
+	}
+	.content{
+
+	}
+</style>