From 3d35d4292850d368666d5290d8e658c620e932ed Mon Sep 17 00:00:00 2001
From: chenhj <1263187585@qq.com>
Date: 星期四, 16 四月 2026 17:54:46 +0800
Subject: [PATCH] feat(customer): 新增客户交接功能并优化客户档案管理界面

---
 src/views/basicData/customerFile/index.vue | 1587 ++++++++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 1,354 insertions(+), 233 deletions(-)

diff --git a/src/views/basicData/customerFile/index.vue b/src/views/basicData/customerFile/index.vue
index 284300d..6b1c06e 100644
--- a/src/views/basicData/customerFile/index.vue
+++ b/src/views/basicData/customerFile/index.vue
@@ -3,224 +3,647 @@
     <div class="search_form">
       <div>
         <span class="search_title">瀹㈡埛鍚嶇О锛�</span>
-        <el-input
-          v-model="searchForm.customerName"
-          style="width: 240px"
-          placeholder="璇疯緭鍏�"
-          @change="handleQuery"
-          clearable
-          :prefix-icon="Search"
-        />
-        <el-button type="primary" @click="handleQuery" style="margin-left: 10px"
-          >鎼滅储</el-button
-        >
+        <el-input v-model="searchForm.customerName"
+                  style="width: 240px;margin-right: 10px"
+                  placeholder="璇疯緭鍏�"
+                  @change="handleQuery"
+                  clearable
+                  :prefix-icon="Search"/>
+        <span class="search_title">瀹㈡埛鍒嗙被锛�</span>
+        <el-select v-model="searchForm.customerType"
+                   placeholder="璇烽�夋嫨"
+                   style="width: 240px"
+                   clearable
+                   @change="handleQuery">
+          <el-option label="闆跺敭瀹㈡埛"
+                     value="闆跺敭瀹㈡埛"/>
+          <el-option label="杩涢攢鍟嗗鎴�"
+                     value="杩涢攢鍟嗗鎴�"/>
+        </el-select>
+        <el-button type="primary"
+                   @click="handleQuery"
+                   style="margin-left: 10px">鎼滅储
+        </el-button>
       </div>
       <div>
-        <el-button type="primary" @click="openForm('add')">鏂板瀹㈡埛</el-button>
-        <el-button @click="handleOut">瀵煎嚭</el-button>
-        <el-button type="info" plain icon="Upload" @click="handleImport"
-          >瀵煎叆</el-button
-        >
-        <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
+        <el-button type="primary"
+                   @click="openForm('add')">鏂板瀹㈡埛
+        </el-button>
+        <el-button type="primary" @click="handleOut">瀵煎嚭</el-button>
+        <el-button type="primary" @click="handleOutFollowUpList">瀵煎嚭璺熻繘璁板綍</el-button>
+        <el-button type="info"
+                   plain
+                   icon="Upload"
+                   @click="handleImport">瀵煎叆
+        </el-button>
+        <el-button type="danger"
+                   plain
+                   @click="handleDelete">鍒犻櫎
+        </el-button>
       </div>
     </div>
     <div class="table_list">
-      <PIMTable
-        rowKey="id"
-        :column="tableColumn"
-        :tableData="tableData"
-        :page="page"
-        :isSelection="true"
-        @selection-change="handleSelectionChange"
-        :tableLoading="tableLoading"
-        @pagination="pagination"
-      ></PIMTable>
+      <PIMTable rowKey="id"
+                :column="tableColumn"
+                :tableData="tableData"
+                :page="page"
+                :isSelection="true"
+                @selection-change="handleSelectionChange"
+                :tableLoading="tableLoading"
+                @pagination="pagination"></PIMTable>
     </div>
-    <el-dialog
-      v-model="dialogFormVisible"
-      :title="operationType === 'add' ? '鏂板瀹㈡埛淇℃伅' : '缂栬緫瀹㈡埛淇℃伅'"
-      width="70%"
-      @close="closeDia"
-    >
-      <el-form
-        :model="form"
-        label-width="140px"
-        label-position="top"
-        :rules="rules"
-        ref="formRef"
-      >
+    <el-dialog v-model="dialogFormVisible"
+               :title="operationType === 'add' ? '鏂板瀹㈡埛淇℃伅' : '缂栬緫瀹㈡埛淇℃伅'"
+               width="70%"
+               @close="closeDia">
+      <el-form :model="form"
+               label-width="140px"
+               label-position="top"
+               :rules="rules"
+               ref="formRef">
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="瀹㈡埛鍚嶇О锛�" prop="customerName">
-              <el-input
-                v-model="form.customerName"
-                placeholder="璇疯緭鍏�"
-                clearable
-              />
+            <el-form-item label="瀹㈡埛鍚嶇О锛�"
+                          prop="customerName">
+              <el-input v-model="form.customerName"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item
-              label="绾崇◣浜鸿瘑鍒彿锛�"
-              prop="taxpayerIdentificationNumber"
-            >
-              <el-input
-                v-model="form.taxpayerIdentificationNumber"
-                placeholder="璇疯緭鍏�"
-                clearable
-              />
+            <el-form-item label="绾崇◣浜鸿瘑鍒彿锛�"
+                          prop="taxpayerIdentificationNumber">
+              <el-input v-model="form.taxpayerIdentificationNumber"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="鍏徃鍦板潃锛�" prop="companyAddress">
-              <el-input
-                v-model="form.companyAddress"
-                placeholder="璇疯緭鍏�"
-                clearable
-              />
+            <el-form-item label="鍏徃鍦板潃锛�"
+                          prop="companyAddress">
+              <el-input v-model="form.companyAddress"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="鍏徃鐢佃瘽锛�" prop="companyPhone">
-              <el-input
-                v-model="form.companyPhone"
-                placeholder="璇疯緭鍏�"
-                clearable
-              />
+            <el-form-item label="鍏徃鐢佃瘽锛�"
+                          prop="companyPhone">
+              <el-input v-model="form.companyPhone"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row :gutter="30" v-for="(contact, index) in formYYs.contactList" :key="index">
+        <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="鑱旂郴浜猴細" prop="contactPerson">
-              <el-input v-model="contact.contactPerson" placeholder="璇疯緭鍏�" clearable  />
+            <el-form-item label="閾惰鍩烘湰鎴凤細"
+                          prop="basicBankAccount">
+              <el-input v-model="form.basicBankAccount"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="鑱旂郴鐢佃瘽锛�" prop="contactPhone">
+            <el-form-item label="閾惰璐﹀彿锛�"
+                          prop="bankAccount">
+              <el-input v-model="form.bankAccount"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="30">
+          <el-col :span="12">
+            <el-form-item label="寮�鎴疯鍙凤細"
+                          prop="bankCode">
+              <el-input v-model="form.bankCode"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="瀹㈡埛鍒嗙被锛�"
+                          prop="customerType">
+              <el-select v-model="form.customerType"
+                         placeholder="璇烽�夋嫨"
+                         clearable>
+                <el-option label="闆跺敭瀹㈡埛"
+                           value="闆跺敭瀹㈡埛"/>
+                <el-option label="杩涢攢鍟嗗鎴�"
+                           value="杩涢攢鍟嗗鎴�"/>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="30"
+                v-for="(contact, index) in formYYs.contactList"
+                :key="index">
+          <el-col :span="12">
+            <el-form-item label="鑱旂郴浜猴細"
+                          prop="contactPerson">
+              <el-input v-model="contact.contactPerson"
+                        placeholder="璇疯緭鍏�"
+                        clearable/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="鑱旂郴鐢佃瘽锛�"
+                          prop="contactPhone">
               <div style="display: flex; align-items: center;width: 100%;">
-                <el-input v-model="contact.contactPhone" placeholder="璇疯緭鍏�" clearable />
-                <el-button   @click="removeContact(index)" type="danger" circle style="margin-left: 5px;">
-                  <el-icon><Close /></el-icon>
+                <el-input v-model="contact.contactPhone"
+                          placeholder="璇疯緭鍏�"
+                          clearable/>
+                <el-button @click="removeContact(index)"
+                           type="danger"
+                           circle
+                           style="margin-left: 5px;">
+                  <el-icon>
+                    <Close/>
+                  </el-icon>
                 </el-button>
               </div>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-button @click="addNewContact" style="margin-bottom: 10px;">+ 鏂板鑱旂郴浜�</el-button>
-
+        <el-button @click="addNewContact"
+                   style="margin-bottom: 10px;">+ 鏂板鑱旂郴浜�
+        </el-button>
         <el-row :gutter="30">
           <el-col :span="12">
-            <el-form-item label="閾惰鍩烘湰鎴凤細" prop="basicBankAccount">
-              <el-input
-                v-model="form.basicBankAccount"
-                placeholder="璇疯緭鍏�"
-                clearable
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="閾惰璐﹀彿锛�" prop="bankAccount">
-              <el-input
-                v-model="form.bankAccount"
-                placeholder="璇疯緭鍏�"
-                clearable
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="30">
-          <el-col :span="12">
-            <el-form-item label="寮�鎴疯鍙凤細" prop="bankCode">
-              <el-input
-                v-model="form.bankCode"
-                placeholder="璇疯緭鍏�"
-                clearable
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="30">
-          <el-col :span="12">
-            <el-form-item label="缁存姢浜猴細" prop="maintainer">
-              <el-select
-                v-model="form.maintainer"
-                placeholder="璇烽�夋嫨"
-                clearable
-                disabled
-              >
-                <el-option
-                  v-for="item in userList"
-                  :key="item.nickName"
-                  :label="item.nickName"
-                  :value="item.nickName"
-                />
+            <el-form-item label="缁存姢浜猴細"
+                          prop="maintainer">
+              <el-select v-model="form.maintainer"
+                         placeholder="璇烽�夋嫨"
+                         clearable
+                         disabled>
+                <el-option v-for="item in userList"
+                           :key="item.nickName"
+                           :label="item.nickName"
+                           :value="item.nickName"/>
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="缁存姢鏃堕棿锛�" prop="maintenanceTime">
-              <el-date-picker
-                style="width: 100%"
-                v-model="form.maintenanceTime"
-                value-format="YYYY-MM-DD"
-                format="YYYY-MM-DD"
-                type="date"
-                placeholder="璇烽�夋嫨"
-                clearable
-                disabled
-              />
+            <el-form-item label="缁存姢鏃堕棿锛�"
+                          prop="maintenanceTime">
+              <el-date-picker style="width: 100%"
+                              v-model="form.maintenanceTime"
+                              value-format="YYYY-MM-DD"
+                              format="YYYY-MM-DD"
+                              type="date"
+                              placeholder="璇烽�夋嫨"
+                              clearable/>
             </el-form-item>
           </el-col>
         </el-row>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">纭</el-button>
+          <el-button type="primary"
+                     @click="submitForm">纭
+          </el-button>
           <el-button @click="closeDia">鍙栨秷</el-button>
         </div>
       </template>
     </el-dialog>
+    <el-dialog v-model="transferDialogVisible"
+               title="瀹㈡埛浜ゆ帴"
+               width="500px"
+               @close="closeTransferDialog">
+      <el-form :model="transferForm"
+               :rules="transferRules"
+               ref="transferFormRef"
+               label-width="100px">
+        <el-form-item label="浜ゆ帴浜哄憳锛�"
+                      prop="createUser">
+          <el-select v-model="transferForm.createUser"
+                     placeholder="璇烽�夋嫨"
+                     clearable
+                     filterable
+                     style="width: 100%">
+            <el-option v-for="item in userList"
+                       :key="item.userId"
+                       :label="item.userName || item.nickName"
+                       :value="item.userId"/>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary"
+                     @click="submitTransfer">纭
+          </el-button>
+          <el-button @click="closeTransferDialog">鍙栨秷</el-button>
+        </div>
+      </template>
+    </el-dialog>
     <!-- 鐢ㄦ埛瀵煎叆瀵硅瘽妗� -->
-    <el-dialog
-      :title="upload.title"
-      v-model="upload.open"
-      width="400px"
-      append-to-body
-    >
-      <el-upload
-        ref="uploadRef"
-        :limit="1"
-        accept=".xlsx, .xls"
-        :headers="upload.headers"
-        :action="upload.url + '?updateSupport=' + upload.updateSupport"
-        :disabled="upload.isUploading"
-        :on-progress="handleFileUploadProgress"
-        :on-success="handleFileSuccess"
-        :auto-upload="false"
-        drag
-      >
-        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+    <el-dialog :title="upload.title"
+               v-model="upload.open"
+               width="400px"
+               append-to-body>
+      <el-upload ref="uploadRef"
+                 :limit="1"
+                 accept=".xlsx, .xls"
+                 :headers="upload.headers"
+                 :action="upload.url + '?updateSupport=' + upload.updateSupport"
+                 :disabled="upload.isUploading"
+                 :before-upload="upload.beforeUpload"
+                 :on-progress="upload.onProgress"
+                 :on-success="upload.onSuccess"
+                 :on-error="upload.onError"
+                 :on-change="upload.onChange"
+                 :auto-upload="false"
+                 drag>
+        <el-icon class="el-icon--upload">
+          <upload-filled/>
+        </el-icon>
         <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
         <template #tip>
           <div class="el-upload__tip text-center">
             <span>浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢銆�</span>
-            <el-link
-              type="primary"
-              :underline="false"
-              style="font-size: 12px; vertical-align: baseline"
-              @click="importTemplate"
-              >涓嬭浇妯℃澘</el-link
-            >
+            <el-link type="primary"
+                     :underline="false"
+                     style="font-size: 12px; vertical-align: baseline"
+                     @click="importTemplate">涓嬭浇妯℃澘
+            </el-link>
           </div>
         </template>
       </el-upload>
       <template #footer>
         <div class="dialog-footer">
-          <el-button type="primary" @click="submitFileForm">纭� 瀹�</el-button>
+          <el-button type="primary"
+                     @click="submitFileForm">纭� 瀹�
+          </el-button>
           <el-button @click="upload.open = false">鍙� 娑�</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <!-- 鍥炶鎻愰啋瀵硅瘽妗� -->
+    <el-dialog title="鍥炶鎻愰啋"
+               v-model="reminderDialogVisible"
+               width="500px"
+               @close="closeReminderDialog">
+      <el-form :model="reminderForm"
+               label-width="100px"
+               :rules="reminderRules"
+               ref="reminderFormRef">
+        <el-form-item label="瀹㈡埛鍚嶇О锛�">
+          <el-input v-model="reminderForm.customerName"
+                    disabled/>
+        </el-form-item>
+        <el-form-item label="鎻愰啋寮�鍏筹細">
+          <el-switch v-model="reminderForm.reminderSwitch"/>
+        </el-form-item>
+        <el-form-item label="鎻愰啋鍐呭锛�"
+                      prop="reminderContent">
+          <el-input v-model="reminderForm.reminderContent"
+                    type="textarea"
+                    :maxlength="100"
+                    show-word-limit
+                    placeholder="璇疯緭鍏ユ彁閱掑唴瀹�"/>
+        </el-form-item>
+        <el-form-item label="鎻愰啋鏃堕棿锛�"
+                      prop="reminderTime">
+          <el-date-picker v-model="reminderForm.reminderTime"
+                          type="datetime"
+                          value-format="YYYY-MM-DD HH:mm:ss"
+                          format="YYYY-MM-DD HH:mm:ss"
+                          placeholder="璇烽�夋嫨鎻愰啋鏃堕棿"
+                          style="width: 100%"/>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitReminderForm">纭</el-button>
+          <el-button @click="closeReminderDialog">鍙栨秷</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <!-- 娣诲姞/淇敼娲借皥杩涘害瀵硅瘽妗� -->
+    <el-dialog :title="negotiationForm.editIndex !== undefined ? '淇敼杩涘害' : '娣诲姞杩涘害'"
+               v-model="negotiationDialogVisible"
+               width="600px"
+               @close="closeNegotiationDialog">
+      <el-form :model="negotiationForm"
+               label-width="100px"
+               :rules="negotiationRules"
+               ref="negotiationFormRef">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="璺熻繘鏂瑰紡锛�"
+                          prop="followUpMethod">
+              <el-select v-model="negotiationForm.followUpMethod"
+                         placeholder="璇烽�夋嫨"
+                         style="width: 100%">
+                <el-option label="鐢佃瘽"
+                           value="鐢佃瘽"/>
+                <el-option label="閭欢"
+                           value="閭欢"/>
+                <el-option label="涓婇棬"
+                           value="涓婇棬"/>
+                <el-option label="寰俊"
+                           value="寰俊"/>
+                <el-option label="鍏朵粬"
+                           value="鍏朵粬"/>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="璺熻繘绋嬪害锛�"
+                          prop="followUpLevel">
+              <el-select v-model="negotiationForm.followUpLevel"
+                         placeholder="璇烽�夋嫨"
+                         style="width: 100%">
+                <el-option label="娼滃湪瀹㈡埛"
+                           value="娼滃湪瀹㈡埛"/>
+                <el-option label="鍒濇鎷滆"
+                           value="鍒濇鎷滆"/>
+                <el-option label="澶氭鎷滆"
+                           value="澶氭鎷滆"/>
+                <el-option label="鎰忓悜瀹㈡埛"
+                           value="鎰忓悜瀹㈡埛"/>
+                <el-option label="宸茬绾﹀鎴�"
+                           value="宸茬绾﹀鎴�"/>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="璺熻繘鏃堕棿锛�"
+                          prop="followUpTime">
+              <el-date-picker v-model="negotiationForm.followUpTime"
+                              type="datetime"
+                              value-format="YYYY-MM-DD HH:mm:ss"
+                              format="YYYY-MM-DD HH:mm:ss"
+                              placeholder="璇烽�夋嫨"
+                              style="width: 100%"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="璺熻繘浜猴細">
+              <el-input v-model="negotiationForm.followerUserName"
+                        disabled/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="鍐呭锛�"
+                      prop="content">
+          <el-input v-model="negotiationForm.content"
+                    type="textarea"
+                    :rows="4"
+                    placeholder="璇疯緭鍏�"/>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitNegotiationForm">纭</el-button>
+          <el-button @click="closeNegotiationDialog">鍙栨秷</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <!-- 瀹㈡埛璇︽儏瀵硅瘽妗� -->
+    <el-dialog title="瀹㈡埛璇︽儏"
+               v-model="detailDialogVisible"
+               width="1000px"
+               @close="closeDetailDialog">
+      <!-- 瀹㈡埛鍩烘湰淇℃伅 -->
+      <div class="detail-section">
+        <h3 class="section-title">瀹㈡埛鍩烘湰淇℃伅</h3>
+        <div class="info-display">
+          <el-row :gutter="20">
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">瀹㈡埛鍚嶇О锛�</span>
+                <span class="info-value">{{ detailForm.customerName }}</span>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">瀹㈡埛鍒嗙被锛�</span>
+                <span class="info-value">{{ detailForm.customerType }}</span>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row :gutter="20">
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">绾崇◣浜鸿瘑鍒彿锛�</span>
+                <span class="info-value">{{ detailForm.taxpayerIdentificationNumber }}</span>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">鍏徃鐢佃瘽锛�</span>
+                <span class="info-value">{{ detailForm.companyPhone }}</span>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row :gutter="20">
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">鍏徃鍦板潃锛�</span>
+                <span class="info-value">{{ detailForm.companyAddress }}</span>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">閾惰鍩烘湰鎴凤細</span>
+                <span class="info-value">{{ detailForm.basicBankAccount }}</span>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row :gutter="20">
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">閾惰璐﹀彿锛�</span>
+                <span class="info-value">{{ detailForm.bankAccount }}</span>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">寮�鎴疯鍙凤細</span>
+                <span class="info-value">{{ detailForm.bankCode }}</span>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row :gutter="20">
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">鑱旂郴浜猴細</span>
+                <span class="info-value">{{ detailForm.contactPerson }}</span>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">鑱旂郴鐢佃瘽锛�</span>
+                <span class="info-value">{{ detailForm.contactPhone }}</span>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row :gutter="20">
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">缁存姢浜猴細</span>
+                <span class="info-value">{{ detailForm.maintainer }}</span>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="info-item">
+                <span class="info-label">缁存姢鏃堕棿锛�</span>
+                <span class="info-value">{{ detailForm.maintenanceTime }}</span>
+              </div>
+            </el-col>
+          </el-row>
+        </div>
+      </div>
+      <!-- 娲借皥杩涘害璁板綍 -->
+      <div class="detail-section">
+        <div class="section-header">
+          <h3 class="section-title">娲借皥杩涘害璁板綍</h3>
+          <el-button type="primary"
+                     size="small"
+                     @click="openNegotiationDialog(detailForm)">
+            娣诲姞杩涘害
+          </el-button>
+        </div>
+        <el-table :data="negotiationRecords"
+                  border
+                  style="width: 100%">
+          <el-table-column prop="followUpTime"
+                           label="璺熻繘鏃堕棿"
+                           width="160"/>
+          <el-table-column prop="followUpMethod"
+                           label="璺熻繘鏂瑰紡"
+                           width="100"/>
+          <el-table-column prop="followUpLevel"
+                           label="璺熻繘绋嬪害"/>
+          <el-table-column prop="followerUserName"
+                           label="璺熻繘浜�"
+                           width="100"/>
+          <el-table-column prop="content"
+                           label="鍐呭"
+                           show-overflow-tooltip/>
+          <el-table-column label="闄勪欢"
+                           width="100"
+                           align="center">
+            <template #default="{ row }">
+              <el-button type="info"
+                         link
+                         @click="openAttachmentDialog(row)">
+                <el-icon>
+                  <Paperclip/>
+                </el-icon>
+                闄勪欢
+                <!-- {{ row.fileList && row.fileList.length > 0 ? row.fileList.length : '涓婁紶' }} -->
+              </el-button>
+            </template>
+          </el-table-column>
+          <el-table-column label="鎿嶄綔"
+                           width="150"
+                           align="center">
+            <template #default="{ row, $index }">
+              <el-button type="primary"
+                         link
+                         @click="editNegotiationRecord(row, $index)">
+                淇敼
+              </el-button>
+              <el-button type="danger"
+                         link
+                         @click="deleteNegotiationRecord(row, $index)">
+                鍒犻櫎
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div v-if="negotiationRecords.length === 0"
+             class="no-records">
+          鏆傛棤娲借皥杩涘害璁板綍
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="closeDetailDialog">鍏抽棴</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <!-- 闄勪欢涓婁紶寮圭獥 -->
+    <el-dialog title="闄勪欢绠$悊"
+               v-model="attachmentDialogVisible"
+               width="600px"
+               @close="closeAttachmentDialog">
+      <div class="attachment-section">
+        <div class="upload-area">
+          <el-upload ref="attachmentUploadRef"
+                     :action="getAttachmentUploadUrl()"
+                     :headers="attachmentUploadHeaders"
+                     :file-list="currentAttachmentList"
+                     :on-success="handleAttachmentSuccess"
+                     :on-error="handleAttachmentError"
+                     :on-remove="handleAttachmentRemove"
+                     :before-upload="beforeAttachmentUpload"
+                     multiple
+                     :limit="10"
+                     name="files">
+            <el-button type="primary">
+              <el-icon>
+                <Upload/>
+              </el-icon>
+              涓婁紶闄勪欢
+            </el-button>
+            <template #tip>
+              <div class="el-upload__tip">
+                鏀寔涓婁紶鍥剧墖銆佹枃妗g瓑鏂囦欢锛屽崟涓枃浠朵笉瓒呰繃50MB
+              </div>
+            </template>
+          </el-upload>
+        </div>
+        <div v-if="currentAttachmentList.length > 0"
+             class="attachment-list">
+          <h4>宸蹭笂浼犻檮浠讹細</h4>
+          <el-table :data="currentAttachmentList"
+                    border
+                    size="small">
+            <el-table-column prop="name"
+                             label="鏂囦欢鍚�"
+                             show-overflow-tooltip/>
+            <el-table-column prop="size"
+                             label="澶у皬"
+                             width="100">
+              <template #default="{ row }">
+                {{ formatFileSize(row.size) }}
+              </template>
+            </el-table-column>
+            <el-table-column label="鎿嶄綔"
+                             width="120"
+                             align="center">
+              <template #default="{ row, $index }">
+                <el-button type="primary"
+                           link
+                           @click="downloadAttachment(row)">
+                  涓嬭浇
+                </el-button>
+                <el-button type="danger"
+                           link
+                           @click="deleteAttachment(row, $index)">
+                  鍒犻櫎
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+        <div v-else
+             class="no-attachment">
+          鏆傛棤闄勪欢
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="closeAttachmentDialog">鍏抽棴</el-button>
         </div>
       </template>
     </el-dialog>
@@ -228,23 +651,123 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
-import { Search } from "@element-plus/icons-vue";
+import {onMounted, ref, reactive, getCurrentInstance, toRefs} from "vue";
+import {Search, Paperclip, Upload} from "@element-plus/icons-vue";
 import {
   addCustomer,
   delCustomer,
   getCustomer,
   listCustomer,
   updateCustomer,
+  addCustomerFollow,
+  updateCustomerFollow,
+  delCustomerFollow,
+  addReturnVisit,
+  getReturnVisit, transferCustomer,
 } from "@/api/basicData/customerFile.js";
-import { ElMessageBox } from "element-plus";
-import { userListNoPage } from "@/api/system/user.js";
+import {ElMessageBox} from "element-plus";
+import {userListNoPage} from "@/api/system/user.js";
 import useUserStore from "@/store/modules/user";
-import { getToken } from "@/utils/auth.js";
-const { proxy } = getCurrentInstance();
+import {getToken} from "@/utils/auth.js";
+
+const {proxy} = getCurrentInstance();
 const userStore = useUserStore();
 
+// 鍥炶鎻愰啋鐩稿叧
+const reminderDialogVisible = ref(false);
+const reminderFormRef = ref();
+const currentCustomerId = ref();
+const reminderForm = reactive({
+  customerName: "",
+  reminderSwitch: false,
+  reminderContent: "",
+  reminderTime: "",
+});
+const reminderRules = {
+  reminderContent: [
+    {required: true, message: "璇疯緭鍏ユ彁閱掑唴瀹�", trigger: "blur"},
+  ],
+  reminderTime: [
+    {required: true, message: "璇烽�夋嫨鎻愰啋鏃堕棿", trigger: "change"},
+  ],
+};
+
+// 娲借皥杩涘害鐩稿叧
+const negotiationDialogVisible = ref(false);
+const negotiationFormRef = ref();
+const negotiationForm = reactive({
+  customerName: "",
+  customerId: "",
+  followUpMethod: "",
+  followUpLevel: "",
+  followUpTime: "",
+  followerUserName: "",
+  content: "",
+});
+const negotiationRules = {
+  followUpMethod: [
+    {required: true, message: "璇烽�夋嫨璺熻繘鏂瑰紡", trigger: "change"},
+  ],
+  followUpLevel: [
+    {required: true, message: "璇烽�夋嫨璺熻繘绋嬪害", trigger: "change"},
+  ],
+  followUpTime: [
+    {required: true, message: "璇烽�夋嫨璺熻繘鏃堕棿", trigger: "change"},
+  ],
+  content: [{required: true, message: "璇疯緭鍏ュ唴瀹�", trigger: "blur"}],
+};
+
+// 璇︽儏鐩稿叧
+const detailDialogVisible = ref(false);
+const detailForm = reactive({
+  customerName: "",
+  customerType: "",
+  taxpayerIdentificationNumber: "",
+  companyPhone: "",
+  companyAddress: "",
+  basicBankAccount: "",
+  bankAccount: "",
+  bankCode: "",
+  contactPerson: "",
+  contactPhone: "",
+  maintainer: "",
+  maintenanceTime: "",
+});
+const negotiationRecords = ref([]);
+
+// 瀹㈡埛浜ゆ帴
+const transferDialogVisible = ref(false);
+const transferFormRef = ref();
+const transferForm = reactive({
+  id: 0,
+  createUser: 0,
+});
+const transferRules = {
+  userId: [{required: true, message: "璇烽�夋嫨浜ゆ帴浜哄憳", trigger: "change"}],
+};
+
+// 闄勪欢鐩稿叧
+const attachmentDialogVisible = ref(false);
+const attachmentUploadRef = ref();
+const currentAttachmentList = ref([]);
+const currentFollowRecord = ref({});
+const attachmentUploadHeaders = {Authorization: "Bearer " + getToken()};
+
+// 鍔ㄦ�佹瀯寤轰笂浼燯RL
+const getAttachmentUploadUrl = () => {
+  const baseUrl =
+      import.meta.env.VITE_APP_BASE_API + "/basic/customer-follow/upload";
+  return currentFollowRecord.value.id
+      ? `${baseUrl}/${currentFollowRecord.value.id}`
+      : baseUrl;
+};
+
 const tableColumn = ref([
+  {
+    label: "瀹㈡埛鍒嗙被",
+    prop: "customerType",
+    width: 120,
+  },
   {
     label: "瀹㈡埛鍚嶇О",
     prop: "customerName",
@@ -267,7 +790,17 @@
   {
     label: "鑱旂郴鐢佃瘽",
     prop: "contactPhone",
-    width:150
+    width: 150,
+  },
+  {
+    label: "璺熻繘杩涘害",
+    prop: "followUpLevel",
+    width: 120,
+  },
+  {
+    label: "璺熻繘鏃堕棿",
+    prop: "followUpTime",
+    width: 120,
   },
   {
     label: "閾惰鍩烘湰鎴�",
@@ -282,7 +815,7 @@
   {
     label: "寮�鎴疯鍙�",
     prop: "bankCode",
-    width:220
+    width: 220,
   },
   {
     label: "缁存姢浜�",
@@ -297,17 +830,43 @@
     dataType: "action",
     label: "鎿嶄綔",
     align: "center",
-		fixed: 'right',
+    fixed: "right",
+    width: 360,
     operation: [
       {
         name: "缂栬緫",
         type: "text",
-        clickFun: (row) => {
+        clickFun: row => {
           openForm("edit", row);
         },
-				disabled: (row) => {
-					return row.maintainer !== userStore.nickName
-				}
+      },
+      {
+        name: "娣诲姞娲借皥杩涘害",
+        type: "text",
+        clickFun: row => {
+          openNegotiationDialog(row);
+        },
+      },
+      {
+        name: "鍥炶鎻愰啋",
+        type: "text",
+        clickFun: row => {
+          openReminderDialog(row);
+        },
+      },
+      {
+        name: "瀹㈡埛浜ゆ帴",
+        type: "text",
+        clickFun: row => {
+          openTransferDialog(row);
+        },
+      },
+      {
+        name: "璇︽儏",
+        type: "text",
+        clickFun: row => {
+          openDetailDialog(row);
+        },
       },
     ],
   },
@@ -326,17 +885,19 @@
 // 鐢ㄦ埛淇℃伅琛ㄥ崟寮规鏁版嵁
 const operationType = ref("");
 const dialogFormVisible = ref(false);
-const formYYs = ref({    // 鍏朵粬瀛楁...
+const formYYs = ref({
+  // 鍏朵粬瀛楁...
   contactList: [
     {
       contactPerson: "",
-      contactPhone: ""
-    }
-  ]
+      contactPhone: "",
+    },
+  ],
 });
 const data = reactive({
   searchForm: {
     customerName: "",
+    customerType: "",
   },
   form: {
     customerName: "",
@@ -350,23 +911,25 @@
     basicBankAccount: "",
     bankAccount: "",
     bankCode: "",
+    customerType: "",
   },
   rules: {
-    customerName: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+    customerName: [{required: true, message: "璇疯緭鍏�", trigger: "blur"}],
     taxpayerIdentificationNumber: [
-      { required: true, message: "璇疯緭鍏�", trigger: "blur" },
+      {required: true, message: "璇疯緭鍏�", trigger: "blur"},
     ],
-    companyAddress: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-    companyPhone: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+    companyAddress: [{required: true, message: "璇疯緭鍏�", trigger: "blur"}],
+    companyPhone: [{required: true, message: "璇疯緭鍏�", trigger: "blur"}],
     // contactPerson: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
     // contactPhone: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-    maintainer: [{ required: false, message: "璇烽�夋嫨", trigger: "change" }],
+    maintainer: [{required: false, message: "璇烽�夋嫨", trigger: "change"}],
     maintenanceTime: [
-      { required: false, message: "璇烽�夋嫨", trigger: "change" },
+      {required: false, message: "璇烽�夋嫨", trigger: "change"},
     ],
-    basicBankAccount: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-    bankAccount: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
-    bankCode: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }],
+    basicBankAccount: [{required: true, message: "璇疯緭鍏�", trigger: "blur"}],
+    bankAccount: [{required: true, message: "璇疯緭鍏�", trigger: "blur"}],
+    bankCode: [{required: true, message: "璇疯緭鍏�", trigger: "blur"}],
+    customerType: [{required: true, message: "璇烽�夋嫨", trigger: "change"}],
   },
 });
 const upload = reactive({
@@ -377,19 +940,62 @@
   // 鏄惁绂佺敤涓婁紶
   isUploading: false,
   // 璁剧疆涓婁紶鐨勮姹傚ご閮�
-  headers: { Authorization: "Bearer " + getToken() },
+  headers: {Authorization: "Bearer " + getToken()},
   // 涓婁紶鐨勫湴鍧�
   url: import.meta.env.VITE_APP_BASE_API + "/basic/customer/importData",
+  // 鏂囦欢涓婁紶鍓嶇殑鍥炶皟
+  beforeUpload: file => {
+    console.log("鏂囦欢鍗冲皢涓婁紶", file);
+    // 鍙互鍦ㄦ澶勫仛鏂囦欢绫诲瀷鎴栧ぇ灏忔牎楠�
+    const isValid =
+        file.type ===
+        "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" ||
+        file.name.endsWith(".xlsx") ||
+        file.name.endsWith(".xls");
+    if (!isValid) {
+      proxy.$modal.msgError("鍙兘涓婁紶 Excel 鏂囦欢");
+    }
+    return isValid;
+  },
+  // 鏂囦欢鐘舵�佹敼鍙樻椂鐨勫洖璋�
+  onChange: (file, fileList) => {
+    console.log("鏂囦欢鐘舵�佹敼鍙�", file, fileList);
+  },
+  // 鏂囦欢涓婁紶鎴愬姛鏃剁殑鍥炶皟
+  onSuccess: (response, file, fileList) => {
+    console.log("涓婁紶鎴愬姛", response, file, fileList);
+    upload.isUploading = false;
+    if (response.code === 200) {
+      proxy.$modal.msgSuccess("鏂囦欢涓婁紶鎴愬姛");
+      upload.open = false;
+      proxy.$refs["uploadRef"].clearFiles();
+      getList();
+    } else if (response.code === 500) {
+      proxy.$modal.msgError(response.msg);
+    } else {
+      proxy.$modal.msgWarning(response.msg);
+    }
+  },
+  // 鏂囦欢涓婁紶澶辫触鏃剁殑鍥炶皟
+  onError: (error, file, fileList) => {
+    console.error("涓婁紶澶辫触", error, file, fileList);
+    upload.isUploading = false;
+    proxy.$modal.msgError("鏂囦欢涓婁紶澶辫触");
+  },
+  // 鏂囦欢涓婁紶杩涘害鍥炶皟
+  onProgress: (event, file, fileList) => {
+    console.log("涓婁紶涓�...", event.percent);
+  },
 });
-const { searchForm, form, rules } = toRefs(data);
+const {searchForm, form, rules} = toRefs(data);
 const addNewContact = () => {
   formYYs.value.contactList.push({
     contactPerson: "",
-    contactPhone: ""
+    contactPhone: "",
   });
 };
 
-const removeContact = (index) => {
+const removeContact = index => {
   if (formYYs.value.contactList.length > 1) {
     formYYs.value.contactList.splice(index, 1);
   }
@@ -400,32 +1006,41 @@
   page.current = 1;
   getList();
 };
-const pagination = (obj) => {
+const pagination = obj => {
   page.current = obj.page;
   page.size = obj.limit;
   getList();
 };
 const getList = () => {
   tableLoading.value = true;
-  listCustomer({ ...searchForm.value, ...page }).then((res) => {
+  listCustomer({...searchForm.value, ...page}).then(res => {
     tableLoading.value = false;
     tableData.value = res.records;
     page.total = res.total;
   });
 };
 // 琛ㄦ牸閫夋嫨鏁版嵁
-const handleSelectionChange = (selection) => {
+const handleSelectionChange = selection => {
   selectedRows.value = selection;
 };
+
 /** 鎻愪氦涓婁紶鏂囦欢 */
 function submitFileForm() {
+  upload.isUploading = true;
   proxy.$refs["uploadRef"].submit();
 }
+
 /** 瀵煎叆鎸夐挳鎿嶄綔 */
 function handleImport() {
   upload.title = "瀹㈡埛瀵煎叆";
   upload.open = true;
 }
+
+/** 涓嬭浇妯℃澘 */
+function importTemplate() {
+  proxy.download("/basic/customer/downloadTemplate", {}, "瀹㈡埛瀵煎叆妯℃澘.xlsx");
+}
+
 // 鎵撳紑寮规
 const openForm = (type, row) => {
   operationType.value = type;
@@ -434,30 +1049,31 @@
   formYYs.value.contactList = [
     {
       contactPerson: "",
-      contactPhone: ""
-    }
+      contactPhone: "",
+    },
   ];
   form.value.maintenanceTime = getCurrentDate();
-  userListNoPage().then((res) => {
+  userListNoPage().then(res => {
     userList.value = res.data;
   });
   if (type === "edit") {
-    getCustomer(row.id).then((res) => {
-      form.value = { ...res.data };
-      formYYs.value.contactList = res.data.contactPerson.split(",").map((item, index) => {
-        return {
-          contactPerson: item,
-          contactPhone: res.data.contactPhone.split(",")[index]
-        }
-      });
-
+    getCustomer(row.id).then(res => {
+      form.value = {...res.data};
+      formYYs.value.contactList = res.data.contactPerson
+          .split(",")
+          .map((item, index) => {
+            return {
+              contactPerson: item,
+              contactPhone: res.data.contactPhone.split(",")[index],
+            };
+          });
     });
   }
   dialogFormVisible.value = true;
 };
 // 鎻愪氦琛ㄥ崟
 const submitForm = () => {
-  proxy.$refs["formRef"].validate((valid) => {
+  proxy.$refs["formRef"].validate(valid => {
     if (valid) {
       if (operationType.value === "edit") {
         submitEdit();
@@ -469,12 +1085,16 @@
 };
 // 鎻愪氦鏂板
 const submitAdd = () => {
-  if(formYYs.value.contactList.length < 1){
+  if (formYYs.value.contactList.length < 1) {
     return proxy.$modal.msgWarning("璇疯嚦灏戞坊鍔犱竴涓仈绯讳汉");
   }
-  form.value.contactPerson = formYYs.value.contactList.map(item => item.contactPerson).join(",");
-  form.value.contactPhone = formYYs.value.contactList.map(item => item.contactPhone).join(",");
-  addCustomer(form.value).then((res) => {
+  form.value.contactPerson = formYYs.value.contactList
+      .map(item => item.contactPerson)
+      .join(",");
+  form.value.contactPhone = formYYs.value.contactList
+      .map(item => item.contactPhone)
+      .join(",");
+  addCustomer(form.value).then(res => {
     proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
     closeDia();
     getList();
@@ -482,7 +1102,13 @@
 };
 // 鎻愪氦淇敼
 const submitEdit = () => {
-  updateCustomer(form.value).then((res) => {
+  form.value.contactPerson = formYYs.value.contactList
+      .map(item => item.contactPerson)
+      .join(",");
+  form.value.contactPhone = formYYs.value.contactList
+      .map(item => item.contactPhone)
+      .join(",");
+  updateCustomer(form.value).then(res => {
     proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
     closeDia();
     getList();
@@ -493,6 +1119,31 @@
   proxy.resetForm("formRef");
   dialogFormVisible.value = false;
 };
+
+const openTransferDialog = row => {
+  userListNoPage().then(res => {
+    userList.value = res.data;
+  });
+  transferForm.id = row.id;
+  transferForm.createUser = row.createUser;
+  transferDialogVisible.value = true;
+};
+const closeTransferDialog = () => {
+  proxy.resetForm("transferFormRef");
+  transferDialogVisible.value = false;
+};
+const submitTransfer = () => {
+  proxy.$refs["transferFormRef"].validate(valid => {
+    if (!valid) {
+      return;
+    }
+    transferCustomer(transferForm).then(res => {
+      proxy.$modal.msgSuccess("浜ゆ帴鎴愬姛");
+      getList();
+    })
+    closeTransferDialog();
+  });
+};
 // 瀵煎嚭
 const handleOut = () => {
   ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
@@ -500,24 +1151,41 @@
     cancelButtonText: "鍙栨秷",
     type: "warning",
   })
-    .then(() => {
-      proxy.download("/basic/customer/export", {}, "瀹㈡埛妗f.xlsx");
-    })
-    .catch(() => {
-      proxy.$modal.msg("宸插彇娑�");
-    });
+      .then(() => {
+        proxy.download("/basic/customer/export", {}, "瀹㈡埛妗f.xlsx");
+      })
+      .catch(() => {
+        proxy.$modal.msg("宸插彇娑�");
+      });
+};
+
+// 瀵煎嚭璺熻繘璁板綍
+const handleOutFollowUpList = () => {
+  ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
+    confirmButtonText: "纭",
+    cancelButtonText: "鍙栨秷",
+    type: "warning",
+  })
+      .then(() => {
+        proxy.download("/basic/customer/exportFollowUpList", {}, "瀹㈡埛璺熻繘璁板綍.xlsx");
+      })
+      .catch(() => {
+        proxy.$modal.msg("宸插彇娑�");
+      });
 };
 // 鍒犻櫎
 const handleDelete = () => {
   let ids = [];
   if (selectedRows.value.length > 0) {
     // 妫�鏌ユ槸鍚︽湁浠栦汉缁存姢鐨勬暟鎹�
-    const unauthorizedData = selectedRows.value.filter(item => item.maintainer !== userStore.nickName);
+    const unauthorizedData = selectedRows.value.filter(
+        item => item.maintainer !== userStore.nickName
+    );
     if (unauthorizedData.length > 0) {
       proxy.$modal.msgWarning("涓嶅彲鍒犻櫎浠栦汉缁存姢鐨勬暟鎹�");
       return;
     }
-    ids = selectedRows.value.map((item) => item.id);
+    ids = selectedRows.value.map(item => item.id);
   } else {
     proxy.$modal.msgWarning("璇烽�夋嫨鏁版嵁");
     return;
@@ -527,20 +1195,387 @@
     cancelButtonText: "鍙栨秷",
     type: "warning",
   })
-    .then(() => {
-      tableLoading.value = true;
-      delCustomer(ids)
-        .then((res) => {
-          proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
-          getList();
-        })
-        .finally(() => {
-          tableLoading.value = false;
+      .then(() => {
+        tableLoading.value = true;
+        delCustomer(ids)
+            .then(res => {
+              proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+              getList();
+            })
+            .finally(() => {
+              tableLoading.value = false;
+            });
+      })
+      .catch(() => {
+        proxy.$modal.msg("宸插彇娑�");
+      });
+};
+
+// 鎵撳紑鍥炶鎻愰啋寮圭獥
+const openReminderDialog = row => {
+  currentCustomerId.value = row.id;
+  reminderForm.customerName = row.customerName;
+  reminderForm.reminderSwitch = false;
+  reminderForm.reminderContent = "";
+  reminderForm.reminderTime = "";
+
+  // 灏濊瘯鑾峰彇宸叉湁鐨勫洖璁挎彁閱�
+  getReturnVisit(row.id)
+      .then(res => {
+        if (res.code === 200 && res.data) {
+          reminderForm.reminderSwitch = res.data.isEnabled === 1;
+          reminderForm.reminderContent = res.data.content;
+          reminderForm.reminderTime = res.data.reminderTime;
+          reminderForm.id = res.data.id;
+        }
+      })
+      .catch(error => {
+        console.error("鑾峰彇鍥炶鎻愰啋澶辫触:", error);
+      });
+
+  reminderDialogVisible.value = true;
+};
+
+// 鍏抽棴鍥炶鎻愰啋寮圭獥
+const closeReminderDialog = () => {
+  proxy.resetForm("reminderFormRef");
+  reminderDialogVisible.value = false;
+};
+const submitvalue = ref({});
+
+// 鎻愪氦鍥炶鎻愰啋
+const submitReminderForm = () => {
+  console.log("鎻愪氦鍥炶鎻愰啋鏁版嵁:", userStore.id, userStore);
+  proxy.$refs.reminderFormRef.validate(valid => {
+    if (valid) {
+      if (reminderForm.id) {
+        submitvalue.value = {
+          id: reminderForm.id,
+          customerId: currentCustomerId.value,
+          isEnabled: reminderForm.reminderSwitch ? 1 : 0,
+          content: reminderForm.reminderContent,
+          reminderTime: reminderForm.reminderTime,
+          remindUserId: userStore.id,
+        };
+      } else {
+        submitvalue.value = {
+          customerId: currentCustomerId.value,
+          isEnabled: reminderForm.reminderSwitch ? 1 : 0,
+          content: reminderForm.reminderContent,
+          reminderTime: reminderForm.reminderTime,
+          remindUserId: userStore.id,
+        };
+      }
+
+      console.log("鎻愪氦鍥炶鎻愰啋鏁版嵁:", submitvalue.value);
+
+      // 璋冪敤鎺ュ彛
+      addReturnVisit(submitvalue.value)
+          .then(res => {
+            if (res.code === 200) {
+              proxy.$modal.msgSuccess("鍥炶鎻愰啋璁剧疆鎴愬姛");
+              closeReminderDialog();
+            } else {
+              proxy.$modal.msgError(res.msg || "璁剧疆澶辫触");
+            }
+          })
+          .catch(error => {
+            console.error("璁剧疆鍥炶鎻愰啋澶辫触:", error);
+            proxy.$modal.msgError("璁剧疆澶辫触");
+          });
+    }
+  });
+};
+
+// 鎵撳紑娲借皥杩涘害寮圭獥
+const openNegotiationDialog = row => {
+  negotiationForm.customerName = row.customerName;
+  negotiationForm.customerId = row.id;
+  negotiationForm.followUpMethod = "";
+  negotiationForm.followUpLevel = "";
+  negotiationForm.followUpTime = "";
+  negotiationForm.followerUserName = userStore.nickName; // 榛樿褰撳墠鐧诲綍浜�
+  negotiationForm.content = "";
+  // {
+  // 	"customerId": 152,
+  // 	"followUpMethod": "鐢佃瘽娌熼��",
+  // 	"followUpLevel": "娌℃湁鎰忓悜",
+  // 	"followUpTime": "2026-03-04T15:30:00",
+  // 	"followerUserName": "绠$悊鍛樿处鍙�",
+  // 	"content": "111"
+  // }
+  negotiationDialogVisible.value = true;
+};
+
+// 鍏抽棴娲借皥杩涘害寮圭獥
+const closeNegotiationDialog = () => {
+  proxy.resetForm("negotiationFormRef");
+  // 娓呴櫎缂栬緫鐘舵��
+  delete negotiationForm.editIndex;
+  delete negotiationForm.id;
+  negotiationDialogVisible.value = false;
+};
+
+// 鎻愪氦娲借皥杩涘害
+const submitNegotiationForm = () => {
+  proxy.$refs.negotiationFormRef.validate(valid => {
+    if (valid) {
+      // 鍒ゆ柇鏄柊澧炶繕鏄慨鏀�
+      const isEdit = negotiationForm.editIndex !== undefined;
+
+      if (isEdit) {
+        // 淇敼鎿嶄綔
+        console.log("淇敼娲借皥杩涘害鏁版嵁:", negotiationForm);
+        // 杩欓噷鍙互璋冪敤鏇存柊鎺ュ彛
+        // 瀹為檯椤圭洰涓渶瑕佹牴鎹悗绔帴鍙h繘琛岃皟鏁�
+        // 绀轰緥锛歶pdateCustomerFollow(negotiationForm).then(res => {
+        //   // 鏇存柊鏈湴鏁版嵁
+        //   const index = negotiationForm.editIndex;
+        //   negotiationRecords.value[index] = {
+        //     followUpTime: negotiationForm.followUpTime,
+        //     followUpMethod: negotiationForm.followUpMethod,
+        //     followUpLevel: negotiationForm.followUpLevel,
+        //     followerUserName: negotiationForm.followerUserName,
+        //     content: negotiationForm.content,
+        //     id: negotiationForm.id,
+        //   };
+        //   proxy.$modal.msgSuccess("淇敼鎴愬姛");
+        //   closeNegotiationDialog();
+        // });
+        updateCustomerFollow(negotiationForm).then(res => {
+          // 鏇存柊鏈湴鏁版嵁
+          getCustomer(negotiationForm.customerId).then(res => {
+            // 鏇存柊鏈湴鏁版嵁
+            negotiationRecords.value = res.data.followUpList || [];
+          });
         });
-    })
-    .catch(() => {
-      proxy.$modal.msg("宸插彇娑�");
-    });
+        proxy.$modal.msgSuccess("淇敼鎴愬姛");
+        closeNegotiationDialog();
+      } else {
+        // 鏂板鎿嶄綔
+        console.log("鎻愪氦娲借皥杩涘害鏁版嵁:", negotiationForm);
+        addCustomerFollow(negotiationForm).then(res => {
+          // 娣诲姞鎴愬姛鍚庢洿鏂拌鎯呴〉闈㈢殑杩涘害璁板綍
+          const newRecord = {
+            followUpTime: negotiationForm.followUpTime,
+            followUpMethod: negotiationForm.followUpMethod,
+            followUpLevel: negotiationForm.followUpLevel,
+            followerUserName: negotiationForm.followerUserName,
+            content: negotiationForm.content,
+          };
+          negotiationRecords.value.unshift(newRecord);
+
+          proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
+          closeNegotiationDialog();
+          getList();
+        });
+      }
+    }
+  });
+};
+
+// 鎵撳紑璇︽儏寮圭獥
+const openDetailDialog = row => {
+  // 璋冪敤getCustomer鎺ュ彛鑾峰彇瀹㈡埛璇︽儏
+  getCustomer(row.id).then(res => {
+    // 濉厖瀹㈡埛鍩烘湰淇℃伅
+    Object.assign(detailForm, res.data);
+
+    // 鑾峰彇娲借皥杩涘害璁板綍
+    negotiationRecords.value = res.data.followUpList || [];
+
+    detailDialogVisible.value = true;
+  });
+};
+
+// 鍏抽棴璇︽儏寮圭獥
+const closeDetailDialog = () => {
+  detailDialogVisible.value = false;
+};
+
+// 淇敼娲借皥璁板綍
+const editNegotiationRecord = (row, index) => {
+  // 灏嗗綋鍓嶈褰曟暟鎹~鍏呭埌琛ㄥ崟
+  Object.assign(negotiationForm, {
+    customerName: row.customerName,
+    customerId: row.customerId,
+    followUpMethod: row.followUpMethod,
+    followUpLevel: row.followUpLevel,
+    followUpTime: row.followUpTime,
+    followerUserName: row.followerUserName,
+    content: row.content,
+    id: row.id, // 璁板綍ID鐢ㄤ簬鏇存柊
+    editIndex: index, // 璁板綍绱㈠紩鐢ㄤ簬鏈湴鏇存柊
+  });
+  negotiationDialogVisible.value = true;
+};
+
+// 鍒犻櫎娲借皥璁板綍
+const deleteNegotiationRecord = (row, index) => {
+  ElMessageBox.confirm("纭畾瑕佸垹闄よ繖鏉℃唇璋堣褰曞悧锛�", "鍒犻櫎鎻愮ず", {
+    confirmButtonText: "纭畾",
+    cancelButtonText: "鍙栨秷",
+    type: "warning",
+  })
+      .then(() => {
+        // 杩欓噷鍙互璋冪敤鍒犻櫎鎺ュ彛
+        // 瀹為檯椤圭洰涓渶瑕佹牴鎹悗绔帴鍙h繘琛岃皟鏁�
+        // 绀轰緥锛歞eleteCustomerFollow(row.id).then(() => {
+        //   negotiationRecords.value.splice(index, 1);
+        //   proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+        // });
+        delCustomerFollow(row.id).then(() => {
+          // 鍒犻櫎鎴愬姛鍚庢洿鏂版湰鍦版暟鎹�
+          getCustomer(row.customerId).then(res => {
+            // 鏇存柊鏈湴鏁版嵁
+            negotiationRecords.value = res.data.followUpList || [];
+          });
+          proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+        });
+        // 鏈湴鍒犻櫎锛堟ā鎷燂級
+        negotiationRecords.value.splice(index, 1);
+        proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+      })
+      .catch(() => {
+        proxy.$modal.msg("宸插彇娑堝垹闄�");
+      });
+};
+
+// 鎵撳紑闄勪欢寮圭獥
+const openAttachmentDialog = row => {
+  currentFollowRecord.value = row;
+  // 杞崲涓虹鍚圗lement Plus fileList鏍煎紡鐨勬暟缁�
+  currentAttachmentList.value = (row.fileList || []).map((file, index) => ({
+    name: file.fileName,
+    url: file.fileUrl,
+    size: file.fileSize,
+    id: file.id,
+    uid: file.id || index,
+    status: "success",
+  }));
+
+  attachmentDialogVisible.value = true;
+};
+
+// 鍏抽棴闄勪欢寮圭獥
+const closeAttachmentDialog = () => {
+  attachmentDialogVisible.value = false;
+  currentFollowRecord.value = {};
+  currentAttachmentList.value = [];
+};
+
+// 闄勪欢涓婁紶鎴愬姛
+const handleAttachmentSuccess = (response, file, fileList) => {
+  if (response.code === 200) {
+    proxy.$modal.msgSuccess("涓婁紶鎴愬姛");
+    // 鏇存柊褰撳墠璁板綍鐨勯檮浠跺垪琛�
+    currentAttachmentList.value = fileList.map(item => ({
+      name: item.name,
+      size: item.size,
+      url: item.response?.data?.url || item.url,
+      id: item.response?.data?.id,
+      uid: item.uid,
+      status: "success",
+    }));
+    // 鏇存柊鍘熻褰曚腑鐨刦iles瀛楁
+    if (currentFollowRecord.value) {
+      currentFollowRecord.value.files = [...currentAttachmentList.value];
+    }
+  } else {
+    proxy.$modal.msgError(response.msg || "涓婁紶澶辫触");
+  }
+};
+
+// 闄勪欢涓婁紶澶辫触
+const handleAttachmentError = (error, file, fileList) => {
+  console.error("涓婁紶澶辫触:", error);
+  proxy.$modal.msgError("涓婁紶澶辫触");
+};
+
+// 闄勪欢绉婚櫎
+const handleAttachmentRemove = (file, fileList) => {
+  currentAttachmentList.value = fileList;
+  // 鏇存柊鍘熻褰曚腑鐨刦iles瀛楁
+  if (currentFollowRecord.value) {
+    currentFollowRecord.value.files = [...fileList];
+  }
+};
+
+// 闄勪欢涓婁紶鍓嶆牎楠�
+const beforeAttachmentUpload = file => {
+  const maxSize = 50 * 1024 * 1024; // 50MB
+  if (file.size > maxSize) {
+    proxy.$modal.msgError("鏂囦欢澶у皬涓嶈兘瓒呰繃50MB");
+    return false;
+  }
+  return true;
+};
+
+// 鏍煎紡鍖栨枃浠跺ぇ灏�
+const formatFileSize = size => {
+  if (size < 1024) {
+    return size + " B";
+  } else if (size < 1024 * 1024) {
+    return (size / 1024).toFixed(2) + " KB";
+  } else {
+    return (size / (1024 * 1024)).toFixed(2) + " MB";
+  }
+};
+
+// 涓嬭浇闄勪欢
+const downloadAttachment = row => {
+  if (row.url) {
+    // proxy.download(row.url, {}, row.name);
+    proxy.$download.name(row.url);
+  } else {
+    proxy.$modal.msgError("涓嬭浇閾炬帴涓嶅瓨鍦�");
+  }
+};
+
+// 鍒犻櫎闄勪欢
+const deleteAttachment = (row, index) => {
+  ElMessageBox.confirm("纭畾瑕佸垹闄よ繖涓檮浠跺悧锛�", "鍒犻櫎鎻愮ず", {
+    confirmButtonText: "纭畾",
+    cancelButtonText: "鍙栨秷",
+    type: "warning",
+  })
+      .then(() => {
+        // 璋冪敤鍚庣鎺ュ彛鍒犻櫎闄勪欢
+        const deleteUrl =
+            import.meta.env.VITE_APP_BASE_API +
+            "/basic/customer-follow/file/" +
+            row.id;
+        fetch(deleteUrl, {
+          method: "DELETE",
+          headers: {
+            Authorization: "Bearer " + getToken(),
+            "Content-Type": "application/json",
+          },
+        })
+            .then(response => response.json())
+            .then(res => {
+              if (res.code === 200) {
+                // 鍒犻櫎鎴愬姛鍚庢洿鏂版湰鍦版枃浠跺垪琛�
+                currentAttachmentList.value.splice(index, 1);
+                // 鏇存柊鍘熻褰曚腑鐨刦iles瀛楁
+                if (currentFollowRecord.value) {
+                  currentFollowRecord.value.files = [
+                    ...currentAttachmentList.value,
+                  ];
+                }
+                proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+              } else {
+                proxy.$modal.msgError(res.msg || "鍒犻櫎澶辫触");
+              }
+            })
+            .catch(error => {
+              console.error("鍒犻櫎闄勪欢澶辫触:", error);
+              proxy.$modal.msgError("鍒犻櫎澶辫触");
+            });
+      })
+      .catch(() => {
+        proxy.$modal.msg("宸插彇娑堝垹闄�");
+      });
 };
 
 // 鑾峰彇褰撳墠鏃ユ湡骞舵牸寮忓寲涓� YYYY-MM-DD
@@ -552,7 +1587,93 @@
   return `${year}-${month}-${day}`;
 }
 
-getList();
+
+onMounted(() => {
+  getList();
+});
 </script>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.detail-section {
+  margin-bottom: 20px;
+  padding: 15px;
+  background-color: #f9f9f9;
+  border-radius: 4px;
+}
+
+.section-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 15px;
+}
+
+.section-title {
+  font-size: 16px;
+  font-weight: bold;
+  margin: 0 0 15px 0;
+  color: #333;
+}
+
+.info-display {
+  background-color: #fff;
+  padding: 15px;
+  border-radius: 4px;
+}
+
+.info-item {
+  margin-bottom: 12px;
+  display: flex;
+  align-items: flex-start;
+}
+
+.info-label {
+  width: 120px;
+  font-weight: 500;
+  color: #606266;
+  margin-right: 10px;
+}
+
+.info-value {
+  flex: 1;
+  color: #303133;
+  word-break: break-word;
+}
+
+.no-records {
+  text-align: center;
+  padding: 30px;
+  color: #999;
+  font-size: 14px;
+}
+
+.attachment-section {
+  .upload-area {
+    margin-bottom: 20px;
+    padding: 20px;
+    background-color: #f9f9f9;
+    border-radius: 4px;
+    border: 1px dashed #d9d9d9;
+
+    .el-upload__tip {
+      margin-top: 10px;
+      color: #909399;
+    }
+  }
+
+  .attachment-list {
+    h4 {
+      margin: 0 0 10px 0;
+      font-size: 14px;
+      color: #606266;
+    }
+  }
+
+  .no-attachment {
+    text-align: center;
+    padding: 40px;
+    color: #909399;
+    font-size: 14px;
+  }
+}
+</style>

--
Gitblit v1.9.3