修改完成

components/tree/TreeMemberForm.vue

@@ -14,12 +14,6 @@
       ><PageHeader :title="config.pageTitle"
     /></view>
     <view class="member-form-panel">
-      <image
-        class="member-form-panel__skin"
-        src="/static/assets/modules/tree/transparent/t01-state-panel.png"
-        mode="scaleToFill"
-      />
-
       <view v-if="formState === 'form'" class="member-form">
         <text class="member-form__eyebrow">{{ config.eyebrow }}</text>
         <text class="member-form__title">{{ config.title }}</text>
@@ -29,10 +23,6 @@
           :key="field.key"
           class="member-field"
         >
-          <image
-            src="/static/assets/modules/tree/transparent/t07-search-input-frame.png"
-            mode="scaleToFill"
-          />
           <text>{{ field.label }}</text>
           <input
             v-model="form[field.key]"
@@ -206,34 +196,26 @@ const showConflictHelp = () => {
 
 <style scoped lang="scss">
 .member-form-page {
-  position: relative;
+  display: flex;
   min-height: 100vh;
-  overflow: hidden;
+  flex-direction: column;
   background: $paper;
 }
 .member-form-page__header {
-  position: relative;
   z-index: 3;
 }
 .member-form-panel {
-  position: relative;
   z-index: 2;
   width: calc(100% - 32rpx);
   min-height: min(640px, calc((100vw - 16px) * 1.48));
   margin: 18rpx auto 0;
   padding: 7.5% 8%;
   box-sizing: border-box;
-}
-.member-form-panel__skin {
-  position: absolute;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  pointer-events: none;
+  background: url("/static/assets/modules/tree/transparent/t01-state-panel.png")
+    center / 100% 100% no-repeat;
 }
 .member-form,
 .member-form-result {
-  position: relative;
   z-index: 1;
 }
 .member-form__eyebrow {
@@ -258,7 +240,6 @@ const showConflictHelp = () => {
   line-height: 1.5;
 }
 .member-field {
-  position: relative;
   display: grid;
   grid-template-columns: auto minmax(0, 1fr);
   min-height: 78rpx;
@@ -267,27 +248,20 @@ const showConflictHelp = () => {
   margin-top: 12rpx;
   padding: 12rpx 22rpx;
   box-sizing: border-box;
-}
-.member-field image {
-  position: absolute;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  pointer-events: none;
+  background: url("/static/assets/modules/tree/transparent/t07-search-input-frame.png")
+    center / 100% 100% no-repeat;
 }
 .member-field > text {
-  position: relative;
   z-index: 1;
   color: $ink;
   font-size: 24rpx;
   font-weight: 700;
 }
 .member-field input {
-  position: relative;
   z-index: 1;
   width: 100%;
   min-width: 0;
-  height: 54rpx;
+  min-height: 54rpx;
   color: $ink;
   font-size: 24rpx;
   text-align: right;
@@ -304,22 +278,21 @@ const showConflictHelp = () => {
   text-align: center;
 }
 .member-form-action {
-  position: relative;
+  display: grid;
   width: 100%;
-  height: 76rpx;
+  min-height: 76rpx;
   margin-top: 17rpx;
 }
 .member-form-action image {
-  position: absolute;
-  inset: 0;
+  grid-area: 1 / 1;
   width: 100%;
   height: 100%;
   pointer-events: none;
 }
 .member-form-action text {
-  position: relative;
   z-index: 1;
   display: flex;
+  grid-area: 1 / 1;
   align-items: center;
   justify-content: center;
   height: 100%;