优化

src/components/auth-select/index.vue

@@ -1,63 +1,247 @@
 <template>
-  <a-tree-select
-    :model-value="modelValue"
-    :field-names="{ title: 'name', key: 'id' }"
-    @update:model-value="onUpdate"
-    :data="authOptions"
-    tree-checked-strategy="child"
-    :tree-checkable="multiple"
-    :max-tag-count="2"
-    allow-search
-    allow-clear
-    :filter-tree-node="filterTreeNode"
-    dropdown-style="paddingRight: 10px;"
-    placeholder="负责人"
-  />
+  <div class="auth-select-wrapper">
+    <a-tree-select
+      :model-value="modelValue"
+      @update:model-value="onUpdate"
+      :data="authOptions"
+      tree-checked-strategy="child"
+      :tree-checkable="multiple"
+      :max-tag-count="2"
+      :fieldNames="{ title: 'name', key: 'id' }"
+      allow-search
+      allow-clear
+      :filter-tree-node="filterTreeNode"
+      :treeProps="{
+        defaultExpandedKeys: [],
+        expandedKeys: expandedKeys,
+        onExpand: expandTreeNode,
+      }"
+      placeholder="负责人"
+    >
+      <template #header v-if="multiple && showFooter">
+        <div class="tree-select-header">
+          <a-space>
+            <a-button type="primary" size="mini" @click="handleSelectAll">
+              全选
+            </a-button>
+            <a-button type="outline" size="mini" @click="handleInvertSelect">
+              反选
+            </a-button>
+            <a-button type="dashed" size="mini" @click="handleClear">
+              清空
+            </a-button>
+          </a-space>
+        </div>
+      </template>
+    </a-tree-select>
+  </div>
 </template>
 <script setup>
 import { ref, onMounted, defineProps, defineEmits } from "vue";
 import advertCommonApi from "@/views/v1/api/advert/common";
 
-const authOptions = ref([]);
-const expandedKeys = ref([]);
 const props = defineProps({
   modelValue: {
-    type: [Array],
-    default: [],
+    type: [String, Number, Array],
+    default: "",
   },
   multiple: {
     type: Boolean,
     default: false,
   },
+  showFooter: {
+    type: Boolean,
+    default: true,
+  },
 });
 
-const emit = defineEmits(["update:modelValue"]);
+const expandedKeys = ref([]);
+const searchText = ref(""); // 存储当前搜索文本
+const emit = defineEmits(["update:modelValue", "change"]);
 const onUpdate = (val) => {
   emit("update:modelValue", val);
+  emit("change", val);
+};
+const authOptions = ref([]);
+
+// 获取节点的所有祖先节点ID
+const getAncestorIds = (nodeId) => {
+  const ancestorIds = [];
+  const findNode = (nodes, targetId) => {
+    for (const node of nodes) {
+      if (node.id === targetId) {
+        return node;
+      }
+      if (node.children && node.children.length > 0) {
+        const found = findNode(node.children, targetId);
+        if (found) return found;
+      }
+    }
+    return null;
+  };
+
+  let currentId = nodeId;
+  while (currentId) {
+    const node = findNode(authOptions.value, currentId);
+    if (node && node.parent_id) {
+      ancestorIds.push(node.parent_id);
+      currentId = node.parent_id;
+    } else {
+      break;
+    }
+  }
+  return ancestorIds;
 };
+
 // 搜索
 const filterTreeNode = (inputText, node) => {
-  return node.name.toLowerCase().indexOf(inputText.toLowerCase()) > -1;
+  // 更新搜索文本
+  searchText.value = inputText || "";
+
+  if (inputText) {
+    const filterData =
+      node.name.toLowerCase().indexOf(inputText.toLowerCase()) > -1;
+    if (filterData) {
+      // 获取所有祖先节点并展开
+      const ancestorIds = getAncestorIds(node.id);
+      ancestorIds.forEach((ancestorId) => {
+        if (!expandedKeys.value.includes(ancestorId)) {
+          expandedKeys.value.push(ancestorId);
+        }
+      });
+    }
+    return filterData;
+  }
+};
+
+// 展开/收起节点
+const expandTreeNode = (expandKeys) => {
+  expandedKeys.value = expandKeys;
+};
+
+// 获取所有子节点的ID（支持搜索过滤）
+const getAllChildIds = (tree, filterText = "") => {
+  const ids = [];
+
+  // 收集指定节点下的所有叶子节点ID
+  const collectLeafIds = (nodes) => {
+    nodes.forEach((node) => {
+      if (node.children && node.children.length > 0) {
+        collectLeafIds(node.children);
+      } else if (!String(node.id).includes("dept_id_")) {
+        ids.push(node.id);
+      }
+    });
+  };
+
+  const traverse = (nodes) => {
+    nodes.forEach((node) => {
+      // 检查节点是否匹配搜索条件
+      const matchFilter =
+        !filterText ||
+        node.name.toLowerCase().indexOf(filterText.toLowerCase()) > -1;
+
+      if (matchFilter) {
+        // 如果节点匹配，收集该节点下所有叶子节点
+        if (node.children && node.children.length > 0) {
+          collectLeafIds(node.children);
+        } else if (!String(node.id).includes("dept_id_")) {
+          ids.push(node.id);
+        }
+      } else if (node.children && node.children.length > 0) {
+        // 如果不匹配但有子节点，继续在子节点中搜索
+        traverse(node.children);
+      }
+    });
+  };
+
+  traverse(tree);
+  return [...new Set(ids)]; // 去重
+};
+
+// 全选
+const handleSelectAll = () => {
+  if (!props.multiple) return;
+  const currentSelected = Array.isArray(props.modelValue)
+    ? props.modelValue
+    : [];
+  const filterIds = getAllChildIds(authOptions.value, searchText.value);
+
+  if (searchText.value) {
+    // 有搜索条件：保留原有选中项，添加搜索结果
+    const newIds = [...new Set([...currentSelected, ...filterIds])];
+    onUpdate(newIds);
+  } else {
+    // 无搜索条件：全选所有
+    onUpdate(filterIds);
+  }
+};
+
+// 反选
+const handleInvertSelect = () => {
+  if (!props.multiple) return;
+  const currentSelected = Array.isArray(props.modelValue)
+    ? props.modelValue
+    : [];
+  const filterIds = getAllChildIds(authOptions.value, searchText.value);
+
+  if (searchText.value) {
+    // 有搜索条件：只在搜索结果范围内反选，保留其他已选项
+    const otherSelected = currentSelected.filter(
+      (id) => !filterIds.includes(id)
+    );
+    const invertedInFilter = filterIds.filter(
+      (id) => !currentSelected.includes(id)
+    );
+    onUpdate([...otherSelected, ...invertedInFilter]);
+  } else {
+    // 无搜索条件：全局反选
+    const invertedIds = filterIds.filter((id) => !currentSelected.includes(id));
+    onUpdate(invertedIds);
+  }
+};
+
+// 清空
+const handleClear = () => {
+  if (!props.multiple) return;
+  onUpdate([]);
 };
 
 // 获取后台归属人列表
 const getAuthList = async () => {
   const res = await advertCommonApi.getAuthOptionsApi();
   if (res.code == 200) {
+    // 添加 parent_id 字段
+    const processedData = addParentId(res.data);
+
     if (props.multiple) {
-      authOptions.value = res.data;
+      authOptions.value = processedData;
     } else {
-      const data = await handleData(res.data);
+      const data = await handleData(processedData);
       authOptions.value = data;
     }
   }
 };
 
+// 添加 parent_id 字段到树形数据
+const addParentId = (data, parentId = null) => {
+  return data.map((item) => {
+    const newItem = {
+      ...item,
+      parent_id: parentId,
+    };
+    if (item.children && item.children.length > 0) {
+      newItem.children = addParentId(item.children, item.id);
+    }
+    return newItem;
+  });
+};
+
 // 处理数据
 const handleData = (data) => {
   return new Promise((resolve) => {
     for (const item of data) {
-      if (item.id.includes("dept_id_")) {
+      if (String(item.id).includes("dept_id_")) {
         item.disabled = true;
       }
       if (item.children) {
@@ -72,3 +256,23 @@ onMounted(() => {
   getAuthList();
 });
 </script>
+
+<style scoped>
+.auth-select-wrapper {
+  width: 100%;
+}
+
+.tree-select-header {
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--color-border-2);
+}
+
+.tree-select-header :deep(.arco-btn-text) {
+  color: var(--color-text-2);
+}
+
+.tree-select-header :deep(.arco-btn-text:hover) {
+  color: rgb(var(--primary-6));
+  background-color: transparent;
+}
+</style>

src/style/global.less

@@ -27,7 +27,7 @@ body {
 
 .arco-tree-node-disabled .arco-tree-node-title,
 .arco-tree-node-disabled .arco-tree-node-title:hover {
-  color: rgb(var(--primary-6));
+  color: rgb(var(--color-text-4));
   font-weight: bold;
 }
 

src/views/v1/advert/mediaCost/edit.vue

@@ -7,14 +7,23 @@
     :mask-closable="false"
     :ok-loading="loading"
     @cancel="close"
-    @before-ok="submit">
+    @before-ok="submit"
+  >
     <!-- 表单信息 start -->
-    <a-form ref="formRef" :model="formData" :rules="rules" :auto-label-width="true">
+    <a-form
+      ref="formRef"
+      :model="formData"
+      :rules="rules"
+      :auto-label-width="true"
+    >
       <a-form-item label="投放游戏" field="game_id">
         <game-select v-model="formData.game_id" />
       </a-form-item>
       <a-form-item label="广告账号ID" field="advertiser_id">
-        <a-input v-model="formData.advertiser_id" placeholder="请输入广告账号ID" />
+        <a-input
+          v-model="formData.advertiser_id"
+          placeholder="请输入广告账号ID"
+        />
       </a-form-item>
       <a-form-item label="广告位ID" field="site_id">
         <a-input v-model="formData.site_id" placeholder="请输入广告位ID" />
@@ -26,12 +35,16 @@
           mode="date"
           placeholder="请选择消耗日期"
           style="width: 100%"
-          :disabled-date="disabledDate" />
+          :disabled-date="disabledDate"
+        />
+      </a-form-item>
+      <a-form-item label="原始金额" field="ori_money">
+        <a-input v-model="formData.ori_money" placeholder="请输入原始金额" />
       </a-form-item>
-
       <a-form-item label="消耗金额" field="money">
         <a-input v-model="formData.money" placeholder="请输入消耗金额" />
       </a-form-item>
+
       <a-form-item label="备注" field="memo">
         <a-input v-model="formData.memo" placeholder="请输入备注" />
       </a-form-item>
@@ -41,115 +54,117 @@
 </template>
 
 <script setup>
-import { ref, reactive, computed } from 'vue'
-import tool from '@/utils/tool'
-import { Message, Modal } from '@arco-design/web-vue'
-import api from '../../api/advert/mediaCost'
-import centerCommonApi from '../../api/center/common'
-import GameSelect from '@cps/game-select/index.vue'
+import { ref, reactive, computed } from "vue";
+import tool from "@/utils/tool";
+import { Message, Modal } from "@arco-design/web-vue";
+import api from "../../api/advert/mediaCost";
+import centerCommonApi from "../../api/center/common";
+import GameSelect from "@cps/game-select/index.vue";
 
-const emit = defineEmits(['success'])
+const emit = defineEmits(["success"]);
 // 引用定义
-const visible = ref(false)
-const loading = ref(false)
-const formRef = ref()
-const mode = ref('')
-const gameOptions = ref([])
+const visible = ref(false);
+const loading = ref(false);
+const formRef = ref();
+const mode = ref("");
+const gameOptions = ref([]);
 
 let title = computed(() => {
-  return '媒体消耗' + (mode.value == 'add' ? '-新增' : '-编辑')
-})
+  return "媒体消耗" + (mode.value == "add" ? "-新增" : "-编辑");
+});
 
 // 表单初始值
 const initialFormData = {
   id: null,
-  tdate: '',
+  tdate: "",
   game_id: null,
   site_id: null,
-  money: '0.00',
-  memo: '',
+  ori_money: "0.00",
+  money: "0.00",
+  memo: "",
   add_type: 1,
-  advertiser_id: '',
-}
+  advertiser_id: "",
+};
 
 // 表单信息
-const formData = reactive({ ...initialFormData })
+const formData = reactive({ ...initialFormData });
 
 // 验证规则
 const rules = {
-  game_id: [{ required: true, message: '投放游戏必需填写' }],
-  site_id: [{ required: true, message: '广告位ID必需填写' }],
-  tdate: [{ required: true, message: '消耗日期必需填写' }],
-  money: [{ required: true, message: '消耗金额必需填写' }],
-}
+  game_id: [{ required: true, message: "投放游戏必需填写" }],
+  site_id: [{ required: true, message: "广告位ID必需填写" }],
+  tdate: [{ required: true, message: "消耗日期必需填写" }],
+  ori_money: [{ required: true, message: "原始金额必需填写" }],
+  money: [{ required: true, message: "消耗金额必需填写" }],
+};
 
 // 禁用未来日期
 const disabledDate = (current) => {
-  return current && current > new Date().setHours(23, 59, 59, 999)
-}
+  return current && current > new Date().setHours(23, 59, 59, 999);
+};
 
 // 打开弹框
-const open = async (type = 'add') => {
-  mode.value = type
+const open = async (type = "add") => {
+  mode.value = type;
   // 重置表单数据
-  Object.assign(formData, initialFormData)
-  formRef.value.clearValidate()
-  visible.value = true
-  await initPage()
-}
+  Object.assign(formData, initialFormData);
+  formRef.value.clearValidate();
+  visible.value = true;
+  await initPage();
+};
 
 // 初始化页面数据
 const initPage = async () => {
-  await getGameOptions()
-}
+  await getGameOptions();
+};
 
 // 获取投放游戏选项
 const getGameOptions = async () => {
-  const res = await centerCommonApi.getGameOptionsApi()
+  const res = await centerCommonApi.getGameOptionsApi();
   if (res.code === 200) {
-    gameOptions.value = res.data
+    gameOptions.value = res.data;
   }
-}
+};
 
 // 设置数据
 const setFormData = async (data) => {
   for (const key in formData) {
     if (data[key] != null && data[key] != undefined) {
-      formData[key] = data[key]
+      formData[key] = data[key];
     }
   }
-}
+};
 
 // 数据保存
 const submit = async (done) => {
-  const validate = await formRef.value?.validate()
+  const validate = await formRef.value?.validate();
   if (!validate) {
-    loading.value = true
-    let data = { ...formData }
-    let result = {}
-    if (mode.value === 'add') {
+    loading.value = true;
+    let data = { ...formData };
+    let result = {};
+    if (mode.value === "add") {
       // 添加数据
-      data.id = undefined
-      result = await api.save({ ...data, add_type: 1 })
+      data.id = undefined;
+      result = await api.save({ ...data, add_type: 1 });
     } else {
       // 修改数据
-      result = await api.update(data.id, { ...data, add_type: 1 })
+      result = await api.update(data.id, { ...data, add_type: 1 });
     }
     if (result.code === 200) {
-      Message.success('操作成功')
-      emit('success')
-      done(true)
+      Message.success("操作成功");
+      emit("success");
+      done(true);
     }
     // 防止连续点击提交
     setTimeout(() => {
-      loading.value = false
-    }, 500)
+      loading.value = false;
+    }, 500);
   }
-  done(false)
-}
+  done(false);
+};
 
 // 关闭弹窗
-const close = () => (visible.value = false)
+const close = () => (visible.value = false);
 
-defineExpose({ open, setFormData })
+defineExpose({ open, setFormData });
 </script>

src/views/v1/advert/mediaCost/index.vue

@@ -1,11 +1,21 @@
 <template>
   <div class="ma-content-block">
-    <sa-table ref="crudRef" :options="options" :columns="columns" :searchForm="searchForm">
+    <sa-table
+      ref="crudRef"
+      :options="options"
+      :columns="columns"
+      :searchForm="searchForm"
+    >
       <!-- 搜索区 tableSearch -->
       <template #tableSearch>
         <a-col :sm="6" :xs="24">
           <a-form-item label="结算日期" field="tdate">
-            <a-range-picker v-model="searchForm.tdate" :show-time="false" mode="date" class="w-full" />
+            <a-range-picker
+              v-model="searchForm.tdate"
+              :show-time="false"
+              mode="date"
+              class="w-full"
+            />
           </a-form-item>
         </a-col>
         <a-col :sm="6" :xs="24">
@@ -15,28 +25,46 @@
         </a-col>
         <a-col :sm="6" :xs="24">
           <a-form-item label="媒体类型" field="media_id">
-            <a-select v-model="searchForm.media_id" placeholder="请选择媒体类型" allow-clear allow-search>
+            <a-select
+              v-model="searchForm.media_id"
+              placeholder="请选择媒体类型"
+              allow-clear
+              allow-search
+            >
               <a-option
                 v-for="item in mediaOptions"
                 :key="item.id"
                 :value="item.id"
-                :label="`${item.id}:${item.name}`" />
+                :label="`${item.id}:${item.name}`"
+              />
             </a-select>
           </a-form-item>
         </a-col>
         <a-col :sm="6" :xs="24">
           <a-form-item label="广告账号ID" field="advertiser_id">
-            <a-input v-model="searchForm.advertiser_id" placeholder="请输入广告账号ID" allow-clear />
+            <a-input
+              v-model="searchForm.advertiser_id"
+              placeholder="请输入广告账号ID"
+              allow-clear
+            />
           </a-form-item>
         </a-col>
         <a-col :sm="6" :xs="24">
           <a-form-item label="渠道ID" field="agent_id">
-            <a-input v-model="searchForm.agent_id" placeholder="请输入渠道ID" allow-clear />
+            <a-input
+              v-model="searchForm.agent_id"
+              placeholder="请输入渠道ID"
+              allow-clear
+            />
           </a-form-item>
         </a-col>
         <a-col :sm="6" :xs="24">
           <a-form-item label="广告位ID" field="site_id">
-            <a-input v-model="searchForm.site_id" placeholder="请输入广告位ID" allow-clear />
+            <a-input
+              v-model="searchForm.site_id"
+              placeholder="请输入广告位ID"
+              allow-clear
+            />
           </a-form-item>
         </a-col>
         <a-col :sm="6" :xs="24">
@@ -46,17 +74,30 @@
         </a-col>
         <a-col :sm="6" :xs="24">
           <a-form-item label="录入方式" field="add_type">
-            <sa-select v-model="searchForm.add_type" dict="add_type" placeholder="请选择录入方式" allow-clear />
+            <sa-select
+              v-model="searchForm.add_type"
+              dict="add_type"
+              placeholder="请选择录入方式"
+              allow-clear
+            />
           </a-form-item>
         </a-col>
         <a-col :sm="6" :xs="24">
           <a-form-item label="备注" field="memo">
-            <a-input v-model="searchForm.memo" placeholder="请输入备注" allow-clear />
+            <a-input
+              v-model="searchForm.memo"
+              placeholder="请输入备注"
+              allow-clear
+            />
           </a-form-item>
         </a-col>
         <a-col :sm="6" :xs="24">
           <a-form-item label="录入时间" field="create_time">
-            <a-range-picker v-model="searchForm.create_time" :show-time="true" mode="date" />
+            <a-range-picker
+              v-model="searchForm.create_time"
+              :show-time="true"
+              mode="date"
+            />
           </a-form-item>
         </a-col>
       </template>
@@ -70,32 +111,32 @@
 </template>
 
 <script setup>
-import { onMounted, ref, reactive } from 'vue'
-import { Message } from '@arco-design/web-vue'
-import EditForm from './edit.vue'
-import api from '../../api/advert/mediaCost'
-import commonAdvertApi from '../../api/advert/common'
-import GameSelect from '@/components/game-select/index.vue'
-import AuthSelect from '@/components/auth-select/index.vue'
+import { onMounted, ref, reactive } from "vue";
+import { Message } from "@arco-design/web-vue";
+import EditForm from "./edit.vue";
+import api from "../../api/advert/mediaCost";
+import commonAdvertApi from "../../api/advert/common";
+import GameSelect from "@/components/game-select/index.vue";
+import AuthSelect from "@/components/auth-select/index.vue";
 
 // 引用定义
-const crudRef = ref()
-const editRef = ref()
-const mediaOptions = ref([])
-const authOptions = ref([])
+const crudRef = ref();
+const editRef = ref();
+const mediaOptions = ref([]);
+const authOptions = ref([]);
 
 // 搜索表单
 const searchForm = ref({
   tdate: [],
-  game_id: '',
-  media_id: '',
-  agent_id: '',
-  site_id: '',
-  auth_id: '',
-  add_type: '',
-  memo: '',
+  game_id: "",
+  media_id: "",
+  agent_id: "",
+  site_id: "",
+  auth_id: "",
+  add_type: "",
+  memo: "",
   create_time: [],
-})
+});
 
 // SaTable 基础配置
 const options = reactive({
@@ -104,89 +145,90 @@ const options = reactive({
 
   add: {
     show: true,
-    auth: ['/v1/advert/MediaCost/save'],
+    auth: ["/v1/advert/MediaCost/save"],
     func: async () => {
-      editRef.value?.open()
+      editRef.value?.open();
     },
   },
   edit: {
     show: true,
-    auth: ['/v1/advert/MediaCost/update'],
+    auth: ["/v1/advert/MediaCost/update"],
     func: async (record) => {
-      editRef.value?.open('edit')
-      editRef.value?.setFormData(record)
+      editRef.value?.open("edit");
+      editRef.value?.setFormData(record);
     },
   },
   delete: {
     show: true,
-    auth: ['/v1/advert/MediaCost/destroy'],
+    auth: ["/v1/advert/MediaCost/destroy"],
     func: async (params) => {
-      const resp = await api.destroy(params)
+      const resp = await api.destroy(params);
       if (resp.code === 200) {
-        Message.success(`删除成功！`)
-        crudRef.value?.refresh()
+        Message.success(`删除成功！`);
+        crudRef.value?.refresh();
       }
     },
   },
-})
+});
 
 // SaTable 列配置
 const columns = reactive([
-  { title: '结算日期', dataIndex: 'tdate', width: 120 },
-  { title: '媒体类型', dataIndex: 'media_name', width: 120 },
-  { title: '广告账号ID', dataIndex: 'advertiser_id', width: 120 },
-  { title: '广告位ID', dataIndex: 'site_id', width: 120 },
-  { title: '广告位名称', dataIndex: 'site_name', width: 120 },
-  { title: '渠道ID', dataIndex: 'agent_id', width: 120 },
-  { title: '游戏', dataIndex: 'game_name', width: 120 },
-  { title: '原始金额', dataIndex: 'ori_money', width: 120 },
-  { title: '结算金额', dataIndex: 'money', width: 120 },
-  { title: '录入时间', dataIndex: 'create_time', width: 120 },
+  { title: "结算日期", dataIndex: "tdate", width: 120 },
+  { title: "媒体类型", dataIndex: "media_name", width: 120 },
+  { title: "广告账号ID", dataIndex: "advertiser_id", width: 120 },
+  { title: "渠道ID", dataIndex: "agent_id", width: 120 },
+  { title: "广告位ID", dataIndex: "site_id", width: 120 },
+  { title: "广告位名称", dataIndex: "site_name", width: 120 },
+
+  { title: "游戏", dataIndex: "game_name", width: 120 },
+  { title: "原始金额", dataIndex: "ori_money", width: 120 },
+  { title: "结算金额", dataIndex: "money", width: 120 },
+  { title: "录入时间", dataIndex: "create_time", width: 120 },
   {
-    title: '录入方式',
-    dataIndex: 'add_type',
-    type: 'dict',
-    dict: 'add_type',
+    title: "录入方式",
+    dataIndex: "add_type",
+    type: "dict",
+    dict: "add_type",
     width: 120,
   },
-  { title: '备注', dataIndex: 'memo', width: 120 },
-  { title: '负责人', dataIndex: 'auth_name', width: 120 },
-])
+  { title: "备注", dataIndex: "memo", width: 120 },
+  { title: "负责人", dataIndex: "auth_name", width: 120 },
+]);
 
 // 页面数据初始化
 const initPage = async () => {
-  await getMediaOptions()
-  await getAuthOptions()
-}
+  await getMediaOptions();
+  await getAuthOptions();
+};
 
 // 获取媒体类型
 const getMediaOptions = async () => {
-  const resp = await commonAdvertApi.getMediaOptionsApi()
+  const resp = await commonAdvertApi.getMediaOptionsApi();
   if (resp.code === 200) {
-    mediaOptions.value = resp.data
+    mediaOptions.value = resp.data;
   }
-}
+};
 
 // 获取负责人
 const getAuthOptions = async () => {
-  const resp = await commonAdvertApi.getAuthOptionsApi()
+  const resp = await commonAdvertApi.getAuthOptionsApi();
   if (resp.code === 200) {
-    authOptions.value = resp.data
+    authOptions.value = resp.data;
   }
-}
+};
 
 // SaTable 数据请求
 const refresh = async () => {
-  crudRef.value?.refresh()
-}
+  crudRef.value?.refresh();
+};
 
 // 页面加载完成执行
 onMounted(async () => {
-  initPage()
-  refresh()
-})
+  initPage();
+  refresh();
+});
 </script>
 
 <script>
-export default { name: 'v1/advert/mediaCost' }
+export default { name: "v1/advert/mediaCost" };
 </script>

src/views/v1/center/gameGroup/index.vue

@@ -1,11 +1,20 @@
 <template>
   <div class="ma-content-block">
-    <sa-table ref="crudRef" :options="options" :columns="columns" :searchForm="searchForm">
+    <sa-table
+      ref="crudRef"
+      :options="options"
+      :columns="columns"
+      :searchForm="searchForm"
+    >
       <!-- 搜索区 tableSearch -->
       <template #tableSearch>
         <a-col :sm="6" :xs="24">
           <a-form-item label="分组名" field="name">
-            <a-input v-model="searchForm.name" placeholder="请输入分组名" allow-clear />
+            <a-input
+              v-model="searchForm.name"
+              placeholder="请输入分组名"
+              allow-clear
+            />
           </a-form-item>
         </a-col>
       </template>
@@ -20,83 +29,84 @@
 </template>
 
 <script setup>
-import { onMounted, ref, reactive } from 'vue'
-import { Message } from '@arco-design/web-vue'
-import EditForm from './edit.vue'
-import ViewForm from './view.vue'
-import api from '../../api/center/gameGroup'
+import { onMounted, ref, reactive, h } from "vue";
+import { Message, Space, Tag } from "@arco-design/web-vue";
+import EditForm from "./edit.vue";
+import ViewForm from "./view.vue";
+import api from "../../api/center/gameGroup";
 
 // 引用定义
-const crudRef = ref()
-const editRef = ref()
-const viewRef = ref()
+const crudRef = ref();
+const editRef = ref();
+const viewRef = ref();
 
 // 搜索表单
 const searchForm = ref({
-  name: '',
-})
+  name: "",
+});
 
 // SaTable 基础配置
 const options = reactive({
   api: api.getPageList,
+  columnAlign: "left",
   rowSelection: { showCheckedAll: true },
   showSort: false,
   view: {
     show: true,
-    auth: ['/v1/center/GameGroup/view'],
+    auth: ["/v1/center/GameGroup/view"],
     func: async (record) => {
-      viewRef.value?.open(record)
+      viewRef.value?.open(record);
     },
   },
   add: {
     show: true,
-    auth: ['/v1/center/GameGroup/save'],
+    auth: ["/v1/center/GameGroup/save"],
     func: async () => {
-      editRef.value?.open()
+      editRef.value?.open();
     },
   },
   edit: {
     show: true,
-    auth: ['/v1/center/GameGroup/update'],
+    auth: ["/v1/center/GameGroup/update"],
     func: async (record) => {
-      editRef.value?.open('edit')
-      editRef.value?.setFormData(record)
+      editRef.value?.open("edit");
+      editRef.value?.setFormData(record);
     },
   },
   delete: {
     show: true,
-    auth: ['/v1/center/GameGroup/destroy'],
+    auth: ["/v1/center/GameGroup/destroy"],
     func: async (params) => {
-      const resp = await api.destroy(params)
+      const resp = await api.destroy(params);
       if (resp.code === 200) {
-        Message.success(`删除成功！`)
-        crudRef.value?.refresh()
+        Message.success(`删除成功！`);
+        crudRef.value?.refresh();
       }
     },
   },
-})
+});
 
 // SaTable 列配置
 const columns = reactive([
-  { title: '排序', dataIndex: 'sort', width: 20 },
-  { title: '分组名', dataIndex: 'name', width: 180 },
-])
+  { title: "分组名", dataIndex: "name", width: 180 },
+  { title: "排序", dataIndex: "sort", width: 20 },
+]);
 
 // 页面数据初始化
-const initPage = async () => {}
+const initPage = async () => {};
 
 // SaTable 数据请求
 const refresh = async () => {
-  crudRef.value?.refresh()
-}
+  crudRef.value?.refresh();
+};
 
 // 页面加载完成执行
 onMounted(async () => {
-  initPage()
-  refresh()
-})
+  initPage();
+  refresh();
+});
 </script>
 
 <script>
-export default { name: 'v1/center/gameGroup' }
+export default { name: "v1/center/gameGroup" };
 </script>

src/views/v1/gameLog/sdkLoginLog/index.vue

@@ -147,7 +147,7 @@ const columns = reactive([
   { title: "用户名", dataIndex: "user_name", width: 100 },
   { title: "游戏", dataIndex: "game_name", width: 120 },
   { title: "渠道ID", dataIndex: "agent_id", width: 80 },
-  { title: "媒体ID", dataIndex: "media_id", width: 80 },
+  // { title: "媒体ID", dataIndex: "media_id", width: 80 },
   { title: "广告位ID", dataIndex: "site_id", width: 80 },
   { title: "登录IP", dataIndex: "ip", width: 120 },
   { title: "登录IMEI/IDFA", dataIndex: "imei", width: 120 },