{{-- [#39388] Change bot — BẢN v2 của màn nhập thay LOA. Bản v1 (`index.blade.php` + `change_new.js` + `change_new.css`) GIỮ NGUYÊN để rollback; chọn bản nào là do cờ `config('sns-line.change_bot_wizard_v2')` tại BotController@adminChangeNewBot. Phase 1 bổ sung so với v1: - state `connect` → SCR-02 / SCR-03「LINE公式アカウントの接続方法を選択」(C-01, C-02, C-03) - state `success` → SCR-09「LINE公式アカウントの入れ替え設定が完了しました」(C-14 + EP-12) - state `wizard` → khung TẠM của nhánh「1ステップずつ順番に設定」, thay bằng SCR-04…08 ở Phase 3 Các state cũ (campaign / select / input / webhook / confirm / processing / reservation) giữ nguyên nội dung — Phase 2 mới redesign `input` + `webhook`. KHÔNG dựng stepper onboarding 5 mốc ở bất kỳ màn nào (BR-C09 — QA-spec-009 = (A)). --}} @extends('layout.v2.basic.main') @section('title', 'LOA入れ替え') @push('css') @endpush @section('content') {{-- Hashid của bot — CTA màn hoàn tất quay lại GET /admin/change-bots-new/{id} (SCR-09) --}}
{{-- ==================== STEP: Campaign Landing ==================== --}}
LINE公式アカウント LINE公式アカウント
＼ 入れ替え機能 ／
1ヶ月 無料開放
キャンペーン
キャンペーン終了まであと
@{{ countdownParts.d1 }} @{{ countdownParts.d2 }}
日
:
@{{ countdownParts.h1 }} @{{ countdownParts.h2 }}
時間
:
@{{ countdownParts.m1 }} @{{ countdownParts.m2 }}
分
トップに戻る
{{-- ==================== STEP: Select Method ==================== --}}
LINE公式アカウント入れ替え機能 使い方を見る
{{-- Plan lock banner --}}
LINE公式アカウント入れ替え機能をご利用する場合
スタンダードプラン以上のご契約でご利用できます
{{-- Campaign banner --}}
LINE公式アカウント入れ替え機能 無料開放キャンペーン
キャンペーン終了まであと：@{{ campaignCountdown }}
現在エルメと接続しているLINE公式アカウントを、別のLINE公式アカウントに入れ替えます。
入れ替え方法を選択してください。
スタンダードプラン以上のご契約で
ご利用できます
{{-- Immediate --}}
すぐにLINE公式アカウントを入れ替える
現在接続中のLINE公式アカウントを、別のLINE公式アカウントにすぐ入れ替えます。
入れ替えは即時反映されます
旧アカウントの友だち・配信データは引き継がれません
入れ替え前にバックアップをおすすめします
{{-- Scheduled --}}
LINE公式アカウント入れ替え予約をする
LINE公式アカウントが利用できなくなった場合に備えて、事前に入れ替え用のアカウントを登録できます。
新アカウントを事前に接続・設定できます
準備完了後、ワンクリックで即時入れ替え
予約はいつでもキャンセル可能です
スタンダードプラン以上のご契約で
ご利用できます
入れ替え前にご確認ください
LINE公式アカウントを入れ替えると、旧アカウントの友だちに紐づく友だち情報・配信履歴・タグなどのデータは新アカウントに引き継がれません。
{{-- C-02: CTA của CẢ 2 nhánh (すぐに入れ替える / 入れ替え予約) đều đi qua 接続方法選択 --}} 次に進む
{{-- ==================== STEP: OnboardingResume — SCR-16 / SCR-17 / SCR-18 ==================== --}} {{-- CR-18 (fix #40624). Có bản lưu「途中保存」thì PHẢI hiện màn này TRƯỚC khi vào wizard, để user tự chọn tiếp tục hay làm lại — không được tự khôi phục rồi đẩy thẳng vào bước 1. 🛑 BR-C18b — mặc định là card PHẢI「前回の続きから再開する」. Tên 2 frame trong Figma bị HOÁN ĐỔI (E-183); đọc theo tên frame sẽ dựng mặc định thành「最初からやり直す」, tức xoá bản lưu của user ngay khi họ quay lại — ngược hoàn toàn ý định BA. BR-C18e — modal chỉ bật SAU KHI nhấn CTA「最初からやり直す」, không bật lúc chọn card; nên state "đã chọn card trái mà chưa có modal" (SCR-17) là trạng thái có thật, phải dựng. Cấu trúc + giá trị style lấy theo màn SCR-39 của add-bot (namespace riêng `.cbv2-resume-*`). --}}

前回の続きから再開できます

前回保存した内容が残っています。続きから再開するか、最初からやり直すかをお選びください。

{{-- Card trái: 最初からやり直す — tông cảnh báo (cam) vì là lựa chọn XOÁ dữ liệu --}}

最初からやり直す

保存内容を削除して、最初の画面からやり直します。

{{-- Card phải: 前回の続きから再開する — MẶC ĐỊNH ĐƯỢC CHỌN (BR-C18b) --}}
前回の続きから

前回の続きから再開する

前回中断した位置から、続けて設定を進められます。

{{-- BR-C18c: nhãn CTA đổi theo card đang chọn --}}
続きから再開する ＞ 最初からやり直す ＞
{{-- SCR-18 — modal xác nhận xoá bản lưu. BR-C18g: chồng lên chính màn này. --}}
保存内容を削除してやり直しますか？
{{-- '×' và「キャンセル」cùng hành vi: đóng modal, GIỮ lựa chọn restart, KHÔNG xoá gì --}}

前回までに保存した設定はすべて削除され、最初の画面からやり直しになります。この操作は元に戻せません。

キャンセル 削除してやり直す
{{-- ==================== STEP: Connect Method (SCR-02 / SCR-03) ==================== --}} {{-- C-01: 1 màn, 2 state chọn card. C-03: link「前ページに戻る」hiện ở CẢ 2 state. Cấu trúc giống màn 接続方法選択 của add-bot, nhưng style là bản RIÊNG của change-bot (`.cbv2-cm-*` trong change_new_v2.css, giá trị copy từ `.cm-*` của add-bot) — 2 luồng độc lập theo QA-tech-001, sửa bên này không đụng màn add-bot đang chạy production. Khác biệt riêng của nhập thay: bọc trong lớp phủ full-page `.cbv2-fullpage` và có thêm link「前ページに戻る」dưới CTA (add-bot không có). --}}

LINE公式アカウントの接続方法を選択

ご利用環境に合わせて、接続方法をお選びください。

{{-- Card trái: 1ステップずつ (orange) --}}
はじめての方におすすめ
LINE Business ID
PCでステップ設定
@include('admin.bots.change_bot_new.partials.monitor_icon_v2') 1ステップずつ順番に設定
所要時間の目安: 約15〜20分
  • 画面の指示に沿って迷わず進められる
  • チャネル作成からWebhook設定まで順番にご案内
  • 迷いやすいポイントもガイドが解説します
{{-- Card phải: クイック接続 (blue) --}}
チャネル情報をお持ちの方向け
チャネルID 1234567890 シークレット ●●●●●●●●
PCで直接入力
@include('admin.bots.change_bot_new.partials.monitor_icon_v2') クイック接続
所要時間の目安: 約5〜10分
  • チャネルID・チャネルシークレットを直接入力
  • 1画面で設定が完結
  • 事前準備済みなら最短で接続できます
{{-- CTA đổi nhãn theo card đang chọn (C-01) --}} @{{ connectCtaLabel }} {{-- C-03: link này là điểm khác add-bot — hiện ở CẢ 2 state chọn card --}} 前ページに戻る
{{-- ==================== STEP: Wizard PC接続 — SCR-04…SCR-08 ==================== --}} {{-- C-04. Layout 3 cột theo Style A (bản chốt): panel trái 操作ステップ · card giữa nội dung bước · panel phải 操作マニュアル. KHÔNG render stepper onboarding 5 mốc (BR-C09) và KHÔNG dựng link「スマホ接続に切り替える」(C-08 đã bị loại khỏi phạm vi). --}}
@include('admin.bots.change_bot_new.partials.wiz_step_sidebar_v2') {{-- `:key` đổi theo màn ⇒ Vue TẠO LẠI cả thân wizard thay vì patch vào DOM cũ. Không có nó, đổi nhánh v-if (bước N ⇄ màn con trợ giúp) làm Vue tái dùng đúng phần tử ở vị trí tương đương; component này dựng icon bằng thao tác DOM nên giữ lại icon cũ rồi render thêm icon mới → hiện 2 icon. Input không bị ảnh hưởng: giá trị nằm ở `form`, không phải ở DOM. --}}
Step @{{ connectStep }} / 5
{{-- Màn con trợ giúp (QA-spec-016 = A). Giữ nguyên `connectStep` nên sidebar trái và「Step N / 5」ở trên vẫn đứng ở bước 2, đúng cách add-bot làm. --}}
{{-- Panel phải: bước 1–4 là 操作マニュアル, bước 5 đổi thành trạng thái chờ (C-15). Đang mở MÀN CON trợ giúp thì luôn là 操作マニュアル — add-bot cũng vậy (`wiz-help-panel` kết thúc bằng @include wiz-manual-card), kể cả màn con provider vốn vào từ bước 5. --}}
{{-- ==================== STEP: Quick input — SCR-14 ==================== --}} {{-- C-10 (2 card đánh số) + C-17 (hint dạng đường dẫn) + C-05 (nút tiến disabled). --}} {{-- `cbv2-quick`: bật bộ token của add-bot SCR-24 (.cd-*) cho riêng luồng quick, không đụng bộ token wizard 上級者 vốn dùng chung .cbv2-field* --}}
← 接続方法選択に戻る
LINE公式アカウントを接続
LINE Developersコンソールで作成したチャネル情報を入力してください。入力内容をもとに、次の画面でWebhook URLを発行します。
{{-- ① Messaging APIチャネル --}}
1 Messaging APIチャネル
LINE Developersコンソールから、Messaging APIチャネルの情報を入力してください。
LINE Developersコンソール > チャネル基本設定 > チャネルID
LINE Developersコンソール > チャネル基本設定 > チャネルシークレット
{{-- ② LINEログインチャネル --}}
2 LINEログインチャネル
LINE Developersコンソールから、LINEログインチャネルの情報を入力してください。
{{-- ※ phân biệt với Messaging API là BẮT BUỘC ở cặp field LINE Login (C-17) --}}
LINE Developersコンソール > チャネル基本設定 > チャネルID ※Messaging APIチャネルのチャネルIDではありません
LINE Developersコンソール > チャネル基本設定 > チャネルシークレット ※Messaging APIチャネルのチャネルシークレットではありません
キャンセル 次に進む
{{-- ==================== STEP: Webhook URL — SCR-13 ==================== --}} {{-- C-11 (banner + checklist) + C-12 (nhãn nút kanji) + C-13 (chỉ phát hành URL, KHÔNG tự ghi đè). --}}
← チャネル情報の入力に戻る
LINE公式アカウントを接続
チャネル情報を読み込み、Webhook URLを発行しました。このURLをLINE Developersコンソールに設定してください。
チャネル情報の読み込みが完了しました。
3 Webhook URLを設定する
発行されたWebhook URLをコピーし、LINE Developersコンソールに設定してください。
LINE developersを表示して下さい
ステップ1で取得したチャネルIDに紐づく LINE Developers のMessaging API設定ページを開いて、Webhook URL の設定を行ってください。
LINE developersを開く
@include('admin.bots.change_bot_new.partials.webhook_url_block_v2') @include('admin.bots.change_bot_new.partials.webhook_checklist_v2')
戻る {{-- C-12: kanji「進む」thay bản kana「すすむ」. Gate: đủ 4 checkbox (C-06) --}} 接続情報の確認に進む
{{-- ==================== STEP: Confirm ==================== --}}
{{-- ⚠ `href="?"` kế thừa từ v1 = RELOAD cả trang, wizard 5 bước sẽ mất dữ liệu đang nhập. Chưa đổi được vì không xác minh nổi lme-breadcrumb có nhận handler thay href hay không (submodule public/lme-ui rỗng, và không usage nào trong repo dùng kiểu đó). --}}
LINE公式アカウント入れ替え機能 使い方を見る
接続先LINE公式アカウント
メッセージングAPIチャネル
有効
チャネル名
@{{ confirmData.messaging_api.channel_name }}
チャネルID
@{{ confirmData.messaging_api.channel_id }}
チャネルシークレット
@{{ confirmData.messaging_api.channel_secret_masked }}
Bot ID
@{{ confirmData.messaging_api.bot_id }}
LINEログインチャンネル
有効
{{--
チャネル名
@{{ confirmData.line_login.channel_name }}
--}}
チャネルID
@{{ confirmData.line_login.channel_id }}
チャネルシークレット
@{{ confirmData.line_login.channel_secret_masked }}
注意点
LINE公式アカウントを入れ替えると、旧アカウントの友だちに紐づく友だち情報・配信履歴・タグなどのデータは新アカウントに引き継がれません。入れ替え前にCSVエクスポート等でバックアップを取ることをおすすめします。
キャンセル @{{ selectedMethod == 'scheduled' ? 'この内容で接続予約する' : 'この内容で接続する' }}
{{-- ==================== STEP: Processing ==================== --}}
L Message
LINE公式アカウント入れ替え中
現在、LINE公式アカウントの入れ替え作業を行なっております。作業完了までエルメの操作はできません。
作業完了までは最大1時間程度かかる場合があります。
注意事項
入れ替え中は、コピー元・コピー先両方のエルメアカウントが最大1時間程度操作できなくなる可能性があります。
あいさつメッセージやステップ配信などエルメ上の設定は通常通り稼働いたしますのでご安心ください。
{{-- ==================== STEP: Reservation ==================== --}}
LINE公式アカウント入れ替え機能 使い方を見る
入れ替え予約が設定されています
予約操作日時: @{{ formatDate(reservation.date, 'Y年M月D日 HH:mm') }}
接続予約を削除 LINE公式アカウント 入れ替えを実行
{{-- ==================== STEP: Complete (SCR-09) ==================== --}} {{-- C-14: màn hoàn tất chuyển từ modal → trang full-page; dữ liệu LOA mới lấy từ EP-12. --}}
LINE公式アカウントの入れ替え設定が完了しました
LINE公式アカウント入れ替え トップに戻る
{{-- ==================== MODAL: QR xem video trên điện thoại — SCR-10 ==================== --}} {{-- C-15. Mở từ nút「スマホで見る」của panel 操作マニュアル; QR mã hoá URL video CỦA ĐÚNG BƯỚC đang đứng (QA-spec-021 = (A) — mỗi bước một video riêng). --}}
スマホで操作動画を見る
スマホのカメラでQRコードを読み取ると、操作動画が再生されます。
@{{ videoQrUrl }}
 {{-- ==================== Floating video player — SCR-15 ==================== --}} {{-- C-15. Cửa sổ nổi góc dưới phải, KHÔNG chặn thao tác trên màn (overlay không modal). Style `.cbv2-vp-*` trong change_new_v2.css (bản riêng, giá trị copy từ add-bot). --}}
@{{ currentStepVideo.title }} 別タブで開く
{{-- ==================== MODAL: Already connected — SCR-11 ==================== --}} {{-- C-16. Bật khi EP-14 trả 409 ALREADY_CONNECTED ở bước Messaging API (QA-spec-011: phát hiện càng sớm càng tốt, không đợi tới màn xác nhận cuối). ⚠ Email hiển thị ĐẦY ĐỦ theo QA-spec-020 = (B) — đánh đổi nghiệp vụ đã được chấp nhận có ý thức: user cần biết chính xác địa chỉ để đăng nhập, che đi thì modal thành ngõ cụt. Server chỉ trả đúng 3 trường và có log truy vết. '×' → đóng modal, quay lại ĐÚNG màn/bước đang nhập, GIỮ NGUYÊN dữ liệu đã nhập (QA-spec-019 = (A)) — không reset luồng. --}}
このLINE公式アカウントはすでに接続されています
が接続されているエルメアカウントの登録アドレスは
※ @{{ occupiedConnectedAtText }} に接続操作が行われました。
上記のメールアドレスでエルメにログインしてください。
ログアウトする
{{-- ==================== MODAL: Success ==================== --}}
LINE公式アカウントの入れ替えが完了しました
以下のLINE公式アカウントがエルメに接続されました。
閉じる
 {{-- ==================== MODAL: Delete Reservation ==================== --}}
接続予約を削除
接続予約を削除すると、事前に設定した接続情報が破棄されます。再度入れ替えを行う場合は、最初から設定し直す必要があります。
この操作は元に戻せません
削除後に入れ替えを行うには、再度チャネル情報の入力が必要です。
キャンセル 削除する
{{-- ==================== MODAL: Execute Replacement ==================== --}}
LINE公式アカウント入れ替えの実行確認
以下のLINE公式アカウントへの入れ替えを実行します。この操作を実行すると、現在のアカウントとの接続は解除されます。
入れ替え実行後の注意事項
現在のアカウントに紐づくデータは引き継がれません
入れ替え処理中はエルメの操作ができなくなります
この操作は元に戻すことができません
キャンセル 入れ替えを実行する
@endsection @push('js') {{-- [#39388] lme-button-ghost: nút コピー ở khối Webhook URL và 2 nút của modal SCR-18 đang dùng component này nhưng trước đó CHƯA nạp script → component không được đăng ký. --}} {{-- [#39388] Sinh QR phía client (bước 5 接続チェック + modal SCR-10) — cùng thư viện add-bot đang dùng --}} @endpush