inperson.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289
  1. <!DOCTYPE html>
  2. <html>
  3. <head lang='zh'>
  4. <meta charset='utf-8'>
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6. <meta name="renderer" content="webkit" />
  7. <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=0" />
  8. <title>Luckysheet</title>
  9. <link rel='stylesheet' href='/static/js/luckysheet/plugins/css/pluginsCss.css' />
  10. <link rel='stylesheet' href='/static/js/luckysheet/plugins/plugins.css' />
  11. <link rel='stylesheet' href='/static/js/luckysheet/css/luckysheet.css' />
  12. <link rel='stylesheet' href='/static/js/luckysheet/assets/iconfont/iconfont.css' />
  13. <link charset="utf-8" rel="stylesheet" href="/static/css/layui.css?v=1.0.0">
  14. <script>
  15. var _PageHeight = document.documentElement.clientHeight,
  16. _PageWidth = document.documentElement.clientWidth;
  17. var _LoadingTop = _PageHeight > 61 ? (_PageHeight - 61) / 2 : 0,
  18. _LoadingLeft = _PageWidth > 215 ? (_PageWidth - 215) / 2 : 0;
  19. var _LoadingHtml = '<div id="loadingDiv" style="position:absolute;left:0;width:100%;height:' + _PageHeight + 'px;top:0;background:#f3f8ff;opacity:1;filter:alpha(opacity=80);z-index:10000;"><div style="position: absolute; cursor1: wait; left: ' + _LoadingLeft + 'px; top:' + _LoadingTop + 'px; width: auto; height: 57px; line-height: 57px; padding-left: 50px; padding-right: 5px; color: #696969; font-family:\'Microsoft YaHei\';"><img style="width:200px;height:200px" src="../images/loading.gif"></div></div>';
  20. document.write(_LoadingHtml);
  21. document.onreadystatechange = completeLoading;
  22. function completeLoading() {
  23. if (document.readyState == "complete") {
  24. var loadingMask = document.getElementById('loadingDiv');
  25. loadingMask.parentNode.removeChild(loadingMask);
  26. }
  27. }
  28. </script>
  29. <script src="/static/js/layui.js?v=1.0.0"></script>
  30. <script src="/static/js/exceljs.js"></script>
  31. <script src="/static/js/fileSave.js"></script>
  32. <script src="/static/js/luckysheet/luckSheetExcel.js"></script>
  33. <script src="/static/js/luckysheet/plugins/js/plugin.js"></script>
  34. <script src="/static/js/luckysheet/luckysheet.umd.js"></script>
  35. <script src="/static/js/api.config.js"></script>
  36. <script src="/static/js/util.js?v=1.0.0"></script>
  37. <script src="/static/js/url.js?v=1.0.0"></script>
  38. <script src="/static/js/exportExcel.js"></script>
  39. <script src="/static/js/fullScreen.js"></script>
  40. </head>
  41. <style>
  42. * {
  43. padding: 0;
  44. margin: 0;
  45. }
  46. html,
  47. body {
  48. height: 100%;
  49. }
  50. #monthSelect {
  51. padding: 10px 0px;
  52. }
  53. </style>
  54. <body style="background: #fff;">
  55. <!-- <div class="layui-inline" id="monthSelect">
  56. <label class="layui-form-label">控制权限</label>
  57. <div class="layui-input-inline">
  58. <form class="layui-form mc-work-form">
  59. <select name="city" lay-filter="powerFlag" id="powerFlag">
  60. <option value="0">开启</option>
  61. <option value="1">关闭</option>
  62. </select>
  63. </form>
  64. </div>
  65. </div> -->
  66. <div style="height:90%;width: 100%;">
  67. <div id="luckysheet" style="width:100%;height:100%">
  68. </div>
  69. </div>
  70. <script>
  71. //监听window是否全屏,并进行相应的操作,支持esc键退出
  72. window.onresize = function () {
  73. var isFull = !!(document.webkitIsFullScreen || document.mozFullScreen ||
  74. document.msFullscreenElement || document.fullscreenElement
  75. );//!document.webkitIsFullScreen都为true。因此用!!
  76. if (isFull == false) {
  77. $("#exitFullScreen").css("display", "none");
  78. $("#fullScreen").css("display", "");
  79. } else {
  80. $("#exitFullScreen").css("display", "");
  81. $("#fullScreen").css("display", "none");
  82. }
  83. }
  84. </script>
  85. <script>
  86. var id = '' // 模板id 查看/修改load时候用
  87. var powerFlag = '0'; // 权限控制 0 开启 1关闭
  88. var excelId = '';
  89. var tempType = '0'; // 模板类型 0-年度预算 1-季度预算 2-月度预算 3-部门预算采购项目管理
  90. var flag = false; // 控制excel是否可以编辑
  91. var userId; // 用户ID
  92. var titname = '人员工位'; // 用户ID
  93. $(function () {
  94. userId = JSON.parse(window.top.sessionStorage.userInfo).loginNo
  95. })
  96. layui.use(['laydate', 'form'], function () {
  97. var laydate = layui.laydate;
  98. var form = layui.form;
  99. form.on('select(powerFlag)', function (data) {
  100. powerFlag = data.value
  101. })
  102. // 获取数据
  103. function getData() {
  104. // 先销毁excel重新加载
  105. if (window.luckysheet) {
  106. window.luckysheet.destroy();
  107. }
  108. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  109. var r = window.top.location.href.split('id=')[1];
  110. var url = '/market/cWorkStation/load';
  111. util.ajaxJson("数据加载中", ctx + url, {
  112. "id": r ? r : '',
  113. }, function (res) {
  114. if (res.result == 0) {
  115. // 查看和修改时 下拉框赋值
  116. if(res.body[0]){
  117. if(res.body[0].config.authority){
  118. getData()
  119. }
  120. powerFlag = res.body[0].powerFlag
  121. $('#powerFlag').val(res.body[0].powerFlag)
  122. tempType = res.body[0].tempType
  123. $('#excelPosition').val(res.body[0].colHeaderNum)
  124. $('#tempType').val(res.body[0].tempType)
  125. form.render();
  126. excelId = res.body[0].id;
  127. titname = res.body[0].title;
  128. // res.body[0].calcChain = [];
  129. initExcel(res.body)
  130. }else{
  131. // getData()
  132. }
  133. }
  134. });
  135. initExcel()
  136. }
  137. // 表格初始化
  138. function initExcel(data) {
  139. // if(powerFlag == '1'){
  140. // flag = false
  141. // }else{
  142. // flag = true
  143. // }
  144. flag = false
  145. try {
  146. luckysheet.create({
  147. container: 'luckysheet',
  148. data: data,
  149. showsheetbar: false, // 底部sheet显示/隐藏
  150. showstatisticBar: false, // 底部计数
  151. showtoolbar:false,
  152. showinfobar: true, // 顶部信息 文件名称 按钮
  153. allowUpdate: false, // 是否允许操作表格后的后台更新 在线文档websocket时为true
  154. allowEdit: flag, // 是否允许前台编辑
  155. column: 12,
  156. title: titname, // 文件名称
  157. row: 10,
  158. lang: 'zh',
  159. showstatisticBar: false, // 底部计数
  160. showstatisticBarConfig: {
  161. count: false, // 计数栏
  162. view: false, // 打印视图
  163. zoom: false, // 缩放
  164. },
  165. functionButton: '<input id="imports" type="file" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;"></input><button id="saves" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;">保存</button><button id="exports" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;">导出</button><button id="fullScreen" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;">全屏显示</button><button id="exitFullScreen" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;display:none">退出全屏</button>',
  166. cellRightClickConfig: {
  167. copy: false, // 复制
  168. copyAs: false, // 复制为
  169. paste: false, // 粘贴
  170. insertRow: true, // 插入行
  171. insertColumn: true, // 插入列
  172. deleteRow: true, // 删除选中行
  173. deleteColumn: true, // 删除选中列
  174. deleteCell: false, // 删除单元格
  175. hideRow: false, // 隐藏选中行和显示选中行
  176. hideColumn: false, // 隐藏选中列和显示选中列
  177. rowHeight: true, // 行高
  178. columnWidth: true, // 列宽
  179. clear: false, // 清除内容
  180. matrix: false, // 矩阵操作选区
  181. sort: false, // 排序选区
  182. filter: false, // 筛选选区
  183. chart: false, // 图表生成
  184. image: false, // 插入图片
  185. link: false, // 插入链接
  186. data: false, // 数据验证
  187. cellFormat: false, // 设置单元格格式
  188. mComplete: false,
  189. mCetup: false,
  190. mRevoke: false
  191. },
  192. })
  193. } catch (err) {
  194. console.log(err)
  195. }
  196. initHandel()
  197. }
  198. // 绑定按钮事件
  199. function initHandel() {
  200. $("#fullScreen").on("click", function () {
  201. fullScreen();
  202. })
  203. //退出全屏
  204. $("#exitFullScreen").on("click", function () {
  205. exitFullscreen();
  206. })
  207. // 返回
  208. $('#goBack').off('click').click(function () {
  209. window.top.$vm.$router.push('/budgetList')
  210. })
  211. // 保存
  212. $('#saves').off("click").click(function () {
  213. // 当前工作表名
  214. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  215. var r = window.top.location.href.split('id=')[1];
  216. var sheetName = luckysheet.getSheet().name
  217. var data = luckysheet.getSheet(sheetName)
  218. data.id = r ? r : excelId
  219. data.fileName = luckysheet.getWorkbookName()
  220. data.powerFlag = powerFlag
  221. data.powerFlagDev = powerFlag == '0' ? '开' : '关'
  222. data.tempType = tempType
  223. data.colHeaderNum = 1
  224. data.tempTypeDesc = ''
  225. data.title = luckysheet.getWorkbookName()
  226. var urlsave = ''
  227. r?urlsave = '/market/cWorkStation/save':urlsave = '/market/cWorkStation/save'
  228. util.ajaxJson("正在加载中", ctx + urlsave, {
  229. data: data
  230. }, function (data) {
  231. getData()
  232. });
  233. })
  234. // 导出
  235. $('#exports').click(function () {
  236. exportExcel(luckysheet.getluckysheetfile(), 'excel')
  237. })
  238. // 导入
  239. $("#imports").change(function (evt) {
  240. var files = evt.target.files;
  241. if (files == null || files.length == 0) {
  242. window.top.$vm.$message({
  243. message: '没有文件导入',
  244. type: 'info'
  245. })
  246. return;
  247. }
  248. var name = files[0].name;
  249. var suffixArr = name.split("."),
  250. suffix = suffixArr[suffixArr.length - 1];
  251. if (suffix != "xlsx") {
  252. window.top.$vm.$message({
  253. message: '目前只支持xlsx文件的导入',
  254. type: 'info'
  255. })
  256. return;
  257. }
  258. // 解析文件
  259. LuckyExcel.transformExcelToLucky(
  260. files[0],
  261. function (exportJson, luckysheetfile) {
  262. if (exportJson.sheets == null || exportJson.sheets.length == 0) {
  263. window.top.$vm.$message({
  264. message: '无法读取excel文件的内容,当前不支持xls文件',
  265. type: 'info'
  266. })
  267. return;
  268. }
  269. // 销毁原来的excel
  270. window.luckysheet.destroy();
  271. // 重新加载
  272. initExcel([exportJson.sheets[0]])
  273. // 绑定按钮事件
  274. initHandel()
  275. }
  276. );
  277. });
  278. }
  279. getData()
  280. })
  281. </script>
  282. </body>
  283. </html>