diff --git a/src/api/member/group/index.ts b/src/api/member/group/index.ts new file mode 100644 index 00000000..df3054e2 --- /dev/null +++ b/src/api/member/group/index.ts @@ -0,0 +1,38 @@ +import request from '@/config/axios' + +export interface GroupVO { + id: number + name: string + remark: string + status: number +} + +// 查询用户分组列表 +export const getGroupPage = async (params: any) => { + return await request.get({ url: `/member/group/page`, params }) +} + +// 查询用户分组详情 +export const getGroup = async (id: number) => { + return await request.get({ url: `/member/group/get?id=` + id }) +} + +// 新增用户分组 +export const createGroup = async (data: GroupVO) => { + return await request.post({ url: `/member/group/create`, data }) +} + +// 查询用户分组 - 精简信息列表 +export const getSimpleGroupList = async () => { + return await request.get({ url: `/member/group/list-all-simple` }) +} + +// 修改用户分组 +export const updateGroup = async (data: GroupVO) => { + return await request.put({ url: `/member/group/update`, data }) +} + +// 删除用户分组 +export const deleteGroup = async (id: number) => { + return await request.delete({ url: `/member/group/delete?id=` + id }) +} diff --git a/src/api/member/level/index.ts b/src/api/member/level/index.ts new file mode 100644 index 00000000..a284fd2d --- /dev/null +++ b/src/api/member/level/index.ts @@ -0,0 +1,42 @@ +import request from '@/config/axios' + +export interface LevelVO { + id: number + name: string + experience: number + value: number + discount: number + icon: string + bgUrl: string + status: number +} + +// 查询会员等级列表 +export const getLevelPage = async (params) => { + return await request.get({ url: `/member/level/page`, params }) +} + +// 查询会员等级详情 +export const getLevel = async (id: number) => { + return await request.get({ url: `/member/level/get?id=` + id }) +} + +// 查询会员等级 - 精简信息列表 +export const getSimpleLevelList = async () => { + return await request.get({ url: `/member/level/list-all-simple` }) +} + +// 新增会员等级 +export const createLevel = async (data: LevelVO) => { + return await request.post({ url: `/member/level/create`, data }) +} + +// 修改会员等级 +export const updateLevel = async (data: LevelVO) => { + return await request.put({ url: `/member/level/update`, data }) +} + +// 删除会员等级 +export const deleteLevel = async (id: number) => { + return await request.delete({ url: `/member/level/delete?id=` + id }) +} diff --git a/src/api/member/tag/index.ts b/src/api/member/tag/index.ts index 04d0536c..7ff6e9bf 100644 --- a/src/api/member/tag/index.ts +++ b/src/api/member/tag/index.ts @@ -6,7 +6,7 @@ export interface TagVO { } // 查询会员标签列表 -export const getMemberTagPage = async (params) => { +export const getMemberTagPage = async (params: any) => { return await request.get({ url: `/member/tag/page`, params }) } @@ -15,6 +15,11 @@ export const getMemberTag = async (id: number) => { return await request.get({ url: `/member/tag/get?id=` + id }) } +// 查询会员标签 - 精简信息列表 +export const getSimpleTagList = async () => { + return await request.get({ url: `/member/tag/list-all-simple` }) +} + // 新增会员标签 export const createMemberTag = async (data: TagVO) => { return await request.post({ url: `/member/tag/create`, data }) diff --git a/src/views/member/group/GroupForm.vue b/src/views/member/group/GroupForm.vue new file mode 100644 index 00000000..9788dbef --- /dev/null +++ b/src/views/member/group/GroupForm.vue @@ -0,0 +1,112 @@ +<template> + <Dialog :title="dialogTitle" v-model="dialogVisible" width="600"> + <el-form + ref="formRef" + :model="formData" + :rules="formRules" + label-width="100px" + v-loading="formLoading" + > + <el-form-item label="名称" prop="name"> + <el-input v-model="formData.name" placeholder="请输入名称" /> + </el-form-item> + <el-form-item label="备注" prop="remark"> + <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" /> + </el-form-item> + <el-form-item label="状态" prop="status"> + <el-radio-group v-model="formData.status"> + <el-radio + v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" + :key="dict.value" + :label="dict.value" + > + {{ dict.label }} + </el-radio> + </el-radio-group> + </el-form-item> + </el-form> + <template #footer> + <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button> + <el-button @click="dialogVisible = false">取 消</el-button> + </template> + </Dialog> +</template> +<script setup lang="ts"> +import { DICT_TYPE, getIntDictOptions } from '@/utils/dict' +import * as GroupApi from '@/api/member/group' +import { CommonStatusEnum } from '@/utils/constants' + +const { t } = useI18n() // 国际化 +const message = useMessage() // 消息弹窗 + +const dialogVisible = ref(false) // 弹窗的是否展示 +const dialogTitle = ref('') // 弹窗的标题 +const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 +const formType = ref('') // 表单的类型:create - 新增;update - 修改 +const formData = ref({ + id: undefined, + name: undefined, + remark: undefined, + status: CommonStatusEnum.ENABLE +}) +const formRules = reactive({ + name: [{ required: true, message: '名称不能为空', trigger: 'blur' }], + status: [{ required: true, message: '状态不能为空', trigger: 'blur' }] +}) +const formRef = ref() // 表单 Ref + +/** 打开弹窗 */ +const open = async (type: string, id?: number) => { + dialogVisible.value = true + dialogTitle.value = t('action.' + type) + formType.value = type + resetForm() + // 修改时,设置数据 + if (id) { + formLoading.value = true + try { + formData.value = await GroupApi.getGroup(id) + } finally { + formLoading.value = false + } + } +} +defineExpose({ open }) // 提供 open 方法,用于打开弹窗 + +/** 提交表单 */ +const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 +const submitForm = async () => { + // 校验表单 + if (!formRef) return + const valid = await formRef.value.validate() + if (!valid) return + // 提交请求 + formLoading.value = true + try { + const data = formData.value as unknown as GroupApi.GroupVO + if (formType.value === 'create') { + await GroupApi.createGroup(data) + message.success(t('common.createSuccess')) + } else { + await GroupApi.updateGroup(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + name: undefined, + remark: undefined, + status: CommonStatusEnum.ENABLE + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/member/group/components/MemberGroupSelect.vue b/src/views/member/group/components/MemberGroupSelect.vue new file mode 100644 index 00000000..2b38fce1 --- /dev/null +++ b/src/views/member/group/components/MemberGroupSelect.vue @@ -0,0 +1,46 @@ +<template> + <el-select v-model="groupId" placeholder="请选择用户分组" clearable class="!w-240px"> + <el-option + v-for="group in groupOptions" + :key="group.id" + :label="group.name" + :value="group.id" + /> + </el-select> +</template> + +<script lang="ts" setup> +import * as GroupApi from '@/api/member/group' + +/** 会员分组选择框 **/ +defineOptions({ name: 'MemberGroupSelect' }) + +const props = defineProps({ + /** 下拉框选中值 **/ + modelValue: { + type: Number, + default: undefined + } +}) +const emit = defineEmits(['update:modelValue']) + +const groupId = computed({ + get() { + return props.modelValue + }, + set(value: any) { + emit('update:modelValue', value) + } +}) + +const groupOptions = ref<GroupApi.GroupVO[]>([]) + +const getList = async () => { + groupOptions.value = await GroupApi.getSimpleGroupList() +} + +/** 初始化 */ +onMounted(() => { + getList() +}) +</script> diff --git a/src/views/member/group/index.vue b/src/views/member/group/index.vue new file mode 100644 index 00000000..552a72a6 --- /dev/null +++ b/src/views/member/group/index.vue @@ -0,0 +1,174 @@ +<template> + <ContentWrap> + <!-- 搜索工作栏 --> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="分组名称" prop="name"> + <el-input + v-model="queryParams.name" + placeholder="请输入分组名称" + clearable + @keyup.enter="handleQuery" + class="!w-240px" + /> + </el-form-item> + <el-form-item label="状态" prop="status"> + <el-select v-model="queryParams.status" placeholder="请选择状态" clearable class="!w-240px"> + <el-option + v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" + :key="dict.value" + :label="dict.label" + :value="dict.value" + /> + </el-select> + </el-form-item> + <el-form-item label="创建时间" prop="createTime"> + <el-date-picker + v-model="queryParams.createTime" + value-format="YYYY-MM-DD HH:mm:ss" + type="daterange" + start-placeholder="开始日期" + end-placeholder="结束日期" + :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" + class="!w-240px" + /> + </el-form-item> + <el-form-item> + <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> + <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button> + <el-button type="primary" @click="openForm('create')" v-hasPermi="['member:group:create']"> + <Icon icon="ep:plus" class="mr-5px" /> 新增 + </el-button> + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true"> + <el-table-column label="编号" align="center" prop="id" min-width="60" /> + <el-table-column label="名称" align="center" prop="name" min-width="80" /> + <el-table-column label="备注" align="center" prop="remark" min-width="100" /> + <el-table-column label="状态" align="center" prop="status" min-width="70"> + <template #default="scope"> + <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" /> + </template> + </el-table-column> + <el-table-column + label="创建时间" + align="center" + prop="createTime" + :formatter="dateFormatter" + min-width="170" + /> + <el-table-column label="操作" align="center" width="150px"> + <template #default="scope"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['member:group:update']" + > + 编辑 + </el-button> + <el-button + link + type="danger" + @click="handleDelete(scope.row.id)" + v-hasPermi="['member:group:delete']" + > + 删除 + </el-button> + </template> + </el-table-column> + </el-table> + <!-- 分页 --> + <Pagination + :total="total" + v-model:page="queryParams.pageNo" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <GroupForm ref="formRef" @success="getList" /> +</template> + +<script setup lang="ts"> +import { DICT_TYPE, getIntDictOptions } from '@/utils/dict' +import { dateFormatter } from '@/utils/formatTime' +import * as GroupApi from '@/api/member/group' +import GroupForm from './GroupForm.vue' + +/** 用户分组管理 **/ +defineOptions({ name: 'MemberGroup' }) + +const message = useMessage() // 消息弹窗 +const { t } = useI18n() // 国际化 + +const loading = ref(true) // 列表的加载中 +const total = ref(0) // 列表的总页数 +const list = ref([]) // 列表的数据 +const queryParams = reactive({ + pageNo: 1, + pageSize: 10, + name: null, + status: null, + createTime: [] +}) +const queryFormRef = ref() // 搜索的表单 + +/** 查询列表 */ +const getList = async () => { + loading.value = true + try { + const data = await GroupApi.getGroupPage(queryParams) + list.value = data.list + total.value = data.total + } finally { + loading.value = false + } +} + +/** 搜索按钮操作 */ +const handleQuery = () => { + queryParams.pageNo = 1 + getList() +} + +/** 重置按钮操作 */ +const resetQuery = () => { + queryFormRef.value.resetFields() + handleQuery() +} + +/** 添加/修改操作 */ +const formRef = ref() +const openForm = (type: string, id?: number) => { + formRef.value.open(type, id) +} + +/** 删除按钮操作 */ +const handleDelete = async (id: number) => { + try { + // 删除的二次确认 + await message.delConfirm() + // 发起删除 + await GroupApi.deleteGroup(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch {} +} + +/** 初始化 **/ +onMounted(() => { + getList() +}) +</script> diff --git a/src/views/member/level/LevelForm.vue b/src/views/member/level/LevelForm.vue new file mode 100644 index 00000000..d02794be --- /dev/null +++ b/src/views/member/level/LevelForm.vue @@ -0,0 +1,175 @@ +<template> + <Dialog :title="dialogTitle" v-model="dialogVisible" width="800"> + <el-form + ref="formRef" + :model="formData" + :rules="formRules" + label-width="110px" + v-loading="formLoading" + > + <el-row> + <el-col :span="12"> + <el-form-item label="等级名称" prop="name"> + <el-input v-model="formData.name" placeholder="请输入等级名称" class="!w-240px" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="等级" prop="level"> + <el-input-number + v-model="formData.level" + :min="0" + :precision="0" + placeholder="请输入等级" + class="!w-240px" + /> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="升级经验" prop="experience"> + <el-input-number + v-model="formData.experience" + :min="0" + :precision="0" + placeholder="请输入升级经验" + class="!w-240px" + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="享受折扣(%)" prop="discount"> + <el-input-number + v-model="formData.discount" + :min="0" + :max="100" + :precision="0" + placeholder="请输入享受折扣" + class="!w-240px" + /> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="等级图标"> + <UploadImg v-model="formData.icon" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="背景图"> + <UploadImg v-model="formData.backgroundUrl" /> + </el-form-item> + </el-col> + </el-row> + <el-form-item label="状态" prop="status"> + <el-radio-group v-model="formData.status"> + <el-radio + v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" + :key="dict.value" + :label="dict.value" + > + {{ dict.label }} + </el-radio> + </el-radio-group> + </el-form-item> + </el-form> + <template #footer> + <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button> + <el-button @click="dialogVisible = false">取 消</el-button> + </template> + </Dialog> +</template> +<script setup lang="ts"> +import { DICT_TYPE, getIntDictOptions } from '@/utils/dict' +import * as LevelApi from '@/api/member/level' +import { CommonStatusEnum } from '@/utils/constants' + +/** 会员等级表单 **/ +defineOptions({ name: 'MemberLevelForm' }) + +const { t } = useI18n() // 国际化 +const message = useMessage() // 消息弹窗 + +const dialogVisible = ref(false) // 弹窗的是否展示 +const dialogTitle = ref('') // 弹窗的标题 +const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 +const formType = ref('') // 表单的类型:create - 新增;update - 修改 +const formData = ref({ + id: undefined, + name: undefined, + experience: undefined, + level: undefined, + discount: undefined, + icon: undefined, + backgroundUrl: undefined, + status: CommonStatusEnum.ENABLE +}) +const formRules = reactive({ + name: [{ required: true, message: '等级名称不能为空', trigger: 'blur' }], + experience: [{ required: true, message: '升级经验不能为空', trigger: 'blur' }], + level: [{ required: true, message: '等级不能为空', trigger: 'blur' }], + discount: [{ required: true, message: '享受折扣不能为空', trigger: 'blur' }], + status: [{ required: true, message: '状态不能为空', trigger: 'change' }] +}) +const formRef = ref() // 表单 Ref + +/** 打开弹窗 */ +const open = async (type: string, id?: number) => { + dialogVisible.value = true + dialogTitle.value = t('action.' + type) + formType.value = type + resetForm() + // 修改时,设置数据 + if (id) { + formLoading.value = true + try { + formData.value = await LevelApi.getLevel(id) + } finally { + formLoading.value = false + } + } +} +defineExpose({ open }) // 提供 open 方法,用于打开弹窗 + +/** 提交表单 */ +const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 +const submitForm = async () => { + // 校验表单 + if (!formRef) return + const valid = await formRef.value.validate() + if (!valid) return + // 提交请求 + formLoading.value = true + try { + const data = formData.value as unknown as LevelApi.LevelVO + if (formType.value === 'create') { + await LevelApi.createLevel(data) + message.success(t('common.createSuccess')) + } else { + await LevelApi.updateLevel(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + name: undefined, + experience: undefined, + level: undefined, + discount: undefined, + icon: undefined, + backgroundUrl: undefined, + status: CommonStatusEnum.ENABLE + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/member/level/components/MemberLevelSelect.vue b/src/views/member/level/components/MemberLevelSelect.vue new file mode 100644 index 00000000..6a944600 --- /dev/null +++ b/src/views/member/level/components/MemberLevelSelect.vue @@ -0,0 +1,46 @@ +<template> + <el-select v-model="levelId" placeholder="请选择用户等级" clearable class="!w-240px"> + <el-option v-for="level in levelOptions" :key="level.id" :label="level.name" :value="level.id"> + <span class="flex items-center gap-x-8px"> + <el-avatar :src="level.icon" size="small" /> + {{ level.name }} + </span> + </el-option> + </el-select> +</template> + +<script lang="ts" setup> +import * as LevelApi from '@/api/member/level' + +/** 会员等级选择框 **/ +defineOptions({ name: 'MemberLevelSelect' }) + +const props = defineProps({ + /** 下拉框选中值 **/ + modelValue: { + type: Number, + default: undefined + } +}) +const emit = defineEmits(['update:modelValue']) + +const levelId = computed({ + get() { + return props.modelValue + }, + set(value: any) { + emit('update:modelValue', value) + } +}) + +const levelOptions = ref<LevelApi.LevelVO[]>([]) + +const getList = async () => { + levelOptions.value = await LevelApi.getSimpleLevelList() +} + +/** 初始化 */ +onMounted(() => { + getList() +}) +</script> diff --git a/src/views/member/level/index.vue b/src/views/member/level/index.vue new file mode 100644 index 00000000..be1c646c --- /dev/null +++ b/src/views/member/level/index.vue @@ -0,0 +1,182 @@ +<template> + <ContentWrap> + <!-- 搜索工作栏 --> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="等级名称" prop="name"> + <el-input + v-model="queryParams.name" + placeholder="请输入等级名称" + clearable + @keyup.enter="handleQuery" + class="!w-240px" + /> + </el-form-item> + <el-form-item label="状态" prop="status"> + <el-select v-model="queryParams.status" placeholder="请选择状态" clearable class="!w-240px"> + <el-option + v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" + :key="dict.value" + :label="dict.label" + :value="dict.value" + /> + </el-select> + </el-form-item> + <el-form-item> + <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> + <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button> + <el-button type="primary" @click="openForm('create')" v-hasPermi="['member:level:create']"> + <Icon icon="ep:plus" class="mr-5px" /> 新增 + </el-button> + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true"> + <el-table-column label="编号" align="center" prop="id" min-width="60" /> + <el-table-column label="等级图标" align="center" prop="icon" min-width="80"> + <template #default="scope"> + <el-image + :src="scope.row.icon" + class="w-30px h-30px" + :preview-src-list="[scope.row.icon]" + /> + </template> + </el-table-column> + <el-table-column label="等级背景图" align="center" prop="backgroundUrl" min-width="100"> + <template #default="scope"> + <el-image + :src="scope.row.backgroundUrl" + class="w-30px h-30px" + :preview-src-list="[scope.row.backgroundUrl]" + /> + </template> + </el-table-column> + <el-table-column label="等级名称" align="center" prop="name" min-width="100" /> + <el-table-column label="等级" align="center" prop="level" min-width="60" /> + <el-table-column label="升级经验" align="center" prop="experience" min-width="80" /> + <el-table-column label="享受折扣(%)" align="center" prop="discount" min-width="110" /> + <el-table-column label="状态" align="center" prop="status" min-width="70"> + <template #default="scope"> + <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" /> + </template> + </el-table-column> + <el-table-column + label="创建时间" + align="center" + prop="createTime" + :formatter="dateFormatter" + min-width="170" + /> + <el-table-column label="操作" align="center" min-width="110px" fixed="right"> + <template #default="scope"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['member:level:update']" + > + 编辑 + </el-button> + <el-button + link + type="danger" + @click="handleDelete(scope.row.id)" + v-hasPermi="['member:level:delete']" + > + 删除 + </el-button> + </template> + </el-table-column> + </el-table> + <!-- 分页 --> + <Pagination + :total="total" + v-model:page="queryParams.pageNo" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <LevelForm ref="formRef" @success="getList" /> +</template> + +<script setup lang="ts"> +import { DICT_TYPE, getIntDictOptions } from '@/utils/dict' +import { dateFormatter } from '@/utils/formatTime' +import * as LevelApi from '@/api/member/level' +import LevelForm from './LevelForm.vue' + +/** 会员等级管理 **/ +defineOptions({ name: 'MemberLevel' }) + +const message = useMessage() // 消息弹窗 +const { t } = useI18n() // 国际化 + +const loading = ref(true) // 列表的加载中 +const total = ref(0) // 列表的总页数 +const list = ref([]) // 列表的数据 +const queryParams = reactive({ + pageNo: 1, + pageSize: 10, + name: null, + status: null +}) +const queryFormRef = ref() // 搜索的表单 + +/** 查询列表 */ +const getList = async () => { + loading.value = true + try { + const data = await LevelApi.getLevelPage(queryParams) + list.value = data.list + total.value = data.total + } finally { + loading.value = false + } +} + +/** 搜索按钮操作 */ +const handleQuery = () => { + queryParams.pageNo = 1 + getList() +} + +/** 重置按钮操作 */ +const resetQuery = () => { + queryFormRef.value.resetFields() + handleQuery() +} + +/** 添加/修改操作 */ +const formRef = ref() +const openForm = (type: string, id?: number) => { + formRef.value.open(type, id) +} + +/** 删除按钮操作 */ +const handleDelete = async (id: number) => { + try { + // 删除的二次确认 + await message.delConfirm() + // 发起删除 + await LevelApi.deleteLevel(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch {} +} + +/** 初始化 **/ +onMounted(() => { + getList() +}) +</script> diff --git a/src/views/member/tag/components/MemberTagSelect.vue b/src/views/member/tag/components/MemberTagSelect.vue index ec4f4617..ebff61ea 100644 --- a/src/views/member/tag/components/MemberTagSelect.vue +++ b/src/views/member/tag/components/MemberTagSelect.vue @@ -52,8 +52,7 @@ const tagIds = computed({ const tags = ref<TagApi.TagVO[]>([]) const getList = async () => { - const data = await TagApi.getMemberTagPage({}) - tags.value = data.list + tags.value = await TagApi.getSimpleTagList() } /** 添加用户标签表单弹框 */ diff --git a/src/views/member/user/UserForm.vue b/src/views/member/user/UserForm.vue index c10d3fea..0b7915a2 100644 --- a/src/views/member/user/UserForm.vue +++ b/src/views/member/user/UserForm.vue @@ -60,6 +60,25 @@ <el-form-item label="用户标签" prop="tagIds"> <MemberTagSelect v-model="formData.tagIds" show-add /> </el-form-item> + <el-row> + <el-col :span="12"> + <el-form-item label="用户等级" prop="levelId"> + <MemberLevelSelect v-model="formData.levelId" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item + label="修改原因" + prop="levelReason" + v-if="formData.levelId != originLevelId" + > + <el-input type="text" v-model="formData.levelReason" placeholder="请输入修改原因" /> + </el-form-item> + </el-col> + </el-row> + <el-form-item label="用户分组" prop="groupId"> + <MemberGroupSelect v-model="formData.groupId" /> + </el-form-item> <el-form-item label="会员备注" prop="mark"> <el-input type="textarea" v-model="formData.mark" placeholder="请输入会员备注" /> </el-form-item> @@ -76,6 +95,8 @@ import * as UserApi from '@/api/member/user' import * as AreaApi from '@/api/system/area' import { defaultProps } from '@/utils/tree' import MemberTagSelect from '@/views/member/tag/components/MemberTagSelect.vue' +import MemberLevelSelect from '@/views/member/level/components/MemberLevelSelect.vue' +import MemberGroupSelect from '@/views/member/group/components/MemberGroupSelect.vue' const { t } = useI18n() // 国际化 const message = useMessage() // 消息弹窗 @@ -87,6 +108,7 @@ const formType = ref('') // 表单的类型:create - 新增;update - 修改 const formData = ref({ id: undefined, mobile: undefined, + password: undefined, status: undefined, nickname: undefined, avatar: undefined, @@ -95,14 +117,19 @@ const formData = ref({ areaId: undefined, birthday: undefined, mark: undefined, - tagIds: [] + tagIds: [], + levelId: undefined, + levelReason: undefined, + groupId: undefined }) const formRules = reactive({ mobile: [{ required: true, message: '手机号不能为空', trigger: 'blur' }], - status: [{ required: true, message: '状态不能为空', trigger: 'blur' }] + status: [{ required: true, message: '状态不能为空', trigger: 'blur' }], + levelReason: [{ required: true, message: '修改原因不能为空', trigger: 'blur' }] }) const formRef = ref() // 表单 Ref const areaList = ref([]) // 地区列表 +const originLevelId = ref() // 修改前的会员等级 /** 打开弹窗 */ const open = async (type: string, id?: number) => { @@ -115,6 +142,7 @@ const open = async (type: string, id?: number) => { formLoading.value = true try { formData.value = await UserApi.getUser(id) + originLevelId.value = formData.value.levelId } finally { formLoading.value = false } @@ -158,9 +186,6 @@ const resetForm = () => { mobile: undefined, password: undefined, status: undefined, - registerIp: undefined, - loginIp: undefined, - loginDate: undefined, nickname: undefined, avatar: undefined, name: undefined, @@ -168,8 +193,10 @@ const resetForm = () => { areaId: undefined, birthday: undefined, mark: undefined, - createTime: undefined, - tagIds: [] + tagIds: [], + levelId: undefined, + levelReason: undefined, + groupId: undefined } formRef.value?.resetFields() } diff --git a/src/views/member/user/index.vue b/src/views/member/user/index.vue index 0389de37..3a8e4259 100644 --- a/src/views/member/user/index.vue +++ b/src/views/member/user/index.vue @@ -51,6 +51,12 @@ <el-form-item label="用户标签" prop="tagIds"> <MemberTagSelect v-model="queryParams.tagIds" /> </el-form-item> + <el-form-item label="用户等级" prop="levelId"> + <MemberLevelSelect v-model="queryParams.levelId" /> + </el-form-item> + <el-form-item label="用户分组" prop="groupId"> + <MemberGroupSelect v-model="queryParams.groupId" /> + </el-form-item> <el-form-item> <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button> @@ -69,9 +75,8 @@ </el-table-column> <el-table-column label="手机号" align="center" prop="mobile" width="120px" /> <el-table-column label="昵称" align="center" prop="nickname" width="80px" /> - <!-- TODO 芋艿:待接入 --> - <el-table-column label="等级" align="center" width="100px" /> - <el-table-column label="分组" align="center" width="100px" /> + <el-table-column label="等级" align="center" prop="levelName" width="100px" /> + <el-table-column label="分组" align="center" prop="groupName" width="100px" /> <el-table-column label="用户标签" align="center" @@ -133,12 +138,11 @@ import * as UserApi from '@/api/member/user' import UserForm from './UserForm.vue' import { DICT_TYPE } from '@/utils/dict' import MemberTagSelect from '@/views/member/tag/components/MemberTagSelect.vue' +import MemberLevelSelect from '@/views/member/level/components/MemberLevelSelect.vue' +import MemberGroupSelect from '@/views/member/group/components/MemberGroupSelect.vue' defineOptions({ name: 'MemberUser' }) -const message = useMessage() // 消息弹窗 -const { t } = useI18n() // 国际化 - const loading = ref(true) // 列表的加载中 const total = ref(0) // 列表的总页数 const list = ref([]) // 列表的数据 @@ -149,10 +153,11 @@ const queryParams = reactive({ mobile: null, loginDate: [], createTime: [], - tagIds: [] + tagIds: [], + levelId: null, + groupId: null }) const queryFormRef = ref() // 搜索的表单 -const exportLoading = ref(false) // 导出的加载中 /** 查询列表 */ const getList = async () => {