123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172 |
- {extend name="public/layout" /} {block name="title"}素材库{/block} {block name="body"}
- <style type="text/css">
- html,
- body {
- display: block;
- width: 100%;
- background-color: #fff;
- }
- .layui-icon {
- font-size: 20px !important;
- line-height: 38px;
- }
- .layui-table-view .layui-table th,
- .layui-table-view .layui-table td {
- text-align: center;
- border-color: #B6CADE;
- }
- .upload-img .area i {
- font-size: 50px;
- color: #009688;
- }
- .evi-block {
- float: left;
- margin-right: 10px;
- }
- /*///*/
- .addImages {
- display: inline-block;
- width: 140px;
- height: 125px;
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- border: 1px dashed darkgray;
- background: #f8f8f8;
- position: relative;
- overflow: hidden;
- }
- .text-detail {
- margin-top: 40px;
- text-align: center;
- }
- .text-detail>span {
- font-size: 40px;
- }
- .imageDiv div {
- width: 100%;
- height: 100%;
- position: absolute;
- top: 0px;
- background-color: #e6e6e600;
- }
- .imageDiv div i {
- display: none;
- font-size: 31px;
- position: absolute;
- top: 37%;
- left: 40%;
- }
- .imageDiv div:hover {
- background-color: #e6e6e680;
- }
- .imageDiv div:hover i {
- display: block;
- cursor: pointer;
- }
- .layui-card-header p a:hover {
- text-decoration-line: underline;
- }
- </style>
- <body>
- <div class="layui-fluid">
- <div class="layui-card">
- <div class="layui-card-header ">
- <p><a href="../../static/话术导入模板.xlsx" download><span style="float:right;">下载信息模版</span></a></p>
- </div>
- <div class="layui-card-body">
- <form enctype="multipart/form-data" action="" method="post" class="layui-form">
- <p style="color:red"><span style="margin-left:50px;">注意:若未按照规范,则可能造成导入失败</span></p>
- <div class="layui-upload">
- <div class="picDiv" style="margin: 20px">
- <div class="addImages" id="excelfile" style="cursor: pointer;margin-left: 30px;">
- <div class="text-detail">
- <span>+</span>
- <p>支持 xlsx、xls 格式</p>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-form-item ">
- <button type="button" class="layui-btn" id="uploadbtn" style="float:right">开始上传</button>
- </div>
- </form>
- </div>
- </div>
- <div id="loadings" hidden><span style="color:black;margin: 43%;">上传中请稍后...</span></div>
- </div>
- </body>
- {/block} {block name="js"}
- <script type="text/javascript" src="__STATIC__/js/plupload/js/plupload.full.min.js"></script>
- <script>
- layui.config({
- base: '__LAYUI__/' //静态资源所在路径
- ,
- urlbase: '/sys'
- }).extend({
- index: 'lib/index' //主入口模块
- }).use(['index', 'table', 'layedit', 'element', 'upload'], function () {
- var $ = layui.$,
- loading,
- upload = layui.upload;
- upload.render({
- elem: '#excelfile'
- , url: '{:url("talkskill/importing")}'//控制器的路径
- , accept: 'file'
- , auto: false
- , bindAction: '#uploadbtn'//一起绑定事件的按钮
- , exts: 'xls|excel|xlsx'
- , done: function (res) {
- // console.log(res);
- // return false;
- if (res.code === 0) {
- layer.alert("导入成功", { icon: 6 }, function () {
- var index = parent.layer.getFrameIndex(window.name);
- parent.layui.table.reload('label-table'); //重载表格
- parent.layer.close(index); //再执行关闭
- });
- // setTimeout(function () {
- // location.reload();
- // }, 1000);
- } else {
- layer.alert("导入失败", { icon: 5 });
- }
- $('#loadings').hide();
- layer.close(loading);
- }
- , before: function () {
- $('#loadings').show();
- loading = layer.load(2, {
- area:['50px','40px'],
- shade: [0.3, '#999'] //0.1透明度的白色背景
- });
- }
- ,error:function(){
- $('#loadings').hide();
- layer.close(loading);
- }
- });
- });
- </script>
- {/block}
|