mirror of
https://gitee.com/dromara/go-view.git
synced 2025-04-06 03:58:04 +08:00
fix:新增图层处理
This commit is contained in:
parent
929bc4da9f
commit
a2a3a31df5
@ -0,0 +1,3 @@
|
|||||||
|
import ListItem from './index.vue'
|
||||||
|
|
||||||
|
export { ListItem }
|
17
src/views/chart/ContentLayers/components/ListItem/index.vue
Normal file
17
src/views/chart/ContentLayers/components/ListItem/index.vue
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
<template>
|
||||||
|
<div class="go-content-layers-list-item">
|
||||||
|
<n-space>
|
||||||
|
<div>图片</div>
|
||||||
|
<b-text>
|
||||||
|
文字
|
||||||
|
</b-text>
|
||||||
|
</n-space>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts"></script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@include go(content-layers-list-items) {
|
||||||
|
}
|
||||||
|
</style>
|
@ -11,7 +11,9 @@
|
|||||||
<component :is="LayersIcon" />
|
<component :is="LayersIcon" />
|
||||||
</n-icon>
|
</n-icon>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- 图层内容 -->
|
<!-- 图层内容 -->
|
||||||
|
<ListItem v-for="item in chartEditStore.getComponentList" :key="item.id"/>
|
||||||
</ContentBox>
|
</ContentBox>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -19,19 +21,25 @@
|
|||||||
import { ContentBox } from '../ContentBox/index'
|
import { ContentBox } from '../ContentBox/index'
|
||||||
import { useChartLayoutStore } from '@/store/modules/chartLayoutStore/chartLayoutStore'
|
import { useChartLayoutStore } from '@/store/modules/chartLayoutStore/chartLayoutStore'
|
||||||
import { ChartLayoutStoreEnum } from '@/store/modules/chartLayoutStore/chartLayoutStore.d'
|
import { ChartLayoutStoreEnum } from '@/store/modules/chartLayoutStore/chartLayoutStore.d'
|
||||||
|
import { useChartEditStoreStore } from '@/store/modules/chartEditStore/chartEditStore'
|
||||||
|
import { ListItem } from './components/ListItem/index'
|
||||||
import { icon } from '@/plugins'
|
import { icon } from '@/plugins'
|
||||||
|
|
||||||
const { LayersIcon } = icon.ionicons5
|
const { LayersIcon } = icon.ionicons5
|
||||||
const chartLayoutStore = useChartLayoutStore()
|
const chartLayoutStore = useChartLayoutStore()
|
||||||
|
|
||||||
|
const chartEditStore = useChartEditStoreStore()
|
||||||
|
|
||||||
const backHandle = () => {
|
const backHandle = () => {
|
||||||
chartLayoutStore.setItem(ChartLayoutStoreEnum.LAYERS, false)
|
chartLayoutStore.setItem(ChartLayoutStoreEnum.LAYERS, false)
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
$wight: 200px;
|
$wight: 150px;
|
||||||
@include go(content-layers) {
|
@include go(content-layers) {
|
||||||
width: $wight;
|
width: $wight;
|
||||||
|
flex-shrink: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@extend .go-transition;
|
@extend .go-transition;
|
||||||
&.scoped {
|
&.scoped {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user