aiot-app/pages/saleManage/contact/components/bankList.vue

<template>
	<view class="mainBox">
		<view v-for="(item, index) in tableList" :key="index" style="position: relative;">
			<myCard @add="add('edit',item,index)" @del="del(index)" :item="item" :index="index+1" :columns="columns" :btnList="btnList"> 
			 
			</myCard>

		</view>

		<u-popup :show="show" @close="show=false">
			<u-button type="error" text="删除" @click="del"></u-button>
		</u-popup>

		<view class="add" @click="add('add')">
			<u-icon name="plus" color="#fff"></u-icon>
		</view>

	</view>
</template>

<script>
	import myCard from '../../components/myCard.vue'
	export default {
		data() {
			return {
				columns: [
					[{
						label: '单位名称：',
						prop: 'accountName',
						type: 'title',
						className: 'perce100',
					}],
					[{
						label: '银行账号：',
						prop: 'accountNo',
					}, {
						label: '开户行：',
						prop: 'bankName'
					}],
					[{
						label: '银行银联号：',
						prop: 'interbankNo',
						className: 'perce100'
					}],
					[{
						label: '操作：',
						prop: 'action',
						type: 'action',
						className: 'perce100',
					}],
				],
				btnList: [{
					name: '修改',
					apiName: 'add',
					btnType: 'primary',
					type: '2',
				}, {
					name: '删除',
					apiName: 'del',
					btnType: 'error',
					type: '2',
					pageUrl: '',
					
				}],
				tableList: [],
				show: false,
				current: {},
				index: ''
			}
		},
		props: {
			isDrawer: {
				default: false
			}
		},
		components: {
			myCard
		},
		created() {
			uni.$off('updateBankList')
			uni.$on('updateBankList', ({
				type,
				data
			}) => {
				if (type == 'add') {
					this.tableList.push(data)
				} else {
					this.$set(this.tableList, data.index, data)
				}
				if (this.isDrawer) {
					uni.$emit('setContact', {
						key: 'bankList',
						data: this.tableList
					})
				}

				// console.log(data)
			})
		},
		methods: {
			init(list) {
				if (list) {
					this.tableList = JSON.parse(JSON.stringify(list))
				}
			},
			getValue() {
				return this.tableList
			},
	
			del(index) {
				this.tableList.splice(index, 1);
				if (this.isDrawer) {
					uni.$emit('setContact', {
						key: 'bankList',
						data: this.tableList
					})
				}

			},
			add(type, data, index) {
				if (type == 'edit') {
					data['index'] = index
				}
				uni.navigateTo({
					url: '/pages/saleManage/contact/components/bankListAdd?type=' + type + (type == 'edit' ?
						'&data=' + JSON.stringify(data) : '')
				})
			}

		}
	}
</script>

<style lang="scss" scoped>
	.add {
		width: 96rpx;
		height: 96rpx;
		border-radius: 48rpx;
		background: #3c9cff;
		position: fixed;
		bottom: 100rpx;
		right: 24rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 99;
	}
</style>