vue + element 写查询检索框

vue + element 写查询检索框

1.先写一个检索用的弹窗:
点击设置的按键–会出现该弹窗
下面展示一些 内联代码片


	      
	        
	        
	          
	        
	        
	          
	        
	        
	          
	            
	            
	          
	        
	        
查询 重置 确认

2.需要写在下面的方法

methods :
cleanqueryinput () {
      this.formData.fTypeCode = ''
      this.formData.fTypeName = ''
      this.$forceUpdate()
    },
// 点击检索按钮
    getfTypeCoce () {
      this.getTypeListData()
      this.chooseOrgVisible = true
    },
// 弹窗关闭
    addEditFormOnClose () {
      this.queryTypeData.fTypeCoce = ''
      this.queryTypeData.fTypeName = ''
      this.queryTypeResult = []
      this.chooseOrgVisible = false
      this.isSelected = true
    },
// 清空弹窗的输入框
    cleanQueryData1 () {
      this.queryTypeData.fTypeCoce = ''
      this.queryTypeData.fTypeName = ''
      this.queryTypeData.fAuditStatus = ''
    },
 // 选中行
    rowClick (row, event, column) {
      this.nowClickRow = row
      this.isSelected = false
    },
// 将弹窗数据赋值到查询输入框
    returnMember ($index = 'empty') {
      this.formData.fTypeCode = this.nowClickRow.fTypeCoce
      this.formData.fTypeName = this.nowClickRow.fTypeName
      this.queryTypeResult = []
      this.chooseOrgVisible = false
      this.isSelected = true
    },
// 当前页面大小
    handleSizeChange1 (num) {
      this.pagination1.pageSize = this.queryTypeData.pageSize = num
      this.getTypeListData()
    },
 // 当前page
    handleCurrentChange1 (num) {
      this.pagination1.pageNum = this.queryTypeData.pageNum = num
      this.getTypeListData()
    },
 // 查询按钮
    getTotalListData1 () {
      this.isSelected = true
      this.pagination1.pageNum = 1
      this.getTypeListData()
    },
// 查询方法
    getTypeListData () {
      this.updateEditSubmitLoading1 = true
      this.listLoading1 = true
      this.queryTypeData.pageNum = this.pagination1.pageNum
      this.queryTypeData.pageSize = this.pagination1.pageSize
      this.$http.post(this.API.getTypeConfigList, this.queryTypeData).then(response => {
        console.log(response)
        this.queryTypeResult = response.data.data.pag
        this.pagination1.total = parseInt(response.data.data.total)
        this.updateEditSubmitLoading1 = false
        this.listLoading1 = false
      }).catch((response) => {
        console.error(response)
        this.updateEditSubmitLoading1 = false
        this.listLoading1 = false
        this.$message.error('操作失败')
      })
    },

你可能感兴趣的:(vue.js)