edit

lib/GraceUI5/components/gui-article-info.vue

@@ -106,6 +106,14 @@
 			:decode="true" 
 			v-else-if="item.type == 'h6'">{{item.content}}</text>
 			
+			<!-- 视频 -->
+			<view v-if="item.type == 'video'">
+				<video 
+				:style="{width:(750-padding*2)+'rpx'}"
+				:src="item.content" 
+				controls></video>
+			</view>
+			
 			<!-- 间距 -->
 			<view :style="{height:itemMargin}"></view>
 		</view>

lib/GraceUI5/components/gui-box-banner.vue

@@ -1,79 +1,108 @@
-<template>
-	<view class="grace-box-banner gui-flex gui-rows gui-nowrap" 
-	:style="{backgroundColor:background, 
-		paddingTop:padding, 
-		paddingBottom:padding, 
-		borderRadius:borderRadius}">
-	    <view class="grace-box-items gui-border-r" 
-		v-for="(item, index) in items" 
-		:key="index" @tap.stop="taped(index)" 
-		:style="{
-			borderRightWidth : index+1 >= items.length ? '0rpx':'1px',
-			borderColor : borderColor
-		}">
-		<view class="gui-flex gui-rows gui-nowrap gui-justify-content-center gui-align-items-center">
-			<text class="gui-block-text" 
-			:style="{
-				lineHeight:lineHeight, 
-				color:color[0],
-				fontSize:fontSize[0]
-			}">{{item[0]}}</text>
-			<text class="gui-block-text" 
-			:style="{color:color[1], fontSize:fontSize[1], marginLeft:'5rpx'}">{{item[1]}}</text>
-		</view>
-		<text class="gui-block-text gui-text-center" 
-		:style="{color:color[2],fontSize:fontSize[2]}">{{item[2]}}</text>
-	    </view>
-	</view>
-</template>
-<script>
-export default {
-	name  : "gui-box-banner",
-	props : {
-		items:{
-			type : Array,
-			default : function () {
-				return []
-			}
-		},
-		color:{
-			type : Array,
-			default : function () {
-				return ['#333333', 'rgba(69, 90, 100, 0.5)', 'rgba(69, 90, 100, 0.5)']
-			}
-		},
-		fontSize:{
-			type : Array,
-			default : function () {
-				return ['36rpx', '24rpx', '24rpx']
-			}
-		},
-		background : {
-			type : String,
-			default : ''
-		},
-		padding:{
-			type : String,
-			default : '20rpx'
-		},
-		borderRadius:{
-			type : String,
-			default : '10rpx'
-		},
-		lineHeight:{
-			type : String,
-			default : '60rpx'
-		},
-		borderColor : {type:String, default:'#F1F1F1'}
-	},
-	methods:{
-		taped:function (index) {
-			this.$emit('taped', index);
-		}
-	}
-}
-</script>
-<style scoped>
-.grace-box-banner{overflow:hidden;}
-.grace-box-items{width:100rpx; flex:1;}
+<template>
+	<view 
+	class="grace-box-banner gui-flex gui-rows gui-nowrap" 
+	:style="{
+	backgroundColor:background, 
+	paddingTop:padding, 
+	paddingBottom:padding, 
+	borderRadius:borderRadius
+	}">
+	    <view 
+		class="grace-box-items gui-flex gui-rows gui-nowrap gui-align-items-center" 
+		hover-class="gui-tap" 
+		v-for="(item, index) in items" 
+		:key="index" 
+		@tap.stop="taped(index)">
+			<view 
+			class="gui-flex1">
+				<view
+				class="gui-flex gui-rows gui-nowrap gui-justify-content-center gui-align-items-center">
+					<text 
+					class="gui-block-text" 
+					:style="{
+						lineHeight:lineHeight, 
+						color:color[0],
+						fontSize:fontSize[0]
+					}">{{item[0]}}</text>
+					<text 
+					class="gui-block-text" 
+					:style="{
+						color:color[1], 
+						fontSize:fontSize[1], 
+						marginLeft:'5rpx'
+					}">{{item[1]}}</text>
+				</view>
+				<text 
+				class="gui-block-text gui-text-center" 
+				:style="{
+					color:color[2],
+					fontSize:fontSize[2]
+				}">{{item[2]}}</text>
+			</view>
+			<view 
+			class="grace-box-line" 
+			:style="{
+				'height'            : borderHeight,
+				'border-right-width': borderWidth,
+				'border-right-style': borderStyle,
+				'border-right-color': borderColor 
+			}"
+			v-if="index < items.length - 1"></view>
+	    </view>
+	</view>
+</template>
+<script>
+export default {
+	name  : "gui-box-banner",
+	props : {
+		items:{
+			type : Array,
+			default : function () {
+				return []
+			}
+		},
+		color:{
+			type : Array,
+			default : function () {
+				return ['#333333', 'rgba(69, 90, 100, 0.5)', 'rgba(69, 90, 100, 0.5)']
+			}
+		},
+		fontSize:{
+			type : Array,
+			default : function () {
+				return ['36rpx', '24rpx', '24rpx']
+			}
+		},
+		background : {
+			type : String,
+			default : ''
+		},
+		padding:{
+			type : String,
+			default : '20rpx'
+		},
+		borderRadius:{
+			type : String,
+			default : '10rpx'
+		},
+		lineHeight:{
+			type : String,
+			default : '60rpx'
+		},
+		borderColor : {type:String, default:'#F1F1F1'},
+		borderWidth : {type:String, default:'1px'},
+		borderStyle : {type:String, default:'solid'},
+		borderHeight: {type:String, default:'60rpx'}
+	},
+	methods:{
+		taped:function (index) {
+			this.$emit('taped', index);
+		}
+	}
+}
+</script>
+<style scoped>
+.grace-box-banner{overflow:hidden;}
+.grace-box-items{width:100rpx; flex:1;}
+.grace-box-line{width:1px; height:50rpx;}
 </style>

lib/GraceUI5/components/gui-calendar.vue

@@ -70,7 +70,7 @@ export default {
 		activeBgColor : {type  : String,  default : "#008AFF"},
 		borderRadius  : {type  : String,  default : "6rpx"},
 		isLunar       : {type  : Boolean, default : true },
-		zIndex        : {type  : Number,  default : 9999}
+		zIndex        : {type  : Number,  default : 2}
 	},
 	data(){
 		return {

lib/GraceUI5/components/gui-car-number.vue

@@ -1,192 +1,197 @@
-<template>
-	<gui-popup 
-	ref="guipopupforcarnumber" 
-	width="750rpx" 
-	position="bottom" 
-	:canCloseByShade="true">
-		<view 
-		@tap.stop.prevent="stopfun" 
-		class="gui-bg-white">
-			<view 
-			class="gui-flex gui-rows gui-space-between gui-align-items-center"
-			style="padding:20rpx;">
-				<!-- 类型 -->
-				<view style="width:320rpx;">
-				<gui-segmented-control 
-				:items="['普通车牌','新能源牌']" 
-				:current="carType" 
-				@change="changeType"></gui-segmented-control>
-				</view>
-				<text class="gui-car-number-submit gui-block-text gui-color-blue" 
-				@tap="confirm">确定</text>
-			</view>
-			<!-- 车牌展示 -->
-			<view 
-			class="gui-flex gui-rows gui-nowrap gui-justify-content-center" 
-			style="padding-top:20rpx; padding-bottom:20rpx;">
-				<text class="gui-car-number-item gui-block-text" 
-				:class="[
-					idx == inputIndex ? 'gui-bg-blue' : '',
-					idx == inputIndex ? 'gui-a-shade' : ''
-				]" 
-				v-for="(item, idx) in carNumberArray" :key="idx" 
-				@tap="numberTap(idx)">{{item}}</text>
-			</view>
-			<!-- 错误信息 -->
-			<view 
-			v-if="errorshow" 
-			style="padding:20rpx; margin-bottom:10rpx;">
-				<text class="gui-text gui-block-text gui-color-red gui-text-center">请输入完整车牌号码</text>
-			</view>
-			<view class="gui-bg-gray" 
-			style="padding:15rpx;">
-				<!-- 省份前缀键盘 -->
-				<view class="gui-flex gui-rows gui-wrap" 
-				v-if="inputIndex == 0">
-					<view class="gui-car-number-key" 
-					hover-class="gui-bg-blue" 
-					:hover-stay-time="50" 
-					v-for="(item, idx) in provinces" 
-					:key="idx" 
-					@tap="provinceTap(item)">
-						<text class="gui-car-number-key-txt gui-block-text">{{item}}</text>
-					</view>
-				</view>
-				<!-- 号码键盘 -->
-				<view class="gui-flex gui-rows gui-wrap gui-space-between" 
-				v-else>
-					<view class="gui-car-number-key" 
-					hover-class="gui-kd-tap" 
-					:hover-stay-time="50" 
-					v-for="(item, idx) in keyWords" 
-					:key="idx" 
-					@tap="keyTap(item)">
-						<text class="gui-car-number-key-txt gui-block-text">{{item}}</text>
-					</view>
-					<view class="gui-car-number-key"
-					hover-class="gui-kd-tap" 
-					@tap="deleteNumber">
-						<text class="gui-car-number-key-txt gui-block-text gui-icons">&#xe623;</text>
-					</view>
-				</view>
-			</view>
-			<gui-iphone-bottom></gui-iphone-bottom>
-		</view>
+<template>
+	<gui-popup 
+	ref="guipopupforcarnumber" 
+	width="750rpx" 
+	position="bottom" 
+	@close="close" 
+	:canCloseByShade="true">
+		<view 
+		@tap.stop.prevent="stopfun" 
+		class="gui-bg-white">
+			<view 
+			class="gui-flex gui-rows gui-space-between gui-align-items-center"
+			style="padding:20rpx;">
+				<!-- 类型 -->
+				<view style="width:320rpx;">
+				<gui-segmented-control 
+				:items="['普通车牌','新能源牌']" 
+				:current="carType" 
+				@change="changeType"></gui-segmented-control>
+				</view>
+				<text class="gui-car-number-submit gui-block-text gui-color-blue" 
+				@tap="confirm">确定</text>
+			</view>
+			<!-- 车牌展示 -->
+			<view 
+			class="gui-flex gui-rows gui-nowrap gui-justify-content-center" 
+			style="padding-top:20rpx; padding-bottom:20rpx;">
+				<text class="gui-car-number-item gui-block-text" 
+				:class="[
+					idx == inputIndex ? 'gui-bg-blue' : '',
+					idx == inputIndex ? 'gui-a-shade' : ''
+				]" 
+				v-for="(item, idx) in carNumberArray" :key="idx" 
+				@tap="numberTap(idx)">{{item}}</text>
+			</view>
+			<!-- 错误信息 -->
+			<view 
+			v-if="errorshow" 
+			style="padding:20rpx; margin-bottom:10rpx;">
+				<text class="gui-text gui-block-text gui-color-red gui-text-center">请输入完整车牌号码</text>
+			</view>
+			<view class="gui-bg-gray" 
+			style="padding:15rpx;">
+				<!-- 省份前缀键盘 -->
+				<view class="gui-flex gui-rows gui-wrap" 
+				v-if="inputIndex == 0">
+					<view class="gui-car-number-key" 
+					hover-class="gui-bg-blue" 
+					:hover-stay-time="50" 
+					v-for="(item, idx) in provinces" 
+					:key="idx" 
+					@tap="provinceTap(item)">
+						<text class="gui-car-number-key-txt gui-block-text">{{item}}</text>
+					</view>
+				</view>
+				<!-- 号码键盘 -->
+				<view class="gui-flex gui-rows gui-wrap gui-space-between" 
+				v-else>
+					<view class="gui-car-number-key" 
+					hover-class="gui-kd-tap" 
+					:hover-stay-time="50" 
+					v-for="(item, idx) in keyWords" 
+					:key="idx" 
+					@tap="keyTap(item)">
+						<text class="gui-car-number-key-txt gui-block-text">{{item}}</text>
+					</view>
+					<view class="gui-car-number-key"
+					hover-class="gui-kd-tap" 
+					@tap="deleteNumber">
+						<text class="gui-car-number-key-txt gui-block-text gui-icons">&#xe623;</text>
+					</view>
+				</view>
+			</view>
+			<gui-iphone-bottom></gui-iphone-bottom>
+		</view>
 	</gui-popup>
 </template>
-<script>
-export default{
-	name  : "gui-car-number",
-	props : {},
-	data() {
-		return {
-			carNumber      : '',
-			carNumberArray : [],
-			carType        : 0,
-			inputIndex     : 0,
-			provinces      : ['京','津','沪','渝','冀','豫','云',
-							  '辽','黑','湘','皖','鲁','新','苏',
-							  '浙','赣','鄂','桂','甘','晋','蒙',
-							  '陕','吉','闽','贵','粤','青','藏',
-							  '川','宁','琼','使','领','新'
-							],
-			keyWords       : ['1','2','3','4','5','6','7','8','9','0',
-							  'A','B','C','D','E','F','G','H',
-							  'J','K','L','M','N','P','Q','R',
-							  'S','T','U','V','W','X','Y','Z',
-							  '港','澳','学','领','警'],
-			errorshow      : false
-		}
-	},
-	mounted:function(){
-		this.showNumber();
-	},
-	methods:{
-		showError  : function () {
-			this.errorshow = true;
-			setTimeout(()=>{this.errorshow = false},2000)
-		},
-		confirm    : function () {
-			let carNumberLength = this.carType == 0 ? 7 : 8;
-			if(this.carNumber.length < carNumberLength){
-				this.showError();
-				return ;
-			}
-			this.$emit('confirm', this.carNumber);
-			this.$refs.guipopupforcarnumber.close();
-		},
-		numberTap  : function (idx) {
-			this.inputIndex = idx
-		},
-		provinceTap : function(key){
-			this.carNumberArray[0] = key;
-			this.carNumber = this.carNumberArray.join('');
-			this.showNumber();
-		},
-		keyTap     : function(key){
-			let carNumberLength = this.carType == 0 ? 7 : 8;
-			if(this.inputIndex >= carNumberLength){return ;}
-			this.carNumberArray[this.inputIndex] = key;
-			this.carNumber = this.carNumberArray.join('');
-			this.showNumber();
-		},
-		showNumber : function(){
-			let carNumberArray     = this.carNumber.split('');
-			let carNumberLength    = this.carType == 0 ? 7 : 8;
-			let carNumberArrLength = carNumberArray.length;
-			this.carNumberArray    = [];
-			var inputIndex        = 0;
-			for(let i = 0; i < carNumberLength; i++){
-				if(carNumberArrLength > i){
-					this.carNumberArray[i] = carNumberArray[i];
-					inputIndex++;
-				}else{
-					this.carNumberArray[i] = '';
-				}
-			}
-			this.carNumber  = this.carNumberArray.join('');
-			this.inputIndex = inputIndex;
-		},
-		changeType : function(e){
-			this.carType = e;
-			this.showNumber();
-		},
-		setType : function(carType){
-			this.carType   = carType;
-			this.showNumber();
-		},
-		setVal  : function(carNumber){
-			this.carNumber = carNumber;
-			this.showNumber();
-		},
-		deleteNumber : function(){
-			if(this.inputIndex < 0){return ;}
-			this.carNumberArray.splice((this.inputIndex -1), 1, '');
-			this.carNumber = this.carNumberArray.join('');
-			this.showNumber();
-		},
-		open : function(){
-			this.$refs.guipopupforcarnumber.open();
-		},
-		stopfun : function(e){
-			e.stopPropagation();
-			return ;
-		}
-	}
+<script>
+export default{
+	name  : "gui-car-number",
+	props : {},
+	data() {
+		return {
+			carNumber      : '',
+			carNumberArray : [],
+			carType        : 0,
+			inputIndex     : 0,
+			provinces      : ['京','津','沪','渝','冀','豫','云',
+							  '辽','黑','湘','皖','鲁','新','苏',
+							  '浙','赣','鄂','桂','甘','晋','蒙',
+							  '陕','吉','闽','贵','粤','青','藏',
+							  '川','宁','琼','使','领','新'
+							],
+			keyWords       : ['1','2','3','4','5','6','7','8','9','0',
+							  'A','B','C','D','E','F','G','H',
+							  'J','K','L','M','N','P','Q','R',
+							  'S','T','U','V','W','X','Y','Z',
+							  '港','澳','学','领','警'],
+			errorshow      : false
+		}
+	},
+	mounted:function(){
+		this.showNumber();
+	},
+	methods:{
+		showError  : function () {
+			this.errorshow = true;
+			setTimeout(()=>{this.errorshow = false},2000)
+		},
+		confirm    : function () {
+			let carNumberLength = this.carType == 0 ? 7 : 8;
+			if(this.carNumber.length < carNumberLength){
+				this.showError();
+				return ;
+			}
+			this.$emit('confirm', this.carNumber);
+			this.$refs.guipopupforcarnumber.close();
+		},
+		numberTap  : function (idx) {
+			this.inputIndex = idx
+		},
+		provinceTap : function(key){
+			this.carNumberArray[0] = key;
+			this.carNumber = this.carNumberArray.join('');
+			this.showNumber();
+		},
+		keyTap     : function(key){
+			let carNumberLength = this.carType == 0 ? 7 : 8;
+			if(this.inputIndex >= carNumberLength){return ;}
+			this.carNumberArray[this.inputIndex] = key;
+			this.carNumber = this.carNumberArray.join('');
+			this.showNumber();
+		},
+		showNumber : function(){
+			let carNumberArray     = this.carNumber.split('');
+			let carNumberLength    = this.carType == 0 ? 7 : 8;
+			let carNumberArrLength = carNumberArray.length;
+			this.carNumberArray    = [];
+			var inputIndex        = 0;
+			for(let i = 0; i < carNumberLength; i++){
+				if(carNumberArrLength > i){
+					this.carNumberArray[i] = carNumberArray[i];
+					inputIndex++;
+				}else{
+					this.carNumberArray[i] = '';
+				}
+			}
+			this.carNumber  = this.carNumberArray.join('');
+			this.inputIndex = inputIndex;
+		},
+		changeType : function(e){
+			this.carType = e;
+			this.showNumber();
+		},
+		setType : function(carType){
+			this.carType   = carType;
+			this.showNumber();
+		},
+		setVal  : function(carNumber){
+			this.carNumber = carNumber;
+			this.showNumber();
+		},
+		deleteNumber : function(){
+			if(this.inputIndex < 0){return ;}
+			this.carNumberArray.splice((this.inputIndex -1), 1, '');
+			this.carNumber = this.carNumberArray.join('');
+			this.showNumber();
+		},
+		open : function(){
+			this.$refs.guipopupforcarnumber.open();
+			this.$emit('open');
+		},
+		stopfun : function(e){
+			e.stopPropagation();
+			return ;
+		},
+		close : function(){
+			this.$emit('close');
+		}
+	}
 }
 </script>
-<style scoped>
-.gui-car-number-item{width:70rpx; height:70rpx; font-size:30rpx; line-height:70rpx; text-align:center; border:1px solid #CECECE; border-radius:6rpx; margin-right:15rpx; font-weight:700;}
-.gui-car-number-key{width:76rpx; height:76rpx; border:1px solid #CECECE; border-radius:6rpx; margin:5rpx;}
-.gui-car-number-key-txt{font-size:30rpx; line-height:76rpx; text-align:center;}
-.gui-car-number-submit{width:100rpx; line-height:60rpx; text-align:center; font-size:30rpx;}
-.gui-bg-blue{color:#FFFFFF; border-color: #008AFF;}
-/* #ifndef APP-NVUE */
-@keyframes gui-a-shade{0%{opacity:1;} 25%{opacity:0.6;} 50%{opacity:0.6;} 75%{opacity:1;} 100%{opacity:1;}}
-.gui-a-shade{animation:gui-a-shade 1.5s ease infinite;}
-.gui-kd-tap{color:#FFFFFF; background-color:#008AFF; border-color:#008AFF;}
-/* #endif */
-/* #ifdef APP-NVUE */
-.gui-kd-tap{color:#FFFFFF; background-color:#CECECE; border-color:#CECECE;}
+<style scoped>
+.gui-car-number-item{width:70rpx; height:70rpx; font-size:30rpx; line-height:70rpx; text-align:center; border:1px solid #CECECE; border-radius:6rpx; margin-right:15rpx; font-weight:700;}
+.gui-car-number-key{width:76rpx; height:76rpx; border:1px solid #CECECE; border-radius:6rpx; margin:5rpx;}
+.gui-car-number-key-txt{font-size:30rpx; line-height:76rpx; text-align:center;}
+.gui-car-number-submit{width:100rpx; line-height:60rpx; text-align:center; font-size:30rpx;}
+.gui-bg-blue{color:#FFFFFF; border-color: #008AFF;}
+/* #ifndef APP-NVUE */
+@keyframes gui-a-shade{0%{opacity:1;} 25%{opacity:0.6;} 50%{opacity:0.6;} 75%{opacity:1;} 100%{opacity:1;}}
+.gui-a-shade{animation:gui-a-shade 1.5s ease infinite;}
+.gui-kd-tap{color:#FFFFFF; background-color:#008AFF; border-color:#008AFF;}
+/* #endif */
+/* #ifdef APP-NVUE */
+.gui-kd-tap{color:#FFFFFF; background-color:#CECECE; border-color:#CECECE;}
 /* #endif */
 </style>

lib/GraceUI5/components/gui-column.vue

@@ -0,0 +1,49 @@
+<template>
+	<view 
+	:class="classesRuntime" 
+	:style="styleRuntime">
+		<slot></slot>
+	</view>
+</template>
+<script>
+export default{
+	name  : "gui-column",
+	props : {
+		mainAxisAlignment  : {type:String, default:'flex-start'},
+		crossAxisAlignment : {type:String, default:'flex-start'},
+		customStyle        : {type:String, default:''},
+		customClasses      : {type:Array,  default:function(){return [];}}
+	},
+	data() {
+		return {
+			styleRuntime : '', 
+			classesRuntime : []
+		}
+	},
+	methods:{
+		makeStyle : function(){
+			var styleRuntime = 'justify-content:'+this.mainAxisAlignment+'; ';
+			styleRuntime += 'align-items:'+this.crossAxisAlignment+'; ';
+			styleRuntime += this.customStyle;
+			this.styleRuntime = styleRuntime;
+		},
+		makeClasses : function(){
+			var classes = ['gui-flex', 'gui-column'];
+			classes = classes.concat(this.customClasses);
+			this.classesRuntime = classes;
+		}
+	},
+	mounted:function(){
+		this.makeStyle();
+		this.makeClasses();
+	},
+	watch:{
+		mainAxisAlignment  : function(){this.makeStyle();},
+		crossAxisAlignment : function(){this.makeStyle();},
+		customStyle        : function(){this.makeStyle();},
+		customClasses        : function(){this.makeClasses();}
+	}
+}
+</script>
+<style scoped>
+</style>

lib/GraceUI5/components/gui-datetime-between.vue

@@ -2,7 +2,7 @@
 	<view>
 		<view @tap.stop="open"><slot></slot></view>
 		<view class="gui-dateBT-shade gui-flex gui-columns gui-justify-content-end" 
-		v-if="show" :style="{zIndex:zIndex}">
+		:style="{zIndex:zIndex, left:show?'0rpx':'-1000rpx'}">
 			<view class="gui-bg-white">
 				<view class="graceDateTime-header gui-flex gui-rows gui-space-between gui-bg-gray">
 					<text class="graceDateTime-header-btn" 
@@ -23,6 +23,7 @@
 					:isMinute="isMinute" 
 					:startYear="startYear" 
 					:endYear="endYear" 
+					:isDay="isDay" 
 					:units="units"></gui-datetime-bt-base>
 				</view>
 				<!-- 结束时间 -->
@@ -36,6 +37,7 @@
 					:isMinute="isMinute" 
 					@change="chang2" 
 					:isSecond="isSecond" 
+					:isDay="isDay" 
 					:startYear="startYear" 
 					:endYear="endYear" 
 					:units="units"></gui-datetime-bt-base>
@@ -61,7 +63,8 @@ export default {
 		endYear       : { type : Number,  default : 2050},
 		units         : { type : Array ,  default : function(){return new Array('年','月','日','时','分','秒')}},
 		titles        : { type : Array ,  default : function(){return new Array('开始时间','结束时间')}},
-		zIndex        : { type : Number,  default : 90 }
+		zIndex        : { type : Number,  default : 90 },
+		isDay         : { type : Boolean, default : true }
 	},
 	data() {
 		return {

lib/GraceUI5/components/gui-datetime-bt-base.vue

@@ -11,7 +11,7 @@
 			<text class="graceDateTime-item gui-block-text" 
 			v-for="(item, index) in sDate[1]" :key="index">{{item}}{{units[1]}}</text>
 		</picker-view-column>
-		<picker-view-column>
+		<picker-view-column v-if="isDay">
 			<text class="graceDateTime-item gui-block-text" 
 			v-for="(item, index) in sDate[2]" :key="index">{{item}}{{units[2]}}</text>
 		</picker-view-column>
@@ -37,6 +37,7 @@ export default {
 		isMinute  : { type : Boolean, default : true},
 		isTime    : { type : Boolean, default : true},
 		isSecond  : { type : Boolean, default : true},
+		isDay     : { type : Boolean, default : true },
 		startYear : { type : Number, default : 1980},
 		endYear   : { type : Number, default : 2050},
 		units     : { type : Array , default:function(){return new Array('年','月','日','时','分','秒')}},

lib/GraceUI5/components/gui-header-leading.vue

@@ -1,20 +1,48 @@
-<template>
-	<view v-if="!onlyBack" 
+<template>
+	<view
+	v-if="onlyBack" 
+	class="gui-header-leader" 
+	style="padding:0;">
+		<view class="gui-header-leader-btns" 
+		hover-class="gui-tap">
+			<text 
+			class="gui-header-leader-btns gui-block-text gui-icons gui-primary-color" 
+			hover-class="gui-tap" 
+			@tap="goback" 
+			:style="'text-align:left; '+buttonStyle">&#xe643;</text>
+		</view>
+	</view>
+	<view 
+	v-else-if="onlyHome" 
+	style="padding:0;" 
+	class="gui-header-leader">
+		<view 
+		class="gui-header-leader-btns" 
+		hover-class="gui-tap">
+			<text 
+			class="gui-header-leader-btns gui-block-text gui-icons gui-primary-color" 
+			@tap="gohome" 
+			:style="'text-align:left; font-size:35rpx; '+ buttonStyle">&#xe63b;</text>
+		</view>
+	</view>
+	<view 
+	v-else 
 	class="gui-header-leader gui-flex gui-rows gui-nowrap gui-align-items-center gui-header-buttons-bg gui-border-box" 
 	:style="bgStyle">
-		<view class="gui-header-leader-btns" hover-class="gui-tap">
-			<text class="gui-header-leader-btns gui-block-text gui-icons gui-header-buttons-color" 
-			@tap="goback" :style="buttonStyle">&#xe643;</text>
+		<view class="gui-header-leader-btns" 
+		hover-class="gui-tap">
+			<text 
+			class="gui-header-leader-btns gui-block-text gui-icons gui-header-buttons-color" 
+			@tap="gohome" 
+			:style="'font-size:35rpx; '+ buttonStyle">&#xe63b;</text>
 		</view>
-		<view class="gui-header-leader-btns" hover-class="gui-tap">
+		<view 
+		style="margin-left:12rpx;"
+		class="gui-header-leader-btns" 
+		hover-class="gui-tap">
 			<text class="gui-header-leader-btns gui-block-text gui-icons gui-header-buttons-color" 
-			@tap="gohome" :style="'font-size:35rpx; '+ buttonStyle">&#xe63b;</text>
-		</view>
-	</view>
-	<view v-else class="gui-header-leader">
-		<view class="gui-header-leader-btns" hover-class="gui-tap">
-			<text class="gui-header-leader-btns gui-block-text gui-icons gui-primary-color" 
-			hover-class="gui-tap" @tap="goback" :style="'text-align:left; '+buttonStyle">&#xe643;</text>
+			@tap="goback" 
+			:style="buttonStyle">&#xe643;</text>
 		</view>
 	</view>
 </template>
@@ -25,7 +53,8 @@ export default{
 		homePage    : {type:String , default:"/pages/index/index"},
 		bgStyle     : {type:String , default:""},
 		buttonStyle : {type:String , default:""},
-		onlyBack    : {type:Boolean, default:false}
+		onlyBack    : {type:Boolean, default:false},
+		onlyHome    : {type:Boolean, default:false}
 	},
 	methods:{
 		goback : function () {
@@ -42,6 +71,6 @@ export default{
 }
 </script>
 <style scoped>
-.gui-header-leader{height:60rpx; border-radius:60px; width:138rpx; overflow:hidden;}
-.gui-header-leader-btns{width:68rpx; line-height:60rpx; font-size:32rpx; text-align:center;}
+.gui-header-leader{height:55rpx; border-radius:55rpx; overflow:hidden; padding:0 25rpx;}
+.gui-header-leader-btns{width:40rpx; line-height:55rpx; font-size:30rpx; text-align:center; margin:0rpx; overflow:hidden;}
 </style>

lib/GraceUI5/components/gui-im-input.vue

@@ -1,169 +1,172 @@
-<template name="gui-im-input">
-	<view>
-		<view class="gui-im-footer" 
-		:style="{paddingBottom:paddingB}">
-			<view class="gui-im-menus graceIMFonts icon-voice" 
-			hover-class="gui-tap" v-if="voiceBtnShow" 
-			@tap="showRec"></view>
-			<view class="gui-im-menus graceIMFonts icon-photograph" 
-			 hover-class="gui-tap" 
-			@tap="chooseImg"></view>
-			<view class="gui-im-input">
-				<input type="text" v-model="inputMsg" 
-				@confirm="sendTextMsg" :cursor-spacing="35" />
-			</view>
-			<view class="gui-items" 
-			style="padding:0 12rpx; margin-right:10rpx;" 
-			hover-class="gui-tap" @tap="sendTextMsg">发送</view>
-		</view>
-		<!-- 语音输入 -->
-		<view class="gui-im-record" v-if="recShow">
-			<view class="gui-im-record-txt">
-				{{recTxt}}<text v-if="recing">已录音 : {{recLength}} s</text>
-			</view>
-			<view class="gui-im-record-btn" 
-			@tap="rec" :class="[recing ? 'gui-im-recording' : '']"></view>
-			<view class="gui-im-send-voice" 
-			v-if="tmpVoice != ''">
-				<text @tap="sendVoiceMsg">发送语音</text>
-			</view>
-			<view class="gui-im-record-close graceIMFonts icon-close" 
-			@tap="closeRec" v-if="!recing"></view>
-		</view>
-	</view>
-</template>
-<script>
-var bgAudioMannager = uni.getBackgroundAudioManager();
-export default {
-	name  : "gui-im-input",
-	props : { },
-	data() {
-		return {
-			paddingB        : '0',
-			uploading       : false,
-			recShow         : false,
-			recTxt          : "请点击绿色按钮开始录音",
-			inputMsg        : "",
-			recorderManager : null,
-			recing          : false,
-			recLength       : 1,
-			recTimer        : null,
-			tmpVoice        : '',
-			voiceLen        : 0,
-			voiceBtnShow    : false,
-			// 播放相关
-			player          : null,
-			playTxt         : "试听语音"
-		}
-	},
-	created : function(){
-		// #ifndef H5
-		this.voiceBtnShow    = true;
-		this.recorderManager = uni.getRecorderManager();
-		this.recorderManager.onStop((res) => {
-			this.tmpVoice    = res.tempFilePath;
-			this.recing      = false;
-			this.recTxt       =  "... 已录音 "+this.recLength+
-			"s, 点击绿色按钮重新录音 ...";
-			clearInterval(this.recTimer);
-		});
-		this.recorderManager.onError(() => {
-			uni.showToast({ title: '录音失败', icon: 'none' });
-			this.recing = false;
-			this.recTxt   = "请点击绿色按钮开始录音",
-			clearInterval(this.recTimer);
-		});
-		// #endif
-		// #ifdef MP
-		try {
-		    var res = uni.getSystemInfoSync();
-			res.model = res.model.replace(' ', '');
-			res.model = res.model.toLowerCase();
-			var res1  = res.model.indexOf('iphonex');
-			if(res1 > 5){res1 = -1;}
-			var res2   = res.model.indexOf('iphone1');
-			if(res2 > 5){res2 = -1;}
-			if(res1 != -1 || res2 != -1){
-				this.paddingB = uni.upx2px(50)+'px';
-			}
-		} catch (e){return null;}
-		// #endif
-	},
-	methods:{
-		// 录音
-		rec : function(){
-			if (this.recing){
-				this.recorderManager.stop();
-				this.recing = false;
-				this.recTxt   =  "... 已录音 "+this.recLength
-				+"s, 点击绿色按钮重新录音 ...";
-				clearInterval(this.recTimer);
-			} else {
-				this.recorderManager.start({duration:60000, format:'mp3' });
-				this.recing     = true;
-				this.recTxt     =  "... 正在录音 ...";
-				this.recLength  = 1;
-				this.recTimer   = setInterval(()=>{this.recLength++;}, 1000);
-			}
-		},
-		// 发送录音
-		sendVoiceMsg : function(){
-			if (this.tmpVoice == '') {
-				uni.showToast({ title: "请先录制一段语音", icon: "none" });
-				return;
-			}
-			// 关闭界面
-			this.recShow = false;
-			this.$emit('sendVoice', this.tmpVoice, this.recLength);
-			this.tmpVoice  = '';
-			this.recLength = 0;
-			this.recTxt    = "请点击绿色按钮开始录音";
-		},
-		// 展示录音界面
-		showRec : function(){this.recShow  = true;},
-		// 关闭录音界面
-		closeRec: function (){this.recShow = false;},
-		// 发送文本消息
-		sendTextMsg: function () {
-			if (this.inputMsg < 1) {return false;}
-			this.$emit('sendText', this.inputMsg);
-			this.inputMsg = '';
-		},
-		// 选择图片
-		chooseImg : function(){
-			uni.chooseImage({
-				count      : 1,
-				sizeType   : ['compressed'],
-				sourceType : ['album', 'camera'],
-				success    : (res)=>{
-					const tempFilePaths = res.tempFilePaths;
-					this.$emit('chooseImage', tempFilePaths[0]);
-				}
-			});
-		}
-	}
-}
-</script>
-<style scoped>
-.gui-im-footer{background:#FFFFFF; width:100%; position:fixed; left:0; bottom:0; height:100rpx; display:flex; flex-wrap:nowrap; overflow:hidden; box-shadow:1px 1px 6px #999999; align-items:center;}
-.gui-im-footer .gui-items{width:auto; line-height:88rpx; flex-shrink:0; font-size:28rpx; color:#2B2E3D;}
-.gui-im-menus{width:80rpx; height:80rpx; flex-shrink:0; line-height:80rpx; text-align:center;}
-.gui-im-input{width:600rpx; margin:10rpx; padding:10rpx 16rpx; background:#F4F5F6; border-radius:6rpx; height:60rpx;}
-.gui-im-input input{width:100%; background:#F4F5F6; color:#2B2E3D; height:40rpx; line-height:40rpx; font-size:28rpx; margin-top:10rpx;}
-.gui-im-record{width:100%; position:fixed; left:0; bottom:0; background:#FFFFFF; padding:30px 0; padding-bottom:100rpx; z-index:11; box-shadow:1px 1px 6px #999999;}
-.gui-im-record-close{width:100rpx; height:100rpx; position:absolute; top:0px; right:0px; z-index:100; text-align:center; line-height:100rpx; color:#888888; font-size:38rpx !important;}
-.gui-im-record-txt{text-align:center; font-size:26rpx; line-height:30px; padding-bottom:10px; color:#CCCCCC;}
-.gui-im-record-btn{width:60px; height:60px; margin:0 auto; border:5px solid #F1F2F3; border-radius:100%; background:#00B26A;}
-.gui-im-recording{background:#FF0000; animation:fade linear 2s infinite;}
-@keyframes fade{from{opacity:0.1;} 50%{opacity:1;} to{opacity:0.1;}}
-.gui-im-record-txt text{color:#00B26A; padding:0 12px;}
-.gui-im-send-voice{margin-top:12px; font-size:28rpx; color:#00BA62; text-align:center;}
-.gui-im-send-voice text{margin:0 15px; color:#00BA62;}
-
-@font-face{font-family:"graceIMFonts"; src:url('data:font/truetype;charset=utf-8;base64,d09GMgABAAAAAASoAAsAAAAACpAAAARbAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDMgqILIZ4ATYCJAMUCwwABCAFhG0HSxsHCcgOJQUABgUAAMBk8EB6fW8yk/3Z7Cd4BLPXQW6vA9B99wc4f67lvzL5jC8R2YVkAS+XAsN4QPB1pPqF+wfHUj8K/8Hyvu1BXjGyLDq25lGBDagb1ySRuNkEfcvRGr5iXEVcDQGYRBOJS2OXykbwRoFqQYpmTZc48HZYUBEkgaF3BBypENvQMbT12hNgq/b24g35wgANXYLX6jelSITc52EvKqRlDzJKWljFuYDbcSCBTAAFYkGgZxZuhipT05hBv+dOLYCJgYb2POx50vPyFxW2DZaiQzqT/8MDDYlCgHCAGk+KrY0reB4m8aDB8yQeJDwv50HBiwrZtGh0ur0JhAGiEhCdYIisoERHonui2lcmOM2zJHp7m6a+suXpoNZng9tfDG17vkyohugi+3dbns4wdwWyFuTaGyL2DH1o+v/RweMTg2Y6LqngIEk2qXNSr6zPX9naOrilZVBb25D29qFN+/Nh99riT7Z3vdsad6xlyKkr1tWNZ09eGz6kkbRWS7iliav7hBVp1hm64Q4O3rMhcFCzzBa4ywoa3MgWtHtjyNAmVUhYR3kdd6O7DasHDfpeN2jwb7vbQFjoV6Fa7o6VK9v0qChdVrZdRURhRbwW3rqlUHWLS5mMreMeM3nRSDO2TbYUy16uGosg002pTpZwphre5b7iZKa3S1VPqnNboCS+PE4Hmd9c9SJ2Lk+1zG3JjnAsPmH0XBpvDWJl+WX186e6zIWKSG6z0np0qthYRZSdTEQULL34fb9uJZ66RKiru0eP4K4lSXcWecR/xPf20/WbFi0Bz/8qJrcUz0VLHq9jd7SqyEjVyoWKSFZYZV4TL99QQihCuiGEghgP3sLyqYFyCAlv/7hDnEsCyWXFCOnjZkAVINnlhrLtTEJFJEusvRjRsGVZpxpGRH+psDBFlC1MRCRsj0k9bjZvPtcjYrOpiXamCVUROssu7hLWO2VNhdl5+yxFRU/Z8/pcBwNGkpu2yNAKAPaY/CNXAvak/CmXAfaM/CYXH8o/w6M7d+aODar8ZrgUAB2fJ5zRauxBhbTgeNSSWHrgShOOqa8crbp6d0qSt09n10Gh0T6LTOBwDfjzrxh7EEUmBAZBFmh4EAUSg0SkwmaCjotCcGBQAyYZlBzvIgCKG0I5gXTGAAS+nIKGN9dB4ssnUmH/QCeY/+DAV0gwGSICzugiWUw3GxZgjmER8V1IESyTCDvz1YvrsdSmc9Qu18jNmDqVIIrLznUnS7CJaRH7ONuleMYIItQyUDFcD+u6hWxqqVhg0TJjdnpMzpSgJ4oWLAN8aYCC4WBgRBA8XSAUBCxMiLIww9fz+vVgJNrQ4aARXT/8zWAoTpTVI+KIJjYBskRjJuralEon7UjEw2iEgCC3QgsDRDF1YXQes0DYwZupYAQY0cgZIjbpxNDJSFJNdPU6Yx5LT5ueeAZdaEIKJXThwGPGdM60RcRz0WJbUY1TF8sb8IrH8sVdigkAAA==') format('truetype');}
-.graceIMFonts{font-family:"graceIMFonts" !important; font-style:normal; color:#2B2E3D; font-size:56rpx;}
-.icon-voice:before{content:"\e63a";}
-.icon-photograph:before{content:"\e619";}
-.icon-close:before{content:"\e625";}
-.icon-kbd{content:"\e73b";}
+<template name="gui-im-input">
+	<view>
+		<view class="gui-im-footer" 
+		:style="{paddingBottom:paddingB}">
+			<view class="gui-im-menus graceIMFonts icon-voice" 
+			hover-class="gui-tap" v-if="voiceBtnShow" 
+			@tap="showRec"></view>
+			<view class="gui-im-menus graceIMFonts icon-photograph" 
+			 hover-class="gui-tap" 
+			@tap="chooseImg"></view>
+			<view class="gui-im-input">
+				<textarea type="text" 
+				v-model="inputMsg" 
+				:fixed="true" 
+				@confirm="sendTextMsg" 
+				:cursor-spacing="35"></textarea>
+			</view>
+			<view class="gui-items" 
+			style="padding:0 12rpx; margin-right:10rpx;" 
+			hover-class="gui-tap" @tap="sendTextMsg">发送</view>
+		</view>
+		<!-- 语音输入 -->
+		<view class="gui-im-record" v-if="recShow">
+			<view class="gui-im-record-txt">
+				{{recTxt}}<text v-if="recing">已录音 : {{recLength}} s</text>
+			</view>
+			<view class="gui-im-record-btn" 
+			@tap="rec" :class="[recing ? 'gui-im-recording' : '']"></view>
+			<view class="gui-im-send-voice" 
+			v-if="tmpVoice != ''">
+				<text @tap="sendVoiceMsg">发送语音</text>
+			</view>
+			<view class="gui-im-record-close graceIMFonts icon-close" 
+			@tap="closeRec" v-if="!recing"></view>
+		</view>
+	</view>
+</template>
+<script>
+var bgAudioMannager = uni.getBackgroundAudioManager();
+export default {
+	name  : "gui-im-input",
+	props : { },
+	data() {
+		return {
+			paddingB        : '0',
+			uploading       : false,
+			recShow         : false,
+			recTxt          : "请点击绿色按钮开始录音",
+			inputMsg        : "",
+			recorderManager : null,
+			recing          : false,
+			recLength       : 1,
+			recTimer        : null,
+			tmpVoice        : '',
+			voiceLen        : 0,
+			voiceBtnShow    : false,
+			// 播放相关
+			player          : null,
+			playTxt         : "试听语音"
+		}
+	},
+	created : function(){
+		// #ifndef H5
+		this.voiceBtnShow    = true;
+		this.recorderManager = uni.getRecorderManager();
+		this.recorderManager.onStop((res) => {
+			this.tmpVoice    = res.tempFilePath;
+			this.recing      = false;
+			this.recTxt       =  "... 已录音 "+this.recLength+
+			"s, 点击绿色按钮重新录音 ...";
+			clearInterval(this.recTimer);
+		});
+		this.recorderManager.onError(() => {
+			uni.showToast({ title: '录音失败', icon: 'none' });
+			this.recing = false;
+			this.recTxt   = "请点击绿色按钮开始录音",
+			clearInterval(this.recTimer);
+		});
+		// #endif
+		// #ifdef MP
+		try {
+		    var res = uni.getSystemInfoSync();
+			res.model = res.model.replace(' ', '');
+			res.model = res.model.toLowerCase();
+			var res1  = res.model.indexOf('iphonex');
+			if(res1 > 5){res1 = -1;}
+			var res2   = res.model.indexOf('iphone1');
+			if(res2 > 5){res2 = -1;}
+			if(res1 != -1 || res2 != -1){
+				this.paddingB = uni.upx2px(50)+'px';
+			}
+		} catch (e){return null;}
+		// #endif
+	},
+	methods:{
+		// 录音
+		rec : function(){
+			if (this.recing){
+				this.recorderManager.stop();
+				this.recing = false;
+				this.recTxt   =  "... 已录音 "+this.recLength
+				+"s, 点击绿色按钮重新录音 ...";
+				clearInterval(this.recTimer);
+			} else {
+				this.recorderManager.start({duration:60000, format:'mp3' });
+				this.recing     = true;
+				this.recTxt     =  "... 正在录音 ...";
+				this.recLength  = 1;
+				this.recTimer   = setInterval(()=>{this.recLength++;}, 1000);
+			}
+		},
+		// 发送录音
+		sendVoiceMsg : function(){
+			if (this.tmpVoice == '') {
+				uni.showToast({ title: "请先录制一段语音", icon: "none" });
+				return;
+			}
+			// 关闭界面
+			this.recShow = false;
+			this.$emit('sendVoice', this.tmpVoice, this.recLength);
+			this.tmpVoice  = '';
+			this.recLength = 0;
+			this.recTxt    = "请点击绿色按钮开始录音";
+		},
+		// 展示录音界面
+		showRec : function(){this.recShow  = true;},
+		// 关闭录音界面
+		closeRec: function (){this.recShow = false;},
+		// 发送文本消息
+		sendTextMsg: function () {
+			if (this.inputMsg < 1) {return false;}
+			this.$emit('sendText', this.inputMsg);
+			this.inputMsg = '';
+		},
+		// 选择图片
+		chooseImg : function(){
+			uni.chooseImage({
+				count      : 1,
+				sizeType   : ['compressed'],
+				sourceType : ['album', 'camera'],
+				success    : (res)=>{
+					const tempFilePaths = res.tempFilePaths;
+					this.$emit('chooseImage', tempFilePaths[0]);
+				}
+			});
+		}
+	}
+}
+</script>
+<style scoped>
+.gui-im-footer{background:#FFFFFF; width:100%; position:fixed; left:0; bottom:0; height:100rpx; display:flex; flex-wrap:nowrap; overflow:hidden; box-shadow:1px 1px 6px #999999; align-items:center;}
+.gui-im-footer .gui-items{width:auto; line-height:88rpx; flex-shrink:0; font-size:28rpx; color:#2B2E3D;}
+.gui-im-menus{width:80rpx; height:80rpx; flex-shrink:0; line-height:80rpx; text-align:center;}
+.gui-im-input{width:600rpx; margin:10rpx; padding:10rpx 16rpx; background:#F4F5F6; border-radius:6rpx; height:60rpx;}
+.gui-im-input textarea{width:100%; background:#F4F5F6; color:#2B2E3D; height:40rpx; line-height:40rpx; font-size:28rpx; margin-top:10rpx;}
+.gui-im-record{width:100%; position:fixed; left:0; bottom:0; background:#FFFFFF; padding:30px 0; padding-bottom:100rpx; z-index:11; box-shadow:1px 1px 6px #999999;}
+.gui-im-record-close{width:100rpx; height:100rpx; position:absolute; top:0px; right:0px; z-index:100; text-align:center; line-height:100rpx; color:#888888; font-size:38rpx !important;}
+.gui-im-record-txt{text-align:center; font-size:26rpx; line-height:30px; padding-bottom:10px; color:#CCCCCC;}
+.gui-im-record-btn{width:60px; height:60px; margin:0 auto; border:5px solid #F1F2F3; border-radius:100%; background:#00B26A;}
+.gui-im-recording{background:#FF0000; animation:fade linear 2s infinite;}
+@keyframes fade{from{opacity:0.1;} 50%{opacity:1;} to{opacity:0.1;}}
+.gui-im-record-txt text{color:#00B26A; padding:0 12px;}
+.gui-im-send-voice{margin-top:12px; font-size:28rpx; color:#00BA62; text-align:center;}
+.gui-im-send-voice text{margin:0 15px; color:#00BA62;}
+
+@font-face{font-family:"graceIMFonts"; src:url('data:font/truetype;charset=utf-8;base64,d09GMgABAAAAAASoAAsAAAAACpAAAARbAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDMgqILIZ4ATYCJAMUCwwABCAFhG0HSxsHCcgOJQUABgUAAMBk8EB6fW8yk/3Z7Cd4BLPXQW6vA9B99wc4f67lvzL5jC8R2YVkAS+XAsN4QPB1pPqF+wfHUj8K/8Hyvu1BXjGyLDq25lGBDagb1ySRuNkEfcvRGr5iXEVcDQGYRBOJS2OXykbwRoFqQYpmTZc48HZYUBEkgaF3BBypENvQMbT12hNgq/b24g35wgANXYLX6jelSITc52EvKqRlDzJKWljFuYDbcSCBTAAFYkGgZxZuhipT05hBv+dOLYCJgYb2POx50vPyFxW2DZaiQzqT/8MDDYlCgHCAGk+KrY0reB4m8aDB8yQeJDwv50HBiwrZtGh0ur0JhAGiEhCdYIisoERHonui2lcmOM2zJHp7m6a+suXpoNZng9tfDG17vkyohugi+3dbns4wdwWyFuTaGyL2DH1o+v/RweMTg2Y6LqngIEk2qXNSr6zPX9naOrilZVBb25D29qFN+/Nh99riT7Z3vdsad6xlyKkr1tWNZ09eGz6kkbRWS7iliav7hBVp1hm64Q4O3rMhcFCzzBa4ywoa3MgWtHtjyNAmVUhYR3kdd6O7DasHDfpeN2jwb7vbQFjoV6Fa7o6VK9v0qChdVrZdRURhRbwW3rqlUHWLS5mMreMeM3nRSDO2TbYUy16uGosg002pTpZwphre5b7iZKa3S1VPqnNboCS+PE4Hmd9c9SJ2Lk+1zG3JjnAsPmH0XBpvDWJl+WX186e6zIWKSG6z0np0qthYRZSdTEQULL34fb9uJZ66RKiru0eP4K4lSXcWecR/xPf20/WbFi0Bz/8qJrcUz0VLHq9jd7SqyEjVyoWKSFZYZV4TL99QQihCuiGEghgP3sLyqYFyCAlv/7hDnEsCyWXFCOnjZkAVINnlhrLtTEJFJEusvRjRsGVZpxpGRH+psDBFlC1MRCRsj0k9bjZvPtcjYrOpiXamCVUROssu7hLWO2VNhdl5+yxFRU/Z8/pcBwNGkpu2yNAKAPaY/CNXAvak/CmXAfaM/CYXH8o/w6M7d+aODar8ZrgUAB2fJ5zRauxBhbTgeNSSWHrgShOOqa8crbp6d0qSt09n10Gh0T6LTOBwDfjzrxh7EEUmBAZBFmh4EAUSg0SkwmaCjotCcGBQAyYZlBzvIgCKG0I5gXTGAAS+nIKGN9dB4ssnUmH/QCeY/+DAV0gwGSICzugiWUw3GxZgjmER8V1IESyTCDvz1YvrsdSmc9Qu18jNmDqVIIrLznUnS7CJaRH7ONuleMYIItQyUDFcD+u6hWxqqVhg0TJjdnpMzpSgJ4oWLAN8aYCC4WBgRBA8XSAUBCxMiLIww9fz+vVgJNrQ4aARXT/8zWAoTpTVI+KIJjYBskRjJuralEon7UjEw2iEgCC3QgsDRDF1YXQes0DYwZupYAQY0cgZIjbpxNDJSFJNdPU6Yx5LT5ueeAZdaEIKJXThwGPGdM60RcRz0WJbUY1TF8sb8IrH8sVdigkAAA==') format('truetype');}
+.graceIMFonts{font-family:"graceIMFonts" !important; font-style:normal; color:#2B2E3D; font-size:56rpx;}
+.icon-voice:before{content:"\e63a";}
+.icon-photograph:before{content:"\e619";}
+.icon-close:before{content:"\e625";}
+.icon-kbd{content:"\e73b";}
 </style>

lib/GraceUI5/components/gui-modal.vue

@@ -2,6 +2,7 @@
 	<gui-popup ref="guipopupformodal" 
 	:width="width" 
 	:canCloseByShade="canCloseByShade" 
+	:zIndex="zIndex" 
 	@close="eClose">
 		<view 
 		:style="bodyStyle" 
@@ -32,7 +33,8 @@ export default{
 		isTitle         : { type  : Boolean, default : true },
 		title           : { type  : String,  default : 'title' },
 		titleStyle      : { type  : String,  default : 'line-height:100rpx; font-size:28rpx; font-weight:700; color:#2B2E3D;' },
-		canCloseByShade : { type  : Boolean, default : true }
+		canCloseByShade : { type  : Boolean, default : true },
+		zIndex          : { type  : Number,  default : 99 }
 	},
 	methods:{
 		open  : function(){

lib/GraceUI5/components/gui-number-animate.vue

@@ -1,53 +1,66 @@
-<template>
-	<text :style="{
-		fontSize:fontSize, 
-		fontWeight:fontWeight, 
-		color:color, 
-		lineHeight:lineHeight
-	}">{{numAnimate}}</text>
-</template>
-<script>
-export default{
-	name  : "gui-number-animate",
-	props : {
-		num        : { type : Number,  default : 0 },
-		stepNumber : { type : Number,  default : 50 },
-		timer      : { type : Number,  default : 1000 },
-		keepInt    : { type : Boolean, default : false },
-		fontSize   : { type : String,  default : '28rpx' },
-		color      : { type : String,  default : '#333333' },
-		lineHeight : { type : String,  default : '50rpx' },
-		fontWeight : { type : String,  default : '400' }
-	},
-	data() {
-		return {
-			numAnimate : 0,
-			intervalId : null
-		}
-	},
-	created:function(){
-		let timer = this.timer / this.stepNumber;
-		let step  = Math.floor((this.num / this.stepNumber) * 100) / 100;
-		this.intervalId = setInterval(() => {
-			// 正值 
-			if(this.num >= 0){
-				if(this.numAnimate >= this.num){
-					this.numAnimate = this.num;
-					clearInterval(this.intervalId);
-					return;
-				}
-			}else{
-				if(this.numAnimate <= this.num){
-					this.numAnimate = this.num;
-					clearInterval(this.intervalId);
-					return;
-				}
-			}
-			let  res = this.numAnimate + step;
-			this.numAnimate = this.keepInt ? parseInt(res) : Math.floor(res * 100) / 100;
-		}, timer);
-	}
-}
-</script>
-<style scoped>
+<template>
+	<text :style="{
+		fontSize:fontSize, 
+		fontWeight:fontWeight, 
+		color:color, 
+		lineHeight:lineHeight
+	}">{{numAnimate}}</text>
+</template>
+<script>
+export default{
+	name  : "gui-number-animate",
+	props : {
+		num        : { type : Number,  default : 0},
+		stepNumber : { type : Number,  default : 50 },
+		timer      : { type : Number,  default : 1000 },
+		keepInt    : { type : Boolean, default : false },
+		fontSize   : { type : String,  default : '28rpx' },
+		color      : { type : String,  default : '#333333' },
+		lineHeight : { type : String,  default : '50rpx' },
+		fontWeight : { type : String,  default : '400' }
+	},
+	data() {
+		return {
+			numAnimate : 0,
+			intervalId : null
+		}
+	},
+	created:function(){
+		if(this.num != 0){this.run();}
+	},
+	watch:{
+		num : function(val){
+			if(this.intervalId != null){clearInterval(this.intervalId);}
+			this.run();
+		}
+	},
+	methods:{
+		run : function(){
+			let timer = this.timer / this.stepNumber;
+			let step  = Math.floor((this.num / this.stepNumber) * 100) / 100;
+			this.intervalId = setInterval(() => {
+				// 正值 
+				if(this.num >= 0){
+					if(this.numAnimate >= this.num){
+						this.numAnimate = this.num;
+						clearInterval(this.intervalId);
+						this.$emit('done');
+						return;
+					}
+				}else{
+					if(this.numAnimate <= this.num){
+						this.numAnimate = this.num;
+						clearInterval(this.intervalId);
+						this.$emit('done');
+						return;
+					}
+				}
+				let  res = this.numAnimate + step;
+				this.numAnimate = this.keepInt ? parseInt(res) : Math.floor(res * 100) / 100;
+			}, timer);
+		}
+	}
+}
+</script>
+<style scoped>
 </style>

lib/GraceUI5/components/gui-page-loading.vue

@@ -124,17 +124,28 @@ export default{
 				this.isLoading = false; 
 			},100);
 		},
-		getRefs        : function(ref, count, fun){
-			if(count >= 30){return null;}
+		getRefs : function(ref, count, fun){
+			if(count >= 50){
+				fun(this.$refs[ref]);
+				return false;
+			}
 			var refReturn = this.$refs[ref];
 			if(refReturn){
+				// #ifdef APP-NVUE
 				fun(refReturn);
 				return;
+				// #endif
+				// #ifndef APP-NVUE
+				if(refReturn._data){
+					fun(refReturn);
+					return;
+				}
+				// #endif
 			}else{
 				count++;
 				setTimeout(()=>{
 					this.getRefs(ref, count, fun);
-				}, 50);
+				}, 100);
 			}
 		}
 	}

lib/GraceUI5/components/gui-page.vue

@@ -5,35 +5,39 @@
 		refresh || loadmore ? 'gui-flex1' : ''
 	]">
 		<!-- 自定义头部 -->
-		<view class="gui-header gui-transition-all" 
+		<view 
+		class="gui-header gui-transition-all" 
 		v-if="customHeader" 
-		id="guiPageHeader" ref="guiPageHeader" 
-		:style="'height:'
+		id="guiPageHeader" 
+		ref="guiPageHeader" 
+		:style="'height:' 
 		+(headerSets.height+statusBarHeight)+'px; z-index:'
 		+headerSets.zIndex+';'+headerStyle">
 			<!-- 状态栏 -->
-			<view class="gui-page-status-bar" 
+			<view 
+			class="gui-page-status-bar" 
 			:style="'height:'+statusBarHeight+'px;'+statusBarStyle"></view>
 			<!-- 头部插槽 -->
-			<view class="gui-flex gui-columns gui-justify-content-center" 
-			@tap.stop.prevnet="headerTap"
+			<view 
+			class="gui-flex gui-columns gui-justify-content-center" 
+			@tap.stop.prevnet="headerTap" 
 			:style="{height:headerSets.height+'px'}">
 				<slot name="gHeader"></slot>
 			</view>
 		</view>
 		<!-- 自定义头部占位 -->
-		<view v-if="customHeader && isHeaderSized" 
-		:style="{height:(headerSets.height+statusBarHeight)+'px'}"></view>
-		
-		
+		<view 
+		v-if="customHeader && isHeaderSized"
+		:style="'height:'+(headerSets.height+statusBarHeight)+'px; '+ headerSizedStyle + ';'"></view>
 		<!-- 页面主体 -->
-		<view class="gui-flex gui-columns" v-if="!refresh && !loadmore" 
-		id="guiPageBody" ref="guiPageBody" 
+		<view 
+		class="gui-flex gui-columns" 
+		v-if="!refresh && !loadmore" 
+		id="guiPageBody" 
+		ref="guiPageBody" 
 		:class="[fullPage?'gui-flex1':'']">
 			<slot name="gBody"></slot>
 		</view>
-		
-		
 		<!-- 刷新加载主体 -->
 		<view class="gui-flex gui-columns gui-flex1" 
 		v-if="refresh || loadmore" 
@@ -43,7 +47,8 @@
 			marginTop:fixedTopMargin+'px', 
 			height:refreshBodyHeight+'px'
 		}">
-			<scroll-view class="gui-relative" 
+			<scroll-view 
+			class="gui-relative" 
 			:scroll-y="true" 
 			:show-scrollbar="false" 
 			:style="{
@@ -77,8 +82,6 @@
 				</view>
 			</scroll-view>
 		</view>
-
-
 		<!-- 页面底部 -->
 		<!-- 底部占位 -->
 		<view v-if="customFooter" 
@@ -93,34 +96,38 @@
 			'background-image':footerSets.bg, 
 			'z-index':footerSets.zIndex
 		}">
-			<view><slot name="gFooter"></slot></view>
+			<view>
+				<slot name="gFooter"></slot>
+			</view>
 			<view 
 			:style="'height:'+iphoneXButtomHeight+'; '+ iphoneXButtomStyle"></view>
 		</view>
-		
 		<!-- 右下角悬浮挂件 -->
-		<view class="gui-page-pendant" 
+		<view 
+		class="gui-page-pendant" 
 		:style="{
 			right:pendantSets.right, bottom:pendantSets.bottom, 
 			width:pendantSets.width, zIndex:pendantSets.zIndex}">
 			<slot name="gPendant"></slot>
 		</view>
-		
 		<!-- 吸顶元素 -->
-		<view class="gui-page-fixed-top" 
+		<view 
+		class="gui-page-fixed-top" 
 		ref="guiPageFixedTop" 
 		id="guiPageFixedTop" 
-		:style="{top:fixedTop+'px'}">
+		:style="{
+			top:fixedTop+'px', 
+			zIndex:fixedTopZIndex
+		}">
 			<slot name="gFixedTop"></slot>
 		</view>
-		
 		<!-- 全屏 loading -->
 		<gui-page-loading ref="guipageloading"></gui-page-loading>
 	</view>
 </template>
 <script>  
 // #ifdef APP-NVUE
-const dom     = weex.requireModule('dom');
+const dom = weex.requireModule('dom');
 // #endif
 export default{
 	name  : 'gui-page',
@@ -137,7 +144,8 @@ export default{
 		isLoading          : {type:Boolean, default:false},
 		isSwitchPage       : {type:Boolean, default:false},
 		iphoneXButtomStyle : {type:String,  default:''},
-		
+		headerSizedStyle   : {type:String,  default:''},
+		fixedTopZIndex     : {type:Number,  default:2},
 		/* 刷新 */
 		refresh            : {type:Boolean, default:false},
 		refreshText        : {type:Array,   default:function () {
@@ -181,67 +189,35 @@ export default{
 	},
 	
 	mounted:function(){
-		
 		if(this.isLoading){
-			this.$refs.guipageloading.open();
+			this.pageLoadingOpen();
 		}
-		
 		// 刷新相关
-		if(this.refresh || this.loadmore){
-			// #ifdef APP-NVUE
-			this.getRefs('guiPageBody', 0, (res)=>{
-				setTimeout(()=>{
-					this.getDomSize('guiPageBody', (res2)=>{
-						this.refreshBodyHeight = res2.height;
-						this.getDomSize('guiPageFixedTop', (res)=>{
-							if(res.height){
-								this.refreshBodyHeight -= res.height;
-								this.fixedTopMargin     = res.height;
-							}
-							if(this.customFooter){
-								this.getDomSize('guiPageFooter',(footer)=>{
-									this.refreshBodyHeight -= footer.height;
-								});
-							}
-						});
-					});
-				},100);
-			});
-			// #endif
-			// #ifndef APP-NVUE
-			this.getDomSize('guiPageBody', (res)=>{
-				this.refreshBodyHeight = res.height;
-				this.getDomSize('guiPageFixedTop', (res)=>{
-					if(res.height){
-						this.refreshBodyHeight -= res.height;
-						this.fixedTopMargin     = res.height;
-					}
-					if(this.customFooter){
-						this.getDomSize('guiPageFooter',(footer)=>{
-							this.refreshBodyHeight -= footer.height;
-							console.log(this.refreshBodyHeight);
-						});
-					}					
-				})
-			});
-			// #endif
-		}
+		setTimeout(()=>{
+			if(this.refresh || this.loadmore){
+				this.getDomSize('guiPageBody', (res)=>{
+					this.refreshBodyHeight = res.height;
+					this.getDomSize('guiPageFixedTop', (res)=>{
+						if(res.height){
+							this.refreshBodyHeight -= res.height;
+							this.fixedTopMargin     = res.height;
+						}				
+					})
+				});
+			}
+		},200);
 	},
-	
 	watch:{
-		isLoading : function (val) {
-			if(val){
-				this.$refs.guipageloading.open();
-			}else{
-				this.$refs.guipageloading.close();
-			}
+		isLoading : function (val) {
+			if(val){
+				this.pageLoadingOpen();
+			}else{
+				this.pageLoadingClose();
+			}
 		}
 	},
-	
 	created:function(){
-		
 		this.footerHeight = this.footerSets.height + 'rpx';
-		
 		// #ifdef H5
 		if(this.customHeader){
 			this.fixedTop = this.headerSets.height;
@@ -249,7 +225,6 @@ export default{
 			this.fixedTop = 44;
 		}
 		// #endif
-		
 		try {
 			var system   = uni.getSystemInfoSync();
 			if(system.model){
@@ -265,21 +240,20 @@ export default{
 					this.footerHeight        =  (this.footerSets.height + 50 ) + 'rpx';
 				}
 			}
-			
 			// #ifdef MP-ALIPAY
 			this.statusBarHeight = 0;
 			// #endif
-			
 			// #ifdef APP-PLUS
 			this.iphoneXButtomHeight = '0rpx';
 			this.footerHeight        =  this.footerSets.height + 'rpx';
+			if(plus.navigator.isFullscreen()){
+				this.statusBarHeight = 0;
+			}
 			// #endif
-			
 			if(this.isSwitchPage){
 				this.iphoneXButtomHeight = '0rpx';
 				this.footerHeight        =  this.footerSets.height + 'rpx';
 			}
-			
 			// #ifndef H5
 			if(this.customHeader){
 				this.fixedTop = this.headerSets.height + this.statusBarHeight;
@@ -289,7 +263,17 @@ export default{
 			// #endif
 		} catch (e){return null;}
 	},
-	methods:{
+	methods:{
+		pageLoadingOpen : function(){
+			this.getRefs('guipageloading',0,(ref)=>{
+				this.$refs.guipageloading.open();
+			});
+		},
+		pageLoadingClose : function(){
+			this.getRefs('guipageloading',0,(ref)=>{
+				ref.close();
+			});
+		},
 		// 下拉刷新相关
 		touchstart : function (e){
 			if(!this.refresh){return false;}
@@ -327,25 +311,39 @@ export default{
 			this.$emit('reload');
 			if(this.loadmore){this.$refs.guipageloadmore.stoploadmore();}
 		},
-		
 		// 获取元素尺寸
-		getDomSize : function(domIDOrRef, fun){
-			setTimeout(()=>{
-				// #ifndef APP-NVUE
-				uni.createSelectorQuery().in(this).select('#'+domIDOrRef).boundingClientRect().exec((res)=>{
+		getDomSize : function(domIDOrRef, fun, count){
+			if(!count){count = 1;}
+			if(count >= 50){
+				fun({width:0, height:0});
+				return false;
+			}
+			// #ifndef APP-NVUE
+			uni.createSelectorQuery().in(this).select('#'+domIDOrRef).boundingClientRect().exec((res)=>{
+				if(res[0] == null){
+					count += 1;
+					setTimeout(()=>{this.getDomSize(domIDOrRef, fun, count);}, 50);
+				}else{
 					fun(res[0]);
-				});
-				// #endif
-				// #ifdef APP-NVUE
-				var el = this.$refs[domIDOrRef];
-				dom.getComponentRect(el, (res) => {
+					return ;
+				}
+			});
+			// #endif
+			// #ifdef APP-NVUE
+			var el = this.$refs[domIDOrRef];
+			dom.getComponentRect(el, (res) => {
+				if(res.result == false){
+					count += 1;
+					setTimeout(()=>{this.getDomSize(domIDOrRef, fun, count);}, 50);
+				}else{
 					fun(res.size);
-				});
-				// #endif
-			}, 800);
+					return ;
+				}
+			});
+			// #endif
 			
 		},
-		stopfun : function(e){e.stopPropagation(); return null;},
+		stopfun   : function(e){e.stopPropagation(); return null;},
 		headerTap : function(){
 			this.headerTapNumber ++;
 			if(this.headerTapNumber >= 2){
@@ -355,13 +353,23 @@ export default{
 				setTimeout(()=>{this.headerTapNumber = 0;}, 1000);
 			}
 		},
-		// #ifdef APP-NVUE
-		getRefs : function(ref, count, fun){
-			if(count >= 40){return null;}
-			var refReturn = this.$refs[ref];
-			if(refReturn){
-				fun(refReturn);
-				return;
+		getRefs : function(ref, count, fun){
+			if(count >= 50){
+				fun(this.$refs[ref]);
+				return false;
+			}
+			var refReturn = this.$refs[ref];
+			if(refReturn){
+				// #ifdef APP-NVUE
+				fun(refReturn);
+				return;
+				// #endif
+				// #ifndef APP-NVUE
+				if(refReturn._data){
+					fun(refReturn);
+					return;
+				}
+				// #endif
 			}else{
 				count++;
 				setTimeout(()=>{
@@ -369,8 +377,6 @@ export default{
 				}, 100);
 			}
 		},
-		// #endif
-		
 		loadmorefun : function () {
 			if(!this.loadmore){return false;}
 			if(this.apiLoadingStatus){return false;}

lib/GraceUI5/components/gui-popup.vue

@@ -1,38 +1,57 @@
 <template>
 	<view v-if="show">
 		<!-- 居中 -->
-		<view class="gui-popup gui-flex gui-columns gui-justify-content-center gui-align-items-center" 
+		<view 
+		class="gui-popup gui-flex gui-columns gui-justify-content-center gui-align-items-center" 
 		:class="[out ? 'gui-fade-out' : 'gui-fade-in']" 
 		ref="guipopup" 
 		@tap.stop="closebysd" @touchmove.stop.prevent="stopfun" 
-		:style="{backgroundColor:bgColor, zIndex:zIndex, top:top+'px'}" 
+		:style="{
+			backgroundColor:bgColor, 
+			zIndex:zIndex, 
+			top:top+'px',
+			animationDuration:duration+'ms'
+		}" 
 		v-if="position == 'center'">
 			<view class="gui-popup-content gui-popup-center"
 			 @tap.stop="stopfun" ref="guiPopupCenter" 
 			:class="[out ? 'gui-scale-out' : 'gui-scale-in']" 
-			:style="'width:'+width+';'"><slot></slot></view>
+			:style="{width:width, animationDuration:duration+'ms'}"><slot></slot></view>
 		</view>
 		<!-- 顶部 -->
 		<view class="gui-popup gui-flex gui-columns" 
-		:style="{backgroundColor:bgColor, zIndex:zIndex, top:top+'px'}" 
+		:style="{
+			backgroundColor:bgColor, 
+			zIndex:zIndex, top:top+'px',
+			animationDuration:duration+'ms'
+		}" 
 		v-if="position == 'top'" 
 		:class="[out ? 'gui-fade-out' : 'gui-fade-in']" ref="guipopup" 
 		@tap.stop="closebysd" @touchmove.stop.prevent="stopfun">
-			<view class="gui-popup-content gui-popup-top" 
+			<view 
+			class="gui-popup-content gui-popup-top" 
 			@tap.stop="stopfun" ref="guiPopupTop" 
-			:class="[out ? 'gui-top-out' : 'gui-top-in']">
+			:class="[out ? 'gui-top-out' : 'gui-top-in']" 
+			:style="{animationDuration:duration+'ms'}">
 				<slot></slot>
 			</view>
 		</view>
 		<!-- 底部 -->
 		<view class="gui-popup gui-flex gui-columns gui-justify-content-end" 
-		:style="{backgroundColor:bgColor, zIndex:zIndex, top:top+'px'}" 
+		:style="{
+			backgroundColor:bgColor, 
+			zIndex:zIndex, 
+			top:top+'px',
+			animationDuration:duration+'ms'
+		}" 
 		v-if="position == 'bottom'" 
 		:class="[out ? 'gui-fade-out' : 'gui-fade-in']" ref="guipopup" 
 		@tap.stop="closebysd" @touchmove.stop.prevent="stopfun">
-			<view class="gui-popup-content gui-popup-bottom" 
+			<view 
+			class="gui-popup-content gui-popup-bottom" 
 			@tap.stop="stopfun" ref="guiPopupBottom" 
-			:class="[out ? 'gui-bottom-out' : 'gui-bottom-in']">
+			:class="[out ? 'gui-bottom-out' : 'gui-bottom-in']" 
+			:style="{animationDuration:duration+'ms'}">
 				<slot></slot>
 			</view>
 		</view>
@@ -42,11 +61,16 @@
 		:class="[out ? 'gui-fade-out' : 'gui-fade-in']" 
 		ref="guipopup" 
 		@tap.stop="closebysd" @touchmove.stop.prevent="stopfun" 
-		:style="{backgroundColor:bgColor, zIndex:zIndex, top:top+'px'}">
+		:style="{
+			backgroundColor:bgColor, 
+			zIndex:zIndex, 
+			top:top+'px',
+			animationDuration:duration+'ms'
+		}">
 			<view class="gui-popup-content gui-flex1 gui-flex gui-columns gui-popup-left" 
 			@tap.stop="stopfun" ref="guiPopupLeft" 
 			:class="[out ? 'gui-left-out' : 'gui-left-in']" 
-			:style="'width:'+width+';'">
+			:style="{width:width, animationDuration:duration+'ms'}">
 				<slot></slot>
 			</view>
 		</view>
@@ -56,11 +80,16 @@
 		:class="[out ? 'gui-fade-out' : 'gui-fade-in']" 
 		ref="guipopup" 
 		@tap.stop="closebysd" @touchmove.stop.prevent="stopfun" 
-		:style="{backgroundColor:bgColor, zIndex:zIndex, top:top+'px'}">
+		:style="{
+			backgroundColor:bgColor, 
+			zIndex:zIndex, 
+			top:top+'px',
+			animationDuration:duration+'ms'
+		}">
 			<view class="gui-popup-content gui-flex1 gui-flex gui-columns gui-popup-right" 
 			@tap.stop="stopfun" ref="guiPopupRight" 
 			:class="[out ? 'gui-right-out' : 'gui-right-in']" 
-			:style="'width:'+width+';'">
+			:style="{width:width, animationDuration:duration+'ms'}">
 				<slot></slot>
 			</view>
 		</view>
@@ -79,7 +108,8 @@ export default{
 		width           : { type : String,  default : '580rpx'},
 		canCloseByShade : { type : Boolean, default : true },
 		zIndex          : { type : Number,  default : 99999},
-		top             : { type : Number,  default : 0}
+		top             : { type : Number,  default : 0},
+		duration        : { type : Number,  default : 280}
 	},
 	data(){
 		return {
@@ -115,7 +145,7 @@ export default{
 			graceJS.getRefs('guipopup', this, 0, (guipopupref)=>{
 				animation.transition(guipopupref, {
 					styles: { opacity : 1},
-					duration: 350, //ms
+					duration: this.duration, //ms
 					timingFunction: 'ease',
 					delay: 0 //ms
 				});
@@ -125,7 +155,7 @@ export default{
 				graceJS.getRefs('guiPopupCenter', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: { transform:'scale(1)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -134,7 +164,7 @@ export default{
 				graceJS.getRefs('guiPopupTop', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateY(0px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -143,7 +173,7 @@ export default{
 				graceJS.getRefs('guiPopupBottom', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateY(0px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -152,7 +182,7 @@ export default{
 				graceJS.getRefs('guiPopupLeft', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateX(0px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -161,7 +191,7 @@ export default{
 				graceJS.getRefs('guiPopupRight', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateX(0px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -173,7 +203,7 @@ export default{
 			graceJS.getRefs('guipopup', this, 0, (guipopupref)=>{
 				animation.transition(guipopupref, {
 					styles: { opacity : 0},
-					duration: 350, //ms
+					duration: this.duration, //ms
 					timingFunction: 'ease',
 					delay: 0 //ms
 				});
@@ -183,7 +213,7 @@ export default{
 				graceJS.getRefs('guiPopupCenter', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: { transform:'scale(0.3)' },
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -192,7 +222,7 @@ export default{
 				graceJS.getRefs('guiPopupTop', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateY(-600px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -201,7 +231,7 @@ export default{
 				graceJS.getRefs('guiPopupBottom', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateY(600px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -210,7 +240,7 @@ export default{
 				graceJS.getRefs('guiPopupLeft', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateX(-500px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});
@@ -219,7 +249,7 @@ export default{
 				graceJS.getRefs('guiPopupRight', this, 0, (guipopupref)=>{
 					animation.transition(guipopupref, {
 						styles: {transform:'translateX(600px)'},
-						duration: 350, //ms
+						duration: this.duration, //ms
 						timingFunction: 'ease',
 						delay: 0 //ms
 					});

lib/GraceUI5/components/gui-progress-scrollview.vue

@@ -1,6 +1,7 @@
 <template>
-	<view class="">
-		<scroll-view
+	<view :style="{width:width+'rpx'}">
+		<scroll-view 
+		:style="{width:width+'rpx'}"
 		:scroll-x="true" 
 		class="gui-scroll-x" 
 		@scroll="scrolling" 
@@ -9,23 +10,27 @@
 		:show-scrollbar="false">
 			<slot></slot>
 		</scroll-view>
-		<view class="gui-psv-progress" 
-		v-if="progressWidth > 0" 
-		:style="{
-			width  : progressWidth+'rpx',
-			height : progressHeight+'rpx',
-			borderRadius : progressRadius+'rpx',
-			backgroundColor : progressBG
-		}">
-			<view class="gui-psv-progress-bar" 
+		<view 
+		class="gui-flex gui-rows" 
+		:class="['gui-justify-content-'+progressPosition]">
+			<view class="gui-psv-progress"
 			v-if="progressWidth > 0" 
 			:style="{
-				width  : progressBarWidth+'rpx',
+				width  : progressWidth+'rpx',
 				height : progressHeight+'rpx',
 				borderRadius : progressRadius+'rpx',
-				backgroundColor : progressBarBG,
-				marginLeft      : marginLeft +'rpx'
-			}"></view>
+				backgroundColor : progressBG
+			}">
+				<view class="gui-psv-progress-bar" 
+				v-if="progressWidth > 0" 
+				:style="{
+					width  : progressBarWidth+'rpx',
+					height : progressHeight+'rpx',
+					borderRadius : progressRadius+'rpx',
+					backgroundColor : progressBarBG,
+					marginLeft      : marginLeft +'rpx'
+				}"></view>
+			</view>
 		</view>
 	</view>
 </template>
@@ -66,6 +71,10 @@ export default {
 		progressBarBG : {
 			type    : String,
 			default : '#008AFF'
+		},
+		progressPosition : {
+			type:String,
+			default:'start'
 		}
 	},
 	created:function(){

lib/GraceUI5/components/gui-row.vue

@@ -0,0 +1,56 @@
+<template>
+	<view 
+	:class="classesRuntime" 
+	:style="styleRuntime">
+		<slot></slot>
+	</view>
+</template>
+<script>
+export default{
+	name  : "gui-column",
+	props:{
+		wrap               : {type:Boolean, default:false},
+		mainAxisAlignment  : {type:String, default:'flex-start'},
+		crossAxisAlignment : {type:String, default:'flex-start'},
+		customStyle        : {type:String, default:''},
+		customClasses      : {type:Array,  default:function(){return [];}}
+	},
+	data() {
+		return {
+			styleRuntime : '',
+			classesRuntime : []
+		}
+	},
+	methods:{
+		makeStyle : function(){
+			var styleRuntime = 'justify-content:'+this.mainAxisAlignment+'; ';
+			styleRuntime += 'align-items:'+this.crossAxisAlignment+'; ';
+			styleRuntime += this.customStyle;
+			this.styleRuntime = styleRuntime;
+		},
+		makeClasses : function(){
+			var classes = ['gui-flex', 'gui-rows'];
+			if(this.wrap){
+				classes.push('gui-wrap');
+			}else{
+				classes.push('gui-nowrap');
+			}
+			classes = classes.concat(this.customClasses);
+			this.classesRuntime = classes;
+		}
+	},
+	mounted:function(){
+		this.makeStyle();
+		this.makeClasses();
+	},
+	watch:{
+		mainAxisAlignment  : function(){this.makeStyle();},
+		crossAxisAlignment : function(){this.makeStyle();},
+		customStyle        : function(){this.makeStyle();},
+		customClasses        : function(){this.makeClasses();},
+		wrap               : function(){this.makeClasses();}
+	}
+}
+</script>
+<style scoped>
+</style>

lib/GraceUI5/components/gui-search.vue

@@ -1,95 +1,101 @@
-<template>
-	<view class="gui-flex gui-rows gui-nowrap gui-align-items-center" 
-	:style="{
-		height:height, 
-		backgroundColor:background,
-		borderRadius:borderRadius
-		}">
-		<text class="gui-search-icon gui-icons gui-block-text gui-text-center" @tap.stop="tapme" 
-		:style="{
-			color:iconColor, 
-			fontSize:iconFontSize, 
-			lineHeight:height, width:iconWidth
-		}">&#xe604;</text>
-		
-		<input type="text" :placeholder-class="placeholderClass" 
-		class="gui-search-input gui-flex1" :placeholder="placeholder" 
-		v-model="inputVal" v-if="!disabled" :focus="focus" 
-		:style="{
-			height:inputHeight, 
-			lineHeight:inputHeight, 
-			fontSize:inputFontSize, 
-			color:inputColor
-		}" 
-		@input="inputting" @confirm="confirm" confirm-type="search" />
-		
-		<text class="gui-search-input gui-flex1 gui-block-text" 
-		v-if="disabled" @tap.stop="tapme" 
-		:style="{
-			height:inputHeight, 
-			lineHeight:inputHeight, 
-			fontSize:inputFontSize, 
-			color:iconColor}">{{placeholder}}</text>
-		<text class="gui-search-icon gui-icons gui-block-text gui-text-center" 
-		v-if="inputVal.length > 0" @tap.stop="clearKwd" 
-		:style="{
-			color:iconColor, 
-			fontSize:iconFontSize, 
-			lineHeight:height, 
-			width:iconWidth}">&#xe78a;</text>
-	</view>
-</template>
-<script>
-export default{
-	name  : "gui-search",
-	props : {
-		height:{type:String, default:'66rpx'},
-		background:{type:String, default:'#FFFFFF'},
-		fontSize:{type:String, default:'28rpx'},
-		iconWidth:{type:String, default:'70rpx'},
-		iconColor:{type:String, default:'#A5A7B2'},
-		iconFontSize:{type:String, default:'30rpx'},
-		inputHeight:{type:String, default:'30rpx'},
-		inputFontSize:{type:String, default:'26rpx'},
-		inputColor:{type:String, default:'#323232'},
-		placeholder:{type:String, default:'关键字'},
-		placeholderClass:{type:String, default:''},
-		kwd:{type:String, default:''},
-		borderRadius:{type:String, default:'66rpx'},
-		disabled:{type:Boolean, default:false},
-		focus:{type:Boolean, default:false}
-	},
-	data() {
-		return {
-			inputVal : ''
-		}
-	},
-	created: function (){
-		this.inputVal = this.kwd;
-	},
-	watch:{
-		kwd : function(val, vo){
-			this.inputVal = val;
-		}
-	},
-	methods:{
-		clearKwd : function () {
-			this.inputVal = '';
-			this.$emit('clear', '');
-		},
-		inputting : function(e){
-			this.$emit('inputting', e.detail.value);
-		},
-		confirm : function (e) {
-			this.$emit('confirm', e.detail.value);
-			uni.hideKeyboard();
-		},
-		tapme : function () {
-			this.$emit('tapme')
-		}
-	}
-}
-</script>
-<style scoped>
-.gui-search-input{width:100rpx; margin:0 10rpx; border-width:0rpx; padding:0; background-color:rgba(255,255,255,0);}
+<template>
+	<view class="gui-flex gui-rows gui-nowrap gui-align-items-center" 
+	:style="{
+		height:height, 
+		backgroundColor:background,
+		borderRadius:borderRadius
+		}">
+		<text class="gui-search-icon gui-icons gui-block-text gui-text-center" @tap.stop="tapme" 
+		:style="{
+			color:iconColor, 
+			fontSize:iconFontSize, 
+			lineHeight:height, width:iconWidth
+		}">&#xe604;</text>
+		
+		<input 
+		type="text" 
+		:placeholder-class="placeholderClass" 
+		class="gui-search-input gui-flex1" 
+		:placeholder="placeholder" 
+		v-model="inputVal" 
+		v-if="!disabled" :focus="focus" 
+		:style="{
+			height:inputHeight, 
+			lineHeight:inputHeight, 
+			fontSize:inputFontSize, 
+			color:inputColor
+		}" 
+		@input="inputting" @confirm="confirm" />
+		
+		<text class="gui-search-input gui-flex1 gui-block-text" 
+		v-if="disabled" @tap.stop="tapme" 
+		:style="{
+			height:inputHeight, 
+			lineHeight:inputHeight, 
+			fontSize:inputFontSize, 
+			color:disableColor}">{{placeholder}}</text>
+		<text class="gui-search-icon gui-icons gui-block-text gui-text-center" 
+		v-if="inputVal.length > 0 && clearBtn" @tap.stop="clearKwd" 
+		:style="{
+			color:iconColor, 
+			fontSize:iconFontSize, 
+			lineHeight:height, 
+			width:iconWidth}">&#xe78a;</text>
+	</view>
+</template>
+<script>
+export default{
+	name  : "gui-search",
+	props : {
+		height:{type:String, default:'66rpx'},
+		background:{type:String, default:'#FFFFFF'},
+		fontSize:{type:String, default:'28rpx'},
+		iconWidth:{type:String, default:'70rpx'},
+		iconColor:{type:String, default:'#A5A7B2'},
+		iconFontSize:{type:String, default:'30rpx'},
+		inputHeight:{type:String, default:'30rpx'},
+		inputFontSize:{type:String, default:'26rpx'},
+		inputColor:{type:String, default:'#323232'},
+		placeholder:{type:String, default:'关键字'},
+		placeholderClass:{type:String, default:''},
+		disableColor:{type:String, default:'#666666'},
+		kwd:{type:String, default:''},
+		borderRadius:{type:String, default:'66rpx'},
+		disabled:{type:Boolean, default:false},
+		focus:{type:Boolean, default:false},
+		clearBtn:{type:Boolean, default:true}
+	},
+	data() {
+		return {
+			inputVal : ''
+		}
+	},
+	created: function (){
+		this.inputVal = this.kwd;
+	},
+	watch:{
+		kwd : function(val, vo){
+			this.inputVal = val;
+		}
+	},
+	methods:{
+		clearKwd : function () {
+			this.inputVal = '';
+			this.$emit('clear', '');
+		},
+		inputting : function(e){
+			this.$emit('inputting', e.detail.value);
+		},
+		confirm : function (e) {
+			this.$emit('confirm', e.detail.value);
+			uni.hideKeyboard();
+		},
+		tapme : function () {
+			this.$emit('tapme')
+		}
+	}
+}
+</script>
+<style scoped>
+.gui-search-input{width:100rpx; margin:0 10rpx; border-width:0rpx; padding:0; background-color:rgba(255,255,255,0);}
 </style>

lib/GraceUI5/components/gui-select-menu.vue

@@ -1,60 +1,92 @@
 <template>
-	<view class="gui-select-menu-wrap">
+	<view 
+	class="gui-select-menu-wrap">
 		<!-- #ifndef APP-NVUE -->
-		<view class="gui-masker" 
+		<view 
+		class="gui-masker" 
 		v-if="show"
 		@tap.stop.prevent="close" 
 		@touchmove.stop.prevent="stopfun" 
 		:style="{zIndex:(zIndex-1)}" ></view>
 		<!-- #endif -->
-		<view class="gui-select-menu-title gui-flex gui-rows gui-nowrap gui-justify-content-center gui-align-items-center" 
+		<view 
+		class="gui-select-menu-title gui-flex gui-rows gui-nowrap gui-justify-content-center gui-align-items-center" 
 		@click.stop="showMenu" 
 		id="menuMain">
-			<text class="gui-block-text gui-ellipsis" 
+			<text 
+			class="gui-block-text gui-ellipsis" 
 			:style="{
 				fontSize:fontSize, 
 				color:titleColor
 			}">{{itemsIn[currentIndex]}}</text>
-			<text :style="{fontSize:fontSize, color:iconColor}" 
+			<text 
+			:style="{fontSize:fontSize, color:iconColor}" 
 			class="gui-icons gui-select-menu-title-icon gui-block-text" 
 			v-if="!show">&#xe603;</text>
-			<text :style="{fontSize:fontSize, color:iconColor}" 
+			<text 
+			:style="{fontSize:fontSize, color:iconColor}" 
 			class="gui-icons gui-select-menu-title-icon gui-block-text" 
 			v-if="show">&#xe654;</text>
 		</view>
-		<view class="gui-select-menu" 
+		<view 
+		class="gui-select-menu" 
 		v-if="show" 
-		:style="{top : top +'px', height:height, zIndex:zIndex}" 
+		:style="{
+			top : top +'px', 
+			height:height, 
+			zIndex:zIndex 
+		}" 
 		@tap.stop="close" 
 		@touchmove.stop.prevent="stopfun">
-			<scroll-view :scroll-y="true" 
+			<view style="marginTop:90rpx; height:0px;"></view>
+			<view
+			style="padding-bottom:10rpx;"
+			@tap.stop="stopfun" 
+			class="gui-select-item gui-flex gui-rows gui-nowrap gui-align-items-center gui-bg-gray" 
+			v-if="isInput">
+				<input 
+				type="text" 
+				v-model="inputVal" 
+				class="gui-select-input gui-flex1 gui-border-box"
+				@confirm="addTag" 
+				@input="inputting" 
+				:placeholder="placeholder" />
+				<!-- 添加 -->
+				<text 
+				class="gui-select-input-btn gui-block-text" 
+				v-if="inputType == 'add'" 
+				:style="{color:activeColor}" 
+				@tap.stop="addTag">{{addBtnName}}</text>
+				<!--  -->
+				<text
+				class="gui-select-input-btn gui-block-text" 
+				v-else-if="inputType == 'search'" 
+				:style="{color:activeColor}" 
+				@tap.stop="addTag">搜索</text>
+			</view>
+			<scroll-view 
+			:scroll-y="true" 
 			:show-scrollbar="false" 
-			:style="{height:height, marginTop:'100rpx'}" 
-			class="gui-select-menus gui-border-box">
-				<view @tap.stop="stopfun" 
-				class="gui-select-item gui-flex gui-rows gui-nowrap gui-align-items-center gui-bg-gray" 
-				v-if="isInput">
-					<input type="text" 
-					v-model="inputVal" 
-					class="gui-select-input gui-flex1 gui-border-box"
-					@confirm="addTag" 
-					:placeholder="placeholder" />
-					<text class="gui-select-input-btn gui-block-text" 
-					:style="{color:activeColor}" 
-					@tap.stop="addTag">{{addBtnName}}</text>
-				</view>
-				<view class="gui-select-item gui-flex gui-rows gui-nowrap gui-align-items-center gui-bg-white" 
+			:style="{height:height}" 
+			class="gui-select-menus gui-border-box gui-bg-white" 
+			:scroll-into-view="itemTo">
+				<view 
+				class="gui-select-item gui-flex gui-rows gui-nowrap gui-align-items-center gui-bg-white" 
 				v-for="(item, index) in itemsIn" :key="index" 
-				:class="[index < getSize() ?'gui-border-b':'']" 
+				:class="[index < getSize() ? 'gui-border-b' : '']" 
 				:data-index="index" 
-				@tap.stop="select">
-					<text class="gui-selected-icon gui-icons" 
+				@tap.stop="select" 
+				:style="{height:itemHeight}" 
+				:id="'items'+index">
+					<text 
+					class="gui-selected-icon gui-icons" 
 					:style="{
 						color : index == currentIndex ? activeColor : color, 
 						fontSize:fontSize
 					}" 
 					v-if="index == currentIndex">&#xe7f8;</text>
-					<text :style="{
+					<text 
+					:style="{
 						fontSize:fontSize, 
 						color : index == currentIndex ? activeColor : color
 					}">{{item}}</text>
@@ -80,7 +112,9 @@ export default {
 		isInput        : { type : Boolean, default : false},
 		placeholder    : { type : String,  default : "请输入自定义条件"},
 		addBtnName     : { type : String,  default :"+ 添加"},
-		height         : { type : String,  default : '600rpx'}
+		height         : { type : String,  default : '600rpx'},
+		itemHeight     : { type : String,  default : '88rpx'},
+		inputType      : { type : String,  default : 'add' }
 	},
 	data() {
 		return {
@@ -89,7 +123,8 @@ export default {
 			showRes      : [],
 			inputVal     : '',
 			show         : false,
-			itemsIn      : []
+			itemsIn      : [],
+			itemTo       : ''
 		}
 	},
 	watch:{
@@ -132,21 +167,43 @@ export default {
 		},
 		addTag : function () {
 			if(this.inputVal == ''){return ;}
-			var newArr   = JSON.stringify(this.itemsIn);
-			newArr       = JSON.parse(newArr);
-			newArr.unshift(this.inputVal);
-			this.itemsIn = [];
-			this.itemsIn = newArr;
-			 //newArr;
-			this.$emit('submit', this.inputVal);
-			this.inputVal = '';
-			this.close();
+			if(this.inputType == 'add'){
+				var newArr   = JSON.stringify(this.itemsIn);
+				newArr       = JSON.parse(newArr);
+				newArr.unshift(this.inputVal);
+				this.itemsIn = [];
+				this.itemsIn = newArr;
+				 //newArr;
+				this.$emit('submit', this.inputVal);
+				this.inputVal = '';
+				this.currentIndex = 0;
+				this.close();
+			}else{
+				this.search();
+			}
 		},
 		getSize : function(){
 			return (this.itemsIn.length - 1);
 		},
 		setCurrentIndex : function (index) {
 			this.currentIndex = index;
+		},
+		search : function(){
+			var searchIndex = -1;
+			for(var i = 0; i < this.itemsIn.length; i++){
+				if(this.itemsIn[i].indexOf(this.inputVal) != -1){
+					searchIndex = i;
+					break;
+				}
+			}
+			if(searchIndex != -1){
+				this.itemTo = 'items' + searchIndex;
+			}
+		},
+		inputting : function(){
+			if(this.inputType == 'search'){
+				this.search();
+			}
 		}
 	}
 }
@@ -163,6 +220,6 @@ export default {
 .gui-select-menus{ height:300px;}
 .gui-select-item{padding:0 25rpx; height:88rpx;}
 .gui-selected-icon{margin-right:15rpx;}
-.gui-select-input{line-height:60rpx; height:100rpx; width:200rpx; padding:20rpx 0; font-size:26rpx; background-color:rgba(0,0,0,0);}
-.gui-select-input-btn{width:120rpx; line-height:60rpx; height:60rpx; text-align:center; font-size:24rpx; border-radius:6rpx;}
+.gui-select-input{line-height:68rpx; height:68rpx; width:200rpx; padding:20rpx; font-size:26rpx; background-color:rgba(255,255,255,1); border-radius:60rpx;}
+.gui-select-input-btn{width:100rpx; line-height:68rpx; height:68rpx; text-align:center; font-size:28rpx; border-radius:6rpx; margin-left:15rpx;}
 </style>

lib/GraceUI5/components/gui-slide-list.vue

@@ -1,136 +1,156 @@
-<template>
-	<scroll-view class="gui-slide-list" :scroll-y="scY" 
-	:show-scrollbar="false" 
-	:style="{width:width+'rpx', height:height+'px'}">
-		<view class="gui-slide-list-item gui-border-b" 
-		v-for="(item, index) in msgsIn" :key="index" 
-		:style="{width:width+'rpx'}">
-			<view class="gui-flex gui-rows gui-nowrap gui-align-items-center" 
-			:style="{
-			width:(width + btnWidth)+'rpx', overflow:'hidden',
-			transform:'translateX('+(moveIndex != index ? 0 : x)+'px)' 
-			}">
-				<view class="gui-slide-list-img-wrap" 
-				hover-class="gui-tap" 
-				@tap.stop.prevnet="itemTap(index)">
-					<image :src="item.img" class="gui-slide-list-img" 
-					mode="widthFix"></image>
-					<text class="gui-slide-list-point gui-block-text gui-bg-red gui-color-white" 
-					v-if="item.msgnumber > 0">{{item.msgnumber}}</text>
-				</view>
-				<view class="gui-slide-list-content" hover-class="gui-tap">
-					<gui-touch @thStart="thStart" @thMove="thMove" 
-					@thEnd="thEnd" @tapme="itemTap(index)" :datas="[index]">
-						<view class="gui-flex gui-rows gui-nowrap gui-space-between">
-						<text 
-						class="gui-slide-list-title-text gui-block-text">{{item.title}}</text>
-						<text 
-						class="gui-slide-list-desc gui-block-text">{{item.time}}</text>
-						</view>
-						<text 
-						class="gui-slide-list-desc gui-block-text gui-ellipsis">{{item.content}}</text>
-					</gui-touch>
-				</view>
-				<view class="gui-slide-btns gui-flex gui-rows gui-nowrap"
-				:style="{width:(btnWidth-2) +'rpx'}">
-					<text class="gui-slide-btn gui-block-text gui-text-center" 
-					v-for="(btn, btnIndex) in item.btns" :key="btnIndex" 
-					:style="{backgroundColor:btn.bgColor}" 
-					@tap.stop.prevnet="btnTap(index, btnIndex)">{{btn.name}}</text>
-				</view>
-			</view>
-		</view>
-	</scroll-view>
-</template>
-<script>
-export default{
-	name  : "gui-slide-list",
-	props : {
-		width       : { type : Number, default : 750},
-		msgs        : { type : Array,  default : function(){return [];}},
-		btnWidth    : { type : Number, default : 320},
-		height      : { type : Number, default : 200},
-	},
-	data() {
-		return {
-			msgsIn    : [],
-			damping   : 0.29,
-			moveIndex : -1,
-			x         : 0,
-			oX        : 0,
-			scY       : true,
-			btnWidthpx:160,
-			touchStart:false
-		}
-	},
-	created:function(){
-		this.init(this.msgs);
-		this.btnWidthpx = (uni.upx2px(this.btnWidth) * -1) + 2;
-	},
-	watch:{
-		msgs : function(nv){this.init(nv);}
-	},
-	methods:{
-		init     : function(msgs){
-			this.moveIndex = -1;
-			this.msgsIn    = msgs;
-		},
-		thStart  : function(e, index){
-			this.x         = 0;
-			this.moveIndex = index[0];
-			this.damping   = 0.25;
-		},
-		thMove   : function (e, index){
-			var x          = e[0][0];
-			var y          = e[0][1];
-			if(Math.abs(x) < Math.abs(y)){
-				this.scY   = true;
-				return ;
-			}else{
-				this.scY   = false;
-			}
-			if(x < 0){
-				this.x += x * this.damping;
-				if(this.x < this.btnWidthpx){this.x = this.btnWidthpx;}
-				this.damping *= 1.02;
-			}else{
-				this.scY   = true;
-			}
-		},
-		thEnd    : function(e, index){
-			if(this.x > this.btnWidthpx / 8){
-				this.x = 0;
-			}else{
-				this.x = this.btnWidthpx;
-			}
-			this.scY   = true;
-			this.oX    = this.x;
-		},
-		btnTap  : function (index, indexBtn) {
-			this.$emit('btnTap',index, indexBtn);
-		},
-		itemTap : function (index) {
-			if(this.oX < 0){
-				this.oX = 0;
-				this.moveIndex = -1;
-				return ;
-			}
-			this.$emit('itemTap',index);
-			this.moveIndex = -1;
-			this.oX = 0;
-		}
-	}
-}
-</script>
-<style scoped>
-.gui-slide-list{overflow:hidden;}
-.gui-slide-list-item{overflow:hidden; position:relative;}
-.gui-slide-list-img-wrap{font-size:0; position:relative; width:80rpx; height:80rpx; margin-left:25rpx; overflow:hidden;}
-.gui-slide-list-point{position:absolute; z-index:1; right:0; top:0;}
-.gui-slide-list-content{width:622rpx; overflow:hidden; padding-top:28rpx; padding-bottom:25rpx; margin-left:25rpx;}
-.gui-slide-list-title{overflow:hidden;}
-.gui-slide-btns{width:300rpx; height:116rpx;}
-.gui-slide-btn{width:100rpx; flex:1; height:125rpx; line-height:125rpx; height:125rpx; font-size:28rpx; color:#FFFFFF; overflow:hidden;}
-.gui-slide-list-img{width:80rpx; height:80rpx; border-radius:6rpx;} /* 列表图片外层样式 */
-.gui-slide-list-point{border-radius:32rpx; height:32rpx; line-height:32rpx; padding:0 10rpx; font-size:20rpx;} /* 消息数标签样式 */
+<template>
+	<scroll-view class="gui-slide-list" :scroll-y="scY" 
+	:show-scrollbar="false" 
+	:style="{width:width+'rpx', height:height+'px'}" 
+	@scrolltolower="scrolltolower">
+		<view class="gui-slide-list-item gui-border-b" 
+		v-for="(item, index) in msgsIn" :key="index" 
+		:style="{width:width+'rpx'}">
+			<view class="gui-flex gui-rows gui-nowrap gui-align-items-center" 
+			:style="{
+			width:(width + btnWidth)+'rpx', overflow:'hidden',
+			transform:'translateX('+(moveIndex != index ? 0 : x)+'px)' 
+			}">
+				<view class="gui-slide-list-img-wrap" 
+				hover-class="gui-tap" 
+				@tap.stop.prevnet="itemTap(index)">
+					<image :src="item.img" class="gui-slide-list-img" 
+					mode="widthFix"></image>
+					<text class="gui-slide-list-point gui-block-text gui-bg-red gui-color-white" 
+					v-if="item.msgnumber > 0">{{item.msgnumber}}</text>
+				</view>
+				<view class="gui-slide-list-content" hover-class="gui-tap">
+					<gui-touch @thStart="thStart" @thMove="thMove" 
+					@thEnd="thEnd" @tapme="itemTap(index)" :datas="[index]">
+						<view class="gui-flex gui-rows gui-nowrap gui-space-between">
+						<text 
+						class="gui-slide-list-title-text gui-block-text">{{item.title}}</text>
+						<text 
+						class="gui-slide-list-desc gui-block-text">{{item.time}}</text>
+						</view>
+						<text 
+						class="gui-slide-list-desc gui-block-text gui-ellipsis">{{item.content}}</text>
+					</gui-touch>
+				</view>
+				<view class="gui-slide-btns gui-flex gui-rows gui-nowrap"
+				:style="{width:(btnWidth-2) +'rpx'}">
+					<text class="gui-slide-btn gui-block-text gui-text-center" 
+					v-for="(btn, btnIndex) in item.btns" :key="btnIndex" 
+					:style="{backgroundColor:btn.bgColor}" 
+					@tap.stop.prevnet="btnTap(index, btnIndex)">{{btn.name}}</text>
+				</view>
+			</view>
+		</view>
+		<!-- 加载组件 -->
+		<view style="padding:30rpx;">
+			<gui-loadmore ref="loadmoreinslidelist"></gui-loadmore>
+		</view>
+	</scroll-view>
+</template>
+<script>
+export default{
+	name  : "gui-slide-list",
+	props : {
+		width       : { type : Number, default : 750},
+		msgs        : { type : Array,  default : function(){return [];}},
+		btnWidth    : { type : Number, default : 320},
+		height      : { type : Number, default : 200},
+	},
+	data() {
+		return {
+			msgsIn    : [],
+			damping   : 0.29,
+			moveIndex : -1,
+			x         : 0,
+			oX        : 0,
+			scY       : true,
+			btnWidthpx:160,
+			touchStart:false
+		}
+	},
+	created:function(){
+		this.init(this.msgs);
+		this.btnWidthpx = (uni.upx2px(this.btnWidth) * -1) + 2;
+	},
+	watch:{
+		msgs : function(nv){this.init(nv);}
+	},
+	methods:{
+		init     : function(msgs){
+			this.moveIndex = -1;
+			this.msgsIn    = msgs;
+		},
+		thStart  : function(e, index){
+			this.x         = 0;
+			this.moveIndex = index[0];
+			this.damping   = 0.25;
+		},
+		thMove   : function (e, index){
+			var x          = e[0][0];
+			var y          = e[0][1];
+			if(Math.abs(x) < Math.abs(y)){
+				this.scY   = true;
+				return ;
+			}else{
+				this.scY   = false;
+			}
+			if(x < 0){
+				this.x += x * this.damping;
+				if(this.x < this.btnWidthpx){this.x = this.btnWidthpx;}
+				this.damping *= 1.02;
+			}else{
+				this.scY   = true;
+			}
+		},
+		thEnd    : function(e, index){
+			if(this.x > this.btnWidthpx / 8){
+				this.x = 0;
+			}else{
+				this.x = this.btnWidthpx;
+			}
+			this.scY   = true;
+			this.oX    = this.x;
+		},
+		btnTap  : function (index, indexBtn) {
+			this.$emit('btnTap',index, indexBtn);
+		},
+		itemTap : function (index) {
+			if(this.oX < 0){
+				this.oX = 0;
+				this.moveIndex = -1;
+				return ;
+			}
+			this.$emit('itemTap',index);
+			this.moveIndex = -1;
+			this.oX = 0;
+		},
+		scrolltolower : function () {
+			var laodStatus = this.$refs.loadmoreinslidelist.loadMoreStatus;
+			if(laodStatus == 0){
+				this.$emit('scrolltolower');
+			}
+		},
+		startLoadig : function(){
+			this.$refs.loadmoreinslidelist.loading();
+		},
+		nomore : function () {
+			this.$refs.loadmoreinslidelist.nomore();
+		},
+		endLoading : function(){
+			this.$refs.loadmoreinslidelist.stoploadmore();
+		}
+	}
+}
+</script>
+<style scoped>
+.gui-slide-list{overflow:hidden;}
+.gui-slide-list-item{overflow:hidden; position:relative;}
+.gui-slide-list-img-wrap{font-size:0; position:relative; width:80rpx; height:80rpx; margin-left:25rpx; overflow:hidden;}
+.gui-slide-list-point{position:absolute; z-index:1; right:0; top:0;}
+.gui-slide-list-content{width:622rpx; overflow:hidden; padding-top:28rpx; padding-bottom:25rpx; margin-left:25rpx;}
+.gui-slide-list-title{overflow:hidden;}
+.gui-slide-btns{width:300rpx; height:116rpx;}
+.gui-slide-btn{width:100rpx; flex:1; height:125rpx; line-height:125rpx; height:125rpx; font-size:28rpx; color:#FFFFFF; overflow:hidden;}
+.gui-slide-list-img{width:80rpx; height:80rpx; border-radius:6rpx;} /* 列表图片外层样式 */
+.gui-slide-list-point{border-radius:32rpx; height:32rpx; line-height:32rpx; padding:0 10rpx; font-size:20rpx;} /* 消息数标签样式 */
 </style>

lib/GraceUI5/components/gui-submit-comment.vue

@@ -3,6 +3,7 @@
 	ref="guipopupforsubcomment" 
 	position="bottom" 
 	:canCloseByShade="true" 
+	@close="closePop" 
 	:zIndex="zIndex">
 		<view class="gui-comments gui-bg-white" 
 		@tap.stop.prevent="stopfun">
@@ -66,6 +67,10 @@ export default{
 		},
 		close      : function(){
 			this.$refs.guipopupforsubcomment.close();
+			this.$emit('close'); 
+		},
+		closePop   : function(){
+			this.$emit('close'); 
 		},
 		stopfun    : function(e){
 			e.stopPropagation();

lib/GraceUI5/components/gui-swiper.vue

@@ -1,157 +1,175 @@
-<template>
-	<view class="gui-swiper-card-wrap">
-		<swiper :style="{width:width+'rpx', height:heightIn+'rpx'}" 
-		class="gui-swiper-card" 
-		:indicator-dots="false" :interval="interval" :circular="true" 
-		:autoplay="autoplay" :current="currentIndex" 
-		:previous-margin="spacing+'rpx'" :next-margin="spacing+'rpx'" 
-		@change="swiperchange">
-			<swiper-item v-for="(item, index) in swiperItems" 
-			:key="index" class="gui-swiper-card-item gui-border-box">
-				<navigator class="gui-swiper-card-nav gui-transition-all" 
-				:url="item.url" :open-type="item.opentype" hover-class="none" 
-				v-if="item.opentype != 'click'" 
-				:style="{paddingLeft:current != index ? padding +'rpx':'0rpx',
-				paddingRight:current != index ? padding +'rpx':'0rpx',
-				paddingTop:current != index ? paddingY +'rpx':'0rpx',
-				paddingBottom:current != index ? paddingY +'rpx':'0rpx'}">
-					<image :style="{
-						borderRadius : borderRadius, 
-						width:current != index ? widthInSamll+'rpx':widthIn+'rpx',
-						height:current != index ? heightInSmall+'rpx':heightIn+'rpx',
-						opacity:current != index ? opacity : 1}" 
-						:src="item.img" class="gui-swiper-card-image gui-transition-all" />
-				</navigator>
-				<view class="gui-swiper-card-nav gui-transition-all" 
-				hover-class="none" v-if="item.opentype == 'click'" 
-				@tap.stop="taped" :data-index="index" 
-				:style="{paddingLeft:current != index ? padding +'rpx':'0rpx',
-				paddingRight:current != index ? padding +'rpx':'0rpx',
-				paddingTop:current != index ? paddingY +'rpx':'0rpx',
-				paddingBottom:current != index ? paddingY +'rpx':'0rpx'}">
-					<image :style="{
-						borderRadius : borderRadius, 
-						width:current != index ? widthInSamll+'rpx':widthIn+'rpx',
-						height:current != index ? heightInSmall+'rpx':heightIn+'rpx',
-						opacity:current != index ? opacity : 1}" 
-					:src="item.img" class="gui-swiper-card-image gui-transition-all" />
-				</view>
-				<view v-if="indicatorType == 'number'" 
-				class="gui-indicator-dot-numbers gui-flex gui-rows gui-nowrap" 
-				:style="{
-					height:indicatorBarHeight+'rpx', backgroundColor:indicatorBarBgColor, 
-					'border-bottom-left-radius':borderRadius, 'border-bottom-right-radius':borderRadius,
-					width:current != index ? widthInSamll+'rpx':widthIn+'rpx', 
-					left:current != index ? padding+'rpx':'0rpx', bottom:current != index ? paddingY+'rpx':'0rpx'}">
-					<text class="gui-indicator-dot-text" 
-					:style="{paddingLeft:'20rpx', 'fontStyle':'italic', color:titleColor}">{{index+1}}</text>
-					<text class="gui-indicator-dot-text" 
-					:style="{'fontSize':'36rpx', color:titleColor}">/</text>
-					<text class="gui-indicator-dot-text" 
-					:style="{fontSize:'28rpx', paddingRight:'20rpx', fontStyle:'italic', color:titleColor}">{{swiperItems.length}}</text>
-					<text class="gui-swiper-text gui-block-text gui-flex1 gui-ellipsis" 
-					:style="{color:titleColor, fontSize:titleSize, height:indicatorBarHeight+'rpx', 
-					lineHeight:indicatorBarHeight+'rpx'}">{{item.title}}</text>
-				</view>
-			</swiper-item>
-		</swiper>
-		<view class="gui-indicator-dots gui-flex gui-rows gui-nowrap gui-justify-content-center gui-align-items-center gui-border-box" 
-		v-if="indicatorType == 'dot'" 
-		:style="{width:width+'rpx', height:indicatorBarHeight+'rpx', position:indicatorPosition, 
-		paddingLeft:spacing+'rpx', paddingRight:spacing+'rpx', 'justify-content':indicatorDirection}">
-			<view class="gui-indicator-dots-wrap gui-flex gui-rows gui-nowrap gui-justify-content-center">
-				<view v-for="(item, index) in swiperItems" :key="index" 
-				:class="['gui-indicator-dot',current == index ? 'dot-show' : '']" 
-				:style="{
-					width           : current != index ? indicatorWidth+'rpx' : indicatorActiveWidth +'rpx',
-					height          : indicatorHeight+'rpx',
-					borderRadius    : indicatorRadius+'rpx',
-					backgroundColor : current != index ? indicatorColor : indicatorActiveColor}"></view>
-			</view>
-		</view>
-	</view>
-</template>
-<script>
-export default{
-	name  : "gui-swiper",
-	props : {
-		width :{ type : Number, default : 750 },
-		height:{ type : Number, default : 300 },
-		swiperItems : { type : Array, default : function(){return new Array();} },
-		borderRadius : { type : String, default : '10rpx'},
-		indicatorBarHeight:{type : Number, default : 68},
-		indicatorBarBgColor:{type : String, default : 'rgba(0,0,0,0)'},
-		indicatorWidth : { type:Number, default:18 },
-		indicatorActiveWidth :{ type:Number, default:18 },
-		indicatorHeight : { type:Number, default:18 },
-		indicatorRadius:{ type:Number, default:18 },
-		indicatorColor : { type : String, default : "rgba(255, 255, 255, 0.6)" },
-		indicatorActiveColor : { type : String, default : "#2B2E3D" },
-		indicatorType:{ type : String, default : "dot" },
-		indicatorPosition:{ type : String, default : "absolute" },
-		indicatorDirection:{type:String, default:'center'},
-		spacing : { type : Number, default : 50 },
-		padding : { type : Number, default : 26 },
-		interval : { type : Number, default : 5000 },
-		autoplay : { type : Boolean, default : true },
-		currentIndex : { type : Number, default : 0 },
-		opacity:{ type : Number, default:0.66},
-		titleColor:{type:String, default:"#FFFFFF"},
-		titleSize:{type:String, default:"28rpx"}
-	},
-	data() {
-		return {
-			current : 0,
-			isReady : false,
-			widthIn : 750,
-			heightIn  : 300,
-			widthInSamll:700,
-			heightInSmall:280,
-			paddingY:0
-		}
-	},
-	watch:{
-		currentIndex : function (val) {
-			this.current = val;
-		}
-	},
-	created:function(){
-		this.current = this.currentIndex;
-		this.init();
-	},
-	methods:{
-		init : function(){
-			// 图片宽高计算
-			this.widthIn   = this.width - this.spacing*2;
-			this.heightIn  = this.height / this.width * this.widthIn;
-			this.paddingY  = this.padding * this.height / this.width;
-			this.widthInSamll  = this.widthIn -  this.padding * 2;
-			this.heightInSmall = this.heightIn - this.paddingY * 2;
-		},
-		swiperchange : function (e) {
-			var current = e.detail.current;
-			this.current = current;
-			this.$emit('swiperchange', current);
-		},
-		taped : function(e){
-			this.$emit('taped', e.currentTarget.dataset.index);
-		}
-	}
-}
-</script>
-<style scoped>
-.gui-swiper-card-wrap{position:relative;}
-.gui-swiper-card{overflow:hidden;}
-.gui-swiper-card-item{font-size:0; overflow:hidden; line-height:0;}
-.gui-swiper-card-nav{font-size:0; position:relative;}
-.gui-indicator-dots{width:750rpx; overflow:hidden; z-index:1; left:0; bottom:0;}
-.gui-indicator-dot{margin:6rpx;}
-.gui-indicator-dots-wrap{padding:0 20rpx;}
-.gui-indicator-dot-text{text-align:center; line-height:68rpx; padding:0 4rpx; color:#FFFFFF; font-size:32rpx;}
-.gui-indicator-dot-numbers{overflow:hidden; align-items:center; position:absolute; z-index:1; left:0; bottom:0;}
-.gui-swiper-text{width:200rpx; line-height:68rpx; padding-right:25rpx; overflow:hidden;}
-/* #ifndef APP-NVUE */
-@keyframes dot-show{from{opacity:0.1;}to{opacity:1;}}
-.dot-show{animation:dot-show 300ms linear forwards;}
-/* #endif */
-</style>
+<template>
+	<view class="gui-swiper-card-wrap">
+		<swiper :style="{width:width+'rpx', height:heightIn+'rpx'}" 
+		class="gui-swiper-card" 
+		:indicator-dots="false" :interval="interval" :circular="true" 
+		:autoplay="autoplay" :current="currentIndex" 
+		:previous-margin="spacing+'rpx'" :next-margin="spacing+'rpx'" 
+		@change="swiperchange">
+			<swiper-item 
+			v-for="(item, index) in swiperItems" 
+			:key="index" 
+			class="gui-swiper-card-item gui-border-box">
+				<navigator 
+				class="gui-swiper-card-nav gui-transition-all" 
+				:url="item.url" :open-type="item.opentype" hover-class="none" 
+				v-if="item.opentype != 'click'" 
+				:style="{paddingLeft:current != index ? padding +'rpx':'0rpx',
+				paddingRight:current != index ? padding +'rpx':'0rpx',
+				paddingTop:current != index ? paddingY +'rpx':'0rpx',
+				paddingBottom:current != index ? paddingY +'rpx':'0rpx'}">
+					<image 
+					:style="{
+						borderRadius : borderRadius, 
+						width:current != index ? widthInSamll+'rpx':widthIn+'rpx',
+						height:current != index ? heightInSmall+'rpx':heightIn+'rpx',
+						opacity:current != index ? opacity : 1
+					}" 
+					:src="item.img" 
+					:mode="imgMode" 
+					class="gui-swiper-card-image gui-transition-all" />
+				</navigator>
+				<view 
+				class="gui-swiper-card-nav gui-transition-all" 
+				hover-class="none" 
+				v-if="item.opentype == 'click'" 
+				@tap.stop="taped" 
+				:data-index="index" 
+				:style="{paddingLeft:current != index ? padding +'rpx':'0rpx',
+				paddingRight:current != index ? padding +'rpx':'0rpx',
+				paddingTop:current != index ? paddingY +'rpx':'0rpx',
+				paddingBottom:current != index ? paddingY +'rpx':'0rpx'}">
+					<image 
+					:style="{
+						borderRadius : borderRadius, 
+						width:current != index ? widthInSamll+'rpx':widthIn+'rpx',
+						height:current != index ? heightInSmall+'rpx':heightIn+'rpx',
+						opacity:current != index ? opacity : 1
+					}" 
+					:src="item.img" 
+					:mode="imgMode" 
+					class="gui-swiper-card-image gui-transition-all" />
+				</view>
+				<view 
+				v-if="indicatorType == 'number'" 
+				class="gui-indicator-dot-numbers gui-flex gui-rows gui-nowrap" 
+				:style="{
+					height:indicatorBarHeight+'rpx', backgroundColor:indicatorBarBgColor, 
+					'border-bottom-left-radius':borderRadius, 'border-bottom-right-radius':borderRadius,
+					width:current != index ? widthInSamll+'rpx':widthIn+'rpx', 
+					left:current != index ? padding+'rpx':'0rpx', bottom:current != index ? paddingY+'rpx':'0rpx'}">
+					<text class="gui-indicator-dot-text" 
+					:style="{paddingLeft:'20rpx', 'fontStyle':'italic', color:titleColor}">{{index+1}}</text>
+					<text class="gui-indicator-dot-text" 
+					:style="{'fontSize':'36rpx', color:titleColor}">/</text>
+					<text class="gui-indicator-dot-text" 
+					:style="{fontSize:'28rpx', paddingRight:'20rpx', fontStyle:'italic', color:titleColor}">{{swiperItems.length}}</text>
+					<text class="gui-swiper-text gui-block-text gui-flex1 gui-ellipsis" 
+					:style="{color:titleColor, fontSize:titleSize, height:indicatorBarHeight+'rpx', 
+					lineHeight:indicatorBarHeight+'rpx'}">{{item.title}}</text>
+				</view>
+			</swiper-item>
+		</swiper>
+		<view 
+		class="gui-indicator-dots gui-flex gui-rows gui-nowrap gui-justify-content-center gui-align-items-center gui-border-box" 
+		v-if="indicatorType == 'dot'" 
+		:style="{width:width+'rpx', height:indicatorBarHeight+'rpx', position:indicatorPosition, 
+		paddingLeft:spacing+'rpx', paddingRight:spacing+'rpx', 'justify-content':indicatorDirection}">
+			<view class="gui-indicator-dots-wrap gui-flex gui-rows gui-nowrap gui-justify-content-center">
+				<view 
+				v-for="(item, index) in swiperItems" :key="index" 
+				:class="['gui-indicator-dot',current == index ? 'dot-show' : '']" 
+				:style="{
+					width           : current != index ? indicatorWidth+'rpx' : indicatorActiveWidth +'rpx',
+					height          : indicatorHeight+'rpx',
+					borderRadius    : indicatorRadius+'rpx',
+					backgroundColor : current != index ? indicatorColor : indicatorActiveColor}"></view>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+export default{
+	name  : "gui-swiper",
+	props : {
+		width :{ type : Number, default : 750 },
+		height:{ type : Number, default : 300 },
+		swiperItems : { type : Array, default : function(){return new Array();} },
+		borderRadius : { type : String, default : '10rpx'},
+		indicatorBarHeight:{type : Number, default : 68},
+		indicatorBarBgColor:{type : String, default : 'rgba(0,0,0,0)'},
+		indicatorWidth : { type:Number, default:18 },
+		indicatorActiveWidth :{ type:Number, default:18 },
+		indicatorHeight : { type:Number, default:18 },
+		indicatorRadius:{ type:Number, default:18 },
+		indicatorColor : { type : String, default : "rgba(255, 255, 255, 0.6)" },
+		indicatorActiveColor : { type : String, default : "#2B2E3D" },
+		indicatorType:{ type : String, default : "dot" },
+		indicatorPosition:{ type : String, default : "absolute" },
+		indicatorDirection:{type:String, default:'center'},
+		spacing : { type : Number, default : 50 },
+		padding : { type : Number, default : 26 },
+		interval : { type : Number, default : 5000 },
+		autoplay : { type : Boolean, default : true },
+		currentIndex : { type : Number, default : 0 },
+		opacity:{ type : Number, default:0.66},
+		titleColor:{type:String, default:"#FFFFFF"},
+		titleSize:{type:String, default:"28rpx"},
+		imgMode:{type:String, default:'widthFix'}
+	},
+	data() {
+		return {
+			current : 0,
+			isReady : false,
+			widthIn : 750,
+			heightIn  : 300,
+			widthInSamll:700,
+			heightInSmall:280,
+			paddingY:0
+		}
+	},
+	watch:{
+		currentIndex : function (val) {
+			this.current = val;
+		}
+	},
+	created:function(){
+		this.current = this.currentIndex;
+		this.init();
+	},
+	methods:{
+		init : function(){
+			// 图片宽高计算
+			this.widthIn   = this.width - this.spacing*2;
+			this.heightIn  = this.height / this.width * this.widthIn;
+			this.paddingY  = this.padding * this.height / this.width;
+			this.widthInSamll  = this.widthIn -  this.padding * 2;
+			this.heightInSmall = this.heightIn - this.paddingY * 2;
+		},
+		swiperchange : function (e) {
+			var current = e.detail.current;
+			this.current = current;
+			this.$emit('swiperchange', current);
+		},
+		taped : function(e){
+			this.$emit('taped', e.currentTarget.dataset.index);
+		}
+	}
+}
+</script>
+<style scoped>
+.gui-swiper-card-wrap{position:relative;}
+.gui-swiper-card{overflow:hidden;}
+.gui-swiper-card-item{font-size:0; overflow:hidden; line-height:0;}
+.gui-swiper-card-nav{font-size:0; position:relative;}
+.gui-indicator-dots{width:750rpx; overflow:hidden; z-index:1; left:0; bottom:0;}
+.gui-indicator-dot{margin:6rpx;}
+.gui-indicator-dots-wrap{padding:0 20rpx;}
+.gui-indicator-dot-text{text-align:center; line-height:68rpx; padding:0 4rpx; color:#FFFFFF; font-size:32rpx;}
+.gui-indicator-dot-numbers{overflow:hidden; align-items:center; position:absolute; z-index:1; left:0; bottom:0;}
+.gui-swiper-text{width:200rpx; line-height:68rpx; padding-right:25rpx; overflow:hidden;}
+/* #ifndef APP-NVUE */
+@keyframes dot-show{from{opacity:0.1;}to{opacity:1;}}
+.dot-show{animation:dot-show 300ms linear forwards;}
+/* #endif */
+</style>

lib/GraceUI5/components/gui-switch-navigation.vue

@@ -1,113 +1,157 @@
-<template>
-	<scroll-view :scroll-with-animation="scorllAnimation" 
-	:scroll-x="true" :show-scrollbar="false" 
-	:class="['gui-scroll-x', isCenter ? 'gui-nav-center' : '']" 
-	:style="{width:width+'rpx'}" 
-	:scroll-left="scrollLeft">
-		<view class="gui-scroll-x-items gui-columns" 
-		:id="'tab-'+index+(random+'')" 
-		:style="{
-			width:size == 0 ? 'auto' : size+'rpx', 
-			marginRight:margin+'rpx', paddingLeft:padding, paddingRight:padding
-		}" 
-		v-for="(item, index) in itemsIn" :key="index" @tap="change" :data-index="index">
-			<text :class="['gui-block-text', 'gui-border-box', currentIndexIn == index ? 'nav-active' : '']"
-			:style="{
-				color:currentIndexIn == index ? activeColor : color, 
-				textAlign : textAlign, lineHeight:lineHeight, 
-				fontSize:currentIndexIn == index ? activeFontSize : fontSize, 
-				fontWeight:currentIndexIn == index ? activeFontWeight : ''}">{{item.name}}</text>
-			<view class="gui-flex gui-rows" :style="{justifyContent:activeDirection}">
-				<view class="nav-active-line" 
-				:class="[currentIndexIn == index && animatie ?'gui-nav-scale':'']" 
-				:style="{
-					backgroundImage:activeLineBg, width:activeLineWidth, 
-					height:activeLineHeight, borderRadius:activeLineRadius
-				}" 
-				v-if="currentIndexIn == index"></view>
-			</view>
-		</view>
-	</scroll-view>
-</template>
-<script>
-export default {
-	name  : "gui-switch-navigation",
-	props : {
-		width              : {type : Number,  default : 690},
-		isCenter           : {type : Boolean, default : false},
-		currentIndex       : {type : Number,  default : 0},
-		size               : {type : Number,  default : 120},
-		fontSize           : {type : String,  default : '28rpx'},
-		activeFontSize     : {type : String,  default : '28rpx'},
-		items              : {type : Array,   default : function () {return []}},
-		activeLineBg       : {type : String,  default : "linear-gradient(to right, #66BFFF,#3388FF)"},
-		color              : {type : String,  default : "#333333"},
-		activeColor        : {type : String,  default : "#333333"},
-		activeLineHeight   : {type : String,  default : '6rpx'},
-		activeLineWidth    : {type : String,  default : "36rpx"},
-		activeLineRadius   : {type : String,  default : "0rpx"},
-		activeDirection    : {type : String,  default : ""},
-		activeFontWeight   : {type : Number,  default : 700},
-		margin             : {type : Number,  default : 0},
-		textAlign          : {type : String,  default : ''},
-		lineHeight         : {type : String,  default : '50rpx'},
-		padding            : {type : String,  default : '0rpx'},
-		animatie           : {type : Boolean, default : true},
-		autoLeft           : {type : String,  default : ''},
-		scorllAnimation    : {type : Boolean, default : true}
-	},
-	data(){
-		return {
-			currentIndexIn : 0,
-			itemsIn        : [],
-			random         : 1,
-			scrollLeft     : 0,
-			scrllTimer     : null
-		}
-	},
-	created:function(){
-		this.currentIndexIn = this.currentIndex;
-		this.itemsIn        = this.items;
-		this.random         = this.randomNum();
-	},
-	watch:{
-		currentIndex : function(value){
-			this.currentIndexIn = value;
-		},
-		currentIndexIn : function(val){
-			if(this.isCenter){return ;}
-			if(this.scrllTimer != null){clearTimeout(this.scrllTimer);}
-			this.scrllTimer = setTimeout(()=>{this.setLeft();}, 200);
-		},
-		items        : function(value){ this.itemsIn = value; }
-	},
-	methods:{
-		change    : function (e){
-			this.currentIndexIn = e.currentTarget.dataset.index;
-			this.$emit('change', Number(e.currentTarget.dataset.index))
-		},
-		randomNum : function () {
-			return parseInt(Math.random() * 1000);
-		},
-		setLeft   : function () {
-			if(this.isCenter){return ;}
-			var itemWidth = Number(this.margin) + Number(this.size);
-			var left      = (Number(this.currentIndexIn) + 1) * itemWidth - Number(this.width) / 2 - itemWidth / 2;
-			var maxLeft   = Number(this.itemsIn.length) * itemWidth - this.width;
-			maxLeft       = uni.upx2px(maxLeft - 30);
-			left          = uni.upx2px(left);
-			if(left > maxLeft){left = maxLeft;}
-			if(left < 0){left = 0;}
-			this.scrollLeft = left;
-		}
-	}
-}
-</script>
-<style scoped>
-.nav-active-line{margin-top:6rpx;}
-.gui-nav-center{justify-content:center; text-align:center;}
-/* #ifndef APP-NVUE */
-@keyframes gui-nav-scale{0%{transform: scale(0.1);} 100%{transform: scale(1);}}
-.gui-nav-scale{animation:gui-nav-scale 350ms forwards;}
-/* #endif */
+<template>
+	<scroll-view 
+	:scroll-with-animation="scorllAnimation" 
+	:scroll-x="true" 
+	:show-scrollbar="false" 
+	:class="['gui-scroll-x', isCenter ? 'gui-nav-center' : '']" 
+	:style="{width:width+'rpx'}" 
+	:scroll-into-view="autoLeft" 
+	:scroll-left="scrollLeft">
+		<view 
+		class="gui-scroll-x-items gui-columns" 
+		:id="'tab-'+index+(random+'')" 
+		:style="{
+			width:size == 0 ? 'auto' : size+'rpx', 
+			marginRight:margin+'rpx', 
+			paddingLeft:padding, 
+			paddingRight:padding
+		}" 
+		v-for="(item, index) in itemsIn" 
+		:key="index" 
+		@tap="change" 
+		:data-index="index">
+			<view class="gui-flex gui-nowrap gui-align-items-start" 
+			:class="[textAlign == 'center' ? 'gui-justify-content-center' : '']">
+				<text 
+				:class="[
+					'gui-block-text', 
+					'gui-border-box', 
+					currentIndexIn == index ? 'nav-active' : ''
+				]" 
+				:style="{
+					color:currentIndexIn == index ? activeColor : color, 
+					textAlign : textAlign, lineHeight:lineHeight, 
+					fontSize:currentIndexIn == index ? activeFontSize : fontSize, 
+					fontWeight:currentIndexIn == index ? activeFontWeight : ''}">{{item.name}}</text>
+				<view v-if="item.tips">
+					<text
+					v-if="item.tips != 'point'" 
+					class="gui-nav-tips gui-block-text" 
+					:style="tipsStyle">{{item.tips}}</text>
+					<text
+					v-else 
+					class="gui-nav-tips gui-block-text" 
+					:style="tipsStyle+'; width:12rpx; height:12rpx; over-flow:hidden; padding:0rpx; margin-top:10rpx;'"></text>
+				</view>
+			</view>
+			<view 
+			class="gui-flex gui-rows" 
+			:style="{justifyContent:activeDirection}">
+				<view class="nav-active-line" 
+				:class="[currentIndexIn == index && animatie ?'gui-nav-scale':'']" 
+				:style="{
+					backgroundImage:activeLineBg, width:activeLineWidth, 
+					height:activeLineHeight, borderRadius:activeLineRadius
+				}" 
+				v-if="currentIndexIn == index"></view>
+			</view>
+		</view>
+	</scroll-view>
+</template>
+<script>
+export default {
+	name  : "gui-switch-navigation",
+	props : {
+		width              : {type : Number,  default : 690},
+		isCenter           : {type : Boolean, default : false},
+		currentIndex       : {type : Number,  default : 0},
+		size               : {type : Number,  default : 120},
+		fontSize           : {type : String,  default : '28rpx'},
+		activeFontSize     : {type : String,  default : '28rpx'},
+		items              : {type : Array,   default : function () {return []}},
+		activeLineBg       : {type : String,  default : "linear-gradient(to right, #66BFFF,#3388FF)"},
+		color              : {type : String,  default : "#333333"},
+		activeColor        : {type : String,  default : "#333333"},
+		activeLineHeight   : {type : String,  default : '6rpx'},
+		activeLineWidth    : {type : String,  default : "36rpx"},
+		activeLineRadius   : {type : String,  default : "0rpx"},
+		activeDirection    : {type : String,  default : ""},
+		activeFontWeight   : {type : Number,  default : 700},
+		margin             : {type : Number,  default : 0},
+		textAlign          : {type : String,  default : ''},
+		lineHeight         : {type : String,  default : '50rpx'},
+		padding            : {type : String,  default : '0rpx'},
+		animatie           : {type : Boolean, default : true},
+		scorllAnimation    : {type : Boolean, default : true},
+		// #ifdef APP-NVUE
+		tipsStyle          : {
+			type : String, 
+			default : 'background-color:#FF0000; padding-left:10rpx; padding-right:10rpx; color:#FFFFFF; font-size:22rpx',
+		}
+		// #endif
+		// #ifndef APP-NVUE
+		tipsStyle          : {
+			type : String,  
+			default : 'background-color:#FF0000; padding:0 10rpx; color:#FFFFFF; font-size:22rpx',
+		}
+		// #endif
+	},
+	data(){
+		return {
+			currentIndexIn : 0,
+			itemsIn        : [],
+			random         : 1,
+			scrollLeft     : 0,
+			scrllTimer     : null,
+			autoLeft       : ''
+		}
+	},
+	created:function(){
+		this.currentIndexIn = this.currentIndex;
+		this.itemsIn        = this.items;
+		this.random         = this.randomNum();
+	},
+	watch:{
+		currentIndex : function(value){
+			this.currentIndexIn = value;
+		},
+		currentIndexIn : function(val){
+			if(this.scrllTimer != null){clearTimeout(this.scrllTimer);}
+			this.scrllTimer = setTimeout(()=>{this.setLeft();}, 200);
+		},
+		items        : function(value){ this.itemsIn = value; }
+	},
+	methods:{
+		change    : function (e){
+			this.currentIndexIn = e.currentTarget.dataset.index;
+			this.$emit('change', Number(e.currentTarget.dataset.index))
+		},
+		randomNum : function () {
+			return parseInt(Math.random() * 1000);
+		},
+		setLeft   : function () {
+			if(this.size < 1){
+				this.autoLeft = 'tab-'+this.currentIndexIn+''+this.random;
+				return ;
+			}
+			var itemWidth = Number(this.margin) + Number(this.size);
+			var left      = (Number(this.currentIndexIn) + 1) * itemWidth - Number(this.width) / 2 - itemWidth / 2;
+			var maxLeft   = Number(this.itemsIn.length) * itemWidth - this.width;
+			maxLeft       = uni.upx2px(maxLeft - 30);
+			left          = uni.upx2px(left);
+			if(left > maxLeft){left = maxLeft;}
+			if(left < 0){left = 0;}
+			this.scrollLeft = left;
+		}
+	}
+}
+</script>
+<style scoped>
+.nav-active-line{margin-top:6rpx;}
+.gui-nav-center{justify-content:center; text-align:center;}
+/* #ifndef APP-NVUE */
+@keyframes gui-nav-scale{0%{transform: scale(0.1);} 100%{transform: scale(1);}}
+.gui-nav-scale{animation:gui-nav-scale 350ms forwards;}
+/* #endif */
+.gui-nav-tips{text-align:center; line-height:30rpx; height:30rpx; border-radius:50rpx; margin-top:5rpx; margin-left:8rpx;}
 </style>

lib/GraceUI5/css/graceUI.css

@@ -1,307 +1,309 @@
-/* #ifdef MP-BAIDU */
-@import "iconsforbaidu.css";
-/* #endif */
-
-/* 规划 H5 端字体 */
-/* #ifdef H5 */
-body{font-family:-apple-system,Helvetica,sans-serif,Arial;}
-/* #endif */
-
-/* 图标加载 */
-/* #ifndef APP-NVUE */
-	/* #ifndef MP-BAIDU */
-	@font-face{
-		font-family : "gui-iconfont";
-		font-weight : normal;
-		font-style  : normal; 
-		src         : url('@/static/grace.ttf') format('truetype');
-	}
-	/* #endif */
-.gui-icons{font-family:"gui-iconfont"; font-style:normal;}
-/* #endif */
-
-/* 页面主体结构 */
-.gui-body{width:750rpx;}
-
-/* 去除图片空白 */
-.gui-img-in{font-size:0;}
-
-/* #ifndef APP-NVUE */
-.gui-flex{display:flex;}
-.gui-border-box{box-sizing:border-box;}
-.gui-body{width:750rpx; box-sizing:border-box;}
-/* #endif */
-
-
-/* flex 布局 */
-.gui-rows{flex-direction:row;}
-.gui-columns{flex-direction:column;}
-.gui-wrap{flex-direction:row; flex-wrap:wrap;}
-.gui-nowrap{flex-direction:row; flex-wrap:nowrap;}
-.gui-space-around{justify-content:space-around;}
-.gui-space-between{justify-content:space-between;}
-.gui-justify-content-start{justify-content:flex-start;}
-.gui-justify-content-center{justify-content:center;}
-.gui-justify-content-end{justify-content:flex-end;}
-.gui-align-items-start{align-items:flex-start;}
-.gui-align-items-center{align-items:center;}
-.gui-align-items-end{align-items:flex-end;}
-.gui-flex1{flex:1;}
-
-/* 文本对齐 */
-.gui-text-left{text-align:left;}
-.gui-text-center{text-align:center;}
-.gui-text-right{text-align:right;}
-.gui-ellipsis{overflow:hidden;}
-/* #ifndef APP-NVUE */
-.gui-ellipsis{white-space:nowrap; text-overflow:ellipsis;}
-.gui-block-text{display:block;}
-/* #endif */
-
-/* 文本修饰 */
-.gui-bold{font-weight:bold;}
-.gui-line-through{text-decoration:line-through;}
-.gui-underline{text-decoration:underline;}
-.gui-italic{font-style:italic;}
-
-/* 定位 */
-.gui-relative{position:relative;}
-.gui-absolute-lt{position:absolute; z-index:2; left:0; top:0;}
-.gui-absolute-rt{position:absolute; z-index:2; right:0; top:0;}
-.gui-absolute-lb{position:absolute; z-index:2; left:0; bottom:0;}
-.gui-absolute-rb{position:absolute; z-index:2; right:0; bottom:0;}
-.gui-fixed-lt{position:fixed; z-index:2; left:0; top:0;}
-.gui-fixed-rt{position:fixed; z-index:2; right:0; top:0;}
-.gui-fixed-lb{position:fixed; z-index:2; left:0; bottom:0;}
-.gui-fixed-rb{position:fixed; z-index:2; right:0; bottom:0;}
-
-/* 背景色 */
-.gui-bg-red{background-color:#EE0A25 !important;}
-.gui-bg-green{background-color:#07C160 !important;}
-.gui-bg-blue{background-color:#008AFF !important;}
-.gui-bg-orange{background-color:#ED6A0C !important;}
-.gui-bg-yellow{background-color:#FBDE4E !important;}
-.gui-bg-purple{background-color:#8A3FD4 !important;}
-.gui-bg-white{background-color:#FFFFFF !important;}
-.gui-bg-black{background-color:#2B2E3D !important;}
-.gui-bg-black{background-color:#2B2E3D !important;}
-.gui-bg-black2{background-color:#656565 !important;}
-.gui-bg-black3{background-color:#969799 !important;}
-.gui-bg-black4{background-color:#C8C9CC !important;}
-.gui-bg-black-opacity7{background-color:rgba(0,0,0,0.7);}
-.gui-bg-black-opacity5{background-color:rgba(0,0,0,0.5);}
-.gui-bg-black-opacity3{background-color:rgba(0,0,0,0.3);}
-.gui-gtbg-red{background-image:linear-gradient(45deg, #FF0066 , #D50000) !important;}
-.gui-gtbg-blue{background-image:linear-gradient(45deg, #5887DF , #008AFF) !important;}
-.gui-gtbg-green{background-image:linear-gradient(45deg, #39B55A , #8DC63E) !important;}
-.gui-bg-gray{background-color:#F7F8FA !important;}
-.gui-bg-white{background-color:#FFFFFF !important;}
-
-
-/* 内置颜色 */
-.gui-color-black{color:#2B2E3D !important;}
-.gui-color-white{color:#FFFFFF !important;}
-.gui-color-gray{color:rgba(69, 90, 100, 0.6) !important;}
-.gui-color-gray-light{color:rgba(69, 90, 100, 0.3) !important;}
-.gui-color-blue{color:#008AFF !important;}
-.gui-color-red{color:#EE0A25 !important;}
-.gui-color-orange{color:#ED6A0C !important;}
-.gui-color-purple{color:#8A3FD4 !important;}
-.gui-color-green{color:#39B55A !important;}
-.gui-color-yellow{color:#FBDE4E !important;}
-
-
-
-/* 边框 */
-/* #ifdef APP-NVUE */
-.gui-border{border-style:solid; border-width:1rpx; border-color:#F1F2F3;}
-.gui-border-l{border-left-style:solid; border-left-width:1rpx; border-left-color:#F1F2F3;}
-.gui-border-r{border-right-style:solid; border-right-width:1rpx; border-right-color:#F1F2F3;}
-.gui-border-t{border-top-style:solid; border-top-width:1rpx; border-top-color:#F1F2F3;}
-.gui-border-b{border-bottom-style:solid; border-bottom-width:1rpx; border-bottom-color:#F1F2F3;}
-.gui-noborder{border-right-width:0; border-top-width:0; border-left-width:0; border-bottom-width:0;}
-/* #endif */
-/* #ifndef APP-NVUE */
-.gui-border{border:1rpx solid #F1F2F3;}
-.gui-border-l{border-left:1rpx solid #F1F2F3;}
-.gui-border-r{border-right:1rpx solid #F1F2F3;}
-.gui-border-t{border-top:1rpx solid #F1F2F3;}
-.gui-border-b{border-bottom:1rpx solid #F1F2F3;}
-.gui-noborder{border:none !important;}
-/* #endif */
-
-/* 自定义头部导航相关 */
-.gui-header-content{width:100rpx; flex:1; text-align:center; margin-left:10rpx; margin-right:168rpx;}
-.gui-headr-back{width:148rpx; line-height:40px; font-size:32rpx;}
-
-
-/* 宫格布局 */
-.gui-grids{padding:0;}
-.gui-grids-items{width:138rpx;}
-/* #ifndef APP-NVUE */
-.gui-grids-items{box-sizing:border-box;}
-/* #endif */
-.gui-grids-icon{height:80rpx; font-size:68rpx; line-height:80rpx; text-align:center;}
-/* #ifndef APP-NVUE */
-.gui-grids-icon{display:block; width:100%;}
-/* #endif */
-.gui-grids-icon-img{width:80rpx; height:80rpx; border-radius:6rpx;}
-.gui-grids-text{line-height:50rpx; text-align:center; font-size:24rpx; margin-top:2px;}
-/* #ifndef APP-NVUE */
-.gui-grids-text{display:block; width:100%;}
-/* #endif */
-
-
-/* 列表样式 */
-/* #ifndef APP-NVUE */
-.gui-list-items, .gui-list-title{display:flex;}
-.gui-list-icon, .gui-list-title-text, .gui-list-title-desc, .gui-list-body-desc, .gui-list-arrow-right{display:block;}
-/* #endif */
-.gui-list-items{flex-direction:row; flex-wrap:nowrap; align-items:center; justify-content:center;}
-.gui-list-icon{width:80rpx; height:80rpx; line-height:80rpx; text-align:center; font-size:44rpx;}
-.gui-list-image{width:80rpx; height:80rpx; border-radius:80rpx; font-size:0;}
-.gui-list-body{padding:25rpx 0; margin-left:25rpx; width:100rpx; flex:1;}
-.gui-list-title{flex-direction:row; flex-wrap:nowrap; justify-content:space-between; align-items:center;}
-.gui-list-one-line{line-height:60rpx !important;}
-.gui-list-title-text{font-size:26rpx; line-height:44rpx;}
-.gui-list-title-desc{font-size:22rpx; line-height:30rpx;}
-.gui-list-body-desc{font-size:22rpx; line-height:32rpx;}
-.gui-list-arrow-right{width:50rpx; height:50rpx; line-height:50rpx; font-size:30rpx; text-align:right;}
-
-
-/* 徽章 */
-.gui-badge{border-radius:38rpx; height:38rpx; line-height:38rpx; padding:0 13rpx; font-size:22rpx;}
-.gui-badge-absolute{position:absolute; right:0rpx; top:4rpx; z-index:1;}
-.gui-badge-point{width:20rpx; height:20rpx; border-radius:12rpx; position:absolute; right:4rpx; top:4rpx; z-index:1; background-color:#FF0000;}
-.gui-badge-gender{width:38rpx; height:38rpx; border-radius:30rpx; text-align:center; font-size:22rpx !important; line-height:38rpx; position:absolute; right:6rpx; top:4rpx; z-index:1;}
-
-
-/* 滚动区域 */
-/* #ifndef APP-NVUE */
-.gui-scroll-x{display:flex; white-space:nowrap;}
-.gui-scroll-x-item, .gui-scroll-x-items{display:inline-flex; vertical-align:top;}
-/* #endif */
-/* #ifdef MP-ALIPAY */
-.gui-scroll-x{display:block; white-space:nowrap;}
-/* #endif */
-.gui-scroll-x{width:750rpx; flex-direction:row; overflow:hidden;}
-
-
-/* 卡片列表 */
-.gui-card-list{}
-.gui-card-item{width:330rpx; margin-bottom:30rpx;}
-.gui-card-img{width:330rpx; height:191rpx; overflow:hidden; position:relative;}
-.gui-card-title{margin-top:3px;}
-.gui-card-desc{margin-top:3px;}
-.gui-card-tip{width:68rpx; height:40rpx; line-height:40rpx; text-align:center;}
-.gui-card-mask-title{line-height:60rpx; height:60rpx; padding:0 10rpx; width:330rpx;}
-
-
-/* 底部导航相关 */
-.gui-footer-icon-buttons{width:80rpx; height:80rpx; margin:10rpx;}
-.gui-footer-icon-buttons-icon{text-align:center; font-size:38rpx; line-height:50rpx;}
-.gui-footer-icon-buttons-text{text-align:center; font-size:20rpx; line-height:30rpx;}
-.gui-footer-large-buttons{margin-left:25rpx; margin-right:25rpx;}
-.gui-footer-large-button{width:218rpx; height:80rpx;}
-.gui-footer-large-button-text{line-height:80rpx !important;}
-
-/* 通用标题布局 */
-.gui-title-line{width:50rpx; height:1px; background-color:#E1E2E3; flex:1;}
-.gui-title-text{line-height:60rpx;}
-.gui-title-icon{width:50rpx; font-size:32rpx;}
-
-/* 表单 */
-.gui-form{overflow:hidden;}
-.gui-form-item{flex-direction:row; flex-wrap:nowrap; align-items:center;}
-.gui-form-label{width:130rpx; height:100rpx; font-size:28rpx; line-height:100rpx; overflow:hidden;}
-.gui-form-icon{width:60rpx; height:60rpx; line-height:60rpx; font-size:28rpx;}
-.gui-form-body{width:200rpx; margin-left:20rpx; overflow:hidden; flex:1;}
-.gui-form-input{height:40rpx; line-height:40rpx; margin:20rpx 0; background-color:rgba(255,255,255,0); border-width:0px; font-size:28rpx;}
-.gui-check-item{margin:10rpx 10rpx 0 0; padding:0 10rpx; font-size:28rpx; flex-direction:row; flex-wrap:nowrap; align-items:center;}
-.gui-check-item-y{margin:10rpx 0; font-size:28rpx;}
-.gui-textarea{height:120rpx; padding:15rpx; line-height:38rpx; background-color:rgba(255,255,255,0); border-width:0px; font-size:28rpx;}
-@font-face{font-family:"gui-formicons"; src:url('data:application/ttf;charset=utf-8;base64,OLh6+EVGahJS0OU2yaKO26Kiu6Zv+fbC+9P6l/wm8ZwtrOU5zo2XwdDjj7ilb9szx6Pz8hzzU1DUMrbXMHC2NbU15WTlxOxUdK2llbX0DSSdFF0GClXLlRPIOJppGChZi5s6MnpKNvaqMLkwKoD8NsI9B7wqBANQgCNQhGDQgBAwhFKwhHGhBeDCDCOAI2YElRARjiAS2EBlMIQx4iGInC9nJQTHaVXQA5E8EE500AB910O4gBKhATdCAWWEFskIYcQBnigDbEBX2IBwYQHyQhIThBohj9KScAF0gKAuQMEpALsJAHSEG+/kuiIgA4aBqIoCiQhzQx6qgEABMoBTShNDCC5oAC1AQWUAuIQRYwhzaCM7QFGOgo6EHXQAn6DDbQJNjjczuo4gsok+FuApClC9pt9nPwK3ehR05loNUk');}
-
-/* 底部导航 */
-/* #ifndef APP-NVUE */
-.gui-form-item{display:flex;}
-.gui-form-label, .gui-form-icon{display:block;}
-.gui-form-picker{display:flex;}
-.gui-check-item{display:flexbox;}
-.gui-check-item-y{display:block;}
-.gui-textarea{box-sizing:border-box;}
-/* #endif */
-
-/* 评论列表 */
-.gui-comments{}
-.gui-comments-items{margin-top:35rpx;}
-.gui-comments-face{width:80rpx; height:80rpx; border-radius:80rpx; margin-right:25rpx;}
-.gui-comments-body{width:580rpx; overflow:hidden;}
-.gui-comments-header-text{line-height:40rpx;}
-.gui-comments-info{margin-top:2px;}
-.gui-comments-info-text{font-size:22rpx; line-height:40rpx; margin-top:10rpx;}
-.gui-comments-content{line-height:36rpx; font-size:26rpx; padding:8rpx 0;}
-.gui-comments-replay{font-size:24rpx; color:#666666; border-radius:3px; margin:3px 0; padding:15rpx; line-height:36rpx;}
-.gui-comments-replay-btn{font-size:20rpx; line-height:44rpx; padding:0rpx 20rpx; border-radius:44rpx;}
-.gui-comments-imgs{margin:8rpx 0;}
-.gui-comments-image{width:180rpx; height:128rpx; margin-right:10rpx; margin-bottom:10rpx; font-size:0; overflow:hidden;}
-
-/* 底部导航相关 */
-.gui-footer-input-body{padding:0 20rpx; height:70rpx; border-radius:66rpx; margin:0 30rpx;}
-.gui-footer-input-icon{width:66rpx; text-align:center; line-height:66rpx; font-size:30rpx; margin-right:10rpx;}
-.gui-footer-input{width:100rpx; flex:1; font-size:26rpx; height:32rpx; line-height:32rpx; padding:0; overflow:hidden;}
-
-.gui-common-line{height:20rpx; background-color:#F7F8FA;}
-
-
-/* css3 动画 不支持 nvue */
-/* #ifndef APP-NVUE */
-.gui-transition-all{transition:all 0.2s ease-in 0s;}
-/* 使用记录 : gui-switch-navigation2 gui-popup */
-@keyframes gui-fade-in{0%{opacity:0;} 100%{opacity:1;}}
-.gui-fade-in{animation:gui-fade-in 350ms ease-in forwards;}
-/* 使用记录 : gui-image gui-popup */
-@keyframes gui-fade-out{0%{opacity:1;} 100%{opacity:0;}}
-.gui-fade-out{animation:gui-fade-out 350ms ease-out forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-top-in{0%{transform:translateY(-1000px);} 100%{transform:translateY(0px);}}
-.gui-top-in{animation:gui-top-in 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-top-out{0%{transform:translateY(0px);} 100%{transform:translateY(-1000px);}}
-.gui-top-out{animation:gui-top-out 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-bottom-in{0%{transform:translateY(600px);} 100%{transform:translateY(0px);}}
-.gui-bottom-in{animation:gui-bottom-in 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-bottom-out{0%{transform:translateY(0px);} 100%{transform:translateY(600px);}}
-.gui-bottom-out{animation:gui-bottom-out 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-left-in{0%{transform:translateX(-600px);} 100%{transform:translateX(0px);}}
-.gui-left-in{animation:gui-left-in 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-left-out{0%{transform:translateX(0px);} 100%{transform:translateX(-600px);}}
-.gui-left-out{animation:gui-left-out 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-right-in{0%{transform:translateX(600px);} 100%{transform:translateX(0px);}}
-.gui-right-in{animation:gui-right-in 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-right-out{0%{transform:translateX(0px);} 100%{transform:translateX(600px);}}
-.gui-right-out{animation:gui-right-out 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-scale-in{0%{transform:scale(0.3,0.3);} 100%{transform:scale(1,1);}}
-.gui-scale-in{animation:gui-scale-in 350ms linear forwards;}
-/* 使用记录 : gui-popup */
-@keyframes gui-scale-out{0%{transform:scale(1,1);} 100%{transform:scale(0.3,0.3);}}
-.gui-scale-out{animation:gui-scale-out 350ms linear forwards;}
-/* 使用记录 : gui-page */
-@keyframes gui-rotate360{0%{transform:rotate(0deg);} 50%{transform:rotate(180deg);} 100%{transform:rotate(360deg);}}
-.gui-rotate360{animation:gui-rotate360 1200ms infinite linear;}
-/* #endif */
-
-
-/* 不支持 nvue 的常用样式 */
-/* #ifndef APP-NVUE */
-.gui-box-shadow{box-shadow:0px 0px 16rpx #323232;}
-.gui-transition-all{transition:all 0.2s ease-in 0s;}
-::-webkit-scrollbar {display: none;}
-/* #endif */
+/* #ifdef MP-BAIDU */
+@import "iconsforbaidu.css";
+/* #endif */
+
+/* 规划 H5 端字体 */
+/* #ifdef H5 */
+body{font-family:-apple-system,Helvetica,sans-serif,Arial;}
+/* #endif */
+
+/* 图标加载 */
+/* #ifndef APP-NVUE */
+	/* #ifndef MP-BAIDU */
+	@font-face{
+		font-family : "gui-iconfont";
+		font-weight : normal;
+		font-style  : normal; 
+		src         : url('@/static/grace.ttf') format('truetype');
+	}
+	/* #endif */
+.gui-icons{font-family:"gui-iconfont"; font-style:normal;}
+/* #endif */
+
+/* 页面主体结构 */
+.gui-body{width:750rpx;}
+
+/* 去除图片空白 */
+.gui-img-in{font-size:0;}
+
+/* #ifndef APP-NVUE */
+.gui-flex{display:flex;}
+.gui-border-box{box-sizing:border-box;}
+.gui-body{width:750rpx; box-sizing:border-box;}
+/* #endif */
+
+
+/* flex 布局 */
+.gui-rows{flex-direction:row;}
+.gui-row{flex-direction:row;}
+.gui-columns{flex-direction:column;}
+.gui-column{flex-direction:column;}
+.gui-wrap{flex-direction:row; flex-wrap:wrap;}
+.gui-nowrap{flex-direction:row; flex-wrap:nowrap;}
+.gui-space-around{justify-content:space-around;}
+.gui-space-between{justify-content:space-between;}
+.gui-justify-content-start{justify-content:flex-start;}
+.gui-justify-content-center{justify-content:center;}
+.gui-justify-content-end{justify-content:flex-end;}
+.gui-align-items-start{align-items:flex-start;}
+.gui-align-items-center{align-items:center;}
+.gui-align-items-end{align-items:flex-end;}
+.gui-flex1{flex:1;}
+
+/* 文本对齐 */
+.gui-text-left{text-align:left;}
+.gui-text-center{text-align:center;}
+.gui-text-right{text-align:right;}
+.gui-ellipsis{overflow:hidden;}
+/* #ifndef APP-NVUE */
+.gui-ellipsis{white-space:nowrap; text-overflow:ellipsis;}
+.gui-block-text{display:block;}
+/* #endif */
+
+/* 文本修饰 */
+.gui-bold{font-weight:bold;}
+.gui-line-through{text-decoration:line-through;}
+.gui-underline{text-decoration:underline;}
+.gui-italic{font-style:italic;}
+
+/* 定位 */
+.gui-relative{position:relative;}
+.gui-absolute-lt{position:absolute; z-index:2; left:0; top:0;}
+.gui-absolute-rt{position:absolute; z-index:2; right:0; top:0;}
+.gui-absolute-lb{position:absolute; z-index:2; left:0; bottom:0;}
+.gui-absolute-rb{position:absolute; z-index:2; right:0; bottom:0;}
+.gui-fixed-lt{position:fixed; z-index:2; left:0; top:0;}
+.gui-fixed-rt{position:fixed; z-index:2; right:0; top:0;}
+.gui-fixed-lb{position:fixed; z-index:2; left:0; bottom:0;}
+.gui-fixed-rb{position:fixed; z-index:2; right:0; bottom:0;}
+
+/* 背景色 */
+.gui-bg-red{background-color:#EE0A25 !important;}
+.gui-bg-green{background-color:#07C160 !important;}
+.gui-bg-blue{background-color:#008AFF !important;}
+.gui-bg-orange{background-color:#ED6A0C !important;}
+.gui-bg-yellow{background-color:#FBDE4E !important;}
+.gui-bg-purple{background-color:#8A3FD4 !important;}
+.gui-bg-white{background-color:#FFFFFF !important;}
+.gui-bg-black{background-color:#2B2E3D !important;}
+.gui-bg-black{background-color:#2B2E3D !important;}
+.gui-bg-black2{background-color:#656565 !important;}
+.gui-bg-black3{background-color:#969799 !important;}
+.gui-bg-black4{background-color:#C8C9CC !important;}
+.gui-bg-black-opacity7{background-color:rgba(0,0,0,0.7);}
+.gui-bg-black-opacity5{background-color:rgba(0,0,0,0.5);}
+.gui-bg-black-opacity3{background-color:rgba(0,0,0,0.3);}
+.gui-gtbg-red{background-image:linear-gradient(45deg, #FF0066 , #D50000) !important;}
+.gui-gtbg-blue{background-image:linear-gradient(45deg, #5887DF , #008AFF) !important;}
+.gui-gtbg-green{background-image:linear-gradient(45deg, #39B55A , #8DC63E) !important;}
+.gui-bg-gray{background-color:#F7F8FA !important;}
+.gui-bg-white{background-color:#FFFFFF !important;}
+
+
+/* 内置颜色 */
+.gui-color-black{color:#2B2E3D !important;}
+.gui-color-white{color:#FFFFFF !important;}
+.gui-color-gray{color:rgba(69, 90, 100, 0.6) !important;}
+.gui-color-gray-light{color:rgba(69, 90, 100, 0.3) !important;}
+.gui-color-blue{color:#008AFF !important;}
+.gui-color-red{color:#EE0A25 !important;}
+.gui-color-orange{color:#ED6A0C !important;}
+.gui-color-purple{color:#8A3FD4 !important;}
+.gui-color-green{color:#39B55A !important;}
+.gui-color-yellow{color:#FBDE4E !important;}
+
+
+
+/* 边框 */
+/* #ifdef APP-NVUE */
+.gui-border{border-style:solid; border-width:1rpx; border-color:#F1F2F3;}
+.gui-border-l{border-left-style:solid; border-left-width:1rpx; border-left-color:#F1F2F3;}
+.gui-border-r{border-right-style:solid; border-right-width:1rpx; border-right-color:#F1F2F3;}
+.gui-border-t{border-top-style:solid; border-top-width:1rpx; border-top-color:#F1F2F3;}
+.gui-border-b{border-bottom-style:solid; border-bottom-width:1rpx; border-bottom-color:#F1F2F3;}
+.gui-noborder{border-right-width:0; border-top-width:0; border-left-width:0; border-bottom-width:0;}
+/* #endif */
+/* #ifndef APP-NVUE */
+.gui-border{border:1rpx solid #F1F2F3;}
+.gui-border-l{border-left:1rpx solid #F1F2F3;}
+.gui-border-r{border-right:1rpx solid #F1F2F3;}
+.gui-border-t{border-top:1rpx solid #F1F2F3;}
+.gui-border-b{border-bottom:1rpx solid #F1F2F3;}
+.gui-noborder{border:none !important;}
+/* #endif */
+
+/* 自定义头部导航相关 */
+.gui-header-content{width:100rpx; flex:1; text-align:center; margin-left:10rpx; margin-right:168rpx;}
+.gui-headr-back{width:148rpx; line-height:40px; font-size:32rpx;}
+
+
+/* 宫格布局 */
+.gui-grids{padding:0;}
+.gui-grids-items{width:138rpx;}
+/* #ifndef APP-NVUE */
+.gui-grids-items{box-sizing:border-box;}
+/* #endif */
+.gui-grids-icon{height:80rpx; font-size:68rpx; line-height:80rpx; text-align:center;}
+/* #ifndef APP-NVUE */
+.gui-grids-icon{display:block; width:100%;}
+/* #endif */
+.gui-grids-icon-img{width:80rpx; height:80rpx; border-radius:6rpx;}
+.gui-grids-text{line-height:50rpx; text-align:center; font-size:24rpx; margin-top:2px;}
+/* #ifndef APP-NVUE */
+.gui-grids-text{display:block; width:100%;}
+/* #endif */
+
+
+/* 列表样式 */
+/* #ifndef APP-NVUE */
+.gui-list-items, .gui-list-title{display:flex;}
+.gui-list-icon, .gui-list-title-text, .gui-list-title-desc, .gui-list-body-desc, .gui-list-arrow-right{display:block;}
+/* #endif */
+.gui-list-items{flex-direction:row; flex-wrap:nowrap; align-items:center; justify-content:center;}
+.gui-list-icon{width:80rpx; height:80rpx; line-height:80rpx; text-align:center; font-size:44rpx;}
+.gui-list-image{width:80rpx; height:80rpx; border-radius:80rpx; font-size:0;}
+.gui-list-body{padding:25rpx 0; margin-left:25rpx; width:100rpx; flex:1;}
+.gui-list-title{flex-direction:row; flex-wrap:nowrap; justify-content:space-between; align-items:center;}
+.gui-list-one-line{line-height:60rpx !important;}
+.gui-list-title-text{font-size:26rpx; line-height:44rpx;}
+.gui-list-title-desc{font-size:22rpx; line-height:30rpx;}
+.gui-list-body-desc{font-size:22rpx; line-height:32rpx;}
+.gui-list-arrow-right{width:50rpx; height:50rpx; line-height:50rpx; font-size:30rpx; text-align:right;}
+
+
+/* 徽章 */
+.gui-badge{border-radius:38rpx; height:38rpx; line-height:38rpx; padding:0 13rpx; font-size:22rpx;}
+.gui-badge-absolute{position:absolute; right:0rpx; top:4rpx; z-index:1;}
+.gui-badge-point{width:20rpx; height:20rpx; border-radius:12rpx; position:absolute; right:4rpx; top:4rpx; z-index:1; background-color:#FF0000;}
+.gui-badge-gender{width:38rpx; height:38rpx; border-radius:30rpx; text-align:center; font-size:22rpx !important; line-height:38rpx; position:absolute; right:6rpx; top:4rpx; z-index:1;}
+
+
+/* 滚动区域 */
+/* #ifndef APP-NVUE */
+.gui-scroll-x{display:flex; white-space:nowrap;}
+.gui-scroll-x-item, .gui-scroll-x-items{display:inline-flex; vertical-align:top;}
+/* #endif */
+/* #ifdef MP-ALIPAY */
+.gui-scroll-x{display:block; white-space:nowrap;}
+/* #endif */
+.gui-scroll-x{width:750rpx; flex-direction:row; overflow:hidden;}
+
+
+/* 卡片列表 */
+.gui-card-list{}
+.gui-card-item{width:330rpx; margin-bottom:30rpx;}
+.gui-card-img{width:330rpx; height:191rpx; overflow:hidden; position:relative;}
+.gui-card-title{margin-top:3px;}
+.gui-card-desc{margin-top:3px;}
+.gui-card-tip{width:68rpx; height:40rpx; line-height:40rpx; text-align:center;}
+.gui-card-mask-title{line-height:60rpx; height:60rpx; padding:0 10rpx; width:330rpx;}
+
+
+/* 底部导航相关 */
+.gui-footer-icon-buttons{width:80rpx; height:80rpx; margin:10rpx;}
+.gui-footer-icon-buttons-icon{text-align:center; font-size:38rpx; line-height:50rpx;}
+.gui-footer-icon-buttons-text{text-align:center; font-size:20rpx; line-height:30rpx;}
+.gui-footer-large-buttons{margin-left:25rpx; margin-right:25rpx;}
+.gui-footer-large-button{width:218rpx; height:80rpx;}
+.gui-footer-large-button-text{line-height:80rpx !important;}
+
+/* 通用标题布局 */
+.gui-title-line{width:50rpx; height:1px; background-color:#E1E2E3; flex:1;}
+.gui-title-text{line-height:60rpx;}
+.gui-title-icon{width:50rpx; font-size:32rpx;}
+
+/* 表单 */
+.gui-form{overflow:hidden;}
+.gui-form-item{flex-direction:row; flex-wrap:nowrap; align-items:center;}
+.gui-form-label{width:130rpx; height:100rpx; font-size:28rpx; line-height:100rpx; overflow:hidden;}
+.gui-form-icon{width:60rpx; height:60rpx; line-height:60rpx; font-size:28rpx;}
+.gui-form-body{width:200rpx; margin-left:20rpx; overflow:hidden; flex:1;}
+.gui-form-input{height:40rpx; line-height:40rpx; margin:20rpx 0; background-color:rgba(255,255,255,0); border-width:0px; font-size:28rpx;}
+.gui-check-item{margin:10rpx 10rpx 0 0; padding:0 10rpx; font-size:28rpx; flex-direction:row; flex-wrap:nowrap; align-items:center;}
+.gui-check-item-y{margin:10rpx 0; font-size:28rpx;}
+.gui-textarea{height:120rpx; padding:15rpx; line-height:38rpx; background-color:rgba(255,255,255,0); border-width:0px; font-size:28rpx;}
+@font-face{font-family:"gui-formicons"; src:url('data:application/ttf;charset=utf-8;base64,OLh6+EVGahJS0OU2yaKO26Kiu6Zv+fbC+9P6l/wm8ZwtrOU5zo2XwdDjj7ilb9szx6Pz8hzzU1DUMrbXMHC2NbU15WTlxOxUdK2llbX0DSSdFF0GClXLlRPIOJppGChZi5s6MnpKNvaqMLkwKoD8NsI9B7wqBANQgCNQhGDQgBAwhFKwhHGhBeDCDCOAI2YElRARjiAS2EBlMIQx4iGInC9nJQTHaVXQA5E8EE500AB910O4gBKhATdCAWWEFskIYcQBnigDbEBX2IBwYQHyQhIThBohj9KScAF0gKAuQMEpALsJAHSEG+/kuiIgA4aBqIoCiQhzQx6qgEABMoBTShNDCC5oAC1AQWUAuIQRYwhzaCM7QFGOgo6EHXQAn6DDbQJNjjczuo4gsok+FuApClC9pt9nPwK3ehR05loNUk');}
+
+/* 底部导航 */
+/* #ifndef APP-NVUE */
+.gui-form-item{display:flex;}
+.gui-form-label, .gui-form-icon{display:block;}
+.gui-form-picker{display:flex;}
+.gui-check-item{display:flexbox;}
+.gui-check-item-y{display:block;}
+.gui-textarea{box-sizing:border-box;}
+/* #endif */
+
+/* 评论列表 */
+.gui-comments{}
+.gui-comments-items{margin-top:35rpx;}
+.gui-comments-face{width:80rpx; height:80rpx; border-radius:80rpx; margin-right:25rpx;}
+.gui-comments-body{width:580rpx; overflow:hidden;}
+.gui-comments-header-text{line-height:40rpx;}
+.gui-comments-info{margin-top:2px;}
+.gui-comments-info-text{font-size:22rpx; line-height:40rpx; margin-top:10rpx;}
+.gui-comments-content{line-height:36rpx; font-size:26rpx; padding:8rpx 0;}
+.gui-comments-replay{font-size:24rpx; color:#666666; border-radius:3px; margin:3px 0; padding:15rpx; line-height:36rpx;}
+.gui-comments-replay-btn{font-size:20rpx; line-height:44rpx; padding:0rpx 20rpx; border-radius:44rpx;}
+.gui-comments-imgs{margin:8rpx 0;}
+.gui-comments-image{width:180rpx; height:128rpx; margin-right:10rpx; margin-bottom:10rpx; font-size:0; overflow:hidden;}
+
+/* 底部导航相关 */
+.gui-footer-input-body{padding:0 20rpx; height:70rpx; border-radius:66rpx; margin:0 30rpx;}
+.gui-footer-input-icon{width:66rpx; text-align:center; line-height:66rpx; font-size:30rpx; margin-right:10rpx;}
+.gui-footer-input{width:100rpx; flex:1; font-size:26rpx; height:32rpx; line-height:32rpx; padding:0; overflow:hidden;}
+
+.gui-common-line{height:20rpx; background-color:#F7F8FA;}
+
+
+/* css3 动画 不支持 nvue */
+/* #ifndef APP-NVUE */
+.gui-transition-all{transition:all 0.2s ease-in 0s;}
+/* 使用记录 : gui-switch-navigation2 gui-popup */
+@keyframes gui-fade-in{0%{opacity:0;} 100%{opacity:1;}}
+.gui-fade-in{animation:gui-fade-in 350ms ease-in forwards;}
+/* 使用记录 : gui-image gui-popup */
+@keyframes gui-fade-out{0%{opacity:1;} 100%{opacity:0;}}
+.gui-fade-out{animation:gui-fade-out 350ms ease-out forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-top-in{0%{transform:translateY(-1000px);} 100%{transform:translateY(0px);}}
+.gui-top-in{animation:gui-top-in 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-top-out{0%{transform:translateY(0px);} 100%{transform:translateY(-1000px);}}
+.gui-top-out{animation:gui-top-out 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-bottom-in{0%{transform:translateY(600px);} 100%{transform:translateY(0px);}}
+.gui-bottom-in{animation:gui-bottom-in 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-bottom-out{0%{transform:translateY(0px);} 100%{transform:translateY(600px);}}
+.gui-bottom-out{animation:gui-bottom-out 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-left-in{0%{transform:translateX(-600px);} 100%{transform:translateX(0px);}}
+.gui-left-in{animation:gui-left-in 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-left-out{0%{transform:translateX(0px);} 100%{transform:translateX(-600px);}}
+.gui-left-out{animation:gui-left-out 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-right-in{0%{transform:translateX(600px);} 100%{transform:translateX(0px);}}
+.gui-right-in{animation:gui-right-in 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-right-out{0%{transform:translateX(0px);} 100%{transform:translateX(600px);}}
+.gui-right-out{animation:gui-right-out 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-scale-in{0%{transform:scale(0.3,0.3);} 100%{transform:scale(1,1);}}
+.gui-scale-in{animation:gui-scale-in 350ms linear forwards;}
+/* 使用记录 : gui-popup */
+@keyframes gui-scale-out{0%{transform:scale(1,1);} 100%{transform:scale(0.3,0.3);}}
+.gui-scale-out{animation:gui-scale-out 350ms linear forwards;}
+/* 使用记录 : gui-page */
+@keyframes gui-rotate360{0%{transform:rotate(0deg);} 50%{transform:rotate(180deg);} 100%{transform:rotate(360deg);}}
+.gui-rotate360{animation:gui-rotate360 1200ms infinite linear;}
+/* #endif */
+
+
+/* 不支持 nvue 的常用样式 */
+/* #ifndef APP-NVUE */
+.gui-box-shadow{box-shadow:0px 0px 16rpx #323232;}
+.gui-transition-all{transition:all 0.2s ease-in 0s;}
+::-webkit-scrollbar {display: none;}
+/* #endif */

lib/GraceUI5/data/city-data/area.js

@@ -5278,6 +5278,10 @@ var areaData = [
 				"label": "历下区",
 				"value": "370102"
 			},
+			{
+				"label": "莱芜区",
+				"value": "371200",
+			},
 			{
 				"label": "市中区",
 				"value": "370103"
@@ -5689,6 +5693,7 @@ var areaData = [
 				"value": "371172"
 			}
 		],
+		/*
 		[{
 				"label": "莱城区",
 				"value": "371202"
@@ -5697,7 +5702,7 @@ var areaData = [
 				"label": "钢城区",
 				"value": "371203"
 			}
-		],
+		],*/
 		[{
 				"label": "兰山区",
 				"value": "371302"
@@ -12545,4 +12550,4 @@ var areaData = [
 		}]
 	]
 ]
-export default areaData;
+export default areaData;

lib/GraceUI5/data/city-data/city.js

@@ -168,7 +168,7 @@ var cityData = [
 		{"label": "泰安市","value": "370900"},
 		{"label": "威海市","value": "371000"},
 		{"label": "日照市","value": "371100"},
-		{"label": "莱芜市","value": "371200"},
+		//{"label": "莱芜市","value": "371200"},
 		{"label": "临沂市","value": "371300"},
 		{"label": "德州市","value": "371400"},
 		{"label": "聊城市","value": "371500"},

lib/GraceUI5/data/cityData.js

@@ -711,7 +711,7 @@ var cityData = {
 		{ name: "郑州市", code: "410100", pinyin: "zhengzhoushi410100"},
 		{ name: "镇江市", code: "321100", pinyin: "zhenjiangshi321100"},
 		{ name: "枝江市", code: "420583", pinyin: "zhijiangshi420583"},
-		{ name: "重庆市", code: "500000", pinyin: "zhongqingshi500000"},
+		{ name: "重庆市", code: "500000", pinyin: "chongqingshi500000"},
 		{ name: "中山市", code: "442000", pinyin: "zhongshanshi442000"},
 		{ name: "中卫市", code: "640500", pinyin: "zhongweishi640500"},
 		{ name: "钟祥市", code: "420881", pinyin: "zhongxiangshi420881"},

lib/GraceUI5/js/checkIdCard.js

@@ -0,0 +1,86 @@
+function checkIdcard(idcard) {
+	var Errors = new Array(
+		"ok",
+		"身份证号码位数错误",
+		"身份证号码出生日期错误",
+		"身份证号码校验错误",
+		"身份证地区错误"
+	);
+	var area = {
+		11: "北京", 12: "天津", 13: "河北", 14: "山西", 
+		15: "内蒙古", 21: "辽宁", 22: "吉林", 23: "黑龙江", 
+		31: "上海", 32: "江苏", 33: "浙江", 34: "安徽", 
+		35: "福建", 36: "江西", 37: "山东", 41: "河南", 
+		42: "湖北", 43: "湖南", 44: "广东", 45: "广西", 
+		46: "海南", 50: "重庆", 51: "四川", 52: "贵州", 
+		53: "云南", 54: "西藏", 61: "陕西", 62: "甘肃", 
+		63: "青海", 64: "宁夏", 65: "新疆", 71: "台湾", 
+		81: "香港", 82: "澳门", 91: "国外",
+	}
+
+	var idcard, Y, JYM, ereg;
+	var S, M;
+	var idcard_array = new Array();
+	idcard_array     = idcard.split("");
+	//地区检验
+	if (area[parseInt(idcard.substr(0, 2))] == null) return Errors[4];
+	//身份号码位数及格式检验
+	switch (idcard.length) {
+		case 15:
+			if ((parseInt(idcard.substr(6, 2)) + 1900) % 4 == 0 || ((parseInt(idcard.substr(6, 2)) + 1900) % 100 == 0 && (parseInt(idcard.substr(6, 2)) + 1900) % 4 == 0)) {
+				ereg = /^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}$/; //测试出生日期的合法性
+			} else {
+				ereg = /^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}$/; //测试出生日期的合法性
+			}
+			if (ereg.test(idcard)) return Errors[0];
+			else return Errors[2];
+		break;
+		case 18:
+			//18位身份号码检测
+			//出生日期的合法性检查
+			//闰年月日:((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))
+			//平年月日:((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))
+			if (
+			parseInt(idcard.substr(6, 4)) % 4 == 0 
+			|| 
+			(
+				parseInt(idcard.substr(6, 4)) % 100 == 0 
+				&& 
+				parseInt(idcard.substr(6, 4)) % 4 == 0
+				)
+			){
+				ereg = /^[1-9][0-9]{5}[1-2]+[0-9]{3}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}[0-9Xx]$/; //闰年出生日期的合法性正则表达式
+			} else {
+				ereg = /^[1-9][0-9]{5}[1-2]+[0-9]{3}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}[0-9Xx]$/; //平年出生日期的合法性正则表达式
+			}
+			// 测试出生日期的合法性
+            if (ereg.test(idcard)) {
+				//计算校验位
+				S = (parseInt(idcard_array[0]) + parseInt(idcard_array[10])) * 7
+				+ (parseInt(idcard_array[1]) + parseInt(idcard_array[11])) * 9
+				+ (parseInt(idcard_array[2]) + parseInt(idcard_array[12])) * 10
+				+ (parseInt(idcard_array[3]) + parseInt(idcard_array[13])) * 5
+				+ (parseInt(idcard_array[4]) + parseInt(idcard_array[14])) * 8
+				+ (parseInt(idcard_array[5]) + parseInt(idcard_array[15])) * 4
+				+ (parseInt(idcard_array[6]) + parseInt(idcard_array[16])) * 2
+				+ parseInt(idcard_array[7]) * 1
+				+ parseInt(idcard_array[8]) * 6
+				+ parseInt(idcard_array[9]) * 3;
+				Y = S % 11;
+				M = "F";
+				JYM = "10X98765432";
+				M = JYM.substr(Y, 1); //判断校验位
+				if (M == idcard_array[17]) return Errors[0]; //检测ID的校验位
+				else return Errors[3];
+			}else {
+				return Errors[2];
+			}
+        break;
+        default:
+			return Errors[1];
+			break;
+    }
+}
+export default{
+	checkIdcard : checkIdcard
+}

lib/GraceUI5/js/checker.js

@@ -1,4 +1,5 @@
 
+import idCardChecker from './checkIdCard.js';
 module.exports = {
 	error : '',
 	check : function (dataBeCheck, rule){
@@ -8,14 +9,74 @@ module.exports = {
 			if (!rule[i].checkType){ return true;}
 			if (!rule[i].name){return true;}
 			if (!rule[i].errorMsg) {return true;}
-			if (!data[rule[i].name] || data[rule[i].name] == '') {this.error = rule[i].errorMsg; return false;}
+			if (
+				typeof(data[rule[i].name]) == 'undefined'
+				 || 
+				 data[rule[i].name] === ''
+			){
+				this.error = rule[i].errorMsg; 
+				return false;
+			}
 			// 检查前去除内容的空格及换行
-			if(typeof(data[rule[i].name]) == 'string'){data[rule[i].name] = data[rule[i].name].replace(/\s/g,"");}
+			if(typeof(data[rule[i].name]) == 'string'){
+				data[rule[i].name] = data[rule[i].name].replace(/\s/g,"");
+			}
 			switch (rule[i].checkType){
 				case 'string':
 					var reg = new RegExp('^.{' + rule[i].checkRule + '}$');
-					if(!reg.test(data[rule[i].name])) {this.error = rule[i].errorMsg; return false;}
+					if(!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg; return false;
+					}
+				break;
+				case 'contain':
+					var cData = data[rule[i].name]+'';
+					if(cData.indexOf(rule[i].checkRule) == -1){
+						this.error = rule[i].errorMsg;
+						return false;
+					} 
+				break;
+				case 'notContain':
+					var cData = data[rule[i].name]+'';
+					if(cData.indexOf(rule[i].checkRule) != -1){
+						this.error = rule[i].errorMsg;
+						return false;
+					} 
+				break;
+				case 'inArray':
+					if(typeof(rule[i].checkRule) != 'object'){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					var resInArray = rule[i].checkRule.find(
+						(val)=>{
+							if(val == data[rule[i].name]){
+								return true;
+							}
+						}
+					);
+					if(!resInArray){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+				break;
+				case 'notInArray':
+					if(typeof(rule[i].checkRule) != 'object'){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					var resInArray = rule[i].checkRule.find(
+						(val)=>{
+							if(val == data[rule[i].name]){
+								return true;
+							}
+						}
+					);
+					if(resInArray){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
 				break;
+				
 				case 'int':
 					var ruleArr = rule[i].checkRule.split(',');
 					if(rule.length < 2){
@@ -25,8 +86,11 @@ module.exports = {
 						ruleArr[0] = Number(ruleArr[0]) - 1;
 						ruleArr[1] = Number(ruleArr[1]) - 1;
 					}
-					var reg = new RegExp('^(-[1-9]|[1-9])[0-9]{' + ruleArr[0] + ',' + ruleArr[1] + '}$');
-					if(!reg.test(data[rule[i].name])) {this.error = rule[i].errorMsg; return false;}
+					var reg = new RegExp('^-?\\d{' + ruleArr[0] + ',' + ruleArr[1] + '}$');
+					if(!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg; 
+						return false;
+					}
 					break;
 				break;
 				case 'between':
@@ -37,69 +101,200 @@ module.exports = {
 					var minMax = rule[i].checkRule.split(',');
 					minMax[0] = Number(minMax[0]);
 					minMax[1] = Number(minMax[1]);
-					if (data[rule[i].name] > minMax[1] || data[rule[i].name] < minMax[0]) {
+					if (
+					data[rule[i].name] > minMax[1]
+					 || 
+					data[rule[i].name] < minMax[0])
+					{
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+				break;
+				case 'intBetween':
+				var reg = /^-?\d+$/;
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg; 
+						return false; 
+					}
+					var minMax = rule[i].checkRule.split(',');
+					minMax[0] = Number(minMax[0]);
+					minMax[1] = Number(minMax[1]);
+					if (
+					data[rule[i].name] > minMax[1]
+					 || 
+					data[rule[i].name] < minMax[0]) {
 						this.error = rule[i].errorMsg;
 						return false;
 					}
 				break;
 				case 'betweenD':
 					var reg = /^-?\d+$/;
-					if (!reg.test(data[rule[i].name])) { this.error = rule[i].errorMsg; return false; }
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false; 
+					}
+					var minMax = rule[i].checkRule.split(',');
+					minMax[0] = Number(minMax[0]);
+					minMax[1] = Number(minMax[1]);
+					if (
+					data[rule[i].name] > minMax[1]
+					 || 
+					data[rule[i].name] < minMax[0]){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+				break;
+				case 'doubleBetween':
+					var reg = /^-?\d?.+\d+$/;
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false;
+					}
 					var minMax = rule[i].checkRule.split(',');
 					minMax[0] = Number(minMax[0]);
 					minMax[1] = Number(minMax[1]);
-					if (data[rule[i].name] > minMax[1] || data[rule[i].name] < minMax[0]) {
+					if (
+					data[rule[i].name] > minMax[1]
+					 || 
+					data[rule[i].name] < minMax[0]){
 						this.error = rule[i].errorMsg;
 						return false;
 					}
 				break;
 				case 'betweenF': 
-					var reg = /^-?[0-9][0-9]?.+[0-9]+$/;
-					if (!reg.test(data[rule[i].name])){this.error = rule[i].errorMsg; return false;}
+					var reg = /^-?\d?.+\d+$/;
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false;
+					}
 					var minMax = rule[i].checkRule.split(',');
 					minMax[0] = Number(minMax[0]);
 					minMax[1] = Number(minMax[1]);
-					if (data[rule[i].name] > minMax[1] || data[rule[i].name] < minMax[0]) {
+					if (
+					data[rule[i].name] > minMax[1]
+					 || 
+					data[rule[i].name] < minMax[0]) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+				break;
+				case 'doubleLength' : 
+					var reg = new RegExp('^-?\\d+.\\d{' + rule[i].checkRule + '}$');
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false;
+					}
+				break;
+				case 'gt':
+					if(data[rule[i].name] <= rule[i].checkRule){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+				break;
+				case 'gtAndSame':
+					if(data[rule[i].name] < rule[i].checkRule){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+				break;
+				case 'lt':
+					if(data[rule[i].name] >= rule[i].checkRule){
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+				break;
+				case 'ltAndSame':
+					if(data[rule[i].name] > rule[i].checkRule){
 						this.error = rule[i].errorMsg;
 						return false;
 					}
 				break;
 				case 'same':
-					if (data[rule[i].name] != rule[i].checkRule) { this.error = rule[i].errorMsg; return false;}
+					if(data[rule[i].name] != rule[i].checkRule){
+						this.error = rule[i].errorMsg; 
+						return false;
+					}
+				break;
+				case 'notSame':
+					if(data[rule[i].name] == rule[i].checkRule){
+						this.error = rule[i].errorMsg; return false;
+					}
 				break;
 				case 'notsame':
-					if (data[rule[i].name] == rule[i].checkRule) { this.error = rule[i].errorMsg; return false; }
+					if(data[rule[i].name] == rule[i].checkRule){
+						this.error = rule[i].errorMsg; return false;
+					}
 				break;
 				case 'email':
 					var reg = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
-					if (!reg.test(data[rule[i].name])) { this.error = rule[i].errorMsg; return false; }
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false; 
+					}
 				break;
 				case 'phoneno':
 					var reg = /^1[0-9]{10,10}$/;
-					if (!reg.test(data[rule[i].name])) { this.error = rule[i].errorMsg; return false; }
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false; 
+					}
+				break;
+				case 'phone':
+					var reg = /^1[0-9]{10,10}$/;
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false; 
+					}
 				break;
 				case 'zipcode':
 					var reg = /^[0-9]{6}$/;
-					if (!reg.test(data[rule[i].name])) { this.error = rule[i].errorMsg; return false; }
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false;
+					}
 				break;
 				case 'reg':
 					var reg = new RegExp(rule[i].checkRule);
-					if (!reg.test(data[rule[i].name])) { this.error = rule[i].errorMsg; return false; }
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg; 
+						return false; 
+					}
 				break;
-				case 'in':
+				case 'in': 
 					if(rule[i].checkRule.indexOf(data[rule[i].name]) == -1){
 						this.error = rule[i].errorMsg; return false;
 					}
 				break;
 				case 'notnull':
-					if(data[rule[i].name] == null || data[rule[i].name].length < 1){this.error = rule[i].errorMsg; return false;}
+					if(
+					data[rule[i].name] == null || data[rule[i].name].length < 1
+					){this.error = rule[i].errorMsg; return false;}
 				break;
 				case 'samewith': 
-					if(data[rule[i].name] != data[rule[i].checkRule]){this.error = rule[i].errorMsg; return false;}
+					if(data[rule[i].name] != data[rule[i].checkRule]){
+						this.error = rule[i].errorMsg; 
+						return false;
+					}
 				break;
 				case 'numbers':
 					var reg = new RegExp('^[0-9]{' + rule[i].checkRule + '}$');
-					if (!reg.test(data[rule[i].name])) { this.error = rule[i].errorMsg; return false; }
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; return false; 
+					}
+				break;
+				case 'url':
+					var reg = /^(\w+:\/\/)?\w+(\.\w+)+.*$/;
+					if (!reg.test(data[rule[i].name])){
+						this.error = rule[i].errorMsg; 
+						return false; 
+					}
+				break;
+				case 'idCard' :
+					var idCardRes = idCardChecker.checkIdcard(data[rule[i].name]);
+					if(idCardRes != 'ok'){
+						this.error = idCardRes;
+						return false; 
+					} 
 				break;
 			}
 		}

lib/GraceUI5/js/grace.js

@@ -375,12 +375,23 @@ module.exports = {
 	isEmptyObj : function(obj){return JSON.stringify(obj) === '{}';},
 	
 	// 获取ref ( 循环获取，直到 组件创建完成并获取成功 )
-	getRefs : function(ref, _this, count, fun){
-		if(count >= 40){return null;}
+	getRefs : function(ref, _this, count, fun){
+		if(count >= 50){
+			fun(this.$refs[ref]);
+			return null;
+		}
 		var refReturn = _this.$refs[ref];
-		if(refReturn){
-			fun(refReturn);
-			return;
+		if(refReturn){
+			// #ifdef APP-NVUE
+			fun(refReturn);
+			return;
+			// #endif
+			// #ifndef APP-NVUE
+			if(refReturn._data){
+				fun(refReturn);
+				return;
+			}
+			// #endif
 		}else{
 			count++;
 			setTimeout(()=>{

lib/GraceUI5/js/request/request.js

@@ -77,6 +77,14 @@ module.exports = {
 		return sets;
 	},
 	
+	// 服务端 token 错误处理
+	tokenErrorHandle : function (res) {
+		console.log(res);
+		if(res.data && res.data == 'token error'){
+			uni.removeStorageSync(GraceRequestConfig.localTokenKeyName);
+		}
+	},
+	
 	// GET 请求 异步
 	get : function(url, sets, success, fail, complete, withLoginToken){
 		if(!sets){sets = {};}
@@ -97,6 +105,7 @@ module.exports = {
 				success  : (res)=>{
 					this.debug(res);
 					success(res.data);
+					this.tokenErrorHandle(res.data);
 				},
 				fail     : (error)=>{fail(error.errMsg);},
 				complete : (res) =>{complete(res);}
@@ -124,6 +133,7 @@ module.exports = {
 			});
 			if(error != null){ return false; }
 			this.debug(res);
+			this.tokenErrorHandle(res.data);
 			return res.data;
 		}).catch((e)=>{
 			console.log(e);
@@ -161,6 +171,7 @@ module.exports = {
 				success  : (res)=>{
 					this.debug(res);
 					success(res.data);
+					this.tokenErrorHandle(res.data);
 				},
 				fail     : (error)=>{fail(error.errMsg);},
 				complete : (res) =>{complete(res);}
@@ -195,6 +206,7 @@ module.exports = {
 				method   : 'POST'
 			});
 			if(error != null){ return false; }
+			this.tokenErrorHandle(res.data);
 			return res.data;
 		}).catch((e)=>{
 			console.log(e);
@@ -228,7 +240,10 @@ module.exports = {
 				name        : sets.name,
 				formData    : sets.formData,
 				header      : sets.header,
-				success     : (res)=>{success(res.data);},
+				success     : (res)=>{
+					success(res.data);
+					this.tokenErrorHandle(res.data);
+				},
 				fail        : (error)=>{fail(error);},
 				complete    : (res) =>{complete(res);}
 			});

pages.json

@@ -1,7 +1,7 @@
 {
 	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
 		{
-			"path": "pages/index/index",
+			"path": "pages/index/list",
 			"style": {
 				"app-plus": {
 					"titleNView": false,
@@ -11,7 +11,7 @@
 			}
 		},
 		{
-			"path": "pages/index/list",
+			"path": "pages/index/index",
 			"style": {
 				"app-plus": {
 					"titleNView": false,
@@ -180,17 +180,6 @@
 		    	},
 				"enablePullDownRefresh" : false
 		    }
-		},
-		{
-		    "path" : "lib/dever/pages/web_view",
-		    "style": {
-		    	"app-plus": {
-		    		"titleNView": false,
-		    		"bounce": "none",
-		    		"navigationStyle": "custom"
-		    	},
-				"enablePullDownRefresh" : false
-		    }
 		}
     ],
 	"globalStyle": {
@@ -229,6 +218,12 @@
 				"iconPath": "static/images/tabBar/take.png",
 				"selectedIconPath": "static/images/tabBar/take_selected.png",
 				"text": "发现"
+			},
+			{
+				"pagePath": "pages/index/my",
+				"iconPath": "static/images/tabBar/take.png",
+				"selectedIconPath": "static/images/tabBar/take_selected.png",
+				"text": "我的"
 			}/*,
 			{
 				"pagePath": "pages/user/index",

pages/dream/func/times.vue

@@ -145,5 +145,8 @@ export default {
 <style>
 .slide-image {
 	
+}
+.cu-item {
+	z-index: unset;
 }
 </style>

pages/dream/view/pic.vue

@@ -1,11 +1,13 @@
 <template name="pic">
 	<view class="cover cover-height">
 		<block v-if="item.text.length > 0">
-			<image @click="Dever.viewPic([item.pic], item.pic)" :src="item.pic" mode="widthFix" :class="['default', 'slide-image', 'slide-image-'+item.type]"  style="height:auto"></image>
+			<image v-show="loaded" @click="Dever.viewPic([item.pic], item.pic)" :src="item.pic" mode="widthFix" :class="['default', 'slide-image', 'slide-image-'+item.type]" @error="onError" @load="onSuccess" style="height:auto"></image>
+			<ourLoading v-show="!loaded" active text="加载中..." />
 			<dever-position :item="item.text" :down="item.pic" :button="item.is_button"></dever-position>
 		</block>
 		<block v-if="item.text.length <= 0">
-			<image @load="loadImg" @click="Dever.viewPic([item.pic], item.pic)" :src="item.pic" mode="widthFix" :class="['default', 'slide-image', 'slide-image-'+item.type]"  style="height:auto"></image>
+			<image v-show="loaded" @click="Dever.viewPic([item.pic], item.pic)" :src="item.pic" mode="widthFix" :class="['default', 'slide-image', 'slide-image-'+item.type]" @error="onError" @load="onSuccess" style="height:auto"></image>
+			<ourLoading v-show="!loaded" active text="加载中..." />
 		</block>
 	</view>
 </template>
@@ -26,10 +28,22 @@ export default {
 		index : 0,
 		pic_index : 0,
 	},
+	data() {
+		return {
+			loaded : false
+		};
+	},
 	methods:{
-		loadImg : function(e) {
-			var height = e.detail.height / (e.detail.width / this.Dever.config.system.windowWidth);
-			this.$emit('setHeight', this.pic_index, height);
+		onSuccess : function(e) {
+			this.onImg(e);
+			this.loaded = true;
+		},
+		onError : function(e) {
+			this.loaded = false;
+		},
+		onImg : function(e) {
+			var height = e.detail.height / (e.detail.width / this.Dever.config.system.windowWidth);
+			this.$emit('setHeight', this.pic_index, height);
 		}
 	},
 	components:{

pages/dream/view/picGrid.vue

@@ -1,6 +1,7 @@
 <template name="picGrid">
 	<view class="pics4-view">
-		<image v-for="(v, k) in item.text" :key="k" v-if="v.pic" class="default slide-image" :src="v.pic" mode="aspectFill" @click="Dever.viewPic(item.text, v.pic, 'pic')" styles="height:auto"></image>
+		<image v-show="loaded" v-for="(v, k) in item.text" :key="k" v-if="v.pic" class="default slide-image" :src="v.pic" mode="aspectFill" @click="Dever.viewPic(item.text, v.pic, 'pic')" @error="onError" @load="onSuccess" styles="height:auto"></image>
+		<ourLoading v-show="!loaded" active text="加载中..." />
 	</view>
 </template>
 
@@ -20,10 +21,16 @@ export default {
 	data() {
 		return {
 			position: ["tl","tr","bl","br"],
+			loaded : false
 		};
 	},
 	methods:{
-		
+		onSuccess : function(e) {
+			this.loaded = true;
+		},
+		onError : function(e) {
+			this.loaded = false;
+		},
 	},
 }
 </script>

pages/index/list.vue

@@ -1,138 +1,168 @@
 <template>
-	<gui-page :customFooter="true" iphoneXButtomStyle="background:#F8F8F8"
-	:footerSets="{height:150, zIndex:100, bg:'none'}" :isLoading="pageLoading">
+	<gui-page :customFooter="true" :customHeader="true" iphoneXButtomStyle="background:#F8F8F8"
+		:footerSets="{height:150, zIndex:100, bg:'none'}" :isLoading="pageLoading" :headerStyle="headerStyle">
+		<view slot="gHeader">
+					<view class="gui-flex gui-nowrap gui-rows gui-align-items-center gui-padding">
+						<view class="gui-flex1 gui-text-center">
+							<text class="gui-h4 gui-ellipsis gui-primary-color">合小记</text>
+						</view>
+					</view>
+				</view>
 		<!-- 页面主体 -->
 		<view slot="gBody">
-			
+
 			<view class="gui-margin-top">
-				<gui-swiper :swiperItems="fetch.focus" 
-				:width="750" :height="330" @taped="taped"></gui-swiper>
+				<gui-swiper :swiperItems="fetch.focus" :width="750" :height="330" @taped="taped"></gui-swiper>
 			</view>
-					
+
 			<view class="gui-flex gui-rows gui-justify-content-center gui-margin-top">
 				<view style="width:500rpx;">
-					<gui-segmented-control :items="cate" :current="0" borderRadius="50rpx" @change="menu"></gui-segmented-control>
+					<gui-segmented-control :items="cate" :current="0" borderRadius="50rpx" @change="menu">
+					</gui-segmented-control>
 				</view>
 			</view>
-		
+
 			<block v-if="state == 1">
 				<view class="gui-grids gui-flex gui-rows gui-wrap gui-margin-top gui-bg-gray menu">
-					<gui-switch-navigation :items="fetch.cate" :currentIndex="nav_index" @change="nav"  activeDirection="center" textAlign="center" activeLineBg="linear-gradient(to right, #008AFF,#008AFF)" ></gui-switch-navigation>
+					<gui-switch-navigation :items="fetch.cate" :currentIndex="nav_index" @change="nav"
+						activeDirection="center" textAlign="center"
+						activeLineBg="linear-gradient(to right, #008AFF,#008AFF)"></gui-switch-navigation>
 				</view>
 				<view class="gui-margin gui-card-list gui-flex gui-rows gui-wrap gui-space-between gui-margin-top">
-					<view class="gui-card-item" hover-class="gui-tap" v-for="(v, k) in fetch.info" :key="k" @click="view(v.id_code)">
+					<view class="gui-card-item" hover-class="gui-tap" v-for="(v, k) in fetch.info" :key="k"
+						@click="view(v.id_code)">
 						<view class="gui-card-img" style="height:100%">
-							<gui-image :width="330" :height="191"
-							:src="v.pic_cover"></gui-image>
-							<text class="gui-card-mask-title gui-absolute-lb gui-bg-black-opacity5 gui-block-text gui-color-white gui-h6 gui-border-box gui-text-center">{{v.name}}</text>
+							<gui-image :width="330" :height="191" :src="v.pic_cover"></gui-image>
+							<text
+								class="gui-card-mask-title gui-absolute-lb gui-bg-black-opacity5 gui-block-text gui-color-white gui-h6 gui-border-box gui-text-center">{{v.name}}</text>
 						</view>
 					</view>
 				</view>
-			</block>
-
+			</block>
+
 			<gui-empty v-if="state == 2">
 				<view slot="img" class="gui-flex gui-rows gui-justify-content-center">
 					<image class="gui-empty-img" src="@/static/dreamland/img/kong.png"></image>
 				</view>
-				<text slot="text" 
-				class="gui-text-small gui-block-text gui-text-center gui-margin-top" style="color:#9DABFF;">您还没有可以阅览的合小记</text>
+				<text slot="text" class="gui-text-small gui-block-text gui-text-center gui-margin-top"
+					style="color:#9DABFF;">您还没有可以阅览的合小记</text>
 			</gui-empty>
 		</view>
-		
+
 		<view slot="gPendant" style="display: none;">
 			<text class="gui-block-text pendant gui-color-white gui-bg-primary gui-icons">社区</text>
 		</view>
-		
-		<foot ref="foot" slot="gFooter" :value="foot_value"></foot>
+
+		<!--<foot ref="foot" slot="gFooter" :value="foot_value"></foot>-->
 		<dever-share ref="share" :data="fetch.share" v-if="fetch.share"></dever-share>
 	</gui-page>
 </template>
 
 <script>
-import deverShare from '@/lib/dever/components/share.vue';
-import foot from '@/pages/index/foot.vue';
-export default {
-	data() {
-		return {
-			foot_value : 2,
-			state : 0,
-			fetch : {
-				cate : [],
-				info : [],
-				focus : [],
-			},
-			cate : ["推荐", "私藏"],
-			cate_index: 0,//默认分类
-			nav_index : 0,
-		}
-	},
-	components:{
-		deverShare,foot
-	},
-	onLoad() {
-		this.getInfo();
-	},
-	onShow() {
-		this.$nextTick(function() {
-			this.$refs.foot.cur = this.foot_value;
-		});
-	},
-	// 重新加载
-	onPullDownRefresh: function() {
-		this.getInfo();
-	},
-	//下拉加载
-	onReachBottom() {
-		this.getData(2, false);
-	},
-	
-	methods: {
-		getInfo : function() {
-			var self = this;
-			var data = {};
-			data.id = -1;
-			data.type = this.cate_index + 1;
-			this.nav_index = 0;
-			this.Dever.get(this, 'app/collection/?l=api.getList', data, function(t) {
-				if (t.cate.length > 0) {
-					self.state = 1;
-				} else {
-					self.state = 2;
-				}
-			});
-		},
-		getData : function(page, index) {
-			var self = this;
-			if (!index) {
-				index = this.nav_index;
+	import deverShare from '@/lib/dever/components/share.vue';
+	import foot from '@/pages/index/foot.vue';
+	export default {
+		data() {
+			return {
+				homePage : 'pages/index/my',
+				foot_value: 2,
+				state: 0,
+				fetch: {
+					cate: [],
+					info: [],
+					focus: [],
+				},
+				cate: ["推荐", "私藏"],
+				cate_index: 0, //默认分类
+				nav_index: 0,
+				headerStyle: 'background-color:#F8F8F8',
 			}
-			var data = {};
-			data.id = -1;
-			data.type = this.cate_index + 1;
-			data.cate = this.fetch.cate[index].id;
-			this.Dever.page([page, 'info'], this, 'app/collection/?l=api.getListData', data);
-		},
-		view : function(id) {
-			this.Dever.location('dream/index?id=' + id);
-		},
-		menu : function(e) {
-			this.cate_index = e
-			this.getInfo();
 		},
-		
-		nav : function(e) {
-			this.nav_index = e;
-			this.getData(1, e);
+		components: {
+			deverShare,
+			foot
+		},
+		onLoad() {
+			this.getInfo();
+		},
+		onShow() {
+			this.$nextTick(function() {
+				this.$refs.foot.cur = this.foot_value;
+			});
+		},
+		// 重新加载
+		onPullDownRefresh: function() {
+			this.getInfo();
 		},
-		taped : function(e){
-			this.Dever.location(this.fetch.focus[e].link, 'webview', this.fetch.focus[e].name);
+		//下拉加载
+		onReachBottom() {
+			this.getData(2, false);
+		},
+
+		methods: {
+			getInfo: function() {
+				var self = this;
+				var data = {};
+				data.id = -1;
+				data.type = this.cate_index + 1;
+				this.nav_index = 0;
+				this.Dever.get(this, 'app/collection/?l=api.getList', data, function(t) {
+					if (t.cate.length > 0) {
+						self.state = 1;
+					} else {
+						self.state = 2;
+					}
+				});
+			},
+			getData: function(page, index) {
+				var self = this;
+				if (!index) {
+					index = this.nav_index;
+				}
+				var data = {};
+				data.id = -1;
+				data.type = this.cate_index + 1;
+				data.cate = this.fetch.cate[index].id;
+				this.Dever.page([page, 'info'], this, 'app/collection/?l=api.getListData', data);
+			},
+			view: function(id) {
+				this.Dever.location('dream/index?id=' + id);
+			},
+			menu: function(e) {
+				this.cate_index = e
+				this.getInfo();
+			},
+
+			nav: function(e) {
+				this.nav_index = e;
+				this.getData(1, e);
+			},
+			taped: function(e) {
+				this.Dever.location(this.fetch.focus[e].link, 'webview', this.fetch.focus[e].name);
+			}
 		}
-	}
-};
+	};
 </script>
 
 <style>
-.pendant{width:88rpx; height:88rpx; border-radius:88rpx; text-align:center; line-height:88rpx; font-size:24rpx;margin-top: 10rpx;}
-.menu{width:750rpx; padding:15rpx 30rpx;  box-sizing: border-box; padding-bottom:0;}
-.gui-text-small{font-size:20rpx;}
-</style>
+	.pendant {
+		width: 88rpx;
+		height: 88rpx;
+		border-radius: 88rpx;
+		text-align: center;
+		line-height: 88rpx;
+		font-size: 24rpx;
+		margin-top: 10rpx;
+	}
+
+	.menu {
+		width: 750rpx;
+		padding: 15rpx 30rpx;
+		box-sizing: border-box;
+		padding-bottom: 0;
+	}
+
+	.gui-text-small {
+		font-size: 20rpx;
+	}
+</style>