infoPublish.vue 2.6 KB
<template>
	<view>
		<form>
			<view style="padding: 0 32rpx 32rpx 32rpx;background: #fff;">
				<view class="cu-form-group">
					<view class="title">信息标题</view>
					<input placeholder="请输入信息标题" name="input"></input>
				</view>
				<!-- !!!!! placeholder 在ios表现有偏移 建议使用 第一种样式 -->
				<view class="cu-form-group">
					<view class="title">内容</view>
				</view>
				<view class="cu-form-group" style="border-top: none;background: #f7f8fa;border-radius: 20rpx;padding: 0 32rpx;">
					<textarea maxlength="1000" v-model="textareaAValue" @input="textareaAInput" placeholder="请输入内容..."></textarea>
				</view>
				<view class="cu-form-group" style="border-top: none;">
					<view class="title">上传格式</view>
				</view>
				<view class="uploadTypeList">
					<view class="uploadTypeItem" style="padding: 0 24rpx 0 32rpx;">
						<text>填报信息</text>
						<image style="width: 36rpx;height: 36rpx;" src="../../../static/image/index/ic_58@2x.png" mode=""></image>
					</view>
					<view class="uploadTypeItem" style="padding: 0 32rpx;">
						<text>第一季度税务报表</text>
						<image style="width: 24rpx;height: 24rpx;" src="../../../static/image/index/ic_59@2x.png" mode=""></image>
					</view>
					<view class="uploadTypeItem" style="padding: 0 32rpx;">
						<text>第一季度总用水量报表</text>
						<image style="width: 24rpx;height: 24rpx;" src="../../../static/image/index/ic_59@2x.png" mode=""></image>
					</view>
				</view>
			</view>
			<view class="cu-bar margin-top" style="display: flex;justify-content: center;">
				<view style="background: #2e7ff9;border-radius: 80rpx;height: 80rpx;width: 686rpx;color: #fff;text-align: center;line-height: 80rpx;">
					推送
				</view>
			</view>
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				index: -1,
				multiIndex: [0, 0, 0],
				modalName: null,
				textareaAValue: '',
				textareaBValue: ''
			};
		},
		methods: {
			textareaAInput(e) {
				this.textareaAValue = e.detail.value
			},
			textareaBInput(e) {
				this.textareaBValue = e.detail.value
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: $uni-bg-color-hui;
	}
	.cu-form-group .title {
		min-width: calc(4em + 30px);
	}
	.uploadTypeList{
		border: 1rpx solid #ebedf0;
		border-radius: 21rpx;
		padding: 32rpx;
		background: $uni-bg-bai-color;
		.uploadTypeItem{
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 84rpx;
			background: #f7f8fa;
			border-radius: 12rpx;
			margin-top: 32rpx;
		}
		.uploadTypeItem:nth-of-type(1){margin-top: 0;}
	}
</style>