From 1809fefd65932f0b6b66d2fb40fb4cc0f8a5f3ae Mon Sep 17 00:00:00 2001
From: John Smith <xfgryujk@126.com>
Date: Sat, 14 Oct 2023 16:28:29 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B6=88=E6=81=AF=E5=85=83=E7=B4=A0=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E8=88=B0=E9=98=9F=E7=AD=89=E7=BA=A7=E3=80=81=E9=87=91?=
 =?UTF-8?q?=E9=A2=9D=E7=AD=89=E7=BA=A7=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ChatRenderer/MembershipItem.vue           |  4 +-
 .../components/ChatRenderer/PaidMessage.vue   |  6 ++-
 .../components/ChatRenderer/TextMessage.vue   |  2 +-
 .../src/components/ChatRenderer/constants.js  | 44 ++++++++++++-------
 4 files changed, 38 insertions(+), 18 deletions(-)

diff --git a/frontend/src/components/ChatRenderer/MembershipItem.vue b/frontend/src/components/ChatRenderer/MembershipItem.vue
index 15a7584..6d7f240 100644
--- a/frontend/src/components/ChatRenderer/MembershipItem.vue
+++ b/frontend/src/components/ChatRenderer/MembershipItem.vue
@@ -1,5 +1,7 @@
 <template>
-  <yt-live-chat-membership-item-renderer class="style-scope yt-live-chat-item-list-renderer" show-only-header>
+  <yt-live-chat-membership-item-renderer class="style-scope yt-live-chat-item-list-renderer" show-only-header
+    :blc-guard-level="privilegeType"
+  >
     <div id="card" class="style-scope yt-live-chat-membership-item-renderer">
       <div id="header" class="style-scope yt-live-chat-membership-item-renderer">
         <img-shadow id="author-photo" height="40" width="40" class="style-scope yt-live-chat-membership-item-renderer"
diff --git a/frontend/src/components/ChatRenderer/PaidMessage.vue b/frontend/src/components/ChatRenderer/PaidMessage.vue
index 7da8eff..d13e8ea 100644
--- a/frontend/src/components/ChatRenderer/PaidMessage.vue
+++ b/frontend/src/components/ChatRenderer/PaidMessage.vue
@@ -8,6 +8,7 @@
       '--yt-live-chat-paid-message-timestamp-color': color.time,
       '--yt-live-chat-paid-message-color': color.content
     }"
+    :blc-price-level="priceConfig.priceLevel"
   >
     <div id="card" class="style-scope yt-live-chat-paid-message-renderer">
       <div id="header" class="style-scope yt-live-chat-paid-message-renderer">
@@ -47,8 +48,11 @@ export default {
     content: String
   },
   computed: {
+    priceConfig() {
+      return constants.getPriceConfig(this.price)
+    },
     color() {
-      return constants.getPriceConfig(this.price).colors
+      return this.priceConfig.colors
     },
     priceText() {
       return `CN¥${utils.formatCurrency(this.price)}`
diff --git a/frontend/src/components/ChatRenderer/TextMessage.vue b/frontend/src/components/ChatRenderer/TextMessage.vue
index e8c089a..c09ddf6 100644
--- a/frontend/src/components/ChatRenderer/TextMessage.vue
+++ b/frontend/src/components/ChatRenderer/TextMessage.vue
@@ -1,5 +1,5 @@
 <template>
-  <yt-live-chat-text-message-renderer :author-type="authorTypeText">
+  <yt-live-chat-text-message-renderer :author-type="authorTypeText" :blc-guard-level="privilegeType">
     <img-shadow id="author-photo" height="24" width="24" class="style-scope yt-live-chat-text-message-renderer"
       :imgUrl="avatarUrl"
     ></img-shadow>
diff --git a/frontend/src/components/ChatRenderer/constants.js b/frontend/src/components/ChatRenderer/constants.js
index 6a6e158..69b61b2 100644
--- a/frontend/src/components/ChatRenderer/constants.js
+++ b/frontend/src/components/ChatRenderer/constants.js
@@ -40,7 +40,8 @@ export const CONTENT_TYPE_IMAGE = 1
 // 美元 -> 人民币 汇率
 const EXCHANGE_RATE = 7
 export const PRICE_CONFIGS = [
-  { // $100红
+  // $100红
+  {
     price: 100 * EXCHANGE_RATE,
     colors: {
       contentBg: 'rgba(230,33,23,1)',
@@ -50,9 +51,11 @@ export const PRICE_CONFIGS = [
       time: 'rgba(255,255,255,0.501961)',
       content: 'rgba(255,255,255,1)'
     },
-    pinTime: 60
+    pinTime: 60,
+    priceLevel: 7,
   },
-  { // $50品红
+  // $50品红
+  {
     price: 50 * EXCHANGE_RATE,
     colors: {
       contentBg: 'rgba(233,30,99,1)',
@@ -62,9 +65,11 @@ export const PRICE_CONFIGS = [
       time: 'rgba(255,255,255,0.501961)',
       content: 'rgba(255,255,255,1)'
     },
-    pinTime: 30
+    pinTime: 30,
+    priceLevel: 6,
   },
-  { // $20橙
+  // $20橙
+  {
     price: 20 * EXCHANGE_RATE,
     colors: {
       contentBg: 'rgba(245,124,0,1)',
@@ -74,9 +79,11 @@ export const PRICE_CONFIGS = [
       time: 'rgba(255,255,255,0.501961)',
       content: 'rgba(255,255,255,0.87451)'
     },
-    pinTime: 10
+    pinTime: 10,
+    priceLevel: 5,
   },
-  { // $10黄
+  // $10黄
+  {
     price: 10 * EXCHANGE_RATE,
     colors: {
       contentBg: 'rgba(255,202,40,1)',
@@ -86,9 +93,11 @@ export const PRICE_CONFIGS = [
       time: 'rgba(0,0,0,0.501961)',
       content: 'rgba(0,0,0,0.87451)'
     },
-    pinTime: 5
+    pinTime: 5,
+    priceLevel: 4,
   },
-  { // $5绿
+  // $5绿
+  {
     price: 5 * EXCHANGE_RATE,
     colors: {
       contentBg: 'rgba(29,233,182,1)',
@@ -98,9 +107,11 @@ export const PRICE_CONFIGS = [
       time: 'rgba(0,0,0,0.501961)',
       content: 'rgba(0,0,0,1)'
     },
-    pinTime: 2
+    pinTime: 2,
+    priceLevel: 3,
   },
-  { // $2浅蓝
+  // $2浅蓝
+  {
     price: 2 * EXCHANGE_RATE,
     colors: {
       contentBg: 'rgba(0,229,255,1)',
@@ -110,9 +121,11 @@ export const PRICE_CONFIGS = [
       time: 'rgba(0,0,0,0.501961)',
       content: 'rgba(0,0,0,1)'
     },
-    pinTime: 0
+    pinTime: 0,
+    priceLevel: 2,
   },
-  { // $1蓝
+  // $1蓝
+  {
     price: EXCHANGE_RATE,
     colors: {
       contentBg: 'rgba(30,136,229,1)',
@@ -122,8 +135,9 @@ export const PRICE_CONFIGS = [
       time: 'rgba(255,255,255,0.501961)',
       content: 'rgba(255,255,255,1)'
     },
-    pinTime: 0
-  }
+    pinTime: 0,
+    priceLevel: 1,
+  },
 ]
 
 export function getPriceConfig(price) {