feat: 商务

src/base/ShopItem/ShopItem.vue

@@ -64,7 +64,7 @@ const deactivate = () => store.SET_SHOP(null)
   width: 230px;
   height: 200px;
   background: var(--brand-background);
-  border-radius: 8px;
+  border-radius: var(--global-radius, 8px);
   overflow: hidden;
   .logo-wrapper {
     width: 230px;
@@ -150,7 +150,7 @@ const deactivate = () => store.SET_SHOP(null)
     width: 230px;
     height: 242px;
     background: var(--food-background);
-    border-radius: 40px;
+    border-radius: var(--global-radius, 40px);
     align-items: center;
     .logo-wrapper {
       width: 180px;
@@ -200,7 +200,7 @@ const deactivate = () => store.SET_SHOP(null)
     .qrcode {
       height: 160px;
       background: #ffffff;
-      border-radius: 8px;
+      border-radius: var(--global-radius, 8px);
       display: flex;
       justify-content: center;
       align-items: center;
@@ -226,7 +226,7 @@ const deactivate = () => store.SET_SHOP(null)
         width: 194px;
         height: 45px;
         background: linear-gradient(99.5deg, #f0b92b 0%, #f9d556 100%);
-        border-radius: 100px;
+        border-radius: var(--global-radius, 100px);
         line-height: 45px;
         margin-top: 9px;
       }
@@ -252,7 +252,7 @@ const deactivate = () => store.SET_SHOP(null)
     background: rgba(255, 255, 255, 0.8);
     box-shadow: 0px 20px 60px rgba(0, 0, 0, 0.2);
     backdrop-filter: blur(7px);
-    border-radius: 12px;
+    border-radius: var(--global-radius, 12px);
     display: flex;
     flex-direction: column;
     align-items: center;

src/components/BrandScroll/BrandScroll.vue

@@ -148,7 +148,7 @@ watch([scroll, () => props.shop], () => {
     color: #ffffff;
     justify-content: center;
     align-items: center;
-    border-radius: 6px;
+    border-radius: var(--global-radius, 6px);
     margin-left: 12px;
   }
 }

src/components/CarouselWithIntro/CarouselWithIntro.vue

@@ -76,7 +76,7 @@ const qr = computed(() => props.data.qrFileList ?? [])
     .banner {
       width: 944px;
       height: 532px;
-      border-radius: 8px;
+      border-radius: var(--global-radius, 8px);
       object-fit: cover;
     }
   }

src/components/KeyboardByLetter/KeyboardByLetter.vue

@@ -54,7 +54,7 @@ function handleLetter(item, index) {
     line-height: 48px;
     background: #ffffff;
     box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.03), inset 0px -1px 0px rgba(177, 189, 220, 0.1);
-    border-radius: 8px;
+    border-radius: var(--global-radius, 8px);
     font-weight: 700;
     font-size: 18px;
     font-family: 'font_bold';

src/components/KeyboardByWritten/KeyboardByWritten.vue

@@ -58,7 +58,7 @@ function del() {
   width: 552px;
   height: 252px;
   background: #ffffff;
-  border-radius: 12px;
+  border-radius: var(--global-radius, 12px);
   margin-top: 16px;
   overflow: hidden;
   .word-scroll {
@@ -97,7 +97,7 @@ function del() {
     bottom: 8px;
     background: rgba(0, 0, 0, 0.05);
     box-shadow: inset 0px -1px 0px rgba(177, 189, 220, 0.1);
-    border-radius: 8px;
+    border-radius: var(--global-radius, 8px);
   }
 }
 </style>

src/components/PublicComponent/Tabs.vue

@@ -89,7 +89,7 @@ const goPage = item => {
       align-items: center;
       height: 97px;
       background: rgba(255, 255, 255, 0.4);
-      border-radius: 24px;
+      border-radius: var(--global-radius, 24px);
       img {
         width: 80px;
         height: 80px;

src/components/Search/Search.vue

@@ -243,7 +243,7 @@ onBeforeUnmount(() => {
         max-width: 170px;
         height: 52px;
         background: rgba(255, 255, 255, 0.8);
-        border-radius: 100px;
+        border-radius: var(--global-radius, 100px);
         .text {
           text-align: center;
           font-weight: 900;

src/components/SearchResultItem/SearchResultItem.vue

@@ -37,7 +37,7 @@ function handleShop() {
   width: 210px;
   height: 200px;
   background: rgba(255, 255, 255, 0.6);
-  border-radius: 8px;
+  border-radius: var(--global-radius, 8px);
   margin-right: 8px;
   margin-top: 24px;
   .icon-wrapper {
@@ -45,7 +45,7 @@ function handleShop() {
     width: 210px;
     height: 160px;
     background: #ffffff;
-    border-radius: 8px;
+    border-radius: var(--global-radius, 8px);
     justify-content: center;
     align-items: center;
     .icon {

src/themes/business/style.json

@@ -1,7 +1,8 @@
 {
   "global": {
     "background": "linear-gradient(180deg, #7C9DC4 0%, #BFD3E1 100%)",
-    "appBackground": "#dee6f6"
+    "appBackground": "#dee6f6",
+    "radius": "0px"
   },
   "weather": {
     "iconColor": "#FFFFFF",

src/themes/fashion/style.json

@@ -1,7 +1,8 @@
 {
   "global": {
     "background": "linear-gradient(180deg, #6257d7 0%, #f191c0 100%)",
-    "appBackground": "#dee6f6"
+    "appBackground": "#dee6f6",
+    "radius": ""
   },
   "weather": {
     "iconColor": "#fff",

src/themes/highend/style.json

@@ -1,7 +1,8 @@
 {
   "global": {
     "background": "center / cover no-repeat",
-    "appBackground": "#F2EEE8"
+    "appBackground": "#F2EEE8",
+    "radius": ""
   },
   "weather": {
     "iconColor": "#000",

src/themes/luxury/style.json

@@ -1,7 +1,8 @@
 {
   "global": {
     "background": "bottom / cover no-repeat",
-    "appBackground": "#E7E7E7"
+    "appBackground": "#E7E7E7",
+    "radius": ""
   },
   "weather": {
     "iconColor": "#000",

src/themes/main/style.json

@@ -1,7 +1,8 @@
 {
   "global": {
     "background": "#dee6f6",
-    "appBackground": "#dee6f6"
+    "appBackground": "#dee6f6",
+    "radius": ""
   },
   "weather": {
     "iconColor": "#000",

src/views/Index/Index.vue

@@ -149,7 +149,7 @@ getActivityList(3).then(({ data }) => {
           height: 52px;
 
           background: rgba(255, 255, 255, 0.8);
-          border-radius: 100px;
+          border-radius: var(--global-radius, 100px);
           .text {
             text-align: center;
             font-weight: 900;
@@ -190,7 +190,7 @@ getActivityList(3).then(({ data }) => {
         height: 557px;
         background: var(--index-guideBackground);
         border: var(--index-guideBorder);
-        border-radius: 32px;
+        border-radius: var(--global-radius, 32px);
         overflow: hidden;
         padding: 460px 0 0 40px;
 
@@ -201,7 +201,7 @@ getActivityList(3).then(({ data }) => {
           width: 100%;
           height: 432px;
           background: var(--index-guideTopBg);
-          border-radius: 32px;
+          border-radius: var(--global-radius, 32px);
           padding: 40px;
           z-index: 1;
           .title {
@@ -294,7 +294,7 @@ getActivityList(3).then(({ data }) => {
             width: 110px;
             height: 110px;
             background: #ffffff;
-            border-radius: 12px;
+            border-radius: var(--global-radius, 12px);
             padding: 10px;
             object-fit: contain;
           }
@@ -307,7 +307,7 @@ getActivityList(3).then(({ data }) => {
         height: 100%;
         margin-left: 40px;
         background: var(--index-foodBg);
-        border-radius: 32px;
+        border-radius: var(--global-radius, 32px);
         border: var(--index-foodBorder);
         align-items: center;
         overflow: hidden;
@@ -318,7 +318,7 @@ getActivityList(3).then(({ data }) => {
           height: 160px;
           flex: 0 0 160px;
           box-shadow: 0px 15px 26px rgba(244, 142, 88, 0.32);
-          border-radius: 27px;
+          border-radius: var(--global-radius, 27px);
           padding: 32px 0 0 40px;
         }
       }
@@ -330,7 +330,7 @@ getActivityList(3).then(({ data }) => {
         margin-left: 40px;
         background: var(--index-recBg);
         border: var(--index-recBorder);
-        border-radius: 32px;
+        border-radius: var(--global-radius, 32px);
         align-items: center;
         overflow: hidden;
         .title {
@@ -340,7 +340,7 @@ getActivityList(3).then(({ data }) => {
           height: 160px;
           flex: 0 0 160px;
           box-shadow: 0px 15px 26px rgba(230, 201, 148, 0.3);
-          border-radius: 27px;
+          border-radius: var(--global-radius, 27px);
           padding: 32px 0 0 40px;
         }
       }
@@ -384,7 +384,7 @@ getActivityList(3).then(({ data }) => {
           justify-content: center;
           align-items: center;
           height: 118px;
-          border-radius: 24px;
+          border-radius: var(--global-radius, 24px);
           img {
             width: 80px;
             height: 80px;
@@ -431,7 +431,7 @@ getActivityList(3).then(({ data }) => {
         position: relative;
         width: 944px;
         height: 531px;
-        border-radius: 24px;
+        border-radius: var(--global-radius, 24px);
         overflow: hidden;
         .banner {
           width: 944px;