Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcdj-web
Showing
7 changed files
with
330 additions
and
194 deletions
| ... | @@ -114,3 +114,11 @@ export function saveSpyj (data) { | ... | @@ -114,3 +114,11 @@ export function saveSpyj (data) { |
| 114 | data | 114 | data |
| 115 | }) | 115 | }) |
| 116 | } | 116 | } |
| 117 | // 登簿接口 | ||
| 118 | export function record (data) { | ||
| 119 | return request({ | ||
| 120 | url: '/business/workFlow/record', | ||
| 121 | method: 'post', | ||
| 122 | data | ||
| 123 | }) | ||
| 124 | } | ... | ... |
src/views/components/comMsg.vue
0 → 100644
| 1 | <template> | ||
| 2 | <div class="model"> | ||
| 3 | <div class="mask">123</div> | ||
| 4 | <div class="model-dialog"> | ||
| 5 | <div class="model-header"> | ||
| 6 | <span>提示</span> | ||
| 7 | <a href="javascript:;" class="icon-close"></a> | ||
| 8 | </div> | ||
| 9 | <div class="model-body"> | ||
| 10 | <div class="body">这是条消息</div> | ||
| 11 | </div> | ||
| 12 | <div class="model-footer"> | ||
| 13 | <button class="btn">确认</button> | ||
| 14 | </div> | ||
| 15 | </div> | ||
| 16 | </div> | ||
| 17 | </template> | ||
| 18 | |||
| 19 | |||
| 20 | <style scoped lang='scss'> | ||
| 21 | //css部分 | ||
| 22 | .mask { | ||
| 23 | position: fixed; //这里用固定定位,后面设置动画时才不受影响 | ||
| 24 | top: 0; | ||
| 25 | height: 100%; | ||
| 26 | width: 100%; | ||
| 27 | background-color: rgba(167, 165, 165, 0.486); | ||
| 28 | opacity: 0.5; | ||
| 29 | z-index: 9; | ||
| 30 | } | ||
| 31 | .model-dialog { | ||
| 32 | position: absolute; | ||
| 33 | //让弹框居中显示 | ||
| 34 | top: 50%; | ||
| 35 | left: 50%; | ||
| 36 | transform: translate(-50%, -50%); | ||
| 37 | background-color: #fff; | ||
| 38 | border-radius: 12px; | ||
| 39 | width: 600px; | ||
| 40 | height: 300px; | ||
| 41 | border: 1px solid #f5f5f5; | ||
| 42 | overflow: hidden; | ||
| 43 | z-index: 10; //这里注意层级要比mask大,覆盖它 | ||
| 44 | } | ||
| 45 | .model-header { | ||
| 46 | position: relative; | ||
| 47 | height: 50px; | ||
| 48 | padding-left: 10px; | ||
| 49 | padding-top: 10px; | ||
| 50 | font-size: 20px; | ||
| 51 | line-height: 50px; | ||
| 52 | background-color: #f5f5f5; | ||
| 53 | border-bottom: 1px solid rgb(177, 176, 176); | ||
| 54 | } | ||
| 55 | .model-body { | ||
| 56 | height: 150px; | ||
| 57 | line-height: 150px; | ||
| 58 | font-size: 28px; | ||
| 59 | text-align: center; | ||
| 60 | background-color: #fff; | ||
| 61 | } | ||
| 62 | .model-footer { | ||
| 63 | background-color: #f5f5f5; | ||
| 64 | height: 100px; | ||
| 65 | text-align: center; | ||
| 66 | line-height: 100px; | ||
| 67 | } | ||
| 68 | .btn { | ||
| 69 | width: 180px; | ||
| 70 | height: 40px; | ||
| 71 | border-radius: 8px; | ||
| 72 | background-color: rgb(180, 103, 103); | ||
| 73 | color: #fff; | ||
| 74 | font-size: 18px; | ||
| 75 | border: none; | ||
| 76 | } | ||
| 77 | .icon-close { | ||
| 78 | position: absolute; //如果不加绝对布局,图表显示不出来 | ||
| 79 | background-color: pink; | ||
| 80 | right: 15px; | ||
| 81 | top: 16px; | ||
| 82 | width: 30px; | ||
| 83 | height: 30px; | ||
| 84 | z-index: 10; | ||
| 85 | //background: url("../assets/icon-close.png") no-repeat; | ||
| 86 | background-size: contain; | ||
| 87 | } | ||
| 88 | </style> | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| 1 | import filter from '@/utils/filter.js' | 1 | import filter from '@/utils/filter.js' |
| 2 | |||
| 2 | class data extends filter { | 3 | class data extends filter { |
| 3 | constructor() { | 4 | constructor() { |
| 4 | super() | 5 | super() |
| 5 | } | 6 | } |
| 6 | columns () { | 7 | columns () { |
| 7 | return { | 8 | return [ |
| 8 | title: "建设用地使用权、宅基地使用权登记信息", | ||
| 9 | columns: [ | ||
| 10 | { | 9 | { |
| 11 | prop: "ssywh", | 10 | prop: "ssywh", |
| 12 | label: "上手业务号" | 11 | label: "上手业务号", |
| 12 | width: "120" | ||
| 13 | }, | 13 | }, |
| 14 | { | 14 | { |
| 15 | prop: "dah", | 15 | prop: "dah", |
| ... | @@ -92,8 +92,6 @@ class data extends filter { | ... | @@ -92,8 +92,6 @@ class data extends filter { |
| 92 | label: "附记", | 92 | label: "附记", |
| 93 | }, | 93 | }, |
| 94 | ] | 94 | ] |
| 95 | |||
| 96 | } | ||
| 97 | } | 95 | } |
| 98 | } | 96 | } |
| 99 | 97 | ... | ... |
| ... | @@ -12,14 +12,14 @@ | ... | @@ -12,14 +12,14 @@ |
| 12 | </div> | 12 | </div> |
| 13 | </div> | 13 | </div> |
| 14 | <div class="xxTableBox"> | 14 | <div class="xxTableBox"> |
| 15 | <table class="xxTable" :width="tableWidth"> | 15 | <table class="xxTable"> |
| 16 | <tr> | 16 | <tr> |
| 17 | <th rowspan="3">业务类型</th> | 17 | <th rowspan="3">业务类型</th> |
| 18 | </tr> | 18 | </tr> |
| 19 | <!-- 第一行表头 --> | 19 | <!-- 第一行表头 --> |
| 20 | <tr class="one" id=""> | 20 | <tr class="one"> |
| 21 | <th v-for="(item, index) in ths" :key="index" :class="[item.class, item.type == '临时' ? 'linshiIcon' : '']"> | 21 | <th v-for="(item, index) in ths" :key="index" :class="[item.class, item.type == '临时' ? 'linshiIcon' : '']"> |
| 22 | <div class="icon" v-if="item.type == '临时'">{{ item.type }}</div> | 22 | <div class="icon" v-if="item.type == '临时'">正在办理</div> |
| 23 | {{ item.type }} | 23 | {{ item.type }} |
| 24 | </th> | 24 | </th> |
| 25 | </tr> | 25 | </tr> |
| ... | @@ -49,55 +49,65 @@ | ... | @@ -49,55 +49,65 @@ |
| 49 | </template> | 49 | </template> |
| 50 | 50 | ||
| 51 | <script> | 51 | <script> |
| 52 | import { mapGetters } from "vuex"; | ||
| 53 | import { datas } from "./jsydsyq"; | 52 | import { datas } from "./jsydsyq"; |
| 54 | import { getJsydsyqList } from "@/api/zhcx.js"; | 53 | import { getJsydsyqList } from "@/api/zhcx.js"; |
| 55 | export default { | 54 | export default { |
| 56 | name: "djxxTable", | 55 | name: "jsydsyq", |
| 57 | props: { | ||
| 58 | showType: "", | ||
| 59 | }, | ||
| 60 | data () { | 56 | data () { |
| 61 | return { | 57 | return { |
| 62 | checkList: ["临时", "现势", "历史"], | 58 | checkList: ["临时", "现势", "历史"], |
| 63 | tableWidth: 810, | ||
| 64 | type: datas.columns(), | ||
| 65 | tableData: [], | 59 | tableData: [], |
| 66 | showTableData: [], | 60 | showTableData: [], |
| 67 | ths: [], | 61 | ths: [], |
| 68 | showThs: [], | ||
| 69 | columns: [], | 62 | columns: [], |
| 70 | title: "", | 63 | title: "建设用地使用权、宅基地使用权登记信息", |
| 64 | emptyData: { | ||
| 65 | ssywh: '', | ||
| 66 | dah: '', | ||
| 67 | ywh: '', | ||
| 68 | bdcdyh: "", | ||
| 69 | zl: "", | ||
| 70 | qlrlx: '', | ||
| 71 | qlrmc: "", | ||
| 72 | qlrzjzl: "", | ||
| 73 | qlrzjhm: "", | ||
| 74 | gyfs: "", | ||
| 75 | mj: null, | ||
| 76 | qlxz: '', | ||
| 77 | ytmc: "", | ||
| 78 | syqqzsj: null, | ||
| 79 | tdsyqx: null, | ||
| 80 | qdjg: null, | ||
| 81 | djyy: '', | ||
| 82 | bdcqzh: null, | ||
| 83 | djsj: '', | ||
| 84 | dbr: '', | ||
| 85 | fj: "", | ||
| 86 | qllxmc: "", | ||
| 87 | djlxmc: '', | ||
| 88 | qszt: "", | ||
| 89 | } | ||
| 71 | }; | 90 | }; |
| 72 | }, | 91 | }, |
| 73 | computed: { | 92 | async created () { |
| 74 | ...mapGetters(["djbxx"]), | ||
| 75 | }, | ||
| 76 | watch: { | ||
| 77 | showType: { | ||
| 78 | handler (newVlue) { | ||
| 79 | // 清空值 | 93 | // 清空值 |
| 80 | this.tableData = []; | 94 | this.tableData = []; |
| 81 | this.ths = []; | 95 | this.ths = []; |
| 82 | this.columns = this.type[newVlue].columns; | 96 | this.columns = datas.columns(); |
| 83 | this.title = this.type[newVlue].title; | 97 | let res = await getJsydsyqList({ |
| 84 | this.checkList = ["临时", "现势", "历史"]; | ||
| 85 | this.tableWidth = 810; | ||
| 86 | let detail; | ||
| 87 | if (newVlue === "JSYDSYQ") { | ||
| 88 | getJsydsyqList({ | ||
| 89 | bdcdyid: "2b33851f4edfd468ceef4d68c370bd41", | 98 | bdcdyid: "2b33851f4edfd468ceef4d68c370bd41", |
| 90 | qllx: "A03", | 99 | qllx: "A03", |
| 91 | qszt: ["1"] | 100 | qszt: ["1"] |
| 92 | }).then((res) => { | 101 | }) |
| 93 | if (res.code === 200) { | 102 | let resList = res.result.result ? res.result.result : [] |
| 94 | detail = res.result; | 103 | if (resList.length < 3) { |
| 104 | let num = 3 - resList.length | ||
| 105 | for (let i = 0; i < num; i++) { | ||
| 106 | resList.push(this.emptyData) | ||
| 95 | } | 107 | } |
| 96 | }); | ||
| 97 | } else { | ||
| 98 | detail = this.djbxx.detail.qlxxs[newVlue]; | ||
| 99 | } | 108 | } |
| 100 | detail.forEach((item) => { | 109 | let detail = resList |
| 110 | detail.length > 0 && detail.forEach((item) => { | ||
| 101 | this.tableData.push(item); | 111 | this.tableData.push(item); |
| 102 | if (item.qszt == "0") { | 112 | if (item.qszt == "0") { |
| 103 | this.ths.push({ | 113 | this.ths.push({ |
| ... | @@ -126,61 +136,9 @@ export default { | ... | @@ -126,61 +136,9 @@ export default { |
| 126 | } | 136 | } |
| 127 | }); | 137 | }); |
| 128 | this.showTableData = this.tableData; | 138 | this.showTableData = this.tableData; |
| 129 | this.showThs = this.ths; | ||
| 130 | let width = (this.tableData.length - 3) * 223 + this.tableWidth; | ||
| 131 | this.tableWidth = this.tableData.length > 3 ? width : 810; | ||
| 132 | }, | ||
| 133 | immediate: true, | ||
| 134 | }, | ||
| 135 | }, | 139 | }, |
| 136 | methods: { | 140 | methods: { |
| 137 | checkChange () { | 141 | checkChange () { |
| 138 | var checkKey = []; | ||
| 139 | this.ths = []; | ||
| 140 | this.tableWidth = 810; | ||
| 141 | this.checkList.forEach((item) => { | ||
| 142 | if (item == "临时") { | ||
| 143 | checkKey.push("0"); | ||
| 144 | } | ||
| 145 | if (item == "现势") { | ||
| 146 | checkKey.push("1"); | ||
| 147 | } | ||
| 148 | if (item == "历史") { | ||
| 149 | checkKey.push("2"); | ||
| 150 | } | ||
| 151 | }); | ||
| 152 | this.showTableData = this.tableData.filter((item) => | ||
| 153 | checkKey.includes(item.qszt) | ||
| 154 | ); | ||
| 155 | this.showTableData.forEach((item) => { | ||
| 156 | if (item.qszt == "0") { | ||
| 157 | this.ths.push({ | ||
| 158 | type: "临时", | ||
| 159 | qllxmc: item.qllxmc, | ||
| 160 | djlxmc: item.djlxmc, | ||
| 161 | prop: "linshi", | ||
| 162 | class: "linshi", | ||
| 163 | }); | ||
| 164 | } else if (item.qszt == "1") { | ||
| 165 | this.ths.push({ | ||
| 166 | type: "现势", | ||
| 167 | qllxmc: item.qllxmc, | ||
| 168 | djlxmc: item.djlxmc, | ||
| 169 | prop: "xianshi", | ||
| 170 | class: "xianshi", | ||
| 171 | }); | ||
| 172 | } else if (item.qszt == "2") { | ||
| 173 | this.ths.push({ | ||
| 174 | type: "历史", | ||
| 175 | qllxmc: item.qllxmc, | ||
| 176 | djlxmc: item.djlxmc, | ||
| 177 | prop: "lishi", | ||
| 178 | class: "lishi", | ||
| 179 | }); | ||
| 180 | } | ||
| 181 | }); | ||
| 182 | let width = (this.showTableData.length - 3) * 223 + this.tableWidth; | ||
| 183 | this.tableWidth = this.showTableData.length > 3 ? width : 810; | ||
| 184 | }, | 142 | }, |
| 185 | }, | 143 | }, |
| 186 | }; | 144 | }; |
| ... | @@ -195,14 +153,12 @@ export default { | ... | @@ -195,14 +153,12 @@ export default { |
| 195 | color: #333; | 153 | color: #333; |
| 196 | 154 | ||
| 197 | .tableBox { | 155 | .tableBox { |
| 198 | width: 810px; | ||
| 199 | margin: 0 auto; | 156 | margin: 0 auto; |
| 200 | display: flex; | 157 | display: flex; |
| 201 | flex-wrap: wrap; | 158 | flex-wrap: wrap; |
| 202 | 159 | ||
| 203 | .title { | 160 | .title { |
| 204 | width: 100%; | 161 | width: 100%; |
| 205 | font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif; | ||
| 206 | font-weight: 700; | 162 | font-weight: 700; |
| 207 | font-size: 16px; | 163 | font-size: 16px; |
| 208 | text-align: center; | 164 | text-align: center; |
| ... | @@ -221,21 +177,28 @@ export default { | ... | @@ -221,21 +177,28 @@ export default { |
| 221 | } | 177 | } |
| 222 | 178 | ||
| 223 | .xxTableBox { | 179 | .xxTableBox { |
| 224 | width: 810px; | ||
| 225 | overflow-x: scroll; | 180 | overflow-x: scroll; |
| 181 | width: 100%; | ||
| 226 | } | 182 | } |
| 227 | 183 | ||
| 228 | .xxTable>tr:first-child th { | 184 | .xxTable>tr:first-child th { |
| 229 | width: 140px; | 185 | width: 140px; |
| 230 | } | 186 | } |
| 231 | 187 | ||
| 188 | tr td { | ||
| 189 | border: 1px solid #ccc; | ||
| 190 | } | ||
| 191 | |||
| 232 | .xxTable { | 192 | .xxTable { |
| 193 | // border-spacing: 0; | ||
| 233 | border-spacing: 1px; | 194 | border-spacing: 1px; |
| 195 | width: 100%; | ||
| 234 | 196 | ||
| 235 | tr>th { | 197 | tr>th { |
| 236 | background: #464c5b; | 198 | background: #464c5b; |
| 237 | color: #fff; | 199 | color: #fff; |
| 238 | font-size: 16px; | 200 | font-size: 16px; |
| 201 | height: 60px; | ||
| 239 | } | 202 | } |
| 240 | 203 | ||
| 241 | th.linshi, | 204 | th.linshi, |
| ... | @@ -273,19 +236,19 @@ export default { | ... | @@ -273,19 +236,19 @@ export default { |
| 273 | display: block; | 236 | display: block; |
| 274 | width: 0; | 237 | width: 0; |
| 275 | height: 0; | 238 | height: 0; |
| 276 | border-width: 0px 0px 45px 45px; | 239 | border-width: 0px 0px 55px 55px; |
| 277 | border-style: none solid solid; | 240 | border-style: none solid solid; |
| 278 | border-color: transparent transparent #fe9400; | 241 | border-color: transparent transparent #fe9400; |
| 279 | position: absolute; | 242 | position: absolute; |
| 280 | top: 0px; | 243 | top: 0; |
| 281 | right: 3px; | 244 | right: 0; |
| 282 | transform: rotate(-90deg); | 245 | transform: rotate(-90deg); |
| 283 | } | 246 | } |
| 284 | 247 | ||
| 285 | .icon { | 248 | .icon { |
| 286 | position: absolute; | 249 | position: absolute; |
| 287 | top: 8px; | 250 | top: 13px; |
| 288 | right: 6px; | 251 | right: -4px; |
| 289 | transform: rotate(45deg); | 252 | transform: rotate(45deg); |
| 290 | color: #fff; | 253 | color: #fff; |
| 291 | font-size: 12px; | 254 | font-size: 12px; |
| ... | @@ -297,6 +260,7 @@ export default { | ... | @@ -297,6 +260,7 @@ export default { |
| 297 | height: 40px; | 260 | height: 40px; |
| 298 | padding: 4px; | 261 | padding: 4px; |
| 299 | font-size: 13px; | 262 | font-size: 13px; |
| 263 | width: 140px; | ||
| 300 | } | 264 | } |
| 301 | 265 | ||
| 302 | >tr:nth-child(odd) td { | 266 | >tr:nth-child(odd) td { | ... | ... |
| ... | @@ -215,6 +215,7 @@ export default { | ... | @@ -215,6 +215,7 @@ export default { |
| 215 | }, | 215 | }, |
| 216 | methods: { | 216 | methods: { |
| 217 | list (bsmSldy) { | 217 | list (bsmSldy) { |
| 218 | debugger; | ||
| 218 | var formdata = new FormData(); | 219 | var formdata = new FormData(); |
| 219 | formdata.append("bsmSldy", bsmSldy); | 220 | formdata.append("bsmSldy", bsmSldy); |
| 220 | Init(formdata).then((res) => { | 221 | Init(formdata).then((res) => { | ... | ... |
| ... | @@ -177,9 +177,9 @@ export default { | ... | @@ -177,9 +177,9 @@ export default { |
| 177 | 177 | ||
| 178 | .spyj_title { | 178 | .spyj_title { |
| 179 | text-align: center; | 179 | text-align: center; |
| 180 | font-size: 24px; | 180 | font-size: 18px; |
| 181 | display: block; | 181 | display: block; |
| 182 | margin-bottom: 10px; | 182 | margin: 5px; |
| 183 | } | 183 | } |
| 184 | 184 | ||
| 185 | /deep/.el-form-item { | 185 | /deep/.el-form-item { | ... | ... |
| 1 | <template> | 1 | <template> |
| 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" :key="index"> | 5 | <li |
| 6 | @click="operation(index, item)" | ||
| 7 | v-for="(item, index) in headerleftList" | ||
| 8 | :key="index" | ||
| 9 | > | ||
| 6 | <svg-icon :icon-class="item.icon" /> | 10 | <svg-icon :icon-class="item.icon" /> |
| 7 | <span class="iconName">{{ item.name }}</span> | 11 | <span class="iconName">{{ item.name }}</span> |
| 8 | </li> | 12 | </li> |
| 9 | </ul> | 13 | </ul> |
| 10 | <ul> | 14 | <ul> |
| 11 | <li @click="operation(index, item)" v-for="(item, index) in headerRightList" :key="index"> | 15 | <li |
| 16 | @click="operation(index, item)" | ||
| 17 | v-for="(item, index) in headerRightList" | ||
| 18 | :key="index" | ||
| 19 | > | ||
| 12 | <svg-icon class="icon" :icon-class="item.icon" /> | 20 | <svg-icon class="icon" :icon-class="item.icon" /> |
| 13 | <span class="iconName">{{ item.name }}</span> | 21 | <span class="iconName">{{ item.name }}</span> |
| 14 | </li> | 22 | </li> |
| ... | @@ -16,20 +24,30 @@ | ... | @@ -16,20 +24,30 @@ |
| 16 | </div> | 24 | </div> |
| 17 | <div class="tabsList"> | 25 | <div class="tabsList"> |
| 18 | <div class="tabsList-left"> | 26 | <div class="tabsList-left"> |
| 19 | <div class="map-drawer-click" v-if='!isShowdrawer' @click="() => { | 27 | <div |
| 28 | class="map-drawer-click" | ||
| 29 | v-if="!isShowdrawer" | ||
| 30 | @click=" | ||
| 31 | () => { | ||
| 20 | this.isShowdrawer = !this.isShowdrawer; | 32 | this.isShowdrawer = !this.isShowdrawer; |
| 21 | }"> | 33 | } |
| 22 | </div> | 34 | " |
| 23 | <div class="map-drawer-expand" v-else @click="() => { | 35 | ></div> |
| 36 | <div | ||
| 37 | class="map-drawer-expand" | ||
| 38 | v-else | ||
| 39 | @click=" | ||
| 40 | () => { | ||
| 24 | this.isShowdrawer = !this.isShowdrawer; | 41 | this.isShowdrawer = !this.isShowdrawer; |
| 25 | }"> | 42 | } |
| 26 | </div> | 43 | " |
| 27 | <ul v-if='this.isShowdrawer'> | 44 | ></div> |
| 28 | <p class="title">受理单元列表({{unitData.length}})</p> | 45 | <ul v-if="this.isShowdrawer"> |
| 29 | <div v-for='(item,index) in unitData' :key='index'> | 46 | <p class="title">申请单元列表({{ unitData.length }})</p> |
| 30 | <li @click='unitClick(item)'> | 47 | <div v-for="(item, index) in unitData" :key="index"> |
| 31 | <p>{{item.bdcdyh}}</p> | 48 | <li @click="unitClick(item)"> |
| 32 | <p>{{item.zl}}</p> | 49 | <p>{{ item.bdcdyh }}</p> |
| 50 | <p>{{ item.zl }}</p> | ||
| 33 | </li> | 51 | </li> |
| 34 | <div class="xian"></div> | 52 | <div class="xian"></div> |
| 35 | </div> | 53 | </div> |
| ... | @@ -40,32 +58,50 @@ | ... | @@ -40,32 +58,50 @@ |
| 40 | <p class="splitScreen tabsList-title">材料信息</p> | 58 | <p class="splitScreen tabsList-title">材料信息</p> |
| 41 | <div class="splitScreen"></div> | 59 | <div class="splitScreen"></div> |
| 42 | </div> | 60 | </div> |
| 43 | <el-tabs v-model="activeName" @tab-click='activeClick'> | 61 | <div style="width: 100%"> |
| 44 | <el-tab-pane :label="item.name" :name="item.value" v-for="(item, index) in tabList" :key="index"> | 62 | <el-tabs v-model="activeName" @tab-click="activeClick"> |
| 45 | <div class="splitScreen-con"> | 63 | <el-tab-pane |
| 46 | <component ref='slxx' v-if='item.value == "slxx"' :is="editItem" :flag="flag" :key="key" /> | 64 | :label="item.name" |
| 47 | <component ref='clxx' :is="editItem" v-else-if='item.value == "clxx"' :key="key" /> | 65 | :name="item.value" |
| 48 | <component ref='spyj' :is="editItem" v-else-if='item.value == "spyj"' :key="key" :bsmBusiness="bsmBusiness" :bestepid="queryForm.bestepid"/> | 66 | v-for="(item, index) in tabList" |
| 49 | <component :is="editItem" v-else :key="key" /> | 67 | :key="index" |
| 50 | </div> | 68 | > |
| 51 | </el-tab-pane> | 69 | </el-tab-pane> |
| 52 | </el-tabs> | 70 | </el-tabs> |
| 71 | <div class="splitScreen-con"> | ||
| 72 | <component | ||
| 73 | ref="slxx" | ||
| 74 | v-if="activeName == 'slsq'" | ||
| 75 | :is="editItem" | ||
| 76 | :flag="flag" | ||
| 77 | :key="key" | ||
| 78 | /> | ||
| 79 | <component :is="editItem" :key="key" /> | ||
| 53 | </div> | 80 | </div> |
| 54 | </div> | 81 | </div> |
| 55 | <zc ref="zcDialogRef" v-model="zcDialog" :queryForm='queryForm' /> | 82 | </div> |
| 56 | <thDialog ref='thdialogRef' v-model="thflag" :taskId='taskId' :bsmBusiness='bsmBusiness' :queryForm='queryForm' /> | 83 | </div> |
| 57 | <zsylDialog v-model='zsylFlag' /> | 84 | <zc ref="zcDialogRef" v-model="zcDialog" :queryForm="queryForm" /> |
| 85 | <thDialog | ||
| 86 | ref="thdialogRef" | ||
| 87 | v-model="thflag" | ||
| 88 | :taskId="taskId" | ||
| 89 | :bsmBusiness="bsmBusiness" | ||
| 90 | :queryForm="queryForm" | ||
| 91 | /> | ||
| 92 | <zsylDialog v-model="zsylFlag" /> | ||
| 58 | </div> | 93 | </div> |
| 59 | </template> | 94 | </template> |
| 60 | <script> | 95 | <script> |
| 61 | import { leftMenu, stepExpandInfo } from "@/api/fqsq.js" | 96 | import { leftMenu, stepExpandInfo, record } from "@/api/fqsq.js"; |
| 62 | import zc from "./components/zc.vue" | 97 | import comMsg from "@/views/components/comMsg.vue"; |
| 63 | import thDialog from "./components/th.vue" | 98 | import zc from "./components/zc.vue"; |
| 64 | import zsylDialog from './components/zsyl' | 99 | import thDialog from "./components/th.vue"; |
| 100 | import zsylDialog from "./components/zsyl"; | ||
| 65 | export default { | 101 | export default { |
| 66 | /**注册组件*/ | 102 | /**注册组件*/ |
| 67 | components: { zc, thDialog, zsylDialog }, | 103 | components: { zc, thDialog, zsylDialog, comMsg }, |
| 68 | data () { | 104 | data() { |
| 69 | return { | 105 | return { |
| 70 | zsylFlag: false, | 106 | zsylFlag: false, |
| 71 | zcDialog: false, | 107 | zcDialog: false, |
| ... | @@ -79,10 +115,10 @@ export default { | ... | @@ -79,10 +115,10 @@ export default { |
| 79 | flag: false, | 115 | flag: false, |
| 80 | headerleftList: [], | 116 | headerleftList: [], |
| 81 | headerRightList: [], | 117 | headerRightList: [], |
| 82 | activeName: 'slxx', | 118 | activeName: "slxx", |
| 83 | tabList1: [], | 119 | tabList1: [], |
| 84 | tabList: [], | 120 | tabList: [], |
| 85 | editItem: '', | 121 | editItem: "", |
| 86 | issplitScreen: false, | 122 | issplitScreen: false, |
| 87 | unitData: [], | 123 | unitData: [], |
| 88 | taskId: "", | 124 | taskId: "", |
| ... | @@ -92,56 +128,60 @@ export default { | ... | @@ -92,56 +128,60 @@ export default { |
| 92 | }, | 128 | }, |
| 93 | watch: { | 129 | watch: { |
| 94 | activeName: { | 130 | activeName: { |
| 95 | handler (newName, oldName) { | 131 | handler(newName, oldName) { |
| 96 | this.editItem = this.loadView(newName) | 132 | if (newName === "qlxx") { |
| 97 | }, | 133 | this.editItem = this.loadViewSlsq(); |
| 98 | immediate: true | 134 | } else { |
| 135 | this.editItem = this.loadView(newName); | ||
| 99 | } | 136 | } |
| 100 | }, | 137 | }, |
| 101 | mounted () { | 138 | immediate: true, |
| 139 | }, | ||
| 140 | }, | ||
| 141 | mounted() { | ||
| 102 | if (this.$route.query.bsmSlsq) { | 142 | if (this.$route.query.bsmSlsq) { |
| 103 | this.expandInfo(this.$route.query.bsmSlsq, this.$route.query.bestepid); | 143 | this.expandInfo(this.$route.query.bsmSlsq, this.$route.query.bestepid); |
| 104 | this.list(this.$route.query.bsmSlsq) | 144 | this.list(this.$route.query.bsmSlsq); |
| 105 | this.queryForm.bsmSlsq = this.$route.query.bsmSlsq | 145 | this.queryForm.bsmSlsq = this.$route.query.bsmSlsq; |
| 106 | this.queryForm.bestepid = this.$route.query.bestepid | 146 | this.queryForm.bestepid = this.$route.query.bestepid; |
| 107 | } | 147 | } |
| 108 | }, | 148 | }, |
| 109 | methods: { | 149 | methods: { |
| 110 | // 获取左侧列表 | 150 | // 获取左侧列表 |
| 111 | list (id) { | 151 | list(id) { |
| 112 | let that = this | 152 | let that = this; |
| 113 | that.id = id | 153 | that.id = id; |
| 114 | var formdata = new FormData(); | 154 | var formdata = new FormData(); |
| 115 | formdata.append("bsmSlsq", id); | 155 | formdata.append("bsmSlsq", id); |
| 116 | leftMenu(formdata).then(res => { | 156 | leftMenu(formdata).then((res) => { |
| 117 | if (res.code === 200) { | 157 | if (res.code === 200) { |
| 118 | this.unitData = res.result ? res.result : [] | 158 | this.unitData = res.result ? res.result : []; |
| 119 | setTimeout(() => { | 159 | setTimeout(() => { |
| 120 | that.$refs?.slxx[0].list(that.unitData && that.unitData[0].bsmSldy) | 160 | that.$refs.slxx?.[0].list(that.unitData?.[0]?.bsmSldy); |
| 121 | this.taskId = that.unitData[0].taskId | 161 | this.taskId = that.unitData?.[0]?.taskId; |
| 122 | this.bsmBusiness = that.unitData[0].bsmBusiness | 162 | this.bsmBusiness = that.unitData?.[0]?.bsmBusiness; |
| 123 | }, 300); | 163 | }, 300); |
| 124 | } | 164 | } |
| 125 | }) | 165 | }); |
| 126 | }, | 166 | }, |
| 127 | //获取环节扩展信息 | 167 | //获取环节扩展信息 |
| 128 | expandInfo (bsmSlsq, bestepid) { | 168 | expandInfo(bsmSlsq, bestepid) { |
| 129 | let that = this | 169 | let that = this; |
| 130 | var formdata = new FormData(); | 170 | var formdata = new FormData(); |
| 131 | formdata.append("bsmSlsq", bsmSlsq); | 171 | formdata.append("bsmSlsq", bsmSlsq); |
| 132 | formdata.append("bestepid", bestepid); | 172 | formdata.append("bestepid", bestepid); |
| 133 | stepExpandInfo(formdata).then(res => { | 173 | stepExpandInfo(formdata).then((res) => { |
| 134 | if (res.code === 200) { | 174 | if (res.code === 200) { |
| 135 | this.tabList1 = [...res.result.form] | 175 | this.tabList1 = [...res.result.form]; |
| 136 | this.tabList = res.result.form | 176 | this.tabList = res.result.form; |
| 137 | this.headerleftList = res.result.button; | 177 | this.headerleftList = res.result.button; |
| 138 | this.headerRightList = res.result.operation; | 178 | this.headerRightList = res.result.operation; |
| 139 | } | 179 | } |
| 140 | }) | 180 | }); |
| 141 | }, | 181 | }, |
| 142 | activeClick (tab, event) { | 182 | activeClick(tab, event) { |
| 143 | if (tab.name == 'slxx') { | 183 | if (tab.name == "slxx") { |
| 144 | this.list(this.id) | 184 | this.list(this.id); |
| 145 | } | 185 | } |
| 146 | }, | 186 | }, |
| 147 | // 左侧列表点击调用接口 | 187 | // 左侧列表点击调用接口 |
| ... | @@ -161,37 +201,76 @@ export default { | ... | @@ -161,37 +201,76 @@ export default { |
| 161 | }) | 201 | }) |
| 162 | } | 202 | } |
| 163 | }, | 203 | }, |
| 164 | operation (index, item) { | 204 | operation(index, item) { |
| 165 | if (item.value == 'zsyl') { | 205 | switch (item.value) { |
| 166 | this.zsylFlag = true | 206 | case "zsyl": |
| 167 | 207 | this.zsylFlag = true; | |
| 168 | } else if (item.value == 'clfp') { | 208 | break; |
| 169 | this.key++ | 209 | case "clfp": |
| 170 | this.issplitScreen = !this.issplitScreen | 210 | this.key++; |
| 171 | this.flag = !this.flag | 211 | this.issplitScreen = !this.issplitScreen; |
| 212 | this.flag = !this.flag; | ||
| 172 | if (this.issplitScreen) { | 213 | if (this.issplitScreen) { |
| 173 | this.tabList.splice(1, 1) | 214 | this.tabList.splice(1, 1); |
| 174 | } else { | 215 | } else { |
| 175 | this.tabList = [...this.tabList1] | 216 | this.tabList = [...this.tabList1]; |
| 176 | } | 217 | } |
| 177 | } else if (item.value == 'th') { | 218 | break; |
| 178 | this.thflag = true | 219 | case "th": |
| 220 | this.thflag = true; | ||
| 179 | this.$nextTick(() => { | 221 | this.$nextTick(() => { |
| 180 | this.$refs.thdialogRef.tablelistFn() | 222 | this.$refs.thdialogRef.tablelistFn(); |
| 223 | }); | ||
| 224 | break; | ||
| 225 | case "zc": | ||
| 226 | this.zcDialog = true; | ||
| 227 | this.$refs.zcDialogRef.tablelistFn(); | ||
| 228 | break; | ||
| 229 | case "tc": | ||
| 230 | window.close(); | ||
| 231 | break; | ||
| 232 | case "db": | ||
| 233 | var formdata = new FormData(); | ||
| 234 | formdata.append("bsmSlsq", this.$route.query.bsmSlsq); | ||
| 235 | formdata.append("bestepid", this.$route.query.bestepid); | ||
| 236 | // comMsg; | ||
| 237 | this.$confirm("请确认是否登簿", "提示", { | ||
| 238 | iconClass: "el-icon-question", //自定义图标样式 | ||
| 239 | confirmButtonText: "确认", //确认按钮文字更换 | ||
| 240 | cancelButtonText: "取消", //取消按钮文字更换 | ||
| 241 | showClose: true, //是否显示右上角关闭按钮 | ||
| 242 | type: "warning", //提示类型 success/info/warning/error | ||
| 181 | }) | 243 | }) |
| 244 | .then(function () { | ||
| 245 | record(formdata).then((res) => { | ||
| 246 | debugger; | ||
| 247 | if (res.code === 200 || res.code === 2002) { | ||
| 248 | this.$alert(res.message); | ||
| 182 | } | 249 | } |
| 183 | else if (item.value == 'zc') { | 250 | }); |
| 184 | this.zcDialog = true | 251 | }) |
| 185 | this.$refs.zcDialogRef.tablelistFn() | 252 | .then((data) => { |
| 186 | } else if (item.value === 'tc') { | 253 | this.$alert("res.Message"); |
| 187 | window.close() | 254 | }) |
| 255 | .catch(function (err) { | ||
| 256 | //捕获异常 | ||
| 257 | }); | ||
| 258 | |||
| 259 | break; | ||
| 188 | } | 260 | } |
| 189 | }, | 261 | }, |
| 190 | loadView (view) { | 262 | loadView(view) { |
| 191 | return r => require.ensure([], () => r(require(`./components/${view}.vue`))) | 263 | return (r) => |
| 264 | require.ensure([], () => r(require(`./components/${view}.vue`))); | ||
| 192 | }, | 265 | }, |
| 266 | loadViewSlsq() { | ||
| 267 | return (r) => | ||
| 268 | require.ensure([], () => | ||
| 269 | r(require("../../components/jsydsyq/jsydsyq.vue")) | ||
| 270 | ); | ||
| 193 | }, | 271 | }, |
| 194 | } | 272 | }, |
| 273 | }; | ||
| 195 | </script> | 274 | </script> |
| 196 | <style scoped lang='scss'> | 275 | <style scoped lang='scss'> |
| 197 | @import "~@/styles/mixin.scss"; | 276 | @import "~@/styles/mixin.scss"; |
| ... | @@ -214,13 +293,14 @@ export default { | ... | @@ -214,13 +293,14 @@ export default { |
| 214 | font-size: 12px; | 293 | font-size: 12px; |
| 215 | } | 294 | } |
| 216 | 295 | ||
| 217 | /deep/.el-tabs__content { | 296 | /deep/.el-tabs__header { |
| 218 | height: calc(100vh - 135px) !important; | 297 | margin: 0 !important; |
| 219 | } | 298 | } |
| 220 | 299 | ||
| 221 | .splitScreen-con { | 300 | .splitScreen-con { |
| 222 | padding: 0 15px; | 301 | padding: 0 15px; |
| 223 | box-sizing: border-box; | 302 | box-sizing: border-box; |
| 303 | height: calc(100% - 350px); | ||
| 224 | } | 304 | } |
| 225 | 305 | ||
| 226 | .fqsq { | 306 | .fqsq { |
| ... | @@ -231,7 +311,6 @@ export default { | ... | @@ -231,7 +311,6 @@ export default { |
| 231 | background-color: #ffffff; | 311 | background-color: #ffffff; |
| 232 | overflow: hidden; | 312 | overflow: hidden; |
| 233 | 313 | ||
| 234 | |||
| 235 | .splitScreen { | 314 | .splitScreen { |
| 236 | min-width: 50%; | 315 | min-width: 50%; |
| 237 | } | 316 | } |
| ... | @@ -240,7 +319,7 @@ export default { | ... | @@ -240,7 +319,7 @@ export default { |
| 240 | @include flex; | 319 | @include flex; |
| 241 | width: 100%; | 320 | width: 100%; |
| 242 | height: 80px; | 321 | height: 80px; |
| 243 | background-color: #3498DB; | 322 | background-color: #3498db; |
| 244 | color: #ffffff; | 323 | color: #ffffff; |
| 245 | justify-content: space-between; | 324 | justify-content: space-between; |
| 246 | padding-left: 15px; | 325 | padding-left: 15px; |
| ... | @@ -266,7 +345,6 @@ export default { | ... | @@ -266,7 +345,6 @@ export default { |
| 266 | border-radius: 5px; | 345 | border-radius: 5px; |
| 267 | //color: $light-blue ; | 346 | //color: $light-blue ; |
| 268 | 347 | ||
| 269 | |||
| 270 | .svg-icon { | 348 | .svg-icon { |
| 271 | //color: $light-blue ; | 349 | //color: $light-blue ; |
| 272 | } | 350 | } |
| ... | @@ -277,7 +355,7 @@ export default { | ... | @@ -277,7 +355,7 @@ export default { |
| 277 | .map-drawer-expand { | 355 | .map-drawer-expand { |
| 278 | width: 20px; | 356 | width: 20px; |
| 279 | height: 77px; | 357 | height: 77px; |
| 280 | background: url('../../../image/right.png'); | 358 | background: url("../../../image/right.png"); |
| 281 | background-size: cover; | 359 | background-size: cover; |
| 282 | position: absolute; | 360 | position: absolute; |
| 283 | right: 0%; | 361 | right: 0%; |
| ... | @@ -289,7 +367,7 @@ export default { | ... | @@ -289,7 +367,7 @@ export default { |
| 289 | .map-drawer-click { | 367 | .map-drawer-click { |
| 290 | width: 20px; | 368 | width: 20px; |
| 291 | height: 77px; | 369 | height: 77px; |
| 292 | background: url('../../../image/left.png'); | 370 | background: url("../../../image/left.png"); |
| 293 | background-size: cover; | 371 | background-size: cover; |
| 294 | position: absolute; | 372 | position: absolute; |
| 295 | left: 0%; | 373 | left: 0%; |
| ... | @@ -311,16 +389,15 @@ export default { | ... | @@ -311,16 +389,15 @@ export default { |
| 311 | @include flex; | 389 | @include flex; |
| 312 | 390 | ||
| 313 | .tabsList-left { | 391 | .tabsList-left { |
| 314 | border-right: 1px solid #EBEEF5; | 392 | border-right: 1px solid #ebeef5; |
| 315 | position: relative; | 393 | position: relative; |
| 316 | width: 250px; | ||
| 317 | box-sizing: border-box; | 394 | box-sizing: border-box; |
| 318 | 395 | ||
| 319 | ul { | 396 | ul { |
| 320 | position: relative; | 397 | position: relative; |
| 321 | 398 | ||
| 322 | .xian { | 399 | .xian { |
| 323 | background: #F2F2F2; | 400 | background: #f2f2f2; |
| 324 | padding: 2px; | 401 | padding: 2px; |
| 325 | } | 402 | } |
| 326 | 403 | ||
| ... | @@ -337,8 +414,8 @@ export default { | ... | @@ -337,8 +414,8 @@ export default { |
| 337 | } | 414 | } |
| 338 | 415 | ||
| 339 | li:hover { | 416 | li:hover { |
| 340 | color: #0F93F6; | 417 | color: #0f93f6; |
| 341 | cursor: pointer | 418 | cursor: pointer; |
| 342 | } | 419 | } |
| 343 | } | 420 | } |
| 344 | } | 421 | } |
| ... | @@ -346,7 +423,7 @@ export default { | ... | @@ -346,7 +423,7 @@ export default { |
| 346 | .tabsList-right { | 423 | .tabsList-right { |
| 347 | .fenpin { | 424 | .fenpin { |
| 348 | min-width: 50%; | 425 | min-width: 50%; |
| 349 | border-right: 1px solid #EBEEF5; | 426 | border-right: 1px solid #ebeef5; |
| 350 | } | 427 | } |
| 351 | 428 | ||
| 352 | background-color: #ffffff; | 429 | background-color: #ffffff; | ... | ... |
-
Please register or sign in to post a comment