fix:框架搭建及功能完善。

2024-06-03 17:00:27 +08:00
parent b3fe699735
commit 2b281fe098
37 changed files with 2211 additions and 261 deletions
--- a/src/pages/statistic/index.vue
+++ b/src/pages/statistic/index.vue
@@ -0,0 +1,137 @@
+<template>
+  <view class="work-container">
+
+    <!-- 宫格组件 -->
+    <uni-section title="账单统计分析" v-show="auth.hasPermi('invest:accountAnalysis:list')"  type="line"></uni-section>
+    <view class="grid-body">
+      <uni-grid :column="4" :showBorder="false" >
+        <uni-grid-item v-for="(item, index) in billGridList" :key="index" v-show="auth.hasPermi(item.permission)" @click="navigateTo(item.path)">
+        <view class="grid-item-box">
+            <uni-icons :type="item.icon" size="30"></uni-icons>
+            <text class="text">{{ item.text }}</text>
+          </view>
+      </uni-grid-item>
+      </uni-grid>
+    </view>
+     <!-- 宫格组件 -->
+     <uni-section title="记账统计分析" v-show="auth.hasPermi('invest:accountsBalance:list')"  type="line"></uni-section>
+    <view class="grid-body">
+      <uni-grid :column="4" :showBorder="false" >
+        <uni-grid-item v-for="(item, index) in accountGridList" :key="index" v-show="auth.hasPermi(item.permission)" @click="navigateTo(item.path)">
+        <view class="grid-item-box">
+            <uni-icons :type="item.icon" size="30"></uni-icons>
+            <text class="text">{{ item.text }}</text>
+          </view>
+      </uni-grid-item>
+      </uni-grid>
+    </view>
+  </view>
+</template>
+
+<script setup>
+	import { ref } from "vue";
+  import auth from "@/plugins/auth"; // 建议使用auth进行鉴权操作
+  const billGridList=ref([
+        { path: '/pages/page1/page1', text: '账户总览', icon: 'person-filled', permission: 'invest:accountAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '收益统计分析', icon: 'arrow-down', permission: 'invest:investAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '期货统计分析', icon: 'down', permission: 'invest:futuresAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '股票统计分析', icon: 'left', permission: 'invest:stocksAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '网贷待还统计', icon: 'cloud-upload', permission: 'invest:onlineLendAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '网贷已还统计', icon: 'download', permission: 'invest:onlineLendSettledAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '信用卡账单统计', icon: 'map', permission: 'invest:creditAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '信用卡分期待还', icon: 'map-filled', permission: 'invest:creditInstallment:list'  },
+        { path: '/pages/page1/page1', text: '信用卡分期已还', icon: 'map-pin-ellipse', permission: 'invest:creditInstallmentSettledAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '征信查询统计', icon: 'search', permission: 'invest:creditRecordAnalysis:list'  }
+      ])
+      const accountGridList=ref([
+        { path: '/pages/page1/page1', text: '记账账户统计', icon: 'staff-filled' , permission: 'invest:accountsBalance:list' },
+        { path: '/pages/page1/page1', text: 'POS机刷卡统计', icon: 'shop-filled' , permission: 'invest:posAnalysis:list' },
+        { path: '/pages/page1/page1', text: '储蓄卡收支统计', icon: 'wallet-filled', permission: 'invest:accountDealRecord:list'  },
+        { path: '/pages/page1/page1', text: '信用卡收支统计', icon: 'wallet' , permission: 'invest:accountDealRecord:list' },
+        { path: '/pages/page1/page1', text: '投资收益统计', icon: 'arrow-down', permission: 'invest:investDealAnalysis:list'  },
+        { path: '/pages/page1/page1', text: '账户收支统计', icon: 'person', permission: 'invest:accountDealAnalysis:list'  }
+      ])
+
+	function navigateTo(path) {
+    uni.navigateTo({
+        url: path
+      });
+	}
+
+</script>
+
+<style lang="scss">
+  /* #ifndef APP-NVUE */
+  page {
+    display: flex;
+    flex-direction: column;
+    box-sizing: border-box;
+    background-color: #fff;
+    min-height: 100%;
+    height: auto;
+  }
+
+  view {
+    font-size: 20px;
+    line-height: inherit;
+  }
+
+  /* #endif */
+
+  .text {
+    text-align: center;
+    font-size: 22rpx;
+    margin-top: 10rpx;
+  }
+
+  .grid-item-box {
+    flex: 1;
+    /* #ifndef APP-NVUE */
+    display: flex;
+    /* #endif */
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 15px 0;
+  }
+
+  .uni-margin-wrap {
+    width: 690rpx;
+    width: 100%;
+    ;
+  }
+
+  .swiper {
+    height: 300rpx;
+  }
+
+  .swiper-box {
+    height: 150px;
+  }
+
+  .swiper-item {
+    /* #ifndef APP-NVUE */
+    display: flex;
+    /* #endif */
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    color: #fff;
+    height: 300rpx;
+    line-height: 300rpx;
+  }
+
+  @media screen and (min-width: 500px) {
+    .uni-swiper-dot-box {
+      width: 400px;
+      /* #ifndef APP-NVUE */
+      margin: 0 auto;
+      /* #endif */
+      margin-top: 8px;
+    }
+
+    .image {
+      width: 100%;
+    }
+  }
+</style>