Skip to content

T
traceSourceMb
Commit 46e2ea18 authored by chenqikuai's avatar chenqikuai
Browse files
Options

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

parent 1f964c54
Hide whitespace changes
Inline Side-by-side
Showing with 38 additions and 31 deletions
src/views/template/components/AddOption.vue
View file @ 46e2ea18
...@@ -5,36 +5,38 @@ ...@@ -5,36 +5,38 @@
title="选择字段类型" title="选择字段类型"
left-arrow left-arrow
@click-left="onClickLeft"></van-nav-bar> @click-left="onClickLeft"></van-nav-bar>
<div <div class="content-wrapper">
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 <div
v-if="activeName === DataType.Select && item.type === DataType.Select" v-for="(item, index) in data"
style="background:rgba(246,249,255,1);margin:0 -17px;"> :key="index"
<van-swipe-cell class="item van-hairline--bottom van-hairline--top"
v-for="(option,index) in options" @click="activeName = item.type">
:key="index" <div class="item-inner">
ref="swipeCell" <div class="title"> {{item.title}}</div>
:stop-propagation="true"> <div class="desc">{{item.desc}}</div>
<div style="display:flex;flex-direction:row;align-items:center;"> <common-svg name="zidingyimoban-duigou" class="active" v-show="activeName === item.type"></common-svg>
<common-svg </div>
name="zidingyimoban-shanchu" <div
@click.native.stop="openSwipeCellRight(index)" v-if="activeName === DataType.Select && item.type === DataType.Select"
style="margin:17px;"></common-svg> style="background:rgba(246,249,255,1);margin:0 -17px;">
<van-field v-model="options[index]" label="" placeholder="输入选项名称"></van-field> <van-swipe-cell
</div> v-for="(option,index) in options"
<template #right> :key="index"
<van-button square type="danger" text="删除" @click="delOption(index)" /> ref="swipeCell"
</template> :stop-propagation="true">
</van-swipe-cell> <div style="display:flex;flex-direction:row;align-items:center;">
<div @click="addOption" style="color:#3F79FE;padding:17px;"><common-svg name="tianjia" style="margin-right:10px;"></common-svg>添加选项</div> <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> </div>
<div class="btn-group"> <div class="btn-group">
...@@ -130,12 +132,16 @@ export default class AddOption extends Vue { ...@@ -130,12 +132,16 @@ export default class AddOption extends Vue {
.add-word1{ .add-word1{
text-align: left; text-align: left;
background: #ffffff; background: #ffffff;
.content-wrapper{
height: calc(100vh - 46px);
overflow: auto;
}
.item{ .item{
padding: 0 17px; padding: 15px 17px;
.item-inner{ .item-inner{
display: grid; display: grid;
grid-template-columns: auto 27px; grid-template-columns: auto 27px;
grid-template-rows: repeat(2,30px); grid-template-rows: repeat(2, auto);
grid-auto-flow: column dense; grid-auto-flow: column dense;
place-items: center start; place-items: center start;
.active{ .active{
...@@ -145,6 +151,7 @@ export default class AddOption extends Vue { ...@@ -145,6 +151,7 @@ export default class AddOption extends Vue {
} }
.title{ .title{
color: #353535; color: #353535;
margin-bottom: 7px;
font-size: 15px; font-size: 15px;
} }
.desc{ .desc{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment