" + " " + " " + " " + " " + ""; const compiled = _.template(templateString); // default parameters const searchParams = new URLSearchParams(location.search); const defaultParams = {}; // 1. set parameters in the form to default parameters $('#' + KEY + '-list-filter-form') .serializeArray() .forEach((item) => { const rawName = item.name; const name = rawName.replace(new RegExp('^' + KEY + '_'), ''); const value = item.value; defaultParams[name] = value; }); // 2. set the URL search parameters to default parameters Array.from(searchParams) .filter((item) => item[0].includes(KEY)) .map((item) => { const rawName = item[0]; const name = rawName.replace(new RegExp('^' + KEY + '_'), ''); const value = item[1]; defaultParams[name] = value; $('#' + KEY + '-list-filter-form [name=' + rawName + ']').each(function() { if ($(this).attr('type') === 'checkbox') { if (this.value === value) { $(this).prop('checked', true).trigger('change'); } } else if (this.tagName === 'SELECT') { if ($(this).find('option[value=' + value + ']').length) { $(this).val(value).trigger('change'); } } else { $(this).val(value).trigger('change'); } }); }); const newsProvider = new NewsProvider({ endpoint: '/cn/zhcn/api/json/newslist/', defaultParams: defaultParams, }); function createSource(provider) { const data = provider.data.map((entry) => { entry.DisplayDate = entry.DisplayDate .replace(//g, '___sup___').replace(/<\/sup>/g, '___/sup___') .replace(//g, '___sub___').replace(/<\/sub>/g, '___/sub___') .replace(/(?:<(?:[^>]+)>)/ig, '') .replace(/___sup___/g, '').replace(/___\/sup___/g, '') .replace(/___sub___/g, '').replace(/___\/sub___/g, ''); entry.Title = entry.Title .replace(//g, '___sup___').replace(/<\/sup>/g, '___/sup___') .replace(//g, '___sub___').replace(/<\/sub>/g, '___/sub___') .replace(/(?:<(?:[^>]+)>)/ig, '') .replace(/___sup___/g, '').replace(/___\/sup___/g, '') .replace(/___sub___/g, '').replace(/___\/sub___/g, ''); return entry; }); const curPage = provider.curPage; const maxPage = provider.maxPage; const pages = _.fill(Array(maxPage), null).map(function (_, i) { return { index: i + 1, isCurrent: curPage === i + 1 }; }); const isEmpty = provider.isEmpty; const source = { data: data, pagination: { hidden: isEmpty || curPage === 1 && curPage === maxPage, pages: pages, first: { disabled: isEmpty || curPage === 1 }, prev: { disabled: isEmpty || curPage === 1 }, next: { disabled: isEmpty || curPage === maxPage }, last: { disabled: isEmpty || curPage === maxPage } } }; return source; } function toggleMessage(isShown) { $emptyMessage.attr('aria-hidden', !isShown).toggle(isShown); } // Date: 期間 (例) 20220501-20220531 // Category: カテゴリ (例) 製品?サービス 企業(yè)情報(bào) CSR その他 重要なお知らせ // NewsReleaseFlag: ニュースリリースかどうか (例) Yes // RelationalProducts: 関連製品?サービス // IndividualCompany: 関連企業(yè) (例) HHT,HHA // LinesOfNumber: 1ページに表示する數(shù) (例)20 // PageNumber: 何ページ目か (例)1 function getConditions() { let conditions = {}; $('#' + KEY + '-list-filter-form [name="' + KEY + '_LinesOfNumber"]').val(15); $('#' + KEY + '-list-filter-form').serializeArray() .forEach(function (item) { const name = item.name.replace(new RegExp('^' + KEY + '_'), ''); conditions[name] = item.value; }); return conditions; } // pagination edit function paginationEdit() { $(".hht-nc27-9__block2").each(function() { const liLength = $(this).children("li").length - 1; const liLimit = 5; // 奇數(shù)を指定すること const liRange = (liLimit - 1) / 2; const liRangeObj = liLimit - liRange; const pin = {'pointer-events': 'none'}; if (liLength + 1 >= liLimit + 2) { const $targetItem = $(this).children("li"); const currentNum = Number($(this).find("a.current").text()) - 1; if (currentNum < liRangeObj) { $targetItem.eq(liLimit).find('a').text('…').css(pin); $targetItem.slice(liLimit + 1, liLength).hide(); } else if (currentNum == liRangeObj) { if (liLimit + 1 !== liLength) { $targetItem.eq(liLimit + 1).find('a').text('…').css(pin); $targetItem.slice(liLimit + 2, liLength).hide(); } } else if (currentNum > liRangeObj && currentNum < liLength - liRangeObj) { $targetItem.eq(1).find('a').text('…').css(pin); $targetItem.slice(2, currentNum - liRange).hide(); $targetItem.eq(currentNum + liRange + 1).find('a').text('…').css(pin); $targetItem.slice(currentNum + liRange + 2, liLength).hide(); } else if (currentNum == liLength - liRangeObj) { $targetItem.eq(1).find('a').text('…').css(pin); $targetItem.slice(2, currentNum - liRange).hide(); } else if (currentNum > liLength - liRangeObj) { $targetItem.eq(1).find('a').text('…').css(pin); $targetItem.slice(2, liLength - liLimit + 1).hide(); } } }); } // filters let curFormState = $('#' + KEY + '-list-filter-form').serializeArray(); // 初期読み込み時(shí)の選択制御 const $form = $('#' + KEY + '-list-filter-form'); // 期間 const $selectDate = $form.find('select[name=news_Date]'); const selectDateVal = $selectDate.val(); // カテゴリ const $selectCategory = $form.find('select[name=news_Category]'); const selectCategoryVal = $selectCategory.val(); // ニュースリリース const $checkNewsReleaseFlag = $form.find('input[name=news_NewsReleaseFlag]'); // initial fetch // select2の値?チェックボックスを操作 $(window).on('load', function() { $selectDate.trigger('change'); $selectCategory.trigger('change'); $checkNewsReleaseFlag.change(); $('#' + KEY + '-list-filter-form').submit(); }); $('#' + KEY + '-list-filter-form').on('change', function () { const nowFormState = $('#' + KEY + '-list-filter-form').serializeArray(); const toggle = JSON.stringify(curFormState) !== JSON.stringify(nowFormState); $(this).find('.hht-nc27-8').toggleClass('-hint', toggle); }); $('#' + KEY + '-list-filter-form').on('submit', function () { const conditions = getConditions(); const params = { ...conditions, ...{ PageNumber: 1 } }; // reset current page newsProvider.fetch(params) .then((provider) => { $container.html(compiled(createSource(provider))); toggleMessage(provider.isEmpty); paginationEdit(); }) .catch((errorMessage) => { console.error(errorMessage); $container.empty(); toggleMessage(true); }); curFormState = $(this).serializeArray(); $(this).find('.hht-nc27-8').removeClass('-hint'); return false; }); // paginations $(document).on('click', containerSelector + ' [data-action]', function () { const action = $(this).attr('data-action'); const param = $(this).attr('data-param'); if (!['first', 'prev', 'page', 'next', 'last'].includes(action)) { return false; } newsProvider[action](param) .then((provider) => { $container.html(compiled(createSource(provider))); toggleMessage(provider.isEmpty); paginationEdit(); }) .catch((errorMessage) => { console.error(errorMessage); $container.empty(); toggleMessage(true); }); return false; }); }); })(jQuery);

點(diǎn)擊這里