Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcdj-web
Showing
5 changed files
with
121 additions
and
13 deletions
| 1 | <template> | 1 | <template> |
| 2 | <div class='clxx'> | 2 | <div class="clxx"> |
| 3 | clxxclxxclxxclxxclxxclxx | 3 | <div class="clxx-box"> |
| 4 | <div class="header"> | ||
| 5 | <div class="title">{{ title }}</div> | ||
| 6 | </div> | ||
| 7 | <div class="img-box"> | ||
| 8 | <img :src="showImg.imgUrl" alt="" /> | ||
| 9 | </div> | ||
| 10 | <div class="img-list"> | ||
| 11 | <div class="item" v-for="(item, index) in imgList" :key="index"> | ||
| 12 | <img | ||
| 13 | :class="showImg.id == item.id ? 'active' : ''" | ||
| 14 | :src="item.imgUrl" | ||
| 15 | alt="" | ||
| 16 | @click="imgClick(item)" | ||
| 17 | /> | ||
| 18 | </div> | ||
| 19 | </div> | ||
| 20 | <div class="btn-group"> | ||
| 21 | <el-button>扫描</el-button> | ||
| 22 | <el-button>上传文件</el-button> | ||
| 23 | <el-button icon="el-icon-delete">删除</el-button> | ||
| 24 | </div> | ||
| 25 | </div> | ||
| 4 | </div> | 26 | </div> |
| 5 | </template> | 27 | </template> |
| 6 | <script> | 28 | <script> |
| 7 | |||
| 8 | export default { | 29 | export default { |
| 9 | /**注册组件*/ | 30 | /**注册组件*/ |
| 10 | components: {}, | 31 | components: {}, |
| 11 | data () { | 32 | data() { |
| 12 | return { | 33 | return { |
| 13 | 34 | title: "不动产登记申请书 (1/2)", | |
| 35 | imgList: [ | ||
| 36 | { | ||
| 37 | id: "1", | ||
| 38 | imgUrl: require("../images/1.png"), | ||
| 39 | }, | ||
| 40 | { | ||
| 41 | id: "2", | ||
| 42 | imgUrl: require("../images/2.png"), | ||
| 43 | }, | ||
| 44 | { | ||
| 45 | id: "3", | ||
| 46 | imgUrl: require("../images/3.png"), | ||
| 47 | }, | ||
| 48 | ], | ||
| 49 | showImg: { | ||
| 50 | id: "1", | ||
| 51 | imgUrl: require("../images/1.png"), | ||
| 52 | }, | ||
| 14 | }; | 53 | }; |
| 15 | }, | 54 | }, |
| 16 | } | 55 | methods: { |
| 56 | imgClick(item) { | ||
| 57 | this.showImg = item; | ||
| 58 | }, | ||
| 59 | }, | ||
| 60 | }; | ||
| 17 | </script> | 61 | </script> |
| 18 | <style scoped lang='scss'> | 62 | <style scoped lang='scss'> |
| 63 | .clxx { | ||
| 64 | width: 100%; | ||
| 65 | height: 100%; | ||
| 66 | &-box { | ||
| 67 | width: 800px; | ||
| 68 | height: 800px; | ||
| 69 | background: #e4e4e4; | ||
| 70 | margin: 0 auto; | ||
| 71 | .header { | ||
| 72 | height: 30px; | ||
| 73 | background: #fff; | ||
| 74 | text-align: center; | ||
| 75 | .title { | ||
| 76 | height: 28px; | ||
| 77 | line-height: 28px; | ||
| 78 | font-size: 13px; | ||
| 79 | padding: 0 8px; | ||
| 80 | border: 1px solid #aaa; | ||
| 81 | display: inline-block; | ||
| 82 | } | ||
| 83 | } | ||
| 84 | .img-box { | ||
| 85 | width: 800px; | ||
| 86 | height: 610px; | ||
| 87 | line-height: 610px; | ||
| 88 | padding: 5px; | ||
| 89 | text-align: center; | ||
| 90 | img { | ||
| 91 | max-height: 600px; | ||
| 92 | max-width: 790px; | ||
| 93 | } | ||
| 94 | } | ||
| 95 | .img-list { | ||
| 96 | width: 100%; | ||
| 97 | height: 80px; | ||
| 98 | line-height: 80px; | ||
| 99 | background: #ccc; | ||
| 100 | text-align: center; | ||
| 101 | .item { | ||
| 102 | display: inline-block; | ||
| 103 | margin: 10px 5px; | ||
| 104 | img { | ||
| 105 | width: 60px; | ||
| 106 | height: 60px; | ||
| 107 | cursor: pointer; | ||
| 108 | } | ||
| 109 | .active { | ||
| 110 | border: 1px solid #fff; | ||
| 111 | } | ||
| 112 | } | ||
| 113 | } | ||
| 114 | .btn-group { | ||
| 115 | width: 100%; | ||
| 116 | height: 80px; | ||
| 117 | line-height: 80px; | ||
| 118 | background: #fff; | ||
| 119 | text-align: center; | ||
| 120 | } | ||
| 121 | } | ||
| 122 | } | ||
| 19 | </style> | 123 | </style> |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
src/views/ywbl/fqsq/images/1.png
0 → 100644
2.97 KB
src/views/ywbl/fqsq/images/2.png
0 → 100644
3.31 KB
src/views/ywbl/fqsq/images/3.png
0 → 100644
3.47 KB
| ... | @@ -65,13 +65,17 @@ class data extends filter { | ... | @@ -65,13 +65,17 @@ class data extends filter { |
| 65 | prop: "syqqssj", | 65 | prop: "syqqssj", |
| 66 | label: "使用权起始时间", | 66 | label: "使用权起始时间", |
| 67 | }, | 67 | }, |
| 68 | { | 68 | // { |
| 69 | prop: "syqjssj", | 69 | // prop: "syqjssj", |
| 70 | label: "使用权结束时间", | 70 | // label: "使用权结束时间", |
| 71 | }, | 71 | // }, |
| 72 | { | 72 | // { |
| 73 | prop: "tdsyqx", | 73 | // prop: "tdsyqx", |
| 74 | label: "土地使用期限", | 74 | // label: "土地使用期限", |
| 75 | // }, | ||
| 76 | { | ||
| 77 | prop: "syqqzsj", | ||
| 78 | label: "使用权起止时间", | ||
| 75 | }, | 79 | }, |
| 76 | { | 80 | { |
| 77 | prop: "qdjg", | 81 | prop: "qdjg", | ... | ... |
-
Please register or sign in to post a comment