Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
5091d01f by 田浩浩
Options

Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcdj-web

2 parents eabb9c85 e4e913ac
Inline Side-by-side
Showing 13 changed files with 1158 additions and 656 deletions
...@@ -78,3 +78,21 @@ export function clmlDelete (params) { ...@@ -78,3 +78,21 @@ export function clmlDelete (params) {
78 params: params 78 params: params
79 }) 79 })
80 } 80 }
81
82 // 获取下一环节信息
83 export function getNextLinkInfo (params) {
84 return request({
85 url: '/business/workFlow/getNextLinkInfo',
86 method: 'get',
87 params: params
88 })
89 }
90
91 // 环节扩展信息
92 export function stepExpandInfo (data) {
93 return request({
94 url: '/business/workFlow/stepExpandInfo',
95 method: 'post',
96 data
97 })
98 }
......
...@@ -12,14 +12,14 @@ ...@@ -12,14 +12,14 @@
12 <div :class="['lb-table', customClass]"> 12 <div :class="['lb-table', customClass]">
13 <el-table v-if="!heightNumSetting" class="table-fixed" ref="elTable" :border='border' 13 <el-table v-if="!heightNumSetting" class="table-fixed" ref="elTable" :border='border'
14 :row-class-name="tableRowClassName" :show-header='showHeader' 14 :row-class-name="tableRowClassName" :show-header='showHeader'
15 :header-cell-style="{ background: 'rgb(217, 236, 255)' }" v-bind="$attrs" :height="tableHeight" v-on="$listeners" 15 :header-cell-style="{ background: 'rgb(236, 245, 255)' }" v-bind="$attrs" :height="tableHeight" v-on="$listeners"
16 :data="data" style="width: 100%" :span-method="this.merge ? this.mergeMethod : this.spanMethod"> 16 :data="data" style="width: 100%" :span-method="this.merge ? this.mergeMethod : this.spanMethod">
17 <lb-column v-bind="$attrs" v-for="(item, index) in column" :key="index" :column="item"> 17 <lb-column v-bind="$attrs" v-for="(item, index) in column" :key="index" :column="item">
18 </lb-column> 18 </lb-column>
19 </el-table> 19 </el-table>
20 20
21 <el-table v-else ref="elTable" class="table-fixed" :border='border' :row-class-name="tableRowClassName" 21 <el-table v-else ref="elTable" class="table-fixed" :border='border' :row-class-name="tableRowClassName"
22 :show-header='showHeader' :header-cell-style="{ background: 'rgb(217, 236, 255)' }" v-bind="$attrs" 22 :show-header='showHeader' :header-cell-style="{ background: 'rgb(236, 245, 255)' }" v-bind="$attrs"
23 :max-height="maxHeight" v-on="$listeners" :data="data" style="width: 100%" 23 :max-height="maxHeight" v-on="$listeners" :data="data" style="width: 100%"
24 :span-method="this.merge ? this.mergeMethod : this.spanMethod"> 24 :span-method="this.merge ? this.mergeMethod : this.spanMethod">
25 <lb-column v-bind="$attrs" v-for="(item, index) in column" :key="index" :column="item"> 25 <lb-column v-bind="$attrs" v-for="(item, index) in column" :key="index" :column="item">
......
1 <template>
2 <div style="width: 100%;height: 100%">
3 <vue-photo-zoom-pro :width="bigWidth" :url="url" :type="type" :scale="scale" :out-show="showType"
4 :overlayStyle="overlayStyle">
5 </vue-photo-zoom-pro>
6 </div>
7 </template>
8
9 <script>
10 import vuePhotoZoomPro from '@/components/photo-zoom/vue-photo-zoom-pro'
11 export default {
12 name: 'PicZoom',
13 components: { vuePhotoZoomPro },
14 data() {
15 return {
16 type: "square",
17 showType: false,
18 }
19 },
20 props: {
21 url: {
22 type: String,
23 required: true,
24 // default: require('@/assets/vehicle_img/blank_vehicle.jpg')
25 },
26 bigWidth: {
27 type: Number,
28 required: true,
29 default: 168
30 },
31 scale: {
32 type: Number,
33 required: true,
34 default: 2
35 },
36 overlayStyle: {
37 type: String,
38 default: 'width:100%;height:100%'
39 }
40 },
41 }
42 </script>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="pic-img">
3 <div class="img-container">
4 <img ref="img" @load="imgLoaded" :src="url" :style="overlayStyle" @error="imgerrorfun" />
5 <div class="overlay" @mousemove.stop="!moveEvent && mouseMove($event)"
6 @mouseout.stop="!leaveEvent && mouseLeave($event)" :style="overlayStyle">
7 </div>
8 <div v-if="!hideZoom && imgLoadedFlag &&!hideSelector" :class="['img-selector', {'circle': type === 'circle'}]"
9 :style="[imgSelectorStyle, imgSelectorSize, imgSelectorPosition, !outShow && imgBg, !outShow && imgBgSize, !outShow && imgBgPosition]">
10 <slot></slot>
11 </div>
12 <div v-if="outShow" v-show="!hideOutShow" :class="['img-out-show', {'base-line': baseline}]"
13 :style="[imgOutShowSize, imgOutShowPosition, imgBg, imgBgSize, imgBgPosition]">
14 <div v-if="pointer" class="img-selector-point"></div>
15 </div>
16 </div>
17 </div>
18
19 </template>
20
21 <script>
22 export default {
23 name: "vue-photo-zoom-pro",
24 props: {
25 url: {
26 type: String,
27 },
28 highUrl: String,
29 width: {
30 type: Number,
31 default: 168
32 },
33 type: {
34 type: String,
35 default: "square",
36 validator: function (value) {
37 return ["circle", "square"].indexOf(value) !== -1;
38 }
39 },
40 selectorStyle: {
41 type: Object,
42 default () {
43 return {};
44 }
45 },
46 outShowStyle: {},
47 scale: {
48 type: Number,
49 default: 3
50 },
51 moveEvent: {
52 type: [Object, MouseEvent],
53 default: null
54 },
55 leaveEvent: {
56 type: [Object, MouseEvent],
57 default: null
58 },
59 hideZoom: {
60 type: Boolean,
61 default: false
62 },
63 outShow: {
64 type: Boolean,
65 default: false
66 },
67 pointer: {
68 type: Boolean,
69 default: false
70 },
71 baseline: {
72 type: Boolean,
73 default: false
74 },
75 overlayStyle: {
76 type: String,
77 default: 'width:100%;height:100%'
78 },
79 },
80 data () {
81 return {
82 selector: {
83 width: this.width,
84 top: 0,
85 left: 0,
86 bgTop: 0,
87 bgLeft: 0,
88 rightBound: 0,
89 bottomBound: 0,
90 absoluteLeft: 0,
91 absoluteTop: 0
92 },
93 imgInfo: {},
94 $img: null,
95 screenWidth: document.body.clientWidth,
96 outShowInitTop: 0,
97 outShowTop: 0,
98 hideOutShow: true,
99 imgLoadedFlag: false,
100 hideSelector: false,
101 timer: null
102 };
103 },
104 watch: {
105 moveEvent (e) {
106 this.mouseMove(e);
107 },
108 leaveEvent (e) {
109 this.mouseLeave(e);
110 },
111 url (n) {
112 this.imgLoadedFlag = false;
113 },
114 width (n) {
115 this.initSelectorProperty(n);
116 },
117 screenWidth (val) {
118 if (!this.timer) {
119 this.screenWidth = val;
120 this.timer = setTimeout(() => {
121 this.imgLoaded();
122 clearTimeout(this.timer);
123 this.timer = null;
124 }, 400);
125 }
126 }
127 },
128 computed: {
129 addWidth () {
130 return !this.outShow ? (this.width / 2) * (1 - this.scale) : 0;
131 },
132 imgSelectorPosition () {
133 let { top, left } = this.selector;
134 return {
135 top: `${top}px`,
136 left: `${left}px`
137 };
138 },
139 imgSelectorSize () {
140 let width = this.selector.width;
141 return {
142 width: `${width}px`,
143 height: `${width}px`,
144 borderRadius: '50%'
145 };
146 },
147 imgSelectorStyle () {
148 return this.selectorStyle;
149 },
150 imgOutShowSize () {
151 let {
152 scale,
153 selector: { width }
154 } = this;
155 return {
156 width: `${width * scale}px`,
157 height: `${width * scale}px`
158 };
159 },
160 imgOutShowPosition () {
161 return {
162 top: `${this.outShowTop}px`,
163 right: `${-8}px`
164 };
165 },
166 imgBg () {
167 return {
168 backgroundImage: `url(${this.highUrl || this.url})`
169 };
170 },
171 imgBgSize () {
172 let {
173 scale,
174 imgInfo: { height, width }
175 } = this;
176 return {
177 backgroundSize: `${width * scale}px ${height * scale}px`
178 };
179 },
180 imgBgPosition () {
181 let { bgLeft, bgTop } = this.selector;
182 return {
183 backgroundPosition: `${bgLeft}px ${bgTop}px`
184 };
185 },
186 },
187 mounted () {
188 this.$img = this.$refs["img"];
189 },
190 methods: {
191 imgLoaded () {
192 let imgInfo = this.$img.getBoundingClientRect();
193 if (JSON.stringify(this.imgInfo) != JSON.stringify(imgInfo)) {
194 this.imgInfo = imgInfo;
195 this.initSelectorProperty(this.width);
196 this.resetOutShowInitPosition();
197 }
198 if (!this.imgLoadedFlag) {
199 this.imgLoadedFlag = true;
200 this.$emit("created", imgInfo);
201 }
202 },
203 mouseMove (e) {
204 if (!this.hideZoom && this.imgLoadedFlag) {
205 this.imgLoaded();
206 const { pageX, pageY, clientY } = e;
207 const { scale, selector, outShow, addWidth, outShowAutoScroll } = this;
208 let { outShowInitTop } = this;
209 const scrollTop = pageY - clientY;
210 const { absoluteLeft, absoluteTop, rightBound, bottomBound } = selector;
211 const x = pageX - absoluteLeft; // 选择器的x坐标 相对于图片
212 const y = pageY - absoluteTop; // 选择器的y坐标
213 if (outShow) {
214 if (!outShowInitTop) {
215 outShowInitTop = this.outShowInitTop = scrollTop + this.imgInfo.top;
216 }
217 this.hideOutShow && (this.hideOutShow = false);
218 this.outShowTop =
219 scrollTop > outShowInitTop ? scrollTop - outShowInitTop : 0;
220 }
221 this.hideSelector && (this.hideSelector = false);
222 selector.top = y > 0 ? (y < bottomBound ? y : bottomBound) : 0;
223 selector.left = x > 0 ? (x < rightBound ? x : rightBound) : 0;
224 selector.bgLeft = addWidth - x * scale; // 选择器图片的坐标位置
225 selector.bgTop = addWidth - y * scale;
226 }
227 },
228 initSelectorProperty (selectorWidth) {
229 const selectorHalfWidth = selectorWidth / 2;
230 const selector = this.selector;
231 const { width, height, left, top } = this.imgInfo;
232 const { scrollLeft, scrollTop } = document.documentElement;
233 selector.width = selectorWidth;
234 selector.rightBound = width - selectorWidth;
235 selector.bottomBound = height - selectorWidth;
236 selector.absoluteLeft = left + selectorHalfWidth + scrollLeft;
237 selector.absoluteTop = top + selectorHalfWidth + scrollTop;
238 },
239 mouseLeave () {
240 this.hideSelector = true;
241 if (this.outShow) {
242 this.hideOutShow = true;
243 }
244 },
245 reset () {
246 Object.assign(this.selector, {
247 top: 0,
248 left: 0,
249 bgLeft: 0,
250 bgTop: 0
251 });
252 this.resetOutShowInitPosition();
253 },
254 resetOutShowInitPosition () {
255 this.outShowInitTop = 0;
256 },
257 imgerrorfun (e) {
258 // let img = require('@/assets/vehicle_img/blank_vehicle.jpg')
259 // this.url = img
260 // e.target.src = img
261 // e.target.onerror= null
262 }
263 }
264 };
265 </script>
266
267 <style scoped>
268 .img-container {
269 position: relative;
270 max-width: 82%;
271 margin: 0 auto;
272 }
273 .overlay {
274 cursor: crosshair;
275 position: absolute;
276 top: 0;
277 left: 0;
278 opacity: 0.5;
279 z-index: 3;
280 }
281 .img-selector {
282 position: absolute;
283 cursor: crosshair;
284 border: 1px solid rgba(0, 0, 0, 0.1);
285 background-repeat: no-repeat;
286 background-color: rgba(64, 64, 64, 0.6);
287 }
288 .img-selector.circle {
289 border-radius: 50%;
290 }
291 .img-out-show {
292 z-index: 5000;
293 position: absolute;
294 background-repeat: no-repeat;
295 -webkit-background-size: cover;
296 background-color: white;
297 transform: translate(100%, 0);
298 }
299 .img-selector-point {
300 position: absolute;
301 width: 4px;
302 height: 4px;
303 top: 50%;
304 left: 50%;
305 transform: translate(-50%, -50%);
306 background-color: black;
307 }
308 .img-out-show.base-line::after {
309 position: absolute;
310 box-sizing: border-box;
311 content: "";
312 width: 1px;
313 top: 0;
314 bottom: 0;
315 left: 50%;
316 transform: translateX(-50%);
317 }
318 .img-out-show.base-line::before {
319 position: absolute;
320 box-sizing: border-box;
321 content: "";
322 height: 1px;
323 border: 1px dashed rgba(0, 0, 0, 0.36);
324 left: 0;
325 right: 0;
326 top: 50%;
327 transform: translateY(-50%);
328 }
329 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <el-image-viewer
3 :on-close="closeViewer"
4 :url-list="urlList">
5 </el-image-viewer>
6 </template>
7
8 <script>
9 import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
10 export default {
11 components: {
12 ElImageViewer,
13 },
14 props: {
15 urlList: {
16 type: Array,
17 default: function () {
18 return []
19 },
20 },
21 },
22 data () {
23 return {
24 wrapperElem: null,
25 }
26 },
27 mounted () {
28 this.$nextTick(() => {
29 let wrapper = document.getElementsByClassName(
30 'el-image-viewer__actions__inner'
31 )
32 let downImg = document.createElement('i')
33 downImg.setAttribute('class', 'el-icon-download')
34 wrapper[0].appendChild(downImg)
35 if (wrapper.length > 0) {
36 this.wrapperElem = wrapper[0]
37 this.wrapperElem.addEventListener('click', this.hideCusBtn)
38 }
39 })
40 },
41 methods: {
42 closeViewer () {
43 this.$emit('close-viewer')
44 },
45 hideCusBtn (e) {
46 let className = e.target.className
47 if (className === 'el-icon-download') {
48 let imgUrl = document.getElementsByClassName(
49 'el-image-viewer__canvas'
50 )[0].children[0].src
51 this.downloadImage(imgUrl)
52 }
53 },
54 downloadImage (imgUrl) {
55 let tmpArr = imgUrl.split('/')
56 let fileName = tmpArr[tmpArr.length - 1]
57 window.URL = window.URL || window.webkitURL
58 let xhr = new XMLHttpRequest()
59 xhr.open('get', imgUrl, true)
60 xhr.responseType = 'blob'
61 xhr.onload = function () {
62 if (this.status == 200) {
63 //得到一个blob对象
64 let blob = this.response
65 let fileUrl = window.URL.createObjectURL(blob)
66 let a = document.createElement('a')
67 ; (document.body || document.documentElement).appendChild(a)
68 a.href = fileUrl
69 if ('download' in a) {
70 a.download = fileName
71 } else {
72 a.setAttribute('download', fileName)
73 }
74 a.target = '_self'
75 a.click()
76 a.remove()
77 }
78 }
79 xhr.send()
80 },
81 },
82 }
83 </script>
84
85 <style lang="scss" scoped>
86 /deep/ .el-image-viewer__close {
87 color: #ffffff;
88 }
89 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663579235470" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2391" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M687.603949 656.994302 541.10027 510.457878 687.603949 363.943966c8.829086-8.840342 8.829086-23.122627 0-31.961946-8.850575-8.840342-23.13286-8.840342-31.962969 0L509.138324 478.495932 362.623389 331.980997c-8.840342-8.818853-23.122627-8.818853-31.962969 0-8.840342 8.840342-8.840342 23.144116 0 31.984459l146.493445 146.514935L330.638931 656.994302c-8.819876 8.830109-8.819876 23.133883 0 31.962969 8.840342 8.829086 23.144116 8.829086 31.984459 0l146.514935-146.514935 146.502655 146.514935c8.830109 8.829086 23.112394 8.829086 31.962969 0C696.433034 680.129208 696.45657 665.824411 687.603949 656.994302z" p-id="2392" fill="#ffffff"></path><path d="M938.362063 510.457878c0-237.061161-192.174857-429.234995-429.247274-429.234995-237.062184 0-429.246251 192.173834-429.246251 429.234995 0 237.083673 192.185091 429.257507 429.246251 429.257507 97.345072 0 186.435133-33.110095 258.440074-87.677898 2.958378-3.354398 4.900613-7.636934 4.900613-12.449543 0-10.506285-8.521071-19.026332-19.027355-19.026332-5.431709 0-10.287297 2.162246-13.752212 5.826705l-0.2415 0c-64.456011 47.414893-143.745868 75.800383-229.876528 75.800383-214.679407 0-388.730489-174.073594-388.730489-388.719232 0-214.688617 174.051081-388.718209 388.730489-388.718209 214.688617 0 388.697743 174.029592 388.697743 388.718209 0 65.548902-15.386432 127.277802-44.081984 181.490517l0 0.309038c-0.508583 1.811252-1.104147 3.576455-1.104147 5.519714 0 10.507308 8.520047 19.028379 19.028379 19.028379 8.18952 0 15.054881-5.254677 17.703197-12.494569l0 0.132006C920.349827 648.38625 938.362063 581.536726 938.362063 510.457878z" p-id="2393" fill="#ffffff"></path></svg>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="rlPopup">
3 <div class="prev handle-btn" v-if="!isSingle" @click="prev()">
4 <i class="el-icon-arrow-left"></i>
5 </div>
6 <div class="next handle-btn" v-if="!isSingle" @click="next()">
7 <i class="el-icon-arrow-right"></i>
8 </div>
9 <div class="img-list-wrap">
10 <div v-for="(img, i) in previewImg.imgList" :key="i">
11 <photo-zoom :url="img.url" :bigWidth="165" v-if="i === previewImg.index" :scale="2"
12 overlayStyle="width: 100%;height: 563px;">
13 </photo-zoom>
14 </div>
15 </div>
16 <!--缩略图-->
17 <div class="thumb-wrap">
18 <div class="thumb-wrap-button">
19 <el-button type="primary" @click="clickImage">（放大） 显示（缩小）</el-button>
20 <el-upload class="fileUpdate" action="" :show-file-list="false" multiple :limit="5" :auto-upload="false"
21 :on-change="handleChange" accept=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg" :before-upload="beforeUpload">
22 <el-button icon="el-icon-upload" type="primary">上传</el-button>
23 </el-upload>
24 <el-button type="primary" icon="el-icon-delete-solid" @click="handleDelete">删除</el-button>
25 </div>
26 <ul>
27 <li v-for="(img, index) in thumbnailImages" :key="index" :class="{ active:previewImg.index === index}"
28 @click="showCurrent(index)">
29 <img :src="img.url">
30 </li>
31 </ul>
32 </div>
33 <!-- 点开后的视图 -->
34 <publicPicture v-if="showViewer" :url-list="allLi" :initialIndex="initialIndex" @close-viewer="closeViewer">
35 </publicPicture>
36 </div>
37 </template>
38 <script>
39 import PhotoZoom from '@/components/photo-zoom'
40 import publicPicture from '@/components/publicPicture/index.vue'
41 export default {
42 name: 'PreviewImage',
43 props: {
44 previewImg: {
45 type: Object,
46 default: () => { }
47 }
48 },
49 components: {
50 PhotoZoom,
51 publicPicture
52 },
53 data () {
54 return {
55 transform: {
56 scale: 1,
57 degree: 0
58 },
59 // 缩略图
60 thumbnailImages: this.previewImg.imgList,
61 showViewer: false,
62 initialIndex: undefined,
63 allLi: [],
64 }
65 },
66 watch: {
67 previewImg: {
68 handler (newValue, oldValue) {
69 this.allLi = _.cloneDeep(newValue.imgList).map(item => item.url)
70 },
71 deep: true
72 }
73 },
74 computed: {
75 isSingle () {
76 return this.previewImg.imgList.length <= 1
77 },
78 isFirst () {
79 return this.previewImg.index === 0
80 },
81 isLast () {
82 return this.previewImg.index === this.previewImg.imgList.length - 1
83 }
84 },
85 methods: {
86 prev () {
87 if (this.isFirst) {
88 if (this.previewImg.selectedIndex - 1 >= 0) {
89 this.$parent.previewImg.index = 1
90 }
91 return
92 }
93 const len = this.previewImg.imgList.length
94 this.$parent.previewImg.index = (this.$parent.previewImg.index - 1 + len) % len
95 this.reset()
96 },
97 next () {
98 if (this.isLast) {
99 if (this.previewImg.selectedIndex + 1 < this.previewImg.attachmentList.length) {
100 this.$parent.previewImg.index = 0
101 }
102 return
103 }
104 const len = this.previewImg.imgList.length
105 this.$parent.previewImg.index = (this.$parent.previewImg.index + 1) % len
106 this.reset()
107 },
108 reset () {
109 this.transform = {
110 scale: 1,
111 degree: 0
112 }
113 },
114 showCurrent (index) {
115 this.previewImg.index = index
116 },
117 closeViewer () {
118 this.showViewer = false
119 },
120 clickImage () {
121 this.showViewer = true
122 },
123 // 上传
124 beforeUpload (file) {
125 const isJPEG = file.type === 'image/jpeg'
126 const isPNG = file.type === 'image/png'
127 const isJPG = file.type === 'image/jpg'
128 const isGIF = file.type === 'image/gif'
129 const isLt5M = file.size / 1024 / 1024 < 5
130 if (!isJPEG && !isGIF && !isPNG && !isJPG && !isGIF) {
131 this.$message.error('请选择jpeg/png/jpg/bmp/gif格式的图片后重试')
132 this.loading = false
133 }
134 if (!isLt5M) {
135 this.$message.error('上传图片大小不能超过 5MB!')
136 this.loading = false
137 }
138 this.imgHidden = (isJPG || isJPEG || isPNG || isGIF) && isLt5M
139 return this.imgHidden
140 },
141 async handleChange (file) {
142 let data = _.cloneDeep(this.previewImg.imgList[this.previewImg.index])
143 },
144 handleDelete () {
145 let _this = this
146 this.$confirm('此操作将永久该附件, 是否继续?', '提示', {
147 confirmButtonText: '确定',
148 cancelButtonText: '取消',
149 type: 'warning'
150 }).then(async () => {
151 let bsmFileList = []
152 bsmFileList[0] = this.previewImg.imgList[this.previewImg.index].bsmFile
153 }).catch(() => {
154 this.$message({
155 type: 'info',
156 message: '已取消删除'
157 });
158 });
159 }
160 }
161 }
162 </script>
163
164 <style lang="scss" scoped>
165 // 查看大图
166 .rlPopup {
167 position: relative;
168 width: 100%;
169 text-align: center;
170 height: 100%;
171
172 .handle-btn {
173 position: absolute;
174 top: 50%;
175 transform: translateY(-100%);
176 width: 66px;
177 height: 66px;
178 line-height: 75px;
179 color: #fff;
180 background-color: rgb(198, 198, 198);
181 border-radius: 4px;
182 cursor: pointer;
183 text-align: center;
184
185 i {
186 font-size: 24px;
187 }
188 }
189
190 .prev {
191 left: 0%;
192 }
193
194 .next {
195 right: 0%;
196 }
197
198 .img-list-wrap {
199 width: 100%;
200 display: flex;
201 justify-content: center;
202 height: calc(100% - 80px);
203 align-items: center;
204 background: rgba(194, 190, 190, 0.1);
205
206 img {
207 display: block;
208 object-fit: scale-down;
209 transition: all 0.3s;
210 max-width: 100%;
211 }
212 }
213
214 .thumb-wrap {
215 &-button {
216 display: flex;
217 justify-content: center;
218
219 .fileUpdate {
220 margin: 0 10px;
221 }
222 }
223
224 li {
225 float: left;
226 width: 60px;
227 height: 45px;
228 border: solid 1px #ececec;
229 position: relative;
230 margin-right: 5px;
231 cursor: pointer;
232
233 &:last-child {
234 margin-right: 0;
235 }
236
237 img {
238 max-width: 57px;
239 max-height: 42px;
240 display: block;
241 object-fit: scale-down;
242 position: absolute;
243 top: 50%;
244 left: 50%;
245 transform: translate(-50%, -50%);
246 }
247 }
248
249 .active {
250 border-color: #409eff;
251 }
252 }
253 }
254 </style>
255 <style>
256 .zoom-on-hover {
257 position: relative;
258 overflow: hidden;
259 }
260
261 .zoom-on-hover .normal {
262 width: 100%;
263 }
264
265 .zoom-on-hover .zoom {
266 position: absolute;
267 opacity: 0;
268 transform-origin: top left;
269 }
270
271 .zoom-on-hover.zoomed .zoom {
272 opacity: 1;
273 }
274
275 .zoom-on-hover.zoomed .normal {
276 opacity: 0;
277 }
278 </style>
...@@ -44,10 +44,8 @@ ...@@ -44,10 +44,8 @@
44 </el-row> 44 </el-row>
45 </el-form> 45 </el-form>
46 </div> 46 </div>
47 <!-- 表格 -->
48 <!-- 表格 -->
49 <div class="from-clues-content"> 47 <div class="from-clues-content">
50 <lb-table :page-size="pageData.size" :current-page.sync="pageData.currentPage" :total="tableData.total" 48 <lb-table :page-size="pageData.size" border :current-page.sync="pageData.currentPage" :total="tableData.total"
51 @size-change="handleSizeChange" @p-current-change="handleCurrentChange" :column="tableData.columns" 49 @size-change="handleSizeChange" @p-current-change="handleCurrentChange" :column="tableData.columns"
52 :data="tableData.data"> 50 :data="tableData.data">
53 </lb-table> 51 </lb-table>
......
1 <template> 1 <template>
2 <div> 2 <div>
3 <lb-table :column="InformationTable" border :key="key" :heightNum="390" :pagination="false" heightNumSetting 3 <lb-table :column="InformationTable" :maxHeight="300" heightNumSetting :pagination="false" :data="tableData">
4 :data="tableData"> 4 </lb-table>
5 </lb-table>
6 </div> 5 </div>
7 </template> 6 </template>
8 <script> 7 <script>
8 import { mapGetters } from 'vuex'
9 export default { 9 export default {
10 /**注册组件*/ 10 computed: {
11 components: {}, 11 ...mapGetters(["dictData"]),
12 },
13 props: {
14 tableData: {
15 type: Array,
16 default: []
17 }
18 },
12 data () { 19 data () {
13 return { 20 return {
14 key: 0, 21 InformationTable: [
15 tableData:[{ 22 {
16 xm: '12',
17 zjzl: '32',
18 zjh: '123',
19 fr: "213123",
20 }],
21 InformationTable:[
22 {
23 width: '60', 23 width: '60',
24 renderHeader: (h, scope) => { 24 renderHeader: (h, scope) => {
25 return <i class="el-icon-plus pointer" onClick={() => { this.handleAdd() }} style="color:#409EFF"></i> 25 return <i class="el-icon-plus pointer" onClick={() => { this.handleAdd() }} style="color:#409EFF"></i>
...@@ -30,40 +30,62 @@ export default { ...@@ -30,40 +30,62 @@ export default {
30 ) 30 )
31 } 31 }
32 }, 32 },
33 { 33 {
34 label: '身份证读卡器', 34 label: '身份证读卡器',
35 align: 'center', 35 align: 'center',
36 render: (h, scope) => { 36 render: (h, scope) => {
37 return <el-button type="text" icon="el-icon-delete" onClick={() => { this.readClick(scope) }}>读取</el-button> 37 return <el-button type="text" icon="el-icon-tickets" onClick={() => { this.readClick(scope) }}>读取</el-button>
38 } 38 }
39 }, 39 },
40 { 40 {
41 prop: "xm", 41 prop: "sqrmc",
42 label: "姓名/名称", 42 label: "姓名/名称",
43 }, 43 render: (h, scope) => {
44 { 44 return (
45 prop: "zjzl", 45 <el-input placeholder="姓名/名称" value={scope.row[scope.column.property]}
46 label: "证件种类", 46 onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
47 }, 47 )
48 { 48 }
49 prop: "zjh", 49 },
50 label: "证件号", 50 {
51 }, 51 prop: "dlrzjlx",
52 { 52 label: "证件种类",
53 prop: "fr", 53 render: (h, scope) => {
54 label: "法人", 54 return (
55 }, 55 <el-select value={scope.row[scope.column.property]}>
56 { 56 {
57 label: '操作', 57 this.dictData && this.dictData['A30'].map(option => {
58 width: '80', 58 return (
59 align: 'center', 59 <el-option label={option.dname} value={option.dcode}></el-option>
60 fixed: 'right', 60 )
61 render: (h, scope) => { 61 })
62 return <el-button type="text" icon="el-icon-delete" onClick={() => { vm.editClick(scope) }}>修改</el-button> 62 }
63 </el-select>
64 )
65 }
66 },
67 {
68 prop: "dlrzjh",
69 label: "证件号",
70 render: (h, scope) => {
71 return (
72 <el-input placeholder="证件号" value={scope.row[scope.column.property]}
73 onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
74 )
75 }
76 },
77 {
78 prop: "fr",
79 label: "法人",
80 render: (h, scope) => {
81 return (
82 <el-input placeholder="法人" value={scope.row[scope.column.property]}
83 onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
84 )
85 }
63 } 86 }
64 } 87 ]
65 ] 88 }
66 };
67 }, 89 },
68 watch: { 90 watch: {
69 tableData: { 91 tableData: {
...@@ -73,16 +95,15 @@ export default { ...@@ -73,16 +95,15 @@ export default {
73 deep: true 95 deep: true
74 } 96 }
75 }, 97 },
76 created(){}, 98 methods: {
77 methods:{
78 // 添加 99 // 添加
79 handleAdd () { 100 handleAdd () {
80 this.tableData.push( 101 this.tableData.push(
81 { 102 {
82 xm: '22', 103 sqrmc: '',
83 zjzl: '33', 104 dlrzjlx: '',
84 zjh: '44', 105 dlrzjh: '',
85 fr: "55", 106 fr: ''
86 } 107 }
87 ) 108 )
88 this.key++ 109 this.key++
...@@ -92,12 +113,13 @@ export default { ...@@ -92,12 +113,13 @@ export default {
92 this.tableData.splice(index, 1) 113 this.tableData.splice(index, 1)
93 }, 114 },
94 // 身份证读取 115 // 身份证读取
95 readClick(){}, 116 readClick () { },
96 117
97 // 修改 118 // 修改
98 editClick(){}, 119 editClick () { },
99 } 120 }
100 } 121 }
101 </script> 122 </script>
102 <style scoped lang='scss'> 123 <style scoped lang='scss'>
124
103 </style> 125 </style>
...\ No newline at end of file ...\ No newline at end of file
......
1 <template> 1 <template>
2 <div class="clxx"> 2 <div class="clxx">
3 <div class="left"> 3 <div class="left">
4 <div 4 <div v-for="item in menuList" :key="item.id" :class="['item', checkedId == item.id ? 'active' : '']"
5 v-for="item in menuList" 5 @click="menuClick(item)">
6 :key="item.id"
7 :class="['item', checkedId == item.id ? 'checked' : '']"
8 @click="menuClick(item)"
9 >
10 {{ item.label }} 6 {{ item.label }}
11 </div> 7 </div>
12 </div> 8 </div>
...@@ -14,78 +10,12 @@ ...@@ -14,78 +10,12 @@
14 <!-- 材料目录明细 --> 10 <!-- 材料目录明细 -->
15 <div class="clmlmx-box" v-if="checkedId == '1'"> 11 <div class="clmlmx-box" v-if="checkedId == '1'">
16 <div class="title">申请材料目录</div> 12 <div class="title">申请材料目录</div>
17 <lb-table 13 <lb-table :column="column" :key="key" :heightNum="210" :pagination="false" :data="tableData">
18 :column="column"
19 border
20 :key="key"
21 heightNumSetting
22 :pagination="false"
23 :data="tableData"
24 >
25 </lb-table> 14 </lb-table>
26 </div> 15 </div>
27
28 <!-- 材料预览 --> 16 <!-- 材料预览 -->
29 <div class="clyl-box" v-if="checkedId == '2'"> 17 <div class="clyl-box" v-else>
30 <div class="menu-tree"> 18 <image-preview :previewImg="previewImg" />
31 <div class="item">
32 材料目录
33 <i :class="iclass" @click="iconClick()"></i>
34 <el-collapse-transition>
35 <div v-show="menuOpen">
36 <div
37 v-for="item in tableData"
38 :key="item.bsmSj"
39 :class="['child', treeCheckId == item.bsmSj ? 'checked' : '']"
40 @click="treeClick(item)"
41 >
42 {{ item.sjmc }}
43 </div>
44 </div>
45 </el-collapse-transition>
46 </div>
47 </div>
48 <div class="clyl-img">
49 <div class="header">
50 <div class="title" v-if="titleNum == 0">
51 {{ title }}
52 </div>
53 <div class="title" v-else>
54 {{ title }} ({{ titleYs }} / {{ titleNum }})
55 </div>
56 <div class="i-group">
57 <i class="el-icon-zoom-in"></i>
58 <i class="el-icon-zoom-out"></i>
59 <i class="el-icon-refresh-right"></i>
60 <i class="el-icon-refresh-left"></i>
61 <i class="el-icon-document"></i>
62 </div>
63 </div>
64 <div class="prev" @click="imgPrev()" v-if="imgList.length > 0">
65 <i class="el-icon-arrow-left"></i>
66 </div>
67 <div class="img-box">
68 <img :src="showImg.imgUrl" alt="" />
69 </div>
70 <div class="next" @click="imgNext()" v-if="imgList.length > 0">
71 <i class="el-icon-arrow-right"></i>
72 </div>
73 <div class="img-list">
74 <div class="item" v-for="(item, index) in imgList" :key="index">
75 <img
76 :class="showImg.id == item.id ? 'active' : ''"
77 :src="item.imgUrl"
78 alt=""
79 @click="imgClick(item, index)"
80 />
81 </div>
82 </div>
83 <div class="btn-group">
84 <el-button>扫描</el-button>
85 <el-button icon="el-icon-upload2">上传文件</el-button>
86 <el-button icon="el-icon-delete">删除</el-button>
87 </div>
88 </div>
89 </div> 19 </div>
90 </div> 20 </div>
91 <clxxAddDialog v-model="isDialog" /> 21 <clxxAddDialog v-model="isDialog" />
...@@ -94,13 +24,11 @@ ...@@ -94,13 +24,11 @@
94 <script> 24 <script>
95 import { mapGetters } from "vuex"; 25 import { mapGetters } from "vuex";
96 import clxxAddDialog from "./clxxAddDialog.vue"; 26 import clxxAddDialog from "./clxxAddDialog.vue";
97 import { upward, down } from "@/utils/operation"; 27 import imagePreview from '@/views/components/imagePreview.vue'
98 import { clmlInit, move, save, clmlDelete } from "@/api/fqsq.js"; 28 import { clmlInit, move, save, clmlDelete } from "@/api/fqsq.js";
99 import filter from "@/utils/filter.js";
100
101 export default { 29 export default {
102 components: { clxxAddDialog }, 30 components: { clxxAddDialog, imagePreview },
103 data() { 31 data () {
104 return { 32 return {
105 isDialog: false, 33 isDialog: false,
106 menuList: [ 34 menuList: [
...@@ -122,9 +50,8 @@ export default { ...@@ -122,9 +50,8 @@ export default {
122 <i 50 <i
123 class="el-icon-plus pointer" 51 class="el-icon-plus pointer"
124 onClick={() => { 52 onClick={() => {
125 this.handleAdd(); 53 this.handleAdd()
126 }} 54 }}
127 style="color:#409EFF"
128 ></i> 55 ></i>
129 ); 56 );
130 }, 57 },
...@@ -243,39 +170,40 @@ export default { ...@@ -243,39 +170,40 @@ export default {
243 ], 170 ],
244 key: 0, 171 key: 0,
245 tableData: [], 172 tableData: [],
246 menuOpen: true, 173 previewImg: {
247 treeCheckId: "", 174 bsmCatalog: '',
248 defaultProps: { 175 index: 0,
249 children: "children", 176 selectedIndex: 0,
250 label: "label", 177 imgList: [
251 }, 178 {
252 title: "", 179 url: 'https://img2.baidu.com/it/u=2955521104,3257476296&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=1111'
253 titleYs: 1, 180 },
254 titleNum: 0, 181 {
255 imgList:[], 182 url: 'https://img1.baidu.com/it/u=2383300938,4241539174&fm=253&fmt=auto&app=138&f=JPEG?w=307&h=500'
256 showImg:{}, 183 }
257 iclass: "itemIcon el-icon-caret-bottom", 184 ],
185 }
258 }; 186 };
259 }, 187 },
260 computed: { 188 computed: {
261 ...mapGetters(["dictData"]), 189 ...mapGetters(["dictData"]),
262 }, 190 },
263 mounted() { 191 mounted () {
264 if (this.$parent.index == 1) { 192 if (this.$parent.index == 1) {
265 this.clmlmxInit(); 193 this.clmlmxInit();
266 } 194 }
267 }, 195 },
268 methods: { 196 methods: {
269 // 左侧菜单点击 197 // 左侧菜单点击
270 menuClick(item) { 198 menuClick (item) {
271 this.checkedId = item.id; 199 this.checkedId = item.id;
272 }, 200 },
273 // 添加材料目录 201 // 添加材料目录
274 handleAdd() { 202 handleAdd () {
275 this.isDialog = true; 203 this.isDialog = true;
276 }, 204 },
277 // 上移 205 // 上移
278 moveUpward(index, row) { 206 moveUpward (index, row) {
279 let obj = { 207 let obj = {
280 xh: row.xh, 208 xh: row.xh,
281 bsmSlsq: row.bsmSlsq, 209 bsmSlsq: row.bsmSlsq,
...@@ -288,7 +216,7 @@ export default { ...@@ -288,7 +216,7 @@ export default {
288 }); 216 });
289 }, 217 },
290 // 下移 218 // 下移
291 moveDown(index, row) { 219 moveDown (index, row) {
292 let obj = { 220 let obj = {
293 xh: row.xh, 221 xh: row.xh,
294 bsmSlsq: row.bsmSlsq, 222 bsmSlsq: row.bsmSlsq,
...@@ -301,7 +229,7 @@ export default { ...@@ -301,7 +229,7 @@ export default {
301 }); 229 });
302 }, 230 },
303 // 材料目录明细初始化 231 // 材料目录明细初始化
304 clmlmxInit() { 232 clmlmxInit () {
305 this.id = this.$parent.$parent.$parent.id; 233 this.id = this.$parent.$parent.$parent.id;
306 this.unitData = this.$parent.$parent.$parent.unitData; 234 this.unitData = this.$parent.$parent.$parent.unitData;
307 var formdata = new FormData(); 235 var formdata = new FormData();
...@@ -318,7 +246,7 @@ export default { ...@@ -318,7 +246,7 @@ export default {
318 }); 246 });
319 }, 247 },
320 // 新增弹窗保存 248 // 新增弹窗保存
321 addSave(data) { 249 addSave (data) {
322 let maxXh = 0; 250 let maxXh = 0;
323 this.tableData.forEach((item) => { 251 this.tableData.forEach((item) => {
324 if (item.xh > maxXh) { 252 if (item.xh > maxXh) {
...@@ -346,7 +274,7 @@ export default { ...@@ -346,7 +274,7 @@ export default {
346 }); 274 });
347 }, 275 },
348 // 材料目录删除 276 // 材料目录删除
349 handleDelete(index, row) { 277 handleDelete (index, row) {
350 clmlDelete({ sjBsm: row.bsmSj }).then((res) => { 278 clmlDelete({ sjBsm: row.bsmSj }).then((res) => {
351 if (res.code == 200) { 279 if (res.code == 200) {
352 this.$message({ 280 this.$message({
...@@ -359,7 +287,7 @@ export default { ...@@ -359,7 +287,7 @@ export default {
359 }); 287 });
360 }, 288 },
361 // 材料目录关闭收起 289 // 材料目录关闭收起
362 iconClick() { 290 iconClick () {
363 this.menuOpen = !this.menuOpen; 291 this.menuOpen = !this.menuOpen;
364 if (this.menuOpen) { 292 if (this.menuOpen) {
365 this.iclass = "itemIcon el-icon-caret-bottom close"; 293 this.iclass = "itemIcon el-icon-caret-bottom close";
...@@ -368,27 +296,19 @@ export default { ...@@ -368,27 +296,19 @@ export default {
368 } 296 }
369 }, 297 },
370 // 材料目录点击选中 298 // 材料目录点击选中
371 treeClick(item) { 299 treeClick (item) {
372 this.treeCheckId = item.bsmSj; 300 this.treeCheckId = item.bsmSj;
373 this.title = item.sjmc; 301 this.title = item.sjmc;
374 this.titleYs = 1; 302 this.titleYs = 1;
375 this.titleNum = item.children.length; 303 this.titleNum = item.children.length;
376 }, 304 },
377 // 小图片点击 305 // 小图片点击
378 imgClick(item, index) { 306 imgClick (item, index) {
379 this.showImg = item; 307 this.showImg = item;
380 this.titleYs = index + 1; 308 this.titleYs = index + 1;
381 }, 309 },
382 // 图片上一张
383 imgPrev(){
384
385 },
386 // 图片下一张
387 imgNext(){
388
389 },
390 // 字典 310 // 字典
391 dicStatus(val, code) { 311 dicStatus (val, code) {
392 let data = this.$store.getters.dictData[code], 312 let data = this.$store.getters.dictData[code],
393 name = "暂无"; 313 name = "暂无";
394 if (data) { 314 if (data) {
...@@ -404,52 +324,48 @@ export default { ...@@ -404,52 +324,48 @@ export default {
404 }; 324 };
405 </script> 325 </script>
406 <style scoped lang='scss'> 326 <style scoped lang='scss'>
327 @import "~@/styles/mixin.scss";
328
329 .active {
330 background: $light-blue !important;
331 color: #fff;
332 }
333
407 .clxx { 334 .clxx {
408 width: 100%; 335 width: 100%;
409 height: 100%;
410 display: flex; 336 display: flex;
411 padding-left: 15px; 337 padding-left: 15px;
338 height: calc(100vh - 150px);
339
412 .left { 340 .left {
413 width: 52px; 341 display: flex;
414 height: 780px; 342 flex-direction: column;
415 background: #f3f4f7; 343 justify-content: space-between;
416 border-radius: 1px; 344
417 .item { 345 .item {
418 width: 42px; 346 width: 42px;
419 height: 50%; 347 height: 49%;
420 margin: 0 0 auto auto; 348 @include flex-center;
421 writing-mode: tb; 349 background-color: #E4E7ED;
422 display: flex; 350 border-bottom-right-radius: 10px;
423 justify-content: center; 351 padding: 15px;
424 align-items: center;
425 font-size: 16px;
426 font-family: PingFangSC-Medium, PingFang SC;
427 color: #7a7a7a;
428 cursor: pointer; 352 cursor: pointer;
429 border-right: 1px solid #d9d9d9; 353 transition: all 0.3s;
430 } 354
431 .item.checked { 355 &:hover {
432 background: #ffffff; 356 @extend .active;
433 border-top: 1px solid #d9d9d9; 357 }
434 border-bottom: 1px solid #d9d9d9;
435 border-left: 2px solid #2b7ff1;
436 border-right: none;
437 font-size: 18px;
438 color: #4a4a4a;
439 } 358 }
440 } 359 }
360
441 .right { 361 .right {
442 width: calc(100% - 80px); 362 width: 100%;
443 height: 780px; 363 height: 100%;
444 padding: 0 30px; 364 padding: 0 15px;
445 365
446 .clmlmx-box { 366 .clmlmx-box {
447 width: 100%;
448 height: 530px;
449 margin: 0 auto; 367 margin: 0 auto;
450 border: 1px solid #d9d9d9; 368
451 background: #f3f4f7;
452 padding: 20px;
453 .title { 369 .title {
454 text-align: center; 370 text-align: center;
455 height: 60px; 371 height: 60px;
...@@ -472,12 +388,14 @@ export default { ...@@ -472,12 +388,14 @@ export default {
472 margin-right: 30px; 388 margin-right: 30px;
473 border-right: 1px dotted #d9d9d9; 389 border-right: 1px dotted #d9d9d9;
474 padding: 0 24px; 390 padding: 0 24px;
391
475 .item { 392 .item {
476 height: 60px; 393 height: 60px;
477 line-height: 60px; 394 line-height: 60px;
478 border-bottom: 1px solid #e8e8e8; 395 border-bottom: 1px solid #e8e8e8;
479 font-size: 16px; 396 font-size: 16px;
480 color: #4a4a4a; 397 color: #4a4a4a;
398
481 .itemIcon { 399 .itemIcon {
482 float: right; 400 float: right;
483 line-height: 60px; 401 line-height: 60px;
...@@ -494,6 +412,7 @@ export default { ...@@ -494,6 +412,7 @@ export default {
494 0% { 412 0% {
495 transform: rotate(180deg); 413 transform: rotate(180deg);
496 } 414 }
415
497 100% { 416 100% {
498 transform: rotate(-0deg); 417 transform: rotate(-0deg);
499 } 418 }
...@@ -503,10 +422,12 @@ export default { ...@@ -503,10 +422,12 @@ export default {
503 animation: open 0.5s; 422 animation: open 0.5s;
504 animation-fill-mode: both; 423 animation-fill-mode: both;
505 } 424 }
425
506 .close { 426 .close {
507 animation: close 0.5s; 427 animation: close 0.5s;
508 animation-fill-mode: both; 428 animation-fill-mode: both;
509 } 429 }
430
510 .child { 431 .child {
511 height: 60px; 432 height: 60px;
512 line-height: 60px; 433 line-height: 60px;
...@@ -515,6 +436,7 @@ export default { ...@@ -515,6 +436,7 @@ export default {
515 color: #6b6b6b; 436 color: #6b6b6b;
516 cursor: pointer; 437 cursor: pointer;
517 } 438 }
439
518 .checked { 440 .checked {
519 border-radius: 6px; 441 border-radius: 6px;
520 border: 1px solid #4083f9; 442 border: 1px solid #4083f9;
...@@ -524,91 +446,10 @@ export default { ...@@ -524,91 +446,10 @@ export default {
524 446
525 .clyl-img { 447 .clyl-img {
526 width: 75%; 448 width: 75%;
527 height: 800px; 449 height: 100%;
528 background: #f3f4f7; 450 background: #f3f4f7;
529 margin: 0 auto; 451 margin: 0 auto;
530 position: relative; 452 position: relative;
531 .header {
532 height: 54px;
533 line-height: 52px;
534 background: #eceef2;
535 border: 1px solid #ededed;
536 padding: 0 0 0 30px;
537 .title {
538 font-size: 13px;
539 display: inline-block;
540 }
541 .i-group {
542 float: right;
543 height: 100%;
544 i {
545 width: 50px;
546 height: 52px;
547 cursor: pointer;
548 }
549 }
550 }
551 .prev,
552 .next {
553 width: 60px;
554 height: 60px;
555 line-height: 60px;
556 text-align: center;
557 font-size: 40px;
558 border-radius: 6px;
559 cursor: pointer;
560 position: absolute;
561 }
562 .prev:hover,
563 .next:hover{
564 background: #7a7a7a;
565 }
566
567 .prev {
568 top: 40%;
569 left: 10px;
570 }
571 .next {
572 top: 40%;
573 right: 10px;
574 }
575 .img-box {
576 width: 800px;
577 height: calc(100% - 214px);
578 padding: 5px;
579 text-align: center;
580 margin: 0 auto;
581 img {
582 max-height: 100%;
583 max-width: 100%;
584 }
585 }
586 .img-list {
587 width: 100%;
588 height: 80px;
589 line-height: 80px;
590 background: #eceef2;
591 text-align: center;
592 .item {
593 display: inline-block;
594 margin: 10px 5px;
595 img {
596 width: 60px;
597 height: 60px;
598 cursor: pointer;
599 }
600 .active {
601 border: 1px solid #fff;
602 }
603 }
604 }
605 .btn-group {
606 width: 100%;
607 height: 80px;
608 line-height: 80px;
609 background: #fff;
610 text-align: center;
611 }
612 } 453 }
613 } 454 }
614 } 455 }
......
1 <template> 1 <template>
2 <div class="slxx"> 2 <div class="slxx">
3 <el-form 3 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" :label-position="flagTop" :inline="flag"
4 :model="ruleForm" 4 label-width="140px">
5 :rules="rules" 5 <div class="slxx_con">
6 ref="ruleForm" 6 <div class="slxx_title">受理信息</div>
7 :label-position="flagTop" 7 <el-row :gutter="10">
8 :inline="flag" 8 <el-col :span="8">
9 label-width="140px" 9 <el-form-item label="业务号：" prop="ywh">
10 > 10 <el-input disabled v-model="ruleForm.ywh" class="width300px"></el-input>
11 <div class="slxx_title">受理信息</div> 11 </el-form-item>
12 <el-row :gutter="10"> 12 </el-col>
13 <el-col :span="8"> 13 <el-col :span="8">
14 <el-form-item label="业务号：" prop="ywh"> 14 <el-form-item label="受理人员：" prop="slry">
15 <el-input 15 <el-input disabled v-model="ruleForm.slry" class="width300px"></el-input>
16 disabled 16 </el-form-item>
17 v-model="ruleForm.ywh" 17 </el-col>
18 class="width300px" 18 <el-col :span="8">
19 ></el-input> 19 <el-form-item label="受理时间：" prop="slsj">
20 </el-form-item> 20 <el-input disabled v-model="ruleForm.slsj" class="width300px"></el-input>
21 </el-col> 21 </el-form-item>
22 <el-col :span="8"> 22 </el-col>
23 <el-form-item label="受理人员：" prop="slry"> 23 </el-row>
24 <el-input 24 <el-row :gutter="10">
25 disabled 25 <el-col :span="8">
26 v-model="ruleForm.slry" 26 <el-form-item label="权利类型：" prop="qllx">
27 class="width300px" 27 <el-select disabled v-model="ruleForm.qllx" class="width300px" filterable clearable placeholder="请选择权利类型">
28 ></el-input> 28 <el-option v-for="item in dictData['A8']" :key="item.dcode" :label="item.dname" :value="item.dcode">
29 </el-form-item> 29 </el-option>
30 </el-col> 30 </el-select>
31 <el-col :span="8"> 31 </el-form-item>
32 <el-form-item label="受理时间：" prop="slsj"> 32 </el-col>
33 <el-input 33 <el-col :span="8">
34 disabled 34 <el-form-item label="登记类型：" prop="djlx">
35 v-model="ruleForm.slsj" 35 <el-select disabled v-model="ruleForm.djlx" class="width300px" filterable clearable placeholder="请选择登记类型">
36 class="width300px" 36 <el-option v-for="item in dictData['A21']" :key="item.dcode" :label="item.dname" :value="item.dcode">
37 ></el-input> 37 </el-option>
38 </el-form-item> 38 </el-select>
39 </el-col> 39 </el-form-item>
40 </el-row> 40 </el-col>
41 <el-row :gutter="10"> 41 <el-col :span="8">
42 <el-col :span="8"> 42 <el-form-item label="登记情形：" prop="djqx">
43 <el-form-item label="权利类型：" prop="qllx"> 43 <el-input disabled class="width300px" v-model="ruleForm.djqxmc"></el-input>
44 <el-select 44 </el-form-item>
45 disabled 45 </el-col>
46 v-model="ruleForm.qllx" 46 </el-row>
47 class="width300px" 47 <div class="slxx_title">不动产单元情况</div>
48 filterable 48 <el-row :gutter="10">
49 clearable 49 <el-col :span="8">
50 placeholder="请选择权利类型" 50 <el-form-item label="宗地代码：" prop="zddm">
51 > 51 <el-input disabled v-model="ruleForm.zddm" class="width300px"></el-input>
52 <el-option 52 </el-form-item>
53 v-for="item in dictData['A8']" 53 </el-col>
54 :key="item.dcode" 54 <el-col :span="8">
55 :label="item.dname" 55 <el-form-item label="不动产单元号：" prop="bdcdyh">
56 :value="item.dcode" 56 <el-input disabled v-model="ruleForm.bdcdyh" class="width300px"></el-input>
57 > 57 </el-form-item>
58 </el-option> 58 </el-col>
59 </el-select> 59 <el-col :span="8">
60 </el-form-item> 60 <el-form-item label="权利性质：" prop="qlxzmc">
61 </el-col> 61 <el-input disabled v-model="ruleForm.qlxzmc" class="width300px"></el-input>
62 <el-col :span="8"> 62 </el-form-item>
63 <el-form-item label="登记类型：" prop="djlx"> 63 </el-col>
64 <el-select 64 </el-row>
65 disabled 65 <el-row :gutter="10">
66 v-model="ruleForm.djlx" 66 <el-col :span="8">
67 class="width300px" 67 <el-form-item label="宗地面积：" prop="zdmj">
68 filterable 68 <el-input disabled v-model="ruleForm.zdmj" class="width300px"></el-input>
69 clearable 69 </el-form-item>
70 placeholder="请选择登记类型" 70 </el-col>
71 > 71 <el-col :span="8">
72 <el-option 72 <el-form-item label="土地用途：" prop="tdyt">
73 v-for="item in dictData['A21']" 73 <el-input disabled v-model="ruleForm.tdyt" class="width300px"></el-input>
74 :key="item.dcode" 74 </el-form-item>
75 :label="item.dname" 75 </el-col>
76 :value="item.dcode" 76 <el-col :span="8">
77 > 77 <el-form-item label="权利设定方式：" prop="qlsdfs">
78 </el-option> 78 <el-select disabled v-model="ruleForm.qlsdfs" filterable class="width300px" clearable
79 </el-select> 79 placeholder="请选择权利设定方式">
80 </el-form-item> 80 <el-option v-for="item in qlsdfsOption" :key="item.value" :label="item.label" :value="item.value">
81 </el-col> 81 </el-option>
82 <el-col :span="8"> 82 </el-select>
83 <el-form-item label="登记情形：" prop="djqx"> 83 </el-form-item>
84 <el-input 84 </el-col>
85 disabled 85 </el-row>
86 class="width300px" 86 <el-row :gutter="10">
87 v-model="ruleForm.djqxmc" 87 <el-col :span="8">
88 ></el-input> 88 <el-form-item label="取得价格：" prop="qdjg">
89 </el-form-item> 89 <el-input disabled v-model="ruleForm.qdjg" class="width300px"></el-input>
90 </el-col> 90 </el-form-item>
91 </el-row> 91 </el-col>
92 <div class="slxx_title">不动产单元情况</div>
93 <el-row :gutter="10">
94 <el-col :span="8">
95 <el-form-item label="宗地代码：" prop="zddm">
96 <el-input
97 disabled
98 v-model="ruleForm.zddm"
99 class="width300px"
100 ></el-input>
101 </el-form-item>
102 </el-col>
103 <el-col :span="8">
104 <el-form-item label="不动产单元号：" prop="bdcdyh">
105 <el-input
106 disabled
107 v-model="ruleForm.bdcdyh"
108 class="width300px"
109 ></el-input>
110 </el-form-item>
111 </el-col>
112 <el-col :span="8">
113 <el-form-item label="权利性质：" prop="qlxzmc">
114 <el-input
115 disabled
116 v-model="ruleForm.qlxzmc"
117 class="width300px"
118 ></el-input>
119 </el-form-item>
120 </el-col>
121 </el-row>
122 <el-row :gutter="10">
123 <el-col :span="8">
124 <el-form-item label="宗地面积：" prop="zdmj">
125 <el-input
126 disabled
127 v-model="ruleForm.zdmj"
128 class="width300px"
129 ></el-input>
130 </el-form-item>
131 </el-col>
132 <el-col :span="8">
133 <el-form-item label="土地用途：" prop="tdyt">
134 <el-input
135 disabled
136 v-model="ruleForm.tdyt"
137 class="width300px"
138 ></el-input>
139 </el-form-item>
140 </el-col>
141 <el-col :span="8">
142 <el-form-item label="权利设定方式：" prop="qlsdfs">
143 <el-select
144 disabled
145 v-model="ruleForm.qlsdfs"
146 filterable
147 class="width300px"
148 clearable
149 placeholder="请选择权利设定方式"
150 >
151 <el-option
152 v-for="item in qlsdfsOption"
153 :key="item.value"
154 :label="item.label"
155 :value="item.value"
156 >
157 </el-option>
158 </el-select>
159 </el-form-item>
160 </el-col>
161 </el-row>
162 <el-row :gutter="10">
163 <el-col :span="8">
164 <el-form-item label="取得价格：" prop="qdjg">
165 <el-input
166 disabled
167 v-model="ruleForm.qdjg"
168 class="width300px"
169 ></el-input>
170 </el-form-item>
171 </el-col>
172 92
173 <el-col :span="16"> 93 <el-col :span="16">
174 <el-form-item label="坐落：" prop="zl"> 94 <el-form-item label="坐落：" prop="zl">
175 <el-input 95 <el-input disabled class="width300px" v-model="ruleForm.zl"></el-input>
176 disabled 96 </el-form-item>
177 class="width300px" 97 </el-col>
178 v-model="ruleForm.zl" 98 </el-row>
179 ></el-input> 99 <el-row :gutter="10">
180 </el-form-item> 100 <el-col :span="8">
181 </el-col> 101 <el-form-item label="使用期限：" prop="tdsyqx">
182 </el-row> 102 <el-input disabled v-model="ruleForm.tdsyqx" class="width300px"></el-input>
183 <el-row :gutter="10"> 103 </el-form-item>
184 <el-col :span="8"> 104 </el-col>
185 <el-form-item label="使用期限：" prop="tdsyqx">
186 <el-input
187 disabled
188 v-model="ruleForm.tdsyqx"
189 class="width300px"
190 ></el-input>
191 </el-form-item>
192 </el-col>
193 105
194 <el-col :span="16"> 106 <el-col :span="16">
195 <el-form-item label="使用权起止时间：" prop="qssj"> 107 <el-form-item label="使用权起止时间：" prop="qssj">
196 <el-input 108 <el-input disabled v-model="ruleForm.syqqzsj" class="width300px"></el-input>
197 disabled 109 </el-form-item>
198 v-model="ruleForm.syqqzsj" 110 </el-col>
199 class="width300px" 111 </el-row>
200 ></el-input> 112 <el-row :gutter="10">
201 </el-form-item> 113 <el-col>
202 </el-col> 114 <el-form-item label="附记：" prop="fj">
203 </el-row> 115 <el-input type="textarea" v-model="ruleForm.fj"></el-input>
204 <el-row :gutter="10"> 116 </el-form-item>
205 <el-col> 117 </el-col>
206 <el-form-item label="附记：" prop="fj"> 118 </el-row>
207 <el-input type="textarea" v-model="ruleForm.fj"></el-input> 119 <div class="slxx_title">权利人信息</div>
208 </el-form-item> 120 <el-row :gutter="10">
209 </el-col> 121 <el-col>
210 </el-row> 122 <el-form-item label="共有方式：">
211 <div class="slxx_title">权利人信息</div> 123 <el-radio-group disabled v-model="ruleForm.gyfs">
212 <el-row :gutter="10"> 124 <el-radio label="单独所有"></el-radio>
213 <el-col> 125 <el-radio label="共同共有"></el-radio>
214 <el-form-item label="共有方式："> 126 <el-radio label="按份所有"></el-radio>
215 <el-radio-group disabled v-model="ruleForm.gyfs"> 127 </el-radio-group>
216 <el-radio label="单独所有"></el-radio> 128 </el-form-item>
217 <el-radio label="共同共有"></el-radio> 129 </el-col>
218 <el-radio label="按份所有"></el-radio> 130 <el-col>
219 </el-radio-group> 131 <InformationTable :tableData="ruleForm.qlrxx" />
220 </el-form-item> 132 </el-col>
221 </el-col> 133 </el-row>
222 <el-col> 134 <div class="slxx_title">登记原因</div>
223 <InformationTable /> 135 <el-row :gutter="10">
224 </el-col> 136 <el-col>
225 </el-row> 137 <el-form-item label="登记原因：" prop="djyy">
226 <div class="slxx_title">登记原因</div> 138 <el-input class="textArea" type="textarea" v-model="ruleForm.djyy"></el-input>
227 <el-row :gutter="10"> 139 </el-form-item>
228 <el-col> 140 </el-col>
229 <el-form-item label="登记原因：" prop="djyy"> 141 </el-row>
230 <el-input 142 </div>
231 class="textArea"
232 type="textarea"
233 v-model="ruleForm.djyy"
234 ></el-input>
235 </el-form-item>
236 </el-col>
237 </el-row>
238 <el-row> 143 <el-row>
239 <el-col> 144 <el-form-item class="btn">
240 <el-form-item class="btn"> 145 <el-button type="primary" @click="onSubmit">保存</el-button>
241 <el-button type="primary" @click="onSubmit">保存</el-button> 146 </el-form-item>
242 </el-form-item>
243 </el-col>
244 </el-row> 147 </el-row>
245 </el-form> 148 </el-form>
246 </div> 149 </div>
...@@ -250,7 +153,6 @@ import InformationTable from "./InformationTable"; ...@@ -250,7 +153,6 @@ import InformationTable from "./InformationTable";
250 import { Init } from "@/api/fqsq.js"; 153 import { Init } from "@/api/fqsq.js";
251 import { mapGetters } from "vuex"; 154 import { mapGetters } from "vuex";
252 export default { 155 export default {
253 /**注册组件*/
254 components: { InformationTable }, 156 components: { InformationTable },
255 props: { 157 props: {
256 flag: { 158 flag: {
...@@ -261,7 +163,7 @@ export default { ...@@ -261,7 +163,7 @@ export default {
261 computed: { 163 computed: {
262 ...mapGetters(["dictData"]), 164 ...mapGetters(["dictData"]),
263 }, 165 },
264 data() { 166 data () {
265 return { 167 return {
266 disabled: true, 168 disabled: true,
267 flagTop: this.flag ? "top" : "", 169 flagTop: this.flag ? "top" : "",
...@@ -277,6 +179,7 @@ export default { ...@@ -277,6 +179,7 @@ export default {
277 zddm: "", 179 zddm: "",
278 bdcdyh: "", 180 bdcdyh: "",
279 qlxzmc: "", 181 qlxzmc: "",
182 qlrxx: [],
280 zdmj: "", 183 zdmj: "",
281 zl: "", 184 zl: "",
282 tdyt: "", 185 tdyt: "",
...@@ -289,35 +192,22 @@ export default { ...@@ -289,35 +192,22 @@ export default {
289 gyfs: "", 192 gyfs: "",
290 }, 193 },
291 rules: { 194 rules: {
292 // ywh: [ 195 }
293 // { required: true, message: '业务号', trigger: 'blur' } 196 }
294 // ],
295 },
296 };
297 }, 197 },
298 methods: { 198 methods: {
299 list(bsmSldy) { 199 list (bsmSldy) {
300 var formdata = new FormData(); 200 var formdata = new FormData();
301 //可以通过append()方法来追加数据 201 //可以通过append()方法来追加数据
302 formdata.append("bsmSldy", bsmSldy); 202 formdata.append("bsmSldy", bsmSldy);
303 Init(formdata).then((res) => { 203 Init(formdata).then((res) => {
304 if (res.code === 200) { 204 if (res.code === 200 && res.result) {
305 console.log(res, 1111); 205 this.ruleForm = { ...res.result, ...res.result.zdjbxxdatas, ...res.result.qlxxdatas, ...res.result.jsydsyqdatas }
306 this.ruleForm = res.result; 206 console.log(this.ruleForm, 'this.ruleForm');
307 this.ruleForm.zddm = res.result.zdjbxxdatas.zddm;
308 this.ruleForm.zdmj = res.result.zdjbxxdatas.zdmj;
309 this.ruleForm.zl = res.result.qlxxdatas.zl;
310 this.ruleForm.tdyt = res.result.qlxxdatas.ytmc;
311 this.ruleForm.qlsdfs = res.result.zdjbxxdatas.qlsdfsmc;
312 this.ruleForm.qdjg = res.result.jsydsyqdatas.qdjg;
313 this.ruleForm.fj = res.result.jsydsyqdatas.fj;
314 this.ruleForm.syqqzsj = res.result.jsydsyqdatas.syqqzsj;
315 this.ruleForm.tdsyqx = res.result.jsydsyqdatas.tdsyqx;
316 this.ruleForm.qlxzmc = res.result.zdjbxxdatas.qlxzmc;
317 } 207 }
318 }); 208 })
319 }, 209 },
320 onSubmit() {}, 210 onSubmit () { },
321 }, 211 },
322 }; 212 };
323 </script> 213 </script>
...@@ -325,23 +215,34 @@ export default { ...@@ -325,23 +215,34 @@ export default {
325 @import "~@/styles/public.scss"; 215 @import "~@/styles/public.scss";
326 216
327 .slxx { 217 .slxx {
328 padding-left: 15px; 218 box-sizing: border-box;
219 padding-right: 15px;
220 }
221
222 .slxx_con {
223 height: calc(100vh - 190px);
224 overflow-y: auto;
225 overflow-x: hidden;
226 }
227
228 .submit_btn {
229 height: 50px;
329 } 230 }
330 231
331 .slxx_title { 232 .slxx_title {
332 border-bottom: 1px solid $borderColor; 233 border-bottom: 1px solid $borderColor;
333 padding-left: 10px; 234 padding-left: 10px;
334 padding-bottom: 20px; 235 padding-bottom: 15px;
335 margin-bottom: 15px; 236 margin-bottom: 15px;
336 margin-top: 30px; 237 margin-top: 5px;
337 font-size: 18px; 238 font-size: 18px;
338 font-family: PingFangSC-Medium, PingFang SC;
339 font-weight: 500; 239 font-weight: 500;
340 color: #4a4a4a; 240 color: #4a4a4a;
341 } 241 }
342 242
343 .btn { 243 .btn {
344 text-align: center; 244 text-align: center;
245 padding-top: 5px;
345 } 246 }
346 247
347 .textArea { 248 .textArea {
...@@ -350,15 +251,6 @@ export default { ...@@ -350,15 +251,6 @@ export default {
350 } 251 }
351 } 252 }
352 253
353 // .Inputclass {
354 // width: 100%;
355 // }
356
357 // /deep/.el-select,
358 // /deep/.el-date-editor {
359 // width: 100%;
360 // }
361
362 /deep/.el-form-item__label { 254 /deep/.el-form-item__label {
363 padding-bottom: 0px; 255 padding-bottom: 0px;
364 } 256 }
......
...@@ -6,10 +6,10 @@ ...@@ -6,10 +6,10 @@
6 <div class="from-clues-header"> 6 <div class="from-clues-header">
7 <el-form :model="queryForm" ref="queryForm" label-width="120px"> 7 <el-form :model="queryForm" ref="queryForm" label-width="120px">
8 <el-form-item label="下一环节名称:"> 8 <el-form-item label="下一环节名称:">
9 代码审查 9 {{this.tableData.taskName}}
10 </el-form-item> 10 </el-form-item>
11 <el-form-item label="下一环节办理人:"> 11 <el-form-item label="下一环节办理人:">
12 赵小千 12 {{this.usernames}}
13 </el-form-item> 13 </el-form-item>
14 14
15 </el-form> 15 </el-form>
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
19 </template> 19 </template>
20 20
21 <script> 21 <script>
22 import { completeTask } from "@/api/fqsq.js" 22 import { completeTask ,getNextLinkInfo} from "@/api/fqsq.js"
23 export default { 23 export default {
24 components: { 24 components: {
25 }, 25 },
...@@ -29,9 +29,21 @@ export default { ...@@ -29,9 +29,21 @@ export default {
29 }, 29 },
30 data () { 30 data () {
31 return { 31 return {
32 tableData: {},
33 usernames: '',
32 } 34 }
33 }, 35 },
34 methods: { 36 methods: {
37 tablelistFn(){
38 getNextLinkInfo(this.queryForm).then(res => {
39 if (res.code === 200) {
40 this.tableData = res.result
41 if(res.result.usernames){
42 this.usernames = String(res.result.usernames)
43 }
44 }
45 })
46 },
35 submitForm () { 47 submitForm () {
36 completeTask(this.queryForm).then(res => { 48 completeTask(this.queryForm).then(res => {
37 console.log(res) 49 console.log(res)
......
...@@ -2,14 +2,13 @@ ...@@ -2,14 +2,13 @@
2 <div class='fqsq'> 2 <div class='fqsq'>
3 <div class="fqsq-header"> 3 <div class="fqsq-header">
4 <ul> 4 <ul>
5 <li @click="operation(index, item)" v-for="(item, index) in headerleftList.slice(0, headerleftList.length - 4)" 5 <li @click="operation(index, item)" v-for="(item, index) in headerleftList" :key="index">
6 :key="index">
7 <svg-icon :icon-class="item.icon" /> 6 <svg-icon :icon-class="item.icon" />
8 <span class="iconName">{{ item.name }}</span> 7 <span class="iconName">{{ item.name }}</span>
9 </li> 8 </li>
10 </ul> 9 </ul>
11 <ul> 10 <ul>
12 <li @click="operation(index, item)" v-for="(item, index) in headerleftList.slice(-4)" :key="index"> 11 <li @click="operation(index, item)" v-for="(item, index) in headerRightList" :key="index">
13 <svg-icon class="icon" :icon-class="item.icon" /> 12 <svg-icon class="icon" :icon-class="item.icon" />
14 <span class="iconName">{{ item.name }}</span> 13 <span class="iconName">{{ item.name }}</span>
15 </li> 14 </li>
...@@ -28,7 +27,10 @@ ...@@ -28,7 +27,10 @@
28 <ul v-if='this.isShowdrawer'> 27 <ul v-if='this.isShowdrawer'>
29 <p class="title">受理单元列表({{unitData.length}})</p> 28 <p class="title">受理单元列表({{unitData.length}})</p>
30 <div v-for='(item,index) in unitData' :key='index'> 29 <div v-for='(item,index) in unitData' :key='index'>
31 <li @click='unitClick(item)'><p>{{item.bdcdyh}}</p><p>{{item.zl}}</p></li> 30 <li @click='unitClick(item)'>
31 <p>{{item.bdcdyh}}</p>
32 <p>{{item.zl}}</p>
33 </li>
32 <div class="xian"></div> 34 <div class="xian"></div>
33 </div> 35 </div>
34 </ul> 36 </ul>
...@@ -39,23 +41,23 @@ ...@@ -39,23 +41,23 @@
39 <div class="splitScreen"></div> 41 <div class="splitScreen"></div>
40 </div> 42 </div>
41 <el-tabs v-model="activeName" @tab-click='activeClick'> 43 <el-tabs v-model="activeName" @tab-click='activeClick'>
42 <el-tab-pane :label="item.name" :name="index + 1 + ''" v-for="(item, index) in tabList" :key="index"> 44 <el-tab-pane :label="item.name" :name="item.value" v-for="(item, index) in tabList" :key="index">
43 <div class="splitScreen-con" v-if='index == 0'> 45 <div class="splitScreen-con">
44 <component ref='slxx' :is="editItem" :flag="flag" :key="key" /> 46 <component ref='slxx' v-if='index == 0' :is="editItem" :flag="flag" :key="key" />
47 <component ref='clxx' :is="editItem" v-else-if="index == 1" :key="key" />
48 <component :is="editItem" v-else :key="key" />
45 </div> 49 </div>
46 <component ref='clxx' :is="editItem" v-else-if="index == 1" :key="key" />
47 <component :is="editItem" v-else :key="key" />
48 </el-tab-pane> 50 </el-tab-pane>
49 </el-tabs> 51 </el-tabs>
50 </div> 52 </div>
51 </div> 53 </div>
52 <zc v-model="zcDialog" :queryForm='queryForm' /> 54 <zc ref="zcDialogRef" v-model="zcDialog" :queryForm='queryForm' />
53 <thDialog ref='thdialogRef' v-model="thflag" :taskId='taskId' :bsmBusiness='bsmBusiness' :queryForm='queryForm' /> 55 <thDialog ref='thdialogRef' v-model="thflag" :taskId='taskId' :bsmBusiness='bsmBusiness' :queryForm='queryForm' />
54 <zsylDialog v-model='zsylFlag' /> 56 <zsylDialog v-model='zsylFlag' />
55 </div> 57 </div>
56 </template> 58 </template>
57 <script> 59 <script>
58 import { leftMenu } from "@/api/fqsq.js" 60 import { leftMenu, stepExpandInfo } from "@/api/fqsq.js"
59 import zc from "./components/zc.vue" 61 import zc from "./components/zc.vue"
60 import thDialog from "./components/th.vue" 62 import thDialog from "./components/th.vue"
61 import zsylDialog from './components/zsyl' 63 import zsylDialog from './components/zsyl'
...@@ -64,106 +66,61 @@ export default { ...@@ -64,106 +66,61 @@ export default {
64 components: { zc, thDialog, zsylDialog }, 66 components: { zc, thDialog, zsylDialog },
65 data () { 67 data () {
66 return { 68 return {
67 zsylFlag:false, 69 zsylFlag: false,
68 zcDialog:false, 70 zcDialog: false,
69 thflag:false, 71 thflag: false,
70 queryForm:{ 72 queryForm: {
71 bsmSlsq:"", 73 bsmSlsq: "",
72 bestepid:"", 74 bestepid: "",
73 }, 75 },
74 isShowdrawer: true, 76 isShowdrawer: true,
75 key: 0, 77 key: 0,
76 flag: false, 78 flag: false,
77 headerleftList: [ 79 headerleftList: [],
78 { 80 headerRightList: [
79 name: '图形定位',
80 icon: 'fqsq1'
81 },
82 {
83 name: '登记簿',
84 icon: 'fqsq2'
85 },
86 {
87 name: '证书预览',
88 icon: 'fqsq3'
89 },
90 {
91 name: '流程图',
92 icon: 'fqsq4'
93 },
94 {
95 name: '材料分屏',
96 icon: 'fqsq5'
97 },
98 {
99 name: '材料导入',
100 icon: 'fqsq6'
101 },
102 {
103 name: '打印申请书',
104 icon: 'fqsq7'
105 },
106 { 81 {
107 name: '登簿', 82 name: '登簿',
108 icon: 'fqsq2' 83 icon: 'fqsq2',
84 value: 'db'
109 }, 85 },
110 { 86 {
111 name: '退回', 87 name: '退回',
112 icon: 'fqsq8' 88 icon: 'fqsq8',
89 value: 'th'
113 }, 90 },
114 { 91 {
115 name: '转出', 92 name: '转出',
116 icon: 'fqsq9' 93 icon: 'fqsq9',
94 value: 'zc'
117 }, 95 },
118 { 96 {
119 name: '退出', 97 name: '退出',
120 icon: '' 98 icon: 'del',
99 value: 'tc'
121 } 100 }
122 ], 101 ],
123 activeName: '1', 102 activeName: 'slxx',
124 tabList1: [ 103 tabList1: [],
125 {
126 name: '受理申请',
127 },
128 {
129 name: '材料信息',
130 },
131 {
132 name: '审批意见',
133 },
134 {
135 name: '宗地基本信息',
136 },
137 {
138 name: '权利信息',
139 },
140 ],
141 tabList: [], 104 tabList: [],
142 editItem: '', 105 editItem: '',
143 issplitScreen: false, 106 issplitScreen: false,
144 unitData: [], 107 unitData: [],
145 taskId:"", 108 taskId: "",
146 bsmBusiness:"", 109 bsmBusiness: "",
147 id:"", 110 id: "",
148 }; 111 };
149 }, 112 },
150 watch: { 113 watch: {
151 activeName: { 114 activeName: {
152 handler (newName, oldName) { 115 handler (newName, oldName) {
153 console.log(newName, 'newName'); 116 this.editItem = this.loadView(newName)
154 let itemObj = { '1': 'slxx', '2': 'clxx', '3': 'spyj' }
155 this.editItem = this.loadView(itemObj[newName])
156 }, 117 },
157 immediate: true 118 immediate: true
158 } 119 }
159 }, 120 },
160 created () {
161
162 this.tabList = [...this.tabList1]
163
164 },
165 mounted () { 121 mounted () {
166 if (this.$route.query.bsmSlsq) { 122 if (this.$route.query.bsmSlsq) {
123 this.expandInfo(this.$route.query.bsmSlsq,this.$route.query.bestepid);
167 this.list(this.$route.query.bsmSlsq) 124 this.list(this.$route.query.bsmSlsq)
168 this.queryForm.bsmSlsq = this.$route.query.bsmSlsq 125 this.queryForm.bsmSlsq = this.$route.query.bsmSlsq
169 this.queryForm.bestepid = this.$route.query.bestepid 126 this.queryForm.bestepid = this.$route.query.bestepid
...@@ -187,8 +144,22 @@ export default { ...@@ -187,8 +144,22 @@ export default {
187 } 144 }
188 }) 145 })
189 }, 146 },
190 activeClick(tab,event){ 147 //获取环节扩展信息
191 if(tab.name=='1'){ 148 expandInfo (bsmSlsq,bestepid) {
149 let that = this
150 var formdata = new FormData();
151 formdata.append("bsmSlsq", bsmSlsq);
152 formdata.append("bestepid", bestepid);
153 stepExpandInfo(formdata).then(res => {
154 if (res.code === 200) {
155 this.tabList1 = [...res.result.form]
156 this.tabList = res.result.form;
157 this.headerleftList = res.result.button
158 }
159 })
160 },
161 activeClick (tab, event) {
162 if (tab.name == 'slxx') {
192 this.list(this.id) 163 this.list(this.id)
193 } 164 }
194 }, 165 },
...@@ -201,10 +172,10 @@ export default { ...@@ -201,10 +172,10 @@ export default {
201 }) 172 })
202 }, 173 },
203 operation (index, item) { 174 operation (index, item) {
204 if(item.icon == 'fqsq3'){ 175 if (item.value == 'zsyl') {
205 this.zsylFlag = true 176 this.zsylFlag = true
206 177
207 } else if (item.icon == 'fqsq5') { 178 } else if (item.value == 'clfp') {
208 this.key++ 179 this.key++
209 this.issplitScreen = !this.issplitScreen 180 this.issplitScreen = !this.issplitScreen
210 this.flag = !this.flag 181 this.flag = !this.flag
...@@ -213,18 +184,18 @@ export default { ...@@ -213,18 +184,18 @@ export default {
213 } else { 184 } else {
214 this.tabList = [...this.tabList1] 185 this.tabList = [...this.tabList1]
215 } 186 }
216 } else if (item.icon == 'fqsq8') { 187 } else if (item.value == 'th') {
217 this.thflag = true 188 this.thflag = true
218 this.$nextTick(() => { 189 this.$nextTick(() => {
219 this.$refs.thdialogRef.tablelistFn() 190 this.$refs.thdialogRef.tablelistFn()
220 }) 191 })
221 } 192 }
222 else if (item.icon == 'fqsq9') { 193 else if (item.value == 'zc') {
223 this.zcDialog = true 194 this.zcDialog = true
195 this.$refs.zcDialogRef.tablelistFn()
196 } else if (item.value === 'tc') {
197 window.close()
224 } 198 }
225 // if (index == 3) {
226 // window.close()
227 // }
228 }, 199 },
229 loadView (view) { 200 loadView (view) {
230 return r => require.ensure([], () => r(require(`./components/${view}.vue`))) 201 return r => require.ensure([], () => r(require(`./components/${view}.vue`)))
...@@ -253,6 +224,15 @@ export default { ...@@ -253,6 +224,15 @@ export default {
253 font-size: 12px; 224 font-size: 12px;
254 } 225 }
255 226
227 /deep/.el-tabs__content {
228 height: calc(100vh - 135px) !important;
229 }
230
231 .splitScreen-con {
232 padding: 0 15px;
233 box-sizing: border-box;
234 }
235
256 .fqsq { 236 .fqsq {
257 width: 100%; 237 width: 100%;
258 height: 100%; 238 height: 100%;
...@@ -343,6 +323,8 @@ export default { ...@@ -343,6 +323,8 @@ export default {
343 .tabsList-left { 323 .tabsList-left {
344 border-right: 1px solid #EBEEF5; 324 border-right: 1px solid #EBEEF5;
345 position: relative; 325 position: relative;
326 width: 250px;
327 box-sizing: border-box;
346 328
347 ul { 329 ul {
348 position: relative; 330 position: relative;
...@@ -392,8 +374,6 @@ export default { ...@@ -392,8 +374,6 @@ export default {
392 374
393 /deep/.el-tabs { 375 /deep/.el-tabs {
394 width: 100%; 376 width: 100%;
395 height: 90vh;
396 overflow-y: scroll;
397 } 377 }
398 } 378 }
399 </style> 379 </style>
...\ No newline at end of file ...\ No newline at end of file
......