diff --git a/app/assets/javascripts/admin.js b/app/assets/javascripts/admin.js index 0cab04359..d738e5caa 100644 --- a/app/assets/javascripts/admin.js +++ b/app/assets/javascripts/admin.js @@ -99,3 +99,38 @@ $(document).on("turbolinks:before-cache", function () { $(function () { }); + +$(document).on('turbolinks:load', function() { + + $('.logo-item-left').on("change", 'input[type="file"]', function () { + var $fileInput = $(this); + var file = this.files[0]; + var imageType = /image.*/; + if (file && file.type.match(imageType)) { + var reader = new FileReader(); + reader.onload = function () { + var $box = $fileInput.parent(); + $box.find('img').attr('src', reader.result).css('display', 'block'); + $box.addClass('has-img'); + }; + reader.readAsDataURL(file); + } else { + } + }); + + $('.attachment-item-left').on("change", 'input[type="file"]', function () { + var $fileInput = $(this); + var file = this.files[0]; + var imageType = /image.*/; + if (file && file.type.match(imageType)) { + var reader = new FileReader(); + reader.onload = function () { + var $box = $fileInput.parent(); + $box.find('img').attr('src', reader.result).css('display', 'block'); + $box.addClass('has-img'); + }; + reader.readAsDataURL(file); + } else { + } + }); +}) \ No newline at end of file diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index a401fc379..03c3970a6 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -58,3 +58,149 @@ input.form-control { position: absolute; } +.logo-item { + display: flex; + + &-img { + display: block; + width: 80px; + height: 80px; + background: #e9ecef; + } + + &-upload { + cursor: pointer; + position: absolute; + top: 0; + width: 80px; + height: 80px; + background: #e9ecef; + border: 1px solid #ced4da; + + &::before { + content: ''; + position: absolute; + top: 27px; + left: 39px; + width: 2px; + height: 26px; + background: #495057; + } + + &::after { + content: ''; + position: absolute; + top: 39px; + left: 27px; + width: 26px; + height: 2px; + background: #495057; + } + } + + &-left { + position: relative; + width: 80px; + height: 80px; + + &.has-img { + .logo-item-upload { + display: none; + } + + &:hover { + .logo-item-upload { + display: block; + background: rgba(145, 145, 145, 0.8); + } + } + } + } + + &-right { + display: flex; + flex-direction: column; + justify-content: space-between; + color: #777777; + font-size: 0.8rem; + } + + &-title { + color: #23272B; + font-size: 1rem; + } +} + +.attachment-item { + display: flex; + + &-img { + display: block; + width: 160px; + height: 160px; + background: #e9ecef; + } + + &-upload { + cursor: pointer; + position: absolute; + top: 0; + width: 160px; + height: 160px; + background: #e9ecef; + border: 1px solid #ced4da; + + &::before { + content: ''; + position: absolute; + top: 54px; + left: 78px; + width: 2px; + height: 52px; + background: #495057; + } + + &::after { + content: ''; + position: absolute; + top: 78px; + left: 54px; + width: 52px; + height: 2px; + background: #495057; + } + } + + &-left { + position: relative; + width: 160px; + height: 160px; + + &.has-img { + .attachment-item-upload { + display: none; + } + + &:hover { + .attachment-item-upload { + display: block; + background: rgba(145, 145, 145, 0.8); + } + } + } + } + + &-right { + padding-top: 100px; + display: flex; + flex-direction: column; + justify-content: space-between; + color: #777777; + font-size: 0.8rem; + } + + &-title { + color: #23272B; + font-size: 1rem; + } +} \ No newline at end of file diff --git a/app/controllers/admins/project_categories_controller.rb b/app/controllers/admins/project_categories_controller.rb index 282faf771..8b1dd1f77 100644 --- a/app/controllers/admins/project_categories_controller.rb +++ b/app/controllers/admins/project_categories_controller.rb @@ -33,7 +33,7 @@ class Admins::ProjectCategoriesController < Admins::BaseController end def update - if @project_category.update_attributes({name: @name, pinned_index: params[:project_category][:pinned_index].to_i}) + if @project_category.update_attributes({name: @name, pinned_index: params[:project_category][:pinned_index].to_i}) && save_image_file(params[:logo], 'logo') redirect_to admins_project_categories_path flash[:success] = '更新成功' else @@ -80,4 +80,12 @@ class Admins::ProjectCategoriesController < Admins::BaseController flash[:danger] = '分类已存在' end end + + def save_image_file(file, type) + return unless file.present? && file.is_a?(ActionDispatch::Http::UploadedFile) + + file_path = Util::FileManage.source_disk_filename(@project_category, type) + File.delete(file_path) if File.exist?(file_path) # 删除之前的文件 + Util.write_file(file, file_path) + end end \ No newline at end of file diff --git a/app/models/project_category.rb b/app/models/project_category.rb index a8362af69..4bba5423e 100644 --- a/app/models/project_category.rb +++ b/app/models/project_category.rb @@ -21,6 +21,14 @@ class ProjectCategory < ApplicationRecord has_ancestry def logo_url - "" + image_url('logo') end + + private + + def image_url(type) + return nil unless Util::FileManage.exists?(self, type) + Util::FileManage.source_disk_file_url(self, type) + end + end diff --git a/app/views/admins/project_categories/_form_modal.html.erb b/app/views/admins/project_categories/_form_modal.html.erb index 84e43416a..f638b4d0e 100644 --- a/app/views/admins/project_categories/_form_modal.html.erb +++ b/app/views/admins/project_categories/_form_modal.html.erb @@ -7,7 +7,7 @@ - <%= form_for @project_category, url: {controller: "project_categories", action: "#{type}"} do |p| %> + <%= form_for @project_category, url: {controller: "project_categories", action: "#{type}"}, html: { enctype: 'multipart/form-data' } do |p| %>