优化

hdApp/src/admin/home/workbench.vue

@@ -1,15 +1,51 @@
 <template>
   <view>
     <block v-if="loginStyle == 0">
-      <view class="login-entry">
-        <!-- #ifdef MP-WEIXIN -->
-        <view class="login-entry-title login-entry-title--buy">个人买花</view>
-        <view><button class="admin-button-com big blue login-entry-btn" @click="buyItem">去买花</button></view>
-        <!-- #endif -->
-        <view class="login-entry-title login-entry-title--supply">花店进货</view>
-        <view><button class="admin-button-com big blue login-entry-btn"
-            @click="pageTo({ url: '/admin/home/login' })">去登录</button></view>
-        <view class="login-entry-register" @click="pageTo({ url: '/pagesClient/official/apply' })">花店注册</view>
+      <view class="login-page">
+        <view class="login-hero">
+          <image
+            class="login-hero-bg"
+            :src="constant.hostUrl + '/image//workbench-header-bg.webp'"
+            mode="aspectFill"
+          />
+          <view class="login-hero-scrim"></view>
+          <view class="status-space" :style="{ height: statusBarHeight + 'px' }"></view>
+          <view class="login-hero-inner">
+            <text class="login-hero-title">进货</text>
+            <text class="login-hero-desc">登录查看我的门店，便捷买花</text>
+          </view>
+        </view>
+        <view class="login-body">
+          <!-- #ifdef MP-WEIXIN -->
+          <view class="login-card">
+            <view class="login-card-icon-wrap login-card-icon-wrap--buy">
+              <image class="login-card-icon" :src="iconSrc('bouquet')" mode="aspectFit" />
+            </view>
+            <view class="login-card-main">
+              <text class="login-card-title">个人买花</text>
+              <text class="login-card-desc">跳转商城小程序，浏览我的花店</text>
+            </view>
+            <button class="login-card-btn login-card-btn--outline" @click="buyItem">去买花</button>
+          </view>
+          <!-- #endif -->
+          <view class="login-card">
+            <view class="login-card-icon-wrap login-card-icon-wrap--supply">
+              <image class="login-card-icon" :src="iconSrc('procurement')" mode="aspectFit" />
+            </view>
+            <view class="login-card-main">
+              <text class="login-card-title">花店进货</text>
+              <text class="login-card-desc">花店登录，进货采购和管理</text>
+            </view>
+            <button
+              class="login-card-btn login-card-btn--primary"
+              @click="pageTo({ url: '/admin/home/login' })"
+            >去登录</button>
+          </view>
+          <view class="login-register" @click="pageTo({ url: '/pagesClient/official/apply' })">
+            <text class="login-register-tip">还没有花店账号？</text>
+            <text class="login-register-link">花店注册</text>
+          </view>
+        </view>
       </view>
     </block>
     <block v-else>
@@ -703,34 +739,188 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-.login-entry {
-  width: 100vw;
-  text-align: center;
+.login-page {
+  min-height: 100vh;
+  background: #f2f7f4;
 }
 
-.login-entry-title {
-  font-size: 34upx;
+.login-hero {
+  position: relative;
+  padding: 0 24upx 36upx;
+  overflow: hidden;
+  background: linear-gradient(180deg, #e8f5ed 0%, #ecf6f0 72%, #f2f7f4 100%);
 }
 
-.login-entry-title--buy {
-  margin-top: 10upx;
-  margin-bottom: 30upx;
+.login-hero-bg {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 360upx;
+  z-index: 0;
+  opacity: 0.55;
 }
 
-.login-entry-title--supply {
-  margin-top: 70upx;
-  margin-bottom: 20upx;
+.login-hero-scrim {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  height: 360upx;
+  z-index: 1;
+  background: linear-gradient(
+    180deg,
+    rgba(255, 255, 255, 0.78) 0%,
+    rgba(237, 248, 242, 0.52) 48%,
+    rgba(255, 255, 255, 0) 100%
+  );
+  pointer-events: none;
 }
 
-.login-entry-btn {
-  width: 240upx;
+.status-space {
+  position: relative;
+  z-index: 2;
+  width: 100%;
+}
+
+.login-hero-inner {
+  position: relative;
+  z-index: 2;
+  padding: 56upx 8upx 0;
+}
+
+.login-hero-title {
+  display: block;
+  color: #161819;
+  font-size: 50upx;
+  font-weight: 700;
+  line-height: 56upx;
+  text-shadow:
+    0 0 12upx rgba(255, 255, 255, 0.92),
+    0 2upx 6upx rgba(255, 255, 255, 0.75);
+}
+
+.login-hero-desc {
+  display: block;
+  margin-top: 14upx;
+  color: #6b737c;
+  font-size: 28upx;
+  line-height: 40upx;
 }
 
-.login-entry-register {
+.login-body {
+  padding: 8upx 24upx 48upx;
+}
+
+.login-card {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 28upx 24upx;
+  background: #fff;
+  border-radius: 20upx;
+  box-shadow: 0 8upx 24upx rgba(9, 197, 103, 0.08);
+}
+
+.login-card + .login-card {
+  margin-top: 24upx;
+}
+
+.login-card-icon-wrap {
+  width: 88upx;
+  height: 88upx;
+  border-radius: 22upx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.login-card-icon-wrap--buy {
+  background: linear-gradient(135deg, #fff4e8 0%, #ffe8d6 100%);
+}
+
+.login-card-icon-wrap--supply {
+  background: linear-gradient(135deg, #e8f8f0 0%, #d4f0e2 100%);
+}
+
+.login-card-icon {
+  width: 48upx;
+  height: 48upx;
+}
+
+.login-card-main {
+  flex: 1;
+  min-width: 0;
+  margin-left: 20upx;
+}
+
+.login-card-title {
+  display: block;
+  color: #161819;
+  font-size: 32upx;
+  font-weight: 700;
+  line-height: 40upx;
+}
+
+.login-card-desc {
+  display: block;
+  margin-top: 8upx;
+  color: #8a9199;
+  font-size: 24upx;
+  line-height: 34upx;
+}
+
+.login-card-btn {
+  flex-shrink: 0;
+  margin: 0 0 0 16upx;
+  padding: 0 28upx;
+  min-width: 148upx;
+  height: 66upx;
+  line-height: 66upx;
+  font-size: 28upx;
+  font-weight: 600;
+  border-radius: 33upx;
+  text-align: center;
+  border: none;
+}
+
+.login-card-btn::after {
+  border: none;
+}
+
+.login-card-btn--primary {
+  color: #fff;
+  background: #09c567;
+}
+
+.login-card-btn--outline {
+  color: #09c567;
+  background: #fff;
+  border: 2upx solid #09c567;
+  line-height: 62upx;
+}
+
+.login-register {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
   margin-top: 40upx;
-  font-size: 44upx;
-  color: green;
-  text-decoration: underline;
+}
+
+.login-register-tip {
+  color: #8a9199;
+  font-size: 32upx;
+  line-height: 40upx;
+}
+
+.login-register-link {
+  margin-left: 8upx;
+  color: #09c567;
+  font-size: 32upx;
+  line-height: 40upx;
+  font-weight: 600;
 }
 
 .order-page {
@@ -1400,6 +1590,23 @@ export default {
   background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.24) 58%, rgba(245, 247, 246, 0.58) 100%);
 }
 
+.order-page .ghs_list_page .profile-section::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  height: 280upx;
+  z-index: 1;
+  background: linear-gradient(
+    180deg,
+    rgba(255, 255, 255, 0.78) 0%,
+    rgba(237, 248, 242, 0.52) 48%,
+    rgba(255, 255, 255, 0) 100%
+  );
+  pointer-events: none;
+}
+
 .workbench-header-bg {
   position: absolute;
   left: 0;
@@ -1430,11 +1637,12 @@ export default {
 }
 
 .custom-nav {
-  height: 165upx;
+  position: relative;
+  height: 145upx;
   display: flex;
   align-items: center;
   justify-content: center;
-  padding-top: 18upx;
+  padding-top: 65upx;
   box-sizing: border-box;
 }
 
@@ -1445,7 +1653,9 @@ export default {
   font-weight: 700;
   line-height: 48upx;
   text-align: center;
-  text-shadow: 0 2upx 8upx rgba(255, 255, 255, 0.72);
+  text-shadow:
+    0 0 12upx rgba(255, 255, 255, 0.92),
+    0 2upx 6upx rgba(255, 255, 255, 0.75);
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;