zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单列表发送

master
程 2022-12-29 18:20:06 +08:00
parent 1135c1fbc3
commit 0dc3124bba
11 changed files with 299 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
im/.env
View File

@ -4,3 +4,4 @@ VUE_APP_API_BASE_URL=https://im-api.pickmall.cn
VUE_APP_WEB_SOCKET_URL=wss://im-api.pickmall.cn/lili/webSocket VUE_APP_WEB_SOCKET_URL=wss://im-api.pickmall.cn/lili/webSocket
VUE_APP_COMMON=https://common-api.pickmall.cn VUE_APP_COMMON=https://common-api.pickmall.cn
VUE_APP_WEBSITE_NAME="LiLi IM" VUE_APP_WEBSITE_NAME="LiLi IM"
VUE_APP_PC_ORDER_URL=https://store-b2b2c.pickmall.cn

2
im/src/App.vue
View File

@ -27,9 +27,9 @@ export default {
unloadHandler (e) { unloadHandler (e) {
this.Handler = new Date().getTime() - this.beforeUnload; this.Handler = new Date().getTime() - this.beforeUnload;
if (this.Handler <= 5) { if (this.Handler <= 5) {
localStorage.setItem('btnHide', 1)
var storage = window.localStorage; var storage = window.localStorage;
storage.clear() storage.clear()
localStorage.setItem('btnHide', 1)
} }
}, },
}, },

4
im/src/api/user.js
View File

@ -24,3 +24,7 @@ export const ServeGetStoreDetail = (storeId) => {
export const ServeGetFootPrint = (params) => { export const ServeGetFootPrint = (params) => {
return get(`/im/user/history`,params); return get(`/im/user/history`,params);
}; };
// 获取订单列表信息
export const ServeGetOrderPrint = (params) => {
return get(`/im/orders/orders`,params);
};

34
im/src/components/chat/panel/OtherLink.vue
View File

@ -4,7 +4,8 @@
<div style="margin-left: 12px;" v-if="toUser.storeFlag"> <div style="margin-left: 12px;" v-if="toUser.storeFlag">
<GoodsLink :goodsDetail="goodsDetail" v-if="toUser.userId === goodsDetail.storeId" <GoodsLink :goodsDetail="goodsDetail" v-if="toUser.userId === goodsDetail.storeId"
@sendMessage="submitSendMessage" /> @sendMessage="submitSendMessage" />
<FootPrint :list="footPrintList" @loadMore="loadMoreFootPrint()" @sendMessage="submitSendMessage" /> <FootPrint :list="footPrintList" @loadMore="loadMoreFootPrint()" :orderList="orderPrintList"
@sendMessage="submitSendMessage" />
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="店铺信息" name="UserInfo" v-if="toUser.storeFlag"> <el-tab-pane label="店铺信息" name="UserInfo" v-if="toUser.storeFlag">
@ -17,7 +18,7 @@
<script> <script>
import { Tabs, TabPane } from 'element-ui' import { Tabs, TabPane } from 'element-ui'
import { ServeGetStoreDetail, ServeGetUserDetail, ServeGetFootPrint } from '@/api/user' import { ServeGetStoreDetail, ServeGetUserDetail, ServeGetFootPrint, ServeGetOrderPrint } from '@/api/user'
import { ServeGetGoodsDetail } from '@/api/goods' import { ServeGetGoodsDetail } from '@/api/goods'
import StoreDetail from "@/components/chat/panel/template/storeDetail.vue"; import StoreDetail from "@/components/chat/panel/template/storeDetail.vue";
import FootPrint from "@/components/chat/panel/template/footPrint.vue"; import FootPrint from "@/components/chat/panel/template/footPrint.vue";
@ -64,12 +65,11 @@ export default {
storeId: '', storeId: '',
}, },
goodsDetail: {}, goodsDetail: {},
footPrintList: [], footPrintList: [], // 商品
orderPrintList: []// 订单
} }
}, },
mounted () { mounted () {
console.log(this.id)
console.log(this.toUser)
if (this.toUser.storeFlag) { if (this.toUser.storeFlag) {
this.getStoreDetail() this.getStoreDetail()
} else { } else {
@ -127,23 +127,29 @@ export default {
res.result.records.splice(index, 1) res.result.records.splice(index, 1)
} }
}); });
console.log(this.footPrintParams, 'this.footPrintParamsthis.footPrintParamsthis.footPrintParams');
this.footPrintList.push(...res.result.records) this.footPrintList.push(...res.result.records)
}) })
//删除掉刚加入的商品 // 订单列表
ServeGetOrderPrint(this.footPrintParams).then((res) => {
if (res.code == 200) {
res.result.records.forEach((item) => {
this.orderPrintList.push({
...item,
btnHide: 1
})
})
// this.orderPrintList.push(...res.result.records)
}
})
}, },
// 发送消息回调事件 // 发送消息回调事件
submitSendMessage (record, context) { submitSendMessage (record, context, messageType) {
console.log("发送");
SocketInstance.emit("event_talk", record); SocketInstance.emit("event_talk", record);
this.$store.commit("UPDATE_TALK_ITEM", { this.$store.commit("UPDATE_TALK_ITEM", {
index_name: this.index_name, index_name: this.index_name,
draft_text: "", draft_text: "",
}); });
/** /**
* 插入数据 * 插入数据
*/ */
@ -152,13 +158,11 @@ export default {
fromUser: this.id, fromUser: this.id,
toUser: record.to, toUser: record.to,
isRead: false, isRead: false,
messageType: "GOODS", messageType: messageType,
text: context, text: context,
float: "right", float: "right",
}; };
console.log("insterChat", insterChat);
// console.log("插入对话记录",'')
// 插入对话记录 // 插入对话记录
this.$store.commit("PUSH_DIALOGUE", insterChat); this.$store.commit("PUSH_DIALOGUE", insterChat);
// 获取聊天面板元素节点 // 获取聊天面板元素节点

41
im/src/components/chat/panel/TalkPanel.vue
View File

@ -84,9 +84,17 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else-if="item.messageType == 'ORDER' && item.text != null" class="text-message" :class="{
<!-- {{ item.text }} --> left: item.float == 'left',
right: item.float == 'right',
}">
<a> 订单号:{{ item.text.sn }} </a>
<div class="baseTwo">
<img :src="item.text.groupImages" style="height: 100px;width: 100px;margin-top: 10px;" />
<span class="orderGoodsName" @click="linkToOrders(item.text.sn)">{{ item.text.groupName }}</span>
<span class="orderGoodsTime">{{ item.text.paymentTime }}</span>
</div>
</div>
<!-- 图片消息 --> <!-- 图片消息 -->
<!-- <image-message <!-- <image-message
v-else-if="item.messageType == 2 && item.file.file_type == 1" v-else-if="item.messageType == 2 && item.file.file_type == 1"
@ -478,6 +486,9 @@ export default {
if (item.messageType === 'GOODS') { if (item.messageType === 'GOODS') {
item.text = JSON.parse(item.text) item.text = JSON.parse(item.text)
} }
if (item.messageType === 'ORDER') {
item.text = JSON.parse(item.text)
}
return { ...item, [key]: key }; return { ...item, [key]: key };
}); });
this.$store.commit("UNSHIFT_DIALOGUE", records); this.$store.commit("UNSHIFT_DIALOGUE", records);
@ -809,6 +820,29 @@ export default {
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.orderSn {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.orderGoodsName {
width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: absolute;
margin-top: 10px;
margin-left: 10px;
}
.orderGoodsTime {
margin-left: 10px;
color: red;
position: absolute;
margin-top: 35px;
}
.main-box { .main-box {
position: relative; position: relative;
} }
@ -869,6 +903,7 @@ export default {
} }
} }
.base { .base {
margin-top: 5px; margin-top: 5px;
height: 120px; height: 120px;

92
im/src/components/chat/panel/template/footPrint.vue
View File

@ -8,9 +8,7 @@
<div class="base"> <div class="base">
<div> <div>
<img :src="item.thumbnail" class="image" /> <img :src="item.thumbnail" class="image" />
</div> </div>
<div style="margin-left: 13px"> <div style="margin-left: 13px">
<a class="goods_name" @click="linkToGoods(item.goodsId, item.id)">{{ item.goodsName }}</a> <a class="goods_name" @click="linkToGoods(item.goodsId, item.id)">{{ item.goodsName }}</a>
<div style="margin-top: 8px;"> <div style="margin-top: 8px;">
@ -27,22 +25,19 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="订单列表" name="orders"> <el-tab-pane label="订单列表" name="orders">
<dl> <dl>
<dd v-for="item in list" v-infinite-scroll="loadMore"> <dd v-for="(item, index) in orderList" v-infinite-scroll="loadMore" :key="index">
<div class="base"> <div style="margin-bottom: 20px;">
<div> <span class="orderSn">订单号：{{ item.sn }}</span>
<img :src="item.thumbnail" class="image" /> <img :src="item.groupImages" alt="暂无图片"
</div> style="height: 100px; width: 100px;margin-top: 10px; vertical-align: middle; ">
<div style="margin-left: 13px"> <span class="orderGoodsName" @click="linkToOrders(item.sn)"> {{ item.groupName }}</span>
<a class="goods_name" @click="linkToGoods(item.goodsId, item.id)">{{ item.goodsName }}</a> <span style="margin-left: 10px; color: red;">{{ item.paymentTime }}</span>
<div style="margin-top: 10px;"> <div class="orderBtn">
<span style="color: red;">￥{{ item.price }}</span> <el-button type="danger" class="store-button" v-if="item.btnHide == 1" size="mini"
</div> @click="submitSendOrderMessage(item, index)" plain>发送</el-button>
<div>
<el-button class="store-button" type="danger" v-if="item.btnHide == 1" size="mini"
@click="submitSendGoodsMessage(item)" plain>发送</el-button>
</div>
</div> </div>
</div> </div>
</dd> </dd>
</dl> </dl>
</el-tab-pane> </el-tab-pane>
@ -80,6 +75,7 @@ export default {
"el-tab-pane": TabPane, "el-tab-pane": TabPane,
}, },
methods: { methods: {
//跳转订单列表
scrollBottom (e) { scrollBottom (e) {
const { scrollTop, scrollHeight, clientHeight } = e.srcElement const { scrollTop, scrollHeight, clientHeight } = e.srcElement
@ -92,7 +88,6 @@ export default {
}, },
// 发送消息回调事件 // 发送消息回调事件
submitSendGoodsMessage (item) { submitSendGoodsMessage (item) {
console.log("发送");
const context = { const context = {
id: item.id, id: item.id,
goodsId: item.goodsId, goodsId: item.goodsId,
@ -108,7 +103,27 @@ export default {
context: context, context: context,
talk_id: this.toUser.id, talk_id: this.toUser.id,
}; };
this.$emit('sendMessage', record, context); this.$emit('sendMessage', record, context, 'GOODS');
localStorage.setItem(item.goodsId, 0)
item.btnHide = 0
},
// 发送订单列表
submitSendOrderMessage (item, index) {
const context = {
sn: item.sn,
groupImages: item.groupImages,
paymentTime: item.paymentTime,
groupName: item.groupName,
}
const record = {
operation_type: "MESSAGE",
to: this.toUser.userId,
from: this.id,
message_type: "ORDER",
context: context,
talk_id: this.toUser.id,
};
this.$emit('sendMessage', record, context, 'ORDER');
localStorage.setItem(item.goodsId, 0) localStorage.setItem(item.goodsId, 0)
item.btnHide = 0 item.btnHide = 0
}, },
@ -121,9 +136,13 @@ export default {
type: Array, type: Array,
default: [], default: [],
}, },
orderList: {
type: Array,
default: []
}
}, },
mounted () { mounted () {
console.log(this.list, 'list'); console.log(this.orderList, 'orderList');
this.btnHide = localStorage.getItem('btnHide') this.btnHide = localStorage.getItem('btnHide')
} }
} }
@ -131,6 +150,30 @@ export default {
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.orderGoodsName {
width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: absolute;
margin-left: 10px;
margin-top: 10px;
}
.orderSn {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.orderBtn {
display: flex;
justify-content: flex-end;
margin-right: 15px;
position: relative;
bottom: 30px;
}
.goods_name { .goods_name {
text-overflow: -o-ellipsis-lastline; text-overflow: -o-ellipsis-lastline;
overflow: hidden; overflow: hidden;
@ -169,7 +212,7 @@ export default {
.store-button { .store-button {
background-color: white; background-color: white;
border-color: #F56C6C; border-color: #F56C6C;
margin-top: 10px;
} }
.base { .base {
@ -177,15 +220,6 @@ export default {
height: 120px; height: 120px;
display: flex; display: flex;
div {
// overflow: hidden;
// text-overflow: ellipsis;
// white-space: nowrap;
// margin-top: 8px;
//
// margin-top: 4px;
}
.price { .price {
color: red; color: red;
margin-top: 15px; margin-top: 15px;

88
im/src/components/chat/panel/template/goodsLink.vue
View File

@ -1,5 +1,6 @@
<template> <template>
<div style="width: 350px;"> <div style="width: 350px;">
当前浏览
<div class="base"> <div class="base">
<div> <div>
<img :src="goodsDetail.thumbnail" class="image" /> <img :src="goodsDetail.thumbnail" class="image" />
@ -10,21 +11,23 @@
<span style="color: red;">￥{{ goodsDetail.price }}</span> <span style="color: red;">￥{{ goodsDetail.price }}</span>
</div> </div>
<div v-if="hide"> <div v-if="hide">
<el-button class="store-button" type="danger" v-if="btnHide == 1" size="mini" @click="submitSendMessage()" <el-button class="store-button" type="danger" v-if="!sendFlag && btnHide == 1" size="mini"
plain>发送</el-button> @click="submitSendMessage()" plain>发送</el-button>
</div> </div>
</div> </div>
</div> </div>
<hr class="separate" />
</div> </div>
</template> </template>
<script> <script>
import { Tag, button } from 'element-ui' import { Tag, button } from 'element-ui'
import { mapState, mapGetters } from "vuex"; import { mapState, mapGetters } from "vuex";
import SocketInstance from "@/im-server/socket-instance";
export default { export default {
data () { data () {
return { return {
sendFlag: false,
btnHide: undefined, btnHide: undefined,
hide: true hide: true
} }
@ -33,12 +36,12 @@ export default {
...mapGetters(["talkItems"]), ...mapGetters(["talkItems"]),
...mapState({ ...mapState({
id: (state) => state.user.id, id: (state) => state.user.id,
index_name: (state) => state.dialogue.index_name,
toUser: (state) => state.user.toUser, toUser: (state) => state.user.toUser,
}), }),
}, },
mounted () { mounted () {
this.btnHide = localStorage.getItem(this.goodsDetail.goodsId) this.btnHide = localStorage.getItem('btnHide')
}, },
components: { components: {
"el-tag": Tag, "el-tag": Tag,
@ -56,14 +59,7 @@ export default {
// 回车键发送消息回调事件 // 回车键发送消息回调事件
submitSendMessage () { submitSendMessage () {
console.log("发送"); console.log("发送");
const context = { const context = this.goodsDetail
id: this.goodsDetail.id,
goodsId: this.goodsDetail.goodsId,
thumbnail: this.goodsDetail.thumbnail,
price: this.goodsDetail.price,
goodsName: this.goodsDetail.goodsName
}
const record = { const record = {
operation_type: "MESSAGE", operation_type: "MESSAGE",
to: this.toUser.userId, to: this.toUser.userId,
@ -72,12 +68,74 @@ export default {
context: context, context: context,
talk_id: this.toUser.id, talk_id: this.toUser.id,
}; };
this.$emit('sendMessage', record, context); SocketInstance.emit("event_talk", record);
this.$store.commit("UPDATE_TALK_ITEM", {
index_name: this.index_name,
draft_text: "",
});
/**
* 插入数据
*/
const insterChat = {
createTime: this.formateDateAndTimeToString(new Date()),
fromUser: this.id,
toUser: record.to,
isRead: false,
messageType: "GOODS",
text: context,
float: "right",
};
console.log("insterChat", insterChat);
// console.log("插入对话记录",'')
// 插入对话记录
this.$store.commit("PUSH_DIALOGUE", insterChat);
// 获取聊天面板元素节点
let el = document.getElementById("lumenChatPanel");
// 判断的滚动条是否在底部
let isBottom =
Math.ceil(el.scrollTop) + el.clientHeight >= el.scrollHeight;
if (isBottom || record.to == this.id) {
this.$nextTick(() => {
el.scrollTop = el.scrollHeight;
});
} else {
this.$store.commit("SET_TLAK_UNREAD_MESSAGE", {
content: content,
nickname: record.name,
});
}
// 发送后隐藏按钮 0：隐藏 1：显示 // 发送后隐藏按钮 0：隐藏 1：显示
localStorage.setItem(this.goodsDetail.goodsId, 0) localStorage.setItem('btnHide', 0)
this.hide = false this.hide = false
}, },
formateDateAndTimeToString (date) {
var hours = date.getHours();
var mins = date.getMinutes();
var secs = date.getSeconds();
var msecs = date.getMilliseconds();
if (hours < 10) hours = "0" + hours;
if (mins < 10) mins = "0" + mins;
if (secs < 10) secs = "0" + secs;
if (msecs < 10) secs = "0" + msecs;
return (
this.formatDateToString(date) + " " + hours + ":" + mins + ":" + secs
);
},
formatDateToString (date) {
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
return year + "-" + month + "-" + day;
},
}, },
props: { props: {
goodsDetail: { goodsDetail: {

1
im/src/config/config.js
View File

@ -4,4 +4,5 @@ export default {
BASE_WS_URL: process.env.VUE_APP_WEB_SOCKET_URL || "", BASE_WS_URL: process.env.VUE_APP_WEB_SOCKET_URL || "",
BASE_COMMON: process.env.VUE_APP_COMMON || "", BASE_COMMON: process.env.VUE_APP_COMMON || "",
PC_URL: process.env.VUE_APP_PC_URL || "", PC_URL: process.env.VUE_APP_PC_URL || "",
STORE_URL:process.env.VUE_APP_PC_ORDER_URL || "http://192.168.0.139:10002",
}; };

4
im/src/main.js
View File

@ -32,6 +32,10 @@ Vue.prototype.linkToStore = function (storeId) { // 跳转买家端商品
console.log(`${config.PC_URL}/Merchant?id=${storeId}`) console.log(`${config.PC_URL}/Merchant?id=${storeId}`)
window.open(`${config.PC_URL}/Merchant?id=${storeId}`, '_blank') window.open(`${config.PC_URL}/Merchant?id=${storeId}`, '_blank')
}; };
// 订单跳转商家订单页面
Vue.prototype.linkToOrders = function (sn) { // 跳转买家端商品
window.open(`${config.STORE_URL}/order-detail?sn=${sn}`, '_blank')
};
const Instance = new Vue({ const Instance = new Vue({
router, router,
store, store,

110
im/src/views/message/index.vue
View File

@ -7,22 +7,22 @@
<el-container class="full-height" direction="vertical"> <el-container class="full-height" direction="vertical">
<!-- 搜索栏 --> <!-- 搜索栏 -->
<el-header height="60px" class="header"> <el-header height="60px" class="header">
<div class="user-login" v-popover:usercard> <div class="user-login" v-popover:usercard>
<div class="user-box"> <div class="user-box">
<face :text="face" class="user-face"></face> <face :text="face" class="user-face"></face>
</div>
</div> </div>
</div> <p class="user-status">
<p class="user-status"> <span v-if="name">{{ name }}</span>
<span v-if="name">{{ name }}</span> <span v-else>用户名称</span>
<span v-else>用户名称</span> </p>
</p> </el-header>
</el-header>
<el-header height="60px" class="header"> <el-header height="60px" class="header">
<div class="from-search"> <div class="from-search">
<el-input v-model="input" prefix-icon="el-icon-search" placeholder="搜索好友" size="small" /> <el-input v-model="input" prefix-icon="el-icon-search" placeholder="搜索好友" size="small" />
</div> </div>
</el-header> </el-header>
<!-- <el-header height="118px" class="logo-header"> <!-- <el-header height="118px" class="logo-header">
</el-header> --> </el-header> -->
<!-- 置顶栏 --> <!-- 置顶栏 -->
@ -80,8 +80,8 @@
<div class="card-name"> <div class="card-name">
<p class="nickname"> <p class="nickname">
{{ {{
item.remark_name ? item.remark_name : item.name item.remark_name ? item.remark_name : item.name
}} }}
</p> </p>
<div v-show="item.unread" class="larkc-tag"> <div v-show="item.unread" class="larkc-tag">
{{ item.unread }}条未读 {{ item.unread }}条未读
@ -106,13 +106,13 @@
</div> </div>
</div> </div>
<div class="talk-message"> <div class="talk-message">
<span v-if="item.lastMessageType === 'MESSAGE'">{{ item.lastTalkMessage }}</span> <span v-if="item.lastMessageType === 'MESSAGE'">{{ item.lastTalkMessage }}</span>
<span v-if="item.lastMessageType === 'GOODS'">[商品链接]</span> <span v-if="item.lastMessageType === 'GOODS'">[商品链接]</span>
</div> </div>
<div class="content"> <div class="content">
<template v-if=" <template v-if="
index_name != item.index_name && item.draft_text index_name != item.index_name && item.draft_text
"> ">
<span class="draft-color">[草稿]</span> <span class="draft-color">[草稿]</span>
<span>{{ item.draft_text }}</span> <span>{{ item.draft_text }}</span>
</template> </template>
@ -137,9 +137,9 @@
<!-- 聊天面板容器 --> <!-- 聊天面板容器 -->
<el-main class="main-box ov-hidden full-height no-padding flex"> <el-main class="main-box ov-hidden full-height no-padding flex">
<WelcomeModule class="flex-8" v-if="index_name == null" /> <WelcomeModule class="flex-8" v-if="index_name == null" />
<TalkPanel v-else class="full-height flex-8" :params="params" :goodsParams="goodsParams" :is-online="isFriendOnline" @change-talk="changeTalk" <TalkPanel v-else class="full-height flex-8" :params="params" :goodsParams="goodsParams"
@close-talk="closeTalk" /> :is-online="isFriendOnline" @change-talk="changeTalk" @close-talk="closeTalk" />
<!-- <OtherLink :toUser="toUser" :goodsParams="goodsParams" :id="id" class="flex-4"/> --> <!-- <OtherLink :toUser="toUser" :goodsParams="goodsParams" :id="id" class="flex-4"/> -->
</el-main> </el-main>
</el-container> </el-container>
@ -179,7 +179,7 @@ export default {
OtherLink, OtherLink,
WelcomeModule, WelcomeModule,
}, },
data() { data () {
return { return {
activeIndex: 9999999, //默认样式索引 activeIndex: 9999999, //默认样式索引
subHeaderShadow: false, subHeaderShadow: false,
@ -192,8 +192,8 @@ export default {
nickname: "", nickname: "",
clickFlag: true, clickFlag: true,
}, },
goodsParams:{ goodsParams: {
goodsId: '', goodsId: '',
skuId: '', skuId: '',
}, },
@ -225,7 +225,7 @@ export default {
toUser: (state) => state.user.toUser, toUser: (state) => state.user.toUser,
}), }),
// 计算置顶栏目的高度 // 计算置顶栏目的高度
subHeaderPx() { subHeaderPx () {
const n = 7; // 一排能显示的用户数 const n = 7; // 一排能显示的用户数
const num = this.topItems.length; const num = this.topItems.length;
let len = 60; let len = 60;
@ -238,17 +238,17 @@ export default {
}, },
// 当前对话好友在线状态 // 当前对话好友在线状态
isFriendOnline() { isFriendOnline () {
let index = findTalkIndex(this.index_name); let index = findTalkIndex(this.index_name);
return index >= 0 && this.talks[index].is_online == 1; return index >= 0 && this.talks[index].is_online == 1;
}, },
}, },
watch: { watch: {
talkItems(val) { talkItems (val) {
val ? this.$set(this, "userTalkItem", val) : ""; val ? this.$set(this, "userTalkItem", val) : "";
}, },
// 搜索用户的时候 根据当前用户表进行模糊搜索 // 搜索用户的时候 根据当前用户表进行模糊搜索
input(val, oldVal) { input (val, oldVal) {
console.log(val, oldVal); console.log(val, oldVal);
if (val) { if (val) {
let str = ["", ...val, ""].join(".*"); let str = ["", ...val, ""].join(".*");
@ -260,7 +260,7 @@ export default {
this.userTalkItem = this.talkItems; this.userTalkItem = this.talkItems;
} }
}, },
unreadNum(value) { unreadNum (value) {
clearInterval(this.interval); clearInterval(this.interval);
console.log("%c 更新未读消息", "color:#32ccbc"); console.log("%c 更新未读消息", "color:#32ccbc");
this.$store.commit("SET_UNREAD_NUM", value); this.$store.commit("SET_UNREAD_NUM", value);
@ -276,7 +276,7 @@ export default {
}, },
// 监听好友在线状态 // 监听好友在线状态
monitorFriendsStatus(value) { monitorFriendsStatus (value) {
this.$store.commit("UPDATE_TALK_ITEM", { this.$store.commit("UPDATE_TALK_ITEM", {
index_name: `1_${value.friend_id}`, index_name: `1_${value.friend_id}`,
is_online: value.status, is_online: value.status,
@ -284,15 +284,15 @@ export default {
}, },
}, },
beforeRouteUpdate(to, from, next) { beforeRouteUpdate (to, from, next) {
let index_name = getCacheIndexName(); let index_name = getCacheIndexName();
if (index_name) this.clickTab(index_name); if (index_name) this.clickTab(index_name);
next(); next();
}, },
beforeCreate() { beforeCreate () {
setToken(this.$route.query.token); setToken(this.$route.query.token);
}, },
async created() { async created () {
await this.initialize(); await this.initialize();
await this.loadUserSetting(); await this.loadUserSetting();
/** /**
@ -303,10 +303,10 @@ export default {
}, },
mounted() { mounted () {
this.scrollEvent(); this.scrollEvent();
}, },
destroyed() { destroyed () {
document.title = title; document.title = title;
clearInterval(this.interval); clearInterval(this.interval);
this.clearTalk(); this.clearTalk();
@ -316,18 +316,18 @@ export default {
beautifyTime, beautifyTime,
//创建会话 //创建会话
async createTalk(id) { async createTalk (id) {
await ServeCreateTalkList(id); await ServeCreateTalkList(id);
await this.loadChatList(); await this.loadChatList();
}, },
// header 功能栏隐藏事件 // header 功能栏隐藏事件
closeSubMenu() { closeSubMenu () {
this.subMenu = false; this.subMenu = false;
}, },
// 清除当前对话 // 清除当前对话
clearTalk() { clearTalk () {
this.params = { this.params = {
talk_type: 0, talk_type: 0,
receiver_id: 0, receiver_id: 0,
@ -343,7 +343,7 @@ export default {
}, },
// 工具栏事件 // 工具栏事件
triggerSubMenu(type) { triggerSubMenu (type) {
this.closeSubMenu(); this.closeSubMenu();
if (type == 1) { if (type == 1) {
@ -354,14 +354,14 @@ export default {
}, },
// 监听自定义滚动条事件 // 监听自定义滚动条事件
scrollEvent() { scrollEvent () {
let scrollbarEl = this.$refs.menusScrollbar.wrap; let scrollbarEl = this.$refs.menusScrollbar.wrap;
scrollbarEl.onscroll = () => { scrollbarEl.onscroll = () => {
this.subHeaderShadow = scrollbarEl.scrollTop > 0; this.subHeaderShadow = scrollbarEl.scrollTop > 0;
}; };
}, },
// 获取用户对话列表 // 获取用户对话列表
loadChatList() { loadChatList () {
this.loadStatus = this.talkNum == 0 ? 0 : 1; this.loadStatus = this.talkNum == 0 ? 0 : 1;
ServeGetTalkList() ServeGetTalkList()
@ -393,7 +393,7 @@ export default {
}, },
// 切换聊天栏目 // 切换聊天栏目
clickTab(id, val, index) { clickTab (id, val, index) {
if (!id) return; if (!id) return;
this.activeIndex = index; this.activeIndex = index;
let item = let item =
@ -433,13 +433,13 @@ export default {
}); });
}, },
// 修改当前对话 // 修改当前对话
changeTalk(index_name) { changeTalk (index_name) {
console.log("修改当前对话", index_name); console.log("修改当前对话", index_name);
sessionStorage.setItem("send_message_index_name", index_name); sessionStorage.setItem("send_message_index_name", index_name);
this.loadChatList(); this.loadChatList();
}, },
// 关闭当前对话及刷新对话列表 // 关闭当前对话及刷新对话列表
closeTalk() { closeTalk () {
this.$store.commit("UPDATE_DIALOGUE_MESSAGE", { this.$store.commit("UPDATE_DIALOGUE_MESSAGE", {
talk_type: 0, talk_type: 0,
receiver_id: 0, receiver_id: 0,
@ -449,7 +449,7 @@ export default {
this.loadChatList(); this.loadChatList();
}, },
// 对话列表的右键自定义菜单 // 对话列表的右键自定义菜单
talkItemsMenu(item, event) { talkItemsMenu (item, event) {
let items = { let items = {
items: [ items: [
{ {
@ -526,7 +526,7 @@ export default {
return false; return false;
}, },
// 置顶栏右键菜单栏 // 置顶栏右键菜单栏
topItemsMenu(item, event) { topItemsMenu (item, event) {
this.$contextmenu({ this.$contextmenu({
items: [ items: [
{ {
@ -544,7 +544,7 @@ export default {
return false; return false;
}, },
// 会话列表置顶 // 会话列表置顶
topChatItem(item) { topChatItem (item) {
ServeTopTalkList({ ServeTopTalkList({
list_id: item.id, list_id: item.id,
type: item.is_top == 0 ? 1 : 2, type: item.is_top == 0 ? 1 : 2,
@ -558,7 +558,7 @@ export default {
}); });
}, },
// 设置消息免打扰 // 设置消息免打扰
setNotDisturb(item) { setNotDisturb (item) {
ServeSetNotDisturb({ ServeSetNotDisturb({
talk_type: item.talk_type, talk_type: item.talk_type,
receiver_id: item.receiver_id, receiver_id: item.receiver_id,
@ -573,7 +573,7 @@ export default {
}); });
}, },
// 移除会话列表 // 移除会话列表
delChatItem(item) { delChatItem (item) {
ServeDeleteTalkList({ ServeDeleteTalkList({
list_id: item.id, list_id: item.id,
}).then(({ code }) => { }).then(({ code }) => {
@ -584,7 +584,7 @@ export default {
}); });
}, },
// 解除好友关系 // 解除好友关系
removeFriend(item) { removeFriend (item) {
ServeDeleteContact({ ServeDeleteContact({
friend_id: item.receiver_id, friend_id: item.receiver_id,
}).then(({ code }) => { }).then(({ code }) => {
@ -598,7 +598,7 @@ export default {
}); });
}, },
// 修改好友备注信息 // 修改好友备注信息
editFriendRemarks(item) { editFriendRemarks (item) {
let title = `您正在设置【${item.name}】好友的备注信息`; let title = `您正在设置【${item.name}】好友的备注信息`;
if (item.remark_name) { if (item.remark_name) {
@ -611,7 +611,7 @@ export default {
customClass: "border-radius0", customClass: "border-radius0",
inputPlaceholder: "请设置好友备注信息", inputPlaceholder: "请设置好友备注信息",
inputValue: item.remark_name ? item.remark_name : item.name, inputValue: item.remark_name ? item.remark_name : item.name,
inputValidator(val) { inputValidator (val) {
return val == null || val == "" ? "好友备注不能为空" : true; return val == null || val == "" ? "好友备注不能为空" : true;
}, },
}) })
@ -979,11 +979,13 @@ export default {
} }
} }
} }
.talk-message{
.talk-message {
font-size: 12px; font-size: 12px;
color:#8f959e; color: #8f959e;
} }
.user-face{
.user-face {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }

75
seller/src/views/home/home.vue
View File

@ -10,15 +10,15 @@
<div class="box-left"> <div class="box-left">
<div class="card shop flex"> <div class="card shop flex">
<div> <div>
<h4>Hi,<span style="margin-left:5px;">{{userData.nickName}}</span></h4> <h4>Hi,<span style="margin-left:5px;">{{ userData.nickName }}</span></h4>
<img class="shop-logo" :src="userData.storeLogo || require('@/assets/logo1.png')" alt=""> <img class="shop-logo" :src="userData.storeLogo || require('@/assets/logo1.png')" alt="">
</div> </div>
<div class="shop-box"> <div class="shop-box">
<div class="box-item"> <div class="box-item">
<div>店铺名称：{{userData.storeName || '暂无'}}</div> <div>店铺名称：{{ userData.storeName || '暂无' }}</div>
</div> </div>
<div class="box-item"> <div class="box-item">
<div>店铺状态：{{userData.storeDisable=='OPEN' ? '开启中' : '关闭'}}</div> <div>店铺状态：{{ userData.storeDisable == 'OPEN' ? '开启中' : '关闭' }}</div>
</div> </div>
<div class="box-item" @click="im()"> <div class="box-item" @click="im()">
<Button type="info">点击登录客服</Button> <Button type="info">点击登录客服</Button>
@ -27,27 +27,30 @@
<div class="rate-box"> <div class="rate-box">
<div> <div>
<i-circle :size="120" stroke-color="#fecb89" :trail-width="4" :stroke-width="5" :percent="(userData.serviceScore * 20)" stroke-linecap="square"> <i-circle :size="120" stroke-color="#fecb89" :trail-width="4" :stroke-width="5"
:percent="(userData.serviceScore * 20)" stroke-linecap="square">
<div class="demo-Circle-custom"> <div class="demo-Circle-custom">
<p class="bold">{{userData.serviceScore}}分</p> <p class="bold">{{ userData.serviceScore }}分</p>
</div> </div>
</i-circle> </i-circle>
<h5>服务得分</h5> <h5>服务得分</h5>
</div> </div>
<div> <div>
<i-circle :size="120" stroke-color="#a7c5eb" :trail-width="4" :stroke-width="5" :percent="(userData.deliveryScore * 20)" stroke-linecap="square"> <i-circle :size="120" stroke-color="#a7c5eb" :trail-width="4" :stroke-width="5"
:percent="(userData.deliveryScore * 20)" stroke-linecap="square">
<div> <div>
<p class="bold">{{userData.deliveryScore}}分</p> <p class="bold">{{ userData.deliveryScore }}分</p>
</div> </div>
</i-circle> </i-circle>
<h5>交货得分</h5> <h5>交货得分</h5>
</div> </div>
<div> <div>
<i-circle :size="120" stroke-color="#848ccf" :trail-width="4" :stroke-width="5" :percent="(userData.descriptionScore * 20)" stroke-linecap="square"> <i-circle :size="120" stroke-color="#848ccf" :trail-width="4" :stroke-width="5"
:percent="(userData.descriptionScore * 20)" stroke-linecap="square">
<div> <div>
<p class="bold">{{userData.descriptionScore}}分</p> <p class="bold">{{ userData.descriptionScore }}分</p>
</div> </div>
</i-circle> </i-circle>
<h5>评价得分</h5> <h5>评价得分</h5>
@ -60,7 +63,7 @@
<div class="detail-list"> <div class="detail-list">
<div class="detail-item" @click="navigateTo('orderList')"> <div class="detail-item" @click="navigateTo('orderList')">
<div> <div>
<span>{{homeData.unPaidOrder || 0}}</span> <span>{{ homeData.unPaidOrder || 0 }}</span>
<div>待付款</div> <div>待付款</div>
</div> </div>
<div class="detail-title"> <div class="detail-title">
@ -70,11 +73,11 @@
<div class="detail-item" @click="navigateTo('orderList')"> <div class="detail-item" @click="navigateTo('orderList')">
<div> <div>
<span>{{homeData.unDeliveredOrder || 0}}</span> <span>{{ homeData.unDeliveredOrder || 0 }}</span>
<div>待发货</div> <div>待发货</div>
</div> </div>
<div> <div>
<span>{{homeData.deliveredOrder || 0}}</span> <span>{{ homeData.deliveredOrder || 0 }}</span>
<div>待收货</div> <div>待收货</div>
</div> </div>
<div class="detail-title"> <div class="detail-title">
@ -83,15 +86,15 @@
</div> </div>
<div class="detail-item"> <div class="detail-item">
<div @click="navigateTo('returnMoneyOrder')"> <div @click="navigateTo('returnMoneyOrder')">
<span>{{homeData.returnMoney || 0}}</span> <span>{{ homeData.returnMoney || 0 }}</span>
<div>退款</div> <div>退款</div>
</div> </div>
<div @click="navigateTo('returnGoodsOrder')"> <div @click="navigateTo('returnGoodsOrder')">
<span>{{homeData.returnGoods || 0}}</span> <span>{{ homeData.returnGoods || 0 }}</span>
<div>退货</div> <div>退货</div>
</div> </div>
<div @click="navigateTo('memberComment')"> <div @click="navigateTo('memberComment')">
<span>{{homeData.memberEvaluation || 0}}</span> <span>{{ homeData.memberEvaluation || 0 }}</span>
<div>待评价</div> <div>待评价</div>
</div> </div>
<div class="detail-title"> <div class="detail-title">
@ -100,7 +103,7 @@
</div> </div>
<div class="detail-item" @click="navigateTo('orderComplaint')"> <div class="detail-item" @click="navigateTo('orderComplaint')">
<div> <div>
<span>{{homeData.complaint || 0}}</span> <span>{{ homeData.complaint || 0 }}</span>
<div>待处理</div> <div>待处理</div>
</div> </div>
@ -110,11 +113,11 @@
</div> </div>
<div class="detail-item" @click="navigateTo('goods')"> <div class="detail-item" @click="navigateTo('goods')">
<div> <div>
<span>{{homeData.waitUpper || 0}}</span> <span>{{ homeData.waitUpper || 0 }}</span>
<div>待上架</div> <div>待上架</div>
</div> </div>
<div> <div>
<span>{{homeData.waitAuth || 0}}</span> <span>{{ homeData.waitAuth || 0 }}</span>
<div>审核中</div> <div>审核中</div>
</div> </div>
<div class="detail-title"> <div class="detail-title">
@ -124,11 +127,11 @@
<div class="detail-item"> <div class="detail-item">
<div @click="navigateTo('seckill')"> <div @click="navigateTo('seckill')">
<span>{{homeData.seckillNum || 0}}</span> <span>{{ homeData.seckillNum || 0 }}</span>
<div>秒杀活动</div> <div>秒杀活动</div>
</div> </div>
<div @click="navigateTo('accountStatementBill')"> <div @click="navigateTo('accountStatementBill')">
<span>{{homeData.waitPayBill || 0}}</span> <span>{{ homeData.waitPayBill || 0 }}</span>
<div>等待对账</div> <div>等待对账</div>
</div> </div>
<div class="detail-title"> <div class="detail-title">
@ -143,8 +146,8 @@
<div class="card box-right"> <div class="card box-right">
<h4>平台公告</h4> <h4>平台公告</h4>
<div> <div>
<div class="notice-title" v-for="(item,index) in notices" :key="index"> <div class="notice-title" v-for="(item, index) in notices" :key="index">
<a @click="clickLinkNotices(item)">{{item.title}}</a> <a @click="clickLinkNotices(item)">{{ item.title }}</a>
</div> </div>
</div> </div>
</div> </div>
@ -158,7 +161,7 @@
<Icon class="icon" size="31" type="md-photos" /> <Icon class="icon" size="31" type="md-photos" />
</div> </div>
<div> <div>
<div class="counts">{{homeData.goodsNum ||0}}</div> <div class="counts">{{ homeData.goodsNum || 0 }}</div>
<div>商品数量</div> <div>商品数量</div>
</div> </div>
@ -168,7 +171,7 @@
<Icon class="icon" size="31" type="ios-card" /> <Icon class="icon" size="31" type="ios-card" />
</div> </div>
<div> <div>
<div class="counts">{{homeData.orderPrice || 0 | unitPrice('￥')}}</div> <div class="counts">{{ homeData.orderPrice || 0 | unitPrice('￥') }}</div>
<div>订单总额</div> <div>订单总额</div>
</div> </div>
@ -179,7 +182,7 @@
<Icon class="icon" size="31" type="md-list" /> <Icon class="icon" size="31" type="md-list" />
</div> </div>
<div> <div>
<div class="counts">{{homeData.orderNum ||0}}</div> <div class="counts">{{ homeData.orderNum || 0 }}</div>
<div>订单数量</div> <div>订单数量</div>
</div> </div>
@ -189,7 +192,7 @@
<Icon class="icon" size="31" type="md-person" /> <Icon class="icon" size="31" type="md-person" />
</div> </div>
<div> <div>
<div class="counts">{{homeData.storeUV ||0}}</div> <div class="counts">{{ homeData.storeUV || 0 }}</div>
<div>访客数量</div> <div>访客数量</div>
</div> </div>
@ -207,7 +210,7 @@ import Cookies from "js-cookie";
export default { export default {
name: "home", name: "home",
data() { data () {
return { return {
noticeFlage: false, // 控制平台公告显隐 noticeFlage: false, // 控制平台公告显隐
@ -217,18 +220,18 @@ export default {
noticesDetail: { // 平台公告详情 noticesDetail: { // 平台公告详情
title: "", title: "",
}, },
IMLink:"", IMLink: "",
}; };
}, },
methods: { methods: {
// 跳转页面 // 跳转页面
navigateTo(name) { navigateTo (name) {
this.$router.push({ this.$router.push({
name, name,
}); });
}, },
// 初始化数据 // 初始化数据
async init() { async init () {
let userInfo = JSON.parse(Cookies.get("userInfoSeller")); let userInfo = JSON.parse(Cookies.get("userInfoSeller"));
this.userData = userInfo; this.userData = userInfo;
@ -239,14 +242,14 @@ export default {
} }
}, },
// 跳转文章页 // 跳转文章页
async clickLinkNotices(val) { async clickLinkNotices (val) {
let res = await seeArticle(val.id); let res = await seeArticle(val.id);
if (res.success) { if (res.success) {
this.noticesDetail = res.result; this.noticesDetail = res.result;
this.noticeFlage = true; this.noticeFlage = true;
} }
}, },
async im() { async im () {
// 获取访问Token // 获取访问Token
let accessToken = this.getStore("accessToken"); let accessToken = this.getStore("accessToken");
await this.getIMDetailMethods(); await this.getIMDetailMethods();
@ -254,25 +257,25 @@ export default {
this.$Message.error("请登录后再联系客服"); this.$Message.error("请登录后再联系客服");
return; return;
} }
window.open(" http://192.168.0.113:8000?token=" + accessToken); window.open(" http://192.168.0.139:8000?token=" + accessToken);
}, },
// 获取im信息 // 获取im信息
async getIMDetailMethods() { async getIMDetailMethods () {
let res = await getIMDetail(); let res = await getIMDetail();
if (res.success) { if (res.success) {
this.IMLink = res.result; this.IMLink = res.result;
} }
}, },
// 获取首页数据 // 获取首页数据
async getHomeData() { async getHomeData () {
let res = await getSellerHomeData(); let res = await getSellerHomeData();
if (res.success) { if (res.success) {
this.homeData = res.result; this.homeData = res.result;
} }
}, },
}, },
mounted() { mounted () {
this.init(); this.init();
this.getHomeData(); this.getHomeData();
}, },