浏览代码

Merge remote-tracking branch 'origin/master'

1811872455@163.com 2 周之前
父节点
当前提交
0630a6ec78

+ 3 - 0
ui/smarttrade-platform/src/api/customer/index.js

@@ -0,0 +1,3 @@
+import { get, post, put, remove, upload } from '@/utils/request'
+
+export const getCustomerList = (params = {}) => post('/router/rest/customer/list', params)

+ 680 - 0
ui/smarttrade-platform/src/components/addCustomer.vue

@@ -0,0 +1,680 @@
+<template>
+  <div v-if="showModal" class="modal-overlay" @click.self="handleClose">
+    <div class="modal modal-lg">
+      <div class="modal-header">
+        <div class="modal-title"><i class="fas fa-user-plus"></i> 添加客户</div>
+        <button class="modal-close" @click="handleClose"><i class="fas fa-times"></i></button>
+      </div>
+      <div class="modal-body">
+        <!-- 基础信息 -->
+        <div class="section-title">基础信息</div>
+        <div class="form-row ">
+            <div class="lef">
+                <div class="form-group">
+                    <label class="form-label">客户代码</label>
+                    <input type="text" class="form-input" v-model="formData.customerCode" placeholder="客户代码">
+                </div>
+                <div class="form-group">
+                    <label class="form-label">归属人员 <span class="required">*</span></label>
+                    <select class="form-select" v-model="formData.ownerUser">
+                    <option value="">请选择用户</option>
+                    <option value="user1">用户1</option>
+                    <option value="user2">用户2</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">客户状态 <span class="required">*</span></label>
+                    <select class="form-select" v-model="formData.customerStatus">
+                    <option value="no_need">暂无需</option>
+                    <option value="intent">意向客户</option>
+                    <option value="deal">成交客户</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">联系人姓名 <span class="required">*</span></label>
+                    <input type="text" class="form-input" v-model="formData.contactName" placeholder="请输入联系人姓名">
+                </div>
+                <div class="form-group">
+                    <label class="form-label">意向产品</label>
+                    <select class="form-select" v-model="formData.intentProduct">
+                    <option value="">意向产品</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">客户来源</label>
+                    <select class="form-select" v-model="formData.source">
+                    <option value="">客户来源</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">客户等级</label>
+                    <div class="radio-group">
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.level" value="A"> A级
+                    </label>
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.level" value="B"> B级
+                    </label>
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.level" value="C"> C级
+                    </label>
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.level" value="D"> D级
+                    </label>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">助记名称</label>
+                    <input type="text" class="form-input" v-model="formData.alias" placeholder="请输入助记名称">
+                </div>
+            </div>
+            <div class="right">
+                <div class="form-group">
+                    <label class="form-label">区域名称 <span class="required">*</span></label>
+                    <select class="form-select" v-model="formData.regionName">
+                    <option value="">请选择</option>
+                    <option value="A">区域A</option>
+                    <option value="B">区域B</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">客户名称 <span class="required">*</span></label>
+                    <input type="text" class="form-input" v-model="formData.customerName" placeholder="请输入客户名称">
+                </div>
+                <!-- 企业网址 紧凑多行布局 -->
+                <div class="form-group multi-input-group">
+                    <label class="form-label">企业网址 <span class="required">*</span></label>
+                    <div class="input-item" v-for="(item, idx) in formData.websiteList" :key="idx">
+                    <div class="input-with-icon">
+                        <input
+                        type="text"
+                        class="form-input"
+                        v-model="formData.websiteList[idx]"
+                        placeholder="请输入企业网址"
+                        >
+                        <span class="icon-btn" @click="addWebsite" v-if="idx === 0">+</span>
+                        <span class="icon-btn minus" @click="delWebsite(idx)" v-if="idx > 0">-</span>
+                    </div>
+                    </div>
+                </div>
+                <!-- 联系人邮箱 紧凑多行布局 -->
+                <div class="form-group multi-input-group">
+                    <label class="form-label">联系人邮箱 <span class="required">*</span></label>
+                    <div class="input-item" v-for="(item, idx) in formData.emailList" :key="idx">
+                    <div class="input-with-icon">
+                        <input
+                        type="text"
+                        class="form-input"
+                        v-model="formData.emailList[idx]"
+                        placeholder="请输入联系人邮箱"
+                        >
+                        <span class="icon-btn" @click="addEmail" v-if="idx === 0">+</span>
+                        <span class="icon-btn minus" @click="delEmail(idx)" v-if="idx > 0">-</span>
+                    </div>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">客户类型</label>
+                    <select class="form-select" v-model="formData.customerType">
+                    <option value="">客户类型</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">经济性质</label>
+                    <select class="form-select" v-model="formData.economicNature">
+                    <option value="">客户经济性质</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">信用等级</label>
+                    <div class="radio-group">
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.creditLevel" value="good"> 良好
+                    </label>
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.creditLevel" value="normal"> 一般
+                    </label>
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.creditLevel" value="poor"> 较差
+                    </label>
+                    <label class="radio-item">
+                        <input type="radio" v-model="formData.creditLevel" value="worse"> 比较差
+                    </label>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label class="form-label">备注信息</label>
+                    <textarea class="form-textarea" v-model="formData.remark" placeholder="请输入内容"></textarea>
+                </div>
+            </div>
+        </div>
+        <!-- 企业信息 -->
+        <div class="section-title">企业信息</div>
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">企业规模</label>
+            <select class="form-select" v-model="formData.scale">
+              <option value="">意向产品</option>
+            </select>
+          </div>
+          <div class="form-group">
+            <label class="form-label">所属行业</label>
+            <input type="text" class="form-input" v-model="formData.industry" placeholder="请输入所属行业">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">通信地址</label>
+            <input type="text" class="form-input" v-model="formData.address" placeholder="请输入通信地址">
+          </div>
+          <div class="form-group">
+            <label class="form-label">邮政编码</label>
+            <input type="text" class="form-input" v-model="formData.postcode" placeholder="请输入邮政编码">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">传真号码</label>
+            <input type="text" class="form-input" v-model="formData.fax" placeholder="请输入传真号码">
+          </div>
+          <div class="form-group">
+            <label class="form-label">企业邮箱</label>
+            <div class="input-with-icon">
+              <input type="text" class="form-input" v-model="formData.companyEmail" placeholder="请输入企业邮箱">
+              <span class="icon-btn">+</span>
+            </div>
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">企业备用邮箱</label>
+            <div class="input-with-icon">
+              <input type="text" class="form-input" v-model="formData.backupEmail" placeholder="请输入企业备用邮箱">
+              <span class="icon-btn minus">-</span>
+            </div>
+          </div>
+          <div class="form-group">
+            <label class="form-label">联系号码</label>
+            <input type="text" class="form-input" v-model="formData.contactPhone" placeholder="请输入联系号码">
+          </div>
+        </div>
+
+        <!-- 首要联系人 -->
+        <div class="section-title">首要联系人</div>
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">称呼</label>
+            <div class="radio-group">
+              <label class="radio-item">
+                <input type="radio" v-model="formData.gender" value="unknown"> 未知
+              </label>
+              <label class="radio-item">
+                <input type="radio" v-model="formData.gender" value="mr"> 先生
+              </label>
+              <label class="radio-item">
+                <input type="radio" v-model="formData.gender" value="mrs"> 女士
+              </label>
+            </div>
+          </div>
+          <div class="form-group">
+            <label class="form-label">角色</label>
+            <select class="form-select" v-model="formData.role">
+              <option value="">请选择角色</option>
+            </select>
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">生日</label>
+            <select class="form-select" v-model="formData.birthday">
+              <option value="">请选择生日</option>
+            </select>
+          </div>
+          <div class="form-group">
+            <label class="form-label">部门职务</label>
+            <input type="text" class="form-input" v-model="formData.position" placeholder="请输入部门职务">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">手机号码</label>
+            <input type="text" class="form-input" v-model="formData.mobile" placeholder="请输入手机号码">
+          </div>
+          <div class="form-group">
+            <label class="form-label">联系人备用邮箱</label>
+            <div class="input-with-icon">
+              <input type="text" class="form-input" v-model="formData.contactBackupEmail" placeholder="请输入联系人备用邮箱">
+              <span class="icon-btn minus">-</span>
+            </div>
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">固定电话</label>
+            <input type="text" class="form-input" v-model="formData.tel" placeholder="请输入固定电话">
+          </div>
+          <div class="form-group">
+            <label class="form-label">传真号码</label>
+            <input type="text" class="form-input" v-model="formData.contactFax" placeholder="请输入传真号码">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">宅电</label>
+            <input type="text" class="form-input" v-model="formData.homeTel" placeholder="请输入内容">
+          </div>
+          <div class="form-group">
+            <label class="form-label">QQ</label>
+            <input type="text" class="form-input" v-model="formData.qq" placeholder="请输入QQ">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">SKYPE</label>
+            <input type="text" class="form-input" v-model="formData.skype" placeholder="请输入SKYPE">
+          </div>
+          <div class="form-group">
+            <label class="form-label">旺旺</label>
+            <input type="text" class="form-input" v-model="formData.ww" placeholder="请输入旺旺">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">微信</label>
+            <input type="text" class="form-input" v-model="formData.wechat" placeholder="请输入微信">
+          </div>
+          <div class="form-group">
+            <label class="form-label">Twitter</label>
+            <input type="text" class="form-input" v-model="formData.twitter" placeholder="请输入Twitter">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">LinkedIn</label>
+            <input type="text" class="form-input" v-model="formData.linkedin" placeholder="请输入LinkedIn">
+          </div>
+          <div class="form-group">
+            <label class="form-label">Facebook</label>
+            <input type="text" class="form-input" v-model="formData.facebook" placeholder="请输入Facebook">
+          </div>
+        </div>
+
+        <div class="form-row">
+          <div class="form-group">
+            <label class="form-label">Whatsapp</label>
+            <input type="text" class="form-input" v-model="formData.whatsapp" placeholder="请输入Whatsapp">
+          </div>
+          <div class="form-group">
+            <label class="form-label">所在地区</label>
+            <input type="text" class="form-input" v-model="formData.contactRegion" placeholder="请输入所在地区">
+          </div>
+        </div>
+      </div>
+      <div class="modal-footer">
+        <button class="btn btn-secondary" @click="handleClose">取消</button>
+        <button class="btn btn-primary" @click="handleAdd"><i class="fas fa-plus"></i> 添加</button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, defineProps, defineEmits } from 'vue'
+
+const props = defineProps({
+  showModal: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const emit = defineEmits(['close', 'add'])
+
+// 表单数据
+const formData = ref({
+  customerCode: '',
+  regionName: '',
+  ownerUser: '',
+  customerName: '',
+  customerStatus: 'no_need',
+  websiteList: [''],    // 最多4条(主+3备用)
+  emailList: [''],      // 最多4条(主+3备用)
+  intentProduct: '',
+  customerType: '',
+  source: '',
+  economicNature: '',
+  level: 'A',
+  creditLevel: 'good',
+  alias: '',
+  remark: '',
+  scale: '',
+  industry: '',
+  address: '',
+  postcode: '',
+  fax: '',
+  companyEmail: '',
+  backupEmail: '',
+  contactPhone: '',
+  gender: 'unknown',
+  role: '',
+  birthday: '',
+  position: '',
+  mobile: '',
+  contactBackupEmail: '',
+  tel: '',
+  contactFax: '',
+  homeTel: '',
+  qq: '',
+  skype: '',
+  ww: '',
+  wechat: '',
+  twitter: '',
+  linkedin: '',
+  facebook: '',
+  whatsapp: '',
+  contactRegion: ''
+})
+
+// 企业网址 新增
+const addWebsite = () => {
+  if (formData.value.websiteList.length >= 4) return
+  formData.value.websiteList.push('')
+}
+// 企业网址 删除
+const delWebsite = (index) => {
+  formData.value.websiteList.splice(index, 1)
+}
+
+// 联系人邮箱 新增
+const addEmail = () => {
+  if (formData.value.emailList.length >= 4) return
+  formData.value.emailList.push('')
+}
+// 联系人邮箱 删除
+const delEmail = (index) => {
+  formData.value.emailList.splice(index, 1)
+}
+
+// 关闭弹窗 & 重置表单
+const handleClose = () => {
+  formData.value = {
+    customerCode: '',
+    regionName: '',
+    ownerUser: '',
+    customerName: '',
+    customerStatus: 'no_need',
+    websiteList: [''],
+    emailList: [''],
+    intentProduct: '',
+    customerType: '',
+    source: '',
+    economicNature: '',
+    level: 'A',
+    creditLevel: 'good',
+    alias: '',
+    remark: '',
+    scale: '',
+    industry: '',
+    address: '',
+    postcode: '',
+    fax: '',
+    companyEmail: '',
+    backupEmail: '',
+    contactPhone: '',
+    gender: 'unknown',
+    role: '',
+    birthday: '',
+    position: '',
+    mobile: '',
+    contactBackupEmail: '',
+    tel: '',
+    contactFax: '',
+    homeTel: '',
+    qq: '',
+    skype: '',
+    ww: '',
+    wechat: '',
+    twitter: '',
+    linkedin: '',
+    facebook: '',
+    whatsapp: '',
+    contactRegion: ''
+  }
+  emit('close')
+}
+
+// 提交表单
+const handleAdd = () => {
+  const { websiteList, emailList, regionName, ownerUser, customerName, customerStatus } = formData.value
+  if (!regionName || !ownerUser || !customerName || !customerStatus) {
+    alert('请填写所有必填项!')
+    return
+  }
+  // 过滤空值
+  const params = {
+    ...formData.value,
+    websiteList: websiteList.filter(item => item.trim()),
+    emailList: emailList.filter(item => item.trim())
+  }
+  emit('add', params)
+  handleClose()
+}
+</script>
+
+<style scoped>
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.7);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  padding: 20px;
+}
+
+.modal {
+  background: var(--bg-card);
+  border-radius: 16px;
+  width: 100%;
+  max-width: 800px;
+  max-height: 90vh;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.modal-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid var(--border);
+}
+
+.modal-title {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.modal-close {
+  width: 32px;
+  height: 32px;
+  background: var(--bg-hover);
+  border: none;
+  border-radius: 8px;
+  color: var(--text-secondary);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.modal-close:hover {
+  background: var(--border);
+  color: var(--text-primary);
+}
+
+.modal-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 20px;
+}
+
+.modal-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 20px;
+  border-top: 1px solid var(--border);
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--text-secondary);
+  background: var(--bg-hover);
+  padding: 8px 12px;
+  border-radius: 4px;
+  margin-bottom: 16px;
+}
+
+/* 行布局:保留两列,统一间距 */
+.form-row {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 16px;
+  margin-bottom: 16px;
+  align-items: flex-start; /* 关键:多行输入时顶部对齐,避免留白 */
+}
+.form-row .left,.form-row .right{
+     display: flex;
+     flex-direction: column;
+}
+.form-group {
+ 
+}
+
+/* 多行输入专属样式 */
+.multi-input-group {
+  gap: 4px; /* 标签与输入组间距缩小 */
+}
+
+.form-group.full-width {
+  grid-column: 1 / -1;
+}
+
+.form-label {
+  font-size: 12px;
+  color: var(--text-secondary);
+  margin-bottom: 6px;
+}
+
+.form-input,
+.form-select,
+.form-textarea {
+  width: 100%;
+  padding: 10px 14px;
+  background: var(--bg-dark);
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  color: var(--text-primary);
+  font-size: 13px;
+  box-sizing: border-box;
+}
+
+.form-input:focus,
+.form-select:focus,
+.form-textarea:focus {
+  outline: none;
+  border-color: var(--primary);
+}
+
+.form-textarea {
+  min-height: 80px;
+  resize: vertical;
+}
+
+.required {
+  color: var(--danger, #f56c6c);
+}
+
+/* 单条输入容器,紧凑间距 */
+.input-item {
+  margin-bottom: 6px;
+}
+.input-item:last-child {
+  margin-bottom: 0;
+}
+
+.input-with-icon {
+  position: relative;
+  width: 100%;
+}
+
+.icon-btn {
+  position: absolute;
+  right: 12px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: var(--primary);
+  cursor: pointer;
+  font-size: 16px;
+  user-select: none;
+}
+.icon-btn.minus {
+  color: var(--danger, #f56c6c);
+}
+
+.radio-group {
+  display: flex;
+  gap: 16px;
+  align-items: center;
+}
+
+.radio-item {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 13px;
+  color: var(--text-secondary);
+  cursor: pointer;
+}
+
+.btn {
+  padding: 10px 20px;
+  border-radius: 8px;
+  border: none;
+  cursor: pointer;
+  font-size: 13px;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.btn-secondary {
+  background: var(--bg-hover);
+  color: var(--text-secondary);
+}
+
+.btn-primary {
+  background: var(--primary);
+  color: #fff;
+}
+</style>

+ 6 - 6
ui/smarttrade-platform/src/components/layout/Sidebar.vue

@@ -16,10 +16,10 @@
       <!-- AI核心 -->
       <div class="nav-section">
         <div class="nav-section-title">AI 核心</div>
-        <router-link to="/" class="nav-item" :class="{ active: $route.path === '/' }">
+        <!-- <router-link to="/" class="nav-item" :class="{ active: $route.path === '/' }">
           <i class="fas fa-brain nav-icon"></i>
           <span class="nav-text">企业大脑</span>
-        </router-link>
+        </router-link> -->
         <router-link to="/prospect" class="nav-item" :class="{ active: $route.path === '/prospect' }">
           <i class="fas fa-crosshairs nav-icon"></i>
           <span class="nav-text">自动寻客</span>
@@ -43,18 +43,18 @@
           <span class="nav-text">客户池</span>
           <span class="nav-badge">847</span>
         </router-link>
-        <router-link to="/opportunities" class="nav-item" :class="{ active: $route.path === '/opportunities' }">
+        <!-- <router-link to="/opportunities" class="nav-item" :class="{ active: $route.path === '/opportunities' }">
           <i class="fas fa-briefcase nav-icon"></i>
           <span class="nav-text">商机管理</span>
         </router-link>
         <router-link to="/orders" class="nav-item" :class="{ active: $route.path === '/orders' }">
           <i class="fas fa-box nav-icon"></i>
           <span class="nav-text">订单跟进</span>
-        </router-link>
+        </router-link> -->
       </div>
 
       <!-- 数据洞察 -->
-      <div class="nav-section">
+      <!-- <div class="nav-section">
         <div class="nav-section-title">数据洞察</div>
         <router-link to="/analysis" class="nav-item" :class="{ active: $route.path === '/analysis' }">
           <i class="fas fa-chart-line nav-icon"></i>
@@ -69,7 +69,7 @@
           <span class="nav-text">风险风控</span>
           <span class="nav-badge" style="background: var(--warning);">3</span>
         </router-link>
-      </div>
+      </div> -->
 
       <!-- 系统设置 -->
       <div class="nav-section">

+ 86 - 75
ui/smarttrade-platform/src/views/CustomersView.vue

@@ -4,7 +4,7 @@
       <div class="data-title">📋 客户池 - 共{{ customerStats.total }}家</div>
       <div style="display: flex; gap: 8px;">
         <button class="btn btn-secondary"><i class="fas fa-download"></i> 导出</button>
-        <button class="btn btn-primary" @click="showAddModal = true"><i class="fas fa-plus"></i> 添加客户</button>
+        <!-- <button class="btn btn-primary" @click="showAddModal = true"><i class="fas fa-plus"></i> 添加客户</button> -->
       </div>
     </div>
 
@@ -100,68 +100,17 @@
           <div class="score-label">意向分</div>
         </div>
         <div class="customer-actions" @click.stop>
-          <button class="btn btn-primary btn-sm" @click="sendEmail(customer)"><i class="fas fa-envelope"></i></button>
-          <button class="btn btn-secondary btn-sm" @click="createOpportunity(customer)"><i class="fas fa-rocket"></i></button>
-          <button class="btn btn-secondary btn-sm" @click="showCustomerDetail(customer)"><i class="fas fa-eye"></i></button>
+          <button class="btn btn-secondary btn-sm" @click="showCustomerDetail(customer)"><i class="fas fa-eye"></i>更多详情</button>
         </div>
       </div>
     </div>
 
-    <!-- Add Modal -->
-    <div v-if="showAddModal" class="modal-overlay" @click.self="showAddModal = false">
-      <div class="modal">
-        <div class="modal-header">
-          <div class="modal-title"><i class="fas fa-user-plus"></i> 添加客户</div>
-          <button class="modal-close" @click="showAddModal = false"><i class="fas fa-times"></i></button>
-        </div>
-        <div class="modal-body">
-          <div class="form-row">
-            <div class="form-group">
-              <label class="form-label">公司名称 <span class="required">*</span></label>
-              <input type="text" class="form-input" v-model="newCustomer.name" placeholder="输入公司名称">
-            </div>
-            <div class="form-group">
-              <label class="form-label">联系人 <span class="required">*</span></label>
-              <input type="text" class="form-input" v-model="newCustomer.contact" placeholder="输入联系人姓名">
-            </div>
-          </div>
-          <div class="form-row">
-            <div class="form-group">
-              <label class="form-label">邮箱</label>
-              <input type="email" class="form-input" v-model="newCustomer.email" placeholder="输入邮箱地址">
-            </div>
-            <div class="form-group">
-              <label class="form-label">电话</label>
-              <input type="tel" class="form-input" v-model="newCustomer.phone" placeholder="输入电话号码">
-            </div>
-          </div>
-          <div class="form-row">
-            <div class="form-group">
-              <label class="form-label">国家/地区</label>
-              <select class="form-select" v-model="newCustomer.country">
-                <option value="">选择国家</option>
-                <option value="SA">沙特阿拉伯</option>
-                <option value="AE">阿联酋</option>
-                <option value="DE">德国</option>
-                <option value="FR">法国</option>
-              </select>
-            </div>
-            <div class="form-group">
-              <label class="form-label">客户类型</label>
-              <select class="form-select" v-model="newCustomer.type">
-                <option value="prospect">潜在客户</option>
-                <option value="intent">意向客户</option>
-                <option value="deal">成交客户</option>
-              </select>
-            </div>
-          </div>
-        </div>
-        <div class="modal-footer">
-          <button class="btn btn-secondary" @click="showAddModal = false">取消</button>
-          <button class="btn btn-primary" @click="addCustomer"><i class="fas fa-plus"></i> 添加</button>
-        </div>
-      </div>
-    </div>
+    <!-- 引入添加客户弹窗组件 -->
+    <!-- <AddCustomerModal 
+      :show-modal="showAddModal"
+      @close="showAddModal = false"
+      @add="handleAddCustomer"
+    /> -->
 
     <!-- Customer Detail Modal -->
     <div v-if="showDetailModal && selectedCustomer" class="modal-overlay" @click.self="showDetailModal = false">
@@ -267,7 +216,7 @@
           </div>
 
           <!-- Related Opportunities -->
-          <div class="detail-section">
+          <!-- <div class="detail-section">
             <h4><i class="fas fa-briefcase"></i> 关联商机</h4>
             <div class="related-opps">
               <div class="related-opp" v-for="opp in selectedCustomer.opportunities" :key="opp.id">
@@ -278,13 +227,13 @@
                 <div class="opp-status" :class="opp.statusClass">{{ opp.statusLabel }}</div>
               </div>
             </div>
-          </div>
+          </div> -->
         </div>
         <div class="modal-footer">
           <button class="btn btn-secondary" @click="showDetailModal = false">关闭</button>
           <button class="btn btn-secondary"><i class="fas fa-edit"></i> 编辑</button>
-          <button class="btn btn-primary" @click="createOpportunity(selectedCustomer)">
-            <i class="fas fa-rocket"></i> 创建商机
+          <button class="btn btn-primary" @click="">
+            <i class="fas fa-rocket"></i> 客户详情
           </button>
         </div>
       </div>
@@ -302,6 +251,9 @@
 
 <script setup>
 import { ref, computed } from 'vue'
+import { getCustomerList } from '../api/customer'
+// 引入添加客户组件
+import AddCustomerModal from '../components/addCustomer.vue'
 
 const showAddModal = ref(false)
 const showDetailModal = ref(false)
@@ -330,8 +282,8 @@ const tabs = [
   { key: 'silent', label: '沉默客户', count: 55 }
 ]
 
-const newCustomer = ref({
-  name: '', contact: '', email: '', phone: '', country: '', type: 'prospect'
+getCustomerList().then(res => {
+  console.log('res :>》》》> ', res);
 })
 
 const customers = ref([
@@ -453,9 +405,28 @@ const createOpportunity = (customer) => {
   showToastMessage(`正在为 ${customer.name} 创建商机...`, 'success')
 }
 
-const addCustomer = () => {
-  showAddModal.value = false
-  showToastMessage('客户添加成功', 'success')
+// 辅助函数:根据国家代码获取国旗
+const getFlagByCountry = (countryCode) => {
+  const flagMap = {
+    'SA': '🇸🇦',
+    'AE': '🇦🇪',
+    'DE': '🇩🇪',
+    'FR': '🇫🇷',
+    '': '🌐'
+  }
+  return flagMap[countryCode] || '🌐'
+}
+
+// 辅助函数:根据国家代码获取地区
+const getLocationByCountry = (countryCode) => {
+  const locationMap = {
+    'SA': '沙特阿拉伯',
+    'AE': '阿联酋',
+    'DE': '德国',
+    'FR': '法国',
+    '': '未填写'
+  }
+  return locationMap[countryCode] || '未填写'
 }
 
 const showToastMessage = (message, type = 'success') => {
@@ -464,6 +435,52 @@ const showToastMessage = (message, type = 'success') => {
   showToast.value = true
   setTimeout(() => showToast.value = false, 3000)
 }
+
+
+
+
+// ----------------  暂时无用  ---------------------
+// 处理添加客户逻辑
+const handleAddCustomer = (customerData) => {
+  // 模拟生成客户ID(实际项目中由后端生成)
+  const newId = customers.value.length + 1
+  // 构建完整的客户数据(补充默认值)
+  const newCustomer = {
+    id: newId,
+    flag: getFlagByCountry(customerData.country),
+    name: customerData.name,
+    status: customerData.type,
+    contact: customerData.contact,
+    role: '未填写',
+    location: getLocationByCountry(customerData.country),
+    industry: '未填写',
+    annualPurchase: '未填写',
+    score: 80,
+    email: customerData.email || '未填写',
+    phone: customerData.phone || '未填写',
+    website: '未填写',
+    totalDeals: 0,
+    totalAmount: 0,
+    lastContact: '刚刚',
+    aiInsights: [],
+    interactions: [],
+    opportunities: []
+  }
+  // 添加到客户列表
+  customers.value.push(newCustomer)
+  // 更新统计数据
+  customerStats.total += 1
+  if (customerData.type === 'prospect') customerStats.prospect += 1
+  else if (customerData.type === 'intent') customerStats.intent += 1
+  else if (customerData.type === 'deal') customerStats.deal += 1
+  // 更新tabs计数
+  tabs.forEach(tab => {
+    if (tab.key === 'all') tab.count += 1
+    else if (tab.key === customerData.type) tab.count += 1
+  })
+  // 显示提示
+  showToastMessage('客户添加成功', 'success')
+}
 </script>
 
 <style scoped>
@@ -512,12 +529,6 @@ const showToastMessage = (message, type = 'success') => {
 .modal-close:hover { background: var(--border); color: var(--text-primary); }
 .modal-body { flex: 1; overflow-y: auto; padding: 20px; }
 .modal-footer { display: flex; justify-content: flex-end; gap: 12px; padding: 20px; border-top: 1px solid var(--border); }
-.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
-.form-group { margin-bottom: 16px; }
-.form-label { display: block; font-size: 12px; color: var(--text-secondary); margin-bottom: 6px; }
-.form-input { width: 100%; padding: 10px 14px; background: var(--bg-dark); border: 1px solid var(--border); border-radius: 8px; color: var(--text-primary); font-size: 13px; }
-.form-input:focus { outline: none; border-color: var(--primary); }
-.required { color: var(--danger); }
 .detail-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
 .detail-stat-card { background: var(--bg-hover); border-radius: 12px; padding: 16px; text-align: center; }
 .detail-stat-value { font-size: 24px; font-weight: 700; margin-bottom: 4px; }
@@ -569,4 +580,4 @@ const showToastMessage = (message, type = 'success') => {
 .toast.success i { color: var(--success); }
 .toast-enter-active, .toast-leave-active { transition: all 0.3s ease; }
 .toast-enter-from, .toast-leave-to { opacity: 0; transform: translateY(20px); }
-</style>
+</style>

+ 1 - 0
ui/smarttrade-platform/src/views/KnowledgeView.vue

@@ -491,6 +491,7 @@
       <div v-if="showToast" class="toast" :class="toastType">
         <i :class="toastType === 'success' ? 'fas fa-check-circle' : 'fas fa-info-circle'"></i>
         {{ toastMessage }}
+        
       </div>
     </transition>
   </div>