|
|
@@ -0,0 +1,470 @@
|
|
|
+let form, table, uploadInst;
|
|
|
+let ACCEPT = 'images';
|
|
|
+layui.config({
|
|
|
+ base: 'js/encryption/'
|
|
|
+}).use(['layer', 'form', 'jquery', 'table', 'upload', 'ajax'], function () {
|
|
|
+ layer = layui.layer;
|
|
|
+ upload = layui.upload;
|
|
|
+ table = layui.table;
|
|
|
+ form = layui.form;
|
|
|
+ $ = layui.jquery;
|
|
|
+ ly = layui.ajax;
|
|
|
+
|
|
|
+ // 主要表格
|
|
|
+ table.render({
|
|
|
+ elem: '#explainTable',
|
|
|
+ url: PAGE_BASIC + '/api/smart/explain/list',
|
|
|
+ toolbar: '#explainTable_toolbar', //开启头部工具栏，并为其绑定左侧模板
|
|
|
+ page: true,
|
|
|
+ cols: [
|
|
|
+ [{
|
|
|
+ type: 'numbers',
|
|
|
+ title: '序号'
|
|
|
+ }, {
|
|
|
+ field: 'explainName',
|
|
|
+ title: '讲解名称',
|
|
|
+ }, {
|
|
|
+ field: 'explainType',
|
|
|
+ title: '讲解类型',
|
|
|
+ templet: function (d) {
|
|
|
+ if (d.explainType == 10) {
|
|
|
+ return '视频讲解';
|
|
|
+ } else {
|
|
|
+ return '图片讲解';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ field: 'status',
|
|
|
+ title: '状态',
|
|
|
+ templet: function (d) {
|
|
|
+ if (d.status == 10) {
|
|
|
+ return '已启用';
|
|
|
+ } else {
|
|
|
+ return '已停用';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ field: 'createTime',
|
|
|
+ title: '创建时间'
|
|
|
+ }, {
|
|
|
+ fixed: 'right',
|
|
|
+ title: '操作',
|
|
|
+ toolbar: '#explainTable_bar',
|
|
|
+ width: 250
|
|
|
+ }]
|
|
|
+ ]
|
|
|
+ });
|
|
|
+
|
|
|
+ //头工具栏事件(主要表格)
|
|
|
+ table.on('toolbar(explainTable)', function (obj) {
|
|
|
+ // var checkStatus = table.checkStatus(obj.config.id);
|
|
|
+ switch (obj.event) {
|
|
|
+ case 'add': //新增
|
|
|
+ $(".main").addClass("layui-hide").removeClass("layui-show");
|
|
|
+ $(".add").addClass("layui-show").removeClass("layui-hide");
|
|
|
+ $('#submit').attr('submitType', 'insert');
|
|
|
+ $(".add .header_title span").html("新增");
|
|
|
+ $('#explainInfo')[0].reset();
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ //监听行工具事件(主要表格)
|
|
|
+ table.on('tool(explainTable)', function (obj) {
|
|
|
+ let data = obj.data;
|
|
|
+ //console.log(obj)
|
|
|
+ if (obj.event === 'del') {
|
|
|
+ layer.confirm('是否确认删除', function (index) {
|
|
|
+ deleteExplain(data.id);
|
|
|
+ layer.close(index);
|
|
|
+ });
|
|
|
+ } else if (obj.event === 'edit') {
|
|
|
+ $(".main").addClass("layui-hide").removeClass("layui-show");
|
|
|
+ $(".add").addClass("layui-show").removeClass("layui-hide");
|
|
|
+ $(".add .header_title span").html("编辑");
|
|
|
+ $('#submit').attr('submitType', 'update');
|
|
|
+ $('#explainInfo')[0].reset();
|
|
|
+ // 数据初始化
|
|
|
+ echoExplainInfo(data.id);
|
|
|
+ } else if (obj.event === 'disable') {
|
|
|
+ updateStatus(data.id, 20);
|
|
|
+ } else if (obj.event === 'enable') {
|
|
|
+ updateStatus(data.id, 10);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ form.on('select(explainType)', function (data) {
|
|
|
+ console.log(data.value); //得到被选中的值
|
|
|
+ if (data.value) {
|
|
|
+ $('.operation').removeClass('layui-hide');
|
|
|
+ $('#list').removeClass('layui-hide');
|
|
|
+ if (data.value == 20) {
|
|
|
+ ACCEPT = 'images';
|
|
|
+ uploadInst.reload({
|
|
|
+ accept: ACCEPT, //只允许上传图片
|
|
|
+ acceptMime: 'image/*', //只筛选图片
|
|
|
+ data: {
|
|
|
+ 'prefix': ACCEPT
|
|
|
+ },
|
|
|
+ });
|
|
|
+ $('#additionBtn').removeClass('layui-hide');
|
|
|
+ } else {
|
|
|
+ ACCEPT = 'video';
|
|
|
+ uploadInst.reload({
|
|
|
+ accept: ACCEPT, //只允许上传图片
|
|
|
+ acceptMime: 'video/*', //只筛选图片
|
|
|
+ data: {
|
|
|
+ 'prefix': ACCEPT
|
|
|
+ },
|
|
|
+ });
|
|
|
+ $('#additionBtn').addClass('layui-hide');
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ ACCEPT = 'images';
|
|
|
+ uploadInst.reload({
|
|
|
+ accept: ACCEPT, //只允许上传图片
|
|
|
+ acceptMime: 'image/*', //只筛选图片
|
|
|
+ data: {
|
|
|
+ 'prefix': ACCEPT
|
|
|
+ },
|
|
|
+ });
|
|
|
+ $('#additionBtn').addClass('layui-hide');
|
|
|
+ $('.operation').addClass('layui-hide');
|
|
|
+ $('#list').addClass('layui-hide');
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ uploadInst = upload.render({
|
|
|
+ elem: '#uploadBtn', //绑定元素
|
|
|
+ url: PAGE_BASIC + '/upload/fileUpload',
|
|
|
+ accept: ACCEPT,
|
|
|
+ headers: {
|
|
|
+ 'timestamp': new Date().getTime(),
|
|
|
+ 'Authorization': sessionStorage.TOKEN_TYPE + ' ' + sessionStorage.ACCESS_TOKEN
|
|
|
+ },
|
|
|
+ data: {
|
|
|
+ 'prefix': ACCEPT
|
|
|
+ },
|
|
|
+ before: function (obj) {
|
|
|
+ layer.load(2); //上传loading
|
|
|
+ },
|
|
|
+ done: function (res) {
|
|
|
+ layer.closeAll('loading');
|
|
|
+ //上传完毕回调
|
|
|
+ console.info(res)
|
|
|
+ if (res.data) {
|
|
|
+ let fileUrl = $('#fileUrl').val();
|
|
|
+ if (fileUrl) {
|
|
|
+ fileUrl = fileUrl + ';' + res.data.filePath;
|
|
|
+ } else {
|
|
|
+ fileUrl = res.data.filePath;
|
|
|
+ }
|
|
|
+ $('#fileUrl').val(fileUrl);
|
|
|
+ console.info($('#fileUrl').val())
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (err) {
|
|
|
+ //请求异常回调
|
|
|
+ console.error(err)
|
|
|
+ layer.closeAll('loading');
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 验证表单
|
|
|
+ form.verify({
|
|
|
+ explainName: function (value, item) {
|
|
|
+ if (!value.trim()) {
|
|
|
+ return '讲解名称不能为空';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ explainType: function (value, item) {
|
|
|
+ if (!value.trim()) {
|
|
|
+ return '请选择讲解类型';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fileUrl: function (value, item) {
|
|
|
+ if (!value.trim()) {
|
|
|
+ return '请上传讲解文件';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ content: function (value, item) {
|
|
|
+ if (!value.trim()) {
|
|
|
+ return '请输入语音文本内容';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 监听提交按钮
|
|
|
+ form.on('submit(submit)', function (data) {
|
|
|
+ let submitType = data.elem.getAttribute("submitType");
|
|
|
+ // 新增
|
|
|
+ if (submitType == 'insert') {
|
|
|
+ addExplain();
|
|
|
+ return false;
|
|
|
+ } else if (submitType == 'update') {
|
|
|
+ updateExplain();
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 查询
|
|
|
+ $(".search_btn").click(function () {
|
|
|
+ let queryValue = $.trim($("#queryValue").val());
|
|
|
+ table.reload('explainTable', {
|
|
|
+ where: {
|
|
|
+ "queryVal": queryValue
|
|
|
+ },
|
|
|
+ page: {
|
|
|
+ curr: 1 //重新从第 1 页开始
|
|
|
+ }
|
|
|
+ }); //只重载数据
|
|
|
+ });
|
|
|
+
|
|
|
+ //基础数据搜索回车事件
|
|
|
+ $('#queryValue').bind('keypress', function (event) {
|
|
|
+ if (event.keyCode == "13") {
|
|
|
+ $(".search_btn").click();
|
|
|
+ // let queryValue = $.trim($("#queryValue").val());
|
|
|
+ // table.reload('explainTable', {
|
|
|
+ // where: {
|
|
|
+ // "queryVal": queryValue
|
|
|
+ // },
|
|
|
+ // page: {
|
|
|
+ // curr: 1 //重新从第 1 页开始
|
|
|
+ // }
|
|
|
+ // }); //只重载数据
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 返回
|
|
|
+ $(".back").click(function () {
|
|
|
+ $(".main").addClass("layui-show").removeClass("layui-hide");
|
|
|
+ $(".add").addClass("layui-hide").removeClass("layui-show");
|
|
|
+ });
|
|
|
+
|
|
|
+});
|
|
|
+
|
|
|
+/**
|
|
|
+ * 新增智能讲解
|
|
|
+ */
|
|
|
+function addExplain() {
|
|
|
+ let postData = form.val('explainInfo');
|
|
|
+ let index = layer.load(2);
|
|
|
+ ly.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: PAGE_BASIC + '/api/smart/explain/addBean',
|
|
|
+ dataType: 'json',
|
|
|
+ data: postData,
|
|
|
+ success: function (json) {
|
|
|
+ if (json.result) {
|
|
|
+ layer.msg("新增成功");
|
|
|
+ $(".main").addClass("layui-show").removeClass("layui-hide");
|
|
|
+ $(".add").addClass("layui-hide").removeClass("layui-show");
|
|
|
+ reloadTable();
|
|
|
+ } else {
|
|
|
+ layer.msg("新增失败");
|
|
|
+ }
|
|
|
+ layer.close(index);
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ layer.close(index);
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 编辑智能讲解
|
|
|
+ */
|
|
|
+function updateExplain() {
|
|
|
+ let postData = form.val('explainInfo');
|
|
|
+ let index = layer.load(2);
|
|
|
+ ly.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: PAGE_BASIC + '/api/smart/explain/updateBean',
|
|
|
+ dataType: 'json',
|
|
|
+ data: postData,
|
|
|
+ success: function (json) {
|
|
|
+ if (json.result) {
|
|
|
+ layer.msg("编辑成功");
|
|
|
+ $(".main").addClass("layui-show").removeClass("layui-hide");
|
|
|
+ $(".add").addClass("layui-hide").removeClass("layui-show");
|
|
|
+ reloadTable();
|
|
|
+ } else {
|
|
|
+ layer.msg("编辑失败");
|
|
|
+ }
|
|
|
+ layer.close(index);
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ layer.close(index);
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 回显智能讲解详情
|
|
|
+ * @param id
|
|
|
+ */
|
|
|
+function echoExplainInfo(id) {
|
|
|
+ let index = layer.load(2);
|
|
|
+ ly.ajax({
|
|
|
+ type: 'GET',
|
|
|
+ url: PAGE_BASIC + '/api/smart/explain/find/' + id,
|
|
|
+ dataType: 'json',
|
|
|
+ success: function (json) {
|
|
|
+ if (json.result) {
|
|
|
+ $('#id').val(id);
|
|
|
+ $('#explainName').val(json.data.explainName);
|
|
|
+ $('#explainType').val(json.data.explainType);
|
|
|
+ $('#fileUrl').val(json.data.fileUrl);
|
|
|
+ $('#content').val(json.data.content);
|
|
|
+ $('#list').removeClass('layui-hide');
|
|
|
+ if (json.data.explainType == 10) {
|
|
|
+ ACCEPT = 'video';
|
|
|
+ uploadInst.reload({
|
|
|
+ accept: ACCEPT, //只允许上传图片
|
|
|
+ acceptMime: 'video/*', //只筛选图片
|
|
|
+ data: {
|
|
|
+ 'prefix': ACCEPT
|
|
|
+ },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ ACCEPT = 'images';
|
|
|
+ uploadInst.reload({
|
|
|
+ accept: ACCEPT, //只允许上传图片
|
|
|
+ acceptMime: 'image/*', //只筛选图片
|
|
|
+ data: {
|
|
|
+ 'prefix': ACCEPT
|
|
|
+ },
|
|
|
+ });
|
|
|
+ }
|
|
|
+ form.render();
|
|
|
+ } else {
|
|
|
+ layer.msg("数据获取失败");
|
|
|
+ }
|
|
|
+ layer.close(index);
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ layer.close(index);
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 删除智能讲解
|
|
|
+ * @param id
|
|
|
+ */
|
|
|
+function deleteExplain(id) {
|
|
|
+ let index = layer.load(2);
|
|
|
+ ly.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: PAGE_BASIC + '/api/smart/explain/deleteById',
|
|
|
+ dataType: 'json',
|
|
|
+ data: {
|
|
|
+ "id": id,
|
|
|
+ },
|
|
|
+ success: function (json) {
|
|
|
+ if (json.result) {
|
|
|
+ layer.msg("删除成功");
|
|
|
+ reloadTable();
|
|
|
+ } else {
|
|
|
+ layer.msg("删除失败");
|
|
|
+ }
|
|
|
+ layer.close(index);
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ layer.close(index);
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 重载数据表格
|
|
|
+ */
|
|
|
+function reloadTable() {
|
|
|
+ table.reload('explainTable', {
|
|
|
+ page: {
|
|
|
+ curr: 1 //重新从第 1 页开始
|
|
|
+ }
|
|
|
+ }); //只重载数据
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 插入语言间隔时间
|
|
|
+ */
|
|
|
+function insertTime() {
|
|
|
+ let timestamp = $.trim($('#timestamp').val());
|
|
|
+ if (!timestamp) {
|
|
|
+ layer.msg('请输入语音时间间隔', {icon: 5});
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (timestamp < 100 || timestamp > 600000) {
|
|
|
+ layer.msg('语音时间间隔，最小100毫秒，最大10分钟', {icon: 5});
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ let tc = document.getElementById("content");
|
|
|
+ let tclen = tc.value.length;
|
|
|
+ tc.focus();
|
|
|
+ // 兼容性检查
|
|
|
+ if (typeof document.selection != "undefined") {
|
|
|
+ // document.selection.createRange().text = timestamp;
|
|
|
+ } else {
|
|
|
+ tc.value =
|
|
|
+ // 获取光标的开始位置
|
|
|
+ tc.value.substr(0, tc.selectionStart) + `[p` + (timestamp).toString() + `]` + tc.value.substring(tc.selectionStart, tclen);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 变更启用状态
|
|
|
+ * @param id
|
|
|
+ * @param status
|
|
|
+ */
|
|
|
+function updateStatus(id, status) {
|
|
|
+ let index = layer.load(2);
|
|
|
+ ly.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: PAGE_BASIC + '/api/smart/explain/updateStatus',
|
|
|
+ dataType: 'json',
|
|
|
+ data: {
|
|
|
+ 'id': id,
|
|
|
+ 'status': status
|
|
|
+ },
|
|
|
+ success: function (json) {
|
|
|
+ if (json.result) {
|
|
|
+ layer.msg("变更成功");
|
|
|
+ reloadTable();
|
|
|
+ } else {
|
|
|
+ layer.msg("变更失败");
|
|
|
+ }
|
|
|
+ layer.close(index);
|
|
|
+ },
|
|
|
+ error: function (msg) {
|
|
|
+ layer.close(index);
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 添加更多语音内容
|
|
|
+ */
|
|
|
+function addItem() {
|
|
|
+ let count = $('.content').length;
|
|
|
+ let html = `<div class="layui-form-item">
|
|
|
+ <label class="layui-form-label"><span class="font-red">*</span>语音内容` + (++count) + `：</label>
|
|
|
+ <div class="layui-input-inline" style="display: flex">
|
|
|
+ <textarea class="layui-textarea content" lay-verify="content" placeholder="请输入语音内容" autocomplete="off"></textarea>
|
|
|
+ <button type="button" class="layui-btn" style="margin-left: 20px;" onclick="removeItem(this)">
|
|
|
+ <i class="layui-icon"></i>移除
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </div>`;
|
|
|
+ $('#list').append(html);
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 移除当前语音内容
|
|
|
+ * @param obj
|
|
|
+ */
|
|
|
+function removeItem(obj) {
|
|
|
+ $(obj).parent().parent().remove();
|
|
|
+}
|
xyg