newEdition/pages/center/consumer/newFollowup/newFollowup.vue

<template>
	<view class="box">
			<!-- 最新状态 -->
			<view class="screen">
				<view class="screen-counselor">
					<view class="screen-text">
						最新状态
					</view>
					<view class="screen-sel" @click="selectshow = true">
						<input v-model="screen.stageName" type="text" placeholder='请选择'
							class="screen-inp" disabled />
						<image class="screen-sel-img" src="/static/images/right-arrow.png" mode=""></image>
					</view>
				</view>
			<!-- 录音标示 -->
			<view class="screen-record">
				<view class="screen-record-text">
					意向级别
				</view>
				<view class="screen-record-tab">
					<view :class="[screen.level==1?'screen-record-chose':'screen-record-nochose']"
						@click="screen.level=1">
						A
					</view>
					<view :class="[screen.level==2?'screen-record-chose':'screen-record-nochose']"
						@click="screen.level=2">
						B
					</view>
					<view :class="[screen.level==3?'screen-record-chose':'screen-record-nochose']"
						@click="screen.level=3">
						C
					</view>
					<view :class="[screen.level==4?'screen-record-chose':'screen-record-nochose']"
						@click="screen.level=4">
						D
					</view>
				</view>
			</view>
			<!-- 		<view class="screen-record" style="height: auto;">
						<view class="screen-record-text" style="margin-bottom: 20rpx;">
							客户类型
						</view>
						<u-search  placeholder="请输入搜索" v-model="keyword" :clearabled="true" :show-action="false" @change="search"></u-search>
							<scroll-view style="height: 180rpx;" scroll-y="true" >
								<view class="screen-record-tab" style="flex-wrap: wrap;">
									<view v-for="(item,index) in customerType" :key="index">
										<view :class="[item.check?'screen-record-chose':'screen-record-nochose']" style="margin-bottom: 20rpx;" @click="checkbox(index)">
											{{item.keywords}}
										</view>
									</view>
								</view>
							 </scroll-view>
						
					</view> -->
			<view class="screen-record">
				<view class="screen-record-text">
					跟进内容
				</view>
				<view class="screen-record-tab" style="padding: 20rpx 0;align-items: center;">
					<!-- <input type="text" placeholder="请输入跟进内容" v-model="screen.con" /> -->
					<textarea placeholder="请输入跟进内容" v-model="screen.con" auto-height />
				</view>
			</view>
			<view class="screen-foot">
				<view class="screen-foot-sure" @click="screensure">
					保存
				</view>
			</view>
		<u-select v-model="selectshow" value-name="id" label-name="stageName" :list="stateList" @confirm="actionSelectCallback"></u-select>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: '',
				screenShow: false,
				selectshow: false,
				selectTipshow: false,
				buildingID: '',
				keyword: '',
				stageIndex: '',
				screen: {
					stageId: '',
					stageCode: '',
					stageName: '',
					con: "",
					level: '1'
				},
				stateList: [],
				recordList: [],
				nextPage: 1,
				totalRecord: '',
				freeList: [],
				customerType: [],
				customerId: '',
				orgCode: '',
				// 上级页面选中的
				clientStageName: '', // 选中的标签
				level: '', // 选中的标签
			}
		},
		onShow() {
			this.orgCode = uni.getStorageSync('orgCode')
		},
		onLoad(e) {
			if (e.id) this.customerId = e.id
			if (e.clientStageName) this.clientStageName = e.clientStageName
			if (e.level) this.screen.level = e.level
			this.buildingID = uni.getStorageSync('buildingID').id;
			this.recordList = []
			// this.getMyCustom()
			// this.getFreeList()
			this.getNewStatus()
		},
		methods: {
			//最新状态
			actionSelectCallback(e) {
				console.log(e)
				this.screen.stageId = e[0].value;
				this.screen.stageName = e[0].label;
				this.stateList.forEach((item, index) => {
					if (item.stageName == this.screen.stageName) {
						this.screen.stageCode = item.stageCode
					}
				})
			},
			getCustomerType() {
				this.$u.get("/customer/queryKeyWords").then(res => {
					res.map(item => {
						item.check = false
					})
					this.customerType = res;
				})
			},
			getNewStatus() {
				let premo = {
					houseId: uni.getStorageSync('buildingID').id
				}
				this.$u.post('/customer/getStage', premo)
					.then(res => {
						if(res&& res.length){
							res.forEach((item, index) => {
								if (item.stageName == this.clientStageName) {
									this.screen.stageId=res[index].id
									this.screen.stageCode=res[index].stageCode
									this.screen.stageName=res[index].stageName
								}
							})
						this.stateList = res
						}else{
							this.stateList = []
						}
					})
			},
			checkbox(idx) {
				console.log(idx)
				this.customerType[idx].check = !this.customerType[idx].check
			},
			search(e) {
				console.log(e)
			},
			//选择标签
			selectCallback(e) {
				console.log(e[0].label)
			},
			//筛选确认
			screensure() {
				// 获取选择过的数据
				// let type=[]
				let words = []
				this.customerType.map(item => {
					if (item.check) {
						// type.push(item.id)
						words.push(item.keywords)
					}
				})
				// if (words.length == 0 ) {
				// 	uni.showModal({
				// 		title: '提示',
				// 		content: '请选择、类型',
				// 		showCancel: false
				// 	});
				// 	return;
				// }
				uni.showLoading({
					title: "保存中~",
					mask: true
				})
				// console.log(type)
				let param = {
					"stageCode": this.screen.stageCode,
					"stageName": this.screen.stageName,
					"remarks": this.screen.con,
					orgCode: this.orgCode,
					words,
					"agentRelationPo": {
						"customerId": this.customerId,
						"level": this.screen.level,
						"state": this.screen.stageId
					}
				}
				this.$u.post('/customer/addZkDailyWorkRecord', param)
					.then(res => {
						// util.showSuccess("提交成功");
						uni.hideLoading();
						uni.navigateBack();
					})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		width: 100%;
		height: 100%;
		background: #F8F8F8;
	}

	.screen {
		background: #FFFFFF;

		.screen-counselor {
			display: flex;
			align-items: center;
			height: 106rpx;
			box-sizing: border-box;
			border-bottom: 1rpx solid #CCCCCC;
			padding: 0 30rpx;

			.screen-text {
				font-size: 30rpx;
				font-weight: 400;
				color: #333333;
				line-height: 106rpx;
			}

			.screen-sel {
				display: flex;
				justify-content: flex-end;
				align-items: center;
				width: 500rpx;
				margin-left: 60rpx;

				.screen-sel-img {
					flex-shrink: 0;
					width: 12rpx;
					height: 28rpx;
				}

				.screen-inp {
					padding: 0 20rpx;
					text-align: right;
				}
			}
		}

		.screen-record {
			width: 100%;
			padding: 0 30rpx;
			box-sizing: border-box;
			border-bottom: 1px solid #CCCCCC;

			.screen-record-text {
				margin-top: 36rpx;
				font-size: 30rpx;
				font-weight: 400;
				color: #333333;
				line-height: 30rpx;
			}

			.screen-record-tab {
				margin-top: 30rpx;
				width: 100%;
				display: flex;
				flex-wrap: wrap;

				input {
					flex-grow: 1;
				}

				textarea {
					flex-grow: 1;
				}

				.screen-record-chose {
					width: 151rpx;
					height: 60rpx;
					background: #2671E2;
					border-radius: 4rpx;
					color: #fff;
					border: 1px solid #2671E2;
					text-align: center;
					line-height: 60rpx;
					margin-right: 22rpx;
					margin-bottom: 22rpx;
				}

				.screen-record-nochose {
					width: 151rpx;
					height: 60rpx;
					background: #FFFFFF;
					border-radius: 4rpx;
					border: 1px solid #C9C9C9;
					text-align: center;
					line-height: 60rpx;
					margin-right: 22rpx;
					margin-bottom: 22rpx;
				}

			}
		}

		.screen-foot {
			height: 88rpx;
			display: flex;
			width: 100%;
			margin-top: 160rpx;

			.screen-foot-reset {
				width: 80%;
				text-align: center;
				margin: 0 auto;
				line-height: 88rpx;
				font-size: 30rpx;
				font-weight: 400;
				color: #666666;
			}

			.screen-foot-sure {
				width: 80%;
				margin: 0 auto;
				text-align: center;
				line-height: 88rpx;
				font-size: 30rpx;
				font-weight: 400;
				color: #FFFFFF;
				background: #2671E2;
			}
		}
	}
</style>