de3a4fa4 by renchao@pashanhoo.com

style:家庭房产

1 parent 700ded5f
No preview for this file type
{
"TITLE": "不动产登记系统",
"SERVERAPI": "/bdcdj",
"ip": "http://192.168.2.38"
"ip": "http://192.168.2.38",
"IDCARDURL": "http://127.0.0.1:33088/function=get_idcard&readnew=0"
}
\ No newline at end of file
......
{
"TITLE": "不动产登记系统",
"SERVERAPI": "/bdcdj",
"ip": "http://192.168.2.38"
}
\ No newline at end of file
{
"TITLE": "不动产登记系统",
"SERVERAPI": "service-bdcdj-th",
"ip": "http://192.168.2.38"
}
\ No newline at end of file
......@@ -20,18 +20,19 @@
</el-col>
</el-row>
</el-form>
<lb-table :column="sqrColumns" key="sqr1" :data="form.sqrList" :maxHeight="200" heightNumSetting
<!-- 申请人 -->
<lb-table :column="sqrColumns" key="sqr1" :data="form.sqrList" :maxHeight="230" heightNumSetting
:pagination="false">
</lb-table>
<!-- 权利人 -->
<b class="title">权利人</b>
<lb-table :column="qlrColumns" key="ql2r" :data="form.qlrList" :maxHeight="200" heightNumSetting
<lb-table :column="qlrColumns" key="ql2r" :data="form.qlrList" :maxHeight="230" heightNumSetting
:pagination="false">
</lb-table>
<div v-show="isSearch">
<b class="title">查询结果</b>
<p>查询编号:{{ form.djSqcxDO.cxbh }}</p>
<lb-table :column="cxjgColumns" :data="form.cxjgList" :maxHeight="200" heightNumSetting :pagination="false">
<lb-table :column="cxjgColumns" :data="form.cxjgList" :maxHeight="230" heightNumSetting :pagination="false">
</lb-table>
</div>
</div>
......@@ -54,193 +55,484 @@
</div>
</template>
<script>
import { addJtfcCxjgXx, getJtfcInfo, printJtcfInfo } from "@/api/sqcx";
import { getPrintTemplateByCode } from "@/api/system";
import { datas, sendThis } from "./addjtfcdata";
import { getLodop } from "@/utils/LodopFuncs"
export default {
props: {
formData: {
type: Object,
default: () => { },
},
},
mounted () {
sendThis(this);
},
data () {
return {
//是否查询
isSearch: false,
//查询结果列表字段
cxjgColumns: datas.columns(),
//申请人列表字段
sqrColumns: datas.sqrCol(),
//权利人列表字段
qlrColumns: datas.qlrCol(),
newData: {
sqrxm: "",
sqrzjlxbm: "",
sqrzjhm: "",
lxdh: "",
inputErr: false,
},
form: {
djSqcxDO: { ycqrgx: "1", cxyt: "" },
sqrList: [],
qlrList: [],
cxjgList: [],
dyjlList: [],
import axios from 'axios'
import store from '@/store/index.js'
import { getLodop } from "@/utils/LodopFuncs"
import { datas } from "./addjtfcdata";
import { getPrintTemplateByCode } from "@/api/system";
import { addJtfcCxjgXx, getJtfcInfo, printJtcfInfo } from "@/api/sqcx";
export default {
props: {
formData: {
type: Object,
default: () => { },
},
};
},
mounted () {
this.form.sqrList = []
this.form.qlrList = []
this.isSearch = false
if (this.formData.sqcxBsm == "") {
this.add("sqr");
this.add("qlr");
} else {
this.loadData();
}
},
watch: {
"form.djSqcxDO.ycqrgx" (val) {
if (val == "1") {
this.form.qlrList = _.cloneDeep(this.form.sqrList);
} else {
this.form.qlrList = [];
this.add("qlr");
}
},
"form.sqrList" (val) {
if (this.form.djSqcxDO.ycqrgx == '1') {
this.form.qlrList = _.cloneDeep(this.form.sqrList)
}
}
},
methods: {
closeDialog () {
this.$popupCacel()
this.form = {
djSqcxDO: { ycqrgx: "1", cxyt: "" },
sqrList: [],
qlrList: [],
cxjgList: [],
dyjlList: [],
data () {
return {
key: 0,
//是否查询
isSearch: false,
//查询结果列表字段
cxjgColumns: datas.columns(),
//申请人列表字段
sqrColumns: [{
width: "60",
renderHeader: (h, scope) => {
return (
<i
class="el-icon-plus pointer"
onClick={() => {
this.handleAddsqr("sqr");
}}
style="color:#409EFF"
></i>
);
},
render: (h, scope) => {
return (
<i
class="el-icon-minus pointer"
onClick={() => {
this.remove(scope.$index, scope.row, "sqr");
}}
></i>
);
},
},
{
width: "150",
label: "身份证读卡器",
render: (h, scope) => {
return (
<div>
<el-button
type="text"
icon="el-icon-edit-outline"
onClick={() => {
this.handleRead(scope.row, 'sqr');
}}
>
读取
</el-button>
</div>
);
},
},
{
width: "150",
prop: "sqrxm",
label: "姓名/名称",
render: (h, scope) => {
return (
<el-input
placeholder="姓名/名称"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
></el-input>
);
},
},
{
prop: "sqrzjlxbm",
label: "证件种类",
render: (h, scope) => {
return (
<el-select
class="width100"
clearable
value={scope.row[scope.column.property]}
onChange={(val) => {
scope.row[scope.column.property] = val;
}}
>
{this.getDictData('A30').map((option) => {
return (
<el-option
label={option.dname}
value={option.dcode}
></el-option>
);
})}
</el-select>
);
},
},
{
prop: "sqrzjhm",
label: "证件号",
render: (h, scope) => {
return (
<el-input
placeholder="证件号"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
maxlength="21"
></el-input>
);
},
},
{
prop: "lxdh",
label: "联系电话",
render: (h, scope) => {
return (
<div class="typePhone">
<el-input
placeholder="联系电话"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
onBlur={(val) => {
vm.teltest(scope.row);
}}
type="tel"
maxlength="11"
></el-input>
<span
v-show={scope.row.inputErr}
style={{
fontSize: "12px",
color: "red",
position: "absolute",
bottom: "-2px",
left: "0",
}}
>
请输入正确手机号
</span>
</div>
);
},
}],
//权利人列表字段
qlrColumns: [{
width: "60",
renderHeader: (h, scope) => {
return (
<i
class="el-icon-plus pointer"
onClick={() => {
this.handleAddqlr();
}}
style="color:#409EFF"
></i>
);
},
render: (h, scope) => {
return (
<i
class="el-icon-minus pointer"
onClick={() => {
this.remove(scope.$index, scope.row, "qlr");
}}
></i>
);
},
},
{
width: "150",
label: "身份证读卡器",
render: (h, scope) => {
return (
<div>
<el-button
type="text"
icon="el-icon-edit-outline"
onClick={() => {
this.handleRead(scope.row, 'qlr');
}}
>
读取
</el-button>
</div>
);
},
},
{
width: "150",
prop: "sqrxm",
label: "姓名/名称",
render: (h, scope) => {
return (
<el-input
placeholder="姓名/名称"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
></el-input>
);
},
},
{
prop: "sqrzjlxbm",
label: "证件种类",
render: (h, scope) => {
return (
<el-select
class="width100"
value={scope.row[scope.column.property]}
onChange={(val) => {
scope.row[scope.column.property] = val;
}}
>
{this.getDictData('A30').map((option) => {
return (
<el-option
label={option.dname}
value={option.dcode}
></el-option>
);
})}
</el-select>
);
},
},
{
prop: "sqrzjhm",
label: "证件号",
render: (h, scope) => {
return (
<el-input
placeholder="证件号"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
maxlength="21"
></el-input>
);
},
},
{
prop: "lxdh",
label: "联系电话",
render: (h, scope) => {
return (
<div class="typePhone">
<el-input
placeholder="联系电话"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
onBlur={(val) => {
this.teltest(scope.row);
}}
type="tel"
maxlength="11"
></el-input>
<span
v-show={scope.row.inputErr}
style={{
fontSize: "12px",
color: "red",
position: "absolute",
bottom: "-2px",
left: "0",
}}
>
请输入正确手机号
</span>
</div>
);
},
}],
newData: {
sqrxm: "",
sqrzjlxbm: "",
sqrzjhm: "",
lxdh: "",
inputErr: false,
},
form: {
djSqcxDO: { ycqrgx: "1", cxyt: "" },
sqrList: [],
qlrList: [],
cxjgList: [],
dyjlList: [],
},
};
},
mounted () {
this.form.sqrList = []
this.form.qlrList = []
this.isSearch = false
if (this.formData.sqcxBsm == "") {
this.add("sqr");
this.add("qlr");
} else {
this.loadData();
}
},
//加载详细信息
loadData () {
this.$startLoading();
getJtfcInfo({ sqcxBsm: this.formData.sqcxBsm }).then((res) => {
this.$endLoading();
if (res.code == 200) {
this.form = res.result;
this.isSearch = true;
watch: {
"form.djSqcxDO.ycqrgx" (val) {
if (val == "1") {
this.form.qlrList = _.cloneDeep(this.form.sqrList);
} else {
this.form.qlrList = [];
this.add("qlr");
}
});
},
//查询结果
queryChick () {
this.$startLoading();
addJtfcCxjgXx(this.form).then((res) => {
this.$endLoading();
if (res.code == 200) {
this.form = res.result;
this.isSearch = true;
this.$parent.queryClick();
},
"form.sqrList" (val) {
if (this.form.djSqcxDO.ycqrgx == '1') {
console.log(val, 'valvalvalval');
this.form.qlrList = _.cloneDeep(val)
}
});
},
//重置
resetClick () {
this.form.djSqcxDO = { ycqrgx: "1", cxyt: "" };
this.form.sqrList = _.cloneDeep([this.newData]);
this.form.qlrList = _.cloneDeep([this.newData]);
this.form.cxjgList = [];
this.form.dyjlList = [];
this.isSearch = false;
}
},
handleRead (scope) { },
//添加申请人或权利人
add (type) {
if (type == "sqr") {
methods: {
// 字典
getDictData (val) {
return store.getters.dictData[val]
},
closeDialog () {
this.$popupCacel()
this.form = {
djSqcxDO: { ycqrgx: "1", cxyt: "" },
sqrList: [],
qlrList: [],
cxjgList: [],
dyjlList: [],
}
},
//加载详细信息
loadData () {
this.$startLoading();
getJtfcInfo({ sqcxBsm: this.formData.sqcxBsm }).then((res) => {
this.$endLoading();
if (res.code == 200) {
this.form = res.result;
this.isSearch = true;
}
});
},
//查询结果
queryChick () {
this.$startLoading();
addJtfcCxjgXx(this.form).then((res) => {
this.$endLoading();
if (res.code == 200) {
this.form = res.result;
this.isSearch = true;
this.$parent.queryClick();
}
});
},
//重置
resetClick () {
this.form.djSqcxDO = { ycqrgx: "1", cxyt: "" };
this.form.sqrList = _.cloneDeep([this.newData]);
this.form.qlrList = _.cloneDeep([this.newData]);
this.form.cxjgList = [];
this.form.dyjlList = [];
this.isSearch = false;
},
handleRead (row, type) {
axios.post(this.BASE_API.IDCARDURL).then(res => {
if (res.data.code == 0) {
let data = res.data.IDCardInfo
row.sqrxm = data.name
row.sqrzjlxbm = '1'
row.sqrzjhm = data.cardID
this.$message({
message: '读取成功!',
type: 'success'
})
if (type == 'sqr') {
this.form.qlrList = _.cloneDeep(this.form.sqrList)
}
console.log(this.form.sqrList);
} else {
this.$message({
message: res.data.message,
type: 'warning'
})
}
})
},
//添加申请人
handleAddsqr () {
this.form.sqrList.push(_.cloneDeep(this.newData));
} else {
},
handleAddqlr () {
this.form.qlrList.push(_.cloneDeep(this.newData));
}
},
//移除申请人或权利人
remove (index, row, type) {
if (type == "sqr") {
this.form.sqrList.splice(index, 1);
} else {
this.form.qlrList.splice(index, 1);
}
},
//电话号码校验
teltest (row) {
const reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
if (row.lxdh == "" || row.lxdh.length <= 10 || !reg.test(row.lxdh)) {
row.inputErr = true;
return false;
} else {
row.inputErr = false;
return true;
}
},
//打印
printResult () {
this.openPrintPrew();
var formdata = new FormData();
formdata.append("sqcxBsm", this.form.djSqcxDO.bsmSqcx);
formdata.append("dylx", '1');
printJtcfInfo(formdata).then(res => {
if (res.code == 200) {
this.form.djSqcxDO.dycs = this.form.djSqcxDO.dycs + 1
},
//移除申请人或权利人
remove (index, row, type) {
console.log(type, 'type');
if (type == "sqr") {
this.form.sqrList.splice(index, 1);
} else {
this.form.qlrList.splice(index, 1);
}
});
},
//打开打印预览
openPrintPrew () {
//根据编号获取对应信息
getPrintTemplateByCode({ tmpno: 'jtfcdys' }).then(res => {
if (res.code == 200) {
let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM'));
LODOP.ADD_PRINT_DATA("ProgramData", res.result.tmpcontent); //装载模板
LODOP.PREVIEW();
},
//电话号码校验
teltest (row) {
const reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
if (row.lxdh == "" || row.lxdh.length <= 10 || !reg.test(row.lxdh)) {
row.inputErr = true;
return false;
} else {
row.inputErr = false;
return true;
}
})
}
},
};
},
//打印
printResult () {
this.openPrintPrew();
var formdata = new FormData();
formdata.append("sqcxBsm", this.form.djSqcxDO.bsmSqcx);
formdata.append("dylx", '1');
printJtcfInfo(formdata).then(res => {
if (res.code == 200) {
this.form.djSqcxDO.dycs = this.form.djSqcxDO.dycs + 1
}
});
},
//打开打印预览
openPrintPrew () {
//根据编号获取对应信息
getPrintTemplateByCode({ tmpno: 'jtfcdys' }).then(res => {
if (res.code == 200) {
let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM'));
LODOP.ADD_PRINT_DATA("ProgramData", res.result.tmpcontent); //装载模板
LODOP.PREVIEW();
}
})
}
},
};
</script>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
@import "~@/styles/public.scss";
.title {
padding-bottom: 10px;
margin-bottom: 10px;
display: block;
border-bottom: 1px solid $borderColor;
}
@import "~@/styles/mixin.scss";
@import "~@/styles/public.scss";
.jtfccx-edit {
@include flex;
flex-direction: column;
overflow-y: hidden;
max-height: 85vh;
padding: 0 2px;
.title {
padding-bottom: 10px;
margin-bottom: 10px;
display: block;
border-bottom: 1px solid $borderColor;
}
.jtfccx-edit {
@include flex;
flex-direction: column;
overflow-y: hidden;
max-height: 85vh;
padding: 0 2px;
.submit-button {
text-align: center;
height: 52px;
padding-top: 10px;
background-color: #fff;
.submit-button {
text-align: center;
height: 52px;
padding-top: 10px;
background-color: #fff;
}
}
}
</style>
......
import filter from '@/utils/filter.js'
let vm = null
const sendThis = (_this) => {
vm = _this
}
class data extends filter {
constructor() {
super()
......@@ -77,284 +72,8 @@ class data extends filter {
}
]
}
sqrCol () {
return [
{
width: "60",
renderHeader: (h, scope) => {
return (
<i
class="el-icon-plus pointer"
onClick={() => {
vm.add("sqr");
}}
style="color:#409EFF"
></i>
);
},
render: (h, scope) => {
return (
<i
class="el-icon-minus pointer"
onClick={() => {
vm.remove(scope.$index, scope.row, "sqr");
}}
></i>
);
},
},
{
width: "150",
label: "身份证读卡器",
render: (h, scope) => {
return (
<div>
<el-button
type="text"
icon="el-icon-edit-outline"
onClick={() => {
vm.handleRead(scope);
}}
>
读取
</el-button>
</div>
);
},
},
{
width: "150",
prop: "sqrxm",
label: "姓名/名称",
render: (h, scope) => {
return (
<el-input
placeholder="姓名/名称"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
></el-input>
);
},
},
{
prop: "sqrzjlxbm",
label: "证件种类",
render: (h, scope) => {
return (
<el-select
class="width100"
clearable
value={scope.row[scope.column.property]}
onChange={(val) => {
scope.row[scope.column.property] = val;
}}
>
{this.getDictData('A30').map((option) => {
return (
<el-option
label={option.dname}
value={option.dcode}
></el-option>
);
})}
</el-select>
);
},
},
{
prop: "sqrzjhm",
label: "证件号",
render: (h, scope) => {
return (
<el-input
placeholder="证件号"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
maxlength="21"
></el-input>
);
},
},
{
prop: "lxdh",
label: "联系电话",
render: (h, scope) => {
return (
<div class="typePhone">
<el-input
placeholder="联系电话"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
onBlur={(val) => {
vm.teltest(scope.row);
}}
type="tel"
maxlength="11"
></el-input>
<span
v-show={scope.row.inputErr}
style={{
fontSize: "12px",
color: "red",
position: "absolute",
bottom: "-2px",
left: "0",
}}
>
请输入正确手机号
</span>
</div>
);
},
},
]
}
qlrCol () {
return [
{
width: "60",
renderHeader: (h, scope) => {
return (
<i
class="el-icon-plus pointer"
onClick={() => {
vm.add("qlr");
}}
style="color:#409EFF"
></i>
);
},
render: (h, scope) => {
return (
<i
class="el-icon-minus pointer"
onClick={() => {
vm.remove(scope.$index, scope.row, "qlr");
}}
></i>
);
},
},
{
width: "150",
label: "身份证读卡器",
render: (h, scope) => {
return (
<div>
<el-button
type="text"
icon="el-icon-edit-outline"
onClick={() => {
vm.handleRead(scope);
}}
>
读取
</el-button>
</div>
);
},
},
{
width: "150",
prop: "sqrxm",
label: "姓名/名称",
render: (h, scope) => {
return (
<el-input
placeholder="姓名/名称"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
></el-input>
);
},
},
{
prop: "sqrzjlxbm",
label: "证件种类",
render: (h, scope) => {
return (
<el-select
class="width100"
value={scope.row[scope.column.property]}
onChange={(val) => {
scope.row[scope.column.property] = val;
}}
>
{this.getDictData('A30').map((option) => {
return (
<el-option
label={option.dname}
value={option.dcode}
></el-option>
);
})}
</el-select>
);
},
},
{
prop: "sqrzjhm",
label: "证件号",
render: (h, scope) => {
return (
<el-input
placeholder="证件号"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
maxlength="21"
></el-input>
);
},
},
{
prop: "lxdh",
label: "联系电话",
render: (h, scope) => {
return (
<div class="typePhone">
<el-input
placeholder="联系电话"
value={scope.row[scope.column.property]}
onInput={(val) => {
scope.row[scope.column.property] = val;
}}
onBlur={(val) => {
vm.teltest(scope.row);
}}
type="tel"
maxlength="11"
></el-input>
<span
v-show={scope.row.inputErr}
style={{
fontSize: "12px",
color: "red",
position: "absolute",
bottom: "-2px",
left: "0",
}}
>
请输入正确手机号
</span>
</div>
);
},
},
]
}
}
let datas = new data()
export {
datas,
sendThis
datas
}
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-06-14 09:47:38
* @LastEditTime: 2023-06-14 13:14:26
-->
<template>
<div>
......@@ -195,9 +195,7 @@
// 身份证读取
readClick (row) {
var httpurl = "http://127.0.0.1:33088/";
var url = httpurl + "function=get_idcard&readnew=0"
axios.post(url).then(res => {
axios.post(this.BASE_API.IDCARDURL).then(res => {
if (res.data.code == 0) {
let data = res.data.IDCardInfo
row.sqrmc = data.name
......