Blame view

ant-design-vue-jeecg/src/views/jeecg/modules/SuperQueryModal.vue 2.94 KB
肖超群 authored
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<template>
  <a-modal
    title="高级查询构造器"
    :width="800"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    :mask="false"
    okText="查询"
    @cancel="handleCancel"
    cancelText="关闭">

    <a-spin :spinning="confirmLoading">
      <a-form>
        <div>
肖超群 authored
16
17
          <a-row type="flex" style="margin-bottom:10px" :gutter="16" v-for="(item, index) in queryParamsModel"
                 :key="index">
肖超群 authored
18
            <a-col :span="6">
肖超群 authored
19
              <a-select placeholder="选择查询字段" v-model="item.field">
肖超群 authored
20
21
22
23
24
25
26
                <a-select-option value="name">用户名</a-select-option>
                <a-select-option value="key_word">关键词</a-select-option>
                <a-select-option value="birthday">生日</a-select-option>
                <a-select-option value="age">年龄</a-select-option>
              </a-select>
            </a-col>
            <a-col :span="6">
肖超群 authored
27
              <a-select placeholder="选择匹配规则" v-model="item.rule">
肖超群 authored
28
29
30
31
32
33
34
35
36
37
38
39
40
41
                <a-select-option value="=">等于</a-select-option>
                <a-select-option value="!=">不等于</a-select-option>
                <a-select-option value=">">大于</a-select-option>
                <a-select-option value=">=">大于等于</a-select-option>
                <a-select-option value="<">小于</a-select-option>
                <a-select-option value="<=">小于等于</a-select-option>
                <a-select-option value="LEFT_LIKE">以..开始</a-select-option>
                <a-select-option value="RIGHT_LIKE">以..结尾</a-select-option>
                <a-select-option value="LIKE">包含</a-select-option>
                <a-select-option value="IN">在...中</a-select-option>
              </a-select>
            </a-col>

            <a-col :span="6">
肖超群 authored
42
43
44
45
46
              <a-input placeholder="请输入值" v-model="item.val"/>
            </a-col>
            <a-col :span="6">
              <a-button @click="handleAdd" icon="plus"></a-button>&nbsp;
              <a-button @click="handleDel( index )" icon="minus"></a-button>
肖超群 authored
47
48
49
50
51
52
53
54
55
56
            </a-col>
          </a-row>
        </div>

      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
肖超群 authored
57
import {httpAction} from '@/api/manage'
肖超群 authored
58
肖超群 authored
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
export default {
  name: "SuperQueryModal",
  data() {
    return {
      visible: false,
      queryParamsModel: [{}, {}],
      confirmLoading: false
    }
  },
  created() {
  },
  methods: {
    show() {
      this.visible = true;
    },
    close() {
      this.$emit('close');
      this.visible = false;
    },
    handleOk() {
      console.log(this.queryParamsModel)
      // 子组件中触发父组件方法ee并传值cc12345
      this.$emit('handleSuperQuery', this.queryParamsModel)
    },
    handleCancel() {
      this.close()
肖超群 authored
85
    },
肖超群 authored
86
87
    handleAdd() {
      this.queryParamsModel.push({});
肖超群 authored
88
    },
肖超群 authored
89
90
91
    handleDel(index) {
      console.log(index)
      this.queryParamsModel.splice(index, 1);
肖超群 authored
92
93
    }
  }
肖超群 authored
94
}
肖超群 authored
95
96
97
98
</script>

<style scoped>
</style>