fred-admin 1.0.0__py3-none-any.whl

fred_admin/demo/modules/admin/frontend/src/components/ImportExcel/index.vue

@@ -0,0 +1,151 @@
+<template>
+  <el-dialog v-model="dialogVisible" :title="`批量添加${parameter.title}`" :destroy-on-close="true" width="580px" draggable>
+    <el-form class="drawer-multiColumn-form" label-width="100px">
+      <el-form-item label="模板下载 :">
+        <el-button type="primary" :icon="Download" @click="downloadTemp"> 点击下载 </el-button>
+      </el-form-item>
+      <el-form-item label="文件上传 :">
+        <el-upload
+          action="#"
+          class="upload"
+          :drag="true"
+          :limit="excelLimit"
+          :multiple="true"
+          :show-file-list="true"
+          :http-request="uploadExcel"
+          :before-upload="beforeExcelUpload"
+          :on-exceed="handleExceed"
+          :on-success="excelUploadSuccess"
+          :on-error="excelUploadError"
+          :accept="parameter.fileType!.join(',')"
+        >
+          <slot name="empty">
+            <el-icon class="el-icon--upload">
+              <upload-filled />
+            </el-icon>
+            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+          </slot>
+          <template #tip>
+            <slot name="tip">
+              <div class="el-upload__tip">请上传 .xls , .xlsx 标准格式文件，文件最大为 {{ parameter.fileSize }}M</div>
+            </slot>
+          </template>
+        </el-upload>
+      </el-form-item>
+      <el-form-item label="数据覆盖 :">
+        <el-switch v-model="isCover" />
+      </el-form-item>
+    </el-form>
+  </el-dialog>
+</template>
+
+<script setup lang="ts" name="ImportExcel">
+import { useDownload } from "@/hooks/useDownload";
+import { Download } from "@element-plus/icons-vue";
+import { ElNotification, UploadRawFile, UploadRequestOptions } from "element-plus";
+import { ref } from "vue";
+
+export interface ExcelParameterProps {
+  title: string; // 标题
+  fileSize?: number; // 上传文件的大小
+  fileType?: File.ExcelMimeType[]; // 上传文件的类型
+  tempApi?: (params: any) => Promise<any>; // 下载模板的Api
+  importApi?: (params: any) => Promise<any>; // 批量导入的Api
+  getTableList?: () => void; // 获取表格数据的Api
+}
+
+// 是否覆盖数据
+const isCover = ref(false);
+// 最大文件上传数
+const excelLimit = ref(1);
+// dialog状态
+const dialogVisible = ref(false);
+// 父组件传过来的参数
+const parameter = ref<ExcelParameterProps>({
+  title: "",
+  fileSize: 5,
+  fileType: ["application/vnd.ms-excel", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"]
+});
+
+// 接收父组件参数
+const acceptParams = (params: ExcelParameterProps) => {
+  parameter.value = { ...parameter.value, ...params };
+  dialogVisible.value = true;
+};
+
+// Excel 导入模板下载
+const downloadTemp = () => {
+  if (!parameter.value.tempApi) return;
+  useDownload(parameter.value.tempApi, `${parameter.value.title}模板`);
+};
+
+// 文件上传
+const uploadExcel = async (param: UploadRequestOptions) => {
+  let excelFormData = new FormData();
+  excelFormData.append("file", param.file);
+  excelFormData.append("isCover", isCover.value as unknown as Blob);
+  await parameter.value.importApi!(excelFormData);
+  if (parameter.value.getTableList) {
+    parameter.value.getTableList();
+  }
+  dialogVisible.value = false;
+};
+
+/**
+ * @description 文件上传之前判断
+ * @param file 上传的文件
+ * */
+const beforeExcelUpload = (file: UploadRawFile) => {
+  const isExcel = parameter.value.fileType!.includes(file.type as File.ExcelMimeType);
+  const fileSize = file.size / 1024 / 1024 < parameter.value.fileSize!;
+  if (!isExcel)
+    ElNotification({
+      title: "温馨提示",
+      message: "上传文件只能是 xls / xlsx 格式！",
+      type: "warning"
+    });
+  if (!fileSize)
+    setTimeout(() => {
+      ElNotification({
+        title: "温馨提示",
+        message: `上传文件大小不能超过 ${parameter.value.fileSize}MB！`,
+        type: "warning"
+      });
+    }, 0);
+  return isExcel && fileSize;
+};
+
+// 文件数超出提示
+const handleExceed = () => {
+  ElNotification({
+    title: "温馨提示",
+    message: "最多只能上传一个文件！",
+    type: "warning"
+  });
+};
+
+// 上传错误提示
+const excelUploadError = () => {
+  ElNotification({
+    title: "温馨提示",
+    message: `批量添加${parameter.value.title}失败，请您重新上传！`,
+    type: "error"
+  });
+};
+
+// 上传成功提示
+const excelUploadSuccess = () => {
+  ElNotification({
+    title: "温馨提示",
+    message: `批量添加${parameter.value.title}成功！`,
+    type: "success"
+  });
+};
+
+defineExpose({
+  acceptParams
+});
+</script>
+<style lang="scss" scoped>
+@use "./index";
+</style>

fred_admin/demo/modules/admin/frontend/src/components/JsonViewer/index.vue

@@ -0,0 +1,249 @@
+<template>
+  <div class="json-viewer-wrapper">
+    <div class="content-header">
+      <div class="header-left">
+        <span class="content-title">{{ title }}</span>
+        <el-tag v-if="hasJsonContent && showStats" type="success" size="small">
+          {{ jsonStats }}
+        </el-tag>
+      </div>
+      <div v-if="showActions" class="content-actions">
+        <el-button v-if="showExpandCollapse" size="small" @click="toggleExpandCollapse" :icon="isExpanded ? 'Minus' : 'Plus'">
+          {{ isExpanded ? "折叠全部" : "展开全部" }}
+        </el-button>
+        <el-button v-if="showCopy" size="small" @click="copyJsonContent" :icon="'Copy'"> 复制 </el-button>
+        <el-button v-if="showDownload" size="small" @click="downloadJson" :icon="'Download'"> 下载 </el-button>
+      </div>
+    </div>
+    <div class="content-display" :style="{ height: height }">
+      <div v-if="hasJsonContent" class="json-viewer-container">
+        <vue-json-pretty
+          :key="`json-viewer-${deep}-${forceUpdate}`"
+          :data="parsedJsonData"
+          :show-length="true"
+          :show-double-quotes="false"
+          :show-line="true"
+          :deep="deep"
+          :path="'res'"
+          :show-line-number="true"
+          :highlight-mouseover-node="true"
+          :highlight-selected-node="true"
+          :select-on-click-node="true"
+          :collapsed-on-click-brackets="true"
+          :theme="'light'"
+          class="json-pretty"
+        />
+      </div>
+      <div v-else class="empty-json">
+        <el-empty :description="emptyText" :image-size="100" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, nextTick } from "vue";
+import { ElMessage } from "element-plus";
+import VueJsonPretty from "vue-json-pretty";
+import "vue-json-pretty/lib/styles.css";
+
+// 类型定义
+interface Props {
+  content: string;
+  title?: string;
+  height?: string;
+  emptyText?: string;
+  showStats?: boolean;
+  showActions?: boolean;
+  showExpandCollapse?: boolean;
+  showCopy?: boolean;
+  showDownload?: boolean;
+  downloadFileName?: string;
+  deep?: number;
+}
+
+// Props
+const props = withDefaults(defineProps<Props>(), {
+  content: "",
+  title: "配置内容",
+  height: "calc(100vh - 400px)",
+  emptyText: "暂无配置内容",
+  showStats: true,
+  showActions: true,
+  showExpandCollapse: true,
+  showCopy: true,
+  showDownload: true,
+  downloadFileName: "",
+  deep: 3
+});
+
+// 响应式数据
+const deep = ref(props.deep);
+const forceUpdate = ref(0);
+const isExpanded = ref(false); // 展开状态
+
+// 计算属性
+const hasJsonContent = computed(() => !!(props.content && String(props.content).trim().length > 0));
+
+// 解析JSON数据
+const parsedJsonData = computed(() => {
+  if (!props.content) return {};
+  try {
+    // 首先尝试解析为JSON
+    return JSON.parse(props.content);
+  } catch {
+    // 如果JSON解析失败，尝试处理Python字典格式
+    const content = props.content.trim();
+    if (content.startsWith("{") && content.endsWith("}")) {
+      try {
+        // 简单的Python字典到JSON转换
+        const jsonStr = content
+          .replace(/'/g, '"') // 单引号替换为双引号
+          .replace(/(\w+):/g, '"$1":') // 键名加引号
+          .replace(/: True/g, ": true") // Python True -> JSON true
+          .replace(/: False/g, ": false") // Python False -> JSON false
+          .replace(/: None/g, ": null"); // Python None -> JSON null
+        return JSON.parse(jsonStr);
+      } catch {
+        return {};
+      }
+    }
+    return {};
+  }
+});
+
+const jsonStats = computed(() => {
+  if (!hasJsonContent.value) return "空配置";
+
+  const countKeys = (obj: any): number => {
+    if (typeof obj !== "object" || obj === null) return 0;
+    let count = Object.keys(obj).length;
+    for (const key in obj) {
+      if (typeof obj[key] === "object" && obj[key] !== null) {
+        count += countKeys(obj[key]);
+      }
+    }
+    return count;
+  };
+
+  const parsedData = parsedJsonData.value;
+  if (!parsedData || Object.keys(parsedData).length === 0) {
+    return "配置格式错误";
+  }
+
+  const totalKeys = countKeys(parsedData);
+  return `${totalKeys} 个配置项`;
+});
+
+// 方法
+const toggleExpandCollapse = async () => {
+  if (isExpanded.value) {
+    // 当前是展开状态，执行折叠
+    deep.value = 1; // 设置为1来折叠所有子节点，只保留根节点
+    isExpanded.value = false;
+  } else {
+    // 当前是折叠状态，执行展开
+    deep.value = Infinity; // 设置为无穷大来展开所有
+    isExpanded.value = true;
+  }
+  forceUpdate.value++; // 强制重新渲染
+  await nextTick(); // 等待DOM更新
+};
+
+// 工具方法
+const copyJsonContent = async () => {
+  try {
+    await navigator.clipboard.writeText(props.content);
+    ElMessage.success("配置内容已复制到剪贴板");
+  } catch {
+    ElMessage.error("复制失败");
+  }
+};
+
+const downloadJson = () => {
+  try {
+    const blob = new Blob([props.content], { type: "application/json" });
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    link.href = url;
+    const fileName = props.downloadFileName || `json-config-${Date.now()}.json`;
+    link.download = fileName;
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+    URL.revokeObjectURL(url);
+    ElMessage.success("配置文件已下载");
+  } catch {
+    ElMessage.error("下载失败");
+  }
+};
+
+// 暴露方法给父组件
+defineExpose({
+  toggleExpandCollapse,
+  copyJsonContent,
+  downloadJson
+});
+</script>
+
+<style scoped lang="scss">
+.json-viewer-wrapper {
+  .content-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 0;
+    padding-bottom: 4px;
+    border-bottom: 1px solid #e4e7ed;
+
+    .header-left {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+
+      .content-title {
+        font-weight: 600;
+        color: #303133;
+      }
+    }
+
+    .content-actions {
+      display: flex;
+      gap: 8px;
+    }
+  }
+
+  .content-display {
+    border: 1px solid #e4e7ed;
+    border-radius: 6px;
+    background-color: #fafafa;
+    min-height: 300px;
+    overflow: hidden;
+
+    .json-viewer-container {
+      height: 100%;
+      background-color: #f8f9fa;
+      overflow: auto;
+      border-radius: 6px;
+      border: 1px solid #e4e7ed;
+      padding: 16px;
+
+      .json-pretty {
+        font-family: "JetBrains Mono", "Fira Code", "Consolas", "Monaco", "Courier New", monospace;
+        font-size: 13px;
+        line-height: 1.6;
+      }
+    }
+
+    .empty-json {
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background-color: #f8f9fa;
+      border-radius: 6px;
+      border: 1px solid #e4e7ed;
+    }
+  }
+}
+</style>

fred_admin/demo/modules/admin/frontend/src/components/Loading/fullScreen.ts

@@ -0,0 +1,45 @@
+import { ElLoading } from "element-plus";
+
+/* 全局请求 loading */
+let loadingInstance: ReturnType<typeof ElLoading.service>;
+
+/**
+ * @description 开启 Loading
+ * */
+const startLoading = () => {
+  loadingInstance = ElLoading.service({
+    fullscreen: true,
+    lock: true,
+    text: "Loading",
+    background: "rgba(0, 0, 0, 0.7)"
+  });
+};
+
+/**
+ * @description 结束 Loading
+ * */
+const endLoading = () => {
+  loadingInstance.close();
+};
+
+/**
+ * @description 显示全屏加载
+ * */
+let needLoadingRequestCount = 0;
+export const showFullScreenLoading = () => {
+  if (needLoadingRequestCount === 0) {
+    startLoading();
+  }
+  needLoadingRequestCount++;
+};
+
+/**
+ * @description 隐藏全屏加载
+ * */
+export const tryHideFullScreenLoading = () => {
+  if (needLoadingRequestCount <= 0) return;
+  needLoadingRequestCount--;
+  if (needLoadingRequestCount === 0) {
+    endLoading();
+  }
+};

fred_admin/demo/modules/admin/frontend/src/components/Loading/index.scss

@@ -0,0 +1,67 @@
+.loading-box {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  .loading-wrap {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 98px;
+  }
+}
+.dot {
+  position: relative;
+  box-sizing: border-box;
+  display: inline-block;
+  width: 32px;
+  height: 32px;
+  font-size: 32px;
+  transform: rotate(45deg);
+  animation: ant-rotate 1.2s infinite linear;
+}
+.dot i {
+  position: absolute;
+  display: block;
+  width: 14px;
+  height: 14px;
+  background-color: var(--el-color-primary);
+  border-radius: 100%;
+  opacity: 0.3;
+  transform: scale(0.75);
+  transform-origin: 50% 50%;
+  animation: ant-spin-move 1s infinite linear alternate;
+}
+.dot i:nth-child(1) {
+  top: 0;
+  left: 0;
+}
+.dot i:nth-child(2) {
+  top: 0;
+  right: 0;
+  animation-delay: 0.4s;
+}
+.dot i:nth-child(3) {
+  right: 0;
+  bottom: 0;
+  animation-delay: 0.8s;
+}
+.dot i:nth-child(4) {
+  bottom: 0;
+  left: 0;
+  animation-delay: 1.2s;
+}
+
+@keyframes ant-rotate {
+  to {
+    transform: rotate(405deg);
+  }
+}
+
+@keyframes ant-spin-move {
+  to {
+    opacity: 1;
+  }
+}

fred_admin/demo/modules/admin/frontend/src/components/Loading/index.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="loading-box">
+    <div class="loading-wrap">
+      <span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts" name="Loading"></script>
+
+<style scoped lang="scss">
+@use "./index";
+</style>

fred_admin/demo/modules/admin/frontend/src/components/ProTable/components/ColSetting.vue

@@ -0,0 +1,45 @@
+<template>
+  <!-- 列设置 -->
+  <el-drawer v-model="drawerVisible" title="列设置" size="450px">
+    <div class="table-main">
+      <el-table :data="colSetting" :border="true" row-key="prop" default-expand-all :tree-props="{ children: '_children' }">
+        <el-table-column prop="label" align="center" label="列名" />
+        <el-table-column v-slot="scope" prop="isShow" align="center" label="显示">
+          <el-switch v-model="scope.row.isShow"></el-switch>
+        </el-table-column>
+        <el-table-column v-slot="scope" prop="sortable" align="center" label="排序">
+          <el-switch v-model="scope.row.sortable"></el-switch>
+        </el-table-column>
+        <template #empty>
+          <div class="table-empty">
+            <img src="@/assets/images/notData.png" alt="notData" />
+            <div>暂无可配置列</div>
+          </div>
+        </template>
+      </el-table>
+    </div>
+  </el-drawer>
+</template>
+
+<script setup lang="ts" name="ColSetting">
+import { ref } from "vue";
+import { ColumnProps } from "@/components/ProTable/interface";
+
+defineProps<{ colSetting: ColumnProps[] }>();
+
+const drawerVisible = ref<boolean>(false);
+
+const openColSetting = () => {
+  drawerVisible.value = true;
+};
+
+defineExpose({
+  openColSetting
+});
+</script>
+
+<style scoped lang="scss">
+.cursor-move {
+  cursor: move;
+}
+</style>

fred_admin/demo/modules/admin/frontend/src/components/ProTable/components/Pagination.vue

@@ -0,0 +1,101 @@
+<template>
+  <!-- 分页组件 -->
+  <div class="pagination-wrapper">
+    <el-pagination
+      :background="true"
+      :current-page="pageable.pageNum"
+      :page-size="pageable.pageSize"
+      :page-sizes="[10, 25, 50, 100]"
+      :total="computedTotal"
+      :size="globalStore?.assemblySize ?? 'default'"
+      :layout="paginationLayout"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+    ></el-pagination>
+  </div>
+</template>
+
+<script setup lang="ts" name="Pagination">
+import { useGlobalStore } from "@/stores/modules/global";
+import { computed } from "vue";
+const globalStore = useGlobalStore();
+
+interface Pageable {
+  pageNum: number;
+  pageSize: number;
+  total: number;
+}
+
+interface PaginationProps {
+  pageable: Pageable;
+  handleSizeChange: (size: number) => void;
+  handleCurrentChange: (currentPage: number) => void;
+  useComputedTotal?: boolean; // 是否使用计算后的 total（默认为 true，用于处理后端不返回总记录数的情况）
+  tableData?: any[]; // 当前页的表格数据，用于判断是否可以翻页
+}
+
+const props = withDefaults(defineProps<PaginationProps>(), {
+  useComputedTotal: true
+});
+
+// 根据 useComputedTotal 决定分页组件的 layout
+// 如果 useComputedTotal 为 false，使用简化 layout（不显示 total、pager，但显示 jumper）
+// 如果 useComputedTotal 为 true，使用完整 layout（显示所有功能）
+const paginationLayout = computed(() => {
+  if (!props.useComputedTotal) {
+    // 简化 layout：显示 sizes、prev、next、jumper（不显示 total 和 pager）
+    return "sizes, prev, next, jumper";
+  }
+  // 完整 layout：显示 total、sizes、prev、pager、next、jumper
+  return "total, sizes, prev, pager, next, jumper";
+});
+
+// 计算 total 值：如果 useComputedTotal 为 false，设置一个足够大的值以支持跳转功能，不限制 total 值
+// 如果 useComputedTotal 为 true，根据当前页数据量判断是否可以翻页
+const computedTotal = computed(() => {
+  // 如果不需要计算（useComputedTotal 为 false），设置一个足够大的值以支持跳转功能
+  // 不限制 total 值，让用户可以跳转到任意页面
+  if (!props.useComputedTotal) {
+    // 如果没有数据，返回 0，下一页按钮不可用
+    if (!props.tableData || props.tableData.length === 0) {
+      return 0;
+    }
+
+    // 设置一个非常大的值（999999999），不限制 total 值，让用户可以跳转到任意页面
+    // 这样即使用户输入 1000000 或更大的页码，也能正常跳转
+    // 999999999 / 10 = 99999999 页，足够支持大部分场景
+    return 999999999;
+  }
+
+  // 如果需要计算（useComputedTotal 为 true），根据当前页数据量判断是否可以翻页
+  // 如果有真实的 total 值且大于 0，直接使用
+  if (props.pageable.total > 0) {
+    return props.pageable.total;
+  }
+
+  // 如果没有 total，根据当前页数据量判断
+  if (props.tableData && props.tableData.length > 0) {
+    // 如果当前页数据量等于 pageSize，说明可能还有下一页
+    if (props.tableData.length >= props.pageable.pageSize) {
+      // 设置一个足够大的值，确保 next 按钮可用
+      return (props.pageable.pageNum + 1) * props.pageable.pageSize;
+    } else {
+      // 当前页数据量小于 pageSize，说明可能是最后一页
+      // 设置一个刚好能显示当前页的值
+      return (props.pageable.pageNum - 1) * props.pageable.pageSize + props.tableData.length;
+    }
+  }
+
+  // 如果没有数据，返回 0
+  return 0;
+});
+</script>
+
+<style scoped>
+.pagination-wrapper {
+  padding: 20px 0;
+  text-align: center;
+  background: #fff;
+  border-top: 1px solid #ebeef5;
+}
+</style>