index.vue 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. <script lang="ts">
  2. // 声明额外的选项
  3. export default {
  4. name: "PageUpdateInfo"
  5. };
  6. </script>
  7. <script setup lang="ts">
  8. import { provide } from "vue";
  9. import { usePageUpdateInfo } from "./hook";
  10. import { http } from "@/utils/http";
  11. import { useRenderIcon, hasAuth, PureTableBar } from "@/utils/importUsed"
  12. import Add from "./components/add/index.vue";
  13. import EditUpdate from "./components/update/index.vue";
  14. import EditUpVersion from "./components/upVersion/index.vue";
  15. import Search from "@iconify-icons/ep/search";
  16. import Addicon from "@iconify-icons/ep/document-add";
  17. import Delete from "@iconify-icons/ep/delete";
  18. import EditPen from "@iconify-icons/ep/edit-pen";
  19. import More from "@iconify-icons/ep/more-filled";
  20. const {
  21. form,
  22. loading,
  23. columns,
  24. dataList,
  25. pagination,
  26. onSearch,
  27. handleSizeChange,
  28. handleCurrentChange,
  29. handleSelectionChange,
  30. ruleFormRef,
  31. handleAdd,
  32. addVisible,
  33. handleUpdate,
  34. editUpdateVisible,
  35. editUpdateFormData,
  36. handleDelete,
  37. handleUpVersion,
  38. handleUpdateTemplate,
  39. editUpVersionVisible,
  40. editUpVersionFormData,
  41. } = usePageUpdateInfo();
  42. // 关闭添加
  43. const closeAddVisible = () => {
  44. onSearch(ruleFormRef.value);
  45. addVisible.value = false;
  46. }
  47. provide('closeAddVisible', closeAddVisible)
  48. // 关闭修改
  49. const closeEditUpdateVisible = () => {
  50. onSearch(ruleFormRef.value);
  51. editUpdateVisible.value = false
  52. }
  53. provide('closeEditUpdateVisible', closeEditUpdateVisible)
  54. // 关闭修改
  55. const closeEditUpVersionVisible = () => {
  56. onSearch(ruleFormRef.value);
  57. editUpVersionVisible.value = false
  58. }
  59. provide('closeEditUpVersionVisible', closeEditUpVersionVisible)
  60. </script>
  61. <template lang="pug">
  62. .main
  63. div
  64. //- 搜索表格组件条件
  65. el-form.bg-bg_color.pl-8.pt-4.pr-8(
  66. label-position="left"
  67. label-width="100px"
  68. :inline="true",
  69. :model="form",
  70. class="w-[99/100]"
  71. ref="ruleFormRef"
  72. :rules="rules"
  73. )
  74. el-form-item(label="分类", prop="kind")
  75. el-select(
  76. v-model="form.kind",
  77. placeholder="请选择分类",
  78. clearable,
  79. )
  80. el-option(:label="item.label", :value="item.id" v-for="(item,index) in kindOptionList")
  81. el-form-item(label='标题' prop="title")
  82. el-input(v-model='form.title' autocomplete='off'
  83. placeholder="请输入标题")
  84. el-form-item(label='文件名' prop="modulePath")
  85. el-input(v-model='form.modulePath' autocomplete='off'
  86. placeholder="请输入文件名")
  87. el-form-item
  88. el-button(
  89. type="primary",
  90. :icon="useRenderIcon(Search)",
  91. :loading="loading",
  92. @click="onSearch(ruleFormRef)"
  93. ) 查询
  94. //- 表格组件
  95. PureTableBar(title="页面模板更新信息", @refresh="onSearch(ruleFormRef)" )
  96. template(#buttons)
  97. el-button(type="primary" :icon="useRenderIcon(Addicon)" @click="handleAdd()" v-if="hasAuth(['add'])") 新增
  98. el-button(type="primary" :icon="useRenderIcon(Addicon)" @click="handleUpdateTemplate()" v-if="hasAuth(['updateTemplate'])") 同步文件
  99. template(v-slot="{ size, checkList }")
  100. pure-table(
  101. row-key="id"
  102. ref="tableRef"
  103. adaptive
  104. align-whole="center"
  105. table-layout="auto"
  106. :loading="loading"
  107. :size="size",
  108. :data="dataList",
  109. :columns="columns",
  110. :checkList="checkList",
  111. :pagination="pagination",
  112. :paginationSmall="size === 'default' ? true : false",
  113. :header-cell-style="{ background: 'var(--el-table-row-hover-bg-color)', color: 'var(--el-text-color-primary)' }",
  114. @selection-change="handleSelectionChange",
  115. @size-change="handleSizeChange",
  116. @current-change="handleCurrentChange"
  117. )
  118. template(#operation="{ row }")
  119. el-button.reset-margin(
  120. link
  121. type="primary"
  122. size="small"
  123. @click="handleUpdate(row)"
  124. :icon="useRenderIcon(Delete)"
  125. v-if="hasAuth(['update'])"
  126. ) 编辑
  127. el-button.reset-margin(
  128. link
  129. type="primary"
  130. size="small"
  131. @click="handleDelete(row)"
  132. :icon="useRenderIcon(Delete)"
  133. v-if="hasAuth(['delete'])"
  134. ) 删除
  135. el-dropdown(trigger="click", :hide-on-click="false")
  136. el-button.ml-3(class="mt-[2px]" link type='primary' :size='size' :icon='useRenderIcon(More)')
  137. template(#dropdown)
  138. el-dropdown-menu
  139. el-dropdown-item
  140. el-button.reset-margin.edit-btn(
  141. link
  142. type="primary"
  143. size="small"
  144. @click="handleUpVersion(row)"
  145. :icon="useRenderIcon(EditPen)"
  146. v-if="hasAuth(['version'])"
  147. ) 更新版本号码
  148. Add(:addVisible="addVisible")
  149. EditUpdate(:editVisible="editUpdateVisible" :formData="editUpdateFormData")
  150. EditUpVersion(:editVisible="editUpVersionVisible" :formData="editUpVersionFormData")
  151. </template>
  152. <style scoped lang="scss">
  153. :deep(.el-dropdown-menu__item i) {
  154. margin: 0;
  155. }
  156. :deep(.el-form-item__label) {
  157. font-weight: 700;
  158. }
  159. :deep(.el-pagination) {
  160. flex-flow: wrap;
  161. }
  162. :deep(.is-draggable) {
  163. max-height: 80vh;
  164. overflow: auto;
  165. }
  166. :deep(.el-dialog__header) {
  167. position: sticky;
  168. top: 0;
  169. z-index: 2;
  170. background: #fff;
  171. }
  172. :deep(.el-descriptions__header) {
  173. margin: 16px 0 !important;
  174. }
  175. </style>