diff --git a/src/api/home.js b/src/api/home.js
new file mode 100644
index 0000000..02fda77
--- /dev/null
+++ b/src/api/home.js
@@ -0,0 +1,9 @@
+import request from "@/utils/request";
+
+// /app/research/statistic
+export const getIndexStatistic = () => {
+    return request({
+        url: "/business/statistic",
+        method: "get",
+    });
+};
diff --git a/src/constant/dict.js b/src/constant/dict.js
index 910ce38..2a8e8a1 100644
--- a/src/constant/dict.js
+++ b/src/constant/dict.js
@@ -54,7 +54,7 @@ export const userStatusDict = [
 export const orderTypeDict = [
   {
     value: "1",
-    label: "创新币充值",
+    label: "会员缴费",
     elTagType: "primary",
   },
   {
diff --git a/src/views/components/StatisticsPanel.vue b/src/views/components/StatisticsPanel.vue
new file mode 100644
index 0000000..8ddde6c
--- /dev/null
+++ b/src/views/components/StatisticsPanel.vue
@@ -0,0 +1,106 @@
+<script setup>
+import useSettingsStore from "@/store/modules/settings";
+
+const colors = ["#31b48d", "#38a1f2", "#7538c7", "#3b67a4"];
+const { locale } = useSettingsStore();
+const props = defineProps({
+  //   统计数据列表
+  list: {
+    type: Array,
+    default: () => [],
+  },
+
+});
+</script>
+
+<template>
+  <div class="statistics-panel">
+    <div
+      v-for="(item, index) in list"
+      :style="{
+        backgroundColor: colors[index % colors.length],
+      }"
+      class="statistics-item"
+    >
+      <div class="left">
+        <div class="label">
+          {{ item.label }}
+        </div>
+        <div class="box">
+          <div class="value">
+            <span v-if="item.label !== ''">
+              {{ item.value }} {{ item.unit }}
+            </span>
+            <span v-else>
+
+            </span>
+
+          </div>
+          <div class="unit">
+        </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.statistics-panel {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+
+  .statistics-item {
+    width: 24%;
+    height: 100px;
+    margin-bottom: 20px;
+    border-radius: 5px;
+    background-color: #fff;
+    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
+    padding: 20px;
+    box-sizing: border-box;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 14px;
+    color: #fff;
+    position: relative;
+
+    .left {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+
+      .label {
+        font-size: 16px;
+        //color: #333;
+        //margin-bottom: 10px;
+      }
+
+      .value {
+        font-size: 24px;
+        //color: #333;
+        font-weight: bold;
+        text-align: right;
+      }
+
+      .unit {
+        font-size: 16px;
+        text-align: right;
+        //color: #333;
+      }
+    }
+
+    .icon {
+      position: absolute;
+      top: 10px;
+      right: 10px;
+      font-size: 20px;
+      //color: #333;
+      cursor: pointer;
+    }
+  }
+}
+</style>
diff --git a/src/views/index.vue b/src/views/index.vue
index 2c9eae7..9a2b53e 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,5 +1,83 @@
-<script></script>
+<script setup>
+import StatisticsPanel from "@/views/components/StatisticsPanel.vue";
+import {ref} from "vue";
+import { getIndexStatistic } from "@/api/home";
+
+
+
+const statisticsList = ref([
+  { key: "vipCount",
+    label: "VIP会员数",
+    value: 0,
+    unit: "个",
+  },
+  {
+    key: "vipFeeTotal",
+    label: "会员费总额",
+    value: 0,
+    unit: "元",
+  },
+  {
+    key: "activityFeeTotal",
+    label: "活动费总额",
+    value: 0,
+    unit: "元",
+  },
+  {
+    key: "demandCount",
+    label: "技术交易总数",
+    value: 0,
+    unit: "个",
+  },
+]);
+
+const statisticsList2 = ref([
+  { key: "demandContractAmount",
+    label: "技术交易合同额",
+    value: 0,
+    unit: "万元",
+  },
+  {
+    key: "demandReceivedAmount",
+    label: "技术交易到账额",
+    value: 0,
+    unit: "万元",
+  },
+  {
+    key: "others",
+    label: "",
+    value: 0,
+    unit: "",
+  },
+  {
+    key: "others",
+    label: "",
+    value: 0,
+    unit: "",
+  },
+]);
+
+const loadResearchStatisticsData = () => {
+  getIndexStatistic().then((resp) => {
+
+    const { data } = resp;
+    console.log(data);
+    statisticsList.value.forEach((item) => {
+      item.value = data[item.key] ?? 0;
+    });
+    statisticsList2.value.forEach((item) => {
+      item.value = data[item.key] ?? 0;
+    });
+  });
+};
+
+loadResearchStatisticsData();
+
+</script>
 <template>
-  <div class="app-container"></div>
+  <div class="app-container">
+    <statistics-panel :list="statisticsList" />
+    <statistics-panel :list="statisticsList2" />
+  </div>
 </template>
 <style></style>
diff --git a/src/views/order/invoice/index.vue b/src/views/order/invoice/index.vue
index 0121a7b..0095891 100644
--- a/src/views/order/invoice/index.vue
+++ b/src/views/order/invoice/index.vue
@@ -76,7 +76,7 @@ import { billList, updateDealLog, DealLogDetail } from "@/api/order";
 import { ElMessage } from "element-plus";
 
 const orderTypeDic = {
-  1: "创新币充值",
+  1: "会员缴费",
   2: "活动报名",
 };
 const statusDic = {
diff --git a/src/views/order/order-list/index.vue b/src/views/order/order-list/index.vue
index f2f1659..b7ec994 100644
--- a/src/views/order/order-list/index.vue
+++ b/src/views/order/order-list/index.vue
@@ -191,7 +191,7 @@
           </el-form-item>
           <el-form-item label="订单类型" prop="orderType">
             <el-select v-model="form.orderType">
-              <el-option label="创新币充值" value="1" />
+              <el-option label="会员充值" value="1" />
               <el-option label="活动报名" value="2" />
             </el-select>
           </el-form-item>
@@ -243,7 +243,7 @@ const data = reactive({
   form: {},
 });
 const orderTypeDic = {
-  1: "创新币充值",
+  1: "会员充值",
   2: "活动报名",
 };
 /*** 用户导入参数 */