Skip to content

Commit 27c9a0f

Browse files
author
puhui999
committed
crm-团队成员： 先提交一波
1 parent 2385cd9 commit 27c9a0f

File tree

5 files changed

+322
-46
lines changed

5 files changed

+322
-46
lines changed

‎src/api/crm/permission/index.ts

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import request from '@/config/axios'
2+
3+
export interface PermissionVO {
4+
id: number // 数据权限编号
5+
userId: number // 用户编号
6+
bizType: number // Crm 类型
7+
bizId: number // Crm 类型数据编号
8+
level: number // 权限级别
9+
deptName: string // 部门名称
10+
nickname: string // 用户昵称
11+
postNames: string // 岗位名称数组
12+
}
13+
14+
// 查询团队成员列表
15+
export const getPermissionList = async (params) => {
16+
return await request.get({ url: `/crm/permission/list`, params })
17+
}
18+
19+
// 新增团队成员
20+
export const createPermission = async (data: PermissionVO) => {
21+
return await request.post({ url: `/crm/permission/add`, data })
22+
}
23+
24+
// 修改团队成员
25+
export const updatePermission = async (data: PermissionVO) => {
26+
return await request.put({ url: `/crm/permission/update`, data })
27+
}
28+
29+
// 删除团队成员
30+
export const deletePermission = async (params) => {
31+
return await request.delete({ url: '/crm/permission/delete', params })
32+
}

‎src/views/crm/components/CrmPermissionForm.vue

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
<template>
2+
<Dialog v-model="dialogVisible" :title="dialogTitle">
3+
<el-form
4+
ref="formRef"
5+
v-loading="formLoading"
6+
:model="formData"
7+
:rules="formRules"
8+
label-width="100px"
9+
>
10+
<el-form-item v-if="formType === 'create'" label="选择人员" prop="userId">
11+
<el-select v-model="formData.userId">
12+
<el-option
13+
v-for="item in userOptions"
14+
:key="parseInt(item.id)"
15+
:label="item.nickname"
16+
:value="parseInt(item.id)"
17+
/>
18+
</el-select>
19+
</el-form-item>
20+
<el-form-item label="权限级别" prop="level">
21+
<el-radio-group v-model="formData.level">
22+
<el-radio label="2">只读</el-radio>
23+
<el-radio label="3">读写</el-radio>
24+
</el-radio-group>
25+
</el-form-item>
26+
</el-form>
27+
<template #footer>
28+
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
29+
<el-button @click="dialogVisible = false">取 消</el-button>
30+
</template>
31+
</Dialog>
32+
</template>
33+
<script lang="ts" setup>
34+
import * as UserApi from '@/api/system/user'
35+
36+
defineOptions({ name: 'CrmPermissionForm' })
37+
const { t } = useI18n() // 国际化
38+
const message = useMessage() // 消息弹窗
39+
40+
const dialogVisible = ref(false) // 弹窗的是否展示
41+
const dialogTitle = ref('') // 弹窗的标题
42+
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
43+
const formType = ref('') // 表单的类型：create - 新增；update - 修改
44+
const userOptions = ref<UserApi.UserVO[]>([]) // 用户列表
45+
const formData = ref({
46+
userId: undefined, // 用户编号
47+
bizType: undefined, // Crm 类型
48+
bizId: undefined, // Crm 类型数据编号
49+
level: undefined // 权限级别
50+
})
51+
const formRules = reactive({
52+
userId: [{ required: true, message: '人员不能为空', trigger: 'blur' }],
53+
level: [{ required: true, message: '权限级别不能为空', trigger: 'blur' }]
54+
})
55+
const formRef = ref() // 表单 Ref
56+
57+
/** 打开弹窗 */
58+
const open = async (type: 'create' | 'update', bizType: number, bizId: number, id?: number) => {
59+
dialogVisible.value = true
60+
dialogTitle.value = t('action.' + type) + '团队成员'
61+
formType.value = type
62+
resetForm(bizType, bizId)
63+
// 修改时，设置数据
64+
if (id) {
65+
formData.value.id = id
66+
}
67+
// 获得用户列表
68+
userOptions.value = await UserApi.getSimpleUserList()
69+
}
70+
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
71+
72+
/** 提交表单 */
73+
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
74+
const submitForm = async () => {
75+
// 校验表单
76+
if (!formRef) return
77+
const valid = await formRef.value.validate()
78+
if (!valid) return
79+
// 提交请求
80+
formLoading.value = true
81+
try {
82+
const data = formData.value
83+
if (formType.value === 'create') {
84+
message.success(t('common.createSuccess'))
85+
} else {
86+
message.success(t('common.updateSuccess'))
87+
}
88+
dialogVisible.value = false
89+
// 发送操作成功的事件
90+
emit('success')
91+
} finally {
92+
formLoading.value = false
93+
}
94+
}
95+
96+
/** 重置表单 */
97+
const resetForm = (bizType: number, bizId: number) => {
98+
formData.value = {
99+
userId: undefined, // 用户编号
100+
bizType, // Crm 类型
101+
bizId, // Crm 类型数据编号
102+
level: undefined // 权限级别
103+
}
104+
formRef.value?.resetFields()
105+
}
106+
</script>

‎src/views/crm/components/CrmTeamList.vue

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
<template>
2+
<!-- 操作栏 -->
3+
<el-row justify="end">
4+
<el-button type="primary" @click="handleAdd">
5+
<Icon class="mr-5px" icon="ep:plus" />
6+
新增
7+
</el-button>
8+
<el-button @click="handleEdit">
9+
<Icon class="mr-5px" icon="ep:edit" />
10+
编辑
11+
</el-button>
12+
<el-button @click="handleRemove">
13+
<Icon class="mr-5px" icon="ep:delete" />
14+
移除
15+
</el-button>
16+
<el-button type="danger" @click="handleQuit"> 退出团队</el-button>
17+
</el-row>
18+
<!-- 团队成员展示 -->
19+
<el-table
20+
v-loading="loading"
21+
:data="list"
22+
:show-overflow-tooltip="true"
23+
:stripe="true"
24+
class="mt-20px"
25+
@selection-change="handleSelectionChange"
26+
>
27+
<el-table-column type="selection" width="55" />
28+
<el-table-column align="center" label="姓名" prop="mobile" />
29+
<el-table-column align="center" label="部门" prop="detailAddress" />
30+
<el-table-column align="center" label="岗位" prop="detailAddress" />
31+
<el-table-column align="center" label="权限级别" prop="creatorName" />
32+
<el-table-column :formatter="dateFormatter" align="center" label="加入时间" prop="createTime" />
33+
</el-table>
34+
<CrmPermissionForm ref="crmPermissionFormRef" />
35+
</template>
36+
<script lang="ts" setup>
37+
import { dateFormatter } from '@/utils/formatTime'
38+
import { ElTable } from 'element-plus'
39+
import * as PermissionApi from '@/api/crm/permission'
40+
import { useUserStoreWithOut } from '@/store/modules/user'
41+
import CrmPermissionForm from './CrmPermissionForm.vue'
42+
43+
defineOptions({ name: 'CrmTeam' })
44+
const props = defineProps<{
45+
bizType: number
46+
bizId: number
47+
}>()
48+
const loading = ref(true) // 列表的加载中
49+
const list = ref<PermissionApi.PermissionVO[]>([]) // 列表的数据
50+
const getList = async () => {
51+
loading.value = true
52+
try {
53+
const res = await PermissionApi.getPermissionList({
54+
bizType: props.bizType,
55+
bizId: props.bizId
56+
})
57+
list.value = res
58+
} finally {
59+
loading.value = false
60+
}
61+
}
62+
63+
const multipleSelection = ref<PermissionApi.PermissionVO[]>([])
64+
const handleSelectionChange = (val: PermissionApi.PermissionVO[]) => {
65+
multipleSelection.value = val
66+
}
67+
const message = useMessage()
68+
const crmPermissionFormRef = ref<InstanceType<typeof CrmPermissionForm | null>>(null)
69+
const handleEdit = () => {
70+
if (multipleSelection.value?.length === 0) {
71+
message.warning('请先选择团队成员后操作！')
72+
return
73+
}
74+
const ids = multipleSelection.value?.map((item) => item.id)
75+
crmPermissionFormRef.value?.open('update', props.bizType, props.bizId, ids[0])
76+
}
77+
const handleRemove = async () => {
78+
if (multipleSelection.value?.length === 0) {
79+
message.warning('请先选择团队成员后操作！')
80+
return
81+
}
82+
await message.delConfirm()
83+
const ids = multipleSelection.value?.map((item) => item.id)
84+
ids?.forEach((id) => {
85+
// TODO 还不确定要不要搞个批量删除，还是一次只能删除一个，先用循环弄一下
86+
PermissionApi.deletePermission({
87+
bizType: props.bizType,
88+
bizId: props.bizId,
89+
id
90+
})
91+
})
92+
}
93+
const handleAdd = () => {
94+
crmPermissionFormRef.value?.open('create', props.bizType, props.bizId)
95+
}
96+
97+
const userStore = useUserStoreWithOut()
98+
const handleQuit = () => {
99+
const permission = list.value.find(
100+
(item) => item.userId === userStore.getUser.id && item.level === 1
101+
)
102+
if (permission) {
103+
message.warning('负责人不能退出团队！')
104+
return
105+
}
106+
}
107+
108+
watch(
109+
() => props.bizId,
110+
() => {
111+
getList()
112+
},
113+
{ immediate: true, deep: true }
114+
)
115+
</script>
116+
<style lang="scss" scoped></style>

‎src/views/crm/components/index.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import CrmTeam from './CrmTeamList.vue'
2+
3+
enum CrmBizTypeEnum {
4+
CRM_LEADS = 1, // 线索
5+
CRM_CUSTOMER = 2, // 客户
6+
CRM_CONTACTS = 3, // 联系人
7+
CRM_BUSINESS = 5, // 商机
8+
CRM_CONTRACT = 6 // 合同
9+
}
10+
11+
export { CrmTeam, CrmBizTypeEnum }

0 commit comments

Comments
 (0)