自定义头部参数相关代码备份
							parent
							
								
									b903eae51c
								
							
						
					
					
						commit
						2043524bf0
					
				| @ -0,0 +1,10 @@ | |||||||
|  | import axios from '@/utils/request' | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | export function getHeadSet(query) { | ||||||
|  |   return axios({ | ||||||
|  |     url: "/udiwms/sys/table/head/find", | ||||||
|  |     method: "get", | ||||||
|  |     params: query | ||||||
|  |   }); | ||||||
|  | } | ||||||
											
												
													File diff suppressed because it is too large
													Load Diff
												
											
										
									
								
											
												
													File diff suppressed because it is too large
													Load Diff
												
											
										
									
								| @ -0,0 +1,107 @@ | |||||||
|  | <template> | ||||||
|  |   <div class="table-head"> | ||||||
|  |     <p class="tip"> | ||||||
|  |       <i class="el-icon-s-opportunity"></i> | ||||||
|  |       <span> 可拖动行排序</span> | ||||||
|  |     </p> | ||||||
|  |     <el-table | ||||||
|  |         row-key="prop" | ||||||
|  |         :data="tableShowList"> | ||||||
|  |       <el-table-column prop="label" label="表头名称" align="center"></el-table-column> | ||||||
|  |       <el-table-column label="是否显示" width="120" align="center"> | ||||||
|  |         <template slot-scope="scope"> | ||||||
|  |           <el-checkbox v-model="scope.row.isShow"></el-checkbox> | ||||||
|  |         </template> | ||||||
|  |       </el-table-column> | ||||||
|  |       <el-table-column label="调整顺序" width="120" align="center"> | ||||||
|  |         <template slot-scope="scope"> | ||||||
|  |           <i class="el-icon-rank"></i> | ||||||
|  |         </template> | ||||||
|  |       </el-table-column> | ||||||
|  |       <el-table-column label="调整表头宽度"> | ||||||
|  |         <template slot-scope="scope"> | ||||||
|  |           <div class="flex-col"> | ||||||
|  |             <div> | ||||||
|  |               <el-radio v-model="scope.row.isAuto" :label="true">自适应</el-radio> | ||||||
|  |             </div> | ||||||
|  |             <div> | ||||||
|  |               <el-radio v-model="scope.row.isAuto" :label="false">固定宽度</el-radio> | ||||||
|  |               <el-input-number v-show="!scope.row.isAuto" v-model="scope.row.width" size="mini" | ||||||
|  |                                controls-position="right" :min="100" :max="300"></el-input-number> | ||||||
|  |             </div> | ||||||
|  |           </div> | ||||||
|  |         </template> | ||||||
|  |       </el-table-column> | ||||||
|  |     </el-table> | ||||||
|  |     <div slot="footer" class="dialog-footer tc"> | ||||||
|  |       <el-button size="medium" class="btn-wh" @click="isTableHead = false">关闭</el-button> | ||||||
|  |       <el-button size="medium" class="btn-blue" type="primary" @click="saveTableHead()">保存</el-button> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  | <script> | ||||||
|  | import Sortable from 'sortablejs'; | ||||||
|  | 
 | ||||||
|  | export default { | ||||||
|  |   name: "tableHead", | ||||||
|  |   props: { | ||||||
|  |     tableShowList: Array | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       isTableHead: false | ||||||
|  |     }; | ||||||
|  |   }, | ||||||
|  |   methods: { | ||||||
|  |     rowDrop() { | ||||||
|  |       debugger | ||||||
|  |       const tbody = document.querySelector('.table-head .el-table__body-wrapper tbody'); | ||||||
|  |       const _this = this; | ||||||
|  |       Sortable.create(tbody, { | ||||||
|  |         onEnd({newIndex, oldIndex}) { | ||||||
|  |           const currRow = _this.tableShowList.splice(oldIndex, 1)[0]; | ||||||
|  |           _this.tableShowList.splice(newIndex, 0, currRow); | ||||||
|  |         } | ||||||
|  |       }); | ||||||
|  |     }, | ||||||
|  |     saveTableHead() { | ||||||
|  |       this.isTableHead = false; | ||||||
|  |       this.$emit('saveTableHead', this.tableShowList); | ||||||
|  |     }, | ||||||
|  | 
 | ||||||
|  |   }, | ||||||
|  |   created() { | ||||||
|  |     debugger | ||||||
|  |     this.rowDrop(); | ||||||
|  |   } | ||||||
|  | }; | ||||||
|  | </script> | ||||||
|  | 
 | ||||||
|  | <style lang="scss" scoped> | ||||||
|  | .table-head { | ||||||
|  | 
 | ||||||
|  |   .tip { | ||||||
|  | 
 | ||||||
|  |     i { | ||||||
|  |       color: #E6A23C; | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     font-size: 14px; | ||||||
|  |     padding-bottom: 10px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   .el-icon-rank { | ||||||
|  |     font-size: 18px; | ||||||
|  |     margin-left: 20px; | ||||||
|  |     cursor: move; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   .point { | ||||||
|  |     color: #66b1ff; | ||||||
|  | 
 | ||||||
|  |     &:hover { | ||||||
|  |       color: #1A3679; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </style> | ||||||
| @ -0,0 +1,13 @@ | |||||||
|  | <template> | ||||||
|  | 
 | ||||||
|  | </template> | ||||||
|  | 
 | ||||||
|  | <script> | ||||||
|  | export default { | ||||||
|  |   name: "AddHeadData" | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  | 
 | ||||||
|  | <style scoped> | ||||||
|  | 
 | ||||||
|  | </style> | ||||||
					Loading…
					
					
				
		Reference in New Issue