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">
					{{item.cardBusiness}}
				</view>
				<view class="flex card-list-item">
					<view class="left">
						<view class="top flex-row-center">
							<image :src="item.headSculpture" mode="widthFix" class="img"></image>
						</view>
						<view class="bottom flex flex-evenly">
							<uni-icons type="home" size="20" @click="toHome(item)"></uni-icons>
							<uni-icons type="home" size="20"></uni-icons>
							<uni-icons type="redo" size="20"></uni-icons>
						</view>
					</view>
					<view class="right">
						<view class="row1 flex">
							<text>{{item.name}}</text>
							<text class="line"></text>
							<text>{{item.post}}</text>
						</view>
						<view class="row2">
							{{item.companyName}}
						</view>
						<view class="row3" @click="toMap">
							<uni-icons type="redo" size="20"></uni-icons>
							<text>{{item.province}}{{item.city}}{{item.area}}{{item.detailedAddress}}</text>
						</view>
						<view class="row3">
							<uni-icons type="redo" size="20"></uni-icons>
							<text>{{item.phone}}</text>
						</view>
					</view>
				</view>
				<view class="car-bottom flex">
					<u-button text="置顶" @click="topMarking(item)" throttle-time='1000'></u-button>
					<!-- <button @click="$u.debounce(topMarking, 500)">置顶</button> -->
					<!-- <button @click="$u.debounce(topMarking(item), 500)">置顶</button> -->
					<u-button text="删除" @click="del(item.id)" throttle-time='1000'></u-button>
					<button @click="toEditCard(item)">编辑</button>
				</view>
			</view>
		</view>
		<view class="upload">
			<view class="solids" @click="addCard">
				<text class=''>添加新名片</text>
			</view>
		</view>
		<u-toast ref="uToast"></u-toast>
		<u-popup :show="isShowDel" @close="isShowDel=false" mode="center">
			<view>
				<text>删除名片自动退出关联得圈子，确定删除？</text>
				<u-radio-group v-model="radiovalue" placement="column">
					<u-radio :customStyle="{marginBottom: '8px'}" v-for="(item, index) in radiolist" :key="index"
						:label="item.name" :name="item.name" @change="radioChange">
					</u-radio>
				</u-radio-group>
				<view class="flex">
					<view class="">
						取消
					</view>
					<view class="" @click="delCard">
						删除
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	var that;
	export default {
		data() {
			return {
				id: '',
				radiovalue: '仅从自己名片列表删除',
				radiolist: [{
						name: '仅从自己名片列表删除',
						disabled: false
					},
					{
						name: '从所有拥有此名片用户列表删除',
						disabled: false
					}
				],
				isShowDel: false,
				cardList: []
			};
		},
		onLoad() {
			that = this
			this.userInfo = uni.getStorageSync("userInfo")
		},
		onShow() {
			this.init()
		},
		methods: {
			toHome(item){
				uni.navigateTo({
					url: "/pages/mySet/myHome?id="+item.personalHomeId
				})
			},
			radioChange(n) {
				console.log('radioChange', n);
			},
			init() {
				this.$request.baseRequest('admin.unimall.cardManagementInfo', 'list', {
					commonId: this.userInfo.id
				}, failres => {
					this.$refs.uToast.show({
						type: 'error',
						message: failres.errmsg,
					})
					uni.hideLoading()
				}).then(res => {
					this.cardList = res.data.items
				})
			},
			toEditCard(val) {
				uni.navigateTo({
					url: "/pages/mySet/editCard?itemVal="+JSON.stringify(val)
				})
			},
			delCard() {
				let _data = {}
				if (this.radiovalue == '仅从自己名片列表删除') {
					_data = {
						id: this.id
					}
				} else {
					_data = {
						id: this.id,
						deleteCondition: 1
					}
				}
				that.$request.baseRequest('admin.unimall.cardManagementInfo', 'delete', _data, failres => {
					this.$refs.uToast.show({
						type: 'error',
						message: failres.errmsg,
					})
					uni.hideLoading()
				}).then(res => {
					this.isShowDel = false
					this.$refs.uToast.show({
						type: 'success',
						message: '删除成功！',
					})
					this.init()
				})
			},
			del(val) {
				this.id = val
				this.isShowDel = true

			},
			addCard() {
				uni.navigateTo({
					url: "/pages/mySet/newCard"
				})
			},
			topMarking(val) {
				that.$request.baseRequest('admin.unimall.cardManagementInfo', 'top', {
					cardManagementInfo: JSON.stringify({
						id: val.id
					})
				}, failres => {
					this.$refs.uToast.show({
						type: 'error',
						message: failres.errmsg,
					})
					uni.hideLoading()
				}).then(res => {
					this.$refs.uToast.show({
						type: 'success',
						message: '置顶成功！',
					})
					this.init()
				})
			}
		}
	}
</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>