export.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. <template>
  2. <div class="flex-count">
  3. <div class="flex-num">
  4. <div class="time-title">已选({{ num }})项</div>
  5. <div v-if="!approvalStatus" class="flex-time">
  6. <div class="time-title">时间:</div>
  7. <el-date-picker
  8. v-model="seachList"
  9. type="daterange"
  10. start-placeholder="开始日期"
  11. end-placeholder="结束日期"
  12. value-format="yyyy-MM-dd"
  13. :default-time="['00:00:00', '23:59:59']">
  14. size="small"
  15. </el-date-picker>
  16. <el-button
  17. type="primary"
  18. @click="clickSeach"
  19. plain
  20. >搜索</el-button
  21. >
  22. </div>
  23. </div>
  24. <div class="flex-num" v-if="exportStatusList">
  25. <!-- <el-button
  26. type="primary"
  27. @click="clickApproval"
  28. v-if="approvalStatus"
  29. plain
  30. >批量审批</el-button
  31. > -->
  32. <el-button type="primary" @click="clickExport" v-if="exportStatus" plain
  33. >批量导出</el-button
  34. >
  35. </div>
  36. </div>
  37. </template>
  38. <script>
  39. export default {
  40. props: {
  41. num: {
  42. type: Number,
  43. default: () => [],
  44. },
  45. exportStatusList: {
  46. type:Boolean,
  47. default: () => [],
  48. },
  49. },
  50. data() {
  51. return {
  52. seachList:'',
  53. approvalStatus: true,
  54. exportStatus: true,
  55. };
  56. },
  57. methods: {
  58. clickExport() {
  59. if (this.approvalStatus) {
  60. this.approvalStatus = false;
  61. this.$emit("clickexport", true);
  62. } else {
  63. this.$emit("export", true);
  64. }
  65. },
  66. clickApproval() {
  67. this.$emit('clickApproval',true)
  68. },
  69. clickSeach(){
  70. this.$emit('seachExportList',this.seachList)
  71. }
  72. },
  73. created() {
  74. },
  75. };
  76. </script>
  77. <style lang="scss" scoped>
  78. .time-title {
  79. margin-right: 20px;
  80. height: 40px;
  81. line-height: 40px;
  82. }
  83. .flex-count {
  84. display: flex;
  85. justify-content: space-between;
  86. .flex-num {
  87. margin: 1%;
  88. display: flex;
  89. .flex-time {
  90. display: flex;
  91. margin-left: 20px;
  92. margin-right: 20px;
  93. }
  94. }
  95. }
  96. </style>