添加我的客户默认列表页的有关接口调用

src/api/highSeasCustomer.ts

@@ -51,7 +51,7 @@ export const updateHighSeasCustomerApi = (data:any) => {
 export const deleteHighSeasCustomerApi = (customerId:any) => {
     return request({
         url: `${adminPrefix}/api/v1/public/customer/delete/${customerId}`,
-        method: 'post',
+        method: 'get',
     })
 }
 
@@ -60,7 +60,7 @@ export const deleteHighSeasCustomerApi = (customerId:any) => {
 export const claimHighSeasCustomerApi = (customerId:any) => {
     return request({
         url: `${adminPrefix}/api/v1/public/customer/claim/${customerId}`,
-        method: 'post',
+        method: 'get',
     })
 }
 

src/components/SchoolFormDialog/formDialog.ts

@@ -2,7 +2,7 @@ import { ref } from "vue";
 
 export const formItemList = ref([
   {
-    key: 'schoolName',
+    key: 'name',
     label: '学校名称',
     type: 'input',
     placeholder: '学校名称',
@@ -43,7 +43,7 @@ export const formItemList = ref([
     style: { display: 'flex' }
   },
   {
-    key: 'detailAddress',
+    key: 'address',
     label: '详细地址',
     type: 'input',
     placeholder: '请输入详细地址',

src/components/SchoolFormDialog/index.vue

@@ -3,7 +3,7 @@
         :title="props.schoolTitle" 
         :visible="editFormDialogVisible" 
         :submitLoading="editFormDialogSubmitLoading"
-        :defaultFormData="schoolFormData"
+        :defaultFormData="defaultFormData"
         :formItemList="filterFormItemList"
         @formItemChange="HandleFormItemChange"
         @close="CloseFormDialog"
@@ -46,9 +46,6 @@ const props = defineProps({
 
 const emit = defineEmits(['confirm'])
 
-const schoolFormData = ref({})
-
-
 const editFormDialogVisible = defineModel('visible')
 const editFormDialogSubmitLoading = defineModel('editFormDialogSubmitLoading')
 
@@ -64,29 +61,26 @@ const HandleConfirmFormDialog = (params)=>{
 const HandleFormItemChange = (params)=>{
     const {key,val,formData,subKey} = params
     if(key == 'provinceArea' && subKey == 'province'){
-        // 变更地区下拉
-        filterFormItemList.value = filterFormItemList.value.map(item=>{
-            if(item.key == 'provinceArea'){
-                let provinceSubSelectList = item.unionSelectList.find(unionItm=>unionItm.key == 'province')
-                                                ?.selectList.find(opt=>opt.value==val)?.subData || []
-                item.unionSelectList.map(unionItm=>{
-                    if(unionItm.key == 'district'){
-                        unionItm.selectList = provinceSubSelectList
-                    }
-                })
-            }
-            return item
-        })
-        // 同时要清空地区选择
-        schoolFormData.value.provinceArea.district = null
+        formData.provinceArea.district = null
     }
 }
 
 
 
-// 动态变更表单默认值
-watch(()=>props.defaultFormData,(newVal)=>{
-    schoolFormData.value = newVal
+// 切换省份 变更 地区下拉
+watch(()=>props.defaultFormData?.provinceArea?.province,(newVal)=>{
+    filterFormItemList.value = filterFormItemList.value.map(item=>{
+        if(item.key == 'provinceArea'){
+            let provinceSubSelectList = item.unionSelectList.find(unionItm=>unionItm.key == 'province')
+                                            ?.selectList.find(opt=>opt.value==newVal)?.subData || []
+            item.unionSelectList.map(unionItm=>{
+                if(unionItm.key == 'district'){
+                    unionItm.selectList = provinceSubSelectList
+                }
+            })
+        }
+        return item
+    })
 },{deep:true})
 
 // 动态变更表单下拉

src/views/highSeasCustomer/index.vue

@@ -15,17 +15,23 @@
             <FormSearchGroup :searchList="formSearchList" @searchChange="HandleSearchChange"></FormSearchGroup>
             <Table :tableColumns="publicSeasTableColumns" :tableData="tableData" 
                 :currentPage="currentPage" :pageSize="pageSize" :totalNum="totalNum">
+
+                <template #num="{row,currentIndex}">
+                    {{ currentIndex + pageSize * (currentPage - 1) }}
+                </template>
+                
                 <template #operation="{row}">
                     <div class="table_row_option">
-                        <span class="button_editor">认领</span>
+                        <span class="button_editor" @click="ClaimCustomer(row)">认领</span>
                         <span class="button_editor" @click="OpenSchoolFormDialog(row)">编辑</span>
                         <span class="button_editor" @click="GoToDetail(row)">详情</span>
-                        <span class="el_button_delete">删除</span>
+                        <span class="el_button_delete" @click="OpenDeleteDialog(row)">删除</span>
                     </div>
                 </template>
             </Table>
         </div>
 
+        <!-- 新增/修改 学校弹窗 -->
         <SchoolFormDialog 
             :schoolTitle="schoolTitle" 
             v-model:visible="schoolVisible" 
@@ -37,9 +43,12 @@
 
 
         <!--  批量导入 弹窗 -->
-        <FormDialog class="batch_import_form" width="548px" title="批量导入" :visible="batchImportVisible" 
+        <FormDialog class="batch_import_form" width="548px" 
+            title="批量导入" :visible="batchImportVisible" 
             :submitLoading="batchImportSubmitLoading" 
-            :defaultFormData="{}" :formItemList="batchImportFormItemList"
+            :defaultFormData="defaultImportFormData" 
+            :formItemList="batchImportFormItemList"
+            @fileUpload="HandleFileUplaod"
             @close="CloseBatchImportDialog"
             @confirm="HandleBatchImportComfirm">
             <template #templateFile>
@@ -50,7 +59,13 @@
                 <div style="font-size: 12px;">用于分析同一份试卷内不同试卷类型的得分、排名等情况。可下载模块进行填写后导入。</div>
             </template>
         </FormDialog>
-        
+
+        <!-- 删除弹窗 -->
+        <Dialog :visible="deleteDialogVisible" 
+            :submitLoading="deleteDialogSubmitLoading"
+            @close="CloseDeleteDialog"
+            @confirm="HandleDeleteDialogConfirm">
+        </Dialog> 
     
     </div>
 </template>
@@ -59,7 +74,7 @@
 <script setup lang="ts">
 import { computed, onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
-
+import {ElMessage} from 'element-plus'
 
 import FormSearchGroup from '@/baseComponents/FormSearchGroup.vue';
 import {formSearchList} from './formSearchGroup';
@@ -77,48 +92,19 @@ import {HandleExportExcel} from '@/utils/exportExcelData'
 import { getHeaderSearchParamsApi,
         getHighSeasCustomerListApi, 
         addHighSeasCustomerApi,
+        importHighSeasCustomerApi,
         updateHighSeasCustomerApi,
         deleteHighSeasCustomerApi,
         claimHighSeasCustomerApi,
-        importHighSeasCustomerApi,
 
     } from '@/api/highSeasCustomer'
-
-
-
-
-
-
+import Dialog from '@/baseComponents/Dialog.vue';
 
 
 const router = useRouter()
 
 
 
-// 批量导入弹窗有关数据
-const batchImportVisible = ref(false)
-const batchImportSubmitLoading = ref(false)
-const OpenBatchImportDialog = ()=>{
-    batchImportVisible.value = true   
-}
-const CloseBatchImportDialog = ()=>{
-    batchImportVisible.value = false
-}
-const HandleBatchImportComfirm = ()=>{
-    CloseBatchImportDialog()
-}
-
-const HandleDownloadTemplate = async ()=>{
-   await HandleExportExcel(templateTableColumns.value,[],'新增学校_批量导入模板')
-
-}
-
-
-/** 跳转详情 */
-const GoToDetail = (row)=>{
-    router.push(`highSeasCustomerDetail?id=${row.id}`)
-}
-
 /** 1. 头部筛选 有关操作 */
 const searchParams = ref({
     stage:'all',
@@ -179,7 +165,10 @@ const GetHeaderSearchParams = async ()=>{
     stageOptions.value = stageData?.map(item=>{
         return{
             label:item.name,
-            value:item.id || 'all',
+            value:JSON.stringify({
+                label:item.name,
+                value:item.id,
+            }),
         }
     })?.slice(1) || []
 
@@ -187,11 +176,17 @@ const GetHeaderSearchParams = async ()=>{
     regionOptions.value = regionData?.map(item=>{
         return{
             label:item.name,
-            value:item.id || 'all',
+            value:JSON.stringify({
+                label:item.name,
+                value:item.id
+            }),
             subData:item.subData?.map(sub=>{
                 return {
                     label:sub.name,
-                    value:sub.id || 'all',
+                    value:JSON.stringify({
+                        label:sub.name, 
+                        value:sub.id
+                    }),
                 }
             }).slice(1) || [],
         }
@@ -215,27 +210,14 @@ const pageSize = ref(20)
 const currentPage = ref(1)
 const totalNum = ref(0)
 // 表格数据
-const tableData = ref([
-  {
-    index: '1',
-    schoolName: '流星花园学校',
-    schoolStage: 'primary',
-    schoolStageName: '小学',
-    province: '北京市',
-    district: '西城区',
-    poolTime: '2026-03-11',
-    idleDays: '3天',
-    detailAddress:'通州北苑'
-  },
-  
-])
+const tableData = ref([])
 
 const GetTableData = async ()=>{
     let params = {
         queryStr: searchParams.value.queryStr,
-        stageId: searchParams.value.stage === 'all' ? '' : searchParams.value.stage,
-        provinceId: searchParams.value.province === 'all' ? '' : searchParams.value.province,
-        cityId: searchParams.value.area === 'all' ? '' : searchParams.value.area,
+        stageId: searchParams.value.stage === 'all' ? '' : JSON.parse(searchParams.value.stage || '{}')?.value,
+        provinceId: searchParams.value.province === 'all' ? '' : JSON.parse(searchParams.value.province || '{}')?.value,
+        cityId: searchParams.value.area === 'all' ? '' : JSON.parse(searchParams.value.area || '{}')?.value,
         pageNum: currentPage.value,
         pageSize: pageSize.value
     }
@@ -246,7 +228,7 @@ const GetTableData = async ()=>{
 
 
 /**
- * 学校弹窗有关数据
+ * 3. 新增/修改 学校弹窗有关数据
  */
 const schoolVisible = ref(false)
 const schoolTitle = ref('')
@@ -276,9 +258,19 @@ const OpenSchoolFormDialog = (row?:any)=>{
         schoolTitle.value = '编辑学校'
         schoolDefaultFormData.value = {
             ...row,
+            schoolStage:JSON.stringify({
+                label:row.stageName,
+                value:row.stageId
+            }),
             provinceArea:{
-                province:row.province,
-                district:row.district,
+                province:JSON.stringify({
+                    label:row.provinceName,
+                    value:row.provinceId
+                }),
+                district:JSON.stringify({
+                    label:row.cityName,
+                    value:row.cityId
+                }),
             },
         }
     }else{
@@ -296,29 +288,138 @@ const HandleSchoolDialogConfirm = async (params:any)=>{
     editFormDialogSubmitLoading.value = true
     const {formData,formRef} = params
     console.log('表单的提交信息',formData)
-
     let transferParams = {
         id: formData.id,
-        name: formData.schoolName,
-        stageId: formData.schoolStage,
-        "stageName": "",
-        provinceId: formData.provinceArea.province,
-        "provinceName": '',
-        cityId: formData.provinceArea.district,
-        "cityName": "",
-        address: formData.detailAddress,
-        "str": ""
+        name: formData.name,
+        stageId: JSON.parse(formData.schoolStage || '{}')?.value,
+        stageName: JSON.parse(formData.schoolStage || '{}')?.label,
+        provinceId: JSON.parse(formData.provinceArea.province || '{}')?.value,
+        provinceName: JSON.parse(formData.provinceArea.province || '{}')?.label,
+        cityId: JSON.parse(formData.provinceArea.district || '{}')?.value,
+        cityName: JSON.parse(formData.provinceArea.district || '{}')?.label,
+        address: formData.address,
     }
-
     let res = undefined
-    try{ res = await addHighSeasCustomerApi(transferParams) }catch{}
+    try{
+        if(formData.id){
+            // 修改
+            res = await updateHighSeasCustomerApi(transferParams) 
+        }else{
+            // 新增
+            res = await addHighSeasCustomerApi(transferParams) 
+        }
+    }catch{}
+
     if(res?.code == 200){
+        schoolDefaultFormData.value = {}
         CloseSchoolFormDialog()
+        await GetTableData()
     }else{
         editFormDialogSubmitLoading.value = false
     }
 }
 
+
+
+
+
+/**
+ * 4. 批量导入弹窗有关数据
+ */
+const batchImportVisible = ref(false)
+const batchImportSubmitLoading = ref(false)
+const defaultImportFormData = ref({})
+// 打开弹窗
+const OpenBatchImportDialog = ()=>{
+    batchImportVisible.value = true   
+}
+// 关闭弹窗
+const CloseBatchImportDialog = ()=>{
+    batchImportSubmitLoading.value = false
+    batchImportVisible.value = false
+}
+// 导入确认
+const HandleBatchImportComfirm = async (params:any)=>{
+    const {formData,formRef} = params 
+    // console.log('表单信息',formData)
+
+    if(!formData?.file?.url){
+        ElMessage.warning('请先上传文件')
+        return
+    }
+
+    batchImportSubmitLoading.value = true
+    let fileFormData = new FormData()
+    fileFormData.append('file',formData.file.url)
+
+    let res = await importHighSeasCustomerApi(fileFormData)
+    if(res?.code == 200){
+        ElMessage.success(res?.msg)
+        CloseBatchImportDialog()
+        await GetTableData()
+    }else{
+        batchImportSubmitLoading.value = false
+    }
+}
+// 下载模板
+const HandleDownloadTemplate = async ()=>{
+   await HandleExportExcel(templateTableColumns.value,[],'新增学校_批量导入模板')
+}
+// 获取上传文件
+const HandleFileUplaod = (params)=>{
+    const {key,file} = params
+    console.log('file',file)
+    defaultImportFormData.value.file = {
+        url:file.raw,
+        name:file.name
+    }
+}
+
+
+/**
+ * 5. 删除弹窗 有关数据
+ */
+const deleteDialogVisible = ref(false)
+const deleteDialogSubmitLoading = ref(false)
+const currentDeleteRow = ref()
+const OpenDeleteDialog = (row)=>{
+    deleteDialogVisible.value = true
+    currentDeleteRow.value = row
+}
+const CloseDeleteDialog = ()=>{
+    deleteDialogVisible.value = false
+    deleteDialogSubmitLoading.value = false
+}
+// 删除确认
+const HandleDeleteDialogConfirm = async ()=>{
+    deleteDialogSubmitLoading.value = true
+    let res = await deleteHighSeasCustomerApi(currentDeleteRow.value.id)
+    if(res?.code == 200){
+        ElMessage.success(res?.msg)
+        CloseDeleteDialog()
+        await GetTableData()
+    }else{
+        deleteDialogSubmitLoading.value = false
+    }
+}
+
+/**
+ * 6.认领有关接口调用
+ */
+const ClaimCustomer = async (row)=>{
+    let res = await claimHighSeasCustomerApi(row.id)
+    if(res?.code == 200){
+        ElMessage.success(res?.msg)
+        await GetTableData()
+    }
+}
+
+
+/** 7.跳转详情 */
+const GoToDetail = (row)=>{
+    router.push(`highSeasCustomerDetail?id=${row.id}`)
+}
+
 onMounted( async()=>{
     await GetHeaderSearchParams()
     await GetTableData()