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


		</view>
		<view style='margin-top: 20vh;' v-if="tableList.length==0">
			<u-empty iconSize='150' textSize='32' text='暂无数据'>
			</u-empty>
		</view>
		<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: 'content',
						type: 'title',
						className: 'perce100',
					}],
					[{
						label: '跟进阶段：',
						prop: 'stageName'
					}, {
						label: '客户联系人：',
						prop: 'linkName',
					}],
					[{
						label: '跟进时间：',
						prop: 'followupTime',
						className: 'perce100',
					}],
					[{
						label: '达成共识：',
						prop: 'agreement',
						className: 'perce100',

					}],
					[{
						label: '下一步计划：',
						prop: 'nextPlan',
						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: [],
				form: {},

			}
		},
		props: {
			isDrawer: {
				default: false
			},
			linkList: {
				default: []
			},
			pageName: ''
		},
		components: {
			myCard
		},
		created() {
			uni.$off('updateFollowList')
			uni.$on('updateFollowList', ({
				type,
				data
			}) => {

				if (type == 'add') {
					this.tableList.unshift(data)
				} else {
					this.$set(this.tableList, data.index, data)
				}
				if (this.pageName == 'businessOpportunity') {
					uni.$emit('savefollowList', data)
					return
				}
				this.form.opportunityFollowupList = JSON.parse(JSON.stringify(this.tableList))

				if (this.isDrawer) {
					uni.$emit('setContact', {
						key: 'form',
						data: this.form
					})
				}

			})
		},
		methods: {
			init(data) {
				console.log('pageName', this.pageName)
				if (this.pageName == 'businessOpportunity') {
					this.tableList = JSON.parse(JSON.stringify(data))
					return
				}
				if (data) {
					this.form = data
					this.tableList = JSON.parse(JSON.stringify(data.opportunityFollowupList))
					console.log('tableList', this.tableList)
				}
			},


			del(index, item) {
				this.tableList.splice(index, 1);
				if (this.pageName == 'businessOpportunity') {
					uni.$emit('delFollowList', item)
					return
				}
				this.form.opportunityFollowupList = JSON.parse(JSON.stringify(this.tableList))
				if (this.isDrawer) {
					uni.$emit('setContact', {
						key: 'form',
						data: this.form
					})
				}

			},
			add(type, data, index) {
				if (type == 'edit') {
					data['index'] = index
				}
				console.log('index', JSON.stringify(data))
				uni.navigateTo({
					url: '/pages/saleManage/contact/components/followListAdd?type=' + type + '&linkList=' + JSON
						.stringify(this.linkList) + (type == 'edit' ?
							'&data=' + encodeURIComponent(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;
	}



	/deep/.u-cell__body,
	/deep/.u-cell__title-text {
		font-size: 26rpx;
	}
</style>