user-search.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. <!-- 搜索表单 -->
  2. <template>
  3. <el-form
  4. label-width="77px"
  5. class="ele-form-search"
  6. @keyup.enter.native="search"
  7. @submit.native.prevent
  8. >
  9. <el-row :gutter="15">
  10. <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  11. <el-form-item label="质检名称:">
  12. <el-input clearable v-model="where.name" placeholder="请输入" />
  13. </el-form-item>
  14. </el-col>
  15. <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  16. <el-form-item label="参数名称:">
  17. <el-input clearable v-model="where.inspectionName" placeholder="请输入" />
  18. </el-form-item>
  19. </el-col>
  20. <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  21. <el-form-item label="默认值:">
  22. <el-input clearable v-model="where.defaultValue" placeholder="请输入" />
  23. </el-form-item>
  24. </el-col>
  25. <!-- <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  26. <el-form-item label="组织机构:">
  27. <auth-selection
  28. data-type="Array"
  29. v-model="where.deptIds"
  30. style="width: 100%"
  31. ></auth-selection>
  32. </el-form-item>
  33. </el-col>-->
  34. <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  35. <el-form-item label-width="5px">
  36. <el-button
  37. type="primary"
  38. icon="el-icon-search"
  39. class="ele-btn-icon"
  40. @click="search"
  41. size="small"
  42. >查询</el-button>
  43. <el-button @click="reset" icon="el-icon-refresh-left" size="small" type="primary">重置</el-button>
  44. </el-form-item>
  45. </el-col>
  46. </el-row>
  47. </el-form>
  48. </template>
  49. <script>
  50. export default {
  51. data() {
  52. // 默认表单数据
  53. const defaultWhere = {
  54. name: '',
  55. inspectionName: '',
  56. status: 1,
  57. defaultValue:''
  58. };
  59. return {
  60. // 表单数据
  61. where: { ...defaultWhere }
  62. };
  63. },
  64. computed: {
  65. // 是否开启响应式布局
  66. styleResponsive() {
  67. return this.$store.state.theme.styleResponsive;
  68. }
  69. },
  70. methods: {
  71. /* 搜索 */
  72. search() {
  73. this.$emit('search', this.where);
  74. },
  75. /* 重置 */
  76. reset() {
  77. this.where = { ...this.defaultWhere };
  78. this.search();
  79. }
  80. }
  81. };
  82. </script>