Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
4bcf4ea0 by 田浩浩
Options

提交文件分类

1 parent c89b862f
Inline Side-by-side
Showing 8 changed files with 1612 additions and 0 deletions
1 import filter from '@/utils/filter.js'
2
3 class data extends filter {
4 constructor() {
5 super()
6 }
7 columns () {
8 return [
9 {
10 prop: "qszt",
11 label: "权属状态",
12 },
13 {
14 prop: "qllxmc",
15 label: "权利类型",
16 },
17 {
18 prop: "djlxmc",
19 label: "登记类型",
20 },
21 {
22 prop: "ssywh",
23 label: "上手业务号",
24 },
25 {
26 prop: "dah",
27 label: "档案号",
28 },
29 {
30 prop: "ywh",
31 label: "业务号",
32 },
33 {
34 prop: "bdcdyh",
35 label: "不动产单元号",
36 },
37 {
38 prop: "zl",
39 label: "坐落",
40 },
41 {
42 prop: "qlrlx",
43 label: "权利人类型",
44 },
45 {
46 prop: "qlrmc",
47 label: "权利人",
48 },
49 {
50 prop: "qlrzjzl",
51 label: "证件种类",
52 },
53 {
54 prop: "qlrzjhm",
55 label: "证件号",
56 },
57 {
58 prop: "gyfs",
59 label: "共有情况",
60 },
61 {
62 prop: "mj",
63 label: "使用权面积(m²)",
64 },
65 {
66 prop: "qlxz",
67 label: "权利性质",
68 },
69 {
70 prop: "ytmc",
71 label: "土地用途",
72 },
73 {
74 prop: "syqqzsj",
75 label: "使用权起止时间",
76 },
77 {
78 prop: "tdsyqx",
79 label: "土地使用期限",
80 },
81 {
82 prop: "qdjg",
83 label: "取得价格(万元)",
84 },
85 {
86 prop: "djyy",
87 label: "登记原因",
88 },
89 {
90 prop: "bdcqzh",
91 label: "不动产权证号",
92 },
93 {
94 prop: "djsj",
95 label: "登记时间",
96 },
97 {
98 prop: "dbr",
99 label: "登簿人",
100 },
101 {
102 prop: "fj",
103 label: "附记",
104 },
105 ]
106 }
107 }
108
109 let datas = new data()
110
111 export {
112 datas
113 }
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="djxxTable">
3 <div class="tableBox">
4 <div class="title">
5 {{ title }}
6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList" @change="checkChange">
8 <el-checkbox v-for="item in qsztList" :key="item.value" :label="item.value">{{ item.label }}</el-checkbox>
9 </el-checkbox-group>
10 </div>
11 </div>
12 <div class="xxTableBox">
13 <table class="xxTable">
14 <tr v-for="(item, colindex) in columns" :key="colindex">
15 <td>
16 {{ item.label }}
17 </td>
18 <td v-for="(row, index) in tableData" :key="index" :class="[
19 row.qszt == '2' ? 'lishi' : '',
20 row.qszt == '0' ? 'linshi' : '',
21 item.prop == 'qszt' && row.qszt == '0' ? 'linshiIcon' : '',
22 ]">
23 <div class="icon" v-if="item.prop == 'qszt' && row.qszt == '0'">
24 正在办理
25 </div>
26 <span v-if="item.prop == 'qszt'">
27 {{ getQsztName(row[item.prop]) }}
28 </span>
29
30 <span v-else> {{ row[item.prop] }}</span>
31 </td>
32 <td v-for="count in emptycolNum" :key="~count"></td>
33 </tr>
34 </table>
35 </div>
36 </div>
37 </div>
38 </template>
39
40 <script>
41 import { datas } from "./jsydsyq.js";
42 import { getJsydsyqList } from "@/api/zhcx.js";
43 export default {
44 data () {
45 return {
46 qsztList: [
47 {
48 value: "0",
49 label: "临时",
50 },
51 {
52 value: "1",
53 label: "现势",
54 },
55 {
56 value: "2",
57 label: "历史",
58 },
59 ],
60 checkList: ["0", "1", "2"],
61 //传递参数
62 propsParam: {},
63 //列表数据
64 tableData: [],
65 //空列值个数
66 emptycolNum: 0,
67 //列名称对象
68 columns: [],
69 title: "建设用地使用权、宅基地使用权登记信息",
70 };
71 },
72 created () {
73 this.propsParam = this.$attrs;
74 console.log(this.$attrs, 'this.$attrs;');
75 this.columns = datas.columns();
76 this.loadData();
77 // this.$alert(datas.columns());
78 },
79 methods: {
80 loadData () {
81 //this.$alert(this.propsParam.bdcdyh);
82 getJsydsyqList({
83 bdcdyid: this.propsParam.bdcdyid,
84 qllx: this.propsParam.qllx,
85 qszt: this.checkList,
86 }).then((res) => {
87 if (res.code === 200) {
88 this.tableData = res.result;
89 this.emptycolNum = 3 - this.tableData.length;
90 }
91 });
92 },
93 checkChange () {
94 this.loadData();
95 },
96 getQsztName (code) {
97 let name = "";
98 for (let item of this.qsztList) {
99 if (item.value == code) {
100 name = item.label;
101 break;
102 }
103 }
104 return name;
105 },
106 },
107 };
108 </script>
109
110 <style lang="scss" scoped>
111 @import "./qlxxCommon.scss";
112 </style>
1 //流程环节操作按钮
2 export function getForm(tabName) {
3 let form;
4 switch (tabName) {
5 case "slxx":
6 form = require("@/views/ywbl/fqsq/components/slxx.vue");
7 break;
8 case "slxxCfdj":
9 form = require("@/views/ywbl/fqsq/components/slxxCfdj.vue");
10 break;
11 case "clxx":
12 form = require("@/views/ywbl/fqsq/components/clxx.vue");
13 break;
14 case "spyj":
15 form = require("@/views/ywbl/fqsq/components/spyj.vue");
16 break;
17 case "zdjbxx":
18 form = require("@/views/zhcx/djbcx/components/zdxx.vue");
19 break;
20 case "qlxx":
21 form = require("@/views/zhcx/djbcx/components/jsydsyq.vue");
22 break;
23 case "szxx":
24 form = require("@/views/ywbl/fqsq/components/szxx.vue");
25 break;
26 case "fzxx":
27 form = require("@/views/ywbl/fqsq/components/fzxx.vue");
28 break;
29 }
30
31 return (r) => require.ensure([], () => r(form));
32 }
33
1 .containerFrame {
2 height: 100%;
3 width: 100%;
4 position: sticky;
5 top: 80px;
6 border: 1px solid #ebeef5;
7 z-index: 100;
8 @include flex;
9 }
10
11 .leftmenu {
12 width: 0;
13 transition: all 0.3s;
14 border-right: 1px solid #ebeef5;
15 position: relative;
16 box-sizing: border-box;
17 padding-right: 5px;
18
19 .title {
20 line-height: 36px;
21 text-align: center;
22 }
23
24 .title-detail {
25 display: flex;
26 flex-wrap: wrap;
27 width: 100%;
28 }
29
30 ul {
31 position: relative;
32
33 .xian {
34 background: #f2f2f2;
35 padding: 2px;
36 }
37
38 .title {
39 padding: 5px;
40 text-align: center;
41 }
42
43 li {
44 padding: 5px;
45 font-size: 14px;
46 line-height: 20px;
47 cursor: pointer;
48 }
49
50 li:hover {
51 color: #0f93f6;
52 cursor: pointer;
53 }
54 }
55 }
56
57 .animation-map-drawer {
58 width: 260px;
59 }
60
61 /deep/.el-menu-item {
62 padding-left: 5px !important;
63 }
64
65 /deep/.el-tabs__header {
66 margin-bottom: 0 !important;
67 }
68
69 /deep/.el-menu-item.is-active {
70 background-color: #e7f4fe;
71 }
72
73 .leftCon {
74 flex: 1;
75 width: calc(100% - 260px);
76 display: flex;
77 }
78
79 .splitScreen-con {
80 flex: 1;
81 width: 0;
82 }
83
84 .rightContainer {
85 flex: 1;
86 width: 0;
87 height: calc(100vh - 80px);
88 }
89
90 /deep/.el-tabs {
91 box-sizing: border-box;
92 padding: 0 5px;
93 width: 100%;
94 }
95
96 .svg-icon {
97 width: 2.5em;
98 height: 2.5em;
99 }
100
101 .iconName {
102 line-height: 24px;
103 font-size: 12px;
104 }
105
106 .container {
107 width: 100%;
108 height: 100%;
109 padding: 0;
110 box-sizing: border-box;
111 background-color: #ffffff;
112 overflow: hidden;
113 }
114
115 .map-drawer {
116 width: 20px;
117 height: 79px;
118 position: absolute;
119 top: 30%;
120 z-index: 99;
121 cursor: pointer;
122 }
123
124 .map-drawer-expand {
125 background: url("../../../image/right.png");
126 background-size: cover;
127 right: 0%;
128 }
129
130 .map-drawer-click {
131 background: url("../../../image/left.png");
132 background-size: cover;
133 left: 0%;
134 }
135
136
137 .topButton {
138 @include flex;
139 width: 100%;
140 height: 80px;
141 background-color: #3498db;
142 color: #ffffff;
143 justify-content: space-between;
144 padding-left: 15px;
145 position: sticky;
146 top: 0;
147 z-index: 100;
148
149 ul {
150 @include flex;
151
152 li {
153 @include flex-center;
154 cursor: pointer;
155 flex-direction: column;
156 margin-right: 15px;
157 box-sizing: border-box;
158 width: 70px;
159 margin: 0 5px;
160 }
161
162 li:hover {
163 border: 1px solid #ffffff;
164 border-radius: 5px;
165 }
166 }
167 }
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="container">
3 <!-- 顶部内容框 -->
4 <div class="topButton">
5 <!-- 左侧业务功能按钮 -->
6 <ul>
7 <li @click="operation(index, item)" v-for="(item, index) in leftButtonList" :key="index">
8 <svg-icon :icon-class="item.icon" />
9 <span class="iconName">{{ item.name }}</span>
10 </li>
11 </ul>
12 <!-- 右侧流程按钮 -->
13 <ul>
14 <li @click="operation(index, item)" v-for="(item, index) in rightButtonList" :key="index">
15 <svg-icon class="icon" :icon-class="item.icon" />
16 <span class="iconName">{{ item.name }}</span>
17 </li>
18 </ul>
19 </div>
20 <!-- 内容框架 -->
21 <div class="containerFrame">
22 <!-- 左侧菜单栏 -->
23 <div class="leftmenu" :class="{ 'animation-map-drawer': isShowdrawer }">
24 <div v-if="this.isShowdrawer">
25 <div class="title">申请单元列表({{ unitData.length }})</div>
26 <el-menu :default-active="activeIndex" @select="unitClick">
27 <el-menu-item v-for="(item, index) in unitData" :index="index.toString()" :key="index">
28 <p>{{ item.bdcdyh }}</p>
29 <p class="title-detail">{{ item.zl }}</p>
30 </el-menu-item>
31 </el-menu>
32 </div>
33 <div class="map-drawer-click map-drawer" v-if="!isShowdrawer" @click="
34 () => {
35 this.isShowdrawer = !this.isShowdrawer;
36 }
37 "></div>
38 <div class="map-drawer-expand map-drawer" v-else @click="
39 () => {
40 this.isShowdrawer = !this.isShowdrawer;
41 }
42 "></div>
43 </div>
44 <div class="leftCon">
45 <!-- 分屏左侧预览 -->
46 <div v-if="splitScreen" class="splitScreen-con">
47 <component :is="clxxForm" v-bind="currentSelectProps" :key="fresh" />
48 </div>
49 <!-- 表单内容区域 -->
50 <div class="rightContainer">
51 <el-tabs v-model="tabName" @tab-click="tabClick">
52 <el-tab-pane :label="item.name" :name="item.value" v-for="(item, index) in tabList" :key="index">
53 </el-tab-pane>
54 </el-tabs>
55 <component :key="fresh" :is="componentTag" v-bind="currentSelectProps" />
56 </div>
57 </div>
58 </div>
59 <dialogBox title="流程图" width="70%" isMain v-model="myValue" :isFullscreen="false" :isButton="false">
60 <img :src="imgSrc" style="margin: 20px 0" />
61 </dialogBox>
62 </div>
63 </template>
64
65 <style scoped lang='scss'>
66 @import "~@/styles/mixin.scss";
67 @import "./workFrame.scss";
68 </style>
69
70 <script>
71 import {
72 leftMenu,
73 stepExpandInfo,
74 record,
75 getNextLinkInfo,
76 completeTask,
77 } from "@/api/fqsq.js";
78 import { getWorkFlowImage } from "@/api/jsydsyqFlow.js"
79 import { getForm } from "./flowform.js";
80 export default {
81 data () {
82 return {
83 // 流程图
84 imgSrc: '',
85 myValue: false,
86 // 折叠
87 isShowdrawer: true,
88 // 默认选中
89 activeIndex: '0',
90 //受理申请标识码
91 bsmSlsq: this.$route.query.bsmSlsq,
92 //当前流程所在环节
93 bestepid: this.$route.query.bestepid,
94 //顶部左侧按钮集合
95 leftButtonList: [],
96 //顶部右侧按钮集合
97 rightButtonList: [],
98 //左侧菜单数据集合
99 unitData: [],
100 //设置那个表单选中
101 tabName: "",
102 //表单集合
103 tabList: [],
104 //选择加载哪一个组件
105 componentTag: "",
106 //设置表单组件是否刷选值
107 fresh: 10,
108 //设置表单传递数据
109 currentSelectProps: {},
110 //是否开启材料分屏
111 splitScreen: false,
112 //材料分屏表单
113 clxxForm: "",
114 //材料信息选择卡索引
115 clxxIndex: "",
116 //材料信息选项卡对象
117 clxxTab: {},
118 };
119 },
120 mounted () {
121 this.loadBdcdylist();
122 this.flowInitParam();
123 },
124 methods: {
125 //加载流程初始参数
126 flowInitParam () {
127 var formdata = new FormData();
128 formdata.append("bsmSlsq", this.bsmSlsq);
129 formdata.append("bestepid", this.bestepid);
130 stepExpandInfo(formdata).then((res) => {
131 if (res.code === 200) {
132 this.leftButtonList = res.result.button;
133 this.rightButtonList = res.result.operation;
134 this.tabList = res.result.form;
135 //默认选择第一个选项卡内容
136 this.tabName = res.result.form[0].value;
137 let that = this;
138 this.tabList.forEach(function (item, index) {
139 if (item.value == "clxx") {
140 that.clxxIndex = index;
141 that.clxxForm = getForm(item.value);
142 that.clxxTab = item;
143 }
144 });
145 //默认加载第一个选项卡的组件内容
146 this.getFromRouter(res.result.form[0].value);
147 }
148 });
149 },
150 //流程环节操作按钮
151 operation (index, item) {
152 let that = this;
153 switch (item.value) {
154 case "B1":
155 getWorkFlowImage(this.bsmSlsq).then(res => {
156 this.imgSrc = URL.createObjectURL(res)
157 this.myValue = true
158 })
159 break;
160 case "zsyl":
161 this.zsylFlag = true;
162 break;
163 case "clfp": //材料分屏按钮
164 this.splitScreen = this.splitScreen ? false : true;
165 this.$store.dispatch('app/settScreen', this.splitScreen)
166 if (this.splitScreen) {
167 //如果当前选项卡为材料信息内容，递减到上一个选项卡内容
168 if (this.tabName == this.clxxTab.value) {
169 this.tabName = this.tabList[this.clxxIndex - 1].value;
170 this.getFromRouter(this.tabList[this.clxxIndex - 1].value);
171 }
172 this.tabList.splice(this.clxxIndex, 1);
173 } else {
174 this.tabList.splice(this.clxxIndex, 1, this.clxxTab);
175 }
176 break;
177 case "th": //退回按钮
178 break;
179 case "zc": //转件按钮
180 getNextLinkInfo({
181 bsmSlsq: this.bsmSlsq,
182 bestepid: this.bestepid,
183 }).then((res) => {
184 if (res.code === 200) {
185 this.send(res.result);
186 }
187 });
188 // this.$alert(res.result);
189 break;
190 case "tc":
191 window.close();
192 break;
193 case "db":
194 var formdata = new FormData();
195 formdata.append("bsmSlsq", this.bsmSlsq);
196 formdata.append("bestepid", this.bestepid);
197 // comMsg;
198 this.$confirm("请确认是否登簿", "提示", {
199 iconClass: "el-icon-question", //自定义图标样式
200 confirmButtonText: "确认", //确认按钮文字更换
201 cancelButtonText: "取消", //取消按钮文字更换
202 showClose: true, //是否显示右上角关闭按钮
203 type: "warning", //提示类型 success/info/warning/error
204 }).then(function () {
205 record(formdata).then((res) => {
206 if (res.code === 200 || res.code === 2002) {
207 that.$alert(res.message);
208 }
209 });
210 });
211 break;
212 }
213 },
214 //读取申请单元信息
215 loadBdcdylist () {
216 var formdata = new FormData();
217 formdata.append("bsmSlsq", this.bsmSlsq);
218 formdata.append("bestepid", this.bestepid);
219 leftMenu(formdata).then((res) => {
220 if (res.code === 200) {
221 this.unitData = res.result;
222 this.currentSelectProps = res.result[0];
223 }
224 })
225 },
226 //申请单元点击事件
227 unitClick (index) {
228 if (this.currentSelectProps.bsmSldy != this.unitData[index].bsmSldy) {
229 this.currentSelectProps = this.unitData[index];
230 this.fresh += 1;
231 }
232 },
233 //表单选项卡事件
234 tabClick (tab, event) {
235 this.getFromRouter(tab.name);
236 },
237 //切换选项卡内容组件
238 getFromRouter (tabname) {
239 this.componentTag = getForm(tabname);
240 },
241 //发送下一个环节
242 send (obj) {
243 const h = this.$createElement;
244 this.$msgbox({
245 title: "您确定转出吗？",
246 message: h("div", { style: "margin: auto" }, [
247 h("span", null, "下个环节名称："),
248 h("i", { style: "color: teal" }, obj.taskName),
249 h("div", null, ""),
250 h("span", null, "下个环节经办人： "),
251 h("i", { style: "color: teal" }, obj.usernames.join("，")),
252 ]),
253 showCancelButton: true,
254 beforeClose: (action, instance, done) => {
255 if (action === "confirm") {
256 instance.confirmButtonLoading = true;
257 instance.confirmButtonText = "执行中...";
258 completeTask({
259 bsmSlsq: this.bsmSlsq,
260 shyj: "this.bestepid",
261 }).then((res) => {
262 if (res.code === 200) {
263 instance.confirmButtonLoading = false;
264 this.$message.success("转件成功");
265 setTimeout(() => {
266 window.opener = null;
267 window.open("about:blank", "_self");
268 window.close();
269 this.$emit("input", false);
270 }, 1000);
271 }
272 });
273 } else {
274 done();
275 }
276 },
277 }).then((action) => {
278 this.$message({
279 type: "info",
280 message: "action: " + action
281 })
282 })
283 }
284 }
285 }
286 </script>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="clxx">
3 <div class="left">
4 <div v-for="item in menuList" :key="item.id" :class="['item', checkedId == item.id ? 'active' : '']"
5 @click="menuClick(item)">
6 {{ item.label }}
7 </div>
8 </div>
9 <div class="right">
10 <!-- 材料目录明细 -->
11 <div class="clmlmx-box" v-if="checkedId == '1'">
12 <div class="title">申请材料目录</div>
13 <lb-table :column="column" :key="key" :heightNum="150" :pagination="false" :data="tableData">
14 </lb-table>
15 </div>
16 <!-- 材料预览 -->
17 <div class="clyl-box" v-else>
18 <div class="menu-tree">
19 <div class="item">
20 材料目录
21 <i :class="iclass" @click="iconClick()"></i>
22 <el-collapse-transition>
23 <div v-show="menuOpen">
24 <div v-for="item in tableData" :key="item.bsmSj"
25 :class="['child', treeCheckId == item.bsmSj ? 'checked' : '']" @click="treeClick(item)">
26 {{ item.sjmc }}
27 </div>
28 </div>
29 </el-collapse-transition>
30 </div>
31 </div>
32 <image-preview :previewImg="previewImg" @updateList="updateList" />
33 </div>
34 </div>
35 <clxxAddDialog v-model="isDialog" />
36 </div>
37 </template>
38 <script>
39 import { mapGetters } from "vuex";
40 import clxxAddDialog from "./clxxAddDialog.vue";
41 import imagePreview from '@/views/components/imagePreview.vue'
42 import { clmlInit, move, save, clmlDelete } from "@/api/fqsq.js";
43 export default {
44 components: { clxxAddDialog, imagePreview },
45 data () {
46 return {
47 isDialog: false,
48 menuList: [
49 {
50 id: "1",
51 label: "材料目录明细",
52 },
53 {
54 id: "2",
55 label: "材料预览",
56 },
57 ],
58 menuOpen: true,
59 iclass: "itemIcon el-icon-caret-bottom",
60 treeCheckId: "",
61 checkedId: "1",
62 column: [
63 {
64 width: "35",
65 renderHeader: (h, scope) => {
66 return (
67 <i
68 class="el-icon-plus pointer"
69 onClick={() => {
70 this.handleAdd()
71 }}
72 ></i>
73 );
74 },
75 render: (h, scope) => {
76 // 新建的材料,可删除
77 if (scope.row.sfxjcl === "1") {
78 return (
79 <i
80 class="el-icon-minus pointer"
81 onClick={() => {
82 this.handleDelete(scope.$index, scope.row);
83 }}
84 ></i>
85 );
86 }
87 },
88 },
89 {
90 width: "35",
91 label: "序号",
92 type: "index",
93 },
94 {
95 prop: "isrequired",
96 label: "是否必选",
97 width: "50",
98 render: (h, scope) => {
99 if (scope.row.sfxjcl === "1") {
100 return (
101 <div>
102 <span>可选</span>
103 </div>
104 );
105 }
106 else {
107 return (
108 <div>
109 <span>必选</span>
110 </div>
111 );
112 }
113 },
114 },
115 {
116 prop: "sjmc",
117 label: "材料名称",
118 },
119 {
120 prop: "sjlx",
121 label: "材料类型",
122 width: "80",
123 render: (h, scope) => {
124 return (
125 <div>
126 <span>{this.dicStatus(scope.row.sjlx, "A40")}</span>
127 </div>
128 );
129 },
130 },
131 {
132 prop: "sjsl",
133 label: "份数",
134 width: "50"
135 },
136 {
137 prop: "smzt",
138 label: "扫描状态",
139 width: "80",
140 render: (h, scope) => {
141 if (scope.row.children.length > 0) {
142 return (
143 <div>
144 <span>已扫描</span>
145 </div>
146 );
147 } else {
148 return (
149 <div>
150 <span>未扫描</span>
151 </div>
152 );
153 }
154 },
155 },
156 {
157 prop: "ys",
158 label: "扫描页数",
159 width: "50"
160 },
161 {
162 label: "操作",
163 width: "80",
164 render: (h, scope) => {
165 return (
166 <div>
167 <el-button
168 type="text"
169 disabled={scope.$index == 0}
170 onClick={() => {
171 this.moveUpward(scope.$index, scope.row);
172 }}
173 >
174 上移
175 </el-button>
176 <el-button
177 type="text"
178 disabled={scope.$index + 1 == this.tableData.length}
179 onClick={() => {
180 this.moveDown(scope.$index, scope.row);
181 }}
182 >
183 下移
184 </el-button>
185 </div>
186 );
187 },
188 },
189 ],
190 key: 0,
191 tableData: [],
192 previewImg: {
193 // 收件标识码
194 bsmSj: '',
195 bsmSlsq: this.$parent.bsmSlsq,
196 index: 0,
197 selectedIndex: 0,
198 imgList: [
199 {
200 fjurl: 'https://img2.baidu.com/it/u=2955521104,3257476296&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=1111'
201 }
202 ]
203 }
204 }
205 },
206 computed: {
207 ...mapGetters(["dictData"]),
208 },
209 created () {
210 this.clmlInitList()
211 },
212 methods: {
213 // 材料目录明细初始化
214 clmlInitList () {
215 return new Promise(resolve => {
216 this.unitData = this.$parent.unitData;
217 var formdata = new FormData();
218 formdata.append("bsmSldy", this.unitData[0]?.bsmSldy);
219 formdata.append("bsmSlsq", this.$parent.bsmSlsq);
220 clmlInit(formdata).then((res) => {
221 resolve(res.code)
222 if (res.result.result && res.result.result.length > 0) {
223 this.tableData = res.result.result;
224 this.treeCheckId = this.tableData[0].bsmSj;
225 this.title = this.tableData[0].sjmc;
226 this.titleYs = 1;
227 this.titleNum = this.tableData[0].children.length;
228
229 this.previewImg.imgList = this.tableData[0]?.children;
230 this.previewImg.bsmSj = this.tableData[0]?.bsmSj;
231 }
232 })
233 })
234 },
235 updateList (val) {
236 this.tableData.forEach(item => {
237 if (item.bsmSj === val.bsmSj) {
238 item.children = val.children
239 }
240 })
241 this.previewImg.imgList = _.cloneDeep(val.children)
242 if (this.previewImg.index == this.previewImg.imgList.length) {
243 this.previewImg.index = this.previewImg.index - 1
244 }
245 },
246 // 左侧菜单点击
247 menuClick (item) {
248 this.checkedId = item.id
249 },
250 // 添加材料目录
251 handleAdd () {
252 this.isDialog = true;
253 },
254 // 上移
255 moveUpward (index, row) {
256 let obj = {
257 xh: row.xh,
258 bsmSlsq: row.bsmSlsq,
259 moveDirection: "UP",
260 };
261 // 接口待调
262 move(obj).then(async (res) => {
263 if (res.code == 200) {
264 let res = await this.clmlInitList()
265 if (res == 200) this.$message({
266 message: '上移成功',
267 type: 'success'
268 })
269 } else {
270 this.$message.error(res.message);
271 }
272 })
273 },
274 // 下移
275 moveDown (index, row) {
276 let obj = {
277 xh: row.xh,
278 bsmSlsq: row.bsmSlsq,
279 moveDirection: "DOWN",
280 }
281 // 接口待调
282 move(obj).then(async (res) => {
283 if (res.code == 200) {
284 let res = await this.clmlInitList()
285 if (res == 200) this.$message({
286 message: '下移成功',
287 type: 'success'
288 })
289 } else {
290 this.$message.error(res.message);
291 }
292 })
293 },
294 // 新增弹窗保存
295 addSave (data) {
296 let obj = {
297 bsmSlsq: this.$parent.bsmSlsq,
298 isrequired: "1",
299 sjmc: data.clmc,
300 sjsl: 0,
301 smzt: '',
302 ys: 0,
303 sjlx: data.cllx,
304 sfxjcl: "1", // 是否必选
305 };
306 save(obj).then(async (res) => {
307 if (res.code == 200) {
308 let res = await this.clmlInitList()
309 if (res == 200) this.$message({
310 message: "新增成功",
311 type: "success",
312 })
313 }
314 });
315 },
316 // 材料目录删除
317 handleDelete (index, row) {
318 let that = this
319 this.$confirm('此操作将永久删除该 是否继续?', '提示', {
320 confirmButtonText: '确定',
321 cancelButtonText: '取消',
322 type: 'warning'
323 }).then(() => {
324 clmlDelete({ sjBsm: row.bsmSj }).then(async (res) => {
325 if (res.code == 200) {
326 let res = await that.clmlInitList()
327 if (res == 200) that.$message({
328 message: "删除成功",
329 type: "success",
330 })
331 }
332 })
333 }).catch(() => {
334 this.$message({
335 type: 'info',
336 message: '已取消删除'
337 })
338 })
339 },
340 // 材料目录关闭收起
341 iconClick () {
342 this.menuOpen = !this.menuOpen;
343 if (this.menuOpen) {
344 this.iclass = "itemIcon el-icon-caret-bottom close";
345 } else {
346 this.iclass = "itemIcon el-icon-caret-bottom open";
347 }
348 },
349 // 材料目录点击选中
350 treeClick (item) {
351 this.treeCheckId = item.bsmSj;
352 this.previewImg.imgList = item?.children;
353 this.previewImg.bsmSj = item?.bsmSj;
354 },
355 // 小图片点击
356 imgClick (item, index) {
357 this.showImg = item;
358 this.titleYs = index + 1;
359 },
360 // 字典
361 dicStatus (val, code) {
362 let data = this.$store.getters.dictData[code],
363 name = "暂无";
364 if (data) {
365 data.map((item) => {
366 if (item.dcode == val) {
367 name = item.dname;
368 }
369 });
370 return name;
371 }
372 },
373 },
374 };
375 </script>
376 <style scoped lang='scss'>
377 @import "~@/styles/mixin.scss";
378
379 .active {
380 background: $light-blue !important;
381 color: #fff;
382 }
383
384 .clxx {
385 width: 100%;
386 display: flex;
387 padding-left: 5px;
388 height: calc(100vh - 125px);
389
390 .left {
391 display: flex;
392 flex-direction: column;
393 justify-content: space-between;
394
395 .item {
396 width: 28px;
397 height: 49%;
398 @include flex-center;
399 background-color: #E4E7ED;
400 border-bottom-right-radius: 10px;
401 padding: 5px;
402 cursor: pointer;
403 transition: all 0.3s;
404
405 &:hover {
406 @extend .active;
407 }
408 }
409 }
410
411 .right {
412 width: 100%;
413 height: 100%;
414
415 .clmlmx-box {
416 margin: 0 auto;
417
418 .title {
419 text-align: center;
420 height: 60px;
421 line-height: 60px;
422 border: 1px solid #dfe6ec;
423 font-size: 20px;
424 background: #81d3f81a;
425 margin-bottom: -1px;
426 }
427 }
428
429 .clyl-box {
430 width: 100%;
431 height: 100%;
432 display: flex;
433
434 .menu-tree {
435 width: 20%;
436 min-width: 160px;
437 height: 100%;
438 margin-right: 10px;
439 border-right: 1px dotted #d9d9d9;
440 padding: 0 15px;
441
442 .item {
443 height: 60px;
444 line-height: 60px;
445 border-bottom: 1px solid #e8e8e8;
446 font-size: 16px;
447 color: #4a4a4a;
448
449 .itemIcon {
450 float: right;
451 line-height: 60px;
452 cursor: pointer;
453 }
454
455 @keyframes open {
456 100% {
457 transform: rotate(180deg);
458 }
459 }
460
461 @keyframes close {
462 0% {
463 transform: rotate(180deg);
464 }
465
466 100% {
467 transform: rotate(-0deg);
468 }
469 }
470
471 .open {
472 animation: open 0.5s;
473 animation-fill-mode: both;
474 }
475
476 .close {
477 animation: close 0.5s;
478 animation-fill-mode: both;
479 }
480
481 .child {
482 line-height: 36px;
483 border-bottom: 1px solid #e8e8e8;
484 padding-left: 10px;
485 color: #6b6b6b;
486 cursor: pointer;
487 box-sizing: border-box;
488 }
489
490 .checked {
491 border-radius: 6px;
492 border: 1px solid #4083f9;
493 }
494 }
495 }
496
497 .clyl-img {
498 width: 75%;
499 height: 100%;
500 background: #f3f4f7;
501 margin: 0 auto;
502 position: relative;
503 }
504 }
505 }
506 }
507 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <dialogBox title="新建材料信息" width="20%" isMain v-model="myValue" @closeDialog="closeDialog" @submitForm="handleSubmit"
3 :isFullscreen="false">
4 <el-form :model="ruleForm" ref="ruleForm" label-width="70px">
5 <el-row>
6 <el-col :span="24">
7 <el-form-item label="材料类型">
8 <el-select v-model="ruleForm.cllx" class="width100" placeholder="请选择">
9 <el-option v-for="item in dictData['A40']" :key="item.dcode" :label="item.dname" :value="item.dcode">
10 </el-option>
11 </el-select>
12 </el-form-item>
13 </el-col>
14 </el-row>
15 <el-row :gutter="20">
16 <el-col :span="24">
17 <el-form-item label="材料名称">
18 <el-input v-model="ruleForm.clmc"></el-input>
19 </el-form-item>
20 </el-col>
21 </el-row>
22 </el-form>
23 </dialogBox>
24 </template>
25
26 <script>
27 import { mapGetters } from "vuex";
28 export default {
29 props: {
30 value: { type: Boolean, default: false },
31 },
32 data () {
33 return {
34 myValue: this.value,
35 ruleForm: {
36 cllx: "",
37 clmc: "",
38 },
39 };
40 },
41 computed: {
42 ...mapGetters(["dictData"]),
43 },
44 watch: {
45 value (val) {
46 this.myValue = val;
47 },
48 },
49 methods: {
50 closeDialog () {
51 this.$emit("input", false);
52 },
53 handleSubmit () {
54 this.$parent.addSave(this.ruleForm);
55 this.$emit("input", false);
56 },
57 },
58 };
59 </script>
60 <style scoped lang="scss">
61 .submit-button {
62 text-align: center;
63 height: 52px;
64 padding-top: 10px;
65 background-color: #fff;
66 }
67 </style>
1 <template>
2 <div class="slxx">
3 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" :label-position="flag ? 'top' : ''" :inline="flag"
4 label-width="120px">
5 <div class="slxx_con">
6 <div class="slxx_title">受理信息</div>
7 <el-row :gutter="10">
8 <el-col :span="8">
9 <el-form-item :class="flag ? 'marginBot0' : ''" label="业务号：" prop="ywh">
10 <el-input disabled v-model="ruleForm.ywh"></el-input>
11 </el-form-item>
12 </el-col>
13 <el-col :span="8">
14 <el-form-item :class="flag ? 'marginBot0' : ''" label="受理人员：" prop="slry">
15 <el-input disabled v-model="ruleForm.slry"></el-input>
16 </el-form-item>
17 </el-col>
18 <el-col :span="8">
19 <el-form-item :class="flag ? 'marginBot0' : ''" label="受理时间：" prop="slsj">
20 <el-input disabled v-model="ruleForm.slsj"></el-input>
21 </el-form-item>
22 </el-col>
23 </el-row>
24 <el-row :gutter="10">
25 <el-col :span="8">
26 <el-form-item :class="flag ? 'marginBot0' : ''" label="权利类型：" prop="qllx">
27 <el-select disabled v-model="ruleForm.qllx" filterable clearable placeholder="请选择权利类型">
28 <el-option v-for="item in dictData['A8']" :key="item.dcode" :label="item.dname" :value="item.dcode">
29 </el-option>
30 </el-select>
31 </el-form-item>
32 </el-col>
33 <el-col :span="8">
34 <el-form-item :class="flag ? 'marginBot0' : ''" label="登记类型：" prop="djlx">
35 <el-select disabled v-model="ruleForm.djlx" filterable clearable placeholder="请选择登记类型">
36 <el-option v-for="item in dictData['A21']" :key="item.dcode" :label="item.dname" :value="item.dcode">
37 </el-option>
38 </el-select>
39 </el-form-item>
40 </el-col>
41 <el-col :span="8">
42 <el-form-item :class="flag ? 'marginBot0' : ''" label="登记情形：" prop="djqx">
43 <el-input disabled v-model="ruleForm.djqxmc"></el-input>
44 </el-form-item>
45 </el-col>
46 </el-row>
47 <div class="slxx_title">不动产单元情况</div>
48 <el-row :gutter="10">
49 <el-col :span="8">
50 <el-form-item :class="flag ? 'marginBot0' : ''" label="宗地代码：" prop="zddm">
51 <el-input disabled v-model="ruleForm.zddm"></el-input>
52 </el-form-item>
53 </el-col>
54 <el-col :span="8">
55 <el-form-item :class="flag ? 'marginBot0' : ''" label="不动产单元号：" prop="bdcdyh">
56 <el-input disabled v-model="ruleForm.bdcdyh"></el-input>
57 </el-form-item>
58 </el-col>
59 <el-col :span="8">
60 <el-form-item :class="flag ? 'marginBot0' : ''" label="权利性质：" prop="qlxzmc">
61 <el-input disabled v-model="ruleForm.qlxzmc"></el-input>
62 </el-form-item>
63 </el-col>
64 </el-row>
65 <el-row :gutter="10">
66 <el-col :span="8">
67 <el-form-item :class="flag ? 'marginBot0' : ''" label="宗地面积：" prop="zdmj">
68 <el-input disabled v-model="ruleForm.zdmj"></el-input>
69 </el-form-item>
70 </el-col>
71 <el-col :span="8">
72 <el-form-item :class="flag ? 'marginBot0' : ''" label="土地用途：" prop="ghytmc">
73 <el-input disabled v-model="ruleForm.ghytmc"></el-input>
74 </el-form-item>
75 </el-col>
76 <el-col :span="8">
77 <el-form-item :class="flag ? 'marginBot0' : ''" label="权利设定方式：" prop="qlsdfs">
78 <el-select disabled v-model="ruleForm.qlsdfs" filterable clearable placeholder="请选择权利设定方式">
79 <el-option v-for="item in qlsdfsOption" :key="item.value" :label="item.label" :value="item.value">
80 </el-option>
81 </el-select>
82 </el-form-item>
83 </el-col>
84 </el-row>
85 <el-row :gutter="10">
86 <el-col :span="8">
87 <el-form-item :class="flag ? 'marginBot0' : ''" label="取得价格：" prop="qdjg">
88 <el-input disabled v-model="ruleForm.qdjg"></el-input>
89 </el-form-item>
90 </el-col>
91
92 <el-col :span="16">
93 <el-form-item :class="flag ? 'marginBot0' : ''" label="坐落：" prop="zl">
94 <el-input disabled v-model="ruleForm.zl"></el-input>
95 </el-form-item>
96 </el-col>
97 </el-row>
98 <el-row :gutter="10">
99 <el-col :span="8">
100 <el-form-item :class="flag ? 'marginBot0' : ''" label="使用期限：" prop="tdsyqx">
101 <el-input disabled v-model="ruleForm.tdsyqx"></el-input>
102 </el-form-item>
103 </el-col>
104
105 <el-col :span="16">
106 <el-form-item :class="flag ? 'marginBot0' : ''" label="使用权起止时间：" prop="qssj">
107 <el-input disabled v-model="ruleForm.syqqzsj"></el-input>
108 </el-form-item>
109 </el-col>
110 </el-row>
111 <el-row :gutter="10">
112 <el-col>
113 <el-form-item :class="flag ? 'marginBot0' : ''" label="附记：" prop="fj">
114 <el-input type="textarea" v-model="ruleForm.fj"></el-input>
115 </el-form-item>
116 </el-col>
117 </el-row>
118 <div class="slxx_title">权利人信息</div>
119 <el-row :gutter="10">
120 <el-col :span="14">
121 <el-form-item :class="flag ? 'marginBot0' : ''" label="共有方式：">
122 <el-radio-group v-model="ruleForm.gyfs">
123 <el-radio label="1">单独所有</el-radio>
124 <el-radio label="2">共同共有</el-radio>
125 <el-radio label="3">按份所有</el-radio>
126 </el-radio-group>
127 </el-form-item>
128 </el-col>
129 <el-col :span="5" v-show="ruleForm.gyfs == '2'">
130 <el-form-item :class="flag ? 'marginBot0' : ''" label="是否分别持证：">
131 <el-radio-group v-model="ruleForm.sffbcz">
132 <el-radio label="1">是</el-radio>
133 <el-radio label="0">否</el-radio>
134 </el-radio-group>
135 </el-form-item>
136 </el-col>
137 <el-col :span="5" v-show="ruleForm.gyfs == '2'">
138 <el-form-item :class="flag ? 'marginBot0' : ''" label="持证人：">
139 <el-select v-model="ruleForm.czr" placeholder="持证人">
140 <el-option v-for="item in czrOptions" :key="item.value" :label="item.label" :value="item.value">
141 </el-option>
142 </el-select>
143 </el-form-item>
144 </el-col>
145 </el-row>
146 <InformationTable :tableData="ruleForm.qlrxx" :gyfs="ruleForm.gyfs" />
147 <div class="slxx_title">登记原因{{flag}}</div>
148 <el-row :gutter="10">
149 <el-col>
150 <el-form-item :class="flag ? 'marginBot0' : ''" label="登记原因：" prop="djyy">
151 <el-input class="textArea" type="textarea" v-model="ruleForm.djyy"></el-input>
152 </el-form-item>
153 </el-col>
154 </el-row>
155 </div>
156 <el-row class="btn">
157 <el-form-item :class="flag ? 'marginBot0' : ''">
158 <el-button type="primary" @click="onSubmit">保存</el-button>
159 </el-form-item>
160 </el-row>
161 </el-form>
162 </div>
163 </template>
164 <script>
165 import InformationTable from "./InformationTable";
166 import { Init, fristReg } from "@/api/jsydsyqFlow.js";
167 import { mapGetters } from "vuex";
168 export default {
169 async created () {
170 //var bsmSldy = this.$parent._data.unitData[0].bsmSldy;
171 this.propsParam = this.$attrs;
172 var formdata = new FormData();
173 formdata.append("bsmSldy", this.propsParam.bsmSldy);
174 Init(formdata).then((res) => {
175 if (res.code === 200 && res.result) {
176 this.ruleForm = {
177 ...res.result,
178 ...res.result.zdjbxxdatas,
179 ...res.result.qlxxdatas,
180 ...res.result.jsydsyqdatas,
181 };
182 }
183 });
184 },
185 components: { InformationTable },
186 computed: {
187 ...mapGetters(["dictData", "flag"]),
188 },
189 data () {
190 return {
191 disabled: true,
192 tdytOption: [],
193 qlsdfsOption: [],
194 czrOptions: [],
195 ruleForm: {
196 ywh: "",
197 slry: "",
198 slsj: "",
199 qllx: "",
200 djlx: "",
201 djqx: "",
202 zddm: "",
203 bdcdyh: "",
204 qlxzmc: "",
205 qlrxx: [],
206 zdmj: "",
207 zl: "",
208 tdyt: "",
209 qlsdfs: "",
210 qdjg: "",
211 tdsyqx: "",
212 syqqzsj: "",
213 fj: "",
214 djyy: "",
215 gyfs: "1",
216 // 是否分别持证
217 sffbcz: "",
218 // 持证人
219 czr: "",
220 },
221 //传递参数
222 propsParam: {},
223 rules: {},
224 };
225 },
226 methods: {
227 list (bsmSldy) {
228 var formdata = new FormData();
229 formdata.append("bsmSldy", bsmSldy);
230 Init(formdata).then((res) => {
231 if (res.code === 200 && res.result) {
232 this.ruleForm = {
233 ...res.result,
234 ...res.result.zdjbxxdatas,
235 ...res.result.qlxxdatas,
236 ...res.result.jsydsyqdatas,
237 };
238 }
239 });
240 },
241 onSubmit () {
242 fristReg(this.ruleForm).then((res) => {
243 if (res.code === 200 && res.result) {
244 console.log(res);
245 //this.ruleForm = { ...res.result, ...res.result.zdjbxxdatas, ...res.result.qlxxdatas, ...res.result.jsydsyqdatas }
246 }
247 });
248 },
249 },
250 };
251 </script>
252 <style scoped lang='scss'>
253 @import "~@/styles/public.scss";
254
255 /deep/.el-form {
256 display: flex;
257 flex-direction: column;
258 height: calc(100vh - 130px);
259 background-color: aqua;
260 }
261
262 /deep/.el-form-item__label {
263 padding: 0;
264 }
265
266 /deep/.el-radio {
267 margin-right: 10px;
268 }
269
270 /deep/.el-select {
271 width: 100%;
272 }
273
274 /deep/.el-form-item {
275 margin-bottom: 8px;
276 }
277
278 .marginBot0 {
279 margin-bottom: 0 !important;
280 }
281
282 .slxx {
283 box-sizing: border-box;
284 }
285
286 .slxx_con {
287 flex: 1;
288 height: 100%;
289 background-color: #ffffff;
290 overflow-y: auto;
291 padding-right: 3px;
292 overflow-x: hidden;
293 }
294
295 .submit_btn {
296 height: 50px;
297 }
298
299 .slxx_title {
300 border-bottom: 1px solid $borderColor;
301 padding-left: 10px;
302 padding-bottom: 5px;
303 margin-bottom: 10px;
304 margin-top: 5px;
305 font-size: 16px;
306 font-weight: 500;
307 color: #4a4a4a;
308 }
309
310 .btn {
311 text-align: center;
312 padding-top: 10px;
313 height: 36px;
314 background-color: #ffffff;
315 padding: 5px 0;
316 }
317
318 .textArea {
319 /deep/.el-textarea__inner {
320 min-height: 90px !important;
321 }
322 }
323
324 /deep/.el-form-item__label {
325 padding-bottom: 0px;
326 }
327 </style>
...\ No newline at end of file ...\ No newline at end of file