feat: 修改首页统计及其他优化

src/components/StatisticsCard.vue

@@ -0,0 +1,49 @@
+<template>
+  <view :class="`bg-${color}-500 rounded-lg p-3 text-white`">
+    <view class="text-sm">{{ title }}</view>
+    <view class="flex justify-between items-center">
+      <view class="text-lg font-bold mt-1">
+        <wd-count-to
+          :start-val="0"
+          :end-val="value"
+          :duration="duration"
+          :decimals="decimals"
+          :suffix="suffix"
+          color="#ffffff"
+        ></wd-count-to>
+      </view>
+      <view class="text-white">
+        <wd-icon name="arrow-right" size="18px"></wd-icon>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script lang="ts" setup>
+defineProps({
+  title: {
+    type: String,
+    required: true,
+  },
+  value: {
+    type: Number,
+    required: true,
+  },
+  suffix: {
+    type: String,
+    default: '',
+  },
+  color: {
+    type: String,
+    default: 'blue',
+  },
+  duration: {
+    type: Number,
+    default: 2000,
+  },
+  decimals: {
+    type: Number,
+    default: 0,
+  },
+})
+</script>

src/pages/about/index.vue

@@ -24,7 +24,7 @@
         <wd-cell-group>
           <wd-cell title="官方网站" value="www.dznjj.gov.cn" is-link />
           <wd-cell title="联系电话" value="0818-12345678" is-link />
-          <wd-cell title="关于萨莫尔" is-link />
+          <!-- <wd-cell title="关于萨莫尔" is-link /> -->
         </wd-cell-group>
       </view>
     </view>

src/pages/index/index.vue

@@ -15,14 +15,71 @@
     <!-- 顶部标题 -->
     <view class="text-xl font-bold text-center py-3 bg-white">达州农机优惠券</view>
 
-    <wd-swiper
+    <!-- 数据统计卡片 -->
+    <view class="grid grid-cols-2 gap-3 mb-4">
+      <!-- 总销售额 -->
+      <statistics-card
+        title="总销售额"
+        :value="statisticsData[0]"
+        suffix="万元"
+        color="blue"
+        :duration="2000"
+      />
+
+      <!-- 总订单数 -->
+      <statistics-card
+        title="总订单数"
+        :value="statisticsData[1]"
+        suffix="单"
+        color="amber"
+        :duration="4000"
+      />
+
+      <!-- 本季度销售额 -->
+      <statistics-card
+        title="本季度销售额"
+        :value="statisticsData[2]"
+        suffix="万元"
+        color="emerald"
+        :duration="4000"
+      />
+
+      <!-- 本季度订单数 -->
+      <statistics-card
+        title="本季度订单数"
+        :value="statisticsData[3]"
+        suffix="单"
+        color="indigo"
+        :duration="4000"
+      />
+
+      <!-- 本月销售额 -->
+      <statistics-card
+        title="本月销售额"
+        :value="statisticsData[4]"
+        suffix="万元"
+        color="purple"
+        :duration="4000"
+      />
+
+      <!-- 本月订单数 -->
+      <statistics-card
+        title="本月订单数"
+        :value="statisticsData[5]"
+        suffix="单"
+        color="rose"
+        :duration="2000"
+      />
+    </view>
+
+    <!-- <wd-swiper
       :list="swiperList"
       autoplay
       v-model:current="current"
       :indicator="{ type: 'dots-bar' } as any"
       @click="handleSwiperClick"
       @change="handleSwiperChange"
-    ></wd-swiper>
+    ></wd-swiper> -->
 
     <view class="pb-4">
       <!-- 网点地址标题 -->
@@ -91,18 +148,23 @@
 </template>
 
 <script lang="ts" setup>
-import banner1 from '@/static/banner1.png'
+// import banner1 from '@/static/banner1.png'
 import { ref } from 'vue'
 import { useUserStore } from '@/store/user'
 import { useAppStore } from '@/store/app'
+import { useDictStore } from '@/store/dict'
 import { useMessage } from 'wot-design-uni'
 import dayjs from 'dayjs'
+import StatisticsCard from '@/components/StatisticsCard.vue'
 
 const userStore = useUserStore()
 const appStore = useAppStore()
+const dictStore = useDictStore()
 const message = useMessage()
-const current = ref<number>(0)
-const swiperList = ref([banner1, banner1, banner1])
+// const current = ref<number>(0)
+// const swiperList = ref([banner1, banner1, banner1])
+
+const statisticsData = ref({})
 
 // 获取安全区域距离
 const { safeAreaInsets } = uni.getWindowInfo()
@@ -221,9 +283,19 @@ const showCompleteDialog = () => {
   }
 }
 
+// 获取统计数据
+const getStatisticsData = async () => {
+  const configList = await dictStore.getConfigList('mini_program_index_sumary')
+  if (configList.length > 0) {
+    // 将字符串分割后转换为数字类型
+    statisticsData.value = configList[0].substance.split(',').map((item) => Number(item))
+  }
+}
+
 onShow(() => {
   getUserList()
   showCompleteDialog()
+  getStatisticsData()
 })
 </script>
 

src/service/config/index.ts

@@ -0,0 +1,12 @@
+import { http } from '@/utils/http'
+import type { DictEntity } from '@/types/dict'
+import type { ListType, ListResponseType } from '@/types/list'
+import { parseQueryValues } from '@/utils'
+
+/** 配置列表 */
+export const getConfigListApi = (params: Partial<DictEntity>, page: Partial<ListType>) => {
+  return http.get<ListResponseType<DictEntity>>('/api/query/list?pagevalue=73', {
+    ...page,
+    ...parseQueryValues(params),
+  })
+}

src/store/dict.ts

@@ -0,0 +1,28 @@
+import { defineStore } from 'pinia'
+import { getConfigListApi } from '@/service/config'
+import { until } from '@vueuse/core'
+
+export const useDictStore = defineStore(
+  'dict',
+  () => {
+    // 获取配置列表
+    const getConfigList = async (groupname: string) => {
+      const { data: configList, loading } = useRequest(
+        () => getConfigListApi({ groupname }, { pageindex: 1, rows: 999 }),
+        {
+          immediate: true,
+        },
+      )
+
+      await until(loading).toBe(false)
+      return configList.value.Data
+    }
+
+    return {
+      getConfigList,
+    }
+  },
+  {
+    persist: true,
+  },
+)

src/types/dict.ts

@@ -0,0 +1,54 @@
+/** 系统配置表 */
+// CREATE TABLE `configuration` (
+//   `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '配置id(禁止插入)',
+//   `baseid` int(11) NOT NULL COMMENT '上级',
+//   `groupname` varchar(255) DEFAULT NULL COMMENT '组名称',
+//   `title` varchar(255) NOT NULL COMMENT '配置名称',
+//   `substance` longtext NOT NULL COMMENT '配置值',
+//   `available` tinyint(2) NOT NULL COMMENT '0不可用，1可用',
+//   `describes` varchar(255) DEFAULT NULL COMMENT '描述',
+//   `ispublic` tinyint(2) NOT NULL COMMENT '是否前端可用',
+//   `option1` varchar(255) DEFAULT NULL COMMENT '预留参数1',
+//   `option2` varchar(255) DEFAULT NULL COMMENT '预留参数2',
+//   `option3` varchar(255) DEFAULT NULL COMMENT '预留参数3',
+//   `option4` varchar(255) DEFAULT NULL COMMENT '预留参数4',
+//   `option5` varchar(255) DEFAULT NULL COMMENT '预留参数5',
+//   `option6` varchar(255) DEFAULT NULL COMMENT '预留参数6',
+//   `ranknum` int(11) DEFAULT NULL COMMENT '排序值',
+//   PRIMARY KEY (`id`)
+// ) ENGINE=InnoDB AUTO_INCREMENT=120 DEFAULT CHARSET=utf8mb4 COMMENT='系统配置表';
+
+interface DictEntity {
+  /** 配置id(禁止插入) */
+  id: number
+  /** 上级 */
+  baseid: number
+  /** 组名称 */
+  groupname: string
+  /** 配置名称 */
+  title: string
+  /** 配置值 */
+  substance: string
+  /** 0不可用，1可用 */
+  available: number
+  /** 描述 */
+  describes: string
+  /** 是否前端可用 */
+  ispublic: number
+  /** 预留参数1 */
+  option1: string
+  /** 预留参数2 */
+  option2: string
+  /** 预留参数3 */
+  option3: string
+  /** 预留参数4 */
+  option4: string
+  /** 预留参数5 */
+  option5: string
+  /** 预留参数6 */
+  option6: string
+  /** 排序值 */
+  ranknum: number
+}
+
+export type { DictEntity }