Compare commits
10 Commits
07752394eb
...
1038dd3180
| Author | SHA1 | Date | |
|---|---|---|---|
| 1038dd3180 | |||
|
|
843d8d3138 | ||
|
|
41a8ac7a13 | ||
|
|
9e931e0a1f | ||
|
|
8dc27ec9fa | ||
|
|
945cb823ad | ||
|
|
6701172b6d | ||
|
|
261fb16bd6 | ||
|
|
11141ae436 | ||
|
|
c03a4200be |
@ -1,5 +1,7 @@
|
||||
NODE_ENV = development
|
||||
|
||||
VITE_BASE_URL = https://biz.nianxx.cn
|
||||
# 测试
|
||||
VITE_BASE_URL = https://onefeel.brother7.cn/ingress
|
||||
|
||||
VITE_WSS_URL = wss://biz.nianxx.cn/agent/ws/chat
|
||||
# 测试
|
||||
VITE_WSS_URL = wss://onefeel.brother7.cn/ingress/agent/ws/chat
|
||||
|
||||
@ -1,5 +1,7 @@
|
||||
NODE_ENV = production
|
||||
|
||||
# 生产
|
||||
VITE_BASE_URL = https://biz.nianxx.cn
|
||||
|
||||
# 生产
|
||||
VITE_WSS_URL = wss://biz.nianxx.cn/agent/ws/chat
|
||||
@ -1,5 +1,7 @@
|
||||
NODE_ENV = staging
|
||||
|
||||
# 生产
|
||||
VITE_BASE_URL = https://biz.nianxx.cn
|
||||
|
||||
# 生产
|
||||
VITE_WSS_URL = wss://biz.nianxx.cn/agent/ws/chat
|
||||
42
App.vue
42
App.vue
@ -1,28 +1,8 @@
|
||||
<script setup>
|
||||
import { onLaunch, onShow, onHide, onLoad } from "@dcloudio/uni-app";
|
||||
import { checkPhone } from "@/manager/LoginManager";
|
||||
import { goLogin } from "@/hooks/useGoLogin";
|
||||
import { goHome } from "@/hooks/useGoHome";
|
||||
import { onLaunch, onShow, onHide } from "@dcloudio/uni-app";
|
||||
|
||||
onLaunch(async () => {
|
||||
console.log("App Launch");
|
||||
|
||||
const token = uni.getStorageSync("token");
|
||||
|
||||
// 检测是否绑定手机号和token
|
||||
if (!token) {
|
||||
goLogin();
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (token) {
|
||||
const res = await checkPhone();
|
||||
|
||||
if (res.data) {
|
||||
goHome();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
onShow(() => {
|
||||
@ -55,4 +35,24 @@ body,
|
||||
.mb12 {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
// 重置按钮样式
|
||||
.reset-btn {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 1000;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
content: " ";
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
18
components/Interceptor/index.vue
Normal file
18
components/Interceptor/index.vue
Normal file
@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<button
|
||||
v-if="!hasToken"
|
||||
class="reset-btn"
|
||||
open-type="getPhoneNumber"
|
||||
@getphonenumber="onLogin"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, defineEmits } from "vue";
|
||||
import { useAppStore } from "@/store";
|
||||
import { onLogin } from "@/hooks/useGoLogin";
|
||||
|
||||
const emits = defineEmits(["click"]);
|
||||
|
||||
const hasToken = computed(() => useAppStore().hasToken);
|
||||
</script>
|
||||
@ -1,8 +0,0 @@
|
||||
const isProd = true;
|
||||
|
||||
console.log(import.meta.env);
|
||||
|
||||
export const BASE_URL = import.meta.env.VITE_BASE_URL;
|
||||
|
||||
// socket地址
|
||||
export const WSS_URL = import.meta.env.VITE_WSS_URL;
|
||||
@ -1 +1,37 @@
|
||||
import { loginAuth, checkPhone, bindPhone } from "@/manager/LoginManager";
|
||||
|
||||
// 跳转登录
|
||||
export const goLogin = () => uni.reLaunch({ url: "/pages/login/index" });
|
||||
|
||||
// 登录逻辑
|
||||
export const onLogin = (e) => {
|
||||
const token = uni.getStorageSync("token");
|
||||
|
||||
if (token) return;
|
||||
|
||||
const { code } = e.detail;
|
||||
console.info("onLogin code: ", code);
|
||||
|
||||
loginAuth().then(async () => {
|
||||
// 检测是否绑定手机号
|
||||
const res = await checkPhone();
|
||||
|
||||
if (res.data) return;
|
||||
|
||||
const params = { wechatPhoneCode: code, clientId: "2" };
|
||||
|
||||
// 绑定手机号
|
||||
bindPhone(params);
|
||||
});
|
||||
};
|
||||
|
||||
// 检测token
|
||||
export const checkToken = async () => {
|
||||
return new Promise((resolve) => {
|
||||
const token = uni.getStorageSync("token");
|
||||
|
||||
if (!token) return;
|
||||
|
||||
resolve(token);
|
||||
});
|
||||
};
|
||||
|
||||
@ -1,14 +1,24 @@
|
||||
export const getWeChatAuthCode = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
onlyAuthorize: true,
|
||||
success: (res) => {
|
||||
resolve(res.code);
|
||||
},
|
||||
fail: (err) => {
|
||||
reject(err);
|
||||
}
|
||||
});
|
||||
return new Promise((resolve, reject) => {
|
||||
// 条件编译微信小程序、抖音小程序
|
||||
let provider = "";
|
||||
// #ifdef MP-WEIXIN
|
||||
provider = "weixin";
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-TOUTIAO
|
||||
provider = "toutiao";
|
||||
// #endif
|
||||
|
||||
uni.login({
|
||||
provider,
|
||||
success: (res) => {
|
||||
console.log("微信登录成功", res);
|
||||
resolve(res.code);
|
||||
},
|
||||
fail: (err) => {
|
||||
reject(err);
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
@ -1,49 +1,52 @@
|
||||
import {
|
||||
wxLogin,
|
||||
bindUserPhone,
|
||||
checkUserPhone,
|
||||
wxLogin,
|
||||
bindUserPhone,
|
||||
checkUserPhone,
|
||||
} from "../request/api/LoginApi";
|
||||
import { getWeChatAuthCode } from "./AuthManager";
|
||||
import { useAppStore } from "@/store";
|
||||
|
||||
const loginAuth = async () => {
|
||||
try {
|
||||
const openIdCode = await getWeChatAuthCode();
|
||||
console.log("获取到的微信授权code:", openIdCode);
|
||||
const response = await wxLogin({
|
||||
openIdCode: [openIdCode],
|
||||
grant_type: "wechat",
|
||||
scope: "server",
|
||||
clientId: "2",
|
||||
});
|
||||
console.log("获取到的微信授权response:", response);
|
||||
const loginAuth = () => {
|
||||
return new Promise(async (resolve, reject) => {
|
||||
const openIdCode = await getWeChatAuthCode();
|
||||
console.log("获取到的微信授权code:", openIdCode);
|
||||
const response = await wxLogin({
|
||||
openIdCode: [openIdCode],
|
||||
grant_type: "wechat",
|
||||
scope: "server",
|
||||
clientId: "2",
|
||||
});
|
||||
console.log("获取到的微信授权response:", response);
|
||||
|
||||
if (response.access_token) {
|
||||
uni.setStorageSync("token", response.access_token);
|
||||
return response;
|
||||
} else {
|
||||
throw new Error(response.message || "登录失败");
|
||||
}
|
||||
} catch (err) {
|
||||
throw err;
|
||||
if (response.access_token) {
|
||||
uni.setStorageSync("token", response.access_token);
|
||||
|
||||
const appStore = useAppStore();
|
||||
|
||||
appStore.setHasToken(true);
|
||||
resolve();
|
||||
} else {
|
||||
reject(response.message || "登录失败");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const bindPhone = async (params) => {
|
||||
try {
|
||||
const response = await bindUserPhone(params);
|
||||
return response;
|
||||
} catch (error) {
|
||||
throw err;
|
||||
}
|
||||
try {
|
||||
const response = await bindUserPhone(params);
|
||||
return response;
|
||||
} catch (error) {
|
||||
throw err;
|
||||
}
|
||||
};
|
||||
|
||||
const checkPhone = async (phone) => {
|
||||
try {
|
||||
const response = await checkUserPhone(phone);
|
||||
return response;
|
||||
} catch (error) {
|
||||
throw err;
|
||||
}
|
||||
try {
|
||||
const response = await checkUserPhone(phone);
|
||||
return response;
|
||||
} catch (error) {
|
||||
throw err;
|
||||
}
|
||||
};
|
||||
|
||||
export { loginAuth, bindPhone, checkPhone };
|
||||
|
||||
197
manifest.json
197
manifest.json
@ -1,102 +1,105 @@
|
||||
{
|
||||
"name" : "YGTianmuCS",
|
||||
"appid" : "__UNI__BB03E8A",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueStyleCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
"safearea" : {
|
||||
"bottom" : {
|
||||
"offset" : "auto" // 自动适配安全区域
|
||||
}
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules" : {},
|
||||
/* 应用发布信息 */
|
||||
"distribute" : {
|
||||
/* android打包配置 */
|
||||
"android" : {
|
||||
"permissions" : [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
/* ios打包配置 */
|
||||
"ios" : {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs" : {
|
||||
"oauth" : {}
|
||||
}
|
||||
}
|
||||
"name": "YGTianmuCS",
|
||||
"appid": "__UNI__BB03E8A",
|
||||
"description": "",
|
||||
"versionName": "1.0.0",
|
||||
"versionCode": "100",
|
||||
"transformPx": false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus": {
|
||||
"usingComponents": true,
|
||||
"nvueStyleCompiler": "uni-app",
|
||||
"compilerVersion": 3,
|
||||
"splashscreen": {
|
||||
"alwaysShowBeforeRender": true,
|
||||
"waiting": true,
|
||||
"autoclose": true,
|
||||
"delay": 0
|
||||
},
|
||||
/* 快应用特有相关 */
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "wx23f86d809ae80259",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
"usingComponents" : true,
|
||||
"requiredPrivateInfos" : [ "getLocation" ],
|
||||
"permission" : {
|
||||
"scope.userLocation" : {
|
||||
"desc" : "用于获取当前所在城市信息"
|
||||
}
|
||||
},
|
||||
"plugins" : {
|
||||
"WechatSI" : {
|
||||
"version" : "0.3.6",
|
||||
"provider" : "wx069ba97219f66d99"
|
||||
}
|
||||
},
|
||||
"__usePrivacyCheck__" : true
|
||||
"safearea": {
|
||||
"bottom": {
|
||||
"offset": "auto" // 自动适配安全区域
|
||||
}
|
||||
},
|
||||
"mp-alipay" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-toutiao" : {
|
||||
"usingComponents" : true,
|
||||
"usePrivacyCheck" : true
|
||||
},
|
||||
"uniStatistics" : {
|
||||
"enable" : false
|
||||
},
|
||||
"vueVersion" : "3",
|
||||
"h5" : {
|
||||
"router" : {
|
||||
"base" : "./",
|
||||
"mode" : "hash"
|
||||
},
|
||||
"devServer" : {
|
||||
"https" : false
|
||||
}
|
||||
/* 模块配置 */
|
||||
"modules": {},
|
||||
/* 应用发布信息 */
|
||||
"distribute": {
|
||||
/* android打包配置 */
|
||||
"android": {
|
||||
"permissions": [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
/* ios打包配置 */
|
||||
"ios": {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs": {
|
||||
"oauth": {}
|
||||
}
|
||||
}
|
||||
},
|
||||
/* 快应用特有相关 */
|
||||
"quickapp": {},
|
||||
/* 小程序特有相关 同时更改 project.config.json文件
|
||||
智念:wx5e79df5996572539
|
||||
朵花:wx23f86d809ae80259
|
||||
*/
|
||||
"mp-weixin": {
|
||||
"appid": "wx5e79df5996572539",
|
||||
"setting": {
|
||||
"urlCheck": false
|
||||
},
|
||||
"usingComponents": true,
|
||||
"requiredPrivateInfos": ["getLocation"],
|
||||
"permission": {
|
||||
"scope.userLocation": {
|
||||
"desc": "用于获取当前所在城市信息"
|
||||
}
|
||||
},
|
||||
"plugins": {
|
||||
"WechatSI": {
|
||||
"version": "0.3.6",
|
||||
"provider": "wx069ba97219f66d99"
|
||||
}
|
||||
},
|
||||
"__usePrivacyCheck__": true
|
||||
},
|
||||
"mp-alipay": {
|
||||
"usingComponents": true
|
||||
},
|
||||
"mp-baidu": {
|
||||
"usingComponents": true
|
||||
},
|
||||
"mp-toutiao": {
|
||||
"usingComponents": true,
|
||||
"usePrivacyCheck": true
|
||||
},
|
||||
"uniStatistics": {
|
||||
"enable": false
|
||||
},
|
||||
"vueVersion": "3",
|
||||
"h5": {
|
||||
"router": {
|
||||
"base": "./",
|
||||
"mode": "hash"
|
||||
},
|
||||
"devServer": {
|
||||
"https": false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -9,6 +9,8 @@
|
||||
|
||||
<!-- 输入框/语音按钮容器 -->
|
||||
<view class="input-button-container">
|
||||
<Interceptor />
|
||||
|
||||
<textarea
|
||||
ref="textareaRef"
|
||||
v-if="!isVoiceMode"
|
||||
@ -60,8 +62,10 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, watch, nextTick, onMounted, computed, defineExpose } from "vue";
|
||||
import { ref, watch, nextTick, onMounted, defineExpose } from "vue";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
import RecordingWaveBtn from "@/components/Speech/RecordingWaveBtn.vue";
|
||||
import Interceptor from "@/components/Interceptor/index.vue";
|
||||
|
||||
const plugin = requirePlugin("WechatSI");
|
||||
const manager = plugin.getRecordRecognitionManager();
|
||||
@ -113,15 +117,17 @@ const toggleVoiceMode = () => {
|
||||
|
||||
// 处理语音按钮长按开始
|
||||
const handleVoiceTouchStart = () => {
|
||||
manager.start({ lang: "zh_CN" });
|
||||
checkToken().then(() => {
|
||||
manager.start({ lang: "zh_CN" });
|
||||
|
||||
visibleWaveBtn.value = true;
|
||||
visibleWaveBtn.value = true;
|
||||
|
||||
// 启动音频条动画
|
||||
nextTick(() => {
|
||||
if (recordingWaveBtnRef.value) {
|
||||
recordingWaveBtnRef.value.startAnimation();
|
||||
}
|
||||
// 启动音频条动画
|
||||
nextTick(() => {
|
||||
if (recordingWaveBtnRef.value) {
|
||||
recordingWaveBtnRef.value.startAnimation();
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
@ -230,88 +236,5 @@ defineExpose({ focusInput });
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.area-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 22px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0px 0px 20px 0px rgba(52, 25, 204, 0.05);
|
||||
margin: 0 12px;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.input-container-voice {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
align-self: flex-end;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
|
||||
image {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.input-button-container {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.hold-to-talk-button {
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
color: #333333;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #ffffff;
|
||||
transition: all 0.2s ease;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
.input-container-send {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
align-self: flex-end;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
|
||||
.input-container-send-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.textarea {
|
||||
flex: 1;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
max-height: 92px;
|
||||
min-height: 22px;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
margin: 6px 0;
|
||||
|
||||
&::placeholder {
|
||||
color: #cccccc;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "./styles/ChatInputArea.scss";
|
||||
</style>
|
||||
|
||||
@ -97,12 +97,18 @@
|
||||
/>
|
||||
|
||||
<ActivityListComponent
|
||||
v-if="mainPageDataModel.activityList && mainPageDataModel.activityList.length > 0"
|
||||
v-if="
|
||||
mainPageDataModel.activityList &&
|
||||
mainPageDataModel.activityList.length > 0
|
||||
"
|
||||
:activityList="mainPageDataModel.activityList"
|
||||
/>
|
||||
|
||||
<RecommendPostsComponent
|
||||
v-if="mainPageDataModel.recommendTheme && mainPageDataModel.recommendTheme.length > 0"
|
||||
v-if="
|
||||
mainPageDataModel.recommendTheme &&
|
||||
mainPageDataModel.recommendTheme.length > 0
|
||||
"
|
||||
:recommendThemeList="mainPageDataModel.recommendTheme"
|
||||
/>
|
||||
</ChatCardOther>
|
||||
@ -130,14 +136,14 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted, nextTick, onUnmounted, ref, defineEmits } from "vue";
|
||||
import { onMounted, nextTick, onUnmounted, ref, defineEmits, watch } from "vue";
|
||||
import { onLoad } from "@dcloudio/uni-app";
|
||||
import {
|
||||
SCROLL_TO_BOTTOM,
|
||||
RECOMMEND_POSTS_TITLE,
|
||||
SEND_COMMAND_TEXT,
|
||||
} from "@/constant/constant";
|
||||
import { WSS_URL } from "@/constant/base";
|
||||
import { WSS_URL } from "@/request/base/baseUrl";
|
||||
import { MessageRole, MessageType, CompName } from "../../model/ChatModel";
|
||||
import ChatTopWelcome from "./ChatTopWelcome.vue";
|
||||
import ChatTopBgImg from "./ChatTopBgImg.vue";
|
||||
@ -165,6 +171,7 @@ import WebSocketManager from "@/utils/WebSocketManager";
|
||||
import TypewriterManager from "@/utils/TypewriterManager";
|
||||
import { IdUtils } from "@/utils";
|
||||
import { useAppStore } from "@/store";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
|
||||
const appStore = useAppStore();
|
||||
/// 导航栏相关
|
||||
@ -346,14 +353,34 @@ onLoad(() => {
|
||||
});
|
||||
});
|
||||
|
||||
onMounted(async () => {
|
||||
// token存在,初始化数据
|
||||
const initHandler = () => {
|
||||
console.log("initHandler");
|
||||
|
||||
loadRecentConversation();
|
||||
loadConversationMsgList();
|
||||
initWebSocket();
|
||||
};
|
||||
|
||||
// 绑定成功,监听token变化,初始化
|
||||
|
||||
watch(
|
||||
() => appStore.hasToken,
|
||||
(newValue) => {
|
||||
if (newValue) {
|
||||
initHandler();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
try {
|
||||
getMainPageData();
|
||||
await loadRecentConversation();
|
||||
loadConversationMsgList();
|
||||
addNoticeListener();
|
||||
initTypewriterManager();
|
||||
initWebSocket();
|
||||
|
||||
// 有token时,加载最近会话、最近消息、初始化socket
|
||||
checkToken().then(() => initHandler());
|
||||
} catch (error) {
|
||||
console.error("页面初始化错误:", error);
|
||||
}
|
||||
|
||||
@ -6,9 +6,11 @@
|
||||
v-for="(item, index) in itemList"
|
||||
:key="index"
|
||||
>
|
||||
<text class="more-tips-item-title" @click="sendReply(item)">{{
|
||||
item
|
||||
}}</text>
|
||||
<view class="more-tips-item-title" @click="sendReply(item)">
|
||||
<Interceptor />
|
||||
|
||||
{{ item }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -16,6 +18,9 @@
|
||||
|
||||
<script setup>
|
||||
import { defineProps } from "vue";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
import Interceptor from "@/components/Interceptor/index.vue";
|
||||
|
||||
const emits = defineEmits(["replySent"]);
|
||||
|
||||
defineProps({
|
||||
@ -34,44 +39,11 @@ defineProps({
|
||||
});
|
||||
|
||||
const sendReply = (text) => {
|
||||
emits("replySent", text); // 向父组件传递数据
|
||||
// 向父组件传递数据
|
||||
checkToken().then(() => emits("replySent", text));
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.more-tips {
|
||||
width: 100%;
|
||||
|
||||
&-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
padding-bottom: 12px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.more-tips-item {
|
||||
border-radius: 8px;
|
||||
margin: 4px;
|
||||
box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.1);
|
||||
background-color: #ffffff;
|
||||
padding: 2px 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
|
||||
.more-tips-item-title {
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #00a6ff;
|
||||
line-height: 24px;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "./styles/ChatMoreTips.scss";
|
||||
</style>
|
||||
|
||||
@ -7,6 +7,8 @@
|
||||
:key="index"
|
||||
@click="sendReply(item)"
|
||||
>
|
||||
<Interceptor />
|
||||
|
||||
<image
|
||||
class="quick-access-item-bg"
|
||||
src="/static/quick/quick_icon_bg.png"
|
||||
@ -24,12 +26,15 @@
|
||||
|
||||
<script setup>
|
||||
import { onMounted, ref } from "vue";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
import Interceptor from "@/components/Interceptor/index.vue";
|
||||
|
||||
const itemList = ref([]);
|
||||
|
||||
const emits = defineEmits(["replySent"]);
|
||||
|
||||
const sendReply = (item) => {
|
||||
emits("replySent", item); // 向父组件传递数据
|
||||
checkToken().then(() => emits("replySent", item)); // 向父组件传递数据
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
@ -67,75 +72,5 @@ const initData = () => {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.quick-access {
|
||||
width: 100%;
|
||||
|
||||
&-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.quick-access-item {
|
||||
flex: 0 0 104px;
|
||||
border-radius: 8px;
|
||||
margin: 4px 4px 8px 4px;
|
||||
box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.1);
|
||||
padding: 12px;
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
|
||||
position: relative;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.quick-access-item-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
border-radius: 8px;
|
||||
width: 128px;
|
||||
height: 56px;
|
||||
}
|
||||
|
||||
.quick-access-item-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
|
||||
image {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
text {
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #201f32;
|
||||
line-height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.quick-access-item-content {
|
||||
z-index: 1;
|
||||
margin-top: 4px;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
font-size: 10px;
|
||||
color: #678cad;
|
||||
line-height: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "./styles/ChatQuickAccess.scss";
|
||||
</style>
|
||||
|
||||
84
pages/chat/styles/ChatInputArea.scss
Normal file
84
pages/chat/styles/ChatInputArea.scss
Normal file
@ -0,0 +1,84 @@
|
||||
.area-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 22px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0px 0px 20px 0px rgba(52, 25, 204, 0.05);
|
||||
margin: 0 12px;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.input-container-voice {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
align-self: flex-end;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
|
||||
image {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.input-button-container {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.hold-to-talk-button {
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
color: #333333;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #ffffff;
|
||||
transition: all 0.2s ease;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
.input-container-send {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
align-self: flex-end;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
|
||||
.input-container-send-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.textarea {
|
||||
flex: 1;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
max-height: 92px;
|
||||
min-height: 22px;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
margin: 6px 0;
|
||||
|
||||
&::placeholder {
|
||||
color: #cccccc;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
35
pages/chat/styles/ChatMoreTips.scss
Normal file
35
pages/chat/styles/ChatMoreTips.scss
Normal file
@ -0,0 +1,35 @@
|
||||
.more-tips {
|
||||
width: 100%;
|
||||
|
||||
&-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
padding-bottom: 12px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.more-tips-item {
|
||||
border-radius: 8px;
|
||||
margin: 4px;
|
||||
box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.1);
|
||||
background-color: #ffffff;
|
||||
padding: 2px 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
|
||||
.more-tips-item-title {
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #00a6ff;
|
||||
line-height: 24px;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
70
pages/chat/styles/ChatQuickAccess.scss
Normal file
70
pages/chat/styles/ChatQuickAccess.scss
Normal file
@ -0,0 +1,70 @@
|
||||
.quick-access {
|
||||
width: 100%;
|
||||
|
||||
&-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.quick-access-item {
|
||||
flex: 0 0 104px;
|
||||
border-radius: 8px;
|
||||
margin: 4px 4px 8px 4px;
|
||||
box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.1);
|
||||
padding: 12px;
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.quick-access-item-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
border-radius: 8px;
|
||||
width: 128px;
|
||||
height: 56px;
|
||||
}
|
||||
|
||||
.quick-access-item-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
|
||||
image {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
text {
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #201f32;
|
||||
line-height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.quick-access-item-content {
|
||||
z-index: 1;
|
||||
margin-top: 4px;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
font-size: 10px;
|
||||
color: #678cad;
|
||||
line-height: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -38,6 +38,7 @@
|
||||
<script setup>
|
||||
import { ref, onMounted } from "vue";
|
||||
import { getLoginUserPhone } from "@/request/api/LoginApi";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
|
||||
// 假数据
|
||||
const userInfo = ref({
|
||||
@ -56,15 +57,19 @@ const menuList = ref([
|
||||
},
|
||||
// { label: '营业资质&协议', type: 'navigate', url: '/pages/agreement/agreement' },
|
||||
{ label: "联系客服", type: "action", action: "contactService" },
|
||||
{ label: "订阅消息", type: "action", action: "subscribeMessage" },
|
||||
]);
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
getLoginUserPhoneInfo();
|
||||
checkToken().then(() => {
|
||||
getLoginUserPhoneInfo();
|
||||
});
|
||||
});
|
||||
|
||||
const getLoginUserPhoneInfo = async () => {
|
||||
const res = await getLoginUserPhone();
|
||||
|
||||
if (res.code === 0) {
|
||||
userInfo.value.phone = res.data;
|
||||
}
|
||||
@ -77,6 +82,13 @@ const handleMenuClick = (item) => {
|
||||
} else if (item.type === "action") {
|
||||
if (item.action === "contactService") {
|
||||
uni.showToast({ title: "联系客服功能待实现", icon: "none" });
|
||||
} else if (item.action === "subscribeMessage") {
|
||||
uni.requestSubscribeMessage({
|
||||
tmplIds: ["fMIt1q9GgM3Ep0DJSNgVPm4C3lCpQdz2TediETcv3iM"],
|
||||
success(res) {
|
||||
console.log(res);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -70,62 +70,6 @@ onMounted(() => {
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.date-picker {
|
||||
background: rgba(140, 236, 255, 0.24);
|
||||
padding: 8rpx 0;
|
||||
border-radius: 16rpx;
|
||||
margin: 12px 0 6px;
|
||||
min-width: 325px;
|
||||
box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.1); /* 阴影 */
|
||||
}
|
||||
|
||||
.date-list {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.date-item,
|
||||
.calendar-btn {
|
||||
flex: 1; /* 等宽 */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 12rpx 0;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
.date {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.date-item.active {
|
||||
background-color: #00a6ff;
|
||||
}
|
||||
.date-item.active .label,
|
||||
.date-item.active .date {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 日历按钮 */
|
||||
.calendar-btn {
|
||||
background: #fff;
|
||||
border-radius: 0 16rpx 16rpx 0;
|
||||
margin: -8rpx 0;
|
||||
}
|
||||
.calendar-img {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
.calendar-text {
|
||||
font-size: 22rpx;
|
||||
color: #666;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
<style scoped lang="scss">
|
||||
@import "./styles/QuickBookingCalender.scss";
|
||||
</style>
|
||||
|
||||
@ -62,13 +62,5 @@ onMounted(() => {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.calendar {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@import './styles/QuickBookingComponent.scss'
|
||||
</style>
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
v-for="(item, index) in commodityDTO.commodityList"
|
||||
:key="`${item.commodityId}-${index}`"
|
||||
>
|
||||
<view class="mk-card-item" @click="placeOrderHandle(item)">
|
||||
<Interceptor class="mk-card-item" @click="placeOrderHandle(item)">
|
||||
<!-- <view class="card-badge">超值推荐</view> -->
|
||||
<image class="card-img" :src="item.commodityIcon" mode="aspectFill" />
|
||||
<view class="card-content">
|
||||
@ -38,7 +38,7 @@
|
||||
<text class="card-btn">下单</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</Interceptor>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -47,6 +47,8 @@
|
||||
<script setup>
|
||||
import ModuleTitle from "@/components/ModuleTitle/index.vue";
|
||||
import { defineProps } from "vue";
|
||||
import Interceptor from "@/components/Interceptor/index.vue";
|
||||
|
||||
const props = defineProps({
|
||||
commodityDTO: {
|
||||
type: Object,
|
||||
@ -63,141 +65,5 @@ const placeOrderHandle = (item) => {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
margin: 4px 0;
|
||||
|
||||
.mk-card-item {
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
width: 188px;
|
||||
// height: 244px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
margin-right: 8px;
|
||||
padding-bottom: 12px;
|
||||
|
||||
.card-badge {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 8px;
|
||||
background: #ffe7b2;
|
||||
color: #b97a00;
|
||||
font-size: 12px;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.card-img {
|
||||
width: 188px;
|
||||
height: 114px;
|
||||
border-radius: 10px;
|
||||
object-fit: cover; /* 确保图片不变形,保持比例裁剪 */
|
||||
flex-shrink: 0; /* 防止图片被压缩 */
|
||||
}
|
||||
|
||||
.card-content {
|
||||
box-sizing: border-box;
|
||||
padding: 10px 12px 0 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: start;
|
||||
width: 100%;
|
||||
flex: 1; /* 让内容区域占据剩余空间 */
|
||||
overflow: hidden; /* 防止内容溢出 */
|
||||
}
|
||||
|
||||
.card-title-column {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #222;
|
||||
width: 100%;
|
||||
/* 限制标题最多显示两行 */
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.4;
|
||||
max-height: 2.8em; /* 2行的高度 */
|
||||
}
|
||||
|
||||
.card-tags {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: start;
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.card-tag {
|
||||
color: #ff6600;
|
||||
font-size: 10px;
|
||||
border-radius: 4px;
|
||||
padding: 0 6px;
|
||||
margin-left: 2px;
|
||||
border: 1px solid #ff6600;
|
||||
}
|
||||
|
||||
.card-desc {
|
||||
font-size: 13px;
|
||||
color: #888;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.card-bottom-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-price-row {
|
||||
.card-price-fu {
|
||||
color: #ff6600;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.card-price {
|
||||
color: #ff6600;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.card-unit {
|
||||
font-size: 11px;
|
||||
color: #888;
|
||||
font-weight: normal;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-btn {
|
||||
background: #ff6600;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
border-radius: 20px;
|
||||
padding: 0 18px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "./styles/QuickBookingContentList.scss";
|
||||
</style>
|
||||
|
||||
57
pages/module/booking/styles/QuickBookingCalender.scss
Normal file
57
pages/module/booking/styles/QuickBookingCalender.scss
Normal file
@ -0,0 +1,57 @@
|
||||
.date-picker {
|
||||
background: rgba(140, 236, 255, 0.24);
|
||||
padding: 8rpx 0;
|
||||
border-radius: 16rpx;
|
||||
margin: 12px 0 6px;
|
||||
min-width: 325px;
|
||||
box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.1); /* 阴影 */
|
||||
}
|
||||
|
||||
.date-list {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.date-item,
|
||||
.calendar-btn {
|
||||
flex: 1; /* 等宽 */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 12rpx 0;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
.date {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.date-item.active {
|
||||
background-color: #00a6ff;
|
||||
}
|
||||
.date-item.active .label,
|
||||
.date-item.active .date {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 日历按钮 */
|
||||
.calendar-btn {
|
||||
background: #fff;
|
||||
border-radius: 0 16rpx 16rpx 0;
|
||||
margin: -8rpx 0;
|
||||
}
|
||||
.calendar-img {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
.calendar-text {
|
||||
font-size: 22rpx;
|
||||
color: #666;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
9
pages/module/booking/styles/QuickBookingComponent.scss
Normal file
9
pages/module/booking/styles/QuickBookingComponent.scss
Normal file
@ -0,0 +1,9 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.calendar {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
137
pages/module/booking/styles/QuickBookingContentList.scss
Normal file
137
pages/module/booking/styles/QuickBookingContentList.scss
Normal file
@ -0,0 +1,137 @@
|
||||
.container {
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
margin: 4px 0;
|
||||
|
||||
.mk-card-item {
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
width: 188px;
|
||||
// height: 244px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
margin-right: 8px;
|
||||
padding-bottom: 12px;
|
||||
|
||||
.card-badge {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 8px;
|
||||
background: #ffe7b2;
|
||||
color: #b97a00;
|
||||
font-size: 12px;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.card-img {
|
||||
width: 188px;
|
||||
height: 114px;
|
||||
border-radius: 10px;
|
||||
object-fit: cover; /* 确保图片不变形,保持比例裁剪 */
|
||||
flex-shrink: 0; /* 防止图片被压缩 */
|
||||
}
|
||||
|
||||
.card-content {
|
||||
box-sizing: border-box;
|
||||
padding: 10px 12px 0 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: start;
|
||||
width: 100%;
|
||||
flex: 1; /* 让内容区域占据剩余空间 */
|
||||
overflow: hidden; /* 防止内容溢出 */
|
||||
}
|
||||
|
||||
.card-title-column {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #222;
|
||||
width: 100%;
|
||||
/* 限制标题最多显示两行 */
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.4;
|
||||
max-height: 2.8em; /* 2行的高度 */
|
||||
}
|
||||
|
||||
.card-tags {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: start;
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.card-tag {
|
||||
color: #ff6600;
|
||||
font-size: 10px;
|
||||
border-radius: 4px;
|
||||
padding: 0 6px;
|
||||
margin-left: 2px;
|
||||
border: 1px solid #ff6600;
|
||||
}
|
||||
|
||||
.card-desc {
|
||||
font-size: 13px;
|
||||
color: #888;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.card-bottom-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-price-row {
|
||||
.card-price-fu {
|
||||
color: #ff6600;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.card-price {
|
||||
color: #ff6600;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.card-unit {
|
||||
font-size: 11px;
|
||||
color: #888;
|
||||
font-weight: normal;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-btn {
|
||||
background: #ff6600;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
border-radius: 20px;
|
||||
padding: 0 18px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -26,8 +26,5 @@ const props = defineProps({
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
width: 100%;
|
||||
padding: 12px 0;
|
||||
}
|
||||
@import "./styles/DetailCardCompontent.scss";
|
||||
</style>
|
||||
|
||||
@ -7,6 +7,7 @@
|
||||
:key="`${item.commodityId}-${index}`"
|
||||
>
|
||||
<view class="mk-card-item" @click="placeOrderHandle(item)">
|
||||
<Interceptor />
|
||||
<image
|
||||
class="card-img"
|
||||
:src="item.commodityPhoto"
|
||||
@ -47,8 +48,11 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ModuleTitle from "@/components/ModuleTitle/index.vue";
|
||||
import { defineProps } from "vue";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
import ModuleTitle from "@/components/ModuleTitle/index.vue";
|
||||
import Interceptor from "@/components/Interceptor/index.vue";
|
||||
|
||||
const props = defineProps({
|
||||
commodityList: {
|
||||
type: Array,
|
||||
@ -58,149 +62,14 @@ const props = defineProps({
|
||||
|
||||
/// 去下单
|
||||
const placeOrderHandle = (item) => {
|
||||
uni.navigateTo({
|
||||
url: `/pages/goods/index?commodityId=${item.commodityId}`,
|
||||
checkToken().then(() => {
|
||||
uni.navigateTo({
|
||||
url: `/pages/goods/index?commodityId=${item.commodityId}`,
|
||||
});
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
margin: 6px 0 0;
|
||||
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
margin: 4px 0;
|
||||
|
||||
.mk-card-item {
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
width: 188px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
margin-right: 8px;
|
||||
padding-bottom: 12px;
|
||||
|
||||
.card-badge {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 8px;
|
||||
background: #ffe7b2;
|
||||
color: #b97a00;
|
||||
font-size: 12px;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.card-img {
|
||||
width: 188px;
|
||||
height: 114px;
|
||||
border-radius: 10px;
|
||||
object-fit: cover; /* 确保图片不变形,保持比例裁剪 */
|
||||
flex-shrink: 0; /* 防止图片被压缩 */
|
||||
}
|
||||
|
||||
.card-content {
|
||||
box-sizing: border-box;
|
||||
padding: 10px 12px 0 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: start;
|
||||
width: 100%;
|
||||
flex: 1; /* 让内容区域占据剩余空间 */
|
||||
overflow: hidden; /* 防止内容溢出 */
|
||||
}
|
||||
|
||||
.card-title-column {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #222;
|
||||
width: 100%;
|
||||
/* 限制标题最多显示两行 */
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.4;
|
||||
max-height: 2.8em; /* 2行的高度 */
|
||||
}
|
||||
|
||||
.card-tags {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: start;
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.card-tag {
|
||||
color: #ff6600;
|
||||
font-size: 10px;
|
||||
border-radius: 4px;
|
||||
padding: 0 6px;
|
||||
margin-left: 2px;
|
||||
border: 1px solid #ff6600;
|
||||
}
|
||||
|
||||
.card-desc {
|
||||
font-size: 13px;
|
||||
color: #888;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.card-bottom-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-price-row {
|
||||
.card-price-fu {
|
||||
color: #ff6600;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.card-price {
|
||||
color: #ff6600;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.card-unit {
|
||||
font-size: 11px;
|
||||
color: #888;
|
||||
font-weight: normal;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-btn {
|
||||
background: #ff6600;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
border-radius: 20px;
|
||||
padding: 0 18px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "./styles/DetailCardGoodsContentList.scss";
|
||||
</style>
|
||||
|
||||
4
pages/module/detail/styles/DetailCardCompontent.scss
Normal file
4
pages/module/detail/styles/DetailCardCompontent.scss
Normal file
@ -0,0 +1,4 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
padding: 12px 0;
|
||||
}
|
||||
138
pages/module/detail/styles/DetailCardGoodsContentList.scss
Normal file
138
pages/module/detail/styles/DetailCardGoodsContentList.scss
Normal file
@ -0,0 +1,138 @@
|
||||
.container {
|
||||
margin: 6px 0 0;
|
||||
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
margin: 4px 0;
|
||||
|
||||
.mk-card-item {
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
width: 188px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
margin-right: 8px;
|
||||
padding-bottom: 12px;
|
||||
|
||||
.card-badge {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 8px;
|
||||
background: #ffe7b2;
|
||||
color: #b97a00;
|
||||
font-size: 12px;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.card-img {
|
||||
width: 188px;
|
||||
height: 114px;
|
||||
border-radius: 10px;
|
||||
object-fit: cover; /* 确保图片不变形,保持比例裁剪 */
|
||||
flex-shrink: 0; /* 防止图片被压缩 */
|
||||
}
|
||||
|
||||
.card-content {
|
||||
box-sizing: border-box;
|
||||
padding: 10px 12px 0 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: start;
|
||||
width: 100%;
|
||||
flex: 1; /* 让内容区域占据剩余空间 */
|
||||
overflow: hidden; /* 防止内容溢出 */
|
||||
}
|
||||
|
||||
.card-title-column {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #222;
|
||||
width: 100%;
|
||||
/* 限制标题最多显示两行 */
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.4;
|
||||
max-height: 2.8em; /* 2行的高度 */
|
||||
}
|
||||
|
||||
.card-tags {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: start;
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.card-tag {
|
||||
color: #ff6600;
|
||||
font-size: 10px;
|
||||
border-radius: 4px;
|
||||
padding: 0 6px;
|
||||
margin-left: 2px;
|
||||
border: 1px solid #ff6600;
|
||||
}
|
||||
|
||||
.card-desc {
|
||||
font-size: 13px;
|
||||
color: #888;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.card-bottom-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-price-row {
|
||||
.card-price-fu {
|
||||
color: #ff6600;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.card-price {
|
||||
color: #ff6600;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.card-unit {
|
||||
font-size: 11px;
|
||||
color: #888;
|
||||
font-weight: normal;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-btn {
|
||||
background: #ff6600;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
border-radius: 20px;
|
||||
padding: 0 18px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -34,9 +34,5 @@ onMounted(() => {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
@import "./styles/DiscoveryCardComponent.scss";
|
||||
</style>
|
||||
|
||||
@ -7,8 +7,14 @@
|
||||
:key="index"
|
||||
>
|
||||
<view class="mk-card-item" @click="sendReply(item)">
|
||||
<image :src="item.coverPhoto" mode="widthFix"></image>
|
||||
<text>{{ item.topic }}</text>
|
||||
<Interceptor />
|
||||
|
||||
<image
|
||||
class="card-img"
|
||||
:src="item.coverPhoto"
|
||||
mode="widthFix"
|
||||
></image>
|
||||
<text class="card-text">{{ item.topic }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -16,9 +22,12 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ModuleTitle from "@/components/ModuleTitle/index.vue";
|
||||
import { RECOMMEND_POSTS_TITLE } from "@/constant/constant";
|
||||
import { defineProps } from "vue";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
import Interceptor from "@/components/Interceptor/index.vue";
|
||||
import ModuleTitle from "@/components/ModuleTitle/index.vue";
|
||||
|
||||
const props = defineProps({
|
||||
recommendTheme: {
|
||||
type: Object,
|
||||
@ -27,41 +36,13 @@ const props = defineProps({
|
||||
});
|
||||
|
||||
const sendReply = (item) => {
|
||||
const topic = item.userInputContent || item.topic.replace(/^#/, "");
|
||||
uni.$emit(RECOMMEND_POSTS_TITLE, topic);
|
||||
checkToken().then(() => {
|
||||
const topic = item.userInputContent || item.topic.replace(/^#/, "");
|
||||
uni.$emit(RECOMMEND_POSTS_TITLE, topic);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
margin-top: 4px;
|
||||
|
||||
.mk-card-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
width: 188px;
|
||||
height: 154px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
margin-right: 8px;
|
||||
|
||||
image {
|
||||
width: 188px;
|
||||
height: 112px;
|
||||
}
|
||||
text {
|
||||
padding: 12px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "./styles/DiscoveryCradContentList.scss";
|
||||
</style>
|
||||
|
||||
@ -0,0 +1,5 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
33
pages/module/discovery/styles/DiscoveryCradContentList.scss
Normal file
33
pages/module/discovery/styles/DiscoveryCradContentList.scss
Normal file
@ -0,0 +1,33 @@
|
||||
.container {
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
margin-top: 4px;
|
||||
|
||||
.mk-card-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
width: 188px;
|
||||
height: 154px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
|
||||
.card-img {
|
||||
width: 188px;
|
||||
height: 112px;
|
||||
}
|
||||
|
||||
.card-text {
|
||||
padding: 12px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -22,9 +22,5 @@ const props = defineProps({
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
@import "./styles/RecommendPostsComponent.scss";
|
||||
</style>
|
||||
|
||||
@ -7,7 +7,9 @@
|
||||
:key="index"
|
||||
>
|
||||
<view class="mk-card-item" @click="sendReply(item)">
|
||||
<image :src="item.coverPhoto" mode="aspectFill"></image>
|
||||
<Interceptor />
|
||||
<image class="card-img" :src="item.coverPhoto" mode="aspectFill" />
|
||||
|
||||
<view class="overlay-gradient">
|
||||
<text class="overlay-text">{{ item.topic }}</text>
|
||||
</view>
|
||||
@ -18,9 +20,11 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ModuleTitle from "@/components/ModuleTitle/index.vue";
|
||||
import { defineProps } from "vue";
|
||||
import { RECOMMEND_POSTS_TITLE } from "@/constant/constant.js";
|
||||
import { RECOMMEND_POSTS_TITLE } from "@/constant/constant";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
import Interceptor from "@/components/Interceptor/index.vue";
|
||||
import ModuleTitle from "@/components/ModuleTitle/index.vue";
|
||||
|
||||
const props = defineProps({
|
||||
recommendTheme: {
|
||||
@ -30,63 +34,13 @@ const props = defineProps({
|
||||
});
|
||||
|
||||
const sendReply = (item) => {
|
||||
const topic = item.userInputContent || item.topic.replace(/^#/, "");
|
||||
uni.$emit(RECOMMEND_POSTS_TITLE, topic);
|
||||
checkToken().then(() => {
|
||||
const topic = item.userInputContent || item.topic.replace(/^#/, "");
|
||||
uni.$emit(RECOMMEND_POSTS_TITLE, topic);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
margin: 4px 0 6px;
|
||||
|
||||
.mk-card-item {
|
||||
flex-shrink: 0; /* 关键:防止 flex 布局压缩子元素宽度 */
|
||||
width: 142px;
|
||||
height: 126px;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 渐变背景层 */
|
||||
.overlay-gradient {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 50px; /* 渐变层高度,可调 */
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(0, 0, 0, 0.001) 0%,
|
||||
rgba(0, 0, 0, 0.5) 100%
|
||||
);
|
||||
display: flex;
|
||||
align-items: flex-end; /* 文字贴近底部 */
|
||||
padding: 0 8px 6px; /* 内边距让文字与边缘保持距离 */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 渐变层上的文字 */
|
||||
.overlay-text {
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
text-align: left;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "./styles/RecommendPostsList.scss";
|
||||
</style>
|
||||
|
||||
@ -0,0 +1,5 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
53
pages/module/recommend/styles/RecommendPostsList.scss
Normal file
53
pages/module/recommend/styles/RecommendPostsList.scss
Normal file
@ -0,0 +1,53 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.container-scroll {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
overflow-x: auto;
|
||||
margin: 4px 0 6px;
|
||||
}
|
||||
|
||||
.mk-card-item {
|
||||
flex-shrink: 0; /* 关键:防止 flex 布局压缩子元素宽度 */
|
||||
width: 142px;
|
||||
height: 126px;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
|
||||
.card-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 渐变背景层 */
|
||||
.overlay-gradient {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 50px; /* 渐变层高度,可调 */
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(0, 0, 0, 0.001) 0%,
|
||||
rgba(0, 0, 0, 0.5) 100%
|
||||
);
|
||||
display: flex;
|
||||
align-items: flex-end; /* 文字贴近底部 */
|
||||
padding: 0 8px 6px; /* 内边距让文字与边缘保持距离 */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 渐变层上的文字 */
|
||||
.overlay-text {
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
text-align: left;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"appid": "wx23f86d809ae80259",
|
||||
"appid": "wx5e79df5996572539",
|
||||
"compileType": "miniprogram",
|
||||
"libVersion": "3.8.10",
|
||||
"packOptions": {
|
||||
@ -28,4 +28,4 @@
|
||||
"tabSize": 2
|
||||
},
|
||||
"projectArchitecture": "miniProgram"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import { BASE_URL } from "../../constant/base";
|
||||
import { BASE_URL } from "@/request/base/baseUrl";
|
||||
import { goLogin } from "@/hooks/useGoLogin";
|
||||
|
||||
/// 请求流式数据的API
|
||||
const API = '/agent/assistant/chat';
|
||||
const API = "/agent/assistant/chat";
|
||||
|
||||
/**
|
||||
* 获取AI聊天流式信息(仅微信小程序支持)
|
||||
@ -15,8 +15,8 @@ const API = '/agent/assistant/chat';
|
||||
let requestTask = null;
|
||||
let isAborted = false;
|
||||
let currentPromiseReject = null;
|
||||
let lastRequestId = null; // 记录上一次请求ID
|
||||
let activeRequestId = null; // 记录当前活动请求ID
|
||||
let lastRequestId = null; // 记录上一次请求ID
|
||||
let activeRequestId = null; // 记录当前活动请求ID
|
||||
|
||||
/**
|
||||
* 终止的请求
|
||||
@ -24,14 +24,14 @@ let activeRequestId = null; // 记录当前活动请求ID
|
||||
const stopAbortTask = () => {
|
||||
console.log("🛑 开始强制终止请求... ");
|
||||
isAborted = true;
|
||||
|
||||
|
||||
// 将当前活动请求ID保存为上一次请求ID
|
||||
lastRequestId = activeRequestId;
|
||||
// 清除当前活动请求ID
|
||||
activeRequestId = null;
|
||||
|
||||
if (currentPromiseReject) {
|
||||
currentPromiseReject(new Error('请求已被用户终止'));
|
||||
currentPromiseReject(new Error("请求已被用户终止"));
|
||||
currentPromiseReject = null;
|
||||
}
|
||||
|
||||
@ -39,16 +39,16 @@ const stopAbortTask = () => {
|
||||
// 先移除监听器,再终止请求
|
||||
const cleanupListeners = () => {
|
||||
try {
|
||||
if(requestTask.offChunkReceived) {
|
||||
console.log("======>offChunkReceived")
|
||||
if (requestTask.offChunkReceived) {
|
||||
console.log("======>offChunkReceived");
|
||||
requestTask.offChunkReceived();
|
||||
}
|
||||
if(requestTask.offHeadersReceived) {
|
||||
console.log("======>offHeadersReceived")
|
||||
if (requestTask.offHeadersReceived) {
|
||||
console.log("======>offHeadersReceived");
|
||||
requestTask.offHeadersReceived();
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('清理事件监听器失败:', e);
|
||||
console.error("清理事件监听器失败:", e);
|
||||
}
|
||||
};
|
||||
|
||||
@ -57,51 +57,53 @@ const stopAbortTask = () => {
|
||||
// 终止请求
|
||||
try {
|
||||
if (requestTask.abort) {
|
||||
console.log("======>abort")
|
||||
console.log("======>abort");
|
||||
requestTask.abort();
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('🛑 终止网络请求失败:', e);
|
||||
console.log("🛑 终止网络请求失败:", e);
|
||||
}
|
||||
|
||||
requestTask = null;
|
||||
}
|
||||
|
||||
console.log('🛑 请求强制终止完成');
|
||||
}
|
||||
console.log("🛑 请求强制终止完成");
|
||||
};
|
||||
|
||||
const agentChatStream = (params, onChunk) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
const token = uni.getStorageSync('token');
|
||||
const token = uni.getStorageSync("token");
|
||||
const requestId = Date.now().toString(); // 生成唯一请求ID
|
||||
|
||||
|
||||
// 重置状态
|
||||
isAborted = false;
|
||||
currentPromiseReject = reject;
|
||||
|
||||
|
||||
// 更新请求ID追踪
|
||||
lastRequestId = activeRequestId; // 保存上一次请求ID
|
||||
activeRequestId = requestId; // 设置新的活动请求ID
|
||||
lastRequestId = activeRequestId; // 保存上一次请求ID
|
||||
activeRequestId = requestId; // 设置新的活动请求ID
|
||||
|
||||
console.log(`🚀 发送请求 [${requestId}], 上一次请求ID [${lastRequestId}]`);
|
||||
|
||||
// 检查数据块是否来自已终止的请求
|
||||
const isStaleData = (dataRequestId) => {
|
||||
return dataRequestId === lastRequestId || dataRequestId !== activeRequestId;
|
||||
return (
|
||||
dataRequestId === lastRequestId || dataRequestId !== activeRequestId
|
||||
);
|
||||
};
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
requestTask = uni.request({
|
||||
url: BASE_URL + API, // 替换为你的接口地址
|
||||
method: 'POST',
|
||||
method: "POST",
|
||||
data: params,
|
||||
enableChunked: true,
|
||||
header: {
|
||||
Accept: 'text/event-stream',
|
||||
'Content-Type': 'application/json',
|
||||
Accept: "text/event-stream",
|
||||
"Content-Type": "application/json",
|
||||
Authorization: `Bearer ${token}`, // 如需token可加
|
||||
},
|
||||
responseType: 'arraybuffer',
|
||||
responseType: "arraybuffer",
|
||||
success(res) {
|
||||
if (!isAborted && !isStaleData(requestId)) {
|
||||
console.log(`✅ 请求 [${requestId}] 成功`);
|
||||
@ -122,43 +124,52 @@ const agentChatStream = (params, onChunk) => {
|
||||
// 使用 requestId 来验证请求有效性
|
||||
if (!isAborted && activeRequestId === requestId) {
|
||||
if (res.statusCode !== 200) {
|
||||
console.log(`❌ 请求 [${requestId}] 完成但状态错误,状态:`, res.statusCode);
|
||||
if(res.statusCode === 424) {
|
||||
uni.setStorageSync('token', '');
|
||||
console.log(
|
||||
`❌ 请求 [${requestId}] 完成但状态错误,状态:`,
|
||||
res.statusCode
|
||||
);
|
||||
if (res.statusCode === 424) {
|
||||
uni.setStorageSync("token", "");
|
||||
goLogin();
|
||||
}
|
||||
if (onChunk) {
|
||||
onChunk({
|
||||
error: true,
|
||||
message: '服务器错误',
|
||||
detail: res
|
||||
onChunk({
|
||||
error: true,
|
||||
message: "服务器错误",
|
||||
detail: res,
|
||||
});
|
||||
}
|
||||
reject(res);
|
||||
}
|
||||
} else {
|
||||
console.log(`❌ 请求 [${requestId}] ${isAborted ? '已终止' : '已过期'},忽略complete回调`);
|
||||
console.log(
|
||||
`❌ 请求 [${requestId}] ${
|
||||
isAborted ? "已终止" : "已过期"
|
||||
},忽略complete回调`
|
||||
);
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
requestTask.onHeadersReceived(res => {
|
||||
requestTask.onHeadersReceived((res) => {
|
||||
// 使用 requestId 验证请求有效性
|
||||
if (isAborted || activeRequestId !== requestId) {
|
||||
console.log(`🚫 Headers [${requestId}] ${isAborted ? '已终止' : '已过期'},忽略`);
|
||||
console.log(
|
||||
`🚫 Headers [${requestId}] ${isAborted ? "已终止" : "已过期"},忽略`
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(`📡 请求 [${requestId}] Headers接收:`, res);
|
||||
const status = res.statusCode || (res.header && res.header.statusCode);
|
||||
|
||||
|
||||
if (status && status !== 200) {
|
||||
console.log(`❌ 请求 [${requestId}] 服务器返回错误状态:`, status);
|
||||
if (onChunk && !isAborted && activeRequestId === requestId) {
|
||||
onChunk({
|
||||
error: true,
|
||||
message: `服务器错误(${status})`,
|
||||
detail: res
|
||||
onChunk({
|
||||
error: true,
|
||||
message: `服务器错误(${status})`,
|
||||
detail: res,
|
||||
});
|
||||
}
|
||||
// 终止异常请求
|
||||
@ -168,7 +179,7 @@ const agentChatStream = (params, onChunk) => {
|
||||
}
|
||||
});
|
||||
|
||||
requestTask.onChunkReceived(res => {
|
||||
requestTask.onChunkReceived((res) => {
|
||||
// 立即验证请求有效性
|
||||
if (isAborted || isStaleData(requestId)) {
|
||||
console.log(`🚫 数据块 [${requestId}] 已终止或过期,忽略`);
|
||||
@ -176,15 +187,15 @@ const agentChatStream = (params, onChunk) => {
|
||||
}
|
||||
|
||||
const base64 = uni.arrayBufferToBase64(res.data);
|
||||
let data = '';
|
||||
let data = "";
|
||||
try {
|
||||
data = decodeURIComponent(escape(weAtob(base64)));
|
||||
} catch (e) {
|
||||
console.error('Base64解码失败:', e);
|
||||
console.error("Base64解码失败:", e);
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("📦 onChunkReceived,res:", data)
|
||||
console.log("📦 onChunkReceived,res:", data);
|
||||
|
||||
// 再次验证请求有效性
|
||||
if (isAborted || activeRequestId !== requestId) {
|
||||
@ -193,7 +204,7 @@ const agentChatStream = (params, onChunk) => {
|
||||
}
|
||||
|
||||
const messages = parseSSEChunk(data);
|
||||
messages.forEach(msg => {
|
||||
messages.forEach((msg) => {
|
||||
if (!isAborted && !isStaleData(requestId) && onChunk) {
|
||||
onChunk(msg);
|
||||
}
|
||||
@ -201,14 +212,16 @@ const agentChatStream = (params, onChunk) => {
|
||||
});
|
||||
// #endif
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// window.atob兼容性处理
|
||||
const weAtob = (string) => {
|
||||
const b64re = /^(?:[A-Za-z\d+/]{4})*?(?:[A-Za-z\d+/]{2}(?:==)?|[A-Za-z\d+/]{3}=?)?$/;
|
||||
const b64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
|
||||
const b64re =
|
||||
/^(?:[A-Za-z\d+/]{4})*?(?:[A-Za-z\d+/]{2}(?:==)?|[A-Za-z\d+/]{3}=?)?$/;
|
||||
const b64 =
|
||||
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
|
||||
// 去除空白字符
|
||||
string = String(string).replace(/[\t\n\f\r ]+/g, '');
|
||||
string = String(string).replace(/[\t\n\f\r ]+/g, "");
|
||||
// 验证 Base64 编码
|
||||
if (!b64re.test(string)) {
|
||||
throw new TypeError(
|
||||
@ -218,15 +231,15 @@ const weAtob = (string) => {
|
||||
}
|
||||
|
||||
// 填充字符
|
||||
string += '=='.slice(2 - (string.length & 3));
|
||||
string += "==".slice(2 - (string.length & 3));
|
||||
|
||||
let bitmap,
|
||||
result = '',
|
||||
result = "",
|
||||
r1,
|
||||
r2,
|
||||
i = 0;
|
||||
|
||||
for (; i < string.length;) {
|
||||
for (; i < string.length; ) {
|
||||
bitmap =
|
||||
(b64.indexOf(string.charAt(i++)) << 18) |
|
||||
(b64.indexOf(string.charAt(i++)) << 12) |
|
||||
@ -236,10 +249,7 @@ const weAtob = (string) => {
|
||||
if (r1 === 64) {
|
||||
result += String.fromCharCode((bitmap >> 16) & 255);
|
||||
} else if (r2 === 64) {
|
||||
result += String.fromCharCode(
|
||||
(bitmap >> 16) & 255,
|
||||
(bitmap >> 8) & 255
|
||||
);
|
||||
result += String.fromCharCode((bitmap >> 16) & 255, (bitmap >> 8) & 255);
|
||||
} else {
|
||||
result += String.fromCharCode(
|
||||
(bitmap >> 16) & 255,
|
||||
@ -251,7 +261,6 @@ const weAtob = (string) => {
|
||||
return result;
|
||||
};
|
||||
|
||||
|
||||
// 解析SSE分段数据
|
||||
const parseSSEChunk = (raw) => {
|
||||
const results = [];
|
||||
@ -264,7 +273,7 @@ const parseSSEChunk = (raw) => {
|
||||
let dataLines = [];
|
||||
|
||||
for (const line of lines) {
|
||||
if (line.startsWith('data:')) {
|
||||
if (line.startsWith("data:")) {
|
||||
// 提取data:后面的内容并去除首尾空格
|
||||
dataLines.push(line.slice(5).trim());
|
||||
}
|
||||
@ -272,18 +281,18 @@ const parseSSEChunk = (raw) => {
|
||||
|
||||
if (dataLines.length > 0) {
|
||||
// 拼接多行数据
|
||||
const fullData = dataLines.join('\n');
|
||||
const fullData = dataLines.join("\n");
|
||||
try {
|
||||
const obj = JSON.parse(fullData);
|
||||
results.push(obj);
|
||||
} catch (e) {
|
||||
console.warn('⚠️ SSE数据解析失败:', e, '原始数据:', fullData);
|
||||
console.warn("⚠️ SSE数据解析失败:", e, "原始数据:", fullData);
|
||||
// 解析失败忽略
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return results;
|
||||
}
|
||||
};
|
||||
|
||||
export { agentChatStream, stopAbortTask }
|
||||
export { agentChatStream, stopAbortTask };
|
||||
|
||||
19
request/base/baseUrl.js
Normal file
19
request/base/baseUrl.js
Normal file
@ -0,0 +1,19 @@
|
||||
const isProd = false;
|
||||
|
||||
// 测试
|
||||
const VITE_BASE_URL_TEST = "https://onefeel.brother7.cn/ingress";
|
||||
const VITE_WSS_URL_TEST = "wss://onefeel.brother7.cn/ingress/agent/ws/chat";
|
||||
|
||||
// 生产
|
||||
const VITE_BASE_URL_PRO = "https://biz.nianxx.cn";
|
||||
const VITE_WSS_URL_PRO = "wss://biz.nianxx.cn/agent/ws/chat";
|
||||
|
||||
// 环境配置
|
||||
export const BASE_URL = isProd ? VITE_BASE_URL_PRO : VITE_BASE_URL_TEST;
|
||||
export const WSS_URL = isProd ? VITE_WSS_URL_PRO : VITE_WSS_URL_TEST;
|
||||
|
||||
// =====================================
|
||||
// 环境配置文件使用方法
|
||||
// console.log("当前环境:", import.meta.env);
|
||||
// export const BASE_URL = import.meta.env.VITE_BASE_URL;
|
||||
// export const WSS_URL = import.meta.env.VITE_WSS_URL;
|
||||
@ -1,4 +1,4 @@
|
||||
import { BASE_URL } from "../../constant/base";
|
||||
import { BASE_URL } from "./baseUrl";
|
||||
import { goLogin } from "@/hooks/useGoLogin";
|
||||
|
||||
const defaultConfig = {
|
||||
@ -50,10 +50,10 @@ function request(url, args = {}, method = "POST", customConfig = {}) {
|
||||
success: (res) => {
|
||||
console.log("请求响应:" + JSON.stringify(res));
|
||||
resolve(res.data);
|
||||
if (res.statusCode && res.statusCode === 424) {
|
||||
uni.setStorageSync("token", "");
|
||||
goLogin();
|
||||
}
|
||||
// if (res.statusCode && res.statusCode === 424) {
|
||||
// uni.setStorageSync("token", "");
|
||||
// goLogin();
|
||||
// }
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error("请求失败:", err);
|
||||
|
||||
@ -5,6 +5,7 @@ export const useAppStore = defineStore("app", {
|
||||
return {
|
||||
title: "",
|
||||
sceneId: "",
|
||||
hasToken: false,
|
||||
};
|
||||
},
|
||||
getters: {},
|
||||
@ -16,6 +17,9 @@ export const useAppStore = defineStore("app", {
|
||||
setSceneId(data) {
|
||||
this.sceneId = data;
|
||||
},
|
||||
setHasToken(data) {
|
||||
this.hasToken = data;
|
||||
},
|
||||
},
|
||||
|
||||
unistorage: true,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user