请验图片处理

Administrator

2025-05-08 0d794d748f61b5c719d665bfcae24a4d9b2b6224

请验图片处理

 HTML/views/QualityControl/InspectionRequest.html

@@ -22,6 +22,13 @@
        .layui-table-grid-down {
            display: none;
        }

        /* 样式用于美化图片展示 */
        .layui-table-cell img {
            max-width: 100px;
            max-height: 100px;
        }
    
    </style>
    <script>
        // 这里是需要在页面渲染之前执行的代码
@@ -119,6 +126,21 @@
                            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>搜索
                        </button>

                    </div>

                    <div style="display: none;" id="UploadImageView">

                        <div  id="UploadImage" style="margin-left: 35px;margin-top: 30px;">
                            <label>上传图片:</label><button type="button" class="layui-btn" id="uploadBtn" style="margin-left: 20px;" >浏览</button>
                            <button type="button" class="layui-btn" id="upload" style="margin-left: 20px;">上传</button>
								
                        </div>
                    </div>

                    <div style="display: none;" id="ImagesShowView">
                        <div id="ImagesShow">

                        </div>
                    </div>

                    <!-- 确认出库口弹窗 -->
@@ -223,6 +245,10 @@
                            var html = ''; 
                            switch (d.Status) {
                                case "0" :
                                    html += `<a class="layui-btn layui-btn-normal layui-btn-xs addClass" lay-event="upImage">
                                    <i class="layui-icon layui-icon-add"></i>上传</a> `;
                                    html += `<a class="layui-btn layui-btn-normal layui-btn-xs addClass" lay-event="ViewImage">
                                        <i class="layui-icon layui-icon-add"></i>查看</a> `;
                                    html += `<a class="layui-btn layui-btn-normal layui-btn-xs addClass" lay-event="add">
                                            <i class="layui-icon layui-icon-add"></i>请验</a> `;
                                    html += `<a class="layui-btn layui-btn-danger layui-btn-xs delClass" lay-event="del">
@@ -287,13 +313,14 @@
            base: '../../layuiadmin/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index', 'table', 'laypage', 'element', 'layer', 'laydate'], function () {
        }).use(['index', 'table', 'laypage', 'element', 'layer', 'laydate','upload'], function () {
            var table = layui.table,
                form = layui.form,
                element = layui.element;
            laypage = layui.laypage,
                layer = layui.layer;
            laydate = layui.laydate;
                element = layui.element,
                laypage = layui.laypage,
                layer = layui.layer,
                laydate = layui.laydate,
                upload    = layui.upload;
            var h1 = GetTableTabHeight();
            laydate.render({
                elem: '#StartTime'
@@ -379,7 +406,8 @@
                { field: 'Status', title: '执行状态', align: 'center', width: 90, templet: '#templetStatus' },
                { field: 'RequestTime', title: '请验日期', align: 'center', width: 165, templet: '#templetCompleteTime' },
                { field: 'RequestUser', title: '请验人', align: 'center', width: 165 },
                // { field: 'UDF1', title: '自定义1', align: 'center', width: 100 },
                { field: 'UDF5', title: '图片', align: 'center', width: 100 ,templet: function (d) {
                    return d.image ? '<img src="' + d.image + '" alt="图片">' : '无图片';}},
                // { field: 'UDF2', title: '自定义2', align: 'center', width: 100 },
                // { field: 'UDF3', title: '自定义3', align: 'center', width: 100 },
                // { field: 'UDF4', title: '自定义4', align: 'center', width: 100 },
@@ -495,6 +523,65 @@
            table.on('tool(InspectionRequest)', function (obj) {
                var data = obj.data;
                switch (obj.event) {
                    case "upImage":
                    layer.open({
                                type:1,
                                title: '上传图片',
                                content: $('#UploadImageView'),
                                maxmin: true,
                                area: ['350px','215px'],
                                btn: ['确定'],
                                success: function(index, layero){
                                    upload.render({
                                        elem: '#uploadBtn',
                                        url: IP + '/BllQuality/UploadImage',
                                        accept: 'images',
                                        exts:'jpg|png|gif',
                                        multiple: false,
                                        size: 1024 * 5, // 5MB
                                        auto: false,
                                        bindAction: '#upload',
                                        headers: { ToKen: $.cookie('token') },
                                        xhrFields: {
                                            withCredentials: true // 携带cookie
                                        },
                                        before: function(){
                                            this.data = {
                                                qualityId:data.Id
                                            };
                                        layer.load(1, {shade: [0.5, '#000']});
                                        },
                                        done: function(res){
                                        layer.closeAll('loading');
                                        if(res.code == 0){
                                            layer.msg('上传成功', {icon: 1});
                                            // 上传成功后的回调，如刷新表格等
                                            // table.reload('LAY-app-content-list');
                                        } else {
                                            layer.msg(res.msg || '上传失败', {icon: 2});
                                        }
                                        },
                                        error: function(){
                                        layer.closeAll('loading');
                                        layer.msg('上传失败', {icon: 2});
                                        }
                                    });
                                }
                            });
                    break;
                    case "ViewImage":
                    layer.open({
                                    type:1,
                                    title: '查看图片',
                                    content: $('#ImagesShowView'),
                                    maxmin: true,
                                    area: ['650px','315px'],
                                    btn: ['确定'],
                                    success: function(index, layero){
                                        getImage(data.Id);
                                    }
                                });
                    break;
                    case "add":
                        layer.confirm('确定要发起请验？', function (index) {
                            var param = {
@@ -627,6 +714,55 @@
                }
            });

            function getImage(id)
                {	
                    var param = {
                        Id:id
                    }
                    sendData(IP + "/BllQuality/GetImage", param, 'post', function (res) {
                        if (res.code == 0) { //成功
                            $("#ImagesShow").html('');	
                            res.data.forEach(function (item) {
                                $("#ImagesShow").append('<div>'+
                                '<a href='+item+' target="_blank" class="image-item"><img src="'+ item + '"  /></a>'+
                                '<button class="layui-btn layui-btn-primary layui-btn-sm delete-btn" data-type="customCols" data_Url='+item+' >删除</button>'+
                                '</div>');
                            })
                            $('.delete-btn').on('click',  function ( ) {
                                var item = $(this);
                                var QualityId = id;
                                var imageUrl = item.attr('data_Url');
                                layer.confirm('确定删除吗？', function (index) {
                                    var param = {
                                        QualityId: QualityId,
                                        ImageUrl: imageUrl
                                    }
                                    sendData(IP + "/BllQuality/DeleteImage", param, 'post', function (res) {
                                        if (res.code == 0) { //成功
                                            layer.msg(res.msg, {
                                                icon: 1,
                                                time: 1000 //2秒关闭（如果不配置，默认是3秒）
                                            }, function () {
                                                getImage(id);
                                            });
                                            } else {
                                                layer.msg(res.msg, {
                                                    icon: 2,
                                                    time: 2000 //2秒关闭（如果不配置，默认是3秒）
                                                });
                                            }
                                    });
                                })});
                        } else { //不成功
                            $("#ImagesShow").html('');
                                res.msg, {
                                icon: 2,
                                time: 2000 //2秒关闭（如果不配置，默认是3秒）
                                }
                        }
                    })
                }

            // 取样明细单机事件
            table.on('tool(SamplingDetails)', function (obj) {
                var data = obj.data;

 Wms/Model/ModelVm/IdVm.cs

@@ -8,4 +8,14 @@
        public List<int> Ids { get; set; }
        public string Code { get; set; }
    }

    /// <summary>
    /// 请验图片
    /// </summary>
    public class QualityImageVM 
    {
        public int QualityId { get; set; }

        public string ImageUrl { get; set; }
    }
}

 Wms/Wms/Controllers/BllQualityController.cs

@@ -9,6 +9,11 @@
using Model.ModelVm;
using Wms.Tools;
using Microsoft.Extensions.Options;
using System.Collections.Generic;
using System.IO;
using System.Threading.Tasks;
using System.Linq;


namespace Wms.Controllers
{
@@ -164,6 +169,32 @@
            }
        }

        [HttpPost]
        public IActionResult upLoadRequest(IdVm model) 
        {
            try
            {
                var claimsIdentity = this.User.Identity as ClaimsIdentity;
                if (claimsIdentity == null)
                {
                    return Ok(new { code = 1, msg = "未获取到当前操作人信息" });
                }
                var userId = claimsIdentity.FindFirst(ClaimTypes.Name)?.Value;
                if (string.IsNullOrWhiteSpace(userId))
                {
                    return Ok(new { code = 1, msg = "未获取到当前操作人信息" });
                }
                var userName = claimsIdentity.FindFirst(ClaimTypes.NameIdentifier)?.Value;


                return Ok(new { code = 0, count = 0, msg = "上传图片成功!"});
            }
            catch (Exception e)
            {
                return Ok(new { code = 1, msg = e.Message });
            }
        }

        /// <summary>
        /// 发送请验单据
        /// </summary>
@@ -292,6 +323,137 @@
                return Ok(new { code = 1, msg = e.Message });
            }
        }

        /// <summary>
        ///  图片上传
        /// </summary>
        /// <param name="file"></param>
        /// <param name="qualityId"></param>
        /// <returns></returns>
        [HttpPost]
        public async Task<IActionResult> UploadImage([FromForm] IFormFile file, [FromForm] int qualityId)
        {
            try
            {
                var claimsIdentity = this.User.Identity as ClaimsIdentity;
                var userId = claimsIdentity.FindFirst(ClaimTypes.Name)?.Value;
                if (file == null || file.Length == 0)
                    return BadRequest(new { code = 1, msg = "请选择上传文件" });

                // 验证文件类型
                var allowedExtensions = new[] { ".jpg", ".jpeg", ".png", ".gif" };
                var fileExtension = Path.GetExtension(file.FileName).ToLower();
                if (!allowedExtensions.Contains(fileExtension))
                    return BadRequest(new { code = 2, msg = "只允许上传图片文件" });

                // 限制文件大小 (5MB)
                if (file.Length > 5 * 1024 * 1024)
                    return BadRequest(new { code = 3, msg = "文件大小不能超过5MB" });

                // 创建质量相关的图片目录
                var uploadPath = Path.Combine(Directory.GetCurrentDirectory(), "wwwRoot", "uploads", "quality", qualityId.ToString());
                if (!Directory.Exists(uploadPath))
                    Directory.CreateDirectory(uploadPath);

                // 生成唯一文件名
                var fileName = $"{DateTime.Now:yyyyMMddHHmmss}_{userId}{fileExtension}";
                var filePath = Path.Combine(uploadPath, fileName);

                // 保存文件
                using (var stream = new FileStream(filePath, FileMode.Create))
                {
                    await file.CopyToAsync(stream);
                }

                // 返回文件访问路径
                var fileUrl = $"/wwwRoot/uploads/quality/{qualityId}/{fileName}";

                // 这里可以添加数据库记录等操作
                // _qualityService.AddImageRecord(qualityId, userId, fileUrl, fileName);

                return Ok(new
                {
                    code = 0,
                    msg = "上传成功",
                    data = new
                    {
                        url = fileUrl,
                        fileName = fileName
                    }
                });
            }
            catch (Exception ex)
            {
                return StatusCode(500, new { code = 500, msg = $"上传失败: {ex.Message}" });
            }
        }

        /// <summary>
        /// 图片获取
        /// </summary>
        /// <param name="model"></param>
        /// <returns></returns>
        [HttpPost]
        public IActionResult GetImage(BllQualityInspect model)
        {
            try
            {

                var fullPath = Path.Combine(Directory.GetCurrentDirectory(), "wwwRoot", "uploads", "quality", model.Id.ToString());
                if (!Directory.Exists(fullPath))
                {
                    return StatusCode(1, new { code = 1, msg = "图片不存在" });
                }
                var files = Directory.GetFiles(fullPath);
                if (files.Length <= 0)
                    return StatusCode(1, new { code = 1, msg = "图片不存在" });
                List<string> images = new List<string>();
                foreach (var file in files)
                {
                    images.Add($"{Request.Scheme}://{Request.Host}/uploads/quality/{model.Id.ToString()}/{Path.GetFileName(file)}");
                }
                return Ok(new
                {
                    code = 0,
                    msg = "图片" + files.Length + "张",
                    data = images
                });
            }
            catch (Exception ex)
            {
                return StatusCode(500, new { code = 500, msg = $"获取图片失败: {ex.Message}" });
            }
        }

        /// <summary>
        /// 删除图片
        /// </summary>
        /// <param name="data">图片信息</param>
        /// <returns></returns>
        [HttpPost]
        public IActionResult DeleteImage(QualityImageVM data)
        {
            try
            {
                string fileName = Path.GetFileName(data.ImageUrl);

                var filePath = Path.Combine(Directory.GetCurrentDirectory(), "wwwRoot", "uploads", "quality", data.QualityId.ToString(), fileName);
                if (System.IO.File.Exists(filePath))
                {
                    System.IO.File.Delete(filePath);

                    return Ok(new { code = 0, msg = "删除成功" });
                }
                else
                {
                    return Ok(new { code = 1, msg = "图片不存在" });
                }
            }
            catch (Exception ex)
            {
                return Ok(new { code = 1, msg = ex.Message });
            }
        }
        #endregion
    }
}