xx

2025-12-08 15:18:37 +08:00
parent 5ea4f2cfe3
commit a09631551b
15 changed files with 1172 additions and 1502 deletions
@@ -5,8 +5,8 @@
      <!-- 搜索和操作栏 -->
      <div class="filter-section">
        <div class="filter-content">
-          <el-form :inline="true" :model="queryParams" class="search-form">
-            <el-form-item label="代金卷">
+          <el-form :inline="true" :model="queryParams" class="search-form" v-if="!codeId">
+            <el-form-item label="代金卷" v-if="!codeId">
              <el-select 
                v-model="queryParams.code_id" 
                placeholder="请选择代金券"
@@ -68,8 +68,8 @@
        >
          <el-table-column type="selection" width="55" />
          <el-table-column prop="id" label="ID" width="80" />
-          <el-table-column prop="discountId" label="代金券ID" width="120" />
-          <el-table-column label="关联对象ID" width="130">
+          <el-table-column prop="discountId" label="代金券ID" width="120" v-if="!codeId" />
+          <el-table-column label="关联对象ID" min-width="150">
            <template #default="{ row }">
              {{ row.userId || row.userGroupId || '-' }}
            </template>
@@ -224,82 +224,16 @@
    </el-dialog>

    <!-- 用户选择弹窗 -->
-    <el-dialog
-      v-model="userSelectorVisible"
-      title="选择用户"
-      width="800px"
-      class="user-selector-dialog"
-      append-to-body
-    >
-      <!-- 搜索栏 -->
-      <div class="selector-search">
-        <el-input
-          v-model="userSearchParams.key"
-          placeholder="搜索用户名或ID"
-          clearable
-          @keyup.enter="searchUsers"
-          style="width: 300px; margin-right: 12px"
-        >
-          <template #prefix>
-            <el-icon><Search /></el-icon>
-          </template>
-        </el-input>
-        <el-button type="primary" @click="searchUsers">
-          <el-icon><Search /></el-icon>
-          搜索
-        </el-button>
-        <el-button @click="resetUserSearch">重置</el-button>
-      </div>
-
-      <!-- 用户表格 -->
-      <el-table
-        v-loading="userSelectorLoading"
-        :data="userSelectorList"
-        highlight-current-row
-        @current-change="handleUserSelectChange"
-        style="width: 100%; margin-top: 16px"
-        :height="400"
-      >
-        <el-table-column type="index" label="序号" width="60" />
-        <el-table-column prop="UserId" label="用户ID" width="100" />
-        <el-table-column prop="UserName" label="用户名" min-width="150" />
-        <el-table-column prop="Email" label="邮箱" min-width="180" />
-        <el-table-column label="状态" width="100">
-          <template #default="{ row }">
-            <el-tag :type="row.Status === 1 ? 'success' : 'danger'" size="small">
-              {{ row.Status === 1 ? '正常' : '禁用' }}
-            </el-tag>
-          </template>
-        </el-table-column>
-      </el-table>
-
-      <!-- 分页 -->
-      <el-pagination
-        v-model:current-page="userSearchParams.page"
-        v-model:page-size="userSearchParams.count"
-        :page-sizes="[10, 20, 50, 100]"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="userSelectorTotal"
-        @size-change="handleUserSelectorSizeChange"
-        @current-change="handleUserSelectorPageChange"
-        background
-        class="selector-pagination"
-      />
-
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button @click="userSelectorVisible = false">取消</el-button>
-          <el-button type="primary" @click="confirmUserSelection" :disabled="!selectedUserTemp">
-            确定选择
-          </el-button>
-        </div>
-      </template>
-    </el-dialog>
+    <UserSelector
+      v-model:visible="userSelectorVisible"
+      @select="confirmUserSelection"
+    />
  </div>
 </template>

+
 <script setup>
-import { ref, reactive, onMounted } from 'vue'
+import { ref, reactive, onMounted, watch } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { Delete, Search, Plus, Refresh, User } from '@element-plus/icons-vue'
 import { 
@@ -313,14 +247,29 @@ import {
  getUserList,
  getUserGroupList
 } from '@/api/admin/user'
+import UserSelector from '@/components/UserSelector/index.vue'
+
+const props = defineProps({
+  codeId: {
+    type: [String, Number],
+    default: ''
+  }
+})

 // 查询参数
 const queryParams = reactive({
-  code_id: '',
+  code_id: props.codeId || '',
  page: 1,
  count: 10
 })

+watch(() => props.codeId, (newVal) => {
+  if (newVal) {
+    queryParams.code_id = newVal
+    fetchUsersList()
+  }
+})
+
 // 表单数据
 const form = reactive({
  id: undefined,
@@ -364,15 +313,6 @@ const userGroupOptions = ref([])  // 用户组列表选项

 // 用户选择弹窗相关
 const userSelectorVisible = ref(false)
-const userSelectorLoading = ref(false)
-const userSelectorList = ref([])
-const userSelectorTotal = ref(0)
-const selectedUserTemp = ref(null)  // 临时存储选中的用户
-const userSearchParams = reactive({
-  key: '',
-  page: 1,
-  count: 10
-})

 // 格式化日期
 const formatDate = (dateStr) => {
@@ -469,70 +409,19 @@ const fetchUserGroupList = async () => {
 // 打开用户选择器
 const openUserSelector = () => {
  userSelectorVisible.value = true
-  selectedUserTemp.value = null
-  userSearchParams.key = ''
-  userSearchParams.page = 1
-  fetchUserSelectorList()
-}
-
-// 获取用户选择器列表
-const fetchUserSelectorList = async () => {
-  userSelectorLoading.value = true
-  try {
-    const res = await getUserList(userSearchParams)
-    console.log('用户选择器列表:', res.data)
-    if (res.data.code === 200) {
-      userSelectorList.value = res.data.data?.data || []
-      userSelectorTotal.value = res.data.data?.all_count || 0
-    }
-  } catch (error) {
-    console.error('获取用户列表失败:', error)
-    ElMessage.error('获取用户列表失败')
-  } finally {
-    userSelectorLoading.value = false
-  }
-}
-
-// 搜索用户
-const searchUsers = () => {
-  userSearchParams.page = 1
-  fetchUserSelectorList()
-}
-
-// 重置用户搜索
-const resetUserSearch = () => {
-  userSearchParams.key = ''
-  userSearchParams.page = 1
-  fetchUserSelectorList()
-}
-
-// 用户选择变化
-const handleUserSelectChange = (row) => {
-  selectedUserTemp.value = row
-}
-
-// 用户选择器分页
-const handleUserSelectorSizeChange = (size) => {
-  userSearchParams.count = size
-  fetchUserSelectorList()
-}
-
-const handleUserSelectorPageChange = (page) => {
-  userSearchParams.page = page
-  fetchUserSelectorList()
 }

 // 确认用户选择
-const confirmUserSelection = () => {
-  if (!selectedUserTemp.value) {
+const confirmUserSelection = (user) => {
+  if (!user) {
    ElMessage.warning('请选择一个用户')
    return
  }
-  form.selected_user = selectedUserTemp.value.UserId
-  form.user_id = selectedUserTemp.value.UserId
+  form.selected_user = user.UserId
+  form.user_id = user.UserId
  // 将选中的用户添加到 userOptions 中（如果不存在）
-  if (!userOptions.value.find(u => u.UserId === selectedUserTemp.value.UserId)) {
-    userOptions.value.push(selectedUserTemp.value)
+  if (!userOptions.value.find(u => u.UserId === user.UserId)) {
+    userOptions.value.push(user)
  }
  userSelectorVisible.value = false
  ElMessage.success('用户选择成功')
@@ -691,6 +580,7 @@ const handleEdit = (row) => {
  })
  //点击编辑需要初始化加载用户列表
    fetchUserList()
+    fetchUserGroupList()
 }

 // 删除用户关联