590 lines
27 KiB
Plaintext
590 lines
27 KiB
Plaintext
@using CRM.Core.Model.Entity
|
||
@using Core.Web.WebHelper
|
||
@{
|
||
ViewBag.Title = "Index";
|
||
Layout = "~/Views/Shared/_Layout.cshtml";
|
||
}
|
||
<style>
|
||
.layui-form-label {
|
||
width: 150px
|
||
}
|
||
.layui-input-block {
|
||
margin-left: 0;
|
||
}
|
||
.layui-laydate-content > .layui-laydate-list {
|
||
padding-bottom: 0px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.layui-laydate-content > .layui-laydate-list > li {
|
||
width: 50%
|
||
}
|
||
|
||
.merge-box .scrollbox .merge-list {
|
||
padding-bottom: 5px;
|
||
}
|
||
</style>
|
||
|
||
<div class="x-body">
|
||
<form class="layui-form" action="" lay-filter="formTest">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span style="color: red">*</span>会议名称:</label>
|
||
<div class="layui-input-inline">
|
||
<input type="text" name="MeetingName" id="MeetingName" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input" style="width:300px;">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span style="color: red">*</span>会议类型:</label>
|
||
<div class="layui-input-inline">
|
||
<select name="MeetingType" id="MeetingType" lay-verify="required" lay-filter="select_meetingType">
|
||
<option value="1">线上会议</option>
|
||
<option value="2">线下会议</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span style="color: red">*</span>参训事业部 (可多选):</label>
|
||
<div class="layui-input-inline">
|
||
<div id="selectChannel" style="width: 400px"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span style="color: red">*</span>开始时间:</label>
|
||
<div class="layui-input-inline">
|
||
<input class="layui-input" lay-verify="required" placeholder="yyyy-MM-dd HH:mm" name="BeginTime" id="BeginTime" style="width:300px;">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span style="color: red">*</span>会议时长:</label>
|
||
<div class="layui-input-inline">
|
||
<select name="ContinueHour" id="ContinueHour">
|
||
<option value="0">0小时</option>
|
||
<option value="1" selected>1小时</option>
|
||
<option value="2">2小时</option>
|
||
<option value="3">3小时</option>
|
||
<option value="4">4小时</option>
|
||
<option value="5">5小时</option>
|
||
<option value="6">6小时</option>
|
||
<option value="7">7小时</option>
|
||
<option value="8">8小时</option>
|
||
</select>
|
||
</div>
|
||
<div class="layui-input-inline">
|
||
<select name="ContinueMinute" id="ContinueMinute" style="width:60px;">
|
||
<option value="0">00分</option>
|
||
<option value="15">15分</option>
|
||
<option value="30">30分</option>
|
||
<option value="45">45分</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span style="color: red">*</span>会议地点:</label>
|
||
<div class="layui-input-inline">
|
||
<div class="layui-input-block" id="MeetingSite" style="width: 400px"></div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item layui-form-text">
|
||
<label class="layui-form-label"><span style="color: red">*</span>主讲人(可多选):</label>
|
||
<div class="layui-input-inline">
|
||
<div id="Compere" style="width: 400px"></div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item layui-form-text">
|
||
<label class="layui-form-label">参与人(可多选):</label>
|
||
<div class="layui-input-inline">
|
||
<div id="Participant" style="width: 400px"></div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item layui-form-text">
|
||
<label class="layui-form-label">备注:</label>
|
||
<div class="layui-input-inline">
|
||
<textarea class="layui-textarea" name="Remark" id="Remark" style="width:300px;"></textarea>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span style="color: red">*</span>培训文件:</label>
|
||
<div class="layui-upload">
|
||
<button type="button" class="layui-btn layui-btn-sm layui-btn-primary" id="uploadAtt">
|
||
<i class="layui-icon layui-icon-upload-drag layui-font-12"></i> 上传附件
|
||
</button>
|
||
<div class="layui-upload-list" style="max-width: 1000px;">
|
||
<table class="layui-table">
|
||
<colgroup>
|
||
<col width="100">
|
||
<col width="100">
|
||
<col width="200">
|
||
<col width="50">
|
||
</colgroup>
|
||
<thead>
|
||
<tr>
|
||
<th>文件名</th>
|
||
<th>大小</th>
|
||
<th>上传进度</th>
|
||
<th>操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="demoList"></tbody>
|
||
</table>
|
||
</div>
|
||
@* <button type="button" class="layui-btn layui-btn-sm" id="testListAction">保存附件</button>*@
|
||
<input type="hidden" name="Accessories" id="Accessories" lay-verify="required" lay-reqtext="请上传培训文件!" />
|
||
<br /><span>备注:上传文件支持扩展名:rar .zip .doc .docx .pdf .jpg .png.excel.mp3...</span>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<div class="layui-input-block" style="float: right">
|
||
<input type="hidden" name="Id" id="Id" />
|
||
<button class="layui-btn layui-btn-sm layui-btn-normal" type="button" lay-submit="" id="save" lay-filter="save" onclick="return false;">保存</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<script src="~/Scripts/layui_ext/xm-select/xm-select.js"></script>
|
||
<script>
|
||
var selectRow = {};
|
||
var layer;
|
||
var table;
|
||
var winindex;
|
||
var upload;
|
||
var inneruserTree;
|
||
var element;
|
||
var form;
|
||
var accessories = [];
|
||
layui.config({
|
||
base: '../Scripts/layui_ext/',
|
||
}).extend({
|
||
selectInput: 'selectInput/selectInput'
|
||
}).use(['table', 'laydate', 'upload', 'flow', 'element', 'form', 'selectInput'], function () {
|
||
var $ = layui.jquery
|
||
, upload = layui.upload
|
||
, element = layui.element
|
||
, layer = layui.layer
|
||
, form = layui.form
|
||
, selectInput = layui.selectInput;
|
||
element = layui.element;
|
||
var laydate = layui.laydate;
|
||
|
||
laydate.render({
|
||
elem: '#BeginTime'
|
||
, type: 'datetime'
|
||
, format: 'yyyy-MM-dd HH:mm',
|
||
});
|
||
|
||
var File_Server = '@ViewBag.File_Server';
|
||
var loading;
|
||
|
||
var id = '@Html.Raw(ViewBag.id)';
|
||
if (id != '') {
|
||
init();
|
||
} else {
|
||
$.ajax({
|
||
type: "GET",
|
||
url: '@Html.Raw(ViewBag.webapi + "/Inneruser/tree")',
|
||
success: function (da) {
|
||
//var compereTree = $.extend(true, [], da.data);
|
||
var participantTree = $.extend(true, [], da.data);
|
||
//renderselectCompere(compereTree, []);
|
||
renderSelectParticipant(participantTree, []);
|
||
renderSelectChannel([]);
|
||
}
|
||
});
|
||
$.ajax({
|
||
type: "GET",
|
||
url: '@Html.Raw(ViewBag.webapi + "/Inneruser/treeKeyName")',
|
||
success: function (da) {
|
||
var compereTree = $.extend(true, [], da.data);
|
||
renderselectCompere(compereTree, []);
|
||
}
|
||
});
|
||
InitMeetingSite('');
|
||
}
|
||
$.ajax({
|
||
type: "GET",
|
||
url: File_Server + "/api/Token?key=7AC51A5F0DE9A13D5FC9960AD45CC8D5",
|
||
success: function (da) {
|
||
token = "Bearer " + da;
|
||
var uploadListIns = upload.render({
|
||
elem: '#uploadAtt'
|
||
, elemList: $('#demoList') //列表元素对象
|
||
//, url: 'https://httpbin.org/post' //此处用的是第三方的 http 请求演示,实际使用时改成您自己的上传接口即可。
|
||
, url: File_Server + '/Streaming/UploadLargeFile'
|
||
, accept: 'file'
|
||
, headers: { Authorization: token }
|
||
, multiple: true
|
||
, number: 10
|
||
, auto: true
|
||
//, bindAction: '#testListAction'
|
||
, choose: function (obj) {
|
||
var that = this;
|
||
var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
|
||
|
||
//读取本地文件
|
||
obj.preview(function (index, file, result) {
|
||
if (file.size > 1024 * 1024 * 500) {
|
||
layer.msg('不能上传超过500M的文件!', { icon: 2 });
|
||
delete files[index];
|
||
return;
|
||
}
|
||
var fileSize = (file.size / (1024)) > 1024 ? (file.size / (1024 * 1024)).toFixed(2) + 'MB' :
|
||
(file.size / (1024)).toFixed(1) + 'KB';
|
||
var tr = $(['<tr id="upload-' + index + '">'
|
||
, '<td>' + file.name + '</td>'
|
||
, '<td>' + fileSize + '</td>'
|
||
, '<td><div class="layui-progress" lay-filter="progress-demo-' + index + '"><div class="layui-progress-bar" lay-percent=""></div></div></td>'
|
||
, '<td>'
|
||
, '<button class="layui-btn layui-btn-xs demo-reload layui-hide" type="button">重传</button>'
|
||
, '<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete" type="button">删除</button>'
|
||
, '</td>'
|
||
, '</tr>'].join(''));
|
||
|
||
//单个重传
|
||
tr.find('.demo-reload').on('click', function () {
|
||
obj.upload(index, file);
|
||
});
|
||
|
||
//删除
|
||
tr.find('.demo-delete').on('click', function () {
|
||
delete files[index]; //删除对应的文件
|
||
tr.remove();
|
||
var fileIndex = accessories.findIndex(x => x.fileName == file.name);
|
||
accessories.splice(fileIndex, 1);
|
||
uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值,以免删除后出现同名文件不可选
|
||
});
|
||
|
||
that.elemList.append(tr);
|
||
element.render('progress'); //渲染新加的进度条组件
|
||
});
|
||
}
|
||
, done: function (res, index, upload) { //成功的回调
|
||
var that = this;
|
||
//if(res.code == 0){ //上传成功
|
||
var tr = that.elemList.find('tr#upload-' + index)
|
||
, tds = tr.children();
|
||
//tds.eq(3).html(''); //清空操作
|
||
var file = this.files[index];
|
||
var fileSize = (file.size / (1024)) > 1024 ? (file.size / (1024 * 1024)).toFixed(2) + 'MB' :
|
||
(file.size / (1024)).toFixed(1) + 'KB';
|
||
var data = {
|
||
fileName: file.name,
|
||
fileSize: fileSize,
|
||
fileUrl: res.url
|
||
}
|
||
accessories.push(data);
|
||
delete this.files[index]; //删除文件队列已经上传成功的文件
|
||
return;
|
||
//}
|
||
this.error(index, upload);
|
||
}
|
||
, allDone: function (obj) { //多文件上传完毕后的状态回调
|
||
console.log(obj)
|
||
var data = JSON.stringify(accessories);
|
||
console.log(data);
|
||
document.getElementById("Accessories").value = JSON.stringify(accessories);
|
||
}
|
||
, error: function (index, upload) { //错误回调
|
||
var that = this;
|
||
var tr = that.elemList.find('tr#upload-' + index)
|
||
, tds = tr.children();
|
||
tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
|
||
}
|
||
, progress: function (n, elem, e, index) { //注意:index 参数为 layui 2.6.6 新增
|
||
element.progress('progress-demo-' + index, n + '%'); //执行进度条。n 即为返回的进度百分比
|
||
}
|
||
});
|
||
}
|
||
})
|
||
form.on('submit(save)', function (data) {
|
||
var eid = '@ViewBag.eid';
|
||
if (accessories.length == 0) {
|
||
layer.msg("请上传培训文件!", { icon: 5 });
|
||
return;
|
||
}
|
||
layer.confirm('是否确认保存?', { icon: 3, title: '提示' }, function (index) {
|
||
$.ajax({
|
||
type: "POST",
|
||
url: '@Html.Raw(ViewBag.webapi + "/api/meeting/CreateOrEdit?eid=")' + eid,
|
||
data: JSON.stringify(data.field),
|
||
dataType: "json",
|
||
contentType: "application/json",
|
||
success: function (da) {
|
||
if (da.code == 0) {
|
||
parent.layer.msg('操作成功!', { icon: 1 });
|
||
parent.TableReload();
|
||
parent.Closed();
|
||
} else {
|
||
layer.msg(da.retmsg, { icon: 2 });
|
||
}
|
||
},
|
||
error: function () {
|
||
layer.msg('操作失败!', { icon: 2 });
|
||
}
|
||
});
|
||
});
|
||
})
|
||
function init() {
|
||
var id = '@Html.Raw(ViewBag.id)';
|
||
$.ajax({
|
||
type: "GET",
|
||
url: '@Html.Raw(ViewBag.webapi + "/api/meeting/detail?meetingId=")' + id,
|
||
success: function (da) {
|
||
document.getElementById("Id").value = da.data.id;
|
||
$.ajax({
|
||
type: "GET",
|
||
url: '@Html.Raw(ViewBag.webapi + "/Inneruser/tree")',
|
||
success: function (da1) {
|
||
//var compereTree = $.extend(true, [], da1.data);
|
||
var participantTree = $.extend(true, [], da1.data);
|
||
//renderselectCompere(compereTree, da.data.compereIds);
|
||
renderSelectParticipant(participantTree, da.data.participantIds);
|
||
renderSelectChannel(da.data.channelList);
|
||
}
|
||
});
|
||
$.ajax({
|
||
type: "GET",
|
||
url: '@Html.Raw(ViewBag.webapi + "/Inneruser/treeKeyName")',
|
||
success: function (da1) {
|
||
var compereTree = $.extend(true, [], da1.data);
|
||
renderselectCompere(compereTree, da.data.compereIds);
|
||
}
|
||
});
|
||
document.getElementById("MeetingType").value = da.data.meetingType;
|
||
document.getElementById("MeetingName").value = da.data.meetingName;
|
||
InitMeetingSite(da.data.meetingSite);
|
||
if (da.data.beginTime != "" && da.data.beginTime.length > 3) {
|
||
document.getElementById("BeginTime").value = da.data.beginTime.substring(0, da.data.beginTime.length - 3);
|
||
} else {
|
||
document.getElementById("BeginTime").value = da.data.beginTime;
|
||
}
|
||
var continueHour = document.getElementById("ContinueHour");
|
||
for (var i = 0; i < continueHour.length; i++) {
|
||
if (continueHour[i].value == da.data.continueHour.toString())
|
||
continueHour[i].selected = true;
|
||
}
|
||
var continueMinute = document.getElementById("ContinueMinute");
|
||
for (var i = 0; i < continueMinute.length; i++) {
|
||
if (continueMinute[i].value == da.data.continueMinute.toString())
|
||
continueMinute[i].selected = true;
|
||
}
|
||
form.render("select");
|
||
document.getElementById("Remark").value = da.data.remark;
|
||
accessories = da.data.accessoryList;
|
||
initAccessory();
|
||
}
|
||
});
|
||
}
|
||
|
||
function InitMeetingSite(initValue) {
|
||
$.ajax({
|
||
type: "GET",
|
||
url: '@Html.Raw(ViewBag.webapi + "/api/meeting/select/site")',
|
||
dataType: "json",
|
||
contentType: "application/json",
|
||
success: function (da) {
|
||
var data = da.data.map(function (d) {
|
||
return { value: d.key, name: d.value }
|
||
});
|
||
var ins = selectInput.render('#MeetingSite', {
|
||
// 容器id,必传参数
|
||
name: 'MeetingSite', // 渲染的input的name值
|
||
hasSelectIcon: true,
|
||
layFilter: 'MeetingSite', //同layui form参数lay-filter
|
||
layVerify: 'required', //同layui form参数lay-verify
|
||
layVerType: '', // 同layui form参数lay-verType
|
||
layReqText: '请输入会议地点', //同layui form参数lay-ReqText
|
||
initValue: initValue, // 渲染初始化默认值
|
||
placeholder: '请输入会议地点', // 渲染的inputplaceholder值
|
||
// 联想select的初始化本地值,数组格式,里面的对象属性必须为value,name,value是实际选中值,name是展示值,两者可以一样
|
||
invisibleMode: true,
|
||
ignoreCase: true,
|
||
data: data,
|
||
hasCut: true, // 是否允许剪贴
|
||
//url: "http://toys.shop.com/site/test", // 异步加载的url,异步加载联想词的数组值,设置url,data参数赋的值将会无效,url和data参数两者不要同时设置
|
||
remoteSearch: false, // 是否启用远程搜索 默认是false,和远程搜索回调保存同步
|
||
parseData: function (res) { // 此参数仅在异步加载data数据下或者远程搜索模式下有效,解析回调,如果你的异步返回的data不是上述的data格式,请在此回调格式成对应的数据格式,回调参数是异步加载的数据
|
||
let data = [];
|
||
res.map(item => {
|
||
data.push({ name: item.title, value: item.val })
|
||
});
|
||
console.log(data)
|
||
return data;
|
||
},
|
||
error: function (error) { // 异步加载出错的回调 回调参数是错误msg
|
||
|
||
},
|
||
done: function (data) { // 异步加载成功后的回调 回调参数加载返回数据
|
||
console.log(data)
|
||
},
|
||
remoteMethod: function (value, cb) { // 远程搜索的回调函数
|
||
// value 是input实施输入的value值
|
||
// cb是回调处理函数,请在执行ajax搜索请求成功之后执行此回调函数
|
||
|
||
//案例
|
||
//这里如果val为空, 则不触发搜索
|
||
if (!value) {
|
||
return cb([]);
|
||
}
|
||
//这里的$.ajax去请求后台拿回数据
|
||
$.ajax({
|
||
method: 'get',
|
||
url: 'http://toys.shop.api.com/user/test', // 此处是你服务端的接口
|
||
data: {
|
||
keyword: value,
|
||
},
|
||
success: function (data) {
|
||
// 此处最好直接返回取你返回的 data属性,如:data.data,这样不限制你后端返回的数据对象格式,如果整体传参,必须满足:{"code":0,"msg":"success","data":[]}
|
||
return cb(data)
|
||
}
|
||
})
|
||
}
|
||
});
|
||
|
||
},
|
||
error: function () {
|
||
layer.msg('统计数据加载失败!', { icon: 2 });
|
||
}
|
||
});
|
||
}
|
||
})
|
||
|
||
function initAccessory() {
|
||
layui.use('element', function () {
|
||
document.getElementById("Accessories").value = JSON.stringify(accessories);
|
||
var element = layui.element;
|
||
var $ = layui.jquery;
|
||
$('#demoList').html("");
|
||
for (var i = 0; i < accessories.length; i++) {
|
||
var accessory = accessories[i];
|
||
if (!accessory) return;
|
||
var tr = $(['<tr id="upload-old-' + accessory.id + '">'
|
||
, '<td>' + accessory.fileName + '</td>'
|
||
, '<td>' + accessory.fileSize + '</td>'
|
||
, '<td><div class="layui-progress" lay-filter="progress-old-' + accessory.id + '"><div class="layui-progress-bar" lay-percent=""></div></div></td>'
|
||
, '<td>'
|
||
, '<button class="layui-btn layui-btn-xs layui-btn-danger" type="button" onclick="deleteFile(' + accessory.id + ',\'' + accessory.fileName + '\')">删除</button>'
|
||
, '</td>'
|
||
, '</tr>'].join(''));
|
||
$('#demoList').append(tr);
|
||
element.progress('progress-old-' + accessory.id, '100%');
|
||
}
|
||
});
|
||
}
|
||
|
||
function deleteFile(id, fileName) {
|
||
winindex = layer.confirm('是否确认删除【' + fileName + '】?', { icon: 3, title: '提示' }, function (index) {
|
||
@*$.ajax({
|
||
type: "DELETE",
|
||
url: '@Html.Raw(ViewBag.webapi + "/api/meeting/accessory?accessoryId=")' + id,
|
||
dataType: "json",
|
||
contentType: "application/json",
|
||
success: function (da) {
|
||
if (da.result == true) {
|
||
parent.layer.msg('操作成功!', { icon: 1 });
|
||
init();
|
||
} else {
|
||
layer.msg(da.retmsg, { icon: 2 });
|
||
}
|
||
},
|
||
error: function () {
|
||
layer.msg('操作失败!', { icon: 2 });
|
||
}
|
||
});*@
|
||
var index = accessories.findIndex(x => x.id == id);
|
||
accessories.splice(index, 1);
|
||
Closed();
|
||
initAccessory();
|
||
});
|
||
return false;
|
||
}
|
||
|
||
function renderselectCompere(compereTree, check) {
|
||
var optionsCompere = {
|
||
el: '#Compere',
|
||
name: 'Compere',//表单的name属性
|
||
//clickClose: true, //单选完关闭下拉框
|
||
filterable: true, //搜索
|
||
create: function (val, arr) {
|
||
//返回一个创建成功的对象, val是搜索的数据, arr是搜索后的当前页面数据
|
||
if (arr.length === 0) {
|
||
return {
|
||
name: val,
|
||
value: val
|
||
}
|
||
}
|
||
},
|
||
direction: 'down', // 展开方向 下
|
||
//radio: false, //单选
|
||
//tree: {
|
||
// show: true,
|
||
// showFolderIcon: true,
|
||
// showLine: true,
|
||
// //非严格模式
|
||
// strict: false,
|
||
// expandedKeys: true
|
||
//},
|
||
layVerify: 'required',
|
||
tips: '请选择或输入主讲人',
|
||
toolbar: {//工具条,全选,清空,反选,自定义
|
||
show: true,
|
||
list: [
|
||
'CLEAR'
|
||
]
|
||
},
|
||
data: compereTree,
|
||
initValue: check
|
||
};
|
||
var selectCompere = xmSelect.render(optionsCompere);
|
||
return selectCompere;
|
||
}
|
||
function renderSelectParticipant(participantTree, check) {
|
||
var optionsParticipant = {
|
||
el: '#Participant',
|
||
name: 'Participant',//表单的name属性
|
||
//clickClose: true, //单选完关闭下拉框
|
||
filterable: true, //搜索
|
||
direction: 'down', // 展开方向 下
|
||
//radio: false, //单选
|
||
tree: {
|
||
show: true,
|
||
showFolderIcon: true,
|
||
showLine: true,
|
||
expandedKeys: true
|
||
},
|
||
toolbar: {//工具条,全选,清空,反选,自定义
|
||
show: true,
|
||
list: [
|
||
'CLEAR'
|
||
]
|
||
},
|
||
data: participantTree,
|
||
initValue: check
|
||
};
|
||
var selectParticipant = xmSelect.render(optionsParticipant);
|
||
return selectParticipant;
|
||
}
|
||
function Closed() {
|
||
layer.close(winindex);
|
||
}
|
||
function renderSelectChannel(check) {
|
||
var allChannel = @Html.Raw(ViewBag.AllChannel);
|
||
var optionsChannel = {
|
||
el: '#selectChannel',
|
||
name: 'channels',//表单的name属性
|
||
tips: '请选择事业部',
|
||
layVerify: 'required',
|
||
toolbar: {//工具条,全选,清空,反选,自定义
|
||
show: true,
|
||
list: [
|
||
'CLEAR'
|
||
]
|
||
},
|
||
data: allChannel,
|
||
initValue: check
|
||
};
|
||
var selectChannel = xmSelect.render(optionsChannel);
|
||
return selectChannel;
|
||
}
|
||
|
||
</script>
|