Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
bd208a6f by renchao@pashanhoo.com
Options

style:系统管理

1 parent 524a0a70
Inline Side-by-side
Showing 3 changed files with 288 additions and 296 deletions
1 <template> 1 <template>
2 <!-- 编辑 --> 2 <div>
3 <dialogBox submitForm="submitForm" @closeDialog="closeDialog" @submitForm="handleSubmit" width="80%" v-model="myValue"
4 :isSave="details.isenable == 1" title="字典信息">
5 <el-form :model="ruleForm" ref="ruleForm" label-width="100px"> 3 <el-form :model="ruleForm" ref="ruleForm" label-width="100px">
6 <el-row :gutter="20"> 4 <el-row :gutter="20">
7 <el-col :span="4"> 5 <el-col :span="4">
...@@ -19,319 +17,313 @@ ...@@ -19,319 +17,313 @@
19 <lb-table :column="column" class="loadingtext" :heightNum="420" :key="key" :expand-row-keys="keyList" 17 <lb-table :column="column" class="loadingtext" :heightNum="420" :key="key" :expand-row-keys="keyList"
20 row-key="bsmDict" :tree-props="{ children: 'children' }" :pagination="false" :data="tableData"> 18 row-key="bsmDict" :tree-props="{ children: 'children' }" :pagination="false" :data="tableData">
21 </lb-table> 19 </lb-table>
22 </dialogBox> 20
21 <div class="text-center">
22 <el-button @click="$popupCacel">取消</el-button>
23 <el-button type="primary" @click="handleSubmit">确定</el-button>
24 </div>
25 </div>
23 </template> 26 </template>
24 27
25 <script> 28 <script>
26 import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation' 29 import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation'
27 import { editDictNode, getChildDictList } from '@/api/user' 30 import { editDictNode, getChildDictList } from '@/api/user'
28 export default { 31 export default {
29 props: { 32 props: {
30 value: { type: Boolean, default: false }, 33 formData: {
31 details: { 34 type: Object,
32 type: Object, 35 default: () => { }
33 default: {} 36 }
34 } 37 },
35 }, 38 data () {
36 data () { 39 return {
37 return { 40 key: 0,
38 key: 0, 41 keyList: [],
39 myValue: this.value, 42 ruleForm: {
40 keyList: [], 43 dcode: '',
41 ruleForm: { 44 dname: ''
42 dcode: '', 45 },
43 dname: '' 46 column: [],
44 }, 47 columns: [
45 column: [], 48 {
46 columns: [ 49 width: '70',
47 { 50 renderHeader: (h, scope) => {
48 width: '70', 51 return (<div>
49 renderHeader: (h, scope) => { 52 {
50 return (<div> 53 this.formData.isenable === '0' ?
51 { 54 <span>序号</span> :
52 this.details.isenable === '0' ? 55 <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
53 <span>序号</span> : 56 }
54 <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i> 57 </div>)
55 }
56 </div>)
57 },
58 render: (h, scope) => {
59 return (
60 <span>{scope.row.index}</span>
61 )
62 }
63 }, 58 },
64 { 59 render: (h, scope) => {
65 prop: 'dcode', 60 return (
66 width: '100', 61 <span>{scope.row.index}</span>
67 label: '字典项编码', 62 )
68 render: (h, scope) => { 63 }
69 return ( 64 },
70 <div> 65 {
71 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]} 66 prop: 'dcode',
72 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} 67 width: '100',
73 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 68 label: '字典项编码',
74 69 render: (h, scope) => {
70 return (
71 <div>
72 <el-input placeholder="字典项编码" disabled={this.formData.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]}
73 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
74 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
75 75
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; }}
78 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
79 </div>
80 )
81 }
82 },
83 {
84 prop: 'dname',
85 label: '字典项名称',
86 render: (h, scope) => {
87 return (
88 <div>
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; }}
91 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
92 76
93 <el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]} 77 <el-input placeholder="字典项编码" disabled={this.formData.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]}
94 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} 78 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
95 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 79 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
96 </div> 80 </div>
97 ) 81 )
98 } 82 }
99 }, 83 },
100 { 84 {
101 prop: 'normcode', 85 prop: 'dname',
102 label: '部标编码', 86 label: '字典项名称',
103 width: '100', 87 render: (h, scope) => {
104 render: (h, scope) => { 88 return (
105 return ( 89 <div>
106 <div> 90 <el-input placeholder="字典项编码" disabled={this.formData.isenable == 2} v-show={scope.row.nameShow} 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]} 91 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
108 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} 92 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
109 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
110 93
111 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]} 94 <el-input placeholder="字典项名称" disabled={this.formData.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]}
112 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} 95 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
113 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 96 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
114 </div> 97 </div>
115 ) 98 )
116 } 99 }
117 }, 100 },
118 { 101 {
119 prop: 'normname', 102 prop: 'normcode',
120 label: '部标名称', 103 label: '部标编码',
121 render: (h, scope) => { 104 width: '100',
122 return ( 105 render: (h, scope) => {
123 <div> 106 return (
124 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]} 107 <div>
125 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} 108 <el-input placeholder="部标编码" disabled={this.formData.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]}
126 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 109 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
110 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
127 111
128 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]} 112 <el-input placeholder="部标编码" disabled={this.formData.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]}
129 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} 113 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
130 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 114 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
131 </div> 115 </div>
132 ) 116 )
133 }
134 },
135 {
136 prop: 'isenable',
137 width: '160',
138 label: '是否禁用',
139 render: (h, scope) => {
140 return (
141 <el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}>
142 <el-radio label="1">启用</el-radio>
143 <el-radio label="0">禁用</el-radio>
144 </el-radio-group>
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 }
171 } 117 }
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 })
192 }, 118 },
193 immediate: true 119 {
194 }, 120 prop: 'normname',
195 details: { 121 label: '部标名称',
196 handler: function (newValue) { 122 render: (h, scope) => {
197 if (newValue.isenable == 2) { 123 return (
198 this.column = this.columns.slice(0, 6) 124 <div>
199 } else { 125 <el-input placeholder="部标名称" disabled={this.formData.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]}
200 this.column = this.columns 126 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
127 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
128
129 <el-input placeholder="部标名称" disabled={this.formData.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]}
130 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
131 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
132 </div>
133 )
201 } 134 }
202 this.ruleForm = newValue.rowData
203 this.addIndexes()
204 this.key++
205 }, 135 },
206 deep: true 136 {
207 } 137 prop: 'isenable',
208 }, 138 width: '160',
209 methods: { 139 label: '是否禁用',
210 // 添加索引 140 render: (h, scope) => {
211 addIndexes (data = this.tableData, isAdd = true) { 141 return (
212 data.forEach((item, index) => { 142 <el-radio-group disabled={this.formData.isenable == 2} v-model={scope.row.isenable}>
213 if (index == 0) { 143 <el-radio label="1">启用</el-radio>
214 item.codeShow = true 144 <el-radio label="0">禁用</el-radio>
215 item.nameShow = false 145 </el-radio-group>
216 item.normcodeShow = false 146 )
217 item.normnameShow = false
218 } else {
219 item.codeShow = false
220 item.nameShow = false
221 item.normcodeShow = false
222 item.normnameShow = false
223 } 147 }
224 if (isAdd) { 148 },
225 item.index = index + 1 149 {
150 width: '130',
151 label: '移动',
152 render: (h, scope) => {
153 return (
154 <div>
155 <el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button>
156 <el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button >
157 </div >
158 )
226 } 159 }
227 if (item.children) { 160 },
228 this.addIndexes(item.children, false) 161 {
162 width: '150',
163 label: '操作',
164 render: (h, scope) => {
165 return (
166 <div>
167 <el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button>
168 <el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button>
169 </div>
170 )
229 } 171 }
230 }) 172 }
231 }, 173 ],
232 itemShowFalse () { 174 tableData: []
175 }
176 },
177 mounted () {
178 if (this.formData?.bsmDict) {
179 this.$startLoading();
180 getChildDictList(this.formData.bsmDict).then(res => {
181 this.$endLoading();
182 let { result } = res
183 this.tableData = result ? result : []
233 this.tableData.forEach((item, index) => { 184 this.tableData.forEach((item, index) => {
185 item.index = index + 1
186 })
187 this.tableData = judgeSort(this.tableData)
188 })
189 }
190 if (this.formData?.isenable == 2) {
191 this.column = this.columns.slice(0, 6)
192 } else {
193 this.column = this.columns
194 }
195 this.ruleForm = this.formData.rowData
196 this.addIndexes()
197 this.key++
198 },
199 methods: {
200 // 添加索引
201 addIndexes (data = this.tableData, isAdd = true) {
202 data.forEach((item, index) => {
203 if (index == 0) {
204 item.codeShow = true
205 item.nameShow = false
206 item.normcodeShow = false
207 item.normnameShow = false
208 } else {
234 item.codeShow = false 209 item.codeShow = false
235 item.nameShow = false 210 item.nameShow = false
236 item.normcodeShow = false 211 item.normcodeShow = false
237 item.normnameShow = false 212 item.normnameShow = false
213 }
214 if (isAdd) {
215 item.index = index + 1
216 }
217 if (item.children) {
218 this.addIndexes(item.children, false)
219 }
220 })
221 },
222 itemShowFalse () {
223 this.tableData.forEach((item, index) => {
224 item.codeShow = false
225 item.nameShow = false
226 item.normcodeShow = false
227 item.normnameShow = false
228 })
229 },
230 handleMinus (index, row) {
231 this.$confirm('此操作将永久删除, 是否继续?', '提示', {
232 confirmButtonText: '确定',
233 cancelButtonText: '取消',
234 type: 'warning'
235 }).then(() => {
236 removeTreeListItem(this.tableData, row.bsmDict)
237 this.$message({
238 type: 'success',
239 message: '删除成功!'
238 }) 240 })
239 }, 241 }).catch(() => {
240 handleMinus (index, row) { 242 this.$message({
241 this.$confirm('此操作将永久删除, 是否继续?', '提示', { 243 type: 'info',
242 confirmButtonText: '确定', 244 message: '已取消删除'
243 cancelButtonText: '取消', 245 })
244 type: 'warning' 246 })
245 }).then(() => { 247 },
246 removeTreeListItem(this.tableData, row.bsmDict) 248 handleSubmit () {
247 this.$message({ 249 this.$startLoading();
248 type: 'success', 250 editDictNode({
249 message: '删除成功!' 251 bsmDict: this.formData.rowData.bsmDict,
250 }) 252 typeid: this.formData.rowData.typeid,
251 }).catch(() => { 253 children: this.tableData
254 }).then(res => {
255 this.$endLoading();
256 if (res.code === 200) {
252 this.$message({ 257 this.$message({
253 type: 'info', 258 message: '修改成功',
254 message: '已取消删除' 259 type: 'success'
255 }) 260 })
256 }) 261 this.$emit('input', false)
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 = []
280 } 262 }
281 row.children.push( 263 }).catch((error) => {
282 { 264 this.$endLoading();
283 dcode: '', 265 })
284 dname: '', 266 },
285 isenable: '1', 267 // 增加下级
286 normcode: '', 268 handleAddSubordinate (row) {
287 normname: '', 269 if (!row.children) {
288 bsmDict: getUuid(32), 270 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
327 } 271 }
272 row.children.push(
273 {
274 dcode: '',
275 dname: '',
276 isenable: '1',
277 normcode: '',
278 normname: '',
279 bsmDict: getUuid(32),
280 typeid: row.typeid,
281 }
282 )
283 this.keyList = [];
284 this.keyList.push(row.bsmDict)
285 },
286 // 增加
287 handleAdd () {
288 this.$nextTick(() => {
289 let container = this.$el.querySelector('.el-table__body-wrapper');
290 container.scrollTop = container.scrollHeight;
291 })
292 this.tableData.push(
293 {
294 dcode: '',
295 dname: '',
296 isenable: '1',
297 normcode: '',
298 normname: '',
299 bsmDict: getUuid(32),
300 typeid: this.ruleForm.typeid,
301 }
302 )
303 this.addIndexes()
304 this.key++
305 },
306 // 上移下移
307 moveUpward (index, row) {
308 realMove(row.bsmDict, 'UP', this.tableData)
309 this.key++
310 let id = findParents(this.tableData, row.bsmDict)
311 this.keyList = id
312 },
313 moveDown (index, row) {
314 realMove(row.bsmDict, 'DOWN', this.tableData)
315 this.key++
316 let id = findParents(this.tableData, row.bsmDict)
317 this.keyList = id
328 } 318 }
329 } 319 }
320 }
330 </script> 321 </script>
331 <style rel="stylesheet/scss" lang="scss" scoped> 322 <style rel="stylesheet/scss" lang="scss" scoped>
332 @import "~@/styles/dialogBoxheader.scss"; 323 @import "~@/styles/dialogBoxheader.scss";
333 /deep/.el-radio { 324
334 margin-right: 5px !important; 325 /deep/.el-radio {
335 } 326 margin-right: 5px !important;
327 }
336 </style> 328 </style>
337 329
......
1 /*
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-04-11 10:49:40
5 */
1 import filter from '@/utils/filter.js' 6 import filter from '@/utils/filter.js'
2 let vm = null 7 let vm = null
3 8
...@@ -32,7 +37,6 @@ class data extends filter { ...@@ -32,7 +37,6 @@ class data extends filter {
32 }, 37 },
33 { 38 {
34 label: "是否允许修改", 39 label: "是否允许修改",
35 width: '110',
36 render: (h, scope) => { 40 render: (h, scope) => {
37 return ( 41 return (
38 <div> 42 <div>
...@@ -47,9 +51,7 @@ class data extends filter { ...@@ -47,9 +51,7 @@ class data extends filter {
47 }, 51 },
48 { 52 {
49 label: '操作', 53 label: '操作',
50 width: '150', 54 width: '80',
51 align: 'center',
52 fixed: 'right',
53 render: (h, scope) => { 55 render: (h, scope) => {
54 return ( 56 return (
55 <div> 57 <div>
...@@ -64,7 +66,6 @@ class data extends filter { ...@@ -64,7 +66,6 @@ class data extends filter {
64 } 66 }
65 ] 67 ]
66 } 68 }
67
68 } 69 }
69 let datas = new data() 70 let datas = new data()
70 export { 71 export {
......
...@@ -30,7 +30,6 @@ ...@@ -30,7 +30,6 @@
30 :column="tableData.columns" :data="tableData.data"> 30 :column="tableData.columns" :data="tableData.data">
31 </lb-table> 31 </lb-table>
32 </div> 32 </div>
33 <editDialog v-model="isDialog" :details="details" />
34 </div> 33 </div>
35 </template> 34 </template>
36 <script> 35 <script>
...@@ -49,7 +48,6 @@ export default { ...@@ -49,7 +48,6 @@ export default {
49 }, 48 },
50 data () { 49 data () {
51 return { 50 return {
52 isDialog: false,
53 details: { 51 details: {
54 bsmDict: '', 52 bsmDict: '',
55 isenable: 1, 53 isenable: 1,
...@@ -103,11 +101,12 @@ export default { ...@@ -103,11 +101,12 @@ export default {
103 }); 101 });
104 }); 102 });
105 }, 103 },
104 // 修改
106 editClick (row, val) { 105 editClick (row, val) {
107 this.details.rowData = row 106 this.details.rowData = row
108 this.details.isenable = val 107 this.details.isenable = val
109 this.details.bsmDict = row.bsmDict 108 this.details.bsmDict = row.bsmDict
110 this.isDialog = true 109 this.$popupDialog("字典信息", "system/dictionaries/components/editDialog", this.details)
111 } 110 }
112 } 111 }
113 } 112 }
......