添加修行项目页

pages.json

@@ -164,6 +164,13 @@
 			}
 		},
 		{
+			"path":"pages/index/xiuxing/xiuxingItem",//日历首页
+			"style":{
+				"navigationBarTitleText":"修行项目",
+				"navigationStyle":"custom"//添加自定义配置
+			}
+		},
+		{
 			"path":"pages/temple/index", //寺院首页
 			"style":{
 				"navigationBarTitleText":"寺院",

pages/index/index.vue

@@ -132,7 +132,7 @@
 					<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)" >
+								@change="change(item)" @click="bindClick(item,index)">
 								<view class="home-nav-box">
 									<image :src="item.imgUrl" class="nav-img"></image>
 									<view class="nav-name"
@@ -147,6 +147,12 @@
 						</view>
 					</uni-swipe-action>
 					<view style="height:100rpx"></view>
+					<view class="uni-publish">
+						<navigator
+							:url="`/pages/index/xiuxing/xiuxingItem?deleteItems=${JSON.stringify(deleteItems)}&items=${JSON.stringify(items)}`">
+							<image class="send" src="../../static/index/icon/gongxiu_notice_add.png"></image>
+						</navigator>
+					</view>
 				</view>
 			</view>
 		</view>
@@ -277,6 +283,7 @@
 				initialStatus: '未签到',
 				//修行项目
 				items: [{
+						index: 0,
 						imgUrl: '../../static/index/home_gongxiu.png',
 						name: '共修',
 						meritCount: 0,
@@ -284,6 +291,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 1,
 						imgUrl: '../../static/index/home_qifu.png',
 						name: '祈福',
 						meritCount: 0,
@@ -291,6 +299,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 2,
 						imgUrl: '../../static/index/home_fojing.png',
 						name: '佛经',
 						meritCount: 0,
@@ -298,6 +307,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 3,
 						imgUrl: '../../static/index/home_foyin.png',
 						name: '佛音',
 						meritCount: 0,
@@ -305,6 +315,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 4,
 						imgUrl: '../../static/index/home_nianfo.png',
 						name: '念佛',
 						meritCount: 0,
@@ -312,6 +323,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 5,
 						imgUrl: '../../static/index/home_yufo.png',
 						name: '浴佛',
 						meritCount: 0,
@@ -319,6 +331,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 6,
 						imgUrl: '../../static/index/home_jisi.png',
 						name: '祭祀',
 						meritCount: 0,
@@ -326,6 +339,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 7,
 						imgUrl: '../../static/index/home_xiyou.png',
 						name: '西游',
 						meritCount: 0,
@@ -333,6 +347,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 8,
 						imgUrl: '../../static/index/home_peifu.png',
 						name: '培福',
 						meritCount: 0,
@@ -340,6 +355,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 9,
 						imgUrl: '../../static/index/home_chaodu.png',
 						name: '超度',
 						meritCount: 0,
@@ -347,6 +363,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 10,
 						imgUrl: '../../static/index/home_rizhi.png',
 						name: '修心日志',
 						meritCount: 0,
@@ -354,6 +371,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 11,
 						imgUrl: '../../static/index/home_xingshan.png',
 						name: '日行一善',
 						meritCount: 0,
@@ -361,6 +379,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 12,
 						imgUrl: '../../static/index/home_zuochan.png',
 						name: '坐禅',
 						meritCount: 0,
@@ -368,6 +387,7 @@
 						isOpened: 'none'
 					},
 					{
+						index: 13,
 						imgUrl: '../../static/index/home_fangsheng.png',
 						name: '放生',
 						meritCount: 0,
@@ -381,16 +401,35 @@
 						backgroundColor: '#ff0000'
 					}
 				}],
+				deleteItems: []
 			}
 		},
-		onLoad() {
+		onLoad(option) {
 			this.$request.api('/api/test/', {}).then(res => {
 				console.log(res)
 			}).catch(parmas => {
 				console.log(432142)
 			})
-
-
+			if(option.items){
+				this.items = JSON.parse(option.items);
+				console.log("indexLength:"+this.items.length);
+			}	
+		},
+		onShow() {
+			try {
+				const value = uni.getStorageSync('items');
+				if (value) {
+					console.log(value);
+					this.items = value;
+					try {
+						uni.removeStorageSync('items');
+					} catch (e) {
+						// error
+					}
+				}
+			} catch (e) {
+				// error
+			}
 		},
 		methods: {
 			menuShow(index) {
@@ -418,8 +457,11 @@
 				item.isOpened = 'right';
 				// console.log('返回：', e);
 			},
-			bindClick(item) {
-			   console.log(item.name);
+			bindClick(item, index) {
+				//删除该项目
+				this.items.splice(index, 1);
+				this.deleteItems.push(item);
+				this.deleteItems = [...new Set(this.deleteItems)];
 			},
 		}
 	}
@@ -794,7 +836,20 @@
 			border-radius: 60rpx;
 		}
 	}
-	/deep/.uni-swipe_button-group{
+
+	/deep/.uni-swipe_button-group {
 		height: 130rpx !important;
 	}
+
+	.uni-publish {
+		position: fixed;
+		right: 40rpx;
+		bottom: 8%;
+		z-index: 3;
+	}
+
+	.uni-publish .send {
+		width: 120rpx;
+		height: 120rpx;
+	}
 </style>

pages/index/xiuxing/xiuxingItem.vue

@@ -0,0 +1,131 @@
+<template>
+	<view>
+		<view class="sticky-nav">
+			<view class="nav-box">
+				<image src="../../../static/index/answer/trun_left_black.png" class="answer_back" @click="backHome">
+				</image>
+				<text class="answer-text">修行项目</text>
+			</view>
+		</view>
+		<view v-for="(item,index) in deleteItems" :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>
+			<view class="nav-status" @tap="addItem(item,index)">添加</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				items: [],
+				deleteItems:[]
+			}
+		},
+		onLoad(option) {
+			this.deleteItems = JSON.parse(option.deleteItems);
+			this.items = JSON.parse(option.items);
+			console.log(this.items.length);
+			for (let i = 0; i < this.deleteItems.length; i++) {
+				this.deleteItems[i].imgUrl = "../" + this.deleteItems[i].imgUrl;
+			}
+		},
+		methods: {
+			backHome() {
+				uni.navigateBack({
+					delta: 1
+				});
+			},
+			addItem(item,index) {
+				//删除此项,添加到首页的数组里并跳转到首页
+				this.deleteItems.splice(index,1);
+				console.log("deleteLength:"+this.deleteItems.length);
+				//获取此项目的index
+				let itemIndex = item.index;
+				//处理图片路径
+				item.imgUrl = item.imgUrl.substring(3);
+				//添加此项到首页
+				this.items.splice(itemIndex,1,item);
+				this.items = [...new Set(this.items)];
+				uni.setStorageSync('items', this.items);
+				//跳转到首页
+				uni.switchTab({
+					url: '/pages/index/index'
+				});
+			}
+		}
+	}
+</script>
+<style>
+	page {
+		background-color: rgb(247, 246, 242);
+	}
+</style>
+<style lang="less" scoped>
+	.sticky-nav {
+		position: sticky;
+		width: 100%;
+		top: 0;
+		z-index: 1;
+	}
+
+	.nav-box {
+		width: 100%;
+
+		display: flex;
+		align-items: center;
+		background: #fff;
+		height: 95rpx;
+
+		.answer_back {
+			width: 45rpx;
+			height: 45rpx;
+			padding-left: 20rpx;
+			padding-right: 215rpx;
+		}
+
+		.answer-text {
+			font-size: 38rpx;
+			color: #000;
+		}
+	}
+
+	.home-nav-box {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		background-color: #fff;
+		width: 95%;
+		height: 130rpx;
+		margin: 25rpx 0 15rpx 20rpx;
+		border-radius: 20rpx;
+
+		.nav-img {
+			width: 95rpx;
+			height: 95rpx;
+			margin: 0 20rpx;
+		}
+
+		.nav-name {
+			font-size: 30rpx;
+			margin-right: 355rpx;
+			font-weight: bold;
+		}
+
+		.right-distance {
+			margin-right: 9rpx;
+		}
+
+		.nav-status {
+			color: #fff;
+			background-color: rgb(209, 177, 90);
+			width: 155rpx;
+			height: 60rpx;
+			line-height: 60rpx;
+			text-align: center;
+			border-radius: 60rpx;
+		}
+	}
+</style>