From d1448cb0ef10f358bb7bddb4e1ec268515e0b787 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 15 七月 2025 11:46:57 +0800
Subject: [PATCH] 项目初始化
---
pages/index/index.vue | 202 ++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 202 insertions(+), 0 deletions(-)
diff --git a/pages/index/index.vue b/pages/index/index.vue
new file mode 100644
index 0000000..4933918
--- /dev/null
+++ b/pages/index/index.vue
@@ -0,0 +1,202 @@
+<template>
+ <view class="index-content">
+ <Navbar :hideBtn="true" title="棣栭〉" bgColor="#fff" :h5Show="false" :fixed="false"></Navbar>
+ <view class="index-block">
+ <view class="index-block-title">杩愯缁熻</view>
+ <u-row gutter="16">
+ <u-col span="4">
+ <view class="item-tj item-tj-frist">
+ <view style="padding: 16rpx; height: 100%; position: relative;">
+ <view style="display: flex; color: white;">
+ <u-icon name="photo" color="#fff"></u-icon>
+ <text>鍦ㄧ嚎浜烘暟</text>
+ </view>
+ <view style="position: absolute; bottom: 48rpx; right: 16rpx;">
+ <u-count-to :startVal="0" :endVal="149" :duration="1500" color="#fff" separator=","></u-count-to>
+ </view>
+ </view>
+ </view>
+ </u-col>
+ <u-col span="4">
+ <view class="item-tj item-tj-second">
+ <view style="padding: 16rpx; height: 100%; position: relative;">
+ <view style="display: flex; color: white;">
+ <u-icon name="photo" color="#fff"></u-icon>
+ <text>浠婃棩鏂板</text>
+ </view>
+ <view style="position: absolute; bottom: 48rpx; right: 16rpx;">
+ <u-count-to :startVal="1" :endVal="2349" :duration="1500" color="#fff" separator=","></u-count-to>
+ </view>
+ </view>
+ </view>
+ </u-col>
+ <u-col span="4">
+ <view class="item-tj item-tj-thrid">
+ <view style="padding: 16rpx; height: 100%; position: relative;">
+ <view style="display: flex; color: white;">
+ <u-icon name="photo" color="#fff"></u-icon>
+ <text>鎬讳汉鏁�</text>
+ </view>
+ <view style="position: absolute; bottom: 48rpx; right: 16rpx;">
+ <u-count-to :startVal="1" :endVal="1249350" :duration="1500" color="#fff" separator=","></u-count-to>
+ </view>
+ </view>
+ </view>
+ </u-col>
+ </u-row>
+ </view>
+ <view class="index-block">
+ <view class="index-block-title">杩�7澶╄闂噺缁熻</view>
+ <view>
+ <qiun-data-charts type="line" canvasId="finance_a" :canvas2d="isCanvas2d" :resshow="delayload"
+ :opts="{xAxis:{itemCount:12,disableGrid:true},yAxis:{disableGrid:true,data:[{disabled:true}]}}"
+ :chartData="historyData" />
+ </view>
+ <view class="index-block-title">璁块棶閲忕粺璁�</view>
+ <view>
+ <qiun-data-charts type="bar" canvasId="finance_b" :canvas2d="isCanvas2d" :resshow="delayload"
+ :opts="{xAxis:{disabled: true,disableGrid:true},extra:{bar:{barBorderCircle:true,width:20}},legend:{show:false}}"
+ :chartData="historyData" />
+ </view>
+ </view>
+ <view class="index-block">
+ <view class="index-block-title">鏁版嵁鎬昏</view>
+ <view class="detail_list">
+ <view v-for="(item,index) in detail_list" :key="index" class="detail_item">
+ <view>
+ <view class="font-middle">{{item.date}}</view>
+ <view class="font-small">{{item.time}}</view>
+ </view>
+ <view class="icon"><li :class="['iconfont',item.type == 'income'?'icon-income':'icon-expend']"></li></view>
+ <view class="right_content">
+ <view class="money">{{item.type == 'income'?'+':'-'}}{{item.money}}</view>
+ <view class="text-gray font-middle">{{item.desc}}</view>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+import Navbar from '@/components/navbar/Navbar'
+
+let _now = new Date();
+let now_time = {};
+now_time.year = _now.getFullYear()
+now_time.month = _now.getMonth() + 1
+now_time.day = _now.getDay()
+
+export default {
+ components: {
+ Navbar,
+ },
+ data () {
+ return {
+ isCanvas2d: true,
+ delayload: false,
+ historyData: {
+ "categories": [
+ "1鏈�",
+ "2鏈�",
+ "2鏈�",
+ "4鏈�",
+ "5鏈�"
+ ],
+ "series": [
+ {
+ "name": "鏀跺叆鎯呭喌",
+ "data": [1601,1840.5,1900,1760,1500.85],
+ "type": "line",
+ "style": "curve",
+ "color": "#4ECDB6",
+ "unit":""
+ }
+ ],
+ "yAxis":[
+ {"calibration":true,"position":"left","title":"鍗曚綅/鍏�","titleFontSize":12,"unit":"","tofix":0,"min":0,"disableGrid":true}
+ ]
+ },
+ detail_list:[
+ {date:now_time.month + "-01",time:"11:01","type":"extend",money:"10.00",desc:"閾惰鍗¤浆鍑�"},
+ {date:now_time.month + "-01",time:"13:45","type":"income",money:"18.00",desc:"閾惰鍗℃敹鍏�"},
+ {date:now_time.month + "-02",time:"06:21","type":"extend",money:"123.45",desc:"淇＄敤鍗¤浆鍑�"},
+ {date:now_time.month + "-03",time:"07:38","type":"income",money:"23.00",desc:"閾惰鍗℃敹鍏�"},
+ {date:now_time.month + "-08",time:"16:28","type":"extend",money:"23.56",desc:"淇＄敤鍗¤浆鍑�"},
+ {date:now_time.month + "-09",time:"15:25","type":"income",money:"850.12",desc:"閾惰鍗℃敹鍏�"},
+ {date:now_time.month + "-09",time:"18:52","type":"income",money:"1.88",desc:"閾惰鍗℃敹鍏�"},
+ {date:now_time.month + "-11",time:"21:12","type":"extend",money:"220.21",desc:"閾惰鍗¤浆鍑�"},
+ {date:now_time.month + "-12",time:"13:08","type":"income",money:"32.28",desc:"閾惰鍗℃敹鍏�"},
+ {date:now_time.month + "-12",time:"12:41","type":"extend",money:"122.12",desc:"淇＄敤鍗¤浆鍑�"},
+ {date:now_time.month + "-13",time:"17:21","type":"income",money:"10.00",desc:"閾惰鍗℃敹鍏�"},
+ ]
+ }
+ }
+}
+</script>
+
+<style lang="scss">
+.index-content {
+ background-color: #f3f4f6;
+ min-height: 100vh;
+}
+.index-block {
+ padding: 40rpx;
+ background-color: #fff;
+}
+.index-block-title {
+ font-size: 40rpx;
+ font-weight: bold;
+ padding: 0 0 40rpx 0;
+}
+.item-tj {
+ width: 100%;
+ height: 160rpx;
+ border-radius: 16rpx;
+
+ &-frist {
+ background-color: rgba($color: #2979ff, $alpha: 0.8);
+ // background-image: url('/static/img/bg/qb.png');
+ }
+
+ &-second {
+ background-color: rgba($color: #303133, $alpha: 0.8);
+ // background-image: url('/static/img/bg/qb.png');
+ }
+
+ &-thrid {
+ background-color: rgba($color: #19be6b, $alpha: 0.8);
+ // background-image: url('/static/img/bg/qb.png');
+ }
+}
+.detail_list{
+ height: 700rpx;
+ overflow: auto;
+ color: #9E9E9E;
+ .detail_item{
+ display: flex;
+ margin: 20rpx 0;
+ align-items: center;
+ .icon{
+ width: 30%;
+ text-align: center;
+ li{
+ font-size: 80rpx;
+ }
+ }
+ .right_content{
+ width: 50%;
+ text-align: center;
+ }
+ .icon-income{
+ color:#4AABF9;
+ }
+ .icon-expend{
+ color: #E45521;
+ }
+ .money{
+ color: #000;
+ }
+ }
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3