1

common/api.js

@@ -14,6 +14,12 @@ const getDomain = (uri, method, type) => {
 		else group = url + group;
 		return group
 	}
+	if (type && type == 'chat') {
+		let chat = `/point/chat/v1/api` + uri;
+		if (config.wx_dev) chat = url + `${config.wx_dev}` + chat;
+		else chat = url + chat;
+		return chat
+	}
 	if (uri.startsWith('/wechat/api')) return url + uri;
 	let general = `/point/v1/api` + uri;
 	if (config.wx_dev) general = url + `${config.wx_dev}` + general;

common/css/font-icon.css

@@ -2,9 +2,9 @@
   font-family: "iconfont"; /* Project id 3674157 */
   /* Color fonts */
   src: 
-       url('https://at.alicdn.com/t/c/font_3674157_mniu53a707.woff2?t=1671153198755') format('woff2'),
-       url('https://at.alicdn.com/t/c/font_3674157_mniu53a707.woff?t=1671153198755') format('woff'),
-       url('https://at.alicdn.com/t/c/font_3674157_mniu53a707.ttf?t=1671153198755') format('truetype');
+       url('https://at.alicdn.com/t/c/font_3674157_xuqydsn4nd.woff2?t=1673515464181') format('woff2'),
+       url('https://at.alicdn.com/t/c/font_3674157_xuqydsn4nd.woff?t=1673515464181') format('woff'),
+       url('https://at.alicdn.com/t/c/font_3674157_xuqydsn4nd.ttf?t=1673515464181') format('truetype');
 }
 
 .iconfont {
@@ -15,6 +15,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-tupian:before {
+  content: "\e67f";
+}
+
+.icon-gengduoneirong:before {
+  content: "\e623";
+}
+
 .icon-a-qingchuquanbuyidu:before {
   content: "\e71c";
 }
@@ -147,14 +155,6 @@
   content: "\e628";
 }
 
-.icon-dayufuhao:before {
-  content: "\e62b";
-}
-
-.icon-daifahuo:before {
-  content: "\e600";
-}
-
 .icon-daifukuan:before {
   content: "\e601";
 }

pages.json

@@ -45,6 +45,12 @@
 				"navigationBarTitleText": "购物车"
 			}
 		},
+		{
+			"path": "pages/message/index",
+			"style": {
+				"navigationBarTitleText": "消息"
+			}
+		},
 		{
 			"path": "pages/my/index",
 			"style": {
@@ -368,6 +374,18 @@
 					}
 				}
 			]
+		},
+		{
+			"root": "pagesMessage",
+			"pages": [
+				{
+					"path": "message/info",
+					"style": {
+						"navigationBarTitleText": "消息",
+						"enablePullDownRefresh": true
+					}
+				}
+			]
 		}
 	],
 	"globalStyle": {

pages/message/index.vue

@@ -0,0 +1,277 @@
+<template>
+	<mobile-frame :frameStyle="frameStyle" @toPath="toPath">
+		<scroll-view scroll-y="true" class="scroll-view" @scrolltolower="toPage">
+			<view class="list-scroll-view">
+				<view class="main">
+					<view class="one">
+						<input type="text" v-model="searchInfo.name" @input="toInput" placeholder="搜索">
+					</view>
+					<view class="two">
+						<view class="list" v-for="(item,index) in list" :key="index" @tap="toInfo(item)">
+							<image class="image" :src="item.file&&item.file.length>0?item.file[0].url:''" mode="">
+							</image>
+							<view class="content">
+								<view class="name">{{item.shop}}</view>
+								<view class="news">{{item.last_chat}}</view>
+							</view>
+							<view class="time">{{item.last_time}}</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+	</mobile-frame>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				frameStyle: {
+					useBar: true
+				},
+				user: {},
+				searchInfo: {},
+				list: [{
+						_id: '1111111',
+						shop: '客服1',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '222222',
+						shop: '客服2',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '333333',
+						shop: '客服3',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '444444',
+						shop: '客服4',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '555555',
+						shop: '客服5',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '666666',
+						shop: '客服6',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '77777777',
+						shop: '客服7',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '8888888',
+						shop: '客服8',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '99999999',
+						shop: '客服9',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					},
+					{
+						_id: '1010101010',
+						shop: '客服10',
+						last_chat: '宝贝上新啦，来看看是不是喜欢的',
+						last_time: '2023-01-12'
+					}
+				],
+				total: 0,
+				skip: 0,
+				limit: 10,
+				page: 0,
+			};
+		},
+		onLoad: async function() {
+			const that = this;
+			await that.watchlogin();
+		},
+		onPullDownRefresh: async function() {
+			const that = this;
+			that.clearPage();
+			await that.watchlogin();
+			uni.stopPullDownRefresh();
+		},
+		methods: {
+			// 监听用户是否登录
+			watchlogin() {
+				const that = this;
+				uni.getStorage({
+					key: 'token',
+					success: function(res) {
+						let user = that.$jwt(res.data);
+						if (user) {
+							that.$set(that, `user`, user)
+							that.search();
+						}
+					}
+				})
+			},
+			async search() {
+				const that = this;
+				let info = {
+					skip: that.skip,
+					limit: that.limit,
+					customer: that.user && that.user._id,
+				}
+				let res;
+				res = await that.$api(`/room`, `GET`, {
+					...info,
+					...that.searchInfo
+				}, 'chat');
+				if (res.errcode == '0') {
+					let list = [...that.list, ...res.data];
+					that.$set(that, `list`, list);
+					that.$set(that, `total`, res.total)
+				} else {
+					uni.showToast({
+						title: res.errmsg,
+						icon: 'none'
+					})
+				}
+			},
+			// 输入框
+			toInput(e) {
+				const that = this;
+				if (that.searchInfo.goods) that.$set(that.searchInfo, `goods`, e.detail.value)
+				else that.$set(that, `searchInfo`, {})
+				that.clearPage();
+				that.search();
+			},
+			// 详情
+			toInfo(e) {
+				uni.navigateTo({
+					url: `/pagesMessage/message/info?id=${e._id}&name=${e.shop}`
+				})
+			},
+			// 分页
+			toPage(e) {
+				const that = this;
+				let list = that.marketList;
+				let limit = that.limit;
+				if (that.total > list.length) {
+					uni.showLoading({
+						title: '加载中',
+						mask: true
+					})
+					let page = that.page + 1;
+					that.$set(that, `page`, page)
+					let skip = page * limit;
+					that.$set(that, `skip`, skip)
+					that.searchMarket();
+					uni.hideLoading();
+				}
+			},
+			clearPage() {
+				const that = this;
+				that.$set(that, `list`, [])
+				that.$set(that, `skip`, 0)
+				that.$set(that, `limit`, 10)
+				that.$set(that, `page`, 0)
+			},
+			// 菜单跳转
+			toPath(e) {
+				let url = `/${e.route}`;
+				if (e.type == '0') uni.redirectTo({
+					url
+				})
+				else {
+					uni.navigateTo({
+						url
+					})
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.main {
+		display: flex;
+		flex-direction: column;
+		width: 96vw;
+		padding: 2vw;
+		background-color: var(--f1Color);
+
+		.one {
+			input {
+				padding: 2vw;
+				background-color: #ffffff;
+				font-size: var(--font14Size);
+				border-radius: 10px;
+			}
+		}
+
+		.two {
+			margin: 1vw 0 0 0;
+
+			.list {
+				display: flex;
+				padding: 2vw;
+				margin: 1vw 0 0 0;
+				background-color: #ffffff;
+				border-radius: 10px;
+
+				.image {
+					width: 15vw;
+					height: 15vw;
+					border-radius: 15vw;
+					border: 1px solid #C0C0C0;
+				}
+
+				.content {
+					width: 52vw;
+					padding: 2vw;
+
+					.name {
+						font-size: 16px;
+						padding: 1vw 0;
+					}
+
+					.news {
+						font-size: 12px;
+						color: #C0C0C0;
+					}
+				}
+
+				.time {
+					width: 20vw;
+					text-align: right;
+					padding: 2vw 0;
+					font-size: 12px;
+					color: #C0C0C0;
+				}
+			}
+		}
+	}
+
+	.scroll-view {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+
+		.list-scroll-view {
+			display: flex;
+			flex-direction: column;
+		}
+	}
+</style>

pagesMessage/message/components/submit_1.vue

@@ -0,0 +1,163 @@
+<template>
+	<view>
+		<view class="submit">
+			<view class="submit-chat">
+				<!-- 文本框 -->
+				<textarea auto-height="true" class="chat-send btn" @confirm="inputs" @focus="focus"
+					v-model="msg"></textarea>
+				<view class="bt-img" @tap="more">
+					<text class="iconfont icon-gengduoneirong"></text>
+				</view>
+			</view>
+			<!-- 更多 -->
+			<view class="more" :class="{displaynone:!ismore}">
+				<view class="more-list" @tap="sendImg('album')">
+					<text class="iconfont icon-tupian"></text>
+					<view class="more-list-title">图片</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				ismore: false,
+				msg: "",
+			};
+		},
+		methods: {
+			//获取高度方法
+			getElementHeight() {
+				const query = uni.createSelectorQuery().in(this);
+				query.select('.submit').boundingClientRect(data => {
+					this.$emit('heights', data.height);
+				}).exec();
+			},
+			//文字发送
+			inputs(e) {
+				var chatm = e.detail.value;
+				if (chatm.length > 1) {
+					// 0为表情和文字
+					this.send(this.msg, 0)
+				}
+			},
+			// 输入框聚焦
+			focus() {
+				//关闭其他项
+				this.ismore = false;
+				setTimeout(() => {
+					this.getElementHeight()
+				}, 10)
+			},
+			//更多功能
+			more() {
+				this.ismore = !this.ismore;
+				setTimeout(() => {
+					this.getElementHeight();
+				}, 10)
+			},
+			//图片发送
+			sendImg(e) {
+				uni.chooseImage({
+					count: 9, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: [e], //从相册选择
+					// success: function (res) { //用function的方式会找不到send方法
+					success: (res) => {
+						const filePaths = res.tempFilePaths;
+						for (let i = 0; i < filePaths.length; i++) {
+							this.send(filePaths[i], 1)
+						}
+					}
+				});
+			},
+			//发送
+			send(msg, type) {
+				let date = {
+					message: msg,
+					type: type
+				}
+				this.$emit('inputs', date);
+				setTimeout(() => {
+					this.msg = '';
+				}, 0)
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.submit {
+		background: rgba(244, 244, 244, 0.96);
+		border-top: 1px solid rgba(39, 40, 50, 0.1);
+		width: 100%;
+		position: fixed;
+		bottom: 0;
+		z-index: 100;
+		padding-bottom: env(safe-area-inset-bottom);
+	}
+
+	.displaynone {
+		display: none;
+	}
+
+	.submit-chat {
+		width: 100%;
+		display: flex;
+		align-items: center;
+		box-sizing: border-box;
+		padding: 14rpx 14rpx;
+
+		.bt-img {
+			.iconfont {
+				font-size: 65rpx;
+			}
+		}
+
+		.btn {
+			flex: auto;
+			background-color: #fff;
+			border-radius: 10rpx;
+			padding: 20rpx;
+			max-height: 160rpx;
+			margin: 0 10rpx;
+		}
+
+		.chat-send {
+			line-height: 44rpx;
+		}
+	}
+
+	.more {
+		width: 100%;
+		height: 436rpx;
+		background: rgba(236, 237, 238, 1);
+		box-shadow: 0px 11rpx 0px 0px rgba(0, 0, 0, 0.1);
+		bottom: env(safe-area-inset-bottom);
+		padding: 8rpx 20rpx;
+		box-sizing: border-box;
+
+		.more-list {
+			width: 25%;
+			text-align: center;
+			float: left;
+			padding-top: 32rpx;
+			background-color: #ffffff;
+			border-radius: 20rpx;
+
+			.iconfont {
+				font-size: 65rpx;
+			}
+
+			.more-list-title {
+				margin: 10rpx 0;
+				font-size: 30rpx;
+				color: rgba(39, 40, 50, 0.5);
+				line-height: 34rpx;
+			}
+		}
+	}
+</style>

pagesMessage/message/info.vue

@@ -0,0 +1,324 @@
+<template>
+	<mobile-frame>
+		<view class="main">
+			<view class="one">
+				<!-- 聊天内容 -->
+				<scroll-view class="chat" scroll-y="true" scroll-with-animation="true" :scroll-into-view="scrollToView">
+					    <view class="chat-main" :style="{paddingBottom:inputh+'px'}">
+						<view class="chat-ls" v-for="(item,index) in unshiftmsg" :key="index" :id="'msg'+ index">
+							<view class="chat-time" v-if="item.time != ''">
+								{{item.time}}
+							</view>
+							<view class="msg-m msg-left" v-if="item.speaker !=  friendName">
+								<image class="user-img" :src="item.file&&item.file.length>0?item.file[0].url:''">
+								</image>
+								<!-- 文字 -->
+								<view class="message" v-if="item.TextType == 0">                           
+									<view class="msg-text">{{item.content}}</view>
+								</view>
+								<!-- 图像 -->
+								<view class="message" v-else @tap="previewImg(item.content)">
+									<image :src="item.content" class="msg-img" mode="widthFix"></image>
+								</view>
+							</view>
+							<view class="msg-m msg-right" v-if="item.speaker == friendName">
+								<image class="user-img" :src="item.file&&item.file.length>0?item.file[0].url:''">
+								</image>
+								<!-- 文字 -->
+								<view class="message" v-if="item.TextType == 0">
+									<view class="msg-text">{{item.content}}</view>
+								</view>
+								<!-- 图像 -->
+								<view class="message" v-else @tap="previewImg(item.content)">
+									<image :src="item.content" class="msg-img" mode="widthFix"></image>
+								</view>
+							</view>
+						</view>
+					</view>
+				</scroll-view>
+				<submit_1 @inputs="inputs" @heights="heights"></submit_1>
+			</view>
+		</view>
+	</mobile-frame>
+</template>
+
+<script>
+	import moment from 'moment';
+	import submit_1 from './components/submit_1.vue';
+	export default {
+		components: {
+			submit_1,
+		},
+		data() {
+			return {
+				friendName: "zs",
+				info: {},
+				id: '',
+				name: '',
+				msg: [],
+				// 反转数据接收
+				unshiftmsg: [{
+						"speaker": "zs",
+						"content": "这是第一条未读消息",
+						"time": "2023-01-12 12:21:03",
+						"TextType": 0
+					},
+					{
+						"speaker": "yy",
+						"content": "这是第二条未读消息",
+						"time": "2023-01-12 12:22:58",
+						"TextType": 0
+					},
+					{
+						"speaker": "zs",
+						"content": "这是第三条未读消息",
+						"time": "2023-01-12 12:22:03",
+						"TextType": 0
+					},
+					{
+						"speaker": "yy",
+						"content": "这是第四条未读消息",
+						"time": "2023-01-12 12:21:58",
+						"TextType": 0
+					},
+					{
+						"speaker": "zs",
+						"content": "这是第五条未读消息",
+						"time": "2023-01-12 12:22:03",
+						"TextType": 0
+					},
+					{
+						"speaker": "yy",
+						"content": "这是第六条未读消息",
+						"time": "2023-01-12 12:21:58",
+						"TextType": 0
+					},
+					{
+						"speaker": "zs",
+						"content": "这是第七条未读消息",
+						"time": "2023-01-12 12:22:03",
+						"TextType": 0
+					},
+					{
+						"speaker": "yy",
+						"content": "这是第八条未读消息",
+						"time": "2023-01-12 12:21:58",
+						"TextType": 0
+					},
+					{
+						"speaker": "zs",
+						"content": "这是第九条未读消息",
+						"time": "2023-01-12 12:22:03",
+						"TextType": 0
+					},
+					{
+						"speaker": "zs",
+						"content": "这是第十条未读消息",
+						"time": "2023-01-12 12:21:58",
+						"TextType": 0
+					},
+				],
+				imgMsg: [],
+				inputh: '60',
+				scrollToView: '',
+			};
+		},
+		onLoad: async function(e) {
+			const that = this;
+			that.$set(that, `id`, e.id);
+			that.$set(that, `name`, e.name);
+			// await that.searchOther();
+			if (e.name) {
+				uni.setNavigationBarTitle({
+					title: e.name
+				});
+			}
+			if (e.id) await that.search()
+		},
+		methods: {
+			async search() {
+				const that = this;
+				let res;
+				res = await that.$api(`/chatRecord`, `GET`, {
+					room: that.id
+				}, 'chat');
+				if (res.errcode == '0') {
+					console.log(res);
+				} else {
+					uni.showToast({
+						title: res.errmsg,
+						icon: 'none'
+					})
+				}
+				// 跳转到最后一条数据 与前面的:id进行对照
+				this.$nextTick(function() {
+					this.scrollToView = 'msg' + (this.unshiftmsg.length - 1)
+				})
+			},
+			// 进行图片的预览
+			previewImg(e) {
+				let index = 0;
+				for (let i = 0; i < this.imgMsg.length; i++) {
+					if (this.imgMsg[i] == e) {
+						index = i;
+					}
+				}
+				console.log("index", index)
+				// 预览图片
+				uni.previewImage({
+					current: index,
+					urls: this.imgMsg,
+					longPressActions: {
+						itemList: ['发送给朋友', '保存图片', '收藏'],
+						success: function(data) {
+							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
+						},
+						fail: function(err) {
+							console.log(err.errMsg);
+						}
+					}
+				});
+			},
+			//接受输入内容
+			inputs(e) {
+				//时间间隔处理
+				let data = {
+					"room": "1001",
+					"speaker": "zs",
+					"content": e.message,
+					"time": moment().format('YYYY-MM-DD HH:mm:ss'),
+					"TextType": e.type
+				};
+				// 发送给服务器消息
+				// onSendWS(JSON.stringify(data));
+
+				this.unshiftmsg.push(data);
+				// 跳转到最后一条数据 与前面的:id进行对照
+				this.$nextTick(function() {
+					this.scrollToView = 'msg' + (this.unshiftmsg.length - 1)
+				})
+				if (e.type == 1) {
+					this.imgMsg.push(e.message);
+				}
+				console.log(e)
+			},
+			//输入框高度
+			heights(e) {
+				this.inputh = e;
+				this.goBottom();
+			},
+			// 滚动到底部
+			goBottom() {
+				this.scrollToView = '';
+				this.$nextTick(function() {
+					this.scrollToView = 'msg' + (this.unshiftmsg.length - 1)
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.main {
+		display: flex;
+		flex-direction: column;
+		width: 100vw;
+		height: 100vh;
+
+		.one {
+			.chat {
+				height: 100%;
+
+				.chat-main {
+					padding-left: 32rpx;
+					padding-right: 32rpx;
+					padding-top: 20rpx;
+					display: flex;
+					flex-direction: column;
+				}
+
+				.chat-ls {
+					.chat-time {
+						font-size: 24rpx;
+						color: rgba(39, 40, 50, 0.3);
+						line-height: 34rpx;
+						padding: 10rpx 0rpx;
+						text-align: center;
+					}
+
+					.msg-m {
+						display: flex;
+						padding: 20rpx 0;
+
+						.user-img {
+							flex: none;
+							width: 80rpx;
+							height: 80rpx;
+							border-radius: 40rpx;
+							border: 1px solid #c0c0c0;
+						}
+
+						.message {
+							flex: none;
+							max-width: 480rpx;
+						}
+
+						.msg-text {
+							font-size: 32rpx;
+							color: rgba(39, 40, 50, 1);
+							line-height: 44rpx;
+							padding: 18rpx 24rpx;
+						}
+
+						.msg-img {
+							max-width: 400rpx;
+							border-radius: 20rpx;
+						}
+					}
+
+					.msg-left {
+						flex-direction: row;
+
+						.msg-text {
+							margin-left: 16rpx;
+							background-color: #f1f1f1;
+							border-radius: 0rpx 20rpx 20rpx 20rpx;
+						}
+
+						.ms-img {
+							margin-left: 16rpx;
+						}
+
+					}
+
+					.msg-right {
+						flex-direction: row-reverse;
+
+						.msg-text {
+							margin-right: 16rpx;
+							background-color: rgba(255, 228, 49, 0.8);
+							border-radius: 20rpx 0rpx 20rpx 20rpx;
+						}
+
+						.ms-img {
+							margin-right: 16rpx;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	.scroll-view {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+
+		.list-scroll-view {
+			display: flex;
+			flex-direction: column;
+		}
+	}
+</style>

pagesMy/order/all.vue

@@ -334,7 +334,6 @@
 						url: `/pagesMy/dough/info?id=${item._id}`
 					})
 				} else {
-					console.log(item);
 					uni.navigateTo({
 						url: `/pagesMy/order/info?id=${item._id}&status=${item.status}&is_order=${item.is_order}`
 					})

pagesMy/order/index.vue

@@ -148,6 +148,7 @@
 										</view>
 									</view>
 									<view class="btn">
+										<button size="mini" @tap.stop="toNotice(item)">客服</button>
 										<button v-if="item.status=='0'" size="mini"
 											@tap.stop="toCancel(item)">取消订单</button>
 										<button v-if="item.status=='0'" :disabled="disabled" size="mini"
@@ -326,6 +327,22 @@
 				let num = Math.sign(up - e.detail.scrollTop);
 				if (num == 1) that.$set(that, `is_bottom`, false);
 			},
+			// 联系客服
+			async toNotice(e) {
+				const that = this;
+				let form = {
+					"customer": e.customer && e.customer._id,
+					"shop": e.shop && e.shop._id
+				}
+				let res = await that.$api(`/room`, `GET`, form, 'chat');
+				if (res.errcode == '0') {
+					if (res.data && e.shop) {
+						uni.navigateTo({
+							url: `/pagesMessage/message/info?id=${res.data._id}&name=${e.shop.name}`
+						})
+					}
+				}
+			},
 			// 输入框
 			toInput(e) {
 				const that = this;