feat: 新增标签用户

src/modules/label/api.ts

@@ -60,3 +60,8 @@ export function getLabelRule(params: { id: string }) {
 export function updateLabelRule(data: { id: string; rules: string }) {
   return httpRequest.post('/api/lab/v1/experiment/tag/bda-save-rules', data)
 }
+
+// 获取标签成员
+export function getLabelMembers(params: { tag_id: string }) {
+  return httpRequest.get('/api/lab/v1/experiment/tag/bda-statistics-users', { params })
+}

src/modules/label/components/LabelViewDialog.vue

@@ -3,14 +3,17 @@ import type { Label } from '../types'
 import { UserFilled } from '@element-plus/icons-vue'
 import { useMapStore } from '@/stores/map'
 import { getNameByValue, updateStatusRuleList, updateStatusList, labelList } from '@/utils/dictionary'
-import { getLabelStatistics, updateLabelStatistics } from '../api'
+import { getLabelStatistics, updateLabelStatistics, getLabelMembers } from '../api'
 import { ElMessage } from 'element-plus'
+import AppList from '@/components/base/AppList.vue'
 
 const props = defineProps<{
   data: Label
 }>()
 
 const statusList = useMapStore().getMapValuesByKey('system_status')
+const genderList = useMapStore().getMapValuesByKey('system_gender')
+const connectionTypeList = useMapStore().getMapValuesByKey('experiment_connection_type')
 
 const detail = reactive({ count: 0, status: '1', updated_time: '-' })
 function fetchInfo() {
@@ -26,10 +29,50 @@ function handleUpdate() {
     fetchInfo()
   })
 }
+
+const appList = ref<InstanceType<typeof AppList> | null>(null)
+// 列表配置
+const listOptions = computed(() => {
+  return {
+    remote: {
+      httpRequest: getLabelMembers,
+      params: { tag_id: props.data.id }
+    },
+    columns: [
+      { label: '序号', type: 'index', width: 60 },
+      { label: '用户ID', prop: 'id' },
+      { label: '姓名', prop: 'name' },
+      {
+        label: '性别',
+        prop: 'gender',
+        computed({ row }: { row: any }) {
+          return getNameByValue(row.gender, genderList)
+        }
+      },
+      { label: '手机号码', prop: 'mobile' },
+      {
+        label: '来源连接',
+        prop: 'experiment_connection_id',
+        computed({ row }: { row: any }) {
+          return getNameByValue(row.connection.type.toString(), connectionTypeList)
+        }
+      },
+      {
+        label: '状态',
+        prop: 'status',
+        computed({ row }: { row: any }) {
+          return getNameByValue(row.status, statusList)
+        }
+      },
+      { label: '更新人', prop: 'updated_operator.real_name' },
+      { label: '更新时间', prop: 'updated_time' }
+    ]
+  }
+})
 </script>
 
 <template>
-  <el-dialog title="查看标签信息" width="600px">
+  <el-dialog title="查看标签信息" width="800px">
     <el-form label-suffix="：" label-width="82px">
       <el-row>
         <el-col :span="12">
@@ -74,6 +117,10 @@ function handleUpdate() {
         </dl>
       </div>
     </el-card>
+    <el-card style="margin-top: 20px">
+      <template #header>标签用户</template>
+      <AppList v-bind="listOptions" ref="appList"></AppList>
+    </el-card>
     <template #footer>
       <el-row justify="center">
         <el-button plain auto-insert-space @click="$emit('update:modelValue', false)">关闭</el-button>