上传代码

api/api.js

@@ -60,6 +60,12 @@ const config = {
 		method: 'GET',
 		showLoading : true,
 	},
+	//获取作品详情
+	indexGetGetWorkDetail: {
+		url: '/api/index/getWorkDetail',
+		method: 'GET',
+		showLoading : true,
+	},
 	//获取置顶列表
 	indexTopPayList: {
 		url: '/api/index/getTopPayList',

pages.json

@@ -5,12 +5,6 @@
 				"navigationBarTitleText": ""
 			}
 		},
-		{
-			"path": "pages/publish/competition",
-			"style": {
-				"navigationBarTitleText": ""
-			}
-		},
 		{
 			"path": "pages/auth/login",
 			"style": {
@@ -72,6 +66,12 @@
 			}
 		}
 	],
+	"preloadRule" : {
+		"pages/index/index" : {
+			"network" : "all",
+			"packages" : ["pages_mine"]
+		}
+	},
 	"subPackages": [{
 		"root": "pages_mine",
 		"pages": [{
@@ -170,6 +170,24 @@
 				"style": {
 					"navigationBarTitleText": ""
 				}
+			},
+			{
+				"path": "publish/worksDetail",
+				"style": {
+					"navigationBarTitleText": ""
+				}
+			},
+			{
+				"path": "publish/competition",
+				"style": {
+					"navigationBarTitleText": ""
+				}
+			},
+			{
+				"path": "publish/addWorks",
+				"style": {
+					"navigationBarTitleText": ""
+				}
 			}
 		]
 	}],

pages/index/index.vue

@@ -162,7 +162,7 @@
 			bannerClick(index){
 				console.log(index);
 				uni.navigateTo({
-					url: '/pages/publish/competition'
+					url: '/pages_mine/publish/competition'
 				})
 			}
 		}

pages/publish/actorDetail.vue

@@ -53,7 +53,7 @@
 				v-for="(t, index) in item.isImage && item.isImage.split(',')"
 				:key="index">
 					<view class="item-image">
-						<video src="t"/>
+						<video :src="t" object-fit="fill"/>
 					</view>
 				</view>
 			</view>
@@ -82,14 +82,10 @@
 		onLoad(options) {
 			// this.$route.query的参数
 			this.getData(options.id)
-			// this.getList()
 		},
 		//滚动到屏幕底部
 		onReachBottom() {
-			// if(this.queryParams.pageSize < this.total){
-			// 	this.queryParams.pageSize += 10
-			// 	this.getList()
-			// }
+			
 		},
 		methods: {
 			leftClick(){
@@ -104,17 +100,6 @@
 					}
 				})
 			},
-			getList(){
-				this.$api('indexGetGetWorkPage', {
-					token : uni.getStorageSync('token'),
-					...this.queryParams
-				}, res => {
-					if(res.code == 200){
-						this.list = res.result.records
-						this.total = res.result.total
-					}
-				})
-			}
 		}
 	}
 </script>

pages/publish/actorList.vue

@@ -39,14 +39,17 @@
 			return {
 				actorList : [],
 				total : 0,
+				queryParams: {
+					pageNo: 1,
+					pageSize: 10
+				},
 			}
 		},
 		onShow() {
 			this.getData()
 		},
 		onReachBottom(){
-			let allTotal = this.queryParams.pageNo * this.queryParams.pageSize
-			if(allTotal < this.total){
+			if(this.queryParams.pageSize < this.total){
 				//当前条数小于总条数 则增加请求数
 				this.queryParams.pageSize += 10
 				this.getData() //调用加载数据方法

pages_mine/publish/addWorks.vue

@@ -0,0 +1,365 @@
+<template>
+	<view class="actorRelease">
+		<navbar leftClick @leftClick="$utils.navigateBack" title="演员发布" />
+		
+		<view class="images box">
+			<uv-upload 
+			:fileList="fileListImage" 
+			:maxCount="1" 
+			multiple 
+			width="150rpx" 
+			height="150rpx"
+			@delete="deleteImage2"
+			@afterRead="afterRead2"
+			:previewFullImage="true"></uv-upload>
+		</view>
+
+
+		<view class="form">
+			<view class="form-item">
+				<view class="label">
+					标题：
+				</view>
+				<input type="text" placeholder="请输入标题" v-model="form.title" />
+			</view>
+			<!-- <view class="form-item">
+				<view class="label">
+					价格：
+				</view>
+				<input type="number" placeholder="请输入价格" v-model="form.money" />
+			</view> -->
+			<!-- <view class="form-item">
+				<view class="label">
+					地点：
+				</view>
+				<input type="text" placeholder="请输入地点"/>
+			</view>
+			<view class="form-item">
+				<view class="label">
+					时间：
+				</view>
+				<input type="text" placeholder="请选择时间"/>
+			</view> -->
+			<!-- <view class="form-item">
+				<view class="label">
+					联系方式：
+				</view>
+				<input type="text" placeholder="请输入联系方式" v-model="form.phone" />
+			</view> -->
+			<view class="form-item-content">
+				<view class="label">
+					详情介绍：
+				</view>
+				<view class="textarea">
+					<uv-textarea v-model="form.photographerContent" :maxlength="200" count placeholder="输入详情介绍"></uv-textarea>
+				</view>
+			</view>
+			<!-- <view class="form-item-content">
+				<view class="label">
+					发布人：
+				</view>
+				<view class="textarea">
+					<uv-radio-group v-model="form.isUser">
+						<uv-radio size="35rpx" 
+						icon-size="35rpx" 
+						label="本人发布" 
+						labelSize="28rpx" name="1">
+						</uv-radio>
+						<uv-radio size="35rpx" 
+						icon-size="35rpx" 
+						label="经纪人发布" 
+						labelSize="28rpx" name="0">
+						</uv-radio>
+					</uv-radio-group>
+				</view>
+			</view> -->
+			<!-- <view class="form-item-content">
+				<view class="label">
+					联系方式是否付费查看（建议付费避免无效联系）
+				</view>
+				<view class="textarea">
+					<uv-radio-group v-model="form.phonePay">
+						<uv-radio size="35rpx" icon-size="35rpx" label="是" labelSize="28rpx" name="1">
+						</uv-radio>
+						<uv-radio size="35rpx" icon-size="35rpx" label="否" labelSize="28rpx" name="0">
+						</uv-radio>
+					</uv-radio-group>
+				</view>
+			</view> -->
+
+			<view class="form-item-content">
+				<view class="label">
+					作品
+				</view>
+				<view class="upload">
+					<uv-upload :fileList="fileList" :maxCount="5" multiple accept="video" width="150rpx" height="150rpx"
+						@delete="deleteImage" @afterRead="afterRead" :previewFullImage="true"></uv-upload>
+				</view>
+			</view>
+		</view>
+
+		<submit @submit="submit" @preview="preview" @draft="draft" />
+		
+		
+		<!-- <confirmationPopup
+		ref="confirmationPopup"
+		title="提示"
+		@confirm="pay"
+		confirmText="确认支付">
+			<view class="confirmationPopup">
+				<image src="/static/image/publish/pay.png" 
+				style="width: 150rpx;height: 150rpx;"
+				mode=""></image>
+				<view class="info">
+					确认支付{{ topInfo.money }}元，可置顶{{ topInfo.day }}天
+				</view>
+			</view>
+		</confirmationPopup> -->
+
+		<confirmationPopup ref="confirmationPopupUpload" title="提示" confirmText="确认" @confirm="confirm()">
+			<view class="confirmationPopup">
+				<image src="/static/image/publish/upload.png" style="width: 150rpx;height: 150rpx;" mode=""></image>
+				<view class="info">
+					已由平台进行审核，时间周期为24小时
+				</view>
+			</view>
+		</confirmationPopup>
+	</view>
+</template>
+
+<script>
+	import submit from '@/components/content/submit.vue'
+	import confirmationPopup from '@/components/toast/confirmationPopup.vue'
+	import {
+		mapState
+	} from 'vuex'
+
+	export default {
+		components: {
+			submit,
+			confirmationPopup
+		},
+		data() {
+			return {
+				form: {
+					title : '',
+					photographerContent : '',//演员介绍
+				},
+				fileList: [//代表作
+					// {
+					// 	url: 'https://cdn.uviewui.com/uview/swiper/2.jpg'
+					// },
+				],
+				fileListImage: [],//封面
+				upTopList: [],
+			};
+		},
+		computed : {
+			topInfo(){
+				for (var i = 0; i < this.upTopList.length; i++) {
+					if(this.upTopList[i].id == this.form.topId){
+						return this.upTopList[i]
+					}
+				}
+				return {}
+			}
+		},
+		onShow() {
+			// this.indexTopPayList()
+		},
+		methods: {
+			// 获取置顶方式
+			indexTopPayList() {
+				this.$api('indexTopPayList', res => {
+					if (res.code == 200) {
+						this.upTopList = res.result
+					}
+				})
+			},
+
+			// 删除图片
+			deleteImage(e) {
+				this.fileList.splice(e.index, 1)
+			},
+			// 上传作品
+			afterRead(e) {
+				let self = this
+				e.file.forEach(file => {
+					self.$Oss.ossUpload(file.url).then(url => {
+						self.fileList.push({
+							url
+						})
+					})
+				})
+			},
+			deleteImage2(e) {
+				this.fileListImage.splice(e.index, 1)
+			},
+			afterRead2(e) {
+				let self = this
+				e.file.forEach(file => {
+					self.$Oss.ossUpload(file.url).then(url => {
+						self.fileListImage.push({
+							url
+						})
+					})
+				})
+			},
+			pay() {
+
+				let data = {
+					...this.form,
+					isCard: 1,
+					isImage : this.fileList.map((item) => item.url).join(","),
+					image : this.fileListImage.map((item) => item.url).join(","),
+					isTop : this.form.topId ? 'Y' : 'N',
+				}
+
+				this.$api('publishActor', data,
+					res => {
+						if (res.code == 200) {
+							this.$refs.confirmationPopupUpload.open()
+						}
+					})
+			},
+			submit() {
+				
+				if(this.fileListImage.length == 0){
+					return uni.showToast({
+						title: '请上传封面',
+						icon : 'none'
+					})
+				}
+				
+				if(this.fileList.length == 0){
+					return uni.showToast({
+						title: '请上传代表作',
+						icon : 'none'
+					})
+				}
+				
+				if (this.$utils.verificationAll(this.form, {
+						title: '请输入标题',
+						photographerContent: '请输入演员介绍',
+						phone: '请输入手机号',
+						money: '请输入价格',
+					})) {
+					return
+				}
+				
+				if(this.form.topId){
+					// 选择付费模式
+					this.$refs.confirmationPopup.open()
+				}else{
+					// 没有选择付费
+					this.pay()
+				}
+			},
+			confirm() {
+				// this.$refs.confirmationPopupUpload.close()
+				uni.navigateTo({
+					url: "/pages/index/index"
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.actorRelease {
+		background-color: #fff;
+		min-height: 100vh;
+		font-size: 28rpx;
+		padding-bottom: 150rpx;
+
+		/deep/ .uv-radio {
+			margin-right: 25rpx;
+			margin-top: 10rpx;
+		}
+
+		.box {
+			padding: 0 20rpx;
+		}
+
+		.avatarFace {
+			width: 150rpx;
+			height: 150rpx;
+			// border: 1px solid #000000;
+			margin-left: 10rpx;
+		}
+		
+		.upTop{
+			margin-top: 40rpx;
+			.title{
+				padding-top: 20rpx;
+				padding-left: 30rpx;
+				border-top: 1px solid #00000015;
+				display: flex;
+				align-items: center;
+			}
+			.list{
+				padding-top: 30rpx;
+				width: 100%;
+				.item{
+					display: flex;
+					padding: 20rpx;
+					padding-left: 80rpx;
+					justify-content: space-between;
+					width: 600rpx;
+					border-bottom: 1px solid #00000015;
+					align-items: center;
+				}
+			}
+		}
+
+		.form {
+			.label {
+				padding: 20rpx;
+			}
+
+			.form-item {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				padding: 20rpx 0;
+				padding-right: 30rpx;
+
+				input {
+					text-align: right;
+					flex: 1;
+				}
+			}
+
+			.form-item-content {
+				padding-right: 30rpx;
+				padding-top: 30rpx;
+
+				.textarea {
+					padding-left: 20rpx;
+				}
+
+				.upload {
+					padding-left: 20rpx;
+				}
+			}
+		}
+
+		.confirmationPopup {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+			width: 100%;
+			height: 300rpx;
+
+			image {
+				margin-top: 40rpx;
+			}
+
+			.info {
+				margin-top: 40rpx;
+				font-size: 26rpx;
+			}
+		}
+	}
+</style>

pages/publish/competition.vue → pages_mine/publish/competition.vue

@@ -15,7 +15,7 @@
 				</view>
 			</view>
 			<view class="right">
-				<image src="/static/image/competition/1.png" mode=""></image>
+				<image src="../static/competition/1.png" mode=""></image>
 			</view>
 		</view>
 		
@@ -36,7 +36,7 @@
 			
 			<view class="empty"
 			v-if="!list.length">
-				<image src="/static/image/competition/k.png" mode=""></image>
+				<image src="../static/competition/k.png" mode=""></image>
 				<view class="">
 					暂无作品，发布第一个作品吧 ~
 				</view>
@@ -47,6 +47,7 @@
 				
 				<view class="item" 
 				v-for="(item, index) in list"
+				@click="$utils.navigateTo('/pages_mine/publish/worksDetail?id=' + item.id)"
 				:key="index">
 					<view class="ranking">
 						{{ index + 1 }}
@@ -88,7 +89,9 @@
 		</view>
 		
 		
-		<view class="submit">
+		<view class="submit"
+		@click="$utils.navigateTo('/pages_mine/publish/addWorks')"
+		>
 			发布作品
 		</view>
 	</view>

pages_mine/publish/worksDetail.vue

@@ -0,0 +1,187 @@
+<template>
+	<view class="postDetail">
+		<navbar leftClick @leftClick="leftClick" />
+
+		<view class="swipe">
+			<uv-swiper 
+			:list="item.image &&
+			item.image.split(',')" 
+			indicator 
+			height="320rpx"></uv-swiper>
+		</view>
+
+		<view class="box">
+
+			<view class="topInfo">
+				<view class="title">
+					{{ item.title }}
+				</view>
+				<view class="price">
+					<view class="">
+						排名{{ item.money || 0 }}
+					</view>
+					<view class="">
+						投票200
+					</view>
+				</view>
+				<!-- <view class="right">
+					<view class="money30">
+						近30天收益
+					</view>
+					<view class="phone">
+						联系方式<text>付费查看</text>
+					</view>
+				</view> -->
+			</view>
+
+			<view class="createBy">
+				<view class="">
+					发布人：{{ item.userId }}
+				</view>
+				<view class="">
+					发布时间：{{ item.createTime }}
+				</view>
+			</view>
+
+
+			<view class="controls">
+				<contentControls/>
+			</view>
+
+
+			<!-- <view class="content">
+				<uv-parse :content="item.photographerContent"></uv-parse>
+			</view> -->
+			
+			<view class="works">
+				<view class="item" 
+				v-for="(t, index) in item.isImage && item.isImage.split(',')"
+				:key="index">
+					<view class="item-image">
+						<video :src="t" object-fit="fill"/>
+					</view>
+				</view>
+			</view>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	import contentControls from '@/components/content/contentControls.vue'
+	export default {
+		components : {
+			contentControls
+		},
+		data() {
+			return {
+				item: {},
+				total : 0,
+			}
+		},
+		onLoad(options) {
+			// this.$route.query的参数
+			this.getData(options.id)
+		},
+		methods: {
+			leftClick(){
+				uni.navigateBack(-1)
+			},
+			getData(id){
+				this.$api('indexGetGetWorkDetail', {
+					id
+				}, res => {
+					if(res.code == 200){
+						this.item = res.result
+					}
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.postDetail {
+		.box {
+			padding: 20rpx;
+			.topInfo{
+				position: relative;
+				.price{
+					display: flex;
+					justify-content: space-between;
+					margin: 10rpx 0;
+				}
+				.right{
+					position: absolute;
+					right: 20rpx;
+					top: 0rpx;
+					line-height: 50rpx;
+					text-align: right;
+					.money30{
+						font-size: 26rpx;
+						color: #D43030;
+					}
+					.phone{
+						text{
+							color: #3A6BF1;
+							margin-left: 10rpx;
+						}
+					}
+				}
+			}
+			.title {
+				font-size: 30rpx;
+				font-weight: 600;
+				color: #000;
+			}
+
+			.createBy {
+				display: flex;
+				margin-top: auto;
+				margin-bottom: 10rpx;
+				font-size: 24rpx;
+				margin-top: 20rpx;
+				color: #555;
+
+				&>view {
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					padding-right: 20rpx;
+				}
+			}
+
+			.controls {
+				margin-top: 30rpx;
+			}
+
+			.content {
+				margin-top: 30rpx;
+				color: #777;
+			}
+			
+			.works{
+				display: flex;
+				flex-wrap: wrap;
+				margin-top: 20rpx;
+				.item{
+					width: 320rpx;
+					margin: 15rpx;
+					.item-title{
+						padding-bottom: 10rpx;
+						color: #000;
+					}
+					.item-image{
+						background-color: #999;
+						width: 100%;
+						height: 250rpx;
+						video{
+							width: 100%;
+							height: 100%;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

utils/utils.js

@@ -118,7 +118,9 @@ function params(url){
 		url
 	}
 	
-	data.url = '/pages' + data.url
+	if(!data.url.includes('/pages')){
+		data.url = '/pages' + data.url
+	}
 	
 	return data
 }