diff --git a/activity/agency-opening/assets/apply-button.png b/activity/agency-opening/assets/apply-button.png new file mode 100644 index 0000000..5cf53d8 Binary files /dev/null and b/activity/agency-opening/assets/apply-button.png differ diff --git a/activity/agency-opening/assets/cat.png b/activity/agency-opening/assets/cat.png new file mode 100644 index 0000000..9f6a7e3 Binary files /dev/null and b/activity/agency-opening/assets/cat.png differ diff --git a/activity/agency-opening/assets/countdown-cell.png b/activity/agency-opening/assets/countdown-cell.png new file mode 100644 index 0000000..f03dedb Binary files /dev/null and b/activity/agency-opening/assets/countdown-cell.png differ diff --git a/activity/agency-opening/assets/frame-bottom-mask.svg b/activity/agency-opening/assets/frame-bottom-mask.svg new file mode 100644 index 0000000..5b58f68 --- /dev/null +++ b/activity/agency-opening/assets/frame-bottom-mask.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/activity/agency-opening/assets/frame-bottom-source.png b/activity/agency-opening/assets/frame-bottom-source.png new file mode 100644 index 0000000..da7a1a3 Binary files /dev/null and b/activity/agency-opening/assets/frame-bottom-source.png differ diff --git a/activity/agency-opening/assets/frame-top-mask.svg b/activity/agency-opening/assets/frame-top-mask.svg new file mode 100644 index 0000000..66245e9 --- /dev/null +++ b/activity/agency-opening/assets/frame-top-mask.svg @@ -0,0 +1,3 @@ + + + diff --git a/activity/agency-opening/assets/frame-top-source.png b/activity/agency-opening/assets/frame-top-source.png new file mode 100644 index 0000000..74e80fa Binary files /dev/null and b/activity/agency-opening/assets/frame-top-source.png differ diff --git a/activity/agency-opening/assets/hall-bg.png b/activity/agency-opening/assets/hall-bg.png new file mode 100644 index 0000000..f63a16e Binary files /dev/null and b/activity/agency-opening/assets/hall-bg.png differ diff --git a/activity/agency-opening/assets/hero-shadow.svg b/activity/agency-opening/assets/hero-shadow.svg new file mode 100644 index 0000000..4dd4af9 --- /dev/null +++ b/activity/agency-opening/assets/hero-shadow.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/activity/agency-opening/assets/lang-mask-left.svg b/activity/agency-opening/assets/lang-mask-left.svg new file mode 100644 index 0000000..3dd2ee6 --- /dev/null +++ b/activity/agency-opening/assets/lang-mask-left.svg @@ -0,0 +1,3 @@ + + + diff --git a/activity/agency-opening/assets/lang-mask-right.svg b/activity/agency-opening/assets/lang-mask-right.svg new file mode 100644 index 0000000..eddb990 --- /dev/null +++ b/activity/agency-opening/assets/lang-mask-right.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/activity/agency-opening/assets/lang-sheen.png b/activity/agency-opening/assets/lang-sheen.png new file mode 100644 index 0000000..e0a2d33 Binary files /dev/null and b/activity/agency-opening/assets/lang-sheen.png differ diff --git a/activity/agency-opening/assets/mask-bg-header.svg b/activity/agency-opening/assets/mask-bg-header.svg new file mode 100644 index 0000000..b5bd907 --- /dev/null +++ b/activity/agency-opening/assets/mask-bg-header.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/activity/agency-opening/assets/mask-bg-hero.svg b/activity/agency-opening/assets/mask-bg-hero.svg new file mode 100644 index 0000000..76dd260 --- /dev/null +++ b/activity/agency-opening/assets/mask-bg-hero.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/activity/agency-opening/assets/mask-bg-repeat.svg b/activity/agency-opening/assets/mask-bg-repeat.svg new file mode 100644 index 0000000..20c816a --- /dev/null +++ b/activity/agency-opening/assets/mask-bg-repeat.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/activity/agency-opening/assets/mask-bg-top.svg b/activity/agency-opening/assets/mask-bg-top.svg new file mode 100644 index 0000000..3f58f62 --- /dev/null +++ b/activity/agency-opening/assets/mask-bg-top.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/activity/agency-opening/assets/section-title.png b/activity/agency-opening/assets/section-title.png new file mode 100644 index 0000000..48bc74b Binary files /dev/null and b/activity/agency-opening/assets/section-title.png differ diff --git a/activity/agency-opening/assets/status-check.png b/activity/agency-opening/assets/status-check.png new file mode 100644 index 0000000..10121e9 Binary files /dev/null and b/activity/agency-opening/assets/status-check.png differ diff --git a/activity/agency-opening/assets/table-row.svg b/activity/agency-opening/assets/table-row.svg new file mode 100644 index 0000000..df1aa8b --- /dev/null +++ b/activity/agency-opening/assets/table-row.svg @@ -0,0 +1,3 @@ + + + diff --git a/activity/agency-opening/assets/title.png b/activity/agency-opening/assets/title.png new file mode 100644 index 0000000..906fb7a Binary files /dev/null and b/activity/agency-opening/assets/title.png differ diff --git a/activity/agency-opening/index.html b/activity/agency-opening/index.html new file mode 100644 index 0000000..dee2139 --- /dev/null +++ b/activity/agency-opening/index.html @@ -0,0 +1,371 @@ + + + + + + New Agency Opening Event + + + +
+
+
+
+ + + + + + + + +
+ +

+ Exclusive for New Agencies +

+ + +
+ +
+
+ + 04 + Days +
+
+ + 04 + Hours +
+
+ + 04 + Minutes +
+
+ + 04 + Seconds +
+
+ +
+
+ +

+ Opening Qualification +

+
+ +
+
+

+ Agency Identity +

+ Agency + +
+
+

+ Host Count +

+ 12 / 10+ + +
+
+

+ Opening Status +

+ Not Joined + +
+
+ +

+ Eligible To Apply +

+
+ +
+
+ +

+ Opening Rewards +

+
+ +
+
+ Opening Revenue + Reward Coins +
+ +
+
+
+ +
+
+ +

+ Activity Rules +

+
+ +
    +
  1. + Only agency accounts can apply. +
  2. +
  3. + Host count must be more than 10. +
  4. +
  5. + Agency age must be less than 7 days. +
  6. +
  7. + Each agency can join only once in lifetime. +
  8. +
  9. + Opening Event cannot run with Agency Support + Program at the same time. +
  10. +
  11. + Rewards will be sent within 7 days after + review. +
  12. +
+
+ +
+
+ +

+ Opening Record +

+
+ +
+
+ Guild Name: + Royal Family +
+
+ Created: + 2026-06-01 +
+
+ Opening Revenue: + 100K +
+
+ Reward: + 500K +
+
+
+
+
+
+
+ + + + + + diff --git a/activity/agency-opening/script.js b/activity/agency-opening/script.js new file mode 100644 index 0000000..0363261 --- /dev/null +++ b/activity/agency-opening/script.js @@ -0,0 +1,441 @@ +(function () { + var DESIGN_WIDTH = 1080; + var VIEWPORT_WIDTH = 375; + var DESIGN_HEIGHT = 4620; + var STORAGE_KEY = 'hy_agency_opening_end_at'; + var viewport = document.getElementById('appViewport'); + var stageWrap = document.getElementById('stageWrap'); + var countdownTimer = 0; + var countdownEndAt = 0; + var timeOffsetMS = 0; + var statusLoadedFromAPI = false; + var state = null; + var countNodes = { + days: document.querySelector('[data-count="days"]'), + hours: document.querySelector('[data-count="hours"]'), + minutes: document.querySelector('[data-count="minutes"]'), + seconds: document.querySelector('[data-count="seconds"]'), + }; + var applyButton = document.getElementById('applyButton'); + var rewardRows = document.getElementById('rewardRows'); + var rulesList = document.getElementById('rulesList'); + + var fallbackRewards = [ + { opening_revenue: '500K', reward_coins: '50K' }, + { opening_revenue: '1M', reward_coins: '100K' }, + { opening_revenue: '3M', reward_coins: '300K' }, + { opening_revenue: '5M', reward_coins: '500K' }, + { opening_revenue: '10M', reward_coins: '500K' }, + ]; + + function params() { + return new URLSearchParams(window.location.search || ''); + } + + function t(key, fallback) { + return window.HyAppI18n && window.HyAppI18n.t + ? window.HyAppI18n.t(key, fallback) + : fallback || key; + } + + function twoDigits(value) { + return String(Math.max(0, value)).padStart(2, '0'); + } + + function serverNow() { + return Date.now() - timeOffsetMS; + } + + function updateViewportHeight() { + var scale = Math.min(window.innerWidth / VIEWPORT_WIDTH, 1); + var visibleHeight = Math.ceil( + DESIGN_HEIGHT * (VIEWPORT_WIDTH / DESIGN_WIDTH) + ); + document.documentElement.style.setProperty( + '--app-scale', + String(scale) + ); + stageWrap.style.height = visibleHeight + 'px'; + viewport.style.minHeight = visibleHeight + 'px'; + document.body.style.minHeight = Math.ceil(visibleHeight * scale) + 'px'; + } + + function fallbackEndAt() { + var queryEnd = Date.parse( + params().get('end_at') || params().get('endAt') || '' + ); + if (Number.isFinite(queryEnd) && queryEnd > Date.now()) return queryEnd; + + var cached = Number(window.localStorage.getItem(STORAGE_KEY)); + if (Number.isFinite(cached) && cached > Date.now()) return cached; + + var fallback = + Date.now() + + 4 * 86400 * 1000 + + 4 * 3600 * 1000 + + 4 * 60 * 1000 + + 4000; + window.localStorage.setItem(STORAGE_KEY, String(fallback)); + return fallback; + } + + function updateCountdown() { + var diff = Math.max(0, countdownEndAt - serverNow()); + var totalSeconds = Math.floor(diff / 1000); + countNodes.days.textContent = twoDigits( + Math.floor(totalSeconds / 86400) + ); + countNodes.hours.textContent = twoDigits( + Math.floor((totalSeconds % 86400) / 3600) + ); + countNodes.minutes.textContent = twoDigits( + Math.floor((totalSeconds % 3600) / 60) + ); + countNodes.seconds.textContent = twoDigits(totalSeconds % 60); + } + + function firstValue(source, keys, fallback) { + if (!source) return fallback; + for (var index = 0; index < keys.length; index += 1) { + var value = source[keys[index]]; + if (value !== undefined && value !== null && value !== '') + return value; + } + return fallback; + } + + function normalizeStatus(raw) { + var data = raw || {}; + var qualification = + data.qualification || data.qualifications || data.agency || {}; + var record = + data.record || data.opening_record || data.openingRecord || {}; + var joined = Boolean( + firstValue(data, ['joined', 'has_joined', 'hasJoined'], false) + ); + var eligible = firstValue( + data, + ['eligible', 'can_apply', 'canApply'], + true + ); + var hostCount = + Number( + firstValue(qualification, ['host_count', 'hostCount'], 12) + ) || 0; + var hostRequirement = + Number( + firstValue( + qualification, + ['host_requirement', 'hostRequirement'], + 10 + ) + ) || 10; + + return { + serverTimeMS: + Number( + firstValue( + data, + ['server_time_ms', 'serverTimeMs'], + Date.now() + ) + ) || Date.now(), + endAt: + Number( + firstValue( + data.period || data.activity_period || {}, + ['end_ms', 'endMs'], + firstValue(data, ['period_end_ms', 'periodEndMs'], 0) + ) + ) || fallbackEndAt(), + qualification: { + identity: firstValue( + qualification, + ['identity', 'agency_identity', 'agencyIdentity'], + 'Agency' + ), + hostCount: hostCount, + hostRequirement: hostRequirement, + openingStatus: firstValue( + qualification, + [ + 'opening_status', + 'openingStatus', + 'status_text', + 'statusText', + ], + joined + ? t('agencyOpening.joined', 'Joined') + : t('agencyOpening.notJoined', 'Not Joined') + ), + eligible: Boolean(eligible) && !joined, + }, + rewards: Array.isArray( + data.rewards || data.reward_tiers || data.rewardTiers + ) + ? data.rewards || data.reward_tiers || data.rewardTiers + : fallbackRewards, + rules: Array.isArray(data.rules) ? data.rules : null, + record: { + guildName: firstValue( + record, + ['guild_name', 'guildName', 'agency_name', 'agencyName'], + 'Royal Family' + ), + created: firstValue( + record, + ['created_at', 'createdAt', 'created'], + '2026-06-01' + ), + revenue: firstValue( + record, + ['opening_revenue', 'openingRevenue', 'revenue'], + '100K' + ), + reward: firstValue( + record, + ['reward', 'reward_coins', 'rewardCoins'], + '500K' + ), + }, + joined: joined, + }; + } + + function mockStatus() { + var query = params(); + return normalizeStatus({ + period: { end_ms: fallbackEndAt() }, + qualification: { + agency_identity: query.get('identity') || 'Agency', + host_count: query.get('hosts') || 12, + host_requirement: query.get('host_requirement') || 10, + opening_status: query.get('status') || 'Not Joined', + }, + record: { + guild_name: query.get('guild') || 'Royal Family', + created_at: query.get('created') || '2026-06-01', + opening_revenue: query.get('revenue') || '100K', + reward: query.get('reward') || '500K', + }, + joined: query.get('joined') === '1', + eligible: query.get('eligible') !== '0', + rewards: fallbackRewards, + server_time_ms: Date.now(), + }); + } + + function fetchStatus() { + if (params().get('mock') === '1' || !window.HyAppAPI) { + statusLoadedFromAPI = false; + return Promise.resolve(mockStatus()); + } + return window.HyAppAPI.get('/api/v1/activities/agency-opening-event') + .then(function (data) { + statusLoadedFromAPI = true; + return normalizeStatus(data); + }) + .catch(function (error) { + // 新活动页先独立上线,接口未部署或活动未配置时继续渲染 Figma 默认态,避免线上 WebView 出现空白页。 + console.warn('agency opening event status fallback', error); + statusLoadedFromAPI = false; + return mockStatus(); + }); + } + + function renderRewards(rewards) { + rewardRows.innerHTML = ( + rewards && rewards.length ? rewards : fallbackRewards + ) + .map(function (item) { + var revenue = firstValue( + item, + ['opening_revenue', 'openingRevenue', 'revenue'], + '500K' + ); + var reward = firstValue( + item, + ['reward_coins', 'rewardCoins', 'reward'], + '50K' + ); + return [ + '
', + '', + escapeHTML(revenue), + '', + '', + escapeHTML(reward), + '', + '
', + ].join(''); + }) + .join(''); + } + + function renderRules(rules) { + if (!rules || !rules.length) return; + rulesList.innerHTML = rules + .map(function (rule) { + return '
  • ' + escapeHTML(rule) + '
  • '; + }) + .join(''); + } + + function applyStatus(data) { + state = data || mockStatus(); + timeOffsetMS = Date.now() - state.serverTimeMS; + countdownEndAt = state.endAt; + + document.getElementById('agencyIdentityText').textContent = + state.qualification.identity; + document.getElementById('hostCountText').textContent = + state.qualification.hostCount + + ' / ' + + state.qualification.hostRequirement + + '+'; + document.getElementById('openingStatusText').textContent = + state.qualification.openingStatus; + document.getElementById('eligibilityText').textContent = state + .qualification.eligible + ? t('agencyOpening.eligible', 'Eligible To Apply') + : t('agencyOpening.notEligible', 'Not Eligible'); + document.getElementById('recordGuildName').textContent = + state.record.guildName; + document.getElementById('recordCreated').textContent = + state.record.created; + document.getElementById('recordRevenue').textContent = + state.record.revenue; + document.getElementById('recordReward').textContent = + state.record.reward; + applyButton.classList.toggle('is-joined', state.joined); + applyButton.querySelector('span').textContent = state.joined + ? t('agencyOpening.applied', 'Applied') + : t('agencyOpening.apply', 'Apply Opening Event'); + renderRewards(state.rewards); + renderRules(state.rules); + updateCountdown(); + if (countdownTimer) window.clearInterval(countdownTimer); + countdownTimer = window.setInterval(updateCountdown, 1000); + } + + function showToast(message) { + if (window.HyAppToast && window.HyAppToast.show) { + window.HyAppToast.show(message); + return; + } + window.dispatchEvent( + new CustomEvent('hyapp:toast', { detail: { message: message } }) + ); + } + + function commandID() { + var random = Math.random().toString(36).slice(2); + if (window.crypto && window.crypto.getRandomValues) { + var bytes = new Uint32Array(2); + window.crypto.getRandomValues(bytes); + random = bytes[0].toString(36) + bytes[1].toString(36); + } + return 'agency_opening_' + Date.now().toString(36) + '_' + random; + } + + function submitApply() { + if ( + !state || + state.joined || + applyButton.classList.contains('is-loading') + ) + return; + if (!state.qualification.eligible) { + showToast(t('agencyOpening.notEligible', 'Not Eligible')); + return; + } + + applyButton.classList.add('is-loading'); + + // 申请动作按 command_id 做点击级幂等;如果后端接口还没上线,页面只更新本地展示态,不伪造服务端成功事实。 + var request = statusLoadedFromAPI + ? window.HyAppAPI.post( + '/api/v1/activities/agency-opening-event/apply', + { + command_id: commandID(), + } + ) + : Promise.resolve({ + joined: true, + qualification: { + opening_status: t('agencyOpening.joined', 'Joined'), + }, + }); + + request + .then(function (data) { + var next = Object.assign({}, state); + var payload = data || {}; + var payloadQualification = + payload.qualification || payload.qualifications || {}; + next.joined = true; + next.qualification = Object.assign({}, state.qualification, { + openingStatus: firstValue( + payloadQualification, + [ + 'opening_status', + 'openingStatus', + 'status_text', + 'statusText', + ], + t('agencyOpening.joined', 'Joined') + ), + }); + next.qualification.openingStatus = t( + 'agencyOpening.joined', + 'Joined' + ); + next.qualification.eligible = false; + applyStatus(next); + showToast( + t('agencyOpening.applySuccess', 'Application submitted.') + ); + }) + .catch(function (error) { + console.warn('agency opening event apply failed', error); + showToast( + t( + 'agencyOpening.applyFailed', + 'Application failed. Try again later.' + ) + ); + }) + .finally(function () { + applyButton.classList.remove('is-loading'); + }); + } + + function escapeHTML(value) { + return String(value || '') + .replace(/&/g, '&') + .replace(//g, '>') + .replace(/"/g, '"') + .replace(/'/g, '''); + } + + function init() { + document.title = t( + 'agencyOpening.pageTitle', + 'New Agency Opening Event' + ); + updateViewportHeight(); + fetchStatus().then(applyStatus); + applyButton.addEventListener('click', submitApply); + window.addEventListener('resize', updateViewportHeight); + window.addEventListener('hyapp:i18n-ready', function () { + document.title = t( + 'agencyOpening.pageTitle', + 'New Agency Opening Event' + ); + if (state) applyStatus(state); + }); + } + + init(); +})(); diff --git a/activity/agency-opening/style.css b/activity/agency-opening/style.css new file mode 100644 index 0000000..82c16f4 --- /dev/null +++ b/activity/agency-opening/style.css @@ -0,0 +1,678 @@ +* { + box-sizing: border-box; + -webkit-tap-highlight-color: transparent; +} + +:root { + --app-scale: 1; + --design-scale: 0.3472222222; + --stage-height: 4620px; + --gold: #fcefc2; + --gold-strong: #ffb56b; + --deep-purple: #1a0029; +} + +html, +body { + margin: 0; + width: 100%; + min-height: 100%; + overflow-x: hidden; + background: #12001d; + color: var(--gold); + font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; +} + +button { + border: 0; + padding: 0; + background: transparent; + color: inherit; + font: inherit; + cursor: pointer; + outline: none; +} + +button:focus-visible { + outline: 3px solid rgba(255, 239, 194, 0.72); + outline-offset: 4px; +} + +.app-viewport { + position: relative; + width: 375px; + min-height: 1605px; + margin: 0 auto; + transform: scale(var(--app-scale)); + transform-origin: top center; +} + +.page, +.stage-wrap { + position: relative; + width: 375px; + min-height: 1605px; + overflow: hidden; + background: var(--deep-purple); +} + +.stage-wrap { + height: 1605px; +} + +.stage { + position: absolute; + left: 0; + top: 0; + width: 1080px; + height: var(--stage-height); + overflow: hidden; + transform: scale(var(--design-scale)); + transform-origin: top left; + background: var(--deep-purple); +} + +.stage > * { + position: absolute; + z-index: 1; +} + +.bg-hall { + left: 0; + width: 1080px; + height: 1919px; + object-fit: cover; + object-position: center center; + pointer-events: none; + z-index: 0; +} + +.bg-hall-hero { + top: 94px; + -webkit-mask: url('./assets/mask-bg-hero.svg') 0 0 / 1080px 1919px no-repeat; + mask: url('./assets/mask-bg-hero.svg') 0 0 / 1080px 1919px no-repeat; +} + +.bg-hall-top { + top: 1095px; + opacity: 0.4; + -webkit-mask: url('./assets/mask-bg-top.svg') 0 0 / 1080px 1919px no-repeat; + mask: url('./assets/mask-bg-top.svg') 0 0 / 1080px 1919px no-repeat; +} + +.bg-hall-repeat-a { + top: 2233px; + opacity: 0.4; + -webkit-mask: url('./assets/mask-bg-repeat.svg') 0 0 / 1080px 1919px + no-repeat; + mask: url('./assets/mask-bg-repeat.svg') 0 0 / 1080px 1919px no-repeat; +} + +.bg-hall-repeat-b { + top: 3163px; + opacity: 0.4; + -webkit-mask: url('./assets/mask-bg-repeat.svg') 0 0 / 1080px 1919px + no-repeat; + mask: url('./assets/mask-bg-repeat.svg') 0 0 / 1080px 1919px no-repeat; +} + +.top-fade { + left: 0; + top: 0; + width: 1080px; + height: 235px; + pointer-events: none; + z-index: 1; + background: linear-gradient(180deg, #1a0029 41%, rgba(26, 0, 41, 0)); +} + +.language-tabs { + left: 18px; + top: 46px; + display: grid; + grid-template-columns: 221px repeat(5, 141px); + gap: 0; + align-items: center; + width: 1026px; + height: 70px; + direction: ltr; + z-index: 6; +} + +.language-tab { + position: relative; + height: 57px; + border: 2px solid #fde5cc; + border-radius: 39px; + background: linear-gradient(180deg, #4d145a, #210a34); + color: #ffdfaf; + font-size: 22px; + font-weight: 800; + line-height: 27px; + text-align: center; + text-shadow: 0 1px 7px rgba(87, 16, 110, 0.82); +} + +.language-tab:first-child { + width: 221px; + height: 65px; + border: 0; + border-radius: 0; + background: transparent; + isolation: isolate; +} + +.language-tab span { + position: relative; + z-index: 2; +} + +.language-tab:first-child::before, +.language-tab:first-child::after { + position: absolute; + content: ''; + inset: 0 auto auto 0; + width: 221px; + height: 65px; + background-image: url('./assets/lang-sheen.png'); + background-size: 221px 65px; + background-repeat: no-repeat; + z-index: 1; + -webkit-mask: url('./assets/lang-mask-left.svg') 0 0 / 100px 65px no-repeat; + mask: url('./assets/lang-mask-left.svg') 0 0 / 100px 65px no-repeat; +} + +.language-tab:first-child::after { + transform: rotate(180deg) scaleY(-1); + -webkit-mask: url('./assets/lang-mask-right.svg') 121px 0 / 100px 65px + no-repeat; + mask: url('./assets/lang-mask-right.svg') 121px 0 / 100px 65px no-repeat; +} + +.language-tab.is-active { + color: #fff8e4; +} + +.language-tab:not(:first-child).is-active { + box-shadow: + inset 0 0 18px rgba(255, 222, 151, 0.2), + 0 0 14px rgba(255, 203, 116, 0.22); +} + +.hero { + inset: 0 auto auto 0; + width: 1080px; + height: 1339px; +} + +.hero-title { + position: absolute; + left: 56px; + top: 107px; + width: 968px; + height: 425px; + object-fit: fill; + pointer-events: none; +} + +.hero-subtitle { + position: absolute; + left: 345px; + top: 479px; + margin: 0; + color: #741eb5; + font-size: 30px; + font-weight: 800; + line-height: 38px; + text-transform: capitalize; + white-space: nowrap; +} + +.hero-shadow { + position: absolute; + left: 182px; + top: 1257px; + width: 698px; + height: 89px; + mix-blend-mode: multiply; + pointer-events: none; +} + +.hero-cat { + position: absolute; + left: 210px; + top: 519px; + width: 642px; + height: 820px; + object-fit: cover; + pointer-events: none; +} + +.countdown { + left: 0; + top: 1338px; + width: 1080px; + height: 160px; + z-index: 3; +} + +.count-cell { + position: absolute; + top: 0; + width: 201px; + height: 160px; +} + +.count-days { + left: 87px; +} + +.count-hours { + left: 321px; +} + +.count-minutes { + left: 555px; +} + +.count-seconds { + left: 789px; +} + +.count-cell img { + position: absolute; + inset: 0; + width: 201px; + height: 160px; + object-fit: fill; + pointer-events: none; +} + +.count-cell strong, +.count-cell span, +.section-title h2, +.apply-button span, +.qualification-card strong, +.reward-head strong, +.record-row strong { + background: linear-gradient(180deg, var(--gold) 50%, var(--gold-strong)); + -webkit-background-clip: text; + background-clip: text; + color: transparent; +} + +.count-cell strong { + position: absolute; + left: 0; + top: 32px; + width: 201px; + font-size: 52px; + font-weight: 900; + line-height: 52px; + text-align: center; +} + +.count-cell span { + position: absolute; + left: 0; + top: 92px; + width: 201px; + font-size: 24px; + font-weight: 500; + line-height: 32px; + text-align: center; + white-space: nowrap; +} + +.opening-section { + left: 0; + width: 1080px; +} + +.qualification-section { + top: 1498px; + height: 735px; +} + +.rewards-section { + top: 2245px; + height: 800px; +} + +.rules-section { + top: 3057px; + height: 768px; +} + +.record-section { + top: 3837px; + height: 672px; +} + +.section-title { + position: absolute; + left: 93px; + top: 0; + width: 895px; + height: 189px; + z-index: 4; +} + +.section-title img { + position: absolute; + inset: 0; + width: 895px; + height: 189px; + object-fit: fill; + pointer-events: none; +} + +.section-title h2 { + position: absolute; + left: 0; + top: 101px; + width: 895px; + margin: 0; + font-size: 42px; + font-weight: 900; + line-height: 44px; + text-align: center; + text-transform: capitalize; + white-space: nowrap; +} + +.ornate-panel { + position: absolute; + left: 19px; + width: 1042px; + height: var(--panel-height); + pointer-events: none; + z-index: 1; +} + +.frame-qualification { + top: 72px; + --bottom-source-top: -561px; + --panel-height: 663px; +} + +.frame-rewards { + top: 72px; + --bottom-source-top: -496px; + --panel-height: 728px; +} + +.frame-rules { + top: 72px; + --bottom-source-top: -528px; + --panel-height: 696px; +} + +.frame-record { + top: 72px; + --bottom-source-top: -624px; + --panel-height: 600px; +} + +.frame-piece { + position: absolute; + left: 0; + width: 1042px; + height: 1224px; + background-size: 1042px 1224px; + background-repeat: no-repeat; +} + +.frame-piece-top { + top: 0; + background-image: url('./assets/frame-top-source.png'); + -webkit-mask: url('./assets/frame-top-mask.svg') 0 0 / 1042px 495px + no-repeat; + mask: url('./assets/frame-top-mask.svg') 0 0 / 1042px 495px no-repeat; +} + +.frame-piece-bottom { + top: var(--bottom-source-top); + background-image: url('./assets/frame-bottom-source.png'); + -webkit-mask: url('./assets/frame-bottom-mask.svg') 0 867px / 1042px 357px + no-repeat; + mask: url('./assets/frame-bottom-mask.svg') 0 867px / 1042px 357px no-repeat; +} + +.qualification-grid { + position: absolute; + left: 109px; + top: 235px; + display: grid; + grid-template-columns: repeat(3, 270px); + gap: 20px; + z-index: 3; +} + +.qualification-card { + position: relative; + width: 270px; + height: 154px; + border: 2px solid #fde5cc; + border-radius: 26px; + background: linear-gradient(180deg, #4d145a, #210a34); +} + +.qualification-card p { + position: absolute; + left: 0; + top: 34px; + width: 270px; + margin: 0; + color: var(--gold); + font-size: 26px; + font-weight: 500; + line-height: 30px; + text-align: center; +} + +.qualification-card strong { + position: absolute; + left: 0; + top: 88px; + width: 270px; + font-size: 38px; + font-weight: 900; + line-height: 40px; + text-align: center; + white-space: nowrap; +} + +.qualification-card img { + position: absolute; + right: -14px; + bottom: -12px; + width: 70px; + height: 70px; + object-fit: contain; + pointer-events: none; +} + +.apply-button { + position: absolute; + left: 217px; + top: 420px; + width: 646px; + height: 137px; + z-index: 4; +} + +.apply-button img { + position: absolute; + inset: 0; + width: 646px; + height: 137px; + object-fit: fill; + pointer-events: none; +} + +.apply-button span { + position: absolute; + left: 0; + top: 50px; + width: 646px; + font-size: 36px; + font-weight: 900; + line-height: 38px; + text-align: center; + white-space: nowrap; +} + +.apply-button.is-loading { + filter: saturate(0.7); + pointer-events: none; +} + +.apply-button.is-joined span { + opacity: 0.78; +} + +.eligibility-text { + position: absolute; + left: 0; + top: 563px; + width: 1080px; + margin: 0; + color: var(--gold); + font-size: 28px; + font-weight: 500; + line-height: 32px; + text-align: center; + white-space: nowrap; + z-index: 3; +} + +.reward-table { + position: absolute; + left: 90px; + top: 206px; + width: 900px; + z-index: 3; +} + +.reward-head { + position: relative; + display: grid; + grid-template-columns: 1fr 1fr; + align-items: center; + height: 71px; +} + +.reward-head strong { + font-size: 34px; + font-weight: 900; + line-height: 38px; + text-align: center; +} + +.table-line, +.reward-row::after, +.record-row::after { + position: absolute; + left: 26px; + right: 26px; + bottom: 0; + height: 2px; + content: ''; + background: linear-gradient( + 90deg, + rgba(255, 255, 192, 0), + #ffffc0 50%, + rgba(255, 255, 192, 0) + ); +} + +.table-line { + left: 26px; + right: 26px; + top: 71px; + bottom: auto; +} + +.reward-rows { + position: relative; + width: 900px; +} + +.reward-row { + position: relative; + display: grid; + grid-template-columns: 1fr 1fr; + align-items: center; + width: 900px; + height: 80px; + background: url('./assets/table-row.svg') center center / 900px 76px + no-repeat; + color: var(--gold); + font-size: 28px; + font-weight: 800; + line-height: 38px; + text-align: center; +} + +.rules-list { + position: absolute; + left: 119px; + top: 306px; + width: 842px; + margin: 0; + padding: 0 0 0 48px; + color: var(--gold); + font-size: 32px; + font-weight: 500; + line-height: 52px; + text-transform: capitalize; + z-index: 3; +} + +.rules-list li { + padding-left: 0; +} + +.record-table { + position: absolute; + left: 90px; + top: 220px; + width: 900px; + z-index: 3; +} + +.record-row { + position: relative; + display: grid; + grid-template-columns: 398px 1fr; + align-items: center; + width: 900px; + height: 80px; + background: url('./assets/table-row.svg') center center / 900px 76px + no-repeat; +} + +.record-row span { + color: var(--gold); + font-size: 28px; + font-weight: 800; + line-height: 38px; + text-align: right; + white-space: nowrap; +} + +.record-row strong { + padding-left: 104px; + font-size: 34px; + font-weight: 900; + line-height: 38px; + white-space: nowrap; +} + +@media (min-width: 431px) { + html, + body { + background: #100019; + } +} diff --git a/common/api.js b/common/api.js index 25d44fa..b5b3afd 100644 --- a/common/api.js +++ b/common/api.js @@ -557,7 +557,10 @@ var default_api = 'https://api.global-interaction.com/'; list: function (status, pageSize) { return request('/api/v1/role-invitations', { method: 'GET', - query: { status: status || 'pending', page_size: pageSize || 50 }, + query: { + status: status || 'pending', + page_size: pageSize || 50, + }, }); }, process: function (invitationID, payload) { @@ -641,6 +644,12 @@ var default_api = 'https://api.global-interaction.com/'; body: payload || {}, }); }, + createBDLeader: function (payload) { + return request('/api/v1/manager-center/bd-leaders', { + method: 'POST', + body: payload || {}, + }); + }, }; var superadminCenterAPI = bdLeaderCenterAPI; diff --git a/gonghui/agency-center/index.html b/gonghui/agency-center/index.html index d2c0928..2d05211 100644 --- a/gonghui/agency-center/index.html +++ b/gonghui/agency-center/index.html @@ -372,7 +372,7 @@ id="inviteTitle" data-i18n="agency_center.invite_host" > - How to invite host + Invite Host + + +
    + diff --git a/gonghui/agency-center/style.css b/gonghui/agency-center/style.css index 3d8d537..6b9311e 100644 --- a/gonghui/agency-center/style.css +++ b/gonghui/agency-center/style.css @@ -737,6 +737,32 @@ input:focus-visible { ); } +.host-search button:disabled { + background: var(--hy-theme-button-disabled, #c5a6f6); + box-shadow: none; +} + +.invite-status { + margin: 12px 18px 0; + padding: 10px 12px; + border-radius: 8px; + background: var(--primary-soft); + color: var(--primary-deep); + font-size: 12px; + font-weight: 850; + line-height: 1.35; +} + +.invite-status.is-error { + background: #fff0f0; + color: #c43f3f; +} + +.invite-status.is-success { + background: #ebfbf2; + color: #128946; +} + .host-row, .message-card { display: grid; @@ -850,6 +876,10 @@ input:focus-visible { padding: 0 10px; } +.message-action:disabled { + opacity: 0.58; +} + .message-action.agree { background: var(--button); color: #fff; diff --git a/gonghui/bd-center/style.css b/gonghui/bd-center/style.css index b21837e..ea7a1d6 100644 --- a/gonghui/bd-center/style.css +++ b/gonghui/bd-center/style.css @@ -550,6 +550,71 @@ color: #15914f; } +.message-card { + display: grid; + grid-template-columns: 44px minmax(0, 1fr) auto; + gap: 10px; + align-items: center; + padding: 12px; + border: 1px solid var(--line); + border-radius: 8px; + background: #fbfcfc; +} + +.message-avatar { + display: flex; + align-items: center; + justify-content: center; + width: 44px; + height: 44px; + overflow: hidden; + border-radius: 50%; + background: var(--primary); +} + +.message-avatar img { + display: block; + width: 100%; + height: 100%; + object-fit: cover; +} + +.message-fallback { + color: var(--primary-deep); + font-size: 18px; + font-weight: 950; +} + +.message-main { + min-width: 0; +} + +.message-title { + overflow: hidden; + color: var(--text); + font-size: 15px; + font-weight: 900; + line-height: 1.2; + text-overflow: ellipsis; + white-space: nowrap; +} + +.message-meta { + margin-top: 4px; + overflow: hidden; + color: var(--muted); + font-size: 12px; + font-weight: 800; + line-height: 1.2; + text-overflow: ellipsis; + white-space: nowrap; +} + +.message-actions { + display: flex; + gap: 6px; +} + @media (max-width: 360px) { .salary-card, .team-stats-card, @@ -567,12 +632,14 @@ } .member-row, - .invite-user-card { + .invite-user-card, + .message-card { grid-template-columns: 44px minmax(0, 1fr); } .member-side, - .invite-user-side { + .invite-user-side, + .message-actions { grid-column: 2; justify-items: start; text-align: left; diff --git a/gonghui/manager-center/index.html b/gonghui/manager-center/index.html index 6a51a7b..2ad0a4c 100644 --- a/gonghui/manager-center/index.html +++ b/gonghui/manager-center/index.html @@ -9,7 +9,10 @@ Control Panel - + @@ -60,11 +63,16 @@ type="button" data-action="send-frame" > -