Web_TracerMethodology/pages/mission-action/components/pdca-components/do-and-check.vue

<template>
	<view class="com-plan-content">
		<view class="title">
			<text>{{ title }}</text>
		</view>
		<view class="item-view">
			<view class="top-action">
				<text>改善确认（1）</text>
				<text class="close-text">删除</text>
			</view>
			<view class="main">
				<view class="row">
					<view class="label-view">
						<text>{{ label }}</text>
					</view>
					<view class="content">
						<textarea class="textarea"
					    :key="title"
						  placeholder="请输入"
							placeholder-style="color: #B8BECC"
							:maxlength="-1"
							auto-height
					    
						/>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	// 执行过程记录（Do）和 改善确认（Check）
	export default {
		props: {
      // 多行文本框标题
			title: {
        type: String,
        default: '执行过程记录（Do）'
			},
      // 多行文本框子标题
			label: {
        type: String,
        default: '执行过程记录'
      }
    },
    data() {
      return {
        // list长度 控制个数
        list: [
					{gcjl: '', date: '', imgPath: '' },
					{gcjl: '', date: '', imgPath: '' }
				]
      }
    },
		methods: {
      changeVal(e) {
        if(this.label === '改善计划'){
          this.planvalue = e.target.value;
        }else {
          this.actionvalue = e.target.value;
        }
      }
		},
	}
</script>

<style lang="less">
	.com-plan-content {
		height: 100%;
		padding-top: 35rpx;

		.title {
			line-height: 35rpx;
			padding: 0 25rpx;

			text {
				font-size: 35rpx;
				color: #292C33;
			}
		}
		
		.item-view {
			
			.top-action {
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-top: 25rpx;
				margin-bottom: 15rpx;
				height: 22.5rpx;
				padding: 0 25rpx;
				
				text {
					font-size: 22.5rpx;
					color: #666F80;
				}
				
				.close-text {
					font-size: 20rpx;
					color: #3377FF;
				}
			}
			
			.main {
				padding-left: 25rpx;
				background-color: #fff;
				
				.row {
					display: flex;
					
					.label-view {
						width: 175rpx;
						line-height: 37.5rpx;
						padding: 25rpx 0;
					
						>text {
							font-size: 22.5rpx;
							color: #666F80;
						}
					}
					
					.content {
						flex: 1;
						padding: 25rpx 0;
					
						.textarea {
							width: 100%;
							min-height: 200rpx;
							padding: 0 25rpx;
							line-height: 38.5rpx;
							font-size: 22.5rpx;
							color: #525866;
							box-sizing: border-box;
						}
					}
				}
			}
		}
	}
</style>