From 8e15159256cd131705aff50b2973bdae52ce6b9b Mon Sep 17 00:00:00 2001
From: whycq <10027870+whycq@user.noreply.gitee.com>
Date: 星期五, 06 十月 2023 17:23:19 +0800
Subject: [PATCH] #
---
components/z-data-list/z-data-list.vue | 79 +++++++++++++++++++++++++++------------
1 files changed, 54 insertions(+), 25 deletions(-)
diff --git a/components/z-data-list/z-data-list.vue b/components/z-data-list/z-data-list.vue
index b3ce570..4ec90a0 100644
--- a/components/z-data-list/z-data-list.vue
+++ b/components/z-data-list/z-data-list.vue
@@ -2,15 +2,16 @@
<view >
<view class="main">
<view class="main-left" >
- <view class="main-list" v-for="it in dataList" >
- <view>key</view>
- <view style="margin-left: 8px;">value</view>
+ <view class="main-list" v-for="it in dataList" style="width: 100%;">
+ <view style="flex: 1;padding-left: 8rpx;">{{it.key}}</view>
+ <view>:</view>
+ <view style="flex: 3;padding-left: 8rpx;">{{it.value}}</view>
</view>
</view>
- <view class="main-right">
+ <view class="main-right" @click="goDetail">
<view class="list-options">
- <!-- <view class="list-number">1</view> -->
- <view class="abdb"> > </view>
+ <view class="list-number">1</view>
+ <uni-icons class="opt-icon" type="right" size="20" color="#707070"></uni-icons>
</view>
</view>
</view>
@@ -23,42 +24,70 @@
data() {
return {
dataList: [
- {},
- {},
- {},
- {},
- {},
- {},
- {},
- {}
- ]
+ {key: '鍟嗗搧缂栫爜',value: 'fbr3242'},
+ {key: '鎵瑰彿',value: '20231006'},
+ {key: '鏁伴噺',value: '200'},
+ {key: '鍟嗗搧缂栫爜',value: 'fbr3242'},
+ {key: '鎵瑰彿',value: '20231006'},
+ {key: '鏁伴噺',value: '200'}
+ ],
+ detailList: [],
+ dataKey: {}
};
+ },
+ methods: {
+ goDetail() {
+ this.$emit('goDetail');
+ }
+ },
+ created() {
+ this.dataList = this.list.detl
+ },
+ props: {
+ list: {
+ type: Object,
+ default() {
+ return {}
+ }
+ },
+ keyName: {
+ type: Object,
+ default() {
+ return {}
+ }
+ }
}
}
</script>
-
+<!-- align-items: stretch -->
+<!-- 鐗涢�硷紒锛侊紒 -->
+<!-- 璁剧疆align-items涓簊tretch锛屼娇瀛愬厓绱犲～鍏呭瀭鐩存柟鍚戠殑鍙敤楂樺害锛屽疄鐜伴珮搴︾浉绛夌殑鏁堟灉銆� -->
<style scoped>
.main {
position: relative;
min-height: 70rpx;
- background-color: #fdadfc;
+ background-color: #ebe7e6;
display: flex;
- align-items: center;
+ align-items: stretch;
margin: 8px 8px 8px 8px;
+ border-radius: 16rpx;
}
.main-left {
- flex: 4;
+ flex: 7;
display: flex;
flex-direction: column;
+ padding-top: 8rpx;
+ padding-bottom: 8rpx;
}
.main-right {
- background-color: #cccccc;
flex: 1;
display: flex;
- /* flex-direction: column; */
+ align-items: center;
+ justify-content: center;
}
.main-list {
display: flex;
+ align-items: center;
}
.list-options {
display: flex;
@@ -66,10 +95,10 @@
}
.list-number {
position: absolute;
- right: 30px;
- top: 20px;
+ right: 10px;
+ top: 5px;
}
- .abdb {
- flex: 0;
+ .opt-icon {
+ display: flex;
}
</style>
\ No newline at end of file
--
Gitblit v1.9.1