devbox
代码探险家
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

语音排队叫号系统源码_c#排队叫号

作者：代码探险家 | 2024-08-17 11:20:39

赞

踩

c#排队叫号

语音排队叫号系统广泛用于银行，餐饮，医院等场景。本系统采用Layui框架完成，前端体验不错，基于角色实现了权限管理，实现了数据库菜单无限级扩展和菜单链接动态控制，系统实现扫码排队，语音叫号等功能。

开发语言：C# 

数据库：sql server2017

开发工具：vs2019

技术：asp.net+layui

主要功能包括：

带验证码的登录界面，背景可替换。

基于角色的权限管理。

系统具有打印和导出数据表格的功能。

支持筛选列和组合查询。

系统实现换肤功能。

 

 

 

 

 

 

 

 

 

 

关键代码如下：

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TbLineUpList.aspx.cs" Inherits="PaiDuiSys.page.TbLineUpList" %>
  2.  
  3. <!DOCTYPE html>
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  8.     <title>夜鹰排队叫号系统v1.0</title>
  9.     <meta charset="utf-8"/>
  10.     <meta name="renderer" content="webkit"/>
  11.     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  12.     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
  13.     <link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all"/>
  14.     <link rel="stylesheet" href="../css/public.css" media="all"/>
  15. </head>
  16. <body>
  17.     <div class="layuimini-container">
  18.     <div class="layuimini-main">
  19.         <fieldset class="table-search-fieldset">
  20.             <legend>搜索信息</legend>
  21.             <div style="margin: 10px 10px 10px 10px">
  22.                 <form id="form1"  class="layui-form layui-form-pane" action="">
  23.                     <div class="layui-form-item">
  24.                         <div class="layui-inline">
  25.                             <label class="layui-form-label">业务类型：</label>
  26.                             <div class="layui-input-inline">
  27.                                 <select name="BuType" lay-verify="required">
  28.                                                 <option value="0" selected="selected">全部</option>
  29.                                                 <option value="1">个人业务</option>
  30.                                                 <option value="2">对公业务</option>                                               
  31.                                 </select>                
  32.                             </div>
  33.                         </div>
  34.                         <div class="layui-inline">
  35.                             <label class="layui-form-label">关键字</label>
  36.                             <div class="layui-input-inline">
  37.                                 <input type="text" name="SearchKey" autocomplete="off" class="layui-input"/>
  38.                             </div>
  39.                         </div>
  40.                        
  41.                         
  42.                         <div class="layui-inline">
  43.                             <button type="submit" class="layui-btn layui-btn-primary"  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
  44.                         </div>
  45.                     </div>
  46.                 </form>
  47.             </div>
  48.         </fieldset>
  49.  
  50.         <script type="text/html" id="toolbarDemo">
  51.             <div class="layui-btn-container">
  52.                 <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="add"> 添加 </button>
  53.                 <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="edit"> 编辑 </button>
  54.                 <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="delete"> 删除 </button>
  55.                 <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="showdetail"> 查看 </button>
  56.             </div>
  57.         </script>
  58.        
  59.         <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
  60.         
  61.   
  62.         </div>
  63.         <script type="text/html" id="currentTableBar">
  64.             <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="classnum">叫号</a>
  65.             <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="classfinish">完成</a>
  66.             <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="classovertime">过期</a>
  67.             <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="showview">查看</a>
  68.             
  69.         </script>
  70.  
  71.  
  72. </div>
  73. <script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
  74. <script>
  75.    
  76.     layui.use(['form', 'table'], function () {
  77.         var $ = layui.jquery;
  78.             form = layui.form;
  79.             table = layui.table;
  80.             layer = layui.layer;
  81.         table.render({
  82.             elem: '#currentTableId',
  83.             url: '../Ajax.ashx?rnum=2',
  84.             toolbar: '#toolbarDemo',
  85.             defaultToolbar: ['filter', 'exports', 'print', {
  86.                 title: '提示',
  87.                 layEvent: 'LAYTABLE_TIPS',
  88.                 icon: 'layui-icon-tips'
  89.             }],
  90.             cellMinWidth: 80,
  91.             cols: [[
  92.                 { type: "checkbox", width: 50 }, 
  93.                 { field: 'ID', width: 80, title: 'ID' },
  94.                 { field: 'CreateTime', width: 200, title: '创建时间' },
  95.                 { field: 'CustName', width: 100, title: '客户姓名'},
  96.                 { field: 'CustIDCard', width:200, title: '身份证' },
  97.                 { field: 'CustTel', width: 120, title: '客户电话' ,edit: 'text'},
  98.                 { field: 'LineNum', width: 60, title: '排号' },
  99.                 { field: 'WindowNumStr', width: 120, title: '当前窗口' },
  100.                 { field: 'BuType', title: '类型', width: 120,hide: true },
  101.                 { field: 'BuTypeStr', title: '类型', width: 120},                
  102.                 { field: 'BuStatusStr', width: 80, title: '状态'},                
  103.                 { field: 'Memo', title: '备注(点击单元格改备注)', event: 'setMemo' },
  104.                 { field: 'CallTime', title: '最后一次叫号时间',  hide: true },
  105.                 { field: 'FinishTime', title: '业务完成时间',  hide: true },
  106.                 { field: 'OptName', title: '业务办理人员',hide: true },
  107.                 { field: 'OptUserId', title: '业务办理人员ID', hide: true },
  108.                 { field: 'WindowNum', title: '窗口号', hide: true },
  109.                 { field: 'LineNum', title: '排队号', hide: true },
  110.                 {title: '操作', width:300, toolbar: '#currentTableBar', align: "center"}
  111.             ]],
  112.             limits: [10, 15, 20, 25, 50, 100],
  113.             limit: 10,
  114.             page: true,
  115.             skin: 'line',
  116.             done(res, curr, count) {
  117.                 let data = res.data;
  118.                 data.forEach((value, i) => {
  119.                    
  120.                     //console.log(value.BuStatus);
  121.                     //根据每一行的status字段，设置当前行的背景颜色
  122.                     if (value.BuStatus =="1") {
  123.                         $('.layui-table tr[data-index="' + i + '"]').css({ 'background-color': 'red','color':'#fff'});
  124.                     } else if (value.BuStatus =="2") {
  125.                         $('.layui-table tr[data-index="' + i + '"]').css({ 'background-color': '#3cb371', 'color': '#fff'});
  126.                     } else if (value.BuStatus == "3"){
  127.                         $('.layui-table tr[data-index="' + i + '"]').css({ 'background-color': '#ccc', 'color': '#fff'});
  128.                     }
  129.  
  130.                 });
  131.             }        
  132.         });
  133.  
  134.        
  135.         // 监听搜索操作
  136.         form.on('submit(data-search-btn)', function (data) {
  137.            
  138.             //执行搜索重载
  139.             table.reload('currentTableId', {
  140.                 page: {
  141.                     curr: 1
  142.                 }
  143.                 , where: {
  144.                     BuType: data.field.BuType,
  145.                     SearchKey: data.field.SearchKey
  146.                 }
  147.             }, 'data');
  148.  
  149.             return false;
  150.         });
  151.  
  152.         /**
  153.          * toolbar监听事件
  154.          */
  155.         table.on('toolbar(currentTableFilter)', function (obj) {
  156.             if (obj.event === 'add') {  // 监听添加操作
  157.                 var index = layer.open({
  158.                     title: '新增用户',
  159.                     type: 2,
  160.                     zIndex: layer.zIndex,
  161.                     id: 'LAY_layuiproadd',  //设定一个id，防止重复弹出
  162.                     shade: 0.1,
  163.                     maxmin: true,
  164.                     // shadeClose: true,
  165.                     area: ['60%', '520px'],
  166.                     content: '../page/table/TbLineUpAdd.aspx',
  167.                     success: function (layero, index) {
  168.                         layer.setTop(layero);
  169.                     }
  170.                 });
  171.                 $(window).on("resize", function () {
  172.                     layer.full(index);
  173.                 });
  174.             } else if (obj.event === 'delete') {  // 监听删除操作
  175.                 var checkStatus = table.checkStatus('currentTableId');
  176.                 var dataarray = checkStatus.data;
  177.                 var ids = "0";
  178.                 for (var i = 0; i < dataarray.length; i++) {
  179.                     ids += "," + dataarray[i].ID;
  180.                 }
  181.                 ids += ",0";
  182.                 layer.confirm('确定删除该记录吗？一旦删除不能恢复!', { icon: 3, title: '提示' }, function (index) {
  183.                     $.ajax({
  184.                         url: '../Ajax.ashx', //要请求的url地址
  185.                         type: 'POST', //请求方法 GET or POST
  186.                         async: true, //是否使用异步请求的方式
  187.                         timeout: 5000, //请求超时的时间，以毫秒计
  188.                         data: {
  189.                             rnum: 10,
  190.                             ids: ids
  191.                         },
  192.                         dataType: 'json',
  193.                         success: function (data) {
  194.                             console.log(obj);
  195.  
  196.                             layer.alert("删除成功");
  197.                             table.reload('currentTableId', {})
  198.  
  199.                         }
  200.                     });
  201.                 });
  202.  
  203.             } else if (obj.event === 'edit') {
  204.                 var checkStatus = table.checkStatus('currentTableId');
  205.                 var dataarray = checkStatus.data;
  206.                 console.log(dataarray);
  207.                 if (dataarray.length > 0) {
  208.                     layer.open({
  209.                         type: 2 //此处以iframe举例
  210.                         , title: '编辑用户'
  211.                         , area: ['60%', '520px']
  212.                         , shade: 0.1
  213.                         , maxmin: true
  214.                         , id: 'LAY_layuipro' //设定一个id，防止重复弹出
  215.                         , content: '../page/table/TbLineUpEdit.aspx'
  216.                         , zIndex: layer.zIndex
  217.                         , success: function (layero, index) {
  218.                             var item = dataarray[0];
  219.                             var body = layer.getChildFrame('body', index);
  220.                             console.log(o);
  221.                             body.find("[name='rid']").val(item.ID);
  222.                             body.find("[name='CustName']").val(item.CustName);
  223.                             body.find("input[name='CustIDCard']").val(item.CustIDCard);
  224.                             console.log(item.BuType);
  225.                             console.log(body.find("input[name='BuType'][value='2']"));
  226.                             if (item.BuType == "1") {
  227.  
  228.                                 body.find("input[name='BuType'][value='1']").prop("checked", true);
  229.                             }
  230.                             else {
  231.  
  232.                                 $(body).find("input[name='BuType'][value='2']").prop("checked", true);
  233.                             }
  234.                             body.find("[name='CustTel']").val(item.CustTel);
  235.                             body.find("[name='Memo']").val(item.Memo);
  236.                             layer.setTop(layero);
  237.  
  238.                             //关键点：父窗口调用子页面的getformobj函数，返回子页面的form对象，然后重绘子页面的数据。
  239.                             var iframeWin = window[layero.find('iframe')[0]['name']];
  240.                             var o = iframeWin.getformobj();
  241.                             o.render();
  242.  
  243.  
  244.                         }
  245.                     });
  246.  
  247.                 }
  248.                 else {
  249.                     layer.msg('请先勾选一条要编辑的数据');
  250.                 }
  251.             } else if (obj.event === 'showdetail') {
  252.                 var checkStatus = table.checkStatus('currentTableId');
  253.                 var dataarray = checkStatus.data;
  254.                 if (dataarray.length > 0) {
  255.                     layer.open({
  256.                         type: 2 
  257.                         , title: '查看用户'
  258.                         , area: ['50%', '520px']
  259.                         , shade: 0.1
  260.                         , maxmin: true
  261.                         , id: 'layuiproview' //设定一个id，防止重复弹出
  262.                         , content: '../page/table/TbLineUpView.aspx'
  263.                         , zIndex: layer.zIndex
  264.                         , success: function (layero, index) {
  265.                             var item = dataarray[0];
  266.                             var body = layer.getChildFrame('body', index);
  267.                             console.log(item);
  268.                             body.find("[name='rid']").val(item.ID);
  269.                             body.find("[name='CustName']").val(item.CustName);
  270.                             body.find("input[name='CustIDCard']").val(item.CustIDCard);
  271.                             body.find("input[name='CreateTime']").val(item.CreateTime);
  272.                             body.find("input[name='CallTime']").val(item.CallTime);
  273.                             body.find("input[name='FinishTime']").val(item.FinishTime);
  274.                             body.find("input[name='OptName']").val(item.OptName);
  275.                             body.find("input[name='LineNum']").val(item.LineNum);
  276.                             body.find("input[name='WindowNum']").val(item.WindowNum);
  277.                            
  278.                             if (item.BuType == "1") {
  279.                                 body.find("input[name='BuType'][value='1']").prop("checked", true);
  280.                             }
  281.                             else {
  282.                                 $(body).find("input[name='BuType'][value='2']").prop("checked", true);
  283.                             }
  284.                             body.find("[name='CustTel']").val(item.CustTel);
  285.                             body.find("[name='Memo']").val(item.Memo);
  286.                             layer.setTop(layero);
  287.                             //关键点：父窗口调用子页面的getformobj函数，返回子页面的form对象，然后重绘子页面的数据。
  288.                             var iframeWin = window[layero.find('iframe')[0]['name']];
  289.                             var o = iframeWin.getformobj();
  290.                             o.render();
  291.                         }
  292.                     });
  293.  
  294.                 }
  295.                 else {
  296.                     layer.msg('请先勾选一条要编辑的数据');
  297.                 }
  298.             }
  299.  
  300.  
  301.         });
  302.         //监听单元格编辑
  303.         table.on('edit(currentTableFilter)', function (obj) {
  304.             var v = obj.value; //得到修改后的值
  305.             var data = obj.data;//得到所在行所有键值
  306.             var CurrentField = obj.field; //修改的字段
  307.             $.ajax({
  308.                 url: '../Ajax.ashx', //要请求的url地址
  309.                 type: 'POST', //请求方法 GET or POST
  310.                 async: true, //是否使用异步请求的方式
  311.                 timeout: 5000, //请求超时的时间，以毫秒计
  312.                 data: {
  313.                     rnum: "11",
  314.                     id:data.ID,
  315.                     value:v,
  316.                     Field:CurrentField
  317.                 },
  318.                 dataType: 'json', //预期的服务器返回参数类型
  319.                 beforeSend: function () {
  320.  
  321.                 },
  322.                 success: function (data) {
  323.                     layer.msg("修改成功");
  324.                 },
  325.                 error: function () {
  326.  
  327.                 },
  328.                 complete: function () {
  329.  
  330.                 }
  331.             });
  332.            
  333.         });
  334.  
  335.         //监听表格复选框选择
  336.         table.on('checkbox(currentTableFilter)', function (obj) {
  337.             //console.log(obj)
  338.         });
  339.         function getWindowVoice()
  340.         {  // 获取浏览器中语音 (中文 + 本地服务)
  341.             return window.speechSynthesis.getVoices().find(item => item.localService && item.lang === 'zh-CN');
  342.         }
  343.         table.on('tool(currentTableFilter)', function (obj) {
  344.             var data = obj.data;
  345.             if (obj.event === 'classnum') {
  346.                 const synth = window.speechSynthesis
  347.                 const message = new SpeechSynthesisUtterance();
  348.  
  349.                 function voice_playback(text) {
  350.                     message.text = text;
  351.                     message.lang = 'zh';
  352.                     message.volume = 1;     // 声音音量：1
  353.                     message.rate = 1;       // 语速：1
  354.                     message.pitch = 1;       // 音高：1
  355.                     message.voice = getWindowVoice();  // 使用本地服务合成语音(若是获取不到 请异步获取, 加一个setTimeout)
  356.                     //synth.cancel(message);
  357.                     window.speechSynthesis.cancel();
  358.                     synth.speak(message)
  359.                 }
  360.                 /*
  361.                  * text – 要合成的文字内容，字符串
  362.                  * lang – 使用的语言，字符串， 例如：“zh-cn”
  363.                  * voiceURI – 指定希望使用的声音和服务，字符串
  364.                  * volume – 声音的音量，区间范围是0到1，默认是1
  365.                  * rate – 语速，数值，默认值是1，范围是0.1到10，表示语速的倍数，例如2表示正常语速的两倍。
  366.                  * pitch – 表示说话的音高，数值，范围从0（最小）到2（最大）。默认值为1
  367.                  */
  368.  
  369.                 var s = "请" + obj.data.LineNum + "号顾客" + obj.data.CustName + "到" + obj.data.WindowNumStr + "号窗口办理业务";
  370.  
  371.               
  372.                 voice_playback(s);
  373.                 setstatus("4", obj.data.ID, obj.tr);
  374.                 
  375.                 return false;
  376.             } else if (obj.event === 'classfinish') {
  377.                 setstatus("5", obj.data.ID, obj.tr);
  378.                 return false;
  379.             } else if (obj.event === 'classovertime') {
  380.                 setstatus("6", obj.data.ID, obj.tr);
  381.  
  382.                 return false;
  383.             }
  384.             else if (obj.event === 'setMemo') {
  385.                 layer.prompt({
  386.                     formType: 2
  387.                     , title: '修改用户【' + data.CustName + '】的备注'
  388.                     , value: data.Memo
  389.                 }, function (value, index) {
  390.                     layer.close(index);
  391.                     $.ajax({
  392.                         url: '../Ajax.ashx', //要请求的url地址
  393.                         type: 'POST', //请求方法 GET or POST
  394.                         async: true, //是否使用异步请求的方式
  395.                         timeout: 5000, //请求超时的时间，以毫秒计
  396.                         data: {
  397.                             rnum:"7",
  398.                             id: obj.data.ID,
  399.                             memo: value
  400.                         },
  401.                         dataType: 'json', //预期的服务器返回参数类型
  402.                         beforeSend: function () {
  403.  
  404.                         },
  405.                         success: function (data) {
  406.                             //console.log(data);
  407.                             //同步更新表格中缓存对应的值
  408.                             obj.update({
  409.                                 Memo: value
  410.                             });
  411.                         },
  412.                         error: function () {
  413.  
  414.                         },
  415.                         complete: function () {
  416.                             
  417.                         }
  418.                     });
  419.  
  420.  
  421.                    
  422.                    
  423.                 });
  424.             }
  425.             else if (obj.event === 'showview') {
  426.                 layer.open({
  427.                     type: 2
  428.                     , title: '查看用户'
  429.                     , area: ['50%', '520px']
  430.                     , shade: 0.1
  431.                     , maxmin: true
  432.                     , id: 'layuiproview' //设定一个id，防止重复弹出
  433.                     , content: '../page/table/TbLineUpView.aspx'
  434.                     , zIndex: layer.zIndex
  435.                     , success: function (layero, index) {
  436.                         var item = obj.data;
  437.                         var body = layer.getChildFrame('body', index);
  438.                       
  439.                         body.find("[name='rid']").val(item.ID);
  440.                         body.find("[name='CustName']").val(item.CustName);
  441.                         body.find("input[name='CustIDCard']").val(item.CustIDCard);
  442.                         body.find("input[name='CreateTime']").val(item.CreateTime);
  443.                         body.find("input[name='CallTime']").val(item.CallTime);
  444.                         body.find("input[name='FinishTime']").val(item.FinishTime);
  445.                         body.find("input[name='OptName']").val(item.OptName);
  446.                         body.find("input[name='LineNum']").val(item.LineNum);
  447.                         body.find("input[name='WindowNum']").val(item.WindowNum);                        
  448.                         if (item.BuType == "1") {
  449.                             body.find("input[name='BuType'][value='1']").prop("checked", true);
  450.                         }
  451.                         else {
  452.                             $(body).find("input[name='BuType'][value='2']").prop("checked", true);
  453.                         }
  454.                         body.find("[name='CustTel']").val(item.CustTel);
  455.                         body.find("[name='Memo']").val(item.Memo);
  456.                         layer.setTop(layero);
  457.                         //关键点：父窗口调用子页面的getformobj函数，返回子页面的form对象，然后重绘子页面的数据。
  458.                         var iframeWin = window[layero.find('iframe')[0]['name']];
  459.                         var o = iframeWin.getformobj();
  460.                         o.render();
  461.                     }
  462.                 });
  463.             }
  464.         });
  465.  
  466.         function setstatus(currentrnum,currentid,objtr) {
  467.             $.ajax({
  468.                 url: '../Ajax.ashx', //要请求的url地址
  469.                 type: 'POST', //请求方法 GET or POST
  470.                 async: true, //是否使用异步请求的方式
  471.                 timeout: 5000, //请求超时的时间，以毫秒计
  472.                 data: {
  473.                     rnum: currentrnum,
  474.                     id: currentid
  475.                 },
  476.                 dataType: 'json', //预期的服务器返回参数类型
  477.                 beforeSend: function () {
  478.  
  479.                 },
  480.                 success: function (data) {
  481.                     //console.log(data);
  482.                     switch (currentrnum) {
  483.                         case "4": $(objtr).css({ "background-color": "red", "color": "#fff" });  $(objtr).find("td[data-field='BuStatusStr']").find("div").text("办理中"); break;
  484.                         case "5": $(objtr).css({ "background-color": "#3cb371", "color": "#fff" });$(objtr).find("td[data-field='BuStatusStr']").find("div").text("已完成"); break;
  485.                         case "6": $(objtr).css({ "background-color": "#ccc", "color": "#fff" }); $(objtr).find("td[data-field='BuStatusStr']").find("div").text("已过期"); break;
  486.  
  487.                     }  
  488.                 },
  489.                 error: function () {
  490.  
  491.                 },
  492.                 complete: function () {
  493.  
  494.                 }
  495.             });
  496.         }
  497.  
  498.     });
  499. </script>
  500.     
  501. </body>
  502. </html>

技术咨询Q：1416759661 

 

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/代码探险家/article/detail/992612
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号