ai-chat-bot-interface 1.6.21 → 1.6.23

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ai-chat-bot-interface",
   "private": false,
-  "version": "1.6.21",
+  "version": "1.6.23",
   "type": "module",
   "main": "index.js",
   "description": "A AI chat bot interface. (private)",

package/src/App.vue

@@ -23,6 +23,7 @@ const handleLog = (log) => {
         },
       ]"
       :need-log="true"
+      post-token="CE73EA32DA06F05C3F522FE8E5E1420399E9C8433CD4932C"
       content-type="markdown"
       first-msg="减脂减重"
       @log="handleLog"

package/src/ChatUi.less

@@ -293,3 +293,9 @@
     text-align: center;
   }
 }
+.loading_row {
+  .flexrsc();
+  gap: 5px;
+  font-size: 10px;
+  margin-top: 8px;
+}

package/src/ChatUi.vue

@@ -138,9 +138,12 @@
                     </div>
                   </template>
                 </template>
-                <loading-icon2
+                <div
                   v-if="isAnswering && index === historyList.length - 1"
-                />
+                  class="loading_row"
+                >
+                  Ai努力生成中...<loading-icon2 />
+                </div>
               </div>
             </div>
           </div>
@@ -199,6 +202,7 @@ import AssistantReplay from './components/assistantReplay/assistantReplay.vue';
 import StoreList from './components/StoreList/StoreList.vue';
 import MarkdownViewer from './components/MarkdownPlan/MarkdownViewer.vue';
 import PersonalForm from './components/personalForm/personalForm.vue';
+import processBar from './components/icons/processBar.vue';
 
 const chatOptions = computed(() => {
   return {
@@ -272,6 +276,10 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  postToken: {
+    type: String,
+    default: '',
+  },
   showHeader: {
     type: Boolean,
     default: true,
@@ -356,7 +364,14 @@ onMounted(async () => {
   } else {
     await createConv();
     if (props.firstMsg) {
-      const perMsg = `本食谱为通用版${props.firstMsg}示例，依据以下女性常规身体数据制定：
+      await handleFirstMsg();
+    }
+  }
+  scrollToEnd();
+});
+
+const handleFirstMsg = async () => {
+  const perMsg = `本食谱为通用版${props.firstMsg}示例，依据以下女性常规身体数据制定：
 性别：女；
 年龄：25岁；
 身高：160cm；
@@ -364,11 +379,76 @@ onMounted(async () => {
 日常运动水平：久坐；
 口味偏好及饮食禁忌：无；
 如需定制贴合个人情况的专属方案，请前往完善个人身体数据，获取个性化定制食谱。`;
-      await chatConv([{ content: perMsg, text: perMsg }]);
-    }
+
+  historyList.value = [
+    {
+      conversation_id: '',
+      bot_id: props.botId,
+      role: 'user',
+      content: perMsg,
+      reasoning_content: '',
+      status: 'ended',
+      extra: [],
+    },
+  ];
+
+  const res = await post('/api/cn.weis.api.Food/bdGeneralTemp', {
+    method: 'bdGeneralTemp',
+    params: [{}],
+    token: props.postToken,
+  });
+  if (res.errCode === 0 && res.obj) {
+    const resMsg = `您的身高：160cm  年龄：25 岁  体重：60kg  性别：女  日常运动水平：久坐
+
+根据您的身体状况，给您推荐的饮食方案如下
+——————————————————
+
+早餐
+热量：375kcal
+碳水：46.9g
+蛋白质：18.8g
+脂肪：12.5g
+
+午餐
+热量：525kcal
+碳水：65.6g
+蛋白质：26.3g
+脂肪：17.5g
+
+晚餐
+热量：450kcal
+碳水：56.3g
+蛋白质：22.5g
+脂肪：15g
+
+加餐
+热量：150kcal
+碳水：26.3g
+蛋白质：3.8g
+脂肪：3.3g
+
+——————————————————`;
+
+    historyList.value.push({
+      conversation_id: '',
+      bot_id: props.botId,
+      role: 'assistant',
+      content: resMsg,
+      reasoning_content: '',
+      status: 'ended',
+      extra: [
+        {
+          ...res.obj,
+          showType: 'card',
+        },
+      ],
+    });
+    Emits('log', {
+      turns: turns.value,
+      info: historyList.value[historyList.value.length - 1],
+    });
   }
-  scrollToEnd();
-});
+};
 
 const createConv = async () => {
   const res = await post(

package/src/components/DishesCard.vue

@@ -66,6 +66,10 @@
         <div class="tag">花生</div>
         <div class="tag">玉米淀粉</div>
       </div>-->
+      <div class="tips">
+        <span class="star">*</span
+        >一份的量偏小不便制作，因而基于3份的量来介绍，食用时取一份即可
+      </div>
       <div class="title">食材</div>
       <div class="text">
         {{ materialText }}
@@ -202,6 +206,17 @@ const getImageList = (str) => {
         font-size: 18px;
       }
     }
+    .tips {
+      vertical-align: middle;
+      font-size: 13px;
+      font-weight: 400;
+      margin-top: 10px;
+      .star {
+        color: #ff0000;
+        vertical-align: middle;
+        margin-right: 0.4em;
+      }
+    }
     .title {
       font-weight: 600;
       font-size: 15px;

package/src/components/DishesList.vue

@@ -31,12 +31,12 @@
       温馨提示：维小饭AI健康食谱为日常膳食调理方案，不能替代药物治疗或专业医疗建议。如有疾病，请及时就医并遵医嘱。
     </div>
     <div v-if="isMini" class="btn_group">
+      <div class="btn btn_1" @click.stop="handleBtn('personalForm')">
+        <span class="name">私人定制个性食谱</span>
+      </div>
       <div class="btn btn_2" @click.stop="handleBtn('ship_order')">
         <span class="name">去订餐</span>
       </div>
-      <div class="btn btn_1" @click.stop="handleBtn('personalForm')">
-        <span class="name">定制个性化食谱</span>
-      </div>
     </div>
     <div v-else class="btn_group">
       <div

package/src/components/icons/processBar.vue

@@ -0,0 +1,115 @@
+<template>
+  <div class="cool-progress-container">
+    <!-- 进度条外层容器 -->
+    <div class="progress-bar-wrapper">
+      <!-- 进度条主体（带渐变+流光） -->
+      <div class="progress-bar" :style="{ width: `${percentage}%` }">
+        <!-- 流光伪元素通过 CSS 实现，无需额外DOM -->
+      </div>
+    </div>
+    <!-- 进度数字（发光效果） -->
+    <span class="progress-text">{{ percentage }}%</span>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, ref } from 'vue';
+// 模拟进度值，可替换为业务数据
+const percentage = ref(0);
+const runner = ref('');
+onMounted(() => {
+  percentage.value = 0;
+  runFunc();
+});
+
+const runFunc = () => {
+  let x = 0;
+  let t = 100;
+  const max = 95;
+  const calcProcess = () => {
+    const timer = setTimeout(() => {
+      if (percentage.value >= max) {
+        console.log('== stop ==', new Date().getTime());
+        clearTimeout(timer);
+      } else {
+        if (percentage.value > 80) {
+          t = 800;
+        }
+        percentage.value = (max * (1 - Math.exp(-x / 20))).toFixed(1);
+        x += 0.5;
+        calcProcess();
+      }
+    }, t);
+  };
+  console.log('== start ==', new Date().getTime());
+  calcProcess();
+};
+</script>
+
+<style scoped>
+.cool-progress-container {
+  width: 100%;
+  max-width: 600px;
+  margin: 20px 0;
+  padding: 15px;
+  background: #121212; /* 暗黑底色适配酷炫风 */
+  border-radius: 12px;
+  box-shadow: 0 0 20px rgba(0, 128, 255, 0.2);
+}
+
+.progress-bar-wrapper {
+  height: 24px;
+  width: 100%;
+  background: rgba(255, 255, 255, 0.08);
+  border-radius: 12px;
+  overflow: hidden;
+  position: relative;
+}
+
+.progress-bar {
+  height: 100%;
+  border-radius: 12px;
+  /* 赛博朋克渐变底色 */
+  background: linear-gradient(90deg, #00f5ff, #7928ca, #ff0080);
+  position: relative;
+  transition: width 0.5s ease-in;
+}
+
+/* 流光动画伪元素 */
+.progress-bar-wrapper::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 50%;
+  height: 100%;
+  background: linear-gradient(
+    90deg,
+    transparent,
+    rgba(255, 255, 255, 0.4),
+    transparent
+  );
+  transform: skewX(-20deg);
+  animation: light-flow 1.5s infinite linear;
+}
+
+/* 流光动画 */
+@keyframes light-flow {
+  0% {
+    left: -100%;
+  }
+  100% {
+    left: 200%;
+  }
+}
+
+/* 发光进度文字 */
+.progress-text {
+  display: block;
+  margin-top: 8px;
+  font-size: 16px;
+  font-weight: bold;
+  color: #00f5ff;
+  text-shadow: 0 0 10px #00f5ff, 0 0 20px #00f5ff;
+}
+</style>

package/vite.config.js

@@ -20,5 +20,14 @@ export default defineConfig({
   },
   server: {
     host: '0.0.0.0',
+    hmr: true,
+    proxy: {
+      '/api': {
+        // target: 'https://prodapi.weis1606.cn',
+        target: 'https://api.weis1606.cn/',
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, '/api'),
+      },
+    },
   },
 });