Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
84cf8218 by 杨威
Options

宗地表单和权利性质表单验证

1 parent 089a348b
Inline Side-by-side
Showing 2 changed files with 263 additions and 89 deletions
......@@ -105,9 +105,11 @@
:disabled="formData.qszt!='0'"
v-model="childItem.tdsyqssj"
type="date"
ref="tdsyqssj"
:picker-options="childItem.pickerStart"
value-format="yyyy-MM-dd"
placeholder="选择日期"
@blur="inputBlur($event,true)"
@input="startTime(index,childIndex)"
>
</el-date-picker>
......@@ -151,7 +153,11 @@
<li>
<input
type="text"
ref="syqx"
@blur="inputBlur($event,false)"
maxlength="3"
onkeyup="value=value.replace(/[^\d]/g,'')"
@input="sumTime(index,childIndex,childItem.syqx,childItem.syqx)"
:disabled="formData.qszt!='0'"
v-model="childItem.syqx"
class="formInput"
......@@ -212,8 +218,10 @@
:disabled="formData.qszt!='0'"
v-model="childItem.tdsyjssj"
type="date"
ref="tdsyjssj"
@blur="inputBlur($event,true)"
:picker-options="childItem.pickerEnd"
@input="endTime(index,childIndex)"
@input="endTime(index,childIndex,$event)"
value-format="yyyy-MM-dd"
placeholder="选择日期"
>
......@@ -234,6 +242,7 @@
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
ref="qlxzdm"
v-model="items.qlxzdm"
></el-select-tree>
</div>
......@@ -301,6 +310,7 @@ export default {
},
],
outNum: 0,
rulesResult:true,//权利性质表单校验结果
};
},
created() {},
......@@ -322,11 +332,23 @@ export default {
}
if (Object.keys(startTime).length > 0 && Object.keys(endTime).length > 0) {
let startYear= new Date(startTime).getFullYear();
let endYear=new Date(endTime).getFullYear();
this.countList[index].list[childIndex].syqx=endYear-startYear;
let endYear=new Date(endTime).getFullYear();
//年限暂时不算
// this.countList[index].list[childIndex].syqx=endYear-startYear;
}
},
endTime(index,childIndex){
sumTime(index,childIndex,syqx,e){
console.log(e,'eeee');
this.$refs.syqx.forEach((item,index)=>{
if(item.value == syqx){
this.$refs.tdsyjssj[index].$el.style.border=""
}
})
let startTime = this.countList[index].list[childIndex].tdsyqssj;
this.countList[index].list[childIndex].tdsyjssj = Number(startTime.substring(0,4))+Number(syqx)+startTime.slice(4,10);
},
endTime(index,childIndex,e){
console.log(e,'eeeeee');
let startTime = this.countList[index].list[childIndex].tdsyqssj;
let endTime = this.countList[index].list[childIndex].tdsyjssj;
this.countList[index].list[childIndex].pickerStart={
......@@ -341,7 +363,7 @@ export default {
if (Object.keys(startTime).length > 0 && Object.keys(endTime).length > 0) {
let startYear= new Date(startTime).getFullYear();
let endYear=new Date(endTime).getFullYear();
this.countList[index].list[childIndex].syqx=endYear-startYear;
// this.countList[index].list[childIndex].syqx=endYear-startYear;
}
},
//外层操作
......@@ -432,8 +454,94 @@ export default {
});
},
getQlxzDataList() {
console.log(this.countList,'this.countList');
return this.countList;
},
getRules(){
let rules = [];
console.log(this.$refs.tdsyqssj,'this.$refs.qlxzdm');
console.log(this.countList,'this.countList');
let temp = 0;
this.countList.forEach((item,index)=>{
rules.push({
data:this.countList[index].qlxzdm,
name:'权利性质',
dom:this.$refs.qlxzdm[index],
rule: /^\s*$/g, //非空
})
item.list.forEach((j,ind)=>{
rules.push(
{
data:item.list[ind].tdsyqssj,
name:'土地使用起始时间',
dom:this.$refs.tdsyqssj[temp+ind],
// val:this.$refs.tdsyqssj[temp+ind].value,
rule: /^\s*$/g, //非空
},
{
data:item.list[ind].syqx,
name:'使用期限',
dom:this.$refs.syqx[temp+ind],
// val:this.$refs.syqx[temp+ind].value,
rule: /^\s*$/g, //非空
},
{
data:item.list[ind].tdsyjssj,
name:'土地使用结束时间',
dom:this.$refs.tdsyjssj[temp+ind],
// val:this.$refs.tdsyjssj[temp+ind].value,
rule: /^\s*$/g, //非空
},
)
if (ind == item.list.length-1) {
temp += item.list.length;
}
})
})
this.rulesResult = true;
rules.forEach(item=>{
if(item.rule.test(item.data) || item.data == null){
if(item.dom.$el){
item.dom.$el.style.border = '1px solid red';
}else{
item.dom.style.border = '1px solid red';
}
// this.$message({
// // message: item.name+'不能为空',
// message: '不能为空',
// type: "warning",
// });
this.rulesResult = false;
return false
}
})
// console.log(rules,'rules');
},
getRulesResult(){
return this.rulesResult
},
inputBlur(e,flag){
if (flag) {
if(e.value!=''){
e.$el.style.border=""
}else{
e.$el.style.border="1px solid red"
}
}else{
if(e.target.value!=''){
e.target.style.border=""
}else{
e.target.style.border="1px solid red"
}
}
},
//后续考虑在点击加减号时操作校验规则
// addRules(){
// this.tempQssj.push()
// },
// minusRules(){
// },
},
};
</script>
......
......@@ -81,7 +81,7 @@
</td>
<td colspan="2">宗地特征码<i class="requisite">*</i></td>
<td colspan="4">
<el-select class="formSelect" :disabled="formData.qszt!='0'" v-model="formData.zdtzmbsm">
<el-select class="formSelect" ref="zdtzm" :disabled="formData.qszt!='0'" v-model="formData.zdtzmbsm">
<el-option
v-for="item in $store.state.zdtzmList"
:key="item.bsm"
......@@ -107,7 +107,7 @@
</td>
<td colspan="2">宗地代码<i class="requisite">*</i></td>
<td colspan="4" class="psr">
<input :disabled="formData.qszt!='0'" maxlength="19"
<input :disabled="formData.qszt!='0'" @blur="inputBlur($event)" ref="zddm" on maxlength="19"
type="text"
class="formInput percent80"
v-model="formData.zddm"
......@@ -126,8 +126,8 @@
<td colspan="2">不动产单元号<i class="requisite">*</i></td>
<td colspan="4" class="psr">
<input
type="text" :disabled="formData.qszt!='0'" maxlength="28"
class="formInput percent80"
type="text" :disabled="formData.qszt!='0'" @blur="inputBlur($event)" ref="bdcdyh" maxlength="28"
class="formInput"
v-model="formData.bdcdyh"
/>
<!-- <el-button type="warning" :disabled="formData.qszt!='0'" class="createBtn">生成</el-button> -->
......@@ -136,7 +136,7 @@
<tr>
<td colspan="2">坐落<i class="requisite">*</i></td>
<td colspan="4">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zl" />
<input type="text" :disabled="formData.qszt!='0'" @blur="inputBlur($event)" ref="zl" class="formInput" v-model="formData.zl" />
</td>
<td colspan="2">项目名称</td>
<td colspan="4" class="psr">
......@@ -278,25 +278,25 @@
<td colspan="2" rowspan="4">宗地四至</td>
<td colspan="2">北至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszb" />
<input type="text" @blur="inputBlur($event)" ref="zdszb" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszb" />
</td>
</tr>
<tr>
<td colspan="2">东至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszd" />
<input type="text" @blur="inputBlur($event)" ref="zdszd" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszd" />
</td>
</tr>
<tr>
<td colspan="2">南至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszn" />
<input type="text" @blur="inputBlur($event)" ref="zdszn" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszn" />
</td>
</tr>
<tr>
<td colspan="2">西至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszx" />
<input type="text" @blur="inputBlur($event)" ref="zdszx" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdszx" />
</td>
</tr>
<tr>
......@@ -307,21 +307,21 @@
<tr>
<td colspan="2" rowspan="2">批准面积(㎡)</td>
<td colspan="2" rowspan="2">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.pzmj" />
<input type="text" :disabled="formData.qszt!='0'" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="formInput" v-model="formData.pzmj" />
</td>
<td colspan="2" rowspan="2">宗地面积(㎡)</td>
<td colspan="2" rowspan="2">宗地面积(㎡)<i class="requisite">*</i></td>
<td colspan="2" rowspan="2">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.zdmj" />
<input type="text" :disabled="formData.qszt!='0'" @blur="inputBlur($event)" ref="zdmj" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="formInput" v-model="formData.zdmj" />
</td>
<td colspan="2">建筑占地总面积</td>
<td colspan="2">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.jzzdzmj" />
<input type="text" :disabled="formData.qszt!='0'" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="formInput" v-model="formData.jzzdzmj" />
</td>
</tr>
<tr>
<td colspan="2">建筑面积(㎡)</td>
<td colspan="2">
<input type="text" :disabled="formData.qszt!='0'" class="formInput" v-model="formData.jzzmj" />
<input type="text" :disabled="formData.qszt!='0'" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="formInput" v-model="formData.jzzmj" />
</td>
</tr>
<tr>
......@@ -384,30 +384,7 @@ export default {
props: {},
data() {
return {
// rules: {
// hdmc: [
// { required: true, message: '请输入活动名称', trigger: 'blur' },
// { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
// ],
// xzq: [
// { required: true, message: '请选择活行政区', trigger: 'change' }
// ],
// date1: [
// { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
// ],
// date2: [
// { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
// ],
// type: [
// { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
// ],
// resource: [
// { required: true, message: '请选择活动资源', trigger: 'change' }
// ],
// desc: [
// { required: true, message: '请填写活动形式', trigger: 'blur' }
// ]
// },
rules: [],
rjl:'',
jzmd:'',
jzxg:'',
......@@ -501,6 +478,10 @@ export default {
this.formData = res.result;
console.log(res.result,'res.result');
this.getXzqData(res.result.xzqbsm,res.result.djqbsm);
//如果没有宗地代码，自动生成
if(res.result.zddm == null){
this.generatorCode()
}
//判断容密高是否为区间值，如果是区间值，则将校验值置为'-'并给rjl，jzmd，jzxg赋值
this.rjl = this.isInterval(this.formData.jyrjl) ? this.formData.jyrjl : '';
this.formData.jyrjl = this.isInterval(this.formData.jyrjl) ? '-' : this.formData.jyrjl;
......@@ -646,10 +627,68 @@ export default {
updateZDxx(formData) {
//获取权利性质数据
this.formData.list = this.$refs.qlxzModule.getQlxzDataList();
this.$refs.qlxzModule.getRules();
console.log(this.$refs.qlxzModule.getRulesResult(),'this.$refs.qlxzModule.getRules()');
//判断容密高是否为区间值，如果是区间值，则将输入框的值赋予
this.formData.jyrjl = this.isInterval(this.formData.jyrjl) ? this.rjl : this.formData.jyrjl;
this.formData.jyjzmd = this.isInterval(this.formData.jyjzmd) ? this.jzmd : this.formData.jyjzmd;
this.formData.jyjzxg = this.isInterval(this.formData.jyjzxg) ? this.jzxg : this.formData.jyjzxg;
this.rules= [
{
data:this.formData.zdtzmbsm,
name:'宗地特征码',
dom:this.$refs.zdtzm,
rule: /^\s*$/g, //非空
},
{
data:this.formData.zddm,
name:'宗地代码',
dom:this.$refs.zddm,
rule: /^\s*$/g, //非空
},
{
data:this.formData.bdcdyh,
name:'不动产单元号',
dom:this.$refs.bdcdyh,
rule: /^\s*$/g, //非空
},
{
data:this.formData.zl,
name:'坐落',
dom:this.$refs.zl,
rule: /^\s*$/g, //非空
},
{
data:this.formData.zdszd,
name:'宗地东至',
dom:this.$refs.zdszd,
rule: /^\s*$/g, //非空
},
{
data:this.formData.zdszb,
name:'宗地北至',
dom:this.$refs.zdszb,
rule: /^\s*$/g, //非空
},
{
data:this.formData.zdszx,
name:'宗地西至',
dom:this.$refs.zdszx,
rule: /^\s*$/g, //非空
},
{
data:this.formData.zdszn,
name:'宗地南至',
dom:this.$refs.zdszn,
rule: /^\s*$/g, //非空
},
{
data:this.formData.zdmj,
name:'宗地面积',
dom:this.$refs.zdmj,
rule: /^\s*$/g, //非空
},
]
//判断宗地代码和不动产单元号是否手动修改过（宗地代码和不动产单元号的前14位是否和底盘代码一致）
if(this.formData.zddm.substring(0,14) != this.dpdm || this.formData.bdcdyh.substring(0,14) != this.dpdm){
this.$message({
......@@ -657,60 +696,87 @@ export default {
type: "warning",
});
}else{
// FIXME:表单验证错误
/* this.$refs['ruleForm'].validate((valid) => {
debugger
if (valid) {
alert('submit!');
} else {
alert("error submit")
return false;
// console.log(this.rules,'rules');
let flag = true;
this.rules.forEach(item=>{
if(item.rule.test(item.data) || item.data == null){
if(item.dom.$el){
item.dom.$el.style.border = '1px solid red';
}else{
item.dom.style.border = '1px solid red';
}
// this.$message({
// // message: item.name+'不能为空',
// message: '不能为空',
// type: "warning",
// });
flag = false;
return false
}
});*/
updateQjZdjbxx(this.formData)
.then((res) => {
if (res.code == 200) {
console.log(res);
this.$message({
message: '保存成功',
type: "success",
});
// 保存成功再次查询
this.getZdjbxxData(this.$store.state.zdbsm);
} else {
this.$message({
message: res.message,
type: "warning",
});
})
this.$nextTick(()=>{
if(flag){
//宗地面积处理
this.formData.zdmj = this.formData.zdmj.replace(/[^\d\.]/g,'')
updateQjZdjbxx(this.formData)
.then((res) => {
if (res.code == 200) {
console.log(res);
this.$message({
message: '保存成功',
type: "success",
});
// 保存成功再次查询
this.getZdjbxxData(this.$store.state.zdbsm);
} else {
this.$message({
message: res.message,
type: "warning",
});
}
})
.catch((error) => {});
//保存到空间库里面
var self = this;
for(var key in this.geoAttributes){
if(key == "BSM"){
self.geoAttributes[key] = this.$store.state.zdbsm
}else if(key == 'QLSDFS'){
var qlsdfsList = self.$store.state.qlsdfsList,value = self.formData.qlsdfs;
var qlsdfs = qlsdfsList.filter(item => {
return item.bsm == value;
})
self.geoAttributes[key] = qlsdfs[0] ? qlsdfs[0].mc:"";
}else {
var formKay = key.toLowerCase();
self.geoAttributes[key] = self.formData[formKay];
}
}
})
.catch((error) => {});
//保存到空间库里面
var self = this;
for(var key in this.geoAttributes){
if(key == "BSM"){
self.geoAttributes[key] = this.$store.state.zdbsm
}else if(key == 'QLSDFS'){
var qlsdfsList = self.$store.state.qlsdfsList,value = self.formData.qlsdfs;
var qlsdfs = qlsdfsList.filter(item => {
return item.bsm == value;
})
self.geoAttributes[key] = qlsdfs[0] ? qlsdfs[0].mc:"";
}else {
var formKay = key.toLowerCase();
self.geoAttributes[key] = self.formData[formKay];
self.updAttributes(this.$store.state.zdbsm,'zd',this.geoAttributes,function (res) {
console.log("属性保存完成!!");
});
}else{
this.$message({
// message: item.name+'不能为空',
message: '请完善表单后再继续操作',
type: "warning",
});
}
}
self.updAttributes(this.$store.state.zdbsm,'zd',this.geoAttributes,function (res) {
console.log("属性保存完成!!");
});
})
}
},
inputBlur(e){
if(e.target.value!=''){
e.target.style.border=""
}else{
e.target.style.border="1px solid red"
}
},
//提交宗地基本信息
submitZDxx(){
let data={
......