edit

App.vue

@@ -1,4 +1,5 @@
-<script>
+<script>
+import Vue from 'vue'
 export default {
 	onLaunch: function() {
 		// #ifdef APP-PLUS
@@ -10,7 +11,38 @@ export default {
 			fontFamily: 'graceIconfont',
 			src: "url('https://at.alicdn.com/t/font_823462_1p2i18cul3t.ttf')"
 		});
-		*/
+		*/
+	   
+	   uni.getSystemInfo({
+	   	success: function(e) {
+	   		// #ifndef MP
+	   		Vue.prototype.StatusBar = e.statusBarHeight;
+	   		if (e.platform == 'android') {
+	   			Vue.prototype.CustomBar = e.statusBarHeight + 50;
+	   		} else {
+	   			Vue.prototype.CustomBar = e.statusBarHeight + 45;
+	   		};
+	   		// #endif
+	   
+	   		// #ifdef MP-WEIXIN || MP-QQ
+	   		Vue.prototype.StatusBar = e.statusBarHeight;
+	   		let capsule = wx.getMenuButtonBoundingClientRect();
+	   		if (capsule) {
+	   			Vue.prototype.Custom = capsule;
+	   			// Vue.prototype.capsuleSafe = uni.upx2px(750) - capsule.left + uni.upx2px(750) - capsule.right;
+	   			Vue.prototype.CustomBar = capsule.bottom + capsule.top - e.statusBarHeight;
+	   		} else {
+	   			Vue.prototype.CustomBar = e.statusBarHeight + 50;
+	   		}
+	   		// #endif		
+	   	
+	   
+	   		// #ifdef MP-ALIPAY
+	   		Vue.prototype.StatusBar = e.statusBarHeight;
+	   		Vue.prototype.CustomBar = e.statusBarHeight + e.titleBarHeight;
+	   		// #endif
+	   	}
+	   })
 	},
 	onShow: function() {},
 	onHide: function() {}

lib/colorui/animation.css

@@ -1,909 +1,184 @@
-/* 
-  Animation 微动画  
-  基于ColorUI组建库的动画模块 by 文晓港 2019年3月26日19:52:28
- */
-
-/* css 滤镜 控制黑白底色gif的 */
-.gif-black{  
-  mix-blend-mode: screen;  
-}
-.gif-white{  
-  mix-blend-mode: multiply; 
-}
-
-
-/* Animation css */
-[class*=animation-] {
-    animation-duration: .5s;
-    animation-timing-function: ease-out;
-    animation-fill-mode: both
-}
-
-.animation-fade {
-    animation-name: fade;
-    animation-duration: .8s;
-    animation-timing-function: linear
-}
-
-.animation-scale-up {
-    animation-name: scale-up
-}
-
-.animation-scale-down {
-    animation-name: scale-down
-}
-
-.animation-slide-top {
-    animation-name: slide-top
-}
-
-.animation-slide-bottom {
-    animation-name: slide-bottom
-}
-
-.animation-slide-left {
-    animation-name: slide-left
-}
-
-.animation-slide-right {
-    animation-name: slide-right
-}
-
-.animation-shake {
-    animation-name: shake
-}
-
-.animation-reverse {
-    animation-direction: reverse
-}
-
-@keyframes fade {
-    0% {
-        opacity: 0
-    }
-
-    100% {
-        opacity: 1
-    }
-}
-
-@keyframes scale-up {
-    0% {
-        opacity: 0;
-        transform: scale(.2)
-    }
-
-    100% {
-        opacity: 1;
-        transform: scale(1)
-    }
-}
-
-@keyframes scale-down {
-    0% {
-        opacity: 0;
-        transform: scale(1.8)
-    }
-
-    100% {
-        opacity: 1;
-        transform: scale(1)
-    }
-}
-
-@keyframes slide-top {
-    0% {
-        opacity: 0;
-        transform: translateY(-100%)
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateY(0)
-    }
-}
-
-@keyframes slide-bottom {
-    0% {
-        opacity: 0;
-        transform: translateY(100%)
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateY(0)
-    }
-}
-
-@keyframes shake {
-
-    0%,
-    100% {
-        transform: translateX(0)
-    }
-
-    10% {
-        transform: translateX(-9px)
-    }
-
-    20% {
-        transform: translateX(8px)
-    }
-
-    30% {
-        transform: translateX(-7px)
-    }
-
-    40% {
-        transform: translateX(6px)
-    }
-
-    50% {
-        transform: translateX(-5px)
-    }
-
-    60% {
-        transform: translateX(4px)
-    }
-
-    70% {
-        transform: translateX(-3px)
-    }
-
-    80% {
-        transform: translateX(2px)
-    }
-
-    90% {
-        transform: translateX(-1px)
-    }
-}
-
-@keyframes slide-left {
-    0% {
-        opacity: 0;
-        transform: translateX(-100%)
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateX(0)
-    }
-}
-
-@keyframes slide-right {
-    0% {
-        opacity: 0;
-        transform: translateX(100%)
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateX(0)
-    }
-}
-
-/*
-	在App.vue全局引入common文件夹下的ycCss.css
-	为你想要效果的view添加class  ||  hover-class
-	插件地址: https://ext.dcloud.net.cn/plugin?id=1973
-*/
-
-
-.bubble {
-	width: 60rpx;
-	height: 60rpx;
-	border-radius: 50%;
-	background-color: #007AFF;
-	color: white;
-	text-align: center;
-	line-height: 60rpx;
-}
-
-
-.ycHide {
-	background: linear-gradient(270deg, var(--btnColor), var(--btnColor), var(--bgColor), var(--bgColor));
-	background-size: 300% 300%;
-	background-position: 99% 50%;
-	--bgColor: white;
-	--btnColor: #1AAD19;
-	color: var(--bgColor);
-	animation: ycHide 1s var(--count) ease both;
-	--count: infinite;
-}
-
-@keyframes ycHide {
-	0% {
-		background-position: 99% 50%;
-	}
-
-	100% {
-		background-position: 1% 50%;
-	}
-}
-
-
-@keyframes ycCart {
-	7% {
-		transform: scale(1, 1);
-	}
-
-	10% {
-		transform: scale(1, 0.8);
-	}
-
-	13% {
-		transform: scale(1, 1);
-	}
-
-	37% {
-		transform: scale(1, 1);
-	}
-
-	40% {
-		transform: scale(1, 0.8);
-	}
-
-	43% {
-		transform: scale(1, 1);
-	}
-}
-
-.ycCart {
-	transform-origin: bottom;
-	width: 30rpx;
-	height: 30rpx;
-	position: relative;
-	animation: ycCart 3s infinite ease;
-}
-
-@keyframes ycDrop {
-	0% {
-		top: -30%;
-		border-radius: 50%;
-		background-color: #fff;
-	}
-
-	3% {
-		top: 0;
-		border-radius: 50%;
-		background-color: #fff;
-	}
-
-	6% {
-		top: 30%;
-		height: 5rpx;
-		border-radius: 10rpx 10rpx 5rpx 5rpx;
-		transform: scaleX(1.7);
-	}
-
-	15% {
-		top: 10%;
-		height: 10rpx;
-		border-radius: 50%;
-		transform: scaleX(1);
-	}
-
-	30% {
-		top: 40%;
-		height: 10rpx;
-		opacity: 1;
-		border-radius: 50%;
-		transform: scaleX(1);
-		background-color: #fff;
-
-	}
-
-	31% {
-		opacity: 0;
-	}
-
-	33% {
-		top: -30%;
-		opacity: 0;
-	}
-
-	34% {
-		border-radius: 0;
-		background-color: #1C9FFF;
-		box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(28, 159, 255, 0.4);
-		opacity: 1;
-		top: -30%;
-	}
-
-	40% {
-		top: 30%;
-		transform-origin: center bottom;
-		transform: scaleX(0.8) scaleY(1.4);
-	}
-
-	49% {
-		top: 10%;
-		transform-origin: center bottom;
-		transform: scaleX(1.3) scaleY(0.7);
-	}
-
-	64% {
-		top: 40%;
-		opacity: 1;
-		transform-origin: center top;
-		transform: scaleX(1) scaleY(1);
-	}
-
-	67% {
-		opacity: 0;
-	}
-
-	100% {
-		opacity: 0;
-	}
-}
-
-
-.ycDrop {
-	width: 10rpx;
-	height: 10rpx;
-	position: absolute;
-	-webkit-backface-visibility: hidden;
-	-webkit-transform-style: preserve-3d;
-	left: 0;
-	right: 0;
-	margin: 0 auto;
-	transform-origin: 50%;
-	animation: ycDrop 3s infinite ease;
-}
-
-
-
-@keyframes ycHeightSec {
-	100% {
-		background-position: right -40px top 0px;
-	}
-}
-
-.ycHeightSec {
-	position: relative;
-	overflow: hidden;
-}
-
-.ycHeightSec::before {
-	content: '';
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	margin: auto;
-	background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
-	background-size: 40px 100%;
-	background-repeat: no-repeat;
-	background-position: left -40px top 0;
-	animation: ycHeightSec 1s ease infinite;
-}
-
-
-.ycHeight {
-	position: relative;
-	overflow: hidden;
-}
-
-.ycHeight::before {
-	content: '';
-	position: absolute;
-	background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
-	width: 140%;
-	height: 80rpx;
-	left: 140%;
-	top: 0;
-	bottom: 0;
-	margin: auto;
-	transform: rotateZ(-45deg);
-	animation: isLeft 5s 2.3s infinite;
-}
-
-@keyframes isLeft {
-	0% {
-		left: -140%;
-	}
-
-	12% {
-		left: 140%;
-	}
-
-	100% {
-		left: 140%;
-	}
-}
-
-
-/* 
-	<view wx:for="{{3}}" style="animation-delay:{{index+'s'}}" class="ycChevron" key="{{index}}" ></view>
-*/
-.ycChevron {
-	position: absolute;
-	width: 14px;
-	height: 4px;
-	opacity: 0;
-	transform: scale3d(0.5, 0.5, 0.5);
-	animation: move 3s ease-out infinite;
-}
-
-.ycChevron:before,
-.ycChevron:after {
-	content: ' ';
-	position: absolute;
-	top: 0;
-	margin: auto;
-	height: 100%;
-	width: 51%;
-	background: #fff;
-}
-
-.ycChevron:before {
-	left: 0;
-	transform: skew(0deg, 30deg);
-}
-
-.ycChevron:after {
-	right: 0;
-	width: 50%;
-	transform: skew(0deg, -30deg);
-}
-
-@keyframes move {
-	25% {
-		opacity: 1;
-	}
-
-	33% {
-		opacity: 1;
-		transform: translateY(30px);
-	}
-
-	67% {
-		opacity: 1;
-		transform: translateY(40px);
-	}
-
-	100% {
-		opacity: 0;
-		transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
-	}
-}
-
-
-@keyframes shockwave {
-	0% {
-		-webkit-transform: scale(1);
-		transform: scale(1);
-		box-shadow: 0 0 2px var(--color), inset 0 0 1px var(--color);
-		opacity: 1;
-	}
-
-	95% {
-		box-shadow: 0 0 50px var(--color), inset 0 0 30px var(--color);
-		opacity: 0;
-	}
-
-	100% {
-		-webkit-transform: scale(2.25);
-		transform: scale(2.25);
-		opacity: 0;
-	}
-}
-
-.ycHot {
-	position: relative;
-	--color: rgba(0, 0, 0, 0.15);
-}
-
-.ycHot::before {
-	content: '';
-	position: absolute;
-	top: 0;
-	left: 0;
-	bottom: 0;
-	right: 0;
-	border-radius: 50%;
-	animation: shockwave 3s 0.5s ease-out infinite;
-}
-
-.ycHot::after {
-	content: '';
-	position: absolute;
-	top: 0;
-	left: 0;
-	bottom: 0;
-	right: 0;
-	border-radius: 50%;
-	animation: shockwave 3s 0.65s ease-out infinite;
-}
-
-@keyframes ycHover1 {
-	0% {
-		transform: scale(1);
-	}
-
-	50% {
-		transform: scale(0.9);
-	}
-
-	100% {
-		transform: scale(1);
-	}
-}
-
-.ycHover1 {
-	--count: infinite;
-	animation: ycHover1 .3s var(--count) !important;
-}
-
-.ycShake {
-	transform-origin: center bottom;
-	animation: ycShake 2s 0.5s ease-out infinite;
-}
-
-@keyframes ycShake {
-	0% {
-		transform: rotate(0deg);
-		transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
-	}
-
-	10% {
-		transform: rotate(-12deg);
-		transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
-	}
-
-	20% {
-		transform: rotate(12deg);
-		transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
-	}
-
-	28% {
-		transform: rotate(-10deg);
-		transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
-	}
-
-	36% {
-		transform: rotate(10deg);
-		transition-timing-function: cubic-bezier(0.755, .5, .855, .06);
-	}
-
-	42% {
-		transform: rotate(-8deg);
-		transition-timing-function: cubic-bezier(0.755, .5, .855, .06);
-	}
-
-	48% {
-		transform: rotate(8deg);
-		transition-timing-function: cubic-bezier(0.755, .5, .855, .06);
-	}
-
-	52% {
-		transform: rotate(-4deg);
-		transition-timing-function: cubic-bezier(0.755, .5, .855, .06);
-	}
-
-	56% {
-		transform: rotate(4deg);
-		transition-timing-function: cubic-bezier(0.755, .5, .855, .06);
-	}
-
-	60% {
-		transform: rotate(0deg);
-		transition-timing-function: cubic-bezier(0.755, .5, .855, .06);
-	}
-
-	100% {
-		transform: rotate(0deg);
-		transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
-	}
-}
-
-.ycHover2 {
-	z-index: 999;
-	position: relative;
-	--color: #ff0081;
-	--count: infinite;
-}
-
-.ycHover2::before,
-.ycHover2::after {
-	position: absolute;
-	content: '';
-	display: block;
-	width: 140%;
-	height: 100%;
-	left: -20%;
-	z-index: -1000;
-	transition: all ease-in-out 0.5s;
-	background-repeat: no-repeat;
-}
-
-.ycHover2::before {
-	top: -55%;
-	background-image: radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, transparent 20%, var(--color) 20%, transparent 30%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, transparent 10%, var(--color) 15%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%);
-	background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
-	animation: topBubbles ease-in-out 0.75s var(--count);
-	display: block;
-}
-
-.ycHover2::after {
-	bottom: -55%;
-	background-image: radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, transparent 10%, var(--color) 15%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%), radial-gradient(circle, var(--color) 20%, transparent 20%);
-	background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
-	display: block;
-	animation: bottomBubbles ease-in-out 0.75s var(--count);
-}
-
-
-@keyframes topBubbles {
-	0% {
-		background-position: 5% 90%, 10% 90%, 10% 90%, 15% 90%, 25% 90%, 25% 90%, 40% 90%, 55% 90%, 70% 90%;
-		background-size: 10% 10%, 20% 20%, 15% 15%, 20% 20%, 18% 18%, 10% 10%, 15% 15%, 10% 10%, 18% 18%;
-	}
-
-	50% {
-		background-position: 0% 80%, 0% 20%, 10% 40%, 20% 0%, 30% 30%, 22% 50%, 50% 50%, 65% 20%, 90% 30%;
-		background-size: 10% 10%, 20% 20%, 15% 15%, 20% 20%, 18% 18%, 10% 10%, 15% 15%, 10% 10%, 18% 18%;
-	}
-
-	100% {
-		background-position: 0% 70%, 0% 10%, 10% 30%, 20% -10%, 30% 20%, 22% 40%, 50% 40%, 65% 10%, 90% 20%;
-		background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
-	}
-}
-
-@keyframes bottomBubbles {
-	0% {
-		background-position: 10% -10%, 30% 10%, 55% -10%, 70% -10%, 85% -10%, 70% -10%, 70% 0%;
-		background-size: 15% 15%, 20% 20%, 18% 18%, 20% 20%, 15% 15%, 10% 10%, 20% 20%;
-	}
-
-	50% {
-		background-position: 0% 80%, 20% 80%, 45% 60%, 60% 100%, 75% 70%, 95% 60%, 105% 0%;
-		background-size: 15% 15%, 20% 20%, 18% 18%, 20% 20%, 15% 15%, 10% 10%, 20% 20%;
-	}
-
-	100% {
-		background-position: 0% 90%, 20% 90%, 45% 70%, 60% 110%, 75% 80%, 95% 70%, 110% 10%;
-		background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
-	}
-}
-
-@keyframes ycHover3 {
-	0% {
-		transform: scale(1, 1);
-	}
-
-	33% {
-		transform: scale(1, 1.2);
-	}
-
-	66% {
-		transform: scale(1.2, 1);
-	}
-
-	100% {
-		transform: scale(1, 1);
-	}
-}
-
-.ycHover3 {
-	--count: infinite;
-	animation: ycHover3 .3s var(--count) !important;
-}
-
-.ycFly {
-	animation: ycFly 2s infinite alternate !important;
-}
-
-@keyframes ycFly {
-	100% {
-		transform: translateY(12%);
-	}
-}
-
-.ycHover4 {
-	border-bottom: 6rpx #F6BE3C solid;
-}
-
-.ycHover4:hover {
-	margin-top: 6rpx;
-	border-bottom: 0rpx #F6BE3C solid;
-}
-
-.ycRotate {
-	animation-name: ycRotate;
-	animation-duration: 10s;
-	animation-timing-function: linear;
-	animation-iteration-count: infinite;
-}
-
-@keyframes ycRotate {
-	0% {
-		transform: rotate(0deg);
-	}
-
-	100% {
-		transform: rotate(1turn);
-	}
-
-	0% {
-		transform: rotate(0deg);
-	}
-
-	100% {
-		transform: rotate(1turn);
-	}
-}
-
-.ycLive {
-	width: 10%;
-	height: 50%;
-	position: relative;
-	--color: white;
-	background-color: var(--color);
-	transform-origin: bottom;
-	animation: ycLive 0.6s 0.2s infinite ease-in-out;
-}
-
-.ycLive::after {
-	right: 200%;
-	animation: ycLive 0.6s 0.4s infinite ease-in-out;
-}
-
-.ycLive::before {
-	left: 200%;
-	animation: ycLive 0.6s 0s infinite ease-in-out;
-}
-
-.ycLive::after,
-.ycLive::before {
-	width: 100%;
-	height: 100%;
-	content: '';
-	position: absolute;
-	bottom: 0;
-	background-color: var(--color);
-	transform-origin: bottom;
-}
-
-@keyframes ycLive {
-	0%,
-	100% {
-		transform: scaleY(1);
-	}
-
-	50% {
-		transform: scaleY(0.6);
-	}
-}
-
-.ycMusic {
-	position: relative;
-	--contentBefore: '♫';
-	--contentAfter: '♩';
-	--color: #000000;
-	--zIndex: 9999;
-	z-index: var(--zIndex);
-}
-
-.ycMusic::after,
-.ycMusic::before {
-	position: absolute;
-	left: -10%;
-	bottom: -30%;
-	color: var(--color);
-	z-index: calc(var(--zIndex) - 1);
-	opacity: 0;
-	transform: translateY(0) translateX(0) scale(0);
-}
-
-.ycMusic::after {
-	content: var(--contentAfter);
-	animation: ycMusic 2.5s 1.25s linear infinite;
-}
-
-.ycMusic::before {
-	content: var(--contentBefore);
-	animation: ycMusic 2.5s linear infinite;
-}
-
-@keyframes ycMusic {
-	0% {
-		transform: translateX(0) translateY(0) scale(0);
-		opacity: 0;
-	}
-
-	5% {
-		transform: translateY(0) translateX(0) scale(.6);
-		opacity: 1;
-	}
-
-	50% {
-		transform: translateX(-40rpx) translateY(-50rpx) scale(1);
-		opacity: 1;
-	}
-
-	90% {
-		transform: translateX(-50rpx) translateY(-100rpx) scale(1);
-		opacity: 0;
-	}
-
-	93% {
-		transform: translateX(-50rpx) translateY(-100rpx) scale(0);
-		opacity: 0;
-	}
-
-	100% {
-		transform: translateX(0) translateY(0) scale(0);
-		opacity: 0;
-	}
-}
-
-
-.ycPortrait {
-	position: relative;
-	--color: #ff0081;
-}
-
-.ycPortrait::after,
-.ycPortrait::before {
-	position: absolute;
-	content: '';
-	left: 0;
-	right: 0;
-	bottom: 0;
-	top: 0;
-	margin: auto;
-	box-sizing: border-box;
-	border: 1rpx solid var(--color);
-	border-radius: 50%;
-	width: 100%;
-	height: 100%;
-}
-
-.ycPortrait::after {
-	transform: scale(1.1);
-	animation: ycPortrait 0.8s linear infinite;
-}
-
-@keyframes ycPortrait {
-
-	0%,
-	100% {
-		transform: scale(1);
-		opacity: 0;
-	}
-
-	1% {
-		transform: scale(1);
-		opacity: 1;
-	}
-
-	95% {
-		transform: scale(1.3);
-		opacity: 0;
-	}
-}
-
-@keyframes ycBeat {
-	0% {
-		transform: scale(1);
-	}
-
-	50% {
-		transform: scale(0.8);
-	}
-
-	100% {
-		transform: scale(1);
-	}
-}
-
-.ycBeat {
-	animation: ycBeat 0.8s linear infinite;
+/* 
+  Animation 微动画  
+  基于ColorUI组建库的动画模块 by 文晓港 2019年3月26日19:52:28
+ */
+
+/* css 滤镜 控制黑白底色gif的 */
+.gif-black{  
+  mix-blend-mode: screen;  
 }
+.gif-white{  
+  mix-blend-mode: multiply; 
+}
+
+
+/* Animation css */
+[class*=animation-] {
+    animation-duration: .5s;
+    animation-timing-function: ease-out;
+    animation-fill-mode: both
+}
+
+.animation-fade {
+    animation-name: fade;
+    animation-duration: .8s;
+    animation-timing-function: linear
+}
+
+.animation-scale-up {
+    animation-name: scale-up
+}
+
+.animation-scale-down {
+    animation-name: scale-down
+}
+
+.animation-slide-top {
+    animation-name: slide-top
+}
+
+.animation-slide-bottom {
+    animation-name: slide-bottom
+}
+
+.animation-slide-left {
+    animation-name: slide-left
+}
+
+.animation-slide-right {
+    animation-name: slide-right
+}
+
+.animation-shake {
+    animation-name: shake
+}
+
+.animation-reverse {
+    animation-direction: reverse
+}
+
+@keyframes fade {
+    0% {
+        opacity: 0
+    }
+
+    100% {
+        opacity: 1
+    }
+}
+
+@keyframes scale-up {
+    0% {
+        opacity: 0;
+        transform: scale(.2)
+    }
+
+    100% {
+        opacity: 1;
+        transform: scale(1)
+    }
+}
+
+@keyframes scale-down {
+    0% {
+        opacity: 0;
+        transform: scale(1.8)
+    }
+
+    100% {
+        opacity: 1;
+        transform: scale(1)
+    }
+}
+
+@keyframes slide-top {
+    0% {
+        opacity: 0;
+        transform: translateY(-100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateY(0)
+    }
+}
+
+@keyframes slide-bottom {
+    0% {
+        opacity: 0;
+        transform: translateY(100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateY(0)
+    }
+}
+
+@keyframes shake {
+
+    0%,
+    100% {
+        transform: translateX(0)
+    }
+
+    10% {
+        transform: translateX(-9px)
+    }
+
+    20% {
+        transform: translateX(8px)
+    }
+
+    30% {
+        transform: translateX(-7px)
+    }
+
+    40% {
+        transform: translateX(6px)
+    }
+
+    50% {
+        transform: translateX(-5px)
+    }
+
+    60% {
+        transform: translateX(4px)
+    }
+
+    70% {
+        transform: translateX(-3px)
+    }
+
+    80% {
+        transform: translateX(2px)
+    }
+
+    90% {
+        transform: translateX(-1px)
+    }
+}
+
+@keyframes slide-left {
+    0% {
+        opacity: 0;
+        transform: translateX(-100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateX(0)
+    }
+}
+
+@keyframes slide-right {
+    0% {
+        opacity: 0;
+        transform: translateX(100%)
+    }
+
+    100% {
+        opacity: 1;
+        transform: translateX(0)
+    }
+}

lib/colorui/components/cu-custom.vue

@@ -1,65 +1,78 @@
-<template>
-	<view>
-		<view class="cu-custom" :style="[{height:CustomBar + 'px'}]">
-			<view class="cu-bar fixed" :style="style" :class="[bgImage!=''?'none-bg text-white bg-img':'',bgColor]">
-				<view class="action" @tap="BackPage" v-if="isBack">
-					<text class="cuIcon-back"></text>
-					<slot name="backText"></slot>
-				</view>
-				<view class="content" :style="[{top:StatusBar + 'px'}]">
-					<slot name="content"></slot>
-				</view>
-				<slot name="right"></slot>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				StatusBar: this.StatusBar,
-				CustomBar: this.CustomBar
-			};
-		},
-		name: 'cu-custom',
-		computed: {
-			style() {
-				var StatusBar= this.StatusBar;
-				var CustomBar= this.CustomBar;
-				var bgImage = this.bgImage;
+<template>
+	<view>
+		<view class="cu-custom" :style="[{height:CustomBar + 'px'}]">
+			<view class="cu-bar fixed" :style="style" :class="[bgImage!=''?'none-bg text-white bg-img':'', bgColorClass]">
+				<view class="action" @tap="BackPage" v-if="isBack">
+					<text class="cuIcon-back"></text>
+					<slot name="backText"></slot>
+				</view>
+				<view class="content" :style="[{top:StatusBar + 'px'}]">
+					<slot name="content"></slot>
+				</view>
+				<slot name="right"></slot>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				StatusBar: this.StatusBar,
+				CustomBar: this.CustomBar,
+				bgColorClass : 'bg-gradual-pink',
+			};
+		},
+		name: 'cu-custom',
+		computed: {
+			style() {
+				var StatusBar= this.StatusBar;
+				var CustomBar= this.CustomBar;
+				var bgImage = this.bgImage;
 				var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
-				if (this.bgImage) {
-					style = `${style}background-image:url(${bgImage});`;
+				if (this.bgColor) {
+					var bgColor = this.bgColor;
+					style = `${style};${bgColor};`;
+				} else if (this.bgImage) {
+					style = `${style}background-image:url(${bgImage});`;
 				}
-				return style
-			}
-		},
-		props: {
-			bgColor: {
-				type: String,
-				default: ''
-			},
-			isBack: {
-				type: [Boolean, String],
-				default: false
-			},
-			bgImage: {
-				type: String,
-				default: ''
-			},
-		},
-		methods: {
+				
+				return style
+			}
+		},
+		props: {
+			bgColor: {
+				type: String,
+				default: ''
+			},
+			isBack: {
+				type: [Boolean, String],
+				default: false
+			},
+			bgImage: {
+				type: String,
+				default: ''
+			},
+		},
+		methods: {
 			BackPage() {
-				uni.navigateBack({
-					delta: 1
-				});
-			}
-		}
-	}
-</script>
-
-<style>
-
-</style>
+				if (this.Dever.source == 'h5') {
+					window.history.back();
+				} else {
+					if (getCurrentPages().length < 2 && 'undefined' !== typeof __wxConfig) {
+										let url = '/' + __wxConfig.pages[0]
+										return uni.redirectTo({url})
+									}
+					uni.navigateBack({
+						delta: 1
+					});
+				}
+			}
+		}
+	}
+</script>
+
+<style>
+
+</style>

lib/colorui/main.css

@@ -1,3929 +1,3912 @@
-/*
-  ColorUi for uniApp  v2.1.6 | by 文晓港 2019-05-31 10:44:24
-  仅供学习交流，如作它用所承受的法律责任一概与作者无关  
-  
-  *使用ColorUi开发扩展与插件时，请注明基于ColorUi开发 
-  
-  （QQ交流群：240787041）
-*/
-
-/* ==================
-        初始化
- ==================== */
-body {
-	font-size: 28upx;
-	color: #333333;
-	font-family: Helvetica Neue, Helvetica, sans-serif;
-}
-
-view,
-scroll-view,
-swiper,
-button,
-input,
-textarea,
-label,
-navigator,
-image {
-	box-sizing: border-box;
-}
-
-.round {
-	border-radius: 5000upx;
-}
-
-.radius {
-	border-radius: 6upx;
-}
-
-/* ==================
-          图片
- ==================== */
-
-image {
-	max-width: 100%;
-	display: inline-block;
-	position: relative;
-	z-index: 0;
-}
-
-image.loading::before {
-	content: "";
-	background-color: #f5f5f5;
-	display: block;
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	z-index: -2;
-}
-
-image.loading::after {
-	content: "\e7f1";
-	font-family: "cuIcon";
-	position: absolute;
-	top: 0;
-	left: 0;
-	width: 32upx;
-	height: 32upx;
-	line-height: 32upx;
-	right: 0;
-	bottom: 0;
-	z-index: -1;
-	font-size: 32upx;
-	margin: auto;
-	color: #ccc;
-	-webkit-animation: cuIcon-spin 2s infinite linear;
-	animation: cuIcon-spin 2s infinite linear;
-	display: block;
-}
-
-.response {
-	width: 100%;
-}
-
-/* ==================
-         开关
- ==================== */
-
-switch,
-checkbox,
-radio {
-	position: relative;
-}
-
-switch::after,
-switch::before {
-	font-family: "cuIcon";
-	content: "\e645";
-	position: absolute;
-	color: #ffffff !important;
-	top: 0%;
-	left: 0upx;
-	font-size: 26upx;
-	line-height: 26px;
-	width: 50%;
-	text-align: center;
-	pointer-events: none;
-	transform: scale(0, 0);
-	transition: all 0.3s ease-in-out 0s;
-	z-index: 9;
-	bottom: 0;
-	height: 26px;
-	margin: auto;
-}
-
-switch::before {
-	content: "\e646";
-	right: 0;
-	transform: scale(1, 1);
-	left: auto;
-}
-
-switch[checked]::after,
-switch.checked::after {
-	transform: scale(1, 1);
-}
-
-switch[checked]::before,
-switch.checked::before {
-	transform: scale(0, 0);
-}
-
-/* #ifndef MP-ALIPAY */
-radio::before,
-checkbox::before {
-	font-family: "cuIcon";
-	content: "\e645";
-	position: absolute;
-	color: #ffffff !important;
-	top: 50%;
-	margin-top: -8px;
-	right: 5px;
-	font-size: 32upx;
-	line-height: 16px;
-	pointer-events: none;
-	transform: scale(1, 1);
-	transition: all 0.3s ease-in-out 0s;
-	z-index: 9;
-}
-
-radio .wx-radio-input,
-checkbox .wx-checkbox-input,
-radio .uni-radio-input,
-checkbox .uni-checkbox-input {
-	margin: 0;
-	width: 24px;
-	height: 24px;
-}
-
-checkbox.round .wx-checkbox-input,
-checkbox.round .uni-checkbox-input {
-	border-radius: 100upx;
-}
-
-/* #endif */
-
-switch[checked]::before {
-	transform: scale(0, 0);
-}
-
-switch .wx-switch-input,
-switch .uni-switch-input {
-	border: none;
-	padding: 0 24px;
-	width: 48px;
-	height: 26px;
-	margin: 0;
-	border-radius: 100upx;
-}
-
-switch .wx-switch-input:not([class*="bg-"]),
-switch .uni-switch-input:not([class*="bg-"]) {
-	background: #8799a3 !important;
-}
-
-switch .wx-switch-input::after,
-switch .uni-switch-input::after {
-	margin: auto;
-	width: 26px;
-	height: 26px;
-	border-radius: 100upx;
-	left: 0upx;
-	top: 0upx;
-	bottom: 0upx;
-	position: absolute;
-	transform: scale(0.9, 0.9);
-	transition: all 0.1s ease-in-out 0s;
-}
-
-switch .wx-switch-input.wx-switch-input-checked::after,
-switch .uni-switch-input.uni-switch-input-checked::after {
-	margin: auto;
-	left: 22px;
-	box-shadow: none;
-	transform: scale(0.9, 0.9);
-}
-
-radio-group {
-	display: inline-block;
-}
-
-
-
-switch.radius .wx-switch-input::after,
-switch.radius .wx-switch-input,
-switch.radius .wx-switch-input::before,
-switch.radius .uni-switch-input::after,
-switch.radius .uni-switch-input,
-switch.radius .uni-switch-input::before {
-	border-radius: 10upx;
-}
-
-switch .wx-switch-input::before,
-radio.radio::before,
-checkbox .wx-checkbox-input::before,
-radio .wx-radio-input::before,
-switch .uni-switch-input::before,
-radio.radio::before,
-checkbox .uni-checkbox-input::before,
-radio .uni-radio-input::before {
-	display: none;
-}
-
-radio.radio[checked]::after,
-radio.radio .uni-radio-input-checked::after {
-	content: "";
-	background-color: transparent;
-	display: block;
-	position: absolute;
-	width: 8px;
-	height: 8px;
-	z-index: 999;
-	top: 0upx;
-	left: 0upx;
-	right: 0;
-	bottom: 0;
-	margin: auto;
-	border-radius: 200upx;
-	/* #ifndef MP */
-	border: 7px solid #ffffff !important;
-	/* #endif */
-
-	/* #ifdef MP */
-	border: 8px solid #ffffff !important;
-	/* #endif */
-}
-
-.switch-sex::after {
-	content: "\e71c";
-}
-
-.switch-sex::before {
-	content: "\e71a";
-}
-
-.switch-sex .wx-switch-input,
-.switch-sex .uni-switch-input {
-	background: #e54d42 !important;
-	border-color: #e54d42 !important;
-}
-
-.switch-sex[checked] .wx-switch-input,
-.switch-sex.checked .uni-switch-input {
-	background: #0081ff !important;
-	border-color: #0081ff !important;
-}
-
-switch.red[checked] .wx-switch-input.wx-switch-input-checked,
-checkbox.red[checked] .wx-checkbox-input,
-radio.red[checked] .wx-radio-input,
-switch.red.checked .uni-switch-input.uni-switch-input-checked,
-checkbox.red.checked .uni-checkbox-input,
-radio.red.checked .uni-radio-input {
-	background-color: #e54d42 !important;
-	border-color: #e54d42 !important;
-	color: #ffffff !important;
-}
-
-switch.orange[checked] .wx-switch-input,
-checkbox.orange[checked] .wx-checkbox-input,
-radio.orange[checked] .wx-radio-input,
-switch.orange.checked .uni-switch-input,
-checkbox.orange.checked .uni-checkbox-input,
-radio.orange.checked .uni-radio-input {
-	background-color: #f37b1d !important;
-	border-color: #f37b1d !important;
-	color: #ffffff !important;
-}
-
-switch.yellow[checked] .wx-switch-input,
-checkbox.yellow[checked] .wx-checkbox-input,
-radio.yellow[checked] .wx-radio-input,
-switch.yellow.checked .uni-switch-input,
-checkbox.yellow.checked .uni-checkbox-input,
-radio.yellow.checked .uni-radio-input {
-	background-color: #fbbd08 !important;
-	border-color: #fbbd08 !important;
-	color: #333333 !important;
-}
-
-switch.olive[checked] .wx-switch-input,
-checkbox.olive[checked] .wx-checkbox-input,
-radio.olive[checked] .wx-radio-input,
-switch.olive.checked .uni-switch-input,
-checkbox.olive.checked .uni-checkbox-input,
-radio.olive.checked .uni-radio-input {
-	background-color: #8dc63f !important;
-	border-color: #8dc63f !important;
-	color: #ffffff !important;
-}
-
-switch.green[checked] .wx-switch-input,
-switch[checked] .wx-switch-input,
-checkbox.green[checked] .wx-checkbox-input,
-checkbox[checked] .wx-checkbox-input,
-radio.green[checked] .wx-radio-input,
-radio[checked] .wx-radio-input,
-switch.green.checked .uni-switch-input,
-switch.checked .uni-switch-input,
-checkbox.green.checked .uni-checkbox-input,
-checkbox.checked .uni-checkbox-input,
-radio.green.checked .uni-radio-input,
-radio.checked .uni-radio-input {
-	background-color: #39b54a !important;
-	border-color: #39b54a !important;
-	color: #ffffff !important;
-	border-color: #39B54A !important;
-}
-
-switch.cyan[checked] .wx-switch-input,
-checkbox.cyan[checked] .wx-checkbox-input,
-radio.cyan[checked] .wx-radio-input,
-switch.cyan.checked .uni-switch-input,
-checkbox.cyan.checked .uni-checkbox-input,
-radio.cyan.checked .uni-radio-input {
-	background-color: #1cbbb4 !important;
-	border-color: #1cbbb4 !important;
-	color: #ffffff !important;
-}
-
-switch.blue[checked] .wx-switch-input,
-checkbox.blue[checked] .wx-checkbox-input,
-radio.blue[checked] .wx-radio-input,
-switch.blue.checked .uni-switch-input,
-checkbox.blue.checked .uni-checkbox-input,
-radio.blue.checked .uni-radio-input {
-	background-color: #0081ff !important;
-	border-color: #0081ff !important;
-	color: #ffffff !important;
-}
-
-switch.purple[checked] .wx-switch-input,
-checkbox.purple[checked] .wx-checkbox-input,
-radio.purple[checked] .wx-radio-input,
-switch.purple.checked .uni-switch-input,
-checkbox.purple.checked .uni-checkbox-input,
-radio.purple.checked .uni-radio-input {
-	background-color: #6739b6 !important;
-	border-color: #6739b6 !important;
-	color: #ffffff !important;
-}
-
-switch.mauve[checked] .wx-switch-input,
-checkbox.mauve[checked] .wx-checkbox-input,
-radio.mauve[checked] .wx-radio-input,
-switch.mauve.checked .uni-switch-input,
-checkbox.mauve.checked .uni-checkbox-input,
-radio.mauve.checked .uni-radio-input {
-	background-color: #9c26b0 !important;
-	border-color: #9c26b0 !important;
-	color: #ffffff !important;
-}
-
-switch.pink[checked] .wx-switch-input,
-checkbox.pink[checked] .wx-checkbox-input,
-radio.pink[checked] .wx-radio-input,
-switch.pink.checked .uni-switch-input,
-checkbox.pink.checked .uni-checkbox-input,
-radio.pink.checked .uni-radio-input {
-	background-color: #e03997 !important;
-	border-color: #e03997 !important;
-	color: #ffffff !important;
-}
-
-switch.brown[checked] .wx-switch-input,
-checkbox.brown[checked] .wx-checkbox-input,
-radio.brown[checked] .wx-radio-input,
-switch.brown.checked .uni-switch-input,
-checkbox.brown.checked .uni-checkbox-input,
-radio.brown.checked .uni-radio-input {
-	background-color: #a5673f !important;
-	border-color: #a5673f !important;
-	color: #ffffff !important;
-}
-
-switch.grey[checked] .wx-switch-input,
-checkbox.grey[checked] .wx-checkbox-input,
-radio.grey[checked] .wx-radio-input,
-switch.grey.checked .uni-switch-input,
-checkbox.grey.checked .uni-checkbox-input,
-radio.grey.checked .uni-radio-input {
-	background-color: #8799a3 !important;
-	border-color: #8799a3 !important;
-	color: #ffffff !important;
-}
-
-switch.gray[checked] .wx-switch-input,
-checkbox.gray[checked] .wx-checkbox-input,
-radio.gray[checked] .wx-radio-input,
-switch.gray.checked .uni-switch-input,
-checkbox.gray.checked .uni-checkbox-input,
-radio.gray.checked .uni-radio-input {
-	background-color: #f0f0f0 !important;
-	border-color: #f0f0f0 !important;
-	color: #333333 !important;
-}
-
-switch.black[checked] .wx-switch-input,
-checkbox.black[checked] .wx-checkbox-input,
-radio.black[checked] .wx-radio-input,
-switch.black.checked .uni-switch-input,
-checkbox.black.checked .uni-checkbox-input,
-radio.black.checked .uni-radio-input {
-	background-color: #333333 !important;
-	border-color: #333333 !important;
-	color: #ffffff !important;
-}
-
-switch.white[checked] .wx-switch-input,
-checkbox.white[checked] .wx-checkbox-input,
-radio.white[checked] .wx-radio-input,
-switch.white.checked .uni-switch-input,
-checkbox.white.checked .uni-checkbox-input,
-radio.white.checked .uni-radio-input {
-	background-color: #ffffff !important;
-	border-color: #ffffff !important;
-	color: #333333 !important;
-}
-
-/* ==================
-          边框
- ==================== */
-
-/* -- 实线 -- */
-
-.solid,
-.solid-top,
-.solid-right,
-.solid-bottom,
-.solid-left,
-.solids,
-.solids-top,
-.solids-right,
-.solids-bottom,
-.solids-left,
-.dashed,
-.dashed-top,
-.dashed-right,
-.dashed-bottom,
-.dashed-left {
-	position: relative;
-}
-
-.solid::after,
-.solid-top::after,
-.solid-right::after,
-.solid-bottom::after,
-.solid-left::after,
-.solids::after,
-.solids-top::after,
-.solids-right::after,
-.solids-bottom::after,
-.solids-left::after,
-.dashed::after,
-.dashed-top::after,
-.dashed-right::after,
-.dashed-bottom::after,
-.dashed-left::after {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border-radius: inherit;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	pointer-events: none;
-	box-sizing: border-box;
-}
-
-.solid::after {
-	border: 1upx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-top::after {
-	border-top: 1upx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-right::after {
-	border-right: 1upx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-bottom::after {
-	border-bottom: 1upx solid rgba(0, 0, 0, 0.1);
-}
-
-.solid-left::after {
-	border-left: 1upx solid rgba(0, 0, 0, 0.1);
-}
-
-.solids::after {
-	border: 8upx solid #eee;
-}
-
-.solids-top::after {
-	border-top: 8upx solid #eee;
-}
-
-.solids-right::after {
-	border-right: 8upx solid #eee;
-}
-
-.solids-bottom::after {
-	border-bottom: 8upx solid #eee;
-}
-
-.solids-left::after {
-	border-left: 8upx solid #eee;
-}
-
-/* -- 虚线 -- */
-
-.dashed::after {
-	border: 1upx dashed #ddd;
-}
-
-.dashed-top::after {
-	border-top: 1upx dashed #ddd;
-}
-
-.dashed-right::after {
-	border-right: 1upx dashed #ddd;
-}
-
-.dashed-bottom::after {
-	border-bottom: 1upx dashed #ddd;
-}
-
-.dashed-left::after {
-	border-left: 1upx dashed #ddd;
-}
-
-/* -- 阴影 -- */
-
-.shadow[class*='white'] {
-	--ShadowSize: 0 1upx 6upx;
-}
-
-.shadow-lg {
-	--ShadowSize: 0upx 40upx 100upx 0upx;
-}
-
-.shadow-warp {
-	position: relative;
-	box-shadow: 0 0 10upx rgba(0, 0, 0, 0.1);
-}
-
-.shadow-warp:before,
-.shadow-warp:after {
-	position: absolute;
-	content: "";
-	top: 20upx;
-	bottom: 30upx;
-	left: 20upx;
-	width: 50%;
-	box-shadow: 0 30upx 20upx rgba(0, 0, 0, 0.2);
-	transform: rotate(-3deg);
-	z-index: -1;
-}
-
-.shadow-warp:after {
-	right: 20upx;
-	left: auto;
-	transform: rotate(3deg);
-}
-
-.shadow-blur {
-	position: relative;
-}
-
-.shadow-blur::before {
-	content: "";
-	display: block;
-	background: inherit;
-	filter: blur(10upx);
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	top: 10upx;
-	left: 10upx;
-	z-index: -1;
-	opacity: 0.4;
-	transform-origin: 0 0;
-	border-radius: inherit;
-	transform: scale(1, 1);
-}
-
-/* ==================
-          按钮
- ==================== */
-
-.cu-btn {
-	position: relative;
-	border: 0upx;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	box-sizing: border-box;
-	padding: 0 30upx;
-	font-size: 28upx;
-	height: 64upx;
-	line-height: 1;
-	text-align: center;
-	text-decoration: none;
-	overflow: visible;
-	margin-left: initial;
-	transform: translate(0upx, 0upx);
-	margin-right: initial;
-}
-
-.cu-btn::after {
-	display: none;
-}
-
-.cu-btn:not([class*="bg-"]) {
-	background-color: #f0f0f0;
-}
-
-.cu-btn[class*="line"] {
-	background-color: transparent;
-}
-
-.cu-btn[class*="line"]::after {
-	content: " ";
-	display: block;
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border: 1upx solid currentColor;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	box-sizing: border-box;
-	border-radius: 12upx;
-	z-index: 1;
-	pointer-events: none;
-}
-
-.cu-btn.round[class*="line"]::after {
-	border-radius: 1000upx;
-}
-
-.cu-btn[class*="lines"]::after {
-	border: 6upx solid currentColor;
-}
-
-.cu-btn[class*="bg-"]::after {
-	display: none;
-}
-
-.cu-btn.sm {
-	padding: 0 20upx;
-	font-size: 20upx;
-	height: 48upx;
-}
-
-.cu-btn.lg {
-	padding: 0 40upx;
-	font-size: 32upx;
-	height: 80upx;
-}
-
-.cu-btn.cuIcon.sm {
-	width: 48upx;
-	height: 48upx;
-}
-
-.cu-btn.cuIcon {
-	width: 64upx;
-	height: 64upx;
-	border-radius: 500upx;
-	padding: 0;
-}
-
-button.cuIcon.lg {
-	width: 80upx;
-	height: 80upx;
-}
-
-.cu-btn.shadow-blur::before {
-	top: 4upx;
-	left: 4upx;
-	filter: blur(6upx);
-	opacity: 0.6;
-}
-
-.cu-btn.button-hover {
-	transform: translate(1upx, 1upx);
-}
-
-.block {
-	display: block;
-}
-
-.cu-btn.block {
-	display: flex;
-}
-
-.cu-btn[disabled] {
-	opacity: 0.6;
-	color: #ffffff;
-}
-
-/* ==================
-          徽章
- ==================== */
-
-.cu-tag {
-	font-size: 24upx;
-	vertical-align: middle;
-	position: relative;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	box-sizing: border-box;
-	padding: 0upx 16upx;
-	height: 48upx;
-	font-family: Helvetica Neue, Helvetica, sans-serif;
-	white-space: nowrap;
-}
-
-.cu-tag:not([class*="bg"]):not([class*="line"]) {
-	background-color: #f1f1f1;
-}
-
-.cu-tag[class*="line-"]::after {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border: 1upx solid currentColor;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	box-sizing: border-box;
-	border-radius: inherit;
-	z-index: 1;
-	pointer-events: none;
-}
-
-.cu-tag.radius[class*="line"]::after {
-	border-radius: 12upx;
-}
-
-.cu-tag.round[class*="line"]::after {
-	border-radius: 1000upx;
-}
-
-.cu-tag[class*="line-"]::after {
-	border-radius: 0;
-}
-
-.cu-tag+.cu-tag {
-	margin-left: 10upx;
-}
-
-.cu-tag.sm {
-	font-size: 20upx;
-	padding: 0upx 12upx;
-	height: 32upx;
-}
-
-.cu-capsule {
-	display: inline-flex;
-	vertical-align: middle;
-}
-
-.cu-capsule+.cu-capsule {
-	margin-left: 10upx;
-}
-
-.cu-capsule .cu-tag {
-	margin: 0;
-}
-
-.cu-capsule .cu-tag[class*="line-"]:last-child::after {
-	border-left: 0upx solid transparent;
-}
-
-.cu-capsule .cu-tag[class*="line-"]:first-child::after {
-	border-right: 0upx solid transparent;
-}
-
-.cu-capsule.radius .cu-tag:first-child {
-	border-top-left-radius: 6upx;
-	border-bottom-left-radius: 6upx;
-}
-
-.cu-capsule.radius .cu-tag:last-child::after,
-.cu-capsule.radius .cu-tag[class*="line-"] {
-	border-top-right-radius: 12upx;
-	border-bottom-right-radius: 12upx;
-}
-
-.cu-capsule.round .cu-tag:first-child {
-	border-top-left-radius: 200upx;
-	border-bottom-left-radius: 200upx;
-	text-indent: 4upx;
-}
-
-.cu-capsule.round .cu-tag:last-child::after,
-.cu-capsule.round .cu-tag:last-child {
-	border-top-right-radius: 200upx;
-	border-bottom-right-radius: 200upx;
-	text-indent: -4upx;
-}
-
-.cu-tag.badge {
-	border-radius: 200upx;
-	position: absolute;
-	top: -10upx;
-	right: -10upx;
-	font-size: 20upx;
-	padding: 0upx 10upx;
-	height: 28upx;
-	color: #ffffff;
-}
-
-.cu-tag.badge:not([class*="bg-"]) {
-	background-color: #dd514c;
-}
-
-.cu-tag:empty:not([class*="cuIcon-"]) {
-	padding: 0upx;
-	width: 16upx;
-	height: 16upx;
-	top: -4upx;
-	right: -4upx;
-}
-
-.cu-tag[class*="cuIcon-"] {
-	width: 32upx;
-	height: 32upx;
-	top: -4upx;
-	right: -4upx;
-}
-
-/* ==================
-          头像
- ==================== */
-
-.cu-avatar {
-	font-variant: small-caps;
-	margin: 0;
-	padding: 0;
-	display: inline-flex;
-	text-align: center;
-	justify-content: center;
-	align-items: center;
-	background-color: #ccc;
-	color: #ffffff;
-	white-space: nowrap;
-	position: relative;
-	width: 64upx;
-	height: 64upx;
-	background-size: cover;
-	background-position: center;
-	vertical-align: middle;
-	font-size: 1.5em;
-}
-
-.cu-avatar.sm {
-	width: 48upx;
-	height: 48upx;
-	font-size: 1em;
-}
-
-.cu-avatar.lg {
-	width: 96upx;
-	height: 96upx;
-	font-size: 2em;
-}
-
-.cu-avatar.xl {
-	width: 128upx;
-	height: 128upx;
-	font-size: 2.5em;
-}
-
-.cu-avatar .avatar-text {
-	font-size: 0.4em;
-}
-
-.cu-avatar-group {
-	direction: rtl;
-	unicode-bidi: bidi-override;
-	padding: 0 10upx 0 40upx;
-	display: inline-block;
-}
-
-.cu-avatar-group .cu-avatar {
-	margin-left: -30upx;
-	border: 4upx solid #f1f1f1;
-	vertical-align: middle;
-}
-
-.cu-avatar-group .cu-avatar.sm {
-	margin-left: -20upx;
-	border: 1upx solid #f1f1f1;
-}
-
-/* ==================
-         进度条
- ==================== */
-
-.cu-progress {
-	overflow: hidden;
-	height: 28upx;
-	background-color: #ebeef5;
-	display: inline-flex;
-	align-items: center;
-	width: 100%;
-}
-
-.cu-progress+view,
-.cu-progress+text {
-	line-height: 1;
-}
-
-.cu-progress.xs {
-	height: 10upx;
-}
-
-.cu-progress.sm {
-	height: 20upx;
-}
-
-.cu-progress view {
-	width: 0;
-	height: 100%;
-	align-items: center;
-	display: flex;
-	justify-items: flex-end;
-	justify-content: space-around;
-	font-size: 20upx;
-	color: #ffffff;
-	transition: width 0.6s ease;
-}
-
-.cu-progress text {
-	align-items: center;
-	display: flex;
-	font-size: 20upx;
-	color: #333333;
-	text-indent: 10upx;
-}
-
-.cu-progress.text-progress {
-	padding-right: 60upx;
-}
-
-.cu-progress.striped view {
-	background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
-	background-size: 72upx 72upx;
-}
-
-.cu-progress.active view {
-	animation: progress-stripes 2s linear infinite;
-}
-
-@keyframes progress-stripes {
-	from {
-		background-position: 72upx 0;
-	}
-
-	to {
-		background-position: 0 0;
-	}
-}
-
-/* ==================
-          加载
- ==================== */
-
-.cu-load {
-	display: block;
-	line-height: 3em;
-	text-align: center;
-}
-
-.cu-load::before {
-	font-family: "cuIcon";
-	display: inline-block;
-	margin-right: 6upx;
-}
-
-.cu-load.loading::before {
-	content: "\e67a";
-	animation: cuIcon-spin 2s infinite linear;
-}
-
-/* .cu-load.loading::after {
-	content: "加载中...";
-} */
-
-.cu-load.over::before {
-	content: "\e64a";
-}
-
-.cu-load.over::after {
-	content: "没有更多了";
-}
-
-.cu-load.erro::before {
-	content: "\e658";
-}
-
-.cu-load.erro::after {
-	content: "加载失败";
-}
-
-.cu-load.load-cuIcon::before {
-	font-size: 32upx;
-}
-
-.cu-load.load-cuIcon::after {
-	display: none;
-}
-
-.cu-load.load-cuIcon.over {
-	display: none;
-}
-
-.cu-load.load-modal {
-	position: fixed;
-	top: 0;
-	right: 0;
-	bottom: 140upx;
-	left: 0;
-	margin: auto;
-	width: 260upx;
-	height: 260upx;
-	background-color: #ffffff;
-	border-radius: 10upx;
-	box-shadow: 0 0 0upx 2000upx rgba(0, 0, 0, 0.5);
-	display: flex;
-	align-items: center;
-	flex-direction: column;
-	justify-content: center;
-	font-size: 28upx;
-	z-index: 9999;
-	line-height: 2.4em;
-}
-
-.cu-load.load-modal [class*="cuIcon-"] {
-	font-size: 60upx;
-}
-
-.cu-load.load-modal image {
-	width: 70upx;
-	height: 70upx;
-}
-
-.cu-load.load-modal::after {
-	content: "";
-	position: absolute;
-	background-color: #ffffff;
-	border-radius: 50%;
-	width: 200upx;
-	height: 200upx;
-	font-size: 10px;
-	border-top: 6upx solid rgba(0, 0, 0, 0.05);
-	border-right: 6upx solid rgba(0, 0, 0, 0.05);
-	border-bottom: 6upx solid rgba(0, 0, 0, 0.05);
-	border-left: 6upx solid #f37b1d;
-	animation: cuIcon-spin 1s infinite linear;
-	z-index: -1;
-}
-
-.load-progress {
-	pointer-events: none;
-	top: 0;
-	position: fixed;
-	width: 100%;
-	left: 0;
-	z-index: 2000;
-}
-
-.load-progress.hide {
-	display: none;
-}
-
-.load-progress .load-progress-bar {
-	position: relative;
-	width: 100%;
-	height: 4upx;
-	overflow: hidden;
-	transition: all 200ms ease 0s;
-}
-
-.load-progress .load-progress-spinner {
-	position: absolute;
-	top: 10upx;
-	right: 10upx;
-	z-index: 2000;
-	display: block;
-}
-
-.load-progress .load-progress-spinner::after {
-	content: "";
-	display: block;
-	width: 24upx;
-	height: 24upx;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-	border: solid 4upx transparent;
-	border-top-color: inherit;
-	border-left-color: inherit;
-	border-radius: 50%;
-	-webkit-animation: load-progress-spinner 0.4s linear infinite;
-	animation: load-progress-spinner 0.4s linear infinite;
-}
-
-@-webkit-keyframes load-progress-spinner {
-	0% {
-		-webkit-transform: rotate(0);
-		transform: rotate(0);
-	}
-
-	100% {
-		-webkit-transform: rotate(360deg);
-		transform: rotate(360deg);
-	}
-}
-
-@keyframes load-progress-spinner {
-	0% {
-		-webkit-transform: rotate(0);
-		transform: rotate(0);
-	}
-
-	100% {
-		-webkit-transform: rotate(360deg);
-		transform: rotate(360deg);
-	}
-}
-
-/* ==================
-          列表
- ==================== */
-.grayscale {
-	filter: grayscale(1);
-}
-
-.cu-list+.cu-list {
-	margin-top: 30upx
-}
-
-.cu-list>.cu-item {
-	transition: all .6s ease-in-out 0s;
-	transform: translateX(0upx)
-}
-
-.cu-list>.cu-item.move-cur {
-	transform: translateX(-260upx)
-}
-
-.cu-list>.cu-item .move {
-	position: absolute;
-	right: 0;
-	display: flex;
-	width: 260upx;
-	height: 100%;
-	transform: translateX(100%)
-}
-
-.cu-list>.cu-item .move view {
-	display: flex;
-	flex: 1;
-	justify-content: center;
-	align-items: center
-}
-
-.cu-list.menu-avatar {
-	overflow: hidden;
-}
-
-.cu-list.menu-avatar>.cu-item {
-	position: relative;
-	display: flex;
-	padding-right: 10upx;
-	height: 140upx;
-	background-color: #ffffff;
-	justify-content: flex-end;
-	align-items: center
-}
-
-.cu-list.menu-avatar>.cu-item>.cu-avatar {
-	position: absolute;
-	left: 30upx
-}
-
-.cu-list.menu-avatar>.cu-item .flex .text-cut {
-	max-width: 510upx
-}
-
-.cu-list.menu-avatar>.cu-item .content {
-	position: absolute;
-	left: 146upx;
-	width: calc(100% - 96upx - 60upx - 120upx - 20upx);
-	line-height: 1.6em;
-}
-
-.cu-list.menu-avatar>.cu-item .content.flex-sub {
-	width: calc(100% - 96upx - 60upx - 20upx);
-}
-
-.cu-list.menu-avatar>.cu-item .content>view:first-child {
-	font-size: 30upx;
-	display: flex;
-	align-items: center
-}
-
-.cu-list.menu-avatar>.cu-item .content .cu-tag.sm {
-	display: inline-block;
-	margin-left: 10upx;
-	height: 28upx;
-	font-size: 16upx;
-	line-height: 32upx
-}
-
-.cu-list.menu-avatar>.cu-item .action {
-	width: 100upx;
-	text-align: center
-}
-
-.cu-list.menu-avatar>.cu-item .action view+view {
-	margin-top: 10upx
-}
-
-.cu-list.menu-avatar.comment>.cu-item .content {
-	position: relative;
-	left: 0;
-	width: auto;
-	flex: 1;
-}
-
-.cu-list.menu-avatar.comment>.cu-item {
-	padding: 30upx 30upx 30upx 120upx;
-	height: auto
-}
-
-.cu-list.menu-avatar.comment .cu-avatar {
-	align-self: flex-start
-}
-
-.cu-list.menu>.cu-item {
-	position: relative;
-	display: flex;
-	padding: 0 30upx;
-	min-height: 100upx;
-	background-color: #ffffff;
-	justify-content: space-between;
-	align-items: center
-}
-
-.cu-list.menu>.cu-item:last-child:after {
-	border: none
-}
-
-.cu-list.menu-avatar>.cu-item:after,
-.cu-list.menu>.cu-item:after {
-	position: absolute;
-	top: 0;
-	left: 0;
-	box-sizing: border-box;
-	width: 200%;
-	height: 200%;
-	border-bottom: 1upx solid #ddd;
-	border-radius: inherit;
-	content: " ";
-	transform: scale(.5);
-	transform-origin: 0 0;
-	pointer-events: none
-}
-
-.cu-list.menu>.cu-item.grayscale {
-	background-color: #f5f5f5
-}
-
-.cu-list.menu>.cu-item.cur {
-	background-color: #fcf7e9
-}
-
-.cu-list.menu>.cu-item.arrow {
-	padding-right: 90upx
-}
-
-.cu-list.menu>.cu-item.arrow:before {
-	position: absolute;
-	top: 0;
-	right: 30upx;
-	bottom: 0;
-	display: block;
-	margin: auto;
-	width: 30upx;
-	height: 30upx;
-	color: #8799a3;
-	content: "\e6a3";
-	text-align: center;
-	font-size: 34upx;
-	font-family: cuIcon;
-	line-height: 30upx
-}
-
-.cu-form-group .arrow::after {
-	font-family: cuIcon;
-	display: block;
-	content: "\e6a3";
-	position: absolute;
-	font-size: 34upx;
-	color: #8799a3;
-	line-height: 100upx;
-	width: 60upx;
-	text-align: center;
-	top: 10upx;
-	bottom: 0;
-	right: -20upx;
-	margin: auto;
-}
-
-.cu-list.menu>.cu-item button.content {
-	padding: 0;
-	background-color: transparent;
-	justify-content: flex-start
-}
-
-.cu-list.menu>.cu-item button.content:after {
-	display: none
-}
-
-.cu-list.menu>.cu-item .cu-avatar-group .cu-avatar {
-	border-color: #ffffff
-}
-
-.cu-list.menu>.cu-item .content>view:first-child {
-	display: flex;
-	align-items: center
-}
-
-.cu-list.menu>.cu-item .content>text[class*=cuIcon] {
-	display: inline-block;
-	margin-right: 10upx;
-	width: 1.6em;
-	text-align: center
-}
-
-.cu-list.menu>.cu-item .content>image {
-	display: inline-block;
-	margin-right: 10upx;
-	width: 1.6em;
-	height: 1.6em;
-	vertical-align: middle
-}
-
-.cu-list.menu>.cu-item .content {
-	font-size: 30upx;
-	line-height: 1.6em;
-	flex: 1
-}
-
-.cu-list.menu>.cu-item .content .cu-tag.sm {
-	display: inline-block;
-	margin-left: 10upx;
-	height: 28upx;
-	font-size: 16upx;
-	line-height: 32upx
-}
-
-.cu-list.menu>.cu-item .action .cu-tag:empty {
-	right: 10upx
-}
-
-.cu-list.menu {
-	display: block;
-	overflow: hidden
-}
-
-.cu-list.menu.sm-border>.cu-item:after {
-	left: 30upx;
-	width: calc(200% - 120upx)
-}
-
-.cu-list.grid>.cu-item {
-	position: relative;
-	display: flex;
-	padding: 20upx 0 30upx;
-	transition-duration: 0s;
-	flex-direction: column
-}
-
-.cu-list.grid>.cu-item:after {
-	position: absolute;
-	top: 0;
-	left: 0;
-	box-sizing: border-box;
-	width: 200%;
-	height: 200%;
-	border-right: 1px solid rgba(0, 0, 0, .1);
-	border-bottom: 1px solid rgba(0, 0, 0, .1);
-	border-radius: inherit;
-	content: " ";
-	transform: scale(.5);
-	transform-origin: 0 0;
-	pointer-events: none
-}
-
-.cu-list.grid>.cu-item text {
-	display: block;
-	margin-top: 10upx;
-	color: #888;
-	font-size: 26upx;
-	line-height: 40upx
-}
-
-.cu-list.grid>.cu-item [class*=cuIcon] {
-	position: relative;
-	display: block;
-	margin-top: 20upx;
-	width: 100%;
-	font-size: 48upx
-}
-
-.cu-list.grid>.cu-item .cu-tag {
-	right: auto;
-	left: 50%;
-	margin-left: 20upx
-}
-
-.cu-list.grid {
-	background-color: #ffffff;
-	text-align: center
-}
-
-.cu-list.grid.no-border>.cu-item {
-	padding-top: 10upx;
-	padding-bottom: 20upx
-}
-
-.cu-list.grid.no-border>.cu-item:after {
-	border: none
-}
-
-.cu-list.grid.no-border {
-	padding: 20upx 10upx
-}
-
-.cu-list.grid.col-3>.cu-item:nth-child(3n):after,
-.cu-list.grid.col-4>.cu-item:nth-child(4n):after,
-.cu-list.grid.col-5>.cu-item:nth-child(5n):after {
-	border-right-width: 0
-}
-
-.cu-list.card-menu {
-	overflow: hidden;
-	margin-right: 30upx;
-	margin-left: 30upx;
-	border-radius: 20upx
-}
-
-
-/* ==================
-          操作条
- ==================== */
-
-.cu-bar {
-	display: flex;
-	position: relative;
-	align-items: center;
-	min-height: 100upx;
-	justify-content: space-between;
-}
-
-.cu-bar .action {
-	display: flex;
-	align-items: center;
-	height: 100%;
-	justify-content: center;
-	max-width: 100%;
-}
-
-.cu-bar .action.border-title {
-	position: relative;
-	top: -10upx;
-}
-
-.cu-bar .action.border-title text[class*="bg-"]:last-child {
-	position: absolute;
-	bottom: -0.5rem;
-	min-width: 2rem;
-	height: 6upx;
-	left: 0;
-}
-
-.cu-bar .action.sub-title {
-	position: relative;
-	top: -0.2rem;
-}
-
-.cu-bar .action.sub-title text {
-	position: relative;
-	z-index: 1;
-}
-
-.cu-bar .action.sub-title text[class*="bg-"]:last-child {
-	position: absolute;
-	display: inline-block;
-	bottom: -0.2rem;
-	border-radius: 6upx;
-	width: 100%;
-	height: 0.6rem;
-	left: 0.6rem;
-	opacity: 0.3;
-	z-index: 0;
-}
-
-.cu-bar .action.sub-title text[class*="text-"]:last-child {
-	position: absolute;
-	display: inline-block;
-	bottom: -0.7rem;
-	left: 0.5rem;
-	opacity: 0.2;
-	z-index: 0;
-	text-align: right;
-	font-weight: 900;
-	font-size: 36upx;
-}
-
-.cu-bar.justify-center .action.border-title text:last-child,
-.cu-bar.justify-center .action.sub-title text:last-child {
-	left: 0;
-	right: 0;
-	margin: auto;
-	text-align: center;
-}
-
-.cu-bar .action:first-child {
-	margin-left: 30upx;
-	font-size: 30upx;
-}
-
-.cu-bar .action text.text-cut {
-	text-align: left;
-	width: 100%;
-}
-
-.cu-bar .cu-avatar:first-child {
-	margin-left: 20upx;
-}
-
-.cu-bar .action:first-child>text[class*="cuIcon-"] {
-	margin-left: -0.3em;
-	margin-right: 0.3em;
-}
-
-.cu-bar .action:last-child {
-	margin-right: 30upx;
-}
-
-.cu-bar .action>text[class*="cuIcon-"],
-.cu-bar .action>view[class*="cuIcon-"] {
-	font-size: 36upx;
-}
-
-.cu-bar .action>text[class*="cuIcon-"]+text[class*="cuIcon-"] {
-	margin-left: 0.5em;
-}
-
-.cu-bar .content {
-	position: absolute;
-	text-align: center;
-	width: calc(100% - 340upx);
-	left: 0;
-	right: 0;
-	bottom: 0;
-	top: 0;
-	margin: auto;
-	height: 60upx;
-	font-size: 32upx;
-	line-height: 60upx;
-	cursor: none;
-	pointer-events: none;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	overflow: hidden;
-}
-
-.cu-bar.ios .content {
-	bottom: 7px;
-	height: 30px;
-	font-size: 32upx;
-	line-height: 30px;
-}
-
-.cu-bar.btn-group {
-	justify-content: space-around;
-}
-
-.cu-bar.btn-group button {
-	padding: 20upx 32upx;
-}
-
-.cu-bar.btn-group button {
-	flex: 1;
-	margin: 0 20upx;
-	max-width: 50%;
-}
-
-.cu-bar .search-form {
-	background-color: #f5f5f5;
-	line-height: 64upx;
-	height: 64upx;
-	font-size: 24upx;
-	color: #333333;
-	flex: 1;
-	display: flex;
-	align-items: center;
-	margin: 0 30upx;
-}
-
-.cu-bar .search-form+.action {
-	margin-right: 30upx;
-}
-
-.cu-bar .search-form input {
-	flex: 1;
-	padding-right: 30upx;
-	height: 64upx;
-	line-height: 64upx;
-	font-size: 26upx;
-	background-color: transparent;
-}
-
-.cu-bar .search-form [class*="cuIcon-"] {
-	margin: 0 0.5em 0 0.8em;
-}
-
-.cu-bar .search-form [class*="cuIcon-"]::before {
-	top: 0upx;
-}
-
-.cu-bar.fixed,
-.nav.fixed {
-	position: fixed;
-	width: 100%;
-	top: 0;
-	z-index: 1024;
-	box-shadow: 0 1upx 6upx rgba(0, 0, 0, 0.1);
-}
-
-.cu-bar.foot {
-	position: fixed;
-	width: 100%;
-	bottom: 0;
-	z-index: 1024;
-	box-shadow: 0 -1upx 6upx rgba(0, 0, 0, 0.1);
-}
-
-.cu-bar.tabbar {
-	padding: 0;
-	height: calc(100upx + env(safe-area-inset-bottom) / 2);
-	padding-bottom: calc(env(safe-area-inset-bottom) / 2);
-}
-
-.cu-tabbar-height {
-	min-height: 100upx;
-	height: calc(100upx + env(safe-area-inset-bottom) / 2);
-}
-
-.cu-bar.tabbar.shadow {
-	box-shadow: 0 -1upx 6upx rgba(0, 0, 0, 0.1);
-}
-
-.cu-bar.tabbar .action {
-	font-size: 22upx;
-	position: relative;
-	flex: 1;
-	text-align: center;
-	padding: 0;
-	display: block;
-	height: auto;
-	line-height: 1;
-	margin: 0;
-	background-color: inherit;
-	overflow: initial;
-}
-
-.cu-bar.tabbar.shop .action {
-	width: 140upx;
-	flex: initial;
-}
-
-.cu-bar.tabbar .action.add-action {
-	position: relative;
-	z-index: 2;
-	padding-top: 50upx;
-}
-
-.cu-bar.tabbar .action.add-action [class*="cuIcon-"] {
-	position: absolute;
-	width: 70upx;
-	z-index: 2;
-	height: 70upx;
-	border-radius: 50%;
-	line-height: 70upx;
-	font-size: 50upx;
-	top: -35upx;
-	left: 0;
-	right: 0;
-	margin: auto;
-	padding: 0;
-}
-
-.cu-bar.tabbar .action.add-action::after {
-	content: "";
-	position: absolute;
-	width: 100upx;
-	height: 100upx;
-	top: -50upx;
-	left: 0;
-	right: 0;
-	margin: auto;
-	box-shadow: 0 -3upx 8upx rgba(0, 0, 0, 0.08);
-	border-radius: 50upx;
-	background-color: inherit;
-	z-index: 0;
-}
-
-.cu-bar.tabbar .action.add-action::before {
-	content: "";
-	position: absolute;
-	width: 100upx;
-	height: 30upx;
-	bottom: 30upx;
-	left: 0;
-	right: 0;
-	margin: auto;
-	background-color: inherit;
-	z-index: 1;
-}
-
-.cu-bar.tabbar .btn-group {
-	flex: 1;
-	display: flex;
-	justify-content: space-around;
-	align-items: center;
-	padding: 0 10upx;
-}
-
-.cu-bar.tabbar button.action::after {
-	border: 0;
-}
-
-.cu-bar.tabbar .action [class*="cuIcon-"] {
-	width: 100upx;
-	position: relative;
-	display: block;
-	height: auto;
-	margin: 0 auto 10upx;
-	text-align: center;
-	font-size: 40upx;
-}
-
-.cu-bar.tabbar .action .cuIcon-cu-image {
-	margin: 0 auto;
-}
-
-.cu-bar.tabbar .action .cuIcon-cu-image image {
-	width: 50upx;
-	height: 50upx;
-	display: inline-block;
-}
-
-.cu-bar.tabbar .submit {
-	align-items: center;
-	display: flex;
-	justify-content: center;
-	text-align: center;
-	position: relative;
-	flex: 2;
-	align-self: stretch;
-}
-
-.cu-bar.tabbar .submit:last-child {
-	flex: 2.6;
-}
-
-.cu-bar.tabbar .submit+.submit {
-	flex: 2;
-}
-
-.cu-bar.tabbar.border .action::before {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	border-right: 1upx solid rgba(0, 0, 0, 0.1);
-	z-index: 3;
-}
-
-.cu-bar.tabbar.border .action:last-child:before {
-	display: none;
-}
-
-.cu-bar.input {
-	padding-right: 20upx;
-	background-color: #ffffff;
-}
-
-.cu-bar.input input {
-	overflow: initial;
-	line-height: 64upx;
-	height: 64upx;
-	min-height: 64upx;
-	flex: 1;
-	font-size: 30upx;
-	margin: 0 20upx;
-}
-
-.cu-bar.input .action {
-	margin-left: 20upx;
-}
-
-.cu-bar.input .action [class*="cuIcon-"] {
-	font-size: 48upx;
-}
-
-.cu-bar.input input+.action {
-	margin-right: 20upx;
-	margin-left: 0upx;
-}
-
-.cu-bar.input .action:first-child [class*="cuIcon-"] {
-	margin-left: 0upx;
-}
-
-.cu-custom {
-	display: block;
-	position: relative;
-}
-
-.cu-custom .cu-bar .content {
-	width: calc(100% - 440upx);
-}
-
-/* #ifdef MP-ALIPAY */
-.cu-custom .cu-bar .action .cuIcon-back {
-	opacity: 0;
-}
-
-/* #endif */
-
-.cu-custom .cu-bar .content image {
-	height: 60upx;
-	width: 240upx;
-}
-
-.cu-custom .cu-bar {
-	min-height: 0px;
-	/* #ifdef MP-WEIXIN */
-	padding-right: 220upx;
-	/* #endif */
-	/* #ifdef MP-ALIPAY */
-	padding-right: 150upx;
-	/* #endif */
-	box-shadow: 0upx 0upx 0upx;
-	z-index: 9999;
-}
-
-.cu-custom .cu-bar .border-custom {
-	position: relative;
-	background: rgba(0, 0, 0, 0.15);
-	border-radius: 1000upx;
-	height: 30px;
-}
-
-.cu-custom .cu-bar .border-custom::after {
-	content: " ";
-	width: 200%;
-	height: 200%;
-	position: absolute;
-	top: 0;
-	left: 0;
-	border-radius: inherit;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	pointer-events: none;
-	box-sizing: border-box;
-	border: 1upx solid #ffffff;
-	opacity: 0.5;
-}
-
-.cu-custom .cu-bar .border-custom::before {
-	content: " ";
-	width: 1upx;
-	height: 110%;
-	position: absolute;
-	top: 22.5%;
-	left: 0;
-	right: 0;
-	margin: auto;
-	transform: scale(0.5);
-	transform-origin: 0 0;
-	pointer-events: none;
-	box-sizing: border-box;
-	opacity: 0.6;
-	background-color: #ffffff;
-}
-
-.cu-custom .cu-bar .border-custom text {
-	display: block;
-	flex: 1;
-	margin: auto !important;
-	text-align: center;
-	font-size: 34upx;
-}
-
-/* ==================
-         导航栏
- ==================== */
-
-.nav {
-	white-space: nowrap;
-}
-
-::-webkit-scrollbar {
-	display: none;
-}
-
-.nav .cu-item {
-	height: 90upx;
-	display: inline-block;
-	line-height: 90upx;
-	margin: 0 10upx;
-	padding: 0 20upx;
-}
-
-.nav .cu-item.cur {
-	border-bottom: 4upx solid;
-}
-
-/* ==================
-         时间轴
- ==================== */
-
-.cu-timeline {
-	display: block;
-	background-color: #ffffff;
-}
-
-.cu-timeline .cu-time {
-	width: 120upx;
-	text-align: center;
-	padding: 20upx 0;
-	font-size: 26upx;
-	color: #888;
-	display: block;
-}
-
-.cu-timeline>.cu-item {
-	padding: 30upx 30upx 30upx 120upx;
-	position: relative;
-	display: block;
-	z-index: 0;
-}
-
-.cu-timeline>.cu-item:not([class*="text-"]) {
-	color: #ccc;
-}
-
-.cu-timeline>.cu-item::after {
-	content: "";
-	display: block;
-	position: absolute;
-	width: 1upx;
-	background-color: #ddd;
-	left: 60upx;
-	height: 100%;
-	top: 0;
-	z-index: 8;
-}
-
-.cu-timeline>.cu-item::before {
-	font-family: "cuIcon";
-	display: block;
-	position: absolute;
-	top: 36upx;
-	z-index: 9;
-	background-color: #ffffff;
-	width: 50upx;
-	height: 50upx;
-	text-align: center;
-	border: none;
-	line-height: 50upx;
-	left: 36upx;
-}
-
-.cu-timeline>.cu-item:not([class*="cuIcon-"])::before {
-	content: "\e763";
-}
-
-.cu-timeline>.cu-item[class*="cuIcon-"]::before {
-	background-color: #ffffff;
-	width: 50upx;
-	height: 50upx;
-	text-align: center;
-	border: none;
-	line-height: 50upx;
-	left: 36upx;
-}
-
-.cu-timeline>.cu-item>.content {
-	padding: 30upx;
-	border-radius: 6upx;
-	display: block;
-	line-height: 1.6;
-}
-
-.cu-timeline>.cu-item>.content:not([class*="bg-"]) {
-	background-color: #f1f1f1;
-	color: #333333;
-}
-
-.cu-timeline>.cu-item>.content+.content {
-	margin-top: 20upx;
-}
-
-/* ==================
-         聊天
- ==================== */
-
-.cu-chat {
-	display: flex;
-	flex-direction: column;
-}
-
-.cu-chat .cu-item {
-	display: flex;
-	padding: 30upx 30upx 70upx;
-	position: relative;
-}
-
-.cu-chat .cu-item>.cu-avatar {
-	width: 80upx;
-	height: 80upx;
-}
-
-.cu-chat .cu-item>.main {
-	max-width: calc(100% - 260upx);
-	margin: 0 40upx;
-	display: flex;
-	align-items: center;
-}
-
-.cu-chat .cu-item>image {
-	height: 320upx;
-}
-
-.cu-chat .cu-item>.main .content {
-	padding: 20upx;
-	border-radius: 6upx;
-	display: inline-flex;
-	max-width: 100%;
-	align-items: center;
-	font-size: 30upx;
-	position: relative;
-	min-height: 80upx;
-	line-height: 40upx;
-	text-align: left;
-}
-
-.cu-chat .cu-item>.main .content:not([class*="bg-"]) {
-	background-color: #ffffff;
-	color: #333333;
-}
-
-.cu-chat .cu-item .date {
-	position: absolute;
-	font-size: 24upx;
-	color: #8799a3;
-	width: calc(100% - 320upx);
-	bottom: 20upx;
-	left: 160upx;
-}
-
-.cu-chat .cu-item .action {
-	padding: 0 30upx;
-	display: flex;
-	align-items: center;
-}
-
-.cu-chat .cu-item>.main .content::after {
-	content: "";
-	top: 27upx;
-	transform: rotate(45deg);
-	position: absolute;
-	z-index: 100;
-	display: inline-block;
-	overflow: hidden;
-	width: 24upx;
-	height: 24upx;
-	left: -12upx;
-	right: initial;
-	background-color: inherit;
-}
-
-.cu-chat .cu-item.self>.main .content::after {
-	left: auto;
-	right: -12upx;
-}
-
-.cu-chat .cu-item>.main .content::before {
-	content: "";
-	top: 30upx;
-	transform: rotate(45deg);
-	position: absolute;
-	z-index: -1;
-	display: inline-block;
-	overflow: hidden;
-	width: 24upx;
-	height: 24upx;
-	left: -12upx;
-	right: initial;
-	background-color: inherit;
-	filter: blur(5upx);
-	opacity: 0.3;
-}
-
-.cu-chat .cu-item>.main .content:not([class*="bg-"])::before {
-	background-color: #333333;
-	opacity: 0.1;
-}
-
-.cu-chat .cu-item.self>.main .content::before {
-	left: auto;
-	right: -12upx;
-}
-
-.cu-chat .cu-item.self {
-	justify-content: flex-end;
-	text-align: right;
-}
-
-.cu-chat .cu-info {
-	display: inline-block;
-	margin: 20upx auto;
-	font-size: 24upx;
-	padding: 8upx 12upx;
-	background-color: rgba(0, 0, 0, 0.2);
-	border-radius: 6upx;
-	color: #ffffff;
-	max-width: 400upx;
-	line-height: 1.4;
-}
-
-/* ==================
-         卡片
- ==================== */
-
-.cu-card {
-	display: block;
-	overflow: hidden;
-}
-
-.cu-card>.cu-item {
-	display: block;
-	background-color: #ffffff;
-	overflow: hidden;
-	border-radius: 10upx;
-	margin: 30upx;
-}
-
-.cu-card>.cu-item.shadow-blur {
-	overflow: initial;
-}
-
-.cu-card.no-card>.cu-item {
-	margin: 0upx;
-	border-radius: 0upx;
-}
-
-.cu-card .grid.grid-square {
-	margin-bottom: -20upx;
-}
-
-.cu-card.case .image {
-	position: relative;
-}
-
-.cu-card.case .image image {
-	width: 100%;
-}
-
-.cu-card.case .image .cu-tag {
-	position: absolute;
-	right: 0;
-	top: 0;
-}
-
-.cu-card.case .image .cu-bar {
-	position: absolute;
-	bottom: 0;
-	width: 100%;
-	background-color: transparent;
-	padding: 0upx 30upx;
-}
-
-.cu-card.case.no-card .image {
-	margin: 30upx 30upx 0;
-	overflow: hidden;
-	border-radius: 10upx;
-}
-
-.cu-card.dynamic {
-	display: block;
-}
-
-.cu-card.dynamic>.cu-item {
-	display: block;
-	background-color: #ffffff;
-	overflow: hidden;
-}
-
-.cu-card.dynamic>.cu-item>.text-content {
-	padding: 0 30upx 0;
-	max-height: 6.4em;
-	overflow: hidden;
-	font-size: 30upx;
-	margin-bottom: 20upx;
-}
-
-.cu-card.dynamic>.cu-item .square-img {
-	width: 100%;
-	height: 200upx;
-	border-radius: 6upx;
-}
-
-.cu-card.dynamic>.cu-item .only-img {
-	width: 100%;
-	height: 320upx;
-	border-radius: 6upx;
-}
-
-/* card.dynamic>.cu-item .comment {
-  padding: 20upx;
-  background-color: #f1f1f1;
-  margin: 0 30upx 30upx;
-  border-radius: 6upx;
-} */
-
-.cu-card.article {
-	display: block;
-}
-
-.cu-card.article>.cu-item {
-	padding-bottom: 30upx;
-}
-
-.cu-card.article>.cu-item .title {
-	font-size: 30upx;
-	font-weight: 900;
-	color: #333333;
-	line-height: 100upx;
-	padding: 0 30upx;
-}
-
-.cu-card.article>.cu-item .content {
-	display: flex;
-	padding: 0 30upx;
-}
-
-.cu-card.article>.cu-item .content>image {
-	width: 240upx;
-	height: 6.4em;
-	margin-right: 20upx;
-	border-radius: 6upx;
-}
-
-.cu-card.article>.cu-item .content .desc {
-	flex: 1;
-	display: flex;
-	flex-direction: column;
-	justify-content: space-between;
-}
-
-.cu-card.article>.cu-item .content .text-content {
-	font-size: 28upx;
-	color: #888;
-	height: 4.8em;
-	overflow: hidden;
-}
-
-/* ==================
-         表单
- ==================== */
-
-.cu-form-group {
-	background-color: #ffffff;
-	padding: 1upx 30upx;
-	display: flex;
-	align-items: center;
-	min-height: 100upx;
-	justify-content: space-between;
-}
-
-
-.cu-form-group .title {
-	text-align: justify;
-	padding-right: 30upx;
-	font-size: 30upx;
-	position: relative;
-	height: 60upx;
-	line-height: 60upx;
-}
-
-.cu-form-group input {
-	flex: 1;
-	font-size: 30upx;
-	color: #555;
-	padding-right: 20upx;
-}
-
-.cu-form-group>text[class*="cuIcon-"] {
-	font-size: 36upx;
-	padding: 0;
-	box-sizing: border-box;
-}
-
-.cu-form-group textarea {
-	margin: 32upx 0 30upx;
-	height: 4.6em;
-	width: 100%;
-	line-height: 1.2em;
-	flex: 1;
-	font-size: 28upx;
-	padding: 0;
-}
-
-.cu-form-group.align-start .title {
-	height: 1em;
-	margin-top: 32upx;
-	line-height: 1em;
-}
-
-.cu-form-group picker {
-	flex: 1;
-	padding-right: 40upx;
-	overflow: hidden;
-	position: relative;
-}
-
-.cu-form-group picker .picker {
-	line-height: 100upx;
-	font-size: 28upx;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	overflow: hidden;
-	width: 100%;
-	text-align: right;
-}
-
-.cu-form-group picker::after {
-	font-family: cuIcon;
-	display: block;
-	content: "\e6a3";
-	position: absolute;
-	font-size: 34upx;
-	color: #8799a3;
-	line-height: 100upx;
-	width: 60upx;
-	text-align: center;
-	top: 0;
-	bottom: 0;
-	right: -20upx;
-	margin: auto;
-}
-
-.cu-form-group textarea[disabled],
-.cu-form-group textarea[disabled] .placeholder {
-	color: transparent;
-}
-
-/* ==================
-         模态窗口
- ==================== */
-
-.cu-modal {
-	position: fixed;
-	top: 0;
-	right: 0;
-	bottom: 0;
-	left: 0;
-	z-index: 1110;
-	opacity: 0;
-	outline: 0;
-	text-align: center;
-	-ms-transform: scale(1.185);
-	transform: scale(1.185);
-	backface-visibility: hidden;
-	perspective: 2000upx;
-	background: rgba(0, 0, 0, 0.6);
-	transition: all 0.3s ease-in-out 0s;
-	pointer-events: none;
-}
-
-.cu-modal::before {
-	content: "\200B";
-	display: inline-block;
-	height: 100%;
-	vertical-align: middle;
-}
-
-.cu-modal.show {
-	opacity: 1;
-	transition-duration: 0.3s;
-	-ms-transform: scale(1);
-	transform: scale(1);
-	overflow-x: hidden;
-	overflow-y: auto;
-	pointer-events: auto;
-}
-
-.cu-dialog {
-	position: relative;
-	display: inline-block;
-	vertical-align: middle;
-	margin-left: auto;
-	margin-right: auto;
-	width: 680upx;
-	max-width: 100%;
-	background-color: #f8f8f8;
-	border-radius: 10upx;
-	overflow: hidden;
-}
-
-.cu-modal.bottom-modal::before {
-	vertical-align: bottom;
-}
-
-.cu-modal.bottom-modal .cu-dialog {
-	width: 100%;
-	border-radius: 0;
-}
-
-.cu-modal.bottom-modal {
-	margin-bottom: -1000upx;
-}
-
-.cu-modal.bottom-modal.show {
-	margin-bottom: 0;
-}
-
-.cu-modal.drawer-modal {
-	transform: scale(1);
-	display: flex;
-}
-
-.cu-modal.drawer-modal .cu-dialog {
-	height: 100%;
-	min-width: 200upx;
-	border-radius: 0;
-	margin: initial;
-	transition-duration: 0.3s;
-}
-
-.cu-modal.drawer-modal.justify-start .cu-dialog {
-	transform: translateX(-100%);
-}
-
-.cu-modal.drawer-modal.justify-end .cu-dialog {
-	transform: translateX(100%);
-}
-
-.cu-modal.drawer-modal.show .cu-dialog {
-	transform: translateX(0%);
-}
-
-.cu-modal .cu-dialog>.cu-bar:first-child .action {
-	min-width: 100rpx;
-	margin-right: 0;
-	min-height: 100rpx;
-}
-
-/* ==================
-         轮播
- ==================== */
-swiper .a-swiper-dot {
-	display: inline-block;
-	width: 16upx;
-	height: 16upx;
-	background: rgba(0, 0, 0, .3);
-	border-radius: 50%;
-	vertical-align: middle;
-}
-
-swiper[class*="-dot"] .wx-swiper-dots,
-swiper[class*="-dot"] .a-swiper-dots,
-swiper[class*="-dot"] .uni-swiper-dots {
-	display: flex;
-	align-items: center;
-	width: 100%;
-	justify-content: center;
-}
-
-swiper.square-dot .wx-swiper-dot,
-swiper.square-dot .a-swiper-dot,
-swiper.square-dot .uni-swiper-dot {
-	background-color: #ffffff;
-	opacity: 0.4;
-	width: 10upx;
-	height: 10upx;
-	border-radius: 20upx;
-	margin: 0 8upx !important;
-}
-
-swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active,
-swiper.square-dot .a-swiper-dot.a-swiper-dot-active,
-swiper.square-dot .uni-swiper-dot.uni-swiper-dot-active {
-	opacity: 1;
-	width: 30upx;
-}
-
-swiper.round-dot .wx-swiper-dot,
-swiper.round-dot .a-swiper-dot,
-swiper.round-dot .uni-swiper-dot {
-	width: 10upx;
-	height: 10upx;
-	position: relative;
-	margin: 4upx 8upx !important;
-}
-
-swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after,
-swiper.round-dot .a-swiper-dot.a-swiper-dot-active::after,
-swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active::after {
-	content: "";
-	position: absolute;
-	width: 10upx;
-	height: 10upx;
-	top: 0upx;
-	left: 0upx;
-	right: 0;
-	bottom: 0;
-	margin: auto;
-	background-color: #ffffff;
-	border-radius: 20upx;
-}
-
-swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active,
-swiper.round-dot .a-swiper-dot.a-swiper-dot-active,
-swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active {
-	width: 18upx;
-	height: 18upx;
-}
-
-.screen-swiper {
-	min-height: 375upx;
-}
-
-.screen-swiper image,
-.screen-swiper video,
-.swiper-item image,
-.swiper-item video {
-	width: 100%;
-	display: block;
-	height: 100%;
-	margin: 0;
-	pointer-events: none;
-}
-
-.card-swiper {
-	height: 420upx !important;
-}
-
-.card-swiper swiper-item {
-	width: 610upx !important;
-	left: 70upx;
-	box-sizing: border-box;
-	padding: 40upx 0upx 70upx;
-	overflow: initial;
-}
-
-.card-swiper swiper-item .swiper-item {
-	width: 100%;
-	display: block;
-	height: 100%;
-	border-radius: 10upx;
-	transform: scale(0.9);
-	transition: all 0.2s ease-in 0s;
-	overflow: hidden;
-}
-
-.card-swiper swiper-item.cur .swiper-item {
-	transform: none;
-	transition: all 0.2s ease-in 0s;
-}
-
-
-.tower-swiper {
-	height: 420upx;
-	position: relative;
-	max-width: 750upx;
-	overflow: hidden;
-}
-
-.tower-swiper .tower-item {
-	position: absolute;
-	width: 300upx;
-	height: 380upx;
-	top: 0;
-	bottom: 0;
-	left: 50%;
-	margin: auto;
-	transition: all 0.2s ease-in 0s;
-	opacity: 1;
-}
-
-.tower-swiper .tower-item.none {
-	opacity: 0;
-}
-
-.tower-swiper .tower-item .swiper-item {
-	width: 100%;
-	height: 100%;
-	border-radius: 6upx;
-	overflow: hidden;
-}
-
-/* ==================
-          步骤条
- ==================== */
-
-.cu-steps {
-	display: flex;
-}
-
-scroll-view.cu-steps {
-	display: block;
-	white-space: nowrap;
-}
-
-scroll-view.cu-steps .cu-item {
-	display: inline-block;
-}
-
-.cu-steps .cu-item {
-	flex: 1;
-	text-align: center;
-	position: relative;
-	min-width: 100upx;
-}
-
-.cu-steps .cu-item:not([class*="text-"]) {
-	color: #8799a3;
-}
-
-.cu-steps .cu-item [class*="cuIcon-"],
-.cu-steps .cu-item .num {
-	display: block;
-	font-size: 40upx;
-	line-height: 80upx;
-}
-
-.cu-steps .cu-item::before,
-.cu-steps .cu-item::after,
-.cu-steps.steps-arrow .cu-item::before,
-.cu-steps.steps-arrow .cu-item::after {
-	content: "";
-	display: block;
-	position: absolute;
-	height: 0px;
-	width: calc(100% - 80upx);
-	border-bottom: 6upx solid #ccc;
-	left: calc(0px - (100% - 80upx) / 2);
-	top: 40upx;
-	z-index: 0;
-}
-
-.cu-steps.steps-arrow .cu-item::before,
-.cu-steps.steps-arrow .cu-item::after {
-	content: "\e6a3";
-	font-family: 'cuIcon';
-	height: 30upx;
-	border-bottom-width: 0px;
-	line-height: 30upx;
-	top: 0;
-	bottom: 0;
-	margin: auto;
-	color: #ccc;
-}
-
-.cu-steps.steps-bottom .cu-item::before,
-.cu-steps.steps-bottom .cu-item::after {
-	bottom: 40upx;
-	top: initial;
-}
-
-.cu-steps .cu-item::after {
-	border-bottom: 6upx solid currentColor;
-	width: 0px;
-	transition: all 0.3s ease-in-out 0s;
-}
-
-.cu-steps .cu-item[class*="text-"]::after {
-	width: calc(100% - 80upx);
-	color: currentColor;
-}
-
-.cu-steps .cu-item:first-child::before,
-.cu-steps .cu-item:first-child::after {
-	display: none;
-}
-
-.cu-steps .cu-item .num {
-	width: 40upx;
-	height: 40upx;
-	border-radius: 50%;
-	line-height: 40upx;
-	margin: 20upx auto;
-	font-size: 24upx;
-	border: 1px solid currentColor;
-	position: relative;
-	overflow: hidden;
-}
-
-.cu-steps .cu-item[class*="text-"] .num {
-	background-color: currentColor;
-}
-
-.cu-steps .cu-item .num::before,
-.cu-steps .cu-item .num::after {
-	content: attr(data-index);
-	position: absolute;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	margin: auto;
-	transition: all 0.3s ease-in-out 0s;
-	transform: translateY(0upx);
-}
-
-.cu-steps .cu-item[class*="text-"] .num::before {
-	transform: translateY(-40upx);
-	color: #ffffff;
-}
-
-.cu-steps .cu-item .num::after {
-	transform: translateY(40upx);
-	color: #ffffff;
-	transition: all 0.3s ease-in-out 0s;
-}
-
-.cu-steps .cu-item[class*="text-"] .num::after {
-	content: "\e645";
-	font-family: 'cuIcon';
-	color: #ffffff;
-	transform: translateY(0upx);
-}
-
-.cu-steps .cu-item[class*="text-"] .num.err::after {
-	content: "\e646";
-}
-
-/* ==================
-          布局
- ==================== */
-
-/*  -- flex弹性布局 -- */
-
-.flex {
-	display: flex;
-}
-
-.basis-xs {
-	flex-basis: 20%;
-}
-
-.basis-sm {
-	flex-basis: 40%;
-}
-
-.basis-df {
-	flex-basis: 50%;
-}
-
-.basis-lg {
-	flex-basis: 60%;
-}
-
-.basis-xl {
-	flex-basis: 80%;
-}
-
-.flex-sub {
-	flex: 1;
-}
-
-.flex-twice {
-	flex: 2;
-}
-
-.flex-treble {
-	flex: 3;
-}
-
-.flex-direction {
-	flex-direction: column;
-}
-
-.flex-wrap {
-	flex-wrap: wrap;
-}
-
-.align-start {
-	align-items: flex-start;
-}
-
-.align-end {
-	align-items: flex-end;
-}
-
-.align-center {
-	align-items: center;
-}
-
-.align-stretch {
-	align-items: stretch;
-}
-
-.self-start {
-	align-self: flex-start;
-}
-
-.self-center {
-	align-self: flex-center;
-}
-
-.self-end {
-	align-self: flex-end;
-}
-
-.self-stretch {
-	align-self: stretch;
-}
-
-.align-stretch {
-	align-items: stretch;
-}
-
-.justify-start {
-	display: flex;
-	justify-content: flex-start;
-}
-
-.justify-end {
-	justify-content: flex-end;
-}
-
-.justify-center {
-	justify-content: center;
-}
-
-.justify-between {
-	justify-content: space-between;
-}
-
-.justify-around {
-	justify-content: space-around;
-}
-
-/* grid布局 */
-
-.grid {
-	display: flex;
-	flex-wrap: wrap;
-}
-
-.grid.grid-square {
-	overflow: hidden;
-}
-
-.grid.grid-square .cu-tag {
-	position: absolute;
-	right: 0;
-	top: 0;
-	border-bottom-left-radius: 6upx;
-	padding: 6upx 12upx;
-	height: auto;
-	background-color: rgba(0, 0, 0, 0.5);
-}
-
-.grid.grid-square>view>text[class*="cuIcon-"] {
-	font-size: 52upx;
-	position: absolute;
-	color: #8799a3;
-	margin: auto;
-	top: 0;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	flex-direction: column;
-}
-
-.grid.grid-square>view {
-	margin-right: 20upx;
-	margin-bottom: 20upx;
-	border-radius: 6upx;
-	position: relative;
-	overflow: hidden;
-}
-
-.grid.grid-square>view.bg-img image {
-	width: 100%;
-	height: 100%;
-	position: absolute;
-}
-
-.grid.col-1.grid-square>view {
-	padding-bottom: 100%;
-	height: 0;
-	margin-right: 0;
-}
-
-.grid.col-2.grid-square>view {
-	padding-bottom: calc((100% - 20upx)/2);
-	height: 0;
-	width: calc((100% - 20upx)/2);
-}
-
-.grid.col-3.grid-square>view {
-	padding-bottom: calc((100% - 40upx)/3);
-	height: 0;
-	width: calc((100% - 40upx)/3);
-}
-
-.grid.col-4.grid-square>view {
-	padding-bottom: calc((100% - 60upx)/4);
-	height: 0;
-	width: calc((100% - 80upx)/4);
-}
-
-.grid.col-5.grid-square>view {
-	padding-bottom: calc((100% - 80upx)/5);
-	height: 0;
-	width: calc((100% - 80upx)/5);
-}
-
-.grid.col-2.grid-square>view:nth-child(2n),
-.grid.col-3.grid-square>view:nth-child(3n),
-.grid.col-4.grid-square>view:nth-child(4n),
-.grid.col-5.grid-square>view:nth-child(5n) {
-	margin-right: 0;
-}
-
-.grid.col-1>view {
-	width: 100%;
-}
-
-.grid.col-2>view {
-	width: 50%;
-}
-
-.grid.col-3>view {
-	width: 33.33%;
-}
-
-.grid.col-4>view {
-	width: 25%;
-}
-
-.grid.col-5>view {
-	width: 20%;
-}
-
-/*  -- 内外边距 -- */
-
-.margin-0 {
-	margin: 0;
-}
-
-.margin-xs {
-	margin: 10upx;
-}
-
-.margin-sm {
-	margin: 20upx;
-}
-
-.margin {
-	margin: 30upx;
-}
-
-.margin-lg {
-	margin: 40upx;
-}
-
-.margin-xl {
-	margin: 50upx;
-}
-
-.margin-top-xs {
-	margin-top: 10upx;
-}
-
-.margin-top-sm {
-	margin-top: 20upx;
-}
-
-.margin-top {
-	margin-top: 30upx;
-}
-
-.margin-top-lg {
-	margin-top: 40upx;
-}
-
-.margin-top-xl {
-	margin-top: 50upx;
-}
-
-.margin-right-xs {
-	margin-right: 10upx;
-}
-
-.margin-right-sm {
-	margin-right: 20upx;
-}
-
-.margin-right {
-	margin-right: 30upx;
-}
-
-.margin-right-lg {
-	margin-right: 40upx;
-}
-
-.margin-right-xl {
-	margin-right: 50upx;
-}
-
-.margin-bottom-xs {
-	margin-bottom: 10upx;
-}
-
-.margin-bottom-sm {
-	margin-bottom: 20upx;
-}
-
-.margin-bottom {
-	margin-bottom: 30upx;
-}
-
-.margin-bottom-lg {
-	margin-bottom: 40upx;
-}
-
-.margin-bottom-xl {
-	margin-bottom: 50upx;
-}
-
-.margin-left-xs {
-	margin-left: 10upx;
-}
-
-.margin-left-sm {
-	margin-left: 20upx;
-}
-
-.margin-left {
-	margin-left: 30upx;
-}
-
-.margin-left-lg {
-	margin-left: 40upx;
-}
-
-.margin-left-xl {
-	margin-left: 50upx;
-}
-
-.margin-lr-xs {
-	margin-left: 10upx;
-	margin-right: 10upx;
-}
-
-.margin-lr-sm {
-	margin-left: 20upx;
-	margin-right: 20upx;
-}
-
-.margin-lr {
-	margin-left: 30upx;
-	margin-right: 30upx;
-}
-
-.margin-lr-lg {
-	margin-left: 40upx;
-	margin-right: 40upx;
-}
-
-.margin-lr-xl {
-	margin-left: 50upx;
-	margin-right: 50upx;
-}
-
-.margin-tb-xs {
-	margin-top: 10upx;
-	margin-bottom: 10upx;
-}
-
-.margin-tb-sm {
-	margin-top: 20upx;
-	margin-bottom: 20upx;
-}
-
-.margin-tb {
-	margin-top: 30upx;
-	margin-bottom: 30upx;
-}
-
-.margin-tb-lg {
-	margin-top: 40upx;
-	margin-bottom: 40upx;
-}
-
-.margin-tb-xl {
-	margin-top: 50upx;
-	margin-bottom: 50upx;
-}
-
-.padding-0 {
-	padding: 0;
-}
-
-.padding-xs {
-	padding: 10upx;
-}
-
-.padding-sm {
-	padding: 20upx;
-}
-
-.padding {
-	padding: 30upx;
-}
-
-.padding-lg {
-	padding: 40upx;
-}
-
-.padding-xl {
-	padding: 50upx;
-}
-
-.padding-top-xs {
-	padding-top: 10upx;
-}
-
-.padding-top-sm {
-	padding-top: 20upx;
-}
-
-.padding-top {
-	padding-top: 30upx;
-}
-
-.padding-top-lg {
-	padding-top: 40upx;
-}
-
-.padding-top-xl {
-	padding-top: 50upx;
-}
-
-.padding-right-xs {
-	padding-right: 10upx;
-}
-
-.padding-right-sm {
-	padding-right: 20upx;
-}
-
-.padding-right {
-	padding-right: 30upx;
-}
-
-.padding-right-lg {
-	padding-right: 40upx;
-}
-
-.padding-right-xl {
-	padding-right: 50upx;
-}
-
-.padding-bottom-xs {
-	padding-bottom: 10upx;
-}
-
-.padding-bottom-sm {
-	padding-bottom: 20upx;
-}
-
-.padding-bottom {
-	padding-bottom: 30upx;
-}
-
-.padding-bottom-lg {
-	padding-bottom: 40upx;
-}
-
-.padding-bottom-xl {
-	padding-bottom: 50upx;
-}
-
-.padding-left-xs {
-	padding-left: 10upx;
-}
-
-.padding-left-sm {
-	padding-left: 20upx;
-}
-
-.padding-left {
-	padding-left: 30upx;
-}
-
-.padding-left-lg {
-	padding-left: 40upx;
-}
-
-.padding-left-xl {
-	padding-left: 50upx;
-}
-
-.padding-lr-xs {
-	padding-left: 10upx;
-	padding-right: 10upx;
-}
-
-.padding-lr-sm {
-	padding-left: 20upx;
-	padding-right: 20upx;
-}
-
-.padding-lr {
-	padding-left: 30upx;
-	padding-right: 30upx;
-}
-
-.padding-lr-lg {
-	padding-left: 40upx;
-	padding-right: 40upx;
-}
-
-.padding-lr-xl {
-	padding-left: 50upx;
-	padding-right: 50upx;
-}
-
-.padding-tb-xs {
-	padding-top: 10upx;
-	padding-bottom: 10upx;
-}
-
-.padding-tb-sm {
-	padding-top: 20upx;
-	padding-bottom: 20upx;
-}
-
-.padding-tb {
-	padding-top: 30upx;
-	padding-bottom: 30upx;
-}
-
-.padding-tb-lg {
-	padding-top: 40upx;
-	padding-bottom: 40upx;
-}
-
-.padding-tb-xl {
-	padding-top: 50upx;
-	padding-bottom: 50upx;
-}
-
-/* -- 浮动 --  */
-
-.cf::after,
-.cf::before {
-	content: " ";
-	display: table;
-}
-
-.cf::after {
-	clear: both;
-}
-
-.fl {
-	float: left;
-}
-
-.fr {
-	float: right;
-}
-
-/* ==================
-          背景
- ==================== */
-
-.line-red::after,
-.lines-red::after {
-	border-color: #e54d42;
-}
-
-.line-orange::after,
-.lines-orange::after {
-	border-color: #f37b1d;
-}
-
-.line-yellow::after,
-.lines-yellow::after {
-	border-color: #fbbd08;
-}
-
-.line-olive::after,
-.lines-olive::after {
-	border-color: #8dc63f;
-}
-
-.line-green::after,
-.lines-green::after {
-	border-color: #39b54a;
-}
-
-.line-cyan::after,
-.lines-cyan::after {
-	border-color: var(--activeColor);
-}
-
-.line-blue::after,
-.lines-blue::after {
-	border-color: #0081ff;
-}
-
-.line-purple::after,
-.lines-purple::after {
-	border-color: #6739b6;
-}
-
-.line-mauve::after,
-.lines-mauve::after {
-	border-color: #9c26b0;
-}
-
-.line-pink::after,
-.lines-pink::after {
-	border-color: #e03997;
-}
-
-.line-brown::after,
-.lines-brown::after {
-	border-color: #a5673f;
-}
-
-.line-grey::after,
-.lines-grey::after {
-	border-color: #8799a3;
-}
-
-.line-gray::after,
-.lines-gray::after {
-	border-color: #aaaaaa;
-}
-
-.line-black::after,
-.lines-black::after {
-	border-color: #333333;
-}
-
-.line-white::after,
-.lines-white::after {
-	border-color: #ffffff;
-}
-
-.bg-red {
-	background-color: #e54d42;
-	color: #ffffff;
-}
-
-.bg-orange {
-	background-color: #f37b1d;
-	color: #ffffff;
-}
-
-.bg-yellow {
-	background-color: #fbbd08;
-	color: #333333;
-}
-
-.bg-olive {
-	background-color: #8dc63f;
-	color: #ffffff;
-}
-
-.bg-green {
-	background-color: #39b54a;
-	color: #ffffff;
-}
-
-.bg-cyan {
-	background-color: var(--activeColor);
-	color: #ffffff;
-}
-
-.bg-blue {
-	background-color: #0081ff;
-	color: #ffffff;
-}
-
-.bg-purple {
-	background-color: #6739b6;
-	color: #ffffff;
-}
-
-.bg-mauve {
-	background-color: #9c26b0;
-	color: #ffffff;
-}
-
-.bg-pink {
-	background-color: #e03997;
-	color: #ffffff;
-}
-
-.bg-brown {
-	background-color: #a5673f;
-	color: #ffffff;
-}
-
-.bg-grey {
-	background-color: #8799a3;
-	color: #ffffff;
-}
-
-.bg-gray {
-	background-color: #f0f0f0;
-	color: #333333;
-}
-
-.bg-black {
-	background-color: #333333;
-	color: #ffffff;
-}
-
-.bg-white {
-	background-color: #ffffff;
-	color: #666666;
-}
-
-.bg-shadeTop {
-	background-image: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.01));
-	color: #ffffff;
-}
-
-.bg-shadeBottom {
-	background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1));
-	color: #ffffff;
-}
-
-.bg-red.light {
-	color: #e54d42;
-	background-color: #fadbd9;
-}
-
-.bg-orange.light {
-	color: #f37b1d;
-	background-color: #fde6d2;
-}
-
-.bg-yellow.light {
-	color: #fbbd08;
-	background-color: #fef2ced2;
-}
-
-.bg-olive.light {
-	color: #8dc63f;
-	background-color: #e8f4d9;
-}
-
-.bg-green.light {
-	color: #39b54a;
-	background-color: #d7f0dbff;
-}
-
-.bg-cyan.light {
-	color: #1cbbb4;
-	background-color: #d2f1f0;
-}
-
-.bg-blue.light {
-	color: #0081ff;
-	background-color: #cce6ff;
-}
-
-.bg-purple.light {
-	color: #6739b6;
-	background-color: #e1d7f0;
-}
-
-.bg-mauve.light {
-	color: #9c26b0;
-	background-color: #ebd4ef;
-}
-
-.bg-pink.light {
-	color: #e03997;
-	background-color: #f9d7ea;
-}
-
-.bg-brown.light {
-	color: #a5673f;
-	background-color: #ede1d9;
-}
-
-.bg-grey.light {
-	color: #8799a3;
-	background-color: #e7ebed;
-}
-
-.bg-gradual-red {
-	background-image: linear-gradient(45deg, #f43f3b, #ec008c);
-	color: #ffffff;
-}
-
-.bg-gradual-orange {
-	background-image: linear-gradient(45deg, #ff9700, #ed1c24);
-	color: #ffffff;
-}
-
-.bg-gradual-green {
-	background-image: linear-gradient(45deg, #39b54a, #8dc63f);
-	color: #ffffff;
-}
-
-.bg-gradual-purple {
-	background-image: linear-gradient(45deg, #9000ff, #5e00ff);
-	color: #ffffff;
-}
-
-.bg-gradual-pink {
-	background-image: linear-gradient(45deg, #ec008c, #6739b6);
-	color: #ffffff;
-}
-
-.bg-gradual-blue {
-	background-image: linear-gradient(45deg, #0081ff, #1cbbb4);
-	color: #ffffff;
-}
-
-.shadow[class*="-red"] {
-	box-shadow: 6upx 6upx 8upx rgba(204, 69, 59, 0.2);
-}
-
-.shadow[class*="-orange"] {
-	box-shadow: 6upx 6upx 8upx rgba(217, 109, 26, 0.2);
-}
-
-.shadow[class*="-yellow"] {
-	box-shadow: 6upx 6upx 8upx rgba(224, 170, 7, 0.2);
-}
-
-.shadow[class*="-olive"] {
-	box-shadow: 6upx 6upx 8upx rgba(124, 173, 55, 0.2);
-}
-
-.shadow[class*="-green"] {
-	box-shadow: 6upx 6upx 8upx rgba(48, 156, 63, 0.2);
-}
-
-.shadow[class*="-cyan"] {
-	box-shadow: 6upx 6upx 8upx rgba(28, 187, 180, 0.2);
-}
-
-.shadow[class*="-blue"] {
-	box-shadow: 6upx 6upx 8upx rgba(0, 102, 204, 0.2);
-}
-
-.shadow[class*="-purple"] {
-	box-shadow: 6upx 6upx 8upx rgba(88, 48, 156, 0.2);
-}
-
-.shadow[class*="-mauve"] {
-	box-shadow: 6upx 6upx 8upx rgba(133, 33, 150, 0.2);
-}
-
-.shadow[class*="-pink"] {
-	box-shadow: 6upx 6upx 8upx rgba(199, 50, 134, 0.2);
-}
-
-.shadow[class*="-brown"] {
-	box-shadow: 6upx 6upx 8upx rgba(140, 88, 53, 0.2);
-}
-
-.shadow[class*="-grey"] {
-	box-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
-}
-
-.shadow[class*="-gray"] {
-	box-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
-}
-
-.shadow[class*="-black"] {
-	box-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
-}
-
-.shadow[class*="-white"] {
-	box-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
-}
-
-.text-shadow[class*="-red"] {
-	text-shadow: 6upx 6upx 8upx rgba(204, 69, 59, 0.2);
-}
-
-.text-shadow[class*="-orange"] {
-	text-shadow: 6upx 6upx 8upx rgba(217, 109, 26, 0.2);
-}
-
-.text-shadow[class*="-yellow"] {
-	text-shadow: 6upx 6upx 8upx rgba(224, 170, 7, 0.2);
-}
-
-.text-shadow[class*="-olive"] {
-	text-shadow: 6upx 6upx 8upx rgba(124, 173, 55, 0.2);
-}
-
-.text-shadow[class*="-green"] {
-	text-shadow: 6upx 6upx 8upx rgba(48, 156, 63, 0.2);
-}
-
-.text-shadow[class*="-cyan"] {
-	text-shadow: 6upx 6upx 8upx rgba(28, 187, 180, 0.2);
-}
-
-.text-shadow[class*="-blue"] {
-	text-shadow: 6upx 6upx 8upx rgba(0, 102, 204, 0.2);
-}
-
-.text-shadow[class*="-purple"] {
-	text-shadow: 6upx 6upx 8upx rgba(88, 48, 156, 0.2);
-}
-
-.text-shadow[class*="-mauve"] {
-	text-shadow: 6upx 6upx 8upx rgba(133, 33, 150, 0.2);
-}
-
-.text-shadow[class*="-pink"] {
-	text-shadow: 6upx 6upx 8upx rgba(199, 50, 134, 0.2);
-}
-
-.text-shadow[class*="-brown"] {
-	text-shadow: 6upx 6upx 8upx rgba(140, 88, 53, 0.2);
-}
-
-.text-shadow[class*="-grey"] {
-	text-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
-}
-
-.text-shadow[class*="-gray"] {
-	text-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
-}
-
-.text-shadow[class*="-black"] {
-	text-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
-}
-
-.bg-img {
-	background-size: cover;
-	background-position: center;
-	background-repeat: no-repeat;
-}
-
-.bg-mask {
-	background-color: #333333;
-	position: relative;
-}
-
-.bg-mask::after {
-	content: "";
-	border-radius: inherit;
-	width: 100%;
-	height: 100%;
-	display: block;
-	background-color: rgba(0, 0, 0, 0.4);
-	position: absolute;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	top: 0;
-}
-
-.bg-mask view,
-.bg-mask cover-view {
-	z-index: 5;
-	position: relative;
-}
-
-.bg-video {
-	position: relative;
-}
-
-.bg-video video {
-	display: block;
-	height: 100%;
-	width: 100%;
-	-o-object-fit: cover;
-	object-fit: cover;
-	position: absolute;
-	top: 0;
-	z-index: 0;
-	pointer-events: none;
-}
-
-/* ==================
-          文本
- ==================== */
-
-.text-xs {
-	font-size: 20upx;
-}
-
-.text-sm {
-	font-size: 24upx;
-}
-
-.text-df {
-	font-size: 28upx;
-}
-
-.text-lg {
-	font-size: 32upx;
-}
-
-.text-xl {
-	font-size: 36upx;
-}
-
-.text-xxl {
-	font-size: 44upx;
-}
-
-.text-sl {
-	font-size: 80upx;
-}
-
-.text-xsl {
-	font-size: 120upx;
-}
-
-.text-Abc {
-	text-transform: Capitalize;
-}
-
-.text-ABC {
-	text-transform: Uppercase;
-}
-
-.text-abc {
-	text-transform: Lowercase;
-}
-
-.text-price::before {
-	content: "¥";
-	font-size: 80%;
-	margin-right: 4upx;
-}
-
-.text-cut {
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	overflow: hidden;
-}
-
-.text-bold {
-	font-weight: bold;
-}
-
-.text-center {
-	text-align: center;
-}
-
-.text-content {
-	line-height: 1.6;
-}
-
-.text-left {
-	text-align: left;
-}
-
-.text-right {
-	text-align: right;
-}
-
-.text-red,
-.line-red,
-.lines-red {
-	color: #e54d42;
-}
-
-.text-orange,
-.line-orange,
-.lines-orange {
-	color: #f37b1d;
-}
-
-.text-yellow,
-.line-yellow,
-.lines-yellow {
-	color: #fbbd08;
-}
-
-.text-olive,
-.line-olive,
-.lines-olive {
-	color: #8dc63f;
-}
-
-.text-green,
-.line-green,
-.lines-green {
-	color: #39b54a;
-}
-
-.text-cyan,
-.line-cyan,
-.lines-cyan {
-	color: #1cbbb4;
-}
-
-.text-blue,
-.line-blue,
-.lines-blue {
-	color: #0081ff;
-}
-
-.text-purple,
-.line-purple,
-.lines-purple {
-	color: #6739b6;
-}
-
-.text-mauve,
-.line-mauve,
-.lines-mauve {
-	color: #9c26b0;
-}
-
-.text-pink,
-.line-pink,
-.lines-pink {
-	color: #e03997;
-}
-
-.text-brown,
-.line-brown,
-.lines-brown {
-	color: #a5673f;
-}
-
-.text-grey,
-.line-grey,
-.lines-grey {
-	color: #8799a3;
-}
-
-.text-gray,
-.line-gray,
-.lines-gray {
-	color: #aaaaaa;
-}
-
-.text-black,
-.line-black,
-.lines-black {
-	color: #333333;
-}
-
-.text-white,
-.line-white,
-.lines-white {
-	color: #ffffff;
+/*
+  ColorUi for uniApp  v2.1.6 | by 文晓港 2019-05-31 10:44:24
+  仅供学习交流，如作它用所承受的法律责任一概与作者无关  
+  
+  *使用ColorUi开发扩展与插件时，请注明基于ColorUi开发 
+  
+  （QQ交流群：240787041）
+*/
+
+/* ==================
+        初始化
+ ==================== */
+body {
+	background-color: #f1f1f1;
+	font-size: 28upx;
+	color: #333333;
+	font-family: Helvetica Neue, Helvetica, sans-serif;
+}
+
+view,
+scroll-view,
+swiper,
+button,
+input,
+textarea,
+label,
+navigator,
+image {
+	box-sizing: border-box;
+}
+
+.round {
+	border-radius: 5000upx;
+}
+
+.radius {
+	border-radius: 6upx;
+}
+
+/* ==================
+          图片
+ ==================== */
+
+image {
+	max-width: 100%;
+	display: inline-block;
+	position: relative;
+	z-index: 0;
+}
+
+image.loading::before {
+	content: "";
+	background-color: #f5f5f5;
+	display: block;
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	z-index: -2;
+}
+
+image.loading::after {
+	content: "\e7f1";
+	font-family: "cuIcon";
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 32upx;
+	height: 32upx;
+	line-height: 32upx;
+	right: 0;
+	bottom: 0;
+	z-index: -1;
+	font-size: 32upx;
+	margin: auto;
+	color: #ccc;
+	-webkit-animation: cuIcon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
+	display: block;
+}
+
+.response {
+	width: 100%;
+}
+
+/* ==================
+         开关
+ ==================== */
+
+switch,
+checkbox,
+radio {
+	position: relative;
+}
+
+switch::after,
+switch::before {
+	font-family: "cuIcon";
+	content: "\e645";
+	position: absolute;
+	color: #ffffff !important;
+	top: 0%;
+	left: 0upx;
+	font-size: 26upx;
+	line-height: 26px;
+	width: 50%;
+	text-align: center;
+	pointer-events: none;
+	transform: scale(0, 0);
+	transition: all 0.3s ease-in-out 0s;
+	z-index: 9;
+	bottom: 0;
+	height: 26px;
+	margin: auto;
+}
+
+switch::before {
+	content: "\e646";
+	right: 0;
+	transform: scale(1, 1);
+	left: auto;
+}
+
+switch[checked]::after,
+switch.checked::after {
+	transform: scale(1, 1);
+}
+
+switch[checked]::before,
+switch.checked::before {
+	transform: scale(0, 0);
+}
+
+/* #ifndef MP-ALIPAY */
+radio::before,
+checkbox::before {
+	font-family: "cuIcon";
+	content: "\e645";
+	position: absolute;
+	color: #ffffff !important;
+	top: 50%;
+	margin-top: -8px;
+	right: 5px;
+	font-size: 32upx;
+	line-height: 16px;
+	pointer-events: none;
+	transform: scale(1, 1);
+	transition: all 0.3s ease-in-out 0s;
+	z-index: 9;
+}
+
+radio .wx-radio-input,
+checkbox .wx-checkbox-input,
+radio .uni-radio-input,
+checkbox .uni-checkbox-input {
+	margin: 0;
+	width: 24px;
+	height: 24px;
+}
+
+checkbox.round .wx-checkbox-input,
+checkbox.round .uni-checkbox-input {
+	border-radius: 100upx;
+}
+
+/* #endif */
+
+switch[checked]::before {
+	transform: scale(0, 0);
+}
+
+switch .wx-switch-input,
+switch .uni-switch-input {
+	border: none;
+	padding: 0 24px;
+	width: 48px;
+	height: 26px;
+	margin: 0;
+	border-radius: 100upx;
+}
+
+switch .wx-switch-input:not([class*="bg-"]),
+switch .uni-switch-input:not([class*="bg-"]) {
+	background: #8799a3 !important;
+}
+
+switch .wx-switch-input::after,
+switch .uni-switch-input::after {
+	margin: auto;
+	width: 26px;
+	height: 26px;
+	border-radius: 100upx;
+	left: 0upx;
+	top: 0upx;
+	bottom: 0upx;
+	position: absolute;
+	transform: scale(0.9, 0.9);
+	transition: all 0.1s ease-in-out 0s;
+}
+
+switch .wx-switch-input.wx-switch-input-checked::after,
+switch .uni-switch-input.uni-switch-input-checked::after {
+	margin: auto;
+	left: 22px;
+	box-shadow: none;
+	transform: scale(0.9, 0.9);
+}
+
+radio-group {
+	display: inline-block;
+}
+
+
+
+switch.radius .wx-switch-input::after,
+switch.radius .wx-switch-input,
+switch.radius .wx-switch-input::before,
+switch.radius .uni-switch-input::after,
+switch.radius .uni-switch-input,
+switch.radius .uni-switch-input::before {
+	border-radius: 10upx;
+}
+
+switch .wx-switch-input::before,
+radio.radio::before,
+checkbox .wx-checkbox-input::before,
+radio .wx-radio-input::before,
+switch .uni-switch-input::before,
+radio.radio::before,
+checkbox .uni-checkbox-input::before,
+radio .uni-radio-input::before {
+	display: none;
+}
+
+radio.radio[checked]::after,
+radio.radio .uni-radio-input-checked::after {
+	content: "";
+	background-color: transparent;
+	display: block;
+	position: absolute;
+	width: 8px;
+	height: 8px;
+	z-index: 999;
+	top: 0upx;
+	left: 0upx;
+	right: 0;
+	bottom: 0;
+	margin: auto;
+	border-radius: 200upx;
+	/* #ifndef MP */
+	border: 7px solid #ffffff !important;
+	/* #endif */
+
+	/* #ifdef MP */
+	border: 8px solid #ffffff !important;
+	/* #endif */
+}
+
+.switch-sex::after {
+	content: "\e71c";
+}
+
+.switch-sex::before {
+	content: "\e71a";
+}
+
+.switch-sex .wx-switch-input,
+.switch-sex .uni-switch-input {
+	background: #e54d42 !important;
+	border-color: #e54d42 !important;
+}
+
+.switch-sex[checked] .wx-switch-input,
+.switch-sex.checked .uni-switch-input {
+	background: #0081ff !important;
+	border-color: #0081ff !important;
+}
+
+switch.red[checked] .wx-switch-input.wx-switch-input-checked,
+checkbox.red[checked] .wx-checkbox-input,
+radio.red[checked] .wx-radio-input,
+switch.red.checked .uni-switch-input.uni-switch-input-checked,
+checkbox.red.checked .uni-checkbox-input,
+radio.red.checked .uni-radio-input {
+	background-color: #e54d42 !important;
+	border-color: #e54d42 !important;
+	color: #ffffff !important;
+}
+
+switch.orange[checked] .wx-switch-input,
+checkbox.orange[checked] .wx-checkbox-input,
+radio.orange[checked] .wx-radio-input,
+switch.orange.checked .uni-switch-input,
+checkbox.orange.checked .uni-checkbox-input,
+radio.orange.checked .uni-radio-input {
+	background-color: #f37b1d !important;
+	border-color: #f37b1d !important;
+	color: #ffffff !important;
+}
+
+switch.yellow[checked] .wx-switch-input,
+checkbox.yellow[checked] .wx-checkbox-input,
+radio.yellow[checked] .wx-radio-input,
+switch.yellow.checked .uni-switch-input,
+checkbox.yellow.checked .uni-checkbox-input,
+radio.yellow.checked .uni-radio-input {
+	background-color: #fbbd08 !important;
+	border-color: #fbbd08 !important;
+	color: #333333 !important;
+}
+
+switch.olive[checked] .wx-switch-input,
+checkbox.olive[checked] .wx-checkbox-input,
+radio.olive[checked] .wx-radio-input,
+switch.olive.checked .uni-switch-input,
+checkbox.olive.checked .uni-checkbox-input,
+radio.olive.checked .uni-radio-input {
+	background-color: #8dc63f !important;
+	border-color: #8dc63f !important;
+	color: #ffffff !important;
+}
+
+switch.green[checked] .wx-switch-input,
+switch[checked] .wx-switch-input,
+checkbox.green[checked] .wx-checkbox-input,
+checkbox[checked] .wx-checkbox-input,
+radio.green[checked] .wx-radio-input,
+radio[checked] .wx-radio-input,
+switch.green.checked .uni-switch-input,
+switch.checked .uni-switch-input,
+checkbox.green.checked .uni-checkbox-input,
+checkbox.checked .uni-checkbox-input,
+radio.green.checked .uni-radio-input,
+radio.checked .uni-radio-input {
+	background-color: #39b54a !important;
+	border-color: #39b54a !important;
+	color: #ffffff !important;
+	border-color: #39B54A !important;
+}
+
+switch.cyan[checked] .wx-switch-input,
+checkbox.cyan[checked] .wx-checkbox-input,
+radio.cyan[checked] .wx-radio-input,
+switch.cyan.checked .uni-switch-input,
+checkbox.cyan.checked .uni-checkbox-input,
+radio.cyan.checked .uni-radio-input {
+	background-color: #1cbbb4 !important;
+	border-color: #1cbbb4 !important;
+	color: #ffffff !important;
+}
+
+switch.blue[checked] .wx-switch-input,
+checkbox.blue[checked] .wx-checkbox-input,
+radio.blue[checked] .wx-radio-input,
+switch.blue.checked .uni-switch-input,
+checkbox.blue.checked .uni-checkbox-input,
+radio.blue.checked .uni-radio-input {
+	background-color: #0081ff !important;
+	border-color: #0081ff !important;
+	color: #ffffff !important;
+}
+
+switch.purple[checked] .wx-switch-input,
+checkbox.purple[checked] .wx-checkbox-input,
+radio.purple[checked] .wx-radio-input,
+switch.purple.checked .uni-switch-input,
+checkbox.purple.checked .uni-checkbox-input,
+radio.purple.checked .uni-radio-input {
+	background-color: #6739b6 !important;
+	border-color: #6739b6 !important;
+	color: #ffffff !important;
+}
+
+switch.mauve[checked] .wx-switch-input,
+checkbox.mauve[checked] .wx-checkbox-input,
+radio.mauve[checked] .wx-radio-input,
+switch.mauve.checked .uni-switch-input,
+checkbox.mauve.checked .uni-checkbox-input,
+radio.mauve.checked .uni-radio-input {
+	background-color: #9c26b0 !important;
+	border-color: #9c26b0 !important;
+	color: #ffffff !important;
+}
+
+switch.pink[checked] .wx-switch-input,
+checkbox.pink[checked] .wx-checkbox-input,
+radio.pink[checked] .wx-radio-input,
+switch.pink.checked .uni-switch-input,
+checkbox.pink.checked .uni-checkbox-input,
+radio.pink.checked .uni-radio-input {
+	background-color: #e03997 !important;
+	border-color: #e03997 !important;
+	color: #ffffff !important;
+}
+
+switch.brown[checked] .wx-switch-input,
+checkbox.brown[checked] .wx-checkbox-input,
+radio.brown[checked] .wx-radio-input,
+switch.brown.checked .uni-switch-input,
+checkbox.brown.checked .uni-checkbox-input,
+radio.brown.checked .uni-radio-input {
+	background-color: #a5673f !important;
+	border-color: #a5673f !important;
+	color: #ffffff !important;
+}
+
+switch.grey[checked] .wx-switch-input,
+checkbox.grey[checked] .wx-checkbox-input,
+radio.grey[checked] .wx-radio-input,
+switch.grey.checked .uni-switch-input,
+checkbox.grey.checked .uni-checkbox-input,
+radio.grey.checked .uni-radio-input {
+	background-color: #8799a3 !important;
+	border-color: #8799a3 !important;
+	color: #ffffff !important;
+}
+
+switch.gray[checked] .wx-switch-input,
+checkbox.gray[checked] .wx-checkbox-input,
+radio.gray[checked] .wx-radio-input,
+switch.gray.checked .uni-switch-input,
+checkbox.gray.checked .uni-checkbox-input,
+radio.gray.checked .uni-radio-input {
+	background-color: #f0f0f0 !important;
+	border-color: #f0f0f0 !important;
+	color: #333333 !important;
+}
+
+switch.black[checked] .wx-switch-input,
+checkbox.black[checked] .wx-checkbox-input,
+radio.black[checked] .wx-radio-input,
+switch.black.checked .uni-switch-input,
+checkbox.black.checked .uni-checkbox-input,
+radio.black.checked .uni-radio-input {
+	background-color: #333333 !important;
+	border-color: #333333 !important;
+	color: #ffffff !important;
+}
+
+switch.white[checked] .wx-switch-input,
+checkbox.white[checked] .wx-checkbox-input,
+radio.white[checked] .wx-radio-input,
+switch.white.checked .uni-switch-input,
+checkbox.white.checked .uni-checkbox-input,
+radio.white.checked .uni-radio-input {
+	background-color: #ffffff !important;
+	border-color: #ffffff !important;
+	color: #333333 !important;
+}
+
+/* ==================
+          边框
+ ==================== */
+
+/* -- 实线 -- */
+
+.solid,
+.solid-top,
+.solid-right,
+.solid-bottom,
+.solid-left,
+.solids,
+.solids-top,
+.solids-right,
+.solids-bottom,
+.solids-left,
+.dashed,
+.dashed-top,
+.dashed-right,
+.dashed-bottom,
+.dashed-left {
+	position: relative;
+}
+
+.solid::after,
+.solid-top::after,
+.solid-right::after,
+.solid-bottom::after,
+.solid-left::after,
+.solids::after,
+.solids-top::after,
+.solids-right::after,
+.solids-bottom::after,
+.solids-left::after,
+.dashed::after,
+.dashed-top::after,
+.dashed-right::after,
+.dashed-bottom::after,
+.dashed-left::after {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border-radius: inherit;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	pointer-events: none;
+	box-sizing: border-box;
+}
+
+.solid::after {
+	border: 1upx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-top::after {
+	border-top: 1upx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-right::after {
+	border-right: 1upx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-bottom::after {
+	border-bottom: 1upx solid rgba(0, 0, 0, 0.1);
+}
+
+.solid-left::after {
+	border-left: 1upx solid rgba(0, 0, 0, 0.1);
+}
+
+.solids::after {
+	border: 8upx solid #eee;
+}
+
+.solids-top::after {
+	border-top: 8upx solid #eee;
+}
+
+.solids-right::after {
+	border-right: 8upx solid #eee;
+}
+
+.solids-bottom::after {
+	border-bottom: 8upx solid #eee;
+}
+
+.solids-left::after {
+	border-left: 8upx solid #eee;
+}
+
+/* -- 虚线 -- */
+
+.dashed::after {
+	border: 1upx dashed #ddd;
+}
+
+.dashed-top::after {
+	border-top: 1upx dashed #ddd;
+}
+
+.dashed-right::after {
+	border-right: 1upx dashed #ddd;
+}
+
+.dashed-bottom::after {
+	border-bottom: 1upx dashed #ddd;
+}
+
+.dashed-left::after {
+	border-left: 1upx dashed #ddd;
+}
+
+/* -- 阴影 -- */
+
+.shadow[class*='white'] {
+	--ShadowSize: 0 1upx 6upx;
+}
+
+.shadow-lg {
+	--ShadowSize: 0upx 40upx 100upx 0upx;
+}
+
+.shadow-warp {
+	position: relative;
+	box-shadow: 0 0 10upx rgba(0, 0, 0, 0.1);
+}
+
+.shadow-warp:before,
+.shadow-warp:after {
+	position: absolute;
+	content: "";
+	top: 20upx;
+	bottom: 30upx;
+	left: 20upx;
+	width: 50%;
+	box-shadow: 0 30upx 20upx rgba(0, 0, 0, 0.2);
+	transform: rotate(-3deg);
+	z-index: -1;
+}
+
+.shadow-warp:after {
+	right: 20upx;
+	left: auto;
+	transform: rotate(3deg);
+}
+
+.shadow-blur {
+	position: relative;
+}
+
+.shadow-blur::before {
+	content: "";
+	display: block;
+	background: inherit;
+	filter: blur(10upx);
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	top: 10upx;
+	left: 10upx;
+	z-index: -1;
+	opacity: 0.4;
+	transform-origin: 0 0;
+	border-radius: inherit;
+	transform: scale(1, 1);
+}
+
+/* ==================
+          按钮
+ ==================== */
+
+.cu-btn {
+	position: relative;
+	border: 0upx;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	box-sizing: border-box;
+	padding: 0 30upx;
+	font-size: 28upx;
+	height: 64upx;
+	line-height: 1;
+	text-align: center;
+	text-decoration: none;
+	overflow: visible;
+	margin-left: initial;
+	transform: translate(0upx, 0upx);
+	margin-right: initial;
+}
+
+.cu-btn::after {
+	display: none;
+}
+
+.cu-btn:not([class*="bg-"]) {
+	background-color: #f0f0f0;
+}
+
+.cu-btn[class*="line"] {
+	background-color: transparent;
+}
+
+.cu-btn[class*="line"]::after {
+	content: " ";
+	display: block;
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border: 1upx solid currentColor;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	box-sizing: border-box;
+	border-radius: 12upx;
+	z-index: 1;
+	pointer-events: none;
+}
+
+.cu-btn.round[class*="line"]::after {
+	border-radius: 1000upx;
+}
+
+.cu-btn[class*="lines"]::after {
+	border: 6upx solid currentColor;
+}
+
+.cu-btn[class*="bg-"]::after {
+	display: none;
+}
+
+.cu-btn.sm {
+	padding: 0 20upx;
+	font-size: 20upx;
+	height: 48upx;
+}
+
+.cu-btn.lg {
+	padding: 0 40upx;
+	font-size: 32upx;
+	height: 80upx;
+}
+
+.cu-btn.cuIcon.sm {
+	width: 48upx;
+	height: 48upx;
+}
+
+.cu-btn.cuIcon {
+	width: 64upx;
+	height: 64upx;
+	border-radius: 500upx;
+	padding: 0;
+}
+
+button.cuIcon.lg {
+	width: 80upx;
+	height: 80upx;
+}
+
+.cu-btn.shadow-blur::before {
+	top: 4upx;
+	left: 4upx;
+	filter: blur(6upx);
+	opacity: 0.6;
+}
+
+.cu-btn.button-hover {
+	transform: translate(1upx, 1upx);
+}
+
+.block {
+	display: block;
+}
+
+.cu-btn.block {
+	display: flex;
+}
+
+.cu-btn[disabled] {
+	opacity: 0.6;
+	color: #ffffff;
+}
+
+/* ==================
+          徽章
+ ==================== */
+
+.cu-tag {
+	font-size: 24upx;
+	vertical-align: middle;
+	position: relative;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	box-sizing: border-box;
+	padding: 0upx 16upx;
+	height: 48upx;
+	font-family: Helvetica Neue, Helvetica, sans-serif;
+	white-space: nowrap;
+}
+
+.cu-tag:not([class*="bg"]):not([class*="line"]) {
+	background-color: #f1f1f1;
+}
+
+.cu-tag[class*="line-"]::after {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border: 1upx solid currentColor;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	box-sizing: border-box;
+	border-radius: inherit;
+	z-index: 1;
+	pointer-events: none;
+}
+
+.cu-tag.radius[class*="line"]::after {
+	border-radius: 12upx;
+}
+
+.cu-tag.round[class*="line"]::after {
+	border-radius: 1000upx;
+}
+
+.cu-tag[class*="line-"]::after {
+	border-radius: 0;
+}
+
+.cu-tag+.cu-tag {
+	margin-left: 10upx;
+}
+
+.cu-tag.sm {
+	font-size: 20upx;
+	padding: 0upx 12upx;
+	height: 32upx;
+}
+
+.cu-capsule {
+	display: inline-flex;
+	vertical-align: middle;
+}
+
+.cu-capsule+.cu-capsule {
+	margin-left: 10upx;
+}
+
+.cu-capsule .cu-tag {
+	margin: 0;
+}
+
+.cu-capsule .cu-tag[class*="line-"]:last-child::after {
+	border-left: 0upx solid transparent;
+}
+
+.cu-capsule .cu-tag[class*="line-"]:first-child::after {
+	border-right: 0upx solid transparent;
+}
+
+.cu-capsule.radius .cu-tag:first-child {
+	border-top-left-radius: 6upx;
+	border-bottom-left-radius: 6upx;
+}
+
+.cu-capsule.radius .cu-tag:last-child::after,
+.cu-capsule.radius .cu-tag[class*="line-"] {
+	border-top-right-radius: 12upx;
+	border-bottom-right-radius: 12upx;
+}
+
+.cu-capsule.round .cu-tag:first-child {
+	border-top-left-radius: 200upx;
+	border-bottom-left-radius: 200upx;
+	text-indent: 4upx;
+}
+
+.cu-capsule.round .cu-tag:last-child::after,
+.cu-capsule.round .cu-tag:last-child {
+	border-top-right-radius: 200upx;
+	border-bottom-right-radius: 200upx;
+	text-indent: -4upx;
+}
+
+.cu-tag.badge {
+	border-radius: 200upx;
+	position: absolute;
+	top: -10upx;
+	right: -10upx;
+	font-size: 20upx;
+	padding: 0upx 10upx;
+	height: 28upx;
+	color: #ffffff;
+}
+
+.cu-tag.badge:not([class*="bg-"]) {
+	background-color: #dd514c;
+}
+
+.cu-tag:empty:not([class*="cuIcon-"]) {
+	padding: 0upx;
+	width: 16upx;
+	height: 16upx;
+	top: -4upx;
+	right: -4upx;
+}
+
+.cu-tag[class*="cuIcon-"] {
+	width: 32upx;
+	height: 32upx;
+	top: -4upx;
+	right: -4upx;
+}
+
+/* ==================
+          头像
+ ==================== */
+
+.cu-avatar {
+	font-variant: small-caps;
+	margin: 0;
+	padding: 0;
+	display: inline-flex;
+	text-align: center;
+	justify-content: center;
+	align-items: center;
+	background-color: #ccc;
+	color: #ffffff;
+	white-space: nowrap;
+	position: relative;
+	width: 64upx;
+	height: 64upx;
+	background-size: cover;
+	background-position: center;
+	vertical-align: middle;
+	font-size: 1.5em;
+}
+
+.cu-avatar.sm {
+	width: 48upx;
+	height: 48upx;
+	font-size: 1em;
+}
+
+.cu-avatar.lg {
+	width: 96upx;
+	height: 96upx;
+	font-size: 2em;
+}
+
+.cu-avatar.xl {
+	width: 128upx;
+	height: 128upx;
+	font-size: 2.5em;
+}
+
+.cu-avatar .avatar-text {
+	font-size: 0.4em;
+}
+
+.cu-avatar-group {
+	direction: rtl;
+	unicode-bidi: bidi-override;
+	padding: 0 10upx 0 40upx;
+	display: inline-block;
+}
+
+.cu-avatar-group .cu-avatar {
+	margin-left: -30upx;
+	border: 4upx solid #f1f1f1;
+	vertical-align: middle;
+}
+
+.cu-avatar-group .cu-avatar.sm {
+	margin-left: -20upx;
+	border: 1upx solid #f1f1f1;
+}
+
+/* ==================
+         进度条
+ ==================== */
+
+.cu-progress {
+	overflow: hidden;
+	height: 28upx;
+	background-color: #ebeef5;
+	display: inline-flex;
+	align-items: center;
+	width: 100%;
+}
+
+.cu-progress+view,
+.cu-progress+text {
+	line-height: 1;
+}
+
+.cu-progress.xs {
+	height: 10upx;
+}
+
+.cu-progress.sm {
+	height: 20upx;
+}
+
+.cu-progress view {
+	width: 0;
+	height: 100%;
+	align-items: center;
+	display: flex;
+	justify-items: flex-end;
+	justify-content: space-around;
+	font-size: 20upx;
+	color: #ffffff;
+	transition: width 0.6s ease;
+}
+
+.cu-progress text {
+	align-items: center;
+	display: flex;
+	font-size: 20upx;
+	color: #333333;
+	text-indent: 10upx;
+}
+
+.cu-progress.text-progress {
+	padding-right: 60upx;
+}
+
+.cu-progress.striped view {
+	background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+	background-size: 72upx 72upx;
+}
+
+.cu-progress.active view {
+	animation: progress-stripes 2s linear infinite;
+}
+
+@keyframes progress-stripes {
+	from {
+		background-position: 72upx 0;
+	}
+
+	to {
+		background-position: 0 0;
+	}
+}
+
+/* ==================
+          加载
+ ==================== */
+
+.cu-load {
+	display: block;
+	line-height: 3em;
+	text-align: center;
+}
+
+.cu-load::before {
+	font-family: "cuIcon";
+	display: inline-block;
+	margin-right: 6upx;
+}
+
+.cu-load.loading::before {
+	content: "\e67a";
+	animation: cuIcon-spin 2s infinite linear;
+}
+
+.cu-load.loading::after {
+	content: "加载中...";
+}
+
+.cu-load.over::before {
+	content: "\e64a";
+}
+
+.cu-load.over::after {
+	content: "没有更多了";
+}
+
+.cu-load.erro::before {
+	content: "\e658";
+}
+
+.cu-load.erro::after {
+	content: "加载失败";
+}
+
+.cu-load.load-cuIcon::before {
+	font-size: 32upx;
+}
+
+.cu-load.load-cuIcon::after {
+	display: none;
+}
+
+.cu-load.load-cuIcon.over {
+	display: none;
+}
+
+.cu-load.load-modal {
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 140upx;
+	left: 0;
+	margin: auto;
+	width: 260upx;
+	height: 260upx;
+	background-color: #ffffff;
+	border-radius: 10upx;
+	box-shadow: 0 0 0upx 2000upx rgba(0, 0, 0, 0.5);
+	display: flex;
+	align-items: center;
+	flex-direction: column;
+	justify-content: center;
+	font-size: 28upx;
+	z-index: 9999;
+	line-height: 2.4em;
+}
+
+.cu-load.load-modal [class*="cuIcon-"] {
+	font-size: 60upx;
+}
+
+.cu-load.load-modal image {
+	width: 70upx;
+	height: 70upx;
+}
+
+.cu-load.load-modal::after {
+	content: "";
+	position: absolute;
+	background-color: #ffffff;
+	border-radius: 50%;
+	width: 200upx;
+	height: 200upx;
+	font-size: 10px;
+	border-top: 6upx solid rgba(0, 0, 0, 0.05);
+	border-right: 6upx solid rgba(0, 0, 0, 0.05);
+	border-bottom: 6upx solid rgba(0, 0, 0, 0.05);
+	border-left: 6upx solid #f37b1d;
+	animation: cuIcon-spin 1s infinite linear;
+	z-index: -1;
+}
+
+.load-progress {
+	pointer-events: none;
+	top: 0;
+	position: fixed;
+	width: 100%;
+	left: 0;
+	z-index: 2000;
+}
+
+.load-progress.hide {
+	display: none;
+}
+
+.load-progress .load-progress-bar {
+	position: relative;
+	width: 100%;
+	height: 4upx;
+	overflow: hidden;
+	transition: all 200ms ease 0s;
+}
+
+.load-progress .load-progress-spinner {
+	position: absolute;
+	top: 10upx;
+	right: 10upx;
+	z-index: 2000;
+	display: block;
+}
+
+.load-progress .load-progress-spinner::after {
+	content: "";
+	display: block;
+	width: 24upx;
+	height: 24upx;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+	border: solid 4upx transparent;
+	border-top-color: inherit;
+	border-left-color: inherit;
+	border-radius: 50%;
+	-webkit-animation: load-progress-spinner 0.4s linear infinite;
+	animation: load-progress-spinner 0.4s linear infinite;
+}
+
+@-webkit-keyframes load-progress-spinner {
+	0% {
+		-webkit-transform: rotate(0);
+		transform: rotate(0);
+	}
+
+	100% {
+		-webkit-transform: rotate(360deg);
+		transform: rotate(360deg);
+	}
+}
+
+@keyframes load-progress-spinner {
+	0% {
+		-webkit-transform: rotate(0);
+		transform: rotate(0);
+	}
+
+	100% {
+		-webkit-transform: rotate(360deg);
+		transform: rotate(360deg);
+	}
+}
+
+/* ==================
+          列表
+ ==================== */
+.grayscale {
+	filter: grayscale(1);
+}
+
+.cu-list+.cu-list {
+	margin-top: 30upx
+}
+
+.cu-list>.cu-item {
+	transition: all .6s ease-in-out 0s;
+	transform: translateX(0upx)
+}
+
+.cu-list>.cu-item.move-cur {
+	transform: translateX(-260upx)
+}
+
+.cu-list>.cu-item .move {
+	position: absolute;
+	right: 0;
+	display: flex;
+	width: 260upx;
+	height: 100%;
+	transform: translateX(100%)
+}
+
+.cu-list>.cu-item .move view {
+	display: flex;
+	flex: 1;
+	justify-content: center;
+	align-items: center
+}
+
+.cu-list.menu-avatar {
+	overflow: hidden;
+}
+
+.cu-list.menu-avatar>.cu-item {
+	position: relative;
+	display: flex;
+	padding-right: 10upx;
+	height: 140upx;
+	background-color: #ffffff;
+	justify-content: flex-end;
+	align-items: center
+}
+
+.cu-list.menu-avatar>.cu-item>.cu-avatar {
+	position: absolute;
+	left: 30upx
+}
+
+.cu-list.menu-avatar>.cu-item .flex .text-cut {
+	max-width: 510upx
+}
+
+.cu-list.menu-avatar>.cu-item .content {
+	position: absolute;
+	left: 146upx;
+	width: calc(100% - 96upx - 60upx - 120upx - 20upx);
+	line-height: 1.6em;
+}
+
+.cu-list.menu-avatar>.cu-item .content.flex-sub {
+	width: calc(100% - 96upx - 60upx - 20upx);
+}
+
+.cu-list.menu-avatar>.cu-item .content>view:first-child {
+	font-size: 30upx;
+	display: flex;
+	align-items: center
+}
+
+.cu-list.menu-avatar>.cu-item .content .cu-tag.sm {
+	display: inline-block;
+	margin-left: 10upx;
+	height: 28upx;
+	font-size: 16upx;
+	line-height: 32upx
+}
+
+.cu-list.menu-avatar>.cu-item .action {
+	width: 100upx;
+	text-align: center
+}
+
+.cu-list.menu-avatar>.cu-item .action view+view {
+	margin-top: 10upx
+}
+
+.cu-list.menu-avatar.comment>.cu-item .content {
+	position: relative;
+	left: 0;
+	width: auto;
+	flex: 1;
+}
+
+.cu-list.menu-avatar.comment>.cu-item {
+	padding: 30upx 30upx 30upx 120upx;
+	height: auto
+}
+
+.cu-list.menu-avatar.comment .cu-avatar {
+	align-self: flex-start
+}
+
+.cu-list.menu>.cu-item {
+	position: relative;
+	display: flex;
+	padding: 0 30upx;
+	min-height: 100upx;
+	background-color: #ffffff;
+	justify-content: space-between;
+	align-items: center
+}
+
+.cu-list.menu>.cu-item:last-child:after {
+	border: none
+}
+
+.cu-list.menu-avatar>.cu-item:after,
+.cu-list.menu>.cu-item:after {
+	position: absolute;
+	top: 0;
+	left: 0;
+	box-sizing: border-box;
+	width: 200%;
+	height: 200%;
+	border-bottom: 1upx solid #ddd;
+	border-radius: inherit;
+	content: " ";
+	transform: scale(.5);
+	transform-origin: 0 0;
+	pointer-events: none
+}
+
+.cu-list.menu>.cu-item.grayscale {
+	background-color: #f5f5f5
+}
+
+.cu-list.menu>.cu-item.cur {
+	background-color: #fcf7e9
+}
+
+.cu-list.menu>.cu-item.arrow {
+	padding-right: 90upx
+}
+
+.cu-list.menu>.cu-item.arrow:before {
+	position: absolute;
+	top: 0;
+	right: 30upx;
+	bottom: 0;
+	display: block;
+	margin: auto;
+	width: 30upx;
+	height: 30upx;
+	color: #8799a3;
+	content: "\e6a3";
+	text-align: center;
+	font-size: 34upx;
+	font-family: cuIcon;
+	line-height: 30upx
+}
+
+.cu-list.menu>.cu-item button.content {
+	padding: 0;
+	background-color: transparent;
+	justify-content: flex-start
+}
+
+.cu-list.menu>.cu-item button.content:after {
+	display: none
+}
+
+.cu-list.menu>.cu-item .cu-avatar-group .cu-avatar {
+	border-color: #ffffff
+}
+
+.cu-list.menu>.cu-item .content>view:first-child {
+	display: flex;
+	align-items: center
+}
+
+.cu-list.menu>.cu-item .content>text[class*=cuIcon] {
+	display: inline-block;
+	margin-right: 10upx;
+	width: 1.6em;
+	text-align: center
+}
+
+.cu-list.menu>.cu-item .content>image {
+	display: inline-block;
+	margin-right: 10upx;
+	width: 1.6em;
+	height: 1.6em;
+	vertical-align: middle
+}
+
+.cu-list.menu>.cu-item .content {
+	font-size: 30upx;
+	line-height: 1.6em;
+	flex: 1
+}
+
+.cu-list.menu>.cu-item .content .cu-tag.sm {
+	display: inline-block;
+	margin-left: 10upx;
+	height: 28upx;
+	font-size: 16upx;
+	line-height: 32upx
+}
+
+.cu-list.menu>.cu-item .action .cu-tag:empty {
+	right: 10upx
+}
+
+.cu-list.menu {
+	display: block;
+	overflow: hidden
+}
+
+.cu-list.menu.sm-border>.cu-item:after {
+	left: 30upx;
+	width: calc(200% - 120upx)
+}
+
+.cu-list.grid>.cu-item {
+	position: relative;
+	display: flex;
+	padding: 20upx 0 30upx;
+	transition-duration: 0s;
+	flex-direction: column
+}
+
+.cu-list.grid>.cu-item:after {
+	position: absolute;
+	top: 0;
+	left: 0;
+	box-sizing: border-box;
+	width: 200%;
+	height: 200%;
+	border-right: 1px solid rgba(0, 0, 0, .1);
+	border-bottom: 1px solid rgba(0, 0, 0, .1);
+	border-radius: inherit;
+	content: " ";
+	transform: scale(.5);
+	transform-origin: 0 0;
+	pointer-events: none
+}
+
+.cu-list.grid>.cu-item text {
+	display: block;
+	margin-top: 10upx;
+	color: #888;
+	font-size: 26upx;
+	line-height: 40upx
+}
+
+.cu-list.grid>.cu-item [class*=cuIcon] {
+	position: relative;
+	display: block;
+	margin-top: 20upx;
+	width: 100%;
+	font-size: 48upx
+}
+
+.cu-list.grid>.cu-item .cu-tag {
+	right: auto;
+	left: 50%;
+	margin-left: 20upx
+}
+
+.cu-list.grid {
+	background-color: #ffffff;
+	text-align: center
+}
+
+.cu-list.grid.no-border>.cu-item {
+	padding-top: 10upx;
+	padding-bottom: 20upx
+}
+
+.cu-list.grid.no-border>.cu-item:after {
+	border: none
+}
+
+.cu-list.grid.no-border {
+	padding: 20upx 10upx
+}
+
+.cu-list.grid.col-3>.cu-item:nth-child(3n):after,
+.cu-list.grid.col-4>.cu-item:nth-child(4n):after,
+.cu-list.grid.col-5>.cu-item:nth-child(5n):after {
+	border-right-width: 0
+}
+
+.cu-list.card-menu {
+	overflow: hidden;
+	margin-right: 30upx;
+	margin-left: 30upx;
+	border-radius: 20upx
+}
+
+
+/* ==================
+          操作条
+ ==================== */
+
+.cu-bar {
+	display: flex;
+	position: relative;
+	align-items: center;
+	min-height: 100upx;
+	justify-content: space-between;
+}
+
+.cu-bar .action {
+	display: flex;
+	align-items: center;
+	height: 100%;
+	justify-content: center;
+	max-width: 100%;
+}
+
+.cu-bar .action.border-title {
+	position: relative;
+	top: -10upx;
+}
+
+.cu-bar .action.border-title text[class*="bg-"]:last-child {
+	position: absolute;
+	bottom: -0.5rem;
+	min-width: 2rem;
+	height: 6upx;
+	left: 0;
+}
+
+.cu-bar .action.sub-title {
+	position: relative;
+	top: -0.2rem;
+}
+
+.cu-bar .action.sub-title text {
+	position: relative;
+	z-index: 1;
+}
+
+.cu-bar .action.sub-title text[class*="bg-"]:last-child {
+	position: absolute;
+	display: inline-block;
+	bottom: -0.2rem;
+	border-radius: 6upx;
+	width: 100%;
+	height: 0.6rem;
+	left: 0.6rem;
+	opacity: 0.3;
+	z-index: 0;
+}
+
+.cu-bar .action.sub-title text[class*="text-"]:last-child {
+	position: absolute;
+	display: inline-block;
+	bottom: -0.7rem;
+	left: 0.5rem;
+	opacity: 0.2;
+	z-index: 0;
+	text-align: right;
+	font-weight: 900;
+	font-size: 36upx;
+}
+
+.cu-bar.justify-center .action.border-title text:last-child,
+.cu-bar.justify-center .action.sub-title text:last-child {
+	left: 0;
+	right: 0;
+	margin: auto;
+	text-align: center;
+}
+
+.cu-bar .action:first-child {
+	margin-left: 30upx;
+	font-size: 30upx;
+}
+
+.cu-bar .action text.text-cut {
+	text-align: left;
+	width: 100%;
+}
+
+.cu-bar .cu-avatar:first-child {
+	margin-left: 20upx;
+}
+
+.cu-bar .action:first-child>text[class*="cuIcon-"] {
+	margin-left: -0.3em;
+	margin-right: 0.3em;
+}
+
+.cu-bar .action:last-child {
+	margin-right: 30upx;
+}
+
+.cu-bar .action>text[class*="cuIcon-"],
+.cu-bar .action>view[class*="cuIcon-"] {
+	font-size: 36upx;
+}
+
+.cu-bar .action>text[class*="cuIcon-"]+text[class*="cuIcon-"] {
+	margin-left: 0.5em;
+}
+
+.cu-bar .content {
+	position: absolute;
+	text-align: center;
+	width: calc(100% - 340upx);
+	left: 0;
+	right: 0;
+	bottom: 0;
+	top: 0;
+	margin: auto;
+	height: 60upx;
+	font-size: 32upx;
+	line-height: 60upx;
+	cursor: none;
+	pointer-events: none;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+}
+
+.cu-bar.ios .content {
+	bottom: 7px;
+	height: 30px;
+	font-size: 32upx;
+	line-height: 30px;
+}
+
+.cu-bar.btn-group {
+	justify-content: space-around;
+}
+
+.cu-bar.btn-group button {
+	padding: 20upx 32upx;
+}
+
+.cu-bar.btn-group button {
+	flex: 1;
+	margin: 0 20upx;
+	max-width: 50%;
+}
+
+.cu-bar .search-form {
+	background-color: #f5f5f5;
+	line-height: 64upx;
+	height: 64upx;
+	font-size: 24upx;
+	color: #333333;
+	flex: 1;
+	display: flex;
+	align-items: center;
+	margin: 0 30upx;
+}
+
+.cu-bar .search-form+.action {
+	margin-right: 30upx;
+}
+
+.cu-bar .search-form input {
+	flex: 1;
+	padding-right: 30upx;
+	height: 64upx;
+	line-height: 64upx;
+	font-size: 26upx;
+	background-color: transparent;
+}
+
+.cu-bar .search-form [class*="cuIcon-"] {
+	margin: 0 0.5em 0 0.8em;
+}
+
+.cu-bar .search-form [class*="cuIcon-"]::before {
+	top: 0upx;
+}
+
+.cu-bar.fixed,
+.nav.fixed {
+	position: fixed;
+	width: 100%;
+	top: 0;
+	z-index: 1024;
+	box-shadow: 0 1upx 6upx rgba(0, 0, 0, 0.1);
+}
+
+.cu-bar.foot {
+	position: fixed;
+	width: 100%;
+	bottom: 0;
+	z-index: 1024;
+	box-shadow: 0 -1upx 6upx rgba(0, 0, 0, 0.1);
+}
+
+.cu-bar.tabbar {
+	padding: 0;
+	height: calc(100upx + env(safe-area-inset-bottom) / 2);
+	padding-bottom: calc(env(safe-area-inset-bottom) / 2);
+}
+
+.cu-tabbar-height {
+	min-height: 100upx;
+	height: calc(100upx + env(safe-area-inset-bottom) / 2);
+}
+
+.cu-bar.tabbar.shadow {
+	box-shadow: 0 -1upx 6upx rgba(0, 0, 0, 0.1);
+}
+
+.cu-bar.tabbar .action {
+	font-size: 22upx;
+	position: relative;
+	flex: 1;
+	text-align: center;
+	padding: 0;
+	display: block;
+	height: auto;
+	line-height: 1;
+	margin: 0;
+	background-color: inherit;
+	overflow: initial;
+}
+
+.cu-bar.tabbar.shop .action {
+	width: 140upx;
+	flex: initial;
+}
+
+.cu-bar.tabbar .action.add-action {
+	position: relative;
+	z-index: 2;
+	padding-top: 50upx;
+}
+
+.cu-bar.tabbar .action.add-action [class*="cuIcon-"] {
+	position: absolute;
+	width: 70upx;
+	z-index: 2;
+	height: 70upx;
+	border-radius: 50%;
+	line-height: 70upx;
+	font-size: 50upx;
+	top: -35upx;
+	left: 0;
+	right: 0;
+	margin: auto;
+	padding: 0;
+}
+
+.cu-bar.tabbar .action.add-action::after {
+	content: "";
+	position: absolute;
+	width: 100upx;
+	height: 100upx;
+	top: -50upx;
+	left: 0;
+	right: 0;
+	margin: auto;
+	box-shadow: 0 -3upx 8upx rgba(0, 0, 0, 0.08);
+	border-radius: 50upx;
+	background-color: inherit;
+	z-index: 0;
+}
+
+.cu-bar.tabbar .action.add-action::before {
+	content: "";
+	position: absolute;
+	width: 100upx;
+	height: 30upx;
+	bottom: 30upx;
+	left: 0;
+	right: 0;
+	margin: auto;
+	background-color: inherit;
+	z-index: 1;
+}
+
+.cu-bar.tabbar .btn-group {
+	flex: 1;
+	display: flex;
+	justify-content: space-around;
+	align-items: center;
+	padding: 0 10upx;
+}
+
+.cu-bar.tabbar button.action::after {
+	border: 0;
+}
+
+.cu-bar.tabbar .action [class*="cuIcon-"] {
+	width: 100upx;
+	position: relative;
+	display: block;
+	height: auto;
+	margin: 0 auto 10upx;
+	text-align: center;
+	font-size: 40upx;
+}
+
+.cu-bar.tabbar .action .cuIcon-cu-image {
+	margin: 0 auto;
+}
+
+.cu-bar.tabbar .action .cuIcon-cu-image image {
+	width: 50upx;
+	height: 50upx;
+	display: inline-block;
+}
+
+.cu-bar.tabbar .submit {
+	align-items: center;
+	display: flex;
+	justify-content: center;
+	text-align: center;
+	position: relative;
+	flex: 2;
+	align-self: stretch;
+}
+
+.cu-bar.tabbar .submit:last-child {
+	flex: 2.6;
+}
+
+.cu-bar.tabbar .submit+.submit {
+	flex: 2;
+}
+
+.cu-bar.tabbar.border .action::before {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	border-right: 1upx solid rgba(0, 0, 0, 0.1);
+	z-index: 3;
+}
+
+.cu-bar.tabbar.border .action:last-child:before {
+	display: none;
+}
+
+.cu-bar.input {
+	padding-right: 20upx;
+	background-color: #ffffff;
+}
+
+.cu-bar.input input {
+	overflow: initial;
+	line-height: 64upx;
+	height: 64upx;
+	min-height: 64upx;
+	flex: 1;
+	font-size: 30upx;
+	margin: 0 20upx;
+}
+
+.cu-bar.input .action {
+	margin-left: 20upx;
+}
+
+.cu-bar.input .action [class*="cuIcon-"] {
+	font-size: 48upx;
+}
+
+.cu-bar.input input+.action {
+	margin-right: 20upx;
+	margin-left: 0upx;
+}
+
+.cu-bar.input .action:first-child [class*="cuIcon-"] {
+	margin-left: 0upx;
+}
+
+.cu-custom {
+	display: block;
+	position: relative;
+}
+
+.cu-custom .cu-bar .content {
+	width: calc(100% - 440upx);
+}
+
+/* #ifdef MP-ALIPAY */
+.cu-custom .cu-bar .action .cuIcon-back {
+	opacity: 0;
+}
+
+/* #endif */
+
+.cu-custom .cu-bar .content image {
+	height: 60upx;
+	width: 240upx;
+}
+
+.cu-custom .cu-bar {
+	min-height: 0px;
+	/* #ifdef MP-WEIXIN */
+	padding-right: 220upx;
+	/* #endif */
+	/* #ifdef MP-ALIPAY */
+	padding-right: 150upx;
+	/* #endif */
+	box-shadow: 0upx 0upx 0upx;
+	z-index: 9999;
+}
+
+.cu-custom .cu-bar .border-custom {
+	position: relative;
+	background: rgba(0, 0, 0, 0.15);
+	border-radius: 1000upx;
+	height: 30px;
+}
+
+.cu-custom .cu-bar .border-custom::after {
+	content: " ";
+	width: 200%;
+	height: 200%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	border-radius: inherit;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	pointer-events: none;
+	box-sizing: border-box;
+	border: 1upx solid #ffffff;
+	opacity: 0.5;
+}
+
+.cu-custom .cu-bar .border-custom::before {
+	content: " ";
+	width: 1upx;
+	height: 110%;
+	position: absolute;
+	top: 22.5%;
+	left: 0;
+	right: 0;
+	margin: auto;
+	transform: scale(0.5);
+	transform-origin: 0 0;
+	pointer-events: none;
+	box-sizing: border-box;
+	opacity: 0.6;
+	background-color: #ffffff;
+}
+
+.cu-custom .cu-bar .border-custom text {
+	display: block;
+	flex: 1;
+	margin: auto !important;
+	text-align: center;
+	font-size: 34upx;
+}
+
+/* ==================
+         导航栏
+ ==================== */
+
+.nav {
+	white-space: nowrap;
+}
+
+::-webkit-scrollbar {
+	display: none;
+}
+
+.nav .cu-item {
+	height: 90upx;
+	display: inline-block;
+	line-height: 90upx;
+	margin: 0 10upx;
+	padding: 0 20upx;
+}
+
+.nav .cu-item.cur {
+	border-bottom: 4upx solid;
+}
+
+/* ==================
+         时间轴
+ ==================== */
+
+.cu-timeline {
+	display: block;
+	background-color: #ffffff;
+}
+
+.cu-timeline .cu-time {
+	width: 120upx;
+	text-align: center;
+	padding: 20upx 0;
+	font-size: 26upx;
+	color: #888;
+	display: block;
+}
+
+.cu-timeline>.cu-item {
+	padding: 30upx 30upx 30upx 120upx;
+	position: relative;
+	display: block;
+	z-index: 0;
+}
+
+.cu-timeline>.cu-item:not([class*="text-"]) {
+	color: #ccc;
+}
+
+.cu-timeline>.cu-item::after {
+	content: "";
+	display: block;
+	position: absolute;
+	width: 1upx;
+	background-color: #ddd;
+	left: 60upx;
+	height: 100%;
+	top: 0;
+	z-index: 8;
+}
+
+.cu-timeline>.cu-item::before {
+	font-family: "cuIcon";
+	display: block;
+	position: absolute;
+	top: 36upx;
+	z-index: 9;
+	background-color: #ffffff;
+	width: 50upx;
+	height: 50upx;
+	text-align: center;
+	border: none;
+	line-height: 50upx;
+	left: 36upx;
+}
+
+.cu-timeline>.cu-item:not([class*="cuIcon-"])::before {
+	content: "\e763";
+}
+
+.cu-timeline>.cu-item[class*="cuIcon-"]::before {
+	background-color: #ffffff;
+	width: 50upx;
+	height: 50upx;
+	text-align: center;
+	border: none;
+	line-height: 50upx;
+	left: 36upx;
+}
+
+.cu-timeline>.cu-item>.content {
+	padding: 30upx;
+	border-radius: 6upx;
+	display: block;
+	line-height: 1.6;
+}
+
+.cu-timeline>.cu-item>.content:not([class*="bg-"]) {
+	background-color: #f1f1f1;
+	color: #333333;
+}
+
+.cu-timeline>.cu-item>.content+.content {
+	margin-top: 20upx;
+}
+
+/* ==================
+         聊天
+ ==================== */
+
+.cu-chat {
+	display: flex;
+	flex-direction: column;
+}
+
+.cu-chat .cu-item {
+	display: flex;
+	padding: 30upx 30upx 70upx;
+	position: relative;
+}
+
+.cu-chat .cu-item>.cu-avatar {
+	width: 80upx;
+	height: 80upx;
+}
+
+.cu-chat .cu-item>.main {
+	max-width: calc(100% - 260upx);
+	margin: 0 40upx;
+	display: flex;
+	align-items: center;
+}
+
+.cu-chat .cu-item>image {
+	height: 320upx;
+}
+
+.cu-chat .cu-item>.main .content {
+	padding: 20upx;
+	border-radius: 6upx;
+	display: inline-flex;
+	max-width: 100%;
+	align-items: center;
+	font-size: 30upx;
+	position: relative;
+	min-height: 80upx;
+	line-height: 40upx;
+	text-align: left;
+}
+
+.cu-chat .cu-item>.main .content:not([class*="bg-"]) {
+	background-color: #ffffff;
+	color: #333333;
+}
+
+.cu-chat .cu-item .date {
+	position: absolute;
+	font-size: 24upx;
+	color: #8799a3;
+	width: calc(100% - 320upx);
+	bottom: 20upx;
+	left: 160upx;
+}
+
+.cu-chat .cu-item .action {
+	padding: 0 30upx;
+	display: flex;
+	align-items: center;
+}
+
+.cu-chat .cu-item>.main .content::after {
+	content: "";
+	top: 27upx;
+	transform: rotate(45deg);
+	position: absolute;
+	z-index: 100;
+	display: inline-block;
+	overflow: hidden;
+	width: 24upx;
+	height: 24upx;
+	left: -12upx;
+	right: initial;
+	background-color: inherit;
+}
+
+.cu-chat .cu-item.self>.main .content::after {
+	left: auto;
+	right: -12upx;
+}
+
+.cu-chat .cu-item>.main .content::before {
+	content: "";
+	top: 30upx;
+	transform: rotate(45deg);
+	position: absolute;
+	z-index: -1;
+	display: inline-block;
+	overflow: hidden;
+	width: 24upx;
+	height: 24upx;
+	left: -12upx;
+	right: initial;
+	background-color: inherit;
+	filter: blur(5upx);
+	opacity: 0.3;
+}
+
+.cu-chat .cu-item>.main .content:not([class*="bg-"])::before {
+	background-color: #333333;
+	opacity: 0.1;
+}
+
+.cu-chat .cu-item.self>.main .content::before {
+	left: auto;
+	right: -12upx;
+}
+
+.cu-chat .cu-item.self {
+	justify-content: flex-end;
+	text-align: right;
+}
+
+.cu-chat .cu-info {
+	display: inline-block;
+	margin: 20upx auto;
+	font-size: 24upx;
+	padding: 8upx 12upx;
+	background-color: rgba(0, 0, 0, 0.2);
+	border-radius: 6upx;
+	color: #ffffff;
+	max-width: 400upx;
+	line-height: 1.4;
+}
+
+/* ==================
+         卡片
+ ==================== */
+
+.cu-card {
+	display: block;
+	overflow: hidden;
+}
+
+.cu-card>.cu-item {
+	display: block;
+	background-color: #ffffff;
+	overflow: hidden;
+	border-radius: 10upx;
+	margin: 30upx;
+}
+
+.cu-card>.cu-item.shadow-blur {
+	overflow: initial;
+}
+
+.cu-card.no-card>.cu-item {
+	margin: 0upx;
+	border-radius: 0upx;
+}
+
+.cu-card .grid.grid-square {
+	margin-bottom: -20upx;
+}
+
+.cu-card.case .image {
+	position: relative;
+}
+
+.cu-card.case .image image {
+	width: 100%;
+}
+
+.cu-card.case .image .cu-tag {
+	position: absolute;
+	right: 0;
+	top: 0;
+}
+
+.cu-card.case .image .cu-bar {
+	position: absolute;
+	bottom: 0;
+	width: 100%;
+	background-color: transparent;
+	padding: 0upx 30upx;
+}
+
+.cu-card.case.no-card .image {
+	margin: 30upx 30upx 0;
+	overflow: hidden;
+	border-radius: 10upx;
+}
+
+.cu-card.dynamic {
+	display: block;
+}
+
+.cu-card.dynamic>.cu-item {
+	display: block;
+	background-color: #ffffff;
+	overflow: hidden;
+}
+
+.cu-card.dynamic>.cu-item>.text-content {
+	padding: 0 30upx 0;
+	max-height: 6.4em;
+	overflow: hidden;
+	font-size: 30upx;
+	margin-bottom: 20upx;
+}
+
+.cu-card.dynamic>.cu-item .square-img {
+	width: 100%;
+	height: 200upx;
+	border-radius: 6upx;
+}
+
+.cu-card.dynamic>.cu-item .only-img {
+	width: 100%;
+	height: 320upx;
+	border-radius: 6upx;
+}
+
+/* card.dynamic>.cu-item .comment {
+  padding: 20upx;
+  background-color: #f1f1f1;
+  margin: 0 30upx 30upx;
+  border-radius: 6upx;
+} */
+
+.cu-card.article {
+	display: block;
+}
+
+.cu-card.article>.cu-item {
+	padding-bottom: 30upx;
+}
+
+.cu-card.article>.cu-item .title {
+	font-size: 30upx;
+	font-weight: 900;
+	color: #333333;
+	line-height: 100upx;
+	padding: 0 30upx;
+}
+
+.cu-card.article>.cu-item .content {
+	display: flex;
+	padding: 0 30upx;
+}
+
+.cu-card.article>.cu-item .content>image {
+	width: 240upx;
+	height: 6.4em;
+	margin-right: 20upx;
+	border-radius: 6upx;
+}
+
+.cu-card.article>.cu-item .content .desc {
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+}
+
+.cu-card.article>.cu-item .content .text-content {
+	font-size: 28upx;
+	color: #888;
+	height: 4.8em;
+	overflow: hidden;
+}
+
+/* ==================
+         表单
+ ==================== */
+
+.cu-form-group {
+	background-color: #ffffff;
+	padding: 1upx 30upx;
+	display: flex;
+	align-items: center;
+	min-height: 100upx;
+	justify-content: space-between;
+}
+
+.cu-form-group+.cu-form-group {
+	border-top: 1upx solid #eee;
+}
+
+.cu-form-group .title {
+	text-align: justify;
+	padding-right: 30upx;
+	font-size: 30upx;
+	position: relative;
+	height: 60upx;
+	line-height: 60upx;
+}
+
+.cu-form-group input {
+	flex: 1;
+	font-size: 30upx;
+	color: #555;
+	padding-right: 20upx;
+}
+
+.cu-form-group>text[class*="cuIcon-"] {
+	font-size: 36upx;
+	padding: 0;
+	box-sizing: border-box;
+}
+
+.cu-form-group textarea {
+	margin: 32upx 0 30upx;
+	height: 4.6em;
+	width: 100%;
+	line-height: 1.2em;
+	flex: 1;
+	font-size: 28upx;
+	padding: 0;
+}
+
+.cu-form-group.align-start .title {
+	height: 1em;
+	margin-top: 32upx;
+	line-height: 1em;
+}
+
+.cu-form-group picker {
+	flex: 1;
+	padding-right: 40upx;
+	overflow: hidden;
+	position: relative;
+}
+
+.cu-form-group picker .picker {
+	line-height: 100upx;
+	font-size: 28upx;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+	width: 100%;
+	text-align: right;
+}
+
+.cu-form-group picker::after {
+	font-family: cuIcon;
+	display: block;
+	content: "\e6a3";
+	position: absolute;
+	font-size: 34upx;
+	color: #8799a3;
+	line-height: 100upx;
+	width: 60upx;
+	text-align: center;
+	top: 0;
+	bottom: 0;
+	right: -20upx;
+	margin: auto;
+}
+
+.cu-form-group textarea[disabled],
+.cu-form-group textarea[disabled] .placeholder {
+	color: transparent;
+}
+
+/* ==================
+         模态窗口
+ ==================== */
+
+.cu-modal {
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	z-index: 1110;
+	opacity: 0;
+	outline: 0;
+	text-align: center;
+	-ms-transform: scale(1.185);
+	transform: scale(1.185);
+	backface-visibility: hidden;
+	perspective: 2000upx;
+	background: rgba(0, 0, 0, 0.6);
+	transition: all 0.3s ease-in-out 0s;
+	pointer-events: none;
+}
+
+.cu-modal::before {
+	content: "\200B";
+	display: inline-block;
+	height: 100%;
+	vertical-align: middle;
+}
+
+.cu-modal.show {
+	opacity: 1;
+	transition-duration: 0.3s;
+	-ms-transform: scale(1);
+	transform: scale(1);
+	overflow-x: hidden;
+	overflow-y: auto;
+	pointer-events: auto;
+}
+
+.cu-dialog {
+	position: relative;
+	display: inline-block;
+	vertical-align: middle;
+	margin-left: auto;
+	margin-right: auto;
+	width: 680upx;
+	max-width: 100%;
+	background-color: #f8f8f8;
+	border-radius: 10upx;
+	overflow: hidden;
+}
+
+.cu-modal.bottom-modal::before {
+	vertical-align: bottom;
+}
+
+.cu-modal.bottom-modal .cu-dialog {
+	width: 100%;
+	border-radius: 0;
+}
+
+.cu-modal.bottom-modal {
+	margin-bottom: -1000upx;
+}
+
+.cu-modal.bottom-modal.show {
+	margin-bottom: 0;
+}
+
+.cu-modal.drawer-modal {
+	transform: scale(1);
+	display: flex;
+}
+
+.cu-modal.drawer-modal .cu-dialog {
+	height: 100%;
+	min-width: 200upx;
+	border-radius: 0;
+	margin: initial;
+	transition-duration: 0.3s;
+}
+
+.cu-modal.drawer-modal.justify-start .cu-dialog {
+	transform: translateX(-100%);
+}
+
+.cu-modal.drawer-modal.justify-end .cu-dialog {
+	transform: translateX(100%);
+}
+
+.cu-modal.drawer-modal.show .cu-dialog {
+	transform: translateX(0%);
+}
+.cu-modal .cu-dialog>.cu-bar:first-child .action{
+  min-width: 100rpx;
+  margin-right: 0;
+  min-height: 100rpx;
+}
+/* ==================
+         轮播
+ ==================== */
+swiper .a-swiper-dot {
+	display: inline-block;
+	width: 16upx;
+	height: 16upx;
+	background: rgba(0, 0, 0, .3);
+	border-radius: 50%;
+	vertical-align: middle;
+}
+
+swiper[class*="-dot"] .wx-swiper-dots,
+swiper[class*="-dot"] .a-swiper-dots,
+swiper[class*="-dot"] .uni-swiper-dots {
+	display: flex;
+	align-items: center;
+	width: 100%;
+	justify-content: center;
+}
+
+swiper.square-dot .wx-swiper-dot,
+swiper.square-dot .a-swiper-dot,
+swiper.square-dot .uni-swiper-dot {
+	background-color: #ffffff;
+	opacity: 0.4;
+	width: 10upx;
+	height: 10upx;
+	border-radius: 20upx;
+	margin: 0 8upx !important;
+}
+
+swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active,
+swiper.square-dot .a-swiper-dot.a-swiper-dot-active,
+swiper.square-dot .uni-swiper-dot.uni-swiper-dot-active {
+	opacity: 1;
+	width: 30upx;
+}
+
+swiper.round-dot .wx-swiper-dot,
+swiper.round-dot .a-swiper-dot,
+swiper.round-dot .uni-swiper-dot {
+	width: 10upx;
+	height: 10upx;
+	position: relative;
+	margin: 4upx 8upx !important;
+}
+
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after,
+swiper.round-dot .a-swiper-dot.a-swiper-dot-active::after,
+swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active::after {
+	content: "";
+	position: absolute;
+	width: 10upx;
+	height: 10upx;
+	top: 0upx;
+	left: 0upx;
+	right: 0;
+	bottom: 0;
+	margin: auto;
+	background-color: #ffffff;
+	border-radius: 20upx;
+}
+
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active,
+swiper.round-dot .a-swiper-dot.a-swiper-dot-active,
+swiper.round-dot .uni-swiper-dot.uni-swiper-dot-active {
+	width: 18upx;
+	height: 18upx;
+}
+
+.screen-swiper {
+	min-height: 375upx;
+}
+
+.screen-swiper image,
+.screen-swiper video,
+.swiper-item image,
+.swiper-item video {
+	width: 100%;
+	display: block;
+	height: 100%;
+	margin: 0;
+	pointer-events: none;
+}
+
+.card-swiper {
+	height: 420upx !important;
+}
+
+.card-swiper swiper-item {
+	width: 610upx !important;
+	left: 70upx;
+	box-sizing: border-box;
+	padding: 40upx 0upx 70upx;
+	overflow: initial;
+}
+
+.card-swiper swiper-item .swiper-item {
+	width: 100%;
+	display: block;
+	height: 100%;
+	border-radius: 10upx;
+	transform: scale(0.9);
+	transition: all 0.2s ease-in 0s;
+	overflow: hidden;
+}
+
+.card-swiper swiper-item.cur .swiper-item {
+	transform: none;
+	transition: all 0.2s ease-in 0s;
+}
+
+
+.tower-swiper {
+	height: 420upx;
+	position: relative;
+	max-width: 750upx;
+	overflow: hidden;
+}
+
+.tower-swiper .tower-item {
+	position: absolute;
+	width: 300upx;
+	height: 380upx;
+	top: 0;
+	bottom: 0;
+	left: 50%;
+	margin: auto;
+	transition: all 0.2s ease-in 0s;
+	opacity: 1;
+}
+
+.tower-swiper .tower-item.none {
+	opacity: 0;
+}
+
+.tower-swiper .tower-item .swiper-item {
+	width: 100%;
+	height: 100%;
+	border-radius: 6upx;
+	overflow: hidden;
+}
+
+/* ==================
+          步骤条
+ ==================== */
+
+.cu-steps {
+	display: flex;
+}
+
+scroll-view.cu-steps {
+	display: block;
+	white-space: nowrap;
+}
+
+scroll-view.cu-steps .cu-item {
+	display: inline-block;
+}
+
+.cu-steps .cu-item {
+	flex: 1;
+	text-align: center;
+	position: relative;
+	min-width: 100upx;
+}
+
+.cu-steps .cu-item:not([class*="text-"]) {
+	color: #8799a3;
+}
+
+.cu-steps .cu-item [class*="cuIcon-"],
+.cu-steps .cu-item .num {
+	display: block;
+	font-size: 40upx;
+	line-height: 80upx;
+}
+
+.cu-steps .cu-item::before,
+.cu-steps .cu-item::after,
+.cu-steps.steps-arrow .cu-item::before,
+.cu-steps.steps-arrow .cu-item::after {
+	content: "";
+	display: block;
+	position: absolute;
+	height: 0px;
+	width: calc(100% - 80upx);
+	border-bottom: 1px solid #ccc;
+	left: calc(0px - (100% - 80upx) / 2);
+	top: 40upx;
+	z-index: 0;
+}
+
+.cu-steps.steps-arrow .cu-item::before,
+.cu-steps.steps-arrow .cu-item::after {
+	content: "\e6a3";
+	font-family: 'cuIcon';
+	height: 30upx;
+	border-bottom-width: 0px;
+	line-height: 30upx;
+	top: 0;
+	bottom: 0;
+	margin: auto;
+	color: #ccc;
+}
+
+.cu-steps.steps-bottom .cu-item::before,
+.cu-steps.steps-bottom .cu-item::after {
+	bottom: 40upx;
+	top: initial;
+}
+
+.cu-steps .cu-item::after {
+	border-bottom: 1px solid currentColor;
+	width: 0px;
+	transition: all 0.3s ease-in-out 0s;
+}
+
+.cu-steps .cu-item[class*="text-"]::after {
+	width: calc(100% - 80upx);
+	color: currentColor;
+}
+
+.cu-steps .cu-item:first-child::before,
+.cu-steps .cu-item:first-child::after {
+	display: none;
+}
+
+.cu-steps .cu-item .num {
+	width: 40upx;
+	height: 40upx;
+	border-radius: 50%;
+	line-height: 40upx;
+	margin: 20upx auto;
+	font-size: 24upx;
+	border: 1px solid currentColor;
+	position: relative;
+	overflow: hidden;
+}
+
+.cu-steps .cu-item[class*="text-"] .num {
+	background-color: currentColor;
+}
+
+.cu-steps .cu-item .num::before,
+.cu-steps .cu-item .num::after {
+	content: attr(data-index);
+	position: absolute;
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
+	margin: auto;
+	transition: all 0.3s ease-in-out 0s;
+	transform: translateY(0upx);
+}
+
+.cu-steps .cu-item[class*="text-"] .num::before {
+	transform: translateY(-40upx);
+	color: #ffffff;
+}
+
+.cu-steps .cu-item .num::after {
+	transform: translateY(40upx);
+	color: #ffffff;
+	transition: all 0.3s ease-in-out 0s;
+}
+
+.cu-steps .cu-item[class*="text-"] .num::after {
+	content: "\e645";
+	font-family: 'cuIcon';
+	color: #ffffff;
+	transform: translateY(0upx);
+}
+
+.cu-steps .cu-item[class*="text-"] .num.err::after {
+	content: "\e646";
+}
+
+/* ==================
+          布局
+ ==================== */
+
+/*  -- flex弹性布局 -- */
+
+.flex {
+	display: flex;
+}
+
+.basis-xs {
+	flex-basis: 20%;
+}
+
+.basis-sm {
+	flex-basis: 40%;
+}
+
+.basis-df {
+	flex-basis: 50%;
+}
+
+.basis-lg {
+	flex-basis: 60%;
+}
+
+.basis-xl {
+	flex-basis: 80%;
+}
+
+.flex-sub {
+	flex: 1;
+}
+
+.flex-twice {
+	flex: 2;
+}
+
+.flex-treble {
+	flex: 3;
+}
+
+.flex-direction {
+	flex-direction: column;
+}
+
+.flex-wrap {
+	flex-wrap: wrap;
+}
+
+.align-start {
+	align-items: flex-start;
+}
+
+.align-end {
+	align-items: flex-end;
+}
+
+.align-center {
+	align-items: center;
+}
+
+.align-stretch {
+	align-items: stretch;
+}
+
+.self-start {
+	align-self: flex-start;
+}
+
+.self-center {
+	align-self: flex-center;
+}
+
+.self-end {
+	align-self: flex-end;
+}
+
+.self-stretch {
+	align-self: stretch;
+}
+
+.align-stretch {
+	align-items: stretch;
+}
+
+.justify-start {
+	justify-content: flex-start;
+}
+
+.justify-end {
+	justify-content: flex-end;
+}
+
+.justify-center {
+	justify-content: center;
+}
+
+.justify-between {
+	justify-content: space-between;
+}
+
+.justify-around {
+	justify-content: space-around;
+}
+
+/* grid布局 */
+
+.grid {
+	display: flex;
+	flex-wrap: wrap;
+}
+
+.grid.grid-square {
+	overflow: hidden;
+}
+
+.grid.grid-square .cu-tag {
+	position: absolute;
+	right: 0;
+	top: 0;
+	border-bottom-left-radius: 6upx;
+	padding: 6upx 12upx;
+	height: auto;
+	background-color: rgba(0, 0, 0, 0.5);
+}
+
+.grid.grid-square>view>text[class*="cuIcon-"] {
+	font-size: 52upx;
+	position: absolute;
+	color: #8799a3;
+	margin: auto;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	flex-direction: column;
+}
+
+.grid.grid-square>view {
+	margin-right: 20upx;
+	margin-bottom: 20upx;
+	border-radius: 6upx;
+	position: relative;
+	overflow: hidden;
+}
+.grid.grid-square>view.bg-img image {
+	width: 100%;
+	height: 100%;
+	position: absolute;
+}
+.grid.col-1.grid-square>view {
+	padding-bottom: 100%;
+	height: 0;
+	margin-right: 0;
+}
+
+.grid.col-2.grid-square>view {
+	padding-bottom: calc((100% - 20upx)/2);
+	height: 0;
+	width: calc((100% - 20upx)/2);
+}
+
+.grid.col-3.grid-square>view {
+	padding-bottom: calc((100% - 40upx)/3);
+	height: 0;
+	width: calc((100% - 40upx)/3);
+}
+
+.grid.col-4.grid-square>view {
+	padding-bottom: calc((100% - 60upx)/4);
+	height: 0;
+	width: calc((100% - 60upx)/4);
+}
+
+.grid.col-5.grid-square>view {
+	padding-bottom: calc((100% - 80upx)/5);
+	height: 0;
+	width: calc((100% - 80upx)/5);
+}
+
+.grid.col-2.grid-square>view:nth-child(2n),
+.grid.col-3.grid-square>view:nth-child(3n),
+.grid.col-4.grid-square>view:nth-child(4n),
+.grid.col-5.grid-square>view:nth-child(5n) {
+	margin-right: 0;
+}
+
+.grid.col-1>view {
+	width: 100%;
+}
+
+.grid.col-2>view {
+	width: 50%;
+}
+
+.grid.col-3>view {
+	width: 33.33%;
+}
+
+.grid.col-4>view {
+	width: 25%;
+}
+
+.grid.col-5>view {
+	width: 20%;
+}
+
+/*  -- 内外边距 -- */
+
+.margin-0 {
+	margin: 0;
+}
+
+.margin-xs {
+	margin: 10upx;
+}
+
+.margin-sm {
+	margin: 20upx;
+}
+
+.margin {
+	margin: 30upx;
+}
+
+.margin-lg {
+	margin: 40upx;
+}
+
+.margin-xl {
+	margin: 50upx;
+}
+
+.margin-top-xs {
+	margin-top: 10upx;
+}
+
+.margin-top-sm {
+	margin-top: 20upx;
+}
+
+.margin-top {
+	margin-top: 30upx;
+}
+
+.margin-top-lg {
+	margin-top: 40upx;
+}
+
+.margin-top-xl {
+	margin-top: 50upx;
+}
+
+.margin-right-xs {
+	margin-right: 10upx;
+}
+
+.margin-right-sm {
+	margin-right: 20upx;
+}
+
+.margin-right {
+	margin-right: 30upx;
+}
+
+.margin-right-lg {
+	margin-right: 40upx;
+}
+
+.margin-right-xl {
+	margin-right: 50upx;
+}
+
+.margin-bottom-xs {
+	margin-bottom: 10upx;
+}
+
+.margin-bottom-sm {
+	margin-bottom: 20upx;
+}
+
+.margin-bottom {
+	margin-bottom: 30upx;
+}
+
+.margin-bottom-lg {
+	margin-bottom: 40upx;
+}
+
+.margin-bottom-xl {
+	margin-bottom: 50upx;
+}
+
+.margin-left-xs {
+	margin-left: 10upx;
+}
+
+.margin-left-sm {
+	margin-left: 20upx;
+}
+
+.margin-left {
+	margin-left: 30upx;
+}
+
+.margin-left-lg {
+	margin-left: 40upx;
+}
+
+.margin-left-xl {
+	margin-left: 50upx;
+}
+
+.margin-lr-xs {
+	margin-left: 10upx;
+	margin-right: 10upx;
+}
+
+.margin-lr-sm {
+	margin-left: 20upx;
+	margin-right: 20upx;
+}
+
+.margin-lr {
+	margin-left: 30upx;
+	margin-right: 30upx;
+}
+
+.margin-lr-lg {
+	margin-left: 40upx;
+	margin-right: 40upx;
+}
+
+.margin-lr-xl {
+	margin-left: 50upx;
+	margin-right: 50upx;
+}
+
+.margin-tb-xs {
+	margin-top: 10upx;
+	margin-bottom: 10upx;
+}
+
+.margin-tb-sm {
+	margin-top: 20upx;
+	margin-bottom: 20upx;
+}
+
+.margin-tb {
+	margin-top: 30upx;
+	margin-bottom: 30upx;
+}
+
+.margin-tb-lg {
+	margin-top: 40upx;
+	margin-bottom: 40upx;
+}
+
+.margin-tb-xl {
+	margin-top: 50upx;
+	margin-bottom: 50upx;
+}
+
+.padding-0 {
+	padding: 0;
+}
+
+.padding-xs {
+	padding: 10upx;
+}
+
+.padding-sm {
+	padding: 20upx;
+}
+
+.padding {
+	padding: 30upx;
+}
+
+.padding-lg {
+	padding: 40upx;
+}
+
+.padding-xl {
+	padding: 50upx;
+}
+
+.padding-top-xs {
+	padding-top: 10upx;
+}
+
+.padding-top-sm {
+	padding-top: 20upx;
+}
+
+.padding-top {
+	padding-top: 30upx;
+}
+
+.padding-top-lg {
+	padding-top: 40upx;
+}
+
+.padding-top-xl {
+	padding-top: 50upx;
+}
+
+.padding-right-xs {
+	padding-right: 10upx;
+}
+
+.padding-right-sm {
+	padding-right: 20upx;
+}
+
+.padding-right {
+	padding-right: 30upx;
+}
+
+.padding-right-lg {
+	padding-right: 40upx;
+}
+
+.padding-right-xl {
+	padding-right: 50upx;
+}
+
+.padding-bottom-xs {
+	padding-bottom: 10upx;
+}
+
+.padding-bottom-sm {
+	padding-bottom: 20upx;
+}
+
+.padding-bottom {
+	padding-bottom: 30upx;
+}
+
+.padding-bottom-lg {
+	padding-bottom: 40upx;
+}
+
+.padding-bottom-xl {
+	padding-bottom: 50upx;
+}
+
+.padding-left-xs {
+	padding-left: 10upx;
+}
+
+.padding-left-sm {
+	padding-left: 20upx;
+}
+
+.padding-left {
+	padding-left: 30upx;
+}
+
+.padding-left-lg {
+	padding-left: 40upx;
+}
+
+.padding-left-xl {
+	padding-left: 50upx;
+}
+
+.padding-lr-xs {
+	padding-left: 10upx;
+	padding-right: 10upx;
+}
+
+.padding-lr-sm {
+	padding-left: 20upx;
+	padding-right: 20upx;
+}
+
+.padding-lr {
+	padding-left: 30upx;
+	padding-right: 30upx;
+}
+
+.padding-lr-lg {
+	padding-left: 40upx;
+	padding-right: 40upx;
+}
+
+.padding-lr-xl {
+	padding-left: 50upx;
+	padding-right: 50upx;
+}
+
+.padding-tb-xs {
+	padding-top: 10upx;
+	padding-bottom: 10upx;
+}
+
+.padding-tb-sm {
+	padding-top: 20upx;
+	padding-bottom: 20upx;
+}
+
+.padding-tb {
+	padding-top: 30upx;
+	padding-bottom: 30upx;
+}
+
+.padding-tb-lg {
+	padding-top: 40upx;
+	padding-bottom: 40upx;
+}
+
+.padding-tb-xl {
+	padding-top: 50upx;
+	padding-bottom: 50upx;
+}
+
+/* -- 浮动 --  */
+
+.cf::after,
+.cf::before {
+	content: " ";
+	display: table;
+}
+
+.cf::after {
+	clear: both;
+}
+
+.fl {
+	float: left;
+}
+
+.fr {
+	float: right;
+}
+
+/* ==================
+          背景
+ ==================== */
+
+.line-red::after,
+.lines-red::after {
+	border-color: #e54d42;
+}
+
+.line-orange::after,
+.lines-orange::after {
+	border-color: #f37b1d;
+}
+
+.line-yellow::after,
+.lines-yellow::after {
+	border-color: #fbbd08;
+}
+
+.line-olive::after,
+.lines-olive::after {
+	border-color: #8dc63f;
+}
+
+.line-green::after,
+.lines-green::after {
+	border-color: #39b54a;
+}
+
+.line-cyan::after,
+.lines-cyan::after {
+	border-color: #1cbbb4;
+}
+
+.line-blue::after,
+.lines-blue::after {
+	border-color: #0081ff;
+}
+
+.line-purple::after,
+.lines-purple::after {
+	border-color: #6739b6;
+}
+
+.line-mauve::after,
+.lines-mauve::after {
+	border-color: #9c26b0;
+}
+
+.line-pink::after,
+.lines-pink::after {
+	border-color: #e03997;
+}
+
+.line-brown::after,
+.lines-brown::after {
+	border-color: #a5673f;
+}
+
+.line-grey::after,
+.lines-grey::after {
+	border-color: #8799a3;
+}
+
+.line-gray::after,
+.lines-gray::after {
+	border-color: #aaaaaa;
+}
+
+.line-black::after,
+.lines-black::after {
+	border-color: #333333;
+}
+
+.line-white::after,
+.lines-white::after {
+	border-color: #ffffff;
+}
+
+.bg-red {
+	background-color: #e54d42;
+	color: #ffffff;
+}
+
+.bg-orange {
+	background-color: #f37b1d;
+	color: #ffffff;
+}
+
+.bg-yellow {
+	background-color: #fbbd08;
+	color: #333333;
+}
+
+.bg-olive {
+	background-color: #8dc63f;
+	color: #ffffff;
+}
+
+.bg-green {
+	background-color: #39b54a;
+	color: #ffffff;
+}
+
+.bg-cyan {
+	background-color: #1cbbb4;
+	color: #ffffff;
+}
+
+.bg-blue {
+	background-color: #0081ff;
+	color: #ffffff;
+}
+
+.bg-purple {
+	background-color: #6739b6;
+	color: #ffffff;
+}
+
+.bg-mauve {
+	background-color: #9c26b0;
+	color: #ffffff;
+}
+
+.bg-pink {
+	background-color: #e03997;
+	color: #ffffff;
+}
+
+.bg-brown {
+	background-color: #a5673f;
+	color: #ffffff;
+}
+
+.bg-grey {
+	background-color: #8799a3;
+	color: #ffffff;
+}
+
+.bg-gray {
+	background-color: #f0f0f0;
+	color: #333333;
+}
+
+.bg-black {
+	background-color: #333333;
+	color: #ffffff;
+}
+
+.bg-white {
+	background-color: #ffffff;
+	color: #666666;
+}
+
+.bg-shadeTop {
+	background-image: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.01));
+	color: #ffffff;
+}
+
+.bg-shadeBottom {
+	background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1));
+	color: #ffffff;
+}
+
+.bg-red.light {
+	color: #e54d42;
+	background-color: #fadbd9;
+}
+
+.bg-orange.light {
+	color: #f37b1d;
+	background-color: #fde6d2;
+}
+
+.bg-yellow.light {
+	color: #fbbd08;
+	background-color: #fef2ced2;
+}
+
+.bg-olive.light {
+	color: #8dc63f;
+	background-color: #e8f4d9;
+}
+
+.bg-green.light {
+	color: #39b54a;
+	background-color: #d7f0dbff;
+}
+
+.bg-cyan.light {
+	color: #1cbbb4;
+	background-color: #d2f1f0;
+}
+
+.bg-blue.light {
+	color: #0081ff;
+	background-color: #cce6ff;
+}
+
+.bg-purple.light {
+	color: #6739b6;
+	background-color: #e1d7f0;
+}
+
+.bg-mauve.light {
+	color: #9c26b0;
+	background-color: #ebd4ef;
+}
+
+.bg-pink.light {
+	color: #e03997;
+	background-color: #f9d7ea;
+}
+
+.bg-brown.light {
+	color: #a5673f;
+	background-color: #ede1d9;
+}
+
+.bg-grey.light {
+	color: #8799a3;
+	background-color: #e7ebed;
+}
+
+.bg-gradual-red {
+	background-image: linear-gradient(45deg, #f43f3b, #ec008c);
+	color: #ffffff;
+}
+
+.bg-gradual-orange {
+	background-image: linear-gradient(45deg, #ff9700, #ed1c24);
+	color: #ffffff;
+}
+
+.bg-gradual-green {
+	background-image: linear-gradient(45deg, #39b54a, #8dc63f);
+	color: #ffffff;
+}
+
+.bg-gradual-purple {
+	background-image: linear-gradient(45deg, #9000ff, #5e00ff);
+	color: #ffffff;
+}
+
+.bg-gradual-pink {
+	background-image: linear-gradient(45deg, #ec008c, #6739b6);
+	color: #ffffff;
+}
+
+.bg-gradual-blue {
+	background-image: linear-gradient(45deg, #0081ff, #1cbbb4);
+	color: #ffffff;
+}
+
+.shadow[class*="-red"] {
+	box-shadow: 6upx 6upx 8upx rgba(204, 69, 59, 0.2);
+}
+
+.shadow[class*="-orange"] {
+	box-shadow: 6upx 6upx 8upx rgba(217, 109, 26, 0.2);
+}
+
+.shadow[class*="-yellow"] {
+	box-shadow: 6upx 6upx 8upx rgba(224, 170, 7, 0.2);
+}
+
+.shadow[class*="-olive"] {
+	box-shadow: 6upx 6upx 8upx rgba(124, 173, 55, 0.2);
+}
+
+.shadow[class*="-green"] {
+	box-shadow: 6upx 6upx 8upx rgba(48, 156, 63, 0.2);
+}
+
+.shadow[class*="-cyan"] {
+	box-shadow: 6upx 6upx 8upx rgba(28, 187, 180, 0.2);
+}
+
+.shadow[class*="-blue"] {
+	box-shadow: 6upx 6upx 8upx rgba(0, 102, 204, 0.2);
+}
+
+.shadow[class*="-purple"] {
+	box-shadow: 6upx 6upx 8upx rgba(88, 48, 156, 0.2);
+}
+
+.shadow[class*="-mauve"] {
+	box-shadow: 6upx 6upx 8upx rgba(133, 33, 150, 0.2);
+}
+
+.shadow[class*="-pink"] {
+	box-shadow: 6upx 6upx 8upx rgba(199, 50, 134, 0.2);
+}
+
+.shadow[class*="-brown"] {
+	box-shadow: 6upx 6upx 8upx rgba(140, 88, 53, 0.2);
+}
+
+.shadow[class*="-grey"] {
+	box-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
+}
+
+.shadow[class*="-gray"] {
+	box-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
+}
+
+.shadow[class*="-black"] {
+	box-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
+}
+
+.shadow[class*="-white"] {
+	box-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
+}
+
+.text-shadow[class*="-red"] {
+	text-shadow: 6upx 6upx 8upx rgba(204, 69, 59, 0.2);
+}
+
+.text-shadow[class*="-orange"] {
+	text-shadow: 6upx 6upx 8upx rgba(217, 109, 26, 0.2);
+}
+
+.text-shadow[class*="-yellow"] {
+	text-shadow: 6upx 6upx 8upx rgba(224, 170, 7, 0.2);
+}
+
+.text-shadow[class*="-olive"] {
+	text-shadow: 6upx 6upx 8upx rgba(124, 173, 55, 0.2);
+}
+
+.text-shadow[class*="-green"] {
+	text-shadow: 6upx 6upx 8upx rgba(48, 156, 63, 0.2);
+}
+
+.text-shadow[class*="-cyan"] {
+	text-shadow: 6upx 6upx 8upx rgba(28, 187, 180, 0.2);
+}
+
+.text-shadow[class*="-blue"] {
+	text-shadow: 6upx 6upx 8upx rgba(0, 102, 204, 0.2);
+}
+
+.text-shadow[class*="-purple"] {
+	text-shadow: 6upx 6upx 8upx rgba(88, 48, 156, 0.2);
+}
+
+.text-shadow[class*="-mauve"] {
+	text-shadow: 6upx 6upx 8upx rgba(133, 33, 150, 0.2);
+}
+
+.text-shadow[class*="-pink"] {
+	text-shadow: 6upx 6upx 8upx rgba(199, 50, 134, 0.2);
+}
+
+.text-shadow[class*="-brown"] {
+	text-shadow: 6upx 6upx 8upx rgba(140, 88, 53, 0.2);
+}
+
+.text-shadow[class*="-grey"] {
+	text-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
+}
+
+.text-shadow[class*="-gray"] {
+	text-shadow: 6upx 6upx 8upx rgba(114, 130, 138, 0.2);
+}
+
+.text-shadow[class*="-black"] {
+	text-shadow: 6upx 6upx 8upx rgba(26, 26, 26, 0.2);
+}
+
+.bg-img {
+	background-size: cover;
+	background-position: center;
+	background-repeat: no-repeat;
+}
+
+.bg-mask {
+	background-color: #333333;
+	position: relative;
+}
+
+.bg-mask::after {
+	content: "";
+	border-radius: inherit;
+	width: 100%;
+	height: 100%;
+	display: block;
+	background-color: rgba(0, 0, 0, 0.4);
+	position: absolute;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	top: 0;
+}
+
+.bg-mask view,
+.bg-mask cover-view {
+	z-index: 5;
+	position: relative;
+}
+
+.bg-video {
+	position: relative;
+}
+
+.bg-video video {
+	display: block;
+	height: 100%;
+	width: 100%;
+	-o-object-fit: cover;
+	object-fit: cover;
+	position: absolute;
+	top: 0;
+	z-index: 0;
+	pointer-events: none;
+}
+
+/* ==================
+          文本
+ ==================== */
+
+.text-xs {
+	font-size: 20upx;
+}
+
+.text-sm {
+	font-size: 24upx;
+}
+
+.text-df {
+	font-size: 28upx;
+}
+
+.text-lg {
+	font-size: 32upx;
+}
+
+.text-xl {
+	font-size: 36upx;
+}
+
+.text-xxl {
+	font-size: 44upx;
+}
+
+.text-sl {
+	font-size: 80upx;
+}
+
+.text-xsl {
+	font-size: 120upx;
+}
+
+.text-Abc {
+	text-transform: Capitalize;
+}
+
+.text-ABC {
+	text-transform: Uppercase;
+}
+
+.text-abc {
+	text-transform: Lowercase;
+}
+
+.text-price::before {
+	content: "¥";
+	font-size: 80%;
+	margin-right: 4upx;
+}
+
+.text-cut {
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+}
+
+.text-bold {
+	font-weight: bold;
+}
+
+.text-center {
+	text-align: center;
+}
+
+.text-content {
+	line-height: 1.6;
+}
+
+.text-left {
+	text-align: left;
+}
+
+.text-right {
+	text-align: right;
+}
+
+.text-red,
+.line-red,
+.lines-red {
+	color: #e54d42;
+}
+
+.text-orange,
+.line-orange,
+.lines-orange {
+	color: #f37b1d;
+}
+
+.text-yellow,
+.line-yellow,
+.lines-yellow {
+	color: #fbbd08;
+}
+
+.text-olive,
+.line-olive,
+.lines-olive {
+	color: #8dc63f;
+}
+
+.text-green,
+.line-green,
+.lines-green {
+	color: #39b54a;
+}
+
+.text-cyan,
+.line-cyan,
+.lines-cyan {
+	color: #1cbbb4;
+}
+
+.text-blue,
+.line-blue,
+.lines-blue {
+	color: #0081ff;
+}
+
+.text-purple,
+.line-purple,
+.lines-purple {
+	color: #6739b6;
+}
+
+.text-mauve,
+.line-mauve,
+.lines-mauve {
+	color: #9c26b0;
+}
+
+.text-pink,
+.line-pink,
+.lines-pink {
+	color: #e03997;
+}
+
+.text-brown,
+.line-brown,
+.lines-brown {
+	color: #a5673f;
+}
+
+.text-grey,
+.line-grey,
+.lines-grey {
+	color: #8799a3;
+}
+
+.text-gray,
+.line-gray,
+.lines-gray {
+	color: #aaaaaa;
+}
+
+.text-black,
+.line-black,
+.lines-black {
+	color: #333333;
+}
+
+.text-white,
+.line-white,
+.lines-white {
+	color: #ffffff;
 }

lib/community/y-DiaryItem/y-DiaryItem.vue

@@ -133,7 +133,8 @@
 				}
 				
 				var send = {cate_id:self.cate_id, type:self.type, type_id:self.item.id, pg:self.page, noconcat:true};
-				send.id = self.id;
+				send.code = self.Dever.config.code;
+				send.info_id = self.id;
 				this.Dever.get(this, 'app/community/?l=api.info', send, function(t) {
 					if (self.page == 1) {
 						self.item.child = self.child;

lib/dever/config.js

@@ -1,6 +1,10 @@
 //基本配置项
 const base = {
 	debug: false
+}
+
+const im = {
+	host : 'ws://192.168.2.70:8282'
 }
 
 //http request请求配置
@@ -8,7 +12,7 @@ const request = {
 	//	服务器接口地址
 
 	host: "http://192.168.2.70/dreamland/",
-	host: "http://192.168.3.66/dreamland/",
+	//host: "http://192.168.3.66/dreamland/",
 	
 	//	请求的参数	
 	data: {},
@@ -43,5 +47,6 @@ export default {
 	base,
 	request,
 	server,
-	upload
+	upload,
+	im,
 }

lib/dever/index.js

@@ -198,7 +198,7 @@ var http = {
 		switch (err) {
 			case 401:
 				// 错误码404的处理方式
-				console.error("请求背拒绝" + err)
+				console.error("请求拒绝" + err)
 				break;
 			case 404:
 				// 错误码404的处理方式
@@ -216,32 +216,49 @@ var http = {
 }
 
 var im = {
-	socket : false,
-	init : function() {
-		this.connect();
-		this.info();
+	socket : false,
+	url : 'ws://me.5dev.cn:8282',
+	init : function(url, callback, connect) {
+		if (url) {
+			this.url = url;
+		} else {
+			this.url = config.im.host;
+		}
+		this.connect(connect);
+		this.info(callback);
 	},
 	
-	connect : function() {
+	connect : function(connect) {
 		uni.connectSocket({
-			url: 'text://me.5dev.cn:8282',
-			complete: (res)=> {
-				console.log(res);
+			url: this.url,
+			complete: (res)=> {
+				
 			}
 		});
 		uni.onSocketOpen(function (res) {
-		  console.log('WebSocket连接已打开！');
+		  if (connect) {
+		  	connect(true, res);
+		  }
 		});
 		uni.onSocketError(function (res) {
-		  console.log('WebSocket连接打开失败，请检查！');
+		  if (connect) {
+		  	connect(false, res);
+		  }
 		});
 		
 	},
 	
-	info : function() {
-		console.info(222);
-		uni.onSocketMessage(function (res) {
-			console.log('收到服务器内容：' + res.data);
+	info : function(callback) {
+		uni.onSocketMessage(function (res) {
+			if (res.data.indexOf('{') != -1) {
+				var data = eval("("+res.data+")");
+			} else {
+				var data = res.data;
+			}
+			
+			if (callback) {
+				callback(data);
+			}
 		});
 	}
 }
@@ -295,13 +312,6 @@ var upload = {
 		return YY + MM + DD +" "+hh + mm + ss;
 	},
 	handle : function(key, count, callback) {
-		if (!count) {
-			count = 1;
-		}
-		var type = 1;
-		if (count > 1) {
-			type = 2;
-		}
 		var self = this;
 		count = parseInt(count);
 		uni.chooseImage({
@@ -311,36 +321,8 @@ var upload = {
 			success: res => {
 				uni.showLoading();
 				res.tempFilePaths.forEach(function(item, index) {
-					//请求上传接口
-					uni.uploadFile({
-						url: config.upload.url, //仅为示例，非真实的接口地址
-						filePath: item,
-						name: config.upload.name,
-						formData: { token: http.getToken() },
-						success: res => {
-							dever.debug(res);
-							var data = JSON.parse(res.data);
-							uni.hideLoading();
-							if (data.uploaded) {
-								var backUrl = data.url;
-								if (count > 1) {
-									if (!self.data[key]) {
-										self.data[key] = [];
-									}
-									if (self.data[key].length < count) {
-										self.data[key].push(backUrl);
-									}
-								} else {
-									self.data[key] = backUrl;
-								}
-								if (callback) {
-									callback(type, self.data[key]);
-								}
-							} else if (data.uploaded == false) {
-								uni.showToast({ title: data.error.message, icon: 'none' });
-							}
-						}
-					});
+					//请求上传接口
+					self.uploadFile(item, key, count, callback);
 				});
 			},
 			fail: () => {
@@ -348,6 +330,46 @@ var upload = {
 				uni.hideLoading();
 			}
 		});
+	},
+	
+	uploadFile : function(item, key, count, callback) {
+		var self = this;
+		if (!count) {
+			count = 1;
+		}
+		var type = 1;
+		if (count > 1) {
+			type = 2;
+		}
+		uni.uploadFile({
+			url: config.upload.url,
+			filePath: item,
+			name: config.upload.name,
+			formData: { token: http.getToken() },
+			success: res => {
+				dever.debug(res);
+				var data = JSON.parse(res.data);
+				uni.hideLoading();
+				if (data.uploaded) {
+					var backUrl = data.url;
+					if (count > 1) {
+						if (!self.data[key]) {
+							self.data[key] = [];
+						}
+						if (self.data[key].length < count) {
+							self.data[key].push(backUrl);
+						}
+					} else {
+						self.data[key] = backUrl;
+					}
+					if (callback) {
+						callback(type, self.data[key]);
+					}
+				} else if (data.uploaded == false) {
+					uni.showToast({ title: data.error.message, icon: 'none' });
+				}
+			}
+		});
 	},
 	
 	upfile : function(e, key, count, callback, ext, title, style) {
@@ -978,29 +1000,34 @@ var dever = {
 		page.get(config, vue, url, options, callback, err_callback);
 	},
 
-	//上传
+	//选择图片并上传
 	upload : function(id, count, callback) {
 		this.getUpload().handle(id, count, callback);
 	},
 	
-	//上传
+	//上传到七牛
 	qiniu : function(qn, self, id, count, callback, handle) {
 		this.getUpload().qiniu(qn, self, id, count, callback, handle);
 	},
 	
-	//上传文件
+	//html上传文件
 	upfile : function(self, key, count, callback, ext, title, style) {
 		this.getUpload().upfile(self, key, count, callback, ext, title, style);
 	},
 	
+	//直接上传文件
+	uploadFile : function(path, id, count, callback) {
+		this.getUpload().uploadFile(path, id, count, callback);
+	},
+	
 	//获取upload
 	getUpload : function() {
 		return upload;
 	},
 	
 	//im聊天
-	im : function() {
-		im.init();
+	im : function(url, callback, connect) {
+		im.init(url, callback, connect);
 	},
 	
 	//删除上传

lib/graceUI/graceUI.css

@@ -6,7 +6,7 @@ last update date : 2020-06-16
 GraceUI 的版权约束是不能转售或者将 GraceUI 直接发布到公开渠道！侵权必究，请遵守版权约定！
 GraceUI 软著号 2019SR0533188 版权机器人启动中，侵权会追责，请遵守极其简单的版权规定
 */
-page{width:100%; min-height:100%; display:flex; flex-direction:column; flex:1;}
+page{width:100%; display:flex; flex-direction:column; flex:1;}
 grace-page, gracepage{display:flex; flex-direction:column; flex:1;}
 view{font-size:28rpx;}
 .grace-img-in{font-size:0;}

lib/jyf-parser/jyf-parser.vue

@@ -0,0 +1,630 @@
+<template>
+	<view>
+		<slot v-if="!nodes.length" />
+		<!--#ifdef APP-PLUS-NVUE-->
+		<web-view id="_top" ref="web" :style="'margin-top:-2px;height:'+height+'px'" @onPostMessage="_message" />
+		<!--#endif-->
+		<!--#ifndef APP-PLUS-NVUE-->
+		<view id="_top" :style="showAm+(selectable?';user-select:text;-webkit-user-select:text':'')">
+			<!--#ifdef H5 || MP-360-->
+			<div :id="'rtf'+uid"></div>
+			<!--#endif-->
+			<!--#ifndef H5 || MP-360-->
+			<trees :nodes="nodes" :lazyLoad="lazyLoad" :loading="loadingImg" />
+			<!--#endif-->
+		</view>
+		<!--#endif-->
+	</view>
+</template>
+
+<script>
+	// #ifndef H5 || APP-PLUS-NVUE || MP-360
+	import trees from './libs/trees';
+	var cache = {},
+		// #ifdef MP-WEIXIN || MP-TOUTIAO
+		fs = uni.getFileSystemManager ? uni.getFileSystemManager() : null,
+		// #endif
+		Parser = require('./libs/MpHtmlParser.js');
+	var dom;
+	// 计算 cache 的 key
+	function hash(str) {
+		for (var i = str.length, val = 5381; i--;)
+			val += (val << 5) + str.charCodeAt(i);
+		return val;
+	}
+	// #endif
+	// #ifdef H5 || APP-PLUS-NVUE || MP-360
+	var windowWidth = uni.getSystemInfoSync().windowWidth,
+		cfg = require('./libs/config.js');
+	// #endif
+	// #ifdef APP-PLUS-NVUE
+	var weexDom = weex.requireModule('dom');
+	// #endif
+	/**
+	 * Parser 富文本组件
+	 * @tutorial https://github.com/jin-yufeng/Parser
+	 * @property {String} html 富文本数据
+	 * @property {Boolean} autopause 是否在播放一个视频时自动暂停其他视频
+	 * @property {Boolean} autoscroll 是否自动给所有表格添加一个滚动层
+	 * @property {Boolean} autosetTitle 是否自动将 title 标签中的内容设置到页面标题
+	 * @property {Number} compress 压缩等级
+	 * @property {String} domain 图片、视频等链接的主域名
+	 * @property {Boolean} lazyLoad 是否开启图片懒加载
+	 * @property {String} loadingImg 图片加载完成前的占位图
+	 * @property {Boolean} selectable 是否开启长按复制
+	 * @property {Object} tagStyle 标签的默认样式
+	 * @property {Boolean} showWithAnimation 是否使用渐显动画
+	 * @property {Boolean} useAnchor 是否使用锚点
+	 * @property {Boolean} useCache 是否缓存解析结果
+	 * @event {Function} parse 解析完成事件
+	 * @event {Function} load dom 加载完成事件
+	 * @event {Function} ready 所有图片加载完毕事件
+	 * @event {Function} error 错误事件
+	 * @event {Function} imgtap 图片点击事件
+	 * @event {Function} linkpress 链接点击事件
+	 * @author JinYufeng
+	 * @version 20200728
+	 * @listens MIT
+	 */
+	export default {
+		name: 'parser',
+		data() {
+			return {
+				// #ifdef H5 || MP-360
+				uid: this._uid,
+				// #endif
+				// #ifdef APP-PLUS-NVUE
+				height: 1,
+				// #endif
+				// #ifndef APP-PLUS-NVUE
+				showAm: '',
+				// #endif
+				nodes: []
+			}
+		},
+		// #ifndef H5 || APP-PLUS-NVUE || MP-360
+		components: {
+			trees
+		},
+		// #endif
+		props: {
+			html: String,
+			autopause: {
+				type: Boolean,
+				default: true
+			},
+			autoscroll: Boolean,
+			autosetTitle: {
+				type: Boolean,
+				default: true
+			},
+			// #ifndef H5 || APP-PLUS-NVUE || MP-360
+			compress: Number,
+			loadingImg: String,
+			useCache: Boolean,
+			// #endif
+			domain: String,
+			lazyLoad: Boolean,
+			selectable: Boolean,
+			tagStyle: Object,
+			showWithAnimation: Boolean,
+			useAnchor: Boolean
+		},
+		watch: {
+			html(html) {
+				this.setContent(html);
+			}
+		},
+		created() {
+			// 图片数组
+			this.imgList = [];
+			this.imgList.each = function(f) {
+				for (var i = 0, len = this.length; i < len; i++)
+					this.setItem(i, f(this[i], i, this));
+			}
+			this.imgList.setItem = function(i, src) {
+				if (i == void 0 || !src) return;
+				// #ifndef MP-ALIPAY || APP-PLUS
+				// 去重
+				if (src.indexOf('http') == 0 && this.includes(src)) {
+					var newSrc = src.split('://')[0];
+					for (var j = newSrc.length, c; c = src[j]; j++) {
+						if (c == '/' && src[j - 1] != '/' && src[j + 1] != '/') break;
+						newSrc += Math.random() > 0.5 ? c.toUpperCase() : c;
+					}
+					newSrc += src.substr(j);
+					return this[i] = newSrc;
+				}
+				// #endif
+				this[i] = src;
+				// 暂存 data src
+				if (src.includes('data:image')) {
+					var filePath, info = src.match(/data:image\/(\S+?);(\S+?),(.+)/);
+					if (!info) return;
+					// #ifdef MP-WEIXIN || MP-TOUTIAO
+					filePath = `${wx.env.USER_DATA_PATH}/${Date.now()}.${info[1]}`;
+					fs && fs.writeFile({
+						filePath,
+						data: info[3],
+						encoding: info[2],
+						success: () => this[i] = filePath
+					})
+					// #endif
+					// #ifdef APP-PLUS
+					filePath = `_doc/parser_tmp/${Date.now()}.${info[1]}`;
+					var bitmap = new plus.nativeObj.Bitmap();
+					bitmap.loadBase64Data(src, () => {
+						bitmap.save(filePath, {}, () => {
+							bitmap.clear()
+							this[i] = filePath;
+						})
+					})
+					// #endif
+				}
+			}
+		},
+		mounted() {
+			// #ifdef H5 || MP-360
+			this.document = document.getElementById('rtf' + this._uid);
+			// #endif
+			// #ifndef H5 || APP-PLUS-NVUE || MP-360
+			if (dom) this.document = new dom(this);
+			// #endif
+			// #ifdef APP-PLUS-NVUE
+			this.document = this.$refs.web;
+			setTimeout(() => {
+				// #endif
+				if (this.html) this.setContent(this.html);
+				// #ifdef APP-PLUS-NVUE
+			}, 30)
+			// #endif
+		},
+		beforeDestroy() {
+			// #ifdef H5 || MP-360
+			if (this._observer) this._observer.disconnect();
+			// #endif
+			this.imgList.each(src => {
+				// #ifdef APP-PLUS
+				if (src && src.includes('_doc')) {
+					plus.io.resolveLocalFileSystemURL(src, entry => {
+						entry.remove();
+					});
+				}
+				// #endif
+				// #ifdef MP-WEIXIN || MP-TOUTIAO
+				if (src && src.includes(uni.env.USER_DATA_PATH))
+					fs && fs.unlink({
+						filePath: src
+					})
+				// #endif
+			})
+			clearInterval(this._timer);
+		},
+		methods: {
+			// 设置富文本内容
+			setContent(html, append) {
+				// #ifdef APP-PLUS-NVUE
+				if (!html)
+					return this.height = 1;
+				if (append)
+					this.$refs.web.evalJs("var b=document.createElement('div');b.innerHTML='" + html.replace(/'/g, "\\'") +
+						"';document.getElementById('parser').appendChild(b)");
+				else {
+					html =
+						'<meta charset="utf-8" /><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><style>html,body{width:100%;height:100%;overflow:hidden}body{margin:0}</style><base href="' +
+						this.domain + '"><div id="parser"' + (this.selectable ? '>' : ' style="user-select:none">') + this._handleHtml(html).replace(/\n/g, '\\n') +
+						'</div><script>"use strict";function e(e){if(window.__dcloud_weex_postMessage||window.__dcloud_weex_){var t={data:[e]};window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessage(t):window.__dcloud_weex_.postMessage(JSON.stringify(t))}}document.body.onclick=function(){e({action:"click"})},' +
+						(this.showWithAnimation ? 'document.body.style.animation="_show .5s",' : '') +
+						'setTimeout(function(){e({action:"load",text:document.body.innerText,height:document.getElementById("parser").scrollHeight})},50);\x3c/script>';
+					this.$refs.web.evalJs("document.write('" + html.replace(/'/g, "\\'") + "');document.close()");
+				}
+				this.$refs.web.evalJs(
+					'var t=document.getElementsByTagName("title");t.length&&e({action:"getTitle",title:t[0].innerText});for(var o,n=document.getElementsByTagName("style"),r=1;o=n[r++];)o.innerHTML=o.innerHTML.replace(/body/g,"#parser");for(var a,c=document.getElementsByTagName("img"),s=[],i=0==c.length,d=0,l=0,g=0;a=c[l];l++)parseInt(a.style.width||a.getAttribute("width"))>' +
+					windowWidth + '&&(a.style.height="auto"),a.onload=function(){++d==c.length&&(i=!0)},a.onerror=function(){++d==c.length&&(i=!0),' + (cfg.errorImg ? 'this.src="' + cfg.errorImg + '",' : '') +
+					'e({action:"error",source:"img",target:this})},a.hasAttribute("ignore")||"A"==a.parentElement.nodeName||(a.i=g++,s.push(a.src),a.onclick=function(){e({action:"preview",img:{i:this.i,src:this.src}})});e({action:"getImgList",imgList:s});for(var u,m=document.getElementsByTagName("a"),f=0;u=m[f];f++)u.onclick=function(){var t,o=this.getAttribute("href");if("#"==o[0]){var n=document.getElementById(o.substr(1));n&&(t=n.offsetTop)}return e({action:"linkpress",href:o,offset:t}),!1};for(var h,y=document.getElementsByTagName("video"),v=0;h=y[v];v++)h.style.maxWidth="100%",h.onerror=function(){e({action:"error",source:"video",target:this})}' +
+					(this.autopause ? ',h.onplay=function(){for(var e,t=0;e=y[t];t++)e!=this&&e.pause()}' : '') +
+					';for(var _,p=document.getElementsByTagName("audio"),w=0;_=p[w];w++)_.onerror=function(){e({action:"error",source:"audio",target:this})};' +
+					(this.autoscroll ? 'for(var T,E=document.getElementsByTagName("table"),B=0;T=E[B];B++){var N=document.createElement("div");N.style.overflow="scroll",T.parentNode.replaceChild(N,T),N.appendChild(T)}' : '') +
+					'var x=document.getElementById("parser");clearInterval(window.timer),window.timer=setInterval(function(){i&&clearInterval(window.timer),e({action:"ready",ready:i,height:x.scrollHeight})},350)'
+				)
+				this.nodes = [1];
+				// #endif
+				// #ifdef H5 || MP-360
+				if (!html) {
+					if (this.rtf && !append) this.rtf.parentNode.removeChild(this.rtf);
+					return;
+				}
+				var div = document.createElement('div');
+				if (!append) {
+					if (this.rtf) this.rtf.parentNode.removeChild(this.rtf);
+					this.rtf = div;
+				} else {
+					if (!this.rtf) this.rtf = div;
+					else this.rtf.appendChild(div);
+				}
+				div.innerHTML = this._handleHtml(html, append);
+				for (var styles = this.rtf.getElementsByTagName('style'), i = 0, style; style = styles[i++];) {
+					style.innerHTML = style.innerHTML.replace(/body/g, '#rtf' + this._uid);
+					style.setAttribute('scoped', 'true');
+				}
+				// 懒加载
+				if (!this._observer && this.lazyLoad && IntersectionObserver) {
+					this._observer = new IntersectionObserver(changes => {
+						for (let item, i = 0; item = changes[i++];) {
+							if (item.isIntersecting) {
+								item.target.src = item.target.getAttribute('data-src');
+								item.target.removeAttribute('data-src');
+								this._observer.unobserve(item.target);
+							}
+						}
+					}, {
+						rootMargin: '500px 0px 500px 0px'
+					})
+				}
+				var _ts = this;
+				// 获取标题
+				var title = this.rtf.getElementsByTagName('title');
+				if (title.length && this.autosetTitle)
+					uni.setNavigationBarTitle({
+						title: title[0].innerText
+					})
+				// 图片处理
+				this.imgList.length = 0;
+				var imgs = this.rtf.getElementsByTagName('img');
+				for (let i = 0, j = 0, img; img = imgs[i]; i++) {
+					if (parseInt(img.style.width || img.getAttribute('width')) > windowWidth)
+						img.style.height = 'auto';
+					var src = img.getAttribute('src');
+					if (this.domain && src) {
+						if (src[0] == '/') {
+							if (src[1] == '/')
+								img.src = (this.domain.includes('://') ? this.domain.split('://')[0] : '') + ':' + src;
+							else img.src = this.domain + src;
+						} else if (!src.includes('://')) img.src = this.domain + '/' + src;
+					}
+					if (!img.hasAttribute('ignore') && img.parentElement.nodeName != 'A') {
+						img.i = j++;
+						_ts.imgList.push(img.src || img.getAttribute('data-src'));
+						img.onclick = function() {
+							var preview = true;
+							this.ignore = () => preview = false;
+							_ts.$emit('imgtap', this);
+							if (preview) {
+								uni.previewImage({
+									current: this.i,
+									urls: _ts.imgList
+								});
+							}
+						}
+					}
+					img.onerror = function() {
+						if (cfg.errorImg)
+							_ts.imgList[this.i] = this.src = cfg.errorImg;
+						_ts.$emit('error', {
+							source: 'img',
+							target: this
+						});
+					}
+					if (_ts.lazyLoad && this._observer && img.src && img.i != 0) {
+						img.setAttribute('data-src', img.src);
+						img.removeAttribute('src');
+						this._observer.observe(img);
+					}
+				}
+				// 链接处理
+				var links = this.rtf.getElementsByTagName('a');
+				for (var link of links) {
+					link.onclick = function() {
+						var jump = true,
+							href = this.getAttribute('href');
+						_ts.$emit('linkpress', {
+							href,
+							ignore: () => jump = false
+						});
+						if (jump && href) {
+							if (href[0] == '#') {
+								if (_ts.useAnchor) {
+									_ts.navigateTo({
+										id: href.substr(1)
+									})
+								}
+							} else if (href.indexOf('http') == 0 || href.indexOf('//') == 0)
+								return true;
+							else
+								uni.navigateTo({
+									url: href
+								})
+						}
+						return false;
+					}
+				}
+				// 视频处理
+				var videos = this.rtf.getElementsByTagName('video');
+				_ts.videoContexts = videos;
+				for (let video, i = 0; video = videos[i++];) {
+					video.style.maxWidth = '100%';
+					video.onerror = function() {
+						_ts.$emit('error', {
+							source: 'video',
+							target: this
+						});
+					}
+					video.onplay = function() {
+						if (_ts.autopause)
+							for (let item, i = 0; item = _ts.videoContexts[i++];)
+								if (item != this) item.pause();
+					}
+				}
+				// 音频处理
+				var audios = this.rtf.getElementsByTagName('audio');
+				for (var audio of audios)
+					audio.onerror = function() {
+						_ts.$emit('error', {
+							source: 'audio',
+							target: this
+						});
+					}
+				// 表格处理
+				if (this.autoscroll) {
+					var tables = this.rtf.getElementsByTagName('table');
+					for (var table of tables) {
+						let div = document.createElement('div');
+						div.style.overflow = 'scroll';
+						table.parentNode.replaceChild(div, table);
+						div.appendChild(table);
+					}
+				}
+				if (!append) this.document.appendChild(this.rtf);
+				this.$nextTick(() => {
+					this.nodes = [1];
+					this.$emit('load');
+				});
+				setTimeout(() => this.showAm = '', 500);
+				// #endif
+				// #ifndef APP-PLUS-NVUE
+				// #ifndef H5 || MP-360
+				var nodes;
+				if (!html) return this.nodes = [];
+				var parser = new Parser(html, this);
+				// 缓存读取
+				if (this.useCache) {
+					var hashVal = hash(html);
+					if (cache[hashVal])
+						nodes = cache[hashVal];
+					else {
+						nodes = parser.parse();
+						cache[hashVal] = nodes;
+					}
+				} else nodes = parser.parse();
+				this.$emit('parse', nodes);
+				if (append) this.nodes = this.nodes.concat(nodes);
+				else this.nodes = nodes;
+				if (nodes.length && nodes.title && this.autosetTitle)
+					uni.setNavigationBarTitle({
+						title: nodes.title
+					})
+				if (this.imgList) this.imgList.length = 0;
+				this.videoContexts = [];
+				this.$nextTick(() => {
+					(function f(cs) {
+						for (var i = cs.length; i--;) {
+							if (cs[i].top) {
+								cs[i].controls = [];
+								cs[i].init();
+								f(cs[i].$children);
+							}
+						}
+					})(this.$children)
+					this.$emit('load');
+				})
+				// #endif
+				var height;
+				clearInterval(this._timer);
+				this._timer = setInterval(() => {
+					// #ifdef H5 || MP-360
+					this.rect = this.rtf.getBoundingClientRect();
+					// #endif
+					// #ifndef H5 || MP-360
+					uni.createSelectorQuery().in(this)
+						.select('#_top').boundingClientRect().exec(res => {
+							if (!res) return;
+							this.rect = res[0];
+							// #endif
+							if (this.rect.height == height) {
+								this.$emit('ready', this.rect)
+								clearInterval(this._timer);
+							}
+							height = this.rect.height;
+							// #ifndef H5 || MP-360
+						});
+					// #endif
+				}, 350);
+				if (this.showWithAnimation && !append) this.showAm = 'animation:_show .5s';
+				// #endif
+			},
+			// 获取文本内容
+			getText(ns = this.nodes) {
+				var txt = '';
+				// #ifdef APP-PLUS-NVUE
+				txt = this._text;
+				// #endif
+				// #ifdef H5 || MP-360
+				txt = this.rtf.innerText;
+				// #endif
+				// #ifndef H5 || APP-PLUS-NVUE || MP-360
+				for (var i = 0, n; n = ns[i++];) {
+					if (n.type == 'text') txt += n.text.replace(/&nbsp;/g, '\u00A0').replace(/&lt;/g, '<').replace(/&gt;/g, '>')
+						.replace(/&amp;/g, '&');
+					else if (n.type == 'br') txt += '\n';
+					else {
+						// 块级标签前后加换行
+						var block = n.name == 'p' || n.name == 'div' || n.name == 'tr' || n.name == 'li' || (n.name[0] == 'h' && n.name[1] >
+							'0' && n.name[1] < '7');
+						if (block && txt && txt[txt.length - 1] != '\n') txt += '\n';
+						if (n.children) txt += this.getText(n.children);
+						if (block && txt[txt.length - 1] != '\n') txt += '\n';
+						else if (n.name == 'td' || n.name == 'th') txt += '\t';
+					}
+				}
+				// #endif
+				return txt;
+			},
+			// 锚点跳转
+			in (obj) {
+				if (obj.page && obj.selector && obj.scrollTop) this._in = obj;
+			},
+			navigateTo(obj) {
+				if (!this.useAnchor) return obj.fail && obj.fail('Anchor is disabled');
+				// #ifdef APP-PLUS-NVUE
+				if (!obj.id)
+					weexDom.scrollToElement(this.$refs.web);
+				else
+					this.$refs.web.evalJs('var pos=document.getElementById("' + obj.id +
+						'");if(pos)post({action:"linkpress",href:"#",offset:pos.offsetTop+' + (obj.offset || 0) + '})');
+				obj.success && obj.success();
+				// #endif
+				// #ifndef APP-PLUS-NVUE
+				var d = ' ';
+				// #ifdef MP-WEIXIN || MP-QQ || MP-TOUTIAO
+				d = '>>>';
+				// #endif
+				var selector = uni.createSelectorQuery().in(this._in ? this._in.page : this).select((this._in ? this._in.selector :
+					'#_top') + (obj.id ? `${d}#${obj.id},${this._in?this._in.selector:'#_top'}${d}.${obj.id}` : '')).boundingClientRect();
+				if (this._in) selector.select(this._in.selector).scrollOffset().select(this._in.selector).boundingClientRect();
+				else selector.selectViewport().scrollOffset();
+				selector.exec(res => {
+					if (!res[0]) return obj.fail && obj.fail('Label not found')
+					var scrollTop = res[1].scrollTop + res[0].top - (res[2] ? res[2].top : 0) + (obj.offset || 0);
+					if (this._in) this._in.page[this._in.scrollTop] = scrollTop;
+					else uni.pageScrollTo({
+						scrollTop,
+						duration: 300
+					})
+					obj.success && obj.success();
+				})
+				// #endif
+			},
+			// 获取视频对象
+			getVideoContext(id) {
+				// #ifndef APP-PLUS-NVUE
+				if (!id) return this.videoContexts;
+				else
+					for (var i = this.videoContexts.length; i--;)
+						if (this.videoContexts[i].id == id) return this.videoContexts[i];
+				// #endif
+			},
+			// #ifdef H5 || APP-PLUS-NVUE || MP-360
+			_handleHtml(html, append) {
+				if (!append) {
+					// 处理 tag-style 和 userAgentStyles
+					var style = '<style>@keyframes _show{0%{opacity:0}100%{opacity:1}}img{max-width:100%}';
+					for (var item in cfg.userAgentStyles)
+						style += `${item}{${cfg.userAgentStyles[item]}}`;
+					for (item in this.tagStyle)
+						style += `${item}{${this.tagStyle[item]}}`;
+					style += '</style>';
+					html = style + html;
+				}
+				// 处理 rpx
+				if (html.includes('rpx'))
+					html = html.replace(/[0-9.]+\s*rpx/g, $ => (parseFloat($) * windowWidth / 750) + 'px');
+				return html;
+			},
+			// #endif
+			// #ifdef APP-PLUS-NVUE
+			_message(e) {
+				// 接收 web-view 消息
+				var d = e.detail.data[0];
+				switch (d.action) {
+					case 'load':
+						this.$emit('load');
+						this.height = d.height;
+						this._text = d.text;
+						break;
+					case 'getTitle':
+						if (this.autosetTitle)
+							uni.setNavigationBarTitle({
+								title: d.title
+							})
+						break;
+					case 'getImgList':
+						this.imgList.length = 0;
+						for (var i = d.imgList.length; i--;)
+							this.imgList.setItem(i, d.imgList[i]);
+						break;
+					case 'preview':
+						var preview = true;
+						d.img.ignore = () => preview = false;
+						this.$emit('imgtap', d.img);
+						if (preview)
+							uni.previewImage({
+								current: d.img.i,
+								urls: this.imgList
+							})
+						break;
+					case 'linkpress':
+						var jump = true,
+							href = d.href;
+						this.$emit('linkpress', {
+							href,
+							ignore: () => jump = false
+						})
+						if (jump && href) {
+							if (href[0] == '#') {
+								if (this.useAnchor)
+									weexDom.scrollToElement(this.$refs.web, {
+										offset: d.offset
+									})
+							} else if (href.includes('://'))
+								plus.runtime.openWeb(href);
+							else
+								uni.navigateTo({
+									url: href
+								})
+						}
+						break;
+					case 'error':
+						if (d.source == 'img' && cfg.errorImg)
+							this.imgList.setItem(d.target.i, cfg.errorImg);
+						this.$emit('error', {
+							source: d.source,
+							target: d.target
+						})
+						break;
+					case 'ready':
+						this.height = d.height;
+						if (d.ready) uni.createSelectorQuery().in(this).select('#_top').boundingClientRect().exec(res => {
+							this.rect = res[0];
+							this.$emit('ready', res[0]);
+						})
+						break;
+					case 'click':
+						this.$emit('click');
+						this.$emit('tap');
+				}
+			},
+			// #endif
+		}
+	}
+</script>
+
+<style>
+	@keyframes _show {
+		0% {
+			opacity: 0;
+		}
+
+		100% {
+			opacity: 1;
+		}
+	}
+
+	/* #ifdef MP-WEIXIN */
+	:host {
+		display: block;
+		overflow: scroll;
+		-webkit-overflow-scrolling: touch;
+	}
+
+	/* #endif */
+</style>

lib/jyf-parser/libs/CssHandler.js

@@ -0,0 +1,97 @@
+const cfg = require('./config.js'),
+	isLetter = c => (c >= 'a' && c <= 'z') || (c >= 'A' && c <= 'Z');
+
+function CssHandler(tagStyle) {
+	var styles = Object.assign(Object.create(null), cfg.userAgentStyles);
+	for (var item in tagStyle)
+		styles[item] = (styles[item] ? styles[item] + ';' : '') + tagStyle[item];
+	this.styles = styles;
+}
+CssHandler.prototype.getStyle = function(data) {
+	this.styles = new parser(data, this.styles).parse();
+}
+CssHandler.prototype.match = function(name, attrs) {
+	var tmp, matched = (tmp = this.styles[name]) ? tmp + ';' : '';
+	if (attrs.class) {
+		var items = attrs.class.split(' ');
+		for (var i = 0, item; item = items[i]; i++)
+			if (tmp = this.styles['.' + item])
+				matched += tmp + ';';
+	}
+	if (tmp = this.styles['#' + attrs.id])
+		matched += tmp + ';';
+	return matched;
+}
+module.exports = CssHandler;
+
+function parser(data, init) {
+	this.data = data;
+	this.floor = 0;
+	this.i = 0;
+	this.list = [];
+	this.res = init;
+	this.state = this.Space;
+}
+parser.prototype.parse = function() {
+	for (var c; c = this.data[this.i]; this.i++)
+		this.state(c);
+	return this.res;
+}
+parser.prototype.section = function() {
+	return this.data.substring(this.start, this.i);
+}
+// 状态机
+parser.prototype.Space = function(c) {
+	if (c == '.' || c == '#' || isLetter(c)) {
+		this.start = this.i;
+		this.state = this.Name;
+	} else if (c == '/' && this.data[this.i + 1] == '*')
+		this.Comment();
+	else if (!cfg.blankChar[c] && c != ';')
+		this.state = this.Ignore;
+}
+parser.prototype.Comment = function() {
+	this.i = this.data.indexOf('*/', this.i) + 1;
+	if (!this.i) this.i = this.data.length;
+	this.state = this.Space;
+}
+parser.prototype.Ignore = function(c) {
+	if (c == '{') this.floor++;
+	else if (c == '}' && !--this.floor) this.state = this.Space;
+}
+parser.prototype.Name = function(c) {
+	if (cfg.blankChar[c]) {
+		this.list.push(this.section());
+		this.state = this.NameSpace;
+	} else if (c == '{') {
+		this.list.push(this.section());
+		this.Content();
+	} else if (c == ',') {
+		this.list.push(this.section());
+		this.Comma();
+	} else if (!isLetter(c) && (c < '0' || c > '9') && c != '-' && c != '_')
+		this.state = this.Ignore;
+}
+parser.prototype.NameSpace = function(c) {
+	if (c == '{') this.Content();
+	else if (c == ',') this.Comma();
+	else if (!cfg.blankChar[c]) this.state = this.Ignore;
+}
+parser.prototype.Comma = function() {
+	while (cfg.blankChar[this.data[++this.i]]);
+	if (this.data[this.i] == '{') this.Content();
+	else {
+		this.start = this.i--;
+		this.state = this.Name;
+	}
+}
+parser.prototype.Content = function() {
+	this.start = ++this.i;
+	if ((this.i = this.data.indexOf('}', this.i)) == -1) this.i = this.data.length;
+	var content = this.section();
+	for (var i = 0, item; item = this.list[i++];)
+		if (this.res[item]) this.res[item] += ';' + content;
+		else this.res[item] = content;
+	this.list = [];
+	this.state = this.Space;
+}

lib/jyf-parser/libs/MpHtmlParser.js

@@ -0,0 +1,535 @@
+/**
+ * html 解析器
+ * @tutorial https://github.com/jin-yufeng/Parser
+ * @version 20200728
+ * @author JinYufeng
+ * @listens MIT
+ */
+const cfg = require('./config.js'),
+	blankChar = cfg.blankChar,
+	CssHandler = require('./CssHandler.js'),
+	windowWidth = uni.getSystemInfoSync().windowWidth;
+var emoji;
+
+function MpHtmlParser(data, options = {}) {
+	this.attrs = {};
+	this.CssHandler = new CssHandler(options.tagStyle, windowWidth);
+	this.data = data;
+	this.domain = options.domain;
+	this.DOM = [];
+	this.i = this.start = this.audioNum = this.imgNum = this.videoNum = 0;
+	options.prot = (this.domain || '').includes('://') ? this.domain.split('://')[0] : 'http';
+	this.options = options;
+	this.state = this.Text;
+	this.STACK = [];
+	// 工具函数
+	this.bubble = () => {
+		for (var i = this.STACK.length, item; item = this.STACK[--i];) {
+			if (cfg.richOnlyTags[item.name]) {
+				if (item.name == 'table' && !Object.hasOwnProperty.call(item, 'c')) item.c = 1;
+				return false;
+			}
+			item.c = 1;
+		}
+		return true;
+	}
+	this.decode = (val, amp) => {
+		var i = -1,
+			j, en;
+		while (1) {
+			if ((i = val.indexOf('&', i + 1)) == -1) break;
+			if ((j = val.indexOf(';', i + 2)) == -1) break;
+			if (val[i + 1] == '#') {
+				en = parseInt((val[i + 2] == 'x' ? '0' : '') + val.substring(i + 2, j));
+				if (!isNaN(en)) val = val.substr(0, i) + String.fromCharCode(en) + val.substr(j + 1);
+			} else {
+				en = val.substring(i + 1, j);
+				if (cfg.entities[en] || en == amp)
+					val = val.substr(0, i) + (cfg.entities[en] || '&') + val.substr(j + 1);
+			}
+		}
+		return val;
+	}
+	this.getUrl = url => {
+		if (url[0] == '/') {
+			if (url[1] == '/') url = this.options.prot + ':' + url;
+			else if (this.domain) url = this.domain + url;
+		} else if (this.domain && url.indexOf('data:') != 0 && !url.includes('://'))
+			url = this.domain + '/' + url;
+		return url;
+	}
+	this.isClose = () => this.data[this.i] == '>' || (this.data[this.i] == '/' && this.data[this.i + 1] == '>');
+	this.section = () => this.data.substring(this.start, this.i);
+	this.parent = () => this.STACK[this.STACK.length - 1];
+	this.siblings = () => this.STACK.length ? this.parent().children : this.DOM;
+}
+MpHtmlParser.prototype.parse = function() {
+	if (emoji) this.data = emoji.parseEmoji(this.data);
+	for (var c; c = this.data[this.i]; this.i++)
+		this.state(c);
+	if (this.state == this.Text) this.setText();
+	while (this.STACK.length) this.popNode(this.STACK.pop());
+	return this.DOM;
+}
+// 设置属性
+MpHtmlParser.prototype.setAttr = function() {
+	var name = this.attrName.toLowerCase(),
+		val = this.attrVal;
+	if (cfg.boolAttrs[name]) this.attrs[name] = 'T';
+	else if (val) {
+		if (name == 'src' || (name == 'data-src' && !this.attrs.src)) this.attrs.src = this.getUrl(this.decode(val, 'amp'));
+		else if (name == 'href' || name == 'style') this.attrs[name] = this.decode(val, 'amp');
+		else if (name.substr(0, 5) != 'data-') this.attrs[name] = val;
+	}
+	this.attrVal = '';
+	while (blankChar[this.data[this.i]]) this.i++;
+	if (this.isClose()) this.setNode();
+	else {
+		this.start = this.i;
+		this.state = this.AttrName;
+	}
+}
+// 设置文本节点
+MpHtmlParser.prototype.setText = function() {
+	var back, text = this.section();
+	if (!text) return;
+	text = (cfg.onText && cfg.onText(text, () => back = true)) || text;
+	if (back) {
+		this.data = this.data.substr(0, this.start) + text + this.data.substr(this.i);
+		let j = this.start + text.length;
+		for (this.i = this.start; this.i < j; this.i++) this.state(this.data[this.i]);
+		return;
+	}
+	if (!this.pre) {
+		// 合并空白符
+		var flag, tmp = [];
+		for (let i = text.length, c; c = text[--i];)
+			if (!blankChar[c]) {
+				tmp.unshift(c);
+				if (!flag) flag = 1;
+			} else {
+				if (tmp[0] != ' ') tmp.unshift(' ');
+				if (c == '\n' && flag == void 0) flag = 0;
+			}
+		if (flag == 0) return;
+		text = tmp.join('');
+	}
+	this.siblings().push({
+		type: 'text',
+		text: this.decode(text)
+	});
+}
+// 设置元素节点
+MpHtmlParser.prototype.setNode = function() {
+	var node = {
+			name: this.tagName.toLowerCase(),
+			attrs: this.attrs
+		},
+		close = cfg.selfClosingTags[node.name];
+	if (this.options.nodes.length) node.type = 'node';
+	this.attrs = {};
+	if (!cfg.ignoreTags[node.name]) {
+		// 处理属性
+		var attrs = node.attrs,
+			style = this.CssHandler.match(node.name, attrs, node) + (attrs.style || ''),
+			styleObj = {};
+		if (attrs.id) {
+			if (this.options.compress & 1) attrs.id = void 0;
+			else if (this.options.useAnchor) this.bubble();
+		}
+		if ((this.options.compress & 2) && attrs.class) attrs.class = void 0;
+		switch (node.name) {
+			case 'a':
+			case 'ad': // #ifdef APP-PLUS
+			case 'iframe':
+				// #endif
+				this.bubble();
+				break;
+			case 'font':
+				if (attrs.color) {
+					styleObj['color'] = attrs.color;
+					attrs.color = void 0;
+				}
+				if (attrs.face) {
+					styleObj['font-family'] = attrs.face;
+					attrs.face = void 0;
+				}
+				if (attrs.size) {
+					var size = parseInt(attrs.size);
+					if (size < 1) size = 1;
+					else if (size > 7) size = 7;
+					var map = ['xx-small', 'x-small', 'small', 'medium', 'large', 'x-large', 'xx-large'];
+					styleObj['font-size'] = map[size - 1];
+					attrs.size = void 0;
+				}
+				break;
+			case 'embed':
+				// #ifndef APP-PLUS
+				var src = node.attrs.src || '',
+					type = node.attrs.type || '';
+				if (type.includes('video') || src.includes('.mp4') || src.includes('.3gp') || src.includes('.m3u8'))
+					node.name = 'video';
+				else if (type.includes('audio') || src.includes('.m4a') || src.includes('.wav') || src.includes('.mp3') || src.includes(
+						'.aac'))
+					node.name = 'audio';
+				else break;
+				if (node.attrs.autostart)
+					node.attrs.autoplay = 'T';
+				node.attrs.controls = 'T';
+				// #endif
+				// #ifdef APP-PLUS
+				this.bubble();
+				break;
+				// #endif
+			case 'video':
+			case 'audio':
+				if (!attrs.id) attrs.id = node.name + (++this[`${node.name}Num`]);
+				else this[`${node.name}Num`]++;
+				if (node.name == 'video') {
+					if (this.videoNum > 3)
+						node.lazyLoad = 1;
+					if (attrs.width) {
+						styleObj.width = parseFloat(attrs.width) + (attrs.width.includes('%') ? '%' : 'px');
+						attrs.width = void 0;
+					}
+					if (attrs.height) {
+						styleObj.height = parseFloat(attrs.height) + (attrs.height.includes('%') ? '%' : 'px');
+						attrs.height = void 0;
+					}
+				}
+				if (!attrs.controls && !attrs.autoplay) attrs.controls = 'T';
+				attrs.source = [];
+				if (attrs.src) {
+					attrs.source.push(attrs.src);
+					attrs.src = void 0;
+				}
+				this.bubble();
+				break;
+			case 'td':
+			case 'th':
+				if (attrs.colspan || attrs.rowspan)
+					for (var k = this.STACK.length, item; item = this.STACK[--k];)
+						if (item.name == 'table') {
+							item.c = void 0;
+							break;
+						}
+		}
+		if (attrs.align) {
+			styleObj['text-align'] = attrs.align;
+			attrs.align = void 0;
+		}
+		// 压缩 style
+		var styles = style.split(';');
+		style = '';
+		for (var i = 0, len = styles.length; i < len; i++) {
+			var info = styles[i].split(':');
+			if (info.length < 2) continue;
+			let key = info[0].trim().toLowerCase(),
+				value = info.slice(1).join(':').trim();
+			if (value[0] == '-' || value.includes('safe'))
+				style += `;${key}:${value}`;
+			else if (!styleObj[key] || value.includes('import') || !styleObj[key].includes('import'))
+				styleObj[key] = value;
+		}
+		if (node.name == 'img') {
+			if (attrs.src && !attrs.ignore) {
+				if (this.bubble())
+					attrs.i = (this.imgNum++).toString();
+				else attrs.ignore = 'T';
+			}
+			if (attrs.ignore) {
+				style += ';-webkit-touch-callout:none';
+				styleObj['max-width'] = '100%';
+			}
+			var width;
+			if (styleObj.width) width = styleObj.width;
+			else if (attrs.width) width = attrs.width.includes('%') ? attrs.width : attrs.width + 'px';
+			if (width) {
+				styleObj.width = width;
+				attrs.width = '100%';
+				if (parseInt(width) > windowWidth) {
+					styleObj.height = '';
+					if (attrs.height) attrs.height = void 0;
+				}
+			}
+			if (styleObj.height) {
+				attrs.height = styleObj.height;
+				styleObj.height = '';
+			} else if (attrs.height && !attrs.height.includes('%'))
+				attrs.height += 'px';
+		}
+		for (var key in styleObj) {
+			var value = styleObj[key];
+			if (!value) continue;
+			if (key.includes('flex') || key == 'order' || key == 'self-align') node.c = 1;
+			// 填充链接
+			if (value.includes('url')) {
+				var j = value.indexOf('(');
+				if (j++ != -1) {
+					while (value[j] == '"' || value[j] == "'" || blankChar[value[j]]) j++;
+					value = value.substr(0, j) + this.getUrl(value.substr(j));
+				}
+			}
+			// 转换 rpx
+			else if (value.includes('rpx'))
+				value = value.replace(/[0-9.]+\s*rpx/g, $ => parseFloat($) * windowWidth / 750 + 'px');
+			else if (key == 'white-space' && value.includes('pre') && !close)
+				this.pre = node.pre = true;
+			style += `;${key}:${value}`;
+		}
+		style = style.substr(1);
+		if (style) attrs.style = style;
+		if (!close) {
+			node.children = [];
+			if (node.name == 'pre' && cfg.highlight) {
+				this.remove(node);
+				this.pre = node.pre = true;
+			}
+			this.siblings().push(node);
+			this.STACK.push(node);
+		} else if (!cfg.filter || cfg.filter(node, this) != false)
+			this.siblings().push(node);
+	} else {
+		if (!close) this.remove(node);
+		else if (node.name == 'source') {
+			var parent = this.parent();
+			if (parent && (parent.name == 'video' || parent.name == 'audio') && node.attrs.src)
+				parent.attrs.source.push(node.attrs.src);
+		} else if (node.name == 'base' && !this.domain) this.domain = node.attrs.href;
+	}
+	if (this.data[this.i] == '/') this.i++;
+	this.start = this.i + 1;
+	this.state = this.Text;
+}
+// 移除标签
+MpHtmlParser.prototype.remove = function(node) {
+	var name = node.name,
+		j = this.i;
+	// 处理 svg
+	var handleSvg = () => {
+		var src = this.data.substring(j, this.i + 1);
+		if (!node.attrs.xmlns) src = ' xmlns="http://www.w3.org/2000/svg"' + src;
+		var i = j;
+		while (this.data[j] != '<') j--;
+		src = this.data.substring(j, i).replace("viewbox", "viewBox") + src;
+		var parent = this.parent();
+		if (node.attrs.width == '100%' && parent && (parent.attrs.style || '').includes('inline'))
+			parent.attrs.style = 'width:300px;max-width:100%;' + parent.attrs.style;
+		this.siblings().push({
+			name: 'img',
+			attrs: {
+				src: 'data:image/svg+xml;utf8,' + src.replace(/#/g, '%23'),
+				style: (/vertical[^;]+/.exec(node.attrs.style) || []).shift(),
+				ignore: 'T'
+			}
+		})
+	}
+	if (node.name == 'svg' && this.data[j] == '/') return handleSvg(this.i++);
+	while (1) {
+		if ((this.i = this.data.indexOf('</', this.i + 1)) == -1) {
+			if (name == 'pre' || name == 'svg') this.i = j;
+			else this.i = this.data.length;
+			return;
+		}
+		this.start = (this.i += 2);
+		while (!blankChar[this.data[this.i]] && !this.isClose()) this.i++;
+		if (this.section().toLowerCase() == name) {
+			// 代码块高亮
+			if (name == 'pre') {
+				this.data = this.data.substr(0, j + 1) + cfg.highlight(this.data.substring(j + 1, this.i - 5), node.attrs) + this.data
+					.substr(this.i - 5);
+				return this.i = j;
+			} else if (name == 'style')
+				this.CssHandler.getStyle(this.data.substring(j + 1, this.i - 7));
+			else if (name == 'title')
+				this.DOM.title = this.data.substring(j + 1, this.i - 7);
+			if ((this.i = this.data.indexOf('>', this.i)) == -1) this.i = this.data.length;
+			if (name == 'svg') handleSvg();
+			return;
+		}
+	}
+}
+// 节点出栈处理
+MpHtmlParser.prototype.popNode = function(node) {
+	// 空白符处理
+	if (node.pre) {
+		node.pre = this.pre = void 0;
+		for (let i = this.STACK.length; i--;)
+			if (this.STACK[i].pre)
+				this.pre = true;
+	}
+	var siblings = this.siblings(),
+		len = siblings.length,
+		childs = node.children;
+	if (node.name == 'head' || (cfg.filter && cfg.filter(node, this) == false))
+		return siblings.pop();
+	var attrs = node.attrs;
+	// 替换一些标签名
+	if (cfg.blockTags[node.name]) node.name = 'div';
+	else if (!cfg.trustTags[node.name]) node.name = 'span';
+	// 处理列表
+	if (node.c && (node.name == 'ul' || node.name == 'ol')) {
+		if ((node.attrs.style || '').includes('list-style:none')) {
+			for (let i = 0, child; child = childs[i++];)
+				if (child.name == 'li')
+					child.name = 'div';
+		} else if (node.name == 'ul') {
+			var floor = 1;
+			for (let i = this.STACK.length; i--;)
+				if (this.STACK[i].name == 'ul') floor++;
+			if (floor != 1)
+				for (let i = childs.length; i--;)
+					childs[i].floor = floor;
+		} else {
+			for (let i = 0, num = 1, child; child = childs[i++];)
+				if (child.name == 'li') {
+					child.type = 'ol';
+					child.num = ((num, type) => {
+						if (type == 'a') return String.fromCharCode(97 + (num - 1) % 26);
+						if (type == 'A') return String.fromCharCode(65 + (num - 1) % 26);
+						if (type == 'i' || type == 'I') {
+							num = (num - 1) % 99 + 1;
+							var one = ['I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX'],
+								ten = ['X', 'XX', 'XXX', 'XL', 'L', 'LX', 'LXX', 'LXXX', 'XC'],
+								res = (ten[Math.floor(num / 10) - 1] || '') + (one[num % 10 - 1] || '');
+							if (type == 'i') return res.toLowerCase();
+							return res;
+						}
+						return num;
+					})(num++, attrs.type) + '.';
+				}
+		}
+	}
+	// 处理表格的边框
+	if (node.name == 'table') {
+		var padding = attrs.cellpadding,
+			spacing = attrs.cellspacing,
+			border = attrs.border;
+		if (node.c) {
+			this.bubble();
+			attrs.style = (attrs.style || '') + ';display:table';
+			if (!padding) padding = 2;
+			if (!spacing) spacing = 2;
+		}
+		if (border) attrs.style = `border:${border}px solid gray;${attrs.style || ''}`;
+		if (spacing) attrs.style = `border-spacing:${spacing}px;${attrs.style || ''}`;
+		if (border || padding || node.c)
+			(function f(ns) {
+				for (var i = 0, n; n = ns[i]; i++) {
+					if (n.type == 'text') continue;
+					var style = n.attrs.style || '';
+					if (node.c && n.name[0] == 't') {
+						n.c = 1;
+						style += ';display:table-' + (n.name == 'th' || n.name == 'td' ? 'cell' : (n.name == 'tr' ? 'row' : 'row-group'));
+					}
+					if (n.name == 'th' || n.name == 'td') {
+						if (border) style = `border:${border}px solid gray;${style}`;
+						if (padding) style = `padding:${padding}px;${style}`;
+					} else f(n.children || []);
+					if (style) n.attrs.style = style;
+				}
+			})(childs)
+		if (this.options.autoscroll) {
+			var table = Object.assign({}, node);
+			node.name = 'div';
+			node.attrs = {
+				style: 'overflow:scroll'
+			}
+			node.children = [table];
+		}
+	}
+	this.CssHandler.pop && this.CssHandler.pop(node);
+	// 自动压缩
+	if (node.name == 'div' && !Object.keys(attrs).length && childs.length == 1 && childs[0].name == 'div')
+		siblings[len - 1] = childs[0];
+}
+// 状态机
+MpHtmlParser.prototype.Text = function(c) {
+	if (c == '<') {
+		var next = this.data[this.i + 1],
+			isLetter = c => (c >= 'a' && c <= 'z') || (c >= 'A' && c <= 'Z');
+		if (isLetter(next)) {
+			this.setText();
+			this.start = this.i + 1;
+			this.state = this.TagName;
+		} else if (next == '/') {
+			this.setText();
+			if (isLetter(this.data[++this.i + 1])) {
+				this.start = this.i + 1;
+				this.state = this.EndTag;
+			} else this.Comment();
+		} else if (next == '!' || next == '?') {
+			this.setText();
+			this.Comment();
+		}
+	}
+}
+MpHtmlParser.prototype.Comment = function() {
+	var key;
+	if (this.data.substring(this.i + 2, this.i + 4) == '--') key = '-->';
+	else if (this.data.substring(this.i + 2, this.i + 9) == '[CDATA[') key = ']]>';
+	else key = '>';
+	if ((this.i = this.data.indexOf(key, this.i + 2)) == -1) this.i = this.data.length;
+	else this.i += key.length - 1;
+	this.start = this.i + 1;
+	this.state = this.Text;
+}
+MpHtmlParser.prototype.TagName = function(c) {
+	if (blankChar[c]) {
+		this.tagName = this.section();
+		while (blankChar[this.data[this.i]]) this.i++;
+		if (this.isClose()) this.setNode();
+		else {
+			this.start = this.i;
+			this.state = this.AttrName;
+		}
+	} else if (this.isClose()) {
+		this.tagName = this.section();
+		this.setNode();
+	}
+}
+MpHtmlParser.prototype.AttrName = function(c) {
+	if (c == '=' || blankChar[c] || this.isClose()) {
+		this.attrName = this.section();
+		if (blankChar[c])
+			while (blankChar[this.data[++this.i]]);
+		if (this.data[this.i] == '=') {
+			while (blankChar[this.data[++this.i]]);
+			this.start = this.i--;
+			this.state = this.AttrValue;
+		} else this.setAttr();
+	}
+}
+MpHtmlParser.prototype.AttrValue = function(c) {
+	if (c == '"' || c == "'") {
+		this.start++;
+		if ((this.i = this.data.indexOf(c, this.i + 1)) == -1) return this.i = this.data.length;
+		this.attrVal = this.section();
+		this.i++;
+	} else {
+		for (; !blankChar[this.data[this.i]] && !this.isClose(); this.i++);
+		this.attrVal = this.section();
+	}
+	this.setAttr();
+}
+MpHtmlParser.prototype.EndTag = function(c) {
+	if (blankChar[c] || c == '>' || c == '/') {
+		var name = this.section().toLowerCase();
+		for (var i = this.STACK.length; i--;)
+			if (this.STACK[i].name == name) break;
+		if (i != -1) {
+			var node;
+			while ((node = this.STACK.pop()).name != name) this.popNode(node);
+			this.popNode(node);
+		} else if (name == 'p' || name == 'br')
+			this.siblings().push({
+				name,
+				attrs: {}
+			});
+		this.i = this.data.indexOf('>', this.i);
+		this.start = this.i + 1;
+		if (this.i == -1) this.i = this.data.length;
+		else this.state = this.Text;
+	}
+}
+module.exports = MpHtmlParser;

lib/jyf-parser/libs/config.js

@@ -0,0 +1,80 @@
+/* 配置文件 */
+var cfg = {
+	// 出错占位图
+	errorImg: null,
+	// 过滤器函数
+	filter: null,
+	// 代码高亮函数
+	highlight: null,
+	// 文本处理函数
+	onText: null,
+	// 实体编码列表
+	entities: {
+		quot: '"',
+		apos: "'",
+		semi: ';',
+		nbsp: '\xA0',
+		ensp: '\u2002',
+		emsp: '\u2003',
+		ndash: '–',
+		mdash: '—',
+		middot: '·',
+		lsquo: '‘',
+		rsquo: '’',
+		ldquo: '“',
+		rdquo: '”',
+		bull: '•',
+		hellip: '…'
+	},
+	blankChar: makeMap(' ,\xA0,\t,\r,\n,\f'),
+	boolAttrs: makeMap('allowfullscreen,autoplay,autostart,controls,ignore,loop,muted'),
+	// 块级标签，将被转为 div
+	blockTags: makeMap('address,article,aside,body,caption,center,cite,footer,header,html,nav,pre,section'),
+	// 将被移除的标签
+	ignoreTags: makeMap('area,base,canvas,frame,iframe,input,link,map,meta,param,script,source,style,svg,textarea,title,track,wbr'),
+	// 只能被 rich-text 显示的标签
+	richOnlyTags: makeMap('a,colgroup,fieldset,legend,table'),
+	// 自闭合的标签
+	selfClosingTags: makeMap('area,base,br,col,circle,ellipse,embed,frame,hr,img,input,line,link,meta,param,path,polygon,rect,source,track,use,wbr'),
+	// 信任的标签
+	trustTags: makeMap('a,abbr,ad,audio,b,blockquote,br,code,col,colgroup,dd,del,dl,dt,div,em,fieldset,h1,h2,h3,h4,h5,h6,hr,i,img,ins,label,legend,li,ol,p,q,source,span,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,title,ul,video'),
+	// 默认的标签样式
+	userAgentStyles: {
+		address: 'font-style:italic',
+		big: 'display:inline;font-size:1.2em',
+		blockquote: 'background-color:#f6f6f6;border-left:3px solid #dbdbdb;color:#6c6c6c;padding:5px 0 5px 10px',
+		caption: 'display:table-caption;text-align:center',
+		center: 'text-align:center',
+		cite: 'font-style:italic',
+		dd: 'margin-left:40px',
+		mark: 'background-color:yellow',
+		pre: 'font-family:monospace;white-space:pre;overflow:scroll',
+		s: 'text-decoration:line-through',
+		small: 'display:inline;font-size:0.8em',
+		u: 'text-decoration:underline'
+	}
+}
+
+function makeMap(str) {
+	var map = Object.create(null),
+		list = str.split(',');
+	for (var i = list.length; i--;)
+		map[list[i]] = true;
+	return map;
+}
+
+// #ifdef MP-WEIXIN
+if (wx.canIUse('editor')) {
+	cfg.blockTags.pre = void 0;
+	cfg.ignoreTags.rp = true;
+	Object.assign(cfg.richOnlyTags, makeMap('bdi,bdo,caption,rt,ruby'));
+	Object.assign(cfg.trustTags, makeMap('bdi,bdo,caption,pre,rt,ruby'));
+}
+// #endif
+
+// #ifdef APP-PLUS
+cfg.ignoreTags.iframe = void 0;
+Object.assign(cfg.trustTags, makeMap('embed,iframe'));
+// #endif
+
+module.exports = cfg;

lib/jyf-parser/libs/handler.wxs

@@ -0,0 +1,22 @@
+var inline = {
+	abbr: 1,
+	b: 1,
+	big: 1,
+	code: 1,
+	del: 1,
+	em: 1,
+	i: 1,
+	ins: 1,
+	label: 1,
+	q: 1,
+	small: 1,
+	span: 1,
+	strong: 1,
+	sub: 1,
+	sup: 1
+}
+module.exports = {
+	use: function(item) {
+		return !item.c && !inline[item.name] && (item.attrs.style || '').indexOf('display:inline') == -1
+	}
+}

lib/jyf-parser/libs/trees.vue

@@ -0,0 +1,501 @@
+<template>
+	<view :class="'interlayer '+(c||'')" :style="s">
+		<block v-for="(n, i) in nodes" v-bind:key="i">
+			<!--图片-->
+			<view v-if="n.name=='img'" :class="'_img '+n.attrs.class" :style="n.attrs.style" :data-attrs="n.attrs" @tap="imgtap">
+				<rich-text v-if="ctrl[i]!=0" :nodes="[{attrs:{src:loading&&(ctrl[i]||0)<2?loading:(lazyLoad&&!ctrl[i]?placeholder:(ctrl[i]==3?errorImg:n.attrs.src||'')),alt:n.attrs.alt||'',width:n.attrs.width||'',style:'-webkit-touch-callout:none;max-width:100%;display:block'+(n.attrs.height?';height:'+n.attrs.height:'')},name:'img'}]" />
+				<image class="_image" :src="lazyLoad&&!ctrl[i]?placeholder:n.attrs.src" :lazy-load="lazyLoad"
+				 :show-menu-by-longpress="!n.attrs.ignore" :data-i="i" :data-index="n.attrs.i" data-source="img" @load="loadImg"
+				 @error="error" />
+			</view>
+			<!--文本-->
+			<text v-else-if="n.type=='text'" decode>{{n.text}}</text>
+			<!--#ifndef MP-BAIDU-->
+			<text v-else-if="n.name=='br'">\n</text>
+			<!--#endif-->
+			<!--视频-->
+			<view v-else-if="((n.lazyLoad&&!n.attrs.autoplay)||(n.name=='video'&&!loadVideo))&&ctrl[i]==undefined" :id="n.attrs.id" :class="'_video '+(n.attrs.class||'')"
+			 :style="n.attrs.style" :data-i="i" @tap="_loadVideo" />
+			<video v-else-if="n.name=='video'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :autoplay="n.attrs.autoplay||ctrl[i]==0"
+			 :controls="n.attrs.controls" :loop="n.attrs.loop" :muted="n.attrs.muted" :poster="n.attrs.poster" :src="n.attrs.source[ctrl[i]||0]"
+			 :unit-id="n.attrs['unit-id']" :data-id="n.attrs.id" :data-i="i" data-source="video" @error="error" @play="play" />
+			<!--音频-->
+			<audio v-else-if="n.name=='audio'" :ref="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :author="n.attrs.author"
+			 :autoplay="n.attrs.autoplay" :controls="n.attrs.controls" :loop="n.attrs.loop" :name="n.attrs.name" :poster="n.attrs.poster"
+			 :src="n.attrs.source[ctrl[i]||0]" :data-i="i" :data-id="n.attrs.id" data-source="audio"
+			 @error.native="error" @play.native="play" />
+			<!--链接-->
+			<view v-else-if="n.name=='a'" :id="n.attrs.id" :class="'_a '+(n.attrs.class||'')" hover-class="_hover" :style="n.attrs.style"
+			 :data-attrs="n.attrs" @tap="linkpress">
+				<trees class="_span" c="_span" :nodes="n.children" />
+			</view>
+			<!--广告-->
+			<!--<ad v-else-if="n.name=='ad'" :class="n.attrs.class" :style="n.attrs.style" :unit-id="n.attrs['unit-id']" :appid="n.attrs.appid" :apid="n.attrs.apid" :type="n.attrs.type" :adpid="n.attrs.adpid" data-source="ad" @error="error" />-->
+			<!--列表-->
+			<view v-else-if="n.name=='li'" :id="n.attrs.id" :class="n.attrs.class" :style="(n.attrs.style||'')+';display:flex;flex-direction:row'">
+				<view v-if="n.type=='ol'" class="_ol-bef">{{n.num}}</view>
+				<view v-else class="_ul-bef">
+					<view v-if="n.floor%3==0" class="_ul-p1">█</view>
+					<view v-else-if="n.floor%3==2" class="_ul-p2" />
+					<view v-else class="_ul-p1" style="border-radius:50%">█</view>
+				</view>
+				<trees class="_li" c="_li" :nodes="n.children" :lazyLoad="lazyLoad" :loading="loading" />
+			</view>
+			<!--表格-->
+			<view v-else-if="n.name=='table'&&n.c" :id="n.attrs.id" :class="n.attrs.class" :style="(n.attrs.style||'')+';display:table'">
+				<view v-for="(tbody, o) in n.children" v-bind:key="o" :class="tbody.attrs.class" :style="(tbody.attrs.style||'')+(tbody.name[0]=='t'?';display:table-'+(tbody.name=='tr'?'row':'row-group'):'')">
+					<view v-for="(tr, p) in tbody.children" v-bind:key="p" :class="tr.attrs.class" :style="(tr.attrs.style||'')+(tr.name[0]=='t'?';display:table-'+(tr.name=='tr'?'row':'cell'):'')">
+						<trees v-if="tr.name=='td'" :nodes="tr.children" />
+						<trees v-else v-for="(td, q) in tr.children" v-bind:key="q" :class="td.attrs.class" :c="td.attrs.class" :style="(td.attrs.style||'')+(td.name[0]=='t'?';display:table-'+(td.name=='tr'?'row':'cell'):'')"
+						 :s="(td.attrs.style||'')+(td.name[0]=='t'?';display:table-'+(td.name=='tr'?'row':'cell'):'')" :nodes="td.children" />
+					</view>
+				</view>
+			</view>
+			<!--#ifdef APP-PLUS-->
+			<iframe v-else-if="n.name=='iframe'" :style="n.attrs.style" :allowfullscreen="n.attrs.allowfullscreen" :frameborder="n.attrs.frameborder"
+			 :width="n.attrs.width" :height="n.attrs.height" :src="n.attrs.src" />
+			<embed v-else-if="n.name=='embed'" :style="n.attrs.style" :width="n.attrs.width" :height="n.attrs.height" :src="n.attrs.src" />
+			<!--#endif-->
+			<!--富文本-->
+			<!--#ifdef MP-WEIXIN || MP-QQ || APP-PLUS-->
+			<rich-text v-else-if="handler.use(n)" :id="n.attrs.id" :class="'_p __'+n.name" :nodes="[n]" />
+			<!--#endif-->
+			<!--#ifndef MP-WEIXIN || MP-QQ || APP-PLUS-->
+			<rich-text v-else-if="!n.c" :id="n.attrs.id" :nodes="[n]" style="display:inline" />
+			<!--#endif-->
+			<trees v-else :class="(n.attrs.id||'')+' _'+n.name+' '+(n.attrs.class||'')" :c="(n.attrs.id||'')+' _'+n.name+' '+(n.attrs.class||'')"
+			 :style="n.attrs.style" :s="n.attrs.style" :nodes="n.children" :lazyLoad="lazyLoad" :loading="loading" />
+		</block>
+	</view>
+</template>
+<script module="handler" lang="wxs" src="./handler.wxs"></script>
+<script>
+	global.Parser = {};
+	import trees from './trees'
+	const errorImg = require('../libs/config.js').errorImg;
+	export default {
+		components: {
+			trees
+		},
+		name: 'trees',
+		data() {
+			return {
+				ctrl: [],
+				placeholder: 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="225"/>',
+				errorImg,
+				loadVideo: typeof plus == 'undefined',
+				// #ifndef MP-ALIPAY
+				c: '',
+				s: ''
+				// #endif
+			}
+		},
+		props: {
+			nodes: Array,
+			lazyLoad: Boolean,
+			loading: String,
+			// #ifdef MP-ALIPAY
+			c: String,
+			s: String
+			// #endif
+		},
+		mounted() {
+			for (this.top = this.$parent; this.top.$options.name != 'parser'; this.top = this.top.$parent);
+			this.init();
+		},
+		// #ifdef APP-PLUS
+		beforeDestroy() {
+			this.observer && this.observer.disconnect();
+		},
+		// #endif
+		methods: {
+			init() {
+				for (var i = this.nodes.length, n; n = this.nodes[--i];) {
+					if (n.name == 'img') {
+						this.top.imgList.setItem(n.attrs.i, n.attrs.src);
+						// #ifdef APP-PLUS
+						if (this.lazyLoad && !this.observer) {
+							this.observer = uni.createIntersectionObserver(this).relativeToViewport({
+								top: 500,
+								bottom: 500
+							});
+							setTimeout(() => {
+								this.observer.observe('._img', res => {
+									if (res.intersectionRatio) {
+										for (var j = this.nodes.length; j--;)
+											if (this.nodes[j].name == 'img')
+												this.$set(this.ctrl, j, 1);
+										this.observer.disconnect();
+									}
+								})
+							}, 0)
+						}
+						// #endif
+					} else if (n.name == 'video' || n.name == 'audio') {
+						var ctx;
+						if (n.name == 'video') {
+							ctx = uni.createVideoContext(n.attrs.id
+								// #ifndef MP-BAIDU
+								, this
+								// #endif
+							);
+						} else if (this.$refs[n.attrs.id])
+							ctx = this.$refs[n.attrs.id][0];
+						if (ctx) {
+							ctx.id = n.attrs.id;
+							this.top.videoContexts.push(ctx);
+						}
+					}
+				}
+				// #ifdef APP-PLUS
+				// APP 上避免 video 错位需要延时渲染
+				setTimeout(() => {
+					this.loadVideo = true;
+				}, 1000)
+				// #endif
+			},
+			play(e) {
+				var contexts = this.top.videoContexts;
+				if (contexts.length > 1 && this.top.autopause)
+					for (var i = contexts.length; i--;)
+						if (contexts[i].id != e.currentTarget.dataset.id)
+							contexts[i].pause();
+			},
+			imgtap(e) {
+				var attrs = e.currentTarget.dataset.attrs;
+				if (!attrs.ignore) {
+					var preview = true,
+						data = {
+							id: e.target.id,
+							src: attrs.src,
+							ignore: () => preview = false
+						};
+					global.Parser.onImgtap && global.Parser.onImgtap(data);
+					this.top.$emit('imgtap', data);
+					if (preview) {
+						var urls = this.top.imgList,
+							current = urls[attrs.i] ? parseInt(attrs.i) : (urls = [attrs.src], 0);
+						uni.previewImage({
+							current,
+							urls
+						})
+					}
+				}
+			},
+			loadImg(e) {
+				var i = e.currentTarget.dataset.i;
+				if (this.lazyLoad && !this.ctrl[i]) {
+					// #ifdef QUICKAPP-WEBVIEW
+					this.$set(this.ctrl, i, 0);
+					this.$nextTick(function() {
+						// #endif
+						// #ifndef APP-PLUS
+						this.$set(this.ctrl, i, 1);
+						// #endif
+						// #ifdef QUICKAPP-WEBVIEW
+					})
+					// #endif
+				} else if (this.loading && this.ctrl[i] != 2) {
+					// #ifdef QUICKAPP-WEBVIEW
+					this.$set(this.ctrl, i, 0);
+					this.$nextTick(function() {
+						// #endif
+						this.$set(this.ctrl, i, 2);
+						// #ifdef QUICKAPP-WEBVIEW
+					})
+					// #endif
+				}
+			},
+			linkpress(e) {
+				var jump = true,
+					attrs = e.currentTarget.dataset.attrs;
+				attrs.ignore = () => jump = false;
+				global.Parser.onLinkpress && global.Parser.onLinkpress(attrs);
+				this.top.$emit('linkpress', attrs);
+				if (jump) {
+					// #ifdef MP
+					if (attrs['app-id']) {
+						return uni.navigateToMiniProgram({
+							appId: attrs['app-id'],
+							path: attrs.path
+						})
+					}
+					// #endif
+					if (attrs.href) {
+						if (attrs.href[0] == '#') {
+							if (this.top.useAnchor)
+								this.top.navigateTo({
+									id: attrs.href.substring(1)
+								})
+						} else if (attrs.href.indexOf('http') == 0 || attrs.href.indexOf('//') == 0) {
+							// #ifdef APP-PLUS
+							plus.runtime.openWeb(attrs.href);
+							// #endif
+							// #ifndef APP-PLUS
+							uni.setClipboardData({
+								data: attrs.href,
+								success: () =>
+									uni.showToast({
+										title: '链接已复制'
+									})
+							})
+							// #endif
+						} else
+							uni.navigateTo({
+								url: attrs.href,
+								fail() {
+									uni.switchTab({
+										url: attrs.href,
+									})
+								}
+							})
+					}
+				}
+			},
+			error(e) {
+				var target = e.currentTarget,
+					source = target.dataset.source,
+					i = target.dataset.i;
+				if (source == 'video' || source == 'audio') {
+					// 加载其他 source
+					var index = this.ctrl[i] ? this.ctrl[i].i + 1 : 1;
+					if (index < this.nodes[i].attrs.source.length)
+						this.$set(this.ctrl, i, index);
+					if (e.detail.__args__)
+						e.detail = e.detail.__args__[0];
+				} else if (errorImg && source == 'img') {
+					this.top.imgList.setItem(target.dataset.index, errorImg);
+					this.$set(this.ctrl, i, 3);
+				}
+				this.top && this.top.$emit('error', {
+					source,
+					target,
+					errMsg: e.detail.errMsg
+				});
+			},
+			_loadVideo(e) {
+				this.$set(this.ctrl, e.target.dataset.i, 0);
+			}
+		}
+	}
+</script>
+
+<style>
+	/* 在这里引入自定义样式 */
+
+	/* 链接和图片效果 */
+	._a {
+		display: inline;
+		padding: 1.5px 0 1.5px 0;
+		color: #366092;
+		word-break: break-all;
+	}
+
+	._hover {
+		text-decoration: underline;
+		opacity: 0.7;
+	}
+
+	._img {
+		display: inline-block;
+		max-width: 100%;
+		overflow: hidden;
+	}
+
+	/* #ifdef MP-WEIXIN */
+	:host {
+		display: inline;
+	}
+
+	/* #endif */
+
+	/* #ifndef MP-ALIPAY || APP-PLUS */
+	.interlayer {
+		display: inherit;
+		flex-direction: inherit;
+		flex-wrap: inherit;
+		align-content: inherit;
+		align-items: inherit;
+		justify-content: inherit;
+		width: 100%;
+		white-space: inherit;
+	}
+
+	/* #endif */
+
+	._b,
+	._strong {
+		font-weight: bold;
+	}
+
+	/* #ifndef MP-ALIPAY */
+	._blockquote,
+	._div,
+	._p,
+	._ol,
+	._ul,
+	._li {
+		display: block;
+	}
+	
+	/* #endif */
+
+	._code {
+		font-family: monospace;
+	}
+
+	._del {
+		text-decoration: line-through;
+	}
+
+	._em,
+	._i {
+		font-style: italic;
+	}
+
+	._h1 {
+		font-size: 2em;
+	}
+
+	._h2 {
+		font-size: 1.5em;
+	}
+
+	._h3 {
+		font-size: 1.17em;
+	}
+
+	._h5 {
+		font-size: 0.83em;
+	}
+
+	._h6 {
+		font-size: 0.67em;
+	}
+
+	._h1,
+	._h2,
+	._h3,
+	._h4,
+	._h5,
+	._h6 {
+		display: block;
+		font-weight: bold;
+	}
+
+	._image {
+		display: block;
+		width: 100%;
+		height: 360px;
+		margin-top: -360px;
+		opacity: 0;
+	}
+
+	._ins {
+		text-decoration: underline;
+	}
+
+	._li {
+		flex: 1;
+		width: 0;
+	}
+
+	._ol-bef {
+		width: 36px;
+		margin-right: 5px;
+		text-align: right;
+	}
+
+	._ul-bef {
+		display: block;
+		margin: 0 12px 0 23px;
+		line-height: normal;
+	}
+
+	._ol-bef,
+	._ul-bef {
+		flex: none;
+		user-select: none;
+	}
+
+	._ul-p1 {
+		display: inline-block;
+		width: 0.3em;
+		height: 0.3em;
+		overflow: hidden;
+		line-height: 0.3em;
+	}
+
+	._ul-p2 {
+		display: inline-block;
+		width: 0.23em;
+		height: 0.23em;
+		border: 0.05em solid black;
+		border-radius: 50%;
+	}
+
+	._q::before {
+		content: '"';
+	}
+
+	._q::after {
+		content: '"';
+	}
+
+	._sub {
+		font-size: smaller;
+		vertical-align: sub;
+	}
+
+	._sup {
+		font-size: smaller;
+		vertical-align: super;
+	}
+
+	/* #ifdef MP-ALIPAY || APP-PLUS || QUICKAPP-WEBVIEW */
+	._abbr,
+	._b,
+	._code,
+	._del,
+	._em,
+	._i,
+	._ins,
+	._label,
+	._q,
+	._span,
+	._strong,
+	._sub,
+	._sup {
+		display: inline;
+	}
+
+	/* #endif */
+
+	/* #ifdef MP-WEIXIN || MP-QQ */
+	.__bdo,
+	.__bdi,
+	.__ruby,
+	.__rt {
+		display: inline-block;
+	}
+
+	/* #endif */
+	._video {
+		position: relative;
+		display: inline-block;
+		width: 300px;
+		height: 225px;
+		background-color: black;
+	}
+
+	._video::after {
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		margin: -15px 0 0 -15px;
+		content: '';
+		border-color: transparent transparent transparent white;
+		border-style: solid;
+		border-width: 15px 0 15px 30px;
+	}
+</style>

lib/yq-avatar/yq-avatar.vue

@@ -0,0 +1,1362 @@
+<template name="yq-avatar">
+	<view>
+		<image :src="imgSrc.imgSrc" @click="fSelect" :style="[ iS ]" class="my-avatar"></image>
+		<canvas canvas-id="avatar-canvas" id="avatar-canvas" class="my-canvas" :style="{top: sT, height: csH}"
+		 disable-scroll="false"></canvas>
+		<canvas canvas-id="oper-canvas" id="oper-canvas" class="oper-canvas" :style="{top: sT, height: csH}"
+		 disable-scroll="false" @touchstart="fStart" @touchmove="fMove" @touchend="fEnd"></canvas>
+		<canvas canvas-id="prv-canvas" id="prv-canvas" class="prv-canvas" disable-scroll="false" 
+		@touchstart="fHideImg" :style="{ height: csH, top: pT }"></canvas>
+		<!--<view class="oper-wrapper" :style="{display: sD, top:tp}">-->
+		<view class="oper-wrapper" :style="{display: sD}">
+			<view class="oper">
+				<view class="btn-wrapper" v-if="sO">
+					<view @click="fSelect" hover-class="hover" :style="{width: bW}"><text>重选</text></view>
+					<view @click="fClose" hover-class="hover" :style="{width: bW}"><text>关闭</text></view>
+					<view @click="fRotate" hover-class="hover" :style="{width: bW, display: bD}"><text>旋转</text></view>
+					<view @click="fPreview" hover-class="hover" :style="{width: bW}"><text>预览</text></view>
+					<view @click="fUpload" hover-class="hover" :style="{width: bW}"><text>上传</text></view>
+				</view>
+				<view class="clr-wrapper" v-else>
+					<slider class="my-slider" @change="fColorChange" block-size="25" value="0" min="-100" max="100" activeColor="red"
+					 backgroundColor="green" block-color="grey" show-value></slider>
+					<view @click="fPrvUpload" hover-class="hover" :style="{width: bW}"><text>上传</text></view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	"use strict";
+	const tH = 50;
+	export default {
+		name: "yq-avatar",
+		data() {
+			return {
+				csH: '0px',
+				sD: 'none',
+				sT: '-10000px',
+				pT: '-10000px',
+				iS: {},
+				sS: {},
+				sO: true,
+				bW: '19%',
+				bD: 'flex',
+				tp: 0,
+				imgSrc: {
+					imgSrc: ''
+				}
+			};
+		},
+		watch: {
+			avatarSrc() {
+				this.imgSrc.imgSrc = this.avatarSrc;
+			}
+		},
+		props: {
+			avatarSrc: '',
+			avatarStyle: '',
+			selWidth: '',
+			selHeight: '',
+			expWidth: '',
+			expHeight: '',
+			minScale: '',
+			maxScale: '',
+			canScale: '',
+			canRotate: '',
+			lockWidth: '',
+			lockHeight: '',
+			stretch: '',
+			lock: '',
+			fileType: '',
+			noTab: '',
+			inner: '',
+			quality: '',
+			index: '',
+			bgImage: '',
+		},
+		created() {
+			this.cc = uni.createCanvasContext('avatar-canvas', this);
+			this.cco = uni.createCanvasContext('oper-canvas', this);
+			this.ccp = uni.createCanvasContext('prv-canvas', this);
+			this.qlty = parseFloat(this.quality) || 1;
+			this.imgSrc.imgSrc = this.avatarSrc;
+			this.letRotate = (this.canRotate === false || this.inner === true || this.inner === 'true' || this.canRotate === 'false') ? 0 : 1;
+			this.letScale = (this.canScale === false || this.canScale === 'false') ? 0 : 1;
+			this.isin = (this.inner === true || this.inner === 'true') ? 1 : 0;
+			this.indx = this.index || undefined;
+			this.mnScale = parseFloat(this.minScale) || 0.3;
+			this.mxScale = parseFloat(this.maxScale) || 4;
+			this.noBar = (this.noTab === true || this.noTab === 'true') ? 1 : 0;
+			this.stc = this.stretch;
+			this.lck = this.lock;
+			this.fType = this.fileType === 'jpg' ? 'jpg' : 'png';
+			if (this.isin||!this.letRotate) {
+				this.bW = '24%';
+				this.bD = 'none';
+			} else {
+				this.bW = '19%';
+				this.bD = 'flex';
+			}
+			
+			if (this.noBar) {
+				this.fWindowResize();
+			} else {
+				uni.showTabBar({
+					fail: ()=>{
+						this.noBar = 1;
+					},
+					success: ()=>{
+						this.noBar = 0;
+					},
+					complete: (res) => {
+						this.fWindowResize();
+					}
+				});
+			}
+		},
+		methods: {
+			fWindowResize() {
+				let sysInfo = uni.getSystemInfoSync();
+				this.platform = sysInfo.platform;
+				this.wW = sysInfo.windowWidth;
+
+				// #ifdef H5
+				this.drawTop = sysInfo.windowTop;
+				// #endif
+				// #ifndef H5
+				this.drawTop = 0;
+				// #endif
+				
+				// #ifdef MP-ALIPAY
+				this.wH = sysInfo.screenHeight - sysInfo.statusBarHeight - sysInfo.titleBarHeight;
+				this.csH = this.wH - tH  + 'px';
+				// #endif
+				
+				// #ifndef MP-ALIPAY
+				this.wH = sysInfo.windowHeight;
+				if(!this.noBar) this.wH += tH;
+				this.csH = this.wH - tH  + 'px';
+				// #endif
+				
+				this.tp = this.csH;
+				// #ifdef H5
+				this.tp =  sysInfo.windowTop + parseInt(this.csH)+ 'px';
+				// #endif
+				
+				this.pxRatio = this.wW / 750;
+
+				let style = this.avatarStyle;
+				if (style && style !== true && (style = style.trim())) {
+					style = style.split(';');
+					let obj = {};
+					for (let v of style) {
+						if (!v) continue;
+						v = v.trim().split(':');
+						if (v[1].toString().indexOf('upx') >= 0) {
+							let arr = v[1].trim().split(' ');
+							for (let k in arr) {
+								if (!arr[k]) continue;
+								if (arr[k].toString().indexOf('upx') >= 0) {
+									arr[k] = parseFloat(arr[k]) * this.pxRatio + 'px';
+								}
+							}
+							v[1] = arr.join(' ');
+						}
+						obj[v[0].trim()] = v[1].trim();
+					}
+					this.iS = obj;
+				}
+
+				this.expWidth && (this.eW = this.expWidth.toString().indexOf('upx') >= 0 ? parseInt(this.expWidth) * this.pxRatio :
+					parseInt(this.expWidth));
+				this.expHeight && (this.eH = this.expHeight.toString().indexOf('upx') >= 0 ? parseInt(this.expHeight) * this.pxRatio :
+					parseInt(this.expHeight));
+				
+				if (this.sD === 'flex') {
+					this.fDrawInit(true);
+				}
+				this.fHideImg();
+			},
+			fSelect() {
+				if (this.fSelecting) return;
+				this.fSelecting = true;
+				setTimeout(() => {
+					this.fSelecting = false;
+				}, 500);
+
+				uni.chooseImage({
+					count: 1,
+					sizeType: ['original', 'compressed'],
+					sourceType: ['album', 'camera'],
+					success: (r) => {
+						// #ifdef MP-ALIPAY
+						uni.showLoading();
+						// #endif
+						// #ifndef MP-ALIPAY
+						uni.showLoading({
+							title: '加载中...',
+							mask: true
+						});
+						// #endif
+
+						let path = this.imgPath = r.tempFilePaths[0];
+						uni.getImageInfo({
+							src: path,
+							success: r => {
+								this.imgWidth = r.width;
+								this.imgHeight = r.height;
+								this.path = path;
+								if (!this.hasSel) {
+									let style = this.sS || {};
+									if (this.selWidth && this.selHeight) {
+										let sW = this.selWidth.toString().indexOf('upx') >= 0 ? parseInt(this.selWidth) * this.pxRatio : parseInt(
+												this.selWidth),
+											sH = this.selHeight.toString().indexOf('upx') >= 0 ? parseInt(this.selHeight) * this.pxRatio : parseInt(
+												this.selHeight);
+										style.width = sW + 'px';
+										style.height = sH + 'px';
+										style.top = ((this.wH - sH - tH)|0) / 2 + 'px';
+										style.left = ((this.wW - sW)|0) / 2 + 'px';
+									} else {
+										uni.showModal({
+											title: '裁剪框的宽或高没有设置',
+											showCancel: false
+										})
+										return;
+									}
+									this.sS = style;
+								}
+
+								if (this.noBar) {
+									this.fDrawInit(true);
+								} else {
+									uni.hideTabBar({
+										complete: () => {
+											this.fDrawInit(true);
+										}
+									});
+								}
+							},
+							fail: () => {
+								uni.showToast({
+									title: "请选择正确图片",
+									duration: 2000,
+								})
+							},
+							complete() {
+								uni.hideLoading();
+							}
+						});
+					}
+				})
+			},
+			fUpload() {
+				if (this.fUploading) return;
+				this.fUploading = true;
+				setTimeout(() => {
+					this.fUploading = false;
+				}, 1000)
+
+				let style = this.sS,
+					x = parseInt(style.left),
+					y = parseInt(style.top),
+					width = parseInt(style.width),
+					height = parseInt(style.height),
+					expWidth = this.eW || (width* this.pixelRatio),
+					expHeight = this.eH || (height* this.pixelRatio);
+
+				// #ifdef MP-ALIPAY
+				uni.showLoading();
+				// #endif
+				// #ifndef MP-ALIPAY
+				uni.showLoading({
+					title: '加载中...',
+					mask: true
+				});
+				// #endif
+
+				this.sD = 'none';
+				this.sT = '-10000px';
+				this.hasSel = false;
+				this.fHideImg();
+				// #ifdef MP-ALIPAY
+				this.cc.toTempFilePath({
+					x: x,
+					y: y,
+					width: width,
+					height: height,
+					destWidth: expWidth,
+					destHeight: expHeight,
+					fileType: this.fType,
+					quality: this.qlty,
+					success: (r) => {
+						r = r.apFilePath;
+						this.$emit("upload", {
+							avatar: this.imgSrc,
+							path: r,
+							index: this.indx,
+							data: this.rtn,
+							base64: this.base64 || null
+						});
+					},
+					fail: (res) => {
+						uni.showToast({
+							title: "error1",
+							duration: 2000,
+						})
+					},
+					complete: () => {
+						uni.hideLoading();
+						this.noBar || uni.showTabBar();
+						this.$emit("end");
+					}
+				});
+				// #endif
+				// #ifndef MP-ALIPAY
+				uni.canvasToTempFilePath({
+					x: x,
+					y: y,
+					width: width,
+					height: height,
+					destWidth: expWidth,
+					destHeight: expHeight,
+					canvasId: 'avatar-canvas',
+					fileType: this.fType,
+					quality: this.qlty,
+					success: (r) => {
+						r = r.tempFilePath;
+						// #ifdef H5
+						this.btop(r).then((r) => {
+							this.$emit("upload", {
+								avatar: this.imgSrc,
+								path: r,
+								index: this.indx,
+								data: this.rtn,
+								base64: this.base64 || null
+							});
+							return;
+						})
+						// #endif
+						// #ifndef H5
+						this.$emit("upload", {
+							avatar: this.imgSrc,
+							path: r,
+							index: this.indx,
+							data: this.rtn,
+							base64: this.base64 || null
+						});
+						// #endif
+					},
+					fail: (res) => {
+						uni.showToast({
+							title: "error1",
+							duration: 2000,
+						})
+					},
+					complete: () => {
+						uni.hideLoading();
+						this.noBar || uni.showTabBar();
+						this.$emit("end");
+					}
+				}, this);
+				// #endif
+			},
+			fPrvUpload() {
+				if (this.fPrvUploading) return;
+				this.fPrvUploading = true;
+				setTimeout(() => {
+					this.fPrvUploading = false;
+				}, 1000)
+
+				let style = this.sS,
+					destWidth = parseInt(style.width),
+					destHeight = parseInt(style.height),
+					prvX = this.prvX,
+					prvY = this.prvY,
+					prvWidth = this.prvWidth,
+					prvHeight = this.prvHeight,
+					expWidth = this.eW || (parseInt(style.width) * this.pixelRatio),
+					expHeight = this.eH || (parseInt(style.height) * this.pixelRatio);
+
+				// #ifdef MP-ALIPAY
+				uni.showLoading();
+				// #endif
+				// #ifndef MP-ALIPAY
+				uni.showLoading({
+					title: '加载中...',
+					mask: true
+				});
+				// #endif
+
+				this.sD = 'none';
+				this.sT = '-10000px';
+				this.hasSel = false;
+				this.fHideImg();
+				// #ifdef MP-ALIPAY
+				this.ccp.toTempFilePath({
+					x: prvX,
+					y: prvY,
+					width: prvWidth,
+					height: prvHeight,
+					destWidth: expWidth,
+					destHeight: expHeight,
+					fileType: this.fType,
+					quality: this.qlty,
+					success: (r) => {
+						r = r.apFilePath;
+						this.$emit("upload", {
+							avatar: this.imgSrc,
+							path: r,
+							index: this.indx,
+							data: this.rtn,
+							base64: this.base64 || null
+						});
+					},
+					fail: () => {
+						uni.showToast({
+							title: "error_prv",
+							duration: 2000,
+						})
+					},
+					complete: () => {
+						uni.hideLoading();
+						this.noBar || uni.showTabBar();
+						this.$emit("end");
+					}
+				});
+				// #endif
+				// #ifndef MP-ALIPAY
+				uni.canvasToTempFilePath({
+					x: prvX,
+					y: prvY,
+					width: prvWidth,
+					height: prvHeight,
+					destWidth: expWidth,
+					destHeight: expHeight,
+					canvasId: 'prv-canvas',
+					fileType: this.fType,
+					quality: this.qlty,
+					success: (r) => {
+						r = r.tempFilePath;
+						// #ifdef H5
+						this.btop(r).then((r) => {
+							this.$emit("upload", {
+								avatar: this.imgSrc,
+								path: r,
+								index: this.indx,
+								data: this.rtn,
+								base64: this.base64 || null
+							});
+						})
+						// #endif
+						// #ifndef H5
+						this.$emit("upload", {
+							avatar: this.imgSrc,
+							path: r,
+							index: this.indx,
+							data: this.rtn,
+							base64: this.base64 || null
+						});
+						// #endif
+					},
+					fail: () => {
+						uni.showToast({
+							title: "error_prv",
+							duration: 2000,
+						})
+					},
+					complete: () => {
+						uni.hideLoading();
+						this.noBar || uni.showTabBar();
+						this.$emit("end");
+					}
+				}, this);
+				// #endif
+			},
+			fDrawInit(ini = false) {
+				let allWidth = this.wW,
+					allHeight = this.wH,
+					imgWidth = this.imgWidth,
+					imgHeight = this.imgHeight,
+					imgRadio = imgWidth / imgHeight,
+					useWidth = allWidth - 40,
+					useHeight = allHeight - tH - 80,
+					useRadio = useWidth / useHeight,
+					sW = parseInt(this.sS.width),
+					sH = parseInt(this.sS.height);
+
+				this.fixWidth = 0;
+				this.fixHeight = 0;
+				this.lckWidth = 0;
+				this.lckHeight = 0;
+				switch (this.stc) {
+					case 'x':
+						this.fixWidth = 1;
+						break;
+					case 'y':
+						this.fixHeight = 1;
+						break;
+					case 'long':
+						if (imgRadio > 1) this.fixWidth = 1;
+						else this.fixHeight = 1;
+						break;
+					case 'short':
+						if (imgRadio > 1) this.fixHeight = 1;
+						else this.fixWidth = 1;
+						break;
+					case 'longSel':
+						if (sW > sH) this.fixWidth = 1;
+						else this.fixHeight = 1;
+						break;
+					case 'shortSel':
+						if (sW > sH) this.fixHeight = 1;
+						else this.fixWidth = 1;
+						break;
+				}
+				switch (this.lck) {
+					case 'x':
+						this.lckWidth = 1;
+						break;
+					case 'y':
+						this.lckHeight = 1;
+						break;
+					case 'long':
+						if (imgRadio > 1) this.lckWidth = 1;
+						else this.lckHeight = 1;
+						break;
+					case 'short':
+						if (imgRadio > 1) this.lckHeight = 1;
+						else this.lckWidth = 1;
+						break;
+					case 'longSel':
+						if (sW > sH) this.lckWidth = 1;
+						else this.lckHeight = 1;
+						break;
+					case 'shortSel':
+						if (sW > sH) this.lckHeight = 1;
+						else this.lckWidth = 1;
+						break;
+				}
+				if (this.fixWidth) {
+					useWidth = sW;
+					useHeight = useWidth / imgRadio;
+				} else if (this.fixHeight) {
+					useHeight = sH;
+					useWidth = useHeight * imgRadio;
+				} else if (imgRadio < useRadio) {
+					if (imgHeight < useHeight) {
+						useWidth = imgWidth;
+						useHeight = imgHeight;
+					} else {
+						useWidth = useHeight * imgRadio;
+					}
+				} else {
+					if (imgWidth < useWidth) {
+						useWidth = imgWidth;
+						useHeight = imgHeight;
+					} else {
+						useHeight = useWidth / imgRadio;
+					}
+				}
+				if (this.isin) {
+					if (useWidth < sW) {
+						useWidth = sW;
+						useHeight = useWidth / imgRadio;
+						this.lckHeight = 0;
+					}
+					if (useHeight < sH) {
+						useHeight = sH;
+						useWidth = useHeight * imgRadio;
+						this.lckWidth = 0;
+					}
+				}
+
+				this.scaleSize = 1;
+				this.rotateDeg = 0;
+				this.posWidth = (allWidth - useWidth) / 2 | 0;
+				this.posHeight = (allHeight - useHeight - tH) / 2 | 0;
+				this.useWidth = useWidth | 0;
+				this.useHeight = useHeight | 0;
+				this.centerX = this.posWidth + useWidth / 2;
+				this.centerY = this.posHeight + useHeight / 2;
+				this.focusX = 0;
+				this.focusY = 0;
+
+				let style = this.sS,
+					left = parseInt(style.left),
+					top = parseInt(style.top),
+					width = parseInt(style.width),
+					height = parseInt(style.height),
+					canvas = this.canvas,
+					canvasOper = this.canvasOper,
+					cc = this.cc,
+					cco = this.cco;
+					
+				cco.beginPath();
+				cco.setLineWidth(3);
+				cco.setGlobalAlpha(1);
+				cco.setStrokeStyle('white');
+				cco.strokeRect(left, top, width, height);
+				
+				cco.setFillStyle('black');
+				cco.setGlobalAlpha(0.5);
+				cco.fillRect(0, 0, this.wW, top);
+				cco.fillRect(0, top, left, height);
+				cco.fillRect(0, top + height, this.wW, this.wH - height - top - tH);
+				cco.fillRect(left + width, top, this.wW - width - left, height);
+				
+				cco.setGlobalAlpha(1);
+				cco.setStrokeStyle('red');
+				cco.moveTo(left+15, top);
+				cco.lineTo(left, top);
+				cco.lineTo(left, top+15);
+				cco.moveTo(left+width-15, top);
+				cco.lineTo(left+width, top);
+				cco.lineTo(left+width, top+15);
+				cco.moveTo(left+15, top+height);
+				cco.lineTo(left, top+height);
+				cco.lineTo(left, top+height-15);
+				cco.moveTo(left+width-15, top+height);
+				cco.lineTo(left+width, top+height);
+				cco.lineTo(left+width, top+height-15);
+				cco.stroke();
+				
+				cco.draw(false, () => {
+					if (ini) {
+						this.sD = 'flex';
+						this.sT = this.drawTop + 'px';
+						this.fDrawImage(true);
+					}
+				});
+				this.$emit("init");
+			},
+			fDrawImage(ini = false) {
+				let tm_now = Date.now();
+				if (tm_now - this.drawTm < 20) return;
+				this.drawTm = tm_now;
+
+				let cc = this.cc,
+					imgWidth = this.useWidth * this.scaleSize,
+					imgHeight = this.useHeight * this.scaleSize;
+
+				// #ifdef MP-ALIPAY	
+				cc.save();
+				// #endif
+				
+				if (this.bgImage) {
+					// #ifdef MP-ALIPAY
+					cc.clearRect(0, 0, this.wW, this.wH - tH);
+					// #endif
+					// #ifndef MP-ALIPAY
+					cc.drawImage(this.bgImage, 0, 0, this.wW, this.wH - tH);
+					// #endif
+				} else {
+					cc.fillRect(0, 0, this.wW, this.wH - tH);
+				}
+
+				if (this.isin) {
+					let cx = this.focusX * (this.scaleSize - 1),
+						cy = this.focusY * (this.scaleSize - 1);
+
+					cc.translate(this.centerX, this.centerY);
+					cc.rotate(this.rotateDeg * Math.PI / 180);
+					cc.drawImage(this.imgPath, this.posWidth-this.centerX-cx, this.posHeight-this.centerY-cy, imgWidth, imgHeight);
+				
+				} else {
+					cc.translate(this.posWidth + imgWidth / 2, this.posHeight + imgHeight / 2);
+					cc.rotate(this.rotateDeg * Math.PI / 180);
+					cc.drawImage(this.imgPath, -imgWidth / 2, -imgHeight / 2, imgWidth, imgHeight);
+				}
+
+				cc.draw(false);
+
+				// #ifdef MP-ALIPAY
+				cc.restore();
+				// #endif
+			},
+			fPreview() {
+				if (this.fPreviewing) return;
+				this.fPreviewing = true;
+				setTimeout(() => {
+					this.fPreviewing = false;
+				}, 1000);
+
+				let style = this.sS,
+					x = parseInt(style.left),
+					y = parseInt(style.top),
+					width = parseInt(style.width),
+					height = parseInt(style.height);
+
+				// #ifdef MP-ALIPAY
+				uni.showLoading();
+				// #endif
+				// #ifndef MP-ALIPAY
+				uni.showLoading({
+					title: '加载中...',
+					mask: true
+				});
+				// #endif
+
+				// #ifdef MP-ALIPAY
+				this.cc.toTempFilePath({
+					x: x,
+					y: y,
+					width: width,
+					height: height,
+					expWidth: width * this.pixelRatio,
+					expHeight: height * this.pixelRatio,
+					fileType: this.fType,
+					quality: this.qlty,
+					success: (r) => {
+						this.prvImgTmp = r = r.apFilePath;
+						let ccp = this.ccp,
+							prvX = this.wW,
+							prvY = parseInt(this.csH),
+							prvWidth = parseInt(this.sS.width),
+							prvHeight = parseInt(this.sS.height),
+							useWidth = prvX - 40,
+							useHeight = prvY - 80,
+							radio = useWidth / prvWidth,
+							rHeight = prvHeight * radio;
+						if (rHeight < useHeight) {
+							prvWidth = useWidth;
+							prvHeight = rHeight;
+						} else {
+							radio = useHeight / prvHeight;
+							prvWidth *= radio;
+							prvHeight = useHeight;
+						}
+						ccp.fillRect(0, 0, prvX, prvY);
+						this.prvX = prvX = ((prvX - prvWidth) / 2) | 0;
+						this.prvY = prvY = ((prvY - prvHeight) / 2) | 0;
+						this.prvWidth = prvWidth = prvWidth | 0;
+						this.prvHeight = prvHeight = prvHeight | 0;
+						ccp.drawImage(r, prvX, prvY, prvWidth, prvHeight);
+						ccp.draw(false);
+
+						this.sO = false;
+						this.pT = '0';
+					},
+					fail: () => {
+						uni.showToast({
+							title: "error2",
+							duration: 2000,
+						})
+					},
+					complete: () => {
+						uni.hideLoading();
+					}
+				});
+				// #endif
+
+				// #ifndef MP-ALIPAY
+				uni.canvasToTempFilePath({
+					x: x,
+					y: y,
+					width: width,
+					height: height,
+					expWidth: width * this.pixelRatio,
+					expHeight: height * this.pixelRatio,
+					canvasId: 'avatar-canvas',
+					fileType: this.fType,
+					quality: this.qlty,
+					success: (r) => {
+						this.prvImgTmp = r = r.tempFilePath;
+
+						let ccp = this.ccp,
+							prvX = this.wW,
+							prvY = parseInt(this.csH);
+
+						// #ifndef H5||MP-WEIXIN||APP-PLUS
+						prvY += tH;
+						// #endif
+						// #ifdef APP-PLUS
+						if (this.platform === 'android') {
+							prvY += tH;
+						}
+						// #endif
+
+						let prvWidth = parseInt(this.sS.width),
+							prvHeight = parseInt(this.sS.height),
+							useWidth = prvX - 40,
+							useHeight = prvY - 80,
+							radio = useWidth / prvWidth,
+							rHeight = prvHeight * radio;
+						if (rHeight < useHeight) {
+							prvWidth = useWidth;
+							prvHeight = rHeight;
+						} else {
+							radio = useHeight / prvHeight;
+							prvWidth *= radio;
+							prvHeight = useHeight;
+						}
+
+						ccp.fillRect(0, 0, prvX, prvY);
+						this.prvX = prvX = ((prvX - prvWidth) / 2) | 0;
+						this.prvY = prvY = ((prvY - prvHeight) / 2) | 0;
+						this.prvWidth = prvWidth = prvWidth | 0;
+						this.prvHeight = prvHeight = prvHeight | 0;
+						ccp.drawImage(r, prvX, prvY, prvWidth, prvHeight);
+						ccp.draw(false);
+
+						// #ifdef H5
+						this.btop(r).then((r) => {
+							this.sO = false;
+							this.pT = this.drawTop + 'px';
+						})
+						// #endif
+						
+						this.sO = false; 
+						// if (this.platform === 'android') this.sO = false;
+						this.pT = this.drawTop + 'px';
+					},
+					fail: () => {
+						uni.showToast({
+							title: "error2",
+							duration: 2000,
+						})
+					},
+					complete: () => {
+						uni.hideLoading();
+					}
+				}, this);
+				// #endif
+			},
+			fChooseImg(index = undefined, params = undefined, data = undefined) {
+				if (params) {
+					let sW = params.selWidth,
+						sH = params.selHeight,
+						expWidth = params.expWidth,
+						expHeight = params.expHeight,
+						quality = params.quality,
+						canRotate = params.canRotate,
+						canScale = params.canScale,
+						minScale = params.minScale,
+						maxScale = params.maxScale,
+						stretch = params.stretch,
+						fileType = params.fileType,
+						inner = params.inner,
+						lock = params.lock;
+
+					expWidth && (this.eW = expWidth.toString().indexOf('upx') >= 0 ? parseInt(expWidth) * this.pxRatio : parseInt(
+						expWidth));
+					expHeight && (this.eH = expHeight.toString().indexOf('upx') >= 0 ? parseInt(expHeight) * this.pxRatio : parseInt(
+						expHeight));
+					this.letRotate = (canRotate === false || inner === true || inner === 'true' || canRotate === 'false') ? 0 : 1;
+					this.letScale = (canScale === false || canScale === 'false') ? 0 : 1;
+					this.qlty = parseFloat(quality) || 1;
+					this.mnScale = parseFloat(minScale) || 0.3;
+					this.mxScale = parseFloat(maxScale) || 4;
+					this.stc = stretch;
+					this.isin = (inner === true || inner === 'true') ? 1 : 0;
+					this.fType = fileType === 'jpg' ? 'jpg' : 'png';
+					this.lck = lock;
+					if (this.isin||!this.letRotate) {
+						this.bW = '24%';
+						this.bD = 'none';
+					} else {
+						this.bW = '19%';
+						this.bD = 'flex';
+					}
+
+					if (sW && sH) {
+						sW = sW.toString().indexOf('upx') >= 0 ? parseInt(sW) * this.pxRatio : parseInt(sW);
+						sH = sH.toString().indexOf('upx') >= 0 ? parseInt(sH) * this.pxRatio : parseInt(sH);
+						this.sS.width = sW + 'px';
+						this.sS.height = sH + 'px';
+						this.sS.top = ((this.wH - sH - tH)|0) / 2 + 'px';
+						this.sS.left = ((this.wW - sW)|0) / 2 + 'px';
+						this.hasSel = true;
+					}
+				}
+				this.rtn = data;
+				this.indx = index;
+				this.fSelect();
+			},
+			fRotate() {
+				this.rotateDeg += 90 - this.rotateDeg % 90;
+				this.fDrawImage();
+			},
+			fStart(e) {
+				let touches = e.touches,
+					touch0 = touches[0],
+					touch1 = touches[1];
+
+				this.touch0 = touch0;
+				this.touch1 = touch1;
+
+				if (touch1) {
+					let x = touch1.x - touch0.x,
+						y = touch1.y - touch0.y;
+					this.fgDistance = Math.sqrt(x * x + y * y);
+				}
+			},
+			fMove(e) {
+				let touches = e.touches,
+					touch0 = touches[0],
+					touch1 = touches[1];
+
+				if (touch1) {
+					let x = touch1.x - touch0.x,
+						y = touch1.y - touch0.y,
+						fgDistance = Math.sqrt(x * x + y * y),
+						scaleSize = 0.005 * (fgDistance - this.fgDistance),
+						beScaleSize = this.scaleSize + scaleSize;
+
+					do {
+						if (!this.letScale) break;
+						if (beScaleSize < this.mnScale) break;
+						if (beScaleSize > this.mxScale) break;
+
+						let growX = this.useWidth * scaleSize / 2,
+							growY = this.useHeight * scaleSize / 2;
+						if (this.isin) {
+							let imgWidth = this.useWidth * beScaleSize,
+								imgHeight = this.useHeight * beScaleSize,
+								l = this.posWidth - growX,
+								t = this.posHeight - growY,
+								r = l + imgWidth,
+								b = t + imgHeight,
+								left = parseInt(this.sS.left),
+								top = parseInt(this.sS.top),
+								width = parseInt(this.sS.width),
+								height = parseInt(this.sS.height),
+								right = left + width,
+								bottom = top + height,
+								cx, cy;
+
+							if (imgWidth <= width || imgHeight <= height) break;
+							this.cx = cx = this.focusX * beScaleSize - this.focusX,
+								this.cy = cy = this.focusY * beScaleSize - this.focusY;
+							this.posWidth -= growX;
+							this.posHeight -= growY;
+							if (this.posWidth - cx > left) {
+								this.posWidth = left + cx;
+							}
+							if (this.posWidth + imgWidth - cx < right) {
+								this.posWidth = right - imgWidth + cx;
+							}
+							if (this.posHeight - cy > top) {
+								this.posHeight = top + cy;
+							}
+							if (this.posHeight + imgHeight - cy < bottom) {
+								this.posHeight = bottom - imgHeight + cy;
+							}
+						} else {
+							this.posWidth -= growX;
+							this.posHeight -= growY;
+						}
+
+						this.scaleSize = beScaleSize;
+					} while (0);
+					this.fgDistance = fgDistance;
+					if (touch1.x !== touch0.x && this.letRotate) {
+						x = (this.touch1.y - this.touch0.y) / (this.touch1.x - this.touch0.x);
+						y = (touch1.y - touch0.y) / (touch1.x - touch0.x);
+						this.rotateDeg += Math.atan((y - x) / (1 + x * y)) * 180 / Math.PI;
+						this.touch0 = touch0;
+						this.touch1 = touch1;
+					}
+
+					this.fDrawImage();
+				} else if (this.touch0) {
+					let x = touch0.x - this.touch0.x,
+						y = touch0.y - this.touch0.y,
+						beX = this.posWidth + x,
+						beY = this.posHeight + y;
+					if (this.isin) {
+						let imgWidth = this.useWidth * this.scaleSize,
+							imgHeight = this.useHeight * this.scaleSize,
+							l = beX,
+							t = beY,
+							r = l + imgWidth,
+							b = t + imgHeight,
+							left = parseInt(this.sS.left),
+							top = parseInt(this.sS.top),
+							right = left + parseInt(this.sS.width),
+							bottom = top + parseInt(this.sS.height),
+							cx, cy;
+
+						this.cx = cx = this.focusX * this.scaleSize - this.focusX;
+						this.cy = cy = this.focusY * this.scaleSize - this.focusY;
+
+						if (!this.lckWidth && Math.abs(x) < 100) {
+							if (left < l - cx) {
+								this.posWidth = left + cx;
+							} else if (right > r - cx) {
+								this.posWidth = right - imgWidth + cx;
+							} else {
+								this.posWidth = beX;
+								this.focusX -= x;
+							}
+						}
+						if (!this.lckHeight && Math.abs(y) < 100) {
+							if (top < t - cy) {
+								this.focusY -= (top + cy - this.posHeight);
+								this.posHeight = top + cy;
+							} else if (bottom > b - cy) {
+								this.focusY -= (bottom + cy - (this.posHeight + imgHeight));
+								this.posHeight = bottom - imgHeight + cy;
+							} else {
+								this.posHeight = beY;
+								this.focusY -= y;
+							}
+						}
+					} else {
+						if (Math.abs(x) < 100 && !this.lckWidth) this.posWidth = beX;
+						if (Math.abs(y) < 100 && !this.lckHeight) this.posHeight = beY;
+						this.focusX -= x;
+						this.focusY -= y;
+					}
+
+					this.touch0 = touch0;
+					this.fDrawImage();
+				}
+			},
+			fEnd(e) {
+				let touches = e.touches,
+					touch0 = touches && touches[0],
+					touch1 = touches && touches[1];
+				if (touch0) {
+					this.touch0 = touch0;
+				} else {
+					this.touch0 = null;
+					this.touch1 = null;
+				}
+			},
+			fHideImg() {
+				this.prvImg = '';
+				this.pT = '-10000px';
+				this.sO = true;
+				this.prvImgData = null;
+				this.target = null;
+			},
+			fClose() {
+				this.sD = 'none';
+				this.sT = '-10000px';
+				this.hasSel = false;
+				this.fHideImg();
+				this.noBar || uni.showTabBar();
+				this.$emit("end");
+			},
+			fGetImgData() {
+				return new Promise((resolve, reject) => {
+					let prvX = this.prvX,
+						prvY = this.prvY,
+						prvWidth = this.prvWidth,
+						prvHeight = this.prvHeight;
+					// #ifdef MP-ALIPAY
+					this.ccp.getImageData({
+						x: prvX,
+						y: prvY,
+						width: prvWidth,
+						height: prvHeight,
+						success(res) {
+							resolve(res.data);
+						},
+						fail(err) {
+							reject(err);
+						}
+					}, this);
+					// #endif
+					// #ifndef MP-ALIPAY
+					uni.canvasGetImageData({
+						canvasId: 'prv-canvas',
+						x: prvX,
+						y: prvY,
+						width: prvWidth,
+						height: prvHeight,
+						success(res) {
+							resolve(res.data);
+						},
+						fail(err) {
+							reject(err);
+						}
+					}, this);
+					// #endif
+				});
+			},
+			async fColorChange(e) {
+				let tm_now = Date.now();
+				if (tm_now - this.prvTm < 100) return;
+				this.prvTm = tm_now;
+
+				// #ifdef MP-ALIPAY
+				uni.showLoading();
+				// #endif
+				// #ifndef MP-ALIPAY
+				uni.showLoading({
+					title: '加载中...',
+					mask: true
+				});
+				// #endif
+
+				if (!this.prvImgData) {
+					if (!(this.prvImgData = await this.fGetImgData().catch(() => {
+							uni.showToast({
+								title: "error_read",
+								duration: 2000,
+							})
+						}))) return;
+
+					this.target = new Uint8ClampedArray(this.prvImgData.length);
+				}
+
+				let data = this.prvImgData,
+					target = this.target,
+					i = e.detail.value,
+					r, g, b, a, h, s, l, d, p, q, t, min, max, hK, tR, tG, tB;
+
+				if (i === 0) {
+					target = data;
+				} else {
+					i = (i + 100) / 200;
+					if (i < 0.005) i = 0;
+					if (i > 0.995) i = 1;
+					for (let n = data.length - 1; n >= 0; n -= 4) {
+						r = data[n - 3] / 255;
+						g = data[n - 2] / 255;
+						b = data[n - 1] / 255;
+						max = Math.max(r, g, b);
+						min = Math.min(r, g, b);
+						d = max - min;
+						if (max === min) {
+							h = 0;
+						} else if (max === r && g >= b) {
+							h = 60 * ((g - b) / d);
+						} else if (max === r && g < b) {
+							h = 60 * ((g - b) / d) + 360;
+						} else if (max === g) {
+							h = 60 * ((b - r) / d) + 120;
+						} else if (max === b) {
+							h = 60 * ((r - g) / d) + 240;
+						}
+						l = (max + min) / 2;
+						if (l === 0 || max === min) {
+							s = 0;
+						} else if (0 < l && l <= 0.5) {
+							s = d / (2 * l);
+						} else if (l > 0.5) {
+							s = d / (2 - 2 * l);
+						}
+						data[n] && (a = data[n]);
+
+						if (i < 0.5) {
+							s = s * i / 0.5;
+						} else if (i > 0.5) {
+							s = 2 * s + 2 * i - (s * i / 0.5) - 1;
+						}
+
+						if (s === 0) {
+							r = g = b = Math.round(l * 255);
+						} else {
+							if (l < 0.5) {
+								q = l * (1 + s);
+							} else if (l >= 0.5) {
+								q = l + s - (l * s);
+							}
+							p = 2 * l - q;
+							hK = h / 360;
+							tR = hK + 1 / 3;
+							tG = hK;
+							tB = hK - 1 / 3;
+							let correctRGB = (t) => {
+								if (t < 0) {
+									return t + 1.0;
+								}
+								if (t > 1) {
+									return t - 1.0;
+								}
+								return t;
+							};
+							let createRGB = (t) => {
+								if (t < (1 / 6)) {
+									return p + ((q - p) * 6 * t);
+								} else if (t >= (1 / 6) && t < (1 / 2)) {
+									return q;
+								} else if (t >= (1 / 2) && t < (2 / 3)) {
+									return p + ((q - p) * 6 * ((2 / 3) - t));
+								}
+								return p;
+							};
+							r = tR = Math.round(createRGB(correctRGB(tR)) * 255);
+							g = tG = Math.round(createRGB(correctRGB(tG)) * 255);
+							b = tB = Math.round(createRGB(correctRGB(tB)) * 255);
+						}
+						a && (target[n] = a);
+						target[n - 3] = r;
+						target[n - 2] = g;
+						target[n - 1] = b;
+					}
+				}
+
+				let prvX = this.prvX,
+					prvY = this.prvY,
+					prvWidth = this.prvWidth,
+					prvHeight = this.prvHeight;
+
+				// #ifdef MP-ALIPAY
+				this.ccp.putImageData({
+					x: prvX,
+					y: prvY,
+					width: prvWidth,
+					height: prvHeight,
+					data: target,
+					fail() {
+						uni.showToast({
+							title: 'error_put',
+							duration: 2000
+						})
+					},
+					complete() {
+						uni.hideLoading();
+					}
+				}, this);
+				// #endif
+
+				// #ifndef MP-ALIPAY
+				uni.canvasPutImageData({
+					canvasId: 'prv-canvas',
+					x: prvX,
+					y: prvY,
+					width: prvWidth,
+					height: prvHeight,
+					data: target,
+					fail() {
+						uni.showToast({
+							title: 'error_put',
+							duration: 2000
+						})
+					},
+					complete() {
+						uni.hideLoading();
+					}
+				}, this);
+				// #endif
+			},
+			btop(base64) {
+				this.base64 = base64;
+				return new Promise(function(resolve, reject) {
+					var arr = base64.split(','),
+						mime = arr[0].match(/:(.*?);/)[1],
+						bstr = atob(arr[1]),
+						n = bstr.length,
+						u8arr = new Uint8Array(n);
+					while (n--) {
+						u8arr[n] = bstr.charCodeAt(n);
+					}
+					return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([u8arr], {
+						type: mime
+					})));
+				});
+			},
+		}
+	}
+</script>
+
+<style>
+	.my-canvas {
+		display: flex;
+		position: fixed !important;
+		background: #000000;
+		left: 0;
+		z-index: 100000;
+		width: 100%;
+	}
+
+	.my-avatar {
+		width: 150upx;
+		height: 150upx;
+		border-radius: 100%;
+	}
+
+	.oper-canvas {
+		display: flex;
+		position: fixed !important;
+		left: 0;
+		z-index: 100001;
+		width: 100%;
+	}
+
+	.prv-canvas {
+		display: flex;
+		position: fixed !important;
+		background: #000000;
+		left: 0;
+		z-index: 200000;
+		width: 100%;
+	}
+
+	.oper-wrapper {
+		height: 50px;
+		position: fixed !important;
+		box-sizing: border-box;
+		border: 1px solid #F1F1F1;
+		background: #ffffff;
+		width: 100%;
+		left: 0;
+		bottom: 0;
+		z-index: 100009;
+		flex-direction: row;
+	}
+
+	.oper {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		padding: 10upx 20upx;
+		width: 100%;
+		height: 100%;
+		box-sizing: border-box;
+		align-self: center;
+	}
+
+	.btn-wrapper {
+		display: flex;
+		flex-direction: row;
+		/* #ifndef H5 */
+		flex-grow: 1;
+		/* #endif */
+		/* #ifdef H5 */
+		height: 50px;
+		/* #endif */
+		justify-content: space-between;
+	}
+
+	.btn-wrapper view {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-size: 16px;
+		color: #333;
+		border: 1px solid #f1f1f1;
+		border-radius: 6%;
+	}
+
+	.hover {
+		background: #f1f1f1;
+		border-radius: 6%;
+	}
+
+	.clr-wrapper {
+		display: flex;
+		flex-direction: row;
+		flex-grow: 1;
+	}
+
+	.clr-wrapper view {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-size: 16px;
+		color: #333;
+		border: 1px solid #f1f1f1;
+		border-radius: 6%;
+	}
+
+	.my-slider {
+		flex-grow: 1;
+	}
+</style>

main.js

@@ -9,7 +9,8 @@ const app = new Vue({
     ...App
 })
 
-
+import cuCustom from './lib/colorui/components/cu-custom.vue'
+Vue.component('cu-custom',cuCustom)
 
 // 引入文件
 import Dever from './lib/dever'

manifest.json

@@ -1,5 +1,5 @@
 {
-    "name" : "云境",
+    "name" : "幻境",
     "appid" : "__UNI__10C3233",
     "description" : "",
     "versionName" : "1.0.0",
@@ -49,8 +49,7 @@
             },
             /* ios打包配置 */
             "ios" : {
-                "UIBackgroundModes" : "audio,location"
-				
+                "UIBackgroundModes" : "audio,location"
             },
             /* SDK配置 */
             "sdkConfigs" : {}

pages.json

@@ -90,19 +90,31 @@
 		    		"navigationStyle": "custom"
 		    	}
 		    }
+		},
+		{
+		    "path" : "pages/chat/user",
+		    "style": {
+		    	"app-plus": {
+		    		"titleNView": false,
+		    		"bounce": "none",
+		    		"navigationStyle": "custom"
+		    	},
+				"enablePullDownRefresh" : false
+		    }
 		}
     ],
 	"globalStyle": {
 		"navigationBarTextStyle": "white",
-		"navigationBarBackgroundColor": "#3c64c9",
-		"navigationBarTitleText" : "云店",
+		"navigationBarBackgroundColor": "#0081ff",
+		"navigationBarTitleText" : "幻境",
 		"enablePullDownRefresh": true,
 		"scrollIndicator": "none",
-		"navigationStyle": "default",
+		"navigationStyle": "custom",
+		"navigationBarTextStyle": "white",
 		"app-plus": {
 			"pullToRefresh": {
 				"support": true,
-				"color": "#3c64c9",
+				"color": "#0081ff",
 				"style": "default"
 			}
 		}

pages/chat/user.vue

@@ -0,0 +1,200 @@
+<template>
+	<view>
+		<cu-custom :bgColor="fetch.bgcolor" :isBack="true"><block slot="backText">返回</block><block slot="content">{{fetch.title}}</block></cu-custom>
+		<view class="cu-chat">
+			<graceLoading :loadingType="loadingType"></graceLoading>
+			<block v-for="(v, k) in fetch.chat" :key="k">
+				<view class="cu-item self" v-if="v.self">
+					<view class="main">
+						<view class="content bg-green shadow" v-if="v.text">
+							<text>{{v.text}}</text>
+						</view>
+						<view v-if="v.pic">
+							<image @click="Dever.viewPic(pic, v.pic)" :src="v.pic" class="radius chat-pic" mode="widthFix"></image>
+						</view>
+					</view>
+					<view class="cu-avatar radius" :style="{backgroundImage:'url('+fetch.user[v.uid].avatar+')'}" @click="Dever.viewPic([fetch.user[v.uid].avatar], fetch.user[v.uid].avatar)"></view>
+					<view class="date">{{v.date}}</view>
+				</view>
+				<view class="cu-item" v-if="!v.self">
+					<view class="cu-avatar radius" :style="{backgroundImage:'url('+fetch.user[v.uid].avatar+')'}" @click="Dever.viewPic([fetch.user[v.uid].avatar], fetch.user[v.uid].avatar)"></view>
+					<view class="main">
+						<view class="content shadow" v-if="v.text">
+							<text>{{v.text}}</text>
+						</view>
+						<view v-if="v.pic">
+							<image @click="Dever.viewPic(pic, v.pic)" :src="v.pic" class="radius chat-pic" mode="widthFix"></image>
+						</view>
+					</view>
+					<view class="date">{{v.date}}</view>
+				</view>
+			</block>
+		</view>
+
+		<view class="cu-bar foot input" :style="[{bottom:InputBottom+'px'}]">
+			<view class="action" style="display:none;">
+				<text class="cuIcon-sound text-grey"></text>
+			</view>
+			<view class="action" @click="upload">
+				<text class="cuIcon-picfill text-grey"></text>
+			</view>
+			<input class="solid-bottom" :adjust-position="false" :focus="false" maxlength="300" cursor-spacing="10"
+			 @focus="InputFocus" @blur="InputBlur" v-model="msg"></input>
+			<view class="action" style="display:none;">
+				<text class="cuIcon-emojifill text-grey"></text>
+			</view>
+			<button class="cu-btn bg-green shadow" @click="send()">发送</button>
+		</view>
+		<graceFixedMsg v-if="noticeShow" :msg="notice" :width="280" @tapme="noticeClick" :bottom="120"></graceFixedMsg>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				InputBottom: 0,
+				uid : 0,
+				msg : '',
+				fetch : {
+					chat : [],
+					bgcolor : '',
+					title : '聊天',
+				},
+				loadingType: 1,
+				bottomState : false,
+				pic : [],
+				notice : '',
+				noticeShow : false,
+			};
+		},
+		onLoad(option) {
+			this.uid = option.uid;
+			this.fetch.title = option.title;
+			this.Dever.config.code = option.code;
+			this.im();
+			this.getInfo(1);
+		},
+		onHide() {
+			
+		},
+		onPageScroll(e) {
+			if (e.scrollTop == 0 && this.loadingType != 2) {
+				this.bottomState = false;
+				this.loadingType = 1;
+				this.getInfo(2);
+			}
+		},
+		onReachBottom() {
+			this.bottomState = true;
+		},
+		methods: {
+			InputFocus(e) {
+				this.InputBottom = e.detail.height
+			},
+			InputBlur(e) {
+				this.InputBottom = 0
+			},
+			
+			im : function() {
+				var self = this;
+				this.Dever.im(false, function(t) {
+					if (t.type == 'init') {
+						self.Dever.post('app/community/?l=chat.init', {code:self.Dever.config.code, client_id: t.client_id, uid:self.uid, noloading:1});
+					} else if (t.type == 'ping') {
+						
+					} else if (t.type == 'msg') {
+						self.add(t, 2);
+					}
+				});
+			},
+			getInfo : function(page) {
+				var self = this;
+				if (self.loadingType == 2) {
+					return;
+				}
+				this.Dever.page([page,'chat'], this, 'app/community/?l=chat.getList', {code:this.Dever.config.code, uid: this.uid, noloading:1, concat:-1}, function(t) {
+					if (t.chat) {
+						for (var i in t.chat) {
+							if (t.chat[i].pic) {
+								self.pic.push(t.chat[i].pic);
+							}
+						}
+					}
+					if (self.Dever.pageData.status == 0) {
+						self.loadingType = 2;
+					} else {
+						self.loadingType = 3;
+					}
+					if (page == 1) {
+						self.bottom();
+					}
+				});
+			},
+			
+			send : function(pic) {
+				var self = this;
+				var data = {};
+				data.code = this.Dever.config.code;
+				data.uid = this.uid;
+				data.noloading = 1;
+				if (!pic) {
+					data.msg = this.msg;
+				} else {
+					data.pic = pic;
+				}
+				self.Dever.post('app/community/?l=chat.send', data, function(t) {
+					self.msg = '';
+					self.add(t.msg, 1);
+				});
+			},
+			
+			add : function(t, type) {
+				if (t.pic) {
+					this.pic.push(t.pic);
+				}
+				this.fetch.chat.push(t);
+				if (type == 1 || this.bottomState) {
+					this.bottom();
+				} else {
+					this.notice = '你有新的消息';
+					this.noticeShow = true;
+				}
+			},
+			noticeClick : function() {
+				this.noticeShow = false;
+				this.bottom();
+			},
+			upload : function() {
+				var self = this;
+				this.Dever.upload('pic', 1, function(type, file) {
+					self.send(file);
+				});
+			},
+			bottom : function() {
+				var self = this;
+				setTimeout(() => {	
+					var query = uni.createSelectorQuery();
+					query.select('.cu-chat').boundingClientRect();
+					query.exec((res) => {
+						var height = res[0].height + res[0].bottom;
+						self.bottomState = true;
+						uni.pageScrollTo({
+							scrollTop: height,
+							duration: 50
+						});
+					})
+				});
+			}
+		}
+	}
+</script>
+
+<style>
+page{
+  padding-bottom: 100upx;
+}
+.chat-pic {
+	width: 150rpx;
+}
+</style>

pages/dream/func/my.vue

@@ -3,15 +3,16 @@
 		<view class="grace-list">
 			<view class="grace-list-items">
 				<view class="grace-list-image ucenter-face grace-relative">
-					<image class="grace-list-image ucenter-face-image" :src="fetch.user.avatar" mode="widthFix"></image>
+					<image class="grace-list-image ucenter-face-image" :src="fetch.user.avatar" mode="widthFix" @click="avatarSet(0)"></image>
+					<avatar @upload="avatarUpload" ref="avatar"></avatar>
 				</view>
 				<view class="grace-list-body">
 					<view class="grace-list-title">
-						<text class="grace-list-title-text">{{fetch.user.username}}</text>
+						<text class="grace-list-title-text">{{fetch.user.username}}<text v-if="fetch.user.title" style="margin-left:10rpx">({{fetch.user.title}})</text> </text>
 					</view>
-					<view class="grace-list-body-desc">{{fetch.user.desc}}</view>
+					<view class="grace-list-body-desc">{{fetch.user.info}}</view>
 				</view>
-				<text class="grace-list-arrow-right grace-icons icon-arrow-right"></text>
+				<text class="grace-list-arrow-right grace-icons icon-arrow-right" style="display:none;"></text>
 			</view>
 		</view>
 		<view class="ucenter-line"></view>
@@ -19,14 +20,92 @@
 			<graceBoxBanner :items="fetch.num"></graceBoxBanner>
 		</view>
 		<view class="ucenter-line"></view>
-		<view class="grace-list grace-margin-top">
-			<shop ref="shop" :index="index" :content_id="content_id" :width="width"></shop>
+		<view class="grace-list grace-margin-top">
+			<view class="card-bottom">
+				<!-- 顶部分页栏 -->
+				<view class="top-tab">
+					<view :class="['tab-item flex-center', activeTab == k ? 'active' : '']" @tap="handleTab(k)" v-for="(v, k) in cate" :key="k">{{ v }}</view>
+				</view>
+				<view class="scroll-wrapper">
+					<view class="margin-bottom">
+						<view class="cu-list menu-avatar" v-if="activeTab == 2">
+							<view class="cu-item " v-for="(v, k) in fetch.order" :key="k">
+								<view class="cu-avatar radius lg" :style="{backgroundImage:'url('+v.pic+')'}"></view>
+								<view class="content">
+									<view class="text-pink"><view class="text-cut">{{v.name}}</view></view>
+									<view class="text-gray text-sm flex"> <view class="text-cut">{{v.date}}</view></view>
+								</view>
+								<view class="action">
+									<view class="text-grey text-xs">{{v.price}}</view>
+									<view class="cu-tag round bg-red sm" v-if="v.status == 1">{{v.status_name}}</view>
+									<view class="cu-tag round bg-blue sm" v-if="v.status == 2">{{v.status_name}}</view>
+									<view class="cu-tag round bg-black sm" v-if="v.status == 3">{{v.status_name}}</view>
+								</view>
+							</view>
+						</view>
+						
+						<view class="cu-list menu-avatar" v-if="activeTab == 1">
+							<view class="cu-item" v-for="(v, k) in fetch.chat" :key="k" @click="goChat(v.uid, v.user.username)">
+								<view class="cu-avatar round lg" :style="{backgroundImage:'url('+v.user.avatar+')'}">
+									<view class="cu-tag badge" style="display:none;">99+</view>
+								</view>
+								<view class="content">
+									<view class="text-grey">
+										<view class="text-cut">{{v.user.username}}</view>
+										<view class="cu-tag round bg-orange sm" v-if="v.user.title">{{v.user.title}}</view>
+									</view>
+									<view class="text-gray text-sm flex" v-if="v.chat.text">
+										<view class="text-cut">
+											{{v.chat.text}}
+										</view>
+									</view>
+								</view>
+								<view class="action" style="width: auto;">
+									<view class="cu-tag round text-grey sm">{{v.chat.day}}</view>
+									<view class="text-grey text-xs">{{v.chat.date}}</view>
+								</view>
+							</view>
+						</view>
+						
+						<view class="cu-list menu-avatar" v-if="activeTab == 0">
+							<form @submit="formSubmit" class="grace-form grace-margin-top">
+								<view class="grace-form-item grace-border-b">
+									<text class="grace-form-label">昵称</text>
+									<view class="grace-form-body">
+										<input type="text" class="grace-form-input" name="name" placeholder="请填写有趣儿的昵称" v-model="fetch.user.username"></input>
+									</view>
+								</view>
+								
+								<view class="grace-form-item grace-border-b">
+									<text class="grace-form-label">头衔</text>
+									<view class="grace-form-body">
+										<input type="text" class="grace-form-input" name="title" placeholder="请填写头衔" v-model="fetch.user.title"></input>
+									</view>
+								</view>
+								
+								<view class="grace-form-item grace-border-b">
+									<text class="grace-form-label">签名</text>
+									<view class="grace-form-body">
+										<input type="text" class="grace-form-input" name="info" placeholder="请填写签名" v-model="fetch.user.info"></input>
+									</view>
+								</view>
+								
+								<view style="padding:30rpx 0;">
+									<button formType="submit" type="primary" class="grace-button grace-border-radius">保存</button>
+								</view>
+							</form>
+						</view>
+					</view>
+				</view>
+			</view>
+			
 		</view>
 	</view>
 </template>
 
 <script>
-import shop from "@/pages/dream/func/shop.vue";
+var  graceChecker = require("@/lib/graceUI/jsTools/graceChecker.js");
+import avatar from "@/lib/yq-avatar/yq-avatar.vue";
 export default {
 	name: "cate",
 	props: {
@@ -45,14 +124,18 @@ export default {
     	return {
 			fetch : {
 				user : {},
-				num : [],
-			},
-			items: [
-				['￥199', '', '钱包'],
-				[80, '', '金币'],
-				[100, '', '好友'],
-				[50, '', '动态'],
-			]
+				num : [
+					['￥0', '', '--'],
+					[0, '', '--'],
+				],
+				order : [],
+				chat : [],
+			},
+			activeTab : 0,
+			cate : [
+				'信息', '交流', '买过'
+			],
+			openAvatar : false
 		}
     },
 	mounted() {
@@ -60,15 +143,79 @@ export default {
 	},
 	methods:{
 		getData : function() {
+			if (this.openAvatar) {
+				return;
+			} else {
+				uni.stopPullDownRefresh();
+			}
 			var self = this;
-			this.Dever.get(this, 'app/collection/?l=api.getUser', {code:this.Dever.config.code, content_id:this.content_id,noloading:1});
+			this.Dever.get(this, 'app/collection/?l=user.get', {code:this.Dever.config.code, noloading:1});
+			this.handleTab(this.activeTab);
 		},
 		getInfo : function(t) {
-			//触底刷新
-		},
+			//触底刷新
+			this.handleTab(this.activeTab, 2);
+		},
+		getOrder : function(page) {
+			this.Dever.page([page,'order'], this, 'app/collection/?l=user.order', {code:this.Dever.config.code, noloading:1});
+		},
+		getCommunity : function(page) {
+			this.Dever.page([page,'chat'], this, 'app/collection/?l=user.community', {code:this.Dever.config.code, noloading:1});
+		},
+		goChat : function(uid, username) {
+			this.Dever.location('chat/user?uid=' + uid + '&code=' + this.Dever.config.code + '&title=' + username);
+		},
+		handleTab : function(k, t) {
+			this.activeTab = k;
+			if (!t) {
+				t = 1;
+			}
+			if (k == 2) {
+				this.getOrder(t);
+			} else if(k == 1) {
+				this.getCommunity(t);
+			}
+		},
+		// 表单提交
+		formSubmit : function(e) {
+			var self = this;
+			var rule = [
+				{ name: "name", checkType: "string", checkRule: "1,10", errorMsg: "昵称应为1-20个字符" },
+			];
+			var formData = e.detail.value;
+			var checkRes = graceChecker.check(formData, rule);
+			if (checkRes) {
+				formData.code = this.Dever.config.code;
+				this.Dever.post('app/collection/?l=user.up', formData, function(t) {
+					self.Dever.alert('保存成功');
+				});
+			} else {
+				self.Dever.alert(graceChecker.error);
+			}
+		},
+		avatarUpload : function(e) {
+			var self = this;
+			this.openAvatar = false;
+			
+			this.Dever.uploadFile(e.path, 'avatar', 1, function(type, file) {
+				self.fetch.user.avatar = file;
+				self.Dever.post('app/collection/?l=user.upAvatar', {avatar:file, noloading:1});
+			});
+		},
+		avatarSet : function(index) {
+			this.openAvatar = true;
+			this.$refs.avatar.fChooseImg(index,{
+				selWidth: "300rpx", selHeight: "300rpx",
+				expWidth: '260rpx', expHeight: '260rpx',
+				avatarSrc : this.fetch.user.avatar,
+				bgImage : this.fetch.user.avatar,
+				noTab : true,
+				
+			});
+		}
 	},
 	components:{
-		shop
+		avatar
 	}
 }
 </script>
@@ -76,5 +223,36 @@ export default {
 <style>
 .ucenter-face{width:100rpx !important; height:100rpx !important;}
 .ucenter-face-image{width:100rpx !important; height:100rpx !important;}
-.ucenter-line{height:12rpx; background-color:#F4F5F6; margin:16rpx 0;}
+.ucenter-line{height:12rpx; background-color:#f8f8f8; margin:16rpx 0;}
+.card-bottom {
+	width: 100%;
+}
+.top-tab {
+	display: flex;
+	height: 120rpx;
+	position: relative;
+	top: 0;
+	left: 0;
+	width: 100%;
+	z-index: 100;
+	background-color: #ffffff;
+}
+.tab-item {
+	flex: 1;
+	color: #999;
+	border-bottom: 4rpx solid #ececec;
+}
+
+.active {
+	color: var(--mainColor);
+	border-bottom: 4rpx solid var(--mainColor);
+}
+.flex-center {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+.grace-form-input {
+	text-align: left;
+}
 </style>

pages/dream/view/comment.vue

@@ -66,7 +66,7 @@ export default {
 				self.$refs.barrage.start(self.info);
 				return;
 			}
-			this.Dever.get(this, 'app/community/?l=api.comment', {noloading:1,page:this.page,type:this.type,type_id:this.type_id,noconcat:1}, function(t) {
+			this.Dever.get(this, 'app/community/?l=api.comment', {code:this.Dever.config.code,noloading:1,page:this.page,type:this.type,type_id:this.type_id,noconcat:1}, function(t) {
 				if (t && t.info && t.info.length > 0) {
 					self.info = self.info.concat(t.info);
 					if (self.page == 1) {

pages/dream/view/product.vue

@@ -227,6 +227,7 @@ export default {
 			data.price = this.payPrice;
 			data.num = this.buyNum;
 			data.sku = this.skuId;
+			data.code = this.Dever.config.code;
 			console.log(data);
 			//如果想关闭属性
 			//this.closeAttr();