Compare commits
55 Commits
refactor-u
...
dev/2.0
| Author | SHA1 | Date | |
|---|---|---|---|
| e263a616f6 | |||
| ed5181b382 | |||
| 95375d5476 | |||
| b34003e2c0 | |||
| 3a455bd644 | |||
| 8103f4c897 | |||
| 0066a46037 | |||
| 0b62de8c6b | |||
| 9097658782 | |||
| ca74d4f8e5 | |||
| d9c9599cb2 | |||
| 142a97d65c | |||
| b945583857 | |||
| 88debacf8c | |||
| 9d12b02463 | |||
| ee6c777fb1 | |||
| 5503758854 | |||
| 8d84306747 | |||
| 23e81114e9 | |||
| 08583aa8aa | |||
| 5e536afeae | |||
| c45f3e69da | |||
| 80428e625f | |||
| a06ee95482 | |||
| b4aed459c5 | |||
| aa03abf651 | |||
| af23505a74 | |||
| 3898518ad0 | |||
| f0d3d1986f | |||
| 2750d8012f | |||
| 89fbfcaca6 | |||
| 80c172ed77 | |||
| a0ddcd673d | |||
| c50fab3d3a | |||
| 578d914e9b | |||
| 1b194bf3e1 | |||
| b685a91598 | |||
| 7da168e1b2 | |||
| 179a9089b7 | |||
| 57a0bb9b5a | |||
| 4cfbfa7d8f | |||
| eb189ae9f7 | |||
| d489f352db | |||
| 7dbf455341 | |||
| 2416eab34f | |||
| c4f2cea1a9 | |||
| 227ab42e5a | |||
| 4cf19e417f | |||
| 1854a85394 | |||
| 97f6971bd0 | |||
| 526c813d8d | |||
| 29280f6f57 | |||
| 1c2fee28ec | |||
| 5b9114aeac | |||
| 2dfb2e0316 |
1
.gitignore
vendored
1
.gitignore
vendored
@@ -2,3 +2,4 @@
|
||||
/.hbuilderx
|
||||
/.idea
|
||||
/node_modules
|
||||
/iconfont-preview.html
|
||||
|
||||
18
App.vue
18
App.vue
@@ -40,7 +40,7 @@
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
if (uni.getSystemInfoSync().platform == 'ios') {
|
||||
if (uni.getDeviceInfo().platform == 'ios') {
|
||||
uni.setStorageSync('initUrl', location.href);
|
||||
}
|
||||
// #endif
|
||||
@@ -99,6 +99,11 @@
|
||||
this.$store.commit('setServicerConfig', uni.getStorageSync('servicerConfig'));
|
||||
}
|
||||
|
||||
// 企业微信配置
|
||||
if (uni.getStorageSync('wxworkConfig')) {
|
||||
this.$store.commit('setWxworkConfig', uni.getStorageSync('wxworkConfig'));
|
||||
}
|
||||
|
||||
// 版权信息
|
||||
if (uni.getStorageSync('copyright')) {
|
||||
this.$store.commit('setCopyright', uni.getStorageSync('copyright'));
|
||||
@@ -146,7 +151,6 @@
|
||||
onShow: function(options) {
|
||||
// #ifdef MP
|
||||
// 自动授权登录
|
||||
this.getAuthInfo();
|
||||
if (this.$store.state.token) {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/member/info',
|
||||
@@ -156,6 +160,8 @@
|
||||
}
|
||||
}
|
||||
});
|
||||
}else{
|
||||
this.getAuthInfo();
|
||||
}
|
||||
// #endif
|
||||
|
||||
@@ -172,8 +178,7 @@
|
||||
// #ifdef H5
|
||||
if (this.$util.isWeiXin()) {
|
||||
this.$util.getUrlCode(urlParams => {
|
||||
if (urlParams.source_member) uni.setStorageSync('source_member', urlParams
|
||||
.source_member);
|
||||
if (urlParams.source_member) uni.setStorageSync('source_member', urlParams.source_member);
|
||||
|
||||
if (urlParams.code == undefined) {
|
||||
this.$api.sendRequest({
|
||||
@@ -199,8 +204,7 @@
|
||||
let data = {};
|
||||
if (res.data.openid) data.wx_openid = res.data.openid;
|
||||
if (res.data.unionid) data.wx_unionid = res.data.unionid;
|
||||
if (res.data.userinfo) Object.assign(data, res.data
|
||||
.userinfo);
|
||||
if (res.data.userinfo) Object.assign(data, res.data.userinfo);
|
||||
this.authLogin(data);
|
||||
}
|
||||
}
|
||||
@@ -296,7 +300,7 @@
|
||||
this.shareConfig();
|
||||
}
|
||||
},
|
||||
// 代表在wacth里声明了firstName这个方法之后立即先去执行handler方法
|
||||
// 代表在watch里声明了firstName这个方法之后立即先去执行handler方法
|
||||
immediate: true
|
||||
}
|
||||
}
|
||||
|
||||
@@ -194,6 +194,11 @@ image {
|
||||
color: #202021;
|
||||
font-size: $font-size-toolbar;
|
||||
}
|
||||
.store-close-desc{
|
||||
color: red;
|
||||
font-size: $font-size-tag;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
.address {
|
||||
color: #5f6067;
|
||||
font-size: $font-size-tag;
|
||||
@@ -232,3 +237,69 @@ image {
|
||||
.page-bottom {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.chain-stores{
|
||||
.chain-store-popup{
|
||||
background-color: #fff;
|
||||
border-top-left-radius: 24rpx;
|
||||
border-top-right-radius: 24rpx;
|
||||
overflow: hidden;
|
||||
.title{
|
||||
font-size: 36rpx;
|
||||
line-height: 104rpx;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
.body{
|
||||
padding: 20rpx 30rpx;
|
||||
background-color: #F4F4F4;
|
||||
padding-bottom: calc(20rpx + constant(safe-area-inset-bottom)) !important;
|
||||
padding-bottom: calc(20rpx + env(safe-area-inset-bottom)) !important;
|
||||
.center{
|
||||
background-color: #fff;
|
||||
box-shadow: 4rpx 4rpx 12rpx 4rpx rgba(0,0,0,0.02);
|
||||
border-radius: 24rpx;
|
||||
padding-top: 60rpx;
|
||||
padding-bottom: 23rpx;
|
||||
.image{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.text-top{
|
||||
margin-top: 44rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
line-height: 42rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.text-bottom{
|
||||
margin-top: 20rpx;
|
||||
padding: 0 57rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
}
|
||||
.footer{
|
||||
display: flex;
|
||||
margin-top: 20rpx;
|
||||
padding: 0 24rpx;
|
||||
button{
|
||||
margin: 0 !important;
|
||||
box-sizing: border-box;
|
||||
height: 84rpx;
|
||||
line-height: 84rpx;
|
||||
border-radius: 62rpx;
|
||||
font-size: 30rpx;
|
||||
flex:1;
|
||||
}
|
||||
button.btn-right{
|
||||
margin-left: 20rpx !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -683,6 +683,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
.item-close-desc{
|
||||
font-size: $font-size-tag;
|
||||
color: red;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.item-time {
|
||||
font-size: $font-size-activity-tag;
|
||||
color: $color-tip;
|
||||
@@ -856,6 +862,9 @@
|
||||
* {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
img,image{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.goods-details.active {
|
||||
min-height: 150rpx;
|
||||
@@ -1164,6 +1173,9 @@
|
||||
|
||||
&.store-wrap {
|
||||
height: auto;
|
||||
.label{
|
||||
line-height: 34rpx;
|
||||
}
|
||||
.list-wrap {
|
||||
padding: 10rpx 0 16rpx;
|
||||
width: 80%;
|
||||
@@ -1186,6 +1198,12 @@
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
}
|
||||
.close-desc{
|
||||
color:red;
|
||||
font-size: $font-size-tag;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
.other-wrap {
|
||||
display: flex;
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -7,8 +7,8 @@
|
||||
|
||||
$margin-both: 24rpx;
|
||||
|
||||
input,
|
||||
view {
|
||||
/deep/ input,
|
||||
/deep/ view {
|
||||
font-size: $font-size-tag;
|
||||
}
|
||||
|
||||
@@ -276,7 +276,7 @@ view {
|
||||
.goods-wrap {
|
||||
display: flex;
|
||||
position: relative;
|
||||
padding: 0rpx 0 10rpx 0;
|
||||
padding: 30rpx 0;
|
||||
|
||||
.goods-img {
|
||||
width: 180rpx;
|
||||
@@ -883,6 +883,9 @@ view {
|
||||
view {
|
||||
font-size: $font-size-tag;
|
||||
}
|
||||
.close-desc{
|
||||
color:red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1066,6 +1069,10 @@ view {
|
||||
}
|
||||
}
|
||||
|
||||
.empty-local{
|
||||
color: #ff443f;
|
||||
}
|
||||
|
||||
// 配送方式
|
||||
.delivery-mode {
|
||||
margin: 0 24rpx;
|
||||
@@ -1213,6 +1220,9 @@ view {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.store-detail{
|
||||
.close-desc{
|
||||
color:red;
|
||||
}
|
||||
.address{
|
||||
color: $color-sub;
|
||||
width: 100%;
|
||||
|
||||
434
common/js/ai-service.js
Normal file
434
common/js/ai-service.js
Normal file
@@ -0,0 +1,434 @@
|
||||
import Config from './config.js'
|
||||
import http from './http.js'
|
||||
import store from '@/store/index.js'
|
||||
|
||||
let currentConversationId = null;
|
||||
const CONVERSATION_KEY = 'ai_conversation_id';
|
||||
|
||||
// 初始化时从本地读取会话ID
|
||||
try {
|
||||
const saved = uni.getStorageSync(CONVERSATION_KEY);
|
||||
if (saved) {
|
||||
currentConversationId = saved;
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn('读取会话ID失败:', e);
|
||||
}
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 发送普通消息(blocking 模式)
|
||||
*/
|
||||
async sendMessage(message, options = {}) {
|
||||
try {
|
||||
const aiConfig = store.getters.globalAIKefuConfig;
|
||||
const params = {
|
||||
url: '/api/kefu/chat',
|
||||
data: {
|
||||
user_id: store.state.memberInfo?.id || 'anonymous',
|
||||
stream: false,
|
||||
inputs: {},
|
||||
query: message,
|
||||
response_mode: 'blocking', // 强制 blocking
|
||||
user: store.state.memberInfo?.id || 'anonymous',
|
||||
conversation_id: this.getConversationId() || ''
|
||||
},
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
};
|
||||
|
||||
console.log('Sending blocking request to:', params.url);
|
||||
console.log('Request data:', params.data);
|
||||
|
||||
const response = await http.sendRequest({
|
||||
...params,
|
||||
async: false
|
||||
});
|
||||
|
||||
const result = this.handleResponse(response);
|
||||
if (result.conversationId) {
|
||||
this.setConversationId(result.conversationId);
|
||||
}
|
||||
return result;
|
||||
} catch (error) {
|
||||
console.error('Dify API请求失败:', error);
|
||||
throw new Error('AI服务暂时不可用,请稍后重试');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 流式消息入口(自动适配平台)
|
||||
*/
|
||||
async sendStreamMessage(message, onChunk, onComplete) {
|
||||
// #ifdef MP-WEIXIN
|
||||
// 微信小程序:降级为普通请求 + 前端打字模拟
|
||||
try {
|
||||
const result = await this.sendMessage(message);
|
||||
const content = result.content || '';
|
||||
const conversationId = result.conversationId || '';
|
||||
|
||||
// 保存会话ID(确保连续对话)
|
||||
if (conversationId) {
|
||||
this.setConversationId(conversationId);
|
||||
}
|
||||
|
||||
// 模拟打字效果
|
||||
let index = 0;
|
||||
const chunkSize = 2; // 每次显示2个字符
|
||||
return new Promise((resolve) => {
|
||||
const timer = setInterval(() => {
|
||||
if (index < content.length) {
|
||||
const chunk = content.substring(index, index + chunkSize);
|
||||
index += chunkSize;
|
||||
if (onChunk) onChunk(chunk);
|
||||
} else {
|
||||
clearInterval(timer);
|
||||
if (onComplete) {
|
||||
onComplete({
|
||||
content: content,
|
||||
conversation_id: conversationId
|
||||
});
|
||||
}
|
||||
resolve({ content, conversation_id: conversationId });
|
||||
}
|
||||
}, 80); // 打字速度:80ms/次
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('小程序流式消息降级失败:', error);
|
||||
if (onComplete) {
|
||||
onComplete({ error: error.message || '发送失败' });
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
// H5:使用真实流式(EventSource / Fetch)
|
||||
return this.sendHttpStream(message, onChunk, onComplete);
|
||||
// #endif
|
||||
},
|
||||
|
||||
/**
|
||||
* HTTP 流式请求(仅 H5 使用)
|
||||
*/
|
||||
async sendHttpStream(message, onChunk, onComplete) {
|
||||
// #ifdef H5
|
||||
try {
|
||||
const url = Config.baseUrl + `/api/kefu/chat`;
|
||||
const response = await fetch(url, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Accept': 'text/event-stream',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
uniacid: store.state.uniacid || '1',
|
||||
inputs: {},
|
||||
query: message,
|
||||
response_mode: 'streaming',
|
||||
user_id: store.state.memberInfo?.id || 'anonymous',
|
||||
conversation_id: this.getConversationId() || ''
|
||||
})
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP ${response.status}`);
|
||||
}
|
||||
if (!response.body) {
|
||||
throw new Error('响应体不可用');
|
||||
}
|
||||
|
||||
const reader = response.body.getReader();
|
||||
const decoder = new TextDecoder('utf-8');
|
||||
let buffer = '';
|
||||
let content = '';
|
||||
let conversationId = '';
|
||||
|
||||
function processBuffer(buf, callback) {
|
||||
const lines = buf.split('\n');
|
||||
buf = lines.pop() || '';
|
||||
for (const line of lines) {
|
||||
const trimmed = line.trim();
|
||||
if (trimmed.startsWith('data:')) {
|
||||
const jsonStr = trimmed.slice(5).trim();
|
||||
if (jsonStr) {
|
||||
try {
|
||||
const data = JSON.parse(jsonStr);
|
||||
if (data.event === 'message') {
|
||||
const text = data.answer || data.text || '';
|
||||
content += text;
|
||||
callback(text);
|
||||
}
|
||||
if (data.conversation_id) {
|
||||
conversationId = data.conversation_id;
|
||||
}
|
||||
if (data.event === 'message_end') {
|
||||
// 可选:提前完成
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn('解析流数据失败:', e);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return buf;
|
||||
}
|
||||
|
||||
while (true) {
|
||||
const { done, value } = await reader.read();
|
||||
if (done) break;
|
||||
buffer += decoder.decode(value, { stream: true });
|
||||
buffer = processBuffer(buffer, (chunk) => {
|
||||
if (onChunk) onChunk(chunk);
|
||||
});
|
||||
}
|
||||
|
||||
if (onComplete) {
|
||||
onComplete({
|
||||
content,
|
||||
conversation_id: conversationId
|
||||
});
|
||||
}
|
||||
return { content, conversation_id: conversationId };
|
||||
} catch (error) {
|
||||
console.error('H5 流式请求失败:', error);
|
||||
throw error;
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
// 理论上不会执行到这里,但防止 fallback
|
||||
return this.sendStreamMessage(message, onChunk, onComplete);
|
||||
// #endif
|
||||
},
|
||||
|
||||
/**
|
||||
* 处理API响应(统一格式)
|
||||
*/
|
||||
handleResponse(response) {
|
||||
if (response.code === 0 || response.success) {
|
||||
return {
|
||||
success: true,
|
||||
content: response.data?.answer || response.data?.content || response.data?.reply || response.data,
|
||||
conversationId: response.data?.conversation_id,
|
||||
messageId: response.data?.message_id
|
||||
};
|
||||
} else {
|
||||
throw new Error(response.message || 'AI服务返回错误');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取当前会话ID
|
||||
*/
|
||||
getConversationId() {
|
||||
return currentConversationId;
|
||||
},
|
||||
|
||||
/**
|
||||
* 设置并持久化会话ID
|
||||
*/
|
||||
setConversationId(id) {
|
||||
if (id && id !== currentConversationId) {
|
||||
currentConversationId = id;
|
||||
try {
|
||||
uni.setStorageSync(CONVERSATION_KEY, id);
|
||||
} catch (e) {
|
||||
console.error('保存会话ID失败:', e);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 清除会话ID
|
||||
*/
|
||||
clearConversationId() {
|
||||
currentConversationId = null;
|
||||
try {
|
||||
uni.removeStorageSync(CONVERSATION_KEY);
|
||||
} catch (e) {
|
||||
console.error('清除会话ID失败:', e);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生成新会话(如需)
|
||||
*/
|
||||
async generateConversationId() {
|
||||
const params = {
|
||||
url: '/api/kefu/createConversation',
|
||||
data: {
|
||||
uniacid: store.state.uniacid,
|
||||
user_id: store.state.memberInfo?.id || 'anonymous',
|
||||
member_id: store.state.memberInfo?.id || '',
|
||||
},
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
};
|
||||
const response = await http.sendRequest({
|
||||
...params,
|
||||
async: false
|
||||
});
|
||||
return this.handleResponse(response);
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取服务状态
|
||||
*/
|
||||
async getServiceStatus() {
|
||||
try {
|
||||
const response = await http.sendRequest({
|
||||
url: '/api/kefu/health',
|
||||
async: false,
|
||||
data: {}
|
||||
});
|
||||
const available = [response?.data?.status, response?.data?.components?.ai_service_config?.status]
|
||||
.filter(item => item === 'healthy').length > 0;
|
||||
return {
|
||||
available,
|
||||
reason: available ? '服务正常' : '服务异常'
|
||||
};
|
||||
} catch (error) {
|
||||
return {
|
||||
available: false,
|
||||
reason: '服务检查失败'
|
||||
};
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 清除会话历史(调用后端接口)
|
||||
*/
|
||||
async clearConversation(conversationId) {
|
||||
try {
|
||||
const response = await http.sendRequest({
|
||||
url: '/api/kefu/clear-conversation',
|
||||
data: { conversation_id: conversationId },
|
||||
async: false
|
||||
});
|
||||
return response.success;
|
||||
} catch (error) {
|
||||
console.error('清除会话失败:', error);
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取会话历史
|
||||
*/
|
||||
async getConversationHistory(params = {}) {
|
||||
try {
|
||||
if (!params.conversation_id) {
|
||||
throw new Error('会话ID(conversation_id)是必填参数');
|
||||
}
|
||||
const requestData = {
|
||||
uniacid: params.uniacid || store.state.uniacid || '1',
|
||||
conversation_id: params.conversation_id,
|
||||
user_id: params.user_id || store.state.memberInfo?.id || 'anonymous',
|
||||
limit: params.limit || 20,
|
||||
offset: params.offset || 0,
|
||||
member_id: params.member_id || store.state.memberInfo?.id || '',
|
||||
token: params.token || ''
|
||||
};
|
||||
const response = await http.sendRequest({
|
||||
url: '/api/kefu/getHistory',
|
||||
data: requestData,
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
async: false
|
||||
});
|
||||
if (response.code === 0 || response.success) {
|
||||
return {
|
||||
success: true,
|
||||
data: response.data,
|
||||
messages: response.data?.messages || [],
|
||||
total: response.data?.total || 0,
|
||||
page_info: response.data?.page_info || { limit: 20, offset: 0 }
|
||||
};
|
||||
} else {
|
||||
throw new Error(response.message || '获取会话历史失败');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取会话历史失败:', error);
|
||||
throw new Error(error.message || '获取会话历史时发生错误,请稍后重试');
|
||||
}
|
||||
},
|
||||
|
||||
// ================================
|
||||
// 以下方法仅用于 H5,小程序无效
|
||||
// ================================
|
||||
|
||||
/**
|
||||
* [H5 Only] EventSource 流式聊天(备用)
|
||||
*/
|
||||
chatWithEventSource(message, conversationId = '', onMessage, onComplete, onError) {
|
||||
// #ifdef H5
|
||||
if (window.currentEventSource) {
|
||||
window.currentEventSource.close();
|
||||
}
|
||||
const params = new URLSearchParams({
|
||||
uniacid: store.state.uniacid || '1',
|
||||
user_id: store.state.memberInfo?.id || '123456',
|
||||
query: message,
|
||||
conversation_id: conversationId || '',
|
||||
stream: 'true'
|
||||
});
|
||||
const url = `${Config.baseUrl}/api/kefu/chat?${params.toString()}`;
|
||||
try {
|
||||
const eventSource = new EventSource(url);
|
||||
window.currentEventSource = eventSource;
|
||||
let aiMessage = '';
|
||||
eventSource.onmessage = (event) => {
|
||||
try {
|
||||
const data = JSON.parse(event.data);
|
||||
if (data.event === 'message') {
|
||||
aiMessage += data.answer || '';
|
||||
if (onMessage) onMessage(data.answer || '');
|
||||
}
|
||||
if (data.event === 'message_end') {
|
||||
if (onComplete) onComplete({
|
||||
conversation_id: data.conversation_id,
|
||||
message: aiMessage
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('解析消息失败:', error);
|
||||
}
|
||||
};
|
||||
eventSource.onerror = (error) => {
|
||||
console.error('EventSource错误:', error);
|
||||
if (onError) onError({ error: '连接失败' });
|
||||
window.currentEventSource = null;
|
||||
};
|
||||
return eventSource;
|
||||
} catch (error) {
|
||||
console.error('创建EventSource失败:', error);
|
||||
if (onError) onError({ error: error.message });
|
||||
return null;
|
||||
}
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
console.warn('chatWithEventSource 不支持微信小程序');
|
||||
return null;
|
||||
// #endif
|
||||
},
|
||||
|
||||
/**
|
||||
* [H5 Only] Fetch 流式聊天(备用)
|
||||
*/
|
||||
async chatWithFetchStream(message, conversationId = '', onMessage, onComplete, onError) {
|
||||
// #ifdef H5
|
||||
// 实际逻辑已在 sendHttpStream 中实现,此处可复用或留空
|
||||
return this.sendHttpStream(message, onMessage, (res) => {
|
||||
onComplete?.({ message: res.content, conversation_id: res.conversation_id });
|
||||
});
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
console.warn('chatWithFetchStream 不支持微信小程序');
|
||||
return null;
|
||||
// #endif
|
||||
}
|
||||
};
|
||||
@@ -23,10 +23,8 @@ export default {
|
||||
},
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
if (res.data.openid) this.authInfo.weapp_openid = res.data
|
||||
.openid;
|
||||
if (res.data.unionid) this.authInfo.wx_unionid = res.data
|
||||
.unionid;
|
||||
if (res.data.openid) this.authInfo.weapp_openid = res.data.openid;
|
||||
if (res.data.unionid) this.authInfo.wx_unionid = res.data.unionid;
|
||||
typeof callback == 'function' && callback(this.authInfo);
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
@@ -62,8 +60,7 @@ export default {
|
||||
},
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
if (res.data.user_id) this.authInfo.ali_openid = res.data
|
||||
.user_id;
|
||||
if (res.data.user_id) this.authInfo.ali_openid = res.data.user_id;
|
||||
typeof callback == 'function' && callback(this.authInfo);
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
@@ -74,7 +71,7 @@ export default {
|
||||
})
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
fail: (res) => {
|
||||
this.$util.showToast({
|
||||
title: res.errMsg
|
||||
});
|
||||
|
||||
@@ -14,16 +14,19 @@ try {
|
||||
// 调试版本,配置说明
|
||||
const devCfg = {
|
||||
// 商户ID
|
||||
uniacid: 460, //825
|
||||
uniacid: 1, //825
|
||||
|
||||
//api请求地址
|
||||
baseUrl: 'https://xcx30.5g-quickapp.com/',
|
||||
baseUrl: 'https://dev.aigc-quickapp.com/',
|
||||
// baseUrl: 'http://localhost:8010/',
|
||||
|
||||
// 图片域名
|
||||
imgDomain: 'https://xcx30.5g-quickapp.com/',
|
||||
imgDomain: 'https://dev.aigc-quickapp.com/',
|
||||
//imgDomain: 'http://localhost:8010/',
|
||||
|
||||
// H5端域名
|
||||
h5Domain: 'https://xcx30.5g-quickapp.com/',
|
||||
h5Domain: 'https://dev.aigc-quickapp.com/',
|
||||
// h5Domain: 'http://localhost:8010/',
|
||||
|
||||
// // api请求地址
|
||||
// baseUrl: 'https://tsaas.liveplatform.cn/',
|
||||
|
||||
511
common/js/customer-service.js
Normal file
511
common/js/customer-service.js
Normal file
@@ -0,0 +1,511 @@
|
||||
/**
|
||||
* 客服统一处理服务
|
||||
* 整合各种客服方式,提供统一的调用接口
|
||||
*/
|
||||
export class CustomerService {
|
||||
constructor(vueInstance, externalConfig = null) {
|
||||
this.vm = vueInstance;
|
||||
this.externalConfig = externalConfig; // 外部传入的最新配置(优先级最高)
|
||||
this.latestPlatformConfig = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* 强制刷新配置(支持传入外部配置)
|
||||
* @param {Object} externalConfig 外部最新配置
|
||||
*/
|
||||
refreshConfig(externalConfig = null) {
|
||||
this.externalConfig = externalConfig || this.externalConfig;
|
||||
this.latestPlatformConfig = null;
|
||||
return this.getPlatformConfig();
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取平台配置
|
||||
* @returns {Object} 平台对应的客服配置
|
||||
*/
|
||||
getPlatformConfig() {
|
||||
if (this.latestPlatformConfig) {
|
||||
return this.latestPlatformConfig;
|
||||
}
|
||||
|
||||
// 优先级:外部传入的最新配置 > vuex配置 > 空对象
|
||||
const servicerConfig = this.externalConfig || this.vm.$store.state.servicerConfig || {};
|
||||
console.log(`【实时客服配置】`, servicerConfig);
|
||||
|
||||
let platformConfig = null;
|
||||
// #ifdef H5
|
||||
platformConfig = servicerConfig.h5 ? (typeof servicerConfig.h5 === 'object' ? servicerConfig.h5 : null) : null;
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
platformConfig = servicerConfig.weapp ? (typeof servicerConfig.weapp === 'object' ? servicerConfig.weapp : null) : null;
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-ALIPAY
|
||||
platformConfig = servicerConfig.aliapp ? (typeof servicerConfig.aliapp === 'object' ? servicerConfig.aliapp : null) : null;
|
||||
// #endif
|
||||
|
||||
// #ifdef PC
|
||||
platformConfig = servicerConfig.pc ? (typeof servicerConfig.pc === 'object' ? servicerConfig.pc : null) : null;
|
||||
// #endif
|
||||
|
||||
// 处理空数组情况(你的配置中pc/aliapp是空数组,转为null)
|
||||
if (Array.isArray(platformConfig)) {
|
||||
platformConfig = null;
|
||||
}
|
||||
|
||||
this.latestPlatformConfig = platformConfig;
|
||||
return platformConfig;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取企业微信配置
|
||||
* @returns {Object} 企业微信配置
|
||||
*/
|
||||
getWxworkConfig() {
|
||||
return this.vm.$store.state.wxworkConfig || {};
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查客服配置是否可用
|
||||
* @returns {boolean} 是否有可用配置
|
||||
*/
|
||||
isConfigAvailable() {
|
||||
const config = this.getPlatformConfig();
|
||||
return config && typeof config === 'object' && config.type;
|
||||
}
|
||||
|
||||
/**
|
||||
* 验证客服配置完整性
|
||||
* @returns {Object} 验证结果
|
||||
*/
|
||||
validateConfig() {
|
||||
const config = this.getPlatformConfig();
|
||||
const wxworkConfig = this.getWxworkConfig();
|
||||
|
||||
const result = {
|
||||
isValid: true,
|
||||
errors: [],
|
||||
warnings: []
|
||||
};
|
||||
|
||||
if (!config) {
|
||||
result.isValid = false;
|
||||
result.errors.push('客服配置不存在');
|
||||
return result;
|
||||
}
|
||||
|
||||
if (config.type === 'aikefu') {
|
||||
return result;
|
||||
}
|
||||
|
||||
if (!config.type) {
|
||||
result.isValid = false;
|
||||
result.errors.push('客服类型未配置');
|
||||
}
|
||||
|
||||
if (config.type === 'wxwork') {
|
||||
if (!wxworkConfig) {
|
||||
result.isValid = false;
|
||||
result.errors.push('企业微信配置不存在');
|
||||
} else {
|
||||
if (!wxworkConfig.enable) {
|
||||
result.warnings.push('企业微信功能未启用');
|
||||
}
|
||||
if (!wxworkConfig.contact_url) {
|
||||
result.warnings.push('企业微信活码链接未配置,将使用原有客服方式');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
/**
|
||||
* 跳转到Dify客服页面
|
||||
*/
|
||||
openDifyService() {
|
||||
try {
|
||||
if (this.vm.setAiUnreadCount) {
|
||||
this.vm.setAiUnreadCount(0);
|
||||
}
|
||||
// 强制跳转,忽略框架层的封装
|
||||
uni.redirectTo({
|
||||
url: '/pages_tool/ai-chat/index',
|
||||
fail: (err) => {
|
||||
// 兜底:使用window.location跳转(H5)
|
||||
// #ifdef H5
|
||||
window.location.href = '/pages_tool/ai-chat/index';
|
||||
// #endif
|
||||
console.error('跳转Dify客服失败:', err);
|
||||
uni.showToast({
|
||||
title: '跳转客服失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
} catch (e) {
|
||||
console.error('跳转Dify客服异常:', e);
|
||||
uni.showToast({
|
||||
title: '跳转客服失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理客服点击事件
|
||||
* @param {Object} options 选项参数
|
||||
*/
|
||||
handleCustomerClick(options = {}) {
|
||||
const validation = this.validateConfig();
|
||||
if (!validation.isValid) {
|
||||
console.error('客服配置验证失败:', validation.errors);
|
||||
this.showConfigErrorPopup(validation.errors);
|
||||
return;
|
||||
}
|
||||
|
||||
if (validation.warnings.length > 0) {
|
||||
console.warn('客服配置警告:', validation.warnings);
|
||||
}
|
||||
|
||||
const config = this.getPlatformConfig();
|
||||
const { niushop = {}, sendMessageTitle = '', sendMessagePath = '', sendMessageImg = '' } = options;
|
||||
|
||||
if (config.type === 'none') {
|
||||
this.showNoServicePopup();
|
||||
return;
|
||||
}
|
||||
|
||||
// 核心分支:根据最新的type处理
|
||||
switch (config.type) {
|
||||
case 'aikefu':
|
||||
this.openDifyService();
|
||||
break;
|
||||
case 'wxwork':
|
||||
this.openWxworkService(false, config, options);
|
||||
break;
|
||||
case 'third':
|
||||
this.openThirdService(config);
|
||||
break;
|
||||
case 'niushop':
|
||||
this.openNiushopService(niushop);
|
||||
break;
|
||||
case 'weapp':
|
||||
this.openWeappService(config, options);
|
||||
break;
|
||||
case 'aliapp':
|
||||
this.openAliappService(config);
|
||||
break;
|
||||
default:
|
||||
this.makePhoneCall();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开企业微信客服
|
||||
* @param {boolean} useOriginalService 是否使用原有客服方式
|
||||
* @param {Object} servicerConfig 客服配置
|
||||
* @param {Object} options 选项参数
|
||||
*/
|
||||
openWxworkService(useOriginalService = false, servicerConfig = null, options = {}) {
|
||||
const config = servicerConfig || this.getPlatformConfig();
|
||||
const wxworkConfig = this.getWxworkConfig();
|
||||
const { sendMessageTitle = '', sendMessagePath = '', sendMessageImg = '' } = options;
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
if (wxworkConfig?.enable && wxworkConfig?.contact_url && !useOriginalService) {
|
||||
wx.navigateToMiniProgram({
|
||||
appId: 'wxeb490c6f9b154ef9',
|
||||
path: `pages/contacts/externalContactDetail?url=${encodeURIComponent(wxworkConfig.contact_url)}`,
|
||||
success: () => console.log('跳转企业微信成功'),
|
||||
fail: (err) => {
|
||||
console.error('跳转企业微信失败:', err);
|
||||
this.fallbackToOriginalService();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
wx.openCustomerServiceChat({
|
||||
extInfo: { url: config.wxwork_url },
|
||||
corpId: config.corpid,
|
||||
showMessageCard: true,
|
||||
sendMessageTitle,
|
||||
sendMessagePath,
|
||||
sendMessageImg
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
if (wxworkConfig?.enable && wxworkConfig?.contact_url) {
|
||||
window.location.href = wxworkConfig.contact_url;
|
||||
} else if (config.wxwork_url) {
|
||||
location.href = config.wxwork_url;
|
||||
} else {
|
||||
this.fallbackToPhoneCall();
|
||||
}
|
||||
// #endif
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开第三方客服
|
||||
* @param {Object} config 客服配置
|
||||
*/
|
||||
openThirdService(config) {
|
||||
if (config.third_url) {
|
||||
window.location.href = config.third_url;
|
||||
} else {
|
||||
this.fallbackToPhoneCall();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开牛商客服
|
||||
* @param {Object} niushop 牛商参数
|
||||
*/
|
||||
openNiushopService(niushop) {
|
||||
if (Object.keys(niushop).length > 0) {
|
||||
this.vm.$util.redirectTo('/pages_tool/chat/room', niushop);
|
||||
} else {
|
||||
this.makePhoneCall();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开微信小程序客服
|
||||
* @param {Object} config 客服配置
|
||||
* @param {Object} options 选项参数
|
||||
*/
|
||||
openWeappService(config, options = {}) {
|
||||
if (!this.shouldUseCustomService(config)) {
|
||||
console.log('使用官方微信小程序客服');
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('使用自定义微信小程序客服');
|
||||
this.handleCustomWeappService(config, options);
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理自定义微信小程序客服
|
||||
* @param {Object} config 客服配置
|
||||
* @param {Object} options 选项参数
|
||||
*/
|
||||
handleCustomWeappService(config, options = {}) {
|
||||
const { sendMessageTitle = '', sendMessagePath = '', sendMessageImg = '' } = options;
|
||||
|
||||
if (config.customServiceUrl) {
|
||||
let url = config.customServiceUrl;
|
||||
const params = [];
|
||||
if (sendMessageTitle) params.push(`title=${encodeURIComponent(sendMessageTitle)}`);
|
||||
if (sendMessagePath) params.push(`path=${encodeURIComponent(sendMessagePath)}`);
|
||||
if (sendMessageImg) params.push(`img=${encodeURIComponent(sendMessageImg)}`);
|
||||
|
||||
if (params.length > 0) {
|
||||
url += (url.includes('?') ? '&' : '?') + params.join('&');
|
||||
}
|
||||
|
||||
uni.navigateTo({
|
||||
url: url,
|
||||
fail: (err) => {
|
||||
console.error('跳转自定义客服页面失败:', err);
|
||||
this.tryThirdPartyService(config, options);
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
this.tryThirdPartyService(config, options);
|
||||
}
|
||||
|
||||
/**
|
||||
* 尝试使用第三方客服
|
||||
* @param {Object} config 客服配置
|
||||
* @param {Object} options 选项参数
|
||||
*/
|
||||
tryThirdPartyService(config, options = {}) {
|
||||
if (config.thirdPartyServiceUrl) {
|
||||
// #ifdef H5
|
||||
window.open(config.thirdPartyServiceUrl, '_blank');
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
if (config.thirdPartyMiniAppId) {
|
||||
wx.navigateToMiniProgram({
|
||||
appId: config.thirdPartyMiniAppId,
|
||||
path: config.thirdPartyMiniAppPath || '',
|
||||
fail: (err) => {
|
||||
console.error('跳转第三方小程序失败:', err);
|
||||
this.fallbackToPhoneCall();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.setClipboardData({
|
||||
data: config.thirdPartyServiceUrl,
|
||||
success: () => {
|
||||
uni.showModal({
|
||||
title: '客服链接已复制',
|
||||
content: '客服链接已复制到剪贴板,请在浏览器中粘贴访问',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
return;
|
||||
}
|
||||
|
||||
this.fallbackToPhoneCall();
|
||||
}
|
||||
|
||||
/**
|
||||
* 降级到电话客服
|
||||
*/
|
||||
fallbackToPhoneCall() {
|
||||
uni.showModal({
|
||||
title: '联系客服',
|
||||
content: '在线客服暂时不可用,是否拨打电话联系客服?',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.makePhoneCall();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开支付宝小程序客服
|
||||
* @param {Object} config 客服配置
|
||||
*/
|
||||
openAliappService(config) {
|
||||
console.log('支付宝小程序客服', config);
|
||||
switch (config.type) {
|
||||
case 'aikefu':
|
||||
this.openDifyService();
|
||||
break;
|
||||
case 'third':
|
||||
this.openThirdService(config);
|
||||
break;
|
||||
default:
|
||||
console.log('使用支付宝官方客服');
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 拨打电话
|
||||
*/
|
||||
makePhoneCall() {
|
||||
this.vm.$api.sendRequest({
|
||||
url: '/api/site/shopcontact',
|
||||
success: res => {
|
||||
if (res.code === 0 && res.data?.mobile) {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: res.data.mobile
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '暂无客服电话',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
title: '获取客服电话失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 显示无客服弹窗
|
||||
*/
|
||||
showNoServicePopup() {
|
||||
const siteInfo = this.vm.$store.state.siteInfo || {};
|
||||
const message = siteInfo?.site_tel
|
||||
? `请联系客服,客服电话是${siteInfo.site_tel}`
|
||||
: '抱歉,商家暂无客服,请线下联系';
|
||||
|
||||
uni.showModal({
|
||||
title: '联系客服',
|
||||
content: message,
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 显示配置错误弹窗
|
||||
* @param {Array} errors 错误列表
|
||||
*/
|
||||
showConfigErrorPopup(errors) {
|
||||
const message = errors.join('\n');
|
||||
uni.showModal({
|
||||
title: '配置错误',
|
||||
content: `客服配置有误:\n${message}`,
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 降级处理:使用原有客服方式
|
||||
*/
|
||||
fallbackToOriginalService() {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '无法直接添加企业微信客服,是否使用其他方式联系客服?',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.openWxworkService(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取客服按钮配置
|
||||
* @returns {Object} 按钮配置
|
||||
*/
|
||||
getButtonConfig() {
|
||||
const config = this.getPlatformConfig();
|
||||
if (!config) return { openType: '' };
|
||||
|
||||
let openType = '';
|
||||
// #ifdef MP-WEIXIN
|
||||
if (config.type === 'weapp') {
|
||||
openType = config.useOfficial !== false ? 'contact' : '';
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-ALIPAY
|
||||
if (config.type === 'aliapp') openType = 'contact';
|
||||
// #endif
|
||||
|
||||
return { ...config, openType };
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断是否应该使用自定义客服处理
|
||||
* @param {Object} config 客服配置
|
||||
* @returns {boolean} 是否使用自定义客服
|
||||
*/
|
||||
shouldUseCustomService(config) {
|
||||
// #ifdef MP-WEIXIN
|
||||
if (config?.type === 'weapp') {
|
||||
return config.useOfficial === false;
|
||||
}
|
||||
// #endif
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建客服服务实例
|
||||
* @param {Object} vueInstance Vue实例
|
||||
* @param {Object} externalConfig 外部最新配置
|
||||
* @returns {CustomerService} 客服服务实例
|
||||
*/
|
||||
export function createCustomerService(vueInstance, externalConfig = null) {
|
||||
return new CustomerService(vueInstance, externalConfig);
|
||||
}
|
||||
368
common/js/diy.js
368
common/js/diy.js
@@ -1,7 +1,14 @@
|
||||
import WxMap from 'common/js/map-wx-jssdk.js';
|
||||
import { QQMapWX } from 'common/js/map-wx-jssdk.js';
|
||||
import Config from '@/common/js/config.js';
|
||||
|
||||
let systemInfo = uni.getSystemInfoSync();
|
||||
let systemInfo = {};
|
||||
try {
|
||||
// 合并设备信息和窗口信息
|
||||
systemInfo = {...uni.getDeviceInfo(), ...uni.getWindowInfo()};
|
||||
} catch (e) {
|
||||
// 兼容旧版本
|
||||
systemInfo = uni.getSystemInfoSync();
|
||||
}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@@ -35,6 +42,7 @@ export default {
|
||||
latitude: null, // 纬度
|
||||
longitude: null, // 经度
|
||||
currentPosition: '', // 当前位置
|
||||
currentStore: null,//当前门店
|
||||
nearestStore: null, // 离自己最近的门店
|
||||
|
||||
storeTimeOut: null, // 没有获取到定位,则获取默认门店
|
||||
@@ -43,6 +51,8 @@ export default {
|
||||
diyRoute: '', // 页面路由
|
||||
openBottomNav: false,
|
||||
isShowCopyRight: false,
|
||||
option: null,
|
||||
firstDiy: true,
|
||||
|
||||
//启动广告
|
||||
adv: {},
|
||||
@@ -50,12 +60,17 @@ export default {
|
||||
};
|
||||
},
|
||||
onLoad(option) {
|
||||
this.option = option;
|
||||
uni.hideTabBar();
|
||||
// 支付宝小程序传参处理
|
||||
// #ifdef MP-ALIPAY
|
||||
let aliapp_option = my.getLaunchOptionsSync();
|
||||
aliapp_option.query && Object.assign(option, aliapp_option.query);
|
||||
// #endif
|
||||
|
||||
if (option.source_member) uni.setStorageSync('source_member', option.source_member);
|
||||
|
||||
// 小程序扫码进入
|
||||
if (option.scene) {
|
||||
// 处理分享人数据
|
||||
if (option.source_member) uni.setStorageSync('source_member', option.source_member);// 分享链接进入
|
||||
if (option.scene) {// 小程序扫码进入
|
||||
var sceneParams = decodeURIComponent(option.scene);
|
||||
sceneParams = sceneParams.split('&');
|
||||
if (sceneParams.length) {
|
||||
@@ -65,64 +80,36 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
// H5地图选择位置回调
|
||||
// #ifdef H5
|
||||
// H5地图选择位置回调数据
|
||||
if (option.module && option.module == 'locationPicker') {
|
||||
option.name = ''; // 清空地址
|
||||
option.name = ''; // 自定义页面传参id和name,防止获取地址时变量混淆
|
||||
this.locationModule = option.module;
|
||||
this.latitude = option.latng.split(',')[0];
|
||||
this.longitude = option.latng.split(',')[1];
|
||||
}
|
||||
// #endif
|
||||
|
||||
//自定义页面的id和名称
|
||||
this.id = option.id || 0;
|
||||
this.name = option.name || '';
|
||||
|
||||
uni.removeStorageSync('manual_store_info'); // 清除手动切换门店缓存
|
||||
uni.removeStorageSync('manual_change_store'); // 清楚手动切换门店标识
|
||||
|
||||
// H5才会执行
|
||||
if (this.locationModule == 'locationPicker') {
|
||||
|
||||
// H5地图选址后的回调
|
||||
this.getNearestStore();
|
||||
this.getCurrentLocation();
|
||||
|
||||
} else if (this.mapConfig.wap_is_open == 1) {
|
||||
|
||||
// 每次都要定位,获取当前位置
|
||||
/*this.$util.getLocation({
|
||||
fail: (res) => {
|
||||
// 拒绝定位,进入默认总店
|
||||
this.enterDefaultStore();
|
||||
//获取当前门店信息 必须是首页且不是手动切换操作
|
||||
let current_route = this.$util.getCurrentRoute();
|
||||
let manualChangeStore = uni.getStorageSync('manual_change_store'); // 手动切换门店
|
||||
if (current_route.path.indexOf('/pages/index/index') > -1 && !manualChangeStore) {
|
||||
this.getCurrentStore(option);
|
||||
}
|
||||
});*/
|
||||
|
||||
// 如果3秒没有获取到定位,则获取默认门店,H5使用
|
||||
// #ifdef H5
|
||||
this.storeTimeOut = setTimeout(() => {
|
||||
this.enterDefaultStore();
|
||||
}, 1000 * 3);
|
||||
// #endif
|
||||
|
||||
} else {
|
||||
// 关闭定位
|
||||
this.enterDefaultStore();
|
||||
}
|
||||
|
||||
},
|
||||
onShow() {
|
||||
|
||||
this.init();
|
||||
async onShow() {
|
||||
if (this.firstDiy) {
|
||||
this.firstDiy = false;
|
||||
await this.getDiyMethod();
|
||||
}
|
||||
await this.onShowMethod();
|
||||
},
|
||||
onHide() {
|
||||
if (this.storeTimeOut) {
|
||||
clearTimeout(this.storeTimeOut);
|
||||
}
|
||||
|
||||
// 跳转页面要关闭门店弹出框
|
||||
this.closeChooseStorePopup();
|
||||
|
||||
// 清除限时秒杀定时器
|
||||
this.$store.commit('setDiySeckillInterval', 0);
|
||||
},
|
||||
@@ -149,7 +136,7 @@ export default {
|
||||
return str;
|
||||
},
|
||||
backgroundUrl() {
|
||||
var str = this.diyData.global.bgUrl && this.diyData.global.bgUrl != 'transparent' ? 'url(' + this.$util.img(this.diyData.global.bgUrl) + ') ' : '';
|
||||
var str = this.diyData.global?.bgUrl && this.diyData.global?.bgUrl != 'transparent' ? 'url(' + this.$util.img(this.diyData.global?.bgUrl) + ') ' : '';
|
||||
return str;
|
||||
},
|
||||
textNavColor() {
|
||||
@@ -187,30 +174,34 @@ export default {
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
location: function (nVal) {
|
||||
if (nVal) {
|
||||
/* location: function (nVal) {
|
||||
if (nVal && !this.latitude && !this.longitude) {
|
||||
this.latitude = nVal.latitude;
|
||||
this.longitude = nVal.longitude;
|
||||
this.getNearestStore();
|
||||
this.getCurrentLocation();
|
||||
this.getStoreInfoByLocation();
|
||||
}
|
||||
}, */
|
||||
initStatus: function (val) {
|
||||
if (!this.option.store_id) this.getLocation();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
play(){
|
||||
console.log(123)
|
||||
async getDiyMethod() {
|
||||
await this.getDiyInfo();
|
||||
|
||||
this.$store.commit('setDiySeckillInterval', 1);
|
||||
this.$store.commit('setComponentRefresh');
|
||||
},
|
||||
async init() {
|
||||
async onShowMethod() {
|
||||
|
||||
// 定位信息过期后,重新获取定位
|
||||
if(this.mapConfig.wap_is_open == 1 && this.locationStorage && this.locationStorage.is_expired) {
|
||||
this.$util.getLocation({
|
||||
fail: (res) => {
|
||||
// 拒绝定位,进入默认总店
|
||||
this.enterDefaultStore();
|
||||
}
|
||||
});
|
||||
}
|
||||
// if (this.mapConfig.wap_is_open == 1 && this.locationStorage && this.locationStorage.is_expired) {
|
||||
// this.$util.getLocation({
|
||||
// fail: (res) => {
|
||||
// // 失败了不需要做任何处理,保持之前的门店选择即可
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
|
||||
if (this.storeToken) {
|
||||
//记录分享关系
|
||||
@@ -225,17 +216,15 @@ export default {
|
||||
|
||||
this.$store.commit('setDiySeckillInterval', 1);
|
||||
|
||||
//小程序分享
|
||||
// #ifdef MP-WEIXIN
|
||||
this.$util.getMpShare().then(res => {
|
||||
this.mpShareData = res;
|
||||
});
|
||||
// #endif
|
||||
|
||||
let manualChangeStore = uni.getStorageSync('manual_change_store'); // 手动切换门店
|
||||
if (manualChangeStore) {
|
||||
uni.removeStorageSync('manual_change_store');
|
||||
|
||||
let manualStoreInfo = uni.getStorageSync('manual_store_info'); // 手动选择门店
|
||||
uni.removeStorageSync('manual_store_info');
|
||||
if (manualStoreInfo) {
|
||||
this.currentStore = manualStoreInfo;
|
||||
}
|
||||
this.closeGetLocationFailPopup();
|
||||
// 滚动至顶部
|
||||
uni.pageScrollTo({
|
||||
duration: 200,
|
||||
@@ -267,8 +256,14 @@ export default {
|
||||
query.select('.page-header').boundingClientRect(data => {
|
||||
if (data && data.height) {
|
||||
// 从状态栏高度开始算
|
||||
if (!this.diyData.global.topNavBg) {
|
||||
this.paddingTop = 0;
|
||||
this.marginTop = 0;
|
||||
} else {
|
||||
this.paddingTop = data.height + 'px';
|
||||
this.marginTop = -data.height + 'px';
|
||||
}
|
||||
|
||||
clearInterval(time);
|
||||
}
|
||||
}).exec();
|
||||
@@ -337,7 +332,7 @@ export default {
|
||||
this.$langConfig.title(this.diyData.global.title);
|
||||
this.mpCollect = this.diyData.global.mpCollect;
|
||||
this.setPublicShare();
|
||||
/* if (this.diyData.global.popWindow && this.diyData.global.popWindow.imageUrl) {
|
||||
if (this.diyData.global.popWindow && this.diyData.global.popWindow.imageUrl) {
|
||||
// 弹框形式,首次弹出 1,每次弹出 0
|
||||
setTimeout(() => {
|
||||
if (this.diyData.global.popWindow.count == 1) {
|
||||
@@ -352,7 +347,7 @@ export default {
|
||||
uni.setStorageSync(this.id + this.name + '_popwindow_count', 0);
|
||||
}
|
||||
}, 500);
|
||||
}*/
|
||||
}
|
||||
|
||||
// 修改diy数据结构排序
|
||||
let searchIndex = -1;
|
||||
@@ -375,14 +370,15 @@ export default {
|
||||
this.diyData.value.splice(topCategoryIndex, 1);
|
||||
this.diyData.value.splice(0, 0, ...topCategoryData);
|
||||
this.diyData.value.splice(1, 0, ...searchData);
|
||||
} else
|
||||
} else {
|
||||
this.diyData.value.splice(0, 0, ...searchData);
|
||||
}
|
||||
} else if (searchIndex != -1 && topCategoryIndex == -1) {
|
||||
let searchData = this.diyData.value.slice(searchIndex, searchIndex + 1);
|
||||
this.diyData.value.splice(searchIndex, 1);
|
||||
this.diyData.value.splice(0, 0, ...searchData);
|
||||
}
|
||||
|
||||
this.topIndexValue = null;
|
||||
for (var i = 0; i < this.diyData.value.length; i++) {
|
||||
// 分类导航组件
|
||||
if (this.diyData.value[i].componentName == 'TopCategory') {
|
||||
@@ -402,7 +398,6 @@ export default {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// #ifdef MP
|
||||
//小程序收藏
|
||||
if (!uni.getStorageSync('isCollect') && this.diyData.global.mpCollect) {
|
||||
@@ -416,6 +411,45 @@ export default {
|
||||
this.openBottomNav = this.diyData.global.openBottomNav;
|
||||
}
|
||||
this.isShowCopyRight = true;
|
||||
|
||||
//小程序分享
|
||||
// #ifdef MP-WEIXIN
|
||||
let path = this.$util.getCurrentRoute().path;
|
||||
if (path == '/pages/member/index') {
|
||||
this.mpShareData = {};
|
||||
return;
|
||||
}
|
||||
let share_path = path;
|
||||
if (this.$store.state.memberInfo && this.$store.state.memberInfo.member_id) {
|
||||
share_path = this.$util.getCurrentShareRoute(this.$store.state.memberInfo.member_id).path
|
||||
}
|
||||
let appMessageData = {
|
||||
title: this.diyData.global.weappShareTitle,
|
||||
path: share_path,
|
||||
imageUrl: this.$util.img(this.diyData.global.weappShareImage),
|
||||
success: res => { },
|
||||
fail: res => { }
|
||||
}
|
||||
let timeLineData = {
|
||||
title: this.diyData.global.weappShareTitle,
|
||||
query: share_path,
|
||||
imageUrl: this.$util.img(this.diyData.global.weappShareImage),
|
||||
}
|
||||
|
||||
this.mpShareData = {
|
||||
appMessage: appMessageData,
|
||||
timeLine: timeLineData
|
||||
};
|
||||
//console.log(this.mpShareData, 'this.mpShareData');
|
||||
|
||||
var store_info = this.$store.state.globalStoreInfo;
|
||||
if (store_info) {
|
||||
this.mpShareData.appMessage.path += (this.mpShareData.appMessage.path.indexOf('?') > -1 ? '&' : '?') + 'store_id=' + store_info.store_id;
|
||||
this.mpShareData.timeLine.query += (this.mpShareData.timeLine.query.indexOf('?') > -1 ? '&' : '?') + 'store_id=' + store_info.store_id;
|
||||
}
|
||||
//朋友圈不需要页面路径,只要要后面的参数就行
|
||||
this.mpShareData.timeLine.query = this.mpShareData.timeLine.query.split('?')[1] || '';
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
closePopupWindow() {
|
||||
@@ -430,44 +464,131 @@ export default {
|
||||
this.$util.diyRedirectTo(this.diyData.global.popWindow.link);
|
||||
this.closePopupWindow();
|
||||
},
|
||||
/******************************************** 获取门店相关 START ***************************************************/
|
||||
/**
|
||||
* 1、分享携带门店id
|
||||
* 门店id正确 进入门店
|
||||
* 门店id错误 通过定位获取门店
|
||||
* 2、通过定位获取门店
|
||||
* 开启获取定位
|
||||
* 同意获取定位 获取最近门店 进入门店
|
||||
* 拒绝获取定位
|
||||
* 平台运营模式 进入默认门店
|
||||
* 连锁门店模式 提示获取定位失败,手动选择门店或引导去开启定位
|
||||
* 关闭获取定位
|
||||
* 平台运营模式 进入默认门店
|
||||
* 连锁门店模式 提示获取定位失败,手动选择门店
|
||||
*/
|
||||
getCurrentStore(option) {
|
||||
if (option.store_id && !isNaN(parseInt(option.store_id))) {
|
||||
this.getStoreInfoByShare(option.store_id);
|
||||
} else {
|
||||
this.getLocation();
|
||||
}
|
||||
},
|
||||
getStoreInfoByShare(store_id) {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/store/info',
|
||||
data: { store_id },
|
||||
success: res => {
|
||||
if (res.code >= 0 && res.data) {
|
||||
this.changeCurrentStore(res.data);
|
||||
} else {
|
||||
this.getLocation();
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
this.getLocation();
|
||||
}
|
||||
});
|
||||
},
|
||||
getLocation() {
|
||||
if (!this.latitude && !this.longitude && this.initStatus) {
|
||||
if (this.mapConfig.wap_is_open == 1) {
|
||||
this.$util.getLocation({
|
||||
complete: (res) => {
|
||||
if (res.latitude && res.longitude) {
|
||||
this.closeGetLocationFailPopup();
|
||||
this.latitude = res.latitude;
|
||||
this.longitude = res.longitude;
|
||||
this.getStoreInfoByLocation();
|
||||
} else {
|
||||
let is_h5 = false;
|
||||
// #ifdef H5
|
||||
is_h5 = true;
|
||||
// #endif
|
||||
if (is_h5) {
|
||||
//H5同意了也会进入失败,所以直接进入默认门店
|
||||
this.enterDefaultStore();
|
||||
} else {
|
||||
this.getLocationFail();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
// #ifdef H5
|
||||
//H5有的机型可能根本不会触发getLocation的任何执行,包括success,fail,completele
|
||||
//所以这里如果等待一定时间后还是没有获取到当前门店则进入默认门店
|
||||
setTimeout(() => {
|
||||
let current_route = this.$util.getCurrentRoute();
|
||||
if (this.mapConfig.wap_is_open == 1 && !this.currentStore && current_route.path == '/pages/index/index') {
|
||||
this.enterDefaultStore();
|
||||
}
|
||||
}, 5000);
|
||||
// #endif
|
||||
} else {
|
||||
this.getLocationFail();
|
||||
}
|
||||
}
|
||||
},
|
||||
getStoreInfoByLocation() {
|
||||
if (this.latitude && this.longitude) {
|
||||
this.getNearestStore();
|
||||
this.getCurrentLocation();
|
||||
}
|
||||
},
|
||||
changeCurrentStore(store_info) {
|
||||
this.currentStore = store_info;
|
||||
this.changeStore(store_info);
|
||||
this.openChooseStorePopup();
|
||||
},
|
||||
getLocationFail() {
|
||||
if (this.globalStoreConfig.store_business == 'shop') {
|
||||
this.enterDefaultStore();
|
||||
} else {
|
||||
this.openGetLocationFailPopup();
|
||||
}
|
||||
},
|
||||
openGetLocationFailPopup() {
|
||||
if (this.$refs.getLocationFailRef) this.$refs.getLocationFailRef.open();
|
||||
},
|
||||
closeGetLocationFailPopup() {
|
||||
if (this.$refs.getLocationFailRef) this.$refs.getLocationFailRef.close();
|
||||
},
|
||||
openChooseStorePopup() {
|
||||
let globalStoreInfo = this.globalStoreInfo;
|
||||
if (this.globalStoreConfig && this.globalStoreConfig.confirm_popup_control == 1) {
|
||||
let storeInfo = this.globalStoreInfo;
|
||||
|
||||
// 首次进入门店,没有门店信息 || 当前位置的门店和缓存门店不一致要弹框
|
||||
if (!storeInfo || storeInfo && this.nearestStore && storeInfo.store_id != this.nearestStore.store_id) {
|
||||
this.currentStore.show_address = this.currentStore.full_address.replace(/,/g, ' ') + ' ' + this.currentStore.address;
|
||||
if (this.$refs.chooseStorePopup) this.$refs.chooseStorePopup.open();
|
||||
}
|
||||
}
|
||||
|
||||
let manualStoreInfo = uni.getStorageSync('manual_store_info'); // 手动选择门店
|
||||
if (manualStoreInfo) {
|
||||
this.nearestStore = manualStoreInfo;
|
||||
}
|
||||
this.changeStore(this.nearestStore); // 切换门店数据
|
||||
},
|
||||
closeChooseStorePopup() {
|
||||
if (this.$refs.chooseStorePopup) this.$refs.chooseStorePopup.close();
|
||||
},
|
||||
// 确认进入门店
|
||||
enterStore() {
|
||||
this.closeChooseStorePopup();
|
||||
},
|
||||
// 选择其他门店
|
||||
chooseOtherStore() {
|
||||
this.$util.redirectTo('/pages_tool/store/list');
|
||||
this.closeChooseStorePopup();
|
||||
},
|
||||
// 打开地图重新选择位置
|
||||
reposition() {
|
||||
reGetLocation() {
|
||||
// #ifdef MP
|
||||
/*uni.chooseLocation({
|
||||
uni.chooseLocation({
|
||||
success: res => {
|
||||
this.latitude = res.latitude;
|
||||
this.longitude = res.longitude;
|
||||
this.currentPosition = res.name;
|
||||
this.getNearestStore();
|
||||
this.getCurrentLocation();
|
||||
this.getStoreInfoByLocation();
|
||||
},
|
||||
fail(res) {
|
||||
uni.getSetting({
|
||||
@@ -492,8 +613,7 @@ export default {
|
||||
this.latitude = res.latitude;
|
||||
this.longitude = res.longitude;
|
||||
this.currentPosition = res.name;
|
||||
this.getNearestStore();
|
||||
this.getCurrentLocation();
|
||||
this.getStoreInfoByLocation();
|
||||
}
|
||||
});
|
||||
}, 1000);
|
||||
@@ -511,7 +631,7 @@ export default {
|
||||
}
|
||||
});
|
||||
}
|
||||
});*/
|
||||
});
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
@@ -532,9 +652,7 @@ export default {
|
||||
data: data,
|
||||
success: res => {
|
||||
if (res.code == 0 && res.data) {
|
||||
this.nearestStore = res.data;
|
||||
this.nearestStore.show_address = this.nearestStore.full_address.replace(/,/g, ' ') + ' ' + this.nearestStore.address;
|
||||
this.openChooseStorePopup();
|
||||
this.changeCurrentStore(res.data);
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -547,7 +665,6 @@ export default {
|
||||
data.latitude = this.latitude;
|
||||
data.longitude = this.longitude;
|
||||
}
|
||||
|
||||
this.$api.sendRequest({
|
||||
url: '/api/store/getLocation',
|
||||
data: data,
|
||||
@@ -563,26 +680,42 @@ export default {
|
||||
// 定位失败,进入默认门店
|
||||
enterDefaultStore() {
|
||||
if (this.defaultStoreInfo) {
|
||||
if (!this.nearestStore) {
|
||||
this.nearestStore = this.defaultStoreInfo;
|
||||
this.nearestStore.show_address = this.nearestStore.full_address.replace(/,/g, ' ') + ' ' + this.nearestStore.address;
|
||||
}
|
||||
if (this.currentPosition == '') this.currentPosition = '未获取到定位';
|
||||
this.openChooseStorePopup();
|
||||
this.changeCurrentStore(this.defaultStoreInfo);
|
||||
}
|
||||
},
|
||||
//连锁门店未定位选择门店
|
||||
chooseStore() {
|
||||
this.$util.redirectTo('/pages_tool/store/list');
|
||||
},
|
||||
//打开手机设置重新定位
|
||||
openSetting() {
|
||||
uni.openSetting({
|
||||
success: res => {
|
||||
this.getLocation();
|
||||
}
|
||||
})
|
||||
},
|
||||
/******************************************** 获取门店相关 END ***************************************************/
|
||||
// 设置公众号分享
|
||||
setPublicShare() {
|
||||
let shareUrl = this.$config.h5Domain + this.diyRoute;
|
||||
if (this.id) shareUrl += '?id=' + this.id;
|
||||
else if (this.name) shareUrl += '?name=' + this.name;
|
||||
this.$util.setPublicShare({
|
||||
title: this.diyData.global.title,
|
||||
desc: '',
|
||||
link: shareUrl,
|
||||
imgUrl: this.siteInfo ? this.$util.img(this.siteInfo.logo_square) : ''
|
||||
});
|
||||
var store_info = this.$store.state.globalStoreInfo;
|
||||
//if (store_info) shareUrl += '?store_id=' + store_info.store_id;
|
||||
if (shareUrl.indexOf('?') > 0) {
|
||||
shareUrl += '&';
|
||||
} else {
|
||||
shareUrl += '?';
|
||||
}
|
||||
if (this.id) shareUrl += 'id=' + this.id;
|
||||
else if (this.name) shareUrl += 'name=' + this.name;
|
||||
// alert('diydiydiy')
|
||||
this.$util.setPublicShare({
|
||||
title: this.diyData.global.wechatShareTitle || this.diyData.global.title,
|
||||
desc: this.diyData.global.wechatShareDesc,
|
||||
link: shareUrl,
|
||||
imgUrl: this.diyData.global.wechatShareImage ? this.$util.img(this.diyData.global.wechatShareImage) : this.$util.img(this.siteInfo.logo_square)
|
||||
});
|
||||
},
|
||||
},
|
||||
onPageScroll(e) {
|
||||
this.scrollTop = e.scrollTop;
|
||||
@@ -597,6 +730,7 @@ export default {
|
||||
// 下拉刷新
|
||||
onPullDownRefresh() {
|
||||
this.$store.commit('setComponentRefresh');
|
||||
this.getDiyMethod();
|
||||
setTimeout(() => {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 50);
|
||||
|
||||
112
common/js/event-safety.js
Normal file
112
common/js/event-safety.js
Normal file
@@ -0,0 +1,112 @@
|
||||
// 事件安全处理工具
|
||||
export class EventSafety {
|
||||
// 创建安全的事件对象
|
||||
static createSafeEvent(originalEvent = {}) {
|
||||
const safeEvent = {
|
||||
type: originalEvent.type || 'unknown',
|
||||
timeStamp: originalEvent.timeStamp || Date.now(),
|
||||
detail: originalEvent.detail || {},
|
||||
// 安全的目标对象
|
||||
get target() {
|
||||
return EventSafety.createSafeTarget(originalEvent.target)
|
||||
},
|
||||
get currentTarget() {
|
||||
return EventSafety.createSafeTarget(originalEvent.currentTarget)
|
||||
},
|
||||
// 安全的 matches 方法
|
||||
matches(selector) {
|
||||
return EventSafety.safeMatches(originalEvent.target, selector)
|
||||
}
|
||||
}
|
||||
|
||||
return new Proxy(safeEvent, {
|
||||
get(obj, prop) {
|
||||
// 防止访问不存在的属性
|
||||
if (prop in obj) {
|
||||
return obj[prop]
|
||||
}
|
||||
return undefined
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 创建安全的目标对象
|
||||
static createSafeTarget(target) {
|
||||
if (!target || typeof target !== 'object') {
|
||||
return EventSafety.getFallbackTarget()
|
||||
}
|
||||
|
||||
const safeTarget = {
|
||||
// 基础属性
|
||||
tagName: target.tagName || '',
|
||||
id: target.id || '',
|
||||
className: target.className || '',
|
||||
// 安全的方法
|
||||
matches: (selector) => EventSafety.safeMatches(target, selector),
|
||||
// 数据集
|
||||
dataset: target.dataset || {}
|
||||
}
|
||||
|
||||
return safeTarget
|
||||
}
|
||||
|
||||
// 安全的 matches 检查
|
||||
static safeMatches(element, selector) {
|
||||
if (!element || typeof element.matches !== 'function') {
|
||||
return false
|
||||
}
|
||||
|
||||
try {
|
||||
return element.matches(selector)
|
||||
} catch (error) {
|
||||
console.warn('matches 检查失败:', error)
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// 回退目标对象
|
||||
static getFallbackTarget() {
|
||||
return {
|
||||
tagName: '',
|
||||
id: '',
|
||||
className: '',
|
||||
matches: () => false,
|
||||
dataset: {}
|
||||
}
|
||||
}
|
||||
|
||||
// 包装事件处理器
|
||||
static wrapEventHandler(handler, options = {}) {
|
||||
return function(event) {
|
||||
try {
|
||||
// 创建安全的事件对象
|
||||
const safeEvent = EventSafety.createSafeEvent(event)
|
||||
return handler.call(this, safeEvent)
|
||||
} catch (error) {
|
||||
console.error('事件处理错误:', error)
|
||||
// 可选的错误处理
|
||||
if (options.onError) {
|
||||
options.onError(error, event, this)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 验证事件类型
|
||||
static isValidEventType(event, expectedType) {
|
||||
return event && event.type === expectedType
|
||||
}
|
||||
|
||||
// 提取安全的事件数据
|
||||
static extractEventData(event, fields = ['type', 'timeStamp', 'detail']) {
|
||||
const result = {}
|
||||
|
||||
fields.forEach(field => {
|
||||
if (event && field in event) {
|
||||
result[field] = event[field]
|
||||
}
|
||||
})
|
||||
|
||||
return result
|
||||
}
|
||||
}
|
||||
@@ -75,6 +75,10 @@ export default {
|
||||
servicerConfig() {
|
||||
return this.$store.state.servicerConfig;
|
||||
},
|
||||
// 企业微信配置
|
||||
wxworkConfig() {
|
||||
return this.$store.state.wxworkConfig;
|
||||
},
|
||||
diySeckillInterval() {
|
||||
return this.$store.state.diySeckillInterval;
|
||||
},
|
||||
|
||||
@@ -41,6 +41,7 @@ export default {
|
||||
bgUrl: '',
|
||||
textImgPosLink: 'left'
|
||||
},
|
||||
goodsFormVal: []
|
||||
}
|
||||
},
|
||||
onLoad(data) {
|
||||
@@ -78,11 +79,13 @@ export default {
|
||||
onShow() {
|
||||
},
|
||||
methods: {
|
||||
detailChangeVal(data) {
|
||||
this.goodsFormVal = data;
|
||||
},
|
||||
// 处理商品详情数据
|
||||
handleGoodsSkuData() {
|
||||
// this.navbarData.title = this.goodsSkuDetail.goods_name.length > 9 ? this.goodsSkuDetail.goods_name.substr(0, 9) + "..." : this.goodsSkuDetail.goods_name;
|
||||
//设置标题
|
||||
// this.$langConfig.title(this.navbarData.title);
|
||||
this.navbarData.title = this.goodsSkuDetail.goods_name.length > 9 ? this.goodsSkuDetail.goods_name.substr(0, 9) + "..." : this.goodsSkuDetail.goods_name;
|
||||
this.$langConfig.title(this.navbarData.title);
|
||||
if (this.goodsSkuDetail.config) {
|
||||
this.navbarData.navBarSwitch = this.goodsSkuDetail.config.nav_bar_switch;
|
||||
}
|
||||
@@ -106,7 +109,9 @@ export default {
|
||||
whetherCollection: this.goodsSkuDetail.is_collect,
|
||||
evaluateConfig: this.goodsSkuDetail.evaluate_config,
|
||||
evaluateList: this.goodsSkuDetail.evaluate_list,
|
||||
evaluateCount: this.goodsSkuDetail.evaluate_count
|
||||
evaluateCount: this.goodsSkuDetail.evaluate_count,
|
||||
goods_class : this.goodsSkuDetail.goods_class,
|
||||
sale_store: this.goodsSkuDetail.sale_store
|
||||
});
|
||||
|
||||
//媒体
|
||||
@@ -183,9 +188,10 @@ export default {
|
||||
};
|
||||
if (this.$refs.goodsPromotion) this.$refs.goodsPromotion.refresh(this.goodsSkuDetail.goods_promotion);
|
||||
|
||||
if (this.goodsRoute != '/pages/goods/detail') this.setPublicShare();
|
||||
this.setPublicShare();
|
||||
// if (this.goodsRoute != '/pages/goods/detail') this.setPublicShare();
|
||||
|
||||
// this.getBarrageData();
|
||||
this.getBarrageData();
|
||||
if (this.addonIsExist.form) {
|
||||
this.getGoodsForm();
|
||||
}
|
||||
@@ -312,7 +318,8 @@ export default {
|
||||
setPublicShare() {
|
||||
let shareUrl = this.$config.h5Domain + this.shareUrl;
|
||||
if (this.memberInfo && this.memberInfo.member_id) shareUrl += '&source_member=' + this.memberInfo.member_id;
|
||||
|
||||
var store_info = this.$store.state.globalStoreInfo;
|
||||
if (store_info) shareUrl+= '&store_id=' + store_info.store_id;
|
||||
this.$util.setPublicShare({
|
||||
title: this.goodsSkuDetail.goods_name,
|
||||
desc: '',
|
||||
@@ -341,6 +348,8 @@ export default {
|
||||
*/
|
||||
onShareAppMessage(res) {
|
||||
var path = this.shareUrl;
|
||||
var store_info = this.$store.state.globalStoreInfo;
|
||||
if (store_info) path+= '&store_id=' + store_info.store_id;
|
||||
if (this.memberInfo && this.memberInfo.member_id) path += '&source_member=' + this.memberInfo.member_id;
|
||||
return {
|
||||
title: this.goodsSkuDetail.sku_name,
|
||||
@@ -358,6 +367,8 @@ export default {
|
||||
// #ifdef MP-WEIXIN
|
||||
onShareTimeline() {
|
||||
let query = this.shareQuery;
|
||||
var store_info = this.$store.state.globalStoreInfo;
|
||||
if (store_info) query+= '&store_id=' + store_info.store_id;
|
||||
if (this.memberInfo && this.memberInfo.member_id) query += '&source_member=' + this.memberInfo.member_id;
|
||||
return {
|
||||
title: this.goodsSkuDetail.sku_name,
|
||||
|
||||
@@ -285,7 +285,7 @@ function replaceAnnotation(html) {
|
||||
function replaceImage(html) {
|
||||
|
||||
// #ifdef MP
|
||||
let info = uni.getSystemInfoSync();
|
||||
let info = uni.getWindowInfo();
|
||||
var screenWidth = info.windowWidth;
|
||||
screenWidth -= 20;
|
||||
screenWidth += 'px';
|
||||
@@ -304,7 +304,7 @@ function replaceImage(html) {
|
||||
}
|
||||
function replaceVideo(html){
|
||||
// #ifdef MP
|
||||
let info = uni.getSystemInfoSync();
|
||||
let info = uni.getWindowInfo();
|
||||
var screenWidth = info.windowWidth;
|
||||
screenWidth -= 20;
|
||||
screenWidth += 'px';
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import Config from './config.js'
|
||||
import Util from './util.js'
|
||||
import store from '@/store/index.js'
|
||||
import { Utils } from 'common/js/map-wx-jssdk.js';
|
||||
|
||||
// #ifdef H5
|
||||
const app_type = Util.isWeiXin() ? 'wechat' : 'h5';
|
||||
@@ -187,7 +188,30 @@ export default {
|
||||
});
|
||||
}
|
||||
},
|
||||
needMd5Fn(params,callback) {
|
||||
uni.request({
|
||||
url: Config.baseUrl + '/api/config/getApiConfig',
|
||||
method: 'POST',
|
||||
header: {
|
||||
'content-type': 'application/x-www-form-urlencoded;application/json'
|
||||
},
|
||||
data: {
|
||||
app_type,
|
||||
app_type_name,
|
||||
},
|
||||
dataType: 'json',
|
||||
responseType: 'text',
|
||||
success: res => {
|
||||
var sign_str = Utils.hexMD5('key=' + res.data.data.key+'&time='+res.data.data.time)
|
||||
typeof callback == 'function' && callback(sign_str,res.data.data.time);
|
||||
},
|
||||
fail: () => {
|
||||
typeof params.fail == 'function' && params.fail(res);
|
||||
}
|
||||
});
|
||||
},
|
||||
uploadBase64(params) {
|
||||
this.needMd5Fn(params,(sign_str,time)=>{
|
||||
uni.request({
|
||||
url: Config.baseUrl + '/api/upload/headimgBase64',
|
||||
method: 'POST',
|
||||
@@ -197,7 +221,10 @@ export default {
|
||||
data: {
|
||||
app_type,
|
||||
app_type_name,
|
||||
images: params.base64
|
||||
images: params.base64,
|
||||
token: store.state.token || '',
|
||||
sign: sign_str,
|
||||
time: time
|
||||
},
|
||||
dataType: 'json',
|
||||
responseType: 'text',
|
||||
@@ -208,8 +235,10 @@ export default {
|
||||
typeof params.fail == 'function' && params.fail(res);
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
pullImage(params) {
|
||||
this.needMd5Fn(params,(sign_str,time)=>{
|
||||
uni.request({
|
||||
url: Config.baseUrl + '/api/upload/headimgPull',
|
||||
method: 'POST',
|
||||
@@ -219,7 +248,10 @@ export default {
|
||||
data: {
|
||||
app_type,
|
||||
app_type_name,
|
||||
path: params.path
|
||||
path: params.path,
|
||||
token: store.state.token || '',
|
||||
sign: sign_str,
|
||||
time: time
|
||||
},
|
||||
dataType: 'json',
|
||||
responseType: 'text',
|
||||
@@ -230,6 +262,7 @@ export default {
|
||||
typeof params.fail == 'function' && params.fail(res);
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
upload(params) {
|
||||
uni.uploadFile({
|
||||
@@ -240,6 +273,7 @@ export default {
|
||||
formData: {
|
||||
app_type,
|
||||
app_type_name,
|
||||
token: store.state.token || ''
|
||||
},
|
||||
header: {
|
||||
'content-type': 'application/x-www-form-urlencoded;application/json'
|
||||
|
||||
@@ -1121,5 +1121,7 @@ class QQMapWX {
|
||||
Utils.locationProcess(options, locationsuccess);
|
||||
}
|
||||
};
|
||||
|
||||
module.exports = QQMapWX;
|
||||
module.exports = {
|
||||
Utils,
|
||||
QQMapWX
|
||||
};
|
||||
|
||||
@@ -19,15 +19,15 @@ function openMapByAndroid(latitude, longitude, name) {
|
||||
if (plus.runtime.isApplicationExist({
|
||||
pname: 'com.baidu.BaiduMap'
|
||||
})) {
|
||||
url =
|
||||
`baidumap://map/marker?location=${latitude},${longitude}&title=${name}&coord_type=gcj02&src=andr.baidu.openAPIdemo`
|
||||
identity = 'com.baidu.BaiduMap'
|
||||
url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&coord_type=gcj02&src=andr.baidu.openAPIdemo`;
|
||||
identity = 'com.baidu.BaiduMap';
|
||||
openURL(url, identity)
|
||||
} else if (plus.runtime.isApplicationExist({
|
||||
pname: 'com.autonavi.minimap'
|
||||
})) { // 高德
|
||||
url = `androidamap://viewMap?sourceApplication=appname&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`
|
||||
identity = 'com.autonavi.minimap'
|
||||
})) {
|
||||
// 高德
|
||||
url = `androidamap://viewMap?sourceApplication=appname&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`;
|
||||
identity = 'com.autonavi.minimap';
|
||||
openURL(url, identity)
|
||||
} else {
|
||||
openMapByDefault(latitude, longitude, name)
|
||||
@@ -42,13 +42,13 @@ function openMapByIos(latitude, longitude, name) {
|
||||
if (plus.runtime.isApplicationExist({
|
||||
action: 'baidumap://'
|
||||
})) {
|
||||
url =
|
||||
`baidumap://map/marker?location=${latitude},${longitude}&title=${name}&content=${name}&src=ios.baidu.openAPIdemo&coord_type=gcj02`;
|
||||
url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&content=${name}&src=ios.baidu.openAPIdemo&coord_type=gcj02`;
|
||||
openURL(url, identity)
|
||||
} else if (plus.runtime.isApplicationExist({
|
||||
action: 'iosamap://'
|
||||
})) { // 高德
|
||||
url = `iosamap://viewMap?sourceApplication=applicationName&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`
|
||||
})) {
|
||||
// 高德
|
||||
url = `iosamap://viewMap?sourceApplication=applicationName&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`;
|
||||
openURL(url, identity)
|
||||
} else {
|
||||
openMapByDefault(latitude, longitude, name)
|
||||
|
||||
288
common/js/navigation.js
Normal file
288
common/js/navigation.js
Normal file
@@ -0,0 +1,288 @@
|
||||
import { EventSafety } from './event-safety'
|
||||
|
||||
export class NavigationHelper {
|
||||
constructor() {
|
||||
this.navigationCache = new Map()
|
||||
}
|
||||
|
||||
// 安全地获取导航栏高度
|
||||
async getNavigationHeight(component, options = {}) {
|
||||
const cacheKey = `nav_height`
|
||||
|
||||
// 检查缓存
|
||||
if (this.navigationCache.has(cacheKey) && !options.forceRefresh) {
|
||||
return this.navigationCache.get(cacheKey)
|
||||
}
|
||||
|
||||
// 获取高度
|
||||
try {
|
||||
// 尝试直接获取 uni-page-head
|
||||
const height = await this.getDirectNavigationHeight(component)
|
||||
if (height > 0) {
|
||||
this.navigationCache.set(cacheKey, height)
|
||||
return height
|
||||
}
|
||||
|
||||
// 备用方案:平台特定方法
|
||||
const platformHeight = await this.getPlatformNavigationHeight()
|
||||
this.navigationCache.set(cacheKey, platformHeight)
|
||||
return platformHeight
|
||||
} catch (error) {
|
||||
console.warn('获取导航栏高度失败,使用默认值:', error)
|
||||
const defaultHeight = this.getDefaultNavHeight()
|
||||
this.navigationCache.set(cacheKey, defaultHeight)
|
||||
return defaultHeight
|
||||
}
|
||||
}
|
||||
|
||||
// 直接查询导航栏高度
|
||||
getDirectNavigationHeight(component) {
|
||||
return new Promise((resolve) => {
|
||||
const query = uni.createSelectorQuery().in(component)
|
||||
|
||||
query.select('.uni-page-head').boundingClientRect((rect) => {
|
||||
if (rect && rect.height > 0) {
|
||||
console.log('直接查询导航栏高度成功:', rect.height)
|
||||
resolve(rect.height)
|
||||
} else {
|
||||
console.warn('未找到 uni-page-head 元素或高度为0')
|
||||
resolve(0)
|
||||
}
|
||||
}).exec()
|
||||
})
|
||||
}
|
||||
|
||||
// 平台特定的高度获取
|
||||
getPlatformNavigationHeight() {
|
||||
return new Promise((resolve) => {
|
||||
// #ifdef MP-WEIXIN
|
||||
// 微信小程序精确计算
|
||||
try {
|
||||
const menuButtonInfo = wx.getMenuButtonBoundingClientRect()
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
|
||||
const height = menuButtonInfo.bottom +
|
||||
(menuButtonInfo.top - systemInfo.statusBarHeight)
|
||||
console.log('微信小程序导航栏高度:', height)
|
||||
resolve(height)
|
||||
} catch (error) {
|
||||
console.error('微信小程序高度计算失败:', error)
|
||||
resolve(44)
|
||||
}
|
||||
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
// H5环境:尝试获取自定义导航栏或使用默认值
|
||||
if (typeof document !== 'undefined') {
|
||||
const customNav = document.querySelector('.uni-page-head')
|
||||
if (customNav) {
|
||||
resolve(customNav.offsetHeight)
|
||||
} else {
|
||||
resolve(44) // 默认导航栏高度
|
||||
}
|
||||
} else {
|
||||
resolve(44)
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
// App端:状态栏 + 导航栏
|
||||
try {
|
||||
const statusBarHeight = plus.navigator.getStatusbarHeight()
|
||||
resolve(statusBarHeight + 44)
|
||||
} catch (error) {
|
||||
console.error('App端高度获取失败:', error)
|
||||
resolve(88)
|
||||
}
|
||||
// #endif
|
||||
|
||||
// 默认值
|
||||
resolve(44)
|
||||
})
|
||||
}
|
||||
|
||||
// 获取默认高度
|
||||
getDefaultHeight() {
|
||||
// #ifdef MP-WEIXIN
|
||||
return 44 // 微信小程序默认
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
return 44 // H5默认
|
||||
// #endif
|
||||
// #ifdef APP-PLUS
|
||||
return 88 // App默认(状态栏44 + 导航栏44)
|
||||
// #endif
|
||||
return 44
|
||||
}
|
||||
|
||||
// 获取状态栏高度
|
||||
getStatusBarHeight() {
|
||||
// #ifdef MP-WEIXIN
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
return systemInfo.statusBarHeight || 20
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
return 0 // H5通常没有状态栏
|
||||
// #endif
|
||||
// #ifdef APP-PLUS
|
||||
try {
|
||||
return plus.navigator.getStatusbarHeight()
|
||||
} catch (error) {
|
||||
return 44
|
||||
}
|
||||
// #endif
|
||||
return 0
|
||||
}
|
||||
|
||||
// 获取安全区域
|
||||
getSafeAreaInsets() {
|
||||
try {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
return systemInfo.safeArea || {
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0
|
||||
}
|
||||
} catch (error) {
|
||||
return {
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 创建安全的事件处理器
|
||||
createSafeEventHandler(handler, options = {}) {
|
||||
return EventSafety.wrapEventHandler(handler, options)
|
||||
}
|
||||
|
||||
// 安全地处理服务请求事件
|
||||
createServiceRequestHandler(component) {
|
||||
return this.createSafeEventHandler((event) => {
|
||||
return this.handleServiceRequest(event, component)
|
||||
}, {
|
||||
onError: (error, event) => {
|
||||
this.handleNavigationError(error, event, component)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 处理服务请求
|
||||
async handleServiceRequest(event, component) {
|
||||
console.log('处理导航相关服务请求:', event.type)
|
||||
|
||||
// 安全检查事件目标
|
||||
if (this.shouldProcessNavigationRequest(event)) {
|
||||
await this.processNavigationRequest(event, component)
|
||||
}
|
||||
}
|
||||
|
||||
// 检查是否应该处理导航请求
|
||||
shouldProcessNavigationRequest(event) {
|
||||
// 方法1:检查事件类型
|
||||
if (event.type === 'service.requestComponentInfo') {
|
||||
return true
|
||||
}
|
||||
|
||||
// 方法2:检查目标元素
|
||||
if (event.matches('.navigation-component') || event.matches('.uni-page-head')) {
|
||||
return true
|
||||
}
|
||||
|
||||
// 方法3:检查事件详情
|
||||
if (event.detail && event.detail.componentType === 'navigation') {
|
||||
return true
|
||||
}
|
||||
|
||||
return false
|
||||
}
|
||||
|
||||
// 处理导航请求
|
||||
async processNavigationRequest(event, component) {
|
||||
try {
|
||||
// 获取导航栏信息
|
||||
const navInfo = await this.getNavigationInfo(component)
|
||||
|
||||
// 发送响应
|
||||
this.emitNavigationResponse(navInfo, component)
|
||||
|
||||
} catch (error) {
|
||||
console.error('处理导航请求失败:', error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 获取完整的导航信息
|
||||
async getNavigationInfo(component) {
|
||||
const [navHeight, statusBarHeight, safeArea] = await Promise.all([
|
||||
this.getNavigationHeight(component),
|
||||
this.getStatusBarHeight(),
|
||||
this.getSafeAreaInsets()
|
||||
])
|
||||
|
||||
return {
|
||||
navHeight,
|
||||
statusBarHeight,
|
||||
safeArea,
|
||||
timestamp: Date.now()
|
||||
}
|
||||
}
|
||||
|
||||
// 发送导航响应
|
||||
emitNavigationResponse(navInfo, component) {
|
||||
if (component && component.$emit) {
|
||||
component.$emit('navigation.infoResponse', {
|
||||
success: true,
|
||||
data: navInfo,
|
||||
timestamp: Date.now()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 错误处理
|
||||
handleNavigationError(error, event, component) {
|
||||
console.error('导航处理错误:', {
|
||||
error: error.message,
|
||||
eventType: event?.type,
|
||||
component: component?.$options?.name
|
||||
})
|
||||
|
||||
// 发送错误响应
|
||||
if (component && component.$emit) {
|
||||
component.$emit('navigation.infoError', {
|
||||
success: false,
|
||||
error: error.message,
|
||||
timestamp: Date.now()
|
||||
})
|
||||
}
|
||||
|
||||
// 显示用户友好的错误信息
|
||||
this.showError('导航服务暂时不可用')
|
||||
}
|
||||
|
||||
// 显示错误提示
|
||||
showError(message) {
|
||||
uni.showToast({
|
||||
title: message,
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
|
||||
// 清理缓存
|
||||
clearCache() {
|
||||
this.navigationCache.clear()
|
||||
console.log('导航缓存已清理')
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 创建全局实例
|
||||
const navigationHelper = new NavigationHelper()
|
||||
|
||||
export default navigationHelper
|
||||
@@ -42,6 +42,7 @@ export default {
|
||||
console.log('打开连接');
|
||||
// alert('打开连接')
|
||||
// uni.closeSocket(); // 确保已经关闭后再重新打开
|
||||
|
||||
uni.connectSocket({
|
||||
url: config.webSocket,
|
||||
method: 'POST',
|
||||
@@ -53,6 +54,12 @@ export default {
|
||||
console.log('连接失败 connectSocket=', err);
|
||||
}
|
||||
});
|
||||
// 监听 WebSocket 连接错误事件
|
||||
uni.onSocketError((res)=>{
|
||||
console.error('WebSocket 连接失败:', res.errMsg);
|
||||
this.chatListInit();
|
||||
this.getChatList();
|
||||
});
|
||||
// uni.onSocketOpen((res) => {
|
||||
// console.log('连接成功', res);
|
||||
// });
|
||||
@@ -64,6 +71,7 @@ export default {
|
||||
|
||||
let that = this;
|
||||
this.pingInterval = config.pingInterval;
|
||||
if(this.timeoutObj) clearInterval(this.timeoutObj);
|
||||
this.timeoutObj = null;
|
||||
uni.onSocketMessage((res) => { //type:init,connect,close,string,order,goods
|
||||
let msg = JSON.parse(res.data);
|
||||
@@ -81,7 +89,6 @@ export default {
|
||||
// 监听到有新服务器消息
|
||||
getSocketMsg(reData) { // 监听到服务器消息
|
||||
let that = this;
|
||||
// console.log(reData)
|
||||
let giveMsg = JSON.parse(reData);
|
||||
let data = {
|
||||
isItMe: false,
|
||||
@@ -102,6 +109,7 @@ export default {
|
||||
} else {
|
||||
that.servicer_id = 0;
|
||||
}
|
||||
that.chatListInit();
|
||||
that.getChatList();
|
||||
}
|
||||
})
|
||||
|
||||
@@ -8,13 +8,13 @@ import {
|
||||
export default {
|
||||
/**
|
||||
* 页面跳转
|
||||
* @param {string} to 跳转链接 /pages/idnex/index
|
||||
* @param {string} to 跳转链接 /pages/index/index
|
||||
* @param {Object} param 参数 {key : value, ...}
|
||||
* @param {string} mode 模式
|
||||
*/
|
||||
redirectTo(to, param, mode) {
|
||||
let url = to;
|
||||
let tabbarList = ['/pages/index/index', '/pages/goods/category', '/pages/vr/index', '/pages/contact/contact', '/pages/member/index'];
|
||||
let tabbarList = ['/pages/index/index', '/pages/goods/category', '/pages/goods/cart', '/pages/member/index'];
|
||||
if (param != undefined) {
|
||||
Object.keys(param).forEach(function(key) {
|
||||
if (url.indexOf('?') != -1) {
|
||||
@@ -26,6 +26,8 @@ export default {
|
||||
}
|
||||
for (let i = 0; i < tabbarList.length; i++) {
|
||||
if (url.indexOf(tabbarList[i]) == 0) {
|
||||
if(url.split('?')[1]) uni.setStorageSync('tabBarParams',url.split('?')[1]);
|
||||
else uni.removeStorageSync('tabBarParams')
|
||||
uni.switchTab({
|
||||
url
|
||||
});
|
||||
@@ -64,8 +66,6 @@ export default {
|
||||
* @param {Object} params 参数,针对商品、相册里面的图片区分大中小,size: big、mid、small
|
||||
*/
|
||||
img(img_path, params) {
|
||||
|
||||
|
||||
var path = "";
|
||||
if (img_path != undefined && img_path != "") {
|
||||
if (img_path.split(',').length > 1) {
|
||||
@@ -78,19 +78,17 @@ export default {
|
||||
arr.pop();
|
||||
arr[arr.length - 1] = arr[arr.length - 1] + "_" + params.size.toUpperCase();
|
||||
arr.push(suffix);
|
||||
// if(img_path.indexOf('attachment') == -1){
|
||||
// img_path = arr.join(".");
|
||||
// }
|
||||
|
||||
img_path = arr.join(".");
|
||||
}
|
||||
if (img_path.indexOf("http://") == -1 && img_path.indexOf("https://") == -1) {
|
||||
path = Config.imgDomain + "/" + img_path;
|
||||
} else {
|
||||
// console.log(img_path)
|
||||
path = img_path;
|
||||
}
|
||||
if (Config.h5Domain.indexOf('https://') != -1) {
|
||||
path = path.replace('http://', 'https://');
|
||||
}
|
||||
}
|
||||
|
||||
// path += '?t=' + parseInt(new Date().getTime() / 1000);
|
||||
return path;
|
||||
},
|
||||
@@ -98,7 +96,7 @@ export default {
|
||||
* 时间戳转日期格式
|
||||
* @param {Object} timeStamp
|
||||
*/
|
||||
timeStampTurnTime(timeStamp, type = "") {
|
||||
timeStampTurnTime(timeStamp, format = "Y-m-d H:i:s") {
|
||||
if (timeStamp != undefined && timeStamp != "" && timeStamp > 0) {
|
||||
var date = new Date();
|
||||
date.setTime(timeStamp * 1000);
|
||||
@@ -113,14 +111,15 @@ export default {
|
||||
var second = date.getSeconds();
|
||||
minute = minute < 10 ? ('0' + minute) : minute;
|
||||
second = second < 10 ? ('0' + second) : second;
|
||||
if (type) {
|
||||
if (type == 'yearMonthDay') {
|
||||
return y + '年' + m + '月' + d + '日';
|
||||
}
|
||||
return y + '-' + m + '-' + d;
|
||||
} else {
|
||||
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
|
||||
}
|
||||
|
||||
format = format.replace('Y', y);
|
||||
format = format.replace('m', m);
|
||||
format = format.replace('d', d);
|
||||
format = format.replace('H', h);
|
||||
format = format.replace('i', minute);
|
||||
format = format.replace('s', second);
|
||||
|
||||
return format;
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
@@ -275,7 +274,7 @@ export default {
|
||||
count: imgs_num,
|
||||
sizeType: ['compressed'], //可以指定是原图还是压缩图,默认二者都有
|
||||
sourceType: ['album', 'camera'], //从相册或者拍照
|
||||
success: async function (res) {
|
||||
success: async (res) => {
|
||||
const tempFilePaths = res.tempFilePaths;
|
||||
var _data = data;
|
||||
var imgs = [];
|
||||
@@ -283,9 +282,16 @@ export default {
|
||||
title: '图片上传中'
|
||||
})
|
||||
for (var i = 0; i < tempFilePaths.length; i++) {
|
||||
try {
|
||||
var path = await _self.upload_file_server(tempFilePaths[i], _data, params.path,
|
||||
url);
|
||||
imgs.push(path);
|
||||
} catch (e) {
|
||||
this.showToast({
|
||||
title: e,
|
||||
});
|
||||
break;
|
||||
}
|
||||
if (imgs.length == tempFilePaths.length) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
@@ -297,12 +303,13 @@ export default {
|
||||
}
|
||||
},
|
||||
fail: err => {
|
||||
uni.hideLoading()
|
||||
if (err.errMsg != 'chooseImage:fail cancel') {
|
||||
uni.showToast({
|
||||
title: '上传失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
//上传
|
||||
@@ -319,13 +326,25 @@ export default {
|
||||
name: 'file',
|
||||
fileType: data.fileType || 'image',
|
||||
formData: data,
|
||||
success: function (res) {
|
||||
success: (res) => {
|
||||
var path_str = JSON.parse(res.data);
|
||||
if (path_str.code >= 0) {
|
||||
resolve(path_str.data.pic_path);
|
||||
typeof callback == 'function' && callback(path_str.data.pic_path);
|
||||
} else {
|
||||
reject("error");
|
||||
reject(path_str.message);
|
||||
}
|
||||
uni.hideLoading();
|
||||
},
|
||||
fail: (res) => {
|
||||
if (res.statusCode != 200) {
|
||||
reject(res.errMsg || '上传错误');
|
||||
uni.hideLoading();
|
||||
}
|
||||
},
|
||||
complete: (res) => {
|
||||
if (res.statusCode != 200) {
|
||||
reject('服务器发生错误');
|
||||
uni.hideLoading();
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -395,7 +414,7 @@ export default {
|
||||
* 检测苹果X以上的手机
|
||||
*/
|
||||
isIPhoneX() {
|
||||
let res = uni.getSystemInfoSync();
|
||||
let res = uni.getDeviceInfo();
|
||||
if (res.model.search('iPhone X') != -1) {
|
||||
return true;
|
||||
}
|
||||
@@ -403,7 +422,7 @@ export default {
|
||||
},
|
||||
//判断安卓还是iOS
|
||||
isAndroid() {
|
||||
let platform = uni.getSystemInfoSync().platform
|
||||
let platform = uni.getDeviceInfo().platform
|
||||
if (platform == 'ios') {
|
||||
return false;
|
||||
} else if (platform == 'android') {
|
||||
@@ -431,16 +450,43 @@ export default {
|
||||
}
|
||||
return cloneObj
|
||||
},
|
||||
/**
|
||||
* 打开微信企业客服
|
||||
* @param {Function} fallbackFunc 降级处理函数
|
||||
*/
|
||||
openWxWorkServiceChat(fallbackFunc) {
|
||||
// #ifdef MP-WEIXIN
|
||||
let wxworkConfig = store.state?.wxworkConfig
|
||||
if (wxworkConfig?.enable && wxworkConfig?.contact_url) {
|
||||
// 直接使用活码链接跳转
|
||||
wx.navigateToMiniProgram({
|
||||
appId: 'wxeb490c6f9b154ef9', // 是企业微信官方小程序的AppID(固定值, 由腾讯企业微信团队维护, 不需要修改,用于展示"添加企业微信联系人"的官方页面)
|
||||
path: `pages/contacts/externalContactDetail?url=${encodeURIComponent(wxworkConfig?.contact_url)}`,
|
||||
success: () => {
|
||||
console.log('跳转企业微信成功');
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('跳转企业微信失败:', err);
|
||||
// 降级处理:使用原有客服方式
|
||||
fallbackFunc && fallbackFunc();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
fallbackFunc && fallbackFunc();
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
|
||||
/**
|
||||
* 自定义模板的跳转链接
|
||||
* @param {Object} link
|
||||
*/
|
||||
diyRedirectTo(link) {
|
||||
|
||||
//if (link == null || Object.keys(link).length == 1) return;
|
||||
if (link == null || Object.keys(link).length == 1) return;
|
||||
|
||||
// 外部链接
|
||||
if (link.wap_url && link.wap_url.indexOf('http') != -1 || link.wap_url && link.wap_url.indexOf('http') != -1) {
|
||||
if (link.wap_url && link.wap_url.indexOf('http') != -1 || link.wap_url && link.wap_url.indexOf('https') != -1) {
|
||||
|
||||
// #ifdef H5
|
||||
window.location.href = link.wap_url;
|
||||
// #endif
|
||||
@@ -464,10 +510,8 @@ export default {
|
||||
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: link.mobile,
|
||||
success: (res) => {
|
||||
},
|
||||
fail: (res) => {
|
||||
}
|
||||
success: (res) => {},
|
||||
fail: (res) => {}
|
||||
});
|
||||
|
||||
} else if (link.name == 'MEMBER_CONTACT') {
|
||||
@@ -494,6 +538,7 @@ export default {
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
this.openWxWorkServiceChat(() => {
|
||||
wx.openCustomerServiceChat({
|
||||
extInfo: {
|
||||
url: config.wxwork_url
|
||||
@@ -504,6 +549,8 @@ export default {
|
||||
sendMessagePath: 'this.sendMessagePath',
|
||||
sendMessageImg: 'this.sendMessageImg'
|
||||
});
|
||||
});
|
||||
|
||||
// #endif
|
||||
break;
|
||||
case 'third':
|
||||
@@ -554,9 +601,12 @@ export default {
|
||||
*/
|
||||
uniappIsIPhoneX() {
|
||||
let isIphoneX = false;
|
||||
let systemInfo = uni.getSystemInfoSync();
|
||||
let deviceInfo = uni.getDeviceInfo();
|
||||
let windowInfo = uni.getWindowInfo();
|
||||
// #ifdef MP
|
||||
if (systemInfo.model.search('iPhone X') != -1 || systemInfo.model.search('iPhone 11') != -1 || systemInfo.model.search('iPhone 12') != -1 || systemInfo.model.search('iPhone 13') != -1) {
|
||||
if (deviceInfo.model.search('iPhone X') != -1 || deviceInfo.model.search('iPhone 11') != -1 || deviceInfo.model
|
||||
.search('iPhone 12') != -1 || deviceInfo.model.search('iPhone 13') != -1 || parseInt(deviceInfo.model.split(
|
||||
'iPhone')[1]) > 13) {
|
||||
isIphoneX = true;
|
||||
}
|
||||
// #endif
|
||||
@@ -565,11 +615,11 @@ export default {
|
||||
var u = navigator.userAgent;
|
||||
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
|
||||
if (isIOS) {
|
||||
if (systemInfo.screenWidth == 375 && systemInfo.screenHeight == 812 && systemInfo.pixelRatio == 3) {
|
||||
if (windowInfo.screenWidth == 375 && windowInfo.screenHeight == 812 && deviceInfo.pixelRatio == 3) {
|
||||
isIphoneX = true;
|
||||
} else if (systemInfo.screenWidth == 414 && systemInfo.screenHeight == 896 && systemInfo.pixelRatio == 3) {
|
||||
} else if (windowInfo.screenWidth == 414 && windowInfo.screenHeight == 896 && deviceInfo.pixelRatio == 3) {
|
||||
isIphoneX = true;
|
||||
} else if (systemInfo.screenWidth == 414 && systemInfo.screenHeight == 896 && systemInfo.pixelRatio == 2) {
|
||||
} else if (windowInfo.screenWidth == 414 && windowInfo.screenHeight == 896 && deviceInfo.pixelRatio == 2) {
|
||||
isIphoneX = true;
|
||||
}
|
||||
}
|
||||
@@ -581,9 +631,9 @@ export default {
|
||||
*/
|
||||
uniappIsIPhone11() {
|
||||
let isIphone11 = false;
|
||||
let systemInfo = uni.getSystemInfoSync();
|
||||
let deviceInfo = uni.getDeviceInfo();
|
||||
// #ifdef MP
|
||||
if (systemInfo.model.search('iPhone 11') != -1) {
|
||||
if (deviceInfo.model.search('iPhone 11') != -1) {
|
||||
isIphone11 = true;
|
||||
}
|
||||
// #endif
|
||||
@@ -592,7 +642,6 @@ export default {
|
||||
// #ifdef H5
|
||||
//判断该浏览器是否为safaria浏览器
|
||||
isSafari() {
|
||||
let res = uni.getSystemInfoSync();
|
||||
var ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf('applewebkit') > -1 && ua.indexOf('mobile') > -1 && ua.indexOf('safari') > -1 &&
|
||||
ua.indexOf('linux') === -1 && ua.indexOf('android') === -1 && ua.indexOf('chrome') === -1 &&
|
||||
@@ -639,7 +688,6 @@ export default {
|
||||
}
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param val 转化时间字符串 (转化时分秒)
|
||||
* @returns {string}
|
||||
*/
|
||||
@@ -658,7 +706,7 @@ export default {
|
||||
* 获取定位信息
|
||||
*/
|
||||
getLocation(param = {}) {
|
||||
/*uni.getLocation({
|
||||
uni.getLocation({
|
||||
type: param.type ?? 'gcj02',
|
||||
success: res => {
|
||||
store.commit('setLocation', res);
|
||||
@@ -670,7 +718,7 @@ export default {
|
||||
complete: res => {
|
||||
typeof param.complete == 'function' && param.complete(res);
|
||||
}
|
||||
});*/
|
||||
});
|
||||
},
|
||||
// 计算两个经纬度之间的距离
|
||||
getDistance(lat1, lng1, lat2, lng2) {
|
||||
@@ -678,8 +726,8 @@ export default {
|
||||
var radLat2 = lat2 * Math.PI / 180.0;
|
||||
var a = radLat1 - radLat2;
|
||||
var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
|
||||
var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) +
|
||||
Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
|
||||
var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(
|
||||
Math.sin(b / 2), 2)));
|
||||
s = s * 6378.137; // EARTH_RADIUS;
|
||||
s = Math.round(s * 10000) / 10000;
|
||||
return s;
|
||||
@@ -706,7 +754,7 @@ export default {
|
||||
/**
|
||||
* 微信订阅消息
|
||||
*/
|
||||
subscribeMessage(keywords) {
|
||||
subscribeMessage(keywords, callback) {
|
||||
// #ifdef MP-WEIXIN
|
||||
let url = '/weapp/api/weapp/messagetmplids';
|
||||
// #endif
|
||||
@@ -728,6 +776,9 @@ export default {
|
||||
},
|
||||
fail: (res) => {
|
||||
console.log('fail', res)
|
||||
},
|
||||
complete: (res) => {
|
||||
typeof callback == 'function' && callback();
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
@@ -740,10 +791,18 @@ export default {
|
||||
},
|
||||
fail: res => {
|
||||
console.log('fail', res)
|
||||
},
|
||||
complete: (res) => {
|
||||
typeof callback == 'function' && callback();
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
} else {
|
||||
typeof callback == 'function' && callback();
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
typeof callback == 'function' && callback();
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -776,10 +835,8 @@ export default {
|
||||
title: shareConfig.title,
|
||||
path: shareConfig.path,
|
||||
imageUrl: shareConfig.imageUrl,
|
||||
success: res => {
|
||||
},
|
||||
fail: res => {
|
||||
}
|
||||
success: res => {},
|
||||
fail: res => {}
|
||||
}
|
||||
//分享到朋友圈
|
||||
let query = '';
|
||||
@@ -815,8 +872,7 @@ export default {
|
||||
Http.sendRequest({
|
||||
url: '/wechat/api/wechat/jssdkconfig',
|
||||
data: {
|
||||
url: uni.getSystemInfoSync().platform == 'ios' ? uni.getStorageSync('initUrl') : window.location
|
||||
.href
|
||||
url: uni.getDeviceInfo().platform == 'ios' ? uni.getStorageSync('initUrl') : window.location.href
|
||||
},
|
||||
success: res => {
|
||||
if (res.code == 0) {
|
||||
@@ -839,7 +895,7 @@ export default {
|
||||
//获取当前路由
|
||||
getCurrentRoute() {
|
||||
let currentRoutes = getCurrentPages(); // 获取当前打开过的页面路由数组
|
||||
let currentRoute = currentRoutes[currentRoutes.length - 1].route //获取当前页面路由
|
||||
let currentRoute = currentRoutes[currentRoutes.length - 1].route; //获取当前页面路由
|
||||
let currentParam = currentRoutes[currentRoutes.length - 1].options; //获取路由参数
|
||||
// 拼接参数
|
||||
let param = [];
|
||||
@@ -919,12 +975,10 @@ export default {
|
||||
var points_D = [];
|
||||
var points_E = [];
|
||||
const DIST_AB = Math.sqrt(Math.pow(points[1]['x'] - points[0]['x'], 2) + Math.pow(points[1]['y'] - points[0][
|
||||
'y'
|
||||
], 2));
|
||||
'y'], 2));
|
||||
// 邻控制BC点间距
|
||||
const DIST_BC = Math.sqrt(Math.pow(points[2]['x'] - points[1]['x'], 2) + Math.pow(points[2]['y'] - points[1][
|
||||
'y'
|
||||
], 2));
|
||||
'y'], 2));
|
||||
// D每次在AB方向上移动的距离
|
||||
if (points[0]['x'] > points[2]['x']) {
|
||||
var EACH_MOVE_AD = -(DIST_AB / times);
|
||||
@@ -986,5 +1040,157 @@ export default {
|
||||
verifyMobile(mobile) {
|
||||
var parse = /^\d{11}$/.test(mobile);
|
||||
return parse;
|
||||
},
|
||||
// 获取缓存key
|
||||
getStorageKey(key) {
|
||||
return Config.storagePrefix + key;
|
||||
},
|
||||
// 重写uni缓存方法
|
||||
rewriteUniStorageMethod() {
|
||||
const setStorageSync = uni.setStorageSync;
|
||||
const setStorage = uni.setStorage;
|
||||
const getStorage = uni.getStorage;
|
||||
const getStorageSync = uni.getStorageSync;
|
||||
const removeStorage = uni.removeStorage;
|
||||
const removeStorageSync = uni.removeStorageSync;
|
||||
|
||||
uni.setStorage = (options) => {
|
||||
options.key = this.getStorageKey(options.key);
|
||||
setStorage(options)
|
||||
};
|
||||
|
||||
uni.setStorageSync = (key, data) => {
|
||||
setStorageSync(this.getStorageKey(key), data)
|
||||
};
|
||||
|
||||
uni.getStorage = (options) => {
|
||||
options.key = this.getStorageKey(options.key);
|
||||
getStorage(options)
|
||||
};
|
||||
|
||||
uni.getStorageSync = (key) => {
|
||||
return getStorageSync(this.getStorageKey(key))
|
||||
};
|
||||
|
||||
uni.removeStorage = (options) => {
|
||||
options.key = this.getStorageKey(options.key);
|
||||
removeStorage(options)
|
||||
};
|
||||
|
||||
uni.removeStorageSync = (key) => {
|
||||
return removeStorageSync(this.getStorageKey(key))
|
||||
}
|
||||
},
|
||||
//生成唯一id
|
||||
generateUUID() {
|
||||
var d = new Date().getTime(); //Timestamp
|
||||
var d2 = (performance && performance.now && (performance.now() * 1000)) ||
|
||||
0; //Time in microseconds since page-load or 0 if unsupported
|
||||
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
|
||||
var r = Math.random() * 16; //random number between 0 and 16
|
||||
if (d > 0) { //Use timestamp until depleted
|
||||
r = (d + r) % 16 | 0;
|
||||
d = Math.floor(d / 16);
|
||||
} else { //Use microseconds since page-load if supported
|
||||
r = (d2 + r) % 16 | 0;
|
||||
d2 = Math.floor(d2 / 16);
|
||||
}
|
||||
return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16);
|
||||
});
|
||||
},
|
||||
// 获取弹新人礼弹框页面
|
||||
openRegisterRewardPath(back) {
|
||||
return uni.getStorageSync('initiateLogin') || back;
|
||||
},
|
||||
// 登录完成后返回页面
|
||||
loginComplete(back, mode) {
|
||||
let url = uni.getStorageSync('initiateLogin') || back;
|
||||
uni.removeStorageSync('initiateLogin')
|
||||
|
||||
let jump = true;
|
||||
let arr = getCurrentPages().reverse();
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (url.indexOf(arr[i].route) != -1) {
|
||||
jump = false;
|
||||
uni.navigateBack({
|
||||
delta: i
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (jump) {
|
||||
this.redirectTo(url, {}, 'redirectTo')
|
||||
}
|
||||
},
|
||||
// 微信提现收款
|
||||
merchantTransfer(data,withdrawInfo,callback) {
|
||||
Http.sendRequest({
|
||||
url: '/wechatpay/api/transfer/transfer',
|
||||
data: data,
|
||||
success: res => {
|
||||
if (res.code == 0) {
|
||||
uni.hideLoading();
|
||||
// #ifdef MP-WEIXIN
|
||||
if (wx.canIUse('requestMerchantTransfer')) {
|
||||
wx.requestMerchantTransfer({
|
||||
mchId: withdrawInfo.mch_id,
|
||||
appId: withdrawInfo.app_id,
|
||||
package: res.data.package_info,
|
||||
success: (res) => {
|
||||
typeof callback == 'function' && callback(res);
|
||||
},
|
||||
fail: (res) => {
|
||||
typeof callback == 'function' && callback(res);
|
||||
},
|
||||
});
|
||||
} else {
|
||||
wx.showModal({
|
||||
content: '你的微信版本过低,请更新至最新版本。',
|
||||
showCancel: false,
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
if (this.isWeiXin()) {
|
||||
if (uni.getDeviceInfo().platform == 'ios') {
|
||||
var url = uni.getStorageSync('initUrl');
|
||||
} else {
|
||||
var url = location.href;
|
||||
}
|
||||
// 获取jssdk配置
|
||||
Http.sendRequest({
|
||||
url: '/wechat/api/wechat/jssdkconfig',
|
||||
data: {
|
||||
url: url
|
||||
},
|
||||
success: jssdkRes => {
|
||||
var wxJS = new Weixin();
|
||||
wxJS.init(jssdkRes.data);
|
||||
wxJS.withdrawWechat({
|
||||
mch_id: withdrawInfo.mch_id,
|
||||
wechat_appid: withdrawInfo.app_id,
|
||||
package_info: res.data.package_info
|
||||
},
|
||||
res => {
|
||||
typeof callback == 'function' && callback(res);
|
||||
},
|
||||
);
|
||||
}
|
||||
})
|
||||
}
|
||||
// #endif
|
||||
} else {
|
||||
this.showToast({
|
||||
title: res.message,
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: err => {
|
||||
this.showToast({
|
||||
title: err.message,
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
@@ -112,6 +112,29 @@ let Weixin = function () {
|
||||
})
|
||||
}
|
||||
|
||||
// 提现
|
||||
this.withdrawWechat = function (data,callback) {
|
||||
wx.ready(function () {
|
||||
wx.checkJsApi({
|
||||
jsApiList: ['requestMerchantTransfer'],
|
||||
success: function (res) {
|
||||
if (res.checkResult['requestMerchantTransfer']) {
|
||||
WeixinJSBridge.invoke('requestMerchantTransfer', {
|
||||
mchId: data.mch_id,
|
||||
appId: data.wechat_appid,
|
||||
package: data.package_info,
|
||||
},
|
||||
function (res) {
|
||||
typeof callback == 'function' && callback(res);
|
||||
}
|
||||
);
|
||||
} else {
|
||||
alert('你的微信版本过低,请更新至最新版本。');
|
||||
}
|
||||
},
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export {
|
||||
|
||||
187
common/js/wxwork-jssdk.js
Normal file
187
common/js/wxwork-jssdk.js
Normal file
@@ -0,0 +1,187 @@
|
||||
/**
|
||||
* 企业微信JS-SDK调用
|
||||
*/
|
||||
let WxWork = function () {
|
||||
// 企业微信JS-SDK
|
||||
this.wxwork = null;
|
||||
|
||||
/**
|
||||
* 初始化企业微信JS-SDK
|
||||
* @param {Object} params - 初始化参数
|
||||
* @param {string} params.corpId - 企业ID
|
||||
* @param {string} params.agentId - 应用ID
|
||||
* @param {string} params.timestamp - 时间戳
|
||||
* @param {string} params.nonceStr - 随机字符串
|
||||
* @param {string} params.signature - 签名
|
||||
* @param {Array} params.jsApiList - 需要使用的JS接口列表
|
||||
*/
|
||||
this.init = function (params) {
|
||||
if (typeof wx !== 'undefined' && wx.config) {
|
||||
// 小程序环境下的企业微信
|
||||
this.wxwork = wx;
|
||||
} else if (typeof WWOpenData !== 'undefined') {
|
||||
// H5环境下的企业微信
|
||||
this.wxwork = WWOpenData;
|
||||
} else {
|
||||
console.error('企业微信JS-SDK未加载');
|
||||
return false;
|
||||
}
|
||||
|
||||
this.wxwork.config({
|
||||
beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
|
||||
debug: false, // 开启调试模式
|
||||
corpId: params.corpId, // 必填,企业号的唯一标识
|
||||
agentId: params.agentId, // 必填,企业微信应用ID
|
||||
timestamp: params.timestamp, // 必填,生成签名的时间戳
|
||||
nonceStr: params.nonceStr, // 必填,生成签名的随机串
|
||||
signature: params.signature, // 必填,签名
|
||||
jsApiList: params.jsApiList || [
|
||||
'openUserProfile',
|
||||
'openEnterpriseChat',
|
||||
'getContext',
|
||||
'getCurExternalContact',
|
||||
'openExistedChatWithMsg'
|
||||
] // 必填,需要使用的JS接口列表
|
||||
});
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* 添加企业微信联系人
|
||||
* @param {Object} params - 参数
|
||||
* @param {string} params.userId - 用户ID
|
||||
* @param {Function} success - 成功回调
|
||||
* @param {Function} fail - 失败回调
|
||||
*/
|
||||
this.addContact = function (params, success, fail) {
|
||||
if (!this.wxwork) {
|
||||
console.error('企业微信JS-SDK未初始化');
|
||||
if (fail) fail('企业微信JS-SDK未初始化');
|
||||
return;
|
||||
}
|
||||
|
||||
this.wxwork.ready(() => {
|
||||
this.wxwork.invoke('openUserProfile', {
|
||||
type: 'external', // 外部联系人
|
||||
userId: params.userId // 用户ID
|
||||
}, (res) => {
|
||||
if (res.err_msg === 'openUserProfile:ok') {
|
||||
if (success) success(res);
|
||||
} else {
|
||||
console.error('打开用户资料失败:', res);
|
||||
if (fail) fail(res.err_msg);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 打开企业微信客服会话
|
||||
* @param {Object} params - 参数
|
||||
* @param {string} params.corpId - 企业ID
|
||||
* @param {string} params.url - 客服URL
|
||||
* @param {string} params.name - 会话名称
|
||||
* @param {Function} success - 成功回调
|
||||
* @param {Function} fail - 失败回调
|
||||
*/
|
||||
this.openCustomerService = function (params, success, fail) {
|
||||
if (!this.wxwork) {
|
||||
console.error('企业微信JS-SDK未初始化');
|
||||
if (fail) fail('企业微信JS-SDK未初始化');
|
||||
return;
|
||||
}
|
||||
|
||||
this.wxwork.ready(() => {
|
||||
// #ifdef MP-WEIXIN
|
||||
if (typeof wx !== 'undefined' && wx.openCustomerServiceChat) {
|
||||
// 微信小程序环境
|
||||
wx.openCustomerServiceChat({
|
||||
extInfo: {
|
||||
url: params.url
|
||||
},
|
||||
corpId: params.corpId,
|
||||
showMessageCard: true,
|
||||
sendMessageTitle: params.sendMessageTitle || '',
|
||||
sendMessagePath: params.sendMessagePath || '',
|
||||
sendMessageImg: params.sendMessageImg || ''
|
||||
});
|
||||
if (success) success();
|
||||
}
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
else if (typeof WWOpenData !== 'undefined') {
|
||||
// H5环境
|
||||
window.location.href = params.url;
|
||||
if (success) success();
|
||||
}
|
||||
// #endif
|
||||
else {
|
||||
// 直接跳转链接
|
||||
window.location.href = params.url;
|
||||
if (success) success();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 生成企业微信活码链接
|
||||
* @param {Object} params - 参数
|
||||
* @param {string} params.configId - 活码配置ID
|
||||
* @param {string} params.userId - 用户ID
|
||||
* @returns {string} 活码链接
|
||||
*/
|
||||
this.generateContactUrl = function (params) {
|
||||
// 企业微信活码链接格式
|
||||
const baseUrl = 'https://work.weixin.qq.com/kfid';
|
||||
if (params.configId) {
|
||||
return `${baseUrl}/${params.configId}`;
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
/**
|
||||
* 检查环境是否支持企业微信
|
||||
* @returns {boolean} 是否支持
|
||||
*/
|
||||
this.isSupported = function () {
|
||||
// #ifdef MP-WEIXIN
|
||||
return typeof wx !== 'undefined' && wx.openCustomerServiceChat;
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
return typeof WWOpenData !== 'undefined' || /wxwork/i.test(navigator.userAgent);
|
||||
// #endif
|
||||
return false;
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取当前环境信息
|
||||
* @returns {Object} 环境信息
|
||||
*/
|
||||
this.getEnvironment = function () {
|
||||
// #ifdef MP-WEIXIN
|
||||
return {
|
||||
platform: 'miniprogram',
|
||||
isWxWork: false,
|
||||
supportContact: typeof wx !== 'undefined' && wx.openCustomerServiceChat
|
||||
};
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
const isWxWork = /wxwork/i.test(navigator.userAgent);
|
||||
return {
|
||||
platform: 'h5',
|
||||
isWxWork: isWxWork,
|
||||
supportContact: isWxWork || typeof WWOpenData !== 'undefined'
|
||||
};
|
||||
// #endif
|
||||
return {
|
||||
platform: 'unknown',
|
||||
isWxWork: false,
|
||||
supportContact: false
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
export {
|
||||
WxWork
|
||||
}
|
||||
271
components/ai-chat-message/README.md
Normal file
271
components/ai-chat-message/README.md
Normal file
@@ -0,0 +1,271 @@
|
||||
# AI智能客服组件
|
||||
|
||||
一个功能完整的AI智能客服对话组件,支持多种消息类型和交互功能。
|
||||
|
||||
## 功能特性
|
||||
|
||||
- ✅ 支持对话上下文管理
|
||||
- ✅ 支持多种消息类型:文本、Markdown、文件、音频、视频、链接、商品卡片
|
||||
- ✅ 支持语音输入和录音
|
||||
- ✅ 支持图片、文件、位置等附件发送
|
||||
- ✅ 支持消息操作按钮(点赞、踩等)
|
||||
- ✅ 支持历史消息加载
|
||||
- ✅ 响应式设计,适配多端
|
||||
|
||||
## 安装使用
|
||||
|
||||
### 1. 引入组件
|
||||
|
||||
在 `pages.json` 中注册组件:
|
||||
|
||||
```json
|
||||
{
|
||||
"usingComponents": {
|
||||
"ai-chat-message": "/components/ai-chat-message/ai-chat-message"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 2. 在页面中使用
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<view class="container">
|
||||
<ai-chat-message
|
||||
ref="chat"
|
||||
:initial-messages="messages"
|
||||
@message-sent="onMessageSent"
|
||||
@ai-response="onAIResponse"
|
||||
@action-click="onActionClick" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
messages: [
|
||||
{
|
||||
id: 1,
|
||||
role: 'ai',
|
||||
type: 'text',
|
||||
content: '您好!我是AI智能客服,有什么可以帮助您的吗?',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onMessageSent(message) {
|
||||
console.log('用户发送消息:', message)
|
||||
},
|
||||
onAIResponse(message) {
|
||||
console.log('AI回复消息:', message)
|
||||
},
|
||||
onActionClick({ action, message }) {
|
||||
console.log('操作点击:', action, message)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
```
|
||||
|
||||
## Props 配置
|
||||
|
||||
| 参数 | 类型 | 默认值 | 说明 |
|
||||
|------|------|--------|------|
|
||||
| initialMessages | Array | [] | 初始消息列表 |
|
||||
| userAvatar | String | '/static/images/default-avatar.png' | 用户头像 |
|
||||
| aiAvatar | String | '/static/images/ai-avatar.png' | AI头像 |
|
||||
| showLoadMore | Boolean | true | 是否显示加载更多 |
|
||||
| maxMessages | Number | 100 | 最大消息数量 |
|
||||
|
||||
## Events 事件
|
||||
|
||||
| 事件名 | 参数 | 说明 |
|
||||
|--------|------|------|
|
||||
| message-sent | message | 用户发送消息 |
|
||||
| ai-response | message | AI回复消息 |
|
||||
| action-click | {action, message} | 操作按钮点击 |
|
||||
| history-loaded | messages | 历史消息加载完成 |
|
||||
| file-preview | message | 文件预览 |
|
||||
| audio-play | message | 音频播放 |
|
||||
| audio-pause | message | 音频暂停 |
|
||||
| video-play | message | 视频播放 |
|
||||
| video-pause | message | 视频暂停 |
|
||||
| link-open | message | 链接打开 |
|
||||
| product-view | message | 商品查看 |
|
||||
| input-change | value | 输入内容变化 |
|
||||
|
||||
## 消息类型格式
|
||||
|
||||
### 文本消息
|
||||
```javascript
|
||||
{
|
||||
id: 1,
|
||||
role: 'user', // 或 'ai'
|
||||
type: 'text',
|
||||
content: '消息内容',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
```
|
||||
|
||||
### Markdown消息
|
||||
```javascript
|
||||
{
|
||||
id: 2,
|
||||
role: 'ai',
|
||||
type: 'markdown',
|
||||
content: '# 标题\n**粗体** *斜体* `代码`',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
```
|
||||
|
||||
### 文件消息
|
||||
```javascript
|
||||
{
|
||||
id: 3,
|
||||
role: 'ai',
|
||||
type: 'file',
|
||||
fileName: '文档.pdf',
|
||||
fileSize: 1024000,
|
||||
url: '文件地址',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
```
|
||||
|
||||
### 音频消息
|
||||
```javascript
|
||||
{
|
||||
id: 4,
|
||||
role: 'ai',
|
||||
type: 'audio',
|
||||
title: '语音消息',
|
||||
duration: 60, // 秒
|
||||
url: '音频地址',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
```
|
||||
|
||||
### 视频消息
|
||||
```javascript
|
||||
{
|
||||
id: 5,
|
||||
role: 'ai',
|
||||
type: 'video',
|
||||
title: '产品介绍',
|
||||
duration: 120, // 秒
|
||||
url: '视频地址',
|
||||
cover: '封面图',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
```
|
||||
|
||||
### 链接消息
|
||||
```javascript
|
||||
{
|
||||
id: 6,
|
||||
role: 'ai',
|
||||
type: 'link',
|
||||
title: '帮助文档',
|
||||
description: '详细的使用说明',
|
||||
url: 'https://example.com',
|
||||
image: '缩略图',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
```
|
||||
|
||||
### 商品卡片
|
||||
```javascript
|
||||
{
|
||||
id: 7,
|
||||
role: 'ai',
|
||||
type: 'product',
|
||||
title: '商品名称',
|
||||
price: 299,
|
||||
description: '商品描述',
|
||||
image: '商品图片',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
```
|
||||
|
||||
## 方法
|
||||
|
||||
通过 ref 调用组件方法:
|
||||
|
||||
```javascript
|
||||
// 添加消息
|
||||
this.$refs.chat.addMessage(message)
|
||||
|
||||
// 清空消息
|
||||
this.$refs.chat.clearMessages()
|
||||
|
||||
// 滚动到底部
|
||||
this.$refs.chat.scrollToBottom()
|
||||
```
|
||||
|
||||
## 样式定制
|
||||
|
||||
组件使用 SCSS 编写,可以通过 CSS 变量进行主题定制:
|
||||
|
||||
```css
|
||||
.ai-chat-container {
|
||||
--primary-color: #ff4544;
|
||||
--bg-color: #f8f8f8;
|
||||
--text-color: #333;
|
||||
}
|
||||
```
|
||||
|
||||
## 方法
|
||||
|
||||
通过 ref 调用组件方法:
|
||||
|
||||
```javascript
|
||||
// 添加消息
|
||||
this.$refs.chat.addMessage(message)
|
||||
|
||||
// 清空消息
|
||||
this.$refs.chat.clearMessages()
|
||||
|
||||
// 滚动到底部
|
||||
this.$refs.chat.scrollToBottom()
|
||||
|
||||
// 开始语音输入
|
||||
this.$refs.chat.startVoiceInput()
|
||||
|
||||
// 停止语音输入
|
||||
this.$refs.chat.stopVoiceInput()
|
||||
```
|
||||
|
||||
## 样式定制
|
||||
|
||||
组件使用 SCSS 编写,可以通过 CSS 变量进行主题定制:
|
||||
|
||||
```css
|
||||
.ai-chat-container {
|
||||
--primary-color: #ff4544;
|
||||
--bg-color: #f8f8f8;
|
||||
--text-color: #333;
|
||||
--border-color: #eeeeee;
|
||||
--user-bg: #e6f7ff;
|
||||
--ai-bg: #f6f6f6;
|
||||
}
|
||||
```
|
||||
|
||||
## 图标字体
|
||||
|
||||
组件使用自定义图标字体,需要在页面中引入:
|
||||
|
||||
```html
|
||||
<style>
|
||||
@import url('/components/ai-chat-message/iconfont.css');
|
||||
</style>
|
||||
```
|
||||
|
||||
## 注意事项
|
||||
|
||||
1. 组件已适配项目中已有的 `ns-loading` 组件
|
||||
2. 需要配置对应的图标字体文件
|
||||
3. 音频播放功能在 H5 和 APP 端支持较好
|
||||
4. 文件预览功能依赖平台能力
|
||||
5. 语音输入功能需要用户授权麦克风权限
|
||||
6
components/ai-chat-message/ai-chat-message.json
Normal file
6
components/ai-chat-message/ai-chat-message.json
Normal file
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"ns-loading": "../ns-loading/ns-loading"
|
||||
}
|
||||
}
|
||||
2766
components/ai-chat-message/ai-chat-message.vue
Normal file
2766
components/ai-chat-message/ai-chat-message.vue
Normal file
File diff suppressed because it is too large
Load Diff
288
components/ai-chat-message/demo.vue
Normal file
288
components/ai-chat-message/demo.vue
Normal file
@@ -0,0 +1,288 @@
|
||||
<template>
|
||||
<view class="demo-container">
|
||||
<view class="demo-header">
|
||||
<text class="demo-title">AI智能客服组件演示</text>
|
||||
</view>
|
||||
|
||||
<ai-chat-message
|
||||
ref="chat"
|
||||
:initial-messages="demoMessages"
|
||||
user-avatar="/static/images/demo-user.png"
|
||||
ai-avatar="/static/images/demo-ai.png"
|
||||
@message-sent="onMessageSent"
|
||||
@ai-response="onAIResponse"
|
||||
@action-click="onActionClick"
|
||||
@file-preview="onFilePreview"
|
||||
@audio-play="onAudioPlay"
|
||||
@video-play="onVideoPlay"
|
||||
@link-open="onLinkOpen"
|
||||
@product-view="onProductView" />
|
||||
|
||||
<view class="demo-controls">
|
||||
<button class="control-btn" @click="addTextMessage">添加文本消息</button>
|
||||
<button class="control-btn" @click="addMarkdownMessage">添加Markdown</button>
|
||||
<button class="control-btn" @click="addFileMessage">添加文件</button>
|
||||
<button class="control-btn" @click="addAudioMessage">添加音频</button>
|
||||
<button class="control-btn" @click="addVideoMessage">添加视频</button>
|
||||
<button class="control-btn" @click="addLinkMessage">添加链接</button>
|
||||
<button class="control-btn" @click="addProductMessage">添加商品</button>
|
||||
<button class="control-btn" @click="clearMessages">清空消息</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
demoMessages: [
|
||||
{
|
||||
id: 1,
|
||||
role: 'ai',
|
||||
type: 'text',
|
||||
content: '您好!我是AI智能客服演示程序,我可以展示多种消息类型。请点击下方的按钮体验不同功能!',
|
||||
timestamp: Date.now() - 300000,
|
||||
actions: [
|
||||
{ id: 1, text: '开始体验', type: 'like' }
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 添加文本消息
|
||||
addTextMessage() {
|
||||
const message = {
|
||||
id: Date.now(),
|
||||
role: 'ai',
|
||||
type: 'text',
|
||||
content: '这是一个文本消息示例,支持**粗体**、*斜体*和`代码`格式。也可以包含换行符\n这是第二行内容。',
|
||||
timestamp: Date.now(),
|
||||
actions: [
|
||||
{ id: 1, text: '有帮助', type: 'like' },
|
||||
{ id: 2, text: '没帮助', type: 'dislike' }
|
||||
]
|
||||
}
|
||||
this.$refs.chat.messages.push(message)
|
||||
},
|
||||
|
||||
// 添加Markdown消息
|
||||
addMarkdownMessage() {
|
||||
const message = {
|
||||
id: Date.now(),
|
||||
role: 'ai',
|
||||
type: 'markdown',
|
||||
content: `# Markdown文档示例
|
||||
|
||||
## 二级标题
|
||||
|
||||
这是一个支持**粗体**、*斜体*和\`代码\`的Markdown消息。
|
||||
|
||||
### 功能特性
|
||||
- ✅ 支持标题层级
|
||||
- ✅ 支持列表展示
|
||||
- ✅ 支持代码高亮
|
||||
- ✅ 支持链接跳转
|
||||
|
||||
[查看详细文档](https://example.com)\n\n**注意:** 这是一个演示内容,实际使用时可以集成真实的文档系统。`,
|
||||
timestamp: Date.now(),
|
||||
actions: [
|
||||
{ id: 1, text: '查看文档', type: 'like' }
|
||||
]
|
||||
}
|
||||
this.$refs.chat.messages.push(message)
|
||||
},
|
||||
|
||||
// 添加文件消息
|
||||
addFileMessage() {
|
||||
const message = {
|
||||
id: Date.now(),
|
||||
role: 'ai',
|
||||
type: 'file',
|
||||
fileName: '产品介绍文档.pdf',
|
||||
fileSize: 2048000,
|
||||
url: 'https://example.com/document.pdf',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
this.$refs.chat.messages.push(message)
|
||||
},
|
||||
|
||||
// 添加音频消息
|
||||
addAudioMessage() {
|
||||
const message = {
|
||||
id: Date.now(),
|
||||
role: 'ai',
|
||||
type: 'audio',
|
||||
title: '产品功能介绍',
|
||||
duration: 89,
|
||||
url: 'https://example.com/audio.mp3',
|
||||
timestamp: Date.now(),
|
||||
playing: false,
|
||||
currentTime: 0
|
||||
}
|
||||
this.$refs.chat.messages.push(message)
|
||||
},
|
||||
|
||||
// 添加视频消息
|
||||
addVideoMessage() {
|
||||
const message = {
|
||||
id: Date.now(),
|
||||
role: 'ai',
|
||||
type: 'video',
|
||||
title: '产品演示视频',
|
||||
duration: 180,
|
||||
url: 'https://example.com/video.mp4',
|
||||
cover: '/static/images/video-cover.jpg',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
this.$refs.chat.messages.push(message)
|
||||
},
|
||||
|
||||
// 添加链接消息
|
||||
addLinkMessage() {
|
||||
const message = {
|
||||
id: Date.now(),
|
||||
role: 'ai',
|
||||
type: 'link',
|
||||
title: '帮助中心',
|
||||
description: '详细的产品使用说明和常见问题解答',
|
||||
url: 'https://example.com/help',
|
||||
image: '/static/images/link-thumbnail.jpg',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
this.$refs.chat.messages.push(message)
|
||||
},
|
||||
|
||||
// 添加商品消息
|
||||
addProductMessage() {
|
||||
const message = {
|
||||
id: Date.now(),
|
||||
role: 'ai',
|
||||
type: 'product',
|
||||
title: '智能手表 X1',
|
||||
price: 1299,
|
||||
description: '全新一代智能手表,支持心率监测、运动追踪、消息提醒等功能',
|
||||
image: '/static/images/product-demo.jpg',
|
||||
timestamp: Date.now(),
|
||||
actions: [
|
||||
{ id: 1, text: '立即购买', type: 'like' },
|
||||
{ id: 2, text: '查看详情', type: 'dislike' }
|
||||
]
|
||||
}
|
||||
this.$refs.chat.messages.push(message)
|
||||
},
|
||||
|
||||
// 清空消息
|
||||
clearMessages() {
|
||||
this.$refs.chat.messages = [
|
||||
{
|
||||
id: 1,
|
||||
role: 'ai',
|
||||
type: 'text',
|
||||
content: '消息已清空,可以重新开始体验!',
|
||||
timestamp: Date.now()
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
// 事件处理
|
||||
onMessageSent(message) {
|
||||
console.log('用户发送消息:', message)
|
||||
uni.showToast({
|
||||
title: '消息发送成功',
|
||||
icon: 'success'
|
||||
})
|
||||
},
|
||||
|
||||
onAIResponse(message) {
|
||||
console.log('AI回复消息:', message)
|
||||
},
|
||||
|
||||
onActionClick({ action, message }) {
|
||||
console.log('操作点击:', action, message)
|
||||
uni.showToast({
|
||||
title: `点击了: ${action.text}`,
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
|
||||
onFilePreview(message) {
|
||||
console.log('文件预览:', message)
|
||||
uni.showToast({
|
||||
title: '正在打开文件...',
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
|
||||
onAudioPlay(message) {
|
||||
console.log('音频播放:', message)
|
||||
},
|
||||
|
||||
onVideoPlay(message) {
|
||||
console.log('视频播放:', message)
|
||||
},
|
||||
|
||||
onLinkOpen(message) {
|
||||
console.log('链接打开:', message)
|
||||
uni.showToast({
|
||||
title: '正在打开链接...',
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
|
||||
onProductView(message) {
|
||||
console.log('商品查看:', message)
|
||||
uni.showToast({
|
||||
title: '正在查看商品...',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.demo-container {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.demo-header {
|
||||
background-color: #ff4544;
|
||||
color: white;
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
|
||||
.demo-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.demo-controls {
|
||||
background-color: white;
|
||||
padding: 20rpx;
|
||||
border-top: 2rpx solid #eeeeee;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10rpx;
|
||||
|
||||
.control-btn {
|
||||
flex: 1;
|
||||
min-width: 150rpx;
|
||||
height: 60rpx;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 30rpx;
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
border: none;
|
||||
|
||||
&:active {
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,638 +0,0 @@
|
||||
<template>
|
||||
<view class="order-container" :class="{ 'safe-area': isIphoneX }">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="payment-navbar" :style="{ 'padding-top': menuButtonBounding.top + 'px', height: menuButtonBounding.height + 'px' }">
|
||||
<view class="nav-wrap">
|
||||
<text class="iconfont icon-back_light" @click="back"></text>
|
||||
<view class="navbar-title">确认订单</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="payment-navbar-block" :style="{ height: menuButtonBounding.bottom + 'px' }"></view>
|
||||
<!-- #endif -->
|
||||
|
||||
<scroll-view scroll-y="true" class="order-scroll-container">
|
||||
<view class="payment-navbar-block"></view>
|
||||
<template v-if="paymentData">
|
||||
<template v-if="paymentData.is_virtual">
|
||||
<!-- 虚拟商品联系方式 -->
|
||||
<view class="mobile-wrap">
|
||||
<view class="tips color-base-text">
|
||||
<text class="iconfont icongantanhao"></text>
|
||||
购买虚拟类商品需填写手机号,方便商家与您联系
|
||||
</view>
|
||||
<view class="form-group">
|
||||
<text class="icon">
|
||||
<image :src="$util.img('public/uniapp/order/icon-mobile.png')" mode="widthFix"></image>
|
||||
</text>
|
||||
<text class="text">手机号码</text>
|
||||
<input type="number" maxlength="11" placeholder="请输入您的手机号码" placeholder-class="color-tip placeholder" class="input" v-model="orderCreateData.member_address.mobile" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<!-- 配送方式 -->
|
||||
<view class="delivery-mode" v-if="goodsData.delivery.express_type.length > 1">
|
||||
<view class="action">
|
||||
<view :class="{ active: item.name == orderCreateData.delivery.delivery_type }" v-for="(item, index) in goodsData.delivery.express_type" :key="index" @click="selectDeliveryType(item)">
|
||||
{{ item.title }}
|
||||
<!-- 外圆角 -->
|
||||
<view class="out-radio"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="address-box" :class="{ 'not-delivery-type': goodsData.delivery.express_type.length <= 1 }" v-if="orderCreateData.delivery.delivery_type == 'express'">
|
||||
<view class="info-wrap" v-if="memberAddress" @click="selectAddress">
|
||||
<view class="content">
|
||||
<text class="name">{{ memberAddress.name ? memberAddress.name : '' }}</text>
|
||||
<text class="mobile">{{ memberAddress.mobile ? memberAddress.mobile : '' }}</text>
|
||||
<view class="desc-wrap">
|
||||
{{ memberAddress.full_address ? memberAddress.full_address : '' }}
|
||||
{{ memberAddress.address ? memberAddress.address : '' }}
|
||||
</view>
|
||||
</view>
|
||||
<text class="cell-more iconfont icon-right"></text>
|
||||
</view>
|
||||
<view class="empty-wrap" v-else @click="selectAddress">
|
||||
<view class="info">请设置收货地址</view>
|
||||
<view class="cell-more">
|
||||
<view class="iconfont icon-right"></view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="address-line" :src="$util.img('public/uniapp/order/address-line.png')"></image>
|
||||
</view>
|
||||
|
||||
<view class="address-box" :class="{ 'not-delivery-type': goodsData.delivery.express_type.length <= 1 }" v-if="orderCreateData.delivery.delivery_type == 'local'">
|
||||
<view v-if="localMemberAddress">
|
||||
<block v-if="storeList && Object.keys(storeList).length > 1">
|
||||
<view class="local-delivery-store" v-if="storeInfo" @click="openPopup('deliveryPopup')">
|
||||
<view class="info">
|
||||
由
|
||||
<text class="store-name">{{ storeInfo.store_name }}</text>
|
||||
提供配送
|
||||
</view>
|
||||
<view class="cell-more">
|
||||
<text>点击切换</text>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="local-delivery-store">
|
||||
<view class="info">
|
||||
<text class="store-name">您的附近没有可配送的门店,请选择其他配送方式</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view class="info-wrap local" @click="selectAddress">
|
||||
<view class="content">
|
||||
<text class="name">{{ localMemberAddress.name ? localMemberAddress.name : '' }}
|
||||
</text>
|
||||
<text class="mobile">{{ localMemberAddress.mobile ? localMemberAddress.mobile : '' }}
|
||||
</text>
|
||||
<view class="desc-wrap">
|
||||
{{ localMemberAddress.full_address ? localMemberAddress.full_address : '' }}
|
||||
{{ localMemberAddress.address ? localMemberAddress.address : '' }}
|
||||
</view>
|
||||
</view>
|
||||
<text class="cell-more iconfont icon-right"></text>
|
||||
</view>
|
||||
<view class="local-box" v-if="calculateGoodsData.config.local && calculateGoodsData.delivery.local.info.time_is_open == 1">
|
||||
<view class="pick-block" @click="localtime('')">
|
||||
<view class="title font-size-base">送达时间</view>
|
||||
<view class="time-picker">
|
||||
<text :class="{ 'color-tip': !deliveryTime }">{{ deliveryTime ? deliveryTime : '请选择送达时间' }}</text>
|
||||
<text class="iconfont icon-right cell-more"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="empty-wrap" v-else @click="selectAddress">
|
||||
<view class="info">请设置收货地址</view>
|
||||
<view class="cell-more">
|
||||
<view class="iconfont icon-right"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<image class="address-line" :src="$util.img('public/uniapp/order/address-line.png')"></image>
|
||||
</view>
|
||||
|
||||
<!-- 门店信息 -->
|
||||
<view class="store-box" :class="{ 'not-delivery-type': goodsData.delivery.express_type.length <= 1 }" v-if="orderCreateData.delivery.delivery_type == 'store'">
|
||||
<block v-if="storeInfo">
|
||||
<view @click="openPopup('deliveryPopup')" class="store-info">
|
||||
<view class="store-address-info">
|
||||
<view class="info-wrap">
|
||||
<view class="title">
|
||||
<text>{{ storeInfo.store_name }}</text>
|
||||
</view>
|
||||
<view class="store-detail">
|
||||
<view v-if="storeInfo.open_date">营业时间:{{ storeInfo.open_date }}</view>
|
||||
<view class="address">{{ storeInfo.full_address }} {{ storeInfo.address }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell-more iconfont icon-right" v-if="storeList && Object.keys(storeList).length > 1"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mobile-wrap store-mobile" v-if="orderCreateData.member_address">
|
||||
<view class="form-group">
|
||||
<text class="text">姓名</text>
|
||||
<input type="text" placeholder-class="color-tip placeholder" class="input" disabled v-model="orderCreateData.member_address.name" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="mobile-wrap store-mobile" v-if="orderCreateData.member_address">
|
||||
<view class="form-group">
|
||||
<text class="text">预留手机</text>
|
||||
<input type="number" maxlength="11" placeholder="请输入您的手机号码" placeholder-class="color-tip placeholder" class="input" v-model="orderCreateData.member_address.mobile" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="store-time" @click="storetime('')">
|
||||
<view class="left">提货时间</view>
|
||||
<view class="right">
|
||||
{{ deliveryTime }}
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view v-else class="empty">当前无自提门店,请选择其它配送方式</view>
|
||||
<image class="address-line" :src="$util.img('public/uniapp/order/address-line.png')"></image>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 店铺 -->
|
||||
<view class="site-wrap order-goods" v-if="calculateGoodsData">
|
||||
<view class="site-header">
|
||||
<view class="iconfont icon-dianpu"></view>
|
||||
<text class="site-name">门店</text>
|
||||
</view>
|
||||
<view class="site-body">
|
||||
<!-- 商品 -->
|
||||
<view class="goods-item" v-for="(goodsItem, goodsIndex) in calculateGoodsData.goods_list" :key="goodsIndex">
|
||||
<view class="goods-wrap">
|
||||
<view class="goods-img" @click="$util.redirectTo('/pages/goods/detail', { goods_id: goodsItem.goods_id })">
|
||||
<image :src="$util.img(goodsItem.sku_image, { size: 'mid' })" @error="imageError(goodsIndex)" mode="aspectFill"/>
|
||||
</view>
|
||||
<view class="goods-info">
|
||||
<view class="top-wrap">
|
||||
<view @click="$util.redirectTo('/pages/goods/detail', { goods_id: goodsItem.goods_id })" class="goods-name">{{ goodsItem.sku_name }}</view>
|
||||
<view class="sku" v-if="goodsItem.sku_spec_format">
|
||||
<view class="goods-spec">
|
||||
<block v-for="(x, i) in goodsItem.sku_spec_format" :key="i">
|
||||
<view>{{ x.spec_value_name }}</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<block v-if="goodsItem.is_virtual == 0">
|
||||
<view class="error-tips" v-if="orderCreateData.delivery &&
|
||||
orderCreateData.delivery.delivery_type &&
|
||||
goodsItem.support_trade_type &&
|
||||
goodsItem.support_trade_type.indexOf(orderCreateData.delivery.delivery_type) == -1
|
||||
">
|
||||
<text class="iconfont icon-gantanhao"></text>
|
||||
<text>该商品不支持{{ orderCreateData.delivery.delivery_type_name }}</text>
|
||||
</view>
|
||||
</block>
|
||||
<view class="error-tips" v-if="goodsItem.error && goodsItem.error.message">
|
||||
<text class="iconfont icon-gantanhao"></text>
|
||||
<text>{{ goodsItem.error.message }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-sub-section">
|
||||
<view class="color-base-text">
|
||||
<text class="unit price-style small">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="goods-price price-style large">{{ parseFloat(goodsItem.price).toFixed(2).split('.')[0] }}</text>
|
||||
<text class="unit price-style small">.{{ parseFloat(goodsItem.price).toFixed(2).split('.')[1] }}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="font-size-tag">x</text>
|
||||
<text class="font-size-base">{{ goodsItem.num }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="member-goods-card order-cell" v-if="calculateGoodsData.goods_list[goodsIndex].member_card_list" @click="selectMemberGoodsCard(goodsIndex)">
|
||||
<text class="tit">次卡抵扣</text>
|
||||
<view class="box text-overflow">
|
||||
<block v-if="calculateGoodsData.goods_list[goodsIndex].card_promotion_money">
|
||||
<text class="text">次卡抵扣{{ calculateGoodsData.goods_list[goodsIndex].card_use_num }}张/{{ calculateGoodsData.goods_list[goodsIndex].card_use_num }}次</text>
|
||||
<text class="price-font">-¥{{ calculateGoodsData.goods_list[goodsIndex].card_promotion_money | moneyFormat }}</text>
|
||||
</block>
|
||||
<text class="color-tip" v-else>请选择次卡</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
<view class="goods-form" v-if="goodsData.goods_list[goodsIndex].goods_form" @click="editForm(goodsIndex)">
|
||||
<ns-form :data="goodsData.goods_list[goodsIndex].goods_form.json_data" ref="goodsForm" :custom-attr="{ sku_id: goodsItem.sku_id, form_id: goodsData.goods_list[goodsIndex].goods_form.id }"/>
|
||||
<text class="cell-more iconfont icon-right"></text>
|
||||
<view class="shade"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="site-wrap buyer-message">
|
||||
<view class="order-cell">
|
||||
<text class="tit">买家留言</text>
|
||||
<view class="box text-overflow " @click="openPopup('buyerMessagePopup')">
|
||||
<text v-if="orderCreateData.buyer_message">{{ orderCreateData.buyer_message }}</text>
|
||||
<text class="color-sub" v-else>无留言</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="paymentData.system_form" class="system-form-wrap">
|
||||
<view class="order-cell">
|
||||
<text class="tit">{{ paymentData.system_form.form_name }}</text>
|
||||
</view>
|
||||
<ns-form :data="paymentData.system_form.json_data" ref="form"/>
|
||||
</view>
|
||||
|
||||
<view class="site-wrap" v-if="calculateGoodsData || promotionInfo || (calculateGoodsData && calculateGoodsData.max_usable_point > 0) || goodsData.invoice">
|
||||
<view class="site-footer">
|
||||
<view class="order-cell coupon" v-if="modules.indexOf('coupon') != -1">
|
||||
<text class="tit">优惠券</text>
|
||||
<view class="box text-overflow" @click="openPopup('couponPopup')">
|
||||
<template v-if="orderCreateData.coupon && orderCreateData.coupon.coupon_id">
|
||||
<text>已使用优惠券,优惠</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ (calculateData && calculateData.coupon_money ? calculateData.coupon_money : 0) | moneyFormat }}</text>
|
||||
</template>
|
||||
<text v-else>不使用优惠券</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
<view class="order-cell" v-if="promotionInfo">
|
||||
<text class="tit">活动优惠</text>
|
||||
<view class="box text-overflow" @click="openPopup('promotionPopup')">
|
||||
<text>{{ promotionInfo.title }}</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
<view class="order-cell point" v-if="calculateGoodsData && calculateGoodsData.max_usable_point > 0">
|
||||
<text class="tit">
|
||||
<text>使用{{ parseInt(calculateGoodsData.max_usable_point) }}积分可抵扣</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.point_money | moneyFormat }}</text>
|
||||
</text>
|
||||
<view class="box"></view>
|
||||
<ns-switch class="balance-switch" @change="usePoint" :checked="orderCreateData.is_point == 1"/>
|
||||
</view>
|
||||
<view class="order-cell order-invoice-cell" v-if="goodsData.invoice.invoice_status == 1">
|
||||
<text class="tit">发票</text>
|
||||
<view class="box text-overflow" @click="openPopup('invoicePopup')">
|
||||
<text v-if="orderCreateData.is_invoice == 1">{{ orderCreateData.invoice_type == 1 ? '纸质' : '电子' }}发票({{ orderCreateData.invoice_content }})</text>
|
||||
<text v-else>无需发票</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="site-wrap box member-card-wrap" v-if="paymentData.recommend_member_card && Object.keys(paymentData.recommend_member_card).length > 0">
|
||||
<view class="head" @click="selectMemberCard">
|
||||
<text class="iconfont icon-huiyuan"></text>
|
||||
<view class="info">
|
||||
开通{{ paymentData.recommend_member_card.level_name }}
|
||||
<text>本单预计可省</text>
|
||||
<text class="price-color">{{ paymentData.recommend_member_card.discount_money | moneyFormat }}</text>
|
||||
<text>元</text>
|
||||
</view>
|
||||
<text class="iconfont" :class="orderCreateData.is_open_card == 1 ? 'icon-yuan_checked color-base-text' : 'icon-yuan_checkbox'"></text>
|
||||
</view>
|
||||
<view class="body" v-if="orderCreateData.is_open_card">
|
||||
<view class="item" :class="{ 'active color-base-border': item.key == orderCreateData.member_card_unit }" v-for="(item, index) in cardChargeType" :key="index" @click="selectMembercardUnit(item.key)">
|
||||
<view class="title">{{ item.title }}</view>
|
||||
<view class="price price-font">{{ $lang('common.currencySymbol') }}{{ parseFloat(item.value) }}/{{ item.unit }}</view>
|
||||
<text class="iconfont icon-icon color-base-text price-font identify" v-if="item.key == orderCreateData.member_card_unit"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单金额 -->
|
||||
<template v-if="calculateData">
|
||||
<view class="order-money">
|
||||
<view class="order-cell">
|
||||
<text class="tit">商品金额</text>
|
||||
<view class="box">
|
||||
<text class="unit color-title price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money color-title price-font">{{ calculateData.goods_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="calculateData.is_virtual == 0 && calculateData.delivery_money > 0">
|
||||
<text class="tit">运费</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">+</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.delivery_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="orderCreateData.is_invoice && calculateData.invoice_money > 0">
|
||||
<text class="tit">
|
||||
<text>税费</text>
|
||||
<text class="color-base-text font-bold price-font">({{ goodsData.invoice.invoice_rate }}%)</text>
|
||||
</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">+</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.invoice_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="orderCreateData.is_invoice && calculateData.invoice_delivery_money > 0">
|
||||
<text class="tit">发票邮寄费</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">+</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.invoice_delivery_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="calculateData.promotion_money > 0">
|
||||
<text class="tit">优惠</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">-</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.promotion_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="calculateData.coupon_money">
|
||||
<text class="tit">优惠券</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">-</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.coupon_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="calculateData.point_money > 0">
|
||||
<text class="tit">积分抵扣</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">-</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.point_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="calculateData.member_card_money > 0">
|
||||
<text class="tit">会员卡</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">+</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.member_card_money | moneyFormat }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="transactionAgreement.title && transactionAgreement.content" class="agreement">购买前请先阅读<text @click="$refs.agreementPopup.open()">《{{ transactionAgreement.title }}》</text>,下单即代表同意该协议</view>
|
||||
|
||||
<view class="order-submit bottom-safe-area">
|
||||
<view class="order-settlement-info">
|
||||
<text class="font-size-base color-tip margin-right">共{{ calculateData.goods_num }}件</text>
|
||||
<text class="font-size-base">合计:</text>
|
||||
<text class=" unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class=" money price-font">{{ parseFloat(calculateData.pay_money).toFixed(2).split('.')[0] }}</text>
|
||||
<text class=" unit price-font">.{{ parseFloat(calculateData.pay_money).toFixed(2).split('.')[1] }}</text>
|
||||
</view>
|
||||
<view class="submit-btn">
|
||||
<button type="primary" class="mini" size="mini" @click="create()" v-if="!surplusStartMoney()">提交订单</button>
|
||||
<button v-else class="no-submit mini" size="mini">差{{ surplusStartMoney() | moneyFormat }}起送</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-submit-block"></view>
|
||||
|
||||
<payment ref="choosePaymentPopup" @close="payClose" v-if="calculateData"></payment>
|
||||
</template>
|
||||
|
||||
|
||||
<!-- 活动优惠弹窗 -->
|
||||
<uni-popup ref="promotionPopup" type="bottom" v-if="promotionInfo">
|
||||
<view class="promotion-popup popup">
|
||||
<view class="popup-header">
|
||||
<text class="tit">活动优惠</text>
|
||||
<text class="iconfont icon-close" @click="closePopup('promotionPopup')"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view class="order-cell" style="align-items: baseline;">
|
||||
<view class="tit">
|
||||
<text class="promotion-mark ns-gradient-promotionpages-payment">{{ promotionInfo.title }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="promotion-content">
|
||||
<view class="tit tit-content" style="white-space: pre-line;" v-html="promotionInfo.content"></view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="popup-footer" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg" @click="closePopup('promotionPopup')">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
|
||||
<!-- 门店列表弹窗 -->
|
||||
<uni-popup ref="deliveryPopup" type="bottom">
|
||||
<view class="delivery-popup popup">
|
||||
<view class="popup-header">
|
||||
<text class="tit">已为您甄选出附近所有相关门店</text>
|
||||
<text class="iconfont icon-close" @click="closePopup('deliveryPopup')"></text>
|
||||
</view>
|
||||
<view class="popup-body store-popup" :class="{ 'safe-area': isIphoneX }">
|
||||
|
||||
<mescroll-uni @getData="getStore" ref="mescroll" top="50px">
|
||||
<block slot="list">
|
||||
<view class="delivery-content">
|
||||
<block v-if="storeData">
|
||||
<view class="item-wrap" v-for="(item, index) in storeData" :key="index" @click="selectPickupPoint(item)">
|
||||
<view class="detail">
|
||||
<view class="name" :class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''">
|
||||
<text>{{ item.store_name }}</text>
|
||||
<text v-if="item.distance">({{ item.distance }}km)</text>
|
||||
</view>
|
||||
<view class="info">
|
||||
<view :class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''" class="font-size-goods-tag">营业时间:{{ item.open_date }}</view>
|
||||
<view :class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''" class="font-size-goods-tag">地址:{{ item.full_address }}{{ item.address }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="icon" v-if="item.store_id == orderCreateData.delivery.store_id">
|
||||
<text class="iconfont icon-yuan_checked color-base-text"></text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view v-else class="empty-wrap">
|
||||
<ns-empty text="所选择收货地址附近没有可以自提的门店" :isIndex="false"></ns-empty>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</block>
|
||||
</mescroll-uni>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
|
||||
<!-- 留言弹窗 -->
|
||||
<uni-popup ref="buyerMessagePopup" type="bottom">
|
||||
<view style="height: auto;" class="buyermessag-popup popup" @touchmove.prevent.stop>
|
||||
<view class="popup-header">
|
||||
<text class="tit">买家留言</text>
|
||||
<text class="iconfont icon-close" @click="closePopup('buyerMessagePopup')"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view>
|
||||
<view class="buyermessag-cell">
|
||||
<view class="buyermessag-form-group">
|
||||
<textarea type="text" maxlength="100" placeholder="留言前建议先与商家协调一致" placeholder-class="color-tip" v-model="orderCreateData.buyer_message"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="popup-footer" @click="saveBuyerMessage" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
|
||||
<!-- 优惠券弹窗 -->
|
||||
<uni-popup ref="couponPopup" type="bottom" v-if="calculateGoodsData" :mask-click="false">
|
||||
<view class="coupon-popup popup" @touchmove.prevent.stop>
|
||||
<view class="popup-header">
|
||||
<text class="tit">优惠券</text>
|
||||
<text class="iconfont icon-close" @click="closePopup('couponPopup')"></text>
|
||||
</view>
|
||||
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view v-if="coupon_list.length > 0">
|
||||
<view class="coupon-item" v-for="(couponItem, couponIndex) in coupon_list" :key="couponIndex" @click="selectCoupon(couponItem)">
|
||||
<view class="coupon-info" :style="{ backgroundColor: 'var(--main-color-shallow)' }">
|
||||
<view class="info-wrap">
|
||||
<image class="coupon-line" mode="heightFix" :src="$util.img('public/uniapp/coupon/coupon_line.png')"/>
|
||||
<view class="coupon-money">
|
||||
<template v-if="couponItem.type == 'divideticket'">
|
||||
<text class="unit">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money">{{ parseFloat(couponItem.money) }}</text>
|
||||
</template>
|
||||
<template v-else-if="couponItem.type == 'reward'">
|
||||
<text class="unit">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money">{{ parseFloat(couponItem.money) }}</text>
|
||||
</template>
|
||||
<template v-else-if="couponItem.type == 'discount'">
|
||||
<text class="money">{{ parseFloat(couponItem.discount) }}</text>
|
||||
<text class="unit">折</text>
|
||||
</template>
|
||||
<view class="at-least">
|
||||
<template v-if="couponItem.at_least > 0">
|
||||
满{{ couponItem.at_least }}可用
|
||||
</template>
|
||||
<template v-else>
|
||||
无门槛
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="desc-wrap">
|
||||
<view class="coupon-name">{{ couponItem.coupon_name }}</view>
|
||||
<view v-if="couponItem.type == 'discount' && couponItem.discount_limit > 0" class="limit">最多可抵¥{{ couponItem.discount_limit }}</view>
|
||||
<view class="time font-size-goods-tag">有效期:{{ couponItem.end_time ? $util.timeStampTurnTime(couponItem.end_time) : '长期有效' }}</view>
|
||||
</view>
|
||||
<view class="iconfont" :class="orderCreateData.coupon.coupon_id == couponItem.coupon_id ? 'icon-yuan_checked color-base-text' : 'icon-yuan_checkbox'"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="coupon-empty">暂无可用的优惠券</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="popup-footer" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg" @click="useCpopon">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
|
||||
<!-- 交易协议 -->
|
||||
<view @touchmove.prevent>
|
||||
<uni-popup ref="agreementPopup" type="center" :maskClick="false">
|
||||
<view class="agreement-conten-box">
|
||||
<view class="close">
|
||||
<text class="iconfont icon-close" @click="$refs.agreementPopup.close()"></text>
|
||||
</view>
|
||||
<view class="title">{{ transactionAgreement.title }}</view>
|
||||
<view class="con">
|
||||
<scroll-view scroll-y="true" class="con">
|
||||
<rich-text :nodes="transactionAgreement.content"></rich-text>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
|
||||
<!-- 表单修改弹窗 -->
|
||||
<uni-popup ref="editFormPopup" type="bottom">
|
||||
<view style="height: auto;" class="form-popup popup" @touchmove.prevent.stop>
|
||||
<view class="popup-header">
|
||||
<text class="tit">买家信息</text>
|
||||
<text class="iconfont icon-close" @click="$refs.editFormPopup.close()"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<ns-form v-if="tempFormData" :data="tempFormData.json_data" ref="tempForm"></ns-form>
|
||||
</scroll-view>
|
||||
<view class="popup-footer" @click="saveForm" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
|
||||
<uni-popup ref="memberGoodsCardPopup" type="bottom">
|
||||
<view class="member-card-popup popup" @touchmove.prevent.stop>
|
||||
<view class="popup-header">
|
||||
<text class="tit">选择次卡</text>
|
||||
<text class="iconfont icon-close" @click="$refs.memberGoodsCardPopup.close()"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view v-for="(item, index) in selectGoodsCard.cardList" class="card-item" @click="selectGoodsCard.click(item.item_id)">
|
||||
<view class="content">
|
||||
<view class="title">{{ item.goods_name }}</view>
|
||||
<view class="info">
|
||||
<text v-if="item.card_type == 'timecard'">不限次数</text>
|
||||
<text v-if="item.card_type == 'oncecard'">剩余{{ item.num - item.use_num }}次</text>
|
||||
<text v-if="item.card_type == 'commoncard'">剩余{{ item.total_num - item.total_use_num }}次</text>
|
||||
<text>|</text>
|
||||
<text>{{ item.end_time ? $util.timeStampTurnTime(item.end_time) : '长期有效' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="iconfont" :class="selectGoodsCard.itemId == item.item_id ? 'icon-yuan_checked color-base-text' : 'icon-yuan_checkbox'"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="popup-footer" @click="saveMemberGoodsCard" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</template>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 门店自提时间 -->
|
||||
<ns-select-time @selectTime="selectPickupTime" ref="timePopup"></ns-select-time>
|
||||
|
||||
<ns-login ref="login"></ns-login>
|
||||
<loading-cover ref="loadingCover"></loading-cover>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import payment from './payment.js';
|
||||
|
||||
export default {
|
||||
name: 'common-payment',
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
props: {
|
||||
api: Object,
|
||||
createDataKey: String
|
||||
},
|
||||
mixins: [payment]
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import '@/common/css/order_parment.scss';
|
||||
|
||||
.order-cell .promotion-content {
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
||||
@@ -64,30 +64,27 @@
|
||||
|
||||
<view class="address-box" :class="{ 'not-delivery-type': goodsData.delivery.express_type.length <= 1 }" v-if="orderCreateData.delivery.delivery_type == 'local'">
|
||||
<view v-if="localMemberAddress">
|
||||
<block v-if="storeList && Object.keys(storeList).length > 1">
|
||||
<view class="local-delivery-store" v-if="storeInfo" @click="openPopup('deliveryPopup')">
|
||||
<view class="info">
|
||||
<block v-if="storeList && Object.keys(storeList).length > 0">
|
||||
<view class="local-delivery-store">
|
||||
<view class="info" v-if="storeInfo">
|
||||
由
|
||||
<text class="store-name">{{ storeInfo.store_name }}</text>
|
||||
提供配送
|
||||
<view>营业时间:{{ storeInfo.open_date }}</view>
|
||||
</view>
|
||||
<view class="cell-more">
|
||||
<view class="info" v-else>
|
||||
<text class="store-name">超出配送范围,请选择其他门店</text>
|
||||
</view>
|
||||
<view class="cell-more" v-if="Object.keys(storeList).length > 1" @click="openPopup('deliveryPopup')">
|
||||
<text>点击切换</text>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="local-delivery-store">
|
||||
<view class="info">
|
||||
<text class="store-name">您的附近没有可配送的门店,请选择其他配送方式</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view class="info-wrap local" @click="selectAddress">
|
||||
<view class="content">
|
||||
<text class="name">{{ localMemberAddress.name ? localMemberAddress.name : '' }}
|
||||
</text>
|
||||
<text class="mobile">{{ localMemberAddress.mobile ? localMemberAddress.mobile : '' }}
|
||||
</text>
|
||||
<text class="name">{{ localMemberAddress.name ? localMemberAddress.name : '' }}</text>
|
||||
<text class="mobile">{{ localMemberAddress.mobile ? localMemberAddress.mobile : '' }}</text>
|
||||
<view class="desc-wrap">
|
||||
{{ localMemberAddress.full_address ? localMemberAddress.full_address : '' }}
|
||||
{{ localMemberAddress.address ? localMemberAddress.address : '' }}
|
||||
@@ -125,9 +122,9 @@
|
||||
<text>{{ storeInfo.store_name }}</text>
|
||||
</view>
|
||||
<view class="store-detail">
|
||||
<view class="close-desc" v-if="storeInfo.status == 0 && storeInfo.close_desc">{{ storeInfo.close_desc }}</view>
|
||||
<view v-if="storeInfo.open_date">营业时间:{{ storeInfo.open_date }}</view>
|
||||
<view class="address">{{ storeInfo.full_address }} {{ storeInfo.address }}
|
||||
</view>
|
||||
<view class="address">{{ storeInfo.full_address }} {{ storeInfo.address }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell-more iconfont icon-right" v-if="storeList && Object.keys(storeList).length > 1"></view>
|
||||
@@ -145,7 +142,14 @@
|
||||
<input type="number" maxlength="11" placeholder="请输入您的手机号码" placeholder-class="color-tip placeholder" class="input" v-model="orderCreateData.member_address.mobile" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="store-time" @click="storetime('')">
|
||||
<view class="store-time" v-if="goodsData.jielong_id">
|
||||
<view class="left">提货时间</view>
|
||||
<view class="right">
|
||||
{{ $util.timeStampTurnTime(goodsData.jielong_info.take_start_time,'Y/m/d') }} ~ {{ $util.timeStampTurnTime(goodsData.jielong_info.take_end_time,'Y/m/d') }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="store-time" @click="storetime('')" v-else>
|
||||
<view class="left">提货时间</view>
|
||||
<view class="right">
|
||||
{{ deliveryTime }}
|
||||
@@ -159,15 +163,10 @@
|
||||
</template>
|
||||
|
||||
<!-- 店铺 -->
|
||||
|
||||
<view class="site-wrap order-goods" v-for="(calculateGoodsData, siteIndex) in shop_goods_list" :key="siteIndex">
|
||||
<view class="site-header">
|
||||
<view class="iconfont icon-dianpu"></view>
|
||||
<text class="site-name">{{calculateGoodsData.site_name}}</text>
|
||||
</view>
|
||||
<view class="site-wrap order-goods" v-if="calculateGoodsData">
|
||||
<view class="site-body">
|
||||
<!-- 商品 -->
|
||||
<view class="goods-item" v-for="(goodsItem, goodsIndex) in goodsSpecFormat(calculateGoodsData.goods_list)" :key="goodsIndex">
|
||||
<view class="goods-item" v-for="(goodsItem, goodsIndex) in calculateGoodsData.goods_list" :key="goodsIndex">
|
||||
<view class="goods-wrap">
|
||||
<view class="goods-img" @click="$util.redirectTo('/pages/goods/detail', { goods_id: goodsItem.goods_id })">
|
||||
<image :src="$util.img(goodsItem.sku_image, { size: 'mid' })" @error="imageError(goodsIndex)" mode="aspectFill"/>
|
||||
@@ -210,6 +209,17 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="member-goods-card order-cell" v-if="calculateGoodsData.goods_list[goodsIndex].member_card_list" @click="selectMemberGoodsCard(goodsIndex)">
|
||||
<text class="tit">次卡抵扣</text>
|
||||
<view class="box text-overflow">
|
||||
<block v-if="calculateGoodsData.goods_list[goodsIndex].card_promotion_money">
|
||||
<text class="text">次卡抵扣{{ calculateGoodsData.goods_list[goodsIndex].card_use_num }}张/{{ calculateGoodsData.goods_list[goodsIndex].card_use_num }}次</text>
|
||||
<text class="price-font">-¥{{ calculateGoodsData.goods_list[goodsIndex].card_promotion_money | moneyFormat }}</text>
|
||||
</block>
|
||||
<text class="color-tip" v-else>请选择次卡</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
<view class="goods-form" v-if="goodsData.goods_list[goodsIndex].goods_form" @click="editForm(goodsIndex)">
|
||||
<ns-form :data="goodsData.goods_list[goodsIndex].goods_form.json_data" ref="goodsForm" :custom-attr="{ sku_id: goodsItem.sku_id, form_id: goodsData.goods_list[goodsIndex].goods_form.id }"/>
|
||||
<text class="cell-more iconfont icon-right"></text>
|
||||
@@ -217,48 +227,18 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="site-wrap buyer-message">
|
||||
|
||||
</view>
|
||||
|
||||
<view class="order-money" style="margin: 0;">
|
||||
<view class="site-wrap buyer-message">
|
||||
<view class="order-cell">
|
||||
<text class="tit">买家留言</text>
|
||||
<view class="box text-overflow " @click="openPopup('buyerMessagePopup')">
|
||||
<text v-if="orderCreateData.buyer_message">{{ orderCreateData.buyer_message[calculateGoodsData.merch_id] }}</text>
|
||||
<text v-if="orderCreateData.buyer_message">{{ orderCreateData.buyer_message }}</text>
|
||||
<text class="color-sub" v-else>无留言</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
<view class="order-cell coupon" v-if="modules.indexOf('coupon') != -1">
|
||||
<text class="tit">优惠券</text>
|
||||
<view class="box text-overflow"@click="openSiteCoupon(calculateGoodsData.merch_id)">
|
||||
<template v-if="orderCreateData.coupon[calculateGoodsData.merch_id].coupon_id">
|
||||
<text class="money price-font" style="max-width: 100%;">已选择1张优惠券</text>
|
||||
<!-- <text class="unit price-font">优惠</text>
|
||||
<text class="money price-font">{{ (calculateData && calculateData.coupon_money ? calculateData.coupon_money : 0) | moneyFormat }}</text> -->
|
||||
</template>
|
||||
<text v-else>不使用优惠券</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="site-wrap buyer-message">
|
||||
<view class="order-cell">
|
||||
<view class="box shop-item">
|
||||
<text class="color-tip goods-num">共{{ calculateGoodsData.goods_num }}件</text>
|
||||
<text class="font-size-base">小计:</text>
|
||||
<text class="color-base-text unit">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="color-base-text money">{{ calculateGoodsData.goods_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<view v-if="paymentData.system_form" class="system-form-wrap">
|
||||
<view class="order-cell">
|
||||
@@ -267,7 +247,7 @@
|
||||
<ns-form :data="paymentData.system_form.json_data" ref="form"/>
|
||||
</view>
|
||||
|
||||
<!-- <view class="site-wrap" v-if="calculateGoodsData || promotionInfo || (calculateGoodsData && calculateGoodsData.max_usable_point > 0) || goodsData.invoice">
|
||||
<view class="site-wrap" v-if="calculateGoodsData || promotionInfo || (calculateGoodsData && calculateGoodsData.max_usable_point > 0) || goodsData.invoice">
|
||||
<view class="site-footer">
|
||||
<view class="order-cell coupon" v-if="modules.indexOf('coupon') != -1">
|
||||
<text class="tit">优惠券</text>
|
||||
@@ -306,7 +286,7 @@
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="site-wrap box member-card-wrap" v-if="paymentData.recommend_member_card && Object.keys(paymentData.recommend_member_card).length > 0">
|
||||
<view class="head" @click="selectMemberCard">
|
||||
@@ -320,7 +300,7 @@
|
||||
<text class="iconfont" :class="orderCreateData.is_open_card == 1 ? 'icon-yuan_checked color-base-text' : 'icon-yuan_checkbox'"></text>
|
||||
</view>
|
||||
<view class="body" v-if="orderCreateData.is_open_card">
|
||||
<view class="item" :class="{ 'active color-base-border': item.key == orderCreateData.member_card_unit }" v-for="(item, index) in cardChargeType" :key="index" @click="selectMembercardUnit(item.key)">
|
||||
<view class="item" :class="{ 'active color-base-border': item.key == orderCreateData.member_card_unit }" v-for="(item, index) in cardChargeType" :key="index" @click="selectMemberCardUnit(item.key)">
|
||||
<view class="title">{{ item.title }}</view>
|
||||
<view class="price price-font">{{ $lang('common.currencySymbol') }}{{ parseFloat(item.value) }}/{{ item.unit }}</view>
|
||||
<text class="iconfont icon-icon color-base-text price-font identify" v-if="item.key == orderCreateData.member_card_unit"></text>
|
||||
@@ -346,7 +326,7 @@
|
||||
<text class="money price-font">{{ calculateData.delivery_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="order-cell" v-if="orderCreateData.is_invoice && calculateData.invoice_money > 0">
|
||||
<view class="order-cell" v-if="orderCreateData.is_invoice && calculateData.invoice_money > 0">
|
||||
<text class="tit">
|
||||
<text>税费</text>
|
||||
<text class="color-base-text font-bold price-font">({{ goodsData.invoice.invoice_rate }}%)</text>
|
||||
@@ -356,15 +336,15 @@
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.invoice_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- <view class="order-cell" v-if="orderCreateData.is_invoice && calculateData.invoice_delivery_money > 0">
|
||||
</view>
|
||||
<view class="order-cell" v-if="orderCreateData.is_invoice && calculateData.invoice_delivery_money > 0">
|
||||
<text class="tit">发票邮寄费</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">+</text>
|
||||
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="money price-font">{{ calculateData.invoice_delivery_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="order-cell" v-if="calculateData.promotion_money > 0">
|
||||
<text class="tit">优惠</text>
|
||||
<view class="box color-base-text">
|
||||
@@ -389,7 +369,7 @@
|
||||
<text class="money price-font">{{ calculateData.point_money | moneyFormat }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="order-cell" v-if="calculateData.member_card_money > 0">
|
||||
<view class="order-cell" v-if="calculateData.member_card_money > 0">
|
||||
<text class="tit">会员卡</text>
|
||||
<view class="box color-base-text">
|
||||
<text class="operator">+</text>
|
||||
@@ -397,7 +377,7 @@
|
||||
<text class="money price-font">{{ calculateData.member_card_money | moneyFormat }}
|
||||
</text>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="transactionAgreement.title && transactionAgreement.content" class="agreement">购买前请先阅读<text @click="$refs.agreementPopup.open()">《{{ transactionAgreement.title }}》</text>,下单即代表同意该协议</view>
|
||||
@@ -412,7 +392,7 @@
|
||||
</view>
|
||||
<view class="submit-btn">
|
||||
<button type="primary" class="mini" size="mini" @click="create()" v-if="!surplusStartMoney()">提交订单</button>
|
||||
<!-- <button v-else class="no-submit mini" size="mini">差{{ surplusStartMoney() | moneyFormat }}起送</button> -->
|
||||
<button v-else class="no-submit mini" size="mini">差{{ surplusStartMoney() | moneyFormat }}起送</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-submit-block"></view>
|
||||
@@ -420,6 +400,68 @@
|
||||
<payment ref="choosePaymentPopup" @close="payClose" v-if="calculateData"></payment>
|
||||
</template>
|
||||
|
||||
<!-- 发票弹窗 -->
|
||||
<uni-popup ref="invoicePopup" type="bottom" :mask-click="false">
|
||||
<view :style="orderCreateData.is_invoice == 1 ? 'height: 83vh;' : 'height: 48vh;'" class="invoice-popup popup" @touchmove.prevent.stop>
|
||||
<view class="popup-header">
|
||||
<text class="tit">发票</text>
|
||||
<text class="iconfont icon-close" @click="closePopup('invoicePopup')"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view>
|
||||
<view class="invoice-cell" v-if="goodsData.invoice">
|
||||
<text class="tit">需要发票</text>
|
||||
<view class="option-grpup">
|
||||
<view class="option-item" :class="{ 'color-base-bg active': orderCreateData.is_invoice == 0 }" @click="changeIsInvoice">不需要</view>
|
||||
<view class="option-item" :class="{ 'color-base-bg active': orderCreateData.is_invoice == 1 }" @click="changeIsInvoice">需要</view>
|
||||
</view>
|
||||
</view>
|
||||
<block v-if="orderCreateData.is_invoice == 1">
|
||||
<view class="invoice-cell">
|
||||
<text class="tit">发票类型</text>
|
||||
<view class="option-grpup">
|
||||
<view class="option-item" :class="{ 'color-base-bg active': orderCreateData.invoice_type == item }" @click="changeInvoiceType(item)" v-for="(item, index) in goodsData.invoice.invoice_type.split(',')" :key="index">
|
||||
{{ item == 1 ? '纸质' : '电子' }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="invoice-cell">
|
||||
<text class="tit">抬头类型</text>
|
||||
<view class="option-grpup">
|
||||
<view class="option-item" :class="{ 'color-base-bg active': orderCreateData.invoice_title_type == 1 }" @click="changeInvoiceTitleType(1)">
|
||||
个人
|
||||
</view>
|
||||
<view class="option-item" :class="{ 'color-base-bg active': orderCreateData.invoice_title_type == 2 }" @click="changeInvoiceTitleType(2)">
|
||||
企业
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="invoice-cell">
|
||||
<text class="tit">发票信息</text>
|
||||
<view class="invoice-form-group">
|
||||
<input type="text" placeholder="请填写抬头名称" v-model.trim="orderCreateData.invoice_title" />
|
||||
<input v-if="orderCreateData.invoice_title_type == 2" type="text" placeholder="请填写纳税人识别号" v-model.trim="orderCreateData.taxpayer_number" />
|
||||
<input type="text" placeholder="请填写邮寄地址" v-model.trim="orderCreateData.invoice_full_address" v-if="orderCreateData.invoice_type == 1" />
|
||||
<input type="text" placeholder="请填写邮箱" v-model.trim="orderCreateData.invoice_email" v-if="orderCreateData.invoice_type == 2" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="invoice-cell">
|
||||
<text class="tit">发票内容</text>
|
||||
<view class="option-grpup">
|
||||
<view :key="index" v-for="(item, index) in goodsData.invoice.invoice_content_array" :class="{ 'color-base-bg active': item == orderCreateData.invoice_content }" @click="changeInvoiceContent(item)" class="option-item content">
|
||||
{{ item }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view class="invoice-tops">发票内容将以根据税法调整,具体请以展示为准,发票内容显示详细商品名 称及价格信息</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="popup-footer" @click="saveInvoice" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
|
||||
<!-- 活动优惠弹窗 -->
|
||||
<uni-popup ref="promotionPopup" type="bottom" v-if="promotionInfo">
|
||||
@@ -431,8 +473,7 @@
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view class="order-cell" style="align-items: baseline;">
|
||||
<view class="tit">
|
||||
<text class="promotion-mark ns-gradient-promotionpages-payment">{{ promotionInfo.title }}
|
||||
</text>
|
||||
<text class="promotion-mark ns-gradient-promotionpages-payment">{{ promotionInfo.title }}</text>
|
||||
</view>
|
||||
<view class="promotion-content">
|
||||
<view class="tit tit-content" style="white-space: pre-line;" v-html="promotionInfo.content"></view>
|
||||
@@ -465,6 +506,7 @@
|
||||
<text v-if="item.distance">({{ item.distance }}km)</text>
|
||||
</view>
|
||||
<view class="info">
|
||||
<view v-if="item.status == 0 && item.close_desc" class="close-desc">{{ item.close_desc }}</view>
|
||||
<view :class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''" class="font-size-goods-tag">营业时间:{{ item.open_date }}</view>
|
||||
<view :class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''" class="font-size-goods-tag">地址:{{ item.full_address }}{{ item.address }}</view>
|
||||
</view>
|
||||
@@ -478,6 +520,33 @@
|
||||
<ns-empty text="所选择收货地址附近没有可以自提的门店" :isIndex="false"></ns-empty>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <block v-if="storeList">
|
||||
<view class="item-wrap" v-for="(item, index) in storeList" :key="index"
|
||||
@click="selectPickupPoint(item)">
|
||||
<view class="detail">
|
||||
<view class="name"
|
||||
:class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''">
|
||||
<text>{{ item.store_name }}</text>
|
||||
<text v-if="item.distance">({{ item.distance }}km)</text>
|
||||
</view>
|
||||
<view class="info">
|
||||
<view
|
||||
:class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''"
|
||||
class="font-size-goods-tag">
|
||||
营业时间:{{ item.open_date }}
|
||||
</view>
|
||||
<view
|
||||
:class="item.store_id == orderCreateData.delivery.store_id ? 'color-base-text' : ''"
|
||||
class="font-size-goods-tag">
|
||||
地址:{{ item.full_address }}{{ item.address }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="icon" v-if="item.store_id == orderCreateData.delivery.store_id">
|
||||
<text class="iconfont icon-yuan_checked color-base-text"></text>
|
||||
</view>
|
||||
</view>
|
||||
</block> -->
|
||||
|
||||
</block>
|
||||
</mescroll-uni>
|
||||
@@ -509,7 +578,7 @@
|
||||
</uni-popup>
|
||||
|
||||
<!-- 优惠券弹窗 -->
|
||||
<uni-popup ref="couponPopup" type="bottom" :mask-click="false">
|
||||
<uni-popup ref="couponPopup" type="bottom" v-if="calculateGoodsData" :mask-click="false">
|
||||
<view class="coupon-popup popup" @touchmove.prevent.stop>
|
||||
<view class="popup-header">
|
||||
<text class="tit">优惠券</text>
|
||||
@@ -517,8 +586,8 @@
|
||||
</view>
|
||||
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view v-if="merchCoupon.data.length > 0">
|
||||
<view class="coupon-item" v-for="(couponItem, couponIndex) in merchCoupon.data" :key="couponIndex" @click="selectCoupon(couponItem,merchCoupon.merch_id)">
|
||||
<view v-if="coupon_list.length > 0">
|
||||
<view class="coupon-item" v-for="(couponItem, couponIndex) in coupon_list" :key="couponIndex" @click="selectCoupon(couponItem)">
|
||||
<view class="coupon-info" :style="{ backgroundColor: 'var(--main-color-shallow)' }">
|
||||
<view class="info-wrap">
|
||||
<image class="coupon-line" mode="heightFix" :src="$util.img('public/uniapp/coupon/coupon_line.png')"/>
|
||||
@@ -536,12 +605,8 @@
|
||||
<text class="unit">折</text>
|
||||
</template>
|
||||
<view class="at-least">
|
||||
<template v-if="couponItem.at_least > 0">
|
||||
满{{ couponItem.at_least }}可用
|
||||
</template>
|
||||
<template v-else>
|
||||
无门槛
|
||||
</template>
|
||||
<template v-if="couponItem.at_least > 0">满{{ couponItem.at_least }}可用</template>
|
||||
<template v-else>无门槛</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -550,7 +615,7 @@
|
||||
<view v-if="couponItem.type == 'discount' && couponItem.discount_limit > 0" class="limit">最多可抵¥{{ couponItem.discount_limit }}</view>
|
||||
<view class="time font-size-goods-tag">有效期:{{ couponItem.end_time ? $util.timeStampTurnTime(couponItem.end_time) : '长期有效' }}</view>
|
||||
</view>
|
||||
<view class="iconfont" :class="selectCouponId == couponItem.coupon_id ? 'icon-yuan_checked color-base-text' : 'icon-yuan_checkbox'"></view>
|
||||
<view class="iconfont" :class="orderCreateData.coupon.coupon_id == couponItem.coupon_id ? 'icon-yuan_checked color-base-text' : 'icon-yuan_checkbox'"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -558,7 +623,7 @@
|
||||
</scroll-view>
|
||||
|
||||
<view class="popup-footer" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg" @click="useCpopon">确定</view>
|
||||
<view class="confirm-btn color-base-bg" @click="useCoupon">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
@@ -573,7 +638,7 @@
|
||||
<view class="title">{{ transactionAgreement.title }}</view>
|
||||
<view class="con">
|
||||
<scroll-view scroll-y="true" class="con">
|
||||
<rich-text :nodes="transactionAgreement.content"></rich-text>
|
||||
<ns-mp-html :content="transactionAgreement.content"></ns-mp-html>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -588,7 +653,7 @@
|
||||
<text class="iconfont icon-close" @click="$refs.editFormPopup.close()"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<ns-form v-if="tempFormData" :data="tempFormData.json_data" ref="tempForm"></ns-form>
|
||||
<ns-form v-if="tempFormData" :data="tempFormData.json_data" ref="tempForm" />
|
||||
</scroll-view>
|
||||
<view class="popup-footer" @click="saveForm" :class="{ 'bottom-safe-area': isIphoneX }">
|
||||
<view class="confirm-btn color-base-bg">确定</view>
|
||||
@@ -603,7 +668,7 @@
|
||||
<text class="iconfont icon-close" @click="$refs.memberGoodsCardPopup.close()"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="popup-body" :class="{ 'safe-area': isIphoneX }">
|
||||
<view v-for="(item, index) in selectGoodsCard.cardList" class="card-item" @click="selectGoodsCard.click(item.item_id)">
|
||||
<view v-for="(item, index) in selectGoodsCard.cardList" class="card-item" @click="selectGoodsCard.click(item.item_id)" :key="item.item_id">
|
||||
<view class="content">
|
||||
<view class="title">{{ item.goods_name }}</view>
|
||||
<view class="info">
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<x-skeleton data-component-name="diy-article" type="list" :loading="loading" :configs="skeletonConfig">
|
||||
<view :style="value.pageStyle" v-if="loading || (list && list.length)">
|
||||
<x-skeleton type="list" :loading="loading" :configs="skeletonConfig">
|
||||
<view class="article-wrap" :style="warpCss">
|
||||
<view :class="['list-wrap', value.style]" :style="warpCss">
|
||||
<view :class="['item', value.ornament.type]" v-for="(item, index) in list" :key="index" @click="toDetail(item)" :style="itemCss">
|
||||
@@ -8,19 +9,19 @@
|
||||
</view>
|
||||
<view class="info-wrap">
|
||||
<text class="title">{{ item.article_title }}</text>
|
||||
<text class="desc" style="color:#888;font-size: 24rpx; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;">{{ item.article_abstract }}</text>
|
||||
<view class="read-wrap">
|
||||
<block v-if="item.category_name">
|
||||
<text class="category-icon"></text>
|
||||
<text>{{ item.category_name }}</text>
|
||||
</block>
|
||||
<text class="date">{{ $util.timeStampTurnTime(item.create_time, 'date') }}</text>
|
||||
<text class="date">{{ $util.timeStampTurnTime(item.create_time, 'Y-m-d') }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</x-skeleton>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -29,7 +30,10 @@
|
||||
name: 'diy-article',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 视频
|
||||
// 音频
|
||||
export default {
|
||||
name: 'diy-audio',
|
||||
props: {
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<view :style="value.pageStyle" v-if="loading || (list && list.length)">
|
||||
<x-skeleton data-component-name="diy-bargain" :type="skeletonType" :loading="loading" :configs="skeletonConfig">
|
||||
<view class="diy-bargain" :class="[value.template, value.style]" :style="warpCss">
|
||||
|
||||
@@ -123,6 +124,7 @@
|
||||
|
||||
</view>
|
||||
</x-skeleton>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -130,7 +132,10 @@
|
||||
name: 'diy-bargain',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -33,14 +33,13 @@
|
||||
</block>
|
||||
|
||||
<block v-if="type == 'goods'">
|
||||
<view class="categoty-goods-wrap" v-if="loadType == 'part'"
|
||||
:style="'padding-top:' + (value.search ? 0 : '20rpx')">
|
||||
<view class="categoty-goods-wrap" v-if="loadType == 'part'" :style="'padding-top:' + (value.search ? 0 : '20rpx')">
|
||||
<!-- 分类筛选 -->
|
||||
<block v-if="category.child_list && value.goodsLevel == 2">
|
||||
<view class="screen-category-wrap">
|
||||
<scroll-view scroll-x="true" class="screen-category" :class="{ 'screen-category-4': value.template == 4 }" :scroll-with-animation="true" :scroll-into-view="scrollIntoView">
|
||||
<view class="item" id="category-2--1" :class="{ selected: categoryId == -1 }" @click="selectCategoey(-1)">全部</view>
|
||||
<view class="item" :id="'category-2-' + oneIndex" :class="{ selected: categoryId == oneIndex }" @click="selectCategoey(oneIndex)" v-for="(one, oneIndex) in category.child_list" :key="oneIndex">
|
||||
<view class="item" id="category-2--1" :class="{ selected: categoryId == -1 }" @click="selectCategory(-1)">全部</view>
|
||||
<view class="item" :id="'category-2-' + oneIndex" :class="{ selected: categoryId == oneIndex }" @click="selectCategory(oneIndex)" v-for="(one, oneIndex) in category.child_list" :key="oneIndex">
|
||||
{{ one.category_name }}
|
||||
</view>
|
||||
</scroll-view>
|
||||
@@ -50,14 +49,14 @@
|
||||
<view class="screen-category-popup" @click="$refs.screenCategoryPopup.close()">
|
||||
<scroll-view scroll-y="true" class="screen-category" :class="{ 'screen-category-4': value.template == 4 }">
|
||||
<view class="title">全部</view>
|
||||
<view class="item" :class="{ selected: categoryId == oneIndex }" @click="selectCategoey(oneIndex)" v-for="(one, oneIndex) in category.child_list" :key="oneIndex">
|
||||
<view class="item" :class="{ selected: categoryId == oneIndex }" @click="selectCategory(oneIndex)" v-for="(one, oneIndex) in category.child_list" :key="oneIndex">
|
||||
{{ one.category_name }}
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</block>
|
||||
<!---->
|
||||
|
||||
<scroll-view scroll-y="true" class="scroll-goods-view" lower-threshold="300" :scroll-top="scrollTop" @scrolltolower="scrolltolower" @touchstart="touchstart" @touchend="touchend" @scroll="listenScroll">
|
||||
|
||||
<!--一级分类展示商品显示-->
|
||||
@@ -70,6 +69,9 @@
|
||||
<view class="goods-img" @click="toDetail(item)">
|
||||
<image :src="goodsImg(item.goods_image)" mode="widthFix" @error="imgError(index)"/>
|
||||
<view class="color-base-bg goods-tag" v-if="item.label_name">{{ item.label_name }}</view>
|
||||
<view class="sell-out" v-if="item.goods_stock <= 0">
|
||||
<text class="iconfont icon-shuqing"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-wrap">
|
||||
<view class="name-wrap" @click="toDetail(item)">
|
||||
@@ -293,7 +295,7 @@
|
||||
oneCategorySelect: function() {
|
||||
this.scrollTop = -1;
|
||||
this.goodsList = [];
|
||||
this.selectCategoey(-1);
|
||||
this.selectCategory(-1);
|
||||
},
|
||||
select: function() {
|
||||
if (this.index == this.select) {
|
||||
@@ -607,7 +609,7 @@
|
||||
}
|
||||
this.$emit('selectsku', data);
|
||||
},
|
||||
selectCategoey(index) {
|
||||
selectCategory(index) {
|
||||
this.categoryId = index;
|
||||
this.pageIndex = 0;
|
||||
this.totalPage = 1;
|
||||
@@ -667,7 +669,7 @@
|
||||
this.$emit('switch', index);
|
||||
} else {
|
||||
let index = this.categoryId - 1;
|
||||
this.selectCategoey(index);
|
||||
this.selectCategory(index);
|
||||
}
|
||||
} else {
|
||||
if (this.categoryId == -1 || (this.category.child_list && this.categoryId == this.category.child_list.length - 1)) {
|
||||
@@ -675,7 +677,7 @@
|
||||
this.$emit('switch', index);
|
||||
} else {
|
||||
let index = this.categoryId + 1;
|
||||
this.selectCategoey(index);
|
||||
this.selectCategory(index);
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -995,7 +997,27 @@
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.sell-out{
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: $border-radius;
|
||||
text{
|
||||
color: #fff;
|
||||
font-size: 150rpx;
|
||||
position: absolute;
|
||||
left:50%;
|
||||
top:50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
}
|
||||
.info-wrap {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
@@ -1171,10 +1193,28 @@
|
||||
height: auto;
|
||||
margin-right: 0;
|
||||
line-height: 1;
|
||||
|
||||
position: relative;
|
||||
image {
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.sell-out{
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom:0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: $border-radius;
|
||||
text{
|
||||
color: #fff;
|
||||
font-size: 240rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select-sku {
|
||||
@@ -1200,7 +1240,7 @@
|
||||
|
||||
.screen-category-wrap {
|
||||
display: flex;
|
||||
|
||||
padding-top: 20rpx;
|
||||
.icon-unfold {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
|
||||
@@ -2,20 +2,20 @@
|
||||
<view data-component-name="diy-category" :class="['category-page-wrap', 'category-template-' + value.template]"
|
||||
:style="{height: 'calc(100vh - '+ tabBarHeight +')' }">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<!-- <block v-if="value.template == 4">
|
||||
<block v-if="value.template == 4">
|
||||
<view class="search-box" v-if="value.search" @click="$util.redirectTo('/pages_tool/goods/search')" :style="navbarInnerStyle">
|
||||
<view class="search-content">
|
||||
<input type="text" class="uni-input font-size-tag" maxlength="50" :placeholder="$lang('search')" confirm-type="search" disabled="true" />
|
||||
<input type="text" class="uni-input font-size-tag" maxlength="50" :placeholder="$lang('search')" confirm-type="search" readonly="true" disabled="true" />
|
||||
<text class="iconfont icon-sousuo3"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view :style="navbarInnerStyle" v-if="!value.search">商品分类</view>
|
||||
</block> -->
|
||||
</block>
|
||||
<block v-if="value.template != 4">
|
||||
<!-- <view :style="navbarInnerStyle">商品分类</view> -->
|
||||
<view :style="navbarInnerStyle">商品分类</view>
|
||||
<view class="search-box" v-if="value.search" @click="$util.redirectTo('/pages_tool/goods/search')" :style="wxSearchHeight">
|
||||
<view class="search-content">
|
||||
<input type="text" class="uni-input" maxlength="50" :placeholder="$lang('search')" confirm-type="search" disabled="true" />
|
||||
<input type="text" class="uni-input" maxlength="50" :placeholder="$lang('search')" confirm-type="search" readonly="true" disabled="true" />
|
||||
<text class="iconfont icon-sousuo3"></text>
|
||||
</view>
|
||||
</view>
|
||||
@@ -24,11 +24,12 @@
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="search-box" v-if="value.search" @click="$util.redirectTo('/pages_tool/goods/search')">
|
||||
<view class="search-content">
|
||||
<input type="text" class="uni-input" maxlength="50" :placeholder="$lang('search')" confirm-type="search" disabled="true" />
|
||||
<input type="text" class="uni-input" maxlength="50" :placeholder="$lang('search')" confirm-type="search" readonly="true" disabled="true" />
|
||||
<text class="iconfont icon-sousuo3"></text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
<view class="template-four wx" v-if="value.template == 4">
|
||||
<scroll-view scroll-x="true" class="template-four-wrap" :scroll-with-animation="true" :scroll-into-view="'category-one-' + oneCategorySelect" enable-flex="true">
|
||||
<view class="category-item" :id="'category-one-' + index" v-for="(item, index) in templateFourData" :key="index" :class="{ select: oneCategorySelect == index }" @click="templateFourOneFn(index)">
|
||||
@@ -71,12 +72,13 @@
|
||||
{ 'border-bottom': value.template == 4 && select + 1 === index },
|
||||
{ 'border-top': value.template == 4 && select - 1 === index }
|
||||
]" @click="switchOneCategory(index)">
|
||||
<view class="">{{ item.category_name }}</view>
|
||||
<view>{{ item.category_name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="right-flex-wrap">
|
||||
|
||||
<scroll-view scroll-y="true" class="content-wrap" v-if="value.template == 1 || loadType == 'all'"
|
||||
ref="contentWrap" :scroll-into-view="categoryId" :scroll-with-animation="true"
|
||||
@scroll="listenScroll" @touchstart="touchStart" :refresher-enabled="true"
|
||||
@@ -113,8 +115,8 @@
|
||||
<image :src="$util.img('public/uniapp/category/empty.png')" mode="widthFix"></image>
|
||||
<view class="tips">暂时没有分类哦!</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="cart-box" v-if="(value.template == 2 || value.template == 4) && value.quickBuy && storeToken && categoryTree && categoryTree.length">
|
||||
<view class="cart-bottom-block" v-if="(value.template == 2 || value.template == 4) && value.quickBuy && storeToken && categoryTree && categoryTree.length"></view>
|
||||
<view class="cart-box" v-if="(value.template == 2 || value.template == 4) && value.quickBuy && storeToken && categoryTree && categoryTree.length" :style="{ bottom: tabBarHeight }" :class="{ active: isIphoneX }">
|
||||
<view class="left-wrap">
|
||||
<view class="cart-icon" ref="cartIcon" :animation="cartAnimation" @click="$util.redirectTo('/pages/goods/cart')">
|
||||
<text class="iconfont icon-ziyuan1"></text>
|
||||
@@ -127,9 +129,10 @@
|
||||
<text class="unit font-size-tag price-font">.{{ cartTotalMoney[1] ? cartTotalMoney[1] : '00' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right-wrap"><button type="primary" class="settlement-btn" @click="settlement">去结算</button>
|
||||
<view class="right-wrap">
|
||||
<button type="primary" class="settlement-btn" @click="settlement">去结算</button>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<view class="cart-point" :style="{ left: item.left + 'px', top: item.top + 'px' }" :key="index" v-for="(item, index) in carIconList"></view>
|
||||
|
||||
@@ -176,34 +179,27 @@
|
||||
cartAnimation: {},
|
||||
loadType: '',
|
||||
templateFourData: [],
|
||||
isIphoneX: false, //判断手机是否是iphoneX以上,
|
||||
lang:uni.getStorageSync("lang")//en-us 英文
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.isIphoneX = this.$util.uniappIsIPhoneX();
|
||||
this.getCategoryTree();
|
||||
this.loadType = this.value.goodsLevel == 1 && this.value.loadType == 'all' ? 'all' : 'part';
|
||||
},
|
||||
mounted() {
|
||||
query = uni.createSelectorQuery().in(this);
|
||||
query
|
||||
.select('.content-wrap')
|
||||
.boundingClientRect(data => {
|
||||
query.select('.content-wrap').boundingClientRect(data => {
|
||||
if (data) contentWrapHeight = data.height;
|
||||
})
|
||||
.exec();
|
||||
}).exec();
|
||||
setTimeout(() => {
|
||||
query
|
||||
.select('.end-tips')
|
||||
.boundingClientRect(data => {
|
||||
query.select('.end-tips').boundingClientRect(data => {
|
||||
if (data && data.top > contentWrapHeight) this.endTips = 1;
|
||||
})
|
||||
.exec();
|
||||
query
|
||||
.select('.cart-icon')
|
||||
.boundingClientRect(data => {
|
||||
}).exec();
|
||||
query.select('.cart-icon').boundingClientRect(data => {
|
||||
if (data) cartPosition = data;
|
||||
})
|
||||
.exec();
|
||||
}).exec();
|
||||
if (this.value.template == 1) this.getHeightArea(-1);
|
||||
}, 500);
|
||||
},
|
||||
@@ -250,7 +246,7 @@
|
||||
style += 'padding-top:' + this.navbarHeight + 'px;';
|
||||
style += 'text-align: center;';
|
||||
style += 'line-height:' + menuButtonInfo.height * 2 + 'rpx;';
|
||||
style += 'font-size: 14px;';
|
||||
style += 'font-size: 16px;';
|
||||
style += 'padding-bottom: 10rpx;';
|
||||
}
|
||||
return style;
|
||||
@@ -282,27 +278,48 @@
|
||||
pageShow() {
|
||||
this.$store.dispatch('getCartNumber');
|
||||
if (!this.heightArea.length) this.getHeightArea(-1);
|
||||
this.dealCategoryData()
|
||||
},
|
||||
dealCategoryData() {
|
||||
if (uni.getStorageSync('tabBarParams')) {
|
||||
if (this.value.template != 4) {
|
||||
this.categoryTree.forEach((item,index) => {
|
||||
if(item.category_id == uni.getStorageSync('tabBarParams').split('=')[1]) {
|
||||
this.select = index;
|
||||
this.categoryId = 'category-' + index;
|
||||
// 阻止切换分类之后滚动事件也立即执行
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.templateFourData.forEach((item,index) => {
|
||||
if(item.category_id == uni.getStorageSync('tabBarParams').split('=')[1]) {
|
||||
this.oneCategorySelect = index;
|
||||
this.categoryId = 'category-' + index;
|
||||
// 阻止切换分类之后滚动事件也立即执行
|
||||
this.categoryTree = this.templateFourData[index].child_list || [];
|
||||
this.select = 0;
|
||||
}
|
||||
})
|
||||
}
|
||||
uni.removeStorageSync('tabBarParams')
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 获取高度区间
|
||||
*/
|
||||
getHeightArea(index) {
|
||||
let heightArea = [];
|
||||
query
|
||||
.selectAll('.content-wrap .child-category')
|
||||
.boundingClientRect(data => {
|
||||
query.selectAll('.content-wrap .child-category').boundingClientRect(data => {
|
||||
if (data && data.length) {
|
||||
data.forEach((item, index) => {
|
||||
if (index == 0) heightArea.push([0, item.height]);
|
||||
else heightArea.push([heightArea[index - 1][1], heightArea[index - 1][1] +
|
||||
item.height
|
||||
]);
|
||||
else heightArea.push([heightArea[index - 1][1], heightArea[index - 1][1] + item.height]);
|
||||
});
|
||||
}
|
||||
})
|
||||
.exec();
|
||||
}).exec();
|
||||
this.heightArea = heightArea;
|
||||
if (index != -1 && index < this.categoryTree.length - 1) this.$refs.categoryItem[index + 1].getGoodsList();
|
||||
this.refreshData();
|
||||
},
|
||||
/**
|
||||
* 获取全部分类
|
||||
@@ -332,6 +349,7 @@
|
||||
return item;
|
||||
});
|
||||
}
|
||||
this.dealCategoryData()
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -364,8 +382,7 @@
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (this.value.template != 1 && this.value.loadType == 'all' && this.heightArea[this.select][1] -
|
||||
scrollTop - contentWrapHeight < 300) {
|
||||
if (this.value.template != 1 && this.value.loadType == 'all' && this.heightArea[this.select][1] - scrollTop - contentWrapHeight < 300) {
|
||||
this.$refs.categoryItem[this.select].getGoodsList();
|
||||
}
|
||||
}
|
||||
@@ -433,6 +450,37 @@
|
||||
});
|
||||
},
|
||||
settlement() {
|
||||
|
||||
// 是否有商品库存不足 不足最小购买数 超过最大购买数
|
||||
var no_buy = false;
|
||||
|
||||
for (let k in this.cartList) {
|
||||
let item = this.cartList[k];
|
||||
|
||||
for (let sku in item) {
|
||||
if (item.max_buy && item.num > item.max_buy){
|
||||
no_buy = true;
|
||||
this.$util.showToast({title: '商品' + item.goods_name+'商品最多可购买'+item.max_buy+'件'})
|
||||
break;
|
||||
}
|
||||
if (typeof item[sku] == 'object') {
|
||||
if (item[sku].num > item[sku].stock){
|
||||
no_buy = true;
|
||||
this.$util.showToast({title: '商品' + item.goods_name+'库存不足'})
|
||||
break;
|
||||
}
|
||||
if (item[sku].min_buy && item[sku].num < item[sku].min_buy){
|
||||
no_buy = true;
|
||||
this.$util.showToast({title: '商品' + item.goods_name+'商品最少要购买'+item[sku].min_buy+'件'})
|
||||
break;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(no_buy) return;
|
||||
|
||||
if (!this.cartIds.length || this.isSub) return;
|
||||
this.isSub = true;
|
||||
|
||||
@@ -520,7 +568,7 @@
|
||||
},
|
||||
// 操作多规格商品弹框后,刷新商品数据
|
||||
refreshData() {
|
||||
this.$refs.categoryItem[this.select].loadGoodsCartNum(true);
|
||||
if(this.$refs.categoryItem) this.$refs.categoryItem[this.select].loadGoodsCartNum(true);
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -529,7 +577,8 @@
|
||||
<style lang="scss">
|
||||
.category-page-wrap {
|
||||
width: 100vw;
|
||||
// height: calc(100vh - var(--tab-bar-height, 0));
|
||||
height: 100vh;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
@@ -584,10 +633,16 @@
|
||||
view {
|
||||
color: #222222;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
// white-space: nowrap;
|
||||
// text-overflow: ellipsis;
|
||||
line-height: 1.3;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
// display: -webkit-box;
|
||||
// -webkit-line-clamp: 2;
|
||||
// -webkit-box-orient: vertical;
|
||||
word-break: break-all;
|
||||
max-height: 100rpx;
|
||||
}
|
||||
|
||||
&.border-top {
|
||||
@@ -667,6 +722,11 @@
|
||||
.cart-box {
|
||||
height: 100rpx;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: var(--tab-bar-height, 0);
|
||||
// bottom: calc( constant(safe-area-inset-bottom) + 110rpx );
|
||||
// bottom: calc( env(safe-area-inset-bottom) + 110rpx );
|
||||
background: #fff;
|
||||
border-top: 1px solid #f5f5f5;
|
||||
box-sizing: border-box;
|
||||
@@ -739,6 +799,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
.cart-box.active {
|
||||
bottom: calc(constant(safe-area-inset-bottom) + 110rpx) !important;
|
||||
bottom: calc(env(safe-area-inset-bottom) + 110rpx) !important;
|
||||
}
|
||||
|
||||
.cart-point {
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
@@ -785,7 +850,7 @@
|
||||
}
|
||||
|
||||
.cart-box {
|
||||
position: relative;
|
||||
// position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
@@ -865,15 +930,30 @@
|
||||
}
|
||||
|
||||
.text {
|
||||
padding: 2rpx 16rpx;
|
||||
padding: 2rpx 0;
|
||||
border-radius: 40rpx;
|
||||
font-size: $font-size-tag;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
|
||||
}
|
||||
.ellipsis {
|
||||
// text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
&.selected {
|
||||
.text {
|
||||
background-color: $base-color;
|
||||
color: var(--btn-text-color);
|
||||
line-height: 1.3;
|
||||
border: 4rpx solid transparent;
|
||||
border-color: $base-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1004,4 +1084,7 @@
|
||||
border-bottom-right-radius: 8rpx;
|
||||
}
|
||||
}
|
||||
.cart-bottom-block {
|
||||
height: 100rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -1,5 +1,7 @@
|
||||
<template>
|
||||
<view data-component-name="diy-comp-extend"></view>
|
||||
<view data-component-name="diy-comp-extend" :style="value.pageStyle">
|
||||
<view></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -8,7 +10,10 @@ export default {
|
||||
name: 'diy-comp-extend',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<x-skeleton data-component-name="diy-coupon" type="banner" :loading="loading" :configs="skeletonConfig">
|
||||
<view :style="value.pageStyle" v-if="loading || (computedCouponList && computedCouponList.length)">
|
||||
<x-skeleton type="banner" :loading="loading" :configs="skeletonConfig">
|
||||
<view class="coupon-wrap" :class="'coupon-box-' + value.style" :style="[
|
||||
value.couponType == 'img' && { backgroundImage: 'url(' + $util.img(value.couponBgUrl) + ')' },
|
||||
value.couponType == 'color' && { backgroundColor: value.couponBgColor }
|
||||
@@ -9,8 +10,7 @@
|
||||
<swiper class="coupon-style-one" circular>
|
||||
<swiper-item v-for="(numItem, numIndex) in Math.ceil(computedCouponList.length / 3)" :key="numIndex" class="coupon-item-box">
|
||||
|
||||
<view v-for="(item, index) in computedCouponList" class="coupon-item"
|
||||
v-if="index >= [numIndex * 3] && index < [(numIndex + 1) * 3]" :style="{
|
||||
<view v-for="(item, index) in computedCouponList" class="coupon-item" v-if="index >= [numIndex * 3] && index < [(numIndex + 1) * 3]" :style="{
|
||||
color: value.moneyColor,
|
||||
backgroundImage: 'url(' + $util.img('public/uniapp/coupon/style1-bg.png') + ')',
|
||||
marginRight: couponItemHeight + 'px',
|
||||
@@ -30,10 +30,12 @@
|
||||
{{ item.at_least > 0 ? '满' + Number(item.at_least) + '元可用' : '无门槛优惠券' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0">
|
||||
{{ value.btnStyle.text }}
|
||||
</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="parseInt(item.useState)">去使用</view>
|
||||
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0" >{{ value.btnStyle.text }}</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 1" >去使用</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 2">已抢光</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 3">已失效</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 4">已使用</view>
|
||||
</view>
|
||||
|
||||
</swiper-item>
|
||||
@@ -63,11 +65,12 @@
|
||||
{{ item.at_least > 0 ? '满' + Number(item.at_least) + '元可用' : '无门槛优惠券' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0">
|
||||
{{ value.btnStyle.text || '领取' }}
|
||||
</view>
|
||||
<view class="coupon-get use" :style="couponBtnStyle" v-if="parseInt(item.useState)">去使用
|
||||
</view>
|
||||
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0" >{{ value.btnStyle.text || '领取' }}</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 1" >去使用</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 2">已抢光</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 3">已失效</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 4">已使用</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
@@ -93,15 +96,14 @@
|
||||
</view>
|
||||
<view class="coupon-type font-size-tag">
|
||||
<text :style="{ color: value.limitColor }">{{ item.at_least > 0 ? '满' + Number(item.at_least) + '元可用' : '无门槛优惠券' }}</text>
|
||||
<view class="item-text" v-if="item.goods_type == 1">所有商品可用</view>
|
||||
<view class="item-text" v-else-if="item.goods_type == 2">指定商品可用</view>
|
||||
<view class="item-text" v-else-if="item.goods_type == 3">指定商品不可用</view>
|
||||
<view class="item-text">{{item.goods_type_name}}</view>
|
||||
</view>
|
||||
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0">
|
||||
{{ value.btnStyle.text || '领取' }}
|
||||
</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="parseInt(item.useState)">去使用</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0" >{{ value.btnStyle.text || '领取' }}</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 1" >去使用</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 2">已抢光</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 3">已失效</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 4">已使用</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
@@ -130,10 +132,12 @@
|
||||
{{ item.at_least > 0 ? '满' + Number(item.at_least) + '元可用' : '无门槛优惠券' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0">
|
||||
{{ value.btnStyle.text || '立即使用' }}
|
||||
</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="parseInt(item.useState)">去使用</view>
|
||||
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0" >{{ value.btnStyle.text || '立即领取' }}</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 1" >去使用</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 2">已抢光</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 3">已失效</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 4">已使用</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
@@ -163,8 +167,12 @@
|
||||
<text class="coupon-least" :style="{ color: value.limitColor }" v-if="item.at_least > 0">满{{ Number(item.at_least) }}元可用</text>
|
||||
<text class="coupon-least" :style="{ color: value.limitColor }" v-else>无门槛优惠券</text>
|
||||
</view>
|
||||
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0" >{{ value.btnStyle.text || '立即领取' }}</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="parseInt(item.useState)">去使用</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 1" >去使用</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 2">已抢光</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 3">已失效</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 4">已使用</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -190,7 +198,7 @@
|
||||
</view>
|
||||
<text class="text">优惠券</text>
|
||||
</view>
|
||||
<text class="btn" v-if="item.useState == 0" :style="{
|
||||
<!-- <text class="btn" v-if="item.useState == 0" :style="{
|
||||
color: value.btnStyle.textColor,
|
||||
backgroundColor: value.btnStyle.bgColor,
|
||||
borderTopLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx',
|
||||
@@ -205,7 +213,43 @@
|
||||
borderBottomLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}">
|
||||
<text class="btn-content">去使用</text>
|
||||
</text> -->
|
||||
|
||||
<text class="btn" v-if="item.useState == 0" :style="{
|
||||
color: value.btnStyle.textColor,
|
||||
backgroundColor: value.btnStyle.bgColor,
|
||||
borderTopLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx',
|
||||
borderBottomLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}">
|
||||
<text class="btn-content">{{ value.btnStyle.text }}</text>
|
||||
</text>
|
||||
<text class="btn to-use" v-if="item.useState == 1" :style="{
|
||||
color: value.btnStyle.textColor,
|
||||
backgroundColor: value.btnStyle.bgColor,
|
||||
borderTopLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx',
|
||||
borderBottomLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}">
|
||||
<text class="btn-content">去使用</text>
|
||||
</text>
|
||||
<text class="btn disabled" v-if="item.useState == 2" :style="{
|
||||
borderTopLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx',
|
||||
borderBottomLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}">
|
||||
<text class="btn-content">已抢光</text>
|
||||
</text>
|
||||
<text class="btn disabled" v-if="item.useState == 3" :style="{
|
||||
borderTopLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx',
|
||||
borderBottomLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}">
|
||||
<text class="btn-content">已失效</text>
|
||||
</text>
|
||||
<text class="btn disabled" v-if="item.useState == 4" :style="{
|
||||
borderTopLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx',
|
||||
borderBottomLeftRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}">
|
||||
<text class="btn-content">已使用</text>
|
||||
</text>
|
||||
|
||||
<text class="limit" :style="{ color: value.limitColor }" v-if="parseFloat(item.at_least) > 0">满{{ item.at_least | moneyConduct }}元使用</text>
|
||||
<text class="limit" :style="{ color: value.limitColor }" v-else>无门槛使用</text>
|
||||
</view>
|
||||
@@ -246,14 +290,17 @@
|
||||
<view class="coupon-type">
|
||||
<text class="coupon-name" :style="{ color: value.limitColor }" v-if="item.at_least > 0">满{{ Number(item.at_least) }}元可用</text>
|
||||
<text class="coupon-name" :style="{ color: value.limitColor }" v-else>无门槛优惠券</text>
|
||||
<view class="coupon-least" :style="{ color: value.limitColor }">有效期至{{ $util.timeStampTurnTime(item.end_time, 'yearmonthday') }}</view>
|
||||
<view class="coupon-least" v-if="item.validity_type == 0" :style="{ color: value.limitColor }">有效期至{{ $util.timeStampTurnTime(item.end_time, 'Y-m-d') }}</view>
|
||||
<view class="coupon-least" v-else-if="item.validity_type == 1" :style="{ color: value.limitColor }">领取后{{ item.fixed_term }}天有效</view>
|
||||
<view class="coupon-least" v-else :style="{ color: value.limitColor }">领取后长期有效</view>
|
||||
</view>
|
||||
<view class="coupon-line"></view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0">
|
||||
{{ value.btnStyle.text || '立即领取' }}
|
||||
</view>
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="parseInt(item.useState)">去使用
|
||||
</view>
|
||||
|
||||
<view class="coupon-get" :style="couponBtnStyle" v-if="item.useState == 0" >{{ value.btnStyle.text || '立即领取' }}</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 1" >去使用</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 2">已抢光</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 3">已失效</view>
|
||||
<view class="coupon-get three-text" :style="couponBtnStyle" v-if="item.useState == 4">已使用</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -265,6 +312,7 @@
|
||||
</view>
|
||||
|
||||
</x-skeleton>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -313,17 +361,11 @@
|
||||
couponItemHeight() {
|
||||
var width = '';
|
||||
const screenWidth = uni.getSystemInfoSync().windowWidth;
|
||||
if (this.value.style == '1') width = [screenWidth - this.rpxUpPx(210) * 3 - this.rpxUpPx(this.value.margin
|
||||
.both * 2) * 2] / 6;
|
||||
else if (this.value.style == '2') width = [screenWidth - this.rpxUpPx(210) * 3 - this.rpxUpPx(this.value
|
||||
.margin.both * 2) * 2] / 6;
|
||||
else if (this.value.style == '3') width = [screenWidth - this.rpxUpPx(24) * 2 - this.rpxUpPx(194) * 3 -
|
||||
this.rpxUpPx(this.value.margin.both * 2) * 2
|
||||
] / 6;
|
||||
else if (this.value.style == '4') width = [screenWidth - this.rpxUpPx(206) * 3 - this.rpxUpPx(this.value
|
||||
.margin.both * 2) * 2] / 6;
|
||||
else if (this.value.style == '6') width = [screenWidth - this.rpxUpPx(208) * 3 - this.rpxUpPx(this.value
|
||||
.margin.both * 2) * 2] / 6;
|
||||
if (this.value.style == '1') width = [screenWidth - this.rpxUpPx(210) * 3 - this.rpxUpPx(this.value.margin.both * 2) * 2] / 6;
|
||||
else if (this.value.style == '2') width = [screenWidth - this.rpxUpPx(210) * 3 - this.rpxUpPx(this.value.margin.both * 2) * 2] / 6;
|
||||
else if (this.value.style == '3') width = [screenWidth - this.rpxUpPx(24) * 2 - this.rpxUpPx(194) * 3 - this.rpxUpPx(this.value.margin.both * 2) * 2] / 6;
|
||||
else if (this.value.style == '4') width = [screenWidth - this.rpxUpPx(206) * 3 - this.rpxUpPx(this.value.margin.both * 2) * 2] / 6;
|
||||
else if (this.value.style == '6') width = [screenWidth - this.rpxUpPx(208) * 3 - this.rpxUpPx(this.value.margin.both * 2) * 2] / 6;
|
||||
|
||||
return width;
|
||||
},
|
||||
@@ -357,12 +399,18 @@
|
||||
if (data != null) {
|
||||
this.couponList = data;
|
||||
this.couponList.forEach(v => {
|
||||
if (v.max_fetch != 0 && v.member_coupon_num && v.member_coupon_num >= v
|
||||
.max_fetch) {
|
||||
v.useState = 1;
|
||||
} else {
|
||||
v.useState = 0;
|
||||
}
|
||||
// if (v.count == v.lead_count) v.useState = 2;
|
||||
// else if (v.max_fetch != 0 && v.member_coupon_num && v.member_coupon_num >= v.max_fetch) v.useState = 1;
|
||||
// else v.useState = 0;
|
||||
// if(v.received_type && v.received_type == 'expire'){
|
||||
// v.useState = 2;
|
||||
// }
|
||||
|
||||
if (v.count == v.lead_count) v.useState = 2;
|
||||
else if (v.max_fetch == 0 || (v.max_fetch != 0 && !v.member_coupon_num) || (v.max_fetch != 0 && v.member_coupon_num && v.max_fetch > v.member_coupon_num)) v.useState = 0;
|
||||
else if (v.wait_coupon_num) v.useState = 1
|
||||
else if (v.lose_coupon_num) v.useState = 3;
|
||||
else if (v.use_coupon_num) v.useState = 4;
|
||||
});
|
||||
}
|
||||
this.loading = false;
|
||||
@@ -372,18 +420,34 @@
|
||||
couponAction(item, index) {
|
||||
if (item.useState == 0) {
|
||||
this.receiveCoupon(item, index);
|
||||
} else if (parseInt(item.useState)) {
|
||||
} else {
|
||||
this.couponTap(item, index);
|
||||
}
|
||||
|
||||
|
||||
// if(item.received_type == 'out'){
|
||||
// this.$util.showToast({
|
||||
// title: '该优惠券已抢光'
|
||||
// });
|
||||
// }else if(item.received_type == 'expire'){
|
||||
// this.$util.showToast({
|
||||
// title: '该优惠券已过期'
|
||||
// });
|
||||
// }else if(item.received_type == 'limit'){
|
||||
// this.$util.showToast({
|
||||
// title: '该优惠券领取已达上限'
|
||||
// });
|
||||
// }
|
||||
},
|
||||
couponTap(item, index) {
|
||||
if (item.count == item.lead_count) {
|
||||
if(item.useState == 2){
|
||||
this.$util.showToast({
|
||||
title: '该优惠券已抢光'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (item.useState == 0) this.receiveCoupon(item, index);
|
||||
else if (item.useState == 3 || item.useState == 4) this.$util.redirectTo('/pages_tool/member/coupon',{state: item.useState == 4 ? 2 : item.useState})
|
||||
else this.toGoodsList(item);
|
||||
},
|
||||
// 领取优惠券
|
||||
@@ -527,7 +591,7 @@
|
||||
|
||||
.coupon-get {
|
||||
position: relative;
|
||||
top: 2rpx;
|
||||
top: 0;
|
||||
right: 12rpx;
|
||||
font-size: 24rpx;
|
||||
letter-spacing: 16rpx;
|
||||
@@ -538,6 +602,10 @@
|
||||
right: 4rpx;
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
|
||||
&.three-text {
|
||||
line-height: 1.2;
|
||||
}
|
||||
}
|
||||
|
||||
.coupon-info {
|
||||
@@ -873,6 +941,12 @@
|
||||
line-height: 1;
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
background-color: #eee;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.coupon-content {
|
||||
@@ -1045,6 +1119,11 @@
|
||||
font-size: $font-size-tag;
|
||||
box-sizing: border-box;
|
||||
flex-shrink: 0;
|
||||
|
||||
&.three-text {
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
276
components/diy-components/diy-digit.vue
Normal file
276
components/diy-components/diy-digit.vue
Normal file
@@ -0,0 +1,276 @@
|
||||
<template>
|
||||
<view :style="componentStyle">
|
||||
<scroll-view
|
||||
:class="['graphic-nav', value.showStyle == 'fixed' ? 'fixed-layout' : value.showStyle]"
|
||||
:scroll-x="value.showStyle == 'singleSlide'"
|
||||
>
|
||||
<view class="uni-scroll-view-content">
|
||||
<view
|
||||
v-for="(item, index) in value.list"
|
||||
:key="index"
|
||||
:class="['graphic-nav-item', value.mode, value.mode === 'text' ? 'newright' : '']"
|
||||
:style="{ width: (100 / value.rowCount + '%') + ';' }"
|
||||
>
|
||||
<view style="display:flex;">
|
||||
<view :style="{
|
||||
'line-height': '1.2;',
|
||||
'font-size': (value.font.titlesize * 2 + 'rpx') + ';',
|
||||
'font-weight': '600;',
|
||||
'color': value.font.titlecolor + ';'
|
||||
}">
|
||||
<uv-count-to
|
||||
:ref="`countTo-${index}`"
|
||||
:autoplay="true"
|
||||
:startVal="30"
|
||||
:endVal="item.title"
|
||||
:decimals="getvalue(item.title)"
|
||||
decimal="."
|
||||
></uv-count-to>
|
||||
<text :style="{
|
||||
'margin-left': '4rpx;',
|
||||
'font-size': (value.font.unitsize * 2 + 'rpx') + ';',
|
||||
'font-weight': value.font.weight + ';',
|
||||
'color': value.font.unitcolor + ';'
|
||||
}">{{ item.unit }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="graphic-text">
|
||||
<text :style="{
|
||||
'font-size': (value.font.descsize * 2 + 'rpx') + ';',
|
||||
'font-weight': value.font.weight + ';',
|
||||
'color': value.font.desccolor + ';'
|
||||
}">{{ item.desc }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<ns-login ref="login"></ns-login>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uvCountTo from '@/components/uv-count-to/uv-count-to.vue'
|
||||
import nsLogin from '@/components/ns-login/ns-login.vue'
|
||||
|
||||
export default {
|
||||
name: 'diy-digit',
|
||||
components: {
|
||||
uvCountTo,
|
||||
nsLogin
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pageWidth: '',
|
||||
indicatorDots: false,
|
||||
swiperCurrent: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 组件创建时的逻辑
|
||||
},
|
||||
watch: {
|
||||
componentRefresh(newValue) {
|
||||
// 监听组件刷新
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
componentStyle() {
|
||||
let style = '';
|
||||
style += 'background-image:url(' + this.$util.img(this.value.imageUrl) + ');background-size:100% 100%;';
|
||||
|
||||
if (this.value.componentAngle == 'round') {
|
||||
style += 'border-top-left-radius:' + (2 * this.value.topAroundRadius) + 'rpx;';
|
||||
style += 'border-top-right-radius:' + (2 * this.value.topAroundRadius) + 'rpx;';
|
||||
style += 'border-bottom-left-radius:' + (2 * this.value.bottomAroundRadius) + 'rpx;';
|
||||
style += 'border-bottom-right-radius:' + (2 * this.value.bottomAroundRadius) + 'rpx;';
|
||||
}
|
||||
|
||||
style += 'box-shadow:' + (this.value.ornament.type == 'shadow' ? '0 0 10rpx ' + this.value.ornament.color : '') + ';';
|
||||
style += 'border:' + (this.value.ornament.type == 'stroke' ? '2rpx solid ' + this.value.ornament.color : '') + ';';
|
||||
|
||||
return style;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取小数位数
|
||||
getvalue(value) {
|
||||
return value % 1 !== 0 ? 2 : 0;
|
||||
},
|
||||
|
||||
// 页面跳转
|
||||
redirectTo(item) {
|
||||
if (!item.wap_url || this.$util.getCurrRoute() != 'pages/member/index' || this.storeToken) {
|
||||
console.log(item);
|
||||
this.$util.diyRedirectTo(item);
|
||||
} else {
|
||||
this.$refs.login.open(item.wap_url);
|
||||
}
|
||||
},
|
||||
|
||||
// 轮播切换
|
||||
swiperChange(event) {
|
||||
this.swiperCurrent = event.detail.current;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.graphic-nav {
|
||||
padding: 16rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
&.fixed-layout {
|
||||
.uni-scroll-view-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
&.singleSlide {
|
||||
.uni-scroll-view-content {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.graphic-nav-item {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.pageSlide {
|
||||
position: relative;
|
||||
|
||||
.uni-swiper-dots-horizontal {
|
||||
bottom: 0rpx;
|
||||
}
|
||||
|
||||
&.straightLine {
|
||||
.uni-swiper-dot {
|
||||
width: 30rpx;
|
||||
border-radius: 0;
|
||||
height: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&.circle {
|
||||
.uni-swiper-dot {
|
||||
width: 14rpx;
|
||||
height: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.graphic-nav-wrap {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.graphic-nav-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 14rpx 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.graphic-text {
|
||||
line-height: 1.3;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
||||
&.alone {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.text {
|
||||
.graphic-text {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.graphic-img {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
font-size: 90rpx;
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
top: -10rpx;
|
||||
right: -24rpx;
|
||||
color: #fff;
|
||||
border-radius: 24rpx;
|
||||
border-bottom-left-radius: 0;
|
||||
-webkit-transform: scale(0.8);
|
||||
transform: scale(0.8);
|
||||
padding: 8rpx 16rpx;
|
||||
line-height: 1;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-size: 50rpx;
|
||||
color: #606266;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.pageSlide {
|
||||
.graphic-nav-item {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.newright {
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.swiper-dot-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: -20rpx;
|
||||
padding-bottom: 8rpx;
|
||||
|
||||
.swiper-dot {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
margin: 8rpx;
|
||||
|
||||
&.active {
|
||||
background-color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
&.straightLine {
|
||||
.swiper-dot {
|
||||
width: 30rpx;
|
||||
border-radius: 0;
|
||||
height: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&.circle {
|
||||
.swiper-dot {
|
||||
width: 15rpx;
|
||||
border-radius: 50%;
|
||||
height: 15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<view data-component-name="diy-fenxiao-goods-list" class="diy-fenxiao" v-if="list.length" :class="['goods-list', value.template, value.style]" :style="goodsListWarpCss">
|
||||
<view :style="value.pageStyle" v-if="list && list.length">
|
||||
<view class="diy-fenxiao" v-if="list.length" :class="['goods-list', value.template, value.style]" :style="goodsListWarpCss">
|
||||
<view class="goods-item" v-for="(item, index) in list" :key="index" @click="toDetail(item)" :class="[value.ornament.type]" :style="goodsItemCss">
|
||||
<view class="goods-img" :style="{ borderRadius: value.imgAroundRadius * 2 + 'rpx' }">
|
||||
<image :style="{ borderRadius: value.imgAroundRadius * 2 + 'rpx' }" :src="$util.img(item.goods_image, { size: 'mid' })" mode="widthFix" @error="imgError(index)"/>
|
||||
@@ -26,8 +27,7 @@
|
||||
color: value.btnStyle.theme == 'diy' ? value.btnStyle.textColor : '',
|
||||
borderRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}"
|
||||
@click.stop="followGoods(item, index)"
|
||||
>
|
||||
@click.stop="followGoods(item, index)">
|
||||
关注
|
||||
</view>
|
||||
<view class="sale-btn" v-if="value.btnStyle.control && item.is_collect == 1"
|
||||
@@ -36,8 +36,7 @@
|
||||
color: value.btnStyle.theme == 'diy' ? value.btnStyle.textColor : '',
|
||||
borderRadius: value.btnStyle.aroundRadius * 2 + 'rpx'
|
||||
}"
|
||||
@click.stop="delFollowTip(item, index)"
|
||||
>
|
||||
@click.stop="delFollowTip(item, index)">
|
||||
取消关注
|
||||
</view>
|
||||
</view>
|
||||
@@ -48,6 +47,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -55,7 +55,10 @@ export default {
|
||||
name: 'diy-fenxiao-goods-list',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
<template>
|
||||
<view data-component-name="diy-float-btn" class="float-btn" :class="{ left_top: value.bottomPosition == 1, right_top: value.bottomPosition == 2, left_bottom: value.bottomPosition == 3, right_bottom: value.bottomPosition == 4 }" :style="style">
|
||||
<view :style="value.pageStyle">
|
||||
<view class="float-btn" :class="{ left_top: value.bottomPosition == 1, right_top: value.bottomPosition == 2, left_bottom: value.bottomPosition == 3, right_bottom: value.bottomPosition == 4 }" :style="style">
|
||||
<block v-for="(item, index) in value.list" :key="index">
|
||||
<view class="button-box" @click="$util.diyRedirectTo(item.link)" :style="{ width: value.imageSize + 'px', height: value.imageSize + 'px', fontSize: value.imageSize + 'px' }">
|
||||
<image v-if="!item.iconType || item.iconType == 'img'" :src="$util.img(item.imageUrl)" mode="aspectFit" :show-menu-by-longpress="true"/>
|
||||
<diy-icon v-else-if="item.iconType && item.iconType == 'icon'" :icon="item.icon"
|
||||
:value="item.style ? item.style : null"></diy-icon>
|
||||
<diy-icon v-else-if="item.iconType && item.iconType == 'icon'" :icon="item.icon" :value="item.style ? item.style : null"></diy-icon>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@@ -1,8 +1,10 @@
|
||||
<template>
|
||||
<!-- #ifdef MP -->
|
||||
<view data-component-name="diy-follow-official-account" v-if="value.isShow">
|
||||
<view :style="value.pageStyle">
|
||||
<view v-if="value.isShow">
|
||||
<official-account></official-account>
|
||||
</view>
|
||||
</view>
|
||||
<!--#endif -->
|
||||
</template>
|
||||
|
||||
@@ -12,7 +14,10 @@
|
||||
name: 'diy-follow-official-account',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -1,17 +1,18 @@
|
||||
<template>
|
||||
<x-skeleton data-component-name="diy-goods-brand" type="waterfall" :loading="loading" :configs="skeletonConfig">
|
||||
<view :style="value.pageStyle" v-if="loading || (list && list.length)">
|
||||
<x-skeleton type="waterfall" :loading="loading" :configs="skeletonConfig">
|
||||
<view :class="['brand-wrap', value.ornament.type]" :style="warpCss">
|
||||
<view :class="[value.style]">
|
||||
<view class="title-wrap" v-show="value.title" :style="{ color: value.textColor, fontWeight: value.fontWeight ? 'bold' : '' }">{{ value.title }}
|
||||
</view>
|
||||
<view class="title-wrap" v-show="value.title" :style="{ color: value.textColor, fontWeight: value.fontWeight ? 'bold' : '' }">{{ value.title }}</view>
|
||||
<view class="ul-wrap">
|
||||
<view class="li-item" v-for="(item, index) in list" :key="index">
|
||||
<image class="brand-pic" :src="$util.img(item.image_url)" mode="aspectFit" @click="handlerClick(item)" @tap="handlerClick(item)" @error="imgError(index)" :style="itemCss"/>
|
||||
<image class="brand-pic" :src="$util.img(item.image_url)" mode="aspectFit" @click="toDetail(item)" @error="imgError(index)" :style="itemCss"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</x-skeleton>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -25,7 +26,10 @@
|
||||
name: 'diy-goods-brand',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<block v-if="value.showStyle == 'pageSlide'">
|
||||
<swiper :class="['graphic-nav', 'pageSlide', value.carousel.type]" circular :indicator-dots="false" :style="swiperHeight" @change="swiperChange">
|
||||
<swiper-item class="graphic-nav-wrap"
|
||||
v-for="(numItem, numIndex) in Math.ceil(value.list.length / (value.pageCount * value.rowCount))">
|
||||
v-for="(numItem, numIndex) in Math.ceil(value.list.length / (value.pageCount * value.rowCount))" :key="numIndex">
|
||||
<!-- #ifdef MP -->
|
||||
<view class="graphic-nav-item" :class="[value.mode]" v-for="(item, index) in value.list"
|
||||
:key="index"
|
||||
|
||||
@@ -223,6 +223,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 组件组
|
||||
export default {
|
||||
components: {},
|
||||
props: {
|
||||
|
||||
290
components/diy-components/diy-image-nav.vue
Normal file
290
components/diy-components/diy-image-nav.vue
Normal file
@@ -0,0 +1,290 @@
|
||||
<template>
|
||||
<view :style="componentStyle">
|
||||
<scroll-view
|
||||
:class="['image-nav', value.showStyle == 'fixed' ? 'fixed-layout' : value.showStyle]"
|
||||
:scroll-x="value.showStyle == 'singleSlide'"
|
||||
>
|
||||
<view class="uni-scroll-view-content">
|
||||
<view
|
||||
v-for="(item, index) in value.list"
|
||||
:key="index"
|
||||
:class="['image-nav-item', value.mode]"
|
||||
style="margin-right: 28rpx;"
|
||||
>
|
||||
<!-- 图片部分 -->
|
||||
<view v-if="value.mode != 'text'" class="image-img" :style="{
|
||||
'font-size': (value.imageSize * 2 + 'rpx') + ';',
|
||||
'width': (item.imgWidth / 2 + 'rpx') + ';',
|
||||
'height': (item.imgHeight / 2 + 'rpx') + ';'
|
||||
}">
|
||||
<image
|
||||
v-if="item.link.wap_url"
|
||||
:style="{
|
||||
'width': (item.imgWidth / 2 + 'rpx') + ';',
|
||||
'height': (item.imgHeight / 2 + 'rpx') + ';'
|
||||
}"
|
||||
:src="$util.img(item.imageUrl) || $util.img('public/uniapp/default_img/goods.png')"
|
||||
:show-menu-by-longpress="true"
|
||||
@tap="redirectTo(item.link)"
|
||||
></image>
|
||||
<image
|
||||
v-else
|
||||
:style="{
|
||||
'width': (item.imgWidth / 2 + 'rpx') + ';',
|
||||
'height': (item.imgHeight / 2 + 'rpx') + ';'
|
||||
}"
|
||||
:src="$util.img(item.imageUrl) || $util.img('public/uniapp/default_img/goods.png')"
|
||||
:show-menu-by-longpress="true"
|
||||
@tap="previewImg(item.imageUrl)"
|
||||
></image>
|
||||
</view>
|
||||
|
||||
<!-- 文字部分 -->
|
||||
<text class="image-text" :style="{
|
||||
'width': (item.imgWidth / 2 + 'rpx') + ';',
|
||||
'font-size': (value.font.size * 2 + 'rpx') + ';',
|
||||
'font-weight': value.font.weight + ';',
|
||||
'color': value.font.color + ';'
|
||||
}">{{ item.title }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<ns-login ref="login"></ns-login>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import nsLogin from '@/components/ns-login/ns-login.vue'
|
||||
|
||||
export default {
|
||||
name: 'diy-image-nav',
|
||||
components: {
|
||||
nsLogin
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pageWidth: '',
|
||||
indicatorDots: false,
|
||||
swiperCurrent: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 组件创建时的逻辑
|
||||
},
|
||||
watch: {
|
||||
componentRefresh(newValue) {
|
||||
// 监听组件刷新
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
componentStyle() {
|
||||
let style = '';
|
||||
style += 'background-color:' + this.value.componentBgColor + ';';
|
||||
|
||||
if (this.value.componentAngle == 'round') {
|
||||
style += 'border-top-left-radius:' + (2 * this.value.topAroundRadius) + 'rpx;';
|
||||
style += 'border-top-right-radius:' + (2 * this.value.topAroundRadius) + 'rpx;';
|
||||
style += 'border-bottom-left-radius:' + (2 * this.value.bottomAroundRadius) + 'rpx;';
|
||||
style += 'border-bottom-right-radius:' + (2 * this.value.bottomAroundRadius) + 'rpx;';
|
||||
}
|
||||
|
||||
style += 'box-shadow:' + (this.value.ornament.type == 'shadow' ? '0 0 10rpx ' + this.value.ornament.color : '') + ';';
|
||||
style += 'border:' + (this.value.ornament.type == 'stroke' ? '2rpx solid ' + this.value.ornament.color : '') + ';';
|
||||
|
||||
return style;
|
||||
},
|
||||
|
||||
swiperHeight() {
|
||||
let height = 0;
|
||||
|
||||
if (this.value.mode == 'graphic') {
|
||||
height = (49 + this.value.imageSize) * this.value.pageCount;
|
||||
} else if (this.value.mode == 'img') {
|
||||
height = (22 + this.value.imageSize) * this.value.pageCount;
|
||||
} else if (this.value.mode == 'text') {
|
||||
height = 43 * this.value.pageCount;
|
||||
}
|
||||
|
||||
return 'height:' + (2 * height) + 'rpx';
|
||||
},
|
||||
|
||||
isIndicatorDots() {
|
||||
return this.value.carousel.type != 'hide' &&
|
||||
1 != Math.ceil(this.value.list.length / (this.value.pageCount * this.value.rowCount));
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 预览图片
|
||||
previewImg(imageUrl) {
|
||||
uni.previewImage({
|
||||
current: 0,
|
||||
urls: [this.$util.img(imageUrl)],
|
||||
success: (res) => {},
|
||||
fail: (res) => {},
|
||||
complete: (res) => {}
|
||||
});
|
||||
},
|
||||
|
||||
// 页面跳转
|
||||
redirectTo(link) {
|
||||
if (!link.wap_url || this.$util.getCurrRoute() != 'pages/member/index' || this.storeToken) {
|
||||
this.$util.diyRedirectTo(link);
|
||||
} else {
|
||||
this.$refs.login.open(link.wap_url);
|
||||
}
|
||||
},
|
||||
|
||||
// 轮播切换
|
||||
swiperChange(event) {
|
||||
this.swiperCurrent = event.detail.current;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.image-nav {
|
||||
padding: 16rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
&.fixed-layout {
|
||||
.uni-scroll-view-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
&.singleSlide {
|
||||
.uni-scroll-view-content {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.image-nav-item {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.pageSlide {
|
||||
position: relative;
|
||||
|
||||
.uni-swiper-dots-horizontal {
|
||||
bottom: 0rpx;
|
||||
}
|
||||
|
||||
&.straightLine {
|
||||
.uni-swiper-dot {
|
||||
width: 30rpx;
|
||||
border-radius: 0;
|
||||
height: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&.circle {
|
||||
.uni-swiper-dot {
|
||||
width: 14rpx;
|
||||
height: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.image-nav-wrap {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.image-nav-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 14rpx 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.image-text {
|
||||
padding-top: 12rpx;
|
||||
line-height: 1.5;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
|
||||
&.alone {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.text {
|
||||
.image-text {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.image-img {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 90rpx;
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
top: -10rpx;
|
||||
right: -24rpx;
|
||||
color: #fff;
|
||||
border-radius: 24rpx;
|
||||
border-bottom-left-radius: 0;
|
||||
-webkit-transform: scale(0.8);
|
||||
transform: scale(0.8);
|
||||
padding: 8rpx 16rpx;
|
||||
line-height: 1;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-size: 50rpx;
|
||||
color: #606266;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-dot-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: -20rpx;
|
||||
padding-bottom: 8rpx;
|
||||
|
||||
.swiper-dot {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
margin: 8rpx;
|
||||
|
||||
&.active {
|
||||
background-color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
&.straightLine {
|
||||
.swiper-dot {
|
||||
width: 30rpx;
|
||||
border-radius: 0;
|
||||
height: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&.circle {
|
||||
.swiper-dot {
|
||||
width: 15rpx;
|
||||
border-radius: 50%;
|
||||
height: 15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -268,7 +268,7 @@
|
||||
.exec();
|
||||
});
|
||||
|
||||
this.setModuleLocatinoFn();
|
||||
this.setModuleLocationFn();
|
||||
},
|
||||
methods: {
|
||||
initPageIndex() {
|
||||
@@ -415,7 +415,7 @@
|
||||
this.isUnfold = !this.isUnfold;
|
||||
},
|
||||
// 向vuex中的diyIndexPositionObj增加分类导航组件定位位置
|
||||
setModuleLocatinoFn() {
|
||||
setModuleLocationFn() {
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('.nav-top-category')
|
||||
.boundingClientRect(data => {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view data-component-name="diy-kefu" class="diy-kefu" :style="style">
|
||||
<view class="fui-list-group merchgroup" v-for="(item,index) in value.list">
|
||||
<view class="fui-list-group merchgroup" v-for="(item,index) in value.list" :key="index">
|
||||
<view class="fui-list jump" v-if="index == 0">
|
||||
<view class="fui-list-media">
|
||||
<image class="round" :src="$util.img(item.imageUrl)" style="border-radius:6rpx"></image>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<view class="fui-cell-group">
|
||||
<!-- <image mode="widthFix" style="width: 100%;" :src="$util.img(item.imageUrl)"></image> -->
|
||||
|
||||
<view v-for="(item,index) in value.list" @click="redirectTo(item.link)" class="fui-cell" :class="item.iconType == 'img'?'img-cell':''">
|
||||
<view v-for="(item,index) in value.list" @click="redirectTo(item.link)" class="fui-cell" :class="item.iconType == 'img'?'img-cell':''" :key="index">
|
||||
<view class="fui-cell-icon" style="color:diyitem.style.iconcolo">
|
||||
<diy-icon v-if="item.iconType == 'icon'" :icon="item.icon"
|
||||
:value="item.style ? item.style : null"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view data-component-name="diy-map" class="diy-map" :style="style">
|
||||
<view class="fui-list-group merchgroup" style="margin-top:0" v-for="(item,index) in value.list">
|
||||
<view class="fui-list-group merchgroup" style="margin-top:0" v-for="(item,index) in value.list" :key="index">
|
||||
<map
|
||||
id="map"
|
||||
style="width: 100%; height:600rpx"
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view data-component-name="diy-picture" class="diy-picture" :style="style">
|
||||
<view class="fui-picture">
|
||||
<view v-for="(item,index) in value.list" style="line-height: 0;">
|
||||
<view v-for="(item,index) in value.list" style="line-height: 0;" :key="index">
|
||||
<image mode="widthFix" style="width: 100%;height:auto" :src="$util.img(item.imageUrl)" v-if="item.link.wap_url" @click="handlerClick(item)" @tap="handlerClick(item)"></image>
|
||||
<image mode="widthFix" style="width: 100%;height:auto" :src="$util.img(item.imageUrl)" v-else @click="handlerClick(item)" @tap="handlerClick(item)"></image>
|
||||
</view>
|
||||
|
||||
@@ -173,7 +173,7 @@
|
||||
if (this.value.ornament.type == 'stroke') {
|
||||
obj += 'border:' + '2rpx solid ' + this.value.ornament.color + ';';
|
||||
}
|
||||
const screenWidth = uni.getSystemInfoSync().windowWidth;
|
||||
const screenWidth = uni.getWindowInfo().windowWidth;
|
||||
if (this.value.template == 'horizontal-slide') {
|
||||
var width = "";
|
||||
if (this.value.slideMode == 'scroll' && this.value.goodsMarginType == 'diy')
|
||||
@@ -217,7 +217,7 @@
|
||||
}
|
||||
},
|
||||
rpxUpPx(res) {
|
||||
const screenWidth = uni.getSystemInfoSync().windowWidth;
|
||||
const screenWidth = uni.getWindowInfo().windowWidth;
|
||||
var data = screenWidth * parseInt(res) / 750;
|
||||
return Math.floor(data);
|
||||
},
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<view :style="value.pageStyle">
|
||||
<view data-component-name="diy-search" class="diy-search">
|
||||
<view class="diy-search-wrap" :class="value.positionWay" :style="fixedCss">
|
||||
<view :class="['search-box','search-box-'+value.searchStyle]" :style="searchWrapCss" @click="handlerSearchClick" @tap="handlerSearchClick">
|
||||
@@ -33,11 +34,19 @@
|
||||
<view v-if="value.positionWay == 'fixed'" class="u-navbar-placeholder" :style="{ width: '100%', paddingTop: moduleHeight }"></view>
|
||||
<ns-login ref="login"></ns-login>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 获取系统状态栏的高度
|
||||
let systemInfo = uni.getSystemInfoSync();
|
||||
let systemInfo = {};
|
||||
try {
|
||||
// 合并设备信息和窗口信息
|
||||
systemInfo = {...uni.getDeviceInfo(), ...uni.getWindowInfo()};
|
||||
} catch (e) {
|
||||
// 兼容旧版本
|
||||
systemInfo = uni.getSystemInfoSync();
|
||||
}
|
||||
let menuButtonInfo = {};
|
||||
// 如果是小程序,获取右上角胶囊的尺寸信息,避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API,尚未兼容)
|
||||
// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
|
||||
@@ -125,7 +134,7 @@
|
||||
},
|
||||
fixedTop() {
|
||||
let diyPositionObj = this.$store.state.diyGroupPositionObj;
|
||||
let data = 0
|
||||
let data = 0;
|
||||
if (diyPositionObj.diySearch && diyPositionObj.diyIndexPage && diyPositionObj.nsNavbar) {
|
||||
if (diyPositionObj.diySearch.moduleIndex > diyPositionObj.diyIndexPage.moduleIndex) {
|
||||
data = diyPositionObj.nsNavbar.originalVal + diyPositionObj.diyIndexPage.originalVal;
|
||||
@@ -175,7 +184,7 @@
|
||||
},
|
||||
mounted() {
|
||||
if (this.value.positionWay == 'fixed')
|
||||
this.setModuleLocatinoFn();
|
||||
this.setModuleLocationFn();
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
@@ -204,7 +213,7 @@
|
||||
});
|
||||
},
|
||||
// 向vuex中的diyIndexPositionObj增加搜索组件定位位置
|
||||
setModuleLocatinoFn() {
|
||||
setModuleLocationFn() {
|
||||
this.$nextTick(() => {
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('.diy-search-wrap')
|
||||
|
||||
@@ -181,6 +181,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 秒杀
|
||||
export default {
|
||||
name: 'diy-seckill',
|
||||
props: {
|
||||
@@ -257,7 +258,7 @@
|
||||
if (this.value.ornament.type == 'stroke') {
|
||||
obj += 'border:' + '2rpx solid ' + this.value.ornament.color + ';';
|
||||
}
|
||||
const screenWidth = uni.getSystemInfoSync().windowWidth;
|
||||
const screenWidth = uni.getWindowInfo().windowWidth;
|
||||
if (this.value.template == 'horizontal-slide') {
|
||||
var width = '';
|
||||
if (this.value.slideMode == 'scroll' && this.value.goodsMarginType == 'diy') width = this.rpxUpPx(this.value.goodsMarginNum * 2);
|
||||
@@ -311,7 +312,7 @@
|
||||
}
|
||||
},
|
||||
rpxUpPx(res) {
|
||||
const screenWidth = uni.getSystemInfoSync().screenWidth;
|
||||
const screenWidth = uni.getWindowInfo().screenWidth;
|
||||
var data = (screenWidth * parseInt(res)) / 750;
|
||||
return Math.floor(data);
|
||||
},
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
<template>
|
||||
<view :style="value.pageStyle">
|
||||
<x-skeleton data-component-name="diy-store-label" type="banner" :loading="loading" :configs="skeletonConfig">
|
||||
<view class="diy-store-label">
|
||||
<block v-if="businessConfig.store_business == 'store'">
|
||||
<scroll-view scroll-x="true" :class="[value.contentStyle, { between: list.length == 3 }]" :style="storeLabelWrapCss" :enable-flex="true">
|
||||
<view v-for="(item, index) in storeLabel" :class="['item']">
|
||||
<view v-for="(item, index) in storeLabel" :class="['item']" :key="index">
|
||||
<diy-icon v-if="value.icon" class="icon-box" :icon="value.icon" :value="value.style ? value.style : 'null'"></diy-icon>
|
||||
<text class="label-name" :style="{ color: value.textColor, fontSize: value.fontSize * 2 + 'rpx', fontWeight: value.fontWeight }">{{ item }}</text>
|
||||
</view>
|
||||
@@ -11,7 +12,7 @@
|
||||
</block>
|
||||
<block v-else>
|
||||
<scroll-view scroll-x="true" :class="[value.contentStyle, { between: list.length == 3 }]" :style="storeLabelWrapCss" :enable-flex="true">
|
||||
<view v-for="(item, index) in list" :class="['item']">
|
||||
<view v-for="(item, index) in list" :class="['item']" :key="item.label_id || index">
|
||||
<diy-icon v-if="value.icon" class="icon-box" :icon="value.icon" :value="value.style ? value.style : 'null'"></diy-icon>
|
||||
<text class="label-name" :style="{ color: value.textColor, fontSize: value.fontSize * 2 + 'rpx', fontWeight: value.fontWeight }">{{ item.label_name }}</text>
|
||||
</view>
|
||||
@@ -19,6 +20,7 @@
|
||||
</block>
|
||||
</view>
|
||||
</x-skeleton>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
// 门店标签
|
||||
@@ -26,7 +28,10 @@
|
||||
name: 'diy-store-label',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<view :style="value.pageStyle">
|
||||
<view data-component-name="diy-store" class="store-wrap">
|
||||
<block v-if="value.style == 1">
|
||||
<view class="store-box store-one">
|
||||
@@ -65,6 +66,7 @@
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -74,7 +76,10 @@ export default {
|
||||
name: 'diy-store',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<view :style="value.pageStyle">
|
||||
<view data-component-name="diy-text" class="diy-text" @click="handlerClick(value.link)" @tap="handlerClick(value.link)" :style="warpCss">
|
||||
<view :class="value.style == 'style-8' ? 'title2' : 'title'" :style="{ fontSize: value.fontSize * 2 + 'rpx', color: value.textColor }">
|
||||
<block v-if="value.style == 'style-0'" style="height: 40rpx; line-height: 40rpx;">
|
||||
@@ -254,6 +255,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -263,7 +265,10 @@ export default {
|
||||
name: 'diy-text',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
704
components/diy-components/diy-video-list.vue
Normal file
704
components/diy-components/diy-video-list.vue
Normal file
@@ -0,0 +1,704 @@
|
||||
<template>
|
||||
<view :style="componentStyle">
|
||||
<!-- 固定布局模式 -->
|
||||
<view v-if="value.showStyle == 'fixed'" :class="['goods-list', 'row1-of' + value.rowCount]" style="padding:20rpx;">
|
||||
<view
|
||||
v-for="(item, index) in value.list"
|
||||
:key="index"
|
||||
class="goods-item"
|
||||
@tap="showVideo(item)"
|
||||
>
|
||||
<view class="goods-img-wrap">
|
||||
<image
|
||||
class="goods-img"
|
||||
style="border-radius:10rpx 10rpx 0 0;"
|
||||
:src="$util.img(item.imageUrl)"
|
||||
mode="widthFix"
|
||||
@error="imgError(index)"
|
||||
></image>
|
||||
<view style="position:absolute;top:10rpx;right:10rpx;">
|
||||
<image style="width:30rpx;" :src="$util.img('addon/personnel/shop/view/enterprise/play.png')" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-wrap">
|
||||
<view
|
||||
class="goods-name"
|
||||
:style="{
|
||||
'font-size': (value.font.size * 2 + 'rpx') + ';',
|
||||
'font-weight': value.font.weight + ';',
|
||||
'color': value.font.color + ';'
|
||||
}"
|
||||
>{{ item.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 其他布局模式 -->
|
||||
<scroll-view
|
||||
v-else
|
||||
:class="['video-nav', value.showStyle == 'fixed' ? 'fixed-layout' : value.showStyle]"
|
||||
:scroll-x="value.showStyle == 'singleSlide'"
|
||||
>
|
||||
<view class="uni-scroll-view-content">
|
||||
<view
|
||||
v-for="(item, index) in value.list"
|
||||
:key="index"
|
||||
:class="['video-nav-item', value.mode]"
|
||||
:style="{ width: (100 / value.rowCount + '%') + ';' }"
|
||||
@tap="showVideo(item)"
|
||||
>
|
||||
<view class="video-img">
|
||||
<image
|
||||
v-if="item.iconType == 'img'"
|
||||
:style="{
|
||||
'max-width': '200rpx;',
|
||||
'max-height': '200rpx;',
|
||||
'border-radius': '8rpx;'
|
||||
}"
|
||||
:src="$util.img(item.imageUrl) || $util.img('public/uniapp/default_img/goods.png')"
|
||||
mode="widthFix"
|
||||
:show-menu-by-longpress="true"
|
||||
></image>
|
||||
<view style="position:absolute;top:10rpx;right:10rpx;">
|
||||
<image style="width:30rpx;" :src="$util.img('addon/personnel/shop/view/enterprise/play.png')" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="video-text"
|
||||
:style="{
|
||||
'margin-left': '16rpx;',
|
||||
'font-size': (value.font.size * 2 + 'rpx') + ';',
|
||||
'font-weight': value.font.weight + ';',
|
||||
'color': value.font.color + ';'
|
||||
}"
|
||||
>{{ item.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 视频播放弹窗 -->
|
||||
<uni-popup
|
||||
ref="videoPopup"
|
||||
type="center"
|
||||
style="background:transparent;width:100%;height:100%;"
|
||||
>
|
||||
<view class="video-container" style="position:fixed;top:30%;width:100%;left:0;">
|
||||
<video
|
||||
class="adaptive-video"
|
||||
:autoPauseIfNavigate="true"
|
||||
:autoPauseIfOpenNative="true"
|
||||
:autoplay="false"
|
||||
:enableAutoRotation="true"
|
||||
id="myVideo"
|
||||
:src="video_url"
|
||||
:controls="true"
|
||||
></video>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
||||
|
||||
export default {
|
||||
name: 'diy-video-list',
|
||||
components: {
|
||||
uniPopup
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pageWidth: '',
|
||||
indicatorDots: false,
|
||||
swiperCurrent: 0,
|
||||
video_url: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 组件创建时的逻辑
|
||||
},
|
||||
watch: {
|
||||
componentRefresh(newValue) {
|
||||
// 监听组件刷新
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
componentStyle() {
|
||||
let style = '';
|
||||
style += 'background-color:' + this.value.componentBgColor + ';';
|
||||
|
||||
if (this.value.componentAngle == 'round') {
|
||||
style += 'border-top-left-radius:' + (2 * this.value.topAroundRadius) + 'rpx;';
|
||||
style += 'border-top-right-radius:' + (2 * this.value.topAroundRadius) + 'rpx;';
|
||||
style += 'border-bottom-left-radius:' + (2 * this.value.bottomAroundRadius) + 'rpx;';
|
||||
style += 'border-bottom-right-radius:' + (2 * this.value.bottomAroundRadius) + 'rpx;';
|
||||
}
|
||||
|
||||
style += 'box-shadow:' + (this.value.ornament.type == 'shadow' ? '0 0 10rpx ' + this.value.ornament.color : '') + ';';
|
||||
style += 'border:' + (this.value.ornament.type == 'stroke' ? '2rpx solid ' + this.value.ornament.color : '') + ';';
|
||||
|
||||
console.log(this.value);
|
||||
|
||||
return style;
|
||||
},
|
||||
|
||||
swiperHeight() {
|
||||
let height = 0;
|
||||
|
||||
if (this.value.mode == 'graphic') {
|
||||
height = (49 + this.value.imageSize) * this.value.pageCount;
|
||||
} else if (this.value.mode == 'img') {
|
||||
height = (22 + this.value.imageSize) * this.value.pageCount;
|
||||
} else if (this.value.mode == 'text') {
|
||||
height = 43 * this.value.pageCount;
|
||||
}
|
||||
|
||||
return 'height:' + (2 * height) + 'rpx';
|
||||
},
|
||||
|
||||
isIndicatorDots() {
|
||||
return this.value.carousel.type != 'hide' &&
|
||||
1 != Math.ceil(this.value.list.length / (this.value.pageCount * this.value.rowCount));
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 显示视频播放弹窗
|
||||
showVideo(item) {
|
||||
this.video_url = item.videoUrl;
|
||||
this.$refs.videoPopup.open();
|
||||
},
|
||||
|
||||
// 图片加载错误处理
|
||||
imgError(index) {
|
||||
// 图片加载失败的处理逻辑
|
||||
console.log('图片加载失败:', index);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.goods-name {
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.goods-list {
|
||||
&.row1-of3 {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.goods-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 20rpx;
|
||||
width: calc(33.3333333% - 14rpx);
|
||||
box-sizing: border-box;
|
||||
|
||||
&:nth-child(3n + 3) {
|
||||
width: calc(33.33% - 15rpx);
|
||||
}
|
||||
|
||||
&:nth-of-type(1), &:nth-of-type(2), &:nth-of-type(3) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&:nth-child(3n) {
|
||||
width: calc(33.3333333% - 15rpx);
|
||||
}
|
||||
|
||||
&:nth-child(3n-1) {
|
||||
margin-left: 20rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
&.shadow {
|
||||
width: calc(33.3333333% - 18rpx);
|
||||
|
||||
&:nth-of-type(1), &:nth-of-type(2), &:nth-of-type(3) {
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
&:nth-child(1n) {
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
&:nth-child(3n-1) {
|
||||
margin-left: 20rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
&:nth-child(3n) {
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-img-wrap {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 220rpx;
|
||||
}
|
||||
|
||||
.goods-img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.info-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
|
||||
.pro-info {
|
||||
margin-top: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.discount-price {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.price-wrap {
|
||||
white-space: nowrap;
|
||||
|
||||
.unit {
|
||||
font-size: 24rpx !important;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 32rpx;
|
||||
|
||||
text {
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.delete-price {
|
||||
text-decoration: line-through;
|
||||
flex: 1;
|
||||
line-height: 28rpx;
|
||||
color: #909399;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.style-1 {
|
||||
.pro-info {
|
||||
.price-wrap {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.discount-price {
|
||||
justify-content: unset !important;
|
||||
align-items: baseline !important;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.delete-price {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.style-2 {
|
||||
.pro-info {
|
||||
position: relative;
|
||||
flex-direction: row !important;
|
||||
align-items: center;
|
||||
|
||||
.price-wrap {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.discount-price {
|
||||
align-items: flex-end !important;
|
||||
flex-wrap: wrap;
|
||||
justify-content: unset !important;
|
||||
}
|
||||
|
||||
.delete-price {
|
||||
margin: 20rpx 0;
|
||||
flex-basis: 100% !important;
|
||||
}
|
||||
|
||||
.buy-btn {
|
||||
min-width: 112rpx;
|
||||
height: 52rpx;
|
||||
padding: 0 20rpx;
|
||||
line-height: 52rpx;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sell-out {
|
||||
text {
|
||||
font-size: 150rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.row1-of2 {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
|
||||
.goods-item {
|
||||
position: relative;
|
||||
margin-top: 20rpx;
|
||||
width: calc(50% - 10rpx);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
|
||||
&:nth-child(2n) {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
&:nth-of-type(1), &:nth-of-type(2) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&.shadow {
|
||||
width: calc(50% - 18rpx);
|
||||
|
||||
&:nth-child(2n-1) {
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
&:nth-child(2n) {
|
||||
margin-right: 8rpx !important;
|
||||
}
|
||||
|
||||
&:nth-of-type(1), &:nth-of-type(2) {
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-img-wrap {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 340rpx;
|
||||
}
|
||||
|
||||
.goods-img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.info-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
|
||||
.sale {
|
||||
flex-basis: 100%;
|
||||
}
|
||||
|
||||
.pro-info {
|
||||
margin-top: auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.discount-price {
|
||||
.price-wrap {
|
||||
white-space: nowrap;
|
||||
|
||||
.unit {
|
||||
font-weight: 700;
|
||||
font-size: 24rpx !important;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-weight: 700;
|
||||
font-size: 32rpx !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.delete-price {
|
||||
text-decoration: line-through;
|
||||
flex: 1;
|
||||
line-height: 28rpx;
|
||||
color: #909399;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.style-1 {
|
||||
.pro-info {
|
||||
.discount-price {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: baseline;
|
||||
|
||||
.price-wrap {
|
||||
display: inline-block;
|
||||
|
||||
text {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.delete-price {
|
||||
margin-top: 6rpx;
|
||||
flex-basis: 100% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.style-2 {
|
||||
.pro-info {
|
||||
position: relative;
|
||||
align-items: center;
|
||||
|
||||
.price-wrap {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.discount-price {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.delete-price {
|
||||
margin-top: 4rpx;
|
||||
flex-basis: 100% !important;
|
||||
}
|
||||
|
||||
.sale {
|
||||
line-height: 1;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.buy-btn {
|
||||
min-width: 140rpx;
|
||||
height: 52rpx;
|
||||
padding: 0 20rpx;
|
||||
line-height: 52rpx;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.style-3 {
|
||||
.pro-info {
|
||||
.member-price {
|
||||
margin-right: auto;
|
||||
align-self: flex-end;
|
||||
margin-bottom: 4rpx;
|
||||
}
|
||||
|
||||
.sale {
|
||||
line-height: 1;
|
||||
align-self: center;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.discount-price {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex: 1;
|
||||
align-content: center;
|
||||
|
||||
.price-wrap {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
line-height: 1;
|
||||
align-self: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swiper {
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sell-out {
|
||||
text {
|
||||
font-size: 250rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.video-container {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.adaptive-video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.video-nav {
|
||||
padding: 16rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
&.fixed-layout {
|
||||
.uni-scroll-view-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
&.singleSlide {
|
||||
.uni-scroll-view-content {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.video-nav-item {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.pageSlide {
|
||||
position: relative;
|
||||
|
||||
.uni-swiper-dots-horizontal {
|
||||
bottom: 0rpx;
|
||||
}
|
||||
|
||||
&.straightLine {
|
||||
.uni-swiper-dot {
|
||||
width: 30rpx;
|
||||
border-radius: 0;
|
||||
height: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&.circle {
|
||||
.uni-swiper-dot {
|
||||
width: 14rpx;
|
||||
height: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.video-nav-wrap {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.video-nav-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 14rpx 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.video-text {
|
||||
padding-top: 12rpx;
|
||||
line-height: 1.5;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
||||
&.alone {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.text {
|
||||
.video-text {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.video-img {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 90rpx;
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
top: -10rpx;
|
||||
right: -24rpx;
|
||||
color: #fff;
|
||||
border-radius: 24rpx;
|
||||
border-bottom-left-radius: 0;
|
||||
-webkit-transform: scale(0.8);
|
||||
transform: scale(0.8);
|
||||
padding: 8rpx 16rpx;
|
||||
line-height: 1;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-size: 50rpx;
|
||||
color: #606266;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-dot-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: -20rpx;
|
||||
padding-bottom: 8rpx;
|
||||
|
||||
.swiper-dot {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
margin: 8rpx;
|
||||
|
||||
&.active {
|
||||
background-color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
&.straightLine {
|
||||
.swiper-dot {
|
||||
width: 30rpx;
|
||||
border-radius: 0;
|
||||
height: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&.circle {
|
||||
.swiper-dot {
|
||||
width: 15rpx;
|
||||
border-radius: 50%;
|
||||
height: 15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,5 +1,7 @@
|
||||
<template>
|
||||
<view :style="value.pageStyle">
|
||||
<video data-component-name="diy-video" class="diy-video" :src="$util.img(value.videoUrl)" :poster="$util.img(value.imageUrl)" :style="videoWarpCss" objectFit="cover" @click="handlerClick(value.videoUrl)" @tap="handlerClick(value.videoUrl)"></video>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -9,7 +11,10 @@
|
||||
name: 'diy-video',
|
||||
props: {
|
||||
value: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -64,7 +64,10 @@ export default {
|
||||
longitude: null, // 经度
|
||||
evaluateCount: 0, // 商品评论数量
|
||||
deliveryType: null, // 配送方式
|
||||
isVirtual: 0 //是否为虚拟商品
|
||||
isVirtual: 0 ,//是否为虚拟商品
|
||||
hasGlobalStore:false,
|
||||
saleStore:'all',
|
||||
isInitStoreData:false,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@@ -73,10 +76,7 @@ export default {
|
||||
if (this.location) {
|
||||
this.latitude = this.location.latitude;
|
||||
this.longitude = this.location.longitude;
|
||||
} else {
|
||||
this.$util.getLocation();
|
||||
}
|
||||
this.getStoreData();
|
||||
},
|
||||
watch: {
|
||||
location: function (nVal) {
|
||||
@@ -102,19 +102,17 @@ export default {
|
||||
this.isVirtual = params.isVirtual;
|
||||
this.deliveryType = params.deliveryType;
|
||||
this.evaluateConfig = params.evaluateConfig;
|
||||
|
||||
this.saleStore = params.sale_store;
|
||||
if (this.evaluateConfig.evaluate_show == 1) {
|
||||
//商品评论
|
||||
this.getGoodsEvaluate(params.evaluateList);
|
||||
this.evaluateCount = params.evaluateCount;
|
||||
}
|
||||
|
||||
for (let k in this.deliveryType) {
|
||||
if (k == 'store') {
|
||||
this.isShowStore = true;
|
||||
if( params.goods_class != 2 && params.goods_class !=3) this.isShowStore = true;
|
||||
if(!this.isInitStoreData){
|
||||
this.isInitStoreData = true;
|
||||
this.getStoreData();
|
||||
}
|
||||
}
|
||||
|
||||
this.getService();
|
||||
|
||||
this.videoContext = uni.createVideoContext('goodsVideo');
|
||||
@@ -148,7 +146,8 @@ export default {
|
||||
//门店列表
|
||||
let data = {
|
||||
page: this.storeList.page,
|
||||
page_size: this.storeList.page_size
|
||||
page_size: this.storeList.page_size,
|
||||
store_ids:this.saleStore
|
||||
};
|
||||
if (this.latitude && this.longitude) {
|
||||
data.latitude = this.latitude;
|
||||
@@ -161,6 +160,9 @@ export default {
|
||||
if (this.storeList.page == 1) this.storeList.data == [];
|
||||
if (res.code >= 0 && res.data) {
|
||||
this.storeList.data = this.storeList.data.concat(res.data.list);
|
||||
res.data.list.forEach(item=>{
|
||||
if(item.store_id == this.globalStoreInfo.store_id) this.hasGlobalStore = true;
|
||||
})
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.message
|
||||
@@ -189,9 +191,6 @@ export default {
|
||||
if (this.goodsEvaluate[index].images) this.goodsEvaluate[index].images = this.goodsEvaluate[index].images.split(",");
|
||||
if (this.goodsEvaluate[index].is_anonymous == 1) this.goodsEvaluate[index].member_name = this.goodsEvaluate[index].member_name.replace(this.goodsEvaluate[index].member_name.substring(1, this.goodsEvaluate[index].member_name.length - 1), '***')
|
||||
})
|
||||
// if (this.goodsEvaluate.images) this.goodsEvaluate.images = this.goodsEvaluate.images.split(",");
|
||||
// if (this.goodsEvaluate.is_anonymous == 1) this.goodsEvaluate.member_name = this.goodsEvaluate.member_name.replace(
|
||||
// this.goodsEvaluate.member_name.substring(1, this.goodsEvaluate.member_name.length - 1), '***')
|
||||
}
|
||||
},
|
||||
// 预览评价图片
|
||||
@@ -263,6 +262,8 @@ export default {
|
||||
copyUrl() {
|
||||
let text = this.$config.h5Domain + this.shareUrl;
|
||||
if (this.memberInfo && this.memberInfo.member_id) text += '&source_member=' + this.memberInfo.member_id;
|
||||
var store_info = this.$store.state.globalStoreInfo;
|
||||
if (store_info) text += '&store_id=' + store_info.store_id;
|
||||
this.$util.copy(text, () => {
|
||||
this.closeSharePopup();
|
||||
});
|
||||
@@ -283,10 +284,11 @@ export default {
|
||||
getGoodsPoster() {
|
||||
uni.showLoading({
|
||||
'title': '海报生成中...'
|
||||
})
|
||||
});
|
||||
//活动海报信息
|
||||
if (this.memberInfo && this.memberInfo.member_id) this.posterParams.source_member = this.memberInfo.member_id;
|
||||
|
||||
var store_info = this.$store.state.globalStoreInfo;
|
||||
if (store_info) this.posterParams.store_id= store_info.store_id;
|
||||
this.$api.sendRequest({
|
||||
url: this.posterApi,
|
||||
data: {
|
||||
|
||||
@@ -39,37 +39,37 @@
|
||||
<slot name="price"></slot>
|
||||
</view>
|
||||
|
||||
<view class="newdetail margin-bottom" v-if="goodsSkuDetail.isinformation == 0">
|
||||
|
||||
<view class="newdetail margin-bottom">
|
||||
<!-- 入口区域 -->
|
||||
<slot name="entrance"></slot>
|
||||
|
||||
<!-- 配送 -->
|
||||
<!-- @click="$refs.deliveryType.open()" -->
|
||||
<view class="item delivery-type" v-if="goodsSkuDetail.is_virtual == 0" >
|
||||
<view class="label">{{$lang('send')}}</view>
|
||||
<view class="item delivery-type" v-if="goodsSkuDetail.is_virtual == 0" @click="$refs.deliveryType.open()">
|
||||
<view class="label">配送</view>
|
||||
<block v-if="deliveryType">
|
||||
<view class="box">
|
||||
<block v-for="(item, index) in deliveryType" :key="index">
|
||||
<text v-if="goodsSkuDetail.support_trade_type.indexOf(index) != -1">{{$lang('express')}}</text>
|
||||
<!-- {{ item.name }} -->
|
||||
<text v-if="goodsSkuDetail.support_trade_type.indexOf(index) != -1">{{ item.name }}</text>
|
||||
</block>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view class="box">未配置</view>
|
||||
<view class="box">商家未配置配送方式</view>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
<!-- 门店 -->
|
||||
<!-- <view class="item store-wrap" @click="openStoreListPopup()" v-if="addonIsExist.store && globalStoreInfo && isShowStore">
|
||||
<view class="label">门店</view>
|
||||
<view class="list-wrap">
|
||||
<view class="item store-wrap" @click="openStoreListPopup()" v-if="addonIsExist.store && globalStoreInfo && isShowStore">
|
||||
<view class="label">适用门店</view>
|
||||
<view class="list-wrap" v-if="hasGlobalStore">
|
||||
<view class="name-wrap">
|
||||
<text class="icondiy icon-system-shop"></text>
|
||||
<text class="name">{{ globalStoreInfo.store_name}}</text>
|
||||
</view>
|
||||
<view class="close-desc" v-if="globalStoreInfo.status == 0 && globalStoreInfo.close_desc">
|
||||
{{ globalStoreInfo.close_desc }}
|
||||
</view>
|
||||
<view class="other-wrap">
|
||||
<text class="distance" v-if="parseFloat(globalStoreInfo.distance)">距离{{ globalStoreInfo.distance > 1 ? globalStoreInfo.distance + 'km' : globalStoreInfo.distance * 1000 + 'm' }}</text>
|
||||
<text class="decorate" v-if="parseFloat(globalStoreInfo.distance)">.</text>
|
||||
@@ -77,8 +77,23 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-wrap" v-else-if="storeList && storeList.data.length">
|
||||
<view class="name-wrap">
|
||||
<text class="icondiy icon-system-shop"></text>
|
||||
<text class="name">{{ storeList.data[0].store_name}}</text>
|
||||
</view>
|
||||
<view class="close-desc" v-if="storeList.data[0].status == 0 && storeList.data[0].close_desc">
|
||||
{{ storeList.data[0].close_desc }}
|
||||
</view>
|
||||
<view class="other-wrap">
|
||||
<text class="distance" v-if="parseFloat(storeList.data[0].distance)">距离{{ storeList.data[0].distance > 1 ? storeList.data[0].distance + 'km' : storeList.data[0].distance * 1000 + 'm' }}</text>
|
||||
<text class="decorate" v-if="parseFloat(storeList.data[0].distance)">.</text>
|
||||
<view class="address">{{ storeList.data[0].full_address + storeList.data[0].address }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="item service" @click="openMerchantsServicePopup()" v-if="goodsSkuDetail.goods_service.length">
|
||||
<view class="label">服务</view>
|
||||
@@ -96,34 +111,6 @@
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<!--多规格区域-->
|
||||
<view class="newdetail margin-bottom" v-if="goodsSkuDetail.sku_spec_format">
|
||||
<!-- 入口区域 -->
|
||||
<slot name="skuspec"></slot>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="newdetail margin-bottom" v-if="goodsSkuDetail.merch_id > 0">
|
||||
<!-- 入口区域 -->
|
||||
<slot name="entrance"></slot>
|
||||
<!-- 商家 -->
|
||||
<view class="item store-wrap" @click="$util.redirectTo('/pages_promotion/merch/detail', { merch_id: goodsSkuDetail.merch_id })">
|
||||
<view class="list-wrap" style="display: flex;">
|
||||
<view class="name-wrap">
|
||||
<image :src="$util.img(goodsSkuDetail.merchinfo.merch_image)" mode="widthFix" style="width: 100rpx;height: 100rpx;border-radius: 50rpx;"></image>
|
||||
</view>
|
||||
<view class="other-wrap">
|
||||
<view class="address" style="margin-left: 30rpx;">
|
||||
<view>{{goodsSkuDetail.merchinfo.merch_name}}</view>
|
||||
<view style="font-size: 24rpx;color: #888;">官方认证商家,值得信赖!</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 配送方式 -->
|
||||
@@ -182,7 +169,7 @@
|
||||
<uni-popup ref="storeListPopup" type="bottom">
|
||||
<view class="goods-merchants-service-popup-layer popup-layer store-list-wrap">
|
||||
<view class="head-wrap" @click="closeStoreListPopup()">
|
||||
<text>门店列表</text>
|
||||
<text>适用门店</text>
|
||||
<text class="iconfont icon-close"></text>
|
||||
</view>
|
||||
<scroll-view scroll-y>
|
||||
@@ -200,6 +187,8 @@
|
||||
距离{{ item.distance > 1 ? item.distance + 'km' : item.distance * 1000 + 'm' }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="item-close-desc" v-if="item.status == 0 && item.close_desc">{{ item.close_desc }}
|
||||
</view>
|
||||
<view class="item-time" v-if="item.open_date">营业时间:{{ item.open_date }}
|
||||
</view>
|
||||
<view class="item-address">{{ item.full_address + item.address }}</view>
|
||||
@@ -228,7 +217,7 @@
|
||||
</view>
|
||||
|
||||
<!-- 促销 -->
|
||||
<!-- <view class="community-model" @touchmove.prevent.stop @click.stop="onCloseCommunity()" v-show="isCommunity">
|
||||
<view class="community-model" @touchmove.prevent.stop @click.stop="onCloseCommunity()" v-show="isCommunity">
|
||||
<view class="community-model-content" @click.stop>
|
||||
<view class="community-model-content-radius">
|
||||
<view>添加社群</view>
|
||||
@@ -241,13 +230,13 @@
|
||||
<view class="community-model-close" @click.stop="onCloseCommunity()">
|
||||
<text class="iconfont icon-close"></text>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<!-- 参与流程 -->
|
||||
<slot name="articipation"></slot>
|
||||
|
||||
<!-- 商品评价 -->
|
||||
<view class="group-wrap" v-if="evaluateConfig.evaluate_show == 1 && goodsSkuDetail.isinformation == 0" style="display: none;">
|
||||
<view class="group-wrap" v-if="evaluateConfig.evaluate_show == 1">
|
||||
<view class="goods-evaluate" @click="toEvaluateDetail(goodsSkuDetail.goods_id)">
|
||||
<view class="tit">
|
||||
<!-- <view class="tit" :class="{ active: goodsEvaluate.content }"> -->
|
||||
@@ -263,8 +252,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="evaluate-item" v-for="(item, index) in goodsEvaluate" :key="index"
|
||||
v-if="item.content">
|
||||
<view class="evaluate-item" v-for="(item, index) in goodsEvaluate" :key="index" v-if="item.content">
|
||||
<view class="evaluator">
|
||||
<view class="evaluator-info">
|
||||
<view class="evaluator-face">
|
||||
@@ -315,24 +303,19 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- 详情 -->
|
||||
<view class="goods-detail-tab">
|
||||
<view class="detail-tab">
|
||||
<view class="tab-item">{{$lang('details')}}</view>
|
||||
<view class="tab-item">商品详情</view>
|
||||
</view>
|
||||
<view class="detail-content active">
|
||||
<view class="detail-content-item">
|
||||
<view class="goods-details" v-if="goodsSkuDetail.goods_content">
|
||||
<!-- <rich-text :nodes="goodsSkuDetail.goods_content" @click="showImg($event)" :data-nodes="goodsSkuDetail.goods_content"></rich-text> -->
|
||||
<!-- {{goodsSkuDetail.goods_content}} -->
|
||||
<mp-html :content="goodsSkuDetail.goods_content" />
|
||||
<!-- :loading="loading" @preview="preview" @navigate="navigate" -->
|
||||
<ns-mp-html :content="goodsSkuDetail.goods_content"></ns-mp-html>
|
||||
</view>
|
||||
<view class="goods-details active" v-else></view>
|
||||
<view class="goods-details active" v-else>该商家暂无上传相关详情哦!</view>
|
||||
<view class="goods-details" v-if="service && service.is_display == 1 && service.content">
|
||||
<rich-text :nodes="service.content" @click="showImg($event)" :data-nodes="service.content"></rich-text>
|
||||
<ns-mp-html :content="service.content"></ns-mp-html>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -1,37 +1,71 @@
|
||||
<template>
|
||||
<!-- 悬浮按钮 -->
|
||||
<view v-if="pageCount == 1 || need" class="fixed-box" :style="{ height: fixBtnShow ? '330rpx' : '120rpx' }">
|
||||
<!-- <view class="btn-item" v-if="fixBtnShow" @click="$util.redirectTo('/pages/index/index')"> -->
|
||||
<view v-if="pageCount == 1 || need" class="fixed-box" :style="{ height: fixBtnShow ? (isH5 ? '180rpx' : '330rpx') : '120rpx' }">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button class="btn-item" v-if="fixBtnShow" hoverClass="none" openType="contact" sessionFrom="weapp" showMessageCard="true" :style="{backgroundImage:'url('+(kefuimg?kefuimg:'')+')',backgroundSize:'100% 100%'}">
|
||||
<!-- 微信小程序:根据配置自动选择官方客服/自定义客服 -->
|
||||
<button
|
||||
class="btn-item"
|
||||
v-if="fixBtnShow"
|
||||
hoverClass="none"
|
||||
:open-type="weappOfficialService ? 'contact' : ''"
|
||||
@click="weappOfficialService ? '' : handleWeappCustomerService"
|
||||
:style="{ backgroundImage: 'url(' + (kefuimg ? kefuimg : '') + ')', backgroundSize: '100% 100%' }"
|
||||
>
|
||||
<text class="icox icox-kefu" v-if="!kefuimg"></text>
|
||||
<!-- <view>首页</view> -->
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<view class="btn-item" v-if="fixBtnShow" @click="call()" :style="{backgroundImage:'url('+(phoneimg?phoneimg:'')+')',backgroundSize:'100% 100%'}">
|
||||
<text class="iconfont icon-dianhua" v-if="!phoneimg"></text>
|
||||
<!-- <view>我的</view> -->
|
||||
</view>
|
||||
|
||||
<!-- <view class="btn-item icon-xiala" v-if="fixBtnShow" @click="fixBtnShow ? (fixBtnShow = false) : (fixBtnShow = true)">
|
||||
<text class="iconfont icon-unfold"></text>
|
||||
<!-- #ifdef H5 -->
|
||||
<!-- H5逻辑保持不变 -->
|
||||
<button
|
||||
class="btn-item"
|
||||
v-if="fixBtnShow"
|
||||
hoverClass="none"
|
||||
@click="handleCustomerService"
|
||||
:style="{ backgroundImage: 'url(' + (kefuimg ? kefuimg : '') + ')', backgroundSize: '100% 100%' }"
|
||||
>
|
||||
<text class="icox icox-kefu" v-if="!kefuimg"></text>
|
||||
<view v-if="unreadCount > 0 && isDifyService" class="unread-badge">
|
||||
<text class="badge-text">{{ unreadCount > 99 ? '99+' : unreadCount }}</text>
|
||||
</view>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- #ifndef H5 -->
|
||||
<view
|
||||
class="btn-item"
|
||||
v-if="fixBtnShow && isDifyService"
|
||||
@click="handleCustomerService"
|
||||
:style="{ backgroundImage: 'url(' + (aiAgentimg ? aiAgentimg : '') + ')', backgroundSize: '100% 100%' }"
|
||||
>
|
||||
<text class="ai-icon" v-if="!aiAgentimg">🤖</text>
|
||||
<view v-if="unreadCount > 0" class="unread-badge">
|
||||
<text class="badge-text">{{ unreadCount > 99 ? '99+' : unreadCount }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
<view
|
||||
class="btn-item"
|
||||
v-if="fixBtnShow"
|
||||
@click="call()"
|
||||
:style="{ backgroundImage: 'url(' + (phoneimg ? phoneimg : '') + ')', backgroundSize: '100% 100%' }"
|
||||
>
|
||||
<text class="iconfont icon-dianhua" v-if="!phoneimg"></text>
|
||||
</view>
|
||||
<view class="btn-item switch" v-else :class="{ show: fixBtnShow }"
|
||||
@click="fixBtnShow ? (fixBtnShow = false) : (fixBtnShow = true)">
|
||||
<view class="">快捷</view>
|
||||
<view>导航</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createCustomerService } from '@/common/js/customer-service.js';
|
||||
import { mapGetters, mapMutations } from 'vuex';
|
||||
|
||||
export default {
|
||||
name: 'hover-nav',
|
||||
props: {
|
||||
need: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -39,104 +73,235 @@
|
||||
fixBtnShow: true,
|
||||
tel: '',
|
||||
kefuimg: '',
|
||||
phoneimg:''
|
||||
phoneimg: '',
|
||||
customerService: null,
|
||||
buttonConfig: null,
|
||||
isH5: false,
|
||||
platformConfig: null,
|
||||
latestConfig: null,
|
||||
weappOfficialService: false // 微信小程序是否使用官方客服
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.kefuimg = this.$util.getDefaultImage().kefu
|
||||
this.phoneimg = this.$util.getDefaultImage().phone
|
||||
this.pageCount = getCurrentPages().length;
|
||||
var that = this
|
||||
uni.getStorage({
|
||||
key:'shopInfo',
|
||||
success(e){
|
||||
that.tel = e.data.mobile
|
||||
}
|
||||
})
|
||||
// 1. 判断平台类型
|
||||
// #ifdef H5
|
||||
this.isH5 = true;
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
this.isH5 = false;
|
||||
// #endif
|
||||
|
||||
// 2. 初始化资源
|
||||
this.kefuimg = this.$util.getDefaultImage().kefu;
|
||||
this.phoneimg = this.$util.getDefaultImage().phone;
|
||||
this.pageCount = getCurrentPages().length;
|
||||
|
||||
// 3. 获取店铺电话
|
||||
this.getShopTel();
|
||||
|
||||
// 4. 首次加载获取最新配置
|
||||
this.getLatestConfig().then(config => {
|
||||
this.latestConfig = config;
|
||||
this.initCustomerService(config);
|
||||
// 微信小程序:判断是否使用官方客服
|
||||
this.initWeappServiceType();
|
||||
});
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'globalAIKefuConfig',
|
||||
'aiUnreadCount'
|
||||
]),
|
||||
isDifyService() {
|
||||
const serviceType = this.platformConfig?.type || '';
|
||||
return serviceType === 'aikefu';
|
||||
},
|
||||
aiAgentimg() {
|
||||
return this.globalAIKefuConfig?.icon || this.$util.getDefaultImage().aiAgent || '';
|
||||
},
|
||||
unreadCount() {
|
||||
return this.aiUnreadCount;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//拨打电话
|
||||
...mapMutations([
|
||||
'setAiUnreadCount'
|
||||
]),
|
||||
/**
|
||||
* 获取最新配置(H5禁用缓存,小程序保留默认)
|
||||
*/
|
||||
async getLatestConfig() {
|
||||
return new Promise((resolve) => {
|
||||
// H5:强制请求最新配置;小程序:优先用vuex缓存
|
||||
if (this.isH5) {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/site/getServicerConfig',
|
||||
header: {
|
||||
'Cache-Control': 'no-cache, no-store, must-revalidate',
|
||||
'Pragma': 'no-cache',
|
||||
'Expires': '0'
|
||||
},
|
||||
data: { t: new Date().getTime() },
|
||||
success: (res) => {
|
||||
const config = res.code === 0 ? res.data : this.$store.state.servicerConfig || {};
|
||||
this.$store.commit('setServicerConfig', config);
|
||||
resolve(config);
|
||||
},
|
||||
fail: () => resolve(this.$store.state.servicerConfig || {})
|
||||
});
|
||||
} else {
|
||||
// 小程序:直接用vuex缓存(后台修改后需重启开发者工具)
|
||||
resolve(this.$store.state.servicerConfig || {});
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 初始化客服服务
|
||||
*/
|
||||
initCustomerService(config = null) {
|
||||
this.customerService = createCustomerService(this, config || this.latestConfig);
|
||||
this.platformConfig = this.customerService.refreshConfig(config || this.latestConfig);
|
||||
this.buttonConfig = this.customerService.getButtonConfig();
|
||||
},
|
||||
/**
|
||||
* 微信小程序:初始化服务类型(官方/自定义)
|
||||
*/
|
||||
initWeappServiceType() {
|
||||
// #ifdef MP-WEIXIN
|
||||
// 从buttonConfig中获取官方客服标识
|
||||
this.weappOfficialService = this.buttonConfig?.openType === 'contact';
|
||||
// #endif
|
||||
},
|
||||
/**
|
||||
* 获取店铺电话
|
||||
*/
|
||||
getShopTel() {
|
||||
uni.getStorage({
|
||||
key: 'shopInfo',
|
||||
success: (e) => {
|
||||
if (e.data && e.data.mobile && /^1[3-9]\d{9}$/.test(e.data.mobile)) {
|
||||
this.tel = e.data.mobile;
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 拨打电话
|
||||
*/
|
||||
call() {
|
||||
if (!this.tel || !/^1[3-9]\d{9}$/.test(this.tel)) {
|
||||
uni.showToast({ title: '暂无有效联系电话', icon: 'none' });
|
||||
return;
|
||||
}
|
||||
uni.makePhoneCall({
|
||||
phoneNumber:this.tel+''
|
||||
})
|
||||
phoneNumber: this.tel,
|
||||
fail: (err) => {
|
||||
if (err.errMsg !== 'makePhoneCall:fail cancel') {
|
||||
uni.showToast({ title: '拨号失败,请稍后重试', icon: 'none' });
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* H5客服点击逻辑(保持不变)
|
||||
*/
|
||||
async handleCustomerService() {
|
||||
if (this.isH5) {
|
||||
uni.showLoading({ title: '加载中...', mask: true });
|
||||
try {
|
||||
const newConfig = await this.getLatestConfig();
|
||||
this.latestConfig = newConfig;
|
||||
this.initCustomerService(newConfig);
|
||||
this.customerService.handleCustomerClick();
|
||||
} catch (e) {
|
||||
uni.showToast({ title: '操作失败', icon: 'none' });
|
||||
} finally {
|
||||
uni.hideLoading();
|
||||
}
|
||||
} else {
|
||||
// 小程序:直接调用客服逻辑
|
||||
this.customerService.handleCustomerClick();
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 微信小程序自定义客服点击逻辑
|
||||
*/
|
||||
handleWeappCustomerService() {
|
||||
// #ifdef MP-WEIXIN
|
||||
this.customerService.handleCustomerClick();
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.container-box {
|
||||
width: 100%;
|
||||
|
||||
.item-wrap {
|
||||
border-radius: 10rpx;
|
||||
|
||||
.image-box {
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 10rpx;
|
||||
will-change: transform;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//悬浮按钮
|
||||
<style scoped>
|
||||
/* 父容器:不限制高度,避免挤压按钮 */
|
||||
.fixed-box {
|
||||
position: fixed;
|
||||
right: 0rpx;
|
||||
right: 20rpx; /* 增加右侧边距,避免贴边 */
|
||||
bottom: 200rpx;
|
||||
z-index: 10;
|
||||
// background: #fff;
|
||||
// box-shadow: 2rpx 2rpx 22rpx rgba(0, 0, 0, 0.3);
|
||||
border-radius: 120rpx;
|
||||
padding: 20rpx 0;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
width: 100rpx;
|
||||
box-sizing: border-box;
|
||||
transition: 0.3s;
|
||||
overflow: hidden;
|
||||
align-items: center;
|
||||
gap: 14rpx; /* 替代margin,更稳定 */
|
||||
}
|
||||
|
||||
/* 核心:强制按钮为正方形+正圆 */
|
||||
.btn-item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
/* 宽高强制相等,必须是正方形 */
|
||||
width: 88rpx !important;
|
||||
height: 88rpx !important;
|
||||
/* 强制正圆(优先级最高) */
|
||||
border-radius: 50% !important;
|
||||
/* 白色背景(确保是圆) */
|
||||
background-color: #ffffff !important;
|
||||
/* 背景图居中显示,不拉伸 */
|
||||
background-size: 60% 60% !important;
|
||||
background-position: center !important;
|
||||
background-repeat: no-repeat !important;
|
||||
/* 清除默认样式 */
|
||||
border: none !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
/* 居中内容 */
|
||||
display: flex !important;
|
||||
justify-content: center !important;
|
||||
align-items: center !important;
|
||||
/* 阴影增强视觉(可选) */
|
||||
box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.1);
|
||||
}
|
||||
/* 清除button标签的默认点击样式(微信小程序/浏览器) */
|
||||
.btn-item::after {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.unread-badge {
|
||||
position: absolute;
|
||||
top: -5rpx;
|
||||
right: -5rpx;
|
||||
background: #ff4544;
|
||||
color: #fff;
|
||||
border-radius: 20rpx;
|
||||
min-width: 30rpx;
|
||||
height: 30rpx;
|
||||
line-height: 30rpx;
|
||||
text-align: center;
|
||||
flex-direction: column;
|
||||
line-height: 1;
|
||||
margin: 14rpx 0;
|
||||
transition: 0.1s;
|
||||
background: #fff;
|
||||
border-radius: 50rpx;
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
padding: 0;
|
||||
text {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
font-size: 10rpx;
|
||||
padding: 0 8rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(255, 73, 72, 0.3);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
view {
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
/* 微信小程序字体适配 */
|
||||
/* #ifdef MP-WEIXIN */
|
||||
.unread-badge {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
/* #endif */
|
||||
|
||||
&.show {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
&.switch {}
|
||||
|
||||
&.icon-xiala {
|
||||
margin: 0;
|
||||
margin-top: 0.1rpx;
|
||||
}
|
||||
}
|
||||
.ai-icon {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -51,18 +51,14 @@
|
||||
<block v-for="(item, index) in birthday.coupon_list" :key="index">
|
||||
<view class="content">
|
||||
<view class="info">
|
||||
<block v-if="item.type == 'reward'">
|
||||
<text class="num">
|
||||
<text class="num" v-if="item.type == 'reward'">
|
||||
{{ parseFloat(item.money) }}
|
||||
<text class="type">元优惠劵</text>
|
||||
</text>
|
||||
</block>
|
||||
<block v-else-if="item.type == 'discount'">
|
||||
<text class="num">
|
||||
<text class="num" v-else-if="item.type == 'discount'">
|
||||
{{ item.discount }}
|
||||
<text class="type">折</text>
|
||||
</text>
|
||||
</block>
|
||||
<view class="desc">用于下单时抵现或兑换商品等</view>
|
||||
</view>
|
||||
<view class="tip" @click="closeRewardPopup('3')">立即查看</view>
|
||||
@@ -93,7 +89,8 @@
|
||||
birthday: {
|
||||
flag: false,
|
||||
coupon_list: {}
|
||||
}
|
||||
},
|
||||
callback: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@@ -117,7 +114,8 @@
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
init(callback = null) {
|
||||
if (callback) this.callback = callback;
|
||||
this.getBirthdayGift();
|
||||
},
|
||||
cancel() {
|
||||
@@ -148,7 +146,9 @@
|
||||
data: {
|
||||
id: this.birthday.id
|
||||
},
|
||||
success: res => {}
|
||||
success: res => {
|
||||
if (this.callback) this.callback();
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
@@ -170,7 +170,7 @@
|
||||
}
|
||||
|
||||
.register-box {
|
||||
max-height: 300rpx;
|
||||
max-height: 320rpx;
|
||||
overflow-y: scroll;
|
||||
/* margin-top:350rpx; */
|
||||
}
|
||||
@@ -187,12 +187,12 @@
|
||||
|
||||
<style lang="scss">
|
||||
.reward-wrap {
|
||||
width: 85vw;
|
||||
width: 600rpx;
|
||||
height: auto;
|
||||
|
||||
.wrap {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
width: 600rpx;
|
||||
height: 932rpx;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
padding-bottom: 40rpx;
|
||||
@@ -266,7 +266,8 @@
|
||||
background: #fff;
|
||||
border-radius: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
box-sizing: border-box;
|
||||
height: 136rpx;
|
||||
.info {
|
||||
flex: 1;
|
||||
}
|
||||
@@ -323,13 +324,6 @@
|
||||
height: 40rpx;
|
||||
margin: 0 auto;
|
||||
line-height: 40rpx;
|
||||
/* margin: 20rpx 140rpx;
|
||||
border: none;
|
||||
background: linear-gradient(90deg, #FF6A00, #FF3C00);
|
||||
border-radius: 40rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center; */
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,28 +3,37 @@
|
||||
<slot></slot>
|
||||
<!-- #ifdef MP-ALIPAY -->
|
||||
<view class="contact-button" @click="contactServicer">
|
||||
<contact-button :tnt-inst-id="config.instid" :scene="config.scene" size="1000rpx" v-if="config.type == 'aliapp'"/>
|
||||
<contact-button :tnt-inst-id="config.instid" :scene="config.scene" size="1000rpx"
|
||||
v-if="config.type == 'aliapp'" />
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-ALIPAY -->
|
||||
<button
|
||||
type="default"
|
||||
hover-class="none"
|
||||
:open-type="openType"
|
||||
class="contact-button"
|
||||
@click="contactServicer"
|
||||
:send-message-title="sendMessageTitle"
|
||||
:send-message-path="sendMessagePath"
|
||||
:send-message-img="sendMessageImg"
|
||||
:show-message-card="true"></button>
|
||||
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<!-- 微信小程序官方客服按钮 -->
|
||||
<button v-if="useOfficialService" type="default" hover-class="none" open-type="contact"
|
||||
class="contact-button" sessionFrom="weapp" showMessageCard="true"
|
||||
:send-message-title="sendMessageTitle" :send-message-path="sendMessagePath"
|
||||
:send-message-img="sendMessageImg"></button>
|
||||
|
||||
<!-- 微信小程序自定义客服按钮 -->
|
||||
<button v-else type="default" hover-class="none" class="contact-button" @click="contactServicer"></button>
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- #ifndef MP-WEIXIN && MP-ALIPAY -->
|
||||
<!-- 其他平台保持原逻辑 -->
|
||||
<button type="default" hover-class="none" :open-type="openType" class="contact-button" @click="contactServicer"
|
||||
:send-message-title="sendMessageTitle" :send-message-path="sendMessagePath"
|
||||
:send-message-img="sendMessageImg" :show-message-card="true"></button>
|
||||
<!-- #endif -->
|
||||
|
||||
<uni-popup ref="servicePopup" type="center">
|
||||
<view class="service-popup-wrap">
|
||||
<view class="head-wrap" @click="$refs.servicePopup.close()">
|
||||
<text>联系客服</text>
|
||||
<text class="iconfont icon-close"></text>
|
||||
</view>
|
||||
<view class="body-wrap">{{ siteInfo.site_tel ? '请联系客服,客服电话是' + siteInfo.site_tel : '抱歉,商家暂无客服,请线下联系' }}</view>
|
||||
<view class="body-wrap">{{ siteInfo.site_tel ? '请联系客服,客服电话是' + siteInfo.site_tel : '抱歉,商家暂无客服,请线下联系' }}
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
@@ -32,6 +41,8 @@
|
||||
|
||||
<!-- 客服组件 -->
|
||||
<script>
|
||||
import { createCustomerService } from '@/common/js/customer-service.js';
|
||||
|
||||
export default {
|
||||
name: 'ns-contact',
|
||||
props: {
|
||||
@@ -56,76 +67,64 @@
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
config: null,
|
||||
openType: ''
|
||||
customerService: null,
|
||||
buttonConfig: null
|
||||
};
|
||||
},
|
||||
created() {
|
||||
if (this.servicerConfig) {
|
||||
// #ifdef H5
|
||||
this.config = this.servicerConfig.h5;
|
||||
// #endif
|
||||
computed: {
|
||||
/**
|
||||
* 是否使用官方客服
|
||||
*/
|
||||
useOfficialService() {
|
||||
if (!this.buttonConfig) return true;
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
this.config = this.servicerConfig.weapp;
|
||||
if (this.config.type == 'weapp') this.openType = 'contact';
|
||||
// 如果是微信小程序,检查配置
|
||||
if (this.buttonConfig.type === 'weapp') {
|
||||
// 默认使用官方客服,除非明确设置为false
|
||||
return this.buttonConfig.useOfficial !== false;
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-ALIPAY
|
||||
this.config = this.servicerConfig.aliapp;
|
||||
if (this.config.type == 'aliapp') this.openType = 'contact';
|
||||
// #endif
|
||||
return false;
|
||||
},
|
||||
|
||||
/**
|
||||
* 客服配置
|
||||
*/
|
||||
config() {
|
||||
return this.customerService?.getPlatformConfig() || {};
|
||||
},
|
||||
|
||||
/**
|
||||
* 打开类型
|
||||
*/
|
||||
openType() {
|
||||
return this.buttonConfig?.openType || '';
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 初始化客服服务
|
||||
this.customerService = createCustomerService(this);
|
||||
this.buttonConfig = this.customerService.getButtonConfig();
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 联系客服
|
||||
*/
|
||||
contactServicer() {
|
||||
if (this.config.type == 'none') {
|
||||
this.$refs.servicePopup.open();
|
||||
// 如果是微信/支付宝小程序客服,由系统自动处理
|
||||
if (this.buttonConfig.openType === 'contact') {
|
||||
return;
|
||||
}
|
||||
if (this.openType == 'contact') return;
|
||||
|
||||
switch (this.config.type) {
|
||||
case 'wxwork':
|
||||
// #ifdef H5
|
||||
location.href = this.config.wxwork_url;
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
wx.openCustomerServiceChat({
|
||||
extInfo: { url: this.config.wxwork_url },
|
||||
corpId: this.config.corpid,
|
||||
showMessageCard: true,
|
||||
// 使用统一客服处理
|
||||
this.customerService.handleCustomerClick({
|
||||
niushop: this.niushop,
|
||||
sendMessageTitle: this.sendMessageTitle,
|
||||
sendMessagePath: this.sendMessagePath,
|
||||
sendMessageImg: this.sendMessageImg
|
||||
});
|
||||
// #endif
|
||||
break;
|
||||
case 'third':
|
||||
location.href = this.config.third_url;
|
||||
break;
|
||||
case 'niushop':
|
||||
this.$util.redirectTo('/pages_tool/chat/room', this.niushop);
|
||||
break;
|
||||
default:
|
||||
this.makePhoneCall();
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 店铺联系方式
|
||||
*/
|
||||
makePhoneCall() {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/site/shopcontact',
|
||||
success: res => {
|
||||
if (res.code == 0 && res.data.mobile) uni.makePhoneCall({
|
||||
phoneNumber: res.data
|
||||
.mobile
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -47,9 +47,6 @@ export default {
|
||||
} else {
|
||||
this.$util.redirectTo('/pages/index/index');
|
||||
}
|
||||
},
|
||||
re(text) {
|
||||
this.text = text;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -220,7 +220,7 @@
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: this.data
|
||||
formData:[]
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@@ -229,23 +229,26 @@
|
||||
watch: {
|
||||
data: function() {
|
||||
this.setFormData();
|
||||
},
|
||||
formData: {
|
||||
handler(newVal, oldVal) {
|
||||
this.$emit('changeFormVal',newVal)
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setFormData() {
|
||||
this.formData = this.data;
|
||||
|
||||
this.formData.forEach(item => {
|
||||
let formData = JSON.parse(JSON.stringify(this.data));
|
||||
formData.forEach(item => {
|
||||
if (!item.val) item.val = item.value.default ? item.value.default : '';
|
||||
|
||||
if (item.value.options) {
|
||||
item.option_lists = [];
|
||||
item.value.options.forEach((v, k) => {
|
||||
var obj = {};
|
||||
obj.value = v;
|
||||
obj.checked = false;
|
||||
if (item.controller == 'Radio' && ((!item.val && k == 0) || (item.val &&
|
||||
item.val == v))) {
|
||||
if (item.controller == 'Radio' && ((!item.val && k == 0) || (item.val && item.val == v))) {
|
||||
obj.checked = true;
|
||||
item.val = v;
|
||||
}
|
||||
@@ -359,6 +362,7 @@
|
||||
else item.default_regions = [];
|
||||
}
|
||||
});
|
||||
this.formData = JSON.parse(JSON.stringify(formData))
|
||||
},
|
||||
verify() {
|
||||
let verify = true;
|
||||
@@ -392,6 +396,7 @@
|
||||
}
|
||||
|
||||
// 验证手机号
|
||||
|
||||
if (item.name == 'MOBILE' && this.$util.verifyMobile(item.val) === false) {
|
||||
verify = !item.value.required;
|
||||
if (verify == false) {
|
||||
@@ -515,7 +520,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
console.log(verify)
|
||||
if (verify) {
|
||||
return this.formData;
|
||||
} else return verify;
|
||||
@@ -678,7 +683,7 @@
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
border-bottom: solid 1px #eee;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
&.align-top {
|
||||
@@ -836,6 +841,9 @@
|
||||
checkbox {
|
||||
display: none;
|
||||
}
|
||||
label {
|
||||
padding:10rpx 0;
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
display: flex;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view>
|
||||
<block v-if="text == '客服'">
|
||||
<block v-if="text == '客服' || text == 'Contact'">
|
||||
<!-- <ns-contact :niushop="chatParam" :send-message-title="sendData.title" :send-message-path="sendData.path" :send-message-img="sendData.img"> -->
|
||||
<button hoverClass="none" openType="contact" sessionFrom="weapp" showMessageCard="true" class="action-icon-wrap" style="background: transparent;padding: 0;margin: 0;">
|
||||
<view class="iconfont color-title" :class="icon"></view>
|
||||
@@ -11,7 +11,7 @@
|
||||
</block>
|
||||
<block v-else>
|
||||
<view class="action-icon-wrap" @click="clickEvent">
|
||||
<view class="iconfont " :class="icon"></view>
|
||||
<view class="iconfont color-title" :class="icon"></view>
|
||||
<text>{{ text }}</text>
|
||||
<view class="corner-mark color-base-bg" :class="{'max' : parseInt(cornerMark)>99}" v-if="cornerMark.length" :style="{ background: cornerMarkBg+'!important', color: cornerMarkColor }">{{ cornerMark > 99 ? '99+' : cornerMark }}</view>
|
||||
</view>
|
||||
|
||||
@@ -79,8 +79,6 @@ export default {
|
||||
<style lang="scss">
|
||||
.ns-goods-promotion {
|
||||
background-color: #fff;
|
||||
& > view {
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
font-size: $font-size-base;
|
||||
|
||||
@@ -1,5 +1,93 @@
|
||||
<template>
|
||||
<view></view>
|
||||
<view class="goods-recommend" v-if="list.length">
|
||||
<view class="goods-recommend-title">
|
||||
<text class="title">{{ config.title }}</text>
|
||||
</view>
|
||||
|
||||
<view class="goods-list double-column">
|
||||
<view class="goods-item margin-bottom" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
|
||||
<view class="goods-img">
|
||||
<image :src="goodsImg(item.goods_image)" mode="widthFix" @error="imgError(index)" :lazy-load="true" />
|
||||
<view class="color-base-bg goods-tag" v-if="goodsTag(item) != ''">{{ goodsTag(item) }}</view>
|
||||
<view class="sell-out" v-if="item.goods_stock <= 0">
|
||||
<text class="iconfont icon-shuqing"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-wrap">
|
||||
<view class="goods-name" :class="[{ 'using-hidden': config.nameLineMode == 'single' }, { 'multi-hidden': config.nameLineMode == 'multiple' }]">
|
||||
{{ item.goods_name }}
|
||||
</view>
|
||||
|
||||
<view class="lineheight-clear">
|
||||
<view class="discount-price">
|
||||
<text class="unit price-style small">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="price price-style large">{{ parseFloat(showPrice(item)).toFixed(2).split('.')[0] }}</text>
|
||||
<text class="unit price-style small">.{{ parseFloat(showPrice(item)).toFixed(2).split('.')[1] }}</text>
|
||||
</view>
|
||||
<view class="member-price-tag" v-if="item.member_price && item.member_price == showPrice(item)">
|
||||
<image :src="$util.img('public/uniapp/index/VIP.png')" mode="widthFix"/>
|
||||
</view>
|
||||
<view class="member-price-tag" v-else-if="item.promotion_type == 1">
|
||||
<image :src="$util.img('public/uniapp/index/discount.png')" mode="widthFix"/>
|
||||
</view>
|
||||
<view class="delete-price font-size-activity-tag color-tip price-font" v-if="showMarketPrice(item)">
|
||||
<text class="unit">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text>{{ showMarketPrice(item) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pro-info">
|
||||
<view class="block-wrap">
|
||||
<view class="sale font-size-activity-tag color-tip" v-if="item.sale_show">已售{{ item.sale_num }}{{ item.unit ? item.unit : '件' }}</view>
|
||||
</view>
|
||||
|
||||
<view class="cart-action-wrap" v-if="config.control && item.is_virtual == 0">
|
||||
<!-- 购物车图标 -->
|
||||
<view v-if="config.style == 'icon-cart'" :style="{
|
||||
color: config.theme == 'diy' ? config.textColor : '',
|
||||
borderColor: config.theme == 'diy' ? config.textColor : ''
|
||||
}" class="cart shopping-cart-btn iconfont icon-gouwuche click-wrap" :id="'goods-' + item.id"
|
||||
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
|
||||
<view class="click-event"></view>
|
||||
</view>
|
||||
|
||||
<!--加号图标 -->
|
||||
<view v-else-if="config.style == 'icon-add'" :style="{
|
||||
color: config.theme == 'diy' ? config.textColor : '',
|
||||
borderColor: config.theme == 'diy' ? config.textColor : ''
|
||||
}" class="cart plus-sign-btn iconfont icon-add1 click-wrap" :id="'goods-' + item.id"
|
||||
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
|
||||
<view class="click-event"></view>
|
||||
</view>
|
||||
|
||||
<!-- 按钮 -->
|
||||
<view v-else-if="config.style == 'button'" :style="{
|
||||
backgroundColor: config.theme == 'diy' ? config.bgColor : '',
|
||||
color: config.theme == 'diy' ? config.textColor : '',
|
||||
fontWeight: config.theme == 'diy' ? (config.fontWeight ? 'bold' : 'normal') : '',
|
||||
padding: config.theme == 'diy' ? '12rpx ' + config.padding * 2 + 'rpx' : ''
|
||||
}" class="cart buy-btn click-wrap" :id="'goods-' + item.id"
|
||||
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
|
||||
{{ config.text }}
|
||||
<view class="click-event"></view>
|
||||
</view>
|
||||
|
||||
<!--自定义图标 -->
|
||||
<view v-else-if="config.style == 'icon-diy'" :style="{
|
||||
color: config.theme == 'diy' ? config.textColor : ''
|
||||
}" class="icon-diy click-wrap" :id="'goods-' + item.id"
|
||||
@click.stop="$refs.goodsSkuIndex.addCart(config.cartEvent, item, $event)">
|
||||
<view class="click-event"></view>
|
||||
<diy-icon :icon="config.iconDiy.icon" :value="config.iconDiy.style ? config.iconDiy.style : null"></diy-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-box" v-if="showLoading && load"><ns-loading></ns-loading></view>
|
||||
|
||||
<ns-goods-sku-index ref="goodsSkuIndex" @cartListChange="cartListChange" @addCart="addCart"></ns-goods-sku-index>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -256,6 +344,22 @@
|
||||
right: 0;
|
||||
// transform: translateY(-50%);
|
||||
}
|
||||
.sell-out{
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
text{
|
||||
color: #fff;
|
||||
font-size: 220rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.goods-tag {
|
||||
|
||||
@@ -31,9 +31,11 @@
|
||||
@click="change(item_value.sku_id, item_value.spec_id)">
|
||||
<image v-if="item_value.image" :src="$util.img(item_value.image, { size: 'small' })" @error="valueImageError(index, index_value)" />
|
||||
<text>{{ item_value.spec_value_name }}</text>
|
||||
<view class="empty-stock" v-if="item_value.stock == 0">缺货</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<ns-form :data="goodsForm" v-if="goodsForm" ref="form"></ns-form>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="footer">
|
||||
@@ -50,12 +52,12 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer-right">
|
||||
<view class="change_num" v-if="number > 0">
|
||||
<view class="change_num" v-if="cartInputLock">
|
||||
<view class="num-action" @click="changeNum('-')">
|
||||
<text class="desc iconfont icon-jianshao color-base-text"></text>
|
||||
<view class="click-event"></view>
|
||||
</view>
|
||||
<input type="number" class="uni-input" @blur="blur" v-model="number" placeholder="0" @input="keyInput(false)" />
|
||||
<input type="number" class="uni-input" @blur="blur" v-model.lazy="number" placeholder="0" @input="keyInput(false,null,true)" />
|
||||
<view class="num-action" :id="'select-sku-num-' + goodsDetail.goods_id" @click="changeNum('+', $event)">
|
||||
<text class="add iconfont icon-add-fill color-base-text change_hover"></text>
|
||||
<view class="click-event"></view>
|
||||
@@ -115,7 +117,9 @@
|
||||
maxBuy: 0,
|
||||
minBuy: 0,
|
||||
isLoad: false,
|
||||
timeout: null
|
||||
timeout: null,
|
||||
goodsForm: null,
|
||||
skuList: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@@ -124,21 +128,44 @@
|
||||
watch: {
|
||||
pointLimit(newNum, oldNum) {
|
||||
this.limitNumber = Number(newNum);
|
||||
},
|
||||
minBuy(newData, oldData) {
|
||||
if (this.minBuy > 1) {
|
||||
this.number = Number(this.minBuy);
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
cartInputLock:function() {
|
||||
if(!this.isLoad){
|
||||
return true
|
||||
}else if(this.number>0){
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
calcSkuStock() {
|
||||
if(this.goodsDetail.goods_spec_format && this.goodsDetail.goods_spec_format.length){
|
||||
this.goodsDetail.goods_spec_format.forEach(spec => {
|
||||
spec.value.forEach(val => {
|
||||
this.skuList.forEach(sku => {
|
||||
if (val.sku_id == sku.sku_id) {
|
||||
this.$set(val,'stock',sku.stock);
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
show(data) {
|
||||
this.number = 0 ; // 每次打开要初始化
|
||||
this.isLoad = true;
|
||||
this.goodsDetail = data;
|
||||
this.goodsId = this.goodsDetail.goods_id;
|
||||
this.skuId = this.goodsDetail.sku_id;
|
||||
this.maxBuy = this.goodsDetail.max_buy;
|
||||
this.minBuy = this.goodsDetail.min_buy;
|
||||
this.goodsForm = null
|
||||
this.getGoodsForm()
|
||||
this.getGoodsSkuList(this.goodsId);
|
||||
this.keyInput(false);
|
||||
if (this.getCurrentCart()) {
|
||||
@@ -146,6 +173,19 @@
|
||||
}
|
||||
this.$refs.skuPopup.open();
|
||||
},
|
||||
getGoodsForm(){
|
||||
this.$api.sendRequest({
|
||||
url: "/form/api/form/goodsform",
|
||||
data: {
|
||||
goods_id: this.goodsDetail.goods_id
|
||||
},
|
||||
success: res => {
|
||||
if (res.code == 0 && res.data) {
|
||||
this.goodsForm = res.data
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
hide() {
|
||||
if(this.$refs.skuPopup) this.$refs.skuPopup.close();
|
||||
},
|
||||
@@ -175,6 +215,7 @@
|
||||
} else {
|
||||
this.number = 0;
|
||||
}
|
||||
this.calcSkuStock()
|
||||
},
|
||||
//查看规格图片
|
||||
previewMedia() {
|
||||
@@ -228,6 +269,8 @@
|
||||
obj['sku_' + item.sku_id] = item;
|
||||
});
|
||||
this.goodsSkuList = obj;
|
||||
this.skuList = res.data;
|
||||
this.calcSkuStock();
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -281,8 +324,7 @@
|
||||
}
|
||||
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('#' + event.currentTarget.id + ' .click-event')
|
||||
.boundingClientRect(data => {
|
||||
query.select('#' + event.currentTarget.id + ' .click-event').boundingClientRect(data => {
|
||||
if (data) {
|
||||
this.$emit('addCart', data.left, data.top);
|
||||
}
|
||||
@@ -325,14 +367,16 @@
|
||||
|
||||
let newNumber = parseInt(this.number);
|
||||
|
||||
this.isLoad = false;
|
||||
this.isLoad = true;
|
||||
|
||||
setTimeout(() => {
|
||||
this.number = newNumber;
|
||||
this.cartNumChange(this.number);
|
||||
}, 0);
|
||||
},
|
||||
//输入数量
|
||||
keyInput(flag, callback) {
|
||||
keyInput(flag, callback,isInput) {
|
||||
if(isInput) this.isLoad = false
|
||||
setTimeout(() => {
|
||||
var stock = this.goodsDetail.stock;
|
||||
|
||||
@@ -352,7 +396,7 @@
|
||||
this.number = stock;
|
||||
}
|
||||
// 商品起售数
|
||||
if (this.minBuy > 1 && this.number < this.minBuy) {
|
||||
if (flag && this.minBuy > 1 && this.number < this.minBuy) {
|
||||
this.number = this.minBuy;
|
||||
}
|
||||
|
||||
@@ -374,7 +418,13 @@
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.$refs.form) {
|
||||
if (!this.$refs.form.verify()) return;
|
||||
uni.setStorageSync('goodFormData', {
|
||||
goods_id: this.goodsDetail.goods_id,
|
||||
form_data: this.$refs.form.formData
|
||||
});
|
||||
}
|
||||
this.number = 1;
|
||||
//纠正数量
|
||||
this.keyInput(true, () => {
|
||||
@@ -677,6 +727,19 @@
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.body-item .sku-list-wrap .empty-stock{
|
||||
font-size: 18rpx;
|
||||
line-height: 22rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
border-radius: 4rpx;
|
||||
transform: translateY(-50%);
|
||||
padding: 0 2rpx;
|
||||
color: #989898;
|
||||
background-color: #f0f1f2;
|
||||
}
|
||||
|
||||
.sku-layer .body-item .sku-list-wrap .items {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
|
||||
@@ -51,12 +51,7 @@
|
||||
* @param {Object} data 商品项
|
||||
*/
|
||||
singleSpecificationGoods(data, event) {
|
||||
let cart =
|
||||
this.cartList['goods_' + data.goods_id] && this.cartList['goods_' + data.goods_id]['sku_' + data
|
||||
.sku_id
|
||||
] ?
|
||||
this.cartList['goods_' + data.goods_id]['sku_' + data.sku_id] :
|
||||
null;
|
||||
let cart = this.cartList['goods_' + data.goods_id] && this.cartList['goods_' + data.goods_id]['sku_' + data.sku_id] ? this.cartList['goods_' + data.goods_id]['sku_' + data.sku_id] : null;
|
||||
|
||||
let cartNum = cart ? cart.num : 0;
|
||||
let api = cart && cart.cart_id ? '/api/cart/edit' : '/api/cart/add';
|
||||
@@ -66,6 +61,7 @@
|
||||
if(cart && cart.cart_id){
|
||||
_num = _num + (data.min_buy > 0 ? data.min_buy : 1)
|
||||
}
|
||||
|
||||
let cart_id = cart ? cart.cart_id : 0;
|
||||
if (_num > parseInt(data.stock)) {
|
||||
this.$util.showToast({
|
||||
@@ -119,8 +115,7 @@
|
||||
this.isRepeat = false;
|
||||
if (res.code == 0) {
|
||||
if (cart_id == 0) {
|
||||
this.cartList['goods_' + data.goods_id]['sku_' + data.sku_id].cart_id =
|
||||
res.data;
|
||||
this.cartList['goods_' + data.goods_id]['sku_' + data.sku_id].cart_id = res.data;
|
||||
}
|
||||
this.$util.showToast({
|
||||
title: "商品添加购物车成功"
|
||||
|
||||
@@ -153,6 +153,7 @@
|
||||
}" class="items" @click="change(item_value.sku_id, item_value.spec_id)">
|
||||
<image v-if="item_value.image" :src="$util.img(item_value.image, { size: 'small' })" @error="valueImageError(index, index_value)" />
|
||||
<text>{{ item_value.spec_value_name }}</text>
|
||||
<view class="empty-stock" v-if="item_value.stock == 0">缺货</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -174,7 +175,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<ns-form :data="goodsForm" v-if="goodsForm" ref="form"></ns-form>
|
||||
<ns-form :data="goodsForm" v-if="goodsForm" ref="form" @changeFormVal="changeFormVal"></ns-form>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="footer" @click="confirm()">
|
||||
@@ -182,7 +183,8 @@
|
||||
<block v-if="type == 'point'">
|
||||
<block v-if="goodsDetail.type == 1">
|
||||
<!-- 兑换商品 -->
|
||||
<button v-if="goodsDetail.stock && goodsDetail.stock != 0" type="primary">兑换</button>
|
||||
<button v-if="goodsDetail.point * number > memberPoint" disabled="true" type="primary">积分不足</button>
|
||||
<button v-else-if="goodsDetail.stock && goodsDetail.stock != 0" type="primary">兑换</button>
|
||||
<button type="primary" v-else disabled="true">库存不足</button>
|
||||
</block>
|
||||
<block v-else-if="goodsDetail.type == 2 || goodsDetail.type == 3">
|
||||
@@ -195,7 +197,8 @@
|
||||
<button type="primary" v-else-if="goodsDetail.stock && goodsDetail.stock != 0 && type == 'buy_now'">立即购买</button>
|
||||
<button type="primary" v-else-if="goodsDetail.stock && goodsDetail.stock != 0 && type == 'confirm'">确认</button>
|
||||
<template v-else-if="goodsDetail.stock && goodsDetail.stock != 0">
|
||||
<template v-if="goodsDetail.buy_num">
|
||||
<!-- 拼团和拼返的buy_num代表最大购买数量,不是最小购买数量 -->
|
||||
<template v-if="type != 'pintuan' && type != 'pinfan' && goodsDetail.buy_num">
|
||||
<button type="primary" v-if="goodsDetail.buy_num <= goodsDetail.stock">立即抢购</button>
|
||||
<button type="primary" v-else disabled="true">库存不足</button>
|
||||
</template>
|
||||
@@ -226,6 +229,10 @@
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
memberPoint: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
goodsDetail: {
|
||||
type: Object,
|
||||
default: null
|
||||
@@ -244,6 +251,12 @@
|
||||
minBuy: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
goodsFormVal: {
|
||||
type: Array,
|
||||
default () {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@@ -265,7 +278,8 @@
|
||||
pintuan_num_field: 'pintuan_num',
|
||||
goodsSkuInfo: null, //所有的商品规格信息
|
||||
goodsForm: null,
|
||||
isLoad: false // 是否首次加载
|
||||
isLoad: false ,// 是否首次加载
|
||||
skuList: [],//所有规格数据
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@@ -310,8 +324,8 @@
|
||||
this.pintuan_num_field = newData.pintuan_num_field;
|
||||
}
|
||||
if (this.goodsDetail.goods_form && !this.goodsForm) this.goodsForm = this.goodsDetail.goods_form;
|
||||
|
||||
// 切换商品,重新赋值
|
||||
this.calcSkuStock()
|
||||
if (newData.goods_id != oldData.goods_id) {
|
||||
if (this.goodsDetail.pintuan_id) {
|
||||
this.getPintuanGoodsSkuList();
|
||||
@@ -378,6 +392,34 @@
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
calcSkuStock() {
|
||||
if(this.goodsDetail.goods_spec_format && this.goodsDetail.goods_spec_format.length){
|
||||
this.goodsDetail.goods_spec_format.forEach(spec => {
|
||||
spec.value.forEach(val => {
|
||||
this.skuList.forEach(sku => {
|
||||
if (val.sku_id == sku.sku_id) {
|
||||
this.$set(val,'stock',sku.stock);
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
changeFormVal(e) {
|
||||
this.$emit('detailChangeVal',e)
|
||||
},
|
||||
getGoodsForm(){
|
||||
this.$api.sendRequest({
|
||||
url: "/form/api/form/goodsform",
|
||||
data: {
|
||||
goods_id: this.goodsDetail.goods_id
|
||||
},
|
||||
success: res => {
|
||||
if (res.code == 0 && res.data) this.$set(this.goodsDetail, 'goods_form', res.data);
|
||||
if(this.goodsFormVal.length) Object.assign(this.goodsDetail.goods_form,this.goodsFormVal)
|
||||
}
|
||||
});
|
||||
},
|
||||
//【普通商品】获取所有规格信息
|
||||
getGeneralGoodsSkuList(callback) {
|
||||
this.$api.sendRequest({
|
||||
@@ -387,9 +429,7 @@
|
||||
},
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
let data = res.data,
|
||||
obj = {};
|
||||
|
||||
let obj = {};
|
||||
res.data.forEach((item, index) => {
|
||||
item = this.handleData(item);
|
||||
|
||||
@@ -415,6 +455,8 @@
|
||||
if (this.skuId == 0) this.skuId = res.data[0].sku_id;
|
||||
this.goodsSkuInfo = obj;
|
||||
this.isLoad = false;
|
||||
this.skuList = res.data;
|
||||
this.calcSkuStock();
|
||||
if (callback) callback();
|
||||
} else {
|
||||
this.$util.redirectTo('/pages/index/index');
|
||||
@@ -493,7 +535,7 @@
|
||||
item = this.handleData(item);
|
||||
item.show_price = this.goodsDetail.groupbuy_price;
|
||||
item.save_price = item.price - item.show_price > 0 ? (item.price - item.show_price).toFixed(2) : 0;
|
||||
|
||||
//团购buy_num指最少购买数量
|
||||
if (data.stock > data.buy_num) {
|
||||
this.number = this.goodsDetail.buy_num;
|
||||
this.minNumber = this.goodsDetail.buy_num;
|
||||
@@ -730,6 +772,9 @@
|
||||
popclose() {
|
||||
if (this.$refs.skuPopup.showPopup) {
|
||||
this.$emit('hideSkuPop');
|
||||
}else{
|
||||
this.goodsForm = null
|
||||
this.getGoodsForm()
|
||||
}
|
||||
},
|
||||
//查看规格图片
|
||||
@@ -766,7 +811,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.goodsSkuDetail = this.goodsSkuInfo['sku_' + this.skuId];
|
||||
this.$emit('refresh', this.goodsSkuDetail);
|
||||
this.$emit('getSkuId', this.skuId);
|
||||
@@ -781,6 +825,7 @@
|
||||
this.confirmDisabled = false;
|
||||
}
|
||||
}
|
||||
|
||||
this.keyInput(true);
|
||||
},
|
||||
showPrice(price) {
|
||||
@@ -1013,7 +1058,7 @@
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.goodsDetail.buy_num > this.goodsDetail.stock) {
|
||||
if (this.type != 'pintuan' && this.type != 'pinfan' && this.goodsDetail.buy_num > this.goodsDetail.stock) {
|
||||
this.$util.showToast({
|
||||
title: '库存小于最低购买数量'
|
||||
});
|
||||
@@ -1077,7 +1122,7 @@
|
||||
title: '加入购物车成功'
|
||||
});
|
||||
this.cartNum += this.number;
|
||||
|
||||
this.$store.dispatch('getCartNumber');
|
||||
let discount_price = this.goodsDetail.discount_price;
|
||||
if (this.goodsDetail.member_price > 0 && Number(this.goodsDetail.member_price) <= Number(this.goodsDetail.discount_price)) {
|
||||
discount_price = this.goodsDetail.member_price;
|
||||
@@ -1213,6 +1258,9 @@
|
||||
});
|
||||
} else if (this.type == 'bargain') {
|
||||
// 砍价
|
||||
if (this.callback) {
|
||||
this.callback();
|
||||
}else {
|
||||
this.$api.sendRequest({
|
||||
url: '/bargain/api/bargain/launch',
|
||||
data: {
|
||||
@@ -1221,13 +1269,10 @@
|
||||
success: res => {
|
||||
this.btnSwitch = false;
|
||||
if (res.code == 0) {
|
||||
this.$util.redirectTo(
|
||||
'/pages_promotion/bargain/detail', {
|
||||
this.$util.redirectTo('/pages_promotion/bargain/detail', {
|
||||
b_id: this.goodsDetail.bargain_id,
|
||||
l_id: res.data
|
||||
},
|
||||
'redirectTo'
|
||||
);
|
||||
}, 'redirectTo');
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.message
|
||||
@@ -1235,6 +1280,7 @@
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
} else if (this.type == 'point') {
|
||||
// 积分兑换
|
||||
var data = {
|
||||
@@ -1399,6 +1445,7 @@
|
||||
|
||||
.body-item .sku-list-wrap {
|
||||
padding-bottom: 0rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.body-item .sku-list-wrap .title {
|
||||
@@ -1406,6 +1453,19 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.body-item .sku-list-wrap .empty-stock{
|
||||
font-size: 18rpx;
|
||||
line-height: 22rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
border-radius: 4rpx;
|
||||
transform: translateY(-50%);
|
||||
padding: 0 2rpx;
|
||||
color: #989898;
|
||||
background-color: #f0f1f2;
|
||||
}
|
||||
|
||||
.body-item .sku-list-wrap .items {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
||||
@@ -34,15 +34,11 @@
|
||||
<view class="head">
|
||||
<text class="title">
|
||||
获取您的昵称、头像
|
||||
<template v-if="forceBindingMobileControl">
|
||||
、手机号
|
||||
</template>
|
||||
<template v-if="forceBindingMobileControl">、手机号</template>
|
||||
</text>
|
||||
<text class="color-tip tips">
|
||||
获取用户头像、昵称
|
||||
<template v-if="forceBindingMobileControl">
|
||||
、手机号
|
||||
</template>
|
||||
<template v-if="forceBindingMobileControl">、手机号</template>
|
||||
完善个人资料,主要用于向用户提供具有辨识度的用户中心界面
|
||||
</text>
|
||||
<text class="iconfont icon-close color-tip" @click="cancelCompleteInfo"></text>
|
||||
@@ -156,7 +152,7 @@
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
// 控制按钮是否禁用
|
||||
@@ -182,10 +178,13 @@
|
||||
return false;
|
||||
},
|
||||
forceBindingMobileControl() {
|
||||
if (this.registerConfig && this.registerConfig.third_party == 1 && this.registerConfig.bind_mobile == 1)
|
||||
return true;
|
||||
if (this.registerConfig && this.registerConfig.third_party == 1 && this.registerConfig.bind_mobile == 1) return true;
|
||||
else return false;
|
||||
}
|
||||
},
|
||||
wechatConfigStatus() {
|
||||
return this.$store.state.wechatConfigStatus;
|
||||
},
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 获取注册配置
|
||||
@@ -200,8 +199,15 @@
|
||||
}
|
||||
});
|
||||
},
|
||||
open(url) {
|
||||
if (url) this.url = url;
|
||||
open(url,isMiddleIndex = false) {
|
||||
if(!url) url = this.$util.getCurrentRoute().path;
|
||||
this.url = url;
|
||||
|
||||
if(this.url) uni.setStorageSync('initiateLogin',this.url)
|
||||
if(!isMiddleIndex){
|
||||
this.toLogin();
|
||||
return;
|
||||
}
|
||||
// #ifdef MP
|
||||
this.getCode(authData => {
|
||||
this.authLogin(authData, 'authOnlyLogin');
|
||||
@@ -209,7 +215,7 @@
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
if (this.$util.isWeiXin()) {
|
||||
if (this.$util.isWeiXin() && this.wechatConfigStatus) {
|
||||
let authData = uni.getStorageSync('authInfo');
|
||||
if (authData) this.authLogin(authData);
|
||||
else this.getCode();
|
||||
@@ -217,7 +223,6 @@
|
||||
this.toLogin();
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifndef MP || H5
|
||||
this.toLogin();
|
||||
// #endif
|
||||
@@ -440,7 +445,12 @@
|
||||
this.$store.dispatch('getCartNumber');
|
||||
this.$refs.completeInfoPopup.close();
|
||||
this.$store.commit('setBottomNavHidden', false); // 显示底部导航
|
||||
if (res.data.is_register) this.$refs.registerReward.open(this.url);
|
||||
if (res.data.is_register) {
|
||||
this.$store.commit('setCanReceiveRegistergiftInfo',{status: true,path: this.$util.openRegisterRewardPath('/pages/index/index')});
|
||||
this.$util.loginComplete('/pages/index/index','redirectTo');
|
||||
}
|
||||
|
||||
// if (res.data.is_register) this.$refs.registerReward.open(this.url);
|
||||
} else {
|
||||
this.isSub = false;
|
||||
this.getCaptcha();
|
||||
@@ -457,7 +467,6 @@
|
||||
},
|
||||
// 微信小程序获取手机号
|
||||
getPhoneNumber(e) {
|
||||
console.log(e)
|
||||
if (e.detail.errMsg == 'getPhoneNumber:ok') {
|
||||
let authData = uni.getStorageSync('authInfo');
|
||||
if (authData) Object.assign(this.authMobileData, authData, e.detail);
|
||||
@@ -479,7 +488,7 @@
|
||||
});
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: e.detail.errMsg
|
||||
title: '为了保证您账户的统一性,取消授权将无法为您提供服务'
|
||||
})
|
||||
}
|
||||
},
|
||||
@@ -500,7 +509,11 @@
|
||||
this.getMemberInfo();
|
||||
this.$store.dispatch('getCartNumber');
|
||||
this.cancelCompleteInfo();
|
||||
if (res.data.is_register) this.$refs.registerReward.open(this.url);
|
||||
if (res.data.is_register) {
|
||||
this.$store.commit('setCanReceiveRegistergiftInfo',{status: true,path:this.$util.openRegisterRewardPath('/pages/index/index')});
|
||||
this.$util.loginComplete('/pages/index/index','redirectTo');
|
||||
}
|
||||
// if (res.data.is_register) this.$refs.registerReward.open(this.url);
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.message
|
||||
@@ -523,7 +536,6 @@
|
||||
});
|
||||
uni.setStorageSync('authInfo', data);
|
||||
if (uni.getStorageSync('source_member')) data.source_member = uni.getStorageSync('source_member');
|
||||
|
||||
this.$api.sendRequest({
|
||||
url: type == 'authLogin' ? '/api/login/auth' : '/api/login/authonlylogin',
|
||||
data,
|
||||
@@ -532,9 +544,18 @@
|
||||
this.$store.commit('setToken', res.data.token);
|
||||
this.getMemberInfo();
|
||||
this.$store.dispatch('getCartNumber');
|
||||
if (res.data.is_register) this.$refs.registerReward.open(this
|
||||
.url);
|
||||
if (res.data.is_register){
|
||||
this.$store.commit('setCanReceiveRegistergiftInfo',{status: true,path:this.$util.openRegisterRewardPath('/pages/index/index')});
|
||||
this.$util.loginComplete('/pages/index/index','redirectTo');
|
||||
// this.$refs.registerReward.open(this.url);
|
||||
}else{
|
||||
// if(this.url) this.$util.redirectTo(this.url,{},'redirectTo')
|
||||
// else this.$util.redirectTo('/pages/member/index',{},'redirectTo')
|
||||
if(this.url) this.$util.loginComplete(this.url,{},'redirectTo');
|
||||
else this.$util.loginComplete('/pages/member/index/index',{},'redirectTo')
|
||||
}
|
||||
this.cancelCompleteInfo();
|
||||
|
||||
setTimeout(() => {
|
||||
uni.hideLoading();
|
||||
}, 1000);
|
||||
|
||||
25
components/ns-mp-html/ns-mp-html.vue
Normal file
25
components/ns-mp-html/ns-mp-html.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<view class="mp-html">
|
||||
<mp-html :content="content"></mp-html>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
content: {
|
||||
type: String,
|
||||
default: '',
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.mp-html{
|
||||
/deep/ img{
|
||||
width:100% !important;
|
||||
display:block;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<!-- <view class="ns-navbar-wrap" :class="'style-' + data.navStyle">
|
||||
|
||||
<view class="ns-navbar-wrap" :class="'style-' + data.navStyle">
|
||||
<!-- #ifndef MP-ALIPAY -->
|
||||
<view class="u-navbar" :style="{ backgroundColor: bgColor, paddingTop: navbarHeight + 'px' }">
|
||||
<view class="navbar-inner" :style="navbarInnerStyle">
|
||||
<view class="back-wrap" v-if="isBack && isBackShow" @tap="goBack">
|
||||
@@ -8,7 +8,7 @@
|
||||
</view>
|
||||
|
||||
<view v-if="data.navStyle == 1" class="content-wrap" :class="[data.textImgPosLink, isBack && isBackShow ? 'have-back' : '']" @click="toLink(data.moreLink.wap_url)">
|
||||
<view class="title-wrap" :style="{ fontSize: '14px', color: data.textNavColor, textAlign: data.textImgPosLink }">
|
||||
<view class="title-wrap" :style="{ fontSize: '16px', color: data.textNavColor, textAlign: data.textImgPosLink }">
|
||||
{{ data.title }}
|
||||
</view>
|
||||
</view>
|
||||
@@ -43,9 +43,10 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 解决fixed定位后导航栏塌陷的问题 -->
|
||||
<view class="u-navbar-placeholder" :style="{ width: '100%', paddingTop: placeholderHeight + 'px' }"></view>
|
||||
|
||||
</view> -->
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -145,14 +146,14 @@ export default {
|
||||
}
|
||||
},
|
||||
created(e) {
|
||||
// var pages = getCurrentPages();
|
||||
// if (pages.length > 1) {
|
||||
// this.isBackShow = true;
|
||||
// }
|
||||
// this.navbarPlaceholderHeight();
|
||||
var pages = getCurrentPages();
|
||||
if (pages.length > 1) {
|
||||
this.isBackShow = true;
|
||||
}
|
||||
this.navbarPlaceholderHeight();
|
||||
},
|
||||
mounted() {
|
||||
// this.setModuleLocatinoFn();
|
||||
this.setModuleLocationFn();
|
||||
},
|
||||
methods: {
|
||||
toLink(val) {
|
||||
@@ -178,23 +179,18 @@ export default {
|
||||
}
|
||||
},
|
||||
navbarPlaceholderHeight() {
|
||||
let height = 0;
|
||||
setTimeout(() => {
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query
|
||||
.select('.ns-navbar-wrap .u-navbar')
|
||||
.boundingClientRect(data => {
|
||||
query.select('.ns-navbar-wrap .u-navbar').boundingClientRect(data => {
|
||||
// 获取公告自身高度
|
||||
this.placeholderHeight = data.height;
|
||||
})
|
||||
.exec();
|
||||
}).exec();
|
||||
});
|
||||
},
|
||||
// 向vuex中的diyIndexPositionObj增加公告导航组件定位位置
|
||||
setModuleLocatinoFn() {
|
||||
setModuleLocationFn() {
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('.ns-navbar-wrap .u-navbar')
|
||||
.boundingClientRect(data => {
|
||||
query.select('.ns-navbar-wrap .u-navbar').boundingClientRect(data => {
|
||||
let diyIndexPage = {
|
||||
originalVal: data.height || 0, //自身高度 px
|
||||
currVal: 0 //定位高度
|
||||
|
||||
@@ -93,6 +93,7 @@
|
||||
},
|
||||
bgHight: '940rpx !important',
|
||||
bytesCount: null,
|
||||
callback: null
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
@@ -125,7 +126,8 @@
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
init(callback = null) {
|
||||
if (callback) this.callback = callback;
|
||||
this.getHolidayGift();
|
||||
},
|
||||
// 查询节日有礼设置
|
||||
@@ -154,7 +156,9 @@
|
||||
data: {
|
||||
festival_id: this.newgift.festival_id
|
||||
},
|
||||
success: res => {}
|
||||
success: res => {
|
||||
if (this.callback) this.callback();
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
@@ -329,12 +333,8 @@
|
||||
z-index: 500;
|
||||
|
||||
.btn {
|
||||
/* margin: 0 50rpx;
|
||||
background: linear-gradient(90deg,#ff4100,#ff6a00) ;
|
||||
border: none; */
|
||||
color: #fff;
|
||||
font-size: 40rpx;
|
||||
// padding: 100px;
|
||||
border: 4rpx solid #fff;
|
||||
border-radius: 50%;
|
||||
padding: 10rpx;
|
||||
|
||||
933
components/ns-newform/ns-newform.vue
Normal file
933
components/ns-newform/ns-newform.vue
Normal file
@@ -0,0 +1,933 @@
|
||||
<template>
|
||||
<view class="form-wrap form-component">
|
||||
<view v-for="(item, index) in formData" :key="index">
|
||||
<!-- 文本输入框 -->
|
||||
<view v-if="item.controller == 'Text'" class="order-wrap">
|
||||
<view class="order-cell">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box">
|
||||
<input
|
||||
type="text"
|
||||
:placeholder="item.value.placeholder"
|
||||
placeholder-class="placeholder color-tip"
|
||||
v-model="item.val"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 多行文本输入框 -->
|
||||
<view v-if="item.controller == 'Textarea'" class="order-wrap">
|
||||
<view class="order-cell flex-box textarea">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box">
|
||||
<textarea
|
||||
:placeholder="item.value.placeholder"
|
||||
placeholder-class="placeholder color-tip"
|
||||
v-model="item.val"
|
||||
></textarea>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 下拉选择器 -->
|
||||
<view v-if="item.controller == 'Select'" class="order-wrap">
|
||||
<picker
|
||||
mode="selector"
|
||||
:range="item.value.options"
|
||||
@change="pickerChange($event, index)"
|
||||
>
|
||||
<view class="order-cell">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box">
|
||||
<text v-if="item.val != ''">{{ item.val }}</text>
|
||||
<text v-else class="color-tip">请选择</text>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<!-- 复选框 -->
|
||||
<view v-if="item.controller == 'Checkbox'" class="order-wrap">
|
||||
<view class="order-cell">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box check-group-box">
|
||||
<checkbox-group @change="checkboxChange($event, index)">
|
||||
<label v-for="(v, k) in item.option_lists" :key="k">
|
||||
<checkbox :value="v.value" :checked="v.checked"></checkbox>
|
||||
<view class="checkbox">
|
||||
<text
|
||||
:class="[
|
||||
'iconfont',
|
||||
!v.checked ? 'icon-fuxuankuang2' : '',
|
||||
v.checked ? 'icon-fuxuankuang1 color-base-text' : ''
|
||||
]"
|
||||
></text>
|
||||
{{ v.value }}
|
||||
</view>
|
||||
</label>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 单选框 -->
|
||||
<view v-if="item.controller == 'Radio'" class="order-wrap">
|
||||
<view class="order-cell">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box radio-group-box">
|
||||
<radio-group @change="radioChange($event, index)">
|
||||
<label v-for="(v, k) in item.option_lists" :key="k">
|
||||
<radio :value="v.value" :checked="item.val == v.value"></radio>
|
||||
<view class="radio-box">
|
||||
<text
|
||||
:class="[
|
||||
'iconfont',
|
||||
item.val != v.value ? 'icon-yuan_checkbox' : '',
|
||||
item.val == v.value ? 'icon-yuan_checked color-base-text' : ''
|
||||
]"
|
||||
></text>
|
||||
{{ v.value }}
|
||||
</view>
|
||||
</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 图片上传 -->
|
||||
<view v-if="item.controller == 'Img'" class="order-wrap">
|
||||
<view class="order-cell flex-box">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box img-boxs">
|
||||
<view v-for="(v, k) in item.img_lists" :key="k" class="img-box" @tap="uploadImg(index)">
|
||||
<image :src="$util.img(v)" mode="aspectFill"></image>
|
||||
<text class="iconfont icon-guanbi" @tap.stop="delImg(k, index)"></text>
|
||||
</view>
|
||||
<view class="img-box" @tap="addImg(index)">
|
||||
<text class="iconfont icon-add1"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 日期选择器 -->
|
||||
<view v-if="item.controller == 'Date'" class="order-wrap">
|
||||
<view class="order-cell">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box box-flex">
|
||||
<picker
|
||||
mode="date"
|
||||
:value="item.val"
|
||||
@change="bindDateChange($event, index)"
|
||||
>
|
||||
<view :class="['uni-input', !item.val ? 'color-tip' : '']">
|
||||
{{ item.val ? item.val : item.value.placeholder }}
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 日期范围选择器 -->
|
||||
<view v-if="item.controller == 'Datelimit'" class="order-wrap">
|
||||
<view class="order-cell flex-box">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box date-boxs">
|
||||
<view class="date-box">
|
||||
<picker
|
||||
mode="date"
|
||||
:value="item.start_date"
|
||||
@change="bindStartDateChange($event, index)"
|
||||
>
|
||||
<view class="picker-box">
|
||||
<view :class="['uni-input', !item.start_date ? 'color-tip' : '']">
|
||||
{{ item.start_date ? item.start_date : item.value.placeholder_start }}
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<view class="interval iconfont icon-jian"></view>
|
||||
<view class="date-box">
|
||||
<picker
|
||||
mode="date"
|
||||
:value="item.end_date"
|
||||
@change="bindEndDateChange($event, index)"
|
||||
>
|
||||
<view class="picker-box">
|
||||
<view :class="['uni-input', !item.end_date ? 'color-tip' : '']">
|
||||
{{ item.end_date ? item.end_date : item.value.placeholder_end }}
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 时间选择器 -->
|
||||
<view v-if="item.controller == 'Time'" class="order-wrap">
|
||||
<view class="order-cell">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box box-flex">
|
||||
<picker
|
||||
mode="time"
|
||||
:value="item.val"
|
||||
@change="bindTimeChange($event, index)"
|
||||
>
|
||||
<view :class="['uni-input', !item.val ? 'color-tip' : '']">
|
||||
{{ item.val ? item.val : item.value.placeholder }}
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 时间范围选择器 -->
|
||||
<view v-if="item.controller == 'Timelimit'" class="order-wrap">
|
||||
<view class="order-cell flex-box">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box date-boxs">
|
||||
<view class="date-box">
|
||||
<picker
|
||||
mode="time"
|
||||
:value="item.start_time"
|
||||
@change="bindStartTimeChange($event, index)"
|
||||
>
|
||||
<view class="picker-box">
|
||||
<view :class="['uni-input', !item.start_time ? 'color-tip' : '']">
|
||||
{{ item.start_time ? item.start_time : item.value.placeholder_start }}
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<view class="interval iconfont icon-jian"></view>
|
||||
<view class="date-box">
|
||||
<picker
|
||||
mode="time"
|
||||
:value="item.end_time"
|
||||
@change="bindEndTimeChange($event, index)"
|
||||
>
|
||||
<view class="picker-box">
|
||||
<view :class="['uni-input', !item.end_time ? 'color-tip' : '']">
|
||||
{{ item.end_time ? item.end_time : item.value.placeholder_end }}
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 城市选择器 -->
|
||||
<view v-if="item.controller == 'City'" class="order-wrap">
|
||||
<view class="order-cell box-flex">
|
||||
<view class="name">
|
||||
<text class="tit">{{ item.value.title }}</text>
|
||||
<text class="required">{{ item.value.required ? '*' : '' }}</text>
|
||||
</view>
|
||||
<view class="box">
|
||||
<pick-regions
|
||||
:defaultRegions="item.default_regions"
|
||||
:selectArr="item.select_arr"
|
||||
@getRegions="handleGetRegions($event, index)"
|
||||
>
|
||||
<view :class="['select-address', !item.val ? 'empty' : '', !item.val ? 'color-tip' : '']">
|
||||
{{ item.val ? item.val : (item.select_arr == '2' ? '请选择省市' : '请选择省市区/县') }}
|
||||
</view>
|
||||
</pick-regions>
|
||||
</view>
|
||||
<text class="iconfont icon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pickRegions from '@/components/pick-regions/pick-regions.vue'
|
||||
|
||||
export default {
|
||||
name: 'ns-form',
|
||||
components: {
|
||||
pickRegions
|
||||
},
|
||||
props: {
|
||||
data: {
|
||||
type: Array,
|
||||
default: () => ({})
|
||||
},
|
||||
customAttr: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: this.data
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.setFormData();
|
||||
},
|
||||
watch: {
|
||||
data: {
|
||||
handler() {
|
||||
this.setFormData();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setFormData() {
|
||||
this.formData = this.data;
|
||||
this.formData.forEach((item) => {
|
||||
// 初始化默认值
|
||||
if (!item.val) {
|
||||
item.val = item.value.default ? item.value.default : '';
|
||||
}
|
||||
|
||||
// 处理选项列表
|
||||
if (item.value.options) {
|
||||
item.option_lists = [];
|
||||
item.value.options.forEach((option, index) => {
|
||||
let optionItem = {};
|
||||
optionItem.value = option;
|
||||
optionItem.checked = false;
|
||||
|
||||
if (item.controller == 'Radio') {
|
||||
if ((!item.val && index == 0) || (item.val && item.val == option)) {
|
||||
optionItem.checked = true;
|
||||
item.val = option;
|
||||
}
|
||||
}
|
||||
|
||||
if (item.controller == 'Checkbox' && item.val) {
|
||||
let valArray = item.val.split(',');
|
||||
optionItem.checked = valArray.indexOf(option) != -1;
|
||||
}
|
||||
|
||||
item.option_lists.push(optionItem);
|
||||
});
|
||||
}
|
||||
|
||||
// 处理图片列表
|
||||
if (item.controller == 'Img') {
|
||||
item.img_lists = item.val ? item.val.split(',') : [];
|
||||
}
|
||||
|
||||
// 处理日期
|
||||
if (item.controller == 'Date' && !item.val) {
|
||||
if (item.value.is_show_default) {
|
||||
if (item.value.is_current) {
|
||||
item.val = this.getDate();
|
||||
} else {
|
||||
item.val = item.value.default;
|
||||
}
|
||||
} else {
|
||||
item.val = '';
|
||||
}
|
||||
}
|
||||
|
||||
// 处理日期范围
|
||||
if (item.controller == 'Datelimit') {
|
||||
if (item.val) {
|
||||
let dateArray = item.val.split(' - ');
|
||||
item.start_date = dateArray[0];
|
||||
item.end_date = dateArray[1];
|
||||
} else {
|
||||
item.val = '';
|
||||
|
||||
// 开始日期
|
||||
if (item.value.is_show_default_start) {
|
||||
if (item.value.is_current_start) {
|
||||
item.start_date = this.getDate();
|
||||
} else {
|
||||
item.start_date = item.value.default_start;
|
||||
}
|
||||
} else {
|
||||
item.start_date = '';
|
||||
}
|
||||
|
||||
// 结束日期
|
||||
if (item.value.is_show_default_end) {
|
||||
if (item.value.is_current_end) {
|
||||
item.end_date = this.getDate();
|
||||
} else {
|
||||
item.end_date = item.value.default_end;
|
||||
}
|
||||
} else {
|
||||
item.end_date = '';
|
||||
}
|
||||
|
||||
if (item.start_date && item.end_date) {
|
||||
item.val = item.start_date + ' - ' + item.end_date;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 处理时间
|
||||
if (item.controller == 'Time' && !item.val) {
|
||||
if (item.value.is_show_default) {
|
||||
if (item.value.is_current) {
|
||||
item.val = this.getTime();
|
||||
} else {
|
||||
item.val = item.value.default;
|
||||
}
|
||||
} else {
|
||||
item.val = '';
|
||||
}
|
||||
}
|
||||
|
||||
// 处理时间范围
|
||||
if (item.controller == 'Timelimit') {
|
||||
if (item.val) {
|
||||
let timeArray = item.val.split(' - ');
|
||||
item.start_time = timeArray[0];
|
||||
item.end_time = timeArray[1];
|
||||
} else {
|
||||
item.val = '';
|
||||
|
||||
// 开始时间
|
||||
if (item.value.is_show_default_start) {
|
||||
if (item.value.is_current_start) {
|
||||
item.start_time = this.getTime();
|
||||
} else {
|
||||
item.start_time = item.value.default_start;
|
||||
}
|
||||
} else {
|
||||
item.start_time = '';
|
||||
}
|
||||
|
||||
// 结束时间
|
||||
if (item.value.is_show_default_end) {
|
||||
if (item.value.is_current_end) {
|
||||
item.end_time = this.getTime();
|
||||
} else {
|
||||
item.end_time = item.value.default_end;
|
||||
}
|
||||
} else {
|
||||
item.end_time = '';
|
||||
}
|
||||
|
||||
if (item.start_time && item.end_time) {
|
||||
item.val = item.start_time + ' - ' + item.end_time;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 处理城市选择
|
||||
if (item.controller == 'City') {
|
||||
item.full_address = '';
|
||||
item.select_arr = item.value.default_type == 1 ? '2' : '3';
|
||||
if (item.val) {
|
||||
item.default_regions = item.val.split('-');
|
||||
} else {
|
||||
item.default_regions = [];
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 表单验证
|
||||
verify() {
|
||||
for (let i = 0; i < this.formData.length; i++) {
|
||||
let item = this.formData[i];
|
||||
|
||||
// 文本验证
|
||||
if (item.controller == 'Text') {
|
||||
if (item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请输入' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (item.name == 'ID_CARD' && !/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(item.val)) {
|
||||
if (!item.value.required) {
|
||||
this.$util.showToast({ title: '身份证输入不合法' });
|
||||
return false;
|
||||
}
|
||||
if (item.val != '') {
|
||||
this.$util.showToast({ title: '身份证输入不合法' });
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
if (item.name == 'MOBILE' && !this.$util.verifyMobile(item.val)) {
|
||||
if (!item.value.required) {
|
||||
this.$util.showToast({ title: '手机号输入不合法' });
|
||||
return false;
|
||||
}
|
||||
if (item.val != '') {
|
||||
this.$util.showToast({ title: '手机号输入不合法' });
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 多行文本验证
|
||||
if (item.controller == 'Textarea' && item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请输入' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
// 下拉选择验证
|
||||
if (item.controller == 'Select' && item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请选择' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
// 复选框验证
|
||||
if (item.controller == 'Checkbox' && item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请至少选择一个' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
// 图片上传验证
|
||||
if (item.controller == 'Img' && item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请至少上传一张' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
// 日期验证
|
||||
if (item.controller == 'Date' && item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请选择' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
// 日期范围验证
|
||||
if (item.controller == 'Datelimit') {
|
||||
if (item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请选择' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.$util.timeTurnTimeStamp(item.start_date) > this.$util.timeTurnTimeStamp(item.end_date)) {
|
||||
this.$util.showToast({ title: '结束日期不能小于开始日期' });
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// 时间验证
|
||||
if (item.controller == 'Time' && item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请选择' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
// 时间范围验证
|
||||
if (item.controller == 'Timelimit') {
|
||||
if (item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请选择' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (item.start_time >= item.end_time) {
|
||||
this.$util.showToast({ title: '结束时间必须大于开始时间' });
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// 城市选择验证
|
||||
if (item.controller == 'City' && item.value.required && !item.val) {
|
||||
this.$util.showToast({ title: '请选择' + item.value.title });
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
return this.formData;
|
||||
},
|
||||
|
||||
// 下拉选择改变
|
||||
pickerChange(event, index) {
|
||||
this.formData[index].val = this.data[index].value.options[event.detail.value];
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 复选框改变
|
||||
checkboxChange(event, index) {
|
||||
this.formData[index].val = event.detail.value.toString();
|
||||
this.formData[index].option_lists.forEach((option) => {
|
||||
option.checked = event.detail.value.indexOf(option.value) != -1;
|
||||
});
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 单选框改变
|
||||
radioChange(event, index) {
|
||||
this.formData[index].val = event.detail.value;
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 上传图片
|
||||
uploadImg(index) {
|
||||
let self = this;
|
||||
this.$util.upload(Number(this.formData[index].value.max_count), { path: 'evaluateimg' }, function(res) {
|
||||
if (res.length > 0) {
|
||||
res.forEach(function(img) {
|
||||
if (self.formData[index].img_lists.length >= Number(self.formData[index].value.max_count)) {
|
||||
self.$util.showToast({ title: '最多上传' + self.formData[index].value.max_count + '张图片' });
|
||||
return false;
|
||||
}
|
||||
self.formData[index].img_lists.push(img);
|
||||
});
|
||||
self.formData[index].val = self.formData[index].img_lists.toString();
|
||||
self.$forceUpdate();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 添加图片
|
||||
addImg(index) {
|
||||
let self = this;
|
||||
if (this.formData[index].img_lists.length >= Number(this.formData[index].value.max_count)) {
|
||||
this.$util.showToast({ title: '最多上传' + this.formData[index].value.max_count + '张图片' });
|
||||
return false;
|
||||
}
|
||||
|
||||
this.$util.upload(Number(this.formData[index].value.max_count), { path: 'evaluateimg' }, function(res) {
|
||||
if (res.length > 0) {
|
||||
res.forEach(function(img) {
|
||||
self.formData[index].img_lists.push(img);
|
||||
});
|
||||
self.formData[index].val = self.formData[index].img_lists.toString();
|
||||
self.$forceUpdate();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 删除图片
|
||||
delImg(imgIndex, formIndex) {
|
||||
this.formData[formIndex].img_lists.splice(imgIndex, 1);
|
||||
this.formData[formIndex].val = this.formData[formIndex].img_lists.toString();
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 获取当前日期
|
||||
getDate() {
|
||||
let date = new Date();
|
||||
let year = date.getFullYear();
|
||||
let month = date.getMonth() + 1;
|
||||
let day = date.getDate();
|
||||
month = month > 9 ? month : '0' + month;
|
||||
day = day > 9 ? day : '0' + day;
|
||||
return `${year}-${month}-${day}`;
|
||||
},
|
||||
|
||||
// 获取当前时间
|
||||
getTime() {
|
||||
let date = new Date();
|
||||
let hours = date.getHours();
|
||||
let minutes = date.getMinutes();
|
||||
hours = hours > 9 ? hours : '0' + hours;
|
||||
minutes = minutes > 9 ? minutes : '0' + minutes;
|
||||
return `${hours}:${minutes}`;
|
||||
},
|
||||
|
||||
// 日期改变
|
||||
bindDateChange(event, index) {
|
||||
this.formData[index].val = event.detail.value;
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 开始日期改变
|
||||
bindStartDateChange(event, index) {
|
||||
this.$set(this.formData[index], 'start_date', event.detail.value);
|
||||
this.$set(this.formData[index], 'val', this.formData[index].start_date + ' - ' + this.formData[index].end_date);
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 结束日期改变
|
||||
bindEndDateChange(event, index) {
|
||||
this.$set(this.formData[index], 'end_date', event.detail.value);
|
||||
this.$set(this.formData[index], 'val', this.formData[index].start_date + ' - ' + this.formData[index].end_date);
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 时间改变
|
||||
bindTimeChange(event, index) {
|
||||
this.formData[index].val = event.detail.value;
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 开始时间改变
|
||||
bindStartTimeChange(event, index) {
|
||||
this.formData[index].start_time = event.detail.value;
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 结束时间改变
|
||||
bindEndTimeChange(event, index) {
|
||||
this.formData[index].end_time = event.detail.value;
|
||||
this.formData[index].val = this.formData[index].start_time + ' - ' + this.formData[index].end_time;
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 处理地区选择
|
||||
handleGetRegions(regions, index) {
|
||||
this.formData[index].val = '';
|
||||
this.formData[index].val += regions[0] != undefined ? regions[0].label : '';
|
||||
this.formData[index].val += regions[1] != undefined ? '-' + regions[1].label : '';
|
||||
this.formData[index].val += regions[2] != undefined ? '-' + regions[2].label : '';
|
||||
this.$forceUpdate();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.order-wrap {
|
||||
padding: 20rpx 0;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.order-cell {
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
|
||||
&.textarea {
|
||||
align-items: unset;
|
||||
}
|
||||
|
||||
&.clear-flex {
|
||||
display: block;
|
||||
|
||||
.box {
|
||||
margin-top: 16rpx;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
border-bottom: solid 1px #eee;
|
||||
}
|
||||
|
||||
&.align-top {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.name {
|
||||
width: 160rpx;
|
||||
margin-bottom: 10rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
.tit {
|
||||
text-align: left;
|
||||
font-size: 32rpx;
|
||||
color: #888;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.required {
|
||||
color: red;
|
||||
font-size: 28rpx;
|
||||
margin-left: 4rpx;
|
||||
width: 14rpx;
|
||||
text-align: left;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
flex: 1;
|
||||
padding: 0 0rpx;
|
||||
line-height: inherit;
|
||||
text-align: left;
|
||||
|
||||
input {
|
||||
font-size: 28rpx;
|
||||
text-align: left;
|
||||
height: 70rpx;
|
||||
border: solid 2rpx #eee;
|
||||
line-height: 70rpx;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
|
||||
textarea {
|
||||
font-size: 28rpx;
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 44rpx;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
checkbox-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
radio-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 1;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
&.img-boxs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.img-box {
|
||||
margin: 10rpx 20rpx 10rpx 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border: 1rpx solid #eee;
|
||||
border-radius: 4rpx;
|
||||
position: relative;
|
||||
|
||||
.icon-guanbi {
|
||||
position: absolute;
|
||||
top: -14rpx;
|
||||
right: -14rpx;
|
||||
display: inline-block;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
line-height: 28rpx;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.icon-add1 {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.box-flex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
&.date-boxs {
|
||||
padding: 0 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.interval {
|
||||
margin: 0 12rpx;
|
||||
color: #000;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.date-box {
|
||||
.picker-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.radio-group-box {
|
||||
radio {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.radio-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 1;
|
||||
|
||||
.iconfont {
|
||||
font-size: 32rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.check-group-box {
|
||||
checkbox {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 1;
|
||||
|
||||
.iconfont {
|
||||
font-size: 32rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
color: #909399;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.box-flex {
|
||||
picker {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-right {
|
||||
line-height: 1;
|
||||
position: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -183,7 +183,13 @@
|
||||
success: res => {
|
||||
if (res.code >= 0 && res.data) {
|
||||
this.payInfo = res.data;
|
||||
if(this.payInfo['pay_status'] == 2){
|
||||
this.$util.redirectTo('/pages_tool/pay/result', {
|
||||
code: this.payInfo.out_trade_no
|
||||
}, '', 'redirectTo');
|
||||
}else{
|
||||
this.pay();
|
||||
}
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: '未获取到支付信息!'
|
||||
@@ -226,6 +232,7 @@
|
||||
pay() {
|
||||
var payType = this.payTypeList[this.payIndex];
|
||||
if (!payType) return;
|
||||
|
||||
var return_url = '';
|
||||
if (this.payInfo.event == 'BlindboxGoodsOrderPayNotify') {
|
||||
return_url = '/pages_promotion/blindbox/index?outTradeNo=';
|
||||
@@ -378,19 +385,13 @@
|
||||
success: res => {
|
||||
uni.removeStorage({key: 'is_test'})
|
||||
if (this.payInfo.event == 'BlindboxGoodsOrderPayNotify') {
|
||||
this.$util.redirectTo(
|
||||
'/pages_promotion/blindbox/index', {
|
||||
outTradeNo: this
|
||||
.payInfo.out_trade_no
|
||||
}, '',
|
||||
'redirectTo');
|
||||
this.$util.redirectTo('/pages_promotion/blindbox/index', {
|
||||
outTradeNo: this.payInfo.out_trade_no
|
||||
}, '', 'redirectTo');
|
||||
} else {
|
||||
this.$util.redirectTo(
|
||||
'/pages_tool/pay/result', {
|
||||
code: this
|
||||
.payInfo.out_trade_no
|
||||
}, '',
|
||||
'redirectTo');
|
||||
this.$util.redirectTo('/pages_tool/pay/result', {
|
||||
code: this.payInfo.out_trade_no
|
||||
}, '', 'redirectTo');
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
@@ -425,9 +426,15 @@
|
||||
provider: payType.provider,
|
||||
...payData,
|
||||
success: res => {
|
||||
if (this.payInfo.event == 'BlindboxGoodsOrderPayNotify') {
|
||||
this.$util.redirectTo('/pages_promotion/blindbox/index', {
|
||||
outTradeNo: this.payInfo.out_trade_no
|
||||
}, '', 'redirectTo');
|
||||
} else {
|
||||
this.$util.redirectTo('/pages_tool/pay/result', {
|
||||
code: this.payInfo.out_trade_no
|
||||
}, '', 'redirectTo');
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
this.flag = false;
|
||||
@@ -440,10 +447,15 @@
|
||||
});
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (this.payInfo.event == 'BlindboxGoodsOrderPayNotify') {
|
||||
this.$util.redirectTo('/pages_promotion/blindbox/index', {
|
||||
outTradeNo: this.payInfo.out_trade_no
|
||||
}, '', 'redirectTo');
|
||||
} else {
|
||||
this.$util.redirectTo('/pages_tool/pay/result', {
|
||||
code: this.payInfo.out_trade_no
|
||||
},
|
||||
'redirectTo');
|
||||
}, '', 'redirectTo');
|
||||
}
|
||||
}, 2000);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -91,11 +91,11 @@ export default {
|
||||
let obj = this.dayData[this.key];
|
||||
obj.time = this.timeData[this.keys];
|
||||
let time = obj.time.replace('立即配送(','').replace(')','');
|
||||
let dateTime = new Date();
|
||||
|
||||
var dateTime = new Date();
|
||||
var format = time.split('-');
|
||||
var startHours = format[0].split(':');
|
||||
var endHours = format[1].split(':');
|
||||
let format = time.split('-');
|
||||
let startHours = format[0].split(':');
|
||||
let endHours = format[1].split(':');
|
||||
|
||||
let timeData = obj.month.split('月');
|
||||
let month = timeData[0];
|
||||
@@ -119,6 +119,23 @@ export default {
|
||||
this.toTime(judge);
|
||||
let obj = this.dayData[0];
|
||||
obj.time = this.timeData[0];
|
||||
let dateTime = new Date();
|
||||
let format = obj.time.replace('立即配送(','').replace(')','').split('-');
|
||||
let startHours = format[0].split(':');
|
||||
let endHours = format[1].split(':');
|
||||
|
||||
let timeData = obj.month.split('月');
|
||||
let month = timeData[0];
|
||||
let date = timeData[1].split('日')[0];
|
||||
|
||||
// 开始时间戳
|
||||
dateTime.setHours(startHours[0],startHours[1],0,0);
|
||||
obj.start_time = dateTime.getTime()/1000;
|
||||
obj.start_date = dateTime.getFullYear() + '-' + month + '-' + date + ' ' + format[0];
|
||||
// 结束时间戳
|
||||
dateTime.setHours(endHours[0],endHours[1],0,0);
|
||||
obj.end_time = dateTime.getTime()/1000;
|
||||
obj.end_date = dateTime.getFullYear() + '-' + month + '-' + date + ' ' + format[1];
|
||||
this.$emit('selectTime', { data: obj, type: judge });
|
||||
}
|
||||
this.$forceUpdate();
|
||||
@@ -165,6 +182,7 @@ export default {
|
||||
}
|
||||
//判断当天是否能够配送、自提
|
||||
if (type == 0 || judge || obj.indexOf(nowDay.toString()) != -1) {
|
||||
|
||||
let endTime = this.obj.dataTime.delivery_time[ (this.obj.dataTime.delivery_time.length - 1) ].end_time;
|
||||
endTime -= this.obj.dataTime.time_interval * 60;
|
||||
switch (num) {
|
||||
@@ -227,7 +245,6 @@ export default {
|
||||
this.judge = true;
|
||||
}
|
||||
}
|
||||
|
||||
this.toTime(); //处理右侧时间数据
|
||||
},
|
||||
/**
|
||||
|
||||
@@ -15,19 +15,21 @@
|
||||
<view class="payment-item" v-if="balanceDeduct > 0 && balanceUsable && balanceConfig == 1">
|
||||
<view class="iconfont icon-yue"></view>
|
||||
<view class="info-wrap">
|
||||
<text class="name">余额支付</text>
|
||||
<text class="name">余额抵扣</text>
|
||||
<view class="money">可用¥{{ balanceDeduct|moneyFormat }}</view>
|
||||
</view>
|
||||
<ns-switch class="balance-switch" @change="useBalance" :checked="isBalance == 1"></ns-switch>
|
||||
</view>
|
||||
<block v-if="payMoney > 0">
|
||||
<block v-if="payTypeList.length">
|
||||
<view class="payment-item" v-for="(item, index) in payTypeList" :key="index" @click="payIndex = index">
|
||||
<block v-for="(item, index) in payTypeList">
|
||||
<view v-if="offlineShow||item.type!='offlinepay'" class="payment-item" :key="index" @click="payIndex = index">
|
||||
<view class="iconfont" :class="item.icon"></view>
|
||||
<text class="name">{{ item.name }}</text>
|
||||
<text class="iconfont" :class="payIndex == index ? 'icon-yuan_checked color-base-text' : 'icon-checkboxblank'"></text>
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view class="empty">平台尚未配置支付方式!</view>
|
||||
</block>
|
||||
@@ -63,47 +65,44 @@
|
||||
balanceUsable: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
payIndex: 0,
|
||||
// #ifdef H5
|
||||
payTypeList: [{
|
||||
payTypeList: [
|
||||
// #ifdef H5 || MP-ALIPAY
|
||||
{
|
||||
name: '支付宝支付',
|
||||
icon: 'icon-zhifubaozhifu-',
|
||||
type: 'alipay'
|
||||
},
|
||||
// #endif
|
||||
// #ifdef H5 || MP-WEIXIN
|
||||
{
|
||||
name: '微信支付',
|
||||
icon: 'icon-weixin1',
|
||||
type: 'wechatpay'
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
{
|
||||
name: '线下支付',
|
||||
icon: 'icondiy icon-yuezhifu',
|
||||
type: 'offlinepay'
|
||||
},
|
||||
],
|
||||
// #ifdef H5
|
||||
timer: null,
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
payTypeList: [{
|
||||
name: '微信支付',
|
||||
provider: 'wxpay',
|
||||
icon: 'icon-weixin1',
|
||||
type: 'wechatpay'
|
||||
}],
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
payTypeList: [{
|
||||
name: '支付宝支付',
|
||||
icon: 'icon-zhifubaozhifu-',
|
||||
type: 'alipay',
|
||||
provider: 'alipay'
|
||||
}],
|
||||
// #endif
|
||||
payInfo: null,
|
||||
balanceConfig: 0,
|
||||
// 预售页面判断
|
||||
sale: true,
|
||||
isBalance: 0,
|
||||
balance: 0
|
||||
balance: 0,
|
||||
//重置是否已完成,没有完成不能调用api/pay/pay
|
||||
resetPayComplete:true,
|
||||
repeatFlag:false,
|
||||
};
|
||||
},
|
||||
created(e) {
|
||||
@@ -127,9 +126,32 @@
|
||||
}
|
||||
}
|
||||
return money;
|
||||
},
|
||||
offlineShow(){
|
||||
// 获取当前页面栈实例数组
|
||||
const pages = getCurrentPages();
|
||||
const currentPage = pages[pages.length - 1];
|
||||
// 获取页面路由路径
|
||||
let routePath = currentPage.route;
|
||||
return this.$store.state.offlineWhiteList.length?this.$store.state.offlineWhiteList.includes(routePath):false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 父级页面onShow调用
|
||||
*/
|
||||
pageShow() {
|
||||
if(this.payInfo){
|
||||
let offlinepay = uni.getStorageSync('offlinepay');
|
||||
if(offlinepay){
|
||||
uni.removeStorageSync('offlinepay');
|
||||
this.close()
|
||||
}
|
||||
}else{
|
||||
uni.removeStorageSync('offlinepay');
|
||||
}
|
||||
|
||||
},
|
||||
close() {
|
||||
this.$emit('close');
|
||||
this.$refs.choosePaymentPopup.close();
|
||||
@@ -146,14 +168,22 @@
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(this.resetPayComplete == false){
|
||||
this.$util.showToast({
|
||||
title: '支付取消中,请稍后再试!'
|
||||
});
|
||||
return;
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '支付中...',
|
||||
mask: true
|
||||
});
|
||||
if(this.repeatFlag) return;
|
||||
this.repeatFlag = true;
|
||||
this.pay();
|
||||
uni.setStorageSync('pay_flag', 1);
|
||||
},
|
||||
getPayInfo(out_trade_no) {
|
||||
getPayInfo(out_trade_no, callback) {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/pay/info',
|
||||
data: {
|
||||
@@ -165,6 +195,7 @@
|
||||
if (this.balanceConfig && this.balanceUsable) this.getMemberBalance();
|
||||
setTimeout(() => {
|
||||
this.$refs.choosePaymentPopup.open();
|
||||
if(typeof callback == 'function') callback();
|
||||
})
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
@@ -178,7 +209,6 @@
|
||||
* 获取余额配置
|
||||
*/
|
||||
getBalanceConfig() {
|
||||
|
||||
this.$api.sendRequest({
|
||||
url: '/api/pay/getBalanceConfig',
|
||||
data: {},
|
||||
@@ -196,10 +226,6 @@
|
||||
success: res => {
|
||||
if (res.code == 0 && res.data) {
|
||||
this.balance = parseFloat(res.data.usable_balance);
|
||||
//余额不足以抵扣整个订单时不显示
|
||||
if(parseFloat(this.payMoney) > this.balance){
|
||||
this.balanceConfig = 0
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -215,10 +241,8 @@
|
||||
if (res.data.pay_type == '') {
|
||||
this.payTypeList = [];
|
||||
} else {
|
||||
this.payTypeList.forEach((val, key) => {
|
||||
if (res.data.pay_type.indexOf(val.type) == -1) {
|
||||
this.payTypeList.splice(key, 1);
|
||||
}
|
||||
this.payTypeList = this.payTypeList.filter((val, key) => {
|
||||
return res.data.pay_type.indexOf(val.type) != -1
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -239,8 +263,7 @@
|
||||
data: {
|
||||
out_trade_no: this.payInfo.out_trade_no,
|
||||
pay_type: payType ? payType.type : '',
|
||||
return_url: encodeURIComponent(this.$config.h5Domain + return_url + this.payInfo
|
||||
.out_trade_no),
|
||||
return_url: encodeURIComponent(this.$config.h5Domain + return_url + this.payInfo.out_trade_no),
|
||||
is_balance: this.isBalance
|
||||
},
|
||||
success: res => {
|
||||
@@ -258,7 +281,9 @@
|
||||
wx_alipay: wx_alipay,
|
||||
out_trade_no: this.payInfo.out_trade_no
|
||||
}, '', 'redirectTo');
|
||||
this.repeatFlag = false;
|
||||
} else {
|
||||
this.repeatFlag = false;
|
||||
location.href = res.data.data;
|
||||
this.checkPayStatus();
|
||||
}
|
||||
@@ -290,12 +315,14 @@
|
||||
res => {
|
||||
if (res.errMsg == 'chooseWXPay:ok') {
|
||||
this.paySuccess();
|
||||
this.repeatFlag = false;
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.errMsg
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.close();
|
||||
this.repeatFlag = false;
|
||||
}, 1500)
|
||||
}
|
||||
},
|
||||
@@ -304,20 +331,30 @@
|
||||
title: '您已取消支付'
|
||||
});
|
||||
this.resetpay();
|
||||
this.repeatFlag = false;
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.repeatFlag = false;
|
||||
location.href = res.data.url;
|
||||
this.checkPayStatus();
|
||||
}
|
||||
break;
|
||||
case 'offlinepay':
|
||||
this.$util.redirectTo('/pages_tool/pay/offlinepay', {
|
||||
outTradeNo: this.payInfo.out_trade_no
|
||||
});
|
||||
this.repeatFlag = false;
|
||||
break;
|
||||
|
||||
}
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.message
|
||||
});
|
||||
this.repeatFlag = false;
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
@@ -325,6 +362,7 @@
|
||||
this.$util.showToast({
|
||||
title: 'request:fail'
|
||||
});
|
||||
this.repeatFlag = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
@@ -365,8 +403,15 @@
|
||||
if (res.code >= 0) {
|
||||
if (res.data.pay_success) {
|
||||
this.paySuccess();
|
||||
this.repeatFlag = false;
|
||||
return;
|
||||
}
|
||||
if (payType.type=='offlinepay') {
|
||||
this.$util.redirectTo('/pages_tool/pay/offlinepay', {
|
||||
outTradeNo: this.payInfo.out_trade_no
|
||||
});
|
||||
this.repeatFlag = false;
|
||||
}else{
|
||||
var payData = res.data.data;
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
@@ -380,6 +425,7 @@
|
||||
paySign: payData.paySign,
|
||||
success: res => {
|
||||
this.paySuccess();
|
||||
this.repeatFlag = false;
|
||||
},
|
||||
fail: res => {
|
||||
this.flag = false;
|
||||
@@ -388,6 +434,7 @@
|
||||
title: '您已取消支付'
|
||||
});
|
||||
this.resetpay();
|
||||
this.repeatFlag = false;
|
||||
} else {
|
||||
uni.showModal({
|
||||
content: '支付失败,失败原因: ' + res.errMsg,
|
||||
@@ -395,6 +442,7 @@
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.close();
|
||||
this.repeatFlag = false;
|
||||
}, 1500)
|
||||
}
|
||||
}
|
||||
@@ -408,6 +456,7 @@
|
||||
...payData,
|
||||
success: res => {
|
||||
this.paySuccess();
|
||||
this.repeatFlag = false;
|
||||
},
|
||||
fail: res => {
|
||||
this.flag = false;
|
||||
@@ -416,6 +465,7 @@
|
||||
title: '您已取消支付'
|
||||
});
|
||||
this.resetpay();
|
||||
this.repeatFlag = false;
|
||||
} else {
|
||||
uni.showModal({
|
||||
content: '支付失败,失败原因: ' + res.errMsg,
|
||||
@@ -423,14 +473,17 @@
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.close();
|
||||
this.repeatFlag = false;
|
||||
}, 1500)
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.message
|
||||
});
|
||||
this.repeatFlag = false;
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
@@ -438,6 +491,7 @@
|
||||
this.$util.showToast({
|
||||
title: 'request:fail'
|
||||
});
|
||||
this.repeatFlag = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
@@ -463,13 +517,23 @@
|
||||
* 重置支付单据
|
||||
*/
|
||||
resetpay() {
|
||||
this.resetPayComplete = false;
|
||||
this.$api.sendRequest({
|
||||
url: '/api/pay/resetpay',
|
||||
data: {
|
||||
out_trade_no: this.payInfo.out_trade_no,
|
||||
},
|
||||
success: res => {
|
||||
if (res.code == 0) this.getPayInfo(res.data);
|
||||
if (res.code == 0) {
|
||||
this.getPayInfo(res.data, ()=>{
|
||||
this.resetPayComplete = true;
|
||||
});
|
||||
}else{
|
||||
this.resetPayComplete = true;
|
||||
}
|
||||
},
|
||||
fail:res =>{
|
||||
this.resetPayComplete = true;
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -569,7 +633,9 @@
|
||||
.icon-weixin1 {
|
||||
color: #24af41;
|
||||
}
|
||||
|
||||
.icon-yuezhifu{
|
||||
color: #f9a647;
|
||||
}
|
||||
.icon-zhifubaozhifu- {
|
||||
color: #00a0e9;
|
||||
}
|
||||
|
||||
@@ -124,15 +124,10 @@ export default {
|
||||
setTimeout(() => {
|
||||
//消失
|
||||
// #ifndef APP-NVUE
|
||||
this.animationData = uni
|
||||
.createAnimation({
|
||||
this.animationData = uni.createAnimation({
|
||||
duration: this.duration / 2,
|
||||
timingFunction: 'ease'
|
||||
})
|
||||
.top(this.top - this.radius * 2)
|
||||
.opacity(0)
|
||||
.step()
|
||||
.export();
|
||||
}).top(this.top - this.radius * 2).opacity(0).step().export();
|
||||
|
||||
// #endif
|
||||
|
||||
@@ -155,15 +150,10 @@ export default {
|
||||
// console.log('this.radius', this.radius);
|
||||
|
||||
setTimeout(() => {
|
||||
this.animationData = uni
|
||||
.createAnimation({
|
||||
this.animationData = uni.createAnimation({
|
||||
duration: this.duration / 2,
|
||||
timingFunction: 'ease'
|
||||
})
|
||||
.top(this.top)
|
||||
.opacity(0)
|
||||
.step()
|
||||
.export();
|
||||
}).top(this.top).opacity(0).step().export();
|
||||
}, 2800);
|
||||
},
|
||||
closeTimer() {
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view>
|
||||
<view @touchmove.prevent.stop class="reward-popup" v-if="reward">
|
||||
<uni-popup ref="registerReward" type="center" :maskClick="false">
|
||||
<uni-popup ref="registerRewardpopup" type="center" :maskClick="false">
|
||||
<view class="reward-wrap">
|
||||
<image :src="$util.img('public/uniapp/register_reward/register_reward_img.png')" mode="widthFix" class="bg-img-head"/>
|
||||
<image :src="$util.img('public/uniapp/register_reward/register_reward_money.png')" mode="widthFix" class="bg-img-money"/>
|
||||
@@ -89,10 +89,34 @@
|
||||
data() {
|
||||
return {
|
||||
reward: null,
|
||||
back: ''
|
||||
back: '',
|
||||
path: '',
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
created() {
|
||||
let pages = getCurrentPages();
|
||||
let currentPage = pages[pages.length - 1].route;
|
||||
this.path = '/'+currentPage;
|
||||
|
||||
},
|
||||
watch: {
|
||||
'canReceiveRegistergift': {
|
||||
handler(newValue, oldValue) {
|
||||
if (newValue.status && newValue.status != oldValue.status && newValue.path.split('?')[0] == this.path) {
|
||||
this.$store.commit('setCanReceiveRegistergiftInfo',{status:false,path:''});
|
||||
// this.$nextTick(()=>{
|
||||
this.open()
|
||||
// })
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
canReceiveRegistergift() {
|
||||
return this.$store.state.canReceiveRegistergiftInfo;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
open(back) {
|
||||
if (back) this.back = back;
|
||||
@@ -103,7 +127,7 @@
|
||||
}
|
||||
},
|
||||
cancel() {
|
||||
this.$refs.registerReward.close();
|
||||
this.$refs.registerRewardpopup.close();
|
||||
},
|
||||
/**
|
||||
* 获取新人礼配置
|
||||
@@ -114,20 +138,27 @@
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
let data = res.data;
|
||||
if (data.is_use == 1 && (data.value.point > 0 || data.value.balance > 0 || data
|
||||
.value.growth > 0 || data.value.coupon_list.length > 0)) {
|
||||
if (data.is_use == 1 && (data.value.point > 0 || data.value.balance > 0 || data.value.growth > 0 || data.value.coupon_list.length > 0)) {
|
||||
this.reward = data.value;
|
||||
this.$forceUpdate()
|
||||
this.$nextTick(()=>{
|
||||
if(this.$refs.registerReward) this.$refs.registerReward.open();
|
||||
setTimeout(() => {
|
||||
this.$refs.registerRewardpopup.open();
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
} else {
|
||||
this.closeRewardPopup();
|
||||
}
|
||||
}else{
|
||||
this.closeRewardPopup();
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
closeRewardPopup(type) {
|
||||
if (this.$refs.registerReward) this.$refs.registerReward.close();
|
||||
if (this.$refs.registerRewardpopup) this.$refs.registerRewardpopup.close();
|
||||
if(!type) return;
|
||||
switch (type) {
|
||||
case 'point':
|
||||
this.$util.redirectTo('/pages_tool/member/point_detail', {});
|
||||
@@ -142,8 +173,9 @@
|
||||
this.$util.redirectTo('/pages_tool/member/coupon', {});
|
||||
break;
|
||||
default:
|
||||
if (this.back) this.$util.redirectTo(decodeURIComponent(this.back), {}, 'redirectTo');
|
||||
else this.$util.redirectTo('/pages/index/index');
|
||||
this.$util.loginComplete('/pages/index/index','redirectTo');
|
||||
// if (this.back) this.$util.redirectTo(decodeURIComponent(this.back), {}, 'redirectTo');
|
||||
// else this.$util.redirectTo('/pages/index/index');
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -67,11 +67,7 @@ export default {
|
||||
this.$emit('change', e);
|
||||
},
|
||||
_getSize(fn) {
|
||||
uni.createSelectorQuery()
|
||||
.in(this)
|
||||
.select(`#${this.elId}`)
|
||||
.boundingClientRect()
|
||||
.exec(ret => {
|
||||
uni.createSelectorQuery().in(this).select(`#${this.elId}`).boundingClientRect().exec(ret => {
|
||||
if (!ret[0]) {
|
||||
setTimeout(this._getSize(fn));
|
||||
return;
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -112,6 +112,7 @@
|
||||
}
|
||||
|
||||
this.inputValue = value / scale;
|
||||
this.$emit('change', this.inputValue);
|
||||
},
|
||||
_getDecimalScale() {
|
||||
let scale = 1;
|
||||
@@ -147,6 +148,7 @@
|
||||
|
||||
this.inputValue = value;
|
||||
this.$forceUpdate();
|
||||
this.$emit('change', value);
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -33,7 +33,6 @@
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// maskClick
|
||||
maskClick: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
|
||||
@@ -38,22 +38,22 @@ export default {
|
||||
disabled: {
|
||||
// 是否为禁用状态
|
||||
type: [String, Boolean],
|
||||
defalut: false
|
||||
default: false
|
||||
},
|
||||
inverted: {
|
||||
// 是否为空心
|
||||
type: [String, Boolean],
|
||||
defalut: false
|
||||
default: false
|
||||
},
|
||||
circle: {
|
||||
// 是否为圆角样式
|
||||
type: [String, Boolean],
|
||||
defalut: false
|
||||
default: false
|
||||
},
|
||||
mark: {
|
||||
// 是否为标记样式
|
||||
type: [String, Boolean],
|
||||
defalut: false
|
||||
default: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
218
components/uv-count-to/uv-count-to.vue
Normal file
218
components/uv-count-to/uv-count-to.vue
Normal file
@@ -0,0 +1,218 @@
|
||||
<template>
|
||||
<text
|
||||
class="uv-count-num"
|
||||
:style="textStyle"
|
||||
>
|
||||
{{ displayValue }}
|
||||
</text>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'uv-count-to',
|
||||
props: {
|
||||
startVal: {
|
||||
type: [String, Number],
|
||||
default: 0
|
||||
},
|
||||
endVal: {
|
||||
type: [String, Number],
|
||||
default: 0
|
||||
},
|
||||
duration: {
|
||||
type: [String, Number],
|
||||
default: 2000
|
||||
},
|
||||
autoplay: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
decimals: {
|
||||
type: [String, Number],
|
||||
default: 0
|
||||
},
|
||||
useEasing: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
decimal: {
|
||||
type: [String, Number],
|
||||
default: '.'
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: '#606266'
|
||||
},
|
||||
fontSize: {
|
||||
type: [String, Number],
|
||||
default: 22
|
||||
},
|
||||
bold: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
separator: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
localStartVal: this.startVal,
|
||||
displayValue: this.formatNumber(this.startVal),
|
||||
printVal: null,
|
||||
paused: false,
|
||||
localDuration: Number(this.duration),
|
||||
startTime: null,
|
||||
timestamp: null,
|
||||
remaining: null,
|
||||
rAF: null,
|
||||
lastTime: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
countDown() {
|
||||
return this.startVal > this.endVal
|
||||
},
|
||||
textStyle() {
|
||||
return {
|
||||
fontSize: this.fontSize + 'px',
|
||||
fontWeight: this.bold ? 'bold' : 'normal',
|
||||
color: this.color
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
startVal() {
|
||||
if (this.autoplay) {
|
||||
this.start()
|
||||
}
|
||||
},
|
||||
endVal() {
|
||||
console.log(123)
|
||||
if (this.autoplay) {
|
||||
this.start()
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if (this.autoplay) {
|
||||
this.start()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
easingFn(t, b, c, d) {
|
||||
return c * (1 - Math.pow(2, -10 * t / d)) * 1024 / 1023 + b
|
||||
},
|
||||
requestAnimationFrame(callback) {
|
||||
const currTime = new Date().getTime()
|
||||
const timeToCall = Math.max(0, 16 - (currTime - this.lastTime))
|
||||
const id = setTimeout(() => {
|
||||
callback(currTime + timeToCall)
|
||||
}, timeToCall)
|
||||
this.lastTime = currTime + timeToCall
|
||||
return id
|
||||
},
|
||||
cancelAnimationFrame(id) {
|
||||
clearTimeout(id)
|
||||
},
|
||||
start() {
|
||||
this.localStartVal = this.startVal
|
||||
this.startTime = null
|
||||
this.localDuration = this.duration
|
||||
this.paused = false
|
||||
this.rAF = this.requestAnimationFrame(this.count)
|
||||
},
|
||||
restart() {
|
||||
if (this.paused) {
|
||||
this.resume()
|
||||
this.paused = false
|
||||
} else {
|
||||
this.stop()
|
||||
this.paused = true
|
||||
}
|
||||
},
|
||||
stop() {
|
||||
this.cancelAnimationFrame(this.rAF)
|
||||
this.paused = true
|
||||
},
|
||||
resume() {
|
||||
if (this.remaining) {
|
||||
this.startTime = 0
|
||||
this.localDuration = this.remaining
|
||||
this.localStartVal = this.printVal
|
||||
this.requestAnimationFrame(this.count)
|
||||
}
|
||||
},
|
||||
reset() {
|
||||
this.startTime = null
|
||||
this.cancelAnimationFrame(this.rAF)
|
||||
this.displayValue = this.formatNumber(this.startVal)
|
||||
},
|
||||
count(timestamp) {
|
||||
if (!this.startTime) this.startTime = timestamp
|
||||
this.timestamp = timestamp
|
||||
const progress = timestamp - this.startTime
|
||||
this.remaining = this.localDuration - progress
|
||||
|
||||
if (this.useEasing) {
|
||||
if (this.countDown) {
|
||||
this.printVal = this.localStartVal - this.easingFn(progress, 0, this.localStartVal - this.endVal, this.localDuration)
|
||||
} else {
|
||||
this.printVal = this.easingFn(progress, this.localStartVal, this.endVal - this.localStartVal, this.localDuration)
|
||||
}
|
||||
} else {
|
||||
if (this.countDown) {
|
||||
this.printVal = this.localStartVal - (this.localStartVal - this.endVal) * (progress / this.localDuration)
|
||||
} else {
|
||||
this.printVal = this.localStartVal + (this.endVal - this.localStartVal) * (progress / this.localDuration)
|
||||
}
|
||||
}
|
||||
|
||||
if (this.countDown) {
|
||||
this.printVal = this.printVal < this.endVal ? this.endVal : this.printVal
|
||||
} else {
|
||||
this.printVal = this.printVal > this.endVal ? this.endVal : this.printVal
|
||||
}
|
||||
|
||||
this.displayValue = this.formatNumber(this.printVal) || 0
|
||||
|
||||
if (progress < this.localDuration) {
|
||||
this.rAF = this.requestAnimationFrame(this.count)
|
||||
} else {
|
||||
this.$emit('end')
|
||||
}
|
||||
},
|
||||
isNumber(val) {
|
||||
return !isNaN(parseFloat(val))
|
||||
},
|
||||
formatNumber(num) {
|
||||
num = Number(num)
|
||||
num = num.toFixed(Number(this.decimals))
|
||||
num += ''
|
||||
const x = num.split('.')
|
||||
let x1 = x[0]
|
||||
const x2 = x.length > 1 ? this.decimal + x[1] : ''
|
||||
const rgx = /(\d+)(\d{3})/
|
||||
|
||||
if (this.separator && !this.isNumber(this.separator)) {
|
||||
while (rgx.test(x1)) {
|
||||
x1 = x1.replace(rgx, '$1' + this.separator + '$2')
|
||||
}
|
||||
}
|
||||
|
||||
return x1 + x2
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
this.cancelAnimationFrame(this.rAF)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.uv-count-num {
|
||||
display: inline-flex;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
66
components/wxwork-contact/CHANGELOG.md
Normal file
66
components/wxwork-contact/CHANGELOG.md
Normal file
@@ -0,0 +1,66 @@
|
||||
# 企业微信联系客服组件更新日志
|
||||
|
||||
## v2.0.0 - 集成全局Store配置
|
||||
|
||||
### 新增功能
|
||||
- ✅ 企业微信配置集成到全局Store
|
||||
- ✅ 从 `/api/config/init` 统一获取配置
|
||||
- ✅ 支持props覆盖全局配置
|
||||
- ✅ 优化配置获取逻辑
|
||||
|
||||
### 变更内容
|
||||
1. **Store集成**:
|
||||
- 在 `store/index.js` 中添加 `wxworkConfig` 状态
|
||||
- 添加 `setWxworkConfig` mutation
|
||||
- 在 `init` action 中从 `/api/config/init` 获取企业微信配置
|
||||
|
||||
2. **组件优化**:
|
||||
- `wxwork-contact.vue` 组件现在优先从全局Store获取配置
|
||||
- 支持通过props覆盖全局配置
|
||||
- 移除单独的API调用,使用统一配置
|
||||
|
||||
3. **页面集成**:
|
||||
- `pages/contact/contact.vue` 页面简化配置获取逻辑
|
||||
- 直接使用全局Store中的企业微信配置
|
||||
|
||||
### 配置格式
|
||||
后端 `/api/config/init` 需要返回以下格式的企业微信配置:
|
||||
|
||||
```json
|
||||
{
|
||||
"code": 0,
|
||||
"data": {
|
||||
// ... 其他配置 ...
|
||||
"wxwork": {
|
||||
"corp_id": "企业ID",
|
||||
"agent_id": "应用ID",
|
||||
"contact_id": "客服ID",
|
||||
"contact_url": "活码链接",
|
||||
"timestamp": "时间戳",
|
||||
"nonceStr": "随机字符串",
|
||||
"signature": "签名",
|
||||
"enabled": true
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 使用方式
|
||||
```vue
|
||||
<!-- 使用全局配置 -->
|
||||
<wxwork-contact btn-text="联系企业客服"></wxwork-contact>
|
||||
|
||||
<!-- 覆盖全局配置 -->
|
||||
<wxwork-contact
|
||||
:corp-id="customCorpId"
|
||||
:contact-url="customContactUrl"
|
||||
btn-text="自定义客服"></wxwork-contact>
|
||||
```
|
||||
|
||||
## v1.0.0 - 初始版本
|
||||
|
||||
### 功能
|
||||
- 企业微信JS-SDK封装
|
||||
- 基础联系客服组件
|
||||
- 支持小程序和H5环境
|
||||
- 活码跳转和SDK两种方式
|
||||
484
components/wxwork-contact/README.md
Normal file
484
components/wxwork-contact/README.md
Normal file
@@ -0,0 +1,484 @@
|
||||
# 企业微信联系客服组件
|
||||
|
||||
## 功能说明
|
||||
|
||||
这个组件实现了在小程序中点击"联系客服"后,自动跳转到企业微信添加对应销售的功能。
|
||||
|
||||
## 关键前提条件
|
||||
|
||||
### ⚠️ 重要提醒
|
||||
微信小程序与企业微信互通有严格的平台限制和权限要求,使用前请确保满足以下所有条件:
|
||||
|
||||
### 1. 微信小程序环境要求
|
||||
- **平台限制**:功能仅在微信小程序环境中可用
|
||||
- **基础库版本**:需要微信小程序基础库 2.3.0 及以上版本
|
||||
- **用户环境**:用户需要在微信中打开小程序
|
||||
|
||||
### 2. 企业微信配置要求
|
||||
- **企业认证**:企业微信账号必须完成企业认证
|
||||
- **客户联系功能**:需要开通企业微信"客户联系"功能
|
||||
- **应用权限**:企业微信应用需要有客户联系相关权限
|
||||
|
||||
### 3. 互通配置要求
|
||||
- **关联配置**:小程序必须与企业微信进行关联配置
|
||||
- **权限申请**:需要在微信开放平台和企业微信后台分别申请相应权限
|
||||
- **域名白名单**:相关域名需要在小程序和企业微信后台都配置白名单
|
||||
|
||||
### 4. 跳转权限要求
|
||||
- **小程序AppID**:需要在企业微信中配置允许跳转的小程序AppID
|
||||
- **企业微信AppID**:需要在微信开放平台配置关联的企业微信AppID
|
||||
- **业务域授权**:需要配置业务域授权,允许跨平台跳转
|
||||
|
||||
### 5. 开发调试要求
|
||||
- **测试环境**:需要在测试环境中验证跳转功能
|
||||
- **权限验证**:确保所有必要的API权限已申请并生效
|
||||
- **兼容性测试**:在不同微信版本中进行兼容性测试
|
||||
|
||||
### 6. 具体配置要求
|
||||
|
||||
| 条件 | 说明 |
|
||||
|------|------|
|
||||
| **小程序与企业微信绑定** | 在企业微信管理后台 → 「应用管理」→「小程序」中关联你的微信小程序AppID |
|
||||
| **配置可信域名** | 如果涉及网页跳转或回调,需在企业微信后台配置业务域名 |
|
||||
| **使用企业微信服务商 or 自建应用** | 若需高级功能(如获取客户详情),需有企业微信管理员权限或通过服务商代开发 |
|
||||
|
||||
## 使用方法
|
||||
|
||||
### 1. 基础用法
|
||||
|
||||
```vue
|
||||
<wxwork-contact
|
||||
:corp-id="corpId"
|
||||
:agent-id="agentId"
|
||||
:timestamp="timestamp"
|
||||
:nonce-str="nonceStr"
|
||||
:signature="signature"
|
||||
:contact-id="contactId"
|
||||
:contact-url="contactUrl"
|
||||
btn-text="添加企业微信客服">
|
||||
</wxwork-contact>
|
||||
```
|
||||
|
||||
### 组件架构
|
||||
|
||||
### 分层设计
|
||||
```
|
||||
调用方 (页面组件)
|
||||
↓ 传递配置参数
|
||||
wxwork-contact 组件
|
||||
↓ 调用SDK
|
||||
wxwork-jssdk.js
|
||||
↓ 调用企业微信API
|
||||
企业微信服务
|
||||
```
|
||||
|
||||
### 组件设计原则
|
||||
|
||||
- **独立性**:组件不直接依赖全局Store,所有配置通过props传递
|
||||
- **职责分离**:组件只负责UI展示和企业微信SDK调用,配置管理由调用方负责
|
||||
- **灵活配置**:支持调用者覆盖任何配置参数
|
||||
|
||||
## 版本信息
|
||||
|
||||
### v3.0.0 - 统一客服服务重构版本
|
||||
- 创建 `CustomerService` 统一客服处理服务
|
||||
- 重构 `ns-contact.vue` 和 `hover-nav.vue` 消除重复代码
|
||||
- 提供统一的客服处理接口和平台适配
|
||||
- 完善错误处理和降级机制
|
||||
- 支持所有客服类型的统一调用
|
||||
|
||||
### v2.0.0 - Store集成版本
|
||||
- 企业微信配置集成到全局Store
|
||||
- 从 `/api/config/init` 统一获取配置
|
||||
- 组件完全独立,通过props接收配置
|
||||
- 支持全局配置和局部覆盖
|
||||
|
||||
### v1.0.0 - 初始版本
|
||||
- 基础企业微信联系功能
|
||||
- 支持活码跳转和JS-SDK两种方式
|
||||
|
||||
### 2. 属性说明
|
||||
|
||||
| 属性 | 类型 | 默认值 | 说明 |
|
||||
|------|------|--------|------|
|
||||
| btnText | String | '添加企业微信客服' | 按钮文字 |
|
||||
| corpId | String | - | 企业ID(必需) |
|
||||
| agentId | String | '' | 应用ID |
|
||||
| timestamp | String | '' | 时间戳 |
|
||||
| nonceStr | String | '' | 随机字符串 |
|
||||
| signature | String | '' | 签名 |
|
||||
| contactId | String | '' | 客服ID或活码配置ID |
|
||||
| contactUrl | String | '' | 活码链接 |
|
||||
| showConfirm | Boolean | true | 是否显示确认弹窗 |
|
||||
|
||||
### 3. 在联系页面中使用
|
||||
|
||||
在 `pages/contact/contact.vue` 中已集成使用示例:
|
||||
|
||||
```vue
|
||||
<wxwork-contact
|
||||
v-if="wxworkConfig && wxworkConfig.enabled"
|
||||
:corp-id="wxworkConfig.corpId"
|
||||
:agent-id="wxworkConfig.agentId"
|
||||
:timestamp="wxworkConfig.timestamp"
|
||||
:nonce-str="wxworkConfig.nonceStr"
|
||||
:signature="wxworkConfig.signature"
|
||||
:contact-id="wxworkConfig.contactId"
|
||||
:contact-url="wxworkConfig.contactUrl"
|
||||
btn-text="企业微信客服"
|
||||
:show-confirm="false">
|
||||
</wxwork-contact>
|
||||
```
|
||||
|
||||
## 配置说明
|
||||
|
||||
### 后端接口需求
|
||||
|
||||
企业微信配置已集成到 `/api/config/init` 接口中,返回以下格式的数据:
|
||||
|
||||
```json
|
||||
{
|
||||
"code": 0,
|
||||
"data": {
|
||||
// ... 其他配置 ...
|
||||
"wxwork": {
|
||||
"corp_id": "企业ID",
|
||||
"agent_id": "应用ID",
|
||||
"contact_id": "客服ID",
|
||||
"contact_url": "活码链接",
|
||||
"timestamp": "时间戳",
|
||||
"nonceStr": "随机字符串",
|
||||
"signature": "签名",
|
||||
"enabled": true
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 全局Store集成
|
||||
|
||||
企业微信配置通过以下方式集成到全局状态管理:
|
||||
|
||||
1. **Store状态**:在 `store/index.js` 中添加 `wxworkConfig` 状态
|
||||
2. **配置获取**:在 `init` action 中从 `/api/config/init` 获取企业微信配置
|
||||
3. **状态更新**:使用 `setWxworkConfig` mutation 更新配置
|
||||
4. **持久化**:配置自动保存到本地存储
|
||||
|
||||
### 企业微信配置步骤
|
||||
|
||||
1. **获取企业微信活码**:
|
||||
- 登录企业微信管理后台
|
||||
- 进入"客户联系" -> "配置" -> "联系我"
|
||||
- 创建活码,获取配置ID或直接获取活码链接
|
||||
|
||||
2. **配置参数**:
|
||||
- `corp_id`: 企业ID(在企业微信后台获取)
|
||||
- `agent_id`: 企业微信应用ID
|
||||
- `contact_id`: 客服的用户ID
|
||||
- `contact_url`: 企业微信活码链接(推荐使用活码链接)
|
||||
- `timestamp`: 生成签名的时间戳
|
||||
- `nonceStr`: 生成签名的随机字符串
|
||||
- `signature`: JS-SDK签名
|
||||
|
||||
## 典型业务流程示例
|
||||
|
||||
### 目标
|
||||
用户在小程序中点击"联系客服",自动添加对应的企业微信销售。
|
||||
|
||||
### 步骤
|
||||
1. **后端调用企业微信 API** 创建「联系我」二维码(可带场景值,如 user_id=123)。
|
||||
2. **前端在小程序中展示该二维码(或生成跳转链接)**。
|
||||
3. **用户长按识别 → 打开企业微信 → 添加客服**。
|
||||
4. **企业微信收到添加事件 → 通过 API 获取 external_userid → 关联到原小程序用户**。
|
||||
|
||||
## 实现原理
|
||||
|
||||
### 方案1:企业微信活码跳转(推荐)
|
||||
- 使用企业微信活码链接
|
||||
- 通过 `uni.navigateToMiniProgram` 跳转到企业微信小程序
|
||||
- 直接添加对应的销售为联系人
|
||||
|
||||
### 方案2:JS-SDK方式
|
||||
- 使用企业微信JS-SDK
|
||||
- 调用 `openUserProfile` 接口打开用户资料
|
||||
- 用户手动添加联系人
|
||||
|
||||
## 注意事项
|
||||
|
||||
### 功能限制
|
||||
1. **小程序环境**:需要在微信小程序环境中使用
|
||||
2. **权限配置**:确保小程序有跳转企业微信的权限
|
||||
3. **降级处理**:当企业微信不可用时,会降级到原有客服方式
|
||||
4. **用户体验**:建议添加确认弹窗,避免误操作
|
||||
|
||||
### 前提条件验证
|
||||
5. **权限检查**:使用前需要验证所有必需权限是否生效
|
||||
6. **配置完整性**:确保所有配置参数都已正确设置
|
||||
7. **网络环境**:确保用户网络环境允许访问企业微信服务
|
||||
8. **版本兼容**:检查微信版本和企业微信版本兼容性
|
||||
|
||||
### 调试建议
|
||||
9. **错误监控**:添加适当的错误日志和用户反馈机制
|
||||
10. **性能优化**:避免频繁的SDK初始化和配置获取
|
||||
11. **安全考虑**:敏感配置信息应在服务端处理,前端不暴露
|
||||
|
||||
## 兼容性
|
||||
|
||||
- 微信小程序:✅ 支持
|
||||
- H5环境:✅ 支持跳转活码链接
|
||||
- 其他平台:降级处理
|
||||
|
||||
## 文件结构
|
||||
|
||||
```
|
||||
components/wxwork-contact/
|
||||
├── wxwork-contact.vue # 主组件
|
||||
└── README.md # 说明文档
|
||||
|
||||
components/ns-contact/
|
||||
└── ns-contact.vue # 统一客服组件(重构后)
|
||||
|
||||
components/hover-nav/
|
||||
└── hover-nav.vue # 悬浮导航组件(重构后)
|
||||
|
||||
common/js/
|
||||
├── wxwork-jssdk.js # 企业微信JS-SDK封装
|
||||
└── customer-service.js # 客服统一处理服务(新增)
|
||||
|
||||
store/
|
||||
└── index.js # 全局Store,包含wxworkConfig状态管理
|
||||
|
||||
pages/contact/
|
||||
└── contact.vue # 联系页面,集成企业微信功能
|
||||
```
|
||||
|
||||
## 系统梳理与优化 (v3.1.0)
|
||||
|
||||
### 🔧 已修复的问题
|
||||
|
||||
#### 1. **App.vue 配置恢复**
|
||||
- ✅ 修复了企业微信配置 (`wxworkConfig`) 在应用启动时的恢复
|
||||
- ✅ 确保所有配置都能正确从本地存储恢复到Store
|
||||
|
||||
#### 2. **客服服务参数传递**
|
||||
- ✅ 修复了 `openCustomerServiceChat` 参数传递错误
|
||||
- ✅ 正确传递 `sendMessageTitle`、`sendMessagePath`、`sendMessageImg`
|
||||
|
||||
#### 3. **组件配置访问**
|
||||
- ✅ 在 `ns-contact.vue` 和 `hover-nav.vue` 中添加 computed 属性
|
||||
- ✅ 确保能够正确访问 `servicerConfig`
|
||||
|
||||
#### 4. **企业微信服务优化**
|
||||
- ✅ 改进参数传递,支持自定义消息参数
|
||||
- ✅ 统一处理函数调用方式
|
||||
|
||||
### 🛡️ 新增功能
|
||||
|
||||
#### 1. **配置验证机制**
|
||||
```javascript
|
||||
const validation = this.customerService.validateConfig();
|
||||
if (!validation.isValid) {
|
||||
// 处理配置错误
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. **错误处理增强**
|
||||
- ✅ 添加配置错误弹窗
|
||||
- ✅ 改进错误日志记录
|
||||
- ✅ 警告信息提示
|
||||
|
||||
#### 3. **类型安全**
|
||||
- ✅ 完善参数类型检查
|
||||
- ✅ 空值和异常情况处理
|
||||
|
||||
### 📋 当前系统状态
|
||||
|
||||
| 组件 | 状态 | 功能完整性 |
|
||||
|------|------|-----------|
|
||||
| **customer-service.js** | ✅ 完成 | 统一客服处理服务 |
|
||||
| **ns-contact.vue** | ✅ 修复 | 支持所有客服类型 |
|
||||
| **hover-nav.vue** | ✅ 修复 | 集成统一客服服务 |
|
||||
| **App.vue** | ✅ 修复 | 配置完整恢复 |
|
||||
| **contact.vue** | ⚠️ 待优化 | 仍使用原始方式 |
|
||||
|
||||
### 🔄 待优化项
|
||||
|
||||
#### 1. **contact.vue 页面重构**
|
||||
- 建议集成统一客服服务
|
||||
- 添加企业微信客服按钮
|
||||
- 统一UI交互体验
|
||||
|
||||
#### 2. **加载状态反馈**
|
||||
- 客服功能调用时的loading状态
|
||||
- 网络请求的进度指示
|
||||
|
||||
#### 3. **用户体验优化**
|
||||
- 客服按钮的点击反馈
|
||||
- 错误状态的友好提示
|
||||
|
||||
### 🧪 测试建议
|
||||
|
||||
1. **配置验证测试**:
|
||||
- 测试各种配置缺失情况
|
||||
- 验证错误提示准确性
|
||||
|
||||
2. **平台兼容测试**:
|
||||
- 微信小程序客服功能
|
||||
- H5环境跳转
|
||||
- 支付宝小程序客服
|
||||
|
||||
3. **企业微信功能测试**:
|
||||
- 活码链接跳转
|
||||
- 降级处理机制
|
||||
- 参数传递正确性
|
||||
|
||||
### 📖 使用最佳实践
|
||||
|
||||
```javascript
|
||||
// 推荐使用方式
|
||||
const customerService = createCustomerService(this);
|
||||
|
||||
// 带配置验证的调用
|
||||
if (customerService.isConfigAvailable()) {
|
||||
customerService.handleCustomerClick({
|
||||
sendMessageTitle: '商品咨询',
|
||||
sendMessagePath: '/pages/goods/detail',
|
||||
sendMessageImg: 'product-image.jpg'
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
## 重构说明 (v3.0.0)
|
||||
|
||||
### 统一客服处理服务
|
||||
|
||||
为了解决代码重复问题,我们创建了 `CustomerService` 类来统一处理所有客服逻辑:
|
||||
|
||||
#### 主要改进
|
||||
1. **代码复用**:消除 `ns-contact.vue` 和 `hover-nav.vue` 中的重复代码
|
||||
2. **统一接口**:提供一致的客服处理API
|
||||
3. **平台适配**:自动处理不同平台的客服配置
|
||||
4. **类型安全**:完善的错误处理和降级机制
|
||||
|
||||
#### 使用方式
|
||||
|
||||
**1. 在组件中导入**
|
||||
```javascript
|
||||
import { createCustomerService } from '@/common/js/customer-service.js';
|
||||
```
|
||||
|
||||
**2. 初始化服务**
|
||||
```javascript
|
||||
created() {
|
||||
this.customerService = createCustomerService(this);
|
||||
this.buttonConfig = this.customerService.getButtonConfig();
|
||||
}
|
||||
```
|
||||
|
||||
**3. 处理客服点击**
|
||||
```javascript
|
||||
methods: {
|
||||
contactServicer() {
|
||||
this.customerService.handleCustomerClick({
|
||||
niushop: this.niushop,
|
||||
sendMessageTitle: this.sendMessageTitle,
|
||||
sendMessagePath: this.sendMessagePath,
|
||||
sendMessageImg: this.sendMessageImg
|
||||
});
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 核心方法
|
||||
|
||||
| 方法名 | 用途 | 参数 |
|
||||
|--------|------|------|
|
||||
| `handleCustomerClick(options)` | 统一处理客服点击 | 客服配置选项 |
|
||||
| `getButtonConfig()` | 获取按钮配置 | - |
|
||||
| `getServiceType()` | 获取客服类型 | - |
|
||||
| `openWxworkService()` | 打开企业微信客服 | 是否使用原方式 |
|
||||
|
||||
#### 支持的客服类型
|
||||
|
||||
- `wxwork` - 企业微信客服
|
||||
- `third` - 第三方客服
|
||||
- `niushop` - 牛商客服
|
||||
- `weapp` - 微信小程序客服
|
||||
- `aliapp` - 支付宝小程序客服
|
||||
- `none` - 无客服(显示提示)
|
||||
|
||||
## 常见问题 (FAQ)
|
||||
|
||||
### Q: contact_id 是小程序ID吗?
|
||||
A: 不是的。`contact_id` 是**企业微信中客服人员的用户ID**,具体说明如下:
|
||||
|
||||
- **定义**:企业微信系统内部分配给客服人员的唯一标识符
|
||||
- **获取方式**:通过企业微信管理后台的"客户联系" → "配置" → "联系我"功能创建活码时获得
|
||||
- **用途**:用于指定具体客服人员,当用户点击"联系客服"时,系统通过这个ID知道应该添加哪个企业微信客服人员
|
||||
|
||||
### Q: contact_id 和小程序ID的区别?
|
||||
A: 两者的作用完全不同:
|
||||
|
||||
| 字段 | 用途 | 获取方式 |
|
||||
|------|------|----------|
|
||||
| **contact_id** | 指定具体的企业微信客服人员 | 企业微信管理后台获取 |
|
||||
| **小程序AppID** | 识别整个微信小程序应用 | 微信开放平台获取 |
|
||||
|
||||
在业务流程中:
|
||||
1. 用户在小程序中点击"联系客服"
|
||||
2. 系统使用 `contact_id` 打开对应的企业微信客服人员资料
|
||||
3. 用户添加该企业微信客服为联系人
|
||||
|
||||
所以 `contact_id` 是企业微信客服的ID,不是小程序的ID。
|
||||
|
||||
### Q: wxwork_contact_url 从哪里来?
|
||||
A: `wxwork_contact_url` 应该来自全局Store中的 `wxworkConfig`,而不是 `servicerConfig`:
|
||||
|
||||
**正确的配置来源**:
|
||||
- ✅ `this.$store.state.wxworkConfig.contact_url` - 企业微信配置
|
||||
- ❌ `this.config.wxwork_contact_url` - 错误的配置路径
|
||||
|
||||
**配置获取流程**:
|
||||
1. **后端接口**:`/api/config/init` 返回 `wxwork_config` 数据
|
||||
2. **Store存储**:`setWxworkConfig` 将配置保存到 `wxworkConfig` 状态
|
||||
3. **组件使用**:通过 `this.$store.state.wxworkConfig.contact_url` 访问
|
||||
|
||||
**代码修正示例**:
|
||||
```javascript
|
||||
// 错误 ❌
|
||||
if (this.config.wxwork_contact_url) { ... }
|
||||
|
||||
// 正确 ✅
|
||||
const wxworkConfig = this.$store.state?.wxworkConfig;
|
||||
if (wxworkConfig?.contact_url) { ... }
|
||||
```
|
||||
|
||||
**字段对应关系**:
|
||||
| 后端字段 | Store字段 | 组件使用 |
|
||||
|---------|----------|----------|
|
||||
| `contact_url` | `contact_url` | `wxworkConfig.contact_url` |
|
||||
|
||||
### Q: navigateToMiniProgram 中的企业微信小程序AppID 是指我的业务小程序ID吗?
|
||||
A: 不是的!`appId: 'wxeb490c6f9b154ef9'` 是**企业微信官方小程序的AppID**,不是你的业务小程序ID。
|
||||
|
||||
**两者的区别**:
|
||||
|
||||
| 小程序类型 | AppID示例 | 用途 | 所有者 |
|
||||
|-----------|----------|------|--------|
|
||||
| **企业微信官方小程序** | `wxeb490c6f9b154ef9` | 展示企业联系人详情页面 | 腾讯企业微信团队 |
|
||||
| **你的业务小程序** | 你的AppID | 你的业务功能(电商、服务等) | 你的企业/组织 |
|
||||
|
||||
**业务流程**:
|
||||
```
|
||||
用户小程序 (你的业务)
|
||||
↓ 点击"联系客服"
|
||||
navigateToMiniProgram 跳转到
|
||||
企业微信官方小程序 (wxeb490c6f9b154ef9)
|
||||
↓ 展示联系人详情
|
||||
用户添加客服人员到企业微信
|
||||
```
|
||||
|
||||
**关键点**:
|
||||
- 这个AppID是企业微信官方小程序,通常是固定值
|
||||
- 用于跳转到企业微信环境展示联系人详情
|
||||
- 不需要替换成你自己的小程序AppID |
|
||||
301
components/wxwork-contact/wxwork-contact.vue
Normal file
301
components/wxwork-contact/wxwork-contact.vue
Normal file
@@ -0,0 +1,301 @@
|
||||
<template>
|
||||
<view class="wxwork-contact-wrap">
|
||||
<slot></slot>
|
||||
<button
|
||||
type="default"
|
||||
hover-class="none"
|
||||
class="contact-button"
|
||||
@click="addWxWorkContact">
|
||||
<text class="btn-text">{{ btnText }}</text>
|
||||
</button>
|
||||
|
||||
<!-- 确认弹窗 -->
|
||||
<uni-popup ref="confirmPopup" type="center">
|
||||
<view class="confirm-popup">
|
||||
<view class="popup-header">
|
||||
<text>添加企业微信客服</text>
|
||||
</view>
|
||||
<view class="popup-body">
|
||||
<text>点击确定后将跳转至企业微信,添加专业客服为您服务</text>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="cancel-btn" @click="closePopup">取消</button>
|
||||
<button class="confirm-btn" @click="confirmAdd">确定</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { WxWork } from '@/common/js/wxwork-jssdk.js';
|
||||
|
||||
export default {
|
||||
name: 'wxwork-contact',
|
||||
props: {
|
||||
// 按钮文字
|
||||
btnText: {
|
||||
type: String,
|
||||
default: '添加企业微信客服'
|
||||
},
|
||||
// 企业ID(必需)
|
||||
corpId: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
// 应用ID
|
||||
agentId: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 时间戳
|
||||
timestamp: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 随机字符串
|
||||
nonceStr: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 签名
|
||||
signature: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 客服ID或活码配置ID
|
||||
contactId: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 活码链接
|
||||
contactUrl: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 是否显示确认弹窗
|
||||
showConfirm: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
wxWorkSDK: null
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.initWxWork();
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 初始化企业微信SDK
|
||||
*/
|
||||
initWxWork() {
|
||||
try {
|
||||
if (this.corpId) {
|
||||
this.wxWorkSDK = new WxWork();
|
||||
const initResult = this.wxWorkSDK.init({
|
||||
corpId: this.corpId,
|
||||
agentId: this.agentId,
|
||||
timestamp: this.timestamp,
|
||||
nonceStr: this.nonceStr,
|
||||
signature: this.signature,
|
||||
jsApiList: ['openUserProfile', 'openEnterpriseChat']
|
||||
});
|
||||
|
||||
if (!initResult) {
|
||||
console.error('企业微信SDK初始化失败');
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('初始化企业微信SDK失败:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 点击添加企业微信客服
|
||||
*/
|
||||
addWxWorkContact() {
|
||||
if (this.showConfirm) {
|
||||
this.$refs.confirmPopup.open();
|
||||
} else {
|
||||
this.confirmAdd();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 确认添加
|
||||
*/
|
||||
confirmAdd() {
|
||||
this.closePopup();
|
||||
|
||||
// 直接使用props传递的配置
|
||||
const contactUrl = this.contactUrl;
|
||||
const contactId = this.contactId;
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
if (contactUrl) {
|
||||
// 方案1:直接跳转到企业微信活码
|
||||
this.jumpToWxWorkContact(contactUrl);
|
||||
} else if (contactId) {
|
||||
// 方案2:使用SDK打开用户资料
|
||||
this.openUserProfile(contactId);
|
||||
} else {
|
||||
this.showError('未配置企业微信客服信息');
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
if (contactUrl) {
|
||||
// H5环境直接跳转
|
||||
window.location.href = contactUrl;
|
||||
} else {
|
||||
this.showError('未配置企业微信客服信息');
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到企业微信客服
|
||||
*/
|
||||
jumpToWxWorkContact(contactUrl) {
|
||||
uni.navigateToMiniProgram({
|
||||
appId: 'wxeb490c6f9b154ef9', // 企业微信小程序AppID
|
||||
path: `pages/contacts/externalContactDetail?url=${encodeURIComponent(contactUrl)}`,
|
||||
success: () => {
|
||||
console.log('跳转企业微信成功');
|
||||
this.$util.showToast({
|
||||
title: '跳转成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('跳转企业微信失败:', err);
|
||||
this.showError('跳转失败,请检查企业微信配置');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 打开用户资料
|
||||
*/
|
||||
openUserProfile(contactId) {
|
||||
if (!this.wxWorkSDK) {
|
||||
this.showError('企业微信SDK未初始化');
|
||||
return;
|
||||
}
|
||||
|
||||
this.wxWorkSDK.addContact({
|
||||
userId: contactId
|
||||
}, (res) => {
|
||||
console.log('打开用户资料成功:', res);
|
||||
}, (err) => {
|
||||
console.error('打开用户资料失败:', err);
|
||||
this.showError('打开用户资料失败');
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 显示错误提示
|
||||
*/
|
||||
showError(message) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: message,
|
||||
showCancel: false
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 关闭弹窗
|
||||
*/
|
||||
closePopup() {
|
||||
this.$refs.confirmPopup.close();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.wxwork-contact-wrap {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
.contact-button {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(135deg, #1e7dd8 0%, #1482e0 100%);
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.btn-text {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.confirm-popup {
|
||||
width: 600rpx;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.popup-header {
|
||||
padding: 40rpx 30rpx 20rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.popup-body {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.popup-footer {
|
||||
display: flex;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
|
||||
button {
|
||||
flex: 1;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
|
||||
&.cancel-btn {
|
||||
background: #fff;
|
||||
color: #999;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
&.confirm-btn {
|
||||
background: #1e7dd8;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
4
lang/zh-cn/ai/ai-chat.js
Normal file
4
lang/zh-cn/ai/ai-chat.js
Normal file
@@ -0,0 +1,4 @@
|
||||
export const lang = {
|
||||
//title为每个页面的标题
|
||||
title: 'AI智能客服'
|
||||
}
|
||||
@@ -9,6 +9,8 @@ export const lang = {
|
||||
telephonePlaceholder: '收货人固定电话(选填)',
|
||||
receivingCity: '地区',
|
||||
address: '详细地址',
|
||||
house:'门牌号',
|
||||
housePlaceholder:'请输入楼层门牌号',
|
||||
addressPlaceholder: '小区、街道、写字楼',
|
||||
save: '保存'
|
||||
}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
export const lang = {
|
||||
//title为每个页面的标题
|
||||
title: '会员中心',
|
||||
login: '登录/注册',
|
||||
login: '立即登录',
|
||||
loginTpis: '点击登录 享受更多精彩信息',
|
||||
memberLevel: '会员等级',
|
||||
moreAuthority: '更多权限',
|
||||
|
||||
@@ -9,5 +9,6 @@ export const lang = {
|
||||
waitEvaluate: '待评价',
|
||||
waitUse: '待使用',
|
||||
update: "释放刷新",
|
||||
updateIng: "加载中..."
|
||||
updateIng: "加载中...",
|
||||
toLogin: "去登录"
|
||||
}
|
||||
|
||||
5
main.js
5
main.js
@@ -38,12 +38,15 @@ Vue.mixin(globalConfig);
|
||||
App.mpType = 'app';
|
||||
|
||||
// 重写存储,增加前缀
|
||||
uniStorage();
|
||||
Util.rewriteUniStorageMethod();
|
||||
|
||||
//常用组件
|
||||
import loadingCover from '@/components/loading-cover/loading-cover.vue';
|
||||
Vue.component('loading-cover', loadingCover);
|
||||
|
||||
import nsMpHtml from '@/components/ns-mp-html/ns-mp-html.vue';
|
||||
Vue.component('ns-mp-html', nsMpHtml);
|
||||
|
||||
import nsEmpty from '@/components/ns-empty/ns-empty.vue';
|
||||
Vue.component('ns-empty', nsEmpty);
|
||||
|
||||
|
||||
@@ -63,7 +63,9 @@
|
||||
"urlCheck" : false,
|
||||
"postcss" : false,
|
||||
"es6" : true,
|
||||
"minified" : true
|
||||
"minified" : true,
|
||||
"codeSigning" : true,
|
||||
"uglifyFileName" : true
|
||||
},
|
||||
"usingComponents" : true,
|
||||
"permission" : {
|
||||
@@ -108,7 +110,7 @@
|
||||
},
|
||||
"optimization" : {
|
||||
"treeShaking" : {
|
||||
"enable" : false
|
||||
"enable" : true
|
||||
}
|
||||
},
|
||||
"domain" : " ",
|
||||
|
||||
229
pages.json
229
pages.json
@@ -3,7 +3,7 @@
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
// "navigationStyle": "custom",
|
||||
"navigationStyle": "custom",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
@@ -28,15 +28,17 @@
|
||||
"path": "pages/goods/category",
|
||||
"style": {
|
||||
"disableScroll": true,
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "商品分类",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
|
||||
// 商品详情
|
||||
// 商品详情、限时折扣、预售
|
||||
{
|
||||
"path": "pages/goods/detail",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "商品详情"
|
||||
}
|
||||
},
|
||||
@@ -54,6 +56,7 @@
|
||||
{
|
||||
"path": "pages/member/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
@@ -106,11 +109,61 @@
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [{
|
||||
"subPackages": [
|
||||
{
|
||||
|
||||
//******************营销活动模块(26)******************
|
||||
"root": "pages_promotion",
|
||||
"pages": [
|
||||
//----------组合套餐模块(2)----------
|
||||
{
|
||||
"path": "bundling/detail",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "bundling/payment",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
//----------砍价模块(5)----------
|
||||
{
|
||||
"path": "bargain/list",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "bargain/detail",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"path": "bargain/my_bargain",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "bargain/payment",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
|
||||
//----------积分模块(2)----------
|
||||
{
|
||||
@@ -709,11 +762,21 @@
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
//******************聊天(4)******************
|
||||
{
|
||||
"path": "chat/room",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"softinputMode": "adjustResize"
|
||||
}
|
||||
},
|
||||
//******************支付模块(2)******************
|
||||
{
|
||||
"path": "pay/index",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -721,7 +784,7 @@
|
||||
{
|
||||
"path": "pay/wx_pay",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -729,7 +792,7 @@
|
||||
{
|
||||
"path": "pay/result",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -737,7 +800,15 @@
|
||||
{
|
||||
"path": "pay/cashier",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pay/offlinepay",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -745,7 +816,7 @@
|
||||
{
|
||||
"path": "storeclose/storeclose",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -754,7 +825,7 @@
|
||||
{
|
||||
"path": "order/logistics",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -762,7 +833,7 @@
|
||||
{
|
||||
"path": "order/evaluate",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -770,7 +841,7 @@
|
||||
{
|
||||
"path": "order/refund",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -778,7 +849,7 @@
|
||||
{
|
||||
"path": "order/refund_goods_select",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -786,7 +857,7 @@
|
||||
{
|
||||
"path": "order/refund_type_select",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -794,7 +865,7 @@
|
||||
{
|
||||
"path": "order/refund_batch",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -802,7 +873,7 @@
|
||||
{
|
||||
"path": "order/refund_detail",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
@@ -810,37 +881,136 @@
|
||||
{
|
||||
"path": "order/activist",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "退款"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/detail_virtual",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
//******************登录模块(3)******************
|
||||
{
|
||||
"path": "login/login",
|
||||
"path": "login/index",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "login/aggrement",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "协议"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "login/login",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "login/register",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "注册"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "form/form",
|
||||
"style": {
|
||||
// #ifdef APP-PLUS
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "store/list",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "门店列表"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "store/detail",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "门店详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "store/store_payment",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "门店付款"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "store/payment_qrcode",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "付款码"
|
||||
}
|
||||
},
|
||||
//******************核销模块(4)******************
|
||||
{
|
||||
"path": "verification/index",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "核销台"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "verification/list",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "核销列表"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "verification/detail",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "核销详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "weapp/order_shipping",
|
||||
"style": {
|
||||
// #ifdef H5
|
||||
"navigationStyle": "custom",
|
||||
// #endif
|
||||
"navigationBarTitleText": "小程序发货"
|
||||
}
|
||||
},
|
||||
//******************AI客服******************
|
||||
{
|
||||
"path": "ai-chat/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -861,7 +1031,8 @@
|
||||
"selectedColor": "#FF0036",
|
||||
"backgroundColor": "#fff",
|
||||
"borderStyle": "white",
|
||||
"list": [{
|
||||
"list": [
|
||||
{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": ""
|
||||
},
|
||||
@@ -870,7 +1041,7 @@
|
||||
"text": ""
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/contact/contact",
|
||||
"pagePath": "pages/goods/cart",
|
||||
"text": ""
|
||||
},
|
||||
{
|
||||
|
||||
20
pages/dify-chat/dify-chat.vue
Normal file
20
pages/dify-chat/dify-chat.vue
Normal file
@@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<web-view src="https://dify.aigc-quickapp.com/chatbot/ILbr8HHEgpBW2ggp"></web-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
onLoad() {
|
||||
console.log('Dify 聊天页已加载')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
}
|
||||
</style>
|
||||
@@ -14,13 +14,13 @@
|
||||
<view class="dite-button" @click="officialAccountsOpen">关注公众号</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="page-header" v-if="diyData.global && diyData.global.navBarSwitch" :style="{ backgroundImage: bgImg }">
|
||||
<view class="page-header" v-if="diyData.global && diyData.global.navBarSwitch" :style="{ backgroundImage: bgImg }">
|
||||
<ns-navbar :title-color="textNavColor" :data="diyData.global" :scrollTop="scrollTop" :isBack="false"/>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<diy-index-page v-if="topIndexValue" ref="indexPage" :value="topIndexValue" :bgUrl="bgUrl" :scrollTop="scrollTop" :diyGlobal="diyData.global" class="diy-index-page">
|
||||
<template v-slot:components>
|
||||
<diy-group ref="diyGroup" v-if="diyData.value" :diyData="diyData" :scrollTop="scrollTop" :haveTopCategory="true" :followOfficialAccount="followOfficialAccount"/>
|
||||
<diy-group ref="diyGroup" v-if="diyData.value" :refresh="refresh" :diyData="diyData" :scrollTop="scrollTop" :haveTopCategory="true" :followOfficialAccount="followOfficialAccount"/>
|
||||
</template>
|
||||
<template v-slot:default>
|
||||
<ns-copyright v-show="isShowCopyRight"/>
|
||||
@@ -94,26 +94,27 @@
|
||||
<!-- 选择门店弹出框,定位当前位置,展示最近的一个门店 -->
|
||||
<view @touchmove.prevent.stop class="choose-store">
|
||||
<uni-popup ref="chooseStorePopup" type="center" :maskClick="false" class="choose-store">
|
||||
<view class="choose-store-popup">
|
||||
<view class="head-wrap" @click="closeChooseStorePopup">请确认门店</view>
|
||||
<view class="choose-store-popup" v-if="currentStore">
|
||||
<view class="head-wrap">请确认门店</view>
|
||||
<view class="position-wrap">
|
||||
<text class="iconfont icon-dizhi"></text>
|
||||
<text class="address">{{ currentPosition }}</text>
|
||||
<view class="reposition" @click="reposition" v-if="globalStoreConfig && globalStoreConfig.is_allow_change == 1">
|
||||
<text class="address">{{ currentPosition || currentStore.show_address }}</text>
|
||||
<view class="reposition" @click="reGetLocation" v-if="globalStoreConfig && globalStoreConfig.is_allow_change == 1">
|
||||
<text class="iconfont icon-dingwei"></text>
|
||||
<text>重新定位</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="store-wrap" v-if="nearestStore">
|
||||
<view class="store-wrap" v-if="currentStore">
|
||||
<text class="tag">当前门店</text>
|
||||
<view class="store-name">{{ nearestStore.store_name }}</view>
|
||||
<view class="address">{{ nearestStore.show_address }}</view>
|
||||
<view class="distance" v-if="nearestStore.distance">
|
||||
<view class="store-name">{{ currentStore.store_name }}</view>
|
||||
<view class="store-close-desc" v-if="currentStore.status == 0 && currentStore.close_desc">{{ currentStore.close_desc }}</view>
|
||||
<view class="address">{{ currentStore.show_address }}</view>
|
||||
<view class="distance" v-if="currentStore.distance">
|
||||
<text class="iconfont icon-dizhi"></text>
|
||||
<text>{{ nearestStore.distance > 1 ? nearestStore.distance + 'km' : nearestStore.distance * 1000 + 'm' }}</text>
|
||||
<text>{{ currentStore.distance > 1 ? currentStore.distance + 'km' : currentStore.distance * 1000 + 'm' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<button type="primary" @click="enterStore">确认进入</button>
|
||||
<button type="primary" @click="closeChooseStorePopup">确认进入</button>
|
||||
<view class="other-store" @click="chooseOtherStore" v-if="globalStoreConfig && globalStoreConfig.is_allow_change == 1">
|
||||
<text>选择其他门店</text>
|
||||
<text class="iconfont icon-right"></text>
|
||||
@@ -121,7 +122,29 @@
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
<hover-nav></hover-nav>
|
||||
<!-- 连锁门店未开启定位或定位失败弹框 -->
|
||||
<view @touchmove.prevent.stop class="chain-stores">
|
||||
<uni-popup ref="getLocationFailRef" type="bottom" :maskClick="false" class="choose-store">
|
||||
<view class="chain-store-popup">
|
||||
<view class="title">获取位置失败</view>
|
||||
<view class="body">
|
||||
<view class="center">
|
||||
<view class="image">
|
||||
<image width="341rpx" :src="$util.img('public/uniapp/index/no_location_tips.png')" mode="aspectFit"/>
|
||||
</view>
|
||||
<view class="text-top">系统暂时定位不到您的位置</view>
|
||||
<view class="text-bottom" v-if="mapConfig.wap_is_open == 1">请确认定位服务已经打开或者您可手动选择附近的门店以便我们提供更精确的服务</view>
|
||||
<view class="text-bottom" v-else>请手动选择附近的门店以便我们提供更精确的服务</view>
|
||||
<view class="footer">
|
||||
<button :type="mapConfig.wap_is_open == 1?'default':'primary'" @click="chooseStore">选择门店</button>
|
||||
<button v-if="mapConfig.wap_is_open == 1" type="primary" class="btn-right" @click="openSetting">开启定位</button>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<!-- 小程序隐私协议 -->
|
||||
<privacy-popup ref="privacyPopup"></privacy-popup>
|
||||
@@ -146,8 +169,31 @@
|
||||
nsNavbar,
|
||||
toTop
|
||||
},
|
||||
mixins: [diyJs, scroll, indexJs]
|
||||
mixins: [diyJs, scroll, indexJs],
|
||||
methods: {
|
||||
// 新增:电话按钮点击事件-弹出对话框
|
||||
openCallDialog() {
|
||||
uni.showModal({
|
||||
title: "拨打?【仅为模拟】", // 弹窗标题
|
||||
content: "", // 弹窗内容(可留空)
|
||||
confirmText: "确定", // 确定按钮文字
|
||||
cancelText: "取消", // 取消按钮文字
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
// 点击“确定”后的操作(比如实际拨号)
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: "13800138000" // 替换为实际要拨打的号码
|
||||
});
|
||||
} else if (res.cancel) {
|
||||
// 点击“取消”后的操作(可留空)
|
||||
console.log('用户取消拨打');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@@ -228,6 +274,14 @@
|
||||
max-height: unset !important;
|
||||
}
|
||||
|
||||
/deep/ .chain-stores .uni-popup__mask{
|
||||
backdrop-filter: blur(10rpx);
|
||||
}
|
||||
|
||||
/deep/ .chain-stores .uni-popup__wrapper.uni-custom.bottom .uni-popup__wrapper-box, .uni-popup__wrapper.uni-custom.top .uni-popup__wrapper-box{
|
||||
max-height: 100vh !important;
|
||||
}
|
||||
|
||||
/deep/ .mescroll-totop {
|
||||
right: 24rpx!important;
|
||||
bottom: 182rpx!important;
|
||||
|
||||
@@ -3,7 +3,8 @@ export default {
|
||||
return {
|
||||
minScrollTop: 100, // 设置回到顶端按钮显示要求,最小页面滚动距离
|
||||
wechatQrcode: '', // 公众号二维码
|
||||
diyRoute: '/pages/index/index'
|
||||
diyRoute: '/pages/index/index',
|
||||
refresh:false,
|
||||
};
|
||||
},
|
||||
onLoad(option) {
|
||||
@@ -41,6 +42,9 @@ export default {
|
||||
if (this.unsubscribe) this.unsubscribe();
|
||||
},
|
||||
methods: {
|
||||
changeCategoryNav(e){
|
||||
if(e == 0) this.refresh = !this.refresh;
|
||||
},
|
||||
// 关注公众号
|
||||
getFollowQrcode() {
|
||||
if (!this.$util.isWeiXin()) return;
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<page-meta :page-style="themeColor"></page-meta>
|
||||
<view :style="{ backgroundColor: bgColor, minHeight: openBottomNav ? 'calc(100vh - 55px)' : '' }" class="page-img">
|
||||
<view class="page-header" v-if="diyData.global && diyData.global.navBarSwitch" :style="{ backgroundImage: bgImg }">
|
||||
<ns-navbar :title-color="textNavColor" :data="diyData.global" :scrollTop="scrollTop" :isBack="true"/>
|
||||
<ns-navbar :title-color="textNavColor" :data="diyData.global" :scrollTop="scrollTop" :isBack="false"/>
|
||||
</view>
|
||||
|
||||
<diy-index-page v-if="topIndexValue" ref="indexPage" :value="topIndexValue" :bgUrl="bgUrl" :scrollTop="scrollTop" :diyGlobal="diyData.global" class="diy-index-page">
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user