# Cài đặt (Settings)

## Tổng quan

Hệ thống cài đặt của AutoShopee Kit quản lý cấu hình người dùng, shop, extension và các nền tảng. Settings được lưu trữ trong `localStorage` (khi khả dụng) và đồng bộ qua `browser.storage` API.

## Kiến trúc

### Luồng dữ liệu

```
Setting Definition (setting.js)     ← Định nghĩa key, type, defaultVal
       │
       ▼
apiLocalSetting() (api.js)          ← Tạo API object với get/set/remove/reset
       │
       ▼
Export (index.js)                   ← Export các nhóm setting để sử dụng
       │
       ▼
localStorage + browser.storage     ← Lưu trữ dữ liệu
```

### File cấu trúc

```
src/app/plugins/setting/
├── setting.js    # Định nghĩa tất cả settings (key, type, defaultVal)
├── api.js        # API đọc/ghi settings (apiLocalSetting, clearAllSetting)
└── index.js      # Export các nhóm settings đã khởi tạo
```

## Cách lưu trữ

### `apiLocalSetting()` (`src/app/plugins/setting/api.js`)

Mỗi setting được khởi tạo qua `apiLocalSetting(payloadSetting)` nhận một object gồm:
- `key`: Khóa lưu trữ trong localStorage
- `type`: Loại dữ liệu (`string`, `bool`, `number`, `json`)
- `defaultVal`: Giá trị mặc định

Trả về object với các phương thức:

| Phương thức | Mô tả |
|---|---|
| `get()` | Đọc giá trị từ localStorage, parse theo type |
| `set(value)` | Ghi giá trị vào localStorage và browser.storage |
| `remove()` | Xóa giá trị khỏi localStorage và browser.storage |
| `reset()` | Reset về giá trị mặc định |
| `getSync()` | Đọc bất đồng bộ (dùng khi localStorage không khả dụng) |
| `useStorage()` | Trả về reactive ref qua `@vueuse/core` useStorage |

### Cơ chế lưu trữ kép

1. **localStorage** (ưu tiên): Đọc/ghi đồng bộ, nhanh
2. **browser.storage**: Đồng bộ song song, dùng làm backup và cho context không có localStorage (background service worker)

### Parse dữ liệu

Khi đọc, dữ liệu được parse theo `type`:
- `json`: `JSON.parse()`
- `number`: Parse thành số
- `bool`: Parse thành boolean
- `string`: Giữ nguyên

Khi ghi, dữ liệu được serialize:
- `json`: `JSON.stringify()`
- `number`, `bool`: `.toString()`
- `string`: Giữ nguyên

## Nhóm cài đặt

### 1. User Settings (`userSetting`)

Thông tin người dùng đăng nhập.

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `userData` | `user_data` | json | `{}` | Dữ liệu người dùng đầy đủ |
| `userId` | `user_id` | string | `''` | ID người dùng |
| `userName` | `user_name` | string | `''` | Tên người dùng |
| `userPassword` | `user_password` | string | `''` | Mật khẩu (đã mã hóa) |
| `userToken` | `user_token` | string | `''` | Token xác thực |
| `userExtensionPlan` | `user_extension_plan` | string | `'Free'` | Gói dịch vụ |

### 2. Identify Settings (`indentifySetting`)

Nhận diện thiết bị và trình duyệt.

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `appUuid` | `indentify_app_uuid` | string | UUID tự sinh | UUID duy nhất cho extension instance |
| `profileId` | `indentify_profile_id` | string | `''` | ID profile |
| `databaseId` | `indentify_database_id` | string | UUID tự sinh | ID database PouchDB |
| `browserIp` | `indentify_browser_ip` | string | `''` | Địa chỉ IP |
| `browserAgent` | `indentify_browser_agent` | string | `''` | User agent |
| `browserPlatform` | `indentify_browser_platform` | string | `''` | Nền tảng trình duyệt |
| `browserName` | `indentify_browser_name` | string | `''` | Tên trình duyệt |
| `fingerprintId` | `indentify_browser_fingerprint` | string | `''` | Browser fingerprint |

### 3. App Settings (`appSetting`)

Cấu hình chung của extension.

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `useShopManager` | `use_shopmanager` | bool | `false` | Bật quản lý shop (disabled) |
| `usePopup` | `use_popup` | bool | `false` | Sử dụng giao diện popup |
| `betaMode` | `beta_mode` | bool | `false` | Bật chế độ beta (hiện thêm tab Affiliate) |
| `workerFetchService` | `worker_fetch_service` | bool | `true` | Bật worker fetch service |
| `readNotifyId` | `notify_read_id` | string | `''` | ID thông báo đã đọc |
| `extensionInfo` | `config_extension_data` | json | `{}` | Dữ liệu cấu hình extension |
| `platformShopConfig` | `config_platform_shop_data` | json | `{shopee:{},lazada:{},tiktok:{}}` | Cấu hình shop theo nền tảng |
| `toggleMenu` | `toggle_menu` | bool | `false` | Trạng thái menu |
| `badWord` | `bard_word_v4` | json | `['chuyển khoản','stk','lazada','tiktok']` | Danh sách từ cấm |

### 4. Platform Settings (`platformSetting`)

Cấu hình chung cho các nền tảng.

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `saveHistoryPrint` | `save_history_print` | json | `{shopee:true,lazada:true,tiktok:true}` | Lưu lịch sử in đơn theo nền tảng |

### 5. Shopee Settings (`shopeeSetting`)

Cấu hình riêng cho Shopee.

**Affiliate:**

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `shopeeAffId` | `shopee_aff_id` | string | `''` | Affiliate App ID |
| `shopeeAffToken` | `shopee_aff_token` | string | `''` | Affiliate App Token |
| `shopeeAffSubId` | `shopee_aff_subid` | json | `['','','','','']` | 5 Sub ID cho tracking |
| `shopeeAffContent` | `shopee_aff_content_v2` | string | Template tin nhắn | Nội dung chat affiliate |

**Shop:**

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `shopeeShopWarehouse` | `shopee_shop_warehouse` | json | `[]` | Danh sách kho hàng đã chọn |
| `shopeeShopId` | `shopee_shop_id` | string | `''` | ID shop Shopee |
| `shopeeShopName` | `shopee_shop_name` | string | `''` | Tên shop |
| `shopeeShopImage` | `shopee_shop_image` | string | `''` | Ảnh shop |
| `shopeeShopRef` | `shopee_shop_ref` | string | `''` | Referral code |
| `shopeeShopSpcCds` | `shopee_shop_set_spccds` | string | `''` | SPC CDS token |
| `shopeeShopSpcf` | `shopee_shop_set_spcf` | string | `''` | SPCF token |

**Sản phẩm:**

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `shopeeConfigProduct` | `shopee_config_product_v2` | json | Xem bên dưới | Cấu hình hiển thị spy |
| `cloneProductEditData` | `clone_product_change_v2` | json | `{}` | Dữ liệu chỉnh sửa clone mặc định |

Giá trị mặc định `shopeeConfigProduct`:
```json
{
  "spyDetail": true,
  "spySearch": true,
  "spyAds": true,
  "showShopName": false,
  "addCloneBtn": false
}
```

**Flash Sale:**

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `shopeeFlashsaleCampaignAuto` | `shopee_flashsale_campaign_auto` | bool | `false` | Tự động đăng ký flash sale |
| `shopeeFlashsaleSchedulerAuto` | `shopee_flashsale_scheduler_auto` | bool | `true` | Tự động lên lịch flash sale |

### 6. TikTok Settings (`tiktokSetting`)

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `tiktokShopId` | `tiktok_shop_id` | string | `''` | ID shop TikTok |
| `tiktokShopName` | `tiktok_shop_name` | string | `''` | Tên shop TikTok |

### 7. Lazada Settings (`lazadaSetting`)

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `lazadaShopId` | `lazada_shop_id` | string | `''` | ID shop Lazada |
| `lazadaShopName` | `lazada_shop_name` | string | `''` | Tên shop Lazada |

### 8. Affiliate Tracking Settings (`affiliateSetting`)

| Setting | Key | Type | Default | Mô tả |
|---|---|---|---|---|
| `affTrackingShopeeTime` | `tracker_id_sp_last_time` | number | `0` | Thời điểm tracking Shopee gần nhất |
| `affTrackingLazadaTime` | `tracker_id_lz_last_time` | number | `0` | Thời điểm tracking Lazada gần nhất |
| `affTrackingTikiTime` | `tracker_id_tk_last_time` | number | `0` | Thời điểm tracking Tiki gần nhất |

## Giao diện cài đặt

### View: `src/app/views/Setting/Index.vue`

Trang cài đặt đầy đủ trong Options page, sử dụng layout `layout-single`. Render component `Setting`.

### View: `src/app/views/Setting/Popup.vue`

Trang cài đặt trong Popup, sử dụng `box-layout`. Render cùng component `Setting`.

### Component: `src/app/components/Single/Setting.vue`

Giao diện cài đặt chính với 3 tab:

**Tab 1 - Cài đặt chung (`general`):**

Card 1 - Cấu hình Shopee:
| Checkbox | Mô tả |
|---|---|
| `spyDetail` | Hiển thị spy trên trang chi tiết sản phẩm |
| `spyAds` | Hiển thị spy trên quảng cáo |
| `spySearch` | Hiển thị spy trên danh sách sản phẩm |
| `addCloneBtn` | Thêm nút clone trên trang sản phẩm |

Card 2 - Cấu hình Extension:
| Checkbox | Mô tả |
|---|---|
| Beta Mode | Bật chế độ beta (hiện thêm tab Affiliate) |
| Worker Fetch Service | Bật worker fetch service |
| Shop Manager | Bật quản lý shop (disabled) |

Card 3 - Tiện ích:
- Hiển thị Profile ID
- Nút xóa tất cả cache

**Tab 2 - Shopee Affiliate (`shopee-affiliate`):**

Chỉ hiển thị khi bật Beta Mode.

| Trường | Mô tả |
|---|---|
| App ID | Shopee Affiliate App ID |
| App Token | Shopee Affiliate Token (password field) |
| SubId 1-5 | 5 Sub ID cho tracking |
| Content Chat | Template tin nhắn affiliate, hỗ trợ biến `[PRODUCT_NAME]`, `[SHORT_LINK]` |

**Tab 3 - Cấu hình ảnh clone (`shopeeClone`):**

| Thành phần | Mô tả |
|---|---|
| Watermark | Bật/tắt watermark, upload ảnh PNG làm watermark |
| Size Chart | Chọn ảnh size chart từ danh sách có sẵn |

## Xóa dữ liệu

- **Xóa cache**: `cacheDestroyAll()` - Xóa tất cả cache PouchDB
- **Xóa settings**: `clearAllSetting()` - Xóa toàn bộ localStorage và browser.storage
