修改登记簿内容
Showing
26 changed files
with
118 additions
and
1521 deletions
src/api/registerBook.js
0 → 100644
| 1 | import request from '@/utils/request' | ||
| 2 | /* | ||
| 3 | 登记簿详情页 | ||
| 4 | */ | ||
| 5 | |||
| 6 | // 获取登记封面 | ||
| 7 | export function getDjbfm(data) { | ||
| 8 | return request({ | ||
| 9 | url: '/djbDetail/getDjbFm', | ||
| 10 | method: 'get', | ||
| 11 | params: data | ||
| 12 | }) | ||
| 13 | } | ||
| 14 | |||
| 15 | // 获取登记目录 | ||
| 16 | export function getBdcqldjmlByBdcdyid(data) { | ||
| 17 | return request({ | ||
| 18 | url: '/djbDetail/getBdcqldjmlByBdcdyid', | ||
| 19 | method: 'get', | ||
| 20 | params: data | ||
| 21 | }) | ||
| 22 | } | ||
| 23 | |||
| 24 | // 获取宗地信息 | ||
| 25 | export function getZdjjxxBybdcdyid(data) { | ||
| 26 | return request({ | ||
| 27 | url: '/djbDetail/getZdjjxxBybdcdyid', | ||
| 28 | method: 'get', | ||
| 29 | params: data | ||
| 30 | }) | ||
| 31 | } | ||
| 32 | |||
| 33 | // 根据受理单元标识,获取宗地信息 | ||
| 34 | export function getZdjjxxBySLdy(data) { | ||
| 35 | return request({ | ||
| 36 | url: '/djbDetail/getZdjjxxBySLdy', | ||
| 37 | method: 'get', | ||
| 38 | params: data | ||
| 39 | }) | ||
| 40 | } | ||
| 41 | |||
| 42 | // 获取不动产权利及其他事项 | ||
| 43 | export function getBdcqljqtsx(data) { | ||
| 44 | return request({ | ||
| 45 | url: '/djbDetail/getBdcqljqtsx', | ||
| 46 | method: 'get', | ||
| 47 | params: data | ||
| 48 | }) | ||
| 49 | } | ||
| 50 | |||
| 51 | // 获取建设用地使用权 | ||
| 52 | export function getJsydsyqList(data) { | ||
| 53 | return request({ | ||
| 54 | url: '/djbDetail/getJsydsyqList', | ||
| 55 | method: 'post', | ||
| 56 | data | ||
| 57 | }) | ||
| 58 | } | ||
| 59 | // 获取抵押权 | ||
| 60 | export function getDiyaqList(data) { | ||
| 61 | return request({ | ||
| 62 | url: '/djbDetail/getDiyaqList', | ||
| 63 | method: 'post', | ||
| 64 | data | ||
| 65 | }) | ||
| 66 | } | ||
| 67 | // 获取地役权 | ||
| 68 | export function getDiyiqList(data) { | ||
| 69 | return request({ | ||
| 70 | url: '/djbDetail/getDiyiqList', | ||
| 71 | method: 'post', | ||
| 72 | data | ||
| 73 | }) | ||
| 74 | } | ||
| 75 | // 获取预告登记 | ||
| 76 | export function getYgdjList(data) { | ||
| 77 | return request({ | ||
| 78 | url: '/djbDetail/getYgdjList', | ||
| 79 | method: 'post', | ||
| 80 | data | ||
| 81 | }) | ||
| 82 | } | ||
| 83 | // 获取异议登记 | ||
| 84 | export function getYydjList(data) { | ||
| 85 | return request({ | ||
| 86 | url: '/djbDetail/getYydjList', | ||
| 87 | method: 'post', | ||
| 88 | data | ||
| 89 | }) | ||
| 90 | } | ||
| 91 | // 获取查封登记 | ||
| 92 | export function getCfdjList(data) { | ||
| 93 | return request({ | ||
| 94 | url: '/djbDetail/getCfdjList', | ||
| 95 | method: 'post', | ||
| 96 | data | ||
| 97 | }) | ||
| 98 | } |
| ... | @@ -23,7 +23,7 @@ | ... | @@ -23,7 +23,7 @@ |
| 23 | </template> | 23 | </template> |
| 24 | 24 | ||
| 25 | <script> | 25 | <script> |
| 26 | import { getBdcqldjmlByBdcdyid } from "@/api/zhcx.js"; | 26 | import { getBdcqldjmlByBdcdyid } from "@/api/registerBook.js"; |
| 27 | export default { | 27 | export default { |
| 28 | data() { | 28 | data() { |
| 29 | return { | 29 | return { | ... | ... |
| ... | @@ -49,7 +49,7 @@ | ... | @@ -49,7 +49,7 @@ |
| 49 | </template> | 49 | </template> |
| 50 | 50 | ||
| 51 | <script> | 51 | <script> |
| 52 | import { getBdcqljqtsx } from "@/api/zhcx.js"; | 52 | import { getBdcqljqtsx } from "@/api/registerBook.js"; |
| 53 | export default { | 53 | export default { |
| 54 | name: "bdcqljqtsx", | 54 | name: "bdcqljqtsx", |
| 55 | data() { | 55 | data() { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getCfdjList } from "@/api/zhcx.js"; | 50 | import { getCfdjList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getDiyaqList } from "@/api/zhcx.js"; | 50 | import { getDiyaqList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getDiyiqList } from "@/api/zhcx.js"; | 50 | import { getDiyiqList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -19,7 +19,7 @@ | ... | @@ -19,7 +19,7 @@ |
| 19 | </div> | 19 | </div> |
| 20 | </template> | 20 | </template> |
| 21 | <script> | 21 | <script> |
| 22 | import { getBdcqljqtsx } from "@/api/zhcx.js"; | 22 | import { getBdcqljqtsx } from "@/api/registerBook.js"; |
| 23 | export default { | 23 | export default { |
| 24 | data() { | 24 | data() { |
| 25 | return { | 25 | return { | ... | ... |
| ... | @@ -10,11 +10,11 @@ | ... | @@ -10,11 +10,11 @@ |
| 10 | 区 (县、市) | 10 | 区 (县、市) |
| 11 | </p> | 11 | </p> |
| 12 | <p> | 12 | <p> |
| 13 | <font>{{ info.zhen }}</font> | 13 | <font>{{ info.jdh }}</font> |
| 14 | 街道 (乡、镇) | 14 | 街道 (乡、镇) |
| 15 | <font>{{ info.cun }}</font> | 15 | <font>{{ info.jfh }}</font> |
| 16 | 街坊 (村) | 16 | 街坊 (村) |
| 17 | <font>{{ info.zu }}</font> | 17 | <font>{{ info.zh }}</font> |
| 18 | 组 | 18 | 组 |
| 19 | </p> | 19 | </p> |
| 20 | <div class="title">不动产登记簿</div> | 20 | <div class="title">不动产登记簿</div> |
| ... | @@ -33,7 +33,7 @@ | ... | @@ -33,7 +33,7 @@ |
| 33 | </template> | 33 | </template> |
| 34 | 34 | ||
| 35 | <script> | 35 | <script> |
| 36 | import { getDjbfm } from "@/api/zhcx.js"; | 36 | import { getDjbfm } from "@/api/registerBook.js"; |
| 37 | 37 | ||
| 38 | export default { | 38 | export default { |
| 39 | data() { | 39 | data() { |
| ... | @@ -48,9 +48,7 @@ export default { | ... | @@ -48,9 +48,7 @@ export default { |
| 48 | }, | 48 | }, |
| 49 | methods: { | 49 | methods: { |
| 50 | loadData() { | 50 | loadData() { |
| 51 | getDjbfm( | 51 | getDjbfm({ bdcdyid: this.propsParam.bdcdyid}).then((res) => { |
| 52 | this.propsParam.bsmQlxx | ||
| 53 | ).then((res) => { | ||
| 54 | if (res.code === 200) { | 52 | if (res.code === 200) { |
| 55 | this.info = res.result; | 53 | this.info = res.result; |
| 56 | } | 54 | } | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getJsydsyqList } from "@/api/zhcx.js"; | 50 | import { getJsydsyqList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getJsydsyqList } from "@/api/zhcx.js"; | 50 | import { getJsydsyqList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getJsydsyqList } from "@/api/zhcx.js"; | 50 | import { getJsydsyqList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getYgdjList } from "@/api/zhcx.js"; | 50 | import { getYgdjList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | </template> | 47 | </template> |
| 48 | 48 | ||
| 49 | <script> | 49 | <script> |
| 50 | import { getYydjList } from "@/api/zhcx.js"; | 50 | import { getYydjList } from "@/api/registerBook.js"; |
| 51 | import { datas } from "./qlxxFormData.js"; | 51 | import { datas } from "./qlxxFormData.js"; |
| 52 | export default { | 52 | export default { |
| 53 | data() { | 53 | data() { | ... | ... |
| ... | @@ -122,8 +122,7 @@ | ... | @@ -122,8 +122,7 @@ |
| 122 | </template> | 122 | </template> |
| 123 | 123 | ||
| 124 | <script> | 124 | <script> |
| 125 | import { mapGetters } from "vuex"; | 125 | import { getZdjjxxBybdcdyid } from "@/api/registerBook.js"; |
| 126 | import { getZdjjxxBybdcdyid } from "@/api/zhcx.js"; | ||
| 127 | 126 | ||
| 128 | export default { | 127 | export default { |
| 129 | data () { | 128 | data () { |
| ... | @@ -169,22 +168,8 @@ export default { | ... | @@ -169,22 +168,8 @@ export default { |
| 169 | showGroup: false, | 168 | showGroup: false, |
| 170 | }; | 169 | }; |
| 171 | }, | 170 | }, |
| 172 | // computed: { | ||
| 173 | // ...mapGetters(["djbxx"]), | ||
| 174 | // }, | ||
| 175 | created () { | 171 | created () { |
| 176 | //this.propsParam = this.$attrs; | ||
| 177 | // this.$nextTick(() => { | ||
| 178 | |||
| 179 | // }); | ||
| 180 | this.loadData(); | 172 | this.loadData(); |
| 181 | //this.$alert(this.param.bdcdyh); | ||
| 182 | // this.info = this.djbxx.zdjbxx; | ||
| 183 | // this.djzd = this.djbxx.zdjbxx.djzd; | ||
| 184 | // this.zdbhqks = this.djbxx.zdjbxx.zdbhqks; | ||
| 185 | |||
| 186 | // let widths = (this.zdbhqks.length + 1) * 180 + 110; | ||
| 187 | // this.bhqkTableWidth = widths > 745 ? widths : 745; | ||
| 188 | }, | 173 | }, |
| 189 | methods: { | 174 | methods: { |
| 190 | loadData () { | 175 | loadData () { |
| ... | @@ -192,7 +177,6 @@ export default { | ... | @@ -192,7 +177,6 @@ export default { |
| 192 | if (res.code === 200) { | 177 | if (res.code === 200) { |
| 193 | this.zdjbxx = res.result.zdjbxx; | 178 | this.zdjbxx = res.result.zdjbxx; |
| 194 | this.zdbhqks = res.result.zdbhqkList; | 179 | this.zdbhqks = res.result.zdbhqkList; |
| 195 | //this.$alert(this.zdjbxx); | ||
| 196 | if (this.zdbhqks != null && this.zdbhqks.length > 0) { | 180 | if (this.zdbhqks != null && this.zdbhqks.length > 0) { |
| 197 | this.showGroup = true; | 181 | this.showGroup = true; |
| 198 | } | 182 | } | ... | ... |
| ... | @@ -15,10 +15,10 @@ export function getForm (tabName) { | ... | @@ -15,10 +15,10 @@ export function getForm (tabName) { |
| 15 | form = require("@/views/workflow/components/spyj.vue"); | 15 | form = require("@/views/workflow/components/spyj.vue"); |
| 16 | break; | 16 | break; |
| 17 | case "zdjbxx": | 17 | case "zdjbxx": |
| 18 | form = require("@/views/zhcx/djbcx/components/zdxx.vue"); | 18 | form = require("@/views/registerBook/zdjbxx.vue"); |
| 19 | break; | 19 | break; |
| 20 | case "qlxx": | 20 | case "qlxx": |
| 21 | form = require("@/views/zhcx/djbcx/components/jsydsyq.vue"); | 21 | form = require("@/views/registerBook/jsydsyq.vue"); |
| 22 | break; | 22 | break; |
| 23 | case "szxx": | 23 | case "szxx": |
| 24 | form = require("@/views/workflow/components/szxx.vue"); | 24 | form = require("@/views/workflow/components/szxx.vue"); | ... | ... |
| 1 | <template> | ||
| 2 | <div class="bdcqldjml"> | ||
| 3 | <table class="mlTable"> | ||
| 4 | <tr> | ||
| 5 | <th colspan="5" class="title"> | ||
| 6 | 不动产权利登记目录 | ||
| 7 | <font class="num">第 1 页</font> | ||
| 8 | </th> | ||
| 9 | </tr> | ||
| 10 | <tr> | ||
| 11 | <td>序号</td> | ||
| 12 | <td>不动产单元号</td> | ||
| 13 | <td>不动产类型</td> | ||
| 14 | <td>所在本数</td> | ||
| 15 | <td>备注</td> | ||
| 16 | </tr> | ||
| 17 | <tr v-for="(item, index) in data" :key="index"> | ||
| 18 | <td>{{ item.xh }}</td> | ||
| 19 | <td>{{ item.bdcdyh }}</td> | ||
| 20 | <td>{{ item.bdclx }}</td> | ||
| 21 | <td>{{ item.szbs }}</td> | ||
| 22 | <td>{{ item.bz }}</td> | ||
| 23 | </tr> | ||
| 24 | </table> | ||
| 25 | </div> | ||
| 26 | </template> | ||
| 27 | |||
| 28 | <script> | ||
| 29 | import { mapGetters } from "vuex"; | ||
| 30 | |||
| 31 | export default { | ||
| 32 | name: "bdcqldjml", | ||
| 33 | data() { | ||
| 34 | return { | ||
| 35 | data: [], | ||
| 36 | }; | ||
| 37 | }, | ||
| 38 | computed: { | ||
| 39 | ...mapGetters(["djbxx"]), | ||
| 40 | }, | ||
| 41 | mounted() { | ||
| 42 | this.data = this.djbxx.djml; | ||
| 43 | }, | ||
| 44 | }; | ||
| 45 | </script> | ||
| 46 | |||
| 47 | <style lang="scss" scoped> | ||
| 48 | .bdcqldjml { | ||
| 49 | width: 100%; | ||
| 50 | height: 702px; | ||
| 51 | background: #fff; | ||
| 52 | overflow-y: scroll; | ||
| 53 | .mlTable { | ||
| 54 | width: 640px; | ||
| 55 | margin: 0 auto; | ||
| 56 | color: #333; | ||
| 57 | border-spacing: 1px; | ||
| 58 | background-color: #333; | ||
| 59 | |||
| 60 | .title { | ||
| 61 | font-size: 28px; | ||
| 62 | line-height: 60px; | ||
| 63 | font-family: serif; | ||
| 64 | position: relative; | ||
| 65 | |||
| 66 | .num { | ||
| 67 | position: absolute; | ||
| 68 | font-size: 12px; | ||
| 69 | right: 20px; | ||
| 70 | font-family: initial; | ||
| 71 | font-weight: normal; | ||
| 72 | } | ||
| 73 | } | ||
| 74 | |||
| 75 | td, | ||
| 76 | th { | ||
| 77 | background-color: white; | ||
| 78 | line-height: 40px; | ||
| 79 | padding: 0 4px; | ||
| 80 | text-align: center; | ||
| 81 | } | ||
| 82 | } | ||
| 83 | } | ||
| 84 | </style> |
| 1 | <template> | ||
| 2 | <div class="bdcqljqtsx"> | ||
| 3 | <div class="content"> | ||
| 4 | <div class="title">不动产权利及其他事项<br />登记信息</div> | ||
| 5 | <div> | ||
| 6 | 不动产单元号: | ||
| 7 | <div class="underline">{{ info.bdcdyh }}</div> | ||
| 8 | </div> | ||
| 9 | <br /><br /><br /> | ||
| 10 | <div> | ||
| 11 | <div class="underline">{{ info.qllx }}</div> | ||
| 12 | 登记 共 | ||
| 13 | <div class="underline">{{ info.total }}</div> | ||
| 14 | 条 | ||
| 15 | </div> | ||
| 16 | <br /><br /> | ||
| 17 | <div> | ||
| 18 | 抵押权登记 共 | ||
| 19 | <div class="underline">{{ info.dyaq }}</div> | ||
| 20 | 条 | ||
| 21 | </div> | ||
| 22 | <br /> | ||
| 23 | <div> | ||
| 24 | 地役权登记 共 | ||
| 25 | <div class="underline">{{ info.dyiq }}</div> | ||
| 26 | 条 | ||
| 27 | </div> | ||
| 28 | <br /> | ||
| 29 | <div> | ||
| 30 | 预告登记 共 | ||
| 31 | <div class="underline">{{ info.ygdj }}</div> | ||
| 32 | 条 | ||
| 33 | </div> | ||
| 34 | <br /> | ||
| 35 | <div> | ||
| 36 | 异议登记 共 | ||
| 37 | <div class="underline">{{ info.yydj }}</div> | ||
| 38 | 条 | ||
| 39 | </div> | ||
| 40 | <br /> | ||
| 41 | <div> | ||
| 42 | 查封登记 共 | ||
| 43 | <div class="underline">{{ info.cfdj }}</div> | ||
| 44 | 条 | ||
| 45 | </div> | ||
| 46 | <br /> | ||
| 47 | </div> | ||
| 48 | </div> | ||
| 49 | </template> | ||
| 50 | |||
| 51 | <script> | ||
| 52 | import { mapGetters } from "vuex"; | ||
| 53 | |||
| 54 | export default { | ||
| 55 | name: "bdcqljqtsx", | ||
| 56 | data () { | ||
| 57 | return { | ||
| 58 | info: { | ||
| 59 | bdcdyh: "", | ||
| 60 | qllx: "", | ||
| 61 | dyaq: 0, | ||
| 62 | dyiq: 0, | ||
| 63 | ygdj: 0, | ||
| 64 | yydj: 0, | ||
| 65 | cfdj: 0, | ||
| 66 | total: 0, | ||
| 67 | }, | ||
| 68 | }; | ||
| 69 | }, | ||
| 70 | computed: { | ||
| 71 | ...mapGetters(["djbxx"]), | ||
| 72 | }, | ||
| 73 | mounted () { | ||
| 74 | this.info.bdcdyh = this.djbxx.qlname.bdcdyh; | ||
| 75 | this.info.qllx = this.djbxx.qlname.qllx; | ||
| 76 | |||
| 77 | this.djbxx.qlname?.djbPrintModelList?.length > 0 && this.djbxx.qlname.djbPrintModelList.forEach((item) => { | ||
| 78 | console.log("this.info.total", this.info.total); | ||
| 79 | this.info.total += Number(item.xh); | ||
| 80 | if (item.djlxPrint == "抵押权") { | ||
| 81 | this.info.dyaq = Number(item.xh); | ||
| 82 | } else if (item.djlxPrint == "地役权") { | ||
| 83 | this.info.dyiq = Number(item.xh); | ||
| 84 | } else if (item.djlxPrint == "预告") { | ||
| 85 | this.info.ygdj = Number(item.xh); | ||
| 86 | } else if (item.djlxPrint == "异议") { | ||
| 87 | this.info.yydj = Number(item.xh); | ||
| 88 | } else if (item.djlxPrint == "查封") { | ||
| 89 | this.info.cfdj = Number(item.xh); | ||
| 90 | } | ||
| 91 | }); | ||
| 92 | }, | ||
| 93 | }; | ||
| 94 | </script> | ||
| 95 | |||
| 96 | <style lang="scss" scoped> | ||
| 97 | .bdcqljqtsx { | ||
| 98 | width: 100%; | ||
| 99 | height: 100%; | ||
| 100 | background: #fff; | ||
| 101 | |||
| 102 | .content { | ||
| 103 | width: 50%; | ||
| 104 | height: 100%; | ||
| 105 | margin: 0 auto; | ||
| 106 | text-align: right; | ||
| 107 | color: #333; | ||
| 108 | font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif; | ||
| 109 | font-weight: 700; | ||
| 110 | font-size: 18px; | ||
| 111 | line-height: 16px; | ||
| 112 | |||
| 113 | .title { | ||
| 114 | font-size: 32px; | ||
| 115 | text-align: center; | ||
| 116 | padding: 40px 0; | ||
| 117 | line-height: 34px; | ||
| 118 | } | ||
| 119 | |||
| 120 | .underline { | ||
| 121 | font-size: 14px; | ||
| 122 | font-weight: normal; | ||
| 123 | text-decoration: underline; | ||
| 124 | display: inline-block; | ||
| 125 | } | ||
| 126 | } | ||
| 127 | } | ||
| 128 | </style> |
| 1 | <template> | ||
| 2 | <div class="djbfm"> | ||
| 3 | <br /><br /> | ||
| 4 | <p> | ||
| 5 | <font>{{ info.sheng }}</font> | ||
| 6 | 省 (区、市) | ||
| 7 | <font>{{ info.shi }}</font> | ||
| 8 | 市 (区) | ||
| 9 | <font>{{ info.xian }}</font> | ||
| 10 | 区 (县、市) | ||
| 11 | </p> | ||
| 12 | <p> | ||
| 13 | <font>{{ info.zhen }}</font> | ||
| 14 | 街道 (乡、镇) | ||
| 15 | <font>{{ info.cun }}</font> | ||
| 16 | 街坊 (村) | ||
| 17 | <font>{{ info.zu }}</font> | ||
| 18 | 组 | ||
| 19 | </p> | ||
| 20 | <div class="title">不动产登记簿</div> | ||
| 21 | <br /> | ||
| 22 | <p> | ||
| 23 | 宗地/宗海号: | ||
| 24 | <font>{{ info.zddm }}</font> | ||
| 25 | </p> | ||
| 26 | <div class="bottom"> | ||
| 27 | <p> | ||
| 28 | 登记机构: | ||
| 29 | <font>{{ info.djjg }}</font> | ||
| 30 | </p> | ||
| 31 | </div> | ||
| 32 | </div> | ||
| 33 | </template> | ||
| 34 | |||
| 35 | <script> | ||
| 36 | import { mapGetters } from "vuex"; | ||
| 37 | |||
| 38 | export default { | ||
| 39 | name: "djbfm", | ||
| 40 | data() { | ||
| 41 | return { | ||
| 42 | info: {}, | ||
| 43 | }; | ||
| 44 | }, | ||
| 45 | computed: { | ||
| 46 | ...mapGetters(["djbxx"]), | ||
| 47 | }, | ||
| 48 | mounted() { | ||
| 49 | this.info = this.djbxx.djbfm; | ||
| 50 | }, | ||
| 51 | }; | ||
| 52 | </script> | ||
| 53 | |||
| 54 | <style lang="scss" scoped> | ||
| 55 | .djbfm { | ||
| 56 | width: 100%; | ||
| 57 | height: 100%; | ||
| 58 | background: #fff; | ||
| 59 | border-right: 1px solid #ccc; | ||
| 60 | line-height: 45px; | ||
| 61 | text-align: center; | ||
| 62 | font-size: 18px; | ||
| 63 | font-family: serif; | ||
| 64 | position: relative; | ||
| 65 | font { | ||
| 66 | border-bottom: 1px solid #000; | ||
| 67 | display: inline-block; | ||
| 68 | padding: 0 15px; | ||
| 69 | line-height: 16px; | ||
| 70 | } | ||
| 71 | .title { | ||
| 72 | height: 40%; | ||
| 73 | display: flex; | ||
| 74 | font-size: 38px; | ||
| 75 | color: #000; | ||
| 76 | justify-content: center; | ||
| 77 | align-items: center; | ||
| 78 | } | ||
| 79 | .bottom { | ||
| 80 | position: absolute; | ||
| 81 | bottom: 0px; | ||
| 82 | text-align: center; | ||
| 83 | width: 100%; | ||
| 84 | left: 0; | ||
| 85 | height: 100px; | ||
| 86 | line-height: 100px; | ||
| 87 | p { | ||
| 88 | font-size: 28px; | ||
| 89 | } | ||
| 90 | font { | ||
| 91 | font-size: 24px; | ||
| 92 | line-height: 24px; | ||
| 93 | } | ||
| 94 | } | ||
| 95 | } | ||
| 96 | </style> |
| 1 | <template> | ||
| 2 | <dialogBox title="登记簿信息" width="1200px" @closeDialog="closeDialog" v-model="value" :isReset="false" :isSave="false"> | ||
| 3 | <div class="content"> | ||
| 4 | <div class="left"> | ||
| 5 | <el-tree ref="tree" :data="treedata" :props="defaultProps" @node-click="handleNodeClick" | ||
| 6 | :default-expand-all="true" :expand-on-click-node="false" node-key="id" :default-checked-keys="[showTab]"> | ||
| 7 | </el-tree> | ||
| 8 | </div> | ||
| 9 | <div class="right"> | ||
| 10 | <components :is="showTab" :showType="showType"></components> | ||
| 11 | </div> | ||
| 12 | </div> | ||
| 13 | </dialogBox> | ||
| 14 | </template> | ||
| 15 | <script> | ||
| 16 | import { mapGetters } from "vuex"; | ||
| 17 | import djbfm from "./djbfm.vue"; | ||
| 18 | import zdxx from "./zdxx.vue"; | ||
| 19 | import bdcqldjml from "./bdcqldjml.vue"; | ||
| 20 | import bdcqljqtsx from "./bdcqljqtsx.vue"; | ||
| 21 | import djxxTable from "./djxxTable.vue"; | ||
| 22 | |||
| 23 | export default { | ||
| 24 | name: "djbxxDialog", | ||
| 25 | components: { | ||
| 26 | djbfm, | ||
| 27 | zdxx, | ||
| 28 | bdcqldjml, | ||
| 29 | bdcqljqtsx, | ||
| 30 | djxxTable, | ||
| 31 | }, | ||
| 32 | props: { | ||
| 33 | value: { type: Boolean, default: false }, | ||
| 34 | }, | ||
| 35 | data () { | ||
| 36 | return { | ||
| 37 | treedata: [ | ||
| 38 | { | ||
| 39 | id: "djbfm", | ||
| 40 | tabs: "djbfm", | ||
| 41 | label: "登记簿封面", | ||
| 42 | children: [ | ||
| 43 | { | ||
| 44 | id: "zdxx", | ||
| 45 | tabs: "zdxx", | ||
| 46 | label: "宗地信息", | ||
| 47 | }, | ||
| 48 | { | ||
| 49 | id: "bdcqldjml", | ||
| 50 | tabs: "bdcqldjml", | ||
| 51 | label: "不动产权利登记目录", | ||
| 52 | children: [ | ||
| 53 | { | ||
| 54 | id: "bdcqljqtsx", | ||
| 55 | tabs: "bdcqljqtsx", | ||
| 56 | label: "不动产权利及其他事项", | ||
| 57 | children: [ | ||
| 58 | { | ||
| 59 | id: "gyjsydsyq", | ||
| 60 | tabs: "djxxTable", | ||
| 61 | label: "国有建设用地使用权(临:0,现:0,历:0)", | ||
| 62 | type: "JSYDSYQ", | ||
| 63 | }, | ||
| 64 | { | ||
| 65 | id: "dyaq", | ||
| 66 | tabs: "djxxTable", | ||
| 67 | label: "抵押权(临:0,现:0,历:0)", | ||
| 68 | type: "DYAQ", | ||
| 69 | }, | ||
| 70 | { | ||
| 71 | id: "dyiq", | ||
| 72 | tabs: "djxxTable", | ||
| 73 | label: "地役权(临:0,现:0,历:0)", | ||
| 74 | type: "DYIQ", | ||
| 75 | }, | ||
| 76 | { | ||
| 77 | id: "ygdj", | ||
| 78 | tabs: "djxxTable", | ||
| 79 | label: "预告登记(临:0,现:0,历:0)", | ||
| 80 | type: "YGDJ", | ||
| 81 | }, | ||
| 82 | { | ||
| 83 | id: "yydj", | ||
| 84 | tabs: "djxxTable", | ||
| 85 | label: "异议登记(临:0,现:0,历:0)", | ||
| 86 | type: "YYDJ", | ||
| 87 | }, | ||
| 88 | { | ||
| 89 | id: "cfdj", | ||
| 90 | tabs: "djxxTable", | ||
| 91 | label: "查封登记(临:0,现:0,历:0)", | ||
| 92 | type: "CFDJ", | ||
| 93 | }, | ||
| 94 | ], | ||
| 95 | }, | ||
| 96 | ], | ||
| 97 | }, | ||
| 98 | ], | ||
| 99 | }, | ||
| 100 | ], | ||
| 101 | defaultProps: { | ||
| 102 | children: "children", | ||
| 103 | label: "label", | ||
| 104 | }, | ||
| 105 | showTab: "djxxTable", // 选中状态,根据表格中权利类型判断 | ||
| 106 | showType: "JSYDSYQ", | ||
| 107 | }; | ||
| 108 | }, | ||
| 109 | computed: { | ||
| 110 | ...mapGetters(["djbxx"]), | ||
| 111 | }, | ||
| 112 | watch: { | ||
| 113 | djbxx: { | ||
| 114 | handler (newVlue) { | ||
| 115 | if (newVlue) { | ||
| 116 | var qszts = newVlue.detail.qszts; | ||
| 117 | let isZd = newVlue.djbfm.zd; | ||
| 118 | let arr = [ | ||
| 119 | "QSZT_JSYDSYQ", | ||
| 120 | "QSZT_DYAQ", | ||
| 121 | "QSZT_DYIQ", | ||
| 122 | "QSZT_YGDJ", | ||
| 123 | "QSZT_YYDJ", | ||
| 124 | "QSZT_CFDJ", | ||
| 125 | ]; | ||
| 126 | if (!isZd) { | ||
| 127 | // 判断是否是宗地 | ||
| 128 | arr[0] = "QSZT_FDCQ2"; | ||
| 129 | this.treedata[0].children[1].children[0].children[0].type = FDCQ2; | ||
| 130 | } | ||
| 131 | arr.forEach((item, index) => { | ||
| 132 | let label = | ||
| 133 | this.treedata[0].children[1].children[0].children[ | ||
| 134 | index | ||
| 135 | ].label.split(":")[0]; | ||
| 136 | this.treedata[0].children[1].children[0].children[index].label = | ||
| 137 | label + ":" + | ||
| 138 | (qszts[item][0] || 0) + | ||
| 139 | ",现:" + | ||
| 140 | (qszts[item][1] || 0) + | ||
| 141 | ",历:" + | ||
| 142 | (qszts[item][2] || 0) + | ||
| 143 | ")"; | ||
| 144 | }); | ||
| 145 | } | ||
| 146 | } | ||
| 147 | }, | ||
| 148 | }, | ||
| 149 | methods: { | ||
| 150 | closeDialog () { | ||
| 151 | this.$emit("input", false); | ||
| 152 | // 关闭时清空值 | ||
| 153 | this.$store.dispatch("djbxx/setDjbxx", null); | ||
| 154 | }, | ||
| 155 | handleNodeClick (data, node, elem) { | ||
| 156 | this.showTab = data.tabs; | ||
| 157 | this.showType = data.type ? data.type : ""; | ||
| 158 | }, | ||
| 159 | }, | ||
| 160 | }; | ||
| 161 | </script> | ||
| 162 | <style scoped lang="scss"> | ||
| 163 | .content { | ||
| 164 | width: 100%; | ||
| 165 | height: 100%; | ||
| 166 | display: flex; | ||
| 167 | |||
| 168 | .left { | ||
| 169 | width: 256px; | ||
| 170 | height: 704px; | ||
| 171 | background-color: #f5f5f5; | ||
| 172 | color: #333; | ||
| 173 | border: 1px solid rgb(228, 228, 228); | ||
| 174 | } | ||
| 175 | |||
| 176 | .right { | ||
| 177 | width: calc(100% - 256px); | ||
| 178 | height: 704px; | ||
| 179 | // overflow-y: scroll; | ||
| 180 | overflow: auto; | ||
| 181 | background-color: #f5f5f5; | ||
| 182 | } | ||
| 183 | } | ||
| 184 | |||
| 185 | /deep/ .expanded.el-tree-node__expand-icon, | ||
| 186 | /deep/ .el-tree-node__expand-icon { | ||
| 187 | visibility: hidden; | ||
| 188 | } | ||
| 189 | |||
| 190 | /deep/ .el-tree-node__content { | ||
| 191 | border: 1px solid rgb(228, 228, 228); | ||
| 192 | height: 45px; | ||
| 193 | } | ||
| 194 | |||
| 195 | /deep/ .el-tree-node:focus>.el-tree-node__content { | ||
| 196 | background-color: #f5f5f5; | ||
| 197 | color: #0079fe; | ||
| 198 | border-right: 4px solid #0079fe; | ||
| 199 | } | ||
| 200 | |||
| 201 | /deep/.el-tree-node { | ||
| 202 | white-space: pre-wrap; | ||
| 203 | } | ||
| 204 | |||
| 205 | /deep/ .is-current>.el-tree-node__content { | ||
| 206 | background-color: #f5f5f5; | ||
| 207 | color: #0079fe; | ||
| 208 | border-right: 4px solid #0079fe; | ||
| 209 | } | ||
| 210 | </style> |
This diff is collapsed.
Click to expand it.
| 1 | <template> | ||
| 2 | <div class="djxxTable"> | ||
| 3 | <div class="tableBox"> | ||
| 4 | <div class="title"> | ||
| 5 | {{ title }} | ||
| 6 | <div class="checkbox"> | ||
| 7 | <el-checkbox-group v-model="checkList" @change="checkChange"> | ||
| 8 | <el-checkbox label="临时"></el-checkbox> | ||
| 9 | <el-checkbox label="现势"></el-checkbox> | ||
| 10 | <el-checkbox label="历史"></el-checkbox> | ||
| 11 | </el-checkbox-group> | ||
| 12 | </div> | ||
| 13 | </div> | ||
| 14 | <div class="xxTableBox" v-if="showTableData.length"> | ||
| 15 | <table class="xxTable" :width="tableWidth"> | ||
| 16 | <tr> | ||
| 17 | <th rowspan="3">业务类型</th> | ||
| 18 | </tr> | ||
| 19 | <!-- 第一行表头 --> | ||
| 20 | <tr class="one"> | ||
| 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> | ||
| 23 | {{ item.type }} | ||
| 24 | </th> | ||
| 25 | </tr> | ||
| 26 | <!-- 第二行表头 --> | ||
| 27 | <tr class="two"> | ||
| 28 | <th v-for="(item, index) in ths" :key="index" :class="item.class"> | ||
| 29 | <p>{{ item.qllxmc }}</p> | ||
| 30 | <p>{{ item.djlxmc }}</p> | ||
| 31 | </th> | ||
| 32 | </tr> | ||
| 33 | <!-- 数据 --> | ||
| 34 | <tr v-for="(item, index) in columns" :key="index"> | ||
| 35 | <td> | ||
| 36 | {{ item.label }} | ||
| 37 | </td> | ||
| 38 | <td v-for="(item1, index1) in showTableData" :key="index1" :class="[ | ||
| 39 | item1.qszt == '2' ? 'lishi' : '', | ||
| 40 | item1.qszt == '0' ? 'linshi' : '', | ||
| 41 | ]"> | ||
| 42 | {{ item1[item.prop] }} | ||
| 43 | </td> | ||
| 44 | </tr> | ||
| 45 | </table> | ||
| 46 | </div> | ||
| 47 | </div> | ||
| 48 | </div> | ||
| 49 | </template> | ||
| 50 | |||
| 51 | <script> | ||
| 52 | import { mapGetters } from "vuex"; | ||
| 53 | import { datas } from "./djxxColumns"; | ||
| 54 | import { getJsydsyqList } from "@/api/zhcx.js"; | ||
| 55 | export default { | ||
| 56 | name: "djxxTable", | ||
| 57 | props: { | ||
| 58 | showType: "", | ||
| 59 | }, | ||
| 60 | data () { | ||
| 61 | return { | ||
| 62 | checkList: ["临时", "现势", "历史"], | ||
| 63 | tableWidth: 810, | ||
| 64 | type: datas.columns(), | ||
| 65 | tableData: [], | ||
| 66 | showTableData: [], | ||
| 67 | ths: [], | ||
| 68 | showThs: [], | ||
| 69 | columns: [], | ||
| 70 | title: "", | ||
| 71 | }; | ||
| 72 | }, | ||
| 73 | computed: { | ||
| 74 | ...mapGetters(["djbxx"]), | ||
| 75 | }, | ||
| 76 | watch: { | ||
| 77 | showType: { | ||
| 78 | async handler (newVlue) { | ||
| 79 | // 清空值 | ||
| 80 | this.tableData = []; | ||
| 81 | this.ths = []; | ||
| 82 | this.columns = this.type[newVlue].columns; | ||
| 83 | this.title = this.type[newVlue].title; | ||
| 84 | this.checkList = ["临时", "现势", "历史"]; | ||
| 85 | this.tableWidth = 810; | ||
| 86 | let detail; | ||
| 87 | if (newVlue === "JSYDSYQ") { | ||
| 88 | let res = await getJsydsyqList({ | ||
| 89 | bdcdyid: "2b33851f4edfd468ceef4d68c370bd41", | ||
| 90 | qllx: "A03", | ||
| 91 | qszt: ["1"] | ||
| 92 | }) | ||
| 93 | detail = res.result; | ||
| 94 | } else { | ||
| 95 | detail = this.djbxx.detail.qlxxs[newVlue]; | ||
| 96 | } | ||
| 97 | console.log(detail, 'detail'); | ||
| 98 | detail.length > 0 && detail.forEach((item) => { | ||
| 99 | this.tableData.push(item); | ||
| 100 | if (item.qszt == "0") { | ||
| 101 | this.ths.push({ | ||
| 102 | type: "临时", | ||
| 103 | qllxmc: item.qllxmc, | ||
| 104 | djlxmc: item.djlxmc, | ||
| 105 | prop: "linshi", | ||
| 106 | class: "linshi", | ||
| 107 | }); | ||
| 108 | } else if (item.qszt == "1") { | ||
| 109 | this.ths.push({ | ||
| 110 | type: "现势", | ||
| 111 | qllxmc: item.qllxmc, | ||
| 112 | djlxmc: item.djlxmc, | ||
| 113 | prop: "xianshi", | ||
| 114 | class: "xianshi", | ||
| 115 | }); | ||
| 116 | } else if (item.qszt == "2") { | ||
| 117 | this.ths.push({ | ||
| 118 | type: "历史", | ||
| 119 | qllxmc: item.qllxmc, | ||
| 120 | djlxmc: item.djlxmc, | ||
| 121 | prop: "lishi", | ||
| 122 | class: "lishi", | ||
| 123 | }); | ||
| 124 | } | ||
| 125 | }); | ||
| 126 | this.showTableData = this.tableData; | ||
| 127 | this.showThs = this.ths; | ||
| 128 | let width = (this.tableData.length - 3) * 223 + this.tableWidth; | ||
| 129 | this.tableWidth = this.tableData.length > 3 ? width : 810; | ||
| 130 | }, | ||
| 131 | deep: true | ||
| 132 | }, | ||
| 133 | }, | ||
| 134 | methods: { | ||
| 135 | checkChange () { | ||
| 136 | var checkKey = []; | ||
| 137 | this.ths = []; | ||
| 138 | this.tableWidth = 810; | ||
| 139 | this.checkList.forEach((item) => { | ||
| 140 | if (item == "临时") { | ||
| 141 | checkKey.push("0"); | ||
| 142 | } | ||
| 143 | if (item == "现势") { | ||
| 144 | checkKey.push("1"); | ||
| 145 | } | ||
| 146 | if (item == "历史") { | ||
| 147 | checkKey.push("2"); | ||
| 148 | } | ||
| 149 | }); | ||
| 150 | this.showTableData = this.tableData.filter((item) => | ||
| 151 | checkKey.includes(item.qszt) | ||
| 152 | ); | ||
| 153 | this.showTableData.forEach((item) => { | ||
| 154 | if (item.qszt == "0") { | ||
| 155 | this.ths.push({ | ||
| 156 | type: "临时", | ||
| 157 | qllxmc: item.qllxmc, | ||
| 158 | djlxmc: item.djlxmc, | ||
| 159 | prop: "linshi", | ||
| 160 | class: "linshi", | ||
| 161 | }); | ||
| 162 | } else if (item.qszt == "1") { | ||
| 163 | this.ths.push({ | ||
| 164 | type: "现势", | ||
| 165 | qllxmc: item.qllxmc, | ||
| 166 | djlxmc: item.djlxmc, | ||
| 167 | prop: "xianshi", | ||
| 168 | class: "xianshi", | ||
| 169 | }); | ||
| 170 | } else if (item.qszt == "2") { | ||
| 171 | this.ths.push({ | ||
| 172 | type: "历史", | ||
| 173 | qllxmc: item.qllxmc, | ||
| 174 | djlxmc: item.djlxmc, | ||
| 175 | prop: "lishi", | ||
| 176 | class: "lishi", | ||
| 177 | }); | ||
| 178 | } | ||
| 179 | }); | ||
| 180 | let width = (this.showTableData.length - 3) * 223 + this.tableWidth; | ||
| 181 | this.tableWidth = this.showTableData.length > 3 ? width : 810; | ||
| 182 | }, | ||
| 183 | }, | ||
| 184 | }; | ||
| 185 | </script> | ||
| 186 | |||
| 187 | <style lang="scss" scoped> | ||
| 188 | .djxxTable { | ||
| 189 | width: 100%; | ||
| 190 | height: 100%; | ||
| 191 | background: #fff; | ||
| 192 | overflow-y: scroll; | ||
| 193 | color: #333; | ||
| 194 | |||
| 195 | .tableBox { | ||
| 196 | width: 810px; | ||
| 197 | margin: 0 auto; | ||
| 198 | display: flex; | ||
| 199 | flex-wrap: wrap; | ||
| 200 | |||
| 201 | .title { | ||
| 202 | width: 100%; | ||
| 203 | font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif; | ||
| 204 | font-weight: 700; | ||
| 205 | font-size: 16px; | ||
| 206 | text-align: center; | ||
| 207 | background: #e9e9e9; | ||
| 208 | height: 62px; | ||
| 209 | line-height: 62px; | ||
| 210 | position: relative; | ||
| 211 | margin: 1px 0; | ||
| 212 | |||
| 213 | .checkbox { | ||
| 214 | position: absolute; | ||
| 215 | right: 20px; | ||
| 216 | bottom: -16px; | ||
| 217 | height: 62px; | ||
| 218 | } | ||
| 219 | } | ||
| 220 | |||
| 221 | .xxTableBox { | ||
| 222 | min-width: 810px; | ||
| 223 | width: 100%; | ||
| 224 | overflow-x: scroll; | ||
| 225 | } | ||
| 226 | |||
| 227 | // .xxTable > tr th:not(:first-child) { | ||
| 228 | // width: 223px; | ||
| 229 | // } | ||
| 230 | .xxTable>tr:first-child th { | ||
| 231 | width: 140px; | ||
| 232 | } | ||
| 233 | |||
| 234 | .xxTable { | ||
| 235 | border-spacing: 1px; | ||
| 236 | |||
| 237 | tr>th { | ||
| 238 | background: #464c5b; | ||
| 239 | color: #fff; | ||
| 240 | font-size: 16px; | ||
| 241 | } | ||
| 242 | |||
| 243 | th.linshi, | ||
| 244 | th.xianshi { | ||
| 245 | background: #464c5b; | ||
| 246 | } | ||
| 247 | |||
| 248 | th.lishi { | ||
| 249 | background: rgba(70, 76, 91, 0.8); | ||
| 250 | } | ||
| 251 | |||
| 252 | .one th { | ||
| 253 | height: 25px; | ||
| 254 | font-size: 14px; | ||
| 255 | } | ||
| 256 | |||
| 257 | th.linshi { | ||
| 258 | color: #fe9400; | ||
| 259 | } | ||
| 260 | |||
| 261 | .two th { | ||
| 262 | height: 45px; | ||
| 263 | |||
| 264 | p:nth-child(2) { | ||
| 265 | font-size: 14px; | ||
| 266 | } | ||
| 267 | } | ||
| 268 | |||
| 269 | .linshiIcon { | ||
| 270 | position: relative; | ||
| 271 | } | ||
| 272 | |||
| 273 | .linshiIcon::after { | ||
| 274 | content: ""; | ||
| 275 | display: block; | ||
| 276 | width: 0; | ||
| 277 | height: 0; | ||
| 278 | border-width: 0px 0px 45px 45px; | ||
| 279 | border-style: none solid solid; | ||
| 280 | border-color: transparent transparent #fe9400; | ||
| 281 | position: absolute; | ||
| 282 | top: 0px; | ||
| 283 | right: 3px; | ||
| 284 | transform: rotate(-90deg); | ||
| 285 | } | ||
| 286 | |||
| 287 | .icon { | ||
| 288 | position: absolute; | ||
| 289 | top: 8px; | ||
| 290 | right: 6px; | ||
| 291 | transform: rotate(45deg); | ||
| 292 | color: #fff; | ||
| 293 | font-size: 12px; | ||
| 294 | z-index: 10; | ||
| 295 | } | ||
| 296 | |||
| 297 | tr td { | ||
| 298 | text-align: center; | ||
| 299 | height: 40px; | ||
| 300 | padding: 4px; | ||
| 301 | font-size: 13px; | ||
| 302 | width: 140px; | ||
| 303 | } | ||
| 304 | |||
| 305 | >tr:nth-child(odd) td { | ||
| 306 | background: #f2f2f2; | ||
| 307 | } | ||
| 308 | |||
| 309 | >tr:nth-child(even) td { | ||
| 310 | background: #f9f9f9; | ||
| 311 | } | ||
| 312 | |||
| 313 | td.linshi { | ||
| 314 | color: #fe9400; | ||
| 315 | } | ||
| 316 | |||
| 317 | tr>td.lishi { | ||
| 318 | color: #7f7f7f; | ||
| 319 | } | ||
| 320 | } | ||
| 321 | } | ||
| 322 | } | ||
| 323 | </style> |
| 1 | import filter from '@/utils/filter.js' | ||
| 2 | |||
| 3 | class data extends filter { | ||
| 4 | constructor() { | ||
| 5 | super() | ||
| 6 | } | ||
| 7 | columns () { | ||
| 8 | return [ | ||
| 9 | { | ||
| 10 | prop: "qszt", | ||
| 11 | label: "权属状态", | ||
| 12 | }, | ||
| 13 | { | ||
| 14 | prop: "qllxmc", | ||
| 15 | label: "权利类型", | ||
| 16 | }, | ||
| 17 | { | ||
| 18 | prop: "djlxmc", | ||
| 19 | label: "登记类型", | ||
| 20 | }, | ||
| 21 | { | ||
| 22 | prop: "ssywh", | ||
| 23 | label: "上手业务号", | ||
| 24 | }, | ||
| 25 | { | ||
| 26 | prop: "dah", | ||
| 27 | label: "档案号", | ||
| 28 | }, | ||
| 29 | { | ||
| 30 | prop: "ywh", | ||
| 31 | label: "业务号", | ||
| 32 | }, | ||
| 33 | { | ||
| 34 | prop: "bdcdyh", | ||
| 35 | label: "不动产单元号", | ||
| 36 | }, | ||
| 37 | { | ||
| 38 | prop: "zl", | ||
| 39 | label: "坐落", | ||
| 40 | }, | ||
| 41 | { | ||
| 42 | prop: "qlrlx", | ||
| 43 | label: "权利人类型", | ||
| 44 | }, | ||
| 45 | { | ||
| 46 | prop: "qlrmc", | ||
| 47 | label: "权利人", | ||
| 48 | }, | ||
| 49 | { | ||
| 50 | prop: "qlrzjzl", | ||
| 51 | label: "证件种类", | ||
| 52 | }, | ||
| 53 | { | ||
| 54 | prop: "qlrzjhm", | ||
| 55 | label: "证件号", | ||
| 56 | }, | ||
| 57 | { | ||
| 58 | prop: "gyfs", | ||
| 59 | label: "共有情况", | ||
| 60 | }, | ||
| 61 | { | ||
| 62 | prop: "mj", | ||
| 63 | label: "使用权面积(m²)", | ||
| 64 | }, | ||
| 65 | { | ||
| 66 | prop: "qlxz", | ||
| 67 | label: "权利性质", | ||
| 68 | }, | ||
| 69 | { | ||
| 70 | prop: "ytmc", | ||
| 71 | label: "土地用途", | ||
| 72 | }, | ||
| 73 | { | ||
| 74 | prop: "syqqzsj", | ||
| 75 | label: "使用权起止时间", | ||
| 76 | }, | ||
| 77 | { | ||
| 78 | prop: "tdsyqx", | ||
| 79 | label: "土地使用期限", | ||
| 80 | }, | ||
| 81 | { | ||
| 82 | prop: "qdjg", | ||
| 83 | label: "取得价格(万元)", | ||
| 84 | }, | ||
| 85 | { | ||
| 86 | prop: "djyy", | ||
| 87 | label: "登记原因", | ||
| 88 | }, | ||
| 89 | { | ||
| 90 | prop: "bdcqzh", | ||
| 91 | label: "不动产权证号", | ||
| 92 | }, | ||
| 93 | { | ||
| 94 | prop: "djsj", | ||
| 95 | label: "登记时间", | ||
| 96 | }, | ||
| 97 | { | ||
| 98 | prop: "dbr", | ||
| 99 | label: "登簿人", | ||
| 100 | }, | ||
| 101 | { | ||
| 102 | prop: "fj", | ||
| 103 | label: "附记", | ||
| 104 | }, | ||
| 105 | ] | ||
| 106 | } | ||
| 107 | } | ||
| 108 | |||
| 109 | let datas = new data() | ||
| 110 | |||
| 111 | export { | ||
| 112 | datas | ||
| 113 | } | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| 1 | <template> | ||
| 2 | <div class="djxxTable"> | ||
| 3 | <div class="tableBox"> | ||
| 4 | <div class="title"> | ||
| 5 | {{ title }} | ||
| 6 | <div class="checkbox"> | ||
| 7 | <el-checkbox-group v-model="checkList" @change="checkChange"> | ||
| 8 | <el-checkbox v-for="item in qsztList" :key="item.value" :label="item.value">{{ item.label }}</el-checkbox> | ||
| 9 | </el-checkbox-group> | ||
| 10 | </div> | ||
| 11 | </div> | ||
| 12 | <div class="xxTableBox"> | ||
| 13 | <table class="xxTable"> | ||
| 14 | <tr v-for="(item, colindex) in columns" :key="colindex"> | ||
| 15 | <td> | ||
| 16 | {{ item.label }} | ||
| 17 | </td> | ||
| 18 | <td v-for="(row, index) in tableData" :key="index" :class="[ | ||
| 19 | row.qszt == '2' ? 'lishi' : '', | ||
| 20 | row.qszt == '0' ? 'linshi' : '', | ||
| 21 | item.prop == 'qszt' && row.qszt == '0' ? 'linshiIcon' : '', | ||
| 22 | ]"> | ||
| 23 | <div class="icon" v-if="item.prop == 'qszt' && row.qszt == '0'"> | ||
| 24 | 正在办理 | ||
| 25 | </div> | ||
| 26 | <span v-if="item.prop == 'qszt'"> | ||
| 27 | {{ getQsztName(row[item.prop]) }} | ||
| 28 | </span> | ||
| 29 | |||
| 30 | <span v-else> {{ row[item.prop] }}</span> | ||
| 31 | </td> | ||
| 32 | <td v-for="count in emptycolNum" :key="~count"></td> | ||
| 33 | </tr> | ||
| 34 | </table> | ||
| 35 | </div> | ||
| 36 | </div> | ||
| 37 | </div> | ||
| 38 | </template> | ||
| 39 | |||
| 40 | <script> | ||
| 41 | import { datas } from "./jsydsyq.js"; | ||
| 42 | import { getJsydsyqList } from "@/api/zhcx.js"; | ||
| 43 | export default { | ||
| 44 | data () { | ||
| 45 | return { | ||
| 46 | qsztList: [ | ||
| 47 | { | ||
| 48 | value: "0", | ||
| 49 | label: "临时", | ||
| 50 | }, | ||
| 51 | { | ||
| 52 | value: "1", | ||
| 53 | label: "现势", | ||
| 54 | }, | ||
| 55 | { | ||
| 56 | value: "2", | ||
| 57 | label: "历史", | ||
| 58 | }, | ||
| 59 | ], | ||
| 60 | checkList: ["0", "1", "2"], | ||
| 61 | //传递参数 | ||
| 62 | propsParam: {}, | ||
| 63 | //列表数据 | ||
| 64 | tableData: [], | ||
| 65 | //空列值个数 | ||
| 66 | emptycolNum: 0, | ||
| 67 | //列名称对象 | ||
| 68 | columns: [], | ||
| 69 | title: "建设用地使用权、宅基地使用权登记信息", | ||
| 70 | }; | ||
| 71 | }, | ||
| 72 | created () { | ||
| 73 | this.propsParam = this.$attrs; | ||
| 74 | console.log(this.$attrs, 'this.$attrs;'); | ||
| 75 | this.columns = datas.columns(); | ||
| 76 | this.loadData(); | ||
| 77 | // this.$alert(datas.columns()); | ||
| 78 | }, | ||
| 79 | methods: { | ||
| 80 | loadData () { | ||
| 81 | //this.$alert(this.propsParam.bdcdyh); | ||
| 82 | getJsydsyqList({ | ||
| 83 | bdcdyid: this.propsParam.bdcdyid, | ||
| 84 | qllx: this.propsParam.qllx, | ||
| 85 | qszt: this.checkList, | ||
| 86 | }).then((res) => { | ||
| 87 | if (res.code === 200) { | ||
| 88 | this.tableData = res.result; | ||
| 89 | this.emptycolNum = 3 - this.tableData.length; | ||
| 90 | } | ||
| 91 | }); | ||
| 92 | }, | ||
| 93 | checkChange () { | ||
| 94 | this.loadData(); | ||
| 95 | }, | ||
| 96 | getQsztName (code) { | ||
| 97 | let name = ""; | ||
| 98 | for (let item of this.qsztList) { | ||
| 99 | if (item.value == code) { | ||
| 100 | name = item.label; | ||
| 101 | break; | ||
| 102 | } | ||
| 103 | } | ||
| 104 | return name; | ||
| 105 | }, | ||
| 106 | }, | ||
| 107 | }; | ||
| 108 | </script> | ||
| 109 | |||
| 110 | <style lang="scss" scoped> | ||
| 111 | @import "./qlxxCommon.scss"; | ||
| 112 | </style> |
| 1 | .djxxTable { | ||
| 2 | width: 100%; | ||
| 3 | height: 100%; | ||
| 4 | background: #fff; | ||
| 5 | overflow-y: scroll; | ||
| 6 | color: #333; | ||
| 7 | |||
| 8 | .tableBox { | ||
| 9 | margin: 0 auto; | ||
| 10 | display: flex; | ||
| 11 | flex-wrap: wrap; | ||
| 12 | |||
| 13 | .title { | ||
| 14 | width: 100%; | ||
| 15 | font-weight: 700; | ||
| 16 | font-size: 16px; | ||
| 17 | text-align: center; | ||
| 18 | background: #e9e9e9; | ||
| 19 | height: 62px; | ||
| 20 | line-height: 62px; | ||
| 21 | position: relative; | ||
| 22 | margin: 1px 0; | ||
| 23 | |||
| 24 | .checkbox { | ||
| 25 | position: absolute; | ||
| 26 | right: 20px; | ||
| 27 | bottom: -16px; | ||
| 28 | height: 62px; | ||
| 29 | } | ||
| 30 | } | ||
| 31 | |||
| 32 | .xxTableBox { | ||
| 33 | overflow-x: scroll; | ||
| 34 | width: 100%; | ||
| 35 | padding-bottom: 35px; | ||
| 36 | } | ||
| 37 | |||
| 38 | .xxTable>tr:first-child th { | ||
| 39 | width: 140px; | ||
| 40 | } | ||
| 41 | |||
| 42 | .xxTable { | ||
| 43 | border-spacing: 1px; | ||
| 44 | width: 100%; | ||
| 45 | |||
| 46 | tr>th { | ||
| 47 | border: 1px solid #ccc; | ||
| 48 | background: #F2F2F2; | ||
| 49 | color: #333333; | ||
| 50 | font-size: 16px; | ||
| 51 | height: 40px; | ||
| 52 | } | ||
| 53 | |||
| 54 | th.linshi, | ||
| 55 | th.xianshi { | ||
| 56 | background: #464c5b; | ||
| 57 | } | ||
| 58 | |||
| 59 | th.lishi { | ||
| 60 | background: rgba(70, 76, 91, 0.8); | ||
| 61 | } | ||
| 62 | |||
| 63 | .one th { | ||
| 64 | height: 25px; | ||
| 65 | font-size: 14px; | ||
| 66 | } | ||
| 67 | |||
| 68 | th.linshi { | ||
| 69 | color: #fe9400; | ||
| 70 | } | ||
| 71 | |||
| 72 | .two th { | ||
| 73 | height: 45px; | ||
| 74 | |||
| 75 | p:nth-child(2) { | ||
| 76 | font-size: 14px; | ||
| 77 | } | ||
| 78 | } | ||
| 79 | |||
| 80 | .linshiIcon { | ||
| 81 | position: relative; | ||
| 82 | } | ||
| 83 | |||
| 84 | .linshiIcon::after { | ||
| 85 | content: ""; | ||
| 86 | display: block; | ||
| 87 | width: 0; | ||
| 88 | height: 0; | ||
| 89 | border-width: 0px 0px 55px 55px; | ||
| 90 | border-style: none solid solid; | ||
| 91 | border-color: transparent transparent #fe9400; | ||
| 92 | position: absolute; | ||
| 93 | top: 0; | ||
| 94 | right: 0; | ||
| 95 | transform: rotate(-90deg); | ||
| 96 | } | ||
| 97 | |||
| 98 | .icon { | ||
| 99 | position: absolute; | ||
| 100 | top: 13px; | ||
| 101 | right: -4px; | ||
| 102 | transform: rotate(45deg); | ||
| 103 | color: #fff; | ||
| 104 | font-size: 12px; | ||
| 105 | z-index: 10; | ||
| 106 | } | ||
| 107 | |||
| 108 | tr td { | ||
| 109 | border: 1px solid #ccc; | ||
| 110 | text-align: center; | ||
| 111 | height: 40px; | ||
| 112 | padding: 4px; | ||
| 113 | font-size: 13px; | ||
| 114 | width: 140px; | ||
| 115 | } | ||
| 116 | |||
| 117 | >tr:nth-child(odd) td { | ||
| 118 | background: #f2f2f2; | ||
| 119 | } | ||
| 120 | |||
| 121 | >tr:nth-child(even) td { | ||
| 122 | background: #f9f9f9; | ||
| 123 | } | ||
| 124 | |||
| 125 | td.linshi { | ||
| 126 | color: #fe9400; | ||
| 127 | } | ||
| 128 | |||
| 129 | tr>td.lishi { | ||
| 130 | color: #7f7f7f; | ||
| 131 | } | ||
| 132 | } | ||
| 133 | } | ||
| 134 | } | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| 1 | <template> | ||
| 2 | <div class="zdxx"> | ||
| 3 | <div class="tablebox"> | ||
| 4 | <table cellpadding="0" cellspacing="0" class="zdxxTable"> | ||
| 5 | <col width="80" /> | ||
| 6 | <col width="60" /> | ||
| 7 | <col width="90" /> | ||
| 8 | <col width="235" /> | ||
| 9 | <col width="150" /> | ||
| 10 | <tr> | ||
| 11 | <td colspan="6" class="title">宗地基本信息</td> | ||
| 12 | </tr> | ||
| 13 | <tr> | ||
| 14 | <td colspan="6" class="unit" v-if="zdjbxx.mjdw == '1'"> | ||
| 15 | 单位:■平方米 □公顷(□亩)、万元 | ||
| 16 | </td> | ||
| 17 | <td colspan="6" class="unit" v-else> | ||
| 18 | 单位:□平方米 ■公顷(■亩)、万元 | ||
| 19 | </td> | ||
| 20 | </tr> | ||
| 21 | <tr> | ||
| 22 | <td colspan="2">不动产类型</td> | ||
| 23 | <td colspan="4">■土地 ■房屋建筑 □构筑物 □森林、林地 □其他</td> | ||
| 24 | </tr> | ||
| 25 | <tr> | ||
| 26 | <td colspan="2">坐落</td> | ||
| 27 | <td colspan="4">{{ zdjbxx.zl }}</td> | ||
| 28 | </tr> | ||
| 29 | <tr> | ||
| 30 | <td rowspan="8" class="title2">土地状况</td> | ||
| 31 | </tr> | ||
| 32 | <tr> | ||
| 33 | <td colspan="2">宗地面积</td> | ||
| 34 | <td>{{ zdjbxx.zdmj }}</td> | ||
| 35 | <td>用途</td> | ||
| 36 | <td>{{ zdjbxx.ghytmc }}</td> | ||
| 37 | </tr> | ||
| 38 | <tr> | ||
| 39 | <td colspan="2">等级</td> | ||
| 40 | <td>{{ zdjbxx.dj }}</td> | ||
| 41 | <td>价格</td> | ||
| 42 | <td>{{ zdjbxx.jg }}</td> | ||
| 43 | </tr> | ||
| 44 | <tr> | ||
| 45 | <td colspan="2">权利类型</td> | ||
| 46 | <td>{{ zdjbxx.qllx }}</td> | ||
| 47 | <td>权利性质</td> | ||
| 48 | <td>{{ zdjbxx.qlxz }}</td> | ||
| 49 | </tr> | ||
| 50 | <tr> | ||
| 51 | <td colspan="2">权利设定方式</td> | ||
| 52 | <td>{{ zdjbxx.qlsdfs }}</td> | ||
| 53 | <td>容积率</td> | ||
| 54 | <td>{{ zdjbxx.rjl }}</td> | ||
| 55 | </tr> | ||
| 56 | <tr> | ||
| 57 | <td colspan="2">建筑密度</td> | ||
| 58 | <td>{{ zdjbxx.jzmd }}</td> | ||
| 59 | <td>建筑限高</td> | ||
| 60 | <td>{{ zdjbxx.jzxg }}</td> | ||
| 61 | </tr> | ||
| 62 | <tr> | ||
| 63 | <td colspan="2">图幅号</td> | ||
| 64 | <td>{{ zdjbxx.tfh }}</td> | ||
| 65 | <td>地籍号</td> | ||
| 66 | <td>{{ zdjbxx.djh }}</td> | ||
| 67 | </tr> | ||
| 68 | <tr> | ||
| 69 | <td colspan="2">档案号</td> | ||
| 70 | <td>{{ zdjbxx.dah }}</td> | ||
| 71 | <td>地块代码</td> | ||
| 72 | <td>{{ zdjbxx.dkdm }}</td> | ||
| 73 | </tr> | ||
| 74 | <tr> | ||
| 75 | <td colspan="2">宗地四至-东</td> | ||
| 76 | <td colspan="4">{{ zdjbxx.zdszd }}</td> | ||
| 77 | </tr> | ||
| 78 | <tr> | ||
| 79 | <td colspan="2">宗地四至-南</td> | ||
| 80 | <td colspan="4">{{ zdjbxx.zdszn }}</td> | ||
| 81 | </tr> | ||
| 82 | <tr> | ||
| 83 | <td colspan="2">宗地四至-西</td> | ||
| 84 | <td colspan="4">{{ zdjbxx.zdszx }}</td> | ||
| 85 | </tr> | ||
| 86 | <tr> | ||
| 87 | <td colspan="2">宗地四至-北</td> | ||
| 88 | <td colspan="4">{{ zdjbxx.zdszb }}</td> | ||
| 89 | </tr> | ||
| 90 | <tr> | ||
| 91 | <td class="title2" height="96">备注</td> | ||
| 92 | <td colspan="5">{{ zdjbxx.bz }}</td> | ||
| 93 | </tr> | ||
| 94 | <tr> | ||
| 95 | <td class="title2" height="96">附记</td> | ||
| 96 | <td colspan="5">{{ zdjbxx.fj }}</td> | ||
| 97 | </tr> | ||
| 98 | <tr> | ||
| 99 | <td colspan="2">状态</td> | ||
| 100 | <td colspan="2">{{ zdjbxx.zt }}</td> | ||
| 101 | <td>区县代码</td> | ||
| 102 | <td>{{ zdjbxx.qxdm }}</td> | ||
| 103 | </tr> | ||
| 104 | <tr v-show="showGroup"> | ||
| 105 | <td class="title2">变化情况</td> | ||
| 106 | <td colspan="5" class="bhqk"> | ||
| 107 | <div class="box"> | ||
| 108 | <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth"> | ||
| 109 | <tr v-for="(item, index) in bhqkColumns" :key="index"> | ||
| 110 | <td class="bhqkTh">{{ item.label }}</td> | ||
| 111 | <!-- <td v-for="(item2, index2) in zdbhqks" :key="index2"> | ||
| 112 | {{ item2[item.prop] }} | ||
| 113 | </td> --> | ||
| 114 | </tr> | ||
| 115 | </table> | ||
| 116 | </div> | ||
| 117 | </td> | ||
| 118 | </tr> | ||
| 119 | </table> | ||
| 120 | </div> | ||
| 121 | </div> | ||
| 122 | </template> | ||
| 123 | |||
| 124 | <script> | ||
| 125 | import { mapGetters } from "vuex"; | ||
| 126 | import { getZdjjxxBySLdy } from "@/api/zhcx.js"; | ||
| 127 | |||
| 128 | export default { | ||
| 129 | name: "zdxx", | ||
| 130 | data () { | ||
| 131 | return { | ||
| 132 | bhqkColumns: [ | ||
| 133 | { | ||
| 134 | prop: "ssywh", | ||
| 135 | label: "上手业务号", | ||
| 136 | }, | ||
| 137 | { | ||
| 138 | prop: "zddm", | ||
| 139 | label: "宗地代码", | ||
| 140 | }, | ||
| 141 | { | ||
| 142 | prop: "bhqzddm", | ||
| 143 | label: "变化前宗地代码", | ||
| 144 | }, | ||
| 145 | { | ||
| 146 | prop: "bhnr", | ||
| 147 | label: "变化内容", | ||
| 148 | }, | ||
| 149 | { | ||
| 150 | prop: "bhyy", | ||
| 151 | label: "变化原因", | ||
| 152 | }, | ||
| 153 | { | ||
| 154 | prop: "djsj", | ||
| 155 | label: "登记时间", | ||
| 156 | }, | ||
| 157 | { | ||
| 158 | prop: "dbr", | ||
| 159 | label: "登簿人", | ||
| 160 | }, | ||
| 161 | { | ||
| 162 | prop: "fj", | ||
| 163 | label: "附记", | ||
| 164 | }, | ||
| 165 | ], | ||
| 166 | bhqkTableWidth: 745, | ||
| 167 | zdjbxx: {}, | ||
| 168 | zdbhqks: [], | ||
| 169 | propsParam: {}, | ||
| 170 | showGroup: false, | ||
| 171 | }; | ||
| 172 | }, | ||
| 173 | // computed: { | ||
| 174 | // ...mapGetters(["djbxx"]), | ||
| 175 | // }, | ||
| 176 | created () { | ||
| 177 | this.propsParam = this.$attrs; | ||
| 178 | // this.$nextTick(() => { | ||
| 179 | |||
| 180 | // }); | ||
| 181 | this.loadData(); | ||
| 182 | //this.$alert(this.param.bdcdyh); | ||
| 183 | // this.info = this.djbxx.zdjbxx; | ||
| 184 | // this.djzd = this.djbxx.zdjbxx.djzd; | ||
| 185 | // this.zdbhqks = this.djbxx.zdjbxx.zdbhqks; | ||
| 186 | |||
| 187 | // let widths = (this.zdbhqks.length + 1) * 180 + 110; | ||
| 188 | // this.bhqkTableWidth = widths > 745 ? widths : 745; | ||
| 189 | }, | ||
| 190 | methods: { | ||
| 191 | loadData () { | ||
| 192 | getZdjjxxBySLdy({ bsmsldy: this.propsParam.bsmSldy }).then((res) => { | ||
| 193 | if (res.code === 200) { | ||
| 194 | this.zdjbxx = res.result.zdjbxx; | ||
| 195 | this.zdbhqks = res.result.zdbhqkList; | ||
| 196 | //this.$alert(this.zdjbxx); | ||
| 197 | if (this.zdbhqks != null && this.zdbhqks.length > 0) { | ||
| 198 | this.showGroup = true; | ||
| 199 | } | ||
| 200 | } | ||
| 201 | }); | ||
| 202 | }, | ||
| 203 | }, | ||
| 204 | }; | ||
| 205 | </script> | ||
| 206 | |||
| 207 | <style lang="scss" scoped> | ||
| 208 | .zdxx { | ||
| 209 | width: 100%; | ||
| 210 | height: calc(100% - 42px); | ||
| 211 | background-color: #f5f5f5; | ||
| 212 | padding: 5px; | ||
| 213 | |||
| 214 | .tablebox { | ||
| 215 | overflow-x: auto; | ||
| 216 | width: 100%; | ||
| 217 | height: 100%; | ||
| 218 | background: #fff; | ||
| 219 | border: 1px solid rgb(228, 228, 228); | ||
| 220 | text-align: center; | ||
| 221 | padding: 4px; | ||
| 222 | overflow-y: scroll; | ||
| 223 | |||
| 224 | .zdxxTable { | ||
| 225 | width: 100%; | ||
| 226 | min-width: 900px; | ||
| 227 | color: #333; | ||
| 228 | |||
| 229 | td { | ||
| 230 | border: 1px solid rgb(228, 228, 228); | ||
| 231 | line-height: 30px; | ||
| 232 | padding: 0 4px; | ||
| 233 | } | ||
| 234 | |||
| 235 | .title { | ||
| 236 | line-height: 68px; | ||
| 237 | font-size: 20px; | ||
| 238 | } | ||
| 239 | |||
| 240 | .unit { | ||
| 241 | text-align: right; | ||
| 242 | } | ||
| 243 | |||
| 244 | .title2 { | ||
| 245 | writing-mode: vertical-lr; | ||
| 246 | letter-spacing: 6px; | ||
| 247 | } | ||
| 248 | |||
| 249 | .bhqk { | ||
| 250 | padding: 0; | ||
| 251 | |||
| 252 | .box { | ||
| 253 | width: 745px; | ||
| 254 | overflow: auto; | ||
| 255 | } | ||
| 256 | |||
| 257 | .test {} | ||
| 258 | |||
| 259 | table { | ||
| 260 | .bhqkTh { | ||
| 261 | width: 110px; | ||
| 262 | line-height: 40px; | ||
| 263 | background-color: #f5f5f5; | ||
| 264 | border: 1px solid rgb(228, 228, 228); | ||
| 265 | font-weight: bold; | ||
| 266 | } | ||
| 267 | |||
| 268 | td { | ||
| 269 | width: 180px; | ||
| 270 | } | ||
| 271 | } | ||
| 272 | } | ||
| 273 | } | ||
| 274 | } | ||
| 275 | } | ||
| 276 | </style> |
| ... | @@ -52,18 +52,11 @@ | ... | @@ -52,18 +52,11 @@ |
| 52 | <script> | 52 | <script> |
| 53 | import table from "@/utils/mixin/table"; | 53 | import table from "@/utils/mixin/table"; |
| 54 | import { datas, sendThis } from "./djbcxdata"; | 54 | import { datas, sendThis } from "./djbcxdata"; |
| 55 | import djbxxDialog from "./components/djbxxDialog.vue"; | 55 | import { getDjbBysearch } from "@/api/zhcx.js"; |
| 56 | import { | ||
| 57 | getDjbBysearch, | ||
| 58 | } from "@/api/zhcx.js"; | ||
| 59 | import { mapGetters } from "vuex"; | 56 | import { mapGetters } from "vuex"; |
| 60 | import axios from "axios"; | ||
| 61 | 57 | ||
| 62 | export default { | 58 | export default { |
| 63 | name: "djbcx", | 59 | name: "djbcx", |
| 64 | components: { | ||
| 65 | djbxxDialog, | ||
| 66 | }, | ||
| 67 | mixins: [table], | 60 | mixins: [table], |
| 68 | mounted () { | 61 | mounted () { |
| 69 | sendThis(this); | 62 | sendThis(this); | ... | ... |
-
Please register or sign in to post a comment