添加公海客户静态页面

src/views/myCustomer/components/SchoolFormDialog/index.vue → src/components/SchoolFormDialog/index.vue

@@ -1,5 +1,6 @@
 <template>
-     <FormDialog width="640px" title="编辑学校" 
+     <FormDialog width="640px" 
+        :title="props.schoolTitle" 
         :visible="editFormDialogVisible" 
         :submitLoading="editFormDialogSubmitLoading"
         :defaultFormData="{...defaultFormData}"
@@ -21,6 +22,10 @@ const props = defineProps({
     defaultFormData:{
         type:Object,
         required:true
+    },
+    schoolTitle:{
+        type:String,
+        default:'编辑学校'
     }
 })
 const editFormDialogVisible = defineModel('visible')

src/views/highSeasCustomer/formSearchGroup.ts

@@ -0,0 +1,11 @@
+import { ref } from "vue";
+
+
+export const formSearchList = ref([
+    {
+        key:'queryStr',
+        type:'input',
+        placeholder:'请输入关键字搜索',
+        defaultValue:'',
+    }
+])

src/views/highSeasCustomer/index.vue

@@ -1,15 +1,124 @@
 <template>
-    <div>
-        公海客户
+    <div class="main_container">
+        <div class="page_item end_item">
+             <div class="page_search">
+                <div class="search_content">
+                    <div class="content_left">
+                        <SearchBlock :searchList="blockSearchList"></SearchBlock>
+                    </div>
+                    <div class="content_right">
+                        <el-button class="button_refresh">批量导入</el-button>
+                        <el-button class="button_background" @click="OpenSchoolFormDialog">新增学校</el-button>
+                    </div>
+                </div>
+            </div>
+            <FormSearchGroup :searchList="formSearchList"></FormSearchGroup>
+            <Table :tableColumns="tableColumns" :tableData="tableData">
+                <template #operation="{row}">
+                    <div class="table_row_option">
+                        <span class="button_editor">认领</span>
+                        <span class="button_editor" @click="OpenSchoolFormDialog(row)">编辑</span>
+                        <span class="button_editor">详情</span>
+                        <span class="el_button_delete">删除</span>
+                    </div>
+                </template>
+            </Table>
+        </div>
+
+        <SchoolFormDialog 
+            :schoolTitle="schoolTitle" 
+            v-model:visible="schoolVisible" 
+            :defaultFormData="schoolDefaultFormData">
+        </SchoolFormDialog>
     </div>
 </template>
 
 
 <script setup lang="ts">
+import { ref } from 'vue';
+import FormSearchGroup from '@/baseComponents/FormSearchGroup.vue';
+import {formSearchList} from './formSearchGroup';
+import SearchBlock from '@/baseComponents/SearchBlock.vue';
+import { blockSearchList } from './searchBlock';
+import Table from '@/baseComponents/Table.vue';
+import {tableColumns} from './table'
+
+import SchoolFormDialog from '@/components/SchoolFormDialog/index.vue'
+
+
+// 表格数据
+const tableData = ref([
+  {
+    index: '1',
+    schoolName: '流星花园学校',
+    schoolStage: 'primary',
+    schoolStageName: '小学',
+    province: '北京市',
+    district: '西城区',
+    poolTime: '2026-03-11',
+    idleDays: '3天',
+    detailAddress:'通州北苑'
+  },
+  {
+    index: '2',
+    schoolName: '北京师达',
+    schoolStage: 'middle',
+    schoolStageName: '初中',
+    province: '北京市',
+    district: '西城区',
+    poolTime: '2026-03-11',
+    idleDays: '3天',
+    detailAddress:'通州北苑'
+
+  },
+  {
+    index: '3',
+    schoolName: '北京五十七中学',
+    schoolStage: 'senior',
+    schoolStageName: '高中',
+    province: '北京市',
+    district: '西城区',
+    poolTime: '2025-11-01',
+    idleDays: '10天',
+    detailAddress:'通州北苑'
+
+  }
+])
+
+
+// 学校弹窗有关数据
+const schoolVisible = ref(false)
+const schoolTitle = ref('')
+const schoolDefaultFormData = ref({})
+const OpenSchoolFormDialog = (row?:any)=>{
+    if(row){
+        schoolTitle.value = '编辑学校'
+    }else{
+        schoolTitle.value = '新增学校'
+    }
+
+    console.log('当前行',row)
+    schoolVisible.value = true
+    schoolDefaultFormData.value = {
+        ...row,
+        provinceArea:{
+            province:row.province,
+            district:row.district,
+        },
+        
+    }
+}
+
 
 </script>
 
 
 <style lang="scss" scoped>
+.end_item{
+    gap:16px;
+    .search_content{
+        align-items: flex-start;
+    }
+}
 
 </style>

src/views/highSeasCustomer/searchBlock.ts

@@ -0,0 +1,52 @@
+import { ref } from "vue";
+
+
+export const blockSearchList = ref([
+  {
+    label: '学段',
+    key: 'stage',
+    type: 'single',
+    options: [
+      { label: '全部', value: 'all' },
+      { label: '幼儿园', value: 'kindergarten' },
+      { label: '小学', value: 'primary' },
+      { label: '初中', value: 'junior_high' },
+      { label: '高中', value: 'senior_high' },
+      { label: '完中', value: 'complete_high' },
+      { label: '九年一贯', value: 'nine_year' },
+      { label: '十二年一贯', value: 'twelve_year' },
+      { label: '职高', value: 'vocational_high' },
+      { label: '大学', value: 'university' }
+    ],
+    defaultValue: 'all'
+  },
+  {
+    label: '省份',
+    key: 'province',
+    type: 'single',
+    options: [
+      { label: '全部', value: 'all' },
+      { label: '北京', value: 'beijing' },
+      { label: '上海', value: 'shanghai' },
+      { label: '天津', value: 'tianjin' },
+      { label: '广东', value: 'guangdong' },
+      { label: '广西', value: 'guangxi' }
+    ],
+    defaultValue: 'all'
+  },
+  {
+    label: '地区',
+    key: 'area',
+    type: 'single',
+    options: [
+      { label: '全部', value: 'all' },
+      { label: '东城区', value: 'dongcheng' },
+      { label: '西城区', value: 'xicheng' },
+      { label: '海淀区', value: 'haidian' },
+      { label: '朝阳区', value: 'chaoyang' },
+      { label: '丰台区', value: 'fengtai' },
+      { label: '石景山区', value: 'shijingshan' }
+    ],
+    defaultValue: 'all'
+  }
+]);

src/views/highSeasCustomer/table.ts

@@ -0,0 +1,69 @@
+import { ref } from "vue";
+
+export const tableColumns = ref([
+  {
+    name: 'index',
+    label: '序号',
+    width: '80',
+    align: 'center',
+    custom: false,
+    hidden: false
+  },
+  {
+    name: 'schoolName',
+    label: '学校名称',
+    width: '200',
+    align: 'center',
+    custom: false,
+    hidden: false
+  },
+  {
+    name: 'schoolStageName',
+    label: '学段',
+    width: '120',
+    align: 'center',
+    custom: false,
+    hidden: false
+  },
+  {
+    name: 'province',
+    label: '省份',
+    width: '120',
+    align: 'center',
+    custom: false,
+    hidden: false
+  },
+  {
+    name: 'district',
+    label: '地区',
+    width: '120',
+    align: 'center',
+    custom: false,
+    hidden: false
+  },
+  {
+    name: 'poolTime',
+    label: '进入公海时间',
+    width: '150',
+    align: 'center',
+    custom: false,
+    hidden: false
+  },
+  {
+    name: 'idleDays',
+    label: '闲置天数',
+    width: '120',
+    align: 'center',
+    custom: false,
+    hidden: false
+  },
+  {
+    name: 'operation',
+    label: '操作',
+    width: '200',
+    fixed:'right',
+    align: 'center',
+    custom: true,
+    hidden: false
+  }
+])

src/views/myCustomer/index.vue

@@ -58,8 +58,7 @@ import Table from '@/baseComponents/Table.vue';
 import FormSearchGroup from '@/baseComponents/FormSearchGroup.vue';
 import {tableColumns} from './table'
 
-import SchoolFormDialog from './components/SchoolFormDialog/index.vue'
-
+import SchoolFormDialog from '@/components/SchoolFormDialog/index.vue'
 
 const router = useRouter()
 /**
@@ -70,6 +69,7 @@ const tableData = ref([
         id: 1,
         customerType: '首单客户',
         schoolName: '流星花园学校',
+        schoolStageName:'初中',
         schoolStage: 'middle',
         province:'beijing',
         provinceName: '北京市',
@@ -85,6 +85,7 @@ const tableData = ref([
         id: 2,
         customerType: '首单客户',
         schoolName: '北京师达',
+        schoolStageName:'小学',
         schoolStage: 'primary',
         province:'beijing',
         provinceName: '北京市',
@@ -101,6 +102,7 @@ const tableData = ref([
         id: 3,
         customerType: '首单客户',
         schoolName: '北京五十七中学',
+        schoolStageName:'高中',
         schoolStage: 'senior',
         province:'beijing',
         provinceName: '北京市',

src/views/myCustomer/myCustomerDetail/index.vue

@@ -118,7 +118,8 @@ import {operationRecordSearchList} from './searchBlock'
 import FollowCard from '@/components/FollowCard.vue';
 import Pagination from '@/baseComponents/Pagination.vue';
 
-import SchoolFormDialog from '../components/SchoolFormDialog/index.vue'
+import SchoolFormDialog from '@/components/SchoolFormDialog/index.vue'
+
 import ConcactPeopleFormDialog from './components/ConcactPeopleFormDialog/index.vue'
 
 import FollowFormDialog from './components/FollowFormDialog/index.vue'

src/views/myCustomer/table.ts

@@ -30,7 +30,7 @@ export const tableColumns = ref([
         custom: false,
     },
     {
-        name: 'schoolStage',
+        name: 'schoolStageName',
         label: '学段',
         width: '80',
         fixed: '',