【客户管理】 新增# 客户管理
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