循序渐进VUE+Element 前端应用开发(28）--- 附件内容的管理

<el-tabs value="treeType" type="border-card">
  <el-tab-pane name="treeType" label="按文件类型">
    <myTree :data="treeType" icon-class="el-icon-price-tag" @nodeClick="nodeTypeClick" />
  </el-tab-pane>
  <el-tab-pane name="treeCategory" label="按类别名称">
    <myTree :data="treeCategory" icon-class="el-icon-price-tag" @nodeClick="nodeCategoryClick" />
  </el-tab-pane>
</el-tabs>

/// <summary>
        /// 获取所有类别(Distinct)
        /// </summary>
        /// <returns></returns>
        public virtual async Task<List<string>> GetAllCategory()
        {
            var query = Repository.GetAll().Where(s=> s.Category != null).OrderBy(s => s.Category);
            var list = query.Select(s => s.Category).Distinct().ToList();
            return await Task.FromResult(list);
        }

public void Configure(IApplicationBuilder app, ILoggerFactory loggerFactory)
        {
            ............
            app.UseStaticFiles();
            //指定特定的目录作为静态文件目录，如UploadFiles
            //是否可以访问静态文件
            app.UseStaticFiles(new StaticFileOptions
            {
                FileProvider = new PhysicalFileProvider(Path.Combine(System.AppDomain.CurrentDomain.BaseDirectory, "UploadFiles")),
                RequestPath = "/UploadFiles"
            }); 
            .........

/// <summary>
        /// 对记录进行转义
        /// </summary>
        /// <param name="item">dto数据对象</param>
        /// <returns></returns>
        protected override void ConvertDto(FileUploadDto item)
        {
            //转义相对地址为绝对地址
            item.FileUrl = GetFileUrl(item.BasePath, item.SavePath);
        }

/// <summary>
        /// 根据记录的basePath和savePath，以及HttpContext上下文确定绝对路径
        /// </summary>
        /// <param name="basePath">附件的基础路径</param>
        /// <param name="savePath">附件的保存路径</param>
        /// <returns></returns>
        private string GetFileUrl(string basePath, string savePath)
        {
            var httpContext = _httpContext.HttpContext;
            string serverRealPath = basePath.UriCombine(savePath);
            if (!Path.IsPathRooted(basePath) &&
                !basePath.StartsWith("http://") &&
                !basePath.StartsWith("https://"))
            {
                //如果是相对目录，加上当前程序的目录才能定位文件地址
                var url = string.Format("{0}://{1}", httpContext.Request.Scheme, httpContext.Request.Host.Value);
                serverRealPath = url.UriCombine(serverRealPath).Replace('\\', '/');
            }
            return serverRealPath;
        }

<el-form-item label="封面图片">
      <el-upload
        ref="upload"
        action="/abp/services/app/FileUpload/PostUpload"
        list-type="picture-card"
        :on-preview="handlePictureCardPreview"
        :on-remove="handleRemove"
        :on-success="onSuccess"
        :on-error="onError"
        accept="image/jpeg,image/gif,image/png,image/bmp"
        :headers="myHeaders"
        :file-list="editForm.fileList"
      >
        <i class="el-icon-plus" />
      </el-upload>
      <el-dialog :visible.sync="dialogVisible">
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
    </el-form-item>

myHeaders: { Authorization: 'Bearer ' + getToken() }, // 用于上传文件的身份认证