feat: 新增部分文件管理后端 API

This commit is contained in:
Charles7c 2023-12-23 15:10:51 +08:00
parent fd0e05f95a
commit 4c24aea560
48 changed files with 926 additions and 460 deletions

View File

@ -0,0 +1,65 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.enums;
import java.util.Collections;
import java.util.List;
import lombok.Getter;
import lombok.RequiredArgsConstructor;
import top.charles7c.continew.starter.data.mybatis.plus.base.IBaseEnum;
/**
* 文件分类枚举
*
* @author Charles7c
* @since 2023/12/23 13:38
*/
@Getter
@RequiredArgsConstructor
public enum FileTypeEnum implements IBaseEnum<Integer> {
/**
* 其他
*/
UNKNOWN(1, "其他", Collections.emptyList()),
/**
* 图片
*/
IMAGE(2, "图片", List.of("jpg", "png", "gif", "bmp", "webp", "ico", "psd", "tiff", "dwg", "jxr", "apng", "xcf")),
/**
* 文档
*/
DOC(3, "文档", List.of("txt", "pdf", "doc", "xls", "ppt", "docx", "xlsx", "pptx")),
/**
* 视频
*/
VIDEO(4, "视频", List.of("mp4", "avi", "mkv", "flv", "webm", "wmv", "m4v", "mov", "mpg", "rmvb", "3gp")),
/**
* 音频
*/
AUDIO(5, "音频", List.of("mp3", "flac", "wav", "ogg", "midi", "m4a", "aac", "amr", "ac3", "aiff")),;
private final Integer value;
private final String description;
private final List<String> extensions;
}

View File

@ -0,0 +1,28 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.mapper;
import top.charles7c.continew.admin.system.model.entity.FileDO;
import top.charles7c.continew.starter.data.mybatis.plus.base.BaseMapper;
/**
* 文件 Mapper
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
public interface FileMapper extends BaseMapper<FileDO> {}

View File

@ -0,0 +1,75 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.model.entity;
import java.io.Serial;
import lombok.Data;
import com.baomidou.mybatisplus.annotation.TableName;
import top.charles7c.continew.admin.system.enums.FileTypeEnum;
import top.charles7c.continew.starter.extension.crud.base.BaseDO;
/**
* 文件实体
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
@Data
@TableName("sys_file")
public class FileDO extends BaseDO {
@Serial
private static final long serialVersionUID = 1L;
/**
* 名称
*/
private String name;
/**
* 大小字节
*/
private Long size;
/**
* URL
*/
private String url;
/**
* 扩展名
*/
private String extension;
/**
* MIME类型
*/
private String mimeType;
/**
* 类型
*/
private FileTypeEnum type;
/**
* 存储库ID
*/
private Long storageId;
}

View File

@ -0,0 +1,55 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.model.query;
import java.io.Serial;
import java.io.Serializable;
import lombok.Data;
import io.swagger.v3.oas.annotations.media.Schema;
import top.charles7c.continew.starter.data.mybatis.plus.query.Query;
import top.charles7c.continew.starter.data.mybatis.plus.query.QueryType;
/**
* 文件查询条件
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
@Data
@Schema(description = "文件查询条件")
public class FileQuery implements Serializable {
@Serial
private static final long serialVersionUID = 1L;
/**
* 名称
*/
@Schema(description = "名称")
@Query(type = QueryType.INNER_LIKE)
private String name;
/**
* 类型
*/
@Schema(description = "类型")
@Query(type = QueryType.EQUAL)
private Integer type;
}

View File

@ -0,0 +1,39 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.model.req;
import java.io.Serial;
import lombok.Data;
import io.swagger.v3.oas.annotations.media.Schema;
import top.charles7c.continew.starter.extension.crud.base.BaseReq;
/**
* 创建或修改文件信息
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
@Data
@Schema(description = "创建或修改文件信息")
public class FileReq extends BaseReq {
@Serial
private static final long serialVersionUID = 1L;
}

View File

@ -0,0 +1,93 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.model.resp;
import java.io.Serial;
import lombok.Data;
import io.swagger.v3.oas.annotations.media.Schema;
import com.alibaba.excel.annotation.ExcelIgnoreUnannotated;
import com.alibaba.excel.annotation.ExcelProperty;
import top.charles7c.continew.admin.system.enums.FileTypeEnum;
import top.charles7c.continew.starter.extension.crud.base.BaseDetailResp;
/**
* 文件详情信息
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
@Data
@ExcelIgnoreUnannotated
@Schema(description = "文件详情信息")
public class FileDetailResp extends BaseDetailResp {
@Serial
private static final long serialVersionUID = 1L;
/**
* 名称
*/
@Schema(description = "名称")
@ExcelProperty(value = "名称")
private String name;
/**
* 大小字节
*/
@Schema(description = "大小(字节)")
@ExcelProperty(value = "大小(字节)")
private Long size;
/**
* URL
*/
@Schema(description = "URL")
@ExcelProperty(value = "URL")
private String url;
/**
* 扩展名
*/
@Schema(description = "扩展名")
@ExcelProperty(value = "扩展名")
private String extension;
/**
* MIME类型
*/
@Schema(description = "MIME类型")
@ExcelProperty(value = "MIME类型")
private String mimeType;
/**
* 类型
*/
@Schema(description = "类型")
@ExcelProperty(value = "类型")
private FileTypeEnum type;
/**
* 存储库ID
*/
@Schema(description = "存储库ID")
@ExcelProperty(value = "存储库ID")
private Long storageId;
}

View File

@ -0,0 +1,89 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.model.resp;
import java.io.Serial;
import java.time.LocalDateTime;
import lombok.Data;
import io.swagger.v3.oas.annotations.media.Schema;
import top.charles7c.continew.admin.system.enums.FileTypeEnum;
import top.charles7c.continew.starter.extension.crud.base.BaseResp;
/**
* 文件信息
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
@Data
@Schema(description = "文件信息")
public class FileResp extends BaseResp {
@Serial
private static final long serialVersionUID = 1L;
/**
* 名称
*/
@Schema(description = "名称")
private String name;
/**
* 大小字节
*/
@Schema(description = "大小(字节)")
private Long size;
/**
* URL
*/
@Schema(description = "URL")
private String url;
/**
* 扩展名
*/
@Schema(description = "扩展名")
private String extension;
/**
* MIME类型
*/
@Schema(description = "MIME类型")
private String mimeType;
/**
* 类型
*/
@Schema(description = "类型")
private FileTypeEnum type;
/**
* 存储库ID
*/
@Schema(description = "存储库ID")
private Long storageId;
/**
* 修改时间
*/
@Schema(description = "修改时间")
private LocalDateTime updateTime;
}

View File

@ -0,0 +1,31 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.service;
import top.charles7c.continew.admin.system.model.query.FileQuery;
import top.charles7c.continew.admin.system.model.req.FileReq;
import top.charles7c.continew.admin.system.model.resp.FileDetailResp;
import top.charles7c.continew.admin.system.model.resp.FileResp;
import top.charles7c.continew.starter.extension.crud.base.BaseService;
/**
* 文件业务接口
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
public interface FileService extends BaseService<FileResp, FileDetailResp, FileQuery, FileReq> {}

View File

@ -0,0 +1,41 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.system.service.impl;
import lombok.RequiredArgsConstructor;
import org.springframework.stereotype.Service;
import top.charles7c.continew.admin.system.mapper.FileMapper;
import top.charles7c.continew.admin.system.model.entity.FileDO;
import top.charles7c.continew.admin.system.model.query.FileQuery;
import top.charles7c.continew.admin.system.model.req.FileReq;
import top.charles7c.continew.admin.system.model.resp.FileDetailResp;
import top.charles7c.continew.admin.system.model.resp.FileResp;
import top.charles7c.continew.admin.system.service.FileService;
import top.charles7c.continew.starter.extension.crud.base.BaseServiceImpl;
/**
* 文件业务实现
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
@Service
@RequiredArgsConstructor
public class FileServiceImpl extends BaseServiceImpl<FileMapper, FileDO, FileResp, FileDetailResp, FileQuery, FileReq>
implements FileService {}

View File

@ -1,24 +1,56 @@
import axios from 'axios';
import qs from 'query-string';
const BASE_URL = '/system/file';
export interface FileItem {
id: string
type: string
name: string
extendName: string
src: string | null
updateTime: string
isDir: boolean
filePath: string
[propName: string]: any // 一个 interface 中任意属性只能有一个
id: string;
name: string;
size: number;
url: string;
extension: string;
mimeType?: string;
type?: string;
storageId?: string;
createUser?: string;
createTime?: string;
updateUser?: string;
updateTime: string;
createUserString?: string;
updateUserString?: string;
}
interface PageRes<T> {
records: T;
export interface ListParam {
name?: string;
type?: string;
updateTime?: string;
page?: number;
size?: number;
sort?: Array<string>;
}
export interface PageRes<T> {
total: number;
list: T;
}
export function getFileList() {
return axios.get<PageRes<FileItem[]>>(`${BASE_URL}/file`);
export function list(params: ListParam) {
return axios.get<PageRes<FileItem[]>>(`${BASE_URL}`, {
params,
paramsSerializer: (obj) => {
return qs.stringify(obj);
},
});
}
export function get(id: string) {
return axios.get<FileItem>(`${BASE_URL}/${id}`);
}
export function update(req: FileItem, id: string) {
return axios.put(`${BASE_URL}/${id}`, req);
}
export function del(ids: string | Array<string>) {
return axios.delete(`${BASE_URL}/${ids}`);
}

View File

@ -0,0 +1 @@
<svg t="1684652747690" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1922" width="200" height="200"><path d="M0 0m349.090909 0l325.818182 0q349.090909 0 349.090909 349.090909l0 325.818182q0 349.090909-349.090909 349.090909l-325.818182 0q-349.090909 0-349.090909-349.090909l0-325.818182q0-349.090909 349.090909-349.090909Z" fill="#52B852" p-id="1923"></path><path d="M269.346909 581.236364c-3.584-33.338182-2.338909-65.931636 11.52-101.969455 16.279273-43.869091 46.650182-76.241455 85.655273-101.969454 59.112727-39.924364 124.672-63.220364 192.616727-78.650182A727.528727 727.528727 0 0 1 726.644364 279.272727c12.648727 0 22.690909 2.443636 27.729454 15.429818 5.015273 13.009455 0 21.818182-8.843636 30.894546-27.729455 29.672727-37.806545 67.153455-46.650182 105.879273-11.252364 46.312727-22.737455 94.103273-35.188364 140.683636-3.816727 15.429818-12.660364 29.649455-18.920727 43.869091-37.771636 72.285091-99.490909 105.890909-176.314182 114.967273-36.631273 3.898182-72.96 1.198545-107.182545-14.231273a219.857455 219.857455 0 0 1-32.779637-19.374546c-7.68 19.374545-15.069091 38.749091-26.58909 41.192728a24.005818 24.005818 0 0 1-26.554182-14.219637c-1.163636-3.909818-3.816727-10.309818-2.373818-14.219636 5.015273-29.684364 12.683636-43.869091 17.710545-52.945455 30.370909-61.742545 69.154909-101.213091 116.514909-148.282181 16.965818-16.64 58.612364-50.734545 95.243636-69.841455-61.521455 16.896-123.950545 49.512727-187.35709 106.344727-25.611636 23.051636-39.959273 40.704-43.054546 48.791273l-2.653091-12.986182h-0.034909z" fill="#FFFFFF" p-id="1924"></path></svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1 @@
<svg t="1684653015168" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2715" width="200" height="200"><path d="M0 0m349.206261 0l325.587478 0q349.206261 0 349.206261 349.206261l0 325.587478q0 349.206261-349.206261 349.206261l-325.587478 0q-349.206261 0-349.206261-349.206261l0-325.587478q0-349.206261 349.206261-349.206261Z" fill="#F96C17" p-id="2716"></path><path d="M649.026783 536.242087C714.462609 536.242087 768 590.825739 768 657.552696c0 66.715826-53.537391 121.310609-118.973217 121.310608-65.446957 0-118.973217-54.594783-118.973218-121.321739 0-66.704696 53.504-121.299478 118.984348-121.299478zM667.614609 256c21.481739 0.066783 38.845217 17.786435 38.92313 39.68v222.130087c-17.842087-9.104696-38.66713-12.132174-59.492174-12.132174-83.277913 0-148.702609 66.715826-148.702608 151.641044 0 33.357913 11.887304 66.715826 29.729391 90.980173H294.912c-21.459478-0.066783-38.845217-17.786435-38.912-39.68v-412.93913c0.066783-21.893565 17.452522-39.624348 38.912-39.68h372.713739z m-2.270609 337.385739l-1.558261 1.78087c-3.962435 4.006957-9.282783 6.433391-15.170782 6.433391a21.292522 21.292522 0 0 1-15.237566-6.500174l-1.491478-1.714087c-2.070261-2.370783-6.110609-3.428174-8.97113-2.31513l-0.222609 0.089043c-0.723478 0.311652-3.328 1.513739-8.236522 4.518957l-0.500869 0.311652c-5.509565 3.450435-7.457391 5.231304-7.457392 5.231304-2.31513 2.092522-3.472696 6.322087-2.582261 9.449739l0.634435 2.259479a25.110261 25.110261 0 0 1-2.348522 17.330087c-2.949565 5.465043-7.635478 9.193739-12.877913 10.852173l-2.137043 0.512c-2.949565 0.712348-5.832348 3.917913-6.377739 7.123479 0 0-0.467478 2.782609-0.478609 9.828174v0.300521c0 7.268174 0.478609 10.128696 0.478609 10.128696 0.545391 3.205565 3.405913 6.41113 6.377739 7.123478l2.081391 0.512c5.253565 1.669565 9.961739 5.376 12.911305 10.874435a25.043478 25.043478 0 0 1 2.348521 17.363478l-0.612174 2.203826c-0.890435 3.094261 0.26713 7.346087 2.593392 9.472 0 0 2.025739 1.836522 7.724521 5.36487l0.256 0.155826c5.197913 3.216696 7.791304 4.34087 8.325566 4.563478l0.044521 0.022261 0.055653 0.022261c2.871652 1.113043 6.878609 0.055652 8.97113-2.31513l1.469217-1.691826c3.984696-4.029217 9.349565-6.489043 15.248696-6.489044 5.921391 0 11.308522 2.482087 15.259826 6.522435l1.480348 1.680696c2.05913 2.381913 6.099478 3.439304 8.96 2.32626 0 0 2.57113-1.001739 8.45913-4.608 5.89913-3.639652 7.94713-5.520696 7.947131-5.520695 2.337391-2.092522 3.483826-6.355478 2.604522-9.472l-0.645566-2.29287a24.954435 24.954435 0 0 1 2.359653-17.285565c2.938435-5.453913 7.646609-9.20487 12.900173-10.863304l2.081392-0.523131c2.949565-0.712348 5.843478-3.917913 6.377739-7.123478 0 0 0.478609-2.860522 0.478609-10.128696-0.022261-6.678261-0.434087-9.650087-0.50087-10.095304v-0.055652c-0.545391-3.172174-3.405913-6.41113-6.377739-7.123479l-2.226087-0.545391a22.394435 22.394435 0 0 1-12.8-10.818782 25.043478 25.043478 0 0 1-2.348522-17.363479l0.701218-2.226087c0.879304-3.094261-0.278261-7.357217-2.604522-9.472 0 0-2.081391-1.892174-7.969391-5.520695-5.89913-3.606261-8.43687-4.608-8.43687-4.608-2.860522-1.113043-6.878609-0.055652-8.96 2.31513z m-16.740174 31.376696a34.148174 34.148174 0 0 1 34.125913 34.148174 34.170435 34.170435 0 0 1-34.125913 34.114782 34.125913 34.125913 0 1 1 0-68.262956z m-36.340869-289.636174h-57.6c-11.52 0-19.2 7.312696-19.2 18.287304s7.68 18.287304 19.2 18.287305h11.52l-55.674435 53.025391-69.12-65.825391a21.281391 21.281391 0 0 0-13.445565-5.487305c-5.754435 0-9.594435 1.825391-15.36 5.487305l-80.64 76.8c-7.68 7.312696-7.68 18.287304 0 25.6 7.68 7.312696 19.2 7.312696 26.88 0l69.12-64 67.205565 64c3.84 3.650783 9.594435 5.487304 15.36 5.487304 5.754435 0 9.594435-1.836522 15.36-5.487304l67.194435-64v10.974608c0 10.963478 7.68 18.276174 19.2 18.276174 11.52 0 19.2-9.138087 19.2-18.276174v-54.861913c0-10.974609-9.594435-18.287304-19.2-18.287304z" fill="#FFFFFF" p-id="2717"></path></svg>

After

Width:  |  Height:  |  Size: 3.8 KiB

View File

@ -0,0 +1 @@
<svg t="1684652927115" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2556" width="200" height="200"><path d="M0 0m349.090909 0l325.818182 0q349.090909 0 349.090909 349.090909l0 325.818182q0 349.090909-349.090909 349.090909l-325.818182 0q-349.090909 0-349.090909-349.090909l0-325.818182q0-349.090909 349.090909-349.090909Z" fill="#62A8FC" p-id="2557"></path><path d="M751.371636 631.691636A39.901091 39.901091 0 0 1 791.272727 671.581091v79.790545A39.901091 39.901091 0 0 1 751.371636 791.272727H272.64A39.901091 39.901091 0 0 1 232.727273 751.371636v-79.790545a39.901091 39.901091 0 0 1 39.901091-39.889455H751.36z m-19.944727 79.790546H571.845818a19.944727 19.944727 0 0 0-3.595636 39.575273l3.595636 0.314181h159.581091a19.944727 19.944727 0 0 0 0-39.889454z m19.944727-279.272727A39.901091 39.901091 0 0 1 791.272727 472.087273v79.802182a39.901091 39.901091 0 0 1-39.901091 39.889454H272.64A39.901091 39.901091 0 0 1 232.727273 551.912727V472.087273a39.901091 39.901091 0 0 1 39.901091-39.889455H751.36z m-418.909091 79.790545h-39.889454a19.944727 19.944727 0 0 0-3.595636 39.575273l3.595636 0.325818h39.889454a19.944727 19.944727 0 1 0 0-39.901091z m199.482182 0H412.276364a19.944727 19.944727 0 0 0-3.595637 39.575273l3.595637 0.325818h119.68a19.944727 19.944727 0 1 0 0-39.901091z m219.426909-279.272727A39.901091 39.901091 0 0 1 791.272727 272.628364v79.790545a39.901091 39.901091 0 0 1-39.901091 39.889455H272.64A39.901091 39.901091 0 0 1 232.727273 352.418909v-79.790545A39.901091 39.901091 0 0 1 272.628364 232.727273H751.36z m-458.798545 79.790545a19.944727 19.944727 0 1 0 0 39.901091 19.944727 19.944727 0 0 0 0-39.901091z m79.790545 0a19.944727 19.944727 0 1 0 0 39.901091 19.944727 19.944727 0 0 0 0-39.901091z" fill="#FFFFFF" p-id="2558"></path></svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -0,0 +1,6 @@
<svg t="1645002087981" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8075"
width="200" height="200">
<path
d="M921.1392 155.392h-270.592v-48.2816c0-22.7328-18.432-41.1648-41.1648-41.1648H426.3424a41.1648 41.1648 0 0 0-41.1648 41.1648v48.2816H110.6432c-14.1312 0-25.6 11.4688-25.6 25.6s11.4688 25.6 25.6 25.6h810.496c14.1312 0 25.6-11.4688 25.6-25.6s-11.4688-25.6-25.6-25.6zM170.8032 260.0448v592.8448c0 50.8928 41.2672 92.16 92.16 92.16h500.6848c50.8928 0 92.16-41.2672 92.16-92.16V260.0448H170.8032z m249.1392 462.7968c0 14.1312-11.4688 25.6-25.6 25.6s-25.6-11.4688-25.6-25.6V443.0848c0-14.1312 11.4688-25.6 25.6-25.6s25.6 11.4688 25.6 25.6v279.7568z m243.1488 0c0 14.1312-11.4688 25.6-25.6 25.6s-25.6-11.4688-25.6-25.6V443.0848c0-14.1312 11.4688-25.6 25.6-25.6s25.6 11.4688 25.6 25.6v279.7568z"
fill="#FF623E" p-id="8076"></path>
</svg>

After

Width:  |  Height:  |  Size: 896 B

View File

@ -0,0 +1,7 @@
<svg t="1695608082249" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9472"
width="48" height="48">
<path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z" fill="#737BF2" p-id="9473"></path>
<path
d="M726.528 506.432V289.408H323.008v217.024h-33.6v220.352c0 16.64 13.376 30.08 26.88 30.08h413.696c16.768 0 26.88-13.44 26.88-26.624V506.432h-30.336zM356.16 512h333.952V356.16H356.16V512z m22.272-89.024h267.136v-44.544H378.432v44.544z m0 66.752h267.136v-44.48H378.432v44.48z"
fill="#FFFFFF" p-id="9474"></path>
</svg>

After

Width:  |  Height:  |  Size: 586 B

View File

@ -0,0 +1 @@
<svg t="1698157076164" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="26344" width="200" height="200"><path d="M883.2 64a76.8 76.8 0 0 1 76.7488 73.92L960 140.8v742.4a76.8 76.8 0 0 1-73.92 76.7488L883.2 960H140.8a76.8 76.8 0 0 1-76.7488-73.92L64 883.2V140.8a76.8 76.8 0 0 1 73.92-76.7488L140.8 64h742.4zM546.1376 307.2h-76.8a38.4 38.4 0 0 0-38.336 36.1472l-0.064 2.2528v192h153.6V345.6a38.4 38.4 0 0 0-36.1344-38.336L546.1376 307.2z" fill="#6B57FE" p-id="26345"></path><path d="M323.5328 546.432l165.6704 174.0288a25.6 25.6 0 0 0 36.1856 0.896l0.896-0.896 165.6704-174.0416A12.8 12.8 0 0 0 682.688 524.8H332.8a12.8 12.8 0 0 0-9.2672 21.632z" fill="#FFBA00" p-id="26346"></path></svg>

After

Width:  |  Height:  |  Size: 728 B

View File

@ -0,0 +1,10 @@
<svg t="1645001991483" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="17039" width="200" height="200">
<path d="M67.661 517.598a447.654 455.375 0 1 0 895.308 0 447.654 455.375 0 1 0-895.308 0Z" fill="#5E7BF7"
p-id="17040"></path>
<path d="M579.604 194.736L258.135 519.773v187.402s1.407 63.579 65.419 63.579h191.271L835.654 451.16l-256.05-256.424z"
fill="#ffffff" p-id="17041"></path>
<path d="M573.666 247.019L310.555 513.051v153.382s1.152 52.037 53.543 52.037h156.549l262.587-261.576-209.568-209.875z"
fill="#5E7BF7" p-id="17042"></path>
<path d="M419.169 676.486l-69.407-63.919c0 0.001 7.861 63.919 69.407 63.919z" fill="#ffffff" p-id="17043"></path>
</svg>

After

Width:  |  Height:  |  Size: 726 B

View File

@ -0,0 +1 @@
<svg t="1684563121008" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1590" width="200" height="200"><path d="M512 26.54814777c268.1029211 0 485.45185223 217.34892999 485.45185223 485.45185223S780.1029211 997.45185223 512 997.45185223a483.30372779 483.30372779 0 0 1-249.31593443-68.83707335 3170.48604445 3170.48604445 0 0 0-22.8162378-13.38633443l-118.79006777 32.4039111c-27.18530333 7.40314112-52.11325667-17.53694777-44.69797888-44.71011555l32.35536555-118.65656889c-12.52465778-21.26279111-20.72879445-35.52293888-24.80659001-43.13239666A483.42508999 483.42508999 0 0 1 26.54814777 512C26.54814777 243.8970789 243.8970789 26.54814777 512 26.54814777z m0 667.49629668a36.40888889 36.40888889 0 1 0 0 72.81777777 36.40888889 36.40888889 0 0 0 0-72.81777777z m-2.86416555-424.77037c-55.08664889 0-105.52509667 27.48871111-134.95561557 72.1502811a155.97568 155.97568 0 0 0-18.18017109 37.81669888 36.40888889 36.40888889 0 0 0 69.29825109 22.40360335c2.29376-7.09973333 5.55842333-13.88392334 9.69690112-20.15838777C451.01511111 357.16513223 478.67372999 342.09185223 509.13583445 342.09185223 557.82665443 342.09185223 596.95407445 380.32118557 596.95407445 427.04592555s-39.13955555 84.95407445-87.83037667 84.95407445a36.40888889 36.40888889 0 0 0-36.40888889 36.40888889v72.81777778a36.40888889 36.40888889 0 0 0 72.81777778 0v-40.48668445C616.61487445 564.56229888 669.77185223 502.02396445 669.77185223 427.04592555c0-87.33278777-72.11387221-157.77185223-160.64815445-157.7718511z" fill="#FD6112" p-id="1591"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1 @@
<svg t="1684652775796" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2079" width="200" height="200"><path d="M0 0m349.090909 0l325.818182 0q349.090909 0 349.090909 349.090909l0 325.818182q0 349.090909-349.090909 349.090909l-325.818182 0q-349.090909 0-349.090909-349.090909l0-325.818182q0-349.090909 349.090909-349.090909Z" fill="#3271FD" p-id="2080"></path><path d="M718.661818 232.727273a22.341818 22.341818 0 0 1 22.283637 20.677818l0.058181 1.664 0.011637 328.145454a61.463273 61.463273 0 0 1 0 114.501819l-0.011637 71.214545a22.341818 22.341818 0 0 1-44.625454 1.664l-0.058182-1.664v-71.214545a61.463273 61.463273 0 0 1 0-114.501819v-328.145454c0-12.334545 10.007273-22.341818 22.341818-22.341818z m-424.494545 0a22.341818 22.341818 0 0 1 22.283636 20.677818l0.058182 1.664v328.145454a61.463273 61.463273 0 0 1 0 114.501819v71.214545a22.341818 22.341818 0 0 1-44.625455 1.664l-0.058181-1.664-0.011637-71.214545a61.463273 61.463273 0 0 1 0-114.501819l0.011637-328.145454c0-12.334545 10.007273-22.341818 22.341818-22.341818z m212.247272 0a22.341818 22.341818 0 0 1 22.283637 20.677818l0.058182 1.664v81.221818a83.816727 83.816727 0 0 1 0 161.512727v271.127273a22.341818 22.341818 0 0 1-44.625455 1.664l-0.058182-1.664v-271.127273a83.816727 83.816727 0 0 1 0-161.512727v-81.221818c0-12.334545 10.007273-22.341818 22.341818-22.341818z" fill="#FFFFFF" p-id="2081"></path></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -0,0 +1 @@
<svg t="1684652892745" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2397" width="200" height="200"><path d="M0 0m349.090909 0l325.818182 0q349.090909 0 349.090909 349.090909l0 325.818182q0 349.090909-349.090909 349.090909l-325.818182 0q-349.090909 0-349.090909-349.090909l0-325.818182q0-349.090909 349.090909-349.090909Z" fill="#F7A647" p-id="2398"></path><path d="M663.272727 244.363636a46.545455 46.545455 0 0 1 46.545455 46.545455v84.026182L465.501091 619.264a64 64 0 0 0-2.024727 88.389818l2.024727 2.117818a64 64 0 0 0 88.389818 2.024728l2.117818-2.024728L709.818182 555.950545V733.090909a46.545455 46.545455 0 0 1-46.545455 46.545455H279.272727a46.545455 46.545455 0 0 1-46.545454-46.545455V290.909091a46.545455 46.545455 0 0 1 46.545454-46.545455h384z m108.101818 160.046546a29.090909 29.090909 0 0 1 0.93091 39.633454l-1.44291 1.512728-238.545454 232.727272a29.090909 29.090909 0 0 1-42.065455-40.145454l1.431273-1.512727 238.545455-232.727273a29.090909 29.090909 0 0 1 41.134545 0.512zM401.454545 581.818182H314.181818l-1.745454 0.058182A23.272727 23.272727 0 0 0 314.181818 628.363636h87.272727l1.745455-0.058181A23.272727 23.272727 0 0 0 401.454545 581.818182z m64-110.545455H314.181818l-1.745454 0.058182A23.272727 23.272727 0 0 0 314.181818 517.818182h151.272727l1.745455-0.058182A23.272727 23.272727 0 0 0 465.454545 471.272727z m58.181819-116.363636H314.181818l-1.745454 0.058182A23.272727 23.272727 0 0 0 314.181818 401.454545h209.454546l1.745454-0.058181A23.272727 23.272727 0 0 0 523.636364 354.909091z" fill="#FFFFFF" p-id="2399"></path></svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1 @@
<svg t="1684563092128" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1590" width="200" height="200"><path d="M512 1024C229.222 1024 0 794.778 0 512S229.222 0 512 0s512 229.222 512 512-229.222 512-512 512z m259.149-568.883h-290.74a25.293 25.293 0 0 0-25.292 25.293l-0.026 63.206c0 13.952 11.315 25.293 25.267 25.293h177.024c13.978 0 25.293 11.315 25.293 25.267v12.646a75.853 75.853 0 0 1-75.853 75.853h-240.23a25.293 25.293 0 0 1-25.267-25.293V417.203a75.853 75.853 0 0 1 75.827-75.853h353.946a25.293 25.293 0 0 0 25.267-25.292l0.077-63.207a25.293 25.293 0 0 0-25.268-25.293H417.152a189.62000001 189.62000001 0 0 0-189.62000001 189.645V771.15c0 13.977 11.31600001 25.293 25.29400001 25.293h372.94a170.65 170.65 0 0 0 170.65-170.65V480.384a25.293 25.293 0 0 0-25.293-25.267z" fill="#C71D23" p-id="1591"></path></svg>

After

Width:  |  Height:  |  Size: 860 B

View File

@ -0,0 +1 @@
<svg t="1684562716410" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1057" width="200" height="200"><path d="M1024 512c0 282.7776-229.2224 512-512 512S0 794.7776 0 512 229.2224 0 512 0s512 229.2224 512 512z" fill="#2962FF" p-id="1058"></path><path d="M493.5936 234.9056a39.3984 39.3984 0 0 1 36.608 0l1.9584 1.024 1.6384 1.536 243.7376 224.512a45.4144 45.4144 0 0 1 13.7344 49.024 36.8896 36.8896 0 0 1-35.6096 23.168H704V716.8a51.2 51.2 0 0 1-51.2 51.2h-76.8v-115.2a64 64 0 0 0-128 0v115.2h-76.8a51.2 51.2 0 0 1-51.2-51.2V534.1696h-54.2336a36.6336 36.6336 0 0 1-33.024-23.552 44.9536 44.9536 0 0 1 13.9136-48.896l244.992-225.792z" fill="#FFFFFF" p-id="1059"></path></svg>

After

Width:  |  Height:  |  Size: 718 B

View File

@ -0,0 +1,15 @@
<svg t="1645151684066" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="22521" width="200" height="200">
<path
d="M46.661818 848.290909L46.545455 726.667636l85.154909-346.554181h766.301091a52.875636 52.875636 0 0 1 50.664727 67.84l-23.505455 79.499636-83.013818 333.591273a52.875636 52.875636 0 0 1-51.293091 40.145454H99.537455a52.945455 52.945455 0 0 1-52.875637-52.898909z"
fill="#FFEBC0" p-id="22522"></path>
<path
d="M121.157818 446.533818L46.661818 726.109091V189.719273C46.661818 162.071273 68.608 139.636364 95.627636 139.636364h232.587637a48.011636 48.011636 0 0 1 34.583272 14.661818l100.282182 102.586182a9.565091 9.565091 0 0 0 6.912 2.955636H820.130909c26.973091 0 48.919273 22.481455 48.919273 50.129455v70.144H206.196364a88.645818 88.645818 0 0 0-84.992 66.466909l-0.069819-0.046546z"
fill="#FFA000" p-id="22523"></path>
<path
d="M928.465455 420.189091H206.196364c-22.272 0.232727-41.658182 15.383273-47.220364 36.980364L61.300364 837.934545a51.037091 51.037091 0 0 0 8.354909 43.566546c9.122909 12.334545 23.528727 19.642182 38.865454 19.688727h722.269091a49.245091 49.245091 0 0 0 47.220364-36.980363l97.675636-380.765091a50.664727 50.664727 0 0 0-8.308363-43.566546 48.174545 48.174545 0 0 0-38.912-19.688727z"
fill="#FFCA28" p-id="22524"></path>
<path
d="M594.850909 538.926545l155.810909 107.752728a15.872 15.872 0 0 1 0.093091 26.042182l-155.624727 108.846545a10.565818 10.565818 0 0 1-16.663273-8.680727v-57.646546h-221.323636a10.565818 10.565818 0 0 1-10.589091-10.565818l-0.209455-88.669091c0-4.747636 3.188364-8.913455 7.773091-10.193454l2.792727-0.418909h221.323637V547.607273a10.565818 10.565818 0 0 1 16.616727-8.657455z"
fill="#FFFFFF" p-id="22525"></path>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1,7 @@
<svg t="1656660625224" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9850"
width="200" height="200">
<path d="M63.3 512.2a448.5 448 0 1 0 897 0 448.5 448 0 1 0-897 0Z" fill="#4D6BFF" p-id="9851"></path>
<path
d="M416.09375 605.09375c1.21875 0.5625 2.15625 1.5 2.71875 2.71875l82.3125 175.6875c3.1875 6.84375 12.84375 7.03125 15.75 0.375l201.84375-465.75c3.5625-8.15625-4.78125-16.5-12.9375-12.9375L240.125 507.03125c-6.75 2.90625-6.5625 12.5625 0.375 15.75l175.59375 82.3125z"
fill="#ffffff" p-id="9852"></path>
</svg>

After

Width:  |  Height:  |  Size: 578 B

View File

@ -0,0 +1 @@
<svg t="1684653129939" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2874" width="200" height="200"><path d="M0 0m349.090909 0l325.818182 0q349.090909 0 349.090909 349.090909l0 325.818182q0 349.090909-349.090909 349.090909l-325.818182 0q-349.090909 0-349.090909-349.090909l0-325.818182q0-349.090909 349.090909-349.090909Z" fill="#52B852" p-id="2875"></path><path d="M403.397818 298.554182h-86.213818A49.559273 49.559273 0 0 0 267.636364 347.997091v388.770909c0 27.229091 22.190545 49.454545 49.547636 49.454545h389.632A49.559273 49.559273 0 0 0 756.363636 736.756364v-388.770909c0-27.229091-22.190545-49.454545-49.547636-49.454546h-86.213818v4.887273c0 27.229091-21.992727 49.303273-49.28 49.303273H452.677818a49.291636 49.291636 0 0 1-49.28-49.303273v-4.887273z m235.531637 203.392L511.592727 647.703273c-3.397818 5.213091-10.181818 8.866909-17.722182 8.866909-5.899636 0-12.823273-1.547636-17.570909-5.957818L400.814545 586.472727c-9.984-9.890909-10.938182-24.040727-2.90909-35.141818 10.705455-10.984727 25.448727-11.729455 35.630545-3.258182l57.216 48.221091L601.6 469.178182c9.972364-10.100364 24.704-10.775273 34.885818-2.304 10.181818 10.228364 10.938182 24.994909 2.443637 35.083636zM430.545455 284.997818A40.576 40.576 0 0 1 471.202909 244.363636H552.727273a40.529455 40.529455 0 0 1 40.657454 40.634182 40.576 40.576 0 0 1-40.657454 40.645818h-81.524364A40.529455 40.529455 0 0 1 430.545455 284.997818z" fill="#FFFFFF" p-id="2876"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1 @@
<svg t="1684562805352" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1365" width="200" height="200"><path d="M1024 512c0 282.7776-229.2224 512-512 512S0 794.7776 0 512 229.2224 0 512 0s512 229.2224 512 512z" fill="#2962FF" p-id="1366"></path><path d="M760 433.1392a73.5744 73.5744 0 0 1-52.992-36.0576 74.7264 74.7264 0 0 1-5.0176-64.256 35.008 35.008 0 0 0-10.3296-39.168 276.3776 276.3776 0 0 0-82.5984-48.256 34.56 34.56 0 0 0-39.2448 10.9696A73.1904 73.1904 0 0 1 512 284.7872a73.1904 73.1904 0 0 1-57.8176-28.416 34.56 34.56 0 0 0-39.2448-10.9824 277.6064 277.6064 0 0 0-76.9664 43.5328 35.3792 35.3792 0 0 0-10.88 40.32 74.3296 74.3296 0 0 1-5.1712 66.2016 73.152 73.152 0 0 1-55.8464 35.2384 34.8416 34.8416 0 0 0-30.4128 28.1984 273.216 273.216 0 0 0-1.6896 97.472 34.8544 34.8544 0 0 0 30.592 29.3248 73.1776 73.1776 0 0 1 56.576 36.5952 74.3424 74.3424 0 0 1 3.1232 67.6864 34.624 34.624 0 0 0 9.5744 41.2544 278.4256 278.4256 0 0 0 81.856 47.5008c3.8016 1.3312 7.808 2.048 11.8272 2.0864a34.4576 34.4576 0 0 0 28.16-14.7584 72.4864 72.4864 0 0 1 60.0704-31.7952 73.3952 73.3952 0 0 1 58.9568 29.9008c9.344 12.672 25.9968 17.408 40.5504 11.5456a281.1392 281.1392 0 0 0 75.0848-45.2352 35.2 35.2 0 0 0 10.1376-39.936c-8.9472-21.3632-7.424-45.7216 4.1344-65.792a73.1904 73.1904 0 0 1 54.6304-36.224 34.8544 34.8544 0 0 0 29.4784-28.7616c3.008-15.7824 4.6464-31.808 4.8768-47.872 0-16.96-1.5616-33.8816-4.6976-50.5344a34.4832 34.4832 0 0 0-28.9024-28.1984z m-154.1376 78.72c0 52.2752-42.0224 94.6304-93.8624 94.6304-51.84 0-93.8624-42.368-93.8624-94.6176 0-52.2624 42.0224-94.6304 93.8624-94.6304 51.84 0 93.8624 42.368 93.8624 94.6304z" fill="#FFFFFF" p-id="1367"></path></svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1 @@
<svg t="1684562826195" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1673" width="200" height="200"><path d="M1024 512c0 282.7776-229.2224 512-512 512S0 794.7776 0 512 229.2224 0 512 0s512 229.2224 512 512z" fill="#2962FF" p-id="1674"></path><path d="M486.4 537.6v166.4a38.4 38.4 0 0 1-38.4 38.4H320a38.4 38.4 0 0 1-38.4-38.4V576a38.4 38.4 0 0 1 38.4-38.4h166.4z m217.6 0a38.4 38.4 0 0 1 38.4 38.4v128a38.4 38.4 0 0 1-38.4 38.4H576a38.4 38.4 0 0 1-38.4-38.4V537.6h166.4zM448 281.6a38.4 38.4 0 0 1 38.4 38.4v166.4H320a38.4 38.4 0 0 1-38.4-38.4V320a38.4 38.4 0 0 1 38.4-38.4h128z m256 0a38.4 38.4 0 0 1 38.4 38.4v128a38.4 38.4 0 0 1-38.4 38.4H537.6V320a38.4 38.4 0 0 1 38.4-38.4h128z" fill="#FFFFFF" p-id="1675"></path></svg>

After

Width:  |  Height:  |  Size: 769 B

View File

@ -0,0 +1 @@
<svg t="1695043461790" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="20099" width="200" height="200"><path d="M512 0A512 512 0 1 1 0 512 512 512 0 0 1 512 0z" fill="#8967FC" p-id="20100"></path><path d="M523.615086 204.8l254.741943 92.935314a22.908343 22.908343 0 0 1 16.091428 22.1184v171.841829c0 204.419657-222.676114 294.209829-277.167543 322.106514a22.601143 22.601143 0 0 1-20.304457 0C442.382629 785.92 234.057143 697.080686 234.057143 492.982857V320.468114a23.6544 23.6544 0 0 1 15.652571-22.045257L508.094171 204.8h15.520915z m-9.406172 152.853943a76.419657 76.419657 0 0 0-25.117257 148.611657 23.317943 23.317943 0 0 0-0.351086 4.242286V637.805714a25.468343 25.468343 0 0 0 50.936686 0v-127.268571a22.396343 22.396343 0 0 0-0.380343-4.213029 76.463543 76.463543 0 0 0-25.058743-148.640914z" fill="#FFFFFF" p-id="20101"></path></svg>

After

Width:  |  Height:  |  Size: 889 B

View File

@ -0,0 +1 @@
<svg t="1684562960810" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2299" width="200" height="200"><path d="M512 0c282.7776 0 512 229.2224 512 512S794.7776 1024 512 1024 0 794.7776 0 512 229.2224 0 512 0" fill="#FF0808" p-id="2300"></path><path d="M624.1664 538.5856C703.6032 538.5856 768 602.9824 768 682.432A72.7808 72.7808 0 0 1 695.2192 755.2H328.7808A72.7808 72.7808 0 0 1 256 682.432c0-79.4368 64.3968-143.8464 143.8464-143.8464zM512 243.2c70.6944 0 128 57.3056 128 128s-57.3056 128-128 128-128-57.3056-128-128 57.3056-128 128-128z" fill="#FFFFFF" p-id="2301"></path></svg>

After

Width:  |  Height:  |  Size: 626 B

View File

@ -0,0 +1,6 @@
<svg t="1645003476579" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5966"
width="200" height="200">
<path
d="M876.245333 478.890667H427.712c-64.576 0-144.661333 36.650667-186.496 86.250666l-174.122667 204.586667-2.602666 3.136c0-4.117333-0.490667-8.768-0.490667-12.906667v-496a116.16 116.16 0 0 1 115.712-115.733333h165.333333a116.202667 116.202667 0 0 1 115.733334 115.733333v16.490667H760.533333a116.224 116.224 0 0 1 115.733334 115.754667v82.688h-0.021334z m70.613334 129.173333l-153.898667 199.296c-61.952 73.642667-170.432 68.330667-215.893333 68.330667H146.645333c-18.602667 0-44.970667-5.696-44.970666-28.928 0-12.416 7.744-24.789333 16.042666-34.090667l173.589334-204.608c29.973333-35.136 90.965333-63.04 136.405333-63.04h490.24c18.602667 0 42.048 5.674667 42.048 28.928-0.042667 10.986667-4.928 20.352-13.12 34.112z"
p-id="5967" fill="#FF7D00"></path>
</svg>

After

Width:  |  Height:  |  Size: 926 B

View File

@ -0,0 +1 @@
<svg t="1659324307281" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7657" width="200" height="200"><path d="M328 544h368c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" p-id="7658"></path><path d="M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32z m-40 728H184V184h656v656z" p-id="7659"></path></svg>

After

Width:  |  Height:  |  Size: 437 B

View File

@ -0,0 +1,75 @@
<template>
<li
class="gi-option-item"
:class="{ more: more, active: active }"
@click="handleClick"
>
<section class="wrap">
<span class="icon-wrapper">
<slot name="icon">
<component :is="icon" :size="16" :stroke-width="2"></component>
</slot>
</span>
<slot
><span>{{ label }}</span></slot
>
</section>
<IconRight v-if="more" />
</li>
</template>
<script setup lang="ts">
defineOptions({ name: 'GiOptionItem' });
interface Props {
icon?: string;
label?: string;
more?: boolean;
active?: boolean;
}
withDefaults(defineProps<Props>(), {
icon: '',
label: '',
more: false,
active: false,
});
const emit = defineEmits(['click']);
const handleClick = () => {
emit('click');
};
</script>
<style lang="scss" scoped>
.gi-option-item {
padding: 0 5px 0 10px;
height: 34px;
line-height: 34px;
cursor: pointer;
user-select: none;
position: relative;
display: flex;
align-items: center;
color: var(--color-text-2);
font-size: 14px;
.wrap {
display: flex;
align-items: center;
.icon-wrapper {
margin-right: 8px;
display: flex;
align-items: center;
}
}
&.active,
&:hover {
color: rgb(var(--primary-6));
background: var(--color-primary-light-1);
}
&.more {
justify-content: space-between;
}
}
</style>

View File

@ -0,0 +1,20 @@
<template>
<ul class="gi-option">
<slot></slot>
</ul>
</template>
<script setup lang="ts">
defineOptions({ name: 'GiOption' });
</script>
<style lang="scss" scoped>
.gi-option {
width: 100%;
min-width: 100px;
}
ul {
padding-left: 0;
}
</style>

View File

@ -1,24 +1,24 @@
/** @desc 文件模块-映射 */
export interface fileTypeListItem {
name: string
value: number
menuIcon: string
icon: string
name: string;
value: number;
menuIcon: string;
icon: string;
}
// 文件分类
export const fileTypeList: fileTypeListItem[] = [
{ name: '全部', value: 0, menuIcon: 'menu-file', icon: 'icon-stamp' },
{ name: '图片', value: 1, menuIcon: 'file-image', icon: 'icon-file-image' },
{ name: '文档', value: 2, menuIcon: 'file-txt', icon: 'icon-file' },
{ name: '视频', value: 3, menuIcon: 'file-video', icon: 'icon-video-camera' },
{ name: '音频', value: 4, menuIcon: 'file-music', icon: 'icon-file-audio' },
{ name: '其他', value: 5, menuIcon: 'file-other', icon: 'icon-bulb' }
]
{ name: '图片', value: 2, menuIcon: 'file-image', icon: 'icon-file-image' },
{ name: '文档', value: 3, menuIcon: 'file-txt', icon: 'icon-file' },
{ name: '视频', value: 4, menuIcon: 'file-video', icon: 'icon-video-camera' },
{ name: '音频', value: 5, menuIcon: 'file-music', icon: 'icon-file-audio' },
{ name: '其他', value: 1, menuIcon: 'file-other', icon: 'icon-bulb' },
];
export interface FileExtendNameIconMap {
[key: string]: string
[key: string]: string;
}
// 文件类型图标 Map 映射
@ -37,11 +37,11 @@ export const fileExtendNameIconMap: FileExtendNameIconMap = {
html: 'file-html',
css: 'file-css',
js: 'file-js',
other: 'file-other' // 未知文件
}
other: 'file-other', // 未知文件
};
// 图片类型
export const imageTypeList = ['jpg', 'png', 'gif', 'jpeg']
export const imageTypeList = ['jpg', 'png', 'gif', 'jpeg'];
// WPS、Office文件类型
export const officeFileType = ['ppt', 'pptx', 'doc', 'docx', 'xls', 'xlsx']
export const officeFileType = ['ppt', 'pptx', 'doc', 'docx', 'xls', 'xlsx'];

View File

@ -1,176 +0,0 @@
<template>
<a-modal
v-model:visible="visible"
title="移动到"
width="90%"
modal-animation-name="el-dialog"
mask-animation-name="el-mask"
:modal-style="{ maxWidth: '500px' }"
@close="cancel"
@before-ok="save"
>
<a-form
ref="FormRef"
:model="form"
:style="{ width: '100%' }"
auto-label-width
>
<a-form-item
field="path"
label="目标路径"
:rules="[{ required: true, message: '请输入目标路径' }]"
>
<a-input v-model="form.path" placeholder="请输入" />
</a-form-item>
</a-form>
<section class="tree-box">
<a-tree
show-line
size="mini"
block-node
:data="treeData"
@select="handleClickNode"
>
<template #switcher-icon="node, { expanded }">
<GiSvgIcon
v-if="node.children && expanded"
class="switcher-icon"
name="plus-square"
:size="16"
/>
<GiSvgIcon
v-else-if="node.children && !expanded"
class="switcher-icon"
name="minus-square"
:size="16"
style="transform: rotate(0deg)"
/>
<icon-drive-file v-else :size="16" />
</template>
<template #icon>
<GiSvgIcon name="menu-zip" :size="16"></GiSvgIcon>
</template>
</a-tree>
</section>
</a-modal>
</template>
<script setup lang="ts">
import type { FormInstance, Modal, TreeInstance } from '@arco-design/web-vue';
import type { FileItem } from '@/api/system/file';
import { onMounted, reactive, ref } from 'vue';
// import GiSvgIcon from '@/components/GiSvgIcon/index.vue';
interface Props {
fileInfo: FileItem;
onClose: () => void;
}
const props = withDefaults(defineProps<Props>(), {});
const visible = ref(false);
type TForm = { path: string };
const form: TForm = reactive({ path: '/' });
const treeData = ref<object[]>([]);
treeData.value = [
{
title: '图片文件夹',
key: '0-0',
children: [
{
title: '图片文件夹1',
key: '0-0-0',
children: [
{ title: '图片文件夹1-1', key: '0-0-0-0' },
{ title: '图片文件夹1-2', key: '0-0-0-1' },
{ title: '图片文件夹1-3', key: '0-0-0-2' },
],
},
{
title: '新建文件夹',
key: '0-0-1',
},
{
title: '视频文件夹',
key: '0-0-2',
children: [
{ title: '视频文件夹1', key: '0-0-2-0' },
{ title: '视频文件夹2', key: '0-0-2-1' },
],
},
],
},
{
title: '音频文件夹',
key: '0-1',
},
{
title: '音频文件夹1',
key: '0-2',
children: [
{
title: '音频文件夹1-1',
key: '0-2-0',
children: [
{ title: '音频文件夹1-1-1', key: '0-2-0-0' },
{ title: '音频文件夹1-1-2', key: '0-2-0-1' },
],
},
],
},
];
onMounted(() => {
visible.value = true;
});
const handleClickNode: TreeInstance['onSelect'] = (selectedKeys, data) => {
form.path = `/${data.selectedNodes[0].title}`;
};
const cancel = () => {
visible.value = false;
props.onClose();
};
//
const saveApi = (): Promise<boolean> => {
return new Promise((resolve) => {
setTimeout(() => {
resolve(true);
}, 2000);
});
};
const FormRef = ref<FormInstance | null>(null);
const save: InstanceType<typeof Modal>['onBeforeOk'] = async () => {
const flag = await FormRef.value?.validate();
if (flag) return false;
return saveApi();
};
</script>
<style lang="less" scoped>
.label {
color: var(--color-text-2);
}
.switcher-icon {
fill: var(--color-text-2);
}
:deep(.arco-form-item-label-col > label) {
white-space: nowrap;
}
:deep(.arco-tree-node-switcher-icon) {
display: flex;
justify-content: center;
align-items: center;
}
.tree-box {
width: 100%;
height: 300px;
padding: 10px 16px;
box-sizing: border-box;
border: 1px solid var(--color-border);
overflow: auto;
}
</style>

View File

@ -57,11 +57,10 @@
//
const saveApi = (): Promise<boolean> => {
return new Promise((resolve) => {
setTimeout(() => {
resolve(true);
}, 2000)
}
);
setTimeout(() => {
resolve(true);
}, 2000);
});
};
const FormRef = ref<FormInstance | null>(null);

View File

@ -11,7 +11,7 @@
<div class="name">
<icon-music :size="16" spin />
<span
>{{ props.fileInfo?.name }}.{{ props.fileInfo?.extendName }}</span
>{{ props.fileInfo?.name }}.{{ props.fileInfo?.extension }}</span
>
</div>
<div class="close-icon" @click="close">
@ -42,7 +42,7 @@
const audioHeadRef = ref<HTMLElement | null>(null);
const audioSrc = computed(() => {
return props.fileInfo?.src || '';
return props.fileInfo?.url || '';
});
onMounted(() => {

View File

@ -29,7 +29,7 @@
// eslint-disable-next-line no-new
new Player({
id: 'videoId',
url: props.fileInfo?.src || '',
url: props.fileInfo?.url || '',
lang: 'zh-cn',
autoplay: true,
closeVideoClick: true,

View File

@ -4,7 +4,6 @@ import ArcoVueIcon from '@arco-design/web-vue/es/icon';
import ArcoVue from '@arco-design/web-vue';
import { FileItem } from '@/api/system/file';
import FileMoveModal from './FileMoveModal/index.vue';
import FileRenameModal from './FileRenameModal/index.vue';
import PreviewVideoModal from './PreviewVideoModal/index.vue';
import PreviewAudioModal from './PreviewAudioModal/index.vue';
@ -37,11 +36,6 @@ function createModal<T extends { callback?: () => void }>(
type TFileOptions = { fileInfo: FileItem; callback?: () => void };
/** 打开 文件移动 弹窗 */
export function openFileMoveModal(fileItem: FileItem) {
return createModal<TFileOptions>(FileMoveModal, { fileInfo: fileItem });
}
/** 打开 文件重命名 弹窗 */
export function openFileRenameModal(fileItem: FileItem) {
return createModal<TFileOptions>(FileRenameModal, { fileInfo: fileItem });

View File

@ -1,138 +0,0 @@
<template>
<div class="file-detail">
<a-row :gutter="[14, 14]" align="stretch" class="wrap">
<a-col :xs="24" :sm="24" :md="16" :lg="18" :xl="19" :xxl="19">
<div class="left">
<a-row justify="space-between">
<a-button @click="back"><icon-left /></a-button>
</a-row>
<div class="view-box">
<!-- <PreImage></PreImage>-->
</div>
</div>
</a-col>
<a-col :xs="24" :sm="24" :md="8" :lg="6" :xl="5" :xxl="5">
<div class="right">
<a-descriptions
title="文件详情"
:column="1"
size="mini"
table-layout="fixed"
layout="inline-horizontal"
>
<a-descriptions-item label="名称:">头像01</a-descriptions-item>
<a-descriptions-item label="类型:">jpg</a-descriptions-item>
<a-descriptions-item label="路径:">/</a-descriptions-item>
<a-descriptions-item label="文件大小:">256K</a-descriptions-item>
<a-descriptions-item label="创建人:">admin</a-descriptions-item>
<a-descriptions-item label="创建时间:"
>2022-05-18 15:25:08</a-descriptions-item
>
<a-descriptions-item label="文件ID"
>1511952522629615617</a-descriptions-item
>
<a-descriptions-item label="标签:">
<a-space wrap>
<a-tag size="small" color="red">头像</a-tag>
<a-tag size="small" color="orangered">图片</a-tag>
<a-tag size="small" color="purple">JPG</a-tag>
<a-tag size="small" color="blue">壁纸</a-tag>
<a-tag size="small" color="orange">4K</a-tag>
<a-tag size="small" color="green">风景</a-tag>
</a-space>
</a-descriptions-item>
<a-descriptions-item label="说明:"
>基于 v-viewer vue3
实现自定义按钮的图片预览其他功能可自行扩展</a-descriptions-item
>
</a-descriptions>
<a-row justify="end" style="margin-top: 30px">
<a-space>
<a-button>
<template #icon><icon-download :size="16" /></template>
</a-button>
<a-button>
<template #icon><icon-share-alt :size="16" /></template>
</a-button>
<a-button>
<template #icon><icon-drag-arrow :size="16" /></template>
</a-button>
<a-button>
<template #icon><icon-delete :size="16" /></template>
</a-button>
</a-space>
</a-row>
</div>
</a-col>
</a-row>
</div>
</template>
<script setup lang="ts">
import { useRouter } from 'vue-router';
// import PreImage from './PreImage.vue';
defineOptions({ name: 'FileDetail' });
const router = useRouter();
const back = () => {
router.back();
};
</script>
<style lang="less" scoped>
:deep(.arco-descriptions) {
.arco-descriptions-title {
margin-bottom: 12px;
}
.arco-descriptions-item {
display: flex;
margin-bottom: 8px;
.arco-descriptions-item-label-inline {
white-space: nowrap;
font-size: 12px;
}
.arco-descriptions-item-value-inline {
font-size: 12px;
}
}
}
.file-detail {
flex: 1;
padding: 16px;
padding-bottom: 0;
box-sizing: border-box;
overflow: hidden;
overflow-y: auto;
.wrap {
height: 100%;
}
.left,
.right {
background-color: var(--color-bg-1);
padding: 16px;
box-sizing: border-box;
overflow: hidden;
box-sizing: border-box;
}
.left {
height: 100%;
display: flex;
flex-direction: column;
.view-box {
min-height: 400px;
flex: 1;
overflow: hidden;
margin-top: $margin;
}
}
.right {
// width: 300px;
// height: fit-content;
// margin: $margin;
// margin-left: 0;
}
}
</style>

View File

@ -1,30 +1,33 @@
<template>
<a-row align="stretch" :gutter="14" class="file-manage">
<a-col
:xs="0"
:sm="8"
:md="7"
:lg="6"
:xl="5"
:xxl="4"
flex="220px"
class="h-full ov-hidden"
>
<FileAside></FileAside>
</a-col>
<a-col
:xs="24"
:sm="16"
:md="17"
:lg="18"
:xl="19"
:xxl="20"
flex="1"
class="h-full ov-hidden"
>
<FileMain></FileMain>
</a-col>
</a-row>
<div>
<Breadcrumb :items="['menu.system', 'menu.system.file.list']" />
<a-row align="stretch" :gutter="14" class="file-manage">
<a-col
:xs="0"
:sm="8"
:md="7"
:lg="6"
:xl="5"
:xxl="4"
flex="220px"
class="h-full ov-hidden"
>
<FileAside></FileAside>
</a-col>
<a-col
:xs="24"
:sm="16"
:md="17"
:lg="18"
:xl="19"
:xxl="20"
flex="1"
class="h-full ov-hidden"
>
<FileMain></FileMain>
</a-col>
</a-row>
</div>
</template>
<script setup lang="ts">
@ -35,9 +38,13 @@
</script>
<style lang="less" scoped>
.container-breadcrumb {
margin-left: 16px;
}
.file-manage {
flex: 1;
padding: 16px;
padding: 0 16px 16px 16px;
overflow: hidden;
}
</style>

View File

@ -14,6 +14,7 @@
<a-menu-item
v-for="item in fileTypeList"
:key="item.value.toString()"
@click="onClickItem(item)"
>
<template #icon>
<svg-icon
@ -43,8 +44,8 @@
watch(
() => route.query,
() => {
if (route.query.fileType) {
selectedKey.value = route.query.fileType as string;
if (route.query.type) {
selectedKey.value = route.query.type as string;
}
},
{
@ -54,7 +55,7 @@
//
const onClickItem = (item: fileTypeListItem) => {
router.push({ path: '/file', query: { fileType: item.value } });
router.push({ name: 'File', query: { type: item.value } });
};
</script>

View File

@ -71,7 +71,7 @@
//
const getFileName = (item: FileItem) => {
return `${item.name}${item.extendName ? `.${item.extendName}` : ''}`;
return `${item.name}${item.extension ? `.${item.extension}` : ''}`;
};
//

View File

@ -1,6 +1,6 @@
<template>
<img v-if="isImage" class="img" :src="props.data.src || ''" />
<GiSvgIcon v-else size="100%" :name="getFileImg"></GiSvgIcon>
<img v-if="isImage" class="img" :src="props.data.url || ''" alt="" />
<svg-icon v-else size="100%" :icon-class="getFileImg" />
</template>
<script setup lang="ts">
@ -16,25 +16,25 @@
//
const isImage = computed(() => {
return imageTypeList.includes(props.data.extendName.toLowerCase());
return imageTypeList.includes(props.data.extension.toLowerCase());
});
//
const getFileImg = computed<string>(() => {
if (props.data?.isDir) {
return fileExtendNameIconMap.dir || '';
}
if (imageTypeList.includes(props.data.extendName.toLowerCase())) {
return props.data.src || '';
// if (props.data?.isDir) {
// return fileExtendNameIconMap.dir || '';
// }
if (imageTypeList.includes(props.data.extension.toLowerCase())) {
return props.data.url || '';
}
if (
!Object.keys(fileExtendNameIconMap).includes(
props.data.extendName.toLowerCase(),
props.data.extension.toLowerCase(),
)
) {
return fileExtendNameIconMap.other || '';
}
return fileExtendNameIconMap[props.data.extendName.toLowerCase()] || '';
return fileExtendNameIconMap[props.data.extension.toLowerCase()] || '';
});
</script>

View File

@ -1,46 +1,42 @@
<template>
<GiOption :class="{ option: showClassStyle }">
<GiOptionItem @click="onClickItem('rename')">
<template #icon><GiSvgIcon name="menu-edit"></GiSvgIcon> </template>
<template #icon><svg-icon icon-class="menu-edit" /></template>
<span>重命名</span>
</GiOptionItem>
<GiOptionItem @click="onClickItem('move')">
<template #icon><GiSvgIcon name="menu-move"></GiSvgIcon> </template>
<span>移动到</span>
</GiOptionItem>
<GiOptionItem @click="onClickItem('download')">
<template #icon><GiSvgIcon name="menu-download"></GiSvgIcon> </template>
<template #icon><svg-icon icon-class="menu-download" /></template>
<span>下载</span>
</GiOptionItem>
<a-popover
v-if="props.fileInfo.extendName === 'zip'"
v-if="props.fileInfo.extension === 'zip'"
position="right"
:content-style="{ padding: 0, overflow: 'hidden', width: '150px' }"
:arrow-style="{ display: 'none' }"
>
<GiOptionItem more>
<template #icon><GiSvgIcon name="menu-zip"></GiSvgIcon> </template>
<template #icon><svg-icon icon-class="menu-zip" /></template>
<span>解压</span>
</GiOptionItem>
<template #content>
<GiOption>
<GiOptionItem @click="onClickItem('zip1')">
<template #icon><GiSvgIcon name="file-rar"></GiSvgIcon> </template>
<template #icon><svg-icon icon-class="file-rar" /></template>
<span>解压到当前目录</span>
</GiOptionItem>
<GiOptionItem @click="onClickItem('zip2')">
<template #icon><GiSvgIcon name="file-rar"></GiSvgIcon> </template>
<template #icon><svg-icon icon-class="file-rar" /></template>
<span>解压到其他目录</span>
</GiOptionItem>
</GiOption>
</template>
</a-popover>
<GiOptionItem @click="onClickItem('detail')">
<template #icon><GiSvgIcon name="menu-detail"></GiSvgIcon> </template>
<template #icon><svg-icon icon-class="menu-detail" /></template>
<span>详情</span>
</GiOptionItem>
<GiOptionItem @click="onClickItem('delete')">
<template #icon><GiSvgIcon name="menu-delete"></GiSvgIcon> </template>
<template #icon><svg-icon icon-class="menu-delete" /></template>
<span>删除</span>
</GiOptionItem>
</GiOption>
@ -48,8 +44,8 @@
<script setup lang="ts">
import type { FileItem } from '@/api/system/file';
// import GiOption from '@/components/GiOption/index.vue';
// import GiOptionItem from '@/components/GiOptionItem/index.vue';
import GiOption from '@/components/gi-option/index.vue';
import GiOptionItem from '@/components/gi-option-item/index.vue';
interface Props {
fileInfo?: FileItem;
@ -59,13 +55,12 @@
const props = withDefaults(defineProps<Props>(), {
fileInfo: () => ({
id: '',
type: '',
name: '',
extendName: '',
src: '',
size: 0,
url: '',
extension: '',
type: '',
updateTime: '',
isDir: false,
filePath: '',
}), //
showClassStyle: true,
});

View File

@ -3,21 +3,32 @@
<a-row justify="space-between" class="row-operate">
<!-- 左侧区域 -->
<a-space wrap>
<a-button type="primary" shape="round">
<template #icon><icon-upload /></template>
<template #default>上传</template>
</a-button>
<a-input-group>
<a-space>
<a-input placeholder="输入文件名称搜索" allow-clear> </a-input>
<a-button type="primary">
<template #icon><icon-search /></template>查询
<a-form ref="queryRef" :model="queryParams" layout="inline">
<a-form-item hide-label>
<a-button type="primary" shape="round">
<template #icon><icon-upload /></template>
<template #default>上传</template>
</a-button>
<a-button>
<template #icon><icon-refresh /></template>重置
</a-button>
</a-space>
</a-input-group>
</a-form-item>
<a-form-item field="name" hide-label>
<a-input
v-model="queryParams.name"
placeholder="输入文件名称搜索"
allow-clear
@press-enter="handleQuery"
/>
</a-form-item>
<a-form-item hide-label>
<a-space>
<a-button type="primary" @click="handleQuery">
<template #icon><icon-search /></template>查询
</a-button>
<a-button @click="resetQuery">
<template #icon><icon-refresh /></template>重置
</a-button>
</a-space>
</a-form-item>
</a-form>
</a-space>
<!-- 右侧区域 -->
@ -78,64 +89,71 @@
<script setup lang="ts">
import { Message, Modal } from '@arco-design/web-vue';
import { api as viewerApi } from 'v-viewer';
import { fileTypeList, imageTypeList } from '@/constant/file';
import { imageTypeList } from '@/constant/file';
import { useFileStore } from '@/store/modules/file';
import type { FileItem } from '@/api/system/file';
import { getFileList } from '@/api/system/file';
import type { ListParam, FileItem } from '@/api/system/file';
import { list } from '@/api/system/file';
import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router';
import { onMounted, ref } from 'vue';
import { getCurrentInstance, onMounted, reactive, ref, toRefs } from 'vue';
import FileGrid from './FileGrid.vue';
import FileList from './FileList.vue';
import {
openFileMoveModal,
openFileRenameModal,
previewFileVideoModal,
previewFileAudioModal,
} from '../../components/index';
const { proxy } = getCurrentInstance() as any;
const route = useRoute();
const router = useRouter();
const fileStore = useFileStore();
const loading = ref(false);
//
const fileList = ref<FileItem[]>([]);
const fileType = ref('0');
//
const isBatchMode = ref(false);
fileType.value = route.query.fileType?.toString() || '0';
const getListData = async () => {
const data = reactive({
//
queryParams: {
name: undefined,
type: route.query.type?.toString() || undefined,
sort: ['updateTime,desc'],
},
});
const { queryParams } = toRefs(data);
const getList = async (params: ListParam = { ...queryParams.value }) => {
try {
loading.value = true;
isBatchMode.value = false;
// const res = await getFileList({ fileType: fileType.value });
// fileList.value = res.data;
params.type = params.type === '0' ? undefined : params.type;
const res = await list(params);
fileList.value = res.data.list;
} finally {
loading.value = false;
}
};
onMounted(() => {
getListData();
getList();
});
onBeforeRouteUpdate((to) => {
if (!to.query.fileType) return;
fileType.value = to.query.fileType?.toString();
getListData();
if (!to.query.type) return;
queryParams.value.type = to.query.type?.toString();
getList();
});
//
const handleClickFile = (item: FileItem) => {
Message.success(`点击了文件-${item.name}`);
if (imageTypeList.includes(item.extendName)) {
if (item.src) {
if (imageTypeList.includes(item.extension)) {
if (item.url) {
const imgList: string[] = fileList.value
.filter((i) => imageTypeList.includes(i.extendName))
.map((a) => a.src || '');
const index = imgList.findIndex((i) => i === item.src);
.filter((i) => imageTypeList.includes(i.extension))
.map((a) => a.url || '');
const index = imgList.findIndex((i) => i === item.url);
if (imgList.length) {
viewerApi({
options: {
@ -146,10 +164,10 @@
}
}
}
if (item.extendName === 'mp4') {
if (item.extension === 'mp4') {
previewFileVideoModal(item);
}
if (item.extendName === 'mp3') {
if (item.extension === 'mp3') {
previewFileAudioModal(item);
}
};
@ -171,11 +189,8 @@
if (mode === 'rename') {
openFileRenameModal(fileInfo);
}
if (mode === 'move') {
openFileMoveModal(fileInfo);
}
if (mode === 'detail') {
router.push({ path: '/file/detail' });
// TODO
}
};
@ -187,6 +202,21 @@
hideCancel: false,
});
};
/**
* 查询
*/
const handleQuery = () => {
getList();
};
/**
* 重置
*/
const resetQuery = () => {
proxy.$refs.queryRef.resetFields();
handleQuery();
};
</script>
<style lang="less" scoped>
@ -199,7 +229,7 @@
overflow: hidden;
.row-operate {
border-bottom: 1px dashed var(--color-border-3);
margin: 20px 16px;
margin: 20px 16px 0;
}
.file-wrap {
flex: 1;
@ -210,4 +240,8 @@
flex-direction: column;
}
}
:deep(.arco-form-item-layout-inline) {
margin-right: 8px;
}
</style>

View File

@ -0,0 +1,41 @@
/*
* Copyright (c) 2022-present Charles7c Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package top.charles7c.continew.admin.webapi.system;
import io.swagger.v3.oas.annotations.tags.Tag;
import org.springframework.web.bind.annotation.*;
import top.charles7c.continew.admin.system.model.query.FileQuery;
import top.charles7c.continew.admin.system.model.req.FileReq;
import top.charles7c.continew.admin.system.model.resp.FileDetailResp;
import top.charles7c.continew.admin.system.model.resp.FileResp;
import top.charles7c.continew.admin.system.service.FileService;
import top.charles7c.continew.starter.extension.crud.annotation.CrudRequestMapping;
import top.charles7c.continew.starter.extension.crud.base.BaseController;
import top.charles7c.continew.starter.extension.crud.enums.Api;
/**
* 文件管理 API
*
* @author Charles7c
* @since 2023/12/23 10:38
*/
@Tag(name = "文件管理 API")
@RestController
@CrudRequestMapping(value = "/system/file", api = {Api.PAGE, Api.GET, Api.UPDATE, Api.DELETE})
public class FileController extends BaseController<FileService, FileResp, FileDetailResp, FileQuery, FileReq> {}

View File

@ -8,14 +8,14 @@ CREATE TABLE IF NOT EXISTS `sys_file` (
`url` varchar(512) NOT NULL COMMENT 'URL',
`extension` varchar(100) DEFAULT NULL COMMENT '扩展名',
`mime_type` varchar(100) DEFAULT NULL COMMENT 'MIME类型',
`category` tinyint(1) UNSIGNED NOT NULL DEFAULT 1 COMMENT '类型1其他2图片3文档4视频5音频',
`type` tinyint(1) UNSIGNED NOT NULL DEFAULT 1 COMMENT '类型1其他2图片3文档4视频5音频',
`storage_id` bigint(20) NOT NULL COMMENT '存储库ID',
`create_user` bigint(20) NOT NULL COMMENT '创建人',
`create_time` datetime NOT NULL COMMENT '创建时间',
`update_user` bigint(20) DEFAULT NULL COMMENT '修改人',
`update_time` datetime DEFAULT NULL COMMENT '修改时间',
PRIMARY KEY (`id`) USING BTREE,
INDEX `idx_category`(`category`) USING BTREE,
INDEX `idx_type`(`type`) USING BTREE,
INDEX `idx_create_user`(`create_user`) USING BTREE,
INDEX `idx_update_user`(`update_user`) USING BTREE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='文件表';