样式调整
Showing
3 changed files
with
413 additions
and
385 deletions
src/views/registerBook/tablestyle.scss
0 → 100644
| 1 | .tablebox { | ||
| 2 | overflow-x: auto; | ||
| 3 | width: 100%; | ||
| 4 | height: 95%; | ||
| 5 | background: #fff; | ||
| 6 | text-align: center; | ||
| 7 | padding: 4px; | ||
| 8 | overflow-y: scroll; | ||
| 9 | padding-top: 20px; | ||
| 10 | padding: 20px 40px; | ||
| 11 | |||
| 12 | .Table { | ||
| 13 | width: 100%; | ||
| 14 | color: #333; | ||
| 15 | tr { | ||
| 16 | td:nth-child(1) { | ||
| 17 | width: 140px; | ||
| 18 | text-align: right; | ||
| 19 | padding-right: 15px; | ||
| 20 | background-color: #f8f8fa; | ||
| 21 | color: #6b6b6b; | ||
| 22 | } | ||
| 23 | td:nth-child(3) { | ||
| 24 | width: 140px; | ||
| 25 | padding-right: 15px; | ||
| 26 | text-align: right; | ||
| 27 | background-color: #f8f8fa; | ||
| 28 | color: #6b6b6b; | ||
| 29 | } | ||
| 30 | td:nth-child(2) { | ||
| 31 | text-align: left; | ||
| 32 | padding-left: 15px; | ||
| 33 | color: #4a4a4a; | ||
| 34 | } | ||
| 35 | td:nth-child(4) { | ||
| 36 | text-align: left; | ||
| 37 | padding-left: 15px; | ||
| 38 | color: #4a4a4a; | ||
| 39 | } | ||
| 40 | } | ||
| 41 | |||
| 42 | td { | ||
| 43 | border: 1px solid #e8e8e8; | ||
| 44 | line-height: 42px; | ||
| 45 | padding: 0 4px; | ||
| 46 | font-size: 14px; | ||
| 47 | } | ||
| 48 | |||
| 49 | .title { | ||
| 50 | line-height: 68px; | ||
| 51 | font-size: 22px !important; | ||
| 52 | color: #4a4a4a !important; | ||
| 53 | background-color: #eceef2 !important; | ||
| 54 | text-align: center !important; | ||
| 55 | } | ||
| 56 | |||
| 57 | .unit { | ||
| 58 | text-align: right; | ||
| 59 | } | ||
| 60 | .title3 { | ||
| 61 | width: 140px !important; | ||
| 62 | } | ||
| 63 | .bhqk { | ||
| 64 | width: 140px; | ||
| 65 | padding: 0 !important; | ||
| 66 | |||
| 67 | .box { | ||
| 68 | width: 745px; | ||
| 69 | overflow: auto; | ||
| 70 | } | ||
| 71 | |||
| 72 | .test { | ||
| 73 | } | ||
| 74 | |||
| 75 | table { | ||
| 76 | .bhqkTh { | ||
| 77 | width: 110px; | ||
| 78 | line-height: 38px; | ||
| 79 | background-color: #f8f8fa; | ||
| 80 | border: 1px solid #e8e8e8; | ||
| 81 | font-weight: bold; | ||
| 82 | text-align: left; | ||
| 83 | } | ||
| 84 | |||
| 85 | td { | ||
| 86 | width: 180px; | ||
| 87 | } | ||
| 88 | } | ||
| 89 | } | ||
| 90 | } | ||
| 91 | } |
| 1 | <template> | 1 | <template> |
| 2 | <div class="zdxx"> | 2 | <div class="zdxx"> |
| 3 | <div class="tablebox"> | 3 | <div class="tablebox"> |
| 4 | <table cellpadding="0" cellspacing="0" class="zdxxTable"> | 4 | <table cellpadding="0" cellspacing="0" class="Table"> |
| 5 | <col width="80" /> | 5 | <col width="80" /> |
| 6 | <col width="60" /> | 6 | <col width="60" /> |
| 7 | <col width="90" /> | 7 | <col width="90" /> |
| 8 | <col width="235" /> | 8 | <col width="235" /> |
| 9 | <col width="150" /> | 9 | <col width="150" /> |
| 10 | <tr> | 10 | <tr> |
| 11 | <td colspan="6" class="title">宗地基本信息</td> | 11 | <td colspan="12" class="title">宗地基本信息</td> |
| 12 | </tr> | 12 | </tr> |
| 13 | <tr> | 13 | <tr> |
| 14 | <td colspan="2">不动产类型:</td> | 14 | <td colspan="2">不动产类型</td> |
| 15 | <td colspan="2">{{ bdclxList[zdjbxx.bdclx] }}</td> | 15 | <td colspan="3">{{ bdclxList[zdjbxx.bdclx] }}</td> |
| 16 | <td>单位:</td> | 16 | <td>单位</td> |
| 17 | <td>{{ zdjbxx.mjdw }}</td> | 17 | <td colspan="4">{{ zdjbxx.mjdw }}</td> |
| 18 | </tr> | 18 | </tr> |
| 19 | <tr> | 19 | <tr> |
| 20 | <td colspan="2">坐落</td> | 20 | <td colspan="2">坐落</td> |
| 21 | <td colspan="4">{{ zdjbxx.zl }}</td> | 21 | <td colspan="10">{{ zdjbxx.zl }}</td> |
| 22 | </tr> | 22 | </tr> |
| 23 | <tr> | 23 | <tr> |
| 24 | <td rowspan="8" class="title2">土地状况</td> | 24 | <td rowspan="8" colspan="2" class="title2">土地状况</td> |
| 25 | </tr> | 25 | </tr> |
| 26 | <tr> | 26 | <tr> |
| 27 | <td colspan="2">宗地面积</td> | 27 | <td>宗地面积</td> |
| 28 | <td>{{ zdjbxx.zdmj }}</td> | 28 | <td colspan="4">{{ zdjbxx.zdmj }}</td> |
| 29 | <td>用途</td> | 29 | <td>用途</td> |
| 30 | <td>{{ zdjbxx.ghytmc }}</td> | 30 | <td>{{ zdjbxx.ghytmc }}</td> |
| 31 | </tr> | 31 | </tr> |
| 32 | <tr> | 32 | <tr> |
| 33 | <td colspan="2">等级</td> | 33 | <td>等级</td> |
| 34 | <td>{{ zdjbxx.djmc }}</td> | 34 | <td colspan="4">{{ zdjbxx.djmc }}</td> |
| 35 | <td>价格</td> | 35 | <td>价格</td> |
| 36 | <td>{{ zdjbxx.jg }}</td> | 36 | <td colspan="3">{{ zdjbxx.jg }}</td> |
| 37 | </tr> | 37 | </tr> |
| 38 | <tr> | 38 | <tr> |
| 39 | <td colspan="2">权利类型</td> | 39 | <td>权利类型</td> |
| 40 | <td>{{ zdjbxx.qllxmc }}</td> | 40 | <td colspan="4">{{ zdjbxx.qllxmc }}</td> |
| 41 | <td>权利性质</td> | 41 | <td>权利性质</td> |
| 42 | <td>{{ zdjbxx.qlxzmc }}</td> | 42 | <td>{{ zdjbxx.qlxzmc }}</td> |
| 43 | </tr> | 43 | </tr> |
| 44 | <tr> | 44 | <tr> |
| 45 | <td colspan="2">权利设定方式</td> | 45 | <td>权利设定方式</td> |
| 46 | <td>{{ zdjbxx.qlsdfs }}</td> | 46 | <td colspan="4">{{ zdjbxx.qlsdfs }}</td> |
| 47 | <td>容积率</td> | 47 | <td>容积率</td> |
| 48 | <td>{{ zdjbxx.rjl }}</td> | 48 | <td>{{ zdjbxx.rjl }}</td> |
| 49 | </tr> | 49 | </tr> |
| 50 | <tr> | 50 | <tr> |
| 51 | <td colspan="2">建筑密度</td> | 51 | <td>建筑密度</td> |
| 52 | <td>{{ zdjbxx.jzmd }}</td> | 52 | <td colspan="4">{{ zdjbxx.jzmd }}</td> |
| 53 | <td>建筑限高</td> | 53 | <td>建筑限高</td> |
| 54 | <td>{{ zdjbxx.jzxg }}</td> | 54 | <td>{{ zdjbxx.jzxg }}</td> |
| 55 | </tr> | 55 | </tr> |
| 56 | <tr> | 56 | <tr> |
| 57 | <td colspan="2">图幅号</td> | 57 | <td>图幅号</td> |
| 58 | <td>{{ zdjbxx.tfh }}</td> | 58 | <td colspan="4">{{ zdjbxx.tfh }}</td> |
| 59 | <td>地籍号</td> | 59 | <td>地籍号</td> |
| 60 | <td>{{ zdjbxx.djh }}</td> | 60 | <td colspan="3">{{ zdjbxx.djh }}</td> |
| 61 | </tr> | 61 | </tr> |
| 62 | <tr> | 62 | <tr> |
| 63 | <td colspan="2">档案号</td> | 63 | <td>档案号</td> |
| 64 | <td>{{ zdjbxx.dah }}</td> | 64 | <td colspan="4">{{ zdjbxx.dah }}</td> |
| 65 | <td>地块代码</td> | 65 | <td>地块代码</td> |
| 66 | <td>{{ zdjbxx.dkdm }}</td> | 66 | <td colspan="3">{{ zdjbxx.dkdm }}</td> |
| 67 | </tr> | 67 | </tr> |
| 68 | <tr> | 68 | <tr> |
| 69 | <td colspan="2">宗地四至-东</td> | 69 | <td colspan="2">宗地四至-东</td> |
| 70 | <td colspan="4">{{ zdjbxx.zdszd }}</td> | 70 | <td colspan="8">{{ zdjbxx.zdszd }}</td> |
| 71 | </tr> | 71 | </tr> |
| 72 | <tr> | 72 | <tr> |
| 73 | <td colspan="2">宗地四至-南</td> | 73 | <td colspan="2">宗地四至-南</td> |
| 74 | <td colspan="4">{{ zdjbxx.zdszn }}</td> | 74 | <td colspan="8">{{ zdjbxx.zdszn }}</td> |
| 75 | </tr> | 75 | </tr> |
| 76 | <tr> | 76 | <tr> |
| 77 | <td colspan="2">宗地四至-西</td> | 77 | <td colspan="2">宗地四至-西</td> |
| 78 | <td colspan="4">{{ zdjbxx.zdszx }}</td> | 78 | <td colspan="8">{{ zdjbxx.zdszx }}</td> |
| 79 | </tr> | 79 | </tr> |
| 80 | <tr> | 80 | <tr> |
| 81 | <td colspan="2">宗地四至-北</td> | 81 | <td colspan="2">宗地四至-北</td> |
| 82 | <td colspan="4">{{ zdjbxx.zdszb }}</td> | 82 | <td colspan="8">{{ zdjbxx.zdszb }}</td> |
| 83 | </tr> | 83 | </tr> |
| 84 | <tr> | 84 | <tr> |
| 85 | <td class="title2" height="96">备注</td> | 85 | <td class="title2" colspan="2" height="50">备注</td> |
| 86 | <td colspan="5">{{ zdjbxx.bz }}</td> | 86 | <td colspan="8">{{ zdjbxx.bz }}</td> |
| 87 | </tr> | 87 | </tr> |
| 88 | <tr> | 88 | <tr> |
| 89 | <td class="title2" height="96">附记</td> | 89 | <td class="title2" colspan="2" height="50">附记</td> |
| 90 | <td colspan="5">{{ zdjbxx.fj }}</td> | 90 | <td colspan="8">{{ zdjbxx.fj }}</td> |
| 91 | </tr> | 91 | </tr> |
| 92 | <tr> | 92 | <tr> |
| 93 | <td colspan="2">状态</td> | 93 | <td colspan="2">状态</td> |
| 94 | <td colspan="2">{{ zdjbxx.zt }}</td> | 94 | <td colspan="2">{{ zdjbxx.zt }}</td> |
| 95 | <td>区县代码</td> | 95 | <td>区县代码</td> |
| 96 | <td>{{ zdjbxx.qxdm }}</td> | 96 | <td colspan="4">{{ zdjbxx.qxdm }}</td> |
| 97 | </tr> | 97 | </tr> |
| 98 | <tr v-show="showGroup"> | 98 | <tr v-if="showGroup"> |
| 99 | <td class="title2">变化情况</td> | 99 | <td colspan="2" class="title3">变化情况</td> |
| 100 | <td colspan="5" class="bhqk"> | 100 | <td colspan="4" class="bhqk"> |
| 101 | <div class="box"> | 101 | <div class="box"> |
| 102 | <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth"> | 102 | <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth"> |
| 103 | <tr v-for="(item, index) in bhqkColumns" :key="index"> | 103 | <tr v-for="(item, index) in bhqkColumns" :key="index"> |
| 104 | <td class="bhqkTh">{{ item.label }}</td> | 104 | <td class="bhqkTh">{{ item.label }}</td> |
| 105 | <!-- <td v-for="(item2, index2) in zdbhqks" :key="index2"> | ||
| 106 | {{ item2[item.prop] }} | ||
| 107 | </td> --> | ||
| 108 | </tr> | 105 | </tr> |
| 109 | </table> | 106 | </table> |
| 110 | </div> | 107 | </div> |
| ... | @@ -159,7 +156,7 @@ | ... | @@ -159,7 +156,7 @@ |
| 159 | zdjbxx: {}, | 156 | zdjbxx: {}, |
| 160 | zdbhqks: [], | 157 | zdbhqks: [], |
| 161 | propsParam: this.$attrs, | 158 | propsParam: this.$attrs, |
| 162 | showGroup: false, | 159 | showGroup: true, |
| 163 | bdclxList: ['', '宗地', '宗海', '自然幢', '多幢', '构筑物', '林权', '户'] | 160 | bdclxList: ['', '宗地', '宗海', '自然幢', '多幢', '构筑物', '林权', '户'] |
| 164 | }; | 161 | }; |
| 165 | }, | 162 | }, |
| ... | @@ -183,71 +180,11 @@ | ... | @@ -183,71 +180,11 @@ |
| 183 | </script> | 180 | </script> |
| 184 | 181 | ||
| 185 | <style lang="scss" scoped> | 182 | <style lang="scss" scoped> |
| 183 | @import "./tablestyle.scss"; | ||
| 186 | .zdxx { | 184 | .zdxx { |
| 187 | width: 100%; | 185 | width: 100%; |
| 188 | height: 100%; | 186 | height: 100%; |
| 189 | background-color: #f5f5f5; | 187 | background-color: #f5f5f5; |
| 190 | padding: 5px; | 188 | padding: 5px; |
| 191 | } | 189 | } |
| 192 | .tablebox { | ||
| 193 | overflow-x: auto; | ||
| 194 | width: 100%; | ||
| 195 | height: 100%; | ||
| 196 | background: #fff; | ||
| 197 | border: 1px solid rgb(228, 228, 228); | ||
| 198 | text-align: center; | ||
| 199 | padding: 4px; | ||
| 200 | overflow-y: scroll; | ||
| 201 | |||
| 202 | .zdxxTable { | ||
| 203 | width: 100%; | ||
| 204 | color: #333; | ||
| 205 | |||
| 206 | td { | ||
| 207 | border: 1px solid rgb(228, 228, 228); | ||
| 208 | line-height: 30px; | ||
| 209 | padding: 0 4px; | ||
| 210 | } | ||
| 211 | |||
| 212 | .title { | ||
| 213 | line-height: 68px; | ||
| 214 | font-size: 20px; | ||
| 215 | } | ||
| 216 | |||
| 217 | .unit { | ||
| 218 | text-align: right; | ||
| 219 | } | ||
| 220 | |||
| 221 | .title2 { | ||
| 222 | writing-mode: vertical-lr; | ||
| 223 | letter-spacing: 6px; | ||
| 224 | } | ||
| 225 | |||
| 226 | .bhqk { | ||
| 227 | padding: 0; | ||
| 228 | |||
| 229 | .box { | ||
| 230 | width: 745px; | ||
| 231 | overflow: auto; | ||
| 232 | } | ||
| 233 | |||
| 234 | .test { | ||
| 235 | } | ||
| 236 | |||
| 237 | table { | ||
| 238 | .bhqkTh { | ||
| 239 | width: 110px; | ||
| 240 | line-height: 40px; | ||
| 241 | background-color: #f5f5f5; | ||
| 242 | border: 1px solid rgb(228, 228, 228); | ||
| 243 | font-weight: bold; | ||
| 244 | } | ||
| 245 | |||
| 246 | td { | ||
| 247 | width: 180px; | ||
| 248 | } | ||
| 249 | } | ||
| 250 | } | ||
| 251 | } | ||
| 252 | } | ||
| 253 | </style> | 190 | </style> | ... | ... |
| ... | @@ -23,315 +23,315 @@ | ... | @@ -23,315 +23,315 @@ |
| 23 | </template> | 23 | </template> |
| 24 | 24 | ||
| 25 | <script> | 25 | <script> |
| 26 | import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation' | 26 | import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation' |
| 27 | import { editDictNode, getChildDictList } from '@/api/user' | 27 | import { editDictNode, getChildDictList } from '@/api/user' |
| 28 | export default { | 28 | export default { |
| 29 | props: { | 29 | props: { |
| 30 | value: { type: Boolean, default: false }, | 30 | value: { type: Boolean, default: false }, |
| 31 | details: { | 31 | details: { |
| 32 | type: Object, | 32 | type: Object, |
| 33 | default: {} | 33 | default: {} |
| 34 | } | 34 | } |
| 35 | }, | 35 | }, |
| 36 | data () { | 36 | data () { |
| 37 | return { | 37 | return { |
| 38 | key: 0, | 38 | key: 0, |
| 39 | myValue: this.value, | 39 | myValue: this.value, |
| 40 | keyList: [], | 40 | keyList: [], |
| 41 | ruleForm: { | 41 | ruleForm: { |
| 42 | dcode: '', | 42 | dcode: '', |
| 43 | dname: '' | 43 | dname: '' |
| 44 | }, | ||
| 45 | column: [], | ||
| 46 | columns: [ | ||
| 47 | { | ||
| 48 | width: '70', | ||
| 49 | renderHeader: (h, scope) => { | ||
| 50 | return (<div> | ||
| 51 | { | ||
| 52 | this.details.isenable === '0' ? | ||
| 53 | <span>序号</span> : | ||
| 54 | <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i> | ||
| 55 | } | ||
| 56 | </div>) | ||
| 57 | }, | ||
| 58 | render: (h, scope) => { | ||
| 59 | return ( | ||
| 60 | <span>{scope.row.index}</span> | ||
| 61 | ) | ||
| 62 | } | ||
| 63 | }, | 44 | }, |
| 64 | { | 45 | column: [], |
| 65 | prop: 'dcode', | 46 | columns: [ |
| 66 | width: '100', | 47 | { |
| 67 | label: '字典项编码', | 48 | width: '70', |
| 68 | render: (h, scope) => { | 49 | renderHeader: (h, scope) => { |
| 69 | return ( | 50 | return (<div> |
| 70 | <div> | 51 | { |
| 71 | <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]} | 52 | this.details.isenable === '0' ? |
| 72 | onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} | 53 | <span>序号</span> : |
| 73 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> | 54 | <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i> |
| 55 | } | ||
| 56 | </div>) | ||
| 57 | }, | ||
| 58 | render: (h, scope) => { | ||
| 59 | return ( | ||
| 60 | <span>{scope.row.index}</span> | ||
| 61 | ) | ||
| 62 | } | ||
| 63 | }, | ||
| 64 | { | ||
| 65 | prop: 'dcode', | ||
| 66 | width: '100', | ||
| 67 | label: '字典项编码', | ||
| 68 | render: (h, scope) => { | ||
| 69 | return ( | ||
| 70 | <div> | ||
| 71 | <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]} | ||
| 72 | onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} | ||
| 73 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> | ||
| 74 | 74 | ||
| 75 | 75 | ||
| 76 | <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]} | 76 | <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]} |
| 77 | onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} | 77 | onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} |
| 78 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> | 78 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> |
| 79 | </div> | 79 | </div> |
| 80 | ) | 80 | ) |
| 81 | } | 81 | } |
| 82 | }, | 82 | }, |
| 83 | { | 83 | { |
| 84 | prop: 'dname', | 84 | prop: 'dname', |
| 85 | label: '字典项名称', | 85 | label: '字典项名称', |
| 86 | render: (h, scope) => { | 86 | render: (h, scope) => { |
| 87 | return ( | 87 | return ( |
| 88 | <div> | 88 | <div> |
| 89 | <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]} | 89 | <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]} |
| 90 | onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} | 90 | onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} |
| 91 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> | 91 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> |
| 92 | 92 | ||
| 93 | <el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]} | 93 | <el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]} |
| 94 | onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} | 94 | onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} |
| 95 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> | 95 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> |
| 96 | </div> | 96 | </div> |
| 97 | ) | 97 | ) |
| 98 | } | 98 | } |
| 99 | }, | 99 | }, |
| 100 | { | 100 | { |
| 101 | prop: 'normcode', | 101 | prop: 'normcode', |
| 102 | label: '部标编码', | 102 | label: '部标编码', |
| 103 | width: '100', | 103 | width: '100', |
| 104 | render: (h, scope) => { | 104 | render: (h, scope) => { |
| 105 | return ( | 105 | return ( |
| 106 | <div> | 106 | <div> |
| 107 | <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]} | 107 | <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]} |
| 108 | onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} | 108 | onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} |
| 109 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> | 109 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> |
| 110 | 110 | ||
| 111 | <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]} | 111 | <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]} |
| 112 | onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} | 112 | onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} |
| 113 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> | 113 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> |
| 114 | </div> | 114 | </div> |
| 115 | ) | 115 | ) |
| 116 | } | 116 | } |
| 117 | }, | 117 | }, |
| 118 | { | 118 | { |
| 119 | prop: 'normname', | 119 | prop: 'normname', |
| 120 | label: '部标名称', | 120 | label: '部标名称', |
| 121 | render: (h, scope) => { | 121 | render: (h, scope) => { |
| 122 | return ( | 122 | return ( |
| 123 | <div> | 123 | <div> |
| 124 | <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]} | 124 | <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]} |
| 125 | onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} | 125 | onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} |
| 126 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> | 126 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> |
| 127 | 127 | ||
| 128 | <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]} | 128 | <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]} |
| 129 | onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} | 129 | onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} |
| 130 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> | 130 | onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> |
| 131 | </div> | 131 | </div> |
| 132 | ) | 132 | ) |
| 133 | } | 133 | } |
| 134 | }, | 134 | }, |
| 135 | { | 135 | { |
| 136 | prop: 'isenable', | 136 | prop: 'isenable', |
| 137 | width: '160', | 137 | width: '160', |
| 138 | label: '是否禁用', | 138 | label: '是否禁用', |
| 139 | render: (h, scope) => { | 139 | render: (h, scope) => { |
| 140 | return ( | 140 | return ( |
| 141 | <el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}> | 141 | <el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}> |
| 142 | <el-radio label="1">启用</el-radio> | 142 | <el-radio label="1">启用</el-radio> |
| 143 | <el-radio label="0">禁用</el-radio> | 143 | <el-radio label="0">禁用</el-radio> |
| 144 | </el-radio-group> | 144 | </el-radio-group> |
| 145 | ) | 145 | ) |
| 146 | } | ||
| 147 | }, | ||
| 148 | { | ||
| 149 | width: '130', | ||
| 150 | label: '移动', | ||
| 151 | render: (h, scope) => { | ||
| 152 | return ( | ||
| 153 | <div> | ||
| 154 | <el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button> | ||
| 155 | <el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button > | ||
| 156 | </div > | ||
| 157 | ) | ||
| 158 | } | ||
| 159 | }, | ||
| 160 | { | ||
| 161 | width: '150', | ||
| 162 | label: '操作', | ||
| 163 | render: (h, scope) => { | ||
| 164 | return ( | ||
| 165 | <div> | ||
| 166 | <el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button> | ||
| 167 | <el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button> | ||
| 168 | </div> | ||
| 169 | ) | ||
| 170 | } | ||
| 146 | } | 171 | } |
| 172 | ], | ||
| 173 | tableData: [] | ||
| 174 | } | ||
| 175 | }, | ||
| 176 | watch: { | ||
| 177 | value (val) { | ||
| 178 | this.myValue = val | ||
| 179 | }, | ||
| 180 | 'details.bsmDict': { | ||
| 181 | handler: function (newValue) { | ||
| 182 | if (!this.value) return | ||
| 183 | this.$startLoading(); | ||
| 184 | getChildDictList(newValue).then(res => { | ||
| 185 | this.$endLoading(); | ||
| 186 | let { result } = res | ||
| 187 | this.tableData = result ? result : [] | ||
| 188 | this.tableData.forEach((item, index) => { | ||
| 189 | item.index = index + 1 | ||
| 190 | }) | ||
| 191 | }) | ||
| 147 | }, | 192 | }, |
| 148 | { | 193 | immediate: true |
| 149 | width: '130', | 194 | }, |
| 150 | label: '移动', | 195 | details: { |
| 151 | render: (h, scope) => { | 196 | handler: function (newValue) { |
| 152 | return ( | 197 | if (newValue.isenable == 2) { |
| 153 | <div> | 198 | this.column = this.columns.slice(0, 6) |
| 154 | <el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button> | 199 | } else { |
| 155 | <el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button > | 200 | this.column = this.columns |
| 156 | </div > | ||
| 157 | ) | ||
| 158 | } | 201 | } |
| 202 | this.ruleForm = newValue.rowData | ||
| 203 | this.addIndexes() | ||
| 204 | this.key++ | ||
| 159 | }, | 205 | }, |
| 160 | { | 206 | deep: true |
| 161 | width: '150', | 207 | } |
| 162 | label: '操作', | ||
| 163 | render: (h, scope) => { | ||
| 164 | return ( | ||
| 165 | <div> | ||
| 166 | <el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button> | ||
| 167 | <el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button> | ||
| 168 | </div> | ||
| 169 | ) | ||
| 170 | } | ||
| 171 | } | ||
| 172 | ], | ||
| 173 | tableData: [] | ||
| 174 | } | ||
| 175 | }, | ||
| 176 | watch: { | ||
| 177 | value (val) { | ||
| 178 | this.myValue = val | ||
| 179 | }, | 208 | }, |
| 180 | 'details.bsmDict': { | 209 | methods: { |
| 181 | handler: function (newValue) { | 210 | // 添加索引 |
| 182 | if (!this.value) return | 211 | addIndexes (data = this.tableData, isAdd = true) { |
| 183 | this.$startLoading(); | 212 | data.forEach((item, index) => { |
| 184 | getChildDictList(newValue).then(res => { | 213 | if (index == 0) { |
| 185 | this.$endLoading(); | 214 | item.codeShow = true |
| 186 | let { result } = res | 215 | item.nameShow = false |
| 187 | this.tableData = result ? result : [] | 216 | item.normcodeShow = false |
| 188 | this.tableData.forEach((item, index) => { | 217 | item.normnameShow = false |
| 218 | } else { | ||
| 219 | item.codeShow = false | ||
| 220 | item.nameShow = false | ||
| 221 | item.normcodeShow = false | ||
| 222 | item.normnameShow = false | ||
| 223 | } | ||
| 224 | if (isAdd) { | ||
| 189 | item.index = index + 1 | 225 | item.index = index + 1 |
| 190 | }) | 226 | } |
| 227 | if (item.children) { | ||
| 228 | this.addIndexes(item.children, false) | ||
| 229 | } | ||
| 191 | }) | 230 | }) |
| 192 | }, | 231 | }, |
| 193 | immediate: true | 232 | itemShowFalse () { |
| 194 | }, | 233 | this.tableData.forEach((item, index) => { |
| 195 | details: { | ||
| 196 | handler: function (newValue) { | ||
| 197 | if (newValue.isenable == 2) { | ||
| 198 | this.column = this.columns.slice(0, 6) | ||
| 199 | } else { | ||
| 200 | this.column = this.columns | ||
| 201 | } | ||
| 202 | this.ruleForm = newValue.rowData | ||
| 203 | this.addIndexes() | ||
| 204 | this.key++ | ||
| 205 | }, | ||
| 206 | deep: true | ||
| 207 | } | ||
| 208 | }, | ||
| 209 | methods: { | ||
| 210 | // 添加索引 | ||
| 211 | addIndexes (data = this.tableData, isAdd = true) { | ||
| 212 | data.forEach((item, index) => { | ||
| 213 | if (index == 0) { | ||
| 214 | item.codeShow = true | ||
| 215 | item.nameShow = false | ||
| 216 | item.normcodeShow = false | ||
| 217 | item.normnameShow = false | ||
| 218 | } else { | ||
| 219 | item.codeShow = false | 234 | item.codeShow = false |
| 220 | item.nameShow = false | 235 | item.nameShow = false |
| 221 | item.normcodeShow = false | 236 | item.normcodeShow = false |
| 222 | item.normnameShow = false | 237 | item.normnameShow = false |
| 223 | } | ||
| 224 | if (isAdd) { | ||
| 225 | item.index = index + 1 | ||
| 226 | } | ||
| 227 | if (item.children) { | ||
| 228 | this.addIndexes(item.children, false) | ||
| 229 | } | ||
| 230 | }) | ||
| 231 | }, | ||
| 232 | itemShowFalse () { | ||
| 233 | this.tableData.forEach((item, index) => { | ||
| 234 | item.codeShow = false | ||
| 235 | item.nameShow = false | ||
| 236 | item.normcodeShow = false | ||
| 237 | item.normnameShow = false | ||
| 238 | }) | ||
| 239 | }, | ||
| 240 | handleMinus (index, row) { | ||
| 241 | this.$confirm('此操作将永久删除, 是否继续?', '提示', { | ||
| 242 | confirmButtonText: '确定', | ||
| 243 | cancelButtonText: '取消', | ||
| 244 | type: 'warning' | ||
| 245 | }).then(() => { | ||
| 246 | removeTreeListItem(this.tableData, row.bsmDict) | ||
| 247 | this.$message({ | ||
| 248 | type: 'success', | ||
| 249 | message: '删除成功!' | ||
| 250 | }) | ||
| 251 | }).catch(() => { | ||
| 252 | this.$message({ | ||
| 253 | type: 'info', | ||
| 254 | message: '已取消删除' | ||
| 255 | }) | 238 | }) |
| 256 | }) | 239 | }, |
| 257 | }, | 240 | handleMinus (index, row) { |
| 258 | handleSubmit () { | 241 | this.$confirm('此操作将永久删除, 是否继续?', '提示', { |
| 259 | editDictNode({ | 242 | confirmButtonText: '确定', |
| 260 | bsmDict: this.details.rowData.bsmDict, | 243 | cancelButtonText: '取消', |
| 261 | typeid: this.details.rowData.typeid, | 244 | type: 'warning' |
| 262 | children: this.tableData | 245 | }).then(() => { |
| 263 | }).then(res => { | 246 | removeTreeListItem(this.tableData, row.bsmDict) |
| 264 | if (res.code === 200) { | ||
| 265 | this.$message({ | 247 | this.$message({ |
| 266 | message: '修改成功', | 248 | type: 'success', |
| 267 | type: 'success' | 249 | message: '删除成功!' |
| 268 | }) | 250 | }) |
| 269 | this.$emit('input', false) | 251 | }).catch(() => { |
| 252 | this.$message({ | ||
| 253 | type: 'info', | ||
| 254 | message: '已取消删除' | ||
| 255 | }) | ||
| 256 | }) | ||
| 257 | }, | ||
| 258 | handleSubmit () { | ||
| 259 | editDictNode({ | ||
| 260 | bsmDict: this.details.rowData.bsmDict, | ||
| 261 | typeid: this.details.rowData.typeid, | ||
| 262 | children: this.tableData | ||
| 263 | }).then(res => { | ||
| 264 | if (res.code === 200) { | ||
| 265 | this.$message({ | ||
| 266 | message: '修改成功', | ||
| 267 | type: 'success' | ||
| 268 | }) | ||
| 269 | this.$emit('input', false) | ||
| 270 | } | ||
| 271 | }) | ||
| 272 | }, | ||
| 273 | closeDialog () { | ||
| 274 | this.$emit('input', false) | ||
| 275 | }, | ||
| 276 | // 增加下级 | ||
| 277 | handleAddSubordinate (row) { | ||
| 278 | if (!row.children) { | ||
| 279 | row.children = [] | ||
| 270 | } | 280 | } |
| 271 | }) | 281 | row.children.push( |
| 272 | }, | 282 | { |
| 273 | closeDialog () { | 283 | dcode: '', |
| 274 | this.$emit('input', false) | 284 | dname: '', |
| 275 | }, | 285 | isenable: '1', |
| 276 | // 增加下级 | 286 | normcode: '', |
| 277 | handleAddSubordinate (row) { | 287 | normname: '', |
| 278 | if (!row.children) { | 288 | bsmDict: getUuid(32), |
| 279 | row.children = [] | 289 | typeid: row.typeid, |
| 290 | } | ||
| 291 | ) | ||
| 292 | this.keyList = []; | ||
| 293 | this.keyList.push(row.bsmDict) | ||
| 294 | }, | ||
| 295 | // 增加 | ||
| 296 | handleAdd () { | ||
| 297 | this.$nextTick(() => { | ||
| 298 | let container = this.$el.querySelector('.el-table__body-wrapper'); | ||
| 299 | container.scrollTop = container.scrollHeight; | ||
| 300 | }) | ||
| 301 | this.tableData.push( | ||
| 302 | { | ||
| 303 | dcode: '', | ||
| 304 | dname: '', | ||
| 305 | isenable: '1', | ||
| 306 | normcode: '', | ||
| 307 | normname: '', | ||
| 308 | bsmDict: getUuid(32), | ||
| 309 | typeid: this.ruleForm.typeid, | ||
| 310 | } | ||
| 311 | ) | ||
| 312 | this.addIndexes() | ||
| 313 | this.key++ | ||
| 314 | }, | ||
| 315 | // 上移下移 | ||
| 316 | moveUpward (index, row) { | ||
| 317 | realMove(row.bsmDict, 'UP', this.tableData) | ||
| 318 | this.key++ | ||
| 319 | let id = findParents(this.tableData, row.bsmDict) | ||
| 320 | this.keyList = id | ||
| 321 | }, | ||
| 322 | moveDown (index, row) { | ||
| 323 | realMove(row.bsmDict, 'DOWN', this.tableData) | ||
| 324 | this.key++ | ||
| 325 | let id = findParents(this.tableData, row.bsmDict) | ||
| 326 | this.keyList = id | ||
| 280 | } | 327 | } |
| 281 | row.children.push( | ||
| 282 | { | ||
| 283 | dcode: '', | ||
| 284 | dname: '', | ||
| 285 | isenable: '1', | ||
| 286 | normcode: '', | ||
| 287 | normname: '', | ||
| 288 | bsmDict: getUuid(32), | ||
| 289 | typeid: row.typeid, | ||
| 290 | } | ||
| 291 | ) | ||
| 292 | this.keyList = []; | ||
| 293 | this.keyList.push(row.bsmDict) | ||
| 294 | }, | ||
| 295 | // 增加 | ||
| 296 | handleAdd () { | ||
| 297 | this.$nextTick(() => { | ||
| 298 | let container = this.$el.querySelector('.el-table__body-wrapper'); | ||
| 299 | container.scrollTop = container.scrollHeight; | ||
| 300 | }) | ||
| 301 | this.tableData.push( | ||
| 302 | { | ||
| 303 | dcode: '', | ||
| 304 | dname: '', | ||
| 305 | isenable: '1', | ||
| 306 | normcode: '', | ||
| 307 | normname: '', | ||
| 308 | bsmDict: getUuid(32), | ||
| 309 | typeid: this.ruleForm.typeid, | ||
| 310 | } | ||
| 311 | ) | ||
| 312 | this.addIndexes() | ||
| 313 | this.key++ | ||
| 314 | }, | ||
| 315 | // 上移下移 | ||
| 316 | moveUpward (index, row) { | ||
| 317 | realMove(row.bsmDict, 'UP', this.tableData) | ||
| 318 | this.key++ | ||
| 319 | let id = findParents(this.tableData, row.bsmDict) | ||
| 320 | this.keyList = id | ||
| 321 | }, | ||
| 322 | moveDown (index, row) { | ||
| 323 | realMove(row.bsmDict, 'DOWN', this.tableData) | ||
| 324 | this.key++ | ||
| 325 | let id = findParents(this.tableData, row.bsmDict) | ||
| 326 | this.keyList = id | ||
| 327 | } | 328 | } |
| 328 | } | 329 | } |
| 329 | } | ||
| 330 | </script> | 330 | </script> |
| 331 | <style rel="stylesheet/scss" lang="scss" scoped> | 331 | <style rel="stylesheet/scss" lang="scss" scoped> |
| 332 | @import "~@/styles/dialogBoxheader.scss"; | 332 | @import "~@/styles/dialogBoxheader.scss"; |
| 333 | /deep/.el-radio { | 333 | /deep/.el-radio { |
| 334 | margin-right: 5px !important; | 334 | margin-right: 5px !important; |
| 335 | } | 335 | } |
| 336 | </style> | 336 | </style> |
| 337 | 337 | ... | ... |
-
Please register or sign in to post a comment