hook.tsx 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
  1. import { reactive, onMounted, ref, ElMessage, ElMessageBox, http, getGroupUrl, RegularVerification, verification, PaginationProps } from "@/utils/importUsed"
  2. // 表单实例
  3. const ruleFormRef = ref()
  4. export function usePageUpdateInfo() {
  5. // 接口列表实例
  6. let UrlList = reactive(null)
  7. // 获取当前板块接口列表
  8. onMounted(async () => {
  9. UrlList = await getGroupUrl(["kxsConfigServer"]);
  10. onSearch(ruleFormRef.value);
  11. });
  12. let form = reactive({
  13. kind: "", //分类
  14. });
  15. const dataList = ref([]);
  16. const loading = ref(false);
  17. const dialogAddVisible = ref(false);
  18. const pagination = reactive<PaginationProps>({
  19. total: 0,
  20. pageSize: 10,
  21. currentPage: 1,
  22. background: true
  23. });
  24. const columns: TableColumnList = [
  25. {
  26. type: "selection",
  27. width: 55,
  28. align: "left",
  29. hide: ({ checkList }) => !checkList.includes("勾选列")
  30. },
  31. {
  32. label: "序号",
  33. type: "index",
  34. width: 70,
  35. hide: ({ checkList }) => !checkList.includes("序号列")
  36. },
  37. {
  38. label: "模板更新版本",
  39. prop: "moduleVersion",
  40. minWidth: 200
  41. },
  42. {
  43. label: "模板路径",
  44. prop: "modulePath",
  45. minWidth: 200
  46. },
  47. {
  48. label: "顶部标题",
  49. prop: "title",
  50. minWidth: 200
  51. },
  52. {
  53. label: "ID",
  54. prop: "id",
  55. minWidth: 200
  56. },
  57. {
  58. label: "操作",
  59. fixed: "right",
  60. width: 200,
  61. slot: "operation"
  62. }
  63. ];
  64. // 当前页数量切换
  65. function handleSizeChange(val: number) {
  66. if (typeof val === "number") {
  67. pagination.pageSize = val;
  68. onSearch(ruleFormRef.value);
  69. }
  70. }
  71. // 当前页码切换
  72. function handleCurrentChange(val: number) {
  73. console.log(`current page: ${val}`);
  74. if (typeof val === "number") {
  75. pagination.currentPage = val;
  76. onSearch(ruleFormRef.value);
  77. }
  78. }
  79. // 选择表格项
  80. function handleSelectionChange(val) {
  81. console.log(`SelectionChange: ${val}`);
  82. onSearch(ruleFormRef.value);
  83. }
  84. // 搜索列表
  85. async function onSearch(formEl) {
  86. // 表单校验拦截
  87. if (!formEl) return
  88. await formEl.validate(async (valid, fields) => {
  89. if (valid) {
  90. //表单校验成功回调
  91. console.log('submit!')
  92. // 状态调整为加载中
  93. loading.value = true;
  94. // 调用接口(需动态生成接口)
  95. const { status, msg, data }: any = await http.Request({
  96. method: UrlList.kxsConfigServer.pageUpdateInfolist.method,
  97. url: UrlList.kxsConfigServer.pageUpdateInfolist.url,
  98. params: {
  99. ...form,
  100. pageSize: pagination.pageSize,
  101. pageNum: pagination.currentPage
  102. }
  103. });
  104. dataList.value = data.records;
  105. pagination.total = data.total;
  106. setTimeout(() => {
  107. loading.value = false;
  108. }, 500);
  109. } else {
  110. //表单校验失败回调
  111. ElMessage({
  112. message: "请输入完整信息",
  113. type: "error"
  114. });
  115. }
  116. })
  117. }
  118. // 删除
  119. function handleDelete(row) {
  120. ElMessageBox.confirm(
  121. `是否删除该页面模板更新信息? `,
  122. "提示",
  123. {
  124. confirmButtonText: "删除",
  125. cancelButtonText: "取消",
  126. type: "warning"
  127. }
  128. ).then(async () => {
  129. const { status, msg }: any = await http.Request({ method: UrlList.kxsConfigServer.pageUpdateInfodelete.method, url: UrlList.kxsConfigServer.pageUpdateInfodelete.url, params: String(row.id) });
  130. if (status === 1) {
  131. ElMessage({
  132. message: "删除成功",
  133. type: "success"
  134. });
  135. onSearch(ruleFormRef.value);
  136. } else {
  137. ElMessageBox.alert(msg, "提示", {
  138. confirmButtonText: "关闭",
  139. type: "warning"
  140. });
  141. };
  142. })
  143. }
  144. // 新增
  145. const addVisible = ref(false);
  146. function handleAdd() {
  147. addVisible.value = true;
  148. };
  149. // 修改
  150. const editUpdateVisible = ref(false);
  151. const editUpdateFormData = ref({});
  152. function handleUpdate(row) {
  153. editUpdateVisible.value = true;
  154. // 表格数据赋值
  155. editUpdateFormData.value = row;
  156. };
  157. // 更新版本号码
  158. const editUpVersionVisible = ref(false);
  159. const editUpVersionFormData = ref({});
  160. async function handleUpVersion(row) {
  161. // editUpVersionVisible.value = true;
  162. // 表格数据赋值
  163. // editUpVersionFormData.value = row;
  164. // 需动态生成接口
  165. const { status, msg }: any = await http.Request({
  166. method: UrlList.kxsConfigServer.pageUpdateInfoupVersion.method,
  167. url: UrlList.kxsConfigServer.pageUpdateInfoupVersion.url,
  168. params: { id: row.id }
  169. });
  170. if (status === 1) {
  171. //业务成功回调
  172. ElMessage({
  173. message: "修改成功",
  174. type: "success"
  175. });
  176. onSearch(ruleFormRef.value);
  177. } else {
  178. //业务失败回调
  179. ElMessageBox.alert(msg, "提示", {
  180. confirmButtonText: "关闭",
  181. type: "warning"
  182. });
  183. }
  184. };
  185. return {
  186. form,
  187. loading,
  188. columns,
  189. dataList,
  190. pagination,
  191. onSearch,
  192. handleSizeChange,
  193. handleCurrentChange,
  194. handleSelectionChange,
  195. ruleFormRef,
  196. handleAdd,
  197. addVisible,
  198. handleUpdate,
  199. editUpdateVisible,
  200. editUpdateFormData,
  201. handleDelete,
  202. handleUpVersion,
  203. editUpVersionVisible,
  204. editUpVersionFormData,
  205. };
  206. }