crm-团队成员：完善团队成员通用组件封装

015a1640 · puhui999 · 27c9a0f3 · 015a1640 · 015a1640 · 015a1640
Commit 015a1640 authored Nov 14, 2023 by puhui999
Showing with 65 additions and 39 deletions

src/api/crm/permission/index.ts
+25 -10

src/views/crm/components/CrmPermissionForm.vue
+18 -12

src/views/crm/components/CrmTeamList.vue
+15 -16

src/views/crm/components/index.ts
+7 -1

No files found.
--- a/src/api/crm/permission/index.ts
+++ b/src/api/crm/permission/index.ts
 import request from '@/config/axios'
 export interface PermissionVO {
-  id: number // 数据权限编号
+  id?: number // 数据权限编号
-  userId: number // 用户编号
+  userId: number | undefined // 用户编号
-  bizType: number // Crm 类型
+  bizType: number | undefined // Crm 类型
-  bizId: number // Crm 类型数据编号
+  bizId: number | undefined // Crm 类型数据编号
-  level: number // 权限级别
+  level: number | undefined // 权限级别
-  deptName: string // 部门名称
+  deptName?: string // 部门名称
-  nickname: string // 用户昵称
+  nickname?: string // 用户昵称
-  postNames: string // 岗位名称数组
+  postNames?: string // 岗位名称数组
 }
 // 查询团队成员列表
@@ -21,8 +21,8 @@ export const createPermission = async (data: PermissionVO) => {
  return await request.post({ url: `/crm/permission/add`, data })
 }
-// 修改团队成员
+// 修改团队成员权限级别
-export const updatePermission = async (data: PermissionVO) => {
+export const updatePermission = async (data) => {
  return await request.put({ url: `/crm/permission/update`, data })
 }
@@ -30,3 +30,18 @@ export const updatePermission = async (data: PermissionVO) => {
 export const deletePermission = async (params) => {
  return await request.delete({ url: '/crm/permission/delete', params })
 }
+// 退出团队
+export const quitTeam = async (id) => {
+  return await request.delete({ url: '/crm/permission/quit-team?id=' + id })
+}
+// 领取公海数据
+export const receive = async (data: { bizType: number; bizId: number }) => {
+  return await request.put({ url: `/crm/permission/receive`, data })
+}
+// 数据放入公海
+export const putPool = async (data: { bizType: number; bizId: number }) => {
+  return await request.put({ url: `/crm/permission/put-pool`, data })
+}
--- a/src/views/crm/components/CrmPermissionForm.vue
+++ b/src/views/crm/components/CrmPermissionForm.vue
 <template>
-  <Dialog v-model="dialogVisible" :title="dialogTitle">
+  <Dialog v-model="dialogVisible" :title="dialogTitle" width="30%">
    <el-form
      ref="formRef"
      v-loading="formLoading"
@@ -11,16 +11,16 @@
        <el-select v-model="formData.userId">
          <el-option
            v-for="item in userOptions"
-            :key="parseInt(item.id)"
+            :key="item.id"
            :label="item.nickname"
-            :value="parseInt(item.id)"
+            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="权限级别" prop="level">
        <el-radio-group v-model="formData.level">
-          <el-radio label="2">只读</el-radio>
+          <el-radio :label="CrmPermissionLevelEnum.READ">只读</el-radio>
-          <el-radio label="3">读写</el-radio>
+          <el-radio :label="CrmPermissionLevelEnum.WRITE">读写</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
@@ -32,6 +32,8 @@
 </template>
 <script lang="ts" setup>
 import * as UserApi from '@/api/system/user'
+import * as PermissionApi from '@/api/crm/permission'
+import { CrmPermissionLevelEnum } from './index'
 defineOptions({ name: 'CrmPermissionForm' })
 const { t } = useI18n() // 国际化
@@ -42,7 +44,7 @@ const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const userOptions = ref<UserApi.UserVO[]>([]) // 用户列表
-const formData = ref({
+const formData = ref<PermissionApi.PermissionVO & { ids?: number[] }>({
  userId: undefined, // 用户编号
  bizType: undefined, // Crm 类型
  bizId: undefined, // Crm 类型数据编号
@@ -55,17 +57,15 @@ const formRules = reactive({
 const formRef = ref() // 表单 Ref
 /** 打开弹窗 */
-const open = async (type: 'create' | 'update', bizType: number, bizId: number, id?: number) => {
+const open = async (type: 'create' | 'update', bizType: number, bizId: number, ids?: number[]) => {
  dialogVisible.value = true
  dialogTitle.value = t('action.' + type) + '团队成员'
  formType.value = type
  resetForm(bizType, bizId)
  // 修改时，设置数据
-  if (id) {
+  if (ids) {
-    formData.value.id = id
+    formData.value.ids = ids
  }
-  // 获得用户列表
-  userOptions.value = await UserApi.getSimpleUserList()
 }
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
@@ -81,8 +81,10 @@ const submitForm = async () => {
  try {
    const data = formData.value
    if (formType.value === 'create') {
+      await PermissionApi.createPermission(unref(data))
      message.success(t('common.createSuccess'))
    } else {
+      await PermissionApi.updatePermission(unref(data))
      message.success(t('common.updateSuccess'))
    }
    dialogVisible.value = false
@@ -95,12 +97,16 @@ const submitForm = async () => {
 /** 重置表单 */
 const resetForm = (bizType: number, bizId: number) => {
+  formRef.value?.resetFields()
  formData.value = {
    userId: undefined, // 用户编号
    bizType, // Crm 类型
    bizId, // Crm 类型数据编号
    level: undefined // 权限级别
  }
-  formRef.value?.resetFields()
 }
+onMounted(async () => {
+  // 获得用户列表
+  userOptions.value = await UserApi.getSimpleUserList()
+})
 </script>
--- a/src/views/crm/components/CrmTeamList.vue
+++ b/src/views/crm/components/CrmTeamList.vue
@@ -25,10 +25,10 @@
    @selection-change="handleSelectionChange"
  >
    <el-table-column type="selection" width="55" />
-    <el-table-column align="center" label="姓名" prop="mobile" />
+    <el-table-column align="center" label="姓名" prop="nickname" />
-    <el-table-column align="center" label="部门" prop="detailAddress" />
+    <el-table-column align="center" label="部门" prop="deptName" />
-    <el-table-column align="center" label="岗位" prop="detailAddress" />
+    <el-table-column align="center" label="岗位" prop="postNames" />
-    <el-table-column align="center" label="权限级别" prop="creatorName" />
+    <el-table-column align="center" label="权限级别" prop="level" />
    <el-table-column :formatter="dateFormatter" align="center" label="加入时间" prop="createTime" />
  </el-table>
  <CrmPermissionForm ref="crmPermissionFormRef" />
@@ -39,6 +39,7 @@ import { ElTable } from 'element-plus'
 import * as PermissionApi from '@/api/crm/permission'
 import { useUserStoreWithOut } from '@/store/modules/user'
 import CrmPermissionForm from './CrmPermissionForm.vue'
+import { CrmPermissionLevelEnum } from './index'
 defineOptions({ name: 'CrmTeam' })
 const props = defineProps<{
@@ -65,14 +66,14 @@ const handleSelectionChange = (val: PermissionApi.PermissionVO[]) => {
  multipleSelection.value = val
 }
 const message = useMessage()
-const crmPermissionFormRef = ref<InstanceType<typeof CrmPermissionForm | null>>(null)
+const crmPermissionFormRef = ref<InstanceType<typeof CrmPermissionForm>>()
 const handleEdit = () => {
  if (multipleSelection.value?.length === 0) {
    message.warning('请先选择团队成员后操作！')
    return
  }
  const ids = multipleSelection.value?.map((item) => item.id)
-  crmPermissionFormRef.value?.open('update', props.bizType, props.bizId, ids[0])
+  crmPermissionFormRef.value?.open('update', props.bizType, props.bizId, ids)
 }
 const handleRemove = async () => {
  if (multipleSelection.value?.length === 0) {
@@ -81,13 +82,10 @@ const handleRemove = async () => {
  }
  await message.delConfirm()
  const ids = multipleSelection.value?.map((item) => item.id)
-  ids?.forEach((id) => {
+  await PermissionApi.deletePermission({
-    // TODO 还不确定要不要搞个批量删除，还是一次只能删除一个，先用循环弄一下
+    bizType: props.bizType,
-    PermissionApi.deletePermission({
+    bizId: props.bizId,
-      bizType: props.bizType,
+    ids
-      bizId: props.bizId,
-      id
-    })
  })
 }
 const handleAdd = () => {
@@ -95,14 +93,16 @@ const handleAdd = () => {
 }
 const userStore = useUserStoreWithOut()
-const handleQuit = () => {
+const handleQuit = async () => {
  const permission = list.value.find(
-    (item) => item.userId === userStore.getUser.id && item.level === 1
+    (item) => item.userId === userStore.getUser.id && item.level === CrmPermissionLevelEnum.OWNER
  )
  if (permission) {
    message.warning('负责人不能退出团队！')
    return
  }
+  const userPermission = list.value.find((item) => item.userId === userStore.getUser.id)
+  await PermissionApi.quitTeam(userPermission?.id)
 }
 watch(
@@ -113,4 +113,3 @@ watch(
  { immediate: true, deep: true }
 )
 </script>
-<style lang="scss" scoped></style>
--- a/src/views/crm/components/index.ts
+++ b/src/views/crm/components/index.ts
@@ -8,4 +8,10 @@ enum CrmBizTypeEnum {
  CRM_CONTRACT = 6 // 合同
 }
-export { CrmTeam, CrmBizTypeEnum }
+enum CrmPermissionLevelEnum {
+  OWNER = 1, // 负责人
+  READ = 2, // 读
+  WRITE = 3 // 写
+}
+export { CrmTeam, CrmBizTypeEnum, CrmPermissionLevelEnum }