feat: 初始化项目配置和样式- 添加项目环境变量配置文件 (.env)
- 创建代码忽略文件列表 (.gitignore) - 设置代码格式化规则 (.prettierrc)- 添加各种样式文件，包括背景、边框、按钮、卡片等组件样式 - 创建暗黑主题样式文件 - 添加表单和代码样式文件
This commit is contained in:
liguigong
@@ -0,0 +1,19 @@
|
||||
export const KeFuMessageContentTypeEnum = {
|
||||
TEXT: 1, // 文本消息
|
||||
IMAGE: 2, // 图片消息
|
||||
VOICE: 3, // 语音消息
|
||||
VIDEO: 4, // 视频消息
|
||||
SYSTEM: 5, // 系统消息
|
||||
// ========== 商城特殊消息 ==========
|
||||
PRODUCT: 10,// 商品消息
|
||||
ORDER: 11,// 订单消息"
|
||||
};
|
||||
export const UserTypeEnum = {
|
||||
MEMBER: 1, // 会员 面向 c 端，普通用户
|
||||
ADMIN: 2, // 管理员 面向 b 端，管理后台
|
||||
};
|
||||
// Promotion 的 WebSocket 消息类型枚举类
|
||||
export const WebSocketMessageTypeConstants = {
|
||||
KEFU_MESSAGE_TYPE: 'kefu_message_type', // 客服消息类型
|
||||
KEFU_MESSAGE_ADMIN_READ: 'kefu_message_read_status_change' // 客服消息管理员已读
|
||||
}
|
||||
@@ -0,0 +1,58 @@
|
||||
export const emojiList = [
|
||||
{ name: '[笑掉牙]', file: 'xiaodiaoya.png' },
|
||||
{ name: '[可爱]', file: 'keai.png' },
|
||||
{ name: '[冷酷]', file: 'lengku.png' },
|
||||
{ name: '[闭嘴]', file: 'bizui.png' },
|
||||
{ name: '[生气]', file: 'shengqi.png' },
|
||||
{ name: '[惊恐]', file: 'jingkong.png' },
|
||||
{ name: '[瞌睡]', file: 'keshui.png' },
|
||||
{ name: '[大笑]', file: 'daxiao.png' },
|
||||
{ name: '[爱心]', file: 'aixin.png' },
|
||||
{ name: '[坏笑]', file: 'huaixiao.png' },
|
||||
{ name: '[飞吻]', file: 'feiwen.png' },
|
||||
{ name: '[疑问]', file: 'yiwen.png' },
|
||||
{ name: '[开心]', file: 'kaixin.png' },
|
||||
{ name: '[发呆]', file: 'fadai.png' },
|
||||
{ name: '[流泪]', file: 'liulei.png' },
|
||||
{ name: '[汗颜]', file: 'hanyan.png' },
|
||||
{ name: '[惊悚]', file: 'jingshu.png' },
|
||||
{ name: '[困~]', file: 'kun.png' },
|
||||
{ name: '[心碎]', file: 'xinsui.png' },
|
||||
{ name: '[天使]', file: 'tianshi.png' },
|
||||
{ name: '[晕]', file: 'yun.png' },
|
||||
{ name: '[啊]', file: 'a.png' },
|
||||
{ name: '[愤怒]', file: 'fennu.png' },
|
||||
{ name: '[睡着]', file: 'shuizhuo.png' },
|
||||
{ name: '[面无表情]', file: 'mianwubiaoqing.png' },
|
||||
{ name: '[难过]', file: 'nanguo.png' },
|
||||
{ name: '[犯困]', file: 'fankun.png' },
|
||||
{ name: '[好吃]', file: 'haochi.png' },
|
||||
{ name: '[呕吐]', file: 'outu.png' },
|
||||
{ name: '[龇牙]', file: 'ziya.png' },
|
||||
{ name: '[懵比]', file: 'mengbi.png' },
|
||||
{ name: '[白眼]', file: 'baiyan.png' },
|
||||
{ name: '[饿死]', file: 'esi.png' },
|
||||
{ name: '[凶]', file: 'xiong.png' },
|
||||
{ name: '[感冒]', file: 'ganmao.png' },
|
||||
{ name: '[流汗]', file: 'liuhan.png' },
|
||||
{ name: '[笑哭]', file: 'xiaoku.png' },
|
||||
{ name: '[流口水]', file: 'liukoushui.png' },
|
||||
{ name: '[尴尬]', file: 'ganga.png' },
|
||||
{ name: '[惊讶]', file: 'jingya.png' },
|
||||
{ name: '[大惊]', file: 'dajing.png' },
|
||||
{ name: '[不好意思]', file: 'buhaoyisi.png' },
|
||||
{ name: '[大闹]', file: 'danao.png' },
|
||||
{ name: '[不可思议]', file: 'bukesiyi.png' },
|
||||
{ name: '[爱你]', file: 'aini.png' },
|
||||
{ name: '[红心]', file: 'hongxin.png' },
|
||||
{ name: '[点赞]', file: 'dianzan.png' },
|
||||
{ name: '[恶魔]', file: 'emo.png' },
|
||||
];
|
||||
|
||||
export let emojiPage = {};
|
||||
emojiList.forEach((item, index) => {
|
||||
if (!emojiPage[Math.floor(index / 30) + 1]) {
|
||||
emojiPage[Math.floor(index / 30) + 1] = [];
|
||||
}
|
||||
emojiPage[Math.floor(index / 30) + 1].push(item);
|
||||
});
|
||||
@@ -0,0 +1,150 @@
|
||||
import { onBeforeUnmount, reactive, ref } from 'vue';
|
||||
import { baseUrl, websocketPath } from '@/sheep/config';
|
||||
import { copyValueToTarget } from '@/sheep/helper/utils';
|
||||
import { getRefreshToken } from '@/sheep/request';
|
||||
|
||||
/**
|
||||
* WebSocket 创建 hook
|
||||
* @param opt 连接配置
|
||||
* @return {{options: *}}
|
||||
*/
|
||||
export function useWebSocket(opt) {
|
||||
const options = reactive({
|
||||
url: (baseUrl + websocketPath).replace('http', 'ws') + '?token=' + getRefreshToken(), // ws 地址
|
||||
isReconnecting: false, // 正在重新连接
|
||||
reconnectInterval: 3000, // 重连间隔，单位毫秒
|
||||
heartBeatInterval: 5000, // 心跳间隔，单位毫秒
|
||||
pingTimeoutDuration: 1000, // 超过这个时间，后端没有返回pong，则判定后端断线了。
|
||||
heartBeatTimer: null, // 心跳计时器
|
||||
destroy: false, // 是否销毁
|
||||
pingTimeout: null, // 心跳检测定时器
|
||||
reconnectTimeout: null, // 重连定时器ID的属性
|
||||
onConnected: () => {}, // 连接成功时触发
|
||||
onClosed: () => {}, // 连接关闭时触发
|
||||
onMessage: (data) => {}, // 收到消息
|
||||
});
|
||||
const SocketTask = ref(null); // SocketTask 由 uni.connectSocket() 接口创建
|
||||
|
||||
const initEventListeners = () => {
|
||||
// 监听 WebSocket 连接打开事件
|
||||
SocketTask.value.onOpen(() => {
|
||||
console.log('WebSocket 连接成功');
|
||||
// 连接成功时触发
|
||||
options.onConnected();
|
||||
// 开启心跳检查
|
||||
startHeartBeat();
|
||||
});
|
||||
// 监听 WebSocket 接受到服务器的消息事件
|
||||
SocketTask.value.onMessage((res) => {
|
||||
try {
|
||||
if (res.data === 'pong') {
|
||||
// 收到心跳重置心跳超时检查
|
||||
resetPingTimeout();
|
||||
} else {
|
||||
options.onMessage(JSON.parse(res.data));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
});
|
||||
// 监听 WebSocket 连接关闭事件
|
||||
SocketTask.value.onClose((event) => {
|
||||
// 情况一：实例销毁
|
||||
if (options.destroy) {
|
||||
options.onClosed();
|
||||
} else {
|
||||
// 情况二：连接失败重连
|
||||
// 停止心跳检查
|
||||
stopHeartBeat();
|
||||
// 重连
|
||||
reconnect();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 发送消息
|
||||
const sendMessage = (message) => {
|
||||
if (SocketTask.value && !options.destroy) {
|
||||
SocketTask.value.send({ data: message });
|
||||
}
|
||||
};
|
||||
// 开始心跳检查
|
||||
const startHeartBeat = () => {
|
||||
options.heartBeatTimer = setInterval(() => {
|
||||
sendMessage('ping');
|
||||
options.pingTimeout = setTimeout(() => {
|
||||
// 如果在超时时间内没有收到 pong，则认为连接断开
|
||||
reconnect();
|
||||
}, options.pingTimeoutDuration);
|
||||
}, options.heartBeatInterval);
|
||||
};
|
||||
// 停止心跳检查
|
||||
const stopHeartBeat = () => {
|
||||
clearInterval(options.heartBeatTimer);
|
||||
resetPingTimeout();
|
||||
};
|
||||
|
||||
// WebSocket 重连
|
||||
const reconnect = () => {
|
||||
if (options.destroy || !SocketTask.value) {
|
||||
// 如果WebSocket已被销毁或尚未完全关闭，不进行重连
|
||||
return;
|
||||
}
|
||||
|
||||
// 重连中
|
||||
options.isReconnecting = true;
|
||||
|
||||
// 清除现有的重连标志，以避免多次重连
|
||||
if (options.reconnectTimeout) {
|
||||
clearTimeout(options.reconnectTimeout);
|
||||
}
|
||||
|
||||
// 设置重连延迟
|
||||
options.reconnectTimeout = setTimeout(() => {
|
||||
// 检查组件是否仍在运行和WebSocket是否关闭
|
||||
if (!options.destroy) {
|
||||
// 重置重连标志
|
||||
options.isReconnecting = false;
|
||||
// 初始化新的WebSocket连接
|
||||
initSocket();
|
||||
}
|
||||
}, options.reconnectInterval);
|
||||
};
|
||||
|
||||
const resetPingTimeout = () => {
|
||||
if (options.pingTimeout) {
|
||||
clearTimeout(options.pingTimeout);
|
||||
options.pingTimeout = null; // 清除超时ID
|
||||
}
|
||||
};
|
||||
|
||||
const close = () => {
|
||||
options.destroy = true;
|
||||
stopHeartBeat();
|
||||
if (options.reconnectTimeout) {
|
||||
clearTimeout(options.reconnectTimeout);
|
||||
}
|
||||
if (SocketTask.value) {
|
||||
SocketTask.value.close();
|
||||
SocketTask.value = null;
|
||||
}
|
||||
};
|
||||
|
||||
const initSocket = () => {
|
||||
options.destroy = false;
|
||||
copyValueToTarget(options, opt);
|
||||
SocketTask.value = uni.connectSocket({
|
||||
url: options.url,
|
||||
complete: () => {},
|
||||
success: () => {},
|
||||
});
|
||||
initEventListeners();
|
||||
};
|
||||
|
||||
initSocket();
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
close();
|
||||
});
|
||||
return { options };
|
||||
}
|
||||
Reference in New Issue
Block a user