From 6c757d5dab619fd759854778978270f0eecaec93 Mon Sep 17 00:00:00 2001
From: ZhangXianQiang <1135831638@qq.com>
Date: 星期二, 05 三月 2024 17:33:57 +0800
Subject: [PATCH] fix:修改文字位置
---
src/views/daoAnOffice/left-bottom.vue | 115 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 112 insertions(+), 3 deletions(-)
diff --git a/src/views/daoAnOffice/left-bottom.vue b/src/views/daoAnOffice/left-bottom.vue
index 2c2b4a8..e3d9f8a 100644
--- a/src/views/daoAnOffice/left-bottom.vue
+++ b/src/views/daoAnOffice/left-bottom.vue
@@ -5,20 +5,124 @@
import { useSettingStore } from "@/stores";
import { storeToRefs } from "pinia";
import EmptyCom from "@/components/empty-com"
-
+const options = reactive([
+ {
+ title: "闈掑煄灞遍鏅尯",
+ num1: 56,
+ num2: 54,
+ num3: 47,
+ num4: 35,
+ num5: 48,
+ num6: 21,
+ num7: 87,
+ },
+ {
+ title: "閮芥睙鍫伴鏅尯",
+ num1: 356,
+ num2: 354,
+ num3: 347,
+ num4: 335,
+ num5: 348,
+ num6: 321,
+ num7: 387,
+ },
+ {
+ title: "铏瑰彛鏃呮父鏅尯",
+ num1: 256,
+ num2: 254,
+ num3: 247,
+ num4: 235,
+ num5: 248,
+ num6: 221,
+ num7: 287,
+ },
+ {
+ title: "鐏屽幙鍙ゅ煄",
+ num1: 156,
+ num2: 154,
+ num3: 147,
+ num4: 135,
+ num5: 148,
+ num6: 121,
+ num7: 187,
+ }
+])
</script>
<template>
- <div class="left_boottom_wrap beautify-scroll-def" >
- 閲嶇偣鏅尯
+ <div class="left_boottom_wrap beautify-scroll-def">
+ <div class="left-bottom-fj" v-for="(item, index) in options" :key="index">
+ <div>
+ <div class="left-bottom-fj-title">{{ item.title }}</div>
+ <div class="left-bottom-fj-info">
+ <p class="left-fj-p">杞︽祦閲�:<span class="left-p">{{ item.num1 }}</span><span class="left-fj-sp">杈�</span></p>
+ <p class="left-fj-p">娓稿棰勭害:<span class="left-p">{{ item.num2 }}</span><span class="left-fj-sp">浜�</span></p>
+ <p class="left-fj-p">鍦ㄥ矖璀﹀姏:<span class="left-p">{{ item.num3 }}</span><span class="left-fj-sp">浜�</span></p>
+ <p class="left-fj-p">澶囩敤璀﹀姏:<span class="left-p">{{ item.num4 }}</span><span class="left-fj-sp">杈�</span></p>
+ <p class="left-fj-p">浜烘祦閲�:<span class="left-p">{{ item.num5 }}</span><span class="left-fj-sp">浜�</span></p>
+ <p class="left-fj-p">鍏ュ洯浜烘暟:<span class="left-p">{{ item.num6 }}</span><span class="left-fj-sp">浜�</span></p>
+ <p class="left-fj-p">鍦ㄥ矖璀﹁溅:<span class="left-p">{{ item.num7 }}</span><span class="left-fj-sp">杈�</span></p>
+ </div>
+ </div>
+
+ </div>
</div>
</template>
<style scoped lang="scss">
.left_boottom_wrap {
+ margin-left: 10px;
overflow: hidden;
width: 100%;
height: 100%;
+
+ .left-bottom-fj {
+ margin-bottom: 32px;
+ border: 1px solid #29466A;
+ background-color: rgba(17, 34, 58, 0.6);
+
+ .left-bottom-fj-info {
+ margin-top: -10px;
+ padding: 10px;
+ padding-bottom: 20px;
+ padding-top: 0px;
+ .left-fj-p {
+ width: 23%;
+ margin-top: 3px;
+ margin-right: 10px;
+ color: #4481DD;
+ font-family: 'PingFang SC';
+
+ .left-fj-sp {
+ color: #fff;
+ }
+ }
+
+ display: flex;
+ flex-wrap: wrap;
+
+ .left-p {
+ color: #FAE67D;
+ }
+ }
+
+ .left-bottom-fj-title {
+ font-family: 'PingFang SC';
+ font-weight: 400;
+ font-size: 20px;
+ color: #44DBDD;
+ line-height: 40px;
+ height: 80px;
+ text-align: center;
+ background-image: url("@/assets/img/fjbg.png");
+ background-position: center;
+ /* 姘村钩鍜屽瀭鐩撮兘灞呬腑瀵归綈 */
+ background-repeat: no-repeat;
+ /* 涓嶉噸澶嶅钩閾鸿儗鏅浘鍍� */
+ background-size: cover;
+ /* 鑷姩璋冩暣澶у皬浠ュ畬鍏ㄨ鐩栧厓绱� */
+ }
+ }
}
.doudong {
@@ -41,6 +145,7 @@
padding: 8px;
font-size: 14px;
margin: 10px 0;
+
.orderNum {
margin: 0 16px 0 -20px;
}
@@ -82,6 +187,7 @@
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
+
.dibu {
position: absolute;
height: 2px;
@@ -91,6 +197,7 @@
left: -2%;
background-size: cover;
}
+
.addresswrap {
width: 100%;
display: flex;
@@ -132,4 +239,6 @@
}
}
}
+
+.left-p {}
</style>
--
Gitblit v1.8.0