feat: 标签管理

src/modules/group/api.ts

+import httpRequest from '@/utils/axios'
+import type {
+  GroupListRequest,
+  StaticGroupCreateRequest,
+  StaticGroupUpdateRequest,
+  DynamicGroupCreateRequest,
+  DynamicGroupUpdateRequest
+} from './types'
+
+// 获取群组列表
+export function getGroupList(params?: GroupListRequest) {
+  return httpRequest.get('/api/lab/v1/experiment/group/list', { params })
+}
+
+// 创建静态群组
+export function createStaticGroup(data: StaticGroupCreateRequest) {
+  return httpRequest.post('/api/lab/v1/experiment/group/create-static-group', data)
+}
+
+// 创建动态群组
+export function createDynamicGroup(data: DynamicGroupCreateRequest) {
+  return httpRequest.post('/api/lab/v1/experiment/group/create-dynamic-group', data)
+}
+
+// 更新静态群组
+export function updateStaticGroup(data: StaticGroupUpdateRequest) {
+  return httpRequest.post('/api/lab/v1/experiment/group/update-static-group', data)
+}
+
+// 更新动态群组
+export function updateDynamicGroup(data: DynamicGroupUpdateRequest) {
+  return httpRequest.post('/api/lab/v1/experiment/group/update-dynamic-group', data)
+}
+
+// 删除群组
+export function deleteGroup(data: { ids: string[] }) {
+  return httpRequest.post('/api/lab/v1/experiment/group/delete', data)
+}
+
+// 获取群组数据信息
+export function getGroupStatistics(params: { group_id: string }) {
+  return httpRequest.get('/api/lab/v1/experiment/group/statistics-detail', { params })
+}
+
+// 获取群组成员
+export function getGroupMembers(params: { group_id: string; name?: string; id?: string }) {
+  return httpRequest.get('/api/lab/v1/experiment/group/members', { params })
+}
+
+// 清空静态群组成员
+export function clearGroupMembers(data: { group_id: string }) {
+  return httpRequest.post('/api/lab/v1/experiment/group/clear-members', data)
+}
+
+// 搜索群组成员
+export function searchGroupMembers(params: { group_id: string; name?: string; id?: string }) {
+  return httpRequest.get('/api/lab/v1/experiment/group/search-members', { params })
+}
+
+// 手动添加静态群组
+export function addGroupMembers(data: { group_id: string; user_ids: string[] }) {
+  return httpRequest.post('/api/lab/v1/experiment/group/add-members', data)
+}

src/modules/group/components/BindMembers.vue

+<script setup lang="ts">
+import type { Group, GroupMember } from '../types'
+import { ElMessage } from 'element-plus'
+import AppList from '@/components/base/AppList.vue'
+import { getNameByValue, groupTypeList } from '@/utils/dictionary'
+import { useMapStore } from '@/stores/map'
+import { searchGroupMembers, addGroupMembers } from '../api'
+
+const props = defineProps<{
+  data: Group
+}>()
+
+const emit = defineEmits<{
+  (e: 'update'): void
+  (e: 'update:modelValue', visible: boolean): void
+}>()
+
+const statusList = useMapStore().getMapValuesByKey('system_status')
+
+const appList = $ref<InstanceType<typeof AppList> | null>(null)
+// 列表配置
+const listOptions = computed(() => {
+  return {
+    remote: {
+      httpRequest: searchGroupMembers,
+      params: { group_id: props.data.id }
+    },
+    columns: [
+      { type: 'selection' },
+      { label: '序号', type: 'index', width: 60 },
+      { label: '用户ID', prop: 'id' },
+      { label: '姓名', prop: 'name' },
+      { label: '性别', prop: 'gender' },
+      { label: '手机号码', prop: 'mobile' },
+      { label: '来源连接', prop: 'experiment_connection_id' },
+      { label: '状态', prop: 'status' },
+      { label: '更新人', prop: 'updated_operator.real_name' },
+      { label: '更新时间', prop: 'updated_time' }
+    ]
+  }
+})
+
+let multipleSelection = $ref<GroupMember[]>([])
+function handleSelectionChange(selection: GroupMember[]) {
+  multipleSelection = selection
+}
+// 添加
+function handleAdd() {
+  const ids = multipleSelection.map(item => item.id)
+  addGroupMembers({ group_id: props.data.id, user_ids: ids }).then(() => {
+    ElMessage({ message: '添加成功', type: 'success' })
+    emit('update')
+    emit('update:modelValue', false)
+  })
+}
+</script>
+
+<template>
+  <el-dialog title="添加群组用户" width="800px" append-to-body @update:modelValue="$emit('update:modelValue')">
+    <el-form label-suffix="：" label-width="82px">
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="群组名称">{{ data.name }}</el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="群组类型">{{ getNameByValue(data.type, groupTypeList) }}</el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="状态">
+            <el-tag :type="data.status === '1' ? 'success' : 'danger'">
+              {{ getNameByValue(data.status, statusList) }}
+            </el-tag>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <AppList v-bind="listOptions" ref="appList" @selection-change="handleSelectionChange">
+      <template #table-status="{ row }: { row: Group }">
+        <el-tag :type="row.status === '1' ? 'success' : 'danger'">
+          {{ getNameByValue(row.status, statusList) }}
+        </el-tag>
+      </template>
+    </AppList>
+
+    <template #footer>
+      <el-row justify="center">
+        <el-button plain auto-insert-space @click="$emit('update:modelValue', false)">关闭</el-button>
+        <el-button type="primary" plain auto-insert-space @click="handleAdd" :disabled="!multipleSelection.length"
+          >添加</el-button
+        >
+      </el-row>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss">
+.group-box {
+  display: flex;
+  justify-content: space-between;
+  dt {
+    margin-bottom: 10px;
+    text-align: center;
+  }
+  dd {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    span {
+      padding: 0 5px;
+    }
+  }
+}
+.group-box__count {
+  font-weight: bold;
+  color: var(--main-color);
+}
+</style>

src/modules/group/components/FormDialog.vue

@@ -2,7 +2,9 @@
 import type { Group } from '../types'
 import type { FormInstance, FormRules } from 'element-plus'
 import { ElMessage } from 'element-plus'
-import { dateUnitList, weekList } from '@/utils/dictionary'
+import { updateStatusRuleList, dateUnitList, weekList } from '@/utils/dictionary'
+import { createStaticGroup, updateStaticGroup, createDynamicGroup, updateDynamicGroup } from '../api'
+import { pick } from 'lodash-es'
 
 interface Props {
   data: Partial<Group>
@@ -17,9 +19,9 @@ const emit = defineEmits<{
 const isUpdate = $computed(() => !!props.data?.id)
 const title = $computed(() => {
   if (isUpdate) {
-    return props.data.type === 1 ? '修改静态群组' : '修改动态群组'
+    return props.data.type === '1' ? '修改静态群组' : '修改动态群组'
   } else {
-    return props.data.type === 1 ? '新建静态群组' : '新建动态群组'
+    return props.data.type === '1' ? '新建静态群组' : '新建动态群组'
   }
 })
 
@@ -28,12 +30,25 @@ const form = reactive({
   id: '',
   name: '',
   type: '',
-  status: '',
-  update_rule: {
-    type: '1',
-    info: { unit: undefined, week: undefined, day: undefined }
+  status: '1',
+  update_status: '1',
+  update_rule: { type: 1, info: 1 },
+  user_attr_rule: [],
+  event_attr_rule: [],
+  tag_rule: []
+})
+watchEffect(() => {
+  if (props.data?.id) {
+    let updateRule = { type: 1, info: 1 }
+    try {
+      updateRule = JSON.parse(props.data.update_rule as string)
+    } catch (error) {
+      console.log(error)
+    }
+    Object.assign(form, props.data, { update_rule: updateRule })
   }
 })
+
 const rules = ref<FormRules>({
   name: [{ required: true, message: '请输入群组名称' }],
   url: [{ required: true, message: '请选择标签类型图标' }]
@@ -44,13 +59,49 @@ function handleSubmit() {
   formRef?.validate().then(() => (isUpdate ? handleUpdate() : handleCreate()))
 }
 // 新建
-function handleCreate() {
+async function handleCreate() {
+  if (props.data.type === '1') {
+    // 静态群组
+    const params = pick(form, ['name', 'status'])
+    await createStaticGroup(params)
+  } else {
+    // 动态群组
+    const params = pick(
+      {
+        ...form,
+        update_rule: JSON.stringify(form.update_rule),
+        user_attr_rule: JSON.stringify(form.user_attr_rule),
+        event_attr_rule: JSON.stringify(form.event_attr_rule),
+        tag_rule: JSON.stringify(form.tag_rule)
+      },
+      ['name', 'update_status', 'update_rule', 'user_attr_rule', 'event_attr_rule', 'tag_rule', 'status']
+    )
+    await createDynamicGroup(params)
+  }
   ElMessage({ message: '创建成功', type: 'success' })
   emit('update')
   emit('update:modelValue', false)
 }
 // 修改
-function handleUpdate() {
+async function handleUpdate() {
+  if (props.data.type === '1') {
+    // 静态群组
+    const params = pick(form, ['id', 'name', 'status'])
+    await updateStaticGroup(params)
+  } else {
+    // 动态群组
+    const params = pick(
+      {
+        ...form,
+        update_rule: JSON.stringify(form.update_rule),
+        user_attr_rule: JSON.stringify(form.user_attr_rule),
+        event_attr_rule: JSON.stringify(form.event_attr_rule),
+        tag_rule: JSON.stringify(form.tag_rule)
+      },
+      ['id', 'name', 'update_status', 'update_rule', 'user_attr_rule', 'event_attr_rule', 'tag_rule', 'status']
+    )
+    await updateDynamicGroup(params)
+  }
   ElMessage({ message: '修改成功', type: 'success' })
   emit('update')
   emit('update:modelValue', false)
@@ -63,37 +114,40 @@ function handleUpdate() {
       <el-form-item label="群组名称" prop="name">
         <el-input v-model="form.name" placeholder="请输入" />
       </el-form-item>
-      <el-form-item label="更新频率" prop="update_rule.type" v-if="data.type === 2">
-        <el-radio-group v-model="form.update_rule.type">
-          <el-radio label="1">自动更新</el-radio>
-          <el-radio label="2">手动更新</el-radio>
+      <template v-if="data.type === '2'">
+        <el-form-item label="更新频率" prop="update_status">
+          <el-radio-group v-model="form.update_status">
+            <el-radio v-for="item in updateStatusRuleList" :key="item.value" :label="item.value">
+              {{ item.label }}
+            </el-radio>
           </el-radio-group>
-        <div class="update-rule-wrap" v-if="form.update_rule.type === '1'">
+          <div class="update-rule-wrap" v-if="form.update_status === '1'">
             <span>每</span>
-          <el-select v-model="form.update_rule.info.unit" placeholder=" " style="width: 60px">
+            <el-select v-model="form.update_rule.type" placeholder=" " style="width: 60px">
               <el-option v-for="item in dateUnitList" :label="item.label" :value="item.value"></el-option>
             </el-select>
-          <template v-if="form.update_rule.info.unit === 1">
+            <template v-if="form.update_rule.type === 1">
               <span>的凌晨更新</span>
             </template>
-          <template v-if="form.update_rule.info.unit === 2">
+            <template v-if="form.update_rule.type === 2">
               <span>的</span>
-            <el-select v-model="form.update_rule.info.week" placeholder=" " style="width: 80px">
+              <el-select v-model="form.update_rule.info" placeholder=" " style="width: 80px">
                 <el-option v-for="item in weekList" :label="item.label" :value="item.value"></el-option>
               </el-select>
               <span>的凌晨更新</span>
             </template>
-          <template v-if="form.update_rule.info.unit === 3">
+            <template v-if="form.update_rule.type === 3">
               <span>第</span>
-            <el-select v-model="form.update_rule.info.day" placeholder=" " style="width: 60px">
+              <el-select v-model="form.update_rule.info" placeholder=" " style="width: 60px">
                 <el-option v-for="item in 6" :label="item" :value="item"></el-option>
               </el-select>
               <span>天的凌晨更新</span>
             </template>
           </div>
         </el-form-item>
+      </template>
       <el-form-item label="状态" prop="status">
-        <el-switch v-model="form.status" active-text="生效" inactive-text="失效" />
+        <el-switch v-model="form.status" active-text="生效" active-value="1" inactive-text="失效" inactive-value="0" />
       </el-form-item>
     </el-form>
     <template #footer>

src/modules/group/components/ViewDialog.vue

 <script setup lang="ts">
 import type { Group } from '../types'
-import { UserFilled } from '@element-plus/icons-vue'
-// import { ElMessage } from 'element-plus'
+import { UserFilled, Plus, Delete } from '@element-plus/icons-vue'
+import { ElMessageBox, ElMessage } from 'element-plus'
+import AppList from '@/components/base/AppList.vue'
+import { getNameByValue, groupTypeList, updateStatusRuleList } from '@/utils/dictionary'
+import { useMapStore } from '@/stores/map'
+import { getGroupStatistics, getGroupMembers, clearGroupMembers } from '../api'
+import BindMembers from './BindMembers.vue'
 
-interface Props {
+const props = defineProps<{
   data: Group
-}
-const props = defineProps<Props>()
+}>()
 
 const emit = defineEmits<{
   (e: 'update'): void
   (e: 'update:modelValue', visible: boolean): void
 }>()
 
+const statusList = useMapStore().getMapValuesByKey('system_status')
+
+const detail = reactive({ count: 0, status: 1, updated_time: '-' })
+function fetchInfo() {
+  getGroupStatistics({ group_id: props.data.id }).then(res => {
+    Object.assign(detail, res.data.detail)
+  })
+}
+watchEffect(() => fetchInfo())
+
+// 清空群组成员
+function handleClearMembers() {
+  ElMessageBox.confirm('确定要删清空该群组成员吗？', '提示').then(() => {
+    clearGroupMembers({ group_id: props.data.id }).then(() => {
+      ElMessage({ message: '清空成功', type: 'success' })
+      handleRefresh()
+    })
+  })
+}
+
+const appList = $ref<InstanceType<typeof AppList> | null>(null)
 // 列表配置
 const listOptions = computed(() => {
   return {
+    remote: {
+      httpRequest: getGroupMembers,
+      params: { group_id: props.data.id }
+    },
     columns: [
       { label: '序号', type: 'index', width: 60 },
       { label: '用户ID', prop: 'id' },
       { label: '姓名', prop: 'name' },
-      { label: '性别', prop: 'name' },
-      { label: '手机号码', prop: 'name' },
-      { label: '来源连接', prop: 'name' },
-      { label: '状态', prop: 'name' },
-      { label: '更新人', prop: 'name' },
-      { label: '更新时间', prop: 'name' }
-    ],
-    data: [{ id: 1 }, { id: 2 }]
+      { label: '性别', prop: 'gender' },
+      { label: '手机号码', prop: 'mobile' },
+      { label: '来源连接', prop: 'experiment_connection_id' },
+      { label: '状态', prop: 'status' },
+      { label: '更新人', prop: 'updated_operator.real_name' },
+      { label: '更新时间', prop: 'updated_time' }
+    ]
   }
 })
+// 刷新
+function handleRefresh() {
+  fetchInfo()
+  appList?.refetch()
+}
+// 添加群组成员
+let selectMembersVisible = $ref(false)
+function handleAdd() {
+  selectMembersVisible = true
+}
 </script>
 
 <template>
-  <el-dialog
-    title="查看群组信息"
-    :close-on-click-modal="false"
-    width="800px"
-    @update:modelValue="$emit('update:modelValue')">
+  <el-dialog title="查看群组信息" width="800px" @update:modelValue="$emit('update:modelValue')">
     <el-form label-suffix="：" label-width="82px">
       <el-row>
-        <el-col :span="12"><el-form-item label="群组名称">群组名称</el-form-item></el-col>
         <el-col :span="12">
-          <el-form-item label="群组类型">群组类型</el-form-item>
+          <el-form-item label="群组名称">{{ data.name }}</el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="群组类型">{{ getNameByValue(data.type, groupTypeList) }}</el-form-item>
         </el-col>
       </el-row>
       <el-row>
-        <el-col :span="12"><el-form-item label="更新频率">自动更新</el-form-item></el-col>
-        <el-col :span="12"><el-form-item label="状态">生效</el-form-item></el-col>
+        <el-col :span="12">
+          <el-form-item label="更新频率">{{ getNameByValue(data.update_status, updateStatusRuleList) }}</el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="状态">
+            <el-tag :type="data.status === '1' ? 'success' : 'danger'">
+              {{ getNameByValue(data.status, statusList) }}
+            </el-tag>
+          </el-form-item>
+        </el-col>
       </el-row>
     </el-form>
     <el-card>
       <div class="group-box">
         <dl>
-          <dt>符合群组人数</dt>
-          <dd class="group-box__count">
+          <dt>群组人数</dt>
+          <dd class="label-box__count">
             <el-icon><UserFilled></UserFilled></el-icon>
-            <span>199人</span>
+            <span>{{ detail.count }}人</span>
+          </dd>
+        </dl>
+        <template v-if="data.type === '1'">
+          <dl>
+            <dt></dt>
+            <dd>
+              <el-button type="danger" :icon="Delete" @click="handleClearMembers">清空用户群组</el-button>
+              <el-button type="primary" :icon="Plus" @click="handleAdd">添加用户</el-button>
             </dd>
           </dl>
+        </template>
+        <template v-else>
           <dl>
             <dt>最后更新时间</dt>
-          <dd>2022-10-12 13:24:23</dd>
+            <dd>{{ detail.updated_time }}</dd>
           </dl>
           <dl>
             <dt>更新状态</dt>
@@ -70,6 +124,7 @@ const listOptions = computed(() => {
               <el-button type="primary" plain size="small">立即更新</el-button>
             </dd>
           </dl>
+        </template>
       </div>
     </el-card>
     <el-card style="margin-top: 20px">
@@ -82,6 +137,11 @@ const listOptions = computed(() => {
         <el-button plain auto-insert-space @click="$emit('update:modelValue', false)">关闭</el-button>
       </el-row>
     </template>
+    <BindMembers
+      :data="data"
+      v-model="selectMembersVisible"
+      @update="handleRefresh"
+      v-if="selectMembersVisible"></BindMembers>
   </el-dialog>
 </template>
 

src/modules/group/types.ts

+import type { Operator } from '@/types'
+
 export interface Group {
   id: string
   name: string
-  status: number
-  type: 1 | 2
+  type_id: string
+  status: string
+  type: '1' | '2'
+  update_status: string // '1' | '2'
+  update_rule: string
+  created_time: string
+  created_operator: Operator
+  updated_time: string
+  updated_operator: Operator
+  user_attr_rule?: string
+  event_attr_rule?: string
+  tag_rule?: string
+}
+
+export type GroupListRequest = Pick<Group, 'id' | 'name'> & { experiment_id?: string }
+
+// 静态群组
+export type StaticGroupUpdateRequest = Pick<Group, 'id' | 'name' | 'status'> & {
+  experiment_id?: string
+}
+export type StaticGroupCreateRequest = Omit<StaticGroupUpdateRequest, 'id'>
+
+// 动态群组
+export type DynamicGroupUpdateRequest = Pick<
+  Group,
+  'id' | 'name' | 'update_status' | 'update_rule' | 'user_attr_rule' | 'event_attr_rule' | 'tag_rule' | 'status'
+> & {
+  experiment_id?: string
+}
+export type DynamicGroupCreateRequest = Omit<DynamicGroupUpdateRequest, 'id'>
+
+export interface GroupMember {
+  id: string
+  name: string
+  gender: string
+  mobile: string
+  status: string
+  created_time: string
+  created_operator: Operator
+  updated_time: string
+  updated_operator: Operator
 }

src/modules/group/views/Index.vue

@@ -2,37 +2,54 @@
 import type { Group } from '../types'
 import { Plus, Delete } from '@element-plus/icons-vue'
 import AppList from '@/components/base/AppList.vue'
-import { ElMessageBox } from 'element-plus'
+import { ElMessageBox, ElMessage } from 'element-plus'
+import { getNameByValue, groupTypeList, updateStatusRuleList } from '@/utils/dictionary'
+import { getGroupList, deleteGroup } from '../api'
+import { useMapStore } from '@/stores/map'
 
 const FormDialog = defineAsyncComponent(() => import('../components/FormDialog.vue'))
 const ViewDialog = defineAsyncComponent(() => import('../components/ViewDialog.vue'))
 
+const statusList = useMapStore().getMapValuesByKey('system_status')
+
 const appList = $ref<InstanceType<typeof AppList> | null>(null)
 // 列表配置
 const listOptions = computed(() => {
   return {
+    remote: {
+      httpRequest: getGroupList,
+      params: { name: '', id: '', status: '', updated_operator: '' }
+    },
     filters: [
       { type: 'input', prop: 'name', placeholder: '请输入群组名称' },
       { type: 'input', prop: 'id', placeholder: '请输入群组ID' },
-      { type: 'select', prop: 'status', placeholder: '请输入群组名称' },
-      { type: 'input', prop: 'user', placeholder: '更新人' }
+      { type: 'select', prop: 'status', placeholder: '请选择群组状态', options: statusList },
+      { type: 'input', prop: 'updated_operator', placeholder: '更新人' }
     ],
     columns: [
       { type: 'selection' },
       { label: '序号', type: 'index', width: 60 },
-      { label: '群主ID', prop: 'id' },
-      { label: '群主名称', prop: 'name' },
-      { label: '群主类型', prop: 'name' },
-      { label: '更新方式', prop: 'name' },
-      { label: '最近计算完成时间', prop: 'name' },
-      { label: '状态', prop: 'name' },
-      { label: '更新人', prop: 'name' },
-      { label: '更新时间', prop: 'name' },
+      { label: '群组ID', prop: 'id' },
+      { label: '群组名称', prop: 'name' },
+      {
+        label: '群组类型',
+        prop: 'type',
+        computed({ row }: { row: Group }) {
+          return getNameByValue(row.type, groupTypeList)
+        }
+      },
+      {
+        label: '更新方式',
+        prop: 'update_status',
+        computed({ row }: { row: Group }) {
+          return getNameByValue(row.update_status, updateStatusRuleList)
+        }
+      },
+      { label: '最近计算完成时间', prop: 'record.updated_time' },
+      { label: '状态', prop: 'status', slots: 'table-status' },
+      { label: '更新人', prop: 'created_operator.real_name' },
+      { label: '更新时间', prop: 'updated_time' },
       { label: '操作', slots: 'table-x', width: 240 }
-    ],
-    data: [
-      { id: 1, type: 1 },
-      { id: 2, type: 2 }
     ]
   }
 })
@@ -42,11 +59,16 @@ function handleRefresh() {
   appList?.refetch()
 }
 
+let multipleSelection = $ref<Group[]>([])
+function handleSelectionChange(selection: Group[]) {
+  multipleSelection = selection
+}
+
 let formVisible = $ref(false)
 let currentRow = $ref<Partial<Group>>()
 
 // 新建
-function handleAdd(type: 1 | 2) {
+function handleAdd(type: '1' | '2') {
   currentRow = { type }
   formVisible = true
 }
@@ -56,8 +78,14 @@ function handleUpdate(row: Group) {
   formVisible = true
 }
 // 删除
-function handleRemove(row: Group) {
-  ElMessageBox.confirm('确定要删除该群组吗？', '提示').then(() => {})
+function handleRemove(rows: Group[]) {
+  ElMessageBox.confirm(rows.length > 1 ? '确定要删除勾选群组吗？' : '确定要删除该群组吗？', '提示').then(() => {
+    const ids = rows.map(item => item.id)
+    deleteGroup({ ids }).then(() => {
+      ElMessage({ message: '删除成功', type: 'success' })
+      handleRefresh()
+    })
+  })
 }
 let viewVisible = $ref(false)
 // 查看
@@ -69,32 +97,49 @@ function handleView(row: Group) {
 
 <template>
   <AppCard>
-    <AppList v-bind="listOptions" ref="appList">
+    <AppList v-bind="listOptions" ref="appList" @selection-change="handleSelectionChange">
       <template #header-buttons>
         <el-space>
           <el-dropdown>
             <el-button type="primary" :icon="Plus">新建</el-button>
             <template #dropdown>
               <el-dropdown-menu>
-                <el-dropdown-item @click="handleAdd(2)">新建动态群组</el-dropdown-item>
-                <el-dropdown-item @click="handleAdd(1)">新建静态群组</el-dropdown-item>
+                <el-dropdown-item @click="handleAdd('2')">新建动态群组</el-dropdown-item>
+                <el-dropdown-item @click="handleAdd('1')">新建静态群组</el-dropdown-item>
               </el-dropdown-menu>
             </template>
           </el-dropdown>
-          <el-button type="danger" plain :icon="Delete">删除</el-button>
+          <el-button
+            type="danger"
+            plain
+            :icon="Delete"
+            :disabled="!multipleSelection.length"
+            @click="handleRemove(multipleSelection)"
+            >删除</el-button
+          >
         </el-space>
       </template>
 
+      <template #table-status="{ row }: { row: Group }">
+        <el-tag :type="row.status === '1' ? 'success' : 'danger'">
+          {{ getNameByValue(row.status, statusList) }}
+        </el-tag>
+      </template>
+
       <template #table-x="{ row }">
         <el-button type="primary" plain @click="handleView(row)">查看</el-button>
         <el-button type="primary" plain @click="handleUpdate(row)">编辑</el-button>
-        <el-button type="primary" plain @click="handleRemove(row)">删除</el-button>
+        <el-button type="primary" plain @click="handleRemove([row])">删除</el-button>
       </template>
     </AppList>
   </AppCard>
 
   <!-- 新建/修改群组 -->
-  <FormDialog v-model="formVisible" :data="currentRow" v-if="formVisible && currentRow"></FormDialog>
+  <FormDialog
+    v-model="formVisible"
+    :data="currentRow"
+    @update="handleRefresh"
+    v-if="formVisible && currentRow"></FormDialog>
   <!-- 查看 -->
   <ViewDialog v-model="viewVisible" :data="(currentRow as Group)" v-if="viewVisible && currentRow"></ViewDialog>
 </template>

src/modules/label/api.ts

@@ -50,5 +50,5 @@ export function deleteLabel(data: { id: string }) {
 
 // 获取标签数据信息
 export function getLabelStatistics(params: { id: string }) {
-  return httpRequest.get('/api/lab//v1/experiment/tag/statistics', { params })
+  return httpRequest.get('/api/lab/v1/experiment/tag/statistics', { params })
 }

src/modules/label/components/LabelFormDialog.vue

@@ -2,10 +2,9 @@
 import type { Label } from '../types'
 import type { FormInstance, FormRules } from 'element-plus'
 import { ElMessage } from 'element-plus'
-import { dateUnitList, weekList } from '@/utils/dictionary'
+import { updateStatusRuleList, dateUnitList, weekList } from '@/utils/dictionary'
 import { createLabel, updateLabel } from '../api'
 import { useLabelType } from '../composables/useLabelType'
-import { updateStatusRuleList } from '@/utils/dictionary'
 import { pick } from 'lodash-es'
 
 const props = defineProps<{

src/modules/label/types.ts

@@ -19,7 +19,7 @@ export interface Label {
   name: string
   type_id: string
   status: string
-  update_status: '1' | '2'
+  update_status: string // '1' | '2'
   update_rule: string
   tag_type: LabelType
   created_time: string
@@ -33,9 +33,9 @@ export interface LabelUpdateRule {
   info: number
 }
 
-export type LabelListRequest = Pick<LabelType, 'id' | 'name'> & { experiment_id?: string }
+export type LabelListRequest = Pick<Label, 'id' | 'name'> & { experiment_id?: string }
 
-export type LabelUpdateRequest = Pick<Label, 'id' | 'name' | 'type_id' | 'update_rule' | 'status'> & {
+export type LabelUpdateRequest = Pick<Label, 'id' | 'name' | 'type_id' | 'update_status' | 'update_rule' | 'status'> & {
   experiment_id?: string
 }
 

src/router/index.ts

@@ -19,7 +19,7 @@ router.beforeEach(async (to, from, next) => {
     return
   }
   if (!to.query.experiment_id) {
-    to.query.experiment_id = '7028276368903241728'
+    to.query.experiment_id = '7025368348925886464'
     next({ path: to.path, query: to.query })
   } else {
     next()

src/utils/axios.ts

@@ -6,7 +6,7 @@ const httpRequest = axios.create({
   timeout: 60000,
   withCredentials: true,
   headers: {
-    'Content-Type': 'application/x-www-form-urlencoded'
+    // 'Content-Type': 'application/x-www-form-urlencoded'
   }
 })
 
@@ -14,9 +14,9 @@ const httpRequest = axios.create({
 httpRequest.interceptors.request.use(
   function (config) {
     if (config.method === 'get')
-      config.params = Object.assign({}, config.params, { experiment_id: '7028276368903241728' })
+      config.params = Object.assign({}, config.params, { experiment_id: '7025368348925886464' })
 
-    if (config.method === 'post') config.data = Object.assign({}, config.data, { experiment_id: '7028276368903241728' })
+    if (config.method === 'post') config.data = Object.assign({}, config.data, { experiment_id: '7025368348925886464' })
 
     return config
   },

src/utils/dictionary.ts

@@ -13,6 +13,12 @@ export const tripTemplateTypeList = [
   { label: '固定旅程', value: '2' }
 ]
 
+// 群组类型
+export const groupTypeList = [
+  { label: '静态群组', value: '1' },
+  { label: '动态群组', value: '2' }
+]
+
 // 更新方式
 export const updateStatusRuleList = [
   { label: '自动更新', value: '1' },