searchTable.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <!-- 搜索表单 -->
  2. <template>
  3. <el-form
  4. label-width="100px"
  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="发货单编码:" prop="docNo">
  12. <el-input
  13. clearable
  14. placeholder="请输入"
  15. v-model.trim="params.docNo"
  16. ></el-input>
  17. </el-form-item>
  18. <el-form-item label="订单编码:" prop="orderNo">
  19. <el-input
  20. clearable
  21. placeholder="请输入"
  22. v-model.trim="params.orderNo"
  23. ></el-input>
  24. </el-form-item>
  25. </el-col>
  26. <el-col v-bind="styleResponsive ? { lg:6, md: 12 } : { span:6 }">
  27. <el-form-item label="是否回执:" prop="replied">
  28. <el-select v-model="params.replied" placeholder="请选择" class="w100" clearable>
  29. <el-option
  30. v-for="item in repliedOptions"
  31. :key="item.value"
  32. :label="item.label"
  33. :value="item.value"
  34. ></el-option>
  35. </el-select>
  36. </el-form-item>
  37. <!-- <el-form-item label="审核状态:" prop="reviewStatus">-->
  38. <!-- <el-select v-model="params.reviewStatus" placeholder="请选择" class="w100" clearable>-->
  39. <!-- <el-option-->
  40. <!-- v-for="item in reviewStatusEnum"-->
  41. <!-- :key="item.value"-->
  42. <!-- :label="item.label"-->
  43. <!-- :value="item.value"-->
  44. <!-- ></el-option>-->
  45. <!-- </el-select>-->
  46. <!-- </el-form-item>-->
  47. </el-col>
  48. <el-col v-bind="styleResponsive ? { lg:6, md: 12 } : { span:6 }">
  49. <el-form-item label="客户名称:" prop="contactName">
  50. <el-input
  51. placeholder="请输入"
  52. style="max-width:320px"
  53. v-model.trim="params.contactName" controls-position="right" >
  54. </el-input>
  55. </el-form-item>
  56. </el-col>
  57. <el-col v-bind="styleResponsive ? { lg:6, md: 12 } : { span:4 }">
  58. <div class="ele-form-actions">
  59. <el-button
  60. type="primary"
  61. icon="el-icon-search"
  62. class="ele-btn-icon"
  63. @click="search"
  64. >
  65. 查询
  66. </el-button>
  67. <el-button @click="reset">重置</el-button>
  68. </div>
  69. </el-col>
  70. </el-row>
  71. </el-form>
  72. </template>
  73. <script>
  74. import {reviewStatusEnum} from '@/enum/dict';
  75. const repliedOptions=[
  76. {value:0,label:'否'},
  77. {value:1,label:'是'},
  78. ]
  79. export default {
  80. data () {
  81. // 默认表单数据
  82. const defaultParams = {
  83. contractName: '',
  84. contractId:'',
  85. docNo:'',
  86. orderId:'',
  87. replied:null,
  88. reviewStatus:null
  89. };
  90. return {
  91. reviewStatusEnum,
  92. defaultParams,
  93. repliedOptions,
  94. // 表单数据
  95. params: { ...defaultParams }
  96. };
  97. },
  98. computed: {
  99. // 是否开启响应式布局
  100. styleResponsive () {
  101. return this.$store.state.theme.styleResponsive;
  102. }
  103. },
  104. methods: {
  105. //选择时间
  106. changeDate(e){
  107. this.createTime=e
  108. },
  109. /* 搜索 */
  110. search () {
  111. this.$emit('search', {
  112. ...this.params
  113. });
  114. },
  115. /* 重置 */
  116. reset () {
  117. this.createTime=[]
  118. this.params = Object.assign({},{ ...this.defaultParams });
  119. this.search();
  120. }
  121. }
  122. };
  123. </script>