material.html 10 KB
<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="gray-bg">
    <div class="container-div">
		<div class="row">
			<div class="col-sm-12 select-info">
				<form id="material-form">
					<div class="select-list">
						<ul>
							<li>
								存货编码:<input type="text" name="code"/>
							</li>
							<li>
								名称:<input type="text" name="name"/>
							</li>
							<li>
								库区编码:<input type="text" name="zoneCode"/>
							</li>
							<li>
								规格:<input type="text" name="specification"/>
							</li>
							<li>
								物料类别:<select name="type" th:with="type=${@dict.getType('materialType')}">
								<option value="">所有</option>
								<option th:each="e : ${type}" th:text="${e['dictLabel']}" th:value="${e['dictValue']}"></option>
							</select>
							</li>
							<li class="time">
								<label>创建时间: </label>
								<input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[createdBegin]"/>
								<span>-</span>
								<input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[createdEnd]"/>
							</li>
							<li>
								<a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
								<!--<a class="btn btn-success btn-rounded btn-sm" onclick="$.table.exportExcel()" shiro:hasPermission="general:material:export"><i class="fa fa-download"></i>&nbsp;导出</a>-->
							</li>
						</ul>
					</div>
				</form>
			</div>

		<div class="btn-group hidden-xs" id="toolbar" role="group">
			<a class="btn btn-outline btn-success btn-rounded" onclick="$.operate.add()"
               shiro:hasPermission="general:material:add">
				<i class="fa fa-plus"></i> 新增
			</a>
			<!--<a class="btn btn-outline btn-primary btn-rounded" onclick="materialExportExcel()" shiro:hasPermission="general:material:add">
				<i class="fa fa-level-up"></i> 导出表格模板
			</a>-->
            <a class="btn btn-outline btn-danger btn-rounded" onclick="importExcel()" shiro:hasPermission="general:material:add">
                <i class="fa fa-level-down"></i> 导入表格数据
            </a>
		</div>
			
		<div class="col-sm-12 select-info">
			<table id="bootstrap-table" data-mobile-responsive="true" class="table table-bordered table-hover"></table>
		</div>
		</div>
    </div>
    <div th:include="include :: footer"></div>
    <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('general:material:edit')}]];
        var removeFlag = [[${@permission.hasPermi('general:material:remove')}]];
        var prefix = ctx + "general/material";
        var datas = [[${@dict.getType('sys_normal_disable')}]];
        var mType = [[${@dict.getType('materialType')}]];
        $(function() {
            var options = {
                url: prefix + "/list",
                createUrl: prefix + "/add",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                modalName: "物料",
                search: false,
                sortName: "id",
                sortOrder: "desc",
                columns: [{
		            checkbox: true
		        },
				{
					field : 'id', 
					title : 'id'
				},
				// {
				// 	field : 'warehouseCode',
				// 	title : '仓库编码'
				// },
				{
					field : 'code',
					title : '存货编码'
				},
                    {
                        field : 'barcode',
                        title : '条码',
                        visible:false
                    },
                    {
                        field : 'name',
                        title : '名称'
                    },
                    {
                        field : 'specification',
                        title : '规格'
                    },
				{
					field : 'type', 
					title : '物料类别' ,
                    align: 'center',
                    formatter: function(value, row, index) {
                        return $.table.selectDictLabel(mType, value);
                    }
				},
                    {
                        field : 'masterUnit',
                        title : '主计量单位' ,
                        visible:true
                    },
                    {
                        field : 'zoneCode',
                        title : '库区编码'
                    },

				{
					field : 'created', 
					title : '创建时间' 
				},
				{
					field : 'createdBy', 
					title : '创建用户' 
				},
				{
					field : 'lastUpdated', 
					title : '更新时间'
				},
				{
					field : 'lastUpdatedBy', 
					title : '更新用户' 
				},
                    {
                        field : 'userDef2',
                        title : '是否导入'
                    },
				{
					field : 'enable', 
					title : '是否有效'  ,
                    align: 'center',
                    formatter: function(value, row, index) {
                        return $.table.selectDictLabel(datas, value);
                    }
				},
		        {
		            title: '操作',
		            align: 'center',
		            formatter: function(value, row, index) {
		            	var actions = [];
		            	actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="#" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        /*actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="#" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-trash-o"></i>删除</a>');
                    */return actions.join('');
		            }
		        }
		        ]
            };
            $.table.init(options);
        });

        /*导出模板*/
        function materialExportExcel() {
            let url = "material/export";
                $.modal.loading("正在处理,请稍后...");
                var config = {
                    url: url,
                    success: function (result) {
                        $.modal.closeLoading();
                        if (result.code == web_status.SUCCESS) {

                            $.modal.alertSuccess(result.msg);
                            $.table.refresh();
                        } else if (result.code == web_status.FAIL) {
                            layer.close(index);

                            $.modal.alertWarning(result.msg);
                        } else {
                            layer.close(index);

                            $.modal.alertError(result.msg);
                        }
                    }
                };
                $.ajax(config)
            }

        // 判断字符串是否是以end结尾
        function endWith(value, end) {
            var reg = new RegExp(end + "$");
            return reg.test(value)
        }

        // 导入数据
        function importExcel(formId) {
            var currentId = $.common.isEmpty(formId) ? 'importTpl' : formId;
            layer.open({
                type: 1,
                area: ['400px', '230px'],
                fix: false,
                //不固定
                maxmin: true,
                shade: 0.3,
                title: '导入' + $.table._option.modalName + '数据',
                content: $('#' + currentId).html(),
                btn: ['<i class="fa fa-check"></i> 导入', '<i class="fa fa-remove"></i> 取消'],
                // 弹层外区域关闭
                shadeClose: true,
                btn1: function(index, layero){
                    var file = layero.find('#file').val();
                    if (file == '' || (!endWith(file, '.xlsx'))){
                        $.modal.msgWarning("请选择后缀为“xlsx”的文件。");
                        return false;
                    }
                    $.modal.closeLoading();
                    var index = layer.load(2, {time: 10*1000});
                    //$.modal.closeLoading;
                    var formData = new FormData();
                    formData.append("file", $('#file')[0].files[0]);
                    formData.append("updateSupport", $("input[name='updateSupport']").is(':checked'));
                    $.ajax({
                        url: prefix + "/importData",
                        data: formData,
                        cache: false,
                        contentType: false,
                        processData: false,
                        type: 'POST',
                        success: function (result) {
                            if (result.code == web_status.SUCCESS) {
                                layer.closeAll('loading');
                                $.modal.alertSuccess(result.msg);
                                $.table.refresh();
                            } else if (result.code == web_status.FAIL) {
                                layer.close(index);
                                // $.modal.enable();
                                $.modal.alertWarning(result.msg)
                            } else {
                                layer.close(index);
                                // $.modal.enable();
                                $.modal.alertError(result.msg);
                            }
                        },

                    });
                }
            });
        }


    </script>

    <!-- 导入区域 -->
    <script id="importTpl" type="text/template">
        <form enctype="multipart/form-data" class="mt20 mb10">
            <div class="col-xs-offset-1">
                <input type="file" id="file" name="file"/>
                <!--<div class="mt10 pt5">
                    <a onclick="$.table.importTemplate()" class="btn btn-default btn-xs"><i class="fa fa-file-excel-o"></i> 下载模板</a>
                </div>-->
                <font color="red" class="pull-left mt10">
                    提示:仅允许导入后缀为“xlsx”格式表单文件!
                </font>
            </div>
        </form>
    </script>

</body>
</html>