#

whycq

2023-10-06 0e324729a41812dc6dfee2af3e545042d3d3425b

 components/z-data-list/z-data-list.vue

@@ -3,14 +3,14 @@
      <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>{{it.key}}</view>
               <view style="margin-left: 8px;">{{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" @click="goDetail()"> > </view>
               <view class="abdb"> > </view>
            </view>
         </view>
      </view>
@@ -23,15 +23,38 @@
      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() {
         console.log(this.list);
         this.dataList = this.list.detl
      },
      props: {
         list: {
            type: Object,
            default() {
               return {}
            }
         },
         keyName: {
            type: Object,
            default() {
               return {}
            }
         }
      }
   }
@@ -43,18 +66,20 @@
   .main {
      position: relative;
      min-height: 70rpx;
      background-color: #fdadfc;
      background-color: #ebe7e6;
      display: flex;
      align-items: stretch;
      margin: 8px 8px 8px 8px;
      border-radius: 16rpx;
   }
   .main-left {
      flex: 4;
      display: flex;
      flex-direction: column;
      padding-top: 8rpx;
      padding-bottom: 8rpx;
   }
   .main-right {
      background-color: #cccccc;
      flex: 1;
      display: flex;
      align-items: center;