Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
791d0258 by xiaomiao
Options

补录信息表单

1 parent ef56ffcc
Inline Side-by-side
Showing 2 changed files with 234 additions and 317 deletions
1 <!--
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-05-25 08:59:02
5 -->
1 <template> 6 <template>
2 <div class="from-clues-header"> 7 <!-- 受理信息 -->
3 <div>收件信息</div> 8 <div class="slxx">
4 <el-form :model="form" label-width="120px"> 9 <el-form
5 <div class="slxx_con"> 10 :model="ruleForm"
11 :rules="rules"
12 class="loadingtext"
13 ref="ruleForm"
14 :label-position="flag ? 'top' : ''"
15 :inline="flag"
16 label-width="120px"
17 >
18 <div class="slxx_con" v-if="isShow" :class="flag ? 'formMarginBot0' : ''">
6 <div class="slxx_title title-block"> 19 <div class="slxx_title title-block">
7 受理信息 20 补录信息
8 <div class="triangle"></div> 21 <div class="triangle"></div>
9 </div> 22 </div>
10 <el-row :gutter="10" v-if="form.slsq"> 23 <el-row :gutter="10">
11 <el-col :span="8"> 24 <el-col :span="8">
12 <el-form-item label="补录编号："> 25 <el-form-item label="业务号：">
13 <el-input disabled v-model="form.Repair.ywh"></el-input> 26 <el-input disabled v-model="ruleForm.qlxx.ywh"></el-input>
14 </el-form-item> 27 </el-form-item>
15 </el-col> 28 </el-col>
16 <el-col :span="8"> 29 <el-col :span="8">
17 <el-form-item label="补录人员："> 30 <el-form-item label="补录人员：">
18 <el-input disabled v-model="form.Repair.slry"></el-input> 31 <el-input disabled v-model="ruleForm.qlxx.dbr"></el-input>
19 </el-form-item> 32 </el-form-item>
20 </el-col> 33 </el-col>
21 <el-col :span="8"> 34 <el-col :span="8">
22 <el-form-item label="补录时间："> 35 <el-form-item label="补录时间：">
23 <el-input disabled v-model="form.Repair.slsj"></el-input> 36 <el-input disabled v-model="ruleForm.qlxx.qlrmc"></el-input>
24 </el-form-item> 37 </el-form-item>
25 </el-col> 38 </el-col>
26 </el-row> 39 </el-row>
27 <el-row :gutter="10"> 40 <el-row :gutter="10">
28 <el-col :span="8"> 41 <el-col :span="8">
29 <el-form-item label="权利类型："> 42 <el-form-item label="权利类型：">
30 <el-input disabled v-model="form.Repair.qllxmc"></el-input> 43 <el-input disabled v-model="ruleForm.qlxx.qlxx"></el-input>
31 </el-form-item> 44 </el-form-item>
32 </el-col> 45 </el-col>
33 <el-col :span="8"> 46 <el-col :span="8">
34 <el-form-item label="登记类型："> 47 <el-form-item label="登记类型：">
35 <el-input disabled v-model="form.Repair.djlxmc"></el-input> 48 <el-input disabled v-model="ruleForm.qlxx.djlxmc"></el-input>
49 </el-form-item>
50 </el-col>
51 <el-col :span="8">
52 <el-form-item label="登记情形：">
53 <el-input disabled v-model="ruleForm.qlxx.djlxmc"></el-input>
54 </el-form-item>
55 </el-col>
56 </el-row>
57 <div class="slxx_title title-block">
58 不动产单元情况
59 <div class="triangle"></div>
60 </div>
61 <el-row :gutter="10">
62 <el-col :span="8">
63 <el-form-item label="不动产单元号：">
64 <el-input disabled v-model="ruleForm.qlxx.bdcdyh"></el-input>
65 </el-form-item>
66 </el-col>
67 <el-col :span="8">
68 <el-form-item label="权利性质：">
69 <el-input disabled v-model="ruleForm.qlxx.qlxzmc"></el-input>
70 </el-form-item>
71 </el-col>
72 </el-row>
73 <el-row :gutter="10">
74 <el-col :span="8">
75 <el-form-item label="宗地面积：">
76 <el-input disabled v-model="ruleForm.qlxx.mjmc"></el-input>
77 </el-form-item>
78 </el-col>
79 <el-col :span="8">
80 <el-form-item label="土地用途：">
81 <el-input disabled v-model="ruleForm.fdcq2.ghyt"></el-input>
82 </el-form-item>
83 </el-col>
84 <el-col :span="8">
85 <el-form-item label="坐落：">
86 <el-input disabled v-model="ruleForm.qlxx.zl"></el-input>
87 </el-form-item>
88 </el-col>
89 <el-col :span="8">
90 <el-form-item label="房屋结构：">
91 <el-input disabled v-model="ruleForm.fdcq2.fwjgmc"></el-input>
92 </el-form-item>
93 </el-col>
94 </el-row>
95 <div class="slxx_title title-block">
96 权利人信息
97 <div class="triangle"></div>
98 </div>
99 <el-row :gutter="10">
100 <el-col :span="12">
101 <el-form-item label="共有方式：">
102 <el-radio-group
103 :disabled="$route.query.viewtype == 0"
104 v-model="ruleForm.qlxx.gyqk"
105 >
106 <el-radio label="0">单独所有</el-radio>
107 <el-radio label="1">共同共有</el-radio>
108 <el-radio label="2">按份所有</el-radio>
109 <el-radio label="3">其它共有</el-radio>
110 </el-radio-group>
111 </el-form-item>
112 </el-col>
113 <!-- <el-col :span="6" v-show="ruleForm.qlxx.gyfs == '1'">
114 <el-form-item label="是否分别持证：">
115 <el-radio-group v-model="ruleForm.qlxx.sqfbcz">
116 <el-radio :label=1>是</el-radio>
117 <el-radio :label=0>否</el-radio>
118 </el-radio-group>
119 </el-form-item>
120 </el-col> -->
121 <!-- <el-col :span="6" v-show="ruleForm.qlxx.sqfbcz == '0'&&ruleForm.qlxx.gyfs == '1'">
122 <el-form-item label="持证人：">
123 <el-select v-model="ruleForm.czr" placeholder="持证人">
124 <el-option v-for="item in czrOptions" :key="item.zjh" :label="item.sqrmc" :value="item.zjh">
125 </el-option>
126 </el-select>
127 </el-form-item>
128 </el-col> -->
129 </el-row>
130 <qlrCommonTable
131 :tableData="ruleForm.qlrList"
132 @upDateQlrxxList="upDateQlrxxList"
133 :key="key"
134 :viewtype="$route.query.viewtype"
135 :gyfs="ruleForm.qlxx.gyfs"
136 />
137
138 <div v-if="ruleForm.ywrList && ruleForm.ywrList.length > 0">
139 <div class="slxx_title title-block">
140 义务人信息
141 <div class="triangle"></div>
142 </div>
143 <qlrCommonTable
144 v-if="ruleForm.ywrList"
145 :tableData="ruleForm.ywrList"
146 :key="key"
147 @upDateQlrxxList="upDateYwrxxList"
148 :viewtype="$route.query.viewtype"
149 />
150 </div>
151
152 <div class="slxx_title title-block">
153 登记原因
154 <div class="triangle"></div>
155 </div>
156 <el-row :gutter="10">
157 <el-col>
158 <el-form-item label="登记原因：" prop="djyy">
159 <el-input
160 class="textArea"
161 type="textarea"
162 :disabled="$route.query.viewtype"
163 v-model="ruleForm.fdcq2.djyy"
164 >
165 </el-input>
36 </el-form-item> 166 </el-form-item>
37 </el-col> 167 </el-col>
38 </el-row> 168 </el-row>
39 </div> 169 </div>
170 <el-row class="btn" v-if="!$route.query.viewtype && ableOperation">
171 <el-form-item>
172 <el-button type="primary" @click="onSubmit">保存</el-button>
173 </el-form-item>
174 </el-row>
40 </el-form> 175 </el-form>
41 <div class="btn">
42 <el-button type="primary" @click="slxxsubmitForm">保存</el-button>
43 <el-button @click="closeDialog">取消</el-button>
44 </div>
45 </div> 176 </div>
46 </template> 177 </template>
47 <script> 178 <script>
48 import { mapGetters } from "vuex"; 179 import { mapGetters } from "vuex";
49 import { init } from "@/api/djbbl.js" 180 import { Init, saveData } from "@/api/workflow/jsydsyqFlow.js";
181 import { init } from "@/api/djbbl.js";
182 import qlrCommonTable from "@/views/workflow/components/qlrCommonTable";
50 export default { 183 export default {
51 props: { 184 components: { qlrCommonTable },
52 currentSelectProps: { 185 computed: {
53 type: Object, 186 ...mapGetters(["dictData", "flag"]),
54 default: () => {},
55 },
56 }, 187 },
57
58 data() { 188 data() {
59 return { 189 return {
60 //传递参数 190 //表单是否可操作
61 propsParam: this.$attrs, 191 propsParam: this.$attrs,
62 activeName: "slxx", 192 ableOperation: true,
63 form: {}, 193 key: 0,
64 datalist: [], 194 isShow: false,
65 qsztList: [ 195 disabled: true,
66 { 196 czrOptions: [],
67 value: "1", 197 ruleForm: {},
68 label: "现势", 198 //传递参数\
69 }, 199 rules: {},
70 {
71 value: "2",
72 label: "历史",
73 },
74 ],
75 label: "",
76 isshow: true,
77 }; 200 };
78 }, 201 },
79 computed: {
80 ...mapGetters(["dictData"]),
81 },
82 created() { 202 created() {
83 this.loadData(); 203 this.loadData();
84 // this.clmlInitList(1)
85 },
86 mounted() {
87 // if (this.formData.data) {
88 // this.$nextTick(() => {
89 // this.form = Object.assign({}, this.formData.data);
90 // // this.datalist = Object.assign([], this.formData.datalist)
91 // this.form.qszt =
92 // this.form.qszt == "0"
93 // ? "临时"
94 // : this.form.qszt == "1"
95 // ? "现势"
96 // : "历史";
97 // });
98 // }
99 // this.datalist = this.formData.datalist
100 // this.datalist = JSON.parse(JSON.stringify(this.formData.datalist));
101 // this.datalist.shift();
102 // this.datalist.shift();
103 // console.log("this.datalist", this.datalist);
104 }, 204 },
105 205 mounted() {},
106 methods: { 206 methods: {
107 loadData() { 207 loadData() {
108 init(this.propsParam.bsmRepair).then((res) => { 208 init(this.propsParam.bsmRepair).then((res) => {
109 if (res.code == 200) { 209 if (res.code == 200) {
110 this.form=res.result; 210 this.ruleForm = res.result;
111 console.log("/rest/djbRepair/init",res); 211 this.isShow = true;
112 // this.tableData = res.result; 212 // this.tableData = res.result;
113 // if (this.tableData.length < datas.columns().emptycolNum) { 213 // if (this.tableData.length < datas.columns().emptycolNum) {
114 // this.emptycolNum = 214 // this.emptycolNum =
...@@ -118,266 +218,77 @@ export default { ...@@ -118,266 +218,77 @@ export default {
118 // } 218 // }
119 } 219 }
120 }); 220 });
121
122 }, 221 },
123 // 受理信息保存 222 // 更新权利人信息
124 slxxsubmitForm() { 223 upDateQlrxxList(val) {
125 this.$refs.form.validate((valid) => { 224 this.ruleForm.qlrList && (this.ruleForm.qlrList = _.cloneDeep(val));
126 if (valid) { 225 this.czrOptions = this.ruleForm.qlrList;
127 // addUserCommonOpinion({ commonOpinion: this.form.commonOpinion }).then(res => { 226 this.key++;
128 // if (res.code == 200) { 227 },
129 // this.$message.success("新增成功") 228 // 更新义务人信息
130 // this.closeaddDiglog(); 229 upDateYwrxxList(val) {
131 // this.getList() 230 this.ruleForm.ywrList && (this.ruleForm.ywrList = _.cloneDeep(val));
132 // } else { 231 this.key++;
133 // this.$message.error(res.message) 232 },
134 // } 233 onSubmit() {
135 // }) 234 if (this.ruleForm.qlrList.length == 0) {
136 } else { 235 this.$message({
236 showClose: true,
237 message: "请确认权利人信息",
238 type: "error",
239 });
240 return false;
241 }
242
243 if (this.ruleForm.qlxx.gyfs == "0") {
244 if (this.ruleForm.qlrList.length > 1) {
245 this.$message({
246 showClose: true,
247 message: "共有方式：单独所有，权利人只能是一个人",
248 type: "error",
249 });
137 return false; 250 return false;
138 } 251 }
252 this.ruleForm.qlrList[0].sfczr = "1";
253 }
254 if (this.ruleForm.qlxx.gyfs == "1") {
255 //是否分别持证
256 if (this.ruleForm.qlxx.sqfbcz == "1") {
257 //是
258 this.ruleForm.qlrList.forEach((item, index) => {
259 item.sfczr = "1";
260 });
261 } else {
262 this.ruleForm.qlrList.forEach((item, index) => {
263 if (item.zjh == this.ruleForm.czr) {
264 item.sfczr = "1";
265 } else {
266 item.sfczr = "0";
267 }
268 });
269 }
270 }
271 saveData(this.ruleForm).then((res) => {
272 if (res.code === 200) {
273 this.$message({
274 showClose: true,
275 message: "保存成功！",
276 type: "success",
277 });
278 this.$store.dispatch("user/refreshPage", true);
279 } else {
280 this.$message({
281 showClose: true,
282 message: res.message,
283 type: "error",
284 });
285 }
139 }); 286 });
140 this.isshow = false;
141 }, 287 },
142 closeDialog() {},
143 }, 288 },
144 }; 289 };
145 </script> 290 </script>
146 <style scoped lang="scss"> 291 <style scoped lang="scss">
147 @import "~@/styles/mixin.scss";
148 @import "~@/styles/public.scss"; 292 @import "~@/styles/public.scss";
149 293 @import "~@/styles/slxx/slxx.scss";
150 .from-clues-header {
151 @include flex;
152 flex-direction: column;
153 overflow-y: hidden;
154 height: 620px;
155 padding: 0 2px;
156
157 .btn {
158 margin-top: 40px;
159 margin-bottom: 20px;
160 text-align: center;
161 }
162 }
163
164 // 审批意见样式
165
166 .spyj {
167 .box {
168 overflow-x: auto;
169 width: 100%;
170 height: 95%;
171 background: #fff;
172 text-align: center;
173 padding: 4px;
174 overflow-y: scroll;
175 padding-top: 20px;
176 padding: 20px 40px;
177 /deep/.el-input__inner {
178 width: 200px;
179 border: none;
180 }
181 }
182 .spyj_title {
183 line-height: 68px;
184 border: 1px solid $borderColor;
185 text-align: center;
186 font-size: 22px;
187 font-weight: 400;
188 background-color: #eceef2;
189 display: block;
190 border-bottom: none;
191 }
192
193 /deep/.el-form-item {
194 margin-bottom: 0;
195 }
196
197 .bottom10 {
198 margin-bottom: 15px;
199 }
200
201 .spyj_form {
202 display: flex;
203 border: 1px solid $borderColor;
204
205 .item_left {
206 width: 150px;
207 background-color: #f8f8fa;
208 color: #606266;
209 display: flex;
210 font-size: 14px;
211 text-indent: 80px;
212 align-items: center;
213 border-right: 1px solid $borderColor;
214 }
215
216 .item_right {
217 flex: 1;
218 width: 100%;
219
220 /deep/.el-form-item__label {
221 background-color: #f8f8fa;
222 }
223 /deep/.el-form-item__content {
224 display: block;
225 text-align: left;
226 text-indent: 10px;
227 }
228 .opinion_item {
229 /deep/.el-form-item__error {
230 margin-top: -16px !important;
231 left: 3px;
232 }
233
234 border-bottom: 1px solid $borderColor;
235 }
236
237 .opinion {
238 position: relative;
239 font-size: 14px;
240
241 /deep/.el-textarea__inner {
242 border: none;
243 }
244 }
245
246 .opinion_btn {
247 position: absolute;
248 right: 15px;
249 bottom: 10px;
250 }
251 }
252 }
253
254 .submit_button {
255 text-align: center;
256 margin: 15px 0;
257 }
258 }
259
260 // 材料信息样式
261 .active {
262 background: $light-blue !important;
263 color: #fff;
264 }
265
266 .required {
267 font-size: 12px;
268 color: $pink;
269 float: left;
270 }
271
272 .cl_number {
273 float: right;
274 }
275
276 .clxx {
277 width: 100%;
278 display: flex;
279 padding-left: 5px;
280 height: calc(100vh - 125px);
281
282 .left {
283 display: flex;
284 flex-direction: column;
285 justify-content: space-between;
286
287 .item {
288 width: 28px;
289 height: 49%;
290 @include flex-center;
291 background-color: #e4e7ed;
292 border-bottom-right-radius: 10px;
293 padding: 5px;
294 cursor: pointer;
295 transition: all 0.3s;
296
297 &:hover {
298 @extend .active;
299 }
300 }
301 }
302
303 .right {
304 width: 100%;
305 height: 100%;
306
307 .clmlmx-box {
308 margin: 0 auto;
309
310 .title {
311 text-align: center;
312 height: 60px;
313 line-height: 60px;
314 border: 1px solid #dfe6ec;
315 font-size: 20px;
316 background: #81d3f81a;
317 margin-bottom: -1px;
318 }
319 }
320
321 .clyl-box {
322 width: 100%;
323 height: 100%;
324 display: flex;
325
326 .menu-tree {
327 width: 20%;
328 min-width: 160px;
329 height: 100%;
330 margin-right: 10px;
331 border-right: 1px dotted #d9d9d9;
332 padding: 0 15px;
333
334 .item {
335 line-height: 30px;
336 padding-top: 5px;
337 border-bottom: 1px solid #e8e8e8;
338 font-size: 16px;
339 text-align: center;
340 color: $light-blue;
341
342 .itemIcon {
343 float: right;
344 line-height: 60px;
345 cursor: pointer;
346 }
347
348 .child {
349 line-height: 32px;
350 border-bottom: 1px solid #e8e8e8;
351 padding-left: 10px;
352 color: #6b6b6b;
353 cursor: pointer;
354 box-sizing: border-box;
355 border-radius: 6px;
356 line-height: 20px;
357 transition: all 0.3s;
358 padding: 8px 0;
359 }
360
361 .child:hover {
362 color: $light-blue;
363 transform: scale(1.1);
364 }
365
366 .checked {
367 border: 1px solid $light-blue;
368 color: $light-blue;
369 }
370 }
371 }
372
373 .clyl-img {
374 width: 75%;
375 height: 100%;
376 background: #f3f4f7;
377 margin: 0 auto;
378 position: relative;
379 }
380 }
381 }
382 }
383 </style> 294 </style>
......
...@@ -209,6 +209,12 @@ export default { ...@@ -209,6 +209,12 @@ export default {
209 }, 209 },
210 //切换选项卡内容组件 210 //切换选项卡内容组件
211 getFromRouter (tabname) { 211 getFromRouter (tabname) {
212 for (let item of this.tabList) {
213 if (item.value === tabname) {
214 this.currentSelectTab = item
215 break;
216 }
217 }
212 this.componentTag = getForm(tabname, this.$route.query.sqywbm); 218 this.componentTag = getForm(tabname, this.$route.query.sqywbm);
213 } 219 }
214 }, 220 },
......