Explorar o código

优化API地址配置,新增导出API_BASE_URL;调整多个组件以使用新的访问令牌获取方式,改善代码结构和样式

张涛 hai 1 ano
pai
achega
85db0b39d9

+ 3 - 0
public/config.js

@@ -5,6 +5,9 @@ window.DMX_VERSION = '1.0.1';
  * 配置项最后一个字符 无需是 / 即,无需以 / 结束
  */
 window.API_BASE_URL = 'http://192.168.20.119:13002';
+// window.API_BASE_URL = 'http://smartai.com:8163';
+export const API_BASE_URL = window.API_BASE_URL; // 新增导出
+
 window.featureConfigs = [
   {
     name: '智能问答',

+ 5 - 6
src/modules/home/agent_card.vue

@@ -41,6 +41,7 @@ import { fetchApps } from '../../apis/home';
 import { Message } from '../../3rd-libs/arco-vue-libs';
 import Icon from '../../components/Icon/Icon.vue';
 import { getConfigField } from '../../config'; // 假设 getConfigField 是从某处导入的
+import { access_token } from '../../base/storage';
 
 const categories = ref([]);
 const agent_list = ref([]);
@@ -48,7 +49,6 @@ const filter_agent_list = ref([]);
 const agentsListContainer = ref(null);
 const selectedCategory = ref('全部'); // 默认选中“全部”
 const baseurl = getConfigField('API_BASE_URL');
-const access_token = ref(''); // 假设 access_token 是从某处获取的
 
 const loadApps = async () => {
   try {
@@ -105,7 +105,7 @@ onUnmounted(() => {
 });
 
 const createAgent = () => {
-  const dify_token = access_token.value;
+  const dify_token = access_token.get();
   const workflowUrl = `${baseurl}/apps?token=${dify_token}`;
   window.open(workflowUrl, '_blank');
 };
@@ -117,7 +117,7 @@ const selectCategory = (category) => {
 
 const handleAgentClick = (app) => {
   const iframe_id = app.id;
-  const dify_token = access_token.value;
+  const dify_token = access_token.get();
   const workflowUrl = `${baseurl}/app/${iframe_id}/workflow?token=${dify_token}`;
   window.open(workflowUrl, '_blank');
 };
@@ -125,8 +125,7 @@ const handleAgentClick = (app) => {
 
 <style scoped>
 .window {
-  height: 60vh;
-  width: 75vw;
+  width: 90%;
 }
 
 .title {
@@ -156,7 +155,7 @@ const handleAgentClick = (app) => {
 }
 
 .agents-list-container {
-  padding-top: 12px;
+  padding: 12px 0;
   overflow-y: auto;
   display: flex;
   flex-wrap: wrap;

+ 10 - 8
src/modules/home/home_page.vue

@@ -1,22 +1,23 @@
 <template>
-    <div class="Main">
-      <div class="text-container">
-        <p class="title">欢迎使用<span style="font-weight: 800;">小数应用市场</span></p>
-        <p class="subtitle">大模型AI能力平台,为你的下一个创意助力</p>
-      </div>
-      <x_card_window />
-      <agent_card />
+  <div class="Main">
+    <div class="text-container">
+      <p class="title">欢迎使用<span style="font-weight: 800">小数应用市场</span></p>
+      <p class="subtitle">大模型AI能力平台,为你的下一个创意助力</p>
     </div>
+    <x_card_window />
+    <agent_card />
+  </div>
 </template>
 
 <script setup>
 import x_card_window from './x_card_window.vue';
 import agent_card from './agent_card.vue';
-
 </script>
 
 <style scoped>
 .Main {
+  width: calc(100% - 100px);
+  height: calc(100% - 65px);
   flex: 1;
   background-image: url('../../assets/image/home/home_gif.gif'), url('../../assets/image/home/home_png.png');
   background-repeat: no-repeat, no-repeat;
@@ -27,6 +28,7 @@ import agent_card from './agent_card.vue';
   align-items: center;
   gap: 45px;
   padding-top: 65px;
+  overflow-y: hidden;
 }
 
 .text-container {

+ 3 - 3
src/modules/home/sidebar_list.vue

@@ -31,11 +31,11 @@ const selected = ref(null);
 const getIconSrc = (item, index) => {
   const store = useInject();
   if (store.selectedFeature === item.label) {
-    return `./../assets/slider/${item.icon}-1.svg`; // 选中
+    return `../../assets/slider/${item.icon}-1.svg`; // 选中
   } else if (hovered.value === index) {
-    return `./../assets/slider/${item.icon}-1.svg`; // 悬停
+    return `../../assets/slider/${item.icon}-1.svg`; // 悬停
   } else {
-    return `./../assets/slider/${item.icon}.svg`; // 默认
+    return `../../assets/slider/${item.icon}.svg`; // 默认
   }
 };
 

+ 22 - 27
src/modules/home/x_card_window.vue

@@ -1,24 +1,17 @@
 <template>
-  <div class='x_card_window'>
-    <a-button shape='circle' @click='scrollCards(-1)'>
+  <div class="x_card_window">
+    <a-button shape="circle" @click="scrollCards(-1)">
       <icon-left />
     </a-button>
-    <div class='x_card'>
-      <a-card
-        v-for='(item, index) in cardItems'
-        :key='index'
-        class='card-item'
-        hoverable
-        @click='handleCardClick(item)'
-      >
-        <div class='card-content'>
-          <img :src='`../../assets/image/x-card-png/${index + 1}.png`' alt=''
-               class='card-image'>
-          <div class='card-text'>{{ item.name }}</div>
+    <div class="x_card">
+      <div v-for="(item, index) in cardItems" :key="index" class="card-item" hoverable @click="handleCardClick(item)">
+        <div class="card-content">
+          <img :src="getImageSrc(index)" alt="" class="card-image" />
+          <div class="card-text">{{ item.name }}</div>
         </div>
-      </a-card>
+      </div>
     </div>
-    <a-button shape='circle' @click='scrollCards(1)'>
+    <a-button shape="circle" @click="scrollCards(1)">
       <icon-right />
     </a-button>
   </div>
@@ -28,7 +21,6 @@
 import { getConfigField } from '../../config/index';
 import { useInject } from '../../base/store/use-inject';
 
-
 const baseurl = getConfigField('API_BASE_URL');
 const cardItems = getConfigField('featureConfigs');
 
@@ -40,20 +32,19 @@ const scrollCards = (direction) => {
 
 const handleCardClick = (item) => {
   const store = useInject();
-
-  const iframe_id = item.id;
-  const type = item.type;
+  const { id: iframe_id, type, name } = item;
 
   if (type === 'workflow') {
-    const workflowUrl = `${baseurl}/app/${iframe_id}/workflow`;
-    window.open(workflowUrl, '_blank');
+    window.open(`${baseurl}/app/${iframe_id}/workflow`, '_blank');
   } else if (type === 'link') {
     window.open(iframe_id, '_blank');
   } else {
-    store.updateUserPage(iframe_id, item.name);
-    store.setSelectedFeature(item.name);
+    store.updateUserPage(iframe_id, name);
+    store.setSelectedFeature(name);
   }
 };
+
+const getImageSrc = (index) => `../../assets/image/x-card-png/${index + 1}.png`;
 </script>
 
 <style scoped>
@@ -81,17 +72,22 @@ const handleCardClick = (item) => {
   flex-shrink: 0;
   border-radius: 10px;
   background-color: #fff;
+  color: #333;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
+  cursor: pointer;
+}
+.card-item:hover {
+  background-color: #06aea2;
+  color: #fff;
 }
-
 .card-content {
   display: flex;
   align-items: center;
-  justify-content: flex-start;
+  justify-content: center;
   width: 100%;
 }
 
@@ -103,7 +99,6 @@ const handleCardClick = (item) => {
 
 .card-text {
   font-size: 15px;
-  color: #333;
   font-weight: 800;
 }
 

+ 4 - 2
vite.config.mjs

@@ -14,6 +14,8 @@ import Components from 'unplugin-vue-components/vite';
 import { ArcoResolver } from 'unplugin-vue-components/resolvers';
 
 import { config_compression, config_imagemin } from './scripts/vite-conf';
+import { API_BASE_URL } from './public/config';
+const targetUrl = API_BASE_URL || 'http://smartai.com:8163'; // 从环境变量或默认值中获取
 
 // https://vitejs.dev/config/
 export default defineConfig(({ mode }) => {
@@ -33,7 +35,7 @@ export default defineConfig(({ mode }) => {
       host: '0.0.0.0', // IP配置,支持从IP启动
       proxy: {
         '/console': {
-          target: 'http://192.168.20.119:13002',
+          target: targetUrl, // 替换为public/config.js中的地址
           // target: 'http://192.168.20.119:9303',
           changeOrigin: true,
           secure: false,
@@ -42,7 +44,7 @@ export default defineConfig(({ mode }) => {
           rewrite: (path) => path.replace(/^\/proxy_url/, '')
         },
         '/api/': {
-          target: 'http://192.168.20.119:13002',
+          target: targetUrl, // 替换为public/config.js中的地址
           // target: 'http://192.168.20.119:9303',
           changeOrigin: true,
           secure: false,