yg-yygl 0.0.1

package/dist/views/file/file-config/index.vue

@@ -0,0 +1,326 @@
+<script setup lang="ts">
+import type {
+  BusinessFilterItem,
+  IconActionItem,
+  TableColumn,
+} from '@udp/component-ui';
+
+import type { FileConfig } from '../../../api/file-config';
+
+import { ref } from 'vue';
+
+import {
+  BusinessFilterBar,
+  Drawer,
+  IconActionGroup,
+  IconButton,
+  Table,
+  useTable,
+} from '@udp/component-ui';
+
+import { ElMessage, ElMessageBox } from 'element-plus';
+
+import {
+  deleteFileConfig,
+  enableFileConfig,
+  getFileConfigPage,
+  updateFileConfigStatus,
+} from '../../../api/file-config';
+import { MainContainer } from '../../../components/main-container';
+
+import FileConfigForm from './file-config-form.vue';
+
+// 查询条件配置
+const searchParams = ref({});
+const filterItems: BusinessFilterItem[] = [
+  {
+    prop: 'configName',
+    type: 'input',
+    width: 220,
+    placeholder: '请输入配置名',
+  },
+  {
+    prop: 'storageType',
+    label: '存储器',
+    type: 'select',
+    placeholder: '请选择存储器类型',
+    options: [
+      { label: '本地磁盘', value: 'local' },
+      { label: 'SFTP 服务器', value: 'sftp' },
+      { label: 'MinIO 对象存储', value: 'minio' },
+    ],
+  },
+  {
+    prop: 'createTimeRange',
+    label: '创建时间',
+    type: 'daterange',
+    width: 360,
+    props: {
+      type: 'datetimerange',
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+    placeholder: '请选择时间范围',
+  },
+];
+
+// 表格列配置
+const columns: TableColumn[] = [
+  { prop: 'configName', label: '配置名', minWidth: 150 },
+  { prop: 'storageType', label: '存储器', minWidth: 150 },
+  { prop: 'configRemark', label: '备注', minWidth: 150 },
+  {
+    prop: 'isPrimary',
+    label: '主配置',
+    minWidth: 150,
+    formatter: (row: FileConfig) => (row.isPrimary === 1 ? '是' : '否'),
+  },
+  {
+    prop: 'status',
+    label: '激活状态',
+    minWidth: 100,
+    slot: 'status',
+  },
+  { prop: 'createTime', label: '创建时间', minWidth: 180 },
+  { prop: 'updateTime', label: '最后更新时间', minWidth: 180 },
+];
+
+// 存储器类型映射
+const storageTypeMap: Record<string, string> = {
+  local: '本地磁盘',
+  sftp: 'SFTP 服务器',
+  minio: 'MinIO 对象存储',
+};
+
+// 配置 API
+const api = {
+  list: (params: any) => {
+    // 拆分日期区间为后端字段
+    const { createTimeRange, ...rest } = params.model || {};
+    const requestParams = {
+      ...params,
+      model: {
+        ...rest,
+        ...(createTimeRange?.[0]
+          ? { createTimeStart: createTimeRange[0] }
+          : {}),
+        ...(createTimeRange?.[1] ? { createTimeEnd: createTimeRange[1] } : {}),
+      },
+    };
+    return getFileConfigPage(requestParams);
+  },
+  delete: (id: string) => deleteFileConfig(id),
+};
+
+const dataLayout = 'table';
+
+// 使用 Hook
+const {
+  loading,
+  data,
+  pagination,
+  refresh,
+  reset,
+  search,
+  deleteRow,
+  handleSizeChange,
+  handleCurrentPageChange,
+} = useTable({
+  api,
+  dataTransform: (res) => {
+    // 格式化响应数据
+    return {
+      list:
+        res.records?.map((item: any) => ({
+          ...item,
+          storageType: storageTypeMap[item.storageType] || item.storageType,
+        })) || [],
+      total: res.total || 0,
+    };
+  },
+});
+
+const drawerVisible = ref(false);
+const addFlag = ref(true);
+const fileConfigFormRef = ref<InstanceType<typeof FileConfigForm>>();
+const editRow = ref<FileConfig | null>(null);
+
+const handleAdd = () => {
+  drawerVisible.value = true;
+  addFlag.value = true;
+};
+
+const handleEdit = (row: FileConfig) => {
+  editRow.value = row;
+  drawerVisible.value = true;
+  addFlag.value = false;
+};
+
+const handleAddSuccess = async () => {
+  const flag = await fileConfigFormRef.value?.handleSubmit();
+  if (flag) {
+    handleDrawerClosed();
+    refresh();
+  }
+};
+
+const handleDrawerClosed = () => {
+  drawerVisible.value = false;
+  editRow.value = null;
+};
+
+// 切换激活状态
+const handleToggleStatus = async (row: FileConfig, newStatus: number) => {
+  const statusText = newStatus === 1 ? '激活' : '取消激活';
+  try {
+    await ElMessageBox.confirm(
+      `确定要${statusText}「${row.configName}」吗？`,
+      '提示',
+      { type: 'warning' },
+    );
+    await updateFileConfigStatus(row.id, newStatus);
+    ElMessage.success(`${statusText}成功`);
+    refresh();
+  } catch {
+    // 用户取消或请求失败
+  }
+};
+
+// 设为主配置
+const handleSetPrimary = async (row: FileConfig) => {
+  try {
+    await ElMessageBox.confirm(
+      `确定将「${row.configName}」设为主配置吗？设为后原主配置将被取消。`,
+      '提示',
+      { type: 'warning' },
+    );
+    await enableFileConfig(row.id);
+    ElMessage.success('设置成功');
+    refresh();
+  } catch {
+    // 用户取消或请求失败
+  }
+};
+
+// 删除（主配置不允许删除）
+const handleDeleteRow = (row: FileConfig) => {
+  if (row.isPrimary === 1) {
+    ElMessage.warning('主配置不允许删除');
+    return;
+  }
+  deleteRow(row);
+};
+
+const actionBtns: IconActionItem[] = [
+  {
+    key: 'edit',
+    label: '编辑',
+    icon: 'hx-line-built-in:edit-line',
+    onClick: (row: any) => handleEdit(row as FileConfig),
+  },
+  {
+    key: 'primary',
+    label: '设为主配置',
+    icon: 'ri:star-line',
+    show: (row: any) => row.isPrimary !== 1 && row.status === 1,
+    onClick: (row: any) => handleSetPrimary(row as FileConfig),
+  },
+  {
+    key: 'delete',
+    label: '删除',
+    icon: 'hx-line-built-in:delete-bin-6-line',
+    type: 'danger',
+    disabled: (row: any) => row.isPrimary === 1,
+    onClick: (row: any) => handleDeleteRow(row as FileConfig),
+  },
+];
+
+const handleFilterSearch = (params: Record<string, any>) => {
+  search(params);
+};
+
+const handleFilterReset = () => {
+  reset();
+};
+</script>
+
+<template>
+  <MainContainer>
+    <div class="flex h-full w-full flex-col overflow-hidden bg-background">
+      <BusinessFilterBar
+        v-model="searchParams"
+        :items="filterItems"
+        :loading="loading"
+        @search="handleFilterSearch"
+        @reset="handleFilterReset"
+      />
+      <Table
+        :data="data"
+        :columns="columns"
+        :loading="loading"
+        :pagination="pagination"
+        show-toolbar
+        show-top-actions
+        show-pagination
+        show-action
+        :show-layout="false"
+        :show-setting="false"
+        :layout-type="dataLayout"
+        action-width="124px"
+        @refresh="refresh"
+        @size-change="handleSizeChange"
+        @current-page-change="handleCurrentPageChange"
+      >
+        <template #top-actions>
+          <div class="flex flex-wrap items-center gap-2">
+            <IconButton type="primary" icon-type="add" @click="handleAdd">
+              新增配置
+            </IconButton>
+          </div>
+        </template>
+        <template #status="{ row }">
+          <el-switch
+            :model-value="row.status ?? 0"
+            :disabled="row.isPrimary === 1"
+            inline-prompt
+            :active-value="1"
+            :inactive-value="0"
+            active-text="开"
+            inactive-text="关"
+            @change="(val: number) => handleToggleStatus(row, val)"
+          />
+        </template>
+        <template #action="{ row }">
+          <IconActionGroup :actions="actionBtns" :row="row" />
+        </template>
+      </Table>
+    </div>
+
+    <Drawer
+      v-model="drawerVisible"
+      :title="addFlag ? '新增文件配置' : '编辑文件配置'"
+      :type="addFlag ? 'add' : 'edit'"
+      size="808px"
+      @confirm="handleAddSuccess"
+      @closed="handleDrawerClosed"
+    >
+      <template #footer>
+        <div class="flex w-full items-center justify-between">
+          <el-button
+            type="primary"
+            @click="fileConfigFormRef?.handleTestConnection()"
+          >
+            测试连接
+          </el-button>
+          <div class="flex gap-3">
+            <el-button @click="drawerVisible = false">取消</el-button>
+            <el-button type="primary" @click="handleAddSuccess">确定</el-button>
+          </div>
+        </div>
+      </template>
+      <FileConfigForm ref="fileConfigFormRef" :edit-data="editRow" />
+    </Drawer>
+  </MainContainer>
+</template>
+
+<style scoped lang="scss"></style>

package/dist/views/file/file-config/index.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/views/file/file-list/components/FileUploadDialog.d.vue.ts

@@ -0,0 +1,11 @@
+interface Props {
+    modelValue: boolean;
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    success: () => any;
+    "update:modelValue": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onSuccess?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/views/file/file-list/components/FileUploadDialog.vue

@@ -0,0 +1,253 @@
+<script setup lang="ts">
+import { computed, ref } from 'vue';
+import { ElMessage } from 'element-plus';
+import { Upload, Close, Document } from '@element-plus/icons-vue';
+import { getRequestClient } from '../../../../api/request';
+import { UdpUpload } from '@udp/ui';
+import type { FileInfo } from '@udp/ui';
+
+interface Props {
+  modelValue: boolean;
+}
+
+interface Emits {
+  (e: 'update:modelValue', value: boolean): void;
+  (e: 'success'): void;
+}
+
+const props = defineProps<Props>();
+const emit = defineEmits<Emits>();
+
+const dialogVisible = computed({
+  get: () => props.modelValue,
+  set: (val) => emit('update:modelValue', val),
+});
+
+const uploadRef = ref<InstanceType<typeof UdpUpload>>();
+const previewUrl = ref('');
+const previewName = ref('');
+const previewSize = ref('');
+const hasFile = ref(false);
+const previewIsImage = ref(false);
+
+const client = getRequestClient();
+const requestFn = client.post.bind(client);
+
+/** 文件选择变化 */
+const handleFileChange = (file: File) => {
+  previewIsImage.value = file.type.startsWith('image/');
+  previewUrl.value = previewIsImage.value ? URL.createObjectURL(file) : '';
+  previewName.value = file.name;
+  previewSize.value = (file.size / 1024 / 1024).toFixed(2);
+  hasFile.value = true;
+};
+
+/** 移除文件 */
+const handleRemove = () => {
+  if (previewUrl.value) {
+    URL.revokeObjectURL(previewUrl.value);
+  }
+  previewUrl.value = '';
+  previewName.value = '';
+  previewSize.value = '';
+  hasFile.value = false;
+  uploadRef.value?.clearFiles();
+};
+
+/** 上传文件 */
+const handleUpload = async () => {
+  if (!hasFile.value) {
+    ElMessage.warning('请先选择要上传的文件');
+    return;
+  }
+
+  try {
+    const result = await uploadRef.value?.submit();
+    if (result) {
+      ElMessage.success('文件上传成功');
+      dialogVisible.value = false;
+      emit('success');
+    }
+  } catch (error) {
+    console.error('上传失败:', error);
+  }
+};
+
+/** 取消上传 */
+const handleCancel = () => {
+  dialogVisible.value = false;
+};
+
+/** 弹窗关闭时清空 */
+const handleClosed = () => {
+  handleRemove();
+};
+</script>
+
+<template>
+  <el-dialog
+    v-model="dialogVisible"
+    title="上传文件"
+    width="500px"
+    :close-on-click-modal="false"
+    @closed="handleClosed"
+  >
+    <div class="upload-container">
+      <UdpUpload
+        ref="uploadRef"
+        :request-fn="requestFn"
+        :max-size="100"
+        :auto-upload="false"
+        draggable
+        :max-count="1"
+        :show-file-list="false"
+        :show-success-message="false"
+        @change="handleFileChange"
+      >
+        <el-icon class="upload-icon">
+          <Upload />
+        </el-icon>
+        <div class="upload-text">
+          <div class="upload-hint">拖拽文件到此处或点击上传</div>
+          <div class="upload-tips">文件大小不超过 100MB</div>
+        </div>
+      </UdpUpload>
+
+      <!-- 文件预览 -->
+      <div v-if="hasFile" class="preview-card">
+        <img
+          v-if="previewIsImage"
+          :src="previewUrl"
+          class="preview-image"
+          alt="预览"
+        />
+        <div v-else class="preview-file-icon">
+          <el-icon :size="32"><Document /></el-icon>
+        </div>
+        <div class="preview-info">
+          <span class="preview-name" :title="previewName">{{ previewName }}</span>
+          <span class="preview-size">{{ previewSize }} MB</span>
+        </div>
+        <el-icon class="remove-icon" @click="handleRemove">
+          <Close />
+        </el-icon>
+      </div>
+    </div>
+
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="handleCancel">取消</el-button>
+        <el-button type="primary" :loading="uploadRef?.uploading" @click="handleUpload">
+          确定
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<style scoped lang="scss">
+.upload-container {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.upload-area {
+  :deep(.el-upload-dragger) {
+    padding: 40px 20px;
+    border: 2px dashed var(--el-border-color);
+    border-radius: var(--el-border-radius-base);
+    background: var(--el-fill-color-blank);
+    transition: all 0.3s;
+
+    &:hover {
+      border-color: var(--el-color-primary);
+    }
+  }
+}
+
+.upload-icon {
+  font-size: 48px;
+  color: var(--el-text-color-secondary);
+  margin-bottom: 16px;
+}
+
+.upload-text {
+  text-align: center;
+}
+
+.upload-hint {
+  font-size: 14px;
+  color: var(--el-text-color-regular);
+  margin-bottom: 8px;
+}
+
+.upload-tips {
+  font-size: 12px;
+  color: var(--el-text-color-secondary);
+}
+
+.preview-card {
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 8px;
+  background: var(--el-fill-color-light);
+  border-radius: 6px;
+}
+
+.preview-image {
+  width: 80px;
+  height: 80px;
+  object-fit: cover;
+  border-radius: 4px;
+  border: 1px solid var(--el-border-color-lighter);
+  flex-shrink: 0;
+}
+
+.preview-file-icon {
+  width: 80px;
+  height: 80px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 4px;
+  border: 1px solid var(--el-border-color-lighter);
+  background: var(--el-fill-color-light);
+  color: var(--el-text-color-secondary);
+  flex-shrink: 0;
+}
+
+.preview-info {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  flex: 1;
+  min-width: 0;
+}
+
+.preview-name {
+  font-size: 14px;
+  color: var(--el-text-color-regular);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.preview-size {
+  font-size: 12px;
+  color: var(--el-text-color-secondary);
+}
+
+.remove-icon {
+  font-size: 16px;
+  color: var(--el-text-color-secondary);
+  cursor: pointer;
+  flex-shrink: 0;
+
+  &:hover {
+    color: var(--el-color-danger);
+  }
+}
+</style>

package/dist/views/file/file-list/components/FileUploadDialog.vue.d.ts

@@ -0,0 +1,11 @@
+interface Props {
+    modelValue: boolean;
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    success: () => any;
+    "update:modelValue": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onSuccess?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/views/file/file-list/components/ImagePreview.d.vue.ts

@@ -0,0 +1,10 @@
+interface Props {
+    src: string;
+    previewList?: string[];
+    fit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    fit: "cover" | "contain" | "fill" | "none" | "scale-down";
+    previewList: string[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/views/file/file-list/components/ImagePreview.vue

@@ -0,0 +1,66 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+
+import { Picture } from '@element-plus/icons-vue';
+
+interface Props {
+  src: string;                  // 图片地址
+  previewList?: string[];       // 预览列表
+  fit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';  // 适应方式
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  previewList: () => [],
+  fit: 'cover',
+});
+
+// 预览列表，如果没有传入则使用当前图片
+const previewSrcList = computed(() => {
+  return props.previewList.length > 0 ? props.previewList : [props.src];
+});
+</script>
+
+<template>
+  <el-image
+    :src="src"
+    :preview-src-list="previewSrcList"
+    :fit="fit"
+    class="preview-image"
+    :preview-teleported="true"
+  >
+    <template #error>
+      <div class="image-slot">
+        <el-icon :size="24">
+          <Picture />
+        </el-icon>
+        <span class="text-xs mt-1">加载失败</span>
+      </div>
+    </template>
+  </el-image>
+</template>
+
+<style scoped lang="scss">
+.preview-image {
+  width: 60px;
+  height: 60px;
+  border-radius: 4px;
+  display: block;
+  cursor: pointer;
+
+  :deep(.el-image__inner) {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.image-slot {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  background: var(--el-fill-color-light);
+  color: var(--el-text-color-secondary);
+}
+</style>

package/dist/views/file/file-list/components/ImagePreview.vue.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    src: string;
+    previewList?: string[];
+    fit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    fit: "cover" | "contain" | "fill" | "none" | "scale-down";
+    previewList: string[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/views/file/file-list/index.d.vue.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;