mirror of
https://github.com/cool-team-official/cool-admin-vue.git
synced 2024-11-01 14:10:27 +08:00
优化
This commit is contained in:
parent
9bed5f3183
commit
2a1da170de
@ -23,10 +23,9 @@ const chartOption = reactive({
|
||||
left: "center",
|
||||
data: ["手机", "相机", "耳机", "音箱", "手表"]
|
||||
},
|
||||
color: ["#3AA1FF", "#36CBCB", "#F2637B", "#975FE5", "#FBD437"],
|
||||
series: [
|
||||
{
|
||||
name: "访问来源",
|
||||
name: "销售额类别占比",
|
||||
type: "pie",
|
||||
radius: ["50%", "60%"],
|
||||
center: ["50%", "40%"],
|
||||
|
@ -16,7 +16,10 @@
|
||||
<span>周同比</span>
|
||||
|
||||
<div class="fall">
|
||||
<i class="el-icon-bottom-right"></i>
|
||||
<el-icon>
|
||||
<bottom-right />
|
||||
</el-icon>
|
||||
|
||||
<span>-4%</span>
|
||||
</div>
|
||||
</li>
|
||||
@ -25,7 +28,10 @@
|
||||
<span>日同比</span>
|
||||
|
||||
<div class="rise">
|
||||
<i class="el-icon-top-right"></i>
|
||||
<el-icon>
|
||||
<top-right />
|
||||
</el-icon>
|
||||
|
||||
<span>+7%</span>
|
||||
</div>
|
||||
</li>
|
||||
@ -37,6 +43,7 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue";
|
||||
import { BottomRight, TopRight } from "@element-plus/icons-vue";
|
||||
|
||||
const value = ref(0);
|
||||
|
||||
|
@ -2,7 +2,7 @@
|
||||
<div class="count-paid">
|
||||
<div class="card">
|
||||
<div class="card__header">
|
||||
<span class="label">支付笔数</span>
|
||||
<span class="label">付款笔数</span>
|
||||
<span class="value">6560</span>
|
||||
</div>
|
||||
|
||||
|
@ -12,7 +12,10 @@
|
||||
<span>周同比</span>
|
||||
|
||||
<div class="fall">
|
||||
<i class="el-icon-bottom-right"></i>
|
||||
<el-icon>
|
||||
<bottom-right />
|
||||
</el-icon>
|
||||
|
||||
<span>-6%</span>
|
||||
</div>
|
||||
</li>
|
||||
@ -21,7 +24,10 @@
|
||||
<span>日同比</span>
|
||||
|
||||
<div class="rise">
|
||||
<i class="el-icon-top-right"></i>
|
||||
<el-icon>
|
||||
<top-right />
|
||||
</el-icon>
|
||||
|
||||
<span>+12%</span>
|
||||
</div>
|
||||
</li>
|
||||
@ -36,7 +42,9 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup></script>
|
||||
<script lang="ts" setup>
|
||||
import { BottomRight, TopRight } from "@element-plus/icons-vue";
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.count-sales {
|
||||
|
@ -25,12 +25,16 @@ import * as echarts from "echarts";
|
||||
const chartOption = reactive({
|
||||
grid: {
|
||||
left: 0,
|
||||
top: 0,
|
||||
top: 1,
|
||||
right: 0,
|
||||
bottom: 0
|
||||
bottom: 1
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
boundaryGap: false,
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
"00:00",
|
||||
"2:00",
|
||||
@ -44,8 +48,7 @@ const chartOption = reactive({
|
||||
"18:00",
|
||||
"20:00",
|
||||
"22:00"
|
||||
],
|
||||
boundaryGap: false
|
||||
]
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
@ -64,7 +67,6 @@ const chartOption = reactive({
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "总访问量",
|
||||
type: "line",
|
||||
smooth: true,
|
||||
showSymbol: false,
|
||||
|
@ -42,10 +42,8 @@
|
||||
</el-row>
|
||||
|
||||
<div class="hot-search__table">
|
||||
<cl-crud ref="Crud" padding="0">
|
||||
<cl-row>
|
||||
<cl-table ref="Table" :border="false" />
|
||||
</cl-row>
|
||||
<cl-crud ref="Crud">
|
||||
<cl-table ref="Table" :border="false" />
|
||||
</cl-crud>
|
||||
</div>
|
||||
</div>
|
||||
@ -261,10 +259,7 @@ function chartOption() {
|
||||
}
|
||||
|
||||
&__table {
|
||||
padding: 10px;
|
||||
margin: 0 10px;
|
||||
border-radius: 6px;
|
||||
background-color: var(--el-bg-color);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -62,9 +62,6 @@ const chartOption = reactive<any>({
|
||||
show: true,
|
||||
status: "shadow",
|
||||
z: -1,
|
||||
shadowStyle: {
|
||||
color: "#E6F7FF"
|
||||
},
|
||||
type: "shadow"
|
||||
},
|
||||
extraCssText: "width:120px; white-space:pre-wrap"
|
||||
|
@ -75,6 +75,7 @@ import HotSearch from "./components/hot-search.vue";
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.5px;
|
||||
color: #000;
|
||||
line-height: 1;
|
||||
|
||||
&__header {
|
||||
display: flex;
|
||||
|
Loading…
Reference in New Issue
Block a user