You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

157 lines
4.4 KiB

<template>
<view class="project-add">
<!-- 项目新增表单卡片 -->
<view class="form-card">
<view class="form-title">整改问题</view>
<view class="form-item">
<text class="form-label">责任单位</text>
<view class="form-content">
<input v-model="form.projectName" class="form-input" placeholder="请选择责任单位" disabled/>
<picker mode="region" v-model="form.region" @change="onRegionChange">
<view class="form-select">
选择
</view>
</picker>
</view>
</view>
<view class="form-item">
<text class="form-label">单位类型</text>
<view class="form-content">
<input v-model="form.projectName" class="form-input" placeholder="请选择单位类型" disabled/>
<picker mode="selector" :range="projectTypes" v-model="form.projectType">
<view class="form-select">
选择
</view>
</picker>
</view>
</view>
<view class="form-item">
<text class="form-label">检查时间</text>
<view class="form-content">
<input v-model="form.projectName" class="form-input" placeholder="请选择检查时间" disabled/>
<picker mode="selector" :range="projectTypes" v-model="form.projectType">
<view class="form-select">
选择
</view>
</picker>
</view>
</view>
<view class="form-item">
<text class="form-label">问题描述</text>
<view class="form-content">
<textarea v-model="form.legalRep" class="form-input" placeholder="请输入问题描述" rows="3"></textarea>
</view>
</view>
</view>
<view class="form-card" style="margin-top: 16px;">
<view class="form-title">整改信息</view>
<view class="form-item">
<text class="form-label">整改时间</text>
<view class="form-content">
<input v-model="form.projectName" class="form-input" placeholder="请选择整改时间" disabled/>
<picker mode="region" v-model="form.region" @change="onRegionChange">
<view class="form-select">
选择
</view>
</picker>
</view>
</view>
<view class="form-item">
<text class="form-label">整改反馈</text>
<view class="form-content">
<textarea v-model="form.legalRep" class="form-input" placeholder="请输入整改反馈" rows="3"></textarea>
</view>
</view>
</view>
<view class="cc-operation-row operation-row">
<view class="buttons-group">
<view class="button primary-button">确定</view>
<view class="button default-button">取消</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
form: {
projectName: '',
region: [],
projectCode: '',
projectType: 0,
legalEntity: '',
projectLeader: '',
leaderPhone: '',
legalRep: ''
},
projectTypes: ['请选择', '建筑', 'IT', '教育', '制造业'], // 可根据实际项目类型进行扩展
};
},
methods: {
// 处理选择行政区划的变化
onRegionChange(e) {
this.form.region = e.detail.value;
},
// 提交表单
submitForm() {
// 在这里处理表单提交的逻辑
console.log("提交的表单数据:", this.form);
// 你可以进行数据校验,提交到后端等操作
}
}
};
</script>
<style lang="scss" scoped>
.project-add {
padding: 20px 20px 100px 20px;
.form-card {
background-color: white;
padding: 20px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
.form-title {
font-size: 18px;
padding-bottom: 16px;
}
.form-item {
.form-label {
font-size: 14px;
color: #595959;
margin-bottom: 6px;
display: block;
}
margin-bottom: 20px;
.form-content {
position: relative;
padding-bottom: 16px;
border-bottom: 1px solid #f0f0f0;
.form-input {
width: 100%;
height: 30px;
border-radius: 5px;
font-size: 14px;
color: #333;
}
.form-select {
position: absolute;
bottom: 4px;
right: 0;
color: #00B39D;
}
}
}
}
}
</style>