edit

lib/community/y-DiaryItem/y-DiaryItem.vue

@@ -1,213 +1,178 @@
 <template>
-	<view :class="['card-item',radius ? 'radius' : '']">
-		<view class="item-head">
-			<view class="left-info">
-				<view class="img-wrap flex-center" @tap="toOthers(item.id)">
-					<image :src="item.user.avatar" mode="widthFix" class="avatar"></image>
+	<view class="cu-card dynamic no-card">
+		<view class="cu-item shadow">
+			<view class="cu-list menu-avatar">
+				<view class="cu-item">
+					<image :src="item.user.avatar" mode="widthFix" class="cu-avatar round lg"></image>
+					<view class="content flex-sub">
+						<view>{{ item.user.username }}</view>
+						<view class="text-gray text-sm flex justify-between">
+							{{ item.cdate_string }}
+						</view>
+					</view>
 				</view>
-				<view class="head-name">{{ item.user.username }}</view>
 			</view>
-			<text class="color-nine">{{item.cdate_string}}</text>
-		</view>
-		<view class="content" @tap="toDetails(item.id)">
-			<view class="text-content">{{ item.content }}</view>
-			<view class="img-wrap padding-bottom-lg" v-if="item.pic.length == 1">
-				<view class="img-box">
-					<image v-for="(child, idx) in item.pic" :key="idx" :src="child" mode="widthFix" class="img" @tap.stop @tap="Dever.viewPic([child], child)"></image>
+			<view class="text-content">
+				{{ item.content }}
+			</view>
+			<view v-if="item.pic.length > 0">
+				<view class="grid flex-sub padding-lr col-1" v-if="item.pic.length == 1">
+					<view @tap.stop @tap="Dever.viewPic(item.pic, child)" class="bg-img only-img" :style="{backgroundImage: 'url('+child+')'}"
+					 v-for="(child, idx) in item.pic" :key="idx">
+					</view>
+				</view>
+				
+				<view class="grid flex-sub padding-lr col-3 grid-square" v-if="item.pic.length > 1">
+					<view @tap.stop @tap="Dever.viewPic(item.pic, child)" class="bg-img" :style="{backgroundImage: 'url('+child+')'}"
+					 v-for="(child, idx) in item.pic" :key="idx">
+					</view>
+					
 				</view>
 			</view>
-			<view class="img-list padding-bottom-lg" v-if="item.pic.length > 1">
-				<view class="img-box" v-for="(child, idx) in item.pic" :key="idx">
-					<image :src="child" mode="widthFix" class="img" @tap.stop @tap="Dever.viewPic(item.pic, child)"></image>
+			<view class="text-gray text-sm text-right padding">
+				<view class="icon-display" @click="updateOppose">
+					<text class="cuIcon-flashbuyfill margin-lr-xs" :class="item.is_oppose ? 'text-red' : ''"></text> {{item.num_oppose}}
+				</view>
+				<view class="icon-display" @click="updateUp">
+					<text class="cuIcon-appreciatefill margin-lr-xs" :class="item.is_up ? 'text-red' : ''"></text> {{item.num_up}}
+				</view>
+				<view class="icon-display"  @click="updateComment">
+					<text class="cuIcon-messagefill margin-lr-xs"></text> {{item.num_comment}}
 				</view>
 			</view>
-			<view class="bottom-btn padding-bottom-sm">
-				<view class="btn-item flex-center">
-					<image class="img" src="@/static/img/diary/img_say.png" mode="widthFix"></image>
-					<text>{{ item.num_comment }}</text>
+
+			<view class="cu-list menu-avatar comment solids-top">
+				<view class="cu-item">
+					<image src="https://ossweb-img.qq.com/images/lol/img/champion/Morgana.png" mode="widthFix" class="cu-avatar round"></image>
+					<view class="content">
+						<view class="text-grey">莫甘娜</view>
+						<view class="text-gray text-content text-df">
+							凯尔，你被自己的光芒变的盲目。
+						</view>
+						<view class="bg-grey padding-sm radius margin-top-sm  text-sm">
+							<view class="flex">
+								<view>凯尔：</view>
+								<view class="flex-sub">妹妹，你在帮他们给黑暗找借口吗?</view>
+							</view>
+						</view>
+						<view class="margin-top-sm flex justify-between">
+							<view class="text-gray text-df">2018年12月4日</view>
+							<view>
+								<text class="cuIcon-appreciatefill text-red"></text>
+								<text class="cuIcon-messagefill text-gray margin-left-sm"></text>
+							</view>
+						</view>
+					</view>
 				</view>
-				<view class="btn-item flex-center" @tap.stop @tap="handleLike(item.id, item.is_up, item.num_up)">
-					<image class="img" v-if="!item.is_up" src="@/static/img/diary/img_zan.png" mode="widthFix"></image>
-					<image class="img" v-else src="@/static/img/diary/img_zan_1.png" mode="widthFix"></image>
-					<text>{{ item.num_up }}</text>
+
+				<view class="cu-item">
+					<view class="cu-avatar round" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10006.jpg);"></view>
+					<view class="content">
+						<view class="text-grey">凯尔</view>
+						<view class="text-gray text-content text-df">
+							妹妹，如果不是为了飞翔，我们要这翅膀有什么用?
+						</view>
+						<view class="bg-grey padding-sm radius margin-top-sm  text-sm">
+							<view class="flex">
+								<view>莫甘娜：</view>
+								<view class="flex-sub">如果不能立足于大地，要这双脚又有何用?</view>
+							</view>
+						</view>
+						<view class="margin-top-sm flex justify-between">
+							<view class="text-gray text-df">2018年12月4日</view>
+							<view>
+								<text class="cuIcon-appreciate text-gray"></text>
+								<text class="cuIcon-messagefill text-gray margin-left-sm"></text>
+							</view>
+						</view>
+					</view>
 				</view>
 			</view>
 		</view>
+		<view v-if="show">
+			<communityPush :title="title" :is_upload="false" @hideModal="hideModal" @getRefresh="getRefresh" :cate_id="cate_id" :type="type" :type_id="type_id"></communityPush>
+		</view>
 	</view>
 </template>
 
 <script>
+	import communityPush from "@/pages/dream/view/communityPush";
 	export default {
 		props: {
-			obj: {
+			item: {
 				type: Object
 			},
 			radius:{
 				type: Boolean,
 				default: false
-			}
+			},
+			cate_id : null,
+		},
+		components:{
+			communityPush
 		},
 		data() {
 			return {
-				item: this.obj,
+				title : '回复话题',
+				show : false,
 				showPop: false,
+				type : 20,
+				type_id : 0,
 				commentList: []
 			};
 		},
-		watch: {
-			obj(val) {
-				this.list = val;
-			}
-		},
 		methods: {
-			handleFollow(id) {
+			handleFollow : function() {
 				let that = this;
 				that.item.follow = !that.item.follow;
 			},
-			toDetails(id) {
-				uni.navigateTo({
-					url: '../../pages/diary/details?id=' + id
-				});
-			},
-			handleLike(id, is_up, num_up) {
+			updateUp : function() {
 				let that = this;
+				if (that.item.is_oppose) {
+					return;
+				}
 				if (that.item.is_up) {
-					that.item.num_up;
+					that.item.num_up--;
+					that.item.is_up = false;
 				} else {
 					that.item.num_up++;
+					that.item.is_up = true;
+				}
+			},
+			updateOppose : function() {
+				let that = this;
+				if (that.item.is_up) {
+					return;
+				}
+				if (that.item.is_oppose) {
+					that.item.num_oppose--;
+					that.item.is_oppose = false;
+				} else {
+					that.item.num_oppose++;
+					that.item.is_oppose = true;
 				}
-				that.item.is_up = !that.item.is_up;
 			},
-			toOthers() {
-				uni.navigateTo({
-					url: '../../pages/mine/other'
-				});
+			updateComment : function () {
+				this.type = 20;
+				this.type_id = this.item.id;
+				this.show = true;
 			},
+			hideModal : function () {
+				this.show = false;
+			}
 		}
 	};
 </script>
 
 <style lang="less" scoped>
-	.flex-center {
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-	.bottom-btn {
-		display: flex;
+.cu-card {
 	
-		.btn-item {
-			flex: 1;
-			color: var(--mainColor);
-	
-			.img {
-				width: 50rpx;
-				height: 50rpx;
-				margin-right: 20rpx;
-			}
-		}
-	}
-	.padding-bottom-sm {
-	    padding-bottom: 9px;
-		text-align: center;
-		padding-top: 12px;
-	}
-	.radius{
-		border-radius: 16rpx;
-	}
-	.card-item {
-		padding: 20rpx 40rpx 0rpx;
-		background-color: #ffffff;
-		box-shadow: 0 20rpx 40rpx 0 rgba(0, 0, 0, 0.1);
-
-		.item-head {
-			display: flex;
-			align-items: center;
-			width: 100%;
-			justify-content: space-between;
-
-			.left-info {
-				display: flex;
-				align-items: center;
-
-				.img-wrap {
-					width: 80rpx;
-					height: 80rpx;
-					overflow: hidden;
-					border-radius: 50%;
-
-					.avatar {
-						width: 100%;
-						height: 80rpx;
-					}
-				}
-
-				.head-name {
-					padding-left: 40rpx;
-					color: #666666;
-					font-size: 32rpx;
-				}
-			}
-
-			.follow-btn {
-				width: 140rpx;
-				height: 60rpx;
-				border: 1rpx solid var(--mainColor);
-				color: var(--mainColor);
-				border-radius: 40rpx;
-			}
-
-			.followed {
-				color: #fff;
-				background: var(--activeColor);
-				border: 1rpx solid var(--activeColor);
-			}
-		}
-
-		.content {
-			.text-content {
-				padding: 40rpx 0;
-				justify-content: space-between;
-				color: var(--mainColor);
-				font-size: 30rpx;
-				text-align: justify;
-			}
-
-			.img-list {
-				display: flex;
-				flex-flow: row wrap;
-
-				.img-box {
-					flex: 0 0 30%;
-					margin: 0 1% 1%;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					overflow: hidden;
-					height: 200rpx;
-					border-radius: 4px;
-					background-color: #ececec;
-
-					.img {
-						width: 100%;
-					}
-				}
-			}
-
-			.img-wrap {
-				.img-box {
-					width: 100%;
-					max-height: 400rpx;
-					overflow: hidden;
-					display: flex;
-					align-items: center;
-				}
-			}
-		}
-	}
-
-	.cont {
-		--color: var(--activeColor);
-		--count: 1;
-	}
+}
+.cu-list.menu-avatar>.cu-item:after, .cu-list.menu>.cu-item:after {
+	border: 0px;
+}
+.icon-display {
+	display: inline;
+	margin-left: 20rpx;
+}
 </style>

lib/dever/config.js

@@ -30,7 +30,7 @@ const request = {
 
 //上传配置
 const upload = {
-	url: request.host + 'member/api.up_file/plupload',
+	url: request.host + 'package/upload/?l=save.start',
 	name: 'file',
 }
 

lib/dever/index.js

@@ -20,7 +20,8 @@ var http = {
 		if (!options) {
 			options = {};
 		}
-		options[this.token] = this.getToken();
+		options[this.token] = this.getToken();
+		options['json'] = 1;
 		return options;
 	},
 	
@@ -28,7 +29,8 @@ var http = {
 	request: function(vue, url, options, callback, err_callback) {
 		var self = this;
 		if (vue == 'post') {
-			config.request.method = 'POST';
+			config.request.method = 'POST';
+			config.request.method = 'GET';
 			vue = false;
 		} else {
 			config.request.method = 'GET';
@@ -63,7 +65,7 @@ var http = {
 				if (result.code == '2') {
 					dever.location(dever.login);
 				} else {
-					dever.alert(result.info)
+					dever.alert(result.msg)
 				}
 			}
 		})
@@ -72,7 +74,9 @@ var http = {
 	core : function(url, options) {
 		var self = this;
 		options = this.option(options);
-
+		if (!options.noconcat) {
+			options.noconcat = false;
+		}
 		if (config.server[url]) {
 			config.request.url = config.server[url];
 		} else {
@@ -91,7 +95,7 @@ var http = {
 				dever.debug(response);
 				if (response.statusCode === 200) {
 					if (response.data.code == '0') {
-						if (options.page && options.page > 0) {
+						if (options.page && options.page > 0 && !options.noconcat) {
 							page.state = true;
 							if (page.key && response.data.data[page.key].length > 0) {
 								if (options && options.concat && options.concat == -1) {
@@ -316,8 +320,10 @@ var upload = {
 								if (count > 1) {
 									if (!self.data[key]) {
 										self.data[key] = [];
+									}
+									if (self.data[key].length < count) {
+										self.data[key].push(backUrl);
 									}
-									self.data[key].push(backUrl);
 								} else {
 									self.data[key] = backUrl;
 								}
@@ -923,17 +929,22 @@ var dever = {
 
 	//上传
 	upload : function(id, count, callback) {
-		upload.handle(id, count, callback);
+		this.getUpload().handle(id, count, callback);
 	},
 	
 	//上传
 	qiniu : function(qn, self, id, count, callback, handle) {
-		upload.qiniu(qn, self, id, count, callback, handle);
+		this.getUpload().qiniu(qn, self, id, count, callback, handle);
 	},
 	
 	//上传文件
 	upfile : function(self, key, count, callback, ext, title, style) {
-		upload.upfile(self, key, count, callback, ext, title, style);
+		this.getUpload().upfile(self, key, count, callback, ext, title, style);
+	},
+	
+	//获取upload
+	getUpload : function() {
+		return upload;
 	},
 	
 	//im聊天

pages/dream/view/community.vue

@@ -7,16 +7,16 @@
 			</view>
 			<view class="scroll-wrapper">
 				<view class="margin-bottom" v-for="(v, k) in fetch.info" :key="k">
-					<y-DiaryItem :obj="v" />
+					<y-DiaryItem :item="v" :cate_id="cate_id"/>
 				</view>
 				<y-LoadMore :status="loadMoreStatus" />
 			</view>
 			<!-- 右下角按钮 -->
-			<y-Fab :bottom="140" :right="40" :btnList="fabList" @click="handleFab" />
+			<y-Fab :bottom="140" :right="40" @click="showModal" v-if="button_show"/>
 		</view>
 		
 		<view v-if="show">
-			<communityPush @hideModal="hideModal"></communityPush>
+			<communityPush :title="title" :is_upload="true" @hideModal="hideModal" @getRefresh="getRefresh" :cate_id="cate_id" :type="type" :type_id="type_id"></communityPush>
 		</view>
 	</view>
 </template>
@@ -54,7 +54,9 @@ export default {
 	},
 	data() {
 		return {
+			title : '发表新话题',
 			show : false,
+			button_show : true,
 			fetch : {
 				cate : [],
 				info : [],
@@ -62,31 +64,19 @@ export default {
 			cate_id : 0,
 			activeTab: 0,
 			loadMoreStatus: 1,
-			//fab的设置
-			fabList: [
-				{
-					bgColor: '#16C2C2',
-					text: '说说',
-					fontSize: 28,
-					color: '#fff'
-				},
-				{
-					bgColor: '#37b59d',
-					text: '穿越',
-					fontSize: 28,
-					color: '#fff'
-				}
-			]
 		};
 	},
 	created() {
-		this.getData('add');
+		this.getData();
 	},
 	onReachBottom() {
 		
 	},
 	methods:{
-		getData : function(type) {
+		getRefresh : function() {
+			this.getData(this.cate_id, 1);
+		},
+		getData : function() {
 			var self = this;
 			this.Dever.get(this, 'app/community/?l=api.category', {info_id:this.info_id, page_id:this.page_id, content_id:this.content_id,noloading:1}, function(t) {
 				if (t && t.cate.length > 0 && t.cate[self.activeTab]) {
@@ -103,6 +93,7 @@ export default {
 				} else {
 					self.loadMoreStatus = 3;
 				}
+				self.hideModal();
 			});
 		},
 		handleTab : function(index) {
@@ -112,24 +103,13 @@ export default {
 			this.activeTab = index;
 			this.getInfo(this.fetch.cate[this.activeTab].id, 1);
 		},
-		//点击右下角tab按钮
-		handleFab : function(e) {
-			let index = e.index;
-			switch (index) {
-				case 0:
-					//发布
-					this.showModal();
-					break;
-				case 1:
-					console.log(1);
-					break;
-			}
-		},
 		showModal : function () {
 			this.show = true;
+			this.button_show = false;
 		},
 		hideModal : function () {
 			this.show = false;
+			this.button_show = true;
 		}
 	},
 	components:{
@@ -184,7 +164,8 @@ view {
 
 /* 点赞和评论 */
 .margin-bottom {
-	margin-bottom: 14px;
+	padding-bottom: 14px;
+	background-color: #ddd;
 }
 .home {
 	padding-top: 120rpx;

pages/dream/view/communityPush.vue

@@ -2,7 +2,7 @@
 	<view class="cu-modal show">
 		<view class="cu-dialog">
 			<view class="cu-bar bg-white justify-end">
-				<view class="content">发表新话题</view>
+				<view class="content">{{title}}</view>
 				<view class="action" @tap="hideModal">
 					<text class="cuIcon-close text-red"></text>
 				</view>
@@ -12,15 +12,15 @@
 					<view class="input-box padding-sm">
 						<textarea class="area-top" placeholder="碎碎念..." v-model="content"></textarea>
 					</view>
-					<view class="cu-form-group img-box">
-						<view class="next-title">上传图片（最多9张）</view>
-						<view class="img-wrap margin-none">
-							<view class="grid col-4 grid-square flex-sub padding-top-lg">
-								<view class="bg-img" v-for="(item,index) in imgList" :key="index">
-									<image :src="item" mode="aspectFill" @tap="Dever.viewPic(imgList, item)" class="img-item"></image>
-									<image src="@/static/img/publish/img_close.png" @tap.stop="DelImg" :data-index="index" mode="widthFix" class="close-img"></image>
+					<view class="cu-form-group img-box" v-if="is_upload">
+						<view class="next-title">上传图片（最多{{total}}张）</view>
+						<view class="margin-none margin-left">
+							<view class="grid col-5 grid-square flex-sub padding-top-lg">
+								<view class="bg-img" v-for="(item,index) in pic" :key="index">
+									<image :src="item" mode="aspectFill" @tap="Dever.viewPic(pic, item)" class="img-item"></image>
+									<image src="@/static/img/publish/img_close.png" @tap.stop="del" :data-index="index" mode="widthFix" class="close-img"></image>
 								</view>
-								<view class="add-img" @tap="ChooseImage" v-if="imgList.length<9">
+								<view class="add-img" @tap="choose" v-if="pic.length<total">
 									<text class='cuIcon-add link-color'></text>
 								</view>
 							</view>
@@ -29,10 +29,13 @@
 				</view>
 			</view>
 			<view class="cu-bar bg-white">
-				<view class="action margin-0 flex-sub text-green " @tap="hideModal">
-					<text class="cuIcon-moneybag"></text>藏点钱</view>
-				<view class="action margin-0 flex-sub text-green solid-left" @tap="hideModal">取消</view>
-				<view class="action margin-0 flex-sub  solid-left" @tap="hideModal">发布</view>
+				<view class="action margin-0 flex-sub text-green" @tap="hideModal" v-if="is_upload">
+					<text class="cuIcon-moneybag"></text>藏点钱
+				</view>
+				
+				<view class="action margin-0 flex-sub text-green solid-left" @tap="save">发布</view>
+				
+				<view class="action margin-0 flex-sub solid-left" @tap="hideModal">取消</view>
 			</view>
 		</view>
 	</view>
@@ -41,51 +44,89 @@
 <script>
 	export default {
 		name : 'communityPush',
+		props: {
+			title : '',
+			cate_id : null,
+			type : null,
+			type_id : null,
+			index : 0,
+			is_upload : true,
+		},
 		data() {
 			return {
-				imgList: [
-					'https://6d61-matchbox-79a395-1302390714.tcb.qcloud.la/matchbox/tree.jpg'
-				],
-				content: ''
+				pic : [],
+				content : '',
+				upload : 'img',
+				total : 9,
 			};
 		},
+		mounted() {
+			// 初始化上传数据
+			this.Dever.getUpload().data = {};
+			this.Dever.getUpload().data[this.upload] = [];
+			this.pic = [];
+		},
 		methods: {
+			// 保存数据
+			save : function() {
+				var self = this;
+				var data = {};
+				data.content = this.content;
+				if (this.pic.length > 0) {
+					data.pic = this.pic.join(',');
+				}
+				
+				data.cate_id = this.cate_id;
+				data.type = this.type;
+				data.type_id = this.type_id;
+				this.Dever.post('app/community/?l=api.add', data, function(t) {
+					self.getRefresh();
+				});
+			},
 			// 选择图片
-			ChooseImage() {
-				let that = this
-				uni.chooseImage({
-					count: 9, //默认9
-					sizeType: ['original'], //可以指定是原图还是压缩图，默认二者都有
-					sourceType: ['album'], //从相册选择
-					success: (res) => {
-						console.info(res.tempFilePaths);
-						if (that.imgList.length != 0) {
-							that.imgList = that.imgList.concat(res.tempFilePaths)
-						} else {
-							that.imgList = res.tempFilePaths
-						}
-					}
+			choose: function() {
+				var self = this;
+				var upload = this.Dever.upload(this.upload, this.total, function(type, img) {
+					self.pic = img;
 				});
 			},
-			//显示删除弹窗
-			DelImg(e) {
-				let that = this
-				that.imgList.splice(e.currentTarget.dataset.index, 1)
+			// 删除图片
+			del : function(e) {
+				var self = this;
+				self.pic.splice(e.currentTarget.dataset.index, 1)
 			},
+			
 			hideModal : function() {
 				this.$emit('hideModal');
+			},
+			
+			getRefresh : function() {
+				this.$emit('getRefresh');
 			}
 		}
 	}
 </script>
 
 <style lang="less" scoped>
+	.textarea-placeholder {
+		text-align: left;;
+	}
+	.grid.grid-square {
+		overflow: visible;
+	}
+	.margin-left {
+		width: 100%;
+		font-size: 13px;
+		line-height: 21px;
+		margin-left: -60rpx;
+	}
 	.publish-wrap {
 		.input-box {
 			.area-top {
 				width: 100%;
 				box-shadow: inset 0 -1px 0 0 #ECECEC;
 				min-height: 280rpx;
+				text-align: left;
 			}
 		}