feat: (dashboard) 企业看板

src/views/dashboard/analysis/enterprise.vue

@@ -0,0 +1,171 @@
+<template>
+  <div class="p-4">
+    <!-- <GrowCard :loading="loading" class="enter-y" /> -->
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary">导出数据</a-button>
+      </template>
+    </BasicTable>
+    <!-- <div class="md:flex enter-y">
+      <div class="md:w-1/2 enter-y">
+        <Card class="w-full">
+          <VisitAnalysisBar :loading="loading" />
+        </Card>
+      </div>
+      <div class="!md:mx-2"></div>
+      <Card class="md:w-1/2 enter-y">
+
+        <VisitAnalysis :loading="loading" />
+      </Card>
+    </div>
+    <div class="md:flex enter-y mt-4">
+      <Card class="md:w-1/2 md:w-full"> </Card>
+    </div> -->
+  </div>
+</template>
+<script lang="ts" setup>
+  import { onMounted, reactive, ref } from 'vue';
+  import { BasicTable, useTable, BasicColumn, FormProps } from '/@/components/Table';
+  // import { useI18n } from '/@/hooks/web/useI18n';
+  // import GrowCard from './components/GrowCard.vue';
+  import {
+    // bulletChatApi,
+    userStaticsApi,
+    bulletChatStaticsApi,
+  } from '../../../api/dashboard/analysis';
+  import { formatToDate } from '/@/utils/dateUtil';
+  import dayjs from 'dayjs';
+
+  const loading = ref(true);
+  // const { t } = useI18n();
+
+  const columns: BasicColumn[] = [
+    {
+      title: '企业名称',
+      dataIndex: 'key1',
+      width: 120,
+    },
+    {
+      title: '房间管理',
+      dataIndex: 'key2',
+      width: 120,
+    },
+    {
+      title: '直播场景名称',
+      dataIndex: 'key3',
+      width: 120,
+    },
+    {
+      title: '主持人',
+      dataIndex: 'key4',
+      width: 120,
+    },
+    {
+      title: '总观看人数',
+      dataIndex: 'key5',
+      width: 120,
+    },
+    {
+      title: '总直播时长',
+      dataIndex: 'key6',
+      width: 120,
+    },
+    {
+      title: '总分享人数',
+      dataIndex: 'key6',
+      width: 120,
+    },
+  ];
+  const searchForm: Partial<FormProps> = {
+    labelWidth: 100,
+    schemas: [
+      {
+        field: 'companyId',
+        label: '请选择企业',
+        component: 'ApiSelect',
+        required: true,
+        componentProps: {
+          // api: ShippingListApi,
+          // resultField: 'list',
+          // labelField: 'name',
+          // valueField: 'id',
+          // immediate: true,
+          // onChange: function (_, opt) {
+          //   // Reflect.set(modalRecord, 'shippingName', opt.label);
+          // },
+          // params: {
+          //   page: 1,
+          //   limit: 1000,
+          // },
+        },
+        colProps: {
+          xl: 5,
+          xxl: 5,
+        },
+      },
+      {
+        field: 'roomId',
+        label: '请选择房间',
+        component: 'ApiSelect',
+        colProps: {
+          xl: 5,
+          xxl: 5,
+        },
+        componentProps: {},
+      },
+      {
+        field: 'sceneId',
+        label: '请选择直播场景',
+        labelWidth: 130,
+        component: 'ApiSelect',
+        colProps: {
+          xl: 5,
+          xxl: 5,
+        },
+        componentProps: {},
+      },
+      {
+        field: 'time',
+        label: '时间段',
+        component: 'RangePicker',
+        colProps: {
+          xl: 5,
+          xxl: 5,
+        },
+        componentProps: {},
+      },
+    ],
+  };
+
+  const today = formatToDate(dayjs(new Date()));
+  const priorDate = formatToDate(dayjs(new Date().setDate(new Date().getDate() - 30)));
+
+  const searchInfo = reactive({
+    liveRoomId: '',
+    limit: 20,
+    page: 1,
+    time: [priorDate, today],
+  });
+
+  const [registerTable] = useTable({
+    title: '房间留言状态',
+    columns: columns,
+    useSearchForm: true,
+    formConfig: searchForm,
+    api: bulletChatStaticsApi,
+    afterFetch: function (data) {
+      console.log('data', data);
+
+      return data;
+    },
+    searchInfo: searchInfo,
+  });
+
+  onMounted(async () => {
+    await userStaticsApi(searchInfo);
+  });
+
+  setTimeout(() => {
+    loading.value = false;
+  }, 1500);
+</script>