提交

web-admin/src/components/ContactSelector.vue

@@ -35,8 +35,18 @@
 
     <!-- 联系人列表 -->
     <div v-if="customerId" class="panel dialog-list-panel">
+      <div class="list-toolbar">
+        <div class="list-toolbar-row">
+          <div class="list-toolbar-selected">
+            <el-button class="btn-main" type="primary" @click="handleAddContact">
+              <el-icon><Plus /></el-icon>新增
+            </el-button>
+          </div>
+        </div>
+      </div>
       <div class="list-body list-wrap dialog-list-body-only">
         <el-table
+          ref="tableRef"
           v-loading="loading"
           :data="contactList"
           class="list-table"
@@ -103,6 +113,8 @@
         </el-button>
       </div>
     </template>
+
+    <ContactFormDialog ref="contactFormRef" @success="handleContactFormSuccess" />
   </el-dialog>
 </template>
 
@@ -110,9 +122,10 @@
 import { useDictStore } from '@/store/modules/dict'
 import DictTag from '@/components/DictTag/index.vue'
 import ListPagination from '@/components/ListPagination/index.vue'
-import { Check, Close, Refresh, Search } from '@element-plus/icons-vue'
+import ContactFormDialog from '@/views/crm/customer/components/ContactFormDialog.vue'
+import { Check, Close, Plus, Refresh, Search } from '@element-plus/icons-vue'
 import { ref, watch } from 'vue'
-import type { ElFormInstance } from 'element-plus'
+import type { ElFormInstance, TableInstance } from 'element-plus'
 import { fetchContactList } from '@/api/crm/contact'
 import type { ContactQuery, ContactVO } from '@/api/crm/customer'
 
@@ -167,6 +180,8 @@ const loading = ref(false)
 const total = ref(0)
 const currentContact = ref<ContactVO | null>(null)
 const queryFormRef = ref<ElFormInstance>()
+const tableRef = ref<TableInstance>()
+const contactFormRef = ref<InstanceType<typeof ContactFormDialog>>()
 
 const resetQueryParams = () => {
   queryParams.value.pageNum = 1
@@ -176,7 +191,7 @@ const resetQueryParams = () => {
   queryFormRef.value?.resetFields()
 }
 
-const getList = async () => {
+const getList = async (selectId?: string | number) => {
   if (!props.customerId) {
     contactList.value = []
     total.value = 0
@@ -196,6 +211,9 @@ const getList = async () => {
     })
     contactList.value = res.list || res.rows || []
     total.value = res.total ?? 0
+    if (selectId) {
+      selectContactById(selectId)
+    }
   } catch (error) {
     console.error('获取联系人列表失败:', error)
   } finally {
@@ -203,6 +221,25 @@ const getList = async () => {
   }
 }
 
+const selectContactById = (id?: string | number) => {
+  if (!id) return
+  const row = contactList.value.find((item) => String(item.id) === String(id))
+  if (!row) return
+  currentContact.value = row
+  tableRef.value?.setCurrentRow(row)
+}
+
+const handleAddContact = () => {
+  if (!props.customerId) return
+  contactFormRef.value?.open(undefined, props.customerId)
+}
+
+const handleContactFormSuccess = async (payload?: { id?: string | number }) => {
+  resetQueryParams()
+  queryParams.value.pageNum = 1
+  await getList(payload?.id)
+}
+
 const handleQuery = () => {
   queryParams.value.pageNum = 1
   getList()