<template> <view class="flex-col page"> <view class="flex-col list"> <view class="flex-row justify-between items-center list-item mt-9" v-for="(item, index) in items" :key="index"> <view class="flex-row items-center"> <text class="font">张三</text> <text class="font_2 ml-9">15888610253</text> <view class="flex-col justify-start items-center shrink-0 text-wrapper ml-9"> <text class="text">默认</text> </view> </view> <view class="flex-row"> <image class="image" src="https://ide.code.fun/api/image?token=6711f04f38a7c1001587de59&name=6ff8502391df0676ffa6f9a4c72cf204.png" /> <image class="ml-12 image" src="https://ide.code.fun/api/image?token=6711f04f38a7c1001587de59&name=33bb1d0b853cc38a598105b3dab0d494.png" /> </view> </view> </view> <view class="flex-col justify-start items-center section mt-593"> <view class="flex-col justify-start items-center text-wrapper_2"><text class="font text_2">新增联系人</text></view> </view> </view> </template> <script> </script> <style lang="scss" scoped> .mt-9 { margin-top: 17.18rpx; } .ml-9 { margin-left: 17.18rpx; } .mt-593 { margin-top: 1131.68rpx; } .page { padding-top: 20.99rpx; background-color: #fffaf0; width: 100%; overflow-y: auto; overflow-x: hidden; height: 100%; } .list { padding: 0 20.99rpx; } .list-item { padding: 30.53rpx 15.27rpx 30.53rpx 22.9rpx; background-color: #ffffff; border-radius: 9.54rpx; border-left: solid 1.91rpx #818181; border-right: solid 1.91rpx #818181; border-top: solid 1.91rpx #818181; border-bottom: solid 1.91rpx #818181; } .list-item:first-child { margin-top: 0; } .font { font-size: 30.53rpx; font-family: Open Sans; line-height: 27.67rpx; color: #323232; } .font_2 { font-size: 30.53rpx; font-family: Open Sans; line-height: 22.44rpx; color: #323232; } .text-wrapper { background-color: #ffbe55; border-radius: 9.54rpx; width: 70.61rpx; height: 32.44rpx; } .text { color: #ffffff; font-size: 22.9rpx; font-family: Open Sans; line-height: 21.07rpx; } .image { border-radius: 9.54rpx; width: 40.08rpx; height: 40.08rpx; } .section { padding: 17.18rpx 0; background-color: #ffffff; } .text-wrapper_2 { padding: 26.72rpx 0 22.9rpx; background-color: #ffa948; border-radius: 47.71rpx; width: 629.77rpx; } .text_2 { color: #ffffff; line-height: 28.24rpx; } @import url(../../../common/css/global); </style>