index.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. <template>
  2. <div class="changeApply">
  3. <div class="applyList" v-if="isList">
  4. <el-row :gutter="10" class="mb10">
  5. <el-col :span="1.5">
  6. <el-select size="small" v-model="textValue" placeholder="请选择">
  7. <el-option
  8. v-for="item in text"
  9. :key="item.value"
  10. :label="item.label"
  11. :value="item.value">
  12. </el-option>
  13. </el-select>
  14. <el-select size="small" v-model="ruleValue" placeholder="请选择">
  15. <el-option
  16. v-for="item in rule"
  17. :key="item.value"
  18. :label="item.label"
  19. :value="item.value">
  20. </el-option>
  21. </el-select>
  22. <el-input
  23. v-model="input"
  24. size="small"
  25. placeholder="请输入"
  26. clearable
  27. style="width: 240px"
  28. />
  29. </el-col>
  30. <el-col :span="1.5">
  31. <el-button type="primary" size="small" plain>查询</el-button>
  32. </el-col>
  33. <el-col :span="1.5">
  34. <el-button type="primary" size="small" plain>高级查询</el-button>
  35. </el-col>
  36. <el-col :span="1.5">
  37. <el-button type="primary" size="small" plain>重置</el-button>
  38. </el-col>
  39. </el-row>
  40. <el-row :gutter="10" class="mb10">
  41. <el-col :span="1.5">
  42. <el-button type="primary" size="small" plain @click="addApply">新增</el-button>
  43. </el-col>
  44. <el-col :span="1.5">
  45. <el-button type="primary" size="small" plain>导入</el-button>
  46. </el-col>
  47. <el-col :span="1.5">
  48. <el-button type="primary" size="small" plain>导出</el-button>
  49. </el-col>
  50. <el-col :span="1.5">
  51. <el-button type="primary" size="small" plain>批量提交</el-button>
  52. </el-col>
  53. <el-col :span="1.5">
  54. <el-button type="primary" size="small" plain>批量删除</el-button>
  55. </el-col>
  56. </el-row>
  57. <el-card>
  58. <el-table
  59. :data="tableList"
  60. class="request-table"
  61. @selection-change="handleSelectionChange"
  62. >
  63. <el-table-column type="selection" width="55" />
  64. <el-table-column label="序号" align="center" prop="sort" />
  65. <el-table-column label="申请组织" align="center" prop="attributeName" />
  66. <el-table-column label="单据编码" align="center" prop="classCode" />
  67. <el-table-column label="申请人" align="center" prop="fieldType" />
  68. <el-table-column label="申请时间" align="center" prop="dictId" />
  69. <el-table-column label="单据状态" align="center" prop="fieldDesc" />
  70. <el-table-column label="物料编码" align="center" prop="fieldDesc" />
  71. <el-table-column label="物料名称" align="center" prop="fieldDesc" />
  72. <el-table-column label="最后审批人" align="center" prop="fieldDesc" />
  73. <el-table-column label="最后审核时间" align="center" prop="fieldDesc" />
  74. <el-table-column label="创建人" align="center" prop="fieldDesc" />
  75. <el-table-column label="创建时间" align="center" prop="fieldDesc" />
  76. <el-table-column label="最后修改人" align="center" prop="fieldDesc" />
  77. <el-table-column label="最后修改时间" align="center" prop="fieldDesc" />
  78. <el-table-column
  79. fixed="right"
  80. label="操作"
  81. align="center"
  82. >
  83. <template slot-scope="scope">
  84. <el-button type="text" size="small">查看</el-button>
  85. <el-button @click="edit(scope.row)" type="text" size="small">修改</el-button>
  86. <el-button type="text" size="small">更多</el-button>
  87. </template>
  88. </el-table-column>
  89. </el-table>
  90. <el-pagination
  91. @size-change="handleSizeChange"
  92. @current-change="handleCurrentChange"
  93. :current-page="currentPage"
  94. :page-sizes="[100, 200, 300, 400]"
  95. :page-size="100"
  96. layout="total, sizes, prev, pager, next, jumper"
  97. :total="100"
  98. style="text-align: center;">
  99. </el-pagination>
  100. </el-card>
  101. </div>
  102. <component :is="isComponent" v-model="isList" v-if="!isList"/>
  103. </div>
  104. </template>
  105. <script>
  106. import addApply from './add.vue';
  107. export default {
  108. name: 'changeApply',
  109. components: {
  110. addApply
  111. },
  112. data() {
  113. return{
  114. textValue: 1,
  115. text: [{label: '文本字段', value: 1}, {label: '字典字段', value: 2}],
  116. ruleValue: 1,
  117. rule:[{label: '包含', value: 1}, {label: '不包含', value: 2}, {label: '等于', value: 3}, {label: '不等于', value: 4}],
  118. input: '',
  119. //
  120. tableList: [],
  121. currentPage: 2,
  122. // isComponent
  123. isComponent:'addApply',
  124. isList: true
  125. }
  126. },
  127. methods: {
  128. addApply() {
  129. this.isList = false
  130. this.isComponent = 'addApply'
  131. },
  132. //
  133. handleSelectionChange () {
  134. },
  135. edit() {
  136. },
  137. handleSizeChange(val) {
  138. console.log(`每页 ${val} 条`);
  139. },
  140. handleCurrentChange(val) {
  141. console.log(`当前页: ${val}`);
  142. }
  143. }
  144. }
  145. </script>
  146. <style scoped lang="scss">
  147. .changeApply {
  148. height: calc(100vh - 84px);
  149. padding: 12px;
  150. box-sizing: border-box;
  151. }
  152. </style>