优化组件
This commit is contained in:
weipengfei
parent
778510b9a7
commit
cc6e201c0f
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="component">
|
||||
<view class="title">地区信息</view>
|
||||
<u--form labelPosition="left" :model="formData" :rules="rules" ref="districtForm">
|
||||
<u-form-item label="省" required prop="province" @click="changeCity('province')" borderBottom>
|
||||
<u--input :value="formDataText.province" disabled disabledColor="#fff" placeholder="请选择省"></u--input>
|
||||
@ -231,6 +232,21 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
<style lang="scss">
|
||||
.component{
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
|
||||
&::before {
|
||||
width: 8rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 4rpx;
|
||||
background-color: #3175f9;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view class="">
|
||||
|
||||
<view class="title">种养殖</view>
|
||||
<block v-for="(item, index) in formData">
|
||||
<u--form labelPosition="left" :model="item" :rules="rules" ref="breedingForm">
|
||||
<u-form-item labelWidth="auto" label="耕地总面积" required prop="cultivated_area" borderBottom>
|
||||
@ -252,6 +252,21 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.title {
|
||||
margin-top: 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
|
||||
&::before {
|
||||
width: 8rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 4rpx;
|
||||
background-color: #3175f9;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
}
|
||||
.delete {
|
||||
margin: 22rpx 0;
|
||||
// margin-bottom: 40rpx;
|
||||
|
||||
@ -1,22 +0,0 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<input type="text" v-model="text">
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
text:''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@ -1,6 +1,7 @@
|
||||
<!-- 常住人口 -->
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="title">常住人口</view>
|
||||
<u--form labelPosition="left" :model="residents" :rules="rules" ref="residentsForm">
|
||||
<block value="人口">
|
||||
<block value="人员信息" v-for="(item, index) in residents.family" :key="'user'+index">
|
||||
@ -201,6 +202,21 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.title {
|
||||
margin-top: 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
|
||||
&::before {
|
||||
width: 8rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 4rpx;
|
||||
background-color: #3175f9;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
}
|
||||
.delete {
|
||||
margin: 22rpx 0;
|
||||
// margin-bottom: 40rpx;
|
||||
|
||||
@ -64,7 +64,7 @@
|
||||
<breeding ref="breedingRef"></breeding>
|
||||
</view>
|
||||
</u--form>
|
||||
<button @click="addArchives" type="primary" class="btn">创建</button>
|
||||
<button @click="addArchives" type="primary" class="btn">完成登记</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -1,23 +1,232 @@
|
||||
<template>
|
||||
<view class=""></view>
|
||||
<view class="">
|
||||
<view class="card">
|
||||
<u--form labelPosition="left" :model="formData" :rules="rules" ref="archives">
|
||||
<view class="item">
|
||||
<view class="title">基本信息</view>
|
||||
<u-form-item labelWidth="auto" label="户主姓名" required prop="name" borderBottom>
|
||||
<u--input v-model="formData.name" placeholder="请输入姓名"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item label="性别" required prop="sex" borderBottom>
|
||||
<u-radio-group v-model="formData.sex" style="margin: 16rpx;">
|
||||
<u-radio :customStyle="{marginRight: '16px'}"
|
||||
v-for="(item, index) in [{value:1,label:'男'},{value:0,label:'女'}]" :key="index" :label="item.label"
|
||||
:name="item.value">
|
||||
</u-radio>
|
||||
</u-radio-group>
|
||||
</u-form-item>
|
||||
<u-form-item label="年龄" required prop="age" borderBottom>
|
||||
<u--input v-model="formData.age" placeholder="请输入年龄"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item labelWidth="auto" label="身份证号" required prop="id_card" borderBottom>
|
||||
<u--input v-model="formData.id_card" placeholder="请输入身份证号" type="idcard"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item labelWidth="auto" label="联系方式" required prop="phone" borderBottom>
|
||||
<u--input v-model="formData.phone" placeholder="请输入手机号" type="number"></u--input>
|
||||
</u-form-item>
|
||||
</view>
|
||||
<view class="item">
|
||||
<districtSelector ref="districtSelectorRef"></districtSelector>
|
||||
<u-form-item labelWidth="auto" label="详细地址" required prop="address" borderBottom>
|
||||
<u--input v-model="formData.address" placeholder="请输入详细地址"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item labelWidth="auto" label="汽车是否能到家" required prop="highway" borderBottom>
|
||||
<u-radio-group v-model="formData.highway" style="margin: 16rpx;">
|
||||
<u-radio :customStyle="{marginRight: '16px'}"
|
||||
v-for="(item, index) in [{value:1,label:'是'},{value:0,label:'否'}]" :key="index" :label="item.label"
|
||||
:name="item.value">
|
||||
</u-radio>
|
||||
</u-radio-group>
|
||||
</u-form-item>
|
||||
<block value="智能手机">
|
||||
<u-form-item labelWidth="auto" label="是否使用智能手机" required prop="smart_phone" borderBottom>
|
||||
<u-radio-group v-model="formData.smart_phone" style="margin: 16rpx;">
|
||||
<u-radio :customStyle="{marginRight: '16px'}"
|
||||
v-for="(item, index) in [{value:1,label:'是'},{value:0,label:'否'}]" :key="index" :label="item.label"
|
||||
:name="item.value">
|
||||
</u-radio>
|
||||
</u-radio-group>
|
||||
</u-form-item>
|
||||
<block v-if="formData.smart_phone>0">
|
||||
<u-form-item labelWidth="auto" label="微信号" required borderBottom>
|
||||
<u--input v-model="formData.wechat" placeholder="请输入微信号"></u--input>
|
||||
</u-form-item>
|
||||
</block>
|
||||
</block>
|
||||
</view>
|
||||
<residents ref="residentsRef"></residents>
|
||||
<!-- <breeding ref="breedingRef"></breeding> -->
|
||||
<store></store>
|
||||
</u--form>
|
||||
<button @click="addArchives" type="primary" class="btn">完成更新</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
onLoad() {},
|
||||
onShow() {},
|
||||
methods: {},
|
||||
onPullDownRefresh() {
|
||||
import { Toast } from "../../libs/uniApi"
|
||||
import { informationAdd } from "@/api/information.js"
|
||||
import districtSelector from "@/components/districtSelector/districtSelector.vue" //地区选择器
|
||||
import residents from "@/components/newArchives/residents.vue" // 常住人口
|
||||
import breeding from "@/components/newArchives/breeding.vue" // 种养殖
|
||||
import store from "@/components/newArchives/store.vue" // 开设店铺
|
||||
export default {
|
||||
components:{districtSelector, residents, breeding, store},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
id_card: '254566198003032255',
|
||||
sex: 0,
|
||||
name: '方法',
|
||||
phone: '18555555555', //电话
|
||||
highway: 1,//汽车是否能到家
|
||||
smart_phone: 1,//是否使用智能手机
|
||||
wechat: '15434535', //微信号
|
||||
address: '十分士大夫但是',//家庭地址
|
||||
age: '23',//年龄
|
||||
category_id: '1',
|
||||
category_child: '2',
|
||||
},
|
||||
rules: {
|
||||
phone: {
|
||||
required: true,
|
||||
pattern: /^(1[3456789]\d{9})$/,
|
||||
message: '请输入正确的手机号码',
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
id_card: {
|
||||
required: true,
|
||||
pattern: /^\d{17}[\dX]$|^\d{15}[\dX]$/,
|
||||
message: '请输入正确的身份证号',
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
sex: {
|
||||
type: 'number',
|
||||
max: 1,
|
||||
required: true,
|
||||
message: '请选择男或女',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
age: {
|
||||
type: 'number',
|
||||
required: true,
|
||||
message: '请输入年龄',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
name: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '姓名不能为空',
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
address: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '地址不能为空',
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
highway: {
|
||||
validator: (rule, value, callback )=>{
|
||||
typeof value==='number'?callback():callback('不能为空')
|
||||
},
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
smart_phone: {
|
||||
validator: (rule, value, callback )=>{
|
||||
typeof value==='number'?callback():callback('不能为空')
|
||||
},
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
},
|
||||
}
|
||||
},
|
||||
onLoad() {},
|
||||
onShow() {},
|
||||
methods: {
|
||||
// 新增档案
|
||||
async addArchives() {
|
||||
return Toast('开发中')
|
||||
let flag1 = this.$refs.districtSelectorRef.validate();
|
||||
let flag2 = this.$refs.residentsRef.validate();
|
||||
let flag3 = this.$refs.breedingRef.validate();
|
||||
this.$refs.archives.validate().then(async (e) => {
|
||||
if (e&&flag1&&flag2&&flag3) {
|
||||
uni.showLoading()
|
||||
let districtForm = {
|
||||
area_id:this.$refs.districtSelectorRef.formData.area,
|
||||
street_id:this.$refs.districtSelectorRef.formData.street,
|
||||
village_id:this.$refs.districtSelectorRef.formData.village,
|
||||
brigade_id:this.$refs.districtSelectorRef.formData.brigade,
|
||||
}
|
||||
let res = await informationAdd({
|
||||
...this.formData,
|
||||
...districtForm,
|
||||
...this.$refs.residentsRef.residents,
|
||||
datas:{
|
||||
...this.$refs.breedingRef.formData
|
||||
}
|
||||
});
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "添加成功",
|
||||
success: () => {
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
uni.stopPullDownRefresh()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.card {
|
||||
background-color: #fff;
|
||||
margin: 28rpx;
|
||||
padding: 28rpx;
|
||||
border-radius: 14rpx;
|
||||
|
||||
</style>
|
||||
.item {
|
||||
margin-top: 30rpx;
|
||||
|
||||
&:nth-child(1) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
|
||||
&::before {
|
||||
width: 8rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 4rpx;
|
||||
background-color: #3175f9;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin-top: 32rpx;
|
||||
// margin-bottom: 40rpx;
|
||||
width: 100%;
|
||||
height: 84rpx;
|
||||
background: $theme-oa-color;
|
||||
border-radius: 42rpx 42rpx 42rpx 42rpx;
|
||||
color: #fff;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user