优化组件

This commit is contained in:
aixianling
2022-02-21 10:16:18 +08:00
parent cfb00174e3
commit b8aa27d5ef
2 changed files with 2 additions and 79 deletions

View File

@@ -41,12 +41,11 @@
<script>
import AiSearchPopup from './AiSearchPopup'
import AiCell from './AiCell.vue'
import {mapState} from 'vuex'
export default {
name: 'AiAreaPicker',
components: {AiCell, AiSearchPopup},
components: {AiSearchPopup},
props: {
areaId: {default: ''},
name: {default: ''},
@@ -57,7 +56,7 @@ export default {
type: Boolean,
default: false
},
isForm:Boolean
isForm: Boolean
},
computed: {
...mapState(['user']),

View File

@@ -1,76 +0,0 @@
<template>
<section class="AiCell" :class="{bottomBorder,alignCenter,topLabel}">
<div class="label" :class="{title}">
<slot v-if="$slots.label" name="label"/>
<span v-else>{{ label }}</span>
</div>
<div class="content" :class="{topLabel}">
<slot/>
</div>
</section>
</template>
<script>
export default {
name: "AiCell",
props: {
label: {default: ""},
bottomBorder: Boolean,
topLabel: Boolean,
title: Boolean,
alignCenter: Boolean
}
}
</script>
<style lang="scss" scoped>
.AiCell {
display: flex;
min-height: 72px;
font-size: 30px;
color: #333;
padding: 14px 0;
box-sizing: border-box;
justify-content: space-between;
&.bottomBorder {
border-bottom: 1px solid #eee;
}
&.alignCenter {
align-items: center;
}
&.topLabel {
flex-direction: column;
}
.label {
min-width: 60px;
flex-shrink: 0;
width: auto;
color: #999;
&.title {
color: #333;
font-weight: bold;
font-size: 34px;
}
}
.content {
flex: 1;
min-width: 100px;
min-height: 40px;
max-width: 500px;
text-align: right;
&.topLabel {
text-align: start;
margin-top: 16px;
max-width: 100%;
}
}
}
</style>