assess-app/pages/loan/components/clientType.vue

<template>
	<view class="task-set">
		<EnSelect title="用户分类" v-model="type" :local-data="popupData" ref="system" item-key="value" item-text="text"
			@setAffirm="submit"></EnSelect>
	</view>
</template>

<script>
	import {
		getClientType,
		setClientType
	} from "@/api/client";
	import EnSelect from "@/components/en-utils/en-select/en-select.vue";
	import tools from "@/service/tools";

	export default {
		name: "clientType",
		components: {
			EnSelect
		},
		props: {
			'clientId': {
				default: ''
			}
		},
		data() {
			return {
				showExecute: false,
				popupData: [],
				type: '',
				typeName: '',
			}
		},
		watch: {},

		mounted() {
			// this.getClientType()
		},
		methods: {
			getClientType() {
				getClientType().then((res) => {
					if (res.code === 1) {
						this.popupData = res.data
					}
					console.log(this.popupData)
				})
			},


			setNewExecute(e) {
				//设置新执行人
				console.log(e)
				let newData = e.detail.value[0]
				this.type = newData.value
				this.typeName = newData.text
			},
			submit() {
				setClientType({
					'clientId': this.clientId,
					'type': this.type
				}).then((res) => {
					if (res.code === 1) {
						tools.success(res.msg)
						this.$emit('endTaskSet')
					} else {
						tools.error(res.msg)
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.task-set {
		width: 100%;
		min-height: 50vh;
		max-height: 70vh;
		background: #F6F7FB;
		overflow: auto;
		border-radius: 20rpx 20rpx 0rpx 0rpx;

		.nav {
			font-size: 18px;
			font-weight: bold;
			text-align: center;
			padding: 30rpx 0 15rpx;
			background: #fff;
		}

		.task-tab {
			display: flex;
			justify-content: space-between;
			height: 88rpx;

			.tab-item {
				width: 50%;
				height: 100%;
				font-size: 14px;
				color: #333333;
				line-height: 88rpx;
				text-align: center;
				background: #fff;
				border: 2rpx solid #3169FA;
				box-sizing: border-box;
			}

			.tab-select {
				background: #3169FA;
				color: #FFFFFF;
				border: none;
			}
		}

		.content {
			width: 100%;
			height: auto;
			padding: 22rpx 0 106rpx 0;

			.choose-box {
				width: 100%;
				height: auto;
				padding: 34rpx 35rpx;
				box-sizing: border-box;
				background: #fff;
				border-top: 1px solid #F0F0F0;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.choose-box-left {
					font-size: 16px;
					color: #666666;
				}

				.choose-box-right {
					display: flex;
					align-items: center;

					.choose-box-right-content {
						font-size: 16px;
						font-weight: 400;
						color: #232A35;
						margin: 0 18rpx 0 0;
					}

					.choose-box-right-img {
						width: 12rpx;
						height: 20rpx;
					}
				}
			}

			.choose-box-stage {
				background: #fff;
				padding: 0 22rpx;
				margin-bottom: 22rpx;
			}

			.choose-box-two {
				margin: 0 0 22rpx 0;
			}


		}

		.submit-box {
			width: 100%;
			height: auto;
			border-top: 1px solid #F0F0F0;
			background: #fff;
			position: fixed;
			left: 0;
			bottom: 0;
			padding: 12rpx 32rpx;
			box-sizing: border-box;

			.submit {
				width: 100%;
				height: auto;
				background: #3169FA;
				border-radius: 4px;
				font-size: 16px;
				color: #FFFFFF;
				padding: 20rpx 0;
				text-align: center;
			}
		}

		.operate-box {
			.content-box {
				margin-top: 20rpx;
				height: auto;
				padding: 0 20rpx;
				background: #fff;
			}
		}
	}
</style>