修行更新

pages/index/index.vue

@@ -4,12 +4,12 @@
 			<view class="nav-bar">
 				<view class="left-nav">
 					<ul>
-						<li v-for="(item,index) in navList" :class="{active:!(index-menuIndex)}">
-							<view v-if="item.url">
-								<navigator :url="item.url" v-text="item.name"></navigator>
-							</view>
-							<view v-else @click="menuShow(index)">
-								<text v-text="item.name"></text>
+						<li v-for="(item,index) in navList" :class="{active:!(index-menuIndex)}">
+							<view v-if="item.url">
+								<navigator :url="item.url" v-text="item.name"></navigator>
+							</view>
+							<view v-else @click="menuShow(index)">
+								<text v-text="item.name"></text>
 							</view>
 						</li>
 					</ul>
@@ -91,24 +91,24 @@
 					</view>
 					<view class="news-list-box" v-for="(item,index) in newsList">
 						<view class="news-item">
-							<navigator :url="'/pages/headlines/detail?id='+item.id">
-								<view class="news-list-item">
-									<view class="news-list-item-title">
-										<text>{{item.title}}</text>
-									</view>
-									<view class="news-list-item-tag">
-										<text class="item-tag">{{item.tag}}</text>
-										<text>{{item.publish_at}}</text>
-									</view>
-								</view>
-								<image :src="item.thumb" style="width: 215rpx;height: 192rpx;display: inline-block;
-									vertical-align: top;"></image>
+							<navigator :url="'/pages/headlines/detail?id='+item.id">
+								<view class="news-list-item">
+									<view class="news-list-item-title">
+										<text>{{item.title}}</text>
+									</view>
+									<view class="news-list-item-tag">
+										<text class="item-tag">{{item.tag}}</text>
+										<text>{{item.publish_at}}</text>
+									</view>
+								</view>
+								<image :src="item.thumb" style="width: 215rpx;height: 192rpx;display: inline-block;
+									vertical-align: top;"></image>
 							</navigator>
 						</view>
 					</view>
 				</view>
-			</view>
-			<view v-else-if="menuIndex===1" class="left-nav-title-box">
+			</view>
+			<view v-else-if="menuIndex===1" class="left-nav-title-box">
 				<view class="left-nav-titles">
 					<view v-for="(item,index) in rightNavList" :key="index">
 						<view @click="rightNavigate(item)">
@@ -129,15 +129,25 @@
 						<view class="merit-content">+{{meritNumber}}</view>
 						<view class="qiandao-status">{{initialStatus}}</view>
 					</view>
-					<view v-for="(item,index) in items" :key="index" class="home-nav-box">
-						<image :src="item.imgUrl" class="nav-img"></image>
-						<view class="nav-name" :class="item.name == '修心日志'||item.name == '日行一善'? 'right-distance':' '">{{item.name}}</view>
-						<image src="../../static/index/merit_cneter2.png" class="nav-merit"></image>
-						<view class="nav-count">+{{item.meritCount}}</view>
-						<view class="nav-status">{{item.status}}</view>
-					</view>
+					<uni-swipe-action>
+						<view v-for="(item,index) in items" :key="index">
+							<uni-swipe-action-item :right-options="options2" :show="item.isOpened" :auto-close="false"
+								@change="change(item)" @click="bindClick(item)" >
+								<view class="home-nav-box">
+									<image :src="item.imgUrl" class="nav-img"></image>
+									<view class="nav-name"
+										:class="item.name == '修心日志'||item.name == '日行一善'? 'right-distance':' '">
+										{{item.name}}
+									</view>
+									<image src="../../static/index/merit_cneter2.png" class="nav-merit"></image>
+									<view class="nav-count">+{{item.meritCount}}</view>
+									<view class="nav-status">{{item.status}}</view>
+								</view>
+							</uni-swipe-action-item>
+						</view>
+					</uni-swipe-action>
 					<view style="height:100rpx"></view>
-				</view>
+				</view>
 			</view>
 		</view>
 	</view>
@@ -149,42 +159,49 @@
 			return {
 				title: 'Hello',
 				menuIndex: 0,
-				navList: [
-					{name: '祈福',url: ''},
-					{name: '修行', url: ''},
-					{name: '商城', url: '/pages/shop/index'}
+				navList: [{
+						name: '祈福',
+						url: ''
+					},
+					{
+						name: '修行',
+						url: ''
+					},
+					{
+						name: '商城',
+						url: '/pages/shop/index'
+					}
 				],
 				activeColor: '#007aff',
 				styleType: 'text',
-				leftNavList: [
-					{
+				leftNavList: [{
 						imgurl: "../../static/index/home_icon_wish.png",
-						content: "祈福",
+						content: "祈福",
 						page: '../index/qifu/index'
 					},
 					{
 						imgurl: "../../static/index/home_icon_excess.png",
-						content: "超度",
+						content: "超度",
 						page: '../index/chaodu/index'
 					},
 					{
 						imgurl: "../../static/index/home_icon_release.png",
-						content: "放生",
+						content: "放生",
 						page: '../index/fangsheng/index'
 					},
 					{
 						imgurl: "../../static/index/home_icon_light.png",
-						content: "供灯",
-						page: '../index/gongdeng/index'
-						
+						content: "供灯",
+						page: '../index/gongdeng/index'
+
 					},
 					{
 						imgurl: "../../static/index/home_icon_answer.png",
-						content: "答疑",
+						content: "答疑",
 						page: '../index/answer/index'
 					}
 				],
-				
+
 				background: ['color1', 'color2', 'color3'],
 				indicatorDots: true,
 				adIndicatorDots: false,
@@ -209,14 +226,14 @@
 					"../../static/index/ad2.jpg",
 					"../../static/index/ad3.jpg"
 				],
-				newsList: [{
+				newsList: [{
 						id: 1,
 						title: "宽运法师对话李家杰博士(下),如何做到自在生命",
 						tag: "头条",
 						publish_at: "2021-04-27 17:45:25",
 						thumb: "../../static/index/news-img.png"
 					},
-					{
+					{
 						id: 2,
 						title: "宽运法师对话李家杰博士(下),如何做到自在生命",
 						tag: "头条",
@@ -228,8 +245,7 @@
 					content: '',
 					checked: false
 				},
-				rightNavList:[
-					{
+				rightNavList: [{
 						imgurl: "../../static/index/home_icon_music.png",
 						content: "佛音",
 						page: '../index/music/index'
@@ -248,7 +264,7 @@
 						imgurl: "../../static/index/home_icon_nianfo.png",
 						content: "念佛",
 						page: '../index/nianfo/index'
-						
+
 					},
 					{
 						imgurl: "../../static/index/home_icon_calendar.png",
@@ -258,125 +274,153 @@
 				],
 				rank: 50000, //排名
 				meritNumber: 0, //周排名功绩数目
-				initialStatus:'未签到',
+				initialStatus: '未签到',
 				//修行项目
-				items:[{
-					imgUrl:'../../static/index/home_gongxiu.png',
-					name:'共修',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_qifu.png',
-					name:'祈福',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_fojing.png',
-					name:'佛经',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_foyin.png',
-					name:'佛音',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_nianfo.png',
-					name:'念佛',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_yufo.png',
-					name:'浴佛',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_jisi.png',
-					name:'祭祀',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_xiyou.png',
-					name:'西游',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_peifu.png',
-					name:'培福',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_chaodu.png',
-					name:'超度',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_rizhi.png',
-					name:'修心日志',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_xingshan.png',
-					name:'日行一善',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_zuochan.png',
-					name:'坐禅',
-					meritCount:0,
-					status:'去完成'
-				},
-				{
-					imgUrl:'../../static/index/home_fangsheng.png',
-					name:'放生',
-					meritCount:0,
-					status:'去完成'
-				}]
+				items: [{
+						imgUrl: '../../static/index/home_gongxiu.png',
+						name: '共修',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_qifu.png',
+						name: '祈福',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_fojing.png',
+						name: '佛经',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_foyin.png',
+						name: '佛音',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_nianfo.png',
+						name: '念佛',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_yufo.png',
+						name: '浴佛',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_jisi.png',
+						name: '祭祀',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_xiyou.png',
+						name: '西游',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_peifu.png',
+						name: '培福',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_chaodu.png',
+						name: '超度',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_rizhi.png',
+						name: '修心日志',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_xingshan.png',
+						name: '日行一善',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_zuochan.png',
+						name: '坐禅',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					},
+					{
+						imgUrl: '../../static/index/home_fangsheng.png',
+						name: '放生',
+						meritCount: 0,
+						status: '去完成',
+						isOpened: 'none'
+					}
+				],
+				options2: [{
+					text: '删除',
+					style: {
+						backgroundColor: '#ff0000'
+					}
+				}],
 			}
 		},
 		onLoad() {
-			this.$request.api('/api/test/',{}).then(res=> {
-				console.log(res)
-			}).catch(parmas => {
-　　　　　　		console.log(432142)
-　　			})
-
-			
+			this.$request.api('/api/test/', {}).then(res => {
+				console.log(res)
+			}).catch(parmas => {
+				console.log(432142)
+			})
+
+
 		},
 		methods: {
 			menuShow(index) {
-				this.menuIndex = index;
+				this.menuIndex = index;
 				console.log(index)
 			},
-			navigate(item) {
-				if(item.page){
-					uni.navigateTo({
-						url: item.page
-					});
+			navigate(item) {
+				if (item.page) {
+					uni.navigateTo({
+						url: item.page
+					});
 				}
-				
+
 			},
-			rightNavigate(item){
-				
-				if(item.page){
+			rightNavigate(item) {
+
+				if (item.page) {
 					console.log("2222")
 					uni.navigateTo({
 						url: item.page
 					});
 				}
-			}
+			},
+			change(item) {
+				item.isOpened = 'right';
+				// console.log('返回：', e);
+			},
+			bindClick(item) {
+			   console.log(item.name);
+			},
 		}
 	}
 </script>
@@ -386,12 +430,13 @@
 	}
 </style>
 <style lang="less" scoped>
-	.sticky-nav{
+	.sticky-nav {
 		position: sticky;
 		width: 100%;
-		top:0;
+		top: 0;
 		z-index: 1;
 	}
+
 	.nav-bar {
 		padding-top: 70rpx;
 		padding-bottom: 10rpx;
@@ -574,7 +619,7 @@
 
 		.left-nav-bottom {
 			background-color: #fff;
-			margin-top: 30rpx;
+			margin-top: 30rpx;
 			padding-bottom: 100rpx;
 
 			.news-list-box {
@@ -638,99 +683,118 @@
 			}
 		}
 	}
-	.rank-box{
+
+	.rank-box {
 		display: flex;
 		flex-direction: row;
 		align-items: center;
 		background-color: #fff;
-		width:95%;
-		height:130rpx;
+		width: 95%;
+		height: 130rpx;
 		margin: 0 0 15rpx 20rpx;
 		border-radius: 20rpx;
-		.week-rank-box{
-			width:100rpx;
-			height:100rpx;
-			background-color: rgb(251,124,89);
+
+		.week-rank-box {
+			width: 100rpx;
+			height: 100rpx;
+			background-color: rgb(251, 124, 89);
 			border-radius: 50%;
 			text-align: center;
 			margin-right: 20rpx;
 			margin-left: 20rpx;
-			.week-rank{
-				color:#fff;
-				padding:15rpx 0 10rpx 0 ;
+
+			.week-rank {
+				color: #fff;
+				padding: 15rpx 0 10rpx 0;
 			}
-			.rank{
+
+			.rank {
 				color: #fff;
 			}
 		}
-		.share-btn{
-			color:#000;
+
+		.share-btn {
+			color: #000;
 			// font-weight: bold;
 			font-size: 38rpx;
 			margin-right: 15rpx;
 		}
-		.share-img{
-			width:35rpx;
-			height:30rpx;
+
+		.share-img {
+			width: 35rpx;
+			height: 30rpx;
 			margin-right: 30rpx;
 		}
-		.merit-img{
-			width:45rpx;
-			height:45rpx;
+
+		.merit-img {
+			width: 45rpx;
+			height: 45rpx;
 			margin-right: 8rpx;
 		}
-		.merit-content{
-			color:rgb(121,121,121);
+
+		.merit-content {
+			color: rgb(121, 121, 121);
 			margin-right: 170rpx;
 		}
-		.qiandao-status{
-			color:#fff;
-			background-color: rgb(209,177,90);
-			width:150rpx;
-			height:60rpx;
+
+		.qiandao-status {
+			color: #fff;
+			background-color: rgb(209, 177, 90);
+			width: 150rpx;
+			height: 60rpx;
 			line-height: 60rpx;
 			text-align: center;
 			border-radius: 60rpx;
 		}
 	}
-	.home-nav-box{
+
+	.home-nav-box {
 		display: flex;
 		flex-direction: row;
 		align-items: center;
 		background-color: #fff;
-		width:95%;
-		height:130rpx;
+		width: 95%;
+		height: 130rpx;
 		margin: 0 0 15rpx 20rpx;
 		border-radius: 20rpx;
-		.nav-img{
-			width:95rpx;
-			height:95rpx;
+
+		.nav-img {
+			width: 95rpx;
+			height: 95rpx;
 			margin: 0 20rpx;
 		}
-		.nav-name{
+
+		.nav-name {
 			font-size: 38rpx;
 			margin-right: 85rpx;
 		}
-		.right-distance{
+
+		.right-distance {
 			margin-right: 9rpx;
 		}
-		.nav-merit{
-			width:45rpx;
-			height:45rpx;
+
+		.nav-merit {
+			width: 45rpx;
+			height: 45rpx;
 			margin-right: 5rpx;
 		}
-		.nav-count{
-			color:rgb(121,121,121);
+
+		.nav-count {
+			color: rgb(121, 121, 121);
 			margin-right: 170rpx;
 		}
-		.nav-status{
-			color:#fff;
-			background-color: rgb(209,177,90);
-			width:150rpx;
-			height:60rpx;
+
+		.nav-status {
+			color: #fff;
+			background-color: rgb(209, 177, 90);
+			width: 150rpx;
+			height: 60rpx;
 			line-height: 60rpx;
 			text-align: center;
 			border-radius: 60rpx;
 		}
 	}
+	/deep/.uni-swipe_button-group{
+		height: 130rpx !important;
+	}
 </style>