优化

ghsApp/src/admin/shop/sk.vue

@@ -17,131 +17,126 @@
             <view>{{zjGatheringItemName}}</view>
           </tui-list-cell>
 
-          <view style="width:100%;border-top: 2px solid #2bb931;"></view>
-
-          <tui-list-cell class="line-cell" :hover="false">
-            <view class="tui-title">客户下单</view>
-            <radio-group class="tui-input" @change="thirdSendChange">
-              <label class="list" for="thirdSendOk">
-                <radio id="thirdSendOk" value="0" :checked="thirdSend == 0" style="transform:scale(0.7,0.7)" />
-                <span class="checkbox-text">可选跑腿</span>
-              </label>
-              <label class="list" for="thirdSendNo">
-                <radio id="thirdSendNo" value="1" :checked="thirdSend == 1" style="transform:scale(0.7,0.7)" />
-                <span class="checkbox-text">禁选跑腿</span>
-              </label>
-            </radio-group>
-          </tui-list-cell>
-
-          <tui-list-cell class="line-cell" :hover="false">
-            <view class="tui-title">跑腿费用</view>
-            <radio-group class="tui-input" @change="thirdSendFeeChange" style="display: flex; flex-wrap: wrap; gap: 30upx;">
-              <label class="list" for="thirdSendFeeDf" style="display: flex; align-items: center; white-space: nowrap;">
-                <radio id="thirdSendFeeDf" value="0" :checked="thirdSendFee == 0" style="transform:scale(0.7,0.7)" />
-                <span class="checkbox-text">客户自叫或发货后补收</span>
-              </label>
-              <label class="list" for="thirdSendFeeZd" style="display: flex; align-items: center; white-space: nowrap;">
-                <radio id="thirdSendFeeZd" value="1" :checked="thirdSendFee == 1" style="transform:scale(0.7,0.7)" />
-                <span class="checkbox-text">下单时提前算好并收取</span>
-              </label>
-            </radio-group>
-          </tui-list-cell>
-
-          <tui-list-cell class="line-cell" :hover="false">
-            <view class="tui-title">下单后</view>
-            <radio-group class="tui-input" @change="orderFlowChange" style="display: flex; flex-wrap: wrap; gap: 30upx;">
-              <label class="list" for="orderFlowZj" style="display: flex; align-items: center; white-space: nowrap;">
-                <radio id="orderFlowZj" value="0" :checked="orderFlow == 0" style="transform:scale(0.7,0.7)" />
-                <span class="checkbox-text">后台不要一键发跑腿（直接完成）</span>
-              </label>
-              <label class="list" for="orderFlowFh" style="display: flex; align-items: center; white-space: nowrap;">
-                <radio id="orderFlowFh" value="1" :checked="orderFlow == 1" style="transform:scale(0.7,0.7)" />
-                <span class="checkbox-text">后台需要一键发跑腿（变待发货）</span>
-              </label>
-            </radio-group>
-          </tui-list-cell>
-
-
-          <!-- 批发花材 -->
-          <view class="action-btn" style="border-top:2upx solid #2bb931;margin-top:20upx;">
-            <text style="font-size: 30upx;font-weight: bold;">【批发-花材】跑腿费计算方式</text>
+          <view style="border: 1px solid #3385FF;margin:20upx 10upx;background-color: white;">
+            <tui-list-cell class="line-cell" :hover="false">
+              <view class="tui-title">客户下单</view>
+              <radio-group class="tui-input" @change="thirdSendChange">
+                <label class="list" for="thirdSendOk">
+                  <radio id="thirdSendOk" value="0" :checked="thirdSend == 0" style="transform:scale(0.7,0.7)" />
+                  <span class="checkbox-text">可选跑腿</span>
+                </label>
+                <label class="list" for="thirdSendNo">
+                  <radio id="thirdSendNo" value="1" :checked="thirdSend == 1" style="transform:scale(0.7,0.7)" />
+                  <span class="checkbox-text">禁选跑腿</span>
+                </label>
+              </radio-group>
+            </tui-list-cell>
+            <tui-list-cell class="line-cell" :hover="false">
+              <view class="tui-title">跑腿费用</view>
+              <radio-group class="tui-input" @change="thirdSendFeeChange" style="display: flex; flex-wrap: wrap; gap: 30upx;">
+                <label class="list" for="thirdSendFeeDf" style="display: flex; align-items: center; white-space: nowrap;">
+                  <radio id="thirdSendFeeDf" value="0" :checked="thirdSendFee == 0" style="transform:scale(0.7,0.7)" />
+                  <span class="checkbox-text">客户自叫或发货后补收</span>
+                </label>
+                <label class="list" for="thirdSendFeeZd" style="display: flex; align-items: center; white-space: nowrap;">
+                  <radio id="thirdSendFeeZd" value="1" :checked="thirdSendFee == 1" style="transform:scale(0.7,0.7)" />
+                  <span class="checkbox-text">下单时提前算好并收取</span>
+                </label>
+              </radio-group>
+            </tui-list-cell>
+            <tui-list-cell class="line-cell" :hover="false">
+              <view class="tui-title">下单后</view>
+              <radio-group class="tui-input" @change="orderFlowChange" style="display: flex; flex-wrap: wrap; gap: 30upx;">
+                <label class="list" for="orderFlowZj" style="display: flex; align-items: center; white-space: nowrap;">
+                  <radio id="orderFlowZj" value="0" :checked="orderFlow == 0" style="transform:scale(0.7,0.7)" />
+                  <span class="checkbox-text">后台不要一键发跑腿（直接完成）</span>
+                </label>
+                <label class="list" for="orderFlowFh" style="display: flex; align-items: center; white-space: nowrap;">
+                  <radio id="orderFlowFh" value="1" :checked="orderFlow == 1" style="transform:scale(0.7,0.7)" />
+                  <span class="checkbox-text">后台需要一键发跑腿（变待发货）</span>
+                </label>
+              </radio-group>
+            </tui-list-cell>
           </view>
-          <view style="display: flex; align-items: center; margin-left:30upx;">
-            <input class="input-field" type="number" v-model="pfHcFreeKm" placeholder="0" style="width:100upx;" @focus="pfHcFreeKm = ''" />
-            <text style="margin-left: 20upx;font-size:30upx;">公里内免费配送</text>
-          </view>
-          <view class="action-btn">
-            <button class="btn-add" style="background-color: #3385FF;" @click="addPfFlowerMaterial">添加</button>
-          </view>
-          <view class="material-list">
-            <view v-for="(item, index) in pfFlowerMaterials" :key="index" class="material-item">
-              <view class="material-info">
-                <view class="info-row">
-                  <text>满</text>
-                  <input class="input-field" v-model="item.num" type="number" placeholder="0" @focus="clearItemField(item, 'num')" />
-                  <text>扎，</text>
-                  <input class="input-field" v-model="item.price" type="digit" placeholder="0" @focus="clearItemField(item, 'price')" />
-                  <text>元，</text>
-                  <input class="input-field" v-model="item.distance" type="digit" placeholder="0" @focus="clearItemField(item, 'distance')" />
-                  <text>公里内免费配送</text>
+
+          <view style="border: 1px solid #3385FF;margin:20upx 10upx;background-color: white;">
+            <view class="action-btn" style="margin-top:20upx;">
+              <text style="font-size: 30upx;font-weight: bold;">【批发-花材】跑腿费计算方式</text>
+            </view>
+            <view style="display: flex; align-items: center; margin-left:30upx;">
+              <input class="input-field" type="number" v-model="pfHcFreeKm" placeholder="0" style="width:100upx;" @focus="pfHcFreeKm = ''" />
+              <text style="margin-left: 20upx;font-size:30upx;">公里内免费配送</text>
+            </view>
+            <view class="action-btn">
+              <button class="btn-add" style="background-color: #3385FF;" @click="addPfFlowerMaterial">添加项</button>
+            </view>
+            <view class="material-list">
+              <view v-for="(item, index) in pfFlowerMaterials" :key="index" class="material-item">
+                <view class="material-info">
+                  <view class="info-row">
+                    <text>满</text>
+                    <input class="input-field" v-model="item.num" type="number" placeholder="0" @focus="clearItemField(item, 'num')" />
+                    <text>扎，</text>
+                    <input class="input-field" v-model="item.price" type="digit" placeholder="0" @focus="clearItemField(item, 'price')" />
+                    <text>元，</text>
+                    <input class="input-field" v-model="item.distance" type="digit" placeholder="0" @focus="clearItemField(item, 'distance')" />
+                    <text>公里内免费配送</text>
+                  </view>
                 </view>
+                <button class="btn-delete" style="background-color: #3385FF;" @click="deletePfFlowerMaterial(index)">删除</button>
               </view>
-              <button class="btn-delete" style="background-color: #3385FF;" @click="deletePfFlowerMaterial(index)">删除</button>
             </view>
+            <view class="warning-text">如不符合以上情况的，按实际跑腿费计算</view>
           </view>
 
-          <view class="warning-text">如不符合以上情况的，按实际跑腿费计算</view>
-
-
-          <!-- 零售花材 -->
-          <view class="action-btn" style="border-top:2upx solid #2bb931;margin-top:20upx;">
-            <text style="font-size: 30upx;font-weight: bold;">【零售-花材】跑腿费计算方式</text>
-          </view>
-          <view style="display: flex; align-items: center; margin-left:30upx;">
-            <input class="input-field" type="number" v-model="hcFreeKm" placeholder="0" style="width:100upx;" @focus="hcFreeKm = ''" />
-            <text style="margin-left: 20upx;font-size:30upx;">公里内免费配送</text>
-          </view>
-          <view class="action-btn">
-            <button class="btn-add" @click="addFlowerMaterial">添加</button>
-          </view>
-          <view class="material-list">
-            <view v-for="(item, index) in flowerMaterials" :key="index" class="material-item">
-              <view class="material-info">
-                <view class="info-row">
-                  <text>满</text>
-                  <input class="input-field" v-model="item.num" type="number" placeholder="0" @focus="clearItemField(item, 'num')" />
-                  <text>扎，</text>
-                  <input class="input-field" v-model="item.price" type="digit" placeholder="0" @focus="clearItemField(item, 'price')" />
-                  <text>元，</text>
-                  <input class="input-field" v-model="item.distance" type="digit" placeholder="0" @focus="clearItemField(item, 'distance')" />
-                  <text>公里内免费配送</text>
+          <view style="border: 1px solid #3385FF;margin:20upx 10upx;background-color: white;">
+            <view class="action-btn" style="margin-top:20upx;background-color: white;">
+              <text style="font-size: 30upx;font-weight: bold;">【零售-花材】跑腿费计算方式</text>
+            </view>
+            <view style="display: flex; align-items: center; margin-left:30upx;">
+              <input class="input-field" type="number" v-model="hcFreeKm" placeholder="0" style="width:100upx;" @focus="hcFreeKm = ''" />
+              <text style="margin-left: 20upx;font-size:30upx;">公里内免费配送</text>
+            </view>
+            <view class="action-btn">
+              <button class="btn-add" style="background-color: #3385FF;" @click="addFlowerMaterial">添加项</button>
+            </view>
+            <view class="material-list">
+              <view v-for="(item, index) in flowerMaterials" :key="index" class="material-item">
+                <view class="material-info">
+                  <view class="info-row">
+                    <text>满</text>
+                    <input class="input-field" v-model="item.num" type="number" placeholder="0" @focus="clearItemField(item, 'num')" />
+                    <text>扎，</text>
+                    <input class="input-field" v-model="item.price" type="digit" placeholder="0" @focus="clearItemField(item, 'price')" />
+                    <text>元，</text>
+                    <input class="input-field" v-model="item.distance" type="digit" placeholder="0" @focus="clearItemField(item, 'distance')" />
+                    <text>公里内免费配送</text>
+                  </view>
                 </view>
+                <button class="btn-delete" @click="deleteFlowerMaterial(index)">删除</button>
               </view>
-              <button class="btn-delete" @click="deleteFlowerMaterial(index)">删除</button>
             </view>
+            <view class="warning-text">如不符合以上情况的，按实际跑腿费计算</view>
           </view>
 
-          <view class="warning-text">如不符合以上情况的，按实际跑腿费计算</view>
-
-          <!-- 花材花束 -->
-          <view class="section-title" style="border-top:2upx solid #2bb931;">【零售-绿植花束】跑腿费计算方式</view>
-
-          <tui-list-cell class="line-cell" :hover="false">
-            <view class="tui-title">包运费的</view>
-            <input class="input-field" v-model="hsFreeKm" type="number" placeholder="0" @focus="hsFreeKm = ''" />
-            <view>公里内免费配送</view>
-          </tui-list-cell>
-
-          <tui-list-cell class="line-cell" :hover="false">
-            <view class="tui-title">{{hsFreeKm}}公里以上</view>
-            <view class="input-row">
-              <text>每公里加收</text>
-              <input class="input-field" v-model="hsAddFee" type="digit" placeholder="0" @focus="hsAddFee = ''" />
-              <text>元</text>
-            </view>
-          </tui-list-cell>
+          <view style="border: 1px solid #3385FF;margin:20upx 10upx;background-color: white;">
+            <view class="section-title" style="background-color: white;">【零售-绿植花束】跑腿费计算方式</view>
+            <tui-list-cell class="line-cell" :hover="false">
+              <view class="tui-title">包配送的</view>
+              <input class="input-field" v-model="hsFreeKm" type="number" placeholder="0" @focus="hsFreeKm = ''" />
+              <view>公里内免费配送</view>
+            </tui-list-cell>
+            <tui-list-cell class="line-cell" :hover="false">
+              <view class="tui-title">{{hsFreeKm}}公里以上</view>
+              <view class="input-row">
+                <text>每公里加收</text>
+                <input class="input-field" v-model="hsAddFee" type="digit" placeholder="0" @focus="hsAddFee = ''" />
+                <text>元</text>
+              </view>
+            </tui-list-cell>
+            <view class="warning-text">没有包配送的花束，按实际跑腿费计算</view>
+          </view>
 
-          <view class="warning-text">没有包运费的花束，按实际跑腿费计算</view>
         </view>
 
         <view class="confirm-btn">
@@ -456,7 +451,7 @@ export default {
     padding: 10upx 20upx;
     border-radius: 4upx;
     border: none;
-    font-size: 20upx;
+    font-size: 22upx;
   }
 }
 
@@ -493,7 +488,7 @@ export default {
     }
     
     .btn-delete {
-      background-color: #09C567;
+      background-color: #3385FF;
       color: white;
       padding: 8upx 16upx;
       border-radius: 4upx;