首页+活动创建页面

match/activity/activity.vue

@@ -1,9 +1,9 @@
 <template>
 	<view v-if="isShow">
-		<!-- <view class="tab ddflex">
+		<view class="tab ddflex">
 			<view :class="'li' + (current == 2 ? ' active':'')" @click="tabClick(2)">待参赛</view>
 			<view :class="'li' + (current == 3 ? ' active':'')" @click="tabClick(3)">已参赛</view>
-		</view> -->
+		</view>
 		<view class="list" v-if="pageList && pageList.length >0">
 			<view class="li" v-for="(item,index) in pageList" :key="index" @click="jumpUrl('/match/activityDet/activityDet?id=' + item.id + '&orderId=' + item.orderId)">
 				<view class="infos ddflex">
@@ -66,6 +66,7 @@ export default {
 		tabClick(it){
 			if(it == this.current) return false;
 			this.current = it;
+			this.isLoad = true;
 			this.getPageList();
 		},
 		getPageList(isShow){
@@ -73,7 +74,7 @@ export default {
 			this.isLoad = false;
 			let form = this.form;
 			req.loadIng('加载中')
-			// form.state = this.current;
+			form.state = this.current;
 			// form.state = 2;
 			req.getRequest('/api/match/enlist/list',form,res => {
 				this.isShow = true;

match/activityEdit/activityEdit.css

@@ -0,0 +1,158 @@
+page{
+	background-color: #fff;
+}
+.form{
+	padding: 30rpx;
+}
+.form-title{
+	line-height: 50rpx;
+	font-size: 36rpx;
+	font-family: PingFang SC-Bold, PingFang SC;
+	font-weight: bold;
+	color: #333333;
+}
+.form-item-title{
+	line-height: 45rpx;
+	font-size: 32rpx;
+	font-family: PingFang SC-Medium, PingFang SC;
+	font-weight: 500;
+	color: #333333;
+	margin-top: 32rpx;
+}
+.upload-pic{
+	width: 690rpx;
+	height: 400rpx;
+	background: #F8F8F8;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin:30rpx auto 0;
+	text-align: center;
+	line-height: 45rpx;
+	font-size: 32rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	flex-direction: column;
+	justify-content: center;
+}
+.upload-pic image{
+	width: 59rpx;
+	height: 62rpx;
+}
+.upload-image{
+	width: 690rpx;
+	height: 400rpx;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin:30rpx auto 0;
+}
+.form-limit{
+	line-height: 33rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	margin-top: 20rpx;
+}
+.upload-photo{
+	width: 120rpx;
+	height: 120rpx;
+	background: #F8F8F8;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin-bottom: 20rpx;
+}
+.upload-photo image{
+	width: 46rpx;
+	height: 35rpx;
+	margin: auto;
+}
+.upload-photo-image{
+	width: 120rpx;
+	height: 120rpx;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin-right: 20rpx;
+	position: relative;
+	margin-bottom: 20rpx;
+}
+.upload-photo-image image{
+	width: 120rpx;
+	height: 120rpx;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+}
+.upload-photo-close{
+	width: 28rpx !important;
+	height: 28rpx !important;
+	position: absolute;
+	top:-14rpx;
+	right: -14rpx;
+}
+.form-border{
+	height: 20rpx;
+	background: #F8F8F8;
+	border-radius: 0rpx 0rpx 0rpx 0rpx;
+	opacity: 1;
+}
+.form-input-box{
+	padding: 30rpx 0;
+	border-bottom: 2rpx solid #DEDEDE;
+	line-height: 45rpx;
+	font-size: 32rpx;
+}
+.form-input-placeholder{
+	color: #CCCCCC;
+}
+.more{
+	float: right;
+}
+.more image{
+	width: 14rpx;
+	height: 22rpx;
+	margin-left: 10rpx;
+}
+.next-btn{
+	height: 88rpx;
+	line-height: 88rpx;
+	background: #27D699;
+	border-radius: 44rpx 44rpx 44rpx 44rpx;
+	font-size: 36rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	text-align: center;
+	margin: 150rpx auto 30rpx;
+}
+.form-number-select{
+	margin-top: 30rpx;
+}
+.form-number-select view:first-child,.form-number-select view:last-child{
+	width: 80rpx;
+	height: 67rpx;
+	line-height: 67rpx;
+	background: #F8F8F8;
+	border-radius: 4rpx 4rpx 4rpx 4rpx;
+	opacity: 1;
+	text-align: center;
+	color: #B3B3B3;
+	font-size: 40rpx;
+}
+.form-number-select input{
+	width: 112rpx;
+	height: 63rpx;
+	background: #FFFFFF;
+	border-radius: 4rpx 4rpx 4rpx 4rpx;
+	opacity: 1;
+	border: 2rpx solid #DEDEDE;
+	margin: 0 20rpx;
+	text-align: center;
+}
+.form-date-select{
+	background: #F8F8F8;
+	border-radius: 5rpx 5rpx 5rpx 5rpx;
+	text-align: center;
+	line-height: 76rpx;
+	height: 76rpx;
+	color: #CCCCCC;
+	font-size: 32rpx;
+}

match/activityEdit/activityEdit.vue

@@ -0,0 +1,138 @@
+<template>
+	<view>
+		<view v-if="stepOne">
+			<view class="form">
+				<view class="form-title">基本信息</view>
+				<view class="form-item-title">封面图</view>
+				<view class="upload-pic ddflex" v-if="true">
+					<image src="../static/images/pic.png"></image>
+					<view style="margin-top: 30rpx;">上传封面图</view>
+				</view>
+				<image v-else class="upload-image" src="../../static/images/lj_img.png"></image>
+				<view class="form-limit">* 图片尺寸限制：680*350</view>
+				<view class="form-item-title">活动详情轮播图</view>
+				<view class="ddflex" style="margin-top: 30rpx;">
+					<view class="upload-photo-image" v-for="item in 3">
+						<image src="/static/images/lj_img.png"></image>
+						<image class="upload-photo-close" src="/static/pages/images/close3.png"></image>
+					</view>
+					<view class="upload-photo ddflex">
+						<image src="../static/images/photo.png"></image>
+					</view>
+				</view>
+				<view class="form-limit">* 图片尺寸限制：670*350</view>
+			</view>
+			<view class="form-border"></view>
+			<view class="form">
+				<view class="form-item-title">活动标题</view>
+				<view class="form-input-box">
+					<input placeholder-class="form-input-placeholder" placeholder="请输入活动标题"/>
+				</view>
+				<view class="form-item-title">活动说明</view>
+				<view class="form-input-box">
+					<input placeholder-class="form-input-placeholder" placeholder="请填写活动简介说明"/>
+				</view>
+				<view class="form-item-title">
+					活动详情
+					<view class="more ddflex">
+						编辑
+						<image  src="../../static/pages/images/more.png"></image>
+					</view>
+				</view>
+				<view class="next-btn">下一步</view>
+			</view>
+		</view>
+		
+		<!-- 第二步 -->
+		<view v-if="stepTwo">
+			<view class="form">
+				<view class="form-title">报名设置</view>
+				<view class="form-item-title">最大报名人数</view>
+				<view class="form-number-select ddflex">
+					<view>-</view>
+					<input type="number" placeholder="最大报名人数" placeholder-class="form-input-placeholder"/>
+					<view>+</view>
+				</view>
+				<view class="form-item-title">报名时间</view>
+				<view  class="ddflex" style="margin-top: 20rpx;">
+					<picker mode="date" class="flex">
+						<view class="form-date-select">
+							开始日期
+						</view>
+					</picker>
+					<text style="margin: 0 20rpx;">至</text>
+					<picker mode="date" class="flex">
+						<view class="form-date-select">
+							结束日期
+						</view>
+					</picker>
+				</view>
+				<view class="form-item-title">活动时间</view>
+				<view  class="ddflex" style="margin-top: 20rpx;">
+					<picker mode="date" class="flex">
+						<view class="form-date-select">
+							开始日期
+						</view>
+					</picker>
+					<text style="margin: 0 20rpx;">至</text>
+					<picker mode="date" class="flex">
+						<view class="form-date-select">
+							结束日期
+						</view>
+					</picker>
+				</view>
+			</view>
+			<view class="form-border"></view>
+			<view class="form">
+				<view class="form-title">活动地址</view>
+				<view class="form-item-title">地址名称</view>
+				<view class="form-input-box">
+					<input placeholder-class="form-input-placeholder" placeholder="请输入活动地址简称"/>
+				</view>
+				<view class="form-item-title">选择城市</view>
+				<view class="form-input-box">
+					<input placeholder-class="form-input-placeholder" placeholder="请选择活动所在城市"/>
+				</view>
+				<view class="form-item-title">
+					详细地址
+				</view>
+				<view class="form-input-box">
+					<input placeholder-class="form-input-placeholder" placeholder="请输入详细地址"/>
+				</view>
+				<view class="next-btn">提交</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				stepOne:false,
+				stepTwo:true
+			}
+		},
+		onLoad(options) {
+
+		},
+		onShow() {
+			
+		},
+		methods: {
+			
+		},
+		mounted() {
+			
+		}
+	}
+</script>
+
+<style>
+	@import "./activityEdit.css";
+</style>

match/activityManage/activityManage.css

@@ -0,0 +1,141 @@
+page{
+	background-color: #fff;
+}
+.top-fixed{
+	position: fixed;
+	top: 0;
+	right: 0;
+	left: 0;
+	background-color: #fff;
+	z-index: 101;
+}
+.search-box{
+	padding: 30rpx;
+	background-color: #fff;
+}
+
+.search-text{
+	color: #999999;
+}
+
+
+.search-input{
+	height: 76rpx;
+	line-height: 76rpx;;
+	background: #F5F5F5;
+	border-radius: 60rpx;
+	padding: 0 26rpx;
+	font-size: 24rpx;
+}
+.search-input input{
+	font-size: 24rpx;
+}
+.search-input image{
+	width: 34rpx;
+	height: 34rpx;
+	margin-right: 26rpx;
+}
+.search-all{
+	color: #2a82fd;
+	font-size: 30rpx;
+	margin-left: 46rpx;
+}
+
+
+.title{
+	line-height: 50rpx;
+	font-size: 36rpx;
+	font-family: PingFang SC-Bold, PingFang SC;
+	font-weight: bold;
+	color: #333333;
+	padding: 0 30rpx;
+}
+.title text{
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #A1A1A1;
+	margin-left: 20rpx;
+}
+
+.padd30{
+	padding: 30rpx;
+}
+.act-bar{
+	padding-bottom:42rpx ;
+	border-bottom: 2rpx solid #E8E8E8;
+	margin-bottom: 40rpx;
+}
+.act-bar:last-child{
+	border-bottom: none;
+}
+.act-pic{
+	position: relative;
+	width: 270rpx;
+	height: 174rpx;
+	border-radius: 6rpx 6rpx 6rpx 6rpx;
+	margin-right: 24rpx;
+}
+.act-pic image{
+	width: 100%;
+	height: 100%;
+	border-radius: 6rpx 6rpx 6rpx 6rpx;
+}
+.act-pic-tag{
+	position: absolute;
+	top: 0;
+	left: 0;
+	background-color: rgba(0, 0, 0, 0.7);
+	border-radius: 6rpx 0rpx 15rpx 0rpx;
+	padding: 0 10rpx;
+	line-height: 28rpx;
+	font-size: 20rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	text-align: center;
+	color: #FFFFFF;
+}
+.act-title{
+	max-height: 80rpx;
+	line-height: 40rpx;
+	font-size: 28rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #000000;
+}
+.act-time{
+	line-height: 33rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	margin-top: 10rpx;
+}
+.act-bottom{
+	justify-content: space-between;
+	margin-top: 20rpx;
+}
+.act-bottom-look{
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+}
+.act-bottom-look image{
+	width: 28rpx;
+	height: 28rpx;
+	margin-right: 6rpx;
+}
+.act-edit{
+	width: 113rpx;
+	height: 52rpx;
+	line-height: 52rpx;
+	background: #27D699;
+	border-radius: 26rpx 26rpx 26rpx 26rpx;
+	opacity: 1;
+	text-align: center;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+}

match/activityManage/activityManage.vue

@@ -0,0 +1,87 @@
+<template>
+	<view>
+		<view class="top-fixed">
+			<view class="search-box ddflex">
+				<view class="search-input ddflex fflex">
+					<image src="/static/images/ssico.png"></image>
+					<input @confirm="searchFn" confirm-type="search" @input="searchFn" v-model="searchVal" class="fflex"
+						placeholder="请输入关键词" />
+				</view>
+			</view>
+		</view>
+		<view style="height: 150rpx;"></view>
+		<view class="title">
+			我的活动<text>共3个</text>
+		</view>
+		<view class="padd30">
+			<view class="act-bar ddflex" v-for="item in 3">
+				<view class="act-pic">
+					<image src="/static/images/lj_img.png"></image>
+					<view class="act-pic-tag">审核中</view>
+				</view>
+				<view class="flex">
+					<view class="act-title tovers">保险大家谈 2023·山东青岛</view>
+					<view class="act-time">活动时间：2023.10.07</view>
+					<view class="act-bottom ddflex">
+						<view class="act-bottom-look ddflex">
+							<image src="../../static/pages/images/fw_hui.png"></image>
+							0人
+						</view>
+						<view class="act-edit" @click="jumpUrl('/match/activityEdit/activityEdit')">修改</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				systems: {},
+				isTop:0,
+			}
+		},
+		onLoad(options) {
+
+		},
+		onShow() {
+			
+		},
+		methods: {
+			jumpUrl(url){
+				uni.navigateTo({
+					url:url
+				})
+			}
+		},
+		mounted() {
+			const systemInfo = uni.getSystemInfoSync();
+			// px转换到rpx的比例
+			let pxToRpxScale = 750 / systemInfo.windowWidth;
+			let systems = {
+				ktxStatusHeight: systemInfo.statusBarHeight * pxToRpxScale, // 状态栏的高度
+				navigationHeight: 44 * pxToRpxScale // 导航栏的高度
+			};
+			systems.barHeight = systems.ktxStatusHeight + systems.navigationHeight;
+			this.systems = systems;
+		},
+		onPageScroll: function(e) {
+			if (e.scrollTop > this.systems.barHeight) {
+				this.isTop = 1;
+			} else {
+				this.isTop = 0;
+			}
+		}
+	}
+</script>
+
+<style>
+	@import "./activityManage.css";
+</style>

pages.json

@@ -1148,6 +1148,18 @@
 					"style": {
 						"navigationBarTitleText": "活动详情"
 					}
+				},
+				{
+					"path": "activityManage/activityManage",
+					"style": {
+						"navigationBarTitleText": "活动管理"
+					}
+				},
+				{
+					"path": "activityEdit/activityEdit",
+					"style": {
+						"navigationBarTitleText": "创建活动"
+					}
 				}
 			]
 		},

utils/request.js

@@ -1,6 +1,6 @@
 const app = getApp();
 const env = {
-	NODE_ENV: 'dev',
+	NODE_ENV: 'pota',
 	dev: {
 		apiUrl: 'https://apitest.zhiqiyun.com'
 	},
@@ -11,9 +11,10 @@ const env = {
 		// apiUrl: 'http://192.168.110.98:8098'   
 		// apiUrl: 'http://192.168.110.180:8098' ,//f
 		// apiUrl: 'http://192.168.110.182:8098' ,//z
-		apiUrl: 'http://192.168.110.176:8098' //y
+		// apiUrl: 'http://192.168.110.176:8098' //y
 		// apiUrl: 'http://192.168.110.117:8098'//l
 		// apiUrl: 'http://192.168.110.216:8098'
+		apiUrl: 'http://192.168.110.180:8098' //wjg
 	}
 }