yeliang-king
commit
9c03205c9f
|
|
@ -0,0 +1,82 @@
|
|||
import { http,Method } from "@/utils/request.js";
|
||||
|
||||
import api from "@/config/api.js";
|
||||
|
||||
/**
|
||||
* 获取聊天详情接口
|
||||
* @param {*} talkId
|
||||
* @returns
|
||||
*/
|
||||
export function getTalk(talkId) {
|
||||
return http.request({
|
||||
url: `${api.im}/talk/${talkId}`,
|
||||
method: Method.GET,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取与用户的聊天详情
|
||||
* @param {*} talkId
|
||||
* @returns
|
||||
*/
|
||||
export function getTalkByUser(userId) {
|
||||
return http.request({
|
||||
url: `${api.im}/talk/by/user/${userId}`,
|
||||
method: Method.GET,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取聊天列表
|
||||
* @param {*} talkId
|
||||
* @returns
|
||||
*/
|
||||
export function getTalkList(params) {
|
||||
return http.request({
|
||||
url: `${api.im}/talk/list`,
|
||||
method: Method.GET,
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取聊天信息接口
|
||||
* @param {*} params
|
||||
* @returns
|
||||
*/
|
||||
export function getTalkMessage(params) {
|
||||
return http.request({
|
||||
url: `${api.im}/message`,
|
||||
method: Method.GET,
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取聊天信息接口
|
||||
* @param {*} params
|
||||
* @returns
|
||||
*/
|
||||
export function cleanUnreadMessage(params) {
|
||||
return http.request({
|
||||
url: `${api.im}/message/clean/unred`,
|
||||
method: Method.PUT,
|
||||
params
|
||||
});
|
||||
}
|
||||
// 从商品页点击 客服 跳转 获取商品详情
|
||||
export function jumpObtain(skuId, goodsId) {
|
||||
return http.request({
|
||||
url: `${api.im}/goods/goods/sku/${goodsId}/${skuId}`,
|
||||
method: Method.GET,
|
||||
});
|
||||
}
|
||||
// 清除未读
|
||||
// /im/message/clean/unred
|
||||
export function clearmeaager() {
|
||||
return http.request({
|
||||
url: `${api.im}/message/clean/unred`,
|
||||
method: Method.PUT,
|
||||
});
|
||||
}
|
||||
|
||||
12
api/store.js
12
api/store.js
|
|
@ -55,5 +55,17 @@ export function getStoreList(params) {
|
|||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取自提点信息
|
||||
* @param id
|
||||
*/
|
||||
export function getStoreAddress(storeId,params) {
|
||||
return http.request({
|
||||
url: `/store/address/page/${storeId}`,
|
||||
method: Method.GET,
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
38
api/trade.js
38
api/trade.js
|
|
@ -155,6 +155,18 @@ export function setAddressId(addressId,way) {
|
|||
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 设置收货地址ID
|
||||
* @param addressId
|
||||
*/
|
||||
export function setStoreAddressId(storeAddressId,way) {
|
||||
return http.request({
|
||||
url: `/trade/carts/storeAddress?storeAddressId=${storeAddressId}&way=${way}`,
|
||||
method: Method.GET,
|
||||
needToken: true,
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
|
|
@ -281,3 +293,29 @@ export function reBuy(sn) {
|
|||
needToken: true,
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取全部配送方式
|
||||
*/
|
||||
export function shippingMethodList(params) {
|
||||
return http.request({
|
||||
url: `/trade/carts/shippingMethodList`,
|
||||
method: Method.GET,
|
||||
needToken: true,
|
||||
params: params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 提交配送方式
|
||||
* @param params
|
||||
*/
|
||||
export function setShipMethod(params) {
|
||||
return http.request({
|
||||
url: "/trade/carts/shippingMethod",
|
||||
method: Method.PUT,
|
||||
needToken: true,
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,11 +4,13 @@
|
|||
*/
|
||||
// 开发环境
|
||||
const dev = {
|
||||
common: "https://common-api.pickmall.cn",
|
||||
buyer: "https://buyer-api.pickmall.cn",
|
||||
im: "https://im-api.pickmall.cn",
|
||||
common: "https://common-api.pickmall.cn",
|
||||
buyer: "https://buyer-api.pickmall.cn",
|
||||
};
|
||||
// 生产环境
|
||||
const prod = {
|
||||
im: "https://im-api.pickmall.cn",
|
||||
common: "https://common-api.pickmall.cn",
|
||||
buyer: "https://buyer-api.pickmall.cn",
|
||||
};
|
||||
|
|
@ -28,6 +30,7 @@ api = prod;
|
|||
|
||||
api.buyer += "/buyer";
|
||||
api.common += "/common";
|
||||
api.im += "/im";
|
||||
export default {
|
||||
...api,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ export default {
|
|||
customerServiceMobile: "13161366885", //客服电话
|
||||
customerServiceEmail: "lili@lili.com", //客服邮箱
|
||||
imWebSrc: "https://im.pickmall.cn", //IM地址
|
||||
baseWsUrl: "wss://im-api.pickmall.cn/lili/webSocket", // IM WS 地址
|
||||
enableGetClipboard: true, //是否启用粘贴板获取 scanAuthNavigation 中的链接，如果匹配则会跳转到对应页面
|
||||
enableMiniBarStartUpApp: true, //是否在h5中右侧浮空按钮点击启动app
|
||||
/**
|
||||
|
|
|
|||
27
pages.json
27
pages.json
|
|
@ -225,6 +225,13 @@
|
|||
"navigationBarTitleText": "地址管理"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "address/storeAddress",
|
||||
"style": {
|
||||
"enablePullDownRefresh": true,
|
||||
"navigationBarTitleText": "自提点"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "address/add",
|
||||
"style": {
|
||||
|
|
@ -268,7 +275,26 @@
|
|||
}
|
||||
},
|
||||
|
||||
{
|
||||
"path": "im/list",
|
||||
"style": {
|
||||
"navigationStyle": "custom", // 隐藏系统导航栏
|
||||
"enablePullDownRefresh": true,
|
||||
"app-plus": {
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "im/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom", // 隐藏系统导航栏
|
||||
"enablePullDownRefresh": true,
|
||||
"app-plus": {
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "set/feedBack",
|
||||
"style": {
|
||||
|
|
@ -427,6 +453,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
]
|
||||
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,88 @@
|
|||
<template>
|
||||
<view class="address">
|
||||
|
||||
<u-empty class="empty" v-if="storeAddressList.length == 0" text="暂无自提地址" mode="address"></u-empty>
|
||||
<view class="list" v-else>
|
||||
<view class="item c-content" v-for="(item, index) in storeAddressList" :key="index">
|
||||
<view class="basic" @click="selectAddressData(item)">
|
||||
<text>{{ item.addressName }}</text>
|
||||
<text>{{ item.mobile }}</text>
|
||||
<view>
|
||||
<div class="region">
|
||||
<span>{{ item.address }}</span>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height: 100px"></view>
|
||||
</view>
|
||||
<u-action-sheet :list="removeList" :tips="tips" v-model="showAction" @click="deleteAddressMessage"></u-action-sheet>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as API_Trade from "@/api/trade";
|
||||
import * as API_Store from "@/api/store.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
storeAddressList: [], //地址列表
|
||||
showAction: false, //是否显示下栏框
|
||||
removeList: [
|
||||
{
|
||||
text: "确定",
|
||||
},
|
||||
],
|
||||
tips: {
|
||||
text: "确定要删除该收货人信息吗？",
|
||||
},
|
||||
removeId: "", //删除的地址id
|
||||
routerVal: "",
|
||||
params: {
|
||||
pageNumber: 1,
|
||||
pageSize: 1000,
|
||||
},
|
||||
};
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
//下拉刷新
|
||||
this.storeAddressList = [];
|
||||
this.getAddressList();
|
||||
},
|
||||
onLoad: function (val) {
|
||||
this.routerVal = val;
|
||||
},
|
||||
onShow() {
|
||||
this.storeAddressList = [];
|
||||
this.getAddressList();
|
||||
},
|
||||
onHide() {},
|
||||
methods: {
|
||||
async selectAddressData(val) {
|
||||
await API_Trade.setStoreAddressId(val.id, this.routerVal.way);
|
||||
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
},
|
||||
//获取地址列表
|
||||
getAddressList() {
|
||||
uni.showLoading();
|
||||
|
||||
API_Store.getStoreAddress(
|
||||
this.routerVal.storeId,
|
||||
this.params
|
||||
).then((res) => {
|
||||
this.storeAddressList = res.data.result.records;
|
||||
console.log(this.storeAddressList);
|
||||
|
||||
uni.hideLoading();
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "./address.scss";
|
||||
</style>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,803 @@
|
|||
<template>
|
||||
<view class="wrapper">
|
||||
<u-navbar class="my-title" title-size="32" :title="toUser.name"></u-navbar>
|
||||
<!-- 空盒子用来防止消息过少时 拉起键盘会遮盖消息 -->
|
||||
<view :animation="anData" style="height:0;">
|
||||
</view>
|
||||
<!-- 消息体 -->
|
||||
<!-- 用来获取消息体高度 -->
|
||||
<view id="msgList">
|
||||
<!-- 消息 -->
|
||||
<view class="flex-column-start" v-if="msgList.length" v-for="(item, index) in msgList" :key="index">
|
||||
<view class="flex-row-start column-time">
|
||||
<view v-show="compareTime(index, item.createTime)" class="flex-row-start date-text"
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 用户消息 头像可选加入-->
|
||||
<view v-if="item.my" class="flex justify-end padding-right one-show align-start padding-top">
|
||||
<view class="flex justify-end" style="width: 400rpx;margin-top: 12px;">
|
||||
<view>
|
||||
<view class="user-name">{{ user.nickName }}</view>
|
||||
<view class="margin-left padding-chat bg-user-orang" style="border-radius: 35rpx; ">
|
||||
<text style="word-break: break-all;" v-if="item.messageType === 'MESSAGE'">{{ item.text }}</text>
|
||||
<!-- <view v-if="item.messageType == 'GOODS'">
|
||||
<view class="goodsCard u-flex u-row-between u-p-b-0" style="width:100%;margin: 0 0; ">
|
||||
<view class="imagebox" @click="jumpGoodDelic">
|
||||
<image class="image" :src="JSON.parse(item.text)['thumbnail']" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="goodsdesc" @click="jumpGoodDelic">
|
||||
<view class="goodsdesc-name">
|
||||
<text class="goodsCard_goodNmae">{{
|
||||
JSON.parse(item.text)['goodsName']
|
||||
}}</text>
|
||||
</view>
|
||||
<view class="goodsdesc-rice" style="margin-top:10rpx; color: orange;"><text
|
||||
style="font-size:20rpx;">¥{{
|
||||
JSON.parse(item.text)['price']
|
||||
}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- <view v-if="item.messageType === 'ORDER'">
|
||||
<view class="orderSn">
|
||||
<text>订单号：{{ JSON.parse(item.text)['sn'] }}</text>
|
||||
<view class="oederList">
|
||||
<img style="height: 120rpx; width: 120rpx; margin-top: 15rpx;"
|
||||
:src="JSON.parse(item.text)['groupImages']" mode="widthFix" />
|
||||
<view class="groupNameOrTime">
|
||||
<text @click="linkTosOrders(JSON.parse(item.text)['sn'])">{{ JSON.parse(item.text)['groupName']
|
||||
}}</text>
|
||||
<view class="orderTime"> <text>{{ JSON.parse(item.text)['paymentTime'] }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<u-avatar :src="user.face" :text="user.face ? '' : user.name" bg-color="#DDDDDD"></u-avatar>
|
||||
<!-- <u-image class="chat-img margin-left" style="height: 100rpx;width: 100rpx;" shape="circle"
|
||||
:src="user.face || 'https://avatars.dicebear.com/api/initials/' + user.nickName + '.svg?fontSize=38'"
|
||||
mode="aspectFill"></u-image> -->
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- 接收人消息 -->
|
||||
<view v-else class="flex-row-start margin-left margin-top one-show">
|
||||
<view class="chat-img flex-row-center">
|
||||
<u-avatar :src="toUser.face" :text="toUser.face ? '' : toUser.name" bg-color="#DDDDDD"></u-avatar>
|
||||
<!-- <u-image style="height: 100rpx;width: 100rpx;" shape="circle"
|
||||
:src="toUser.face || 'https://avatars.dicebear.com/api/initials/' + toUser.name + '.svg?fontSize=38'"
|
||||
mode="aspectFit"></u-image> -->
|
||||
</view>
|
||||
<view class="flex" style="width: 500rpx;">
|
||||
<view>
|
||||
<view class="other-name">{{ toUser.name }}</view>
|
||||
<view class="margin-left padding-chat flex-column-start bg-to-color" style="border-radius: 35rpx;">
|
||||
<text style="word-break: break-all;" v-if="item.messageType === 'MESSAGE'">{{ item.text }}</text>
|
||||
<view v-if="item.messageType === 'GOODS'">
|
||||
<!-- <view class="goodsCard u-flex u-row-between u-p-b-0" style="width:100%;margin: 0 0; ">
|
||||
<view class="imagebox" @click="jumpGoodDelic">
|
||||
<image class="image" :src="JSON.parse(item.text)['thumbnail']" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="goodsdesc" @click="jumpGoodDelic">
|
||||
<view class="goodsdesc-name">
|
||||
<text class="goodsCard_goodNmae">{{
|
||||
JSON.parse(item.text)['goodsName']
|
||||
}}</text>
|
||||
</view>
|
||||
<view class="goodsdesc-rice" style="margin-top:10rpx; color: orange;"><text
|
||||
style="font-size:20rpx;">¥{{
|
||||
JSON.parse(item.text)['price']
|
||||
}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<!-- <view v-if="item.messageType === 'ORDER'">
|
||||
<view class="orderSn">
|
||||
<text>订单号：{{ JSON.parse(item.text)['sn'] }}</text>
|
||||
<view class="oederList">
|
||||
<img style="height: 120rpx; width: 120rpx; margin-top: 15rpx;"
|
||||
:src="JSON.parse(item.text)['groupImages']" mode="widthFix" />
|
||||
<view class="groupNameOrTime">
|
||||
<text @click="linkTosOrders(JSON.parse(item.text)['sn'])">{{ JSON.parse(item.text)['groupName']
|
||||
}}</text>
|
||||
<view class="orderTime"> <text>{{ JSON.parse(item.text)['paymentTime'] }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 如果没有聊天记录，定位到底部 -->
|
||||
<view
|
||||
:style="{ position: msgList.length == 0 ? 'fixed' : '', bottom: msgList.length == 0 ? '50px' : '', width: msgList.length == 0 ? '100%' : '' }">
|
||||
<view class="cartMessage" v-if="showHide && !localImGoodsId && showHideModel">
|
||||
<view class="goodsCard u-flex u-row-between u-p-b-0">
|
||||
<view class="imagebox" @click="jumpGoodDelic">
|
||||
<image class="image" :src="goodListData.thumbnail" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="goodsdesc" @click="jumpGoodDelic">
|
||||
<view class="goodsdesc-name">
|
||||
<text class="goodsCard_goodNmae">{{
|
||||
goodListData.goodsName
|
||||
}}</text>
|
||||
</view>
|
||||
<view class="goodsdesc-rice" style="margin-top:10rpx; color: orange;"><text style="font-size:20rpx;">¥{{
|
||||
goodListData.price
|
||||
}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cancel" @click="cancelModel">X</view>
|
||||
<view class="sendGood" @click="sendGoodsMessage">
|
||||
<view>发送商品</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- loading是显示 -->
|
||||
<view v-show="msgLoad" class="flex-row-start margin-left margin-top">
|
||||
<view class="chat-img flex-row-center">
|
||||
<!-- <image style="height: 75rpx;width: 75rpx;" src="../../static/image/robt.png" mode="aspectFit"></image> -->
|
||||
</view>
|
||||
<view class="flex" style="width: 500rpx;">
|
||||
<view class="margin-left padding-chat flex-column-start"
|
||||
style="border-radius: 35rpx;background-color: #f9f9f9;">
|
||||
<view class="cuIcon-loading turn-load" style="font-size: 35rpx;color: #3e9982;">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 防止消息底部被遮 -->
|
||||
<view style="height: 120rpx;">
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部导航栏 -->
|
||||
<view class="flex-column-center" style="position: fixed;bottom: -180px;" :animation="animationData">
|
||||
<view class="bottom-dh-char flex-row-around" style="font-size: 55rpx;">
|
||||
<!-- vue无法使用软键盘"发送" -->
|
||||
<input v-model="msg" class="dh-input" type="text" style="background-color: #f0f0f0;" @confirm="sendMessage"
|
||||
confirm-type="search" placeholder-class="my-neirong-sm" placeholder="用一句简短的话描述您的问题" />
|
||||
<view @click="sendMessage" class="cu-tag bg-cyan round">
|
||||
发送
|
||||
</view>
|
||||
<!-- <text @click="ckAdd" class="cuIcon-roundaddfill text-brown"></text> -->
|
||||
</view>
|
||||
<!-- 附加栏(自定义) -->
|
||||
<view class="box-normal flex-row-around flex-wrap">
|
||||
<view class="tb-text">
|
||||
<view class="cuIcon-form"></view>
|
||||
<text>问题反馈</text>
|
||||
</view>
|
||||
<view class="tb-text">
|
||||
<view class="cuIcon-form"></view>
|
||||
<text>人工客服</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// rpx和px的比率
|
||||
var l
|
||||
// 可用窗口高度
|
||||
var wh
|
||||
// 顶部空盒子的高度
|
||||
var mgUpHeight
|
||||
import { getTalkMessage, getTalkByUser, jumpObtain } from "@/api/im.js";
|
||||
import SocketService from "@/utils/socket_service.js";
|
||||
import storage from "@/utils/storage.js";
|
||||
import { beautifyTime } from "@/utils/filters.js"
|
||||
export default {
|
||||
// 页面卸载后清除imGoodId
|
||||
onUnload () {
|
||||
storage.setImGoodsLink('')
|
||||
},
|
||||
onLoad (options) {
|
||||
// 没有goodsid则不显示 发送商品弹窗
|
||||
this.showHideModel = options.goodsid
|
||||
// 发送后刷新页面不显示 发送商品弹窗 local里面imGoodId不为空显示
|
||||
this.localImGoodsId = storage.getImGoodsLink()
|
||||
this.resolve = options
|
||||
// 请求商品信息
|
||||
if (this.resolve.goodsid) {
|
||||
this.commodityDetails()
|
||||
}
|
||||
// 如果需要缓存消息缓存msgList即可
|
||||
// 监听键盘拉起
|
||||
// 因为无法控制键盘拉起的速度,所以这里尽量以慢速处理
|
||||
uni.onKeyboardHeightChange(res => {
|
||||
const query = uni.createSelectorQuery()
|
||||
query.select('#msgList').boundingClientRect(data => {
|
||||
// 若消息体没有超过2倍的键盘则向下移动差值,防止遮住消息体
|
||||
var up = res.height * 2 - data.height - l * 110
|
||||
if (up > 0) {
|
||||
// 动态改变空盒子高度
|
||||
this.messageBoxMove(up, 300)
|
||||
// 记录改变的值,若不收回键盘且发送了消息用来防止消息过多被遮盖
|
||||
mgUpHeight = up
|
||||
}
|
||||
// 收回
|
||||
if (res.height == 0) {
|
||||
this.messageBoxMove(0, 0)
|
||||
}
|
||||
}).exec();
|
||||
})
|
||||
var query = uni.getSystemInfoSync()
|
||||
|
||||
l = query.screenWidth / 750
|
||||
wh = query.windowHeight
|
||||
this.scrollHeight = (query.windowHeight - 44) + "px"
|
||||
this.user = storage.getUserInfo()
|
||||
this.toUser = storage.getTalkToUser()
|
||||
|
||||
if (options.talkId) {
|
||||
this.params.talkId = options.talkId;
|
||||
this.getTalkMessage()
|
||||
} else {
|
||||
this.getTalk(options.userId)
|
||||
|
||||
}
|
||||
|
||||
this.ws.connect();
|
||||
},
|
||||
onPullDownRefresh () {
|
||||
this.params.pageNumber = this.params.pageNumber + 1
|
||||
this.getTalkMessage()
|
||||
setTimeout(function () {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 1000);
|
||||
},
|
||||
|
||||
data () {
|
||||
return {
|
||||
storage,
|
||||
fixed: 'fixed',
|
||||
bottom: '50px',
|
||||
width: '100%',
|
||||
showHideModel: undefined,
|
||||
localImGoodsId: '',
|
||||
showHide: true,
|
||||
msgLoad: false,
|
||||
anData: {},
|
||||
animationData: {},
|
||||
msgList: [],
|
||||
oldHeight: 0,
|
||||
params: { //搜索条件
|
||||
talkId: '',
|
||||
pageSize: 10,
|
||||
pageNumber: 1,
|
||||
},
|
||||
goToIndex: 0, // 前往位置
|
||||
msg: "",
|
||||
go: 0,
|
||||
newMessageNum: 0,
|
||||
user: {},
|
||||
toUser: {},
|
||||
scrollHeight: 0,
|
||||
ws: new SocketService(),
|
||||
resolve: {},
|
||||
goodListData: {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'ws.callBackMapping': {
|
||||
handler: function (val) {
|
||||
val = JSON.parse(val)
|
||||
if (val.messageResultType == 'MESSAGE') {
|
||||
this.msgList.push(val.result)
|
||||
}
|
||||
this.newMessageNum++;
|
||||
//接收到消息后发送已读
|
||||
let msg = val
|
||||
msg.operation_type = 'READ'
|
||||
this.ws.send(JSON.stringify(msg))
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
beautifyTime,
|
||||
//订单详情
|
||||
linkTosOrders (val) {
|
||||
console.log(val);
|
||||
uni.navigateTo({
|
||||
url: '/pages/order/orderDetail?sn=' + val,
|
||||
});
|
||||
|
||||
},
|
||||
// 跳转商品详情页
|
||||
jumpGoodDelic () {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/goods?id=${this.resolve.skuid}&goodsId=${this.resolve.goodsid}`,
|
||||
});
|
||||
},
|
||||
//发送商品
|
||||
sendGoodsMessage () {
|
||||
let msg = {
|
||||
operation_type: "MESSAGE",
|
||||
to: this.toUser.userId,
|
||||
from: this.user.id,
|
||||
message_type: "GOODS",
|
||||
context: this.goodListData,
|
||||
talk_id: this.params.talkId,
|
||||
}
|
||||
this.ws.send(JSON.stringify(msg))
|
||||
this.msgList.push({ "text": JSON.stringify(this.goodListData), "my": true, "messageType": 'GOODS' })
|
||||
this.showHide = false
|
||||
storage.setImGoodsLink(this.params.talkId)
|
||||
//成功发送商品连接后，滚动到底部
|
||||
this.$nextTick(() => {
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 2000000,
|
||||
duration: 0
|
||||
});
|
||||
|
||||
})
|
||||
},
|
||||
//取消发送
|
||||
cancelModel () {
|
||||
this.showHide = false
|
||||
},
|
||||
// 请求商品详情
|
||||
commodityDetails () {
|
||||
jumpObtain(this.resolve.skuid, this.resolve.goodsid).then((res) => {
|
||||
this.goodListData = res.data.result.data
|
||||
})
|
||||
},
|
||||
|
||||
// 切换输入法时移动输入框(按照官方的上推页面的原理应该会自动适应不同的键盘高度-->官方bug)
|
||||
goPag (kh) {
|
||||
this.retractBox(0, 250)
|
||||
if (this.keyHeight != 0) {
|
||||
if (kh - this.keyHeight > 0) {
|
||||
this.retractBox(this.keyHeight - kh, 250)
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
// 移动顶部的空盒子
|
||||
messageBoxMove (x, t) {
|
||||
var animation = uni.createAnimation({
|
||||
duration: t,
|
||||
timingFunction: 'linear',
|
||||
})
|
||||
|
||||
this.animation = animation
|
||||
|
||||
animation.height(x).step()
|
||||
|
||||
this.anData = animation.export()
|
||||
},
|
||||
// 保持消息体可见
|
||||
msgGo (type) {
|
||||
console.log(type, 'typetypetype');
|
||||
const query = uni.createSelectorQuery()
|
||||
// 延时100ms保证是最新的高度
|
||||
setTimeout(() => {
|
||||
// 获取消息体高度
|
||||
query.select('#msgList').boundingClientRect(data => {
|
||||
// 如果超过scorll高度就滚动scorll
|
||||
if (type == 'up') {
|
||||
this.go = data.height - this.oldHeight
|
||||
} else if (type == 'down') {
|
||||
this.go = data.height - wh + 120
|
||||
}
|
||||
// if (this.oldHeight > 0) {
|
||||
// this.go = data.height - this.oldHeight
|
||||
// } else {
|
||||
// // if (data.height - (wh - 32) > 0) {
|
||||
// this.go = data.height - wh + 120
|
||||
// }
|
||||
// 保证键盘第一次拉起时消息体能保持可见
|
||||
var moveY = wh - data.height
|
||||
// 超出页面则缩回空盒子
|
||||
if (moveY - mgUpHeight < 0) {
|
||||
// 小于0则视为0
|
||||
if (moveY < 0) {
|
||||
this.messageBoxMove(0, 200)
|
||||
} else {
|
||||
// 否则缩回盒子对应的高度
|
||||
this.messageBoxMove(moveY, 200)
|
||||
}
|
||||
}
|
||||
uni.pageScrollTo({
|
||||
scrollTop: this.go,
|
||||
duration: 0
|
||||
})
|
||||
this.oldHeight = data.height
|
||||
}).exec();
|
||||
}, 100)
|
||||
},
|
||||
// 回答问题的业务逻辑
|
||||
answer (id) {
|
||||
// 这里应该传入问题的id,模拟就用index代替了
|
||||
|
||||
},
|
||||
sendMessage () {
|
||||
// 消息为空不做任何操作
|
||||
if (this.msg == "") {
|
||||
return 0;
|
||||
}
|
||||
// 显示消息 msg消息文本,my鉴别是谁发的消息(不能用俩个消息数组循环,否则消息不会穿插)
|
||||
let msg = {
|
||||
operation_type: "MESSAGE",
|
||||
to: this.toUser.userId,
|
||||
from: this.user.id,
|
||||
message_type: "MESSAGE",
|
||||
context: this.msg,
|
||||
talk_id: this.params.talkId,
|
||||
}
|
||||
this.ws.send(JSON.stringify(msg))
|
||||
this.msgList.push({ "text": this.msg, "my": true, "messageType": 'MESSAGE' })
|
||||
// 保证消息可见
|
||||
let type = 'down';
|
||||
this.msgGo(type)
|
||||
// 回答问题
|
||||
// this.msgKf(this.msg)
|
||||
// 清除消息
|
||||
this.msg = ""
|
||||
},
|
||||
// msgKf(x) {
|
||||
// // loading
|
||||
// // this.msgLoad = true
|
||||
// // 这里连接服务器获取答案
|
||||
|
||||
// // 下面模拟请求
|
||||
// // setTimeout(() => {
|
||||
// // // 取消loading
|
||||
// // this.msgLoad = false
|
||||
// // // this.msgGo()
|
||||
// // }, 2000)
|
||||
// },
|
||||
// 不建议输入框聚焦时操作此动画
|
||||
ckAdd () {
|
||||
if (!this.showTow) {
|
||||
this.retractBox(-180, 350)
|
||||
} else {
|
||||
this.retractBox(0, 200)
|
||||
}
|
||||
this.showTow = !this.showTow
|
||||
},
|
||||
hideKey () {
|
||||
uni.hideKeyboard()
|
||||
},
|
||||
// 拉起/收回附加栏
|
||||
retractBox (x, t) {
|
||||
|
||||
var animation = uni.createAnimation({
|
||||
duration: t,
|
||||
timingFunction: 'ease',
|
||||
})
|
||||
|
||||
this.animation = animation
|
||||
|
||||
animation.translateY(x).step()
|
||||
|
||||
this.animationData = animation.export()
|
||||
},
|
||||
async getTalkMessage () {
|
||||
let type = '';
|
||||
await getTalkMessage(this.params).then(res => {
|
||||
if (res.data.success) {
|
||||
if (this.msgList.length >= 10) {
|
||||
this.msgList.unshift(...res.data.result)
|
||||
type = 'up'
|
||||
} else {
|
||||
this.msgList = res.data.result
|
||||
type = 'down'
|
||||
}
|
||||
this.msgList.forEach(item => {
|
||||
if (item.fromUser === this.user.id) {
|
||||
item.my = true
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
this.msgGo(type)
|
||||
},
|
||||
touchMoreMessage (e) {
|
||||
if (e.target.scrollTop == 0) {
|
||||
this.params.pageNumber = this.params.pageNumber + 1
|
||||
this.getTalkMessage()
|
||||
}
|
||||
|
||||
},
|
||||
async getTalk (userId) {
|
||||
getTalkByUser(userId).then(res => {
|
||||
if (res.data.success) {
|
||||
this.toUser = res.data.result
|
||||
this.params.talkId = res.data.result.id
|
||||
this.getTalkMessage()
|
||||
}
|
||||
})
|
||||
},
|
||||
// 处理消息时间是否显示
|
||||
compareTime (index, datetime) {
|
||||
if (datetime == undefined) {
|
||||
return false;
|
||||
}
|
||||
if (typeof datetime == "number") {
|
||||
datetime = this.unixToDate(datetime, "yyyy-MM-dd hh:mm");
|
||||
}
|
||||
|
||||
if (this.msgList[index].is_revoke == 1) {
|
||||
return false;
|
||||
}
|
||||
|
||||
datetime = datetime.replace(/-/g, "/");
|
||||
let time = Math.floor(Date.parse(datetime) / 1000);
|
||||
let currTime = Math.floor(new Date().getTime() / 1000);
|
||||
|
||||
// 当前时间5分钟内时间不显示
|
||||
if (currTime - time < 300) return false;
|
||||
// 判断是否是最后一条消息,最后一条消息默认显示时间
|
||||
if (index == this.msgList.length - 1) {
|
||||
return true;
|
||||
}
|
||||
let nextDate
|
||||
if (this.msgList[index + 1]) {
|
||||
nextDate = this.msgList[index + 1].createTime.replace(/-/g, "/");
|
||||
if (nextDate - datetime < 300) return false;
|
||||
}
|
||||
|
||||
return !(
|
||||
this.unixToDate(new Date(datetime), "{y}-{m}-{d} {h}:{i}") ==
|
||||
this.unixToDate(new Date(nextDate), "{y}-{m}-{d} {h}:{i}")
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* 将unix时间戳转换为指定格式
|
||||
* @param unix 时间戳【秒】
|
||||
* @param format 转换格式
|
||||
* @returns {*|string}
|
||||
*/
|
||||
unixToDate (unix, format) {
|
||||
if (!unix) return unix;
|
||||
let _format = format || "yyyy-MM-dd hh:mm:ss";
|
||||
const d = new Date(unix);
|
||||
const o = {
|
||||
"M+": d.getMonth() + 1,
|
||||
"d+": d.getDate(),
|
||||
"h+": d.getHours(),
|
||||
"m+": d.getMinutes(),
|
||||
"s+": d.getSeconds(),
|
||||
"q+": Math.floor((d.getMonth() + 3) / 3),
|
||||
S: d.getMilliseconds(),
|
||||
};
|
||||
if (/(y+)/.test(_format))
|
||||
_format = _format.replace(
|
||||
RegExp.$1,
|
||||
(d.getFullYear() + "").substr(4 - RegExp.$1.length)
|
||||
);
|
||||
for (const k in o)
|
||||
if (new RegExp("(" + k + ")").test(_format))
|
||||
_format = _format.replace(
|
||||
RegExp.$1,
|
||||
RegExp.$1.length === 1
|
||||
? o[k]
|
||||
: ("00" + o[k]).substr(("" + o[k]).length)
|
||||
);
|
||||
return _format;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.orderTime {
|
||||
margin-top: 15rpx;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.oederList {
|
||||
display: flex;
|
||||
color: black;
|
||||
font-size: 20rpx;
|
||||
font-weight: bold;
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
.orderSn {
|
||||
width: 350rpx;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.groupNameOrTime {
|
||||
margin: 15rpx 15rpx;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.orderGood {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.goodsCard {
|
||||
border-radius: 20rpx;
|
||||
margin-top: 15rpx;
|
||||
background-color: #ffffff;
|
||||
padding-left: 12rpx;
|
||||
width: 95%;
|
||||
height: 120rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
color: #302c2b;
|
||||
|
||||
|
||||
|
||||
.imagebox {
|
||||
width: 122rpx;
|
||||
height: 122rpx;
|
||||
|
||||
.image {
|
||||
width: 122rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goodsdesc {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
margin-left: 12rpx;
|
||||
|
||||
.goodsdesc-name {
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.goodsCard_goodNmae {
|
||||
color: black;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 20rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
margin-top: 50rpx;
|
||||
line-height: 2;
|
||||
margin-left: 5px;
|
||||
font-size: 26rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.sendGood {
|
||||
color: #ffffff;
|
||||
height: 40rpx;
|
||||
width: 110rpx;
|
||||
background-color: #f21c0c;
|
||||
font-size: 18rpx;
|
||||
border-radius: 17rpx;
|
||||
text-align: center;
|
||||
line-height: 40rpx;
|
||||
padding: 0 10rpx;
|
||||
position: relative;
|
||||
top: 20rpx;
|
||||
right: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.cancel {
|
||||
color: #737373;
|
||||
position: relative;
|
||||
bottom: 40rpx;
|
||||
left: 12%;
|
||||
}
|
||||
|
||||
.cartMessage {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bottom-dh-char {
|
||||
background-color: #f9f9f9;
|
||||
width: 750rpx;
|
||||
height: 110rpx;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
text-align: right;
|
||||
font-size: 24rpx;
|
||||
color: #737373;
|
||||
margin-bottom: 10rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.other-name {
|
||||
text-align: left;
|
||||
font-size: 24rpx;
|
||||
color: #737373;
|
||||
margin-bottom: 10rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.column-time {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.center-box {
|
||||
width: 720rpx;
|
||||
padding-left: 25rpx;
|
||||
}
|
||||
|
||||
.hui-box {
|
||||
width: 750rpx;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
.date-text {
|
||||
font-size: 12px;
|
||||
color: grey;
|
||||
}
|
||||
|
||||
.dh-input {
|
||||
width: 500rpx;
|
||||
height: 65rpx;
|
||||
border-radius: 30rpx;
|
||||
padding-left: 15rpx;
|
||||
font-size: 35rpx;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.box-normal {
|
||||
width: 750rpx;
|
||||
height: 180px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.tb-text view {
|
||||
font-size: 65rpx;
|
||||
}
|
||||
|
||||
.tb-text text {
|
||||
font-size: 25rpx;
|
||||
color: #737373;
|
||||
}
|
||||
|
||||
.chat-img {
|
||||
border-radius: 50%;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
|
||||
.padding-chat {
|
||||
padding: 17rpx 20rpx;
|
||||
}
|
||||
|
||||
.tb-nv {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "./index-app.scss";
|
||||
</style>
|
||||
|
|
@ -0,0 +1,237 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<u-navbar class="my-title" title-size="32" :title="'消息(' + talkList.length + ')'"></u-navbar>
|
||||
<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData(tabIndex)">
|
||||
|
||||
<!-- 消息列表 -->
|
||||
<div class="iconBox">
|
||||
<view class="icon-list">
|
||||
<view class="icon-item" @click="cleanUnread()">
|
||||
<div class="bag bag1">
|
||||
<u-icon name="trash" size="50" color="#fff"></u-icon>
|
||||
</div>
|
||||
<view>清除未读</view>
|
||||
</view>
|
||||
<view class="icon-item" @click="navigateTo('/pages/tabbar/home/title')">
|
||||
<div class="bag bag2">
|
||||
<u-icon name="bell" size="50" color="#fff"></u-icon>
|
||||
</div>
|
||||
<view>系统消息</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<u-search class="nav-search" v-model="userName" clearabled @change="userTalkList()" placeholder="搜索用户"
|
||||
:show-action="false"></u-search>
|
||||
<view class="talk-view" :key="index" v-for="(item, index) in talkList">
|
||||
<view>
|
||||
<view @click="onclickToTalkInfo(item)">
|
||||
<view class="talk-item-view">
|
||||
<view class="talk-img">
|
||||
<u-avatar :src="item.face" :text="item.face ? '' : item.name" bg-color="#DDDDDD"></u-avatar>
|
||||
</view>
|
||||
<view class="talk-info">
|
||||
<view class="talk-name u-line-2">{{ item.name }}
|
||||
<u-tag class="talk-tag" size="mini" text="店铺" type="warning" v-if="item.storeFlag" />
|
||||
</view>
|
||||
<view class="talk-message">
|
||||
<span v-if="item.lastMessageType == 'MESSAGE'">{{ item.lastTalkMessage }}</span>
|
||||
<span v-if="item.lastMessageType == 'GOODS'">[商品链接]</span>
|
||||
<span v-if="item.lastMessageType == 'ORDER'">[订单信息]</span>
|
||||
</view>
|
||||
</view>
|
||||
<view class="talk-time">
|
||||
<view>
|
||||
{{ beautifyTime(item.lastTalkTime) }}
|
||||
</view>
|
||||
<view>
|
||||
<u-badge type="error" absolute :offset="[45, 20]" :count="item.unread"></u-badge>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 空白页 -->
|
||||
<u-empty text="暂无信息" mode="list" v-if="talkList.length === 0"></u-empty>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getTalkList, clearmeaager } from "@/api/im.js";
|
||||
import storage from "@/utils/storage.js";
|
||||
import { beautifyTime } from "@/utils/filters.js"
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
storage,
|
||||
count: {
|
||||
loadStatus: "more",
|
||||
},
|
||||
talkList: [], //聊天列表
|
||||
userName: '',
|
||||
pointData: {}, //累计获取 未输入 集合
|
||||
};
|
||||
},
|
||||
|
||||
onShow () {
|
||||
this.userTalkList();
|
||||
},
|
||||
onPullDownRefresh () {
|
||||
this.userTalkList()
|
||||
console.log('下拉事件');
|
||||
setTimeout(function () {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 1000);
|
||||
},
|
||||
/**
|
||||
* 触底加载
|
||||
*/
|
||||
onReachBottom () {
|
||||
this.userTalkList();
|
||||
},
|
||||
methods: {
|
||||
beautifyTime,
|
||||
onclickToTalkInfo (val) {
|
||||
storage.setTalkToUser(val)
|
||||
uni.navigateTo({
|
||||
url:
|
||||
"/pages/mine/im/index?talkId=" + val.id,
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取聊天列表
|
||||
*/
|
||||
userTalkList () {
|
||||
let params = {
|
||||
userName: this.userName,
|
||||
}
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
});
|
||||
getTalkList(params).then((res) => {
|
||||
uni.hideLoading();
|
||||
if (res.data.success) {
|
||||
this.talkList = res.data.result;
|
||||
console.log(this.talkList, 'this.talkListthis.talkList');
|
||||
}
|
||||
});
|
||||
},
|
||||
navigateTo (url) {
|
||||
uni.navigateTo({
|
||||
url,
|
||||
});
|
||||
},
|
||||
cleanUnread () {
|
||||
clearmeaager().then((res) => {
|
||||
console.log(res);
|
||||
if (res.data.code == 200) {
|
||||
this.userTalkList();
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: res.data.message,
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.talk-view {
|
||||
border-radius: 20rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.talk-item-view {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
padding: 10rpx 20rpx;
|
||||
|
||||
.talk-img {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.talk-info {
|
||||
padding-left: 30rpx;
|
||||
flex: 1;
|
||||
|
||||
.talk-name {
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 10rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.talk-message {
|
||||
font-size: 28rpx;
|
||||
margin-top: 10rpx;
|
||||
color: #888787;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.talk-tag {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.talk-time {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.iconBox {
|
||||
width: 94%;
|
||||
margin: 0 3%;
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 24rpx 0 rgba($color: #f6f6f6, $alpha: 1);
|
||||
// transform: translateY(-30rpx);
|
||||
}
|
||||
|
||||
.icon-list {
|
||||
height: 140rpx;
|
||||
text-align: center;
|
||||
font-size: $font-sm;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
padding: 0 3%;
|
||||
color: #999;
|
||||
|
||||
.icon-item {
|
||||
position: relative;
|
||||
line-height: 2em;
|
||||
width: 96rpx;
|
||||
|
||||
:first-child {
|
||||
font-size: 48rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bag {
|
||||
width: 56rpx;
|
||||
height: 56rpx;
|
||||
border-radius: 50%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.bag1 {
|
||||
background: #ff0015;
|
||||
}
|
||||
|
||||
.bag2 {
|
||||
background: #73AF7C;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
@import "./index-app.scss";
|
||||
</style>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="wrapper">
|
||||
<!-- 选择地址 -->
|
||||
<div class="address-box" @click="clickToAddress()">
|
||||
<div class="address-box" @click="clickToAddress()" v-if="shippingText == 'LOGISTICS'">
|
||||
<div class="user-box flex">
|
||||
<div class="flex-8">
|
||||
<div v-if="!address.id">请选择地址</div>
|
||||
|
|
@ -10,15 +10,8 @@
|
|||
<!-- 省市区 -->
|
||||
<div class="flex flex-a-c">
|
||||
<span class="default" v-if="address.isDefault">默认</span>
|
||||
<div
|
||||
class="address-list"
|
||||
v-if="address.consigneeAddressPath.length != 0"
|
||||
>
|
||||
<span
|
||||
class="address-item"
|
||||
v-for="(item, index) in address.consigneeAddressPath"
|
||||
:key="index"
|
||||
>
|
||||
<div class="address-list" v-if="address.consigneeAddressPath.length != 0">
|
||||
<span class="address-item" v-for="(item, index) in address.consigneeAddressPath" :key="index">
|
||||
{{ item }}
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -41,50 +34,53 @@
|
|||
<div class="bar"></div>
|
||||
</div>
|
||||
|
||||
<!-- 选择自提点 -->
|
||||
<div class="address-box" v-if="shippingText == 'SELF_PICK_UP'">
|
||||
<div @click="clickToStoreAddress()">
|
||||
<div class="user-box flex">
|
||||
<div class="flex-8">
|
||||
<div v-if="!storeAddress">请选择自提点</div>
|
||||
<div v-else>
|
||||
<div class="user-address">
|
||||
<!-- 自提点地址 -->
|
||||
<div class="user-address-detail wes-2">
|
||||
{{ storeAddress.address }}
|
||||
</div>
|
||||
<!-- 联系手机号 -->
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<u-icon name="arrow-right" style="color: #bababa"></u-icon>
|
||||
</div>
|
||||
<!-- 背景 -->
|
||||
<div class="bar"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 开团信息 -->
|
||||
<view class="group-box" v-if="isAssemble">
|
||||
<view class="group-title">
|
||||
<span v-if="pintuanFlage">你正在开团购买</span>
|
||||
<span v-else
|
||||
>为你加入仅差<span>{{ routerVal.parentOrder.toBeGroupedNum }}</span
|
||||
>人的团购买</span
|
||||
>
|
||||
<span v-else>为你加入仅差<span>{{ routerVal.parentOrder.toBeGroupedNum }}</span>人的团购买</span>
|
||||
</view>
|
||||
<view class="group">
|
||||
<view>
|
||||
<u-image
|
||||
borderRadius="50%"
|
||||
shape="square"
|
||||
class="head-img"
|
||||
width="81rpx"
|
||||
height="81rpx"
|
||||
:src="masterWay.face || '/static/missing-face.png'"
|
||||
></u-image>
|
||||
<u-image borderRadius="50%" shape="square" class="head-img" width="81rpx" height="81rpx"
|
||||
:src="masterWay.face || '/static/missing-face.png'"></u-image>
|
||||
<view class="btn-one">团长</view>
|
||||
</view>
|
||||
<view class="line"> </view>
|
||||
<view>
|
||||
<!-- 如果有最后一名，显示最后一名，没有最后一名，显示等待参团 -->
|
||||
<u-image
|
||||
class="head-img"
|
||||
v-if="endWay.face"
|
||||
:src="endWay.face"
|
||||
borderRadius="50%"
|
||||
shape="square"
|
||||
width="81rpx"
|
||||
height="81rpx"
|
||||
>
|
||||
<u-image class="head-img" v-if="endWay.face" :src="endWay.face" borderRadius="50%" shape="square"
|
||||
width="81rpx" height="81rpx">
|
||||
<view slot="loading"></view>
|
||||
</u-image>
|
||||
<u-image
|
||||
class="head-img"
|
||||
borderRadius="50%"
|
||||
shape="square"
|
||||
v-else
|
||||
width="81rpx"
|
||||
height="81rpx"
|
||||
:src="endWay.face || '/static/missing-face.png'"
|
||||
></u-image>
|
||||
<u-image class="head-img" borderRadius="50%" shape="square" v-else width="81rpx" height="81rpx"
|
||||
:src="endWay.face || '/static/missing-face.png'"></u-image>
|
||||
|
||||
<view class="wait">{{ endWay.nickname || "等待参团" }}</view>
|
||||
</view>
|
||||
|
|
@ -92,11 +88,7 @@
|
|||
</view>
|
||||
|
||||
<!-- 店铺商品信息 -->
|
||||
<div
|
||||
class="box box2"
|
||||
v-for="(item, index) in orderMessage.cartList"
|
||||
:key="index"
|
||||
>
|
||||
<div class="box box2" v-for="(item, index) in orderMessage.cartList" :key="index">
|
||||
<div v-if="item.checked">
|
||||
<div @click="navigateToStore(item)">
|
||||
<div class="store-name">
|
||||
|
|
@ -104,42 +96,25 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="promotionNotice">{{ item.promotionNotice || "" }}</div>
|
||||
<div
|
||||
class="flex goods-item"
|
||||
v-for="(val, i) in item.checkedSkuList"
|
||||
:key="i"
|
||||
>
|
||||
<div
|
||||
class="goods-image"
|
||||
@click="
|
||||
navigateTo(
|
||||
'/pages/product/goods?id=' +
|
||||
val.goodsSku.id +
|
||||
'&goodsId=' +
|
||||
val.goodsSku.goodsId
|
||||
)
|
||||
"
|
||||
:span="3"
|
||||
>
|
||||
<u-image
|
||||
borderRadius="10rpx"
|
||||
width="200rpx"
|
||||
height="200rpx"
|
||||
:src="val.goodsSku.thumbnail"
|
||||
alt
|
||||
/>
|
||||
<div class="flex goods-item" v-for="(val, i) in item.checkedSkuList" :key="i">
|
||||
<div class="goods-image" @click="
|
||||
navigateTo(
|
||||
'/pages/product/goods?id=' +
|
||||
val.goodsSku.id +
|
||||
'&goodsId=' +
|
||||
val.goodsSku.goodsId
|
||||
)
|
||||
" :span="3">
|
||||
<u-image borderRadius="10rpx" width="200rpx" height="200rpx" :src="val.goodsSku.thumbnail" alt />
|
||||
</div>
|
||||
<div
|
||||
@click="
|
||||
navigateTo(
|
||||
'/pages/product/goods?id=' +
|
||||
val.goodsSku.id +
|
||||
'&goodsId=' +
|
||||
val.goodsSku.goodsId
|
||||
)
|
||||
"
|
||||
class="goods-detail"
|
||||
>
|
||||
<div @click="
|
||||
navigateTo(
|
||||
'/pages/product/goods?id=' +
|
||||
val.goodsSku.id +
|
||||
'&goodsId=' +
|
||||
val.goodsSku.goodsId
|
||||
)
|
||||
" class="goods-detail">
|
||||
<div class="flex">
|
||||
<p class="goods-name">{{ val.goodsSku.goodsName }}</p>
|
||||
<span class="nums">x{{ val.num }}</span>
|
||||
|
|
@ -147,7 +122,7 @@
|
|||
<p class="goods-prices">
|
||||
<span>￥</span>
|
||||
<span class="goods-price">{{
|
||||
$options.filters.goodsFormatPrice(val.purchasePrice)[0]
|
||||
$options.filters.goodsFormatPrice(val.purchasePrice)[0]
|
||||
}}</span>
|
||||
<span>.{{ $options.filters.goodsFormatPrice(val.purchasePrice)[1] }}</span>
|
||||
</p>
|
||||
|
|
@ -155,93 +130,54 @@
|
|||
</div>
|
||||
<u-row>
|
||||
<u-col :offset="0" :span="4">发票信息</u-col>
|
||||
<u-col
|
||||
:span="8"
|
||||
class="tipsColor"
|
||||
textAlign="right"
|
||||
@click.native="invoice()"
|
||||
>
|
||||
<span v-if="receiptList"
|
||||
>{{ receiptList.receiptTitle }} -
|
||||
{{ receiptList.receiptContent }}</span
|
||||
>
|
||||
<u-col :span="8" class="tipsColor" textAlign="right" @click.native="invoice()">
|
||||
<span v-if="receiptList">{{ receiptList.receiptTitle }} -
|
||||
{{ receiptList.receiptContent }}</span>
|
||||
<span v-else>不开发票</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
<u-row>
|
||||
<u-col
|
||||
v-if="orderMessage.cartTypeEnum != 'VIRTUAL'"
|
||||
:offset="0"
|
||||
:span="9"
|
||||
@click="shippingFlag = true"
|
||||
>配送
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :offset="0" :span="9" @click="shippingFlag = true">配送
|
||||
</u-col>
|
||||
<u-col
|
||||
v-if="orderMessage.cartTypeEnum != 'VIRTUAL'"
|
||||
:span="3"
|
||||
textAlign="right"
|
||||
@click="shippingFlag = true"
|
||||
>
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :span="3" textAlign="right" @click="shippingFlag = true">
|
||||
{{
|
||||
shippingMethod.find((e) => {
|
||||
return e.value == shippingText;
|
||||
}).label
|
||||
shippingMethod.find((e) => {
|
||||
return e.value == shippingText;
|
||||
}).label
|
||||
}}
|
||||
</u-col>
|
||||
</u-row>
|
||||
<u-row>
|
||||
<u-col :offset="0" :span="4" class="tl" style="text-align: left"
|
||||
>备注信息</u-col
|
||||
>
|
||||
<u-col :offset="0" :span="4" class="tl" style="text-align: left">备注信息</u-col>
|
||||
<u-col :span="8" textAlign="right">
|
||||
<u-input
|
||||
style="text-align: right"
|
||||
class="uinput"
|
||||
v-model="remarkVal[index].remark"
|
||||
/>
|
||||
<u-input style="text-align: right" class="uinput" v-model="remarkVal[index].remark" />
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 发票信息 -->
|
||||
<invoices
|
||||
:res="receiptList"
|
||||
@callbackInvoice="callbackInvoice"
|
||||
v-if="invoiceFlag"
|
||||
/>
|
||||
<u-select v-model="shippingFlag" :list="shippingMethod"></u-select>
|
||||
<invoices :res="receiptList" @callbackInvoice="callbackInvoice" v-if="invoiceFlag" />
|
||||
<u-select @confirm="confirmDistribution" v-model="shippingFlag" v-if="shippingMethod.length != 0"
|
||||
:list="shippingMethod"></u-select>
|
||||
|
||||
<div class="box box5" v-if="orderMessage.priceDetailDTO">
|
||||
<div>
|
||||
<u-row>
|
||||
<u-col :span="9">商品合计</u-col>
|
||||
<u-col :span="3" textAlign="right">
|
||||
<span
|
||||
>￥{{ orderMessage.priceDetailDTO.goodsPrice | unitPrice }}</span
|
||||
>
|
||||
<span>￥{{ orderMessage.priceDetailDTO.goodsPrice | unitPrice }}</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
<div>
|
||||
<u-row>
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :span="7"
|
||||
>运费</u-col
|
||||
>
|
||||
<u-col
|
||||
v-if="orderMessage.cartTypeEnum != 'VIRTUAL'"
|
||||
:span="5"
|
||||
class="tr tipsColor"
|
||||
textAlign="right"
|
||||
>
|
||||
<span v-if="orderMessage.priceDetailDTO.freightPrice == 0"
|
||||
>包邮</span
|
||||
>
|
||||
<span v-else
|
||||
>￥{{
|
||||
<u-row v-if="shippingText == 'LOGISTICS'">
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :span="7">运费</u-col>
|
||||
<u-col v-if="orderMessage.cartTypeEnum != 'VIRTUAL'" :span="5" class="tr tipsColor" textAlign="right">
|
||||
<span v-if="orderMessage.priceDetailDTO.freightPrice == 0">包邮</span>
|
||||
<span v-else>￥{{
|
||||
orderMessage.priceDetailDTO.freightPrice | unitPrice
|
||||
}}</span
|
||||
>
|
||||
}}</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
|
|
@ -269,15 +205,10 @@
|
|||
<div>
|
||||
<u-row>
|
||||
<u-col :span="9">优惠金额</u-col>
|
||||
<u-col
|
||||
:span="3"
|
||||
textAlign="right"
|
||||
v-if="orderMessage.priceDetailDTO.couponPrice"
|
||||
>
|
||||
<u-col :span="3" textAlign="right" v-if="orderMessage.priceDetailDTO.couponPrice">
|
||||
<span class="main-color">
|
||||
-￥{{ orderMessage.priceDetailDTO.couponPrice | unitPrice }}</span
|
||||
></u-col
|
||||
>
|
||||
-￥{{ orderMessage.priceDetailDTO.couponPrice | unitPrice }}</span>
|
||||
</u-col>
|
||||
<u-col :span="3" textAlign="right" v-else>0.00</u-col>
|
||||
</u-row>
|
||||
</div>
|
||||
|
|
@ -285,11 +216,9 @@
|
|||
<u-row>
|
||||
<u-col :span="6">活动优惠</u-col>
|
||||
<u-col :span="6" class="tr tipsColor" textAlign="right">
|
||||
<span v-if="orderMessage.priceDetailDTO.discountPrice"
|
||||
>-￥{{
|
||||
<span v-if="orderMessage.priceDetailDTO.discountPrice">-￥{{
|
||||
orderMessage.priceDetailDTO.discountPrice | unitPrice
|
||||
}}</span
|
||||
>
|
||||
}}</span>
|
||||
<span v-else>0.00</span>
|
||||
</u-col>
|
||||
</u-row>
|
||||
|
|
@ -298,12 +227,7 @@
|
|||
|
||||
<!-- 配送地区没有提示 -->
|
||||
<div class="notSupportFreight" v-if="notSupportFreight.length != 0">
|
||||
<u-notice-bar
|
||||
style="width: 100%"
|
||||
:volume-icon="false"
|
||||
mode="horizontal"
|
||||
:list="notSupportFreightGoodsList"
|
||||
>
|
||||
<u-notice-bar style="width: 100%" :volume-icon="false" mode="horizontal" :list="notSupportFreightGoodsList">
|
||||
</u-notice-bar>
|
||||
</div>
|
||||
|
||||
|
|
@ -314,18 +238,14 @@
|
|||
<div v-if="!orderMessage.priceDetailDTO.payPoint" class="number">
|
||||
<span>¥</span>
|
||||
<span class="price">{{
|
||||
$options.filters.goodsFormatPrice(orderMessage.priceDetailDTO.flowPrice)[0]
|
||||
$options.filters.goodsFormatPrice(orderMessage.priceDetailDTO.flowPrice)[0]
|
||||
}}</span>
|
||||
<span
|
||||
>.{{ $options.filters.goodsFormatPrice(orderMessage.priceDetailDTO.flowPrice)[1] }}
|
||||
<span>.{{ $options.filters.goodsFormatPrice(orderMessage.priceDetailDTO.flowPrice)[1] }}
|
||||
</span>
|
||||
</div>
|
||||
<span v-else class="number"
|
||||
><span style="margin-right: 10rpx">{{
|
||||
<span v-else class="number"><span style="margin-right: 10rpx">{{
|
||||
orderMessage.priceDetailDTO.payPoint | unitPrice
|
||||
}}</span
|
||||
>积分</span
|
||||
>
|
||||
}}</span>积分</span>
|
||||
</div>
|
||||
<div class="navRiv" @click="createTradeFun()">
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
|
|
@ -360,11 +280,16 @@ export default {
|
|||
invoiceFlag: false, //开票开关
|
||||
shippingText: "LOGISTICS",
|
||||
shippingFlag: false,
|
||||
shippingMethod: [
|
||||
shippingMethod: [],
|
||||
shippingWay: [
|
||||
{
|
||||
value: "LOGISTICS",
|
||||
label: "物流",
|
||||
},
|
||||
{
|
||||
value: "SELF_PICK_UP",
|
||||
label: "自提",
|
||||
},
|
||||
],
|
||||
isAssemble: false, //是否拼团
|
||||
couponNums: "", //结算页面优惠券数量
|
||||
|
|
@ -375,6 +300,7 @@ export default {
|
|||
couponList: "",
|
||||
// 已选地址
|
||||
address: "",
|
||||
shopAddress: "",
|
||||
// 发票信息
|
||||
receiptList: "",
|
||||
// 店铺信息
|
||||
|
|
@ -437,11 +363,12 @@ export default {
|
|||
}
|
||||
},
|
||||
|
||||
onShow() {
|
||||
async onShow() {
|
||||
uni.showLoading({
|
||||
mask: true,
|
||||
});
|
||||
this.getOrderList();
|
||||
await this.getOrderList();
|
||||
await this.getDistribution();
|
||||
uni.hideLoading();
|
||||
if (this.routerVal.way == "PINTUAN") {
|
||||
this.isAssemble = true;
|
||||
|
|
@ -451,7 +378,7 @@ export default {
|
|||
this.pintuanWay();
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
mounted() { },
|
||||
|
||||
methods: {
|
||||
//发票回调 选择发票之后刷新购物车
|
||||
|
|
@ -480,13 +407,18 @@ export default {
|
|||
// 点击跳转地址
|
||||
clickToAddress() {
|
||||
this.navigateTo(
|
||||
`/pages/mine/address/address?from=cart&way=${
|
||||
this.routerVal.way
|
||||
`/pages/mine/address/address?from=cart&way=${this.routerVal.way
|
||||
}&parentOrder=${encodeURIComponent(
|
||||
JSON.stringify(this.routerVal.parentOrder)
|
||||
)}`
|
||||
);
|
||||
},
|
||||
clickToStoreAddress() {
|
||||
this.navigateTo(
|
||||
`/pages/mine/address/storeAddress?from=cart&way=${this.routerVal.way
|
||||
}&storeId=${this.remarkVal[0].storeId}`
|
||||
);
|
||||
},
|
||||
|
||||
// 判断团长以及团员信息
|
||||
pintuanWay() {
|
||||
|
|
@ -560,14 +492,26 @@ export default {
|
|||
createTradeFun() {
|
||||
// 防抖
|
||||
this.$u.throttle(() => {
|
||||
if (!this.address.id) {
|
||||
uni.showToast({
|
||||
title: "请选择地址",
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
if (this.shippingText === 'SELF_PICK_UP') {
|
||||
if (!this.storeAddress.id) {
|
||||
uni.showToast({
|
||||
title: "请选择提货点",
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
} else if (this.shippingText === 'LOGISTICS') {
|
||||
if (!this.address.id) {
|
||||
uni.showToast({
|
||||
title: "请选择地址",
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// 创建订单
|
||||
let client;
|
||||
// #ifdef H5
|
||||
|
|
@ -652,9 +596,40 @@ export default {
|
|||
}
|
||||
});
|
||||
},
|
||||
// 获取配送列表
|
||||
async getDistribution() {
|
||||
let shopRes = await API_Trade.shippingMethodList({ way: this.routerVal.way });
|
||||
let shopList;
|
||||
if (shopRes.data.success) {
|
||||
shopList = shopRes.data.result;
|
||||
let way = [];
|
||||
console.log(shopList)
|
||||
this.shippingWay.forEach((item) => {
|
||||
shopList.forEach((child) => {
|
||||
if (item.value == child) {
|
||||
way.push(item);
|
||||
}
|
||||
});
|
||||
});
|
||||
this.shippingMethod = way;
|
||||
}
|
||||
},
|
||||
|
||||
// 选择配送
|
||||
async confirmDistribution(val) {
|
||||
let res = await API_Trade.setShipMethod({
|
||||
shippingMethod: val[0].value,
|
||||
way: this.routerVal.way,
|
||||
});
|
||||
|
||||
this.shippingText = val[0].value;
|
||||
if (res.data.success) {
|
||||
this.getOrderList();
|
||||
}
|
||||
},
|
||||
|
||||
// 获取结算参数
|
||||
getOrderList() {
|
||||
async getOrderList() {
|
||||
this.notSupportFreight = [];
|
||||
// 获取结算参数
|
||||
API_Trade.getCheckoutParams(this.routerVal.way).then((res) => {
|
||||
|
|
@ -693,7 +668,9 @@ export default {
|
|||
res.data.result.memberAddress.consigneeAddressPath =
|
||||
res.data.result.memberAddress.consigneeAddressPath.split(",");
|
||||
}
|
||||
|
||||
if (res.data.result.storeAddress) {
|
||||
this.storeAddress = res.data.result.storeAddress
|
||||
}
|
||||
if (
|
||||
res.data.result.notSupportFreight &&
|
||||
res.data.result.notSupportFreight.length != 0
|
||||
|
|
@ -724,22 +701,26 @@ page {
|
|||
.main-color {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.uinput {
|
||||
/deep/ input {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.promotionNotice {
|
||||
font-size: 24rpx;
|
||||
margin: 20rpx 0;
|
||||
color: $aider-light-color;
|
||||
}
|
||||
|
||||
.nums {
|
||||
flex: 2;
|
||||
color: $light-color;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.wait {
|
||||
font-size: 22rpx;
|
||||
font-family: PingFang SC, PingFang SC-Regular;
|
||||
|
|
@ -755,6 +736,7 @@ page {
|
|||
width: 143rpx;
|
||||
border-bottom: 2px dotted #999;
|
||||
}
|
||||
|
||||
.tabbar-left {
|
||||
margin-left: 32rpx;
|
||||
}
|
||||
|
|
@ -807,6 +789,7 @@ page {
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.tr {
|
||||
text-align: right;
|
||||
}
|
||||
|
|
@ -829,6 +812,7 @@ page {
|
|||
.box2 {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.notSupportFreight {
|
||||
position: fixed;
|
||||
|
||||
|
|
@ -844,10 +828,11 @@ page {
|
|||
width: 100%;
|
||||
transition: 0.35s;
|
||||
|
||||
> .tips {
|
||||
>.tips {
|
||||
margin: 0 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ .u-notice-bar-wrap {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
|
@ -925,7 +910,8 @@ page {
|
|||
color: $main-color;
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
> span {
|
||||
|
||||
>span {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
}
|
||||
|
|
@ -935,7 +921,8 @@ page {
|
|||
color: $main-color;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
> .goods-price {
|
||||
|
||||
>.goods-price {
|
||||
font-size: 38rpx;
|
||||
padding: 0 2rpx;
|
||||
}
|
||||
|
|
@ -976,6 +963,7 @@ page {
|
|||
text-align: left;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.default {
|
||||
background: $main-color;
|
||||
font-size: 24rpx;
|
||||
|
|
@ -984,6 +972,7 @@ page {
|
|||
color: #fff;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.address-box {
|
||||
border-radius: 40rpx;
|
||||
border-top-left-radius: 0 !important;
|
||||
|
|
@ -998,9 +987,11 @@ page {
|
|||
font-weight: normal;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
|
||||
.user-box {
|
||||
padding: 32rpx;
|
||||
}
|
||||
|
||||
.user-address-detail {
|
||||
color: #333;
|
||||
font-size: 38rpx;
|
||||
|
|
@ -1008,13 +999,16 @@ page {
|
|||
margin: 20rpx 0;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
|
||||
.mobile {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 50rpx !important;
|
||||
margin: 0 2rpx;
|
||||
}
|
||||
|
||||
.goods-detail {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
@ -1022,12 +1016,14 @@ page {
|
|||
justify-content: center;
|
||||
flex: 8;
|
||||
margin-left: 20rpx !important;
|
||||
> p {
|
||||
|
||||
>p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-item {
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -814,3 +814,4 @@ page,
|
|||
height: 60rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
|
|
@ -12,25 +12,25 @@
|
|||
<view class="info-view logi-view">
|
||||
<view class="logi-List" v-if="logiList && logiList.traces.length != 0">
|
||||
<view class="logi-List-title">
|
||||
{{logiList.traces[logiList.traces.length-1].AcceptStation}}
|
||||
{{ logiList.traces[logiList.traces.length - 1].AcceptStation }}
|
||||
</view>
|
||||
<view class="logi-List-time">
|
||||
{{logiList.traces[logiList.traces.length-1].AcceptTime}}
|
||||
{{ logiList.traces[logiList.traces.length - 1].AcceptTime }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="logi-List" v-else>
|
||||
<view class="verificationCode" v-if="order.verificationCode ">
|
||||
券码： {{order.verificationCode}}
|
||||
<view class="verificationCode" v-if="order.verificationCode">
|
||||
券码： {{ order.verificationCode }}
|
||||
</view>
|
||||
<view v-else class="logi-List-title">
|
||||
{{'暂无物流信息'}}
|
||||
{{ '暂无物流信息' }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- 地址 -->
|
||||
<view class="info-view">
|
||||
<view class="info-view" v-if="order.deliveryMethod == 'LOGISTICS'">
|
||||
<view class="address-view">
|
||||
<view>
|
||||
<view class="address-title">
|
||||
|
|
@ -42,6 +42,21 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 提货地址 -->
|
||||
<view class="info-view" v-if="order.deliveryMethod == 'SELF_PICK_UP'">
|
||||
<view class="address-view">
|
||||
<view>
|
||||
<view class="address-title">
|
||||
自提点地址:<span>{{ order.storeAddressPath }}</span>
|
||||
</view>
|
||||
<view class="address-title">
|
||||
联系方式:<span>{{ order.storeAddressMobile }}</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 商品信息 -->
|
||||
<view>
|
||||
<view class="seller-view">
|
||||
|
|
@ -49,7 +64,8 @@
|
|||
<view class="seller-info u-flex u-row-between">
|
||||
<view class="seller-name" @click="tostore(order)">
|
||||
<view class="name">{{ order.storeName }}</view>
|
||||
<view class="status" v-if="orderStatusList[order.orderStatus]"> {{ orderStatusList[order.orderStatus].title }}</view>
|
||||
<view class="status" v-if="orderStatusList[order.orderStatus]"> {{ orderStatusList[order.orderStatus].title
|
||||
}}</view>
|
||||
</view>
|
||||
<view class="order-sn"></view>
|
||||
</view>
|
||||
|
|
@ -70,7 +86,8 @@
|
|||
<view>x{{ sku.num }}</view>
|
||||
|
||||
<view class="good-complaint">
|
||||
<u-tag size="mini" mode="plain" @click="complaint(sku)" v-if="sku.complainStatus == 'NO_APPLY'" text="投诉" type="info" />
|
||||
<u-tag size="mini" mode="plain" @click="complaint(sku)" v-if="sku.complainStatus == 'NO_APPLY'"
|
||||
text="投诉" type="info" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -105,15 +122,18 @@
|
|||
</view>
|
||||
<!-- 客户服务， 售后，取消订单，查看物流，投诉等 -->
|
||||
<view class="info-view"
|
||||
v-if="orderDetail.allowOperationVO && orderDetail.allowOperationVO.cancel == true || order.orderStatus == 'DELIVERED' || order.orderStatus != 'UNPAID' && order.orderPromotionType =='PINTUAN'">
|
||||
v-if="orderDetail.allowOperationVO && orderDetail.allowOperationVO.cancel == true || order.orderStatus == 'DELIVERED' || order.orderStatus != 'UNPAID' && order.orderPromotionType == 'PINTUAN'">
|
||||
<view style="width: 100%">
|
||||
<view class="order-info-view">
|
||||
<view class="title">服务</view>
|
||||
</view>
|
||||
<view class="customer-list">
|
||||
<view class="customer-service" v-if="orderDetail.allowOperationVO && orderDetail.allowOperationVO.cancel == true" @click="onCancel(order.sn)">取消订单</view>
|
||||
<view class="customer-service"
|
||||
v-if="orderDetail.allowOperationVO && orderDetail.allowOperationVO.cancel == true"
|
||||
@click="onCancel(order.sn)">取消订单</view>
|
||||
<view class="customer-service" v-if="order.orderStatus == 'DELIVERED'" @click="onLogistics(order)">查看物流</view>
|
||||
<view class="customer-service" v-if="order.orderStatus != 'UNPAID' && order.orderPromotionType =='PINTUAN' " @click="ByUserMessage(order)">查看拼团信息</view>
|
||||
<view class="customer-service" v-if="order.orderStatus != 'UNPAID' && order.orderPromotionType == 'PINTUAN'"
|
||||
@click="ByUserMessage(order)">查看拼团信息</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -129,18 +149,18 @@
|
|||
<view class="order-info-view">
|
||||
<view class="title">下单时间：</view>
|
||||
<view class="value">{{
|
||||
order.createTime
|
||||
order.createTime
|
||||
}}</view>
|
||||
</view>
|
||||
<view class="order-info-view">
|
||||
<view class="title">支付状态：</view>
|
||||
<view class="value">
|
||||
{{
|
||||
order.payStatus == "UNPAID"
|
||||
? "未付款"
|
||||
: order.payStatus == "PAID"
|
||||
? "已付款"
|
||||
: ""
|
||||
order.payStatus == "UNPAID"
|
||||
? "未付款"
|
||||
: order.payStatus == "PAID"
|
||||
? "已付款"
|
||||
: ""
|
||||
}}</view>
|
||||
</view>
|
||||
<view class="order-info-view">
|
||||
|
|
@ -175,13 +195,16 @@
|
|||
<view>
|
||||
<!-- 全部 -->
|
||||
<!-- 等待付款 -->
|
||||
<u-button type="error" ripple size="mini" v-if=" order.allowOperationVO && order.allowOperationVO.pay" @click="toPay(order)">立即付款</u-button>
|
||||
<u-button type="error" ripple size="mini" v-if="order.allowOperationVO && order.allowOperationVO.pay"
|
||||
@click="toPay(order)">立即付款</u-button>
|
||||
|
||||
<!-- <u-button class="rebuy-btn" size="mini" v-if="order.order_operate_allowable_vo.allow_service_cancel"> 提醒发货</u-button> -->
|
||||
<!-- <div class="pay-btn">确认收货</div> -->
|
||||
<u-button shape="circle" ripple type="warning" size="mini" v-if="order.orderStatus == 'DELIVERED'" @click="onRog(order.sn)">确认收货</u-button>
|
||||
<u-button shape="circle" ripple type="warning" size="mini" v-if="order.orderStatus == 'DELIVERED'"
|
||||
@click="onRog(order.sn)">确认收货</u-button>
|
||||
<!-- 交易完成 未评价 -->
|
||||
<u-button shape="circle" ripple size="mini" v-if="order.orderStatus == 'COMPLETE'" @click="onComment(order.sn)">评价商品</u-button>
|
||||
<u-button shape="circle" ripple size="mini" v-if="order.orderStatus == 'COMPLETE'"
|
||||
@click="onComment(order.sn)">评价商品</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -193,7 +216,8 @@
|
|||
<u-radio-group v-model="reason">
|
||||
<view class="value">
|
||||
<view class="radio-view" v-for="(item, index) in cancelList" :key="index">
|
||||
<u-radio :active-color="lightColor" label-size="25" shape="circle" :name="item.reason" @change="reasonChange">{{ item.reason }}</u-radio>
|
||||
<u-radio :active-color="lightColor" label-size="25" shape="circle" :name="item.reason"
|
||||
@change="reasonChange">{{ item.reason }}</u-radio>
|
||||
</view>
|
||||
</view>
|
||||
</u-radio-group>
|
||||
|
|
@ -204,10 +228,12 @@
|
|||
</view>
|
||||
</u-popup>
|
||||
<u-toast ref="uToast" />
|
||||
<u-modal v-model="rogShow" :show-cancel-button="true" :content="'是否确认收货?'" :confirm-color="lightColor" @confirm="confirmRog"></u-modal>
|
||||
<u-modal v-model="rogShow" :show-cancel-button="true" :content="'是否确认收货?'" :confirm-color="lightColor"
|
||||
@confirm="confirmRog"></u-modal>
|
||||
|
||||
<!-- 分享 -->
|
||||
<shares v-if="shareFlage " :thumbnail="orderDetail.orderItems[0].image" :goodsName="orderDetail.orderItems[0].goodsName" @close="shareFlage = false" />
|
||||
<shares v-if="shareFlage" :thumbnail="orderDetail.orderItems[0].image"
|
||||
:goodsName="orderDetail.orderItems[0].goodsName" @close="shareFlage = false" />
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -255,6 +281,10 @@ export default {
|
|||
title: "已完成",
|
||||
value: "订单已完成,祝您生活愉快",
|
||||
},
|
||||
STAY_PICKED_UP: {
|
||||
title: "待自提",
|
||||
value: "商品正在等待提取",
|
||||
},
|
||||
TAKE: {
|
||||
title: "待核验",
|
||||
},
|
||||
|
|
@ -272,7 +302,6 @@ export default {
|
|||
},
|
||||
onLoad(options) {
|
||||
this.loadData(options.sn);
|
||||
this.loadLogistics(options.sn);
|
||||
this.sn = options.sn;
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -304,7 +333,7 @@ export default {
|
|||
this.orderGoodsList[0].goodsId,
|
||||
});
|
||||
},
|
||||
loadData(sn) {
|
||||
async loadData(sn) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
});
|
||||
|
|
@ -313,9 +342,12 @@ export default {
|
|||
this.order = order.order;
|
||||
this.orderGoodsList = order.orderItems;
|
||||
this.orderDetail = res.data.result;
|
||||
|
||||
if (this.order.deliveryMethod === 'LOGISTICS') {
|
||||
this.loadLogistics()
|
||||
}
|
||||
uni.hideLoading();
|
||||
});
|
||||
|
||||
},
|
||||
onReceipt(val) {
|
||||
uni.navigateTo({
|
||||
|
|
@ -383,8 +415,8 @@ export default {
|
|||
toPay(val) {
|
||||
val.sn
|
||||
? uni.navigateTo({
|
||||
url: "/pages/cart/payment/payOrder?order_sn=" + val.sn,
|
||||
})
|
||||
url: "/pages/cart/payment/payOrder?order_sn=" + val.sn,
|
||||
})
|
||||
: false;
|
||||
}, //删除订单
|
||||
deleteOrder(index) {
|
||||
|
|
@ -491,9 +523,11 @@ export default {
|
|||
|
||||
<style lang="scss">
|
||||
@import "./goods.scss";
|
||||
|
||||
.empty {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.customer-service {
|
||||
background: #ededed;
|
||||
// padding: 12rpx 40rpx;
|
||||
|
|
@ -506,51 +540,58 @@ export default {
|
|||
font-size: 24rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.customer-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.logi-view {
|
||||
justify-content: space-between;
|
||||
padding: 30rpx !important;
|
||||
margin: 0 !important;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
|
||||
.order-status {
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
margin-top: 40rpx;
|
||||
> div {
|
||||
|
||||
>div {
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.logi-List-title {
|
||||
margin-bottom: 10rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.logi-List-time {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.info-detail {
|
||||
margin-right: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.order-view {
|
||||
margin: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
width: 100%;
|
||||
height: 200rpx;
|
||||
padding: 0 !important;
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
$light-color 0%,
|
||||
$aider-light-color 100%
|
||||
) !important;
|
||||
background-image: linear-gradient(to right,
|
||||
$light-color 0%,
|
||||
$aider-light-color 100%) !important;
|
||||
}
|
||||
|
||||
page,
|
||||
.content {
|
||||
background: #f1f1f1;
|
||||
|
|
@ -575,18 +616,22 @@ page,
|
|||
padding: 16rpx 0rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.seller-view {
|
||||
margin: 20rpx 0;
|
||||
padding: 15rpx 0;
|
||||
border-radius: 30rpx;
|
||||
}
|
||||
|
||||
.address-title {
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
> span {
|
||||
|
||||
>span {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.info-view {
|
||||
display: flex;
|
||||
margin: 0 0 20rpx 0;
|
||||
|
|
@ -654,10 +699,12 @@ page,
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.verificationCode {
|
||||
font-weight: bold;
|
||||
letter-spacing: 2rpx;
|
||||
}
|
||||
|
||||
.bottom_view {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
|
|
|
|||
|
|
@ -6,55 +6,27 @@
|
|||
<!-- 仅h5有效 打开App -->
|
||||
|
||||
<!-- 分享 -->
|
||||
<shares
|
||||
v-if="enableShare && goodsDetail.id"
|
||||
:skuId="this.routerVal.id"
|
||||
:goodsId="this.routerVal.goodsId"
|
||||
:link="
|
||||
'/pages/product/goods?id=' +
|
||||
this.routerVal.id +
|
||||
'&goodsId=' +
|
||||
this.routerVal.goodsId
|
||||
"
|
||||
:thumbnail="goodsDetail.thumbnail"
|
||||
:goodsName="goodsDetail.goodsName"
|
||||
type="goods"
|
||||
@close="enableShare = false"
|
||||
/>
|
||||
<popups
|
||||
v-model="popupsSwitch"
|
||||
@tapPopup="handleNavbarList"
|
||||
:popData="navbarListData"
|
||||
:x="navbarListX"
|
||||
:y="navbarListY"
|
||||
placement="top-start"
|
||||
/>
|
||||
<shares v-if="enableShare && goodsDetail.id" :skuId="this.routerVal.id" :goodsId="this.routerVal.goodsId" :link="
|
||||
'/pages/product/goods?id=' +
|
||||
this.routerVal.id +
|
||||
'&goodsId=' +
|
||||
this.routerVal.goodsId
|
||||
" :thumbnail="goodsDetail.thumbnail" :goodsName="goodsDetail.goodsName" type="goods" @close="enableShare = false" />
|
||||
<popups v-model="popupsSwitch" @tapPopup="handleNavbarList" :popData="navbarListData" :x="navbarListX"
|
||||
:y="navbarListY" placement="top-start" />
|
||||
<view class="index">
|
||||
<!-- topBar -->
|
||||
<u-navbar
|
||||
:background="navbar"
|
||||
:is-back="false"
|
||||
:class="headerFlag ? 'header' : 'header bg-none scroll-hide'"
|
||||
>
|
||||
<u-navbar :background="navbar" :is-back="false" :class="headerFlag ? 'header' : 'header bg-none scroll-hide'">
|
||||
<div class="headerRow">
|
||||
<div class="backs">
|
||||
<u-icon @click="back()" name="arrow-left" class="icon-back"></u-icon>
|
||||
|
||||
<u-icon
|
||||
name="list"
|
||||
@click="popupsSwitch = !popupsSwitch"
|
||||
class="icon-list"
|
||||
></u-icon>
|
||||
<u-icon name="list" @click="popupsSwitch = !popupsSwitch" class="icon-list"></u-icon>
|
||||
</div>
|
||||
<div class="headerList" :class="headerFlag ? 'tab-bar' : 'tab-bar scroll-hide'">
|
||||
<div class="headerRow">
|
||||
<div
|
||||
class="nav-item"
|
||||
v-for="header in headerList"
|
||||
:key="header.id"
|
||||
:class="{ cur: scrollId === header.id }"
|
||||
@click="headerTab(header.id)"
|
||||
>
|
||||
<div class="nav-item" v-for="header in headerList" :key="header.id"
|
||||
:class="{ cur: scrollId === header.id }" @click="headerTab(header.id)">
|
||||
{{ header.text }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -62,57 +34,26 @@
|
|||
</div>
|
||||
</u-navbar>
|
||||
|
||||
<u-navbar
|
||||
:border-bottom="false"
|
||||
v-show="!headerFlag"
|
||||
class="header-only-back"
|
||||
:background="navbarOnlyBack"
|
||||
:is-back="false"
|
||||
>
|
||||
<u-navbar :border-bottom="false" v-show="!headerFlag" class="header-only-back" :background="navbarOnlyBack"
|
||||
:is-back="false">
|
||||
<div>
|
||||
<div class="bg-back">
|
||||
<u-icon
|
||||
size="40"
|
||||
@click="back()"
|
||||
name="arrow-left"
|
||||
class="icon-back"
|
||||
></u-icon>
|
||||
<u-icon
|
||||
size="40"
|
||||
@click="popupsSwitch = !popupsSwitch"
|
||||
name="list"
|
||||
class="icon-list"
|
||||
></u-icon>
|
||||
<u-icon size="40" @click="back()" name="arrow-left" class="icon-back"></u-icon>
|
||||
<u-icon size="40" @click="popupsSwitch = !popupsSwitch" name="list" class="icon-list"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
</u-navbar>
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="product-container"
|
||||
:style="{ height: productRefHeight }"
|
||||
ref="productRef"
|
||||
id="productRef"
|
||||
>
|
||||
<scroll-view
|
||||
scroll-anchoring
|
||||
enableBackToTop="true"
|
||||
scroll-with-animation
|
||||
scroll-y
|
||||
class="scroll-page"
|
||||
:scroll-top="tabScrollTop"
|
||||
@scroll="pageScroll"
|
||||
>
|
||||
<view class="product-container" :style="{ height: productRefHeight }" ref="productRef" id="productRef">
|
||||
<scroll-view scroll-anchoring enableBackToTop="true" scroll-with-animation scroll-y class="scroll-page"
|
||||
:scroll-top="tabScrollTop" @scroll="pageScroll">
|
||||
<view>
|
||||
<!-- 轮播图 -->
|
||||
<GoodsSwiper id="main1" :res="imgList" />
|
||||
|
||||
<!-- 促销活动条 -->
|
||||
<PromotionAssembleLayout
|
||||
v-if="PromotionList"
|
||||
:detail="goodsDetail"
|
||||
:res="PromotionList"
|
||||
/>
|
||||
<PromotionAssembleLayout v-if="PromotionList" :detail="goodsDetail" :res="PromotionList" />
|
||||
|
||||
<view class="card-box top-radius-0" id="main2">
|
||||
<!-- 活动不显示价钱 -->
|
||||
|
|
@ -122,15 +63,11 @@
|
|||
{{ goodsDetail.goodsName || "" }}
|
||||
</view>
|
||||
<view class="favorite" @click="clickFavorite(goodsDetail.id)">
|
||||
<u-icon
|
||||
size="30"
|
||||
:color="favorite ? '#f2270c' : '#262626'"
|
||||
:name="favorite ? 'heart-fill' : 'heart'"
|
||||
>
|
||||
<u-icon size="30" :color="favorite ? '#f2270c' : '#262626'" :name="favorite ? 'heart-fill' : 'heart'">
|
||||
</u-icon>
|
||||
<view :style="{ color: favorite ? '#f2270c' : '#262626' }">{{
|
||||
favorite ? "已收藏" : "收藏"
|
||||
}}</view>
|
||||
favorite ? "已收藏" : "收藏"
|
||||
}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品描述 -->
|
||||
|
|
@ -145,15 +82,24 @@
|
|||
<!-- 如果有积分显示积分 -->
|
||||
<view class="-goods-price" v-if="goodsDetail.price != undefined">
|
||||
|
||||
<span >
|
||||
<span v-if="wholesaleList.length">
|
||||
<span>¥</span><span class="price">{{ $options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length-1].price)[0] }}</span>.{{ $options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length-1].price)[1] }}
|
||||
~
|
||||
<span>¥</span><span class="price">{{ $options.filters.goodsFormatPrice(wholesaleList[0].price)[0] }}</span>.{{ $options.filters.goodsFormatPrice(wholesaleList[0].price)[1] }}
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>¥</span><span class="price">{{ $options.filters.goodsFormatPrice(goodsDetail.price)[0] }}</span>.{{ $options.filters.goodsFormatPrice(goodsDetail.price)[1] }}
|
||||
</span>
|
||||
<span>
|
||||
<span v-if="wholesaleList.length">
|
||||
<span>¥</span><span class="price">{{
|
||||
$options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length - 1].price)[0]
|
||||
}}</span>.{{
|
||||
$options.filters.goodsFormatPrice(wholesaleList[wholesaleList.length - 1].price)[1]
|
||||
}}
|
||||
~
|
||||
<span>¥</span><span class="price">{{
|
||||
$options.filters.goodsFormatPrice(wholesaleList[0].price)[0]
|
||||
}}</span>.{{
|
||||
$options.filters.goodsFormatPrice(wholesaleList[0].price)[1]
|
||||
}}
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>¥</span><span class="price">{{ $options.filters.goodsFormatPrice(goodsDetail.price)[0]
|
||||
}}</span>.{{ $options.filters.goodsFormatPrice(goodsDetail.price)[1] }}
|
||||
</span>
|
||||
</span>
|
||||
</view>
|
||||
<view class="-goods-price" v-else>
|
||||
|
|
@ -165,14 +111,11 @@
|
|||
<view>分享</view>
|
||||
</view>
|
||||
<view class="icons" @click="clickFavorite(goodsDetail.id)">
|
||||
<u-icon
|
||||
size="30"
|
||||
:color="favorite ? '#f2270c' : '#262626'"
|
||||
:name="favorite ? 'heart-fill' : 'heart'"
|
||||
></u-icon>
|
||||
<u-icon size="30" :color="favorite ? '#f2270c' : '#262626'"
|
||||
:name="favorite ? 'heart-fill' : 'heart'"></u-icon>
|
||||
<view :style="{ color: favorite ? '#f2270c' : '#262626' }">{{
|
||||
favorite ? "已收藏" : "收藏"
|
||||
}}</view>
|
||||
favorite ? "已收藏" : "收藏"
|
||||
}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="-goods-name desc-bold">
|
||||
|
|
@ -199,22 +142,16 @@
|
|||
</view>
|
||||
|
||||
<!-- 拼团用户列表 -->
|
||||
<PromotionAssembleListLayout
|
||||
v-if="isGroup"
|
||||
@to-assemble-buy-now="toAssembleBuyNow"
|
||||
:res="PromotionList"
|
||||
/>
|
||||
<PromotionAssembleListLayout v-if="isGroup" @to-assemble-buy-now="toAssembleBuyNow" :res="PromotionList" />
|
||||
|
||||
<!-- 配置地址 如果是虚拟产品的时候不展示 -->
|
||||
<view class="card-box" v-if="goodsDetail.goodsType != 'VIRTUAL_GOODS'">
|
||||
<view class="card-flex" @click="shutMask(4)">
|
||||
<view class="card-title"> 已选 </view>
|
||||
<view class="card-content">
|
||||
<span v-if="selectedGoods.spec"
|
||||
>{{ selectedGoods.spec.specName }}-{{
|
||||
selectedGoods.spec.specValue
|
||||
}}</span
|
||||
>
|
||||
<span v-if="selectedGoods.spec">{{ selectedGoods.spec.specName }}-{{
|
||||
selectedGoods.spec.specValue
|
||||
}}</span>
|
||||
<span v-else>默认</span>
|
||||
</view>
|
||||
<view class="card-bottom">
|
||||
|
|
@ -225,8 +162,8 @@
|
|||
<view class="card-title"> 送至</view>
|
||||
<view class="card-content">
|
||||
<span v-if="delivery">{{
|
||||
delivery.consigneeAddressPath | clearStrComma
|
||||
}}</span>
|
||||
delivery.consigneeAddressPath | clearStrComma
|
||||
}}</span>
|
||||
<span v-else>暂无地址信息</span>
|
||||
</view>
|
||||
<view class="card-bottom">
|
||||
|
|
@ -239,21 +176,11 @@
|
|||
<Evaluation id="main5" :goodsDetail="goodsDetail" />
|
||||
|
||||
<!-- 店铺推荐 -->
|
||||
<storeLayout
|
||||
id="main7"
|
||||
:storeDetail="storeDetail"
|
||||
:goodsDetail="goodsDetail"
|
||||
:res="recommendList"
|
||||
/>
|
||||
<storeLayout id="main7" :storeDetail="storeDetail" :goodsDetail="goodsDetail" :res="recommendList" />
|
||||
|
||||
<!-- 宝贝详情 -->
|
||||
<GoodsIntro
|
||||
id="main9"
|
||||
:res="goodsDetail"
|
||||
:goodsParams="goodsParams"
|
||||
:goodsId="goodsDetail.goodsId"
|
||||
v-if="goodsDetail.id"
|
||||
/>
|
||||
<GoodsIntro id="main9" :res="goodsDetail" :goodsParams="goodsParams" :goodsId="goodsDetail.goodsId"
|
||||
v-if="goodsDetail.id" />
|
||||
|
||||
<!-- 宝贝推荐 -->
|
||||
<GoodsRecommend id="main11" :res="likeGoodsList" />
|
||||
|
|
@ -278,13 +205,8 @@
|
|||
</view>
|
||||
<!-- 正常结算页面 -->
|
||||
<view class="detail-btn" v-if="!isGroup">
|
||||
<view
|
||||
class="to-store-car to-store-btn"
|
||||
v-if="goodsDetail.goodsType != 'VIRTUAL_GOODS'"
|
||||
@click="shutMask(4)"
|
||||
>
|
||||
加入购物车</view
|
||||
>
|
||||
<view class="to-store-car to-store-btn" v-if="goodsDetail.goodsType != 'VIRTUAL_GOODS'" @click="shutMask(4)">
|
||||
加入购物车</view>
|
||||
<view class="to-buy to-store-btn" @click="shutMask(4, 'buy')">立即购买</view>
|
||||
<view class="to-store-car to-store-btn" v-if="startTimer">暂未开始</view>
|
||||
</view>
|
||||
|
|
@ -303,15 +225,8 @@
|
|||
<!-- 规格-模态层弹窗 -->
|
||||
<view class="spec">
|
||||
<!-- 促销弹窗 -->
|
||||
<u-popup
|
||||
v-model="promotionShow"
|
||||
:height="setup.height"
|
||||
:mode="setup.mode"
|
||||
:border-radius="setup.radius"
|
||||
@close="promotionShow = false"
|
||||
:mask-close-able="setup.close"
|
||||
closeable
|
||||
>
|
||||
<u-popup v-model="promotionShow" :height="setup.height" :mode="setup.mode" :border-radius="setup.radius"
|
||||
@close="promotionShow = false" :mask-close-able="setup.close" closeable>
|
||||
<view class="header-title">优惠</view>
|
||||
<view class="cuxiao">
|
||||
<scroll-view class="scroll_mask" :scroll-y="true">
|
||||
|
|
@ -328,31 +243,14 @@
|
|||
</u-popup>
|
||||
|
||||
<!-- 配送地址弹窗 -->
|
||||
<popupAddress
|
||||
@closeAddress="closePopupAddress"
|
||||
@deliveryData="deliveryFun"
|
||||
v-if="goodsDetail.id"
|
||||
:goodsId="goodsDetail.id"
|
||||
:addressFlag="addressFlag"
|
||||
/>
|
||||
<popupAddress @closeAddress="closePopupAddress" @deliveryData="deliveryFun" v-if="goodsDetail.id"
|
||||
:goodsId="goodsDetail.id" :addressFlag="addressFlag" />
|
||||
|
||||
<!-- 商品规格 商品详情，以及默认参与活动的id-->
|
||||
<popupGoods
|
||||
:addr="delivery"
|
||||
ref="popupGoods"
|
||||
@changed="changedGoods"
|
||||
@closeBuy="closePopupBuy"
|
||||
@queryCart="cartCount()"
|
||||
:goodsDetail="goodsDetail"
|
||||
:goodsSpec="goodsSpec"
|
||||
:isGroup="isGroup"
|
||||
:id="productId"
|
||||
v-if="goodsDetail.id"
|
||||
:pointDetail="pointDetail"
|
||||
:wholesaleList="wholesaleList"
|
||||
@handleClickSku="selectSku"
|
||||
:buyMask="buyMask"
|
||||
/>
|
||||
<popupGoods :addr="delivery" ref="popupGoods" @changed="changedGoods" @closeBuy="closePopupBuy"
|
||||
@queryCart="cartCount()" :goodsDetail="goodsDetail" :goodsSpec="goodsSpec" :isGroup="isGroup" :id="productId"
|
||||
v-if="goodsDetail.id" :pointDetail="pointDetail" :wholesaleList="wholesaleList" @handleClickSku="selectSku"
|
||||
:buyMask="buyMask" />
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
|
|
@ -403,7 +301,7 @@ export default {
|
|||
popupGoods,
|
||||
popupAddress,
|
||||
},
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
setup,
|
||||
promotionShow: false, //弹窗开关
|
||||
|
|
@ -446,7 +344,7 @@ export default {
|
|||
enableShare: false,
|
||||
selectedGoods: "", //选择的商品规格昵称
|
||||
isGroup: false, // 是否是拼团活动
|
||||
isSeckill:false, // 是否秒杀活动
|
||||
isSeckill: false, // 是否秒杀活动
|
||||
pointDetail: "", // 是否是积分商品
|
||||
assemble: "", //拼团的sku
|
||||
navbarOnlyBack: {
|
||||
|
|
@ -525,19 +423,19 @@ export default {
|
|||
|
||||
routerVal: "",
|
||||
IMLink: "", // IM地址
|
||||
wholesaleList:[]
|
||||
wholesaleList: []
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
// udesk IM
|
||||
IM() {
|
||||
// udesk IM
|
||||
IM () {
|
||||
return this.IMLink + this.storeDetail.merchantEuid;
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
isGroup(val) {
|
||||
isGroup (val) {
|
||||
if (val) {
|
||||
let timer = setInterval(() => {
|
||||
this.$refs.popupGoods.buyType = "PINTUAN";
|
||||
|
|
@ -548,7 +446,7 @@ export default {
|
|||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
mounted () {
|
||||
const { windowHeight } = uni.getSystemInfoSync();
|
||||
let bottomHeight = 0;
|
||||
let topHeight = 0;
|
||||
|
|
@ -578,7 +476,7 @@ export default {
|
|||
|
||||
this.productRefHeight = windowHeight - bottomHeight + "px";
|
||||
},
|
||||
async onLoad(options) {
|
||||
async onLoad (options) {
|
||||
this.routerVal = options;
|
||||
// #ifdef MP-WEIXIN
|
||||
// 小程序默认分享
|
||||
|
|
@ -588,7 +486,7 @@ export default {
|
|||
});
|
||||
// #endif
|
||||
},
|
||||
async onShow() {
|
||||
async onShow () {
|
||||
this.goodsDetail = {};
|
||||
//如果有参数ids说明事分销短连接，需要获取参数
|
||||
if (this.routerVal.scene) {
|
||||
|
|
@ -604,20 +502,20 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
share() {
|
||||
share () {
|
||||
return `/pages/product/goods?id=${this.routerVal.id}&goodsId=${this.routerVal.goodsId}`;
|
||||
},
|
||||
/**
|
||||
* 导航栏列表栏
|
||||
*/
|
||||
handleNavbarList(val) {
|
||||
handleNavbarList (val) {
|
||||
modelNavigateTo({ url: val });
|
||||
},
|
||||
|
||||
/**
|
||||
* 循环出当前促销是否为空
|
||||
*/
|
||||
emptyPromotion() {
|
||||
emptyPromotion () {
|
||||
if (
|
||||
this.PromotionList == "" ||
|
||||
this.PromotionList == null ||
|
||||
|
|
@ -626,13 +524,13 @@ export default {
|
|||
return true;
|
||||
}
|
||||
},
|
||||
selectSku(idObj) {
|
||||
selectSku (idObj) {
|
||||
this.init(idObj.skuId, idObj.goodsId);
|
||||
},
|
||||
/**
|
||||
* 初始化信息
|
||||
*/
|
||||
async init(id, goodsId, distributionId = "") {
|
||||
async init (id, goodsId, distributionId = "") {
|
||||
this.isGroup = false; //初始化拼团
|
||||
this.productId = id; // skuId
|
||||
// 这里请求获取到页面数据 解析数据
|
||||
|
|
@ -694,16 +592,19 @@ export default {
|
|||
// this.getIMDetailMethods();
|
||||
},
|
||||
|
||||
async getIMDetailMethods() {
|
||||
async getIMDetailMethods () {
|
||||
let res = await getIMDetail();
|
||||
if (res.data.success) {
|
||||
this.IMLink = res.data.result;
|
||||
}
|
||||
},
|
||||
|
||||
linkMsgDetail() {
|
||||
linkMsgDetail () {
|
||||
// lili 基础客服
|
||||
this.$options.filters.talkIm(this.storeDetail.storeId)
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/mine/im/index?userId=${this.goodsDetail.storeId}&goodsid=${this.routerVal.goodsId}&skuid=${this.routerVal.id}`
|
||||
// });
|
||||
|
||||
// udesk 代码
|
||||
// if (this.storeDetail.merchantEuid) {
|
||||
|
|
@ -713,68 +614,68 @@ export default {
|
|||
// }
|
||||
|
||||
|
||||
// 客服 云智服代码
|
||||
// // #ifdef MP-WEIXIN
|
||||
// const params = {
|
||||
// storeName: this.storeDetail.storeName,
|
||||
// goodsName: this.goodsDetail.goodsName,
|
||||
// goodsId: this.goodsDetail.goodsId,
|
||||
// goodsImg: this.goodsDetail.thumbnail,
|
||||
// price: this.goodsDetail.promotionPrice || this.goodsDetail.price,
|
||||
// // originalPrice: this.goodsDetail.original || this.goodsDetail.price,
|
||||
// uuid: storage.getUuid(),
|
||||
// token: storage.getAccessToken(),
|
||||
// sign: this.storeDetail.yzfSign,
|
||||
// mpSign: this.storeDetail.yzfMpSign,
|
||||
// };
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/product/customerservice/index?params=" +
|
||||
// encodeURIComponent(JSON.stringify(params)),
|
||||
// });
|
||||
// // #endif
|
||||
// // #ifndef MP-WEIXIN
|
||||
// const sign = this.storeDetail.yzfSign;
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/tabbar/home/web-view?src=https://yzf.qq.com/xv/web/static/chat/index.html?sign=" +
|
||||
// sign,
|
||||
// });
|
||||
// // #endif
|
||||
// 客服 云智服代码
|
||||
// // #ifdef MP-WEIXIN
|
||||
// const params = {
|
||||
// storeName: this.storeDetail.storeName,
|
||||
// goodsName: this.goodsDetail.goodsName,
|
||||
// goodsId: this.goodsDetail.goodsId,
|
||||
// goodsImg: this.goodsDetail.thumbnail,
|
||||
// price: this.goodsDetail.promotionPrice || this.goodsDetail.price,
|
||||
// // originalPrice: this.goodsDetail.original || this.goodsDetail.price,
|
||||
// uuid: storage.getUuid(),
|
||||
// token: storage.getAccessToken(),
|
||||
// sign: this.storeDetail.yzfSign,
|
||||
// mpSign: this.storeDetail.yzfMpSign,
|
||||
// };
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/product/customerservice/index?params=" +
|
||||
// encodeURIComponent(JSON.stringify(params)),
|
||||
// });
|
||||
// // #endif
|
||||
// // #ifndef MP-WEIXIN
|
||||
// const sign = this.storeDetail.yzfSign;
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/tabbar/home/web-view?src=https://yzf.qq.com/xv/web/static/chat/index.html?sign=" +
|
||||
// sign,
|
||||
// });
|
||||
// // #endif
|
||||
|
||||
},
|
||||
/**选择商品 */
|
||||
changedGoods(val) {
|
||||
changedGoods (val) {
|
||||
this.selectedGoods = val;
|
||||
},
|
||||
|
||||
/** 点击子级地址回调参数*/
|
||||
deliveryFun(val) {
|
||||
deliveryFun (val) {
|
||||
this.delivery = val;
|
||||
},
|
||||
/**
|
||||
* 地址子级关闭回调
|
||||
*/
|
||||
closePopupAddress(val) {
|
||||
closePopupAddress (val) {
|
||||
this.addressFlag = val;
|
||||
// this.maskFlag = false;
|
||||
},
|
||||
/**
|
||||
* 商品规格子级关闭回调
|
||||
*/
|
||||
closePopupBuy(val) {
|
||||
closePopupBuy (val) {
|
||||
this.buyMask = val;
|
||||
// this.maskFlag = false;
|
||||
},
|
||||
|
||||
/** 参与拼团 创建拼团 */
|
||||
toAssembleBuyNow(order) {
|
||||
toAssembleBuyNow (order) {
|
||||
this.shutMask(4, "PINTUAN", order);
|
||||
},
|
||||
/**
|
||||
* 查看购物车
|
||||
*/
|
||||
reluchToCart() {
|
||||
reluchToCart () {
|
||||
let obj = {
|
||||
from: "product",
|
||||
id: this.productId,
|
||||
|
|
@ -788,7 +689,7 @@ export default {
|
|||
/**
|
||||
* 查询购物车总数量
|
||||
*/
|
||||
cartCount() {
|
||||
cartCount () {
|
||||
if (storage.getHasLogin()) {
|
||||
API_trade.getCartNum().then((res) => {
|
||||
this.nums = res.data.result;
|
||||
|
|
@ -799,7 +700,7 @@ export default {
|
|||
/**
|
||||
* 返回
|
||||
*/
|
||||
back() {
|
||||
back () {
|
||||
if (getCurrentPages().length == 1) {
|
||||
uni.switchTab({
|
||||
url: "/pages/tabbar/home/index",
|
||||
|
|
@ -812,7 +713,7 @@ export default {
|
|||
/**
|
||||
* 获取店铺信息
|
||||
*/
|
||||
getStoreBaseInfoFun(id) {
|
||||
getStoreBaseInfoFun (id) {
|
||||
API_store.getStoreBaseInfo(id).then((res) => {
|
||||
if (res.data.success) {
|
||||
this.storeDetail = res.data.result;
|
||||
|
|
@ -823,7 +724,7 @@ export default {
|
|||
/**
|
||||
* 删除收藏店铺
|
||||
*/
|
||||
deleteGoodsCollectionFun(id) {
|
||||
deleteGoodsCollectionFun (id) {
|
||||
API_Members.deleteGoodsCollection(id).then((res) => {
|
||||
if (res.statusCode == 200) {
|
||||
uni.showToast({
|
||||
|
|
@ -838,7 +739,7 @@ export default {
|
|||
/**
|
||||
* 获取商品是否已被收藏
|
||||
*/
|
||||
getGoodsCollectionFun(goodsId) {
|
||||
getGoodsCollectionFun (goodsId) {
|
||||
if (storage.getHasLogin()) {
|
||||
API_Members.getGoodsIsCollect("GOODS", goodsId).then((res) => {
|
||||
this.favorite = res.data.result;
|
||||
|
|
@ -849,7 +750,7 @@ export default {
|
|||
/**
|
||||
* 获取店铺推荐商品列表
|
||||
*/
|
||||
getStoreRecommend() {
|
||||
getStoreRecommend () {
|
||||
getGoodsList({
|
||||
pageNumber: 1,
|
||||
pageSize: 6,
|
||||
|
|
@ -864,7 +765,7 @@ export default {
|
|||
* 获取相似商品列表
|
||||
*
|
||||
*/
|
||||
getOtherLikeGoods() {
|
||||
getOtherLikeGoods () {
|
||||
getGoodsList({
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
|
|
@ -878,7 +779,7 @@ export default {
|
|||
/**
|
||||
* 领取优惠券
|
||||
*/
|
||||
receiveCouponsFun(id) {
|
||||
receiveCouponsFun (id) {
|
||||
API_Members.receiveCoupons(id).then((res) => {
|
||||
uni.showToast({
|
||||
title: res.data.message,
|
||||
|
|
@ -890,7 +791,7 @@ export default {
|
|||
/**
|
||||
* 跳转到店铺页面
|
||||
*/
|
||||
navigateToStore(store_id) {
|
||||
navigateToStore (store_id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/shopPage?id=` + store_id,
|
||||
});
|
||||
|
|
@ -899,14 +800,14 @@ export default {
|
|||
/**
|
||||
* 获取优惠券按钮
|
||||
*/
|
||||
getCoupon(item) {
|
||||
getCoupon (item) {
|
||||
this.receiveCouponsFun(item.id);
|
||||
},
|
||||
|
||||
/**
|
||||
* 规格弹窗开关
|
||||
*/
|
||||
shutMask(flag, buyFlag, type) {
|
||||
shutMask (flag, buyFlag, type) {
|
||||
this.promotionShow = false;
|
||||
this.buyMask = false;
|
||||
this.addressFlag = false;
|
||||
|
|
@ -941,7 +842,7 @@ export default {
|
|||
/**
|
||||
* 收藏
|
||||
*/
|
||||
clickFavorite(id) {
|
||||
clickFavorite (id) {
|
||||
if (this.favorite) {
|
||||
// 取消收藏
|
||||
this.deleteGoodsCollectionFun(id);
|
||||
|
|
@ -961,7 +862,7 @@ export default {
|
|||
/**
|
||||
* 顶部header显示或隐藏
|
||||
*/
|
||||
pageScroll(e) {
|
||||
pageScroll (e) {
|
||||
if (this.scrollFlag) {
|
||||
this.calcSize();
|
||||
}
|
||||
|
|
@ -989,7 +890,7 @@ export default {
|
|||
/**
|
||||
* 计算每个要跳转到的模块高度信息
|
||||
*/
|
||||
calcSize() {
|
||||
calcSize () {
|
||||
let h = 0;
|
||||
let that = this;
|
||||
let arr = [
|
||||
|
|
@ -1034,7 +935,7 @@ export default {
|
|||
/**
|
||||
* 点击顶部跳转到对应位置
|
||||
*/
|
||||
headerTab(id) {
|
||||
headerTab (id) {
|
||||
if (this.scrollFlag) {
|
||||
this.calcSize();
|
||||
}
|
||||
|
|
@ -1048,7 +949,7 @@ export default {
|
|||
/**
|
||||
* 点击分享
|
||||
*/
|
||||
async shareChange() {
|
||||
async shareChange () {
|
||||
this.enableShare = true;
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -331,6 +331,39 @@ export default {
|
|||
// 店铺信息
|
||||
this.getStoreData();
|
||||
},
|
||||
/**
|
||||
* 联系客服
|
||||
*/
|
||||
linkKefuDetail() {
|
||||
// 客服
|
||||
// #ifdef MP-WEIXIN
|
||||
|
||||
const params = {
|
||||
// originalPrice: this.goodsDetail.original || this.goodsDetail.price,
|
||||
uuid: storage.getUuid(),
|
||||
token: storage.getAccessToken(),
|
||||
sign: this.storeInfo.yzfSign,
|
||||
mpSign: this.storeInfo.yzfMpSign,
|
||||
};
|
||||
uni.navigateTo({
|
||||
url:
|
||||
"/pages/mine/im/index"
|
||||
});
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/product/customerservice/index?params=" +
|
||||
// encodeURIComponent(JSON.stringify(params)),
|
||||
// });
|
||||
// // #endif
|
||||
// // #ifndef MP-WEIXIN
|
||||
// const sign = this.storeInfo.yzfSign;
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/tabbar/home/web-view?src=https://yzf.qq.com/xv/web/static/chat/index.html?sign=" +
|
||||
// sign,
|
||||
// });
|
||||
// #endif
|
||||
},
|
||||
|
||||
/** 获取店铺分类 */
|
||||
async getCategoryData() {
|
||||
|
|
|
|||
|
|
@ -35,12 +35,7 @@
|
|||
<!-- uni 中不能使用 vue component 所以用if判断每个组件 -->
|
||||
<div v-for="(item, index) in pageData.list" :key="index">
|
||||
<!-- 搜索栏，如果在楼层装修顶部则会自动浮动，否则不浮动 -->
|
||||
<u-navbar
|
||||
class="navbar"
|
||||
v-if="item.type == 'search'"
|
||||
:is-back="false"
|
||||
:is-fixed="index === 1 ? false : true"
|
||||
>
|
||||
<u-navbar class="navbar" v-if="item.type == 'search'" :is-back="false" :is-fixed="index === 1 ? false : true">
|
||||
<search style="width: 100%" :res="item.options" />
|
||||
<!-- #ifndef H5 -->
|
||||
<!-- 扫码功能 不兼容h5 详情文档: https://uniapp.dcloud.io/api/system/barcode?id=scancode -->
|
||||
|
|
@ -51,22 +46,10 @@
|
|||
</u-navbar>
|
||||
<carousel v-if="item.type == 'carousel'" :res="item.options" />
|
||||
<titleLayout v-if="item.type == 'title'" :res="item.options" />
|
||||
<leftOneRightTwo
|
||||
v-if="item.type == 'leftOneRightTwo'"
|
||||
:res="item.options"
|
||||
/>
|
||||
<leftTwoRightOne
|
||||
v-if="item.type == 'leftTwoRightOne'"
|
||||
:res="item.options"
|
||||
/>
|
||||
<topOneBottomTwo
|
||||
v-if="item.type == 'topOneBottomTwo'"
|
||||
:res="item.options"
|
||||
/>
|
||||
<topTwoBottomOne
|
||||
v-if="item.type == 'topTwoBottomOne'"
|
||||
:res="item.options"
|
||||
/>
|
||||
<leftOneRightTwo v-if="item.type == 'leftOneRightTwo'" :res="item.options" />
|
||||
<leftTwoRightOne v-if="item.type == 'leftTwoRightOne'" :res="item.options" />
|
||||
<topOneBottomTwo v-if="item.type == 'topOneBottomTwo'" :res="item.options" />
|
||||
<topTwoBottomOne v-if="item.type == 'topTwoBottomOne'" :res="item.options" />
|
||||
<flexThree v-if="item.type == 'flexThree'" :res="item.options" />
|
||||
<flexFive v-if="item.type == 'flexFive'" :res="item.options" />
|
||||
<flexFour v-if="item.type == 'flexFour'" :res="item.options" />
|
||||
|
|
@ -115,7 +98,7 @@ import storage from "@/utils/storage.js";
|
|||
// import {receiveCoupons} from "@/api/members"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
config,
|
||||
storage,
|
||||
|
|
@ -123,7 +106,7 @@ export default {
|
|||
showCp:false,
|
||||
pageData: "", //楼层页面数据
|
||||
isIos: "",
|
||||
enableLoad:false, //触底加载 针对于商品模块
|
||||
enableLoad: false, //触底加载 针对于商品模块
|
||||
};
|
||||
},
|
||||
components: {
|
||||
|
|
@ -147,7 +130,7 @@ export default {
|
|||
promotions: tpl_promotions,
|
||||
},
|
||||
|
||||
mounted() {
|
||||
mounted () {
|
||||
this.init();
|
||||
// #ifdef MP-WEIXIN
|
||||
// 小程序默认分享
|
||||
|
|
@ -208,23 +191,23 @@ export default {
|
|||
/**
|
||||
* 实例化首页数据楼层
|
||||
*/
|
||||
init() {
|
||||
init () {
|
||||
this.pageData = "";
|
||||
getFloorData().then((res) => {
|
||||
if (res.data.success) {
|
||||
const result = JSON.parse(res.data.result.pageData)
|
||||
this.pageData = result;
|
||||
if(result.list.length){
|
||||
if (result.list.length) {
|
||||
// 如果最后一个装修模块是商品模块的话 默认启用自动加载
|
||||
result.list[result.list.length-1] ? result.list[result.list.length-1].model == 'goods' ? this.enableLoad = true : '' : ''
|
||||
}
|
||||
result.list[result.list.length - 1] ? result.list[result.list.length - 1].model == 'goods' ? this.enableLoad = true : '' : ''
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 是否有网络链接
|
||||
isConnected(val){
|
||||
val ? this.init() : ''
|
||||
},
|
||||
// 是否有网络链接
|
||||
isConnected (val) {
|
||||
val ? this.init() : ''
|
||||
},
|
||||
|
||||
/**
|
||||
* TODO 扫码功能后续还会后续增加
|
||||
|
|
@ -234,18 +217,18 @@ export default {
|
|||
* 扫描二维码登录
|
||||
* 扫描其他站信息 弹出提示，返回首页。
|
||||
*/
|
||||
seacnCode() {
|
||||
seacnCode () {
|
||||
uni.scanCode({
|
||||
success: function (res) {
|
||||
let path = encodeURIComponent(res.result);
|
||||
|
||||
|
||||
|
||||
if(path!=undefined && path.indexOf("QR_CODE_LOGIN_SESSION")==0){
|
||||
if (path != undefined && path.indexOf("QR_CODE_LOGIN_SESSION") == 0) {
|
||||
console.log(path)
|
||||
//app扫码登录
|
||||
uni.navigateTo({
|
||||
url:"/pages/passport/scannerCodeLoginConfirm?token="+path
|
||||
url: "/pages/passport/scannerCodeLoginConfirm?token=" + path
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
|
@ -279,7 +262,7 @@ export default {
|
|||
/**
|
||||
* 提示获取权限
|
||||
*/
|
||||
tipsGetSettings() {
|
||||
tipsGetSettings () {
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "您已经关闭相机权限,去设置",
|
||||
|
|
@ -299,7 +282,7 @@ export default {
|
|||
* 唤醒客户端扫码
|
||||
* 没权限去申请权限，有权限获取扫码功能
|
||||
*/
|
||||
async scan() {
|
||||
async scan () {
|
||||
// #ifdef APP-PLUS
|
||||
this.isIos = plus.os.name == "iOS";
|
||||
// 判断是否是Ios
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
<u-row text-align="center" gutter="16" class="point">
|
||||
<u-col text-align="center" span="4" @click="navigateTo('/pages/mine/deposit/operation')">
|
||||
<view>预存款</view>
|
||||
<view class="money">{{ walletNum | unitPrice}}</view>
|
||||
<view class="money">{{ walletNum | unitPrice }}</view>
|
||||
</u-col>
|
||||
|
||||
<u-col text-align="center" span="4" @click="navigateTo('/pages/cart/coupon/myCoupon')">
|
||||
|
|
@ -36,7 +36,6 @@
|
|||
</u-row>
|
||||
<!-- 我的订单，代付款 -->
|
||||
<view class="order">
|
||||
|
||||
<view class="order-item" @click="navigateTo('/pages/order/myOrder?status=1')">
|
||||
<div class="bag bag2">
|
||||
<u-icon name="bag-fill" size="35" color="#fff"></u-icon>
|
||||
|
|
@ -61,12 +60,12 @@
|
|||
</div>
|
||||
<view>售后</view>
|
||||
</view>
|
||||
<view class="order-item" @click="navigateTo('/pages/order/myOrder?status=0')">
|
||||
<div class="bag bag1">
|
||||
<u-icon name="order" size="35" color="#fff"></u-icon>
|
||||
</div>
|
||||
<view>我的订单</view>
|
||||
</view>
|
||||
<view class="order-item" @click="navigateTo('/pages/order/myOrder?status=0')">
|
||||
<div class="bag bag1">
|
||||
<u-icon name="order" size="35" color="#fff"></u-icon>
|
||||
</div>
|
||||
<view>我的订单</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<!-- 常用工具 -->
|
||||
|
|
@ -94,7 +93,7 @@ export default {
|
|||
walletNum: "",
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
onLoad() { },
|
||||
onShow() {
|
||||
this.userInfo = this.$options.filters.isLogin();
|
||||
if (this.$options.filters.isLogin("auth")) {
|
||||
|
|
@ -116,7 +115,7 @@ export default {
|
|||
},
|
||||
// #endif
|
||||
|
||||
mounted() {},
|
||||
mounted() { },
|
||||
methods: {
|
||||
/**
|
||||
* 统一跳转接口,拦截未登录路由
|
||||
|
|
@ -154,6 +153,7 @@ html,
|
|||
body {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.money {
|
||||
overflow: hidden;
|
||||
|
||||
|
|
@ -175,12 +175,14 @@ body {
|
|||
color: #ffffff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.head-1 {
|
||||
text-align: center;
|
||||
width: 152rpx;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 152rpx;
|
||||
height: 144rpx;
|
||||
|
|
@ -188,6 +190,7 @@ body {
|
|||
margin-bottom: 30rpx;
|
||||
border: 3px solid #fff;
|
||||
}
|
||||
|
||||
.edti-head {
|
||||
position: absolute;
|
||||
width: 40rpx;
|
||||
|
|
@ -196,23 +199,27 @@ body {
|
|||
background-color: rgba(255, 255, 255, 0.3);
|
||||
top: 100rpx;
|
||||
right: 0;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-2 {
|
||||
flex: 1;
|
||||
margin-left: 30rpx;
|
||||
margin-top: 100rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
/deep/ .u-icon,
|
||||
.u-icon {
|
||||
margin-top: 106rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.pointBox {
|
||||
width: 94%;
|
||||
margin: 0 3%;
|
||||
|
|
@ -220,6 +227,7 @@ body {
|
|||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 24rpx 0 rgba($color: #f6f6f6, $alpha: 1);
|
||||
}
|
||||
|
||||
.point {
|
||||
text-align: center;
|
||||
height: 160rpx;
|
||||
|
|
@ -227,12 +235,14 @@ body {
|
|||
font-size: $font-sm;
|
||||
// #ifdef MP-WEIXIN
|
||||
padding: 24rpx;
|
||||
|
||||
// #endif
|
||||
.u-col {
|
||||
view {
|
||||
color: $u-main-color;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
view:last-child {
|
||||
margin-top: 8rpx;
|
||||
color: $main-color;
|
||||
|
|
@ -240,6 +250,7 @@ body {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order {
|
||||
height: 140rpx;
|
||||
text-align: center;
|
||||
|
|
@ -249,10 +260,12 @@ body {
|
|||
align-items: center;
|
||||
padding: 0 3%;
|
||||
color: #999;
|
||||
|
||||
.order-item {
|
||||
position: relative;
|
||||
line-height: 2em;
|
||||
width: 96rpx;
|
||||
|
||||
:first-child {
|
||||
font-size: 48rpx;
|
||||
margin-bottom: 10rpx;
|
||||
|
|
@ -264,6 +277,7 @@ body {
|
|||
.box {
|
||||
transform: translateY(-30rpx);
|
||||
}
|
||||
|
||||
.user-name {
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,10 +19,10 @@
|
|||
<image src="/static/mine/feedback.png" mode=""></image>
|
||||
<view>我的评价</view>
|
||||
</view>
|
||||
<view class="interact-item" @click="linkMsgDetail()">
|
||||
<!-- <view class="interact-item" @click="linkMsgDetail()">
|
||||
<image src="/static/mine/mycommit.png" mode=""></image>
|
||||
<view>我的消息</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
|
||||
<view class="interact-item" @click="navigateTo('/pages/mine/myCollect')">
|
||||
|
|
@ -126,7 +126,7 @@ export default {
|
|||
|
||||
linkMsgDetail(){
|
||||
uni.navigateTo({
|
||||
url: `/pages/tabbar/home/web-view?IM=0`,
|
||||
url: `/pages/mine/im/list`,
|
||||
});
|
||||
},
|
||||
|
||||
|
|
|
|||
161
utils/filters.js
161
utils/filters.js
|
|
@ -85,6 +85,62 @@ export function unixToDate(unix, format) {
|
|||
return _format;
|
||||
}
|
||||
|
||||
/**
|
||||
* 人性化显示时间
|
||||
*
|
||||
* @param {Object} datetime
|
||||
*/
|
||||
export function beautifyTime(datetime = "") {
|
||||
if (datetime == null || datetime == undefined || !datetime) {
|
||||
return "";
|
||||
}
|
||||
|
||||
datetime = datetime.replace(/-/g, "/");
|
||||
|
||||
let time = new Date();
|
||||
let outTime = new Date(datetime);
|
||||
if (/^[1-9]\d*$/.test(datetime)) {
|
||||
outTime = new Date(parseInt(datetime) * 1000);
|
||||
}
|
||||
|
||||
if (time.getTime() < outTime.getTime()) {
|
||||
return parseTime(outTime, "{y}/{m}/{d}");
|
||||
}
|
||||
|
||||
if (time.getFullYear() != outTime.getFullYear()) {
|
||||
return parseTime(outTime, "{y}/{m}/{d}");
|
||||
}
|
||||
|
||||
if (time.getMonth() != outTime.getMonth()) {
|
||||
return parseTime(outTime, "{m}/{d}");
|
||||
}
|
||||
|
||||
if (time.getDate() != outTime.getDate()) {
|
||||
let day = outTime.getDate() - time.getDate();
|
||||
if (day == -1) {
|
||||
return parseTime(outTime, "昨天 {h}:{i}");
|
||||
}
|
||||
|
||||
if (day == -2) {
|
||||
return parseTime(outTime, "前天 {h}:{i}");
|
||||
}
|
||||
|
||||
return parseTime(outTime, "{m}-{d}");
|
||||
}
|
||||
|
||||
if (time.getHours() != outTime.getHours()) {
|
||||
return parseTime(outTime, "{h}:{i}");
|
||||
}
|
||||
|
||||
let minutes = outTime.getMinutes() - time.getMinutes();
|
||||
if (minutes == 0) {
|
||||
return "刚刚";
|
||||
}
|
||||
|
||||
minutes = Math.abs(minutes);
|
||||
return `${minutes}分钟前`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 13888888888 -> 138****8888
|
||||
* @param mobile
|
||||
|
|
@ -98,6 +154,111 @@ export function secrecyMobile(mobile) {
|
|||
return mobile.replace(/(\d{3})(\d{4})(\d{4})/, "$1****$3");
|
||||
}
|
||||
|
||||
/**
|
||||
* 人性化时间显示
|
||||
*
|
||||
* @param {Object} datetime
|
||||
*/
|
||||
export function formatTime(datetime) {
|
||||
if (datetime == null) return "";
|
||||
|
||||
datetime = datetime.replace(/-/g, "/");
|
||||
|
||||
let time = new Date();
|
||||
let outTime = new Date(datetime);
|
||||
if (/^[1-9]\d*$/.test(datetime)) {
|
||||
outTime = new Date(parseInt(datetime) * 1000);
|
||||
}
|
||||
|
||||
if (
|
||||
time.getTime() < outTime.getTime() ||
|
||||
time.getFullYear() != outTime.getFullYear()
|
||||
) {
|
||||
return parseTime(outTime, "{y}-{m}-{d} {h}:{i}");
|
||||
}
|
||||
|
||||
if (time.getMonth() != outTime.getMonth()) {
|
||||
return parseTime(outTime, "{m}-{d} {h}:{i}");
|
||||
}
|
||||
|
||||
if (time.getDate() != outTime.getDate()) {
|
||||
let day = outTime.getDate() - time.getDate();
|
||||
if (day == -1) {
|
||||
return parseTime(outTime, "昨天 {h}:{i}");
|
||||
}
|
||||
|
||||
if (day == -2) {
|
||||
return parseTime(outTime, "前天 {h}:{i}");
|
||||
}
|
||||
|
||||
return parseTime(outTime, "{m}-{d} {h}:{i}");
|
||||
}
|
||||
|
||||
if (time.getHours() != outTime.getHours()) {
|
||||
return parseTime(outTime, "{h}:{i}");
|
||||
}
|
||||
|
||||
let minutes = outTime.getMinutes() - time.getMinutes();
|
||||
if (minutes == 0) {
|
||||
return "刚刚";
|
||||
}
|
||||
|
||||
minutes = Math.abs(minutes);
|
||||
return `${minutes}分钟前`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 时间格式化方法
|
||||
*
|
||||
* @param {(Object|string|number)} time
|
||||
* @param {String} cFormat
|
||||
* @returns {String | null}
|
||||
*/
|
||||
export function parseTime(time, cFormat) {
|
||||
if (arguments.length === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
let date;
|
||||
const format = cFormat || "{y}-{m}-{d} {h}:{i}:{s}";
|
||||
|
||||
if (typeof time === "object") {
|
||||
date = time;
|
||||
} else {
|
||||
if (typeof time === "string" && /^[0-9]+$/.test(time)) {
|
||||
time = parseInt(time);
|
||||
}
|
||||
if (typeof time === "number" && time.toString().length === 10) {
|
||||
time = time * 1000;
|
||||
console.log("时间判断为number");
|
||||
}
|
||||
|
||||
date = new Date(time.replace(/-/g, "/"));
|
||||
}
|
||||
|
||||
const formatObj = {
|
||||
y: date.getFullYear(),
|
||||
m: date.getMonth() + 1,
|
||||
d: date.getDate(),
|
||||
h: date.getHours(),
|
||||
i: date.getMinutes(),
|
||||
s: date.getSeconds(),
|
||||
a: date.getDay(),
|
||||
};
|
||||
|
||||
const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => {
|
||||
const value = formatObj[key];
|
||||
// Note: getDay() returns 0 on Sunday
|
||||
if (key === "a") {
|
||||
return ["日", "一", "二", "三", "四", "五", "六"][value];
|
||||
}
|
||||
|
||||
return value.toString().padStart(2, "0");
|
||||
});
|
||||
|
||||
return time_str;
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除逗号
|
||||
*
|
||||
|
|
|
|||
|
|
@ -0,0 +1,86 @@
|
|||
import store from '@/store/index'
|
||||
import config from '@/config/config.js'
|
||||
import storage from './storage';
|
||||
export default class SocketService {
|
||||
/**
|
||||
* 单例
|
||||
*/
|
||||
static instance = null;
|
||||
static get Instance() {
|
||||
if (!this.instance) {
|
||||
this.instance = new SocketService();
|
||||
}
|
||||
return this.instance;
|
||||
}
|
||||
|
||||
// 和服务端连接的socket对象
|
||||
ws = null;
|
||||
|
||||
// 存储回调函数
|
||||
callBackMapping = {};
|
||||
|
||||
// 标识是否连接成功
|
||||
connected = false;
|
||||
|
||||
// 记录重试的次数
|
||||
sendRetryCount = 0;
|
||||
|
||||
// 重新连接尝试的次数
|
||||
connectRetryCount = 0;
|
||||
|
||||
// 定义连接服务器的方法
|
||||
connect() {
|
||||
// 连接服务器
|
||||
if (!window.WebSocket) {
|
||||
return console.log("您的浏览器不支持WebSocket");
|
||||
}
|
||||
this.ws = new WebSocket(config.baseWsUrl+'/'+storage.getAccessToken());
|
||||
// 连接成功的事件
|
||||
this.ws.onopen = () => {
|
||||
console.log("连接服务端成功");
|
||||
this.connected = true;
|
||||
// 重置重新连接的次数
|
||||
this.connectRetryCount = 0;
|
||||
};
|
||||
// 1.连接服务端失败
|
||||
// 2.当连接成功之后, 服务器关闭的情况(连接失败重连)
|
||||
this.ws.onclose = () => {
|
||||
console.log("连接服务端失败");
|
||||
this.connected = false;
|
||||
this.connectRetryCount++;
|
||||
setTimeout(() => {
|
||||
this.connect();
|
||||
}, 500 * this.connectRetryCount);
|
||||
};
|
||||
// 得到服务端发送过来的数据
|
||||
this.ws.onmessage = (msg) => {
|
||||
// console.log(msg.data)
|
||||
this.registerCallBack(msg.data);
|
||||
};
|
||||
}
|
||||
// 回调函数的注册
|
||||
registerCallBack(callBack) {
|
||||
// console.log("回调函数的注册", callBack);
|
||||
this.callBackMapping = callBack;
|
||||
}
|
||||
|
||||
// 取消某一个回调函数
|
||||
unRegisterCallBack(callBack) {
|
||||
console.log("取消某一个回调函数", callBack);
|
||||
this.callBackMapping = null;
|
||||
}
|
||||
|
||||
// 发送数据的方法
|
||||
send(data) {
|
||||
// 判断此时此刻有没有连接成功
|
||||
if (this.connected) {
|
||||
this.sendRetryCount = 0;
|
||||
this.ws.send(data);
|
||||
} else {
|
||||
this.sendRetryCount++;
|
||||
setTimeout(() => {
|
||||
this.send(data);
|
||||
}, this.sendRetryCount * 500);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -60,6 +60,12 @@ export default {
|
|||
getUserInfo() {
|
||||
return uni.getStorageSync(USER_INFO);
|
||||
},
|
||||
setTalkToUser(val){
|
||||
uni.setStorageSync("TALK_TO_USER", val);
|
||||
},
|
||||
getTalkToUser(){
|
||||
return uni.getStorageSync("TALK_TO_USER");
|
||||
},
|
||||
// 写入uuid
|
||||
setUuid(val) {
|
||||
uni.setStorageSync(UUID, val);
|
||||
|
|
@ -121,4 +127,11 @@ export default {
|
|||
removeAfterSaleData() {
|
||||
uni.removeStorageSync(AFTERSALE_DATA);
|
||||
},
|
||||
// 是否发送商品连接记录
|
||||
setImGoodsLink(val) {
|
||||
uni.setStorageSync('imGoodId', val);
|
||||
},
|
||||
getImGoodsLink() {
|
||||
return uni.getStorageSync('imGoodId');
|
||||
},
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue