fix: 按照UI的意见修改样式

src/views/template/components/AddOption.vue

@@ -5,36 +5,38 @@
         title="选择字段类型"
         left-arrow
         @click-left="onClickLeft"></van-nav-bar>
-      <div 
-        v-for="(item, index) in data"
-        :key="index"
-        class="item van-hairline--bottom van-hairline--top" 
-        @click="activeName = item.type">
-        <div class="item-inner">
-          <div class="title"> {{item.title}}</div>
-          <div class="desc">{{item.desc}}</div>
-          <common-svg name="zidingyimoban-duigou" class="active" v-show="activeName === item.type"></common-svg>
-        </div>
+      <div class="content-wrapper">
         <div 
-          v-if="activeName === DataType.Select && item.type === DataType.Select"
-          style="background:rgba(246,249,255,1);margin:0 -17px;">
-          <van-swipe-cell 
-            v-for="(option,index) in options"
-            :key="index" 
-            ref="swipeCell"
-            :stop-propagation="true">
-            <div style="display:flex;flex-direction:row;align-items:center;">
-              <common-svg 
-                name="zidingyimoban-shanchu"
-                @click.native.stop="openSwipeCellRight(index)"
-                style="margin:17px;"></common-svg>
-              <van-field v-model="options[index]" label="" placeholder="输入选项名称"></van-field>
-            </div>
-            <template #right>
-              <van-button square type="danger" text="删除" @click="delOption(index)" />
-            </template>
-          </van-swipe-cell>
-          <div @click="addOption" style="color:#3F79FE;padding:17px;"><common-svg name="tianjia" style="margin-right:10px;"></common-svg>添加选项</div>
+          v-for="(item, index) in data"
+          :key="index"
+          class="item van-hairline--bottom van-hairline--top" 
+          @click="activeName = item.type">
+          <div class="item-inner">
+            <div class="title"> {{item.title}}</div>
+            <div class="desc">{{item.desc}}</div>
+            <common-svg name="zidingyimoban-duigou" class="active" v-show="activeName === item.type"></common-svg>
+          </div>
+          <div 
+            v-if="activeName === DataType.Select && item.type === DataType.Select"
+            style="background:rgba(246,249,255,1);margin:0 -17px;">
+            <van-swipe-cell 
+              v-for="(option,index) in options"
+              :key="index" 
+              ref="swipeCell"
+              :stop-propagation="true">
+              <div style="display:flex;flex-direction:row;align-items:center;">
+                <common-svg 
+                  name="zidingyimoban-shanchu"
+                  @click.native.stop="openSwipeCellRight(index)"
+                  style="margin:17px;"></common-svg>
+                <van-field v-model="options[index]" label="" placeholder="输入选项名称"></van-field>
+              </div>
+              <template #right>
+                <van-button square type="danger" text="删除" @click="delOption(index)" />
+              </template>
+            </van-swipe-cell>
+            <div @click="addOption" style="color:#3F79FE;padding:17px;"><common-svg name="tianjia" style="margin-right:10px;"></common-svg>添加选项</div>
+          </div>
         </div>
       </div>
       <div class="btn-group">
@@ -130,12 +132,16 @@ export default class AddOption extends Vue {
    .add-word1{
      text-align: left;
      background: #ffffff;
+     .content-wrapper{
+       height: calc(100vh - 46px);
+       overflow: auto;
+     }
      .item{
-       padding: 0 17px;
+       padding: 15px 17px;
        .item-inner{
           display: grid;
           grid-template-columns: auto 27px;
-          grid-template-rows: repeat(2,30px);
+          grid-template-rows: repeat(2, auto);
           grid-auto-flow: column dense;
           place-items: center start;
           .active{
@@ -145,6 +151,7 @@ export default class AddOption extends Vue {
           }
           .title{
             color: #353535;
+            margin-bottom: 7px;
             font-size: 15px;
           }
           .desc{