|
|
@@ -0,0 +1,266 @@
|
|
|
+<%@ page language="java" contentType="text/html; charset=UTF-8"
|
|
|
+ pageEncoding="UTF-8" %>
|
|
|
+<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <title>产品知识列表</title>
|
|
|
+ <%@include file="/views/common.jsp" %>
|
|
|
+ <style type="text/css">
|
|
|
+ .layui-table-cell {
|
|
|
+ height: 32px;
|
|
|
+ line-height: 32px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-table td, .layui-table th, .layui-table-header, .layui-table-page, .layui-table-tool, .layui-table-total, .layui-table-view {
|
|
|
+ border-color: #6666;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ztree * {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .edge .layui-edge {
|
|
|
+ right: 35px;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+
|
|
|
+<script type="text/html" id="toolbarDemo">
|
|
|
+ <div class="layui-btn-container demoTable">
|
|
|
+ <button class="layui-btn layui-btn-sm" lay-event="add">
|
|
|
+ <i class="layui-icon layui-icon-add-circle-fine" style="font-size:20px;font-weight:bold"> </i> 新增内容
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+</script>
|
|
|
+<script type="text/html" id="barDemo">
|
|
|
+ <a class="layui-btn layui-btn-xs" lay-event="edit">
|
|
|
+ <i class="layui-icon layui-icon-edit" style="color:white;font-size:20px"></i>编辑
|
|
|
+ </a>
|
|
|
+ <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">
|
|
|
+ <i class="layui-icon layui-icon-delete"></i>删除
|
|
|
+ </a>
|
|
|
+</script>
|
|
|
+<body>
|
|
|
+<br>
|
|
|
+<form class="layui-form" action="">
|
|
|
+ <div class="layui-inline">
|
|
|
+ <label class="layui-form-label">内容</label>
|
|
|
+ <div class="layui-input-inline">
|
|
|
+ <input type="text" id="content" name="content" placeholder="请输入内容"
|
|
|
+ autocomplete="off" class="layui-input">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="layui-inline">
|
|
|
+ <div class="layui-input-inline">
|
|
|
+ <button class="layui-btn" id="searchBtn" lay-submit lay-filter="formDemo" style="margin-left: 15px">
|
|
|
+ <i class="layui-icon layui-icon-search"></i> 查询
|
|
|
+ </button>
|
|
|
+ <button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</form>
|
|
|
+<table class="layui-hide" id="informationTable" lay-filter="informationTable" lay-size="lg"></table>
|
|
|
+<style>
|
|
|
+ .layui-table-body .layui-table tr {
|
|
|
+ height: 80px;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<script type="text/javascript">
|
|
|
+ function viewImage(item) {
|
|
|
+ let html = "<div style='width: 100%;height: 100%;display: flex;align-items: center;justify-content: center'>";
|
|
|
+ if (item != "" && (item.indexOf(".mp4") > -1 || item.indexOf(".MP4") > -1)) {
|
|
|
+ html += "<video src='" + item + "' class='layui-upload-img' controls style='width: 400px;height: 400px;margin-right: 5px;'/>";
|
|
|
+ } else if (item != "") {
|
|
|
+ html += "<img src='" + item + "' class='layui-upload-img' style='width: 400px;height: 400px;margin-right: 5px;'/>";
|
|
|
+ }
|
|
|
+ html += "</div>";
|
|
|
+ layer.open({
|
|
|
+ type: 1,
|
|
|
+ title: false,
|
|
|
+ closeBtn: 0,
|
|
|
+ offset: 'auto',
|
|
|
+ area: ['400px', '400px'],
|
|
|
+ skin: 'layui-layer-nobg', //没有背景色
|
|
|
+ shadeClose: true,
|
|
|
+ content: html
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ layui.use(['element', 'table', 'laydate', 'form'], function () {
|
|
|
+ var $ = layui.jquery;
|
|
|
+ var table = layui.table;
|
|
|
+ var laydate = layui.laydate;
|
|
|
+ var element = layui.element;
|
|
|
+ var form = layui.form;
|
|
|
+
|
|
|
+ // 生成表格
|
|
|
+ table.render({
|
|
|
+ elem: '#informationTable',
|
|
|
+ url: '../../../../getInformations',
|
|
|
+ toolbar: '#toolbarDemo',
|
|
|
+ title: '用户表',// 导出文件名
|
|
|
+ id: 'informationTableAll',
|
|
|
+ // 开启分页
|
|
|
+ // page : true,
|
|
|
+ page: {
|
|
|
+ layout: ['count', 'prev', 'page', 'next', 'skip', 'limit']
|
|
|
+ },
|
|
|
+ lineStyle: 'height: 81px;', // 定义表格的多行样式
|
|
|
+ limits: [10, 30, 50, 80, 100, 999],
|
|
|
+ /*request : {
|
|
|
+ 'limitName' : 'pageSize' // 分页每页条数默认字段改为pageSize
|
|
|
+ },*/
|
|
|
+ where: {
|
|
|
+ type: '2', content: ''
|
|
|
+ },
|
|
|
+ cellMinWidth: 80, // 全局定义常规单元格的最小宽度，layui 2.2.1 新增
|
|
|
+ cols: [[{
|
|
|
+ type: 'numbers',
|
|
|
+ title: '序号',
|
|
|
+ width: 50,
|
|
|
+ fixed: "left"
|
|
|
+ }, {
|
|
|
+ field: 'content',
|
|
|
+ title: '属性',
|
|
|
+
|
|
|
+ }, {
|
|
|
+ field: 'content',
|
|
|
+ title: '图片视频',
|
|
|
+ templet: function (d) {
|
|
|
+ let html = "<div style='width: 100%;height: 100%;display: flex;align-items: center;justify-content: center'>";
|
|
|
+ if (d.attachment) {
|
|
|
+ let list = d.attachment.split(",");
|
|
|
+ for (let i = 0; i < list.length; i++) {
|
|
|
+ let item = list[i];
|
|
|
+ if (item != "" && (item.indexOf(".mp4") > -1 || item.indexOf(".MP4") > -1)) {
|
|
|
+ html += "<video src='" + item + "' class='layui-upload-img' style='width: 40px;height: 40px;margin-right: 5px;' onclick='viewImage(\"" + item + "\")'/>";
|
|
|
+ } else if (item != "") {
|
|
|
+ html += "<img src='" + item + "' class='layui-upload-img' style='width: 40px;height: 40px;margin-right: 5px;' onclick='viewImage(\"" + item + "\")'/>";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ html += "</div>";
|
|
|
+ return html;
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ field: 'createBy',
|
|
|
+ align: 'center',
|
|
|
+ width: 150,
|
|
|
+ title: '创建人'
|
|
|
+ }, {
|
|
|
+ field: 'createDate',
|
|
|
+ title: '创建时间',
|
|
|
+ width: 220,
|
|
|
+ align: 'center',
|
|
|
+ templet: function (d) {
|
|
|
+ return d.createDate != null ? layui.util.toDateString(d.createDate, "yyyy-MM-dd HH:mm:ss") : "";
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ fixed: 'right',
|
|
|
+ title: '操作',
|
|
|
+ align: 'center',
|
|
|
+ width: 150,
|
|
|
+ toolbar: '#barDemo'
|
|
|
+ }]],
|
|
|
+ parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
|
|
|
+ return {
|
|
|
+ "code": 0, //解析接口状态
|
|
|
+ "msg": "", //解析提示文本
|
|
|
+ "count": res.data.list.total,//解析数据长度
|
|
|
+ "data": res.data.list.list//解析数据列表
|
|
|
+ };
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ //点击查询按钮，重载表格
|
|
|
+ $('#searchBtn').on('click', function () {
|
|
|
+ table.reload('informationTableAll', {
|
|
|
+ method: 'get',
|
|
|
+ where: {
|
|
|
+ content: $("#content").val()
|
|
|
+ },
|
|
|
+ page: {
|
|
|
+ curr: 1
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ table.on('toolbar(informationTable)', function (obj) {
|
|
|
+ switch (obj.event) {
|
|
|
+ case 'add':
|
|
|
+ layer.open({
|
|
|
+ type: 2,
|
|
|
+ title: "添加规范",
|
|
|
+ fix: false, //不固定
|
|
|
+ maxmin: true,
|
|
|
+ skin: 'layui-layer-molv',
|
|
|
+ area: ['45%', '70%'],
|
|
|
+ content: './addQuality.jsp',
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ ;
|
|
|
+ });
|
|
|
+
|
|
|
+ table.on('tool(informationTable)', function (obj) {
|
|
|
+ var data1 = obj.data;
|
|
|
+ if (obj.event === 'edit') {
|
|
|
+ layer.open({
|
|
|
+ type: 2,
|
|
|
+ title: "修改规范",
|
|
|
+ area: ['45%', '70%'],
|
|
|
+ skin: 'layui-layer-molv',
|
|
|
+ content: './addQuality.jsp',
|
|
|
+ success: function (layero, index) {
|
|
|
+ var body = layer.getChildFrame('body', index);
|
|
|
+ body.find('#id').val(data1.id);
|
|
|
+ body.find('input[name="type"]').val(data1.type);
|
|
|
+ body.find('textarea[name="content"]').val(data1.content);
|
|
|
+
|
|
|
+ body.find('#images').val(data1.attachment);
|
|
|
+ let textImage = data1.attachment;
|
|
|
+ if (textImage) {
|
|
|
+ let textImageList = textImage == "" ? [] : textImage.split(",");
|
|
|
+ let html = "";
|
|
|
+ textImageList.forEach((item, index) => {
|
|
|
+ if (item != "" && (item.indexOf(".mp4") > -1 || item.indexOf(".MP4") > -1)) {
|
|
|
+ html += "<video src='" + item + "' class='layui-upload-img' style='width: 50px;height: 50px;margin-right: 5px;' onclick='delImage(\"" + index + "\")'/>";
|
|
|
+ } else if (item != "") {
|
|
|
+ html += "<img src='" + item + "' class='layui-upload-img' style='width: 50px;height: 50px;margin-right: 5px;' onclick='delImage(\"" + index + "\")'/>";
|
|
|
+ }
|
|
|
+ })
|
|
|
+ body.find("#preview").empty().append(html);
|
|
|
+ }
|
|
|
+ layui.form.render();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else if (obj.event === 'del') {
|
|
|
+ layer.confirm('确定要删除该数据么？', {icon: 3, title: "提示"}, function (index) {
|
|
|
+ $.ajax({
|
|
|
+ url: "../../../../deleteTipContent",
|
|
|
+ data: {'id': data1.id},
|
|
|
+ type: "post",
|
|
|
+ //dataType:"json",
|
|
|
+ success: function (data) {
|
|
|
+ if (data.code == 200) {
|
|
|
+ layer.msg('删除成功！', {icon: 6, offset: "auto", time: 1000});//提示框
|
|
|
+ } else {
|
|
|
+ layer.msg('删除失败！', {icon: 5, offset: "auto", time: 1000});//提示框
|
|
|
+ }
|
|
|
+ setTimeout(function () {
|
|
|
+ location.reload();//重新加载页面
|
|
|
+ }, 1100);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
zhuyiyi