tiansf
/
SchoolPhysicalExamination
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
SchoolPhysicalExamination/application/admin/view/editortext/edit_content.html

472 lines
24 KiB
HTML
Raw Normal View History

最新版2024-11-23
2024-11-23 16:46:38 +08:00
<!DOCTYPE html>
<html class="x-admin-sm">
<head>
<meta charset="UTF-8">
<title>设备管理_add</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="stylesheet" href="/x_admin/css/font.css">
<link rel="stylesheet" href="/x_admin/css/xadmin.css">
<script type="text/javascript" src="/x_admin/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/x_admin/js/xadmin.js"></script>
<script type="text/javascript" src="/x_admin/js/jq.js"></script>
<link href="/rich_text_editor/style.css" rel="stylesheet">
<script src="/rich_text_editor/index.js"></script>
<style>
#editor—wrapper {
border: 1px solid #ccc;
z-index: 100; /* 按需定义 */
}
#toolbar-container { border-bottom: 1px solid #ccc; }
#editor-container { height: 500px; }
</style>
</head>
<body>
<div class="layui-fluid">
<div class="layui-row" id="app_all">
<form action="" method="post" class="layui-form layui-form-pane">
<div class="layui-form-item">
<label for="title_v" class="layui-form-label">
<span class="x-red"></span>标题描述
</label>
<div class="layui-input-inline">
<input type="text" id="title_v" name="title_v" required="" lay-verify="title_v" autocomplete="off" class="layui-input" value="{$result.title}">
</div>
</div>
<div class="layui-form-item">
<label for="title_v" class="layui-form-label">
<span class="x-red"></span>上传封面
</label>
<div class="layui-input-inline">
重装前推送
2024-12-18 09:19:51 +08:00
<div class="layui-btn" onclick="xadmin.open('图片管理','/admin/pic','80%','80%')">点击选择</div>
最新版2024-11-23
2024-11-23 16:46:38 +08:00
</div>
</div>
<div class="layui-form-item">
<label for="title_v" class="layui-form-label">
<span class="x-red"></span>预览
</label>
<div class="layui-input-inline">
重装前推送
2024-12-18 09:19:51 +08:00
<img id="preview_img" style="max-width:500px;box-shadow: 0px 0px 1px;" src="http://tc.pcxbc.com/{$result.cover_image}" alt="">
<input type="hidden" name="banner_img" id="banner_img" lay-verify="banner_img" value=""></input>
最新版2024-11-23
2024-11-23 16:46:38 +08:00
</div>
</div>
<div class="layui-form-item layui-form-text" style="max-width: 440px;">
<label class="layui-form-label">
发布板块
</label>
<table class="layui-table layui-input-block">
<tbody>
<tr>
<td>
{if condition="strpos($result.sector, '1') !== false && strpos($result.sector, '2') !== false && strpos($result.sector, '3') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="" title="全选" lay-filter="sector_all">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="" title="全选" lay-filter="sector_all">
{/if}
</td>
<td>
<div class="layui-input-block">
{if condition="strpos($result.sector, '1') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="1" title="推荐" lay-filter="sector_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="1" title="推荐" lay-filter="sector_child">
{/if}
{if condition="strpos($result.sector, '2') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="2" title="公告" lay-filter="sector_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="公告" lay-filter="sector_child">
{/if}
{if condition="strpos($result.sector, '3') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="3" title="圈" lay-filter="sector_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="3" title="圈" lay-filter="sector_child">
{/if}
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="layui-form-item layui-form-text" style="max-width: 440px;">
<label class="layui-form-label">
发布类型
</label>
<table class="layui-table layui-input-block">
<tbody>
<tr>
<td>
{if condition="strpos($result.type, '1') !== false && strpos($result.type, '2') !== false && strpos($result.type, '3') !== false && strpos($result.type, '4') !== false && strpos($result.type, '5') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="" title="全选" lay-filter="type_all">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="" title="全选" lay-filter="type_all">
{/if}
</td>
<td>
<div class="layui-input-block">
{if condition="strpos($result.type, '1') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="1" title="身高管理" lay-filter="type_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="1" title="身高管理" lay-filter="type_child">
{/if}
{if condition="strpos($result.type, '2') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="2" title="体重管理" lay-filter="type_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="体重管理" lay-filter="type_child">
{/if}
{if condition="strpos($result.type, '3') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="3" title="肺活训练" lay-filter="type_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="3" title="肺活训练" lay-filter="type_child">
{/if}
{if condition="strpos($result.type, '4') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="4" title="跳绳训练" lay-filter="type_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="4" title="跳绳训练" lay-filter="type_child">
{/if}
{if condition="strpos($result.type, '5') !== false"}
<input name="id[]" lay-skin="primary" type="checkbox" checked value="5" title="中考体测" lay-filter="type_child">
{else /}
<input name="id[]" lay-skin="primary" type="checkbox" value="5" title="中考体测" lay-filter="type_child">
{/if}
</div>
</td>
</tr>
</tbody>
</table>
</div>
250723提交
2025-07-23 21:32:05 +08:00
<div class="layui-form-item">
<label for="scene_data" class="layui-form-label">
<span class="x-red">☆</span>选择场景
</label>
<div class="layui-input-inline" style="width: 80%;">
<select id="scene_data" name="scene_data" lay-filter="scene_data" lay-verify="scene_data">
{if condition="$result.scene_id == 0"}
<option value="0" selected>请选择使用场景</option>
<option value="1">图文编辑</option>
<option value="2">微信公众号文章链接</option>
{elseif condition="$result.scene_id == 1"/}
<option value="0">请选择使用场景</option>
<option value="1" selected>图文编辑</option>
<option value="2">微信公众号文章链接</option>
{elseif condition="$result.scene_id == 2"/}
<option value="0">请选择使用场景</option>
<option value="1">图文编辑</option>
<option value="2" selected>微信公众号文章链接</option>
{else /}
{/if}
</select>
</div>
</div>
<div class="layui-form-item" id="parameter_data_box">
<label for="parameter_data" class="layui-form-label">
<span class="x-red">☆</span>填写链接
</label>
<div class="layui-input-inline" style="width: 80%;">
<input type="text" id="parameter_data" name="parameter_data" lay-verify="parameter_data" autocomplete="off" class="layui-input" placeholder="请填写公众号文章链接">
</div>
</div>
<div class="layui-form-item layui-form-text" style="max-width: 90%;" id="editor_wrapper_box">
最新版2024-11-23
2024-11-23 16:46:38 +08:00
<label for="desc" class="layui-form-label">
内容编辑
</label>
<div id="editor—wrapper">
<div id="toolbar-container"><!-- 工具栏 --></div>
<div id="editor-container"><!-- 编辑器 --></div>
</div>
</div>
<div class="layui-form-item">
<!-- <label for="L_repass" class="layui-form-label"></label> -->
<!-- <div class="layui-btn" id="add" lay-filter="add" lay-submit="">增加</div>
<input value="登录" lay-submit lay-filter="add" type="submit" class="layui-btn"> -->
<button class="layui-btn" lay-filter="add" lay-submit="">修改</button>
</div>
</form>
</div>
</div>
重装前推送
2024-12-18 09:19:51 +08:00
最新版2024-11-23
2024-11-23 16:46:38 +08:00
<script>
重装前推送
2024-12-18 09:19:51 +08:00
function receiveParamFromIframe(param) {
pic_data = param
if(pic_data.length > 0){
var img = document.getElementById('preview_img');
img.src = pic_data[1]; // 设置图片预览的src属性
img.style.display = 'block'; // 显示图片预览
$('#banner_img').val(pic_data[0])
}
}
250723提交
2025-07-23 21:32:05 +08:00
最新版2024-11-23
2024-11-23 16:46:38 +08:00
var content_str = '{$result.content}';
250723提交
2025-07-23 21:32:05 +08:00
$('#parameter_data').val(content_str)
最新版2024-11-23
2024-11-23 16:46:38 +08:00
// var content_str = '';
var html
const { createEditor, createToolbar } = window.wangEditor
const editorConfig = {
placeholder: 'Type here...',
onChange(editor) {
html = editor.getHtml()
html = html.replace(/\r?\n|\r/g, '');
// console.log('editor content', html)
// 也可以同步到 <textarea>
},
MENU_CONF: {}
}
editorConfig.MENU_CONF['uploadImage'] = {
server: '/editortext/upload_pic_action',
maxNumberOfFiles: 1,
maxFileSize: 10 * 1024 * 1024, // 10M
onError(file, err, res) {
// console.log(`${file.name} 上传出错`, err, res)
// console.log(file)
// console.log(err.message)
alert(err.message)
},
}
editorConfig.MENU_CONF['uploadVideo'] = {
server: '/editortext/upload_video_action',
maxFileSize: 100 * 1024 * 1024, // 100M
maxNumberOfFiles: 1,
onError(file, err, res) {
// console.log(`${file.name} 上传出错`, err, res)
// console.log(file)
// console.log(err.message)
alert(err.message)
},
}
const editor = createEditor({
selector: '#editor-container',
html: '<p><br></p>',
config: editorConfig,
mode: 'default', // or 'simple'
})
const toolbarConfig = {}
const toolbar = createToolbar({
editor,
selector: '#toolbar-container',
config: toolbarConfig,
mode: 'default', // or 'simple'
})
editor.setHtml(content_str)
</script>
<script>
var form
var id = '{$result.id}'
var sector_arr = '{$result.sector}'.split(",")
var type_arr = '{$result.type}'.split(",")
250723提交
2025-07-23 21:32:05 +08:00
// console.log(sector_arr)
console.log($('#scene_data').val())
最新版2024-11-23
2024-11-23 16:46:38 +08:00
var pd = true
250723提交
2025-07-23 21:32:05 +08:00
if($('#scene_data').val() == 0){
$('#parameter_data_box').hide();
$('#editor_wrapper_box').hide();
}else if($('#scene_data').val() == 1){
$('#parameter_data_box').hide();
$('#editor_wrapper_box').show();
}else if($('#scene_data').val() == 2){
$('#parameter_data_box').show();
$('#editor_wrapper_box').hide();
}
最新版2024-11-23
2024-11-23 16:46:38 +08:00
layui.use(['form'], function () {
form = layui.form;
form.verify({
title_v: function(value) {
if (value == '') {
return '请先选择添加标题';
}
},
250723提交
2025-07-23 21:32:05 +08:00
scene_data: function(value) {
if (value == 0) {
return '请选择场景';
}
},
最新版2024-11-23
2024-11-23 16:46:38 +08:00
});
250723提交
2025-07-23 21:32:05 +08:00
最新版2024-11-23
2024-11-23 16:46:38 +08:00
//监听提交
form.on('submit(add)',function(data) {
//发异步，把数据提交给php
// console.log(html);
// console.log(sector_arr);
add_data()
return false;
});
form.on('checkbox(sector_all)', function(data){
if(data.elem.checked){
$(data.elem).parent().siblings('td').find('input').prop("checked", true);
form.render();
sector_arr = ['1','2','3','4','5'];
}else{
$(data.elem).parent().siblings('td').find('input').prop("checked", false);
form.render();
sector_arr = [];
}
console.log(sector_arr)
});
form.on('checkbox(sector_child)', function(data){
if(data.elem.checked){
$(data.elem).parent().siblings('td').find('input').prop("checked", true);
form.render();
sector_arr.push($(data.elem).val());
}else{
$(data.elem).parent().siblings('td').find('input').prop("checked", false);
form.render();
if (sector_arr.includes($(data.elem).val())) {
// 如果包含，则删除第一个匹配的元素
let index = sector_arr.indexOf($(data.elem).val());
if (index !== -1) {
sector_arr.splice(index, 1);
}
}
}
console.log(sector_arr)
});
form.on('checkbox(type_all)', function(data){
if(data.elem.checked){
$(data.elem).parent().siblings('td').find('input').prop("checked", true);
form.render();
type_arr = ['1','2','3','4','5'];
}else{
$(data.elem).parent().siblings('td').find('input').prop("checked", false);
form.render();
type_arr = [];
}
console.log(type_arr)
});
form.on('checkbox(type_child)', function(data){
if(data.elem.checked){
$(data.elem).parent().siblings('td').find('input').prop("checked", true);
form.render();
type_arr.push($(data.elem).val());
}else{
$(data.elem).parent().siblings('td').find('input').prop("checked", false);
form.render();
if (type_arr.includes($(data.elem).val())) {
// 如果包含，则删除第一个匹配的元素
let index = type_arr.indexOf($(data.elem).val());
if (index !== -1) {
type_arr.splice(index, 1);
}
}
}
console.log(type_arr)
});
250723提交
2025-07-23 21:32:05 +08:00
form.on('select(scene_data)', function(data){
var value = data.value;
// 根据选择的值显示/隐藏对应的元素
if(value === '1') {
$('#editor_wrapper_box').show();
$('#parameter_data_box').hide();
} else if(value === '2') {
$('#parameter_data_box').show();
$('#editor_wrapper_box').hide();
} else {
// 值为0或其他时，两个都隐藏
$('#parameter_data_box').hide();
$('#editor_wrapper_box').hide();
}
});
最新版2024-11-23
2024-11-23 16:46:38 +08:00
});
// 功能性~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function add_data(){
if(pd === false){
return
}
html = html.replace(/['"]/g, '\\$&');
重装前推送
2024-12-18 09:19:51 +08:00
var data = {
'cover_image':$('#banner_img').val(),
'id':id,
'title':$('#title_v').val(),
'sector':sector_arr,
'type':type_arr,
'content':html,
250723提交
2025-07-23 21:32:05 +08:00
'scene_id':$('#scene_data').val(),
}
if($('#scene_data').val() == 2){
data.content = $('#parameter_data').val();
}else if($('#scene_data').val() == 0){
return
重装前推送
2024-12-18 09:19:51 +08:00
}
// var formdata = new FormData();
// formdata.append('cover_image',$('#upload_file_app')[0].files[0])
// formdata.append('id',id)
// formdata.append('title',$("#title_v").val())
// formdata.append('sector',sector_arr)
// formdata.append('type',type_arr)
// formdata.append('content',html)
// console.log(formdata)
最新版2024-11-23
2024-11-23 16:46:38 +08:00
load()
pd = false
$.ajax({
url:"/editortext/edit_content_action", //请求的url地址
重装前推送
2024-12-18 09:19:51 +08:00
dataType: "json", //返回格式为json
async: true,//请求是否异步，默认为异步，这也是ajax重要特性
data: data, //参数值
type: "POST", //请求方式
最新版2024-11-23
2024-11-23 16:46:38 +08:00
success:function(req){
c_load()
pd = true
console.log()
if(req.code == 0){
layer.alert("修改成功", {icon: 6},function() {
//关闭当前frame
xadmin.close();
// 可以对父窗口进行刷新
xadmin.father_reload();
});
}else{
layer.alert("修改失败"+req.msg, {icon: 6},function() {
//关闭当前frame
xadmin.close();
// 可以对父窗口进行刷新
xadmin.father_reload();
});
}
//请求成功时处理
console.log(req)
},
error:function(){
//请求出错处理
pd = true
}
});
}
//加载提示开启
function load() {
var index = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
}
// 关闭加载提示
function c_load() {
layer.close(layer.index)
}
</script>
</body>
</html>