main.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372
  1. const matched = window.location.search.match(/filter=(.+)/);
  2. const compilationID = matched && matched[1] || '';
  3. // 节流
  4. function throttle(fn, time) {
  5. let canRun = true;
  6. return function () {
  7. if (!canRun) {
  8. return;
  9. }
  10. canRun = false;
  11. const rst = fn.apply(this, arguments);
  12. // 事件返回错误,说明没有发起请求,允许直接继续触发事件,不进行节流处理
  13. if (rst === false) {
  14. canRun = true;
  15. return;
  16. }
  17. setTimeout(() => canRun = true, time);
  18. }
  19. }
  20. const periodReg = /\d{4}-((0[1-9])|(1[0-2]))$/;
  21. function createLib() {
  22. const name = $('#name').val();
  23. if (!name) {
  24. $('#name-error').show();
  25. return false;
  26. }
  27. const period = $('#period').val();
  28. if (!period || !periodReg.test(period)) {
  29. $('#period-error').show();
  30. return false;
  31. }
  32. $('#add-lib-form').submit();
  33. }
  34. let curLib = {};
  35. //设置当前库
  36. function setCurLib(libID) {
  37. curLib.id = libID;
  38. curLib.name = $(`#${libID}`).text();
  39. curLib.compilationID = $(`#${libID}`).data('compilationid');
  40. }
  41. // 点击编辑按钮
  42. function handleEditClick(libID) {
  43. setCurLib(libID);
  44. $('#edit').modal('show');
  45. }
  46. // 点击确认编辑
  47. function handleEditConfirm() {
  48. const rename = $('#rename-text').val();
  49. if (!rename) {
  50. $('#rename-error').show();
  51. return false;
  52. }
  53. $('#edit').modal('hide');
  54. ajaxPost('/priceInfo/renameLib', { libID: curLib.id, name: rename })
  55. .then(() => $(`#${curLib.id} a`).text(rename));
  56. }
  57. // 删除需要连需点击三次才可删除
  58. let curDelCount = 0;
  59. // 点击删除按钮
  60. function handleDeleteClick(libID) {
  61. setCurLib(libID);
  62. curDelCount = 0;
  63. $('#del').modal('show');
  64. }
  65. // 删除确认
  66. function handleDeleteConfirm() {
  67. curDelCount++;
  68. if (curDelCount === 3) {
  69. $.bootstrapLoading.start();
  70. curDelCount = -10; // 由于需要连续点击,因此没有对此事件进行节流,为防止多次请求,一旦连续点击到三次,马上清空次数。
  71. $('#del').modal('hide');
  72. ajaxPost('/priceInfo/deleteLib', { libID: curLib.id })
  73. .then(() => $(`#${curLib.id}`).parent().remove())
  74. .finally(() => $.bootstrapLoading.end());
  75. }
  76. }
  77. // 获取地区
  78. let curAreas = [];
  79. let curAreaMap = {};
  80. const getAreas = async () => {
  81. const areas = await ajaxPost('/priceInfo/getAreas', { compilationID: curLib.compilationID });
  82. return areas;
  83. }
  84. // 获取地区下拉选项映射,key为父地区、value为子地区
  85. const getAreaMap = async () => {
  86. curAreas = await getAreas();
  87. const areaMap = {};
  88. curAreas.forEach(item => {
  89. const { name } = item;
  90. if (name) {
  91. let [parent, sub] = name.split('-');
  92. if (!sub) {
  93. sub = parent;
  94. }
  95. if (!areaMap[parent]) {
  96. areaMap[parent] = [sub];
  97. } else {
  98. areaMap[parent].push(sub);
  99. }
  100. }
  101. });
  102. return areaMap;
  103. }
  104. // 根据地区选项获取地区ID
  105. const getAreaIDByOption = ($parent, $sub) => {
  106. const parentArea = $parent.val();
  107. const subArea = $sub.val();
  108. const areaItem = curAreas.find(item => [parentArea, `${parentArea}-${subArea}`].includes(item.name));
  109. console.log(areaItem);
  110. return areaItem?.ID;
  111. }
  112. // 设置地区下拉项
  113. const setAreaOption = ($parent, $sub, areaMap) => {
  114. $parent.unbind();
  115. const parentAreas = Object.keys(areaMap);
  116. $parent.empty();
  117. const parentOptionsHtml = parentAreas.map(parentArea => `<option value="${parentArea}">${parentArea}</option>`).join('');
  118. $parent.append(parentOptionsHtml);
  119. const setSubs = (subsArea) => {
  120. $sub.empty();
  121. const subOptionsHtml = subsArea.map(subArea => `<option value="${subArea}">${subArea}</option>`).join('');
  122. $sub.append(subOptionsHtml);
  123. }
  124. setSubs(areaMap[parentAreas[0]] || []);
  125. $parent.change(() => {
  126. const curParent = $parent.val();
  127. setSubs(areaMap[curParent] || []);
  128. getAreaIDByOption();
  129. });
  130. }
  131. let importType = 'originalData';
  132. // 点击导入按钮
  133. async function handleImportClick(libID, type) {
  134. try {
  135. setCurLib(libID);
  136. importType = type;
  137. if (importType === 'keys') {
  138. $('#import-area').show();
  139. const areaMap = await getAreaMap();
  140. setAreaOption($('#import-parent-area'), $('#import-sub-area'), areaMap);
  141. } else {
  142. $('#import-area').hide();
  143. }
  144. $('#import').modal('show');
  145. } catch (error) {
  146. alert(error.message);
  147. }
  148. }
  149. // 导入确认
  150. function handleImportConfirm() {
  151. $.bootstrapLoading.start();
  152. const self = $(this);
  153. try {
  154. const areaID = getAreaIDByOption($('#import-parent-area'), $('#import-sub-area'));
  155. if (!areaID) {
  156. throw '请选择地区!';
  157. }
  158. const formData = new FormData();
  159. const file = $("input[name='import_data']")[0];
  160. if (file.files.length <= 0) {
  161. throw '请选择文件!';
  162. }
  163. formData.append('file', file.files[0]);
  164. formData.append('libID', curLib.id);
  165. formData.append('areaID', areaID);
  166. formData.append('importType', importType);
  167. $.ajax({
  168. url: '/priceInfo/importExcel',
  169. type: 'POST',
  170. data: formData,
  171. cache: false,
  172. contentType: false,
  173. processData: false,
  174. beforeSend: function () {
  175. self.attr('disabled', 'disabled');
  176. self.text('上传中...');
  177. },
  178. success: function (response) {
  179. self.removeAttr('disabled');
  180. self.text('确定导入');
  181. if (response.err === 0) {
  182. $.bootstrapLoading.end();
  183. const message = response.msg !== undefined ? response.msg : '';
  184. if (message !== '') {
  185. alert(message);
  186. }
  187. // 成功则关闭窗体
  188. $('#import').modal("hide");
  189. } else {
  190. $.bootstrapLoading.end();
  191. const message = response.msg !== undefined ? response.msg : '上传失败!';
  192. alert(message);
  193. }
  194. },
  195. error: function () {
  196. $.bootstrapLoading.end();
  197. alert("与服务器通信发生错误");
  198. self.removeAttr('disabled');
  199. self.text('确定导入');
  200. }
  201. });
  202. } catch (error) {
  203. alert(error);
  204. $.bootstrapLoading.end();
  205. }
  206. }
  207. // 点击导出按钮
  208. async function handleExportClick(libID) {
  209. try {
  210. setCurLib(libID);
  211. $('#export').modal('show');
  212. const areaMap = await getAreaMap();
  213. setAreaOption($('#export-parent-area'), $('#export-sub-area'), areaMap);
  214. } catch (error) {
  215. alert(error.message);
  216. }
  217. }
  218. // 导出确认
  219. function handleExportConfirm() {
  220. debugger;
  221. const areaID = getAreaIDByOption($('#export-parent-area'), $('#export-sub-area'));
  222. if (!areaID) {
  223. alert('请选择地区!');
  224. return;
  225. }
  226. $('#export').modal('hide');
  227. window.location.href = `/priceInfo/export?libID=${curLib.id}&areaID=${areaID}`;
  228. }
  229. const { ProcessStatus, CRAWL_LOG_KEY } = window.PRICE_INFO_CONST;
  230. const CHECKING_TIME = 5000;
  231. // 检测爬取、导入是否完成
  232. function processChecking(key, cb) {
  233. checking();
  234. function checking() {
  235. ajaxPost('/priceInfo/processChecking', { key })
  236. .then(handleResolve)
  237. .catch(handleReject)
  238. }
  239. let timer;
  240. function handleResolve({ key, status, errorMsg }) {
  241. if (status === ProcessStatus.START) {
  242. if (!$('#progressModal').is(':visible')) {
  243. const title = key === CRAWL_LOG_KEY ? '爬取数据' : '导入数据';
  244. const text = key === CRAWL_LOG_KEY ? '正在爬取数据,请稍候……' : '正在导入数据,请稍候……';
  245. $.bootstrapLoading.progressStart(title, true);
  246. $("#progress_modal_body").text(text);
  247. }
  248. timer = setTimeout(checking, CHECKING_TIME);
  249. } else if (status === ProcessStatus.FINISH) {
  250. if (timer) {
  251. clearTimeout(timer);
  252. }
  253. $.bootstrapLoading.progressEnd();
  254. if (cb) {
  255. cb();
  256. }
  257. } else {
  258. if (timer) {
  259. clearTimeout(timer);
  260. }
  261. if (errorMsg) {
  262. alert(errorMsg);
  263. }
  264. if (cb) {
  265. cb();
  266. }
  267. $.bootstrapLoading.progressEnd();
  268. }
  269. }
  270. function handleReject(err) {
  271. if (timer) {
  272. clearInterval(timer);
  273. }
  274. alert(err);
  275. $.bootstrapLoading.progressEnd();
  276. }
  277. }
  278. // 爬取数据确认
  279. function handleCrawlConfirm() {
  280. const from = $('#period-start').val();
  281. const to = $('#period-end').val();
  282. if (!periodReg.test(from) || !periodReg.test(to)) {
  283. $('#crawl-error').show();
  284. return false;
  285. }
  286. $('#crawl').modal('hide');
  287. ajaxPost('/priceInfo/crawlData', { from, to, compilationID }, 0) // 没有timeout
  288. .then(() => {
  289. processChecking(CRAWL_LOG_KEY, () => window.location.reload());
  290. })
  291. }
  292. /* function handleCrawlConfirm() {
  293. const from = $('#period-start').val();
  294. const to = $('#period-end').val();
  295. if (!periodReg.test(from) || !periodReg.test(to)) {
  296. $('#crawl-error').show();
  297. return false;
  298. }
  299. $('#crawl').modal('hide');
  300. $.bootstrapLoading.progressStart('爬取数据', true);
  301. $("#progress_modal_body").text('正在爬取数据,请稍候……');
  302. // 不用定时器的话,可能finally处理完后,进度条界面才显示,导致进度条界面没有被隐藏
  303. const time = setInterval(() => {
  304. if ($('#progressModal').is(':visible')) {
  305. clearInterval(time);
  306. ajaxPost('/priceInfo/crawlData', { from, to, compilationID }, 0) // 没有timeout
  307. .then(() => {
  308. window.location.reload();
  309. })
  310. .finally(() => $.bootstrapLoading.progressEnd());
  311. }
  312. }, 500);
  313. } */
  314. const throttleTime = 1000;
  315. $(document).ready(function () {
  316. processChecking();
  317. // 锁定、解锁
  318. $('.lock').click(function () {
  319. lockUtil.handleLockClick($(this));
  320. });
  321. // 新增
  322. $('#add-lib').click(throttle(createLib, throttleTime));
  323. // 重命名
  324. $('#rename').click(throttle(handleEditConfirm, throttleTime));
  325. // 删除
  326. $('#delete').click(handleDeleteConfirm);
  327. // 爬取数据
  328. $('#crawl-confirm').click(throttle(handleCrawlConfirm, throttleTime));
  329. // 导出excel
  330. $('#export-confirm').click(throttle(handleExportConfirm, throttleTime));
  331. // 导入excel
  332. $('#import-confirm').click(throttle(handleImportConfirm, throttleTime));
  333. $('#add').on('hidden.bs.modal', () => {
  334. $('#name-error').hide();
  335. $('#period-error').hide();
  336. });
  337. $('#edit').on('hidden.bs.modal', () => $('#rename-error').hide());
  338. $('#crawl').on('hidden.bs.modal', () => $('#crawl-error').hide());
  339. });
  340. $.ajax({
  341. url: 'http://api.zjtcn.com/user/dyn_code',
  342. type: 'post',
  343. data: { service_id: '2020090003' },
  344. contentType: 'application/x-www-form-urlencoded',
  345. })