.env.development

@@ -1,18 +1,33 @@
 VITE_APP_ENV=development
 
-VITE_APP_BASE_URL=https://service.xiaoyaotravel.com/api/
+# VITE_APP_BASE_URL=https://service.xiaoyaotravel.com/api/
 # VITE_APP_BASE_URL=http://1.94.207.143:8082/
+
+
+# VITE_APP_BASE_URL=http://192.168.1.43:8082
+# VITE_APP_IM_URL=ws://192.168.1.43:8082/system/message
+
 # 黄雯本地
-# VITE_APP_BASE_URL=http://192.168.137.226:8082
+VITE_APP_BASE_URL=http://192.168.1.44:8082
+VITE_APP_IM_URL=ws://192.168.1.44:8082/system/message
 # 黄雯花生壳
 # VITE_APP_BASE_URL=http://q9943037p3.goho.co
 
+# 张维本地
+# VITE_APP_BASE_URL=http://192.168.1.73:8082
+# VITE_APP_IM_URL=ws://192.168.1.73:8082/system/message
+
 # 李忠畅本地
 # VITE_APP_BASE_URL=http://192.168.1.38:8082
+# VITE_APP_IM_URL=ws://192.168.1.38:8082/system/message
 # 李忠畅花生壳
 # VITE_APP_BASE_URL=http://cilicli.qicp.vip
 # 测试服务器
-VITE_APP_BASE_URL=http://101.126.146.250:8082
+# VITE_APP_BASE_URL=http://192.168.1.204:8082
 # VITE_APP_BASE_URL=http://192.168.1.3:8082
 
+VITE_APP_WEBSITE_BASE_URL=http://101.126.146.250:8082
+
+# VITE_APP_IM_URL=ws://192.168.1.73:8082/system/message
+
 VITE_APP_IM_USER_SUFFIX=dev

.env.production

@@ -5,6 +5,9 @@ VITE_APP_BASE_URL=https://service.xiaoyaotravel.com/api/
 
 VITE_APP_IM_USER_SUFFIX=''
 
+VITE_APP_WEBSITE_BASE_URL=https://www.xiaoyaotravel.com
+
 
 VITE_APP_EMOJI_API=https://v.xiaoyaotravel.com/emoji/
 
+VITE_APP_IM_URL=wss://service.xiaoyaotravel.com/system/message

.env.staging

@@ -1,8 +1,12 @@
 VITE_APP_ENV=staging
 
 # VITE_APP_BASE_URL=https://api.ztzhipin.com/api/
-VITE_APP_BASE_URL=http://101.126.146.250:8082
+VITE_APP_BASE_URL=http://101.126.146.250:8088/api/
 
 VITE_APP_IM_USER_SUFFIX=''
 
-VITE_APP_EMOJI_API=https://t.xiaoyaotravel.com/emoji/
+VITE_APP_WEBSITE_BASE_URL=http://101.126.146.250:8086
+
+VITE_APP_EMOJI_API=https://t.xiaoyaotravel.com/emoji/
+
+VITE_APP_IM_URL=ws://101.126.146.250:8082/system/message

nuxt.config.ts

@@ -7,7 +7,10 @@ export default defineNuxtConfig({
   srcDir: 'src',
   compatibilityDate: '2024-04-03',
   devtools: { enabled: true },
-  css: ['./src/assets/iconfont/iconfont.css'],
+  css: [
+    './src/assets/iconfont/iconfont.css',
+    './src/assets/style/common.scss'
+  ],
   sourcemap: {
     server: true,
     client: true
@@ -44,7 +47,8 @@ export default defineNuxtConfig({
   },
   runtimeConfig: {
     public: {
-      baseApi: process.env.VITE_APP_BASE_URL
+      baseApi: process.env.VITE_APP_BASE_URL,
+      baseIM:process.env.VITE_APP_IM_URL
       // baseApi: '1234123'
     }
   },
@@ -75,7 +79,7 @@ export default defineNuxtConfig({
     css: {
       preprocessorOptions: {
         scss: {
-          additionalData: '@use "@/assets/style/element.scss";'
+          additionalData: '@use "@/assets/style/element.scss";',
         }
       }
     },

package.json

@@ -17,6 +17,7 @@
     "@popperjs/core": "^2.11.8",
     "@vueuse/core": "^11.1.0",
     "@vueuse/nuxt": "^11.1.0",
+    "accounting": "^0.4.1",
     "dayjs": "^1.11.13",
     "dayjs-nuxt": "^2.1.11",
     "lodash-es": "^4.17.21",
@@ -25,13 +26,14 @@
     "nanoid": "^5.0.8",
     "nuxt": "^3.13.0",
     "nuxt-icons": "^3.2.1",
-    "nuxt-swiper": "^1.2.2",
+    "nuxt-swiper": "^2.0.0",
     "nuxtjs-naive-ui": "^1.0.2",
     "pinia": "^2.2.4",
     "vue": "latest",
     "vue-cropper": "^1.1.4",
     "vue-draggable-plus": "^0.5.6",
-    "vue-router": "latest"
+    "vue-router": "latest",
+    "vue3-seamless-scroll": "^2.0.1"
   },
   "devDependencies": {
     "@css-render/vue3-ssr": "^0.15.14",

server/api/getGroupTypeList.js

@@ -0,0 +1,3 @@
+export default defineEventHandler(async (event) => {
+    
+})

src/assets/iconfont/demo_index.html

@@ -55,6 +55,204 @@
           <ul class="icon_lists dib-box">
           
             <li class="dib">
+              <span class="icon iconfont">&#xe7d6;</span>
+                <div class="name">star</div>
+                <div class="code-name">&amp;#xe7d6;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d7;</span>
+                <div class="name">edit-1</div>
+                <div class="code-name">&amp;#xe7d7;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d8;</span>
+                <div class="name">logout</div>
+                <div class="code-name">&amp;#xe7d8;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d9;</span>
+                <div class="name">chat-message</div>
+                <div class="code-name">&amp;#xe7d9;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7da;</span>
+                <div class="name">chevron-down</div>
+                <div class="code-name">&amp;#xe7da;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7db;</span>
+                <div class="name">caret-down-small</div>
+                <div class="code-name">&amp;#xe7db;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7dc;</span>
+                <div class="name">cart</div>
+                <div class="code-name">&amp;#xe7dc;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d5;</span>
+                <div class="name">delete-three</div>
+                <div class="code-name">&amp;#xe7d5;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d3;</span>
+                <div class="name">copy</div>
+                <div class="code-name">&amp;#xe7d3;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d4;</span>
+                <div class="name">quote</div>
+                <div class="code-name">&amp;#xe7d4;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d2;</span>
+                <div class="name">send</div>
+                <div class="code-name">&amp;#xe7d2;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7cd;</span>
+                <div class="name">comment-two</div>
+                <div class="code-name">&amp;#xe7cd;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7ce;</span>
+                <div class="name">eit</div>
+                <div class="code-name">&amp;#xe7ce;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7cf;</span>
+                <div class="name">comments</div>
+                <div class="code-name">&amp;#xe7cf;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d0;</span>
+                <div class="name">comment-one</div>
+                <div class="code-name">&amp;#xe7d0;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7d1;</span>
+                <div class="name">like</div>
+                <div class="code-name">&amp;#xe7d1;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c7;</span>
+                <div class="name">set-top</div>
+                <div class="code-name">&amp;#xe7c7;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c6;</span>
+                <div class="name">pic-two</div>
+                <div class="code-name">&amp;#xe7c6;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c8;</span>
+                <div class="name">close-remind</div>
+                <div class="code-name">&amp;#xe7c8;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c9;</span>
+                <div class="name">log</div>
+                <div class="code-name">&amp;#xe7c9;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7ca;</span>
+                <div class="name">jubaoguanli</div>
+                <div class="code-name">&amp;#xe7ca;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7cb;</span>
+                <div class="name">setting</div>
+                <div class="code-name">&amp;#xe7cb;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7cc;</span>
+                <div class="name">delete-one</div>
+                <div class="code-name">&amp;#xe7cc;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c0;</span>
+                <div class="name">close-one</div>
+                <div class="code-name">&amp;#xe7c0;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c1;</span>
+                <div class="name">slightly-smiling-face</div>
+                <div class="code-name">&amp;#xe7c1;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c2;</span>
+                <div class="name">pic</div>
+                <div class="code-name">&amp;#xe7c2;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c4;</span>
+                <div class="name">voice-one</div>
+                <div class="code-name">&amp;#xe7c4;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7c5;</span>
+                <div class="name">peoples-two</div>
+                <div class="code-name">&amp;#xe7c5;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe8ed;</span>
+                <div class="name">caret-up</div>
+                <div class="code-name">&amp;#xe8ed;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe77e;</span>
+                <div class="name">info-circle</div>
+                <div class="code-name">&amp;#xe77e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7ec;</span>
+                <div class="name">left</div>
+                <div class="code-name">&amp;#xe7ec;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7eb;</span>
+                <div class="name">right</div>
+                <div class="code-name">&amp;#xe7eb;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe7f4;</span>
+                <div class="name">menu</div>
+                <div class="code-name">&amp;#xe7f4;</div>
+              </li>
+          
+            <li class="dib">
               <span class="icon iconfont">&#xe78a;</span>
                 <div class="name">message</div>
                 <div class="code-name">&amp;#xe78a;</div>
@@ -92,7 +290,7 @@
           
             <li class="dib">
               <span class="icon iconfont">&#xe7c3;</span>
-                <div class="name">delete</div>
+                <div class="name">delete-two</div>
                 <div class="code-name">&amp;#xe7c3;</div>
               </li>
           
@@ -180,10 +378,10 @@
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1731999413855') format('woff2'),
-       url('iconfont.woff?t=1731999413855') format('woff'),
-       url('iconfont.ttf?t=1731999413855') format('truetype'),
-       url('iconfont.svg?t=1731999413855#iconfont') format('svg');
+  src: url('iconfont.woff2?t=1736823174249') format('woff2'),
+       url('iconfont.woff?t=1736823174249') format('woff'),
+       url('iconfont.ttf?t=1736823174249') format('truetype'),
+       url('iconfont.svg?t=1736823174249#iconfont') format('svg');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -210,6 +408,303 @@
         <ul class="icon_lists dib-box">
           
           <li class="dib">
+            <span class="icon iconfont icon-star1"></span>
+            <div class="name">
+              star
+            </div>
+            <div class="code-name">.icon-star1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-edit-1"></span>
+            <div class="name">
+              edit-1
+            </div>
+            <div class="code-name">.icon-edit-1
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-logout"></span>
+            <div class="name">
+              logout
+            </div>
+            <div class="code-name">.icon-logout
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-chat-message"></span>
+            <div class="name">
+              chat-message
+            </div>
+            <div class="code-name">.icon-chat-message
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-chevron-down"></span>
+            <div class="name">
+              chevron-down
+            </div>
+            <div class="code-name">.icon-chevron-down
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-caret-down-small"></span>
+            <div class="name">
+              caret-down-small
+            </div>
+            <div class="code-name">.icon-caret-down-small
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-cart"></span>
+            <div class="name">
+              cart
+            </div>
+            <div class="code-name">.icon-cart
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-delete-three"></span>
+            <div class="name">
+              delete-three
+            </div>
+            <div class="code-name">.icon-delete-three
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-copy"></span>
+            <div class="name">
+              copy
+            </div>
+            <div class="code-name">.icon-copy
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-quote"></span>
+            <div class="name">
+              quote
+            </div>
+            <div class="code-name">.icon-quote
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-send"></span>
+            <div class="name">
+              send
+            </div>
+            <div class="code-name">.icon-send
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-comment-two"></span>
+            <div class="name">
+              comment-two
+            </div>
+            <div class="code-name">.icon-comment-two
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-eit"></span>
+            <div class="name">
+              eit
+            </div>
+            <div class="code-name">.icon-eit
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-comments"></span>
+            <div class="name">
+              comments
+            </div>
+            <div class="code-name">.icon-comments
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-comment-one"></span>
+            <div class="name">
+              comment-one
+            </div>
+            <div class="code-name">.icon-comment-one
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-like"></span>
+            <div class="name">
+              like
+            </div>
+            <div class="code-name">.icon-like
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-set-top"></span>
+            <div class="name">
+              set-top
+            </div>
+            <div class="code-name">.icon-set-top
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-pic-two"></span>
+            <div class="name">
+              pic-two
+            </div>
+            <div class="code-name">.icon-pic-two
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-close-remind"></span>
+            <div class="name">
+              close-remind
+            </div>
+            <div class="code-name">.icon-close-remind
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-log"></span>
+            <div class="name">
+              log
+            </div>
+            <div class="code-name">.icon-log
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-jubaoguanli"></span>
+            <div class="name">
+              jubaoguanli
+            </div>
+            <div class="code-name">.icon-jubaoguanli
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-setting-one"></span>
+            <div class="name">
+              setting
+            </div>
+            <div class="code-name">.icon-setting-one
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-delete-one"></span>
+            <div class="name">
+              delete-one
+            </div>
+            <div class="code-name">.icon-delete-one
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-close-one"></span>
+            <div class="name">
+              close-one
+            </div>
+            <div class="code-name">.icon-close-one
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-slightly-smiling-face"></span>
+            <div class="name">
+              slightly-smiling-face
+            </div>
+            <div class="code-name">.icon-slightly-smiling-face
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-pic"></span>
+            <div class="name">
+              pic
+            </div>
+            <div class="code-name">.icon-pic
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-voice-one"></span>
+            <div class="name">
+              voice-one
+            </div>
+            <div class="code-name">.icon-voice-one
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-peoples-two"></span>
+            <div class="name">
+              peoples-two
+            </div>
+            <div class="code-name">.icon-peoples-two
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-caret-up"></span>
+            <div class="name">
+              caret-up
+            </div>
+            <div class="code-name">.icon-caret-up
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-info-circle"></span>
+            <div class="name">
+              info-circle
+            </div>
+            <div class="code-name">.icon-info-circle
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-left"></span>
+            <div class="name">
+              left
+            </div>
+            <div class="code-name">.icon-left
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-right"></span>
+            <div class="name">
+              right
+            </div>
+            <div class="code-name">.icon-right
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-menu"></span>
+            <div class="name">
+              menu
+            </div>
+            <div class="code-name">.icon-menu
+            </div>
+          </li>
+          
+          <li class="dib">
             <span class="icon iconfont icon-message"></span>
             <div class="name">
               message
@@ -264,11 +759,11 @@
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-delete"></span>
+            <span class="icon iconfont icon-delete-two"></span>
             <div class="name">
-              delete
+              delete-two
             </div>
-            <div class="code-name">.icon-delete
+            <div class="code-name">.icon-delete-two
             </div>
           </li>
           
@@ -400,6 +895,270 @@
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-star1"></use>
+                </svg>
+                <div class="name">star</div>
+                <div class="code-name">#icon-star1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-edit-1"></use>
+                </svg>
+                <div class="name">edit-1</div>
+                <div class="code-name">#icon-edit-1</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-logout"></use>
+                </svg>
+                <div class="name">logout</div>
+                <div class="code-name">#icon-logout</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-chat-message"></use>
+                </svg>
+                <div class="name">chat-message</div>
+                <div class="code-name">#icon-chat-message</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-chevron-down"></use>
+                </svg>
+                <div class="name">chevron-down</div>
+                <div class="code-name">#icon-chevron-down</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-caret-down-small"></use>
+                </svg>
+                <div class="name">caret-down-small</div>
+                <div class="code-name">#icon-caret-down-small</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-cart"></use>
+                </svg>
+                <div class="name">cart</div>
+                <div class="code-name">#icon-cart</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-delete-three"></use>
+                </svg>
+                <div class="name">delete-three</div>
+                <div class="code-name">#icon-delete-three</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-copy"></use>
+                </svg>
+                <div class="name">copy</div>
+                <div class="code-name">#icon-copy</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-quote"></use>
+                </svg>
+                <div class="name">quote</div>
+                <div class="code-name">#icon-quote</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-send"></use>
+                </svg>
+                <div class="name">send</div>
+                <div class="code-name">#icon-send</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-comment-two"></use>
+                </svg>
+                <div class="name">comment-two</div>
+                <div class="code-name">#icon-comment-two</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-eit"></use>
+                </svg>
+                <div class="name">eit</div>
+                <div class="code-name">#icon-eit</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-comments"></use>
+                </svg>
+                <div class="name">comments</div>
+                <div class="code-name">#icon-comments</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-comment-one"></use>
+                </svg>
+                <div class="name">comment-one</div>
+                <div class="code-name">#icon-comment-one</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-like"></use>
+                </svg>
+                <div class="name">like</div>
+                <div class="code-name">#icon-like</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-set-top"></use>
+                </svg>
+                <div class="name">set-top</div>
+                <div class="code-name">#icon-set-top</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-pic-two"></use>
+                </svg>
+                <div class="name">pic-two</div>
+                <div class="code-name">#icon-pic-two</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-close-remind"></use>
+                </svg>
+                <div class="name">close-remind</div>
+                <div class="code-name">#icon-close-remind</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-log"></use>
+                </svg>
+                <div class="name">log</div>
+                <div class="code-name">#icon-log</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-jubaoguanli"></use>
+                </svg>
+                <div class="name">jubaoguanli</div>
+                <div class="code-name">#icon-jubaoguanli</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-setting-one"></use>
+                </svg>
+                <div class="name">setting</div>
+                <div class="code-name">#icon-setting-one</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-delete-one"></use>
+                </svg>
+                <div class="name">delete-one</div>
+                <div class="code-name">#icon-delete-one</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-close-one"></use>
+                </svg>
+                <div class="name">close-one</div>
+                <div class="code-name">#icon-close-one</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-slightly-smiling-face"></use>
+                </svg>
+                <div class="name">slightly-smiling-face</div>
+                <div class="code-name">#icon-slightly-smiling-face</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-pic"></use>
+                </svg>
+                <div class="name">pic</div>
+                <div class="code-name">#icon-pic</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-voice-one"></use>
+                </svg>
+                <div class="name">voice-one</div>
+                <div class="code-name">#icon-voice-one</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-peoples-two"></use>
+                </svg>
+                <div class="name">peoples-two</div>
+                <div class="code-name">#icon-peoples-two</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-caret-up"></use>
+                </svg>
+                <div class="name">caret-up</div>
+                <div class="code-name">#icon-caret-up</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-info-circle"></use>
+                </svg>
+                <div class="name">info-circle</div>
+                <div class="code-name">#icon-info-circle</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-left"></use>
+                </svg>
+                <div class="name">left</div>
+                <div class="code-name">#icon-left</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-right"></use>
+                </svg>
+                <div class="name">right</div>
+                <div class="code-name">#icon-right</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-menu"></use>
+                </svg>
+                <div class="name">menu</div>
+                <div class="code-name">#icon-menu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-message"></use>
                 </svg>
                 <div class="name">message</div>
@@ -448,10 +1207,10 @@
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-delete"></use>
+                  <use xlink:href="#icon-delete-two"></use>
                 </svg>
-                <div class="name">delete</div>
-                <div class="code-name">#icon-delete</div>
+                <div class="name">delete-two</div>
+                <div class="code-name">#icon-delete-two</div>
             </li>
           
             <li class="dib">

src/assets/iconfont/iconfont.css

@@ -1,9 +1,9 @@
 @font-face {
   font-family: "iconfont"; /* Project id 4723464 */
-  src: url('iconfont.woff2?t=1731999413855') format('woff2'),
-       url('iconfont.woff?t=1731999413855') format('woff'),
-       url('iconfont.ttf?t=1731999413855') format('truetype'),
-       url('iconfont.svg?t=1731999413855#iconfont') format('svg');
+  src: url('iconfont.woff2?t=1736823174249') format('woff2'),
+       url('iconfont.woff?t=1736823174249') format('woff'),
+       url('iconfont.ttf?t=1736823174249') format('truetype'),
+       url('iconfont.svg?t=1736823174249#iconfont') format('svg');
 }
 
 .iconfont {
@@ -14,6 +14,138 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-star1:before {
+  content: "\e7d6";
+}
+
+.icon-edit-1:before {
+  content: "\e7d7";
+}
+
+.icon-logout:before {
+  content: "\e7d8";
+}
+
+.icon-chat-message:before {
+  content: "\e7d9";
+}
+
+.icon-chevron-down:before {
+  content: "\e7da";
+}
+
+.icon-caret-down-small:before {
+  content: "\e7db";
+}
+
+.icon-cart:before {
+  content: "\e7dc";
+}
+
+.icon-delete-three:before {
+  content: "\e7d5";
+}
+
+.icon-copy:before {
+  content: "\e7d3";
+}
+
+.icon-quote:before {
+  content: "\e7d4";
+}
+
+.icon-send:before {
+  content: "\e7d2";
+}
+
+.icon-comment-two:before {
+  content: "\e7cd";
+}
+
+.icon-eit:before {
+  content: "\e7ce";
+}
+
+.icon-comments:before {
+  content: "\e7cf";
+}
+
+.icon-comment-one:before {
+  content: "\e7d0";
+}
+
+.icon-like:before {
+  content: "\e7d1";
+}
+
+.icon-set-top:before {
+  content: "\e7c7";
+}
+
+.icon-pic-two:before {
+  content: "\e7c6";
+}
+
+.icon-close-remind:before {
+  content: "\e7c8";
+}
+
+.icon-log:before {
+  content: "\e7c9";
+}
+
+.icon-jubaoguanli:before {
+  content: "\e7ca";
+}
+
+.icon-setting-one:before {
+  content: "\e7cb";
+}
+
+.icon-delete-one:before {
+  content: "\e7cc";
+}
+
+.icon-close-one:before {
+  content: "\e7c0";
+}
+
+.icon-slightly-smiling-face:before {
+  content: "\e7c1";
+}
+
+.icon-pic:before {
+  content: "\e7c2";
+}
+
+.icon-voice-one:before {
+  content: "\e7c4";
+}
+
+.icon-peoples-two:before {
+  content: "\e7c5";
+}
+
+.icon-caret-up:before {
+  content: "\e8ed";
+}
+
+.icon-info-circle:before {
+  content: "\e77e";
+}
+
+.icon-left:before {
+  content: "\e7ec";
+}
+
+.icon-right:before {
+  content: "\e7eb";
+}
+
+.icon-menu:before {
+  content: "\e7f4";
+}
+
 .icon-message:before {
   content: "\e78a";
 }
@@ -38,7 +170,7 @@
   content: "\e791";
 }
 
-.icon-delete:before {
+.icon-delete-two:before {
   content: "\e7c3";
 }
 

src/assets/iconfont/iconfont.json

@@ -6,6 +6,237 @@
   "description": "",
   "glyphs": [
     {
+      "icon_id": "43103288",
+      "name": "star",
+      "font_class": "star1",
+      "unicode": "e7d6",
+      "unicode_decimal": 59350
+    },
+    {
+      "icon_id": "43103287",
+      "name": "edit-1",
+      "font_class": "edit-1",
+      "unicode": "e7d7",
+      "unicode_decimal": 59351
+    },
+    {
+      "icon_id": "43103286",
+      "name": "logout",
+      "font_class": "logout",
+      "unicode": "e7d8",
+      "unicode_decimal": 59352
+    },
+    {
+      "icon_id": "43103284",
+      "name": "chat-message",
+      "font_class": "chat-message",
+      "unicode": "e7d9",
+      "unicode_decimal": 59353
+    },
+    {
+      "icon_id": "43103285",
+      "name": "chevron-down",
+      "font_class": "chevron-down",
+      "unicode": "e7da",
+      "unicode_decimal": 59354
+    },
+    {
+      "icon_id": "43103282",
+      "name": "caret-down-small",
+      "font_class": "caret-down-small",
+      "unicode": "e7db",
+      "unicode_decimal": 59355
+    },
+    {
+      "icon_id": "43103283",
+      "name": "cart",
+      "font_class": "cart",
+      "unicode": "e7dc",
+      "unicode_decimal": 59356
+    },
+    {
+      "icon_id": "43078637",
+      "name": "delete-three",
+      "font_class": "delete-three",
+      "unicode": "e7d5",
+      "unicode_decimal": 59349
+    },
+    {
+      "icon_id": "43078629",
+      "name": "copy",
+      "font_class": "copy",
+      "unicode": "e7d3",
+      "unicode_decimal": 59347
+    },
+    {
+      "icon_id": "43078628",
+      "name": "quote",
+      "font_class": "quote",
+      "unicode": "e7d4",
+      "unicode_decimal": 59348
+    },
+    {
+      "icon_id": "43073198",
+      "name": "send",
+      "font_class": "send",
+      "unicode": "e7d2",
+      "unicode_decimal": 59346
+    },
+    {
+      "icon_id": "43073203",
+      "name": "comment-two",
+      "font_class": "comment-two",
+      "unicode": "e7cd",
+      "unicode_decimal": 59341
+    },
+    {
+      "icon_id": "43073202",
+      "name": "eit",
+      "font_class": "eit",
+      "unicode": "e7ce",
+      "unicode_decimal": 59342
+    },
+    {
+      "icon_id": "43073200",
+      "name": "comments",
+      "font_class": "comments",
+      "unicode": "e7cf",
+      "unicode_decimal": 59343
+    },
+    {
+      "icon_id": "43073199",
+      "name": "comment-one",
+      "font_class": "comment-one",
+      "unicode": "e7d0",
+      "unicode_decimal": 59344
+    },
+    {
+      "icon_id": "43073201",
+      "name": "like",
+      "font_class": "like",
+      "unicode": "e7d1",
+      "unicode_decimal": 59345
+    },
+    {
+      "icon_id": "43063382",
+      "name": "set-top",
+      "font_class": "set-top",
+      "unicode": "e7c7",
+      "unicode_decimal": 59335
+    },
+    {
+      "icon_id": "43063327",
+      "name": "pic-two",
+      "font_class": "pic-two",
+      "unicode": "e7c6",
+      "unicode_decimal": 59334
+    },
+    {
+      "icon_id": "43063326",
+      "name": "close-remind",
+      "font_class": "close-remind",
+      "unicode": "e7c8",
+      "unicode_decimal": 59336
+    },
+    {
+      "icon_id": "43063324",
+      "name": "log",
+      "font_class": "log",
+      "unicode": "e7c9",
+      "unicode_decimal": 59337
+    },
+    {
+      "icon_id": "43063325",
+      "name": "jubaoguanli",
+      "font_class": "jubaoguanli",
+      "unicode": "e7ca",
+      "unicode_decimal": 59338
+    },
+    {
+      "icon_id": "43063323",
+      "name": "setting",
+      "font_class": "setting-one",
+      "unicode": "e7cb",
+      "unicode_decimal": 59339
+    },
+    {
+      "icon_id": "43063322",
+      "name": "delete-one",
+      "font_class": "delete-one",
+      "unicode": "e7cc",
+      "unicode_decimal": 59340
+    },
+    {
+      "icon_id": "43062458",
+      "name": "close-one",
+      "font_class": "close-one",
+      "unicode": "e7c0",
+      "unicode_decimal": 59328
+    },
+    {
+      "icon_id": "43062459",
+      "name": "slightly-smiling-face",
+      "font_class": "slightly-smiling-face",
+      "unicode": "e7c1",
+      "unicode_decimal": 59329
+    },
+    {
+      "icon_id": "43062460",
+      "name": "pic",
+      "font_class": "pic",
+      "unicode": "e7c2",
+      "unicode_decimal": 59330
+    },
+    {
+      "icon_id": "43062461",
+      "name": "voice-one",
+      "font_class": "voice-one",
+      "unicode": "e7c4",
+      "unicode_decimal": 59332
+    },
+    {
+      "icon_id": "43062462",
+      "name": "peoples-two",
+      "font_class": "peoples-two",
+      "unicode": "e7c5",
+      "unicode_decimal": 59333
+    },
+    {
+      "icon_id": "6598341",
+      "name": "caret-up",
+      "font_class": "caret-up",
+      "unicode": "e8ed",
+      "unicode_decimal": 59629
+    },
+    {
+      "icon_id": "4765727",
+      "name": "info-circle",
+      "font_class": "info-circle",
+      "unicode": "e77e",
+      "unicode_decimal": 59262
+    },
+    {
+      "icon_id": "4767012",
+      "name": "left",
+      "font_class": "left",
+      "unicode": "e7ec",
+      "unicode_decimal": 59372
+    },
+    {
+      "icon_id": "4767011",
+      "name": "right",
+      "font_class": "right",
+      "unicode": "e7eb",
+      "unicode_decimal": 59371
+    },
+    {
+      "icon_id": "4767059",
+      "name": "menu",
+      "font_class": "menu",
+      "unicode": "e7f4",
+      "unicode_decimal": 59380
+    },
+    {
       "icon_id": "4765866",
       "name": "message",
       "font_class": "message",
@@ -49,8 +280,8 @@
     },
     {
       "icon_id": "4766676",
-      "name": "delete",
-      "font_class": "delete",
+      "name": "delete-two",
+      "font_class": "delete-two",
       "unicode": "e7c3",
       "unicode_decimal": 59331
     },

src/assets/style/common.scss

@@ -0,0 +1,29 @@
+.xao-yao-dialog {
+  padding: 0 !important;
+  border-radius: 12px;
+
+  .el-dialog__header {
+    padding: 20px;
+    box-sizing: border-box;
+    //background: #55a532;
+    position: relative;
+    border-bottom: 1px solid #D9D9D9;
+    .el-dialog__title {
+      color: #333333;
+      font-size: 16px;
+    }
+    .el-dialog__headerbtn {
+      height: 100%;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+  }
+  &.xao-yao-dialog__body--padding .el-dialog__body {
+    padding: 20px;
+    box-sizing: border-box;
+  }
+  &.xao-yao-dialog__body--padding-h .el-dialog__body {
+    padding: 20px 0;
+    box-sizing: border-box;
+  }
+}

src/assets/style/element.scss

@@ -1,5 +1,12 @@
+@forward 'element-plus/theme-chalk/src/common/var.scss' with (
+  $colors: (
+    "primary": ("base": rgba(253, 154, 0, 1)),
+     'info': ( 'base': #999999 ),
+  ),
+);
+
 :root {
   --el-color-primary: rgba(253, 154, 0, 1);
   --el-color-primary-light-3: rgba(253, 154, 0, 0.8);
   --el-color-primary-dark-2: rgba(253, 154, 0, 0.95);
-}
+}

src/components/Car/Search/CarList/Item.vue

@@ -27,7 +27,7 @@
       </div>
       <div class="flex items-center">
         <span class="flex-1 truncate text-3xl font-semibold text-[#FF1D1D]"
-          >{{ itemData.price }}{{ itemData.unit }}</span
+          >{{ itemData.unit }}{{ itemData.price }}</span
         >
         <span class="shrink-0 text-sm text-black-9">(10小时)</span>
       </div>

src/components/Home/BannerList/index.client.vue

@@ -0,0 +1,62 @@
+<template>
+  <!-- <Swiper
+    :modules="[SwiperAutoplay, SwiperPagination, SwiperEffectCreative]"
+    :loop="true"
+    :slides-per-view="1"
+    :pagination="{ clickable: true }"
+    :autoplay="{
+      delay: 5000,
+      disableOnInteraction: true
+    }"
+  >
+    <SwiperSlide v-for="item in bannerData">
+      <img
+        :src="item.imgUrlsAfterConvert[0]"
+        class="aspect-[1920/697] w-full object-cover"
+      />
+    </SwiperSlide>
+  </Swiper> -->
+  <!-- <el-carousel :interval="5000" style="height: calc(100vw * 0.36)">
+    <el-carousel-item
+      v-for="item in bannerData"
+      :key="item.id"
+      style="height: calc(100vw * 0.36)"
+    >
+      <img
+        :src="item.imgUrlsAfterConvert[0]"
+        class="h-full w-full object-cover"
+      />
+    </el-carousel-item>
+  </el-carousel> -->
+  <swiper-container ref="containerRef">
+    <swiper-slide v-for="item in bannerData" :key="item.id">
+      <img
+        :src="item.imgUrlsAfterConvert[0]"
+        class="aspect-[1920/697] w-screen object-cover"
+      />
+    </swiper-slide>
+  </swiper-container>
+</template>
+
+<script setup>
+const props = defineProps({
+  bannerData: Array
+})
+
+const containerRef = ref(null)
+const swiper = useSwiper(containerRef, {
+  effect: 'creative',
+  loop: true,
+  pagination: {
+    clickable: true
+  },
+  autoplay: {
+    delay: 5000
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+.swiper {
+}
+</style>

src/components/Home/BannerList/index.vue

@@ -1,27 +0,0 @@
-<template>
-  <Swiper
-    :modules="[SwiperAutoplay, SwiperPagination, SwiperEffectCreative]"
-    :loop="true"
-    :slides-per-view="1"
-    :pagination="{ clickable: true }"
-    :autoplay="{
-      delay: 5000,
-      disableOnInteraction: true
-    }"
-  >
-    <SwiperSlide v-for="item in bannerData">
-      <img
-        :src="item.imgUrlsAfterConvert[0]"
-        class="aspect-[1920/697] w-full object-cover"
-      />
-    </SwiperSlide>
-  </Swiper>
-</template>
-
-<script setup>
-const props = defineProps({
-  bannerData: Array
-})
-</script>
-
-<style lang="scss" scoped></style>

src/components/Home/Menu/index.vue

@@ -104,6 +104,10 @@ const otherMenuData = ref([
   {
     title: '签证居留申请',
     to: '/visa'
+  },
+  {
+    title: '旅游项目',
+    to: '/t'
   }
   // {
   //   title: '出国劳务',

src/components/MultiHeader/index.vue

@@ -0,0 +1,202 @@
+<template>
+  <div class="round-comp">
+    <template v-if="list.length">
+      <div class="round" :class="`round--${length}`">
+        <div class="round--center">
+          <div v-for="(img, i) in list" :key="i" class="header">
+            <img
+                width="100%"
+                height="100%"
+                class="w-full h-full object-cover"
+                :src="img"
+                alt=""
+            />
+          </div>
+        </div>
+      </div>
+    </template>
+  </div>
+</template>
+<script setup>
+const props = defineProps({
+  size: {
+    type: Number,
+    default: 48
+  },
+  imgUrls: Array,
+})
+
+const length = ref(0);
+const list = ref([]);
+
+const initStyle = () => {
+  const root = document.documentElement;
+  const size = props.size;
+  root.style.setProperty('--round-size', size + 'px');
+  root.style.setProperty('--round-size-header', size * 22/44 + 'px');
+  root.style.setProperty('--round-size-sm-header', size * 15/44 + 'px');
+}
+
+const initData = () => {
+  list.value = (props.imgUrls ?? []).slice(0, 9);
+  length.value = list.value.length;
+}
+onMounted(() => {
+  initStyle();
+  initData();
+});
+
+</script>
+<style scoped lang="scss">
+.round-comp {
+  width: var(--round-size);
+  height: var(--round-size);
+  background: #F7F8FA;
+  border-radius: 100%;
+}
+.round {
+  //margin: 10px auto;
+  width: var(--round-size);
+  height: var(--round-size);
+  background: #F7F8FA;
+  border-radius: 100%;
+  overflow: clip;
+  position: relative;
+
+  .round--center {
+    height: 100%;
+    position: absolute;
+    display: grid;
+    gap: 1px;
+    align-items: center;
+    justify-items: center;
+    align-content: center;
+    justify-content: center;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    .header {
+      text-align: center;
+      font-size: 12px;
+    }
+  }
+}
+
+.round--1 {
+  .round--center {
+    .header {
+      width: var(--round-size);
+      height: var(--round-size);
+    }
+  }
+
+}
+
+.round--2 {
+  .round--center {
+    grid-template-columns: auto auto;
+    grid-template-rows: auto;
+    .header {
+      width: var(--round-size-header);
+      height: var(--round-size-header);
+    }
+  }
+}
+
+.round--3 {
+  .round--center {
+    grid-template-columns: auto auto;
+    grid-template-rows: auto auto;
+  }
+
+  .header {
+    width: var(--round-size-header);
+    height: var(--round-size-header);
+
+    &:nth-child(1) {
+      grid-column: 1 / span 2;
+    }
+  }
+}
+
+.round--4 {
+  .round--center {
+    grid-template-columns: auto auto;
+    grid-template-rows: auto auto;
+    .header {
+      width: var(--round-size-header);
+      height: var(--round-size-header);
+    }
+  }
+}
+
+.round--5 {
+  .round--center {
+    grid-template-columns: auto auto auto auto auto auto;
+    grid-template-rows: auto auto;
+    .header {
+      width: var(--round-size-sm-header);
+      height: var(--round-size-sm-header);
+      grid-column: span 2;
+      &:nth-child(1) {
+        grid-column: 2 / span 2;
+      }
+      &:nth-child(2) {
+        grid-column: 4 / span 2;
+      }
+    }
+  }
+}
+
+.round--6 {
+  .round--center {
+    grid-template-columns: auto auto auto;
+    grid-template-rows: auto auto;
+    .header {
+      width: var(--round-size-sm-header);
+      height: var(--round-size-sm-header);
+    }
+  }
+}
+
+.round--7 {
+  .round--center {
+    grid-template-columns: auto auto auto;
+    grid-template-rows: auto auto;
+    .header {
+      width: var(--round-size-sm-header);
+      height: var(--round-size-sm-header);
+      &:nth-child(1) {
+        grid-column: 1 / span 3;
+      }
+    }
+  }
+}
+.round--8 {
+  .round--center {
+    grid-template-columns: auto auto auto auto auto auto;
+    grid-template-rows: auto auto;
+    .header {
+      width: var(--round-size-sm-header);
+      height: var(--round-size-sm-header);
+      grid-column: span 2;
+      &:nth-child(1) {
+        grid-column: 2 / span 2;
+      }
+      &:nth-child(2) {
+        grid-column: 4 / span 2;
+      }
+    }
+  }
+}
+.round--9 {
+  .round--center {
+    grid-template-columns: auto auto auto;
+    grid-template-rows: auto auto;
+    .header {
+      width: var(--round-size-sm-header);
+      height: var(--round-size-sm-header);
+    }
+  }
+}
+</style>

src/components/NavBar/Login.client.vue

@@ -1,12 +1,12 @@
 <template>
   <template v-if="!token">
-    <NuxtLink
-      :to="`/login?redirect=${$route.fullPath}`"
+    <div
+      @click="handleToLogin"
       class="flex h-32 cursor-pointer items-center space-x-5 rounded-full bg-white px-20 text-base text-primary"
     >
       <span>登录</span>
       <span class="iconfont icon-profile" style="font-size: 18px"></span>
-    </NuxtLink>
+    </div>
   </template>
 
   <div v-else class="flex items-center space-x-10 text-sm">
@@ -35,15 +35,18 @@
           mode="vertical"
           unique-opened
           class="el-menu-vertical-demo"
+          active-text-color="#FD9A00"
           style="
             --el-menu-item-height: 30px;
             --el-menu-sub-item-height: 30px;
             --el-menu-item-font-size: 12px;
             --el-menu-text-color: #333;
+            --el-menu-active-color: #fd9a00;
           "
         >
           <el-sub-menu index="1">
             <template #title>
+              <span class="iconfont icon-cart mr-6"></span>
               <span>我的订单</span>
             </template>
             <el-menu-item index="1-1">
@@ -55,20 +58,27 @@
             <el-menu-item index="1-3">
               <NuxtLink to="/profile/visa-orders">签证订单</NuxtLink>
             </el-menu-item>
-            <el-menu-item index="1-4">
+            <!--            <el-menu-item index="1-4">
               <NuxtLink to="/profile/my-comment">我的评论</NuxtLink>
-            </el-menu-item>
+            </el-menu-item>-->
             <!-- <el-menu-item index="1-4">
               <NuxtLink to="/profile/labour-orders">劳务投递</NuxtLink>
             </el-menu-item> -->
           </el-sub-menu>
           <el-menu-item>
+            <span class="iconfont icon-edit-1 mr-6"></span>
             <NuxtLink to="/profile/notes">我的游记</NuxtLink>
           </el-menu-item>
           <el-menu-item>
+            <span class="iconfont icon-star1 mr-6"></span>
             <NuxtLink to="/profile/collection">我的收藏</NuxtLink>
           </el-menu-item>
           <el-menu-item>
+            <span class="iconfont icon-chat-message mr-6"></span>
+            <NuxtLink to="/chat">我的消息</NuxtLink>
+          </el-menu-item>
+          <el-menu-item>
+            <span class="iconfont icon-logout mr-6"></span>
             <span @click="handleLogout">退出登录</span>
           </el-menu-item>
         </el-menu>
@@ -112,6 +122,20 @@ const { token } = storeToRefs(authStore)
 const userInfoStore = useUserInfoStore()
 const { userInfo } = storeToRefs(userInfoStore)
 
+const chatStore = useChatStore()
+
+const route = useRoute()
+async function handleToLogin() {
+  await navigateTo({
+    path: '/login',
+    query: {
+      redirect: route.path,
+      ...route.query
+    },
+    replace: true
+  })
+}
+
 watch(
   token,
   () => {
@@ -129,6 +153,8 @@ async function handleLogout() {
     authStore.cleanToken()
     navigateTo('/')
   }
+  // 关闭socket连接
+  chatStore.close();
 }
 </script>
 
@@ -136,4 +162,8 @@ async function handleLogout() {
 :deep(.el-menu) {
   border-right: none;
 }
+:deep(.el-menu-item:hover),
+:deep(.el-sub-menu__title:hover) {
+  color: #fd9a00;
+}
 </style>

src/components/NavBar/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="fixed left-0 right-0 top-0 z-[999] flex h-60 items-center justify-center bg-white shadow-[0_4px_4px_0_rgba(0,0,0,0.1)]"
+    class="fixed left-0 right-0 top-0 z-[600] flex h-60 items-center justify-center bg-white shadow-[0_4px_4px_0_rgba(0,0,0,0.1)]"
   >
     <NuxtLink to="/" class="absolute left-50">
       <img src="~/assets/img/nav_bar/logo.png" class="h-32 w-60" />

src/components/Profile/Home/Tabs.vue

@@ -30,6 +30,7 @@ import profile_tab_travel_note from '~/assets/img/profile/profile_tab_travel_not
 import profile_tab_travel_order from '~/assets/img/profile/profile_tab_travel_order.png'
 import profile_tab_travel_visa from '~/assets/img/profile/profile_tab_travel_visa.png'
 import profile_my_comment from '~/assets/img/profile/profile_my_comment.png'
+import profile_my_wallet from '~/assets/img/profile/profile_my_wallet.png'
 
 const tabs = [
   {
@@ -54,19 +55,29 @@ const tabs = [
   // },
 
   {
+    label: '我的游记',
+    icon: profile_tab_travel_note,
+    to: '/profile/notes'
+  },
+  {
     label: '我的收藏',
     icon: profile_tab_collect,
     to: '/profile/collection'
   },
   {
-    label: '我的游记',
-    icon: profile_tab_travel_note,
-    to: '/profile/notes'
+    label: '我的消息',
+    icon: profile_my_comment,
+    to: '/chat'
   },
-  {
-    label: '我的评论',
+  /*{
+    label: '我的评论',s
     icon: profile_my_comment,
     to: '/profile/my-comment'
+  },*/
+  {
+    label: '我的返利',
+    icon: profile_my_wallet,
+    to: '/profile/wallet'
   }
 ]
 

src/components/RecommendTravelPinTuanProject/index.vue

@@ -0,0 +1,84 @@
+<template>
+  <div
+    class="rounded-6xl bg-white px-20 py-15 shadow-[0px_3px_11px_1px_rgba(93,93,93,0.2)]"
+  >
+    <div class="flex items-center space-x-10">
+      <img
+        src="~/assets/img/recomend_travel_note_icon.jpg"
+        class="h-41 w-54 object-cover"
+        alt=""
+        srcset=""
+      />
+      <div class="text-2xl font-bold text-black-3">拼团项目</div>
+    </div>
+    <div class="mt-5 divide-y">
+      <NuxtLink
+        :to="`/t/${item.projectId}`"
+        target="_blank"
+        class="group flex cursor-pointer items-center space-x-10 py-15"
+        v-for="(item, index) in dataList"
+        :key="item.id"
+      >
+        <div
+          class="flex h-18 w-18 shrink-0 items-center justify-center rounded text-base text-white"
+          :style="{ backgroundColor: colorByIndex(index + 1) }"
+        >
+          {{ index + 1 }}
+        </div>
+        <img
+          :src="item.image"
+          class="h-70 w-95 shrink-0 rounded-xl object-cover"
+          alt=""
+        />
+        <div class="w-0 flex-1">
+          <div
+            class="truncate text-xl font-semibold text-black-3 group-hover:text-linkHover"
+          >
+            {{ item.title }}
+          </div>
+          <div
+            class="mt-5 flex items-center justify-between space-x-20 text-base"
+          >
+            <div class="flex-1 truncate text-black-6">
+              {{ item.nowCount }} /{{ item.maxCount }}人团
+            </div>
+
+            <div class="shrink-0 font-bold text-[#FF1B1B]">
+              {{ item.priceUnit }}{{ item.adultPrice }}
+            </div>
+          </div>
+        </div>
+      </NuxtLink>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  count: {
+    type: Number,
+    default: 3
+  }
+})
+
+const { data } = await useMyFetch(
+  `website/app/tourProjectGroupPurchase/list?pageNum=1&pageSize=${props.count}`
+)
+
+function colorByIndex(index) {
+  switch (index) {
+    case 1:
+      return '#fd9a00'
+    case 2:
+      return '#33b724'
+    case 3:
+      return '#f02626'
+    default:
+      return '#ccd5e4'
+  }
+}
+
+const dataList = computed(() => data.value?.dataList ?? [])
+</script>
+
+<style lang="scss" scoped></style>

src/components/RecommendTravelProject/index.vue

@@ -47,7 +47,7 @@
               {{ item.shortDescription }}
             </div>
             <div v-if="item.price" class="shrink-0 font-bold text-[#FF1B1B]">
-              {{ item.price }} {{ item.priceUnit }}
+              {{ item.priceUnit }}{{ item.price }}
             </div>
           </div>
         </div>

src/components/TravelDetail/BaseInfo.vue

@@ -1,45 +1,38 @@
 <template>
   <div class="text-base">
-    <div class="text-3xl font-semibold text-black-3">
-      {{ data.projectTitle }}
-    </div>
-    <div class="mt-5 text-[#666666]">
-      {{ data.remarks }}
-    </div>
-    <div class="mt-15 h-1 bg-line"></div>
-    <div class="mt-15 flex items-center space-x-5 font-semibold text-[#FD9A00]">
-      <span>[{{ data.startPlace }}出发]</span>
-      <span>[{{ data.countTimes }}]</span>
-    </div>
-    <div class="mt-5 flex flex-wrap items-center gap-7">
+    <div class="min-h-250">
+      <div class="text-3xl font-semibold text-black-3">
+        {{ data.projectTitle }}
+      </div>
+      <div class="mt-10 flex flex-wrap items-center gap-7">
+        <div
+          v-for="item in lableList"
+          :key="item"
+          class="flex h-20 items-center justify-center rounded border border-current px-10 text-sm text-[#FD9A00]"
+        >
+          {{ item }}
+        </div>
+      </div>
       <div
-        v-for="item in lableList"
-        :key="item"
-        class="flex h-20 items-center justify-center rounded-sm border border-current px-5 text-sm text-[#FF7043]"
+        class="mt-16 flex w-full items-start space-x-5 rounded-xl bg-[#F8F8F8] px-20 py-10"
       >
-        {{ item }}
+        <span
+          class="text-base leading-6xl text-black-6"
+          v-html="data.sellingPoint?.replace(/\n/g, '<br/>')"
+        ></span>
       </div>
     </div>
-    <div class="mt-15 h-1 bg-line"></div>
-    <div class="mt-15 flex w-full items-start space-x-5">
-      <img
-        src="~/assets/img/travel_detail/travel_detail_maidian.png"
-        width="40"
-        height="20"
-      />
-      <span
-        class="text-black-6"
-        v-html="data.sellingPoint?.replace(/\n/g, '<br/>')"
-      ></span>
-    </div>
-    <div class="mt-15 h-1 bg-line"></div>
-    <div class="mt-15">
-      <span class="text-4xl font-semibold text-[#FF2222]"
-        ><template v-if="data.price"
-          >{{ data.price }} {{ data.priceUnit }}</template
-        ><template v-else>???? {{ data.priceUnit }}</template>
-      </span>
-      <span class="text-black-9">/人起</span>
+    <div class="mt-17 flex items-center justify-between">
+      <div>
+        <span class="text-4xl font-semibold text-[#FF2222]"
+          ><template v-if="data.price"
+            >{{ data.priceUnit }} {{ data.price }} </template
+          ><template v-else> {{ data.priceUnit }} ???? </template>
+        </span>
+        <span class="text-black-9">/人起</span>
+      </div>
+      <TravelDetailPinTuanKaiTuanButton v-if="data.hasGroup == 0" />
+      <TravelDetailNomalBookButton v-else-if="data.hasGroup == 1" />
     </div>
   </div>
 </template>

src/components/TravelDetail/NomalBookButton.vue

@@ -0,0 +1,39 @@
+<template>
+  <div>
+    <el-button @click="handleBook" type="primary" size="large"
+      >单独购买</el-button
+    >
+    <TravelDetailNomalBookModal
+      v-model:show="nomalBookModalOptions.show"
+      :startDate="startDate"
+      :adult-number="adultNumber"
+      :children-number="childrenNumber"
+    />
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  startDate: {
+    type: String,
+    default: null
+  },
+  adultNumber: {
+    type: Number,
+    default: 1
+  },
+  childrenNumber: {
+    type: Number,
+    default: 0
+  }
+})
+const nomalBookModalOptions = reactive({
+  show: false
+})
+async function handleBook() {
+  await needLogin()
+  nomalBookModalOptions.show = true
+}
+</script>
+
+<style lang="scss" scoped></style>

src/components/TravelDetail/NomalBookInfo.client.vue

@@ -0,0 +1,174 @@
+<template>
+  <div class="flex items-end bg-[#FD9A001A] px-20 py-20">
+    <div class="flex flex-1 space-x-40">
+      <div class="flex flex-col space-y-10 text-base text-black-3">
+        <div>出发时间</div>
+        <el-date-picker
+          v-model="bookInfo.startDate"
+          value-format="YYYY-MM-DD"
+          type="date"
+          placeholder="选择出发时间"
+          size="large"
+          style="width: 240px"
+          :disabled-date="
+            (d) => !availableDateList.includes($dayjs(d).format('YYYY-MM-DD'))
+          "
+        />
+      </div>
+      <div class="flex flex-col space-y-10 text-base text-black-3">
+        <div class="flex items-end space-x-10">
+          <span>成人</span>
+          <span class="text-sm text-black-9">12周岁及以上</span>
+        </div>
+
+        <el-select
+          v-model="bookInfo.adultNumber"
+          placeholder="选择成人数量"
+          style="width: 240px"
+          size="large"
+        >
+          <el-option
+            v-for="item in adultCountOptions"
+            :key="item"
+            :label="`${item}人`"
+            :value="item"
+          />
+        </el-select>
+      </div>
+      <div class="flex flex-col space-y-10 text-base text-black-3">
+        <div class="flex items-end space-x-10">
+          <span>儿童</span>
+          <span class="text-sm text-black-9"
+            >3周岁至未满12周岁(3周岁以下免费)</span
+          >
+        </div>
+
+        <el-select
+          v-model="bookInfo.childrenNumber"
+          placeholder="选择儿童数量"
+          style="width: 240px"
+          size="large"
+        >
+          <el-option
+            v-for="item in childrenCountOptions"
+            :key="item"
+            :label="`${item}人`"
+            :value="item"
+          />
+        </el-select>
+      </div>
+    </div>
+
+    <div class="text-sm text-black-6">
+      <span>总价&nbsp; </span>
+      <span>￥</span>
+      <span class="text-3xl text-[#FF2525]">{{
+        priceToArray(totalPrice)[0]
+      }}</span>
+      <span class="text-[#FF2525]">.{{ priceToArray(totalPrice)[1] }}</span>
+      <span>/人起&nbsp; </span>
+      <el-popover placement="top-start" :width="260" trigger="hover">
+        <template #reference>
+          <span
+            class="iconfont icon-info-circle cursor-pointer text-primary"
+          ></span>
+        </template>
+        <div class="text-base text-black-3">
+          <div class="text-xl font-semibold">价格详情</div>
+          <div class="mt-15 flex items-center justify-between font-semibold">
+            <span class=" ">基本团费</span>
+            <span>￥{{ totalPrice }}</span>
+          </div>
+          <div class="my-15 h-1 bg-[#F0F0F0]"></div>
+          <div class="flex items-center justify-between">
+            <span class="text-base">成人</span>
+            <span>￥{{ adultTotalPrice }}</span>
+          </div>
+          <div class="mt-10 flex items-center justify-between">
+            <span class="text-base">儿童</span>
+            <span>￥{{ childrenTotalPrice }}</span>
+          </div>
+          <div class="my-15 h-1 bg-[#F0F0F0]"></div>
+          <div class="flex items-center justify-end space-x-10">
+            <span class="text-xl font-semibold">总价</span>
+            <span class="text-4xl font-semibold text-[#FF0000]"
+              >{{ data.priceUnit }}{{ totalPrice }}</span
+            >
+          </div>
+        </div>
+      </el-popover>
+    </div>
+    <TravelDetailNomalBookButton
+      style="margin-left: 10px"
+      :start-date="bookInfo.startDate"
+      :adult-number="bookInfo.adultNumber"
+      :children-number="bookInfo.childrenNumber"
+    />
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => ({})
+  }
+})
+const id = useRouteParam('id')
+
+const dayjs = useDayjs()
+
+const bookInfo = reactive({
+  startDate: null,
+  adultNumber: 1,
+  childrenNumber: 0
+})
+
+const adultCountOptions = Array.from({ length: 9 }, (_, i) => i + 1)
+const childrenCountOptions = Array.from({ length: 10 }, (_, i) => i)
+
+const calendarData = ref({})
+
+const availableDateList = computed(() => Object.keys(calendarData.value ?? []))
+
+async function getCalendarData() {
+  const { data } = await request('/website/tourism/project/viewDatePrice', {
+    query: {
+      projectId: id.value
+    }
+  })
+  calendarData.value = data.tourismProjectDatePriceVos ?? {}
+  const minDay = dayjs.min(Object.keys(calendarData.value).map((e) => dayjs(e)))
+  bookInfo.startDate =
+    minDay === null ? null : dayjs(minDay).format('YYYY-MM-DD')
+}
+
+// 成人总价
+const adultTotalPrice = computed(() => {
+  const calendarInfo = calendarData.value[bookInfo.startDate] ?? {
+    adultPrice: 0,
+    childrenPrice: 0
+  }
+  return (bookInfo.adultNumber ?? 0) * calendarInfo.adultPrice
+})
+
+// 儿童总价
+const childrenTotalPrice = computed(() => {
+  const calendarInfo = calendarData.value[bookInfo.startDate] ?? {
+    adultPrice: 0,
+    childrenPrice: 0
+  }
+  return (bookInfo.childrenNumber ?? 0) * calendarInfo.childrenPrice
+})
+
+// 总价
+const totalPrice = computed(
+  () => adultTotalPrice.value + childrenTotalPrice.value
+)
+
+onMounted(() => {
+  getCalendarData()
+})
+</script>
+
+<style lang="scss" scoped></style>