turnovercar-search.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. <!-- 搜索表单 -->
  2. <template>
  3. <el-form
  4. label-width="75px"
  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="编码:" label-width="50px">
  12. <el-input clearable v-model="where.code" placeholder="请输入" />
  13. </el-form-item>
  14. <el-form-item label="型号:" label-width="50px">
  15. <el-input clearable v-model="where.spaceModule" placeholder="请输入" />
  16. </el-form-item>
  17. </el-col>
  18. <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  19. <el-form-item label="名称:" label-width="50px">
  20. <el-input clearable v-model="where.name" placeholder="请输入" />
  21. </el-form-item>
  22. <el-form-item label="所在部门:">
  23. <ele-tree-select
  24. clearable
  25. :data="treeData"
  26. v-model="where.dept"
  27. placeholder="请选择"
  28. default-expand-all
  29. labelKey="name"
  30. valueKey="id"
  31. />
  32. </el-form-item>
  33. </el-col>
  34. <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  35. <el-form-item label="固定资产编码:" label-width="100px">
  36. <el-input clearable v-model="where.fixCode" placeholder="请输入" />
  37. </el-form-item>
  38. <el-form-item label="生命周期:">
  39. <DictSelection dictName="生命周期" clearable v-model="where.source">
  40. </DictSelection>
  41. </el-form-item>
  42. </el-col>
  43. <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
  44. <el-form-item label="材质:" label-width="50px">
  45. <el-input clearable v-model="where.texture" placeholder="请输入" />
  46. </el-form-item>
  47. <div class="ele-form-actions">
  48. <el-button
  49. type="primary"
  50. icon="el-icon-search"
  51. class="ele-btn-icon"
  52. @click="search"
  53. size="small"
  54. >
  55. 查询
  56. </el-button>
  57. <el-button @click="reset"
  58. icon="el-icon-refresh-left"
  59. size="small"
  60. type="primary"
  61. >重置</el-button>
  62. </div>
  63. </el-col>
  64. </el-row>
  65. </el-form>
  66. </template>
  67. <script>
  68. import { login } from '@/api/login';
  69. import {
  70. listOrganizations
  71. } from '@/api/system/organization';
  72. export default {
  73. data() {
  74. // 默认表单数据
  75. const defaultWhere = {
  76. name: '',
  77. code: '',
  78. fixCode:'',
  79. // source:'',
  80. // texture:'',
  81. // spaceModule:'',
  82. // dept:''
  83. };
  84. return {
  85. // 表单数据
  86. where: { ...defaultWhere },
  87. treeData:[]
  88. };
  89. },
  90. computed: {
  91. // 是否开启响应式布局
  92. styleResponsive() {
  93. return this.$store.state.theme.styleResponsive;
  94. }
  95. },
  96. created(){
  97. this.query()
  98. },
  99. methods: {
  100. /* 搜索 */
  101. search() {
  102. console.log(this.where);
  103. this.$emit('search', this.where);
  104. },
  105. /* 重置 */
  106. reset() {
  107. this.where = { ...this.defaultWhere };
  108. this.search();
  109. },
  110. query() {
  111. listOrganizations()
  112. .then((list) => {
  113. this.treeData = this.$util.toTreeData({
  114. data: list,
  115. idField: 'id',
  116. parentIdField: 'parentId'
  117. });
  118. })
  119. .catch((e) => {
  120. });
  121. },
  122. }
  123. };
  124. </script>