excel.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430
  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/plugins/js/plugin.js"></script>
  33. <script src="/static/js/luckysheet/luckysheet.umd.js"></script>
  34. <script src="/static/js/api.config.js"></script>
  35. <script src="/static/js/util.js?v=1.0.0"></script>
  36. <script src="/static/js/url.js?v=1.0.0"></script>
  37. </head>
  38. <style>
  39. * {
  40. padding: 0;
  41. margin: 0;
  42. }
  43. html,
  44. body {
  45. height: 100%;
  46. }
  47. </style>
  48. <body>
  49. <div class="layui-inline" id="monthSelect">
  50. <label class="layui-form-label">请选择月份</label>
  51. <div class="layui-input-inline">
  52. <input type="text" class="layui-input" id="year" placeholder="请选择月份">
  53. </div>
  54. </div>
  55. <div style="display: flex;height: 93%;width: 100%;" id="excelBox">
  56. <div id="luckysheet" style="width:50%;height:100%">
  57. </div>
  58. <div style="width:50%;height:100%">
  59. <iframe src="./text.html" id="complete" height="100%" width="100%" frameborder="0"></iframe>
  60. </div>
  61. </div>
  62. <script>
  63. //2021.11.19
  64. var managerLevel = JSON.parse(window.sessionStorage.userInfo).managerLevel
  65. window.onload = function(){
  66. if(managerLevel <= '1'){
  67. $('#saves').hide()
  68. $('#updates').hide()
  69. }
  70. }
  71. var date = new Date();
  72. var month = date.getMonth()
  73. if (month >= 1 && month <= 9) {
  74. month = "0" + (month + 1);
  75. }
  76. var nowDate = date.getFullYear() + '-' + month
  77. $(function () {
  78. getData(nowDate)
  79. })
  80. layui.use(['laydate', 'form'], function () {
  81. var laydate = layui.laydate;
  82. var form = layui.form;
  83. var htmlStr = ''
  84. laydate.render({
  85. elem: '#year'
  86. , value: nowDate
  87. , type: 'month', done: function (value, date, endDate) {
  88. $('#complete')[0].contentWindow.postMessage({
  89. module: "aaa",
  90. month: value
  91. }, 'http://10.230.26.15:8000');
  92. nowDate = value
  93. getData(value)
  94. }
  95. });
  96. })
  97. var flag = false
  98. var excelData;
  99. function getData(nowDate) {
  100. window.luckysheet.destroy();
  101. util.ajaxJson("", ctx + '/market/keywork/load', {
  102. "id": '',
  103. "opMonth": nowDate,
  104. "sts": '0'
  105. }, function (res) {
  106. if (res.result == 0) {
  107. if (res.body[0].config.authority) {
  108. res.body[0].config.authority = {}
  109. }
  110. initExcel(res.body)
  111. excelData = res.body
  112. }
  113. });
  114. }
  115. var datas = [
  116. {
  117. "position": {
  118. "column": [
  119. 2,
  120. 4
  121. ],
  122. "row": [
  123. 1,
  124. 6
  125. ]
  126. },
  127. "id": null,
  128. "name": "11",
  129. "color": "",
  130. "status": "1",
  131. "order": "0",
  132. "opMonth": null,
  133. "data": [
  134. [
  135. null,
  136. null,
  137. null,
  138. null,
  139. null,
  140. null,
  141. null,
  142. null,
  143. null,
  144. null,
  145. null,
  146. null
  147. ],
  148. [
  149. null,
  150. null,
  151. {
  152. "m": null,
  153. "ct": null,
  154. "v": null,
  155. "bl": null,
  156. "fs": null,
  157. "ff": null,
  158. "bg": "#00ff00",
  159. "fc": null,
  160. "un": null,
  161. "it": null,
  162. "ht": null
  163. },
  164. null,
  165. {
  166. "m": null,
  167. "ct": null,
  168. "v": null,
  169. "bl": null,
  170. "fs": null,
  171. "ff": null,
  172. "bg": "#00ff00",
  173. "fc": null,
  174. "un": null,
  175. "it": null,
  176. "ht": null
  177. },
  178. null,
  179. null,
  180. null,
  181. null,
  182. null,
  183. null,
  184. null
  185. ],
  186. [
  187. null,
  188. null,
  189. null,
  190. null,
  191. null,
  192. null,
  193. null,
  194. null,
  195. null,
  196. null,
  197. null,
  198. null
  199. ],
  200. [
  201. null,
  202. null,
  203. null,
  204. null,
  205. null,
  206. null,
  207. null,
  208. null,
  209. null,
  210. null,
  211. null,
  212. null
  213. ],
  214. [
  215. null,
  216. null,
  217. null,
  218. null,
  219. null,
  220. null,
  221. null,
  222. null,
  223. null,
  224. null,
  225. null,
  226. null
  227. ]
  228. ],
  229. "config": {
  230. "rowlen": null,
  231. "customHeight": null,
  232. "merge": null,
  233. "authority": {
  234. selectLockedCells: 1, //选定锁定单元格
  235. selectunLockedCells: 0, //选定解除锁定的单元格
  236. formatCells: 0, //设置单元格格式
  237. formatColumns: 0, //设置列格式
  238. formatRows: 0, //设置行格式
  239. insertColumns: 0, //插入列
  240. insertRows: 0, //插入行
  241. insertHyperlinks: 0, //插入超链接
  242. deleteColumns: 0, //删除列
  243. deleteRows: 0, //删除行
  244. sort: 0, //排序
  245. filter: 0, //使用自动筛选
  246. usePivotTablereports: 0, //使用数据透视表和报表
  247. editObjects: 0, //编辑对象
  248. editScenarios: 0, //编辑方案
  249. hintText: "当前工作表正在编辑中",
  250. sheet: 1
  251. }
  252. }
  253. }
  254. ]
  255. function initExcel(data) {
  256. try {
  257. luckysheet.create({
  258. container: 'luckysheet',
  259. mComplete: function () {
  260. // 选取范围坐标
  261. var position = luckysheet.getRange()[0]
  262. // 当前表所有数据
  263. for (var i = position.row[0]; i <= position.row[1]; i++) {
  264. for (var j = position.column[0]; j <= position.column[1]; j++) {
  265. if (JSON.stringify(luckysheet.getSheet().data[i][j]) != '{}' && JSON.stringify(luckysheet.getSheet().data[i][j]) != 'null') {
  266. console.log(luckysheet.getSheet().data[i][j])
  267. luckysheet.setCellValue(i, j, { bg: "#00ff00" })
  268. luckysheet.setCellValue(i, j, { bg: "#00ff00" })
  269. excelData[0].data[i][j].complete = '1'
  270. excelData[0].data[i][j].revoke = '2'
  271. }
  272. }
  273. }
  274. },
  275. mSetup: function () {
  276. // 选取范围坐标
  277. var position = luckysheet.getRange()[0]
  278. // 当前表所有数据
  279. for (var i = position.row[0]; i <= position.row[1]; i++) {
  280. for (var j = position.column[0]; j <= position.column[1]; j++) {
  281. excelData[0].data[i][j].setup = '1'
  282. }
  283. }
  284. },
  285. mRevoke: function () {
  286. // 选取范围坐标
  287. var position = luckysheet.getRange()[0]
  288. // 当前表所有数据
  289. for (var i = position.row[0]; i <= position.row[1]; i++) {
  290. for (var j = position.column[0]; j <= position.column[1]; j++) {
  291. if (JSON.stringify(luckysheet.getSheet().data[i][j]) != '{}' && luckysheet.getSheet().data[i][j].m) {
  292. luckysheet.setCellValue(i, j, { bg: "" })
  293. luckysheet.setCellValue(i, j, { bg: "" })
  294. excelData[0].data[i][j].bg = ''
  295. excelData[0].data[i][j].revoke = '1'
  296. }
  297. }
  298. }
  299. },
  300. data: data,
  301. title: data[0].fileName || '默认模板',
  302. showsheetbar: false, // 底部sheet显示/隐藏
  303. showstatisticBar: false, // 底部计数
  304. myFolderUrl: false,
  305. showinfobar: true,
  306. allowUpdate: false,
  307. allowEdit: flag, // 是否允许前台编辑
  308. column: 12,
  309. row: 10,
  310. lang: 'zh',
  311. showstatisticBar: false, // 底部计数
  312. myFolderUrl: false,
  313. showstatisticBarConfig: {
  314. count: false, // 计数栏
  315. view: false, // 打印视图
  316. zoom: false, // 缩放
  317. },
  318. // 2021.11.19
  319. enableAddRow: managerLevel <= '1' ? false : true, //允许添加行(表格底部添加按钮)
  320. showinfobar: true,
  321. functionButton: '<button id="updates" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;">开启编辑</button> <button id="saves" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;display:none">保存</button>',
  322. cellRightClickConfig: {
  323. copy: true, // 复制
  324. copyAs: false, // 复制为
  325. paste: true, // 粘贴
  326. insertRow: true, // 插入行
  327. insertColumn: true, // 插入列
  328. deleteRow: true, // 删除选中行
  329. deleteColumn: true, // 删除选中列
  330. deleteCell: false, // 删除单元格
  331. hideRow: false, // 隐藏选中行和显示选中行
  332. hideColumn: false, // 隐藏选中列和显示选中列
  333. rowHeight: false, // 行高
  334. columnWidth: false, // 列宽
  335. clear: false, // 清除内容
  336. matrix: false, // 矩阵操作选区
  337. sort: false, // 排序选区
  338. filter: false, // 筛选选区
  339. chart: false, // 图表生成
  340. image: false, // 插入图片
  341. link: false, // 插入链接
  342. data: false, // 数据验证
  343. cellFormat: false, // 设置单元格格式
  344. mComplete: true,
  345. mSetup: true,
  346. mRevoke: true
  347. },
  348. hook: {
  349. cellMousedown: function (a, b, c) {
  350. //2021.11.19
  351. if(managerLevel <= '1' ){
  352. window.top.$vm.$message({
  353. message: '您没有编辑权限',
  354. type: 'info'
  355. })
  356. }else
  357. if (flag == false) {
  358. window.top.$vm.$message({
  359. message: '请先点击开启编辑按钮',
  360. type: 'info'
  361. })
  362. }
  363. },//绑定鼠标事件
  364. },
  365. })
  366. } catch (err) {
  367. console.log(err)
  368. }
  369. if (flag) {
  370. $('#saves').show()
  371. $('#updates').hide()
  372. } else {
  373. $('#saves').hide()
  374. $('#updates').show()
  375. }
  376. $('#updates').off('click').click(function () {
  377. util.ajaxJson("", ctx + '/market/keywork/lock', {
  378. id: luckysheet.getSheet().id
  379. }, function (data) {
  380. if (data.result == 1) {
  381. window.top.$vm.$message({
  382. message: data.desc,
  383. type: 'info'
  384. })
  385. } else {
  386. flag = true
  387. getData(1)
  388. $('#saves').show()
  389. $('#updates').hide()
  390. }
  391. });
  392. })
  393. // 保存
  394. $('#saves').off('click').click(function () {
  395. // 当前工作表名
  396. var sheetName = luckysheet.getSheet().name
  397. var data = luckysheet.getSheet(sheetName)
  398. $('#saves').hide()
  399. $('#updates').show()
  400. flag = false
  401. data.fileName = luckysheet.getWorkbookName()
  402. util.ajaxJson("正在加载中", ctx + '/market/keywork/save', {
  403. data: data
  404. }, function (data) {
  405. if (data.result == 0) {
  406. $('#complete')[0].contentWindow.postMessage({
  407. module: "aaa",
  408. month: nowDate
  409. }, 'http://114.215.71.182:8080');
  410. }
  411. getData(1)
  412. });
  413. })
  414. }
  415. </script>
  416. </body>
  417. </html>