备份

src/api/user.ts

@@ -50,7 +50,7 @@ export type RefreshTokenResult = {
 export const getLogin = (data?: object) => {
   console.log(data);
   return http.login(
-    "http://test.apigateway.shuangkebang.com/v1/skb/sysServer/oauth2/token",
+    "http://localhost:5296/v1/skb/sysServer/oauth2/token",
     data
   );
 };

src/router/modules/template.ts

@@ -18,12 +18,12 @@ export default {
   },
   children: [
     {
-      path: "/Template/template/index",
+      path: "/Template/ApiGroup/index",
       name: "Template",
-      component: () => import("@/views/Template/template/index.vue"),
+      component: () => import("@/views/Template/ApiGroup/index.vue"),
       meta: {
         icon: "role",
-        title: '模板'
+        title: 'api分组'
       }
     }
   ]

src/utils/getUrl/getUrl.js

@@ -64,7 +64,7 @@ const getURL = () => {
 const getAllPlate = () => {
   return new Promise(async (resolve, reject) => {
     postRequest(
-      "http://test.skbconfig.kexiaoshuang.com/api/apiinfo/groupsforadmin",
+      "http://test.config.kexiaoshuang.com/api/apiinfo/groupsforadmin",
       {
         key: "kxs#2024"
       }
@@ -99,7 +99,7 @@ const getGroupUrl = async (checkPlate = []) => {
       );
     }, 5000);
     postRequest(
-      "http://test.skbconfig.kexiaoshuang.com/api/apiinfo/listforadmin",
+      "http://test.config.kexiaoshuang.com/api/apiinfo/listforadmin",
       parameters
     )
       .then(async res => {

src/views/Template/ApiGroup/components/add/index.vue

@@ -0,0 +1,143 @@
+<script lang="ts">
+// 声明额外的选项
+export default {
+  name: "Add"
+};
+</script>
+<script setup lang="ts">
+import { inject, ref } from "vue";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { http } from "@/utils/http";
+// 获取当前板块接口列表
+import Upload from "@iconify-icons/ri/upload-2-fill";
+import Close from "@iconify-icons/ri/close-fill";
+// 获取URLLIST
+import { getGroupUrl } from "@/utils/getUrl/getUrl";
+const KxsConfigServer = await getGroupUrl(['KxsConfigServer']);
+
+const props = defineProps<{
+  submit: {
+    type: Function;
+    default: () => {};
+  };
+  addVisible: {
+    type: Boolean;
+    default: false;
+  };
+  width: {
+    type: Number;
+    default: 50;
+  };
+}>();
+// 表单数据
+let UpdateForm = ref({
+  GroupName: "", //名称
+  GroupRemark: "", //说明
+  GroupVersion: "", //版本号
+
+});
+
+// 选项卡参数(默认值为列表某项的id)
+const activeId = ref('1')
+// 提交函数
+const submit = async () => {
+  const KxsConfigServer = await getGroupUrl(['KxsConfigServer']);
+  const { status, info }: any = http.request(KxsConfigServer.ApiGroupAdd.method, KxsConfigServer.ApiGroupAdd.url, UpdateForm.value);
+  if (status === "1") {
+    ElMessage({
+      message: "新增成功",
+      type: "success"
+    });
+    UpdateForm.value = {
+      GroupName: "", //名称
+      GroupRemark: "", //说明
+      GroupVersion: "", //版本号
+
+    };
+  } else {
+    ElMessageBox.alert(info, "提示", {
+      confirmButtonText: "关闭",
+      type: "warning"
+    });
+  };
+};
+const closeFn: any = inject('closeAddVisible');
+// 关闭弹窗回调函数
+const closeVisible = () => {
+  UpdateForm.value = {
+    GroupName: "", //名称
+    GroupRemark: "", //说明
+    GroupVersion: "", //版本号
+
+  };
+  closeFn();
+};
+</script>
+
+<template lang="pug">
+.main
+  el-dialog(v-model='props.addVisible' width="50%" title="新增" @close="closeVisible()")
+    el-form(:model='UpdateForm' label-position="right" label-width="100px")
+      el-form-item(label='名称' prop="GroupName")
+        el-input(v-model='UpdateForm.GroupName' autocomplete='off' class="!w-[230px]"
+          placeholder="请输入名称")
+      el-form-item(label='说明' prop="GroupRemark")
+        el-input(v-model='UpdateForm.GroupRemark' autocomplete='off' class="!w-[230px]"
+          placeholder="请输入说明")
+      el-form-item(label='版本号' prop="GroupVersion")
+        el-input(v-model='UpdateForm.GroupVersion' autocomplete='off' class="!w-[230px]"
+          placeholder="请输入版本号")
+
+    el-button(
+      :icon="useRenderIcon(Close)",
+      :loading="loading",
+      @click="closeVisible()"
+    ) 关闭
+    el-button(
+      type="primary",
+      :icon="useRenderIcon(Upload)",
+      :loading="loading",
+      @click="submit"
+    ) 确认提交
+</template>
+
+<style scoped lang="scss">
+:deep(.el-dropdown-menu__item i) {
+  margin: 0;
+}
+
+:deep(.el-form-item__label) {
+  font-weight: 700;
+}
+
+:deep(.el-pagination) {
+  flex-flow: wrap;
+}
+
+:deep(.is-draggable) {
+  max-height: 80vh;
+  overflow: auto;
+}
+
+:deep(.el-dialog__header) {
+  position: sticky;
+  top: 0;
+  z-index: 2;
+  background: #fff;
+}
+
+.collapsedom {
+  padding: 0 20px;
+  background-color: #fff;
+}
+
+.ovh-x {
+  height: 40vh;
+  overflow-y: auto;
+}
+
+:deep(.el-descriptions__header) {
+  margin: 16px 0 !important;
+}
+</style>

src/views/Template/ApiGroup/components/edit/index.vue

@@ -0,0 +1,144 @@
+<script lang="ts">
+// 声明额外的选项
+export default {
+  name: "Edit"
+};
+</script>
+<script setup lang="ts">
+import { inject, ref } from "vue";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+import { ElMessage, ElMessageBox } from "element-plus";
+import Upload from "@iconify-icons/ri/upload-2-fill"
+import Close from "@iconify-icons/ri/close-fill"
+import { http } from "@/utils/http";
+// 获取URLLIST
+import { getGroupUrl } from "@/utils/getUrl/getUrl";
+const KxsConfigServer = await getGroupUrl(['KxsConfigServer']);
+
+const props = defineProps<{
+  editVisible: {
+    type: Boolean;
+    default: false;
+  };
+  width: {
+    type: Number;
+    default: 50;
+  };
+  formData: {
+    type: Object;
+    default: {};
+  };
+}>();
+// 表单数据
+let UpdateForm: any = ref({
+  GroupName: "", //名称
+  GroupRemark: "", //说明
+  GroupVersion: "", //版本号
+  Id: "", //ID
+
+});
+
+// 选项卡参数(默认值为列表某项的id)
+const activeId = ref('1')
+// 提交函数
+const submit = async () => {
+  const KxsConfigServer = await getGroupUrl(['KxsConfigServer']);
+  const { status, info }: any = http.request(KxsConfigServer.ApiGroupUpdate.method, KxsConfigServer.ApiGroupUpdate.url, UpdateForm.value);
+  if (status === "1") {
+    ElMessage({
+      message: "修改成功",
+      type: "success"
+    });
+    UpdateForm.value = {
+      GroupName: "", //名称
+      GroupRemark: "", //说明
+      GroupVersion: "", //版本号
+      Id: "", //ID
+
+    };
+  } else {
+    ElMessageBox.alert(info, "提示", {
+      confirmButtonText: "关闭",
+      type: "warning"
+    });
+  };
+};
+// 关闭弹窗回调函数
+const closeVisible = inject('closeEditVisible');
+const openVisible = async () => {
+  //通过ID获取表格数据
+  const KxsConfigServer = await getGroupUrl(['KxsConfigServer']);
+  const { data }: any = http.request(KxsConfigServer.ApiGroup.Query.method, KxsConfigServer.ApiGroup.Query.url, UpdateForm.value);
+  UpdateForm.value = data;
+};
+</script>
+
+<template lang="pug">
+.main
+  el-dialog(v-model='props.editVisible' width="50%" title="修改" @close="closeVisible()" @open="openVisible")
+    el-form(:model='UpdateForm' label-position="right" label-width="100px")
+      el-form-item(label='名称' prop="GroupName")
+        el-input(v-model='UpdateForm.GroupName' autocomplete='off' class="!w-[230px]"
+          placeholder="请输入名称")
+      el-form-item(label='说明' prop="GroupRemark")
+        el-input(v-model='UpdateForm.GroupRemark' autocomplete='off' class="!w-[230px]"
+          placeholder="请输入说明")
+      el-form-item(label='版本号' prop="GroupVersion")
+        el-input(v-model='UpdateForm.GroupVersion' autocomplete='off' class="!w-[230px]"
+          placeholder="请输入版本号")
+      el-form-item(label='ID' prop="Id")
+        el-input-number(v-model='UpdateForm.Id' :min="1" :max="1000"
+          placeholder="请输入ID")
+
+    el-button(
+      :icon="useRenderIcon(Close)",
+      :loading="loading",
+      @click="closeVisible()"
+    ) 关闭
+    el-button(
+      type="primary",
+      :icon="useRenderIcon(Upload)",
+      :loading="loading",
+      @click="submit"
+    ) 确认提交
+</template>
+
+<style scoped lang="scss">
+:deep(.el-dropdown-menu__item i) {
+  margin: 0;
+}
+
+:deep(.el-form-item__label) {
+  font-weight: 700;
+}
+
+:deep(.el-pagination) {
+  flex-flow: wrap;
+}
+
+:deep(.is-draggable) {
+  max-height: 80vh;
+  overflow: auto;
+}
+
+:deep(.el-dialog__header) {
+  position: sticky;
+  top: 0;
+  z-index: 2;
+  background: #fff;
+}
+
+.collapsedom {
+  padding: 0 20px;
+  background-color: #fff;
+}
+
+.ovh-x {
+  height: 40vh;
+  overflow-y: auto;
+}
+
+:deep(.el-descriptions__header) {
+  margin: 16px 0 !important;
+}
+</style>

src/views/Template/ApiGroup/hook.tsx

@@ -0,0 +1,149 @@
+import { getRoleList } from "@/api/system";
+import { type PaginationProps } from "@pureadmin/table";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { reactive, ref, computed, onMounted } from "vue";
+// 获取URLLIST
+import { getGroupUrl } from "@/utils/getUrl/getUrl"
+import { http } from "@/utils/http";
+// 获取当前板块接口列表
+const UrlList = await getGroupUrl(['KxsConfigServer']);
+
+export function useApiGroup() {
+  let form = reactive({
+    GroupName: "1"
+  });
+  const dataList = ref([]);
+  const loading = ref(false);
+  const dialogAddVisible = ref(false);
+  const pagination = reactive<PaginationProps>({
+    total: 0,
+    pageSize: 10,
+    currentPage: 1,
+    background: true
+  });
+  const columns: TableColumnList = [
+    {
+      type: "selection",
+      width: 55,
+      align: "left",
+      hide: ({ checkList }) => !checkList.includes("勾选列")
+    },
+    {
+      label: "序号",
+      type: "index",
+      width: 70,
+      hide: ({ checkList }) => !checkList.includes("序号列")
+    },
+    {
+      label: "名称",
+      prop: "GroupName",
+      minWidth: 200
+    },
+
+    {
+      label: "操作",
+      fixed: "right",
+      width: 200,
+      slot: "operation"
+    }
+  ];
+  // 当前页数量切换
+  function handleSizeChange(val: number) {
+    console.log(`${val} items per page`);
+    onSearch()
+  }
+  // 当前页码切换
+  function handleCurrentChange(val: number) {
+    console.log(`current page: ${val}`);
+    onSearch()
+  }
+  // 选择表格项
+  function handleSelectionChange(val) {
+    console.log("handleSelectionChange", val);
+    onSearch()
+  }
+  // 搜索列表
+  async function onSearch(type = 'search') {
+    if (type == 'search' && !Object.values(form).some(item => !!item)) {
+      return ElMessage({
+        message: "请输入查询条件",
+        type: "error"
+      });
+    };
+    loading.value = true;
+    console.log('form:', form);
+    console.log('pagination:', pagination);
+    const { data, other }: any = http.request(UrlList.KxsConfigServer.ApiGrouplist.method, UrlList.KxsConfigServer.ApiGrouplist.url, { ...form, page_size: pagination.pageSize, page_num: pagination.currentPage });
+    console.log('data:', data);
+    console.log('other:', other);
+    dataList.value = data;
+    pagination.total = other.Count;
+    setTimeout(() => {
+      loading.value = false;
+    }, 500);
+  }
+  onMounted(() => {
+    onSearch();
+  });
+
+  // 删除
+  function handleDelete(row) {
+    ElMessageBox.confirm(
+      `是否删除该api接口分组? `,
+      "提示",
+      {
+        confirmButtonText: "删除",
+        cancelButtonText: "取消",
+        type: "warning"
+      }
+    ).then(async () => {
+      const { status, info }: any = await http.request(KxsConfigServer.ApiGroupdelete.method, KxsConfigServer.ApiGroupdelete.url, { Id: row.Id });
+      if (status === "1") {
+        ElMessage({
+          message: "删除成功",
+          type: "success"
+        });
+        onSearch();
+      } else {
+        ElMessageBox.alert(info, "提示", {
+          confirmButtonText: "关闭",
+          type: "warning"
+        });
+      };
+    })
+  }
+
+  // 新增
+  const addVisible = ref(false);
+  function handleAdd() {
+    addVisible.value = true;
+  };
+
+  // 修改
+  const editVisible = ref(false);
+  const editFormData = ref({});
+  function handleUpdate(row) {
+    editVisible.value = true;
+    // 表格数据赋值
+    editFormData.value = row;
+  };
+
+  return {
+    form,
+    loading,
+    columns,
+    dataList,
+    pagination,
+    onSearch,
+    handleSizeChange,
+    handleCurrentChange,
+    handleSelectionChange,
+    handleAdd,
+    addVisible,
+    handleUpdate,
+    editVisible,
+    editFormData,
+    handleDelete,
+
+  };
+}

src/views/Template/ApiGroup/index.vue

@@ -0,0 +1,166 @@
+<script lang="ts">
+// 声明额外的选项
+export default {
+  name: "ApiGroup"
+};
+</script>
+<script setup lang="ts">
+import { provide, ref } from "vue";
+import { useApiGroup } from "./hook";
+import { hasAuth } from "@/router/utils";
+import { PureTableBar } from "@/components/RePureTableBar";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+import Add from "./components/add/index.vue";
+import Edit from "./components/edit/index.vue";
+import Search from "@iconify-icons/ep/search";
+import All from "@iconify-icons/ep/refresh-left";
+import Addicon from "@iconify-icons/ep/document-add";
+
+const formRef = ref();
+const {
+  form,
+  loading,
+  columns,
+  dataList,
+  pagination,
+  onSearch,
+  handleSizeChange,
+  handleCurrentChange,
+  handleSelectionChange,
+  handleAdd,
+  addVisible,
+  handleUpdate,
+  editVisible,
+  editFormData,
+  handleDelete,
+
+} = useApiGroup();
+
+// 关闭添加
+const closeAddVisible = () => {
+  addVisible.value = false
+}
+provide('closeAddVisible', closeAddVisible)
+// 关闭修改
+const closeEditVisible = () => {
+  editVisible.value = false
+}
+provide('closeEditVisible', closeEditVisible)
+
+
+
+</script>
+
+<template lang="pug">
+.main
+  div
+    el-form.bg-bg_color.pl-8.pt-4.pr-8(
+      label-position="left"
+      label-width="100px"
+      ref="formRef",
+      :inline="true",
+      :model="form",
+      :rules="rules",
+      class="w-[99/100]"
+    )
+      el-form-item(label='名称' prop="GroupName")
+        el-input(v-model='form.GroupName' autocomplete='off' class="!w-[230px]"
+          placeholder="请输入名称")
+
+      el-form-item
+        el-button(
+          type="primary",
+          :icon="useRenderIcon(Search)",
+          :loading="loading",
+          @click="onSearch()"
+        ) 查询
+      el-form-item
+        el-button(
+          type="primary",
+          :icon="useRenderIcon(All)",
+          :loading="loading",
+          @click="onSearch('all')"
+        ) 全部
+    //- 表格组件
+    PureTableBar(title="api接口分组", @refresh="onSearch" )
+      template(#buttons)
+        el-button(type="primary" :icon="useRenderIcon(Addicon)" @click="handleAdd()") 新增
+
+      template(v-slot="{ size, checkList }")
+        pure-table(stripe 
+          border,
+          align-whole="center",
+          table-layout="auto",
+          :loading="loading",
+          :size="size",
+          :data="dataList",
+          :columns="columns",
+          :checkList="checkList",
+          :pagination="pagination",
+          :paginationSmall="size === 'default' ? true : false",
+          :header-cell-style="{ background: 'var(--el-table-row-hover-bg-color)', color: 'var(--el-text-color-primary)' }",
+          @selection-change="handleSelectionChange",
+          @size-change="handleSizeChange",
+          @current-change="handleCurrentChange"
+        )          
+          template(#operation="{ row }")
+            .flex.flex-wrap.items-center
+              el-dropdown(trigger="click", :hide-on-click="false")
+                el-button(type="primary") 操作
+                  el-icon.el-icon--right
+                    arrow-down
+                template(#dropdown)
+                  el-dropdown-menu
+                    el-dropdown-item
+                      el-button.reset-margin(
+                        link
+                        type="primary"
+                        :size="size"
+                        @click="handleUpdate(row)"
+                        :icon="useRenderIcon(EditPen)"
+                        v-if="hasAuth(['edit'])"
+                      ) 编辑
+                    el-button.reset-margin(
+                      link
+                      type="primary"
+                      :size="size"
+                      @click="handleDelete(row)"
+                      :icon="useRenderIcon(Delete)"
+                      v-if="hasAuth(['delete'])"
+                    ) 删除
+
+    Add(:addVisible="addVisible")
+    Edit(:editVisible="editVisible" :formData="editFormData")
+
+                    
+</template>
+
+<style scoped lang="scss">
+:deep(.el-dropdown-menu__item i) {
+  margin: 0;
+}
+
+:deep(.el-form-item__label) {
+  font-weight: 700;
+}
+
+:deep(.el-pagination) {
+  flex-flow: wrap;
+}
+
+:deep(.is-draggable) {
+  max-height: 80vh;
+  overflow: auto;
+}
+
+:deep(.el-dialog__header) {
+  position: sticky;
+  top: 0;
+  z-index: 2;
+  background: #fff;
+}
+
+:deep(.el-descriptions__header) {
+  margin: 16px 0 !important;
+}
+</style>