【客户管理】 新增# 客户管理
							parent
							
								
									3793f8d8ab
								
							
						
					
					
						commit
						1d7dfd3ec3
					
				|  | @ -0,0 +1,117 @@ | |||
| <template> | ||||
|     <ProDialog ref="proDialogRef" @handle-cancel="handleCancel" @handle-confirm="handleConfirm"> | ||||
|         <el-form v-model="form" label-postion="right" :label-width="100"> | ||||
|             <el-row :gutter="24"> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="学生名字"> | ||||
|                         <el-input v-model="form.studentName" placeholder="请输入" maxlength="20" show-word-limit /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="性别"> | ||||
|                         <el-radio-group v-model="form.sex"> | ||||
|                             <el-radio v-for="option in sexOptions" :key="option.value" :label="option.value">{{ option.label }}</el-radio> | ||||
|                         </el-radio-group> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|             </el-row> | ||||
|             <el-row :gutter="24"> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="身份证号码"> | ||||
|                         <el-input v-model="form.codeNumber" placeholder="请输入" maxlength="18" show-word-limit /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="报读专业"> | ||||
|                         <el-input v-model="form.major" placeholder="请输入" maxlength="50" show-word-limit /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|             </el-row> | ||||
|             <el-row :gutter="24"> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="毕业院校"> | ||||
|                         <el-input v-model="form.school" placeholder="请输入" maxlength="50" show-word-limit /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="家庭地址"> | ||||
|                         <el-input v-model="form.address" placeholder="请输入" maxlength="100" show-word-limit /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|             </el-row> | ||||
|             <el-row :gutter="24"> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="家长姓名"> | ||||
|                         <el-input v-model="form.name" placeholder="请输入" maxlength="20" show-word-limit /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="家长电话"> | ||||
|                         <el-input v-model="form.mobile" placeholder="请输入" maxlength="11" show-word-limit /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|             </el-row> | ||||
|             <el-row :gutter="24"> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="负责电销老师"> | ||||
|                         <el-input v-model="form.teleName" placeholder="请输入" disabled /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="负责招生老师"> | ||||
|                         <el-input v-model="form.admissionName" placeholder="请输入" disabled /> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|             </el-row> | ||||
|             <el-row :gutter="24"> | ||||
|                 <el-col :span="12"> | ||||
|                     <el-form-item label="数据来源"> | ||||
|                         <el-select v-model="form.source" placeholder="请选择" style="width: 100%" disabled> | ||||
|                             <el-option v-for="option in clueSource" :key="option.value" :label="option.label" :value="option.value" /> | ||||
|                         </el-select> | ||||
|                     </el-form-item> | ||||
|                 </el-col> | ||||
|             </el-row> | ||||
|         </el-form> | ||||
|     </ProDialog> | ||||
| </template> | ||||
| 
 | ||||
| <script setup lang="ts"> | ||||
| import ProDialog, { type IParams } from '@/components/ProDialog/index.vue' | ||||
| 
 | ||||
| const emit = defineEmits(['refreshList']) | ||||
| const proDialogRef = ref<InstanceType<typeof ProDialog>>() | ||||
| 
 | ||||
| const sexOptions = ref([ | ||||
|     { label: '男', value: 1 }, | ||||
|     { label: '女', value: 2 } | ||||
| ]) | ||||
| const clueSource = ref([{ label: '线下名单', value: 1 }]) | ||||
| const form = ref({ | ||||
|     studentName: '', | ||||
|     sex: 1, | ||||
|     codeNumber: '', | ||||
|     major: '', | ||||
|     school: '', | ||||
|     address: '', | ||||
|     name: '', | ||||
|     mobile: '', | ||||
|     teleName: '', | ||||
|     admissionName: '', | ||||
|     source: 1 | ||||
| }) | ||||
| const openDialog = (params: IParams) => { | ||||
|     proDialogRef.value?.openDialog(params) | ||||
| } | ||||
| const handleCancel = (callback: () => void) => { | ||||
|     callback() | ||||
| } | ||||
| const handleConfirm = (callback: () => void) => { | ||||
|     callback() | ||||
|     emit('refreshList') | ||||
| } | ||||
| defineExpose({ | ||||
|     openDialog | ||||
| }) | ||||
| </script> | ||||
| <style scoped></style> | ||||
|  | @ -0,0 +1,38 @@ | |||
| <template> | ||||
|     <div> | ||||
|         <search-form v-model="queryParams" @reset-page="resetPage" @reset-params="resetParams" /> | ||||
|         <customer-list :loading="pager.loading" :tableData="pager.lists"> | ||||
|             <template #operation="{ row }"> | ||||
|                 <el-button type="primary" link @click="handleEdit(row)">编辑</el-button> | ||||
|             </template> | ||||
|         </customer-list> | ||||
|     </div> | ||||
|     <customer-dialog ref="customerDialogRef" @refresh-list="getLists" /> | ||||
| </template> | ||||
| 
 | ||||
| <script setup lang="ts"> | ||||
| import searchForm from './modules/search-form.vue' | ||||
| import customerList from './modules/customer-list.vue' | ||||
| import customerDialog from './components/customer-dialog.vue' | ||||
| import { usePaging } from '@/hooks/usePaging' | ||||
| import { postLists } from '@/api/org/post' | ||||
| 
 | ||||
| const queryParams = reactive({ | ||||
|     name: '', | ||||
|     conversionStatus: '' | ||||
| }) | ||||
| const { pager, getLists, resetPage, resetParams } = usePaging({ | ||||
|     fetchFun: postLists, | ||||
|     params: queryParams | ||||
| }) | ||||
| getLists() | ||||
| const customerDialogRef = ref() | ||||
| const handleEdit = row => { | ||||
|     customerDialogRef.value.openDialog({ | ||||
|         title: '编辑客户', | ||||
|         width: 800, | ||||
|         data: { ...row } | ||||
|     }) | ||||
| } | ||||
| </script> | ||||
| <style scoped></style> | ||||
|  | @ -0,0 +1,50 @@ | |||
| <template> | ||||
|     <el-card shadow="never" class="!border-none mt-4"> | ||||
|         <el-tabs v-model="activeTab"> | ||||
|             <el-tab-pane label="成交用户" name="complete"> | ||||
|                 <ProTable ref="proTableRef" :columns="columns" :tableData="tableData" :loading="loading" :maxHeight="530"> | ||||
|                     <template #operation="{ row }"> | ||||
|                         <slot name="operation" :row="row" /> | ||||
|                     </template> | ||||
|                 </ProTable> | ||||
|             </el-tab-pane> | ||||
|         </el-tabs> | ||||
|     </el-card> | ||||
| </template> | ||||
| 
 | ||||
| <script setup lang="ts"> | ||||
| defineProps({ | ||||
|     loading: { | ||||
|         type: Boolean, | ||||
|         default: false | ||||
|     }, | ||||
|     tableData: { | ||||
|         type: Array, | ||||
|         default: () => [] | ||||
|     } | ||||
| }) | ||||
| 
 | ||||
| const activeTab = ref('complete') | ||||
| const proTableRef = ref() | ||||
| const columns = reactive([ | ||||
|     { prop: 'accountName', label: '学生名字', width: 180 }, | ||||
|     { prop: 'sex', label: '性别', width: 180 }, | ||||
|     { prop: 'mobile', label: '身份证号码', width: 180 }, | ||||
|     { prop: 'mobile', label: '报读专业', width: 180 }, | ||||
|     { prop: 'organization', label: '毕业院校', width: 180 }, | ||||
|     { prop: 'position', label: '家庭地址', width: 180 }, | ||||
|     { prop: 'position', label: '家长姓名', width: 180 }, | ||||
|     { prop: 'position', label: '家长电话', width: 180 }, | ||||
|     { prop: 'accountStatus', label: '负责电销老师', width: 180 }, | ||||
|     { prop: 'accountStatus', label: '负责招生老师', width: 180 }, | ||||
|     { prop: 'accountStatus', label: '数据来源', width: 180 }, | ||||
|     { prop: 'accountStatus', label: '更新时间', width: 180 }, | ||||
|     { prop: 'operation', label: '操作', fixed: 'right', width: 250 } | ||||
| ]) | ||||
| </script> | ||||
| 
 | ||||
| <style scoped lang="scss"> | ||||
| :deep(.el-card__body) { | ||||
|     padding-top: 0; | ||||
| } | ||||
| </style> | ||||
|  | @ -0,0 +1,26 @@ | |||
| <template> | ||||
|     <el-card shadow="never" class="!border-none"> | ||||
|         <el-form ref="formRef" class="mb-[-16px]" :model="modelValue" :inline="true"> | ||||
|             <el-form-item label="学生名字"> | ||||
|                 <el-input class="w-[280px]" placeholder="请输入" v-model="modelValue.name" clearable @keyup.enter="$emit('resetPage')" /> | ||||
|             </el-form-item> | ||||
|             <el-form-item> | ||||
|                 <el-button type="primary" @click="$emit('resetPage')">查询</el-button> | ||||
|                 <el-button @click="$emit('resetParams')">重置</el-button> | ||||
|             </el-form-item> | ||||
|         </el-form> | ||||
|     </el-card> | ||||
| </template> | ||||
| 
 | ||||
| <script setup lang="ts"> | ||||
| defineProps({ | ||||
|     modelValue: { | ||||
|         type: Object, | ||||
|         default: () => ({ | ||||
|             name: '' | ||||
|         }) | ||||
|     } | ||||
| }) | ||||
| defineEmits(['resetPage', 'resetParams']) | ||||
| </script> | ||||
| <style scoped></style> | ||||
		Loading…
	
		Reference in New Issue