| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>欢迎词语音管理</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <script src="../Script/Common/huayi.load.js"></script>
- <script src="../Script/Common/huayi.config.js"></script>
- <link href="../css/Table/table1.css" rel="stylesheet" />
- <link href="../css/init.css" rel="stylesheet" />
- <script src="../js/laydate/laydate.js"></script>
- <style>
- table td {
- word-break: break-all;
- word-wrap: break-word;
- }
-
- .add_time input {
- width: 50%;
- }
- .th-box {
- background-color: #ffffff;
- }
- #settime,#settimes{
- width: 228px;
- }
- </style>
- </head>
- <body class="gray-bg">
- <div class="daoHang clearfix">
- <div class="dhLeft">
- <sapn><i class="syIcon"></i>位置:
- <a href="javaScript:;" id="ReIndex">首页</a>>
- <a href="javaScript:;">话务管理</a>>
- <a href="" style="color: #000;">欢迎词语音管理</a>
- </sapn>
- </div>
- <div class="dhRight">
- <a href="#" title="刷新"><i class="fa fa-refresh"></i></a>
- </div>
- </div>
- <div class="wrapper wrapper-content animated fadeInRight">
-
- <div class="th-box">
- <div class="form-inline clearfix th-bar">
- <div class="form-group time-box">
- <i class="tub fa fa-search"></i>
- <input type="text" class="form-control" id="KeyWords" placeholder="请输入关键字">
- </div>
- <div class="form-group time-box">
- <select class="form-control" id="itemid">
- <option value="">请选择项目id</option>
- <option value="0">未启动</option>
- <option value="1">启动中</option>
- </select>
- </div>
- <div class="form-group time-box">
- <i class="tub fa fa-calendar"></i>
- <input type="text" class="form-control" id="settime" placeholder="请选择起止时间">
- </div>
- <div class="form-group time-box">
- <i class="tub fa fa-calendar"></i>
- <input type="text" class="form-control" id="settimes" placeholder="请选择有效时间">
- </div>
- <div class="form-group time-box">
- <select class="form-control" id="state">
- <option value="">请选择状态</option>
- <option value="0">未启动</option>
- <option value="1">启动中</option>
- </select>
- </div>
-
- <div class="form-group pull-right tool_bars">
- <input type="button" class="sc_btn" id="sceach_btn" value="搜索" />
- <input type="button" class="sc_btn" id="HY_add" onclick="btn_add()" value="添加" />
- <input type="button" class="sc_btn" id="HY_edit" onclick="btn_edit()" value="修改" />
- <input type="button" class="sc_btn" id="HY_delete" onclick="btn_deletes()" value="删除" />
- </div>
- </div>
- </div>
- <div style="width: 100%;padding-top: 10px;">
- <table id="list" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true" data-click-to-select="true">
- <thead>
- <tr>
- <th data-field="state" data-checkbox="true"></th>
- <th data-field="F_Item">项目名称</th>
- <th data-field="F_WavPath" data-formatter="setCode" data-align="center">录音</th>
- <th data-field="F_StartDate">生效时间</th>
- <th data-field="F_EndDate">失效时间</th>
- <th data-field="F_CreateTime">创建时间</th>
- <th data-field="F_IsState" data-formatter="formatterState">状态</th>
- <th data-field="F_Remark" data-formatter="formatterRemark">备注</th>
- </tr>
- </thead>
- <tbody id="tbody"></tbody>
- </table>
- </div>
- </div>
- <!--下载框-->
- <div class="t-shade">
- <div class="shade_k">
- <div class="shade_title">
- <span>录音播放与下载<srong class="cknum"></srong></span>
- <span class="setwin"><a>x</a></span>
- </div>
- <div class="shade_content">
- <div class="Ly_box audiojs">
- </div>
- <div class="boxCon LY_box">
- </div>
- </div>
- </div>
- </div>
- <script>
- var htmls=' <div class="ly_text">'+
- '<object id="WindowsMediaPlayer" style="width: 95%; height: 100px;margin:15px 2%;" classid="CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6" '+
- ' viewastext>'+
- ' <param name="URL" value="">'+
- '<param name="rate" value="1">'+
- '<param name="balance" value="0">'+
- '<param name="currentPosition" value="0">'+
- '<param name="defaultFrame" value="">'+
- '<param name="playCount" value="1">'+
- '<param name="autoStart" value="-1">'+
- '<param name="currentMarker" value="0">'+
- '<param name="invokeURLs" value="0">'+
- '<param name="baseURL" value="">'+
- '<param name="volume" value="50">'+
- '<param name="mute" value="0">'+
- '<param name="uiMode" value="mini">'+
- '<param name="stretchToFit" value="0">'+
- '<param name="windowlessVideo" value="-1">'+
- '<param name="enabled" value="-1">'+
- '<param name="enableContextMenu" value="0">'+
- '<param name="fullScreen" value="0">'+
- ' <param name="SAMIStyle" value="">'+
- '<param name="SAMILang" value="">'+
- '<param name="SAMIFilename" value="">'+
- ' <param name="captioningID" value="">'+
- '<param name="enableErrorDialogs" value="-1">'+
- '<param name="_cx" value="4233">'+
- '<param name="_cy" value="4392">'+
- '</object>'+
- '<div style="width: 95%; margin:0 auto; text-align:center;" class="xzly"></div>'+
- '</div>';
- $(document).ready(function() {
- laydate.render({
- elem: '#settime',
- theme: '#1ab394',
- calendar: true,
- range: '~'
- });
- laydate.render({
- elem: '#settimes',
- theme: '#1ab394',
- calendar: true,
- range: '~'
- });
- initTable();
- /*搜索*/
- $("#sceach_btn").click(function() {
- initTable();
- })
- $(".setwin").click(function() {
- $(".t-shade").removeClass("cx");
- $('audio')[0].pause();
- });
- })
- function initTable() {
- //先销毁表格
- $('#list').bootstrapTable('destroy');
- //初始化表格,动态从服务器加载数据
- $("#list").bootstrapTable({
- method: "get", //使用get请求到服务器获取数据
- url: huayi.config.callcenter_url + "IVRWelcome/GetList", //获取数据的Servlet地址
- contentType: 'application/x-www-form-urlencoded',
- striped: true, //表格显示条纹
- pagination: true, //启动分页
- pageSize: 10, //每页显示的记录数
- pageNumber: 1, //当前第几页
- pageList: [10, 20, 50, 100], //记录数可选列表
- search: false, //是否启用查询
- showColumns: false, //显示下拉框勾选要显示的列
- showRefresh: false, //显示刷新按钮
- sidePagination: "server", //表示服务端请求
- //设置为undefined可以获取pageNumber,pageSize,searchText,sortName,sortOrder
- //设置为limit可以获取limit, offset, search, sort, order
- queryParamsType: "undefined",
- queryParams: function queryParams(params) { //设置查询参数
- var param = {
- page: params.pageNumber,
- pagesize: params.pageSize,
- key: $("#KeyWords").val(),
- itemid: $("#itemid").val(),
- btime: $('#settime').val() && $('#settime').val().split(' ~ ')[0],
- etime: $('#settime').val() && $('#settime').val().split(' ~ ')[1],
- bytime: $('#settimes').val() && $('#settimes').val().split(' ~ ')[0],
- eytime: $('#settimes').val() && $('#settimes').val().split(' ~ ')[1],
- state:$('#state').val(),
- token: $.cookie("token")
- };
- return param;
- },
- onLoadSuccess: function() { //加载成功时执行
- //layer.msg("加载成功");
- },
- onLoadError: function() { //加载失败时执行
- //layer.msg("加载数据失败", { time: 1500, icon: 2 });
- }
- });
- }
- /*删除提示*/
- function btn_deletes(){
- var ids = $.map($('#list').bootstrapTable('getSelections'),
- function(row) {
- return row.F_ID;
- });
- /*判断长度*/
- if(ids.length <= 0) {
- layer.confirm('没有可删除的选项?', {
- btn: ['确定'] //按钮
- });
- return;
- }
- removes();
- }
- function removes() {
- layer.confirm('确定删除当前记录?', {
- btn: ['是', '否'] //按钮
- }, function() {
- /*执行删除*/
- var ids = $.map($('#list').bootstrapTable('getSelections'),
- function(row) {
- return row.F_ID;
- });
- /*发送请求*/
- $.post(huayi.config.callcenter_url + "IVRWelcome/DelIVRWords", {
- ids: ids,
- token: $.cookie("token")
- }, function(result) {
- result = JSON.parse(result);
- if(result.state.toLowerCase() == "success") {
- layer.msg("删除成功");
- $('#list').bootstrapTable('refresh');
- }
- })
- });
- }
- //添加
- function btn_add(){
- layer.open({
- type: 2,
- content: "addWelcomeWords.html",
- title: '添加欢迎词语音',
- area: ['75%', '70%'], //宽高
- });
- }
- //修改
- function btn_edit(){
- var ids = $.map($('#list').bootstrapTable('getSelections'),
- function(row) {
- return row.F_ID;
- });
- if(ids.length != 1) {
- layer.confirm('请选择一行进行修改?', {
- btn: ['确定'] //按钮
- });
- return;
- } else {
- layer.open({
- type: 2,
- content: "addWelcomeWords.html?id="+ids,
- title: '修改欢迎词语音',
- area: ['75%', '70%'], //宽高
- });
- }
- }
- //状态
- function formatterState(val,row){
- var str="";
- if(val==0){
- str='未启动'
- }else{
- str='启动中'
- }
- return str
- }
- //备注
- function formatterRemark(val){
- var str="";
- if(val) {
- if(val.length > 12) {
- str='<div title="'+ val +'">'+val.substring(0, 12) + '...</div>';
- }else{
- str='<div title="'+ val +'">'+ val + '</div>';
- }
- return str;
- }
- }
- //音频
- function setCode(val,row) {
- if(val) {
- return '<div class="imgs">' +
- '<img src="../img/vice.png" alt="" onclick= ck(this) item="' + val + '" Files="'+ row.F_WavFileName +'" />' +
- '</div>';
- } else {
- return '';
- }
- }
- //录音
- function ck(val) {
- if(!!window.ActiveXObject || "ActiveXObject" in window){
- layer.open({
- type: 1,
- content: htmls,
- title: '录音播放',
- area: ['55%', '65%'], //宽高
- });
- WindowsMediaPlayer.URL=$(val).attr('item');
- $('<a href="' + $(val).attr('item') + '" class="sc_btn LY "download="' + $(val).attr('item') + '">下载录音</a>').appendTo(".xzly");
-
- }else{
- var path = $(val).attr("item");
- $(".t-shade").addClass("cx");
- $(".Ly_box").empty();
- $(".LY_box").empty();
- $('<audio style="width:100%;"class=" " src="' + path + '" loop="loop" type="audio/v3" controls="controls"></audio>').appendTo(".Ly_box");
- $('<a href="' + $(val).attr('item') + '" class="sc_btn LY "download="' + $(val).attr('item') + '">下载录音</a>').appendTo(".LY_box");
- }
- }
- </script>
- </body>
- </html>
|