businessCard/xiaochengxu/pages/mySet/myInfo.vue

<template>
	<view class="content">
		<view class="card-list">
			<view class="row" v-for="(item,index) in cardList" :key="index">
				<view class="title-name">
					名称
				</view>
				<view class="flex card-list-item">
					<view class="left">
						<view class="top flex-row-center">
							<image src="../../static/uni.png" mode="widthFix" class="img"></image>
						</view>
						<view class="bottom flex flex-evenly">
							<uni-icons type="home" size="20"></uni-icons>
							<text>默</text>
							<uni-icons type="redo" size="20"></uni-icons>
						</view>
					</view>
					<view class="right">
						<view class="row1 flex">
							<text>张三</text>
							<text class="line"></text>
							<text>总经理</text>
						</view>
						<view class="row2">
							北京xxx有限公司
						</view>
						<view class="row3" @click="toMap">
							<uni-icons type="redo" size="20"></uni-icons>
							<text>北京市朝阳区幸福大街8号</text>
						</view>
						<view class="row3">
							<uni-icons type="redo" size="20"></uni-icons>
							<text>13333333333</text>
						</view>
						<view class="row3">
							<uni-icons type="redo" size="20"></uni-icons>
							<text>我是备注</text>
						</view>
					</view>
				</view>
				<view class="car-bottom flex">
					<button>置顶</button>
					<button>删除</button>
					<button>编辑</button>
				</view>
			</view>
		</view>
		<view class="upload">
			<view class="solids" @click="addCard">
				<text class=''>添加新名片</text>
			</view>
		</view>
	</view>
</template>

<script>
	import uploadImage from '@/components/ossutil/uploadFile.js';
	export default {
		data() {
			return {
				cardList: [{},
					{}
				]
			};
		},
		methods:{
			addCard(){
				uni.navigateTo({
					url:"/pages/mySet/newCard"
				})
			}
			// chooseImage(){
			// 	uni.chooseImage({
			// 		success: (res) => {
			// 			uploadImage(res.tempFilePaths[0], 'cardImages/',
			// 				result => {
			// 					// this.trainImg = result
			// 					uni.hideLoading();
			// 				}
			// 			)
			// 		}
			// 	});
			// }
		}
	}
</script>

<style lang="scss" scoped>
	.card-list-item {
		border: 1px solid #ccc;
		border-radius: 30rpx;
		padding: 40rpx;
		box-sizing: border-box;

		.left {
			width: 30%;

			.top {

				margin-bottom: 20rpx;
			}

			.img {
				width: 80%;
			}

			.bottom {}
		}

		.right {
			.row1 {
				.line {
					width: 1px;
					height: 20px;
					margin: 0 20rpx;
					background: black;
				}
			}
		}
	}
</style>