issue.vue 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
  1. <template>
  2. <div>
  3. <div class="simple-container">
  4. <simple-form
  5. :form="table_form"
  6. @search="handleSearch"
  7. ></simple-form>
  8. <simple-table
  9. :list="table_list"
  10. :config="table_config"
  11. :loading="table_loading"
  12. :handle-row="table_handle_row"
  13. @detail="handleVisible"
  14. @edit="handleVisible"
  15. ></simple-table>
  16. <simple-pagination
  17. :page="page"
  18. :total="total"
  19. @change="handleChange"
  20. ></simple-pagination>
  21. </div>
  22. <simple-dialog
  23. title="查看"
  24. fullscreen
  25. @cancel="handleVisible"
  26. @confirm="handleVisible"
  27. :visible="template_visible"
  28. ><div class="flex-justify-between padding-right-20 padding-left-20">
  29. <div class="color-ffffff">1</div>
  30. <div>
  31. <el-button type="primary">导出</el-button>
  32. <el-button @click="handleVisible" type="primary">返回</el-button>
  33. </div>
  34. </div>
  35. <analysis />
  36. <template v-slot:footer><div></div></template>
  37. </simple-dialog>
  38. </div>
  39. </template>
  40. <script>
  41. import analysis from "./analysis.vue";
  42. import simpleForm from "./components/form.vue";
  43. import simpleTable from "./components/table.vue";
  44. import simpleDialog from "./components/dialog.vue";
  45. import simplePagination from "./components/pagination.vue";
  46. export default {
  47. components: {
  48. analysis,
  49. simpleTable,
  50. simpleDialog,
  51. simpleForm,
  52. simplePagination,
  53. },
  54. data() {
  55. return {
  56. page: 1,
  57. rows: 10,
  58. total: 0,
  59. template_visible: false,
  60. table_loading: false,
  61. table_search: {},
  62. table_form: [
  63. {
  64. label: "模板名称",
  65. props: "template_name",
  66. type: "select",
  67. dictionary: [
  68. {
  69. label: "GS",
  70. value: "GS",
  71. },
  72. {
  73. label: "KPI",
  74. value: "KPI",
  75. },
  76. ],
  77. },
  78. {
  79. label: "截止日期",
  80. props: "date",
  81. type: "date",
  82. },
  83. ],
  84. table_list: [],
  85. table_handle_row: [
  86. {
  87. label: "查看",
  88. props: "detail",
  89. },
  90. // {
  91. // label: "修改",
  92. // props: "edit",
  93. // },
  94. {
  95. label: "撤回",
  96. props: "delete",
  97. popconfirm: true,
  98. },
  99. ],
  100. table_config: [
  101. {
  102. label: "绩效类型",
  103. props: "performance_type",
  104. },
  105. {
  106. label: "模板名称",
  107. props: "template_name",
  108. },
  109. {
  110. label: "填报事由",
  111. props: "reason",
  112. },
  113. {
  114. label: "填报注意事项",
  115. props: "note",
  116. },
  117. {
  118. label: "截止时间",
  119. props: "date",
  120. },
  121. {
  122. label: "接收人",
  123. props: "receiver",
  124. },
  125. ],
  126. };
  127. },
  128. methods: {
  129. async handleInit() {
  130. this.table_loading = true;
  131. const data = [];
  132. let index = 0;
  133. while (index < 10) {
  134. data.push({
  135. performance_type: `GS`,
  136. template_name: `信息技术中心2021年度部门GS绩效计划(${index})`,
  137. reason: `填报事由${index}`,
  138. note: `填报注意事项${index}`,
  139. date: `2021.02.01`,
  140. receiver: `邱钰、郭鹏`,
  141. });
  142. index = index + 1;
  143. }
  144. this.total = index;
  145. this.table_list = data;
  146. this.table_loading = false;
  147. },
  148. handleSearch({ template_name }) {
  149. this.table_search = { template_name };
  150. this.handleReset();
  151. this.handleInit();
  152. },
  153. handleChange(page) {
  154. this.page = page;
  155. this.handleInit();
  156. },
  157. handleVisible() {
  158. this.template_visible = !this.template_visible;
  159. },
  160. handleReset() {
  161. this.page = 1;
  162. },
  163. },
  164. mounted() {
  165. this.handleInit();
  166. },
  167. };
  168. </script>
  169. <style></style>