From 428216f1c3c255b107eb689cb2afac1b7ed3df80 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期三, 14 六月 2023 21:11:33 +0800
Subject: [PATCH] 样式优化
---
src/components/detail/index.vue | 52 ++++++++++++++++++++++++++++++++++++----------------
1 files changed, 36 insertions(+), 16 deletions(-)
diff --git a/src/components/detail/index.vue b/src/components/detail/index.vue
index d9a11e0..65dac44 100644
--- a/src/components/detail/index.vue
+++ b/src/components/detail/index.vue
@@ -3,13 +3,15 @@
<div class="view-data">
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 闂绫诲瀷: </label>
+ <label class="data-title"> 闂绫诲瀷锛�</label>
<span class="data-detail">{{
getCategoryLabel(baseCase.category)
}}</span>
</div>
- <div class="data-item__right">
- <label class="data-title"> 澶х被鍚嶇О: </label>
+ </div>
+ <div class="data-item">
+ <div class="data-item__left">
+ <label class="data-title"> 澶х被鍚嶇О锛�</label>
<span class="data-detail">{{
baseCase.violationsVO.categoryText
}}</span>
@@ -17,17 +19,19 @@
</div>
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 灏忕被鍚嶇О: </label>
+ <label class="data-title"> 灏忕被鍚嶇О锛�</label>
<span class="data-detail">{{ baseCase.violationsVO.typeText }}</span>
</div>
- <div class="data-item__right">
- <label class="data-title"> 浜嬩欢绛夌骇: </label>
+ </div>
+ <div class="data-item">
+ <div class="data-item__left">
+ <label class="data-title"> 浜嬩欢绛夌骇锛�</label>
<span class="data-detail">{{ baseCase.violationsVO.gradeText }}</span>
</div>
</div>
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 妗堢敱: </label>
+ <label class="data-title"> 妗堢敱锛�</label>
<span class="data-detail">{{
baseCase.violationsVO.actionCause
}}</span>
@@ -35,29 +39,31 @@
</div>
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 鎵�灞炶閬�: </label>
+ <label class="data-title"> 鎵�灞炶閬擄細</label>
<span class="data-detail">{{ baseCase.streetText }}</span>
</div>
- <div class="data-item__right">
- <label class="data-title"> 鎵�灞炵ぞ鍖�: </label>
+ </div>
+ <div class="data-item">
+ <div class="data-item__left">
+ <label class="data-title"> 鎵�灞炵ぞ鍖猴細</label>
<span class="data-detail">{{ baseCase.communityText }}</span>
</div>
</div>
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 浜嬪彂鍦扮偣: </label>
+ <label class="data-title"> 浜嬪彂鍦扮偣锛�</label>
<span class="data-detail">{{ baseCase.site }}</span>
</div>
</div>
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 鍏宠仈鍟嗛摵鍚嶇О: </label>
+ <label class="data-title"> 鍟嗛摵鍚嶇О锛�</label>
<span class="data-detail">{{ baseCase.violationsVO.shopName }}</span>
</div>
</div>
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 闂鎻忚堪: </label>
+ <label class="data-title"> 闂鎻忚堪锛�</label>
<span class="data-detail">{{
baseCase.violationsVO.description
}}</span>
@@ -66,13 +72,15 @@
<div class="data-user">
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 鍙嶆槧浜�: </label>
+ <label class="data-title"> 鍙嶆槧浜猴細</label>
<span class="data-detail">{{
baseCase.violationsVO.informant
}}</span>
</div>
+ </div>
+ <div class="data-item">
<div class="data-item__right">
- <label class="data-title"> 鑱旂郴鏂瑰紡: </label>
+ <label class="data-title"> 鑱旂郴鏂瑰紡锛�</label>
<span class="data-detail">{{
baseCase.violationsVO.informantPhoneCode
}}</span>
@@ -80,7 +88,7 @@
</div>
<div class="data-item">
<div class="data-item__left">
- <label class="data-title"> 韬唤璇佸彿: </label>
+ <label class="data-title"> 韬唤璇佸彿锛�</label>
<span class="data-detail">{{
baseCase.violationsVO.informantIdCard
}}</span>
@@ -215,10 +223,22 @@
}
border: 1px solid #17324c;
+ .data-title {
+ line-height: 1.8;
+ width: 70px;
+ text-align: right;
+ display: inline-grid;
+ }
.data-detail {
line-height: 1.8;
max-width: 240px;
display: inline-grid;
+ color: #333;
+
+ width: calc(100% - 70px) !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ white-space: normal !important;
}
}
--
Gitblit v1.8.0