From e2b5e6bcbf38437b17b89535677260763a6bb562 Mon Sep 17 00:00:00 2001
From: xingyy <64720302+Concur-max@users.noreply.github.com>
Date: Thu, 23 Jan 2025 16:34:34 +0800
Subject: [PATCH] =?UTF-8?q?feat(env):=20=E6=B7=BB=E5=8A=A0=20websocket=20U?=
 =?UTF-8?q?RL=20=E5=B9=B6=E6=9B=B4=E6=96=B0=E7=9B=B4=E6=92=AD=E5=AE=A4?=
 =?UTF-8?q?=E7=9B=B8=E5=85=B3=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 在 .env.test 中添加 NUXT_PUBLIC_SOCKET_URL 配置项
- 在直播室页面中实现 websocket连接和消息监听
-优化拍卖详情获取逻辑
- 更新首页和详情页相关组件
---
 app/components/itemDetail/index.vue          |  4 ++--
 app/components/x-image/index.vue             |  4 +++-
 app/pages/home/components/ItemList/index.vue |  2 +-
 app/pages/home/index.vue                     |  8 +++++---
 app/pages/liveRoom/index.client.vue          | 21 +++++++++++++++++++-
 app/stores/goods/index.js                    |  4 +---
 env/.env.test                                |  2 +-
 nuxt.config.js                               |  4 +---
 8 files changed, 34 insertions(+), 15 deletions(-)

diff --git a/app/components/itemDetail/index.vue b/app/components/itemDetail/index.vue
index 4b82658..43ce8b2 100644
--- a/app/components/itemDetail/index.vue
+++ b/app/components/itemDetail/index.vue
@@ -43,8 +43,8 @@ const props = defineProps({
   </div>
   <div class="px-[16px] bg-#fff pt-12px pb-18px">
     <div class="text-[#575757] text-[14px] mb-4px">竞价表：</div>
-    <div>
-      <img src="@/static/images/1981736313.png" alt="">
+    <div v-if="detailInfo?.priceRuleType!=='diy'">
+      <xImage :src="detailInfo?.priceRuleImage" alt=""/>
     </div>
   </div>
 </div>
diff --git a/app/components/x-image/index.vue b/app/components/x-image/index.vue
index 0ac26e4..84325d9 100644
--- a/app/components/x-image/index.vue
+++ b/app/components/x-image/index.vue
@@ -1,6 +1,5 @@
 <script setup>
 import { showImagePreview } from 'vant';
-import { NuxtImg } from '#components'
 const props = defineProps({
   src: {
     type: String,
@@ -35,7 +34,9 @@ const showImage = () => {
 </script>
 
 <template>
+
   <nuxt-img
+      v-if="src"
       loading="lazy"
       v-bind="{ ...props, ...$attrs }"
       style="object-fit: cover"
@@ -46,6 +47,7 @@ const showImage = () => {
       :quality="quality"
       placeholder
   />
+  <van-empty v-else description="暂无" />
 </template>
 
 <style scoped>
diff --git a/app/pages/home/components/ItemList/index.vue b/app/pages/home/components/ItemList/index.vue
index 5da2c15..99ac880 100644
--- a/app/pages/home/components/ItemList/index.vue
+++ b/app/pages/home/components/ItemList/index.vue
@@ -57,7 +57,7 @@ const openShow = async (item) => {
         @refresh="onRefresh"
     >
       <template #success>
-        <van-icon name="success" /> 刷新成功
+        <van-icon name="success" /> <span>刷新成功</span>
       </template>
       <van-list
           v-model:loading="storeLoading"
diff --git a/app/pages/home/index.vue b/app/pages/home/index.vue
index bb96874..a69b6b1 100644
--- a/app/pages/home/index.vue
+++ b/app/pages/home/index.vue
@@ -3,16 +3,18 @@ import liveRoom from '@/pages/liveRoom/index.client.vue';
 import {goodStore} from "@/stores/goods/index.js";
 import ItemList from './components/ItemList/index.vue'
 import Cescribe from './components/Cescribe/index.vue'
-const {fullLive, liveRef,getAuctionDetail} = goodStore();
+const {fullLive,getAuctionDetail,auctionDetail} = goodStore();
 const changeLive = () => {
   fullLive.value = true;
 };
-getAuctionDetail()
+if (!auctionDetail.value.uuid){
+  await getAuctionDetail()
+}
 </script>
 <template>
   <div class="flex-grow-1">
     <client-only>
-      <liveRoom @click="changeLive" :class="['changeLive', fullLive ? 'expanded' : 'collapsed']" ref="liveRef"
+      <liveRoom @click="changeLive" :class="['changeLive', fullLive ? 'expanded' : 'collapsed']"
                 :fullLive="fullLive"/>
     </client-only>
     <div v-show="!fullLive" class="bg-#fff">
diff --git a/app/pages/liveRoom/index.client.vue b/app/pages/liveRoom/index.client.vue
index 9ebe87d..3617cfd 100644
--- a/app/pages/liveRoom/index.client.vue
+++ b/app/pages/liveRoom/index.client.vue
@@ -8,6 +8,10 @@ import {liveStore} from "~/stores/live/index.js";
 import paymentResults from '~/pages/liveRoom/components/PaymentResults/index.vue'
 import paymentInput from '~/pages/liveRoom/components/PaymentInput/index.vue'
 import xButton from '@/components/x-button/index.vue'
+import {goodStore} from "~/stores/goods/index.js";
+import {authStore} from "~/stores/auth/index.js";
+const {auctionDetail,getAuctionDetail} = goodStore();
+const { token } = authStore()
 const player = ref(null)
 const {quoteStatus, changeStatus, show, playerId, show1} = liveStore()
 const isPlayerReady = ref(false)
@@ -57,8 +61,23 @@ const initializePlayer = () => {
 }
 
 
-onMounted(() => {
+onMounted(async () => {
+  if (!auctionDetail.value.uuid){
+    await getAuctionDetail()
+  }
 /*  initializePlayer()*/
+  const { ws, messages, onMessage } = useWebSocket()
+
+// 连接
+  ws.connect('/api/v1/m/auction/live',{auctionUuid: auctionDetail.value.uuid,token:token.value})
+
+/*// 发送消息
+  ws.send({ type: 'chat', content: 'Hello!' })*/
+
+// 监听消息
+  onMessage((data) => {
+    console.log('收到消息:', data)
+  })
 })
 onBeforeUnmount(() => {
   if (player.value) {
diff --git a/app/stores/goods/index.js b/app/stores/goods/index.js
index 2ae4a0e..22f7e34 100644
--- a/app/stores/goods/index.js
+++ b/app/stores/goods/index.js
@@ -6,7 +6,6 @@ export const goodStore = createGlobalState(() => {
     // 状态定义
     const actionDetails = ref({})
     const fullLive = ref(false)
-    const liveRef = ref(null)
     const currentItem = ref({})
     const myArtWorks = ref([])
     const pageRef = ref({
@@ -34,7 +33,6 @@ export const goodStore = createGlobalState(() => {
             const res = await defaultDetail({})
             if (res.status === 0) {
                 auctionDetail.value = res.data
-                console.log('auctionDetail.value',auctionDetail.value)
             }
         } catch (err) {
             console.error('获取拍卖详情错误:', err)
@@ -98,7 +96,7 @@ export const goodStore = createGlobalState(() => {
         // 状态
         actionDetails,
         fullLive,
-        liveRef,
+
         currentItem,
         myArtWorks,
         pageRef,
diff --git a/env/.env.test b/env/.env.test
index c868895..fa995ff 100644
--- a/env/.env.test
+++ b/env/.env.test
@@ -2,6 +2,6 @@
 NUXT_PUBLIC_API_BASE=http://172.16.100.99:8005
 NUXT_PUBLIC_WS_URL=ws://test-ws.example.com
 NUXT_API_SECRET=test-secret
-
+NUXT_PUBLIC_SOCKET_URL=ws://172.16.100.99:8005
 # 阿里云播放器配置
 NUXT_PUBLIC_PLAYER_SOURCE=artc://live-pull-sh-01.szjixun.cn/live/live?auth_key=1737080180-0-0-42ad4cf26ba26eee78ca7de9c524d1e0
\ No newline at end of file
diff --git a/nuxt.config.js b/nuxt.config.js
index 6ea1eb8..8c83835 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -16,16 +16,14 @@ export default defineNuxtConfig({
     '@vant/nuxt',
     '@unocss/nuxt',
       '@nuxt/image',
-
     '@nuxtjs/i18n',
   ],
   runtimeConfig: {
     // 私有配置，只有在服务端可用
-    apiSecret: process.env.NUXT_API_SECRET || 'default_secret',
+    apiSecret: process.env.NUXT_API_SECRET,
     // 公共配置，客户端和服务端都可用
     public: publicConfig,
   },
-
   css: [
     '@unocss/reset/tailwind.css',
     '@/static/styles/default-theme.css',