master
parent
3881370b6e
commit
e8b7a85140
|
@ -477,6 +477,70 @@
|
|||
"webpack-merge": "^4.2.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-convert": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
|
||||
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^4.1.0",
|
||||
"supports-color": "^7.1.0"
|
||||
}
|
||||
},
|
||||
"color-convert": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
|
||||
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-name": "~1.1.4"
|
||||
}
|
||||
},
|
||||
"color-name": {
|
||||
"version": "1.1.4",
|
||||
"resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.4.tgz",
|
||||
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"json5": {
|
||||
"version": "2.2.2",
|
||||
"resolved": "https://registry.npmmirror.com/json5/-/json5-2.2.2.tgz",
|
||||
"integrity": "sha512-46Tk9JiOL2z7ytNQWFLpj99RZkVgeHf87yGQKsIkaPz1qSH9UczKH1rO7K3wgRselo0tYMUNfecYpm/p1vC7tQ==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"loader-utils": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.4.tgz",
|
||||
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"big.js": "^5.2.2",
|
||||
"emojis-list": "^3.0.0",
|
||||
"json5": "^2.1.2"
|
||||
}
|
||||
},
|
||||
"postcss-loader": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/postcss-loader/-/postcss-loader-3.0.0.tgz",
|
||||
|
@ -521,6 +585,28 @@
|
|||
"ajv-errors": "^1.0.0",
|
||||
"ajv-keywords": "^3.1.0"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
|
||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"vue-loader-v16": {
|
||||
"version": "npm:vue-loader@16.8.3",
|
||||
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
|
||||
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"chalk": "^4.1.0",
|
||||
"hash-sum": "^2.0.0",
|
||||
"loader-utils": "^2.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -10192,94 +10278,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"vue-loader-v16": {
|
||||
"version": "npm:vue-loader@16.8.3",
|
||||
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
|
||||
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"chalk": "^4.1.0",
|
||||
"hash-sum": "^2.0.0",
|
||||
"loader-utils": "^2.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-convert": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
|
||||
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^4.1.0",
|
||||
"supports-color": "^7.1.0"
|
||||
}
|
||||
},
|
||||
"color-convert": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
|
||||
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-name": "~1.1.4"
|
||||
}
|
||||
},
|
||||
"color-name": {
|
||||
"version": "1.1.4",
|
||||
"resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.4.tgz",
|
||||
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"json5": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmmirror.com/json5/-/json5-2.2.1.tgz",
|
||||
"integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"loader-utils": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.4.tgz",
|
||||
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"big.js": "^5.2.2",
|
||||
"emojis-list": "^3.0.0",
|
||||
"json5": "^2.1.2"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
|
||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"vue-piczoom": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmmirror.com/vue-piczoom/-/vue-piczoom-1.0.6.tgz",
|
||||
|
|
|
@ -8,26 +8,18 @@
|
|||
<div class="shop-nav-container">
|
||||
<Breadcrumb>
|
||||
<BreadcrumbItem to="/">首页</BreadcrumbItem>
|
||||
<BreadcrumbItem
|
||||
v-for="(item, index) in categoryBar"
|
||||
:to="goGoodsList(index)"
|
||||
target="_blank"
|
||||
:key="index"
|
||||
>
|
||||
<BreadcrumbItem v-for="(item, index) in categoryBar" :to="goGoodsList(index)" target="_blank" :key="index">
|
||||
{{ item.name }}
|
||||
</BreadcrumbItem>
|
||||
</Breadcrumb>
|
||||
<div class="store-collect">
|
||||
<span class="mr_10" v-if="goodsMsg.data">
|
||||
<router-link :to="'Merchant?id=' + goodsMsg.data.storeId">{{
|
||||
goodsMsg.data.storeName
|
||||
}}</router-link>
|
||||
goodsMsg.data.storeName
|
||||
}}</router-link>
|
||||
</span>
|
||||
<span @click="collect">
|
||||
<Icon
|
||||
type="ios-heart"
|
||||
:color="storeCollected ? '#ed3f14' : '#666'"
|
||||
/>
|
||||
<Icon type="ios-heart" :color="storeCollected ? '#ed3f14' : '#666'" />
|
||||
{{ storeCollected ? "已收藏店铺" : "收藏店铺" }}
|
||||
</span>
|
||||
<span class="ml_10" @click="IMService()">联系客服</span>
|
||||
|
@ -36,11 +28,7 @@
|
|||
</div>
|
||||
|
||||
<!-- 商品信息展示 -->
|
||||
<ShowGoods
|
||||
@handleClickSku="targetClickSku"
|
||||
v-if="goodsMsg.data"
|
||||
:detail="goodsMsg"
|
||||
></ShowGoods>
|
||||
<ShowGoods @handleClickSku="targetClickSku" v-if="goodsMsg.data" :detail="goodsMsg"></ShowGoods>
|
||||
<!-- 商品详细展示 -->
|
||||
<ShowGoodsDetail v-if="goodsMsg.data" :detail="goodsMsg"></ShowGoodsDetail>
|
||||
|
||||
|
@ -66,14 +54,14 @@ import { getIMDetail } from "@/api/common";
|
|||
import Storage from "../plugins/storage";
|
||||
export default {
|
||||
name: "GoodsDetail",
|
||||
beforeRouteEnter(to, from, next) {
|
||||
beforeRouteEnter (to, from, next) {
|
||||
window.scrollTo(0, 0);
|
||||
next();
|
||||
},
|
||||
created() {
|
||||
created () {
|
||||
this.getGoodsDetail();
|
||||
},
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
goodsMsg: {}, // 商品信息
|
||||
isLoading: false, // 加载状态
|
||||
|
@ -85,7 +73,7 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
// 跳转im客服
|
||||
async IMService() {
|
||||
async IMService () {
|
||||
// 获取访问Token
|
||||
let accessToken = Storage.getItem("accessToken");
|
||||
await this.getIMDetailMethods();
|
||||
|
@ -95,29 +83,30 @@ export default {
|
|||
}
|
||||
window.open(
|
||||
this.IMLink +
|
||||
"?token=" +
|
||||
accessToken +
|
||||
"&id=" +
|
||||
this.goodsMsg.data.storeId +
|
||||
"&goodsId=" +
|
||||
this.goodsMsg.data.goodsId +
|
||||
"&skuId=" +
|
||||
this.goodsMsg.data.id
|
||||
"?token=" +
|
||||
accessToken +
|
||||
"&id=" +
|
||||
this.goodsMsg.data.storeId +
|
||||
"&goodsId=" +
|
||||
this.goodsMsg.data.goodsId +
|
||||
"&skuId=" +
|
||||
this.goodsMsg.data.id
|
||||
);
|
||||
},
|
||||
// 获取im信息
|
||||
async getIMDetailMethods() {
|
||||
let res = await getIMDetail();
|
||||
if (res.success) {
|
||||
this.IMLink = res.result;
|
||||
}
|
||||
async getIMDetailMethods () {
|
||||
// let res = await getIMDetail();
|
||||
// if (res.success) {
|
||||
// this.IMLink = res.result;
|
||||
// }
|
||||
this.IMLink = 'http://192.168.0.139:8000'
|
||||
},
|
||||
// 点击规格
|
||||
targetClickSku(val) {
|
||||
targetClickSku (val) {
|
||||
this.getGoodsDetail(val);
|
||||
},
|
||||
// 获取商品详情
|
||||
getGoodsDetail(val) {
|
||||
getGoodsDetail (val) {
|
||||
this.isLoading = true;
|
||||
const params = val || this.$route.query;
|
||||
|
||||
|
@ -183,7 +172,7 @@ export default {
|
|||
this.$router.push("/");
|
||||
});
|
||||
},
|
||||
goGoodsList(currIndex) {
|
||||
goGoodsList (currIndex) {
|
||||
// 跳转商品列表
|
||||
const arr = [];
|
||||
this.categoryBar.forEach((e, index) => {
|
||||
|
@ -193,7 +182,7 @@ export default {
|
|||
});
|
||||
return location.origin + "/goodsList?categoryId=" + arr.toString();
|
||||
},
|
||||
async collect() {
|
||||
async collect () {
|
||||
// 收藏店铺
|
||||
if (this.storeCollected) {
|
||||
let cancel = await cancelCollect("STORE", this.goodsMsg.data.storeId);
|
||||
|
|
|
@ -6,18 +6,40 @@
|
|||
<script>
|
||||
export default {
|
||||
name: 'App',
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
// 用于点击当前页的router时,刷新当前页
|
||||
showView: true,
|
||||
beforeUnload: '',
|
||||
Handler: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 刷新当前路由方法
|
||||
refreshView() {
|
||||
refreshView () {
|
||||
this.showView = false
|
||||
this.$nextTick(() => (this.showView = true))
|
||||
},
|
||||
beforeunloadHandler () {
|
||||
this.beforeUnload = new Date().getTime();
|
||||
},
|
||||
// 页面关闭后 重置btnHide
|
||||
unloadHandler (e) {
|
||||
this.Handler = new Date().getTime() - this.beforeUnload;
|
||||
if (this.Handler <= 5) {
|
||||
localStorage.setItem('btnHide', 1)
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
mounted () {
|
||||
window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
|
||||
window.addEventListener('unload', e => this.unloadHandler(e))
|
||||
},
|
||||
destroyed () {
|
||||
window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
|
||||
window.removeEventListener('unload', e => this.unloadHandler(e))
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -1,21 +1,23 @@
|
|||
<template>
|
||||
<div>
|
||||
当前浏览
|
||||
<div class="base">
|
||||
<div>
|
||||
<img :src="goodsDetail.thumbnail" class="image" />
|
||||
</div>
|
||||
<div style="margin-left: 13px">
|
||||
<a @click="linkToGoods(goodsDetail.goodsId,goodsDetail.id)"> {{ goodsDetail.goodsName }} </a>
|
||||
<div>
|
||||
<span style="color: red;">¥{{ goodsDetail.price }}</span>
|
||||
</div>
|
||||
<el-button class="store-button" type="danger" v-if="!sendFlag" size="mini" @click="submitSendMessage()"
|
||||
plain>发送</el-button>
|
||||
</div>
|
||||
<div>
|
||||
当前浏览
|
||||
<div class="base">
|
||||
<div>
|
||||
<img :src="goodsDetail.thumbnail" class="image" />
|
||||
</div>
|
||||
<div style="margin-left: 13px">
|
||||
<a @click="linkToGoods(goodsDetail.goodsId, goodsDetail.id)"> {{ goodsDetail.goodsName }} </a>
|
||||
<div>
|
||||
<span style="color: red;">¥{{ goodsDetail.price }}</span>
|
||||
</div>
|
||||
<hr class="separate" />
|
||||
<div v-if="hide">
|
||||
<el-button class="store-button" type="danger" v-if="!sendFlag && btnHide == 1" size="mini"
|
||||
@click="submitSendMessage()" plain>发送</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="separate" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -23,146 +25,152 @@ import { Tag, button } from 'element-ui'
|
|||
import { mapState, mapGetters } from "vuex";
|
||||
import SocketInstance from "@/im-server/socket-instance";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
sendFlag: false,
|
||||
}
|
||||
data () {
|
||||
return {
|
||||
sendFlag: false,
|
||||
btnHide: undefined,
|
||||
hide: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(["talkItems"]),
|
||||
...mapState({
|
||||
id: (state) => state.user.id,
|
||||
index_name: (state) => state.dialogue.index_name,
|
||||
toUser: (state) => state.user.toUser,
|
||||
}),
|
||||
},
|
||||
mounted () {
|
||||
this.btnHide = localStorage.getItem('btnHide')
|
||||
},
|
||||
components: {
|
||||
"el-tag": Tag,
|
||||
"el-button": button,
|
||||
Storage
|
||||
},
|
||||
methods: {
|
||||
toGoods () {
|
||||
alert("toGoods")
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(["talkItems"]),
|
||||
...mapState({
|
||||
id: (state) => state.user.id,
|
||||
index_name: (state) => state.dialogue.index_name,
|
||||
toUser: (state) => state.user.toUser,
|
||||
}),
|
||||
toMessage () {
|
||||
alert(JSON.stringify(this.toUser))
|
||||
alert("toMessage")
|
||||
},
|
||||
mounted(){
|
||||
|
||||
// 回车键发送消息回调事件
|
||||
submitSendMessage () {
|
||||
console.log("发送");
|
||||
const context = this.goodsDetail
|
||||
const record = {
|
||||
operation_type: "MESSAGE",
|
||||
to: this.toUser.userId,
|
||||
from: this.id,
|
||||
message_type: "GOODS",
|
||||
context: context,
|
||||
talk_id: this.toUser.id,
|
||||
};
|
||||
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:显示
|
||||
localStorage.setItem('btnHide', 0)
|
||||
this.hide = false
|
||||
},
|
||||
components: {
|
||||
"el-tag": Tag,
|
||||
"el-button": button,
|
||||
Storage
|
||||
|
||||
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
|
||||
);
|
||||
},
|
||||
methods: {
|
||||
toGoods() {
|
||||
alert("toGoods")
|
||||
},
|
||||
toMessage() {
|
||||
alert(JSON.stringify(this.toUser))
|
||||
alert("toMessage")
|
||||
},
|
||||
// 回车键发送消息回调事件
|
||||
submitSendMessage() {
|
||||
console.log("发送");
|
||||
const context = this.goodsDetail
|
||||
const record = {
|
||||
operation_type: "MESSAGE",
|
||||
to: this.toUser.userId,
|
||||
from: this.id,
|
||||
message_type: "GOODS",
|
||||
context: context,
|
||||
talk_id: this.toUser.id,
|
||||
};
|
||||
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,
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
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;
|
||||
},
|
||||
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: {
|
||||
goodsDetail: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
props: {
|
||||
goodsDetail: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.store-button {
|
||||
background-color: white;
|
||||
border-color: #F56C6C;
|
||||
background-color: white;
|
||||
border-color: #F56C6C;
|
||||
}
|
||||
|
||||
.base {
|
||||
margin-top: 5px;
|
||||
height: 120px;
|
||||
display: flex;
|
||||
margin-top: 5px;
|
||||
height: 120px;
|
||||
display: flex;
|
||||
|
||||
div {
|
||||
margin-top: 8px;
|
||||
}
|
||||
div {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.image {
|
||||
height: 100px;
|
||||
margin-top: 3px;
|
||||
width: 100px
|
||||
}
|
||||
.image {
|
||||
height: 100px;
|
||||
margin-top: 3px;
|
||||
width: 100px
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.separate {
|
||||
margin-top: 8px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue