4e70d2b5 by renchao@pashanhoo.com

style:房屋明细查询样式修改

1 parent 6f57d50a
1 <template> 1 <template>
2 <dialogBox title="房屋明细查询" @closeDialog="closeDialog" width="70%" :isButton="false" v-model="myValue"> 2 <dialogBox title="房屋明细查询" @closeDialog="closeDialog" width="75%" :isButton="false" v-model="myValue">
3 <el-steps :active="activeStep" finish-status="success"> 3 <el-steps :active="activeStep" finish-status="success">
4 <el-step title="条件录入"></el-step> 4 <el-step title="条件录入"></el-step>
5 <el-step title="结果查询"></el-step> 5 <el-step title="结果查询"></el-step>
6 <el-step title="结果展示"></el-step> 6 <el-step title="结果展示"></el-step>
7 </el-steps> 7 </el-steps>
8 <div v-if="isSearch"> 8 <div v-if="isSearch">
9 <dydjbInfo ref="dydjbInfo"/> 9 <dydjbInfo ref="dydjbInfo" />
10 </div> 10 </div>
11 <div class="jtfccx-edit" v-else> 11 <div class="jtfccx-edit" v-else>
12 <div class="jtfccx-edit-con"> 12 <div class="jtfccx-edit-con">
13 <b class="title"></b> 13 <b class="title"></b>
14 <el-form :model="form" label-width="120px"> 14 <el-form :model="form" label-width="110px">
15 <el-row> 15 <el-row>
16 <el-col :span="6"> 16 <el-col :span="6">
17 <el-form-item label="查询用途" label-width="90px"> 17 <el-form-item label="查询用途" label-width="90px">
18 <el-input v-model="form.djSqcxDO.cxyt" class="width200px"></el-input> 18 <el-input v-model="form.djSqcxDO.cxyt" class="width100"></el-input>
19 </el-form-item> 19 </el-form-item>
20 </el-col> 20 </el-col>
21 <el-col :span="6"> 21 <el-col :span="8">
22 <el-form-item label="不动产权证号" label-width="120px"> 22 <el-form-item label="不动产权证号">
23 <el-input v-model="form.djSqcxDO.bdcqzh" class="width200px"></el-input> 23 <el-input v-model="form.djSqcxDO.bdcqzh" class="width100"></el-input>
24 </el-form-item> 24 </el-form-item>
25 </el-col> 25 </el-col>
26 <el-col :span="12"> 26 <el-col :span="10">
27 <el-form-item label="与产权人的关系"> 27 <el-form-item label="与产权人的关系">
28 <el-radio-group v-model="form.djSqcxDO.ycqrgx"> 28 <el-radio-group v-model="form.djSqcxDO.ycqrgx">
29 <el-radio label="1">房屋权利人</el-radio> 29 <el-radio label="1">房屋权利人</el-radio>
...@@ -43,9 +43,9 @@ ...@@ -43,9 +43,9 @@
43 :pagination="false"> 43 :pagination="false">
44 </lb-table> 44 </lb-table>
45 <div class="submit-button" style="padding-bottom:50px"> 45 <div class="submit-button" style="padding-bottom:50px">
46 <el-button @click="resetClick" v-show="!isSearch">重置</el-button> 46 <el-button @click="resetClick" v-show="!isSearch">重置</el-button>
47 <el-button type="primary" @click="queryChick" v-show="!isSearch">查询</el-button> 47 <el-button type="primary" @click="queryChick" v-show="!isSearch">查询</el-button>
48 <el-button @click="closeDialog">关闭</el-button> 48 <el-button @click="closeDialog">关闭</el-button>
49 </div> 49 </div>
50 </div> 50 </div>
51 </div> 51 </div>
...@@ -53,230 +53,230 @@ ...@@ -53,230 +53,230 @@
53 </template> 53 </template>
54 54
55 <script> 55 <script>
56 import { addFwmxCxjgXx, getFwmxInfo,printJtcfInfo } from "@/api/jtfc.js"; 56 import { addFwmxCxjgXx, getFwmxInfo, printJtcfInfo } from "@/api/jtfc.js";
57 import { getPrintTemplateByCode } from "@/api/print"; 57 import { getPrintTemplateByCode } from "@/api/print";
58 import { datas, sendThis } from "./dydjbdata"; 58 import { datas, sendThis } from "./dydjbdata";
59 import { getLodop } from "@/utils/LodopFuncs" 59 import { getLodop } from "@/utils/LodopFuncs"
60 import dydjbInfo from "./dydjbInfo.vue"; 60 import dydjbInfo from "./dydjbInfo.vue";
61 import { mapGetters } from "vuex"; 61 import { mapGetters } from "vuex";
62 export default { 62 export default {
63 computed: { 63 computed: {
64 ...mapGetters(["dictData"]), 64 ...mapGetters(["dictData"]),
65 }, 65 },
66 components: { dydjbInfo }, 66 components: { dydjbInfo },
67 props: { 67 props: {
68 value: { type: Boolean, default: false }, 68 value: { type: Boolean, default: false },
69 sqcxBsm: { type: String, default: "" }, 69 sqcxBsm: { type: String, default: "" },
70 }, 70 },
71 mounted () { 71 mounted () {
72 sendThis(this); 72 sendThis(this);
73 }, 73 },
74 data () { 74 data () {
75 return { 75 return {
76 activeStep: 0, 76 activeStep: 0,
77 myValue: this.value, 77 myValue: this.value,
78 //是否查询 78 //是否查询
79 isSearch: false, 79 isSearch: false,
80 //查询结果列表字段 80 //查询结果列表字段
81 cxjgColumns: datas.columns(), 81 cxjgColumns: datas.columns(),
82 //申请人列表字段 82 //申请人列表字段
83 sqrColumns: datas.sqrCol(), 83 sqrColumns: datas.sqrCol(),
84 //权利人列表字段 84 //权利人列表字段
85 qlrColumns: datas.qlrCol(), 85 qlrColumns: datas.qlrCol(),
86 newData: { 86 newData: {
87 sqrxm: "", 87 sqrxm: "",
88 sqrzjlxbm: "", 88 sqrzjlxbm: "",
89 sqrzjhm: "", 89 sqrzjhm: "",
90 lxdh: "", 90 lxdh: "",
91 inputErr: false, 91 inputErr: false,
92 }, 92 },
93 form: { 93 form: {
94 djSqcxDO: { ycqrgx: "1", cxyt: "",bdcqzh: "" }, 94 djSqcxDO: { ycqrgx: "1", cxyt: "", bdcqzh: "" },
95 sqrList: [], 95 sqrList: [],
96 qlrList: [], 96 qlrList: [],
97 cxjgList: [], 97 cxjgList: [],
98 dyjlList: [], 98 dyjlList: [],
99 },
100 };
101 },
102 watch: {
103 value (val) {
104 this.myValue = val;
105 let that = this
106 if (val) {
107 this.form.sqrList = []
108 this.form.qlrList = []
109 this.isSearch = false
110 if (this.sqcxBsm == "") {
111 that.add("sqr");
112 that.add("qlr");
113 } else {
114 that.loadData();
115 }
116 }
99 }, 117 },
100 }; 118 "form.djSqcxDO.ycqrgx" (val) {
101 }, 119 if (val == "1") {
102 watch: { 120 this.form.qlrList = _.cloneDeep(this.form.sqrList);
103 value (val) {
104 this.myValue = val;
105 let that = this
106 if (val) {
107 this.form.sqrList = []
108 this.form.qlrList = []
109 this.isSearch = false
110 if (this.sqcxBsm == "") {
111 that.add("sqr");
112 that.add("qlr");
113 } else { 121 } else {
114 that.loadData(); 122 this.form.qlrList = [];
123 this.add("qlr");
124 }
125 },
126 "form.sqrList" (val) {
127 if (this.form.djSqcxDO.ycqrgx == '1') {
128 this.form.qlrList = _.cloneDeep(this.form.sqrList)
115 } 129 }
116 } 130 }
117 }, 131 },
118 "form.djSqcxDO.ycqrgx" (val) { 132 methods: {
119 if (val == "1") { 133 /**
120 this.form.qlrList = _.cloneDeep(this.form.sqrList); 134 * @description: closeDialog
121 } else { 135 * @author: renchao
122 this.form.qlrList = []; 136 */
123 this.add("qlr"); 137 closeDialog () {
124 } 138 this.$emit("input", false);
125 }, 139 this.activeStep = 0;
126 "form.sqrList" (val) { 140 this.form = {
127 if (this.form.djSqcxDO.ycqrgx == '1') { 141 djSqcxDO: { ycqrgx: "1", cxyt: "", bdcqzh: "" },
128 this.form.qlrList = _.cloneDeep(this.form.sqrList) 142 sqrList: [],
129 } 143 qlrList: [],
130 } 144 cxjgList: [],
131 }, 145 dyjlList: [],
132 methods: { 146 }
133 /** 147 },
134 * @description: closeDialog 148 //加载详细信息
135 * @author: renchao 149 /**
136 */ 150 * @description: 加载详细信息
137 closeDialog () { 151 * @author: renchao
138 this.$emit("input", false); 152 */
139 this.activeStep = 0; 153 loadData () {
140 this.form = { 154 this.$startLoading();
141 djSqcxDO: { ycqrgx: "1", cxyt: "" ,bdcqzh: ""}, 155 getFwmxInfo({ sqcxBsm: this.sqcxBsm }).then((res) => {
142 sqrList: [], 156 this.$endLoading();
143 qlrList: [], 157 if (res.code == 200) {
144 cxjgList: [], 158 this.activeStep = 2;
145 dyjlList: [], 159 this.isSearch = true;
146 } 160 this.$nextTick(() => {
147 }, 161 this.$refs.dydjbInfo.setResult(res.result)
148 //加载详细信息 162 })
149 /** 163 }
150 * @description: 加载详细信息 164 });
151 * @author: renchao 165 },
152 */ 166 //查询结果
153 loadData () { 167 /**
154 this.$startLoading(); 168 * @description: 查询结果
155 getFwmxInfo({ sqcxBsm: this.sqcxBsm }).then((res) => { 169 * @author: renchao
156 this.$endLoading(); 170 */
157 if (res.code == 200) { 171 queryChick () {
158 this.activeStep = 2; 172 this.$startLoading();
173 this.activeStep = 1;
174 addFwmxCxjgXx(this.form).then((res) => {
175 this.$endLoading();
176 if (res.code == 200) {
177 this.activeStep = 2;
159 this.isSearch = true; 178 this.isSearch = true;
160 this.$nextTick(() => { 179 this.$nextTick(() => {
161 this.$refs.dydjbInfo.setResult(res.result) 180 this.$refs.dydjbInfo.setResult(res.result)
162 }) 181 })
182 this.$parent.queryClick();
183 }
184 });
185 },
186 //重置
187 /**
188 * @description: 重置
189 * @author: renchao
190 */
191 resetClick () {
192 this.form.djSqcxDO = { ycqrgx: "1", cxyt: "", bdcqzh: "" };
193 this.form.sqrList = _.cloneDeep([this.newData]);
194 this.form.qlrList = _.cloneDeep([this.newData]);
195 this.form.cxjgList = [];
196 this.form.dyjlList = [];
197 this.isSearch = false;
198 },
199 /**
200 * @description: handleRead
201 * @author: renchao
202 */
203 handleRead (scope) { },
204 //添加申请人或权利人
205 /**
206 * @description: 添加申请人或权利人
207 * @param {*} type
208 * @author: renchao
209 */
210 add (type) {
211 if (type == "sqr") {
212 this.form.sqrList.push(_.cloneDeep(this.newData));
213 } else {
214 this.form.qlrList.push(_.cloneDeep(this.newData));
163 } 215 }
164 }); 216 },
165 }, 217 //移除申请人或权利人
166 //查询结果 218 /**
167 /** 219 * @description: 移除申请人或权利人
168 * @description: 查询结果 220 * @param {*} index
169 * @author: renchao 221 * @param {*} row
170 */ 222 * @param {*} type
171 queryChick () { 223 * @author: renchao
172 this.$startLoading(); 224 */
173 this.activeStep = 1; 225 remove (index, row, type) {
174 addFwmxCxjgXx(this.form).then((res) => { 226 if (type == "sqr") {
175 this.$endLoading(); 227 this.form.sqrList.splice(index, 1);
176 if (res.code == 200) { 228 } else {
177 this.activeStep = 2; 229 this.form.qlrList.splice(index, 1);
178 this.isSearch = true;
179 this.$nextTick(() => {
180 this.$refs.dydjbInfo.setResult(res.result)
181 })
182 this.$parent.queryClick();
183 } 230 }
184 }); 231 },
185 }, 232 //电话号码校验
186 //重置 233 /**
187 /** 234 * @description: 电话号码校验
188 * @description: 重置 235 * @param {*} row
189 * @author: renchao 236 * @author: renchao
190 */ 237 */
191 resetClick () { 238 teltest (row) {
192 this.form.djSqcxDO = { ycqrgx: "1", cxyt: "",bdcqzh: "" }; 239 const reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
193 this.form.sqrList = _.cloneDeep([this.newData]); 240 if (row.lxdh == "" || row.lxdh.length <= 10 || !reg.test(row.lxdh)) {
194 this.form.qlrList = _.cloneDeep([this.newData]); 241 row.inputErr = true;
195 this.form.cxjgList = []; 242 return false;
196 this.form.dyjlList = []; 243 } else {
197 this.isSearch = false; 244 row.inputErr = false;
198 }, 245 return true;
199 /** 246 }
200 * @description: handleRead 247 },
201 * @author: renchao
202 */
203 handleRead (scope) { },
204 //添加申请人或权利人
205 /**
206 * @description: 添加申请人或权利人
207 * @param {*} type
208 * @author: renchao
209 */
210 add (type) {
211 if (type == "sqr") {
212 this.form.sqrList.push(_.cloneDeep(this.newData));
213 } else {
214 this.form.qlrList.push(_.cloneDeep(this.newData));
215 }
216 },
217 //移除申请人或权利人
218 /**
219 * @description: 移除申请人或权利人
220 * @param {*} index
221 * @param {*} row
222 * @param {*} type
223 * @author: renchao
224 */
225 remove (index, row, type) {
226 if (type == "sqr") {
227 this.form.sqrList.splice(index, 1);
228 } else {
229 this.form.qlrList.splice(index, 1);
230 }
231 },
232 //电话号码校验
233 /**
234 * @description: 电话号码校验
235 * @param {*} row
236 * @author: renchao
237 */
238 teltest (row) {
239 const reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
240 if (row.lxdh == "" || row.lxdh.length <= 10 || !reg.test(row.lxdh)) {
241 row.inputErr = true;
242 return false;
243 } else {
244 row.inputErr = false;
245 return true;
246 }
247 }, 248 },
248 }, 249 };
249 };
250 </script> 250 </script>
251 <style scoped lang="scss"> 251 <style scoped lang="scss">
252 @import "~@/styles/mixin.scss"; 252 @import "~@/styles/mixin.scss";
253 @import "~@/styles/public.scss"; 253 @import "~@/styles/public.scss";
254 254
255 .title { 255 .title {
256 padding-bottom: 10px; 256 padding-bottom: 10px;
257 margin-bottom: 10px; 257 margin-bottom: 10px;
258 display: block; 258 display: block;
259 border-bottom: 1px solid $borderColor; 259 border-bottom: 1px solid $borderColor;
260 } 260 }
261 261
262 .jtfccx-edit { 262 .jtfccx-edit {
263 @include flex; 263 @include flex;
264 flex-direction: column; 264 flex-direction: column;
265 overflow-y: hidden; 265 overflow-y: hidden;
266 max-height: 85vh; 266 max-height: 85vh;
267 padding: 0 2px; 267 padding: 0 2px;
268 268
269 .jtfccx-edit-con { 269 .jtfccx-edit-con {
270 flex: 1; 270 flex: 1;
271 height: 100%; 271 height: 100%;
272 overflow-y: scroll; 272 overflow-y: scroll;
273 } 273 }
274 274
275 .submit-button { 275 .submit-button {
276 text-align: center; 276 text-align: center;
277 height: 52px; 277 height: 52px;
278 padding-top: 10px; 278 padding-top: 10px;
279 background-color: #fff; 279 background-color: #fff;
280 }
280 } 281 }
281 }
282 </style> 282 </style>
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
5 <el-row> 5 <el-row>
6 <el-col :span="24" class="btnColRight"> 6 <el-col :span="24" class="btnColRight">
7 <el-form-item> 7 <el-form-item>
8 <el-button type="primary" @click="fetchData">查询</el-button> 8 <!-- <el-button type="primary" @click="fetchData">查询</el-button> -->
9 <el-button type="primary" @click="openAddDialog">新增</el-button> 9 <el-button type="primary" @click="openAddDialog">新增</el-button>
10 </el-form-item> 10 </el-form-item>
11 </el-col> 11 </el-col>
......